@m4l/components 0.1.69 → 0.1.71

package/@types/export.d.ts

@@ -36,7 +36,7 @@ import { RHFDateTimeClassesKey } from '../components/hook-form/RHFDateTime/class
 import { AreasAdminClassesKey } from '../components/areas/components/AreasAdmin/classes/types';
 import { AreasViewerClassesKey } from '../components/areas/components/AreasViewer/classes/types';
 
-export { };
+export {};
 
 declare module '@mui/material/styles' {
     /* ----------------------------- Augmentation overrides theme -----------------------------  */
@@ -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,9 +184,23 @@ 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'];
         };
+        M4LAreasViewerWindow?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LAreasViewerWindow'];
+        };
+        M4LAreasViewerModal?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LAreasViewerModal'];
+        };
         M4LAreasAdmin?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LAreasAdmin'];
         };

package/components/CommonActions/components/ActionCancel/{index.e83053da.js → index.ff90f2c0.js}

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

package/components/CommonActions/components/ActionFormCancel/{index.ca378b0a.js → index.392a17c0.js}

@@ -1,25 +1,38 @@
 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.b34c8b68.js";
+import { B as Button } from "../../../mui_extended/Button/index.ec6525e0.js";
 import { useCallback } from "react";
-import { u as useModal } from "../../../../hooks/useModal/index.043e419b.js";
-import "../../../../react-draggable.de1aac90.js";
-import "../../../ModalDialog/index.4d663d0a.js";
-import "../../../Resizeable/index.ff97422e.js";
+import { u as useModal } from "../../../../hooks/useModal/index.9b244379.js";
+import "../../../../react-draggable.29f78f6d.js";
+import "../../../ModalDialog/index.598f9a86.js";
+import "../../../Resizeable/index.ff4ce7a4.js";
 import { jsx } from "react/jsx-runtime";
 import "@m4l/graphics";
-import { W as WindowConfirm } from "../../../modal/WindowConfirm.7ae1326f.js";
-import "../../../modal/WindowBase.7ce0b21e.js";
-import "../../../Icon/index.952f0635.js";
-import "../../../mui_extended/IconButton/index.917f0d3c.js";
+import "../../../Icon/index.6f2a5618.js";
 import "clsx";
+import { W as WindowConfirm } from "../../../modal/WindowConfirm.70bcbb69.js";
+import "../../../modal/WindowBase.32d35d71.js";
+import "../../../mui_extended/IconButton/index.7aab3e04.js";
+import "../../../mui_extended/Accordion/index.44e96bb8.js";
+import "../../../mui_extended/Avatar/index.fe06afd7.js";
+import "react-router-dom";
+import "../../../Image/index.1e3b7ff6.js";
+import "@mui/lab";
+import "../../../mui_extended/Typography/index.d5e0f69f.js";
+import "../../../mui_extended/Popover/index.9f35d0eb.js";
+import "../../../mui_extended/MenuActions/index.bff47c06.js";
+import "../../../mui_extended/Pager/index.907d5801.js";
+import "../../../mui_extended/Tab/index.e0653a0a.js";
 import "zustand";
-import "../../../areas/contexts/AreasContext/index.7c12b512.js";
-import "../../../areas/components/index.ffb147c7.js";
+import "../../../areas/contexts/AreasContext/index.e14d6799.js";
+import "../../../areas/components/index.31f39977.js";
 import "zustand/shallow";
-import { u as useWindowToolsMF } from "../../../areas/hooks/index.d09ea7de.js";
-import { u as useUtilityClasses } from "../Actions/index.1b2a0921.js";
+import "../../../ScrollBar/index.bbe48f4d.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.6b7d480a.js";
 function ActionFormCancel() {
   const {
     getLabel

package/components/CommonActions/components/ActionFormIntro/{index.fa2107df.js → index.f88d8849.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.b34c8b68.js";
-import { u as useUtilityClasses } from "../Actions/index.1b2a0921.js";
+import { L as LoadingButton } from "../../../mui_extended/Button/index.ec6525e0.js";
+import { u as useUtilityClasses } from "../Actions/index.6b7d480a.js";
 import { jsx } from "react/jsx-runtime";
 function ActionFormIntro(props) {
   const {

package/components/CommonActions/components/ActionIntro/{index.b8d5c8ee.js → index.e31ab7e9.js}

@@ -1,7 +1,7 @@
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.b34c8b68.js";
-import { T as TEST_PROP_ID } from "../../../../vendor.6a33c6d2.js";
-import { u as useUtilityClasses } from "../Actions/index.1b2a0921.js";
+import { B as Button } from "../../../mui_extended/Button/index.ec6525e0.js";
+import { T as TEST_PROP_ID } from "../../../../vendor.619c3533.js";
+import { u as useUtilityClasses } from "../Actions/index.6b7d480a.js";
 import { jsx } from "react/jsx-runtime";
 const ACTIONINTRO_TEST_ID = "m4lactions";
 const ActionIntro = (props) => {

package/components/CommonActions/components/Actions/{index.1b2a0921.js → index.6b7d480a.js}

@@ -1,29 +1,40 @@
 import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../../utils/index.b5c62ef0.js";
+import { g as getComponentUtilityClass } from "../../../../utils/index.ee16888d.js";
 import { styled } from "@mui/material/styles";
 import "@m4l/core";
 import "@mui/material/Button";
-import "../../../mui_extended/Button/index.b34c8b68.js";
+import "../../../mui_extended/Button/index.ec6525e0.js";
 import "clsx";
 import "react-hook-form";
 import "react";
-import "../../../../contexts/ModalContext/index.76d5ccee.js";
-import "../../../../react-draggable.de1aac90.js";
-import "../../../ModalDialog/index.4d663d0a.js";
-import "../../../Resizeable/index.ff97422e.js";
+import "../../../../contexts/ModalContext/index.fca184e2.js";
+import "../../../../react-draggable.29f78f6d.js";
+import "../../../ModalDialog/index.598f9a86.js";
+import "../../../Resizeable/index.ff4ce7a4.js";
 import "@m4l/graphics";
+import "../../../Icon/index.6f2a5618.js";
 import "@mui/lab";
-import "../../../mui_extended/Typography/index.79e2b06f.js";
-import "../../../modal/WindowConfirm.7ae1326f.js";
-import "../../../Icon/index.952f0635.js";
-import "../../../modal/WindowBase.7ce0b21e.js";
-import "../../../mui_extended/IconButton/index.917f0d3c.js";
+import "../../../mui_extended/Typography/index.d5e0f69f.js";
+import "../../../modal/WindowConfirm.70bcbb69.js";
+import "../../../modal/WindowBase.32d35d71.js";
+import "../../../mui_extended/IconButton/index.7aab3e04.js";
+import "../../../mui_extended/Accordion/index.44e96bb8.js";
+import "../../../mui_extended/Avatar/index.fe06afd7.js";
+import "react-router-dom";
+import "../../../Image/index.1e3b7ff6.js";
+import "../../../mui_extended/Popover/index.9f35d0eb.js";
+import "../../../mui_extended/MenuActions/index.bff47c06.js";
+import "../../../mui_extended/Pager/index.907d5801.js";
+import "../../../mui_extended/Tab/index.e0653a0a.js";
 import "zustand";
-import "../../../areas/contexts/AreasContext/index.7c12b512.js";
-import "../../../areas/components/index.ffb147c7.js";
+import "../../../areas/contexts/AreasContext/index.e14d6799.js";
+import "../../../areas/components/index.31f39977.js";
 import "zustand/shallow";
+import "../../../ScrollBar/index.bbe48f4d.js";
+import "../../../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
+import "../../../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
 const componentName = "M4LCommonActions";
 generateUtilityClasses(componentName, [
   "root",

package/components/DataGrid/{index.75ea6038.js → index.77ae9b4c.js}

@@ -6,33 +6,36 @@ 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.651dec44.js";
-import { g as getPagerComponentsDictionary, P as Pager } from "../mui_extended/Pager/index.e0663072.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.917f0d3c.js";
-import { u as useModal } from "../../hooks/useModal/index.043e419b.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.e83053da.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.b8d5c8ee.js";
-import "../../react-draggable.de1aac90.js";
-import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index.4d663d0a.js";
-import "../Resizeable/index.ff97422e.js";
+import { M as MenuActions } from "../mui_extended/MenuActions/index.bff47c06.js";
+import { g as getPagerComponentsDictionary, P as Pager } from "../mui_extended/Pager/index.907d5801.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.7aab3e04.js";
+import { u as useModal } from "../../hooks/useModal/index.9b244379.js";
+import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.ff90f2c0.js";
+import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.e31ab7e9.js";
+import "../../react-draggable.29f78f6d.js";
+import { g as getModalDialogComponentsDictionary } from "../ModalDialog/index.598f9a86.js";
+import "../Resizeable/index.ff4ce7a4.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
-import { A as Actions$1 } from "../CommonActions/components/Actions/index.1b2a0921.js";
+import "../Icon/index.6f2a5618.js";
+import "clsx";
+import { A as Actions$1 } from "../CommonActions/components/Actions/index.6b7d480a.js";
 import "react-hook-form";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.b34c8b68.js";
-import "clsx";
+import "../mui_extended/Button/index.ec6525e0.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.7c12b512.js";
-import "../areas/components/index.ffb147c7.js";
+import "../areas/contexts/AreasContext/index.e14d6799.js";
+import "../areas/components/index.31f39977.js";
 import "zustand/shallow";
-import "../Icon/index.952f0635.js";
+import "../ScrollBar/index.bbe48f4d.js";
+import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
+import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
 import "@mui/lab";
-import "../mui_extended/Typography/index.79e2b06f.js";
-import "../modal/WindowConfirm.7ae1326f.js";
-import { W as WindowBase } from "../modal/WindowBase.7ce0b21e.js";
-import { B as BooleanFormatter } from "../formatters/BooleanFormatter/index.d5e21bdd.js";
+import "../mui_extended/Typography/index.d5e0f69f.js";
+import "../modal/WindowConfirm.70bcbb69.js";
+import { W as WindowBase } from "../modal/WindowBase.32d35d71.js";
+import { B as BooleanFormatter } from "../formatters/BooleanFormatter/index.99c7fe49.js";
 import { D as DateFormatter } from "../formatters/DateFormatter/index.578a9f53.js";
-import { C as ConcatenatedFormatter } from "../formatters/index.650243bb.js";
+import { C as ConcatenatedFormatter } from "../formatters/index.1a92006b.js";
 const WrapperGrid = styled("div")(() => ({
   display: "flex",
   flexDirection: "column",

package/components/DynamicFilter/{index.aaeea668.js → index.b2ba5167.js}

@@ -4,55 +4,57 @@ 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.917f0d3c.js";
-import { T as TEST_PROP_ID } from "../../vendor.6a33c6d2.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.7aab3e04.js";
+import { T as TEST_PROP_ID } from "../../vendor.619c3533.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.651dec44.js";
-import { P as Popover } from "../mui_extended/Popover/index.226f247e.js";
-import { I as Icon } from "../Icon/index.952f0635.js";
+import { L as LabelMemuItem } from "../mui_extended/MenuActions/index.bff47c06.js";
+import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
+import { I as Icon } from "../Icon/index.6f2a5618.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.1b2a0921.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.e83053da.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.b8d5c8ee.js";
+import { g as getCommonActionsDictionary, A as Actions } from "../CommonActions/components/Actions/index.6b7d480a.js";
+import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.ff90f2c0.js";
+import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.e31ab7e9.js";
 import { useFormContext, useWatch } from "react-hook-form";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.b34c8b68.js";
-import "../../contexts/ModalContext/index.76d5ccee.js";
-import "../../react-draggable.de1aac90.js";
-import "../ModalDialog/index.4d663d0a.js";
-import "../Resizeable/index.ff97422e.js";
-import "../modal/WindowConfirm.7ae1326f.js";
-import "../modal/WindowBase.7ce0b21e.js";
-import { useStore, createStore } from "zustand";
-import "../areas/contexts/AreasContext/index.7c12b512.js";
-import "../areas/components/index.ffb147c7.js";
-import "@mui/lab";
-import { T as Typography } from "../mui_extended/Typography/index.79e2b06f.js";
-import "../mui_extended/Accordion/index.51feece8.js";
+import "../mui_extended/Button/index.ec6525e0.js";
+import "../../contexts/ModalContext/index.fca184e2.js";
+import "../../react-draggable.29f78f6d.js";
+import "../ModalDialog/index.598f9a86.js";
+import "../Resizeable/index.ff4ce7a4.js";
+import "../modal/WindowConfirm.70bcbb69.js";
+import "../modal/WindowBase.32d35d71.js";
+import "../mui_extended/Accordion/index.44e96bb8.js";
 import "../mui_extended/Avatar/index.fe06afd7.js";
 import "react-router-dom";
-import "../Image/index.f30f79f0.js";
-import "../mui_extended/Pager/index.e0663072.js";
+import "../Image/index.1e3b7ff6.js";
+import "@mui/lab";
+import { T as Typography } from "../mui_extended/Typography/index.d5e0f69f.js";
+import "../mui_extended/Pager/index.907d5801.js";
 import "../mui_extended/Tab/index.e0653a0a.js";
+import { useStore, createStore } from "zustand";
+import "../areas/contexts/AreasContext/index.e14d6799.js";
+import "../areas/components/index.31f39977.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.b5c62ef0.js";
+import { g as getComponentUtilityClass, i as isValidDate } from "../../utils/index.ee16888d.js";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
-import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.21377a2c.js";
+import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.c4ba070a.js";
 import "lodash/debounce";
-import "../hook-form/RHFAutocompleteAsync/index.8c7e0842.js";
-import "../hook-form/RHFCheckbox/index.83902d07.js";
-import "../HelperText/index.742d547d.js";
+import "../hook-form/RHFAutocompleteAsync/index.a63f3704.js";
+import "../hook-form/RHFCheckbox/index.9055f88d.js";
+import "../HelperText/index.d7b1b21a.js";
 import "@mui/x-date-pickers";
-import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.166250d8.js";
-import { R as RHFTextField } from "../hook-form/RHFTextField/index.55687a39.js";
-import "../hook-form/RHFPeriod/index.61baf76f.js";
-import "../Period/index.3ff6f53b.js";
+import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.2cb94a66.js";
+import { R as RHFTextField } from "../hook-form/RHFTextField/index.7ce2b16e.js";
+import "../hook-form/RHFPeriod/index.14dcf762.js";
+import "../Period/index.53ea0562.js";
 import "lodash/isString";
 import "react-dropzone";
-import { styled } from "@mui/material/styles";
-import "../hook-form/RHFUpload/index.eb4d0dac.js";
+import "../hook-form/RHFUpload/index.c57a43f8.js";
 import * as Yup from "yup";
 import "@hookform/resolvers/yup";
 const COMPONENT_CLASS_NAME = "M4LDynamicFilter";
@@ -140,19 +142,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)
@@ -215,7 +204,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")
     } : {},
@@ -237,18 +226,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 {
@@ -265,7 +242,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",
@@ -283,18 +260,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 {
@@ -311,7 +276,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",
@@ -331,18 +296,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 {
@@ -352,7 +305,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",
@@ -914,7 +867,6 @@ const updateOwnerStateClasses = (state) => {
 const updateAutomatic = (state) => {
   updateOwnerStateIsValid(state);
   updateAvailableFields(state);
-  console.log("updateAutomatic", state.ownerState.isValid);
   if (state.ownerState.isValid) {
     if (state.automatic) {
       state.ownerState.isDirty = false;
@@ -1349,9 +1301,7 @@ function ApplyedFilters() {
     })
   });
 }
-const SKTClearFilters = styled$1("div")(({
-  theme
-}) => ({
+const SKTClearFilters = styled$1("div")(() => ({
   display: "flex",
   justifyContent: "center",
   alignItems: "center",
@@ -1400,9 +1350,7 @@ const ClearFiltersButton = () => {
   }
   return null;
 };
-const SKTWrapperFilterButton = styled("div")(({
-  theme
-}) => ({
+const SKTWrapperFilterButton = styled("div")(() => ({
   display: "flex",
   justifyContent: "center",
   alignItems: "center",
@@ -1425,7 +1373,6 @@ function FilterButton() {
     host_static_assets,
     environment_assets
   } = useEnvironment();
-  console.log("FilterButton", isSkeleton);
   if (isSkeleton) {
     return /* @__PURE__ */ jsx(SKTWrapperFilterButton, {
       className: classesFilterButton,
@@ -1468,6 +1415,7 @@ function PopoverMenuFields(props) {
   const handleClosePopover = () => {
     closePopoverMenuFields(false);
   };
+  const theme = useTheme();
   const handleOpenPopUpClickItem = (_event, field) => {
     if (fnAnchorEl) {
       showPopoverFilterForAdd(fnAnchorEl(), field);
@@ -1477,7 +1425,6 @@ function PopoverMenuFields(props) {
     className: classesPopUpMenuFields,
     disableRestoreFocus: true,
     open: Boolean(fnAnchorEl),
-    disablePortal: true,
     anchorEl: fnAnchorEl && fnAnchorEl(),
     onClose: handleClosePopover,
     anchorOrigin: {
@@ -1491,12 +1438,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,
@@ -1675,6 +1617,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);
@@ -1759,7 +1702,6 @@ const PopoverFilter = () => {
     className: classesPopoverFilter,
     transitionDuration: 0,
     open: true,
-    disablePortal: true,
     anchorEl,
     disableRestoreFocus: true,
     onKeyDown: handleKeyDownPopper,
@@ -1773,11 +1715,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")
       } : {}
@@ -1804,8 +1746,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.742d547d.js → index.d7b1b21a.js}

@@ -1,21 +1,22 @@
 import { styled, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.952f0635.js";
-import { jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.917f0d3c.js";
+import "../Icon/index.6f2a5618.js";
 import "clsx";
-import "../mui_extended/Accordion/index.51feece8.js";
+import { jsx } from "react/jsx-runtime";
+import "../mui_extended/IconButton/index.7aab3e04.js";
+import "@m4l/graphics";
+import "../mui_extended/Accordion/index.44e96bb8.js";
 import "../mui_extended/Avatar/index.fe06afd7.js";
 import "react-router-dom";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.b34c8b68.js";
-import "../Image/index.f30f79f0.js";
+import "../mui_extended/Button/index.ec6525e0.js";
+import "../Image/index.1e3b7ff6.js";
 import "@mui/lab";
-import { T as Typography } from "../mui_extended/Typography/index.79e2b06f.js";
-import "../mui_extended/Popover/index.226f247e.js";
-import "../mui_extended/MenuActions/index.651dec44.js";
-import "../mui_extended/Pager/index.e0663072.js";
+import { T as Typography } from "../mui_extended/Typography/index.d5e0f69f.js";
+import "../mui_extended/Popover/index.9f35d0eb.js";
+import "../mui_extended/MenuActions/index.bff47c06.js";
+import "../mui_extended/Pager/index.907d5801.js";
 import "../mui_extended/Tab/index.e0653a0a.js";
 import { unstable_composeClasses } from "@mui/base";
 const HelperTextRoot = styled("div")(({

package/components/Icon/{index.952f0635.js → index.6f2a5618.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.365f64f0.js";
-import { T as TEST_PROP_ID } from "../../vendor.6a33c6d2.js";
+import { u as useSideBar, g as getNameDataTestId$1 } from "../SideBar/index.4daafbab.js";
+import { T as TEST_PROP_ID } from "../../vendor.619c3533.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")
     } : {},