@acvl/frontend-components 0.0.24 → 0.0.25

package/dist/esm/index.js

@@ -25644,9 +25644,9 @@ dayjs.locale(es);
 dayjs.extend(duration);
 
 // ==============================|| JSON ||============================== //
-const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, data, props, formType }) => {
+const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, data, props, formType, }) => {
     const ignore = get$1(props, `${base_key}.ignore`, false);
-    if (ignore || ['obj_permissions', 'has_history'].includes(base_key))
+    if (ignore || ["obj_permissions", "has_history"].includes(base_key))
         return;
     const altered_key = invoke(props, `${base_key}.alter_key`, base_key);
     const key = altered_key || base_key;
@@ -25664,7 +25664,7 @@ const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, dat
         case "string":
             if (invoke(props, `${base_key}.extra_validation`, object))
                 return;
-            setValue(response, key, isEmpty(object) ? '' : object);
+            setValue(response, key, isEmpty(object) ? "" : object);
             break;
         case "number":
             setValue(response, key, object);
@@ -25674,28 +25674,37 @@ const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, dat
             break;
         case "object":
             if (isNull(object) || isEmpty(object)) {
-                if (includes(key, 'after') || includes(key, 'before'))
-                    setValue(response, key, '');
+                if (includes(key, "after") || includes(key, "before"))
+                    setValue(response, key, "");
                 else
                     setValue(response, key, object);
             }
+            else if (object instanceof File) {
+                setValue(response, key, object);
+            }
             else if (object instanceof dayjs) {
-                setValue(response, key, object.format(get$1(props, `${key}.format`, 'YYYY-MM-DD')));
+                setValue(response, key, object.format(get$1(props, `${key}.format`, "YYYY-MM-DD")));
             }
-            else if ('label' in object && 'value' in object) {
+            else if ("label" in object && "value" in object) {
                 if (useLabel)
-                    setValue(response, key, object['label']);
+                    setValue(response, key, object["label"]);
                 else
-                    setValue(response, key, object['value']);
+                    setValue(response, key, object["value"]);
             }
-            else if (Array.isArray(object)) { // it is an array
-                if (object.length && typeof object[0] == 'object' && !Array.isArray(object[0]) && 'value' in object[0] && object[0]['value'] == 'all') { // for data grid filters
-                    setValue(response, key, '');
+            else if (Array.isArray(object)) {
+                // it is an array
+                if (object.length &&
+                    typeof object[0] == "object" &&
+                    !Array.isArray(object[0]) &&
+                    "value" in object[0] &&
+                    object[0]["value"] == "all") {
+                    // for data grid filters
+                    setValue(response, key, "");
                 }
                 else {
                     forEach(object, (arrayItem, idx) => {
-                        if (typeof arrayItem == 'object') {
-                            if ('label' in arrayItem) {
+                        if (typeof arrayItem == "object") {
+                            if ("label" in arrayItem) {
                                 setValue(response, `${key}.${idx}`, function (item) {
                                     if (useLabel)
                                         return item.label;
@@ -25703,7 +25712,16 @@ const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, dat
                                         return item.value;
                                 });
                             }
-                            typeSwitch({ base_object: arrayItem, base_key: `${key}.${idx}`, response: response, useLabel: useLabel, data: data, submitData: submitData, props: props, formType: formType });
+                            typeSwitch({
+                                base_object: arrayItem,
+                                base_key: `${key}.${idx}`,
+                                response: response,
+                                useLabel: useLabel,
+                                data: data,
+                                submitData: submitData,
+                                props: props,
+                                formType: formType,
+                            });
                         }
                         else {
                             const keyArray = get$1(response, key);
@@ -25720,9 +25738,19 @@ const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, dat
             }
             else {
                 forEach(object, (value, key2) => {
-                    if (!includes(['id', 'transporte.tarifa.cargos_adicionales'], key) && isEqual(get$1(data, `${key}.${key2}`), value))
+                    if (!includes(["id", "transporte.tarifa.cargos_adicionales"], key) &&
+                        isEqual(get$1(data, `${key}.${key2}`), value))
                         return;
-                    typeSwitch({ base_object: value, base_key: `${key}.${key2}`, response: response, useLabel: useLabel, data: data, submitData: submitData, props: props, formType: formType });
+                    typeSwitch({
+                        base_object: value,
+                        base_key: `${key}.${key2}`,
+                        response: response,
+                        useLabel: useLabel,
+                        data: data,
+                        submitData: submitData,
+                        props: props,
+                        formType: formType,
+                    });
                 });
             }
             break;
@@ -25734,7 +25762,7 @@ const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, dat
 const jsonForm = ({ submitData, data, useLabel, props }) => {
     const response = {};
     forEach(submitData, function (value, key) {
-        if (key != 'id' && isEqual(get$1(data, key), value))
+        if (key != "id" && isEqual(get$1(data, key), value))
             return;
         typeSwitch({
             base_object: value,
@@ -25744,7 +25772,7 @@ const jsonForm = ({ submitData, data, useLabel, props }) => {
             data: data,
             props: props,
             submitData: submitData,
-            formType: 'json',
+            formType: "json",
         });
     });
     return response;
@@ -25752,7 +25780,7 @@ const jsonForm = ({ submitData, data, useLabel, props }) => {
 const formDataForm = ({ submitData, data, useLabel, props }) => {
     const formData = new FormData();
     forEach(submitData, function (value, key) {
-        if (key != 'id' && isEqual(get$1(data, key), value))
+        if (key != "id" && isEqual(get$1(data, key), value))
             return;
         typeSwitch({
             base_object: value,
@@ -25762,16 +25790,16 @@ const formDataForm = ({ submitData, data, useLabel, props }) => {
             data: data,
             props: props,
             submitData: submitData,
-            formType: 'formData',
+            formType: "formData",
         });
     });
     return formData;
 };
 // ==============================|| ERRORS ||============================== //
 const setErrors = (form, error) => {
-    if ('invalid_params' in error.data) {
+    if ("invalid_params" in error.data) {
         Object.values(error.data.invalid_params).forEach((entry) => {
-            form.setError(entry.name, { message: entry.reason.join(', ') });
+            form.setError(entry.name, { message: entry.reason.join(", ") });
         });
     }
 };
@@ -25914,14 +25942,14 @@ const FileBox = (props) => {
     return (jsxs(Box, { bgcolor: grey[200], borderRadius: '12px', p: 2, display: 'flex', children: [jsx(Box, { flexGrow: 0.8, display: 'flex', justifyContent: 'left', alignItems: 'center', children: jsx(Typography$1, { fontWeight: 'bold', children: props.file.name.split('.')[0] }) }), jsx(Box, { flexGrow: 0.2, display: 'flex', justifyContent: 'right', alignItems: 'center', children: props.loadingRemove ? (jsx(CircularProgress, { size: '18px' })) : (jsx(Tooltip, { title: 'Remove', children: jsx(IconButton, { color: 'error', sx: { p: 0 }, onClick: props.handleRemove, children: jsx(DeleteIcon, {}) }) })) })] }));
 };
 
-const VisuallyHiddenInput = styled$1('input')({
-    clipPath: 'inset(50%)',
+const VisuallyHiddenInput = styled$1("input")({
+    clipPath: "inset(50%)",
     height: 1,
-    overflow: 'hidden',
-    position: 'absolute',
+    overflow: "hidden",
+    position: "absolute",
     bottom: 0,
     left: 0,
-    whiteSpace: 'nowrap',
+    whiteSpace: "nowrap",
     width: 1,
 });
 const FileUploadBox = (props) => {
@@ -25932,68 +25960,76 @@ const FileUploadBox = (props) => {
     const [removerCSV, { isLoading: removerLoading }] = api.useRemoverCSVMutation();
     const Dropzone = ({ onChange, value }) => {
         const onDrop = useCallback((acceptedFiles) => {
-            acceptedFiles.map(file => {
-                const data = formDataForm({ });
-                validarCSV({ endpoint: props.csvProps.endpoint || '', data: data, custom: props.csvProps.custom }).unwrap()
+            acceptedFiles.map((file) => {
+                const data = formDataForm({ submitData: { archivo: file } });
+                validarCSV({
+                    endpoint: props.csvProps.endpoint || "",
+                    data: data,
+                    custom: props.csvProps.custom,
+                })
+                    .unwrap()
                     .then((response) => {
-                    onChange('archivo' in response ? response.archivo : acceptedFiles[0]);
+                    onChange("archivo" in response ? response.archivo : acceptedFiles[0]);
                     setFile(acceptedFiles[0]);
                     props.setValid(true);
                 })
                     .catch((e) => {
-                    const columnas_inv = get(e.data, 'columnas_invalidas');
+                    const columnas_inv = get(e.data, "columnas_invalidas");
                     if (columnas_inv)
-                        notifications.show(columnas_inv, { severity: 'error' });
+                        notifications.show(columnas_inv, { severity: "error" });
                     props.setValid(false);
                 });
             });
         }, []);
         const onDropRejected = useCallback(() => {
-            notifications.show('Tipo de archivo inválido. Solo se aceptan CSVs.', { severity: 'error' });
+            notifications.show("Tipo de archivo inválido. Solo se aceptan CSVs.", {
+                severity: "error",
+            });
         }, []);
-        const { getRootProps, getInputProps, isDragActive, } = useDropzone({
+        const { getRootProps, getInputProps, isDragActive } = useDropzone({
             onDrop,
             onDropRejected,
             accept: {
-                'text/csv': ['.csv'],
-                'application/vnd.ms-excel': ['.csv'],
+                "text/csv": [".csv"],
+                "application/vnd.ms-excel": [".csv"],
             },
             maxFiles: 1,
             multiple: false,
         });
         const handleRemove = () => {
-            if (typeof value == 'number') {
+            if (typeof value == "number") {
                 removerCSV({ id: value });
             }
             onChange(null);
             setFile(null);
         };
-        return (jsx(Box$1, { width: 1, children: jsxs(Stack, { spacing: 2, children: [(!file && !isLoading) &&
-                        jsxs(Box$1, { component: 'div', width: 1, display: 'flex', justifyContent: 'center', alignItems: 'center', border: '1.5px dashed', borderRadius: '12px', py: 4, px: 2, borderColor: grey[800], bgcolor: grey[50], ...getRootProps(), children: [jsx(VisuallyHiddenInput, { id: 'file-upload', type: 'file', ...getInputProps() }), jsx(FileUploadIcon, { sx: {
-                                        color: grey[800],
-                                        pr: 1
-                                    } }), jsx(Typography, { variant: 'body2', sx: { color: grey[800] }, children: isDragActive ?
-                                        'Soltar archivo aquí.' :
-                                        'Arrastra un archivo aquí o haz clic para seleccionar uno.' })] }), isLoading &&
-                        jsx(Box$1, { children: jsx(LinearProgress, { sx: { height: 5 } }) }), file &&
-                        (jsx(FileBox, { file: file, handleRemove: handleRemove, loadingRemove: removerLoading })), error && 'data' in error && Object.keys(error.data).map((row) => {
-                        if (typeof error.data[row] == 'object') {
-                            return (jsx(RowErrors, { row: row, data: error.data }, row));
-                        }
-                        return null;
-                    })] }) }));
+        return (jsx(Box$1, { width: 1, children: jsxs(Stack, { spacing: 2, children: [!file && !isLoading && (jsxs(Box$1, { component: "div", width: 1, display: "flex", justifyContent: "center", alignItems: "center", border: "1.5px dashed", borderRadius: "12px", py: 4, px: 2, borderColor: grey[800], bgcolor: grey[50], ...getRootProps(), children: [jsx(VisuallyHiddenInput, { id: "file-upload", type: "file", ...getInputProps() }), jsx(FileUploadIcon, { sx: {
+                                    color: grey[800],
+                                    pr: 1,
+                                } }), jsx(Typography, { variant: "body2", sx: { color: grey[800] }, children: isDragActive
+                                    ? "Soltar archivo aquí."
+                                    : "Arrastra un archivo aquí o haz clic para seleccionar uno." })] })), isLoading && (jsx(Box$1, { children: jsx(LinearProgress, { sx: { height: 5 } }) })), file && (jsx(FileBox, { file: file, handleRemove: handleRemove, loadingRemove: removerLoading })), error &&
+                        "data" in error &&
+                        Object.keys(error.data).map((row) => {
+                            if (typeof error.data[row] == "object") {
+                                return jsx(RowErrors, { row: row, data: error.data }, row);
+                            }
+                            return null;
+                        })] }) }));
     };
     return (jsx(Controller, { name: props.name, control: props.control, render: ({ field: { onChange, value } }) => {
-            return (jsx(Dropzone, { onChange: onChange, value: value }));
+            return jsx(Dropzone, { onChange: onChange, value: value });
         } }));
 };
 
 const schema = z.object({
-    archivo: z.any()
+    archivo: z.any(),
 });
 const CSVUpload = (props) => {
     const api = useAPI();
     const notifications = useNotifications();
+    const { pathname } = useLocation();
+    const endpoint = props.data?.endpoint || pathname;
     const [valid, setValid] = useState(false);
     const defaultValues = {
         archivo: null,
@@ -26002,29 +26038,30 @@ const CSVUpload = (props) => {
         resolver: zodResolver(schema),
         defaultValues: defaultValues,
     });
-    const archivo = form.watch('archivo');
+    const archivo = form.watch("archivo");
     const [subirCSV, { isLoading }] = api.useSubirCSVMutation();
     const handleClose = () => {
         props.drawerToggle();
         form.reset();
     };
-    const tag = useMemo(() => props.data?.endpoint.split('/').at(-1), [props.data?.endpoint]);
+    const tag = useMemo(() => endpoint.split("/").at(-1), [endpoint]);
     const onSubmitHandler = (submitData) => {
-        const data = formDataForm(submitData);
-        subirCSV({ endpoint: props.data?.endpoint || '', tagType: tag, data: data, custom: props.data?.custom }).unwrap()
+        const data = formDataForm({ submitData });
+        subirCSV({ endpoint, tagType: tag, data, custom: props.data?.custom })
+            .unwrap()
             .then((response) => {
             if (props.postAction)
                 props.postAction(response);
             handleClose();
-            notifications.show('Archivo subido exitosamente!', { severity: 'success' });
+            notifications.show("Archivo subido exitosamente!", { severity: "success" });
         })
             .catch(() => {
-            notifications.show('Error!', { severity: 'error' });
+            notifications.show("Error!", { severity: "error" });
         });
     };
     const onError = (errors) => {
         console.log(errors);
-        notifications.show(`Error en: ${Object.keys(errors).join(', ')}!`, { severity: 'error' });
+        notifications.show(`Error en: ${Object.keys(errors).join(", ")}!`, { severity: "error" });
     };
     const handleDownload = () => {
         const link = document.createElement("a");
@@ -26032,7 +26069,7 @@ const CSVUpload = (props) => {
         link.href = `/plantillas/plantilla_${tag}.xlsx`;
         link.click();
     };
-    return (jsxs(MainDrawer, { open: props.open, drawerToggle: handleClose, title: props.data?.title || 'CSV', slots: {
+    return (jsxs(MainDrawer, { open: props.open, drawerToggle: handleClose, title: props.data?.title || "CSV", slots: {
             button: (jsx(SaveCancelButton, { slotProps: {
                     saveBtn: {
                         loading: isLoading,
@@ -26040,11 +26077,11 @@ const CSVUpload = (props) => {
                     },
                     cancelBtn: {
                         onClick: handleClose,
-                    }
-                } }))
-        }, children: [jsxs(Box, { px: 2, py: 3, bgcolor: grey[50], borderRadius: '12px', children: [jsx(Typography$1, { fontWeight: 'bold', children: "Archivo de Muestra" }), jsxs(Stack, { direction: 'row', spacing: 2, children: [jsx(Typography$1, { variant: 'body2', children: "Puede descargar el ejemplo adjunto y utilizarlo como punto de partida para su propio archivo." }), jsx(Button, { variant: 'contained', startIcon: jsx(DownloadIcon, {}), onClick: handleDownload, sx: {
-                                    minWidth: 120
-                                }, children: "Descargar" })] })] }), jsx(Box, { id: 'formulario', component: 'form', width: 1, autoComplete: "off", noValidate: true, onSubmit: form.handleSubmit(onSubmitHandler, onError), children: jsx(FileUploadBox, { name: 'archivo', control: form.control, setValid: setValid, csvProps: props.data }) })] }));
+                    },
+                } })),
+        }, children: [jsxs(Box, { px: 2, py: 3, bgcolor: grey[50], borderRadius: "12px", children: [jsx(Typography$1, { fontWeight: "bold", children: "Archivo de Muestra" }), jsxs(Stack, { direction: "row", spacing: 2, children: [jsx(Typography$1, { variant: "body2", children: "Puede descargar el ejemplo adjunto y utilizarlo como punto de partida para su propio archivo." }), jsx(Button, { variant: "contained", startIcon: jsx(DownloadIcon, {}), onClick: handleDownload, sx: {
+                                    minWidth: 120,
+                                }, children: "Descargar" })] })] }), jsx(Box, { id: "formulario", component: "form", width: 1, autoComplete: "off", noValidate: true, onSubmit: form.handleSubmit(onSubmitHandler, onError), children: jsx(FileUploadBox, { name: "archivo", control: form.control, setValid: setValid, csvProps: props.data }) })] }));
 };
 
 const mergeSettings = (baseSettings, mergingSettings) => {
@@ -26668,7 +26705,6 @@ const StyledMenu = styled$1((props) => (jsx(Menu, { elevation: 0, anchorOrigin:
 }));
 
 const CreateButtonWithMenuOptions = (props) => {
-    // const permission = useHasPermission_v2(`${props.permission}.add`);
     const [anchorEl, setAnchorEl] = useState(null);
     const open = Boolean(anchorEl);
     const handleClick = () => {
@@ -26684,7 +26720,8 @@ const CreateButtonWithMenuOptions = (props) => {
     const handleToggleClose = () => {
         setCSV({ open: false });
     };
-    // if (!permission) return null;
+    if (!props.permission)
+        return null;
     return (jsxs(Fragment, { children: [jsx(CreateButtonBase, { open: open, handleClick: handleClick }), jsxs(StyledMenu, { id: 'create-menu', MenuListProps: {
                     'aria-labelledby': 'create-menu-button',
                 }, anchorEl: anchorEl, open: open, onClose: handleClose, children: [props.csv_upload?.enable && ([
@@ -27104,37 +27141,33 @@ const FiltersButton = (props) => {
 };
 
 const ExportCSV = (props) => {
-    // const endpoint = 'temp';
-    //
-    // const notifications = useNotifications();
-    // const [descargarCSV, {isLoading}] = ;
+    const { pathname } = useLocation();
+    const endpoint = props.slots?.endpoint || pathname;
+    const notifications = useNotifications();
+    const api = useAPI();
+    const [descargarCSV, { isLoading }] = api.useLazyDescargarCSVQuery();
     const handleClick = () => {
         const extraItems = { variant: props.slots?.variant };
         if (props.rowSelectionModel.ids.size > 0)
             extraItems[`${props.slots?.column_key || 'id'}__in`] = Array.from(props.rowSelectionModel.ids).join(',');
-        // const filters = merge(
-        //     {},
-        //     omit(props.filterModel, map(props.ignore?.filters, function (filter) {return `items.${filter}`}) || []),
-        //     {items: extraItems}
-        // );
-        // descargarCSV({
-        //     endpoint: endpoint, filterModel: filters, sortModel: props.sortModel, ignoreSort: props.ignore?.sort,
-        // }).unwrap()
-        //     .then((response) => {
-        //         const file = document.createElement("a");
-        //         file.href = response.file
-        //         file.download = response.filename
-        //         file.click();
-        //
-        //         notifications.show('CSV descargado!', {severity: 'success'});
-        //         props.handleClick();
-        //     })
-        //     .catch((error) => {
-        //         console.log(error)
-        //         notifications.show('Error al descargar CSV.', {severity: 'error'});
-        //     })
+        const filters = merge$2({}, omit(props.filterModel, map(props.ignore?.filters, function (filter) { return `items.${filter}`; }) || []), { items: extraItems });
+        descargarCSV({
+            endpoint: endpoint, filterModel: filters, sortModel: props.sortModel, ignoreSort: props.ignore?.sort,
+        }).unwrap()
+            .then((response) => {
+            const file = document.createElement("a");
+            file.href = response.file;
+            file.download = response.filename;
+            file.click();
+            notifications.show('CSV descargado!', { severity: 'success' });
+            props.handleClick();
+        })
+            .catch((error) => {
+            console.log(error);
+            notifications.show('Error al descargar CSV.', { severity: 'error' });
+        });
     };
-    return (jsx(MenuItemWithLoading, { handleClick: handleClick, isLoading: false, disabled: props.disabledWithoutSelection && !props.rowSelectionModel.ids.size, children: props.slots?.title || 'Descargar como CSV' }, 'export-dg-csv'));
+    return (jsx(MenuItemWithLoading, { handleClick: handleClick, isLoading: isLoading, disabled: props.disabledWithoutSelection && !props.rowSelectionModel.ids.size, children: props.slots?.title || 'Descargar como CSV' }, 'export-dg-csv'));
 };
 
 const ExportButton = (props) => {
@@ -27154,11 +27187,10 @@ const ExportButton = (props) => {
                             handleClick: () => setExportMenuOpen(false),
                             filterModel: props.filterModel,
                             sortModel: props.sortModel,
+                            rowSelectionModel: props.rowSelectionModel,
                             csvExport: {
-                                rowSelectionModel: props.rowSelectionModel,
                                 ...csvExport,
                             },
-                            endpoint: props.csvProps?.endpoint,
                             ...remainingProps,
                         }));
                     })] })] }));
@@ -27560,14 +27592,20 @@ const Base = (props) => {
         setFilterModel: setFilterModel,
     }));
     // ========================= || PAGINADO || ========================= //
-    const [paginationModel, setPaginationModel] = useState({ page: 0, pageSize: 50 });
+    const [paginationModel, setPaginationModel] = useState({
+        page: 0,
+        pageSize: 50,
+    });
     // ========================= || ORDENADO || ========================= //
     const [sortModel, setSortModel] = useState([]);
     // ========================= || FILTRADO || ========================= //
-    const [filterModel, setFilterModel] = useState({ items: {}, quickFilterValues: '' });
+    const [filterModel, setFilterModel] = useState({
+        items: {},
+        quickFilterValues: "",
+    });
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const setQuickSearchValue = useCallback(debounce$1((quickSearch) => {
-        setFilterModel(prevState => ({ ...prevState, quickFilterValues: quickSearch }));
+        setFilterModel((prevState) => ({ ...prevState, quickFilterValues: quickSearch }));
     }, 500), []);
     // ========================= || COLUMNAS || ========================= //
     const getTogglableColumns = (columns) => {
@@ -27575,7 +27613,7 @@ const Base = (props) => {
             return [];
         return columns
             .filter((column) => {
-            return !['__check__', 'actions'].includes(column.field);
+            return !["__check__", "actions"].includes(column.field);
         })
             .map((column) => column.field);
     };
@@ -27587,7 +27625,7 @@ const Base = (props) => {
     // ========================= || LAZY QUERY || ========================= //
     const [query, { data, isLoading, isFetching, isError, isUninitialized }] = props.api.data.query(props.api.data.options || {});
     // ========================= || INITIAL STATE || ========================= //
-    const localStoreName = useMemo(() => `${props.pathname}${props.slotProps?.tab ? `_${props.slotProps?.tab}` : ''}_DG`, [props.pathname, props.slotProps?.tab]);
+    const localStoreName = useMemo(() => `${props.pathname}${props.slotProps?.tab ? `_${props.slotProps?.tab}` : ""}_DG`, [props.pathname, props.slotProps?.tab]);
     const internalFilterRef = useRef(filterModel);
     const filterRef = props.slotProps?.filtersRef || internalFilterRef;
     useEffect(() => {
@@ -27597,28 +27635,30 @@ const Base = (props) => {
     const saveSnapshot = useCallback(() => {
         if (apiRef?.current?.exportState && localStorage && !props.slotProps?.dontSaveState) {
             const currentState = apiRef.current.exportState();
-            set$1(currentState, 'filters.filterModel', filterRef.current);
+            set$1(currentState, "filters.filterModel", filterRef.current);
             setWithExpiry(localStoreName, currentState, 86400000);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [apiRef, props.pathname]);
     useLayoutEffect(() => {
         const stateFromLocalStorage = getWithExpiry(localStoreName);
-        const init = stateFromLocalStorage ? stateFromLocalStorage : get(props, 'dataGridProps.initialState', {});
-        const pagination = get(init, 'pagination.paginationModel', paginationModel);
-        const sorting = get(init, 'sorting.sortModel', sortModel);
-        const filters = get(init, 'filters.filterModel', filterModel);
+        const init = stateFromLocalStorage
+            ? stateFromLocalStorage
+            : get(props, "dataGridProps.initialState", {});
+        const pagination = get(init, "pagination.paginationModel", paginationModel);
+        const sorting = get(init, "sorting.sortModel", sortModel);
+        const filters = get(init, "filters.filterModel", filterModel);
         setPaginationModel(pagination);
         setSortModel(sorting);
         setFilterModel(filters);
-        setColumnVisibilityModel(get(init, 'columns.columnVisibilityModel', columnVisibilityModel));
+        setColumnVisibilityModel(get(init, "columns.columnVisibilityModel", columnVisibilityModel));
         // handle refresh and navigating away/refreshing
-        window.addEventListener('beforeunload', saveSnapshot);
+        window.addEventListener("beforeunload", saveSnapshot);
         // console.log(getQueryArgs(pagination, sorting, filters, props.api.data.args))
         query(getQueryArgs(pagination, sorting, filters, props.api.data.args));
         return () => {
             // in case of an SPA remove the event-listener
-            window.removeEventListener('beforeunload', saveSnapshot);
+            window.removeEventListener("beforeunload", saveSnapshot);
             saveSnapshot();
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -27637,8 +27677,8 @@ const Base = (props) => {
     };
     // ========================= || SELECCIÓN || ========================= //
     const [rowSelectionModel, setRowSelectionModel] = useState({
-        type: 'include',
-        ids: new Set()
+        type: "include",
+        ids: new Set(),
     });
     const handleRowSelectionModelChange = (newSelection) => {
         setRowSelectionModel(newSelection);
@@ -27656,13 +27696,13 @@ const Base = (props) => {
     const handleRowClick = ({ id }, event) => {
         const link_to = `${props.slotProps?.navigation != undefined ? props.slotProps?.navigation : props.pathname}/${id}`;
         if (event.ctrlKey) {
-            const newTab = document.createElement('a');
+            const newTab = document.createElement("a");
             newTab.href = link_to;
-            newTab.target = '_blank';
+            newTab.target = "_blank";
             newTab.click();
         }
         else {
-            navigate(`${props.slotProps?.navigation ? props.slotProps?.navigation : props.pathname}/${id}`);
+            navigate(`${props.slotProps?.navigation || props.slotProps?.navigation === "" ? props.slotProps?.navigation : props.pathname}/${id}`);
         }
     };
     const handleRowEditStop = (params, event) => {
@@ -27681,13 +27721,13 @@ const Base = (props) => {
         },
         slotProps: {
             baseCheckbox: {
-                size: 'small'
+                size: "small",
             },
             toolbar: {
                 filters: {
                     filterModel: filterModel,
                     setFilterModel: setFilterModel,
-                    setQuickSearchValue: setQuickSearchValue
+                    setQuickSearchValue: setQuickSearchValue,
                 },
                 protectFilters: props.api.data.protectFilters,
                 columnsFilter: props.slotProps?.columnsFilter,
@@ -27698,27 +27738,27 @@ const Base = (props) => {
                 buttons: {
                     refresh: {
                         refetch: handleRefetch,
-                    }
-                }
+                    },
+                },
             },
             columnsManagement: {
                 getTogglableColumns: getTogglableColumns,
             },
         },
     }, props.dataGridProps);
-    const renderDataGrid = ({ dataGridProps: renderDataGridProps }) => {
+    const renderDataGrid = ({ dataGridProps: renderDataGridProps, }) => {
         // console.log(dataGridProps)
         return (jsx(Box, { width: 1, minHeight: 300, height: 1, 
             // maxHeight={'calc(100% - 30px)'}
-            display: 'flex', flexDirection: 'column', pb: 0, children: jsx(NoSsr, { children: jsx(DataGrid, { apiRef: apiRef, rows: data?.results || [], loading: some(get(renderDataGridProps, 'loadingParams', []), function (x) {
+            display: "flex", flexDirection: "column", pb: 0, children: jsx(NoSsr, { children: jsx(DataGrid, { apiRef: apiRef, rows: data?.results || [], loading: some(get(renderDataGridProps, "loadingParams", []), function (x) {
                         return x;
                     }), 
                     // paginado //
-                    pagination: true, paginationMode: 'server', paginationModel: paginationModel, onPaginationModelChange: setPaginationModel, pageSizeOptions: [50, 100, { value: -1, label: 'Todos' }], 
+                    pagination: true, paginationMode: "server", paginationModel: paginationModel, onPaginationModelChange: setPaginationModel, pageSizeOptions: [50, 100, { value: -1, label: "Todos" }], 
                     // ordenado
-                    sortingMode: 'server', sortModel: sortModel, onSortModelChange: setSortModel, 
+                    sortingMode: "server", sortModel: sortModel, onSortModelChange: setSortModel, 
                     // filtrado
-                    filterMode: 'server', 
+                    filterMode: "server", 
                     // onFilterModelChange={handleFilterChange}
                     disableColumnFilter: true, showToolbar: true, 
                     // selection
@@ -27736,13 +27776,13 @@ const Base = (props) => {
                     // row count
                     rowCount: rowCount, 
                     // settings
-                    density: 'compact', 
+                    density: "compact", 
                     // striping
-                    getRowClassName: (params) => params.indexRelativeToCurrentPage % 2 === 0 ? 'even' : 'odd', localeText: {
-                        columnHeaderSortIconLabel: 'Ordenar',
-                        columnMenuSortAsc: 'Ordenar de menor a mayor',
-                        columnMenuSortDesc: 'Ordenar de mayor a menor',
-                        columnMenuLabel: 'Menú',
+                    getRowClassName: (params) => params.indexRelativeToCurrentPage % 2 === 0 ? "even" : "odd", localeText: {
+                        columnHeaderSortIconLabel: "Ordenar",
+                        columnMenuSortAsc: "Ordenar de menor a mayor",
+                        columnMenuSortDesc: "Ordenar de mayor a menor",
+                        columnMenuLabel: "Menú",
                     }, ...renderDataGridProps }) }) }));
     };
     // ========================= || RETURN || ========================= //
@@ -27756,7 +27796,7 @@ const Base = (props) => {
                 pathname: props.pathname,
                 navigation: props.slotProps?.navigation,
                 ...renderProps,
-                ...props.api.create
+                ...props.api.create,
             };
             renderFunction = CreateGridWrapper;
         }
@@ -27767,7 +27807,7 @@ const Base = (props) => {
                 renderFunctionProps: renderProps,
                 dataGridProps: dataGridProps,
                 baseGridRef: apiRef,
-                ...props.api.edit
+                ...props.api.edit,
             };
             renderFunction = EditGridWrapper;
         }
@@ -27777,7 +27817,7 @@ const Base = (props) => {
                 renderFunction: renderFunction,
                 renderFunctionProps: renderProps,
                 dataGridProps: dataGridProps,
-                ...props.api.delete
+                ...props.api.delete,
             });
         }
         return renderFunction(renderProps);
@@ -28654,5 +28694,5 @@ const theme = () => {
     return themes;
 };
 
-export { APIContext, APIProvider, ActiveCell, Base, ButtonWithDrawer, CSVUpload, ContentLayout, ControlledDate, ControlledDropdown, FileUploadBox as ControlledFileUploadBox, ControlledNumber, ControlledPhoneNumber, ControlledPhotoField, ControlledSelect, ControlledSlider as ControlledSimpleSlider, ControlledSlider$1 as ControlledSlider, ControlledSwitch, ControlledText, ControlledTimePicker, ControlledToggleButtons, CoverPage, CreateButtonBase, CreateButtonWithMenuOptions, DeleteButton, DeleteConfirmationDialog, DetailPage, EditButton, ExportButton, HistorialDrawer, ListPage, Loadable, LoadingComponent, Logo, MainDrawer, MenuItemWithLoading, ModuleCard, MyGridEditSingleSelect, NavigationContext, NavigationProvider, NormalOrIcon, NotAllowed, NotFound, ObjectProgressStack, SaveCancelButton, StatusBadge, StyledMenu, Tabs, Transitions, UncontrolledText, changeTitle, closeProgressSnack, dayjs, deleteColumn, editColumn, filterQuery, formDataForm, header as headerReducer, jsonForm, manualCacheRefresh, mergeSettings, openProgressSnack, query, renderEditCellWithErrorTooltip, setErrors, snackProgress_default as snackProgressReducer, tags, theme, updateProgressSnackData, useAPI, useHasPermission, useNavigation, valueLabel };
+export { APIContext, APIProvider, ActiveCell, Base, ButtonWithDrawer, CSVUpload, ContentLayout, ControlledDate, ControlledDropdown, FileUploadBox as ControlledFileUploadBox, ControlledNumber, ControlledPhoneNumber, ControlledPhotoField, ControlledSelect, ControlledSlider as ControlledSimpleSlider, ControlledSlider$1 as ControlledSlider, ControlledSwitch, ControlledText, ControlledTimePicker, ControlledToggleButtons, CoverPage, CreateButtonBase, CreateButtonWithMenuOptions, DeleteButton, DeleteConfirmationDialog, DetailPage, EditButton, ExportCSV, HistorialDrawer, ListPage, Loadable, LoadingComponent, Logo, MainDrawer, MenuItemWithLoading, ModuleCard, MyGridEditSingleSelect, NavigationContext, NavigationProvider, NormalOrIcon, NotAllowed, NotFound, ObjectProgressStack, SaveCancelButton, StatusBadge, StyledMenu, Tabs, Transitions, UncontrolledText, changeTitle, closeProgressSnack, dayjs, deleteColumn, editColumn, filterQuery, formDataForm, header as headerReducer, jsonForm, manualCacheRefresh, mergeSettings, openProgressSnack, query, renderEditCellWithErrorTooltip, setErrors, snackProgress_default as snackProgressReducer, tags, theme, updateProgressSnackData, useAPI, useHasPermission, useNavigation, valueLabel };
 //# sourceMappingURL=index.js.map