@soyfri/shared-library 2.0.0-beta.25 → 2.0.0-beta.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/{Modal-BRZMPwDj.js → Modal-BFpX5AFV.js} +4 -5
  2. package/{Modal-BRZMPwDj.js.map → Modal-BFpX5AFV.js.map} +1 -1
  3. package/{Modal-BN5s-Tfk.cjs → Modal-CkpuI8ns.cjs} +1 -2
  4. package/{Modal-BN5s-Tfk.cjs.map → Modal-CkpuI8ns.cjs.map} +1 -1
  5. package/{Select-kqR48jZU.cjs → Select-CmxXLeJZ.cjs} +93 -14
  6. package/Select-CmxXLeJZ.cjs.map +1 -0
  7. package/{Select-Dycmh9vt.js → Select-DRLcIE7M.js} +95 -16
  8. package/Select-DRLcIE7M.js.map +1 -0
  9. package/components/Modal/Modal.cjs +2 -2
  10. package/components/Modal/Modal.js +6 -6
  11. package/components/Modal/index.d.ts +1 -2
  12. package/components/Select/Select.cjs +1 -1
  13. package/components/Select/Select.d.ts +21 -1
  14. package/components/Select/Select.js +1 -1
  15. package/components/Select/index.d.ts +1 -1
  16. package/index.cjs +3 -3
  17. package/index.js +6 -6
  18. package/package.json +1 -1
  19. package/Select-Dycmh9vt.js.map +0 -1
  20. package/Select-kqR48jZU.cjs.map +0 -1
package/{Modal-BRZMPwDj.js → Modal-BFpX5AFV.js} RENAMED
@@ -340,9 +340,8 @@ ModalWithStatics.Body = ModalBody;
340
340
  ModalWithStatics.Footer = ModalFooter;
341
341
  export {
342
342
  ModalWithStatics as M,
343
- Modal as a,
344
- ModalHeader as b,
345
- ModalBody as c,
346
- ModalFooter as d
343
+ ModalHeader as a,
344
+ ModalBody as b,
345
+ ModalFooter as c
347
346
  };
348
- //# sourceMappingURL=Modal-BRZMPwDj.js.map
347
+ //# sourceMappingURL=Modal-BFpX5AFV.js.map
package/{Modal-BRZMPwDj.js.map → Modal-BFpX5AFV.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"Modal-BRZMPwDj.js","sources":["../src/components/Modal/ModalFooter.tsx","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Stack } from '@mui/material';\nimport type { ButtonProps as MuiButtonProps } from '@mui/material/Button';\n\nimport { Button } from '../Button';\n\n// Interfaz para acciones personalizadas (se mantiene aquí)\nexport interface ModalAction {\n text: string;\n onClick?: () => void;\n disabled?: boolean;\n variant?: MuiButtonProps['variant'];\n color?: MuiButtonProps['color'];\n /**\n * Props adicionales que se forwardean al `<Button>` interno. Útil para casos\n * avanzados como conectar el botón con un `<form id=\"...\">` externo usando\n * `buttonProps={{ type: 'submit', form: 'my-form-id' }}`.\n */\n buttonProps?: Partial<MuiButtonProps> & { form?: string };\n}\n\nexport interface ModalFooterProps {\n children?: React.ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n onClose: () => void;\n actions?: ModalAction[];\n}\n\nexport const ModalFooter: React.FC<ModalFooterProps> = ({\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n onClose,\n actions = [],\n}) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderTop: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n justifyContent: 'flex-end',\n gap: 1,\n }}\n >\n {children}\n <Stack direction=\"row\" spacing={1}>\n {showCloseButton && (\n <Button\n onClick={onClose}\n disabled={closeButtonDisabled}\n variant=\"outlined\"\n color=\"secondary\"\n >\n {closeButtonText}\n </Button>\n )}\n {actions.map((action) => {\n const { buttonProps, text, onClick, disabled, variant, color } = action;\n return (\n <Button\n key={text}\n onClick={onClick}\n disabled={disabled}\n variant={variant || 'contained'}\n color={color || 'primary'}\n {...(buttonProps as any)}\n >\n {text}\n </Button>\n );\n })}\n </Stack>\n </Box>\n );\n};\n\nModalFooter.displayName = 'ModalFooter';\n\nexport default ModalFooter;\n","import React from 'react';\nimport { Box, Typography } from '@mui/material';\n\nexport interface ModalHeaderProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-labelledby` del Modal. Se setea\n * automáticamente cuando el header se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalHeader: React.FC<ModalHeaderProps> = ({ children, id }) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <Typography id={id} variant=\"h6\" component=\"h2\">\n {children}\n </Typography>\n </Box>\n );\n};\n\nModalHeader.displayName = 'ModalHeader';\n\nexport default ModalHeader;\n","import React from 'react';\nimport { Box } from '@mui/material';\n\nexport interface ModalBodyProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-describedby` del Modal. Se setea\n * automáticamente cuando el body se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalBody: React.FC<ModalBodyProps> = ({ children, id }) => {\n return (\n <Box id={id} sx={{ padding: 2, overflowY: 'auto', flexGrow: 1 }}>\n {children}\n </Box>\n );\n};\n\nModalBody.displayName = 'ModalBody';\n\nexport default ModalBody;\n","import {\n Children,\n cloneElement,\n forwardRef,\n isValidElement,\n useId,\n useImperativeHandle,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n Modal as MuiModal,\n Paper,\n useMediaQuery,\n useTheme,\n Box,\n Stack,\n Typography,\n} from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\nimport WarningAmberIcon from '@mui/icons-material/WarningAmber';\nimport ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';\nimport CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';\n\nimport type { DialogProps } from '@mui/material/Dialog';\nimport { ModalFooter, type ModalAction, type ModalFooterProps } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { mergeSx } from '../_shared/mergeSx';\n\n// Detección robusta de sub-componentes — funciona con wrappers / HMR que\n// rompen la igualdad de referencia (`child.type === ModalHeader`).\nconst isModalSlot = (\n child: ReactElement,\n Component: unknown,\n displayName: string,\n): boolean => {\n if (child.type === Component) return true;\n const type = child.type as { displayName?: string };\n return type?.displayName === displayName;\n};\n\n// Define la interfaz para los métodos que el padre puede llamar a través de la ref\nexport interface ModalRef {\n open: () => void;\n close: () => void;\n}\n\nexport type ModalMode = 'default' | 'confirm';\nexport type ModalSeverity = 'info' | 'warning' | 'error' | 'success';\n\nexport interface ModalProps {\n /**\n * Modo del modal.\n * - `default` (default): modal genérico con slots `Header`/`Body`/`Footer` y\n * `actions` custom.\n * - `confirm`: reemplaza al `ConfirmModal` legacy. Renderiza un layout\n * focalizado con icono por severidad, mensaje y botones \"Cancelar\" /\n * \"Confirmar\".\n */\n mode?: ModalMode;\n\n // ── Props comunes ────────────────────────────────────────────────────\n /** Controlado externamente. Omitir si se usa vía ref. */\n open?: boolean;\n /** Callback al cerrar. También se dispara al confirmar/cancelar. */\n onClose?: () => void;\n title?: string;\n children?: ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n actions?: ModalAction[];\n maxWidth?: DialogProps['maxWidth'];\n /** Oculta el header (incluso si hay `title` o se pasa un `<Modal.Header>`). */\n hiddenHeader?: boolean;\n /** Oculta el body (incluso si se pasa un `<Modal.Body>`). */\n hiddenBody?: boolean;\n /** Oculta el footer (incluso si se pasa un `<Modal.Footer>` o `actions`). */\n hiddenFooter?: boolean;\n /** sx del Modal root (MuiModal). */\n sx?: SxProps<Theme>;\n /** sx del Paper interno (contenedor visual). Se mergea sobre el default. */\n paperSx?: SxProps<Theme>;\n /** className del Paper interno. */\n className?: string;\n\n // ── Props del modo confirm ───────────────────────────────────────────\n /**\n * Callback de confirmación. Soporta promesa — si devuelve `Promise`, el\n * botón muestra estado `disabled` mientras resuelve.\n *\n * Si la promesa **rechaza**, el modal queda abierto para que el consumer\n * pueda mostrar el error en su UI. El modal se cierra solo en éxito.\n */\n onConfirm?: () => void | Promise<void>;\n /** Texto del botón primario en modo `confirm`. Default: \"Confirmar\". */\n confirmText?: string;\n /** Deshabilita el botón de confirmar. */\n confirmDisabled?: boolean;\n /**\n * Severidad visual en modo `confirm`. Controla el icono y el color del\n * botón de confirmación.\n * - `info` (default): primary\n * - `warning`: warning (amarillo)\n * - `error`: error (rojo) — típico para \"Eliminar\"\n * - `success`: success (verde) — típico para \"Aprobar\"\n */\n severity?: ModalSeverity;\n /**\n * Mensaje del confirm. Puede ser string o cualquier ReactNode. Si se omite,\n * se usa `children`.\n */\n confirmMessage?: ReactNode;\n}\n\nconst modalStyle = {\n position: 'absolute' as const,\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '90%',\n maxHeight: '90vh',\n display: 'flex',\n flexDirection: 'column' as const,\n outline: 'none',\n};\n\nconst severityConfig: Record<\n ModalSeverity,\n { color: ModalAction['color']; icon: ReactNode; paletteKey: 'primary' | 'warning' | 'error' | 'success' }\n> = {\n info: {\n color: 'primary',\n icon: <InfoOutlinedIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'primary',\n },\n warning: {\n color: 'warning',\n icon: <WarningAmberIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'warning',\n },\n error: {\n color: 'error',\n icon: <ErrorOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'error',\n },\n success: {\n color: 'success',\n icon: <CheckCircleOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'success',\n },\n};\n\nexport const Modal = forwardRef<ModalRef, ModalProps>(\n (\n {\n mode = 'default',\n open: controlledOpen,\n onClose: controlledOnClose,\n title,\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n actions = [],\n maxWidth = 'sm',\n hiddenHeader = false,\n hiddenBody = false,\n hiddenFooter = false,\n sx,\n paperSx,\n className,\n\n // Props del modo confirm\n onConfirm,\n confirmText = 'Confirmar',\n confirmDisabled = false,\n severity = 'info',\n confirmMessage,\n },\n ref,\n ) => {\n const [internalOpen, setInternalOpen] = useState(false);\n const [confirmLoading, setConfirmLoading] = useState(false);\n\n // IDs estables para a11y: `aria-labelledby` y `aria-describedby`.\n const titleId = useId();\n const descId = useId();\n\n const isOpen = controlledOpen !== undefined ? controlledOpen : internalOpen;\n\n useImperativeHandle(ref, () => ({\n open: () => setInternalOpen(true),\n close: () => {\n setInternalOpen(false);\n controlledOnClose?.();\n },\n }));\n\n const handleCloseInternal = () => {\n setInternalOpen(false);\n controlledOnClose?.();\n };\n\n const handleConfirm = async () => {\n if (!onConfirm) {\n handleCloseInternal();\n return;\n }\n const result = onConfirm();\n if (!(result instanceof Promise)) {\n handleCloseInternal();\n return;\n }\n setConfirmLoading(true);\n try {\n await result;\n handleCloseInternal();\n } catch (err) {\n // No cerrar el modal en caso de error — el consumer es responsable\n // de mostrar un estado de error en su UI. Logueamos para trazabilidad\n // en dev.\n // eslint-disable-next-line no-console\n console.error('Modal onConfirm failed:', err);\n } finally {\n setConfirmLoading(false);\n }\n };\n\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('sm'));\n\n const getWidth = () => {\n if (isMobile) return '95%';\n switch (maxWidth) {\n case 'xs':\n return 300;\n case 'sm':\n return 500;\n case 'md':\n return 700;\n case 'lg':\n return 900;\n case 'xl':\n return 1100;\n case false:\n return 'auto';\n default:\n // Soporta string custom: `maxWidth=\"600px\"` se pasa tal cual.\n return typeof maxWidth === 'string' ? maxWidth : 500;\n }\n };\n\n // Base sx del Paper + width responsive; el consumer puede pisarlos via `paperSx`.\n const paperBaseSx: SxProps<Theme> = { ...modalStyle, width: getWidth() };\n const mergedPaperSx = mergeSx(paperBaseSx, paperSx);\n\n // ── Render modo CONFIRM ─────────────────────────────────────────────\n if (mode === 'confirm') {\n const config = severityConfig[severity];\n const message = confirmMessage ?? children;\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={title ? titleId : undefined}\n aria-describedby={message ? descId : undefined}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n <Stack spacing={2.5} sx={{ p: 3, alignItems: 'center', textAlign: 'center' }}>\n <Box\n sx={{\n width: 72,\n height: 72,\n borderRadius: '50%',\n backgroundColor: (t) => t.palette[config.paletteKey].light,\n color: (t) => t.palette[config.paletteKey].dark,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n opacity: 0.9,\n }}\n >\n {config.icon}\n </Box>\n {title && (\n <Typography id={titleId} variant=\"h6\" component=\"h2\" sx={{ fontWeight: 700 }}>\n {title}\n </Typography>\n )}\n {message && (\n <Typography id={descId} variant=\"body2\" color=\"text.secondary\">\n {message}\n </Typography>\n )}\n </Stack>\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled || confirmLoading}\n onClose={handleCloseInternal}\n actions={[\n {\n text: confirmText,\n onClick: handleConfirm,\n disabled: confirmDisabled || confirmLoading,\n variant: 'contained',\n color: config.color,\n },\n ]}\n />\n </Paper>\n </MuiModal>\n );\n }\n\n // ── Render modo DEFAULT (compuesto) ─────────────────────────────────\n const renderChildren = () => {\n let header: ReactNode | null = null;\n let body: ReactNode | null = null;\n let footer: ReactNode | null = null;\n\n Children.forEach(children, (child) => {\n if (!isValidElement(child)) return;\n\n if (isModalSlot(child, ModalHeader, 'ModalHeader')) {\n const headerChild = child as ReactElement<{ id?: string }>;\n header = cloneElement(headerChild, { id: titleId, ...headerChild.props });\n } else if (isModalSlot(child, ModalBody, 'ModalBody')) {\n const bodyChild = child as ReactElement<{ id?: string }>;\n body = cloneElement(bodyChild, { id: descId, ...bodyChild.props });\n } else if (isModalSlot(child, ModalFooter, 'ModalFooter')) {\n const footerChild = child as ReactElement<ModalFooterProps>;\n // Props del child ganan sobre los del Modal padre: si el consumer\n // declara `<Modal.Footer showCloseButton={false}>`, ese valor se\n // respeta. Solo los que vengan `undefined` caen al default del padre.\n const childProps = footerChild.props;\n footer = cloneElement(footerChild, {\n showCloseButton: childProps.showCloseButton ?? showCloseButton,\n closeButtonText: childProps.closeButtonText ?? closeButtonText,\n closeButtonDisabled: childProps.closeButtonDisabled ?? closeButtonDisabled,\n onClose: childProps.onClose ?? handleCloseInternal,\n actions: childProps.actions ?? actions,\n });\n }\n });\n\n if (!footer && !hiddenFooter) {\n footer = (\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled}\n onClose={handleCloseInternal}\n actions={actions}\n />\n );\n }\n\n return (\n <>\n {!hiddenHeader && (header || (title && <ModalHeader id={titleId}>{title}</ModalHeader>))}\n {!hiddenBody && body}\n {footer}\n </>\n );\n };\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={titleId}\n aria-describedby={descId}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n {renderChildren()}\n </Paper>\n </MuiModal>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\n// Define los sub-componentes como propiedades estáticas con tipos explícitos\ntype ModalComponent = ReturnType<typeof forwardRef<ModalRef, ModalProps>> & {\n Header: typeof ModalHeader;\n Body: typeof ModalBody;\n Footer: typeof ModalFooter;\n};\n\nconst ModalWithStatics = Modal as ModalComponent;\n\nModalWithStatics.Header = ModalHeader;\nModalWithStatics.Body = ModalBody;\nModalWithStatics.Footer = ModalFooter;\n\nexport default ModalWithStatics;\n"],"names":["MuiModal"],"mappings":"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"}
1
+ {"version":3,"file":"Modal-BFpX5AFV.js","sources":["../src/components/Modal/ModalFooter.tsx","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Stack } from '@mui/material';\nimport type { ButtonProps as MuiButtonProps } from '@mui/material/Button';\n\nimport { Button } from '../Button';\n\n// Interfaz para acciones personalizadas (se mantiene aquí)\nexport interface ModalAction {\n text: string;\n onClick?: () => void;\n disabled?: boolean;\n variant?: MuiButtonProps['variant'];\n color?: MuiButtonProps['color'];\n /**\n * Props adicionales que se forwardean al `<Button>` interno. Útil para casos\n * avanzados como conectar el botón con un `<form id=\"...\">` externo usando\n * `buttonProps={{ type: 'submit', form: 'my-form-id' }}`.\n */\n buttonProps?: Partial<MuiButtonProps> & { form?: string };\n}\n\nexport interface ModalFooterProps {\n children?: React.ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n onClose: () => void;\n actions?: ModalAction[];\n}\n\nexport const ModalFooter: React.FC<ModalFooterProps> = ({\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n onClose,\n actions = [],\n}) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderTop: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n justifyContent: 'flex-end',\n gap: 1,\n }}\n >\n {children}\n <Stack direction=\"row\" spacing={1}>\n {showCloseButton && (\n <Button\n onClick={onClose}\n disabled={closeButtonDisabled}\n variant=\"outlined\"\n color=\"secondary\"\n >\n {closeButtonText}\n </Button>\n )}\n {actions.map((action) => {\n const { buttonProps, text, onClick, disabled, variant, color } = action;\n return (\n <Button\n key={text}\n onClick={onClick}\n disabled={disabled}\n variant={variant || 'contained'}\n color={color || 'primary'}\n {...(buttonProps as any)}\n >\n {text}\n </Button>\n );\n })}\n </Stack>\n </Box>\n );\n};\n\nModalFooter.displayName = 'ModalFooter';\n\nexport default ModalFooter;\n","import React from 'react';\nimport { Box, Typography } from '@mui/material';\n\nexport interface ModalHeaderProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-labelledby` del Modal. Se setea\n * automáticamente cuando el header se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalHeader: React.FC<ModalHeaderProps> = ({ children, id }) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <Typography id={id} variant=\"h6\" component=\"h2\">\n {children}\n </Typography>\n </Box>\n );\n};\n\nModalHeader.displayName = 'ModalHeader';\n\nexport default ModalHeader;\n","import React from 'react';\nimport { Box } from '@mui/material';\n\nexport interface ModalBodyProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-describedby` del Modal. Se setea\n * automáticamente cuando el body se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalBody: React.FC<ModalBodyProps> = ({ children, id }) => {\n return (\n <Box id={id} sx={{ padding: 2, overflowY: 'auto', flexGrow: 1 }}>\n {children}\n </Box>\n );\n};\n\nModalBody.displayName = 'ModalBody';\n\nexport default ModalBody;\n","import {\n Children,\n cloneElement,\n forwardRef,\n isValidElement,\n useId,\n useImperativeHandle,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n Modal as MuiModal,\n Paper,\n useMediaQuery,\n useTheme,\n Box,\n Stack,\n Typography,\n} from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\nimport WarningAmberIcon from '@mui/icons-material/WarningAmber';\nimport ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';\nimport CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';\n\nimport type { DialogProps } from '@mui/material/Dialog';\nimport { ModalFooter, type ModalAction, type ModalFooterProps } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { mergeSx } from '../_shared/mergeSx';\n\n// Detección robusta de sub-componentes — funciona con wrappers / HMR que\n// rompen la igualdad de referencia (`child.type === ModalHeader`).\nconst isModalSlot = (\n child: ReactElement,\n Component: unknown,\n displayName: string,\n): boolean => {\n if (child.type === Component) return true;\n const type = child.type as { displayName?: string };\n return type?.displayName === displayName;\n};\n\n// Define la interfaz para los métodos que el padre puede llamar a través de la ref\nexport interface ModalRef {\n open: () => void;\n close: () => void;\n}\n\nexport type ModalMode = 'default' | 'confirm';\nexport type ModalSeverity = 'info' | 'warning' | 'error' | 'success';\n\nexport interface ModalProps {\n /**\n * Modo del modal.\n * - `default` (default): modal genérico con slots `Header`/`Body`/`Footer` y\n * `actions` custom.\n * - `confirm`: reemplaza al `ConfirmModal` legacy. Renderiza un layout\n * focalizado con icono por severidad, mensaje y botones \"Cancelar\" /\n * \"Confirmar\".\n */\n mode?: ModalMode;\n\n // ── Props comunes ────────────────────────────────────────────────────\n /** Controlado externamente. Omitir si se usa vía ref. */\n open?: boolean;\n /** Callback al cerrar. También se dispara al confirmar/cancelar. */\n onClose?: () => void;\n title?: string;\n children?: ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n actions?: ModalAction[];\n maxWidth?: DialogProps['maxWidth'];\n /** Oculta el header (incluso si hay `title` o se pasa un `<Modal.Header>`). */\n hiddenHeader?: boolean;\n /** Oculta el body (incluso si se pasa un `<Modal.Body>`). */\n hiddenBody?: boolean;\n /** Oculta el footer (incluso si se pasa un `<Modal.Footer>` o `actions`). */\n hiddenFooter?: boolean;\n /** sx del Modal root (MuiModal). */\n sx?: SxProps<Theme>;\n /** sx del Paper interno (contenedor visual). Se mergea sobre el default. */\n paperSx?: SxProps<Theme>;\n /** className del Paper interno. */\n className?: string;\n\n // ── Props del modo confirm ───────────────────────────────────────────\n /**\n * Callback de confirmación. Soporta promesa — si devuelve `Promise`, el\n * botón muestra estado `disabled` mientras resuelve.\n *\n * Si la promesa **rechaza**, el modal queda abierto para que el consumer\n * pueda mostrar el error en su UI. El modal se cierra solo en éxito.\n */\n onConfirm?: () => void | Promise<void>;\n /** Texto del botón primario en modo `confirm`. Default: \"Confirmar\". */\n confirmText?: string;\n /** Deshabilita el botón de confirmar. */\n confirmDisabled?: boolean;\n /**\n * Severidad visual en modo `confirm`. Controla el icono y el color del\n * botón de confirmación.\n * - `info` (default): primary\n * - `warning`: warning (amarillo)\n * - `error`: error (rojo) — típico para \"Eliminar\"\n * - `success`: success (verde) — típico para \"Aprobar\"\n */\n severity?: ModalSeverity;\n /**\n * Mensaje del confirm. Puede ser string o cualquier ReactNode. Si se omite,\n * se usa `children`.\n */\n confirmMessage?: ReactNode;\n}\n\nconst modalStyle = {\n position: 'absolute' as const,\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '90%',\n maxHeight: '90vh',\n display: 'flex',\n flexDirection: 'column' as const,\n outline: 'none',\n};\n\nconst severityConfig: Record<\n ModalSeverity,\n { color: ModalAction['color']; icon: ReactNode; paletteKey: 'primary' | 'warning' | 'error' | 'success' }\n> = {\n info: {\n color: 'primary',\n icon: <InfoOutlinedIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'primary',\n },\n warning: {\n color: 'warning',\n icon: <WarningAmberIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'warning',\n },\n error: {\n color: 'error',\n icon: <ErrorOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'error',\n },\n success: {\n color: 'success',\n icon: <CheckCircleOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'success',\n },\n};\n\nexport const Modal = forwardRef<ModalRef, ModalProps>(\n (\n {\n mode = 'default',\n open: controlledOpen,\n onClose: controlledOnClose,\n title,\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n actions = [],\n maxWidth = 'sm',\n hiddenHeader = false,\n hiddenBody = false,\n hiddenFooter = false,\n sx,\n paperSx,\n className,\n\n // Props del modo confirm\n onConfirm,\n confirmText = 'Confirmar',\n confirmDisabled = false,\n severity = 'info',\n confirmMessage,\n },\n ref,\n ) => {\n const [internalOpen, setInternalOpen] = useState(false);\n const [confirmLoading, setConfirmLoading] = useState(false);\n\n // IDs estables para a11y: `aria-labelledby` y `aria-describedby`.\n const titleId = useId();\n const descId = useId();\n\n const isOpen = controlledOpen !== undefined ? controlledOpen : internalOpen;\n\n useImperativeHandle(ref, () => ({\n open: () => setInternalOpen(true),\n close: () => {\n setInternalOpen(false);\n controlledOnClose?.();\n },\n }));\n\n const handleCloseInternal = () => {\n setInternalOpen(false);\n controlledOnClose?.();\n };\n\n const handleConfirm = async () => {\n if (!onConfirm) {\n handleCloseInternal();\n return;\n }\n const result = onConfirm();\n if (!(result instanceof Promise)) {\n handleCloseInternal();\n return;\n }\n setConfirmLoading(true);\n try {\n await result;\n handleCloseInternal();\n } catch (err) {\n // No cerrar el modal en caso de error — el consumer es responsable\n // de mostrar un estado de error en su UI. Logueamos para trazabilidad\n // en dev.\n // eslint-disable-next-line no-console\n console.error('Modal onConfirm failed:', err);\n } finally {\n setConfirmLoading(false);\n }\n };\n\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('sm'));\n\n const getWidth = () => {\n if (isMobile) return '95%';\n switch (maxWidth) {\n case 'xs':\n return 300;\n case 'sm':\n return 500;\n case 'md':\n return 700;\n case 'lg':\n return 900;\n case 'xl':\n return 1100;\n case false:\n return 'auto';\n default:\n // Soporta string custom: `maxWidth=\"600px\"` se pasa tal cual.\n return typeof maxWidth === 'string' ? maxWidth : 500;\n }\n };\n\n // Base sx del Paper + width responsive; el consumer puede pisarlos via `paperSx`.\n const paperBaseSx: SxProps<Theme> = { ...modalStyle, width: getWidth() };\n const mergedPaperSx = mergeSx(paperBaseSx, paperSx);\n\n // ── Render modo CONFIRM ─────────────────────────────────────────────\n if (mode === 'confirm') {\n const config = severityConfig[severity];\n const message = confirmMessage ?? children;\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={title ? titleId : undefined}\n aria-describedby={message ? descId : undefined}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n <Stack spacing={2.5} sx={{ p: 3, alignItems: 'center', textAlign: 'center' }}>\n <Box\n sx={{\n width: 72,\n height: 72,\n borderRadius: '50%',\n backgroundColor: (t) => t.palette[config.paletteKey].light,\n color: (t) => t.palette[config.paletteKey].dark,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n opacity: 0.9,\n }}\n >\n {config.icon}\n </Box>\n {title && (\n <Typography id={titleId} variant=\"h6\" component=\"h2\" sx={{ fontWeight: 700 }}>\n {title}\n </Typography>\n )}\n {message && (\n <Typography id={descId} variant=\"body2\" color=\"text.secondary\">\n {message}\n </Typography>\n )}\n </Stack>\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled || confirmLoading}\n onClose={handleCloseInternal}\n actions={[\n {\n text: confirmText,\n onClick: handleConfirm,\n disabled: confirmDisabled || confirmLoading,\n variant: 'contained',\n color: config.color,\n },\n ]}\n />\n </Paper>\n </MuiModal>\n );\n }\n\n // ── Render modo DEFAULT (compuesto) ─────────────────────────────────\n const renderChildren = () => {\n let header: ReactNode | null = null;\n let body: ReactNode | null = null;\n let footer: ReactNode | null = null;\n\n Children.forEach(children, (child) => {\n if (!isValidElement(child)) return;\n\n if (isModalSlot(child, ModalHeader, 'ModalHeader')) {\n const headerChild = child as ReactElement<{ id?: string }>;\n header = cloneElement(headerChild, { id: titleId, ...headerChild.props });\n } else if (isModalSlot(child, ModalBody, 'ModalBody')) {\n const bodyChild = child as ReactElement<{ id?: string }>;\n body = cloneElement(bodyChild, { id: descId, ...bodyChild.props });\n } else if (isModalSlot(child, ModalFooter, 'ModalFooter')) {\n const footerChild = child as ReactElement<ModalFooterProps>;\n // Props del child ganan sobre los del Modal padre: si el consumer\n // declara `<Modal.Footer showCloseButton={false}>`, ese valor se\n // respeta. Solo los que vengan `undefined` caen al default del padre.\n const childProps = footerChild.props;\n footer = cloneElement(footerChild, {\n showCloseButton: childProps.showCloseButton ?? showCloseButton,\n closeButtonText: childProps.closeButtonText ?? closeButtonText,\n closeButtonDisabled: childProps.closeButtonDisabled ?? closeButtonDisabled,\n onClose: childProps.onClose ?? handleCloseInternal,\n actions: childProps.actions ?? actions,\n });\n }\n });\n\n if (!footer && !hiddenFooter) {\n footer = (\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled}\n onClose={handleCloseInternal}\n actions={actions}\n />\n );\n }\n\n return (\n <>\n {!hiddenHeader && (header || (title && <ModalHeader id={titleId}>{title}</ModalHeader>))}\n {!hiddenBody && body}\n {footer}\n </>\n );\n };\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={titleId}\n aria-describedby={descId}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n {renderChildren()}\n </Paper>\n </MuiModal>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\n// Define los sub-componentes como propiedades estáticas con tipos explícitos\ntype ModalComponent = ReturnType<typeof forwardRef<ModalRef, ModalProps>> & {\n Header: typeof ModalHeader;\n Body: typeof ModalBody;\n Footer: typeof ModalFooter;\n};\n\nconst ModalWithStatics = Modal as ModalComponent;\n\nModalWithStatics.Header = ModalHeader;\nModalWithStatics.Body = ModalBody;\nModalWithStatics.Footer = ModalFooter;\n\nexport default ModalWithStatics;\n"],"names":["MuiModal"],"mappings":"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"}
package/{Modal-BN5s-Tfk.cjs → Modal-CkpuI8ns.cjs} RENAMED
@@ -339,9 +339,8 @@ const ModalWithStatics = Modal;
339
339
  ModalWithStatics.Header = ModalHeader;
340
340
  ModalWithStatics.Body = ModalBody;
341
341
  ModalWithStatics.Footer = ModalFooter;
342
- exports.Modal = Modal;
343
342
  exports.ModalBody = ModalBody;
344
343
  exports.ModalFooter = ModalFooter;
345
344
  exports.ModalHeader = ModalHeader;
346
345
  exports.ModalWithStatics = ModalWithStatics;
347
- //# sourceMappingURL=Modal-BN5s-Tfk.cjs.map
346
+ //# sourceMappingURL=Modal-CkpuI8ns.cjs.map
package/{Modal-BN5s-Tfk.cjs.map → Modal-CkpuI8ns.cjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"Modal-BN5s-Tfk.cjs","sources":["../src/components/Modal/ModalFooter.tsx","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Stack } from '@mui/material';\nimport type { ButtonProps as MuiButtonProps } from '@mui/material/Button';\n\nimport { Button } from '../Button';\n\n// Interfaz para acciones personalizadas (se mantiene aquí)\nexport interface ModalAction {\n text: string;\n onClick?: () => void;\n disabled?: boolean;\n variant?: MuiButtonProps['variant'];\n color?: MuiButtonProps['color'];\n /**\n * Props adicionales que se forwardean al `<Button>` interno. Útil para casos\n * avanzados como conectar el botón con un `<form id=\"...\">` externo usando\n * `buttonProps={{ type: 'submit', form: 'my-form-id' }}`.\n */\n buttonProps?: Partial<MuiButtonProps> & { form?: string };\n}\n\nexport interface ModalFooterProps {\n children?: React.ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n onClose: () => void;\n actions?: ModalAction[];\n}\n\nexport const ModalFooter: React.FC<ModalFooterProps> = ({\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n onClose,\n actions = [],\n}) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderTop: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n justifyContent: 'flex-end',\n gap: 1,\n }}\n >\n {children}\n <Stack direction=\"row\" spacing={1}>\n {showCloseButton && (\n <Button\n onClick={onClose}\n disabled={closeButtonDisabled}\n variant=\"outlined\"\n color=\"secondary\"\n >\n {closeButtonText}\n </Button>\n )}\n {actions.map((action) => {\n const { buttonProps, text, onClick, disabled, variant, color } = action;\n return (\n <Button\n key={text}\n onClick={onClick}\n disabled={disabled}\n variant={variant || 'contained'}\n color={color || 'primary'}\n {...(buttonProps as any)}\n >\n {text}\n </Button>\n );\n })}\n </Stack>\n </Box>\n );\n};\n\nModalFooter.displayName = 'ModalFooter';\n\nexport default ModalFooter;\n","import React from 'react';\nimport { Box, Typography } from '@mui/material';\n\nexport interface ModalHeaderProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-labelledby` del Modal. Se setea\n * automáticamente cuando el header se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalHeader: React.FC<ModalHeaderProps> = ({ children, id }) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <Typography id={id} variant=\"h6\" component=\"h2\">\n {children}\n </Typography>\n </Box>\n );\n};\n\nModalHeader.displayName = 'ModalHeader';\n\nexport default ModalHeader;\n","import React from 'react';\nimport { Box } from '@mui/material';\n\nexport interface ModalBodyProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-describedby` del Modal. Se setea\n * automáticamente cuando el body se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalBody: React.FC<ModalBodyProps> = ({ children, id }) => {\n return (\n <Box id={id} sx={{ padding: 2, overflowY: 'auto', flexGrow: 1 }}>\n {children}\n </Box>\n );\n};\n\nModalBody.displayName = 'ModalBody';\n\nexport default ModalBody;\n","import {\n Children,\n cloneElement,\n forwardRef,\n isValidElement,\n useId,\n useImperativeHandle,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n Modal as MuiModal,\n Paper,\n useMediaQuery,\n useTheme,\n Box,\n Stack,\n Typography,\n} from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\nimport WarningAmberIcon from '@mui/icons-material/WarningAmber';\nimport ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';\nimport CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';\n\nimport type { DialogProps } from '@mui/material/Dialog';\nimport { ModalFooter, type ModalAction, type ModalFooterProps } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { mergeSx } from '../_shared/mergeSx';\n\n// Detección robusta de sub-componentes — funciona con wrappers / HMR que\n// rompen la igualdad de referencia (`child.type === ModalHeader`).\nconst isModalSlot = (\n child: ReactElement,\n Component: unknown,\n displayName: string,\n): boolean => {\n if (child.type === Component) return true;\n const type = child.type as { displayName?: string };\n return type?.displayName === displayName;\n};\n\n// Define la interfaz para los métodos que el padre puede llamar a través de la ref\nexport interface ModalRef {\n open: () => void;\n close: () => void;\n}\n\nexport type ModalMode = 'default' | 'confirm';\nexport type ModalSeverity = 'info' | 'warning' | 'error' | 'success';\n\nexport interface ModalProps {\n /**\n * Modo del modal.\n * - `default` (default): modal genérico con slots `Header`/`Body`/`Footer` y\n * `actions` custom.\n * - `confirm`: reemplaza al `ConfirmModal` legacy. Renderiza un layout\n * focalizado con icono por severidad, mensaje y botones \"Cancelar\" /\n * \"Confirmar\".\n */\n mode?: ModalMode;\n\n // ── Props comunes ────────────────────────────────────────────────────\n /** Controlado externamente. Omitir si se usa vía ref. */\n open?: boolean;\n /** Callback al cerrar. También se dispara al confirmar/cancelar. */\n onClose?: () => void;\n title?: string;\n children?: ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n actions?: ModalAction[];\n maxWidth?: DialogProps['maxWidth'];\n /** Oculta el header (incluso si hay `title` o se pasa un `<Modal.Header>`). */\n hiddenHeader?: boolean;\n /** Oculta el body (incluso si se pasa un `<Modal.Body>`). */\n hiddenBody?: boolean;\n /** Oculta el footer (incluso si se pasa un `<Modal.Footer>` o `actions`). */\n hiddenFooter?: boolean;\n /** sx del Modal root (MuiModal). */\n sx?: SxProps<Theme>;\n /** sx del Paper interno (contenedor visual). Se mergea sobre el default. */\n paperSx?: SxProps<Theme>;\n /** className del Paper interno. */\n className?: string;\n\n // ── Props del modo confirm ───────────────────────────────────────────\n /**\n * Callback de confirmación. Soporta promesa — si devuelve `Promise`, el\n * botón muestra estado `disabled` mientras resuelve.\n *\n * Si la promesa **rechaza**, el modal queda abierto para que el consumer\n * pueda mostrar el error en su UI. El modal se cierra solo en éxito.\n */\n onConfirm?: () => void | Promise<void>;\n /** Texto del botón primario en modo `confirm`. Default: \"Confirmar\". */\n confirmText?: string;\n /** Deshabilita el botón de confirmar. */\n confirmDisabled?: boolean;\n /**\n * Severidad visual en modo `confirm`. Controla el icono y el color del\n * botón de confirmación.\n * - `info` (default): primary\n * - `warning`: warning (amarillo)\n * - `error`: error (rojo) — típico para \"Eliminar\"\n * - `success`: success (verde) — típico para \"Aprobar\"\n */\n severity?: ModalSeverity;\n /**\n * Mensaje del confirm. Puede ser string o cualquier ReactNode. Si se omite,\n * se usa `children`.\n */\n confirmMessage?: ReactNode;\n}\n\nconst modalStyle = {\n position: 'absolute' as const,\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '90%',\n maxHeight: '90vh',\n display: 'flex',\n flexDirection: 'column' as const,\n outline: 'none',\n};\n\nconst severityConfig: Record<\n ModalSeverity,\n { color: ModalAction['color']; icon: ReactNode; paletteKey: 'primary' | 'warning' | 'error' | 'success' }\n> = {\n info: {\n color: 'primary',\n icon: <InfoOutlinedIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'primary',\n },\n warning: {\n color: 'warning',\n icon: <WarningAmberIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'warning',\n },\n error: {\n color: 'error',\n icon: <ErrorOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'error',\n },\n success: {\n color: 'success',\n icon: <CheckCircleOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'success',\n },\n};\n\nexport const Modal = forwardRef<ModalRef, ModalProps>(\n (\n {\n mode = 'default',\n open: controlledOpen,\n onClose: controlledOnClose,\n title,\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n actions = [],\n maxWidth = 'sm',\n hiddenHeader = false,\n hiddenBody = false,\n hiddenFooter = false,\n sx,\n paperSx,\n className,\n\n // Props del modo confirm\n onConfirm,\n confirmText = 'Confirmar',\n confirmDisabled = false,\n severity = 'info',\n confirmMessage,\n },\n ref,\n ) => {\n const [internalOpen, setInternalOpen] = useState(false);\n const [confirmLoading, setConfirmLoading] = useState(false);\n\n // IDs estables para a11y: `aria-labelledby` y `aria-describedby`.\n const titleId = useId();\n const descId = useId();\n\n const isOpen = controlledOpen !== undefined ? controlledOpen : internalOpen;\n\n useImperativeHandle(ref, () => ({\n open: () => setInternalOpen(true),\n close: () => {\n setInternalOpen(false);\n controlledOnClose?.();\n },\n }));\n\n const handleCloseInternal = () => {\n setInternalOpen(false);\n controlledOnClose?.();\n };\n\n const handleConfirm = async () => {\n if (!onConfirm) {\n handleCloseInternal();\n return;\n }\n const result = onConfirm();\n if (!(result instanceof Promise)) {\n handleCloseInternal();\n return;\n }\n setConfirmLoading(true);\n try {\n await result;\n handleCloseInternal();\n } catch (err) {\n // No cerrar el modal en caso de error — el consumer es responsable\n // de mostrar un estado de error en su UI. Logueamos para trazabilidad\n // en dev.\n // eslint-disable-next-line no-console\n console.error('Modal onConfirm failed:', err);\n } finally {\n setConfirmLoading(false);\n }\n };\n\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('sm'));\n\n const getWidth = () => {\n if (isMobile) return '95%';\n switch (maxWidth) {\n case 'xs':\n return 300;\n case 'sm':\n return 500;\n case 'md':\n return 700;\n case 'lg':\n return 900;\n case 'xl':\n return 1100;\n case false:\n return 'auto';\n default:\n // Soporta string custom: `maxWidth=\"600px\"` se pasa tal cual.\n return typeof maxWidth === 'string' ? maxWidth : 500;\n }\n };\n\n // Base sx del Paper + width responsive; el consumer puede pisarlos via `paperSx`.\n const paperBaseSx: SxProps<Theme> = { ...modalStyle, width: getWidth() };\n const mergedPaperSx = mergeSx(paperBaseSx, paperSx);\n\n // ── Render modo CONFIRM ─────────────────────────────────────────────\n if (mode === 'confirm') {\n const config = severityConfig[severity];\n const message = confirmMessage ?? children;\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={title ? titleId : undefined}\n aria-describedby={message ? descId : undefined}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n <Stack spacing={2.5} sx={{ p: 3, alignItems: 'center', textAlign: 'center' }}>\n <Box\n sx={{\n width: 72,\n height: 72,\n borderRadius: '50%',\n backgroundColor: (t) => t.palette[config.paletteKey].light,\n color: (t) => t.palette[config.paletteKey].dark,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n opacity: 0.9,\n }}\n >\n {config.icon}\n </Box>\n {title && (\n <Typography id={titleId} variant=\"h6\" component=\"h2\" sx={{ fontWeight: 700 }}>\n {title}\n </Typography>\n )}\n {message && (\n <Typography id={descId} variant=\"body2\" color=\"text.secondary\">\n {message}\n </Typography>\n )}\n </Stack>\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled || confirmLoading}\n onClose={handleCloseInternal}\n actions={[\n {\n text: confirmText,\n onClick: handleConfirm,\n disabled: confirmDisabled || confirmLoading,\n variant: 'contained',\n color: config.color,\n },\n ]}\n />\n </Paper>\n </MuiModal>\n );\n }\n\n // ── Render modo DEFAULT (compuesto) ─────────────────────────────────\n const renderChildren = () => {\n let header: ReactNode | null = null;\n let body: ReactNode | null = null;\n let footer: ReactNode | null = null;\n\n Children.forEach(children, (child) => {\n if (!isValidElement(child)) return;\n\n if (isModalSlot(child, ModalHeader, 'ModalHeader')) {\n const headerChild = child as ReactElement<{ id?: string }>;\n header = cloneElement(headerChild, { id: titleId, ...headerChild.props });\n } else if (isModalSlot(child, ModalBody, 'ModalBody')) {\n const bodyChild = child as ReactElement<{ id?: string }>;\n body = cloneElement(bodyChild, { id: descId, ...bodyChild.props });\n } else if (isModalSlot(child, ModalFooter, 'ModalFooter')) {\n const footerChild = child as ReactElement<ModalFooterProps>;\n // Props del child ganan sobre los del Modal padre: si el consumer\n // declara `<Modal.Footer showCloseButton={false}>`, ese valor se\n // respeta. Solo los que vengan `undefined` caen al default del padre.\n const childProps = footerChild.props;\n footer = cloneElement(footerChild, {\n showCloseButton: childProps.showCloseButton ?? showCloseButton,\n closeButtonText: childProps.closeButtonText ?? closeButtonText,\n closeButtonDisabled: childProps.closeButtonDisabled ?? closeButtonDisabled,\n onClose: childProps.onClose ?? handleCloseInternal,\n actions: childProps.actions ?? actions,\n });\n }\n });\n\n if (!footer && !hiddenFooter) {\n footer = (\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled}\n onClose={handleCloseInternal}\n actions={actions}\n />\n );\n }\n\n return (\n <>\n {!hiddenHeader && (header || (title && <ModalHeader id={titleId}>{title}</ModalHeader>))}\n {!hiddenBody && body}\n {footer}\n </>\n );\n };\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={titleId}\n aria-describedby={descId}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n {renderChildren()}\n </Paper>\n </MuiModal>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\n// Define los sub-componentes como propiedades estáticas con tipos explícitos\ntype ModalComponent = ReturnType<typeof forwardRef<ModalRef, ModalProps>> & {\n Header: typeof ModalHeader;\n Body: typeof ModalBody;\n Footer: typeof ModalFooter;\n};\n\nconst ModalWithStatics = Modal as ModalComponent;\n\nModalWithStatics.Header = ModalHeader;\nModalWithStatics.Body = ModalBody;\nModalWithStatics.Footer = ModalFooter;\n\nexport default ModalWithStatics;\n"],"names":["jsxs","Box","Stack","jsx","Button","Typography","forwardRef","useState","useId","useImperativeHandle","useTheme","useMediaQuery","mergeSx","MuiModal","Paper","Children","isValidElement","cloneElement","Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"Modal-CkpuI8ns.cjs","sources":["../src/components/Modal/ModalFooter.tsx","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Stack } from '@mui/material';\nimport type { ButtonProps as MuiButtonProps } from '@mui/material/Button';\n\nimport { Button } from '../Button';\n\n// Interfaz para acciones personalizadas (se mantiene aquí)\nexport interface ModalAction {\n text: string;\n onClick?: () => void;\n disabled?: boolean;\n variant?: MuiButtonProps['variant'];\n color?: MuiButtonProps['color'];\n /**\n * Props adicionales que se forwardean al `<Button>` interno. Útil para casos\n * avanzados como conectar el botón con un `<form id=\"...\">` externo usando\n * `buttonProps={{ type: 'submit', form: 'my-form-id' }}`.\n */\n buttonProps?: Partial<MuiButtonProps> & { form?: string };\n}\n\nexport interface ModalFooterProps {\n children?: React.ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n onClose: () => void;\n actions?: ModalAction[];\n}\n\nexport const ModalFooter: React.FC<ModalFooterProps> = ({\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n onClose,\n actions = [],\n}) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderTop: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n justifyContent: 'flex-end',\n gap: 1,\n }}\n >\n {children}\n <Stack direction=\"row\" spacing={1}>\n {showCloseButton && (\n <Button\n onClick={onClose}\n disabled={closeButtonDisabled}\n variant=\"outlined\"\n color=\"secondary\"\n >\n {closeButtonText}\n </Button>\n )}\n {actions.map((action) => {\n const { buttonProps, text, onClick, disabled, variant, color } = action;\n return (\n <Button\n key={text}\n onClick={onClick}\n disabled={disabled}\n variant={variant || 'contained'}\n color={color || 'primary'}\n {...(buttonProps as any)}\n >\n {text}\n </Button>\n );\n })}\n </Stack>\n </Box>\n );\n};\n\nModalFooter.displayName = 'ModalFooter';\n\nexport default ModalFooter;\n","import React from 'react';\nimport { Box, Typography } from '@mui/material';\n\nexport interface ModalHeaderProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-labelledby` del Modal. Se setea\n * automáticamente cuando el header se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalHeader: React.FC<ModalHeaderProps> = ({ children, id }) => {\n return (\n <Box\n sx={{\n padding: 2,\n borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <Typography id={id} variant=\"h6\" component=\"h2\">\n {children}\n </Typography>\n </Box>\n );\n};\n\nModalHeader.displayName = 'ModalHeader';\n\nexport default ModalHeader;\n","import React from 'react';\nimport { Box } from '@mui/material';\n\nexport interface ModalBodyProps {\n children: React.ReactNode;\n /**\n * ID del elemento — usado para `aria-describedby` del Modal. Se setea\n * automáticamente cuando el body se renderiza dentro de `<Modal>`.\n */\n id?: string;\n}\n\nexport const ModalBody: React.FC<ModalBodyProps> = ({ children, id }) => {\n return (\n <Box id={id} sx={{ padding: 2, overflowY: 'auto', flexGrow: 1 }}>\n {children}\n </Box>\n );\n};\n\nModalBody.displayName = 'ModalBody';\n\nexport default ModalBody;\n","import {\n Children,\n cloneElement,\n forwardRef,\n isValidElement,\n useId,\n useImperativeHandle,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n Modal as MuiModal,\n Paper,\n useMediaQuery,\n useTheme,\n Box,\n Stack,\n Typography,\n} from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\nimport WarningAmberIcon from '@mui/icons-material/WarningAmber';\nimport ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';\nimport CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';\n\nimport type { DialogProps } from '@mui/material/Dialog';\nimport { ModalFooter, type ModalAction, type ModalFooterProps } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { mergeSx } from '../_shared/mergeSx';\n\n// Detección robusta de sub-componentes — funciona con wrappers / HMR que\n// rompen la igualdad de referencia (`child.type === ModalHeader`).\nconst isModalSlot = (\n child: ReactElement,\n Component: unknown,\n displayName: string,\n): boolean => {\n if (child.type === Component) return true;\n const type = child.type as { displayName?: string };\n return type?.displayName === displayName;\n};\n\n// Define la interfaz para los métodos que el padre puede llamar a través de la ref\nexport interface ModalRef {\n open: () => void;\n close: () => void;\n}\n\nexport type ModalMode = 'default' | 'confirm';\nexport type ModalSeverity = 'info' | 'warning' | 'error' | 'success';\n\nexport interface ModalProps {\n /**\n * Modo del modal.\n * - `default` (default): modal genérico con slots `Header`/`Body`/`Footer` y\n * `actions` custom.\n * - `confirm`: reemplaza al `ConfirmModal` legacy. Renderiza un layout\n * focalizado con icono por severidad, mensaje y botones \"Cancelar\" /\n * \"Confirmar\".\n */\n mode?: ModalMode;\n\n // ── Props comunes ────────────────────────────────────────────────────\n /** Controlado externamente. Omitir si se usa vía ref. */\n open?: boolean;\n /** Callback al cerrar. También se dispara al confirmar/cancelar. */\n onClose?: () => void;\n title?: string;\n children?: ReactNode;\n showCloseButton?: boolean;\n closeButtonText?: string;\n closeButtonDisabled?: boolean;\n actions?: ModalAction[];\n maxWidth?: DialogProps['maxWidth'];\n /** Oculta el header (incluso si hay `title` o se pasa un `<Modal.Header>`). */\n hiddenHeader?: boolean;\n /** Oculta el body (incluso si se pasa un `<Modal.Body>`). */\n hiddenBody?: boolean;\n /** Oculta el footer (incluso si se pasa un `<Modal.Footer>` o `actions`). */\n hiddenFooter?: boolean;\n /** sx del Modal root (MuiModal). */\n sx?: SxProps<Theme>;\n /** sx del Paper interno (contenedor visual). Se mergea sobre el default. */\n paperSx?: SxProps<Theme>;\n /** className del Paper interno. */\n className?: string;\n\n // ── Props del modo confirm ───────────────────────────────────────────\n /**\n * Callback de confirmación. Soporta promesa — si devuelve `Promise`, el\n * botón muestra estado `disabled` mientras resuelve.\n *\n * Si la promesa **rechaza**, el modal queda abierto para que el consumer\n * pueda mostrar el error en su UI. El modal se cierra solo en éxito.\n */\n onConfirm?: () => void | Promise<void>;\n /** Texto del botón primario en modo `confirm`. Default: \"Confirmar\". */\n confirmText?: string;\n /** Deshabilita el botón de confirmar. */\n confirmDisabled?: boolean;\n /**\n * Severidad visual en modo `confirm`. Controla el icono y el color del\n * botón de confirmación.\n * - `info` (default): primary\n * - `warning`: warning (amarillo)\n * - `error`: error (rojo) — típico para \"Eliminar\"\n * - `success`: success (verde) — típico para \"Aprobar\"\n */\n severity?: ModalSeverity;\n /**\n * Mensaje del confirm. Puede ser string o cualquier ReactNode. Si se omite,\n * se usa `children`.\n */\n confirmMessage?: ReactNode;\n}\n\nconst modalStyle = {\n position: 'absolute' as const,\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '90%',\n maxHeight: '90vh',\n display: 'flex',\n flexDirection: 'column' as const,\n outline: 'none',\n};\n\nconst severityConfig: Record<\n ModalSeverity,\n { color: ModalAction['color']; icon: ReactNode; paletteKey: 'primary' | 'warning' | 'error' | 'success' }\n> = {\n info: {\n color: 'primary',\n icon: <InfoOutlinedIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'primary',\n },\n warning: {\n color: 'warning',\n icon: <WarningAmberIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'warning',\n },\n error: {\n color: 'error',\n icon: <ErrorOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'error',\n },\n success: {\n color: 'success',\n icon: <CheckCircleOutlineIcon sx={{ fontSize: 48 }} />,\n paletteKey: 'success',\n },\n};\n\nexport const Modal = forwardRef<ModalRef, ModalProps>(\n (\n {\n mode = 'default',\n open: controlledOpen,\n onClose: controlledOnClose,\n title,\n children,\n showCloseButton = true,\n closeButtonText = 'Cerrar',\n closeButtonDisabled = false,\n actions = [],\n maxWidth = 'sm',\n hiddenHeader = false,\n hiddenBody = false,\n hiddenFooter = false,\n sx,\n paperSx,\n className,\n\n // Props del modo confirm\n onConfirm,\n confirmText = 'Confirmar',\n confirmDisabled = false,\n severity = 'info',\n confirmMessage,\n },\n ref,\n ) => {\n const [internalOpen, setInternalOpen] = useState(false);\n const [confirmLoading, setConfirmLoading] = useState(false);\n\n // IDs estables para a11y: `aria-labelledby` y `aria-describedby`.\n const titleId = useId();\n const descId = useId();\n\n const isOpen = controlledOpen !== undefined ? controlledOpen : internalOpen;\n\n useImperativeHandle(ref, () => ({\n open: () => setInternalOpen(true),\n close: () => {\n setInternalOpen(false);\n controlledOnClose?.();\n },\n }));\n\n const handleCloseInternal = () => {\n setInternalOpen(false);\n controlledOnClose?.();\n };\n\n const handleConfirm = async () => {\n if (!onConfirm) {\n handleCloseInternal();\n return;\n }\n const result = onConfirm();\n if (!(result instanceof Promise)) {\n handleCloseInternal();\n return;\n }\n setConfirmLoading(true);\n try {\n await result;\n handleCloseInternal();\n } catch (err) {\n // No cerrar el modal en caso de error — el consumer es responsable\n // de mostrar un estado de error en su UI. Logueamos para trazabilidad\n // en dev.\n // eslint-disable-next-line no-console\n console.error('Modal onConfirm failed:', err);\n } finally {\n setConfirmLoading(false);\n }\n };\n\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('sm'));\n\n const getWidth = () => {\n if (isMobile) return '95%';\n switch (maxWidth) {\n case 'xs':\n return 300;\n case 'sm':\n return 500;\n case 'md':\n return 700;\n case 'lg':\n return 900;\n case 'xl':\n return 1100;\n case false:\n return 'auto';\n default:\n // Soporta string custom: `maxWidth=\"600px\"` se pasa tal cual.\n return typeof maxWidth === 'string' ? maxWidth : 500;\n }\n };\n\n // Base sx del Paper + width responsive; el consumer puede pisarlos via `paperSx`.\n const paperBaseSx: SxProps<Theme> = { ...modalStyle, width: getWidth() };\n const mergedPaperSx = mergeSx(paperBaseSx, paperSx);\n\n // ── Render modo CONFIRM ─────────────────────────────────────────────\n if (mode === 'confirm') {\n const config = severityConfig[severity];\n const message = confirmMessage ?? children;\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={title ? titleId : undefined}\n aria-describedby={message ? descId : undefined}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n <Stack spacing={2.5} sx={{ p: 3, alignItems: 'center', textAlign: 'center' }}>\n <Box\n sx={{\n width: 72,\n height: 72,\n borderRadius: '50%',\n backgroundColor: (t) => t.palette[config.paletteKey].light,\n color: (t) => t.palette[config.paletteKey].dark,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n opacity: 0.9,\n }}\n >\n {config.icon}\n </Box>\n {title && (\n <Typography id={titleId} variant=\"h6\" component=\"h2\" sx={{ fontWeight: 700 }}>\n {title}\n </Typography>\n )}\n {message && (\n <Typography id={descId} variant=\"body2\" color=\"text.secondary\">\n {message}\n </Typography>\n )}\n </Stack>\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled || confirmLoading}\n onClose={handleCloseInternal}\n actions={[\n {\n text: confirmText,\n onClick: handleConfirm,\n disabled: confirmDisabled || confirmLoading,\n variant: 'contained',\n color: config.color,\n },\n ]}\n />\n </Paper>\n </MuiModal>\n );\n }\n\n // ── Render modo DEFAULT (compuesto) ─────────────────────────────────\n const renderChildren = () => {\n let header: ReactNode | null = null;\n let body: ReactNode | null = null;\n let footer: ReactNode | null = null;\n\n Children.forEach(children, (child) => {\n if (!isValidElement(child)) return;\n\n if (isModalSlot(child, ModalHeader, 'ModalHeader')) {\n const headerChild = child as ReactElement<{ id?: string }>;\n header = cloneElement(headerChild, { id: titleId, ...headerChild.props });\n } else if (isModalSlot(child, ModalBody, 'ModalBody')) {\n const bodyChild = child as ReactElement<{ id?: string }>;\n body = cloneElement(bodyChild, { id: descId, ...bodyChild.props });\n } else if (isModalSlot(child, ModalFooter, 'ModalFooter')) {\n const footerChild = child as ReactElement<ModalFooterProps>;\n // Props del child ganan sobre los del Modal padre: si el consumer\n // declara `<Modal.Footer showCloseButton={false}>`, ese valor se\n // respeta. Solo los que vengan `undefined` caen al default del padre.\n const childProps = footerChild.props;\n footer = cloneElement(footerChild, {\n showCloseButton: childProps.showCloseButton ?? showCloseButton,\n closeButtonText: childProps.closeButtonText ?? closeButtonText,\n closeButtonDisabled: childProps.closeButtonDisabled ?? closeButtonDisabled,\n onClose: childProps.onClose ?? handleCloseInternal,\n actions: childProps.actions ?? actions,\n });\n }\n });\n\n if (!footer && !hiddenFooter) {\n footer = (\n <ModalFooter\n showCloseButton={showCloseButton}\n closeButtonText={closeButtonText}\n closeButtonDisabled={closeButtonDisabled}\n onClose={handleCloseInternal}\n actions={actions}\n />\n );\n }\n\n return (\n <>\n {!hiddenHeader && (header || (title && <ModalHeader id={titleId}>{title}</ModalHeader>))}\n {!hiddenBody && body}\n {footer}\n </>\n );\n };\n\n return (\n <MuiModal\n open={isOpen}\n onClose={handleCloseInternal}\n aria-labelledby={titleId}\n aria-describedby={descId}\n closeAfterTransition\n sx={sx}\n >\n <Paper className={className} sx={mergedPaperSx}>\n {renderChildren()}\n </Paper>\n </MuiModal>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\n// Define los sub-componentes como propiedades estáticas con tipos explícitos\ntype ModalComponent = ReturnType<typeof forwardRef<ModalRef, ModalProps>> & {\n Header: typeof ModalHeader;\n Body: typeof ModalBody;\n Footer: typeof ModalFooter;\n};\n\nconst ModalWithStatics = Modal as ModalComponent;\n\nModalWithStatics.Header = ModalHeader;\nModalWithStatics.Body = ModalBody;\nModalWithStatics.Footer = ModalFooter;\n\nexport default ModalWithStatics;\n"],"names":["jsxs","Box","Stack","jsx","Button","Typography","forwardRef","useState","useId","useImperativeHandle","useTheme","useMediaQuery","mergeSx","MuiModal","Paper","Children","isValidElement","cloneElement","Fragment"],"mappings":"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"}
package/{Select-kqR48jZU.cjs → Select-CmxXLeJZ.cjs} RENAMED
@@ -38,6 +38,7 @@ const reactHookForm = require("react-hook-form");
38
38
  const formField_sx = require("./formField.sx-BAX7KwMR.cjs");
39
39
  const resolvePreset = require("./resolvePreset-CxTI6_Ln.cjs");
40
40
  const CheckIcon = require("@mui/icons-material/Check");
41
+ const ClearIcon = require("@mui/icons-material/Clear");
41
42
  const buildSelectSx = (borderRadius, labelPosition) => formField_sx.buildFormFieldSx({ borderRadius, labelPosition });
42
43
  const groupOptions = (options) => {
43
44
  const groups = {};
@@ -67,6 +68,56 @@ const renderSelectMenuItem = ({
67
68
  },
68
69
  String(option.value)
69
70
  );
71
+ function SelectValue(props) {
72
+ var _a;
73
+ const {
74
+ selected,
75
+ options,
76
+ multiple,
77
+ placeholder,
78
+ maxChipsToShow,
79
+ chipVariant,
80
+ renderChipLabel,
81
+ onDeleteChip,
82
+ currentValues
83
+ } = props;
84
+ const isEmpty = !selected || Array.isArray(selected) && selected.length === 0;
85
+ if (isEmpty) {
86
+ return /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { sx: { color: "text.disabled" }, children: placeholder || "" });
87
+ }
88
+ if (!multiple) {
89
+ const item = options.find((opt) => opt.value === selected);
90
+ if (renderChipLabel && item) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: renderChipLabel(item) });
91
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: (_a = item == null ? void 0 : item.label) != null ? _a : String(selected) });
92
+ }
93
+ const selectedValuesArray = selected;
94
+ const displayedChips = selectedValuesArray.slice(0, maxChipsToShow);
95
+ const hiddenChipsCount = selectedValuesArray.length - maxChipsToShow;
96
+ const handleDelete = (chipValue) => {
97
+ if (!onDeleteChip || !currentValues) return;
98
+ onDeleteChip(currentValues.filter((v) => v !== chipValue));
99
+ };
100
+ return /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { display: "flex", flexWrap: "wrap", gap: 0.5 }, children: [
101
+ displayedChips.map((val) => {
102
+ const item = options.find((o) => o.value === val);
103
+ if (!item) return null;
104
+ return /* @__PURE__ */ jsxRuntime.jsx(
105
+ material.Chip,
106
+ {
107
+ variant: chipVariant,
108
+ color: "primary",
109
+ size: "small",
110
+ label: renderChipLabel ? renderChipLabel(item) : item.label,
111
+ avatar: item.img ? /* @__PURE__ */ jsxRuntime.jsx(material.Avatar, { src: item.img }) : void 0,
112
+ onDelete: () => handleDelete(val),
113
+ deleteIcon: /* @__PURE__ */ jsxRuntime.jsx(ClearIcon, { fontSize: "small" })
114
+ },
115
+ String(val)
116
+ );
117
+ }),
118
+ hiddenChipsCount > 0 && /* @__PURE__ */ jsxRuntime.jsx(material.Chip, { size: "small", variant: chipVariant, label: `+${hiddenChipsCount} más` })
119
+ ] });
120
+ }
70
121
  function Option(_props) {
71
122
  return null;
72
123
  }
@@ -90,6 +141,10 @@ function Select(props) {
90
141
  variant = "outlined",
91
142
  sx,
92
143
  className,
144
+ multiple = false,
145
+ maxChipsToShow = 3,
146
+ chipVariant = "filled",
147
+ renderChipLabel,
93
148
  name: _nameIgnored,
94
149
  control: _controlIgnored,
95
150
  validation: _validationIgnored,
@@ -113,6 +168,10 @@ function Select(props) {
113
168
  "variant",
114
169
  "sx",
115
170
  "className",
171
+ "multiple",
172
+ "maxChipsToShow",
173
+ "chipVariant",
174
+ "renderChipLabel",
116
175
  // Separamos estos aunque no se usen directamente acá — evita que lleguen
117
176
  // al DOM del MuiSelect via `{...rest}` y generen warnings de React.
118
177
  "name",
@@ -146,7 +205,7 @@ function Select(props) {
146
205
  );
147
206
  }
148
207
  opts.forEach((opt) => {
149
- const selected = currentValue === opt.value;
208
+ const selected = Array.isArray(currentValue) ? currentValue.includes(opt.value) : currentValue === opt.value;
150
209
  items.push(
151
210
  renderSelectMenuItem({
152
211
  option: opt,
@@ -162,12 +221,12 @@ function Select(props) {
162
221
  ...presetSx ? [presetSx] : [buildSelectSx(borderRadius, labelPosition)],
163
222
  ...Array.isArray(sx) ? sx : sx ? [sx] : []
164
223
  ];
165
- const renderSelect = (selectValue, selectOnChange, onBlur, inputRef, rhfError, rhfHelperText) => {
224
+ const renderSelect = (selectValue, selectOnChange, onBlur, inputRef, rhfError, rhfHelperText, onValuesChange) => {
166
225
  const finalError = !!rhfError || !!error;
167
226
  const finalHelperText = rhfHelperText != null ? rhfHelperText : helperText;
168
227
  const inputElement = variant === "filled" ? /* @__PURE__ */ jsxRuntime.jsx(material.FilledInput, {}) : labelPosition === "floating" ? /* @__PURE__ */ jsxRuntime.jsx(material.OutlinedInput, { label }) : /* @__PURE__ */ jsxRuntime.jsx(material.OutlinedInput, {});
169
- const normalizedValue = normalizeSelectValue(selectValue);
170
- const isEmpty = isSelectValueEmpty(normalizedValue);
228
+ const normalizedValue = multiple ? selectValue != null ? selectValue : [] : normalizeSelectValue(selectValue);
229
+ const isEmpty = multiple ? normalizedValue.length === 0 : isSelectValueEmpty(normalizedValue);
171
230
  const shouldShrink = !isEmpty || isFocused || isOpen;
172
231
  const shouldDisplayPlaceholder = isEmpty && (isFocused || isOpen) && !!placeholder;
173
232
  return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -185,6 +244,7 @@ function Select(props) {
185
244
  /* @__PURE__ */ jsxRuntime.jsx(
186
245
  material.Select,
187
246
  __spreadProps(__spreadValues({
247
+ multiple,
188
248
  value: normalizedValue,
189
249
  onChange: selectOnChange,
190
250
  onBlur: (e) => {
@@ -194,14 +254,20 @@ function Select(props) {
194
254
  onFocus: () => setIsFocused(true),
195
255
  onOpen: () => setIsOpen(true),
196
256
  onClose: () => setIsOpen(false),
197
- renderValue: (selected) => {
198
- var _a2;
199
- if (isSelectValueEmpty(selected)) {
200
- return /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { sx: { color: "text.disabled" }, children: placeholder != null ? placeholder : "" });
257
+ renderValue: (selected) => /* @__PURE__ */ jsxRuntime.jsx(
258
+ SelectValue,
259
+ {
260
+ selected,
261
+ options,
262
+ multiple,
263
+ placeholder,
264
+ maxChipsToShow,
265
+ chipVariant,
266
+ renderChipLabel,
267
+ currentValues: multiple ? selected : void 0,
268
+ onDeleteChip: onValuesChange
201
269
  }
202
- const item = options.find((opt) => opt.value === selected);
203
- return (_a2 = item == null ? void 0 : item.label) != null ? _a2 : String(selected);
204
- },
270
+ ),
205
271
  displayEmpty: shouldDisplayPlaceholder,
206
272
  input: inputElement,
207
273
  disabled,
@@ -241,15 +307,28 @@ function Select(props) {
241
307
  field.onBlur,
242
308
  field.ref,
243
309
  !!fieldError,
244
- fieldError == null ? void 0 : fieldError.message
310
+ fieldError == null ? void 0 : fieldError.message,
311
+ (nextVals) => {
312
+ field.onChange(nextVals);
313
+ onValueChange == null ? void 0 : onValueChange(nextVals);
314
+ }
245
315
  );
246
316
  }
247
317
  }
248
318
  );
249
319
  }
250
320
  const { value, onChange } = props;
251
- return renderSelect(value, (e) => onChange(e.target.value));
321
+ const handleChange = onChange;
322
+ return renderSelect(
323
+ value,
324
+ (e) => handleChange(e.target.value),
325
+ void 0,
326
+ void 0,
327
+ void 0,
328
+ void 0,
329
+ (next) => onChange(next)
330
+ );
252
331
  }
253
332
  exports.Option = Option;
254
333
  exports.Select = Select;
255
- //# sourceMappingURL=Select-kqR48jZU.cjs.map
334
+ //# sourceMappingURL=Select-CmxXLeJZ.cjs.map
package/Select-CmxXLeJZ.cjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Select-CmxXLeJZ.cjs","sources":["../src/components/Select/Select.sx.ts","../src/components/Select/Select.helpers.ts","../src/components/Select/_parts/SelectMenuItem.tsx","../src/components/Select/_parts/SelectValue.tsx","../src/components/Select/Select.tsx"],"sourcesContent":["import type { SelectProps as MuiSelectProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport type { LabelPosition } from './Select';\n\n/**\n * Builder de sx para el Select. Usa el builder compartido\n * `buildFormFieldSx`. El Select no necesita overrides específicos.\n */\nexport const buildSelectSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): MuiSelectProps['sx'] =>\n buildFormFieldSx({ borderRadius, labelPosition }) as MuiSelectProps['sx'];\n","import type { SelectOption } from './Select';\n\n/**\n * Agrupa opciones por la propiedad `group`. Las opciones sin group caen\n * bajo la key especial `__default`. Devuelve un Record para iterar en orden\n * de inserción con Object.entries.\n */\nexport const groupOptions = (\n options: SelectOption[],\n): Record<string, SelectOption[]> => {\n const groups: Record<string, SelectOption[]> = {};\n options.forEach((opt) => {\n const group = opt.group || '__default';\n if (!groups[group]) groups[group] = [];\n groups[group].push(opt);\n });\n return groups;\n};\n\n/**\n * Normaliza el valor single al shape que espera MUI Select: string vacío si\n * el valor es `null`/`undefined`.\n */\nexport const normalizeSelectValue = <T>(value: T | null | undefined): T | '' =>\n (value ?? '') as T | '';\n\n/** `true` si el valor está vacío (para shrink del label + placeholder). */\nexport const isSelectValueEmpty = (normalizedValue: unknown): boolean =>\n normalizedValue === '' ||\n normalizedValue === null ||\n normalizedValue === undefined;\n","import React from 'react';\nimport { ListItemIcon, MenuItem } from '@mui/material';\nimport CheckIcon from '@mui/icons-material/Check';\n\nimport type { SelectOption, RenderOptionItem } from '../Select';\n\ninterface RenderSelectMenuItemArgs {\n option: SelectOption;\n selected: boolean;\n customRender?: RenderOptionItem | null;\n}\n\n/**\n * Render helper (no componente) que devuelve un <MenuItem> listo para\n * colocarse como hijo directo del <MuiSelect>. Se implementa como función\n * y no como componente porque MUI Select inspecciona `props.value` de sus\n * children para resolver la selección, y envolverlo en un componente extra\n * rompe esa detección.\n *\n * Incluye el icono de check a la izquierda cuando `selected` es true. Si el\n * consumer pasó un `<Option>{(opt) => ...}</Option>`, usa ese render para el\n * contenido principal; de lo contrario muestra `option.label`.\n */\nexport const renderSelectMenuItem = ({\n option,\n selected,\n customRender,\n}: RenderSelectMenuItemArgs): React.ReactElement => (\n <MenuItem\n key={String(option.value)}\n value={option.value}\n disabled={option.disabled}\n selected={selected}\n >\n <ListItemIcon sx={{ minWidth: 32 }}>\n {selected && <CheckIcon color=\"success\" fontSize=\"small\" />}\n </ListItemIcon>\n {customRender ? customRender(option) : option.label}\n </MenuItem>\n);\n","import { Avatar, Box, Chip, Typography } from '@mui/material';\nimport ClearIcon from '@mui/icons-material/Clear';\n\nimport type {\n SelectOption,\n RenderChipLabel,\n ChipVariant,\n} from '../Select';\n\ninterface SelectValueProps<TValue extends SelectOption['value']> {\n selected: TValue | TValue[] | null | undefined;\n options: SelectOption[];\n multiple: boolean;\n placeholder?: string;\n maxChipsToShow: number;\n chipVariant: ChipVariant;\n renderChipLabel?: RenderChipLabel;\n /** Solo relevante en modo multiple. Recibe el nuevo array de valores. */\n onDeleteChip?: (nextValues: TValue[]) => void;\n /** Array de valores actuales (para componer el nuevo array al borrar chips). */\n currentValues?: TValue[];\n}\n\n/**\n * Render del valor seleccionado del Select.\n * - single: texto (label) o lo que devuelva `renderChipLabel`.\n * - multiple: chips con delete. Trunca después de `maxChipsToShow` mostrando \"+N más\".\n * - empty: placeholder en color disabled.\n */\nexport function SelectValue<TValue extends SelectOption['value']>(\n props: SelectValueProps<TValue>,\n) {\n const {\n selected,\n options,\n multiple,\n placeholder,\n maxChipsToShow,\n chipVariant,\n renderChipLabel,\n onDeleteChip,\n currentValues,\n } = props;\n\n const isEmpty =\n !selected || (Array.isArray(selected) && selected.length === 0);\n\n if (isEmpty) {\n return (\n <Typography sx={{ color: 'text.disabled' }}>{placeholder || ''}</Typography>\n );\n }\n\n if (!multiple) {\n const item = options.find((opt) => opt.value === selected);\n if (renderChipLabel && item) return <>{renderChipLabel(item)}</>;\n return <>{item?.label ?? String(selected)}</>;\n }\n\n const selectedValuesArray = selected as TValue[];\n const displayedChips = selectedValuesArray.slice(0, maxChipsToShow);\n const hiddenChipsCount = selectedValuesArray.length - maxChipsToShow;\n\n const handleDelete = (chipValue: TValue) => {\n if (!onDeleteChip || !currentValues) return;\n onDeleteChip(currentValues.filter((v) => v !== chipValue));\n };\n\n return (\n <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>\n {displayedChips.map((val) => {\n const item = options.find((o) => o.value === val);\n if (!item) return null;\n\n return (\n <Chip\n variant={chipVariant}\n color=\"primary\"\n size=\"small\"\n key={String(val)}\n label={renderChipLabel ? renderChipLabel(item) : item.label}\n avatar={item.img ? <Avatar src={item.img} /> : undefined}\n onDelete={() => handleDelete(val)}\n deleteIcon={<ClearIcon fontSize=\"small\" />}\n />\n );\n })}\n {hiddenChipsCount > 0 && (\n <Chip size=\"small\" variant={chipVariant} label={`+${hiddenChipsCount} más`} />\n )}\n </Box>\n );\n}\n\nexport default SelectValue;\n","import {\n Children,\n isValidElement,\n useMemo,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n FilledInput,\n FormControl,\n FormHelperText,\n InputLabel,\n ListSubheader,\n OutlinedInput,\n Select as MuiSelect,\n type SelectChangeEvent,\n type SelectProps as MuiSelectProps,\n} from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildSelectSx } from './Select.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\nimport {\n groupOptions,\n isSelectValueEmpty,\n normalizeSelectValue,\n} from './Select.helpers';\nimport { renderSelectMenuItem } from './_parts/SelectMenuItem';\nimport { SelectValue } from './_parts/SelectValue';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface SelectOption {\n value: string | number;\n label: string;\n img?: string;\n disabled?: boolean;\n group?: string;\n [key: string]: any;\n}\n\nexport type LabelPosition = 'outside' | 'floating';\nexport type SelectSize = 'small' | 'medium';\n\n// ── Render slots ─────────────────────────────────────────────────────────\nexport type RenderOptionItem = (item: SelectOption) => ReactNode;\n\n/** Variante visual de los chips en modo `multiple`. */\nexport type ChipVariant = 'filled' | 'outlined';\n/** Render custom del label de cada chip/valor seleccionado. */\nexport type RenderChipLabel = (item: SelectOption) => ReactNode;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport interface OptionProps {\n children: RenderOptionItem;\n}\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport interface BaseSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> {\n label?: string;\n options?: SelectOption[];\n defaultValue?: TValue;\n size?: SelectSize;\n placeholder?: string;\n children?: ReactElement<{ children: RenderOptionItem }>;\n maxHeight?: number | string;\n maxWidth?: number | string;\n disabled?: boolean;\n error?: boolean;\n helperText?: string;\n /** Border radius del input (px o string CSS). Default: 10 */\n borderRadius?: number | string;\n /**\n * Posición del label.\n * - \"outside\" (default): label arriba del input, sin animación.\n * - \"floating\": label clásico de MUI (flota dentro del notched outline).\n */\n labelPosition?: LabelPosition;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.Select`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n * - Cualquier otro string = mergea el preset encima del estilo built-in.\n */\n preset?: string;\n /** MUI input variant. Default: 'outlined'. */\n variant?: 'outlined' | 'filled';\n sx?: MuiSelectProps['sx'];\n className?: string;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name: string;\n // `any` plano (no `Control<any>`): RHF tipa `Control<T>` con generics en\n // posiciones tanto contravariantes como covariantes (ej. `_subjects.state`).\n // Cuando el componente tiene generics propios (como `TValue` acá), TS se\n // confunde narroweando el discriminated union y `Control<any>` no logra\n // absorber `Control<MyForm>` en la comparación estructural profunda.\n // El `any` plano elimina ese ruido. RHF adentro sigue teniendo sus tipos\n // fuertes — solo degradamos la superficie del prop del Select.\n control: any;\n validation?: RegisterOptions;\n /**\n * Side-effect que corre después de que RHF actualiza el form state.\n * Útil para cascadas entre campos (ej. reset de municipio al cambiar\n * departamento). NO reemplaza al handler de RHF.\n */\n onValueChange?: (value: TValue) => void;\n multiple?: false;\n value?: never;\n onChange?: never;\n}\n\nexport interface StandardSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name?: string;\n control?: never;\n validation?: never;\n multiple?: false;\n value: TValue;\n onChange: (val: TValue) => void;\n}\n\nexport interface MultipleSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name?: string;\n control?: never;\n validation?: never;\n multiple: true;\n value: TValue[];\n onChange: (val: TValue[]) => void;\n /** Máximo de chips visibles antes de truncar con \"+N más\". Default: 3. */\n maxChipsToShow?: number;\n /** Variante visual de los chips. Default: 'filled'. */\n chipVariant?: ChipVariant;\n /** Render custom del label de cada chip. */\n renderChipLabel?: RenderChipLabel;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type SelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> =\n | RHFSelectProps<TValue>\n | StandardSelectProps<TValue>\n | MultipleSelectProps<TValue>;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport function Option(_props: OptionProps) {\n return null;\n}\nOption.displayName = 'Option';\n\n// ── Componente ───────────────────────────────────────────────────────────\nexport function Select<\n TValue extends SelectOption['value'] = SelectOption['value'],\n>(props: SelectProps<TValue>) {\n const {\n label,\n options = [],\n defaultValue,\n size = 'small',\n placeholder,\n children,\n maxHeight = 300,\n maxWidth,\n disabled = false,\n error = false,\n helperText,\n borderRadius = 10,\n labelPosition = 'outside',\n preset,\n variant = 'outlined',\n sx,\n className,\n multiple = false,\n maxChipsToShow = 3,\n chipVariant = 'filled',\n renderChipLabel,\n // Separamos estos aunque no se usen directamente acá — evita que lleguen\n // al DOM del MuiSelect via `{...rest}` y generen warnings de React.\n name: _nameIgnored,\n control: _controlIgnored,\n validation: _validationIgnored,\n value: _valueIgnored,\n onChange: _onChangeIgnored,\n ...rest\n } = props as StandardSelectProps<TValue> & {\n name?: string;\n control?: Control<any>;\n validation?: RegisterOptions;\n multiple?: boolean;\n maxChipsToShow?: number;\n chipVariant?: ChipVariant;\n renderChipLabel?: RenderChipLabel;\n };\n\n const theme = useTheme();\n const presetSx = resolvePreset('Select', preset, theme);\n\n const isRHFMode = 'control' in props && (props as RHFSelectProps<TValue>).control !== undefined;\n\n // Custom render opcional vía <Option>{item => ...}</Option>\n const customRender: RenderOptionItem | null = useMemo(() => {\n if (Children.count(children) === 1) {\n const child = Children.only(children);\n if (isValidElement(child) && (child.type as any)?.displayName === 'Option') {\n return (child.props as OptionProps).children;\n }\n }\n return null;\n }, [children]);\n\n // Focus/open tracking para el comportamiento del label \"outside\".\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n\n const groupedOptions = useMemo(() => groupOptions(options), [options]);\n\n // Items del menú (grupos + opciones). Un solo memoizado — sin search/async.\n const buildMenuItems = (currentValue: TValue | TValue[] | '') => {\n const items: ReactNode[] = [];\n Object.entries(groupedOptions).forEach(([group, opts]) => {\n if (group !== '__default') {\n items.push(\n <ListSubheader key={group} disableSticky>\n {group}\n </ListSubheader>,\n );\n }\n opts.forEach((opt) => {\n const selected = Array.isArray(currentValue)\n ? currentValue.includes(opt.value as TValue)\n : currentValue === opt.value;\n items.push(\n renderSelectMenuItem({\n option: opt,\n selected,\n customRender,\n }),\n );\n });\n });\n return items;\n };\n\n const mergedSx = [\n ...(presetSx ? [presetSx] : [buildSelectSx(borderRadius, labelPosition)]),\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n // Render base (común a RHF y controlled)\n const renderSelect = (\n selectValue: TValue | TValue[] | null | undefined,\n selectOnChange: (event: SelectChangeEvent<TValue | TValue[]>) => void,\n onBlur?: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void,\n inputRef?: React.Ref<HTMLInputElement>,\n rhfError?: boolean,\n rhfHelperText?: string,\n onValuesChange?: (next: TValue[]) => void,\n ) => {\n const finalError = !!rhfError || !!error;\n const finalHelperText = rhfHelperText ?? helperText;\n\n const inputElement =\n variant === 'filled'\n ? <FilledInput />\n : labelPosition === 'floating'\n ? <OutlinedInput label={label} />\n : <OutlinedInput />;\n\n const normalizedValue = multiple\n ? ((selectValue as TValue[] | null | undefined) ?? [])\n : normalizeSelectValue(selectValue as TValue | null | undefined);\n const isEmpty = multiple\n ? (normalizedValue as TValue[]).length === 0\n : isSelectValueEmpty(normalizedValue);\n\n // Shrink cuando hay valor, foco, o dropdown abierto.\n const shouldShrink = !isEmpty || isFocused || isOpen;\n // Placeholder solo cuando el label ya subió.\n const shouldDisplayPlaceholder =\n isEmpty && (isFocused || isOpen) && !!placeholder;\n\n return (\n <FormControl\n fullWidth\n size={size}\n variant={variant}\n error={finalError}\n disabled={disabled}\n className={className}\n sx={mergedSx}\n >\n {label && <InputLabel shrink={shouldShrink}>{label}</InputLabel>}\n <MuiSelect<TValue | TValue[]>\n multiple={multiple}\n value={normalizedValue as TValue | TValue[]}\n onChange={selectOnChange}\n onBlur={(e) => {\n setIsFocused(false);\n onBlur?.(e);\n }}\n onFocus={() => setIsFocused(true)}\n onOpen={() => setIsOpen(true)}\n onClose={() => setIsOpen(false)}\n renderValue={(selected) => (\n <SelectValue<TValue>\n selected={selected as TValue | TValue[]}\n options={options}\n multiple={multiple}\n placeholder={placeholder}\n maxChipsToShow={maxChipsToShow}\n chipVariant={chipVariant}\n renderChipLabel={renderChipLabel}\n currentValues={multiple ? (selected as TValue[]) : undefined}\n onDeleteChip={onValuesChange}\n />\n )}\n displayEmpty={shouldDisplayPlaceholder}\n input={inputElement}\n disabled={disabled}\n MenuProps={{\n PaperProps: {\n style: { maxHeight, maxWidth },\n },\n }}\n inputRef={inputRef}\n {...(rest as any)}\n >\n {buildMenuItems(normalizedValue as TValue | TValue[] | '')}\n </MuiSelect>\n {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n </FormControl>\n );\n };\n\n // ── RHF mode ──────────────────────────────────────────────────────────\n if (isRHFMode) {\n const { name, control, validation, onValueChange } = props as RHFSelectProps<TValue>;\n return (\n <Controller\n name={name}\n control={control}\n rules={validation}\n defaultValue={defaultValue}\n render={({ field, fieldState: { error: fieldError } }) =>\n renderSelect(\n field.value ?? null,\n (e) => {\n const next = e.target.value as TValue;\n field.onChange(next);\n onValueChange?.(next);\n },\n field.onBlur,\n field.ref,\n !!fieldError,\n fieldError?.message,\n (nextVals) => {\n field.onChange(nextVals);\n onValueChange?.(nextVals as unknown as TValue);\n },\n )\n }\n />\n );\n }\n\n // ── Controlled mode (single o multiple) ───────────────────────────────\n const { value, onChange } = props as\n | StandardSelectProps<TValue>\n | MultipleSelectProps<TValue>;\n const handleChange = onChange as (val: TValue | TValue[]) => void;\n return renderSelect(\n value as TValue | TValue[],\n (e) => handleChange(e.target.value as TValue | TValue[]),\n undefined,\n undefined,\n undefined,\n undefined,\n (next) => (onChange as (val: TValue[]) => void)(next),\n );\n}\n\nexport default Select;\n"],"names":["buildFormFieldSx","jsxs","MenuItem","jsx","ListItemIcon","Typography","Fragment","Box","Chip","Avatar","useTheme","resolvePreset","useMemo","Children","isValidElement","_a","useState","ListSubheader","FilledInput","OutlinedInput","FormControl","InputLabel","MuiSelect","FormHelperText","Controller"],"mappings":"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"}
package/{Select-Dycmh9vt.js → Select-DRLcIE7M.js} RENAMED
@@ -29,14 +29,15 @@ var __objRest = (source, exclude) => {
29
29
  }
30
30
  return target;
31
31
  };
32
- import { jsxs, jsx } from "react/jsx-runtime";
32
+ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
33
33
  import { useMemo, Children, isValidElement, useState } from "react";
34
- import { MenuItem, ListItemIcon, FormControl, InputLabel, Select as Select$1, Typography, FormHelperText, ListSubheader, FilledInput, OutlinedInput } from "@mui/material";
34
+ import { MenuItem, ListItemIcon, Typography, Box, Chip, Avatar, FormControl, InputLabel, Select as Select$1, FormHelperText, ListSubheader, FilledInput, OutlinedInput } from "@mui/material";
35
35
  import { useTheme } from "@mui/material/styles";
36
36
  import { Controller } from "react-hook-form";
37
37
  import { b as buildFormFieldSx } from "./formField.sx-8_QRnKxv.js";
38
38
  import { r as resolvePreset } from "./resolvePreset-K6_BfWHD.js";
39
39
  import CheckIcon from "@mui/icons-material/Check";
40
+ import ClearIcon from "@mui/icons-material/Clear";
40
41
  const buildSelectSx = (borderRadius, labelPosition) => buildFormFieldSx({ borderRadius, labelPosition });
41
42
  const groupOptions = (options) => {
42
43
  const groups = {};
@@ -66,6 +67,56 @@ const renderSelectMenuItem = ({
66
67
  },
67
68
  String(option.value)
68
69
  );
70
+ function SelectValue(props) {
71
+ var _a;
72
+ const {
73
+ selected,
74
+ options,
75
+ multiple,
76
+ placeholder,
77
+ maxChipsToShow,
78
+ chipVariant,
79
+ renderChipLabel,
80
+ onDeleteChip,
81
+ currentValues
82
+ } = props;
83
+ const isEmpty = !selected || Array.isArray(selected) && selected.length === 0;
84
+ if (isEmpty) {
85
+ return /* @__PURE__ */ jsx(Typography, { sx: { color: "text.disabled" }, children: placeholder || "" });
86
+ }
87
+ if (!multiple) {
88
+ const item = options.find((opt) => opt.value === selected);
89
+ if (renderChipLabel && item) return /* @__PURE__ */ jsx(Fragment, { children: renderChipLabel(item) });
90
+ return /* @__PURE__ */ jsx(Fragment, { children: (_a = item == null ? void 0 : item.label) != null ? _a : String(selected) });
91
+ }
92
+ const selectedValuesArray = selected;
93
+ const displayedChips = selectedValuesArray.slice(0, maxChipsToShow);
94
+ const hiddenChipsCount = selectedValuesArray.length - maxChipsToShow;
95
+ const handleDelete = (chipValue) => {
96
+ if (!onDeleteChip || !currentValues) return;
97
+ onDeleteChip(currentValues.filter((v) => v !== chipValue));
98
+ };
99
+ return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexWrap: "wrap", gap: 0.5 }, children: [
100
+ displayedChips.map((val) => {
101
+ const item = options.find((o) => o.value === val);
102
+ if (!item) return null;
103
+ return /* @__PURE__ */ jsx(
104
+ Chip,
105
+ {
106
+ variant: chipVariant,
107
+ color: "primary",
108
+ size: "small",
109
+ label: renderChipLabel ? renderChipLabel(item) : item.label,
110
+ avatar: item.img ? /* @__PURE__ */ jsx(Avatar, { src: item.img }) : void 0,
111
+ onDelete: () => handleDelete(val),
112
+ deleteIcon: /* @__PURE__ */ jsx(ClearIcon, { fontSize: "small" })
113
+ },
114
+ String(val)
115
+ );
116
+ }),
117
+ hiddenChipsCount > 0 && /* @__PURE__ */ jsx(Chip, { size: "small", variant: chipVariant, label: `+${hiddenChipsCount} más` })
118
+ ] });
119
+ }
69
120
  function Option(_props) {
70
121
  return null;
71
122
  }
@@ -89,6 +140,10 @@ function Select(props) {
89
140
  variant = "outlined",
90
141
  sx,
91
142
  className,
143
+ multiple = false,
144
+ maxChipsToShow = 3,
145
+ chipVariant = "filled",
146
+ renderChipLabel,
92
147
  name: _nameIgnored,
93
148
  control: _controlIgnored,
94
149
  validation: _validationIgnored,
@@ -112,6 +167,10 @@ function Select(props) {
112
167
  "variant",
113
168
  "sx",
114
169
  "className",
170
+ "multiple",
171
+ "maxChipsToShow",
172
+ "chipVariant",
173
+ "renderChipLabel",
115
174
  // Separamos estos aunque no se usen directamente acá — evita que lleguen
116
175
  // al DOM del MuiSelect via `{...rest}` y generen warnings de React.
117
176
  "name",
@@ -145,7 +204,7 @@ function Select(props) {
145
204
  );
146
205
  }
147
206
  opts.forEach((opt) => {
148
- const selected = currentValue === opt.value;
207
+ const selected = Array.isArray(currentValue) ? currentValue.includes(opt.value) : currentValue === opt.value;
149
208
  items.push(
150
209
  renderSelectMenuItem({
151
210
  option: opt,
@@ -161,12 +220,12 @@ function Select(props) {
161
220
  ...presetSx ? [presetSx] : [buildSelectSx(borderRadius, labelPosition)],
162
221
  ...Array.isArray(sx) ? sx : sx ? [sx] : []
163
222
  ];
164
- const renderSelect = (selectValue, selectOnChange, onBlur, inputRef, rhfError, rhfHelperText) => {
223
+ const renderSelect = (selectValue, selectOnChange, onBlur, inputRef, rhfError, rhfHelperText, onValuesChange) => {
165
224
  const finalError = !!rhfError || !!error;
166
225
  const finalHelperText = rhfHelperText != null ? rhfHelperText : helperText;
167
226
  const inputElement = variant === "filled" ? /* @__PURE__ */ jsx(FilledInput, {}) : labelPosition === "floating" ? /* @__PURE__ */ jsx(OutlinedInput, { label }) : /* @__PURE__ */ jsx(OutlinedInput, {});
168
- const normalizedValue = normalizeSelectValue(selectValue);
169
- const isEmpty = isSelectValueEmpty(normalizedValue);
227
+ const normalizedValue = multiple ? selectValue != null ? selectValue : [] : normalizeSelectValue(selectValue);
228
+ const isEmpty = multiple ? normalizedValue.length === 0 : isSelectValueEmpty(normalizedValue);
170
229
  const shouldShrink = !isEmpty || isFocused || isOpen;
171
230
  const shouldDisplayPlaceholder = isEmpty && (isFocused || isOpen) && !!placeholder;
172
231
  return /* @__PURE__ */ jsxs(
@@ -184,6 +243,7 @@ function Select(props) {
184
243
  /* @__PURE__ */ jsx(
185
244
  Select$1,
186
245
  __spreadProps(__spreadValues({
246
+ multiple,
187
247
  value: normalizedValue,
188
248
  onChange: selectOnChange,
189
249
  onBlur: (e) => {
@@ -193,14 +253,20 @@ function Select(props) {
193
253
  onFocus: () => setIsFocused(true),
194
254
  onOpen: () => setIsOpen(true),
195
255
  onClose: () => setIsOpen(false),
196
- renderValue: (selected) => {
197
- var _a2;
198
- if (isSelectValueEmpty(selected)) {
199
- return /* @__PURE__ */ jsx(Typography, { sx: { color: "text.disabled" }, children: placeholder != null ? placeholder : "" });
256
+ renderValue: (selected) => /* @__PURE__ */ jsx(
257
+ SelectValue,
258
+ {
259
+ selected,
260
+ options,
261
+ multiple,
262
+ placeholder,
263
+ maxChipsToShow,
264
+ chipVariant,
265
+ renderChipLabel,
266
+ currentValues: multiple ? selected : void 0,
267
+ onDeleteChip: onValuesChange
200
268
  }
201
- const item = options.find((opt) => opt.value === selected);
202
- return (_a2 = item == null ? void 0 : item.label) != null ? _a2 : String(selected);
203
- },
269
+ ),
204
270
  displayEmpty: shouldDisplayPlaceholder,
205
271
  input: inputElement,
206
272
  disabled,
@@ -240,17 +306,30 @@ function Select(props) {
240
306
  field.onBlur,
241
307
  field.ref,
242
308
  !!fieldError,
243
- fieldError == null ? void 0 : fieldError.message
309
+ fieldError == null ? void 0 : fieldError.message,
310
+ (nextVals) => {
311
+ field.onChange(nextVals);
312
+ onValueChange == null ? void 0 : onValueChange(nextVals);
313
+ }
244
314
  );
245
315
  }
246
316
  }
247
317
  );
248
318
  }
249
319
  const { value, onChange } = props;
250
- return renderSelect(value, (e) => onChange(e.target.value));
320
+ const handleChange = onChange;
321
+ return renderSelect(
322
+ value,
323
+ (e) => handleChange(e.target.value),
324
+ void 0,
325
+ void 0,
326
+ void 0,
327
+ void 0,
328
+ (next) => onChange(next)
329
+ );
251
330
  }
252
331
  export {
253
332
  Option as O,
254
333
  Select as S
255
334
  };
256
- //# sourceMappingURL=Select-Dycmh9vt.js.map
335
+ //# sourceMappingURL=Select-DRLcIE7M.js.map
package/Select-DRLcIE7M.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Select-DRLcIE7M.js","sources":["../src/components/Select/Select.sx.ts","../src/components/Select/Select.helpers.ts","../src/components/Select/_parts/SelectMenuItem.tsx","../src/components/Select/_parts/SelectValue.tsx","../src/components/Select/Select.tsx"],"sourcesContent":["import type { SelectProps as MuiSelectProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport type { LabelPosition } from './Select';\n\n/**\n * Builder de sx para el Select. Usa el builder compartido\n * `buildFormFieldSx`. El Select no necesita overrides específicos.\n */\nexport const buildSelectSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): MuiSelectProps['sx'] =>\n buildFormFieldSx({ borderRadius, labelPosition }) as MuiSelectProps['sx'];\n","import type { SelectOption } from './Select';\n\n/**\n * Agrupa opciones por la propiedad `group`. Las opciones sin group caen\n * bajo la key especial `__default`. Devuelve un Record para iterar en orden\n * de inserción con Object.entries.\n */\nexport const groupOptions = (\n options: SelectOption[],\n): Record<string, SelectOption[]> => {\n const groups: Record<string, SelectOption[]> = {};\n options.forEach((opt) => {\n const group = opt.group || '__default';\n if (!groups[group]) groups[group] = [];\n groups[group].push(opt);\n });\n return groups;\n};\n\n/**\n * Normaliza el valor single al shape que espera MUI Select: string vacío si\n * el valor es `null`/`undefined`.\n */\nexport const normalizeSelectValue = <T>(value: T | null | undefined): T | '' =>\n (value ?? '') as T | '';\n\n/** `true` si el valor está vacío (para shrink del label + placeholder). */\nexport const isSelectValueEmpty = (normalizedValue: unknown): boolean =>\n normalizedValue === '' ||\n normalizedValue === null ||\n normalizedValue === undefined;\n","import React from 'react';\nimport { ListItemIcon, MenuItem } from '@mui/material';\nimport CheckIcon from '@mui/icons-material/Check';\n\nimport type { SelectOption, RenderOptionItem } from '../Select';\n\ninterface RenderSelectMenuItemArgs {\n option: SelectOption;\n selected: boolean;\n customRender?: RenderOptionItem | null;\n}\n\n/**\n * Render helper (no componente) que devuelve un <MenuItem> listo para\n * colocarse como hijo directo del <MuiSelect>. Se implementa como función\n * y no como componente porque MUI Select inspecciona `props.value` de sus\n * children para resolver la selección, y envolverlo en un componente extra\n * rompe esa detección.\n *\n * Incluye el icono de check a la izquierda cuando `selected` es true. Si el\n * consumer pasó un `<Option>{(opt) => ...}</Option>`, usa ese render para el\n * contenido principal; de lo contrario muestra `option.label`.\n */\nexport const renderSelectMenuItem = ({\n option,\n selected,\n customRender,\n}: RenderSelectMenuItemArgs): React.ReactElement => (\n <MenuItem\n key={String(option.value)}\n value={option.value}\n disabled={option.disabled}\n selected={selected}\n >\n <ListItemIcon sx={{ minWidth: 32 }}>\n {selected && <CheckIcon color=\"success\" fontSize=\"small\" />}\n </ListItemIcon>\n {customRender ? customRender(option) : option.label}\n </MenuItem>\n);\n","import { Avatar, Box, Chip, Typography } from '@mui/material';\nimport ClearIcon from '@mui/icons-material/Clear';\n\nimport type {\n SelectOption,\n RenderChipLabel,\n ChipVariant,\n} from '../Select';\n\ninterface SelectValueProps<TValue extends SelectOption['value']> {\n selected: TValue | TValue[] | null | undefined;\n options: SelectOption[];\n multiple: boolean;\n placeholder?: string;\n maxChipsToShow: number;\n chipVariant: ChipVariant;\n renderChipLabel?: RenderChipLabel;\n /** Solo relevante en modo multiple. Recibe el nuevo array de valores. */\n onDeleteChip?: (nextValues: TValue[]) => void;\n /** Array de valores actuales (para componer el nuevo array al borrar chips). */\n currentValues?: TValue[];\n}\n\n/**\n * Render del valor seleccionado del Select.\n * - single: texto (label) o lo que devuelva `renderChipLabel`.\n * - multiple: chips con delete. Trunca después de `maxChipsToShow` mostrando \"+N más\".\n * - empty: placeholder en color disabled.\n */\nexport function SelectValue<TValue extends SelectOption['value']>(\n props: SelectValueProps<TValue>,\n) {\n const {\n selected,\n options,\n multiple,\n placeholder,\n maxChipsToShow,\n chipVariant,\n renderChipLabel,\n onDeleteChip,\n currentValues,\n } = props;\n\n const isEmpty =\n !selected || (Array.isArray(selected) && selected.length === 0);\n\n if (isEmpty) {\n return (\n <Typography sx={{ color: 'text.disabled' }}>{placeholder || ''}</Typography>\n );\n }\n\n if (!multiple) {\n const item = options.find((opt) => opt.value === selected);\n if (renderChipLabel && item) return <>{renderChipLabel(item)}</>;\n return <>{item?.label ?? String(selected)}</>;\n }\n\n const selectedValuesArray = selected as TValue[];\n const displayedChips = selectedValuesArray.slice(0, maxChipsToShow);\n const hiddenChipsCount = selectedValuesArray.length - maxChipsToShow;\n\n const handleDelete = (chipValue: TValue) => {\n if (!onDeleteChip || !currentValues) return;\n onDeleteChip(currentValues.filter((v) => v !== chipValue));\n };\n\n return (\n <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>\n {displayedChips.map((val) => {\n const item = options.find((o) => o.value === val);\n if (!item) return null;\n\n return (\n <Chip\n variant={chipVariant}\n color=\"primary\"\n size=\"small\"\n key={String(val)}\n label={renderChipLabel ? renderChipLabel(item) : item.label}\n avatar={item.img ? <Avatar src={item.img} /> : undefined}\n onDelete={() => handleDelete(val)}\n deleteIcon={<ClearIcon fontSize=\"small\" />}\n />\n );\n })}\n {hiddenChipsCount > 0 && (\n <Chip size=\"small\" variant={chipVariant} label={`+${hiddenChipsCount} más`} />\n )}\n </Box>\n );\n}\n\nexport default SelectValue;\n","import {\n Children,\n isValidElement,\n useMemo,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n FilledInput,\n FormControl,\n FormHelperText,\n InputLabel,\n ListSubheader,\n OutlinedInput,\n Select as MuiSelect,\n type SelectChangeEvent,\n type SelectProps as MuiSelectProps,\n} from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildSelectSx } from './Select.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\nimport {\n groupOptions,\n isSelectValueEmpty,\n normalizeSelectValue,\n} from './Select.helpers';\nimport { renderSelectMenuItem } from './_parts/SelectMenuItem';\nimport { SelectValue } from './_parts/SelectValue';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface SelectOption {\n value: string | number;\n label: string;\n img?: string;\n disabled?: boolean;\n group?: string;\n [key: string]: any;\n}\n\nexport type LabelPosition = 'outside' | 'floating';\nexport type SelectSize = 'small' | 'medium';\n\n// ── Render slots ─────────────────────────────────────────────────────────\nexport type RenderOptionItem = (item: SelectOption) => ReactNode;\n\n/** Variante visual de los chips en modo `multiple`. */\nexport type ChipVariant = 'filled' | 'outlined';\n/** Render custom del label de cada chip/valor seleccionado. */\nexport type RenderChipLabel = (item: SelectOption) => ReactNode;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport interface OptionProps {\n children: RenderOptionItem;\n}\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport interface BaseSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> {\n label?: string;\n options?: SelectOption[];\n defaultValue?: TValue;\n size?: SelectSize;\n placeholder?: string;\n children?: ReactElement<{ children: RenderOptionItem }>;\n maxHeight?: number | string;\n maxWidth?: number | string;\n disabled?: boolean;\n error?: boolean;\n helperText?: string;\n /** Border radius del input (px o string CSS). Default: 10 */\n borderRadius?: number | string;\n /**\n * Posición del label.\n * - \"outside\" (default): label arriba del input, sin animación.\n * - \"floating\": label clásico de MUI (flota dentro del notched outline).\n */\n labelPosition?: LabelPosition;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.Select`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n * - Cualquier otro string = mergea el preset encima del estilo built-in.\n */\n preset?: string;\n /** MUI input variant. Default: 'outlined'. */\n variant?: 'outlined' | 'filled';\n sx?: MuiSelectProps['sx'];\n className?: string;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name: string;\n // `any` plano (no `Control<any>`): RHF tipa `Control<T>` con generics en\n // posiciones tanto contravariantes como covariantes (ej. `_subjects.state`).\n // Cuando el componente tiene generics propios (como `TValue` acá), TS se\n // confunde narroweando el discriminated union y `Control<any>` no logra\n // absorber `Control<MyForm>` en la comparación estructural profunda.\n // El `any` plano elimina ese ruido. RHF adentro sigue teniendo sus tipos\n // fuertes — solo degradamos la superficie del prop del Select.\n control: any;\n validation?: RegisterOptions;\n /**\n * Side-effect que corre después de que RHF actualiza el form state.\n * Útil para cascadas entre campos (ej. reset de municipio al cambiar\n * departamento). NO reemplaza al handler de RHF.\n */\n onValueChange?: (value: TValue) => void;\n multiple?: false;\n value?: never;\n onChange?: never;\n}\n\nexport interface StandardSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name?: string;\n control?: never;\n validation?: never;\n multiple?: false;\n value: TValue;\n onChange: (val: TValue) => void;\n}\n\nexport interface MultipleSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name?: string;\n control?: never;\n validation?: never;\n multiple: true;\n value: TValue[];\n onChange: (val: TValue[]) => void;\n /** Máximo de chips visibles antes de truncar con \"+N más\". Default: 3. */\n maxChipsToShow?: number;\n /** Variante visual de los chips. Default: 'filled'. */\n chipVariant?: ChipVariant;\n /** Render custom del label de cada chip. */\n renderChipLabel?: RenderChipLabel;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type SelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> =\n | RHFSelectProps<TValue>\n | StandardSelectProps<TValue>\n | MultipleSelectProps<TValue>;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport function Option(_props: OptionProps) {\n return null;\n}\nOption.displayName = 'Option';\n\n// ── Componente ───────────────────────────────────────────────────────────\nexport function Select<\n TValue extends SelectOption['value'] = SelectOption['value'],\n>(props: SelectProps<TValue>) {\n const {\n label,\n options = [],\n defaultValue,\n size = 'small',\n placeholder,\n children,\n maxHeight = 300,\n maxWidth,\n disabled = false,\n error = false,\n helperText,\n borderRadius = 10,\n labelPosition = 'outside',\n preset,\n variant = 'outlined',\n sx,\n className,\n multiple = false,\n maxChipsToShow = 3,\n chipVariant = 'filled',\n renderChipLabel,\n // Separamos estos aunque no se usen directamente acá — evita que lleguen\n // al DOM del MuiSelect via `{...rest}` y generen warnings de React.\n name: _nameIgnored,\n control: _controlIgnored,\n validation: _validationIgnored,\n value: _valueIgnored,\n onChange: _onChangeIgnored,\n ...rest\n } = props as StandardSelectProps<TValue> & {\n name?: string;\n control?: Control<any>;\n validation?: RegisterOptions;\n multiple?: boolean;\n maxChipsToShow?: number;\n chipVariant?: ChipVariant;\n renderChipLabel?: RenderChipLabel;\n };\n\n const theme = useTheme();\n const presetSx = resolvePreset('Select', preset, theme);\n\n const isRHFMode = 'control' in props && (props as RHFSelectProps<TValue>).control !== undefined;\n\n // Custom render opcional vía <Option>{item => ...}</Option>\n const customRender: RenderOptionItem | null = useMemo(() => {\n if (Children.count(children) === 1) {\n const child = Children.only(children);\n if (isValidElement(child) && (child.type as any)?.displayName === 'Option') {\n return (child.props as OptionProps).children;\n }\n }\n return null;\n }, [children]);\n\n // Focus/open tracking para el comportamiento del label \"outside\".\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n\n const groupedOptions = useMemo(() => groupOptions(options), [options]);\n\n // Items del menú (grupos + opciones). Un solo memoizado — sin search/async.\n const buildMenuItems = (currentValue: TValue | TValue[] | '') => {\n const items: ReactNode[] = [];\n Object.entries(groupedOptions).forEach(([group, opts]) => {\n if (group !== '__default') {\n items.push(\n <ListSubheader key={group} disableSticky>\n {group}\n </ListSubheader>,\n );\n }\n opts.forEach((opt) => {\n const selected = Array.isArray(currentValue)\n ? currentValue.includes(opt.value as TValue)\n : currentValue === opt.value;\n items.push(\n renderSelectMenuItem({\n option: opt,\n selected,\n customRender,\n }),\n );\n });\n });\n return items;\n };\n\n const mergedSx = [\n ...(presetSx ? [presetSx] : [buildSelectSx(borderRadius, labelPosition)]),\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n // Render base (común a RHF y controlled)\n const renderSelect = (\n selectValue: TValue | TValue[] | null | undefined,\n selectOnChange: (event: SelectChangeEvent<TValue | TValue[]>) => void,\n onBlur?: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void,\n inputRef?: React.Ref<HTMLInputElement>,\n rhfError?: boolean,\n rhfHelperText?: string,\n onValuesChange?: (next: TValue[]) => void,\n ) => {\n const finalError = !!rhfError || !!error;\n const finalHelperText = rhfHelperText ?? helperText;\n\n const inputElement =\n variant === 'filled'\n ? <FilledInput />\n : labelPosition === 'floating'\n ? <OutlinedInput label={label} />\n : <OutlinedInput />;\n\n const normalizedValue = multiple\n ? ((selectValue as TValue[] | null | undefined) ?? [])\n : normalizeSelectValue(selectValue as TValue | null | undefined);\n const isEmpty = multiple\n ? (normalizedValue as TValue[]).length === 0\n : isSelectValueEmpty(normalizedValue);\n\n // Shrink cuando hay valor, foco, o dropdown abierto.\n const shouldShrink = !isEmpty || isFocused || isOpen;\n // Placeholder solo cuando el label ya subió.\n const shouldDisplayPlaceholder =\n isEmpty && (isFocused || isOpen) && !!placeholder;\n\n return (\n <FormControl\n fullWidth\n size={size}\n variant={variant}\n error={finalError}\n disabled={disabled}\n className={className}\n sx={mergedSx}\n >\n {label && <InputLabel shrink={shouldShrink}>{label}</InputLabel>}\n <MuiSelect<TValue | TValue[]>\n multiple={multiple}\n value={normalizedValue as TValue | TValue[]}\n onChange={selectOnChange}\n onBlur={(e) => {\n setIsFocused(false);\n onBlur?.(e);\n }}\n onFocus={() => setIsFocused(true)}\n onOpen={() => setIsOpen(true)}\n onClose={() => setIsOpen(false)}\n renderValue={(selected) => (\n <SelectValue<TValue>\n selected={selected as TValue | TValue[]}\n options={options}\n multiple={multiple}\n placeholder={placeholder}\n maxChipsToShow={maxChipsToShow}\n chipVariant={chipVariant}\n renderChipLabel={renderChipLabel}\n currentValues={multiple ? (selected as TValue[]) : undefined}\n onDeleteChip={onValuesChange}\n />\n )}\n displayEmpty={shouldDisplayPlaceholder}\n input={inputElement}\n disabled={disabled}\n MenuProps={{\n PaperProps: {\n style: { maxHeight, maxWidth },\n },\n }}\n inputRef={inputRef}\n {...(rest as any)}\n >\n {buildMenuItems(normalizedValue as TValue | TValue[] | '')}\n </MuiSelect>\n {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n </FormControl>\n );\n };\n\n // ── RHF mode ──────────────────────────────────────────────────────────\n if (isRHFMode) {\n const { name, control, validation, onValueChange } = props as RHFSelectProps<TValue>;\n return (\n <Controller\n name={name}\n control={control}\n rules={validation}\n defaultValue={defaultValue}\n render={({ field, fieldState: { error: fieldError } }) =>\n renderSelect(\n field.value ?? null,\n (e) => {\n const next = e.target.value as TValue;\n field.onChange(next);\n onValueChange?.(next);\n },\n field.onBlur,\n field.ref,\n !!fieldError,\n fieldError?.message,\n (nextVals) => {\n field.onChange(nextVals);\n onValueChange?.(nextVals as unknown as TValue);\n },\n )\n }\n />\n );\n }\n\n // ── Controlled mode (single o multiple) ───────────────────────────────\n const { value, onChange } = props as\n | StandardSelectProps<TValue>\n | MultipleSelectProps<TValue>;\n const handleChange = onChange as (val: TValue | TValue[]) => void;\n return renderSelect(\n value as TValue | TValue[],\n (e) => handleChange(e.target.value as TValue | TValue[]),\n undefined,\n undefined,\n undefined,\n undefined,\n (next) => (onChange as (val: TValue[]) => void)(next),\n );\n}\n\nexport default Select;\n"],"names":["_a","MuiSelect"],"mappings":"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"}
package/components/Modal/Modal.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
- const Modal = require("../../Modal-BN5s-Tfk.cjs");
4
- exports.Modal = Modal.Modal;
3
+ const Modal = require("../../Modal-CkpuI8ns.cjs");
4
+ exports.Modal = Modal.ModalWithStatics;
5
5
  exports.ModalBody = Modal.ModalBody;
6
6
  exports.ModalFooter = Modal.ModalFooter;
7
7
  exports.ModalHeader = Modal.ModalHeader;
package/components/Modal/Modal.js CHANGED
@@ -1,9 +1,9 @@
1
- import { a, c, d, b, M } from "../../Modal-BRZMPwDj.js";
1
+ import { M, b, c, a, M as M2 } from "../../Modal-BFpX5AFV.js";
2
2
  export {
3
- a as Modal,
4
- c as ModalBody,
5
- d as ModalFooter,
6
- b as ModalHeader,
7
- M as default
3
+ M as Modal,
4
+ b as ModalBody,
5
+ c as ModalFooter,
6
+ a as ModalHeader,
7
+ M2 as default
8
8
  };
9
9
  //# sourceMappingURL=Modal.js.map
package/components/Modal/index.d.ts CHANGED
@@ -1,5 +1,4 @@
1
- export { default } from './Modal';
2
- export { Modal } from './Modal';
1
+ export { default, default as Modal } from './Modal';
3
2
  export type { ModalRef, ModalMode, ModalSeverity } from './Modal';
4
3
  export { ModalHeader } from './ModalHeader';
5
4
  export type { ModalHeaderProps } from './ModalHeader';
package/components/Select/Select.cjs CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
- const Select = require("../../Select-kqR48jZU.cjs");
3
+ const Select = require("../../Select-CmxXLeJZ.cjs");
4
4
  exports.Option = Select.Option;
5
5
  exports.Select = Select.Select;
6
6
  exports.default = Select.Select;
package/components/Select/Select.d.ts CHANGED
@@ -12,6 +12,10 @@ export interface SelectOption {
12
12
  export type LabelPosition = 'outside' | 'floating';
13
13
  export type SelectSize = 'small' | 'medium';
14
14
  export type RenderOptionItem = (item: SelectOption) => ReactNode;
15
+ /** Variante visual de los chips en modo `multiple`. */
16
+ export type ChipVariant = 'filled' | 'outlined';
17
+ /** Render custom del label de cada chip/valor seleccionado. */
18
+ export type RenderChipLabel = (item: SelectOption) => ReactNode;
15
19
  export interface OptionProps {
16
20
  children: RenderOptionItem;
17
21
  }
@@ -58,6 +62,7 @@ export interface RHFSelectProps<TValue extends SelectOption['value'] = SelectOpt
58
62
  * departamento). NO reemplaza al handler de RHF.
59
63
  */
60
64
  onValueChange?: (value: TValue) => void;
65
+ multiple?: false;
61
66
  value?: never;
62
67
  onChange?: never;
63
68
  }
@@ -65,10 +70,25 @@ export interface StandardSelectProps<TValue extends SelectOption['value'] = Sele
65
70
  name?: string;
66
71
  control?: never;
67
72
  validation?: never;
73
+ multiple?: false;
68
74
  value: TValue;
69
75
  onChange: (val: TValue) => void;
70
76
  }
71
- export type SelectProps<TValue extends SelectOption['value'] = SelectOption['value']> = RHFSelectProps<TValue> | StandardSelectProps<TValue>;
77
+ export interface MultipleSelectProps<TValue extends SelectOption['value'] = SelectOption['value']> extends BaseSelectProps<TValue> {
78
+ name?: string;
79
+ control?: never;
80
+ validation?: never;
81
+ multiple: true;
82
+ value: TValue[];
83
+ onChange: (val: TValue[]) => void;
84
+ /** Máximo de chips visibles antes de truncar con "+N más". Default: 3. */
85
+ maxChipsToShow?: number;
86
+ /** Variante visual de los chips. Default: 'filled'. */
87
+ chipVariant?: ChipVariant;
88
+ /** Render custom del label de cada chip. */
89
+ renderChipLabel?: RenderChipLabel;
90
+ }
91
+ export type SelectProps<TValue extends SelectOption['value'] = SelectOption['value']> = RHFSelectProps<TValue> | StandardSelectProps<TValue> | MultipleSelectProps<TValue>;
72
92
  export declare function Option(_props: OptionProps): null;
73
93
  export declare namespace Option {
74
94
  var displayName: string;
package/components/Select/Select.js CHANGED
@@ -1,4 +1,4 @@
1
- import { O, S, S as S2 } from "../../Select-Dycmh9vt.js";
1
+ import { O, S, S as S2 } from "../../Select-DRLcIE7M.js";
2
2
  export {
3
3
  O as Option,
4
4
  S as Select,
package/components/Select/index.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  export { Select, Option, default } from './Select';
2
- export type { SelectProps, SelectOption, OptionProps, BaseSelectProps, RHFSelectProps, StandardSelectProps, RenderOptionItem, LabelPosition, SelectSize, } from './Select';
2
+ export type { SelectProps, SelectOption, OptionProps, BaseSelectProps, RHFSelectProps, StandardSelectProps, MultipleSelectProps, RenderOptionItem, ChipVariant, RenderChipLabel, LabelPosition, SelectSize, } from './Select';
package/index.cjs CHANGED
@@ -13,9 +13,9 @@ const Step = require("./Step-Nd7SJbRZ.cjs");
13
13
  const Tab = require("./Tab-BbP8jBcK.cjs");
14
14
  const Table = require("./Table-C4OM6rrC.cjs");
15
15
  const StatusMessage = require("./StatusMessage-B3nXpuRl.cjs");
16
- const Modal = require("./Modal-BN5s-Tfk.cjs");
16
+ const Modal = require("./Modal-CkpuI8ns.cjs");
17
17
  const Input = require("./Input-CScC87J5.cjs");
18
- const Select = require("./Select-kqR48jZU.cjs");
18
+ const Select = require("./Select-CmxXLeJZ.cjs");
19
19
  const Autocomplete = require("./Autocomplete-CejWztBY.cjs");
20
20
  const Switch = require("./Switch-CQFOopYy.cjs");
21
21
  const RadioGroup = require("./RadioGroup-Dd0rHXSX.cjs");
@@ -172,7 +172,7 @@ exports.Tab = Tab.Tab;
172
172
  exports.Tabs = Tab.Tabs;
173
173
  exports.Table = Table.Table;
174
174
  exports.StatusMessage = StatusMessage.StatusMessage;
175
- exports.Modal = Modal.Modal;
175
+ exports.Modal = Modal.ModalWithStatics;
176
176
  exports.ModalBody = Modal.ModalBody;
177
177
  exports.ModalFooter = Modal.ModalFooter;
178
178
  exports.ModalHeader = Modal.ModalHeader;
package/index.js CHANGED
@@ -11,9 +11,9 @@ import { a, S as S2 } from "./Step-BArsou1V.js";
11
11
  import { a as a2, T } from "./Tab-BxSxKJsP.js";
12
12
  import { T as T2 } from "./Table-C2LbW0B1.js";
13
13
  import { S as S3 } from "./StatusMessage-D0WgSBx7.js";
14
- import { a as a3, c, d, b } from "./Modal-BRZMPwDj.js";
14
+ import { M, b, c, a as a3 } from "./Modal-BFpX5AFV.js";
15
15
  import { I } from "./Input-DP_fKl38.js";
16
- import { O, S as S4 } from "./Select-Dycmh9vt.js";
16
+ import { O, S as S4 } from "./Select-DRLcIE7M.js";
17
17
  import { A as A2, a as a4 } from "./Autocomplete-C_lW1VER.js";
18
18
  import { S as S5 } from "./Switch-D72dpkH2.js";
19
19
  import { R } from "./RadioGroup-bO-ahP9T.js";
@@ -60,10 +60,10 @@ export {
60
60
  ListItemIcon,
61
61
  ListItemText,
62
62
  ListSubheader,
63
- a3 as Modal,
64
- c as ModalBody,
65
- d as ModalFooter,
66
- b as ModalHeader,
63
+ M as Modal,
64
+ b as ModalBody,
65
+ c as ModalFooter,
66
+ a3 as ModalHeader,
67
67
  O as Option,
68
68
  Paper,
69
69
  R as RadioGroup,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@soyfri/shared-library",
3
- "version": "2.0.0-beta.25",
3
+ "version": "2.0.0-beta.27",
4
4
  "main": "./index.cjs",
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
package/Select-Dycmh9vt.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"Select-Dycmh9vt.js","sources":["../src/components/Select/Select.sx.ts","../src/components/Select/Select.helpers.ts","../src/components/Select/_parts/SelectMenuItem.tsx","../src/components/Select/Select.tsx"],"sourcesContent":["import type { SelectProps as MuiSelectProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport type { LabelPosition } from './Select';\n\n/**\n * Builder de sx para el Select. Usa el builder compartido\n * `buildFormFieldSx`. El Select no necesita overrides específicos.\n */\nexport const buildSelectSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): MuiSelectProps['sx'] =>\n buildFormFieldSx({ borderRadius, labelPosition }) as MuiSelectProps['sx'];\n","import type { SelectOption } from './Select';\n\n/**\n * Agrupa opciones por la propiedad `group`. Las opciones sin group caen\n * bajo la key especial `__default`. Devuelve un Record para iterar en orden\n * de inserción con Object.entries.\n */\nexport const groupOptions = (\n options: SelectOption[],\n): Record<string, SelectOption[]> => {\n const groups: Record<string, SelectOption[]> = {};\n options.forEach((opt) => {\n const group = opt.group || '__default';\n if (!groups[group]) groups[group] = [];\n groups[group].push(opt);\n });\n return groups;\n};\n\n/**\n * Normaliza el valor single al shape que espera MUI Select: string vacío si\n * el valor es `null`/`undefined`.\n */\nexport const normalizeSelectValue = <T>(value: T | null | undefined): T | '' =>\n (value ?? '') as T | '';\n\n/** `true` si el valor está vacío (para shrink del label + placeholder). */\nexport const isSelectValueEmpty = (normalizedValue: unknown): boolean =>\n normalizedValue === '' ||\n normalizedValue === null ||\n normalizedValue === undefined;\n","import React from 'react';\nimport { ListItemIcon, MenuItem } from '@mui/material';\nimport CheckIcon from '@mui/icons-material/Check';\n\nimport type { SelectOption, RenderOptionItem } from '../Select';\n\ninterface RenderSelectMenuItemArgs {\n option: SelectOption;\n selected: boolean;\n customRender?: RenderOptionItem | null;\n}\n\n/**\n * Render helper (no componente) que devuelve un <MenuItem> listo para\n * colocarse como hijo directo del <MuiSelect>. Se implementa como función\n * y no como componente porque MUI Select inspecciona `props.value` de sus\n * children para resolver la selección, y envolverlo en un componente extra\n * rompe esa detección.\n *\n * Incluye el icono de check a la izquierda cuando `selected` es true. Si el\n * consumer pasó un `<Option>{(opt) => ...}</Option>`, usa ese render para el\n * contenido principal; de lo contrario muestra `option.label`.\n */\nexport const renderSelectMenuItem = ({\n option,\n selected,\n customRender,\n}: RenderSelectMenuItemArgs): React.ReactElement => (\n <MenuItem\n key={String(option.value)}\n value={option.value}\n disabled={option.disabled}\n selected={selected}\n >\n <ListItemIcon sx={{ minWidth: 32 }}>\n {selected && <CheckIcon color=\"success\" fontSize=\"small\" />}\n </ListItemIcon>\n {customRender ? customRender(option) : option.label}\n </MenuItem>\n);\n","import {\n Children,\n isValidElement,\n useMemo,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n FilledInput,\n FormControl,\n FormHelperText,\n InputLabel,\n ListSubheader,\n OutlinedInput,\n Select as MuiSelect,\n Typography,\n type SelectChangeEvent,\n type SelectProps as MuiSelectProps,\n} from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildSelectSx } from './Select.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\nimport {\n groupOptions,\n isSelectValueEmpty,\n normalizeSelectValue,\n} from './Select.helpers';\nimport { renderSelectMenuItem } from './_parts/SelectMenuItem';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface SelectOption {\n value: string | number;\n label: string;\n img?: string;\n disabled?: boolean;\n group?: string;\n [key: string]: any;\n}\n\nexport type LabelPosition = 'outside' | 'floating';\nexport type SelectSize = 'small' | 'medium';\n\n// ── Render slots ─────────────────────────────────────────────────────────\nexport type RenderOptionItem = (item: SelectOption) => ReactNode;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport interface OptionProps {\n children: RenderOptionItem;\n}\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport interface BaseSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> {\n label?: string;\n options?: SelectOption[];\n defaultValue?: TValue;\n size?: SelectSize;\n placeholder?: string;\n children?: ReactElement<{ children: RenderOptionItem }>;\n maxHeight?: number | string;\n maxWidth?: number | string;\n disabled?: boolean;\n error?: boolean;\n helperText?: string;\n /** Border radius del input (px o string CSS). Default: 10 */\n borderRadius?: number | string;\n /**\n * Posición del label.\n * - \"outside\" (default): label arriba del input, sin animación.\n * - \"floating\": label clásico de MUI (flota dentro del notched outline).\n */\n labelPosition?: LabelPosition;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.Select`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n * - Cualquier otro string = mergea el preset encima del estilo built-in.\n */\n preset?: string;\n /** MUI input variant. Default: 'outlined'. */\n variant?: 'outlined' | 'filled';\n sx?: MuiSelectProps['sx'];\n className?: string;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name: string;\n // `any` plano (no `Control<any>`): RHF tipa `Control<T>` con generics en\n // posiciones tanto contravariantes como covariantes (ej. `_subjects.state`).\n // Cuando el componente tiene generics propios (como `TValue` acá), TS se\n // confunde narroweando el discriminated union y `Control<any>` no logra\n // absorber `Control<MyForm>` en la comparación estructural profunda.\n // El `any` plano elimina ese ruido. RHF adentro sigue teniendo sus tipos\n // fuertes — solo degradamos la superficie del prop del Select.\n control: any;\n validation?: RegisterOptions;\n /**\n * Side-effect que corre después de que RHF actualiza el form state.\n * Útil para cascadas entre campos (ej. reset de municipio al cambiar\n * departamento). NO reemplaza al handler de RHF.\n */\n onValueChange?: (value: TValue) => void;\n value?: never;\n onChange?: never;\n}\n\nexport interface StandardSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name?: string;\n control?: never;\n validation?: never;\n value: TValue;\n onChange: (val: TValue) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type SelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> = RHFSelectProps<TValue> | StandardSelectProps<TValue>;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport function Option(_props: OptionProps) {\n return null;\n}\nOption.displayName = 'Option';\n\n// ── Componente ───────────────────────────────────────────────────────────\nexport function Select<\n TValue extends SelectOption['value'] = SelectOption['value'],\n>(props: SelectProps<TValue>) {\n const {\n label,\n options = [],\n defaultValue,\n size = 'small',\n placeholder,\n children,\n maxHeight = 300,\n maxWidth,\n disabled = false,\n error = false,\n helperText,\n borderRadius = 10,\n labelPosition = 'outside',\n preset,\n variant = 'outlined',\n sx,\n className,\n // Separamos estos aunque no se usen directamente acá — evita que lleguen\n // al DOM del MuiSelect via `{...rest}` y generen warnings de React.\n name: _nameIgnored,\n control: _controlIgnored,\n validation: _validationIgnored,\n value: _valueIgnored,\n onChange: _onChangeIgnored,\n ...rest\n } = props as StandardSelectProps<TValue> & {\n name?: string;\n control?: Control<any>;\n validation?: RegisterOptions;\n };\n\n const theme = useTheme();\n const presetSx = resolvePreset('Select', preset, theme);\n\n const isRHFMode = 'control' in props && (props as RHFSelectProps<TValue>).control !== undefined;\n\n // Custom render opcional vía <Option>{item => ...}</Option>\n const customRender: RenderOptionItem | null = useMemo(() => {\n if (Children.count(children) === 1) {\n const child = Children.only(children);\n if (isValidElement(child) && (child.type as any)?.displayName === 'Option') {\n return (child.props as OptionProps).children;\n }\n }\n return null;\n }, [children]);\n\n // Focus/open tracking para el comportamiento del label \"outside\".\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n\n const groupedOptions = useMemo(() => groupOptions(options), [options]);\n\n // Items del menú (grupos + opciones). Un solo memoizado — sin search/async.\n const buildMenuItems = (currentValue: TValue | '') => {\n const items: ReactNode[] = [];\n Object.entries(groupedOptions).forEach(([group, opts]) => {\n if (group !== '__default') {\n items.push(\n <ListSubheader key={group} disableSticky>\n {group}\n </ListSubheader>,\n );\n }\n opts.forEach((opt) => {\n const selected = currentValue === opt.value;\n items.push(\n renderSelectMenuItem({\n option: opt,\n selected,\n customRender,\n }),\n );\n });\n });\n return items;\n };\n\n const mergedSx = [\n ...(presetSx ? [presetSx] : [buildSelectSx(borderRadius, labelPosition)]),\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n // Render base (común a RHF y controlled)\n const renderSelect = (\n selectValue: TValue | null | undefined,\n selectOnChange: (event: SelectChangeEvent<TValue>) => void,\n onBlur?: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void,\n inputRef?: React.Ref<HTMLInputElement>,\n rhfError?: boolean,\n rhfHelperText?: string,\n ) => {\n const finalError = !!rhfError || !!error;\n const finalHelperText = rhfHelperText ?? helperText;\n\n const inputElement =\n variant === 'filled'\n ? <FilledInput />\n : labelPosition === 'floating'\n ? <OutlinedInput label={label} />\n : <OutlinedInput />;\n\n const normalizedValue = normalizeSelectValue(selectValue);\n const isEmpty = isSelectValueEmpty(normalizedValue);\n\n // Shrink cuando hay valor, foco, o dropdown abierto.\n const shouldShrink = !isEmpty || isFocused || isOpen;\n // Placeholder solo cuando el label ya subió.\n const shouldDisplayPlaceholder =\n isEmpty && (isFocused || isOpen) && !!placeholder;\n\n return (\n <FormControl\n fullWidth\n size={size}\n variant={variant}\n error={finalError}\n disabled={disabled}\n className={className}\n sx={mergedSx}\n >\n {label && <InputLabel shrink={shouldShrink}>{label}</InputLabel>}\n <MuiSelect<TValue>\n value={normalizedValue as TValue}\n onChange={selectOnChange}\n onBlur={(e) => {\n setIsFocused(false);\n onBlur?.(e);\n }}\n onFocus={() => setIsFocused(true)}\n onOpen={() => setIsOpen(true)}\n onClose={() => setIsOpen(false)}\n renderValue={(selected) => {\n if (isSelectValueEmpty(selected)) {\n return (\n <Typography sx={{ color: 'text.disabled' }}>\n {placeholder ?? ''}\n </Typography>\n );\n }\n const item = options.find((opt) => opt.value === selected);\n return item?.label ?? String(selected);\n }}\n displayEmpty={shouldDisplayPlaceholder}\n input={inputElement}\n disabled={disabled}\n MenuProps={{\n PaperProps: {\n style: { maxHeight, maxWidth },\n },\n }}\n inputRef={inputRef}\n {...(rest as any)}\n >\n {buildMenuItems(normalizedValue as TValue | '')}\n </MuiSelect>\n {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n </FormControl>\n );\n };\n\n // ── RHF mode ──────────────────────────────────────────────────────────\n if (isRHFMode) {\n const { name, control, validation, onValueChange } = props as RHFSelectProps<TValue>;\n return (\n <Controller\n name={name}\n control={control}\n rules={validation}\n defaultValue={defaultValue}\n render={({ field, fieldState: { error: fieldError } }) =>\n renderSelect(\n field.value ?? null,\n (e) => {\n const next = e.target.value as TValue;\n field.onChange(next);\n onValueChange?.(next);\n },\n field.onBlur,\n field.ref,\n !!fieldError,\n fieldError?.message,\n )\n }\n />\n );\n }\n\n // ── Controlled mode ───────────────────────────────────────────────────\n const { value, onChange } = props as StandardSelectProps<TValue>;\n return renderSelect(value, (e) => onChange(e.target.value as TValue));\n}\n\nexport default Select;\n"],"names":["_a","MuiSelect"],"mappings":"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"}
package/Select-kqR48jZU.cjs.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"Select-kqR48jZU.cjs","sources":["../src/components/Select/Select.sx.ts","../src/components/Select/Select.helpers.ts","../src/components/Select/_parts/SelectMenuItem.tsx","../src/components/Select/Select.tsx"],"sourcesContent":["import type { SelectProps as MuiSelectProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport type { LabelPosition } from './Select';\n\n/**\n * Builder de sx para el Select. Usa el builder compartido\n * `buildFormFieldSx`. El Select no necesita overrides específicos.\n */\nexport const buildSelectSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): MuiSelectProps['sx'] =>\n buildFormFieldSx({ borderRadius, labelPosition }) as MuiSelectProps['sx'];\n","import type { SelectOption } from './Select';\n\n/**\n * Agrupa opciones por la propiedad `group`. Las opciones sin group caen\n * bajo la key especial `__default`. Devuelve un Record para iterar en orden\n * de inserción con Object.entries.\n */\nexport const groupOptions = (\n options: SelectOption[],\n): Record<string, SelectOption[]> => {\n const groups: Record<string, SelectOption[]> = {};\n options.forEach((opt) => {\n const group = opt.group || '__default';\n if (!groups[group]) groups[group] = [];\n groups[group].push(opt);\n });\n return groups;\n};\n\n/**\n * Normaliza el valor single al shape que espera MUI Select: string vacío si\n * el valor es `null`/`undefined`.\n */\nexport const normalizeSelectValue = <T>(value: T | null | undefined): T | '' =>\n (value ?? '') as T | '';\n\n/** `true` si el valor está vacío (para shrink del label + placeholder). */\nexport const isSelectValueEmpty = (normalizedValue: unknown): boolean =>\n normalizedValue === '' ||\n normalizedValue === null ||\n normalizedValue === undefined;\n","import React from 'react';\nimport { ListItemIcon, MenuItem } from '@mui/material';\nimport CheckIcon from '@mui/icons-material/Check';\n\nimport type { SelectOption, RenderOptionItem } from '../Select';\n\ninterface RenderSelectMenuItemArgs {\n option: SelectOption;\n selected: boolean;\n customRender?: RenderOptionItem | null;\n}\n\n/**\n * Render helper (no componente) que devuelve un <MenuItem> listo para\n * colocarse como hijo directo del <MuiSelect>. Se implementa como función\n * y no como componente porque MUI Select inspecciona `props.value` de sus\n * children para resolver la selección, y envolverlo en un componente extra\n * rompe esa detección.\n *\n * Incluye el icono de check a la izquierda cuando `selected` es true. Si el\n * consumer pasó un `<Option>{(opt) => ...}</Option>`, usa ese render para el\n * contenido principal; de lo contrario muestra `option.label`.\n */\nexport const renderSelectMenuItem = ({\n option,\n selected,\n customRender,\n}: RenderSelectMenuItemArgs): React.ReactElement => (\n <MenuItem\n key={String(option.value)}\n value={option.value}\n disabled={option.disabled}\n selected={selected}\n >\n <ListItemIcon sx={{ minWidth: 32 }}>\n {selected && <CheckIcon color=\"success\" fontSize=\"small\" />}\n </ListItemIcon>\n {customRender ? customRender(option) : option.label}\n </MenuItem>\n);\n","import {\n Children,\n isValidElement,\n useMemo,\n useState,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport {\n FilledInput,\n FormControl,\n FormHelperText,\n InputLabel,\n ListSubheader,\n OutlinedInput,\n Select as MuiSelect,\n Typography,\n type SelectChangeEvent,\n type SelectProps as MuiSelectProps,\n} from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildSelectSx } from './Select.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\nimport {\n groupOptions,\n isSelectValueEmpty,\n normalizeSelectValue,\n} from './Select.helpers';\nimport { renderSelectMenuItem } from './_parts/SelectMenuItem';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface SelectOption {\n value: string | number;\n label: string;\n img?: string;\n disabled?: boolean;\n group?: string;\n [key: string]: any;\n}\n\nexport type LabelPosition = 'outside' | 'floating';\nexport type SelectSize = 'small' | 'medium';\n\n// ── Render slots ─────────────────────────────────────────────────────────\nexport type RenderOptionItem = (item: SelectOption) => ReactNode;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport interface OptionProps {\n children: RenderOptionItem;\n}\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport interface BaseSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> {\n label?: string;\n options?: SelectOption[];\n defaultValue?: TValue;\n size?: SelectSize;\n placeholder?: string;\n children?: ReactElement<{ children: RenderOptionItem }>;\n maxHeight?: number | string;\n maxWidth?: number | string;\n disabled?: boolean;\n error?: boolean;\n helperText?: string;\n /** Border radius del input (px o string CSS). Default: 10 */\n borderRadius?: number | string;\n /**\n * Posición del label.\n * - \"outside\" (default): label arriba del input, sin animación.\n * - \"floating\": label clásico de MUI (flota dentro del notched outline).\n */\n labelPosition?: LabelPosition;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.Select`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n * - Cualquier otro string = mergea el preset encima del estilo built-in.\n */\n preset?: string;\n /** MUI input variant. Default: 'outlined'. */\n variant?: 'outlined' | 'filled';\n sx?: MuiSelectProps['sx'];\n className?: string;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name: string;\n // `any` plano (no `Control<any>`): RHF tipa `Control<T>` con generics en\n // posiciones tanto contravariantes como covariantes (ej. `_subjects.state`).\n // Cuando el componente tiene generics propios (como `TValue` acá), TS se\n // confunde narroweando el discriminated union y `Control<any>` no logra\n // absorber `Control<MyForm>` en la comparación estructural profunda.\n // El `any` plano elimina ese ruido. RHF adentro sigue teniendo sus tipos\n // fuertes — solo degradamos la superficie del prop del Select.\n control: any;\n validation?: RegisterOptions;\n /**\n * Side-effect que corre después de que RHF actualiza el form state.\n * Útil para cascadas entre campos (ej. reset de municipio al cambiar\n * departamento). NO reemplaza al handler de RHF.\n */\n onValueChange?: (value: TValue) => void;\n value?: never;\n onChange?: never;\n}\n\nexport interface StandardSelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n name?: string;\n control?: never;\n validation?: never;\n value: TValue;\n onChange: (val: TValue) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type SelectProps<\n TValue extends SelectOption['value'] = SelectOption['value'],\n> = RHFSelectProps<TValue> | StandardSelectProps<TValue>;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport function Option(_props: OptionProps) {\n return null;\n}\nOption.displayName = 'Option';\n\n// ── Componente ───────────────────────────────────────────────────────────\nexport function Select<\n TValue extends SelectOption['value'] = SelectOption['value'],\n>(props: SelectProps<TValue>) {\n const {\n label,\n options = [],\n defaultValue,\n size = 'small',\n placeholder,\n children,\n maxHeight = 300,\n maxWidth,\n disabled = false,\n error = false,\n helperText,\n borderRadius = 10,\n labelPosition = 'outside',\n preset,\n variant = 'outlined',\n sx,\n className,\n // Separamos estos aunque no se usen directamente acá — evita que lleguen\n // al DOM del MuiSelect via `{...rest}` y generen warnings de React.\n name: _nameIgnored,\n control: _controlIgnored,\n validation: _validationIgnored,\n value: _valueIgnored,\n onChange: _onChangeIgnored,\n ...rest\n } = props as StandardSelectProps<TValue> & {\n name?: string;\n control?: Control<any>;\n validation?: RegisterOptions;\n };\n\n const theme = useTheme();\n const presetSx = resolvePreset('Select', preset, theme);\n\n const isRHFMode = 'control' in props && (props as RHFSelectProps<TValue>).control !== undefined;\n\n // Custom render opcional vía <Option>{item => ...}</Option>\n const customRender: RenderOptionItem | null = useMemo(() => {\n if (Children.count(children) === 1) {\n const child = Children.only(children);\n if (isValidElement(child) && (child.type as any)?.displayName === 'Option') {\n return (child.props as OptionProps).children;\n }\n }\n return null;\n }, [children]);\n\n // Focus/open tracking para el comportamiento del label \"outside\".\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n\n const groupedOptions = useMemo(() => groupOptions(options), [options]);\n\n // Items del menú (grupos + opciones). Un solo memoizado — sin search/async.\n const buildMenuItems = (currentValue: TValue | '') => {\n const items: ReactNode[] = [];\n Object.entries(groupedOptions).forEach(([group, opts]) => {\n if (group !== '__default') {\n items.push(\n <ListSubheader key={group} disableSticky>\n {group}\n </ListSubheader>,\n );\n }\n opts.forEach((opt) => {\n const selected = currentValue === opt.value;\n items.push(\n renderSelectMenuItem({\n option: opt,\n selected,\n customRender,\n }),\n );\n });\n });\n return items;\n };\n\n const mergedSx = [\n ...(presetSx ? [presetSx] : [buildSelectSx(borderRadius, labelPosition)]),\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n // Render base (común a RHF y controlled)\n const renderSelect = (\n selectValue: TValue | null | undefined,\n selectOnChange: (event: SelectChangeEvent<TValue>) => void,\n onBlur?: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void,\n inputRef?: React.Ref<HTMLInputElement>,\n rhfError?: boolean,\n rhfHelperText?: string,\n ) => {\n const finalError = !!rhfError || !!error;\n const finalHelperText = rhfHelperText ?? helperText;\n\n const inputElement =\n variant === 'filled'\n ? <FilledInput />\n : labelPosition === 'floating'\n ? <OutlinedInput label={label} />\n : <OutlinedInput />;\n\n const normalizedValue = normalizeSelectValue(selectValue);\n const isEmpty = isSelectValueEmpty(normalizedValue);\n\n // Shrink cuando hay valor, foco, o dropdown abierto.\n const shouldShrink = !isEmpty || isFocused || isOpen;\n // Placeholder solo cuando el label ya subió.\n const shouldDisplayPlaceholder =\n isEmpty && (isFocused || isOpen) && !!placeholder;\n\n return (\n <FormControl\n fullWidth\n size={size}\n variant={variant}\n error={finalError}\n disabled={disabled}\n className={className}\n sx={mergedSx}\n >\n {label && <InputLabel shrink={shouldShrink}>{label}</InputLabel>}\n <MuiSelect<TValue>\n value={normalizedValue as TValue}\n onChange={selectOnChange}\n onBlur={(e) => {\n setIsFocused(false);\n onBlur?.(e);\n }}\n onFocus={() => setIsFocused(true)}\n onOpen={() => setIsOpen(true)}\n onClose={() => setIsOpen(false)}\n renderValue={(selected) => {\n if (isSelectValueEmpty(selected)) {\n return (\n <Typography sx={{ color: 'text.disabled' }}>\n {placeholder ?? ''}\n </Typography>\n );\n }\n const item = options.find((opt) => opt.value === selected);\n return item?.label ?? String(selected);\n }}\n displayEmpty={shouldDisplayPlaceholder}\n input={inputElement}\n disabled={disabled}\n MenuProps={{\n PaperProps: {\n style: { maxHeight, maxWidth },\n },\n }}\n inputRef={inputRef}\n {...(rest as any)}\n >\n {buildMenuItems(normalizedValue as TValue | '')}\n </MuiSelect>\n {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n </FormControl>\n );\n };\n\n // ── RHF mode ──────────────────────────────────────────────────────────\n if (isRHFMode) {\n const { name, control, validation, onValueChange } = props as RHFSelectProps<TValue>;\n return (\n <Controller\n name={name}\n control={control}\n rules={validation}\n defaultValue={defaultValue}\n render={({ field, fieldState: { error: fieldError } }) =>\n renderSelect(\n field.value ?? null,\n (e) => {\n const next = e.target.value as TValue;\n field.onChange(next);\n onValueChange?.(next);\n },\n field.onBlur,\n field.ref,\n !!fieldError,\n fieldError?.message,\n )\n }\n />\n );\n }\n\n // ── Controlled mode ───────────────────────────────────────────────────\n const { value, onChange } = props as StandardSelectProps<TValue>;\n return renderSelect(value, (e) => onChange(e.target.value as TValue));\n}\n\nexport default Select;\n"],"names":["buildFormFieldSx","jsxs","MenuItem","jsx","ListItemIcon","useTheme","resolvePreset","useMemo","Children","isValidElement","_a","useState","ListSubheader","FilledInput","OutlinedInput","FormControl","InputLabel","MuiSelect","Typography","FormHelperText","Controller"],"mappings":"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"}