@m4l/components 0.1.75 → 0.1.76

package/@types/export.d.ts

@@ -38,6 +38,21 @@ import { AreasViewerClassesKey } from '../components/areas/components/AreasViewe
 import { AppBarProps } from 'src/components/AppBar/types';
 import { AccountPopoverProps } from 'src/components/AccountPopover/types';
 import { SplitLayoutProps } from 'src/components/SplitLayout';
+import { LinearProgressIndeterminateClassesKey } from '../components/LinearProgressIndeterminate/classes/types';
+import { PropertyValueProps } from '../components/PropertyValue/types';
+import { TabClassesKey } from '../components/mui_extended/Tab/classes/types';
+import { AccordionProps } from '../components/mui_extended/Accordion/types';
+import { PropertyValueClassesKey } from '../components/PropertyValue/classes/types';
+import { FormProviderProps } from '../contexts/RHFormContext/types';
+import { RHFormProivderClassesKey } from '../contexts/RHFormContext/classes/types';
+import { RHFUploadImageClassesKey } from '../components/hook-form/RHFUpload/RHFUploadImage/classes/types';
+import { RHFUploadImageProps } from '../components/hook-form/RHFUpload/RHFUploadImage/types';
+import { PeriodProps } from '../components/Period/types';
+import { PeriodClassesKey } from '../components/Period/classes/types';
+import { ModalClassesKey } from '..index/components/modal/classes/types';
+import { PaperFormClassesKey } from '../components/PaperForm/classes/types';
+import { TooltipClassesKey } from '../components/mui_extended/Tooltip/classes/types';
+
 
 export {};
 
@@ -68,7 +83,10 @@ declare module '@mui/material/styles' {
         M4LAvatar: AvatarProps;
         M4LAccountPopover: AccountPopoverProps;
         M4LSplitLayout: SplitLayoutProps;
-        
+        M4LPropertyValue: PropertyValueProps;
+        M4LRHFormProvider: FormProviderProps;
+        M4LRHFUploadImage: RHFUploadImageProps;
+        M4LPeriod: PeriodProps;
     }
 
     interface ComponentNameToClassKey {
@@ -98,6 +116,7 @@ declare module '@mui/material/styles' {
         M4LRHFDateTime: RHFDateTimeClassesKey;
         M4LAreasViewer: AreasViewerClassesKey;
         M4LAreasAdmin: AreasAdminClassesKey;
+        M4LAreasAdminEditPopover: AreasAdminClassesKey;
         M4LAvatar: AvatarClassesKey;
         M4LAccountPopover: AccountPopoverClassesKey;
         M4LAccountPopoverPopover: AccountPopoverClassesKey;
@@ -105,9 +124,23 @@ declare module '@mui/material/styles' {
         M4LMasterDetailLayout: MasterDetailLayoutClassesKey;
         M4LSplitLayout: SplitLayoutClassesKey;
         M4LCommonActions: CommonActionsClassesKey;
+        M4LinearProgressIndeterminate: LinearProgressIndeterminateClassesKey;
+        M4LPropertyValue: PropertyValueClassesKey;
+        M4LTab: TabClassesKey;
+        M4LAccordion: AccordionClassesKey;
+        M4LRHFormProvider: RHFormProivderClassesKey;
+        M4LRHFUploadImage: RHFUploadImageClassesKey;
+        M4LModalDialog: ModalClassesKey;
+        M4LPaperForm: PaperFormClassesKey;
+        M4LTooltip: TooltipClassesKey;
+        
     }
 
     interface Components {
+        M4LPeriod?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LPeriod'];
+            defaultProps?: ComponentsProps['M4LPeriod'];
+        };
         M4LAreasViewer?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LAreasViewer'];
             defaultProps?: ComponentsProps['M4LAreasViewer'];
@@ -148,6 +181,10 @@ declare module '@mui/material/styles' {
             styleOverrides?: ComponentsOverrides<Theme>['M4LRHFDateTime'];
             defaultProps?: ComponentsProps['M4LRHFDateTime'];
         };
+        M4LRHFUploadImage?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LRHFUploadImage'];
+            defaultProps?: ComponentsProps['M4LRHFUploadImage'];
+        };
         M4LIcon?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LIcon'];
             defaultProps?: ComponentsProps['M4LIcon'];
@@ -224,6 +261,9 @@ declare module '@mui/material/styles' {
         M4LAreasAdmin?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LAreasAdmin'];
         };
+        M4LAreasAdminEditPopover?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LAreasAdminEditPopover'];
+        };
         M4LAvatar?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LAvatar'];
             defaultProps?: ComponentsProps['M4LAvatar'];
@@ -249,5 +289,42 @@ declare module '@mui/material/styles' {
             styleOverrides?: ComponentsOverrides<Theme>['M4LCommonActions'];
             defaultProps?: ComponentsProps['M4LCommonActions'];
         };
+        M4LinearProgressIndeterminate?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LinearProgressIndeterminate'];
+            defaultProps?: ComponentsProps['M4LinearProgressIndeterminate'];
+        };
+        M4LPropertyValue?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LPropertyValue'];
+            defaultProps?: ComponentsProps['M4LPropertyValue'];
+        };
+        M4LAccordion?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LAccordion'];
+            defaultProps?: ComponentsProps['M4LAccordion'];
+        };
+        M4LTab?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LTab'];
+            defaultProps?: ComponentsProps['M4LTab'];
+        };
+        M4LRHFormProvider?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LRHFormProvider'];
+            defaultProps?: ComponentsProps['M4LRHFormProvider'];
+        };
+        M4LRHFPeriod?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LRHFPeriod'];
+            defaultProps?: ComponentsProps['M4LRHFPeriod'];
+        };
+        M4LModalDialog?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LModalDialog'];
+            defaultProps?: ComponentsProps['M4LModalDialog'];
+        };
+        M4LPaperForm?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LPaperForm'];
+            defaultProps?: ComponentsProps['M4LPaperForm'];
+        };
+        M4LTooltip?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LTooltip'];
+            defaultProps?: ComponentsProps['M4LTooltip'];
+        };
+
     }
 }

package/components/AccountPopover/classes/index.d.ts

@@ -4,6 +4,11 @@ export declare function getAccountPopoverClassesUtilityClass(slot: string): stri
 export declare const useAccountPopoverUtilityClasses: () => {
     root: string;
     containerUserInfo: string;
+    labelUserName: string;
+    labelUserEmail: string;
+    labelVersion: string;
+    myAvatar: string;
+    containerAvatarPopover: string;
     popover: string;
     containerAppVersion: string;
     containerMenuItems: string;

package/components/AccountPopover/classes/types.d.ts

@@ -2,6 +2,11 @@ import { useAccountPopoverUtilityClasses } from ".";
 export interface AccountPopoverClassesType {
     root: string;
     containerUserInfo: string;
+    labelUserName: string;
+    labelUserEmail: string;
+    labelVersion: string;
+    containerAvatarPopover: string;
+    myAvatar: string;
     popover: string;
     containerAppVersion: string;
     containerMenuItems: string;

package/components/AccountPopover/{index.93aefccd.js → index.47cf6c43.js}

@@ -1,26 +1,72 @@
 import { useModuleDictionary, useNetwork } from "@m4l/core";
 import { useState, useEffect } from "react";
-import { styled, generateUtilityClasses, generateUtilityClass, useTheme } from "@mui/material";
-import "../Icon/index.f9119f5e.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
+import { generateUtilityClasses, generateUtilityClass, styled, useTheme } from "@mui/material";
+import "../Icon/index.9dae8337.js";
 import "clsx";
 import { jsx, jsxs } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.3b05af71.js";
+import "../mui_extended/IconButton/index.1a9d4fa5.js";
 import "@m4l/graphics";
-import "../mui_extended/Accordion/index.03bd0e2a.js";
-import { A as Avatar } from "../mui_extended/Avatar/index.1e1a91a3.js";
+import "../mui_extended/Accordion/index.3faafd8b.js";
+import "../mui_extended/Typography/index.443590d6.js";
+import { A as Avatar } from "../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.aebbab34.js";
-import "../Image/index.8aae9322.js";
+import "../mui_extended/Button/index.fdb5dcbd.js";
+import { C as CircularProgress } from "../mui_extended/CircularProgress/index.ad569afd.js";
+import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import { T as Typography } from "../mui_extended/Typography/index.443590d6.js";
 import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/MenuActions/index.ca5ce35a.js";
-import "../mui_extended/Pager/index.80ec975a.js";
-import "../mui_extended/Tab/index.e0653a0a.js";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { C as CircularProgress } from "../mui_extended/CircularProgress/index.ad569afd.js";
+import "../mui_extended/MenuActions/index.ba1da3b3.js";
+import "../mui_extended/Pager/index.67bda2c5.js";
+import "../mui_extended/Tab/index.9e2f6e34.js";
+import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
+const componentName = "M4LAccountPopover";
+generateUtilityClasses(componentName, [
+  "root",
+  "containerUserInfo",
+  "labelUserName",
+  "labelUserEmail",
+  "labelVersion",
+  "containerAvatarPopover",
+  "myAvatar",
+  "popover",
+  "containerAppVersion",
+  "containerMenuItems",
+  "containerProgress",
+  "logOut",
+  "menuItem"
+]);
+function getAccountPopoverClassesUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const useAccountPopoverUtilityClasses = () => {
+  const slots = {
+    root: ["root"],
+    containerUserInfo: ["containerUserInfo"],
+    labelUserName: ["labelUserName"],
+    labelUserEmail: ["labelUserEmail"],
+    labelVersion: ["labelVersion"],
+    myAvatar: ["myAvatar"],
+    containerAvatarPopover: ["containerAvatarPopover"],
+    popover: ["popover"],
+    containerAppVersion: ["containerAppVersion"],
+    containerMenuItems: ["containerMenuItems"],
+    containerProgress: ["containerProgress"],
+    logOut: ["logOut"],
+    menuItem: ["menuItem"]
+  };
+  const composedClasses = unstable_composeClasses(slots, getAccountPopoverClassesUtilityClass, {});
+  return {
+    ...composedClasses
+  };
+};
+const AcountPopOverRoot = styled("div")(({
+  theme
+}) => ({
+  ...theme.components?.M4LAccountPopover?.styleOverrides
+}));
 const PRIMARY_NAME = ["A", "N", "H", "L", "Q", "9", "8"];
 const INFO_NAME = ["F", "G", "T", "I", "J", "1", "2", "3"];
 const SUCCESS_NAME = ["K", "D", "Y", "B", "O", "4", "5"];
@@ -62,45 +108,8 @@ function MyAvatar({
     }
   );
 }
-const AcountPopOverRoot = styled("div")(({
-  theme
-}) => ({
-  ...theme.components?.M4LAccountPopover?.styleOverrides
-}));
-const componentName = "M4LAccountPopover";
-generateUtilityClasses(componentName, [
-  "root",
-  "containerUserInfo",
-  "popover",
-  "containerAppVersion",
-  "containerMenuItems",
-  "containerProgress",
-  "logOut",
-  "menuItem"
-]);
-function getAccountPopoverClassesUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const useAccountPopoverUtilityClasses = () => {
-  const slots = {
-    root: ["root"],
-    containerUserInfo: ["containerUserInfo"],
-    popover: ["popover"],
-    containerAppVersion: ["containerAppVersion"],
-    containerMenuItems: ["containerMenuItems"],
-    containerProgress: ["containerProgress"],
-    logOut: ["logOut"],
-    menuItem: ["menuItem"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getAccountPopoverClassesUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
 const MenuPopOver = (props) => {
   const {
-    setOpen,
-    open,
     data,
     handleClick: onClick,
     version,
@@ -111,6 +120,7 @@ const MenuPopOver = (props) => {
   const {
     getLabel
   } = useModuleDictionary();
+  const [open2, setOpen] = useState(null);
   const theme = useTheme();
   const handleClick = (item) => {
     onClick(item);
@@ -119,86 +129,89 @@ const MenuPopOver = (props) => {
   const handleClose = () => {
     setOpen(null);
   };
-  return /* @__PURE__ */ jsxs(Popover, {
-    open: Boolean(open),
-    anchorEl: open,
-    onClose: handleClose,
-    onBlur: handleClose,
-    className: classes.popover,
-    arrowType: "top-right",
-    anchorOrigin: {
-      vertical: "bottom",
-      horizontal: "center"
-    },
-    transformOrigin: {
-      vertical: "top",
-      horizontal: "right"
-    },
+  const handleOpen = (event) => {
+    setOpen(event.currentTarget);
+  };
+  return /* @__PURE__ */ jsxs("div", {
+    className: classes.containerAvatarPopover,
     ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("popover")
+      [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerAvatarPopover")
     } : {},
-    sx: {
-      ml: "26px",
-      mt: "10px",
-      maxWidth: "200px",
-      width: "200px",
-      ...theme.components?.M4LAccountPopoverPopover?.styleOverrides
-    },
-    children: [/* @__PURE__ */ jsxs("div", {
-      className: classes.containerUserInfo,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerUserInfo")
-      } : {},
-      children: [/* @__PURE__ */ jsx(Typography, {
-        variant: "subtitle2",
-        noWrap: true,
-        children: `${userData?.first_name} ${userData?.last_name}`
-      }), /* @__PURE__ */ jsx(Typography, {
-        variant: "body2",
-        sx: {
-          color: "text.secondary"
-        },
-        noWrap: true,
-        children: userData?.email
-      })]
-    }), /* @__PURE__ */ jsx("div", {
-      className: classes.containerAppVersion,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerAppVersion")
-      } : {},
-      children: /* @__PURE__ */ jsx(Typography, {
-        variant: "subtitle2",
-        noWrap: true,
-        children: `${getLabel("version")} ${version}`
-      })
-    }), /* @__PURE__ */ jsx("div", {
-      className: classes.containerMenuItems,
+    onClick: handleOpen,
+    children: [/* @__PURE__ */ jsx(MyAvatar, {
+      className: classes.myAvatar
+    }), /* @__PURE__ */ jsxs(Popover, {
+      open: Boolean(open2),
+      anchorEl: open2,
+      onClose: handleClose,
+      onBlur: handleClose,
+      className: classes.popover,
+      arrowType: "no-arrow",
+      anchorOrigin: {
+        vertical: "bottom",
+        horizontal: "right"
+      },
+      transformOrigin: {
+        vertical: "top",
+        horizontal: "right"
+      },
       ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerMenuItems")
+        [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("popover")
       } : {},
-      children: data ? data.length !== 0 && data.map((option) => /* @__PURE__ */ jsx("div", {
-        onClick: () => handleClick(option),
-        className: classes.menuItem,
+      sx: {
+        mt: "5px",
+        ...theme.components?.M4LAccountPopoverPopover?.styleOverrides
+      },
+      children: [/* @__PURE__ */ jsxs("div", {
+        className: classes.containerUserInfo,
         ...process.env.NODE_ENV !== "production" ? {
-          [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("menuItem")
+          [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerUserInfo")
         } : {},
-        children: option.title
-      }, option.title)) : /* @__PURE__ */ jsx("div", {
-        className: classes.containerProgress,
+        children: [/* @__PURE__ */ jsx("span", {
+          className: classes.labelUserName,
+          children: `${userData?.first_name} ${userData?.last_name}`
+        }), /* @__PURE__ */ jsx("span", {
+          className: classes.labelUserEmail,
+          children: userData?.email
+        })]
+      }), /* @__PURE__ */ jsx("div", {
+        className: classes.containerAppVersion,
         ...process.env.NODE_ENV !== "production" ? {
-          [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerProgress")
+          [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerAppVersion")
         } : {},
-        children: /* @__PURE__ */ jsx(CircularProgress, {
-          size: "20px"
+        children: /* @__PURE__ */ jsx("span", {
+          className: classes.labelVersion,
+          children: `${getLabel("version")} ${version}`
         })
-      })
-    }), /* @__PURE__ */ jsx("div", {
-      onClick: handleLogOut,
-      className: classes.logOut,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("logOut")
-      } : {},
-      children: getLabel("logout")
+      }), /* @__PURE__ */ jsx("div", {
+        className: classes.containerMenuItems,
+        ...process.env.NODE_ENV !== "production" ? {
+          [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerMenuItems")
+        } : {},
+        children: data ? data.length !== 0 && data.map((option) => /* @__PURE__ */ jsx("div", {
+          onClick: () => handleClick(option),
+          className: classes.menuItem,
+          ...process.env.NODE_ENV !== "production" ? {
+            [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("menuItem")
+          } : {},
+          children: option.title
+        }, option.title)) : /* @__PURE__ */ jsx("div", {
+          className: classes.containerProgress,
+          ...process.env.NODE_ENV !== "production" ? {
+            [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("containerProgress")
+          } : {},
+          children: /* @__PURE__ */ jsx(CircularProgress, {
+            size: "20px"
+          })
+        })
+      }), /* @__PURE__ */ jsx("div", {
+        onClick: handleLogOut,
+        className: classes.logOut,
+        ...process.env.NODE_ENV !== "production" ? {
+          [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("logOut")
+        } : {},
+        children: getLabel("logout")
+      })]
     })]
   });
 };
@@ -209,7 +222,6 @@ const AccountPopover = (props) => {
     handleLogOut,
     userData
   } = props;
-  const [open, setOpen] = useState(null);
   const [asyncState, setAsyncState] = useState("unLoad");
   const [menuData, setMenuData] = useState([]);
   const {
@@ -217,7 +229,7 @@ const AccountPopover = (props) => {
   } = useNetwork();
   useEffect(() => {
     let mounted = true;
-    if (open && asyncState === "unLoad") {
+    if (asyncState === "unLoad") {
       setAsyncState("loading");
       networkOperation({
         method: "GET",
@@ -238,26 +250,22 @@ const AccountPopover = (props) => {
       mounted = false;
     };
   }, [open]);
-  const handleOpen = (event) => {
-    setOpen(event.currentTarget);
-  };
   const classes = useAccountPopoverUtilityClasses();
-  return /* @__PURE__ */ jsxs(AcountPopOverRoot, {
-    className: classes.root,
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("root")
-    } : {},
-    onClick: handleOpen,
-    children: [/* @__PURE__ */ jsx(MyAvatar, {}), /* @__PURE__ */ jsx(MenuPopOver, {
-      open,
-      setOpen,
-      data: menuData,
-      handleClick,
-      version,
-      handleLogOut,
-      classes,
-      userData
-    })]
+  return /* @__PURE__ */ jsx("div", {
+    children: /* @__PURE__ */ jsx(AcountPopOverRoot, {
+      className: classes.root,
+      ...process.env.NODE_ENV !== "production" ? {
+        [TEST_PROP_ID]: getAccountPopoverClassesUtilityClass("root")
+      } : {},
+      children: /* @__PURE__ */ jsx(MenuPopOver, {
+        data: menuData,
+        handleClick,
+        version,
+        handleLogOut,
+        classes,
+        userData
+      })
+    })
   });
 };
 export {

package/components/AccountPopover/subcomponents/MyAvatar/createAvatar.d.ts

@@ -1,4 +1,4 @@
 export default function createAvatar(name: string): {
     readonly name: string;
-    readonly color: "error" | "default" | "warning" | "info" | "primary" | "success";
+    readonly color: "error" | "default" | "warning" | "info" | "success" | "primary";
 };

package/components/AccountPopover/subcomponents/PopOver/types.d.ts

@@ -1,10 +1,6 @@
 import { Classes } from "../../classes/types";
 import { AccountPopoverProps, UserMenuData } from "../../types";
-declare type open = HTMLElement | null;
 export interface PopOverProps extends AccountPopoverProps {
-    setOpen: (element: open) => void;
-    open: open;
     data: Array<UserMenuData> | [];
     classes: Classes;
 }
-export {};

package/components/AppBar/classes/index.d.ts

@@ -4,5 +4,6 @@ export declare function getAppBarClassesUtilityClass(slot: string): string;
 export declare const useAppBarUtilityClasses: () => {
     root: string;
     containerChilds: string;
+    containerIconMenuToggle: string;
     iconMenuToggle: string;
 };

package/components/AppBar/classes/types.d.ts

@@ -2,6 +2,7 @@ import { useAppBarUtilityClasses } from ".";
 export interface AppBarClassesType {
     root: string;
     containerChilds: string;
+    containerIconMenuToggle: string;
     iconMenuToggle: string;
 }
 export declare type AppBarClassesKey = keyof AppBarClassesType;

package/components/AppBar/{index.cc974d56.js → index.f04f5e45.js}

@@ -2,23 +2,24 @@ import { useResponsiveDesktop } from "@m4l/graphics";
 import { useEnvironment } from "@m4l/core";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { I as IconButton } from "../mui_extended/IconButton/index.3b05af71.js";
-import "../Icon/index.f9119f5e.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.1a9d4fa5.js";
+import "../mui_extended/Accordion/index.3faafd8b.js";
+import "../Icon/index.9dae8337.js";
 import "react";
 import "clsx";
 import { jsxs, jsx } from "react/jsx-runtime";
-import "../mui_extended/Accordion/index.03bd0e2a.js";
-import "../mui_extended/Avatar/index.1e1a91a3.js";
+import "../mui_extended/Typography/index.443590d6.js";
+import "../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.aebbab34.js";
-import "../Image/index.8aae9322.js";
+import "../mui_extended/Button/index.fdb5dcbd.js";
+import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/MenuActions/index.ca5ce35a.js";
-import "../mui_extended/Pager/index.80ec975a.js";
-import "../mui_extended/Tab/index.e0653a0a.js";
+import "../mui_extended/MenuActions/index.ba1da3b3.js";
+import "../mui_extended/Pager/index.67bda2c5.js";
+import "../mui_extended/Tab/index.9e2f6e34.js";
+import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { styled } from "@mui/material/styles";
 import { unstable_composeClasses } from "@mui/base";
 const AppBarRoot = styled("header")(({
@@ -34,6 +35,7 @@ const componentName = "M4LAppBar";
 generateUtilityClasses(componentName, [
   "root",
   "containerChilds",
+  "containerIconMenuToggle",
   "iconMenuToggle"
 ]);
 function getAppBarClassesUtilityClass(slot) {
@@ -43,6 +45,7 @@ const useAppBarUtilityClasses = () => {
   const slots = {
     root: ["root"],
     containerChilds: ["containerChilds"],
+    containerIconMenuToggle: ["containerIconMenuToggle"],
     iconMenuToggle: ["iconMenuToggle"]
   };
   const composedClasses = unstable_composeClasses(slots, getAppBarClassesUtilityClass, {});
@@ -66,11 +69,17 @@ const AppBar = (props) => {
     ...process.env.NODE_ENV !== "production" ? {
       [TEST_PROP_ID]: getNameDataTestId("root")
     } : {},
-    children: [!isDesktop ? /* @__PURE__ */ jsx(IconButton, {
-      tooltip: "test",
-      className: classes.iconMenuToggle,
-      src: `${host_static_assets}/${environment_assets}/frontend/components/settings/assets/icons/options.svg`,
-      onClick: onToggleVisible
+    children: [!isDesktop ? /* @__PURE__ */ jsx("div", {
+      className: classes.containerIconMenuToggle,
+      ...process.env.NODE_ENV !== "production" ? {
+        [TEST_PROP_ID]: getNameDataTestId("containerIconMenuToggle")
+      } : {},
+      children: /* @__PURE__ */ jsx(IconButton, {
+        tooltip: "test",
+        className: classes.iconMenuToggle,
+        src: `${host_static_assets}/${environment_assets}/frontend/components/settings/assets/icons/options.svg`,
+        onClick: onToggleVisible
+      })
     }) : null, /* @__PURE__ */ jsx("div", {
       className: classes.containerChilds,
       ...process.env.NODE_ENV !== "production" ? {

package/components/CommonActions/components/ActionCancel/{index.574ea031.js → index.453c2d24.js}

@@ -1,6 +1,6 @@
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.aebbab34.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.37ffde59.js";
+import { B as Button } from "../../../mui_extended/Button/index.fdb5dcbd.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index.e376a68e.js";
 import { jsx } from "react/jsx-runtime";
 const ActionCancel = (props) => {
   const {