componentes-sinco 1.0.34-rc.0 → 1.0.35

package/dist/index.cjs

@@ -2064,7 +2064,6 @@ var SCDateRange = ({
   const isStartEmpty = required && !state[0];
   const isEndEmpty = required && !state[1];
   const hasError = isStartEmpty || isEndEmpty;
-  const minDate = new Date(2013, 0, 1);
   const [notification, setNotification] = import_react16.default.useState(false);
   const handleDateChange = (newValue) => {
     const minDateDayjs = (0, import_dayjs.default)("2013-01-01");
@@ -2084,7 +2083,30 @@ var SCDateRange = ({
         return;
       }
     }
-    setState(convertedValue);
+    const startDateChanged = convertedValue[0] && state[0] && !convertedValue[0].isSame(state[0], "day");
+    const hasEndDate = convertedValue[1] !== null;
+    if (startDateChanged && convertedValue[0]) {
+      if (!hasEndDate || hasEndDate && convertedValue[0].isAfter(convertedValue[1])) {
+        const correctedValue = [
+          convertedValue[0],
+          convertedValue[0]
+          // Establecer fecha final igual a la inicial
+        ];
+        setState(correctedValue);
+        return;
+      }
+    }
+    const isInvalidRange = convertedValue[0] && convertedValue[1] && convertedValue[0].isAfter(convertedValue[1]);
+    if (isInvalidRange) {
+      const correctedValue = [
+        convertedValue[0],
+        convertedValue[0]
+        // Establecer fecha final igual a la inicial
+      ];
+      setState(correctedValue);
+    } else {
+      setState(convertedValue);
+    }
   };
   return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_LocalizationProvider.LocalizationProvider, { dateAdapter: import_AdapterDayjs.AdapterDayjs, adapterLocale: "es" }, /* @__PURE__ */ import_react16.default.createElement(import_material10.Box, { sx: { width: "100%" } }, /* @__PURE__ */ import_react16.default.createElement(
     import_DateRangePicker.DateRangePicker,
@@ -2096,44 +2118,38 @@ var SCDateRange = ({
         field: import_MultiInputDateRangeField.MultiInputDateRangeField
       },
       slotProps: {
-        field: {
-          slotProps: {
-            textField: ({ position }) => ({
-              label: position === "start" ? labelDateInitial : labelDateFinal,
-              size: "small",
-              variant: "outlined",
-              required,
-              error: position === "start" ? isStartEmpty : isEndEmpty,
-              InputProps: {
-                endAdornment: /* @__PURE__ */ import_react16.default.createElement(import_material10.InputAdornment, { position: "end" }, /* @__PURE__ */ import_react16.default.createElement(
-                  import_Event.default,
-                  {
-                    color: hasError ? "error" : "action",
-                    fontSize: "small"
-                  }
-                ))
+        textField: ({ position }) => {
+          const isStart = position === "start";
+          return {
+            label: isStart ? labelDateInitial : labelDateFinal,
+            size: "small",
+            variant: "outlined",
+            required,
+            error: isStart ? isStartEmpty : isEndEmpty,
+            InputProps: {
+              endAdornment: /* @__PURE__ */ import_react16.default.createElement(import_material10.InputAdornment, { position: "end" }, /* @__PURE__ */ import_react16.default.createElement(
+                import_Event.default,
+                {
+                  color: hasError ? "error" : "action",
+                  fontSize: "small"
+                }
+              ))
+            },
+            sx: {
+              flex: 1,
+              "& .MuiOutlinedInput-root": {
+                backgroundColor: background === "transparent" ? "transparent" : background
               },
-              sx: {
-                mr: position === "start" ? 1 : 0,
-                "& .MuiOutlinedInput-root": {
-                  backgroundColor: background === "transparent" ? "transparent" : background
-                },
-                "& .MuiInputLabel-asterisk": {
-                  color: "error.main"
-                },
-                background: background != null ? background : "transparent"
-              }
-            })
-          }
+              "& .MuiInputLabel-asterisk": {
+                color: "error.main"
+              },
+              background: background != null ? background : "transparent"
+            }
+          };
         }
-      },
-      sx: {
-        display: "flex",
-        gap: 1,
-        width: "100%"
       }
     }
-  ))), notification && /* @__PURE__ */ import_react16.default.createElement(SCToastNotification, { title: "El Formato de la fecha no es v\xE1lido", type: "error" }));
+  ))));
 };
 
 // src/Components/Drawer/components/DrawerContent.tsx
@@ -2342,6 +2358,7 @@ function SCDrawer({
   setOpen,
   chipFilters
 }) {
+  const drawerBleeding = 56;
   const { drawerOpen, handleDrawerClose, toggleDrawer } = useDrawerState({ open, setOpen });
   const { toast, setToastWithDelay } = useToast();
   const {
@@ -2404,12 +2421,12 @@ function SCDrawer({
         onToggle: toggleDrawer(true)
       }
     )
-  ), /* @__PURE__ */ import_react20.default.createElement(
+  ), anchor != "bottom" ? /* @__PURE__ */ import_react20.default.createElement(
     import_material14.Drawer,
     {
       open: drawerOpen,
       onClose: toggleDrawer(false),
-      anchor,
+      anchor: anchor != null ? anchor : "left",
       sx: {
         "& .MuiDrawer-paper": {
           width: width != null ? width : "450px",
@@ -2426,6 +2443,45 @@ function SCDrawer({
         onClose: handleDrawerClose
       }
     ), /* @__PURE__ */ import_react20.default.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ import_react20.default.createElement(DrawerActions, { actions: drawerActions, anchor }))
+  ) : /* @__PURE__ */ import_react20.default.createElement(
+    import_material14.SwipeableDrawer,
+    {
+      open: drawerOpen,
+      onClose: toggleDrawer(false),
+      onOpen: toggleDrawer(true),
+      anchor: "bottom",
+      swipeAreaWidth: drawerBleeding,
+      sx: {
+        "& .MuiDrawer-paper": {
+          width: "auto",
+          height: `calc(50% - ${drawerBleeding}px)`,
+          boxSizing: "border-box",
+          borderRadius: "4px 4px 0px 0px"
+        }
+      }
+    },
+    /* @__PURE__ */ import_react20.default.createElement(
+      import_material14.Box,
+      {
+        sx: {
+          width: 30,
+          height: 6,
+          backgroundColor: "#ccc",
+          borderRadius: 3,
+          position: "absolute",
+          top: 8,
+          left: "calc(50% - 15px)"
+        }
+      }
+    ),
+    /* @__PURE__ */ import_react20.default.createElement(import_material14.Stack, { flexDirection: "column", height: "100%" }, /* @__PURE__ */ import_react20.default.createElement(
+      DrawerHeader,
+      {
+        title,
+        colorTitle,
+        onClose: handleDrawerClose
+      }
+    ), /* @__PURE__ */ import_react20.default.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ import_react20.default.createElement(DrawerActions, { actions: drawerActions, anchor }))
   ));
 }
 
@@ -2759,20 +2815,6 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
   import_x_license2.LicenseInfo.setLicenseKey(
     "77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
   );
-  const columnsWidthConfig = import_react27.default.useMemo(() => {
-    var _a, _b;
-    if (!columns || columns.length === 0) return columns;
-    const cols = [...columns];
-    const lastIndex = cols.length - 1;
-    if (!cols[lastIndex].flex) {
-      cols[lastIndex] = __spreadProps(__spreadValues({}, cols[lastIndex]), {
-        flex: 1,
-        minWidth: (_b = (_a = cols[lastIndex].minWidth) != null ? _a : cols[lastIndex].width) != null ? _b : 120
-      });
-      delete cols[lastIndex].width;
-    }
-    return cols;
-  }, [columns]);
   const theme = (0, import_styles.useTheme)();
   const apiRef = (0, import_x_data_grid_pro.useGridApiRef)();
   const isRowSelectable = (params) => params.row.bloqueoChecked == false ? false : true;
@@ -2793,6 +2835,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
   const groupingColDefs = {
     field: "grouping",
     headerName: groupColumns ? groupColumns(data[0]).headerNameFirstColumn : "Agrupador",
+    flex: 1,
     renderCell: (params) => {
       var _a, _b;
       let label = params.value.toString().includes("/") ? params.value.split("/")[0].toString() : params.value.toString();
@@ -2862,7 +2905,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
             overflow: "hidden",
             textOverflow: "ellipsis",
             whiteSpace: "nowrap",
-            color: "text.primary",
+            color: "#101840DE",
             display: "flex",
             alignItems: "center",
             paddingLeft: params.rowNode.depth == 0 ? "5px" : params.rowNode.depth == 1 ? "15px" : "25px",
@@ -2985,13 +3028,24 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
       setSelectionModel([...newSelection]);
     }
   };
+  const processedColumns = columns.map((col) => {
+    if (col.width !== void 0) {
+      return col;
+    }
+    if (col.flex !== void 0) {
+      return col;
+    }
+    return __spreadProps(__spreadValues({}, col), {
+      flex: 1
+    });
+  });
   return /* @__PURE__ */ import_react27.default.createElement(import_react27.default.Fragment, null, data && /* @__PURE__ */ import_react27.default.createElement(import_react27.default.Fragment, null, /* @__PURE__ */ import_react27.default.createElement("div", { style: { width: width || "100%", maxHeight: maxHeight ? `${maxHeight}px` : "none" } }, /* @__PURE__ */ import_react27.default.createElement(
     import_x_data_grid_pro.DataGridPro,
     {
       apiRef,
       rowHeight: styleRowHeight,
       rows: arrayRows,
-      columns: columnsWidthConfig,
+      columns: processedColumns,
       density: styleDensity,
       treeData: validationTreeData,
       getTreeDataPath: validationTreeData == true ? getTreeDataPaths : void 0,
@@ -3000,12 +3054,14 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
       initialState: {
         pagination: { paginationModel: { pageSize: rows } }
       },
+      scrollbarSize: 0,
       checkboxSelection: validationCheckboxSelection,
       rowSelectionModel: selectionModel,
       onRowSelectionModelChange: (newSelection) => handleSelectionChange(newSelection),
       isRowSelectable,
       disableRowSelectionOnClick: true,
       hideFooter: validationTreeData == true ? true : false,
+      disableColumnResize: false,
       localeText: {
         noRowsLabel: "No hay filas",
         columnMenuLabel: "Men\xFA de columna",
@@ -3036,7 +3092,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
         "&.MuiDataGrid-root": {
           [`--DataGrid-topContainerHeight`]: `${styleTopContainerHeight} !important`
         },
-        "& .MuiDataGrid-root .MuiDataGrid-virtualScrollerContent .MuiDataGrid-row": {
+        "MuiDataGrid-root .MuiDataGrid-virtualScrollerContent .MuiDataGrid-row": {
           "--height": "0px !important",
           "minHeight": "0px !important",
           "maxHeight": "0px !important"
@@ -3045,22 +3101,82 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
           padding: "0 !important",
           background: "white"
         },
-        "& .MuiDataGrid-cell .MuiDataGrid-cellEmpty": {
-          display: "none",
-          width: "0px"
+        // Ocultar celdas vacías completamente
+        "& .MuiDataGrid-cellEmpty": {
+          display: "none !important",
+          width: "0 !important",
+          minWidth: "0 !important",
+          maxWidth: "0 !important"
+        },
+        // Forzar que las columnas ocupen todo el ancho
+        "& .MuiDataGrid-row": {
+          maxWidth: "100% !important"
+        },
+        // Ocultar scrollbars personalizados de MUI completamente en todos los estados
+        "& .MuiDataGrid-scrollbar": {
+          display: "none !important",
+          visibility: "hidden !important",
+          width: "0 !important",
+          opacity: "0 !important"
+        },
+        "& .MuiDataGrid-scrollbar--vertical": {
+          display: "none !important",
+          visibility: "hidden !important",
+          width: "0 !important",
+          opacity: "0 !important"
+        },
+        "& .MuiDataGrid-scrollbar--horizontal": {
+          display: "none !important",
+          visibility: "hidden !important",
+          height: "0 !important",
+          opacity: "0 !important"
+        },
+        "& .MuiDataGrid-scrollbar.MuiDataGrid-scrollbar--scrollable": {
+          display: "none !important",
+          visibility: "hidden !important"
         },
+        // Prevenir aparición de scrollbar en hover sobre row
+        "& .MuiDataGrid-row:hover ~ .MuiDataGrid-scrollbar": {
+          display: "none !important",
+          visibility: "hidden !important"
+        },
+        // Scrollbar filler y content siempre ocultos
+        "& .MuiDataGrid-scrollbarFiller": {
+          backgroundColor: "transparent !important",
+          display: "none !important"
+        },
+        "& .MuiDataGrid-scrollbarContent": {
+          backgroundColor: "transparent !important",
+          display: "none !important"
+        },
+        // Scrollbar nativo visible solo cuando hay overflow
         "& .MuiDataGrid-virtualScroller": {
           overflowY: "auto !important",
+          scrollbarWidth: "thin",
+          scrollbarColor: "#888 transparent",
           "&::-webkit-scrollbar": {
-            width: "0px"
+            width: "8px",
+            height: "8px"
           },
-          "&:hover::-webkit-scrollbar": {
-            width: "8px"
+          "&::-webkit-scrollbar-track": {
+            background: "transparent"
           },
           "&::-webkit-scrollbar-thumb": {
-            backgroundColor: "rgba(0,0,0,.2)",
+            background: "#888",
             borderRadius: "4px"
+          },
+          "&::-webkit-scrollbar-thumb:hover": {
+            background: "#555"
           }
+        },
+        // Prevenir que aparezca scrollbar en hover
+        "&:hover .MuiDataGrid-scrollbar": {
+          display: "none !important",
+          visibility: "hidden !important"
+        },
+        "&:hover .MuiDataGrid-scrollbar--vertical": {
+          display: "none !important",
+          visibility: "hidden !important"
         }
       }
     }
@@ -3910,7 +4026,7 @@ var CALENDAR_CONSTANTS = {
   GRID_TEMPLATE: "repeat(7, minmax(150px, 1fr))",
   DAY_HEIGHT: 60,
   SIDEBAR_WIDTH: 47,
-  MIN_CELL_HEIGHT: 90,
+  MIN_CELL_HEIGHT: 99,
   DEFAULT_START_HOUR: 0,
   DEFAULT_END_HOUR: 23,
   DRAWER_WIDTH: "350px",