componentes-sinco 1.1.16 → 1.1.18

package/dist/index.d.cts

@@ -138,7 +138,7 @@ declare const ToastProgress: (timeProgress: number) => {
     progressToast: number;
 };
 
-declare function SCDrawer<T>({ title, arrayElements, actions, buttonDrawer, colorTitle, anchor, width, open, setOpen, chipFilters, heightDrawer, filterSideCard, ref, }: DrawerProps<T>): React__default.JSX.Element;
+declare function SCDrawer<T>({ title, arrayElements, actions, buttonDrawer, colorTitle, anchor, width, open, setOpen, chipFilters, heightDrawer, filterSideCard, }: DrawerProps<T>): React__default.JSX.Element;
 
 interface FooterActionsProperties {
     label?: React.ReactNode;

package/dist/index.d.ts

@@ -138,7 +138,7 @@ declare const ToastProgress: (timeProgress: number) => {
     progressToast: number;
 };
 
-declare function SCDrawer<T>({ title, arrayElements, actions, buttonDrawer, colorTitle, anchor, width, open, setOpen, chipFilters, heightDrawer, filterSideCard, ref, }: DrawerProps<T>): React__default.JSX.Element;
+declare function SCDrawer<T>({ title, arrayElements, actions, buttonDrawer, colorTitle, anchor, width, open, setOpen, chipFilters, heightDrawer, filterSideCard, }: DrawerProps<T>): React__default.JSX.Element;
 
 interface FooterActionsProperties {
     label?: React.ReactNode;

package/dist/index.js

@@ -2308,8 +2308,7 @@ function SCDrawer({
   setOpen,
   chipFilters,
   heightDrawer = 456,
-  filterSideCard,
-  ref
+  filterSideCard
 }) {
   const drawerBleeding = heightDrawer;
   const { drawerOpen, handleDrawerClose, toggleDrawer } = useDrawerState({ open, setOpen });
@@ -2336,7 +2335,6 @@ function SCDrawer({
       );
     }
   };
-  const containerRef = React16.useRef(null);
   const handleCleanFilters = () => {
     cleanAllFilters(arrayElements, setTextFilters);
   };
@@ -2383,14 +2381,18 @@ function SCDrawer({
       anchor: anchor != null ? anchor : "left",
       sx: {
         "& .MuiDrawer-paper": {
-          width: width != null ? width : "450px",
+          width: filterSideCard ? "100%" : width != null ? width : "450px",
           boxSizing: "border-box",
-          borderRadius: anchor !== "right" ? "0px 4px 4px 0px" : "4px 0px 0px 4px"
+          borderRadius: anchor !== "right" ? "0px 4px 4px 0px" : "4px 0px 0px 4px",
+          boxShadow: filterSideCard ? "none !important" : "0px 8px 10px -5px rgba(24, 39, 75, 0.2), 0px 16px 24px 2px rgba(24, 39, 75, 0.14), 0px 6px 30px 5px rgba(24, 39, 75, 0.12)"
+        },
+        "&.MuiDrawer-root": {
+          boxShadow: filterSideCard ? "none !important" : "0px 3px 1px -2px rgba(24, 39, 75, 0.20),0px 2px 2px 0px rgba(24, 39, 75, 0.14),0px 1px 5px 0px rgba(24, 39, 75, 0.12)"
         }
       },
       ModalProps: {
-        container: ref == null ? void 0 : ref.current,
         keepMounted: true,
+        disablePortal: filterSideCard ? true : false,
         slotProps: {
           root: {
             style: {
@@ -2402,14 +2404,10 @@ function SCDrawer({
       hideBackdrop: true,
       PaperProps: {
         sx: {
-          // El Drawer (Paper) se posiciona relativo al contenedor
           position: "absolute !important",
           height: "100%",
-          // para que ocupe toda la altura del contenedor
           width: 300,
-          // ajusta el ancho como quieras
           right: 0
-          // si usas 'top/bottom/left' cámbialos según tu anchor
         }
       }
     },
@@ -3002,8 +3000,8 @@ function SCDataGridInitial({ data, columns, getRowId, groupColumns, rowsTable, r
   let validationTreeData = groupColumns ? true : false;
   let validationCheckboxSelection = checkboxSelection || false;
   let styleDensity = density || "compact";
-  let styleTopContainerHeight = styleDensity === "compact" ? "26px" : styleDensity === "standard" ? "38px" : styleDensity === "comfortable" ? "60px" : "27px";
-  let styleRowHeight = density == "compact" ? 32 : density == "standard" ? 28 : density == "comfortable" ? 36 : 32;
+  let styleTopContainerHeight = styleDensity === "compact" ? "26px" : styleDensity === "standard" ? "32px" : styleDensity === "comfortable" ? "40px" : "26px";
+  let styleRowHeight = density == "compact" ? 32 : density == "standard" ? 28 : density == "comfortable" ? 31 : 32;
   let rows = rowsTable ? rowsTable : validationTreeData != false ? parseInt(data.length.toString()) : data.length < 10 ? parseInt(data.length.toString()) : 10;
   let validationGroupingColDef = groupingColDefs || {};
   const [groupDataLenght, setGroupDataLengh] = useState13(0);
@@ -3147,8 +3145,8 @@ function SCDataGridInitial({ data, columns, getRowId, groupColumns, rowsTable, r
         noRowsLabel: "No hay filas",
         columnMenuLabel: "Men\xFA de columna",
         footerTotalRows: "Filas Totales:",
-        footerRowSelected: (count) => `${count.toLocaleString()} fila(s) seleccionada(s)`,
-        // Ejemplo de traducción dinámica
+        footerRowSelected: () => "",
+        // Ejemplo de traducción dinámica para que diga cuantas filas selecciono count => `${count.toLocaleString()} fila(s) seleccionada(s)`
         MuiTablePagination: {
           labelRowsPerPage: "Filas por p\xE1gina:",
           labelDisplayedRows: ({ from, to, count }) => `${from}\u2013${to} de ${count !== -1 ? count : `m\xE1s de ${to}`}`
@@ -3186,7 +3184,7 @@ function SCDataGridInitial({ data, columns, getRowId, groupColumns, rowsTable, r
           "maxHeight": "0px !important"
         },
         "& .MuiDataGrid-cell": {
-          padding: "0 !important",
+          //padding: '0 !important', //padding de cada celda
           background: "white"
         },
         // Fila seleccionada (cuando selectionModel selecciona filas)
@@ -5622,8 +5620,7 @@ var SCDatePicker = ({ label, required, disabled, background, state, setState, wi
         width: width || "100%",
         background: background || "transparent",
         "& .MuiPickersInputBase-sectionsContainer": {
-          padding: "8px 0px",
-          height: "32px"
+          padding: "6px 0px"
         }
       },
       slotProps: {
@@ -5761,25 +5758,25 @@ var components = {
           {
             props: { density: "compact" },
             style: {
-              "--height": "24px",
-              minHeight: "24px !important",
-              maxHeight: "24px !important"
+              "--height": "26px",
+              minHeight: "26px !important",
+              maxHeight: "26px !important"
             }
           },
           {
             props: { density: "standard" },
             style: {
-              "--height": "36px",
-              minHeight: "36px !important",
-              maxHeight: "36px !important"
+              "--height": "32px",
+              minHeight: "32px !important",
+              maxHeight: "32px !important"
             }
           },
           {
             props: { density: "comfortable" },
             style: {
-              "--height": "52px",
-              minHeight: "52px !important",
-              maxHeight: "52px !important"
+              "--height": "40px",
+              minHeight: "40px !important",
+              maxHeight: "40px !important"
             }
           }
         ]
@@ -5789,25 +5786,25 @@ var components = {
           {
             props: { density: "compact" },
             style: {
-              "--height": "24px",
-              minHeight: "24px !important",
-              maxHeight: "24px !important"
+              "--height": "26px",
+              minHeight: "26px !important",
+              maxHeight: "26px !important"
             }
           },
           {
             props: { density: "standard" },
             style: {
-              "--height": "36px",
-              minHeight: "36px !important",
-              maxHeight: "36px !important"
+              "--height": "32px",
+              minHeight: "32px !important",
+              maxHeight: "32px !important"
             }
           },
           {
             props: { density: "comfortable" },
             style: {
-              "--height": "52px",
-              minHeight: "52px !important",
-              maxHeight: "52px !important"
+              "--height": "40px",
+              minHeight: "40px !important",
+              maxHeight: "40px !important"
             }
           }
         ]
@@ -5820,25 +5817,25 @@ var components = {
           {
             props: { density: "compact" },
             style: {
-              "--height": "24px",
-              minHeight: "24px !important",
-              maxHeight: "24px !important"
+              "--height": "26px",
+              minHeight: "26px !important",
+              maxHeight: "26px !important"
             }
           },
           {
             props: { density: "standard" },
             style: {
-              "--height": "36px",
-              minHeight: "36px !important",
-              maxHeight: "36px !important"
+              "--height": "32px",
+              minHeight: "32px !important",
+              maxHeight: "32px !important"
             }
           },
           {
             props: { density: "comfortable" },
             style: {
-              "--height": "52px",
-              minHeight: "52px !important",
-              maxHeight: "52px !important"
+              "--height": "40px",
+              minHeight: "40px !important",
+              maxHeight: "40px !important"
             }
           }
         ]
@@ -5871,9 +5868,9 @@ var components = {
           {
             props: { density: "comfortable" },
             style: {
-              "--height": "48px",
-              minHeight: "48px !important",
-              maxHeight: "48px !important"
+              "--height": "40px",
+              minHeight: "40px !important",
+              maxHeight: "40px !important"
             }
           }
         ]
@@ -5906,9 +5903,9 @@ var components = {
           {
             props: { density: "comfortable" },
             style: {
-              "--height": "48px",
-              minHeight: "48px !important",
-              maxHeight: "48px !important"
+              "--height": "40px",
+              minHeight: "40px !important",
+              maxHeight: "40px !important"
             }
           }
         ],