@m4l/components 3.0.1 → 3.0.3

package/components/areas/components/AreasAdmin/{index-qqSduaty.js → index-w4ZiYbUn.js}

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { u as useAreasStore } from "../../hooks/useAreas/index-o0DvT3xZ.js";
+import { u as useAreasStore } from "../../hooks/useAreas/index-D9svmsAV.js";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { useState, useRef, useMemo } from "react";
 import * as Yup from "yup";
@@ -10,22 +10,22 @@ import { g as getComponentUtilityClass } from "../../../../utils/index-DiMrtgIu.
 import { A as AREAS_ADMIN_CLASS_NAME } from "../../constants-rqODZNZe.js";
 import { I as ICONS } from "../../icons-CwFr-alN.js";
 import { g as getAreasDictionary, D as DICCTIONARY } from "../../dictionary-YUsP9beq.js";
-import { a6 as EditAreaHeader, a7 as AreasAdminRoot } from "../../../../styles/index-Cc9p_h7i.js";
+import { a6 as EditAreaHeader, a7 as AreasAdminRoot } from "../../../../styles/index-DITv2ClE.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { shallow } from "zustand/shallow";
-import { M as MenuActions } from "../../../mui_extended/MenuActions/index-CUz70BPj.js";
-import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index-B4a0h0fX.js";
-import { R as RHFTextField } from "../../../hook-form/RHFTextField/index-Cz7BMTLe.js";
-import { A as Actions } from "../../../CommonActions/components/Actions/index-B_vOmNZT.js";
-import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index-BlaMdPmp.js";
-import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index-DGooFqVu.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index-BfDbi0cC.js";
-import { P as Popover } from "../../../mui_extended/Popover/index-C6_2t4L1.js";
-import { T as Typography } from "../../../mui_extended/Typography/index-DKPqV11f.js";
-import { S as ScrollBar } from "../../../ScrollBar/index-BpTjE7o3.js";
+import { M as MenuActions } from "../../../mui_extended/MenuActions/index-DUH9jcY3.js";
+import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index-D-Aek3pv.js";
+import { R as RHFTextField } from "../../../hook-form/RHFTextField/index-BcOjGk_X.js";
+import { A as Actions } from "../../../CommonActions/components/Actions/index-BKkqUxgb.js";
+import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index-GS4HJIdE.js";
+import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index-iGNIvcsn.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index-8KJAFQdk.js";
+import { P as Popover } from "../../../mui_extended/Popover/index-ADNJKYaU.js";
+import { T as Typography } from "../../../mui_extended/Typography/index-DdbNIn5v.js";
+import { S as ScrollBar } from "../../../ScrollBar/index-CHwim4Ga.js";
 import TouchRipple from "@mui/material/ButtonBase/TouchRipple";
-import { B as Button } from "../../../mui_extended/Button/index-DlzpoczE.js";
-import { I as Icon } from "../../../Icon/index-CedboS6y.js";
+import { B as Button } from "../../../mui_extended/Button/index-CeKWngaw.js";
+import { I as Icon } from "../../../Icon/index-94Yiv115.js";
 import { u as useOnClickOutside } from "../../index-B_Odny9h.js";
 const areasAdminClasses = generateUtilityClasses(
   AREAS_ADMIN_CLASS_NAME,

package/components/areas/components/AreasViewer/{index-D5If8gFK.js → index-C_Doyhlf.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-Cc9p_h7i.js";
+import { a8 as WindowRoot, a9 as WrapperWindowModal, aa as AreasViewerRoot } from "../../../../styles/index-DITv2ClE.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-o0DvT3xZ.js";
+import { u as useAreasStore } from "../../hooks/useAreas/index-D9svmsAV.js";
 import { generateUtilityClasses, Skeleton } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { g as getComponentUtilityClass } from "../../../../utils/index-DiMrtgIu.js";
 import { a as AREAS_VIEWER_CLASS_NAME } from "../../constants-rqODZNZe.js";
 import { useModuleDictionary, useEnvironment, useModuleSkeleton } from "@m4l/core";
-import { a as MemonizedMenuActions } from "../../../mui_extended/MenuActions/index-CUz70BPj.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { I as ICONS } from "../../icons-CwFr-alN.js";
 import { g as getAreasDictionary, D as DICCTIONARY } from "../../dictionary-YUsP9beq.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index-BfDbi0cC.js";
-import { L as LinearProgressIndeterminate } from "../../../LinearProgressIndeterminate/index-Do7CKcow.js";
-import { I as Icon } from "../../../Icon/index-CedboS6y.js";
-import { T as Typography } from "../../../mui_extended/Typography/index-DKPqV11f.js";
-import { M as MFLoader } from "../../../MFLoader/index-Bcg9TXnJ.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index-8KJAFQdk.js";
+import { L as LinearProgressIndeterminate } from "../../../LinearProgressIndeterminate/index-DOKrJpZ4.js";
+import { a as MemonizedMenuActions } from "../../../mui_extended/MenuActions/index-DUH9jcY3.js";
+import { I as Icon } from "../../../Icon/index-94Yiv115.js";
+import { T as Typography } from "../../../mui_extended/Typography/index-DdbNIn5v.js";
+import { M as MFLoader } from "../../../MFLoader/index-B4k4mKvG.js";
 import { W as WindowToolsMFProvider } from "../../contexts/WindowToolsMFContext/index-DkE30fhm.js";
 import { D as DynamicMFParmsProvider } from "../../contexts/DynamicMFParmsContext/index-22c6E7vK.js";
 import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock-CF-669v-.js";
 import { g as getNameDataTestId } from "../../../../test/getNameDataTestId-BaBTWhBr.js";
-import { c as createToaster, T as ToastContainer } from "../../../ToastContainer/index-B5VGIn45.js";
-import { R as RESPONSIVE_COLAPSED_HEIGHTS, a as RESPONSIVE_ROW_HEIGHTS, M as MARGIN_GRIDLAYOUT, P as PADDING_GRIDLAYOUT } from "../../contexts/AreasContext/index-Dyj8tCdG.js";
-import { w as withSizeProvider } from "../../../GridLayout/subcomponents/SizeProvider/index-OWN-RzRq.js";
-import { R as Responsive } from "../../../GridLayout/subcomponents/Responsive/index-bpKDnaCd.js";
+import { c as createToaster, T as ToastContainer } from "../../../ToastContainer/index-CcDbkO5x.js";
+import { R as RESPONSIVE_COLAPSED_HEIGHTS, a as RESPONSIVE_ROW_HEIGHTS, M as MARGIN_GRIDLAYOUT, P as PADDING_GRIDLAYOUT } from "../../contexts/AreasContext/index-BhgVSihv.js";
+import { w as withSizeProvider } from "../../../GridLayout/subcomponents/SizeProvider/index-HZgs6M75.js";
+import { R as Responsive } from "../../../GridLayout/subcomponents/Responsive/index-uchivok8.js";
 import { useLocation } from "react-router-dom";
-import { L as LoadingError } from "../../../LoadingError/index-CNh7b1ew.js";
+import { L as LoadingError } from "../../../LoadingError/index-DbVvt8Og.js";
 import { a as Draggable } from "../../../../react-draggable-DsCPdgQP.js";
-import { R as ResizeableWindow } from "../../../Resizeable/index-ObbOlXFx.js";
+import { R as ResizeableWindow } from "../../../Resizeable/index-enxKr_xx.js";
 const areasViewerClasses = generateUtilityClasses(
   AREAS_VIEWER_CLASS_NAME,
   [
@@ -268,7 +268,6 @@ function Header(props) {
       window.version,
       window.windowOptions,
       window.fnQueryClose
-      // window.colapsed,
     ];
   }, shallow);
   const { saveModuleCookies, resetModuleCookies } = useAreasStore(
@@ -276,7 +275,7 @@ function Header(props) {
     shallow
   );
   const maximizedId = useAreasStore((state) => state.hashAreas[areaId].maximizedId, shallow);
-  const colapsed = useAreasStore((state) => {
+  const collapsed = useAreasStore((state) => {
     const currentBreakpoint = state.hashAreas[areaId].currentBreakpoint;
     if (currentBreakpoint) {
       return state.hashAreas[areaId].layouts[currentBreakpoint].find((li) => li.i === windowId)?.colapsed;
@@ -314,8 +313,8 @@ function Header(props) {
     }
     e.stopPropagation();
   };
-  const colapedToggle = (e) => {
-    if (!colapsed) {
+  const collapsedToggle = (e) => {
+    if (!collapsed) {
       colapseLayoutItem(areaId, windowId);
     } else {
       unColapseLayoutItem(areaId, windowId);
@@ -329,10 +328,10 @@ function Header(props) {
     /* @__PURE__ */ jsx(LinearProgressIndeterminate, {}),
     /* @__PURE__ */ jsxs("div", { className: areasViewerClasses.windowHeaderContent, children: [
       /* @__PURE__ */ jsx(Icon, { src: url_icon, size: "medium" }),
-      /* @__PURE__ */ jsx(Typography, { className: areasViewerClasses.windowHeaderTitle, variant: "h5", children: `${title}` }),
+      /* @__PURE__ */ jsx(Typography, { className: areasViewerClasses.windowHeaderTitle, variant: "h5", children: title }),
       /* @__PURE__ */ jsxs("div", { className: areasViewerClasses.windowHeaderCancelHandle, children: [
-        !colapsed && /* @__PURE__ */ jsx(MainActions, { windowId }),
-        !colapsed && menuActions.length > 0 && /* @__PURE__ */ jsx(
+        !collapsed && /* @__PURE__ */ jsx(MainActions, { windowId }),
+        !collapsed && menuActions.length > 0 && /* @__PURE__ */ jsx(
           MemonizedMenuActions,
           {
             arrowType: "no-arrow",
@@ -344,7 +343,7 @@ function Header(props) {
             toolTip: getLabel(getAreasDictionary(DICCTIONARY.label_module_actions))
           }
         ),
-        !colapsed && (emergeType === "layout" || emergeType === "popup") && /* @__PURE__ */ jsx(
+        !collapsed && (emergeType === "layout" || emergeType === "popup") && /* @__PURE__ */ jsx(
           IconButton,
           {
             className: "m4l_draggableCancel",
@@ -362,12 +361,12 @@ function Header(props) {
           IconButton,
           {
             className: "m4l_draggableCancel",
-            onClick: colapedToggle,
+            onClick: collapsedToggle,
             "aria-label": "click",
-            src: !colapsed ? `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.COLAPSE}` : `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.UNCOLPASE}`,
+            src: !collapsed ? `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.COLAPSE}` : `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.UNCOLPASE}`,
             tooltip: getLabel(
               getAreasDictionary(
-                !colapsed ? DICCTIONARY.label_collapse_window : DICCTIONARY.label_uncollapse_window
+                !collapsed ? DICCTIONARY.label_collapse_window : DICCTIONARY.label_uncollapse_window
               )
             )
           }
@@ -426,7 +425,8 @@ const Window = (props) => {
     close,
     startProgress,
     stopProgress,
-    setFnQueryClose
+    setFnQueryClose,
+    setWindowTitle
   } = useAreasStore((state) => state.windowActions, shallow);
   const { selectLayout } = useAreasStore((state) => state.areaActions, shallow);
   const { loadCookiesFromApi } = useAreasStore((state) => state.windowActions, shallow);
@@ -452,7 +452,8 @@ const Window = (props) => {
       setFnQueryClose: (fnQueryClose) => {
         setFnQueryClose(windowId, fnQueryClose);
       },
-      toast: createToaster(windowId)
+      toast: createToaster(windowId),
+      setWindowTitle: (title) => setWindowTitle(windowId, title)
     }),
     []
   );
@@ -486,39 +487,30 @@ const Window = (props) => {
       children: /* @__PURE__ */ jsxs("div", { className: areasViewerClasses.windowRootContainer, children: [
         /* @__PURE__ */ jsx(Header, { areaId, windowId, emergeType }),
         /* @__PURE__ */ jsx(ToastContainer, { fixed: false, position: "top-center", containerId: windowId }),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: clsx(
-              areasViewerClasses.windowContent
-              // colapsed ? areasViewerClasses.colapsed : null,
-            ),
-            children: [
-              status === "init" ? (
-                /* validar uso */
-                /* Todo: Validar agregar nuevo componente de carga. */
-                /* @__PURE__ */ jsx(Fragment, { children: "Cargando..." })
-              ) : null,
-              status === "loaded" ? winType === "microfrontend" ? /* @__PURE__ */ jsx(
-                MemonizedMicroFrontend,
-                {
-                  moduleId,
-                  dynamicMFStore,
-                  windowTools,
-                  ...mfProps
-                }
-              ) : /* @__PURE__ */ jsx(
-                Component,
-                {
-                  moduleId,
-                  dynamicMFStore,
-                  windowTools,
-                  component
-                }
-              ) : null
-            ]
-          }
-        )
+        /* @__PURE__ */ jsxs("div", { className: clsx(areasViewerClasses.windowContent), children: [
+          status === "init" ? (
+            /* validar uso */
+            /* Todo: Validar agregar nuevo componente de carga. */
+            /* @__PURE__ */ jsx(Fragment, { children: "Cargando..." })
+          ) : null,
+          status === "loaded" ? winType === "microfrontend" ? /* @__PURE__ */ jsx(
+            MemonizedMicroFrontend,
+            {
+              moduleId,
+              dynamicMFStore,
+              windowTools,
+              ...mfProps
+            }
+          ) : /* @__PURE__ */ jsx(
+            Component,
+            {
+              moduleId,
+              dynamicMFStore,
+              windowTools,
+              component
+            }
+          ) : null
+        ] })
       ] })
     }
   );

package/components/areas/contexts/AreasContext/{index-Dyj8tCdG.js → index-BhgVSihv.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-D5If8gFK.js";
-import { u as useAreasAdminUtilityClasses } from "../../components/AreasAdmin/index-qqSduaty.js";
+import { u as useAreasViewerUtilityClasses } from "../../components/AreasViewer/index-C_Doyhlf.js";
+import { u as useAreasAdminUtilityClasses } from "../../components/AreasAdmin/index-w4ZiYbUn.js";
 import { c as createDynamicMFStore } from "../DynamicMFParmsContext/index-22c6E7vK.js";
 import { g as getAreasDictionary, D as DICCTIONARY } from "../../dictionary-YUsP9beq.js";
-import { a as addLayoutItemToBreakPointIfNoExists, b as addLayoutItemToBreakPoints, c as cloneLayouts } from "../../../GridLayout/subcomponents/Responsive/index-bpKDnaCd.js";
+import { a as addLayoutItemToBreakPointIfNoExists, b as addLayoutItemToBreakPoints, c as cloneLayouts } from "../../../GridLayout/subcomponents/Responsive/index-uchivok8.js";
 import { debounce, cloneDeep } from "lodash";
-import { z as isEqualLayouts } from "../../../GridLayout/index-HK_hTGnZ.js";
+import { z as isEqualLayouts } from "../../../GridLayout/index-CRsM-v5t.js";
 const PADDING_GRIDLAYOUT = 11;
 const MARGIN_GRIDLAYOUT = 11;
 const DEBOUCED_SAVE_TIME = 500;
@@ -369,7 +369,7 @@ const createAreasStore = (initProps) => {
           },
           addLayout: (areaId, windowId, newWindowProps) => {
             let previousId = windowId;
-            const freeMove = newWindowProps.emergeType === "popup" ? true : false;
+            const freeMove = newWindowProps.emergeType === "popup";
             const newLayoutItem = {
               ...newWindowProps.layoutProps,
               i: windowId,
@@ -1007,6 +1007,11 @@ const createAreasStore = (initProps) => {
             set((state) => {
               state.hashWindows[windowId].fnQueryClose = fnQueryClose;
             });
+          },
+          setWindowTitle: (windowId, title) => {
+            set((state) => {
+              state.hashWindows[windowId].title = title;
+            });
           }
         },
         areaAdminActions: {

package/components/areas/contexts/AreasContext/types.d.ts

@@ -205,6 +205,7 @@ export interface AreasStateWithActions extends AreasState {
         saveModuleCookies: (windowId: string) => void;
         resetModuleCookies: (windowId: string) => void;
         setFnQueryClose: (windowId: string, fnQueryClose: () => void) => void;
+        setWindowTitle: (windowId: string, title: string) => void;
     };
     areaAdminActions: {
         setFocus: (value: boolean) => void;

package/components/areas/contexts/WindowToolsMFContext/types.d.ts

@@ -57,6 +57,11 @@ export interface WindowToolsMF {
      * @param fnQueryClose La función de consulta de cierre de la ventana que se desea establecer.
      */
     setFnQueryClose: (fnQueryClose: () => void) => void;
+    /**
+     * Método para setear el titulo de la ventana y que pueda cambiar de idioma
+     * @param {string} title Titulo que se visulizará en la ventana del módulo
+     */
+    setWindowTitle: (title: string) => void;
 }
 /**
  * Props del componente WindowToolsMFProvider que incluyen las herramientas de ventana proporcionadas por la interfaz WindowToolsMF.

package/components/areas/hooks/index.d.ts

@@ -1,2 +1,3 @@
 export { useDynamicMFParametersStore } from './useDynamicMFParameters';
 export { useWindowToolsMF } from './useWindowToolsMF';
+export { useSetWindowsTitle } from './useSetWindowsTitle';

package/components/areas/hooks/useAreas/{index-o0DvT3xZ.js → index-D9svmsAV.js}

@@ -1,6 +1,6 @@
 import { useContext } from "react";
 import { useStore } from "zustand";
-import { b as AreasContext } from "../../contexts/AreasContext/index-Dyj8tCdG.js";
+import { b as AreasContext } from "../../contexts/AreasContext/index-BhgVSihv.js";
 function useAreasStore(selector, equalityFn) {
   const context = useContext(AreasContext);
   if (!context) throw new Error("useAreasStore context must be use inside AreasContext");

package/components/areas/hooks/useSetWindowsTitle/index.d.ts

@@ -0,0 +1 @@
+export * from './useSetWindowsTitle';

package/components/areas/hooks/useSetWindowsTitle/useSetWindowsTitle-BzPD-miW.js

@@ -0,0 +1,31 @@
+import { useEffect } from "react";
+import { shallow } from "zustand/shallow";
+import { useFlagsPresent, CommonFlags, useModuleDictionary } from "@m4l/core";
+import { u as useWindowToolsMF } from "../useWindowToolsMF/index-BECQfhbC.js";
+import { u as useDynamicMFParametersStore } from "../useDynamicMFParameters/index-DhbcZPs9.js";
+const titleLabels = {
+  moduleName: "module_name",
+  moduleNameAdd: "module_name_add",
+  moduleNameEdit: "module_name_edit"
+};
+function useSetWindowsTitle({
+  isAddEditModule = false
+} = {}) {
+  const isFlagPresent = useFlagsPresent([CommonFlags.FLAG_DICTIONARY_LOADED]);
+  const { getLabel } = useModuleDictionary();
+  const { setWindowTitle } = useWindowToolsMF();
+  const id = useDynamicMFParametersStore(
+    // objectId or id  puede ser el nombre del parametro del con el Id que se está editando en los modulos add/edit
+    (state) => state.dynamicMFParameters?.objectId || state.dynamicMFParameters?.id,
+    shallow
+  );
+  useEffect(() => {
+    if (isFlagPresent) {
+      const labelKey = isAddEditModule ? id ? titleLabels.moduleNameEdit : titleLabels.moduleNameAdd : titleLabels.moduleName;
+      setWindowTitle(getLabel(labelKey));
+    }
+  }, [getLabel, isFlagPresent]);
+}
+export {
+  useSetWindowsTitle as u
+};

package/components/areas/hooks/useSetWindowsTitle/useSetWindowsTitle.d.ts

@@ -0,0 +1,3 @@
+export declare function useSetWindowsTitle({ isAddEditModule, }?: {
+    isAddEditModule?: boolean;
+}): void;

package/components/commercial/AppBarCommercial/{index-DvigwCQP.js → index-C2XuD_Di.js}

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { g as getComponentUtilityClass } from "../../../utils/index-DiMrtgIu.js";
-import { ab as AppBarComercialRoot } from "../../../styles/index-Cc9p_h7i.js";
+import { ab as AppBarComercialRoot } from "../../../styles/index-DITv2ClE.js";
 const componentName = "M4LAppBarCommercial";
 generateUtilityClasses(
   componentName,

package/components/commercial/SectionCommercial/{index-CLHGooDg.js → index-CQ909EmI.js}

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { g as getComponentUtilityClass } from "../../../utils/index-DiMrtgIu.js";
-import { ac as SectionCommercialRoot } from "../../../styles/index-Cc9p_h7i.js";
+import { ac as SectionCommercialRoot } from "../../../styles/index-DITv2ClE.js";
 const componentName = "M4LSectionCommercial";
 generateUtilityClasses(
   componentName,

package/components/commercial/TopBar/{index-DJNYXgHq.js → index-C3oRupMz.js}

@@ -5,13 +5,13 @@ import { unstable_composeClasses } from "@mui/base";
 import { g as getComponentUtilityClass } from "../../../utils/index-DiMrtgIu.js";
 import { createContext, useContext, useState } from "react";
 import { useEnvironment } from "@m4l/core";
-import { ad as ArrowIconRoot } from "../../../styles/index-Cc9p_h7i.js";
-import { I as Icon } from "../../Icon/index-CedboS6y.js";
+import { ad as ArrowIconRoot } from "../../../styles/index-DITv2ClE.js";
+import { I as Icon } from "../../Icon/index-94Yiv115.js";
 import clsx from "clsx";
 import { g as getNameDataTestId } from "../../../test/getNameDataTestId-BaBTWhBr.js";
-import { A as Accordion } from "../../mui_extended/Accordion/index-ZFpEUCnw.js";
-import { B as Button } from "../../mui_extended/Button/index-DlzpoczE.js";
-import { P as Popover } from "../../mui_extended/Popover/index-C6_2t4L1.js";
+import { A as Accordion } from "../../mui_extended/Accordion/index-CImLE2c2.js";
+import { B as Button } from "../../mui_extended/Button/index-CeKWngaw.js";
+import { P as Popover } from "../../mui_extended/Popover/index-ADNJKYaU.js";
 const componentName = "M4LTopBar";
 const TopBarClasses = generateUtilityClasses(componentName, [
   /* elements */

package/components/commercial/{index-BLUHQfcA.js → index-D8V8uETc.js}

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState } from "react";
-import { ae as HamburgerMenuRoot } from "../../styles/index-Cc9p_h7i.js";
+import { ae as HamburgerMenuRoot } from "../../styles/index-DITv2ClE.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
 import { useEnvironment } from "@m4l/core";
-import { S as SideBar } from "../SideBar/index-Cg1bZn8y.js";
-import { I as IconButton } from "../mui_extended/IconButton/index-BfDbi0cC.js";
+import { S as SideBar } from "../SideBar/index-Bi1cZIrX.js";
+import { I as IconButton } from "../mui_extended/IconButton/index-8KJAFQdk.js";
 const componentName = "M4LHamburgerMenuCommercial";
 generateUtilityClasses(componentName, ["root", "ImageLogo"]);
 function getHamburgerMenuComercialClassesUtilityClass(slot) {

package/components/formatters/BooleanFormatter/{index-DpF0x_xp.js → index-Cgmuw-1G.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-CedboS6y.js";
+import { I as Icon } from "../../Icon/index-94Yiv115.js";
 import { W as WrapperComponent } from "../../WrapperComponent/index-BHV-CsDU.js";
-import { F as FormatterRoot, f as formatterClasses } from "../index-CDt8LzvL.js";
+import { F as FormatterRoot, f as formatterClasses } from "../index-D52mbpAz.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-CDt8LzvL.js → index-D52mbpAz.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-Cc9p_h7i.js";
+import { af as FormatterRootContainer } from "../../styles/index-DITv2ClE.js";
 import { W as WrapperComponent } from "../WrapperComponent/index-BHV-CsDU.js";
 import { useModuleDictionary } from "@m4l/core";
-import { a as BOOLEAN_FORMATTER_DICTIONARY_KEY } from "./BooleanFormatter/index-DpF0x_xp.js";
+import { a as BOOLEAN_FORMATTER_DICTIONARY_KEY } from "./BooleanFormatter/index-Cgmuw-1G.js";
 const COMPONENT_CLASS_NAME = "M4LFormatter";
 const formatterClasses = generateUtilityClasses(COMPONENT_CLASS_NAME, [
   /* elements */

package/components/hook-form/HelperError/{index-D-_czK9n.js → index-B6yzmaGZ.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-COWCXeJp.js";
+import { H as HelperText } from "../../HelperText/index-D2yPRkGD.js";
 function HelperError(props) {
   const { name } = props;
   const { control } = useFormContext();

package/components/hook-form/RHFAutocomplete/{index-BhbgwNUz.js → index-BAUo34ue.js}

@@ -6,14 +6,14 @@ import { generateUtilityClasses, generateUtilityClass, Skeleton, useTheme, Autoc
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useFormContext, Controller } from "react-hook-form";
 import { unstable_composeClasses } from "@mui/base";
-import { ag as WrapperOption, ah as AutocompleteRoot } from "../../../styles/index-Cc9p_h7i.js";
+import { ag as WrapperOption, ah as AutocompleteRoot } from "../../../styles/index-DITv2ClE.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock-CF-669v-.js";
-import { I as Image } from "../../Image/index-B7FhR9uF.js";
-import { T as Typography } from "../../mui_extended/Typography/index-DKPqV11f.js";
-import { H as HelperText } from "../../HelperText/index-COWCXeJp.js";
-import { F as FieldLabel } from "../../FieldLabel/index-BpW2AGJx.js";
+import { I as Image } from "../../Image/index-D0wxe0iA.js";
+import { T as Typography } from "../../mui_extended/Typography/index-DdbNIn5v.js";
+import { H as HelperText } from "../../HelperText/index-D2yPRkGD.js";
+import { F as FieldLabel } from "../../FieldLabel/index-uRWxFkWU.js";
 import { C as CircularProgress } from "../../mui_extended/CircularProgress/index-Bnnti_G6.js";
-import { I as IconButton } from "../../mui_extended/IconButton/index-BfDbi0cC.js";
+import { I as IconButton } from "../../mui_extended/IconButton/index-8KJAFQdk.js";
 const componentName = "M4LRHFAutocomplete";
 generateUtilityClasses(
   componentName,

package/components/hook-form/RHFAutocompleteAsync/{index-BnUgdSnR.js → index-C7qy6PHH.js}

@@ -4,9 +4,9 @@ import { useState, useCallback, useEffect } from "react";
 import debounce from "lodash/debounce";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { ai as RHFAutocompleteAsyncRoot } from "../../../styles/index-Cc9p_h7i.js";
+import { ai as RHFAutocompleteAsyncRoot } from "../../../styles/index-DITv2ClE.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock-CF-669v-.js";
-import { R as RHFAutocomplete, g as getRHFAutocompleteComponentsDictionary } from "../RHFAutocomplete/index-BhbgwNUz.js";
+import { R as RHFAutocomplete, g as getRHFAutocompleteComponentsDictionary } from "../RHFAutocomplete/index-BAUo34ue.js";
 const componentName = "M4LRHFAutocompleteAsync";
 generateUtilityClasses(
   componentName,

package/components/hook-form/RHFCheckbox/{index-ubHFuH1F.js → index-Dmsakuyn.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-Cc9p_h7i.js";
+import { aj as RHFCheckboxRoot, ak as ContainerCheckTypography } from "../../../styles/index-DITv2ClE.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { H as HelperText } from "../../HelperText/index-COWCXeJp.js";
+import { H as HelperText } from "../../HelperText/index-D2yPRkGD.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock-CF-669v-.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useModuleSkeleton } from "@m4l/core";
 import { useFormFocus } from "../../../index.js";
-import { C as CheckBox } from "../../mui_extended/CheckBox-ByxYagHV.js";
+import { C as CheckBox } from "../../mui_extended/CheckBox-D4lOF2ZN.js";
 generateUtilityClasses("M4LRHFCheckbox", [
   /* elements */
   "root",

package/components/hook-form/RHFCheckbox/styles.d.ts

@@ -3,5 +3,5 @@ export declare const RHFCheckboxRoot: import("@emotion/styled").StyledComponent<
 export declare const WrapperSKTRHFCheckbox: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const SKTCheckSkeleton: import("@emotion/styled").StyledComponent<import("@mui/material").SkeletonOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, "style" | "children" | "width" | "className" | "height" | "animation" | "variant" | "sx" | "classes"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "style" | "children" | "width" | "className" | "height" | "animation" | "sx" | "classes" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const ContainerCheckTypography: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/hook-form/RHFColorPicker/{index-DBpi0Zhe.js → index-DCTeXEXx.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-COWCXeJp.js";
+import { H as HelperText } from "../../HelperText/index-D2yPRkGD.js";
 import { generateUtilityClasses, generateUtilityClass, Skeleton } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { al as RHFColorPickerRoot } from "../../../styles/index-Cc9p_h7i.js";
+import { al as RHFColorPickerRoot } from "../../../styles/index-DITv2ClE.js";
 import { useTheme } from "@mui/material/styles";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index-BpW2AGJx.js";
-import { P as Popover } from "../../mui_extended/Popover/index-C6_2t4L1.js";
-import { I as Icon } from "../../Icon/index-CedboS6y.js";
-import { B as Button } from "../../mui_extended/Button/index-DlzpoczE.js";
+import { F as FieldLabel } from "../../FieldLabel/index-uRWxFkWU.js";
+import { I as Icon } from "../../Icon/index-94Yiv115.js";
+import { P as Popover } from "../../mui_extended/Popover/index-ADNJKYaU.js";
+import { B as Button } from "../../mui_extended/Button/index-CeKWngaw.js";
 const componentName = "M4LRHFColorPicker";
 const colorPickerClasses = generateUtilityClasses(componentName, [
   /* elements */

package/components/hook-form/RHFDateTime/{index-BtfOlX4T.js → index-Cn5PXhkh.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-Cc9p_h7i.js";
-import { H as HelperText } from "../../HelperText/index-COWCXeJp.js";
+import { am as RHFDateTimeRoot } from "../../../styles/index-DITv2ClE.js";
+import { H as HelperText } from "../../HelperText/index-D2yPRkGD.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock-CF-669v-.js";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index-BpW2AGJx.js";
-import { I as Icon } from "../../Icon/index-CedboS6y.js";
+import { F as FieldLabel } from "../../FieldLabel/index-uRWxFkWU.js";
+import { I as Icon } from "../../Icon/index-94Yiv115.js";
 const SkeletonRHFDateTime = (props) => {
   const { skeletonWidth, skeletonHeight, className, label } = props;
   return /* @__PURE__ */ jsxs(Fragment, { children: [

package/components/hook-form/RHFInputNumberSpinner/constants.d.ts

@@ -0,0 +1 @@
+export declare const RHF_INPUTNUMBER_SPINNER_KEY_COMPONENT = "M4LRHFInputNumberSpinner";

package/components/hook-form/RHFInputNumberSpinner/slots/RHFInputNumberSpinnnerEnum.d.ts

@@ -0,0 +1,9 @@
+export declare enum RHFInputNumberSpinnerSlots {
+    root = "root",
+    containerInput = "containerInput",
+    input = "input",
+    span = "span",
+    containerButton = "containerButton",
+    actionButton = "actionButton",
+    actionsInputSkeleton = "actionsInputSkeleton"
+}

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

@@ -0,0 +1,21 @@
+import { Theme } from '@mui/material/styles';
+import { OverridesStyleRules } from '@mui/material/styles/overrides';
+import { RHFInputNumberSpinnerSlots } from './slots/RHFInputNumberSpinnnerEnum';
+import { RHF_INPUTNUMBER_SPINNER_KEY_COMPONENT } from './constants';
+import { TextFieldProps } from '@mui/material';
+export interface RHFInputNumberSpinnerProps extends Omit<TextFieldProps, 'variant' | 'onChange'> {
+    steps: number;
+    maxLength: number;
+    valueType: 'pt' | '%';
+    onChange?: (value: number) => void;
+}
+export interface OwnerState {
+    /**
+     * Variable para el cambio a error
+     */
+    isValid?: boolean;
+}
+export interface RHFInputNumberSpinnerOwnerState extends RHFInputNumberSpinnerProps, OwnerState {
+}
+export declare type RHFInputNumberSpinnerSlotsType = keyof typeof RHFInputNumberSpinnerSlots;
+export declare type RHFInputNumberSpinnerStyles = Partial<OverridesStyleRules<RHFInputNumberSpinnerSlots, typeof RHF_INPUTNUMBER_SPINNER_KEY_COMPONENT, Theme> | undefined> | undefined;