componentes-sinco 1.1.10 → 1.1.12

package/dist/index.js

@@ -748,7 +748,7 @@ var Attachment = ({
 
 // src/Components/Drawer/SCDrawer.tsx
 import React16 from "react";
-import { Drawer, Stack as Stack6, SwipeableDrawer, Box as Box11 } from "@mui/material";
+import { Drawer, Stack as Stack6, SwipeableDrawer, Box as Box11, Button as Button8 } from "@mui/material";
 import Grid6 from "@mui/material/Grid";
 
 // src/Components/Drawer/Helpers/Utils.tsx
@@ -2225,7 +2225,7 @@ var DrawerActions = ({ actions, anchor }) => {
       sx: { borderTop: 1, borderColor: "#1018403B", zIndex: 1500 },
       container: true,
       gap: 2,
-      padding: "8px 12px",
+      padding: "8px 16px",
       height: "42px",
       alignItems: "center",
       flexWrap: "nowrap",
@@ -2386,6 +2386,11 @@ function SCDrawer({
       onOpen: toggleDrawer(true),
       anchor: "bottom",
       swipeAreaWidth: drawerBleeding,
+      transitionDuration: { enter: 500, exit: 400 },
+      ModalProps: {
+        BackdropProps: { timeout: 400 }
+      },
+      hysteresis: 0.2,
       sx: {
         zIndex: 1400,
         "& .MuiDrawer-paper": {
@@ -2394,6 +2399,11 @@ function SCDrawer({
           boxSizing: "border-box",
           borderRadius: "4px 4px 0px 0px"
         }
+      },
+      slotProps: {
+        backdrop: {
+          sx: { backgroundColor: "#00000038" }
+        }
       }
     },
     /* @__PURE__ */ React16.createElement(
@@ -2418,7 +2428,33 @@ function SCDrawer({
         onClose: handleDrawerClose,
         anchor
       }
-    ), /* @__PURE__ */ React16.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ React16.createElement(DrawerActions, { actions: drawerActions, anchor }))
+    ), /* @__PURE__ */ React16.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ React16.createElement(
+      Grid6,
+      {
+        sx: { zIndex: 1500 },
+        container: true,
+        gap: 2,
+        padding: "8px 16px 40px 16px",
+        height: "86px",
+        alignItems: "center",
+        flexWrap: "nowrap",
+        justifyContent: Array.isArray(drawerActions) && drawerActions.length > 1 ? "space-between" : "flex-end",
+        flexDirection: "row-reverse"
+      },
+      Array.isArray(drawerActions) && drawerActions.map((btn, index) => /* @__PURE__ */ React16.createElement(
+        Button8,
+        {
+          key: index,
+          variant: index === 0 || drawerActions.length < 2 ? "contained" : "text",
+          color: "primary",
+          onClick: btn.fn,
+          disabled: btn.disabled || false,
+          size: "small",
+          fullWidth: anchor === "bottom" ? true : false
+        },
+        btn.text
+      ))
+    ))
   ));
 }
 
@@ -2453,7 +2489,7 @@ var FooterAction = ({
 
 // src/Components/MultiSelect/MultiSelect.tsx
 import React18, { useEffect as useEffect11, useMemo as useMemo4 } from "react";
-import { Button as Button8, Checkbox as Checkbox2, FormControl as FormControl3, InputAdornment as InputAdornment5, ListItemIcon as ListItemIcon3, MenuItem as MenuItem3, Popover as Popover3, Stack as Stack7, TextField as TextField4 } from "@mui/material";
+import { Button as Button9, Checkbox as Checkbox2, FormControl as FormControl3, InputAdornment as InputAdornment5, ListItemIcon as ListItemIcon3, MenuItem as MenuItem3, Popover as Popover3, Stack as Stack7, TextField as TextField4 } from "@mui/material";
 import { SearchOutlined } from "@mui/icons-material";
 
 // src/Components/MultiSelect/helpers/useHandlers.tsx
@@ -2533,7 +2569,7 @@ function MultiSelect({
   selectAll = false,
   getItemLabel
 }) {
-  var _a, _b;
+  var _a, _b, _c;
   const {
     anchorEl,
     open: openMultiselect,
@@ -2570,7 +2606,7 @@ function MultiSelect({
     } }
   ];
   return /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(
-    Button8,
+    Button9,
     {
       "test-id": "multiselect-button",
       color: (_a = button == null ? void 0 : button.color) != null ? _a : "primary",
@@ -2580,7 +2616,7 @@ function MultiSelect({
       startIcon: (button == null ? void 0 : button.iconPosition) === "left" || !(button == null ? void 0 : button.iconPosition) ? /* @__PURE__ */ React18.createElement(Icon, null) : null,
       endIcon: (button == null ? void 0 : button.iconPosition) === "right" ? /* @__PURE__ */ React18.createElement(Icon, null) : null
     },
-    capitalize(textButton != null ? textButton : "MultiSelect")
+    capitalize((_c = button == null ? void 0 : button.text) != null ? _c : "")
   ), /* @__PURE__ */ React18.createElement(
     Popover3,
     {
@@ -2624,7 +2660,7 @@ function MultiSelect({
     )) : /* @__PURE__ */ React18.createElement(MenuItem3, { disabled: true }, "No se encontraron resultados")), /* @__PURE__ */ React18.createElement(Stack7, { direction: "row", gap: 1, p: 1, justifyContent: "space-between", bgcolor: "grey.50" }, resolvedActions.map((button2, index) => {
       var _a2;
       return /* @__PURE__ */ React18.createElement(
-        Button8,
+        Button9,
         {
           key: index,
           variant: index === 0 || resolvedActions.length < 2 ? "text" : "contained",
@@ -2716,7 +2752,7 @@ var SCCalendarSwipeable = ({
       // 0 = domingo, 1 = lunes
     })
   });
-  return /* @__PURE__ */ React20.createElement(React20.Fragment, null, /* @__PURE__ */ React20.createElement(LocalizationProvider2, { dateAdapter: AdapterDateFns, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ React20.createElement(Box13, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React20.createElement(Box13, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ React20.createElement(Grid7, { container: true, gap: 0.5, sx: { justifyContent: "space-between", padding: "12px 0px", background: "transparent" } }, diasSemana.map((dia) => /* @__PURE__ */ React20.createElement(Grid7, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ React20.createElement(Box13, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React20.createElement(Typography11, { sx: { fontSize: "12px !important", color: "#10184099" } }, format(dia, "EEEE", { locale: es }).charAt(0).toUpperCase())), /* @__PURE__ */ React20.createElement(
+  return /* @__PURE__ */ React20.createElement(React20.Fragment, null, /* @__PURE__ */ React20.createElement(LocalizationProvider2, { dateAdapter: AdapterDateFns, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ React20.createElement(Box13, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React20.createElement(Box13, { sx: { width: "100%", padding: "0px 16px", background: "transparent" } }, /* @__PURE__ */ React20.createElement(Grid7, { container: true, gap: 0.5, sx: { justifyContent: "space-between", padding: "12px 0px", background: "transparent" } }, diasSemana.map((dia) => /* @__PURE__ */ React20.createElement(Grid7, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ React20.createElement(Box13, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React20.createElement(Typography11, { sx: { fontSize: "12px !important", color: "#10184099" } }, format(dia, "EEEE", { locale: es }).charAt(0).toUpperCase())), /* @__PURE__ */ React20.createElement(
     Box13,
     {
       onClick: () => setFecha(dia),
@@ -2740,7 +2776,22 @@ var SCCalendarSwipeable = ({
       openTo: "day",
       value: fecha,
       slotProps: { toolbar: { hidden: true }, actionBar: { actions: [] } },
-      sx: { fontSize: "12px !important", height: "300px !important", background: background ? background : "white", "& .MuiDayCalendar-header": { justifyContent: "space-between" }, "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" }, "& .MuiPickersCalendarHeader-root": { paddingLeft: "0px", paddingRight: "0px", color: "#10184099" }, "& .MuiPickersDay-root": { fontSize: "12px !important" }, "& .MuiDayCalendar-weekDayLabel": { fontSize: "12px !important" } },
+      sx: {
+        "& .MuiDateCalendar-root": {
+          width: "100%",
+          maxWidth: "unset",
+          margin: 0,
+          padding: "0px 16px"
+        },
+        fontSize: "12px !important",
+        height: "260px !important",
+        background: background ? background : "white",
+        "& .MuiDayCalendar-header": { justifyContent: "space-between" },
+        "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" },
+        "& .MuiPickersCalendarHeader-root": { paddingLeft: "0px", paddingRight: "0px", color: "#10184099" },
+        "& .MuiPickersDay-root": { fontSize: "12px !important" },
+        "& .MuiDayCalendar-weekDayLabel": { fontSize: "12px !important" }
+      },
       onChange: (newValue) => setFecha(newValue)
     }
   ), /* @__PURE__ */ React20.createElement(Grid7, { container: true, justifyContent: "center" }, /* @__PURE__ */ React20.createElement(IconButton9, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React20.createElement(KeyboardDoubleArrowUpIcon, null))))));
@@ -2753,7 +2804,7 @@ import { LicenseInfo as LicenseInfo2 } from "@mui/x-license";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
 import { useTheme } from "@mui/material/styles";
-function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSelection, width, maxHeight, density }) {
+function SCDataGridInitial({ data, columns, getRowId, groupColumns, rowsTable, checkboxSelection, width, maxHeight, density }) {
   LicenseInfo2.setLicenseKey(
     "77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
   );
@@ -2985,6 +3036,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
   return /* @__PURE__ */ React21.createElement(React21.Fragment, null, data && /* @__PURE__ */ React21.createElement(React21.Fragment, null, /* @__PURE__ */ React21.createElement("div", { style: { width: width || "100%", maxHeight: maxHeight ? `${maxHeight}px` : "none" } }, /* @__PURE__ */ React21.createElement(
     DataGridPro,
     {
+      getRowId,
       apiRef,
       rowHeight: styleRowHeight,
       rows: arrayRows,
@@ -3132,7 +3184,7 @@ var SCDataGrid = React21.memo(SCDataGridInitial, (prevProps, nextProps) => {
 
 // src/Components/EmptyState/EmptyState.tsx
 import React26 from "react";
-import { Button as Button10, Stack as Stack9, Typography as Typography12 } from "@mui/material";
+import { Button as Button11, Stack as Stack9, Typography as Typography12 } from "@mui/material";
 
 // src/assets/ImgEmptyState/create.tsx
 import React22 from "react";
@@ -3213,7 +3265,7 @@ var EmptyState = ({
       actions.map((action, index) => {
         var _a, _b, _c, _d;
         return /* @__PURE__ */ React26.createElement(
-          Button10,
+          Button11,
           {
             key: index,
             color: (_a = action.color) != null ? _a : "primary",
@@ -3232,7 +3284,7 @@ var EmptyState = ({
 
 // src/Components/SCDialog.tsx
 import React27, { useEffect as useEffect14, useState as useState14 } from "react";
-import { Button as Button11, Typography as Typography13, Modal as Modal2, Dialog, DialogActions, DialogContent, DialogTitle, IconButton as IconButton10, Tooltip as Tooltip4, Box as Box14, SvgIcon as SvgIcon5 } from "@mui/material";
+import { Button as Button12, Typography as Typography13, Modal as Modal2, Dialog, DialogActions, DialogContent, DialogTitle, IconButton as IconButton10, Tooltip as Tooltip4, Box as Box14, SvgIcon as SvgIcon5 } from "@mui/material";
 import Grid8 from "@mui/material/Grid";
 import ToggleButton from "@mui/material/ToggleButton";
 import ToggleButtonGroup from "@mui/material/ToggleButtonGroup";
@@ -3297,7 +3349,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
   };
   const dialogActions = actions == false ? false : actions != void 0 ? actions : [{ text: "Cerrar", fn: handleClose }];
   content = content != null ? content : { component: /* @__PURE__ */ React27.createElement(Box14, null, " Aqui va el contenido ") };
-  return /* @__PURE__ */ React27.createElement("div", null, buttonDialog ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ React27.createElement(Tooltip4, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React27.createElement(Button11, { size: "small", color: buttonDialog.color != void 0 ? buttonDialog.color : "primary", variant: (buttonDialog == null ? void 0 : buttonDialog.variant) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.variant : "text", startIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "left" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ React27.createElement(IconButton10, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ React27.createElement(SvgIcon5, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ React27.createElement(Modal2, { open: open || false, onClose: handleClose }, /* @__PURE__ */ React27.createElement(
+  return /* @__PURE__ */ React27.createElement("div", null, buttonDialog ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ React27.createElement(Tooltip4, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React27.createElement(Button12, { size: "small", color: buttonDialog.color != void 0 ? buttonDialog.color : "primary", variant: (buttonDialog == null ? void 0 : buttonDialog.variant) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.variant : "text", startIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "left" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ React27.createElement(IconButton10, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ React27.createElement(SvgIcon5, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ React27.createElement(Modal2, { open: open || false, onClose: handleClose }, /* @__PURE__ */ React27.createElement(
     Dialog,
     {
       fullScreen: typeView === "mobile" ? true : false,
@@ -3312,7 +3364,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
         }
       }
     },
-    title && /* @__PURE__ */ React27.createElement(DialogTitle, { sx: { m: 0, padding: "8px 16px 8px 16px" }, "data-testid": "dialog-icon-title" }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 12, sx: { justifyContent: "space-between", flexWrap: "nowrap" } }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 11, sx: { alignItems: "center", flexWrap: "nowrap" } }, iconTitle ? iconTitleValidation == "image" ? /* @__PURE__ */ React27.createElement(Box14, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React27.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React27.createElement(SvgIcon5, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : "", /* @__PURE__ */ React27.createElement(Grid8, { sx: { width: "98%" } }, /* @__PURE__ */ React27.createElement(Typography13, { color: "text.primary", variant: "h6", gutterBottom: true }, title ? title : ""), subtitle ? subtitle : "")), disableClose != true ? /* @__PURE__ */ React27.createElement(IconButton10, { "data-testid": "close-dialog-button", onClick: handleClose, size: "small", color: "default", sx: { height: 22, width: 22 } }, /* @__PURE__ */ React27.createElement(CloseIcon2, { color: "action" })) : "")),
+    title && /* @__PURE__ */ React27.createElement(DialogTitle, { sx: { m: 0, padding: "8px 16px 8px 16px" }, "data-testid": "dialog-icon-title" }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 12, sx: { justifyContent: "space-between", flexWrap: "nowrap" } }, typeView == "web" ? /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 11, sx: { alignItems: "center", flexWrap: "nowrap" } }, iconTitle ? iconTitleValidation == "image" ? /* @__PURE__ */ React27.createElement(Box14, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React27.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React27.createElement(SvgIcon5, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : "", /* @__PURE__ */ React27.createElement(Grid8, { sx: { width: "98%" } }, /* @__PURE__ */ React27.createElement(Typography13, { color: "text.primary", variant: "h6", gutterBottom: true }, title ? title : ""), subtitle ? subtitle : "")) : /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 11, sx: { alignItems: "center", flexWrap: "nowrap" } }), disableClose != true ? /* @__PURE__ */ React27.createElement(IconButton10, { "data-testid": "close-dialog-button", onClick: handleClose, size: "small", color: "default", sx: { height: 22, width: 22 } }, /* @__PURE__ */ React27.createElement(CloseIcon2, { color: "action" })) : ""), typeView == "mobile" ? /* @__PURE__ */ React27.createElement(Grid8, { sx: { display: "flex", flexDirection: "column", padding: "12px 0px 4px 0px" }, gap: 1.5 }, /* @__PURE__ */ React27.createElement(Typography13, { color: "text.primary", variant: "h5" }, title ? title : ""), subtitle ? subtitle : "") : ""),
     /* @__PURE__ */ React27.createElement(
       DialogContent,
       {
@@ -3353,7 +3405,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
       ) : content.component
     ),
     dialogActions != void 0 && dialogActions != false ? Array.isArray(dialogActions) && (dialogActions == null ? void 0 : dialogActions.length) > 0 ? /* @__PURE__ */ React27.createElement(DialogActions, { sx: { zIndex: 1200, gap: 1, m: 0, padding: "12px 16px 12px 16px", justifyContent: dialogActions.length >= 3 ? "space-between" : "flex-end" } }, typeView !== "mobile" ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, dialogActions.length >= 3 ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, /* @__PURE__ */ React27.createElement(
-      Button11,
+      Button12,
       {
         variant: "text",
         color: dialogActions[0].color || "primary",
@@ -3365,7 +3417,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
       dialogActions[0].text
     ), /* @__PURE__ */ React27.createElement(Box14, { sx: { display: "flex", gap: 1 } }, dialogActions.slice(1).map((boton, index) => {
       return /* @__PURE__ */ React27.createElement(
-        Button11,
+        Button12,
         {
           key: index + 1,
           variant: index === dialogActions.length - 2 ? "contained" : "text",
@@ -3379,7 +3431,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
       );
     }))) : dialogActions.map((boton, index) => {
       return /* @__PURE__ */ React27.createElement(
-        Button11,
+        Button12,
         {
           key: index,
           variant: index === dialogActions.length - 1 ? "contained" : "text",
@@ -3425,14 +3477,14 @@ var SCListContent = ({ options, iconLeftType = "Icon", iconRightType = "Icon" })
       }
     }
   });
-  return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(List, { sx: { width: "100%", maxWidth: 360, bgcolor: "background.paper", padding: "0px !important" } }, options.map((option, index) => {
+  return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(List, { sx: { width: "100%", bgcolor: "background.paper", padding: "0px !important" } }, options.map((option, index) => {
     var _a, _b;
     return /* @__PURE__ */ React28.createElement(React28.Fragment, { key: index }, /* @__PURE__ */ React28.createElement(
       ListItemButton,
       {
         disabled: option.disable,
         onClick: option.fn,
-        sx: { gap: 1 }
+        sx: { gap: 1, padding: iconLeftType == "Icon" ? "8px 8px" : "8px 8px 8px 0px" }
       },
       option.iconLeft ? iconLeftType == "Icon" ? /* @__PURE__ */ React28.createElement(ListItemIcon4, { sx: { minWidth: "0px !important" } }, /* @__PURE__ */ React28.createElement(SvgIcon6, { fontSize: "small", sx: { color: option.iconLeftColor || "action" }, component: option.iconLeft })) : /* @__PURE__ */ React28.createElement(Avatar, { sx: { width: 25, height: 25, fontSize: "11px", bgcolor: option.iconLeftColor ? `${option.iconLeftColor}.main` : "default" } }, ((_a = option.iconLeft) == null ? void 0 : _a.type) != void 0 ? /* @__PURE__ */ React28.createElement(SvgIcon6, { fontSize: "small", component: option.iconLeft }) : option.iconLeft) : "",
       /* @__PURE__ */ React28.createElement(
@@ -3532,7 +3584,7 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
 
 // src/Components/Menu/Menu.tsx
 import React30, { useCallback as useCallback4, useState as useState17 } from "react";
-import { Button as Button13, Menu } from "@mui/material";
+import { Button as Button14, Menu } from "@mui/material";
 var BasicMenu = ({
   open,
   onClose,
@@ -3569,7 +3621,7 @@ var BasicMenu = ({
     }
   }, [onClose, setMenuOpen]);
   return /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement(
-    Button13,
+    Button14,
     {
       id: "basic-button",
       "aria-controls": actualOpen ? "basic-menu" : void 0,
@@ -4652,7 +4704,7 @@ var SCTime = ({
 
 // src/Components/SCCard.tsx
 import React41 from "react";
-import { Button as Button15, Box as Box26, SvgIcon as SvgIcon9 } from "@mui/material";
+import { Button as Button16, Box as Box26, SvgIcon as SvgIcon9 } from "@mui/material";
 import IconButton14 from "@mui/material/IconButton";
 import Card from "@mui/material/Card";
 import CardHeader from "@mui/material/CardHeader";
@@ -4687,7 +4739,7 @@ var SCCard = ({ width, title, image, iconTitle, actionsTitle, subtitle, content,
     CardHeader,
     {
       avatar: iconTitle ? iconTitleValidation === "image" ? /* @__PURE__ */ React41.createElement(Box26, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React41.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React41.createElement(SvgIcon9, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : void 0,
-      action: (expand == null ? void 0 : expand.position) == "top" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React41.createElement(Button15, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React41.createElement(IconButton14, { onClick: handleExpandClick, sx: { marginRight: "auto" }, size: "small" }, /* @__PURE__ */ React41.createElement(ExpandMoreIcon, { fontSize: "small" })) : actionsTitle,
+      action: (expand == null ? void 0 : expand.position) == "top" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React41.createElement(Button16, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React41.createElement(IconButton14, { onClick: handleExpandClick, sx: { marginRight: "auto" }, size: "small" }, /* @__PURE__ */ React41.createElement(ExpandMoreIcon, { fontSize: "small" })) : actionsTitle,
       title,
       subheader: subtitle,
       sx: {
@@ -4713,8 +4765,8 @@ var SCCard = ({ width, title, image, iconTitle, actionsTitle, subtitle, content,
       height: "194",
       image
     }
-  ), content && /* @__PURE__ */ React41.createElement(CardContent, { sx: { padding: "8px 16px !important" } }, content), ((expand == null ? void 0 : expand.position) == "bottom" || actions != void 0) && /* @__PURE__ */ React41.createElement(CardActions, { disableSpacing: true, sx: { justifyContent: "flex-end" } }, (expand == null ? void 0 : expand.position) === "bottom" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React41.createElement(Button15, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React41.createElement(IconButton14, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, /* @__PURE__ */ React41.createElement(ExpandMoreIcon, null)) : null, actions && actions.length > 0 ? actions.map((action, index) => /* @__PURE__ */ React41.createElement(
-    Button15,
+  ), content && /* @__PURE__ */ React41.createElement(CardContent, { sx: { padding: "8px 16px !important" } }, content), ((expand == null ? void 0 : expand.position) == "bottom" || actions != void 0) && /* @__PURE__ */ React41.createElement(CardActions, { disableSpacing: true, sx: { justifyContent: "flex-end" } }, (expand == null ? void 0 : expand.position) === "bottom" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React41.createElement(Button16, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React41.createElement(IconButton14, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, /* @__PURE__ */ React41.createElement(ExpandMoreIcon, null)) : null, actions && actions.length > 0 ? actions.map((action, index) => /* @__PURE__ */ React41.createElement(
+    Button16,
     {
       key: index,
       size: "small",
@@ -4729,7 +4781,7 @@ var SCCard = ({ width, title, image, iconTitle, actionsTitle, subtitle, content,
 
 // src/Components/SCActivityCalendar.tsx
 import React42, { useState as useState23 } from "react";
-import { Typography as Typography25, IconButton as IconButton15, Box as Box27, Badge as Badge2 } from "@mui/material";
+import { Typography as Typography25, IconButton as IconButton15, Box as Box27, Badge as Badge2, Menu as Menu3, MenuItem as MenuItem8, ListItemIcon as ListItemIcon6, Popover as Popover7 } from "@mui/material";
 import Grid11 from "@mui/material/Grid";
 import { AdapterDateFns as AdapterDateFns2 } from "@mui/x-date-pickers/AdapterDateFns";
 import { LocalizationProvider as LocalizationProvider4 } from "@mui/x-date-pickers/LocalizationProvider";
@@ -4740,6 +4792,11 @@ import KeyboardDoubleArrowDownIcon2 from "@mui/icons-material/KeyboardDoubleArro
 import KeyboardDoubleArrowUpIcon2 from "@mui/icons-material/KeyboardDoubleArrowUp";
 import ArrowForwardIcon from "@mui/icons-material/ArrowForward";
 import LightModeOutlinedIcon from "@mui/icons-material/LightModeOutlined";
+import FilterListIcon from "@mui/icons-material/FilterList";
+import CalendarMonthOutlinedIcon from "@mui/icons-material/CalendarMonthOutlined";
+import CheckCircleOutlineOutlinedIcon from "@mui/icons-material/CheckCircleOutlineOutlined";
+import EventBusyOutlinedIcon from "@mui/icons-material/EventBusyOutlined";
+import PendingOutlinedIcon from "@mui/icons-material/PendingOutlined";
 var SCActivityCalendar = ({
   //informativas
   //apariencia
@@ -4756,6 +4813,9 @@ var SCActivityCalendar = ({
   const [fechaSeleccionada, setFechaSeleccionada] = useState23();
   const [stateVal, setstateVal] = React42.useState(/* @__PURE__ */ new Date());
   const [openCalendar, setOpenCalendar] = React42.useState(false);
+  const [anchorPopoverFiltro, setAnchorPopoverFiltro] = useState23(null);
+  const [datosEventos, setDatosEventos] = React42.useState(events);
+  const openPopoverFiltro = Boolean(anchorPopoverFiltro);
   const hoy = /* @__PURE__ */ new Date();
   const inicioSemana = startOfWeek2(fecha, { weekStartsOn: 0 });
   const diasSemana = Array.from({ length: 7 }, (_, i) => addDays2(inicioSemana, i));
@@ -4783,7 +4843,23 @@ var SCActivityCalendar = ({
       // 0 = domingo, 1 = lunes
     })
   });
-  return /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(LocalizationProvider4, { dateAdapter: AdapterDateFns2, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ React42.createElement(Box27, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React42.createElement(Box27, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ React42.createElement(Grid11, { container: true, gap: 0.5, sx: { justifyContent: "space-between", padding: "12px 0px", background: "transparent" } }, diasSemana.map((dia) => /* @__PURE__ */ React42.createElement(Grid11, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ React42.createElement(Box27, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React42.createElement(Typography25, { sx: { fontSize: "12px !important", color: "#10184099" } }, format2(dia, "EEEE", { locale: es2 }).charAt(0).toUpperCase())), /* @__PURE__ */ React42.createElement(
+  const handleClickPopoverFiltro = (event2) => {
+    setAnchorPopoverFiltro(event2.currentTarget);
+  };
+  const handleClosePopoverFiltro = () => {
+    setAnchorPopoverFiltro(null);
+  };
+  const filtrarActividad = (event2, filtro) => {
+    if (filtro === "Todo") {
+      setDatosEventos(events);
+    } else {
+      const resultado = events.filter(
+        (item) => item.state === filtro
+      );
+      setDatosEventos(resultado);
+    }
+  };
+  return /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(LocalizationProvider4, { dateAdapter: AdapterDateFns2, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ React42.createElement(Box27, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React42.createElement(Box27, { sx: { width: "100%", padding: "0px", background: "transparent" } }, /* @__PURE__ */ React42.createElement(Grid11, { container: true, gap: 0.5, sx: { justifyContent: "space-between", padding: "12px 16px", background: "transparent" } }, diasSemana.map((dia) => /* @__PURE__ */ React42.createElement(Grid11, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ React42.createElement(Box27, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React42.createElement(Typography25, { sx: { fontSize: "12px !important", color: "#10184099" } }, format2(dia, "EEEE", { locale: es2 }).charAt(0).toUpperCase())), /* @__PURE__ */ React42.createElement(
     Box27,
     {
       onClick: () => setFecha(dia),
@@ -4804,10 +4880,54 @@ var SCActivityCalendar = ({
       openTo: "day",
       value: fecha,
       slotProps: { toolbar: { hidden: true }, actionBar: { actions: [] } },
-      sx: { fontSize: "12px !important", height: "300px !important", background: background ? background : "white", "& .MuiDayCalendar-header": { justifyContent: "space-between" }, "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" }, "& .MuiPickersCalendarHeader-root": { paddingLeft: "0px", paddingRight: "0px", color: "#10184099" }, "& .MuiPickersDay-root": { fontSize: "12px !important" }, "& .MuiDayCalendar-weekDayLabel": { fontSize: "12px !important" } },
+      sx: {
+        "& .MuiDateCalendar-root": {
+          width: "97.5%",
+          maxWidth: "unset",
+          margin: 0,
+          padding: "0px 16px"
+        },
+        fontSize: "12px !important",
+        height: "260px !important",
+        background: background ? background : "white",
+        "& .MuiDayCalendar-header": { justifyContent: "space-between" },
+        "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" },
+        "& .MuiPickersCalendarHeader-root": { paddingLeft: "0px", paddingRight: "0px", color: "#10184099" },
+        "& .MuiPickersDay-root": { fontSize: "12px !important" },
+        "& .MuiDayCalendar-weekDayLabel": { fontSize: "12px !important" }
+      },
       onChange: (newValue) => setFecha(newValue)
     }
-  ), /* @__PURE__ */ React42.createElement(Grid11, { container: true, justifyContent: "center" }, /* @__PURE__ */ React42.createElement(IconButton15, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React42.createElement(KeyboardDoubleArrowUpIcon2, { color: "action" }))))), /* @__PURE__ */ React42.createElement(Box27, { sx: { boxSizing: "border-box", padding: "0px 16px", width: "100%", height: openCalendar ? "calc(91% - 300px)" : "calc(91% - 100px)", background: "white", display: "flex", flexDirection: "column", overflowY: "auto", gap: "8px", scrollSnapType: "x mandatory", paddingBottom: "10px" } }, diasSemana.map((day, dayIndex) => /* @__PURE__ */ React42.createElement(
+  ), /* @__PURE__ */ React42.createElement(Grid11, { container: true, justifyContent: "center" }, /* @__PURE__ */ React42.createElement(IconButton15, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React42.createElement(KeyboardDoubleArrowUpIcon2, { color: "action" }))))), /* @__PURE__ */ React42.createElement(IconButton15, { onClick: handleClickPopoverFiltro, sx: { position: "fixed", right: "calc(100% - 96%)", top: openCalendar == false ? "197px" : "357px" } }, /* @__PURE__ */ React42.createElement(FilterListIcon, { color: "action" })), /* @__PURE__ */ React42.createElement(
+    Popover7,
+    {
+      open: openPopoverFiltro,
+      anchorEl: anchorPopoverFiltro,
+      onClose: handleClosePopoverFiltro,
+      anchorOrigin: {
+        vertical: "bottom",
+        horizontal: "right"
+      }
+    },
+    /* @__PURE__ */ React42.createElement(
+      Menu3,
+      {
+        id: "basic-menu",
+        anchorEl: anchorPopoverFiltro,
+        open: openPopoverFiltro,
+        onClose: handleClosePopoverFiltro,
+        slotProps: {
+          list: {
+            "aria-labelledby": "basic-button"
+          }
+        }
+      },
+      /* @__PURE__ */ React42.createElement(MenuItem8, { onClick: (event2) => filtrarActividad(event2, "Todo") }, /* @__PURE__ */ React42.createElement(ListItemIcon6, null, /* @__PURE__ */ React42.createElement(CalendarMonthOutlinedIcon, { fontSize: "small" })), /* @__PURE__ */ React42.createElement(Typography25, { variant: "inherit" }, "Ver todo")),
+      /* @__PURE__ */ React42.createElement(MenuItem8, { onClick: (event2) => filtrarActividad(event2, "Finalizada") }, /* @__PURE__ */ React42.createElement(ListItemIcon6, null, /* @__PURE__ */ React42.createElement(CheckCircleOutlineOutlinedIcon, { fontSize: "small" })), /* @__PURE__ */ React42.createElement(Typography25, { variant: "inherit" }, "Ver finalizadas")),
+      /* @__PURE__ */ React42.createElement(MenuItem8, { onClick: (event2) => filtrarActividad(event2, "Aplazada") }, /* @__PURE__ */ React42.createElement(ListItemIcon6, null, /* @__PURE__ */ React42.createElement(EventBusyOutlinedIcon, { fontSize: "small" })), /* @__PURE__ */ React42.createElement(Typography25, { variant: "inherit" }, "Ver aplazadas")),
+      /* @__PURE__ */ React42.createElement(MenuItem8, { onClick: (event2) => filtrarActividad(event2, "En progreso") }, /* @__PURE__ */ React42.createElement(ListItemIcon6, null, /* @__PURE__ */ React42.createElement(PendingOutlinedIcon, { fontSize: "small" })), /* @__PURE__ */ React42.createElement(Typography25, { variant: "inherit" }, "Ver en progreso"))
+    )
+  ), /* @__PURE__ */ React42.createElement(Box27, { sx: { boxSizing: "border-box", padding: "0px 16px", width: "100%", height: openCalendar ? "calc(91% - 260px)" : "calc(91% - 100px)", background: "white", display: "flex", flexDirection: "column", overflowY: "auto", gap: "8px", scrollSnapType: "x mandatory", paddingBottom: "10px" } }, diasSemana.map((day, dayIndex) => /* @__PURE__ */ React42.createElement(
     Box27,
     {
       key: dayIndex
@@ -4824,7 +4944,7 @@ var SCActivityCalendar = ({
       flexDirection: "column"
     } }, (() => {
       const esDomingo = day.getDay() === 0;
-      const eventosDelDia = events.filter(
+      const eventosDelDia = datosEventos.filter(
         (event2) => new Date(event2.date).toDateString() === day.toDateString()
       );
       if (eventosDelDia.length > 0) {
@@ -4866,7 +4986,7 @@ import Webcam from "react-webcam";
 
 // src/Components/Adjuntar/mobile/components/button.tsx
 import React43, { useMemo as useMemo5 } from "react";
-import { Button as Button17 } from "@mui/material";
+import { Button as Button18 } from "@mui/material";
 
 // src/Components/Adjuntar/mobile/components/Utils.tsx
 import * as MuiIcons4 from "@mui/icons-material";
@@ -4897,7 +5017,7 @@ var AttachmentButton = ({ buttonAttachment, open, setOpen }) => {
   );
   if (!buttonAttachment) return null;
   return /* @__PURE__ */ React43.createElement(React43.Fragment, null, buttonAttachment && /* @__PURE__ */ React43.createElement(
-    Button17,
+    Button18,
     {
       "data-testid": "test-buttonModal",
       color: (_a = buttonAttachment == null ? void 0 : buttonAttachment.color) != null ? _a : "primary",
@@ -4918,15 +5038,19 @@ import { Box as Box28 } from "@mui/system";
 import { CloseOutlined, DeleteOutline as DeleteOutline2, FolderOpenOutlined, PhotoCameraOutlined, UploadFileOutlined as UploadFileOutlined2 } from "@mui/icons-material";
 import PhotoCameraIcon from "@mui/icons-material/PhotoCamera";
 import CancelOutlinedIcon from "@mui/icons-material/CancelOutlined";
+import ImageOutlinedIcon from "@mui/icons-material/ImageOutlined";
+import FileDownloadOutlinedIcon from "@mui/icons-material/FileDownloadOutlined";
 var AttachmentMobile = ({
   buttonAttachment,
   maxSize = 400,
   fileAccepted = "",
   initialFiles,
   deleteAction,
-  children,
+  downloadAction,
   onChange,
-  sx
+  children,
+  sx,
+  view = "button"
 }) => {
   const webcamRef = useRef8(null);
   const [abrirCamara, setAbrirCamara] = useState24(false);
@@ -5083,7 +5207,7 @@ var AttachmentMobile = ({
     }
   });
   const AttachtmentActions = [
-    { icon: /* @__PURE__ */ React44.createElement(FolderOpenOutlined, { type: "file", color: "primary" }), color: "primary", label: "Galer\xEDa", onClick: () => {
+    { icon: /* @__PURE__ */ React44.createElement(ImageOutlinedIcon, { type: "file", color: "primary" }), color: "primary", label: "Galer\xEDa", onClick: () => {
       var _a;
       return (_a = inputRef.current) == null ? void 0 : _a.click();
     } },
@@ -5098,24 +5222,32 @@ var AttachmentMobile = ({
       setFiles(initialFiles);
     }
   }, []);
-  return /* @__PURE__ */ React44.createElement(Box28, { display: "flex", flexDirection: "column", gap: 1 }, /* @__PURE__ */ React44.createElement(Box28, { display: "flex", width: "100%", justifyContent: "space-between", alignItems: "center", sx }, children, /* @__PURE__ */ React44.createElement(
+  return /* @__PURE__ */ React44.createElement(Box28, { display: "flex", flexDirection: "column", gap: 1 }, view == "button" ? /* @__PURE__ */ React44.createElement(Box28, { display: "flex", width: "100%", justifyContent: "space-between", alignItems: "center", sx }, children, /* @__PURE__ */ React44.createElement(
     AttachmentButton,
     {
       buttonAttachment,
       open,
       setOpen
     }
-  )), /* @__PURE__ */ React44.createElement(CssBaseline, null), /* @__PURE__ */ React44.createElement(
+  )) : "", /* @__PURE__ */ React44.createElement(CssBaseline, null), /* @__PURE__ */ React44.createElement(
     SwipeableDrawer2,
     {
+      slotProps: {
+        backdrop: {
+          sx: { backgroundColor: "#00000038" }
+        }
+      },
       ModalProps: {
         sx: {
           zIndex: 1400,
           "& .MuiPaper-root": {
             borderRadius: "16px 16px 0 0"
           }
-        }
+        },
+        BackdropProps: { timeout: 400 }
       },
+      transitionDuration: { enter: 500, exit: 400 },
+      hysteresis: 0.2,
       anchor: "bottom",
       swipeAreaWidth: 56,
       open,
@@ -5123,7 +5255,7 @@ var AttachmentMobile = ({
       onOpen: toggleAttachment(true)
     },
     toast && /* @__PURE__ */ React44.createElement(SCToastNotification, __spreadValues({}, toast)),
-    /* @__PURE__ */ React44.createElement(Box28, { display: "flex", flexDirection: "column", alignItems: "center", p: 2, gap: 2 }, /* @__PURE__ */ React44.createElement(Box28, { display: "flex", width: "100%", justifyContent: "space-between", alignItems: "center", gap: 1, p: 1 }, /* @__PURE__ */ React44.createElement(Typography26, { variant: "h6", color: "text.primary" }, "Agregar adjuntos"), /* @__PURE__ */ React44.createElement(IconButton16, { size: "medium", onClick: toggleAttachment(false) }, /* @__PURE__ */ React44.createElement(CloseOutlined, { color: "action" }))), /* @__PURE__ */ React44.createElement(
+    /* @__PURE__ */ React44.createElement(Box28, { display: "flex", flexDirection: "column", alignItems: "center", p: 2, gap: 2 }, /* @__PURE__ */ React44.createElement(Box28, { display: "flex", width: "100%", justifyContent: "space-between", alignItems: "center", gap: 1, p: 1 }, /* @__PURE__ */ React44.createElement(Typography26, { variant: "h6", color: "text.primary" }, "Agrega adjuntos"), /* @__PURE__ */ React44.createElement(IconButton16, { size: "medium", onClick: toggleAttachment(false) }, /* @__PURE__ */ React44.createElement(CloseOutlined, { color: "action" }))), /* @__PURE__ */ React44.createElement(
       "input",
       {
         type: "file",
@@ -5132,22 +5264,21 @@ var AttachmentMobile = ({
         ref: inputRef,
         onChange: handleUpload
       }
-    ), /* @__PURE__ */ React44.createElement(Box28, { display: "flex", justifyContent: "space-around", alignItems: "center", width: "100%", gap: 2 }, AttachtmentActions.map((option, index) => /* @__PURE__ */ React44.createElement(
+    ), /* @__PURE__ */ React44.createElement(Box28, { display: "flex", justifyContent: "space-around", alignItems: "center", width: "100%", gap: 2, sx: { padding: "0px 0px 52px 0px !important" } }, AttachtmentActions.map((option, index) => /* @__PURE__ */ React44.createElement(
       Box28,
       {
         display: "flex",
         flexDirection: "column",
         alignItems: "center",
-        width: 100,
+        width: "100%",
         height: 80,
         borderRadius: 1,
-        bgcolor: "grey.100",
+        bgcolor: "grey.50",
         border: "1px solid",
-        borderColor: "grey.50",
-        boxShadow: 1,
+        borderColor: "grey.100",
         justifyContent: "center",
         p: 1,
-        gap: 1,
+        gap: 0.5,
         onClick: option.onClick,
         sx: {
           cursor: "pointer"
@@ -5163,7 +5294,7 @@ var AttachmentMobile = ({
         },
         option.icon
       ),
-      /* @__PURE__ */ React44.createElement(Typography26, { variant: "body2", color: "text.primary" }, option.label)
+      /* @__PURE__ */ React44.createElement(Typography26, { variant: "body2", color: "text.secondary" }, option.label)
     ))))
   ), abrirCamara && /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement(CancelOutlinedIcon, { onClick: closeCam, sx: { borderRadius: "50px", height: "35px", width: "35px", zIndex: 1700, background: "white", position: "absolute", left: `calc(100% - 50px)`, bottom: `calc(100% - 50px)` } }), /* @__PURE__ */ React44.createElement(Stack14, { className: "camras" }, /* @__PURE__ */ React44.createElement(
     Webcam,
@@ -5263,7 +5394,17 @@ var AttachmentMobile = ({
         },
         file.uploadError && file.size / (1024 * 1024) > maxSize ? "Archivo super\xF3 el l\xEDmite \u2022 Carga fallida" : file.uploadError ? "Archivo duplicado o inv\xE1lido \u2022 Carga fallida" : `${(file.size / (1024 * 1024)).toFixed(2)}MB \u2022 ${file.type}`
       ))),
-      /* @__PURE__ */ React44.createElement(Tooltip8, { title: "Eliminar" }, /* @__PURE__ */ React44.createElement(
+      view == "file" ? /* @__PURE__ */ React44.createElement(Tooltip8, { title: "Descargar" }, /* @__PURE__ */ React44.createElement(
+        IconButton16,
+        {
+          size: "small",
+          onClick: () => downloadAction == null ? void 0 : downloadAction(file),
+          disabled: file.uploadError,
+          "aria-label": `Descargar ${file.name}`
+        },
+        /* @__PURE__ */ React44.createElement(FileDownloadOutlinedIcon, { fontSize: "small", color: "action" })
+      )) : "",
+      view == "button" ? /* @__PURE__ */ React44.createElement(Tooltip8, { title: "Eliminar" }, /* @__PURE__ */ React44.createElement(
         IconButton16,
         {
           size: "small",
@@ -5271,7 +5412,7 @@ var AttachmentMobile = ({
           "aria-label": `Eliminar ${file.name}`
         },
         /* @__PURE__ */ React44.createElement(DeleteOutline2, { fontSize: "small", color: "action" })
-      ))
+      )) : ""
     ))
   ));
 };
@@ -5320,7 +5461,7 @@ var SCSnackBar = ({
 
 // src/Components/SCAppBar.tsx
 import React46, { useState as useState26, useEffect as useEffect22 } from "react";
-import { Menu as Menu3, Box as Box29, Typography as Typography27, MenuItem as MenuItem8, IconButton as IconButton17, Badge as Badge3 } from "@mui/material";
+import { Menu as Menu4, Box as Box29, Typography as Typography27, MenuItem as MenuItem9, IconButton as IconButton17, Badge as Badge3 } from "@mui/material";
 import Grid12 from "@mui/material/Grid";
 import "dayjs/locale/es";
 import MenuIcon from "@mui/icons-material/Menu";
@@ -5376,7 +5517,7 @@ var SCAppBar = ({
       color: isOnline ? "success" : "error"
     }
   ), /* @__PURE__ */ React46.createElement(Typography27, { variant: "caption", color: "text.secondary" }, isOnline ? "Online" : "Offline")), visibleMenu && /* @__PURE__ */ React46.createElement(React46.Fragment, null, /* @__PURE__ */ React46.createElement(IconButton17, { size: "medium", onClick: handleMenuClick }, /* @__PURE__ */ React46.createElement(MenuIcon, { color: "action" })), /* @__PURE__ */ React46.createElement(
-    Menu3,
+    Menu4,
     {
       anchorEl,
       open: openMenu,
@@ -5391,15 +5532,81 @@ var SCAppBar = ({
       },
       sx: { zIndex: "2000" }
     },
-    options.map((option, index) => /* @__PURE__ */ React46.createElement(MenuItem8, { onClick: option.fn, disabled: option.disabled, key: index }, /* @__PURE__ */ React46.createElement(Typography27, { variant: "body2" }, option.name)))
+    options.map((option, index) => /* @__PURE__ */ React46.createElement(MenuItem9, { onClick: option.fn, disabled: option.disabled, key: index }, /* @__PURE__ */ React46.createElement(Typography27, { variant: "body2" }, option.name)))
   )))), /* @__PURE__ */ React46.createElement(Box29, { sx: { padding: "8px 16px 0px 16px" } }, contenidoExtra)));
 };
 
+// src/Components/SCDatePicker.tsx
+import React47 from "react";
+import { DatePicker } from "@mui/x-date-pickers/DatePicker";
+import "dayjs/locale/es";
+import dayjs11 from "dayjs";
+import "dayjs/locale/es";
+import { LocalizationProvider as LocalizationProvider5 } from "@mui/x-date-pickers/LocalizationProvider";
+import { AdapterDayjs as AdapterDayjs3 } from "@mui/x-date-pickers/AdapterDayjs";
+import InsertInvitationOutlinedIcon from "@mui/icons-material/InsertInvitationOutlined";
+var SCDatePicker = ({ label, required, disabled, background, state, setState, width }) => {
+  return /* @__PURE__ */ React47.createElement(LocalizationProvider5, { dateAdapter: AdapterDayjs3, adapterLocale: "es" }, /* @__PURE__ */ React47.createElement(
+    DatePicker,
+    {
+      disabled,
+      label: label || "Fecha",
+      value: state,
+      onChange: (value) => {
+        if (value && dayjs11.isDayjs(value) && value.isValid()) {
+          const minDate = dayjs11("2015-01-01");
+          const maxDate = dayjs11().add(3, "month");
+          if (value.isBefore(minDate, "day")) {
+            alert("La fecha no puede ser anterior al 01/01/2015");
+            return;
+          }
+          if (value.isAfter(maxDate, "day")) {
+            alert("La fecha no puede ser posterior a 3 meses desde hoy");
+            return;
+          }
+          setState(value);
+        }
+      },
+      minDate: dayjs11("2015-01-01"),
+      maxDate: dayjs11().add(3, "month"),
+      sx: {
+        minWidth: 140,
+        padding: "13px 0px",
+        width: width || "100%",
+        "& .MuiPickersInputBase-sectionsContainer": {
+          padding: "8px 0px"
+        },
+        background: background || "transparent"
+      },
+      slotProps: {
+        popper: {
+          sx: {
+            zIndex: 2e3
+          }
+        },
+        textField: {
+          required: required || false,
+          InputLabelProps: {
+            sx: {
+              "&.MuiInputLabel-shrink": {
+                transform: "translate(10px, 5px) scale(0.9) !important"
+              }
+            }
+          }
+        }
+      },
+      slots: {
+        openPickerIcon: InsertInvitationOutlinedIcon
+      }
+    }
+  ));
+};
+
 // src/Theme/index.ts
 import { createTheme } from "@mui/material/styles";
 
 // src/Theme/components.ts
-import React47 from "react";
+import React48 from "react";
 import {
   InfoRounded as InfoRounded2,
   CheckCircleRounded as CheckCircleRounded2,
@@ -5761,6 +5968,7 @@ var components = {
       })
     }
   },
+  //este hace claro el fondo
   MuiBackdrop: {
     styleOverrides: {
       root: {
@@ -6102,10 +6310,10 @@ var components = {
   MuiAlert: {
     defaultProps: {
       iconMapping: {
-        success: React47.createElement(CheckCircleRounded2),
-        error: React47.createElement(ErrorRounded2),
-        warning: React47.createElement(WarningRounded2),
-        info: React47.createElement(InfoRounded2)
+        success: React48.createElement(CheckCircleRounded2),
+        error: React48.createElement(ErrorRounded2),
+        warning: React48.createElement(WarningRounded2),
+        info: React48.createElement(InfoRounded2)
       }
     },
     variants: [
@@ -7163,6 +7371,7 @@ export {
   SCCard,
   SCDataGrid,
   SCDataGridInitial,
+  SCDatePicker,
   SCDateRange,
   SCDialog,
   SCDrawer,