@m4l/components 9.3.19-BE021025-beta.2 → 9.3.19-JT03102025.beta.1

package/components/Stepper/subcomponents/StepperButtons/StepperPrevButton/index.js

@@ -7,7 +7,8 @@ import { useIsMobile } from "@m4l/graphics";
 import { D as DICTIONARY } from "../../../dictionary.js";
 import { I as IconButton } from "../../../../mui_extended/IconButton/IconButton.js";
 import { B as Button } from "../../../../mui_extended/Button/Button.js";
-function StepperPrevButton() {
+function StepperPrevButton(props) {
+  const { label, ...rest } = props;
   const { currentStep } = useStepper((state) => ({
     currentStep: state.currentStep
   }));
@@ -35,12 +36,13 @@ function StepperPrevButton() {
     Button,
     {
       type: "button",
-      label: !isMobile ? getLabel(DICTIONARY.LABEL_PREV_BUTTON) : "",
+      label: label || getLabel(DICTIONARY.LABEL_PREV_BUTTON),
       variant: "outlined",
       color: "default",
       onClick: handlePrev,
       startIcon: `${host_static_assets}/${environment_assets}/${pathIcons.arrowLeft}`,
-      "data-testid": "stepper-prev-button"
+      "data-testid": "stepper-prev-button",
+      ...rest
     }
   );
 }

package/components/Stepper/subcomponents/StepperButtons/StepperSubmitButton/index.d.ts

@@ -1,4 +1,5 @@
+import { StepperButtonProps } from '../../../types';
 /**
  * Botón modular para finalizar el Stepper y ejecutar onFinalSubmit
  */
-export declare function StepperSubmitButton(): import("react/jsx-runtime").JSX.Element;
+export declare function StepperSubmitButton(props: StepperButtonProps): import("react/jsx-runtime").JSX.Element;

package/components/Stepper/subcomponents/StepperButtons/StepperSubmitButton/index.js

@@ -2,16 +2,18 @@ import { jsx } from "react/jsx-runtime";
 import { D as DICTIONARY } from "../../../dictionary.js";
 import { useModuleDictionary } from "@m4l/core";
 import { B as Button } from "../../../../mui_extended/Button/Button.js";
-function StepperSubmitButton() {
+function StepperSubmitButton(props) {
+  const { label, ...rest } = props;
   const { getLabel } = useModuleDictionary();
   return /* @__PURE__ */ jsx(
     Button,
     {
       type: "submit",
-      label: getLabel(DICTIONARY.LABEL_SUBMIT_BUTTON),
+      label: label || getLabel(DICTIONARY.LABEL_SUBMIT_BUTTON),
       variant: "contained",
       color: "primary",
-      "data-testid": "stepper-submit-button"
+      "data-testid": "stepper-submit-button",
+      ...rest
     }
   );
 }

package/components/Stepper/subcomponents/StepperContent/subcomponents/Step/index.js

@@ -12,28 +12,47 @@ function Step(props) {
     steps: state.steps,
     visibilityData: state.visibilityData
   }));
-  const currentStepConfig = useMemo(() => {
-    return steps[currentStep];
-  }, [steps, currentStep]);
   const stepConfig = useMemo(() => {
     return steps.find((step) => step.key === stepKey);
   }, [steps, stepKey]);
   const isStepVisible = useMemo(() => {
-    if (!currentStepConfig) {
-      return false;
-    }
-    if (stepKey !== currentStepConfig.key) {
+    if (!stepConfig) {
       return false;
     }
-    if (stepConfig && !evaluateVisibilityStepCondition(
+    const meetsVisibilityCondition = evaluateVisibilityStepCondition(
       stepConfig,
       formValues || {},
       visibilityData
-    )) {
+    );
+    if (!meetsVisibilityCondition) {
+      return false;
+    }
+    const currentStepConfig = steps[currentStep];
+    if (!currentStepConfig) {
+      return false;
+    }
+    if (evaluateVisibilityStepCondition(currentStepConfig, formValues || {}, visibilityData)) {
+      return stepKey === currentStepConfig.key;
+    }
+    const visibleStepsUpToCurrent = [];
+    for (let i = 0; i <= currentStep; i++) {
+      const step = steps[i];
+      if (evaluateVisibilityStepCondition(step, formValues || {}, visibilityData)) {
+        visibleStepsUpToCurrent.push(step);
+      }
+    }
+    if (visibleStepsUpToCurrent.length === 0) {
+      for (let i = currentStep + 1; i < steps.length; i++) {
+        const step = steps[i];
+        if (evaluateVisibilityStepCondition(step, formValues || {}, visibilityData)) {
+          return stepKey === step.key;
+        }
+      }
       return false;
     }
-    return true;
-  }, [currentStepConfig, stepKey, stepConfig, formValues, visibilityData]);
+    const activeVisibleStep = visibleStepsUpToCurrent[visibleStepsUpToCurrent.length - 1];
+    return stepKey === activeVisibleStep.key;
+  }, [currentStep, stepKey, stepConfig, steps, formValues, visibilityData]);
   return /* @__PURE__ */ jsx(StepContentStyled, { ownerState: { isStepVisible }, children });
 }
 export {

package/components/Stepper/subcomponents/StepperFooter/subcomponents/StepperFooterRightActions/index.js

@@ -1,19 +1,29 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import React, { useMemo } from "react";
+import React, { useState, useEffect, useMemo } from "react";
 import { u as useIsLastVisibleValidStep } from "../../../../hooks/useIsLastVisibleValidStep/index.js";
 import { m as StepperFooterRightActionsStyled } from "../../../../slots/StepperSlot.js";
-import { S as StepperNextButton } from "../../../StepperButtons/StepperNextButton/index.js";
 import { S as StepperSubmitButton } from "../../../StepperButtons/StepperSubmitButton/index.js";
+import { S as StepperNextButton } from "../../../StepperButtons/StepperNextButton/index.js";
 function StepperFooterRightActions(props) {
   const { children } = props;
   const isLastVisibleValidStep = useIsLastVisibleValidStep();
-  const childrenWithoutNextButton = useMemo(() => {
-    if (!isLastVisibleValidStep) {
-      return children;
-    }
+  const [hasCustomSubmitButton, setHasCustomSubmitButton] = useState(false);
+  useEffect(() => {
+    const hasCustomButton = React.Children.toArray(children).some((child) => {
+      if (React.isValidElement(child)) {
+        return child.type === StepperSubmitButton;
+      }
+      return false;
+    });
+    setHasCustomSubmitButton(hasCustomButton);
+  }, [children]);
+  const filteredChildren = useMemo(() => {
     return React.Children.toArray(children).filter((child) => {
       if (React.isValidElement(child)) {
-        if (child.type === StepperNextButton) {
+        if (!isLastVisibleValidStep && child.type === StepperSubmitButton) {
+          return false;
+        }
+        if (isLastVisibleValidStep && child.type === StepperNextButton) {
           return false;
         }
       }
@@ -21,10 +31,10 @@ function StepperFooterRightActions(props) {
     });
   }, [children, isLastVisibleValidStep]);
   const submitButton = useMemo(() => {
-    return isLastVisibleValidStep ? /* @__PURE__ */ jsx(StepperSubmitButton, {}) : null;
-  }, [isLastVisibleValidStep]);
+    return isLastVisibleValidStep && !hasCustomSubmitButton ? /* @__PURE__ */ jsx(StepperSubmitButton, {}) : null;
+  }, [isLastVisibleValidStep, hasCustomSubmitButton]);
   return /* @__PURE__ */ jsxs(StepperFooterRightActionsStyled, { children: [
-    childrenWithoutNextButton,
+    filteredChildren,
     submitButton
   ] });
 }

package/components/Stepper/types.d.ts

@@ -5,6 +5,7 @@ import { ContentAreaSlots, ContentSlots, StepperFooterSlots, StepperSlots } from
 import { STEPPER_PREFIX_NAME } from './constants';
 import { M4LOverridesStyleRules } from '../../@types/augmentations';
 import { Step as StepComponent } from './subcomponents/StepperContent/subcomponents/Step';
+import { ButtonProps } from '../mui_extended/Button';
 export type Orientation = 'horizontal' | 'vertical';
 export type IndicatorType = 'number' | 'dot';
 export type FormData = Record<string, string | number | boolean | null | undefined>;
@@ -145,6 +146,12 @@ export interface StepperFooterProps {
 export interface StepperFooterLeftActionsProps {
     children?: ReactNode;
 }
+/**
+ * Props para los botones del Stepper que extienden las props de Button de mui_extended
+ */
+export interface StepperButtonProps extends Omit<ButtonProps, 'label'> {
+    label?: string;
+}
 /**
  * Props del StepperFooterRightActions
  */

package/components/hook-form/RHFormContext/index.d.ts

@@ -3,7 +3,7 @@ import { CustomFormArguments, FormProviderCustomProps, FormProviderProps } from
 /**
  * TODO: Documentar
  */
-export declare function useCustomForm({ validationSchema, values, statusLoad, mode }: CustomFormArguments): import('react-hook-form').UseFormReturn<FieldValues, any, FieldValues>;
+export declare function useCustomForm({ validationSchema, values, statusLoad, mode, }: CustomFormArguments): import('react-hook-form').UseFormReturn<FieldValues, any, FieldValues>;
 /**
  * TODO: Documentar
  */

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

@@ -6,7 +6,12 @@ import { yupResolver } from "@hookform/resolvers/yup";
 import { F as FormProviderRoot } from "./styles.js";
 import { R as RHFormProviderUtilityClasses } from "./classes/index.js";
 const classes = RHFormProviderUtilityClasses();
-function useCustomForm({ validationSchema, values, statusLoad, mode }) {
+function useCustomForm({
+  validationSchema,
+  values,
+  statusLoad,
+  mode
+}) {
   const formMethods = useForm({
     resolver: yupResolver(validationSchema),
     defaultValues: values,
@@ -39,11 +44,31 @@ function useCustomForm({ validationSchema, values, statusLoad, mode }) {
 }
 function FormProviderCustom(props) {
   const { children, onSubmit, className, handleSubmit } = props;
-  return /* @__PURE__ */ jsx(FormProvider, { ...props, children: /* @__PURE__ */ jsx(FormProviderRoot, { className: clsx(classes.root, className), onSubmit: handleSubmit(onSubmit), children }) });
+  return /* @__PURE__ */ jsx(FormProvider, { ...props, children: /* @__PURE__ */ jsx(
+    FormProviderRoot,
+    {
+      className: clsx(classes.root, className),
+      onSubmit: handleSubmit(onSubmit),
+      children
+    }
+  ) });
 }
 function RHFormProvider(props) {
-  const { children, onSubmit, values, validationSchema, statusLoad = "ready", className, mode } = props;
-  const formMethods = useCustomForm({ validationSchema, statusLoad, values, mode });
+  const {
+    children,
+    onSubmit,
+    values,
+    validationSchema,
+    statusLoad = "ready",
+    className,
+    mode
+  } = props;
+  const formMethods = useCustomForm({
+    validationSchema,
+    statusLoad,
+    values,
+    mode
+  });
   return /* @__PURE__ */ jsx(
     FormProviderCustom,
     {

package/components/mui_extended/Autocomplete/Autocomplete.js

@@ -23,8 +23,7 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
     error = false,
     htmlFor,
     readOnly = false,
-    placeholder,
-    startAdornment
+    placeholder
   } = props;
   const { getLabel } = useModuleDictionary();
   const isSkeleton = useModuleSkeleton();
@@ -51,9 +50,8 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
     disabled,
     multiple: Boolean(multiple),
     error,
-    readOnly,
-    startAdornment: !!startAdornment
-  }), [adjustedSize, disabled, error, multiple, variant, readOnly, startAdornment]);
+    readOnly
+  }), [adjustedSize, disabled, error, multiple, variant, readOnly]);
   const startAdornments = useStartAdornments({
     selectedValue,
     multiple,
@@ -61,8 +59,7 @@ const Autocomplete = forwardRef(function Autocomplete2(props, ref) {
     getOptionLabelLocal,
     ownerState,
     handleDelete,
-    disabled,
-    startAdornment
+    disabled
   });
   const endAdornments = useEndAdornments({
     loading,

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

@@ -70,22 +70,17 @@ const autocompleteSyles = {
   /**
    * Styles for the text field component.
    */
-  textField: ({ theme, ownerState }) => {
-    const sp1 = theme?.vars?.size?.baseSpacings?.sp1 || "4px";
-    const sp5 = theme?.vars?.size?.baseSpacings?.sp5 || "16px";
-    const sp7 = theme?.vars?.size?.baseSpacings?.sp7 || "24px";
+  textField: ({ theme }) => {
     return {
       height: "auto !important",
       position: "relative",
-      "&& .MuiInputBase-root": {
-        ...ownerState?.startAdornment ? {
-          padding: `${sp1} ${sp7} ${sp1} ${sp5}!important`
-        } : {
-          padding: `${sp1} ${sp7} ${sp1} 0px!important`
-        },
-        gap: sp1,
+      "& .MuiInputBase-root": {
+        padding: `${theme.vars.size.baseSpacings.sp1} ${theme.vars.size.baseSpacings.sp12} ${theme.vars.size.baseSpacings.sp1}  0!important`,
+        gap: theme.vars.size.baseSpacings.sp1,
         flexWrap: "wrap",
-        "&& > input": {
+        paddingLeft: `${theme.vars.size.baseSpacings.sp1} !important`,
+        // borderColor: `${ ownerState?.error ? theme.vars.palette.border.error : theme.vars.palette.border.secondary} !important`,
+        "& > input": {
           width: "100%",
           textOverflow: "ellipsis",
           whiteSpace: "nowrap",
@@ -154,25 +149,7 @@ const autocompleteSyles = {
     display: "flex",
     flexWrap: "wrap",
     gap: theme.vars.size.baseSpacings.sp1
-  }),
-  /**
-   * Styles for the wrapper start adornment component.
-   */
-  wrapperStartAdornment: ({ theme }) => {
-    const sp1 = theme?.vars?.size?.baseSpacings?.sp1 || "4px";
-    return {
-      width: "fit-content",
-      position: "absolute",
-      top: 0,
-      bottom: 0,
-      left: 0,
-      display: "flex",
-      flexDirection: "column",
-      justifyContent: "center",
-      alignItems: "center",
-      padding: `0px ${sp1}`
-    };
-  }
+  })
 };
 export {
   autocompleteSyles as a

package/components/mui_extended/Autocomplete/hooks/useStartAdornments.d.ts

@@ -1,5 +1,4 @@
-import { default as React } from 'react';
-import { AutocompleteOwnerState, AutocompleteProps } from '../types';
+import { AutocompleteOwnerState } from '../types';
 export type UseAdornmentsProps<T> = {
     selectedValue: T | T[] | null;
     multiple?: boolean;
@@ -15,7 +14,6 @@ export type UseAdornmentsProps<T> = {
     handleRefresh: () => void;
     disabled?: boolean;
     onOpenLocal: (event: React.MouseEvent<HTMLButtonElement>) => void;
-    startAdornment: AutocompleteProps<unknown, true>['startAdornment'];
 };
 /**
  * Hook para el componente Autocomplete local

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

@@ -1,6 +1,5 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import React, { useMemo } from "react";
-import { b as ContainerMultipleValuesStyled, c as ContainerWrapperStyled, d as ChipStyled, W as WrapperStartAdornmentStyled } from "../slots/AutocompleteSlots.js";
+import { jsx } from "react/jsx-runtime";
+import { b as ContainerMultipleValuesStyled, c as ContainerWrapperStyled, d as ChipStyled } from "../slots/AutocompleteSlots.js";
 function useStartAdornments(props) {
   const {
     selectedValue,
@@ -9,44 +8,23 @@ function useStartAdornments(props) {
     getOptionLabelLocal,
     ownerState,
     handleDelete,
-    disabled,
-    startAdornment
+    disabled
   } = props;
-  const startAdornmentClone = startAdornment ? React.cloneElement(startAdornment, {
-    size: adjustedSize
-  }) : null;
-  const internalAdornments = useMemo(() => {
-    if (!(Array.isArray(selectedValue) && multiple)) {
-      return null;
-    }
-    return /* @__PURE__ */ jsx(ContainerMultipleValuesStyled, { children: /* @__PURE__ */ jsx(ContainerWrapperStyled, { children: selectedValue.map((option, index) => /* @__PURE__ */ jsx(
-      ChipStyled,
-      {
-        size: adjustedSize,
-        label: getOptionLabelLocal(option),
-        opacity: true,
-        onDeleted: () => handleDelete(option),
-        disabledDeleteButton: disabled,
-        ownerState: { ...ownerState }
-      },
-      `${option}-${index}`
-    )) }) });
-  }, [
-    selectedValue,
-    multiple,
-    adjustedSize,
-    getOptionLabelLocal,
-    handleDelete,
-    disabled,
-    ownerState
-  ]);
-  if (startAdornmentClone && internalAdornments) {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(WrapperStartAdornmentStyled, { children: startAdornmentClone }),
-      internalAdornments
-    ] });
+  if (!(Array.isArray(selectedValue) && multiple)) {
+    return null;
   }
-  return startAdornment ? /* @__PURE__ */ jsx(WrapperStartAdornmentStyled, { children: startAdornmentClone }) : internalAdornments;
+  return /* @__PURE__ */ jsx(ContainerMultipleValuesStyled, { children: /* @__PURE__ */ jsx(ContainerWrapperStyled, { children: selectedValue.map((option, index) => /* @__PURE__ */ jsx(
+    ChipStyled,
+    {
+      size: adjustedSize,
+      label: getOptionLabelLocal(option),
+      opacity: true,
+      onDeleted: () => handleDelete(option),
+      disabledDeleteButton: disabled,
+      ownerState: { ...ownerState }
+    },
+    `${option}-${index}`
+  )) }) });
 }
 export {
   useStartAdornments as u

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

@@ -27,12 +27,9 @@ function useValuesAndHandlers(props) {
       return;
     }
     const newValue = value || (multiple ? [] : null);
-    if (deepEqual(selectedValue, newValue)) {
-      return;
-    }
     refValue.current = newValue;
     setSelectedValue(newValue);
-  }, [multiple, value, selectedValue]);
+  }, [multiple, value]);
   const isOptionEqualToValueLocal = useCallback(
     (option, val) => {
       if (val === null || val === void 0) {
@@ -125,15 +122,11 @@ function useValuesAndHandlers(props) {
   useEffect(() => {
     if (readOnly && value !== null && value !== void 0 && !multiple) {
       const displayValue = getOptionLabelLocal(value);
-      if (inputValue !== displayValue) {
-        setInputValue(displayValue);
-      }
+      setInputValue(displayValue);
     } else if (readOnly && multiple) {
-      if (inputValue !== "") {
-        setInputValue("");
-      }
+      setInputValue("");
     }
-  }, [readOnly, value, getOptionLabelLocal, multiple, inputValue]);
+  }, [readOnly, value, getOptionLabelLocal, multiple]);
   useEffect(() => {
     if (open === false && value === null && inputValue !== "") {
       setInputValue("");

package/components/mui_extended/Autocomplete/slots/AutocompleteEnum.d.ts

@@ -13,6 +13,5 @@ export declare enum AutocompleteSlots {
     image = "image",
     renderInputText = "renderInputText",
     containerMultipleValues = "containerMultipleValues",
-    containerWrapper = "containerWrapper",
-    wrapperStartAdornment = "wrapperStartAdornment"
+    containerWrapper = "containerWrapper"
 }

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

@@ -14,7 +14,6 @@ var AutocompleteSlots = /* @__PURE__ */ ((AutocompleteSlots2) => {
   AutocompleteSlots2["renderInputText"] = "renderInputText";
   AutocompleteSlots2["containerMultipleValues"] = "containerMultipleValues";
   AutocompleteSlots2["containerWrapper"] = "containerWrapper";
-  AutocompleteSlots2["wrapperStartAdornment"] = "wrapperStartAdornment";
   return AutocompleteSlots2;
 })(AutocompleteSlots || {});
 export {

package/components/mui_extended/Autocomplete/slots/AutocompleteSlots.d.ts

@@ -39,9 +39,6 @@ export declare const RenderInputTextStyled: import('@emotion/styled').StyledComp
 export declare const AdormentsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
     ownerState?: (Partial<import('../types').AutocompleteOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
-export declare const WrapperStartAdornmentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
-    ownerState?: (Partial<import('../types').AutocompleteOwnerState> & Record<string, unknown>) | undefined;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const ContainerMultipleValuesStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
     ownerState?: (Partial<import('../types').AutocompleteOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;

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

@@ -64,10 +64,6 @@ const AdormentsStyled = styled("div", {
   name: AUTOCOMPLETE_KEY_COMPONENT,
   slot: AutocompleteSlots.adorments
 })(autocompleteSyles?.adorments);
-const WrapperStartAdornmentStyled = styled("div", {
-  name: AUTOCOMPLETE_KEY_COMPONENT,
-  slot: AutocompleteSlots.wrapperStartAdornment
-})(autocompleteSyles?.wrapperStartAdornment);
 const ContainerMultipleValuesStyled = styled("div", {
   name: AUTOCOMPLETE_KEY_COMPONENT,
   slot: AutocompleteSlots.containerMultipleValues
@@ -83,7 +79,6 @@ export {
   PopperComponentStyled as P,
   RenderInputStyled as R,
   SkeletonAutocompleteStyled as S,
-  WrapperStartAdornmentStyled as W,
   AdormentsStyled as a,
   ContainerMultipleValuesStyled as b,
   ContainerWrapperStyled as c,

package/components/mui_extended/Autocomplete/types.d.ts

@@ -1,6 +1,6 @@
 import { AutocompleteChangeReason, AutocompleteFreeSoloValueMapping, AutocompleteInputChangeReason, AutocompleteProps as MUIAutocompleteProps, Theme } from '@mui/material';
 import { Sizes } from '@m4l/styles';
-import { ChangeEvent, ReactElement } from 'react';
+import { ChangeEvent } from 'react';
 import { TextFieldProps } from '../TextField/types';
 import { AUTOCOMPLETE_KEY_COMPONENT } from './constants';
 import { AutocompleteSlots } from './slots';
@@ -75,10 +75,6 @@ export interface AutocompleteProps<T, Multiple extends boolean | undefined> exte
      * "htmlFor" attribute for the autocomplete field.
      */
     htmlFor?: string;
-    /**
-     * Icono o adorno que se muestra al inicio del autocomplete.
-     */
-    startAdornment?: ReactElement;
 }
 /**
  * Represents the owner state of the Autocomplete component for styling purposes.
@@ -88,7 +84,6 @@ export interface AutocompleteOwnerState extends Pick<BaseAutocompleteProps, 'siz
     disabled?: boolean;
     multiple?: boolean;
     readOnly?: boolean;
-    startAdornment?: boolean;
 }
 /**
  * Defines the types of Slots available for the Autocomplete.

package/components/mui_extended/CheckBox/CheckBox.js

@@ -64,7 +64,6 @@ const CheckBox = forwardRef((props, ref) => {
         ownerState: { ...ownerState },
         size: adjustedSize,
         disabled,
-        ellipsis: true,
         children: inlineText
       }
     )

package/components/mui_extended/CheckBox/CheckBox.styles.js

@@ -14,7 +14,7 @@ const checkBoxStyles = {
       overflow: "visible",
       boxSizing: "border-box",
       gap: theme.vars.size.baseSpacings.sp1,
-      width: "100%"
+      width: "fit-content"
     };
   },
   /**

package/components/mui_extended/Tooltip/Tooltip.styles.js

@@ -8,7 +8,6 @@ const tooltipStyles = {
    * Estilos del texto del componente Tooltip
    */
   text: ({ theme, ownerState }) => ({
-    color: theme.vars.palette.text.contrastText,
     ...getTypographyStyles(
       theme.generalSettings.isMobile,
       ownerState?.size || "medium",
@@ -19,18 +18,14 @@ const tooltipStyles = {
    * Estilos del componente Tooltip
    */
   tooltip: ({ theme }) => ({
-    background: theme.vars.palette.background.contrastDefault,
+    background: theme.vars.palette.background.default,
     padding: theme.vars.size.baseSpacings.sp2,
     borderRadius: theme.vars.size.borderRadius.r1,
     boxShadow: theme.vars.customShadows.z3,
     ".MuiTooltip-arrow": {
       "&::before": {
-        backgroundColor: theme.vars.palette.background.contrastDefault,
-        borderRadius: theme.vars.size.borderRadius["r1"],
-        width: theme.vars.size.baseSpacings.sp3,
-        height: theme.vars.size.baseSpacings.sp3,
-        border: "unset",
-        margin: "unset"
+        backgroundColor: theme.vars.palette.background.default,
+        borderRadius: theme.vars.size.borderRadius["r0-5"]
       }
     }
   })

package/components/mui_extended/Typography/types.d.ts

@@ -3,7 +3,6 @@ import { Sizes, TypographyVariants } from '@m4l/styles';
 import { TypographySlots } from './slots/typographyEnum';
 import { TYPOGRAPHY_KEY_COMPONENT } from './constants';
 import { M4LOverridesStyleRules } from '../../../@types/augmentations';
-import { DeepKeyOf } from '../../../utils/types';
 /**
  * Define los colores de tipografía disponibles para el componente.
  */
@@ -24,7 +23,7 @@ export interface TypographyProps extends Omit<MUITypographyProps, 'color' | 'var
     /**
      * Opción de color usada para pintar el componente.
      */
-    color?: DeepKeyOf<Theme['vars']['palette']> | string;
+    color?: TypographyColors;
     /**
      * Opciones de tamaño del componente.
      */

package/components/mui_extended/Typography/typography.styles.js

@@ -1,4 +1,3 @@
-import { getPropertyByString } from "@m4l/core";
 import { g as getSizeStyles } from "../../../utils/getSizeStyles/getSizeStyles.js";
 import { g as getTypographyStyles } from "../../../utils/getTypographyStyles.js";
 const typographyStyles = {
@@ -20,11 +19,17 @@ const typographyStyles = {
         flexDirection: "column"
       },
       // Override de estilos generales de MUI 🚫
+      // color text.primary 🎨
+      ...ownerState?.color === "text.primary" && {
+        color: theme.vars.palette.text.primary
+      },
+      // color text.secondary 🎨
+      ...ownerState?.color === "text.secondary" && {
+        color: theme.vars.palette.text.secondary
+      },
       // color text.disabled 🎨
-      ...ownerState?.disabled || ownerState?.color === "text.disabled" ? {
+      ...(ownerState?.disabled || ownerState?.color === "text.disabled") && {
         color: theme.vars.palette.text.disabled
-      } : {
-        color: getPropertyByString(theme.vars.palette, ownerState?.color || "text.primary", "text.primary")
       },
       ...getTypographyStyles(
         theme.generalSettings.isMobile,

package/contexts/AppearanceComponentContext/AppearanceComponentContext.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { createContext, useRef, useEffect } from "react";
+import { createContext, useRef } from "react";
 import { DEFAULT_SIZE } from "@m4l/styles";
 import { c as createAppearanceComponentStore } from "./AppearanceComponentStore.js";
 const AppearanceComponentContext = createContext(null);
@@ -12,11 +12,6 @@ function AppearanceComponentProvider(props) {
       storeId
     }, storeDevtoolsEnabled);
   }
-  useEffect(() => {
-    if (appearanceComponentStoreRef.current && defaultSize) {
-      appearanceComponentStoreRef.current.getState().actions.setDefaultSize(defaultSize);
-    }
-  }, [defaultSize]);
   return /* @__PURE__ */ jsx(AppearanceComponentContext.Provider, { value: appearanceComponentStoreRef.current, children });
 }
 export {