@beweco/aurora-ui 1.0.0-beta.138 → 1.0.0-beta.140

package/dist/index.cjs.js

@@ -19,47 +19,159 @@ const CardBody = react.Card.Content;
 // Breadcrumbs: el `Breadcrumbs` raíz sobrevive igual; su hijo suelto se renombra Y cambia grafía
 // (`BreadcrumbItem` v2 → `BreadcrumbsItem`/`Breadcrumbs.Item` v3, con "s").
 const BreadcrumbItem = react.Breadcrumbs.Item;
-// Autocomplete / Select: los ítems v2 (`AutocompleteItem`, `SelectItem`) y sus secciones
-// (`SelectSection`) no sobreviven planos en v3 — se resuelven con `ListBox.Item`/
-// `ListBox.Section`, la misma pieza que usan tanto el `ComboBox` (ver `AuraAutocomplete`) como el
-// `Select` compound.
-//
-// ⚠️ Limitación conocida (ver decisiones-aceptadas-f2.md, D-F2-2): v2 identificaba cada item por
-// el `key` de React; v3 usa `id` explícito. El código v2 existente (que solo pasa `key`/
-// `textValue`) sigue compilando y seleccionando bien porque react-aria-components cae al `key` de
-// React cuando no hay `id` en colecciones estáticas (verificado en Storybook) — pero si algún
-// consumidor lee la selección por otra vía, debe migrar sus items a `id` explícito.
 const AutocompleteItem = react.ListBoxItem;
 const SelectItem = react.ListBoxItem;
 const SelectSection = react.ListBoxSection;
 // ---------------------------------------------------------------------------
 // Renombrados simples (el nombre v2 desaparece del todo, 1:1 con un nombre v3)
 // ---------------------------------------------------------------------------
-/** Progress → ProgressBar. */
-const Progress = react.ProgressBar;
+// Progress: ver el bloque «Progress (v2) sobre ProgressBar (v3)» más abajo.
 /** Divider → Separator. El uso INTERNO de la librería ya migró a `Separator` directo
  * (`TagsFilter.tsx`); este shim es solo para las apps, que siguen importando `Divider`. */
 const Divider = react.Separator;
-// ---------------------------------------------------------------------------
-// Eliminados
-// ---------------------------------------------------------------------------
 /**
- * `HeroUIProvider` ya no existe en v3 (los componentes no necesitan Provider). Shim no-op: pasa
- * los `children` tal cual para que el `<HeroUIProvider>` (aliased `AuroraProvider`) que envuelve
- * la raíz de las 4 apps siga compilando y renderizando sin cambios.
+ * El relleno de v3 se pinta con `var(--progress-bar-fill)` (`progress-bar.css`), que cada variante
+ * de color fija en la capa `components`. v3 tiene 5 colores y v2 seis, y dos NO coinciden:
+ *
+ * | v2 | literal v2 (`indicator`) | v3 con el mismo nombre | aquí |
+ * |---|---|---|---|
+ * | `primary` (default) | `bg-primary` | — (no existe) | `accent`, que en este repo ES `--color-primary` (`theme-packs.generated.css`: `--accent: var(--color-primary)`) |
+ * | `default` | `bg-default-400` (gris medio) | `--default-foreground` (casi negro) | falso amigo: se repone el gris de v2 |
+ * | `secondary` | `bg-secondary` | — | el `--color-secondary` del pack |
+ *
+ * La variable se pisa con una utilidad (capa `utilities` > `components`), así que no depende del
+ * orden del CSS. `success`/`warning`/`danger` son el mismo nombre y el mismo token en las dos.
+ */
+const PROGRESS_FILL_OVERRIDE = {
+    default: "[--progress-bar-fill:var(--color-default-400)]",
+    secondary: "[--progress-bar-fill:var(--color-secondary)]",
+};
+const PROGRESS_V3_COLOR = {
+    default: undefined,
+    primary: "accent",
+    secondary: undefined,
+    success: "success",
+    warning: "warning",
+    danger: "danger",
+    accent: "accent",
+};
+/** Los hijos que el consumidor ya trae, aplanando Fragments (`Children.toArray` NO los aplana). */
+function flattenChildren(children) {
+    const out = [];
+    for (const child of $8WNJc$react.Children.toArray(children)) {
+        if (!$8WNJc$react.isValidElement(child)) {
+            continue;
+        }
+        if (child.type === $8WNJc$react.Fragment) {
+            out.push(...flattenChildren(child.props.children));
+        }
+        else {
+            out.push(child);
+        }
+    }
+    return out;
+}
+/**
+ * `Progress` de v2 (TECH-2459, hallazgo beweossmbs 23-sep: «es un alias del ProgressBar crudo y
+ * SIN HIJOS NO PINTA»).
+ *
+ * EL DEFECTO. Hasta aquí `Progress` era `ProgressBar` a secas, y el `ProgressBar` de v3 es un
+ * compound: la raíz solo publica el estado, la barra la pintan `ProgressBar.Track` +
+ * `ProgressBar.Fill`, y la etiqueta y el valor, `Label` + `ProgressBar.Output`. El JSX v2 de las
+ * apps (`<Progress value={40} color="primary" showValueLabel />`, 10 usos en beweossmbs) no trae
+ * ninguna de esas piezas, así que salía un `<div role="progressbar">` VACÍO: ni pista, ni relleno,
+ * ni texto. Además `color="primary"` no es un color de v3 y `showValueLabel`/`label`/`classNames`
+ * se descartaban.
+ *
+ * LO QUE HACE. Acepta la API v2 y monta por dentro la anatomía de v3. Es **idempotente por
+ * identidad de `child.type`**: si la app ya pasa `ProgressBar.Track` (o `Progress.Track`),
+ * `ProgressBar.Output` o `Label`, esa pieza no se añade otra vez (mismo criterio que la fachada
+ * `Tabs` con su indicador). Children como función se respetan tal cual.
+ *
+ * LO QUE NO COPIA DE v2, por §9.1 (verse como v3): las alturas de pista (v2 `h-1`/`h-3`/`h-5`,
+ * v3 `h-1`/`h-2`/`h-3`), el radio completo y el fondo `default-300/50` de la pista, y el tamaño de
+ * letra por `size` de la etiqueta. `size` elige el tamaño de v3 del mismo nombre.
+ */
+function ProgressFacade({ label, showValueLabel = false, size = "md", color = "primary", classNames, className, children, ...props }) {
+    if (typeof children === "function") {
+        return (jsxRuntime.jsx(react.ProgressBar, { ...props, size: size, color: PROGRESS_V3_COLOR[color], className: react.cn(PROGRESS_FILL_OVERRIDE[color], classNames?.base, className), children: children }));
+    }
+    const own = flattenChildren(children);
+    const hasTrack = own.some((c) => c.type === react.ProgressBar.Track || c.type === react.ProgressBar.Fill);
+    const hasOutput = own.some((c) => c.type === react.ProgressBar.Output);
+    const hasLabel = own.some((c) => c.type === react.Label);
+    return (jsxRuntime.jsxs(react.ProgressBar, { ...props, size: size, color: PROGRESS_V3_COLOR[color], 
+        // v2: `cn(classNames?.base, className)` en la raíz (`use-progress.mjs`). La variable del
+        // color va primero para que un `[--progress-bar-fill:…]` del consumidor la sustituya.
+        className: react.cn(PROGRESS_FILL_OVERRIDE[color], classNames?.base, className), children: [label != null && label !== false && !hasLabel && (jsxRuntime.jsx(react.Label, { className: classNames?.label, children: label })), showValueLabel && !hasOutput && (jsxRuntime.jsx(react.ProgressBar.Output, { className: classNames?.value })), children, !hasTrack && (jsxRuntime.jsx(react.ProgressBar.Track, { className: classNames?.track, children: jsxRuntime.jsx(react.ProgressBar.Fill, { className: classNames?.indicator }) }))] }));
+}
+/**
+ * `Progress` de v2 con la anatomía de v3 dentro, y con los estáticos del compound colgados
+ * (`Progress.Track`, `Progress.Fill`, `Progress.Output`, `Progress.Root`) para que el marcado v3
+ * siga compilando: son los MISMOS objetos que `ProgressBar.*`, así que la detección por identidad
+ * los reconoce vengan por un nombre o por otro.
+ */
+const Progress = Object.assign(ProgressFacade, {
+    Root: react.ProgressBar.Root,
+    Output: react.ProgressBar.Output,
+    Track: react.ProgressBar.Track,
+    Fill: react.ProgressBar.Fill,
+});
+/**
+ * `HeroUIProvider` ya no existe en v3 (los componentes no necesitan Provider para pintarse). Pero
+ * el de v2 hacía dos cosas que react-aria sí necesita y que las apps no pueden montar por su
+ * cuenta (todo pasa por aurora-ui): `locale` → `I18nProvider` y `navigate`/`useHref` →
+ * `RouterProvider`. Este shim las repone, cada una SOLO cuando se pasa; sin props pasa los
+ * `children` tal cual, como el no-op que era. El resto de props v2 se aceptan y se ignoran (ver
+ * `HeroUIProviderProps`). Orden de anidado idéntico al de v2: `I18nProvider` por fuera,
+ * `RouterProvider` por dentro.
  */
-function HeroUIProvider({ children }) {
-    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
+function HeroUIProvider({ children, locale, navigate, useHref, }) {
+    let contents = children;
+    if (navigate) {
+        contents = (jsxRuntime.jsx(react.RouterProvider, { navigate: navigate, useHref: useHref, children: contents }));
+    }
+    if (locale) {
+        contents = jsxRuntime.jsx(react.I18nProvider, { locale: locale, children: contents });
+    }
+    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: contents });
 }
+/*
+ * Literales del `tv` de v2, escritos enteros para que Tailwind 4 los genere (solo emite lo que
+ * aparece en el fuente). v2 decía `rounded-small`/`rounded-large` —clases del plugin `heroui()`,
+ * muertas sin él y que `cn` BORRARÍA— con los valores de su tema: small 8px, large 14px (los
+ * mismos que usan `RADIUS_CLASS` de `Select`/`Input` para `sm`/`lg`). `md` era `rounded-md` a secas
+ * en el `tv` de v2 (el de Tailwind, 6px), no el `medium` del tema: se copia tal cual.
+ */
+const IMAGE_RADIUS_CLASS = {
+    none: "rounded-none",
+    sm: "rounded-[8px]",
+    md: "rounded-md",
+    lg: "rounded-[14px]",
+    full: "rounded-full",
+};
 /**
  * `Image` se elimina en v3 (usar `<img>` nativo, mismo criterio aplicado en
- * `SocialMediaPreview`/`WhatsAppPreview`). Shim: mismo nombre, props de un `<img>` nativo — NO
- * reproduce `radius`/`isBlurred`/`isZoomed`/`fallbackSrc` de v2 (sin equivalente razonable sin
- * reescribir una librería de imágenes completa); limitación documentada.
+ * `SocialMediaPreview`/`WhatsAppPreview`). Shim: un `<img>` nativo con la API de v2 que las apps
+ * escriben (TECH-2459, hallazgo beweossmbs 23-sep: 12 `<Image>` en la app; `radius` en 3,
+ * `classNames` en 3, `removeWrapper` en 2; 0 usos de `isZoomed`/`isBlurred`/`fallbackSrc`/`shadow`).
+ *
+ * - `radius`: con el default de v2 (`lg`). Sin él, las 9 imágenes que NO pasan `radius` salían con
+ *   esquinas rectas en vez de las redondeadas de v2. Va primero en el `cn`: la clase de la app gana.
+ * - `className` + `classNames.img`: en v2 las dos iban al `<img>` (`use-image.mjs`:
+ *   `cn(className, classNames?.img)`), y así aquí.
+ * - `classNames.wrapper`/`zoomedWrapper`/`blurredImg` y `removeWrapper` se ACEPTAN y no pintan: este
+ *   shim no monta envoltorio. En v2 el `<div>` existía para el skeleton, el zoom y el desenfoque
+ *   (`image.mjs`), y le ponía `max-width: fit-content` en línea — que es exactamente lo que los dos
+ *   `classNames.wrapper` medidos deshacen («El wrapper de HeroUI Image trae `max-w-fit`», con
+ *   `w-full !max-w-full`). Sin envoltorio, el `<img>` con su `w-full` ya ocupa el ancho: el efecto
+ *   buscado sale sin la pieza.
+ * - NO reproduce `isZoomed`/`isBlurred`/`fallbackSrc`/`shadow`/skeleton (0 usos medidos).
  */
-function Image$1(props) {
+function Image$1({ radius = "lg", classNames, removeWrapper: _removeWrapper, className, ...props }) {
+    return (
     // biome-ignore lint/a11y/useAltText: passthrough genérico, `alt` lo exige ComponentProps<'img'>
-    return jsxRuntime.jsx("img", { ...props });
+    jsxRuntime.jsx("img", { ...props, className: react.cn(IMAGE_RADIUS_CLASS[radius], className, classNames?.img) }));
 }
 // ---------------------------------------------------------------------------
 // Hooks
@@ -84,6 +196,42 @@ function useDisclosure(props) {
     };
 }
 
+/**
+ * `click` nativo → un `PressEvent` con la forma del de react-aria.
+ *
+ * Lo usan las piezas de esta librería que NO pasan por un componente de react-aria y aun así
+ * exponen el `onPress` de v2: la `Card` pulsable (`<button>` nativo) y el `Button` con `href`
+ * (`<a>` nativo). No se importa `usePress` de react-aria porque no es `external` en
+ * `rollup.config.mjs`: se metería una segunda copia dentro del bundle.
+ *
+ * Un `click` nativo ya cubre ratón, táctil y teclado (Enter/Espacio en un botón, Enter en un
+ * enlace). `detail === 0` es un click sintético —teclado o `.click()`—, y como react-aria, se
+ * sitúa entonces el punto en el centro del elemento (lo necesita la onda expansiva).
+ */
+function pressEventFromClick(event) {
+    const target = event.currentTarget;
+    const rect = target.getBoundingClientRect();
+    const fromKeyboard = event.detail === 0;
+    const native = event.nativeEvent;
+    const pointerType = fromKeyboard
+        ? "keyboard"
+        : native.pointerType === "touch" || native.pointerType === "pen"
+            ? native.pointerType
+            : "mouse";
+    return {
+        type: "press",
+        pointerType,
+        target,
+        shiftKey: event.shiftKey,
+        ctrlKey: event.ctrlKey,
+        metaKey: event.metaKey,
+        altKey: event.altKey,
+        x: fromKeyboard ? rect.width / 2 : event.clientX - rect.left,
+        y: fromKeyboard ? rect.height / 2 : event.clientY - rect.top,
+        continuePropagation: () => undefined,
+    };
+}
+
 /** `clamp(0.01 * size, 0.2, size > 100 ? 0.75 : 0.5)` de v2, en ms. */
 function duracionDeOnda(size) {
     const maximo = size > 100 ? 750 : 500;
@@ -376,6 +524,77 @@ const SHAPE_CLASS = {
     outline: "border-2",
     ghost: "",
 };
+// ── Props DOM que el `Button` de react-aria-components descarta ────────────────────────────
+//
+// `title` (tooltip nativo, 3 usos en beweossmbs: los «Cancelar importación»), `tabIndex` (2),
+// `aria-busy`/`aria-live`… no llegaban al `<button>`: el `Button` de react-aria-components pasa
+// solo lo que deja su `filterDOMProps({ global: true })` más lo que genera `useButton` (ver
+// `ButtonDOMProps` en `Button.types.ts`). v2 los pasaba todos. Se reponen con la prop `render` de
+// react-aria (el mismo `<button>`, con el `ref` ya conectado en `domProps`). Van DESPUÉS de lo
+// que genera react-aria, como en v2 (`mergeProps(ariaButtonProps, …, filterDOMProps(otherProps))`
+// → gana el consumidor): medido, react-aria escribe `tabIndex="0"` en el botón, y el
+// `tabIndex={-1}` que pasa `client-table-row` para sacarlo del orden de tabulación se perdía.
+const DOM_ATTRS_DESCARTADOS = new Set([
+    "title",
+    "tabIndex",
+    "role",
+    "accessKey",
+    "draggable",
+    "spellCheck",
+]);
+function atributosDescartados(props) {
+    const out = {};
+    for (const [key, value] of Object.entries(props)) {
+        if (value !== undefined &&
+            (DOM_ATTRS_DESCARTADOS.has(key) || key.startsWith("aria-"))) {
+            out[key] = value;
+        }
+    }
+    return out;
+}
+// Props de react-aria que NO son atributos DOM: en el camino de enlace (un `<a>` nativo, que no
+// pasa por react-aria) no se reenvían, o React avisaría de atributos desconocidos.
+const PROPS_SOLO_REACT_ARIA = new Set([
+    "onPressStart",
+    "onPressEnd",
+    "onPressChange",
+    "onPressUp",
+    "onHoverStart",
+    "onHoverEnd",
+    "onHoverChange",
+    "onFocusChange",
+    "excludeFromTabOrder",
+    "preventFocusOnPress",
+    "slot",
+    "fullWidth",
+    "render",
+    "ref",
+    "type",
+    "form",
+    "formAction",
+    "formEncType",
+    "formMethod",
+    "formNoValidate",
+    "formTarget",
+    "name",
+    "value",
+]);
+function propsDeEnlace(props) {
+    const out = {};
+    for (const [key, value] of Object.entries(props)) {
+        if (value === undefined || PROPS_SOLO_REACT_ARIA.has(key)) {
+            continue;
+        }
+        if (DOM_ATTRS_DESCARTADOS.has(key) ||
+            key === "id" ||
+            key.startsWith("aria-") ||
+            key.startsWith("data-") ||
+            /^on[A-Z]/.test(key)) {
+            out[key] = value;
+        }
+    }
+    return out;
+}
 /**
  * Botón genérico basado en HeroUI v3 siguiendo las reglas de diseño BeweOS (TECH-2459 · F3.0).
  *
@@ -391,8 +610,15 @@ const SHAPE_CLASS = {
  * - `disableRipple`: v3 no tiene ripple — reimplementado en `_internal/ripple.tsx`, así que la
  *   prop vuelve a apagar algo.
  * - `ai`: aura de Linda para las acciones que hace la IA (ver `Button.types.ts`).
+ * - Props DOM (`title`, `tabIndex`, `aria-*`…): llegan al `<button>` aunque react-aria las
+ *   descarte (ver `DOM_ATTRS_DESCARTADOS`). `disabled` nativo equivale a `isDisabled`.
+ * - `as="a"` / `href` (API v2): renderiza un `<a>` con las mismas clases y colores del botón.
  */
-const Button = ({ color = "primary", size = "md", variant = "solid", radius = "sm", startContent, endContent, isLoading = false, spinner, spinnerPlacement = "start", isIconOnly = false, isDisabled, ai, className, style, children, disableRipple = false, disableAnimation = false, onPress, ...rest }) => {
+const Button = ({ color = "primary", size = "md", variant = "solid", radius = "sm", startContent, endContent, isLoading = false, spinner, spinnerPlacement = "start", isIconOnly = false, isDisabled, ai, className, style, children, disableRipple = false, disableAnimation = false, onPress, disabled, as, href, target, rel, download, hrefLang, referrerPolicy, ...rest }) => {
+    // v2 reenviaba `disabled` tal cual al `<button>` nativo, que así quedaba deshabilitado; en v3
+    // se descartaba y el botón seguía pulsable. Se trata como `isDisabled`.
+    const deshabilitado = Boolean(isDisabled || disabled || isLoading);
+    const esEnlace = href !== undefined || as === "a";
     const shape = SHAPE_BY_VARIANT$1[variant];
     const v3Variant = BASE_V3_VARIANT[shape];
     const spinnerNode = spinner ?? jsxRuntime.jsx(react.Spinner, { size: "sm", color: "current" });
@@ -430,20 +656,62 @@ const Button = ({ color = "primary", size = "md", variant = "solid", radius = "s
      * `.linda-aura > *` ya los alcanza.
      */
     const contenido = ai ? (jsxRuntime.jsx("span", { className: "linda-aura-content", children: children })) : (children);
-    return (jsxRuntime.jsxs(react.Button, { ...rest, variant: v3Variant, size: size, isIconOnly: isIconOnly, isPending: isLoading, isDisabled: isDisabled || isLoading, onPress: alPulsar, className: [
-            SHAPE_CLASS[shape],
-            RADIUS_CLASS$a[radius],
-            ai ? CLASE_AURA[ai] : "",
-            // P-05: v2 apagaba transición + hundido con esta prop; v3 no tiene la prop, así
-            // que el interruptor es una clase propia (`Button.css`).
-            disableAnimation ? "button--no-animation" : "",
-            // P-06b: hover atenuado de v2 en vez del cambio de fondo de v3 (ver
-            // `HOVER_ATENUADO` arriba y `neutralize-v3.css`).
-            HOVER_ATENUADO[shape] ? "button--hover-dim" : "",
-            className,
-        ]
-            .filter(Boolean)
-            .join(" "), style: { ...colorStyle$1(color, shape), ...style }, children: [isLoading && spinnerPlacement === "start" && spinnerNode, !isLoading && startContent, contenido, !isLoading && endContent, isLoading && spinnerPlacement === "end" && spinnerNode, ondas.length > 0 && jsxRuntime.jsx(CapaRipple, { ondas: ondas, onFin: quitar })] }));
+    const claseForma = [
+        SHAPE_CLASS[shape],
+        RADIUS_CLASS$a[radius],
+        ai ? CLASE_AURA[ai] : "",
+        // P-05: v2 apagaba transición + hundido con esta prop; v3 no tiene la prop, así
+        // que el interruptor es una clase propia (`Button.css`).
+        disableAnimation ? "button--no-animation" : "",
+        // P-06b: hover atenuado de v2 en vez del cambio de fondo de v3 (ver
+        // `HOVER_ATENUADO` arriba y `neutralize-v3.css`).
+        HOVER_ATENUADO[shape] ? "button--hover-dim" : "",
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    const estilo = { ...colorStyle$1(color, shape), ...style };
+    const hijos = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [isLoading && spinnerPlacement === "start" && spinnerNode, !isLoading && startContent, contenido, !isLoading && endContent, isLoading && spinnerPlacement === "end" && spinnerNode, ondas.length > 0 && jsxRuntime.jsx(CapaRipple, { ondas: ondas, onFin: quitar })] }));
+    /*
+     * `as="a"` / `href` — el botón-enlace de v2 (3 usos en beweossmbs: «abrir contacto en
+     * pestaña nueva», «ver publicación», el enlace de agenda de la demo de referidos).
+     *
+     * v3 no acepta `href` en `Button` (trampa 5 de la skill `auraui-components`) y el `href`
+     * caía sin más: el botón no navegaba. Se renderiza un `<a>` NATIVO con las clases del
+     * botón (`buttonVariants` de v3, las mismas que pone `Button`) + las de la fachada.
+     *
+     * Por qué no las otras dos vías: `render` del `Button` de react-aria devolviendo un `<a>`
+     * provoca un `console.warn` en desarrollo (espera el MISMO elemento); y el `Link` de v3
+     * añade la clase `.link`, y `.link.button { gap: 0 }` se come el hueco del icono. El `:hover`
+     * de `.button`/`.button--hover-dim` funciona igual en un `<a>` (el CSS escucha `:hover` además
+     * de `data-hovered`).
+     */
+    if (esEnlace) {
+        const alPulsarEnlace = (evento) => {
+            if (deshabilitado) {
+                evento.preventDefault();
+                return;
+            }
+            rest.onClick?.(evento);
+            alPulsar(pressEventFromClick(evento));
+        };
+        return (jsxRuntime.jsx("a", { ...propsDeEnlace(rest), "data-slot": "button", "data-disabled": deshabilitado || undefined, "aria-disabled": deshabilitado || undefined, 
+            // Deshabilitado, sin `href`: un `<a>` no tiene `disabled` y seguiría navegando.
+            href: deshabilitado ? undefined : href, target: target, rel: rel, download: download, hrefLang: hrefLang, referrerPolicy: referrerPolicy, className: react.cn(react.buttonVariants({
+                variant: v3Variant,
+                size,
+                isIconOnly,
+                fullWidth: rest.fullWidth,
+            }), claseForma), style: estilo, onClick: alPulsarEnlace, children: hijos }));
+    }
+    const extras = atributosDescartados(rest);
+    const renderConExtras = Object.keys(extras).length > 0
+        ? (domProps) => {
+            const merged = { ...domProps, ...extras };
+            return (jsxRuntime.jsx("button", { ...merged }));
+        }
+        : undefined;
+    return (jsxRuntime.jsx(react.Button, { ...rest, ...(renderConExtras ? { render: renderConExtras } : {}), variant: v3Variant, size: size, isIconOnly: isIconOnly, isPending: isLoading, isDisabled: deshabilitado, onPress: alPulsar, className: claseForma, style: estilo, children: hijos }));
 };
 
 // TECH-2459 · F3.0 — Matriz de traducción v2 → v3 (mismo mecanismo que Button, documentado en
@@ -489,6 +757,21 @@ const SHAPE_BY_VARIANT = {
     flat: "soft",
     bordered: "outline",
     faded: "outline",
+    // `shadow` de v2 es `solid` + sombra teñida (ver `SHADOW_CLASS`).
+    shadow: "solid",
+};
+// `variant="shadow"` de v2, literal de `@heroui/theme@2.4.15` (`dist/utils/variants.js`,
+// `colorVariants.shadow`): `shadow-lg shadow-<color>/40 bg-<color> text-<color>-foreground`
+// (`default` usa `/50`). El relleno y el texto son los de `solid`; aquí solo se añade la sombra.
+// Clases literales (no plantillas) para que Tailwind las genere al escanear `src/`. Los 5 colores
+// fijos de Aurora (red/purple/…) no existían en v2 con `shadow`: reciben la sombra neutra.
+const SHADOW_CLASS$1 = {
+    default: "shadow-lg shadow-default/50",
+    primary: "shadow-lg shadow-primary/40",
+    secondary: "shadow-lg shadow-secondary/40",
+    success: "shadow-lg shadow-success/40",
+    warning: "shadow-lg shadow-warning/40",
+    danger: "shadow-lg shadow-danger/40",
 };
 // TECH-2459 · F5 · P-08c — Tamaños de v2 (`chip.ts`): la altura era FIJA y el texto más grande que
 // en v3, y el sangrado horizontal salía de dos slots (`base` + `content`):
@@ -726,7 +1009,7 @@ function colorStyle(color, shape) {
  * y el hueco que queda tras el botón de cierre sean distintos, como en v2 (ver `SIZE_CLASS` y
  * `CONTENT_PADDING`).
  */
-const Chip = ({ color = "default", variant = "solid", size = "md", radius = "full", startContent, endContent, onClose, isDisabled = false, className, classNames, children, id, }) => {
+const Chip = ({ color = "default", variant = "solid", size = "md", radius = "full", startContent, endContent, onClose, isDisabled = false, className, classNames, children, as, style: consumerStyle, ...domProps }) => {
     const isStandard = STANDARD_COLORS.has(color);
     const shape = SHAPE_BY_VARIANT[variant];
     // Literal de v2 (`@heroui/chip@2.2.18`, `use-chip.js:63`):
@@ -750,12 +1033,27 @@ const Chip = ({ color = "default", variant = "solid", size = "md", radius = "ful
     const flatDarkFgClass = isStandard && shape === "soft"
         ? (COLOR_TOKENS[color].flatFgDarkClass ?? "")
         : "";
-    const style = vars
+    const baseStyle = vars
         ? shape === "outline"
             ? { ...vars, borderColor: vars["--chip-fg"] }
             : vars
         : undefined;
-    return (jsxRuntime.jsxs(react.Chip, { id: id, size: size, variant: V3_VARIANT_BY_SHAPE[shape], 
+    // El `style` del consumidor va DESPUÉS: pisa el relleno/texto calculados (uso real en
+    // beweossmbs: `style={{ backgroundColor, color }}` con el color del agente, 5 sitios).
+    const style = baseStyle || consumerStyle ? { ...baseStyle, ...consumerStyle } : undefined;
+    const shadowClass = variant === "shadow"
+        ? isStandard
+            ? SHADOW_CLASS$1[color]
+            : "shadow-lg"
+        : "";
+    // `as` de v2 (`Component = as || "div"`). v3 no tiene `as`, pero su raíz acepta `render`, que
+    // recibe las props DOM ya compuestas (clases, `data-slot`, `ref`…) y devuelve el elemento.
+    const render = as
+        ? (props) => $8WNJc$react.createElement(as, props)
+        : undefined;
+    return (jsxRuntime.jsxs(react.Chip
+    // `aria-disabled` ANTES del spread: si el consumidor manda el suyo, gana el suyo.
+    , { "aria-disabled": isDisabled || undefined, ...domProps, render: render, size: size, variant: V3_VARIANT_BY_SHAPE[shape], 
         // `cn` (tailwind-merge) y no una concatenación de texto: el consumidor tiene que poder
         // pisar tamaño y radio (`className="h-5 text-[10px]"` es un uso real en beweossmbs).
         // Con una cadena suelta ambas clases llegan al DOM y gana la que Tailwind emita más
@@ -764,18 +1062,20 @@ const Chip = ({ color = "default", variant = "solid", size = "md", radius = "ful
         className: react.cn(SIZE_CLASS$6[size], 
         // Después de `SIZE_CLASS` a propósito: el cuadrado de un carácter ENCOGE la caja
         // respecto al tamaño normal y tiene que ganar en tailwind-merge.
-        isSquare ? ONE_CHAR_CLASS[size] : "", RADIUS_CLASS$9[radius], outlineClass, flatDarkFgClass, customClass, isDisabled ? "opacity-50 pointer-events-none" : "", classNames?.base, className), style: style, "aria-disabled": isDisabled || undefined, children: [startContent, jsxRuntime.jsx("span", { className: react.cn("flex-1 text-inherit font-normal", startContent
+        isSquare ? ONE_CHAR_CLASS[size] : "", RADIUS_CLASS$9[radius], outlineClass, shadowClass, flatDarkFgClass, customClass, isDisabled ? "opacity-50 pointer-events-none" : "", classNames?.base, className), style: style, children: [startContent, jsxRuntime.jsx("span", { className: react.cn("flex-1 text-inherit font-normal", startContent
                     ? CONTENT_PADDING[size].leftWithContent
                     : CONTENT_PADDING[size].left, hasEndContent
                     ? CONTENT_PADDING[size].rightWithContent
                     : CONTENT_PADDING[size].right, 
                 // `content: "px-0 flex-none"` del compound de un carácter. Va después de los
                 // `pl-*`/`pr-*` para que tailwind-merge los borre (un `px` posterior sí gana).
-                isSquare ? "px-0 flex-none" : "", classNames?.label), children: children }), endContent, onClose && (jsxRuntime.jsx(react.CloseButton, { "aria-label": "Cerrar", 
+                isSquare ? "px-0 flex-none" : "", classNames?.label, 
+                // `content` es el nombre v2 del slot (16 usos en beweossmbs); va el último.
+                classNames?.content), children: children }), endContent, onClose && (jsxRuntime.jsx(react.CloseButton, { "aria-label": "Cerrar", 
                 // `.close-button` de v3 impone caja de 24px, `bg-default` y `text-muted`; v2 no
                 // pintaba fondo ni caja: el glifo ERA el botón. Se anulan con utilidades (capa
                 // `utilities` gana a `components`, incluido el `& svg { size-4 -mx-0.5 my-0.5 }`).
-                className: "h-auto w-auto min-h-0 rounded-full bg-transparent p-0 text-current opacity-70 transition-opacity hover:bg-transparent hover:opacity-100", onPress: onClose, isDisabled: isDisabled, children: jsxRuntime.jsx("svg", { "aria-hidden": "true", focusable: "false", role: "presentation", viewBox: "0 0 24 24", className: `m-0 shrink-0 ${CLOSE_ICON_SIZE_CLASS[size]}`, children: jsxRuntime.jsx("path", { d: CLOSE_FILLED_PATH, fill: "currentColor" }) }) }))] }));
+                className: react.cn("h-auto w-auto min-h-0 rounded-full bg-transparent p-0 text-current opacity-70 transition-opacity hover:bg-transparent hover:opacity-100", classNames?.closeButton), onPress: onClose, isDisabled: isDisabled, children: jsxRuntime.jsx("svg", { "aria-hidden": "true", focusable: "false", role: "presentation", viewBox: "0 0 24 24", className: `m-0 shrink-0 ${CLOSE_ICON_SIZE_CLASS[size]}`, children: jsxRuntime.jsx("path", { d: CLOSE_FILLED_PATH, fill: "currentColor" }) }) }))] }));
 };
 
 const sizeMap = {
@@ -816,10 +1116,10 @@ const IconComponent = ({ icon, size = "md", className, style, color, hFlip, vFli
 // (`bg-default-200` / `bg-default-300` en variant `flat`) se reponen también por clase por el
 // mismo motivo.
 //
-// El RADIO no entra aquí a propósito: se compone por pieza más abajo. Estas clases se concatenan
-// como texto (no con `cn`/tailwind-merge), así que dos radios en la misma cadena no se resuelven
-// por orden de escritura sino por el orden en que Tailwind los emite — `rounded-none` ganaba a
-// `rounded-[12px]` y la celda activa salía a escuadra.
+// El RADIO no entra aquí a propósito: se compone por pieza más abajo (`cellRadius`). Las piezas se
+// fusionan con `cn` (tailwind-merge), que resuelve dos clases del mismo grupo por su POSICIÓN en
+// la cadena. Antes se concatenaban como texto y decidía el orden en que Tailwind las emite:
+// `rounded-none` ganaba a `rounded-[12px]` y la celda activa salía a escuadra.
 // ⚠️ TECH-2459 · F5 · R2 — `shadow-xs`, no `shadow-sm`: **Tailwind 4 corrió la escala de sombras
 // un paso**. El `shadow-sm` de Tailwind 3 (que es el que emitía v2) es el `shadow-xs` de Tailwind
 // 4. Literal de `node_modules/tailwindcss/theme.css:406-407`:
@@ -844,11 +1144,38 @@ const CELL_CLASS = "size-9 md:size-9 min-w-9 bg-default-100 text-sm text-default
  * `w-fit` reproduce el `max-w-fit` del wrapper de v2.
  */
 const STRIP_CLASS = "w-fit gap-0 rounded-[12px] shadow-xs";
-/** Celdas interiores: a escuadra (el `[&:not(:first-of-type):not(:last-of-type)]:rounded-none` de v2). */
-const INNER_RADIUS_CLASS = "rounded-none";
-/** Extremos de la tira: solo el lado exterior lleva radio, como el `isCompact` de v2. */
-const NAV_START_CLASS = `${CELL_CLASS} w-9 px-0 rounded-s-[12px] rounded-e-none`;
-const NAV_END_CLASS = `${CELL_CLASS} w-9 px-0 rounded-e-[12px] rounded-s-none`;
+/**
+ * `isCompact={false}`: celdas sueltas. Literales del `tv` de v2 sin el bloque `isCompact`: el
+ * `wrapper` vuelve a `gap-1` (4px) sin sombra común, y cada celda lleva su propio radio
+ * (`radius: md` → `rounded-medium`, 12px).
+ */
+const STRIP_LOOSE_CLASS = "w-fit gap-1";
+/** Controles anterior/siguiente: celda cuadrada, sin el padding lateral de v3. */
+const NAV_CLASS = "w-9 px-0";
+/**
+ * Radio de cada pieza según su posición en la tira.
+ *
+ * Compacta (el `isCompact` de v2): celdas interiores a escuadra
+ * (`[&:not(:first-of-type):not(:last-of-type)]:rounded-none`) y solo el lado EXTERIOR de los
+ * extremos redondeado (`first-of-type:rounded-e-none` / `last-of-type:rounded-s-none`). Los
+ * extremos son las flechas cuando hay `showControls`, y las propias páginas cuando no: por eso
+ * se decide por posición y no por tipo de pieza.
+ */
+function cellRadius(isCompact, position) {
+    if (!isCompact) {
+        return "rounded-[12px]";
+    }
+    if (position.isFirst && position.isLast) {
+        return "rounded-[12px]";
+    }
+    if (position.isFirst) {
+        return "rounded-s-[12px] rounded-e-none";
+    }
+    if (position.isLast) {
+        return "rounded-e-[12px] rounded-s-none";
+    }
+    return "rounded-none";
+}
 /**
  * Página activa. v2 la pintaba con un "cursor" absoluto de `bg-primary text-primary-foreground` y
  * `rounded-medium` por encima de la celda; aquí se pinta la celda misma con los mismos tokens.
@@ -856,7 +1183,39 @@ const NAV_END_CLASS = `${CELL_CLASS} w-9 px-0 rounded-e-[12px] rounded-s-none`;
  * Sin esto v3 la pinta con `--pagination-link-bg: var(--default)`, el gris CRUDO de v3 y no el
  * `--color-default` de Aurora (falso amigo, decisiones-aceptadas-f1.md D-F1-3).
  */
-const ACTIVE_LINK_CLASS = "rounded-[12px] bg-primary text-primary-foreground hover:bg-primary active:bg-primary";
+const ACTIVE_LINK_CLASS = "rounded-[12px]";
+/**
+ * `color` de v2 → la página activa. Literal de `colorVariants.solid` (`@heroui/theme@2.4.15`,
+ * `dist/components/pagination.js`): `bg-<color> text-<color>-foreground`. Los estados hover y
+ * pulsado se fijan al mismo fondo porque la celda base los cambia (`CELL_CLASS`) y en v2 el
+ * cursor activo no reaccionaba al ratón. Cadenas literales completas: Tailwind solo emite lo que
+ * encuentra escrito entero.
+ *
+ * `default` es el gris de Aurora (`--color-default`), no el `--default` crudo de v3 (falso
+ * amigo, decisiones-aceptadas-f1.md D-F1-3).
+ */
+const ACTIVE_COLOR_CLASS = {
+    default: "bg-default text-default-foreground hover:bg-default active:bg-default",
+    primary: "bg-primary text-primary-foreground hover:bg-primary active:bg-primary",
+    secondary: "bg-secondary text-secondary-foreground hover:bg-secondary active:bg-secondary",
+    success: "bg-success text-success-foreground hover:bg-success active:bg-success",
+    warning: "bg-warning text-warning-foreground hover:bg-warning active:bg-warning",
+    danger: "bg-danger text-danger-foreground hover:bg-danger active:bg-danger",
+};
+/**
+ * `showShadow` de v2 → sombra de color bajo la página activa. Literal del compound
+ * `{ showShadow: true, color }` de v2: `cursor: [colorVariants.shadow[color], "shadow-md"]`, que
+ * tras tailwind-merge queda `shadow-md shadow-<color>/40` (`/50` en `default`). `shadow-md` no
+ * cambió de valor entre Tailwind 3 y 4 (el corrimiento de la escala solo afectó a `sm`/`DEFAULT`).
+ */
+const ACTIVE_SHADOW_CLASS = {
+    default: "shadow-md shadow-default/50",
+    primary: "shadow-md shadow-primary/40",
+    secondary: "shadow-md shadow-secondary/40",
+    success: "shadow-md shadow-success/40",
+    warning: "shadow-md shadow-warning/40",
+    danger: "shadow-md shadow-danger/40",
+};
 /**
  * Traducciones por defecto en español. Todas son `aria-label`: este componente no tiene más
  * texto visible que los números de página.
@@ -968,12 +1327,22 @@ function getPaginationRange(total, current) {
  *   `aria-label` los dos botones llegaban vacíos al árbol de accesibilidad.
  *
 
+ * API v2 que las apps siguen escribiendo (medido en beweossmbs `origin/staging`: 17 usos, todos
+ * con `showControls`, 14 con `isCompact`, 12 con `color="primary"`, 11 con `showShadow`):
+ * - `showControls` (default `true`): pinta anterior/siguiente; con `false` desaparecen.
+ * - `isCompact` (default `true`): tira compacta; con `false`, celdas sueltas (`gap-1`).
+ * - `color` (default `"primary"`): color de la página activa.
+ * - `showShadow` (default `false`): sombra de color bajo la página activa.
+ * Los defaults `true` de las dos primeras son los que forzaba la fachada v2 de Aurora
+ * (`<HeroUIPagination showControls isCompact {...props} />`), así que quien no las pasa se ve
+ * exactamente igual que hasta ahora.
+ *
  * ⚠️ `size` se acepta pero no se aplica: mismo bug preexistente que v2 (destructurado, nunca
  * reenviado a HeroUI) — fuera de scope de esta migración, reportado aparte (ver
  * findings/decisiones-aceptadas-g2.md y f5-L7-sueltos.md · P-17). v3 SÍ tiene la prop (emite
  * `.pagination--sm|--md|--lg`), así que arreglarlo es un cambio de tamaño visible: ticket aparte.
  */
-const Pagination = ({ total, page, initialPage = 1, onChange, size: _size = "sm", className, isDisabled, translations = {}, }) => {
+const Pagination = ({ total, page, initialPage = 1, onChange, size: _size = "sm", className, isDisabled, showControls = true, isCompact = true, showShadow = false, color = "primary", translations = {}, }) => {
     const [internalPage, setInternalPage] = $8WNJc$react.useState(initialPage);
     const currentPage = page ?? internalPage;
     const t = { ...DEFAULT_TRANSLATIONS$g, ...translations };
@@ -990,18 +1359,26 @@ const Pagination = ({ total, page, initialPage = 1, onChange, size: _size = "sm"
     // `dist/pagination.js:464`). Si `page` viene fuera de rango, `indexOf` da -1 y todas las
     // elipsis avanzan — también igual que v2, que no protegía ese caso.
     const activeIndex = items.indexOf(currentPage);
+    // Posición de cada pieza en la tira, para el radio compacto: con controles, los extremos
+    // son las flechas y ninguna página toca el borde.
+    const lastItemIndex = items.length - 1;
+    const itemPosition = (index) => ({
+        isFirst: !showControls && index === 0,
+        isLast: !showControls && index === lastItemIndex,
+    });
+    const activeClass = react.cn(ACTIVE_COLOR_CLASS[color], showShadow ? ACTIVE_SHADOW_CLASS[color] : "", ACTIVE_LINK_CLASS);
     return (
     // `w-fit` reproduce el `max-w-fit` del wrapper de v2: `.pagination` de v3 es `w-full` +
     // `justify-between`, así que dentro de un `flex justify-center` (como el de AccordionList) la
     // tira se quedaba pegada a la izquierda en vez de centrarse.
-    jsxRuntime.jsx(react.Pagination, { className: ["w-fit", className].filter(Boolean).join(" "), children: jsxRuntime.jsxs(react.Pagination.Content, { className: STRIP_CLASS, children: [jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsx(react.Pagination.Previous
+    jsxRuntime.jsx(react.Pagination, { className: react.cn("w-fit", className), children: jsxRuntime.jsxs(react.Pagination.Content, { className: isCompact ? STRIP_CLASS : STRIP_LOOSE_CLASS, children: [showControls && (jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsx(react.Pagination.Previous
                     // v3 mete el galón en un `<span aria-hidden="true">`
                     // (`pagination.js:165`), así que sin esto el botón se queda SIN nombre
                     // accesible: un lector de pantalla lo anuncia como "botón" a secas. v2 sí
                     // lo nombraba ("previous page button", `use-pagination.js:213`), pero en
                     // inglés y hardcodeado; aquí va por `translations` (regla obligatoria de
                     // i18n del repo, skill `auraui-i18n`).
-                    , { "aria-label": t.previousPageAriaLabel, className: NAV_START_CLASS, isDisabled: isDisabled || currentPage <= 1, onPress: () => goTo(currentPage - 1), children: jsxRuntime.jsx(react.Pagination.PreviousIcon, {}) }) }), items.map((item, index) => {
+                    , { "aria-label": t.previousPageAriaLabel, className: react.cn(CELL_CLASS, NAV_CLASS, cellRadius(isCompact, { isFirst: true, isLast: false })), isDisabled: isDisabled || currentPage <= 1, onPress: () => goTo(currentPage - 1), children: jsxRuntime.jsx(react.Pagination.PreviousIcon, {}) }) })), items.map((item, index) => {
                     if (item === "ellipsis") {
                         const isBefore = index < activeIndex;
                         const label = isBefore
@@ -1009,14 +1386,14 @@ const Pagination = ({ total, page, initialPage = 1, onChange, size: _size = "sm"
                             : t.jumpForwardAriaLabel;
                         return (
                         // biome-ignore lint/suspicious/noArrayIndexKey: solo hay como máximo 2 elipsis, posición estable
-                        jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsxs(react.Pagination.Link, { "aria-label": label.replace("{count}", String(DOTS_JUMP)), className: `group ${CELL_CLASS} ${INNER_RADIUS_CLASS}`, isDisabled: isDisabled, onPress: () => goTo(isBefore
+                        jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsxs(react.Pagination.Link, { "aria-label": label.replace("{count}", String(DOTS_JUMP)), className: react.cn("group", CELL_CLASS, cellRadius(isCompact, itemPosition(index))), isDisabled: isDisabled, onPress: () => goTo(isBefore
                                     ? currentPage - DOTS_JUMP
                                     : currentPage + DOTS_JUMP), children: [jsxRuntime.jsx(EllipsisDotsIcon, {}), jsxRuntime.jsx(JumpIcon, { isBefore: isBefore })] }) }, `ellipsis-${index}`));
                     }
-                    return (jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsx(react.Pagination.Link, { className: `${CELL_CLASS} ${item === currentPage ? ACTIVE_LINK_CLASS : INNER_RADIUS_CLASS}`, isActive: item === currentPage, isDisabled: isDisabled, onPress: () => goTo(item), children: item }) }, item));
-                }), jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsx(react.Pagination.Next
+                    return (jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsx(react.Pagination.Link, { className: react.cn(CELL_CLASS, cellRadius(isCompact, itemPosition(index)), item === currentPage ? activeClass : ""), isActive: item === currentPage, isDisabled: isDisabled, onPress: () => goTo(item), children: item }) }, item));
+                }), showControls && (jsxRuntime.jsx(react.Pagination.Item, { children: jsxRuntime.jsx(react.Pagination.Next
                     /* Mismo motivo que en `Previous`: el galón es `aria-hidden`. */
-                    , { "aria-label": t.nextPageAriaLabel, className: NAV_END_CLASS, isDisabled: isDisabled || currentPage >= total, onPress: () => goTo(currentPage + 1), children: jsxRuntime.jsx(react.Pagination.NextIcon, {}) }) })] }) }));
+                    , { "aria-label": t.nextPageAriaLabel, className: react.cn(CELL_CLASS, NAV_CLASS, cellRadius(isCompact, { isFirst: false, isLast: true })), isDisabled: isDisabled || currentPage >= total, onPress: () => goTo(currentPage + 1), children: jsxRuntime.jsx(react.Pagination.NextIcon, {}) }) }))] }) }));
 };
 
 // TECH-2459 · F5 · P-01 — Valores tomados del tema v2 REAL (`@heroui/theme@2.4.15`,
@@ -1185,6 +1562,33 @@ exports.HolidayType = void 0;
     HolidayType["DateRange"] = "dateRange";
 })(exports.HolidayType || (exports.HolidayType = {}));
 
+// Piezas compartidas por `DatePicker` y `DateRangePicker` para reponer `classNames` y
+// `calendarWidth` de v2 (TECH-2459). Interno: no se exporta desde el índice del paquete.
+/**
+ * Fusiona las clases de la fachada con las del consumidor (`classNames.<slot>`), las del consumidor
+ * DETRÁS para que ganen en tailwind-merge — como el `slots.x({ class })` de v2, cuyo `tv` llevaba
+ * `twMerge: true`. Sin clase del consumidor la cadena de la fachada sale TAL CUAL (unida con
+ * espacios, como antes de existir `classNames`): pasar la fachada por `cn` sin necesidad resolvería
+ * sus conflictos internos (p. ej. `rounded-none` de `underlined` contra el radio) de otra forma que
+ * la cascada de hoy, y cambiaría el píxel de quien no usa la prop.
+ */
+function withConsumerClass(own, consumer) {
+    const base = own.filter(Boolean).join(" ");
+    return consumer ? react.cn(base, consumer) : base;
+}
+/**
+ * `calendarWidth` de v2 → estilo en línea del `Calendar`. v3 fija `.calendar { w-63 max-w-63 }`
+ * (`@heroui/styles/dist/components/calendar.css:11-13`), así que el `max-width` tiene que acompañar
+ * al `width`: con solo `width: 300px` el tope de 252px lo seguiría recortando.
+ */
+function calendarWidthStyle(calendarWidth, style) {
+    if (calendarWidth === undefined) {
+        return style;
+    }
+    const width = typeof calendarWidth === "number" ? `${calendarWidth}px` : calendarWidth;
+    return { ...style, width, maxWidth: width };
+}
+
 // Mismo mecanismo que Input/Select (findings/campo-texto-responsive-sm-trap.md):
 // `.date-input-group__input` fija su propio `text-base sm:text-sm` — se repite la clase de
 // tamaño de TEXTO directo en `DateField.Input`, no solo en el `DateField.Group` contenedor.
@@ -1233,6 +1637,44 @@ const VARIANT_CLASS$5 = {
  * En reposo no cambia nada (el anillo de v3 ya vale 0 ahí), así que la referencia v2 se mantiene.
  */
 const FIELD_FOCUS_CLASS$5 = "ring-0 ring-offset-0 outline-0";
+/*
+ * TECH-2459 · hallazgo beweossmbs 23-sep — `labelPlacement` de v2, repuesta. Misma solución que
+ * `TimeInput` en la .139: una tabla de clases por colocación. La barra de la agenda
+ * (`agenda-toolbar.component.tsx`) pide `"outside-left"` y v1 no tenía la prop: la etiqueta caía
+ * encima y la barra crecía una línea.
+ *
+ * `outside` es EXACTAMENTE lo que la fachada pintaba hasta ahora (la raíz `flex flex-col gap-1`,
+ * sin clases de colocación en el grupo ni en la ayuda), así que quien no pasa la prop no cambia un
+ * píxel. `outside-left` son los literales del `tv` de v2 (`@heroui/theme@2.4.15` →
+ * `dist/components/date-input.js`, `labelPlacement["outside-left"]`, que es el `tv` del que tira el
+ * `DatePicker` de v2):
+ *
+ *   base         → "flex-row items-center gap-x-2 flex-nowrap"
+ *                  + `data-[has-helper=true]:pb-[calc(theme(fontSize.tiny)_+_8px)]`
+ *   inputWrapper → "relative flex-1"
+ *   helperWrapper→ "absolute top-[calc(100%_+_2px)] start-0"
+ *
+ * La ayuda y el error no pueden ser un tercer hijo de la fila (quedarían a la derecha del campo):
+ * v2 los sacaba del flujo bajo el campo y reservaba su alto con el `pb` de la raíz. Aquí igual;
+ * `theme(fontSize.tiny)` de v2 (12px) es `--text-xs` en Tailwind 4, y la raíz lleva `relative`
+ * para que el `absolute` se ancle a ella.
+ */
+const ROOT_PLACEMENT_CLASS = {
+    outside: "flex flex-col gap-1",
+    "outside-left": "relative flex flex-row items-center gap-x-2 flex-nowrap",
+};
+const ROOT_HELPER_SPACE_CLASS = {
+    outside: undefined,
+    "outside-left": "pb-[calc(var(--text-xs)+8px)]",
+};
+const GROUP_PLACEMENT_CLASS = {
+    outside: undefined,
+    "outside-left": "relative flex-1",
+};
+const HELPER_PLACEMENT_CLASS = {
+    outside: undefined,
+    "outside-left": "absolute top-[calc(100%+2px)] start-0",
+};
 // TECH-2459 · F5 · P-10 — El "círculo" del calendario. v2 (`@heroui/theme@2.4.15`,
 // `calendar.ts`) solo tenía UN círculo y significaba "día seleccionado":
 //   cellButton: "w-8 h-8 … rounded-full"  +  color primary: "data-[selected=true]:bg-primary
@@ -1259,20 +1701,32 @@ const CALENDAR_CELL_CLASS$1 = "size-8 place-self-center rounded-full " +
  * (grid) para que la API pública siga siendo un único componente con props planas, igual que en
  * v2 (label, description, errorMessage, endContent, variant, size, radius).
  */
-function DatePicker({ label, description, errorMessage, id, size = "md", variant = "bordered", radius = "md", isInvalid = false, isRequired = false, isDisabled = false, fullWidth, endContent, calendarBottomContent, className, "aria-label": ariaLabel, ...props }) {
+function DatePicker({ label, description, errorMessage, id, size = "md", variant = "bordered", radius = "md", labelPlacement = "outside", isInvalid = false, isRequired = false, isDisabled = false, fullWidth, endContent, calendarBottomContent: calendarBottomContentProp, CalendarBottomContent, calendarTopContent: calendarTopContentProp, CalendarTopContent, calendarWidth, calendarProps, classNames, className, "aria-label": ariaLabel, ...props }) {
     const generatedId = $8WNJc$react.useId();
     const autoId = id || generatedId;
-    const calendarLabel = (typeof label === "string" ? label : undefined) ?? ariaLabel ?? "Calendario";
-    return (jsxRuntime.jsxs(react.DatePicker, { ...props, id: autoId, "aria-label": ariaLabel, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, className: ["flex flex-col gap-1", fullWidth ? "w-full" : "", className]
-            .filter(Boolean)
-            .join(" "), children: [label && (jsxRuntime.jsx(react.Label, { className: "text-default-600 text-xs font-medium", children: label })), jsxRuntime.jsxs(react.DateField.Group, { fullWidth: fullWidth, className: [
+    const calendarLabel = (typeof label === "string" ? label : undefined) ??
+        ariaLabel ??
+        "Calendario";
+    const calendarBottomContent = calendarBottomContentProp ?? CalendarBottomContent;
+    const calendarTopContent = calendarTopContentProp ?? CalendarTopContent;
+    const hasHelper = Boolean((description && !isInvalid) || (isInvalid && errorMessage));
+    const { className: calendarClassName, style: calendarStyle, ...restCalendarProps } = calendarProps ?? {};
+    return (jsxRuntime.jsxs(react.DatePicker, { ...props, id: autoId, "aria-label": ariaLabel, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, className: withConsumerClass([
+            ROOT_PLACEMENT_CLASS[labelPlacement],
+            fullWidth && "w-full",
+            hasHelper && ROOT_HELPER_SPACE_CLASS[labelPlacement],
+            classNames?.base,
+        ], className), children: [label && (jsxRuntime.jsx(react.Label, { className: withConsumerClass(["text-default-600 text-xs font-medium"], classNames?.label), children: label })), jsxRuntime.jsxs(react.DateField.Group, { fullWidth: fullWidth, className: withConsumerClass([
                     SIZE_CLASS$5[size],
                     RADIUS_CLASS$8[radius],
                     VARIANT_CLASS$5[variant],
                     FIELD_FOCUS_CLASS$5,
-                ]
-                    .filter(Boolean)
-                    .join(" "), children: [jsxRuntime.jsx(react.DateField.Input, { className: SIZE_TEXT_CLASS$4[size], children: (segment) => jsxRuntime.jsx(react.DateField.Segment, { segment: segment }) }), jsxRuntime.jsx(react.DateField.Suffix, { children: jsxRuntime.jsx(react.DatePicker.Trigger, { children: endContent !== undefined ? (jsxRuntime.jsx(react.DatePicker.TriggerIndicator, { children: endContent })) : (jsxRuntime.jsx(react.DatePicker.TriggerIndicator, {})) }) })] }), description && !isInvalid && jsxRuntime.jsx(react.Description, { children: description }), jsxRuntime.jsxs(react.DatePicker.Popover, { children: [jsxRuntime.jsxs(react.Calendar, { "aria-label": calendarLabel, children: [jsxRuntime.jsxs(react.Calendar.Header, { children: [jsxRuntime.jsxs(react.Calendar.YearPickerTrigger, { children: [jsxRuntime.jsx(react.Calendar.YearPickerTriggerHeading, {}), jsxRuntime.jsx(react.Calendar.YearPickerTriggerIndicator, {})] }), jsxRuntime.jsx(react.Calendar.NavButton, { slot: "previous" }), jsxRuntime.jsx(react.Calendar.NavButton, { slot: "next" })] }), jsxRuntime.jsxs(react.Calendar.Grid, { children: [jsxRuntime.jsx(react.Calendar.GridHeader, { children: (day) => jsxRuntime.jsx(react.Calendar.HeaderCell, { children: day }) }), jsxRuntime.jsx(react.Calendar.GridBody, { children: (date) => (jsxRuntime.jsx(react.Calendar.Cell, { date: date, className: CALENDAR_CELL_CLASS$1 })) })] })] }), calendarBottomContent] }), isInvalid && errorMessage && jsxRuntime.jsx(react.FieldError, { children: errorMessage })] }));
+                    GROUP_PLACEMENT_CLASS[labelPlacement],
+                ], classNames?.inputWrapper), children: [jsxRuntime.jsx(react.DateField.Input, { className: withConsumerClass([SIZE_TEXT_CLASS$4[size]], classNames?.input), children: (segment) => (jsxRuntime.jsx(react.DateField.Segment, { segment: segment, className: classNames?.segment })) }), jsxRuntime.jsx(react.DateField.Suffix, { children: jsxRuntime.jsx(react.DatePicker.Trigger, { className: classNames?.selectorButton, children: endContent !== undefined ? (jsxRuntime.jsx(react.DatePicker.TriggerIndicator, { className: classNames?.selectorIcon, children: endContent })) : (jsxRuntime.jsx(react.DatePicker.TriggerIndicator, { className: classNames?.selectorIcon })) }) })] }), description && !isInvalid && (jsxRuntime.jsx(react.Description, { className: withConsumerClass([HELPER_PLACEMENT_CLASS[labelPlacement]], classNames?.description) || undefined, children: description })), jsxRuntime.jsxs(react.DatePicker.Popover, { className: classNames?.popoverContent, children: [calendarTopContent, jsxRuntime.jsxs(react.Calendar, { "aria-label": calendarLabel, minValue: props.minValue, maxValue: props.maxValue, ...restCalendarProps, className: withConsumerClass([
+                            typeof calendarClassName === "string"
+                                ? calendarClassName
+                                : undefined,
+                        ], classNames?.calendar) || undefined, style: calendarWidthStyle(calendarWidth, typeof calendarStyle === "object" ? calendarStyle : undefined), children: [jsxRuntime.jsxs(react.Calendar.Header, { children: [jsxRuntime.jsxs(react.Calendar.YearPickerTrigger, { children: [jsxRuntime.jsx(react.Calendar.YearPickerTriggerHeading, {}), jsxRuntime.jsx(react.Calendar.YearPickerTriggerIndicator, {})] }), jsxRuntime.jsx(react.Calendar.NavButton, { slot: "previous" }), jsxRuntime.jsx(react.Calendar.NavButton, { slot: "next" })] }), jsxRuntime.jsxs(react.Calendar.Grid, { children: [jsxRuntime.jsx(react.Calendar.GridHeader, { children: (day) => jsxRuntime.jsx(react.Calendar.HeaderCell, { children: day }) }), jsxRuntime.jsx(react.Calendar.GridBody, { children: (date) => (jsxRuntime.jsx(react.Calendar.Cell, { date: date, className: CALENDAR_CELL_CLASS$1 })) })] })] }), calendarBottomContent] }), isInvalid && errorMessage && (jsxRuntime.jsx(react.FieldError, { className: withConsumerClass([HELPER_PLACEMENT_CLASS[labelPlacement]], classNames?.errorMessage) || undefined, children: errorMessage }))] }));
 }
 
 // Mismo mecanismo que DatePicker.tsx / Input.tsx / Select.tsx (findings/
@@ -1351,20 +1805,25 @@ const CALENDAR_CELL_CLASS = "data-[today=true]:not-data-[selected=true]:[&_[data
  * `DatePicker`, migrado en tándem. Compone `DateRangePicker.Root/Trigger/TriggerIndicator/
  * RangeSeparator/Popover` + `DateField` (dos segmentos, start/end) + `RangeCalendar`.
  */
-function DateRangePicker({ label, description, errorMessage, id, size = "md", variant = "bordered", radius = "md", isInvalid = false, isRequired = false, isDisabled = false, fullWidth, endContent, calendarBottomContent, className, "aria-label": ariaLabel, ...props }) {
+function DateRangePicker({ label, description, errorMessage, id, size = "md", variant = "bordered", radius = "md", isInvalid = false, isRequired = false, isDisabled = false, fullWidth, endContent, calendarBottomContent: calendarBottomContentProp, CalendarBottomContent, calendarTopContent: calendarTopContentProp, CalendarTopContent, calendarWidth, calendarProps, classNames, className, "aria-label": ariaLabel, ...props }) {
     const generatedId = $8WNJc$react.useId();
     const autoId = id || generatedId;
-    const calendarLabel = (typeof label === "string" ? label : undefined) ?? ariaLabel ?? "Rango de fechas";
-    return (jsxRuntime.jsxs(react.DateRangePicker, { ...props, id: autoId, "aria-label": ariaLabel, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, className: ["flex flex-col gap-1", fullWidth ? "w-full" : "", className]
-            .filter(Boolean)
-            .join(" "), children: [label && (jsxRuntime.jsx(react.Label, { className: "text-default-600 text-xs font-medium", children: label })), jsxRuntime.jsxs(react.DateField.Group, { fullWidth: fullWidth, className: [
+    const calendarLabel = (typeof label === "string" ? label : undefined) ??
+        ariaLabel ??
+        "Rango de fechas";
+    const calendarBottomContent = calendarBottomContentProp ?? CalendarBottomContent;
+    const calendarTopContent = calendarTopContentProp ?? CalendarTopContent;
+    const { className: calendarClassName, style: calendarStyle, ...restCalendarProps } = calendarProps ?? {};
+    return (jsxRuntime.jsxs(react.DateRangePicker, { ...props, id: autoId, "aria-label": ariaLabel, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, className: withConsumerClass(["flex flex-col gap-1", fullWidth && "w-full", classNames?.base], className), children: [label && (jsxRuntime.jsx(react.Label, { className: withConsumerClass(["text-default-600 text-xs font-medium"], classNames?.label), children: label })), jsxRuntime.jsxs(react.DateField.Group, { fullWidth: fullWidth, className: withConsumerClass([
                     SIZE_CLASS$4[size],
                     RADIUS_CLASS$7[radius],
                     VARIANT_CLASS$4[variant],
                     FIELD_FOCUS_CLASS$4,
-                ]
-                    .filter(Boolean)
-                    .join(" "), children: [jsxRuntime.jsx(react.DateField.Input, { slot: "start", className: SIZE_TEXT_CLASS$3[size], children: (segment) => jsxRuntime.jsx(react.DateField.Segment, { segment: segment }) }), jsxRuntime.jsx(react.DateRangePicker.RangeSeparator, {}), jsxRuntime.jsx(react.DateField.Input, { slot: "end", className: SIZE_TEXT_CLASS$3[size], children: (segment) => jsxRuntime.jsx(react.DateField.Segment, { segment: segment }) }), jsxRuntime.jsx(react.DateField.Suffix, { children: jsxRuntime.jsx(react.DateRangePicker.Trigger, { children: endContent !== undefined ? (jsxRuntime.jsx(react.DateRangePicker.TriggerIndicator, { children: endContent })) : (jsxRuntime.jsx(react.DateRangePicker.TriggerIndicator, {})) }) })] }), description && !isInvalid && jsxRuntime.jsx(react.Description, { children: description }), jsxRuntime.jsxs(react.DateRangePicker.Popover, { children: [jsxRuntime.jsxs(react.RangeCalendar, { "aria-label": calendarLabel, children: [jsxRuntime.jsxs(react.RangeCalendar.Header, { children: [jsxRuntime.jsxs(react.RangeCalendar.YearPickerTrigger, { children: [jsxRuntime.jsx(react.RangeCalendar.YearPickerTriggerHeading, {}), jsxRuntime.jsx(react.RangeCalendar.YearPickerTriggerIndicator, {})] }), jsxRuntime.jsx(react.RangeCalendar.NavButton, { slot: "previous" }), jsxRuntime.jsx(react.RangeCalendar.NavButton, { slot: "next" })] }), jsxRuntime.jsxs(react.RangeCalendar.Grid, { children: [jsxRuntime.jsx(react.RangeCalendar.GridHeader, { children: (day) => jsxRuntime.jsx(react.RangeCalendar.HeaderCell, { children: day }) }), jsxRuntime.jsx(react.RangeCalendar.GridBody, { children: (date) => (jsxRuntime.jsx(react.RangeCalendar.Cell, { date: date, className: CALENDAR_CELL_CLASS })) })] })] }), calendarBottomContent] }), isInvalid && errorMessage && jsxRuntime.jsx(react.FieldError, { children: errorMessage })] }));
+                ], classNames?.inputWrapper), children: [jsxRuntime.jsx(react.DateField.Input, { slot: "start", className: withConsumerClass([SIZE_TEXT_CLASS$3[size]], classNames?.input), children: (segment) => (jsxRuntime.jsx(react.DateField.Segment, { segment: segment, className: classNames?.segment })) }), jsxRuntime.jsx(react.DateRangePicker.RangeSeparator, { className: classNames?.separator }), jsxRuntime.jsx(react.DateField.Input, { slot: "end", className: withConsumerClass([SIZE_TEXT_CLASS$3[size]], classNames?.input), children: (segment) => (jsxRuntime.jsx(react.DateField.Segment, { segment: segment, className: classNames?.segment })) }), jsxRuntime.jsx(react.DateField.Suffix, { children: jsxRuntime.jsx(react.DateRangePicker.Trigger, { className: classNames?.selectorButton, children: endContent !== undefined ? (jsxRuntime.jsx(react.DateRangePicker.TriggerIndicator, { className: classNames?.selectorIcon, children: endContent })) : (jsxRuntime.jsx(react.DateRangePicker.TriggerIndicator, { className: classNames?.selectorIcon })) }) })] }), description && !isInvalid && (jsxRuntime.jsx(react.Description, { className: classNames?.description, children: description })), jsxRuntime.jsxs(react.DateRangePicker.Popover, { className: classNames?.popoverContent, children: [calendarTopContent, jsxRuntime.jsxs(react.RangeCalendar, { "aria-label": calendarLabel, minValue: props.minValue, maxValue: props.maxValue, ...restCalendarProps, className: withConsumerClass([
+                            typeof calendarClassName === "string"
+                                ? calendarClassName
+                                : undefined,
+                        ], classNames?.calendar) || undefined, style: calendarWidthStyle(calendarWidth, typeof calendarStyle === "object" ? calendarStyle : undefined), children: [jsxRuntime.jsxs(react.RangeCalendar.Header, { children: [jsxRuntime.jsxs(react.RangeCalendar.YearPickerTrigger, { children: [jsxRuntime.jsx(react.RangeCalendar.YearPickerTriggerHeading, {}), jsxRuntime.jsx(react.RangeCalendar.YearPickerTriggerIndicator, {})] }), jsxRuntime.jsx(react.RangeCalendar.NavButton, { slot: "previous" }), jsxRuntime.jsx(react.RangeCalendar.NavButton, { slot: "next" })] }), jsxRuntime.jsxs(react.RangeCalendar.Grid, { children: [jsxRuntime.jsx(react.RangeCalendar.GridHeader, { children: (day) => (jsxRuntime.jsx(react.RangeCalendar.HeaderCell, { children: day })) }), jsxRuntime.jsx(react.RangeCalendar.GridBody, { children: (date) => (jsxRuntime.jsx(react.RangeCalendar.Cell, { date: date, className: CALENDAR_CELL_CLASS })) })] })] }), calendarBottomContent] }), isInvalid && errorMessage && (jsxRuntime.jsx(react.FieldError, { className: classNames?.errorMessage, children: errorMessage }))] }));
 }
 
 // TECH-2459 · F3.0 — v3 divide el `Input` monolítico de v2 en `TextField` (label/description/
@@ -1678,6 +2137,10 @@ const INVALID_TEXT_CLASS$2 = "text-danger";
  * - Radius configurable (v3 no tiene la prop).
  * - `startContent`/`endContent` → `InputGroup.Prefix`/`InputGroup.Suffix`.
  * - `isClearable` → botón de limpiar propio (`CloseButton`); solo en modo controlado (`value`).
+ * - `onClear` (API v2) → basta para mostrar la X; se llama al limpiar (X o Escape) y el foco
+ *   vuelve al campo, como en v2.
+ * - `classNames`: los 10 slots de v2, cada uno en su nodo equivalente (tabla en `Input.types.ts`).
+ * - `labelPlacement` (API v2): aceptado y sin efecto — el label siempre va fuera.
  *
  * `ref` apunta al `<input>` REAL (`HTMLInputElement`), no al `InputGroup` ni al `TextField` que lo
  * envuelven: el consumidor que necesita el nodo —insertar texto en la posición del cursor con
@@ -1697,7 +2160,10 @@ const Input = $8WNJc$react.forwardRef(({ label, description, errorMessage, id,
 // `lg` que había aquí venía del `argTypes.defaultValue.summary` de la story, que YA estaba mal
 // en v2. Con "lg" todos los campos de las 4 apps que no pasan `size` salían 8px más altos, con
 // 2px más de padding lateral y el texto a 16px en vez de 14.
-size = "md", variant = "bordered", radius = "md", placeholder, startContent, endContent, isClearable = false, isInvalid = false, isRequired = false, isDisabled = false, isReadOnly = false, 
+size = "md", variant = "bordered", radius = "md", placeholder, startContent, endContent, isClearable: isClearableProp = false, onClear, 
+// Sin efecto (ver `InputProps.labelPlacement`): se saca del spread para que no llegue
+// al `<input>` como atributo desconocido.
+labelPlacement: _labelPlacement, isInvalid = false, isRequired = false, isDisabled = false, isReadOnly = false, 
 // `fullWidth` por defecto a `true`: HeroUI v2 lo traía en sus `defaultVariants`
 // (verificado en el paquete v2 compilado, `dist/components/input.js`:
 // `defaultVariants: { variant:"flat", color:"default", size:"md", fullWidth:true, … }`, con
@@ -1705,7 +2171,21 @@ size = "md", variant = "bordered", radius = "md", placeholder, startContent, end
 // `undefined` y el campo dejaba de llenar su contenedor: en una fila flex se encogía al ancho
 // de su contenido (medido por S2: 208px dentro de una fila de 592, 336px de hueco). En una
 // columna no se notaba porque el `stretch` del flex lo tapaba — pero afecta a cualquier app.
-fullWidth = true, value, defaultValue, onChange, onValueChange, className, classNames, required, name, type = "text", ...rest }, ref) => {
+fullWidth = true, value, defaultValue, onChange, onValueChange, className, classNames, required, name, type = "text", onKeyDown, ...rest }, ref) => {
+    // El `<input>` real, también para la fachada: v2 devolvía el foco al campo al limpiar
+    // (`domRef.current?.focus()` en `handleClear`). Se combina con el `ref` del consumidor.
+    const inputRef = $8WNJc$react.useRef(null);
+    const setInputRef = $8WNJc$react.useCallback((node) => {
+        inputRef.current = node;
+        if (typeof ref === "function") {
+            ref(node);
+        }
+        else if (ref) {
+            ref.current = node;
+        }
+    }, [ref]);
+    // v2: `isClearable = !!onClear || originalProps.isClearable` (`use-input.ts`).
+    const isClearable = isClearableProp || Boolean(onClear);
     const generatedId = $8WNJc$react.useId();
     const inputId = id || generatedId;
     // ⚠️ `isRequired` (prop de HeroUI, asterisco visual) y `required` (atributo HTML nativo, solo
@@ -1713,7 +2193,24 @@ fullWidth = true, value, defaultValue, onChange, onValueChange, className, class
     // Detectado por VRT (`FormExample`, que solo pasa `required`): tratarlos como lo mismo aquí
     // introducía un asterisco que v2 no tenía. `isRequired` maneja el asterisco (vía TextField);
     // `required` se reenvía tal cual al `<input>` nativo, sin efecto visual.
-    const showClear = isClearable && !isDisabled && !isReadOnly && Boolean(value);
+    // ── El valor lo guarda el `TextField`, no el `<input>` ───────────────────────────────────
+    //
+    // En react-aria el dueño del valor es el `TextField`: `useTextField` lo guarda con
+    // `useControlledState(value, defaultValue ?? "")` y se lo inyecta al `<input>` como `value`
+    // por contexto (`react-aria-components/dist/private/TextField.mjs`). Antes la fachada pasaba
+    // `value`/`defaultValue` al `InputGroup.Input` y ninguno al `TextField`, así que en modo NO
+    // controlado el `TextField` arrancaba en "" y el `<input>` recibía a la vez `value=""` (del
+    // contexto) y `defaultValue`: medido en jsdom, `<Input defaultValue="hola" />` salía VACÍO
+    // ya en el primer render, con el aviso de React «both value and defaultValue». Mismo arreglo
+    // que en `Textarea.tsx`.
+    //
+    // Aquí además la fachada lleva el valor no controlado en su propio estado (en vez de
+    // dejárselo al `TextField`), porque limpiar tiene que poder vaciarlo: `isClearable`/`onClear`
+    // en modo no controlado no tenían manera de escribir en el estado interno del `TextField`.
+    const isControlled = value !== undefined;
+    const [uncontrolledValue, setUncontrolledValue] = $8WNJc$react.useState(defaultValue ?? "");
+    const currentValue = isControlled ? value : uncontrolledValue;
+    const showClear = isClearable && !isDisabled && !isReadOnly && Boolean(currentValue);
     // Solo flota cuando hay label y NO hay placeholder: con placeholder, v2 ya mostraba el label
     // arriba desde el primer render (ver el bloque de arriba).
     const labelFlotante = Boolean(label) && !placeholder;
@@ -1721,7 +2218,12 @@ fullWidth = true, value, defaultValue, onChange, onValueChange, className, class
         onChange?.(event);
         onValueChange?.(event.target.value);
     };
-    const handleClear = () => {
+    // Orden de v2 (`handleClear` de `use-input.ts`): primero el valor a "" —que en v2 disparaba
+    // `onValueChange`—, luego `onClear`, y el foco vuelve al campo.
+    const clearValue = () => {
+        if (!isControlled) {
+            setUncontrolledValue("");
+        }
         onValueChange?.("");
         if (onChange) {
             const fakeEvent = {
@@ -1730,15 +2232,38 @@ fullWidth = true, value, defaultValue, onChange, onValueChange, className, class
             };
             onChange(fakeEvent);
         }
+        onClear?.();
+    };
+    const handleClear = () => {
+        clearValue();
+        inputRef.current?.focus();
+    };
+    // Escape limpia, igual que v2 (`handleKeyDown` de `use-input.ts`: con valor, limpiable y
+    // no de solo lectura). El `onKeyDown` del consumidor se llama primero.
+    const handleKeyDown = (event) => {
+        onKeyDown?.(event);
+        if (event.key === "Escape" && showClear) {
+            clearValue();
+        }
     };
-    return (jsxRuntime.jsxs(react.TextField, { id: inputId, name: name, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, isReadOnly: isReadOnly, className: react.cn(FIELD_STACK_CLASS$3[size], fullWidth ? "w-full" : "", 
+    return (jsxRuntime.jsxs(react.TextField, { id: inputId, value: currentValue, 
+        // Solo el modo no controlado escribe aquí; en controlado manda el `value` del padre
+        // (que se entera por `onChange`/`onValueChange` del `<input>`).
+        onChange: isControlled ? undefined : setUncontrolledValue, name: name, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, isReadOnly: isReadOnly, className: react.cn(FIELD_STACK_CLASS$3[size], fullWidth ? "w-full" : "", 
+        // `mainWrapper` de v2 no tiene nodo propio aquí (ver tabla en `Input.types.ts`):
+        // se fusiona en la raíz antes que `base`, que es el slot más externo.
+        classNames?.mainWrapper, 
+        // `base` de v2 = la raíz. v2 los juntaba así: `clsx(classNames.base, className)`.
+        classNames?.base, 
         // El `className` del consumidor, en la raíz y en último lugar: el slot `base` de
         // v2 y la posición que le deja ganar en tailwind-merge (ver bloque de arriba).
         className), children: [label && (jsxRuntime.jsx(react.Label, { className: react.cn(LABEL_CLASS$4, LABEL_LEFT_CLASS[variant], variant === "underlined" ? "top-0" : LABEL_OFFSET_CLASS$1[size], isInvalid ? INVALID_LABEL_CLASS$2 : "", labelFlotante ? LABEL_INSIDE_CLASS[size] : "", labelFlotante ? LABEL_FLOAT_CLASS : "", classNames?.label), children: label })), jsxRuntime.jsxs(react.InputGroup, { isInvalid: isInvalid, isDisabled: isDisabled, isReadOnly: isReadOnly, className: react.cn(SIZE_CLASS$3[size], radius === "full" ? PADDING_FULL_CLASS$1[size] : PADDING_CLASS$2[size], variant === "underlined" ? UNDERLINED_INNER_CLASS$1[size] : "", RADIUS_CLASS$6[radius], VARIANT_CLASS$3[variant], FIELD_FOCUS_CLASS$3, FIELD_SHADOW_CLASS$2, 
                 // Incondicional, como el `inputWrapper` de v2: la caja del campo llena
                 // siempre su raíz, y es la raíz la que responde a `fullWidth` y al ancho que
                 // pase el consumidor.
-                "w-full", classNames?.inputWrapper), children: [startContent && (jsxRuntime.jsx(react.InputGroup.Prefix, { className: "border-none bg-transparent px-0", children: startContent })), jsxRuntime.jsx(react.InputGroup.Input, { ...rest, ref: ref, required: required, type: type, placeholder: labelFlotante ? " " : placeholder, value: value, defaultValue: defaultValue, onChange: handleChange, className: react.cn("bg-transparent p-0", SIZE_TEXT_CLASS$2[size], isInvalid ? INVALID_TEXT_CLASS$2 : "", startContent ? "ps-1.5" : "", endContent || showClear ? "pe-1.5" : "", classNames?.input) }), showClear && (jsxRuntime.jsx(react.CloseButton, { "aria-label": "Limpiar", className: "h-4 w-4 min-h-0 p-0.5 mr-1", onPress: handleClear })), endContent && (jsxRuntime.jsx(react.InputGroup.Suffix, { className: "border-none bg-transparent px-0", children: endContent }))] }), description && !isInvalid && (jsxRuntime.jsx(react.Description, { className: react.cn(HELPER_CLASS$2, "text-left", classNames?.description), children: description })), isInvalid && errorMessage && (jsxRuntime.jsx(react.FieldError, { className: react.cn(HELPER_CLASS$2, "text-left", classNames?.errorMessage), children: errorMessage }))] }));
+                "w-full", 
+                // v3 fusiona `innerWrapper` e `inputWrapper` de v2 en este único elemento.
+                classNames?.innerWrapper, classNames?.inputWrapper), children: [startContent && (jsxRuntime.jsx(react.InputGroup.Prefix, { className: "border-none bg-transparent px-0", children: startContent })), jsxRuntime.jsx(react.InputGroup.Input, { ...rest, ref: setInputRef, onKeyDown: handleKeyDown, required: required, type: type, placeholder: labelFlotante ? " " : placeholder, onChange: handleChange, className: react.cn("bg-transparent p-0", SIZE_TEXT_CLASS$2[size], isInvalid ? INVALID_TEXT_CLASS$2 : "", startContent ? "ps-1.5" : "", endContent || showClear ? "pe-1.5" : "", classNames?.input) }), showClear && (jsxRuntime.jsx(react.CloseButton, { "aria-label": "Limpiar", className: react.cn("h-4 w-4 min-h-0 p-0.5 mr-1", classNames?.clearButton), onPress: handleClear })), endContent && (jsxRuntime.jsx(react.InputGroup.Suffix, { className: "border-none bg-transparent px-0", children: endContent }))] }), description && !isInvalid && (jsxRuntime.jsx(react.Description, { className: react.cn(HELPER_CLASS$2, "text-left", classNames?.helperWrapper, classNames?.description), children: description })), isInvalid && errorMessage && (jsxRuntime.jsx(react.FieldError, { className: react.cn(HELPER_CLASS$2, "text-left", classNames?.helperWrapper, classNames?.errorMessage), children: errorMessage }))] }));
 });
 Input.displayName = "Input";
 
@@ -1845,12 +2370,36 @@ const RADIUS_CLASS$5 = {
 // v3 no tiene prop `shadow`: su Card siempre usa `shadow-surface`. Los valores de v2 se
 // reproducen con los tokens propios `--aurora-shadow-*` (emitidos en F1, mismo valor exacto que
 // generaba el plugin `heroui()` de v2 — ver findings/tabla-mapeo-tokens.md §2).
+//
+// ⚠️ El prefijo `shadow:` dentro del corchete NO es decorativo. Sin él, tailwind-merge 3 clasifica
+// `shadow-[var(--x)]` como COLOR de sombra (grupo `shadow-color`), no como sombra: medido con el
+// `cn` real, `cn("shadow-[var(--aurora-shadow-small)]", "shadow-2xl")` conserva LAS DOS, y en el
+// CSS de Tailwind 4 la arbitraria se emite después de `shadow-2xl` (orden de candidato), así que
+// ganaba la nuestra — el `shadow-2xl` que pide `whatsapp-setup-modal` no se veía. Con la etiqueta
+// `shadow:` tailwind-merge la reconoce como sombra y la retira cuando la app pasa la suya; el CSS
+// que emite Tailwind 4 es idéntico (`--tw-shadow: var(--aurora-shadow-small)`, comprobado con
+// `@tailwindcss/node`).
 const SHADOW_CLASS = {
     none: "shadow-none",
-    sm: "shadow-[var(--aurora-shadow-small)]",
-    md: "shadow-[var(--aurora-shadow-medium)]",
-    lg: "shadow-[var(--aurora-shadow-large)]",
-};
+    sm: "shadow-[shadow:var(--aurora-shadow-small)]",
+    md: "shadow-[shadow:var(--aurora-shadow-medium)]",
+    lg: "shadow-[shadow:var(--aurora-shadow-large)]",
+};
+// Literales del `tv` de v2 (`@heroui/theme@2.4.15`, `dist/components/card.js`), con sus tokens
+// traducidos a los que existen en Tailwind 4 + Aurora:
+//   isPressable → `cursor-pointer` + compound `data-[pressed=true]:scale-[0.97]
+//                 tap-highlight-transparent` (el hundido lo hace aquí `:active`, que es lo que
+//                 marcaba `data-pressed` en un botón nativo)
+//   disableAnimation=false → `transition-transform-background motion-reduce:transition-none`
+//   foco → `dataFocusVisibleClasses` (`outline-2 outline-focus outline-offset-2`)
+//   isHoverable → `data-[hover=true]:bg-content2` (aquí `hover:`, react-aria ya no escribe
+//                 `data-hover` — trampa 3 de la skill `auraui-components`)
+//   isDisabled → `opacity-disabled cursor-not-allowed` (`opacity-disabled` era 0.5 en v2)
+//   fullWidth → `w-full`
+const PRESSABLE_CLASS = "isolate cursor-pointer text-foreground outline-none focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-focus focus-visible:outline-offset-2 [-webkit-tap-highlight-color:transparent]";
+const PRESS_ANIMATION_CLASS = "transition-[transform,background-color] motion-reduce:transition-none active:scale-[0.97]";
+const HOVERABLE_CLASS = "hover:bg-content2";
+const DISABLED_CLASS = "opacity-50 cursor-not-allowed";
 /**
  * Card genérica siguiendo las reglas de diseño BeweOS basada en HeroUI v3.
  *
@@ -1864,18 +2413,50 @@ const SHADOW_CLASS = {
  * - Shadow: none, sm, md, lg (configurable, reimplementado vía className — v3 no tiene la prop)
  * - Radius: sm (por defecto, configurable, reimplementado vía className — v3 no tiene la prop)
  * - Padding configurable (sm, md, lg)
+ * - `className` de la app AL FINAL y fusionado con `cn` (tailwind-merge), como el `slots.base({
+ *   class })` de v2: un `p-0`/`rounded-xl`/`shadow-2xl` de la app retira el default de la fachada
+ *   en vez de competir con él por orden de CSS.
+ * - `ref` y TODAS las props DOM (`style`, `onMouse*`, `aria-*`, `data-*`…) llegan al nodo raíz,
+ *   como en v2 (`HTMLHeroUIProps<"div">`).
+ * - API v2 de card pulsable: `isPressable`/`onPress`/`disableAnimation`/`disableRipple`, más
+ *   `isHoverable`/`isDisabled`/`fullWidth`.
+ *
+ * `ref` se reenvía con `forwardRef` (patrón de las fachadas de campo del repo, ver
+ * `Input.tsx`) y apunta al nodo raíz: el `<div>` o, con `isPressable`, el `<button>`.
  */
-const Card = ({ children, className = "", shadow = "sm", radius = "sm", padding = "md", ...props }) => {
-    const combinedClassName = [
-        paddingClasses[padding],
-        RADIUS_CLASS$5[radius],
-        SHADOW_CLASS[shadow],
-        className,
-    ]
-        .filter(Boolean)
-        .join(" ");
-    return (jsxRuntime.jsx(react.Card, { className: combinedClassName, ...props, children: children }));
-};
+const Card = $8WNJc$react.forwardRef(({ children, className, shadow = "sm", radius = "sm", padding = "md", isPressable = false, onPress, onClick, disableAnimation = false, disableRipple = false, isHoverable = false, isDisabled = false, fullWidth = false, render, ...props }, ref) => {
+    // Como en v2 (`@heroui/card@2.2.21`, `useCard`): `disableAnimation` apaga también la onda.
+    const sinRipple = disableRipple || disableAnimation;
+    const { ondas, lanzar, quitar } = useRipple();
+    const handleClick = $8WNJc$react.useCallback((event) => {
+        onClick?.(event);
+        if (!isPressable || isDisabled) {
+            return;
+        }
+        const pressEvent = pressEventFromClick(event);
+        onPress?.(pressEvent);
+        if (!sinRipple) {
+            lanzar(pressEvent);
+        }
+    }, [onClick, isPressable, isDisabled, onPress, sinRipple, lanzar]);
+    const combinedClassName = react.cn(paddingClasses[padding], RADIUS_CLASS$5[radius], SHADOW_CLASS[shadow], fullWidth ? "w-full" : "", isPressable ? PRESSABLE_CLASS : "", isPressable && !disableAnimation ? PRESS_ANIMATION_CLASS : "", isHoverable ? HOVERABLE_CLASS : "", isDisabled ? DISABLED_CLASS : "", 
+    // El `className` de la app, último: gana por fusión (ver JSDoc).
+    className);
+    // v2 cambiaba el ELEMENTO a `<button>` con `isPressable` (`Component = as || (isPressable
+    // ? "button" : "div")`). v3 lo permite con `render` (DOMRenderProps: basta con conectar
+    // el `ref`, que ya viene en `domProps`), así que se conserva el `CardContext` del
+    // compound y los `Card.Header`/`CardBody` de dentro siguen funcionando.
+    const pressableRender = isPressable
+        ? (domProps) => (jsxRuntime.jsx("button", { ...domProps, type: "button", 
+            // v2 (`useCard`): `{ ...buttonProps, ...focusProps, role: "button" }` y
+            // `tabIndex: isPressable ? 0 : -1`. En un `<button>` nativo el rol ya es
+            // `button` implícito (biome marca el explícito como redundante); el
+            // `tabIndex` se escribe igual que v2.
+            tabIndex: isDisabled ? -1 : 0, disabled: isDisabled }))
+        : render;
+    return (jsxRuntime.jsxs(react.Card, { ...props, ref: ref, className: combinedClassName, "data-pressable": isPressable || undefined, "data-disabled": isDisabled || undefined, onClick: isPressable || onClick ? handleClick : undefined, render: pressableRender, children: [children, isPressable && ondas.length > 0 && (jsxRuntime.jsx(CapaRipple, { ondas: ondas, onFin: quitar }))] }));
+});
+Card.displayName = "Card";
 
 const H2 = ({ children, className, ...props }) => {
     return (jsxRuntime.jsx("h2", { className: react.cn("text-lg font-semibold", className), ...props, children: children }));
@@ -2113,10 +2694,221 @@ function withCollectionItemIds(children) {
     return Object.keys(patch).length > 0 ? $8WNJc$react.cloneElement(element, patch) : element;
 }
 
+/**
+ * Repone en los items y secciones de una colección de v3 la API de CONTENIDO de v2 que las apps
+ * siguen escribiendo en `SelectItem`/`AutocompleteItem`/`SelectSection` (TECH-2459, hallazgo
+ * beweossmbs 23-sep).
+ *
+ * QUÉ HACÍA v2 (`@heroui/listbox@2.3.31`, `dist/chunk-2TBDFBA3.mjs`, leído del tarball):
+ *
+ *   <li …getItemProps()>
+ *     {startContent && <span data-slot="startContent">…}
+ *     {description
+ *        ? <div wrapper><span title>{rendered}</span><span description>{description}</span></div>
+ *        : <span title>{rendered}</span>}
+ *     {selectedIcon}
+ *     {endContent && <span data-slot="endContent">…}
+ *   </li>
+ *
+ * con los slots del `tv` (`@heroui/theme@2.4.15`, `dist/components/listbox.js:100-139`):
+ * `wrapper: "w-full flex flex-col items-start justify-center"`, `title: "flex-1 text-small
+ * font-normal"`, `description: "w-full text-tiny text-foreground-500 …"`. La sección
+ * (`chunk-Q2EVG7SO.mjs`) pintaba la cabecera `heading: "pl-1 text-tiny text-foreground-500"` y,
+ * con `showDivider` (default `false`), un `Divider` con `mt-2` al final.
+ *
+ * QUÉ HACE v3. `ListBox.Item` no tiene NINGUNA de esas props (la guía oficial: «Place icons
+ * manually in item content», «Use `Description` component»; y `title` de la sección → `Header`).
+ * Pasadas tal cual se descartan en silencio: el `filterDOMProps` de react-aria no las deja llegar
+ * al DOM y el item pinta solo su texto.
+ *
+ * POR QUÉ AQUÍ Y NO EN EL SHIM. `SelectItem`/`AutocompleteItem`/`SelectSection` tienen que seguir
+ * siendo el MISMO objeto que `ListBoxItem`/`ListBoxSection`: el normalizador de ids
+ * (`utils/collection-items.ts`) y el indicador (`with-item-indicator.tsx`) reconocen los items por
+ * identidad de `element.type`, y un envoltorio los volvería invisibles (los items dentro de una
+ * sección perderían su `id` derivado de la `key`, que es el defecto nº 1 de la migración). Así que
+ * el shim solo TIPA las props v2 y esta función, llamada desde la fachada que tiene los items en
+ * la mano, las traduce a la anatomía de v3.
+ *
+ * NO-OP cuando no hay nada que traducir: un item sin `description`/`startContent`/`endContent`/
+ * `classNames` se devuelve tal cual (mismo objeto), así que los 150+ items planos de las apps no
+ * cambian ni un nodo.
+ */
+/** Marca de lo que v2 NO pintaba en el disparador: allí solo iba el `textValue` del item. */
+const ITEM_EXTRA_ATTR = "data-aura-item-extra";
+/**
+ * Clase para `Select.Value`: esconde en el disparador lo que v2 solo pintaba en la lista.
+ *
+ * `SelectValue` de react-aria repinta los CHILDREN del item elegido dentro del disparador
+ * (`react-aria-components/dist/private/Select.mjs:226-262`). v2 pintaba ahí solo el `textValue`
+ * (`@heroui/select@2.4.33`, `dist/chunk-BJWIL32D.mjs`: `state.selectedItems.map(i =>
+ * i.textValue).join(", ")`), así que el icono lateral no debe colarse junto al valor. La
+ * descripción se esconde SOLA: `Description` de v3 devuelve `null` sin el slot de texto
+ * `description`, y `SelectValue` resetea ese contexto (`TextContext.Provider value={undefined}`,
+ * misma línea) — el mismo mecanismo que usa v3 para esconder su indicador ahí (`select.css:121`).
+ */
+const HIDE_ITEM_EXTRAS_CLASS = `[&_[${ITEM_EXTRA_ATTR}]]:hidden`;
+// Literales de v2 portados a la pieza de v3, sin clases v2 muertas (`text-small`/`text-tiny` no
+// existen sin el plugin `heroui()` y `cn` las borraría). El tamaño del título NO se fija: el
+// desplegable de v3 ya es `text-sm` (= el `text-small` de v2) y dentro del disparador tiene que
+// heredar el tamaño del campo (`lg` = 16px).
+const ITEM_WRAPPER_CLASS = "flex w-full min-w-0 flex-col items-start justify-center";
+const ITEM_TITLE_CLASS$1 = "min-w-0 flex-1 font-normal";
+// `Description` de v3 ya trae `text-xs text-muted` (`description.css`), y `text-muted` es el mismo
+// zinc-500/400 que el `text-foreground-500` de v2 (medido en `Dropdown.tsx`, bloque de la cabecera).
+const ITEM_DESCRIPTION_CLASS = "w-full";
+const ITEM_SIDE_CLASS = "flex shrink-0 items-center";
+// Cabecera de sección: mismo único ajuste que la fachada `Dropdown` (ver `SECTION_HEADING_CLASS`
+// en `Dropdown.tsx`: tamaño y color de `.header` ya coinciden con v2; el peso no).
+const SECTION_HEADING_CLASS$1 = "font-normal";
+// `mt-2` del slot `divider` de v2; el ancho y el color los pone el `Separator` de v3.
+const SECTION_DIVIDER_CLASS = "mt-2";
+/** `isEmpty` de v2 (`@heroui/shared-utils`): null/undefined/""/false no cuentan. */
+function hasValue$2(node) {
+    return node !== null && node !== undefined && node !== "" && node !== false;
+}
+function translateItem(element) {
+    const { children, className, description, startContent, endContent, classNames, } = element.props;
+    const hasDescription = hasValue$2(description);
+    const hasStart = hasValue$2(startContent);
+    const hasEnd = hasValue$2(endContent);
+    if (!(hasDescription || hasStart || hasEnd || classNames)) {
+        return element;
+    }
+    // Solo `classNames.base` (el caso de `timezone-search-select`): nada que recomponer, basta
+    // fusionar la clase en la raíz. Y children como función (render props de react-aria): no se
+    // puede componer alrededor sin romper la firma, así que se aplican solo las clases de la raíz.
+    const onlyBase = !(hasDescription ||
+        hasStart ||
+        hasEnd ||
+        classNames?.title ||
+        classNames?.wrapper ||
+        classNames?.description);
+    if (onlyBase || typeof children === "function") {
+        return $8WNJc$react.cloneElement(element, {
+            className: react.cn(classNames?.base, className) || undefined,
+            description: undefined,
+            startContent: undefined,
+            endContent: undefined,
+            classNames: undefined,
+        });
+    }
+    const title = (jsxRuntime.jsx("span", { className: react.cn(ITEM_TITLE_CLASS$1, classNames?.title), children: children }));
+    const next = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [hasStart && (jsxRuntime.jsx("span", { "data-slot": "start-content", [ITEM_EXTRA_ATTR]: "", className: ITEM_SIDE_CLASS, children: startContent })), hasDescription ? (jsxRuntime.jsxs("div", { className: react.cn(ITEM_WRAPPER_CLASS, classNames?.wrapper), children: [title, jsxRuntime.jsx(react.Description, { className: react.cn(ITEM_DESCRIPTION_CLASS, classNames?.description), children: description })] })) : (title), hasEnd && (jsxRuntime.jsx("span", { "data-slot": "end-content", [ITEM_EXTRA_ATTR]: "", className: ITEM_SIDE_CLASS, children: endContent }))] }));
+    return $8WNJc$react.cloneElement(element, {
+        // v2: `cn(classNames?.base, className)` (`use-listbox-item.mjs`), así que `className` gana.
+        className: react.cn(classNames?.base, className) || undefined,
+        description: undefined,
+        startContent: undefined,
+        endContent: undefined,
+        classNames: undefined,
+        children: next,
+    });
+}
+function translateSection(element) {
+    const { children, className, title, showDivider, classNames } = element.props;
+    const inner = withV2ItemContent(children);
+    const hasTitle = hasValue$2(title);
+    if (!(hasTitle || showDivider || classNames) && inner === children) {
+        return element;
+    }
+    // ⚠️ Los hijos van como ARGUMENTOS SUELTOS de `cloneElement`, no envueltos en un Fragment:
+    // `withItemIndicator` (que corre después) y `withCollectionItemIds` bajan a los items de una
+    // sección leyendo `props.children` como array o elemento, y un Fragment los escondería — los
+    // items de la sección se quedarían sin checkmark.
+    const parts = [];
+    if (hasTitle) {
+        parts.push(jsxRuntime.jsx(react.Header, { className: react.cn(SECTION_HEADING_CLASS$1, classNames?.heading), children: title }, "aura-section-header"));
+    }
+    parts.push(...(Array.isArray(inner) ? inner : [inner]));
+    if (showDivider) {
+        parts.push(jsxRuntime.jsx(react.Separator, { className: react.cn(SECTION_DIVIDER_CLASS, classNames?.divider) }, "aura-section-divider"));
+    }
+    return $8WNJc$react.cloneElement(element, {
+        className: react.cn(classNames?.base, className) || undefined,
+        // `title` en v3 es el atributo global de HTML: sin retirarlo sale como *tooltip*
+        // nativo sobre toda la sección (el mismo motivo por el que v2 lo quitaba del spread,
+        // `chunk-Q2EVG7SO.mjs`: «removed title from props to avoid browsers showing a tooltip»).
+        title: undefined,
+        showDivider: undefined,
+        classNames: undefined,
+    }, ...parts);
+}
+/**
+ * Traduce la API de contenido v2 de cada item/sección de la colección. Va DESPUÉS de
+ * `withCollectionItemIds` (que deriva el `textValue` del texto del item: si la descripción ya
+ * estuviera dentro, la sumaría al texto de búsqueda y del disparador) y ANTES de
+ * `withItemIndicator`.
+ *
+ * Acepta también children como FUNCIÓN (colección dinámica con `items`, la forma de 11 de los 11
+ * `AuraAutocomplete` de beweossmbs): se envuelve la función para traducir lo que devuelva.
+ */
+function withV2ItemContent(children) {
+    if (typeof children === "function") {
+        const render = children;
+        return ((item) => withV2ItemContent(render(item)));
+    }
+    if (Array.isArray(children)) {
+        return children.map((child) => withV2ItemContent(child));
+    }
+    if (!$8WNJc$react.isValidElement(children)) {
+        return children;
+    }
+    if (children.type === react.ListBoxSection) {
+        return translateSection(children);
+    }
+    if (children.type === react.ListBoxItem) {
+        return translateItem(children);
+    }
+    return children;
+}
+
 /** Traducciones por defecto en español (mismo literal que la ✕ de la fachada `Input`). */
 const DEFAULT_TRANSLATIONS$f = {
     clearButtonAriaLabel: "Limpiar",
+    emptyContent: "No se encontraron resultados",
 };
+/*
+ * La lista vacía (TECH-2459, hallazgo beweossmbs 23-sep: 6 `AuraAutocomplete` pasan
+ * `listboxProps.emptyContent` y ninguno se veía).
+ *
+ * v2 (`@heroui/autocomplete@2.3.34`, `dist/chunk-J7SBPTP2.mjs`, leído del tarball):
+ *
+ *   allowsEmptyCollection = true,                                         (l.36, default)
+ *   listboxProps: mergeProps({
+ *     hideEmptyContent: allowsCustomValue && !listboxProps?.emptyContent, (l.160)
+ *     emptyContent: "No results found.",                                  (l.161)
+ *   }, listboxProps)
+ *
+ * O sea: abría la lista aunque el filtro la dejara vacía, y pintaba un texto — salvo con
+ * `allowsCustomValue` sin texto propio (campo libre: "sin resultados" no es un error ahí). v3 invierte
+ * el default (`allowsEmptyCollection` a `false`: la lista se CIERRA al quedarse vacía) y su `ListBox`
+ * no pinta nada sin `renderEmptyState`. Se reponen las dos cosas con la misma regla de v2; un
+ * `allowsEmptyCollection` explícito del consumidor sigue mandando. El texto por defecto va
+ * traducido (patrón i18n del repo), no el inglés de v2.
+ *
+ * Medidas: las del estado vacío de `Select` (hueco del alto de una opción de v3, gris
+ * `text-foreground-400` del slot `emptyContent` de v2), con el `px-2` del item de v3 porque este
+ * popover no pisa el padding de los items como sí hace el del Select.
+ */
+const EMPTY_CONTENT_CLASS$1 = "flex min-h-9 w-full items-center px-2 py-1.5 text-start text-foreground-400";
+/*
+ * El mensaje de error (v2 `errorMessage`, 3 usos en beweossmbs que hoy no se veían). v2 lo pintaba
+ * bajo el campo en el `helperWrapper` del `Input` (`p-1` + `text-tiny text-danger`), solo con el
+ * campo inválido. `FieldError` de v3 ya trae `px-1 text-xs text-danger` (`field-error.css`) y se
+ * muestra solo cuando react-aria da el campo por inválido; el `text-left` es por si el campo vive
+ * en un contenedor centrado. El hueco lo da el `gap-2` del stack, en vez de los 4px del `p-1`: la
+ * diferencia es de 4px y se deja en el ritmo de v3 (§9.1).
+ */
+const ERROR_MESSAGE_CLASS = "text-left";
+/*
+ * `isLoading` (v2): el `selectorButton` pasaba a `isLoading` y su spinner ocupaba el sitio del
+ * chevron (`chunk-J7SBPTP2.mjs:168`). ⚠️ En la fachada de v2 eso no se veía con la lupa puesta,
+ * porque esa fachada ocultaba el `selectorButton` cuando había icono (`selectorButton: "!hidden"`,
+ * `git show b39d28f:src/components/autocomplete/AutoComplete.tsx`): el spinner se escondía con él.
+ * Aquí se muestra SIEMPRE, en el sitio del extremo que haya (icono o chevron), porque una prop que
+ * no pinta nada con la configuración por defecto es justo lo que la app reporta como roto.
+ */
+const SPINNER = (jsxRuntime.jsx(react.Spinner, { "aria-hidden": true, "data-slot": "autocomplete-spinner", size: "sm", color: "current", className: "text-default-400" }));
 /**
  * Clases del wrapper del icono: lo mete DENTRO del recuadro del campo.
  *
@@ -2417,11 +3209,20 @@ const AuraAutocomplete = ({ label, id, icon, placeholder, className, children, v
 // limpiarlo. Se reenvían tal cual al `ComboBox`, así que para el consumidor no cambia nada:
 // pasar `undefined` es indistinguible de no pasarlos (react-aria decide controlado/no
 // controlado con `!== undefined`).
-isClearable = true, isReadOnly, inputValue, selectedKey, onInputChange, onSelectionChange, translations, radius: _radius, ...props }) => {
+isClearable = true, isReadOnly, inputValue, selectedKey, onInputChange, onSelectionChange, translations, radius: _radius, isInvalid, errorMessage, listboxProps, isLoading = false, allowsCustomValue, allowsEmptyCollection, ...props }) => {
     const generatedId = $8WNJc$react.useId();
     const autoId = id || generatedId;
-    const resolvedIcon = icon === undefined ? DEFAULT_ICON : icon;
+    // Con `isLoading` el spinner ocupa el extremo (ver `SPINNER`): a efectos de maquetación es el
+    // icono, así que todas las decisiones de hueco de abajo lo tratan como tal.
+    const resolvedIcon = isLoading
+        ? SPINNER
+        : icon === undefined
+            ? DEFAULT_ICON
+            : icon;
     const t = { ...DEFAULT_TRANSLATIONS$f, ...translations };
+    // La regla de v2 para la lista vacía (ver `EMPTY_CONTENT_CLASS`).
+    const hideEmptyContent = Boolean(allowsCustomValue) && listboxProps?.emptyContent == null;
+    const emptyContent = listboxProps?.emptyContent ?? t.emptyContent;
     /** El `<input>` real, para devolverle el foco tras limpiar (ver `handleClear`). */
     const inputRef = $8WNJc$react.useRef(null);
     // `data-visible` de v2, traducido a montar/no montar: `!!state.selectedItem ||
@@ -2457,7 +3258,7 @@ isClearable = true, isReadOnly, inputValue, selectedKey, onInputChange, onSelect
         onInputChange?.("");
         inputRef.current?.focus();
     };
-    return (jsxRuntime.jsxs(react.ComboBox, { id: autoId, isDisabled: isDisabled, isReadOnly: isReadOnly, inputValue: inputValue, selectedKey: selectedKey, onInputChange: onInputChange, onSelectionChange: onSelectionChange, className: [FIELD_STACK_CLASS$2, className].filter(Boolean).join(" "), ...props, children: [label && jsxRuntime.jsx(react.Label, { className: LABEL_CLASS$3, children: label }), jsxRuntime.jsxs(react.ComboBox.InputGroup, { className: [
+    return (jsxRuntime.jsxs(react.ComboBox, { id: autoId, isDisabled: isDisabled, isReadOnly: isReadOnly, inputValue: inputValue, selectedKey: selectedKey, onInputChange: onInputChange, onSelectionChange: onSelectionChange, isInvalid: isInvalid, allowsCustomValue: allowsCustomValue, allowsEmptyCollection: allowsEmptyCollection ?? !hideEmptyContent, className: [FIELD_STACK_CLASS$2, className].filter(Boolean).join(" "), ...props, children: [label && jsxRuntime.jsx(react.Label, { className: LABEL_CLASS$3, children: label }), jsxRuntime.jsxs(react.ComboBox.InputGroup, { className: [
                     SIZE_CLASS$2[size],
                     PADDING_CLASS$1[size],
                     variant === "underlined" ? UNDERLINED_INNER_CLASS[size] : "",
@@ -2520,7 +3321,13 @@ isClearable = true, isReadOnly, inputValue, selectedKey, onInputChange, onSelect
                             isDisabled ? ICON_DISABLED_CLASS : "",
                         ]
                             .filter(Boolean)
-                            .join(" "), children: resolvedIcon })), jsxRuntime.jsx(react.ComboBox.Trigger, { className: resolvedIcon != null ? "hidden" : undefined })] }), jsxRuntime.jsx(react.ComboBox.Popover, { children: jsxRuntime.jsx(react.ListBox, { autoFocus: "first", className: OPCIONES_CLASS, children: withCollectionItemIds(children) }) })] }));
+                            .join(" "), children: resolvedIcon })), jsxRuntime.jsx(react.ComboBox.Trigger, { className: resolvedIcon != null ? "hidden" : undefined })] }), isInvalid && errorMessage != null && errorMessage !== false && (jsxRuntime.jsx(react.FieldError, { className: ERROR_MESSAGE_CLASS, children: errorMessage })), jsxRuntime.jsx(react.ComboBox.Popover, { children: jsxRuntime.jsx(react.ListBox, { autoFocus: "first", className: OPCIONES_CLASS, renderEmptyState: hideEmptyContent
+                        ? undefined
+                        : () => jsxRuntime.jsx("div", { className: EMPTY_CONTENT_CLASS$1, children: emptyContent }), children: withV2ItemContent(
+                    // El normalizador de `utils/` está tipado solo para `ReactNode`; con una
+                    // función la devuelve tal cual (`isValidElement` es falso), así que el cast
+                    // solo alinea el tipo con lo que ya pasa en ejecución.
+                    withCollectionItemIds(children)) }) })] }));
 };
 
 /**
@@ -8279,6 +9086,32 @@ const FIELD_BORDER_CLASS = "border-2 border-default-200 bg-background focus-with
  */
 const ROOT_INLINE_LABEL_CLASS = "flex-row items-center gap-x-2 flex-nowrap";
 const LABEL_CLASS$2 = "text-xs font-normal text-default-600";
+/*
+ * TECH-2459 · hallazgo widgets 23-sep (`findings/app-widgets-timeinput-label-inline.md`) — la
+ * etiqueta ENCIMA, para el nombre `TimeInput` a secas.
+ *
+ * En v2 (0.6.85, `dist/index.esm.js`) había DOS componentes bajo dos nombres: la fachada de arriba
+ * (con `labelPlacement: "outside-left"`) se exportaba SOLO como `TimeInputComponent`
+ * (`export { …, TimeInput as TimeInputComponent, … }`), y `TimeInput` a secas llegaba por el
+ * `export * from '@heroui/react'`: el crudo de HeroUI 2.7.11, con la etiqueta encima. v1 había
+ * apuntado los dos nombres a la fachada en línea, y el alta de agenda de widgets (que importa
+ * `TimeInput` a secas junto a un `DatePicker`) quedó con «Hora» a la izquierda y «Fecha» encima.
+ *
+ * Las clases son las MISMAS que la fachada de `DatePicker` pone en su raíz y en su `Label`
+ * (`DatePicker.tsx`: `"flex flex-col gap-1"` y `"text-default-600 text-xs font-medium"`), para que
+ * en un formulario las dos etiquetas y los dos campos caigan en la misma línea. El grupo ya mide lo
+ * mismo que el `size="md"` por defecto del `DatePicker` (`h-10 min-h-10`).
+ */
+const ROOT_OUTSIDE_LABEL_CLASS = "flex flex-col gap-1";
+const OUTSIDE_LABEL_CLASS = "text-default-600 text-xs font-medium";
+const ROOT_CLASS = {
+    outside: ROOT_OUTSIDE_LABEL_CLASS,
+    "outside-left": ROOT_INLINE_LABEL_CLASS,
+};
+const LABEL_CLASS_BY_PLACEMENT = {
+    outside: OUTSIDE_LABEL_CLASS,
+    "outside-left": LABEL_CLASS$2,
+};
 const GROUP_SIZE_CLASS = "flex-1 h-10 min-h-10 shadow-xs";
 /*
  * TECH-2459 · F5 · R3 — Avance de los segmentos: se reproduce el de v2 MEDIDO en el PNG.
@@ -8338,31 +9171,64 @@ const DAY_PERIOD_SEGMENT_CLASS = "ms-0.5";
  * el texto (`rgb(243,18,96)`). Deuda a reportar aparte, no de este arreglo.
  */
 const FIELD_FOCUS_CLASS$2 = "ring-0 ring-offset-0";
+/*
+ * TECH-2459 · hallazgo beweossmbs 23-sep — `startContent`/`endContent` de v2, repuestas DENTRO de
+ * la caja del campo.
+ *
+ * v2 (`@heroui/date-input@2.3.32`, `dist/time-input.js:319-329`) las pintaba en el `innerWrapper`,
+ * dentro del `inputWrapper` (la caja con borde): `startContent`, los segmentos y `endContent`, en
+ * ese orden. El `tv` de v2 (`@heroui/theme@2.4.15`, `date-input.js`) da a ese envoltorio
+ * `flex items-center … w-full gap-x-2` y al `inputWrapper` `px-3 gap-3`. v1 no aceptaba las
+ * props: el alta de citas de beweossmbs (`datetime-section.component.tsx`) pone ahí las flechas ±
+ * de la rejilla de horas y desaparecían.
+ *
+ * En v3 el sitio equivalente son `TimeField.Prefix`/`TimeField.Suffix` (`DateInputGroupPrefix`/
+ * `Suffix`), hijos del mismo `TimeField.Group`. Sus márgenes ya son los de v2 (`ms-3`/`me-3` = el
+ * `px-3` del wrapper, y el input pasa a `pe-2`/`ps-2` = el `gap-x-2`), así que solo se añade una
+ * cosa: `pointer-events-auto`. `.date-input-group__prefix/__suffix` de `@heroui/styles` los
+ * declara `pointer-events-none` (pensados para un icono decorativo) y solo `.date-picker` los
+ * reactiva; en un `TimeField` un botón puesto ahí no recibiría el clic. v2 no tenía esa regla.
+ */
+const CONTENT_SLOT_CLASS = "pointer-events-auto";
 /**
- * TimeInput genérico reutilizable, migrado al `TimeField` compound de HeroUI v3 (el `TimeInput`
- * de v2 se elimina). Mantiene `label` + los props de estado de v2 (`value`, `onChange`,
- * `isDisabled`, `isInvalid`, `isRequired`, `granularity`, `hourCycle`, `minValue`, `maxValue`…),
- * que no cambiaron (son de React Aria, no de HeroUI).
- *
- * La etiqueta va en línea a la izquierda del campo, como en v2 (ver el bloque de arriba). v2 no
- * exponía `labelPlacement` en su API pública (`Omit<HeroUITimeInputProps, "labelPlacement">`), así
- * que aquí tampoco: la colocación es la del diseño de BeweOS y no se configura.
+ * Implementación común de los dos nombres exportados. La única diferencia entre `TimeInput` y
+ * `TimeInputComponent` es el valor por defecto de `labelPlacement`; una `labelPlacement` explícita
+ * gana siempre.
  */
-function TimeInput({ label, id, className, 
+function TimeInputBase({ label, id, className, labelPlacement, 
 // v2 lo forzaba a `true` en su propio hook (`@heroui/date-input@2.3.24` →
 // `dist/use-time-input.js:58`, `shouldForceLeadingZeros = true`), así que la referencia v2
 // muestra "09:00 AM"; React Aria por sí solo deja "9:00 AM". Es una prop de React Aria que v3
 // sigue aceptando (`AriaTimeFieldProps`), solo cambió el default.
-shouldForceLeadingZeros = true, ...props }) {
+shouldForceLeadingZeros = true, startContent, endContent, ...props }) {
     const generatedId = $8WNJc$react.useId();
     const autoId = id || generatedId;
     return (jsxRuntime.jsxs(react.TimeField, { id: autoId, 
         // `cn` (tailwind-merge) y no una concatenación: el consumidor tiene que poder pisar la
         // colocación y el ancho (`ScheduleRow` pasa `w-full`). Todas las clases de aquí son
         // vocabulario v3 válido, así que tailwind-merge las resuelve bien.
-        className: react.cn(ROOT_INLINE_LABEL_CLASS, className), shouldForceLeadingZeros: shouldForceLeadingZeros, ...props, children: [label && jsxRuntime.jsx(react.Label, { className: LABEL_CLASS$2, children: label }), jsxRuntime.jsx(react.TimeField.Group, { className: react.cn(FIELD_BORDER_CLASS, GROUP_SIZE_CLASS, FIELD_FOCUS_CLASS$2), children: jsxRuntime.jsx(react.TimeField.Input, { className: INPUT_CLASS, children: (segment) => (jsxRuntime.jsx(react.TimeField.Segment, { segment: segment, className: segment.type === "dayPeriod"
-                            ? DAY_PERIOD_SEGMENT_CLASS
-                            : undefined })) }) })] }));
+        className: react.cn(ROOT_CLASS[labelPlacement], className), shouldForceLeadingZeros: shouldForceLeadingZeros, ...props, children: [label && (jsxRuntime.jsx(react.Label, { className: LABEL_CLASS_BY_PLACEMENT[labelPlacement], children: label })), jsxRuntime.jsxs(react.TimeField.Group, { className: react.cn(FIELD_BORDER_CLASS, GROUP_SIZE_CLASS, FIELD_FOCUS_CLASS$2), children: [startContent !== undefined && startContent !== null && (jsxRuntime.jsx(react.TimeField.Prefix, { className: CONTENT_SLOT_CLASS, children: startContent })), jsxRuntime.jsx(react.TimeField.Input, { className: INPUT_CLASS, children: (segment) => (jsxRuntime.jsx(react.TimeField.Segment, { segment: segment, className: segment.type === "dayPeriod"
+                                ? DAY_PERIOD_SEGMENT_CLASS
+                                : undefined })) }), endContent !== undefined && endContent !== null && (jsxRuntime.jsx(react.TimeField.Suffix, { className: CONTENT_SLOT_CLASS, children: endContent }))] })] }));
+}
+/**
+ * `TimeInput` — el nombre que en v2 era el crudo de HeroUI: etiqueta ENCIMA del campo
+ * (`labelPlacement="outside"` por defecto), alineada con la de `DatePicker`. Migrado al
+ * `TimeField` compound de v3; conserva `label` + los props de estado de v2 (`value`, `onChange`,
+ * `isDisabled`, `isInvalid`, `isRequired`, `granularity`, `hourCycle`, `minValue`, `maxValue`…),
+ * que son de React Aria y no cambiaron: `onChange` entrega un `TimeValue` de
+ * `@internationalized/date` (o `null`), igual que el crudo de v2.
+ */
+function TimeInput({ labelPlacement = "outside", ...props }) {
+    return jsxRuntime.jsx(TimeInputBase, { ...props, labelPlacement: labelPlacement });
+}
+/**
+ * `TimeInputComponent` — la fachada BeweOS de v2: etiqueta EN LÍNEA a la izquierda del campo
+ * (`labelPlacement="outside-left"` por defecto, el `outside-left` que v2 fijaba sin exponerlo).
+ * Es lo que usan `ScheduleRow`, beweossmbs y chatbot-claw.
+ */
+function TimeInputComponent({ labelPlacement = "outside-left", ...props }) {
+    return jsxRuntime.jsx(TimeInputBase, { ...props, labelPlacement: labelPlacement });
 }
 
 /**
@@ -8567,7 +9433,7 @@ const ScheduleRow = ({ day, daySchedule, translations = {}, showCopyToAll = fals
                     const isLastSlot = index === slotsToDisplay.length - 1;
                     const isSlotFilled = slot.from && slot.to;
                     const canDelete = slotsToDisplay.length > 1;
-                    return (jsxRuntime.jsxs("div", { className: "flex items-center gap-1 w-full justify-between", children: [jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-1", children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-1", children: [jsxRuntime.jsx(TimeInput, { label: t.from, className: "w-full", value: toTimeValue(slot.from), onChange: (value) => handleTimeChange(index, "from", value), isInvalid: !!slot.error }), jsxRuntime.jsx("span", { className: "text-default-900 xs:hidden xl:block", children: "-" }), jsxRuntime.jsx(TimeInput, { label: t.to, className: "w-full", value: toTimeValue(slot.to), onChange: (value) => handleTimeChange(index, "to", value), isInvalid: !!slot.error })] }), slot.error && (jsxRuntime.jsx("span", { className: "text-xs text-danger", children: slot.error }))] }), isLastSlot ? (jsxRuntime.jsx(Button, { isIconOnly: true, size: "sm", color: "primary", variant: "light", onPress: handleAddTimeSlot, isDisabled: !isSlotFilled, startContent: jsxRuntime.jsx(IconComponent, { icon: "solar:add-circle-bold" }) })) : (jsxRuntime.jsx(Button, { isIconOnly: true, size: "sm", color: "danger", variant: "light", onPress: () => handleRemoveTimeSlot(index), isDisabled: !canDelete, startContent: jsxRuntime.jsx(IconComponent, { icon: "solar:trash-bin-minimalistic-outline" }) }))] }, `${day}-timeslot-${index}`));
+                    return (jsxRuntime.jsxs("div", { className: "flex items-center gap-1 w-full justify-between", children: [jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-1", children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-1", children: [jsxRuntime.jsx(TimeInputComponent, { label: t.from, className: "w-full", value: toTimeValue(slot.from), onChange: (value) => handleTimeChange(index, "from", value), isInvalid: !!slot.error }), jsxRuntime.jsx("span", { className: "text-default-900 xs:hidden xl:block", children: "-" }), jsxRuntime.jsx(TimeInputComponent, { label: t.to, className: "w-full", value: toTimeValue(slot.to), onChange: (value) => handleTimeChange(index, "to", value), isInvalid: !!slot.error })] }), slot.error && (jsxRuntime.jsx("span", { className: "text-xs text-danger", children: slot.error }))] }), isLastSlot ? (jsxRuntime.jsx(Button, { isIconOnly: true, size: "sm", color: "primary", variant: "light", onPress: handleAddTimeSlot, isDisabled: !isSlotFilled, startContent: jsxRuntime.jsx(IconComponent, { icon: "solar:add-circle-bold" }) })) : (jsxRuntime.jsx(Button, { isIconOnly: true, size: "sm", color: "danger", variant: "light", onPress: () => handleRemoveTimeSlot(index), isDisabled: !canDelete, startContent: jsxRuntime.jsx(IconComponent, { icon: "solar:trash-bin-minimalistic-outline" }) }))] }, `${day}-timeslot-${index}`));
                 }) }))] }, day));
 };
 
@@ -8713,6 +9579,33 @@ const SIZE_TEXT_CLASS$1 = {
 // `min-w-0` es obligatorio: un ítem flex tiene `min-width: auto`, o sea no baja de su `min-content`,
 // y sin eso el texto desborda el trigger en vez de truncar con elipsis.
 const VALUE_ROOM_CLASS = "me-6 min-w-0 truncate";
+/*
+ * `isMultiline` (v2). Literal del `tv` (`@heroui/theme@2.4.15`, `dist/components/select.js:255-263`):
+ *
+ *   isMultiline: { true: { label: "relative", trigger: "!h-auto" }, false: { value: "truncate" } }
+ *
+ * O sea: el disparador deja de tener alto fijo y el valor deja de truncarse. El `min-h-*` del
+ * tamaño se conserva (v2 también: el `!h-auto` solo pisaba el `h-*`), así que en una línea mide lo
+ * mismo. El `py-1.5` es nuestro y es obligatorio aquí: `TRIGGER_ALIGN_CLASS` pone `py-0` porque con
+ * alto fijo el centrado lo hace `items-center`; con alto automático, sin relleno vertical la
+ * segunda línea tocaría el borde. 6px + 20px de línea + 6px = los 32px del `sm`, así que en una
+ * sola línea no cambia nada. Van DESPUÉS en el `cn`, que resuelve `h-8`→`h-auto` y `py-0`→`py-1.5`.
+ */
+const MULTILINE_TRIGGER_CLASS = "h-auto py-1.5";
+const MULTILINE_VALUE_ROOM_CLASS = "me-6 min-w-0 whitespace-normal";
+/*
+ * `startContent` del disparador (v2). En v2 iba dentro del `innerWrapper`, delante del valor, con
+ * el `gap-1.5` de ese slot (`select.js:100`). Aquí el disparador es el flex y el hueco va como
+ * margen de la pieza, para no tocar el `gap` que v3 le pone al disparador entero.
+ */
+const START_CONTENT_CLASS = "me-1.5 flex shrink-0 items-center";
+/*
+ * `isLoading` (v2): el spinner SUSTITUYE al chevron en el mismo sitio. Literales de v2
+ * (`@heroui/select@2.4.33`, `use-select`: `getSpinnerProps` → `color: "current"`, `size: "sm"`;
+ * slot `spinner: "absolute end-3"`). Se centra en vertical como el `Select.Indicator` de v3
+ * (`inset-y-0 my-auto`) y toma el color del chevron (`text-field-placeholder`, `select.css`).
+ */
+const SPINNER_CLASS = "pointer-events-none absolute inset-y-0 end-3 my-auto text-field-placeholder";
 /*
  * EL ESTADO VACÍO DEL DESPLEGABLE (TECH-2459 · F5 · defecto reportado por el usuario y medido por
  * la sesión de backoffice: «se pulsa el campo y no pasa nada»).
@@ -9049,15 +9942,24 @@ placeholder = "", selectionMode = "single", selectedKeys, defaultSelectedKeys, o
 // `undefined` y el campo dejaba de llenar su contenedor: en una fila flex se encogía al ancho
 // de su contenido (medido por S2: 208px dentro de una fila de 592, 336px de hueco). En una
 // columna no se notaba porque el `stretch` del flex lo tapaba — pero afecta a cualquier app.
-fullWidth = true, isOpen, defaultOpen, onOpenChange, className, classNames, translations = {}, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-details": ariaDetails, }) => {
+fullWidth = true, isLoading = false, 
+// Aceptada y descartada: ver `SelectProps.isVirtualized`.
+isVirtualized: _isVirtualized, disallowEmptySelection = false, isMultiline = false, renderValue, startContent, listboxProps, isOpen, defaultOpen, onOpenChange, className, classNames, translations = {}, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-details": ariaDetails, }) => {
     const generatedId = $8WNJc$react.useId();
     const selectId = id || generatedId;
     const requiredField = isRequired;
     const t = { ...DEFAULT_TRANSLATIONS$8, ...translations };
+    // v2 pintaba `listboxProps.emptyContent` en el hueco de la lista vacía; gana a la traducción,
+    // que es el default de la fachada (el de v2 era el literal inglés "No items.").
+    const emptyContent = listboxProps?.emptyContent ?? t.emptyContent;
+    // Estado propio SOLO para `multiple` + `disallowEmptySelection` sin controlar: para rechazar el
+    // cambio que vaciaría la selección, la fachada tiene que ser dueña del valor. En los demás casos
+    // no se lee (el hook va fuera de la condición por las reglas de hooks).
+    const [ownMultiple, setOwnMultiple] = $8WNJc$react.useState(() => toArray(defaultSelectedKeys) ?? []);
     // Mismo criterio que el `group-data-[has-helper=true]` de v2: cuenta como "con ayuda" el campo
     // que efectivamente PINTA una descripción o un mensaje de error, no el que solo recibe la prop.
     const hasHelper = Boolean((description && !isInvalid) || (isInvalid && errorMessage));
-    const triggerClassName = react.cn(SIZE_CLASS[size], radius === "full" ? PADDING_FULL_CLASS[size] : PADDING_CLASS[size], TRIGGER_ALIGN_CLASS, RADIUS_CLASS$4[radius], VARIANT_CLASS$1[variant], 
+    const triggerClassName = react.cn(SIZE_CLASS[size], radius === "full" ? PADDING_FULL_CLASS[size] : PADDING_CLASS[size], TRIGGER_ALIGN_CLASS, isMultiline ? MULTILINE_TRIGGER_CLASS : "", RADIUS_CLASS$4[radius], VARIANT_CLASS$1[variant], 
     // En v2 el estado inválido MANDABA también con el campo enfocado
     // (`group-data-[focus=true]:!border-danger`), así que el borde de foco no se aplica cuando
     // el campo está en error: se queda el `danger`.
@@ -9070,7 +9972,32 @@ fullWidth = true, isOpen, defaultOpen, onOpenChange, className, classNames, tran
     "w-full", classNames?.trigger);
     const inner = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [label && (jsxRuntime.jsx(react.Label, { className: react.cn(LABEL_CLASS$1, hasHelper
                     ? LABEL_OFFSET_HELPER_CLASS[size]
-                    : LABEL_OFFSET_CLASS[size], isInvalid ? INVALID_LABEL_CLASS$1 : "", classNames?.label), children: label })), jsxRuntime.jsxs(react.Select.Trigger, { className: triggerClassName, children: [jsxRuntime.jsx(react.Select.Value, { className: react.cn(SIZE_TEXT_CLASS$1[size], VALUE_ROOM_CLASS, isInvalid ? INVALID_TEXT_CLASS$1 : "") }), jsxRuntime.jsx(react.Select.Indicator, { className: "end-3" })] }), description && !isInvalid && (jsxRuntime.jsx(react.Description, { className: `${HELPER_CLASS$1} text-left`, children: description })), jsxRuntime.jsx(react.Select.Popover, { className: classNames?.popoverContent, children: jsxRuntime.jsx(react.ListBox
+                    : LABEL_OFFSET_CLASS[size], isInvalid ? INVALID_LABEL_CLASS$1 : "", classNames?.label), children: label })), jsxRuntime.jsxs(react.Select.Trigger, { className: triggerClassName, children: [startContent != null && startContent !== false && (jsxRuntime.jsx("span", { "data-slot": "start-content", className: START_CONTENT_CLASS, children: startContent })), jsxRuntime.jsx(react.Select.Value, { className: react.cn(SIZE_TEXT_CLASS$1[size], isMultiline ? MULTILINE_VALUE_ROOM_CLASS : VALUE_ROOM_CLASS, HIDE_ITEM_EXTRAS_CLASS, isInvalid ? INVALID_TEXT_CLASS$1 : ""), children: renderValue
+                            ? // `renderValue` de v2 (`chunk-BJWIL32D.mjs`): sin selección, el placeholder;
+                                // con selección, la función con los items en la forma de v2. El nodo de la
+                                // colección de v3 trae los mismos campos que el de v2, así que el mapeo es
+                                // 1:1. `defaultChildren` es aquí el placeholder (o `""`, ver arriba).
+                                ({ state, isPlaceholder, defaultChildren }) => {
+                                    if (isPlaceholder) {
+                                        return defaultChildren;
+                                    }
+                                    const items = state.selectedItems.map((item) => ({
+                                        key: item.key,
+                                        data: item.value,
+                                        type: item.type,
+                                        props: item.props,
+                                        textValue: item.textValue,
+                                        rendered: item.rendered,
+                                        "aria-label": item["aria-label"],
+                                    }));
+                                    return renderValue(items);
+                                }
+                            : undefined }), isLoading ? (jsxRuntime.jsx(react.Spinner, { "aria-hidden": true, "data-slot": "select-spinner", size: "sm", color: "current", className: SPINNER_CLASS })) : (
+                    /* `.select__indicator` de v3 va a `end-2` (8px del borde interior); el
+                    `selectorIcon` de v2 iba a `end-3` (12px). Medido en los PNG: la tinta del chevron
+                    acaba a 17px del borde derecho en la referencia y a 13px con el valor de v3 — 4px
+                    de más. */
+                    jsxRuntime.jsx(react.Select.Indicator, { className: "end-3" }))] }), description && !isInvalid && (jsxRuntime.jsx(react.Description, { className: `${HELPER_CLASS$1} text-left`, children: description })), jsxRuntime.jsx(react.Select.Popover, { className: classNames?.popoverContent, children: jsxRuntime.jsx(react.ListBox
                 // El hueco que v2 llenaba con su `emptyContent` (ver el bloque de
                 // `DEFAULT_TRANSLATIONS`). `renderEmptyState` es la vía de v3: el `ListBox` de
                 // react-aria solo pinta algo con la colección vacía si se le pasa, y envuelve
@@ -9084,7 +10011,7 @@ fullWidth = true, isOpen, defaultOpen, onOpenChange, className, classNames, tran
                     // el resultado en un `<div role="option" style="display:contents">`
                     // (`react-aria-components/dist/private/ListBox.mjs:222-228`), o sea que la caja
                     // que se ve es la nuestra.
-                    renderEmptyState: () => (jsxRuntime.jsx("div", { className: EMPTY_CONTENT_CLASS, children: t.emptyContent })), children: withItemIndicator(withCollectionItemIds(children)) }) }), isInvalid && errorMessage && (jsxRuntime.jsx(react.FieldError, { className: `${HELPER_CLASS$1} text-left`, children: errorMessage }))] }));
+                    renderEmptyState: () => (jsxRuntime.jsx("div", { className: EMPTY_CONTENT_CLASS, children: emptyContent })), children: withItemIndicator(withV2ItemContent(withCollectionItemIds(children))) }) }), isInvalid && errorMessage && (jsxRuntime.jsx(react.FieldError, { className: `${HELPER_CLASS$1} text-left`, children: errorMessage }))] }));
     const commonProps = {
         id: selectId,
         name,
@@ -9126,7 +10053,20 @@ fullWidth = true, isOpen, defaultOpen, onOpenChange, className, classNames, tran
         fullWidth ? "w-full" : ROOT_MIN_WIDTH_CLASS, className),
     };
     if (selectionMode === "multiple") {
-        return (jsxRuntime.jsx(react.Select, { ...commonProps, selectionMode: "multiple", value: toArray(selectedKeys), defaultValue: toArray(defaultSelectedKeys), onChange: (keys) => onSelectionChange?.(new Set(keys)), children: inner }));
+        // `disallowEmptySelection` en `multiple`: react-stately lo fuerza a `false` en este modo
+        // (`useSelectState.mjs:61`, `disallowEmptySelection: selectionMode === 'single'`, pisando
+        // la prop), así que la guarda la pone la fachada: el cambio que dejaría la selección vacía
+        // no se propaga. Controlado basta con no avisar; sin controlar, la fachada lleva el valor.
+        const ownsValue = disallowEmptySelection && selectedKeys === undefined;
+        return (jsxRuntime.jsx(react.Select, { ...commonProps, selectionMode: "multiple", value: ownsValue ? ownMultiple : toArray(selectedKeys), defaultValue: ownsValue ? undefined : toArray(defaultSelectedKeys), onChange: (keys) => {
+                if (disallowEmptySelection && keys.length === 0) {
+                    return;
+                }
+                if (ownsValue) {
+                    setOwnMultiple(keys);
+                }
+                onSelectionChange?.(new Set(keys));
+            }, children: inner }));
     }
     // `Array.from` cubre las tres formas de `SelectSelection` sin ramas nuevas: `"all"` sigue
     // cayendo a `null` (v3 no admite "todo" en selección única) y un array se lee igual que un
@@ -9260,40 +10200,472 @@ const StatTile = ({ title, value, icon, trend, translations = {}, className, pad
             .join(" "), ...cardProps, children: [icon && (jsxRuntime.jsx("span", { className: "shrink-0 text-foreground-600", "aria-hidden": "true", children: icon })), jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-0.5", children: [jsxRuntime.jsx(P, { className: "truncate", children: title }), jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2", children: [jsxRuntime.jsx(H3, { className: "text-2xl font-semibold", children: value }), trend && (jsxRuntime.jsx("span", { className: `text-xs font-medium ${TREND_COLOR_CLASS[direction]}`, "aria-label": t[TREND_ARIA_KEY[direction]], children: trend.value }))] })] })] }));
 };
 
+// TECH-2459 — Fachada `Checkbox` (hallazgo loginos 07-sep: `index.tsx` reexportaba el `Checkbox`
+// CRUDO de v3, así que el JSX v2 de las apps — `isSelected` + `onValueChange` dentro de `Controller`
+// de RHF en backoffice ×12, smbs ×23, agency ×5 — no compilaba pese a existir el símbolo).
+//
+// HeroUI v3 convierte el Checkbox en compound (`Checkbox.Content` > `Checkbox.Control` >
+// `Checkbox.Indicator` + la etiqueta como children de `Content`), renombra `onValueChange` →
+// `onChange` y ELIMINA `color`, `size`, `radius`, `lineThrough`, `icon`, `classNames` y
+// `disableAnimation` (guía oficial `checkbox`). Su único eje propio es `variant`
+// (`primary`/`secondary`), que NO es un color: `secondary` es un tratamiento gris de menor énfasis
+// — el falso amigo de siempre (skill `auraui-design-tokens`).
+//
+// Esta fachada compone el compound por dentro y repone cada prop v2 con los literales del `tv`
+// de v2 (`@heroui/theme@2.4.15` → `dist/components/checkbox.js`), traducidos a utilidades de
+// Tailwind 4 sobre los tokens de Aurora. El relleno del estado marcado en v3 es el `::before` del
+// control (`bg-accent`, = `--color-primary` vía F1), así que `color` se reimplementa pisando ese
+// pseudo-elemento con `before:bg-<color>` — utilidad (capa `utilities`) que gana a la regla de
+// `checkbox.css` (capa `components`), incluida la de hover (`bg-accent-hover`).
+//
+// ⚠️ Estados de react-aria, verificados en el navegador contra `checkbox.css`: `data-selected`/
+// `data-indeterminate`/`data-invalid`/`data-disabled` viven en la RAÍZ (`.checkbox`);
+// `data-hovered`/`data-pressed`/`data-focus-visible` en `[data-slot="checkbox-content"]`. Por
+// eso hay dos grupos con nombre (`group/checkbox`, `group/content`) y NUNCA `data-[hover=true]`
+// (trampa 3 de la skill: v2 escribía `data-hover`; react-aria escribe `data-hovered`).
 /**
- * Piezas que v3 monta FUERA del contenedor con scroll, como hermanas del root: el footer se queda
- * a ancho completo (comentario de los autores en `table.css:15-18`), no se desplaza con la tabla.
+ * Relleno del estado marcado (`::before` del control) y del indeterminado (fondo del control)
+ * por color. `primary` no pisa nada: el `bg-accent` de v3 YA es `--color-primary`. `default`
+ * usa el gris de Aurora (`--color-default`, = v2), nunca el `--default` crudo de v3 (D-F1-3).
+ *
+ * Literal v2: `after:bg-<color> after:text-<color>-foreground text-<color>-foreground`.
  */
-const OUTSIDE_SCROLL = new Set([react.Table.Footer]);
+const CONTROL_COLOR = {
+    primary: "",
+    default: "before:bg-default group-data-[indeterminate=true]/checkbox:bg-default",
+    secondary: "before:bg-secondary group-data-[indeterminate=true]/checkbox:bg-secondary",
+    success: "before:bg-success group-data-[indeterminate=true]/checkbox:bg-success",
+    warning: "before:bg-warning group-data-[indeterminate=true]/checkbox:bg-warning",
+    danger: "before:bg-danger group-data-[indeterminate=true]/checkbox:bg-danger",
+};
 /**
- * Piezas que YA son un contenedor con scroll propio (`.table__scroll-container` /
- * `.table__resizable-container`, ambas con `overflow` en `table.css`): si el consumidor monta una,
- * la fachada no envuelve nada — anidar dos contenedores de scroll dejaría el interior sin ancho
- * que desbordar.
+ * Color del glifo (check / línea). v3 lo fija en el SVG (`[data-slot="checkbox-default-indicator--
+ * checkmark"] { text-accent-foreground }`), así que hay que alcanzar al SVG, no al indicador.
  */
-const OWN_SCROLL = new Set([
-    react.Table.ScrollContainer,
-    react.Table.ResizableContainer,
-]);
-/** Identidad por `child.type` contra los objetos reales de HeroUI (mismo patrón que la fachada `Alert`). */
-function isPart$2(node, parts) {
-    return $8WNJc$react.isValidElement(node) && parts.has(node.type);
+const INDICATOR_COLOR = {
+    primary: "",
+    default: "[&_svg]:text-default-foreground",
+    secondary: "[&_svg]:text-secondary-foreground",
+    success: "[&_svg]:text-success-foreground",
+    warning: "[&_svg]:text-warning-foreground",
+    danger: "[&_svg]:text-danger-foreground",
+};
+// v2 (`checkbox.js`, variante `size`): wrapper `w-4/w-5/w-6` (16/20/24px), label
+// `text-small/medium/large`, icon `w-3 h-2` / `w-4 h-3` / `w-5 h-4`. v3: control `size-4`, glifo
+// `size-2.5`, texto `text-sm`, para todos.
+const CONTROL_SIZE = {
+    sm: "size-4",
+    md: "size-5",
+    lg: "size-6",
+};
+const INDICATOR_SIZE = {
+    sm: "size-3 [&_svg]:size-2.5",
+    md: "size-3.5 [&_svg]:size-3",
+    lg: "size-4 [&_svg]:size-3.5",
+};
+const LABEL_SIZE = {
+    sm: "text-sm",
+    md: "text-base",
+    lg: "text-lg",
+};
+// v2: `rounded-[calc(theme(borderRadius.medium)*K)]` con `medium` = 12px → 6 / 7.2 / 8.4 px, y por
+// defecto el radio lo decidía `size` (sm→0.5, md→0.6, lg→0.7). El `::before` (relleno) lleva el
+// mismo radio porque aquí cubre el border-box completo (ver `CONTROL_BASE`).
+const RADIUS_CLASS$3 = {
+    none: "rounded-none before:rounded-none",
+    sm: "rounded-[6px] before:rounded-[6px]",
+    md: "rounded-[7.2px] before:rounded-[7.2px]",
+    lg: "rounded-[8.4px] before:rounded-[8.4px]",
+    full: "rounded-full before:rounded-full",
+};
+const RADIUS_BY_SIZE = {
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+};
+/**
+ * Caja del control (slot `wrapper` de v2): borde de 2px en `--color-default` sin sombra
+ * (`before:border-2 before:border-default`), y el relleno cubriendo la caja ENTERA al marcarse.
+ *
+ * En v3 el borde vive en el propio control (1px, `border-field-border`, `shadow-field`) y el
+ * relleno es un `::before` a `inset-0`, que solo alcanza al padding-box: por eso v3 pone
+ * `border-transparent` al marcarse y el relleno queda 1px por dentro. Con el borde de 2px de v2
+ * eso dejaría un anillo de 2px: se lleva el `::before` al border-box (`-inset-0.5` = −2px) y se
+ * quita el `overflow-hidden` de v3 para que no lo recorte. El `::before` es un descendiente
+ * posicionado, así que pinta ENCIMA del borde y lo tapa, como el `after` de v2.
+ *
+ * Hover v2: `group-data-[hover=true]:before:bg-default-100` — tinte suave de la caja sin marcar
+ * (en v3 la caja es el fondo del control, no un pseudo). `data-hovered` lo emite `Checkbox.Content`.
+ *
+ * Indeterminado: v3 pinta el fondo del control (dentro del borde). Se enciende también el
+ * `::before` para que el relleno cubra la caja entera, igual que al marcar.
+ */
+const CONTROL_BASE = [
+    "border-2 border-default shadow-none overflow-visible",
+    "before:-inset-0.5",
+    "group-data-[hovered=true]/content:bg-default-100",
+    "group-data-[indeterminate=true]/checkbox:before:scale-100",
+    "group-data-[indeterminate=true]/checkbox:before:opacity-100",
+].join(" ");
+// v2 (`lineThrough: true`, slot `label`): la raya crece de 0 al 100% al marcarse y la etiqueta se
+// atenúa al 60%. `data-selected` está en la raíz → `group-data-[…]/checkbox`.
+const LINE_THROUGH = [
+    "inline-flex items-center justify-center",
+    "before:absolute before:h-0.5 before:w-0 before:bg-foreground before:content-['']",
+    "group-data-[selected=true]/checkbox:opacity-60",
+    "group-data-[selected=true]/checkbox:before:w-full",
+].join(" ");
+// Los subcomponentes compound de v3, adjuntos como estáticos para que la API v3 siga funcionando
+// a través de la fachada (`<Checkbox><Checkbox.Control>…`).
+const COMPOUND_PARTS$1 = new Set([
+    react.Checkbox.Control,
+    react.Checkbox.Indicator,
+    react.Checkbox.Content,
+]);
+/** API compound de v3 detectada por hijos directos: la fachada no envuelve nada. */
+function hasCompoundChildren$1(children) {
+    return $8WNJc$react.Children.toArray(children).some((child) => $8WNJc$react.isValidElement(child) && COMPOUND_PARTS$1.has(child.type));
 }
-const TableFacade = ({ children, ...props }) => {
+/**
+ * Checkbox - Casilla basada en HeroUI v3 con la API pública de v2 intacta (TECH-2459).
+ *
+ * - **API v2**: `children` como etiqueta, `isSelected`/`defaultSelected` + `onValueChange`
+ *   (también `onChange`), `color`, `size`, `radius`, `lineThrough`, `icon`, `classNames`. Funciona
+ *   dentro de `Controller` de react-hook-form (`isSelected={value} onValueChange={onChange}`).
+ * - **API compound v3**: si los children traen `Checkbox.Control`/`Indicator`/`Content`, pasa tal
+ *   cual a la raíz de HeroUI (con `onValueChange` seguido igualmente).
+ */
+const CheckboxFacade = ({ children, onChange, onValueChange, color = "primary", size = "md", radius, lineThrough = false, icon, disableAnimation = false, isInvalid, classNames, className, ...rest }) => {
+    const handleChange = (isSelected) => {
+        onChange?.(isSelected);
+        onValueChange?.(isSelected);
+    };
+    if (hasCompoundChildren$1(children)) {
+        return (jsxRuntime.jsx(react.Checkbox, { ...rest, isInvalid: isInvalid, onChange: handleChange, className: react.cn(classNames?.base, className), children: children }));
+    }
+    const indicatorContent = typeof icon === "function"
+        ? (state) => icon({
+            isSelected: state.isSelected,
+            isIndeterminate: state.isIndeterminate,
+            isDisabled: state.isDisabled,
+        })
+        : icon;
+    const hasLabel = children !== undefined && children !== null && children !== false;
+    return (jsxRuntime.jsx(react.Checkbox, { ...rest, isInvalid: isInvalid, onChange: handleChange, 
+        // Base v2: `group relative max-w-fit inline-flex items-center justify-start cursor-pointer
+        // p-2 -m-2 select-none` (el `p-2 -m-2` es el área de pulsado ampliada de v2). v3
+        // (`.checkbox`) usa `flex flex-col items-start` para apilar `Description`/`FieldError`,
+        // slots que esta fachada no renderiza; en **inline** la caja participa de la línea de
+        // texto, donde la esperan los consumidores (mismo criterio que la fachada `Switch`).
+        className: react.cn("group/checkbox relative -m-2 inline-flex max-w-fit flex-row items-center p-2", classNames?.base, className), children: jsxRuntime.jsxs(react.Checkbox.Content, { className: "group/content gap-2 font-normal", children: [jsxRuntime.jsx(react.Checkbox.Control, { className: react.cn(CONTROL_BASE, CONTROL_SIZE[size], RADIUS_CLASS$3[radius ?? RADIUS_BY_SIZE[size]], CONTROL_COLOR[color], 
+                    // v2 `isInvalid`: `before:border-danger` (el borde vivía en el pseudo).
+                    isInvalid && "border-danger", disableAnimation && "transition-none before:transition-none", classNames?.wrapper), children: jsxRuntime.jsx(react.Checkbox.Indicator, { className: react.cn(INDICATOR_SIZE[size], INDICATOR_COLOR[color], disableAnimation && "[&_svg]:transition-none", classNames?.icon), children: indicatorContent }) }), hasLabel && (
+                // Slot `label` de v2: `relative text-foreground select-none` + tamaño de texto.
+                // `data-slot="label"` para que las reglas de cursor/selección de `.checkbox` de v3
+                // le alcancen igual que a un `<Label>`.
+                jsxRuntime.jsx("span", { "data-slot": "label", className: react.cn("relative select-none text-foreground", LABEL_SIZE[size], lineThrough && LINE_THROUGH, isInvalid && "text-danger", classNames?.label), children: children }))] }) }));
+};
+CheckboxFacade.displayName = "Aurora.Checkbox";
+/**
+ * `Checkbox` de Aurora: fachada v2 + estáticos compound de v3 (`Checkbox.Control`,
+ * `Checkbox.Indicator`, `Checkbox.Content`), los mismos objetos que exporta `@heroui/react`.
+ */
+const Checkbox = Object.assign(CheckboxFacade, {
+    Control: react.Checkbox.Control,
+    Indicator: react.Checkbox.Indicator,
+    Content: react.Checkbox.Content,
+});
+
+// TECH-2459 — Piezas que la fachada `Table.Content` inserta para reponer la API v2 que v3 dejó en
+// manos de la app (defectos reportados por beweossmbs, 23-sep). Privadas: NO se reexportan desde
+// `_internal/index.ts` ni desde el `index.ts` de la carpeta.
+//
+// Todo se decide por IDENTIDAD de `child.type` contra los objetos reales de HeroUI (mismo patrón
+// que las fachadas `Alert`, `Tabs` y el propio root de `Table`), nunca por `displayName`.
+/**
+ * `isHeaderSticky` declarado en el ROOT (`<Table isHeaderSticky>`, que es donde lo ponía v2) viaja
+ * hasta `Table.Content` por contexto: el `<thead>` lo pinta el contenido, no el root.
+ */
+const TableStickyContext = $8WNJc$react.createContext(undefined);
+/**
+ * Clases de v2 para `isHeaderSticky` (`@heroui/theme@2.4.15` → `dist/components/table.js`,
+ * variante `isHeaderSticky.true.thead`): `sticky top-0 z-20 [&>tr]:first:shadow-small`. La sombra
+ * se descarta: `shadow-small` es una clase del plugin de v2 que en Tailwind 4 no genera nada, y
+ * v3 separa la cabecera del cuerpo con su propio borde (`.table__header { border-b }`).
+ *
+ * El «contenedor con scroll» respecto al que se pega es el `Table.ScrollContainer` que inserta la
+ * fachada del root (`overflow-x: auto` ⇒ `overflow-y` computa `auto`), exactamente como en v2 lo
+ * era el `wrapper` (`overflow-auto`): la cabecera se queda fija cuando ese contenedor tiene alto
+ * acotado y desplaza en vertical.
+ */
+const STICKY_HEADER_CLASS = "sticky top-0 z-20";
+/** Clave fija de la columna/celda de selección insertadas (no colisiona con claves de negocio). */
+const SELECTION_KEY = "__aurora-selection";
+/**
+ * Columna de «seleccionar todo». El `Checkbox slot="selection"` recibe de react-aria, por
+ * `CheckboxContext`, el estado de la tabla: marcado con todo seleccionado, INDETERMINADO con una
+ * selección parcial, y su `onChange` selecciona/deselecciona todo — `onSelectionChange` recibe
+ * `"all"`, igual que en v2 (`useTableSelectAllCheckbox`). La etiqueta accesible también la pone
+ * react-aria, traducida a la locale activa: por eso esta pieza no tiene texto propio ni
+ * `translations`.
+ *
+ * `pe-0` es lo que hace la anatomía oficial de v3 con su columna de selección: la casilla no
+ * necesita el padding final de una columna de texto.
+ */
+function SelectionColumn() {
+    return (jsxRuntime.jsx(react.Table.Column, { className: "pe-0", id: SELECTION_KEY, children: jsxRuntime.jsx(Checkbox, { slot: "selection" }) }));
+}
+/** Casilla por fila (`useTableSelectionCheckbox` vía `CheckboxContext`, como en v2). */
+function SelectionCell() {
+    return (jsxRuntime.jsx(react.Table.Cell, { className: "pe-0", children: jsxRuntime.jsx(Checkbox, { slot: "selection" }) }));
+}
+function isElementOf(node, type) {
+    return $8WNJc$react.isValidElement(node) && node.type === type;
+}
+/**
+ * Hijos listos para pasarse como argumentos VARIÁDICOS de `cloneElement`/`createElement`. Un array
+ * pasado como argumento único es para React una LISTA y exige `key` en cada elemento: si la app
+ * escribió hijos JSX sueltos (sin clave, legal) y la fachada los reenviara como un solo array,
+ * saltaría «Each child in a list should have a unique key» (medido en jsdom). Esparcidos, React
+ * los trata como los trató al escribirlos.
+ */
+function spread(node) {
+    return Array.isArray(node) ? node : [node];
+}
+/**
+ * Aplica `fn` a cada nodo de un árbol de `children` atravesando arrays y Fragments, sin tocar
+ * claves (`cloneElement` las conserva). `Children.map` no sirve aquí: re-prefija las claves y NO
+ * entra en Fragments — y las apps envuelven en Fragment cuando el contenido es condicional.
+ */
+function mapNodes(node, fn) {
+    if (Array.isArray(node)) {
+        return node.map((child) => mapNodes(child, fn));
+    }
+    if (isElementOf(node, $8WNJc$react.Fragment)) {
+        return $8WNJc$react.cloneElement(node, undefined, ...spread(mapNodes(node.props.children, fn)));
+    }
+    return fn(node);
+}
+/**
+ * ¿Hay ya una casilla de selección montada (por la fachada o por la app) en este subárbol
+ * estático? Mira la identidad de las piezas propias y cualquier elemento con `slot="selection"`
+ * (la forma que documenta v3). Las funciones de render no se pueden inspeccionar sin llamarlas:
+ * esas cuentan como «no hay».
+ */
+function hasSelectionControl(node) {
+    if (Array.isArray(node)) {
+        return node.some(hasSelectionControl);
+    }
+    if (!$8WNJc$react.isValidElement(node)) {
+        return false;
+    }
+    if (node.type === SelectionColumn || node.type === SelectionCell) {
+        return true;
+    }
+    const props = node.props;
+    if (props.slot === "selection") {
+        return true;
+    }
+    return typeof props.children === "function"
+        ? false
+        : hasSelectionControl(props.children);
+}
+function containsType(node, type) {
+    if (Array.isArray(node)) {
+        return node.some((child) => containsType(child, type));
+    }
+    if (!$8WNJc$react.isValidElement(node)) {
+        return false;
+    }
+    if (node.type === type) {
+        return true;
+    }
+    const children = node.props.children;
+    return typeof children === "function" ? false : containsType(children, type);
+}
+/**
+ * Columna con `allowsSorting`: v2 pintaba el chevron por su cuenta (`TableColumnHeader`,
+ * `ChevronDownIcon` con `data-direction`); v3 no pinta nada y pide que la app monte
+ * `Table.SortableColumnHeader` en el render prop de la columna. Aquí se monta esa pieza de v3
+ * — aspecto de v3 (§9.1): chevron a la derecha que apunta arriba en ascendente y gira en
+ * descendente, y sin chevron mientras la columna no es la ordenada.
+ *
+ * No se toca la columna si la app ya decide el contenido con un render prop (entonces es suyo) o
+ * si ya montó un `SortableColumnHeader` estático.
+ */
+function withSortIndicator(node) {
+    if (!isElementOf(node, react.Table.Column)) {
+        return node;
+    }
+    const { allowsSorting, children } = node.props;
+    if (!allowsSorting ||
+        typeof children === "function" ||
+        containsType(children, react.Table.SortableColumnHeader)) {
+        return node;
+    }
+    return $8WNJc$react.cloneElement(node, {
+        children: ({ sortDirection }) => (jsxRuntime.jsx(react.Table.SortableColumnHeader, { sortDirection: sortDirection, children: children })),
+    });
+}
+/** Compone una clase sobre un `className` de react-aria, que puede ser string o render prop. */
+function withClass(className, extra) {
+    if (typeof className === "function") {
+        return (renderProps) => react.cn(className(renderProps), extra);
+    }
+    return react.cn(className, extra);
+}
+/**
+ * `Table.Header`: indicador de orden en cada columna ordenable, clase sticky si se pidió y la
+ * columna de selección delante si toca.
+ *
+ * Con columnas dinámicas (`columns` + función) la columna de selección no se puede colar en el
+ * array de la app — su función de render la recibiría como si fuera una columna de negocio. Se usa
+ * la forma que documenta react-aria para mezclar estáticas y dinámicas: la estática delante y las
+ * de la app en un `Table.Collection` con sus `items`. El `Collection` exterior del header hereda
+ * `dependencies` por contexto (`CollectionBuilder`), así que no se pierden.
+ */
+function transformHeader(header, options) {
+    const { children, columns, className } = header.props;
+    const props = options.sticky
+        ? { className: withClass(className, STICKY_HEADER_CLASS) }
+        : {};
+    if (typeof children === "function") {
+        const render = children;
+        const wrapped = (column) => withSortIndicator(render(column));
+        if (!options.insertSelection) {
+            return $8WNJc$react.cloneElement(header, { ...props, children: wrapped });
+        }
+        return $8WNJc$react.cloneElement(header, { ...props, columns: undefined }, jsxRuntime.jsx(SelectionColumn, {}, SELECTION_KEY), jsxRuntime.jsx(react.Table.Collection, { items: columns, children: wrapped }, "columns"));
+    }
+    const mapped = spread(mapNodes(children, withSortIndicator));
+    if (!options.insertSelection) {
+        return $8WNJc$react.cloneElement(header, props, ...mapped);
+    }
+    return $8WNJc$react.cloneElement(header, props, jsxRuntime.jsx(SelectionColumn, {}, SELECTION_KEY), ...mapped);
+}
+/**
+ * Casilla delante de las celdas de una fila. Solo sabe tratar `Table.Row` (el mismo objeto que el
+ * `TableRow` suelto): una fila envuelta en un componente propio de la app no se puede abrir, y se
+ * devuelve tal cual (límite documentado en el README).
+ */
+function withSelectionCell(row) {
+    if (!isElementOf(row, react.Table.Row)) {
+        return row;
+    }
+    const { children, columns } = row.props;
+    if (typeof children === "function") {
+        // Mismo mecanismo que el header: estática + `Collection` con las columnas de la app. El
+        // `idScope` de la fila (su `id`) lo hereda la colección interior por contexto, así que las
+        // claves de las celdas siguen siendo únicas por fila.
+        return $8WNJc$react.cloneElement(row, { columns: undefined }, jsxRuntime.jsx(SelectionCell, {}, SELECTION_KEY), jsxRuntime.jsx(react.Table.Collection, { items: columns, children: children }, "cells"));
+    }
+    if (hasSelectionControl(children)) {
+        return row;
+    }
+    return $8WNJc$react.cloneElement(row, undefined, jsxRuntime.jsx(SelectionCell, {}, SELECTION_KEY), ...spread(children));
+}
+/** `Table.Body`: una casilla por fila, tanto con `items` + función como con filas estáticas. */
+function transformBody(body) {
+    const { children } = body.props;
+    if (typeof children === "function") {
+        const render = children;
+        return $8WNJc$react.cloneElement(body, {
+            children: (item) => withSelectionCell(render(item)),
+        });
+    }
+    return $8WNJc$react.cloneElement(body, undefined, ...spread(mapNodes(children, withSelectionCell)));
+}
+
+/** Default de v2 (`use-table`, `@heroui/table@2.2.32`), sin reinterpretar. */
+function defaultShowCheckboxes(props) {
+    const behavior = props.selectionBehavior ?? "toggle";
+    return props.selectionMode === "multiple" && behavior !== "replace";
+}
+/** Primer `Table.Header` del árbol (atravesando arrays y Fragments), para decidir la selección. */
+function findHeader(node) {
+    let found;
+    mapNodes(node, (child) => {
+        if (!found && isElementOf(child, react.Table.Header)) {
+            found = child;
+        }
+        return child;
+    });
+    return found;
+}
+/**
+ * `Table.Content` de Aurora: el `Table.Content` de HeroUI v3 con las casillas de selección, el
+ * indicador de orden y la cabecera fija de v2. Idempotente: si la app ya montó sus casillas
+ * (`slot="selection"`) o su `SortableColumnHeader`, no se inserta nada encima.
+ */
+function TableContent({ children, isHeaderSticky, showSelectionCheckboxes, ...props }) {
+    const rootSticky = $8WNJc$react.useContext(TableStickyContext);
+    const sticky = isHeaderSticky ?? rootSticky ?? false;
+    const header = findHeader(children);
+    // La decisión es de TABLA, no de fila: si la cabecera ya trae casilla (la montó la app), no
+    // se inserta ni en la cabecera ni en las filas — insertar solo en unas descuadraría el número
+    // de celdas y react-aria lanza `Cell count must match column count`.
+    const insertSelection = (showSelectionCheckboxes ?? defaultShowCheckboxes(props)) &&
+        header !== undefined &&
+        !(typeof header.props.children !== "function" &&
+            hasSelectionControl(header.props.children));
+    const content = mapNodes(children, (child) => {
+        if (isElementOf(child, react.Table.Header)) {
+            return transformHeader(child, { insertSelection, sticky });
+        }
+        if (insertSelection && isElementOf(child, react.Table.Body)) {
+            return transformBody(child);
+        }
+        return child;
+    });
+    // Esparcido y no `{content}`: ver `spread` (un array como hijo único exigiría claves).
+    return $8WNJc$react.createElement(react.Table.Content, props, ...spread(content));
+}
+TableContent.displayName = "Aurora.Table.Content";
+
+/**
+ * Piezas que v3 monta FUERA del contenedor con scroll, como hermanas del root: el footer se queda
+ * a ancho completo (comentario de los autores en `table.css:15-18`), no se desplaza con la tabla.
+ */
+const OUTSIDE_SCROLL = new Set([react.Table.Footer]);
+/**
+ * Piezas que YA son un contenedor con scroll propio (`.table__scroll-container` /
+ * `.table__resizable-container`, ambas con `overflow` en `table.css`): si el consumidor monta una,
+ * la fachada no envuelve nada — anidar dos contenedores de scroll dejaría el interior sin ancho
+ * que desbordar.
+ */
+const OWN_SCROLL = new Set([
+    react.Table.ScrollContainer,
+    react.Table.ResizableContainer,
+]);
+/** Identidad por `child.type` contra los objetos reales de HeroUI (mismo patrón que la fachada `Alert`). */
+function isPart$2(node, parts) {
+    return $8WNJc$react.isValidElement(node) && parts.has(node.type);
+}
+/**
+ * `isHeaderSticky` del root viaja a `Table.Content` por contexto (el `<thead>` lo pinta el
+ * contenido). Solo se monta el provider cuando la app declara la prop: sin ella el árbol del root
+ * queda exactamente como antes (`.Provider` y no `<Context value>` porque el peer admite React 18).
+ */
+function withSticky(isHeaderSticky, root) {
+    return isHeaderSticky === undefined ? (root) : (jsxRuntime.jsx(TableStickyContext.Provider, { value: isHeaderSticky, children: root }));
+}
+const TableFacade = ({ children, isHeaderSticky, ...props }) => {
     const nodes = $8WNJc$react.Children.toArray(children);
     // Sin hijos, o con un contenedor de scroll ya montado a mano: el root tal cual.
     if (nodes.length === 0 || nodes.some((node) => isPart$2(node, OWN_SCROLL))) {
-        return jsxRuntime.jsx(react.Table, { ...props, children: children });
+        return withSticky(isHeaderSticky, jsxRuntime.jsx(react.Table, { ...props, children: children }));
     }
     const scrollable = nodes.filter((node) => !isPart$2(node, OUTSIDE_SCROLL));
     const outsideScroll = nodes.filter((node) => isPart$2(node, OUTSIDE_SCROLL));
-    return (jsxRuntime.jsxs(react.Table, { ...props, children: [jsxRuntime.jsx(react.Table.ScrollContainer, { children: scrollable }), outsideScroll] }));
+    return withSticky(isHeaderSticky, jsxRuntime.jsxs(react.Table, { ...props, children: [jsxRuntime.jsx(react.Table.ScrollContainer, { children: scrollable }), outsideScroll] }));
 };
 TableFacade.displayName = "Aurora.Table";
 /**
  * `Table` de Aurora: el root de HeroUI v3 con el `ScrollContainer` que faltaba, más los estáticos
- * del compound de v3 — los MISMOS objetos que exporta `@heroui/react`, así que
- * `Table.Content`/`Table.Header`/`isRowHeader`… se comportan igual que antes.
+ * del compound de v3 — los MISMOS objetos que exporta `@heroui/react` (así que
+ * `Table.Header`/`Table.Column isRowHeader`… se comportan igual que antes), SALVO `Table.Content`,
+ * que es la fachada de Aurora: inserta las casillas de selección múltiple, el indicador de orden
+ * de `allowsSorting` y la cabecera fija de `isHeaderSticky` (ver `TableContent.tsx`).
  *
  * `Table.Root` queda deliberadamente crudo (el root pelado de v3, sin scroll): es la vía de escape
  * para quien quiera montar la anatomía entera a mano.
@@ -9304,7 +10676,7 @@ const Table = Object.assign(TableFacade, {
     Collection: react.Table.Collection,
     Column: react.Table.Column,
     ColumnResizer: react.Table.ColumnResizer,
-    Content: react.Table.Content,
+    Content: TableContent,
     Footer: react.Table.Footer,
     Header: react.Table.Header,
     LoadMore: react.Table.LoadMore,
@@ -9373,6 +10745,225 @@ function AuraTable({ columns, items, renderCell, children, className, ...props }
     return (jsxRuntime.jsx(Table, { className: `rounded-none ${className ?? ""}`.trim(), children: jsxRuntime.jsxs(Table.Content, { ...props, children: [jsxRuntime.jsx(Table.Header, { columns: columns, children: (column) => (jsxRuntime.jsx(Table.Column, { isRowHeader: column.isRowHeader || column.key === rowHeaderKey, children: column.label }, column.key)) }), jsxRuntime.jsx(Table.Body, { items: items, children: (item) => (jsxRuntime.jsx(Table.Row, { columns: columns, children: (column) => (jsxRuntime.jsx(Table.Cell, { children: renderCell ? renderCell(item, column.key) : children })) }, item.id)) })] }) }));
 }
 
+// ── Autocrecimiento entre `minRows` y `maxRows` (reposición de v2) ─────────────────────────────
+//
+// v2 montaba `react-textarea-autosize@8.5.9` (`@heroui/input@2.4.22`, `dist/chunk-RIE4DNUQ.mjs`)
+// y aquí esa dependencia no existe, así que se reimplementa su algoritmo, leído en su compilado
+// (`dist/react-textarea-autosize.browser.esm.js`, `calculateNodeHeight` + `resizeTextarea`):
+//
+//   1. Se copia el estilo que decide el ajuste de línea (fuente, relleno, borde, ancho…) a un
+//      `<textarea>` OCULTO compartido, se le pone el valor (o el placeholder, o "x") y se lee su
+//      `scrollHeight`. Se mide en un clon y no en el nodo real porque encoger el real a 0 para
+//      medirlo mueve el scroll de la página cuando el campo está cerca del borde inferior.
+//   2. El alto de UNA línea sale del mismo clon con el valor "x", no de una constante: así cuadra
+//      con la fuente y el tamaño que el campo tenga de verdad.
+//   3. `alto = min(máx, max(mín, contenido))`, con mín/máx = filas × línea + relleno (+ borde en
+//      `border-box`). Si `maxRows < minRows`, gana `maxRows` — el `min` va por fuera, como en v2.
+//   4. Se escribe con `setProperty("height", …, "important")`, literal de v2.
+//
+// Cuándo se recalcula (los mismos disparadores que v2, más el ancho):
+//   · en cada render de la fachada (layout effect sin dependencias, como v2) → cubre el valor
+//     CONTROLADO y cualquier cambio de `size`/`className` que mueva la fuente o el ancho;
+//   · al escribir, en los dos modos (`resize` desde el `onChange` de la fachada). Hace falta
+//     aunque el valor viva en estado de React: en modo NO controlado ese estado es del
+//     `TextField` de react-aria, y su re-render no re-renderiza la fachada, así que el layout
+//     effect de arriba no corre;
+//   · al cambiar el ANCHO del campo (`ResizeObserver`; v2 solo escuchaba `window.resize`, que no
+//     ve un panel que se estrecha) — solo si cambió el ancho, para no reaccionar a nuestro propio
+//     cambio de alto;
+//   · al terminar de cargar una fuente web (`document.fonts` → `loadingdone`, como v2);
+//   · tras el `reset` del formulario (como v2): `useFormReset` de react-aria devuelve el estado del
+//     `TextField` al `defaultValue`, otra vez sin re-renderizar la fachada. Se mide en el frame
+//     siguiente, cuando React ya ha escrito el valor restaurado en el DOM.
+//
+// Scroll: v2 ocultaba la barra mientras no se alcanzaba el tope (`data-hide-scroll` →
+// `scrollbar-hide`, `@heroui/theme@2.4.15`); aquí se consigue lo mismo con `overflow-y: hidden`
+// inline hasta que el contenido supera el máximo, y a partir de ahí se deja el scroll nativo.
+const HIDDEN_TEXTAREA_STYLE = {
+    "min-height": "0",
+    "max-height": "none",
+    height: "0",
+    visibility: "hidden",
+    overflow: "hidden",
+    position: "absolute",
+    "z-index": "-1000",
+    top: "0",
+    right: "0",
+    display: "block",
+};
+// Lista literal de `react-textarea-autosize` (`SIZING_STYLE`).
+const SIZING_STYLE = [
+    "borderBottomWidth",
+    "borderLeftWidth",
+    "borderRightWidth",
+    "borderTopWidth",
+    "boxSizing",
+    "fontFamily",
+    "fontSize",
+    "fontStyle",
+    "fontWeight",
+    "letterSpacing",
+    "lineHeight",
+    "paddingBottom",
+    "paddingLeft",
+    "paddingRight",
+    "paddingTop",
+    "tabSize",
+    "textIndent",
+    "textRendering",
+    "textTransform",
+    "width",
+    "wordBreak",
+    "wordSpacing",
+    "scrollbarGutter",
+];
+let hiddenTextarea = null;
+const forceHiddenStyles = (node) => {
+    for (const key of Object.keys(HIDDEN_TEXTAREA_STYLE)) {
+        node.style.setProperty(key, HIDDEN_TEXTAREA_STYLE[key], "important");
+    }
+};
+const px = (value) => Number.parseFloat(value) || 0;
+/**
+ * Mide el alto que necesita `node` para su contenido y lo acota entre `minRows` y `maxRows`.
+ * Devuelve `null` si el nodo está fuera del DOM (no hay estilo computado que leer).
+ */
+function measureTextareaHeight(node, minRows, maxRows) {
+    // v2 detectaba el nodo desconectado por un `boxSizing` vacío; aquí se pregunta directamente,
+    // y un `boxSizing` vacío en un nodo conectado se trata como `content-box` (el valor inicial).
+    if (!node.isConnected) {
+        return null;
+    }
+    const computed = window.getComputedStyle(node);
+    const isBorderBox = computed.boxSizing === "border-box";
+    const paddingSize = px(computed.paddingTop) + px(computed.paddingBottom);
+    const borderSize = px(computed.borderTopWidth) + px(computed.borderBottomWidth);
+    if (!hiddenTextarea) {
+        hiddenTextarea = document.createElement("textarea");
+        hiddenTextarea.setAttribute("tabindex", "-1");
+        hiddenTextarea.setAttribute("aria-hidden", "true");
+    }
+    if (hiddenTextarea.parentNode === null) {
+        document.body.appendChild(hiddenTextarea);
+    }
+    const clone = hiddenTextarea;
+    const cloneStyle = clone.style;
+    for (const key of SIZING_STYLE) {
+        cloneStyle[key] =
+            computed[key] ?? "";
+    }
+    forceHiddenStyles(clone);
+    const contentOf = () => isBorderBox
+        ? clone.scrollHeight + borderSize
+        : clone.scrollHeight - paddingSize;
+    const text = node.value || node.placeholder || "x";
+    clone.value = text;
+    let content = contentOf();
+    // Doble asignación y medida: bug de Firefox que v2 también esquiva (bugzilla 1795904).
+    clone.value = text;
+    content = contentOf();
+    clone.value = "x";
+    const rowHeight = clone.scrollHeight - paddingSize;
+    const extra = isBorderBox ? paddingSize + borderSize : 0;
+    const minHeight = rowHeight * minRows + extra;
+    const maxHeight = rowHeight * maxRows + extra;
+    return {
+        height: Math.min(maxHeight, Math.max(minHeight, content)),
+        rowHeight,
+        overflows: content > maxHeight,
+    };
+}
+// `useLayoutEffect` en el servidor avisa en React 18; el alto solo tiene sentido en el cliente.
+const useIsomorphicLayoutEffect = typeof window !== "undefined" ? $8WNJc$react.useLayoutEffect : $8WNJc$react.useEffect;
+/**
+ * Autocrecimiento del `<textarea>` apuntado por `nodeRef`. Devuelve el `resize` para llamarlo
+ * desde el `onChange` de la fachada.
+ */
+function useTextareaAutosize(nodeRef, { enabled, minRows, maxRows }) {
+    const heightRef = $8WNJc$react.useRef(0);
+    const overflowRef = $8WNJc$react.useRef(null);
+    const resize = $8WNJc$react.useCallback(() => {
+        const node = nodeRef.current;
+        if (!(enabled && node)) {
+            return;
+        }
+        const result = measureTextareaHeight(node, minRows, maxRows);
+        if (!result) {
+            return;
+        }
+        if (heightRef.current !== result.height) {
+            heightRef.current = result.height;
+            node.style.setProperty("height", `${result.height}px`, "important");
+        }
+        if (overflowRef.current !== result.overflows) {
+            overflowRef.current = result.overflows;
+            node.style.setProperty("overflow-y", result.overflows ? "auto" : "hidden");
+        }
+    }, [enabled, minRows, maxRows, nodeRef]);
+    // La función más reciente para los listeners, que se registran una sola vez.
+    const resizeRef = $8WNJc$react.useRef(resize);
+    resizeRef.current = resize;
+    // Cada render, como v2: el valor controlado, el `size` o la clase pueden haber cambiado.
+    useIsomorphicLayoutEffect(() => {
+        resize();
+    });
+    // Al apagar el autosize, se retira lo que se escribió a mano para que mande el CSS.
+    useIsomorphicLayoutEffect(() => {
+        const node = nodeRef.current;
+        if (enabled || !node) {
+            return;
+        }
+        node.style.removeProperty("height");
+        node.style.removeProperty("overflow-y");
+        heightRef.current = 0;
+        overflowRef.current = null;
+    }, [enabled, nodeRef]);
+    $8WNJc$react.useEffect(() => {
+        const node = nodeRef.current;
+        if (!(enabled && node)) {
+            return;
+        }
+        const cleanups = [];
+        // Ancho: re-ajuste de línea. Solo cuando cambia el ANCHO, no el alto que ponemos nosotros.
+        if (typeof ResizeObserver !== "undefined") {
+            let lastWidth = node.getBoundingClientRect().width;
+            const observer = new ResizeObserver((entries) => {
+                const width = entries[0]?.contentRect.width ?? lastWidth;
+                if (width !== lastWidth) {
+                    lastWidth = width;
+                    resizeRef.current();
+                }
+            });
+            observer.observe(node);
+            cleanups.push(() => observer.disconnect());
+        }
+        else {
+            const onWindowResize = () => resizeRef.current();
+            window.addEventListener("resize", onWindowResize);
+            cleanups.push(() => window.removeEventListener("resize", onWindowResize));
+        }
+        const fonts = document.fonts;
+        if (fonts && typeof fonts.addEventListener === "function") {
+            const onFonts = () => resizeRef.current();
+            fonts.addEventListener("loadingdone", onFonts);
+            cleanups.push(() => fonts.removeEventListener("loadingdone", onFonts));
+        }
+        const onReset = (event) => {
+            if (node.form && node.form === event.target) {
+                requestAnimationFrame(() => resizeRef.current());
+            }
+        };
+        document.body.addEventListener("reset", onReset);
+        cleanups.push(() => document.body.removeEventListener("reset", onReset));
+        return () => {
+            for (const cleanup of cleanups) {
+                cleanup();
+            }
+        };
+    }, [enabled, nodeRef]);
+    return resize;
+}
+
 // TECH-2459 · F3 · G1-forms — v3 divide el `Textarea` monolítico de v2 en `TextField` +
 // `TextArea` (el `<textarea>` real, sin `InputGroup` intermedio: a diferencia de Input, aquí el
 // borde/fondo/tamaño de texto viven todos en el MISMO elemento — ver `textarea.css`). Por eso no
@@ -9411,6 +11002,8 @@ const FIELD_BORDER_Y = 4;
 // El default de v2, literal: `({ minRows = 3, maxRows = 8, … })` en `@heroui/input@2.4.22`,
 // `dist/chunk-RIE4DNUQ.mjs`.
 const DEFAULT_MIN_ROWS = 3;
+// Mismo literal de v2: `maxRows = 8`. Tope del autocrecimiento cuando el consumidor no lo pasa.
+const DEFAULT_MAX_ROWS = 8;
 // ── `minRows` gana al atributo nativo `rows` ─────────────────────────────────────────────────
 //
 // Las dos props dicen lo mismo —cuántas líneas de alto tiene la caja al aparecer— así que la
@@ -9448,7 +11041,7 @@ Math.max(1, Math.round(minRows ?? rows ?? DEFAULT_MIN_ROWS));
 // esquina. Es el único resto que quedaba entre `textarea--default` y su referencia: 12 píxeles en
 // x[780..786] y[407..413], gris `102,102,102` donde v2 tiene el fondo.
 const RESIZE_CLASS = "resize-none";
-const RADIUS_CLASS$3 = {
+const RADIUS_CLASS$2 = {
     none: "rounded-none",
     sm: "rounded-[8px]",
     md: "rounded-[12px]",
@@ -9566,7 +11159,12 @@ const INVALID_TEXT_CLASS = "text-danger";
 const Textarea = $8WNJc$react.forwardRef(({ label, description, errorMessage, id, size = "md", variant = "bordered", radius = "md", 
 // Sin default en el destructuring a propósito: hace falta distinguir "no me la han pasado"
 // de un valor, para que `rows` solo se mire cuando `minRows` no viene (ver `resolveRows`).
-minRows, rows, placeholder, isInvalid = false, isRequired = false, isDisabled = false, isReadOnly = false, 
+minRows, rows, 
+// Tope del autocrecimiento, default de v2 (8). Se desestructura también para que no
+// llegue al DOM (antes viajaba en `...rest` y React avisaba de un atributo desconocido).
+maxRows = DEFAULT_MAX_ROWS, 
+// Compat v2: `true` apaga el autocrecimiento y deja la caja fija en su alto mínimo.
+disableAutosize = false, placeholder, isInvalid = false, isRequired = false, isDisabled = false, isReadOnly = false, 
 // `fullWidth` por defecto a `true`: HeroUI v2 lo traía en sus `defaultVariants`
 // (verificado en el paquete v2 compilado, `dist/components/input.js`:
 // `defaultVariants: { variant:"flat", color:"default", size:"md", fullWidth:true, … }`, con
@@ -9577,7 +11175,32 @@ minRows, rows, placeholder, isInvalid = false, isRequired = false, isDisabled =
 fullWidth = true, value, defaultValue, onChange, onValueChange, className, classNames, name, style, ...rest }, ref) => {
     const generatedId = $8WNJc$react.useId();
     const textareaId = id || generatedId;
-    const fieldRows = resolveRows(minRows, rows);
+    const requestedRows = resolveRows(minRows, rows);
+    const maxFieldRows = Math.max(1, Math.round(maxRows));
+    // Con autocrecimiento, `maxRows` es el techo también del mínimo: v2 acotaba
+    // `min(máx, max(mín, contenido))`, así que con `maxRows < minRows` ganaba `maxRows`. Sin
+    // autocrecimiento `maxRows` no pinta nada (v2 ni se lo pasaba al `<textarea>` plano).
+    const fieldRows = disableAutosize
+        ? requestedRows
+        : Math.min(requestedRows, maxFieldRows);
+    const innerRef = $8WNJc$react.useRef(null);
+    const setRefs = $8WNJc$react.useCallback((node) => {
+        innerRef.current = node;
+        if (typeof ref === "function") {
+            ref(node);
+        }
+        else if (ref) {
+            ref.current = node;
+        }
+    }, [ref]);
+    const resize = useTextareaAutosize(innerRef, {
+        enabled: !disableAutosize,
+        minRows: fieldRows,
+        maxRows: maxFieldRows,
+    });
+    // El `min-height` se emite aunque haya autocrecimiento: es el alto correcto ANTES de la
+    // primera medida (SSR, o sin hoja de estilos) y el suelo si la medida sale menor (p. ej.
+    // `flat`, sin los 4px de borde). El `height` lo escribe después `useTextareaAutosize`.
     // Inline y no una clase: el valor es un número arbitrario y Tailwind 4 solo emite las clases
     // que encuentra escritas en el fuente, así que `min-h-[${n}px]` no existiría en el CSS. El
     // `style` del consumidor va DESPUÉS para que pueda pisarlo (y una clase con `!` también gana,
@@ -9586,14 +11209,32 @@ fullWidth = true, value, defaultValue, onChange, onValueChange, className, class
         minHeight: `${fieldRows * SIZE_LINE_HEIGHT[size] + FIELD_PADDING_Y + FIELD_BORDER_Y}px`,
         ...style,
     };
+    // El estado del valor lo actualiza el `TextField` con su propio `onChange` (llega al
+    // `<textarea>` por contexto y `mergeProps` encadena los dos). Aquí: medir —el nodo ya trae
+    // el valor nuevo, y en modo no controlado la fachada no se re-renderiza— y avisar.
     const handleChange = (event) => {
+        resize();
         onChange?.(event);
         onValueChange?.(event.target.value);
     };
-    return (jsxRuntime.jsxs(react.TextField, { id: textareaId, name: name, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, isReadOnly: isReadOnly, className: react.cn(FIELD_STACK_CLASS, fullWidth ? "w-full" : "", 
+    return (
+    // ── `value` / `defaultValue` van al `TextField`, NO al `<textarea>` ─────────────────────
+    //
+    // En react-aria el dueño del valor es el `TextField`: `useTextField` guarda el estado con
+    // `useControlledState(value, defaultValue ?? "")` y se lo inyecta al `<textarea>` como
+    // `value` por contexto (`react-aria-components/dist/private/TextField.mjs`). Antes la
+    // fachada se los pasaba al `<textarea>`, así que:
+    //   · en modo NO controlado el `TextField` arrancaba con "" y el `<textarea>` recibía a la
+    //     vez `value=""` (del contexto) y `defaultValue` → React avisaba de «both value and
+    //     defaultValue» y el primer re-render del padre dejaba el campo VACÍO;
+    //   · en modo controlado funcionaba de rebote (`mergeProps` deja ganar al `value` propio),
+    //     pero el estado interno del `TextField` seguía en "".
+    // Ahora el `TextField` tiene el valor en los dos modos, y el `reset` del formulario también
+    // es suyo (`useFormReset` devuelve el estado al `defaultValue`; el autosize lo escucha).
+    jsxRuntime.jsxs(react.TextField, { id: textareaId, value: value, defaultValue: defaultValue, name: name, isInvalid: isInvalid, isRequired: isRequired, isDisabled: isDisabled, isReadOnly: isReadOnly, className: react.cn(FIELD_STACK_CLASS, fullWidth ? "w-full" : "", 
         // El `className` del consumidor, en la raíz y en último lugar: el slot `base` de
         // v2 y la posición que le deja ganar en tailwind-merge (ver bloque de arriba).
-        className), children: [label && (jsxRuntime.jsx(react.Label, { className: react.cn(LABEL_CLASS, isInvalid ? INVALID_LABEL_CLASS : "", classNames?.label), children: label })), jsxRuntime.jsx(react.TextArea, { ...rest, ref: ref, rows: fieldRows, style: fieldStyle, placeholder: placeholder, value: value, defaultValue: defaultValue, onChange: handleChange, className: react.cn(SIZE_TEXT_CLASS[size], RESIZE_CLASS, RADIUS_CLASS$3[radius], VARIANT_CLASS[variant], isInvalid ? INVALID_TEXT_CLASS : "", FIELD_FOCUS_CLASS, FIELD_SHADOW_CLASS, 
+        className), children: [label && (jsxRuntime.jsx(react.Label, { className: react.cn(LABEL_CLASS, isInvalid ? INVALID_LABEL_CLASS : "", classNames?.label), children: label })), jsxRuntime.jsx(react.TextArea, { ...rest, ref: setRefs, rows: fieldRows, style: fieldStyle, placeholder: placeholder, onChange: handleChange, className: react.cn(SIZE_TEXT_CLASS[size], RESIZE_CLASS, RADIUS_CLASS$2[radius], VARIANT_CLASS[variant], isInvalid ? INVALID_TEXT_CLASS : "", FIELD_FOCUS_CLASS, FIELD_SHADOW_CLASS, 
                 // Incondicional, como el slot `input` de v2: el campo llena siempre su raíz,
                 // y es la raíz la que responde a `fullWidth` y al ancho del consumidor.
                 "w-full", classNames?.input ?? classNames?.inputWrapper) }), description && !isInvalid && (jsxRuntime.jsx(react.Description, { className: react.cn(HELPER_CLASS, "text-left", classNames?.description), children: description })), isInvalid && errorMessage && (jsxRuntime.jsx(react.FieldError, { className: react.cn(HELPER_CLASS, "text-left", classNames?.errorMessage), children: errorMessage }))] }));
@@ -13855,10 +15496,12 @@ const createCurrencyFormatter = (locale, currency, fractionDigits = 0) => {
     return (val) => formatter.format(val);
 };
 
+const ModalFacadeContext = $8WNJc$react.createContext({});
+
 // v2 no tiene prop `radius` en el diálogo del modal: v3 tampoco (eliminada, "usar Tailwind"), así
 // que se reimplementa vía className arbitrario — mismo criterio y mismos valores exactos que
 // Button/Card de F3.0 (RADIUS_CLASS).
-const RADIUS_CLASS$2 = {
+const RADIUS_CLASS$1 = {
     none: "rounded-none",
     sm: "rounded-[8px]",
     md: "rounded-[12px]",
@@ -13916,39 +15559,170 @@ const MAX_WIDTH_CLASS = {
  * `ModalContent` tenga que ser hijo directo de `Modal.Dialog`.
  */
 const ModalCloseContext = $8WNJc$react.createContext(() => { });
+/**
+ * Atributos que el `Dialog` de react-aria SÍ deja pasar a su `<section>`: `id`, `role` (vía
+ * `useDialog`), `data-*` y los cuatro "labelable" (`filterDOMProps(props, { labelable: true })`
+ * en `react-aria/dist/private/utils/filterDOMProps.mjs`). Estos van como props para que
+ * react-aria los vea — sobre todo `aria-label`/`aria-labelledby`, que deciden si avisa de un
+ * diálogo sin nombre.
+ */
+const LABELABLE_PROPS = new Set([
+    "aria-label",
+    "aria-labelledby",
+    "aria-describedby",
+    "aria-details",
+]);
+/**
+ * Reparte el resto de props de `Modal` entre las dos vías de llegada al diálogo. En v2 TODAS
+ * llegaban (`mergeProps(modalProps, otherProps, …)` sobre el `<section>`, sin filtrar); en v3 el
+ * `Dialog` filtra, así que un `aria-busy` se perdería en silencio si solo fuera como prop. Lo que
+ * no es `aria-*`/`data-*`/`id`/`role` se descarta: `ModalProps` no lo declara y v2 lo habría
+ * volcado al DOM con el aviso de React de atributo desconocido.
+ */
+const splitDialogDOMProps = (rest) => {
+    const dialogProps = {};
+    const extraAria = {};
+    for (const [key, value] of Object.entries(rest)) {
+        // Un `aria-labelledby={undefined}` explícito no debe borrar el nombre por defecto.
+        if (value === undefined) {
+            continue;
+        }
+        if (key === "id" ||
+            key === "role" ||
+            key.startsWith("data-") ||
+            LABELABLE_PROPS.has(key)) {
+            dialogProps[key] = value;
+        }
+        else if (key.startsWith("aria-")) {
+            extraAria[key] = value;
+        }
+    }
+    return {
+        dialogProps: dialogProps,
+        extraAria: extraAria,
+    };
+};
 /**
  * Modal - fachada BeweOS sobre el `Modal` compound de HeroUI v3.
  *
  * TECH-2459 · G2-overlays-nav — v3 convierte `Modal` en compound (`Modal.Backdrop/Container/
  * Dialog/Header/Body/Footer/CloseTrigger`, ver `upload-file/UploadFile.tsx` D-G1-7 y la guía
  * oficial `modal`). Esta fachada arma esa anatomía por dentro pero conserva la API PLANA de v2
- * (`isOpen`/`onOpenChange`/`size`/`radius`/`backdrop`/`scrollBehavior`/`placement`/
- * `isDismissable`/`hideCloseButton` + `<ModalContent>{(onClose) => ...}</ModalContent>`), para que
- * el código ya escrito en las 4 apps consumidoras siga funcionando sin cambios.
+ * (`isOpen`/`onOpenChange`/`onClose`/`size`/`radius`/`backdrop`/`scrollBehavior`/`placement`/
+ * `isDismissable`/`hideCloseButton` + `<ModalContent>{(onClose) => ...}</ModalContent>`), más
+ * `classNames` por slot y `aria-*`/`data-*`/`id`/`role` al diálogo, para que el código ya escrito
+ * en las 4 apps consumidoras siga funcionando sin cambios.
  *
  * Accesibilidad (criterio de aceptación de la issue, verificado con Playwright): el foco entra al
  * abrir, queda atrapado dentro del diálogo, Escape cierra (salvo `isKeyboardDismissDisabled`), el
  * foco vuelve al disparador al cerrar y la página no hace scroll por detrás — los cuatro los
  * gestiona react-aria-components internamente (`ModalOverlay`/`Dialog`), sin código propio.
  */
-const Modal = ({ isOpen, defaultOpen, onOpenChange, size = "md", radius = "lg", backdrop = "opaque", scrollBehavior = "normal", placement, isDismissable = true, isKeyboardDismissDisabled = false, hideCloseButton = false, className, children, }) => {
-    return (jsxRuntime.jsx(react.Modal, { children: jsxRuntime.jsx(react.Modal.Backdrop, { isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: onOpenChange, variant: backdrop, isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, children: jsxRuntime.jsx(react.Modal.Container, { size: SIZE_MAP[size], placement: placement, scroll: scrollBehavior === "inside" ? "inside" : undefined, children: jsxRuntime.jsx(react.Modal.Dialog, { className: react.cn(RADIUS_CLASS$2[radius], size !== "full" && MAX_WIDTH_CLASS[size], "px-6 py-9", className), children: ({ close }) => (jsxRuntime.jsxs(ModalCloseContext.Provider, { value: close, children: [!hideCloseButton && jsxRuntime.jsx(react.Modal.CloseTrigger, {}), children] })) }) }) }) }));
+const Modal = ({ isOpen, defaultOpen, onOpenChange, onClose, size = "md", radius = "lg", backdrop = "opaque", scrollBehavior = "normal", placement, isDismissable = true, isKeyboardDismissDisabled = false, hideCloseButton = false, className, classNames, children, ...rest }) => {
+    // v2 aceptaba `onClose` además de `onOpenChange` y lo llamaba en cada cierre; v3 solo conoce
+    // `onOpenChange`. Sin este puente, un modal controlado con `isOpen` + `onClose` (el patrón
+    // v2 dominante en las apps: ~118 usos en beweossmbs frente a 8 de `onOpenChange`) no se
+    // cerraba con la X, el backdrop ni Escape, porque nadie escuchaba `onOpenChange(false)`.
+    //
+    // Basta con engancharse aquí: TODAS las vías de cierre acaban en este `onOpenChange` del
+    // `ModalOverlay`. La X (`Modal.CloseTrigger`, `slot="close"`) y el `close` del render-prop de
+    // `Modal.Dialog` —el que `ModalCloseContext` pasa a `ModalContent`— llaman a `state.close()`
+    // del estado del overlay, y Escape/backdrop también; ese estado (`useOverlayTriggerState` →
+    // `useControlledState`) solo notifica cuando el valor cambia, así que `onClose` se dispara
+    // una vez por cierre y ninguna al abrir.
+    const handleOpenChange = (open) => {
+        onOpenChange?.(open);
+        if (!open) {
+            onClose?.();
+        }
+    };
+    // v2 nombraba el diálogo con su cabecera (`aria-labelledby` = id del `ModalHeader`,
+    // `getDialogProps` de `@heroui/modal@2.2.19`); en v3 solo lo hace `Modal.Heading`, que las apps
+    // no usan. Mismo arreglo que `Drawer`: `ModalHeader` pone este id en su nodo.
+    //
+    // Si el consumidor trae su propio `aria-label`/`aria-labelledby` (3 `<Modal>` de beweossmbs,
+    // p. ej. `create-note-modal`), manda el suyo. Aquí v3 mejora a v2: v2 escribía
+    // `aria-labelledby` DESPUÉS del spread, así que pisaba siempre el del consumidor.
+    const headerId = $8WNJc$react.useId();
+    // Props de `ModalContent` (registradas desde dentro del diálogo, ver `ModalContent.tsx`). En
+    // v2 `ModalContent` era el diálogo: `getDialogProps(mergeProps(dialogProps, otherProps))`
+    // (`@heroui/modal@2.2.19`, `chunk-UKDXCIYN.mjs`), y dentro de `getDialogProps`
+    // (`chunk-Z2LRST4N.mjs`):
+    //   - atributos: `mergeProps(modalProps, <resto de Modal>, <props de ModalContent>)` →
+    //     ModalContent gana a Modal;
+    //   - clase: `slots.base({ class: clsx(clsx(classNames.base, className), content.className) })`
+    //     → fachada (tv) < `classNames.base` < `className` de Modal < `className` de ModalContent,
+    //     con `twMerge`. Es el orden del `cn` de abajo.
+    const [content, setContent] = $8WNJc$react.useState({});
+    const registerContentProps = $8WNJc$react.useCallback((props) => setContent(props ?? {}), []);
+    const { className: contentClassName, ...contentRest } = content;
+    const { dialogProps, extraAria } = splitDialogDOMProps({
+        ...rest,
+        ...contentRest,
+    });
+    const hasOwnName = dialogProps["aria-label"] !== undefined ||
+        dialogProps["aria-labelledby"] !== undefined;
+    const hasExtraAria = Object.keys(extraAria).length > 0;
+    // Sin `Modal.Root` (el `DialogTrigger` de react-aria) a propósito, igual que `Drawer`: la
+    // fachada no tiene disparador propio —la abre el `isOpen` de la app— y un `DialogTrigger`
+    // sin hijo pulsable avisaba en consola en CADA montaje («A PressResponder was rendered
+    // without a pressable child», medido en jsdom: 9 avisos en `Modal.onClose.test.tsx`).
+    // `Modal.Backdrop` (`ModalOverlay`) ya crea y publica su propio estado de overlay con
+    // `isOpen`/`onOpenChange` —el que usan la X y el `close` del render-prop— y calcula todos los
+    // slots de `modalVariants()` aunque no haya root encima; el root solo aportaba ese aviso y un
+    // `aria-labelledby` de reserva que apuntaba al id de un disparador que no existe.
+    return (jsxRuntime.jsx(react.Modal.Backdrop, { isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: handleOpenChange, variant: backdrop, isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, 
+        // v2 `classNames.backdrop` → la capa que oscurece la página. Utilidad en
+        // `@layer utilities`, gana a `.modal__backdrop--opaque` (`@layer components`).
+        className: classNames?.backdrop, children: jsxRuntime.jsx(react.Modal.Container, { size: SIZE_MAP[size], placement: placement, scroll: scrollBehavior === "inside" ? "inside" : undefined, 
+            // v2 `classNames.wrapper` (el `div` que posiciona el diálogo, `data-slot="wrapper"`)
+            // es el `Modal.Container` de v3: su `p-4 sm:p-10` es lo que pisa un `wrapper="p-0"`.
+            className: classNames?.wrapper, children: jsxRuntime.jsx(react.Modal.Dialog, { ...(hasOwnName ? {} : { "aria-labelledby": headerId }), ...dialogProps, 
+                // Los `aria-*` que react-aria filtra (`aria-busy`…) entran por el `render` del
+                // `<section>`: van ANTES de sus props, así que `role`/`aria-modal`/`tabIndex`
+                // de react-aria no se pueden pisar por esta vía.
+                render: hasExtraAria
+                    ? (sectionProps) => jsxRuntime.jsx("section", { ...extraAria, ...sectionProps })
+                    : undefined, className: react.cn(RADIUS_CLASS$1[radius], size !== "full" && MAX_WIDTH_CLASS[size], "px-6 py-9", classNames?.base, className, contentClassName), children: ({ close }) => (jsxRuntime.jsx(ModalDialogBody, { close: close, headerId: headerId, classNames: classNames, registerContentProps: registerContentProps, hideCloseButton: hideCloseButton, children: children })) }) }) }));
+};
+/** Aísla el `useMemo` del valor de contexto (el render-prop de `Dialog` no puede usar hooks). */
+const ModalDialogBody = ({ close, headerId, classNames, registerContentProps, hideCloseButton, children, }) => {
+    const value = $8WNJc$react.useMemo(() => ({ headerId, classNames, registerContentProps }), [headerId, classNames, registerContentProps]);
+    return (jsxRuntime.jsx(ModalCloseContext.Provider, { value: close, children: jsxRuntime.jsxs(ModalFacadeContext.Provider, { value: value, children: [!hideCloseButton && (jsxRuntime.jsx(react.Modal.CloseTrigger, { className: classNames?.closeButton })), children] }) }));
 };
 
+/**
+ * Clave estable de las props registradas: solo primitivos (`className`, `aria-*`, `data-*`…), así
+ * que basta con serializarlas. Evita re-registrar —y re-renderizar el `Modal`— en cada render.
+ */
+const keyOf = (props) => JSON.stringify(Object.entries(props)
+    .filter(([, value]) => value !== undefined)
+    .sort(([a], [b]) => (a < b ? -1 : 1)));
 /**
  * `ModalContent` de v2 no sobrevive en v3 (compound: `Modal.Container`/`Modal.Dialog`, ver D-G1-7
- * / D-F2-3). Este componente NO es un wrapper de ningún compound v3 — es puro azúcar de
- * compatibilidad: envuelve sus `children` (que ya se renderizan dentro de `Modal.Dialog`, ver
- * `Modal.tsx`) y, si `children` es una función, la invoca con el `close` real del diálogo (vía
- * contexto) para que el patrón v2 `{(onClose) => <>...</>}` siga funcionando tal cual.
+ * / D-F2-3). Este componente NO es un wrapper de ningún compound v3 — es azúcar de
+ * compatibilidad: sus `children` ya se renderizan dentro de `Modal.Dialog` (ver `Modal.tsx`) y, si
+ * `children` es una función, la invoca con el `close` real del diálogo (vía contexto) para que el
+ * patrón v2 `{(onClose) => <>...</>}` siga funcionando tal cual.
+ *
+ * Sus demás props (`className`, `aria-busy`, `data-*`…) NO se pintan aquí: en v2 `ModalContent`
+ * era el propio diálogo, así que se registran en el `Modal` y este las aplica al `role="dialog"`
+ * (antes caían en un `<div>` intermedio y, p. ej., el `h-[95vh] p-0 rounded-2xl` de
+ * `chatbot-config` no llegaba al diálogo). Sin props no se registra nada: el render es el mismo.
  */
-function ModalContent({ children, className }) {
+function ModalContent({ children, ...dialogProps }) {
     const close = $8WNJc$react.useContext(ModalCloseContext);
-    const content = typeof children === "function" ? children(close) : children;
-    if (!className) {
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: content });
-    }
-    return jsxRuntime.jsx("div", { className: className, children: content });
+    const { registerContentProps } = $8WNJc$react.useContext(ModalFacadeContext);
+    const key = keyOf(dialogProps);
+    // biome-ignore lint/correctness/useExhaustiveDependencies: `key` resume `dialogProps` (primitivos); depender del objeto re-registraría en cada render.
+    $8WNJc$react.useLayoutEffect(() => {
+        if (!registerContentProps || key === "[]") {
+            return;
+        }
+        registerContentProps(dialogProps);
+        return () => registerContentProps(undefined);
+    }, [registerContentProps, key]);
+    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: typeof children === "function" ? children(close) : children });
 }
 
 /**
@@ -13960,9 +15734,23 @@ function ModalContent({ children, className }) {
  * era una fila sin gap.
  *
  * El `className` del consumidor se mezcla con `cn` (tailwind-merge), así que sigue
- * ganando: `<ModalHeader className="flex flex-col gap-1">` mantiene su columna.
+ * ganando: `<ModalHeader className="flex flex-col gap-1">` mantiene su columna. El slot
+ * `classNames.header` del `<Modal>` se aplica entre medias (gana a la fachada, pierde con el
+ * `className`), y el nodo lleva el `id` que nombra el diálogo, como en v2.
  */
-const ModalHeader = ({ className, ...props }) => (jsxRuntime.jsx(react.ModalHeader, { ...props, className: react.cn("flex-row gap-0 px-6 py-4 text-lg font-semibold", className) }));
+const ModalHeader = ({ className, ...props }) => {
+    const { headerId, classNames } = $8WNJc$react.useContext(ModalFacadeContext);
+    return (jsxRuntime.jsx(react.ModalHeader
+    // Nombra el diálogo (`aria-labelledby`, ver `Modal.tsx`). Va antes del spread: un `id`
+    // propio del consumidor gana, igual que en v2 (`id: headerId, ...otherProps`).
+    , { 
+        // Nombra el diálogo (`aria-labelledby`, ver `Modal.tsx`). Va antes del spread: un `id`
+        // propio del consumidor gana, igual que en v2 (`id: headerId, ...otherProps`).
+        id: headerId, ...props, className: react.cn("flex-row gap-0 px-6 py-4 text-lg font-semibold", 
+        // v2 `classNames.header` del `<Modal>`; el `className` propio gana
+        // (`clsx(classNames.header, className)` en `@heroui/modal@2.2.19`).
+        classNames?.header, className) }));
+};
 ModalHeader.displayName = "ModalHeader";
 
 /**
@@ -13978,8 +15766,9 @@ ModalHeader.displayName = "ModalHeader";
  * 24px de `px-6` ese margen negativo solo desalineaba el contenido 3px respecto al header.
  * `mt-0` anula el `.modal__header + .modal__body { mt-2 }` de v3, que v2 no tenía.
  */
-const BODY_V2_GEOMETRY = "mx-0 mt-0 flex flex-1 flex-col gap-3 px-6 py-2";
+const BODY_V2_GEOMETRY$1 = "mx-0 mt-0 flex flex-1 flex-col gap-3 px-6 py-2";
 const ModalBody = $8WNJc$react.forwardRef(({ className, ...props }, forwardedRef) => {
+    const { classNames } = $8WNJc$react.useContext(ModalFacadeContext);
     const nodeRef = $8WNJc$react.useRef(null);
     const callbackRef = $8WNJc$react.useCallback((node) => {
         nodeRef.current = node;
@@ -14125,19 +15914,217 @@ const ModalBody = $8WNJc$react.forwardRef(({ className, ...props }, forwardedRef
             track.remove();
         };
     }, []);
-    return (jsxRuntime.jsx(react.ModalBody, { ref: callbackRef, ...props, className: react.cn(BODY_V2_GEOMETRY, className) }));
+    return (jsxRuntime.jsx(react.ModalBody, { ref: callbackRef, ...props, 
+        // v2 `classNames.body` del `<Modal>` entre la geometría y el `className` propio,
+        // que gana (`clsx(classNames.body, className)` en `@heroui/modal@2.2.19`).
+        className: react.cn(BODY_V2_GEOMETRY$1, classNames?.body, className) }));
+});
+ModalBody.displayName = "ModalBody";
+
+/**
+ * Geometría v2 del slot `footer` del modal (TECH-2459 / F5 · P-15). v2:
+ * `flex flex-row gap-2 px-6 py-4 justify-end` (`@heroui/theme@2.4.15`, slot `footer`).
+ * v3 conserva `flex-row justify-end gap-2` pero pierde el padding, y añade un
+ * `.modal__body + .modal__footer { mt-5 }` que v2 no tenía (v2 separaba los slots solo
+ * con su propio padding) — de ahí el `mt-0`.
+ */
+const ModalFooter = ({ className, ...props }) => {
+    const { classNames } = $8WNJc$react.useContext(ModalFacadeContext);
+    return (jsxRuntime.jsx(react.ModalFooter, { ...props, 
+        // v2 `classNames.footer` del `<Modal>` entre la fachada y el `className` propio, que
+        // gana (`clsx(classNames.footer, className)` en `@heroui/modal@2.2.19`).
+        className: react.cn("mt-0 px-6 py-4", classNames?.footer, className) }));
+};
+ModalFooter.displayName = "ModalFooter";
+
+const DrawerFacadeContext = $8WNJc$react.createContext({
+    close: () => {
+        // fuera de un `Drawer` no hay diálogo que cerrar
+    },
+    scrollBehavior: "inside",
+});
+
+// Tope del lado corto del panel por tamaño, con los valores EXACTOS de v2 — leídos del oráculo,
+// no de memoria: `@heroui/theme@2.4.15`, `dist/chunk-EP7KPCL3.mjs` (tv `drawer`) aplica
+// `max-w-<size>` + `max-h-[<rem>]` al slot `base` (el panel), y el `placement` anula el eje que
+// no toca (`max-h-[none]` en left/right, `max-w-[none]` en top/bottom). La escala `maxWidth` de
+// Tailwind 3 resuelve `max-w-<size>` a los mismos rem que el `max-h` literal. Clases literales:
+// Tailwind solo genera lo que ve escrito entero en el fuente.
+//
+// left/right: v2 era `w-full` (slot `base` del modal) + `max-w-<size>`. v3 fija
+// `w-80 max-w-[85vw] sm:w-96` (320/384px) para cualquier tamaño: sin esto, `size="lg"` medía
+// 384px donde v2 medía 512px, y `size` no hacía nada. Ganan a `.drawer__dialog[data-placement]`
+// por capa (`@layer components` < `@layer utilities`), no por especificidad, igual que el
+// `MAX_WIDTH_CLASS` de `Modal`.
+const HORIZONTAL_SIZE_CLASS = {
+    xs: "w-full max-w-[20rem]",
+    sm: "w-full max-w-[24rem]",
+    md: "w-full max-w-[28rem]",
+    lg: "w-full max-w-[32rem]",
+    xl: "w-full max-w-[36rem]",
+    "2xl": "w-full max-w-[42rem]",
+    "3xl": "w-full max-w-[48rem]",
+    "4xl": "w-full max-w-[56rem]",
+    "5xl": "w-full max-w-[64rem]",
+};
+// top/bottom: v3 ya es `w-full` y topa el alto a `max-h-[85vh]`; v2 lo topaba por tamaño.
+const VERTICAL_SIZE_CLASS = {
+    xs: "max-h-[20rem]",
+    sm: "max-h-[24rem]",
+    md: "max-h-[28rem]",
+    lg: "max-h-[32rem]",
+    xl: "max-h-[36rem]",
+    "2xl": "max-h-[42rem]",
+    "3xl": "max-h-[48rem]",
+    "4xl": "max-h-[56rem]",
+    "5xl": "max-h-[64rem]",
+};
+// v2 `full`: `max-w-full max-h-full h-[100dvh] !rounded-none` en cualquier `placement`.
+const FULL_SIZE_CLASS = "w-full max-w-full h-[100dvh] max-h-full rounded-none";
+const sizeClass = (size, placement) => {
+    if (size === "full") {
+        return FULL_SIZE_CLASS;
+    }
+    return placement === "left" || placement === "right"
+        ? HORIZONTAL_SIZE_CLASS[size]
+        : VERTICAL_SIZE_CLASS[size];
+};
+/**
+ * Drawer - fachada BeweOS sobre el `Drawer` compound de HeroUI v3.
+ *
+ * TECH-2459 — hasta el 23-sep `Drawer`/`DrawerContent`/`DrawerHeader`/`DrawerBody`/`DrawerFooter`
+ * se servían CRUDOS de v3, que es compound y no entiende la API plana de v2: `isOpen`/`onClose`
+ * no llegaban a ningún overlay, así que los drawers de las apps no montaban o no cerraban. Esta
+ * fachada arma la anatomía de v3 por dentro (`Drawer` → `Backdrop` → `Content` → `Dialog`) y
+ * conserva la API de v2 (`isOpen`/`defaultOpen`/`onOpenChange`/`onClose`/`placement`/`size`/
+ * `backdrop`/`scrollBehavior`/`isDismissable`/`isKeyboardDismissDisabled`/`hideCloseButton` +
+ * `<DrawerContent>{(onClose) => ...}</DrawerContent>`), con los defaults de v2 (`useDrawer` de
+ * `@heroui/drawer@2.2.29`: `placement="right"`, `size="md"`, `scrollBehavior="inside"`).
+ *
+ * Lo que NO se repone a propósito (criterio de la migración: adaptarse a v3, no identidad de
+ * píxel): fondo, sombra, radio y posición de la X son los de v3. Sí se repone la geometría de la
+ * que depende el contenido de las apps: el ancho/alto por `size`, el padding de los slots
+ * (`DrawerHeader`/`Body`/`Footer`) y el panel sin padding propio, porque las apps ya compensan
+ * sobre esos valores (p. ej. `DrawerHeader className="pt-6"`).
+ *
+ * La anatomía v3 completa queda publicada como estáticos (`Drawer.Backdrop`, `Drawer.Content`,
+ * `Drawer.Dialog`, …): son los MISMOS objetos que exporta `@heroui/react`.
+ */
+const DrawerFacade = ({ isOpen, defaultOpen, onOpenChange, onClose, placement = "right", size = "md", backdrop = "opaque", scrollBehavior = "inside", isDismissable = true, isKeyboardDismissDisabled = false, hideCloseButton = false, className, children, }) => {
+    // Mismo puente que `Modal` (f3ce18c): v3 solo conoce `onOpenChange`. Todas las vías de cierre
+    // (la X —`Drawer.CloseTrigger`, `slot="close"`—, el `close` del render-prop de
+    // `Drawer.Dialog`, Escape, backdrop y el arrastre de v3) acaban en `state.close()` del
+    // overlay, que solo notifica cuando el valor cambia: `onClose` sale una vez por cierre y
+    // ninguna al abrir.
+    // v2 nombraba el diálogo con su cabecera (`ModalContent` → `aria-labelledby` = id del
+    // `ModalHeader`). En v3 solo lo hace `Drawer.Heading`, que las apps no usan: sin esto el
+    // panel quedaba sin nombre accesible y react-aria avisaba en consola en cada apertura («A
+    // dialog must have a title for accessibility», medido en jsdom). `DrawerHeader` pone este id.
+    const headerId = $8WNJc$react.useId();
+    const handleOpenChange = (open) => {
+        onOpenChange?.(open);
+        if (!open) {
+            onClose?.();
+        }
+    };
+    // Sin `Drawer.Root` (el `DialogTrigger` de react-aria) a propósito: la fachada no tiene
+    // disparador propio —lo abre el `isOpen` de la app— y un `DialogTrigger` sin hijo pulsable
+    // avisa en consola en CADA montaje («A PressResponder was rendered without a pressable
+    // child», medido en jsdom; `Modal` lo sigue emitiendo). `Drawer.Backdrop` (`ModalOverlay`)
+    // ya crea y publica su propio estado de overlay con `isOpen`/`onOpenChange`, y trae todos los
+    // slots de `drawerVariants()`, así que el root no aportaba nada.
+    return (jsxRuntime.jsx(react.Drawer.Backdrop, { isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: handleOpenChange, variant: backdrop, isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, children: jsxRuntime.jsx(react.Drawer.Content, { placement: placement, children: jsxRuntime.jsx(react.Drawer.Dialog, { "aria-labelledby": headerId, className: react.cn(sizeClass(size, placement), "p-0", scrollBehavior === "outside" && "overflow-y-auto", className), children: ({ close }) => (jsxRuntime.jsx(DrawerDialogBody, { close: close, headerId: headerId, scrollBehavior: scrollBehavior, hideCloseButton: hideCloseButton, children: children })) }) }) }));
+};
+/** Aísla el `useMemo` del valor de contexto (el render-prop de `Dialog` no puede usar hooks). */
+const DrawerDialogBody = ({ close, headerId, scrollBehavior, hideCloseButton, children }) => {
+    const value = $8WNJc$react.useMemo(() => ({ close, headerId, scrollBehavior }), [close, headerId, scrollBehavior]);
+    return (jsxRuntime.jsxs(DrawerFacadeContext.Provider, { value: value, children: [!hideCloseButton && jsxRuntime.jsx(react.Drawer.CloseTrigger, {}), children] }));
+};
+DrawerFacade.displayName = "Aurora.Drawer";
+/**
+ * `Drawer` de Aurora: fachada v2 + estáticos compound de v3 (los mismos objetos que exporta
+ * `@heroui/react`), para quien quiera montar la anatomía de v3 a mano.
+ *
+ * ⚠️ `Drawer.Content`/`Drawer.Header`/`Drawer.Body`/`Drawer.Footer` son las piezas CRUDAS de v3
+ * (sin la geometría v2 ni el render-prop): no son los `DrawerContent`/`DrawerHeader`/… planos de
+ * esta librería. No se mezclan las dos formas en el mismo drawer.
+ */
+const Drawer = Object.assign(DrawerFacade, {
+    Root: react.Drawer.Root,
+    Trigger: react.Drawer.Trigger,
+    Backdrop: react.Drawer.Backdrop,
+    Content: react.Drawer.Content,
+    Dialog: react.Drawer.Dialog,
+    Header: react.Drawer.Header,
+    Heading: react.Drawer.Heading,
+    Body: react.Drawer.Body,
+    Footer: react.Drawer.Footer,
+    Handle: react.Drawer.Handle,
+    CloseTrigger: react.Drawer.CloseTrigger,
 });
-ModalBody.displayName = "ModalBody";
 
 /**
- * Geometría v2 del slot `footer` del modal (TECH-2459 / F5 · P-15). v2:
- * `flex flex-row gap-2 px-6 py-4 justify-end` (`@heroui/theme@2.4.15`, slot `footer`).
- * v3 conserva `flex-row justify-end gap-2` pero pierde el padding, y añade un
- * `.modal__body + .modal__footer { mt-5 }` que v2 no tenía (v2 separaba los slots solo
- * con su propio padding) — de ahí el `mt-0`.
+ * `DrawerContent` de v2 (en v2 era el mismo `ModalContent`). En v3 `Drawer.Content` es el
+ * posicionador del overlay, que la fachada `Drawer` ya monta por dentro; este componente NO lo
+ * envuelve: es azúcar de compatibilidad. Si `children` es una función, la invoca con el `close`
+ * real del diálogo (vía contexto) para que el patrón v2 `{(onClose) => <>...</>}` siga
+ * funcionando (6 de los 12 drawers de las apps lo usan, medido el 23-sep).
  */
-const ModalFooter = ({ className, ...props }) => (jsxRuntime.jsx(react.ModalFooter, { ...props, className: react.cn("mt-0 px-6 py-4", className) }));
-ModalFooter.displayName = "ModalFooter";
+function DrawerContent({ children, className }) {
+    const { close } = $8WNJc$react.useContext(DrawerFacadeContext);
+    const content = typeof children === "function" ? children(close) : children;
+    if (!className) {
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: content });
+    }
+    return jsxRuntime.jsx("div", { className: className, children: content });
+}
+DrawerContent.displayName = "Aurora.DrawerContent";
+
+/**
+ * Geometría v2 del slot `header`, reintroducida sobre `.drawer__header` de v3. v2 (el drawer
+ * reusaba los slots del modal): `flex py-4 px-6 flex-initial text-large font-semibold`
+ * (`@heroui/theme@2.4.15`, `chunk-YXVO2HGK.mjs`, slot `header`; `text-large` → `text-lg`).
+ * `.drawer__header` de v3 no tiene padding ni tipografía y apila en columna con `gap-3`; mismo
+ * arreglo que `ModalHeader`.
+ *
+ * El `className` del consumidor se mezcla con `cn` (tailwind-merge) en última posición, así que
+ * sigue ganando: `className="flex flex-col gap-1"` mantiene su columna y `pt-6` pisa el `py-4`.
+ *
+ * Lleva el `id` que el panel usa como `aria-labelledby`: la cabecera NOMBRA el diálogo, como en
+ * v2 (ver `Drawer.tsx`).
+ */
+const DrawerHeader = ({ className, children }) => {
+    const { headerId } = $8WNJc$react.useContext(DrawerFacadeContext);
+    return (jsxRuntime.jsx(react.DrawerHeader, { id: headerId, className: react.cn("flex-initial flex-row gap-0 px-6 py-4 text-lg font-semibold", className), children: children }));
+};
+DrawerHeader.displayName = "Aurora.DrawerHeader";
+
+/**
+ * Geometría v2 del slot `body`: `flex flex-1 flex-col gap-3 px-6 py-2` (`@heroui/theme@2.4.15`,
+ * `chunk-YXVO2HGK.mjs`, slot `body`). `.drawer__body` de v3 es un bloque sin padding ni gap
+ * (`-m-[3px] my-0 p-[3px]`), así que los campos de un formulario quedarían pegados y a ras del
+ * borde. `mx-0` anula el margen negativo de v3 y `mt-0` el `.drawer__header + .drawer__body
+ * { mt-2 }`, que v2 no tenía (mismo arreglo que `ModalBody`).
+ *
+ * Scroll: con `scrollBehavior="inside"` (default v2 del drawer) el cuerpo hace scroll, que es lo
+ * que ya trae `.drawer__body` de v3. Con `outside` el que hace scroll es el panel, así que el
+ * cuerpo lo suelta (`overflow-visible`) y deja de encogerse (`flex-none`).
+ */
+const BODY_V2_GEOMETRY = "mx-0 mt-0 flex flex-1 flex-col gap-3 px-6 py-2";
+const DrawerBody = ({ className, children }) => {
+    const { scrollBehavior } = $8WNJc$react.useContext(DrawerFacadeContext);
+    return (jsxRuntime.jsx(react.DrawerBody, { className: react.cn(BODY_V2_GEOMETRY, scrollBehavior === "outside" && "flex-none overflow-visible", className), children: children }));
+};
+DrawerBody.displayName = "Aurora.DrawerBody";
+
+/**
+ * Geometría v2 del slot `footer`: `flex flex-row gap-2 px-6 py-4 justify-end`
+ * (`@heroui/theme@2.4.15`, slot `footer`). v3 conserva `flex-row justify-end gap-2` pero pierde
+ * el padding y añade `.drawer__body + .drawer__footer { mt-5 }`, que v2 no tenía — de ahí el
+ * `mt-0` (mismo arreglo que `ModalFooter`).
+ */
+const DrawerFooter = ({ className, children }) => (jsxRuntime.jsx(react.DrawerFooter, { className: react.cn("mt-0 px-6 py-4", className), children: children }));
+DrawerFooter.displayName = "Aurora.DrawerFooter";
 
 // TECH-2459 — Fachada `Alert` (hallazgo loginos 07-sep: `index.tsx` reexportaba el `Alert` CRUDO de
 // v3 y solo shimeaba el TIPO `AlertProps` v2 → el JSX v2 compilaba pero el componente era v3).
@@ -14181,7 +16168,7 @@ const COLOR_BY_STATUS = {
 };
 // v3 usa `min(32px, var(--radius-3xl))`; v2 `radius="md"` = `rounded-medium` = 12px. Mismos
 // valores EXACTOS que Button/Card/Chip (los `rounded-md`/`lg` de Tailwind son 6/8px, no 12/14).
-const RADIUS_CLASS$1 = {
+const RADIUS_CLASS = {
     none: "rounded-none",
     sm: "rounded-[8px]",
     md: "rounded-[12px]",
@@ -14317,291 +16304,192 @@ function slotClasses(variant, color) {
                 description: defaultDescription,
                 iconWrapper: `${ICON_WRAPPER_SHADOW} ${BORDERED_ICON_WRAPPER[color]}`,
                 closeButton: BORDERED_CLOSE[color],
-            };
-        case "faded":
-            return {
-                base: `border ${FLAT_BASE[color]} ${FADED_BORDER[color]}`,
-                description: defaultDescription,
-                iconWrapper: `${ICON_WRAPPER_TINTED} ${FLAT_ICON_WRAPPER[color]}`,
-                closeButton: FLAT_CLOSE[color],
-            };
-        default:
-            return {
-                base: FLAT_BASE[color],
-                description: defaultDescription,
-                iconWrapper: `${ICON_WRAPPER_TINTED} ${FLAT_ICON_WRAPPER[color]}`,
-                closeButton: FLAT_CLOSE[color],
-            };
-    }
-}
-// Los subcomponentes compound de v3, adjuntos como estáticos (`Alert.Indicator`…) para que el JSX
-// v3 (loginos ya migró el suyo) siga compilando y renderizando IGUAL que contra el `Alert` crudo.
-const COMPOUND_PARTS$1 = new Set([
-    react.Alert.Indicator,
-    react.Alert.Content,
-    react.Alert.Title,
-    react.Alert.Description,
-]);
-/**
- * Detecta la API compound de v3: si algún hijo directo es `Alert.Indicator`/`Content`/`Title`/
- * `Description`, el consumidor ya compone la estructura y la fachada NO debe envolver nada (si lo
- * hiciera, saldrían dos indicadores). `<Alert>Texto</Alert>` (sin partes compound) sigue siendo
- * API v2: children bajo la descripción, con icono y círculo, como en v2.
- */
-function hasCompoundChildren$1(children) {
-    return $8WNJc$react.Children.toArray(children).some((child) => $8WNJc$react.isValidElement(child) && COMPOUND_PARTS$1.has(child.type));
-}
-/** `isEmpty` de v2 (`@heroui/shared-utils`): null/undefined/"" no cuentan como contenido. */
-function hasValue$1(node) {
-    return node !== null && node !== undefined && node !== "" && node !== false;
-}
-/**
- * Alert - Aviso contextual basado en HeroUI v3 con la API pública de v2 intacta (TECH-2459).
- *
- * Dos modos, decididos por los `children`:
- * - **API v2** (`color`/`variant`/`title`/`description`/`isClosable`…): la fachada compone el
- *   compound de v3 y repone `variant` (fondo teñido en `flat`), `radius`, el círculo del icono,
- *   el botón de cerrar (`CloseButton` de v3 con `aria-label` traducido) y la visibilidad.
- * - **API compound v3** (`<Alert status="danger"><Alert.Indicator/><Alert.Content>…`): pasa tal
- *   cual al `Alert` de HeroUI; `color`, si viene, se traduce a `status`.
- */
-const AlertFacade = ({ color, status, variant = "flat", radius = "md", title, description, icon, hideIcon = false, hideIconWrapper = false, isClosable = false, onClose, isVisible: isVisibleProp, isDefaultVisible, onVisibleChange, startContent, endContent, classNames, className, children, translations = {}, ...rest }) => {
-    // `useControlledState` de v2 (`use-alert.ts`): controlado si llega `isVisible`; si no, estado
-    // propio que arranca en `isDefaultVisible ?? true` y se apaga al cerrar.
-    const [uncontrolledVisible, setUncontrolledVisible] = $8WNJc$react.useState(isDefaultVisible ?? true);
-    const isControlled = isVisibleProp !== undefined;
-    const isVisible = isControlled ? isVisibleProp : uncontrolledVisible;
-    const t = { ...DEFAULT_TRANSLATIONS, ...translations };
-    // `status` (v3) gana sobre `color` (v2) para la clase de estado de HeroUI; y si SOLO llega
-    // `status`, las utilidades de Aurora siguen el color equivalente (`accent` → `primary`).
-    const effectiveColor = color ?? (status ? COLOR_BY_STATUS[status] : "default");
-    const effectiveStatus = status ?? STATUS_BY_COLOR[effectiveColor];
-    if (!isVisible) {
-        return null;
-    }
-    if (hasCompoundChildren$1(children)) {
-        return (jsxRuntime.jsx(react.Alert, { ...rest, status: effectiveStatus, className: react.cn(classNames?.base, className), children: children }));
-    }
-    const handleClose = () => {
-        if (!isControlled) {
-            setUncontrolledVisible(false);
-        }
-        onVisibleChange?.(false);
-        onClose?.();
-    };
-    const slots = slotClasses(variant, effectiveColor);
-    const hasTitle = hasValue$1(title);
-    const hasDescription = hasValue$1(description);
-    // `hasContent` de v2: sin descripción ni children, el título se centra verticalmente con el icono.
-    const hasContent = hasDescription || hasValue$1(children);
-    const showClose = isClosable || Boolean(onClose);
-    return (jsxRuntime.jsxs(react.Alert, { role: "alert", "data-visible": "true", "data-closeable": showClose ? "true" : undefined, "data-has-title": hasTitle ? "true" : undefined, "data-has-description": hasDescription ? "true" : undefined, ...rest, status: effectiveStatus, 
-        // Base v2: `flex flex-grow flex-row w-full items-start py-3 px-4 gap-x-1`. v3 ya trae
-        // flex/w-full/items-start/px-4/py-3; se repone el `gap-x-1` (v3: `gap-4`), se quita el
-        // `shadow-surface` (v2 no tenía sombra en el base) y se aplica variant/radius.
-        className: react.cn("grow gap-x-1 shadow-none", slots.base, RADIUS_CLASS$1[radius], hideIconWrapper && "gap-x-0", classNames?.base, className), children: [startContent, !hideIcon && (jsxRuntime.jsx(react.Alert.Indicator, { className: react.cn(ICON_WRAPPER_BASE, 
-                // v2 `hideIconWrapper`: `!bg-transparent !shadow-none !border-none` — se omiten
-                // las clases teñidas en vez de pisarlas, porque `bg-transparent` no borraría el
-                // `dark:bg-*` (grupo distinto para tailwind-merge).
-                hideIconWrapper ? "bg-transparent" : slots.iconWrapper, classNames?.iconWrapper), children: icon !== undefined && icon !== null ? (classNames?.alertIcon ? (
-                // `alertIcon` de v2 se aplicaba al propio SVG; aquí solo alcanza al icono
-                // personalizado (el de v3 por defecto se renderiza dentro del indicador).
-                jsxRuntime.jsx("span", { className: classNames.alertIcon, children: icon })) : (icon)) : undefined })), jsxRuntime.jsxs(react.Alert.Content, { className: react.cn("ms-2 box-border min-h-10 justify-center text-inherit", !hasContent && "items-center", classNames?.mainWrapper), children: [hasTitle && (
-                    // v2: `text-small w-full font-medium block text-inherit leading-5`; v3 (`.alert__title`)
-                    // pone `leading-6` y el color del estado — `text-inherit` devuelve el de v2.
-                    jsxRuntime.jsx(react.Alert.Title, { className: react.cn("w-full leading-5 text-inherit", classNames?.title), children: title })), hasDescription && (
-                    // v2: `pl-[1px] text-small font-normal text-inherit`; v3 (`.alert__description`) pone
-                    // `text-muted`.
-                    jsxRuntime.jsx(react.Alert.Description, { className: react.cn("pl-px font-normal text-inherit", slots.description, classNames?.description), children: description })), children] }), endContent, showClose && (jsxRuntime.jsx(react.CloseButton, { "aria-label": t.closeButtonAriaLabel, className: react.cn(CLOSE_BASE, slots.closeButton, classNames?.closeButton), onPress: handleClose }))] }));
-};
-AlertFacade.displayName = "Aurora.Alert";
-/**
- * `Alert` de Aurora: fachada v2 + estáticos compound de v3 (`Alert.Indicator`, `Alert.Content`,
- * `Alert.Title`, `Alert.Description`), los mismos objetos que exporta `@heroui/react`.
- */
-const Alert = Object.assign(AlertFacade, {
-    Indicator: react.Alert.Indicator,
-    Content: react.Alert.Content,
-    Title: react.Alert.Title,
-    Description: react.Alert.Description,
-});
-
-// TECH-2459 — Fachada `Checkbox` (hallazgo loginos 07-sep: `index.tsx` reexportaba el `Checkbox`
-// CRUDO de v3, así que el JSX v2 de las apps — `isSelected` + `onValueChange` dentro de `Controller`
-// de RHF en backoffice ×12, smbs ×23, agency ×5 — no compilaba pese a existir el símbolo).
-//
-// HeroUI v3 convierte el Checkbox en compound (`Checkbox.Content` > `Checkbox.Control` >
-// `Checkbox.Indicator` + la etiqueta como children de `Content`), renombra `onValueChange` →
-// `onChange` y ELIMINA `color`, `size`, `radius`, `lineThrough`, `icon`, `classNames` y
-// `disableAnimation` (guía oficial `checkbox`). Su único eje propio es `variant`
-// (`primary`/`secondary`), que NO es un color: `secondary` es un tratamiento gris de menor énfasis
-// — el falso amigo de siempre (skill `auraui-design-tokens`).
-//
-// Esta fachada compone el compound por dentro y repone cada prop v2 con los literales del `tv`
-// de v2 (`@heroui/theme@2.4.15` → `dist/components/checkbox.js`), traducidos a utilidades de
-// Tailwind 4 sobre los tokens de Aurora. El relleno del estado marcado en v3 es el `::before` del
-// control (`bg-accent`, = `--color-primary` vía F1), así que `color` se reimplementa pisando ese
-// pseudo-elemento con `before:bg-<color>` — utilidad (capa `utilities`) que gana a la regla de
-// `checkbox.css` (capa `components`), incluida la de hover (`bg-accent-hover`).
-//
-// ⚠️ Estados de react-aria, verificados en el navegador contra `checkbox.css`: `data-selected`/
-// `data-indeterminate`/`data-invalid`/`data-disabled` viven en la RAÍZ (`.checkbox`);
-// `data-hovered`/`data-pressed`/`data-focus-visible` en `[data-slot="checkbox-content"]`. Por
-// eso hay dos grupos con nombre (`group/checkbox`, `group/content`) y NUNCA `data-[hover=true]`
-// (trampa 3 de la skill: v2 escribía `data-hover`; react-aria escribe `data-hovered`).
-/**
- * Relleno del estado marcado (`::before` del control) y del indeterminado (fondo del control)
- * por color. `primary` no pisa nada: el `bg-accent` de v3 YA es `--color-primary`. `default`
- * usa el gris de Aurora (`--color-default`, = v2), nunca el `--default` crudo de v3 (D-F1-3).
- *
- * Literal v2: `after:bg-<color> after:text-<color>-foreground text-<color>-foreground`.
- */
-const CONTROL_COLOR = {
-    primary: "",
-    default: "before:bg-default group-data-[indeterminate=true]/checkbox:bg-default",
-    secondary: "before:bg-secondary group-data-[indeterminate=true]/checkbox:bg-secondary",
-    success: "before:bg-success group-data-[indeterminate=true]/checkbox:bg-success",
-    warning: "before:bg-warning group-data-[indeterminate=true]/checkbox:bg-warning",
-    danger: "before:bg-danger group-data-[indeterminate=true]/checkbox:bg-danger",
-};
-/**
- * Color del glifo (check / línea). v3 lo fija en el SVG (`[data-slot="checkbox-default-indicator--
- * checkmark"] { text-accent-foreground }`), así que hay que alcanzar al SVG, no al indicador.
- */
-const INDICATOR_COLOR = {
-    primary: "",
-    default: "[&_svg]:text-default-foreground",
-    secondary: "[&_svg]:text-secondary-foreground",
-    success: "[&_svg]:text-success-foreground",
-    warning: "[&_svg]:text-warning-foreground",
-    danger: "[&_svg]:text-danger-foreground",
-};
-// v2 (`checkbox.js`, variante `size`): wrapper `w-4/w-5/w-6` (16/20/24px), label
-// `text-small/medium/large`, icon `w-3 h-2` / `w-4 h-3` / `w-5 h-4`. v3: control `size-4`, glifo
-// `size-2.5`, texto `text-sm`, para todos.
-const CONTROL_SIZE = {
-    sm: "size-4",
-    md: "size-5",
-    lg: "size-6",
-};
-const INDICATOR_SIZE = {
-    sm: "size-3 [&_svg]:size-2.5",
-    md: "size-3.5 [&_svg]:size-3",
-    lg: "size-4 [&_svg]:size-3.5",
-};
-const LABEL_SIZE = {
-    sm: "text-sm",
-    md: "text-base",
-    lg: "text-lg",
-};
-// v2: `rounded-[calc(theme(borderRadius.medium)*K)]` con `medium` = 12px → 6 / 7.2 / 8.4 px, y por
-// defecto el radio lo decidía `size` (sm→0.5, md→0.6, lg→0.7). El `::before` (relleno) lleva el
-// mismo radio porque aquí cubre el border-box completo (ver `CONTROL_BASE`).
-const RADIUS_CLASS = {
-    none: "rounded-none before:rounded-none",
-    sm: "rounded-[6px] before:rounded-[6px]",
-    md: "rounded-[7.2px] before:rounded-[7.2px]",
-    lg: "rounded-[8.4px] before:rounded-[8.4px]",
-    full: "rounded-full before:rounded-full",
-};
-const RADIUS_BY_SIZE = {
-    sm: "sm",
-    md: "md",
-    lg: "lg",
-};
-/**
- * Caja del control (slot `wrapper` de v2): borde de 2px en `--color-default` sin sombra
- * (`before:border-2 before:border-default`), y el relleno cubriendo la caja ENTERA al marcarse.
- *
- * En v3 el borde vive en el propio control (1px, `border-field-border`, `shadow-field`) y el
- * relleno es un `::before` a `inset-0`, que solo alcanza al padding-box: por eso v3 pone
- * `border-transparent` al marcarse y el relleno queda 1px por dentro. Con el borde de 2px de v2
- * eso dejaría un anillo de 2px: se lleva el `::before` al border-box (`-inset-0.5` = −2px) y se
- * quita el `overflow-hidden` de v3 para que no lo recorte. El `::before` es un descendiente
- * posicionado, así que pinta ENCIMA del borde y lo tapa, como el `after` de v2.
- *
- * Hover v2: `group-data-[hover=true]:before:bg-default-100` — tinte suave de la caja sin marcar
- * (en v3 la caja es el fondo del control, no un pseudo). `data-hovered` lo emite `Checkbox.Content`.
- *
- * Indeterminado: v3 pinta el fondo del control (dentro del borde). Se enciende también el
- * `::before` para que el relleno cubra la caja entera, igual que al marcar.
- */
-const CONTROL_BASE = [
-    "border-2 border-default shadow-none overflow-visible",
-    "before:-inset-0.5",
-    "group-data-[hovered=true]/content:bg-default-100",
-    "group-data-[indeterminate=true]/checkbox:before:scale-100",
-    "group-data-[indeterminate=true]/checkbox:before:opacity-100",
-].join(" ");
-// v2 (`lineThrough: true`, slot `label`): la raya crece de 0 al 100% al marcarse y la etiqueta se
-// atenúa al 60%. `data-selected` está en la raíz → `group-data-[…]/checkbox`.
-const LINE_THROUGH = [
-    "inline-flex items-center justify-center",
-    "before:absolute before:h-0.5 before:w-0 before:bg-foreground before:content-['']",
-    "group-data-[selected=true]/checkbox:opacity-60",
-    "group-data-[selected=true]/checkbox:before:w-full",
-].join(" ");
-// Los subcomponentes compound de v3, adjuntos como estáticos para que la API v3 siga funcionando
-// a través de la fachada (`<Checkbox><Checkbox.Control>…`).
+            };
+        case "faded":
+            return {
+                base: `border ${FLAT_BASE[color]} ${FADED_BORDER[color]}`,
+                description: defaultDescription,
+                iconWrapper: `${ICON_WRAPPER_TINTED} ${FLAT_ICON_WRAPPER[color]}`,
+                closeButton: FLAT_CLOSE[color],
+            };
+        default:
+            return {
+                base: FLAT_BASE[color],
+                description: defaultDescription,
+                iconWrapper: `${ICON_WRAPPER_TINTED} ${FLAT_ICON_WRAPPER[color]}`,
+                closeButton: FLAT_CLOSE[color],
+            };
+    }
+}
+// Los subcomponentes compound de v3, adjuntos como estáticos (`Alert.Indicator`…) para que el JSX
+// v3 (loginos ya migró el suyo) siga compilando y renderizando IGUAL que contra el `Alert` crudo.
 const COMPOUND_PARTS = new Set([
-    react.Checkbox.Control,
-    react.Checkbox.Indicator,
-    react.Checkbox.Content,
+    react.Alert.Indicator,
+    react.Alert.Content,
+    react.Alert.Title,
+    react.Alert.Description,
 ]);
-/** API compound de v3 detectada por hijos directos: la fachada no envuelve nada. */
+/**
+ * Detecta la API compound de v3: si algún hijo directo es `Alert.Indicator`/`Content`/`Title`/
+ * `Description`, el consumidor ya compone la estructura y la fachada NO debe envolver nada (si lo
+ * hiciera, saldrían dos indicadores). `<Alert>Texto</Alert>` (sin partes compound) sigue siendo
+ * API v2: children bajo la descripción, con icono y círculo, como en v2.
+ */
 function hasCompoundChildren(children) {
     return $8WNJc$react.Children.toArray(children).some((child) => $8WNJc$react.isValidElement(child) && COMPOUND_PARTS.has(child.type));
 }
+/** `isEmpty` de v2 (`@heroui/shared-utils`): null/undefined/"" no cuentan como contenido. */
+function hasValue$1(node) {
+    return node !== null && node !== undefined && node !== "" && node !== false;
+}
 /**
- * Checkbox - Casilla basada en HeroUI v3 con la API pública de v2 intacta (TECH-2459).
+ * Alert - Aviso contextual basado en HeroUI v3 con la API pública de v2 intacta (TECH-2459).
  *
- * - **API v2**: `children` como etiqueta, `isSelected`/`defaultSelected` + `onValueChange`
- *   (también `onChange`), `color`, `size`, `radius`, `lineThrough`, `icon`, `classNames`. Funciona
- *   dentro de `Controller` de react-hook-form (`isSelected={value} onValueChange={onChange}`).
- * - **API compound v3**: si los children traen `Checkbox.Control`/`Indicator`/`Content`, pasa tal
- *   cual a la raíz de HeroUI (con `onValueChange` seguido igualmente).
+ * Dos modos, decididos por los `children`:
+ * - **API v2** (`color`/`variant`/`title`/`description`/`isClosable`…): la fachada compone el
+ *   compound de v3 y repone `variant` (fondo teñido en `flat`), `radius`, el círculo del icono,
+ *   el botón de cerrar (`CloseButton` de v3 con `aria-label` traducido) y la visibilidad.
+ * - **API compound v3** (`<Alert status="danger"><Alert.Indicator/><Alert.Content>…`): pasa tal
+ *   cual al `Alert` de HeroUI; `color`, si viene, se traduce a `status`.
  */
-const CheckboxFacade = ({ children, onChange, onValueChange, color = "primary", size = "md", radius, lineThrough = false, icon, disableAnimation = false, isInvalid, classNames, className, ...rest }) => {
-    const handleChange = (isSelected) => {
-        onChange?.(isSelected);
-        onValueChange?.(isSelected);
-    };
+const AlertFacade = ({ color, status, variant = "flat", radius = "md", title, description, icon, hideIcon = false, hideIconWrapper = false, isClosable = false, onClose, isVisible: isVisibleProp, isDefaultVisible, onVisibleChange, startContent, endContent, classNames, className, children, translations = {}, ...rest }) => {
+    // `useControlledState` de v2 (`use-alert.ts`): controlado si llega `isVisible`; si no, estado
+    // propio que arranca en `isDefaultVisible ?? true` y se apaga al cerrar.
+    const [uncontrolledVisible, setUncontrolledVisible] = $8WNJc$react.useState(isDefaultVisible ?? true);
+    const isControlled = isVisibleProp !== undefined;
+    const isVisible = isControlled ? isVisibleProp : uncontrolledVisible;
+    const t = { ...DEFAULT_TRANSLATIONS, ...translations };
+    // `status` (v3) gana sobre `color` (v2) para la clase de estado de HeroUI; y si SOLO llega
+    // `status`, las utilidades de Aurora siguen el color equivalente (`accent` → `primary`).
+    const effectiveColor = color ?? (status ? COLOR_BY_STATUS[status] : "default");
+    const effectiveStatus = status ?? STATUS_BY_COLOR[effectiveColor];
+    if (!isVisible) {
+        return null;
+    }
     if (hasCompoundChildren(children)) {
-        return (jsxRuntime.jsx(react.Checkbox, { ...rest, isInvalid: isInvalid, onChange: handleChange, className: react.cn(classNames?.base, className), children: children }));
+        return (jsxRuntime.jsx(react.Alert, { ...rest, status: effectiveStatus, className: react.cn(classNames?.base, className), children: children }));
     }
-    const indicatorContent = typeof icon === "function"
-        ? (state) => icon({
-            isSelected: state.isSelected,
-            isIndeterminate: state.isIndeterminate,
-            isDisabled: state.isDisabled,
-        })
-        : icon;
-    const hasLabel = children !== undefined && children !== null && children !== false;
-    return (jsxRuntime.jsx(react.Checkbox, { ...rest, isInvalid: isInvalid, onChange: handleChange, 
-        // Base v2: `group relative max-w-fit inline-flex items-center justify-start cursor-pointer
-        // p-2 -m-2 select-none` (el `p-2 -m-2` es el área de pulsado ampliada de v2). v3
-        // (`.checkbox`) usa `flex flex-col items-start` para apilar `Description`/`FieldError`,
-        // slots que esta fachada no renderiza; en **inline** la caja participa de la línea de
-        // texto, donde la esperan los consumidores (mismo criterio que la fachada `Switch`).
-        className: react.cn("group/checkbox relative -m-2 inline-flex max-w-fit flex-row items-center p-2", classNames?.base, className), children: jsxRuntime.jsxs(react.Checkbox.Content, { className: "group/content gap-2 font-normal", children: [jsxRuntime.jsx(react.Checkbox.Control, { className: react.cn(CONTROL_BASE, CONTROL_SIZE[size], RADIUS_CLASS[radius ?? RADIUS_BY_SIZE[size]], CONTROL_COLOR[color], 
-                    // v2 `isInvalid`: `before:border-danger` (el borde vivía en el pseudo).
-                    isInvalid && "border-danger", disableAnimation && "transition-none before:transition-none", classNames?.wrapper), children: jsxRuntime.jsx(react.Checkbox.Indicator, { className: react.cn(INDICATOR_SIZE[size], INDICATOR_COLOR[color], disableAnimation && "[&_svg]:transition-none", classNames?.icon), children: indicatorContent }) }), hasLabel && (
-                // Slot `label` de v2: `relative text-foreground select-none` + tamaño de texto.
-                // `data-slot="label"` para que las reglas de cursor/selección de `.checkbox` de v3
-                // le alcancen igual que a un `<Label>`.
-                jsxRuntime.jsx("span", { "data-slot": "label", className: react.cn("relative select-none text-foreground", LABEL_SIZE[size], lineThrough && LINE_THROUGH, isInvalid && "text-danger", classNames?.label), children: children }))] }) }));
+    const handleClose = () => {
+        if (!isControlled) {
+            setUncontrolledVisible(false);
+        }
+        onVisibleChange?.(false);
+        onClose?.();
+    };
+    const slots = slotClasses(variant, effectiveColor);
+    const hasTitle = hasValue$1(title);
+    const hasDescription = hasValue$1(description);
+    // `hasContent` de v2: sin descripción ni children, el título se centra verticalmente con el icono.
+    const hasContent = hasDescription || hasValue$1(children);
+    const showClose = isClosable || Boolean(onClose);
+    return (jsxRuntime.jsxs(react.Alert, { role: "alert", "data-visible": "true", "data-closeable": showClose ? "true" : undefined, "data-has-title": hasTitle ? "true" : undefined, "data-has-description": hasDescription ? "true" : undefined, ...rest, status: effectiveStatus, 
+        // Base v2: `flex flex-grow flex-row w-full items-start py-3 px-4 gap-x-1`. v3 ya trae
+        // flex/w-full/items-start/px-4/py-3; se repone el `gap-x-1` (v3: `gap-4`), se quita el
+        // `shadow-surface` (v2 no tenía sombra en el base) y se aplica variant/radius.
+        className: react.cn("grow gap-x-1 shadow-none", slots.base, RADIUS_CLASS[radius], hideIconWrapper && "gap-x-0", classNames?.base, className), children: [startContent, !hideIcon && (jsxRuntime.jsx(react.Alert.Indicator, { className: react.cn(ICON_WRAPPER_BASE, 
+                // v2 `hideIconWrapper`: `!bg-transparent !shadow-none !border-none` — se omiten
+                // las clases teñidas en vez de pisarlas, porque `bg-transparent` no borraría el
+                // `dark:bg-*` (grupo distinto para tailwind-merge).
+                hideIconWrapper ? "bg-transparent" : slots.iconWrapper, classNames?.iconWrapper), children: icon !== undefined && icon !== null ? (classNames?.alertIcon ? (
+                // `alertIcon` de v2 se aplicaba al propio SVG; aquí solo alcanza al icono
+                // personalizado (el de v3 por defecto se renderiza dentro del indicador).
+                jsxRuntime.jsx("span", { className: classNames.alertIcon, children: icon })) : (icon)) : undefined })), jsxRuntime.jsxs(react.Alert.Content, { className: react.cn("ms-2 box-border min-h-10 justify-center text-inherit", !hasContent && "items-center", classNames?.mainWrapper), children: [hasTitle && (
+                    // v2: `text-small w-full font-medium block text-inherit leading-5`; v3 (`.alert__title`)
+                    // pone `leading-6` y el color del estado — `text-inherit` devuelve el de v2.
+                    jsxRuntime.jsx(react.Alert.Title, { className: react.cn("w-full leading-5 text-inherit", classNames?.title), children: title })), hasDescription && (
+                    // v2: `pl-[1px] text-small font-normal text-inherit`; v3 (`.alert__description`) pone
+                    // `text-muted`.
+                    jsxRuntime.jsx(react.Alert.Description, { className: react.cn("pl-px font-normal text-inherit", slots.description, classNames?.description), children: description })), children] }), endContent, showClose && (jsxRuntime.jsx(react.CloseButton, { "aria-label": t.closeButtonAriaLabel, className: react.cn(CLOSE_BASE, slots.closeButton, classNames?.closeButton), onPress: handleClose }))] }));
 };
-CheckboxFacade.displayName = "Aurora.Checkbox";
+AlertFacade.displayName = "Aurora.Alert";
 /**
- * `Checkbox` de Aurora: fachada v2 + estáticos compound de v3 (`Checkbox.Control`,
- * `Checkbox.Indicator`, `Checkbox.Content`), los mismos objetos que exporta `@heroui/react`.
+ * `Alert` de Aurora: fachada v2 + estáticos compound de v3 (`Alert.Indicator`, `Alert.Content`,
+ * `Alert.Title`, `Alert.Description`), los mismos objetos que exporta `@heroui/react`.
  */
-const Checkbox = Object.assign(CheckboxFacade, {
-    Control: react.Checkbox.Control,
-    Indicator: react.Checkbox.Indicator,
-    Content: react.Checkbox.Content,
+const Alert = Object.assign(AlertFacade, {
+    Indicator: react.Alert.Indicator,
+    Content: react.Alert.Content,
+    Title: react.Alert.Title,
+    Description: react.Alert.Description,
 });
 
+const OMIT$1 = new Set(["children", "className", "type"]);
+const CONCAT = new Set(["aria-describedby", "aria-labelledby"]);
+function mergeRefs$1(...refs) {
+    return (value) => {
+        for (const ref of refs) {
+            if (typeof ref === "function") {
+                ref(value);
+            }
+            else if (ref) {
+                ref.current = value;
+            }
+        }
+    };
+}
+function mergeTriggerProps$1(trigger, child) {
+    const merged = { ...trigger, ...child };
+    for (const key of Object.keys(trigger)) {
+        const a = trigger[key];
+        const b = child[key];
+        if (/^on[A-Z]/.test(key) &&
+            typeof a === "function" &&
+            typeof b === "function") {
+            merged[key] = (...args) => {
+                a(...args);
+                b(...args);
+            };
+        }
+        else if (CONCAT.has(key) && a && b) {
+            merged[key] = `${a} ${b}`;
+        }
+        else if (b === undefined) {
+            merged[key] = a;
+        }
+    }
+    return merged;
+}
+/** ¿Se puede clonar como trigger? Un único elemento que no sea Fragment. */
+function isClonableTriggerChild(children) {
+    return $8WNJc$react.isValidElement(children) && children.type !== $8WNJc$react.Fragment;
+}
+/**
+ * `render` para `Dropdown.Trigger`: clona las props resueltas del `<button>` de v3 sobre `child`.
+ * `triggerClassName` es el `className` que la app puso en el propio `DropdownTrigger`.
+ */
+function renderDropdownTrigger(child, triggerClassName) {
+    return (buttonProps) => {
+        const { ref, ...rest } = buttonProps;
+        const triggerProps = {};
+        for (const [key, value] of Object.entries(rest)) {
+            if (OMIT$1.has(key) || key.startsWith("data-")) {
+                continue;
+            }
+            triggerProps[key] = value;
+        }
+        const hostTag = typeof child.type === "string" ? child.type : null;
+        if (hostTag === "button") {
+            triggerProps.type = rest.type;
+        }
+        else if (hostTag && hostTag !== "a") {
+            triggerProps.role = "button";
+            triggerProps.tabIndex = 0;
+        }
+        const childRef = (Number.parseInt($8WNJc$react.version, 10) < 19
+            ? child.ref
+            : child.props.ref);
+        const childClass = child.props.className;
+        const className = triggerClassName && typeof childClass !== "function"
+            ? react.cn(triggerClassName, childClass)
+            : childClass;
+        return $8WNJc$react.cloneElement(child, {
+            ...mergeTriggerProps$1(triggerProps, child.props),
+            ...(className === undefined ? {} : { className }),
+            ref: mergeRefs$1(childRef, ref),
+        });
+    };
+}
+
 // TECH-2459 — Fachada `Dropdown` / `DropdownSection`: repone la CABECERA DE SECCIÓN que la
 // migración a v3 dejó sin vía legal desde una app.
 //
@@ -14742,15 +16630,153 @@ const OWN_POPOVER = new Set([
 function isPart$1(node, parts) {
     return $8WNJc$react.isValidElement(node) && parts.has(node.type);
 }
-const DropdownFacade = ({ children, ...props }) => {
-    const nodes = $8WNJc$react.Children.toArray(children);
+function isFragment(node) {
+    return $8WNJc$react.isValidElement(node) && node.type === $8WNJc$react.Fragment;
+}
+/**
+ * `Children.toArray` aplana arrays pero NO Fragments (un `<>…</>` cuenta como UN nodo). Esto baja
+ * por ellos, y prefija la `key` de cada hijo con la del Fragment para que dos Fragments hermanos
+ * no produzcan claves repetidas (`toArray` numera cada nivel desde `.0`).
+ */
+function flatten(children, prefix = "") {
+    return $8WNJc$react.Children.toArray(children).flatMap((node) => {
+        if (isFragment(node)) {
+            return flatten(node.props.children, `${prefix}${String(node.key)}`);
+        }
+        if (prefix && $8WNJc$react.isValidElement(node)) {
+            return [$8WNJc$react.cloneElement(node, { key: `${prefix}${String(node.key)}` })];
+        }
+        return [node];
+    });
+}
+/**
+ * Mapea el árbol conservando su forma: atraviesa Fragments (se reconstruyen con sus hijos
+ * mapeados) y aplica `fn` al resto de nodos. Para el caso en el que el popover es del consumidor:
+ * no hay que mover nada de sitio, solo completar props.
+ */
+function mapTree(children, fn) {
+    return $8WNJc$react.Children.toArray(children).map((node) => isFragment(node)
+        ? $8WNJc$react.cloneElement(node, undefined, ...mapTree(node.props.children, fn))
+        : fn(node));
+}
+/**
+ * Traducción de colocación v2 → v3, copiada del oráculo, no deducida: `@heroui/aria-utils@2.2.29`
+ * → `dist/chunk-WQVQ7P2I.mjs:53-69` (`toReactAriaPlacement`), que es lo que el `Popover` de v2
+ * hacía con la prop antes de dársela a react-aria. Ojo a los laterales: `left-start` NO es
+ * `"left start"` (no existe en react-aria) sino `"left top"`.
+ */
+const V2_TO_V3_PLACEMENT = {
+    top: "top",
+    bottom: "bottom",
+    left: "left",
+    right: "right",
+    "top-start": "top start",
+    "top-end": "top end",
+    "bottom-start": "bottom start",
+    "bottom-end": "bottom end",
+    "left-start": "left top",
+    "left-end": "left bottom",
+    "right-start": "right top",
+    "right-end": "right bottom",
+};
+/** v2 → v3; lo que ya viene en sintaxis de v3 pasa tal cual. */
+function toV3Placement(placement) {
+    return (V2_TO_V3_PLACEMENT[placement] ??
+        placement);
+}
+/** Solo las claves que el consumidor escribió: `undefined` no pisa nada. */
+function definedOnly(values) {
+    return Object.fromEntries(Object.entries(values).filter(([, value]) => value !== undefined));
+}
+/**
+ * `closeOnSelect` de v2 → `shouldCloseOnSelect` del `Menu` de v3. Precedencia, la de v2
+ * (`@heroui/dropdown@2.3.32` → `dist/chunk-HT5XYLWZ.mjs`, `getCloseOnSelect`): lo del menú gana a
+ * lo del root. Del menú se lee `shouldCloseOnSelect` (v3) y, si no, `closeOnSelect` (v2: 6 de los
+ * 20 `<DropdownMenu>` de beweossmbs lo escriben en el MENÚ, no en el root, y el `Menu` de v3 lo
+ * ignora — sin esto, un multiselect se cerraba en cada clic). El `closeOnSelect` se retira del
+ * elemento: v3 no lo conoce.
+ */
+function withCloseOnSelect(node, rootCloseOnSelect) {
+    if (!isPart$1(node, INSIDE_POPOVER)) {
+        return node;
+    }
+    const menu = node;
+    const { closeOnSelect, shouldCloseOnSelect } = menu.props;
+    const resolved = shouldCloseOnSelect ?? closeOnSelect ?? rootCloseOnSelect;
+    if (resolved === undefined && !("closeOnSelect" in menu.props)) {
+        return node;
+    }
+    const { closeOnSelect: _dropped, ...rest } = menu.props;
+    return $8WNJc$react.createElement(menu.type, {
+        ...rest,
+        key: menu.key,
+        shouldCloseOnSelect: resolved,
+    });
+}
+/**
+ * `<DropdownTrigger><Button/></DropdownTrigger>` de v2 → UN botón, el de la app, con las props del
+ * trigger de v3 clonadas encima vía su `render` (ver `_internal/renderTrigger.tsx`). Sin esto v3
+ * pinta dos `<button>` anidados. Se deja el trigger de v3 tal cual si el consumidor ya pasa su
+ * propio `render`, o si el hijo no es UN elemento (texto, Fragment, función de render props):
+ * entonces el `<button>` de v3 es el trigger, que es lo correcto.
+ *
+ * Medido en beweossmbs `origin/staging` (f6d5be1c2): 20 `<DropdownTrigger>`, 19 con un `<Button>`
+ * de hijo directo y 1 con `{trigger || defaultTrigger}` (también un `Button` en ejecución).
+ */
+function withClonedTrigger(node) {
+    if (!$8WNJc$react.isValidElement(node) || node.type !== react.Dropdown.Trigger) {
+        return node;
+    }
+    const trigger = node;
+    const { children, render, className } = trigger.props;
+    if (render !== undefined || !isClonableTriggerChild(children)) {
+        return node;
+    }
+    return $8WNJc$react.cloneElement(trigger, {
+        render: renderDropdownTrigger(children, typeof className === "string" ? className : undefined),
+    });
+}
+const DropdownFacade = ({ children, placement, offset, crossOffset, shouldFlip, containerPadding, closeOnSelect, shouldCloseOnScroll: _noEffectInV3, className, classNames, ...props }) => {
+    const overrides = definedOnly({
+        placement: placement === undefined ? undefined : toV3Placement(placement),
+        offset,
+        crossOffset,
+        shouldFlip,
+        containerPadding,
+    });
+    // v2: `base` (caja exterior), luego `content` + `className` (caja interior); en v3 es una sola
+    // caja, así que van juntas y en ese orden. `cn` funde conflictos entre ellas; frente a la clase
+    // de v3 (`.dropdown__popover`, capa `components`) cualquier utilidad ya gana por capa.
+    const popoverClass = react.cn(classNames?.base, classNames?.content, className) || undefined;
+    const menuWithClose = (node) => withCloseOnSelect(node, closeOnSelect);
+    const nodes = flatten(children);
+    // El popover es del consumidor: se respeta su árbol entero y se le COMPLETA lo que no dijo
+    // (lo que sí dijo manda). Los menús dentro de él reciben el `closeOnSelect` igualmente.
+    if (nodes.some((node) => isPart$1(node, OWN_POPOVER))) {
+        const fillPopover = (node) => {
+            if (!$8WNJc$react.isValidElement(node) || node.type !== react.Dropdown.Popover) {
+                return node;
+            }
+            const own = node;
+            const missing = Object.fromEntries(Object.entries(overrides).filter(([key]) => own.props[key] === undefined));
+            const ownClass = own.props.className;
+            return $8WNJc$react.cloneElement(own, {
+                ...missing,
+                ...(popoverClass && typeof ownClass !== "function"
+                    ? { className: react.cn(popoverClass, ownClass) }
+                    : {}),
+            }, ...mapTree(own.props.children, menuWithClose));
+        };
+        return (jsxRuntime.jsx(react.Dropdown, { ...props, children: mapTree(children, (node) => fillPopover(withClonedTrigger(node))) }));
+    }
     const menus = nodes.filter((node) => isPart$1(node, INSIDE_POPOVER));
-    // Nada que envolver (sin hijos, `children` como función, un popover ya montado a mano, o
-    // simplemente ningún menú suelto): el root tal cual, byte a byte como el crudo de v3.
-    if (menus.length === 0 || nodes.some((node) => isPart$1(node, OWN_POPOVER))) {
-        return jsxRuntime.jsx(react.Dropdown, { ...props, children: children });
+    // Nada que envolver (sin hijos o ningún menú suelto): el root tal cual, como el crudo de v3.
+    if (menus.length === 0) {
+        return (jsxRuntime.jsx(react.Dropdown, { ...props, children: mapTree(children, withClonedTrigger) }));
     }
-    return (jsxRuntime.jsxs(react.Dropdown, { ...props, children: [nodes.filter((node) => !isPart$1(node, INSIDE_POPOVER)), jsxRuntime.jsx(react.Dropdown.Popover, { offset: 7, placement: "bottom", children: menus })] }));
+    return (jsxRuntime.jsxs(react.Dropdown, { ...props, children: [nodes
+                .filter((node) => !isPart$1(node, INSIDE_POPOVER))
+                .map(withClonedTrigger), jsxRuntime.jsx(react.Dropdown.Popover, { offset: 7, placement: "bottom", ...overrides, className: popoverClass, children: menus.map(menuWithClose) })] }));
 };
 DropdownFacade.displayName = "Aurora.Dropdown";
 /**
@@ -14793,9 +16819,12 @@ const Dropdown = Object.assign(DropdownFacade, {
 //   | beweosagency      | 5        | 5             | 5                      | 14   | **0**              | la seleccionada sin píldora |
 //   | backoffice-beweos | 5        | 5             | 5                      | 18   | 18 (a mano)        | bien |
 //   | beweanalytics     | 3        | 3             | 3                      | 8    | 8 (a mano)         | bien |
-//   | beweossmbs / loginos / linda-business | 0 | 0 | 0                  | 0    | 0                  | no usan tabs |
+//   | beweossmbs / loginos / linda-business | 0 | 0 | 0                  | 0    | 0                  | no usan la forma v3 |
 //
 // (conteo de tags de APERTURA; beweanalytics escribe `Tab` suelto en vez de `Tabs.Tab`.)
+// Corrección del 23-sep: esa última fila solo contaba la forma v3. Las apps SIN migrar sí usan
+// tabs, y todas en la forma v2 (`<Tab key title>` suelto): beweossmbs 42 raíces, chatbot-claw 1,
+// linda-business 1. Esa forma la cubre la rama v2 del root, más abajo.
 // Dos lecturas que salen de esta tabla y que deciden el diseño:
 //   · **26 indicadores montados a mano** contra 14 que faltan. La idempotencia no es un adorno:
 //     sin ella esas 26 pestañas se quedarían con DOS indicadores.
@@ -14900,7 +16929,12 @@ function hasIndicator(children) {
         return node.type === $8WNJc$react.Fragment && hasIndicator(node.props.children);
     });
 }
-const TabFacade = ({ children, ...props }) => {
+const TabFacade = ({ children: ownChildren, title, 
+// `titleValue` es de v2 y no tiene destino en v3: se consume para que no llegue al DOM.
+titleValue: _titleValue, ...props }) => {
+    // En la forma v3 la etiqueta son los `children`; si solo viene el `title` de v2 (un `Tab` con
+    // `title` dentro de `Tabs.List`), hace de etiqueta. Con los dos, mandan los `children`.
+    const children = ownChildren ?? title;
     // `children` como función es la forma de render props de react-aria (`TabRenderProps`). No se
     // puede inspeccionar, y menos aún combinar con un hermano —React rechaza una función como
     // hijo junto a un elemento—, así que se pasa tal cual. Un consumidor que la use monta el
@@ -14941,7 +16975,179 @@ const Tab = TabFacade;
 const INSIDE_CONTAINER = new Set([react.Tabs.List]);
 /** Si el consumidor ya monta el contenedor, la fachada no envuelve nada. */
 const OWN_CONTAINER = new Set([react.Tabs.ListContainer]);
-const TabsFacade = ({ children, ...props }) => {
+// ---------------------------------------------------------------------------------------------
+// Forma v2: `<Tabs …><Tab key="x" title="X">panel</Tab></Tabs>`
+// ---------------------------------------------------------------------------------------------
+//
+// Las apps que faltan por migrar escriben SOLO esta forma (inventario con el parser de TypeScript
+// sobre `git show`, 23-sep: beweossmbs `origin/staging` 42 raíces, chatbot-claw
+// `origin/feat/TECH-3586/linda-claw` 1, linda-business `origin/staging` 1 — 44 raíces, 97 `Tab`,
+// todos con `key` y `title`, 39 con hijos = panel, 0 `Tabs.List`). En v3 esa forma no monta:
+// `Tab === Tabs.Tab` es un item de colección y fuera de `Tabs.List` react-aria lanza «cannot be
+// rendered outside a collection». La fachada la reescribe a la forma COMPLETA de v3:
+//
+//   Tabs (root)
+//   ├─ div data-slot="tabs-base"             ← el `base` de v2: `classNames.base` + `className`
+//   │  └─ Tabs.ListContainer                 ← el carril (sin él la píldora no se ve, ver arriba)
+//   │     └─ Tabs.List  aria-label del root  ← `classNames.tabList`, `role="tablist"`
+//   │        └─ Tabs.Tab id = key del Tab    ← `classNames.tab` + `className` del Tab
+//   │           ├─ Tabs.Indicator            ← `classNames.cursor` (UNO por tab; v3 solo pinta el activo)
+//   │           └─ title
+//   └─ Tabs.Panel id = key (solo los Tab con hijos) ← `classNames.panel` + `className` del Tab
+//
+// Oráculo v2: `@heroui/tabs@2.2.29` `dist/tabs.js` y `@heroui/theme@2.4.15`
+// `dist/components/tabs.js` (npm pack, no de memoria). De ahí sale cada destino:
+//   · `className` del root → `slots.base` junto a `classNames.base` (`tabs.js:88,114`), y `base`
+//     envuelve SOLO la tira: los paneles son sus hermanos (`tabs.js:414-430`).
+//   · `className` del Tab → la pestaña (`cn(classNames.tab, className)`, `tabs.js:207`) Y su panel
+//     (`cn(classNames.panel, …, selectedItem.props.className)`, `tabs.js:282`).
+//   · `classNames.cursor` → el `<span>` de la píldora (`tabs.js:145`), que en v3 es el indicador.
+//   · Un Tab sin hijos NO genera panel (`if (!content) return null`, `tabs.js:284`).
+//
+// Las clases de la app van SIEMPRE en última posición de un `cn` (tailwind-merge): el `tv` de v2
+// corría con `twMerge: true`, así que su clase borraba la de la librería, y aquí igual — la
+// concatenación simple es el defecto ya medido en otras fachadas (la clase de la app perdía).
+/** Los dos nombres por los que una app llega a un `Tab`: la fachada y, por si acaso, el crudo. */
+const TAB_TYPES = new Set([TabFacade, react.Tabs.Tab]);
+/** Presencia de cualquiera de estas piezas = la app ya escribe la forma v3. */
+const V3_LIST_TYPES = new Set([
+    react.Tabs.List,
+    react.Tabs.ListContainer,
+]);
+/**
+ * Los `Tab` sueltos del root, en orden, **con su `key` original**.
+ *
+ * Se recorre con `Children.forEach` y no con `Children.toArray` a propósito: `toArray` REESCRIBE
+ * las claves (`"all"` → `".$all"`) y la clave es justo lo que se necesita, porque en v2 es el
+ * identificador que recibe `onSelectionChange` y que la app compara con su `selectedKey`.
+ * `forEach` entrega cada hijo tal cual (comprobado: `key` intacta) y aplana arrays, o sea los
+ * `.map()` y los `{cond && <Tab/>}` (los `false`/`null` se descartan). Los Fragments no los
+ * aplana nadie, así que se desciende a mano — como en `hasIndicator`.
+ */
+function collectV2Tabs(children, out = []) {
+    $8WNJc$react.Children.forEach(children, (node) => {
+        if (!$8WNJc$react.isValidElement(node)) {
+            return;
+        }
+        if (node.type === $8WNJc$react.Fragment) {
+            collectV2Tabs(node.props.children, out);
+        }
+        else if (TAB_TYPES.has(node.type)) {
+            out.push(node);
+        }
+    });
+    return out;
+}
+/** ¿Hay un `Tabs.List` / `Tabs.ListContainer` entre los hijos (descendiendo por Fragments)? */
+function hasV3List(children) {
+    let found = false;
+    $8WNJc$react.Children.forEach(children, (node) => {
+        if (found || !$8WNJc$react.isValidElement(node)) {
+            return;
+        }
+        found =
+            V3_LIST_TYPES.has(node.type) ||
+                (node.type === $8WNJc$react.Fragment && hasV3List(node.props.children));
+    });
+    return found;
+}
+/** v2 `underlined` es la línea inferior → `secondary` de v3; el resto de v2 → `primary` (default). */
+function toV3Variant(variant) {
+    if (variant === "primary" || variant === "secondary") {
+        return variant;
+    }
+    return variant === "underlined" ? "secondary" : undefined;
+}
+/** ¿El `Tab` de v2 trae contenido de panel? Mismo criterio que `if (!content)` de v2. */
+function hasPanelContent(children) {
+    return typeof children === "function" || $8WNJc$react.Children.count(children) > 0;
+}
+const TabsFacade = (allProps) => {
+    const { children, classNames, className, variant, fullWidth, items, isVertical, placement, orientation, destroyInactiveTabPanel = true, 
+    // Sin equivalente en v3: se consumen para que no lleguen al DOM (ver README, «Props v2»).
+    size: _size, radius: _radius, color: _color, disableAnimation: _disableAnimation, disableCursorAnimation: _disableCursorAnimation, shouldSelectOnPressUp: _shouldSelectOnPressUp, ...rest } = allProps;
+    const v3Variant = toV3Variant(variant);
+    const v3Orientation = orientation ??
+        (isVertical || placement === "start" || placement === "end"
+            ? "vertical"
+            : undefined);
+    // Forma v2 dinámica: `items` + `children` como función `(item) => <Tab key=…/>`.
+    const dynamic = typeof children === "function";
+    const v2Tabs = dynamic
+        ? Array.from(items ?? [], (item, index) => {
+            const element = children(item);
+            const fallback = item.key ?? item.id ?? index;
+            return element.key == null
+                ? { element, key: String(fallback) }
+                : { element, key: element.key };
+        })
+        : hasV3List(children)
+            ? []
+            : collectV2Tabs(children).map((element, index) => ({
+                element,
+                key: element.key ?? String(index),
+            }));
+    if (v2Tabs.length > 0) {
+        const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, "aria-describedby": ariaDescribedby, ...rootProps } = rest;
+        const tabs = v2Tabs.map(({ element, key }) => {
+            const { id, title, titleValue: _titleValue, className: tabClassName, children: panel, ...tabProps } = element.props;
+            return {
+                id: id ?? key,
+                title,
+                tabClassName,
+                panel,
+                tabProps,
+            };
+        });
+        // EL `base` DE v2: un div que envuelve SOLO la tira. Ahí van `className`, `classNames.base` y
+        // el `w-full` de `fullWidth`, no al root. En v2 los paneles eran HERMANOS de `base`, fuera de
+        // él (`tabs.js`: `<div {...getBaseProps()}><tabList/></div>` y luego los paneles), y en v3
+        // el root envuelve tira + paneles. Mandarlas al root cambiaba dos pantallas de beweossmbs
+        // sin que la app tocara nada: `service-detail.page.tsx` (`mb-4` debajo del bloque en vez de
+        // entre tira y panel) y `whatsapp-campaign-full.page.tsx` (`flex justify-center` dejaba de
+        // centrar la tira).
+        //
+        // Por qué un div propio y no el `Tabs.ListContainer`: el contenedor ES el carril gris, así
+        // que un `w-full` o un `justify-center` de la app lo estirarían a todo el ancho. En v2 esa
+        // clase caía en un envoltorio `inline-flex` y la tira (el carril de v2) seguía midiendo su
+        // contenido. Este div es `flex`: el carril es un item de fila y mide su contenido, igual.
+        // El scroller sigue funcionando por el `max-width: 100%` de `neutralize-v3.css`, que acota
+        // el mínimo automático del item.
+        //
+        // El precio de meter un nodo entre el root y el carril: TODAS las reglas de la variante
+        // `secondary` de v3 cuelgan de un combinador de hijo DIRECTO
+        // (`.tabs--secondary > .tabs__list-container` y
+        // `.tabs--secondary[data-orientation=…] > .tabs__list-container`, `tabs.css:234-282`), y
+        // 5 pantallas de smbs llegan a ella por `variant="underlined"`. Por eso el div repite el
+        // modificador y el `data-orientation` del root: esos selectores casan con div > carril (el
+        // test lo comprueba con `matches()` sobre los selectores literales). `.tabs--secondary` no
+        // tiene reglas propias, solo las de hijo directo, así que repetirlo no pinta nada en el div.
+        // La única regla que deja de aplicarse es
+        // `.tabs[data-orientation="horizontal"] > .tabs__list-container { align-self: start }` de
+        // neutralize, que no hace falta: dentro de una fila el carril ya mide su contenido.
+        const orientationAttr = v3Orientation ?? "horizontal";
+        return (jsxRuntime.jsxs(react.Tabs, { ...rootProps, orientation: v3Orientation, variant: v3Variant, children: [jsxRuntime.jsx("div", { className: react.cn("flex", v3Variant === "secondary" && "tabs--secondary", fullWidth && "w-full", classNames?.base, className), "data-orientation": orientationAttr, "data-slot": "tabs-base", children: jsxRuntime.jsx(react.Tabs.ListContainer, { className: react.cn(fullWidth && "w-full"), children: jsxRuntime.jsx(react.Tabs.List, { "aria-describedby": ariaDescribedby, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, className: react.cn(classNames?.tabList), children: tabs.map(({ id, title, tabClassName, tabProps }) => ($8WNJc$react.createElement(react.Tabs.Tab, { ...tabProps, className: react.cn(classNames?.tab, tabClassName), id: id, key: id },
+                                jsxRuntime.jsx(react.Tabs.Indicator, { className: react.cn(classNames?.cursor) }),
+                                classNames?.tabContent ? (jsxRuntime.jsx("span", { className: classNames.tabContent, children: title })) : (title)))) }) }) }), tabs
+                    .filter(({ panel }) => hasPanelContent(panel))
+                    .map(({ id, panel, tabClassName }) => (jsxRuntime.jsx(react.Tabs.Panel, { className: react.cn(classNames?.panel, tabClassName), id: id, shouldForceMount: !destroyInactiveTabPanel || undefined, children: typeof panel === "function" ? null : panel }, id)))] }));
+    }
+    // Forma v3 (o nada que traducir): el camino de siempre. Solo se traducen las props de v2 que
+    // tienen equivalente, para que una app a medio migrar no las pierda.
+    // Sin `fullWidth` ni `classNames.base` el `className` pasa INTACTO (sin `cn`), igual que antes
+    // de existir la forma v2: `cn` deduplica y reordena, y aquí no hay nada con qué fusionarlo.
+    const v3Children = dynamic ? null : children;
+    const v3Props = {
+        ...rest,
+        className: fullWidth || classNames?.base
+            ? react.cn(fullWidth && "w-full", classNames?.base, className)
+            : className,
+        orientation: v3Orientation,
+        variant: v3Variant,
+    };
+    return jsxRuntime.jsx(TabsV3, { ...v3Props, children: v3Children });
+};
+const TabsV3 = ({ children, ...props }) => {
     const nodes = $8WNJc$react.Children.toArray(children);
     const needsContainer = nodes.some((node) => isPart(node, INSIDE_CONTAINER)) &&
         !nodes.some((node) => isPart(node, OWN_CONTAINER));
@@ -15004,6 +17210,87 @@ const Tabs = Object.assign(TabsFacade, {
     Tab: TabFacade,
 });
 
+const OMIT = new Set([
+    "role",
+    "tabIndex",
+    "className",
+    "data-slot",
+    "children",
+]);
+function mergeRefs(...refs) {
+    return (value) => {
+        for (const ref of refs) {
+            if (typeof ref === "function") {
+                ref(value);
+            }
+            else if (ref) {
+                ref.current = value;
+            }
+        }
+    };
+}
+/** `mergeProps` de v2: handlers `on*` encadenados (trigger → hijo), el resto gana el hijo. */
+function mergeTriggerProps(trigger, child) {
+    const merged = { ...trigger, ...child };
+    for (const key of Object.keys(trigger)) {
+        const a = trigger[key];
+        const b = child[key];
+        if (/^on[A-Z]/.test(key) &&
+            typeof a === "function" &&
+            typeof b === "function") {
+            merged[key] = (...args) => {
+                a(...args);
+                b(...args);
+            };
+        }
+        else if (key === "aria-describedby" && a && b) {
+            merged[key] = `${a} ${b}`;
+        }
+        else if (b === undefined) {
+            merged[key] = a;
+        }
+    }
+    return merged;
+}
+function renderTooltipTrigger(children) {
+    return (divProps) => {
+        const { ref, ...rest } = divProps;
+        const triggerProps = {};
+        for (const [key, value] of Object.entries(rest)) {
+            if (!OMIT.has(key)) {
+                triggerProps[key] = value;
+            }
+        }
+        const single = $8WNJc$react.Children.count(children) === 1 && $8WNJc$react.isValidElement(children);
+        if (single && children.type !== $8WNJc$react.Fragment) {
+            const child = children;
+            const childRef = (Number.parseInt($8WNJc$react.version, 10) < 19
+                ? child.ref
+                : child.props.ref);
+            return $8WNJc$react.cloneElement(child, {
+                ...mergeTriggerProps(triggerProps, child.props),
+                ref: mergeRefs(childRef, ref),
+            });
+        }
+        return (jsxRuntime.jsx("div", { ...triggerProps, ref: ref, className: rest.className, "data-slot": "tooltip-trigger", children: children }));
+    };
+}
+
+/**
+ * `color` de v2 (`@heroui/theme@2.4.15`, `popover` → `colorVariants.solid`): fondo y texto del
+ * color en la caja, y la flecha del mismo color (v2 la pintaba con `before:bg-*`; en v3 es un SVG
+ * con `fill: var(--overlay)`, así que se pisa su `fill`). `default` no añade nada: se ve como v3
+ * (§9.1). Clases LITERALES — Tailwind 4 solo genera lo que está escrito en el fuente.
+ */
+const COLOR_CLASSES = {
+    default: "",
+    foreground: "bg-foreground text-background [&_[data-slot=overlay-arrow]]:fill-foreground",
+    primary: "bg-primary text-primary-foreground [&_[data-slot=overlay-arrow]]:fill-primary",
+    secondary: "bg-secondary text-secondary-foreground [&_[data-slot=overlay-arrow]]:fill-secondary",
+    success: "bg-success text-success-foreground [&_[data-slot=overlay-arrow]]:fill-success",
+    warning: "bg-warning text-warning-foreground [&_[data-slot=overlay-arrow]]:fill-warning",
+    danger: "bg-danger text-danger-foreground [&_[data-slot=overlay-arrow]]:fill-danger",
+};
 /**
  * Tooltip - Componente BeweOS basado en HeroUI.
  *
@@ -15019,7 +17306,11 @@ const Tabs = Object.assign(TabsFacade, {
 const Tooltip = ({ enableTapOnTouch = true, touchPlacement = "top", placement, offset, showArrow = false, content, isOpen, defaultOpen, onOpenChange, isDisabled, 
 // v3 cambia el default de 0 (v2) a 700 — se mantiene 0 para no regresionar el
 // comportamiento instantáneo que ya tenía v2 (ver Tooltip.types.ts).
-delay = 0, closeDelay, trigger, className, children, }) => {
+delay = 0, closeDelay, trigger, className, classNames, color = "default", children, }) => {
+    // v3 tiene un solo nodo donde v2 tenía `base` + `content` (ver `TooltipClassNames`). Orden de
+    // v2: color → `classNames` → `className`; `cn` fusiona para que la clase de la app gane.
+    const contentClassName = react.cn(COLOR_CLASSES[color] ?? "", classNames?.base, classNames?.content, className);
+    const arrow = showArrow && (jsxRuntime.jsx(react.Tooltip.Arrow, { className: classNames?.arrow }));
     // Detección táctil: NO basta con `(hover: none)`. Muchos móviles (p.ej.
     // Android) reportan `(hover: hover)` y `(hover: none)` da false, dejando el
     // tap sin activar. Se combina con `(pointer: coarse)` (coincide si cualquiera
@@ -15057,7 +17348,7 @@ delay = 0, closeDelay, trigger, className, children, }) => {
     }, [tapMode, open, setOpen]);
     // Desktop (o tap deshabilitado) → comportamiento nativo de HeroUI.
     if (!tapMode) {
-        return (jsxRuntime.jsxs(react.Tooltip, { isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: onOpenChange, isDisabled: isDisabled, delay: delay, closeDelay: closeDelay, trigger: trigger, children: [jsxRuntime.jsx(react.Tooltip.Trigger, { children: children }), jsxRuntime.jsxs(react.Tooltip.Content, { placement: placement, offset: offset, showArrow: showArrow, className: className, children: [showArrow && jsxRuntime.jsx(react.Tooltip.Arrow, {}), content] })] }));
+        return (jsxRuntime.jsxs(react.Tooltip, { isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: onOpenChange, isDisabled: isDisabled, delay: delay, closeDelay: closeDelay, trigger: trigger, children: [jsxRuntime.jsx(react.Tooltip.Trigger, { render: renderTooltipTrigger(children) }), jsxRuntime.jsxs(react.Tooltip.Content, { placement: placement, offset: offset, showArrow: showArrow, className: contentClassName, children: [arrow, content] })] }));
     }
     // Táctil → controlado, el tap sobre el trigger alterna la visibilidad.
     // El placement cambia a `touchPlacement` (arriba por defecto) para que no
@@ -15069,7 +17360,7 @@ delay = 0, closeDelay, trigger, className, children, }) => {
     return (jsxRuntime.jsxs(react.Tooltip, { isOpen: open, onOpenChange: setOpen, isDisabled: isDisabled, children: [jsxRuntime.jsx(react.Tooltip.Trigger, { children: jsxRuntime.jsx("span", { ref: triggerRef, className: "inline-flex", onPointerUp: (event) => {
                         event.stopPropagation();
                         setOpen(!open);
-                    }, children: children }) }), jsxRuntime.jsxs(react.Tooltip.Content, { placement: touchPlacement, offset: offset, showArrow: showArrow, className: className, children: [showArrow && jsxRuntime.jsx(react.Tooltip.Arrow, {}), content] })] }));
+                    }, children: children }) }), jsxRuntime.jsxs(react.Tooltip.Content, { placement: touchPlacement, offset: offset, showArrow: showArrow, className: contentClassName, children: [arrow, content] })] }));
 };
 
 /**
@@ -15836,26 +18127,6 @@ Object.defineProperty(exports, "CloseButton", {
     enumerable: true,
     get: function () { return react.CloseButton; }
 });
-Object.defineProperty(exports, "Drawer", {
-    enumerable: true,
-    get: function () { return react.Drawer; }
-});
-Object.defineProperty(exports, "DrawerBody", {
-    enumerable: true,
-    get: function () { return react.DrawerBody; }
-});
-Object.defineProperty(exports, "DrawerContent", {
-    enumerable: true,
-    get: function () { return react.DrawerContent; }
-});
-Object.defineProperty(exports, "DrawerFooter", {
-    enumerable: true,
-    get: function () { return react.DrawerFooter; }
-});
-Object.defineProperty(exports, "DrawerHeader", {
-    enumerable: true,
-    get: function () { return react.DrawerHeader; }
-});
 Object.defineProperty(exports, "DropdownItem", {
     enumerable: true,
     get: function () { return react.DropdownItem; }
@@ -15968,7 +18239,12 @@ exports.DateRangePicker = DateRangePicker;
 exports.DateSelector = DateSelector;
 exports.Divider = Divider;
 exports.DonutChart = DonutChart;
+exports.Drawer = Drawer;
+exports.DrawerBody = DrawerBody;
+exports.DrawerContent = DrawerContent;
 exports.DrawerFilters = DrawerFilters;
+exports.DrawerFooter = DrawerFooter;
+exports.DrawerHeader = DrawerHeader;
 exports.Dropdown = Dropdown;
 exports.DropdownSection = DropdownSection;
 exports.EmailPreview = EmailPreview;
@@ -16034,7 +18310,7 @@ exports.ThemeContext = ThemeContext;
 exports.ThemePicker = ThemePicker;
 exports.ThemeProvider = ThemeProvider;
 exports.TimeInput = TimeInput;
-exports.TimeInputComponent = TimeInput;
+exports.TimeInputComponent = TimeInputComponent;
 exports.ToastContext = ToastContext;
 exports.Tooltip = Tooltip;
 exports.TwoColumnLayoutAgent = TwoColumnLayoutAgent;