@soyfri/shared-library 2.0.0-beta.24 → 2.0.0-beta.26
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.
- package/{Avatar-CivpVSfO.cjs → Avatar-Dw5rzayR.cjs} +4 -3
- package/Avatar-Dw5rzayR.cjs.map +1 -0
- package/{Avatar-_Lx4IH_1.js → Avatar-H8akSege.js} +4 -3
- package/Avatar-H8akSege.js.map +1 -0
- package/{Modal-BRZMPwDj.js → Modal-BFpX5AFV.js} +4 -5
- package/{Modal-BRZMPwDj.js.map → Modal-BFpX5AFV.js.map} +1 -1
- package/{Modal-BN5s-Tfk.cjs → Modal-CkpuI8ns.cjs} +1 -2
- package/{Modal-BN5s-Tfk.cjs.map → Modal-CkpuI8ns.cjs.map} +1 -1
- package/components/Avatar/Avatar.cjs +1 -1
- package/components/Avatar/Avatar.d.ts +4 -0
- package/components/Avatar/Avatar.js +1 -1
- package/components/Modal/Modal.cjs +2 -2
- package/components/Modal/Modal.js +6 -6
- package/components/Modal/index.d.ts +1 -2
- package/index.cjs +3 -3
- package/index.js +6 -6
- package/package.json +1 -1
- package/Avatar-CivpVSfO.cjs.map +0 -1
- package/Avatar-_Lx4IH_1.js.map +0 -1
|
@@ -49,6 +49,7 @@ const Avatar = ({
|
|
|
49
49
|
items,
|
|
50
50
|
src,
|
|
51
51
|
alt,
|
|
52
|
+
fallback,
|
|
52
53
|
type,
|
|
53
54
|
displayedAvatars = 4,
|
|
54
55
|
size = "sm",
|
|
@@ -60,7 +61,7 @@ const Avatar = ({
|
|
|
60
61
|
overlap
|
|
61
62
|
}) => {
|
|
62
63
|
var _a;
|
|
63
|
-
const resolvedItems = items && items.length > 0 ? items : src ? [{ imageUrl: src, text: alt }] : [];
|
|
64
|
+
const resolvedItems = items && items.length > 0 ? items : src || fallback ? [{ imageUrl: src, text: alt, content: fallback }] : [];
|
|
64
65
|
const showCaption = items && items.length > 0 ? showText : false;
|
|
65
66
|
const [failedUrls, setFailedUrls] = React.useState(/* @__PURE__ */ new Set());
|
|
66
67
|
const handleImageError = (url) => {
|
|
@@ -108,7 +109,7 @@ const Avatar = ({
|
|
|
108
109
|
}
|
|
109
110
|
},
|
|
110
111
|
sx: finalSx,
|
|
111
|
-
children: !hasImage && showBadgeFallback ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-label": item.text, children: item.badge }) : !hasImage ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
112
|
+
children: !hasImage && item.content != null ? item.content : !hasImage && showBadgeFallback ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-label": item.text, children: item.badge }) : !hasImage ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
112
113
|
AccountCircleIcon,
|
|
113
114
|
{
|
|
114
115
|
"aria-label": item.text,
|
|
@@ -162,4 +163,4 @@ const Avatar = ({
|
|
|
162
163
|
);
|
|
163
164
|
};
|
|
164
165
|
exports.Avatar = Avatar;
|
|
165
|
-
//# sourceMappingURL=Avatar-
|
|
166
|
+
//# sourceMappingURL=Avatar-Dw5rzayR.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Avatar-Dw5rzayR.cjs","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Avatar as MuiAvatar,\n Box,\n Tooltip,\n Typography,\n type SxProps,\n type Theme,\n} from '@mui/material';\nimport AccountCircleIcon from '@mui/icons-material/AccountCircle';\n\nexport interface AvatarItem {\n text?: string;\n imageUrl?: string;\n badge?: string;\n color?: string;\n backgroundColor?: string;\n /** Contenido a renderizar como fallback cuando no hay imagen (ej. iniciales). */\n content?: React.ReactNode;\n}\n\nexport type AvatarSize = 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport interface AvatarProps {\n type?: string;\n /**\n * Lista de avatares (grupo apilado). Para un solo avatar puedes usar\n * `src`/`alt` en su lugar.\n */\n items?: AvatarItem[];\n /**\n * Atajo para un único avatar por URL de imagen. Equivale a\n * `items={[{ imageUrl: src, text: alt }]}`. Ignorado si `items` tiene elementos.\n */\n src?: string;\n /** Texto alternativo de la imagen cuando se usa `src` (modo single). */\n alt?: string;\n /** Fallback (ej. iniciales) cuando no hay imagen, en modo single (`src`). */\n fallback?: React.ReactNode;\n displayedAvatars?: number;\n size?: AvatarSize;\n showText?: boolean;\n showTooltip?: boolean;\n /**\n * sx aplicado al contenedor raíz.\n */\n sx?: SxProps<Theme>;\n /**\n * sx aplicado a cada MuiAvatar individual (se mergea sobre los defaults).\n */\n avatarSx?: SxProps<Theme>;\n className?: string;\n /**\n * Overlap (px) entre avatares cuando hay varios. Default depende del tamaño.\n */\n overlap?: number;\n}\n\n// Escala alineada con la escala de MUI (sm=32, md=40, lg=56, xl=96) con borde\n// proporcional para el efecto stacked.\nconst sizeMap: Record<\n Exclude<AvatarSize, number>,\n { px: number; border: number; font: number; overlap: number }\n> = {\n sm: { px: 32, border: 2, font: 14, overlap: 8 },\n md: { px: 40, border: 2, font: 16, overlap: 10 },\n lg: { px: 56, border: 3, font: 22, overlap: 14 },\n xl: { px: 96, border: 4, font: 36, overlap: 20 },\n};\n\nconst resolveSize = (size: AvatarSize) => {\n if (typeof size === 'number') {\n return {\n px: size,\n border: Math.max(2, Math.round(size * 0.05)),\n font: Math.round(size * 0.4),\n overlap: Math.round(size * 0.25),\n };\n }\n return sizeMap[size];\n};\n\nconst mergeSx = (base: SxProps<Theme>, extra?: SxProps<Theme>): SxProps<Theme> => {\n if (!extra) return base;\n const baseArr = Array.isArray(base) ? base : [base];\n const extraArr = Array.isArray(extra) ? extra : [extra];\n return [...baseArr, ...extraArr] as SxProps<Theme>;\n};\n\nexport const Avatar: React.FC<AvatarProps> = ({\n items,\n src,\n alt,\n fallback,\n type,\n displayedAvatars = 4,\n size = 'sm',\n showText = true,\n showTooltip = false,\n sx,\n avatarSx,\n className,\n overlap,\n}) => {\n // Modo single (`src`) vs grupo (`items`). En single no mostramos caption.\n const resolvedItems: AvatarItem[] =\n items && items.length > 0\n ? items\n : src || fallback\n ? [{ imageUrl: src, text: alt, content: fallback }]\n : [];\n const showCaption = items && items.length > 0 ? showText : false;\n // Indexamos por URL (no por posición) para que cambios en `items` — reorder,\n // filtrado, paginación — no hagan que un avatar válido \"herede\" el estado de\n // imagen rota de un item anterior que estaba en la misma posición.\n const [failedUrls, setFailedUrls] = useState<Set<string>>(new Set());\n\n const handleImageError = (url: string) => {\n setFailedUrls((prev) => {\n if (prev.has(url)) return prev;\n const next = new Set(prev);\n next.add(url);\n return next;\n });\n };\n\n if (resolvedItems.length === 0) {\n return null;\n }\n\n const s = resolveSize(size);\n const effectiveOverlap = overlap ?? s.overlap;\n const visibleItems = resolvedItems.slice(0, displayedAvatars);\n\n const baseAvatarSx: SxProps<Theme> = {\n width: s.px,\n height: s.px,\n fontSize: s.font,\n fontWeight: 700,\n border: (theme) => `${s.border}px solid ${theme.palette.background.paper}`,\n boxSizing: 'content-box',\n };\n\n const renderSingleAvatar = (item: AvatarItem, i: number) => {\n const hasImage = !!item.imageUrl && !failedUrls.has(item.imageUrl);\n const showBadgeFallback = !!item.badge;\n const itemKey = item.imageUrl ?? `${item.text ?? ''}-${item.badge ?? ''}-${i}`;\n\n // Defaults tirando al theme; item.color / item.backgroundColor tienen prioridad.\n const itemSx: SxProps<Theme> = {\n bgcolor: item.backgroundColor ?? 'action.selected',\n color: item.color ?? 'text.secondary',\n // Stacking manual: margen negativo al segundo avatar en adelante.\n ...(i > 0 && { marginLeft: `-${effectiveOverlap}px` }),\n zIndex: visibleItems.length - i,\n };\n\n const finalSx = mergeSx(mergeSx(baseAvatarSx, itemSx), avatarSx);\n\n const avatarEl = (\n <MuiAvatar\n alt={item.text || 'User avatar'}\n src={hasImage ? item.imageUrl : undefined}\n imgProps={{\n onError: () => {\n if (item.imageUrl) handleImageError(item.imageUrl);\n },\n }}\n sx={finalSx}\n >\n {!hasImage && item.content != null ? (\n item.content\n ) : !hasImage && showBadgeFallback ? (\n <span aria-label={item.text}>{item.badge}</span>\n ) : !hasImage ? (\n <AccountCircleIcon\n aria-label={item.text}\n sx={{ width: '100%', height: '100%' }}\n />\n ) : null}\n </MuiAvatar>\n );\n\n if (showTooltip && item.text) {\n return (\n <Tooltip key={itemKey} title={item.text}>\n {avatarEl}\n </Tooltip>\n );\n }\n return <React.Fragment key={itemKey}>{avatarEl}</React.Fragment>;\n };\n\n return (\n <Box\n className={className}\n sx={mergeSx(\n {\n display: 'flex',\n alignItems: 'center',\n lineHeight: 1,\n width: 'fit-content',\n },\n sx,\n )}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n {visibleItems.map((item, i) => renderSingleAvatar(item, i))}\n </Box>\n\n {showCaption && resolvedItems[0]?.text && (\n <Typography\n variant=\"caption\"\n sx={{\n ml: 1,\n fontSize: '0.75rem',\n fontWeight: 400,\n color: 'text.primary',\n }}\n >\n {type && resolvedItems.length === 1 && (\n <Box component=\"span\" sx={{ mr: 0.5 }}>\n {type}:\n </Box>\n )}\n {resolvedItems[0].text}\n {resolvedItems.length > 1 && ` +${resolvedItems.length - 1}`}\n </Typography>\n )}\n </Box>\n );\n};\n\nexport default Avatar;\n"],"names":["useState","_a","jsx","MuiAvatar","Tooltip","jsxs","Box","Typography"],"mappings":"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"}
|
|
@@ -48,6 +48,7 @@ const Avatar = ({
|
|
|
48
48
|
items,
|
|
49
49
|
src,
|
|
50
50
|
alt,
|
|
51
|
+
fallback,
|
|
51
52
|
type,
|
|
52
53
|
displayedAvatars = 4,
|
|
53
54
|
size = "sm",
|
|
@@ -59,7 +60,7 @@ const Avatar = ({
|
|
|
59
60
|
overlap
|
|
60
61
|
}) => {
|
|
61
62
|
var _a;
|
|
62
|
-
const resolvedItems = items && items.length > 0 ? items : src ? [{ imageUrl: src, text: alt }] : [];
|
|
63
|
+
const resolvedItems = items && items.length > 0 ? items : src || fallback ? [{ imageUrl: src, text: alt, content: fallback }] : [];
|
|
63
64
|
const showCaption = items && items.length > 0 ? showText : false;
|
|
64
65
|
const [failedUrls, setFailedUrls] = useState(/* @__PURE__ */ new Set());
|
|
65
66
|
const handleImageError = (url) => {
|
|
@@ -107,7 +108,7 @@ const Avatar = ({
|
|
|
107
108
|
}
|
|
108
109
|
},
|
|
109
110
|
sx: finalSx,
|
|
110
|
-
children: !hasImage && showBadgeFallback ? /* @__PURE__ */ jsx("span", { "aria-label": item.text, children: item.badge }) : !hasImage ? /* @__PURE__ */ jsx(
|
|
111
|
+
children: !hasImage && item.content != null ? item.content : !hasImage && showBadgeFallback ? /* @__PURE__ */ jsx("span", { "aria-label": item.text, children: item.badge }) : !hasImage ? /* @__PURE__ */ jsx(
|
|
111
112
|
AccountCircleIcon,
|
|
112
113
|
{
|
|
113
114
|
"aria-label": item.text,
|
|
@@ -163,4 +164,4 @@ const Avatar = ({
|
|
|
163
164
|
export {
|
|
164
165
|
Avatar as A
|
|
165
166
|
};
|
|
166
|
-
//# sourceMappingURL=Avatar-
|
|
167
|
+
//# sourceMappingURL=Avatar-H8akSege.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Avatar-H8akSege.js","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Avatar as MuiAvatar,\n Box,\n Tooltip,\n Typography,\n type SxProps,\n type Theme,\n} from '@mui/material';\nimport AccountCircleIcon from '@mui/icons-material/AccountCircle';\n\nexport interface AvatarItem {\n text?: string;\n imageUrl?: string;\n badge?: string;\n color?: string;\n backgroundColor?: string;\n /** Contenido a renderizar como fallback cuando no hay imagen (ej. iniciales). */\n content?: React.ReactNode;\n}\n\nexport type AvatarSize = 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport interface AvatarProps {\n type?: string;\n /**\n * Lista de avatares (grupo apilado). Para un solo avatar puedes usar\n * `src`/`alt` en su lugar.\n */\n items?: AvatarItem[];\n /**\n * Atajo para un único avatar por URL de imagen. Equivale a\n * `items={[{ imageUrl: src, text: alt }]}`. Ignorado si `items` tiene elementos.\n */\n src?: string;\n /** Texto alternativo de la imagen cuando se usa `src` (modo single). */\n alt?: string;\n /** Fallback (ej. iniciales) cuando no hay imagen, en modo single (`src`). */\n fallback?: React.ReactNode;\n displayedAvatars?: number;\n size?: AvatarSize;\n showText?: boolean;\n showTooltip?: boolean;\n /**\n * sx aplicado al contenedor raíz.\n */\n sx?: SxProps<Theme>;\n /**\n * sx aplicado a cada MuiAvatar individual (se mergea sobre los defaults).\n */\n avatarSx?: SxProps<Theme>;\n className?: string;\n /**\n * Overlap (px) entre avatares cuando hay varios. Default depende del tamaño.\n */\n overlap?: number;\n}\n\n// Escala alineada con la escala de MUI (sm=32, md=40, lg=56, xl=96) con borde\n// proporcional para el efecto stacked.\nconst sizeMap: Record<\n Exclude<AvatarSize, number>,\n { px: number; border: number; font: number; overlap: number }\n> = {\n sm: { px: 32, border: 2, font: 14, overlap: 8 },\n md: { px: 40, border: 2, font: 16, overlap: 10 },\n lg: { px: 56, border: 3, font: 22, overlap: 14 },\n xl: { px: 96, border: 4, font: 36, overlap: 20 },\n};\n\nconst resolveSize = (size: AvatarSize) => {\n if (typeof size === 'number') {\n return {\n px: size,\n border: Math.max(2, Math.round(size * 0.05)),\n font: Math.round(size * 0.4),\n overlap: Math.round(size * 0.25),\n };\n }\n return sizeMap[size];\n};\n\nconst mergeSx = (base: SxProps<Theme>, extra?: SxProps<Theme>): SxProps<Theme> => {\n if (!extra) return base;\n const baseArr = Array.isArray(base) ? base : [base];\n const extraArr = Array.isArray(extra) ? extra : [extra];\n return [...baseArr, ...extraArr] as SxProps<Theme>;\n};\n\nexport const Avatar: React.FC<AvatarProps> = ({\n items,\n src,\n alt,\n fallback,\n type,\n displayedAvatars = 4,\n size = 'sm',\n showText = true,\n showTooltip = false,\n sx,\n avatarSx,\n className,\n overlap,\n}) => {\n // Modo single (`src`) vs grupo (`items`). En single no mostramos caption.\n const resolvedItems: AvatarItem[] =\n items && items.length > 0\n ? items\n : src || fallback\n ? [{ imageUrl: src, text: alt, content: fallback }]\n : [];\n const showCaption = items && items.length > 0 ? showText : false;\n // Indexamos por URL (no por posición) para que cambios en `items` — reorder,\n // filtrado, paginación — no hagan que un avatar válido \"herede\" el estado de\n // imagen rota de un item anterior que estaba en la misma posición.\n const [failedUrls, setFailedUrls] = useState<Set<string>>(new Set());\n\n const handleImageError = (url: string) => {\n setFailedUrls((prev) => {\n if (prev.has(url)) return prev;\n const next = new Set(prev);\n next.add(url);\n return next;\n });\n };\n\n if (resolvedItems.length === 0) {\n return null;\n }\n\n const s = resolveSize(size);\n const effectiveOverlap = overlap ?? s.overlap;\n const visibleItems = resolvedItems.slice(0, displayedAvatars);\n\n const baseAvatarSx: SxProps<Theme> = {\n width: s.px,\n height: s.px,\n fontSize: s.font,\n fontWeight: 700,\n border: (theme) => `${s.border}px solid ${theme.palette.background.paper}`,\n boxSizing: 'content-box',\n };\n\n const renderSingleAvatar = (item: AvatarItem, i: number) => {\n const hasImage = !!item.imageUrl && !failedUrls.has(item.imageUrl);\n const showBadgeFallback = !!item.badge;\n const itemKey = item.imageUrl ?? `${item.text ?? ''}-${item.badge ?? ''}-${i}`;\n\n // Defaults tirando al theme; item.color / item.backgroundColor tienen prioridad.\n const itemSx: SxProps<Theme> = {\n bgcolor: item.backgroundColor ?? 'action.selected',\n color: item.color ?? 'text.secondary',\n // Stacking manual: margen negativo al segundo avatar en adelante.\n ...(i > 0 && { marginLeft: `-${effectiveOverlap}px` }),\n zIndex: visibleItems.length - i,\n };\n\n const finalSx = mergeSx(mergeSx(baseAvatarSx, itemSx), avatarSx);\n\n const avatarEl = (\n <MuiAvatar\n alt={item.text || 'User avatar'}\n src={hasImage ? item.imageUrl : undefined}\n imgProps={{\n onError: () => {\n if (item.imageUrl) handleImageError(item.imageUrl);\n },\n }}\n sx={finalSx}\n >\n {!hasImage && item.content != null ? (\n item.content\n ) : !hasImage && showBadgeFallback ? (\n <span aria-label={item.text}>{item.badge}</span>\n ) : !hasImage ? (\n <AccountCircleIcon\n aria-label={item.text}\n sx={{ width: '100%', height: '100%' }}\n />\n ) : null}\n </MuiAvatar>\n );\n\n if (showTooltip && item.text) {\n return (\n <Tooltip key={itemKey} title={item.text}>\n {avatarEl}\n </Tooltip>\n );\n }\n return <React.Fragment key={itemKey}>{avatarEl}</React.Fragment>;\n };\n\n return (\n <Box\n className={className}\n sx={mergeSx(\n {\n display: 'flex',\n alignItems: 'center',\n lineHeight: 1,\n width: 'fit-content',\n },\n sx,\n )}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n {visibleItems.map((item, i) => renderSingleAvatar(item, i))}\n </Box>\n\n {showCaption && resolvedItems[0]?.text && (\n <Typography\n variant=\"caption\"\n sx={{\n ml: 1,\n fontSize: '0.75rem',\n fontWeight: 400,\n color: 'text.primary',\n }}\n >\n {type && resolvedItems.length === 1 && (\n <Box component=\"span\" sx={{ mr: 0.5 }}>\n {type}:\n </Box>\n )}\n {resolvedItems[0].text}\n {resolvedItems.length > 1 && ` +${resolvedItems.length - 1}`}\n </Typography>\n )}\n </Box>\n );\n};\n\nexport default Avatar;\n"],"names":["_a","MuiAvatar","React"],"mappings":"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"}
|
|
@@ -340,9 +340,8 @@ ModalWithStatics.Body = ModalBody;
|
|
|
340
340
|
ModalWithStatics.Footer = ModalFooter;
|
|
341
341
|
export {
|
|
342
342
|
ModalWithStatics as M,
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
ModalFooter as d
|
|
343
|
+
ModalHeader as a,
|
|
344
|
+
ModalBody as b,
|
|
345
|
+
ModalFooter as c
|
|
347
346
|
};
|
|
348
|
-
//# sourceMappingURL=Modal-
|
|
347
|
+
//# sourceMappingURL=Modal-BFpX5AFV.js.map
|
|
@@ -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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"}
|
|
@@ -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-
|
|
346
|
+
//# sourceMappingURL=Modal-CkpuI8ns.cjs.map
|
|
@@ -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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BO,MAAM,cAA0C,CAAC;AAAA,EACtD;AAAA,EACA,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EACtB;AAAA,EACA,UAAU,CAAA;AACZ,MAAM;AACJ,SACEA,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,SAAS;AAAA,QACT,WAAW,CAAC,UAAU,aAAa,MAAM,QAAQ,OAAO;AAAA,QACxD,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,KAAK;AAAA,MAAA;AAAA,MAGN,UAAA;AAAA,QAAA;AAAA,QACDD,2BAAAA,KAACE,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAC7B,UAAA;AAAA,UAAA,mBACCC,2BAAAA;AAAAA,YAACC,OAAAA;AAAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,UAAU;AAAA,cACV,SAAQ;AAAA,cACR,OAAM;AAAA,cAEL,UAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAGJ,QAAQ,IAAI,CAAC,WAAW;AACvB,kBAAM,EAAE,aAAa,MAAM,SAAS,UAAU,SAAS,UAAU;AACjE,mBACED,2BAAAA;AAAAA,cAACC,OAAAA;AAAAA,cAAA;AAAA,gBAEC;AAAA,gBACA;AAAA,gBACA,SAAS,WAAW;AAAA,gBACpB,OAAO,SAAS;AAAA,iBACX,cANN;AAAA,gBAQE,UAAA;AAAA,cAAA;AAAA,cAPI;AAAA,YAAA;AAAA,UAUX,CAAC;AAAA,QAAA,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,YAAY,cAAc;ACpEnB,MAAM,cAA0C,CAAC,EAAE,UAAU,SAAS;AAC3E,SACED,2BAAAA;AAAAA,IAACF,SAAAA;AAAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,SAAS;AAAA,QACT,cAAc,CAAC,UAAU,aAAa,MAAM,QAAQ,OAAO;AAAA,QAC3D,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,gBAAgB;AAAA,MAAA;AAAA,MAGlB,yCAACI,SAAAA,YAAA,EAAW,IAAQ,SAAQ,MAAK,WAAU,MACxC,SAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,YAAY,cAAc;AClBnB,MAAM,YAAsC,CAAC,EAAE,UAAU,SAAS;AACvE,SACEF,2BAAAA,IAACF,SAAAA,KAAA,EAAI,IAAQ,IAAI,EAAE,SAAS,GAAG,WAAW,QAAQ,UAAU,EAAA,GACzD,SAAA,CACH;AAEJ;AAEA,UAAU,cAAc;ACcxB,MAAM,cAAc,CAClB,OACA,WACA,gBACY;AACZ,MAAI,MAAM,SAAS,UAAW,QAAO;AACrC,QAAM,OAAO,MAAM;AACnB,UAAO,6BAAM,iBAAgB;AAC/B;AA4EA,MAAM,aAAa;AAAA,EACjB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,MAAM;AAAA,EACN,WAAW;AAAA,EACX,OAAO;AAAA,EACP,WAAW;AAAA,EACX,SAAS;AAAA,EACT,eAAe;AAAA,EACf,SAAS;AACX;AAEA,MAAM,iBAGF;AAAA,EACF,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,MAAME,2BAAAA,IAAC,kBAAA,EAAiB,IAAI,EAAE,UAAU,MAAM;AAAA,IAC9C,YAAY;AAAA,EAAA;AAAA,EAEd,SAAS;AAAA,IACP,OAAO;AAAA,IACP,MAAMA,2BAAAA,IAAC,kBAAA,EAAiB,IAAI,EAAE,UAAU,MAAM;AAAA,IAC9C,YAAY;AAAA,EAAA;AAAA,EAEd,OAAO;AAAA,IACL,OAAO;AAAA,IACP,MAAMA,2BAAAA,IAAC,kBAAA,EAAiB,IAAI,EAAE,UAAU,MAAM;AAAA,IAC9C,YAAY;AAAA,EAAA;AAAA,EAEd,SAAS;AAAA,IACP,OAAO;AAAA,IACP,MAAMA,2BAAAA,IAAC,wBAAA,EAAuB,IAAI,EAAE,UAAU,MAAM;AAAA,IACpD,YAAY;AAAA,EAAA;AAEhB;AAEO,MAAM,QAAQG,MAAAA;AAAAA,EACnB,CACE;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB,sBAAsB;AAAA,IACtB,UAAU,CAAA;AAAA,IACV,WAAW;AAAA,IACX,eAAe;AAAA,IACf,aAAa;AAAA,IACb,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA,cAAc;AAAA,IACd,kBAAkB;AAAA,IAClB,WAAW;AAAA,IACX;AAAA,EAAA,GAEF,QACG;AACH,UAAM,CAAC,cAAc,eAAe,IAAIC,MAAAA,SAAS,KAAK;AACtD,UAAM,CAAC,gBAAgB,iBAAiB,IAAIA,MAAAA,SAAS,KAAK;AAG1D,UAAM,UAAUC,MAAAA,MAAA;AAChB,UAAM,SAASA,MAAAA,MAAA;AAEf,UAAM,SAAS,mBAAmB,SAAY,iBAAiB;AAE/DC,UAAAA,oBAAoB,KAAK,OAAO;AAAA,MAC9B,MAAM,MAAM,gBAAgB,IAAI;AAAA,MAChC,OAAO,MAAM;AACX,wBAAgB,KAAK;AACrB;AAAA,MACF;AAAA,IAAA,EACA;AAEF,UAAM,sBAAsB,MAAM;AAChC,sBAAgB,KAAK;AACrB;AAAA,IACF;AAEA,UAAM,gBAAgB,YAAY;AAChC,UAAI,CAAC,WAAW;AACd,4BAAA;AACA;AAAA,MACF;AACA,YAAM,SAAS,UAAA;AACf,UAAI,EAAE,kBAAkB,UAAU;AAChC,4BAAA;AACA;AAAA,MACF;AACA,wBAAkB,IAAI;AACtB,UAAI;AACF,cAAM;AACN,4BAAA;AAAA,MACF,SAAS,KAAK;AAKZ,gBAAQ,MAAM,2BAA2B,GAAG;AAAA,MAC9C,UAAA;AACE,0BAAkB,KAAK;AAAA,MACzB;AAAA,IACF;AAEA,UAAM,QAAQC,SAAAA,SAAA;AACd,UAAM,WAAWC,SAAAA,cAAc,MAAM,YAAY,KAAK,IAAI,CAAC;AAE3D,UAAM,WAAW,MAAM;AACrB,UAAI,SAAU,QAAO;AACrB,cAAQ,UAAA;AAAA,QACN,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AAEE,iBAAO,OAAO,aAAa,WAAW,WAAW;AAAA,MAAA;AAAA,IAEvD;AAGA,UAAM,cAA8B,iCAAK,aAAL,EAAiB,OAAO,WAAS;AACrE,UAAM,gBAAgBC,QAAAA,QAAQ,aAAa,OAAO;AAGlD,QAAI,SAAS,WAAW;AACtB,YAAM,SAAS,eAAe,QAAQ;AACtC,YAAM,UAAU,0CAAkB;AAElC,aACET,2BAAAA;AAAAA,QAACU,SAAAA;AAAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,SAAS;AAAA,UACT,mBAAiB,QAAQ,UAAU;AAAA,UACnC,oBAAkB,UAAU,SAAS;AAAA,UACrC,sBAAoB;AAAA,UACpB;AAAA,UAEA,UAAAb,2BAAAA,KAACc,gBAAA,EAAM,WAAsB,IAAI,eAC/B,UAAA;AAAA,YAAAd,2BAAAA,KAACE,SAAAA,OAAA,EAAM,SAAS,KAAK,IAAI,EAAE,GAAG,GAAG,YAAY,UAAU,WAAW,SAAA,GAChE,UAAA;AAAA,cAAAC,2BAAAA;AAAAA,gBAACF,SAAAA;AAAAA,gBAAA;AAAA,kBACC,IAAI;AAAA,oBACF,OAAO;AAAA,oBACP,QAAQ;AAAA,oBACR,cAAc;AAAA,oBACd,iBAAiB,CAAC,MAAM,EAAE,QAAQ,OAAO,UAAU,EAAE;AAAA,oBACrD,OAAO,CAAC,MAAM,EAAE,QAAQ,OAAO,UAAU,EAAE;AAAA,oBAC3C,SAAS;AAAA,oBACT,YAAY;AAAA,oBACZ,gBAAgB;AAAA,oBAChB,SAAS;AAAA,kBAAA;AAAA,kBAGV,UAAA,OAAO;AAAA,gBAAA;AAAA,cAAA;AAAA,cAET,SACCE,2BAAAA,IAACE,SAAAA,YAAA,EAAW,IAAI,SAAS,SAAQ,MAAK,WAAU,MAAK,IAAI,EAAE,YAAY,IAAA,GACpE,UAAA,OACH;AAAA,cAED,0CACEA,qBAAA,EAAW,IAAI,QAAQ,SAAQ,SAAQ,OAAM,kBAC3C,UAAA,QAAA,CACH;AAAA,YAAA,GAEJ;AAAA,YACAF,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA,qBAAqB,uBAAuB;AAAA,gBAC5C,SAAS;AAAA,gBACT,SAAS;AAAA,kBACP;AAAA,oBACE,MAAM;AAAA,oBACN,SAAS;AAAA,oBACT,UAAU,mBAAmB;AAAA,oBAC7B,SAAS;AAAA,oBACT,OAAO,OAAO;AAAA,kBAAA;AAAA,gBAChB;AAAA,cACF;AAAA,YAAA;AAAA,UACF,EAAA,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IAGN;AAGA,UAAM,iBAAiB,MAAM;AAC3B,UAAI,SAA2B;AAC/B,UAAI,OAAyB;AAC7B,UAAI,SAA2B;AAE/BY,YAAAA,SAAS,QAAQ,UAAU,CAAC,UAAU;;AACpC,YAAI,CAACC,MAAAA,eAAe,KAAK,EAAG;AAE5B,YAAI,YAAY,OAAO,aAAa,aAAa,GAAG;AAClD,gBAAM,cAAc;AACpB,mBAASC,MAAAA,aAAa,aAAa,iBAAE,IAAI,WAAY,YAAY,MAAO;AAAA,QAC1E,WAAW,YAAY,OAAO,WAAW,WAAW,GAAG;AACrD,gBAAM,YAAY;AAClB,iBAAOA,MAAAA,aAAa,WAAW,iBAAE,IAAI,UAAW,UAAU,MAAO;AAAA,QACnE,WAAW,YAAY,OAAO,aAAa,aAAa,GAAG;AACzD,gBAAM,cAAc;AAIpB,gBAAM,aAAa,YAAY;AAC/B,mBAASA,MAAAA,aAAa,aAAa;AAAA,YACjC,kBAAiB,gBAAW,oBAAX,YAA8B;AAAA,YAC/C,kBAAiB,gBAAW,oBAAX,YAA8B;AAAA,YAC/C,sBAAqB,gBAAW,wBAAX,YAAkC;AAAA,YACvD,UAAS,gBAAW,YAAX,YAAsB;AAAA,YAC/B,UAAS,gBAAW,YAAX,YAAsB;AAAA,UAAA,CAChC;AAAA,QACH;AAAA,MACF,CAAC;AAED,UAAI,CAAC,UAAU,CAAC,cAAc;AAC5B,iBACEd,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAS;AAAA,YACT;AAAA,UAAA;AAAA,QAAA;AAAA,MAGN;AAEA,aACEH,2BAAAA,KAAAkB,qBAAA,EACG,UAAA;AAAA,QAAA,CAAC,iBAAiB,UAAW,wCAAU,aAAA,EAAY,IAAI,SAAU,UAAA,MAAA,CAAM;AAAA,QACvE,CAAC,cAAc;AAAA,QACf;AAAA,MAAA,GACH;AAAA,IAEJ;AAEA,WACEf,2BAAAA;AAAAA,MAACU,SAAAA;AAAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,SAAS;AAAA,QACT,mBAAiB;AAAA,QACjB,oBAAkB;AAAA,QAClB,sBAAoB;AAAA,QACpB;AAAA,QAEA,yCAACC,SAAAA,OAAA,EAAM,WAAsB,IAAI,eAC9B,2BAAe,CAClB;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,MAAM,cAAc;AASpB,MAAM,mBAAmB;AAEzB,iBAAiB,SAAS;AAC1B,iBAAiB,OAAO;AACxB,iBAAiB,SAAS;;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const Avatar = require("../../Avatar-
|
|
3
|
+
const Avatar = require("../../Avatar-Dw5rzayR.cjs");
|
|
4
4
|
exports.Avatar = Avatar.Avatar;
|
|
5
5
|
//# sourceMappingURL=Avatar.cjs.map
|
|
@@ -6,6 +6,8 @@ export interface AvatarItem {
|
|
|
6
6
|
badge?: string;
|
|
7
7
|
color?: string;
|
|
8
8
|
backgroundColor?: string;
|
|
9
|
+
/** Contenido a renderizar como fallback cuando no hay imagen (ej. iniciales). */
|
|
10
|
+
content?: React.ReactNode;
|
|
9
11
|
}
|
|
10
12
|
export type AvatarSize = 'sm' | 'md' | 'lg' | 'xl' | number;
|
|
11
13
|
export interface AvatarProps {
|
|
@@ -22,6 +24,8 @@ export interface AvatarProps {
|
|
|
22
24
|
src?: string;
|
|
23
25
|
/** Texto alternativo de la imagen cuando se usa `src` (modo single). */
|
|
24
26
|
alt?: string;
|
|
27
|
+
/** Fallback (ej. iniciales) cuando no hay imagen, en modo single (`src`). */
|
|
28
|
+
fallback?: React.ReactNode;
|
|
25
29
|
displayedAvatars?: number;
|
|
26
30
|
size?: AvatarSize;
|
|
27
31
|
showText?: boolean;
|
|
@@ -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-
|
|
4
|
-
exports.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;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { M, b, c, a, M as M2 } from "../../Modal-BFpX5AFV.js";
|
|
2
2
|
export {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
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
|
|
@@ -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/index.cjs
CHANGED
|
@@ -7,13 +7,13 @@ const Button = require("./Button-C17mExpd.cjs");
|
|
|
7
7
|
const Card = require("./Card-DIZLchyP.cjs");
|
|
8
8
|
const Chip = require("./Chip-qoJLDiva.cjs");
|
|
9
9
|
const components_Column = require("./components/Column/Column.cjs");
|
|
10
|
-
const Avatar = require("./Avatar-
|
|
10
|
+
const Avatar = require("./Avatar-Dw5rzayR.cjs");
|
|
11
11
|
const Stat = require("./Stat-BUcFCGrz.cjs");
|
|
12
12
|
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-
|
|
16
|
+
const Modal = require("./Modal-CkpuI8ns.cjs");
|
|
17
17
|
const Input = require("./Input-CScC87J5.cjs");
|
|
18
18
|
const Select = require("./Select-kqR48jZU.cjs");
|
|
19
19
|
const Autocomplete = require("./Autocomplete-CejWztBY.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.
|
|
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
|
@@ -5,13 +5,13 @@ import { B } from "./Button-UkkP-bNw.js";
|
|
|
5
5
|
import { C } from "./Card-C4dabH4V.js";
|
|
6
6
|
import { C as C2 } from "./Chip-OPYQ1uQ_.js";
|
|
7
7
|
import { Column } from "./components/Column/Column.js";
|
|
8
|
-
import { A } from "./Avatar-
|
|
8
|
+
import { A } from "./Avatar-H8akSege.js";
|
|
9
9
|
import { S } from "./Stat-C06A_izS.js";
|
|
10
10
|
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 {
|
|
14
|
+
import { M, b, c, a as a3 } from "./Modal-BFpX5AFV.js";
|
|
15
15
|
import { I } from "./Input-DP_fKl38.js";
|
|
16
16
|
import { O, S as S4 } from "./Select-Dycmh9vt.js";
|
|
17
17
|
import { A as A2, a as a4 } from "./Autocomplete-C_lW1VER.js";
|
|
@@ -60,10 +60,10 @@ export {
|
|
|
60
60
|
ListItemIcon,
|
|
61
61
|
ListItemText,
|
|
62
62
|
ListSubheader,
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
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
package/Avatar-CivpVSfO.cjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar-CivpVSfO.cjs","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Avatar as MuiAvatar,\n Box,\n Tooltip,\n Typography,\n type SxProps,\n type Theme,\n} from '@mui/material';\nimport AccountCircleIcon from '@mui/icons-material/AccountCircle';\n\nexport interface AvatarItem {\n text?: string;\n imageUrl?: string;\n badge?: string;\n color?: string;\n backgroundColor?: string;\n}\n\nexport type AvatarSize = 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport interface AvatarProps {\n type?: string;\n /**\n * Lista de avatares (grupo apilado). Para un solo avatar puedes usar\n * `src`/`alt` en su lugar.\n */\n items?: AvatarItem[];\n /**\n * Atajo para un único avatar por URL de imagen. Equivale a\n * `items={[{ imageUrl: src, text: alt }]}`. Ignorado si `items` tiene elementos.\n */\n src?: string;\n /** Texto alternativo de la imagen cuando se usa `src` (modo single). */\n alt?: string;\n displayedAvatars?: number;\n size?: AvatarSize;\n showText?: boolean;\n showTooltip?: boolean;\n /**\n * sx aplicado al contenedor raíz.\n */\n sx?: SxProps<Theme>;\n /**\n * sx aplicado a cada MuiAvatar individual (se mergea sobre los defaults).\n */\n avatarSx?: SxProps<Theme>;\n className?: string;\n /**\n * Overlap (px) entre avatares cuando hay varios. Default depende del tamaño.\n */\n overlap?: number;\n}\n\n// Escala alineada con la escala de MUI (sm=32, md=40, lg=56, xl=96) con borde\n// proporcional para el efecto stacked.\nconst sizeMap: Record<\n Exclude<AvatarSize, number>,\n { px: number; border: number; font: number; overlap: number }\n> = {\n sm: { px: 32, border: 2, font: 14, overlap: 8 },\n md: { px: 40, border: 2, font: 16, overlap: 10 },\n lg: { px: 56, border: 3, font: 22, overlap: 14 },\n xl: { px: 96, border: 4, font: 36, overlap: 20 },\n};\n\nconst resolveSize = (size: AvatarSize) => {\n if (typeof size === 'number') {\n return {\n px: size,\n border: Math.max(2, Math.round(size * 0.05)),\n font: Math.round(size * 0.4),\n overlap: Math.round(size * 0.25),\n };\n }\n return sizeMap[size];\n};\n\nconst mergeSx = (base: SxProps<Theme>, extra?: SxProps<Theme>): SxProps<Theme> => {\n if (!extra) return base;\n const baseArr = Array.isArray(base) ? base : [base];\n const extraArr = Array.isArray(extra) ? extra : [extra];\n return [...baseArr, ...extraArr] as SxProps<Theme>;\n};\n\nexport const Avatar: React.FC<AvatarProps> = ({\n items,\n src,\n alt,\n type,\n displayedAvatars = 4,\n size = 'sm',\n showText = true,\n showTooltip = false,\n sx,\n avatarSx,\n className,\n overlap,\n}) => {\n // Modo single (`src`) vs grupo (`items`). En single no mostramos caption.\n const resolvedItems: AvatarItem[] =\n items && items.length > 0\n ? items\n : src\n ? [{ imageUrl: src, text: alt }]\n : [];\n const showCaption = items && items.length > 0 ? showText : false;\n // Indexamos por URL (no por posición) para que cambios en `items` — reorder,\n // filtrado, paginación — no hagan que un avatar válido \"herede\" el estado de\n // imagen rota de un item anterior que estaba en la misma posición.\n const [failedUrls, setFailedUrls] = useState<Set<string>>(new Set());\n\n const handleImageError = (url: string) => {\n setFailedUrls((prev) => {\n if (prev.has(url)) return prev;\n const next = new Set(prev);\n next.add(url);\n return next;\n });\n };\n\n if (resolvedItems.length === 0) {\n return null;\n }\n\n const s = resolveSize(size);\n const effectiveOverlap = overlap ?? s.overlap;\n const visibleItems = resolvedItems.slice(0, displayedAvatars);\n\n const baseAvatarSx: SxProps<Theme> = {\n width: s.px,\n height: s.px,\n fontSize: s.font,\n fontWeight: 700,\n border: (theme) => `${s.border}px solid ${theme.palette.background.paper}`,\n boxSizing: 'content-box',\n };\n\n const renderSingleAvatar = (item: AvatarItem, i: number) => {\n const hasImage = !!item.imageUrl && !failedUrls.has(item.imageUrl);\n const showBadgeFallback = !!item.badge;\n const itemKey = item.imageUrl ?? `${item.text ?? ''}-${item.badge ?? ''}-${i}`;\n\n // Defaults tirando al theme; item.color / item.backgroundColor tienen prioridad.\n const itemSx: SxProps<Theme> = {\n bgcolor: item.backgroundColor ?? 'action.selected',\n color: item.color ?? 'text.secondary',\n // Stacking manual: margen negativo al segundo avatar en adelante.\n ...(i > 0 && { marginLeft: `-${effectiveOverlap}px` }),\n zIndex: visibleItems.length - i,\n };\n\n const finalSx = mergeSx(mergeSx(baseAvatarSx, itemSx), avatarSx);\n\n const avatarEl = (\n <MuiAvatar\n alt={item.text || 'User avatar'}\n src={hasImage ? item.imageUrl : undefined}\n imgProps={{\n onError: () => {\n if (item.imageUrl) handleImageError(item.imageUrl);\n },\n }}\n sx={finalSx}\n >\n {!hasImage && showBadgeFallback ? (\n <span aria-label={item.text}>{item.badge}</span>\n ) : !hasImage ? (\n <AccountCircleIcon\n aria-label={item.text}\n sx={{ width: '100%', height: '100%' }}\n />\n ) : null}\n </MuiAvatar>\n );\n\n if (showTooltip && item.text) {\n return (\n <Tooltip key={itemKey} title={item.text}>\n {avatarEl}\n </Tooltip>\n );\n }\n return <React.Fragment key={itemKey}>{avatarEl}</React.Fragment>;\n };\n\n return (\n <Box\n className={className}\n sx={mergeSx(\n {\n display: 'flex',\n alignItems: 'center',\n lineHeight: 1,\n width: 'fit-content',\n },\n sx,\n )}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n {visibleItems.map((item, i) => renderSingleAvatar(item, i))}\n </Box>\n\n {showCaption && resolvedItems[0]?.text && (\n <Typography\n variant=\"caption\"\n sx={{\n ml: 1,\n fontSize: '0.75rem',\n fontWeight: 400,\n color: 'text.primary',\n }}\n >\n {type && resolvedItems.length === 1 && (\n <Box component=\"span\" sx={{ mr: 0.5 }}>\n {type}:\n </Box>\n )}\n {resolvedItems[0].text}\n {resolvedItems.length > 1 && ` +${resolvedItems.length - 1}`}\n </Typography>\n )}\n </Box>\n );\n};\n\nexport default Avatar;\n"],"names":["useState","_a","jsx","MuiAvatar","Tooltip","jsxs","Box","Typography"],"mappings":"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"}
|
package/Avatar-_Lx4IH_1.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar-_Lx4IH_1.js","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Avatar as MuiAvatar,\n Box,\n Tooltip,\n Typography,\n type SxProps,\n type Theme,\n} from '@mui/material';\nimport AccountCircleIcon from '@mui/icons-material/AccountCircle';\n\nexport interface AvatarItem {\n text?: string;\n imageUrl?: string;\n badge?: string;\n color?: string;\n backgroundColor?: string;\n}\n\nexport type AvatarSize = 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport interface AvatarProps {\n type?: string;\n /**\n * Lista de avatares (grupo apilado). Para un solo avatar puedes usar\n * `src`/`alt` en su lugar.\n */\n items?: AvatarItem[];\n /**\n * Atajo para un único avatar por URL de imagen. Equivale a\n * `items={[{ imageUrl: src, text: alt }]}`. Ignorado si `items` tiene elementos.\n */\n src?: string;\n /** Texto alternativo de la imagen cuando se usa `src` (modo single). */\n alt?: string;\n displayedAvatars?: number;\n size?: AvatarSize;\n showText?: boolean;\n showTooltip?: boolean;\n /**\n * sx aplicado al contenedor raíz.\n */\n sx?: SxProps<Theme>;\n /**\n * sx aplicado a cada MuiAvatar individual (se mergea sobre los defaults).\n */\n avatarSx?: SxProps<Theme>;\n className?: string;\n /**\n * Overlap (px) entre avatares cuando hay varios. Default depende del tamaño.\n */\n overlap?: number;\n}\n\n// Escala alineada con la escala de MUI (sm=32, md=40, lg=56, xl=96) con borde\n// proporcional para el efecto stacked.\nconst sizeMap: Record<\n Exclude<AvatarSize, number>,\n { px: number; border: number; font: number; overlap: number }\n> = {\n sm: { px: 32, border: 2, font: 14, overlap: 8 },\n md: { px: 40, border: 2, font: 16, overlap: 10 },\n lg: { px: 56, border: 3, font: 22, overlap: 14 },\n xl: { px: 96, border: 4, font: 36, overlap: 20 },\n};\n\nconst resolveSize = (size: AvatarSize) => {\n if (typeof size === 'number') {\n return {\n px: size,\n border: Math.max(2, Math.round(size * 0.05)),\n font: Math.round(size * 0.4),\n overlap: Math.round(size * 0.25),\n };\n }\n return sizeMap[size];\n};\n\nconst mergeSx = (base: SxProps<Theme>, extra?: SxProps<Theme>): SxProps<Theme> => {\n if (!extra) return base;\n const baseArr = Array.isArray(base) ? base : [base];\n const extraArr = Array.isArray(extra) ? extra : [extra];\n return [...baseArr, ...extraArr] as SxProps<Theme>;\n};\n\nexport const Avatar: React.FC<AvatarProps> = ({\n items,\n src,\n alt,\n type,\n displayedAvatars = 4,\n size = 'sm',\n showText = true,\n showTooltip = false,\n sx,\n avatarSx,\n className,\n overlap,\n}) => {\n // Modo single (`src`) vs grupo (`items`). En single no mostramos caption.\n const resolvedItems: AvatarItem[] =\n items && items.length > 0\n ? items\n : src\n ? [{ imageUrl: src, text: alt }]\n : [];\n const showCaption = items && items.length > 0 ? showText : false;\n // Indexamos por URL (no por posición) para que cambios en `items` — reorder,\n // filtrado, paginación — no hagan que un avatar válido \"herede\" el estado de\n // imagen rota de un item anterior que estaba en la misma posición.\n const [failedUrls, setFailedUrls] = useState<Set<string>>(new Set());\n\n const handleImageError = (url: string) => {\n setFailedUrls((prev) => {\n if (prev.has(url)) return prev;\n const next = new Set(prev);\n next.add(url);\n return next;\n });\n };\n\n if (resolvedItems.length === 0) {\n return null;\n }\n\n const s = resolveSize(size);\n const effectiveOverlap = overlap ?? s.overlap;\n const visibleItems = resolvedItems.slice(0, displayedAvatars);\n\n const baseAvatarSx: SxProps<Theme> = {\n width: s.px,\n height: s.px,\n fontSize: s.font,\n fontWeight: 700,\n border: (theme) => `${s.border}px solid ${theme.palette.background.paper}`,\n boxSizing: 'content-box',\n };\n\n const renderSingleAvatar = (item: AvatarItem, i: number) => {\n const hasImage = !!item.imageUrl && !failedUrls.has(item.imageUrl);\n const showBadgeFallback = !!item.badge;\n const itemKey = item.imageUrl ?? `${item.text ?? ''}-${item.badge ?? ''}-${i}`;\n\n // Defaults tirando al theme; item.color / item.backgroundColor tienen prioridad.\n const itemSx: SxProps<Theme> = {\n bgcolor: item.backgroundColor ?? 'action.selected',\n color: item.color ?? 'text.secondary',\n // Stacking manual: margen negativo al segundo avatar en adelante.\n ...(i > 0 && { marginLeft: `-${effectiveOverlap}px` }),\n zIndex: visibleItems.length - i,\n };\n\n const finalSx = mergeSx(mergeSx(baseAvatarSx, itemSx), avatarSx);\n\n const avatarEl = (\n <MuiAvatar\n alt={item.text || 'User avatar'}\n src={hasImage ? item.imageUrl : undefined}\n imgProps={{\n onError: () => {\n if (item.imageUrl) handleImageError(item.imageUrl);\n },\n }}\n sx={finalSx}\n >\n {!hasImage && showBadgeFallback ? (\n <span aria-label={item.text}>{item.badge}</span>\n ) : !hasImage ? (\n <AccountCircleIcon\n aria-label={item.text}\n sx={{ width: '100%', height: '100%' }}\n />\n ) : null}\n </MuiAvatar>\n );\n\n if (showTooltip && item.text) {\n return (\n <Tooltip key={itemKey} title={item.text}>\n {avatarEl}\n </Tooltip>\n );\n }\n return <React.Fragment key={itemKey}>{avatarEl}</React.Fragment>;\n };\n\n return (\n <Box\n className={className}\n sx={mergeSx(\n {\n display: 'flex',\n alignItems: 'center',\n lineHeight: 1,\n width: 'fit-content',\n },\n sx,\n )}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n {visibleItems.map((item, i) => renderSingleAvatar(item, i))}\n </Box>\n\n {showCaption && resolvedItems[0]?.text && (\n <Typography\n variant=\"caption\"\n sx={{\n ml: 1,\n fontSize: '0.75rem',\n fontWeight: 400,\n color: 'text.primary',\n }}\n >\n {type && resolvedItems.length === 1 && (\n <Box component=\"span\" sx={{ mr: 0.5 }}>\n {type}:\n </Box>\n )}\n {resolvedItems[0].text}\n {resolvedItems.length > 1 && ` +${resolvedItems.length - 1}`}\n </Typography>\n )}\n </Box>\n );\n};\n\nexport default Avatar;\n"],"names":["_a","MuiAvatar","React"],"mappings":"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"}
|