@m4l/components 0.1.70 → 0.1.72

package/@types/export.d.ts

@@ -65,6 +65,8 @@ declare module '@mui/material/styles' {
 
     interface ComponentNameToClassKey {
         M4LDynamicFilter: DynamicFilterClassesKey;
+        M4LDynamicFilterPopoverFilter: DynamicFilterClassesKey;
+        M4LDynamicFilterPopoverMenuFields: DynamicFilterClassesKey;
         M4LRHFTextField: RHFTextFieldClassesKey;
         M4LRHFTextFieldPassword: RHFTextFieldPasswordClassesKey;
         M4LRHFAutocomplete: RHFAutocompleteClassesKey;
@@ -82,6 +84,8 @@ declare module '@mui/material/styles' {
         M4LoadingButton: LoadingbuttonClassesKey;
         M4LNavLink: ButtonBaseClassKey;
         M4LSideBar: SideBarClassesKey;
+        M4LSideBarPopover: SideBarClassesKey;
+        M4LSideBarDrawer: SideBarClassesKey;
         M4LRHFDateTime: RHFDateTimeClassesKey;
         M4LAreasViewer: AreasViewerClassesKey;
         M4LAreasAdmin: AreasAdminClassesKey;
@@ -100,6 +104,14 @@ declare module '@mui/material/styles' {
             styleOverrides?: ComponentsOverrides<Theme>['M4LDynamicFilter'];
             defaultProps?: ComponentsProps['M4LDynamicFilter'];
         };
+        M4LDynamicFilterPopoverFilter?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LDynamicFilterPopoverFilter'];
+            defaultProps?: ComponentsProps['M4LDynamicFilterPopoverFilter'];
+        };
+        M4LDynamicFilterPopoverMenuFields?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LDynamicFilterPopoverMenuFields'];
+            defaultProps?: ComponentsProps['M4LDynamicFilterPopoverMenuFields'];
+        };
         M4LRHFTextField?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LRHFTextField'];
             defaultProps?: ComponentsProps['M4LRHFTextField'];
@@ -172,6 +184,14 @@ declare module '@mui/material/styles' {
             styleOverrides?: ComponentsOverrides<Theme>['M4LSideBar'];
             defaultProps?: ComponentsProps['M4LSideBar'];
         };
+        M4LSideBarPopover?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LSideBarPopover'];
+            defaultProps?: ComponentsProps['M4LSideBarPopover'];
+        };
+        M4LSideBarDrawer?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LSideBarPopover'];
+            defaultProps?: ComponentsProps['M4LSideBarPopover'];
+        };
         M4LAreasViewer?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LAreasViewer'];
         };

package/components/CommonActions/components/ActionCancel/{index.9d521b2a.js → index.07ba5a89.js}

@@ -1,6 +1,6 @@
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.f8ce9ccd.js";
-import { u as useUtilityClasses } from "../Actions/index.154d7cb6.js";
+import { B as Button } from "../../../mui_extended/Button/index.1cd0c4e4.js";
+import { u as useUtilityClasses } from "../Actions/index.e190561b.js";
 import { jsx } from "react/jsx-runtime";
 const ActionCancel = (props) => {
   const {

package/components/CommonActions/components/ActionFormCancel/{index.4756457f.js → index.9bdae569.js}

@@ -1,37 +1,39 @@
 import { useFormContext, useFormState } from "react-hook-form";
 import { useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { Skeleton } from "@mui/material";
-import { B as Button } from "../../../mui_extended/Button/index.f8ce9ccd.js";
+import { B as Button } from "../../../mui_extended/Button/index.1cd0c4e4.js";
 import { useCallback } from "react";
-import { u as useModal } from "../../../../hooks/useModal/index.d590f506.js";
-import "../../../../react-draggable.0d64c8b1.js";
-import "../../../ModalDialog/index.cdfd1ae8.js";
-import "../../../Resizeable/index.aafda79e.js";
+import { u as useModal } from "../../../../hooks/useModal/index.18a7cb8f.js";
+import "../../../../react-draggable.21aa9ee1.js";
+import "../../../ModalDialog/index.75ddf6de.js";
+import "../../../Resizeable/index.086ff29e.js";
 import { jsx } from "react/jsx-runtime";
 import "@m4l/graphics";
-import { W as WindowConfirm } from "../../../modal/WindowConfirm.e21763cb.js";
-import "../../../modal/WindowBase.6a40a945.js";
-import "../../../Icon/index.caaed284.js";
-import "../../../mui_extended/IconButton/index.57824447.js";
+import "../../../Icon/index.9839297c.js";
 import "clsx";
-import "../../../mui_extended/Accordion/index.437bb3f8.js";
+import { W as WindowConfirm } from "../../../modal/WindowConfirm.b89712de.js";
+import "../../../modal/WindowBase.e5ec6128.js";
+import "../../../mui_extended/IconButton/index.590049b4.js";
+import "../../../mui_extended/Accordion/index.d420b666.js";
 import "../../../mui_extended/Avatar/index.fe06afd7.js";
 import "react-router-dom";
-import "../../../Image/index.82a6cd46.js";
+import "../../../Image/index.a88f6341.js";
 import "@mui/lab";
-import "../../../mui_extended/Typography/index.b3c6e71c.js";
-import "../../../mui_extended/Popover/index.226f247e.js";
-import "../../../mui_extended/MenuActions/index.37043326.js";
-import "../../../mui_extended/Pager/index.eeed3bd5.js";
+import "../../../mui_extended/Typography/index.1659d310.js";
+import "../../../mui_extended/Popover/index.9f35d0eb.js";
+import "../../../mui_extended/MenuActions/index.f9eb6463.js";
+import "../../../mui_extended/Pager/index.c058b933.js";
 import "../../../mui_extended/Tab/index.e0653a0a.js";
 import "zustand";
-import "../../../areas/contexts/AreasContext/index.de8b4e78.js";
-import "../../../areas/components/index.359c2b18.js";
+import "../../../areas/contexts/AreasContext/index.0b50676d.js";
+import "../../../areas/components/AreasAdmin/index.218451cf.js";
 import "zustand/shallow";
+import "../../../ScrollBar/index.bbe48f4d.js";
+import "../../../areas/components/AreasViewer/index.51ee3d38.js";
 import "../../../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../../../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
-import { u as useWindowToolsMF } from "../../../areas/hooks/index.ae8d8631.js";
-import { u as useUtilityClasses } from "../Actions/index.154d7cb6.js";
+import { u as useWindowToolsMF } from "../../../areas/hooks/useWindowToolsMF/index.b7afaf88.js";
+import { u as useUtilityClasses } from "../Actions/index.e190561b.js";
 function ActionFormCancel() {
   const {
     getLabel

package/components/CommonActions/components/ActionFormIntro/{index.40321b1b.js → index.e077d11f.js}

@@ -1,8 +1,8 @@
 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.f8ce9ccd.js";
-import { u as useUtilityClasses } from "../Actions/index.154d7cb6.js";
+import { L as LoadingButton } from "../../../mui_extended/Button/index.1cd0c4e4.js";
+import { u as useUtilityClasses } from "../Actions/index.e190561b.js";
 import { jsx } from "react/jsx-runtime";
 function ActionFormIntro(props) {
   const {

package/components/CommonActions/components/ActionIntro/{index.1ba5b02b.js → index.a454d0e4.js}

@@ -1,7 +1,7 @@
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.f8ce9ccd.js";
-import { T as TEST_PROP_ID } from "../../../../vendor.8edaef93.js";
-import { u as useUtilityClasses } from "../Actions/index.154d7cb6.js";
+import { B as Button } from "../../../mui_extended/Button/index.1cd0c4e4.js";
+import { T as TEST_PROP_ID } from "../../../../vendor.d194839d.js";
+import { u as useUtilityClasses } from "../Actions/index.e190561b.js";
 import { jsx } from "react/jsx-runtime";
 const ACTIONINTRO_TEST_ID = "m4lactions";
 const ActionIntro = (props) => {

package/components/CommonActions/components/Actions/{index.154d7cb6.js → index.e190561b.js}

@@ -1,37 +1,39 @@
 import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../../utils/index.a2312a73.js";
+import { g as getComponentUtilityClass } from "../../../../utils/index.8608d16c.js";
 import { styled } from "@mui/material/styles";
 import "@m4l/core";
 import "@mui/material/Button";
-import "../../../mui_extended/Button/index.f8ce9ccd.js";
+import "../../../mui_extended/Button/index.1cd0c4e4.js";
 import "clsx";
 import "react-hook-form";
 import "react";
-import "../../../../contexts/ModalContext/index.8e3cd7a8.js";
-import "../../../../react-draggable.0d64c8b1.js";
-import "../../../ModalDialog/index.cdfd1ae8.js";
-import "../../../Resizeable/index.aafda79e.js";
+import "../../../../contexts/ModalContext/index.92e80136.js";
+import "../../../../react-draggable.21aa9ee1.js";
+import "../../../ModalDialog/index.75ddf6de.js";
+import "../../../Resizeable/index.086ff29e.js";
 import "@m4l/graphics";
+import "../../../Icon/index.9839297c.js";
 import "@mui/lab";
-import "../../../mui_extended/Typography/index.b3c6e71c.js";
-import "../../../modal/WindowConfirm.e21763cb.js";
-import "../../../Icon/index.caaed284.js";
-import "../../../modal/WindowBase.6a40a945.js";
-import "../../../mui_extended/IconButton/index.57824447.js";
-import "../../../mui_extended/Accordion/index.437bb3f8.js";
+import "../../../mui_extended/Typography/index.1659d310.js";
+import "../../../modal/WindowConfirm.b89712de.js";
+import "../../../modal/WindowBase.e5ec6128.js";
+import "../../../mui_extended/IconButton/index.590049b4.js";
+import "../../../mui_extended/Accordion/index.d420b666.js";
 import "../../../mui_extended/Avatar/index.fe06afd7.js";
 import "react-router-dom";
-import "../../../Image/index.82a6cd46.js";
-import "../../../mui_extended/Popover/index.226f247e.js";
-import "../../../mui_extended/MenuActions/index.37043326.js";
-import "../../../mui_extended/Pager/index.eeed3bd5.js";
+import "../../../Image/index.a88f6341.js";
+import "../../../mui_extended/Popover/index.9f35d0eb.js";
+import "../../../mui_extended/MenuActions/index.f9eb6463.js";
+import "../../../mui_extended/Pager/index.c058b933.js";
 import "../../../mui_extended/Tab/index.e0653a0a.js";
 import "zustand";
-import "../../../areas/contexts/AreasContext/index.de8b4e78.js";
-import "../../../areas/components/index.359c2b18.js";
+import "../../../areas/contexts/AreasContext/index.0b50676d.js";
+import "../../../areas/components/AreasAdmin/index.218451cf.js";
 import "zustand/shallow";
+import "../../../ScrollBar/index.bbe48f4d.js";
+import "../../../areas/components/AreasViewer/index.51ee3d38.js";
 import "../../../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../../../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
 const componentName = "M4LCommonActions";

package/components/DataGrid/{index.2f4a0e64.js → index.549bd646.js}

@@ -6,35 +6,37 @@ import { HTML5Backend } from "react-dnd-html5-backend";
 import { SvgIcon, Checkbox, InputBase, Skeleton } 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.37043326.js";
-import { g as getPagerComponentsDictionary, P as Pager } from "../mui_extended/Pager/index.eeed3bd5.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.57824447.js";
-import { u as useModal } from "../../hooks/useModal/index.d590f506.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.9d521b2a.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.1ba5b02b.js";
-import "../../react-draggable.0d64c8b1.js";
-import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index.cdfd1ae8.js";
-import "../Resizeable/index.aafda79e.js";
+import { M as MenuActions } from "../mui_extended/MenuActions/index.f9eb6463.js";
+import { g as getPagerComponentsDictionary, P as Pager } from "../mui_extended/Pager/index.c058b933.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.590049b4.js";
+import { u as useModal } from "../../hooks/useModal/index.18a7cb8f.js";
+import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.07ba5a89.js";
+import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.a454d0e4.js";
+import "../../react-draggable.21aa9ee1.js";
+import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index.75ddf6de.js";
+import "../Resizeable/index.086ff29e.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
-import { A as Actions$1 } from "../CommonActions/components/Actions/index.154d7cb6.js";
+import "../Icon/index.9839297c.js";
+import "clsx";
+import { A as Actions$1 } from "../CommonActions/components/Actions/index.e190561b.js";
 import "react-hook-form";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.f8ce9ccd.js";
-import "clsx";
+import "../mui_extended/Button/index.1cd0c4e4.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.de8b4e78.js";
-import "../areas/components/index.359c2b18.js";
+import "../areas/contexts/AreasContext/index.0b50676d.js";
+import "../areas/components/AreasAdmin/index.218451cf.js";
 import "zustand/shallow";
-import "../Icon/index.caaed284.js";
+import "../ScrollBar/index.bbe48f4d.js";
+import "../areas/components/AreasViewer/index.51ee3d38.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
 import "@mui/lab";
-import "../mui_extended/Typography/index.b3c6e71c.js";
-import "../modal/WindowConfirm.e21763cb.js";
-import { W as WindowBase } from "../modal/WindowBase.6a40a945.js";
-import { B as BooleanFormatter } from "../formatters/BooleanFormatter/index.7eb0498c.js";
+import "../mui_extended/Typography/index.1659d310.js";
+import "../modal/WindowConfirm.b89712de.js";
+import { W as WindowBase } from "../modal/WindowBase.e5ec6128.js";
+import { B as BooleanFormatter } from "../formatters/BooleanFormatter/index.e610de08.js";
 import { D as DateFormatter } from "../formatters/DateFormatter/index.578a9f53.js";
-import { C as ConcatenatedFormatter } from "../formatters/index.f6b9ed01.js";
+import { C as ConcatenatedFormatter } from "../formatters/index.982e909b.js";
 const WrapperGrid = styled("div")(() => ({
   display: "flex",
   flexDirection: "column",

package/components/DynamicFilter/{index.789ab474.js → index.c1a3e2f1.js}

@@ -4,57 +4,58 @@ import { useContext, useMemo, useEffect, createContext, useRef, createElement, u
 import clsx from "clsx";
 import { useModuleDictionary, useEnvironment, useModuleSkeleton, useFlagsPresent, CommonFlags } from "@m4l/core";
 import { useResponsiveDesktop, useFirstRender, useFormatter } from "@m4l/graphics";
-import { I as IconButton } from "../mui_extended/IconButton/index.57824447.js";
-import { T as TEST_PROP_ID } from "../../vendor.8edaef93.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.590049b4.js";
+import { T as TEST_PROP_ID } from "../../vendor.d194839d.js";
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { generateUtilityClasses, alpha, styled as styled$1, Skeleton, MenuItem } from "@mui/material";
-import { L as LabelMemuItem } from "../mui_extended/MenuActions/index.37043326.js";
-import { P as Popover } from "../mui_extended/Popover/index.226f247e.js";
-import { I as Icon } from "../Icon/index.caaed284.js";
+import { L as LabelMemuItem } from "../mui_extended/MenuActions/index.f9eb6463.js";
+import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
+import { I as Icon } from "../Icon/index.9839297c.js";
+import { styled, useTheme } from "@mui/material/styles";
 import { R as RHFormProvider } from "../../contexts/RHFormContext/index.a7511399.js";
-import { g as getCommonActionsDictionary, A as Actions } from "../CommonActions/components/Actions/index.154d7cb6.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.9d521b2a.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.1ba5b02b.js";
+import { g as getCommonActionsDictionary, A as Actions } from "../CommonActions/components/Actions/index.e190561b.js";
+import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.07ba5a89.js";
+import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.a454d0e4.js";
 import { useFormContext, useWatch } from "react-hook-form";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.f8ce9ccd.js";
-import "../../contexts/ModalContext/index.8e3cd7a8.js";
-import "../../react-draggable.0d64c8b1.js";
-import "../ModalDialog/index.cdfd1ae8.js";
-import "../Resizeable/index.aafda79e.js";
-import "../modal/WindowConfirm.e21763cb.js";
-import "../modal/WindowBase.6a40a945.js";
-import "../mui_extended/Accordion/index.437bb3f8.js";
+import "../mui_extended/Button/index.1cd0c4e4.js";
+import "../../contexts/ModalContext/index.92e80136.js";
+import "../../react-draggable.21aa9ee1.js";
+import "../ModalDialog/index.75ddf6de.js";
+import "../Resizeable/index.086ff29e.js";
+import "../modal/WindowConfirm.b89712de.js";
+import "../modal/WindowBase.e5ec6128.js";
+import "../mui_extended/Accordion/index.d420b666.js";
 import "../mui_extended/Avatar/index.fe06afd7.js";
 import "react-router-dom";
-import "../Image/index.82a6cd46.js";
+import "../Image/index.a88f6341.js";
 import "@mui/lab";
-import { T as Typography } from "../mui_extended/Typography/index.b3c6e71c.js";
-import "../mui_extended/Pager/index.eeed3bd5.js";
+import { T as Typography } from "../mui_extended/Typography/index.1659d310.js";
+import "../mui_extended/Pager/index.c058b933.js";
 import "../mui_extended/Tab/index.e0653a0a.js";
 import { useStore, createStore } from "zustand";
-import "../areas/contexts/AreasContext/index.de8b4e78.js";
-import "../areas/components/index.359c2b18.js";
+import "../areas/contexts/AreasContext/index.0b50676d.js";
+import "../areas/components/AreasAdmin/index.218451cf.js";
+import "../areas/components/AreasViewer/index.51ee3d38.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass, i as isValidDate } from "../../utils/index.a2312a73.js";
+import { g as getComponentUtilityClass, i as isValidDate } from "../../utils/index.8608d16c.js";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
-import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.09c400c3.js";
+import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.b185393e.js";
 import "lodash/debounce";
-import "../hook-form/RHFAutocompleteAsync/index.e8acff04.js";
-import "../hook-form/RHFCheckbox/index.70310f35.js";
-import "../HelperText/index.a69e9509.js";
+import "../hook-form/RHFAutocompleteAsync/index.7a569646.js";
+import "../hook-form/RHFCheckbox/index.7a9ea396.js";
+import "../HelperText/index.4c27bfc1.js";
 import "@mui/x-date-pickers";
-import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.7b815072.js";
-import { R as RHFTextField } from "../hook-form/RHFTextField/index.d4c39859.js";
-import "../hook-form/RHFPeriod/index.3c7d393c.js";
-import "../Period/index.fbf074d3.js";
+import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.2fd1d56b.js";
+import { R as RHFTextField } from "../hook-form/RHFTextField/index.e1b50c30.js";
+import "../hook-form/RHFPeriod/index.df3d3f69.js";
+import "../Period/index.2ab4f2a1.js";
 import "lodash/isString";
 import "react-dropzone";
-import { styled } from "@mui/material/styles";
-import "../hook-form/RHFUpload/index.31044674.js";
+import "../hook-form/RHFUpload/index.ec977af6.js";
 import * as Yup from "yup";
 import "@hookform/resolvers/yup";
 const COMPONENT_CLASS_NAME = "M4LDynamicFilter";
@@ -142,19 +143,6 @@ const useUtilityClasses = (ownerState) => {
   };
   return unstable_composeClasses(slots, getComponentUtilityClass(COMPONENT_CLASS_NAME), {});
 };
-const ContainerBooleanFilter = styled("div")(({
-  theme
-}) => ({
-  display: "flex",
-  flexDirection: "column",
-  justifyContent: "center",
-  alignItems: "center",
-  width: "100%",
-  minWidth: theme.spacing(3.75),
-  height: "100%",
-  padding: theme.spacing(3, 0),
-  gap: theme.spacing(3)
-}));
 function useDynamicFilter(selector, equalityFn) {
   const store = useContext(DynamicFilterContext);
   if (!store)
@@ -217,7 +205,7 @@ function BooleanFilter() {
     value: false,
     label: getLabel(getDynamicFilterDictionary(`operand_false`))
   }], [getLabel]);
-  return /* @__PURE__ */ jsxs(ContainerBooleanFilter, {
+  return /* @__PURE__ */ jsxs("div", {
     ...process.env.NODE_ENV !== "production" ? {
       [TEST_PROP_ID]: getTestIdByClass("containerBooleanFilter")
     } : {},
@@ -239,18 +227,6 @@ function BooleanFilter() {
     })]
   });
 }
-const ContainerDateTimeFilter = styled("div")(({
-  theme
-}) => ({
-  display: "flex",
-  flexDirection: "column",
-  justifyContent: "center",
-  alignItems: "center",
-  width: "100%",
-  minWidth: theme.spacing(3.75),
-  padding: theme.spacing(3, 0),
-  gap: theme.spacing(3)
-}));
 function DateTimeFilter() {
   const classesContainerDateTimeFilter = useDynamicFilter((state) => state.classes.containerDateTimeFilter, shallow);
   const {
@@ -267,7 +243,7 @@ function DateTimeFilter() {
     id: o,
     label: getLabel(getDynamicFilterDictionary(`operator_${o}`))
   })), [getLabel]);
-  return /* @__PURE__ */ jsxs(ContainerDateTimeFilter, {
+  return /* @__PURE__ */ jsxs("div", {
     className: classesContainerDateTimeFilter,
     children: [/* @__PURE__ */ jsx(RHFAutocomplete, {
       name: "formValueOperator",
@@ -285,18 +261,6 @@ function DateTimeFilter() {
     })]
   });
 }
-const ContainerNumberFilter = styled("div")(({
-  theme
-}) => ({
-  display: "flex",
-  flexDirection: "column",
-  justifyContent: "center",
-  alignItems: "center",
-  width: "100%",
-  minWidth: theme.spacing(3.75),
-  padding: theme.spacing(3, 0),
-  gap: theme.spacing(3)
-}));
 function NumberFilter() {
   const classesContainerNumberFilter = useDynamicFilter((state) => state.classes.containerNumberFilter);
   const {
@@ -313,7 +277,7 @@ function NumberFilter() {
     id: o,
     label: getLabel(getDynamicFilterDictionary(`operator_${o}`))
   })), [getLabel]);
-  return /* @__PURE__ */ jsxs(ContainerNumberFilter, {
+  return /* @__PURE__ */ jsxs("div", {
     className: classesContainerNumberFilter,
     children: [/* @__PURE__ */ jsx(RHFAutocomplete, {
       name: "formValueOperator",
@@ -333,18 +297,6 @@ function NumberFilter() {
     })]
   });
 }
-const ContainerStringFilter = styled("div")(({
-  theme
-}) => ({
-  display: "flex",
-  flexDirection: "column",
-  justifyContent: "center",
-  alignItems: "center",
-  width: "100%",
-  minWidth: theme.spacing(3.75),
-  padding: theme.spacing(3, 0),
-  gap: theme.spacing(3)
-}));
 function StringFilter() {
   const classesContainerStringFilter = useDynamicFilter((state) => state.classes.containerStringFilter);
   const {
@@ -354,7 +306,7 @@ function StringFilter() {
     id: o,
     label: getLabel(getDynamicFilterDictionary(`operator_${o}`))
   })), [getLabel]);
-  return /* @__PURE__ */ jsxs(ContainerStringFilter, {
+  return /* @__PURE__ */ jsxs("div", {
     className: classesContainerStringFilter,
     children: [/* @__PURE__ */ jsx(RHFAutocomplete, {
       name: "formValueOperator",
@@ -1464,6 +1416,7 @@ function PopoverMenuFields(props) {
   const handleClosePopover = () => {
     closePopoverMenuFields(false);
   };
+  const theme = useTheme();
   const handleOpenPopUpClickItem = (_event, field) => {
     if (fnAnchorEl) {
       showPopoverFilterForAdd(fnAnchorEl(), field);
@@ -1473,7 +1426,6 @@ function PopoverMenuFields(props) {
     className: classesPopUpMenuFields,
     disableRestoreFocus: true,
     open: Boolean(fnAnchorEl),
-    disablePortal: true,
     anchorEl: fnAnchorEl && fnAnchorEl(),
     onClose: handleClosePopover,
     anchorOrigin: {
@@ -1487,12 +1439,7 @@ function PopoverMenuFields(props) {
     disableAutoFocus: true,
     arrowType: "top-left",
     sx: {
-      "& .MuiMenuItem-root": {
-        px: 1,
-        typography: "body2",
-        borderRadius: 0.75
-      },
-      mt: "16px"
+      ...theme.components?.M4LDynamicFilterPopoverMenuFields?.styleOverrides
     },
     PaperProps: {
       className: classesPopUpMenuFieldsPaper,
@@ -1671,6 +1618,7 @@ const PopoverFilter = () => {
   let formFilter;
   let filterFormValue;
   let anchorEl;
+  const theme = useTheme();
   const popoverFilterData = useDynamicFilter((state) => state.popoverFilterData, shallow);
   const refPreviousPopoverFilterData = useRef(popoverFilterData);
   const classesPopoverFilter = useDynamicFilter((state) => state.classes.popoverFilter, shallow);
@@ -1755,7 +1703,6 @@ const PopoverFilter = () => {
     className: classesPopoverFilter,
     transitionDuration: 0,
     open: true,
-    disablePortal: true,
     anchorEl,
     disableRestoreFocus: true,
     onKeyDown: handleKeyDownPopper,
@@ -1769,11 +1716,11 @@ const PopoverFilter = () => {
       horizontal: "left"
     },
     arrowType: "top-left",
+    sx: {
+      ...theme.components?.M4LDynamicFilterPopoverFilter?.styleOverrides
+    },
     PaperProps: {
       className: classesPopoverFilterPapper,
-      sx: {
-        mt: "12px"
-      },
       ...process.env.NODE_ENV !== "production" ? {
         [TEST_PROP_ID]: getTestIdByClass("popoverFilterPaper")
       } : {}
@@ -1800,8 +1747,11 @@ const PopoverFilter = () => {
         })
       }), /* @__PURE__ */ jsxs(Actions, {
         children: [/* @__PURE__ */ jsx(ActionCancel, {
-          onClick: onClose
-        }), /* @__PURE__ */ jsx(ActionIntro, {})]
+          onClick: onClose,
+          skeletonWidth: "68px"
+        }), /* @__PURE__ */ jsx(ActionIntro, {
+          skeletonWidth: "64px"
+        })]
       })]
     })
   });

package/components/HelperText/{index.a69e9509.js → index.4c27bfc1.js}

@@ -1,21 +1,22 @@
 import { styled, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.caaed284.js";
-import { jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.57824447.js";
+import "../Icon/index.9839297c.js";
 import "clsx";
-import "../mui_extended/Accordion/index.437bb3f8.js";
+import { jsx } from "react/jsx-runtime";
+import "../mui_extended/IconButton/index.590049b4.js";
+import "@m4l/graphics";
+import "../mui_extended/Accordion/index.d420b666.js";
 import "../mui_extended/Avatar/index.fe06afd7.js";
 import "react-router-dom";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.f8ce9ccd.js";
-import "../Image/index.82a6cd46.js";
+import "../mui_extended/Button/index.1cd0c4e4.js";
+import "../Image/index.a88f6341.js";
 import "@mui/lab";
-import { T as Typography } from "../mui_extended/Typography/index.b3c6e71c.js";
-import "../mui_extended/Popover/index.226f247e.js";
-import "../mui_extended/MenuActions/index.37043326.js";
-import "../mui_extended/Pager/index.eeed3bd5.js";
+import { T as Typography } from "../mui_extended/Typography/index.1659d310.js";
+import "../mui_extended/Popover/index.9f35d0eb.js";
+import "../mui_extended/MenuActions/index.f9eb6463.js";
+import "../mui_extended/Pager/index.c058b933.js";
 import "../mui_extended/Tab/index.e0653a0a.js";
 import { unstable_composeClasses } from "@mui/base";
 const HelperTextRoot = styled("div")(({

package/components/Icon/{index.caaed284.js → index.9839297c.js}

@@ -2,9 +2,10 @@ import { m } from "framer-motion";
 import { forwardRef, useState, useEffect } from "react";
 import { IconButton, Box, styled, generateUtilityClasses, generateUtilityClass, Skeleton } from "@mui/material";
 import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
 import { useEnvironment } from "@m4l/core";
-import { u as useSideBar, g as getNameDataTestId$1 } from "../SideBar/index.3bc6a634.js";
-import { T as TEST_PROP_ID } from "../../vendor.8edaef93.js";
+import { u as useSideBar, g as getNameDataTestId$1 } from "../SideBar/index.90137dc5.js";
+import { T as TEST_PROP_ID } from "../../vendor.d194839d.js";
 import { unstable_composeClasses } from "@mui/base";
 const varSmall = {
   hover: {
@@ -118,7 +119,8 @@ function Icon(props) {
     src,
     size = "small",
     rotationAngle,
-    testingProps
+    testingProps,
+    className
   } = props;
   const [resource, setResource] = useState(testingProps?.resource || void 0);
   useEffect(() => {
@@ -146,7 +148,7 @@ function Icon(props) {
   };
   const classes = useUtilityClasses(ownerState);
   return /* @__PURE__ */ jsx(IconRoot, {
-    className: classes.root,
+    className: clsx(classes.root, className),
     ...process.env.NODE_ENV !== "production" ? {
       [TEST_PROP_ID]: getNameDataTestId("root")
     } : {},

package/components/Icon/types.d.ts

@@ -7,6 +7,7 @@ export interface IconProps {
     size?: SizeIcon;
     rotationAngle?: number;
     testingProps?: TestingProps;
+    className?: string;
 }
 export declare type DivIconProps = Pick<IconProps, 'src' | 'rotationAngle'>;
 export declare type WrapperPlaceHolderProps = {

package/components/Image/{index.82a6cd46.js → index.a88f6341.js}

@@ -1,6 +1,6 @@
 import { useBase, useModuleSkeleton, BaseProvider } from "@m4l/core";
 import { forwardRef, useState, useRef, useImperativeHandle, useEffect, useMemo } from "react";
-import { T as TEST_PROP_ID } from "../../vendor.8edaef93.js";
+import { T as TEST_PROP_ID } from "../../vendor.d194839d.js";
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import { styled, Skeleton as Skeleton$1, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
@@ -277,8 +277,8 @@ function Image(props) {
       } : {},
       ...width && height ? {
         style: {
-          width,
-          height
+          minWidth: width,
+          minHeight: height
         }
       } : {
         sx: {