@stackcraftmx/calcita 0.0.0-stage → 0.25.0

package/dist/types/toolkit/toolkitSettings.d.ts

@@ -0,0 +1,113 @@
+export declare const DEFAULT_LANGUAGE = "es";
+export declare const DEFAULT_CURRENCY = "MXN";
+/**
+ * Los idiomas que ofrece la app cuando el proyecto no dice otros: su código, su nombre en su propio idioma (así lo busca quien
+ * lo habla) y cómo se escriben sus números y fechas (Intl). El proyecto agrega los suyos en ToolkitProvider `languages` y pone
+ * sus traducciones en `texts` (lo que no traduzca sale en español); los textos del paquete solo vienen en español e inglés.
+ */
+export declare const DEFAULT_LANGUAGES: readonly (Readonly<{
+    code: "es";
+    label: "Español";
+    locale: "es-MX";
+}> | Readonly<{
+    code: "en";
+    label: "English";
+    locale: "en-US";
+}>)[];
+/**
+ * La zona horaria del navegador; si el navegador no la sabe, la de la Ciudad de México.
+ *
+ * @returns {string}
+ */
+export declare function browserTimeZone(): string;
+/**
+ * Cambia la configuración que leen las funciones del paquete. La llama ToolkitProvider; un proyecto sin React (o una
+ * prueba) la puede llamar directo.
+ *
+ * @param {{language?: string, texts?: object, translate?: Function|null, timeZone?: string, currency?: string, appName?: string, buildId?: string, languages?: Array<{code: string, label: string, locale?: string}>}} settings
+ * @returns {void}
+ */
+export declare function configureToolkit(settings: {
+    language?: string;
+    texts?: object;
+    translate?: Function | null;
+    timeZone?: string;
+    currency?: string;
+    appName?: string;
+    buildId?: string;
+    languages?: Array<{
+        code: string;
+        label: string;
+        locale?: string;
+    }>;
+}): void;
+/**
+ * La configuración vigente.
+ *
+ * @returns {{language: string, texts: object, translate: Function|null, timeZone: string, currency: string, appName: string, buildId: string, languages: Array<{code: string, label: string, locale?: string}>}}
+ */
+export declare function toolkitSettings(): {
+    language: string;
+    texts: object;
+    translate: Function | null;
+    timeZone: string;
+    currency: string;
+    appName: string;
+    buildId: string;
+    languages: Array<{
+        code: string;
+        label: string;
+        locale?: string;
+    }>;
+};
+/**
+ * El locale de Intl del idioma: el que dice su lista de idiomas (es → es-MX, pt → pt-BR) o, si no dice, el código mismo
+ * (Intl entiende «pt»). OJO: antes un idioma que no fuera es ni en salía con los números y las fechas de México.
+ *
+ * @param {string} language
+ * @param {Array<{code: string, locale?: string}>} [languages] por omisión los de la configuración vigente
+ * @returns {string}
+ */
+export declare function intlLocaleOf(language: string, languages?: Array<{
+    code: string;
+    locale?: string;
+}>): string;
+/**
+ * El texto de una llave en los textos propios de los componentes (la prop `texts` de un componente y los de ComponentTexts
+ * de afuera), si alguno la trae. Cada capa es {namespace, texts} con la misma forma que ese namespace en los textos del
+ * paquete (es.js): plurales con _one/_other y {{variables}}. La primera capa que trae la llave gana.
+ *
+ * @param {Array<{namespace: string, texts: object|undefined}>} layers de la más cercana a la más lejana
+ * @param {string} namespace el de la llave
+ * @param {string} key la llave sin namespace
+ * @param {object|undefined} values
+ * @param {string} language para elegir el plural
+ * @returns {string|undefined} el texto ya con sus variables, o undefined si ninguna capa lo trae
+ */
+export declare function componentTextOf(layers: Array<{
+    namespace: string;
+    texts: object | undefined;
+}>, namespace: string, key: string, values: object | undefined, language: string): string | undefined;
+/**
+ * El texto de una llave con una configuración dada (la del proveedor o la vigente).
+ *
+ * @param {{language: string, texts: object, translate: Function|null}} settings
+ * @param {string} defaultNamespace el namespace cuando la llave no trae uno («table», «common», «problems»...)
+ * @param {string} key «llave» o «namespace:llave»
+ * @param {object} [values] las variables del texto y, para el plural, count
+ * @returns {string} la llave misma si no hay texto, para que se note qué falta
+ */
+export declare function translateWith(settings: {
+    language: string;
+    texts: object;
+    translate: Function | null;
+}, defaultNamespace: string, key: string, values?: object): string;
+/**
+ * El texto de una llave con la configuración vigente, para lo que no es componente (avisos, errores del servidor).
+ *
+ * @param {string} defaultNamespace
+ * @param {string} key
+ * @param {object} [values]
+ * @returns {string}
+ */
+export declare function translateToolkit(defaultNamespace: string, key: string, values?: object): string;

package/dist/types/toolkit/useFormatters.d.ts

@@ -0,0 +1,6 @@
+import { formattersOf } from '../formatting.js';
+/**
+ * @returns {ReturnType<typeof formattersOf>} formatNumber, formatList, formatCurrency, formatFileSize, formatPercent,
+ *     formatDateTime, formatDate, formatTime, formatMonthName, formatMonthShortName y formatWeekdayShortName
+ */
+export declare function useFormatters(): ReturnType<typeof formattersOf>;

package/dist/types/toolkit/useToolkitTranslation.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @param {string|string[]} [namespace] el namespace de las llaves sin prefijo; con una lista, el primero. Sin él, cada
+ *     llave lleva el suyo ('orders:list.title')
+ * @param {object} [ownTexts] los textos propios del componente (su prop `texts`), con la forma de ese namespace
+ * @returns {{t: (key: string, values?: object) => string, language: string, changeLanguage: (language: string) => void}}
+ */
+export declare function useToolkitTranslation(namespace?: string | string[], ownTexts?: object): {
+    t: (key: string, values?: object) => string;
+    language: string;
+    changeLanguage: (language: string) => void;
+};

package/dist/types/ui/actions/ActionsMenu.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @param {object} props
+ * @param {string} props.label el nombre del botón (lector de pantalla y su tooltip), ya traducido
+ * @param {Array<{key: string, label: string, icon?: import('react').ReactNode, color?: string, disabled?: boolean, onClick: () => void}>} [props.actions]
+ * @param {import('react').ReactNode} [props.icon] otro ícono para el botón (por omisión «⋯»)
+ * @param {'small'|'medium'} [props.size]
+ */
+export default function ActionsMenu({ label, actions, icon, size }: {
+    label: string;
+    actions?: Array<{
+        key: string;
+        label: string;
+        icon?: import('react').ReactNode;
+        color?: string;
+        disabled?: boolean;
+        onClick: () => void;
+    }>;
+    icon?: import('react').ReactNode;
+    size?: 'small' | 'medium';
+}): import("react").JSX.Element | null;

package/dist/types/ui/actions/CopyButton.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @param {object} props
+ * @param {string} props.value lo que se copia
+ * @param {string} [props.label] ya traducido; por omisión «Copiar»
+ * @param {'small'|'medium'} [props.size]
+ * @param {() => void} [props.onCopied]
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
+ */
+export default function CopyButton({ value, label, size, onCopied, texts }: {
+    value: string;
+    label?: string;
+    size?: 'small' | 'medium';
+    onCopied?: () => void;
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/actions/DownloadMenu.d.ts

@@ -0,0 +1,55 @@
+/**
+ * @param {object} props
+ * @param {string[]} props.formats los tipos de archivo, en orden: los de la casa (xlsx, csv, pdf) y los que el proyecto declare
+ *     en ToolkitProvider fileTypes (zip, xml…)
+ * @param {(format: string, transferOptions: {signal: AbortSignal, onDownloadProgress: (progress: {loaded: number, total?: number|null}) => void}) => Promise<{blob: Blob, fileName: string}>} props.download
+ * @param {string} [props.label] ya traducido; por defecto "Descargar"
+ * @param {string} [props.downloadLabel] ya traducido; lo que se ve en el panel de descargas antes de saber el nombre
+ *     del archivo
+ * @param {boolean} [props.disabled]
+ * @param {(format: string) => {title: string, description: import('react').ReactNode, confirmLabel?: string}} [props.confirmation]
+ * @param {(format: string) => void} [props.onDownloaded] p. ej. volver a pedir la tabla (si la descarga cambia algo en
+ *     el servidor)
+ * @param {(format: string, error: unknown) => void} [props.onFailed] cuando la descarga no se pudo (el panel ya lo dice)
+ * @param {(format: string) => void} [props.onCanceled] cuando la persona la canceló desde el panel
+ * @param {'button'|'icon'} [props.variant] icon = solo el icono (columna de acciones de una tabla)
+ * @param {string} [props.ariaLabel] ya traducido; obligatorio en la variante icon
+ * @param {(format: string) => void} [props.onChooseFormat] quien llama se encarga de confirmar y descargar
+ * @param {import('react').ElementType} [props.icon] ícono del botón; por defecto el de descarga. Distingue dos descargas en la
+ *     misma fila
+ *
+ * IMPORTANTE: hay que pasar `confirmation` u `onChooseFormat`. Sin ninguno de los dos el menú no descarga nada (regla de
+ * tablas: toda descarga pasa por confirmación).
+ *
+ * OJO onChooseFormat: dentro de una celda del DataGrid el diálogo de confirmación NO puede vivir en la celda (el grid
+ * virtualiza y vuelve a pintar sus celdas; el diálogo se perdía al elegir el formato). Ahí el menú solo avisa qué formato
+ * se eligió y la pantalla abre SU confirmación (useConfirmAction) fuera de la tabla.
+ */
+export default function DownloadMenu({ formats, download, label, downloadLabel, disabled, confirmation, onDownloaded, onFailed, onCanceled, variant, ariaLabel, onChooseFormat, icon: ButtonIcon, }: {
+    formats: string[];
+    download: (format: string, transferOptions: {
+        signal: AbortSignal;
+        onDownloadProgress: (progress: {
+            loaded: number;
+            total?: number | null;
+        }) => void;
+    }) => Promise<{
+        blob: Blob;
+        fileName: string;
+    }>;
+    label?: string;
+    downloadLabel?: string;
+    disabled?: boolean;
+    confirmation?: (format: string) => {
+        title: string;
+        description: import('react').ReactNode;
+        confirmLabel?: string;
+    };
+    onDownloaded?: (format: string) => void;
+    onFailed?: (format: string, error: unknown) => void;
+    onCanceled?: (format: string) => void;
+    variant?: 'button' | 'icon';
+    ariaLabel?: string;
+    onChooseFormat?: (format: string) => void;
+    icon?: import('react').ElementType;
+}): import("react").JSX.Element;

package/dist/types/ui/actions/SecretField.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @param {object} props
+ * @param {string} props.value el secreto
+ * @param {string} props.label ya traducido
+ * @param {string} [props.helperText] p. ej. «Guárdela: no se vuelve a enseñar»
+ * @param {() => void} [props.onCopied]
+ * @param {(isRevealed: boolean) => void} [props.onRevealChange] se destapó o se tapó (para registrar quién vio el secreto)
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
+ */
+export default function SecretField({ value, label, helperText, onCopied, onRevealChange, texts }: {
+    value: string;
+    label: string;
+    helperText?: string;
+    onCopied?: () => void;
+    onRevealChange?: (isRevealed: boolean) => void;
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/actions/SelectionActions.d.ts

@@ -0,0 +1,39 @@
+/** Dónde van las acciones de lo elegido en el teléfono con barra de pestañas abajo: todo arriba o divididas (iOS). */
+export declare const SELECTION_PHONE_LAYOUT: Readonly<{
+    top: "top";
+    split: "split";
+}>;
+/**
+ * ¿En el teléfono lo elegido sale de su renglón (arriba o abajo)? La misma regla que la barra de pestañas de abajo: con ella,
+ * el renglón de la pantalla se queda con lo suyo (el conteo de la tabla) y las acciones flotan.
+ *
+ * @param {object} theme
+ * @returns {boolean}
+ */
+export declare function selectionFloatsOnPhone(theme: object): boolean;
+/**
+ * @param {object} props
+ * @param {string} props.countText «5 pedidos elegidos», ya traducido. La pieza se pinta mientras la pantalla la ponga: con
+ *     nada elegido, no la ponga
+ * @param {Array<{key: string, label: string, icon?: import('react').ReactNode, color?: 'inherit'|'primary'|'secondary'|'error'|'info'|'success'|'warning', disabled?: boolean, onClick: () => unknown}>} [props.actions]
+ *     label ya traducido; en el teléfono se ve el ícono (sin él, el texto). onClick puede regresar una promesa
+ * @param {() => void} props.onClear quitar la selección
+ * @param {'top'|'split'} [props.phoneLayout] SELECTION_PHONE_LAYOUT; por omisión todo arriba
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common`: {selection: {clear, actionsLabel, summaryLabel}}
+ * @param {object} [props.sx] estilos del renglón
+ */
+export default function SelectionActions({ countText, actions, onClear, phoneLayout, texts, sx }: {
+    countText: string;
+    actions?: Array<{
+        key: string;
+        label: string;
+        icon?: import('react').ReactNode;
+        color?: 'inherit' | 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning';
+        disabled?: boolean;
+        onClick: () => unknown;
+    }>;
+    onClear: () => void;
+    phoneLayout?: 'top' | 'split';
+    texts?: object;
+    sx?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/filters/DateRangeFilter.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @param {object} props
+ * @param {string} [props.from] AAAA-MM-DD o '' si no hay
+ * @param {string} [props.to] AAAA-MM-DD o '' si no hay
+ * @param {(range: {from: string, to: string}) => void} props.onChange '' para quitar
+ * @param {string} [props.label] ya traducido; por defecto "Personalizado"
+ * @param {object} [props.texts] los textos que cambian, con la forma de `table` en los textos del paquete
+ */
+export default function DateRangeFilter({ from, to, onChange, label, texts }: {
+    from?: string;
+    to?: string;
+    onChange: (range: {
+        from: string;
+        to: string;
+    }) => void;
+    label?: string;
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/filters/PeriodRangeSelector.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @param {object} props
+ * @param {string} props.id prefijo de los id de las dos listas (accesibilidad)
+ * @param {Array<{value: string, label: string, disabled: boolean, hint?: string}>} props.options en orden; ya
+ *     traducidas
+ * @param {string|null} props.from
+ * @param {string|null} props.to
+ * @param {string} props.fromLabel ya traducido
+ * @param {string} props.toLabel ya traducido
+ * @param {(range: {from: string, to: string}) => void} props.onChange
+ */
+export default function PeriodRangeSelector({ id, options, from, to, fromLabel, toLabel, onChange }: {
+    id: string;
+    options: Array<{
+        value: string;
+        label: string;
+        disabled: boolean;
+        hint?: string;
+    }>;
+    from: string | null;
+    to: string | null;
+    fromLabel: string;
+    toLabel: string;
+    onChange: (range: {
+        from: string;
+        to: string;
+    }) => void;
+}): import("react").JSX.Element;

package/dist/types/ui/filters/QuickFilters.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @param {object} props
+ * @param {string} props.value opción activa ('' = todas)
+ * @param {(value: string) => void} props.onChange
+ * @param {Array<{value: string, label: import('react').ReactNode, count?: number}>} [props.options]
+ * @param {import('react').ReactNode} [props.caption]
+ * @param {string} [props.ariaLabel]
+ * @param {import('react').ReactNode} [props.extra] al final de la tira (p. ej. un rango de fechas)
+ * @param {object} [props.texts] los textos que cambian, con la forma de `table` en los textos del paquete
+ */
+export default function QuickFilters({ value, onChange, options, caption, ariaLabel, extra, texts }: {
+    value: string;
+    onChange: (value: string) => void;
+    options?: Array<{
+        value: string;
+        label: import('react').ReactNode;
+        count?: number;
+    }>;
+    caption?: import('react').ReactNode;
+    ariaLabel?: string;
+    extra?: import('react').ReactNode;
+    texts?: object;
+}): import("react").JSX.Element | null;

package/dist/types/ui/filters/SegmentedControl.d.ts

@@ -0,0 +1,44 @@
+export declare const SEGMENTED_CONTROL_SX: {
+    gap: number;
+    p: number;
+    border: number;
+    borderColor: string;
+    borderRadius: number;
+    flexWrap: string;
+    flex: string;
+    '& .MuiToggleButton-root': {
+        fontSize: string;
+        letterSpacing: string;
+        border: number;
+        borderRadius: string;
+        px: number;
+        py: number;
+        m: string;
+        fontWeight: number;
+        textTransform: string;
+        color: string;
+        whiteSpace: string;
+    };
+    '& .MuiToggleButton-root.Mui-selected, & .MuiToggleButton-root.Mui-selected:hover': {
+        bgcolor: string;
+        color: string;
+    };
+};
+/**
+ * @param {object} props
+ * @param {Array<{value: string, label: string, disabled?: boolean}>} props.options en el orden en que se pintan; ya
+ *     traducidas
+ * @param {string|null} props.value
+ * @param {(value: string) => void} props.onChange
+ * @param {string} props.ariaLabel ya traducido
+ */
+export default function SegmentedControl({ options, value, onChange, ariaLabel }: {
+    options: Array<{
+        value: string;
+        label: string;
+        disabled?: boolean;
+    }>;
+    value: string | null;
+    onChange: (value: string) => void;
+    ariaLabel: string;
+}): import("react").JSX.Element;

package/dist/types/ui/index.d.ts

@@ -0,0 +1,33 @@
+export { APP_BAR_HEIGHT_CSS_VARIABLE, SCROLL_MARGIN_BELOW_APP_BAR, useAppBarHeightPublisher } from './layout/appBarHeight.js';
+export { default as CollapsibleSection } from './layout/CollapsibleSection.js';
+export { default as ContentDialog } from './layout/ContentDialog.js';
+export { default as DefinitionList } from './layout/DefinitionList.js';
+export { default as DetailHeader } from './layout/DetailHeader.js';
+export { default as FullPageLoader } from './layout/FullPageLoader.js';
+export { default as GlassLensFilter } from './layout/GlassLensFilter.js';
+export { default as GlassPanel } from './layout/GlassPanel.js';
+export { default as PageHeader } from './layout/PageHeader.js';
+export { default as PageHeading } from './layout/PageHeading.js';
+export { default as ProfileHeader } from './layout/ProfileHeader.js';
+export { default as ScrollableRow, scrollableRow } from './layout/ScrollableRow.js';
+export { default as SectionCard } from './layout/SectionCard.js';
+export { default as BackButton } from './navigation/BackButton.js';
+export { default as ColorSchemeToggle } from './navigation/ColorSchemeToggle.js';
+export { default as DocumentTitle } from './navigation/DocumentTitle.js';
+export { LANGUAGES, default as LanguageToggle } from './navigation/LanguageToggle.js';
+export { default as FontSizeToggle } from './navigation/FontSizeToggle.js';
+export { FONT_SIZE_LEVELS } from './navigation/fontSizeLevels.js';
+export { default as PageBreadcrumbs } from './navigation/PageBreadcrumbs.js';
+export { default as DateRangeFilter } from './filters/DateRangeFilter.js';
+export { default as PeriodRangeSelector } from './filters/PeriodRangeSelector.js';
+export { default as QuickFilters } from './filters/QuickFilters.js';
+export { default as SegmentedControl, SEGMENTED_CONTROL_SX } from './filters/SegmentedControl.js';
+export { default as DictionaryText } from './labels/DictionaryText.js';
+export { default as StatusChip } from './labels/StatusChip.js';
+export { default as Tag } from './labels/Tag.js';
+export { default as CopyButton } from './actions/CopyButton.js';
+export { default as DownloadMenu } from './actions/DownloadMenu.js';
+export { default as SecretField } from './actions/SecretField.js';
+export { default as CalendarHeatmap } from './metrics/CalendarHeatmap.js';
+export { TREND_DIRECTION, default as MetricCard } from './metrics/MetricCard.js';
+export { CHART_VIEW, default as TableToggle } from './metrics/TableToggle.js';

package/dist/types/ui/labels/DictionaryText.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @param {{dictionary: Record<string, object>, value: string|null|undefined}} props
+ */
+export default function DictionaryText({ dictionary, value }: {
+    dictionary: Record<string, object>;
+    value: string | null | undefined;
+}): string;

package/dist/types/ui/labels/StatusChip.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @param {object} props
+ * @param {Record<string, object>} props.dictionary p. ej. BATCH_STATUS
+ * @param {string|null|undefined} props.value código del API
+ * @param {'dot'|'chip'} [props.variant]
+ * @param {boolean} [props.short] pinta la palabra corta de la entrada (shortLabelKey), para una columna angosta; el
+ *     nombre completo queda en el tooltip, antes de su explicación
+ * @param {string} [props.suffix] texto que va después de la etiqueta con " · " (p. ej. un conteo ya formateado)
+ * @param {import('react').ReactNode} [props.tooltip] SUSTITUYE al tooltip del diccionario; úsalo cuando el renglón tiene algo más
+ *     que decir. OJO: no envuelvas este componente en otro Tooltip, porque el suyo sigue ahí y se ven los dos encimados
+ * @param {object} [props.sx] ajustes de estilo del Chip (solo variant="chip")
+ */
+export default function StatusChip({ dictionary, value, variant, short, suffix, tooltip: customTooltip, sx }: {
+    dictionary: Record<string, object>;
+    value: string | null | undefined;
+    variant?: 'dot' | 'chip';
+    short?: boolean;
+    suffix?: string;
+    tooltip?: import('react').ReactNode;
+    sx?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/labels/Tag.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @param {object} props
+ * @param {import('react').ReactNode} props.label texto visible, ya traducido
+ * @param {string} [props.tooltip] qué significa (aparece al pasar el cursor)
+ * @param {string} [props.color] color del tema de MUI
+ * @param {'filled'|'outlined'} [props.variant]
+ * @param {'small'|'medium'} [props.size]
+ * @param {() => void} [props.onDelete]
+ * @param {object} [props.sx]
+ */
+export default function Tag({ label, tooltip, color, variant, size, onDelete, sx, ...chipProps }: {
+    label: import('react').ReactNode;
+    tooltip?: string;
+    color?: string;
+    variant?: 'filled' | 'outlined';
+    size?: 'small' | 'medium';
+    onDelete?: () => void;
+    sx?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/labels/tagOf.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Una etiqueta como la pintan la tarjeta y el mensaje: un texto suelto o {label, color} (un color del tema: error, warning, info…).
+ *
+ * @param {string|{label: string, color?: string}} tag
+ * @returns {{label: string, color: string}}
+ */
+export declare function tagOf(tag: string | {
+    label: string;
+    color?: string;
+}): {
+    label: string;
+    color: string;
+};

package/dist/types/ui/layout/CollapsibleSection.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @param {object} props
+ * @param {string} props.collapsedTitle lo que dice plegada, ya traducido («Ver el detalle de la validación»)
+ * @param {string} props.expandedTitle lo que dice abierta («Ocultar el detalle de la validación»)
+ * @param {string} [props.hint] plegada, qué hay adentro («Incluye resumen, motivos de rechazo y descargas.»)
+ * @param {boolean} [props.defaultExpanded] si empieza abierta; por omisión empieza plegada
+ * @param {(isExpanded: boolean) => void} [props.onExpandedChange] la persona la abrió o la plegó (por ejemplo, para pedir lo de
+ *     adentro hasta que se abre)
+ * @param {import('react').ReactNode} props.children
+ */
+export default function CollapsibleSection({ collapsedTitle, expandedTitle, hint, defaultExpanded, onExpandedChange, children }: {
+    collapsedTitle: string;
+    expandedTitle: string;
+    hint?: string;
+    defaultExpanded?: boolean;
+    onExpandedChange?: (isExpanded: boolean) => void;
+    children: import('react').ReactNode;
+}): import("react").JSX.Element;

package/dist/types/ui/layout/ContentDialog.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @param {object} props
+ * @param {boolean} props.open
+ * @param {() => void} props.onClose
+ * @param {string} props.title texto ya traducido
+ * @param {import('react').ReactNode} props.children
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
+ */
+export default function ContentDialog({ open, onClose, title, children, texts }: {
+    open: boolean;
+    onClose: () => void;
+    title: string;
+    children: import('react').ReactNode;
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/layout/DefinitionList.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @param {object} props
+ * @param {Array<{label: string, value: import('react').ReactNode}>} props.entries en el orden en que se pintan; el label es la
+ *     llave
+ * @param {'columns'|'stacked'} [props.layout]
+ * @param {number} [props.labelWidth] ancho en px de la columna del dato (solo columns)
+ */
+export default function DefinitionList({ entries, layout, labelWidth }: {
+    entries: Array<{
+        label: string;
+        value: import('react').ReactNode;
+    }>;
+    layout?: 'columns' | 'stacked';
+    labelWidth?: number;
+}): import("react").JSX.Element;

package/dist/types/ui/layout/DetailHeader.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @param {object} props
+ * @param {string} props.title texto ya traducido
+ * @param {string} [props.eyebrow] contexto arriba del título (p. ej. el producto)
+ * @param {import('react').ReactNode} [props.badges] insignias junto al título (chips de estatus, intento...)
+ * @param {import('react').ReactNode} [props.actions] botones a la derecha
+ * @param {string} [props.documentTitle] título de la pestaña si difiere del visible
+ */
+export default function DetailHeader({ title, eyebrow, badges, actions, documentTitle }: {
+    title: string;
+    eyebrow?: string;
+    badges?: import('react').ReactNode;
+    actions?: import('react').ReactNode;
+    documentTitle?: string;
+}): import("react").JSX.Element;

package/dist/types/ui/layout/ErrorPage.d.ts

@@ -0,0 +1,35 @@
+/** Los errores que tiene pantalla propia. */
+export declare const ERROR_PAGE_KIND: Readonly<{
+    notFound: "notFound";
+    forbidden: "forbidden";
+    serverError: "serverError";
+    newVersion: "newVersion";
+}>;
+/**
+ * @param {object} props
+ * @param {string} props.kind uno de ERROR_PAGE_KIND
+ * @param {string} [props.title] ya traducido; por omisión el del paquete
+ * @param {import('react').ReactNode} [props.text] ya traducido; por omisión el del paquete
+ * @param {string} [props.homePath] a dónde lleva «Ir al inicio» (por omisión '/')
+ * @param {() => void} [props.onRetry] con él sale «Intentar de nuevo»
+ * @param {() => void} [props.onGoHome] al picar «Ir al inicio», antes de ir (para avisar o limpiar algo)
+ * @param {import('react').ReactNode} [props.extraActions] botones suyos junto a los de la casa
+ * @param {import('react').ReactNode} [props.actions] botones suyos EN LUGAR de los de la casa
+ * @param {import('react').ReactNode} [props.icon] otro ícono; por omisión el de cada error
+ * @param {import('react').ReactNode} [props.children] algo debajo del texto (el teléfono de soporte, un folio)
+ * @param {object} [props.texts] los textos que cambian, con la forma de `errorPage` en los textos del paquete:
+ *     {goHome: 'Volver al tablero', notFound: {title: '…'}}
+ */
+export default function ErrorPage({ kind, title, text, homePath, onRetry, onGoHome, extraActions, actions, icon, children, texts, }: {
+    kind: string;
+    title?: string;
+    text?: import('react').ReactNode;
+    homePath?: string;
+    onRetry?: () => void;
+    onGoHome?: () => void;
+    extraActions?: import('react').ReactNode;
+    actions?: import('react').ReactNode;
+    icon?: import('react').ReactNode;
+    children?: import('react').ReactNode;
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/layout/FullPageLoader.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @param {object} [props]
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
+ */
+export default function FullPageLoader({ texts }?: {
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/ui/layout/GlassLensFilter.d.ts

@@ -0,0 +1 @@
+export default function GlassLensFilter(): import("react").JSX.Element | null;

package/dist/types/ui/layout/GlassPanel.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @param {object} props
+ * @param {import('react').ReactNode} props.children
+ * @param {object|Function|Array} [props.sx] estilos propios: se suman y ganan
+ * @param {import('react').ElementType} [props.component] por omisión 'div'
+ */
+export default function GlassPanel({ children, sx, ...paperProps }: {
+    children: import('react').ReactNode;
+    sx?: object | Function | any[];
+    component?: import('react').ElementType;
+}): import("react").JSX.Element;

package/dist/types/ui/layout/PageHeader.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @param {object} props
+ * @param {string} props.title texto ya traducido
+ * @param {string} [props.eyebrow]
+ * @param {import('react').ReactNode} [props.subtitle]
+ * @param {import('react').ReactNode} [props.action] normalmente un <Button variant="contained" shape="pill">
+ * @param {string} [props.documentTitle] título de la pestaña si difiere del visible
+ */
+export default function PageHeader({ title, eyebrow, subtitle, action, documentTitle }: {
+    title: string;
+    eyebrow?: string;
+    subtitle?: import('react').ReactNode;
+    action?: import('react').ReactNode;
+    documentTitle?: string;
+}): import("react").JSX.Element;