@studiolxd/brand 38.12.4

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

@@ -0,0 +1,103 @@
+import type { ReactNode } from 'react';
+import './Table.css';
+export interface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {
+    /**
+     * Texto de `<caption>` (se oculta visualmente). **Opcional**: sin `caption` no se
+     * renderiza el `<caption>` — el consumidor decide su estrategia de accessible-name
+     * (p. ej. `aria-label` vía rest).
+     */
+    caption?: string;
+    /** Variante de densidad. Default: "md" */
+    size?: 'sm' | 'md';
+}
+export interface TableHeaderProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
+    /** Si esta columna admite ordenación */
+    sortable?: boolean;
+    /** Dirección activa. Solo relevante si sortable */
+    sorted?: 'asc' | 'desc' | false;
+    /** Handler de click/teclado. Solo relevante si sortable */
+    onSort?: () => void;
+    /** Marca esta columna como columna de acciones: ancho mínimo y cabecera oculta visualmente */
+    actions?: boolean;
+    /** Texto accesible de la cabecera de acciones. Default: «Acciones» (castellano). Una app multiidioma debe pasarlo traducido. */
+    actionsLabel?: string;
+    /**
+     * Pega la columna al borde final (`inset-inline-end: 0`) cuando la tabla
+     * desborda su contenedor: la columna de acciones se queda alcanzable con
+     * scroll horizontal en vez de caer fuera del recorte. Requiere el mismo
+     * `sticky="end"` en la `Table.Cell` equivalente de cada fila.
+     */
+    sticky?: 'end';
+    /**
+     * Texto accesible del estado de ordenación ascendente. Default: "Ordenado ascendente"
+     * (castellano). Una app multiidioma debe pasarlo traducido.
+     */
+    sortedAscLabel?: string;
+    /** Texto accesible del estado descendente. Default: «Ordenado descendente» (castellano). Una app multiidioma debe pasarlo traducido. */
+    sortedDescLabel?: string;
+    /** Texto accesible de la columna ordenable sin ordenar. Default: «Activar ordenación» (castellano). Una app multiidioma debe pasarlo traducido. */
+    sortableLabel?: string;
+    /**
+     * Impide que el rótulo de esta columna se parta en dos líneas. Mismo valor
+     * que el `nowrap` de la `Table.Cell` de esta columna cuando el encabezado
+     * comparte el motivo (un rótulo con una unidad pegada, «Importe (€)»).
+     */
+    nowrap?: boolean;
+    children?: ReactNode;
+}
+/** onClick tipado como () => void para mantener la API de interactividad con teclado */
+export interface TableRowProps extends Omit<React.HTMLAttributes<HTMLTableRowElement>, 'onClick'> {
+    onClick?: () => void;
+    /** Alternativa explícita a onClick para control manual */
+    interactive?: boolean;
+    /** Marca la fila como seleccionada: se dice con tinta y peso, sin fondo. */
+    selected?: boolean;
+    /**
+     * Nombre accesible de la fila. Por defecto el rol `row` toma su nombre del
+     * contenido de sus celdas; pásalo solo cuando ese texto no identifique la
+     * fila (celdas de solo iconos, datos crípticos). Default: castellano — no
+     * hay texto por defecto, es el consumidor quien lo escribe.
+     */
+    label?: string;
+    children: ReactNode;
+}
+export interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
+    /**
+     * Pega la celda al borde final (`inset-inline-end: 0`) cuando la tabla
+     * desborda su contenedor. Mismo valor que el `sticky` de la `Table.Header`
+     * de esta columna.
+     */
+    sticky?: 'end';
+    /**
+     * Marca esta celda como parte de la columna de acciones: mismo valor que el
+     * `actions` de la `Table.Header` de esta columna. Impide que su contenido
+     * (un enlace o botón de dos palabras) se parta en dos líneas cuando la
+     * columna, ya encogida a su mínimo, sobra ancho.
+     */
+    actions?: boolean;
+    /**
+     * Impide el salto de línea del contenido de esta celda: un valor que no
+     * debe partirse (una URL, un identificador). La tabla ya resuelve el
+     * desborde con scroll horizontal (`table__wrapper`) y, si la columna lo
+     * necesita, con una columna de acciones fija (`sticky`) — `nowrap` no
+     * cambia ese mecanismo, solo evita que este valor concreto se reparta en
+     * dos líneas dentro de su celda.
+     */
+    nowrap?: boolean;
+    children?: ReactNode;
+}
+export declare function TableHead({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>): import("react/jsx-runtime").JSX.Element;
+export declare function TableFooter({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>): import("react/jsx-runtime").JSX.Element;
+export declare function TableBody({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>): import("react/jsx-runtime").JSX.Element;
+export declare function TableHeader({ sortable, sorted, onSort, actions, actionsLabel, sortedAscLabel, sortedDescLabel, sortableLabel, sticky, nowrap, children, className, scope, ...rest }: TableHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function TableRow({ onClick, interactive, selected, label, children, className, ...rest }: TableRowProps): import("react/jsx-runtime").JSX.Element;
+export declare function TableCell({ sticky, actions, nowrap, children, className, ...rest }: TableCellProps): import("react/jsx-runtime").JSX.Element;
+export declare function Table({ caption, children, size, className, ...rest }: TableProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Table {
+    var Head: typeof TableHead;
+    var Footer: typeof TableFooter;
+    var Header: typeof TableHeader;
+    var Body: typeof TableBody;
+    var Row: typeof TableRow;
+    var Cell: typeof TableCell;
+}

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

@@ -0,0 +1,49 @@
+import { type MouseEvent } from 'react';
+import './TableOfContents.css';
+export interface TableOfContentsItem {
+    /** `id` del encabezado al que apunta la entrada. El enlace será `#id`. */
+    id: string;
+    /** Texto de la entrada: el del encabezado. */
+    label: string;
+    /** Nivel del encabezado (`2` para un `h2`, `3` para un `h3`…). La sangría es relativa al nivel más alto de la lista. */
+    level: number;
+}
+export interface TableOfContentsProps extends Omit<React.ComponentPropsWithoutRef<'nav'>, 'title'> {
+    /** Entradas, en el orden en que aparecen en el documento. */
+    items: TableOfContentsItem[];
+    /**
+     * `id` de la sección en la que está el lector. El scroll lo observa el
+     * consumidor: el índice solo pinta lo que le digan.
+     */
+    activeId?: string;
+    /**
+     * Nombre accesible del `nav`. Por defecto, en castellano.
+     * @default 'En esta página'
+     */
+    ariaLabel?: string;
+    /** Rótulo visible sobre la lista. Sin él, no se pinta ninguno. */
+    title?: string;
+    /**
+     * Fija el índice al hacer scroll (`position: sticky`). La distancia al borde
+     * y el alto máximo son tokens (`--table-of-contents-sticky-*`).
+     */
+    sticky?: boolean;
+    /** Se llama al pulsar una entrada, además de seguir el ancla. Para desplazamiento suave o para cerrar un panel. */
+    onItemClick?: (item: TableOfContentsItem, event: MouseEvent<HTMLAnchorElement>) => void;
+    /** Se añade DESPUÉS de las clases propias. */
+    className?: string;
+}
+/**
+ * Índice de anclas de la página: la lista de encabezados del documento, con
+ * sangría por nivel y una marca en la sección en la que está el lector.
+ *
+ * Es un componente **controlado y sin scroll propio**: no observa la página ni
+ * decide qué está a la vista. El consumidor calcula `activeId` (con un
+ * `IntersectionObserver` o con el hash de la URL) y el índice lo pinta. Así el
+ * mismo componente sirve para un índice con scroll-spy, para uno que solo
+ * sigue al hash y para uno estático.
+ *
+ * `{...rest}` (`id`, `data-*`, `role`…) se reenvía al `<nav>`. El nombre
+ * accesible sigue siendo `ariaLabel`.
+ */
+export declare const TableOfContents: import("react").ForwardRefExoticComponent<TableOfContentsProps & import("react").RefAttributes<HTMLElement>>;

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

@@ -0,0 +1,35 @@
+import { type ComponentPropsWithoutRef } from 'react';
+import './TextareaField.css';
+export interface TextareaFieldProps extends Omit<ComponentPropsWithoutRef<'textarea'>, 'value' | 'defaultValue' | 'rows'> {
+    id: string;
+    label: string;
+    /**
+     * Oculta la etiqueta a la vista (sigue leyéndola el lector de pantalla).
+     * Por defecto `false`: la etiqueta se ve, como en `SelectField`.
+     * 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;
+    name?: string;
+    placeholder?: string;
+    value?: string;
+    defaultValue?: string;
+    rows?: number;
+    disabled?: boolean;
+    readOnly?: boolean;
+    error?: boolean;
+    errorMessage?: string;
+    helperText?: string;
+    size?: 'sm' | 'md' | 'lg';
+    onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;
+    onBlur?: React.FocusEventHandler<HTMLTextAreaElement>;
+    onFocus?: React.FocusEventHandler<HTMLTextAreaElement>;
+}
+/**
+ * El `ref` y el resto de props nativas de `<textarea>` van al `<textarea>`
+ * interno (react-hook-form `register()`, `aria-*`, `data-*`…); el `className`,
+ * al contenedor.
+ */
+export declare const TextareaField: import("react").ForwardRefExoticComponent<TextareaFieldProps & import("react").RefAttributes<HTMLTextAreaElement>>;

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

@@ -0,0 +1,42 @@
+import './ThemeSwitcher.css';
+export type Theme = 'light' | 'dark' | 'system';
+export interface ThemeSwitcherLabels {
+    /** Nombre accesible del control. */
+    group?: string;
+    light?: string;
+    dark?: string;
+    system?: 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;
+    labels?: ThemeSwitcherLabels;
+    /** `id` del control en compacto (enlaza la etiqueta). */
+    id?: string;
+    /**
+     * `compact`: un `DropdownField` (etiqueta + control rectangular) con el icono y el nombre del tema actual — el del panel.
+     * `list`: las tres opciones desplegadas en línea — el del pie.
+     * `icon`: solo el icono del tema actual, como botón de icono que abre el menú — para una barra sin sitio.
+     */
+    variant?: 'compact' | 'list' | 'icon';
+    /** Talla del control compacto (32/40/48): `lg` en superficies públicas, `md` en las aplicaciones. */
+    /**
+     * Disposición de la etiqueta. `inline` (por defecto) la pone delante del
+     * control, que es como va en la barra y en el panel; `stacked` la pone
+     * encima con el control a todo el ancho, que es la forma del resto de
+     * campos de un formulario — la de «Mi cuenta», donde este selector es un
+     * ajuste más y no un control de chrome.
+     */
+    layout?: 'inline' | 'stacked';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+/**
+ * Selector de tema: claro, oscuro o el del sistema. Mismo patrón que el
+ * selector de idioma: en compacto, un campo desplegable con etiqueta y
+ * 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;

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

@@ -0,0 +1,44 @@
+import type { TimeValue } from '../../atoms/TimeSelect/TimeSelect';
+import './TimeField.css';
+export interface TimeFieldProps {
+    /** `id` del control. Si no se pasa, se genera con `useId`. */
+    id?: string;
+    label: string;
+    /**
+     * Oculta la etiqueta a la vista (sigue leyéndola el lector de pantalla).
+     * Por defecto `false`: la etiqueta se ve, como en el resto de campos.
+     * 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;
+    value?: TimeValue | null;
+    /** Paso en minutos. Default: 5. */
+    step?: number;
+    /** Nombre del campo en el formulario: se monta un input oculto con `HH:MM`. */
+    name?: string;
+    size?: 'sm' | 'md' | 'lg';
+    disabled?: boolean;
+    readOnly?: boolean;
+    /** Campo obligatorio: parte del contrato de campo del sistema. */
+    required?: boolean;
+    /** Marca el control en error sin mensaje. Un `errorMessage` ya lo implica. */
+    error?: boolean;
+    /** Mensaje de error: se anuncia (`role="alert"`) y pone el control en error. */
+    errorMessage?: string;
+    /** Texto de ayuda, enlazado por `aria-describedby`. */
+    helperText?: string;
+    /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
+    className?: string;
+    /** aria-label del desplegable de horas. Default: "Horas" (castellano). */
+    hoursLabel?: string;
+    /** aria-label del desplegable de minutos. Default: "Minutos" (castellano). */
+    minutesLabel?: string;
+    onChange?: (value: TimeValue) => void;
+    onBlur?: React.FocusEventHandler<HTMLButtonElement>;
+}
+/**
+ * El `TimeSelect` como campo de formulario. El control son dos desplegables de
+ * Base UI: el `ref` va al de horas para que react-hook-form pueda enfocarlo al
+ * fallar la validación; el `className`, al contenedor.
+ */
+export declare const TimeField: import("react").ForwardRefExoticComponent<TimeFieldProps & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -0,0 +1,42 @@
+import { type ToastIntent } from './toast';
+import './Toast.css';
+export type ToastPosition = 'bottom-right' | 'bottom-left' | 'bottom-center' | 'top-right' | 'top-left' | 'top-center';
+export interface ToasterProps {
+    /** Esquina de la ventana donde se monta la pila. Default: `bottom-right`. */
+    position?: ToastPosition;
+    /**
+     * Nombre accesible de la región de notificaciones. Default: «Notificaciones»
+     * (castellano). Una app multiidioma debe pasarlo traducido.
+     */
+    containerAriaLabel?: string;
+    /**
+     * Etiqueta accesible del aspa de cierre. Default: «Cerrar» (castellano).
+     * Una app multiidioma debe pasarla traducida.
+     */
+    closeLabel?: string;
+    /** Muestra el aspa de cierre en cada aviso. Default: `true`. */
+    closeButton?: boolean;
+    /**
+     * Milisegundos que vive un aviso antes de cerrarse solo. Default: 5000.
+     * El reloj se detiene mientras el puntero o el foco están dentro de la pila.
+     * `Infinity` (o `duration: Infinity` en la llamada) lo deja fijo.
+     */
+    duration?: number;
+    /** Aire entre avisos desplegados, en píxeles. Default: 8 (`toast.gap`). */
+    gap?: number;
+    /** Número de avisos visibles a la vez; el resto espera turno. Default: 3. */
+    visibleToasts?: number;
+    /** Despliega la pila en vez de dejarla recogida bajo el aviso más nuevo. */
+    expand?: boolean;
+}
+/**
+ * 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(...)`.
+ *
+ * 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
+ * auto-cierre (`toast.*`).
+ */
+export declare function Toaster({ position, containerAriaLabel, closeLabel, closeButton, duration, gap, visibleToasts, expand, }: ToasterProps): import("react/jsx-runtime").JSX.Element;
+export type { ToastIntent };

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

@@ -0,0 +1,101 @@
+import type { ReactNode } from 'react';
+/**
+ * Intención del aviso. Es la misma escala que la variante del `Alert`, más los
+ * dos casos que solo tienen sentido en una cola: `info` (que cae en el neutro,
+ * como en el `Alert`) y `loading` (un aviso que espera y no se cierra solo).
+ */
+export type ToastIntent = 'default' | 'success' | 'error' | 'warning' | 'info' | 'loading';
+/** Acción opcional del aviso: un botón con su rótulo y su manejador. */
+export interface ToastActionDescriptor {
+    /** Rótulo visible del botón. Lo pone el consumidor: no hay default castellano. */
+    label: string;
+    onClick: () => void;
+}
+export interface ToastOptions {
+    /**
+     * Identificador del aviso. Si ya hay uno vivo con ese `id`, la llamada **lo
+     * actualiza en su sitio** en vez de apilar otro: es el patrón
+     * `const id = toast.loading(…)` → `toast.success(…, { id })`.
+     */
+    id?: string;
+    /** Segunda línea del aviso, bajo el título. */
+    description?: ReactNode;
+    /**
+     * Milisegundos que vive el aviso. Por defecto, el `duration` del `Toaster`
+     * (5000). `Infinity` lo deja fijo: solo se va con el aspa.
+     */
+    duration?: number;
+    /** Botón de acción del aviso. */
+    action?: ToastActionDescriptor;
+    /** Se llama al cerrarse el aviso, sea por el aspa o por agotar su tiempo. */
+    onClose?: () => void;
+}
+/** Mensaje de `toast.promise`: un rótulo suelto o el juego completo de opciones. */
+export type ToastMessage = string | (ToastOptions & {
+    title: string;
+});
+export interface ToastPromiseMessages<Value> {
+    loading: ToastMessage;
+    success: ToastMessage | ((value: Value) => ToastMessage);
+    error: ToastMessage | ((error: unknown) => ToastMessage);
+}
+/**
+ * La cola de Base UI. Vive fuera de React —es lo que permite lanzar un aviso
+ * desde un manejador, un `catch` o un módulo sin componente— y el `Toaster` la
+ * conecta con el árbol pasándosela a su `Toast.Provider`.
+ */
+export declare const toastManager: import("@base-ui/react").ToastManager<any>;
+/**
+ * Vida por defecto de un aviso, en milisegundos. No es un token: la mide el
+ * motor de la cola en JS y un token CSS no movería nada. Cinco segundos son los
+ * que tarda en leerse un rótulo corto sin llegar a molestar; el reloj se para al
+ * pasar el ratón o al entrar el foco.
+ */
+export declare const TOAST_DURATION = 5000;
+/**
+ * El `Toaster` publica aquí su `duration` para que un aviso actualizado por `id`
+ * herede la misma vida que uno recién lanzado.
+ * @internal
+ */
+export declare function setToastDefaultDuration(duration: number): void;
+/**
+ * El `Toaster` sincroniza aquí la lista real de avisos en pantalla: es lo que
+ * mantiene `dismiss()` sin argumento pegado a la realidad, incluidos los avisos
+ * que abre `toast.promise`.
+ * @internal
+ */
+export declare function syncLiveToasts(ids: readonly string[]): void;
+/**
+ * Lanza un aviso efímero. Devuelve su `id`, que sirve para actualizarlo
+ * (`{ id }`) o para cerrarlo (`toast.dismiss(id)`).
+ *
+ * Requiere un `<Toaster />` montado en la raíz de la aplicación: la cola vive
+ * fuera de React, pero sin punto de montaje no hay dónde pintar.
+ */
+declare function base(title: ReactNode, options?: ToastOptions): string;
+export declare const toast: typeof base & {
+    /** Aviso neutro, sin intención. Igual que `toast(…)`. */
+    message: (title: ReactNode, options?: ToastOptions) => string;
+    /** Algo ha salido bien. */
+    success: (title: ReactNode, options?: ToastOptions) => string;
+    /** Algo ha fallado. Interrumpe al lector de pantalla. */
+    error: (title: ReactNode, options?: ToastOptions) => string;
+    /** Algo pide atención antes de seguir. Interrumpe al lector de pantalla. */
+    warning: (title: ReactNode, options?: ToastOptions) => string;
+    /** Un dato de contexto. Sin relleno propio: cae en el neutro, como en el `Alert`. */
+    info: (title: ReactNode, options?: ToastOptions) => string;
+    /**
+     * Aviso de espera: **no se cierra solo**. Se resuelve actualizándolo con su
+     * `id` (`toast.success('Hecho', { id })`) o con `toast.dismiss(id)`.
+     */
+    loading: (title: ReactNode, options?: ToastOptions) => string;
+    /** Cierra un aviso por `id`, o todos los que haya en pantalla si no se pasa ninguno. */
+    dismiss: (id?: string) => void;
+    /**
+     * Sigue una promesa con un solo aviso: espera mientras corre y se convierte en
+     * éxito o error al resolverse. Devuelve la misma promesa, así que se puede
+     * seguir encadenando (y hay que capturar el rechazo igual que en el original).
+     */
+    promise: <Value>(promise: Promise<Value>, messages: ToastPromiseMessages<Value>) => Promise<Value>;
+};
+export {};

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

@@ -0,0 +1,93 @@
+import { type ReactNode } from 'react';
+import './TreeView.css';
+export interface TreeViewNode {
+    /** Identificador único en todo el árbol. */
+    id: string;
+    /** Rótulo de la fila. */
+    label: ReactNode;
+    /** Marca opcional delante del rótulo (una carpeta, un tipo de contenido). */
+    icon?: ReactNode;
+    /**
+     * Marca de la rama abierta. Sin ella se usa `icon` en los dos estados: es
+     * para el par carpeta cerrada / carpeta abierta.
+     */
+    iconExpanded?: ReactNode;
+    /**
+     * Ranura a la derecha de la fila: el menú de acciones de esa rama (un `Menu`
+     * con su `Button variant="ghost" iconOnly`). Se ve al pasar el puntero por
+     * la fila o cuando el foco está dentro de ella, pero **ocupa su sitio
+     * siempre**, así que el rótulo no se mueve. Los clics y el teclado de la
+     * ranura no llegan al árbol: abrir el menú no elige la fila.
+     */
+    actions?: ReactNode;
+    /**
+     * La fila es un destino válido de lo que se está arrastrando. El arrastre lo
+     * lleva la aplicación (dnd-kit); el árbol solo lo viste.
+     */
+    dropTarget?: boolean;
+    /**
+     * La fila NO puede recibir lo que se está arrastrando. Se atenúa y cambia el
+     * cursor, pero **sigue siendo navegable**: no es un nodo deshabilitado, así
+     * que no se anuncia con `aria-disabled`; el estado va en `data-drop`.
+     */
+    dropDisabled?: boolean;
+    /** Ramas hijas. Un nodo sin `children` es una hoja. */
+    children?: TreeViewNode[];
+    /**
+     * No se puede elegir. Sigue siendo alcanzable con el teclado y se anuncia
+     * como deshabilitado, como pide el patrón: no desaparece del árbol.
+     */
+    disabled?: boolean;
+}
+export interface TreeViewProps extends Omit<React.ComponentPropsWithoutRef<'ul'>, 'onSelect'> {
+    /** El árbol. */
+    items: TreeViewNode[];
+    /** Ramas abiertas (controlado). */
+    expanded?: string[];
+    /** Ramas abiertas al montar (no controlado). */
+    defaultExpanded?: string[];
+    /** Se llama con la lista de ramas abiertas. */
+    onExpandedChange?: (expanded: string[]) => void;
+    /** Nodo elegido (controlado). */
+    selected?: string;
+    /** Nodo elegido al montar (no controlado). */
+    defaultSelected?: string;
+    /** Se llama con el id del nodo elegido. */
+    onSelectedChange?: (id: string) => void;
+    /**
+     * Nombre accesible del árbol. Default: «Árbol» (castellano). Una app
+     * multiidioma debe pasarlo traducido.
+     */
+    label?: string;
+    /**
+     * Nivel a partir del cual el rótulo se trunca con puntos suspensivos (el
+     * nombre entero queda en `title`). Default: 4 — en una barra lateral la
+     * sangría se come el ancho antes de eso.
+     */
+    truncateFromLevel?: number;
+    /**
+     * Referencia al elemento de cada fila, para colgarle un destino de arrastre
+     * (`setNodeRef` de dnd-kit). Se llama con el id del nodo y con el elemento
+     * de la fila —el que se pinta como destino—, y con `null` al desmontarla.
+     * No cambia el marcado: la fila sigue siendo el `role="treeitem"`.
+     */
+    nodeRef?: (id: string, el: HTMLElement | null) => void;
+    /** Se añade DESPUÉS de las clases propias. */
+    className?: string;
+}
+/**
+ * Un árbol con sangría: la matriz de contenidos de un curso, la estructura de
+ * carpetas de un espacio. Cada rama se abre y se cierra, y se elige un nodo.
+ *
+ * Implementa el patrón WAI-ARIA de **tree view** a mano —Base UI no trae árbol—:
+ * `role="tree"` con `treeitem` anidados, un solo punto de tabulación y recorrido
+ * completo con el teclado: flechas, Inicio/Fin, Intro/Espacio para elegir,
+ * salto por letra y `*` para abrir de una vez las ramas hermanas del nivel.
+ *
+ * Cada fila se viste como un **ítem de la barra lateral** (tokens
+ * `sidebar-nav.item-*`): la elegida se marca solo con el peso —sin color de
+ * marca— y el hover no pinta nada, como en `SidebarNav`. El relleno se reserva
+ * para el único estado que sí lo pide: la carpeta que puede recibir lo que se
+ * está arrastrando (`dropTarget`).
+ */
+export declare function TreeView({ items, expanded: expandedProp, defaultExpanded, onExpandedChange, selected: selectedProp, defaultSelected, onSelectedChange, label, truncateFromLevel, nodeRef, className, ...rest }: TreeViewProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,64 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+import { type UptimeBarsThresholds } from './uptimeStatus';
+import './UptimeBars.css';
+export type { UptimeBarsThresholds, UptimeBarsStatus } from './uptimeStatus';
+/** Un punto de la serie: un día, una hora, un despliegue. La tira no lo sabe. */
+export interface UptimeBarsPoint {
+    /**
+     * Porcentaje de disponibilidad del punto, de 0 a 100. `null` es **sin dato**
+     * —el monitor todavía no existía—, que no es lo mismo que 0 %.
+     */
+    value: number | null;
+    /** Cómo se llama el punto, ya escrito: «5 de septiembre». */
+    label: string;
+    /** Una línea de detalle para el bocadillo: «Sin incidencias», «Caído 2 h 14 min». */
+    detail?: string;
+}
+export interface UptimeBarsProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
+    /** La serie, en orden: el punto más antiguo primero. */
+    points: UptimeBarsPoint[];
+    /**
+     * La media del periodo, **ya escrita** por quien la calcula («99,98 % de
+     * disponibilidad»). Es obligatoria porque es la alternativa principal a la
+     * tira: el dato que se lee sin mirar treinta rectángulos ni abrir un bocadillo.
+     */
+    summary: ReactNode;
+    /** Nombre accesible de la tira. Default castellano: «Disponibilidad». */
+    label?: string;
+    /** Rótulo del extremo antiguo, bajo la primera barrita: «Hace 30 días». */
+    startLabel?: ReactNode;
+    /** Rótulo del extremo reciente, bajo la última barrita: «Hoy». */
+    endLabel?: ReactNode;
+    /** Cortes de color. Sin ellos, `UPTIME_BARS_DEFAULT_THRESHOLDS`. */
+    thresholds?: UptimeBarsThresholds;
+    /** Locale para formatear el porcentaje. Default `'es-ES'`. */
+    locale?: string;
+    /** Decimales del porcentaje. Default 2. */
+    maximumFractionDigits?: number;
+    /**
+     * Nombre accesible de cada barrita. Recibe el punto y su porcentaje ya
+     * formateado (`null` cuando no hay dato). Default castellano:
+     * «5 de septiembre: 100 %. Sin incidencias».
+     */
+    pointLabel?: (point: UptimeBarsPoint, formattedValue: string | null) => string;
+    /** Cómo se dice que un punto no tiene dato. Default castellano: «sin datos». */
+    noDataLabel?: string;
+    /**
+     * Bocadillo por barrita, con ratón y con teclado. Default `true`. Sin él las
+     * barritas dejan de recibir el foco: el detalle sigue en el nombre accesible,
+     * que un lector de pantalla recorre sin necesidad de tabular.
+     */
+    tooltips?: boolean;
+}
+/**
+ * La tira de disponibilidad: una barrita por punto de la serie y la media del
+ * periodo debajo.
+ *
+ * **No sabe de tiempo ni de dónde salen los datos.** No hay días, ni monitores,
+ * ni husos horarios: recibe N puntos con su porcentaje y su etiqueta, y pinta.
+ * Quien la usa decide si un punto es un día o una hora, y escribe las fechas.
+ *
+ * La lectura no depende del color: cada barrita lleva su nombre accesible
+ * completo, la serie es una lista ordenada y la media va siempre en texto.
+ */
+export declare const UptimeBars: import("react").ForwardRefExoticComponent<UptimeBarsProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/_types/molecules/UptimeBars/uptimeStatus.d.ts

@@ -0,0 +1,17 @@
+/** Los cortes que deciden el color de la barrita, en porcentaje. */
+export interface UptimeBarsThresholds {
+    /** A partir de aquí, el tramo bueno (rol `success`). */
+    ok?: number;
+    /** A partir de aquí y hasta `ok`, el tramo intermedio (rol `warning`). Por debajo, el malo (rol `error`). */
+    degraded?: number;
+}
+export type UptimeBarsStatus = 'ok' | 'degraded' | 'down' | 'empty';
+/**
+ * Los cortes por defecto, pensados en **tiempo caído al día**: hasta 5 minutos
+ * el día está bien (99,65 %), de 5 minutos a 1 hora está tocado (95,83 %), y de
+ * ahí para abajo está caído. El margen del verde es deliberado: un fallo
+ * aislado de comprobación no es un incidente y no debe pintar el día entero.
+ */
+export declare const UPTIME_BARS_DEFAULT_THRESHOLDS: Required<UptimeBarsThresholds>;
+/** El tramo de un punto según los cortes. `null` no es 0 %: es la ausencia de medida. */
+export declare function uptimeStatus(value: number | null, thresholds: Required<UptimeBarsThresholds>): UptimeBarsStatus;

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

@@ -0,0 +1,19 @@
+import type { ReactNode } from 'react';
+import type { MenuItem, MenuRenderLinkProps } from '../Menu/Menu';
+import './UserMenu.css';
+export interface UserMenuProps {
+    name: string;
+    email: string;
+    avatarUrl?: string;
+    /** Nombre accesible del botón. Por defecto, «Cuenta de ‹nombre›». */
+    label?: string;
+    /** Sin nombre — avatar, badge y chevron: para la barra del AppHeader. El nombre sigue en el panel y en el nombre accesible. */
+    compact?: boolean;
+    /** Número de notificaciones sin leer. Si es 0 o undefined, no se muestra el badge. */
+    notificationCount?: number;
+    items?: MenuItem[];
+    renderLink?: (props: MenuRenderLinkProps) => ReactNode;
+    onOpenChange?: (open: boolean) => void;
+    defaultOpen?: boolean;
+}
+export declare function UserMenu({ name, email, avatarUrl, notificationCount, items, label, compact, renderLink, onOpenChange, defaultOpen, }: UserMenuProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,35 @@
+import { type MessageTimestamp } from '../_shared/messageTimestamp';
+import './UserMessage.css';
+export interface UserMessageProps extends React.ComponentPropsWithoutRef<'div'> {
+    children: React.ReactNode;
+    /**
+     * Nombre visible del usuario que envía el mensaje (ej. "María"). Opcional:
+     * sin él, el emisor lo dicen la alineación y la cola, como hasta ahora. Se
+     * pinta discreto sobre el globo, coherente con el nombre del modelo de
+     * `AssistantMessage` pero sin su énfasis — aquí es un dato de apoyo, no la
+     * única pista de quién habla.
+     */
+    author?: string;
+    /**
+     * Momento del mensaje: un `Date` o una cadena ISO 8601. Se pinta en un
+     * `<time datetime>`, así que tiene que ser el instante, no una hora ya
+     * formateada — de eso se encarga el componente con `Intl`.
+     */
+    timestamp?: MessageTimestamp;
+    /** Locale con el que se formatea la marca de tiempo. Default `'es-ES'`. */
+    locale?: string;
+    /**
+     * Opciones de `Intl.DateTimeFormat` para la marca de tiempo.
+     * Default: hora y minutos a dos dígitos.
+     */
+    timestampFormat?: Intl.DateTimeFormatOptions;
+    /** Se añade DESPUÉS de las clases propias del componente (el consumidor añade, no sustituye). */
+    className?: string;
+}
+/**
+ * Un mensaje del usuario dentro del hilo: el globo, alineado al lado de fin, y
+ * su marca de tiempo debajo.
+ *
+ * Reenvía el resto de props del `<div>` (`data-*`, `aria-*`, `id`…) y el `ref`.
+ */
+export declare const UserMessage: import("react").ForwardRefExoticComponent<UserMessageProps & import("react").RefAttributes<HTMLDivElement>>;