@beweco/aurora-ui 1.0.0-beta.99 → 1.0.0

package/dist/types/utils/dismiss-control.d.ts

@@ -0,0 +1,113 @@
+/**
+ * Interacciones que un popover no-modal NO debe tratar como "clic fuera".
+ *
+ * El problema que resuelve: `useOverlay` de react-aria trata cualquier
+ * pulsación fuera del popover como interacción externa y, cuando el popover es
+ * el overlay visible más reciente, hace `stopPropagation()` sobre el
+ * `pointerdown` **y** sobre el `click` (`react-aria/.../useOverlay`). El evento
+ * no sube por el árbol, así que un control fuera del popover no recibe la
+ * pulsación y su `onPress` no se dispara: el primer clic solo cierra el
+ * desplegable.
+ *
+ * Para un clic en la página de fondo eso es lo correcto: descartar el
+ * desplegable sin activar nada por debajo. Dentro del mismo diálogo no: ahí el
+ * usuario está rellenando un formulario y espera que su clic llegue. Y como los
+ * buscadores se reabren al recuperar el foco, el clic siguiente se volvía a
+ * tragar — un callejón sin salida del que solo se salía vaciando el campo.
+ *
+ * La palanca es `shouldCloseOnInteractOutside`: es el guardián de ese descarte.
+ * Devolviendo `false` para lo que no es realmente "fuera", la pulsación llega
+ * intacta. El desplegable sigue cerrándose igual, pero por pérdida de foco
+ * (`shouldCloseOnBlur`) en vez de por interacción externa.
+ *
+ * ## TECH-2459 · Qué cambió con HeroUI v3 (y por qué esto sigue aquí)
+ *
+ * En v2 react-aria hacía además `preventDefault()` sobre esos dos eventos, y
+ * este predicado era el guardián de los dos. Ese `preventDefault` **ya no
+ * está** (verificado en el paquete instalado,
+ * `node_modules/react-aria/dist/private/overlays/useOverlay.js`: solo queda
+ * `stopPropagation`), así que el mecanismo exacto de la cabecera de arriba es
+ * historia. El predicado se mantiene porque el `stopPropagation` sí sigue, y
+ * con él el síntoma.
+ *
+ * **Alcance real en v3: solo alcanza a los popovers NO modales.** Los popovers
+ * de v3 son modales por defecto e inertizan el resto del documento
+ * (`inert` en el DOM), y con `inert` el predicado **no se llega a consultar**:
+ * el clic solo descarta el overlay y nunca llega al botón. Medido sobre
+ * `MultiStepWizard` con un desplegable abierto y pulsando «Cancelar»:
+ *
+ * | Desplegable abierto | `[inert]` en el DOM | Clics para cerrar el wizard |
+ * |---|---|---|
+ * | `TagsFilter` (`ComboBox` con `isNonModal`) | 0 | **1** — el predicado se consulta |
+ * | `Select` (popover modal de v3) | 11 | **2** — deuda aceptada |
+ *
+ * El segundo caso es **deuda conocida y aceptada**, no una regresión de la
+ * migración: v2 tenía el mismo síntoma y este fichero es su arreglo. La palanca
+ * de v3 (`isNonModal` en `Select`) se probó y **no sirve**: apaga
+ * `isDismissable`, o sea que el desplegable dejaría de cerrarse al pulsar
+ * fuera. Salida existente: `Escape` cierra el desplegable y un segundo `Escape`
+ * el contenedor. Detalle en `.docs/migrate-heroui/DECISIONES.md` §9.3.
+ */
+/**
+ * Marca un botón como control de cierre de su contenedor. Los popovers de Aura
+ * no lo cuentan como interacción externa, así que su pulsación no se pierde.
+ */
+export declare const DISMISS_CONTROL_ATTRIBUTE = "data-aura-dismiss";
+/** Props a esparcir en un control de cierre: `<Button {...dismissControlProps} />`. */
+export declare const dismissControlProps: {
+    readonly "data-aura-dismiss": "true";
+};
+/**
+ * Marca el contenedor de una superficie modal propia (wizard, panel a medida).
+ * No hace falta en `Modal` ni `Drawer`: los diálogos de HeroUI ya traen
+ * `role="dialog"`, que cuenta igual.
+ */
+export declare const CONTAINER_ATTRIBUTE = "data-aura-container";
+/** Props a esparcir en el contenedor: `<div {...containerProps}>`. */
+export declare const containerProps: {
+    readonly "data-aura-container": "true";
+};
+/** `true` si el elemento es un control de cierre (o está dentro de uno). */
+export declare const isDismissControl: (element: Element | null | undefined) => boolean;
+/**
+ * Predicado listo para el `shouldCloseOnInteractOutside` de un popover no
+ * modal. En v3 es una prop directa de la pieza del compuesto
+ * (`<ComboBox.Popover shouldCloseOnInteractOutside={…}>`); el objeto anidado
+ * `popoverProps` de v2 desapareció con los compound components.
+ *
+ * Devuelve `false` —no es interacción externa— en tres casos:
+ *
+ * 1. Dentro del propio componente: el popover vive en un portal, así que el
+ *    campo de búsqueda queda fuera de él y una pulsación sobre el texto se
+ *    contaba como externa.
+ * 2. Sobre un control de cierre del contenedor propio.
+ * 3. Dentro del mismo diálogo/contenedor que el componente: seguir rellenando
+ *    el formulario no es descartar el desplegable.
+ *
+ * Las exenciones 2 y 3 se limitan al contenedor del propio componente. Un
+ * control de cierre suelto en la página —la X de un toast, la de un banner— no
+ * tiene nada que ver con este desplegable, así que sigue contando como externo
+ * y lo cierra.
+ *
+ * ## No lo envuelvas en una puerta «solo dentro de un diálogo» (TECH-2313 → TECH-2459)
+ *
+ * En v2 este predicado se instalaba **solo** si el componente vivía dentro de una
+ * superficie modal, y fuera de ella había que dejarle el suyo a HeroUI: su
+ * `use-autocomplete` mezclaba `popoverProps.shouldCloseOnInteractOutside` por
+ * truthiness, así que cualquier predicado propio desactivaba su
+ * `ariaShouldCloseOnInteractOutside` y la primera pulsación se perdía en una
+ * página suelta. De ahí venían un `isInsideDismissContainer` y un helper de
+ * mezcla que esta rama ya no tiene.
+ *
+ * **En v3 esa puerta no hace falta**: la prop va directa a la pieza del compuesto
+ * (`<ComboBox.Popover shouldCloseOnInteractOutside={…}>`) y HeroUI no la mezcla
+ * con ningún default propio — medido con grep recursivo, 0 de 1185 ficheros de
+ * `node_modules/@heroui` mencionan `shouldCloseOnInteractOutside`, y la sonda
+ * está validada porque en `react-aria-components` sí aparece. Reintroducir la
+ * puerta hoy solo añadiría una condición que nunca es falsa donde importa.
+ *
+ * @param element Elemento donde ha empezado la interacción.
+ * @param root    Raíz del componente.
+ */
+export declare const shouldClosePopoverOnInteractOutside: (element: Element, root: Element | null | undefined) => boolean;
+//# sourceMappingURL=dismiss-control.d.ts.map

package/dist/types/utils/dismiss-control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dismiss-control.d.ts","sourceRoot":"","sources":["../../../src/utils/dismiss-control.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AAEH;;;GAGG;AACH,eAAO,MAAM,yBAAyB,sBAAsB,CAAC;AAE7D,uFAAuF;AACvF,eAAO,MAAM,mBAAmB;;CAEtB,CAAC;AAEX;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,wBAAwB,CAAC;AAEzD,sEAAsE;AACtE,eAAO,MAAM,cAAc;;CAEjB,CAAC;AAsBX,4EAA4E;AAC5E,eAAO,MAAM,gBAAgB,GAC5B,SAAS,OAAO,GAAG,IAAI,GAAG,SAAS,KACjC,OAA6D,CAAC;AAEjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,eAAO,MAAM,mCAAmC,GAC/C,SAAS,OAAO,EAChB,MAAM,OAAO,GAAG,IAAI,GAAG,SAAS,KAC9B,OAeF,CAAC"}

package/dist/types/utils/text-search.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Comparación de texto para los buscadores de los desplegables (país, moneda).
+ *
+ * El problema que resuelve: los nombres de la lista de países mezclan idiomas y
+ * algunos llevan tilde ("Canadá", "República Dominicana"). Un `includes` crudo
+ * exige que quien busca escriba la tilde, así que teclear "canada" no encontraba
+ * Canadá y "republica" no encontraba República Dominicana — el desplegable
+ * respondía "No se encontraron países" con el país delante.
+ */
+/** Minúsculas y sin diacríticos, para comparar lo que se escribe con lo que se muestra. */
+export declare const normalizeForSearch: (value: string) => string;
+/**
+ * `true` si el término aparece en alguno de los campos, ignorando tildes y
+ * mayúsculas. Los campos ausentes se descartan. Un término vacío casa siempre,
+ * igual que el `includes` que sustituye.
+ */
+export declare const matchesSearchTerm: (fields: (string | undefined | null)[], term: string) => boolean;
+//# sourceMappingURL=text-search.d.ts.map

package/dist/types/utils/text-search.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-search.d.ts","sourceRoot":"","sources":["../../../src/utils/text-search.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,2FAA2F;AAC3F,eAAO,MAAM,kBAAkB,GAAI,OAAO,MAAM,KAAG,MAMnC,CAAC;AAEjB;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,GAC7B,QAAQ,CAAC,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC,EAAE,EACrC,MAAM,MAAM,KACV,OAKF,CAAC"}

package/dist/types/utils/theme-scope.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Selectores para que un componente con `appearance="auto"` siga al tema del ancestro MÁS
+ * CERCANO.
+ *
+ * Los temas no solo se llaman `dark`/`light`: el `ThemeProvider` de esta librería pone en
+ * `<html>` el tema completo (`blue-dark`, `purple-light`…) y nunca la clase `dark` suelta,
+ * así que mirar solo `.dark` dejaría la pieza en claro sobre un tema oscuro de aurora.
+ *
+ * - `dark`: cualquier ancestro oscuro, o uno oscuro dentro de uno claro.
+ * - `light`: uno claro dentro de uno oscuro (un panel claro en una página oscura). Tiene
+ *   una clase más que el oscuro simple, así que gana; va después en la hoja para ganar
+ *   también al «oscuro dentro de claro» cuando hay tres niveles.
+ */
+export declare const themeScopeSelectors: (target: string) => {
+    dark: string;
+    light: string;
+};
+//# sourceMappingURL=theme-scope.d.ts.map

package/dist/types/utils/theme-scope.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-scope.d.ts","sourceRoot":"","sources":["../../../src/utils/theme-scope.ts"],"names":[],"mappings":"AAuBA;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,mBAAmB,GAC/B,QAAQ,MAAM,KACZ;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAW/B,CAAC"}

package/dist/types/utils/use-injected-style.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Deja una `<style id>` en el `<head>` con las reglas de un componente, una sola vez.
+ *
+ * Existe para los componentes que no pueden depender de `@beweco/aurora-ui/styles`: los
+ * que llegan a un microfrontend por Module Federation (chatbot-claw recibe aurora-ui del
+ * host con `import: false`) o se montan sueltos. Si sus reglas vivieran en `styles.css`,
+ * funcionarían solo cuando el host carga ese CSS y además en la misma versión que el JS
+ * que viaja por MF; cuando no, el componente sale sin animación ni tema y nadie se entera.
+ * Aquí la regla viaja con el componente, como ya hace `SocialMediaCarousel`.
+ *
+ * Idempotente por `id`: cien mascotas en un hilo dejan una sola `<style>`. Nunca reescribe
+ * una `<style>` existente: si en la página conviven dos copias del paquete, se pisarían en
+ * cada montaje. Para que una versión nueva del CSS entre, el id lleva su huella
+ * (`styleIdFor`).
+ */
+export declare const injectStyle: (doc: Document | undefined, id: string, css: string) => void;
+/** `<base>-<huella del css>`: estable para el mismo CSS, distinto si cambia. */
+export declare const styleIdFor: (base: string, css: string) => string;
+/**
+ * `useInsertionEffect` corre antes de pintar y antes que los efectos de layout: las reglas
+ * están en el documento cuando el SVG aparece por primera vez, sin parpadeo sin estilo.
+ * En servidor no corre (y `renderToStaticMarkup` en los tests tampoco lo ejecuta).
+ */
+export declare const useInjectedStyle: (id: string, css: string) => void;
+//# sourceMappingURL=use-injected-style.d.ts.map

package/dist/types/utils/use-injected-style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-injected-style.d.ts","sourceRoot":"","sources":["../../../src/utils/use-injected-style.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,WAAW,GACvB,KAAK,QAAQ,GAAG,SAAS,EACzB,IAAI,MAAM,EACV,KAAK,MAAM,KACT,IAWF,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,UAAU,GAAI,MAAM,MAAM,EAAE,KAAK,MAAM,KAAG,MAMtD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,IAAI,MAAM,EAAE,KAAK,MAAM,KAAG,IAQ1D,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@beweco/aurora-ui",
-	"version": "1.0.0-beta.99",
+	"version": "1.0.0",
 	"description": "Bewe Aurora UI Component Library",
 	"main": "./dist/index.cjs.js",
 	"module": "./dist/index.esm.js",
@@ -9,7 +9,7 @@
 	"files": [
 		"dist"
 	],
-	"sideEffects": false,
+	"sideEffects": ["**/*.css"],
 	"author": "Bewe",
 	"license": "MIT",
 	"engines": {
@@ -24,7 +24,8 @@
 			"import": "./dist/index.esm.js",
 			"require": "./dist/index.cjs.js"
 		},
-		"./styles": "./dist/assets/css/styles.css"
+		"./styles": "./dist/assets/css/styles.css",
+		"./theme": "./dist/assets/css/theme.css"
 	},
 	"scripts": {
 		"build": "rollup -c",
@@ -37,31 +38,37 @@
 		"chromatic": "npx chromatic --project-token=chpt_a33f7fd2ebb3349",
 		"prepare": "husky",
 		"publish:with-env": "dotenv -e .env -- npm publish --access public",
-		"npm:whoami": "dotenv -e .env -- npm whoami"
+		"npm:whoami": "dotenv -e .env -- npm whoami",
+		"vrt": "playwright test -c vrt vrt/stories.spec.ts",
+		"vrt:json": "playwright test -c vrt vrt/stories.spec.ts --update-snapshots=none --reporter=json > vrt/report.json",
+		"vrt:update": "playwright test -c vrt vrt/stories.spec.ts --update-snapshots",
+		"vrt:errors": "playwright test -c vrt vrt/render-errors.spec.ts",
+		"vrt:report": "playwright show-report vrt/playwright-report",
+		"vrt:manifest": "node vrt/scripts/generate-baseline-manifest.mjs",
+		"vrt:classification": "node vrt/scripts/generate-classification.mjs",
+		"vrt:fixtures": "node vrt/scripts/generate-fixtures.mjs"
 	},
 	"dependencies": {
-		"@heroui/react": "2.7.11",
-		"@heroui/system": "2.4.15",
-		"@heroui/theme": "2.4.15",
-		"@heroui/use-theme": "2.1.9",
+		"@heroui/react": "3.2.4",
+		"@heroui/styles": "3.2.4",
 		"@iconify/react": "6.0.0",
-		"recharts": "^2.8.0"
+		"recharts": "^2.8.0",
+		"tailwind-variants": "3.3.1"
 	},
 	"peerDependencies": {
-		"@heroui/react": "2.7.11",
-		"@heroui/system": "2.4.15",
-		"@heroui/theme": "2.4.15",
-		"@heroui/use-theme": "2.1.9",
+		"@heroui/react": "3.2.4",
+		"@heroui/styles": "3.2.4",
 		"@iconify/react": "6.0.0",
 		"framer-motion": ">=12.0.0",
 		"react": ">=18.0.0",
 		"react-dom": ">=18.0.0",
 		"recharts": "^2.8.0",
-		"tailwindcss": "3.4.17"
+		"tailwindcss": "^4"
 	},
 	"devDependencies": {
 		"@biomejs/biome": "^1.9.4",
 		"@internationalized/date": "^3.8.2",
+		"@playwright/test": "^1.62.1",
 		"@rollup/plugin-commonjs": "^28.0.6",
 		"@rollup/plugin-node-resolve": "^16.0.1",
 		"@rollup/plugin-typescript": "^12.1.4",
@@ -73,14 +80,16 @@
 		"@storybook/react": "^8.0.0",
 		"@storybook/react-vite": "^8.0.0",
 		"@storybook/test": "^8.0.0",
+		"@tailwindcss/postcss": "4.3.3",
 		"@types/node": "^24.0.3",
 		"@types/react": "^19.1.5",
 		"@types/react-dom": "^19.1.5",
-		"autoprefixer": "^10.4.21",
 		"chromatic": "^13.0.0",
 		"dotenv-cli": "^8.0.0",
 		"framer-motion": "^12.41.0",
+		"http-server": "^14.1.1",
 		"husky": "^9.1.7",
+		"jsdom": "26.1.0",
 		"postcss": "^8.5.5",
 		"postcss-loader": "^8.1.1",
 		"react": ">=18.0.0",
@@ -91,7 +100,7 @@
 		"rollup-plugin-visualizer": "^5.12.0",
 		"sass": "^1.89.2",
 		"storybook": "^8.0.0",
-		"tailwindcss": "3.4.17",
+		"tailwindcss": "4.3.3",
 		"typescript": "^5.8.3",
 		"vitest": "^2.1.9"
 	},

package/dist/types/components/menu/_internal/menu-nav-list/MenuNavList.styles.d.ts

@@ -1,7 +0,0 @@
-import type { MenuNavListProps } from "./MenuNavList.types";
-type SectionClasses = MenuNavListProps["sectionClasses"];
-type ItemClasses = MenuNavListProps["itemClasses"];
-export declare const getSectionClasses: (isCollapsed: boolean | undefined, sectionClassesProp?: SectionClasses) => Record<string, string | undefined>;
-export declare const getItemClasses: (isCollapsed: boolean | undefined, itemClassesProp?: ItemClasses) => Record<string, string | undefined>;
-export {};
-//# sourceMappingURL=MenuNavList.styles.d.ts.map

package/dist/types/components/menu/_internal/menu-nav-list/MenuNavList.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MenuNavList.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/menu/_internal/menu-nav-list/MenuNavList.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5D,KAAK,cAAc,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;AACzD,KAAK,WAAW,GAAG,gBAAgB,CAAC,aAAa,CAAC,CAAC;AAYnD,eAAO,MAAM,iBAAiB,GAC7B,aAAa,OAAO,GAAG,SAAS,EAChC,qBAAoB,cAAmB,KACrC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAmBlC,CAAC;AAEH,eAAO,MAAM,cAAc,GAC1B,aAAa,OAAO,GAAG,SAAS,EAChC,kBAAiB,WAAgB,KAC/B,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CASlC,CAAC"}