@soyfri/shared-library 4.0.4 → 4.1.1-beta.1

package/components/DateTimePicker/DateTimePicker.d.cts

@@ -0,0 +1,78 @@
+import { default as React } from 'react';
+import { SxProps, Theme } from '@mui/material';
+import { DateTimePickerProps as MuiDateTimePickerProps } from '@mui/x-date-pickers/DateTimePicker';
+import { Dayjs } from 'dayjs';
+import { RegisterOptions } from 'react-hook-form';
+export type LabelPosition = 'outside' | 'floating';
+export type DateTimePickerSize = 'small' | 'medium';
+export interface BaseDateTimePickerProps extends Omit<MuiDateTimePickerProps, 'value' | 'onChange' | 'slotProps' | 'format'> {
+    label?: string;
+    minDateTime?: Dayjs;
+    maxDateTime?: Dayjs;
+    disabled?: boolean;
+    readOnly?: boolean;
+    /** Formato de la fecha/hora. Default: 'DD/MM/YYYY HH:mm'. */
+    inputFormat?: string;
+    /** Border radius del input. Default: 10. */
+    borderRadius?: number | string;
+    /** "outside" (default) o "floating". */
+    labelPosition?: LabelPosition;
+    /** Tamaño del TextField. Default: 'small'. */
+    size?: DateTimePickerSize;
+    helperText?: string;
+    error?: boolean;
+    sx?: SxProps<Theme>;
+    className?: string;
+    /**
+     * Nombre del preset de estilo registrado en `theme.styles.DateTimePicker`.
+     * - `"default"` (o ausente) = estilo built-in del paquete.
+     * - Cualquier otro string = mergea el preset encima del estilo built-in.
+     */
+    preset?: string;
+    /** Locale del adaptador dayjs. */
+    adapterLocale?: string;
+    /** Textos de los botones del popover. */
+    clearButtonText?: string;
+    cancelButtonText?: string;
+    acceptButtonText?: string;
+    minutesStep?: number;
+    minTime?: Dayjs;
+    /** Si es true usa formato 12h (AM/PM), false = 24h. Default: false. */
+    ampm?: boolean;
+    viewRenderers?: MuiDateTimePickerProps['viewRenderers'];
+    timeSteps?: MuiDateTimePickerProps['timeSteps'];
+    /**
+     * Vistas a mostrar en el popover. Default: todas (year, month, day, hours, minutes).
+     * Ej: `['hours']` solo permite elegir la hora. `['hours','minutes']` oculta el calendar.
+     *
+     * Va declarado explícito (y no se hereda del `Omit<MuiDateTimePickerProps>`)
+     * porque se desestructura del `props` y se pasa a mano al picker: si sólo
+     * viviera en el tipo base caería en el `...rest` y quedaría duplicado.
+     */
+    views?: MuiDateTimePickerProps['views'];
+    textFieldProps?: Record<string, any>;
+    /** Passthrough completo a slotProps del MuiDateTimePicker. */
+    slotProps?: MuiDateTimePickerProps['slotProps'];
+}
+export interface RHFDateTimePickerProps extends BaseDateTimePickerProps {
+    name: string;
+    control: any;
+    validation?: RegisterOptions;
+    /**
+     * Side-effect que corre después de que RHF actualiza el form state.
+     * Útil para cascadas entre campos. NO reemplaza al handler de RHF.
+     */
+    onValueChange?: (dateTime: Dayjs | null) => void;
+    selectedDateTime?: never;
+    onDateTimeChange?: never;
+}
+export interface ControlledDateTimePickerProps extends BaseDateTimePickerProps {
+    name?: string;
+    control?: never;
+    validation?: never;
+    selectedDateTime: Dayjs | null;
+    onDateTimeChange: (dateTime: Dayjs | null) => void;
+}
+export type DateTimePickerProps = RHFDateTimePickerProps | ControlledDateTimePickerProps;
+export declare const DateTimePicker: React.ForwardRefExoticComponent<DateTimePickerProps & React.RefAttributes<HTMLDivElement>>;
+export default DateTimePicker;

package/components/DateTimePicker/DateTimePicker.d.mts

@@ -0,0 +1,78 @@
+import { default as React } from 'react';
+import { SxProps, Theme } from '@mui/material';
+import { DateTimePickerProps as MuiDateTimePickerProps } from '@mui/x-date-pickers/DateTimePicker';
+import { Dayjs } from 'dayjs';
+import { RegisterOptions } from 'react-hook-form';
+export type LabelPosition = 'outside' | 'floating';
+export type DateTimePickerSize = 'small' | 'medium';
+export interface BaseDateTimePickerProps extends Omit<MuiDateTimePickerProps, 'value' | 'onChange' | 'slotProps' | 'format'> {
+    label?: string;
+    minDateTime?: Dayjs;
+    maxDateTime?: Dayjs;
+    disabled?: boolean;
+    readOnly?: boolean;
+    /** Formato de la fecha/hora. Default: 'DD/MM/YYYY HH:mm'. */
+    inputFormat?: string;
+    /** Border radius del input. Default: 10. */
+    borderRadius?: number | string;
+    /** "outside" (default) o "floating". */
+    labelPosition?: LabelPosition;
+    /** Tamaño del TextField. Default: 'small'. */
+    size?: DateTimePickerSize;
+    helperText?: string;
+    error?: boolean;
+    sx?: SxProps<Theme>;
+    className?: string;
+    /**
+     * Nombre del preset de estilo registrado en `theme.styles.DateTimePicker`.
+     * - `"default"` (o ausente) = estilo built-in del paquete.
+     * - Cualquier otro string = mergea el preset encima del estilo built-in.
+     */
+    preset?: string;
+    /** Locale del adaptador dayjs. */
+    adapterLocale?: string;
+    /** Textos de los botones del popover. */
+    clearButtonText?: string;
+    cancelButtonText?: string;
+    acceptButtonText?: string;
+    minutesStep?: number;
+    minTime?: Dayjs;
+    /** Si es true usa formato 12h (AM/PM), false = 24h. Default: false. */
+    ampm?: boolean;
+    viewRenderers?: MuiDateTimePickerProps['viewRenderers'];
+    timeSteps?: MuiDateTimePickerProps['timeSteps'];
+    /**
+     * Vistas a mostrar en el popover. Default: todas (year, month, day, hours, minutes).
+     * Ej: `['hours']` solo permite elegir la hora. `['hours','minutes']` oculta el calendar.
+     *
+     * Va declarado explícito (y no se hereda del `Omit<MuiDateTimePickerProps>`)
+     * porque se desestructura del `props` y se pasa a mano al picker: si sólo
+     * viviera en el tipo base caería en el `...rest` y quedaría duplicado.
+     */
+    views?: MuiDateTimePickerProps['views'];
+    textFieldProps?: Record<string, any>;
+    /** Passthrough completo a slotProps del MuiDateTimePicker. */
+    slotProps?: MuiDateTimePickerProps['slotProps'];
+}
+export interface RHFDateTimePickerProps extends BaseDateTimePickerProps {
+    name: string;
+    control: any;
+    validation?: RegisterOptions;
+    /**
+     * Side-effect que corre después de que RHF actualiza el form state.
+     * Útil para cascadas entre campos. NO reemplaza al handler de RHF.
+     */
+    onValueChange?: (dateTime: Dayjs | null) => void;
+    selectedDateTime?: never;
+    onDateTimeChange?: never;
+}
+export interface ControlledDateTimePickerProps extends BaseDateTimePickerProps {
+    name?: string;
+    control?: never;
+    validation?: never;
+    selectedDateTime: Dayjs | null;
+    onDateTimeChange: (dateTime: Dayjs | null) => void;
+}
+export type DateTimePickerProps = RHFDateTimePickerProps | ControlledDateTimePickerProps;
+export declare const DateTimePicker: React.ForwardRefExoticComponent<DateTimePickerProps & React.RefAttributes<HTMLDivElement>>;
+export default DateTimePicker;

package/components/DateTimePicker/DateTimePicker.d.ts

@@ -74,5 +74,5 @@ export interface ControlledDateTimePickerProps extends BaseDateTimePickerProps {
     onDateTimeChange: (dateTime: Dayjs | null) => void;
 }
 export type DateTimePickerProps = RHFDateTimePickerProps | ControlledDateTimePickerProps;
-export declare const DateTimePicker: React.FC<DateTimePickerProps>;
+export declare const DateTimePicker: React.ForwardRefExoticComponent<DateTimePickerProps & React.RefAttributes<HTMLDivElement>>;
 export default DateTimePicker;

package/components/DateTimePicker/DateTimePicker.helpers.d.cts

@@ -0,0 +1,13 @@
+import { DateTimeValidationError } from '@mui/x-date-pickers/models';
+/**
+ * Traduce el error del DateTimePicker a un mensaje en español. Se usa
+ * internamente para poblar `helperText` cuando hay error de validación.
+ * Cubre tanto errores de fecha (`minDate`, `maxDate`, etc.) como de hora
+ * (`minTime`, `maxTime`, `minutesStep`, etc.).
+ */
+export declare const getDateTimeValidationMessage: (error: DateTimeValidationError | null) => string;
+/**
+ * Construye el `localeText` que MUI acepta para overridear los labels de los
+ * botones del popover (Cancel / OK / Clear).
+ */
+export declare const buildLocaleText: (clearButtonText?: string, cancelButtonText?: string, acceptButtonText?: string) => Record<string, string>;

package/components/DateTimePicker/DateTimePicker.helpers.d.mts

@@ -0,0 +1,13 @@
+import { DateTimeValidationError } from '@mui/x-date-pickers/models';
+/**
+ * Traduce el error del DateTimePicker a un mensaje en español. Se usa
+ * internamente para poblar `helperText` cuando hay error de validación.
+ * Cubre tanto errores de fecha (`minDate`, `maxDate`, etc.) como de hora
+ * (`minTime`, `maxTime`, `minutesStep`, etc.).
+ */
+export declare const getDateTimeValidationMessage: (error: DateTimeValidationError | null) => string;
+/**
+ * Construye el `localeText` que MUI acepta para overridear los labels de los
+ * botones del popover (Cancel / OK / Clear).
+ */
+export declare const buildLocaleText: (clearButtonText?: string, cancelButtonText?: string, acceptButtonText?: string) => Record<string, string>;

package/components/DateTimePicker/DateTimePicker.sx.d.cts

@@ -0,0 +1,10 @@
+import { SxProps, Theme } from '@mui/material';
+import { CSSObject } from '@mui/material/styles';
+import { LabelPosition } from './DateTimePicker';
+/** Estilo de fábrica del DateTimePicker, en CSS real (para `styled()`). */
+export declare const buildDateTimePickerStyles: (theme: Theme, borderRadius: number | string, labelPosition: LabelPosition) => CSSObject;
+/**
+ * @deprecated El componente ya no lo usa: su estilo de fábrica vive en el
+ * `styled()`. Preferir `buildDateTimePickerStyles`.
+ */
+export declare const buildDateTimePickerSx: (borderRadius: number | string, labelPosition: LabelPosition) => SxProps<Theme>;

package/components/DateTimePicker/DateTimePicker.sx.d.mts

@@ -0,0 +1,10 @@
+import { SxProps, Theme } from '@mui/material';
+import { CSSObject } from '@mui/material/styles';
+import { LabelPosition } from './DateTimePicker.mjs';
+/** Estilo de fábrica del DateTimePicker, en CSS real (para `styled()`). */
+export declare const buildDateTimePickerStyles: (theme: Theme, borderRadius: number | string, labelPosition: LabelPosition) => CSSObject;
+/**
+ * @deprecated El componente ya no lo usa: su estilo de fábrica vive en el
+ * `styled()`. Preferir `buildDateTimePickerStyles`.
+ */
+export declare const buildDateTimePickerSx: (borderRadius: number | string, labelPosition: LabelPosition) => SxProps<Theme>;

package/components/DateTimePicker/DateTimePicker.sx.d.ts

@@ -1,7 +1,10 @@
 import { SxProps, Theme } from '@mui/material';
+import { CSSObject } from '@mui/material/styles';
 import { LabelPosition } from './DateTimePicker';
+/** Estilo de fábrica del DateTimePicker, en CSS real (para `styled()`). */
+export declare const buildDateTimePickerStyles: (theme: Theme, borderRadius: number | string, labelPosition: LabelPosition) => CSSObject;
 /**
- * Builder de sx para el DateTimePicker. Mismo patrón que DatePicker.
- * Usa `includePickersApi: true` para soportar la API nueva de MUI X v8.
+ * @deprecated El componente ya no lo usa: su estilo de fábrica vive en el
+ * `styled()`. Preferir `buildDateTimePickerStyles`.
  */
 export declare const buildDateTimePickerSx: (borderRadius: number | string, labelPosition: LabelPosition) => SxProps<Theme>;

package/components/DateTimePicker/index.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const DateTimePicker = require("../../chunks/DateTimePicker-BDlUoDyR.cjs");
+exports.DateTimePicker = DateTimePicker.DateTimePicker;
+exports.default = DateTimePicker.DateTimePicker;
+//# sourceMappingURL=index.cjs.map

package/components/DateTimePicker/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/DateTimePicker/index.d.cts

@@ -0,0 +1,2 @@
+export { DateTimePicker, default } from './DateTimePicker';
+export type { DateTimePickerProps, BaseDateTimePickerProps, RHFDateTimePickerProps, ControlledDateTimePickerProps, LabelPosition, DateTimePickerSize, } from './DateTimePicker';

package/components/DateTimePicker/index.d.mts

@@ -0,0 +1,2 @@
+export { DateTimePicker, default } from './DateTimePicker.mjs';
+export type { DateTimePickerProps, BaseDateTimePickerProps, RHFDateTimePickerProps, ControlledDateTimePickerProps, LabelPosition, DateTimePickerSize, } from './DateTimePicker.mjs';

package/components/DateTimePicker/index.mjs

@@ -0,0 +1,6 @@
+import { D, D as D2 } from "../../chunks/DateTimePicker-BXghtoRm.mjs";
+export {
+  D as DateTimePicker,
+  D2 as default
+};
+//# sourceMappingURL=index.mjs.map

package/components/DateTimePicker/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/DateTimePicker.d.cts

@@ -0,0 +1,6 @@
+export * from './DateTimePicker/index'
+export {}
+import _default from './DateTimePicker/index'
+export default _default
+export * from './DateTimePicker/index'
+export {}

package/components/DateTimePicker.d.mts

@@ -0,0 +1,6 @@
+export * from './DateTimePicker/index.mjs'
+export {}
+import _default from './DateTimePicker/index.mjs'
+export default _default
+export * from './DateTimePicker/index.mjs'
+export {}

package/components/Divider/Divider.d.cts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { DividerProps as MuiDividerProps } from '@mui/material';
+export interface DividerProps extends MuiDividerProps {
+    /** Contenido opcional (label) en medio del divider. */
+    children?: ReactNode;
+}
+/** Separador. Wrapper fino sobre MUI `Divider`. */
+export declare const Divider: import('react').ForwardRefExoticComponent<Omit<DividerProps, "ref"> & import('react').RefAttributes<HTMLHRElement>>;
+export default Divider;

package/components/Divider/Divider.d.mts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { DividerProps as MuiDividerProps } from '@mui/material';
+export interface DividerProps extends MuiDividerProps {
+    /** Contenido opcional (label) en medio del divider. */
+    children?: ReactNode;
+}
+/** Separador. Wrapper fino sobre MUI `Divider`. */
+export declare const Divider: import('react').ForwardRefExoticComponent<Omit<DividerProps, "ref"> & import('react').RefAttributes<HTMLHRElement>>;
+export default Divider;

package/components/Divider/Divider.d.ts

@@ -1,17 +1,9 @@
 import { ReactNode } from 'react';
-import { SxProps, Theme } from '@mui/material/styles';
-export interface DividerProps {
-    orientation?: 'horizontal' | 'vertical';
-    variant?: 'fullWidth' | 'inset' | 'middle';
-    /** Para usar dentro de contenedores flex (ej. divider vertical). */
-    flexItem?: boolean;
-    /** Alineación del contenido cuando hay `children` (label centrado, etc.). */
-    textAlign?: 'center' | 'left' | 'right';
+import { DividerProps as MuiDividerProps } from '@mui/material';
+export interface DividerProps extends MuiDividerProps {
     /** Contenido opcional (label) en medio del divider. */
     children?: ReactNode;
-    sx?: SxProps<Theme>;
-    className?: string;
 }
 /** Separador. Wrapper fino sobre MUI `Divider`. */
-export declare function Divider({ orientation, variant, flexItem, textAlign, children, sx, className, }: DividerProps): import("react/jsx-runtime").JSX.Element;
+export declare const Divider: import('react').ForwardRefExoticComponent<Omit<DividerProps, "ref"> & import('react').RefAttributes<HTMLHRElement>>;
 export default Divider;

package/components/Divider/index.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Divider = require("../../chunks/Divider-CSDEVgHL.cjs");
+exports.Divider = Divider.Divider;
+exports.default = Divider.Divider;
+//# sourceMappingURL=index.cjs.map

package/components/Divider/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/Divider/index.d.cts

@@ -0,0 +1,2 @@
+export { Divider, default } from './Divider';
+export type { DividerProps } from './Divider';

package/components/Divider/index.d.mts

@@ -0,0 +1,2 @@
+export { Divider, default } from './Divider.mjs';
+export type { DividerProps } from './Divider.mjs';

package/components/Divider/index.mjs

@@ -0,0 +1,6 @@
+import { D, D as D2 } from "../../chunks/Divider-LWjGO0ja.mjs";
+export {
+  D as Divider,
+  D2 as default
+};
+//# sourceMappingURL=index.mjs.map

package/components/Divider/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/Divider.d.cts

@@ -0,0 +1,6 @@
+export * from './Divider/index'
+export {}
+import _default from './Divider/index'
+export default _default
+export * from './Divider/index'
+export {}

package/components/Divider.d.mts

@@ -0,0 +1,6 @@
+export * from './Divider/index.mjs'
+export {}
+import _default from './Divider/index.mjs'
+export default _default
+export * from './Divider/index.mjs'
+export {}

package/components/Drawer/Drawer.d.cts

@@ -0,0 +1,58 @@
+import { ReactNode } from 'react';
+import { DrawerProps as MuiDrawerProps } from '@mui/material';
+import { SxProps, Theme } from '@mui/material/styles';
+export type DrawerVariant = 'permanent' | 'persistent' | 'temporary';
+export type DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';
+export interface DrawerProps {
+    /** Contenido del drawer (típicamente `<DrawerItem>`s). */
+    children?: ReactNode;
+    /**
+     * Variante del drawer:
+     * - `permanent` (default): siempre visible en desktop, soporta collapsed (mini).
+     * - `persistent`: se oculta/muestra, empuja el contenido principal.
+     * - `temporary`: flotante con backdrop (típico móvil).
+     */
+    variant?: DrawerVariant;
+    /** Lado del viewport. Default: `'left'`. */
+    anchor?: DrawerAnchor;
+    /**
+     * Estado mini (solo iconos). Solo se aplica con `variant="permanent"` o
+     * `"persistent"`. Si no se provee, el drawer está siempre expandido.
+     */
+    collapsed?: boolean;
+    /** Callback del botón de toggle (chevron). */
+    onToggleCollapse?: () => void;
+    /** Estado abierto/cerrado (aplica a `temporary` y `persistent`). */
+    open?: boolean;
+    /** Callback de cierre (backdrop o ESC en temporary). */
+    onClose?: MuiDrawerProps['onClose'];
+    /** Ancho en estado expandido. Default: 260. */
+    expandedWidth?: number;
+    /** Ancho en estado colapsado (solo iconos). Default: 72. */
+    collapsedWidth?: number;
+    /** Muestra el botón chevron para toggle collapsed. Default: true si `onToggleCollapse` está definido. */
+    showCollapseButton?: boolean;
+    /** Contenido del header (por encima de los items). Típicamente logo/brand. */
+    header?: ReactNode;
+    /**
+     * Logo/brand que se muestra junto al botón de toggle.
+     * - Expandido: logo a la izquierda, toggle a la derecha en la misma fila.
+     * - Colapsado: logo arriba centrado, toggle debajo centrado (stack vertical).
+     * Siempre visible (a diferencia de `header`, que se oculta al colapsar).
+     */
+    logo?: ReactNode;
+    /** Contenido del footer (por debajo de los items). Típicamente user profile. */
+    footer?: ReactNode;
+    /**
+     * Nombre del preset de estilo registrado en `theme.styles.Drawer`.
+     * - `"default"` (o ausente) = estilo built-in del paquete.
+     */
+    preset?: string;
+    /** sx aplicado al Drawer (root). Se mergea después del preset. */
+    sx?: SxProps<Theme>;
+    /** sx aplicado al Paper interno. */
+    paperSx?: SxProps<Theme>;
+    className?: string;
+}
+export declare const Drawer: import('react').ForwardRefExoticComponent<DrawerProps & import('react').RefAttributes<HTMLDivElement>>;
+export default Drawer;

package/components/Drawer/Drawer.d.mts

@@ -0,0 +1,58 @@
+import { ReactNode } from 'react';
+import { DrawerProps as MuiDrawerProps } from '@mui/material';
+import { SxProps, Theme } from '@mui/material/styles';
+export type DrawerVariant = 'permanent' | 'persistent' | 'temporary';
+export type DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';
+export interface DrawerProps {
+    /** Contenido del drawer (típicamente `<DrawerItem>`s). */
+    children?: ReactNode;
+    /**
+     * Variante del drawer:
+     * - `permanent` (default): siempre visible en desktop, soporta collapsed (mini).
+     * - `persistent`: se oculta/muestra, empuja el contenido principal.
+     * - `temporary`: flotante con backdrop (típico móvil).
+     */
+    variant?: DrawerVariant;
+    /** Lado del viewport. Default: `'left'`. */
+    anchor?: DrawerAnchor;
+    /**
+     * Estado mini (solo iconos). Solo se aplica con `variant="permanent"` o
+     * `"persistent"`. Si no se provee, el drawer está siempre expandido.
+     */
+    collapsed?: boolean;
+    /** Callback del botón de toggle (chevron). */
+    onToggleCollapse?: () => void;
+    /** Estado abierto/cerrado (aplica a `temporary` y `persistent`). */
+    open?: boolean;
+    /** Callback de cierre (backdrop o ESC en temporary). */
+    onClose?: MuiDrawerProps['onClose'];
+    /** Ancho en estado expandido. Default: 260. */
+    expandedWidth?: number;
+    /** Ancho en estado colapsado (solo iconos). Default: 72. */
+    collapsedWidth?: number;
+    /** Muestra el botón chevron para toggle collapsed. Default: true si `onToggleCollapse` está definido. */
+    showCollapseButton?: boolean;
+    /** Contenido del header (por encima de los items). Típicamente logo/brand. */
+    header?: ReactNode;
+    /**
+     * Logo/brand que se muestra junto al botón de toggle.
+     * - Expandido: logo a la izquierda, toggle a la derecha en la misma fila.
+     * - Colapsado: logo arriba centrado, toggle debajo centrado (stack vertical).
+     * Siempre visible (a diferencia de `header`, que se oculta al colapsar).
+     */
+    logo?: ReactNode;
+    /** Contenido del footer (por debajo de los items). Típicamente user profile. */
+    footer?: ReactNode;
+    /**
+     * Nombre del preset de estilo registrado en `theme.styles.Drawer`.
+     * - `"default"` (o ausente) = estilo built-in del paquete.
+     */
+    preset?: string;
+    /** sx aplicado al Drawer (root). Se mergea después del preset. */
+    sx?: SxProps<Theme>;
+    /** sx aplicado al Paper interno. */
+    paperSx?: SxProps<Theme>;
+    className?: string;
+}
+export declare const Drawer: import('react').ForwardRefExoticComponent<DrawerProps & import('react').RefAttributes<HTMLDivElement>>;
+export default Drawer;

package/components/Drawer/Drawer.d.ts

@@ -54,5 +54,5 @@ export interface DrawerProps {
     paperSx?: SxProps<Theme>;
     className?: string;
 }
-export declare function Drawer({ children, variant, anchor, collapsed, onToggleCollapse, open, onClose, expandedWidth, collapsedWidth, showCollapseButton, header, logo, footer, preset, sx, paperSx, className, }: DrawerProps): import("react/jsx-runtime").JSX.Element;
+export declare const Drawer: import('react').ForwardRefExoticComponent<DrawerProps & import('react').RefAttributes<HTMLDivElement>>;
 export default Drawer;

package/components/Drawer/Drawer.sx.d.cts

@@ -0,0 +1,28 @@
+import { CSSObject, SxProps, Theme } from '@mui/material/styles';
+export interface BuildDrawerSxArgs {
+    /** Ancho actual del drawer (expanded o collapsed). */
+    width: number;
+    /** Duración de la transición de ancho en ms. */
+    transitionDuration?: number;
+}
+/**
+ * Estilo de fábrica del Drawer, en CSS real (para `styled()`). Controla el
+ * ancho animado y el paper interno; lo visual del paper (background, border)
+ * queda en manos del theme.
+ */
+export declare function buildDrawerStyles(theme: Theme, { width, transitionDuration }: BuildDrawerSxArgs): CSSObject;
+/**
+ * @deprecated El componente ya no lo usa: su estilo de fábrica vive en el
+ * `styled()`. Preferir `buildDrawerStyles`.
+ */
+export declare function buildDrawerSx({ width, transitionDuration, }: BuildDrawerSxArgs): SxProps<Theme>;
+export interface BuildDrawerItemSxArgs {
+    collapsed: boolean;
+    active?: boolean;
+    danger?: boolean;
+}
+/**
+ * sx para un item del drawer. Centra el icono cuando está colapsado y
+ * tiñe el fondo cuando el item está activo.
+ */
+export declare function buildDrawerItemSx({ collapsed, active, danger, }: BuildDrawerItemSxArgs): SxProps<Theme>;

package/components/Drawer/Drawer.sx.d.mts

@@ -0,0 +1,28 @@
+import { CSSObject, SxProps, Theme } from '@mui/material/styles';
+export interface BuildDrawerSxArgs {
+    /** Ancho actual del drawer (expanded o collapsed). */
+    width: number;
+    /** Duración de la transición de ancho en ms. */
+    transitionDuration?: number;
+}
+/**
+ * Estilo de fábrica del Drawer, en CSS real (para `styled()`). Controla el
+ * ancho animado y el paper interno; lo visual del paper (background, border)
+ * queda en manos del theme.
+ */
+export declare function buildDrawerStyles(theme: Theme, { width, transitionDuration }: BuildDrawerSxArgs): CSSObject;
+/**
+ * @deprecated El componente ya no lo usa: su estilo de fábrica vive en el
+ * `styled()`. Preferir `buildDrawerStyles`.
+ */
+export declare function buildDrawerSx({ width, transitionDuration, }: BuildDrawerSxArgs): SxProps<Theme>;
+export interface BuildDrawerItemSxArgs {
+    collapsed: boolean;
+    active?: boolean;
+    danger?: boolean;
+}
+/**
+ * sx para un item del drawer. Centra el icono cuando está colapsado y
+ * tiñe el fondo cuando el item está activo.
+ */
+export declare function buildDrawerItemSx({ collapsed, active, danger, }: BuildDrawerItemSxArgs): SxProps<Theme>;

package/components/Drawer/Drawer.sx.d.ts

@@ -1,4 +1,4 @@
-import { SxProps, Theme } from '@mui/material/styles';
+import { CSSObject, SxProps, Theme } from '@mui/material/styles';
 export interface BuildDrawerSxArgs {
     /** Ancho actual del drawer (expanded o collapsed). */
     width: number;
@@ -6,9 +6,14 @@ export interface BuildDrawerSxArgs {
     transitionDuration?: number;
 }
 /**
- * sx aplicado al root del MuiDrawer. Controla el ancho animado y el paper
- * interno. Los estilos visuales del paper (background, border) se dejan en
- * manos del theme / preset.
+ * Estilo de fábrica del Drawer, en CSS real (para `styled()`). Controla el
+ * ancho animado y el paper interno; lo visual del paper (background, border)
+ * queda en manos del theme.
+ */
+export declare function buildDrawerStyles(theme: Theme, { width, transitionDuration }: BuildDrawerSxArgs): CSSObject;
+/**
+ * @deprecated El componente ya no lo usa: su estilo de fábrica vive en el
+ * `styled()`. Preferir `buildDrawerStyles`.
  */
 export declare function buildDrawerSx({ width, transitionDuration, }: BuildDrawerSxArgs): SxProps<Theme>;
 export interface BuildDrawerItemSxArgs {

package/components/Drawer/DrawerContext.d.cts

@@ -0,0 +1,18 @@
+/**
+ * Context interno del Drawer. Permite que los sub-componentes (DrawerItem,
+ * DrawerSection, etc.) reaccionen al estado `collapsed` sin necesidad de
+ * recibirlo por props explícitas.
+ */
+export interface DrawerContextValue {
+    /** Si el drawer está en modo mini (solo iconos). */
+    collapsed: boolean;
+    /** Ancho actual del drawer (útil para sub-componentes que necesiten layout). */
+    width: number;
+}
+export declare const DrawerContext: import('react').Context<DrawerContextValue | null>;
+/**
+ * Hook para leer el estado del drawer desde cualquier sub-componente. Si se
+ * llama fuera de un `<Drawer>`, devuelve valores por defecto (collapsed=false)
+ * para que los items renderizados sueltos no exploten.
+ */
+export declare function useDrawerContext(): DrawerContextValue;

package/components/Drawer/DrawerContext.d.mts

@@ -0,0 +1,18 @@
+/**
+ * Context interno del Drawer. Permite que los sub-componentes (DrawerItem,
+ * DrawerSection, etc.) reaccionen al estado `collapsed` sin necesidad de
+ * recibirlo por props explícitas.
+ */
+export interface DrawerContextValue {
+    /** Si el drawer está en modo mini (solo iconos). */
+    collapsed: boolean;
+    /** Ancho actual del drawer (útil para sub-componentes que necesiten layout). */
+    width: number;
+}
+export declare const DrawerContext: import('react').Context<DrawerContextValue | null>;
+/**
+ * Hook para leer el estado del drawer desde cualquier sub-componente. Si se
+ * llama fuera de un `<Drawer>`, devuelve valores por defecto (collapsed=false)
+ * para que los items renderizados sueltos no exploten.
+ */
+export declare function useDrawerContext(): DrawerContextValue;