@m4l/components 3.0.0 → 3.0.2

package/@types/types.d.ts

@@ -1,6 +1,15 @@
 import { ComponentsOverrides, ComponentsVariants, Theme as MuiTheme } from '@mui/material/styles';
 
 import { DynamicFilterSlotsType, DynamicFilterOwnerState } from '../components/DynamicFilter/types';
+import {
+  MenuActionsOwnerState,
+  MenuActionsSlotsType,
+} from '../components/mui_extended/MenuActions/types';
+import {
+  RHFInputNumberSpinnerOwnerState,
+  RHFInputNumberSpinnerSlotsType,
+} from '../components/hook-form/RHFInputNumberSpinner/types';
+
 import {
   PopupViewerSlotsType,
   PopupsViewerOwnerState,
@@ -16,6 +25,8 @@ declare module '@mui/material/styles' {
   // Define the slots in the theme
   interface ComponentNameToClassKey {
     M4LDynamicFilter: DynamicFilterSlotsType;
+    M4LMenuActions: MenuActionsSlotsType;
+    M4LRHFInputNumberSpinner: RHFInputNumberSpinnerSlotsType;
     M4LPopupsViewer: PopupViewerSlotsType;
     M4LToastContainer: ToastContainerSlotsType;
   }
@@ -23,6 +34,8 @@ declare module '@mui/material/styles' {
   interface ComponentsPropsList {
     // Extend ComponentsProps or ComponentsOwnerState(this extend ComponentProps)
     M4LDynamicFilter: Partial<DynamicFilterOwnerState>;
+    M4LMenuActions: Partial<MenuActionsOwnerState>;
+    M4LRHFInputNumberSpinner: Partial<RHFInputNumberSpinnerOwnerState>;
     M4LPopupsViewer: Partial<PopupsViewerOwnerState>;
     M4LToastContainer: Partial<ToastContainerOwnerState>;
   }
@@ -33,15 +46,25 @@ declare module '@mui/material/styles' {
       styleOverrides?: ComponentsOverrides<Theme>['M4LDynamicFilter'];
       variants?: ComponentsVariants['M4LDynamicFilter'];
     };
-    M4LPopupsViewer?: {
-      defaultProps?: ComponentsPropsList['M4LPopupsViewer'];
-      styleOverrides?: ComponentsOverrides<Theme>['M4LPopupsViewer'];
-      variants?: ComponentsVariants['M4LPopupsViewer'];
+    M4LMenuActions?: {
+      defaultProps?: ComponentsPropsList['M4LMenuActions'];
+      styleOverrides?: ComponentsOverrides<Theme>['M4LMenuActions'];
+      variants?: ComponentsVariants['M4LMenuActions'];
     };
-    M4LToastContainer?: {
-      defaultProps?: ComponentsPropsList['M4LToastContainer'];
-      styleOverrides?: ComponentsOverrides<Theme>['M4LToastContainer'];
-      variants?: ComponentsVariants['M4LToastContainer'];
+    M4LRHFInputNumberSpinner?: {
+      defaultProps?: ComponentsPropsList['M4LRHFInputNumberSpinner'];
+      styleOverrides?: ComponentsOverrides<Theme>['M4LRHFInputNumberSpinner'];
+      variants?: ComponentsVariants['M4LRHFInputNumberSpinner'];
+      M4LPopupsViewer?: {
+        defaultProps?: ComponentsPropsList['M4LPopupsViewer'];
+        styleOverrides?: ComponentsOverrides<Theme>['M4LPopupsViewer'];
+        variants?: ComponentsVariants['M4LPopupsViewer'];
+      };
+      M4LToastContainer?: {
+        defaultProps?: ComponentsPropsList['M4LToastContainer'];
+        styleOverrides?: ComponentsOverrides<Theme>['M4LToastContainer'];
+        variants?: ComponentsVariants['M4LToastContainer'];
+      };
     };
   }
 }

package/components/AccountPopover/{index.af5aae0e.js → index-vXlaw69C.js}

@@ -3,16 +3,17 @@ import { useEnvironment, useModuleDictionary, useNetwork } from "@m4l/core";
 import { useState, useEffect } from "react";
 import { generateUtilityClasses, generateUtilityClass, styled, useTheme, ButtonBase } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { A as Avatar } from "../mui_extended/Avatar/index.e7bcc850.js";
-import { C as CircularProgress } from "../mui_extended/CircularProgress/index.967e70b7.js";
-import { P as Popover } from "../mui_extended/Popover/index.a7da93f1.js";
-import { I as Icon } from "../Icon/index.c06685f4.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
+import { A as Avatar } from "../mui_extended/Avatar/index-n5hK7nJD.js";
+import { C as CircularProgress } from "../mui_extended/CircularProgress/index-Bnnti_G6.js";
+import { P as Popover } from "../mui_extended/Popover/index-BnKsmvtw.js";
+import { I as Icon } from "../Icon/index-CueLDD9j.js";
 import clsx from "clsx";
 const componentName = "M4LAccountPopover";
 generateUtilityClasses(
   componentName,
   [
+    /* elements */
     "root",
     "containerUserName",
     "containerUserEmail",
@@ -30,6 +31,7 @@ generateUtilityClasses(
     "containerProgress",
     "logOut",
     "menuItem"
+    /* states or variants of elements */
   ]
 );
 function getAccountPopoverClassesUtilityClass(slot) {

package/components/AppBar/{index.b8f22046.js → index-3gXtikUI.js}

@@ -1,25 +1,27 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { A as AppBarRoot } from "../../styles/index.db9e7ddb.js";
+import { A as AppBarRoot } from "../../styles/index-C-MsxWtr.js";
 import { useResponsiveContainerStore } from "@m4l/graphics";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { I as Image } from "../Image/index.ae542f70.js";
-import { T as Typography } from "../mui_extended/Typography/index.8c0801e4.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.7b6c1ee3.js";
+import { I as Image } from "../Image/index-By5vsRzf.js";
+import { T as Typography } from "../mui_extended/Typography/index-W88rbpsJ.js";
+import { I as IconButton } from "../mui_extended/IconButton/index-OMq0pPK0.js";
 const APPBAR_PREFIX = "M4LAppBar";
 const getNameDataTestId = (KEY) => {
   return `${APPBAR_PREFIX}-${KEY}`;
 };
 const componentName = "M4LAppBar";
 generateUtilityClasses(componentName, [
+  /* elements */
   "root",
   "containerChilds",
   "containerIconMenuToggle",
   "iconMenuToggle",
   "containerLogo",
   "containerImageTypography"
+  /* states or variants of elements */
 ]);
 function getAppBarClassesUtilityClass(slot) {
   return generateUtilityClass(componentName, slot);

package/components/BaseModule/{index.f7a04fe7.js → index-CtN6b__U.js}

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { FlagsProvider, ModuleDictionaryProvider, ModuleSkeletonProvider, ModulePrivilegesProvider } from "@m4l/core";
 import { useLocales } from "@m4l/graphics";
-import { M as ModalProvider } from "../../contexts/ModalContext/index.799110fe.js";
+import { M as ModalProvider } from "../../contexts/ModalContext/index-DkUBXDpR.js";
 function BaseModule(props) {
   const {
     children,

package/components/CommonActions/components/ActionCancel/{index.e67885bc.js → index-D_42VfUR.js}

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.3d14e3e9.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.f674be30.js";
+import { B as Button } from "../../../mui_extended/Button/index-CksGG1B8.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index-ChW1FuFf.js";
 const ActionCancel = (props) => {
   const { getLabel } = useModuleDictionary();
   const classes = useCommonActionsUtilityClasses();

package/components/CommonActions/components/ActionFormCancel/{index.92988013.js → index-DL7fDBi6.js}

@@ -1,12 +1,12 @@
 import { jsx } from "react/jsx-runtime";
 import { useFormContext, useFormState } from "react-hook-form";
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.3d14e3e9.js";
+import { B as Button } from "../../../mui_extended/Button/index-CksGG1B8.js";
 import { useCallback, useEffect } from "react";
-import { u as useModal } from "../../../../hooks/useModal/index.eb857f6e.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.f674be30.js";
-import { u as useWindowToolsMF } from "../../../areas/hooks/useWindowToolsMF/index.2fbae9dc.js";
-import { W as WindowConfirm } from "../../../modal/WindowConfirm.abf49573.js";
+import { u as useModal } from "../../../../hooks/useModal/index-CTAwKk5D.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index-ChW1FuFf.js";
+import { u as useWindowToolsMF } from "../../../areas/hooks/useWindowToolsMF/index-BECQfhbC.js";
+import { W as WindowConfirm } from "../../../modal/WindowConfirm-BaB3Ojgu.js";
 function ActionFormCancel() {
   const { getLabel } = useModuleDictionary();
   const { openModal } = useModal();

package/components/CommonActions/components/ActionFormIntro/{index.f8867ae9.js → index-i3HmOpoU.js}

@@ -2,8 +2,8 @@ import { jsx } from "react/jsx-runtime";
 import { useFormContext, useFormState } from "react-hook-form";
 import { useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { Skeleton } from "@mui/material";
-import { L as LoadingButton } from "../../../mui_extended/Button/index.3d14e3e9.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.f674be30.js";
+import { L as LoadingButton } from "../../../mui_extended/Button/index-CksGG1B8.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index-ChW1FuFf.js";
 function ActionFormIntro(props) {
   const { getLabel } = useModuleDictionary();
   const isSkeleton = useModuleSkeleton();

package/components/CommonActions/components/ActionIntro/{index.e58eb0c4.js → index-i5875EXe.js}

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.3d14e3e9.js";
-import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock.86c553a9.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.f674be30.js";
+import { B as Button } from "../../../mui_extended/Button/index-CksGG1B8.js";
+import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock-CF-669v-.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index-ChW1FuFf.js";
 const ACTIONINTRO_TEST_ID = "m4lactions";
 const ActionIntro = (props) => {
   const { getLabel } = useModuleDictionary();

package/components/CommonActions/components/Actions/{index.f674be30.js → index-ChW1FuFf.js}

@@ -1,11 +1,11 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import clsx from "clsx";
-import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock.86c553a9.js";
+import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock-CF-669v-.js";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../../utils/index.f77cc2ab.js";
-import { W as WrapperStandarActions } from "../../../../styles/index.db9e7ddb.js";
+import { g as getComponentUtilityClass } from "../../../../utils/index-DiMrtgIu.js";
+import { W as WrapperStandarActions } from "../../../../styles/index-C-MsxWtr.js";
 function getCommonActionsDictionary() {
   return ["common_actions"];
 }
@@ -21,6 +21,7 @@ const componentName = "M4LCommonActions";
 generateUtilityClasses(
   componentName,
   [
+    /* elements */
     "root",
     "skeleton",
     "actionCancel",
@@ -28,6 +29,7 @@ generateUtilityClasses(
     "actionFormIntro",
     "actionIntro",
     "wrapperActions"
+    /* states or variants of elements */
   ]
 );
 const useCommonActionsUtilityClasses = () => {

package/components/DataGrid/formatters/ColumnBooleanFormatter/{index.89a59c52.js → index-BjkuIa7y.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
-import { B as BooleanFormatter } from "../../../formatters/BooleanFormatter/index.91435984.js";
+import { B as BooleanFormatter } from "../../../formatters/BooleanFormatter/index-Bc2l6GTX.js";
 function ColumnBooleanFormatter(props) {
   const { fieldValue, presentationType, Component } = props;
   return (obProps) => {

package/components/DataGrid/formatters/ColumnConcatenatedValueFormatter/{index.d619d1db.js → index-CWQp1KWU.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
-import { C as ConcatenatedFormatter } from "../../../formatters/index.64017cc1.js";
+import { C as ConcatenatedFormatter } from "../../../formatters/index-Botdzyt2.js";
 function ColumnConcatenatedValueFormatter(props) {
   const { fieldValue, fieldSeparator, Component } = props;
   return (obProps) => {

package/components/DataGrid/formatters/ColumnDateFormatter/{index.e00d0cf2.js → index-CKg8CJ6A.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
-import { D as DateFormatter } from "../../../formatters/DateFormatter/index.2ef6f261.js";
+import { D as DateFormatter } from "../../../formatters/DateFormatter/index-CGcRZ8BA.js";
 function ColumnDateFormatter(props) {
   const { fieldValue, presentationType, Component } = props;
   return (obProps) => {

package/components/DataGrid/formatters/ColumnInteractiveCheckFormatter/{index.557bc8a5.js → index-DggW8-4n.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { Checkbox } from "@mui/material";
-import { d as dataGridClasses } from "../../index.b37d6cab.js";
+import { d as dataGridClasses } from "../../index-EgaRUtbL.js";
 function ColumnInteractiveCheckFormatter(props) {
   const { row, onRowChange, column } = props;
   const handleChange = () => {

package/components/DataGrid/formatters/ColumnNestedValueFormatter/{index.880e743b.js → index-BslXGK-A.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
-import { W as WrapperComponent } from "../../../WrapperComponent/index.57964195.js";
+import { W as WrapperComponent } from "../../../WrapperComponent/index-BHV-CsDU.js";
 function ColumnNestedValueFormatter(props) {
   const { fieldValue, Component = WrapperComponent } = props;
   return (obProps) => {

package/components/DataGrid/formatters/ColumnPointsFormatter/{index.ab152484.js → index-BXGW2CsK.js}

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { P as PointsFormatter } from "../../../formatters/PointsFormatter/index.51cd6774.js";
+import { P as PointsFormatter } from "../../../formatters/PointsFormatter/index-C7sR8iqk.js";
 function ColumnPointsFormatter(props) {
   return (obProps) => {
     return /* @__PURE__ */ jsx(PointsFormatter, { obProps, ...props });

package/components/DataGrid/formatters/ColumnPriceFormatter/{index.bf9d9e60.js → index-O11tBykn.js}

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { P as PriceFormatter } from "../../../formatters/PriceFormatter/index.97f75b4b.js";
+import { P as PriceFormatter } from "../../../formatters/PriceFormatter/index-CsvRawmc.js";
 function ColumnPriceFormatter(props) {
   return (obProps) => {
     return /* @__PURE__ */ jsx(PriceFormatter, { obProps, ...props });

package/components/DataGrid/formatters/ColumnSetCheckFormatter/{index.4045b2f2.js → index-BaCawLr1.js}

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { S as SelectCellFormatter } from "../../../../react-data-grid.c5377916.js";
+import { S as SelectCellFormatter } from "../../../../react-data-grid-BfYuZ6AK.js";
 function ColumnSetCheckFormatter(parameters) {
   const { field, disabledGetter, rowKeyGetter, useHook } = parameters;
   const formatter = (props) => {

package/components/DataGrid/formatters/ColumnUncertaintyFormatter/{index.a87302d1.js → index-Cq7a-jnE.js}

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { U as UncertaintyFormatter } from "../../../formatters/UncertaintyFormatter/index.c3ffdebc.js";
+import { U as UncertaintyFormatter } from "../../../formatters/UncertaintyFormatter/index-B9ESVEVp.js";
 function ColumnUncertaintyFormatter(props) {
   return (obProps) => {
     return /* @__PURE__ */ jsx(UncertaintyFormatter, { obProps, ...props });

package/components/DataGrid/formatters/{index.06c18753.js → index-B3AsHKeD.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
-import { d as dataGridClasses } from "../index.b37d6cab.js";
-import { I as Icon } from "../../Icon/index.c06685f4.js";
+import { d as dataGridClasses } from "../index-EgaRUtbL.js";
+import { I as Icon } from "../../Icon/index-CueLDD9j.js";
 function ColumnIconFormatter(props) {
   const { getIconUrl } = props;
   return (obProps) => {

package/components/DataGrid/{index.b37d6cab.js → index-EgaRUtbL.js}

@@ -1,18 +1,18 @@
-import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index.a57ee020.js";
-import { g as getPagerComponentsDictionary } from "../mui_extended/Pager/index.b28a2103.js";
+import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index-KryIxH_j.js";
+import { g as getPagerComponentsDictionary } from "../mui_extended/Pager/index-k7SRq6Jo.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { a as WrapperSkeleton, D as DataGridRoot } from "../../styles/index.db9e7ddb.js";
+import { a as WrapperSkeleton, D as DataGridRoot } from "../../styles/index-C-MsxWtr.js";
 import { forwardRef, createContext, useState, useMemo, useEffect, useCallback, useContext, useRef, useLayoutEffect } from "react";
-import { u as useRowSelection, S as SelectCellFormatter, H as HeaderRenderer, D as DataGrid$1 } from "../../react-data-grid.c5377916.js";
+import { u as useRowSelection, S as SelectCellFormatter, H as HeaderRenderer, D as DataGrid$1 } from "../../react-data-grid-BfYuZ6AK.js";
 import { useDrag, useDrop, DndProvider } from "react-dnd";
 import { HTML5Backend } from "react-dnd-html5-backend";
 import { SvgIcon, Checkbox, InputBase, Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { D as DATAGRID_SELECT_COLUMN_KEY, c as componentName, a as DATAGRID_PREFIX_NAME } from "./constants.e334cd50.js";
+import { D as DATAGRID_SELECT_COLUMN_KEY, c as componentName, a as DATAGRID_PREFIX_NAME } from "./constants-8L7QgBKi.js";
 import { voidFunction, useModuleDictionary, useModuleSkeleton, getPropertyByString } from "@m4l/core";
-import { A as ActionsColumn, a as Actions } from "./subcomponents/Actions/index.c3b1c1e2.js";
+import { A as ActionsColumn, a as Actions } from "./subcomponents/Actions/index-BF4pV_-K.js";
 import { unstable_composeClasses } from "@mui/base";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { g as getNameDataTestId } from "../../test/getNameDataTestId.0faeade8.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
+import { g as getNameDataTestId } from "../../test/getNameDataTestId-BaBTWhBr.js";
 function CheckboxIcon(props) {
   return /* @__PURE__ */ jsx(SvgIcon, { ...props, children: /* @__PURE__ */ jsx("path", { d: "M17 3a4 4 0 014 4v10a4 4 0 01-4 4H7a4 4 0 01-4-4V7a4 4 0 014-4h10zm0 2H7a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2z" }) });
 }
@@ -23,6 +23,7 @@ function CheckboxIndeterminateIcon(props) {
   return /* @__PURE__ */ jsx(SvgIcon, { ...props, children: /* @__PURE__ */ jsx("path", { d: "M17 3a4 4 0 014 4v10a4 4 0 01-4 4H7a4 4 0 01-4-4V7a4 4 0 014-4h10zm-1.75 8h-6.5a.75.75 0 00-.75.75v.5c0 .414.336.75.75.75h6.5a.75.75 0 00.75-.75v-.5a.75.75 0 00-.75-.75z" }) });
 }
 const CheckboxFormatter = forwardRef(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   function CheckboxFormatter2({ onChange, checked, ...props }, _ref) {
     function handleChange(e) {
       onChange(e.target.checked, e.nativeEvent.shiftKey);
@@ -149,7 +150,10 @@ function DataGridProvider(props) {
     /* @__PURE__ */ new Map()
   );
   const [columnsConfig, setColumnsConfigOptions] = useState(
-    () => []
+    () => (
+      //
+      []
+    )
   );
   const [rowsFilterCount, setRowFilterCount] = useState(rowsCount);
   const [currentRowHeightVariant, setCurrentRowHeightVariant] = useState(() => {
@@ -192,8 +196,7 @@ function DataGridProvider(props) {
   );
   const onChangeColumnsOrder = useCallback(
     (sourceKey, targetKey) => {
-      if (sourceKey === targetKey)
-        return;
+      if (sourceKey === targetKey) return;
       const sourceColumnIndex = columnsConfig.findIndex((c) => c.key === sourceKey);
       const targetColumnIndex = columnsConfig.findIndex((c) => c.key === targetKey);
       const reorderedColumnsConfig = [...columnsConfig];
@@ -263,8 +266,7 @@ function DataGridProvider(props) {
 }
 function useDataGrid() {
   const context = useContext(DataGridContext);
-  if (!context)
-    throw new Error("useDataGrid context must be use inside DataGridContext");
+  if (!context) throw new Error("useDataGrid context must be use inside DataGridContext");
   return context;
 }
 const filterColumnClassName = "filter-cell";
@@ -306,8 +308,7 @@ function SelectFormatter(props) {
 const SelectColumnHeaderRenderer = (props) => {
   const { rows, rowKeyGetter, onCheckedRowsChange, checkedRows } = useDataGrid();
   const onAllRowsCheckedChange = (checked) => {
-    if (!onCheckedRowsChange)
-      return;
+    if (!onCheckedRowsChange) return;
     if (checked) {
       onCheckedRowsChange(new Set(rows.map((r) => rowKeyGetter(r))));
     } else {
@@ -339,8 +340,7 @@ const SelectColumn = {
 function useFocusRef(isSelected) {
   const ref = useRef(null);
   useLayoutEffect(() => {
-    if (!isSelected)
-      return;
+    if (!isSelected) return;
     ref.current?.focus({ preventScroll: true });
   }, [isSelected]);
   return {
@@ -414,14 +414,12 @@ function DraggableHeaderRenderer(props) {
   });
   const handleChange = (e) => {
     if (activeFilters) {
-      if (onChangeFilter)
-        onChangeFilter(column, e.target.value);
+      if (onChangeFilter) onChangeFilter(column, e.target.value);
     }
     setFilter(e.target.value);
   };
   useEffect(() => {
-    if (!activeFilters)
-      setFilter("");
+    if (!activeFilters) setFilter("");
   }, [activeFilters]);
   const newColumn = { ...column };
   if (newColumn.withinHeaderRenderer) {
@@ -441,9 +439,12 @@ function DraggableHeaderRenderer(props) {
         display: "flex",
         flexDirection: "column",
         lineHeight: "1",
+        // activeFilters && column.withFilter ? '30px' : '60px',
         height: "100%",
         justifyContent: "center",
         textAlign: "center"
+        // alignItems: 'center',
+        // justifyContent: 'space-evenly'
       },
       children: [
         /* @__PURE__ */ jsx(HeaderRenderer, { column: newColumn, isCellSelected, ...others }),
@@ -456,7 +457,9 @@ function DraggableHeaderRenderer(props) {
               width: "100%",
               display: "flex",
               alignItems: "center",
+              // flexGrow: 1,
               height: `${filterHeight}px`
+              // paddingLeft: '2px', paddingRight: '2px'
             },
             children: /* @__PURE__ */ jsx(
               InputBase,
@@ -522,7 +525,10 @@ const getInOrderColumns = (columns, hasCheckedRows, columnsConfig, columnsWidths
     const visible = columnConfigIndex > -1 ? columnsConfig[columnConfigIndex].visible : true;
     return !column.hidden && visible;
   }).sort(
-    (a, b) => getColumIndex(a.key, columnsConfig) - getColumIndex(b.key, columnsConfig)
+    (a, b) => (
+      // Sort for index
+      getColumIndex(a.key, columnsConfig) - getColumIndex(b.key, columnsConfig)
+    )
   ).map((columnSorted) => {
     const columnConfigIndex = getColumIndex(columnSorted.key, columnsConfig);
     return {
@@ -577,6 +583,7 @@ const useSortColumnsRows = (sourceColumns, sourceRows) => {
       getInOrderColumns(
         sourceColumns,
         !!checkedRows && !!onCheckedRowsChange,
+        //Si están seteados se habilita el múltipe
         columnsConfig,
         columnsWidths,
         rowActionsGetter
@@ -615,8 +622,7 @@ const useSortColumnsRows = (sourceColumns, sourceRows) => {
   }, [isSkeleton, columns, activeFilters, onChangeColumnsOrder]);
   const finalRows = useMemo(() => {
     const nextRows = sourceRows.filter((r) => {
-      if (!filters || filters.size === 0)
-        return true;
+      if (!filters || filters.size === 0) return true;
       const iterator = filters.entries();
       let valReturn = true;
       for (let i = 0; i < filters.size; i++) {
@@ -641,8 +647,7 @@ const useSortColumnsRows = (sourceColumns, sourceRows) => {
         } catch (error) {
           continue;
         }
-        if (!valReturn)
-          break;
+        if (!valReturn) break;
       }
       return valReturn;
     });
@@ -728,6 +733,7 @@ function Table(props) {
   ) }) }) });
 }
 const dataGridClasses = generateUtilityClasses(componentName, [
+  /* elements */
   "root",
   "actions",
   "withPager",
@@ -752,6 +758,7 @@ const dataGridClasses = generateUtilityClasses(componentName, [
   "actionsConfigContainer",
   "booleanFormatter",
   "iconFormatter",
+  /* states or variants of elements */
   "withActions"
 ]);
 function getDataGridUtilityClass(slot) {

package/components/DataGrid/subcomponents/Actions/{index.c3b1c1e2.js → index-BF4pV_-K.js}

@@ -1,21 +1,21 @@
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import { M as MenuActions } from "../../../mui_extended/MenuActions/index.11d777bb.js";
-import { u as useDataGrid, a as useFilters, b as dictionary } from "../../index.b37d6cab.js";
+import { u as useDataGrid, a as useFilters, b as dictionary } from "../../index-EgaRUtbL.js";
 import { useTheme, Skeleton } from "@mui/material";
-import { b as DATAGRID_ACTIONS_COLUMN_KEY } from "../../constants.e334cd50.js";
-import { P as Pager } from "../../../mui_extended/Pager/index.b28a2103.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index.7b6c1ee3.js";
+import { b as DATAGRID_ACTIONS_COLUMN_KEY } from "../../constants-8L7QgBKi.js";
+import { M as MenuActions } from "../../../mui_extended/MenuActions/index-De7dpdBH.js";
+import { P as Pager } from "../../../mui_extended/Pager/index-k7SRq6Jo.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index-OMq0pPK0.js";
 import { useEnvironment, useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { useIsMobile, useResponsiveContainerStore } from "@m4l/graphics";
 import { forwardRef, useRef, useState, useImperativeHandle, useMemo, useEffect, useCallback } from "react";
-import { b as WrapperColumnsConfig, c as DivSelColumns, d as WrapperDataGrid, C as ColumnActions, D as DataGridRoot } from "../../../../styles/index.db9e7ddb.js";
-import { D as DataGrid$1 } from "../../../../react-data-grid.c5377916.js";
-import { C as ColumnInteractiveCheckFormatter } from "../../formatters/ColumnInteractiveCheckFormatter/index.557bc8a5.js";
-import { u as useModal } from "../../../../hooks/useModal/index.eb857f6e.js";
-import { W as WindowBase } from "../../../modal/WindowBase.00b9e5f1.js";
-import { A as Actions$1 } from "../../../CommonActions/components/Actions/index.f674be30.js";
-import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.e67885bc.js";
-import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.e58eb0c4.js";
+import { b as WrapperColumnsConfig, c as DivSelColumns, d as WrapperDataGrid, C as ColumnActions, D as DataGridRoot } from "../../../../styles/index-C-MsxWtr.js";
+import { D as DataGrid$1 } from "../../../../react-data-grid-BfYuZ6AK.js";
+import { C as ColumnInteractiveCheckFormatter } from "../../formatters/ColumnInteractiveCheckFormatter/index-DggW8-4n.js";
+import { u as useModal } from "../../../../hooks/useModal/index-CTAwKk5D.js";
+import { W as WindowBase } from "../../../modal/WindowBase-Ce6yRLcN.js";
+import { A as Actions$1 } from "../../../CommonActions/components/Actions/index-ChW1FuFf.js";
+import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index-D_42VfUR.js";
+import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index-i5875EXe.js";
 import { shallow } from "zustand/shallow";
 function ActionsFormatter(props) {
   const { rowActionsGetter, classes } = useDataGrid();
@@ -40,6 +40,7 @@ function ActionsFormatter(props) {
 }
 const ActionsColumn = {
   key: DATAGRID_ACTIONS_COLUMN_KEY,
+  // name: getLabel(dictionary.LABEL_ACTIONS),
   name: getActionLabel(),
   width: 32,
   minWidth: 32,
@@ -157,16 +158,14 @@ const ColumnsConfig = forwardRef((props, ref) => {
   }, [columnsConfig]);
   const rowSelectedIndex = useMemo(() => {
     let rowIndex = -1;
-    if (selRows.size !== 1)
-      return rowIndex;
+    if (selRows.size !== 1) return rowIndex;
     const iterator = selRows.entries();
     const entry = iterator.next().value[1];
     rowIndex = rows.findIndex((row) => row.key === entry);
     return rowIndex;
   }, [rows, selRows]);
   const handleMoveFirst = () => {
-    if (rowSelectedIndex === -1)
-      return -1;
+    if (rowSelectedIndex === -1) return -1;
     const newRows = [...rows];
     newRows.splice(rowSelectedIndex, 1);
     newRows.splice(0, 0, rows[rowSelectedIndex]);
@@ -174,8 +173,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
     setRows(newRows);
   };
   const handleMoveLast = () => {
-    if (rowSelectedIndex === -1)
-      return -1;
+    if (rowSelectedIndex === -1) return -1;
     const newRows = [...rows];
     newRows.splice(rowSelectedIndex, 1);
     newRows.splice(newRows.length, 0, rows[rowSelectedIndex]);
@@ -183,8 +181,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
     setRows(newRows);
   };
   const handleMoveUpDownd = (position) => {
-    if (rowSelectedIndex === -1)
-      return -1;
+    if (rowSelectedIndex === -1) return -1;
     const newRows = [...rows];
     const element = newRows[rowSelectedIndex];
     newRows.splice(rowSelectedIndex, 1);
@@ -198,6 +195,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
       return {
         visible: rows[rowIndexFinded].visible,
         frozen: rows[rowIndexFinded].frozen
+        // index: rowIndexFinded,
       };
     }
     return void 0;
@@ -230,8 +228,7 @@ const ColumnsConfig = forwardRef((props, ref) => {
     setRows(newRows);
   };
   const onRowClick = (row) => {
-    if (selRows.has(row.key))
-      return;
+    if (selRows.has(row.key)) return;
     const mySet = /* @__PURE__ */ new Set([row.key]);
     setSelRows(mySet);
   };
@@ -374,11 +371,10 @@ const useModalSettings = () => {
   };
   return onClickSettings;
 };
-const useModalSettings$1 = useModalSettings;
 function Settings() {
   const { host_static_assets, environment_assets } = useEnvironment();
   const { classes } = useDataGrid();
-  const modalSettings = useModalSettings$1();
+  const modalSettings = useModalSettings();
   return /* @__PURE__ */ jsx(
     IconButton,
     {
@@ -468,7 +464,7 @@ const MobileMenuActions = () => {
   const { host_static_assets, environment_assets } = useEnvironment();
   const { currentRowHeightVariant, setRowHeightVariant } = useDataGrid();
   const { activeFilters, setActiveFilters } = useFilters();
-  const modalSettings = useModalSettings$1();
+  const modalSettings = useModalSettings();
   const toggleIcon = () => {
     setActiveFilters(!activeFilters);
   };

package/components/DataGrid/subcomponents/editors/TextEditor/{index.3f0d9e28.js → index-BIFm8akr.js}

@@ -6,12 +6,16 @@ const Input = styled("input")(() => ({
   inlineSize: "100%",
   blockSize: "100%",
   paddingBlock: "0",
+  /* padding-inline: 6px; */
+  /* border: 2px solid #ccc; */
   verticalAlign: "top",
   textAlign: "right",
   color: "var(--rdg-color)",
   backgroundColor: "var(--rdg-background-color)",
   fontFamily: "inherit",
+  // fontSize: 'var(--rdg-font-size)',
   "&:focus": {
+    // borderColor: 'var(--rdg-selection-color)',
     outline: "none"
   },
   "&::placeholder": {