@m4l/components 0.2.13 → 0.2.15

package/components/DataGrid/{index.387652a9.js → index.e127cac8.js}

@@ -1,103 +1,20 @@
+import { SvgIcon, Checkbox, InputBase, Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index.a30831c9.js";
+import { g as getPagerComponentsDictionary } from "../mui_extended/Pager/index.9928807e.js";
 import { styled } from "@mui/material/styles";
-import { forwardRef, createContext, useState, useMemo, useEffect, useCallback, useContext, useRef, useLayoutEffect, useImperativeHandle } from "react";
+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 { useDrag, useDrop, DndProvider } from "react-dnd";
 import { HTML5Backend } from "react-dnd-html5-backend";
-import { SvgIcon, Checkbox, InputBase, useTheme, Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { voidFunction, useModuleDictionary, useModuleSkeleton, getPropertyByString, useEnvironment } from "@m4l/core";
-import { M as MenuActions } from "../mui_extended/MenuActions/index.cc54c35c.js";
-import { g as getPagerComponentsDictionary, P as Pager } from "../mui_extended/Pager/index.5fbbefe2.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.5afe56b7.js";
+import { voidFunction, useModuleDictionary, useModuleSkeleton, getPropertyByString } from "@m4l/core";
+import { A as ActionsColumn, a as Actions } from "./subcomponents/Actions/index.5947f820.js";
 import { unstable_composeClasses } from "@mui/base";
-import { u as useModal } from "../../hooks/useModal/index.8acace45.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.82313aef.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.c70ae272.js";
-import "../../react-draggable.ee21cb7e.js";
-import "../Resizeable/index.6478d7d8.js";
-import { useResponsiveDesktop } from "@m4l/graphics";
-import "../modal/index.ac0c9093.js";
-import "../animate/index.4e9774a6.js";
-import "framer-motion";
-import "react-router-dom";
-import "../animate/LoadingScreen/index.1d0c4307.js";
-import "../animate/PropagateLoader/index.7fab43c8.js";
-import "zustand";
-import "../areas/contexts/AreasContext/index.cffa1526.js";
-import "../areas/components/AreasAdmin/index.c1539c1b.js";
-import "zustand/shallow";
-import "../ScrollBar/index.010f1b9d.js";
-import "../mui_extended/Accordion/index.3087f40e.js";
-import "../Icon/index.e215d0f0.js";
-import "clsx";
-import "../mui_extended/Typography/index.443590d6.js";
-import "../mui_extended/Avatar/index.75e6ed57.js";
-import "@mui/material/Button";
-import "../mui_extended/Button/index.0f2552ed.js";
-import "../mui_extended/CheckBox.38abccd8.js";
-import "../mui_extended/Badge/index.b09524fe.js";
-import "../Image/index.d684bdf2.js";
-import "@mui/lab";
-import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Stack/index.0e53197c.js";
-import "../mui_extended/Tab/index.ae9ea641.js";
-import "../mui_extended/Tooltip/index.5a795dcd.js";
-import "../areas/components/AreasViewer/index.e084d8e9.js";
-import "../LinearProgressIndeterminate/index.a0ad2d9e.js";
-import "../LoadingError/index.b3e4e8e5.js";
-import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
-import "zustand/middleware/immer";
-import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
-import "react-hook-form";
-import "../hook-form/RHFAutocomplete/index.01a8f57e.js";
-import "../HelperText/index.918bba47.js";
-import "../../node_modules.79f5ed2f.js";
-import "lodash-es/debounce";
-import "lodash-es/each";
-import "../hook-form/RHFColorPicker/index.c7695748.js";
-import "lodash/debounce";
-import "../hook-form/RHFAutocompleteAsync/index.df1d5bca.js";
-import "../hook-form/RHFCheckbox/index.23fc4851.js";
-import "@mui/x-date-pickers";
-import "../hook-form/RHFDateTime/index.984b803f.js";
-import "../hook-form/RHFTextField/index.1167879e.js";
-import "../hook-form/RHFPeriod/index.1852e7d3.js";
-import "../Period/index.3bd05e05.js";
-import { A as Actions$1 } from "../CommonActions/components/Actions/index.93e9112b.js";
-import "lodash/isString";
-import "react-dropzone";
-import "../hook-form/RHFUpload/index.49edcb02.js";
-import { C as ConcatenatedFormatter } from "../formatters/index.4426a315.js";
-import "../DynamicFilter/index.9e9885b0.js";
-import "yup";
-import "../../contexts/RHFormContext/index.7769076a.js";
-import "../GridLayout/subcomponents/Griditem/index.8e4af155.js";
-import "../GridLayout/index.68093cfb.js";
-import "fast-equals";
-import "lodash";
-import "../PrintingSystem/index.70234425.js";
-import "../LanguagePopover/index.424bad09.js";
-import "../MFLoader/index.3d17dfc3.js";
-import "../NavLink/index.ed4c0609.js";
-import "../NoItemSelected/index.5ed80b8e.js";
-import "../ObjectLogs/index.3a939c6b.js";
-import "../../react-json-view.5636414a.js";
-import "../PaperForm/index.013ed28b.js";
-import "../PDFViewer/index.4d16e5bc.js";
-import "../Page/index.890fbaac.js";
-import "../PropertyValue/index.45482ca3.js";
-import "../SplitLayout/index.30fd5861.js";
-import "../../react-splitter-layout.c5d98bf7.js";
-import "../ToastContainer/index.5e729fbb.js";
-import "../SideBar/index.614f85fb.js";
-import "../AppBar/index.c8e7b25c.js";
-import "../AccountPopover/index.7060320a.js";
-import { W as WindowBase } from "../modal/WindowBase.8e3e5337.js";
-import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index.40f6571e.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { g as getNameDataTestId } from "../../vendor.f0742647.js";
-import { B as BooleanFormatter } from "../formatters/BooleanFormatter/index.5ed55bda.js";
+import { g as getNameDataTestId } from "../../test/getNameDataTestId.14875ec7.js";
+import { B as BooleanFormatter } from "../formatters/BooleanFormatter/index.fcc47dfd.js";
 import { D as DateFormatter } from "../formatters/DateFormatter/index.578a9f53.js";
+import { C as ConcatenatedFormatter } from "../formatters/index.7d5cbac9.js";
 const DataGridRoot = styled("div")(({
   theme
 }) => ({
@@ -245,8 +162,8 @@ function DataGridProvider(props) {
     rows,
     rowsCount,
     rowActionsGetter,
-    rowHeights = [28, 32, 36],
-    rowHeaderHeights = [28, 32, 36],
+    rowHeights = [36, 52, 67],
+    rowHeaderHeights = [44, 63, 75],
     initialRowHeightVariant = "compact",
     checkedRows,
     onCheckedRowsChange,
@@ -614,48 +531,6 @@ const getDragHeaderRenderer = (handleColumnsReorder) => {
   }
   return HeaderRenderer2;
 };
-function ActionsFormatter(props) {
-  const {
-    rowActionsGetter,
-    classes
-  } = useDataGrid();
-  const theme = useTheme();
-  if (rowActionsGetter === void 0) {
-    return /* @__PURE__ */ jsx(Fragment, {});
-  }
-  return /* @__PURE__ */ jsx(MenuActions, {
-    arrowType: "top-left",
-    objItem: props.row,
-    menuActions: rowActionsGetter,
-    className: classes.actionsFormatter,
-    menuActionSx: theme.components?.M4LDataGridActionsFormatter?.styleOverrides,
-    marginTop: 1,
-    marginLeft: "-11px",
-    anchorOrigin: {
-      vertical: "bottom",
-      horizontal: "left"
-    },
-    transformOrigin: {
-      vertical: "top",
-      horizontal: "left"
-    }
-  });
-}
-const ActionsColumn = {
-  key: DATAGRID_ACTIONS_COLUMN_KEY,
-  name: getActionLabel(),
-  width: 60,
-  isDraggable: false,
-  withFilter: false,
-  resizable: true,
-  sortable: false,
-  frozen: true,
-  type: "custom",
-  formatter: ActionsFormatter
-};
-function getActionLabel() {
-  return "";
-}
 const WrapperSkeleton = styled("div")(() => ({
   display: "flex",
   width: "100%",
@@ -942,72 +817,6 @@ function Table(props) {
     })
   });
 }
-function Filter() {
-  const {
-    activeFilters,
-    setActiveFilters
-  } = useFilters();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  const {
-    classes
-  } = useDataGrid();
-  const toggleIcon = () => {
-    setActiveFilters(!activeFilters);
-  };
-  return /* @__PURE__ */ jsx(IconButton, {
-    dictionaryTooltipId: activeFilters ? "data_grid.tooltip_filter_hide" : "data_grid.tooltip_filter_show",
-    className: classes.actionFilter,
-    onClick: toggleIcon,
-    "aria-label": "filter",
-    src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/filter.svg`
-  });
-}
-const WrapperColumnsConfig = styled("div")(({ theme }) => ({
-  color: theme.palette.text.primary,
-  position: "relative",
-  display: "flex",
-  flexDirection: "column",
-  height: "100%",
-  width: "100%"
-}));
-styled("div")(({ theme }) => ({
-  color: theme.palette.text.primary,
-  fontSize: theme.typography.h4.fontSize
-}));
-const DivSelColumns = styled("div")(({ theme }) => ({
-  ...theme.typography.bodyDens,
-  color: theme.palette.text.primary,
-  padding: `16px 8px`
-}));
-const WrapperDataGrid = styled("div")(() => ({
-  position: "relative",
-  display: "flex",
-  flexDirection: "column",
-  flexGrow: 1,
-  overflow: "auto"
-}));
-styled("div")(() => ({
-  display: "flex",
-  flexDirection: "row"
-}));
-const ColumnActions = styled("div")(() => ({
-  paddingTop: "16px",
-  paddingBottom: "8px",
-  display: "flex",
-  flexDirection: "row"
-}));
-styled("div")(({ theme }) => ({
-  paddingTop: theme.spacing(3),
-  display: "flex",
-  flexDirection: "row",
-  justifyContent: "flex-end",
-  "& > button": {
-    marginLeft: "10px"
-  }
-}));
 const componentName = "M4LDataGrid";
 const dataGridClasses = generateUtilityClasses(componentName, [
   "root",
@@ -1089,434 +898,6 @@ function ColumnInteractiveCheckFormatterColumn(props) {
     className: dataGridClasses.formatterColumn
   });
 }
-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
-  }));
-}
-const ColumnsConfig = forwardRef((props, ref) => {
-  const refdata_grid = useRef(null);
-  const {
-    onCloseSettings,
-    columnsConfig,
-    onChangeColumnsConfig,
-    classes
-  } = props;
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const [isInit, setIsInit] = useState(true);
-  const [rows, setRows] = useState(getRowsFromColumnsConfig(columnsConfig));
-  const [selRows, setSelRows] = useState(() => /* @__PURE__ */ new Set());
-  const divRef = useRef(null);
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  useImperativeHandle(ref, () => ({
-    onClickIntro: handleIntro,
-    current: divRef.current
-  }));
-  const columnsdata_grid = useMemo(() => [{
-    key: "name",
-    name: getLabel("data_grid.settings_column_name"),
-    width: 200,
-    resizable: true,
-    type: "string"
-  }, {
-    key: "originalIndex",
-    name: getLabel("data_grid.settings_column_position"),
-    width: 50,
-    type: "number",
-    cellClass: "rdg-cell-align-center"
-  }, {
-    key: "visible",
-    name: getLabel("data_grid.settings_column_visible"),
-    width: 80,
-    type: "boolean",
-    formatter: ColumnInteractiveCheckFormatterColumn,
-    cellClass: "rdg-cell-align-center"
-  }, {
-    key: "frozen",
-    name: getLabel("data_grid.settings_column_frozen"),
-    width: 80,
-    type: "boolean",
-    formatter: ColumnInteractiveCheckFormatterColumn,
-    cellClass: "rdg-cell-align-center"
-  }], [getLabel]);
-  const checkAll = () => {
-    setRows(rows.map((row) => ({
-      ...row,
-      visible: true
-    })));
-  };
-  const unCheckAll = () => {
-    setRows(rows.map((row) => ({
-      ...row,
-      visible: false
-    })));
-  };
-  const restoreAll = () => {
-    setRows(rows.map((row) => ({
-      ...row,
-      visible: row.originalVisible,
-      frozen: row.originalFrozen,
-      index: row.originalIndex
-    })).sort((a, b) => a.index - b.index));
-  };
-  useEffect(() => {
-    if (isInit === false) {
-      setRows(getRowsFromColumnsConfig(columnsConfig));
-    }
-    setIsInit(false);
-  }, [columnsConfig]);
-  const rowSelectedIndex = useMemo(() => {
-    let rowIndex = -1;
-    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;
-    const newRows = [...rows];
-    newRows.splice(rowSelectedIndex, 1);
-    newRows.splice(0, 0, rows[rowSelectedIndex]);
-    refdata_grid.current?.selectCell({
-      idx: 0,
-      rowIdx: 0
-    });
-    setRows(newRows);
-  };
-  const handleMoveLast = () => {
-    if (rowSelectedIndex === -1)
-      return -1;
-    const newRows = [...rows];
-    newRows.splice(rowSelectedIndex, 1);
-    newRows.splice(newRows.length, 0, rows[rowSelectedIndex]);
-    refdata_grid.current?.selectCell({
-      idx: 0,
-      rowIdx: newRows.length - 1
-    });
-    setRows(newRows);
-  };
-  const handleMoveUpDownd = (position) => {
-    if (rowSelectedIndex === -1)
-      return -1;
-    const newRows = [...rows];
-    const element = newRows[rowSelectedIndex];
-    newRows.splice(rowSelectedIndex, 1);
-    newRows.splice(rowSelectedIndex + position, 0, element);
-    refdata_grid.current?.selectCell({
-      idx: 0,
-      rowIdx: rowSelectedIndex + position
-    });
-    setRows(newRows);
-  };
-  const getColumnConfigByKey2 = (key) => {
-    const rowIndexFinded = rows.findIndex((row) => row.key === key);
-    if (rowIndexFinded > -1) {
-      return {
-        visible: rows[rowIndexFinded].visible,
-        frozen: rows[rowIndexFinded].frozen
-      };
-    }
-    return void 0;
-  };
-  const getRowIndex = (column) => {
-    const rowIndexFinded = rows.findIndex((row) => row.key === column.key);
-    if (rowIndexFinded > -1) {
-      return rowIndexFinded;
-    }
-    return columnsConfig.findIndex((columnConfig) => columnConfig.key === column.key);
-  };
-  const handleIntro = () => {
-    const newColumnsConfig = columnsConfig.map((columnConfig) => {
-      const newColumnConfig = {
-        ...columnConfig
-      };
-      if (!columnConfig.hidden) {
-        const columnConfigRow = getColumnConfigByKey2(columnConfig.key);
-        if (columnConfigRow) {
-          newColumnConfig.visible = columnConfigRow.visible;
-          newColumnConfig.frozen = columnConfigRow.frozen;
-        }
-      }
-      return newColumnConfig;
-    }).sort((a, b) => getRowIndex(a) - getRowIndex(b));
-    onChangeColumnsConfig(newColumnsConfig);
-    onCloseSettings();
-  };
-  const onInternalSelectedRowsChange = () => {
-  };
-  const onInternalRowsChange = (newRows) => {
-    setRows(newRows);
-  };
-  const onRowClick = (row) => {
-    if (selRows.has(row.key))
-      return;
-    const mySet = /* @__PURE__ */ new Set([row.key]);
-    setSelRows(mySet);
-  };
-  return /* @__PURE__ */ jsxs(WrapperColumnsConfig, {
-    ref: divRef,
-    className: classes.columnsConfigContainer,
-    children: [/* @__PURE__ */ jsx(DivSelColumns, {
-      className: classes.columnsLabelSetColumns,
-      children: getLabel("data_grid.settings_sel_columns")
-    }), /* @__PURE__ */ jsx(WrapperDataGrid, {
-      className: classes.columnsConfigContent,
-      children: /* @__PURE__ */ jsx("div", {
-        className: classes.wrapperDataGridCss,
-        children: /* @__PURE__ */ jsx(DataGrid$1, {
-          className: classes.columnsConfigGrid,
-          ref: refdata_grid,
-          columns: columnsdata_grid,
-          rows,
-          onRowsChange: onInternalRowsChange,
-          selectedRows: selRows,
-          onSelectedRowsChange: onInternalSelectedRowsChange,
-          onRowClick,
-          rowKeyGetter: (row) => row.key,
-          cellNavigationMode: "CHANGE_ROW",
-          defaultColumnOptions: {
-            resizable: true,
-            sortable: true
-          }
-        })
-      })
-    }), /* @__PURE__ */ jsxs(ColumnActions, {
-      className: classes.columnsConfigActions,
-      children: [/* @__PURE__ */ jsx(IconButton, {
-        tooltip: getLabel("data_grid.settings_move_first"),
-        onClick: handleMoveFirst,
-        "aria-label": "move first place",
-        disabled: rowSelectedIndex < 1,
-        src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_first_place.svg`
-      }), /* @__PURE__ */ jsx(IconButton, {
-        tooltip: getLabel("data_grid.settings_move_up"),
-        dictionaryTooltipId: "data_grid.settings_move_up",
-        onClick: () => handleMoveUpDownd(-1),
-        "aria-label": "move up place",
-        disabled: rowSelectedIndex < 1,
-        src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_up_place.svg`
-      }), /* @__PURE__ */ jsx(IconButton, {
-        tooltip: getLabel("data_grid.settings_move_last"),
-        onClick: handleMoveLast,
-        "aria-label": "move last place",
-        disabled: !!(rowSelectedIndex === rows.length - 1 || rowSelectedIndex === -1),
-        src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_last_place.svg`
-      }), /* @__PURE__ */ jsx(IconButton, {
-        tooltip: getLabel("data_grid.settings_move_down"),
-        onClick: () => handleMoveUpDownd(1),
-        "aria-label": "move down place",
-        disabled: !!(rowSelectedIndex === rows.length - 1 || rowSelectedIndex === -1),
-        src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_down_place.svg`
-      }), /* @__PURE__ */ jsx(IconButton, {
-        tooltip: getLabel("data_grid.settings_visible_all"),
-        onClick: checkAll,
-        "aria-label": "check visible all",
-        src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/check_all.svg`
-      }), /* @__PURE__ */ jsx(IconButton, {
-        tooltip: getLabel("data_grid.settings_no_visible_all"),
-        onClick: unCheckAll,
-        "aria-label": "un check all",
-        src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/uncheck_all.svg`
-      }), /* @__PURE__ */ jsx(IconButton, {
-        tooltip: getLabel("data_grid.settings_restore"),
-        onClick: restoreAll,
-        "aria-label": "Restore columns",
-        src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/restore_columns.svg`
-      })]
-    })]
-  });
-});
-ColumnsConfig.displayName = "ColumnsConfig";
-function Settings() {
-  const {
-    openModal,
-    closeModal
-  } = useModal();
-  const {
-    columnsConfig,
-    onChangeColumnsConfig
-  } = useDataGrid();
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  const isDesktop = useResponsiveDesktop();
-  const {
-    classes
-  } = useDataGrid();
-  const ref = useRef(null);
-  const onCloseSettings = useCallback(() => {
-    closeModal();
-  }, [closeModal]);
-  const onClickIntro = useCallback(() => {
-    if (ref.current?.onClickIntro) {
-      ref.current?.onClickIntro();
-    }
-  }, []);
-  const onClickSettings = useCallback(() => {
-    openModal({
-      initialWidth: 500,
-      initialHeigth: 680,
-      fullScreen: !isDesktop ? true : false,
-      window: /* @__PURE__ */ jsxs(WindowBase, {
-        title: getLabel("data_grid.settings_title"),
-        urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/configuration.svg`,
-        children: [/* @__PURE__ */ jsx(DataGridRoot, {
-          className: classes.root,
-          children: /* @__PURE__ */ jsx("div", {
-            className: classes.tableContaniner,
-            style: {
-              inset: "0"
-            },
-            children: /* @__PURE__ */ jsx("div", {
-              className: classes.wrapperDataGridCss,
-              children: /* @__PURE__ */ jsx(ColumnsConfig, {
-                ref,
-                columnsConfig,
-                onChangeColumnsConfig,
-                onCloseSettings,
-                classes
-              })
-            })
-          })
-        }), /* @__PURE__ */ jsxs(Actions$1, {
-          children: [/* @__PURE__ */ jsx(ActionCancel, {
-            onClick: closeModal
-          }), /* @__PURE__ */ jsx(ActionIntro, {
-            onClick: onClickIntro
-          })]
-        })]
-      })
-    });
-  }, [closeModal, columnsConfig, getLabel, onChangeColumnsConfig, onCloseSettings, openModal, onClickIntro]);
-  return /* @__PURE__ */ jsx(IconButton, {
-    className: classes.actionSettings,
-    dictionaryTooltipId: "data_grid.tooltip_settings",
-    onClick: onClickSettings,
-    "aria-label": "settings",
-    src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/configuration.svg`
-  });
-}
-function RowsCount() {
-  const {
-    rowsCount,
-    classes
-  } = useDataGrid();
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const isSkeleton = useModuleSkeleton();
-  return /* @__PURE__ */ jsx("div", {
-    className: classes.rowsCount,
-    children: !isSkeleton ? /* @__PURE__ */ jsxs(Fragment, {
-      children: [/* @__PURE__ */ jsx("div", {
-        className: classes.rowsCountLabel,
-        children: getLabel("data_grid.rows")
-      }), /* @__PURE__ */ jsx("div", {
-        className: classes.rowsCountValue,
-        children: rowsCount
-      })]
-    }) : /* @__PURE__ */ jsxs(Fragment, {
-      children: [/* @__PURE__ */ jsx("div", {
-        className: classes.rowsCountLabel,
-        children: /* @__PURE__ */ jsx(Skeleton, {
-          variant: "text",
-          width: "40px",
-          height: "16px"
-        })
-      }), /* @__PURE__ */ jsx("div", {
-        className: classes.rowsCountValue,
-        children: /* @__PURE__ */ jsx(Skeleton, {
-          variant: "text",
-          width: "20px",
-          height: "16px"
-        })
-      })]
-    })
-  });
-}
-function Density() {
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  const {
-    rowHeights,
-    currentRowHeightVariant,
-    setRowHeightVariant,
-    classes
-  } = useDataGrid();
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const menuActions = useMemo(() => {
-    if (typeof rowHeights === "number") {
-      return [];
-    }
-    return [{
-      urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/compact.svg`,
-      onClick: () => setRowHeightVariant("compact"),
-      disabled: currentRowHeightVariant === "compact",
-      dictionaryField: "data_grid.density_compact"
-    }, {
-      urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/standard.svg`,
-      onClick: () => setRowHeightVariant("standard"),
-      disabled: currentRowHeightVariant === "standard",
-      dictionaryField: "data_grid.density_standard"
-    }, {
-      urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/confortable.svg`,
-      onClick: () => setRowHeightVariant("confortable"),
-      disabled: currentRowHeightVariant === "confortable",
-      dictionaryField: "data_grid.density_confortable"
-    }];
-  }, [rowHeights, currentRowHeightVariant, setRowHeightVariant, host_static_assets, environment_assets]);
-  const theme = useTheme();
-  const currenViewIcon = useMemo(() => {
-    if (currentRowHeightVariant === "compact") {
-      return `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/compact.svg`;
-    }
-    if (currentRowHeightVariant === "standard") {
-      return `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/standard.svg`;
-    }
-    return `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/confortable.svg`;
-  }, [currentRowHeightVariant, host_static_assets, environment_assets]);
-  if (menuActions.length === 0) {
-    return /* @__PURE__ */ jsx(Fragment, {});
-  }
-  return /* @__PURE__ */ jsx(MenuActions, {
-    arrowType: "right-top",
-    className: classes.actionDensityPopover,
-    menuActionSx: theme.components?.M4LDataGridDensityPopover?.styleOverrides,
-    anchorOrigin: {
-      vertical: "top",
-      horizontal: "left"
-    },
-    transformOrigin: {
-      vertical: "top",
-      horizontal: "right"
-    },
-    menuActions,
-    urlIcon: currenViewIcon,
-    toolTip: getLabel("data_grid.tooltip_density")
-  });
-}
 function getDataGridComponentsDictionary() {
   return ["data_grid"].concat(getPagerComponentsDictionary()).concat(getModalDialogComponentsDictionary());
 }
@@ -1525,41 +906,6 @@ const dictionary = {
   LABEL_ROWS_PER_PAGE: "pager.rows_per_page",
   LABEL_OF: "pager.of"
 };
-function Actions(props) {
-  const isDesktop = useResponsiveDesktop();
-  const {
-    rowHeights,
-    classes
-  } = useDataGrid();
-  const isSkeleton = useModuleSkeleton();
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    withRowsCount = true,
-    withPager = true,
-    pagerOptions,
-    withSettings = true,
-    settingsProps,
-    withLocalFilters
-  } = props;
-  return /* @__PURE__ */ jsxs("div", {
-    className: classes.actions,
-    children: [withRowsCount && isDesktop && /* @__PURE__ */ jsx(RowsCount, {}), withPager && pagerOptions && /* @__PURE__ */ jsx(Pager, {
-      ...pagerOptions,
-      totalRecords: pagerOptions.totalRecords,
-      isSkeleton,
-      isDesktop,
-      labelRows: getLabel(dictionary.LABEL_ROWS_PER_PAGE),
-      labelOf: getLabel(dictionary.LABEL_OF)
-    }), /* @__PURE__ */ jsxs("div", {
-      className: classes.actionsConfigContainer,
-      children: [typeof rowHeights !== "number" && /* @__PURE__ */ jsx(Density, {}), withLocalFilters && /* @__PURE__ */ jsx(Filter, {}), withSettings && /* @__PURE__ */ jsx(Settings, {
-        ...settingsProps
-      })]
-    })]
-  });
-}
 const DATAGRID_TEST_ID = "m4ldatagrid";
 const PREFIX_TEST_ATTRIBUTE = "data-testid";
 const TEST_PROP_COLUMNS = `${PREFIX_TEST_ATTRIBUTE}-${DATAGRID_TEST_ID}-columns`;
@@ -1691,64 +1037,6 @@ function columnConcatenatedValuesFormatter(props) {
     });
   };
 }
-const Input = styled("input")(() => ({
-  appearance: "none",
-  boxSizing: "border-box",
-  inlineSize: "100%",
-  blockSize: "100%",
-  paddingBlock: "0",
-  verticalAlign: "top",
-  textAlign: "right",
-  color: "var(--rdg-color)",
-  backgroundColor: "var(--rdg-background-color)",
-  fontFamily: "inherit",
-  "&:focus": {
-    outline: "none"
-  },
-  "&::placeholder": {
-    color: "#999",
-    opacity: "1"
-  }
-}));
-function autoFocusAndSelect(input) {
-  input?.focus();
-  input?.select();
-}
-function TextEditor({
-  row,
-  column,
-  onRowChange,
-  onClose
-}) {
-  return /* @__PURE__ */ jsx(Input, {
-    className: "rdg-text-editor",
-    ref: autoFocusAndSelect,
-    value: row[column.key],
-    onChange: (event) => onRowChange({
-      ...row,
-      [column.key]: event.target.value
-    }),
-    onBlur: () => onClose(true)
-  });
-}
-function NumberEditor({
-  row,
-  column,
-  onRowChange,
-  onClose
-}) {
-  return /* @__PURE__ */ jsx(Input, {
-    className: "rdg-text-editor",
-    ref: autoFocusAndSelect,
-    type: "number",
-    value: row[column.key],
-    onChange: (event) => onRowChange({
-      ...row,
-      [column.key]: event.target.value !== "" ? Number(event.target.value) : ""
-    }),
-    onBlur: () => onClose(true)
-  });
-}
 const getDataGridRowsFromSet = (set, rows, rowKeyGetter) => {
   const rowsFinded = [];
   if (set) {
@@ -1766,13 +1054,47 @@ const getDataGridRowsFromSet = (set, rows, rowKeyGetter) => {
   }
   return rowsFinded;
 };
+function ColumnSetCheckFormatter(parameters) {
+  const {
+    field,
+    rowKeyGetter,
+    useHook
+  } = parameters;
+  const formatter = (props) => {
+    const {
+      row
+    } = props;
+    const [checkedRows, setCheckedRows] = useHook(field);
+    const onChange = (checked, _isShiftClick) => {
+      const newCheckedRows = new Set(checkedRows);
+      if (checked) {
+        newCheckedRows.add(rowKeyGetter(props.row));
+      } else {
+        newCheckedRows.delete(rowKeyGetter(props.row));
+      }
+      setCheckedRows(newCheckedRows);
+    };
+    return /* @__PURE__ */ jsx(SelectCellFormatter, {
+      value: checkedRows.has(rowKeyGetter(row)) || false,
+      isCellSelected: props.isCellSelected,
+      onChange,
+      "aria-label": "Select"
+    });
+  };
+  return formatter;
+}
 export {
-  DataGrid as D,
-  NumberEditor as N,
-  TextEditor as T,
-  getDataGridRowsFromSet as a,
-  columnDateFormatter as b,
-  columnBooleanFormatter as c,
-  columnConcatenatedValuesFormatter as d,
-  getDataGridComponentsDictionary as g
+  ColumnInteractiveCheckFormatterColumn as C,
+  DATAGRID_ACTIONS_COLUMN_KEY as D,
+  useFilters as a,
+  DataGridRoot as b,
+  DataGrid as c,
+  dictionary as d,
+  ColumnSetCheckFormatter as e,
+  columnDateFormatter as f,
+  getDataGridComponentsDictionary as g,
+  getDataGridRowsFromSet as h,
+  columnBooleanFormatter as i,
+  columnConcatenatedValuesFormatter as j,
+  useDataGrid as u
 };