@beweco/aurora-ui 1.0.1-beta.161 → 1.0.1-qa.165

package/dist/assets/css/theme.css

@@ -2,7 +2,7 @@
  * AUTOGENERADO — no editar a mano.
  * Tokens de tema: SOLO el bloque de tema (static). Export `./theme`; la app lo importa con theme(reference), que anula el static.
  * Fuente: scripts/generate-theme-tokens.mjs
- *   ← src/styles/colors.default.ts (14 packs)
+ *   ← src/styles/colors.default.ts (16 packs)
  *   ← scripts/v2-base-palette.json (paleta base heredada por `extend`)
  *
  * Regenerar y verificar contra el oráculo v2:
@@ -105,6 +105,8 @@
 	--color-danger-700: #920b3a;
 	--color-danger-800: #610726;
 	--color-danger-900: #310413;
+	/* Texto de marca sobre fondo claro: expone a las apps la utilidad `text-accent-soft-foreground`, que solo trae el tema de @heroui/styles (las apps no lo importan). */
+	--color-accent-soft-foreground: var(--accent-soft-foreground);
 	--aurora-shadow-small: 0px 0px 5px 0px rgb(0 0 0 / 0.02), 0px 2px 10px 0px rgb(0 0 0 / 0.06), 0px 0px 1px 0px rgb(0 0 0 / 0.3);
 	--aurora-shadow-medium: 0px 0px 15px 0px rgb(0 0 0 / 0.03), 0px 2px 30px 0px rgb(0 0 0 / 0.08), 0px 0px 1px 0px rgb(0 0 0 / 0.3);
 	--aurora-shadow-large: 0px 0px 30px 0px rgb(0 0 0 / 0.04), 0px 30px 60px 0px rgb(0 0 0 / 0.12), 0px 0px 1px 0px rgb(0 0 0 / 0.3);

package/dist/index.cjs.js

@@ -471,7 +471,7 @@ const COLOR_TOKENS$1 = {
         fg: "var(--color-primary-foreground)",
         softBg: "var(--accent-soft)",
         softBgHover: "var(--accent-soft-hover)",
-        softFg: "var(--color-primary)",
+        softFg: "var(--accent-soft-foreground)",
     },
     success: {
         bg: "var(--success)",
@@ -1014,8 +1014,8 @@ const COLOR_TOKENS = {
         bg: "var(--accent)",
         fg: "var(--color-primary-foreground)",
         flatBg: "color-mix(in srgb, var(--color-primary) 20%, transparent)",
-        flatFg: "var(--color-primary-600)",
-        tintFg: "var(--color-primary)",
+        flatFg: "var(--accent-soft-foreground)",
+        tintFg: "var(--accent-soft-foreground)",
     },
     success: {
         bg: "var(--success)",
@@ -2896,7 +2896,7 @@ const AnalyticsCard = ({ data, showTimePeriods = true, showDropdownMenu = true,
     return (jsxRuntime.jsx(Card, { className: "dark:border-default-100 border border-transparent", ...props, children: jsxRuntime.jsxs("section", { className: "flex flex-col flex-nowrap", children: [jsxRuntime.jsx("div", { className: "flex flex-col justify-between gap-y-2", children: jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-2", children: [jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-0", children: [jsxRuntime.jsx(H2, { children: t.title }), jsxRuntime.jsx(P, { children: t.description })] }), jsxRuntime.jsx("div", { className: "h-2", "aria-hidden": "true" }), showTimePeriods && (jsxRuntime.jsx(react.Tabs, { className: "self-end", onSelectionChange: (key) => handleTimePeriodChange(String(key)), children: jsxRuntime.jsx(react.Tabs.ListContainer, { className: "bg-default-100", children: jsxRuntime.jsxs(react.Tabs.List, { "aria-label": t.title, children: [jsxRuntime.jsxs(react.Tabs.Tab, { id: "6-months", className: "whitespace-nowrap", children: [t.months6, jsxRuntime.jsx(react.Tabs.Indicator, {})] }), jsxRuntime.jsxs(react.Tabs.Tab, { id: "3-months", className: "whitespace-nowrap", children: [t.months3, jsxRuntime.jsx(react.Tabs.Indicator, {})] }), jsxRuntime.jsxs(react.Tabs.Tab, { id: "30-days", className: "whitespace-nowrap", children: [t.days30, jsxRuntime.jsx(react.Tabs.Indicator, {})] }), jsxRuntime.jsxs(react.Tabs.Tab, { id: "7-days", className: "whitespace-nowrap", children: [t.days7, jsxRuntime.jsx(react.Tabs.Indicator, {})] }), jsxRuntime.jsxs(react.Tabs.Tab, { id: "24-hours", className: "whitespace-nowrap", children: [t.hours24, jsxRuntime.jsx(react.Tabs.Indicator, {})] })] }) }) })), showMetricCards && (jsxRuntime.jsx("div", { className: "mt-2 flex w-full items-center", children: jsxRuntime.jsx("div", { className: "-my-3 flex w-full max-w-[800px] items-center gap-x-3 overflow-x-auto py-3", children: data.map(({ key, change, changeType, type, value, title }) => (jsxRuntime.jsxs("button", { type: "button", className: cn("rounded-[12px] flex w-full flex-col gap-2 p-3 transition-colors", {
                                             "bg-default-100": activeChart === key,
                                         }), onClick: () => handleChartChange(key), children: [jsxRuntime.jsx("span", { className: cn("text-sm text-default-500 font-medium transition-colors", {
-                                                    "text-primary": activeChart === key,
+                                                    "text-accent-soft-foreground": activeChart === key,
                                                 }), children: title }), jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3", children: [jsxRuntime.jsx("span", { className: "text-foreground text-2xl font-bold", children: formatValue(value, type) }), jsxRuntime.jsx(Chip, { color: changeType === "positive"
                                                             ? "success"
                                                             : changeType === "negative"
@@ -4044,6 +4044,76 @@ const themeColors = {
             overlay: "#ffffff",
         },
     },
+    "amberYellow-light": {
+        extend: "light",
+        colors: {
+            primary: {
+                "50": "#FFFBE3",
+                "100": "#FFF4BD",
+                "200": "#FFEB92",
+                "300": "#FFDC5E",
+                "400": "#FFCF34",
+                "500": "#FFBF00",
+                "600": "#D8A200",
+                "700": "#AC7E00",
+                "800": "#805900",
+                "900": "#533600",
+                foreground: "#000",
+                DEFAULT: "#FFBF00",
+            },
+            secondary: {
+                "50": "#F3F7FD",
+                "100": "#D1DFFB",
+                "200": "#A5BEF7",
+                "300": "#7494E7",
+                "400": "#4E6FCF",
+                "500": "#1E40AF",
+                "600": "#153096",
+                "700": "#0F237D",
+                "800": "#091865",
+                "900": "#051053",
+                foreground: "#fff",
+                DEFAULT: "#1E40AF",
+            },
+            focus: "#FFBF00",
+            overlay: "#000000",
+        },
+    },
+    "amberYellow-dark": {
+        extend: "dark",
+        colors: {
+            primary: {
+                "50": "#533600",
+                "100": "#805900",
+                "200": "#AC7E00",
+                "300": "#D8A200",
+                "400": "#FFBF00",
+                "500": "#FFCF34",
+                "600": "#FFDC5E",
+                "700": "#FFEB92",
+                "800": "#FFF4BD",
+                "900": "#FFFBE3",
+                foreground: "#000",
+                DEFAULT: "#FFBF00",
+            },
+            secondary: {
+                "50": "#002147",
+                "100": "#003571",
+                "200": "#00489b",
+                "300": "#005cc4",
+                "400": "#006fee",
+                "500": "#2d88f1",
+                "600": "#59a1f4",
+                "700": "#86bbf7",
+                "800": "#b3d4fa",
+                "900": "#dfedfd",
+                foreground: "#fff",
+                DEFAULT: "#006fee",
+            },
+            focus: "#FFBF00",
+            overlay: "#ffffff",
+        },
+    },
     "coral-light": {
         extend: "light",
         colors: {
@@ -4552,7 +4622,7 @@ const themeColors = {
  * Los mismos nombres de tema que resuelve HeroUI v3 (`@heroui/styles`):
  * `:root, .light, .default, [data-theme=light], [data-theme=default]` para el claro y
  * `.dark, [data-theme=dark]` para el oscuro. `default` es un alias del claro en v3; en v2 no
- * existía. Más los 14 packs de aurora, cada uno en el lado de su `extend`, que son las clases
+ * existía. Más los 16 packs de aurora, cada uno en el lado de su `extend`, que son las clases
  * que `theme-packs.generated.css` declara y `applyThemeClass` pone en `<html>`.
  */
 const V3_ALIASES = {
@@ -6839,7 +6909,7 @@ const KanbanColumnComponent = ({ column, renderItem, onCardClick, cardClassName,
                         // siempre visible pero la story lo tapaba, y ahora queda apagado por defecto.
                         className: "static text-xs font-medium transform-none", style: column.countBadgeColor === "secondary"
                             ? SECONDARY_BADGE_STYLE
-                            : undefined, "aria-label": `${itemCount} ${t.itemsLabel}`, children: itemCount }))] })), jsxRuntime.jsx("div", { ref: scrollContainerRef, className: cn("flex-1 overflow-y-auto p-3 space-y-3", isDragOver && isEmpty && "min-h-24"), style: { maxHeight }, children: isEmpty ? (isDragOver && isDragging ? (jsxRuntime.jsx("div", { className: "h-24 border-2 border-dashed border-primary-300 rounded-lg bg-primary-50/50 flex items-center justify-center", children: jsxRuntime.jsx("span", { className: "text-primary-500 text-sm", children: t.dropHere }) })) : renderEmptyState ? (renderEmptyState(column)) : (jsxRuntime.jsx("div", { className: "flex items-center justify-center h-24 text-default-400 text-sm", children: column.emptyMessage || t.emptyMessage }))) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [column.items.map((item, index) => (jsxRuntime.jsxs("div", { onDragOver: (e) => handleDragOverItem(e, index), children: [isDragOver && dropIndex === index && (jsxRuntime.jsx("div", { className: "h-1 bg-primary-400 rounded-full mb-3 animate-pulse" })), jsxRuntime.jsx(KanbanCard, { item: item, columnId: column.id, index: index, renderContent: renderItem, onCardClick: onCardClick, className: cardClassName, isClickable: isCardClickable, isDraggable: isDraggable, onDragStart: onDragStart, onDragEnd: onDragEnd })] }, item.id))), isDragOver && dropIndex === column.items.length && (jsxRuntime.jsx("div", { className: "h-1 bg-primary-400 rounded-full mt-3 animate-pulse" })), column.isLoading && (jsxRuntime.jsx("div", { className: "flex items-center justify-center py-4", children: jsxRuntime.jsx(react.Spinner, { size: "sm", color: "accent" }) }))] })) })] }));
+                            : undefined, "aria-label": `${itemCount} ${t.itemsLabel}`, children: itemCount }))] })), jsxRuntime.jsx("div", { ref: scrollContainerRef, className: cn("flex-1 overflow-y-auto p-3 space-y-3", isDragOver && isEmpty && "min-h-24"), style: { maxHeight }, children: isEmpty ? (isDragOver && isDragging ? (jsxRuntime.jsx("div", { className: "h-24 border-2 border-dashed border-primary-300 rounded-lg bg-primary-50/50 flex items-center justify-center", children: jsxRuntime.jsx("span", { className: "text-accent-soft-foreground text-sm", children: t.dropHere }) })) : renderEmptyState ? (renderEmptyState(column)) : (jsxRuntime.jsx("div", { className: "flex items-center justify-center h-24 text-default-400 text-sm", children: column.emptyMessage || t.emptyMessage }))) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [column.items.map((item, index) => (jsxRuntime.jsxs("div", { onDragOver: (e) => handleDragOverItem(e, index), children: [isDragOver && dropIndex === index && (jsxRuntime.jsx("div", { className: "h-1 bg-primary-400 rounded-full mb-3 animate-pulse" })), jsxRuntime.jsx(KanbanCard, { item: item, columnId: column.id, index: index, renderContent: renderItem, onCardClick: onCardClick, className: cardClassName, isClickable: isCardClickable, isDraggable: isDraggable, onDragStart: onDragStart, onDragEnd: onDragEnd })] }, item.id))), isDragOver && dropIndex === column.items.length && (jsxRuntime.jsx("div", { className: "h-1 bg-primary-400 rounded-full mt-3 animate-pulse" })), column.isLoading && (jsxRuntime.jsx("div", { className: "flex items-center justify-center py-4", children: jsxRuntime.jsx(react.Spinner, { size: "sm", color: "accent" }) }))] })) })] }));
 };
 const KanbanColumn = $8WNJc$react.memo(KanbanColumnComponent);
 KanbanColumn.displayName = "KanbanColumn";
@@ -8166,12 +8236,6 @@ const MenuClawHistoryPanel = $8WNJc$react.memo(function MenuClawHistoryPanel({ i
     // que no quede a la vista solo en el agregado del lateral comprimido.
     const hasHiddenNews = $8WNJc$react.useMemo(() => !isExpanded &&
         items.slice(initialVisibleCount).some((item) => item.hasNews === true), [isExpanded, items, initialVisibleCount]);
-    // Plegado el botón es solo un icono y su nombre accesible es `aria-label` (que tapa
-    // cualquier `sr-only` hijo): con novedades lleva primero la acción y luego el aviso,
-    // para que el lector no anuncie solo «hay novedades» y pierda «Nueva conversación».
-    const collapsedAriaLabel = hasAnyNews
-        ? `${newLabel}, ${collapsedNewsLabel}`
-        : newLabel;
     const handleToggleExpand = $8WNJc$react.useCallback(() => {
         setIsExpanded((prev) => !prev);
     }, []);
@@ -8189,9 +8253,9 @@ const MenuClawHistoryPanel = $8WNJc$react.memo(function MenuClawHistoryPanel({ i
     if (isCollapsed && !onNewConversation) {
         return null;
     }
-    return (jsxRuntime.jsxs("div", { className: "flex max-h-[40%] min-h-0 flex-col gap-2 pb-3", children: [onNewConversation ? (jsxRuntime.jsxs(Button, { title: newLabel, "aria-label": isCollapsed ? collapsedAriaLabel : undefined, isIconOnly: isCollapsed, fullWidth: !isCollapsed, onPress: () => onNewConversation(), className: cn("h-9 shrink-0 bg-foreground text-sm font-medium text-background", isCollapsed
+    return (jsxRuntime.jsxs("div", { className: "flex max-h-[40%] min-h-0 flex-col gap-2 pb-3", children: [onNewConversation ? (jsxRuntime.jsxs(Button, { title: newLabel, "aria-label": isCollapsed ? newLabel : undefined, isIconOnly: isCollapsed, fullWidth: !isCollapsed, onPress: () => onNewConversation(), className: cn("h-9 shrink-0 bg-foreground text-sm font-medium text-background", isCollapsed
                     ? "w-9 min-w-9 self-center"
-                    : "justify-start gap-3 px-2"), children: [jsxRuntime.jsxs("span", { className: "relative flex h-5 w-5 shrink-0 items-center justify-center", children: [jsxRuntime.jsx(IconComponent, { icon: "solar:pen-new-square-linear", size: "md", "aria-hidden": true }), isCollapsed && hasAnyNews ? (jsxRuntime.jsx("span", { "data-history-news-aggregate": "", "aria-hidden": "true", className: "absolute -right-1 -top-1 h-2.5 w-2.5 rounded-full bg-primary ring-2 ring-background" })) : null] }), !isCollapsed ? (jsxRuntime.jsx("span", { className: "menu-claw-collapsible truncate", children: newLabel })) : null] })) : null, !isCollapsed && items.length > 0 ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("p", { className: "shrink-0 px-2 pb-1 pt-2 text-xs font-medium uppercase tracking-wide text-default-400", children: title }), jsxRuntime.jsx("ul", { "aria-label": title, className: "flex min-h-0 flex-1 flex-col gap-0.5 overflow-y-auto [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: visibleItems.map((item) => (jsxRuntime.jsx("li", { children: jsxRuntime.jsxs("button", { type: "button", disabled: item.disabled, "aria-disabled": item.disabled, title: item.title, onClick: () => handleItemPress(item), className: cn("flex min-h-9 w-full items-center gap-3 rounded-lg px-2 py-1.5 text-left text-sm text-default-600 transition-colors", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus", item.disabled
+                    : "justify-start gap-3 px-2"), children: [jsxRuntime.jsxs("span", { className: "relative flex h-5 w-5 shrink-0 items-center justify-center", children: [jsxRuntime.jsx(IconComponent, { icon: "solar:pen-new-square-linear", size: "md", "aria-hidden": true }), isCollapsed && hasAnyNews ? (jsxRuntime.jsx("span", { "data-history-news-aggregate": "", "aria-hidden": "true", className: "absolute -right-1 -top-1 h-2.5 w-2.5 rounded-full bg-primary ring-2 ring-background" })) : null] }), isCollapsed && hasAnyNews ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "sr-only", children: newLabel }), jsxRuntime.jsx("span", { className: "sr-only", children: collapsedNewsLabel })] })) : null, !isCollapsed ? (jsxRuntime.jsx("span", { className: "menu-claw-collapsible truncate", children: newLabel })) : null] })) : null, !isCollapsed && items.length > 0 ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("p", { className: "shrink-0 px-2 pb-1 pt-2 text-xs font-medium uppercase tracking-wide text-default-400", children: title }), jsxRuntime.jsx("ul", { "aria-label": title, className: "flex min-h-0 flex-1 flex-col gap-0.5 overflow-y-auto [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: visibleItems.map((item) => (jsxRuntime.jsx("li", { children: jsxRuntime.jsxs("button", { type: "button", disabled: item.disabled, "aria-disabled": item.disabled, title: item.title, onClick: () => handleItemPress(item), className: cn("flex min-h-9 w-full items-center gap-3 rounded-lg px-2 py-1.5 text-left text-sm text-default-600 transition-colors", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus", item.disabled
                                     ? "cursor-not-allowed opacity-50"
                                     : "hover:bg-default-100"), children: [jsxRuntime.jsx("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-default-400", children: jsxRuntime.jsx(IconComponent, { icon: "solar:chat-round-dots-linear", size: "md", "aria-hidden": true }) }), jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-1 flex-col", children: [jsxRuntime.jsx("span", { className: "truncate", children: item.title }), item.meta ? (jsxRuntime.jsx("span", { className: "truncate text-xs text-default-400", children: item.meta })) : null] }), item.hasNews === true ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { "data-history-news-dot": "", "aria-hidden": "true", className: "h-2 w-2 shrink-0 rounded-full bg-primary" }), jsxRuntime.jsx("span", { className: "sr-only", children: newsLabel })] })) : null] }) }, item.id))) }), hasHiddenItems ? (jsxRuntime.jsxs("button", { type: "button", onClick: handleToggleExpand, "aria-expanded": isExpanded, className: "flex w-full shrink-0 items-center gap-1.5 rounded-lg px-2 py-2 text-xs font-medium text-default-500 transition-colors hover:bg-default-100 hover:text-default-700 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus", children: [jsxRuntime.jsx(IconComponent, { icon: isExpanded
                                     ? "solar:alt-arrow-up-linear"
@@ -13854,7 +13918,7 @@ size, width = "100%", height = "auto", multiple = false, maxFiles = 1, maxFileSi
                                     ? "opacity-0"
                                     : "opacity-100 transition-opacity", children: jsxRuntime.jsxs("div", { className: `flex flex-col items-center ${size === "micro" ? "gap-0" : size === "small" ? "gap-0.5" : "gap-1"}`, children: [jsxRuntime.jsx(IconComponent, { icon: icon, size: size === "micro" ? "sm" : size === "small" ? "md" : "lg", className: `${size === "micro" ? "text-sm"
                                                 : size === "small" ? "text-base sm:text-lg"
-                                                    : "text-xl sm:text-2xl"} ${disabled ? "text-default-400" : iconColor || "text-primary"}` }), shouldShowText && (jsxRuntime.jsxs("div", { className: `text-center ${size === "micro" ? "px-0"
+                                                    : "text-xl sm:text-2xl"} ${disabled ? "text-default-400" : iconColor || "text-accent-soft-foreground"}` }), shouldShowText && (jsxRuntime.jsxs("div", { className: `text-center ${size === "micro" ? "px-0"
                                                 : size === "small" ? "px-0.5"
                                                     : "px-1"} ${size === "micro" || size === "small"
                                                 ? "upload-file-dropzone-text"
@@ -14529,7 +14593,7 @@ const NavigationLoadingOverlay = ({ isVisible, }) => {
  */
 const DrawerFiltersFooter = ({ onClearFilters, onCancel, onApplyFilters, translations = {}, }) => {
     const { clearFilters = "Limpiar filtro", cancel = "Cancelar", applyFilters = "Aplicar filtro", } = translations;
-    return (jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-10 bg-content1", children: [jsxRuntime.jsx(Button, { variant: "light", color: "primary", onPress: onClearFilters, className: "text-primary", children: clearFilters }), jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [jsxRuntime.jsx(Button, { variant: "bordered", color: "primary", onPress: onCancel, children: cancel }), jsxRuntime.jsx(Button, { variant: "solid", color: "primary", onPress: onApplyFilters, children: applyFilters })] })] }));
+    return (jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-10 bg-content1", children: [jsxRuntime.jsx(Button, { variant: "light", color: "primary", onPress: onClearFilters, className: "text-accent-soft-foreground", children: clearFilters }), jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [jsxRuntime.jsx(Button, { variant: "bordered", color: "primary", onPress: onCancel, children: cancel }), jsxRuntime.jsx(Button, { variant: "solid", color: "primary", onPress: onApplyFilters, children: applyFilters })] })] }));
 };
 
 /**
@@ -15074,7 +15138,7 @@ const MultiSelectFilter = ({ filter, value, onChange, translations, titleId }) =
                                 classNames: {
                                     inputWrapper: "bg-default-100 shadow-none border-0 min-h-9 h-9",
                                     input: "text-sm",
-                                }, endContent: jsxRuntime.jsx(IconComponent, { icon: "solar:magnifer-outline", className: "pointer-events-none shrink-0 text-default-400", size: "sm", "aria-hidden": true }), "aria-label": searchPlaceholder }) })), jsxRuntime.jsx("div", { className: "max-h-60 overflow-y-auto px-1 py-1", children: filteredData.length === 0 ? (jsxRuntime.jsx("p", { className: "px-2 py-3 text-center text-xs text-default-400", children: noResultsText })) : (jsxRuntime.jsx(react.ListBox, { "aria-label": filter.title, selectionMode: "multiple", selectionBehavior: "toggle", selectedKeys: selectedKeys, onSelectionChange: handleListboxSelectionChange, disallowEmptySelection: false, className: "w-full gap-0.5 p-0", children: filteredData.map((item) => (jsxRuntime.jsx(react.ListBoxItem, { id: item.value, textValue: item.label, className: "rounded-[12px] px-2 py-2.5 text-sm font-normal text-default-600 data-[hovered=true]:bg-default-100 data-[selectable=true]:focus:bg-default-100 data-[selected=true]:bg-primary-50/80 data-[selected=true]:font-medium data-[selected=true]:text-primary", children: item.label }, item.value))) })) })] }) })] }));
+                                }, endContent: jsxRuntime.jsx(IconComponent, { icon: "solar:magnifer-outline", className: "pointer-events-none shrink-0 text-default-400", size: "sm", "aria-hidden": true }), "aria-label": searchPlaceholder }) })), jsxRuntime.jsx("div", { className: "max-h-60 overflow-y-auto px-1 py-1", children: filteredData.length === 0 ? (jsxRuntime.jsx("p", { className: "px-2 py-3 text-center text-xs text-default-400", children: noResultsText })) : (jsxRuntime.jsx(react.ListBox, { "aria-label": filter.title, selectionMode: "multiple", selectionBehavior: "toggle", selectedKeys: selectedKeys, onSelectionChange: handleListboxSelectionChange, disallowEmptySelection: false, className: "w-full gap-0.5 p-0", children: filteredData.map((item) => (jsxRuntime.jsx(react.ListBoxItem, { id: item.value, textValue: item.label, className: "rounded-[12px] px-2 py-2.5 text-sm font-normal text-default-600 data-[hovered=true]:bg-default-100 data-[selectable=true]:focus:bg-default-100 data-[selected=true]:bg-primary-50/80 data-[selected=true]:font-medium data-[selected=true]:text-accent-soft-foreground", children: item.label }, item.value))) })) })] }) })] }));
 };
 // =========================================================================
 // RANGE FILTER
@@ -17778,7 +17842,7 @@ const RADIUS_CLASS = {
  */
 const FLAT_BASE = {
     default: "bg-default-100 text-default-foreground dark:bg-default-50/50",
-    primary: "bg-primary-50 text-primary-600 dark:bg-primary-50/50",
+    primary: "bg-primary-50 text-accent-soft-foreground dark:bg-primary-50/50",
     secondary: "bg-secondary-50 text-secondary-600 dark:bg-secondary-50/50",
     success: "bg-success-50 text-success-700 dark:bg-success-50/50 dark:text-success",
     warning: "bg-warning-50 text-warning-700 dark:bg-warning-50/50 dark:text-warning",
@@ -17796,7 +17860,7 @@ const FADED_BORDER = {
 /** `bordered`: `colorVariants.bordered.<color>` (+ `border-small`, sin fondo). */
 const BORDERED_BASE = {
     default: "bg-transparent border-default text-foreground",
-    primary: "bg-transparent border-primary text-primary",
+    primary: "bg-transparent border-primary text-accent-soft-foreground",
     secondary: "bg-transparent border-secondary text-secondary",
     success: "bg-transparent border-success text-success",
     warning: "bg-transparent border-warning text-warning",
@@ -19132,6 +19196,7 @@ const THEME_COLOR_HEX_MAP = {
     blue: "#006fee",
     purple: "#7828c8",
     yellow: "#ffd505",
+    amberYellow: "#ffbf00",
     green: "#16c964",
     coral: "#ff4f4f",
     skyBlue: "#60A5FA",
@@ -19155,6 +19220,15 @@ function colorDistance(a, b) {
     return (a[0] - b[0]) ** 2 + (a[1] - b[1]) ** 2 + (a[2] - b[2]) ** 2;
 }
 const THEME_COLORS = Object.keys(THEME_COLOR_HEX_MAP);
+/**
+ * Packs que solo se resuelven por coincidencia exacta de su hex, nunca como «el más
+ * cercano». `amberYellow` es una variante oscura de `yellow` pensada para una marca
+ * concreta: si entrara en la búsqueda por cercanía, los hex de marca ámbar/oliva de
+ * cualquier negocio cambiarían de pack (y con él su secundario y sus estados) sin
+ * haberlo elegido nadie.
+ */
+const EXACT_MATCH_ONLY = new Set(["amberYellow"]);
+const NEAREST_CANDIDATES = THEME_COLORS.filter((themeColor) => !EXACT_MATCH_ONLY.has(themeColor));
 function isHexColor(value) {
     return /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(value);
 }
@@ -19171,7 +19245,7 @@ function hexToThemeColor(hex) {
     const targetRgb = hexToRgb$1(hex);
     let closest = "blue";
     let minDistance = Number.POSITIVE_INFINITY;
-    for (const themeColor of THEME_COLORS) {
+    for (const themeColor of NEAREST_CANDIDATES) {
         const themeRgb = hexToRgb$1(THEME_COLOR_HEX_MAP[themeColor]);
         const dist = colorDistance(targetRgb, themeRgb);
         if (dist < minDistance) {
@@ -19229,7 +19303,7 @@ function hslToCssValue(h, s, l) {
  * Pasa un hex (`#rgb` o `#rrggbb`, en cualquier caja) a canales HSL.
  *
  * Se expone porque el hex es una de las dos formas en las que llega el `primary` del
- * tema —los 14 packs lo emiten así en `theme-tokens.generated.css`— y `linda-tones.ts`
+ * tema —los 16 packs lo emiten así en `theme-tokens.generated.css`— y `linda-tones.ts`
  * necesita esa misma conversión para derivar los tonos del aura. Antes de exportarla ya
  * había dos copias privadas de `hexToRgb` en esta carpeta; no hacía falta una tercera.
  */
@@ -19242,6 +19316,93 @@ function getContrastForeground(hex) {
     const luminance = (0.2126 * r + 0.7152 * g + 0.0722 * b) / 255;
     return luminance > 0.5 ? "0 0% 0%" : "0 0% 100%";
 }
+/** Contraste mínimo (WCAG) del texto de marca sobre el fondo suave de la propia marca. */
+const ACCENT_SOFT_FOREGROUND_MIN_CONTRAST = 3;
+/**
+ * Opacidad del fondo tintado más oscuro sobre el que se pinta el token en modo claro: el
+ * `flatBg` del Chip (accent al 20 % sobre blanco). El `--accent-soft` de HeroUI v3 en claro es
+ * más claro (15 %), así que lo que llega aquí llega también en el Button soft.
+ */
+const SOFT_TINT_ALPHA = 0.2;
+/**
+ * Proporción de `--accent` en la mezcla que trae HeroUI v3 en modo claro para
+ * `--accent-soft-foreground`: `color-mix(in oklab, var(--accent) 70%, var(--foreground) 30%)`
+ * (bloque `:root, .light, .default` de `@heroui/styles/dist/themes/default/variables.css`).
+ */
+const V3_LIGHT_ACCENT_SOFT_FOREGROUND_SHARE = 70;
+/** `--foreground` de HeroUI v3 en modo claro (`--eclipse`, oklch(0.2103 0.0059 285.89)). */
+const LIGHT_FOREGROUND_HEX = "#18181b";
+const toLinear = (c) => {
+    const v = c / 255;
+    return v <= 0.04045 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4;
+};
+const fromLinear = (c) => {
+    const v = c <= 0.0031308 ? 12.92 * c : 1.055 * c ** (1 / 2.4) - 0.055;
+    return Math.round(Math.min(Math.max(v, 0), 1) * 255);
+};
+function relativeLuminance([r, g, b]) {
+    return 0.2126 * toLinear(r) + 0.7152 * toLinear(g) + 0.0722 * toLinear(b);
+}
+function contrastRatio(a, b) {
+    const la = relativeLuminance(a);
+    const lb = relativeLuminance(b);
+    return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);
+}
+function rgbToOklab([r, g, b]) {
+    const [lr, lg, lb] = [toLinear(r), toLinear(g), toLinear(b)];
+    const l = Math.cbrt(0.4122214708 * lr + 0.5363325363 * lg + 0.0514459929 * lb);
+    const m = Math.cbrt(0.2119034982 * lr + 0.6806995451 * lg + 0.1073969566 * lb);
+    const s = Math.cbrt(0.0883024619 * lr + 0.2817188376 * lg + 0.6299787005 * lb);
+    return [
+        0.2104542553 * l + 0.793617785 * m - 0.0040720468 * s,
+        1.9779984951 * l - 2.428592205 * m + 0.4505937099 * s,
+        0.0259040371 * l + 0.7827717662 * m - 0.808675766 * s,
+    ];
+}
+function oklabToRgb([L, a, b]) {
+    const l = (L + 0.3963377774 * a + 0.2158037573 * b) ** 3;
+    const m = (L - 0.1055613458 * a - 0.0638541728 * b) ** 3;
+    const s = (L - 0.0894841775 * a - 1.291485548 * b) ** 3;
+    return [
+        fromLinear(4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s),
+        fromLinear(-1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s),
+        fromLinear(-0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s),
+    ];
+}
+/** `color-mix(in oklab, accent share, foreground resto)` calculado en sRGB. */
+function mixOklab(accent, foreground, share) {
+    const A = rgbToOklab(accent);
+    const F = rgbToOklab(foreground);
+    return oklabToRgb([0, 1, 2].map((i) => A[i] * share + F[i] * (1 - share)));
+}
+/**
+ * Proporción de `--accent` (0–100) con la que `--accent-soft-foreground` alcanza
+ * `minContrast` sobre su fondo tintado (el accent al 20 % sobre blanco), en modo claro.
+ *
+ * Devuelve `null` cuando la mezcla 70/30 que ya trae HeroUI v3 llega al mínimo: en esos
+ * temas no se pisa nada. Si no llega, la primera proporción que sí lo hace, bajando de 1 en 1
+ * (cuanto menos accent, más se acerca al color de texto). En el límite, 0: el propio
+ * `--foreground`.
+ */
+function getAccentSoftForegroundShare(accentHex, minContrast = ACCENT_SOFT_FOREGROUND_MIN_CONTRAST) {
+    const accent = hexToRgb(accentHex);
+    const foreground = hexToRgb(LIGHT_FOREGROUND_HEX);
+    const tint = accent.map((c) => c * SOFT_TINT_ALPHA + 255 * (1 - SOFT_TINT_ALPHA));
+    const reaches = (share) => contrastRatio(mixOklab(accent, foreground, share), tint) >= minContrast;
+    if (reaches(V3_LIGHT_ACCENT_SOFT_FOREGROUND_SHARE / 100)) {
+        return null;
+    }
+    for (let share = V3_LIGHT_ACCENT_SOFT_FOREGROUND_SHARE - 1; share > 0; share--) {
+        if (reaches(share / 100)) {
+            return share;
+        }
+    }
+    return 0;
+}
+/** Valor CSS de `--accent-soft-foreground` para una proporción de accent dada. */
+function accentSoftForegroundMix(share) {
+    return `color-mix(in oklab, var(--accent) ${share}%, var(--foreground))`;
+}
 const LIGHT_SHADE_LIGHTNESS = {
     "50": 95,
     "100": 90,
@@ -19290,6 +19451,8 @@ function generateThemeColorScale(hex, mode) {
     return { shades, foreground, defaultValue };
 }
 
+/** La mezcla que trae HeroUI v3 para `--accent-soft-foreground` en modo claro. */
+const V3_ACCENT_SOFT_FOREGROUND = "color-mix(in oklab, var(--accent) 70%, var(--foreground) 30%)";
 const PRIMARY_SHADES = [
     "50",
     "100",
@@ -19309,6 +19472,7 @@ const CUSTOM_PROPERTIES = [
     "--color-focus",
     "--accent",
     "--accent-foreground",
+    "--accent-soft-foreground",
 ];
 /**
  * `generateThemeColorScale` devuelve canales HSL sueltos (`"212 100% 46.67%"`), que es lo que
@@ -19338,6 +19502,16 @@ function applyCustomPrimaryColor(hex, mode) {
     style.setProperty("--color-focus", primary);
     style.setProperty("--accent", primary);
     style.setProperty("--accent-foreground", primaryForeground);
+    // Mismo cálculo que los packs (generate-theme-tokens.mjs). Se escribe SIEMPRE en línea,
+    // también cuando basta la mezcla de v3: la clase del pack más cercano puede traer su propia
+    // proporción, calculada para SU color, y aquí manda el de la marca.
+    // En oscuro no se pisa: vale la mezcla propia del tema oscuro de v3.
+    if (mode === "dark") {
+        style.removeProperty("--accent-soft-foreground");
+        return;
+    }
+    const share = getAccentSoftForegroundShare(hex);
+    style.setProperty("--accent-soft-foreground", share === null ? V3_ACCENT_SOFT_FOREGROUND : accentSoftForegroundMix(share));
 }
 function removeCustomPrimaryColor() {
     const style = document.documentElement.style;
@@ -19843,6 +20017,7 @@ Object.defineProperty(exports, "loadIcons", {
     enumerable: true,
     get: function () { return react$1.loadIcons; }
 });
+exports.ACCENT_SOFT_FOREGROUND_MIN_CONTRAST = ACCENT_SOFT_FOREGROUND_MIN_CONTRAST;
 exports.ALL_THEMES = ALL_THEMES;
 exports.AURORA_THEME_FAMILIES = AURORA_THEME_FAMILIES;
 exports.AURORA_THEME_REGISTRY = AURORA_THEME_REGISTRY;
@@ -19959,12 +20134,14 @@ exports.ToastContext = ToastContext;
 exports.Tooltip = Tooltip;
 exports.TwoColumnLayoutAgent = TwoColumnLayoutAgent;
 exports.UploadFile = UploadFile;
+exports.V3_LIGHT_ACCENT_SOFT_FOREGROUND_SHARE = V3_LIGHT_ACCENT_SOFT_FOREGROUND_SHARE;
 exports.VerticalSteps = VerticalSteps;
 exports.ViolinPlot = ViolinPlot;
 exports.WhatsAppPreview = WhatsAppPreview;
 exports.Wizard = Wizard;
 exports.WizardNavigation = WizardNavigation;
 exports.WizardSidebar = WizardSidebar;
+exports.accentSoftForegroundMix = accentSoftForegroundMix;
 exports.applyCustomPrimaryColor = applyCustomPrimaryColor;
 exports.applyLindaTones = applyLindaTones;
 exports.cn = cn;
@@ -19983,6 +20160,7 @@ exports.forceLightOnlyThemeBeforeReact = forceLightOnlyThemeBeforeReact;
 exports.formatAuroraThemeTooltip = formatAuroraThemeTooltip;
 exports.formatDonutPercent = formatDonutPercent;
 exports.generateThemeColorScale = generateThemeColorScale;
+exports.getAccentSoftForegroundShare = getAccentSoftForegroundShare;
 exports.getContrastForeground = getContrastForeground;
 exports.getRegisteredThemeColorBases = getRegisteredThemeColorBases;
 exports.getSelectedKeyFromPath = getSelectedKeyFromPath;