@m4l/components 1.1.0 → 1.1.2

package/components/SplitLayout/{index.e048f8c4.js → index.75953afb.js}

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { a0 as SplitLayoutRoot, a1 as SplitMaster, a2 as SplitDetail } from "../../styles/index.1735a866.js";
+import { a0 as SplitLayoutRoot, a1 as SplitMaster, a2 as SplitDetail } from "../../styles/index.239f949e.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import clsx from "clsx";

package/components/ToastContainer/{index.319037c5.js → index.bb972338.js}

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { a3 as ToastContainerRoot } from "../../styles/index.1735a866.js";
+import { a3 as ToastContainerRoot } from "../../styles/index.239f949e.js";
 import { ToastContainer as ToastContainer$1 } from "react-toastify";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../utils/index.f77cc2ab.js";
+import { g as getComponentUtilityClass } from "../../utils/index.78d1638f.js";
 import { useEnvironment } from "@m4l/core";
 import { useMemo } from "react";
-import { I as Icon } from "../Icon/index.ab280d41.js";
+import { I as Icon } from "../Icon/index.13aaae3c.js";
 const componentName = "M4LToastContainer";
 const toastClasses = generateUtilityClasses(
   componentName,

package/components/animate/LoadingScreen/{index.d22d67a3.js → index.09915798.js}

@@ -2,7 +2,7 @@ import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import { m } from "framer-motion";
 import { alpha } from "@mui/material/styles";
 import { Box } from "@mui/material";
-import { a4 as RootStyle } from "../../../styles/index.1735a866.js";
+import { a4 as RootStyle } from "../../../styles/index.239f949e.js";
 function LoadingScreen(props) {
   const { isDashboard, variant = "fullpage", ...other } = props;
   return /* @__PURE__ */ jsx(Fragment, { children: !isDashboard && /* @__PURE__ */ jsxs(RootStyle, { variant, ...other, children: [

package/components/animate/{index.271410bf.js → index.5c545243.js}

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { m } from "framer-motion";
 import { forwardRef, useRef } from "react";
 import { IconButton, Box } from "@mui/material";
-import { a5 as AnimatedScrollRoot } from "../../styles/index.1735a866.js";
+import { a5 as AnimatedScrollRoot } from "../../styles/index.239f949e.js";
 const varSmall = {
   hover: { scale: 1.1 },
   tap: { scale: 0.95 }

package/components/areas/components/AreasAdmin/{index.f3a211a4.js → index.42d40964.js}

@@ -1,31 +1,31 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { u as useAreasStore } from "../../hooks/useAreas/index.5f7f615d.js";
+import { u as useAreasStore } from "../../hooks/useAreas/index.509c1703.js";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { useState, useRef, useMemo } from "react";
 import * as Yup from "yup";
 import clsx from "clsx";
 import { generateUtilityClasses, useTheme } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../../utils/index.f77cc2ab.js";
+import { g as getComponentUtilityClass } from "../../../../utils/index.78d1638f.js";
 import { A as AREAS_ADMIN_CLASS_NAME } from "../../constants.66529246.js";
 import { I as ICONS } from "../../icons.8266ccc8.js";
 import { g as getAreasDictionary, D as DICCTIONARY } from "../../dictionary.08cfc4c9.js";
-import { a6 as EditAreaHeader, a7 as AreasAdminRoot } from "../../../../styles/index.1735a866.js";
+import { a6 as EditAreaHeader, a7 as AreasAdminRoot } from "../../../../styles/index.239f949e.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { shallow } from "zustand/shallow";
-import { M as MenuActions } from "../../../mui_extended/MenuActions/index.8168ad20.js";
-import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.cedd3482.js";
-import { R as RHFTextField } from "../../../hook-form/RHFTextField/index.ec3f5dd5.js";
-import { A as Actions } from "../../../CommonActions/components/Actions/index.46d6c3d1.js";
-import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.a44544d1.js";
-import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.63222f6a.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index.cb274bbe.js";
-import { P as Popover } from "../../../mui_extended/Popover/index.594e3587.js";
-import { T as Typography } from "../../../mui_extended/Typography/index.71fbb5c4.js";
-import { S as ScrollBar } from "../../../ScrollBar/index.4e447b30.js";
+import { M as MenuActions } from "../../../mui_extended/MenuActions/index.8b0d69b7.js";
+import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.40a9547e.js";
+import { R as RHFTextField } from "../../../hook-form/RHFTextField/index.828b30f5.js";
+import { A as Actions } from "../../../CommonActions/components/Actions/index.2342a37e.js";
+import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.33cf608e.js";
+import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.0893587b.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index.9425bdc5.js";
+import { P as Popover } from "../../../mui_extended/Popover/index.5e78a637.js";
+import { T as Typography } from "../../../mui_extended/Typography/index.45e97bdd.js";
+import { S as ScrollBar } from "../../../ScrollBar/index.236e2aa3.js";
 import TouchRipple from "@mui/material/ButtonBase/TouchRipple";
-import { B as Button } from "../../../mui_extended/Button/index.8afd5131.js";
-import { I as Icon } from "../../../Icon/index.ab280d41.js";
+import { B as Button } from "../../../mui_extended/Button/index.111f830e.js";
+import { I as Icon } from "../../../Icon/index.13aaae3c.js";
 import { u as useOnClickOutside } from "../../index.4cc6a221.js";
 const areasAdminClasses = generateUtilityClasses(
   AREAS_ADMIN_CLASS_NAME,

package/components/areas/components/AreasViewer/{index.8e9d24c2.js → index.266a3815.js}

@@ -1,35 +1,35 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { a8 as WindowRoot, a9 as WrapperWindowModal, aa as AreasViewerRoot } from "../../../../styles/index.1735a866.js";
+import { a8 as WindowRoot, a9 as WrapperWindowModal, aa as AreasViewerRoot } from "../../../../styles/index.239f949e.js";
 import { shallow } from "zustand/shallow";
 import React__default, { useMemo, useEffect } from "react";
 import clsx from "clsx";
-import { u as useAreasStore } from "../../hooks/useAreas/index.5f7f615d.js";
+import { u as useAreasStore } from "../../hooks/useAreas/index.509c1703.js";
 import { generateUtilityClasses, Skeleton } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../../utils/index.f77cc2ab.js";
+import { g as getComponentUtilityClass } from "../../../../utils/index.78d1638f.js";
 import { a as AREAS_VIEWER_CLASS_NAME } from "../../constants.66529246.js";
 import { useModuleDictionary, useEnvironment, useModuleSkeleton } from "@m4l/core";
-import { a as MemonizedMenuActions } from "../../../mui_extended/MenuActions/index.8168ad20.js";
+import { a as MemonizedMenuActions } from "../../../mui_extended/MenuActions/index.8b0d69b7.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { I as ICONS } from "../../icons.8266ccc8.js";
 import { g as getAreasDictionary, D as DICCTIONARY } from "../../dictionary.08cfc4c9.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index.cb274bbe.js";
-import { L as LinearProgressIndeterminate } from "../../../LinearProgressIndeterminate/index.6739ff49.js";
-import { I as Icon } from "../../../Icon/index.ab280d41.js";
-import { T as Typography } from "../../../mui_extended/Typography/index.71fbb5c4.js";
-import { M as MFLoader } from "../../../MFLoader/index.9f542136.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index.9425bdc5.js";
+import { L as LinearProgressIndeterminate } from "../../../LinearProgressIndeterminate/index.292a4af8.js";
+import { I as Icon } from "../../../Icon/index.13aaae3c.js";
+import { T as Typography } from "../../../mui_extended/Typography/index.45e97bdd.js";
+import { M as MFLoader } from "../../../MFLoader/index.5d340e32.js";
 import { W as WindowToolsMFProvider } from "../../contexts/WindowToolsMFContext/index.992ae7a3.js";
 import { D as DynamicMFParmsProvider } from "../../contexts/DynamicMFParmsContext/index.3d9ad0ad.js";
 import { L as LinearProgress } from "../../../mui_extended/LinearProgress/index.4092bb69.js";
 import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock.86c553a9.js";
 import { g as getNameDataTestId } from "../../../../test/getNameDataTestId.0faeade8.js";
-import { R as RESPONSIVE_COLAPSED_HEIGHTS, a as RESPONSIVE_ROW_HEIGHTS, M as MARGIN_GRIDLAYOUT, P as PADDING_GRIDLAYOUT } from "../../contexts/AreasContext/index.b29fb29f.js";
-import { w as withSizeProvider } from "../../../GridLayout/subcomponents/SizeProvider/index.72bfaedb.js";
-import { R as Responsive } from "../../../GridLayout/subcomponents/Responsive/index.f06bbf5e.js";
+import { R as RESPONSIVE_COLAPSED_HEIGHTS, a as RESPONSIVE_ROW_HEIGHTS, M as MARGIN_GRIDLAYOUT, P as PADDING_GRIDLAYOUT } from "../../contexts/AreasContext/index.c2289888.js";
+import { w as withSizeProvider } from "../../../GridLayout/subcomponents/SizeProvider/index.0aad6f90.js";
+import { R as Responsive } from "../../../GridLayout/subcomponents/Responsive/index.65aeef5e.js";
 import { useLocation } from "react-router-dom";
-import { L as LoadingError } from "../../../LoadingError/index.cfdfb380.js";
-import { c as cjs } from "../../../../react-draggable.079122b0.js";
-import { R as ResizeableWindow } from "../../../Resizeable/index.a27cb569.js";
+import { L as LoadingError } from "../../../LoadingError/index.b129b573.js";
+import { c as cjs } from "../../../../react-draggable.310e3387.js";
+import { R as ResizeableWindow } from "../../../Resizeable/index.57363836.js";
 const areasViewerClasses = generateUtilityClasses(
   AREAS_VIEWER_CLASS_NAME,
   [

package/components/areas/components/AreasViewer/styles.d.ts

@@ -1,2 +1,2 @@
 /// <reference types="react" />
-export declare const AreasViewerRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AreasViewerRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/areas/contexts/AreasContext/{index.b29fb29f.js → index.c2289888.js}

@@ -6,13 +6,13 @@ import { useResponsiveDesktop, useFirstRender } from "@m4l/graphics";
 import { useHostTools, useModuleDictionary, useNetwork, useModuleSkeleton, EmitEvents } from "@m4l/core";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
-import { u as useAreasViewerUtilityClasses } from "../../components/AreasViewer/index.8e9d24c2.js";
-import { u as useAreasAdminUtilityClasses } from "../../components/AreasAdmin/index.f3a211a4.js";
+import { u as useAreasViewerUtilityClasses } from "../../components/AreasViewer/index.266a3815.js";
+import { u as useAreasAdminUtilityClasses } from "../../components/AreasAdmin/index.42d40964.js";
 import { c as createDynamicMFStore } from "../DynamicMFParmsContext/index.3d9ad0ad.js";
 import { g as getAreasDictionary, D as DICCTIONARY } from "../../dictionary.08cfc4c9.js";
-import { a as addLayoutItemToBreakPointIfNoExists, b as addLayoutItemToBreakPoints, c as cloneLayouts } from "../../../GridLayout/subcomponents/Responsive/index.f06bbf5e.js";
+import { a as addLayoutItemToBreakPointIfNoExists, b as addLayoutItemToBreakPoints, c as cloneLayouts } from "../../../GridLayout/subcomponents/Responsive/index.65aeef5e.js";
 import { debounce, cloneDeep } from "lodash";
-import { A as isEqualLayouts } from "../../../GridLayout/index.3b90ce9b.js";
+import { A as isEqualLayouts } from "../../../GridLayout/index.56c3f4fa.js";
 import { useNavigate } from "react-router-dom";
 const PADDING_GRIDLAYOUT = 11;
 const MARGIN_GRIDLAYOUT = 11;

package/components/areas/hooks/useAreas/{index.5f7f615d.js → index.509c1703.js}

@@ -1,6 +1,6 @@
 import { useContext } from "react";
 import { useStore } from "zustand";
-import { b as AreasContext } from "../../contexts/AreasContext/index.b29fb29f.js";
+import { b as AreasContext } from "../../contexts/AreasContext/index.c2289888.js";
 function useAreasStore(selector, equalityFn) {
   const context = useContext(AreasContext);
   if (!context)

package/components/commercial/AppBarCommercial/{index.8b27200f.js → index.3fd10868.js}

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../utils/index.f77cc2ab.js";
-import { ab as AppBarComercialRoot } from "../../../styles/index.1735a866.js";
+import { g as getComponentUtilityClass } from "../../../utils/index.78d1638f.js";
+import { ab as AppBarComercialRoot } from "../../../styles/index.239f949e.js";
 const componentName = "M4LAppBarCommercial";
 generateUtilityClasses(
   componentName,

package/components/commercial/SectionCommercial/{index.6ffe7283.js → index.bd45c64e.js}

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../utils/index.f77cc2ab.js";
-import { ac as SectionCommercialRoot } from "../../../styles/index.1735a866.js";
+import { g as getComponentUtilityClass } from "../../../utils/index.78d1638f.js";
+import { ac as SectionCommercialRoot } from "../../../styles/index.239f949e.js";
 const componentName = "M4LSectionCommercial";
 generateUtilityClasses(
   componentName,

package/components/commercial/TopBar/{index.67ee203b.js → index.4e55cffa.js}

@@ -2,16 +2,16 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { generateUtilityClasses, useTheme, Box, Grid, styled } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../utils/index.f77cc2ab.js";
+import { g as getComponentUtilityClass } from "../../../utils/index.78d1638f.js";
 import { createContext, useContext, useState } from "react";
 import { useEnvironment } from "@m4l/core";
-import { ad as ArrowIconRoot } from "../../../styles/index.1735a866.js";
-import { I as Icon } from "../../Icon/index.ab280d41.js";
+import { ad as ArrowIconRoot } from "../../../styles/index.239f949e.js";
+import { I as Icon } from "../../Icon/index.13aaae3c.js";
 import clsx from "clsx";
 import { g as getNameDataTestId } from "../../../test/getNameDataTestId.0faeade8.js";
-import { A as Accordion } from "../../mui_extended/Accordion/index.1d692b19.js";
-import { B as Button } from "../../mui_extended/Button/index.8afd5131.js";
-import { P as Popover } from "../../mui_extended/Popover/index.594e3587.js";
+import { A as Accordion } from "../../mui_extended/Accordion/index.e6971e30.js";
+import { B as Button } from "../../mui_extended/Button/index.111f830e.js";
+import { P as Popover } from "../../mui_extended/Popover/index.5e78a637.js";
 const componentName = "M4LTopBar";
 const TopBarClasses = generateUtilityClasses(componentName, [
   "root",

package/components/commercial/{index.196f2f16.js → index.4bdbb8fe.js}

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState } from "react";
-import { ae as HamburgerMenuRoot } from "../../styles/index.1735a866.js";
+import { ae as HamburgerMenuRoot } from "../../styles/index.239f949e.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { useEnvironment } from "@m4l/core";
-import { S as SideBar } from "../SideBar/index.902789b8.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.cb274bbe.js";
+import { S as SideBar } from "../SideBar/index.bb6c2c7b.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.9425bdc5.js";
 const componentName = "M4LHamburgerMenuCommercial";
 generateUtilityClasses(componentName, ["root", "ImageLogo"]);
 function getHamburgerMenuComercialClassesUtilityClass(slot) {

package/components/formatters/BooleanFormatter/{index.71e5727f.js → index.ac870381.js}

@@ -1,9 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
-import { I as Icon } from "../../Icon/index.ab280d41.js";
+import { I as Icon } from "../../Icon/index.13aaae3c.js";
 import { W as WrapperComponent } from "../../WrapperComponent/index.57964195.js";
-import { F as FormatterRoot, f as formatterClasses } from "../index.6c7fdd6c.js";
+import { F as FormatterRoot, f as formatterClasses } from "../index.53ad2f51.js";
 import clsx from "clsx";
 const BOOLEAN_FORMATTER_DICTIONARY_KEY = `boolean_formatter`;
 const LABEL_BOOLEAN_YES = `${BOOLEAN_FORMATTER_DICTIONARY_KEY}.boolean_yes`;

package/components/formatters/{index.6c7fdd6c.js → index.53ad2f51.js}

@@ -1,10 +1,10 @@
 import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses } from "@mui/material";
 import "@mui/base";
-import { af as FormatterRootContainer } from "../../styles/index.1735a866.js";
+import { af as FormatterRootContainer } from "../../styles/index.239f949e.js";
 import { W as WrapperComponent } from "../WrapperComponent/index.57964195.js";
 import { useModuleDictionary } from "@m4l/core";
-import { a as BOOLEAN_FORMATTER_DICTIONARY_KEY } from "./BooleanFormatter/index.71e5727f.js";
+import { a as BOOLEAN_FORMATTER_DICTIONARY_KEY } from "./BooleanFormatter/index.ac870381.js";
 const COMPONENT_CLASS_NAME = "M4LFormatter";
 const formatterClasses = generateUtilityClasses(COMPONENT_CLASS_NAME, [
   "root",

package/components/hook-form/HelperError/{index.af99c705.js → index.9f93c627.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { useFormContext, useController } from "react-hook-form";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 function HelperError(props) {
   const { name } = props;
   const { control } = useFormContext();

package/components/hook-form/RHFAutocomplete/{index.b295a0b4.js → index.b8347185.js}

@@ -3,17 +3,17 @@ import { useMemo, useRef, useState, useEffect, createElement } from "react";
 import { useModuleDictionary, useModuleSkeleton, useEnvironment } from "@m4l/core";
 import { useFormContext, Controller } from "react-hook-form";
 import { Skeleton, generateUtilityClasses, generateUtilityClass, useTheme, Autocomplete, Popper, TextField, Chip } from "@mui/material";
-import { ag as WrapperOption, ah as AutocompleteRoot } from "../../../styles/index.1735a866.js";
-import { I as Image } from "../../Image/index.ec13c4a1.js";
+import { ag as WrapperOption, ah as AutocompleteRoot } from "../../../styles/index.239f949e.js";
+import { I as Image } from "../../Image/index.4b51d4ba.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
-import { T as Typography } from "../../mui_extended/Typography/index.71fbb5c4.js";
+import { T as Typography } from "../../mui_extended/Typography/index.45e97bdd.js";
 import { unstable_composeClasses } from "@mui/base";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.523aaa62.js";
+import { F as FieldLabel } from "../../FieldLabel/index.59b9b63a.js";
 import { C as CircularProgress } from "../../mui_extended/CircularProgress/index.967e70b7.js";
-import { I as IconButton } from "../../mui_extended/IconButton/index.cb274bbe.js";
+import { I as IconButton } from "../../mui_extended/IconButton/index.9425bdc5.js";
 const RHFAUTOCOMPLETE_PREFIX = "RHFAutocomplete";
 const RHFTAUTOCOMPLET_ROOT_TEST_ID = "RHFAutocomplete";
 const getNameDataTestId = (KEY) => {

package/components/hook-form/RHFAutocompleteAsync/{index.ad51f3e2.js → index.aeb3bf66.js}

@@ -2,11 +2,11 @@ import { jsx } from "react/jsx-runtime";
 import { useState, useCallback, useEffect } from "react";
 import { useNetwork, getPropertyByString } from "@m4l/core";
 import debounce from "lodash/debounce";
-import { ai as RHFAutocompleteAsyncRoot } from "../../../styles/index.1735a866.js";
+import { ai as RHFAutocompleteAsyncRoot } from "../../../styles/index.239f949e.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
-import { R as RHFAutocomplete, g as getRHFAutocompleteComponentsDictionary } from "../RHFAutocomplete/index.b295a0b4.js";
+import { R as RHFAutocomplete, g as getRHFAutocompleteComponentsDictionary } from "../RHFAutocomplete/index.b8347185.js";
 const componentName = "M4LRHFAutocompleteAsync";
 generateUtilityClasses(
   componentName,

package/components/hook-form/RHFCheckbox/{index.4aa49169.js → index.c3b7ce0f.js}

@@ -1,14 +1,14 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useFormContext, Controller } from "react-hook-form";
-import { aj as RHFCheckboxRoot, ak as ContainerCheckTypography } from "../../../styles/index.1735a866.js";
+import { aj as RHFCheckboxRoot, ak as ContainerCheckTypography } from "../../../styles/index.239f949e.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useModuleSkeleton } from "@m4l/core";
 import { useFormFocus } from "../../../index.js";
-import { C as CheckBox } from "../../mui_extended/CheckBox.d84658da.js";
+import { C as CheckBox } from "../../mui_extended/CheckBox.a8958eb8.js";
 generateUtilityClasses("M4LRHFCheckbox", [
   "root",
   "checkTypography",

package/components/hook-form/RHFColorPicker/{index.6e788803.js → index.c259b8ac.js}

@@ -3,17 +3,17 @@ import { useState } from "react";
 import { useFormContext, useWatch, Controller } from "react-hook-form";
 import { useModuleSkeleton, useEnvironment, useModuleDictionary } from "@m4l/core";
 import { SketchPicker } from "react-color";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 import { generateUtilityClasses, generateUtilityClass, Skeleton } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { al as RHFColorPickerRoot } from "../../../styles/index.1735a866.js";
+import { al as RHFColorPickerRoot } from "../../../styles/index.239f949e.js";
 import { useTheme } from "@mui/material/styles";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.523aaa62.js";
-import { P as Popover } from "../../mui_extended/Popover/index.594e3587.js";
-import { I as Icon } from "../../Icon/index.ab280d41.js";
-import { B as Button } from "../../mui_extended/Button/index.8afd5131.js";
+import { F as FieldLabel } from "../../FieldLabel/index.59b9b63a.js";
+import { P as Popover } from "../../mui_extended/Popover/index.5e78a637.js";
+import { I as Icon } from "../../Icon/index.13aaae3c.js";
+import { B as Button } from "../../mui_extended/Button/index.111f830e.js";
 const componentName = "M4LRHFColorPicker";
 const colorPickerClasses = generateUtilityClasses(componentName, [
   "root",

package/components/hook-form/RHFDateTime/{index.4c686856.js → index.4efe48ce.js}

@@ -7,12 +7,12 @@ import { useFormatter, useResponsiveDesktop } from "@m4l/graphics";
 import { useState, useEffect } from "react";
 import { unstable_composeClasses } from "@mui/base";
 import clsx from "clsx";
-import { am as RHFDateTimeRoot } from "../../../styles/index.1735a866.js";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { am as RHFDateTimeRoot } from "../../../styles/index.239f949e.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.523aaa62.js";
-import { I as Icon } from "../../Icon/index.ab280d41.js";
+import { F as FieldLabel } from "../../FieldLabel/index.59b9b63a.js";
+import { I as Icon } from "../../Icon/index.13aaae3c.js";
 const SkeletonRHFDateTime = (props) => {
   const { skeletonWidth, skeletonHeight, className, label } = props;
   return /* @__PURE__ */ jsxs(Fragment, { children: [

package/components/hook-form/RHFPeriod/{index.7bd17690.js → index.0f912e3e.js}

@@ -1,13 +1,13 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { an as RHFPeriodRoot } from "../../../styles/index.1735a866.js";
+import { an as RHFPeriodRoot } from "../../../styles/index.239f949e.js";
 import { useFormContext, Controller } from "react-hook-form";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { useModuleSkeleton } from "@m4l/core";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.523aaa62.js";
-import { P as Period } from "../../Period/index.2a193da0.js";
+import { F as FieldLabel } from "../../FieldLabel/index.59b9b63a.js";
+import { P as Period } from "../../Period/index.13e4c351.js";
 const componentName = "M4LRHFPeriod";
 generateUtilityClasses(componentName, [
   "root",

package/components/hook-form/RHFRadioGroup/RHFRadioGroup.d.ts

@@ -1,3 +1,3 @@
 import { RadioGroupProps, RadioProps } from '@mui/material';
 import { RHFRadioGroupProps } from './types';
-export declare function RHFRadioGroup<TOption extends RadioProps>({ name, options, getOptionLabel, getOptionValue, ...other }: RHFRadioGroupProps<TOption> & RadioGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare function RHFRadioGroup<TOption extends RadioProps>({ name, options, getOptionLabel, getOptionValue, getOptionIconUrl, renderOptionLabel, ControlLabel, ...other }: RHFRadioGroupProps<TOption> & RadioGroupProps): import("react/jsx-runtime").JSX.Element;

package/components/hook-form/RHFRadioGroup/formatters/OptionIconLabelFormatter/index.d.ts

@@ -0,0 +1,2 @@
+import { GetOptionStringType } from "../../types";
+export declare function OptionIconLabelFormatter<T>(option: T, getOptionLabel: GetOptionStringType<T>, getOptionIconUrl: GetOptionStringType<T>): import("react/jsx-runtime").JSX.Element;

package/components/hook-form/RHFRadioGroup/index.96c94958.js

@@ -0,0 +1,52 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useFormContext, Controller } from "react-hook-form";
+import { RadioGroup, FormControlLabel, FormHelperText, Radio } from "@mui/material";
+import { I as Icon } from "../../Icon/index.13aaae3c.js";
+function OptionIconLabelFormatter(option, getOptionLabel, getOptionIconUrl) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      Icon,
+      {
+        src: `${getOptionIconUrl(option)}`
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { children: getOptionLabel(option) })
+  ] });
+}
+function RHFRadioGroup({
+  name,
+  options,
+  getOptionLabel,
+  getOptionValue,
+  getOptionIconUrl,
+  renderOptionLabel = OptionIconLabelFormatter,
+  ControlLabel = Radio,
+  ...other
+}) {
+  const { control } = useFormContext();
+  return /* @__PURE__ */ jsx(
+    Controller,
+    {
+      name,
+      control,
+      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(RadioGroup, { ...field, row: true, ...other, children: options.map((option) => {
+          return /* @__PURE__ */ jsx(
+            FormControlLabel,
+            {
+              defaultValue: field.value,
+              value: getOptionValue(option),
+              control: /* @__PURE__ */ jsx(ControlLabel, { ...option }),
+              label: renderOptionLabel(option, getOptionLabel, getOptionIconUrl)
+            },
+            getOptionValue(option)
+          );
+        }) }),
+        !!error && /* @__PURE__ */ jsx(FormHelperText, { error: true, sx: { px: 2 }, children: error.message })
+      ] })
+    }
+  );
+}
+export {
+  RHFRadioGroup as R
+};

package/components/hook-form/RHFRadioGroup/types.d.ts

@@ -1,8 +1,14 @@
 import { RadioProps } from '@mui/material';
-export interface RHFRadioGroupProps<TOption extends RadioProps> {
+import { ReactNode } from 'react';
+export declare type GetOptionStringType<T> = (option: T) => string;
+export declare type RenderOptionLabelType<T> = (option: T, getOptionLabel: GetOptionStringType<T>, getOptionIconUrl: GetOptionStringType<T>) => ReactNode;
+export interface RHFRadioGroupProps<T extends RadioProps> {
     name: string;
     defaultValue?: string;
-    options: TOption[];
-    getOptionLabel: (option: TOption) => string;
-    getOptionValue: (option: TOption) => string;
+    ControlLabel?: (props: RadioProps) => React.ReactElement<any, any>;
+    options: T[];
+    getOptionLabel: GetOptionStringType<T>;
+    getOptionValue: GetOptionStringType<T>;
+    getOptionIconUrl: GetOptionStringType<T>;
+    renderOptionLabel: RenderOptionLabelType<T>;
 }

package/components/hook-form/RHFTextField/{index.ec3f5dd5.js → index.828b30f5.js}

@@ -2,16 +2,16 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useModuleSkeleton, useEnvironment } from "@m4l/core";
 import { Skeleton, generateUtilityClasses, TextField, InputAdornment, generateUtilityClass } from "@mui/material";
 import { forwardRef, useState, useEffect } from "react";
-import { I as IconButton } from "../../mui_extended/IconButton/index.cb274bbe.js";
+import { I as IconButton } from "../../mui_extended/IconButton/index.9425bdc5.js";
 import { useFormContext, Controller } from "react-hook-form";
-import { ao as SkeletonTextFieldRoot, ap as WrapperSkeletonRHFTextField, aq as RHFTextFieldRoot, ar as RHFTextFieldPasswordRoot } from "../../../styles/index.1735a866.js";
+import { ao as SkeletonTextFieldRoot, ap as WrapperSkeletonRHFTextField, aq as RHFTextFieldRoot, ar as RHFTextFieldPasswordRoot } from "../../../styles/index.239f949e.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../utils/index.f77cc2ab.js";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { g as getComponentUtilityClass } from "../../../utils/index.78d1638f.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.523aaa62.js";
+import { F as FieldLabel } from "../../FieldLabel/index.59b9b63a.js";
 const RHFTEXTFIELD_ROOT_TEST_ID = "RHFTextFieldRoot";
 const RHFTEXTFIELD_INPUT_TEST_ID = "RHFTextFieldInput";
 const RHFTEXTFIELD_PREFIX = "RHFTextField";

package/components/hook-form/RHFUpload/{index.1275836a.js → index.b664c68b.js}

@@ -3,15 +3,15 @@ import { useCallback } from "react";
 import { useFormContext, Controller } from "react-hook-form";
 import isString from "lodash/isString";
 import { useDropzone } from "react-dropzone";
-import { I as Image } from "../../Image/index.ec13c4a1.js";
+import { I as Image } from "../../Image/index.4b51d4ba.js";
 import { useEnvironment, useModuleDictionary, useModuleSkeleton } from "@m4l/core";
-import { as as UploadImageRoot, at as WrapperRHFUploadImage } from "../../../styles/index.1735a866.js";
+import { as as UploadImageRoot, at as WrapperRHFUploadImage } from "../../../styles/index.239f949e.js";
 import { Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
-import { T as Typography } from "../../mui_extended/Typography/index.71fbb5c4.js";
-import { B as Button } from "../../mui_extended/Button/index.8afd5131.js";
-import { H as HelperText } from "../../HelperText/index.af402ba9.js";
+import { T as Typography } from "../../mui_extended/Typography/index.45e97bdd.js";
+import { B as Button } from "../../mui_extended/Button/index.111f830e.js";
+import { H as HelperText } from "../../HelperText/index.5c72277a.js";
 const ICON_PREFIX = "M4LRHFUploadImage";
 const getNameRHFUploadImageDataTestId = (KEY) => {
   return `${ICON_PREFIX}-${KEY}`;