@grupo-elo-editorial/shared-ui-react 1.2.7 → 1.2.10

package/CHANGELOG.md

@@ -4,6 +4,26 @@ Format: [Keep a Changelog](https://keepachangelog.com/en/1.1.0/) · Versioning:
 
 ---
 
+## [1.2.9] — 2026-05-26 (HeroCarousel — desktop aspect ratio 24:7)
+
+### Changed
+
+- **`HeroCarousel`**: desktop aspect ratio updated from `1920:700` (~2.74:1, 525px at 1440px container) to `1920:560` (24:7, ~420px at 1440px container). The previous ratio made the hero occupy ~65% of a typical laptop viewport (800px). New ratio gives 53%, leaving more content visible above the fold. Image spec updated: desktop banners should be **1920 × 560 px** instead of 1920 × 700 px.
+
+- `package.json` `version` bumped `1.2.8 → 1.2.9`.
+
+---
+
+## [1.2.8] — 2026-05-26 (HeroCarousel — mobile aspect ratio 3:2)
+
+### Changed
+
+- **`HeroCarousel`**: mobile aspect ratio updated from `5:6` (portrait, ~497px on iPhone XR) to `3:2` (~276px on iPhone XR = 31% of 896px viewport). The previous ratio made the hero occupy 55% of the screen on common phones, which was disproportionate. Tablet (`16:9`) and desktop (`1920:700`) ratios unchanged. Image spec updated: mobile banners should now be **750 × 500 px** (3:2) instead of 750 × 900 px.
+
+- `package.json` `version` bumped `1.2.7 → 1.2.8`.
+
+---
+
 ## [1.2.7] — 2026-05-26 (TopAccessibilityBar — container via design-tokens)
 
 ### Changed

package/dist/index.js

@@ -2,7 +2,7 @@
 import { clsx as Z } from "clsx";
 import { twMerge as J } from "tailwind-merge";
 import { jsx as e, jsxs as i, Fragment as _ } from "react/jsx-runtime";
-import { forwardRef as N, useState as k, useEffect as M } from "react";
+import { forwardRef as x, useState as k, useEffect as M } from "react";
 import { Loader2 as V, User as ee, Star as te, CheckIcon as U, ChevronDownIcon as A, ChevronUpIcon as ae, CircleIcon as re, ShoppingCart as R, Heart as oe, Search as Q, X as ie, Minus as ne, Plus as se, ChevronRight as W, FileX as le, Package as de, AlertCircle as ce, RefreshCw as ue, Home as me, XIcon as K, Accessibility as fe, ZoomOut as ge, ZoomIn as ve, Moon as pe, Sun as be, ChevronLeft as he, Menu as xe, ChevronDown as O, Instagram as Ne, Facebook as we, Youtube as ye, Linkedin as ke, Mail as ze } from "lucide-react";
 import { cva as L } from "class-variance-authority";
 import * as z from "@radix-ui/react-select";
@@ -45,7 +45,7 @@ const Se = L(
       size: "md"
     }
   }
-), C = N(
+), C = x(
   ({
     className: a,
     variant: t,
@@ -76,7 +76,7 @@ const Se = L(
   )
 );
 C.displayName = "Button";
-const Ie = N(
+const Ie = x(
   ({ className: a, error: t, helperText: r, ...n }, s) => /* @__PURE__ */ i("div", { className: "w-full", children: [
     /* @__PURE__ */ e(
       "textarea",
@@ -131,7 +131,7 @@ const je = L(
       size: "md"
     }
   }
-), P = N(
+), P = x(
   ({ className: a, variant: t, size: r, icon: n, onRemove: s, children: c, ...l }, m) => /* @__PURE__ */ i(
     "div",
     {
@@ -170,14 +170,14 @@ const Me = L(
       size: "md"
     }
   }
-), De = N(
+), De = x(
   ({ className: a, size: t, src: r, alt: n, name: s, showStatus: c, statusType: l = "online", ...m }, f) => {
-    const [u, v] = k(!1), g = (x) => x.split(" ").map((d) => d[0]).join("").toUpperCase().slice(0, 2), b = {
+    const [u, v] = k(!1), g = (h) => h.split(" ").map((d) => d[0]).join("").toUpperCase().slice(0, 2), b = {
       online: "bg-[var(--success)]",
       offline: "bg-[var(--muted-foreground)]",
       away: "bg-[var(--warning)]",
       busy: "bg-[var(--destructive)]"
-    }, h = {
+    }, N = {
       sm: "h-2 w-2 border",
       md: "h-2.5 w-2.5 border-2",
       lg: "h-3 w-3 border-2",
@@ -200,7 +200,7 @@ const Me = L(
           className: o(
             "absolute bottom-0 right-0 rounded-full border-[var(--background)]",
             b[l],
-            h[t || "md"]
+            N[t || "md"]
           ),
           "aria-label": `Status: ${l}`
         }
@@ -221,7 +221,7 @@ const Le = L("animate-spin text-[var(--brand-primary)]", {
   defaultVariants: {
     size: "md"
   }
-}), _e = N(
+}), _e = x(
   ({ className: a, size: t, label: r, ...n }, s) => /* @__PURE__ */ i(
     "div",
     {
@@ -238,7 +238,7 @@ const Le = L("animate-spin text-[var(--brand-primary)]", {
   )
 );
 _e.displayName = "Spinner";
-const Pe = N(
+const Pe = x(
   ({ className: a, orientation: t = "horizontal", variant: r = "solid", text: n, ...s }, c) => {
     const l = {
       solid: "border-solid",
@@ -285,7 +285,7 @@ const Pe = N(
   }
 );
 Pe.displayName = "Divider";
-const $ = N(
+const T = x(
   ({
     className: a,
     value: t = 0,
@@ -300,9 +300,9 @@ const $ = N(
       sm: "h-4 w-4",
       md: "h-5 w-5",
       lg: "h-6 w-6"
-    }, b = (x) => {
-      !s && c && c(x);
-    }, h = u || t;
+    }, b = (h) => {
+      !s && c && c(h);
+    }, N = u || t;
     return /* @__PURE__ */ i(
       "div",
       {
@@ -312,21 +312,21 @@ const $ = N(
         "aria-label": `Rating: ${t} out of ${r}`,
         ...m,
         children: [
-          /* @__PURE__ */ e("div", { className: "flex items-center gap-0.5", children: Array.from({ length: r }, (x, d) => d + 1).map((x) => {
-            const d = x <= h;
+          /* @__PURE__ */ e("div", { className: "flex items-center gap-0.5", children: Array.from({ length: r }, (h, d) => d + 1).map((h) => {
+            const d = h <= N;
             return /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
                 disabled: s,
-                onClick: () => b(x),
-                onMouseEnter: () => !s && v(x),
+                onClick: () => b(h),
+                onMouseEnter: () => !s && v(h),
                 onMouseLeave: () => !s && v(0),
                 className: o(
                   "transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-1 rounded",
                   s ? "cursor-default" : "cursor-pointer hover:scale-110"
                 ),
-                "aria-label": `Rate ${x} out of ${r}`,
+                "aria-label": `Rate ${h} out of ${r}`,
                 children: /* @__PURE__ */ e(
                   te,
                   {
@@ -338,7 +338,7 @@ const $ = N(
                   }
                 )
               },
-              x
+              h
             );
           }) }),
           l && /* @__PURE__ */ e("span", { className: "ml-1 text-sm font-medium text-[var(--foreground)]", children: t.toFixed(1) })
@@ -347,7 +347,7 @@ const $ = N(
     );
   }
 );
-$.displayName = "Rating";
+T.displayName = "Rating";
 function zt({ className: a, type: t, ...r }) {
   return /* @__PURE__ */ e(
     "input",
@@ -579,7 +579,7 @@ function H({
 }) {
   return a ? /* @__PURE__ */ e("a", { href: a, className: t, tabIndex: -1, "aria-hidden": "true", children: r }) : /* @__PURE__ */ e("div", { className: t, children: r });
 }
-const T = N(
+const $ = x(
   ({
     className: a,
     image: t,
@@ -594,8 +594,8 @@ const T = N(
     isSkeleton: v = !1,
     isOutOfStock: g = !1,
     onAddToCart: b,
-    onToggleFavorite: h,
-    isFavorite: x = !1,
+    onToggleFavorite: N,
+    isFavorite: h = !1,
     href: d,
     orientation: p = "vertical",
     ...y
@@ -615,7 +615,7 @@ const T = N(
           {
             className: o(
               "rounded-lg bg-[var(--muted)]",
-              p === "horizontal" ? "h-24 w-20 shrink-0" : "w-full aspect-2/3"
+              p === "horizontal" ? "h-24 w-20 shrink-0" : "h-55 sm:h-66.5 w-36.75 sm:w-44.25"
             )
           }
         ),
@@ -663,7 +663,7 @@ const T = N(
           ) : /* @__PURE__ */ e("h3", { className: "line-clamp-2 text-sm font-medium text-[var(--card-foreground)]", children: r }),
           n && /* @__PURE__ */ e("p", { className: "text-xs text-[var(--muted-foreground)]", children: n }),
           l !== void 0 && /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
-            /* @__PURE__ */ e($, { value: l, size: "sm", readonly: !0 }),
+            /* @__PURE__ */ e(T, { value: l, size: "sm", readonly: !0 }),
             m !== void 0 && /* @__PURE__ */ i("span", { className: "text-xs text-[var(--muted-foreground)]", children: [
               "(",
               m,
@@ -701,7 +701,7 @@ const T = N(
     {
       ref: j,
       className: o(
-        "group relative flex flex-col rounded-lg border-2 border-[var(--border)] bg-[var(--card)] transition-all hover:shadow-lg",
+        "group relative flex flex-col w-fit min-w-37.5 rounded-lg border-2 border-border bg-card transition-all hover:shadow-lg",
         g && "opacity-60",
         a
       ),
@@ -711,45 +711,33 @@ const T = N(
           H,
           {
             href: d,
-            className: "relative block w-full aspect-2/3 overflow-hidden rounded-t-lg",
+            className: "relative block h-55 sm:h-66.5 w-fit overflow-hidden rounded-t-lg",
             children: [
-              /* @__PURE__ */ e(
-                "div",
-                {
-                  "aria-hidden": "true",
-                  className: "absolute inset-0 z-0 bg-cover bg-center",
-                  style: {
-                    backgroundImage: `url(${t})`,
-                    filter: "blur(14px) brightness(0.85)",
-                    transform: "scale(1.2)"
-                  }
-                }
-              ),
               /* @__PURE__ */ e(
                 "img",
                 {
                   src: t,
                   alt: r,
-                  className: "relative z-10 h-full w-full object-contain transition-transform group-hover:scale-105"
+                  className: "h-full w-auto transition-transform group-hover:scale-105"
                 }
               ),
-              f && /* @__PURE__ */ e("div", { className: "absolute left-3 top-3 z-20", children: /* @__PURE__ */ e(P, { variant: u, children: f }) }),
-              g && /* @__PURE__ */ e("div", { className: "absolute inset-0 z-20 flex items-center justify-center bg-black/60", children: /* @__PURE__ */ e(P, { variant: "danger", size: "lg", children: "Esgotado" }) })
+              f && /* @__PURE__ */ e("div", { className: "absolute left-3 top-3", children: /* @__PURE__ */ e(P, { variant: u, children: f }) }),
+              g && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center bg-black/60", children: /* @__PURE__ */ e(P, { variant: "danger", size: "lg", children: "Esgotado" }) })
             ]
           }
         ),
-        h && /* @__PURE__ */ e(
+        N && /* @__PURE__ */ e(
           "button",
           {
-            onClick: h,
+            onClick: N,
             className: "absolute right-3 top-3 rounded-full bg-white/90 p-2 transition-all hover:bg-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]",
-            "aria-label": x ? "Remover dos favoritos" : "Adicionar aos favoritos",
+            "aria-label": h ? "Remover dos favoritos" : "Adicionar aos favoritos",
             children: /* @__PURE__ */ e(
               oe,
               {
                 className: o(
                   "h-5 w-5",
-                  x ? "fill-[var(--destructive)] text-[var(--destructive)]" : "text-[var(--foreground)]"
+                  h ? "fill-[var(--destructive)] text-[var(--destructive)]" : "text-[var(--foreground)]"
                 )
               }
             )
@@ -766,7 +754,7 @@ const T = N(
           ) : /* @__PURE__ */ e("h3", { className: "line-clamp-2 text-base font-medium text-[var(--card-foreground)]", children: r }),
           n && /* @__PURE__ */ e("p", { className: "mt-1 text-sm text-[var(--muted-foreground)]", children: n }),
           l !== void 0 && /* @__PURE__ */ i("div", { className: "mt-2 flex items-center gap-2", children: [
-            /* @__PURE__ */ e($, { value: l, size: "sm", readonly: !0 }),
+            /* @__PURE__ */ e(T, { value: l, size: "sm", readonly: !0 }),
             m !== void 0 && /* @__PURE__ */ i("span", { className: "text-sm text-[var(--muted-foreground)]", children: [
               "(",
               m,
@@ -806,8 +794,8 @@ const T = N(
     }
   )
 );
-T.displayName = "ProductCard";
-const Ee = N(
+$.displayName = "ProductCard";
+const Ee = x(
   ({
     className: a,
     onSearch: t,
@@ -819,11 +807,11 @@ const Ee = N(
     onChange: m,
     ...f
   }, u) => {
-    const [v, g] = k(""), b = l !== void 0 ? l : v, h = {
+    const [v, g] = k(""), b = l !== void 0 ? l : v, N = {
       sm: "h-9 text-sm",
       md: "h-11 text-base",
       lg: "h-14 text-lg"
-    }, x = (y) => {
+    }, h = (y) => {
       const j = y.target.value;
       l === void 0 && g(j), m == null || m(y);
     }, d = () => {
@@ -839,7 +827,7 @@ const Ee = N(
           ref: u,
           type: "search",
           value: b,
-          onChange: x,
+          onChange: h,
           onKeyDown: p,
           placeholder: c,
           className: o(
@@ -847,7 +835,7 @@ const Ee = N(
             "placeholder:text-[var(--muted-foreground)]",
             "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
             "disabled:cursor-not-allowed disabled:opacity-50",
-            h[s]
+            N[s]
           ),
           ...f
         }
@@ -869,7 +857,7 @@ const Ee = N(
   }
 );
 Ee.displayName = "SearchBar";
-const $e = N(
+const Te = x(
   ({
     className: a,
     price: t,
@@ -932,8 +920,8 @@ const $e = N(
     ] });
   }
 );
-$e.displayName = "PriceDisplay";
-const Te = N(
+Te.displayName = "PriceDisplay";
+const $e = x(
   ({
     className: a,
     value: t,
@@ -952,11 +940,11 @@ const Te = N(
     }, b = (d) => {
       const p = parseInt(d.target.value);
       !isNaN(p) && p >= r && p <= n && s(p);
-    }, h = {
+    }, N = {
       sm: "h-8 w-8",
       md: "h-10 w-10",
       lg: "h-12 w-12"
-    }, x = {
+    }, h = {
       sm: "h-8 w-12 text-sm",
       md: "h-10 w-14 text-base",
       lg: "h-12 w-16 text-lg"
@@ -972,7 +960,7 @@ const Te = N(
             size: "sm",
             onClick: g,
             disabled: l || t <= r,
-            className: o(h[c], "p-0"),
+            className: o(N[c], "p-0"),
             "aria-label": "Decrease quantity",
             children: /* @__PURE__ */ e(ne, { className: "h-4 w-4" })
           }
@@ -991,7 +979,7 @@ const Te = N(
               "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
               "disabled:cursor-not-allowed disabled:opacity-50",
               "[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none",
-              x[c]
+              h[c]
             ),
             "aria-label": "Quantity"
           }
@@ -1004,7 +992,7 @@ const Te = N(
             size: "sm",
             onClick: v,
             disabled: l || t >= n,
-            className: o(h[c], "p-0"),
+            className: o(N[c], "p-0"),
             "aria-label": "Increase quantity",
             children: /* @__PURE__ */ e(se, { className: "h-4 w-4" })
           }
@@ -1013,8 +1001,8 @@ const Te = N(
     ] });
   }
 );
-Te.displayName = "QuantitySelector";
-const Be = N(
+$e.displayName = "QuantitySelector";
+const Be = x(
   ({ className: a, label: t, htmlFor: r, required: n, error: s, helperText: c, children: l, ...m }, f) => /* @__PURE__ */ i("div", { ref: f, className: o("flex flex-col gap-1.5", a), ...m, children: [
     t && /* @__PURE__ */ i(
       "label",
@@ -1067,7 +1055,7 @@ function Et({ className: a, ...t }) {
     }
   );
 }
-function $t({
+function Tt({
   asChild: a,
   className: t,
   ...r
@@ -1081,7 +1069,7 @@ function $t({
     }
   );
 }
-function Tt({ className: a, ...t }) {
+function $t({ className: a, ...t }) {
   return /* @__PURE__ */ e(
     "span",
     {
@@ -1211,7 +1199,7 @@ function Qt({
     }
   ) });
 }
-const Fe = N(
+const Fe = x(
   ({
     className: a,
     variant: t = "default",
@@ -1319,7 +1307,7 @@ const Fe = N(
   )
 );
 Fe.displayName = "Hero";
-const X = N(
+const X = x(
   ({
     className: a,
     variant: t = "default",
@@ -1364,7 +1352,7 @@ const X = N(
   }
 );
 X.displayName = "EmptyState";
-const qe = N(
+const qe = x(
   ({
     className: a,
     type: t = "generic",
@@ -1397,7 +1385,7 @@ const qe = N(
         message: "Ocorreu um erro inesperado. Por favor, tente novamente.",
         code: ""
       }
-    }[t], b = r || g.title, h = n || g.message;
+    }[t], b = r || g.title, N = n || g.message;
     return /* @__PURE__ */ i(
       "div",
       {
@@ -1415,7 +1403,7 @@ const qe = N(
             /* @__PURE__ */ e("div", { className: "rounded-full bg-[var(--destructive)]/10 p-6 text-[var(--destructive)]", children: /* @__PURE__ */ e(ce, { className: "h-16 w-16" }) })
           ] }),
           /* @__PURE__ */ e("h2", { className: "mt-6 text-2xl font-bold text-[var(--foreground)]", children: b }),
-          /* @__PURE__ */ e("p", { className: "mt-2 max-w-md text-[var(--muted-foreground)]", children: h }),
+          /* @__PURE__ */ e("p", { className: "mt-2 max-w-md text-[var(--muted-foreground)]", children: N }),
           /* @__PURE__ */ i("div", { className: "mt-8 flex flex-wrap gap-4 justify-center", children: [
             l && s && /* @__PURE__ */ e(
               C,
@@ -1444,7 +1432,7 @@ const qe = N(
   }
 );
 qe.displayName = "ErrorState";
-const He = N(
+const He = x(
   ({
     className: a,
     products: t,
@@ -1457,11 +1445,6 @@ const He = N(
     ...f
   }, u) => {
     const v = {
-      2: "grid-cols-1 sm:grid-cols-2",
-      3: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
-      4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4",
-      5: "grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5"
-    }, g = {
       sm: "gap-4",
       md: "gap-6",
       lg: "gap-8"
@@ -1471,21 +1454,20 @@ const He = N(
       {
         ref: u,
         className: o(
-          "grid",
-          v[r],
-          g[n],
+          "flex flex-wrap",
+          v[n],
           a
         ),
         ...f,
-        children: Array.from({ length: c }).map((b, h) => /* @__PURE__ */ e(
-          T,
+        children: Array.from({ length: c }).map((g, b) => /* @__PURE__ */ e(
+          $,
           {
             image: "",
             title: "",
             price: 0,
             isSkeleton: !0
           },
-          h
+          b
         ))
       }
     ) : t.length === 0 ? /* @__PURE__ */ e(
@@ -1504,13 +1486,12 @@ const He = N(
       {
         ref: u,
         className: o(
-          "grid",
-          v[r],
-          g[n],
+          "flex flex-wrap",
+          v[n],
           a
         ),
         ...f,
-        children: t.map((b, h) => /* @__PURE__ */ e(T, { ...b }, h))
+        children: t.map((g, b) => /* @__PURE__ */ e($, { ...g }, b))
       }
     );
   }
@@ -1746,7 +1727,7 @@ function et({ children: a, as: t = "div", className: r }) {
     }
   );
 }
-const tt = N(
+const tt = x(
   ({ className: a, onThemeChange: t, onFontSizeChange: r, showA11yLink: n = !1, ...s }, c) => {
     const [l, m] = k("light"), [f, u] = k(16), [v, g] = k(!1);
     M(() => {
@@ -1765,10 +1746,10 @@ const tt = N(
     const b = () => {
       const d = l === "light" ? "dark" : "light";
       m(d), document.documentElement.setAttribute("data-theme", d), localStorage.setItem("a11y-theme", d), t == null || t(d);
-    }, h = () => {
+    }, N = () => {
       const d = Math.min(f + 2, 24);
       u(d), document.documentElement.style.setProperty("--font-size", `${d}px`), document.documentElement.style.fontSize = `${d}px`, localStorage.setItem("a11y-font-size", d.toString()), r == null || r(d);
-    }, x = () => {
+    }, h = () => {
       const d = Math.max(f - 2, 12);
       u(d), document.documentElement.style.setProperty("--font-size", `${d}px`), document.documentElement.style.fontSize = `${d}px`, localStorage.setItem("a11y-font-size", d.toString()), r == null || r(d);
     };
@@ -1802,7 +1783,7 @@ const tt = N(
                 "button",
                 {
                   type: "button",
-                  onClick: x,
+                  onClick: h,
                   disabled: f <= 12,
                   "aria-label": "Diminuir tamanho da fonte",
                   className: o(
@@ -1818,7 +1799,7 @@ const tt = N(
                 "button",
                 {
                   type: "button",
-                  onClick: h,
+                  onClick: N,
                   disabled: f >= 24,
                   "aria-label": "Aumentar tamanho da fonte",
                   className: o(
@@ -1869,7 +1850,7 @@ const tt = N(
   }
 );
 tt.displayName = "TopAccessibilityBar";
-const at = N(
+const at = x(
   ({
     className: a,
     slides: t,
@@ -1894,9 +1875,9 @@ const at = N(
     }, [n, r, t.length, f, v]);
     const b = (d) => {
       m(d), u(!0), setTimeout(() => u(!1), r);
-    }, h = () => {
+    }, N = () => {
       b((l - 1 + t.length) % t.length);
-    }, x = () => {
+    }, h = () => {
       b((l + 1) % t.length);
     };
     return t.length === 0 ? null : (t[l], /* @__PURE__ */ i(
@@ -1938,7 +1919,7 @@ const at = N(
                       src: d.imageMobile,
                       srcSet: `${d.imageMobile} 1x, ${d.imageMobile.replace(/\.(jpg|png)$/, "@2x.$1")} 2x`,
                       alt: d.title,
-                      className: "w-full object-cover aspect-[5/6] md:aspect-video lg:aspect-[1920/700]",
+                      className: "w-full object-cover aspect-3/2 md:aspect-video lg:aspect-1920/560",
                       loading: p === 0 ? "eager" : "lazy"
                     }
                   )
@@ -1963,7 +1944,7 @@ const at = N(
             /* @__PURE__ */ e(
               "button",
               {
-                onClick: h,
+                onClick: N,
                 className: "absolute left-4 top-1/2 -translate-y-1/2 rounded-full bg-white/90 p-2 shadow-lg transition-all hover:bg-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] min-w-[44px] min-h-[44px]",
                 "aria-label": "Slide anterior",
                 children: /* @__PURE__ */ e(he, { className: "h-6 w-6 text-gray-900" })
@@ -1972,7 +1953,7 @@ const at = N(
             /* @__PURE__ */ e(
               "button",
               {
-                onClick: x,
+                onClick: h,
                 className: "absolute right-4 top-1/2 -translate-y-1/2 rounded-full bg-white/90 p-2 shadow-lg transition-all hover:bg-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] min-w-[44px] min-h-[44px]",
                 "aria-label": "Próximo slide",
                 children: /* @__PURE__ */ e(W, { className: "h-6 w-6 text-gray-900" })
@@ -2217,7 +2198,7 @@ function Y({ item: a, depth: t = 0 }) {
     )
   ] });
 }
-const ct = N(
+const ct = x(
   ({ items: a, logo: t, rightSlot: r, searchSlot: n, drawerFooter: s, className: c, ...l }, m) => /* @__PURE__ */ e(
     "header",
     {
@@ -2509,9 +2490,9 @@ export {
   P as Badge,
   At as Breadcrumb,
   Et as BreadcrumbItem,
-  $t as BreadcrumbLink,
+  Tt as BreadcrumbLink,
   Rt as BreadcrumbList,
-  Tt as BreadcrumbPage,
+  $t as BreadcrumbPage,
   Bt as BreadcrumbSeparator,
   C as Button,
   Dt as Checkbox,
@@ -2535,14 +2516,14 @@ export {
   zt as Input,
   ct as MegaMenu,
   Wt as Modal,
-  $e as PriceDisplay,
-  T as ProductCard,
+  Te as PriceDisplay,
+  $ as ProductCard,
   He as ProductGrid,
   la as ProgressBar,
-  Te as QuantitySelector,
+  $e as QuantitySelector,
   Lt as RadioGroup,
   _t as RadioGroupItem,
-  $ as Rating,
+  T as Rating,
   Ee as SearchBar,
   Ct as Select,
   jt as SelectContent,