@m4l/components 9.2.49 → 9.2.50-beta.2

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/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/RHFNumberInput/index.d.ts

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

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

@@ -0,0 +1 @@
+

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/hook-form/index.d.ts

@@ -12,6 +12,6 @@ export * from './RHFTextField';
 export * from './RHFTextFieldPassword';
 export * from './RHFPeriod';
 export { RHFRadioGroup } from './RHFRadioGroup';
-export { RHFNumberInput } from './RHFNumberInput/RHFNumberInput';
+export * from './RHFNumberInput';
 export { RHFUploadSingleFile } from './RHFUpload/RHFUploadSingleFile/RHFUploadSingleFile';
 export * from './RHFUpload';

package/components/index.d.ts

@@ -38,7 +38,7 @@ export * from './PaperForm/PaperForm';
 export * from './PDFViewer';
 export * from './popups';
 export * from './PrintingSystem';
-export * from './PropertyValue/PropertyValue';
+export * from './PropertyValue';
 export * from './ScrollBar/ScrollBar';
 export * from './SideBar';
 export * from './ToastContainer';

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/Accordion/styles.js

@@ -27,6 +27,7 @@ const accordionStyles = {
     height: `${theme.vars.size[theme.generalSettings.isMobile ? "mobile" : "desktop"][ownerState.size ?? "medium"].container} !important`,
     minHeight: `${theme.vars.size[theme.generalSettings.isMobile ? "mobile" : "desktop"][ownerState.size ?? "medium"].container} !important`,
     background: theme.vars.palette.background.neutral,
+    overflow: "hidden",
     "&:hover": {
       background: theme.vars.palette.primary.hoverOpacity
     },

package/components/mui_extended/Autocomplete/Autocomplete.js

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useModuleDictionary, useModuleSkeleton, useEnvironment } from "@m4l/core";
-import { forwardRef, useState, useEffect, useCallback, useMemo } from "react";
+import { forwardRef, useState, useCallback, useEffect, useMemo } from "react";
 import { r as renderOption } from "./renderOptions/index.js";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
-import { C as ChipStyled, I as ImageStyled, A as AdormentsStyled, a as CircularProgressStyled, b as IconButtonStyled, S as SkeletonAutocompleteStyled, c as AutocompleteRootStyled, P as PopperComponentStyled, R as RenderInputStyled } from "./slots/AutocompleteSlots.js";
+import { C as ChipStyled, I as ImageStyled, A as AdormentsStyled, a as CircularProgressStyled, b as IconButtonStyled, S as SkeletonAutocompleteStyled, c 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 {
@@ -34,16 +34,6 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
   const [selectedValue, setSelectedValue] = useState(
     value || (multiple ? [] : null)
   );
-  useEffect(() => {
-    if (!multiple && value) {
-      setInputValue(getOptionLabel(value));
-    } else if (multiple && Array.isArray(value)) {
-      setInputValue("");
-    } else {
-      setInputValue("");
-    }
-    setSelectedValue(value || (multiple ? [] : null));
-  }, [value, multiple, getOptionLabel]);
   const isOptionEqualToValueLocal = useCallback(
     (option, val) => {
       if (val === null || val === void 0) {
@@ -53,6 +43,29 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
     },
     [isOptionEqualToValue]
   );
+  useEffect(() => {
+    if (!multiple && value) {
+      setInputValue(getOptionLabel(value));
+    } else if (multiple && Array.isArray(value)) {
+      setInputValue("");
+    } else {
+      setInputValue("");
+    }
+    if (multiple) {
+      if (Array.isArray(value)) {
+        setSelectedValue(value.filter((option) => options.some((opt) => isOptionEqualToValueLocal(opt, option))));
+      } else {
+        setSelectedValue([]);
+      }
+    } else {
+      if (value) {
+        const option = options.find((opt) => isOptionEqualToValueLocal(opt, value));
+        setSelectedValue(option || null);
+      } else {
+        setSelectedValue(null);
+      }
+    }
+  }, [value, multiple, getOptionLabel, options, isOptionEqualToValueLocal]);
   const handleDelete = useCallback((optionToDelete) => {
     if (Array.isArray(selectedValue)) {
       const updatedValue = selectedValue.filter(

package/components/mui_extended/Autocomplete/Autocomplete.styles.js

@@ -58,7 +58,7 @@ const autocompleteSyles = {
       gap: theme.vars.size.baseSpacings.sp1,
       flexWrap: "wrap",
       "& > input": {
-        width: "100px",
+        width: "100%",
         textOverflow: "ellipsis",
         whiteSpace: "nowrap",
         overflow: "hidden!important"

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

@@ -6,12 +6,12 @@ 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 { 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/TabContent/TabContent.styles.js

@@ -6,7 +6,7 @@ const tabContentStyles = {
     padding: theme.vars.size.baseSpacings.sp3,
     display: "flex",
     overflow: "hidden",
-    height: "100%",
+    // height: '100%',
     flexDirection: "column",
     gap: theme.vars.size.baseSpacings.sp2,
     background: theme.vars.palette.background.default,
@@ -14,6 +14,7 @@ const tabContentStyles = {
     borderTopLeftRadius: theme.vars.size.borderRadius.r0,
     position: "relative",
     flex: 1,
+    flexGrow: 1,
     border: theme.vars.size.borderStroke.container,
     borderColor: theme.vars.palette?.border.secondary,
     boxSizing: "border-box",

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,

package/components/mui_extended/Tooltip/Tooltip.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
-import { R as RootStyled, T as TextStyled, a as TooltipStyled } from "./slots/TooltipSlots.js";
-import { T as TOOLTIP_CLASSES, D as DEFAULT_TOOLTIP_OFFSET } from "./constants.js";
+import { R as RootStyled, T as TooltipStyled, a as TextStyled } from "./slots/TooltipSlots.js";
+import { D as DEFAULT_TOOLTIP_OFFSET, T as TOOLTIP_CLASSES } from "./constants.js";
 import clsx from "clsx";
 import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
 const Tooltip = (props) => {

package/components/mui_extended/Tooltip/slots/TooltipSlots.js

@@ -17,6 +17,6 @@ const TooltipStyled = styled("div", {
 })(tooltipStyles?.tooltip);
 export {
   RootStyled as R,
-  TextStyled as T,
-  TooltipStyled as a
+  TooltipStyled as T,
+  TextStyled as a
 };

package/components/mui_extended/Typography/Typography.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import clsx from "clsx";
 import { useModuleSkeleton } from "@m4l/core";
-import { T as TYPOGRAPHY_CLASS_NAME_SPECIFY, a as TYPOGRAPHY_CLASSES, b as TYPOGRAPHY_KEY_COMPONENT } from "./constants.js";
+import { T as TYPOGRAPHY_CLASSES, a as TYPOGRAPHY_KEY_COMPONENT, b as TYPOGRAPHY_CLASS_NAME_SPECIFY } from "./constants.js";
 import { T as TypographySlots } from "./slots/typographyEnum.js";
 import { S as StyledMUITypography, a as StyledSkeleton } from "./slots/typographySlots.js";
 import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";

package/components/mui_extended/Typography/constants.js

@@ -4,7 +4,7 @@ const TYPOGRAPHY_KEY_COMPONENT = "M4LTypography";
 const TYPOGRAPHY_CLASS_NAME_SPECIFY = "M4lclassCssSpecificity";
 const TYPOGRAPHY_CLASSES = getComponentClasses(TYPOGRAPHY_KEY_COMPONENT, TypographySlots);
 export {
-  TYPOGRAPHY_CLASS_NAME_SPECIFY as T,
-  TYPOGRAPHY_CLASSES as a,
-  TYPOGRAPHY_KEY_COMPONENT as b
+  TYPOGRAPHY_CLASSES as T,
+  TYPOGRAPHY_KEY_COMPONENT as a,
+  TYPOGRAPHY_CLASS_NAME_SPECIFY as b
 };

package/components/mui_extended/Typography/slots/typographySlots.js

@@ -1,6 +1,6 @@
 import { Typography } from "@mui/material";
 import { styled } from "@mui/material/styles";
-import { b as TYPOGRAPHY_KEY_COMPONENT } from "../constants.js";
+import { a as TYPOGRAPHY_KEY_COMPONENT } from "../constants.js";
 import { T as TypographySlots } from "./typographyEnum.js";
 import { t as typographyStyles } from "../typography.styles.js";
 import { S as Skeleton } from "../../Skeleton/Skeleton.js";

package/components/popups/components/PopupsViewer/icons.js

@@ -1,5 +1,4 @@
 const POPUPS_ICONS = {
-  CLOSE: "close.svg",
   EDITION_INFO: "edition_info.svg"
 };
 export {

package/hooks/useDataGridPersistence/constants.js

@@ -1,6 +1,6 @@
 const COOKIE_COLUMNS_WIDTHS = "columns_widths";
 const COOKIE_COLUMNS_CONFIG = "columns_config";
 export {
-  COOKIE_COLUMNS_WIDTHS as C,
-  COOKIE_COLUMNS_CONFIG as a
+  COOKIE_COLUMNS_CONFIG as C,
+  COOKIE_COLUMNS_WIDTHS as a
 };

package/hooks/useDataGridPersistence/useDataGridPersistence.js

@@ -1,6 +1,6 @@
 import { useState, useCallback } from "react";
 import { g as getColumnsConfigCookie } from "./helpers.js";
-import { C as COOKIE_COLUMNS_WIDTHS, a as COOKIE_COLUMNS_CONFIG } from "./constants.js";
+import { C as COOKIE_COLUMNS_CONFIG, a as COOKIE_COLUMNS_WIDTHS } from "./constants.js";
 import { u as useWindowToolsMF } from "../../components/WindowBase/hooks/useWindowToolsMF/index.js";
 const useDataGridPersistence = (props) => {
   const { prefixCookie } = props;

package/hooks/useDynamicFilterAndSort/styles.js

@@ -21,6 +21,8 @@ const dynamicFilterAndSortStyles = {
     flexDirection: theme.generalSettings.isMobile ? "column" : "row",
     gap: theme.vars.size.baseSpacings.sp3,
     padding: `0 ${theme.vars.size.baseSpacings.sp1}`,
+    height: "auto",
+    alignItems: "center",
     [`& [class*="${DYNAMIC_FILTER_KEY_COMPONENT}-root"]`]: {
       display: ownerState.showDynamicFilter ? "block" : "none",
       width: "auto",

package/hooks/useDynamicFilterAndSort/types.d.ts

@@ -28,6 +28,7 @@ export interface UseDynamicFilterAndSortProps extends Pick<DynamicFilterProps, '
     dataTestId?: string;
     sorts?: DynamicSortProps['fields'];
     filterSortAutomatic?: boolean;
+    withExternalRefresh?: boolean;
 }
 export interface DynamicFilterAndSortOwnerState {
     showDynamicFilter: boolean;