Component Anchor for create links

deco-sites · Jun 14, 2023 · 24fb74d · 24fb74d · deno-deploy · Jun 14, 2023
1 parent 9dc98a3
commit 24fb74d
Show file tree

Hide file tree

Showing 6 changed files with 58 additions and 14 deletions.
diff --git a/components/header/Alert.tsx b/components/header/Alert.tsx
@@ -1,4 +1,5 @@
 import Slider from "$store/components/ui/Slider.tsx";
+import Anchor from "$store/components/ui/Anchor.tsx";
 import SliderJS from "$store/islands/SliderJS.tsx";
 import { useId } from "preact/hooks";
 
@@ -20,7 +21,14 @@ function Alert({ alerts = [], interval = 5 }: Props) {
         {alerts.map((alert, index) => (
           <Slider.Item index={index} class="carousel-item">
             <span class="text-sm text-secondary-content flex justify-center items-center w-screen h-[38px]">
-              {alert}
+              <Anchor
+                href="/"
+                class="flex-grow inline-flex items-center"
+                aria-label="Alertas"
+                target="_blank"
+              >
+                {alert}
+              </Anchor>
             </span>
           </Slider.Item>
         ))}

diff --git a/components/header/Navbar.tsx b/components/header/Navbar.tsx
@@ -1,6 +1,7 @@
 import Searchbar from "$store/islands/HeaderSearchbar.tsx";
 import Buttons from "$store/islands/HeaderButton.tsx";
 import Icon from "$store/components/ui/Icon.tsx";
+import Anchor from "$store/components/ui/Anchor.tsx";
 import NavItem from "./NavItem.tsx";
 import { navbarHeight } from "./constants.ts";
 import type { INavItem } from "./NavItem.tsx";
@@ -19,14 +20,15 @@ function Navbar({ items, searchbar }: {
       >
         <Buttons variant="menu" />
 
-        <a
+        <Anchor
           href="/"
           class="flex-grow inline-flex items-center"
           style={{ minHeight: navbarHeight }}
           aria-label="Store logo"
+          target="_blank"
         >
           <Icon id="Logo" width={126} height={16} />
-        </a>
+        </Anchor>
 
         <div class="flex gap-1">
           <Buttons variant="search" />

diff --git a/components/ui/Anchor.tsx b/components/ui/Anchor.tsx
@@ -0,0 +1,33 @@
+import { forwardRef } from "preact/compat";
+import type { JSX } from "preact";
+
+export type Props =
+  & Omit<JSX.IntrinsicElements["a"], "loading">
+  & {
+    loading?: boolean;
+    href?: string;
+    title?: string;
+    label?: string;
+    target: string;
+  };
+
+const Anchor = forwardRef<HTMLAnchorElement, Props>(({
+  type = "a",
+  class: _class = "",
+  loading,
+  disabled,
+  children,
+  ...props
+}, ref) => (
+  <a
+    {...props}
+    className={`hover:underline text-sm flex gap-4${_class}`}
+    disabled={disabled || loading}
+    type={type}
+    ref={ref}
+  >
+    {loading ? <span class="loading loading-spinner" /> : children}
+  </a>
+));
+
+export default Anchor;
diff --git a/import_map.json b/import_map.json
@@ -1,11 +1,10 @@
 {
   "imports": {
     "deco-sites/intimissimi/": "./",
-
     "deco-sites/fashion/": "./",
     "$store/": "./",
     "deco-sites/std/": "https://denopkg.com/deco-sites/std@1.9.29/",
-    "$live/": "https://denopkg.com/deco-cx/live@1.9.15/",
+    "$live/": "https://denopkg.com/deco-cx/live@1.9.17/",
     "$fresh/": "https://denopkg.com/deco-cx/fresh@1.3.0/",
     "preact": "https://esm.sh/preact@10.15.1",
     "preact/": "https://esm.sh/preact@10.15.1/",
@@ -16,4 +15,4 @@
     "partytown/": "https://denopkg.com/deco-cx/partytown@0.3.0/",
     "daisyui": "npm:daisyui@3.0.3"
   }
-}
+}
diff --git a/live.gen.ts b/live.gen.ts
@@ -201,8 +201,10 @@ const manifest = {
     "deco-sites/intimissimi/sections/Images/ShoppableBanner.tsx": $$$$$$$$4,
     "deco-sites/intimissimi/sections/Links/LinkTree.tsx": $$$$$$$$20,
     "deco-sites/intimissimi/sections/Links/Shortcuts.tsx": $$$$$$$$21,
-    "deco-sites/intimissimi/sections/Miscellaneous/CampaignTimer.tsx": $$$$$$$$16,
-    "deco-sites/intimissimi/sections/Miscellaneous/CookieConsent.tsx": $$$$$$$$17,
+    "deco-sites/intimissimi/sections/Miscellaneous/CampaignTimer.tsx":
+      $$$$$$$$16,
+    "deco-sites/intimissimi/sections/Miscellaneous/CookieConsent.tsx":
+      $$$$$$$$17,
     "deco-sites/intimissimi/sections/Newsletter/Newsletter.tsx": $$$$$$$$22,
     "deco-sites/intimissimi/sections/Product/ProductDetails.tsx": $$$$$$$$15,
     "deco-sites/intimissimi/sections/Product/ProductShelf.tsx": $$$$$$$$14,

diff --git a/schemas.gen.json b/schemas.gen.json
@@ -8210,7 +8210,7 @@
       "required": [],
       "title": "OptionalColors"
     },
-    "ZGVjby1zaXRlcy9pbnRpbWlzc2ltaS9zZWN0aW9ucy9EZXNpZ25TeXN0ZW0vRGVzaWduU3lzdGVtLnRzeA==@696524a6ff9e8fdff928f109587791e1&Colors": {
+    "ZGVjby1zaXRlcy9pbnRpbWlzc2ltaS9zZWN0aW9ucy9EZXNpZ25TeXN0ZW0vRGVzaWduU3lzdGVtLnRzeA==@425790340007221b61134a9094812da9&Colors": {
       "allOf": [
         {
           "$ref": "#/definitions/ZGVjby1zaXRlcy9pbnRpbWlzc2ltaS9zZWN0aW9ucy9EZXNpZ25TeXN0ZW0vRGVzaWduU3lzdGVtLnRzeA==@Colors"
@@ -8226,7 +8226,7 @@
           "required": []
         }
       ],
-      "title": "696524a6ff9e8fdff928f109587791e1&Colors"
+      "title": "425790340007221b61134a9094812da9&Colors"
     },
     "ZGVjby1zaXRlcy9pbnRpbWlzc2ltaS9zZWN0aW9ucy9EZXNpZ25TeXN0ZW0vRGVzaWduU3lzdGVtLnRzeA==@Miscellaneous": {
       "type": "object",
@@ -8329,7 +8329,7 @@
       "type": "object",
       "properties": {
         "colors": {
-          "$ref": "#/definitions/ZGVjby1zaXRlcy9pbnRpbWlzc2ltaS9zZWN0aW9ucy9EZXNpZ25TeXN0ZW0vRGVzaWduU3lzdGVtLnRzeA==@696524a6ff9e8fdff928f109587791e1&Colors",
+          "$ref": "#/definitions/ZGVjby1zaXRlcy9pbnRpbWlzc2ltaS9zZWN0aW9ucy9EZXNpZ25TeXN0ZW0vRGVzaWduU3lzdGVtLnRzeA==@425790340007221b61134a9094812da9&Colors",
           "title": "Colors"
         },
         "miscellaneous": {
@@ -10990,7 +10990,7 @@
       ],
       "title": "WorkflowRef"
     },
-    "ZGVjby1jeC9saXZlL2FjdGlvbnMvd29ya2Zsb3dzL3N0YXJ0LnRz@334b1e8b1a9b72929b472c12d844039f|WorkflowRef": {
+    "ZGVjby1jeC9saXZlL2FjdGlvbnMvd29ya2Zsb3dzL3N0YXJ0LnRz@2dc3ea494e366f0c07f2bf4cd27907ef|WorkflowRef": {
       "anyOf": [
         {
           "$ref": "#/definitions/ZGVjby1jeC9saXZlL2FjdGlvbnMvd29ya2Zsb3dzL3N0YXJ0LnRz@WorkflowRef"
@@ -11008,13 +11008,13 @@
           ]
         }
       ],
-      "title": "334b1e8b1a9b72929b472c12d844039f|WorkflowRef"
+      "title": "2dc3ea494e366f0c07f2bf4cd27907ef|WorkflowRef"
     },
     "ZGVjby1jeC9saXZlL2FjdGlvbnMvd29ya2Zsb3dzL3N0YXJ0LnRz@Props": {
       "type": "object",
       "properties": {
         "workflow": {
-          "$ref": "#/definitions/ZGVjby1jeC9saXZlL2FjdGlvbnMvd29ya2Zsb3dzL3N0YXJ0LnRz@334b1e8b1a9b72929b472c12d844039f|WorkflowRef",
+          "$ref": "#/definitions/ZGVjby1jeC9saXZlL2FjdGlvbnMvd29ya2Zsb3dzL3N0YXJ0LnRz@2dc3ea494e366f0c07f2bf4cd27907ef|WorkflowRef",
           "title": "Workflow"
         },
         "id": {