@soyfri/shared-library 1.6.0-beta.0 → 1.6.0-beta.1

package/components/Drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/DrawerContext.ts","../../../src/components/Drawer/Drawer.sx.ts","../../../src/components/Drawer/Drawer.tsx","../../../src/components/Drawer/DrawerItem.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\n/**\n * Context interno del Drawer. Permite que los sub-componentes (DrawerItem,\n * DrawerSection, etc.) reaccionen al estado `collapsed` sin necesidad de\n * recibirlo por props explícitas.\n */\nexport interface DrawerContextValue {\n  /** Si el drawer está en modo mini (solo iconos). */\n  collapsed: boolean;\n  /** Ancho actual del drawer (útil para sub-componentes que necesiten layout). */\n  width: number;\n}\n\nexport const DrawerContext = createContext<DrawerContextValue | null>(null);\n\n/**\n * Hook para leer el estado del drawer desde cualquier sub-componente. Si se\n * llama fuera de un `<Drawer>`, devuelve valores por defecto (collapsed=false)\n * para que los items renderizados sueltos no exploten.\n */\nexport function useDrawerContext(): DrawerContextValue {\n  const ctx = useContext(DrawerContext);\n  if (ctx) return ctx;\n  return { collapsed: false, width: 260 };\n}\n","import { alpha, type SxProps, type Theme } from '@mui/material/styles';\n\nexport interface BuildDrawerSxArgs {\n  /** Ancho actual del drawer (expanded o collapsed). */\n  width: number;\n  /** Duración de la transición de ancho en ms. */\n  transitionDuration?: number;\n}\n\n/**\n * sx aplicado al root del MuiDrawer. Controla el ancho animado y el paper\n * interno. Los estilos visuales del paper (background, border) se dejan en\n * manos del theme / preset.\n */\nexport function buildDrawerSx({\n  width,\n  transitionDuration = 200,\n}: BuildDrawerSxArgs): SxProps<Theme> {\n  return {\n    width,\n    flexShrink: 0,\n    whiteSpace: 'nowrap',\n    boxSizing: 'border-box',\n    transition: (theme) =>\n      theme.transitions.create('width', {\n        easing: theme.transitions.easing.sharp,\n        duration: transitionDuration,\n      }),\n    '& .MuiDrawer-paper': {\n      width,\n      boxSizing: 'border-box',\n      overflowX: 'hidden',\n      transition: (theme) =>\n        theme.transitions.create('width', {\n          easing: theme.transitions.easing.sharp,\n          duration: transitionDuration,\n        }),\n    },\n  };\n}\n\nexport interface BuildDrawerItemSxArgs {\n  collapsed: boolean;\n  active?: boolean;\n  danger?: boolean;\n}\n\n/**\n * sx para un item del drawer. Centra el icono cuando está colapsado y\n * tiñe el fondo cuando el item está activo.\n */\nexport function buildDrawerItemSx({\n  collapsed,\n  active,\n  danger,\n}: BuildDrawerItemSxArgs): SxProps<Theme> {\n  return (theme) => ({\n    minHeight: 44,\n    px: collapsed ? 1 : 2,\n    py: 1,\n    mx: 1,\n    my: 0.25,\n    borderRadius: 1,\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: collapsed ? 'center' : 'flex-start',\n    gap: collapsed ? 0 : 1.5,\n    cursor: 'pointer',\n    color: danger\n      ? theme.palette.error.main\n      : active\n        ? theme.palette.primary.main\n        : theme.palette.text.primary,\n    backgroundColor: active\n      ? theme.palette.action.selected\n      : 'transparent',\n    transition: theme.transitions.create(\n      ['background-color', 'color', 'padding'],\n      { duration: 150 },\n    ),\n    '&:hover': {\n      backgroundColor: danger\n        ? alpha(theme.palette.error.main, 0.08)\n        : theme.palette.action.hover,\n    },\n    '& .drawer-item__icon': {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      minWidth: 24,\n    },\n    '& .drawer-item__label': {\n      flex: 1,\n      minWidth: 0,\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap',\n      opacity: collapsed ? 0 : 1,\n      width: collapsed ? 0 : 'auto',\n      transition: theme.transitions.create(['opacity', 'width'], {\n        duration: collapsed ? 100 : 200,\n      }),\n    },\n  });\n}\n","import { useMemo, type ReactNode } from 'react';\nimport {\n  Drawer as MuiDrawer,\n  IconButton,\n  Box,\n  type DrawerProps as MuiDrawerProps,\n} from '@mui/material';\nimport {\n  useTheme,\n  type SxProps,\n  type Theme,\n} from '@mui/material/styles';\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft';\nimport ChevronRightIcon from '@mui/icons-material/ChevronRight';\n\nimport { DrawerContext } from './DrawerContext';\nimport { buildDrawerSx } from './Drawer.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos públicos ──────────────────────────────────────────────────────\nexport type DrawerVariant = 'permanent' | 'persistent' | 'temporary';\nexport type DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';\n\nexport interface DrawerProps {\n  /** Contenido del drawer (típicamente `<DrawerItem>`s). */\n  children?: ReactNode;\n  /**\n   * Variante del drawer:\n   * - `permanent` (default): siempre visible en desktop, soporta collapsed (mini).\n   * - `persistent`: se oculta/muestra, empuja el contenido principal.\n   * - `temporary`: flotante con backdrop (típico móvil).\n   */\n  variant?: DrawerVariant;\n  /** Lado del viewport. Default: `'left'`. */\n  anchor?: DrawerAnchor;\n  /**\n   * Estado mini (solo iconos). Solo se aplica con `variant=\"permanent\"` o\n   * `\"persistent\"`. Si no se provee, el drawer está siempre expandido.\n   */\n  collapsed?: boolean;\n  /** Callback del botón de toggle (chevron). */\n  onToggleCollapse?: () => void;\n  /** Estado abierto/cerrado (aplica a `temporary` y `persistent`). */\n  open?: boolean;\n  /** Callback de cierre (backdrop o ESC en temporary). */\n  onClose?: MuiDrawerProps['onClose'];\n  /** Ancho en estado expandido. Default: 260. */\n  expandedWidth?: number;\n  /** Ancho en estado colapsado (solo iconos). Default: 72. */\n  collapsedWidth?: number;\n  /** Muestra el botón chevron para toggle collapsed. Default: true si `onToggleCollapse` está definido. */\n  showCollapseButton?: boolean;\n  /** Contenido del header (por encima de los items). Típicamente logo/brand. */\n  header?: ReactNode;\n  /**\n   * Logo/brand que se muestra junto al botón de toggle.\n   * - Expandido: logo a la izquierda, toggle a la derecha en la misma fila.\n   * - Colapsado: logo arriba centrado, toggle debajo centrado (stack vertical).\n   * Siempre visible (a diferencia de `header`, que se oculta al colapsar).\n   */\n  logo?: ReactNode;\n  /** Contenido del footer (por debajo de los items). Típicamente user profile. */\n  footer?: ReactNode;\n  /**\n   * Nombre del preset de estilo registrado en `theme.styles.Drawer`.\n   * - `\"default\"` (o ausente) = estilo built-in del paquete.\n   */\n  preset?: string;\n  /** sx aplicado al Drawer (root). Se mergea después del preset. */\n  sx?: SxProps<Theme>;\n  /** sx aplicado al Paper interno. */\n  paperSx?: SxProps<Theme>;\n  className?: string;\n}\n\nexport function Drawer({\n  children,\n  variant = 'permanent',\n  anchor = 'left',\n  collapsed = false,\n  onToggleCollapse,\n  open,\n  onClose,\n  expandedWidth = 260,\n  collapsedWidth = 72,\n  showCollapseButton,\n  header,\n  logo,\n  footer,\n  preset,\n  sx,\n  paperSx,\n  className,\n}: DrawerProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('Drawer', preset, theme);\n\n  // El mini-variant solo tiene sentido en permanent / persistent.\n  const supportsCollapsed = variant !== 'temporary';\n  const effectiveWidth =\n    supportsCollapsed && collapsed ? collapsedWidth : expandedWidth;\n\n  const contextValue = useMemo(\n    () => ({\n      collapsed: supportsCollapsed && collapsed,\n      width: effectiveWidth,\n    }),\n    [supportsCollapsed, collapsed, effectiveWidth],\n  );\n\n  const rootSx: SxProps<Theme> = [\n    buildDrawerSx({ width: effectiveWidth }),\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ];\n\n  const shouldShowToggle =\n    showCollapseButton ?? (supportsCollapsed && !!onToggleCollapse);\n\n  const openProp =\n    variant === 'permanent'\n      ? true\n      : open !== undefined\n        ? open\n        : false;\n\n  return (\n    <DrawerContext.Provider value={contextValue}>\n      <MuiDrawer\n        variant={variant}\n        anchor={anchor}\n        open={openProp}\n        onClose={onClose}\n        className={className}\n        sx={rootSx}\n        slotProps={{\n          paper: {\n            sx: paperSx,\n          },\n        }}\n      >\n        {(logo || shouldShowToggle) && (\n          <Box\n            sx={{\n              display: 'flex',\n              flexDirection: contextValue.collapsed ? 'column' : 'row',\n              alignItems: 'center',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : logo\n                  ? 'space-between'\n                  : 'flex-end',\n              gap: contextValue.collapsed ? 0.5 : 0,\n              px: contextValue.collapsed ? 1 : 2,\n              py: 1,\n              minHeight: 64,\n              flexShrink: 0,\n            }}\n          >\n            {logo && (\n              <Box sx={{ display: 'flex', alignItems: 'center', minWidth: 0 }}>\n                {logo}\n              </Box>\n            )}\n            {shouldShowToggle && (\n              <IconButton\n                size=\"small\"\n                onClick={onToggleCollapse}\n                aria-label={collapsed ? 'Expandir menú' : 'Colapsar menú'}\n              >\n                {collapsed ? <ChevronRightIcon /> : <ChevronLeftIcon />}\n              </IconButton>\n            )}\n          </Box>\n        )}\n\n        {header && !contextValue.collapsed && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              px: 2,\n              py: 1.5,\n              minHeight: 56,\n              flexShrink: 0,\n            }}\n          >\n            <Box sx={{ flex: 1, minWidth: 0 }}>{header}</Box>\n          </Box>\n        )}\n\n        <Box\n          component=\"nav\"\n          sx={{\n            flex: 1,\n            overflowY: 'auto',\n            overflowX: 'hidden',\n            py: 1,\n          }}\n        >\n          {children}\n        </Box>\n\n        {footer && (\n          <Box\n            sx={{\n              flexShrink: 0,\n              borderTop: (t) => `1px solid ${t.palette.divider}`,\n              p: contextValue.collapsed ? 1 : 1.5,\n              display: 'flex',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : 'flex-start',\n            }}\n          >\n            {footer}\n          </Box>\n        )}\n      </MuiDrawer>\n    </DrawerContext.Provider>\n  );\n}\n\nexport default Drawer;\n","import React, { type ReactNode, type MouseEvent } from 'react';\nimport { Box, Tooltip, Typography } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nimport { useDrawerContext } from './DrawerContext';\nimport { buildDrawerItemSx } from './Drawer.sx';\n\nexport interface DrawerItemProps {\n  /** Icono del item. Se muestra siempre (expanded y collapsed). */\n  icon?: ReactNode;\n  /** Texto del item. Se oculta cuando el drawer está colapsado (muestra tooltip). */\n  label: ReactNode;\n  /**\n   * Texto del tooltip en modo collapsed. Si no se provee y `label` es string,\n   * se usa `label`. Necesario cuando `label` es un ReactNode complejo.\n   */\n  tooltipText?: string;\n  /** Handler de click. */\n  onClick?: (event: MouseEvent<HTMLDivElement>) => void;\n  /** Marca el item como activo (destaca color y fondo). */\n  active?: boolean;\n  /** Marca el item como \"destructivo\" (p.ej. cerrar sesión): color error. */\n  danger?: boolean;\n  /** Deshabilita click + bajo opacidad. */\n  disabled?: boolean;\n  /** Contenido adicional a la derecha del label (badge, count, chevron). */\n  endAdornment?: ReactNode;\n  /** sx override del consumer, se mergea al final. */\n  sx?: SxProps<Theme>;\n  className?: string;\n}\n\n/**\n * Item de un Drawer de shared-library. Lee el estado `collapsed` del\n * DrawerContext para adaptar layout y mostrar tooltip en modo mini.\n *\n * Uso típico:\n * ```tsx\n * <Drawer collapsed={collapsed} onToggleCollapse={toggle}>\n *   <DrawerItem icon={<HomeIcon />} label=\"Inicio\" active />\n *   <DrawerItem icon={<UserIcon />} label=\"Perfil\" />\n * </Drawer>\n * ```\n */\nexport function DrawerItem({\n  icon,\n  label,\n  tooltipText,\n  onClick,\n  active = false,\n  danger = false,\n  disabled = false,\n  endAdornment,\n  sx,\n  className,\n}: DrawerItemProps) {\n  const { collapsed } = useDrawerContext();\n\n  const baseSx = buildDrawerItemSx({ collapsed, active, danger });\n\n  const mergedSx: SxProps<Theme> = [\n    baseSx,\n    disabled && { pointerEvents: 'none', opacity: 0.5 },\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ].filter(Boolean) as SxProps<Theme>;\n\n  const content = (\n    <Box\n      role=\"button\"\n      tabIndex={disabled ? -1 : 0}\n      aria-disabled={disabled}\n      onClick={disabled ? undefined : onClick}\n      onKeyDown={(event) => {\n        if (disabled) return;\n        if (event.key === 'Enter' || event.key === ' ') {\n          event.preventDefault();\n          onClick?.(event as unknown as MouseEvent<HTMLDivElement>);\n        }\n      }}\n      className={className}\n      sx={mergedSx}\n    >\n      {icon && (\n        <Box className=\"drawer-item__icon\" component=\"span\">\n          {icon}\n        </Box>\n      )}\n      <Typography\n        component=\"span\"\n        variant=\"body2\"\n        className=\"drawer-item__label\"\n        sx={{ fontWeight: active ? 600 : 400 }}\n      >\n        {label}\n      </Typography>\n      {!collapsed && endAdornment && (\n        <Box component=\"span\" sx={{ flexShrink: 0, ml: 'auto' }}>\n          {endAdornment}\n        </Box>\n      )}\n    </Box>\n  );\n\n  // Cuando está colapsado, envolvemos en tooltip para revelar el label al hover.\n  // Prioriza `tooltipText` explícito; si no, cae al `label` si es string.\n  const resolvedTooltip =\n    tooltipText ?? (typeof label === 'string' ? label : undefined);\n\n  if (collapsed && resolvedTooltip) {\n    return (\n      <Tooltip title={resolvedTooltip} placement=\"right\" arrow>\n        {content}\n      </Tooltip>\n    );\n  }\n\n  return content;\n}\n\nexport default DrawerItem;\n"],"names":["MuiDrawer"],"mappings":";;;;;;;AAcO,MAAM,gBAAgB,cAAyC,IAAI;AAOnE,SAAS,mBAAuC;AACrD,QAAM,MAAM,WAAW,aAAa;AACpC,MAAI,IAAK,QAAO;AAChB,SAAO,EAAE,WAAW,OAAO,OAAO,IAAA;AACpC;ACXO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA,qBAAqB;AACvB,GAAsC;AACpC,SAAO;AAAA,IACL;AAAA,IACA,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,YAAY,CAAC,UACX,MAAM,YAAY,OAAO,SAAS;AAAA,MAChC,QAAQ,MAAM,YAAY,OAAO;AAAA,MACjC,UAAU;AAAA,IAAA,CACX;AAAA,IACH,sBAAsB;AAAA,MACpB;AAAA,MACA,WAAW;AAAA,MACX,WAAW;AAAA,MACX,YAAY,CAAC,UACX,MAAM,YAAY,OAAO,SAAS;AAAA,QAChC,QAAQ,MAAM,YAAY,OAAO;AAAA,QACjC,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EACL;AAEJ;AAYO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACF,GAA0C;AACxC,SAAO,CAAC,WAAW;AAAA,IACjB,WAAW;AAAA,IACX,IAAI,YAAY,IAAI;AAAA,IACpB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,cAAc;AAAA,IACd,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB,YAAY,WAAW;AAAA,IACvC,KAAK,YAAY,IAAI;AAAA,IACrB,QAAQ;AAAA,IACR,OAAO,SACH,MAAM,QAAQ,MAAM,OACpB,SACE,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,KAAK;AAAA,IACzB,iBAAiB,SACb,MAAM,QAAQ,OAAO,WACrB;AAAA,IACJ,YAAY,MAAM,YAAY;AAAA,MAC5B,CAAC,oBAAoB,SAAS,SAAS;AAAA,MACvC,EAAE,UAAU,IAAA;AAAA,IAAI;AAAA,IAElB,WAAW;AAAA,MACT,iBAAiB,SACb,MAAM,MAAM,QAAQ,MAAM,MAAM,IAAI,IACpC,MAAM,QAAQ,OAAO;AAAA,IAAA;AAAA,IAE3B,wBAAwB;AAAA,MACtB,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,UAAU;AAAA,IAAA;AAAA,IAEZ,yBAAyB;AAAA,MACvB,MAAM;AAAA,MACN,UAAU;AAAA,MACV,UAAU;AAAA,MACV,cAAc;AAAA,MACd,YAAY;AAAA,MACZ,SAAS,YAAY,IAAI;AAAA,MACzB,OAAO,YAAY,IAAI;AAAA,MACvB,YAAY,MAAM,YAAY,OAAO,CAAC,WAAW,OAAO,GAAG;AAAA,QACzD,UAAU,YAAY,MAAM;AAAA,MAAA,CAC7B;AAAA,IAAA;AAAA,EACH;AAEJ;AC9BO,SAAS,OAAO;AAAA,EACrB;AAAA,EACA,UAAU;AAAA,EACV,SAAS;AAAA,EACT,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAgB;AACd,QAAM,QAAQ,SAAA;AACd,QAAM,WAAW,cAAc,UAAU,QAAQ,KAAK;AAGtD,QAAM,oBAAoB,YAAY;AACtC,QAAM,iBACJ,qBAAqB,YAAY,iBAAiB;AAEpD,QAAM,eAAe;AAAA,IACnB,OAAO;AAAA,MACL,WAAW,qBAAqB;AAAA,MAChC,OAAO;AAAA,IAAA;AAAA,IAET,CAAC,mBAAmB,WAAW,cAAc;AAAA,EAAA;AAG/C,QAAM,SAAyB;AAAA,IAC7B,cAAc,EAAE,OAAO,gBAAgB;AAAA,IACvC,GAAI,WAAW,CAAC,QAAQ,IAAI,CAAA;AAAA,IAC5B,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,IAAI,CAAA;AAAA,EAAC;AAG5C,QAAM,mBACJ,kDAAuB,qBAAqB,CAAC,CAAC;AAEhD,QAAM,WACJ,YAAY,cACR,OACA,SAAS,SACP,OACA;AAER,SACE,oBAAC,cAAc,UAAd,EAAuB,OAAO,cAC7B,UAAA;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA,IAAI;AAAA,MACJ,WAAW;AAAA,QACT,OAAO;AAAA,UACL,IAAI;AAAA,QAAA;AAAA,MACN;AAAA,MAGA,UAAA;AAAA,SAAA,QAAQ,qBACR;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,SAAS;AAAA,cACT,eAAe,aAAa,YAAY,WAAW;AAAA,cACnD,YAAY;AAAA,cACZ,gBAAgB,aAAa,YACzB,WACA,OACE,kBACA;AAAA,cACN,KAAK,aAAa,YAAY,MAAM;AAAA,cACpC,IAAI,aAAa,YAAY,IAAI;AAAA,cACjC,IAAI;AAAA,cACJ,WAAW;AAAA,cACX,YAAY;AAAA,YAAA;AAAA,YAGb,UAAA;AAAA,cAAA,QACC,oBAAC,KAAA,EAAI,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,UAAU,EAAA,GACzD,UAAA,KAAA,CACH;AAAA,cAED,oBACC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,SAAS;AAAA,kBACT,cAAY,YAAY,kBAAkB;AAAA,kBAEzC,UAAA,YAAY,oBAAC,kBAAA,CAAA,CAAiB,wBAAM,iBAAA,CAAA,CAAgB;AAAA,gBAAA;AAAA,cAAA;AAAA,YACvD;AAAA,UAAA;AAAA,QAAA;AAAA,QAKL,UAAU,CAAC,aAAa,aACvB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,WAAW;AAAA,cACX,YAAY;AAAA,YAAA;AAAA,YAGd,UAAA,oBAAC,OAAI,IAAI,EAAE,MAAM,GAAG,UAAU,KAAM,UAAA,OAAA,CAAO;AAAA,UAAA;AAAA,QAAA;AAAA,QAI/C;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,IAAI;AAAA,cACF,MAAM;AAAA,cACN,WAAW;AAAA,cACX,WAAW;AAAA,cACX,IAAI;AAAA,YAAA;AAAA,YAGL;AAAA,UAAA;AAAA,QAAA;AAAA,QAGF,UACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,YAAY;AAAA,cACZ,WAAW,CAAC,MAAM,aAAa,EAAE,QAAQ,OAAO;AAAA,cAChD,GAAG,aAAa,YAAY,IAAI;AAAA,cAChC,SAAS;AAAA,cACT,gBAAgB,aAAa,YACzB,WACA;AAAA,YAAA;AAAA,YAGL,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA,GAGN;AAEJ;ACjLO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,SAAS;AAAA,EACT,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AACF,GAAoB;AAClB,QAAM,EAAE,UAAA,IAAc,iBAAA;AAEtB,QAAM,SAAS,kBAAkB,EAAE,WAAW,QAAQ,QAAQ;AAE9D,QAAM,WAA2B;AAAA,IAC/B;AAAA,IACA,YAAY,EAAE,eAAe,QAAQ,SAAS,IAAA;AAAA,IAC9C,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,IAAI,CAAA;AAAA,EAAC,EAC1C,OAAO,OAAO;AAEhB,QAAM,UACJ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAU,WAAW,KAAK;AAAA,MAC1B,iBAAe;AAAA,MACf,SAAS,WAAW,SAAY;AAAA,MAChC,WAAW,CAAC,UAAU;AACpB,YAAI,SAAU;AACd,YAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,gBAAM,eAAA;AACN,6CAAU;AAAA,QACZ;AAAA,MACF;AAAA,MACA;AAAA,MACA,IAAI;AAAA,MAEH,UAAA;AAAA,QAAA,4BACE,KAAA,EAAI,WAAU,qBAAoB,WAAU,QAC1C,UAAA,MACH;AAAA,QAEF;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,IAAI,EAAE,YAAY,SAAS,MAAM,IAAA;AAAA,YAEhC,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,CAAC,aAAa,gBACb,oBAAC,OAAI,WAAU,QAAO,IAAI,EAAE,YAAY,GAAG,IAAI,OAAA,GAC5C,UAAA,aAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAON,QAAM,kBACJ,oCAAgB,OAAO,UAAU,WAAW,QAAQ;AAEtD,MAAI,aAAa,iBAAiB;AAChC,WACE,oBAAC,WAAQ,OAAO,iBAAiB,WAAU,SAAQ,OAAK,MACrD,UAAA,QAAA,CACH;AAAA,EAEJ;AAEA,SAAO;AACT;"}
+{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/DrawerContext.ts","../../../src/components/Drawer/Drawer.sx.ts","../../../src/components/Drawer/Drawer.tsx","../../../src/components/Drawer/DrawerItem.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\n/**\n * Context interno del Drawer. Permite que los sub-componentes (DrawerItem,\n * DrawerSection, etc.) reaccionen al estado `collapsed` sin necesidad de\n * recibirlo por props explícitas.\n */\nexport interface DrawerContextValue {\n  /** Si el drawer está en modo mini (solo iconos). */\n  collapsed: boolean;\n  /** Ancho actual del drawer (útil para sub-componentes que necesiten layout). */\n  width: number;\n}\n\nexport const DrawerContext = createContext<DrawerContextValue | null>(null);\n\n/**\n * Hook para leer el estado del drawer desde cualquier sub-componente. Si se\n * llama fuera de un `<Drawer>`, devuelve valores por defecto (collapsed=false)\n * para que los items renderizados sueltos no exploten.\n */\nexport function useDrawerContext(): DrawerContextValue {\n  const ctx = useContext(DrawerContext);\n  if (ctx) return ctx;\n  return { collapsed: false, width: 260 };\n}\n","import { alpha, type SxProps, type Theme } from '@mui/material/styles';\n\nexport interface BuildDrawerSxArgs {\n  /** Ancho actual del drawer (expanded o collapsed). */\n  width: number;\n  /** Duración de la transición de ancho en ms. */\n  transitionDuration?: number;\n}\n\n/**\n * sx aplicado al root del MuiDrawer. Controla el ancho animado y el paper\n * interno. Los estilos visuales del paper (background, border) se dejan en\n * manos del theme / preset.\n */\nexport function buildDrawerSx({\n  width,\n  transitionDuration = 200,\n}: BuildDrawerSxArgs): SxProps<Theme> {\n  return {\n    width,\n    flexShrink: 0,\n    whiteSpace: 'nowrap',\n    boxSizing: 'border-box',\n    transition: (theme) =>\n      theme.transitions.create('width', {\n        easing: theme.transitions.easing.sharp,\n        duration: transitionDuration,\n      }),\n    '& .MuiDrawer-paper': {\n      width,\n      boxSizing: 'border-box',\n      overflowX: 'hidden',\n      transition: (theme) =>\n        theme.transitions.create('width', {\n          easing: theme.transitions.easing.sharp,\n          duration: transitionDuration,\n        }),\n    },\n  };\n}\n\nexport interface BuildDrawerItemSxArgs {\n  collapsed: boolean;\n  active?: boolean;\n  danger?: boolean;\n}\n\n/**\n * sx para un item del drawer. Centra el icono cuando está colapsado y\n * tiñe el fondo cuando el item está activo.\n */\nexport function buildDrawerItemSx({\n  collapsed,\n  active,\n  danger,\n}: BuildDrawerItemSxArgs): SxProps<Theme> {\n  return (theme) => ({\n    minHeight: 44,\n    px: collapsed ? 1 : 2,\n    py: 1,\n    mx: 1,\n    my: 0.25,\n    borderRadius: 1,\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: collapsed ? 'center' : 'flex-start',\n    gap: collapsed ? 0 : 1.5,\n    cursor: 'pointer',\n    color: danger\n      ? theme.palette.error.main\n      : active\n        ? theme.palette.primary.main\n        : theme.palette.text.primary,\n    backgroundColor: active\n      ? theme.palette.action.selected\n      : 'transparent',\n    transition: theme.transitions.create(\n      ['background-color', 'color', 'padding'],\n      { duration: 150 },\n    ),\n    '&:hover': {\n      backgroundColor: danger\n        ? alpha(theme.palette.error.main, 0.08)\n        : theme.palette.action.hover,\n    },\n    '& .drawer-item__icon': {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      minWidth: 24,\n    },\n    '& .drawer-item__label': {\n      flex: 1,\n      minWidth: 0,\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap',\n      opacity: collapsed ? 0 : 1,\n      width: collapsed ? 0 : 'auto',\n      transition: theme.transitions.create(['opacity', 'width'], {\n        duration: collapsed ? 100 : 200,\n      }),\n    },\n  });\n}\n","import { useMemo, type ReactNode } from 'react';\nimport {\n  Drawer as MuiDrawer,\n  IconButton,\n  Box,\n  type DrawerProps as MuiDrawerProps,\n} from '@mui/material';\nimport {\n  useTheme,\n  type SxProps,\n  type Theme,\n} from '@mui/material/styles';\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft';\nimport ChevronRightIcon from '@mui/icons-material/ChevronRight';\n\nimport { DrawerContext } from './DrawerContext';\nimport { buildDrawerSx } from './Drawer.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos públicos ──────────────────────────────────────────────────────\nexport type DrawerVariant = 'permanent' | 'persistent' | 'temporary';\nexport type DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';\n\nexport interface DrawerProps {\n  /** Contenido del drawer (típicamente `<DrawerItem>`s). */\n  children?: ReactNode;\n  /**\n   * Variante del drawer:\n   * - `permanent` (default): siempre visible en desktop, soporta collapsed (mini).\n   * - `persistent`: se oculta/muestra, empuja el contenido principal.\n   * - `temporary`: flotante con backdrop (típico móvil).\n   */\n  variant?: DrawerVariant;\n  /** Lado del viewport. Default: `'left'`. */\n  anchor?: DrawerAnchor;\n  /**\n   * Estado mini (solo iconos). Solo se aplica con `variant=\"permanent\"` o\n   * `\"persistent\"`. Si no se provee, el drawer está siempre expandido.\n   */\n  collapsed?: boolean;\n  /** Callback del botón de toggle (chevron). */\n  onToggleCollapse?: () => void;\n  /** Estado abierto/cerrado (aplica a `temporary` y `persistent`). */\n  open?: boolean;\n  /** Callback de cierre (backdrop o ESC en temporary). */\n  onClose?: MuiDrawerProps['onClose'];\n  /** Ancho en estado expandido. Default: 260. */\n  expandedWidth?: number;\n  /** Ancho en estado colapsado (solo iconos). Default: 72. */\n  collapsedWidth?: number;\n  /** Sombra del Paper interno (0-24). Default: MUI lo gestiona según variant. */\n  elevation?: MuiDrawerProps['elevation'];\n  /** Muestra el botón chevron para toggle collapsed. Default: true si `onToggleCollapse` está definido. */\n  showCollapseButton?: boolean;\n  /** Contenido del header (por encima de los items). Típicamente logo/brand. */\n  header?: ReactNode;\n  /**\n   * Logo/brand que se muestra junto al botón de toggle.\n   * - Expandido: logo a la izquierda, toggle a la derecha en la misma fila.\n   * - Colapsado: logo arriba centrado, toggle debajo centrado (stack vertical).\n   * Siempre visible (a diferencia de `header`, que se oculta al colapsar).\n   */\n  logo?: ReactNode;\n  /** Contenido del footer (por debajo de los items). Típicamente user profile. */\n  footer?: ReactNode;\n  /**\n   * Nombre del preset de estilo registrado en `theme.styles.Drawer`.\n   * - `\"default\"` (o ausente) = estilo built-in del paquete.\n   */\n  preset?: string;\n  /** sx aplicado al Drawer (root). Se mergea después del preset. */\n  sx?: SxProps<Theme>;\n  /** sx aplicado al Paper interno. */\n  paperSx?: SxProps<Theme>;\n  className?: string;\n}\n\nexport function Drawer({\n  children,\n  variant = 'permanent',\n  anchor = 'left',\n  collapsed = false,\n  onToggleCollapse,\n  open,\n  onClose,\n  expandedWidth = 260,\n  collapsedWidth = 72,\n  elevation,\n  showCollapseButton,\n  header,\n  logo,\n  footer,\n  preset,\n  sx,\n  paperSx,\n  className,\n}: DrawerProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('Drawer', preset, theme);\n\n  // El mini-variant solo tiene sentido en permanent / persistent.\n  const supportsCollapsed = variant !== 'temporary';\n  const effectiveWidth =\n    supportsCollapsed && collapsed ? collapsedWidth : expandedWidth;\n\n  const contextValue = useMemo(\n    () => ({\n      collapsed: supportsCollapsed && collapsed,\n      width: effectiveWidth,\n    }),\n    [supportsCollapsed, collapsed, effectiveWidth],\n  );\n\n  const rootSx: SxProps<Theme> = [\n    buildDrawerSx({ width: effectiveWidth }),\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ];\n\n  const shouldShowToggle =\n    showCollapseButton ?? (supportsCollapsed && !!onToggleCollapse);\n\n  const openProp =\n    variant === 'permanent'\n      ? true\n      : open !== undefined\n        ? open\n        : false;\n\n  return (\n    <DrawerContext.Provider value={contextValue}>\n      <MuiDrawer\n        variant={variant}\n        anchor={anchor}\n        open={openProp}\n        onClose={onClose}\n        elevation={elevation}\n        className={className}\n        sx={rootSx}\n        slotProps={{\n          paper: {\n            sx: paperSx,\n          },\n        }}\n      >\n        {(logo || shouldShowToggle) && (\n          <Box\n            sx={{\n              display: 'flex',\n              flexDirection: contextValue.collapsed ? 'column' : 'row',\n              alignItems: 'center',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : logo\n                  ? 'space-between'\n                  : 'flex-end',\n              gap: contextValue.collapsed ? 0.5 : 0,\n              px: contextValue.collapsed ? 1 : 2,\n              py: 1,\n              minHeight: 64,\n              flexShrink: 0,\n            }}\n          >\n            {logo && (\n              <Box sx={{ display: 'flex', alignItems: 'center', minWidth: 0 }}>\n                {logo}\n              </Box>\n            )}\n            {shouldShowToggle && (\n              <IconButton\n                size=\"small\"\n                onClick={onToggleCollapse}\n                aria-label={collapsed ? 'Expandir menú' : 'Colapsar menú'}\n              >\n                {collapsed ? <ChevronRightIcon /> : <ChevronLeftIcon />}\n              </IconButton>\n            )}\n          </Box>\n        )}\n\n        {header && !contextValue.collapsed && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              px: 2,\n              py: 1.5,\n              minHeight: 56,\n              flexShrink: 0,\n            }}\n          >\n            <Box sx={{ flex: 1, minWidth: 0 }}>{header}</Box>\n          </Box>\n        )}\n\n        <Box\n          component=\"nav\"\n          sx={{\n            flex: 1,\n            overflowY: 'auto',\n            overflowX: 'hidden',\n            py: 1,\n          }}\n        >\n          {children}\n        </Box>\n\n        {footer && (\n          <Box\n            sx={{\n              flexShrink: 0,\n              borderTop: (t) => `1px solid ${t.palette.divider}`,\n              p: contextValue.collapsed ? 1 : 1.5,\n              display: 'flex',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : 'flex-start',\n            }}\n          >\n            {footer}\n          </Box>\n        )}\n      </MuiDrawer>\n    </DrawerContext.Provider>\n  );\n}\n\nexport default Drawer;\n","import React, { type ReactNode, type MouseEvent } from 'react';\nimport { Box, Tooltip, Typography } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nimport { useDrawerContext } from './DrawerContext';\nimport { buildDrawerItemSx } from './Drawer.sx';\n\nexport interface DrawerItemProps {\n  /** Icono del item. Se muestra siempre (expanded y collapsed). */\n  icon?: ReactNode;\n  /** Texto del item. Se oculta cuando el drawer está colapsado (muestra tooltip). */\n  label: ReactNode;\n  /**\n   * Texto del tooltip en modo collapsed. Si no se provee y `label` es string,\n   * se usa `label`. Necesario cuando `label` es un ReactNode complejo.\n   */\n  tooltipText?: string;\n  /** Handler de click. */\n  onClick?: (event: MouseEvent<HTMLDivElement>) => void;\n  /** Marca el item como activo (destaca color y fondo). */\n  active?: boolean;\n  /** Marca el item como \"destructivo\" (p.ej. cerrar sesión): color error. */\n  danger?: boolean;\n  /** Deshabilita click + bajo opacidad. */\n  disabled?: boolean;\n  /** Contenido adicional a la derecha del label (badge, count, chevron). */\n  endAdornment?: ReactNode;\n  /** sx override del consumer, se mergea al final. */\n  sx?: SxProps<Theme>;\n  className?: string;\n}\n\n/**\n * Item de un Drawer de shared-library. Lee el estado `collapsed` del\n * DrawerContext para adaptar layout y mostrar tooltip en modo mini.\n *\n * Uso típico:\n * ```tsx\n * <Drawer collapsed={collapsed} onToggleCollapse={toggle}>\n *   <DrawerItem icon={<HomeIcon />} label=\"Inicio\" active />\n *   <DrawerItem icon={<UserIcon />} label=\"Perfil\" />\n * </Drawer>\n * ```\n */\nexport function DrawerItem({\n  icon,\n  label,\n  tooltipText,\n  onClick,\n  active = false,\n  danger = false,\n  disabled = false,\n  endAdornment,\n  sx,\n  className,\n}: DrawerItemProps) {\n  const { collapsed } = useDrawerContext();\n\n  const baseSx = buildDrawerItemSx({ collapsed, active, danger });\n\n  const mergedSx: SxProps<Theme> = [\n    baseSx,\n    disabled && { pointerEvents: 'none', opacity: 0.5 },\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ].filter(Boolean) as SxProps<Theme>;\n\n  const content = (\n    <Box\n      role=\"button\"\n      tabIndex={disabled ? -1 : 0}\n      aria-disabled={disabled}\n      onClick={disabled ? undefined : onClick}\n      onKeyDown={(event) => {\n        if (disabled) return;\n        if (event.key === 'Enter' || event.key === ' ') {\n          event.preventDefault();\n          onClick?.(event as unknown as MouseEvent<HTMLDivElement>);\n        }\n      }}\n      className={className}\n      sx={mergedSx}\n    >\n      {icon && (\n        <Box className=\"drawer-item__icon\" component=\"span\">\n          {icon}\n        </Box>\n      )}\n      <Typography\n        component=\"span\"\n        variant=\"body2\"\n        className=\"drawer-item__label\"\n        sx={{ fontWeight: active ? 600 : 400 }}\n      >\n        {label}\n      </Typography>\n      {!collapsed && endAdornment && (\n        <Box component=\"span\" sx={{ flexShrink: 0, ml: 'auto' }}>\n          {endAdornment}\n        </Box>\n      )}\n    </Box>\n  );\n\n  // Cuando está colapsado, envolvemos en tooltip para revelar el label al hover.\n  // Prioriza `tooltipText` explícito; si no, cae al `label` si es string.\n  const resolvedTooltip =\n    tooltipText ?? (typeof label === 'string' ? label : undefined);\n\n  if (collapsed && resolvedTooltip) {\n    return (\n      <Tooltip title={resolvedTooltip} placement=\"right\" arrow>\n        {content}\n      </Tooltip>\n    );\n  }\n\n  return content;\n}\n\nexport default DrawerItem;\n"],"names":["MuiDrawer"],"mappings":"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"}

package/components/StatusMessage/StatusMessage.cjs

@@ -85,6 +85,24 @@ const StatusMessage = ({
     }
   );
 };
+const initialValues = {
+  state: void 0,
+  setMessage: () => {
+  },
+  cleanMessage: () => {
+  }
+};
+const StatusMessageContext = React.createContext(initialValues);
+const useStatusMessageContext = () => React.useContext(StatusMessageContext);
+const StatusMessageProvider = ({ children }) => {
+  const [stateMessage, setMessage] = React.useState(void 0);
+  const cleanMessage = () => {
+    setMessage(void 0);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(StatusMessageContext.Provider, { value: { setMessage, cleanMessage, state: stateMessage }, children });
+};
 exports.StatusMessage = StatusMessage;
+exports.StatusMessageProvider = StatusMessageProvider;
 exports.default = StatusMessage;
+exports.useStatusMessageContext = useStatusMessageContext;
 //# sourceMappingURL=StatusMessage.cjs.map

package/components/StatusMessage/StatusMessage.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"StatusMessage.cjs","sources":["../../../src/components/StatusMessage/StatusMessage.tsx"],"sourcesContent":["import { useId, useState, type FC } from 'react';\nimport {\n  Alert,\n  Box,\n  Typography,\n  Dialog,\n  DialogContent,\n  DialogActions,\n  Button,\n} from '@mui/material';\nimport {\n  ErrorOutline as ErrorOutlineIcon,\n  CheckCircleOutline as CheckCircleOutlineIcon,\n  WarningAmber as WarningAmberIcon,\n} from '@mui/icons-material';\n\nexport interface StatusMessageProps {\n  /** Título del mensaje. */\n  title?: string;\n  /** Descripción/contenido detallado. Requerido para que el componente renderice. */\n  description?: string;\n  /** Tipo de mensaje (controla color + icono). `danger` mapea a `error` de MUI. */\n  messageType?: 'success' | 'danger' | 'warning';\n  /** Forma de presentación: alerta inline o modal. Default: `'alert'`. */\n  displayType?: 'alert' | 'modal';\n  /** Callback al cerrar. Si se omite, no se muestra botón de cerrar. */\n  close?: () => void;\n  /**\n   * Controla visibilidad. Si se omite, el componente maneja su propio\n   * state (se oculta solo al llamar `close`). Si se pasa, queda controlled\n   * y el consumer es responsable de actualizarlo.\n   */\n  open?: boolean;\n}\n\n/**\n * Mensaje de éxito / error / advertencia en forma de alerta inline o modal.\n *\n * - **Uncontrolled**: sin pasar `open`, el componente maneja su propia\n *   visibilidad. Al llamar `close`, se oculta automáticamente.\n * - **Controlled**: pasando `open`, el consumer decide cuándo mostrar/ocultar.\n */\nexport const StatusMessage: FC<StatusMessageProps> = ({\n  title,\n  description,\n  messageType = 'success',\n  displayType = 'alert',\n  close,\n  open: controlledOpen,\n}) => {\n  const [internalOpen, setInternalOpen] = useState(true);\n  const titleId = useId();\n  const descId = useId();\n\n  const isControlled = controlledOpen !== undefined;\n  const isOpen = isControlled ? controlledOpen : internalOpen;\n\n  const handleClose = () => {\n    if (!isControlled) setInternalOpen(false);\n    close?.();\n  };\n\n  const alertVariant = messageType === 'danger' ? 'error' : messageType;\n\n  const icon =\n    messageType === 'success' ? (\n      <CheckCircleOutlineIcon sx={{ fontSize: 64, color: 'success.main' }} />\n    ) : messageType === 'danger' ? (\n      <ErrorOutlineIcon sx={{ fontSize: 64, color: 'error.main' }} />\n    ) : (\n      <WarningAmberIcon sx={{ fontSize: 64, color: 'warning.main' }} />\n    );\n\n  if (!description) return null;\n  if (!isOpen) return null;\n\n  if (displayType === 'modal') {\n    return (\n      <Dialog\n        open={isOpen}\n        onClose={handleClose}\n        aria-labelledby={title ? titleId : undefined}\n        aria-describedby={descId}\n        maxWidth=\"md\"\n        slotProps={{\n          paper: {\n            sx: { borderRadius: '16px', p: 2 },\n          },\n        }}\n      >\n        <DialogContent\n          sx={{\n            display: 'flex',\n            flexDirection: 'column',\n            alignItems: 'center',\n            textAlign: 'center',\n            p: 4,\n            gap: 2,\n          }}\n        >\n          <Box sx={{ mb: 2 }}>{icon}</Box>\n          {title && (\n            <Typography\n              id={titleId}\n              variant=\"h4\"\n              component=\"h2\"\n              sx={{ fontWeight: 'bold' }}\n            >\n              {title}\n            </Typography>\n          )}\n          <Typography id={descId} variant=\"body1\" color=\"text.secondary\">\n            {description}\n          </Typography>\n        </DialogContent>\n        <DialogActions sx={{ justifyContent: 'center', p: 2 }}>\n          <Button onClick={handleClose} variant=\"contained\" color={alertVariant}>\n            Aceptar\n          </Button>\n        </DialogActions>\n      </Dialog>\n    );\n  }\n\n  return (\n    <Alert\n      severity={alertVariant}\n      sx={{ mb: 2, mt: 2 }}\n      onClose={close !== undefined ? handleClose : undefined}\n    >\n      {title && (\n        <Typography variant=\"h6\" sx={{ fontWeight: 'bold' }}>\n          {title}\n        </Typography>\n      )}\n      <Typography variant=\"body2\" sx={{ mt: 1 }}>\n        {description}\n      </Typography>\n    </Alert>\n  );\n};\n\nexport default StatusMessage;\n"],"names":["useState","useId","jsx","CheckCircleOutlineIcon","ErrorOutlineIcon","WarningAmberIcon","jsxs","Dialog","DialogContent","Box","Typography","DialogActions","Button","Alert"],"mappings":";;;;;;AA0CO,MAAM,gBAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,cAAc;AAAA,EACd;AAAA,EACA,MAAM;AACR,MAAM;AACJ,QAAM,CAAC,cAAc,eAAe,IAAIA,MAAAA,SAAS,IAAI;AACrD,QAAM,UAAUC,MAAAA,MAAA;AAChB,QAAM,SAASA,MAAAA,MAAA;AAEf,QAAM,eAAe,mBAAmB;AACxC,QAAM,SAAS,eAAe,iBAAiB;AAE/C,QAAM,cAAc,MAAM;AACxB,QAAI,CAAC,aAAc,iBAAgB,KAAK;AACxC;AAAA,EACF;AAEA,QAAM,eAAe,gBAAgB,WAAW,UAAU;AAE1D,QAAM,OACJ,gBAAgB,YACdC,2BAAAA,IAACC,cAAAA,sBAAuB,IAAI,EAAE,UAAU,IAAI,OAAO,eAAA,EAAe,CAAG,IACnE,gBAAgB,WAClBD,+BAACE,cAAAA,cAAA,EAAiB,IAAI,EAAE,UAAU,IAAI,OAAO,eAAa,CAAG,IAE7DF,2BAAAA,IAACG,cAAAA,cAAA,EAAiB,IAAI,EAAE,UAAU,IAAI,OAAO,kBAAkB;AAGnE,MAAI,CAAC,YAAa,QAAO;AACzB,MAAI,CAAC,OAAQ,QAAO;AAEpB,MAAI,gBAAgB,SAAS;AAC3B,WACEC,2BAAAA;AAAAA,MAACC,SAAAA;AAAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,SAAS;AAAA,QACT,mBAAiB,QAAQ,UAAU;AAAA,QACnC,oBAAkB;AAAA,QAClB,UAAS;AAAA,QACT,WAAW;AAAA,UACT,OAAO;AAAA,YACL,IAAI,EAAE,cAAc,QAAQ,GAAG,EAAA;AAAA,UAAE;AAAA,QACnC;AAAA,QAGF,UAAA;AAAA,UAAAD,2BAAAA;AAAAA,YAACE,SAAAA;AAAAA,YAAA;AAAA,cACC,IAAI;AAAA,gBACF,SAAS;AAAA,gBACT,eAAe;AAAA,gBACf,YAAY;AAAA,gBACZ,WAAW;AAAA,gBACX,GAAG;AAAA,gBACH,KAAK;AAAA,cAAA;AAAA,cAGP,UAAA;AAAA,gBAAAN,+BAACO,SAAAA,OAAI,IAAI,EAAE,IAAI,EAAA,GAAM,UAAA,MAAK;AAAA,gBACzB,SACCP,2BAAAA;AAAAA,kBAACQ,SAAAA;AAAAA,kBAAA;AAAA,oBACC,IAAI;AAAA,oBACJ,SAAQ;AAAA,oBACR,WAAU;AAAA,oBACV,IAAI,EAAE,YAAY,OAAA;AAAA,oBAEjB,UAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGLR,2BAAAA,IAACQ,SAAAA,cAAW,IAAI,QAAQ,SAAQ,SAAQ,OAAM,kBAC3C,UAAA,YAAA,CACH;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,yCAEDC,SAAAA,eAAA,EAAc,IAAI,EAAE,gBAAgB,UAAU,GAAG,EAAA,GAChD,UAAAT,2BAAAA,IAACU,SAAAA,QAAA,EAAO,SAAS,aAAa,SAAQ,aAAY,OAAO,cAAc,qBAEvE,EAAA,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AAEA,SACEN,2BAAAA;AAAAA,IAACO,SAAAA;AAAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,IAAI,EAAE,IAAI,GAAG,IAAI,EAAA;AAAA,MACjB,SAAS,UAAU,SAAY,cAAc;AAAA,MAE5C,UAAA;AAAA,QAAA,SACCX,2BAAAA,IAACQ,uBAAW,SAAQ,MAAK,IAAI,EAAE,YAAY,OAAA,GACxC,UAAA,MAAA,CACH;AAAA,QAEFR,2BAAAA,IAACQ,SAAAA,cAAW,SAAQ,SAAQ,IAAI,EAAE,IAAI,EAAA,GACnC,UAAA,YAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;;"}
+{"version":3,"file":"StatusMessage.cjs","sources":["../../../src/components/StatusMessage/StatusMessage.tsx","../../../src/components/StatusMessage/StatusMessageContext.tsx"],"sourcesContent":["import { useId, useState, type FC } from 'react';\nimport {\n  Alert,\n  Box,\n  Typography,\n  Dialog,\n  DialogContent,\n  DialogActions,\n  Button,\n} from '@mui/material';\nimport {\n  ErrorOutline as ErrorOutlineIcon,\n  CheckCircleOutline as CheckCircleOutlineIcon,\n  WarningAmber as WarningAmberIcon,\n} from '@mui/icons-material';\n\nexport interface StatusMessageProps {\n  /** Título del mensaje. */\n  title?: string;\n  /** Descripción/contenido detallado. Requerido para que el componente renderice. */\n  description?: string;\n  /** Tipo de mensaje (controla color + icono). `danger` mapea a `error` de MUI. */\n  messageType?: 'success' | 'danger' | 'warning';\n  /** Forma de presentación: alerta inline o modal. Default: `'alert'`. */\n  displayType?: 'alert' | 'modal';\n  /** Callback al cerrar. Si se omite, no se muestra botón de cerrar. */\n  close?: () => void;\n  /**\n   * Controla visibilidad. Si se omite, el componente maneja su propio\n   * state (se oculta solo al llamar `close`). Si se pasa, queda controlled\n   * y el consumer es responsable de actualizarlo.\n   */\n  open?: boolean;\n}\n\n/**\n * Mensaje de éxito / error / advertencia en forma de alerta inline o modal.\n *\n * - **Uncontrolled**: sin pasar `open`, el componente maneja su propia\n *   visibilidad. Al llamar `close`, se oculta automáticamente.\n * - **Controlled**: pasando `open`, el consumer decide cuándo mostrar/ocultar.\n */\nexport const StatusMessage: FC<StatusMessageProps> = ({\n  title,\n  description,\n  messageType = 'success',\n  displayType = 'alert',\n  close,\n  open: controlledOpen,\n}) => {\n  const [internalOpen, setInternalOpen] = useState(true);\n  const titleId = useId();\n  const descId = useId();\n\n  const isControlled = controlledOpen !== undefined;\n  const isOpen = isControlled ? controlledOpen : internalOpen;\n\n  const handleClose = () => {\n    if (!isControlled) setInternalOpen(false);\n    close?.();\n  };\n\n  const alertVariant = messageType === 'danger' ? 'error' : messageType;\n\n  const icon =\n    messageType === 'success' ? (\n      <CheckCircleOutlineIcon sx={{ fontSize: 64, color: 'success.main' }} />\n    ) : messageType === 'danger' ? (\n      <ErrorOutlineIcon sx={{ fontSize: 64, color: 'error.main' }} />\n    ) : (\n      <WarningAmberIcon sx={{ fontSize: 64, color: 'warning.main' }} />\n    );\n\n  if (!description) return null;\n  if (!isOpen) return null;\n\n  if (displayType === 'modal') {\n    return (\n      <Dialog\n        open={isOpen}\n        onClose={handleClose}\n        aria-labelledby={title ? titleId : undefined}\n        aria-describedby={descId}\n        maxWidth=\"md\"\n        slotProps={{\n          paper: {\n            sx: { borderRadius: '16px', p: 2 },\n          },\n        }}\n      >\n        <DialogContent\n          sx={{\n            display: 'flex',\n            flexDirection: 'column',\n            alignItems: 'center',\n            textAlign: 'center',\n            p: 4,\n            gap: 2,\n          }}\n        >\n          <Box sx={{ mb: 2 }}>{icon}</Box>\n          {title && (\n            <Typography\n              id={titleId}\n              variant=\"h4\"\n              component=\"h2\"\n              sx={{ fontWeight: 'bold' }}\n            >\n              {title}\n            </Typography>\n          )}\n          <Typography id={descId} variant=\"body1\" color=\"text.secondary\">\n            {description}\n          </Typography>\n        </DialogContent>\n        <DialogActions sx={{ justifyContent: 'center', p: 2 }}>\n          <Button onClick={handleClose} variant=\"contained\" color={alertVariant}>\n            Aceptar\n          </Button>\n        </DialogActions>\n      </Dialog>\n    );\n  }\n\n  return (\n    <Alert\n      severity={alertVariant}\n      sx={{ mb: 2, mt: 2 }}\n      onClose={close !== undefined ? handleClose : undefined}\n    >\n      {title && (\n        <Typography variant=\"h6\" sx={{ fontWeight: 'bold' }}>\n          {title}\n        </Typography>\n      )}\n      <Typography variant=\"body2\" sx={{ mt: 1 }}>\n        {description}\n      </Typography>\n    </Alert>\n  );\n};\n\nexport default StatusMessage;\n","import {\n  createContext,\n  useState,\n  useContext,\n  type Dispatch,\n  type SetStateAction,\n  type ReactNode,\n} from 'react';\nimport type { StatusMessageProps } from './StatusMessage';\n\nexport type StatusMessageState = {\n  [K in 'title' | 'description' | 'messageType']: StatusMessageProps[K] | undefined;\n} & Pick<StatusMessageProps, 'displayType'>;\n\ninterface StatusMessageContextValue {\n  state: StatusMessageState | undefined;\n  setMessage: Dispatch<SetStateAction<StatusMessageState | undefined>>;\n  cleanMessage: () => void;\n}\n\nconst initialValues: StatusMessageContextValue = {\n  state: undefined,\n  setMessage: () => {},\n  cleanMessage: () => {},\n};\n\nconst StatusMessageContext = createContext<StatusMessageContextValue>(initialValues);\n\nexport const useStatusMessageContext = () => useContext(StatusMessageContext);\n\ninterface StatusMessageProviderProps {\n  children: ReactNode;\n}\n\nexport const StatusMessageProvider = ({ children }: StatusMessageProviderProps) => {\n  const [stateMessage, setMessage] = useState<StatusMessageState | undefined>(undefined);\n  const cleanMessage = () => {\n    setMessage(undefined);\n  };\n\n  return (\n    <StatusMessageContext.Provider value={{ setMessage, cleanMessage, state: stateMessage }}>\n      {children}\n    </StatusMessageContext.Provider>\n  );\n};\n"],"names":["useState","useId","jsx","CheckCircleOutlineIcon","ErrorOutlineIcon","WarningAmberIcon","jsxs","Dialog","DialogContent","Box","Typography","DialogActions","Button","Alert","createContext","useContext"],"mappings":"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"}

package/components/StatusMessage/StatusMessage.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useId } from "react";
+import { useState, useId, createContext, useContext } from "react";
 import { Dialog, DialogContent, Box, Typography, DialogActions, Button, Alert } from "@mui/material";
 import { CheckCircleOutline, ErrorOutline, WarningAmber } from "@mui/icons-material";
 const StatusMessage = ({
@@ -83,8 +83,26 @@ const StatusMessage = ({
     }
   );
 };
+const initialValues = {
+  state: void 0,
+  setMessage: () => {
+  },
+  cleanMessage: () => {
+  }
+};
+const StatusMessageContext = createContext(initialValues);
+const useStatusMessageContext = () => useContext(StatusMessageContext);
+const StatusMessageProvider = ({ children }) => {
+  const [stateMessage, setMessage] = useState(void 0);
+  const cleanMessage = () => {
+    setMessage(void 0);
+  };
+  return /* @__PURE__ */ jsx(StatusMessageContext.Provider, { value: { setMessage, cleanMessage, state: stateMessage }, children });
+};
 export {
   StatusMessage,
-  StatusMessage as default
+  StatusMessageProvider,
+  StatusMessage as default,
+  useStatusMessageContext
 };
 //# sourceMappingURL=StatusMessage.js.map

package/components/StatusMessage/StatusMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusMessage.js","sources":["../../../src/components/StatusMessage/StatusMessage.tsx"],"sourcesContent":["import { useId, useState, type FC } from 'react';\nimport {\n  Alert,\n  Box,\n  Typography,\n  Dialog,\n  DialogContent,\n  DialogActions,\n  Button,\n} from '@mui/material';\nimport {\n  ErrorOutline as ErrorOutlineIcon,\n  CheckCircleOutline as CheckCircleOutlineIcon,\n  WarningAmber as WarningAmberIcon,\n} from '@mui/icons-material';\n\nexport interface StatusMessageProps {\n  /** Título del mensaje. */\n  title?: string;\n  /** Descripción/contenido detallado. Requerido para que el componente renderice. */\n  description?: string;\n  /** Tipo de mensaje (controla color + icono). `danger` mapea a `error` de MUI. */\n  messageType?: 'success' | 'danger' | 'warning';\n  /** Forma de presentación: alerta inline o modal. Default: `'alert'`. */\n  displayType?: 'alert' | 'modal';\n  /** Callback al cerrar. Si se omite, no se muestra botón de cerrar. */\n  close?: () => void;\n  /**\n   * Controla visibilidad. Si se omite, el componente maneja su propio\n   * state (se oculta solo al llamar `close`). Si se pasa, queda controlled\n   * y el consumer es responsable de actualizarlo.\n   */\n  open?: boolean;\n}\n\n/**\n * Mensaje de éxito / error / advertencia en forma de alerta inline o modal.\n *\n * - **Uncontrolled**: sin pasar `open`, el componente maneja su propia\n *   visibilidad. Al llamar `close`, se oculta automáticamente.\n * - **Controlled**: pasando `open`, el consumer decide cuándo mostrar/ocultar.\n */\nexport const StatusMessage: FC<StatusMessageProps> = ({\n  title,\n  description,\n  messageType = 'success',\n  displayType = 'alert',\n  close,\n  open: controlledOpen,\n}) => {\n  const [internalOpen, setInternalOpen] = useState(true);\n  const titleId = useId();\n  const descId = useId();\n\n  const isControlled = controlledOpen !== undefined;\n  const isOpen = isControlled ? controlledOpen : internalOpen;\n\n  const handleClose = () => {\n    if (!isControlled) setInternalOpen(false);\n    close?.();\n  };\n\n  const alertVariant = messageType === 'danger' ? 'error' : messageType;\n\n  const icon =\n    messageType === 'success' ? (\n      <CheckCircleOutlineIcon sx={{ fontSize: 64, color: 'success.main' }} />\n    ) : messageType === 'danger' ? (\n      <ErrorOutlineIcon sx={{ fontSize: 64, color: 'error.main' }} />\n    ) : (\n      <WarningAmberIcon sx={{ fontSize: 64, color: 'warning.main' }} />\n    );\n\n  if (!description) return null;\n  if (!isOpen) return null;\n\n  if (displayType === 'modal') {\n    return (\n      <Dialog\n        open={isOpen}\n        onClose={handleClose}\n        aria-labelledby={title ? titleId : undefined}\n        aria-describedby={descId}\n        maxWidth=\"md\"\n        slotProps={{\n          paper: {\n            sx: { borderRadius: '16px', p: 2 },\n          },\n        }}\n      >\n        <DialogContent\n          sx={{\n            display: 'flex',\n            flexDirection: 'column',\n            alignItems: 'center',\n            textAlign: 'center',\n            p: 4,\n            gap: 2,\n          }}\n        >\n          <Box sx={{ mb: 2 }}>{icon}</Box>\n          {title && (\n            <Typography\n              id={titleId}\n              variant=\"h4\"\n              component=\"h2\"\n              sx={{ fontWeight: 'bold' }}\n            >\n              {title}\n            </Typography>\n          )}\n          <Typography id={descId} variant=\"body1\" color=\"text.secondary\">\n            {description}\n          </Typography>\n        </DialogContent>\n        <DialogActions sx={{ justifyContent: 'center', p: 2 }}>\n          <Button onClick={handleClose} variant=\"contained\" color={alertVariant}>\n            Aceptar\n          </Button>\n        </DialogActions>\n      </Dialog>\n    );\n  }\n\n  return (\n    <Alert\n      severity={alertVariant}\n      sx={{ mb: 2, mt: 2 }}\n      onClose={close !== undefined ? handleClose : undefined}\n    >\n      {title && (\n        <Typography variant=\"h6\" sx={{ fontWeight: 'bold' }}>\n          {title}\n        </Typography>\n      )}\n      <Typography variant=\"body2\" sx={{ mt: 1 }}>\n        {description}\n      </Typography>\n    </Alert>\n  );\n};\n\nexport default StatusMessage;\n"],"names":["CheckCircleOutlineIcon","ErrorOutlineIcon","WarningAmberIcon"],"mappings":";;;;AA0CO,MAAM,gBAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,cAAc;AAAA,EACd;AAAA,EACA,MAAM;AACR,MAAM;AACJ,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,IAAI;AACrD,QAAM,UAAU,MAAA;AAChB,QAAM,SAAS,MAAA;AAEf,QAAM,eAAe,mBAAmB;AACxC,QAAM,SAAS,eAAe,iBAAiB;AAE/C,QAAM,cAAc,MAAM;AACxB,QAAI,CAAC,aAAc,iBAAgB,KAAK;AACxC;AAAA,EACF;AAEA,QAAM,eAAe,gBAAgB,WAAW,UAAU;AAE1D,QAAM,OACJ,gBAAgB,YACd,oBAACA,sBAAuB,IAAI,EAAE,UAAU,IAAI,OAAO,eAAA,EAAe,CAAG,IACnE,gBAAgB,WAClB,oBAACC,cAAA,EAAiB,IAAI,EAAE,UAAU,IAAI,OAAO,eAAa,CAAG,IAE7D,oBAACC,cAAA,EAAiB,IAAI,EAAE,UAAU,IAAI,OAAO,kBAAkB;AAGnE,MAAI,CAAC,YAAa,QAAO;AACzB,MAAI,CAAC,OAAQ,QAAO;AAEpB,MAAI,gBAAgB,SAAS;AAC3B,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,SAAS;AAAA,QACT,mBAAiB,QAAQ,UAAU;AAAA,QACnC,oBAAkB;AAAA,QAClB,UAAS;AAAA,QACT,WAAW;AAAA,UACT,OAAO;AAAA,YACL,IAAI,EAAE,cAAc,QAAQ,GAAG,EAAA;AAAA,UAAE;AAAA,QACnC;AAAA,QAGF,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI;AAAA,gBACF,SAAS;AAAA,gBACT,eAAe;AAAA,gBACf,YAAY;AAAA,gBACZ,WAAW;AAAA,gBACX,GAAG;AAAA,gBACH,KAAK;AAAA,cAAA;AAAA,cAGP,UAAA;AAAA,gBAAA,oBAAC,OAAI,IAAI,EAAE,IAAI,EAAA,GAAM,UAAA,MAAK;AAAA,gBACzB,SACC;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,IAAI;AAAA,oBACJ,SAAQ;AAAA,oBACR,WAAU;AAAA,oBACV,IAAI,EAAE,YAAY,OAAA;AAAA,oBAEjB,UAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGL,oBAAC,cAAW,IAAI,QAAQ,SAAQ,SAAQ,OAAM,kBAC3C,UAAA,YAAA,CACH;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,8BAED,eAAA,EAAc,IAAI,EAAE,gBAAgB,UAAU,GAAG,EAAA,GAChD,UAAA,oBAAC,QAAA,EAAO,SAAS,aAAa,SAAQ,aAAY,OAAO,cAAc,qBAEvE,EAAA,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AAEA,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,IAAI,EAAE,IAAI,GAAG,IAAI,EAAA;AAAA,MACjB,SAAS,UAAU,SAAY,cAAc;AAAA,MAE5C,UAAA;AAAA,QAAA,SACC,oBAAC,cAAW,SAAQ,MAAK,IAAI,EAAE,YAAY,OAAA,GACxC,UAAA,MAAA,CACH;AAAA,QAEF,oBAAC,cAAW,SAAQ,SAAQ,IAAI,EAAE,IAAI,EAAA,GACnC,UAAA,YAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"StatusMessage.js","sources":["../../../src/components/StatusMessage/StatusMessage.tsx","../../../src/components/StatusMessage/StatusMessageContext.tsx"],"sourcesContent":["import { useId, useState, type FC } from 'react';\nimport {\n  Alert,\n  Box,\n  Typography,\n  Dialog,\n  DialogContent,\n  DialogActions,\n  Button,\n} from '@mui/material';\nimport {\n  ErrorOutline as ErrorOutlineIcon,\n  CheckCircleOutline as CheckCircleOutlineIcon,\n  WarningAmber as WarningAmberIcon,\n} from '@mui/icons-material';\n\nexport interface StatusMessageProps {\n  /** Título del mensaje. */\n  title?: string;\n  /** Descripción/contenido detallado. Requerido para que el componente renderice. */\n  description?: string;\n  /** Tipo de mensaje (controla color + icono). `danger` mapea a `error` de MUI. */\n  messageType?: 'success' | 'danger' | 'warning';\n  /** Forma de presentación: alerta inline o modal. Default: `'alert'`. */\n  displayType?: 'alert' | 'modal';\n  /** Callback al cerrar. Si se omite, no se muestra botón de cerrar. */\n  close?: () => void;\n  /**\n   * Controla visibilidad. Si se omite, el componente maneja su propio\n   * state (se oculta solo al llamar `close`). Si se pasa, queda controlled\n   * y el consumer es responsable de actualizarlo.\n   */\n  open?: boolean;\n}\n\n/**\n * Mensaje de éxito / error / advertencia en forma de alerta inline o modal.\n *\n * - **Uncontrolled**: sin pasar `open`, el componente maneja su propia\n *   visibilidad. Al llamar `close`, se oculta automáticamente.\n * - **Controlled**: pasando `open`, el consumer decide cuándo mostrar/ocultar.\n */\nexport const StatusMessage: FC<StatusMessageProps> = ({\n  title,\n  description,\n  messageType = 'success',\n  displayType = 'alert',\n  close,\n  open: controlledOpen,\n}) => {\n  const [internalOpen, setInternalOpen] = useState(true);\n  const titleId = useId();\n  const descId = useId();\n\n  const isControlled = controlledOpen !== undefined;\n  const isOpen = isControlled ? controlledOpen : internalOpen;\n\n  const handleClose = () => {\n    if (!isControlled) setInternalOpen(false);\n    close?.();\n  };\n\n  const alertVariant = messageType === 'danger' ? 'error' : messageType;\n\n  const icon =\n    messageType === 'success' ? (\n      <CheckCircleOutlineIcon sx={{ fontSize: 64, color: 'success.main' }} />\n    ) : messageType === 'danger' ? (\n      <ErrorOutlineIcon sx={{ fontSize: 64, color: 'error.main' }} />\n    ) : (\n      <WarningAmberIcon sx={{ fontSize: 64, color: 'warning.main' }} />\n    );\n\n  if (!description) return null;\n  if (!isOpen) return null;\n\n  if (displayType === 'modal') {\n    return (\n      <Dialog\n        open={isOpen}\n        onClose={handleClose}\n        aria-labelledby={title ? titleId : undefined}\n        aria-describedby={descId}\n        maxWidth=\"md\"\n        slotProps={{\n          paper: {\n            sx: { borderRadius: '16px', p: 2 },\n          },\n        }}\n      >\n        <DialogContent\n          sx={{\n            display: 'flex',\n            flexDirection: 'column',\n            alignItems: 'center',\n            textAlign: 'center',\n            p: 4,\n            gap: 2,\n          }}\n        >\n          <Box sx={{ mb: 2 }}>{icon}</Box>\n          {title && (\n            <Typography\n              id={titleId}\n              variant=\"h4\"\n              component=\"h2\"\n              sx={{ fontWeight: 'bold' }}\n            >\n              {title}\n            </Typography>\n          )}\n          <Typography id={descId} variant=\"body1\" color=\"text.secondary\">\n            {description}\n          </Typography>\n        </DialogContent>\n        <DialogActions sx={{ justifyContent: 'center', p: 2 }}>\n          <Button onClick={handleClose} variant=\"contained\" color={alertVariant}>\n            Aceptar\n          </Button>\n        </DialogActions>\n      </Dialog>\n    );\n  }\n\n  return (\n    <Alert\n      severity={alertVariant}\n      sx={{ mb: 2, mt: 2 }}\n      onClose={close !== undefined ? handleClose : undefined}\n    >\n      {title && (\n        <Typography variant=\"h6\" sx={{ fontWeight: 'bold' }}>\n          {title}\n        </Typography>\n      )}\n      <Typography variant=\"body2\" sx={{ mt: 1 }}>\n        {description}\n      </Typography>\n    </Alert>\n  );\n};\n\nexport default StatusMessage;\n","import {\n  createContext,\n  useState,\n  useContext,\n  type Dispatch,\n  type SetStateAction,\n  type ReactNode,\n} from 'react';\nimport type { StatusMessageProps } from './StatusMessage';\n\nexport type StatusMessageState = {\n  [K in 'title' | 'description' | 'messageType']: StatusMessageProps[K] | undefined;\n} & Pick<StatusMessageProps, 'displayType'>;\n\ninterface StatusMessageContextValue {\n  state: StatusMessageState | undefined;\n  setMessage: Dispatch<SetStateAction<StatusMessageState | undefined>>;\n  cleanMessage: () => void;\n}\n\nconst initialValues: StatusMessageContextValue = {\n  state: undefined,\n  setMessage: () => {},\n  cleanMessage: () => {},\n};\n\nconst StatusMessageContext = createContext<StatusMessageContextValue>(initialValues);\n\nexport const useStatusMessageContext = () => useContext(StatusMessageContext);\n\ninterface StatusMessageProviderProps {\n  children: ReactNode;\n}\n\nexport const StatusMessageProvider = ({ children }: StatusMessageProviderProps) => {\n  const [stateMessage, setMessage] = useState<StatusMessageState | undefined>(undefined);\n  const cleanMessage = () => {\n    setMessage(undefined);\n  };\n\n  return (\n    <StatusMessageContext.Provider value={{ setMessage, cleanMessage, state: stateMessage }}>\n      {children}\n    </StatusMessageContext.Provider>\n  );\n};\n"],"names":["CheckCircleOutlineIcon","ErrorOutlineIcon","WarningAmberIcon"],"mappings":"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"}

package/components/StatusMessage/StatusMessageContext.d.ts

@@ -0,0 +1,16 @@
+import { Dispatch, SetStateAction, ReactNode } from 'react';
+import { StatusMessageProps } from './StatusMessage';
+export type StatusMessageState = {
+    [K in 'title' | 'description' | 'messageType']: StatusMessageProps[K] | undefined;
+} & Pick<StatusMessageProps, 'displayType'>;
+interface StatusMessageContextValue {
+    state: StatusMessageState | undefined;
+    setMessage: Dispatch<SetStateAction<StatusMessageState | undefined>>;
+    cleanMessage: () => void;
+}
+export declare const useStatusMessageContext: () => StatusMessageContextValue;
+interface StatusMessageProviderProps {
+    children: ReactNode;
+}
+export declare const StatusMessageProvider: ({ children }: StatusMessageProviderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/components/StatusMessage/index.d.ts

@@ -1,2 +1,4 @@
 export { StatusMessage, default } from './StatusMessage';
 export type { StatusMessageProps } from './StatusMessage';
+export { StatusMessageProvider, useStatusMessageContext } from './StatusMessageContext';
+export type { StatusMessageState } from './StatusMessageContext';

package/components/Stepper/Stepper.cjs

@@ -1,4 +1,20 @@
 "use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
@@ -37,14 +53,12 @@ const StepperProvider = ({
   const [completed, setCompleted] = React.useState(false);
   const changeStep = React.useCallback(
     (newStep) => {
-      setCurrentStep((prev) => {
-        if (newStep === prev) return prev;
-        if (newStep < 0 || newStep >= totalSteps) return prev;
-        onStepChange == null ? void 0 : onStepChange(newStep, prev);
-        return newStep;
-      });
+      if (newStep < 0 || newStep >= totalSteps) return;
+      if (newStep === currentStep) return;
+      onStepChange == null ? void 0 : onStepChange(newStep, currentStep);
+      setCurrentStep(newStep);
     },
-    [totalSteps, onStepChange]
+    [currentStep, totalSteps, onStepChange]
   );
   const nextStep = React.useCallback(() => {
     changeStep(currentStep + 1);
@@ -209,13 +223,13 @@ const Stepper = ({
                   activeStep: currentStep,
                   orientation,
                   alternativeLabel: alternateLabel,
-                  sx: isHorizontal ? {
+                  sx: __spreadValues(__spreadValues({}, isHorizontal && {
                     display: "inline-flex",
                     flexWrap: "nowrap",
                     minWidth: "100%",
                     width: "max-content",
                     "& .MuiStep-root": { flex: "0 0 auto", minWidth: 120 }
-                  } : void 0,
+                  }), alternateLabel && { justifyContent: "center" }),
                   children: steps.map((step, idx) => {
                     var _a;
                     const {
@@ -270,25 +284,35 @@ const Stepper = ({
         ]
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx(material.Box, { mt: 2, children: keepMounted ? steps.map((step, idx) => {
-      var _a;
-      const key = (_a = step.key) != null ? _a : idx;
-      const isActive = idx === currentStep;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        material.Box,
-        {
-          sx: { display: isActive ? "block" : "none" },
-          "aria-hidden": !isActive,
-          children: step.props.children
+    /* @__PURE__ */ jsxRuntime.jsx(
+      material.Box,
+      {
+        mt: 2,
+        sx: {
+          display: "flex",
+          justifyContent: "center"
         },
-        key
-      );
-    }) : steps.map((step, idx) => {
-      var _a;
-      if (idx !== currentStep) return null;
-      const key = (_a = step.key) != null ? _a : idx;
-      return /* @__PURE__ */ jsxRuntime.jsx(material.Box, { children: step.props.children }, key);
-    }) })
+        children: keepMounted ? steps.map((step, idx) => {
+          var _a;
+          const key = (_a = step.key) != null ? _a : idx;
+          const isActive = idx === currentStep;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            material.Box,
+            {
+              sx: { display: isActive ? "block" : "none", width: "100%" },
+              "aria-hidden": !isActive,
+              children: step.props.children
+            },
+            key
+          );
+        }) : steps.map((step, idx) => {
+          var _a;
+          if (idx !== currentStep) return null;
+          const key = (_a = step.key) != null ? _a : idx;
+          return /* @__PURE__ */ jsxRuntime.jsx(material.Box, { children: step.props.children }, key);
+        })
+      }
+    )
   ] });
 };
 const Step = (_) => null;

package/components/Stepper/Stepper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stepper.cjs","sources":["../../../src/components/Stepper/StepperContext.tsx","../../../src/components/Stepper/_hooks/useHorizontalScroll.ts","../../../src/components/Stepper/_parts/StepperScrollArrow.tsx","../../../src/components/Stepper/Stepper.tsx","../../../src/components/Stepper/Step.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n  type FC,\n  type ReactNode,\n} from 'react';\n\n/**\n * API expuesta por `useStepper()`.\n */\nexport interface StepperContextValue {\n  /** Índice del paso actual (0-based). */\n  currentStep: number;\n  /** Total de pasos del stepper. */\n  totalSteps: number;\n  /** True si `currentStep === 0`. */\n  isFirst: boolean;\n  /** True si `currentStep === totalSteps - 1`. */\n  isLast: boolean;\n  /** True tras ejecutar `submitStep()` desde el último paso. */\n  completed: boolean;\n  /** Avanza al siguiente paso (no pasa de `totalSteps - 1`). */\n  nextStep: () => void;\n  /** Retrocede al paso anterior (no baja de 0). */\n  prevStep: () => void;\n  /** Salta a un paso específico (0-based). No-op si fuera de rango. */\n  goToStep: (stepNumber: number) => void;\n  /**\n   * Envía el stepper. Marca `completed = true` y dispara el callback\n   * `onSubmit` del provider. En el último paso suele reemplazar a `nextStep`.\n   */\n  submitStep: () => void;\n  /** Resetea al paso inicial y limpia `completed`. */\n  reset: () => void;\n}\n\nconst defaultValue: StepperContextValue = {\n  currentStep: 0,\n  totalSteps: 0,\n  isFirst: true,\n  isLast: true,\n  completed: false,\n  nextStep: () => {},\n  prevStep: () => {},\n  goToStep: () => {},\n  submitStep: () => {},\n  reset: () => {},\n};\n\nexport const StepperContext = createContext<StepperContextValue>(defaultValue);\n\n/**\n * Hook para consumir el `StepperContext` desde cualquier descendiente de\n * `<StepperProvider>`.\n *\n * Si se llama fuera de un provider, devuelve los valores por defecto (no-op)\n * para que componentes como `<Stepper>` puedan leerlo sin romper cuando no\n * hay provider envolvente.\n */\nexport function useStepper(): StepperContextValue {\n  return useContext(StepperContext);\n}\n\nexport interface StepperProviderProps {\n  /** Número total de pasos. Requerido. */\n  totalSteps: number;\n  /** Paso inicial (0-based). Default: 0. */\n  initialStep?: number;\n  /**\n   * Callback disparado cuando se llama `submitStep()`. Recibe el paso actual.\n   * El paquete NO ejecuta ninguna petición; queda a cargo del consumer.\n   */\n  onSubmit?: (currentStep: number) => void;\n  /**\n   * Callback disparado en cada cambio de paso (next/prev/goTo).\n   * Útil para tracking o validaciones externas.\n   */\n  onStepChange?: (newStep: number, prevStep: number) => void;\n  children?: ReactNode;\n}\n\n/**\n * Provider del stepper. Administra el `currentStep` internamente. El consumer\n * no necesita gestionar estado — solo consumirlo con `useStepper()` desde\n * cualquier descendiente.\n *\n * ```tsx\n * <StepperProvider totalSteps={3} onSubmit={handleFinalSubmit}>\n *   <Stepper>\n *     <Step label=\"Paso 1\"><StepOne /></Step>\n *     <Step label=\"Paso 2\"><StepTwo /></Step>\n *     <Step label=\"Paso 3\"><StepThree /></Step>\n *   </Stepper>\n *   <StepperControls />\n * </StepperProvider>\n * ```\n */\nexport const StepperProvider: FC<StepperProviderProps> = ({\n  totalSteps,\n  initialStep = 0,\n  onSubmit,\n  onStepChange,\n  children,\n}) => {\n  const [currentStep, setCurrentStep] = useState(initialStep);\n  const [completed, setCompleted] = useState(false);\n\n  const changeStep = useCallback(\n    (newStep: number) => {\n      setCurrentStep((prev) => {\n        if (newStep === prev) return prev;\n        if (newStep < 0 || newStep >= totalSteps) return prev;\n        onStepChange?.(newStep, prev);\n        return newStep;\n      });\n    },\n    [totalSteps, onStepChange],\n  );\n\n  const nextStep = useCallback(() => {\n    changeStep(currentStep + 1);\n  }, [changeStep, currentStep]);\n\n  const prevStep = useCallback(() => {\n    changeStep(currentStep - 1);\n  }, [changeStep, currentStep]);\n\n  const goToStep = useCallback(\n    (stepNumber: number) => {\n      changeStep(stepNumber);\n    },\n    [changeStep],\n  );\n\n  const submitStep = useCallback(() => {\n    setCompleted(true);\n    onSubmit?.(currentStep);\n  }, [currentStep, onSubmit]);\n\n  const reset = useCallback(() => {\n    setCurrentStep(initialStep);\n    setCompleted(false);\n  }, [initialStep]);\n\n  const value = useMemo<StepperContextValue>(\n    () => ({\n      currentStep,\n      totalSteps,\n      isFirst: currentStep === 0,\n      isLast: currentStep === totalSteps - 1,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    }),\n    [\n      currentStep,\n      totalSteps,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    ],\n  );\n\n  return (\n    <StepperContext.Provider value={value}>{children}</StepperContext.Provider>\n  );\n};\n","import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\n/**\n * Hook interno del Stepper para manejar scroll horizontal cuando los steps\n * no caben en el contenedor. No se exporta desde el barrel — es un detalle\n * de implementación.\n *\n * @param enabled - Si el scroll está activo (típicamente sólo en orientación horizontal).\n * @param deps    - Cosas que afectan el layout y disparan un recompute (ej. cantidad de steps, paso activo).\n *\n * Retorna:\n * - `scrollRef`: ref a asignar al contenedor con `overflow-x: auto`.\n * - `canScrollLeft` / `canScrollRight`: flags para habilitar/deshabilitar flechas.\n * - `scrollBy(delta)`: imperativo con scroll suave.\n */\nexport function useHorizontalScroll(enabled: boolean, deps: unknown[] = []) {\n  const scrollRef = useRef<HTMLDivElement | null>(null);\n  const [canScrollLeft, setCanScrollLeft] = useState(false);\n  const [canScrollRight, setCanScrollRight] = useState(false);\n\n  const updateScrollState = useCallback(() => {\n    const el = scrollRef.current;\n    if (!el) return;\n    const { scrollLeft, scrollWidth, clientWidth } = el;\n    // Tolerancia de 1px por redondeos de subpixel.\n    setCanScrollLeft(scrollLeft > 1);\n    setCanScrollRight(scrollLeft + clientWidth < scrollWidth - 1);\n  }, []);\n\n  useLayoutEffect(() => {\n    if (!enabled) return;\n    updateScrollState();\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [enabled, updateScrollState, ...deps]);\n\n  useEffect(() => {\n    if (!enabled) return;\n    const el = scrollRef.current;\n    if (!el) return;\n    el.addEventListener('scroll', updateScrollState, { passive: true });\n    const ro = new ResizeObserver(updateScrollState);\n    ro.observe(el);\n    return () => {\n      el.removeEventListener('scroll', updateScrollState);\n      ro.disconnect();\n    };\n  }, [enabled, updateScrollState]);\n\n  const scrollBy = useCallback((delta: number) => {\n    const el = scrollRef.current;\n    if (!el) return;\n    el.scrollBy({ left: delta, behavior: 'smooth' });\n  }, []);\n\n  return { scrollRef, canScrollLeft, canScrollRight, scrollBy };\n}\n","import { IconButton } from '@mui/material';\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft';\nimport ChevronRightIcon from '@mui/icons-material/ChevronRight';\n\ninterface StepperScrollArrowProps {\n  direction: 'left' | 'right';\n  /** Cuando `false`, el botón está deshabilitado (por ejemplo, ya estás al inicio). */\n  enabled: boolean;\n  /**\n   * Cuando `false`, el botón queda con `visibility: hidden` (reserva su\n   * espacio pero no se ve). Útil para que el área de scroll no se corra\n   * horizontalmente cuando no hay overflow en ningún lado.\n   */\n  visible: boolean;\n  onClick: () => void;\n}\n\n/**\n * Flecha de scroll (`<` / `>`) del Stepper horizontal. Se muestra a los\n * costados del área scrollable cuando hay overflow. Componente privado —\n * no se exporta del barrel.\n */\nexport const StepperScrollArrow = ({\n  direction,\n  enabled,\n  visible,\n  onClick,\n}: StepperScrollArrowProps) => {\n  const isLeft = direction === 'left';\n  const Icon = isLeft ? ChevronLeftIcon : ChevronRightIcon;\n  const ariaLabel = isLeft ? 'Anterior' : 'Siguiente';\n\n  return (\n    <IconButton\n      aria-label={ariaLabel}\n      size=\"small\"\n      onClick={onClick}\n      disabled={!enabled}\n      sx={{\n        flex: '0 0 auto',\n        // Reservamos el slot siempre que haya overflow en algún lado,\n        // así el área scroll tiene un ancho estable (no saltan los\n        // steps cuando aparece/desaparece la flecha).\n        visibility: visible ? 'visible' : 'hidden',\n      }}\n    >\n      <Icon fontSize=\"small\" />\n    </IconButton>\n  );\n};\n","import {\n  Children,\n  isValidElement,\n  type FC,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport {\n  Stepper as MuiStepper,\n  Step as MuiStep,\n  StepLabel as MuiStepLabel,\n  Box,\n} from '@mui/material';\n\nimport { StepProps } from './Step';\nimport { useStepper } from './StepperContext';\nimport { useHorizontalScroll } from './_hooks/useHorizontalScroll';\nimport { StepperScrollArrow } from './_parts/StepperScrollArrow';\n\nexport interface StepperProps {\n  /** Uno o varios `<Step>`. Children que no sean `<Step>` se ignoran. */\n  children: ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  alternateLabel?: boolean;\n  /**\n   * Índice 0-based del paso activo. Si no se provee, el Stepper intenta\n   * leerlo del `StepperContext` (si está dentro de un `<StepperProvider>`).\n   * Si tampoco hay provider, el default es 0.\n   */\n  currentStep?: number;\n  keepMounted?: boolean;\n  sx?: object;\n}\n\nexport const Stepper: FC<StepperProps> = ({\n  children,\n  orientation = 'horizontal',\n  alternateLabel = false,\n  currentStep: currentStepProp,\n  keepMounted = false,\n  sx,\n}) => {\n  // Lee el paso desde el StepperContext cuando el consumer no lo pasa como prop.\n  const stepperCtx = useStepper();\n  const currentStep =\n    currentStepProp !== undefined\n      ? currentStepProp\n      : stepperCtx.totalSteps > 0\n        ? stepperCtx.currentStep\n        : 0;\n\n  const isHorizontal = orientation === 'horizontal';\n\n  // Filtra los children a los que tengan displayName=\"Step\" — acepta arrays,\n  // single child, fragments, y descarta cualquier otra cosa (strings, null, etc.).\n  const steps: ReactElement<StepProps>[] = Children.toArray(children).filter(\n    (child): child is ReactElement<StepProps> =>\n      isValidElement(child) &&\n      (child.type as { displayName?: string })?.displayName === 'Step',\n  );\n\n  const { scrollRef, canScrollLeft, canScrollRight, scrollBy } = useHorizontalScroll(\n    isHorizontal,\n    [steps.length, currentStep],\n  );\n\n  const showArrows = isHorizontal && (canScrollLeft || canScrollRight);\n\n  return (\n    <Box sx={sx}>\n      <Box\n        sx={\n          isHorizontal\n            ? { display: 'flex', alignItems: 'center', width: '100%', gap: 0.5 }\n            : undefined\n        }\n      >\n        {isHorizontal && (\n          <StepperScrollArrow\n            direction=\"left\"\n            enabled={canScrollLeft}\n            visible={showArrows}\n            onClick={() => scrollBy(-160)}\n          />\n        )}\n        <Box\n          ref={scrollRef}\n          sx={\n            isHorizontal\n              ? {\n                flex: '1 1 auto',\n                minWidth: 0,\n                overflowX: 'auto',\n                scrollBehavior: 'smooth',\n                WebkitOverflowScrolling: 'touch',\n                scrollbarWidth: 'none',\n                '&::-webkit-scrollbar': { display: 'none' },\n              }\n              : undefined\n          }\n        >\n          <MuiStepper\n            activeStep={currentStep}\n            orientation={orientation}\n            alternativeLabel={alternateLabel}\n            sx={\n              isHorizontal\n                ? {\n                  display: 'inline-flex',\n                  flexWrap: 'nowrap',\n                  minWidth: '100%',\n                  width: 'max-content',\n                  '& .MuiStep-root': { flex: '0 0 auto', minWidth: 120 },\n                }\n                : undefined\n            }\n          >\n            {steps.map((step, idx) => {\n              const {\n                label,\n                completed,\n                disabled,\n                className,\n                sx: stepSx,\n                dotColor,\n                activeDotColor,\n                completedDotColor,\n                iconTextColor,\n              } = step.props;\n              const key = step.key ?? idx;\n              return (\n                <MuiStep\n                  key={key}\n                  completed={completed}\n                  disabled={disabled}\n                  className={className}\n                  sx={stepSx}\n                >\n                  <MuiStepLabel\n                    sx={{\n                      pointerEvents: 'none',\n                      '& .MuiStepIcon-root': { color: dotColor },\n                      '& .MuiStepIcon-active': { color: activeDotColor },\n                      '& .MuiStepIcon-completed': { color: completedDotColor },\n                      '& .MuiStepIcon-text': { fill: iconTextColor },\n                    }}\n                  >\n                    {label}\n                  </MuiStepLabel>\n                </MuiStep>\n              );\n            })}\n          </MuiStepper>\n        </Box>\n        {isHorizontal && (\n          <StepperScrollArrow\n            direction=\"right\"\n            enabled={canScrollRight}\n            visible={showArrows}\n            onClick={() => scrollBy(160)}\n          />\n        )}\n      </Box>\n\n      {/* Cuerpos de los steps — render según el modo `keepMounted` */}\n      <Box mt={2}>\n        {keepMounted\n          ? steps.map((step, idx) => {\n            const key = step.key ?? idx;\n            const isActive = idx === currentStep;\n            return (\n              <Box\n                key={key}\n                // `display: none` mantiene el nodo en el DOM — state de los\n                // hijos (inputs, useState, etc.) no se pierde al navegar.\n                sx={{ display: isActive ? 'block' : 'none' }}\n                // Accesibilidad: oculta del flujo de lectura pero no del DOM.\n                aria-hidden={!isActive}\n              >\n                {step.props.children}\n              </Box>\n            );\n          })\n          : steps.map((step, idx) => {\n            if (idx !== currentStep) return null;\n            const key = step.key ?? idx;\n            return <Box key={key}>{step.props.children}</Box>;\n          })}\n      </Box>\n    </Box>\n  );\n};\n\nexport default Stepper;\n","import React from \"react\";\nimport { StepProps as MuiStepProps } from \"@mui/material\";\n\ntype PickMuiStepProps = Pick<MuiStepProps, \"completed\" | \"disabled\" | \"sx\" | \"className\">;\n\nexport interface StepProps extends PickMuiStepProps {\n  label: React.ReactNode;\n  children?: React.ReactNode;\n  disabled?: boolean;\n  sx?: object;\n  dotColor?: string;          // dot base\n  activeDotColor?: string;    // dot activa\n  completedDotColor?: string; // dot completada\n  iconTextColor?: string;     // número o check dentro\n}\n\nexport const Step = (_: StepProps): null => null;\n\nStep.displayName = \"Step\";\n\nexport default Step;"],"names":["createContext","useContext","useState","useCallback","useMemo","jsx","useRef","useLayoutEffect","useEffect","IconButton","Children","isValidElement","jsxs","Box","MuiStepper","MuiStep","MuiStepLabel"],"mappings":"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"}
+{"version":3,"file":"Stepper.cjs","sources":["../../../src/components/Stepper/StepperContext.tsx","../../../src/components/Stepper/_hooks/useHorizontalScroll.ts","../../../src/components/Stepper/_parts/StepperScrollArrow.tsx","../../../src/components/Stepper/Stepper.tsx","../../../src/components/Stepper/Step.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n  type FC,\n  type ReactNode,\n} from 'react';\n\n/**\n * API expuesta por `useStepper()`.\n */\nexport interface StepperContextValue {\n  /** Índice del paso actual (0-based). */\n  currentStep: number;\n  /** Total de pasos del stepper. */\n  totalSteps: number;\n  /** True si `currentStep === 0`. */\n  isFirst: boolean;\n  /** True si `currentStep === totalSteps - 1`. */\n  isLast: boolean;\n  /** True tras ejecutar `submitStep()` desde el último paso. */\n  completed: boolean;\n  /** Avanza al siguiente paso (no pasa de `totalSteps - 1`). */\n  nextStep: () => void;\n  /** Retrocede al paso anterior (no baja de 0). */\n  prevStep: () => void;\n  /** Salta a un paso específico (0-based). No-op si fuera de rango. */\n  goToStep: (stepNumber: number) => void;\n  /**\n   * Envía el stepper. Marca `completed = true` y dispara el callback\n   * `onSubmit` del provider. En el último paso suele reemplazar a `nextStep`.\n   */\n  submitStep: () => void;\n  /** Resetea al paso inicial y limpia `completed`. */\n  reset: () => void;\n}\n\nconst defaultValue: StepperContextValue = {\n  currentStep: 0,\n  totalSteps: 0,\n  isFirst: true,\n  isLast: true,\n  completed: false,\n  nextStep: () => {},\n  prevStep: () => {},\n  goToStep: () => {},\n  submitStep: () => {},\n  reset: () => {},\n};\n\nexport const StepperContext = createContext<StepperContextValue>(defaultValue);\n\n/**\n * Hook para consumir el `StepperContext` desde cualquier descendiente de\n * `<StepperProvider>`.\n *\n * Si se llama fuera de un provider, devuelve los valores por defecto (no-op)\n * para que componentes como `<Stepper>` puedan leerlo sin romper cuando no\n * hay provider envolvente.\n */\nexport function useStepper(): StepperContextValue {\n  return useContext(StepperContext);\n}\n\nexport interface StepperProviderProps {\n  /** Número total de pasos. Requerido. */\n  totalSteps: number;\n  /** Paso inicial (0-based). Default: 0. */\n  initialStep?: number;\n  /**\n   * Callback disparado cuando se llama `submitStep()`. Recibe el paso actual.\n   * El paquete NO ejecuta ninguna petición; queda a cargo del consumer.\n   */\n  onSubmit?: (currentStep: number) => void;\n  /**\n   * Callback disparado en cada cambio de paso (next/prev/goTo).\n   * Útil para tracking o validaciones externas.\n   */\n  onStepChange?: (newStep: number, prevStep: number) => void;\n  children?: ReactNode;\n}\n\n/**\n * Provider del stepper. Administra el `currentStep` internamente. El consumer\n * no necesita gestionar estado — solo consumirlo con `useStepper()` desde\n * cualquier descendiente.\n *\n * ```tsx\n * <StepperProvider totalSteps={3} onSubmit={handleFinalSubmit}>\n *   <Stepper>\n *     <Step label=\"Paso 1\"><StepOne /></Step>\n *     <Step label=\"Paso 2\"><StepTwo /></Step>\n *     <Step label=\"Paso 3\"><StepThree /></Step>\n *   </Stepper>\n *   <StepperControls />\n * </StepperProvider>\n * ```\n */\nexport const StepperProvider: FC<StepperProviderProps> = ({\n  totalSteps,\n  initialStep = 0,\n  onSubmit,\n  onStepChange,\n  children,\n}) => {\n  const [currentStep, setCurrentStep] = useState(initialStep);\n  const [completed, setCompleted] = useState(false);\n\n  const changeStep = useCallback(\n    (newStep: number) => {\n      if (newStep < 0 || newStep >= totalSteps) return;\n      if (newStep === currentStep) return;\n      onStepChange?.(newStep, currentStep);\n      setCurrentStep(newStep);\n    },\n    [currentStep, totalSteps, onStepChange],\n  );\n\n  const nextStep = useCallback(() => {\n    changeStep(currentStep + 1);\n  }, [changeStep, currentStep]);\n\n  const prevStep = useCallback(() => {\n    changeStep(currentStep - 1);\n  }, [changeStep, currentStep]);\n\n  const goToStep = useCallback(\n    (stepNumber: number) => {\n      changeStep(stepNumber);\n    },\n    [changeStep],\n  );\n\n  const submitStep = useCallback(() => {\n    setCompleted(true);\n    onSubmit?.(currentStep);\n  }, [currentStep, onSubmit]);\n\n  const reset = useCallback(() => {\n    setCurrentStep(initialStep);\n    setCompleted(false);\n  }, [initialStep]);\n\n  const value = useMemo<StepperContextValue>(\n    () => ({\n      currentStep,\n      totalSteps,\n      isFirst: currentStep === 0,\n      isLast: currentStep === totalSteps - 1,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    }),\n    [\n      currentStep,\n      totalSteps,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    ],\n  );\n\n  return (\n    <StepperContext.Provider value={value}>{children}</StepperContext.Provider>\n  );\n};\n","import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\n/**\n * Hook interno del Stepper para manejar scroll horizontal cuando los steps\n * no caben en el contenedor. No se exporta desde el barrel — es un detalle\n * de implementación.\n *\n * @param enabled - Si el scroll está activo (típicamente sólo en orientación horizontal).\n * @param deps    - Cosas que afectan el layout y disparan un recompute (ej. cantidad de steps, paso activo).\n *\n * Retorna:\n * - `scrollRef`: ref a asignar al contenedor con `overflow-x: auto`.\n * - `canScrollLeft` / `canScrollRight`: flags para habilitar/deshabilitar flechas.\n * - `scrollBy(delta)`: imperativo con scroll suave.\n */\nexport function useHorizontalScroll(enabled: boolean, deps: unknown[] = []) {\n  const scrollRef = useRef<HTMLDivElement | null>(null);\n  const [canScrollLeft, setCanScrollLeft] = useState(false);\n  const [canScrollRight, setCanScrollRight] = useState(false);\n\n  const updateScrollState = useCallback(() => {\n    const el = scrollRef.current;\n    if (!el) return;\n    const { scrollLeft, scrollWidth, clientWidth } = el;\n    // Tolerancia de 1px por redondeos de subpixel.\n    setCanScrollLeft(scrollLeft > 1);\n    setCanScrollRight(scrollLeft + clientWidth < scrollWidth - 1);\n  }, []);\n\n  useLayoutEffect(() => {\n    if (!enabled) return;\n    updateScrollState();\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [enabled, updateScrollState, ...deps]);\n\n  useEffect(() => {\n    if (!enabled) return;\n    const el = scrollRef.current;\n    if (!el) return;\n    el.addEventListener('scroll', updateScrollState, { passive: true });\n    const ro = new ResizeObserver(updateScrollState);\n    ro.observe(el);\n    return () => {\n      el.removeEventListener('scroll', updateScrollState);\n      ro.disconnect();\n    };\n  }, [enabled, updateScrollState]);\n\n  const scrollBy = useCallback((delta: number) => {\n    const el = scrollRef.current;\n    if (!el) return;\n    el.scrollBy({ left: delta, behavior: 'smooth' });\n  }, []);\n\n  return { scrollRef, canScrollLeft, canScrollRight, scrollBy };\n}\n","import { IconButton } from '@mui/material';\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft';\nimport ChevronRightIcon from '@mui/icons-material/ChevronRight';\n\ninterface StepperScrollArrowProps {\n  direction: 'left' | 'right';\n  /** Cuando `false`, el botón está deshabilitado (por ejemplo, ya estás al inicio). */\n  enabled: boolean;\n  /**\n   * Cuando `false`, el botón queda con `visibility: hidden` (reserva su\n   * espacio pero no se ve). Útil para que el área de scroll no se corra\n   * horizontalmente cuando no hay overflow en ningún lado.\n   */\n  visible: boolean;\n  onClick: () => void;\n}\n\n/**\n * Flecha de scroll (`<` / `>`) del Stepper horizontal. Se muestra a los\n * costados del área scrollable cuando hay overflow. Componente privado —\n * no se exporta del barrel.\n */\nexport const StepperScrollArrow = ({\n  direction,\n  enabled,\n  visible,\n  onClick,\n}: StepperScrollArrowProps) => {\n  const isLeft = direction === 'left';\n  const Icon = isLeft ? ChevronLeftIcon : ChevronRightIcon;\n  const ariaLabel = isLeft ? 'Anterior' : 'Siguiente';\n\n  return (\n    <IconButton\n      aria-label={ariaLabel}\n      size=\"small\"\n      onClick={onClick}\n      disabled={!enabled}\n      sx={{\n        flex: '0 0 auto',\n        // Reservamos el slot siempre que haya overflow en algún lado,\n        // así el área scroll tiene un ancho estable (no saltan los\n        // steps cuando aparece/desaparece la flecha).\n        visibility: visible ? 'visible' : 'hidden',\n      }}\n    >\n      <Icon fontSize=\"small\" />\n    </IconButton>\n  );\n};\n","import {\n  Children,\n  isValidElement,\n  type FC,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport {\n  Stepper as MuiStepper,\n  Step as MuiStep,\n  StepLabel as MuiStepLabel,\n  Box,\n} from '@mui/material';\n\nimport { StepProps } from './Step';\nimport { useStepper } from './StepperContext';\nimport { useHorizontalScroll } from './_hooks/useHorizontalScroll';\nimport { StepperScrollArrow } from './_parts/StepperScrollArrow';\n\nexport interface StepperProps {\n  /** Uno o varios `<Step>`. Children que no sean `<Step>` se ignoran. */\n  children: ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  alternateLabel?: boolean;\n  /**\n   * Índice 0-based del paso activo. Si no se provee, el Stepper intenta\n   * leerlo del `StepperContext` (si está dentro de un `<StepperProvider>`).\n   * Si tampoco hay provider, el default es 0.\n   */\n  currentStep?: number;\n  keepMounted?: boolean;\n  sx?: object;\n}\n\nexport const Stepper: FC<StepperProps> = ({\n  children,\n  orientation = 'horizontal',\n  alternateLabel = false,\n  currentStep: currentStepProp,\n  keepMounted = false,\n  sx,\n}) => {\n  // Lee el paso desde el StepperContext cuando el consumer no lo pasa como prop.\n  const stepperCtx = useStepper();\n  const currentStep =\n    currentStepProp !== undefined\n      ? currentStepProp\n      : stepperCtx.totalSteps > 0\n        ? stepperCtx.currentStep\n        : 0;\n\n  const isHorizontal = orientation === 'horizontal';\n\n  // Filtra los children a los que tengan displayName=\"Step\" — acepta arrays,\n  // single child, fragments, y descarta cualquier otra cosa (strings, null, etc.).\n  const steps: ReactElement<StepProps>[] = Children.toArray(children).filter(\n    (child): child is ReactElement<StepProps> =>\n      isValidElement(child) &&\n      (child.type as { displayName?: string })?.displayName === 'Step',\n  );\n\n  const { scrollRef, canScrollLeft, canScrollRight, scrollBy } = useHorizontalScroll(\n    isHorizontal,\n    [steps.length, currentStep],\n  );\n\n  const showArrows = isHorizontal && (canScrollLeft || canScrollRight);\n\n  return (\n    <Box sx={sx}>\n      <Box\n        sx={\n          isHorizontal\n            ? { display: 'flex', alignItems: 'center', width: '100%', gap: 0.5 }\n            : undefined\n        }\n      >\n        {isHorizontal && (\n          <StepperScrollArrow\n            direction=\"left\"\n            enabled={canScrollLeft}\n            visible={showArrows}\n            onClick={() => scrollBy(-160)}\n          />\n        )}\n        <Box\n          ref={scrollRef}\n          sx={\n            isHorizontal\n              ? {\n                flex: '1 1 auto',\n                minWidth: 0,\n                overflowX: 'auto',\n                scrollBehavior: 'smooth',\n                WebkitOverflowScrolling: 'touch',\n                scrollbarWidth: 'none',\n                '&::-webkit-scrollbar': { display: 'none' },\n              }\n              : undefined\n          }\n        >\n          <MuiStepper\n            activeStep={currentStep}\n            orientation={orientation}\n            alternativeLabel={alternateLabel}\n            sx={{\n              ...(isHorizontal && {\n                display: 'inline-flex',\n                flexWrap: 'nowrap',\n                minWidth: '100%',\n                width: 'max-content',\n                '& .MuiStep-root': { flex: '0 0 auto', minWidth: 120 },\n              }),\n              ...(alternateLabel && { justifyContent: 'center' }),\n            }}\n          >\n            {steps.map((step, idx) => {\n              const {\n                label,\n                completed,\n                disabled,\n                className,\n                sx: stepSx,\n                dotColor,\n                activeDotColor,\n                completedDotColor,\n                iconTextColor,\n              } = step.props;\n              const key = step.key ?? idx;\n              return (\n                <MuiStep\n                  key={key}\n                  completed={completed}\n                  disabled={disabled}\n                  className={className}\n                  sx={stepSx}\n                >\n                  <MuiStepLabel\n                    sx={{\n                      pointerEvents: 'none',\n                      '& .MuiStepIcon-root': { color: dotColor },\n                      '& .MuiStepIcon-active': { color: activeDotColor },\n                      '& .MuiStepIcon-completed': { color: completedDotColor },\n                      '& .MuiStepIcon-text': { fill: iconTextColor },\n                    }}\n                  >\n                    {label}\n                  </MuiStepLabel>\n                </MuiStep>\n              );\n            })}\n          </MuiStepper>\n        </Box>\n        {isHorizontal && (\n          <StepperScrollArrow\n            direction=\"right\"\n            enabled={canScrollRight}\n            visible={showArrows}\n            onClick={() => scrollBy(160)}\n          />\n        )}\n      </Box>\n\n      {/* Cuerpos de los steps — render según el modo `keepMounted` */}\n      <Box mt={2}\n        sx={{\n          display: 'flex',\n          justifyContent: 'center',\n        }}>\n        {keepMounted\n          ? steps.map((step, idx) => {\n            const key = step.key ?? idx;\n            const isActive = idx === currentStep;\n            return (\n              <Box\n                key={key}\n                // `display: none` mantiene el nodo en el DOM — state de los\n                // hijos (inputs, useState, etc.) no se pierde al navegar.\n                sx={{ display: isActive ? 'block' : 'none', width: '100%' }}\n                // Accesibilidad: oculta del flujo de lectura pero no del DOM.\n                aria-hidden={!isActive}\n              >\n                {step.props.children}\n              </Box>\n            );\n          })\n          : steps.map((step, idx) => {\n            if (idx !== currentStep) return null;\n            const key = step.key ?? idx;\n            return <Box key={key}>{step.props.children}</Box>;\n          })}\n      </Box>\n    </Box>\n  );\n};\n\nexport default Stepper;\n","import React from \"react\";\nimport { StepProps as MuiStepProps } from \"@mui/material\";\n\ntype PickMuiStepProps = Pick<MuiStepProps, \"completed\" | \"disabled\" | \"sx\" | \"className\">;\n\nexport interface StepProps extends PickMuiStepProps {\n  label: React.ReactNode;\n  children?: React.ReactNode;\n  disabled?: boolean;\n  sx?: object;\n  dotColor?: string;          // dot base\n  activeDotColor?: string;    // dot activa\n  completedDotColor?: string; // dot completada\n  iconTextColor?: string;     // número o check dentro\n}\n\nexport const Step = (_: StepProps): null => null;\n\nStep.displayName = \"Step\";\n\nexport default Step;"],"names":["createContext","useContext","useState","useCallback","useMemo","jsx","useRef","useLayoutEffect","useEffect","IconButton","Children","isValidElement","jsxs","Box","MuiStepper","MuiStep","MuiStepLabel"],"mappings":"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"}

package/components/Stepper/Stepper.js

@@ -1,3 +1,19 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 import { jsx, jsxs } from "react/jsx-runtime";
 import { createContext, useState, useCallback, useMemo, useContext, useRef, useLayoutEffect, useEffect, Children, isValidElement } from "react";
 import { IconButton, Box, Stepper as Stepper$1, Step as Step$1, StepLabel } from "@mui/material";
@@ -35,14 +51,12 @@ const StepperProvider = ({
   const [completed, setCompleted] = useState(false);
   const changeStep = useCallback(
     (newStep) => {
-      setCurrentStep((prev) => {
-        if (newStep === prev) return prev;
-        if (newStep < 0 || newStep >= totalSteps) return prev;
-        onStepChange == null ? void 0 : onStepChange(newStep, prev);
-        return newStep;
-      });
+      if (newStep < 0 || newStep >= totalSteps) return;
+      if (newStep === currentStep) return;
+      onStepChange == null ? void 0 : onStepChange(newStep, currentStep);
+      setCurrentStep(newStep);
     },
-    [totalSteps, onStepChange]
+    [currentStep, totalSteps, onStepChange]
   );
   const nextStep = useCallback(() => {
     changeStep(currentStep + 1);
@@ -207,13 +221,13 @@ const Stepper = ({
                   activeStep: currentStep,
                   orientation,
                   alternativeLabel: alternateLabel,
-                  sx: isHorizontal ? {
+                  sx: __spreadValues(__spreadValues({}, isHorizontal && {
                     display: "inline-flex",
                     flexWrap: "nowrap",
                     minWidth: "100%",
                     width: "max-content",
                     "& .MuiStep-root": { flex: "0 0 auto", minWidth: 120 }
-                  } : void 0,
+                  }), alternateLabel && { justifyContent: "center" }),
                   children: steps.map((step, idx) => {
                     var _a;
                     const {
@@ -268,25 +282,35 @@ const Stepper = ({
         ]
       }
     ),
-    /* @__PURE__ */ jsx(Box, { mt: 2, children: keepMounted ? steps.map((step, idx) => {
-      var _a;
-      const key = (_a = step.key) != null ? _a : idx;
-      const isActive = idx === currentStep;
-      return /* @__PURE__ */ jsx(
-        Box,
-        {
-          sx: { display: isActive ? "block" : "none" },
-          "aria-hidden": !isActive,
-          children: step.props.children
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        mt: 2,
+        sx: {
+          display: "flex",
+          justifyContent: "center"
         },
-        key
-      );
-    }) : steps.map((step, idx) => {
-      var _a;
-      if (idx !== currentStep) return null;
-      const key = (_a = step.key) != null ? _a : idx;
-      return /* @__PURE__ */ jsx(Box, { children: step.props.children }, key);
-    }) })
+        children: keepMounted ? steps.map((step, idx) => {
+          var _a;
+          const key = (_a = step.key) != null ? _a : idx;
+          const isActive = idx === currentStep;
+          return /* @__PURE__ */ jsx(
+            Box,
+            {
+              sx: { display: isActive ? "block" : "none", width: "100%" },
+              "aria-hidden": !isActive,
+              children: step.props.children
+            },
+            key
+          );
+        }) : steps.map((step, idx) => {
+          var _a;
+          if (idx !== currentStep) return null;
+          const key = (_a = step.key) != null ? _a : idx;
+          return /* @__PURE__ */ jsx(Box, { children: step.props.children }, key);
+        })
+      }
+    )
   ] });
 };
 const Step = (_) => null;