@m4l/components 9.2.56 → 9.2.57

package/components/DataGrid/contexts/DataGridContext/index.js

@@ -2,6 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { useState, useMemo, useEffect, useCallback, createContext } from "react";
 import { c as castMapColumnsWidthToRecord } from "../../helpers/castMapColumnsWidthToRecord.js";
 import { useFirstRender } from "@m4l/graphics";
+import { deepEqual } from "fast-equals";
 const DataGridContext = createContext(null);
 const getColumnConfigByKey = (key, storeColumnsConfig) => {
   let indexFind = -1;
@@ -39,7 +40,7 @@ function getColumnsConfig(id, columns, defaultUserColumns = void 0) {
       index: columnConfigIndex > -1 ? columnConfigIndex : index,
       visible: columnConfig.visible === void 0 ? true : columnConfig.visible,
       frozen: columnConfig.frozen ?? false,
-      orginalIndex: index,
+      originalIndex: index,
       originalVisible: column.visible === void 0 ? true : column.visible,
       originalFrozen: column.frozen ?? false
     };
@@ -115,7 +116,7 @@ function DataGridProvider(props) {
     rowKeyGetter,
     onChangeUserColumns
   } = props;
-  const isFirstRender = useFirstRender();
+  const isFirstRender = useFirstRender([columns, id]);
   const [columnsWidths, setColumnsWidths] = useState(
     /* @__PURE__ */ new Map()
   );
@@ -154,13 +155,43 @@ function DataGridProvider(props) {
   }, [defaultUserColumns]);
   useEffect(() => {
     if (!isFirstRender) {
+      const finalColumnsConfig = [];
+      for (let i = 0; i < columnsConfig.length; i++) {
+        const columnIndex = columns.findIndex((c) => c.key === columnsConfig[i]?.key);
+        if (columnIndex !== -1) {
+          const column = columns[columnIndex];
+          finalColumnsConfig.push({
+            ...columnsConfig[i],
+            // name: column.name as string,
+            originalIndex: columnIndex,
+            originalFrozen: column.frozen ?? false,
+            originalVisible: column.visible ?? true
+          });
+        }
+      }
       const newColumns = columns.filter((column, index) => column.key !== columnsConfig[index]?.key);
-      const newColConfig = getColumnsConfig(id, newColumns).map((column, index) => {
-        const indexNewCol = index + columnsConfig.length;
-        return { ...column, index: indexNewCol, orginalIndex: indexNewCol };
-      });
-      columnsConfig.push(...newColConfig);
-      setColumnsWidths((prevColumnsWidth) => new Map([...prevColumnsWidth, ...getColumnsWidth(id, newColumns, defaultUserColumns)]));
+      if (newColumns.length > 0) {
+        const colLength = finalColumnsConfig.length;
+        const newColConfig = getColumnsConfig(id, newColumns).map((columnConfig, index) => {
+          const columnIndex = columns.findIndex((c) => c.key === newColumns[index].key);
+          const column = newColumns[index];
+          const indexNewCol = index + colLength;
+          return {
+            ...columnConfig,
+            index: indexNewCol,
+            name: column.name,
+            originalIndex: columnIndex,
+            originalFrozen: column.frozen ?? false,
+            originalVisible: column.visible ?? true
+          };
+        });
+        finalColumnsConfig.push(...newColConfig);
+      }
+      if (deepEqual(columnsConfig, finalColumnsConfig)) {
+        return;
+      }
+      console.log("useEffect columnsConfig changed", columnsConfig, finalColumnsConfig);
+      setColumnsConfigOptions(finalColumnsConfig);
     }
   }, [columns, id]);
   const onChangeColumnsConfig = useCallback(

package/components/DataGrid/contexts/DataGridContext/types.d.ts

@@ -6,11 +6,10 @@ export interface BaseConfigColumn {
     visible: boolean;
     index: number;
     frozen: boolean;
-    name: string;
 }
 export interface IConfigColumn extends BaseConfigColumn {
     hidden: boolean;
-    orginalIndex: number;
+    originalIndex: number;
     originalVisible: boolean;
     originalFrozen: boolean;
 }

package/components/DataGrid/dictionary.d.ts

@@ -1,8 +1,9 @@
+export declare const DATAGRID_DICTIONARY_ID = "data_grid";
 /**
  * TODO: Documentar
  */
 export declare function getDataGridComponentsDictionary(): string[];
-export declare const dictionary: {
+export declare const DICTIONARY: {
     LABEL_ACTIONS: string;
     LABEL_ROWS_PER_PAGE: string;
     LABEL_OF: string;

package/components/DataGrid/dictionary.js

@@ -1,30 +1,31 @@
 import { g as getMenuActionsComponentsDictionary } from "../MenuActions/dictionary.js";
 import { g as getModalDictionary } from "../ModalDialog/dictionary.js";
 import { g as getPagerComponentsDictionary } from "../Pager/dicctionary.js";
+const DATAGRID_DICTIONARY_ID = "data_grid";
 function getDataGridComponentsDictionary() {
-  return ["data_grid"].concat(getPagerComponentsDictionary()).concat(getMenuActionsComponentsDictionary()).concat(getModalDictionary());
+  return [DATAGRID_DICTIONARY_ID].concat(getPagerComponentsDictionary()).concat(getMenuActionsComponentsDictionary()).concat(getModalDictionary());
 }
-const dictionary = {
-  DENSITY_COMPACT: `${getDataGridComponentsDictionary()[0]}.density_compact`,
-  DENSITY_STANDARD: `${getDataGridComponentsDictionary()[0]}.density_standard`,
-  DENSITY_CONFORTABLE: `${getDataGridComponentsDictionary()[0]}.density_confortable`,
-  DENSITY_TOOLTIP: `${getDataGridComponentsDictionary()[0]}.tooltip_density`,
-  TOOLTIP_FILTER_HIDE: `${getDataGridComponentsDictionary()[0]}.tooltip_filter_hide`,
-  TOOLTIP_FILTER_SHOW: `${getDataGridComponentsDictionary()[0]}.tooltip_filter_show`,
-  SETTINGS_COLUMN_NAME: `${getDataGridComponentsDictionary()[0]}.settings_column_name`,
-  SETTINGS_COLUMN_POSITION: `${getDataGridComponentsDictionary()[0]}.settings_column_position`,
-  SETTINGS_COLUMN_VISIBLE: `${getDataGridComponentsDictionary()[0]}.settings_column_visible`,
-  SETTINGS_COLUMNS_FROZEN: `${getDataGridComponentsDictionary()[0]}.settings_column_frozen`,
-  SETTINGS_SEL_COLUMNS: `${getDataGridComponentsDictionary()[0]}.settings_sel_columns`,
-  SETTINGS_MOVE_FIRST: `${getDataGridComponentsDictionary()[0]}.settings_move_first`,
-  SETTINGS_MOVE_UP: `${getDataGridComponentsDictionary()[0]}.settings_move_up`,
-  SETTINGS_MOVE_LAST: `${getDataGridComponentsDictionary()[0]}.settings_move_last`,
-  SETTINGS_MOVE_DOWN: `${getDataGridComponentsDictionary()[0]}.settings_move_down`,
-  SETTINGS_VISIBLE_ALL: `${getDataGridComponentsDictionary()[0]}.settings_visible_all`,
-  SETTINGS_NO_VISIBLE_ALL: `${getDataGridComponentsDictionary()[0]}.settings_no_visible_all`,
-  SETTINGS_RESTORE: `${getDataGridComponentsDictionary()[0]}.settings_restore`
+const DICTIONARY = {
+  DENSITY_COMPACT: `${DATAGRID_DICTIONARY_ID}.density_compact`,
+  DENSITY_STANDARD: `${DATAGRID_DICTIONARY_ID}.density_standard`,
+  DENSITY_CONFORTABLE: `${DATAGRID_DICTIONARY_ID}.density_confortable`,
+  DENSITY_TOOLTIP: `${DATAGRID_DICTIONARY_ID}.tooltip_density`,
+  TOOLTIP_FILTER_HIDE: `${DATAGRID_DICTIONARY_ID}.tooltip_filter_hide`,
+  TOOLTIP_FILTER_SHOW: `${DATAGRID_DICTIONARY_ID}.tooltip_filter_show`,
+  SETTINGS_COLUMN_NAME: `${DATAGRID_DICTIONARY_ID}.settings_column_name`,
+  SETTINGS_COLUMN_POSITION: `${DATAGRID_DICTIONARY_ID}.settings_column_position`,
+  SETTINGS_COLUMN_VISIBLE: `${DATAGRID_DICTIONARY_ID}.settings_column_visible`,
+  SETTINGS_COLUMNS_FROZEN: `${DATAGRID_DICTIONARY_ID}.settings_column_frozen`,
+  SETTINGS_SEL_COLUMNS: `${DATAGRID_DICTIONARY_ID}.settings_sel_columns`,
+  SETTINGS_MOVE_FIRST: `${DATAGRID_DICTIONARY_ID}.settings_move_first`,
+  SETTINGS_MOVE_UP: `${DATAGRID_DICTIONARY_ID}.settings_move_up`,
+  SETTINGS_MOVE_LAST: `${DATAGRID_DICTIONARY_ID}.settings_move_last`,
+  SETTINGS_MOVE_DOWN: `${DATAGRID_DICTIONARY_ID}.settings_move_down`,
+  SETTINGS_VISIBLE_ALL: `${DATAGRID_DICTIONARY_ID}.settings_visible_all`,
+  SETTINGS_NO_VISIBLE_ALL: `${DATAGRID_DICTIONARY_ID}.settings_no_visible_all`,
+  SETTINGS_RESTORE: `${DATAGRID_DICTIONARY_ID}.settings_restore`
 };
 export {
-  dictionary as d,
+  DICTIONARY as D,
   getDataGridComponentsDictionary as g
 };

package/components/DataGrid/subcomponents/Actions/index.js

@@ -18,8 +18,9 @@ function Actions(props) {
     withSettings = true,
     settingsProps,
     withLocalFilters,
-    leftActions: LeftActions,
-    rightActions: RightActions
+    leftActions,
+    rightActions,
+    columns
   } = props;
   return /* @__PURE__ */ jsxs(ActionsRootStyled, { children: [
     withRowsCount && !withPager && !isMobile && /* @__PURE__ */ jsx(RowsCount, {}),
@@ -31,15 +32,15 @@ function Actions(props) {
       }
     ),
     isMobile ? /* @__PURE__ */ jsxs(Fragment, { children: [
-      LeftActions,
-      /* @__PURE__ */ jsx(MobileMenuActions, {}),
-      RightActions
+      leftActions,
+      /* @__PURE__ */ jsx(MobileMenuActions, { columns }),
+      rightActions
     ] }) : /* @__PURE__ */ jsxs(ActionsConfigContainerStyled, { children: [
-      LeftActions,
+      leftActions,
       typeof rowHeights !== "number" && /* @__PURE__ */ jsx(Density, {}),
       withLocalFilters && /* @__PURE__ */ jsx(Filter, {}),
-      withSettings && /* @__PURE__ */ jsx(Settings, { ...settingsProps }),
-      RightActions
+      withSettings && /* @__PURE__ */ jsx(Settings, { ...settingsProps, columns }),
+      rightActions
     ] })
   ] });
 }

package/components/DataGrid/subcomponents/Actions/subcomponents/Density/index.js

@@ -5,7 +5,7 @@ import { useTheme } from "@mui/material";
 import { M as MenuActions } from "../../../../../MenuActions/MenuActions.js";
 import { u as useDataGrid } from "../../../../hooks/useDataGrid.js";
 import { p as pathIcons } from "../../../../icons.js";
-import { d as dictionary } from "../../../../dictionary.js";
+import { D as DICTIONARY } from "../../../../dictionary.js";
 function Density() {
   const { host_static_assets, environment_assets } = useEnvironment();
   const { rowHeights, currentRowHeightVariant, setRowHeightVariant } = useDataGrid();
@@ -20,21 +20,21 @@ function Density() {
         startIcon: `${host_static_assets}/${environment_assets}/${pathIcons.compact}`,
         onClick: () => setRowHeightVariant("compact"),
         disabled: currentRowHeightVariant === "compact",
-        label: getLabel(dictionary.DENSITY_COMPACT)
+        label: getLabel(DICTIONARY.DENSITY_COMPACT)
       },
       {
         type: "menuItem",
         startIcon: `${host_static_assets}/${environment_assets}/${pathIcons.standard}`,
         onClick: () => setRowHeightVariant("standard"),
         disabled: currentRowHeightVariant === "standard",
-        label: getLabel(dictionary.DENSITY_STANDARD)
+        label: getLabel(DICTIONARY.DENSITY_STANDARD)
       },
       {
         type: "menuItem",
         startIcon: `${host_static_assets}/${environment_assets}/${pathIcons.confortable}`,
         onClick: () => setRowHeightVariant("confortable"),
         disabled: currentRowHeightVariant === "confortable",
-        label: getLabel(dictionary.DENSITY_CONFORTABLE)
+        label: getLabel(DICTIONARY.DENSITY_CONFORTABLE)
       }
     ];
   }, [
@@ -66,7 +66,7 @@ function Density() {
       transformOrigin: { vertical: "top", horizontal: "right" },
       menuActions,
       icon: currenViewIcon,
-      toolTip: getLabel(dictionary.DENSITY_TOOLTIP)
+      toolTip: getLabel(DICTIONARY.DENSITY_TOOLTIP)
     }
   );
 }

package/components/DataGrid/subcomponents/Actions/subcomponents/Filter/index.js

@@ -3,7 +3,7 @@ import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { u as useFilters } from "../../../../hooks/useFilters.js";
 import { I as IconButton } from "../../../../../mui_extended/IconButton/IconButton.js";
 import { p as pathIcons } from "../../../../icons.js";
-import { d as dictionary } from "../../../../dictionary.js";
+import { D as DICTIONARY } from "../../../../dictionary.js";
 function Filter() {
   const { activeFilters, setActiveFilters } = useFilters();
   const { host_static_assets, environment_assets } = useEnvironment();
@@ -14,7 +14,7 @@ function Filter() {
   return /* @__PURE__ */ jsx(
     IconButton,
     {
-      tooltip: activeFilters ? getLabel(dictionary.TOOLTIP_FILTER_HIDE) : getLabel(dictionary.TOOLTIP_FILTER_SHOW),
+      tooltip: activeFilters ? getLabel(DICTIONARY.TOOLTIP_FILTER_HIDE) : getLabel(DICTIONARY.TOOLTIP_FILTER_SHOW),
       onClick: toggleIcon,
       "aria-label": "filter",
       icon: `${host_static_assets}/${environment_assets}/${pathIcons.filter}`

package/components/DataGrid/subcomponents/Actions/subcomponents/MobileMenuActions/index.d.ts

@@ -1,4 +1,7 @@
+import { Column } from 'react-data-grid';
 /**
  * Renderiza las acciones cuando el dispositivo es un móvil
  */
-export declare const MobileMenuActions: () => import("react/jsx-runtime").JSX.Element;
+export declare const MobileMenuActions: (props: {
+    columns: readonly Column<any, any>[];
+}) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/subcomponents/Actions/subcomponents/MobileMenuActions/index.js

@@ -5,12 +5,13 @@ import { u as useFilters } from "../../../../hooks/useFilters.js";
 import { u as useModalSettings } from "../hooks/useModalSettings/index.js";
 import { p as pathIcons } from "../../../../icons.js";
 import { M as MenuActions } from "../../../../../MenuActions/MenuActions.js";
-const MobileMenuActions = () => {
+const MobileMenuActions = (props) => {
+  const { columns } = props;
   const { getLabel } = useModuleDictionary();
   const { host_static_assets, environment_assets } = useEnvironment();
   const { currentRowHeightVariant, setRowHeightVariant } = useDataGrid();
   const { activeFilters, setActiveFilters } = useFilters();
-  const modalSettings = useModalSettings();
+  const modalSettings = useModalSettings(columns);
   const toggleIcon = () => {
     setActiveFilters(!activeFilters);
   };

package/components/DataGrid/subcomponents/Actions/subcomponents/Settings/index.d.ts

@@ -1,4 +1,5 @@
+import { SettingsProps } from './types';
 /**
  * Componente que renderiza el icono de configuración en el DataGrid
  */
-export declare function Settings(): import("react/jsx-runtime").JSX.Element;
+export declare function Settings(props: SettingsProps): import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/subcomponents/Actions/subcomponents/Settings/index.js

@@ -3,9 +3,10 @@ import { I as IconButton } from "../../../../../mui_extended/IconButton/IconButt
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { u as useModalSettings } from "../hooks/useModalSettings/index.js";
 import { p as pathIcons } from "../../../../icons.js";
-function Settings() {
+function Settings(props) {
+  const { columns } = props;
   const { host_static_assets, environment_assets } = useEnvironment();
-  const modalSettings = useModalSettings();
+  const modalSettings = useModalSettings(columns);
   const { getLabel } = useModuleDictionary();
   return /* @__PURE__ */ jsx(
     IconButton,

package/components/DataGrid/subcomponents/Actions/subcomponents/Settings/subcomponents/ColumnsConfig/index.js

@@ -5,27 +5,27 @@ import DataGrid from "react-data-grid";
 import { I as IconButton } from "../../../../../../../mui_extended/IconButton/IconButton.js";
 import { p as pathIcons } from "../../../../../../icons.js";
 import { d as ColumnsConfigWrapperStyled, e as ColumnsConfigSelColumnsStyled, f as ColumnsConfigDataGridStyled, T as TableWrapperDataGridStyled, g as ColumnsConfigActiosStyled } from "../../../../../../slots/DataGridSlot.js";
-import { d as dictionary } from "../../../../../../dictionary.js";
+import { D as DICTIONARY } from "../../../../../../dictionary.js";
 import { C as ColumnInteractiveCheckFormatter } from "../../../../../../formatters/ColumnInteractiveCheckFormatter/formatter.js";
-function getRowsFromColumnsConfig(columnsConfig) {
-  return columnsConfig.filter((column) => !column.hidden).map(
-    (column) => ({
-      key: column.key,
-      name: column.name,
-      visible: column.visible === void 0 ? true : column.visible,
-      frozen: column.frozen === void 0 ? false : column.frozen,
-      originalIndex: column.orginalIndex,
-      originalFrozen: column.originalFrozen,
-      originalVisible: column.originalVisible
+function getRowsFromColumnsConfig(columnsConfig, columns) {
+  return columnsConfig.filter((cConfig) => !cConfig.hidden).map(
+    (cConfig) => ({
+      key: cConfig.key,
+      name: columns.find((c) => c.key === cConfig.key)?.name,
+      visible: cConfig.visible === void 0 ? true : cConfig.visible,
+      frozen: cConfig.frozen === void 0 ? false : cConfig.frozen,
+      originalIndex: cConfig.originalIndex,
+      originalFrozen: cConfig.originalFrozen,
+      originalVisible: cConfig.originalVisible
     })
   );
 }
 const ColumnsConfig = forwardRef((props, ref) => {
   const refdata_grid = useRef(null);
-  const { onCloseSettings, columnsConfig, onChangeColumnsConfig, rowHeight } = props;
+  const { onCloseSettings, columnsConfig, onChangeColumnsConfig, rowHeight, columns } = props;
   const { getLabel } = useModuleDictionary();
   const [isInit, setIsInit] = useState(true);
-  const [rows, setRows] = useState(getRowsFromColumnsConfig(columnsConfig));
+  const [rows, setRows] = useState(getRowsFromColumnsConfig(columnsConfig, columns));
   const [selRows, setSelRows] = useState(() => /* @__PURE__ */ new Set());
   const divRef = useRef(null);
   const { host_static_assets, environment_assets } = useEnvironment();
@@ -37,21 +37,21 @@ const ColumnsConfig = forwardRef((props, ref) => {
     () => [
       {
         key: "name",
-        name: getLabel(dictionary.SETTINGS_COLUMN_NAME),
+        name: getLabel(DICTIONARY.SETTINGS_COLUMN_NAME),
         width: 220,
         resizable: true,
         type: "string"
       },
       {
         key: "originalIndex",
-        name: getLabel(dictionary.SETTINGS_COLUMN_POSITION),
+        name: getLabel(DICTIONARY.SETTINGS_COLUMN_POSITION),
         width: 50,
         type: "number",
         cellClass: "rdg-cell-align-center"
       },
       {
         key: "visible",
-        name: getLabel(dictionary.SETTINGS_COLUMN_VISIBLE),
+        name: getLabel(DICTIONARY.SETTINGS_COLUMN_VISIBLE),
         width: 80,
         type: "boolean",
         formatter: ColumnInteractiveCheckFormatter,
@@ -59,7 +59,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       },
       {
         key: "frozen",
-        name: getLabel(dictionary.SETTINGS_COLUMNS_FROZEN),
+        name: getLabel(DICTIONARY.SETTINGS_COLUMNS_FROZEN),
         width: 80,
         type: "boolean",
         formatter: ColumnInteractiveCheckFormatter,
@@ -86,7 +86,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
   };
   useEffect(() => {
     if (isInit === false) {
-      setRows(getRowsFromColumnsConfig(columnsConfig));
+      setRows(getRowsFromColumnsConfig(columnsConfig, columns));
     }
     setIsInit(false);
   }, [columnsConfig]);
@@ -176,7 +176,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
     setSelRows(mySet);
   };
   return /* @__PURE__ */ jsxs(ColumnsConfigWrapperStyled, { ref: divRef, children: [
-    /* @__PURE__ */ jsx(ColumnsConfigSelColumnsStyled, { children: getLabel(dictionary.SETTINGS_SEL_COLUMNS) }),
+    /* @__PURE__ */ jsx(ColumnsConfigSelColumnsStyled, { children: getLabel(DICTIONARY.SETTINGS_SEL_COLUMNS) }),
     /* @__PURE__ */ jsx(ColumnsConfigDataGridStyled, { children: /* @__PURE__ */ jsx(TableWrapperDataGridStyled, { children: /* @__PURE__ */ jsx(
       DataGrid,
       {
@@ -197,7 +197,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(
         IconButton,
         {
-          tooltip: getLabel(dictionary.SETTINGS_MOVE_FIRST),
+          tooltip: getLabel(DICTIONARY.SETTINGS_MOVE_FIRST),
           onClick: handleMoveFirst,
           "aria-label": "move first place",
           disabled: rowSelectedIndex < 1,
@@ -207,7 +207,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(
         IconButton,
         {
-          tooltip: getLabel(dictionary.SETTINGS_MOVE_UP),
+          tooltip: getLabel(DICTIONARY.SETTINGS_MOVE_UP),
           onClick: () => handleMoveUpDownd(-1),
           "aria-label": "move up place",
           disabled: rowSelectedIndex < 1,
@@ -217,7 +217,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(
         IconButton,
         {
-          tooltip: getLabel(dictionary.SETTINGS_MOVE_LAST),
+          tooltip: getLabel(DICTIONARY.SETTINGS_MOVE_LAST),
           onClick: handleMoveLast,
           "aria-label": "move last place",
           disabled: !!(rowSelectedIndex === rows.length - 1 || rowSelectedIndex === -1),
@@ -227,7 +227,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(
         IconButton,
         {
-          tooltip: getLabel(dictionary.SETTINGS_MOVE_DOWN),
+          tooltip: getLabel(DICTIONARY.SETTINGS_MOVE_DOWN),
           onClick: () => handleMoveUpDownd(1),
           "aria-label": "move down place",
           disabled: !!(rowSelectedIndex === rows.length - 1 || rowSelectedIndex === -1),
@@ -237,7 +237,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(
         IconButton,
         {
-          tooltip: getLabel(dictionary.SETTINGS_VISIBLE_ALL),
+          tooltip: getLabel(DICTIONARY.SETTINGS_VISIBLE_ALL),
           onClick: checkAll,
           "aria-label": "check visible all",
           icon: `${host_static_assets}/${environment_assets}/${pathIcons.checkAll}`
@@ -246,7 +246,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(
         IconButton,
         {
-          tooltip: getLabel(dictionary.SETTINGS_NO_VISIBLE_ALL),
+          tooltip: getLabel(DICTIONARY.SETTINGS_NO_VISIBLE_ALL),
           onClick: unCheckAll,
           "aria-label": "un check all",
           icon: `${host_static_assets}/${environment_assets}/${pathIcons.uncheckAll}`
@@ -255,7 +255,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(
         IconButton,
         {
-          tooltip: getLabel(dictionary.SETTINGS_RESTORE),
+          tooltip: getLabel(DICTIONARY.SETTINGS_RESTORE),
           onClick: restoreAll,
           "aria-label": "Restore columns",
           icon: `${host_static_assets}/${environment_assets}/${pathIcons.restoreColumns}`

package/components/DataGrid/subcomponents/Actions/subcomponents/Settings/subcomponents/ColumnsConfig/types.d.ts

@@ -1,3 +1,4 @@
+import { Column } from 'react-data-grid';
 import { IConfigColumn } from '../../../../../../contexts/DataGridContext/types';
 export interface Row {
     key: string;
@@ -16,6 +17,7 @@ export type ColumnsConfigRef = {
 };
 export interface ConfigProps {
     onCloseSettings: () => void;
+    columns: readonly Column<any, any>[];
     columnsConfig: IConfigColumn[];
     onChangeColumnsConfig: (newColumnsConfig: IConfigColumn[]) => void;
     rowHeight: number;

package/components/DataGrid/subcomponents/Actions/subcomponents/Settings/types.d.ts

@@ -0,0 +1,4 @@
+import { Column } from 'react-data-grid';
+export interface SettingsProps {
+    columns: readonly Column<any, any>[];
+}

package/components/DataGrid/subcomponents/Actions/subcomponents/hooks/useModalSettings/index.d.ts

@@ -1,6 +1,7 @@
+import { Column } from 'react-data-grid';
 /**
  * Hook que renderiza el modal de configuración de las columnas
  * de la tabla
  */
-declare const useModalSettings: () => () => void;
+declare const useModalSettings: (columns: readonly Column<any, any>[]) => () => void;
 export default useModalSettings;

package/components/DataGrid/subcomponents/Actions/subcomponents/hooks/useModalSettings/index.js

@@ -11,7 +11,7 @@ import { A as ActionsContainer } from "../../../../../../CommonActions/component
 import { W as WindowBase } from "../../../../../../WindowBase/WindowBase.js";
 import { A as ActionCancel } from "../../../../../../CommonActions/components/ActionCancel/ActionCancel.js";
 import { A as ActionIntro } from "../../../../../../CommonActions/components/ActionIntro/ActionIntro.js";
-const useModalSettings = () => {
+const useModalSettings = (columns) => {
   const { openModal, closeModal } = useModal();
   const { columnsConfig, onChangeColumnsConfig, currentRowHeight } = useDataGrid();
   const { getLabel } = useModuleDictionary();
@@ -48,7 +48,8 @@ const useModalSettings = () => {
                 rowHeight: currentRowHeight,
                 columnsConfig,
                 onChangeColumnsConfig: handleColumnsSetting,
-                onCloseSettings
+                onCloseSettings,
+                columns
               }
             ) }) }) }),
             /* @__PURE__ */ jsxs(ActionsContainer, { children: [

package/components/DataGrid/subcomponents/Actions/types.d.ts

@@ -1,5 +1,6 @@
 import { PagerProps } from '../../../Pager/types';
-import { SettingsProps } from './subcomponents/types';
+import { SettingsProps } from './subcomponents/Settings/types';
+import { Column } from 'react-data-grid';
 export interface ActionsProps {
     withSettings?: boolean;
     settingsProps?: SettingsProps;
@@ -10,4 +11,6 @@ export interface ActionsProps {
     leftActions?: React.ReactNode;
     rightActions?: React.ReactNode;
 }
-export type InternalActionsProps = ActionsProps;
+export type InternalActionsProps = ActionsProps & {
+    columns: readonly Column<any, any>[];
+};

package/components/DataGrid/subcomponents/Table/hooks/useSortColumnsRows.js

@@ -17,6 +17,7 @@ function getComparator(columns, sortColumn) {
     return column.customSort;
   }
   switch (typeOrder) {
+    //Si el tipo de dato de la columna es un numerico, retorna una función de ordenamiento numérica
     case "number":
       return (a, b) => {
         try {
@@ -25,6 +26,7 @@ function getComparator(columns, sortColumn) {
           return -1;
         }
       };
+    //Por defecto retorna una función de ordenamiento de string
     default:
       return (a, b) => {
         try {

package/components/DynamicFilter/dictionary.d.ts

@@ -45,5 +45,6 @@ export declare const DICCTIONARY: {
     readonly error_invalid_date: "dynamic_filter.error_invalid_date";
     readonly error_less_than_start: "dynamic_filter.error_less_than_start";
     readonly error_operand_mustbe_number: "dynamic_filter.error_operand_mustbe_number";
+    readonly error_invalid_filters_before: "dynamic_filter.error_invalid_filters_before";
 };
 export type TypeDictionary = typeof DICCTIONARY;

package/components/DynamicFilter/dictionary.js

@@ -36,7 +36,8 @@ const DICCTIONARY = {
   error_operator_required: `${DYNAMIC_FILTER_DICTIONARY_ID}.error_operator_required`,
   error_invalid_date: `${DYNAMIC_FILTER_DICTIONARY_ID}.error_invalid_date`,
   error_less_than_start: `${DYNAMIC_FILTER_DICTIONARY_ID}.error_less_than_start`,
-  error_operand_mustbe_number: `${DYNAMIC_FILTER_DICTIONARY_ID}.error_operand_mustbe_number`
+  error_operand_mustbe_number: `${DYNAMIC_FILTER_DICTIONARY_ID}.error_operand_mustbe_number`,
+  error_invalid_filters_before: `${DYNAMIC_FILTER_DICTIONARY_ID}.error_invalid_filters_before`
 };
 export {
   DYNAMIC_FILTER_DICTIONARY_ID as D,