frontend-plus-react 0.1.4 → 0.1.6

package/dist/index.js

@@ -622,7 +622,7 @@ var SnackbarAlert = React.forwardRef(function SnackbarAlert2(props, ref) {
 });
 var SnackbarContext = createContext(void 0);
 var DEFAULT_SUCCESS_DURATION = 3e3;
-var DEFAULT_ERROR_DURATION = 5e3;
+var DEFAULT_ERROR_DURATION = 1e4;
 var SnackbarProvider = ({ children }) => {
   const [snackbar, setSnackbar] = useState({
     open: false,
@@ -757,9 +757,12 @@ var useApiCall = () => {
   const { showSnackbar } = useSnackbar();
   const [loading, setLoading] = useState2(false);
   const [error, setError] = useState2(null);
-  const callApi = useCallback2(async (procedureName, params) => {
+  const callApi = useCallback2(async (procedureName, params, opts) => {
     setLoading(true);
     setError(null);
+    const defaultOpts = { ...{
+      reportOnSnackbar: true
+    }, ...opts };
     try {
       const result = await executeBackendProcedure(procedureName, params);
       return result === null ? void 0 : result;
@@ -771,7 +774,9 @@ var useApiCall = () => {
       } else if (err instanceof Error) {
         snackbarMessage = err.message;
       }
-      showSnackbar(snackbarMessage, "error");
+      if (defaultOpts.reportOnSnackbar) {
+        showSnackbar(snackbarMessage, "error");
+      }
       throw err;
     } finally {
       setLoading(false);
@@ -781,14 +786,7 @@ var useApiCall = () => {
 };
 
 // src/components/grid/GenericDataGrid.tsx
-import {
-  CircularProgress,
-  Typography as Typography5,
-  Box as Box5,
-  Alert,
-  useTheme as useTheme2,
-  Button as Button3
-} from "@mui/material";
+import { CircularProgress, Typography as Typography5, Box as Box7, Alert, useTheme as useTheme3 } from "@mui/material";
 
 // src/utils/functions.tsx
 var JSON4all = __toESM(require_json4all(), 1);
@@ -988,9 +986,18 @@ var useRedirectPath = () => {
 
 // src/utils/functions.tsx
 var cambiarGuionesBajosPorEspacios = (texto) => texto.replace(/_/g, " ");
-
-// src/components/grid/GenericDataGrid.tsx
-import AddIcon from "@mui/icons-material/Add";
+var getDetailTableAndFixedFieldsForDetailTableAbr = (tableDefinition, detailTableAbr, row) => {
+  const detailTable = tableDefinition.detailTables.find((dt) => dt.abr === detailTableAbr);
+  let fixedFields = [];
+  detailTable.fields.forEach((field) => {
+    if (typeof field === "string") {
+      fixedFields.push({ fieldName: field, value: row[field] });
+    } else {
+      fixedFields.push({ fieldName: field.target, value: row[field.source] });
+    }
+  });
+  return { detailTable, fixedFields };
+};
 
 // src/components/ConfirmDialog.tsx
 import Dialog from "@mui/material/Dialog";
@@ -1024,7 +1031,8 @@ var ConfirmDialog = ({ open, onClose, title, message }) => {
 import { Box, IconButton, Tooltip, Typography } from "@mui/material";
 import SearchIcon from "@mui/icons-material/Search";
 import SearchOffIcon from "@mui/icons-material/SearchOff";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import MoreVertIcon from "@mui/icons-material/MoreVert";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var defaultColumnHeaderCellRenderer = (props, fieldDef) => {
   const { column } = props;
   const isPrimaryKey = fieldDef.isPk;
@@ -1047,7 +1055,7 @@ var defaultColumnHeaderCellRenderer = (props, fieldDef) => {
           sx: {
             fontWeight: "bold",
             textDecoration: isPrimaryKey ? "underline" : "none",
-            fontSize: "0.875rem"
+            fontSize: "o.930rem"
             // Puedes ajustar el tamaño si es necesario
           },
           children: column.name
@@ -1056,17 +1064,30 @@ var defaultColumnHeaderCellRenderer = (props, fieldDef) => {
     }
   );
 };
-var actionsColumnHeaderCellRenderer = (props, isFilterRowVisible, toggleFilterVisibility) => /* @__PURE__ */ jsx3(
-  IconButton,
-  {
-    color: "inherit",
-    onClick: toggleFilterVisibility,
-    size: "small",
-    title: isFilterRowVisible ? "Ocultar filtros" : "Mostrar filtros",
-    sx: { p: 0.5 },
-    children: isFilterRowVisible ? /* @__PURE__ */ jsx3(SearchOffIcon, { sx: { fontSize: 20 } }) : /* @__PURE__ */ jsx3(SearchIcon, { sx: { fontSize: 20 } })
-  }
-);
+var actionsColumnHeaderCellRenderer = (props, isFilterRowVisible, toggleFilterVisibility) => /* @__PURE__ */ jsxs3(Box, { sx: { display: "flex", flexDirection: "row", alignItems: "center", justifyContent: "center", gap: 0.2 }, children: [
+  /* @__PURE__ */ jsx3(
+    IconButton,
+    {
+      color: "inherit",
+      onClick: toggleFilterVisibility,
+      size: "small",
+      title: isFilterRowVisible ? "Ocultar filtros" : "Mostrar filtros",
+      sx: { p: 0.25 },
+      children: isFilterRowVisible ? /* @__PURE__ */ jsx3(SearchOffIcon, { sx: { fontSize: 18 } }) : /* @__PURE__ */ jsx3(SearchIcon, { sx: { fontSize: 18 } })
+    }
+  ),
+  /* @__PURE__ */ jsx3(
+    IconButton,
+    {
+      onClick: () => {
+      },
+      size: "small",
+      title: "Opciones de esta tabla",
+      sx: { p: 0.25 },
+      children: /* @__PURE__ */ jsx3(MoreVertIcon, { sx: { fontSize: 20, variant: "filled", size: "small" } })
+    }
+  )
+] });
 var detailColumnCellHeaderRenderer = (props, detailTable) => /* @__PURE__ */ jsx3(Tooltip, { title: detailTable.label, children: /* @__PURE__ */ jsx3(Typography, { variant: "caption", sx: { fontSize: "0.75rem", fontWeight: "bold" }, children: detailTable.abr.toUpperCase() }) });
 
 // src/components/grid/FilterInputRender.tsx
@@ -1087,6 +1108,7 @@ function FilterInputRenderer({
       }),
       sx: {
         width: "100%",
+        height: 25,
         margin: "0",
         border: "1px solid #ccc",
         borderRadius: "4px",
@@ -1101,35 +1123,38 @@ function FilterInputRenderer({
 var FilterInputRender_default = FilterInputRenderer;
 
 // src/components/grid/renderers/summaryCellRenderers.tsx
+import { Box as Box2 } from "@mui/material";
 import { jsx as jsx5 } from "react/jsx-runtime";
 var defaultColumnSummaryCellRenderer = (props, fixedFields, isFilterRowVisible, filters, setFilters) => {
   const { column } = props;
   const fixedFieldEntry = fixedFields?.find((f) => f.fieldName === column.key);
   if (fixedFieldEntry && fixedFieldEntry.until === void 0 || !isFilterRowVisible) return null;
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx5(Box2, { children: /* @__PURE__ */ jsx5(
     FilterInputRender_default,
     {
       column,
       filters,
       setFilters
     }
-  );
+  ) });
 };
 var actionsColumnSummaryCellRenderer = (props) => null;
 var detailColumnCellSummaryRenderer = (props) => null;
 
 // src/components/grid/renderers/cellRenderers.tsx
-import { Box as Box4, Button as Button2, IconButton as IconButton2, Tooltip as Tooltip3, Typography as Typography4, useTheme } from "@mui/material";
+import { Box as Box5, Button as Button2, IconButton as IconButton2, Tooltip as Tooltip3, Typography as Typography4, useTheme } from "@mui/material";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
+import ViewHeadlineIcon from "@mui/icons-material/ViewHeadline";
 import DeleteIcon from "@mui/icons-material/Delete";
+import AddIcon from "@mui/icons-material/Add";
 
 // src/components/grid/ExampleClientSideComponent.tsx
-import { Box as Box2, Typography as Typography2 } from "@mui/material";
+import { Box as Box3, Typography as Typography2 } from "@mui/material";
 import { jsx as jsx6 } from "react/jsx-runtime";
 var ExampleClientSideComponent = ({ row, column, fieldDefinition }) => {
   const value = row[column.key];
-  return /* @__PURE__ */ jsx6(Box2, { sx: {
+  return /* @__PURE__ */ jsx6(Box3, { sx: {
     padding: 0.5,
     width: "100%",
     height: "100%",
@@ -1141,14 +1166,13 @@ var ExampleClientSideComponent = ({ row, column, fieldDefinition }) => {
 var ExampleClientSideComponent_default = ExampleClientSideComponent;
 
 // src/components/grid/FallbackClientSideRenderer.tsx
-import { Box as Box3, Typography as Typography3, Tooltip as Tooltip2 } from "@mui/material";
+import { Box as Box4, Typography as Typography3, Tooltip as Tooltip2 } from "@mui/material";
 import WarningAmberIcon from "@mui/icons-material/WarningAmber";
-import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 var FallbackClientSideRenderer = ({ column, row, fieldDefinition }) => {
-  const value = row[column.key];
   const clientSideName = fieldDefinition?.clientSide || "Desconocido";
-  return /* @__PURE__ */ jsx7(Tooltip2, { title: `Componente clientSide '${clientSideName}' no implementado. Mostrando valor por defecto.`, children: /* @__PURE__ */ jsxs3(
-    Box3,
+  return /* @__PURE__ */ jsx7(Tooltip2, { title: `Componente clientSide '${clientSideName}' no implementado. Mostrando valor por defecto.`, children: /* @__PURE__ */ jsxs4(
+    Box4,
     {
       sx: {
         display: "flex",
@@ -1168,7 +1192,7 @@ var FallbackClientSideRenderer = ({ column, row, fieldDefinition }) => {
         // Evita que el contenido se desborde
       },
       children: [
-        /* @__PURE__ */ jsx7(Typography3, { variant: "body2", noWrap: true, sx: { flexGrow: 1 }, children: value !== null && value !== void 0 ? String(value) : "*Vac\xEDo*" }),
+        /* @__PURE__ */ jsx7(Typography3, { variant: "body2", noWrap: true, sx: { flexGrow: 1 }, children: clientSideName + " not found" }),
         /* @__PURE__ */ jsx7(
           WarningAmberIcon,
           {
@@ -1208,24 +1232,26 @@ var allColumnsCellRenderer = (props) => {
     const detailTableAbr = row[DETAIL_ROW_INDICATOR];
     const detailColumn = column;
     if (column.customType === "detail" && detailColumn.detailTable.abr === detailTableAbr) {
-      const detailTable = detailColumn.tableDefinition.detailTables.find((dt) => dt.abr === detailTableAbr);
-      let fixedFields = [];
-      detailTable.fields.forEach((field) => {
-        if (typeof field === "string") {
-          fixedFields.push({ fieldName: field, value: row[field] });
-        } else {
-          fixedFields.push({ fieldName: field.target, value: row[field.source] });
+      const { detailTable, fixedFields } = getDetailTableAndFixedFieldsForDetailTableAbr(detailColumn.tableDefinition, detailTableAbr, row);
+      return /* @__PURE__ */ jsx8(
+        Box5,
+        {
+          sx: {
+            // Se eliminó el padding para que la sub-grilla se extienda por completo
+            minHeight: "200px",
+            width: "100%",
+            height: "100%",
+            //display: 'flex',
+            //flexDirection: 'column',
+            boxSizing: "border-box"
+          },
+          onMouseDown: (e) => e.stopPropagation(),
+          onClick: (e) => e.stopPropagation(),
+          onKeyDown: (e) => e.stopPropagation(),
+          onDoubleClick: (e) => e.stopPropagation(),
+          children: /* @__PURE__ */ jsx8(GenericDataGrid_default, { tableName: detailTable.table, fixedFields, gridStyles: { height: 322 } })
         }
-      });
-      return /* @__PURE__ */ jsx8(Box4, { sx: {
-        // Se eliminó el padding para que la sub-grilla se extienda por completo
-        minHeight: "200px",
-        width: "100%",
-        height: "100%",
-        //display: 'flex',
-        //flexDirection: 'column',
-        boxSizing: "border-box"
-      }, children: /* @__PURE__ */ jsx8(GenericDataGrid_default, { tableName: detailTable.table, fixedFields }) });
+      );
     }
     return void 0;
   }
@@ -1256,7 +1282,7 @@ var allColumnsCellRenderer = (props) => {
         }
       }
       const value = row[props.column.key];
-      return /* @__PURE__ */ jsx8(Box4, { sx: { position: "absolute", top: 0, left: 0, width: "100%", height: "100%", backgroundColor: cellBackgroundColor, transition: "background-color 0.3s ease-in-out", display: "flex", alignItems: "center", paddingLeft: "8px", boxSizing: "border-box" }, children: /* @__PURE__ */ jsx8(Typography4, { variant: "body2", sx: { fontSize: "0.875rem", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", width: "100%" }, children: value === null || value === void 0 ? "" : String(value) }) });
+      return /* @__PURE__ */ jsx8(Tooltip3, { title: cellFeedback && cellFeedback.rowId === rowId && cellFeedback.columnKey === props.column.key ? cellFeedback?.message : "", children: /* @__PURE__ */ jsx8(Box5, { sx: { position: "absolute", top: 0, left: 0, width: "100%", height: "100%", backgroundColor: cellBackgroundColor, transition: "background-color 0.3s ease-in-out", display: "flex", alignItems: "center", paddingLeft: "8px", boxSizing: "border-box" }, children: /* @__PURE__ */ jsx8(Typography4, { variant: "body2", sx: { fontSize: "0.875rem", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", width: "100%" }, children: value === null || value === void 0 ? "" : String(value) }) }) });
     }
     case "detail": {
       const detailColumn = column;
@@ -1264,10 +1290,9 @@ var allColumnsCellRenderer = (props) => {
       const isExpanded = tableData.some(
         (r) => r[DETAIL_ROW_INDICATOR] === detailTable.abr && getPrimaryKeyValues(r, primaryKey) === getPrimaryKeyValues({ ...row, [DETAIL_ROW_INDICATOR]: detailTable.abr }, primaryKey)
       );
-      return /* @__PURE__ */ jsx8(Tooltip3, { title: detailTable.label, children: /* @__PURE__ */ jsx8(Box4, { sx: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%" }, children: /* @__PURE__ */ jsx8(
+      return /* @__PURE__ */ jsx8(Tooltip3, { title: detailTable.label, children: /* @__PURE__ */ jsx8(Box5, { sx: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%" }, children: /* @__PURE__ */ jsx8(
         IconButton2,
         {
-          size: "small",
           onClick: (event) => {
             let rows = [...tableData];
             const rowId = getPrimaryKeyValues({ ...row, [DETAIL_ROW_INDICATOR]: detailTable.abr }, primaryKey);
@@ -1285,17 +1310,51 @@ var allColumnsCellRenderer = (props) => {
             }
             event.stopPropagation();
           },
-          title: isExpanded ? "Contraer detalle" : "Expandir detalle",
-          sx: { p: 0.5 },
           children: isExpanded ? /* @__PURE__ */ jsx8(KeyboardArrowUpIcon, { sx: { fontSize: 20 } }) : /* @__PURE__ */ jsx8(KeyboardArrowDownIcon, { sx: { fontSize: 20 } })
         }
       ) }) });
     }
     case "action": {
       const actionColumn = column;
-      const { tableDefinition, handleDeleteRow } = actionColumn;
-      if (!tableDefinition.allow?.delete) return void 0;
-      return /* @__PURE__ */ jsx8(Box4, { sx: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%" }, children: /* @__PURE__ */ jsx8(Button2, { variant: "outlined", color: "error", size: "small", onClick: () => handleDeleteRow(row), title: "Eliminar fila", sx: { minWidth: 35, height: 30, p: 0.5, "& .MuiButton-startIcon": { m: 0 } }, children: /* @__PURE__ */ jsx8(DeleteIcon, { sx: { fontSize: 18 } }) }) });
+      const { tableDefinition, handleDeleteRow, handleAddRow } = actionColumn;
+      const gridActionButtons = [
+        {
+          action: "insert",
+          handler: handleAddRow,
+          icon: AddIcon,
+          title: "Agregar registro",
+          color: "success"
+        },
+        {
+          action: "delete",
+          handler: handleDeleteRow,
+          icon: DeleteIcon,
+          title: "Eliminar registro",
+          color: "error"
+        },
+        {
+          action: "vertical-edit",
+          handler: () => {
+          },
+          // implementar funcion
+          icon: ViewHeadlineIcon,
+          title: "Editar registro en forma de ficha",
+          color: "primary"
+        }
+      ];
+      return /* @__PURE__ */ jsx8(Box5, { sx: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%", gap: 0.5 }, children: gridActionButtons.map((actionDef) => tableDefinition.allow[actionDef.action] ? /* @__PURE__ */ jsx8(
+        Button2,
+        {
+          variant: "outlined",
+          color: actionDef.color,
+          size: "small",
+          onClick: () => actionDef.handler(row),
+          title: actionDef.title,
+          sx: { width: 22, minWidth: 22, height: 22, "& .MuiButton-startIcon": { m: 0 } },
+          children: /* @__PURE__ */ jsx8(actionDef.icon, { sx: { fontSize: 18 } })
+        },
+        actionDef.action
+      ) : null) });
     }
     default:
       return void 0;
@@ -1305,7 +1364,17 @@ var allColumnsCellRenderer = (props) => {
 // src/components/grid/InputRenderer.tsx
 import { useCallback as useCallback3, useMemo, useState as useState3 } from "react";
 import InputBase2 from "@mui/material/InputBase";
+import { useTheme as useTheme2 } from "@mui/material";
 import { jsx as jsx9 } from "react/jsx-runtime";
+function findChangedValues(oldRowData, newRowData) {
+  let changes = [];
+  for (const key in newRowData) {
+    if (Object.prototype.hasOwnProperty.call(oldRowData, key) && oldRowData[key] !== newRowData[key]) {
+      changes.push(key);
+    }
+  }
+  return changes;
+}
 function InputRenderer({
   column,
   row,
@@ -1313,6 +1382,7 @@ function InputRenderer({
   tableDefinition,
   onRowChange,
   onClose,
+  cellFeedback,
   setCellFeedback,
   onEnterPress,
   setTableData,
@@ -1322,7 +1392,13 @@ function InputRenderer({
 }) {
   const tableName = tableDefinition.tableName;
   const [editingValue, setEditingValue] = useState3(row[column.key]);
+  const theme = useTheme2();
   const { showSuccess, showError } = useSnackbar();
+  const rowId = getPrimaryKeyValues(row, primaryKey);
+  let cellBackgroundColor;
+  if (cellFeedback && cellFeedback.rowId === rowId && cellFeedback.columnKey === column.key) {
+    cellBackgroundColor = cellFeedback.type === "error" ? theme.palette.error.light : theme.palette.success.light;
+  }
   const initialRowId = useMemo(() => getPrimaryKeyValues(row, primaryKey), [row, primaryKey]);
   const { callApi } = useApiCall();
   const handleCommit = useCallback3(async (currentValue, closeEditor, focusNextCell) => {
@@ -1336,27 +1412,12 @@ function InputRenderer({
     const isMandatoryFieldEmpty = isNewRow && isMandatoryField && (processedNewValue === null || processedNewValue === void 0 || String(processedNewValue).trim() === "");
     if (processedNewValue === row[column.key] && !isNewRow && !isMandatoryFieldEmpty) {
       console.log("No se guard\xF3: el valor no cambi\xF3 (y no es una nueva fila o campo obligatorio vac\xEDo que se est\xE1 iniciando).");
-      onClose(false, focusNextCell);
-      setLocalCellChanges((prev) => {
-        const newMap = new Map(prev);
-        const columnKeys = newMap.get(initialRowId);
-        if (columnKeys) {
-          columnKeys.delete(column.key);
-          if (columnKeys.size === 0) {
-            newMap.delete(initialRowId);
-          } else {
-            newMap.set(initialRowId, columnKeys);
-          }
-        }
-        return newMap;
-      });
       return;
     }
     const oldRowData = { ...row };
     const primaryKeyValuesForBackend = tableDefinition.primaryKey.map((key) => potentialUpdatedRow[key]);
     const currentRowIdBeforeUpdate = getPrimaryKeyValues(oldRowData, tableDefinition.primaryKey);
     onRowChange({ ...row, [column.key]: processedNewValue }, true);
-    onClose(true, focusNextCell);
     if (isNewRow) {
       const areAllMandatoryFieldsFilled = tableDefinition.fields.every((fieldDef) => {
         const isMandatory = fieldDef.nullable === false || fieldDef.isPk;
@@ -1424,20 +1485,6 @@ function InputRenderer({
         oldRow: oldRowData,
         status
       });
-      setLocalCellChanges((prev) => {
-        const newMap = new Map(prev);
-        const columnKeys = newMap.get(initialRowId);
-        if (columnKeys) {
-          columnKeys.delete(column.key);
-          if (columnKeys.size === 0) {
-            newMap.delete(initialRowId);
-          } else {
-            newMap.set(initialRowId, columnKeys);
-          }
-        }
-        return newMap;
-      });
-      showSuccess("Registro guardado exitosamente!");
       let finalRowIdForFeedback;
       let persistedRowData;
       if (response.row && isNewRow) {
@@ -1460,15 +1507,17 @@ function InputRenderer({
         });
         finalRowIdForFeedback = getPrimaryKeyValues(persistedRowData, tableDefinition.primaryKey);
       } else {
-        persistedRowData = potentialUpdatedRow;
+        persistedRowData = response.row;
         const isPrimaryKeyColumn = tableDefinition.primaryKey.includes(column.key);
         finalRowIdForFeedback = isPrimaryKeyColumn ? getPrimaryKeyValues(potentialUpdatedRow, tableDefinition.primaryKey) : currentRowIdBeforeUpdate;
+        onRowChange({ ...response.row }, true);
       }
-      setCellFeedback({ rowId: finalRowIdForFeedback, columnKey: column.key, type: "success" });
+      findChangedValues(oldRowData, response.row).forEach(
+        (key) => setCellFeedback({ rowId: finalRowIdForFeedback, columnKey: key, type: "success" })
+      );
     } catch (err) {
       console.error("Error al guardar el registro:", err);
-      setCellFeedback({ rowId: currentRowIdBeforeUpdate, columnKey: column.key, type: "error" });
-      onRowChange(oldRowData, true);
+      setCellFeedback({ rowId: currentRowIdBeforeUpdate, columnKey: column.key, type: "error", message: err.message });
     }
   }, [
     column,
@@ -1487,14 +1536,12 @@ function InputRenderer({
     initialRowId
   ]);
   const handleKeyDown = useCallback3((event) => {
-    if (event.key === "Enter") {
+    if (["Enter", "Tab", "ArrowDown", "ArrowUp", "ArrowRight"].includes(event.key)) {
       handleCommit(editingValue, true, true);
       event.preventDefault();
       if (onEnterPress) {
-        onEnterPress(rowIdx, column.key);
+        onEnterPress(rowIdx, column.key, event.key);
       }
-    } else if (event.key === "Tab") {
-      handleCommit(editingValue, true, true);
     }
   }, [handleCommit, editingValue, column.key, rowIdx, onEnterPress]);
   const handleBlur = useCallback3(() => {
@@ -1517,7 +1564,8 @@ function InputRenderer({
         borderRadius: "4px",
         padding: "2px 4px",
         fontSize: "0.8rem",
-        boxSizing: "border-box"
+        boxSizing: "border-box",
+        backgroundColor: cellBackgroundColor
       },
       onClick: (e) => e.stopPropagation(),
       autoFocus: true,
@@ -1528,29 +1576,57 @@ function InputRenderer({
 var InputRenderer_default = InputRenderer;
 
 // src/components/grid/renderers/editCellRenderers.tsx
+import { Box as Box6, Tooltip as Tooltip4 } from "@mui/material";
 import { jsx as jsx10 } from "react/jsx-runtime";
-var defaultColumnEditCellRenderer = (props, tableDefinition, fixedFields, primaryKey, setCellFeedback, setTableData, localCellChanges, setLocalCellChanges, handleEnterKeyPressInEditor, allColumns) => {
-  const { column } = props;
-  if (column.editable) {
-    const fieldDefinition = tableDefinition.fields.find((f) => f.name === column.key);
-    const isFixedField = fixedFields?.some((f) => f.fieldName === column.key);
-    const isFieldEditableByUI = fieldDefinition?.editable !== false && !isFixedField;
-    if (!isFieldEditableByUI) {
-      return void 0;
-    }
-    return /* @__PURE__ */ jsx10(
-      InputRenderer_default,
-      {
-        ...props,
+var allColumnsEditCellRenderer = (props, allColumns) => {
+  const column = props.column;
+  switch (column.customType) {
+    case "default": {
+      const defaultColumn = column;
+      const {
         tableDefinition,
-        setCellFeedback,
-        onEnterPress: (rowIndex, columnKey) => handleEnterKeyPressInEditor(rowIndex, columnKey, allColumns),
+        fixedFields,
+        primaryKey,
         setTableData,
-        setLocalCellChanges,
+        cellFeedback,
+        setCellFeedback,
+        handleEnterKeyPressInEditor,
         localCellChanges,
-        primaryKey
+        setLocalCellChanges
+      } = defaultColumn;
+      if (column.editable) {
+        const fieldDefinition = tableDefinition.fields.find((f) => f.name === column.key);
+        const isFixedField = fixedFields?.some((f) => f.fieldName === column.key);
+        const isFieldEditableByUI = fieldDefinition?.editable !== false && !isFixedField;
+        if (!isFieldEditableByUI) {
+          return void 0;
+        }
+        const rowId = getPrimaryKeyValues(props.row, primaryKey);
+        return /* @__PURE__ */ jsx10(Tooltip4, { title: cellFeedback && cellFeedback.rowId === rowId && cellFeedback.columnKey === props.column.key ? cellFeedback?.message : "", children: /* @__PURE__ */ jsx10(Box6, { children: /* @__PURE__ */ jsx10(
+          InputRenderer_default,
+          {
+            ...props,
+            tableDefinition,
+            setCellFeedback,
+            cellFeedback,
+            onEnterPress: (rowIndex, columnKey, key) => handleEnterKeyPressInEditor(rowIndex, columnKey, key, allColumns),
+            setTableData,
+            setLocalCellChanges,
+            localCellChanges,
+            primaryKey
+          }
+        ) }) });
       }
-    );
+      return void 0;
+    }
+    case "detail": {
+      return void 0;
+    }
+    case "action": {
+      return void 0;
+    }
+    default:
+      return void 0;
   }
 };
 
@@ -1576,9 +1652,12 @@ function EmptyRowsRenderer() {
 }
 
 // src/components/grid/GenericDataGrid.tsx
-import { jsx as jsx12, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
 var getPrimaryKeyValues = (row, primaryKey) => {
-  return primaryKey.concat(DETAIL_ROW_INDICATOR).map((key) => {
+  if (row[DETAIL_ROW_INDICATOR]) {
+    primaryKey = primaryKey.concat(DETAIL_ROW_INDICATOR);
+  }
+  return primaryKey.map((key) => {
     return row[key] !== void 0 && row[key] !== null ? String(row[key]) : "NULL_OR_UNDEFINED";
   }).join("|");
 };
@@ -1586,16 +1665,19 @@ var NEW_ROW_INDICATOR = "$new";
 var DETAIL_ROW_INDICATOR = "$detail";
 var GenericDataGrid = ({
   tableName,
-  fixedFields
+  fixedFields,
+  gridStyles
 }) => {
+  const isOpenMenu = useIsDrawerOpen();
   const [tableDefinition, setTableDefinition] = useState4(null);
   const [tableData, setTableData] = useState4([]);
   const [isFilterRowVisible, setIsFilterRowVisible] = useState4(false);
   const [filters, setFilters] = useState4({});
   const [selectedRows, setSelectedRows] = useState4(() => /* @__PURE__ */ new Set());
+  const [selectedCell, setSelectedCell] = useState4(void 0);
   const [cellFeedback, setCellFeedback] = useState4(null);
   const [localCellChanges, setLocalCellChanges] = useState4(/* @__PURE__ */ new Map());
-  const theme = useTheme2();
+  const theme = useTheme3();
   const [openConfirmDialog, setOpenConfirmDialog] = useState4(false);
   const [rowToDelete, setRowToDelete] = useState4(null);
   const [exitingRowIds, setExitingRowIds] = useState4(/* @__PURE__ */ new Set());
@@ -1638,7 +1720,11 @@ var GenericDataGrid = ({
       }
     };
     fetchDataAndDefinition();
-  }, [tableName, fixedFields, showError]);
+  }, [
+    tableName,
+    /*fixedFields,*/
+    showError
+  ]);
   useEffect(() => {
     if (cellFeedback) {
       if (feedbackTimerRef.current) {
@@ -1646,7 +1732,8 @@ var GenericDataGrid = ({
       }
       const timerDuration = 3e3;
       feedbackTimerRef.current = setTimeout(() => {
-        setCellFeedback(null);
+        if (cellFeedback.type == "success")
+          setCellFeedback(null);
       }, timerDuration);
     }
     return () => {
@@ -1795,12 +1882,12 @@ var GenericDataGrid = ({
     }
     return rows;
   }, [tableData, filters, isFilterRowVisible]);
-  const handleEnterKeyPressInEditor = useCallback4((rowIndex, columnKey, currentColumns) => {
+  const handleEnterKeyPressInEditor = useCallback4((rowIndex, columnKey, key, currentColumns) => {
     if (dataGridRef.current && tableDefinition) {
       const currentColumnIndex = currentColumns.findIndex((col) => col.key === columnKey);
       const editableColumns = currentColumns.filter((col) => {
         const fieldDefinition = tableDefinition.fields.find((f) => f.name === col.key);
-        return col.key !== "filterToggle" && col.key !== "deleteAction" && (fieldDefinition?.editable !== false && !fieldDefinition?.clientSide);
+        return col.key !== "actionsColumn" && col.customType != "detail" && (fieldDefinition?.editable !== false && !fieldDefinition?.clientSide);
       });
       if (currentColumnIndex !== -1 && editableColumns.length > 0) {
         const editableColumnKeys = editableColumns.map((col) => col.key);
@@ -1817,11 +1904,14 @@ var GenericDataGrid = ({
           }
           const nextColumnKey = editableColumnKeys[nextEditableColumnIndex];
           const nextColumnIndex = currentColumns.findIndex((col) => col.key === nextColumnKey);
-          dataGridRef.current.selectCell({ rowIdx: nextRowIndex, idx: nextColumnIndex }, { enableEditor: false, scrollIntoView: true });
+          dataGridRef.current?.selectCell({ rowIdx: nextRowIndex, idx: nextColumnIndex }, { enableEditor: true, shouldFocusCell: true });
         }
       }
     }
   }, [filteredRows, tableDefinition]);
+  const handleSelectedCellChange = useCallback4((args) => {
+    setSelectedCell(args);
+  }, []);
   const columns = useMemo2(() => {
     if (!tableDefinition) return [];
     const fieldsToShow = tableDefinition.fields.filter((field) => {
@@ -1840,27 +1930,37 @@ var GenericDataGrid = ({
         primaryKey,
         fixedFields,
         localCellChanges,
+        setLocalCellChanges,
+        setTableData,
+        setCellFeedback,
         name: fieldDef.label || cambiarGuionesBajosPorEspacios(fieldDef.name),
         resizable: true,
         sortable: true,
-        //frozen: true,
         editable: isFieldEditable,
+        handleEnterKeyPressInEditor,
         flexGrow: 1,
         minWidth: 60,
         renderHeaderCell: (props) => defaultColumnHeaderCellRenderer(props, fieldDef),
         renderSummaryCell: (props) => defaultColumnSummaryCellRenderer(props, fixedFields, isFilterRowVisible, filters, setFilters)
       };
     });
+    const availableActions = [
+      tableDefinition.allow?.insert,
+      tableDefinition.allow?.delete,
+      tableDefinition.allow?.["vertical-edit"]
+    ].filter(Boolean).length;
+    const actionColumnWidth = availableActions === 0 ? 30 : 12 + availableActions * 25;
     const actionsColumn = {
-      key: "filterToggle",
+      key: "actionsColumn",
       customType: "action",
       tableDefinition,
       handleDeleteRow,
+      handleAddRow,
       name: "filterCol",
-      width: 50,
+      width: actionColumnWidth,
+      editable: false,
       resizable: false,
       sortable: false,
-      //frozen: true,
       renderHeaderCell: (props) => actionsColumnHeaderCellRenderer(props, isFilterRowVisible, toggleFilterVisibility),
       renderSummaryCell: (props) => actionsColumnSummaryCellRenderer(props)
     };
@@ -1880,8 +1980,9 @@ var GenericDataGrid = ({
           name: detailTable.label || `Detalle ${detailTable.abr}`,
           resizable: false,
           sortable: false,
-          width: 50,
-          //frozen: true,
+          editable: false,
+          width: 30,
+          minWidth: 30,
           renderHeaderCell: (props) => detailColumnCellHeaderRenderer(props, detailTable),
           renderSummaryCell: (props) => detailColumnCellSummaryRenderer(props)
         });
@@ -1903,7 +2004,9 @@ var GenericDataGrid = ({
         }
         return void 0;
       },
-      renderEditCell: (props) => defaultColumnEditCellRenderer(props, tableDefinition, fixedFields, primaryKey, setCellFeedback, setTableData, localCellChanges, setLocalCellChanges, handleEnterKeyPressInEditor, allColumns),
+      editorOptions: { closeOnExternalRowChange: false },
+      //con esto no se pierde el foco
+      renderEditCell: (props) => allColumnsEditCellRenderer(props, allColumns),
       renderCell: (props) => allColumnsCellRenderer(props)
     }));
   }, [
@@ -1921,13 +2024,30 @@ var GenericDataGrid = ({
     setTableData,
     localCellChanges,
     handleDeleteRow,
+    handleAddRow,
     fixedFields,
     tableData
   ]);
   const handleRowsChange = useCallback4((updatedRows) => {
     setTableData(updatedRows);
   }, []);
+  const deselectAllOtherGrids = (currentGridElement) => {
+    const allSelectedCells = document.querySelectorAll("div[aria-selected='true']");
+    allSelectedCells.forEach((cell) => {
+      const parentGrid = cell.closest(".rdg");
+      if (parentGrid && parentGrid !== currentGridElement) {
+        cell.setAttribute("aria-selected", "false");
+      }
+    });
+  };
+  const handleCellKeyDown = (args, event) => {
+    if (["Tab", "Enter"].includes(event.key)) {
+      event.preventGridDefault();
+    }
+  };
   const handleCellClick = useCallback4((args) => {
+    deselectAllOtherGrids(dataGridRef.current?.element);
+    args.selectCell(true);
     const fieldDefinition = tableDefinition?.fields.find((f) => f.name === args.column.key);
     const isFixedField = fixedFields?.some((f) => f.fieldName === args.column.key);
     const isEditable = fieldDefinition?.editable !== false && !isFixedField;
@@ -1936,29 +2056,20 @@ var GenericDataGrid = ({
     console.log("Is editable:", isEditable);
   }, [tableDefinition, fixedFields]);
   if (loading) {
-    return /* @__PURE__ */ jsxs4(Box5, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: [
+    return /* @__PURE__ */ jsxs5(Box7, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: [
       /* @__PURE__ */ jsx12(CircularProgress, {}),
       /* @__PURE__ */ jsx12(Typography5, { variant: "h6", sx: { ml: 2 }, children: "Cargando tabla..." })
     ] });
   }
   if (error) {
-    return /* @__PURE__ */ jsx12(Box5, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsx12(Alert, { severity: "error", children: error.message }) });
+    return /* @__PURE__ */ jsx12(Box7, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsx12(Alert, { severity: "error", children: error.message }) });
   }
   if (!tableDefinition) {
-    return /* @__PURE__ */ jsx12(Box5, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsx12(Alert, { severity: "warning", children: "No se pudo cargar la definici\xF3n de la tabla." }) });
+    return /* @__PURE__ */ jsx12(Box7, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsx12(Alert, { severity: "warning", children: "No se pudo cargar la definici\xF3n de la tabla." }) });
   }
-  return /* @__PURE__ */ jsxs4(Box5, { sx: { pt: 2, display: "flex", flexDirection: "column", height: "100%", boxSizing: "border-box" }, children: [
-    tableDefinition.allow?.insert && /* @__PURE__ */ jsx12(Box5, { sx: { display: "flex", px: 2, pb: 1 }, children: /* @__PURE__ */ jsx12(
-      Button3,
-      {
-        variant: "contained",
-        onClick: handleAddRow,
-        startIcon: /* @__PURE__ */ jsx12(AddIcon, {}),
-        children: "Nuevo Registro"
-      }
-    ) }),
+  return /* @__PURE__ */ jsxs5(Box7, { sx: { pt: 2, display: "flex", flexDirection: "column", height: "100%", boxSizing: "border-box" }, children: [
     /* @__PURE__ */ jsx12(
-      Box5,
+      Box7,
       {
         sx: {
           backgroundColor: theme.palette.primary.main,
@@ -1972,15 +2083,15 @@ var GenericDataGrid = ({
           ml: 2,
           mr: 2
         },
-        children: /* @__PURE__ */ jsxs4(Typography5, { variant: "subtitle1", component: "div", children: [
+        children: /* @__PURE__ */ jsxs5(Typography5, { variant: "subtitle2", component: "div", children: [
           cambiarGuionesBajosPorEspacios(tableDefinition.title || tableDefinition.name),
-          " - mostrando ",
-          getFilteredRowCount() === getRowCount() ? `${getRowCount()} registros` : `${getFilteredRowCount()} registros filtrados`
+          " - ",
+          getFilteredRowCount() === getRowCount() ? `${getRowCount()} registros` : `${getFilteredRowCount()} (F)`
         ] })
       }
     ),
     /* @__PURE__ */ jsx12(
-      Box5,
+      Box7,
       {
         sx: {
           flexGrow: 1,
@@ -1994,6 +2105,7 @@ var GenericDataGrid = ({
         children: /* @__PURE__ */ jsx12(
           DataGrid,
           {
+            className: "rdg-light",
             ref: dataGridRef,
             columns,
             rows: filteredRows.map((row) => ({
@@ -2003,15 +2115,17 @@ var GenericDataGrid = ({
             enableVirtualization: true,
             rowKeyGetter: (row) => getPrimaryKeyValues(row, primaryKey),
             onSelectedRowsChange: setSelectedRows,
+            onSelectedCellChange: handleSelectedCellChange,
             onRowsChange: handleRowsChange,
             selectedRows,
-            rowHeight: (row) => row[DETAIL_ROW_INDICATOR] ? 400 : 35,
-            style: { height: "100%", width: "100%", boxSizing: "border-box" },
-            headerRowHeight: 35,
+            rowHeight: (row) => row[DETAIL_ROW_INDICATOR] ? 400 : 30,
+            style: { ...{ height: "100%", width: "100%", boxSizing: "border-box" }, ...gridStyles },
+            headerRowHeight: 30,
             topSummaryRows: isFilterRowVisible ? [{ id: "filterRow" }] : void 0,
-            summaryRowHeight: isFilterRowVisible ? 35 : 0,
+            summaryRowHeight: isFilterRowVisible ? 30 : 0,
+            renderers: { noRowsFallback: /* @__PURE__ */ jsx12(EmptyRowsRenderer, {}) },
             onCellClick: handleCellClick,
-            renderers: { noRowsFallback: /* @__PURE__ */ jsx12(EmptyRowsRenderer, {}) }
+            onCellKeyDown: handleCellKeyDown
           }
         )
       }
@@ -2037,7 +2151,7 @@ import { BrowserRouter, Routes, Route, useLocation as useLocation4, Navigate as
 import { useEffect as useEffect3 } from "react";
 import { Outlet } from "react-router-dom";
 import {
-  Box as Box8,
+  Box as Box10,
   AppBar,
   Toolbar,
   Typography as Typography8,
@@ -2045,7 +2159,7 @@ import {
   Drawer,
   CssBaseline,
   IconButton as IconButton3,
-  useTheme as useTheme3,
+  useTheme as useTheme4,
   useMediaQuery
 } from "@mui/material";
 
@@ -2130,7 +2244,7 @@ import MenuIcon from "@mui/icons-material/Menu";
 import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
 
 // src/components/SideMenu.tsx
-import { List, ListItem, ListItemButton, ListItemIcon, ListItemText, Divider, Box as Box7, Typography as Typography7, Collapse } from "@mui/material";
+import { List, ListItem, ListItemButton, ListItemIcon, ListItemText, Divider, Box as Box9, Typography as Typography7, Collapse } from "@mui/material";
 import ExpandLess from "@mui/icons-material/ExpandLess";
 import ExpandMore from "@mui/icons-material/ExpandMore";
 import TableChartIcon from "@mui/icons-material/TableChart";
@@ -2145,30 +2259,30 @@ import { useNavigate as useNavigate2, useLocation } from "react-router-dom";
 import { blue, orange, teal, red, grey } from "@mui/material/colors";
 
 // src/pages/WScreens.tsx
-import { Box as Box6, Typography as Typography6, Paper } from "@mui/material";
+import { Box as Box8, Typography as Typography6, Paper } from "@mui/material";
 import ConstructionIcon from "@mui/icons-material/Construction";
 import WarningAmberIcon2 from "@mui/icons-material/WarningAmber";
-import { jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
 var MyCustomDashboard = ({ screenName }) => {
-  return /* @__PURE__ */ jsx14(Box6, { sx: { p: 4, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", height: "100%" }, children: /* @__PURE__ */ jsxs5(Paper, { elevation: 3, sx: { p: 4, textAlign: "center", maxWidth: 600 }, children: [
-    /* @__PURE__ */ jsxs5(Typography6, { variant: "h5", component: "h1", gutterBottom: true, children: [
+  return /* @__PURE__ */ jsx14(Box8, { sx: { p: 4, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", height: "100%" }, children: /* @__PURE__ */ jsxs6(Paper, { elevation: 3, sx: { p: 4, textAlign: "center", maxWidth: 600 }, children: [
+    /* @__PURE__ */ jsxs6(Typography6, { variant: "h5", component: "h1", gutterBottom: true, children: [
       "\xA1Bienvenido a tu WScreen: ",
       screenName,
       "!"
     ] }),
     /* @__PURE__ */ jsx14(Typography6, { variant: "body1", color: "text.secondary", children: "Esta es una pantalla de interfaz de usuario personalizada." }),
-    /* @__PURE__ */ jsx14(Box6, { sx: { mt: 3 }, children: /* @__PURE__ */ jsx14(ConstructionIcon, { sx: { fontSize: 80, color: "primary.main" } }) })
+    /* @__PURE__ */ jsx14(Box8, { sx: { mt: 3 }, children: /* @__PURE__ */ jsx14(ConstructionIcon, { sx: { fontSize: 80, color: "primary.main" } }) })
   ] }) });
 };
 var FallbackWScreen = ({ screenName }) => {
-  return /* @__PURE__ */ jsx14(Box6, { sx: { p: 4, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", height: "100%" }, children: /* @__PURE__ */ jsxs5(Paper, { elevation: 3, sx: { p: 4, textAlign: "center", maxWidth: 600, backgroundColor: "warning.light", border: "1px solid orange" }, children: [
+  return /* @__PURE__ */ jsx14(Box8, { sx: { p: 4, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", height: "100%" }, children: /* @__PURE__ */ jsxs6(Paper, { elevation: 3, sx: { p: 4, textAlign: "center", maxWidth: 600, backgroundColor: "warning.light", border: "1px solid orange" }, children: [
     /* @__PURE__ */ jsx14(Typography6, { variant: "h5", component: "h1", gutterBottom: true, color: "warning.dark", children: "WScreen No Implementada" }),
-    /* @__PURE__ */ jsxs5(Typography6, { variant: "body1", color: "warning.dark", children: [
+    /* @__PURE__ */ jsxs6(Typography6, { variant: "body1", color: "warning.dark", children: [
       'No se encontr\xF3 un componente implementado para la **WScreen**: **`"$',
       screenName,
       '"`**. Por favor, verifica el `menuType` en la definici\xF3n del men\xFA o aseg\xFArate de que el componente est\xE9 correctamente importado y mapeado en el frontend.'
     ] }),
-    /* @__PURE__ */ jsx14(Box6, { sx: { mt: 3 }, children: /* @__PURE__ */ jsx14(WarningAmberIcon2, { sx: { fontSize: 80, color: "warning.dark" } }) })
+    /* @__PURE__ */ jsx14(Box8, { sx: { mt: 3 }, children: /* @__PURE__ */ jsx14(WarningAmberIcon2, { sx: { fontSize: 80, color: "warning.dark" } }) })
   ] }) });
 };
 var wScreens = {
@@ -2179,7 +2293,7 @@ var wScreens = {
 var WScreens_default = FallbackWScreen;
 
 // src/components/SideMenu.tsx
-import { Fragment, jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
 var MenuListItem = ({ item, level, onMenuItemClick }) => {
   const navigate = useNavigate2();
   const location = useLocation();
@@ -2242,8 +2356,8 @@ var MenuListItem = ({ item, level, onMenuItemClick }) => {
   } else {
     isSelected = currentPath.startsWith(`/wScreens/${item.menuType}`) || currentPath.startsWith(`/wScreens-fallback/${item.menuType}`);
   }
-  return /* @__PURE__ */ jsxs6(Fragment, { children: [
-    /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(Fragment, { children: [
+    /* @__PURE__ */ jsxs7(
       ListItemButton,
       {
         onClick: handleClick,
@@ -2286,17 +2400,17 @@ var SideMenu = ({ onMenuItemClick }) => {
     dispatch(setAllSubMenusOpen(!isMostlyOpen));
   };
   if (!clientContext || !clientContext.menu) {
-    return /* @__PURE__ */ jsx15(Box7, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx15(Typography7, { variant: "body2", color: "text.secondary", children: "Cargando men\xFA..." }) });
+    return /* @__PURE__ */ jsx15(Box9, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx15(Typography7, { variant: "body2", color: "text.secondary", children: "Cargando men\xFA..." }) });
   }
   const isHomeSelected = location.pathname === "/home";
-  return /* @__PURE__ */ jsxs6(Box7, { sx: { width: "100%", flexShrink: 0 }, children: [
-    clientContext.menu.some((item) => item.menuType === "menu") && /* @__PURE__ */ jsx15(ListItem, { disablePadding: true, children: /* @__PURE__ */ jsxs6(ListItemButton, { onClick: handleToggleAllSubMenus, children: [
+  return /* @__PURE__ */ jsxs7(Box9, { sx: { width: "100%", flexShrink: 0 }, children: [
+    clientContext.menu.some((item) => item.menuType === "menu") && /* @__PURE__ */ jsx15(ListItem, { disablePadding: true, children: /* @__PURE__ */ jsxs7(ListItemButton, { onClick: handleToggleAllSubMenus, children: [
       /* @__PURE__ */ jsx15(ListItemIcon, { sx: { minWidth: "38px" }, children: isMostlyOpen ? /* @__PURE__ */ jsx15(UnfoldLessIcon, {}) : /* @__PURE__ */ jsx15(UnfoldMoreIcon, {}) }),
       /* @__PURE__ */ jsx15(ListItemText, { primary: isMostlyOpen ? "colapsar " : "expandir" })
     ] }) }),
     /* @__PURE__ */ jsx15(Divider, {}),
-    /* @__PURE__ */ jsxs6(List, { children: [
-      /* @__PURE__ */ jsx15(ListItem, { disablePadding: true, children: /* @__PURE__ */ jsxs6(ListItemButton, { onClick: handleHomeClick, selected: isHomeSelected, children: [
+    /* @__PURE__ */ jsxs7(List, { children: [
+      /* @__PURE__ */ jsx15(ListItem, { disablePadding: true, children: /* @__PURE__ */ jsxs7(ListItemButton, { onClick: handleHomeClick, selected: isHomeSelected, children: [
         /* @__PURE__ */ jsx15(ListItemIcon, { sx: { minWidth: "38px" }, children: /* @__PURE__ */ jsx15(HomeIcon, {}) }),
         /* @__PURE__ */ jsx15(ListItemText, { primary: "Inicio" })
       ] }) }),
@@ -2344,14 +2458,14 @@ var useLogout = () => {
 var useLogout_default = useLogout;
 
 // src/components/MainLayout.tsx
-import { jsx as jsx16, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
 var drawerWidth = 240;
 var MainLayout = () => {
   const { clientContext } = useApp();
   const logout = useLogout_default();
   const isDrawerOpen = useIsDrawerOpen();
   const dispatch = useAppDispatch();
-  const theme = useTheme3();
+  const theme = useTheme4();
   const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
   useEffect3(() => {
     if (isMobile && isDrawerOpen) {
@@ -2367,10 +2481,10 @@ var MainLayout = () => {
     }
   };
   if (!clientContext) {
-    return /* @__PURE__ */ jsx16(Box8, { sx: { display: "flex", justifyContent: "center", alignItems: "center", height: "100vh" }, children: /* @__PURE__ */ jsx16(Typography8, { children: "Cargando dise\xF1o de la aplicaci\xF3n..." }) });
+    return /* @__PURE__ */ jsx16(Box10, { sx: { display: "flex", justifyContent: "center", alignItems: "center", height: "100vh" }, children: /* @__PURE__ */ jsx16(Typography8, { children: "Cargando dise\xF1o de la aplicaci\xF3n..." }) });
   }
   const appBarOffset = theme.mixins.toolbar;
-  return /* @__PURE__ */ jsxs7(Box8, { sx: { display: "flex", height: "100vh" }, children: [
+  return /* @__PURE__ */ jsxs8(Box10, { sx: { display: "flex", height: "100vh" }, children: [
     /* @__PURE__ */ jsx16(CssBaseline, {}),
     /* @__PURE__ */ jsx16(
       AppBar,
@@ -2391,7 +2505,7 @@ var MainLayout = () => {
             })
           }
         },
-        children: /* @__PURE__ */ jsxs7(Toolbar, { children: [
+        children: /* @__PURE__ */ jsxs8(Toolbar, { children: [
           /* @__PURE__ */ jsx16(
             IconButton3,
             {
@@ -2419,7 +2533,7 @@ var MainLayout = () => {
         ] })
       }
     ),
-    /* @__PURE__ */ jsxs7(
+    /* @__PURE__ */ jsxs8(
       Drawer,
       {
         variant: "persistent",
@@ -2455,7 +2569,7 @@ var MainLayout = () => {
       }
     ),
     /* @__PURE__ */ jsx16(
-      Box8,
+      Box10,
       {
         component: "main",
         sx: {
@@ -2490,9 +2604,9 @@ var MainLayout = () => {
 var MainLayout_default = MainLayout;
 
 // src/components/SessionExpiredMessage.tsx
-import { Box as Box9, Typography as Typography9, Button as Button5, Modal } from "@mui/material";
+import { Box as Box11, Typography as Typography9, Button as Button5, Modal } from "@mui/material";
 import { useNavigate as useNavigate4 } from "react-router-dom";
-import { jsx as jsx17, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
 var style = {
   position: "absolute",
   top: "50%",
@@ -2534,7 +2648,7 @@ var SessionExpiredMessage = () => {
           }
         }
       },
-      children: /* @__PURE__ */ jsxs8(Box9, { sx: style, children: [
+      children: /* @__PURE__ */ jsxs9(Box11, { sx: style, children: [
         /* @__PURE__ */ jsx17(Typography9, { id: "session-expired-modal-title", variant: "h6", component: "h2", gutterBottom: true, children: "\xA1Sesi\xF3n Expirada!" }),
         /* @__PURE__ */ jsx17(Typography9, { id: "session-expired-modal-description", sx: { mt: 2, mb: 3 }, children: "Tu sesi\xF3n ha expirado por inactividad o por seguridad. Por favor, inicia sesi\xF3n de nuevo." }),
         /* @__PURE__ */ jsx17(Button5, { variant: "contained", color: "primary", onClick: handleClose, children: "Ir al Login" })
@@ -2545,11 +2659,11 @@ var SessionExpiredMessage = () => {
 var SessionExpiredMessage_default = SessionExpiredMessage;
 
 // src/pages/HomePage.tsx
-import { Box as Box10, Typography as Typography10 } from "@mui/material";
-import { jsx as jsx18, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Box as Box12, Typography as Typography10 } from "@mui/material";
+import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
 var HomePage = () => {
   const { clientContext } = useApp();
-  return /* @__PURE__ */ jsxs9(Box10, { sx: { p: 3 }, children: [
+  return /* @__PURE__ */ jsxs10(Box12, { sx: { p: 3 }, children: [
     /* @__PURE__ */ jsx18(Typography10, { variant: "h4", component: "h1", gutterBottom: true, children: `Bienvenido/a ${clientContext?.username}` }),
     /* @__PURE__ */ jsx18(Typography10, { variant: "body1", children: "Usa el men\xFA lateral para navegar por las diferentes secciones." })
   ] });
@@ -2558,14 +2672,14 @@ var HomePage_default = HomePage;
 
 // src/pages/LogoutPage.tsx
 import { useEffect as useEffect4 } from "react";
-import { Box as Box11, Typography as Typography11, CircularProgress as CircularProgress2 } from "@mui/material";
-import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Box as Box13, Typography as Typography11, CircularProgress as CircularProgress2 } from "@mui/material";
+import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
 var LogoutPage = () => {
   const logout = useLogout_default();
   useEffect4(() => {
     logout();
   }, [logout]);
-  return /* @__PURE__ */ jsxs10(Box11, { sx: {
+  return /* @__PURE__ */ jsxs11(Box13, { sx: {
     display: "flex",
     flexDirection: "column",
     justifyContent: "center",
@@ -2581,13 +2695,13 @@ var LogoutPage_default = LogoutPage;
 
 // src/pages/LoginPage.tsx
 import { useState as useState6 } from "react";
-import { Button as Button6, TextField, Typography as Typography12, Alert as Alert2, AlertTitle, Box as Box12, CircularProgress as CircularProgress3 } from "@mui/material";
+import { Button as Button6, TextField, Typography as Typography12, Alert as Alert2, AlertTitle, Box as Box14, CircularProgress as CircularProgress3 } from "@mui/material";
 import { useForm, Controller } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import * as z from "zod";
 import { useNavigate as useNavigate5 } from "react-router-dom";
 import { useDispatch as useDispatch4 } from "react-redux";
-import { Fragment as Fragment2, jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
 var loginSchema = z.object({
   username: z.string().min(1, "El usuario es requerido"),
   // Añadir validación básica
@@ -2644,15 +2758,15 @@ var LoginPage = () => {
     }
   };
   return /* @__PURE__ */ jsx20(
-    Box12,
+    Box14,
     {
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
       minHeight: "100vh",
       bgcolor: "#f5f5f5",
-      children: /* @__PURE__ */ jsxs11(
-        Box12,
+      children: /* @__PURE__ */ jsxs12(
+        Box14,
         {
           width: "100%",
           maxWidth: "400px",
@@ -2662,8 +2776,8 @@ var LoginPage = () => {
           boxShadow: 3,
           children: [
             /* @__PURE__ */ jsx20(Typography12, { variant: "h5", align: "center", gutterBottom: true, children: "Iniciar Sesi\xF3n" }),
-            /* @__PURE__ */ jsxs11("form", { onSubmit: handleSubmit(onSubmit), className: "space-y-4", children: [
-              /* @__PURE__ */ jsxs11("div", { children: [
+            /* @__PURE__ */ jsxs12("form", { onSubmit: handleSubmit(onSubmit), className: "space-y-4", children: [
+              /* @__PURE__ */ jsxs12("div", { children: [
                 /* @__PURE__ */ jsx20("label", { htmlFor: "username", children: /* @__PURE__ */ jsx20(Typography12, { variant: "subtitle1", component: "div", sx: { fontWeight: "medium" }, children: "Usuario" }) }),
                 /* @__PURE__ */ jsx20(
                   Controller,
@@ -2686,7 +2800,7 @@ var LoginPage = () => {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs11("div", { children: [
+              /* @__PURE__ */ jsxs12("div", { children: [
                 /* @__PURE__ */ jsx20("label", { htmlFor: "password", children: /* @__PURE__ */ jsx20(Typography12, { variant: "subtitle1", component: "div", sx: { fontWeight: "medium" }, children: "Contrase\xF1a" }) }),
                 /* @__PURE__ */ jsx20(
                   Controller,
@@ -2709,12 +2823,12 @@ var LoginPage = () => {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsx20(Button6, { type: "submit", fullWidth: true, variant: "contained", color: "primary", disabled: isSubmitting, sx: { mt: 2 }, children: isSubmitting ? /* @__PURE__ */ jsxs11(Fragment2, { children: [
+              /* @__PURE__ */ jsx20(Button6, { type: "submit", fullWidth: true, variant: "contained", color: "primary", disabled: isSubmitting, sx: { mt: 2 }, children: isSubmitting ? /* @__PURE__ */ jsxs12(Fragment2, { children: [
                 /* @__PURE__ */ jsx20(CircularProgress3, { size: 20, sx: { mr: 1 } }),
                 "Iniciando sesi\xF3n..."
               ] }) : "Iniciar Sesi\xF3n" })
             ] }),
-            loginError && /* @__PURE__ */ jsxs11(Alert2, { severity: "error", sx: { mt: 2, maxHeight: "200px" }, children: [
+            loginError && /* @__PURE__ */ jsxs12(Alert2, { severity: "error", sx: { mt: 2, maxHeight: "200px" }, children: [
               " ",
               /* @__PURE__ */ jsx20(AlertTitle, { children: "Error" }),
               loginError
@@ -2741,7 +2855,7 @@ import {
   FormControlLabel,
   FormHelperText,
   Typography as Typography14,
-  Box as Box14,
+  Box as Box16,
   CircularProgress as CircularProgress4,
   Alert as Alert3,
   Divider as Divider2,
@@ -2749,13 +2863,13 @@ import {
 } from "@mui/material";
 
 // src/pages/procedure-results/SuccessDisplay.tsx
-import { Box as Box13, Typography as Typography13, Paper as Paper2 } from "@mui/material";
-import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Box as Box15, Typography as Typography13, Paper as Paper2 } from "@mui/material";
+import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
 var SuccessDisplay = ({ data }) => {
-  return /* @__PURE__ */ jsxs12(Paper2, { elevation: 2, sx: { p: 2, mt: 2, bgcolor: "success.light", color: "success.contrastText" }, children: [
+  return /* @__PURE__ */ jsxs13(Paper2, { elevation: 2, sx: { p: 2, mt: 2, bgcolor: "success.light", color: "success.contrastText" }, children: [
     /* @__PURE__ */ jsx21(Typography13, { variant: "h6", sx: { fontSize: "1rem", mb: 1 }, children: "\xA1Operaci\xF3n Exitosa!" }),
     /* @__PURE__ */ jsx21(Typography13, { variant: "body2", sx: { fontSize: "0.85rem" }, children: "Detalles del resultado:" }),
-    /* @__PURE__ */ jsx21(Box13, { sx: { bgcolor: "success.dark", p: 1, borderRadius: 1, mt: 1, overflowX: "auto" }, children: /* @__PURE__ */ jsx21("pre", { style: { margin: 0, fontSize: "0.75rem", color: "white" }, children: JSON.stringify(data, null, 2) }) }),
+    /* @__PURE__ */ jsx21(Box15, { sx: { bgcolor: "success.dark", p: 1, borderRadius: 1, mt: 1, overflowX: "auto" }, children: /* @__PURE__ */ jsx21("pre", { style: { margin: 0, fontSize: "0.75rem", color: "white" }, children: JSON.stringify(data, null, 2) }) }),
     /* @__PURE__ */ jsx21(Typography13, { variant: "body2", sx: { fontSize: "0.8rem", mt: 1 }, children: "Puedes revisar los detalles anteriores o cerrar este mensaje." })
   ] });
 };
@@ -2770,7 +2884,7 @@ var extendResultsOk = (newComponents) => {
 };
 
 // src/components/ProcedureForm.tsx
-import { jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
 var ProcedureForm = () => {
   const { procedureName } = useParams();
   const { clientContext } = useApp();
@@ -2985,9 +3099,9 @@ var ProcedureForm = () => {
       sx: { fontSize: "0.8rem" }
     };
     if (param.options && param.options.length > 0) {
-      return /* @__PURE__ */ jsxs13(FormControl, { fullWidth: true, margin: "dense", size: "small", error: hasError, required: commonProps.required, children: [
+      return /* @__PURE__ */ jsxs14(FormControl, { fullWidth: true, margin: "dense", size: "small", error: hasError, required: commonProps.required, children: [
         /* @__PURE__ */ jsx22(InputLabel, { id: `${param.name}-label`, sx: { fontSize: "0.8rem" }, children: param.label || param.name }),
-        /* @__PURE__ */ jsxs13(
+        /* @__PURE__ */ jsxs14(
           Select,
           {
             labelId: `${param.name}-label`,
@@ -3048,7 +3162,7 @@ var ProcedureForm = () => {
       case "jsona":
         return /* @__PURE__ */ jsx22(TextField2, { multiline: true, rows: 5, value: formValues[param.name] || "", ...commonProps, InputProps: { sx: { fontSize: "0.8rem" } } });
       case "bytea":
-        return /* @__PURE__ */ jsxs13(FormControl, { fullWidth: true, margin: "dense", error: hasError, required: commonProps.required, children: [
+        return /* @__PURE__ */ jsxs14(FormControl, { fullWidth: true, margin: "dense", error: hasError, required: commonProps.required, children: [
           /* @__PURE__ */ jsx22(Typography14, { variant: "body2", color: "textSecondary", component: "label", htmlFor: param.name, sx: { fontSize: "0.8rem", color: hasError ? "error.main" : "text.secondary" }, children: param.label || param.name }),
           /* @__PURE__ */ jsx22(
             "input",
@@ -3076,13 +3190,13 @@ var ProcedureForm = () => {
     if (ComponentToRender) {
       return /* @__PURE__ */ jsx22(ComponentToRender, { data: procedureResultData });
     } else {
-      return /* @__PURE__ */ jsxs13(Paper3, { elevation: 2, sx: { p: 2, mt: 0, bgcolor: "warning.light" }, children: [
-        /* @__PURE__ */ jsxs13(Typography14, { variant: "h6", sx: { fontSize: "1rem", mb: 1 }, children: [
+      return /* @__PURE__ */ jsxs14(Paper3, { elevation: 2, sx: { p: 2, mt: 0, bgcolor: "warning.light" }, children: [
+        /* @__PURE__ */ jsxs14(Typography14, { variant: "h6", sx: { fontSize: "1rem", mb: 1 }, children: [
           "el componente para resolver el resultOk: '",
           procedure.resultOk,
           "' definido en el procedure no existe o no est\xE1 mapeado."
         ] }),
-        /* @__PURE__ */ jsx22(Box14, { sx: {
+        /* @__PURE__ */ jsx22(Box16, { sx: {
           bgcolor: "warning.dark",
           p: 1,
           borderRadius: 1
@@ -3091,7 +3205,7 @@ var ProcedureForm = () => {
     }
   }, [procedureResultData, procedure]);
   if (!procedure) {
-    return /* @__PURE__ */ jsxs13(Box14, { sx: {
+    return /* @__PURE__ */ jsxs14(Box16, { sx: {
       p: 2,
       width: "100%",
       boxSizing: "border-box",
@@ -3107,7 +3221,7 @@ var ProcedureForm = () => {
   }
   return (
     // Esta es la Box más externa que ahora controlará el scroll
-    /* @__PURE__ */ jsxs13(Box14, { sx: {
+    /* @__PURE__ */ jsxs14(Box16, { sx: {
       p: 2,
       ml: 1,
       mt: 2,
@@ -3125,13 +3239,13 @@ var ProcedureForm = () => {
       // Oculta el scroll horizontal si no es necesario para el contenedor principal
     }, children: [
       /* @__PURE__ */ jsx22(Typography14, { variant: "h5", component: "h2", gutterBottom: true, align: "left", children: cambiarGuionesBajosPorEspacios(procedure.proceedLabel || procedure.action) }),
-      Object.values(validationErrors).some((err) => err !== null) && /* @__PURE__ */ jsxs13(Alert3, { severity: "error", sx: { mb: 2, fontSize: "0.8rem" }, children: [
+      Object.values(validationErrors).some((err) => err !== null) && /* @__PURE__ */ jsxs14(Alert3, { severity: "error", sx: { mb: 2, fontSize: "0.8rem" }, children: [
         "Por favor, corrige los errores en el formulario antes de enviar.",
         /* @__PURE__ */ jsx22("ul", { children: Object.values(validationErrors).map((err, idx) => err && /* @__PURE__ */ jsx22("li", { children: err }, idx)) })
       ] }),
       !Object.values(validationErrors).some((err) => err !== null) && apiError && /* @__PURE__ */ jsx22(Alert3, { severity: "error", sx: { mb: 2, fontSize: "0.8rem" }, children: apiError.message }),
       !Object.values(validationErrors).some((err) => err !== null) && !apiError && successMessage && /* @__PURE__ */ jsx22(Alert3, { severity: "success", sx: { mb: 2, fontSize: "0.8rem" }, children: successMessage }),
-      /* @__PURE__ */ jsxs13("form", { onSubmit: handleSubmit, children: [
+      /* @__PURE__ */ jsxs14("form", { onSubmit: handleSubmit, children: [
         procedure.parameters.map((param) => /* @__PURE__ */ jsx22("div", { children: renderInputField(param) }, param.name)),
         /* @__PURE__ */ jsx22(
           Button7,
@@ -3147,15 +3261,15 @@ var ProcedureForm = () => {
           }
         )
       ] }),
-      ResultDisplayContent && /* @__PURE__ */ jsxs13(Box14, { sx: { mt: 2 }, children: [
+      ResultDisplayContent && /* @__PURE__ */ jsxs14(Box16, { sx: { mt: 2 }, children: [
         " ",
         ResultDisplayContent
       ] }),
-      executionLog.length > 0 && /* @__PURE__ */ jsxs13(Box14, { sx: { mt: 3 }, children: [
+      executionLog.length > 0 && /* @__PURE__ */ jsxs14(Box16, { sx: { mt: 3 }, children: [
         /* @__PURE__ */ jsx22(Divider2, { sx: { mb: 2 } }),
         /* @__PURE__ */ jsx22(Typography14, { variant: "h6", gutterBottom: true, sx: { fontSize: "0.9rem" }, children: "Registro de Ejecuci\xF3n" }),
         /* @__PURE__ */ jsx22(
-          Box14,
+          Box16,
           {
             sx: {
               bgcolor: "grey.100",
@@ -3261,12 +3375,12 @@ var InitialRedirectHandler_default = InitialRedirectHandler;
 
 // src/pages/GenericDataGridPage.tsx
 import { useParams as useParams2 } from "react-router-dom";
-import { Box as Box15, Alert as Alert4, Typography as Typography15 } from "@mui/material";
-import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Box as Box17, Alert as Alert4, Typography as Typography15 } from "@mui/material";
+import { jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
 var GenericDataGridPage = () => {
   const { tableName } = useParams2();
   if (!tableName) {
-    return /* @__PURE__ */ jsx24(Box15, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsxs14(Alert4, { severity: "error", children: [
+    return /* @__PURE__ */ jsx24(Box17, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsxs15(Alert4, { severity: "error", children: [
       /* @__PURE__ */ jsx24(Typography15, { variant: "h6", children: "Error: Nombre de tabla no especificado en la URL." }),
       /* @__PURE__ */ jsx24(Typography15, { variant: "body1", children: "Por favor, aseg\xFArate de que la URL contenga el nombre de la tabla (ej. `/data/users`)." })
     ] }) });
@@ -3278,8 +3392,8 @@ var GenericDataGridPage_default = GenericDataGridPage;
 // src/pages/MenuTablePage.tsx
 import { useMemo as useMemo5 } from "react";
 import { useParams as useParams3 } from "react-router-dom";
-import { Box as Box16, Alert as Alert5, Typography as Typography16 } from "@mui/material";
-import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Box as Box18, Alert as Alert5, Typography as Typography16 } from "@mui/material";
+import { jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
 var MenuTablePage = () => {
   const { menuName } = useParams3();
   const { clientContext } = useApp();
@@ -3321,7 +3435,7 @@ var MenuTablePage = () => {
     };
   }, [menuName, clientContext]);
   if (!currentTableName) {
-    return /* @__PURE__ */ jsx25(Box16, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsxs15(Alert5, { severity: "error", children: [
+    return /* @__PURE__ */ jsx25(Box18, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: "200px", children: /* @__PURE__ */ jsxs16(Alert5, { severity: "error", children: [
       /* @__PURE__ */ jsx25(Typography16, { variant: "h6", children: "Error: No se pudo cargar la informaci\xF3n de la tabla." }),
       /* @__PURE__ */ jsx25(Typography16, { variant: "body1", children: "Verifique la configuraci\xF3n del men\xFA o el nombre de la tabla en la URL." })
     ] }) });
@@ -3337,7 +3451,7 @@ var MenuTablePage = () => {
 var MenuTablePage_default = MenuTablePage;
 
 // src/App.tsx
-import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
 var LocationTracker = () => {
   const location = useLocation4();
   const dispatch = useAppDispatch();
@@ -3348,10 +3462,10 @@ var LocationTracker = () => {
 };
 function FrontendPlusReactRoutes({ myRoutes, myWScreens }) {
   const allWScreens = { ...wScreens, ...myWScreens || {} };
-  return /* @__PURE__ */ jsxs16(Routes, { children: [
+  return /* @__PURE__ */ jsxs17(Routes, { children: [
     /* @__PURE__ */ jsx26(Route, { path: "/login", element: /* @__PURE__ */ jsx26(LoginPage_default, {}) }),
     /* @__PURE__ */ jsx26(Route, { path: "/logout", element: /* @__PURE__ */ jsx26(LogoutPage_default, {}) }),
-    /* @__PURE__ */ jsxs16(Route, { element: /* @__PURE__ */ jsxs16(PrivateRoute_default, { children: [
+    /* @__PURE__ */ jsxs17(Route, { element: /* @__PURE__ */ jsxs17(PrivateRoute_default, { children: [
       /* @__PURE__ */ jsx26(InitialRedirectHandler_default, {}),
       /* @__PURE__ */ jsx26(MainLayout_default, {})
     ] }), children: [
@@ -3395,9 +3509,9 @@ var App = ({
       extendResultsOk(myResultsOk);
     }
   }, [myClientSides, myResultsOk]);
-  return /* @__PURE__ */ jsx26(Provider, { store, children: /* @__PURE__ */ jsx26(PersistGate, { loading: null, persistor, children: /* @__PURE__ */ jsxs16(BrowserRouter, { children: [
+  return /* @__PURE__ */ jsx26(Provider, { store, children: /* @__PURE__ */ jsx26(PersistGate, { loading: null, persistor, children: /* @__PURE__ */ jsxs17(BrowserRouter, { children: [
     /* @__PURE__ */ jsx26(LocationTracker, {}),
-    /* @__PURE__ */ jsx26(AppProvider, { children: /* @__PURE__ */ jsxs16(SnackbarProvider, { children: [
+    /* @__PURE__ */ jsx26(AppProvider, { children: /* @__PURE__ */ jsxs17(SnackbarProvider, { children: [
       /* @__PURE__ */ jsx26(
         FrontendPlusReactRoutes,
         {