@beweco/aurora-ui 0.1.55 → 0.1.57

package/dist/index.cjs.js

@@ -1567,7 +1567,7 @@ var SocialMediaCarousel = function (_a) {
                                         ? "opacity-100 max-w-20"
                                         : "opacity-100 max-w-20 whitespace-nowrap"), children: socialItem.targetAudienceCount.toLocaleString("es-ES") })] }), socialItem.audienceReason && isHovered && (jsxRuntime.jsx("div", { className: "text-[11px] text-white/95 leading-relaxed animate-fade-in", children: socialItem.audienceReason })), socialItem.requiredTags &&
                             socialItem.requiredTags.length > 0 &&
-                            isHovered && (jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1 mt-2 pt-2 border-t border-white/20 animate-fade-in", children: socialItem.requiredTags.map(function (tag, idx) { return (jsxRuntime.jsx("span", { className: "text-[9px] px-1.5 py-0.5 rounded-md bg-white/20 text-white/95 backdrop-blur-sm border border-white/30", children: tag }, idx)); }) }))] })), !hideFooter && (jsxRuntime.jsx(SocialMediaBar, { platform: socialItem.type, isHovered: isHovered, showPreview: !!socialItem.imageUrl, onEdit: onEdit ? function () { return onEdit(socialItem); } : undefined, onDelete: onDelete ? function () { return onDelete(socialItem); } : undefined, onPublish: onPublish ? function () { return onPublish(socialItem); } : undefined, onPreview: function () { return handlePreview(socialItem); }, translations: {
+                            isHovered && (jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1 mt-2 pt-2 border-t border-white/20 animate-fade-in", children: socialItem.requiredTags.map(function (tag, idx) { return (jsxRuntime.jsx("span", { className: "text-[9px] px-1.5 py-0.5 rounded-md bg-white/20 text-white/95 backdrop-blur-sm border border-white/30", children: tag }, idx)); }) }))] })), !hideFooter && (jsxRuntime.jsx(SocialMediaBar, { platform: socialItem.type, isHovered: isHovered, showPreview: typeof onPreview === "function", onEdit: onEdit ? function () { return onEdit(socialItem); } : undefined, onDelete: onDelete ? function () { return onDelete(socialItem); } : undefined, onPublish: onPublish ? function () { return onPublish(socialItem); } : undefined, onPreview: function () { return handlePreview(socialItem); }, translations: {
                         editButtonLabel: translations.editButtonLabel,
                         deleteButtonLabel: translations.deleteButtonLabel,
                         publishButtonLabel: translations.publishButtonLabel,
@@ -1703,12 +1703,12 @@ var NotificationButton = function (_a) {
 };
 NotificationButton.displayName = "NotificationButton";
 
-var DEFAULT_TRANSLATIONS$4 = {
+var DEFAULT_TRANSLATIONS$5 = {
     logout: "Cerrar sesión",
 };
 var HeaderComponent = function (_a) {
     var notificationCount = _a.notificationCount, options = _a.options, onMenuClick = _a.onMenuClick, onLogout = _a.onLogout, _b = _a.translations, translations = _b === void 0 ? {} : _b, breadcrumbs = _a.breadcrumbs, onNotificationClick = _a.onNotificationClick, onOptionSelect = _a.onOptionSelect, onBreadcrumbClick = _a.onBreadcrumbClick;
-    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$4), translations);
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$5), translations);
     return (jsxRuntime.jsx("header", { className: "header__container", children: jsxRuntime.jsxs("div", { className: "flex items-center justify-between w-full", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(react.Button, { className: "sm:hidden", isIconOnly: true, variant: "light", startContent: jsxRuntime.jsx(IconComponent, { icon: "solar:hamburger-menu-linear" }), onPress: onMenuClick }), breadcrumbs && breadcrumbs.length > 0 && (jsxRuntime.jsx(BreadcrumbsComponent, { items: breadcrumbs, onItemClick: onBreadcrumbClick }))] }), jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(NotificationButton, { notificationCount: notificationCount, onPress: onNotificationClick }), jsxRuntime.jsx(ConfigMenu, { options: options, onLogout: onLogout, onOptionSelect: onOptionSelect, translations: t })] })] }) }));
 };
 HeaderComponent.displayName = "Header";
@@ -1832,7 +1832,7 @@ KanbanColumn.displayName = "KanbanColumn";
  * Traducciones por defecto en español.
  * Se mezclan con las traducciones proporcionadas por el usuario.
  */
-var DEFAULT_TRANSLATIONS$3 = {
+var DEFAULT_TRANSLATIONS$4 = {
     dropHere: "Soltar aquí",
     emptyMessage: "No hay elementos",
 };
@@ -1866,7 +1866,7 @@ var columnGapClasses = {
 var KanbanComponent = function (_a) {
     var columns = _a.columns, renderItem = _a.renderItem, onCardClick = _a.onCardClick, onItemMove = _a.onItemMove, isDraggable = _a.isDraggable, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _b = _a.columnWidth, columnWidth = _b === void 0 ? "280px" : _b, _c = _a.columnGap, columnGap = _c === void 0 ? "md" : _c, _d = _a.horizontalScroll, horizontalScroll = _d === void 0 ? true : _d, columnMaxHeight = _a.columnMaxHeight, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.translations, translations = _e === void 0 ? {} : _e, onLoadMore = _a.onLoadMore;
     // Mezclar traducciones del usuario con las por defecto
-    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$3), translations);
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$4), translations);
     // Determinar si drag está habilitado
     var dragEnabled = isDraggable !== null && isDraggable !== void 0 ? isDraggable : !!onItemMove;
     // Estado del drag actual
@@ -1974,6 +1974,56 @@ var ImagePreview = function (_a) {
                             : undefined, role: isClickable ? "button" : undefined, tabIndex: isClickable ? 0 : undefined, "aria-label": isClickable ? t.clickableImageAriaLabel : undefined }), showRemoveButton && onRemove && (jsxRuntime.jsx("button", { type: "button", onClick: function () { return handleRemove(image.id || "", index); }, "aria-label": t.removeButtonAriaLabel, className: "\n\t\t\t\t\t\t\t\t\tabsolute -top-2 -right-2 \n\t\t\t\t\t\t\t\t\tp-1 rounded-full \n\t\t\t\t\t\t\t\t\tbg-danger-500 hover:bg-danger-600 \n\t\t\t\t\t\t\t\t\ttext-white \n\t\t\t\t\t\t\t\t\tcursor-pointer \n\t\t\t\t\t\t\t\t\ttransition-colors\n\t\t\t\t\t\t\t\t\tfocus:outline-none \n\t\t\t\t\t\t\t\t\tfocus:ring-2 \n\t\t\t\t\t\t\t\t\tfocus:ring-danger-400 \n\t\t\t\t\t\t\t\t\tfocus:ring-offset-2\n\t\t\t\t\t\t\t\t", children: jsxRuntime.jsx(IconComponent, { size: size === "micro" ? "sm" : "md", icon: "solar:trash-bin-minimalistic-outline" }) }))] }) }, image.id || index)); }) }));
 };
 
+/** Normalize path for comparison: single leading slash, no trailing slash. */
+function normalizePath(path) {
+    var p = path.replace(/\/+$/, "").trim();
+    return p && !p.startsWith("/") ? "/".concat(p) : p || "/";
+}
+/** True when pathname matches href (exact or sub-route). */
+function pathMatches(href, pathname) {
+    var h = normalizePath(href);
+    var p = normalizePath(pathname);
+    return p === h || p.startsWith("".concat(h, "/"));
+}
+/**
+ * Walks the menu tree and returns the key of the item whose href matches the pathname.
+ * Prefers the most specific match (nested items over parents).
+ * Used when the consumer passes selectedPath instead of selectedKey.
+ */
+function walkItems(pathname, list) {
+    var _a;
+    for (var _i = 0, list_1 = list; _i < list_1.length; _i++) {
+        var item = list_1[_i];
+        if ((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) {
+            // Prefer match in children first (e.g. /catalog/products -> catalog-products, not catalog)
+            var found = walkItems(pathname, item.items);
+            if (found)
+                return found;
+        }
+        if (item.href && pathMatches(item.href, pathname)) {
+            return item.key;
+        }
+    }
+    return undefined;
+}
+/**
+ * Returns the menu item key that matches the current pathname.
+ * Supports the structure used by Menu: items can be sections (each with .items) or flat.
+ * For nested items (e.g. Catálogo > Productos), returns the sub-item key.
+ */
+function getSelectedKeyFromPath(pathname, items) {
+    var _a;
+    var normalizedPath = normalizePath(pathname);
+    for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
+        var section = items_1[_i];
+        var list = (_a = section.items) !== null && _a !== void 0 ? _a : [section];
+        var found = walkItems(normalizedPath, list);
+        if (found)
+            return found;
+    }
+    return undefined;
+}
+
 exports.EnumMenuNavListItem = void 0;
 (function (EnumMenuNavListItem) {
     EnumMenuNavListItem["Nest"] = "nest";
@@ -2135,7 +2185,7 @@ var MenuNavList = React.forwardRef(function (_a, ref) {
 });
 MenuNavList.displayName = "MenuNavList";
 
-var DEFAULT_TRANSLATIONS$2 = {
+var DEFAULT_TRANSLATIONS$3 = {
     menuLabel: "Menú",
     closeSidebarAriaLabel: "Cerrar menú lateral",
     mobileNavAriaLabel: "Navegación móvil",
@@ -2151,7 +2201,14 @@ var MenuComponent = React.memo(function Menu(_a) {
     var commerceInfo = _a.commerceInfo, userInfo = _a.userInfo, helpButton = _a.helpButton, isOpenSidebar = _a.isOpenSidebar, onOpenSidebarChange = _a.onOpenSidebarChange, menuItems = _a.menuItems, mobileBottomBarGroupKey = _a.mobileBottomBarGroupKey, _d = _a.showNativeMenu, showNativeMenu = _d === void 0 ? true : _d, _e = _a.translations, translations = _e === void 0 ? {} : _e;
     var _f = React.useState(false), isCollapsed = _f[0], setIsCollapsed = _f[1];
     var _g = React.useState(false), logoError = _g[0], setLogoError = _g[1];
-    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$2), translations);
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$3), translations);
+    var selectedKey = React.useMemo(function () {
+        var _a, _b, _c;
+        if (menuItems.selectedPath) {
+            return ((_b = (_a = getSelectedKeyFromPath(menuItems.selectedPath, menuItems.items)) !== null && _a !== void 0 ? _a : menuItems.selectedKey) !== null && _b !== void 0 ? _b : "");
+        }
+        return (_c = menuItems.selectedKey) !== null && _c !== void 0 ? _c : "";
+    }, [menuItems.selectedPath, menuItems.selectedKey, menuItems.items]);
     var commerceName = (typeof (commerceInfo === null || commerceInfo === void 0 ? void 0 : commerceInfo.name) === "string" && commerceInfo.name.trim()) ||
         t.notDefinedLabel;
     var userName = (typeof (userInfo === null || userInfo === void 0 ? void 0 : userInfo.name) === "string" && userInfo.name.trim()) ||
@@ -2207,13 +2264,13 @@ var MenuComponent = React.memo(function Menu(_a) {
         (_a = menuItems.onSelect) === null || _a === void 0 ? void 0 : _a.call(menuItems, key, href, "bottomBar");
     }, [onOpenSidebarChange, menuItems.onSelect]);
     var showBottomBar = (mobileBottomBarGroupKey && bottomBarItems.length > 0) || showNativeMenu;
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [showBottomBar && (jsxRuntime.jsx(MenuMobileBottomBar, { items: bottomBarItems, selectedKey: menuItems.selectedKey, onSelect: handleBottomBarSelect, onMenuPress: handleSidebarOpen, menuLabel: t.menuLabel, navAriaLabel: t.mobileNavAriaLabel, forceVisible: showNativeMenu && bottomBarItems.length === 0 })), jsxRuntime.jsx("button", { type: "button", "aria-label": t.closeSidebarAriaLabel, className: "menu-overlay ".concat(isOpenSidebar ? "menu-overlay--open" : ""), onClick: handleSidebarClose, tabIndex: isOpenSidebar ? 0 : -1 }), jsxRuntime.jsx("div", { className: "container__menu ".concat(isCollapsed
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [showBottomBar && (jsxRuntime.jsx(MenuMobileBottomBar, { items: bottomBarItems, selectedKey: selectedKey, onSelect: handleBottomBarSelect, onMenuPress: handleSidebarOpen, menuLabel: t.menuLabel, navAriaLabel: t.mobileNavAriaLabel, forceVisible: showNativeMenu && bottomBarItems.length === 0 })), jsxRuntime.jsx("button", { type: "button", "aria-label": t.closeSidebarAriaLabel, className: "menu-overlay ".concat(isOpenSidebar ? "menu-overlay--open" : ""), onClick: handleSidebarClose, tabIndex: isOpenSidebar ? 0 : -1 }), jsxRuntime.jsx("div", { className: "container__menu ".concat(isCollapsed
                     ? "container__menu--collapsed"
                     : "container__menu--expanded", " ").concat(isOpenSidebar ? "container__menu--mobile-open" : ""), "aria-hidden": !isOpenSidebar, children: jsxRuntime.jsxs("div", { className: "content__menu", children: [jsxRuntime.jsxs("div", { className: "content__menu--header", style: {
                                 flexDirection: isCollapsed ? "column-reverse" : "row",
                             }, children: [jsxRuntime.jsxs("div", { className: "flex flex-row items-center justify-center ".concat(isCollapsed ? "gap-0" : "gap-2"), children: [jsxRuntime.jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center overflow-hidden rounded-full bg-foreground text-background", children: hasValidLogo ? (jsxRuntime.jsx("img", { src: commerceInfo.logo, alt: "".concat(t.logoAlt, " ").concat(commerceName), className: "h-full w-full object-cover", onError: function () { return setLogoError(true); } })) : (jsxRuntime.jsx(IconComponent, { icon: "solar:buildings-2-outline", size: "sm", className: "shrink-0", "aria-hidden": true })) }), jsxRuntime.jsx("span", { className: "collapsible-item text-small font-bold truncate min-w-0", children: commerceName })] }), jsxRuntime.jsxs("div", { className: "flex items-center", children: [jsxRuntime.jsx(IconComponent, { icon: "material-symbols-light:close", size: "lg", className: "cursor-pointer block sm:hidden", onClick: handleSidebarClose }), jsxRuntime.jsx(IconComponent, { icon: isCollapsed
                                                 ? "solar:alt-arrow-right-outline"
-                                                : "solar:alt-arrow-left-outline", size: "lg", className: "hidden sm:block cursor-pointer", onClick: handleCollapseToggle })] })] }), jsxRuntime.jsx(react.Spacer, { y: 6 }), jsxRuntime.jsxs("div", { className: "content__menu--user ".concat(isCollapsed ? "gap-0" : "gap-3"), children: [jsxRuntime.jsx(react.Avatar, { size: "md", src: ((_b = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _b === void 0 ? void 0 : _b.trim()) || undefined, color: !((_c = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _c === void 0 ? void 0 : _c.trim()) ? "warning" : "default", name: userName, className: "shrink-0" }), jsxRuntime.jsxs("div", { className: "collapsible-item flex min-w-0 flex-col overflow-hidden", children: [jsxRuntime.jsx("p", { className: "text-small font-medium text-default-900 truncate", children: userName }), jsxRuntime.jsx("p", { className: "text-tiny text-default-400 truncate", children: userRole })] })] }), jsxRuntime.jsx("div", { className: "".concat(!isCollapsed ? "flex-1" : "h-full", " min-h-0 py-6"), children: jsxRuntime.jsx("div", { className: "h-full overflow-y-auto pr-6 -mr-6 [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: jsxRuntime.jsx(MenuNavList, { defaultSelectedKey: menuItems.selectedKey, items: menuItems.items, isCollapsed: isCollapsed, onSelect: handleMenuSelect }, menuItems.selectedKey) }) }), jsxRuntime.jsx("div", { className: "mt-auto flex flex-col justify-center items-center", children: jsxRuntime.jsx(react.Button, { fullWidth: true, className: " text-default-500 data-[hover=true]:text-default-600", startContent: jsxRuntime.jsx(IconComponent, { className: "text-default-500", icon: "solar:info-circle-line-duotone", size: "md" }), variant: "light", onPress: handleHelpClick, isIconOnly: isCollapsed, children: !isCollapsed && (jsxRuntime.jsx("span", { className: "collapsible-item truncate", children: helpTitle })) }) })] }) })] }));
+                                                : "solar:alt-arrow-left-outline", size: "lg", className: "hidden sm:block cursor-pointer", onClick: handleCollapseToggle })] })] }), jsxRuntime.jsx(react.Spacer, { y: 6 }), jsxRuntime.jsxs("div", { className: "content__menu--user ".concat(isCollapsed ? "gap-0" : "gap-3"), children: [jsxRuntime.jsx(react.Avatar, { size: "md", src: ((_b = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _b === void 0 ? void 0 : _b.trim()) || undefined, color: !((_c = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _c === void 0 ? void 0 : _c.trim()) ? "warning" : "default", name: userName, className: "shrink-0" }), jsxRuntime.jsxs("div", { className: "collapsible-item flex min-w-0 flex-col overflow-hidden", children: [jsxRuntime.jsx("p", { className: "text-small font-medium text-default-900 truncate", children: userName }), jsxRuntime.jsx("p", { className: "text-tiny text-default-400 truncate", children: userRole })] })] }), jsxRuntime.jsx("div", { className: "".concat(!isCollapsed ? "flex-1" : "h-full", " min-h-0 py-6"), children: jsxRuntime.jsx("div", { className: "h-full overflow-y-auto pr-6 -mr-6 [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: jsxRuntime.jsx(MenuNavList, { defaultSelectedKey: selectedKey, items: menuItems.items, isCollapsed: isCollapsed, onSelect: handleMenuSelect }, selectedKey) }) }), jsxRuntime.jsx("div", { className: "mt-auto flex flex-col justify-center items-center", children: jsxRuntime.jsx(react.Button, { fullWidth: true, className: " text-default-500 data-[hover=true]:text-default-600", startContent: jsxRuntime.jsx(IconComponent, { className: "text-default-500", icon: "solar:info-circle-line-duotone", size: "md" }), variant: "light", onPress: handleHelpClick, isIconOnly: isCollapsed, children: !isCollapsed && (jsxRuntime.jsx("span", { className: "collapsible-item truncate", children: helpTitle })) }) })] }) })] }));
 });
 
 var StepIndicator = function (_a) {
@@ -4088,7 +4145,7 @@ var AURORAS = [
         duration: 55,
     },
 ];
-var DEFAULT_TRANSLATIONS$1 = {
+var DEFAULT_TRANSLATIONS$2 = {
     backButtonLabel: "Atras",
 };
 var BackButton = function (_a) {
@@ -4124,7 +4181,7 @@ var TwoColumnLayoutAgent = function (_a) {
     var _b = _a.assistantState, assistantState = _b === void 0 ? "happy" : _b, assistantSpeech = _a.assistantSpeech, _c = _a.assistantSize, assistantSize = _c === void 0 ? "xl" : _c, assistantHint = _a.assistantHint, _d = _a.enableSequence, enableSequence = _d === void 0 ? true : _d, children = _a.children, _e = _a.showBackButton, showBackButton = _e === void 0 ? false : _e, onBack = _a.onBack, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g;
     var _h = React.useState(!enableSequence), showRightContent = _h[0], setShowRightContent = _h[1];
     var isDesktop = useMediaQuery("(min-width: ".concat(DESKTOP_BREAKPOINT_PX, "px)"));
-    var t = React.useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$1), translations)); }, [translations]);
+    var t = React.useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$2), translations)); }, [translations]);
     var handleBackPress = onBack !== null && onBack !== void 0 ? onBack : (function () { return undefined; });
     React.useEffect(function () {
         if (enableSequence && !showRightContent) {
@@ -4679,6 +4736,65 @@ var UploadFile = function (_a) {
 };
 UploadFile.displayName = "UploadFile";
 
+var DEFAULT_TRANSLATIONS$1 = {
+    businessName: "Tu Negocio",
+    businessInitials: "TN",
+    onlineStatus: "en linea",
+    imageAlt: "Vista previa de mensaje WhatsApp",
+    viewMore: "ver mas",
+    viewLess: "ver menos",
+};
+/**
+ * WhatsAppPreview - Displays a realistic WhatsApp message bubble preview.
+ * Supports image, caption, CTA buttons, and compact/full variants.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <WhatsAppPreview
+ *   imageUrl="/path/to/image.jpg"
+ *   caption="Check out our new product!"
+ *   variant="full"
+ *   showHeader
+ * />
+ * ```
+ */
+var WhatsAppPreview = function (_a) {
+    var imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "compact" : _b, _c = _a.showHeader, showHeader = _c === void 0 ? false : _c, maxCaptionLength = _a.maxCaptionLength, onToggleCaption = _a.onToggleCaption, _d = _a.showFullCaption, showFullCaption = _d === void 0 ? false : _d, ctaType = _a.ctaType, ctaLabel = _a.ctaLabel, ctaValue = _a.ctaValue, _e = _a.campaignView, campaignView = _e === void 0 ? false : _e, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g, _h = _a.timeLocale, timeLocale = _h === void 0 ? "es-ES" : _h;
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$1), translations);
+    var shouldTruncate = maxCaptionLength && caption.length > maxCaptionLength;
+    var displayCaption = campaignView
+        ? caption
+        : shouldTruncate && !showFullCaption
+            ? "".concat(caption.substring(0, maxCaptionLength), "...")
+            : caption;
+    var containerStyle = variant === "compact" ? { minHeight: "320px" } : { height: "640px" };
+    var paddingClass = variant === "compact" ? "p-3" : "p-4";
+    var imageMargin = variant === "compact" ? "" : "-mx-1 -mt-1";
+    var imageHeight = campaignView
+        ? ""
+        : variant === "compact"
+            ? "h-32"
+            : "max-h-64";
+    var imageAspectRatio = campaignView ? "1/1" : undefined;
+    var bubblePadding = variant === "compact" ? "p-2.5" : "p-3";
+    return (jsxRuntime.jsxs("div", { className: "w-full h-full flex flex-col bg-[#ECE5DD] dark:bg-gray-900 ".concat(paddingClass, " justify-start ").concat(className), style: containerStyle, children: [showHeader && (jsxRuntime.jsxs("div", { className: "flex items-center gap-3 mb-4 p-3 bg-[#075E54] dark:bg-[#1F2C33] rounded-t-lg -mx-4 -mt-4", children: [jsxRuntime.jsx("div", { className: "w-10 h-10 bg-gray-300 rounded-full flex items-center justify-center", children: jsxRuntime.jsx("span", { className: "text-gray-600 text-sm font-bold", children: t.businessInitials }) }), jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsx("span", { className: "text-sm font-semibold text-white", children: t.businessName }), jsxRuntime.jsx("p", { className: "text-xs text-gray-300", children: t.onlineStatus })] })] })), jsxRuntime.jsx("div", { className: "flex flex-col gap-2 ".concat(showHeader ? "mt-6 overflow-y-auto flex-1" : "", " items-start"), children: jsxRuntime.jsx("div", { className: "mr-auto max-w-[85%]", children: jsxRuntime.jsxs("div", { className: "bg-white dark:bg-gray-800 rounded-lg ".concat(bubblePadding, " shadow-sm"), children: [imageUrl && (jsxRuntime.jsx("div", { className: "rounded-lg overflow-hidden ".concat(imageMargin), style: imageAspectRatio
+                                    ? { aspectRatio: imageAspectRatio }
+                                    : undefined, children: jsxRuntime.jsx(react.Image, { src: imageUrl, alt: t.imageAlt, className: "w-full ".concat(imageHeight, " object-cover") }) })), jsxRuntime.jsxs("div", { className: "text-sm text-gray-900 dark:text-white text-left ".concat(imageUrl ? "mt-2" : ""), children: [jsxRuntime.jsx("div", { className: "".concat(showFullCaption && variant === "compact" ? "overflow-y-auto" : "", " ").concat(campaignView ? (imageUrl ? "line-clamp-3" : "line-clamp-[12]") : ""), style: {
+                                            maxHeight: showFullCaption && variant === "compact"
+                                                ? "150px"
+                                                : "none",
+                                        }, children: jsxRuntime.jsx("span", { className: "whitespace-pre-wrap font-sans break-words block text-left", children: displayCaption }) }), shouldTruncate &&
+                                        onToggleCaption &&
+                                        variant === "compact" && (jsxRuntime.jsx("button", { type: "button", onClick: function (e) {
+                                            e.stopPropagation();
+                                            onToggleCaption();
+                                        }, className: "text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-300 font-normal mt-1 underline text-xs", children: showFullCaption ? t.viewLess : t.viewMore }))] }), ctaType && ctaLabel && ctaValue && (jsxRuntime.jsx("div", { className: "mt-3 -mx-1", children: jsxRuntime.jsx(Button, { size: "sm", color: "primary", variant: "bordered", className: "w-full font-semibold", startContent: ctaType === "CALL_NOW" ? (jsxRuntime.jsx(IconComponent, { icon: "solar:phone-bold", className: "text-sm" })) : (jsxRuntime.jsx(IconComponent, { icon: "solar:link-bold", className: "text-sm" })), children: ctaLabel }) })), jsxRuntime.jsx("div", { className: "flex items-center justify-end gap-1 mt-1", children: jsxRuntime.jsx("span", { className: "text-[10px] text-gray-600 dark:text-gray-400", children: new Date().toLocaleTimeString(timeLocale, {
+                                        hour: "2-digit",
+                                        minute: "2-digit",
+                                    }) }) })] }) }) })] }));
+};
+
 /**
  * WizardSidebar - Componente de navegación lateral del wizard
  * Muestra los pasos con indicadores visuales de estado (activo, completado, pendiente)
@@ -5761,10 +5877,12 @@ exports.ToastContext = ToastContext;
 exports.TwoColumnLayoutAgent = TwoColumnLayoutAgent;
 exports.UploadFile = UploadFile;
 exports.VerticalSteps = VerticalSteps;
+exports.WhatsAppPreview = WhatsAppPreview;
 exports.Wizard = Wizard;
 exports.WizardNavigation = WizardNavigation;
 exports.WizardSidebar = WizardSidebar;
 exports.defaultTranslations = defaultTranslations$4;
+exports.getSelectedKeyFromPath = getSelectedKeyFromPath;
 exports.sizeMap = sizeMap;
 exports.themeColors = themeColors;
 exports.useAuraToast = useAuraToast;

package/dist/index.esm.js

@@ -1568,7 +1568,7 @@ var SocialMediaCarousel = function (_a) {
                                         ? "opacity-100 max-w-20"
                                         : "opacity-100 max-w-20 whitespace-nowrap"), children: socialItem.targetAudienceCount.toLocaleString("es-ES") })] }), socialItem.audienceReason && isHovered && (jsx("div", { className: "text-[11px] text-white/95 leading-relaxed animate-fade-in", children: socialItem.audienceReason })), socialItem.requiredTags &&
                             socialItem.requiredTags.length > 0 &&
-                            isHovered && (jsx("div", { className: "flex flex-wrap gap-1 mt-2 pt-2 border-t border-white/20 animate-fade-in", children: socialItem.requiredTags.map(function (tag, idx) { return (jsx("span", { className: "text-[9px] px-1.5 py-0.5 rounded-md bg-white/20 text-white/95 backdrop-blur-sm border border-white/30", children: tag }, idx)); }) }))] })), !hideFooter && (jsx(SocialMediaBar, { platform: socialItem.type, isHovered: isHovered, showPreview: !!socialItem.imageUrl, onEdit: onEdit ? function () { return onEdit(socialItem); } : undefined, onDelete: onDelete ? function () { return onDelete(socialItem); } : undefined, onPublish: onPublish ? function () { return onPublish(socialItem); } : undefined, onPreview: function () { return handlePreview(socialItem); }, translations: {
+                            isHovered && (jsx("div", { className: "flex flex-wrap gap-1 mt-2 pt-2 border-t border-white/20 animate-fade-in", children: socialItem.requiredTags.map(function (tag, idx) { return (jsx("span", { className: "text-[9px] px-1.5 py-0.5 rounded-md bg-white/20 text-white/95 backdrop-blur-sm border border-white/30", children: tag }, idx)); }) }))] })), !hideFooter && (jsx(SocialMediaBar, { platform: socialItem.type, isHovered: isHovered, showPreview: typeof onPreview === "function", onEdit: onEdit ? function () { return onEdit(socialItem); } : undefined, onDelete: onDelete ? function () { return onDelete(socialItem); } : undefined, onPublish: onPublish ? function () { return onPublish(socialItem); } : undefined, onPreview: function () { return handlePreview(socialItem); }, translations: {
                         editButtonLabel: translations.editButtonLabel,
                         deleteButtonLabel: translations.deleteButtonLabel,
                         publishButtonLabel: translations.publishButtonLabel,
@@ -1704,12 +1704,12 @@ var NotificationButton = function (_a) {
 };
 NotificationButton.displayName = "NotificationButton";
 
-var DEFAULT_TRANSLATIONS$4 = {
+var DEFAULT_TRANSLATIONS$5 = {
     logout: "Cerrar sesión",
 };
 var HeaderComponent = function (_a) {
     var notificationCount = _a.notificationCount, options = _a.options, onMenuClick = _a.onMenuClick, onLogout = _a.onLogout, _b = _a.translations, translations = _b === void 0 ? {} : _b, breadcrumbs = _a.breadcrumbs, onNotificationClick = _a.onNotificationClick, onOptionSelect = _a.onOptionSelect, onBreadcrumbClick = _a.onBreadcrumbClick;
-    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$4), translations);
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$5), translations);
     return (jsx("header", { className: "header__container", children: jsxs("div", { className: "flex items-center justify-between w-full", children: [jsxs("div", { className: "flex items-center gap-4", children: [jsx(Button$1, { className: "sm:hidden", isIconOnly: true, variant: "light", startContent: jsx(IconComponent, { icon: "solar:hamburger-menu-linear" }), onPress: onMenuClick }), breadcrumbs && breadcrumbs.length > 0 && (jsx(BreadcrumbsComponent, { items: breadcrumbs, onItemClick: onBreadcrumbClick }))] }), jsxs("div", { className: "flex items-center gap-4", children: [jsx(NotificationButton, { notificationCount: notificationCount, onPress: onNotificationClick }), jsx(ConfigMenu, { options: options, onLogout: onLogout, onOptionSelect: onOptionSelect, translations: t })] })] }) }));
 };
 HeaderComponent.displayName = "Header";
@@ -1833,7 +1833,7 @@ KanbanColumn.displayName = "KanbanColumn";
  * Traducciones por defecto en español.
  * Se mezclan con las traducciones proporcionadas por el usuario.
  */
-var DEFAULT_TRANSLATIONS$3 = {
+var DEFAULT_TRANSLATIONS$4 = {
     dropHere: "Soltar aquí",
     emptyMessage: "No hay elementos",
 };
@@ -1867,7 +1867,7 @@ var columnGapClasses = {
 var KanbanComponent = function (_a) {
     var columns = _a.columns, renderItem = _a.renderItem, onCardClick = _a.onCardClick, onItemMove = _a.onItemMove, isDraggable = _a.isDraggable, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _b = _a.columnWidth, columnWidth = _b === void 0 ? "280px" : _b, _c = _a.columnGap, columnGap = _c === void 0 ? "md" : _c, _d = _a.horizontalScroll, horizontalScroll = _d === void 0 ? true : _d, columnMaxHeight = _a.columnMaxHeight, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.translations, translations = _e === void 0 ? {} : _e, onLoadMore = _a.onLoadMore;
     // Mezclar traducciones del usuario con las por defecto
-    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$3), translations);
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$4), translations);
     // Determinar si drag está habilitado
     var dragEnabled = isDraggable !== null && isDraggable !== void 0 ? isDraggable : !!onItemMove;
     // Estado del drag actual
@@ -1975,6 +1975,56 @@ var ImagePreview = function (_a) {
                             : undefined, role: isClickable ? "button" : undefined, tabIndex: isClickable ? 0 : undefined, "aria-label": isClickable ? t.clickableImageAriaLabel : undefined }), showRemoveButton && onRemove && (jsx("button", { type: "button", onClick: function () { return handleRemove(image.id || "", index); }, "aria-label": t.removeButtonAriaLabel, className: "\n\t\t\t\t\t\t\t\t\tabsolute -top-2 -right-2 \n\t\t\t\t\t\t\t\t\tp-1 rounded-full \n\t\t\t\t\t\t\t\t\tbg-danger-500 hover:bg-danger-600 \n\t\t\t\t\t\t\t\t\ttext-white \n\t\t\t\t\t\t\t\t\tcursor-pointer \n\t\t\t\t\t\t\t\t\ttransition-colors\n\t\t\t\t\t\t\t\t\tfocus:outline-none \n\t\t\t\t\t\t\t\t\tfocus:ring-2 \n\t\t\t\t\t\t\t\t\tfocus:ring-danger-400 \n\t\t\t\t\t\t\t\t\tfocus:ring-offset-2\n\t\t\t\t\t\t\t\t", children: jsx(IconComponent, { size: size === "micro" ? "sm" : "md", icon: "solar:trash-bin-minimalistic-outline" }) }))] }) }, image.id || index)); }) }));
 };
 
+/** Normalize path for comparison: single leading slash, no trailing slash. */
+function normalizePath(path) {
+    var p = path.replace(/\/+$/, "").trim();
+    return p && !p.startsWith("/") ? "/".concat(p) : p || "/";
+}
+/** True when pathname matches href (exact or sub-route). */
+function pathMatches(href, pathname) {
+    var h = normalizePath(href);
+    var p = normalizePath(pathname);
+    return p === h || p.startsWith("".concat(h, "/"));
+}
+/**
+ * Walks the menu tree and returns the key of the item whose href matches the pathname.
+ * Prefers the most specific match (nested items over parents).
+ * Used when the consumer passes selectedPath instead of selectedKey.
+ */
+function walkItems(pathname, list) {
+    var _a;
+    for (var _i = 0, list_1 = list; _i < list_1.length; _i++) {
+        var item = list_1[_i];
+        if ((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) {
+            // Prefer match in children first (e.g. /catalog/products -> catalog-products, not catalog)
+            var found = walkItems(pathname, item.items);
+            if (found)
+                return found;
+        }
+        if (item.href && pathMatches(item.href, pathname)) {
+            return item.key;
+        }
+    }
+    return undefined;
+}
+/**
+ * Returns the menu item key that matches the current pathname.
+ * Supports the structure used by Menu: items can be sections (each with .items) or flat.
+ * For nested items (e.g. Catálogo > Productos), returns the sub-item key.
+ */
+function getSelectedKeyFromPath(pathname, items) {
+    var _a;
+    var normalizedPath = normalizePath(pathname);
+    for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
+        var section = items_1[_i];
+        var list = (_a = section.items) !== null && _a !== void 0 ? _a : [section];
+        var found = walkItems(normalizedPath, list);
+        if (found)
+            return found;
+    }
+    return undefined;
+}
+
 var EnumMenuNavListItem;
 (function (EnumMenuNavListItem) {
     EnumMenuNavListItem["Nest"] = "nest";
@@ -2136,7 +2186,7 @@ var MenuNavList = React.forwardRef(function (_a, ref) {
 });
 MenuNavList.displayName = "MenuNavList";
 
-var DEFAULT_TRANSLATIONS$2 = {
+var DEFAULT_TRANSLATIONS$3 = {
     menuLabel: "Menú",
     closeSidebarAriaLabel: "Cerrar menú lateral",
     mobileNavAriaLabel: "Navegación móvil",
@@ -2152,7 +2202,14 @@ var MenuComponent = React.memo(function Menu(_a) {
     var commerceInfo = _a.commerceInfo, userInfo = _a.userInfo, helpButton = _a.helpButton, isOpenSidebar = _a.isOpenSidebar, onOpenSidebarChange = _a.onOpenSidebarChange, menuItems = _a.menuItems, mobileBottomBarGroupKey = _a.mobileBottomBarGroupKey, _d = _a.showNativeMenu, showNativeMenu = _d === void 0 ? true : _d, _e = _a.translations, translations = _e === void 0 ? {} : _e;
     var _f = React.useState(false), isCollapsed = _f[0], setIsCollapsed = _f[1];
     var _g = React.useState(false), logoError = _g[0], setLogoError = _g[1];
-    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$2), translations);
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$3), translations);
+    var selectedKey = React.useMemo(function () {
+        var _a, _b, _c;
+        if (menuItems.selectedPath) {
+            return ((_b = (_a = getSelectedKeyFromPath(menuItems.selectedPath, menuItems.items)) !== null && _a !== void 0 ? _a : menuItems.selectedKey) !== null && _b !== void 0 ? _b : "");
+        }
+        return (_c = menuItems.selectedKey) !== null && _c !== void 0 ? _c : "";
+    }, [menuItems.selectedPath, menuItems.selectedKey, menuItems.items]);
     var commerceName = (typeof (commerceInfo === null || commerceInfo === void 0 ? void 0 : commerceInfo.name) === "string" && commerceInfo.name.trim()) ||
         t.notDefinedLabel;
     var userName = (typeof (userInfo === null || userInfo === void 0 ? void 0 : userInfo.name) === "string" && userInfo.name.trim()) ||
@@ -2208,13 +2265,13 @@ var MenuComponent = React.memo(function Menu(_a) {
         (_a = menuItems.onSelect) === null || _a === void 0 ? void 0 : _a.call(menuItems, key, href, "bottomBar");
     }, [onOpenSidebarChange, menuItems.onSelect]);
     var showBottomBar = (mobileBottomBarGroupKey && bottomBarItems.length > 0) || showNativeMenu;
-    return (jsxs(Fragment, { children: [showBottomBar && (jsx(MenuMobileBottomBar, { items: bottomBarItems, selectedKey: menuItems.selectedKey, onSelect: handleBottomBarSelect, onMenuPress: handleSidebarOpen, menuLabel: t.menuLabel, navAriaLabel: t.mobileNavAriaLabel, forceVisible: showNativeMenu && bottomBarItems.length === 0 })), jsx("button", { type: "button", "aria-label": t.closeSidebarAriaLabel, className: "menu-overlay ".concat(isOpenSidebar ? "menu-overlay--open" : ""), onClick: handleSidebarClose, tabIndex: isOpenSidebar ? 0 : -1 }), jsx("div", { className: "container__menu ".concat(isCollapsed
+    return (jsxs(Fragment, { children: [showBottomBar && (jsx(MenuMobileBottomBar, { items: bottomBarItems, selectedKey: selectedKey, onSelect: handleBottomBarSelect, onMenuPress: handleSidebarOpen, menuLabel: t.menuLabel, navAriaLabel: t.mobileNavAriaLabel, forceVisible: showNativeMenu && bottomBarItems.length === 0 })), jsx("button", { type: "button", "aria-label": t.closeSidebarAriaLabel, className: "menu-overlay ".concat(isOpenSidebar ? "menu-overlay--open" : ""), onClick: handleSidebarClose, tabIndex: isOpenSidebar ? 0 : -1 }), jsx("div", { className: "container__menu ".concat(isCollapsed
                     ? "container__menu--collapsed"
                     : "container__menu--expanded", " ").concat(isOpenSidebar ? "container__menu--mobile-open" : ""), "aria-hidden": !isOpenSidebar, children: jsxs("div", { className: "content__menu", children: [jsxs("div", { className: "content__menu--header", style: {
                                 flexDirection: isCollapsed ? "column-reverse" : "row",
                             }, children: [jsxs("div", { className: "flex flex-row items-center justify-center ".concat(isCollapsed ? "gap-0" : "gap-2"), children: [jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center overflow-hidden rounded-full bg-foreground text-background", children: hasValidLogo ? (jsx("img", { src: commerceInfo.logo, alt: "".concat(t.logoAlt, " ").concat(commerceName), className: "h-full w-full object-cover", onError: function () { return setLogoError(true); } })) : (jsx(IconComponent, { icon: "solar:buildings-2-outline", size: "sm", className: "shrink-0", "aria-hidden": true })) }), jsx("span", { className: "collapsible-item text-small font-bold truncate min-w-0", children: commerceName })] }), jsxs("div", { className: "flex items-center", children: [jsx(IconComponent, { icon: "material-symbols-light:close", size: "lg", className: "cursor-pointer block sm:hidden", onClick: handleSidebarClose }), jsx(IconComponent, { icon: isCollapsed
                                                 ? "solar:alt-arrow-right-outline"
-                                                : "solar:alt-arrow-left-outline", size: "lg", className: "hidden sm:block cursor-pointer", onClick: handleCollapseToggle })] })] }), jsx(Spacer, { y: 6 }), jsxs("div", { className: "content__menu--user ".concat(isCollapsed ? "gap-0" : "gap-3"), children: [jsx(Avatar, { size: "md", src: ((_b = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _b === void 0 ? void 0 : _b.trim()) || undefined, color: !((_c = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _c === void 0 ? void 0 : _c.trim()) ? "warning" : "default", name: userName, className: "shrink-0" }), jsxs("div", { className: "collapsible-item flex min-w-0 flex-col overflow-hidden", children: [jsx("p", { className: "text-small font-medium text-default-900 truncate", children: userName }), jsx("p", { className: "text-tiny text-default-400 truncate", children: userRole })] })] }), jsx("div", { className: "".concat(!isCollapsed ? "flex-1" : "h-full", " min-h-0 py-6"), children: jsx("div", { className: "h-full overflow-y-auto pr-6 -mr-6 [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: jsx(MenuNavList, { defaultSelectedKey: menuItems.selectedKey, items: menuItems.items, isCollapsed: isCollapsed, onSelect: handleMenuSelect }, menuItems.selectedKey) }) }), jsx("div", { className: "mt-auto flex flex-col justify-center items-center", children: jsx(Button$1, { fullWidth: true, className: " text-default-500 data-[hover=true]:text-default-600", startContent: jsx(IconComponent, { className: "text-default-500", icon: "solar:info-circle-line-duotone", size: "md" }), variant: "light", onPress: handleHelpClick, isIconOnly: isCollapsed, children: !isCollapsed && (jsx("span", { className: "collapsible-item truncate", children: helpTitle })) }) })] }) })] }));
+                                                : "solar:alt-arrow-left-outline", size: "lg", className: "hidden sm:block cursor-pointer", onClick: handleCollapseToggle })] })] }), jsx(Spacer, { y: 6 }), jsxs("div", { className: "content__menu--user ".concat(isCollapsed ? "gap-0" : "gap-3"), children: [jsx(Avatar, { size: "md", src: ((_b = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _b === void 0 ? void 0 : _b.trim()) || undefined, color: !((_c = userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar) === null || _c === void 0 ? void 0 : _c.trim()) ? "warning" : "default", name: userName, className: "shrink-0" }), jsxs("div", { className: "collapsible-item flex min-w-0 flex-col overflow-hidden", children: [jsx("p", { className: "text-small font-medium text-default-900 truncate", children: userName }), jsx("p", { className: "text-tiny text-default-400 truncate", children: userRole })] })] }), jsx("div", { className: "".concat(!isCollapsed ? "flex-1" : "h-full", " min-h-0 py-6"), children: jsx("div", { className: "h-full overflow-y-auto pr-6 -mr-6 [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: jsx(MenuNavList, { defaultSelectedKey: selectedKey, items: menuItems.items, isCollapsed: isCollapsed, onSelect: handleMenuSelect }, selectedKey) }) }), jsx("div", { className: "mt-auto flex flex-col justify-center items-center", children: jsx(Button$1, { fullWidth: true, className: " text-default-500 data-[hover=true]:text-default-600", startContent: jsx(IconComponent, { className: "text-default-500", icon: "solar:info-circle-line-duotone", size: "md" }), variant: "light", onPress: handleHelpClick, isIconOnly: isCollapsed, children: !isCollapsed && (jsx("span", { className: "collapsible-item truncate", children: helpTitle })) }) })] }) })] }));
 });
 
 var StepIndicator = function (_a) {
@@ -4089,7 +4146,7 @@ var AURORAS = [
         duration: 55,
     },
 ];
-var DEFAULT_TRANSLATIONS$1 = {
+var DEFAULT_TRANSLATIONS$2 = {
     backButtonLabel: "Atras",
 };
 var BackButton = function (_a) {
@@ -4125,7 +4182,7 @@ var TwoColumnLayoutAgent = function (_a) {
     var _b = _a.assistantState, assistantState = _b === void 0 ? "happy" : _b, assistantSpeech = _a.assistantSpeech, _c = _a.assistantSize, assistantSize = _c === void 0 ? "xl" : _c, assistantHint = _a.assistantHint, _d = _a.enableSequence, enableSequence = _d === void 0 ? true : _d, children = _a.children, _e = _a.showBackButton, showBackButton = _e === void 0 ? false : _e, onBack = _a.onBack, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g;
     var _h = useState(!enableSequence), showRightContent = _h[0], setShowRightContent = _h[1];
     var isDesktop = useMediaQuery("(min-width: ".concat(DESKTOP_BREAKPOINT_PX, "px)"));
-    var t = useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$1), translations)); }, [translations]);
+    var t = useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$2), translations)); }, [translations]);
     var handleBackPress = onBack !== null && onBack !== void 0 ? onBack : (function () { return undefined; });
     useEffect(function () {
         if (enableSequence && !showRightContent) {
@@ -4680,6 +4737,65 @@ var UploadFile = function (_a) {
 };
 UploadFile.displayName = "UploadFile";
 
+var DEFAULT_TRANSLATIONS$1 = {
+    businessName: "Tu Negocio",
+    businessInitials: "TN",
+    onlineStatus: "en linea",
+    imageAlt: "Vista previa de mensaje WhatsApp",
+    viewMore: "ver mas",
+    viewLess: "ver menos",
+};
+/**
+ * WhatsAppPreview - Displays a realistic WhatsApp message bubble preview.
+ * Supports image, caption, CTA buttons, and compact/full variants.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <WhatsAppPreview
+ *   imageUrl="/path/to/image.jpg"
+ *   caption="Check out our new product!"
+ *   variant="full"
+ *   showHeader
+ * />
+ * ```
+ */
+var WhatsAppPreview = function (_a) {
+    var imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "compact" : _b, _c = _a.showHeader, showHeader = _c === void 0 ? false : _c, maxCaptionLength = _a.maxCaptionLength, onToggleCaption = _a.onToggleCaption, _d = _a.showFullCaption, showFullCaption = _d === void 0 ? false : _d, ctaType = _a.ctaType, ctaLabel = _a.ctaLabel, ctaValue = _a.ctaValue, _e = _a.campaignView, campaignView = _e === void 0 ? false : _e, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g, _h = _a.timeLocale, timeLocale = _h === void 0 ? "es-ES" : _h;
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$1), translations);
+    var shouldTruncate = maxCaptionLength && caption.length > maxCaptionLength;
+    var displayCaption = campaignView
+        ? caption
+        : shouldTruncate && !showFullCaption
+            ? "".concat(caption.substring(0, maxCaptionLength), "...")
+            : caption;
+    var containerStyle = variant === "compact" ? { minHeight: "320px" } : { height: "640px" };
+    var paddingClass = variant === "compact" ? "p-3" : "p-4";
+    var imageMargin = variant === "compact" ? "" : "-mx-1 -mt-1";
+    var imageHeight = campaignView
+        ? ""
+        : variant === "compact"
+            ? "h-32"
+            : "max-h-64";
+    var imageAspectRatio = campaignView ? "1/1" : undefined;
+    var bubblePadding = variant === "compact" ? "p-2.5" : "p-3";
+    return (jsxs("div", { className: "w-full h-full flex flex-col bg-[#ECE5DD] dark:bg-gray-900 ".concat(paddingClass, " justify-start ").concat(className), style: containerStyle, children: [showHeader && (jsxs("div", { className: "flex items-center gap-3 mb-4 p-3 bg-[#075E54] dark:bg-[#1F2C33] rounded-t-lg -mx-4 -mt-4", children: [jsx("div", { className: "w-10 h-10 bg-gray-300 rounded-full flex items-center justify-center", children: jsx("span", { className: "text-gray-600 text-sm font-bold", children: t.businessInitials }) }), jsxs("div", { className: "flex-1", children: [jsx("span", { className: "text-sm font-semibold text-white", children: t.businessName }), jsx("p", { className: "text-xs text-gray-300", children: t.onlineStatus })] })] })), jsx("div", { className: "flex flex-col gap-2 ".concat(showHeader ? "mt-6 overflow-y-auto flex-1" : "", " items-start"), children: jsx("div", { className: "mr-auto max-w-[85%]", children: jsxs("div", { className: "bg-white dark:bg-gray-800 rounded-lg ".concat(bubblePadding, " shadow-sm"), children: [imageUrl && (jsx("div", { className: "rounded-lg overflow-hidden ".concat(imageMargin), style: imageAspectRatio
+                                    ? { aspectRatio: imageAspectRatio }
+                                    : undefined, children: jsx(Image$1, { src: imageUrl, alt: t.imageAlt, className: "w-full ".concat(imageHeight, " object-cover") }) })), jsxs("div", { className: "text-sm text-gray-900 dark:text-white text-left ".concat(imageUrl ? "mt-2" : ""), children: [jsx("div", { className: "".concat(showFullCaption && variant === "compact" ? "overflow-y-auto" : "", " ").concat(campaignView ? (imageUrl ? "line-clamp-3" : "line-clamp-[12]") : ""), style: {
+                                            maxHeight: showFullCaption && variant === "compact"
+                                                ? "150px"
+                                                : "none",
+                                        }, children: jsx("span", { className: "whitespace-pre-wrap font-sans break-words block text-left", children: displayCaption }) }), shouldTruncate &&
+                                        onToggleCaption &&
+                                        variant === "compact" && (jsx("button", { type: "button", onClick: function (e) {
+                                            e.stopPropagation();
+                                            onToggleCaption();
+                                        }, className: "text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-300 font-normal mt-1 underline text-xs", children: showFullCaption ? t.viewLess : t.viewMore }))] }), ctaType && ctaLabel && ctaValue && (jsx("div", { className: "mt-3 -mx-1", children: jsx(Button, { size: "sm", color: "primary", variant: "bordered", className: "w-full font-semibold", startContent: ctaType === "CALL_NOW" ? (jsx(IconComponent, { icon: "solar:phone-bold", className: "text-sm" })) : (jsx(IconComponent, { icon: "solar:link-bold", className: "text-sm" })), children: ctaLabel }) })), jsx("div", { className: "flex items-center justify-end gap-1 mt-1", children: jsx("span", { className: "text-[10px] text-gray-600 dark:text-gray-400", children: new Date().toLocaleTimeString(timeLocale, {
+                                        hour: "2-digit",
+                                        minute: "2-digit",
+                                    }) }) })] }) }) })] }));
+};
+
 /**
  * WizardSidebar - Componente de navegación lateral del wizard
  * Muestra los pasos con indicadores visuales de estado (activo, completado, pendiente)
@@ -5690,4 +5806,4 @@ var NavigationLoadingProvider = function (_a) {
     return (jsxs(NavigationLoadingContext.Provider, { value: value, children: [children, jsx(NavigationLoadingOverlay, { isVisible: isVisible })] }));
 };
 
-export { AccordionList, AddHolidayForm, AnalyticsCard, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorPicker, ColorSelector, ContentCarousel, DEFAULT_PREDEFINED_COLORS, DatePicker, DateRangePicker, DateSelector, DrawerFilters, EnumMenuNavListItem, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, Kanban, KanbanCard, KanbanColumn, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, ScheduleRow, SearchInput, Select, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, TagsFilter, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, TwoColumnLayoutAgent, UploadFile, VerticalSteps, Wizard, WizardNavigation, WizardSidebar, defaultTranslations$4 as defaultTranslations, sizeMap, themeColors, useAuraToast, useMediaQuery, useNavigationLoading, useThemeContext };
+export { AccordionList, AddHolidayForm, AnalyticsCard, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorPicker, ColorSelector, ContentCarousel, DEFAULT_PREDEFINED_COLORS, DatePicker, DateRangePicker, DateSelector, DrawerFilters, EnumMenuNavListItem, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, Kanban, KanbanCard, KanbanColumn, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, ScheduleRow, SearchInput, Select, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, TagsFilter, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, TwoColumnLayoutAgent, UploadFile, VerticalSteps, WhatsAppPreview, Wizard, WizardNavigation, WizardSidebar, defaultTranslations$4 as defaultTranslations, getSelectedKeyFromPath, sizeMap, themeColors, useAuraToast, useMediaQuery, useNavigationLoading, useThemeContext };

package/dist/types/components/menu/Menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/Menu.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,aAAa,CAAC;AAGrB,OAAO,KAAK,EACX,kBAAkB,EAElB,MAAM,cAAc,CAAC;AActB;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA2OtD,CAAC"}
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/Menu.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,aAAa,CAAC;AAIrB,OAAO,KAAK,EACX,kBAAkB,EAElB,MAAM,cAAc,CAAC;AActB;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAsPtD,CAAC"}

package/dist/types/components/menu/Menu.types.d.ts

@@ -31,7 +31,13 @@ export interface MenuComponentProps {
     };
     menuItems: {
         items: MenuNavListItem[];
-        selectedKey: string;
+        /**
+         * Ruta actual (p. ej. location.pathname). La librería calcula la key seleccionada
+         * comparando con los href de los ítems. Preferido frente a selectedKey.
+         */
+        selectedPath?: string;
+        /** Key del ítem seleccionado. Si se pasa selectedPath, se ignora y se deriva internamente. */
+        selectedKey?: string;
         /**
          * Se invoca al seleccionar un ítem. En móvil, si `source === 'bottomBar'` la app no debe abrir
          * el menú lateral (solo el botón hamburguesa debe abrirlo) para evitar parpadeos.

package/dist/types/components/menu/Menu.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6CAA6C,CAAC;AAEnF;;;GAGG;AACH,MAAM,MAAM,yBAAyB,GAAG;IACvC,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2DAA2D;IAC3D,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,6DAA6D;IAC7D,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,2EAA2E;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8FAA8F;IAC9F,eAAe,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,kBAAkB;IAClC,YAAY,EAAE;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACb,CAAC;IACF,QAAQ,EAAE;QACT,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACb,CAAC;IACF,UAAU,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,SAAS,EAAE;QACV,KAAK,EAAE,eAAe,EAAE,CAAC;QACzB,WAAW,EAAE,MAAM,CAAC;QACpB;;;WAGG;QACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,KAAK,IAAI,CAAC;KAClF,CAAC;IACF,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C;;;;OAIG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,yBAAyB,CAAC;CACzC"}
+{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6CAA6C,CAAC;AAEnF;;;GAGG;AACH,MAAM,MAAM,yBAAyB,GAAG;IACvC,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2DAA2D;IAC3D,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,6DAA6D;IAC7D,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,2EAA2E;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8FAA8F;IAC9F,eAAe,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,kBAAkB;IAClC,YAAY,EAAE;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACb,CAAC;IACF,QAAQ,EAAE;QACT,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACb,CAAC;IACF,UAAU,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,SAAS,EAAE;QACV,KAAK,EAAE,eAAe,EAAE,CAAC;QACzB;;;WAGG;QACH,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,8FAA8F;QAC9F,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB;;;WAGG;QACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,KAAK,IAAI,CAAC;KAClF,CAAC;IACF,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C;;;;OAIG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,yBAAyB,CAAC;CACzC"}

package/dist/types/components/menu/get-selected-key-from-path.d.ts

@@ -0,0 +1,8 @@
+import type { MenuNavListItem } from "./_internal/menu-nav-list/MenuNavList.types";
+/**
+ * Returns the menu item key that matches the current pathname.
+ * Supports the structure used by Menu: items can be sections (each with .items) or flat.
+ * For nested items (e.g. Catálogo > Productos), returns the sub-item key.
+ */
+export declare function getSelectedKeyFromPath(pathname: string, items: MenuNavListItem[]): string | undefined;
+//# sourceMappingURL=get-selected-key-from-path.d.ts.map

package/dist/types/components/menu/get-selected-key-from-path.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-selected-key-from-path.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/get-selected-key-from-path.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6CAA6C,CAAC;AAqCnF;;;;GAIG;AACH,wBAAgB,sBAAsB,CACrC,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,eAAe,EAAE,GACtB,MAAM,GAAG,SAAS,CAQpB"}

package/dist/types/components/menu/index.d.ts

@@ -1,4 +1,5 @@
 export { MenuComponent } from "./Menu";
+export { getSelectedKeyFromPath } from "./get-selected-key-from-path";
 export type { MenuComponentProps, MenuComponentTranslations, } from "./Menu.types";
 export { EnumMenuNavListItem } from "./_internal/menu-nav-list/MenuNavList.types";
 export type { MenuNavListItem } from "./_internal/menu-nav-list/MenuNavList.types";

package/dist/types/components/menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AACvC,YAAY,EACX,kBAAkB,EAClB,yBAAyB,GACzB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AAClF,YAAY,EAAE,eAAe,EAAE,MAAM,6CAA6C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AACvC,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AACtE,YAAY,EACX,kBAAkB,EAClB,yBAAyB,GACzB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AAClF,YAAY,EAAE,eAAe,EAAE,MAAM,6CAA6C,CAAC"}

package/dist/types/components/whatsapp-preview/WhatsAppPreview.d.ts

@@ -0,0 +1,19 @@
+import type React from "react";
+import type { WhatsAppPreviewProps } from "./WhatsAppPreview.types";
+/**
+ * WhatsAppPreview - Displays a realistic WhatsApp message bubble preview.
+ * Supports image, caption, CTA buttons, and compact/full variants.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <WhatsAppPreview
+ *   imageUrl="/path/to/image.jpg"
+ *   caption="Check out our new product!"
+ *   variant="full"
+ *   showHeader
+ * />
+ * ```
+ */
+export declare const WhatsAppPreview: React.FC<WhatsAppPreviewProps>;
+//# sourceMappingURL=WhatsAppPreview.d.ts.map

package/dist/types/components/whatsapp-preview/WhatsAppPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WhatsAppPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/whatsapp-preview/WhatsAppPreview.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EACX,oBAAoB,EAEpB,MAAM,yBAAyB,CAAC;AAWjC;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA6J1D,CAAC"}