@m4l/components 9.2.54-beta.1 → 9.2.54

package/components/areas/contexts/AreasContext/helpers/helper.js

@@ -192,23 +192,23 @@ function getSelectedAreaIdFromCookies(cookiesResponse) {
 }
 export {
   COOKIE_WINDOW_SELECTED as C,
-  DEFAULT_AREA as D,
+  DEBOUCED_SAVE_TIME as D,
   MARGIN_GRIDLAYOUT as M,
   NORMALIZED_COLS as N,
   PADDING_GRIDLAYOUT as P,
-  RESPONSIVE_COLAPSED_HEIGHTS as R,
-  RESPONSIVE_ROW_HEIGHTS as a,
-  COOKIE_AREAS_ADMIN_CONTAINER_ID as b,
-  COOKIE_AREAS_ADMIN_ID as c,
-  addArea as d,
+  RESPONSIVE_ROW_HEIGHTS as R,
+  RESPONSIVE_COLAPSED_HEIGHTS as a,
+  getDataFromResponse as b,
+  getParmsFromValue as c,
+  COOKIE_BREAKPOINT_LAYOUTS as d,
   DEFAULT_WINDOW as e,
-  deleteLayoutFromBreakPoints as f,
-  getSelectedAreaIdFromCookies as g,
-  COOKIE_WINDOWS as h,
-  COOKIE_BREAKPOINT_LAYOUTS as i,
-  DEBOUCED_SAVE_TIME as j,
-  getDataFromResponse as k,
-  getParmsFromValue as l,
-  getCookiesContainer as m,
+  COOKIE_WINDOWS as f,
+  getCookiesContainer as g,
+  deleteLayoutFromBreakPoints as h,
+  addArea as i,
+  DEFAULT_AREA as j,
+  getSelectedAreaIdFromCookies as k,
+  COOKIE_AREAS_ADMIN_CONTAINER_ID as l,
+  COOKIE_AREAS_ADMIN_ID as m,
   setColapsedLayoutBreakPoints as s
 };

package/components/areas/contexts/AreasContext/store.js

@@ -1,16 +1,16 @@
 import { createStore } from "zustand";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
-import { b as COOKIE_AREAS_ADMIN_CONTAINER_ID, c as COOKIE_AREAS_ADMIN_ID, D as DEFAULT_AREA, d as addArea, g as getSelectedAreaIdFromCookies, e as DEFAULT_WINDOW, a as RESPONSIVE_ROW_HEIGHTS, P as PADDING_GRIDLAYOUT, M as MARGIN_GRIDLAYOUT, N as NORMALIZED_COLS, f as deleteLayoutFromBreakPoints, h as COOKIE_WINDOWS, i as COOKIE_BREAKPOINT_LAYOUTS, j as DEBOUCED_SAVE_TIME, s as setColapsedLayoutBreakPoints, k as getDataFromResponse, l as getParmsFromValue, m as getCookiesContainer, C as COOKIE_WINDOW_SELECTED } from "./helpers/helper.js";
+import { g as getCookiesContainer, b as getDataFromResponse, c as getParmsFromValue, s as setColapsedLayoutBreakPoints, d as COOKIE_BREAKPOINT_LAYOUTS, D as DEBOUCED_SAVE_TIME, e as DEFAULT_WINDOW, M as MARGIN_GRIDLAYOUT, f as COOKIE_WINDOWS, h as deleteLayoutFromBreakPoints, R as RESPONSIVE_ROW_HEIGHTS, P as PADDING_GRIDLAYOUT, N as NORMALIZED_COLS, i as addArea, j as DEFAULT_AREA, k as getSelectedAreaIdFromCookies, C as COOKIE_WINDOW_SELECTED, l as COOKIE_AREAS_ADMIN_CONTAINER_ID, m as COOKIE_AREAS_ADMIN_ID } from "./helpers/helper.js";
 import { c as createDynamicMFStore } from "../../../WindowBase/contexts/DynamicMFParmsContext/store.js";
 import cloneDeep from "lodash-es/cloneDeep";
 import debounce from "lodash-es/debounce";
 import { g as generateModuleCount } from "./helpers/generateModuleCount.js";
 import { a as AREAS_STORE_ID } from "../../constants.js";
 import { h as helperSelectLayout } from "./helpers/selectLayout.js";
-import { g as getCookie, d as deleteCookie, s as setCookie } from "../../../../helpers/cookies/cookies.js";
-import { d as addLayoutItemToBreakPoints, e as cloneLayouts } from "../../../GridLayout/subcomponents/Responsive/responsiveUtils.js";
+import { d as deleteCookie, s as setCookie, g as getCookie } from "../../../../helpers/cookies/cookies.js";
 import { k as isEqualLayouts } from "../../../GridLayout/utils.js";
+import { d as cloneLayouts, e as addLayoutItemToBreakPoints } from "../../../GridLayout/subcomponents/Responsive/responsiveUtils.js";
 const createDevtools = (immerMiddlewere, config) => {
   const { enabled = false } = config;
   if (enabled && process.env.NODE_ENV === "development") {
@@ -441,8 +441,8 @@ const createAreasStore = (initProps, storeDevtoolsEnabled = false) => {
                   bounds: {
                     left: MARGIN_GRIDLAYOUT,
                     top: MARGIN_GRIDLAYOUT,
-                    right: -MARGIN_GRIDLAYOUT,
-                    bottom: -MARGIN_GRIDLAYOUT
+                    right: -11,
+                    bottom: -11
                   }
                 });
               }
@@ -667,11 +667,12 @@ const createAreasStore = (initProps, storeDevtoolsEnabled = false) => {
           /**
            * setActions
            */
-          setActions: (windowId, newActions, version) => {
+          setActions: (windowId, newActions, version, buildTime) => {
             set((state) => {
               if (state.hashWindows[windowId]) {
                 state.hashWindows[windowId].moduleActions = cloneDeep(newActions);
                 state.hashWindows[windowId].version = version;
+                state.hashWindows[windowId].buildTime = buildTime;
               }
             });
           },

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

@@ -281,7 +281,7 @@ export interface AreasStoreStateWithActions extends AreasStoreState {
         loadWindowsFromApi: (areaId: string) => void;
     };
     windowActions: {
-        setActions: (windowId: string, newActions: ModuleAction[], version?: string) => void;
+        setActions: (windowId: string, newActions: ModuleAction[], version?: string, buildTime?: string) => void;
         getCookie: (windowId: string, id: string) => Record<string, any> | undefined;
         getCookies: (windowId: string, type: CookieType) => Record<string, any>;
         setCookie: (windowId: string, id: string, type: CookieType, cookie: Record<string, any>) => void;

package/components/areas/icons.js

@@ -1,5 +1,4 @@
 const ICONS = {
-  CLOSE: "close.svg",
   MAXIMIZE: "maximize.svg",
   NORMALIZE: "normalize.svg",
   COLAPSE: "colapse.svg",
@@ -8,16 +7,9 @@ const ICONS = {
   SAVE_COOKIES: "save_cookies.svg",
   DELETE_AREA: "delete_area.svg",
   ADD_AREA: "add_area.svg",
-  LAYERS: "layers.svg",
-  NAVIGATE_ERROR: "navegate_error.svg",
   EDIT_AREA: "edit.svg",
   CHECK: "checkmarkInCircle.svg",
-  RESIZE: "controlSize.svg",
-  VERSION: "version.svg",
-  SHOW_OPTIONS: "showMoreVertical.svg",
   CHEVRON_DOWN: "chevronDown.svg",
-  MODULE: "module.svg",
-  POPUP: "popup.svg",
   PENDING_ORDER: "pending_order.svg",
   MORE_VERTICAL: "more_vertical.svg"
 };

package/components/areas/types.d.ts

@@ -43,6 +43,10 @@ export type WindowState = {
      * version del Microfrontend, esta version es actualizada normalmente por el ModuleLayout del microfrontend
      */
     version?: string;
+    /**
+     * buildTime del Microfrontend, esta buildTime es actualizada normalmente por el ModuleLayout del microfrontend
+     */
+    buildTime?: string;
     /**
      * Acciones del módulo.
      */

package/components/commercial/HamburgerMenu/classes/index.js

@@ -1,4 +1,4 @@
-import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { generateUtilityClass, generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { c as componentName } from "./constants.js";
 generateUtilityClasses(componentName, ["root", "ImageLogo"]);

package/components/formatters/BooleanFormatter/BooleanFormatter.js

@@ -6,7 +6,7 @@ import clsx from "clsx";
 import { a as getComponentSlotRoot } from "../../../utils/getComponentSlotRoot.js";
 import { B as BOOLEAN_FORMATTER_KEY_COMPONENT } from "./constants.js";
 import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";
-import { B as BooleanFormatterIconStyled, a as BooleanFormatterChipStyled, b as BooleanFormatterRootStyled } from "./slots/BooleanFormatterSlots.js";
+import { B as BooleanFormatterRootStyled, a as BooleanFormatterIconStyled, b as BooleanFormatterChipStyled } from "./slots/BooleanFormatterSlots.js";
 import { B as BooleanFormatterSlots } from "./slots/BooleanFormatterEnum.js";
 function getFormatBoolean(presentationType, value = false, getLabel) {
   if (presentationType === "string_yes_no") {

package/components/formatters/BooleanFormatter/slots/BooleanFormatterSlots.js

@@ -18,7 +18,7 @@ const BooleanFormatterChipStyled = styled(Chip, {
   slot: BooleanFormatterSlots.chip
 })(booleanFormatterStyles?.chip);
 export {
-  BooleanFormatterIconStyled as B,
-  BooleanFormatterChipStyled as a,
-  BooleanFormatterRootStyled as b
+  BooleanFormatterRootStyled as B,
+  BooleanFormatterIconStyled as a,
+  BooleanFormatterChipStyled as b
 };

package/components/formatters/PeriodFormatter/PeriodFormatter.js

@@ -6,8 +6,8 @@ import clsx from "clsx";
 import { a as getComponentSlotRoot } from "../../../utils/getComponentSlotRoot.js";
 import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";
 import { d as dictionary } from "./dictionary.js";
+import { P as PeriodFormatterRootStyled, a as PeriodFormatterSkeletonStyled } from "./slots/PeriodFormatterSlots.js";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
-import { P as PeriodFormatterSkeletonStyled, a as PeriodFormatterRootStyled } from "./slots/PeriodFormatterSlots.js";
 import { P as PeriodFormatterSlots } from "./slots/PeriodFomatterEnum.js";
 function useFormatPeriod(years, months, days) {
   const { getLabel } = useModuleDictionary();

package/components/formatters/PeriodFormatter/slots/PeriodFormatterSlots.js

@@ -13,6 +13,6 @@ const PeriodFormatterSkeletonStyled = styled(Skeleton, {
   slot: PeriodFormatterSlots.skeleton
 })(periodFormatterStyles?.skeleton);
 export {
-  PeriodFormatterSkeletonStyled as P,
-  PeriodFormatterRootStyled as a
+  PeriodFormatterRootStyled as P,
+  PeriodFormatterSkeletonStyled as a
 };

package/components/hook-form/RHFAutocompleteAsync/reducer/RHFAutocompleteReducer.js

@@ -64,6 +64,11 @@ const RHFAutocompleteAsyncReducer = (onChangeFilterParms) => (state, action) =>
         ...state,
         isOpen: false
       };
+    // case actionsType.SET_SELECTED_OPTIONS_TO_AUTOCOMPLETE:
+    //   return {
+    //     ...state,
+    //     selectedOptions: action.payload,
+    //   };
     default:
       return state;
   }

package/components/hook-form/RHFAutocompleteAsync/tests/common.d.ts

@@ -2,6 +2,7 @@ import { RHFAutocompleteAsyncProps } from '../types';
 import { renderMaterialUI } from '../../../../test';
 import { FieldValues } from 'react-hook-form';
 export declare const FIELD_NAME = "rhf-autocomplete-async";
+export declare const FIELD_NAME_AFTER_TIME_SELECTED = "rhf-autocomplete-async-after-time-selected";
 export declare const FIELD_NAME_PRESELECTED = "rhf-autocomplete-async-preselected";
 export declare const FIELD_NAME_PRESELECTED_NOT_IN_OPTIONS = "rhf-autocomplete-async-preselected-not-in-options";
 export declare const FIELD_NAME_PRESELECTED_MULTIPLE = "rhf-autocomplete-async-preselected-multiple";
@@ -11,6 +12,7 @@ export interface OptionsTests {
     name: string;
 }
 export declare const mockItems: OptionsTests[];
+export declare const mockItemAfterTimeSelected: OptionsTests;
 export declare const mockItemPreselected: OptionsTests;
 export declare const mockItemPreselectedMultiple: OptionsTests[];
 export declare const mockItemPreselectedNotInOptions: OptionsTests;
@@ -34,8 +36,8 @@ export declare const onChangeFilterParms: (newValue: string) => {
 /**
  * Renderiza el componente con el contexto de EnvironmentProvider y RHFormProvider.
  */
-export declare const renderWithContexts: (ui: React.ReactElement, initialValuesFormContext?: FieldValues, validationSchema?: any) => ReturnType<typeof renderMaterialUI>;
+export declare const renderWithContexts: (ui: React.ReactElement, initialValuesFormContext?: FieldValues, validationSchema?: any, withFormChangeAuto?: boolean) => ReturnType<typeof renderMaterialUI>;
 /**
  * Renders the RHFAutocompleteAsync component with the provided props.
  */
-export declare const renderRHFAutocompleteAsync: (fieldName: string, overrideProps?: Partial<RHFAutocompleteAsyncProps<OptionsTests>>) => ReturnType<typeof renderMaterialUI>;
+export declare const renderRHFAutocompleteAsync: (fieldName: string, overrideProps?: Partial<RHFAutocompleteAsyncProps<OptionsTests>>, initialValuesFormContext?: FieldValues, validationSchema?: any, withFormChangeAuto?: boolean) => ReturnType<typeof renderMaterialUI>;

package/components/hook-form/RHFAutocompleteAsync/types.js

@@ -21,12 +21,6 @@ const actionsType = {
    * Indicate if the popover options are close.
    */
   CLOSE: "CLOSE",
-  /**
-   * Reset the state options, allowFetchingOptionsAutocomplete (false)
-   * and loading (true) to initial state before fetching options
-   * to wait the response from the server.
-   */
-  START_FETCHING_OPTIONS: "START_FETCHING_OPTIONS",
   /**
    * Set new options to list in autocomplete.
    * For example, when the user is typing,

package/components/hook-form/RHFCheckbox/slots/RHFCheckBoxSlots.js

@@ -2,8 +2,8 @@ import { styled } from "@mui/material/styles";
 import { r as rhfCheckBoxStyles } from "../RHFCheckBox.styles.js";
 import { R as RHFCheckBoxSlots } from "./RHFCheckBoxEnum.js";
 import { R as RHF_CHECKBOX_KEY_COMPONENT } from "../constants.js";
-import { C as CheckBox } from "../../../mui_extended/CheckBox/CheckBox.js";
 import { L as Label } from "../../../Label/Label.js";
+import { C as CheckBox } from "../../../mui_extended/CheckBox/CheckBox.js";
 const RHFCheckboxRoot = styled("div", {
   name: RHF_CHECKBOX_KEY_COMPONENT,
   slot: RHFCheckBoxSlots.root

package/components/hook-form/RHFPeriod/RHFPeriod.js

@@ -9,8 +9,8 @@ import { R as RHF_PERIOD_KEY_COMPONENT } from "./constants.js";
 import clsx from "clsx";
 import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";
 import { a as getComponentSlotRoot } from "../../../utils/getComponentSlotRoot.js";
-import { R as RHFPeriodSlots } from "./slots/RHFPeriodEnum.js";
 import { H as HelperError } from "../../HelperError/HelperError.js";
+import { R as RHFPeriodSlots } from "./slots/RHFPeriodEnum.js";
 const RHFPeriod = (props) => {
   const {
     name,

package/components/hook-form/RHFTextField/RHFTextField.styles.js

@@ -18,9 +18,7 @@ const rhfTextFieldStyles = {
   /**
    * Estilos personalizados para el componente Skeleton.
    */
-  helperErrorStyled: {},
-  skeletonTextFieldRoot: {},
-  wrapperSkeletonRHFTextField: {}
+  helperErrorStyled: {}
 };
 export {
   rhfTextFieldStyles as r

package/components/hook-form/RHFTextFieldPassword/slots/RHFTextFieldPasswordSlots.js

@@ -2,9 +2,9 @@ import { styled } from "@mui/material";
 import { R as RHFTextFieldPasswordSlots } from "./RHFTextFieldPasswordEnum.js";
 import { R as RHF_TEXT_FIELD_PASSWORD_KEY_COMPONENT } from "../constanst.js";
 import { r as rhfTextFieldPasswordStyles } from "../RHFTextFieldPassword.styles.js";
+import { L as Label } from "../../../Label/Label.js";
 import { T as TextField } from "../../../mui_extended/TextField/TextField.js";
 import { I as IconButton } from "../../../mui_extended/IconButton/IconButton.js";
-import { L as Label } from "../../../Label/Label.js";
 const RHFTextFieldPasswordRoot = styled("div", {
   name: RHF_TEXT_FIELD_PASSWORD_KEY_COMPONENT,
   slot: RHFTextFieldPasswordSlots.root

package/components/hook-form/RHFUpload/RHFUploadSingleFile/RHFUploadSingleFile.js

@@ -3,7 +3,7 @@ import { useFormContext, Controller } from "react-hook-form";
 import { U as UploadSingleFile } from "./subcomponents/UploadSingleFile/index.js";
 import { R as RHFUploadSingleFileRootStyled, L as LabelStyled, H as HelperErrorStyled } from "./slots/RHFUploadSingleFileSlots.js";
 import clsx from "clsx";
-import { R as RHF_UPLOAD_SINGLE_FILE_KEY_COMPONENT, D as DEFAULT_MAX_FILE_SIZE } from "./constants.js";
+import { D as DEFAULT_MAX_FILE_SIZE, R as RHF_UPLOAD_SINGLE_FILE_KEY_COMPONENT } from "./constants.js";
 import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { R as RHFUploadSingleFileSlots } from "./slots/RHFUploadSingleFileEnum.js";
 import { u as useComponentSize } from "../../../../hooks/useComponentSize/useComponentSize.js";

package/components/hook-form/RHFormContext/classes/index.js

@@ -1,4 +1,4 @@
-import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { generateUtilityClass, generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { c as componentName } from "./constants.js";
 generateUtilityClasses(

package/components/hook-form/RHFormContext/index.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import clsx from "clsx";
-import { useForm, FormProvider } from "react-hook-form";
+import { FormProvider, useForm } from "react-hook-form";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { F as FormProviderRoot } from "./styles.js";
 import { R as RHFormProviderUtilityClasses } from "./classes/index.js";

package/components/mui_extended/Accordion/Accordion.js

@@ -3,7 +3,7 @@ import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.js";
 import { a as getNameDataTestId } from "../../../test/getNameDataTestId.js";
 import { P as PATH_EXPANDED_ICON, A as ACCORDION_KEY } from "./constants.js";
 import { a as getComponentSlotRoot } from "../../../utils/getComponentSlotRoot.js";
-import { A as AccordionRootStyled, a as AccordionSummaryStyled, I as IconExpandedStyled, b as IconLabelStyled, L as LabelStyled, c as AccordionDetailsStyled } from "./slots/AccordionSlots.js";
+import { A as AccordionRootStyled, a as AccordionSummaryStyled, I as IconLabelStyled, L as LabelStyled, b as IconExpandedStyled, c as AccordionDetailsStyled } from "./slots/AccordionSlots.js";
 import { forwardRef } from "react";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
 const Accordion = forwardRef((props, ref) => {

package/components/mui_extended/Accordion/slots/AccordionSlots.js

@@ -31,9 +31,9 @@ const AccordionDetailsStyled = styled(AccordionDetails, {
 })(accordionStyles?.accordionDetails);
 export {
   AccordionRootStyled as A,
-  IconExpandedStyled as I,
+  IconLabelStyled as I,
   LabelStyled as L,
   AccordionSummaryStyled as a,
-  IconLabelStyled as b,
+  IconExpandedStyled as b,
   AccordionDetailsStyled as c
 };

package/components/mui_extended/Autocomplete/Autocomplete.js

@@ -6,7 +6,7 @@ import { u as useValuesAndHandlers } from "./hooks/useValuesAndHandlers.js";
 import { u as useStartAdornments } from "./hooks/useStartAdornments.js";
 import { u as useEndAdornments } from "./hooks/useEndAdornments.js";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
-import { S as SkeletonAutocompleteStyled, A as AutocompleteRootStyled, P as PopperComponentStyled, R as RenderInputStyled } from "./slots/AutocompleteSlots.js";
+import { S as SkeletonAutocompleteStyled, A as AutocompleteRootStyled, R as RenderInputStyled, P as PopperComponentStyled } from "./slots/AutocompleteSlots.js";
 import { T as Typography } from "../Typography/Typography.js";
 const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
   const {
@@ -30,7 +30,6 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
   const {
     open,
     selectedValue,
-    selectedOption,
     inputValue,
     isOptionEqualToValueLocal,
     handleDelete,
@@ -40,7 +39,6 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
     onCloseLocal,
     onOpenLocal,
     getOptionLabelLocal,
-    getOptionUrlImageLocal,
     checkKeyDown,
     scrollPositionOptionsRef
   } = useValuesAndHandlers(props);
@@ -54,18 +52,11 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
   const startAdornments = useStartAdornments({
     selectedValue,
     multiple,
-    loading,
     adjustedSize,
     getOptionLabelLocal,
     ownerState,
     handleDelete,
-    getOptionUrlImage,
-    selectedOption,
-    getOptionUrlImageLocal,
-    refresh,
-    handleRefresh,
-    disabled,
-    onOpenLocal
+    disabled
   });
   const endAdornments = useEndAdornments({
     loading,

package/components/mui_extended/Autocomplete/hooks/useValuesAndHandlers.js

@@ -1,4 +1,5 @@
-import { useState, useRef, useCallback, useEffect } from "react";
+import { useState, useRef, useEffect, useCallback } from "react";
+import { deepEqual } from "fast-equals";
 function useValuesAndHandlers(props) {
   const {
     getOptionLabel,
@@ -19,6 +20,15 @@ function useValuesAndHandlers(props) {
   const [selectedValue, setSelectedValue] = useState(
     value || (multiple ? [] : null)
   );
+  const refValue = useRef(selectedValue);
+  useEffect(() => {
+    if (deepEqual(refValue.current, value)) {
+      return;
+    }
+    const newValue = value || (multiple ? [] : null);
+    refValue.current = newValue;
+    setSelectedValue(newValue);
+  }, [multiple, value]);
   const isOptionEqualToValueLocal = useCallback(
     (option, val) => {
       if (val === null || val === void 0) {

package/components/mui_extended/Autocomplete/slots/AutocompleteSlots.js

@@ -5,13 +5,13 @@ import { I as Image } from "../../../Image/Image.js";
 import { a as autocompleteSyles } from "../Autocomplete.styles.js";
 import { A as AUTOCOMPLETE_KEY_COMPONENT } from "../constants.js";
 import { A as AutocompleteSlots } from "./AutocompleteEnum.js";
-import { I as IconButton } from "../../IconButton/IconButton.js";
-import { T as TextField } from "../../TextField/TextField.js";
-import { T as Typography } from "../../Typography/Typography.js";
 import { S as Skeleton } from "../../Skeleton/Skeleton.js";
+import { T as TextField } from "../../TextField/TextField.js";
 import { P as Popper } from "../../Popper/Popper.js";
-import { M as MenuItem } from "../../MenuItem/MenuItem.js";
+import { I as IconButton } from "../../IconButton/IconButton.js";
+import { T as Typography } from "../../Typography/Typography.js";
 import { C as CircularProgress } from "../../CircularProgress/CircularProgress.js";
+import { M as MenuItem } from "../../MenuItem/MenuItem.js";
 const AutocompleteRootStyled = styled(Autocomplete, {
   name: AUTOCOMPLETE_KEY_COMPONENT,
   slot: AutocompleteSlots.root

package/components/mui_extended/CheckBox/CheckBox.js

@@ -5,7 +5,7 @@ import { g as getComponentClasses } from "../../../utils/getComponentSlotRoot.js
 import { C as CHECK_BOX_KEY_COMPONENT } from "./constants.js";
 import clsx from "clsx";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
-import { C as CheckBoxRootStyled, M as MUICheckboxStyled, I as IconCheckedStyled, a as IconStyled, T as TypographyStyled, S as SkeletonStyled } from "./slots/CheckBoxSlots.js";
+import { C as CheckBoxRootStyled, M as MUICheckboxStyled, I as IconStyled, a as IconCheckedStyled, T as TypographyStyled, S as SkeletonStyled } from "./slots/CheckBoxSlots.js";
 import { C as CheckBoxSlots } from "./slots/CheckBoxEnum.js";
 const CheckBox = forwardRef((props, ref) => {
   const {

package/components/mui_extended/CheckBox/slots/CheckBoxSlots.js

@@ -31,9 +31,9 @@ const IconStyled = styled(Icon, {
 })(checkBoxStyles.icon);
 export {
   CheckBoxRootStyled as C,
-  IconCheckedStyled as I,
+  IconStyled as I,
   MUICheckboxStyled as M,
   SkeletonStyled as S,
   TypographyStyled as T,
-  IconStyled as a
+  IconCheckedStyled as a
 };

package/components/mui_extended/DateTimePicker/slots/DateTimePickerSlots.js

@@ -1,5 +1,5 @@
 import { styled, Popper, Paper } from "@mui/material";
-import { DesktopDateTimePicker, MobileDateTimePicker, PickersCalendarHeader, PickersDay } from "@mui/x-date-pickers";
+import { PickersCalendarHeader, PickersDay, MobileDateTimePicker, DesktopDateTimePicker } from "@mui/x-date-pickers";
 import { d as dateTimePickerStyles } from "../DateTimePicker.styles.js";
 import { D as DATE_TIME_PICKER_KEY_COMPONENT } from "../constants.js";
 import { D as DateTimePickerEnum } from "./DateTimePickerEnum.js";

package/components/mui_extended/IconButton/slots/IconButtonSlots.js

@@ -3,8 +3,8 @@ import { styled } from "@mui/material/styles";
 import { i as iconButtonStyles } from "../IconButton.styles.js";
 import { a as ICON_BUTTON_KEY_COMPONENT } from "../constants.js";
 import { I as IconButtonSlots } from "./IconButtonEnum.js";
-import { S as Skeleton } from "../../Skeleton/Skeleton.js";
 import { I as Icon } from "../../../Icon/Icon.js";
+import { S as Skeleton } from "../../Skeleton/Skeleton.js";
 const StyledMUIIconButton = styled(IconButton, {
   name: ICON_BUTTON_KEY_COMPONENT,
   slot: IconButtonSlots.styledMUIIconButton

package/components/mui_extended/ImageButton/utils/Clases/index.js

@@ -1,4 +1,4 @@
-import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { generateUtilityClass, generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { c as componentName } from "./constants.js";
 generateUtilityClasses(componentName, [

package/components/mui_extended/MenuItem/slots/MenuItemSlots.js

@@ -3,8 +3,8 @@ import { MenuItem } from "@mui/material";
 import { a as MENUITEM_KEY_COMPONENT } from "../constants.js";
 import { m as menuItemStyles } from "../MenuItem.styles.js";
 import { M as MenuItemSlots } from "./MenuItemEnum.js";
-import { T as Typography } from "../../Typography/Typography.js";
 import { S as Skeleton } from "../../Skeleton/Skeleton.js";
+import { T as Typography } from "../../Typography/Typography.js";
 import { I as Icon } from "../../../Icon/Icon.js";
 const MenuItemRootStyled = styled(MenuItem, {
   name: MENUITEM_KEY_COMPONENT,

package/components/mui_extended/NavLink/NavLink.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { R as RouterNavLinkRootStyled, a as RouterNavLinkStyled, T as TypographyStyled, S as SkeletonStyled } from "./slots/NavLinkSlots.js";
 import { useModuleSkeleton } from "@m4l/core";
-import { N as NAV_LINK_KEY_COMPONENT, c as classNavLinkRoot, a as NAV_LINK_SPECIFY } from "./constants.js";
+import { c as classNavLinkRoot, N as NAV_LINK_SPECIFY, a as NAV_LINK_KEY_COMPONENT } from "./constants.js";
 import { N as NavLinkSlots } from "./slots/NavLinkEnum.js";
 import { clsx } from "clsx";
 import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";

package/components/mui_extended/NavLink/constants.js

@@ -4,7 +4,7 @@ const NAV_LINK_KEY_COMPONENT = "M4LNavLink";
 const NAV_LINK_SPECIFY = "M4lclassCssSpecificity";
 const classNavLinkRoot = getComponentClasses(NAV_LINK_KEY_COMPONENT, NavLinkSlots);
 export {
-  NAV_LINK_KEY_COMPONENT as N,
-  NAV_LINK_SPECIFY as a,
+  NAV_LINK_SPECIFY as N,
+  NAV_LINK_KEY_COMPONENT as a,
   classNavLinkRoot as c
 };

package/components/mui_extended/NavLink/slots/NavLinkSlots.js

@@ -1,7 +1,7 @@
 import { NavLink } from "react-router-dom";
 import { styled } from "@mui/material/styles";
 import { N as NavLinkSlots } from "./NavLinkEnum.js";
-import { N as NAV_LINK_KEY_COMPONENT } from "../constants.js";
+import { a as NAV_LINK_KEY_COMPONENT } from "../constants.js";
 import { S as Skeleton } from "../../Skeleton/Skeleton.js";
 import { n as navLinkStyles } from "../NavLink.styles.js";
 import { T as Typography } from "../../Typography/Typography.js";

package/components/mui_extended/Popover/Popover.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";
-import { P as POPOVER_CLASS_NAME_SPECIFY, a as POPOVER_PREFIX } from "./constants.js";
+import { P as POPOVER_PREFIX, a as POPOVER_CLASS_NAME_SPECIFY } from "./constants.js";
 import clsx from "clsx";
 import { P as PopoverRootStyled } from "./slots/PopoverSlots.js";
 import { P as PopoverSlots } from "./slots/PopoverEnum.js";

package/components/mui_extended/Popover/Popover.styles.js

@@ -9,11 +9,7 @@ const popoverStyles = {
         borderRadius: theme.vars.size.borderRadius.r1
       }
     }
-  }),
-  /**
-   * Styles applied to the Popover arrow element.
-   */
-  arrow: () => ({})
+  })
 };
 export {
   popoverStyles as p

package/components/mui_extended/Popover/constants.js

@@ -2,7 +2,7 @@ const POPOVER_KEY_COMPONENT = "M4LPopover";
 const POPOVER_PREFIX = "Popover";
 const POPOVER_CLASS_NAME_SPECIFY = "M4lclassCssSpecificity";
 export {
-  POPOVER_CLASS_NAME_SPECIFY as P,
-  POPOVER_PREFIX as a,
+  POPOVER_PREFIX as P,
+  POPOVER_CLASS_NAME_SPECIFY as a,
   POPOVER_KEY_COMPONENT as b
 };

package/components/mui_extended/Select/Select.js

@@ -4,7 +4,7 @@ import { useTheme } from "@mui/material";
 import clsx from "clsx";
 import { forwardRef, useMemo, useState, useCallback } from "react";
 import { A as ArrowDownStyled, a as AdormentStyled, S as SelectRootStyled, b as SkeletonSelectStyled, M as MenuItemListStyled, c as MenuItemNoOptionStyled, L as LabelPlaceholerStyled, R as RenderValueContainerStyled, d as RenderValueTypography } from "./slots/SelectSlots.js";
-import { S as SELECT_CLASSES, a as SELECT_KEY_COMPONENT, I as ICON_ARROW_DOWN } from "./constants.js";
+import { I as ICON_ARROW_DOWN, S as SELECT_CLASSES, a as SELECT_KEY_COMPONENT } from "./constants.js";
 import { S as SELECT_DICTIONARY } from "./dictionary.js";
 import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";

package/components/mui_extended/Select/Select.styles.js

@@ -1,5 +1,5 @@
 import { S as SELECT_CLASSES } from "./constants.js";
-import { a as getHeightSizeStyles, g as getSizeStyles } from "../../../utils/getSizeStyles/getSizeStyles.js";
+import { g as getSizeStyles, a as getHeightSizeStyles } from "../../../utils/getSizeStyles/getSizeStyles.js";
 const selectStyles = {
   /**
    * Estilos para el componente Select

package/components/mui_extended/Select/constants.js

@@ -1,5 +1,5 @@
 import { g as getComponentClasses } from "../../../utils/getComponentSlotRoot.js";
-import { S as SelectSlots, a as SelectComplementaryClasses } from "./slots/SelectEnum.js";
+import { a as SelectComplementaryClasses, S as SelectSlots } from "./slots/SelectEnum.js";
 const SELECT_KEY_COMPONENT = "M4LSelect";
 const ICON_ARROW_DOWN = "frontend/components/select/arrow_down.svg";
 const COMBINATED_TEXTFIELD_ENUMS = {

package/components/mui_extended/Select/slots/SelectSlots.js

@@ -4,8 +4,8 @@ import { a as SELECT_KEY_COMPONENT } from "../constants.js";
 import { s as selectStyles } from "../Select.styles.js";
 import { S as SelectSlots } from "./SelectEnum.js";
 import { I as IconButton } from "../../IconButton/IconButton.js";
-import { M as MenuItem } from "../../MenuItem/MenuItem.js";
 import { S as Skeleton } from "../../Skeleton/Skeleton.js";
+import { M as MenuItem } from "../../MenuItem/MenuItem.js";
 import { T as Typography } from "../../Typography/Typography.js";
 import { I as Icon } from "../../../Icon/Icon.js";
 const SelectRootStyled = () => styled(Select, {

package/components/mui_extended/Tab/Tab.js

@@ -5,7 +5,7 @@ import { T as TabSlots } from "./Slots/TabEnum.js";
 import { T as TAB_KEY_COMPONENT } from "./constants.js";
 import { g as getComponentClasses } from "../../../utils/getComponentSlotRoot.js";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
-import { R as RootStyled, T as TypographyStyled, I as IconStyled } from "./Slots/TabSlots.js";
+import { R as RootStyled, I as IconStyled, T as TypographyStyled } from "./Slots/TabSlots.js";
 function Tab(props) {
   const {
     size = "medium",

package/components/mui_extended/TextField/constants.js

@@ -1,5 +1,5 @@
 import { g as getComponentClasses } from "../../../utils/getComponentSlotRoot.js";
-import { T as TextFieldSlots, a as TexFieldComplementaryClasses } from "./slots/TextFieldEnum.js";
+import { a as TexFieldComplementaryClasses, T as TextFieldSlots } from "./slots/TextFieldEnum.js";
 const TEXT_FIELD_KEY_COMPONENT = "M4LTextField";
 const COMBINATED_TEXTFIELD_ENUMS = {
   ...TextFieldSlots,