@soyfri/shared-library 2.0.0-beta.1 → 2.0.0-beta.11

package/dist/components/Drawer/Drawer.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Drawer.cjs","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 type { SxProps, 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        ? theme.palette.error.light + '22'\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 React, { 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  /** 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  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        PaperProps={{\n          sx: paperSx,\n        }}\n      >\n        {header && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : 'space-between',\n              px: contextValue.collapsed ? 1 : 2,\n              py: 1.5,\n              minHeight: 64,\n              flexShrink: 0,\n            }}\n          >\n            {!contextValue.collapsed && (\n              <Box sx={{ flex: 1, minWidth: 0 }}>{header}</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 && shouldShowToggle && (\n          <Box\n            sx={{\n              display: 'flex',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : 'flex-end',\n              px: 1,\n              py: 1,\n            }}\n          >\n            <IconButton\n              size=\"small\"\n              onClick={onToggleCollapse}\n              aria-label={collapsed ? 'Expandir menú' : 'Colapsar menú'}\n            >\n              {collapsed ? <ChevronRightIcon /> : <ChevronLeftIcon />}\n            </IconButton>\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  /** 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  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 !== undefined && (\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  if (collapsed && typeof label === 'string') {\n    return (\n      <Tooltip title={label} placement=\"right\" arrow>\n        {content}\n      </Tooltip>\n    );\n  }\n\n  return content;\n}\n\nexport default DrawerItem;\n"],"names":["createContext","useContext","useTheme","resolvePreset","useMemo","jsx","jsxs","MuiDrawer","Box","IconButton","Typography","Tooltip"],"mappings":"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"}

package/dist/components/Drawer/Drawer.js.map

@@ -1 +0,0 @@
-{"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 type { SxProps, 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        ? theme.palette.error.light + '22'\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 React, { 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  /** 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  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        PaperProps={{\n          sx: paperSx,\n        }}\n      >\n        {header && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : 'space-between',\n              px: contextValue.collapsed ? 1 : 2,\n              py: 1.5,\n              minHeight: 64,\n              flexShrink: 0,\n            }}\n          >\n            {!contextValue.collapsed && (\n              <Box sx={{ flex: 1, minWidth: 0 }}>{header}</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 && shouldShowToggle && (\n          <Box\n            sx={{\n              display: 'flex',\n              justifyContent: contextValue.collapsed\n                ? 'center'\n                : 'flex-end',\n              px: 1,\n              py: 1,\n            }}\n          >\n            <IconButton\n              size=\"small\"\n              onClick={onToggleCollapse}\n              aria-label={collapsed ? 'Expandir menú' : 'Colapsar menú'}\n            >\n              {collapsed ? <ChevronRightIcon /> : <ChevronLeftIcon />}\n            </IconButton>\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  /** 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  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 !== undefined && (\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  if (collapsed && typeof label === 'string') {\n    return (\n      <Tooltip title={label} 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/dist/components/Stepper/Stepper.cjs

@@ -1,49 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const material = require("@mui/material");
-const useWizard = require("../../useWizard-CWdIxZzX.cjs");
-const Stepper = ({
-  children,
-  orientation = "horizontal",
-  alternateLabel = false,
-  sx,
-  currentStep: currentStepProp
-}) => {
-  const wizard = useWizard.useWizard();
-  const currentStep = currentStepProp !== void 0 ? currentStepProp : wizard.totalSteps > 0 ? wizard.currentStep : 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(material.Stepper, { activeStep: currentStep, orientation, alternativeLabel: alternateLabel, children: children.map((child, idx) => {
-      const { label, completed, disabled, className, sx: stepSx, dotColor, activeDotColor, completedDotColor, iconTextColor } = child.props;
-      return /* @__PURE__ */ jsxRuntime.jsx(material.Step, { completed, disabled, className, sx: stepSx, children: /* @__PURE__ */ jsxRuntime.jsx(
-        material.StepLabel,
-        {
-          sx: {
-            pointerEvents: "none",
-            "& .MuiStepIcon-root": {
-              color: dotColor
-            },
-            "& .MuiStepIcon-active": {
-              color: activeDotColor
-            },
-            "& .MuiStepIcon-completed": {
-              color: completedDotColor
-            },
-            "& .MuiStepIcon-text": {
-              fill: iconTextColor
-            }
-          },
-          children: label
-        }
-      ) }, idx);
-    }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(material.Box, { mt: 2, children: children.map(
-      (child, idx) => idx === currentStep ? /* @__PURE__ */ jsxRuntime.jsx(material.Box, { children: child.props.children }, idx) : null
-    ) })
-  ] });
-};
-const Step = (_) => null;
-Step.displayName = "Step";
-exports.Step = Step;
-exports.Stepper = Stepper;
-//# sourceMappingURL=Stepper.cjs.map

package/dist/components/Stepper/Stepper.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Stepper.cjs","sources":["../../../src/components/Stepper/Stepper.tsx","../../../src/components/Stepper/Step.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { Stepper as MuiStepper, Step as MuiStep, StepLabel as MuiStepLabel, Box } from \"@mui/material\";\nimport { StepProps } from \"./Step\";\nimport { useWizard } from \"../../hooks/Wizard\";\n\ninterface MyStepperProps {\n  children: ReactElement<StepProps>[];\n  orientation?: \"horizontal\" | \"vertical\";\n  sx?: object;\n  alternateLabel?: boolean;\n  /**\n   * Índice 0-based del paso activo. Si no se provee, el Stepper intenta\n   * leerlo del `WizardContext` (si está dentro de un `<WizardProvider>`).\n   * Si tampoco hay provider, el default es 0.\n   */\n  currentStep?: number;\n}\n\nexport const Stepper: React.FC<MyStepperProps> = ({\n  children,\n  orientation = \"horizontal\",\n  alternateLabel = false,\n\n  sx,\n  currentStep: currentStepProp,\n}) => {\n  // Lee el paso desde el WizardContext cuando el consumer no lo pasa como prop.\n  // Si el Stepper NO está dentro de un WizardProvider, `useWizard()` devuelve\n  // el valor default (currentStep=0, totalSteps=0), así que no rompe nada.\n  const wizard = useWizard();\n  const currentStep =\n    currentStepProp !== undefined\n      ? currentStepProp\n      : wizard.totalSteps > 0\n        ? wizard.currentStep\n        : 0;\n\n  return (\n    <Box sx={sx}>\n      <MuiStepper activeStep={currentStep} orientation={orientation} alternativeLabel={alternateLabel} >\n        {children.map((child, idx) => {\n          const { label, completed, disabled, className, sx: stepSx, dotColor, activeDotColor, completedDotColor, iconTextColor } = child.props;\n          return (\n            <MuiStep key={idx} completed={completed} disabled={disabled} className={className} sx={stepSx}>\n              <MuiStepLabel sx={{\n                pointerEvents: 'none',\n                \"& .MuiStepIcon-root\": {\n                  color: dotColor,\n                },\n                \"& .MuiStepIcon-active\": {\n                  color: activeDotColor,\n                },\n                \"& .MuiStepIcon-completed\": {\n                  color: completedDotColor,\n                },\n                \"& .MuiStepIcon-text\": {\n                  fill: iconTextColor,\n                },\n              }}\n              >{label}\n              </MuiStepLabel>\n            </MuiStep>\n          );\n        })}\n      </MuiStepper>\n      <Box mt={2}>\n        {children.map((child, idx) =>\n          idx === currentStep ? <Box key={idx}>{child.props.children}</Box> : null\n        )}\n      </Box>\n    </Box>\n  );\n};\n\nexport default Stepper;","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":["useWizard","jsxs","Box","jsx","MuiStepper","MuiStep","MuiStepLabel"],"mappings":";;;;;AAkBO,MAAM,UAAoC,CAAC;AAAA,EAChD;AAAA,EACA,cAAc;AAAA,EACd,iBAAiB;AAAA,EAEjB;AAAA,EACA,aAAa;AACf,MAAM;AAIJ,QAAM,SAASA,UAAAA,UAAA;AACf,QAAM,cACJ,oBAAoB,SAChB,kBACA,OAAO,aAAa,IAClB,OAAO,cACP;AAER,SACEC,gCAACC,SAAAA,OAAI,IACH,UAAA;AAAA,IAAAC,2BAAAA,IAACC,SAAAA,SAAA,EAAW,YAAY,aAAa,aAA0B,kBAAkB,gBAC9E,UAAA,SAAS,IAAI,CAAC,OAAO,QAAQ;AAC5B,YAAM,EAAE,OAAO,WAAW,UAAU,WAAW,IAAI,QAAQ,UAAU,gBAAgB,mBAAmB,cAAA,IAAkB,MAAM;AAChI,4CACGC,eAAA,EAAkB,WAAsB,UAAoB,WAAsB,IAAI,QACrF,UAAAF,2BAAAA;AAAAA,QAACG,SAAAA;AAAAA,QAAA;AAAA,UAAa,IAAI;AAAA,YAChB,eAAe;AAAA,YACf,uBAAuB;AAAA,cACrB,OAAO;AAAA,YAAA;AAAA,YAET,yBAAyB;AAAA,cACvB,OAAO;AAAA,YAAA;AAAA,YAET,4BAA4B;AAAA,cAC1B,OAAO;AAAA,YAAA;AAAA,YAET,uBAAuB;AAAA,cACrB,MAAM;AAAA,YAAA;AAAA,UACR;AAAA,UAEA,UAAA;AAAA,QAAA;AAAA,MAAA,KAhBU,GAkBd;AAAA,IAEJ,CAAC,EAAA,CACH;AAAA,IACAH,2BAAAA,IAACD,SAAAA,KAAA,EAAI,IAAI,GACN,UAAA,SAAS;AAAA,MAAI,CAAC,OAAO,QACpB,QAAQ,cAAcC,2BAAAA,IAACD,SAAAA,KAAA,EAAe,UAAA,MAAM,MAAM,SAAA,GAAlB,GAA2B,IAAS;AAAA,IAAA,EACtE,CACF;AAAA,EAAA,GACF;AAEJ;ACxDO,MAAM,OAAO,CAAC,MAAuB;AAE5C,KAAK,cAAc;;;"}

package/dist/components/Stepper/Stepper.js

@@ -1,49 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { Box, Stepper as Stepper$1, Step as Step$1, StepLabel } from "@mui/material";
-import { u as useWizard } from "../../useWizard-CWq--C3o.js";
-const Stepper = ({
-  children,
-  orientation = "horizontal",
-  alternateLabel = false,
-  sx,
-  currentStep: currentStepProp
-}) => {
-  const wizard = useWizard();
-  const currentStep = currentStepProp !== void 0 ? currentStepProp : wizard.totalSteps > 0 ? wizard.currentStep : 0;
-  return /* @__PURE__ */ jsxs(Box, { sx, children: [
-    /* @__PURE__ */ jsx(Stepper$1, { activeStep: currentStep, orientation, alternativeLabel: alternateLabel, children: children.map((child, idx) => {
-      const { label, completed, disabled, className, sx: stepSx, dotColor, activeDotColor, completedDotColor, iconTextColor } = child.props;
-      return /* @__PURE__ */ jsx(Step$1, { completed, disabled, className, sx: stepSx, children: /* @__PURE__ */ jsx(
-        StepLabel,
-        {
-          sx: {
-            pointerEvents: "none",
-            "& .MuiStepIcon-root": {
-              color: dotColor
-            },
-            "& .MuiStepIcon-active": {
-              color: activeDotColor
-            },
-            "& .MuiStepIcon-completed": {
-              color: completedDotColor
-            },
-            "& .MuiStepIcon-text": {
-              fill: iconTextColor
-            }
-          },
-          children: label
-        }
-      ) }, idx);
-    }) }),
-    /* @__PURE__ */ jsx(Box, { mt: 2, children: children.map(
-      (child, idx) => idx === currentStep ? /* @__PURE__ */ jsx(Box, { children: child.props.children }, idx) : null
-    ) })
-  ] });
-};
-const Step = (_) => null;
-Step.displayName = "Step";
-export {
-  Step,
-  Stepper
-};
-//# sourceMappingURL=Stepper.js.map

package/dist/components/Stepper/Stepper.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Stepper.js","sources":["../../../src/components/Stepper/Stepper.tsx","../../../src/components/Stepper/Step.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { Stepper as MuiStepper, Step as MuiStep, StepLabel as MuiStepLabel, Box } from \"@mui/material\";\nimport { StepProps } from \"./Step\";\nimport { useWizard } from \"../../hooks/Wizard\";\n\ninterface MyStepperProps {\n  children: ReactElement<StepProps>[];\n  orientation?: \"horizontal\" | \"vertical\";\n  sx?: object;\n  alternateLabel?: boolean;\n  /**\n   * Índice 0-based del paso activo. Si no se provee, el Stepper intenta\n   * leerlo del `WizardContext` (si está dentro de un `<WizardProvider>`).\n   * Si tampoco hay provider, el default es 0.\n   */\n  currentStep?: number;\n}\n\nexport const Stepper: React.FC<MyStepperProps> = ({\n  children,\n  orientation = \"horizontal\",\n  alternateLabel = false,\n\n  sx,\n  currentStep: currentStepProp,\n}) => {\n  // Lee el paso desde el WizardContext cuando el consumer no lo pasa como prop.\n  // Si el Stepper NO está dentro de un WizardProvider, `useWizard()` devuelve\n  // el valor default (currentStep=0, totalSteps=0), así que no rompe nada.\n  const wizard = useWizard();\n  const currentStep =\n    currentStepProp !== undefined\n      ? currentStepProp\n      : wizard.totalSteps > 0\n        ? wizard.currentStep\n        : 0;\n\n  return (\n    <Box sx={sx}>\n      <MuiStepper activeStep={currentStep} orientation={orientation} alternativeLabel={alternateLabel} >\n        {children.map((child, idx) => {\n          const { label, completed, disabled, className, sx: stepSx, dotColor, activeDotColor, completedDotColor, iconTextColor } = child.props;\n          return (\n            <MuiStep key={idx} completed={completed} disabled={disabled} className={className} sx={stepSx}>\n              <MuiStepLabel sx={{\n                pointerEvents: 'none',\n                \"& .MuiStepIcon-root\": {\n                  color: dotColor,\n                },\n                \"& .MuiStepIcon-active\": {\n                  color: activeDotColor,\n                },\n                \"& .MuiStepIcon-completed\": {\n                  color: completedDotColor,\n                },\n                \"& .MuiStepIcon-text\": {\n                  fill: iconTextColor,\n                },\n              }}\n              >{label}\n              </MuiStepLabel>\n            </MuiStep>\n          );\n        })}\n      </MuiStepper>\n      <Box mt={2}>\n        {children.map((child, idx) =>\n          idx === currentStep ? <Box key={idx}>{child.props.children}</Box> : null\n        )}\n      </Box>\n    </Box>\n  );\n};\n\nexport default Stepper;","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":["MuiStepper","MuiStep","MuiStepLabel"],"mappings":";;;AAkBO,MAAM,UAAoC,CAAC;AAAA,EAChD;AAAA,EACA,cAAc;AAAA,EACd,iBAAiB;AAAA,EAEjB;AAAA,EACA,aAAa;AACf,MAAM;AAIJ,QAAM,SAAS,UAAA;AACf,QAAM,cACJ,oBAAoB,SAChB,kBACA,OAAO,aAAa,IAClB,OAAO,cACP;AAER,SACE,qBAAC,OAAI,IACH,UAAA;AAAA,IAAA,oBAACA,WAAA,EAAW,YAAY,aAAa,aAA0B,kBAAkB,gBAC9E,UAAA,SAAS,IAAI,CAAC,OAAO,QAAQ;AAC5B,YAAM,EAAE,OAAO,WAAW,UAAU,WAAW,IAAI,QAAQ,UAAU,gBAAgB,mBAAmB,cAAA,IAAkB,MAAM;AAChI,iCACGC,QAAA,EAAkB,WAAsB,UAAoB,WAAsB,IAAI,QACrF,UAAA;AAAA,QAACC;AAAAA,QAAA;AAAA,UAAa,IAAI;AAAA,YAChB,eAAe;AAAA,YACf,uBAAuB;AAAA,cACrB,OAAO;AAAA,YAAA;AAAA,YAET,yBAAyB;AAAA,cACvB,OAAO;AAAA,YAAA;AAAA,YAET,4BAA4B;AAAA,cAC1B,OAAO;AAAA,YAAA;AAAA,YAET,uBAAuB;AAAA,cACrB,MAAM;AAAA,YAAA;AAAA,UACR;AAAA,UAEA,UAAA;AAAA,QAAA;AAAA,MAAA,KAhBU,GAkBd;AAAA,IAEJ,CAAC,EAAA,CACH;AAAA,IACA,oBAAC,KAAA,EAAI,IAAI,GACN,UAAA,SAAS;AAAA,MAAI,CAAC,OAAO,QACpB,QAAQ,cAAc,oBAAC,KAAA,EAAe,UAAA,MAAM,MAAM,SAAA,GAAlB,GAA2B,IAAS;AAAA,IAAA,EACtE,CACF;AAAA,EAAA,GACF;AAEJ;ACxDO,MAAM,OAAO,CAAC,MAAuB;AAE5C,KAAK,cAAc;"}

package/rollup.config.cjs

@@ -1,87 +0,0 @@
-const resolve = require('@rollup/plugin-node-resolve');
-const commonjs = require('@rollup/plugin-commonjs');
-const typescript = require('rollup-plugin-typescript2');
-const peerDepsExternal = require('rollup-plugin-peer-deps-external');
-const postcss = require('rollup-plugin-postcss');
-const terser = require('@rollup/plugin-terser');
-// const alias = require('@rollup/plugin-alias'); // 👈 Ya no necesitamos este plugin
-const { globSync } = require('glob');
-const path = require('path');
-const pkg = require('./package.json');
-const projectRootDir = path.resolve(__dirname);
-
-const componentEntryPoints = globSync('src/components/*/index.ts').reduce((acc, file) => {
-  const componentName = path.basename(path.dirname(file));
-  acc[`components/${componentName}`] = file;
-  return acc;
-}, {});
-
-const mainEntry = {
-  index: 'src/index.ts',
-};
-
-module.exports = {
-  input: {
-    ...mainEntry,
-    ...componentEntryPoints,
-  },
-  output: [
-    {
-      dir: 'dist/esm',
-      format: 'esm',
-      sourcemap: true,
-      preserveModules: true,
-      preserveModulesRoot: 'src',
-      entryFileNames: '[name].js',
-      chunkFileNames: '_chunks/chunk-[hash].js',
-      exports: 'named',
-    },
-    {
-      dir: 'dist/cjs',
-      format: 'cjs',
-      sourcemap: true,
-      preserveModules: true,
-      preserveModulesRoot: 'src',
-      entryFileNames: '[name].cjs',
-      chunkFileNames: '_chunks/chunk-[hash].cjs',
-      exports: 'named',
-    },
-  ],
-  plugins: [
-    peerDepsExternal(),
-    // 👈 Configura el alias dentro del plugin 'resolve'
-    resolve({
-      extensions: ['.js', '.jsx', '.ts', '.tsx'],
-      alias: {
-        entries: [
-          { find: '@soyfri/shared-library', replacement: path.resolve(projectRootDir, 'src') }
-        ]
-      }
-    }),
-    commonjs(),
-    typescript({
-      tsconfig: './tsconfig.json',
-      useTsconfigDeclarationDir: true,
-    }),
-    postcss({
-      config: {
-        path: './postcss.config.js',
-      },
-      extensions: ['.css'],
-      minimize: true,
-      extract: true,
-    }),
-    terser(),
-  ],
-  external: [
-    'react',
-    'react-dom',
-    /@mui\/.*/,
-    /@emotion\/.*/,
-    'dayjs',
-    'react-hook-form',
-    'tailwindcss',
-    'autoprefixer',
-    'postcss',
-  ],
-};

package/src/components/ActionMenu/ActionMenu.stories.tsx

@@ -1,230 +0,0 @@
-import React from 'react';
-import type { Meta, StoryObj } from '@storybook/react';
-import { fn } from '@storybook/test';
-import {
-  Box,
-  Button,
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableRow,
-  Paper,
-  Chip,
-} from '@mui/material';
-import EditIcon from '@mui/icons-material/Edit';
-import ContentCopyIcon from '@mui/icons-material/ContentCopy';
-import DeleteIcon from '@mui/icons-material/Delete';
-import VisibilityIcon from '@mui/icons-material/Visibility';
-import DownloadIcon from '@mui/icons-material/Download';
-import ShareIcon from '@mui/icons-material/Share';
-import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
-
-import { ActionMenu } from './ActionMenu';
-
-const meta: Meta<typeof ActionMenu> = {
-  title: 'Components/ActionMenu',
-  component: ActionMenu,
-  tags: ['autodocs'],
-  parameters: {
-    docs: {
-      description: {
-        component:
-          'Menú de acciones compacto pensado para celdas de tabla, cabeceras y cualquier lugar donde hagan falta acciones secundarias detrás de un trigger. Reemplaza los patrones `<Dropdown>` de react-bootstrap.',
-      },
-    },
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof ActionMenu>;
-
-// ── Stories ──────────────────────────────────────────────────────────────
-
-export const Default: Story = {
-  args: {
-    items: [
-      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
-      { label: 'Duplicar', icon: <ContentCopyIcon fontSize="small" />, onClick: fn() },
-      { label: 'Ver detalle', icon: <VisibilityIcon fontSize="small" />, onClick: fn() },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Menú básico con trigger de 3 puntos (icono por defecto). Cada item tiene label + icono + onClick.',
-      },
-    },
-  },
-};
-
-export const WithDangerItem: Story = {
-  args: {
-    items: [
-      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
-      { label: 'Duplicar', icon: <ContentCopyIcon fontSize="small" />, onClick: fn() },
-      {
-        label: 'Eliminar',
-        icon: <DeleteIcon fontSize="small" />,
-        onClick: fn(),
-        danger: true,
-        dividerBefore: true,
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Item final marcado como `danger` (pintado en rojo) con `dividerBefore: true` para separarlo visualmente del resto. Patrón típico para acciones destructivas.',
-      },
-    },
-  },
-};
-
-export const WithDisabledItems: Story = {
-  args: {
-    items: [
-      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
-      {
-        label: 'Exportar',
-        icon: <DownloadIcon fontSize="small" />,
-        onClick: fn(),
-        disabled: true,
-      },
-      {
-        label: 'Compartir',
-        icon: <ShareIcon fontSize="small" />,
-        onClick: fn(),
-        disabled: true,
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Items deshabilitados condicionalmente — útil cuando una acción no aplica al estado actual del row (ej. exportar un recurso que aún no se procesó).',
-      },
-    },
-  },
-};
-
-export const CustomTrigger: Story = {
-  args: {
-    items: [
-      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
-      { label: 'Duplicar', icon: <ContentCopyIcon fontSize="small" />, onClick: fn() },
-      { label: 'Eliminar', icon: <DeleteIcon fontSize="small" />, onClick: fn(), danger: true },
-    ],
-    trigger: (
-      <Button variant="outlined" startIcon={<MoreHorizIcon />}>
-        Más
-      </Button>
-    ),
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'El trigger por defecto es un IconButton de 3 puntos, pero podés pasar cualquier nodo (botón, chip, icono custom). El `onClick` del menú se inyecta automáticamente al trigger clonado.',
-      },
-    },
-  },
-};
-
-export const InsideTableCell: Story = {
-  render: () => {
-    const rows = [
-      { id: 1, name: 'Comercio A', status: 'Activo' },
-      { id: 2, name: 'Comercio B', status: 'Pendiente' },
-      { id: 3, name: 'Comercio C', status: 'Suspendido' },
-    ];
-
-    return (
-      <Paper sx={{ maxWidth: 720 }}>
-        <Table size="small">
-          <TableHead>
-            <TableRow>
-              <TableCell>ID</TableCell>
-              <TableCell>Comercio</TableCell>
-              <TableCell>Estado</TableCell>
-              <TableCell align="right">Acciones</TableCell>
-            </TableRow>
-          </TableHead>
-          <TableBody>
-            {rows.map((row) => (
-              <TableRow key={row.id} hover>
-                <TableCell>{row.id}</TableCell>
-                <TableCell>{row.name}</TableCell>
-                <TableCell>
-                  <Chip
-                    label={row.status}
-                    size="small"
-                    color={
-                      row.status === 'Activo'
-                        ? 'success'
-                        : row.status === 'Pendiente'
-                          ? 'warning'
-                          : 'error'
-                    }
-                  />
-                </TableCell>
-                <TableCell align="right">
-                  <ActionMenu
-                    items={[
-                      {
-                        label: 'Ver detalle',
-                        icon: <VisibilityIcon fontSize="small" />,
-                        onClick: fn(() => console.log('Ver', row.id)),
-                      },
-                      {
-                        label: 'Editar',
-                        icon: <EditIcon fontSize="small" />,
-                        onClick: fn(() => console.log('Editar', row.id)),
-                      },
-                      {
-                        label: 'Eliminar',
-                        icon: <DeleteIcon fontSize="small" />,
-                        onClick: fn(() => console.log('Eliminar', row.id)),
-                        danger: true,
-                        dividerBefore: true,
-                      },
-                    ]}
-                  />
-                </TableCell>
-              </TableRow>
-            ))}
-          </TableBody>
-        </Table>
-      </Paper>
-    );
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Caso de uso principal: un `ActionMenu` por cada fila de una tabla. Reemplaza exactamente el patrón `DropDownActions` + `react-bootstrap Dropdown` usado hoy en Afiliaciones.',
-      },
-    },
-  },
-};
-
-export const DisabledTrigger: Story = {
-  args: {
-    disabled: true,
-    items: [
-      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
-      { label: 'Eliminar', icon: <DeleteIcon fontSize="small" />, onClick: fn(), danger: true },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Cuando el row o la acción no tiene permisos, se puede deshabilitar el trigger entero pasando `disabled`.',
-      },
-    },
-  },
-};