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

package/dist/components/InputGroup/InputGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroup.js","sources":["../../../src/components/InputGroup/InputGroup.tsx"],"sourcesContent":["import React, { Children, cloneElement, isValidElement } from 'react';\nimport { Box } from '@mui/material';\nimport { DatePicker as MuiDatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { Select as MuiSelect } from '@mui/material';\nimport { TextField as MuiTextField } from '@mui/material';\nimport { Input } from '../Input';\nimport { Select } from '../Select';\nimport { DatePicker } from '../DatePicker';\n\ninterface CommonProps {\n  sx?: object;\n  [key: string]: any;\n}\n\ninterface InputGroupProps {\n  children: React.ReactNode;\n}\n\nconst InputGroup: React.FC<InputGroupProps> = ({ children }) => {\n  const childrenArray = Children.toArray(children);\n\n  const childrenWithDividers = childrenArray.map((child, index) => {\n    if (isValidElement(child)) {\n      const childProps = child.props as CommonProps;\n      const childType = child.type as any;\n\n      const isInputComponent = (\n        childType === MuiTextField || \n        childType === Input || \n        childType === MuiSelect || \n        childType === Select ||\n        childType === MuiDatePicker || \n        childType === DatePicker\n      );\n\n      const clonedChild = isInputComponent ? (\n        cloneElement(child, {\n          ...childProps,\n          // Añade la clase directamente al componente clonado\n          className: 'InputGroupChild',\n          sx: {\n            ...childProps.sx,\n            // Usa el selector correcto para anular el borde del NotchedOutline\n            '& .MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n            },\n            // Asegura que el botón del DatePicker no tenga borde divisor\n            '& .MuiInputBase-root .MuiButtonBase-root': {\n              borderRight: 'none',\n            },\n            // Oculta el legend de MuiOutlinedInput para que el borde no tenga \"muescas\"\n            '& .MuiOutlinedInput-notchedOutline > legend': {\n              display: 'none',\n            },\n\n            ' .InputGroupChild > MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n\n            }, \n            '.MuiOutlinedInput-notchedOutline, > .MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n            }\n\n          },\n        } as CommonProps)\n      ) : (\n        child\n      );\n\n      return (\n        <Box\n          key={index}\n          sx={{\n            flexGrow: 1,\n            display: 'flex',\n            alignItems: 'center',\n            minWidth: 0,\n            borderRight: index < childrenArray.length - 1 ? '1px solid #ccc' : 'none',\n          }}\n        >\n          {clonedChild}\n        </Box>\n      );\n    }\n    return child;\n  });\n\n  return (\n    <Box\n      sx={{\n          width: '100%',\n          display: 'grid',\n          marginBottom: '10px',\n          marginTop: '10px'\n      }}\n\n  >\n    <Box\n      className='InputGroupChild'\n      sx={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        height: '32px',\n        border: '1px solid #ccc',\n        borderRadius: '10px',\n        padding: '8px 0px',\n        marginTop: '-5px',\n        marginBottom: '20px',\n        '& .MuiInputBase-root, & .MuiButtonBase-root, & .MuiChip-root': {\n          borderRadius: 0,\n        },\n        '& > div:first-of-type .MuiInputBase-root, & > div:first-of-type .MuiButtonBase-root, & > div:first-of-type .MuiChip-root': {\n          borderTopLeftRadius: '10px',\n          borderBottomLeftRadius: '10px',\n        },\n        '& > div:last-of-type .MuiInputBase-root, & > div:last-of-type .MuiButtonBase-root, & > div:last-of-type .MuiChip-root': {\n          borderTopRightRadius: '10px',\n          borderBottomRightRadius: '10px',\n          border: 'none !important'\n        },\n        // Estilo para los componentes que tienen `InputGroupChild` en la clase\n        '& .InputGroupChild': {\n          width: '100%',\n        },\n        '&  > div:first-of-type .MuiInputBase-root > .MuiOutlinedInput-notchedOutline': {\n          border: 'none !important',\n        },\n      }}\n    >\n      {childrenWithDividers}\n    </Box>\n  </Box>\n  );\n};\n\nexport default InputGroup;"],"names":["MuiTextField","MuiSelect","Select","MuiDatePicker","DatePicker"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,aAAwC,CAAC,EAAE,eAAe;AAC9D,QAAM,gBAAgB,SAAS,QAAQ,QAAQ;AAE/C,QAAM,uBAAuB,cAAc,IAAI,CAAC,OAAO,UAAU;AAC/D,QAAI,eAAe,KAAK,GAAG;AACzB,YAAM,aAAa,MAAM;AACzB,YAAM,YAAY,MAAM;AAExB,YAAM,mBACJ,cAAcA,aACd,cAAc,SACd,cAAcC,UACd,cAAcC,YACd,cAAcC,cACd,cAAcC;AAGhB,YAAM,cAAc,mBAClB,aAAa,OAAO,iCACf,aADe;AAAA;AAAA,QAGlB,WAAW;AAAA,QACX,IAAI,iCACC,WAAW,KADZ;AAAA;AAAA,UAGF,sCAAsC;AAAA,YACpC,QAAQ;AAAA,UAAA;AAAA;AAAA,UAGV,4CAA4C;AAAA,YAC1C,aAAa;AAAA,UAAA;AAAA;AAAA,UAGf,+CAA+C;AAAA,YAC7C,SAAS;AAAA,UAAA;AAAA,UAGX,uDAAuD;AAAA,YACrD,QAAQ;AAAA,UAAA;AAAA,UAGV,wEAAwE;AAAA,YACtE,QAAQ;AAAA,UAAA;AAAA,QACV;AAAA,MAEF,EACc,IAEhB;AAGF,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,IAAI;AAAA,YACF,UAAU;AAAA,YACV,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,UAAU;AAAA,YACV,aAAa,QAAQ,cAAc,SAAS,IAAI,mBAAmB;AAAA,UAAA;AAAA,UAGpE,UAAA;AAAA,QAAA;AAAA,QATI;AAAA,MAAA;AAAA,IAYX;AACA,WAAO;AAAA,EACT,CAAC;AAED,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACA,OAAO;AAAA,QACP,SAAS;AAAA,QACT,cAAc;AAAA,QACd,WAAW;AAAA,MAAA;AAAA,MAIjB,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI;AAAA,YACF,SAAS;AAAA,YACT,gBAAgB;AAAA,YAChB,QAAQ;AAAA,YACR,QAAQ;AAAA,YACR,cAAc;AAAA,YACd,SAAS;AAAA,YACT,WAAW;AAAA,YACX,cAAc;AAAA,YACd,gEAAgE;AAAA,cAC9D,cAAc;AAAA,YAAA;AAAA,YAEhB,4HAA4H;AAAA,cAC1H,qBAAqB;AAAA,cACrB,wBAAwB;AAAA,YAAA;AAAA,YAE1B,yHAAyH;AAAA,cACvH,sBAAsB;AAAA,cACtB,yBAAyB;AAAA,cACzB,QAAQ;AAAA,YAAA;AAAA;AAAA,YAGV,sBAAsB;AAAA,cACpB,OAAO;AAAA,YAAA;AAAA,YAET,gFAAgF;AAAA,cAC9E,QAAQ;AAAA,YAAA;AAAA,UACV;AAAA,UAGD,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGJ;"}
+{"version":3,"file":"InputGroup.js","sources":["../../../src/components/InputGroup/InputGroup.tsx"],"sourcesContent":["import React, { Children, isValidElement } from 'react';\nimport { Box, type SxProps, type Theme } from '@mui/material';\n\nexport interface InputGroupProps {\n  children: React.ReactNode;\n  /**\n   * sx aplicado al contenedor raíz del grupo. Se mergea sobre los defaults.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   * sx aplicado a cada slot individual. Útil para controlar flex/gap entre\n   * los hijos del grupo.\n   */\n  slotSx?: SxProps<Theme>;\n  /**\n   * Radio del borde del grupo. Default: 10.\n   */\n  borderRadius?: number | string;\n  /**\n   * Desactiva visualmente el grupo (no cascada lógica — los hijos deben\n   * manejar su propio `disabled`).\n   */\n  disabled?: boolean;\n  /**\n   * Orientación del grupo. Default: 'horizontal'.\n   */\n  orientation?: 'horizontal' | 'vertical';\n  className?: string;\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\n/**\n * Agrupa visualmente varios componentes de entrada (Input / Select / DatePicker /\n * Button, etc.) compartiendo un solo borde y con separadores internos.\n *\n * El grupo respeta el espacio que Input/Select reservan para su label `outside`\n * (marginTop=14px) moviendo ese reservado al contenedor externo y cancelándolo\n * en los hijos. Los labels siguen flotando por encima del borde del grupo con\n * la misma animación que fuera del grupo.\n *\n * No inspecciona el tipo de cada hijo; aplica los overrides a través de\n * descendant selectors por CSS para funcionar con cualquier wrapper / memoizado.\n */\nconst InputGroup: React.FC<InputGroupProps> = ({\n  children,\n  sx,\n  slotSx,\n  borderRadius = 10,\n  disabled,\n  orientation = 'horizontal',\n  className,\n}) => {\n  const radius = typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n  const slots = Children.toArray(children).filter(isValidElement);\n  const isHorizontal = orientation === 'horizontal';\n\n  const baseSx: SxProps<Theme> = {\n    // Respeta el label \"outside\" de Input/Select: los hijos pierden su marginTop\n    // (ver más abajo) y el grupo reserva el mismo espacio arriba para que los\n    // labels floten por encima del borde del grupo.\n    marginTop: '14px',\n\n    display: 'flex',\n    flexDirection: isHorizontal ? 'row' : 'column',\n    alignItems: 'stretch',\n    width: '100%',\n    border: (theme) => `1px solid ${theme.palette.divider}`,\n    borderRadius: radius,\n    backgroundColor: 'background.paper',\n    transition: 'border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms',\n    '&:focus-within': {\n      borderColor: 'primary.main',\n      boxShadow: (theme) => `0 0 0 1px ${theme.palette.primary.main}`,\n    },\n    opacity: disabled ? 0.6 : 1,\n    pointerEvents: disabled ? 'none' : 'auto',\n\n    // Cancelar el marginTop que Input/Select reservan en labelPosition=\"outside\".\n    // El grupo ya lo reservó en su nivel externo.\n    '& .MuiFormControl-root, & > .InputGroup__slot > .MuiTextField-root, & > .InputGroup__slot > .MuiFormControl-root': {\n      marginTop: 0,\n    },\n\n    // Quitar el borde del notched outline interno: el borde visible es el del\n    // grupo, los separadores son los borderRight/borderBottom de cada slot.\n    '& .MuiOutlinedInput-notchedOutline': {\n      border: 'none',\n    },\n\n    // Forzar que todos los campos pinten sus esquinas cuadradas (las esquinas\n    // redondeadas se aplican solo al primer/último slot más abajo).\n    '& .MuiInputBase-root, & .MuiChip-root': {\n      borderRadius: 0,\n    },\n\n    // Botones integrados: sin radius propio, altura completa, sin sombra.\n    '& .MuiButton-root': {\n      borderRadius: 0,\n      height: '100%',\n      boxShadow: 'none',\n      border: 'none',\n    },\n\n    // Slots: cada hijo vive en un slot neutro que lo centra verticalmente.\n    '& > .InputGroup__slot': {\n      flex: 1,\n      display: 'flex',\n      alignItems: 'center',\n      minWidth: 0,\n      // Separador entre slots (horizontal: borderRight / vertical: borderBottom),\n      // usando el color de divider del theme.\n      ...(isHorizontal\n        ? { borderRight: (theme: Theme) => `1px solid ${theme.palette.divider}` }\n        : { borderBottom: (theme: Theme) => `1px solid ${theme.palette.divider}` }),\n      '&:last-of-type': {\n        borderRight: 'none',\n        borderBottom: 'none',\n      },\n    },\n\n    // Esquinas redondeadas: primer slot (izquierda o arriba).\n    '& > .InputGroup__slot:first-of-type .MuiInputBase-root, & > .InputGroup__slot:first-of-type .MuiButton-root, & > .InputGroup__slot:first-of-type .MuiChip-root':\n      isHorizontal\n        ? {\n            borderTopLeftRadius: radius,\n            borderBottomLeftRadius: radius,\n          }\n        : {\n            borderTopLeftRadius: radius,\n            borderTopRightRadius: radius,\n          },\n\n    // Esquinas redondeadas: último slot (derecha o abajo).\n    '& > .InputGroup__slot:last-of-type .MuiInputBase-root, & > .InputGroup__slot:last-of-type .MuiButton-root, & > .InputGroup__slot:last-of-type .MuiChip-root':\n      isHorizontal\n        ? {\n            borderTopRightRadius: radius,\n            borderBottomRightRadius: radius,\n          }\n        : {\n            borderBottomLeftRadius: radius,\n            borderBottomRightRadius: radius,\n          },\n  };\n\n  const baseSlotSx: SxProps<Theme> = {\n    flex: 1,\n    display: 'flex',\n    alignItems: 'center',\n    minWidth: 0,\n  };\n\n  return (\n    <Box\n      data-testid=\"input-group\"\n      className={className}\n      aria-disabled={disabled ? 'true' : undefined}\n      sx={mergeSx(baseSx, sx)}\n    >\n      {slots.map((child, i) => (\n        <Box\n          key={i}\n          className=\"InputGroup__slot\"\n          sx={mergeSx(baseSlotSx, slotSx)}\n        >\n          {child}\n        </Box>\n      ))}\n    </Box>\n  );\n};\n\nexport default InputGroup;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAM,UAAU,CAAC,MAAsB,UAA2C;AAChF,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,UAAU,MAAM,QAAQ,IAAI,IAAI,OAAO,CAAC,IAAI;AAClD,QAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,QAAQ,CAAC,KAAK;AACtD,SAAO,CAAC,GAAG,SAAS,GAAG,QAAQ;AACjC;AAcA,MAAM,aAAwC,CAAC;AAAA,EAC7C;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA,cAAc;AAAA,EACd;AACF,MAAM;AACJ,QAAM,SAAS,OAAO,iBAAiB,WAAW,GAAG,YAAY,OAAO;AACxE,QAAM,QAAQ,SAAS,QAAQ,QAAQ,EAAE,OAAO,cAAc;AAC9D,QAAM,eAAe,gBAAgB;AAErC,QAAM,SAAyB;AAAA;AAAA;AAAA;AAAA,IAI7B,WAAW;AAAA,IAEX,SAAS;AAAA,IACT,eAAe,eAAe,QAAQ;AAAA,IACtC,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,QAAQ,CAAC,UAAU,aAAa,MAAM,QAAQ,OAAO;AAAA,IACrD,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,YAAY;AAAA,IACZ,kBAAkB;AAAA,MAChB,aAAa;AAAA,MACb,WAAW,CAAC,UAAU,aAAa,MAAM,QAAQ,QAAQ,IAAI;AAAA,IAAA;AAAA,IAE/D,SAAS,WAAW,MAAM;AAAA,IAC1B,eAAe,WAAW,SAAS;AAAA;AAAA;AAAA,IAInC,oHAAoH;AAAA,MAClH,WAAW;AAAA,IAAA;AAAA;AAAA;AAAA,IAKb,sCAAsC;AAAA,MACpC,QAAQ;AAAA,IAAA;AAAA;AAAA;AAAA,IAKV,yCAAyC;AAAA,MACvC,cAAc;AAAA,IAAA;AAAA;AAAA,IAIhB,qBAAqB;AAAA,MACnB,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,QAAQ;AAAA,IAAA;AAAA;AAAA,IAIV,yBAAyB;AAAA,MACvB,MAAM;AAAA,MACN,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,OAGN,eACA,EAAE,aAAa,CAAC,UAAiB,aAAa,MAAM,QAAQ,OAAO,OACnE,EAAE,cAAc,CAAC,UAAiB,aAAa,MAAM,QAAQ,OAAO,GAAA,IATjD;AAAA,MAUvB,kBAAkB;AAAA,QAChB,aAAa;AAAA,QACb,cAAc;AAAA,MAAA;AAAA,IAChB;AAAA;AAAA,IAIF,kKACE,eACI;AAAA,MACE,qBAAqB;AAAA,MACrB,wBAAwB;AAAA,IAAA,IAE1B;AAAA,MACE,qBAAqB;AAAA,MACrB,sBAAsB;AAAA,IAAA;AAAA;AAAA,IAI9B,+JACE,eACI;AAAA,MACE,sBAAsB;AAAA,MACtB,yBAAyB;AAAA,IAAA,IAE3B;AAAA,MACE,wBAAwB;AAAA,MACxB,yBAAyB;AAAA,IAAA;AAAA,EAC3B;AAGR,QAAM,aAA6B;AAAA,IACjC,MAAM;AAAA,IACN,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,EAAA;AAGZ,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACZ;AAAA,MACA,iBAAe,WAAW,SAAS;AAAA,MACnC,IAAI,QAAQ,QAAQ,EAAE;AAAA,MAErB,UAAA,MAAM,IAAI,CAAC,OAAO,MACjB;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,WAAU;AAAA,UACV,IAAI,QAAQ,YAAY,MAAM;AAAA,UAE7B,UAAA;AAAA,QAAA;AAAA,QAJI;AAAA,MAAA,CAMR;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/Modal/Modal.cjs

@@ -34,6 +34,10 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const material = require("@mui/material");
+const InfoOutlinedIcon = require("@mui/icons-material/InfoOutlined");
+const WarningAmberIcon = require("@mui/icons-material/WarningAmber");
+const ErrorOutlineIcon = require("@mui/icons-material/ErrorOutline");
+const CheckCircleOutlineIcon = require("@mui/icons-material/CheckCircleOutline");
 const ModalFooter = ({
   // Renombrado
   children,
@@ -56,17 +60,21 @@ const ModalFooter = ({
           children: closeButtonText
         }
       ),
-      actions.map((action, index) => /* @__PURE__ */ jsxRuntime.jsx(
-        material.Button,
-        {
-          onClick: action.onClick,
-          disabled: action.disabled,
-          variant: action.variant || "contained",
-          color: action.color || "primary",
-          children: action.text
-        },
-        index
-      ))
+      actions.map((action, index) => {
+        const { buttonProps } = action;
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          material.Button,
+          __spreadProps(__spreadValues({
+            onClick: action.onClick,
+            disabled: action.disabled,
+            variant: action.variant || "contained",
+            color: action.color || "primary"
+          }, buttonProps), {
+            children: action.text
+          }),
+          index
+        );
+      })
     ] })
   ] });
 };
@@ -87,123 +95,225 @@ const modalStyle = {
   flexDirection: "column",
   outline: "none"
 };
-const Modal = React.forwardRef(({
-  open: controlledOpen,
-  // Renombra la prop 'open' si se pasa externamente
-  onClose: controlledOnClose,
-  // Renombra la prop 'onClose' si se pasa externamente
-  title,
-  children,
-  showCloseButton = true,
-  closeButtonText = "Cerrar",
-  closeButtonDisabled = false,
-  actions = [],
-  maxWidth = "sm",
-  hiddenFooter = false
-}, ref) => {
-  const [internalOpen, setInternalOpen] = React.useState(false);
-  const isOpen = controlledOpen !== void 0 ? controlledOpen : internalOpen;
-  React.useImperativeHandle(ref, () => ({
-    open: () => setInternalOpen(true),
-    close: () => {
+const severityConfig = {
+  info: {
+    color: "primary",
+    icon: /* @__PURE__ */ jsxRuntime.jsx(InfoOutlinedIcon, { sx: { fontSize: 48 } }),
+    bg: "primary.light"
+  },
+  warning: {
+    color: "warning",
+    icon: /* @__PURE__ */ jsxRuntime.jsx(WarningAmberIcon, { sx: { fontSize: 48 } }),
+    bg: "warning.light"
+  },
+  error: {
+    color: "error",
+    icon: /* @__PURE__ */ jsxRuntime.jsx(ErrorOutlineIcon, { sx: { fontSize: 48 } }),
+    bg: "error.light"
+  },
+  success: {
+    color: "success",
+    icon: /* @__PURE__ */ jsxRuntime.jsx(CheckCircleOutlineIcon, { sx: { fontSize: 48 } }),
+    bg: "success.light"
+  }
+};
+const Modal = React.forwardRef(
+  ({
+    mode = "default",
+    open: controlledOpen,
+    onClose: controlledOnClose,
+    title,
+    children,
+    showCloseButton = true,
+    closeButtonText = "Cerrar",
+    closeButtonDisabled = false,
+    actions = [],
+    maxWidth = "sm",
+    hiddenFooter = false,
+    // Props del modo confirm
+    onConfirm,
+    confirmText = "Confirmar",
+    confirmDisabled = false,
+    severity = "info",
+    confirmMessage
+  }, ref) => {
+    const [internalOpen, setInternalOpen] = React.useState(false);
+    const [confirmLoading, setConfirmLoading] = React.useState(false);
+    const isOpen = controlledOpen !== void 0 ? controlledOpen : internalOpen;
+    React.useImperativeHandle(ref, () => ({
+      open: () => setInternalOpen(true),
+      close: () => {
+        setInternalOpen(false);
+        controlledOnClose == null ? void 0 : controlledOnClose();
+      }
+    }));
+    const handleCloseInternal = () => {
       setInternalOpen(false);
       controlledOnClose == null ? void 0 : controlledOnClose();
-    }
-  }));
-  const handleCloseInternal = () => {
-    setInternalOpen(false);
-    controlledOnClose == null ? void 0 : controlledOnClose();
-  };
-  const theme = material.useTheme();
-  const isMobile = material.useMediaQuery(theme.breakpoints.down("sm"));
-  const getWidth = () => {
-    if (isMobile) return "95%";
-    switch (maxWidth) {
-      case "xs":
-        return 300;
-      case "sm":
-        return 500;
-      case "md":
-        return 700;
-      case "lg":
-        return 900;
-      case "xl":
-        return 1100;
-      case false:
-        return "auto";
-      default:
-        return 500;
-    }
-  };
-  const renderChildren = () => {
-    let header = null;
-    let body = null;
-    let footer = null;
-    React.Children.forEach(children, (child) => {
-      if (React.isValidElement(child)) {
-        if (child.type === ModalHeader) {
-          header = child;
-        } else if (child.type === ModalBody) {
-          body = child;
-        } else if (child.type === ModalFooter) {
-          const footerChild = child;
-          const _a = footerChild.props, {
-            showCloseButton: childShowCloseButton,
-            closeButtonText: childCloseButtonText,
-            closeButtonDisabled: childCloseButtonDisabled,
-            onClose: childOnClose,
-            actions: childActions
-          } = _a, restOfFooterProps = __objRest(_a, [
-            "showCloseButton",
-            "closeButtonText",
-            "closeButtonDisabled",
-            "onClose",
-            "actions"
-          ]);
-          footer = React.cloneElement(footerChild, __spreadValues({
-            showCloseButton,
-            closeButtonText,
-            closeButtonDisabled,
-            onClose: handleCloseInternal,
-            // Usa la función de cierre interna
-            actions
-          }, restOfFooterProps));
+    };
+    const handleConfirm = async () => {
+      if (!onConfirm) {
+        handleCloseInternal();
+        return;
+      }
+      try {
+        const result = onConfirm();
+        if (result instanceof Promise) {
+          setConfirmLoading(true);
+          await result;
         }
+      } finally {
+        setConfirmLoading(false);
+        handleCloseInternal();
+      }
+    };
+    const theme = material.useTheme();
+    const isMobile = material.useMediaQuery(theme.breakpoints.down("sm"));
+    const getWidth = () => {
+      if (isMobile) return "95%";
+      switch (maxWidth) {
+        case "xs":
+          return 300;
+        case "sm":
+          return 500;
+        case "md":
+          return 700;
+        case "lg":
+          return 900;
+        case "xl":
+          return 1100;
+        case false:
+          return "auto";
+        default:
+          return 500;
       }
-    });
-    if (!footer && !hiddenFooter) {
-      footer = /* @__PURE__ */ jsxRuntime.jsx(
-        ModalFooter,
+    };
+    if (mode === "confirm") {
+      const config = severityConfig[severity];
+      const message = confirmMessage != null ? confirmMessage : children;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        material.Modal,
         {
-          showCloseButton,
-          closeButtonText,
-          closeButtonDisabled,
+          open: isOpen,
           onClose: handleCloseInternal,
-          actions
+          "aria-labelledby": "modal-title",
+          closeAfterTransition: true,
+          children: /* @__PURE__ */ jsxRuntime.jsxs(material.Paper, { sx: __spreadProps(__spreadValues({}, modalStyle), { width: getWidth() }), children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(material.Stack, { spacing: 2.5, sx: { p: 3, alignItems: "center", textAlign: "center" }, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                material.Box,
+                {
+                  sx: {
+                    width: 72,
+                    height: 72,
+                    borderRadius: "50%",
+                    backgroundColor: (t) => t.palette[severity === "info" ? "primary" : severity].light,
+                    color: (t) => t.palette[severity === "info" ? "primary" : severity].dark,
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    opacity: 0.9
+                  },
+                  children: config.icon
+                }
+              ),
+              title && /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "h6", component: "h2", sx: { fontWeight: 700 }, children: title }),
+              message && /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", color: "text.secondary", children: message })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ModalFooter,
+              {
+                showCloseButton,
+                closeButtonText,
+                closeButtonDisabled: closeButtonDisabled || confirmLoading,
+                onClose: handleCloseInternal,
+                actions: [
+                  {
+                    text: confirmText,
+                    onClick: handleConfirm,
+                    disabled: confirmDisabled || confirmLoading,
+                    variant: "contained",
+                    color: config.color
+                  }
+                ]
+              }
+            )
+          ] })
         }
       );
     }
-    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      header || title && /* @__PURE__ */ jsxRuntime.jsx(ModalHeader, { children: title }),
-      body,
-      footer
-    ] });
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    material.Modal,
-    {
-      open: isOpen,
-      onClose: handleCloseInternal,
-      "aria-labelledby": "modal-title",
-      "aria-describedby": "modal-description",
-      closeAfterTransition: true,
-      children: /* @__PURE__ */ jsxRuntime.jsx(material.Paper, { sx: __spreadProps(__spreadValues({}, modalStyle), { width: getWidth() }), children: renderChildren() })
-    }
-  );
-});
+    const renderChildren = () => {
+      let header = null;
+      let body = null;
+      let footer = null;
+      React.Children.forEach(children, (child) => {
+        if (React.isValidElement(child)) {
+          if (child.type === ModalHeader) {
+            header = child;
+          } else if (child.type === ModalBody) {
+            body = child;
+          } else if (child.type === ModalFooter) {
+            const footerChild = child;
+            const _a = footerChild.props, {
+              showCloseButton: childShowCloseButton,
+              closeButtonText: childCloseButtonText,
+              closeButtonDisabled: childCloseButtonDisabled,
+              onClose: childOnClose,
+              actions: childActions
+            } = _a, restOfFooterProps = __objRest(_a, [
+              "showCloseButton",
+              "closeButtonText",
+              "closeButtonDisabled",
+              "onClose",
+              "actions"
+            ]);
+            footer = React.cloneElement(footerChild, __spreadValues({
+              showCloseButton,
+              closeButtonText,
+              closeButtonDisabled,
+              onClose: handleCloseInternal,
+              actions
+            }, restOfFooterProps));
+          }
+        }
+      });
+      if (!footer && !hiddenFooter) {
+        footer = /* @__PURE__ */ jsxRuntime.jsx(
+          ModalFooter,
+          {
+            showCloseButton,
+            closeButtonText,
+            closeButtonDisabled,
+            onClose: handleCloseInternal,
+            actions
+          }
+        );
+      }
+      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        header || title && /* @__PURE__ */ jsxRuntime.jsx(ModalHeader, { children: title }),
+        body,
+        footer
+      ] });
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      material.Modal,
+      {
+        open: isOpen,
+        onClose: handleCloseInternal,
+        "aria-labelledby": "modal-title",
+        "aria-describedby": "modal-description",
+        closeAfterTransition: true,
+        children: /* @__PURE__ */ jsxRuntime.jsx(material.Paper, { sx: __spreadProps(__spreadValues({}, modalStyle), { width: getWidth() }), children: renderChildren() })
+      }
+    );
+  }
+);
 const ModalWithStatics = Modal;
 ModalWithStatics.Header = ModalHeader;
 ModalWithStatics.Body = ModalBody;
 ModalWithStatics.Footer = ModalFooter;
 exports.Modal = ModalWithStatics;
+exports.ModalBody = ModalBody;
+exports.ModalFooter = ModalFooter;
+exports.ModalHeader = ModalHeader;
 //# sourceMappingURL=Modal.cjs.map

package/dist/components/Modal/Modal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.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, Button, Stack } from '@mui/material';\nimport { ButtonProps } from '@mui/material/Button';\n\n// Interfaz para acciones personalizadas (se mantiene aquí)\nexport interface ModalAction {\n  text: string;\n  onClick: () => void;\n  disabled?: boolean;\n  variant?: ButtonProps['variant'];\n  color?: ButtonProps['color'];\n}\n\nexport interface ModalFooterProps { // Renombrado\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> = ({ // Renombrado\n  children,\n  showCloseButton = true,\n  closeButtonText = \"Cerrar\",\n  closeButtonDisabled = false,\n  onClose,\n  actions = [],\n}) => {\n  return (\n    <Box sx={{ padding: 2, borderTop: '1px solid #e0e0e0', display: 'flex', justifyContent: 'flex-end', gap: 1 }}>\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, index) => (\n          <Button\n            key={index}\n            onClick={action.onClick}\n            disabled={action.disabled}\n            variant={action.variant || 'contained'}\n            color={action.color || 'primary'}\n          >\n            {action.text}\n          </Button>\n        ))}\n      </Stack>\n    </Box>\n  );\n};\n\nexport default ModalFooter;","import React from 'react';\nimport { Box, Typography } from '@mui/material';\n\ninterface ModalHeaderProps { // Renombrado\n  children: React.ReactNode;\n}\n\nexport const ModalHeader: React.FC<ModalHeaderProps> = ({ children }) => { // Renombrado\n  return (\n    <Box sx={{ padding: 2, borderBottom: '1px solid #e0e0e0', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n      <Typography variant=\"h6\" component=\"h2\">\n        {children}\n      </Typography>\n    </Box>\n  );\n};\n\nexport default ModalHeader;","import React from 'react';\nimport { Box } from '@mui/material';\n\ninterface ModalBodyProps { // Renombrado\n  children: React.ReactNode;\n}\n\nexport const ModalBody: React.FC<ModalBodyProps> = ({ children }) => { // Renombrado\n  return (\n    <Box sx={{ padding: 2, overflowY: 'auto', flexGrow: 1 }}>\n      {children}\n    </Box>\n  );\n};\n\nexport default ModalBody;","import React, { useState, useImperativeHandle, forwardRef } from 'react'; // 👈 Importa useImperativeHandle y forwardRef\nimport { Modal as MuiModal, Box, Paper, useTheme, useMediaQuery } from '@mui/material';\n\nimport { DialogProps } from '@mui/material/Dialog';\nimport { ModalAction, ModalFooter, ModalFooterProps } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\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\ninterface ModalProps {\n  // La prop 'open' ahora es opcional si se usa con ref, pero aún puede ser controlada externamente\n  open?: boolean;\n  onClose?: () => void; // 'onClose' ahora es opcional ya que el modal puede cerrarse internamente\n  title?: string;\n  children: React.ReactNode;\n  showCloseButton?: boolean;\n  closeButtonText?: string;\n  closeButtonDisabled?: boolean;\n  actions?: ModalAction[];\n  maxWidth?: DialogProps['maxWidth'];\n  hiddenFooter?: boolean\n}\n\nconst modalStyle = {\n  position: 'absolute' as 'absolute',\n  top: '50%',\n  left: '50%',\n  transform: 'translate(-50%, -50%)',\n  width: '90%',\n  maxHeight: '90vh',\n  display: 'flex',\n  flexDirection: 'column',\n  outline: 'none',\n};\n\n// Envuelve el componente en forwardRef\nexport const Modal = forwardRef<ModalRef, ModalProps>(({\n  open: controlledOpen, // Renombra la prop 'open' si se pasa externamente\n  onClose: controlledOnClose, // Renombra la prop 'onClose' si se pasa externamente\n  title,\n  children,\n  showCloseButton = true,\n  closeButtonText = \"Cerrar\",\n  closeButtonDisabled = false,\n  actions = [],\n  maxWidth = 'sm',\n  hiddenFooter = false,\n}, ref) => { // Recibe la ref\n  // Estado interno para gestionar la visibilidad si no es controlado externamente\n  const [internalOpen, setInternalOpen] = useState(false);\n\n  // Determina si el modal está abierto, priorizando la prop externa\n  const isOpen = controlledOpen !== undefined ? controlledOpen : internalOpen;\n\n  // Expone métodos 'open' y 'close' a través de la ref\n  useImperativeHandle(ref, () => ({\n    open: () => setInternalOpen(true),\n    close: () => {\n      setInternalOpen(false);\n      controlledOnClose?.(); // Llama al onClose externo si existe\n    },\n  }));\n\n  const handleCloseInternal = () => {\n    setInternalOpen(false);\n    controlledOnClose?.(); // Llama al onClose externo si existe\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': return 300;\n      case 'sm': return 500;\n      case 'md': return 700;\n      case 'lg': return 900;\n      case 'xl': return 1100;\n      case false: return 'auto';\n      default: return 500;\n    }\n  };\n\n  const renderChildren = () => {\n    let header: React.ReactNode | null = null;\n    let body: React.ReactNode | null = null;\n    let footer: React.ReactNode | null = null;\n\n    React.Children.forEach(children, (child) => {\n      if (React.isValidElement(child)) {\n        if (child.type === ModalHeader) {\n          header = child;\n        } else if (child.type === ModalBody) {\n          body = child;\n        } else if (child.type === ModalFooter) {\n          const footerChild = child as React.ReactElement<ModalFooterProps>;\n          const {\n            showCloseButton: childShowCloseButton,\n            closeButtonText: childCloseButtonText,\n            closeButtonDisabled: childCloseButtonDisabled,\n            onClose: childOnClose,\n            actions: childActions,\n            ...restOfFooterProps\n          } = footerChild.props;\n\n          footer = React.cloneElement(footerChild, {\n            showCloseButton,\n            closeButtonText,\n            closeButtonDisabled,\n            onClose: handleCloseInternal, // Usa la función de cierre interna\n            actions,\n            ...restOfFooterProps,\n          });\n        }\n      }\n    });\n\n    if (!footer && !hiddenFooter) {\n      footer = (\n        <ModalFooter\n          showCloseButton={showCloseButton}\n          closeButtonText={closeButtonText}\n          closeButtonDisabled={closeButtonDisabled}\n          onClose={handleCloseInternal} // Usa la función de cierre interna\n          actions={actions}\n        />\n      );\n    }\n\n    return (\n      <>\n        {header || (title && <ModalHeader>{title}</ModalHeader>)}\n        {body}\n        {footer}\n      </>\n    );\n  };\n\n  return (\n    <MuiModal\n      open={isOpen} // Usa el estado de visibilidad determinado\n      onClose={handleCloseInternal} // Usa la función de cierre interna\n      aria-labelledby=\"modal-title\"\n      aria-describedby=\"modal-description\"\n      closeAfterTransition\n    >\n      <Paper sx={{ ...modalStyle, width: getWidth() }}>\n        {renderChildren()}\n      </Paper>\n    </MuiModal>\n  );\n});\n\n// Define los sub-componentes como propiedades estáticas con tipos explícitos\ntype ModalComponent = React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<ModalRef>> & {\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;"],"names":["jsxs","Box","Stack","jsx","Button","Typography","forwardRef","useState","useImperativeHandle","useTheme","useMediaQuery","Fragment","MuiModal","Paper"],"mappings":"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"}
+{"version":3,"file":"Modal.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, Button, Stack } from '@mui/material';\nimport { ButtonProps } from '@mui/material/Button';\n\n// Interfaz para acciones personalizadas (se mantiene aquí)\nexport interface ModalAction {\n  text: string;\n  onClick?: () => void;\n  disabled?: boolean;\n  variant?: ButtonProps['variant'];\n  color?: ButtonProps['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<ButtonProps> & { form?: string };\n}\n\nexport interface ModalFooterProps { // Renombrado\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> = ({ // Renombrado\n  children,\n  showCloseButton = true,\n  closeButtonText = \"Cerrar\",\n  closeButtonDisabled = false,\n  onClose,\n  actions = [],\n}) => {\n  return (\n    <Box sx={{ padding: 2, borderTop: '1px solid #e0e0e0', display: 'flex', justifyContent: 'flex-end', gap: 1 }}>\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, index) => {\n          const { buttonProps } = action;\n          return (\n            <Button\n              key={index}\n              onClick={action.onClick}\n              disabled={action.disabled}\n              variant={action.variant || 'contained'}\n              color={action.color || 'primary'}\n              {...(buttonProps as any)}\n            >\n              {action.text}\n            </Button>\n          );\n        })}\n      </Stack>\n    </Box>\n  );\n};\n\nexport default ModalFooter;","import React from 'react';\nimport { Box, Typography } from '@mui/material';\n\ninterface ModalHeaderProps { // Renombrado\n  children: React.ReactNode;\n}\n\nexport const ModalHeader: React.FC<ModalHeaderProps> = ({ children }) => { // Renombrado\n  return (\n    <Box sx={{ padding: 2, borderBottom: '1px solid #e0e0e0', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n      <Typography variant=\"h6\" component=\"h2\">\n        {children}\n      </Typography>\n    </Box>\n  );\n};\n\nexport default ModalHeader;","import React from 'react';\nimport { Box } from '@mui/material';\n\ninterface ModalBodyProps { // Renombrado\n  children: React.ReactNode;\n}\n\nexport const ModalBody: React.FC<ModalBodyProps> = ({ children }) => { // Renombrado\n  return (\n    <Box sx={{ padding: 2, overflowY: 'auto', flexGrow: 1 }}>\n      {children}\n    </Box>\n  );\n};\n\nexport default ModalBody;","import React, {\n  useState,\n  useImperativeHandle,\n  forwardRef,\n  type ReactNode,\n} from 'react';\nimport {\n  Modal as MuiModal,\n  Paper,\n  useTheme,\n  useMediaQuery,\n  Box,\n  Stack,\n  Typography,\n} from '@mui/material';\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 { ModalAction, ModalFooter, ModalFooterProps } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\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\ninterface 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  hiddenFooter?: boolean;\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  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; bg: string }\n> = {\n  info: {\n    color: 'primary',\n    icon: <InfoOutlinedIcon sx={{ fontSize: 48 }} />,\n    bg: 'primary.light',\n  },\n  warning: {\n    color: 'warning',\n    icon: <WarningAmberIcon sx={{ fontSize: 48 }} />,\n    bg: 'warning.light',\n  },\n  error: {\n    color: 'error',\n    icon: <ErrorOutlineIcon sx={{ fontSize: 48 }} />,\n    bg: 'error.light',\n  },\n  success: {\n    color: 'success',\n    icon: <CheckCircleOutlineIcon sx={{ fontSize: 48 }} />,\n    bg: 'success.light',\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      hiddenFooter = false,\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    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      try {\n        const result = onConfirm();\n        if (result instanceof Promise) {\n          setConfirmLoading(true);\n          await result;\n        }\n      } finally {\n        setConfirmLoading(false);\n        handleCloseInternal();\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          return 500;\n      }\n    };\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=\"modal-title\"\n          closeAfterTransition\n        >\n          <Paper sx={{ ...modalStyle, width: getWidth() }}>\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) =>\n                    t.palette[severity === 'info' ? 'primary' : severity].light,\n                  color: (t) =>\n                    t.palette[severity === 'info' ? 'primary' : severity].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 variant=\"h6\" component=\"h2\" sx={{ fontWeight: 700 }}>\n                  {title}\n                </Typography>\n              )}\n              {message && (\n                <Typography 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 (legacy) ────────────────────────────────────\n    const renderChildren = () => {\n      let header: ReactNode | null = null;\n      let body: ReactNode | null = null;\n      let footer: ReactNode | null = null;\n\n      React.Children.forEach(children, (child) => {\n        if (React.isValidElement(child)) {\n          if (child.type === ModalHeader) {\n            header = child;\n          } else if (child.type === ModalBody) {\n            body = child;\n          } else if (child.type === ModalFooter) {\n            const footerChild = child as React.ReactElement<ModalFooterProps>;\n            const {\n              showCloseButton: childShowCloseButton,\n              closeButtonText: childCloseButtonText,\n              closeButtonDisabled: childCloseButtonDisabled,\n              onClose: childOnClose,\n              actions: childActions,\n              ...restOfFooterProps\n            } = footerChild.props;\n\n            footer = React.cloneElement(footerChild, {\n              showCloseButton,\n              closeButtonText,\n              closeButtonDisabled,\n              onClose: handleCloseInternal,\n              actions,\n              ...restOfFooterProps,\n            });\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          {header || (title && <ModalHeader>{title}</ModalHeader>)}\n          {body}\n          {footer}\n        </>\n      );\n    };\n\n    return (\n      <MuiModal\n        open={isOpen}\n        onClose={handleCloseInternal}\n        aria-labelledby=\"modal-title\"\n        aria-describedby=\"modal-description\"\n        closeAfterTransition\n      >\n        <Paper sx={{ ...modalStyle, width: getWidth() }}>\n          {renderChildren()}\n        </Paper>\n      </MuiModal>\n    );\n  },\n);\n\n// Define los sub-componentes como propiedades estáticas con tipos explícitos\ntype ModalComponent = React.ForwardRefExoticComponent<\n  ModalProps & React.RefAttributes<ModalRef>\n> & {\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","useImperativeHandle","useTheme","useMediaQuery","MuiModal","Paper","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,MAAM,cAA0C,CAAC;AAAA;AAAA,EACtD;AAAA,EACA,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EACtB;AAAA,EACA,UAAU,CAAA;AACZ,MAAM;AACJ,SACEA,2BAAAA,KAACC,SAAAA,KAAA,EAAI,IAAI,EAAE,SAAS,GAAG,WAAW,qBAAqB,SAAS,QAAQ,gBAAgB,YAAY,KAAK,KACtG,UAAA;AAAA,IAAA;AAAA,IACDD,2BAAAA,KAACE,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAC7B,UAAA;AAAA,MAAA,mBACCC,2BAAAA;AAAAA,QAACC,SAAAA;AAAAA,QAAA;AAAA,UACC,SAAS;AAAA,UACT,UAAU;AAAA,UACV,SAAQ;AAAA,UACR,OAAM;AAAA,UAEL,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAGJ,QAAQ,IAAI,CAAC,QAAQ,UAAU;AAC9B,cAAM,EAAE,gBAAgB;AACxB,eACED,2BAAAA;AAAAA,UAACC,SAAAA;AAAAA,UAAA;AAAA,YAEC,SAAS,OAAO;AAAA,YAChB,UAAU,OAAO;AAAA,YACjB,SAAS,OAAO,WAAW;AAAA,YAC3B,OAAO,OAAO,SAAS;AAAA,aAClB,cANN;AAAA,YAQE,UAAA,OAAO;AAAA,UAAA;AAAA,UAPH;AAAA,QAAA;AAAA,MAUX,CAAC;AAAA,IAAA,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;AC7DO,MAAM,cAA0C,CAAC,EAAE,eAAe;AACvE,SACED,+BAACF,SAAAA,OAAI,IAAI,EAAE,SAAS,GAAG,cAAc,qBAAqB,SAAS,QAAQ,YAAY,UAAU,gBAAgB,gBAAA,GAC/G,UAAAE,2BAAAA,IAACE,SAAAA,YAAA,EAAW,SAAQ,MAAK,WAAU,MAChC,SAAA,CACH,EAAA,CACF;AAEJ;ACRO,MAAM,YAAsC,CAAC,EAAE,eAAe;AACnE,SACEF,2BAAAA,IAACF,SAAAA,KAAA,EAAI,IAAI,EAAE,SAAS,GAAG,WAAW,QAAQ,UAAU,EAAA,GACjD,SAAA,CACH;AAEJ;ACwEA,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,IAAI;AAAA,EAAA;AAAA,EAEN,SAAS;AAAA,IACP,OAAO;AAAA,IACP,MAAMA,2BAAAA,IAAC,kBAAA,EAAiB,IAAI,EAAE,UAAU,MAAM;AAAA,IAC9C,IAAI;AAAA,EAAA;AAAA,EAEN,OAAO;AAAA,IACL,OAAO;AAAA,IACP,MAAMA,2BAAAA,IAAC,kBAAA,EAAiB,IAAI,EAAE,UAAU,MAAM;AAAA,IAC9C,IAAI;AAAA,EAAA;AAAA,EAEN,SAAS;AAAA,IACP,OAAO;AAAA,IACP,MAAMA,2BAAAA,IAAC,wBAAA,EAAuB,IAAI,EAAE,UAAU,MAAM;AAAA,IACpD,IAAI;AAAA,EAAA;AAER;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;AAAA,IAGf;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;AAE1D,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,UAAI;AACF,cAAM,SAAS,UAAA;AACf,YAAI,kBAAkB,SAAS;AAC7B,4BAAkB,IAAI;AACtB,gBAAM;AAAA,QACR;AAAA,MACF,UAAA;AACE,0BAAkB,KAAK;AACvB,4BAAA;AAAA,MACF;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;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb;AAGA,QAAI,SAAS,WAAW;AACtB,YAAM,SAAS,eAAe,QAAQ;AACtC,YAAM,UAAU,0CAAkB;AAElC,aACEP,2BAAAA;AAAAA,QAACQ,SAAAA;AAAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,SAAS;AAAA,UACT,mBAAgB;AAAA,UAChB,sBAAoB;AAAA,UAEpB,UAAAX,2BAAAA,KAACY,kBAAM,IAAI,iCAAK,aAAL,EAAiB,OAAO,WAAS,IAC1C,UAAA;AAAA,YAAAZ,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,MAChB,EAAE,QAAQ,aAAa,SAAS,YAAY,QAAQ,EAAE;AAAA,oBACxD,OAAO,CAAC,MACN,EAAE,QAAQ,aAAa,SAAS,YAAY,QAAQ,EAAE;AAAA,oBACxD,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,SAAQ,MAAK,WAAU,MAAK,IAAI,EAAE,YAAY,IAAA,GACvD,UAAA,MAAA,CACH;AAAA,cAED,WACCF,2BAAAA,IAACE,SAAAA,YAAA,EAAW,SAAQ,SAAQ,OAAM,kBAC/B,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/B,YAAM,SAAS,QAAQ,UAAU,CAAC,UAAU;AAC1C,YAAI,MAAM,eAAe,KAAK,GAAG;AAC/B,cAAI,MAAM,SAAS,aAAa;AAC9B,qBAAS;AAAA,UACX,WAAW,MAAM,SAAS,WAAW;AACnC,mBAAO;AAAA,UACT,WAAW,MAAM,SAAS,aAAa;AACrC,kBAAM,cAAc;AACpB,kBAOI,iBAAY,OANd;AAAA,+BAAiB;AAAA,cACjB,iBAAiB;AAAA,cACjB,qBAAqB;AAAA,cACrB,SAAS;AAAA,cACT,SAAS;AAAA,gBAEP,IADC,8BACD,IADC;AAAA,cALH;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA;AAIF,qBAAS,MAAM,aAAa,aAAa;AAAA,cACvC;AAAA,cACA;AAAA,cACA;AAAA,cACA,SAAS;AAAA,cACT;AAAA,eACG,kBACJ;AAAA,UACH;AAAA,QACF;AAAA,MACF,CAAC;AAED,UAAI,CAAC,UAAU,CAAC,cAAc;AAC5B,iBACEA,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,KAAAa,qBAAA,EACG,UAAA;AAAA,QAAA,UAAW,SAASV,2BAAAA,IAAC,aAAA,EAAa,UAAA,OAAM;AAAA,QACxC;AAAA,QACA;AAAA,MAAA,GACH;AAAA,IAEJ;AAEA,WACEA,2BAAAA;AAAAA,MAACQ,SAAAA;AAAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,SAAS;AAAA,QACT,mBAAgB;AAAA,QAChB,oBAAiB;AAAA,QACjB,sBAAoB;AAAA,QAEpB,UAAAR,2BAAAA,IAACS,gBAAA,EAAM,IAAI,iCAAK,aAAL,EAAiB,OAAO,SAAA,EAAS,IACzC,UAAA,eAAA,EAAe,CAClB;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAWA,MAAM,mBAAmB;AAEzB,iBAAiB,SAAS;AAC1B,iBAAiB,OAAO;AACxB,iBAAiB,SAAS;;;;;"}

package/dist/components/Modal/Modal.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
+import { default as React, ReactNode } from 'react';
 import { DialogProps } from '@mui/material/Dialog';
 import { ModalAction, ModalFooter } from './ModalFooter';
 import { ModalHeader } from './ModalHeader';
@@ -7,17 +7,53 @@ export interface ModalRef {
     open: () => void;
     close: () => void;
 }
+export type ModalMode = 'default' | 'confirm';
+export type ModalSeverity = 'info' | 'warning' | 'error' | 'success';
 interface ModalProps {
+    /**
+     * Modo del modal.
+     * - `default` (default): modal genérico con slots `Header`/`Body`/`Footer` y
+     *   `actions` custom.
+     * - `confirm`: reemplaza al `ConfirmModal` legacy. Renderiza un layout
+     *   focalizado con icono por severidad, mensaje y botones "Cancelar" /
+     *   "Confirmar".
+     */
+    mode?: ModalMode;
+    /** Controlado externamente. Omitir si se usa vía ref. */
     open?: boolean;
+    /** Callback al cerrar. También se dispara al confirmar/cancelar. */
     onClose?: () => void;
     title?: string;
-    children: React.ReactNode;
+    children?: ReactNode;
     showCloseButton?: boolean;
     closeButtonText?: string;
     closeButtonDisabled?: boolean;
     actions?: ModalAction[];
     maxWidth?: DialogProps['maxWidth'];
     hiddenFooter?: boolean;
+    /**
+     * Callback de confirmación. Soporta promesa — si devuelve `Promise`, el
+     * botón muestra estado `disabled` mientras resuelve.
+     */
+    onConfirm?: () => void | Promise<void>;
+    /** Texto del botón primario en modo `confirm`. Default: "Confirmar". */
+    confirmText?: string;
+    /** Deshabilita el botón de confirmar. */
+    confirmDisabled?: boolean;
+    /**
+     * Severidad visual en modo `confirm`. Controla el icono y el color del
+     * botón de confirmación.
+     * - `info` (default): primary
+     * - `warning`: warning (amarillo)
+     * - `error`: error (rojo) — típico para "Eliminar"
+     * - `success`: success (verde) — típico para "Aprobar"
+     */
+    severity?: ModalSeverity;
+    /**
+     * Mensaje del confirm. Puede ser string o cualquier ReactNode. Si se omite,
+     * se usa `children`.
+     */
+    confirmMessage?: ReactNode;
 }
 export declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<ModalRef>>;
 type ModalComponent = React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<ModalRef>> & {