@studiolxd/brand 49.28.0 → 50.0.0

package/dist/_types/molecules/FormField/FormField.d.ts

@@ -1,6 +1,5 @@
 import { type ComponentProps } from 'react';
 import { FormProvider as RhfFormProvider, type ControllerProps, type FieldPath, type FieldValues } from 'react-hook-form';
-import { Label } from '../../atoms/Label/Label';
 import './FormField.css';
 type Translate = (message: string) => string;
 /**
@@ -42,9 +41,9 @@ export declare function useFormField(): {
     register: (part: "description" | "message", present: boolean) => void;
 };
 /** Contenedor de un campo: reserva los ids que enlazan sus partes. */
-export declare function FormItem({ className, ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export declare const FormItem: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 /** Etiqueta del campo, ya apuntada a su control y marcada si hay error. */
-export declare function FormLabel({ ...props }: ComponentProps<typeof Label>): import("react/jsx-runtime").JSX.Element;
+export declare const FormLabel: import("react").ForwardRefExoticComponent<Omit<import("../../atoms/Label/Label").LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
 /**
  * Envoltorio del control real (input, select, textarea…). No renderiza nodo
  * propio: fusiona en su hijo el `id`, el `aria-describedby` y el
@@ -54,17 +53,17 @@ export declare function FormControl({ children, ...props }: {
     children: React.ReactElement<Record<string, unknown>>;
 } & Record<string, unknown>): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 /** Texto de ayuda del campo, enlazado al control por `aria-describedby`. */
-export declare function FormDescription({ className, ...props }: ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+export declare const FormDescription: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
 /**
  * Mensaje de error del campo. Renderiza el error de react-hook-form si lo
  * hay, o sus children si no; sin ninguno de los dos no renderiza nada.
  */
-export declare function FormMessage({ className, children, ...props }: ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element | null;
+export declare const FormMessage: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
 /**
  * Error del formulario entero (p. ej. "usuario o contraseña incorrectos"),
  * el que se pone con `form.setError("root", …)` y no cuelga de ningún campo.
  * Se coloca una vez al final del formulario: a diferencia de `FormMessage`
  * no tiene campo del que leer, así que va directo al `formState`.
  */
-export declare function FormRootMessage({ className, ...props }: ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element | null;
+export declare const FormRootMessage: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
 export {};

package/dist/_types/molecules/LanguageSwitcher/LanguageSwitcher.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import './LanguageSwitcher.css';
 /**
  * El único texto del selector, y es **cromo**: cómo se llama el control. Los
@@ -33,7 +33,7 @@ export interface LanguageSwitcherProps {
      * él, sale de `languageSwitcher.label` del `BrandMessagesProvider`.
      */
     label?: string;
-    /** `id` del control en compacto (enlaza la etiqueta). */
+    /** `id` del control en compacto (enlaza la etiqueta). Por defecto, uno único por instancia (`useId`). */
     id?: string;
     /** Oculta la etiqueta (visible por defecto: en el panel va con su nombre, como el de tema). */
     labelHidden?: boolean;
@@ -47,6 +47,10 @@ export interface LanguageSwitcherProps {
      * Sin él, la lista es de botones y usa `onChange`.
      */
     hrefFor?: (code: string) => string;
+    /**
+     * Enlace del router del producto; por defecto, un `<a>`. Recibe solo
+     * atributos de `<a>` y tiene que reenviarlos **todos** (`<Link {...props} />`).
+     */
     renderLink?: (props: LanguageSwitcherRenderLinkProps) => ReactNode;
     /**
      * Disposición de la etiqueta. `inline` (por defecto) la pone delante del
@@ -67,4 +71,4 @@ export interface LanguageSwitcherProps {
  * componente del sistema porque aparece en el menú y en el pie de todos los
  * sitios; el enrutado y la persistencia se quedan en el producto.
  */
-export declare function LanguageSwitcher({ languages, value, onChange, label, id, labelHidden, variant, layout, size, hrefFor, renderLink, className, }: LanguageSwitcherProps): import("react/jsx-runtime").JSX.Element;
+export declare function LanguageSwitcher({ languages, value, onChange, label, id: idProp, labelHidden, variant, layout, size, hrefFor, renderLink, className, }: LanguageSwitcherProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/LoadingRegion/LoadingRegion.d.ts

@@ -25,29 +25,37 @@ export declare function LoadingRegion({ label, announce, children, className, ..
 export interface SkeletonTextProps {
     /** Líneas del párrafo; la última sale más corta. */
     lines?: number;
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /** Un bloque de texto —un párrafo, una lista de definiciones— que aún no llegó. Decorativo. */
-export declare function SkeletonText({ lines }: SkeletonTextProps): import("react/jsx-runtime").JSX.Element;
+export declare function SkeletonText({ lines, className }: SkeletonTextProps): import("react/jsx-runtime").JSX.Element;
 export interface SkeletonListProps {
     /** Filas de la lista. */
     rows?: number;
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /** Una lista que aún no llegó: una barra por fila, del alto de un control. Decorativo. */
-export declare function SkeletonList({ rows }: SkeletonListProps): import("react/jsx-runtime").JSX.Element;
+export declare function SkeletonList({ rows, className }: SkeletonListProps): import("react/jsx-runtime").JSX.Element;
 export interface SkeletonTableProps {
     /** Filas de cuerpo, sin contar la cabecera. */
     rows?: number;
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /**
  * Una tabla que aún no llegó: la cabecera y sus filas. No calca el diseño —no
  * hace falta—, solo ocupa un sitio parecido. Decorativo.
  */
-export declare function SkeletonTable({ rows }: SkeletonTableProps): import("react/jsx-runtime").JSX.Element;
+export declare function SkeletonTable({ rows, className }: SkeletonTableProps): import("react/jsx-runtime").JSX.Element;
 export interface SkeletonGridProps {
     /** Columnas de la rejilla. */
     columns?: 2 | 3 | 4;
     /** Filas de la rejilla: se pintan `columns × rows` celdas. */
     rows?: number;
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /** Una rejilla de tarjetas o miniaturas que aún no llegó. Decorativo. */
-export declare function SkeletonGrid({ columns, rows }: SkeletonGridProps): import("react/jsx-runtime").JSX.Element;
+export declare function SkeletonGrid({ columns, rows, className }: SkeletonGridProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/Modal/Modal.d.ts

@@ -16,7 +16,7 @@ export interface ModalMessages {
     /** Nombre accesible del diálogo cuando no hay `title`. */
     fallbackTitle: string;
 }
-export interface ModalProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'title' | 'className'> {
+export interface ModalProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {
     open: boolean;
     onClose: () => void;
     title?: string;
@@ -73,6 +73,12 @@ export interface ModalProps extends Omit<React.ComponentPropsWithoutRef<'div'>,
     footer?: React.ReactNode;
     /** Se añade DESPUÉS de las clases propias del pie. */
     footerClassName?: string;
+    /**
+     * Se añade DESPUÉS de las clases propias del panel (`modal__content`), igual
+     * que en `Sheet`. Es un enganche para el producto (una prueba, una medida
+     * propia), no la vía de personalizar la cara del diálogo: eso va por tokens.
+     */
+    className?: string;
 }
 /**
  * Diálogo centrado sobre un velo. El motor (portal, velo, trampa de foco,
@@ -84,7 +90,7 @@ export interface ModalProps extends Omit<React.ComponentPropsWithoutRef<'div'>,
  * `onClick`/`onPointerDown` con `stopPropagation` en el propio popup— sin
  * envolverlo en `div`s de producto.
  *
- * `className` **no** se reenvía a propósito: la cara del diálogo la pone el
- * sistema, y se personaliza por tokens.
+ * `className` se concatena tras las clases propias del popup, como en `Sheet`.
+ * La cara del diálogo sigue personalizándose por tokens.
  */
-export declare function Modal({ open, onClose, title, children, closeLabel, fallbackTitle, container, description, 'aria-describedby': ariaDescribedBy, initialFocus, footer, footerClassName, ...rest }: ModalProps): import("react/jsx-runtime").JSX.Element;
+export declare function Modal({ open, onClose, title, children, closeLabel, fallbackTitle, container, description, 'aria-describedby': ariaDescribedBy, initialFocus, footer, footerClassName, className, ...rest }: ModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/OrgSwitcher/OrgSwitcher.d.ts

@@ -33,5 +33,11 @@ export interface OrgSwitcherProps {
     defaultOpen?: boolean;
     items?: MenuItem[];
     renderLink?: (props: MenuRenderLinkProps) => ReactNode;
+    /**
+     * Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye).
+     * Va al disparador: es el único nodo que el componente pinta en su sitio (el
+     * panel sale por un portal).
+     */
+    className?: string;
 }
-export declare function OrgSwitcher({ label, block, compact, current, organizations, onOrgChange, defaultOpen, items, renderLink }: OrgSwitcherProps): import("react/jsx-runtime").JSX.Element;
+export declare function OrgSwitcher({ label, block, compact, current, organizations, onOrgChange, defaultOpen, items, renderLink, className }: OrgSwitcherProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/PasswordField/PasswordField.d.ts

@@ -20,11 +20,18 @@ export interface PasswordFieldProps extends Omit<React.ComponentPropsWithoutRef<
      * dentro de una capa de formulario propia.
      */
     label?: string;
-    /** Oculta visualmente el label (solo aplica cuando hay `label`). Default: true. */
+    /**
+     * Oculta la etiqueta a la vista (sigue leyéndola el lector de pantalla).
+     * Solo aplica cuando hay `label`. Por defecto `false`: la etiqueta se ve,
+     * como en `InputField`. Con la etiqueta oculta y sin `placeholder`, el
+     * control usa el texto de la etiqueta como placeholder para no quedarse sin
+     * pista visible. Sin valor, lo decide quien lo envuelva: dentro de un
+     * `FieldRow` que no es la primera de la lista, la etiqueta se oculta sola.
+     */
     labelHidden?: boolean;
     /** Marca el estado de error (borde) y `aria-invalid` en el input. */
     error?: boolean;
-    /** Mensaje de error propio del componente (solo se renderiza si hay `label`-mode completo). */
+    /** Mensaje de error propio del componente. Se pinta bajo el campo y se enlaza con `aria-describedby`, haya o no `label`. */
     errorMessage?: string;
     /** Texto de ayuda propio del componente. */
     helperText?: string;

package/dist/_types/molecules/PrevNextNav/PrevNextNav.d.ts

@@ -50,6 +50,8 @@ export interface PrevNextNavProps {
     linkComponent?: ComponentType<any>;
     /** Variante de densidad. Default: "md" */
     size?: 'sm' | 'md';
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /**
  * Los dos textos del par, y los dos son **cromo**: «anterior» y «siguiente»
@@ -62,4 +64,4 @@ export interface PrevNextNavMessages {
     /** Rótulo del control siguiente. */
     next: string;
 }
-export declare function PrevNextNav({ prevHref, nextHref, prevOnClick, nextOnClick, prevLabel, nextLabel, prevTitle, nextTitle, label, labelId, linkComponent, size, }: PrevNextNavProps): import("react/jsx-runtime").JSX.Element;
+export declare function PrevNextNav({ prevHref, nextHref, prevOnClick, nextOnClick, prevLabel, nextLabel, prevTitle, nextTitle, label, labelId, linkComponent, size, className, }: PrevNextNavProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/RecurrenceField/RecurrenceField.d.ts

@@ -65,6 +65,11 @@ export interface RecurrenceFieldProps {
     locale?: string;
     /** Por dónde empieza la semana en los días. Default `'monday'`. */
     weekStartsOn?: 'monday' | 'sunday';
+    /**
+     * El «hoy» del calendario de la fecha de final. Default: la fecha actual.
+     * En SSR conviene pasarla (ver `Calendar`).
+     */
+    today?: Date;
     /** Tope inferior de la fecha de final. */
     minDate?: Date;
     /** Tope superior de la fecha de final. */
@@ -90,4 +95,4 @@ export interface RecurrenceFieldProps {
  * Es **controlado**, como el resto de campos del sistema: recibe `value` y
  * llama a `onValueChange` con el valor entero. `null` es «no se repite».
  */
-export declare function RecurrenceField({ value, onValueChange, id: idProp, legend, disabled, size, locale, weekStartsOn, minDate, maxDate, className, frequencyLabel, weekdaysLabel, endLabel, }: RecurrenceFieldProps): import("react/jsx-runtime").JSX.Element;
+export declare function RecurrenceField({ value, onValueChange, id: idProp, legend, disabled, size, locale, weekStartsOn, minDate, maxDate, today, className, frequencyLabel, weekdaysLabel, endLabel, }: RecurrenceFieldProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/SidebarNav/SidebarNav.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import './SidebarNav.css';
 export interface SidebarNavItem {
     id: string;
@@ -51,6 +51,14 @@ export interface SidebarNavProps {
      * `sidebarNav.empty`. Solo se lee cuando hay alguna entrada vacía.
      */
     emptyLabel?: string;
+    /**
+     * Nombre de una entrada vacía donde no cabe la marca aparte —el tooltip y
+     * el nombre accesible del modo rail, el rótulo del menú de un grupo—.
+     * Recibe el rótulo de la entrada y la marca de vacío ya resuelta. **Sin
+     * default**: sale de `sidebarNav.emptyEntry`. Solo se lee cuando hay alguna
+     * entrada vacía en esas formas.
+     */
+    emptyEntryLabel?: (label: string, empty: string) => string;
     /** Solo iconos: los enlaces con tooltip, los grupos como menú. Sin él, lo decide la `Sidebar` (rail). */
     rail?: boolean;
     entries: SidebarNavEntry[];
@@ -58,6 +66,8 @@ export interface SidebarNavProps {
     value?: string[];
     onValueChange?: (value: string[]) => void;
     renderLink?: (props: SidebarNavRenderLinkProps) => ReactNode;
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /**
  * Los dos textos de la navegación, los dos **cromo**: el nombre de la región
@@ -70,5 +80,11 @@ export interface SidebarNavMessages {
     label: string;
     /** Marca de las entradas sin contenido. */
     empty: string;
+    /**
+     * Una entrada vacía nombrada en una sola cadena: «Guías — sin docs». Recibe
+     * el rótulo de la entrada y la marca de vacío; es función porque el orden y
+     * el separador son de cada idioma.
+     */
+    emptyEntry: (label: string, empty: string) => string;
 }
-export declare function SidebarNav({ label, emptyLabel, rail, entries, defaultValue, value, onValueChange, renderLink, }: SidebarNavProps): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarNav({ label, emptyLabel, emptyEntryLabel, rail, entries, defaultValue, value, onValueChange, renderLink, className, }: SidebarNavProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/SiteNav/SiteNav.d.ts

@@ -55,7 +55,10 @@ export interface SiteNavProps {
     groups: SiteNavGroup[];
     /** Nombre accesible del `nav`. */
     label?: string;
-    /** Enlace del router del producto; por defecto, un `<a>`. */
+    /**
+     * Enlace del router del producto; por defecto, un `<a>`. Recibe solo
+     * atributos de `<a>` y tiene que reenviarlos **todos** (`<Link {...props} />`).
+     */
     renderLink?: (props: SiteNavRenderLinkProps) => ReactNode;
     className?: string;
 }

package/dist/_types/molecules/StatTile/StatTile.d.ts

@@ -2,6 +2,19 @@ import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
 import './StatTile.css';
 export type StatTileDirection = 'up' | 'down' | 'flat';
 export type StatTileTone = 'positive' | 'negative' | 'neutral';
+/**
+ * Las tres direcciones del delta, que solo oye un lector de pantalla (la
+ * flecha es decorativa). Dicen hacia dónde se movió la cifra, no qué cifra
+ * es: valen igual en cualquier panel.
+ */
+export interface StatTileMessages {
+    /** La cifra ha subido. */
+    up: string;
+    /** La cifra ha bajado. */
+    down: string;
+    /** La cifra no se ha movido. */
+    flat: string;
+}
 export interface StatTileDelta {
     /** La variación, ya formateada: «+12 %», «−3», «igual». */
     value: ReactNode;
@@ -14,7 +27,8 @@ export interface StatTileDelta {
     tone?: StatTileTone;
     /**
      * Cómo se lee la dirección para un lector de pantalla, que no ve la flecha.
-     * Default castellano según `direction`.
+     * **Sin default**: sin él, sale de `statTile.up`, `statTile.down` o
+     * `statTile.flat` del `BrandMessagesProvider`, según `direction`.
      */
     label?: string;
 }

package/dist/_types/molecules/Table/Table.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import './Table.css';
 /**
  * Los textos que la tabla emite por su cuenta: el cromo de la cabecera —el

package/dist/_types/molecules/ThemeSwitcher/ThemeSwitcher.d.ts

@@ -1,19 +1,54 @@
 import './ThemeSwitcher.css';
 export type Theme = 'light' | 'dark' | 'system';
+/**
+ * El cromo del selector de tema: el nombre del control, los tres temas y la
+ * frase que nombra el botón de icono con el tema vigente. Todo es igual en
+ * cualquier pantalla de la suite, así que va al catálogo una sola vez.
+ */
+export interface ThemeSwitcherMessages {
+    /** Nombre del control: la etiqueta del compacto y el nombre del grupo en lista. */
+    group: string;
+    /** El tema claro. */
+    light: string;
+    /** El tema oscuro. */
+    dark: string;
+    /** El tema que sigue al sistema operativo. */
+    system: string;
+    /**
+     * Nombre accesible del botón de la variante `icon`, que solo enseña el
+     * icono del tema vigente: «Tema: Claro». Recibe el nombre del control y el
+     * del tema vigente, ya resueltos, y es función porque el orden y la
+     * puntuación de la frase son de cada idioma.
+     */
+    trigger: (group: string, theme: string) => string;
+}
+/**
+ * Anulaciones puntuales del catálogo, clave a clave. Las que no se pasen
+ * salen de `themeSwitcher.*` del `BrandMessagesProvider`.
+ */
 export interface ThemeSwitcherLabels {
-    /** Nombre accesible del control. */
+    /** Anulación puntual de `themeSwitcher.group`. */
     group?: string;
+    /** Anulación puntual de `themeSwitcher.light`. */
     light?: string;
+    /** Anulación puntual de `themeSwitcher.dark`. */
     dark?: string;
+    /** Anulación puntual de `themeSwitcher.system`. */
     system?: string;
+    /** Anulación puntual de `themeSwitcher.trigger`. */
+    trigger?: (group: string, theme: string) => string;
 }
 export interface ThemeSwitcherProps {
     /** Tema elegido. `system` sigue la preferencia del sistema operativo. */
     value: Theme;
     /** Cambio de tema. Aplicarlo (clase en `html`) y persistirlo es del producto. */
     onChange?: (theme: Theme) => void;
+    /**
+     * Textos del control, clave a clave. **Sin defaults**: los que no se pasen
+     * salen de `themeSwitcher.*` del `BrandMessagesProvider`.
+     */
     labels?: ThemeSwitcherLabels;
-    /** `id` del control en compacto (enlaza la etiqueta). */
+    /** `id` del control en compacto (enlaza la etiqueta). Por defecto, uno único por instancia (`useId`). */
     id?: string;
     /**
      * `compact`: un `DropdownField` (etiqueta + control rectangular) con el icono y el nombre del tema actual — el del panel.
@@ -39,4 +74,4 @@ export interface ThemeSwitcherProps {
  * opciones exclusivas; en lista, las opciones desplegadas para el pie. Aplicar el tema y
  * recordarlo es del producto; el componente solo muestra y elige.
  */
-export declare function ThemeSwitcher({ value, onChange, labels, id, variant, layout, size, className }: ThemeSwitcherProps): import("react/jsx-runtime").JSX.Element;
+export declare function ThemeSwitcher({ value, onChange, labels, id: idProp, variant, layout, size, className }: ThemeSwitcherProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/Toast/Toaster.d.ts

@@ -47,6 +47,14 @@ export interface ToasterProps {
  * Punto de montaje de los avisos efímeros. Se monta **una vez** en la raíz de la
  * aplicación; los avisos se lanzan desde cualquier sitio con `toast(...)`.
  *
+ * **Solo puede haber un `Toaster` montado a la vez.** La cola (`toastManager`)
+ * es un único objeto de módulo y el `Toaster` no la aísla: dos montados pintan
+ * cada aviso dos veces, el último que monta impone su `duration` a todos
+ * (`setToastDefaultDuration` escribe una variable global, la que usa un aviso
+ * actualizado por `id`) y los dos sincronizan la misma lista de avisos vivos de
+ * `toast.dismiss()`. Para otra posición u otra duración se cambian las props de
+ * ese único `Toaster` o se pasa `duration` al aviso.
+ *
  * La cara del aviso es la del `Alert` —mismo relleno, mismo borde, misma
  * tipografía y las mismas cuatro intenciones, sobre el juego de tokens
  * `alert.*`—; lo propio del toast es la capa, la posición, el apilado y el

package/dist/_types/molecules/UserMenu/UserMenu.d.ts

@@ -30,5 +30,11 @@ export interface UserMenuProps {
     renderLink?: (props: MenuRenderLinkProps) => ReactNode;
     onOpenChange?: (open: boolean) => void;
     defaultOpen?: boolean;
+    /**
+     * Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye).
+     * Va al disparador: es el único nodo que el componente pinta en su sitio (el
+     * panel sale por un portal).
+     */
+    className?: string;
 }
-export declare function UserMenu({ name, email, avatarUrl, notificationCount, items, label, compact, renderLink, onOpenChange, defaultOpen, }: UserMenuProps): import("react/jsx-runtime").JSX.Element;
+export declare function UserMenu({ name, email, avatarUrl, notificationCount, items, label, compact, renderLink, onOpenChange, defaultOpen, className, }: UserMenuProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/molecules/_shared/calendarGrid.d.ts

@@ -93,6 +93,15 @@ export interface CalendarMonthNavOptions {
  * sin mover el foco.
  */
 export declare function renderCalendarMonthNav({ block, title, titleId, navigable, previousLabel, nextLabel, prevDisabled, nextDisabled, onPrev, onNext, chevronSize, onTitleClick, titleExpanded, titleRef, children, }: CalendarMonthNavOptions): import("react/jsx-runtime").JSX.Element;
+/**
+ * El «hoy» de un calendario: el que pasa el consumidor o, sin él, la fecha
+ * actual **calculada una vez por montaje** —no en cada render—. En SSR el
+ * servidor y el navegador calculan cada uno el suyo, y alrededor de la
+ * medianoche (o con husos distintos) no coinciden: React avisa de un
+ * desajuste de hidratación. Para evitarlo, la app pasa `today` desde el
+ * servidor a los dos lados.
+ */
+export declare function useToday(today?: Date): Date;
 export interface UseCalendarGridNavigationOptions {
     /** Mes visible */
     month: Date;
@@ -100,6 +109,8 @@ export interface UseCalendarGridNavigationOptions {
     onMonthChange: (month: Date) => void;
     /** Fecha seleccionada, si la hay: es la primera candidata a llevar el tabindex */
     selected?: Date | null;
+    /** El «hoy» del calendario (`useToday`): segundo candidato al tabindex. */
+    today: Date;
     /**
      * Activación de la celda enfocada con Enter/Espacio. Solo para rejillas cuya
      * celda no es un `<button>` (que ya lo resuelve el navegador).
@@ -126,12 +137,14 @@ export interface CalendarGridNavigation {
  * moverse de día, Inicio/Fin dentro de la semana, RePág/AvPág de mes y con
  * Mayús de año.
  */
-export declare function useCalendarGridNavigation({ month, onMonthChange, selected, onActivate, minDate, maxDate, }: UseCalendarGridNavigationOptions): CalendarGridNavigation;
+export declare function useCalendarGridNavigation({ month, onMonthChange, selected, today, onActivate, minDate, maxDate, }: UseCalendarGridNavigationOptions): CalendarGridNavigation;
 export interface UseCalendarWeekNavigationOptions {
     /** Lunes de la semana visible */
     weekStart: Date;
     /** Se llama cuando el teclado saca el foco fuera de la semana visible */
     onWeekChange: (weekStart: Date) => void;
+    /** El «hoy» del calendario (`useToday`): candidato al tabindex de la semana. */
+    today: Date;
     /** Activación de la columna enfocada con Enter/Espacio */
     onActivate?: (date: Date) => void;
     minDate?: Date;
@@ -147,4 +160,4 @@ export interface UseCalendarWeekNavigationOptions {
  * fila de celdas, así que arriba y abajo no llevan a ninguna otra parte y se
  * quedan recorriendo los días, como ↑/↓ en una lista.
  */
-export declare function useCalendarWeekNavigation({ weekStart, onWeekChange, onActivate, minDate, maxDate, }: UseCalendarWeekNavigationOptions): CalendarGridNavigation;
+export declare function useCalendarWeekNavigation({ weekStart, onWeekChange, today, onActivate, minDate, maxDate, }: UseCalendarWeekNavigationOptions): CalendarGridNavigation;

package/dist/_types/molecules/_shared/dialogSurface.d.ts

@@ -19,7 +19,12 @@ export interface DialogHeaderProps {
     className: string;
     children: ReactNode;
 }
-/** Cabecera del diálogo, en una de sus dos colocaciones. */
+/**
+ * Cabecera del diálogo, en una de sus dos colocaciones. Es un `<div>`, no un
+ * `<header>`: el diálogo sale por un portal al `<body>`, fuera de cualquier
+ * `<main>`/`<section>`, y ahí un `<header>` es un `banner` — el segundo de la
+ * página, junto al de la aplicación. El diálogo ya se nombra por su título.
+ */
 export declare function DialogHeader({ layout, noTitle, className, children }: DialogHeaderProps): import("react/jsx-runtime").JSX.Element;
 /**
  * Pie de acciones. Fila a la derecha; por debajo del punto de ruptura, botones

package/dist/_types/molecules/_shared/dropdownItems.d.ts

@@ -68,8 +68,6 @@ export type MenuRenderLinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement>
     children: ReactNode;
     className: string;
 };
-/** Reenvía TODO lo que inyecta Base UI: un renderLink que solo copie href/className rompe el menú. */
-export declare function defaultRenderLink({ children, ...props }: MenuRenderLinkProps): import("react/jsx-runtime").JSX.Element;
 interface RenderDropdownItemsOptions {
     items: MenuItem[];
     itemClass: (destructive?: boolean) => string;

package/dist/_types/sections/AppHeader/AppHeader.d.ts

@@ -57,6 +57,8 @@ export interface AppHeaderProps {
     menuCloseLabel?: string;
     /** id de la sidebar que gobierna el botón (`aria-controls`). */
     sidebarId?: string;
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /**
  * La barra superior de la aplicación, en todos los anchos. A la izquierda el
@@ -64,4 +66,4 @@ export interface AppHeaderProps {
  * escritorio; a la derecha, notificaciones y cuenta. Entre medias, lo que la
  * página necesite. Con `logo`, la marca del producto va justo tras el botón.
  */
-export declare function AppHeader({ logo, logoHref, logoLabel, renderLogoLink, start, notifications, end, menuLabel, menuCloseLabel, sidebarId, }: AppHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppHeader({ logo, logoHref, logoLabel, renderLogoLink, start, notifications, end, menuLabel, menuCloseLabel, sidebarId, className, }: AppHeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/sections/AppShell/AppShell.d.ts

@@ -41,6 +41,11 @@ export interface AppShellProps {
      * él, sale de `appShell.skipToContent` del `BrandMessagesProvider`.
      */
     skipLabel?: string;
+    /**
+     * Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye).
+     * Va al contenedor `.app-shell`, no al enlace de salto que lo precede.
+     */
+    className?: string;
 }
 /**
  * El único texto que el armazón dice por su cuenta, y es **cromo**: el enlace
@@ -59,4 +64,4 @@ export interface AppShellMessages {
  * modo y su asa) y `SidebarNav` (rail). Persistir el estado es del producto:
  * `onSidebarChange` / `onSidebarWidthChange` avisan de cada cambio.
  */
-export declare function AppShell({ banner, header, sidebar, children, contentFlush, defaultSidebar, sidebarState, onSidebarChange, defaultSidebarWidth, onSidebarWidthChange, skipLabel, }: AppShellProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppShell({ banner, header, sidebar, children, contentFlush, defaultSidebar, sidebarState, onSidebarChange, defaultSidebarWidth, onSidebarWidthChange, skipLabel, className, }: AppShellProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/sections/LegalFooter/LegalFooter.d.ts

@@ -35,6 +35,12 @@ export interface LegalFooterProps {
     width?: ContainerWidth;
     /** Pie sobre superficie oscura. */
     surface?: 'dark';
+    /**
+     * Elemento raíz (default `'footer'`, el `contentinfo` de la página). `'div'`
+     * cuando va dentro de otro pie: un `<footer>` no puede contener otro, y la
+     * página tendría dos `contentinfo`. `SiteFooter` lo pone solo en su `legal`.
+     */
+    as?: 'footer' | 'div';
     className?: string;
 }
 /**
@@ -44,4 +50,4 @@ export interface LegalFooterProps {
  * interior. Es el pie de las aplicaciones de la suite; la web tiene su pie
  * propio con más cosas.
  */
-export declare function LegalFooter({ label, title, links, renderLink, width, surface, className, }: LegalFooterProps): import("react/jsx-runtime").JSX.Element;
+export declare function LegalFooter({ label, title, links, renderLink, width, surface, as: Root, className, }: LegalFooterProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/sections/Sidebar/Sidebar.d.ts

@@ -41,6 +41,8 @@ export interface SidebarProps {
     resizerValueText?: (width: number) => string;
     /** Fuerza el modo sin `AppShell` (Storybook, pruebas). Con shell, lo decide el shell. */
     mode?: 'open' | 'rail';
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
 }
 /**
  * La barra lateral de la aplicación. En escritorio es una columna con tres
@@ -49,7 +51,7 @@ export interface SidebarProps {
  * grupos de navegación se abren como menú) y cerrada. En móvil es un cajón
  * que entra por la izquierda y se cierra al navegar.
  */
-export declare function Sidebar({ logo, children, footer, id, label, resizerLabel, resizerValueText, mode, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare function Sidebar({ logo, children, footer, id, label, resizerLabel, resizerValueText, mode, className, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
 export interface SidebarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
 }

package/dist/_types/sections/SiteFooter/SiteFooter.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import { type ContainerWidth } from '../../atoms/Container/Container';
 import { type HeadingLevel } from '../../atoms/Heading/Heading';
 import './SiteFooter.css';
@@ -39,7 +39,11 @@ export interface SiteFooterProps {
      * componentes del sistema; el pie solo le reserva el sitio.
      */
     aside?: ReactNode;
-    /** Bloque legal bajo el pie, separado por una línea. Se espera un `LegalFooter`. */
+    /**
+     * Bloque legal bajo el pie, separado por una línea. Se espera un
+     * `LegalFooter`, que aquí se monta como `<div>` (`as="div"`): dentro de este
+     * `<footer>` no puede ir otro, ni la página tener dos `contentinfo`.
+     */
     legal?: ReactNode;
     /** Nivel semántico del título de cada columna. Por defecto `2`. */
     columnTitleLevel?: HeadingLevel;

package/dist/_types/sections/SiteHeader/SiteHeader.d.ts

@@ -47,7 +47,7 @@ export interface SiteHeaderProps {
     children?: ReactNode;
     /** Ajustes del sitio al final del panel (el selector de tema). */
     settings?: ReactNode;
-    /** id del panel — `aria-controls` del botón de menú. */
+    /** id del panel — `aria-controls` del botón de menú. Por defecto, uno único por instancia (`useId`). */
     panelId?: string;
     /** Controles del producto en la barra (acceso, CTA…). */
     actions?: ReactNode;
@@ -74,4 +74,4 @@ export interface SiteHeaderMessages {
     /** Texto accesible del enlace del logotipo. */
     logo: string;
 }
-export declare function SiteHeader({ logoHref, logoLabel, menuLabel, menuCloseLabel, logoSize, logo, menuButtonSize, renderLogoLink, width, open, onOpenChange, children, settings, panelId, actions, language, }: SiteHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function SiteHeader({ logoHref, logoLabel, menuLabel, menuCloseLabel, logoSize, logo, menuButtonSize, renderLogoLink, width, open, onOpenChange, children, settings, panelId: panelIdProp, actions, language, }: SiteHeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/templates/ConnectorAuth/ConnectorAuthShell.d.ts

@@ -38,6 +38,11 @@ export interface ConnectorAuthChromeProps {
      * aplican —ni el `ref`, porque no hay marco al que engancharlo.
      */
     shell?: boolean;
+    /**
+     * Se añade DESPUÉS de las clases propias. Va al contenido de la pantalla
+     * (las dos columnas), con marco y sin él.
+     */
+    className?: string;
 }
 export interface ConnectorAuthShellProps extends ConnectorAuthChromeProps {
     /** El título de la pantalla: `Heading` de nivel 1 vía `PageIntro`, columna izquierda. */
@@ -50,8 +55,6 @@ export interface ConnectorAuthShellProps extends ConnectorAuthChromeProps {
     aside?: ReactNode;
     /** La columna de la derecha: la decisión —el formulario, la ficha, los botones—. */
     children: ReactNode;
-    /** Se añade DESPUÉS de las clases propias. */
-    className?: string;
 }
 /**
  * El marco de las pantallas del conector: **el mismo que el de acceso**.

package/dist/_types/templates/ConnectorAuth/ConnectorConsentPage.d.ts

@@ -160,4 +160,4 @@ export interface ConnectorConsentPageProps extends ConnectorAuthChromeProps {
  * `action` es una pantalla de React con dos callbacks. Las dos formas pintan
  * exactamente lo mismo.
  */
-export declare function ConnectorConsentPage({ clientName, productName, accountEmail, scope, redirectHost, action, hiddenFields, decisionName, approveValue, denyValue, onApprove, onDeny, denyHref, initialFocus, title, intro, redirectNotice, approveLabel, denyLabel, scopeReadLabel, scopeWriteLabel, expandLabel, collapseLabel, valueQuotes, summaryLabels, links, header, footer, preferences, preferencesLabel, id, shell, }: ConnectorConsentPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function ConnectorConsentPage({ clientName, productName, accountEmail, scope, redirectHost, action, hiddenFields, decisionName, approveValue, denyValue, onApprove, onDeny, denyHref, initialFocus, title, intro, redirectNotice, approveLabel, denyLabel, scopeReadLabel, scopeWriteLabel, expandLabel, collapseLabel, valueQuotes, summaryLabels, links, header, footer, preferences, preferencesLabel, id, shell, className, }: ConnectorConsentPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/_types/templates/ConnectorAuth/ConnectorExternalSignInPage.d.ts

@@ -124,4 +124,4 @@ export interface ConnectorExternalSignInPageProps extends ConnectorAuthChromePro
  * `Card` dentro de una columna estrecha, sin cabecera pública ni pie: al
  * cablearla, ese molde propio se retira y lo pone la plantilla.
  */
-export declare function ConnectorExternalSignInPage({ platformName, organization, organizationDefaultValue, organizationName, action, onSubmit, hiddenFields, error, title, intro, signingInTo, valueQuotes, organizationLabel, submitLabel, extra, links, header, footer, preferences, preferencesLabel, id, shell, }: ConnectorExternalSignInPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function ConnectorExternalSignInPage({ platformName, organization, organizationDefaultValue, organizationName, action, onSubmit, hiddenFields, error, title, intro, signingInTo, valueQuotes, organizationLabel, submitLabel, extra, links, header, footer, preferences, preferencesLabel, id, shell, className, }: ConnectorExternalSignInPageProps): import("react/jsx-runtime").JSX.Element;