@grupo-elo-editorial/shared-ui-react 1.2.1 → 1.2.3

package/CHANGELOG.md

@@ -4,6 +4,30 @@ Format: [Keep a Changelog](https://keepachangelog.com/en/1.1.0/) · Versioning:
 
 ---
 
+## [1.2.3] — 2026-05-25 (HeroCarousel — overlay de texto configurável por slide)
+
+### Added
+
+- **`HeroSlide.showOverlay`** (`boolean`, default `false`): quando `true`, renderiza um overlay gradiente sobre a imagem com `title`, `description` e `cta` do slide. Permite que banners com imagem neutra exibam texto dinâmico; banners com artwork que já contém o texto continuam com `showOverlay: false` (comportamento padrão inalterado).
+
+### Changed
+
+- `package.json` `version` bumped `1.2.2 → 1.2.3`.
+
+---
+
+## [1.2.2] — 2026-05-25 (HeroCarousel — remove text overlay)
+
+### Fixed
+
+- **`HeroCarousel`**: removed the text/CTA overlay rendered on top of banner images (gradient backdrop, `<h2>` title, `<p>` description, and anchor CTA). Banner artwork is now displayed clean — textual content is part of the image itself. The `title` prop is preserved as `alt` text on the `<img>` for accessibility.
+
+### Changed
+
+- `package.json` `version` bumped `1.2.1 → 1.2.2`.
+
+---
+
 ## [1.2.1] — 2026-05-24 (Hotfix — exports.development leaking into published tarball)
 
 ### Fixed

package/dist/components/prd/HeroCarousel.d.ts

@@ -6,6 +6,8 @@ export interface HeroSlide {
     imageMobile: string;
     imageTablet: string;
     imageDesktop: string;
+    /** Exibe título, descrição e CTA sobrepostos na imagem. Default false. */
+    showOverlay?: boolean;
     cta?: {
         label: string;
         href: string;

package/dist/index.js

@@ -1,15 +1,15 @@
 "use client";
-import { clsx as J } from "clsx";
-import { twMerge as ee } from "tailwind-merge";
+import { clsx as Z } from "clsx";
+import { twMerge as J } from "tailwind-merge";
 import { jsx as e, jsxs as i, Fragment as A } from "react/jsx-runtime";
 import { forwardRef as N, useState as k, useEffect as M } from "react";
-import { Loader2 as V, User as te, Star as ae, CheckIcon as U, ChevronDownIcon as E, ChevronUpIcon as re, CircleIcon as oe, ShoppingCart as L, Heart as ie, Search as Q, X as ne, Minus as se, Plus as le, ChevronRight as W, FileX as de, Package as ce, AlertCircle as ue, RefreshCw as me, Home as fe, XIcon as K, Accessibility as ge, ZoomOut as ve, ZoomIn as pe, Moon as be, Sun as he, ChevronLeft as xe, Menu as Ne, ChevronDown as O, Instagram as we, Facebook as ye, Youtube as ke, Linkedin as ze, Mail as Ce } from "lucide-react";
+import { Loader2 as V, User as ee, Star as te, CheckIcon as U, ChevronDownIcon as E, ChevronUpIcon as ae, CircleIcon as re, ShoppingCart as L, 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 P } from "class-variance-authority";
 import * as z from "@radix-ui/react-select";
 import * as F from "@radix-ui/react-checkbox";
 import * as T from "@radix-ui/react-radio-group";
 import * as q from "@radix-ui/react-switch";
-import { Slot as Se } from "@radix-ui/react-slot";
+import { Slot as Ce } from "@radix-ui/react-slot";
 import * as _ from "@radix-ui/react-accordion";
 import * as I from "@radix-ui/react-tooltip";
 import { toast as na } from "sonner";
@@ -17,9 +17,9 @@ import { Progress as la } from "@radix-ui/react-progress";
 import * as w from "@radix-ui/react-dialog";
 import * as S from "@radix-ui/react-navigation-menu";
 function o(...a) {
-  return ee(J(a));
+  return J(Z(a));
 }
-const X = P(
+const Se = P(
   "inline-flex items-center justify-center gap-2 rounded-lg font-medium transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 whitespace-nowrap",
   {
     variants: {
@@ -60,7 +60,7 @@ const X = P(
   }, v) => /* @__PURE__ */ e(
     "button",
     {
-      className: o(X({ variant: t, size: r, fullWidth: n, className: a })),
+      className: o(Se({ variant: t, size: r, fullWidth: n, className: a })),
       ref: v,
       disabled: f || s,
       ...u,
@@ -193,7 +193,7 @@ const Me = P(
           className: "h-full w-full object-cover",
           ...m
         }
-      ) : s ? /* @__PURE__ */ e("span", { className: "font-medium", children: g(s) }) : /* @__PURE__ */ e(te, { className: "h-1/2 w-1/2" }),
+      ) : s ? /* @__PURE__ */ e("span", { className: "font-medium", children: g(s) }) : /* @__PURE__ */ e(ee, { className: "h-1/2 w-1/2" }),
       c && /* @__PURE__ */ e(
         "span",
         {
@@ -328,7 +328,7 @@ const $ = N(
                 ),
                 "aria-label": `Rate ${x} out of ${r}`,
                 children: /* @__PURE__ */ e(
-                  ae,
+                  te,
                   {
                     className: o(
                       g[n],
@@ -465,7 +465,7 @@ function Ee({
         a
       ),
       ...t,
-      children: /* @__PURE__ */ e(re, { className: "size-4" })
+      children: /* @__PURE__ */ e(ae, { className: "size-4" })
     }
   );
 }
@@ -541,7 +541,7 @@ function Pt({
         {
           "data-slot": "radio-group-indicator",
           className: "relative flex items-center justify-center",
-          children: /* @__PURE__ */ e(oe, { className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" })
+          children: /* @__PURE__ */ e(re, { className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" })
         }
       )
     }
@@ -733,7 +733,7 @@ const R = 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",
             children: /* @__PURE__ */ e(
-              ie,
+              oe,
               {
                 className: o(
                   "h-5 w-5",
@@ -849,7 +849,7 @@ const Te = N(
             onClick: d,
             className: "rounded-full p-1 hover:bg-[var(--muted)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]",
             "aria-label": "Clear search",
-            children: /* @__PURE__ */ e(ne, { className: "h-4 w-4 text-[var(--muted-foreground)]" })
+            children: /* @__PURE__ */ e(ie, { className: "h-4 w-4 text-[var(--muted-foreground)]" })
           }
         )
       ] })
@@ -962,7 +962,7 @@ const Re = N(
             disabled: l || t <= r,
             className: o(h[c], "p-0"),
             "aria-label": "Decrease quantity",
-            children: /* @__PURE__ */ e(se, { className: "h-4 w-4" })
+            children: /* @__PURE__ */ e(ne, { className: "h-4 w-4" })
           }
         ),
         /* @__PURE__ */ e(
@@ -994,7 +994,7 @@ const Re = N(
             disabled: l || t >= n,
             className: o(h[c], "p-0"),
             "aria-label": "Increase quantity",
-            children: /* @__PURE__ */ e(le, { className: "h-4 w-4" })
+            children: /* @__PURE__ */ e(se, { className: "h-4 w-4" })
           }
         )
       ] })
@@ -1061,7 +1061,7 @@ function Tt({
   ...r
 }) {
   return /* @__PURE__ */ e(
-    a ? Se : "a",
+    a ? Ce : "a",
     {
       "data-slot": "breadcrumb-link",
       className: o("hover:text-foreground transition-colors", t),
@@ -1307,7 +1307,7 @@ const Fe = N(
   )
 );
 Fe.displayName = "Hero";
-const Y = N(
+const X = N(
   ({
     className: a,
     variant: t = "default",
@@ -1318,10 +1318,10 @@ const Y = N(
     ...l
   }, m) => {
     const u = r || {
-      default: /* @__PURE__ */ e(ce, { className: "h-16 w-16" }),
+      default: /* @__PURE__ */ e(de, { className: "h-16 w-16" }),
       search: /* @__PURE__ */ e(Q, { className: "h-16 w-16" }),
       cart: /* @__PURE__ */ e(L, { className: "h-16 w-16" }),
-      error: /* @__PURE__ */ e(de, { className: "h-16 w-16" })
+      error: /* @__PURE__ */ e(le, { className: "h-16 w-16" })
     }[t];
     return /* @__PURE__ */ i(
       "div",
@@ -1351,7 +1351,7 @@ const Y = N(
     );
   }
 );
-Y.displayName = "EmptyState";
+X.displayName = "EmptyState";
 const qe = N(
   ({
     className: a,
@@ -1400,7 +1400,7 @@ const qe = N(
         children: [
           /* @__PURE__ */ i("div", { className: "flex flex-col items-center gap-4", children: [
             g.code && /* @__PURE__ */ e("h1", { className: "text-9xl font-bold text-[var(--muted)] opacity-40", children: g.code }),
-            /* @__PURE__ */ e("div", { className: "rounded-full bg-[var(--destructive)]/10 p-6 text-[var(--destructive)]", children: /* @__PURE__ */ e(ue, { className: "h-16 w-16" }) })
+            /* @__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 }),
@@ -1411,7 +1411,7 @@ const qe = N(
                 onClick: s,
                 variant: "primary",
                 size: "lg",
-                leftIcon: /* @__PURE__ */ e(me, { className: "h-5 w-5" }),
+                leftIcon: /* @__PURE__ */ e(ue, { className: "h-5 w-5" }),
                 children: "Tentar novamente"
               }
             ),
@@ -1421,7 +1421,7 @@ const qe = N(
                 onClick: c,
                 variant: "secondary",
                 size: "lg",
-                leftIcon: /* @__PURE__ */ e(fe, { className: "h-5 w-5" }),
+                leftIcon: /* @__PURE__ */ e(me, { className: "h-5 w-5" }),
                 children: "Voltar ao início"
               }
             )
@@ -1477,7 +1477,7 @@ const He = N(
         ))
       }
     ) : t.length === 0 ? /* @__PURE__ */ e(
-      Y,
+      X,
       {
         variant: "search",
         title: l,
@@ -1762,7 +1762,7 @@ const et = N(
         ...s,
         children: /* @__PURE__ */ i("div", { className: "mx-auto max-w-7xl px-4 py-2 flex items-center justify-between", children: [
           /* @__PURE__ */ i("div", { className: "flex items-center gap-2 text-sm text-[var(--muted-foreground)]", children: [
-            /* @__PURE__ */ e(ge, { className: "h-4 w-4 flex-shrink-0", "aria-hidden": "true" }),
+            /* @__PURE__ */ e(fe, { className: "h-4 w-4 flex-shrink-0", "aria-hidden": "true" }),
             /* @__PURE__ */ e("span", { className: "hidden sm:inline", children: "Ferramentas de Acessibilidade" })
           ] }),
           /* @__PURE__ */ i("div", { className: "flex items-center gap-2 md:gap-4", children: [
@@ -1787,7 +1787,7 @@ const et = N(
                     "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]",
                     "disabled:opacity-40 disabled:cursor-not-allowed"
                   ),
-                  children: /* @__PURE__ */ e(ve, { className: "h-4 w-4" })
+                  children: /* @__PURE__ */ e(ge, { className: "h-4 w-4" })
                 }
               ),
               /* @__PURE__ */ e("span", { className: "text-xs text-[var(--muted-foreground)] w-3 text-center select-none", "aria-hidden": "true", children: "A" }),
@@ -1803,7 +1803,7 @@ const et = N(
                     "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]",
                     "disabled:opacity-40 disabled:cursor-not-allowed"
                   ),
-                  children: /* @__PURE__ */ e(pe, { className: "h-4 w-4" })
+                  children: /* @__PURE__ */ e(ve, { className: "h-4 w-4" })
                 }
               )
             ] }),
@@ -1817,7 +1817,7 @@ const et = N(
                   "p-2 rounded-md transition-colors text-[var(--muted-foreground)] hover:bg-[var(--muted)]",
                   "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]"
                 ),
-                children: l === "light" ? /* @__PURE__ */ e(be, { className: "h-4 w-4" }) : /* @__PURE__ */ e(he, { className: "h-4 w-4" })
+                children: l === "light" ? /* @__PURE__ */ e(pe, { className: "h-4 w-4" }) : /* @__PURE__ */ e(be, { className: "h-4 w-4" })
               }
             ),
             /* @__PURE__ */ e(
@@ -1920,18 +1920,18 @@ const tt = N(
                     }
                   )
                 ] }),
-                /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center md:justify-start bg-gradient-to-t from-black/70 via-black/30 to-transparent md:bg-gradient-to-r md:from-black/80 md:via-black/50 md:to-transparent", children: /* @__PURE__ */ e("div", { className: "max-w-7xl mx-auto px-6 lg:px-12 w-full", children: /* @__PURE__ */ i("div", { className: "max-w-2xl text-center md:text-left", children: [
-                  /* @__PURE__ */ e("h2", { className: "text-3xl md:text-4xl lg:text-5xl font-bold text-white mb-4", children: d.title }),
-                  /* @__PURE__ */ e("p", { className: "text-lg md:text-xl text-gray-200 mb-6", children: d.description }),
+                d.showOverlay && /* @__PURE__ */ i("div", { className: "absolute inset-0 flex flex-col justify-end bg-linear-to-t from-black/60 to-transparent p-6 md:p-10", children: [
+                  /* @__PURE__ */ e("h2", { className: "text-2xl font-bold text-white md:text-3xl", children: d.title }),
+                  d.description && /* @__PURE__ */ e("p", { className: "mt-2 text-sm text-gray-200 md:text-base", children: d.description }),
                   d.cta && /* @__PURE__ */ e(
                     "a",
                     {
                       href: d.cta.href,
-                      className: X({ variant: "primary", size: "lg" }),
+                      className: "mt-4 inline-block self-start rounded-md bg-brand-primary px-5 py-2 text-sm font-semibold text-white transition hover:opacity-90",
                       children: d.cta.label
                     }
                   )
-                ] }) }) })
+                ] })
               ]
             },
             d.id
@@ -1943,7 +1943,7 @@ const tt = N(
                 onClick: h,
                 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(xe, { className: "h-6 w-6 text-gray-900" })
+                children: /* @__PURE__ */ e(he, { className: "h-6 w-6 text-gray-900" })
               }
             ),
             /* @__PURE__ */ e(
@@ -2144,7 +2144,7 @@ function lt({ items: a }) {
     }
   ) });
 }
-function Z({ item: a, depth: t = 0 }) {
+function Y({ item: a, depth: t = 0 }) {
   var c;
   const [r, n] = k(!1);
   return !((c = a.children) != null && c.length) ? /* @__PURE__ */ e(Ke, { asChild: !0, children: /* @__PURE__ */ e(
@@ -2189,7 +2189,7 @@ function Z({ item: a, depth: t = 0 }) {
       {
         id: `mobile-nav-${a.id}`,
         className: "mb-1 ml-2 border-l-2 border-[var(--border)] pl-3",
-        children: a.children.map((l) => /* @__PURE__ */ e(Z, { item: l, depth: t + 1 }, l.id))
+        children: a.children.map((l) => /* @__PURE__ */ e(Y, { item: l, depth: t + 1 }, l.id))
       }
     )
   ] });
@@ -2217,7 +2217,7 @@ const dt = N(
                 type: "button",
                 "aria-label": "Abrir menu de navegação",
                 className: "inline-flex min-h-[44px] min-w-[44px] items-center justify-center rounded-lg text-[var(--foreground)] transition-colors hover:bg-[var(--accent)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] md:hidden",
-                children: /* @__PURE__ */ e(Ne, { className: "h-5 w-5", "aria-hidden": "true" })
+                children: /* @__PURE__ */ e(xe, { className: "h-5 w-5", "aria-hidden": "true" })
               }
             ) }),
             /* @__PURE__ */ i(Ye, { side: "left", className: "flex flex-col p-0", children: [
@@ -2231,7 +2231,7 @@ const dt = N(
                 {
                   "aria-label": "Menu principal",
                   className: "flex-1 overflow-y-auto px-5 py-3",
-                  children: /* @__PURE__ */ e("div", { className: "divide-y divide-[var(--border)]", children: a.map((f) => /* @__PURE__ */ e("div", { className: "py-0.5", children: /* @__PURE__ */ e(Z, { item: f }) }, f.id)) })
+                  children: /* @__PURE__ */ e("div", { className: "divide-y divide-[var(--border)]", children: a.map((f) => /* @__PURE__ */ e("div", { className: "py-0.5", children: /* @__PURE__ */ e(Y, { item: f }) }, f.id)) })
                 }
               ),
               s && /* @__PURE__ */ e("div", { className: "border-t border-[var(--border)] px-5 py-4", children: s })
@@ -2300,15 +2300,15 @@ const ct = [
     ]
   }
 ], ut = [
-  { label: "Instagram", href: "https://instagram.com/eloeditora", Icon: we },
-  { label: "Facebook", href: "https://facebook.com/eloeditora", Icon: ye },
-  { label: "YouTube", href: "https://youtube.com/@eloeditora", Icon: ke },
-  { label: "LinkedIn", href: "https://linkedin.com/company/eloeditora", Icon: ze }
+  { label: "Instagram", href: "https://instagram.com/eloeditora", Icon: Ne },
+  { label: "Facebook", href: "https://facebook.com/eloeditora", Icon: we },
+  { label: "YouTube", href: "https://youtube.com/@eloeditora", Icon: ye },
+  { label: "LinkedIn", href: "https://linkedin.com/company/eloeditora", Icon: ke }
 ];
 function mt({ onSubmit: a }) {
   const [t, r] = k(""), [n, s] = k(!1);
   return /* @__PURE__ */ e("div", { className: "bg-[var(--brand-primary)] py-10", children: /* @__PURE__ */ i("div", { className: "mx-auto max-w-lg px-4 text-center", children: [
-    /* @__PURE__ */ e(Ce, { className: "mx-auto mb-4 h-10 w-10 text-white", "aria-hidden": "true" }),
+    /* @__PURE__ */ e(ze, { className: "mx-auto mb-4 h-10 w-10 text-white", "aria-hidden": "true" }),
     /* @__PURE__ */ e("h2", { className: "text-xl font-semibold text-white sm:text-2xl", children: "Receba novidades e ofertas exclusivas" }),
     /* @__PURE__ */ e("p", { className: "mt-2 text-sm", style: { color: "rgba(255,255,255,0.85)" }, children: "Cadastre-se e fique por dentro dos lançamentos. Sem spam." }),
     n ? /* @__PURE__ */ e("p", { className: "mt-6 text-sm font-medium text-white", children: "Obrigado! Você está na lista. ✓" }) : /* @__PURE__ */ i("form", { onSubmit: (l) => {
@@ -2513,7 +2513,7 @@ export {
   Wt as DialogTrigger,
   De as Divider,
   Qe as Drawer,
-  Y as EmptyState,
+  X as EmptyState,
   qe as ErrorState,
   gt as Footer,
   Be as FormGroup,
@@ -2553,7 +2553,7 @@ export {
   et as TopAccessibilityBar,
   Me as avatarVariants,
   je as badgeVariants,
-  X as buttonVariants,
+  Se as buttonVariants,
   o as cn,
   Pe as spinnerVariants,
   na as toast