@m4l/components 9.4.40 → 9.4.41

package/components/extended/mui/AutocompleteAsync/reducer/AutocompleteAsyncReducer.d.ts

@@ -0,0 +1,23 @@
+import { AutocompleteAsyncAction, AutocompleteAsyncState, OnChangeFilterParms } from '../types';
+type GetInitialStateProps = {
+    parms?: Record<string, any>;
+    onChangeFilterParms?: OnChangeFilterParms;
+};
+/**
+ * Builds the initial `AutocompleteAsync` state.
+ * @param props - Initial params and optional query-param builder used for search-as-you-type.
+ * @returns The initial state used by the reducer.
+ */
+export declare function getInitialStateAutocompleteAsync<T>(props: GetInitialStateProps): AutocompleteAsyncState<T>;
+/**
+ * Creates the initial state for `AutocompleteAsync`.
+ *
+ * It precomputes the initial `queryParams` when `onChangeFilterParms` is provided
+ * (by calling it with an empty string), so the first fetch can use the expected
+ * default filters.
+ * @param props - Initial parameters and optional filter builder.
+ * @returns The initial reducer state.
+ */
+export declare function autocompleteAsyncReducer<T>(onChangeFilterParms?: OnChangeFilterParms): (state: AutocompleteAsyncState<T>, action: AutocompleteAsyncAction<T>) => AutocompleteAsyncState<T>;
+export {};
+//# sourceMappingURL=AutocompleteAsyncReducer.d.ts.map

package/components/extended/mui/AutocompleteAsync/reducer/AutocompleteAsyncReducer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutocompleteAsyncReducer.d.ts","sourceRoot":"","sources":["../../../../../../../../../packages/components/src/components/extended/mui/AutocompleteAsync/reducer/AutocompleteAsyncReducer.ts"],"names":[],"mappings":"AACA,OAAO,EACL,uBAAuB,EAEvB,sBAAsB,EACtB,mBAAmB,EACpB,MAAM,UAAU,CAAC;AAElB,KAAK,oBAAoB,GAAG;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;CAC3C,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,gCAAgC,CAAC,CAAC,EAChD,KAAK,EAAE,oBAAoB,GAC1B,sBAAsB,CAAC,CAAC,CAAC,CAU3B;AAED;;;;;;;;GAQG;AACH,wBAAgB,wBAAwB,CAAC,CAAC,EACxC,mBAAmB,CAAC,EAAE,mBAAmB,IAGvC,OAAO,sBAAsB,CAAC,CAAC,CAAC,EAChC,QAAQ,uBAAuB,CAAC,CAAC,CAAC,KACjC,sBAAsB,CAAC,CAAC,CAAC,CA4D7B"}

package/components/extended/mui/AutocompleteAsync/reducer/AutocompleteAsyncReducer.js

@@ -0,0 +1,72 @@
+import { deepEqual as i } from "fast-equals";
+import { actionsType as o } from "../types.js";
+function s(n) {
+  return {
+    fireFetchCount: 0,
+    options: [],
+    parms: n.parms,
+    loading: !1,
+    queryParams: n.onChangeFilterParms ? n.onChangeFilterParms("") : {},
+    isOpen: !1,
+    firstOpen: !0
+  };
+}
+function t(n) {
+  return (r, e) => {
+    switch (e.type) {
+      case o.REFRESH:
+        return {
+          ...r,
+          fireFetchCount: r.fireFetchCount + 1
+        };
+      case o.SET_PARAMS:
+        if (i(r.parms, e.payload))
+          return r;
+        {
+          const u = n ? n("") : r.queryParams;
+          return {
+            ...r,
+            parms: e.payload,
+            fireFetchCount: 0,
+            firstOpen: !0,
+            options: [],
+            queryParams: u
+          };
+        }
+      case o.SET_QUERY_PARAMS:
+        return i(r.queryParams, e.payload) ? r : {
+          ...r,
+          queryParams: e.payload,
+          fireFetchCount: r.fireFetchCount + 1
+        };
+      case o.FINISH_LOAD_OPTIONS: {
+        const u = e.payload?.options ?? r.options, p = e.payload?.options ? r.firstOpen : !0;
+        return {
+          ...r,
+          options: u,
+          loading: !1,
+          firstOpen: p
+        };
+      }
+      case o.OPEN:
+        return {
+          ...r,
+          isOpen: !0,
+          fireFetchCount: r.firstOpen ? r.fireFetchCount + 1 : r.fireFetchCount,
+          firstOpen: !1,
+          loading: r.firstOpen ? !0 : r.loading
+        };
+      case o.CLOSE:
+        return {
+          ...r,
+          isOpen: !1
+        };
+      default:
+        return r;
+    }
+  };
+}
+export {
+  t as autocompleteAsyncReducer,
+  s as getInitialStateAutocompleteAsync
+};

package/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncEnum.d.ts

@@ -0,0 +1,6 @@
+export declare enum AutocompleteAsyncSlots {
+    root = "root"
+}
+export declare enum AutocompleteAsyncComplementaryClasses {
+}
+//# sourceMappingURL=AutocompleteAsyncEnum.d.ts.map

package/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncEnum.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutocompleteAsyncEnum.d.ts","sourceRoot":"","sources":["../../../../../../../../../packages/components/src/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncEnum.ts"],"names":[],"mappings":"AAAA,oBAAY,sBAAsB;IAChC,IAAI,SAAS;CACd;AAED,oBAAY,qCAAqC;CAEhD"}

package/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncEnum.js

@@ -0,0 +1,5 @@
+var e = /* @__PURE__ */ ((r) => (r.root = "root", r))(e || {}), o = /* @__PURE__ */ ((r) => r)(o || {});
+export {
+  o as AutocompleteAsyncComplementaryClasses,
+  e as AutocompleteAsyncSlots
+};

package/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncSlots.d.ts

@@ -0,0 +1,4 @@
+export declare const AutocompleteAsyncRootStyled: import('@emotion/styled').StyledComponent<Pick<import('../../Autocomplete/types').AutocompleteProps<unknown, boolean | undefined> & {
+    ref?: import('react').Ref<HTMLInputElement | HTMLTextAreaElement>;
+}, "ref" | keyof import('../../Autocomplete/types').AutocompleteProps<unknown, boolean | undefined>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, {}, {}>;
+//# sourceMappingURL=AutocompleteAsyncSlots.d.ts.map

package/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncSlots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutocompleteAsyncSlots.d.ts","sourceRoot":"","sources":["../../../../../../../../../packages/components/src/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncSlots.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,2BAA2B;;mNAGP,CAAC"}

package/components/extended/mui/AutocompleteAsync/slots/AutocompleteAsyncSlots.js

@@ -0,0 +1,12 @@
+import { styled as o } from "@mui/material/styles";
+import { Autocomplete as t } from "../../Autocomplete/Autocomplete.js";
+import { autocompleteAsyncStyles as m } from "../AutocompleteAsync.styles.js";
+import { AUTOCOMPLETE_ASYNC_KEY_COMPONENT as e } from "../constants.js";
+import { AutocompleteAsyncSlots as r } from "./AutocompleteAsyncEnum.js";
+const y = o(t, {
+  name: e,
+  slot: r.root
+})(m?.root);
+export {
+  y as AutocompleteAsyncRootStyled
+};

package/components/extended/mui/AutocompleteAsync/slots/index.d.ts

@@ -0,0 +1,3 @@
+export * from './AutocompleteAsyncEnum';
+export * from './AutocompleteAsyncSlots';
+//# sourceMappingURL=index.d.ts.map

package/components/extended/mui/AutocompleteAsync/slots/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../../packages/components/src/components/extended/mui/AutocompleteAsync/slots/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC"}

package/components/extended/mui/AutocompleteAsync/tests/common.d.ts

@@ -0,0 +1,34 @@
+import { AutocompleteAsyncProps } from '../types';
+import { renderMaterialUI } from '../../../../../test';
+export interface OptionsTests {
+    id: number;
+    name: string;
+}
+type ControlledValue = OptionsTests | OptionsTests[] | null;
+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;
+export declare const mockItemPreselectedMultipleNotInOptions: OptionsTests[];
+export declare const DEFAULT_PROPS: Omit<AutocompleteAsyncProps<OptionsTests>, 'value' | 'onChange'>;
+/**
+ * Custom filter function.
+ */
+export declare const onChangeFilterParms: (newValue: string) => {
+    f: ({
+        n: string;
+        o: string;
+        o1: boolean;
+    } | {
+        n: string;
+        o: string;
+        o1: string;
+    })[];
+};
+/**
+ * Renders the AutocompleteAsync component with EnvironmentProvider.
+ */
+export declare const renderAutocompleteAsync: (overrideProps?: Partial<Omit<AutocompleteAsyncProps<OptionsTests>, "value" | "onChange">>, initialValue?: ControlledValue, withAutoValueChange?: boolean, autoValueChange?: ControlledValue) => ReturnType<typeof renderMaterialUI>;
+export {};
+//# sourceMappingURL=common.d.ts.map

package/components/extended/mui/AutocompleteAsync/tests/common.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../../../../../../packages/components/src/components/extended/mui/AutocompleteAsync/tests/common.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAElD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,KAAK,eAAe,GAAG,YAAY,GAAG,YAAY,EAAE,GAAG,IAAI,CAAC;AAE5D,eAAO,MAAM,SAAS,EAAE,YAAY,EAMnC,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,YAGvC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,YAGjC,CAAC;AAEF,eAAO,MAAM,2BAA2B,EAAE,YAAY,EAGrD,CAAC;AAEF,eAAO,MAAM,+BAA+B,EAAE,YAG7C,CAAC;AAEF,eAAO,MAAM,uCAAuC,EAAE,YAAY,EAGjE,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,IAAI,CAAC,sBAAsB,CAAC,YAAY,CAAC,EAAE,OAAO,GAAG,UAAU,CAW1F,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,mBAAmB,GAAI,UAAU,MAAM;;;;;;;;;;CAuBnD,CAAC;AA8CF;;GAEG;AACH,eAAO,MAAM,uBAAuB,GAClC,gBAAgB,OAAO,CAAC,IAAI,CAAC,sBAAsB,CAAC,YAAY,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC,EACzF,eAAe,eAAe,EAC9B,6BAA2B,EAC3B,kBAAkB,eAAe,KAChC,UAAU,CAAC,OAAO,gBAAgB,CAgBpC,CAAC"}

package/components/extended/mui/AutocompleteAsync/types.d.ts

@@ -0,0 +1,82 @@
+import { AutocompleteProps } from '../Autocomplete/types';
+import { Theme } from '@mui/material';
+import { M4LOverridesStyleRules } from '../../../../@types/augmentations';
+import { AUTOCOMPLETE_ASYNC_KEY_COMPONENT } from './constants';
+import { AutocompleteAsyncSlots } from './slots/AutocompleteAsyncEnum';
+export type OnChangeFilterParms = (newValue: string) => Record<string, any>;
+/**
+ * Props for the AutocompleteAsync component (extended/mui).
+ * Manages options via fetch; value/onChange are passed by parent or by withRHFController.
+ */
+export interface AutocompleteAsyncProps<T = unknown> extends Omit<AutocompleteProps<T, boolean | undefined>, 'options' | 'onOpen' | 'onClose' | 'open'> {
+    /** Optional text label for the field (when used without RHF wrappers). */
+    label?: string;
+    /** URL to fetch data from */
+    endPoint: string;
+    /** Whether the response should be converted to camel case */
+    responseToCamelCase?: boolean;
+    /** Timeout for the fetch request */
+    timeout?: number;
+    /** Parameters to send with the fetch request */
+    parms?: Record<string, any>;
+    /** Whether the URL is external */
+    isExternalUrl?: boolean;
+    /** Field in the response object that contains the data (e.g. 'data') */
+    resultField?: string;
+    /** Whether the data is fetched remotely */
+    isRemote?: boolean;
+    /** Callback to build filter params from input (e.g. for search); when set, multiple must be false */
+    onChangeFilterParms?: OnChangeFilterParms;
+    /** Width for skeleton placeholder when loading (e.g. in storybook or SSR) */
+    skeletonWidth?: string | number;
+    /** Input autoCapitalize (passed to underlying input when used in forms/filters) */
+    autoCapitalize?: string;
+    /** Input autoComplete (passed to underlying input when used in forms/filters) */
+    autoComplete?: string;
+    /** Input type (passed to underlying input when used in forms/filters) */
+    type?: string;
+}
+export type AutocompleteAsyncSlotsType = keyof typeof AutocompleteAsyncSlots;
+export type AutocompleteAsyncStyles = M4LOverridesStyleRules<AutocompleteAsyncSlotsType, typeof AUTOCOMPLETE_ASYNC_KEY_COMPONENT, Theme>;
+/** Reducer action types for AutocompleteAsync */
+export declare const actionsType: {
+    readonly REFRESH: "REFRESH";
+    readonly SET_PARAMS: "SET_PARAMS";
+    readonly SET_QUERY_PARAMS: "SET_QUERY_PARAMS";
+    readonly OPEN: "OPEN";
+    readonly CLOSE: "CLOSE";
+    readonly START_FETCHING_OPTIONS: "START_FETCHING_OPTIONS";
+    readonly FINISH_LOAD_OPTIONS: "FINISH_LOAD_OPTIONS";
+};
+export type AutocompleteAsyncAction<T> = {
+    type: typeof actionsType.REFRESH;
+} | {
+    type: typeof actionsType.SET_QUERY_PARAMS;
+    payload: Record<string, any>;
+} | {
+    type: typeof actionsType.FINISH_LOAD_OPTIONS;
+    payload: {
+        options?: Array<T>;
+    };
+} | {
+    type: typeof actionsType.OPEN;
+} | {
+    type: typeof actionsType.CLOSE;
+} | {
+    type: typeof actionsType.SET_PARAMS;
+    payload: Record<string, any> | undefined;
+};
+export type AutocompleteAsyncState<T> = {
+    options: Array<T>;
+    loading: boolean;
+    parms?: Record<string, any>;
+    queryParams: Record<string, any>;
+    isOpen: boolean;
+    firstOpen: boolean;
+    fireFetchCount: number;
+};
+export interface UseFetchOptionsProps<T> extends Pick<AutocompleteAsyncProps<T>, 'endPoint' | 'timeout' | 'isExternalUrl' | 'parms' | 'responseToCamelCase' | 'isRemote' | 'resultField'> {
+    state: AutocompleteAsyncState<T>;
+    dispatch: (value: AutocompleteAsyncAction<T>) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/components/extended/mui/AutocompleteAsync/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/mui/AutocompleteAsync/types.ts"],"names":[],"mappings":"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"}

package/components/extended/mui/AutocompleteAsync/types.js

@@ -0,0 +1,11 @@
+const S = {
+  REFRESH: "REFRESH",
+  SET_PARAMS: "SET_PARAMS",
+  SET_QUERY_PARAMS: "SET_QUERY_PARAMS",
+  OPEN: "OPEN",
+  CLOSE: "CLOSE",
+  FINISH_LOAD_OPTIONS: "FINISH_LOAD_OPTIONS"
+};
+export {
+  S as actionsType
+};

package/components/extended/mui/MenuItem/MenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/mui/MenuItem/MenuItem.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAsB,aAAa,EAAE,MAAM,SAAS,CAAC;AAE5D;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,GAAI,OAAO,aAAa,qDAuH5C,CAAC"}
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/mui/MenuItem/MenuItem.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAsB,aAAa,EAAE,MAAM,SAAS,CAAC;AAE5D;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,GAAI,OAAO,aAAa,qDAuH5C,CAAC"}

package/components/extended/mui/MenuItem/MenuItem.js

@@ -1,95 +1,94 @@
-import { jsx as r, jsxs as C } from "@emotion/react/jsx-runtime";
-import { useModuleSkeleton as j, useEnvironment as L } from "@m4l/core";
-import T from "clsx";
-import $, { useMemo as S } from "react";
-import { useComponentSize as A } from "../../../../hooks/useComponentSize/useComponentSize.js";
-import { getComponentSlotRoot as I } from "../../../../utils/getComponentSlotRoot.js";
-import { MENUITEM_CLASSES as f } from "./constants.js";
-import { MenuItemIconStyled as p, MenuItemSkeletonStyled as U, MenuItemRootStyled as V, MenuItemIconCheckedStyled as W, MenuItemTypographyStyled as q } from "./slots/MenuItemSlots.js";
-const Q = (M) => {
+import { jsx as m, jsxs as j } from "@emotion/react/jsx-runtime";
+import { useModuleSkeleton as A, useEnvironment as C } from "@m4l/core";
+import d from "clsx";
+import L, { useMemo as f } from "react";
+import { useComponentSize as T } from "../../../../hooks/useComponentSize/useComponentSize.js";
+import { MENUITEM_CLASSES as s } from "./constants.js";
+import { MenuItemIconStyled as p, MenuItemSkeletonStyled as $, MenuItemRootStyled as U, MenuItemIconCheckedStyled as V, MenuItemTypographyStyled as W } from "./slots/MenuItemSlots.js";
+const O = (M) => {
   const {
     startIcon: h,
     endIcon: k,
     label: y,
     value: b,
     skeletonWidth: z = "100%",
-    selected: s = !1,
-    color: a = "default",
+    selected: r = !1,
+    color: c = "default",
     disabled: t = !1,
     size: w = "medium",
-    checked: d = !1,
-    checkable: m = !1,
+    checked: u = !1,
+    checkable: a = !1,
     className: E,
     dataTestId: v,
-    ...N
-  } = M, { currentSize: l } = A(w), R = j(), { host_static_assets: _, environment_assets: g } = L(), e = l === "small" || l === "medium" ? l : "medium", n = S(() => ({
+    ...x
+  } = M, { currentSize: l } = T(w), N = A(), { host_static_assets: _, environment_assets: R } = C(), e = l === "small" || l === "medium" ? l : "medium", n = f(() => ({
     size: e,
     disabled: t,
-    selected: s,
-    color: a,
-    checkable: m,
-    checked: d
-  }), [e, t, s, a, m, d]), c = S(() => (o, u, i) => !o || typeof o == "boolean" || typeof o == "number" ? null : typeof o == "string" ? /* @__PURE__ */ r(
+    selected: r,
+    color: c,
+    checkable: a,
+    checked: u
+  }), [e, t, r, c, a, u]), i = f(() => (o, S, I) => !o || typeof o == "boolean" || typeof o == "number" ? null : typeof o == "string" ? /* @__PURE__ */ m(
     p,
     {
       ownerState: { ...n },
-      selected: s,
+      selected: r,
       enabledSelected: !0,
       src: o,
       alt: "icon",
       size: e,
       disabled: t,
-      instaceDataTestId: u,
-      className: i
+      instaceDataTestId: S,
+      className: d(I, s.menuItemIcon)
     }
-  ) : $.isValidElement(o) ? /* @__PURE__ */ r(
+  ) : L.isValidElement(o) ? /* @__PURE__ */ m(
     p,
     {
       ownerState: { ...n },
-      selected: s,
+      selected: r,
       enabledSelected: !0,
       src: o,
       size: e,
       disabled: t,
-      instaceDataTestId: u,
-      className: i
+      instaceDataTestId: S,
+      className: d(I, s.menuItemIcon, s.iconExternal)
     }
-  ) : null, [n, e, t, s]);
-  if (R)
-    return /* @__PURE__ */ r(
-      U,
+  ) : null, [n, e, t, r]);
+  if (N)
+    return /* @__PURE__ */ m(
+      $,
       {
         "data-testid": "SkeletonMenuItem",
         width: z,
         ownerState: { ...n },
-        className: f.skeletonMenuItem
+        className: s.skeletonMenuItem
       }
     );
-  const x = `${_}/${g}/frontend/components/menu_item/checked.svg`;
-  return /* @__PURE__ */ C(
-    V,
+  const g = `${_}/${R}/frontend/components/menu_item/checked.svg`;
+  return /* @__PURE__ */ j(
+    U,
     {
-      ...N,
+      ...x,
       value: b,
       ownerState: { ...n },
       disabled: t,
       disableRipple: !0,
       size: e,
-      className: T(E, f.root),
+      className: d(E, s.root),
       "data-testid": v || "MenuItemRoot",
       children: [
-        m && /* @__PURE__ */ r(
-          W,
+        a && /* @__PURE__ */ m(
+          V,
           {
-            src: x,
+            src: g,
             size: e,
             ownerState: { ...n },
             disabled: t
           }
         ),
-        c(h, "MenuItemStartIcon", I("MenuItemStartIcon")),
-        /* @__PURE__ */ r(
-          q,
+        i(h, "MenuItemStartIcon", s.startAdornment),
+        /* @__PURE__ */ m(
+          W,
           {
             ownerState: { ...n },
             variant: "body",
@@ -98,11 +97,11 @@ const Q = (M) => {
             children: y
           }
         ),
-        c(k, "MenuItemEndIcon", I("MenuItemEndIcon"))
+        i(k, "MenuItemEndIcon", s.endAdornment)
       ]
     }
   );
 };
 export {
-  Q as MenuItem
+  O as MenuItem
 };

package/components/extended/mui/MenuItem/MenuItem.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.styles.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/mui/MenuItem/MenuItem.styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,eAAO,MAAM,cAAc,EAAE,cA4I5B,CAAC"}
+{"version":3,"file":"MenuItem.styles.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/mui/MenuItem/MenuItem.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,eAAO,MAAM,cAAc,EAAE,cAoJ5B,CAAC"}

package/components/extended/mui/MenuItem/MenuItem.styles.js

@@ -1,10 +1,11 @@
-import { getSizeStyles as l } from "../../../../utils/getSizeStyles/getSizeStyles.js";
+import { getSizeStyles as s } from "../../../../utils/getSizeStyles/getSizeStyles.js";
+import { MENUITEM_CLASSES as i } from "./constants.js";
 const d = {
   /**
    * Estilos para el contenedor de los items del menú contenedor
    */
   root: ({ theme: r, ownerState: o }) => {
-    const e = o?.selected ? o?.color === "error" ? o?.color : "primary" : o?.color, i = r.vars.palette[e ?? "default"], s = (a) => o?.color === "default" && !o?.selected ? r.vars.palette.text.primary : i[a];
+    const a = o?.selected ? o?.color === "error" ? o?.color : "primary" : o?.color, n = r.vars.palette[a ?? "default"], t = (e) => o?.color === "default" && !o?.selected ? r.vars.palette.text.primary : n[e];
     return {
       width: "100%",
       gap: r.vars.size.baseSpacings.sp1,
@@ -19,48 +20,54 @@ const d = {
       // Estilos base para el texto y el ícono
       "&&& .M4LTypography-root": {
         paddingLeft: r.vars.size.baseSpacings.sp1,
-        color: s("enabled")
+        color: t("enabled")
+      },
+      "&.Mui-disabled": {
+        opacity: "1 !important",
+        "& .M4LTypography-root": {
+          color: `${r.vars.palette.text.disabled} !important`
+        },
+        [`& .${i.menuItemIcon}.M4LIcon-root:not(.${i.iconExternal}) .M4LIcon-icon`]: {
+          backgroundColor: `${r.vars.palette.text.disabled} !important`
+        }
       },
-      // '& .M4LIcon-icon': {
-      //   backgroundColor: `${color('enabled')} !important`,
-      // },
       "&:active": {
-        backgroundColor: `${i.activeOpacity} !important`,
-        "& .M4LIcon-icon": {
-          backgroundColor: s("active")
+        backgroundColor: `${n.activeOpacity} !important`,
+        [`& .${i.menuItemIcon}.M4LIcon-root:not(.${i.iconExternal}) .M4LIcon-icon`]: {
+          backgroundColor: t("active")
         },
         "&&& .M4LTypography-root": {
-          color: s("active")
+          color: t("active")
         }
       },
       "&:hover": {
-        backgroundColor: `${i.hoverOpacity} !important`
+        backgroundColor: `${n.hoverOpacity} !important`
       },
       ...o?.selected && {
-        backgroundColor: `${i.opacity} !important`,
+        backgroundColor: `${n.opacity} !important`,
         border: r.vars.size.borderStroke.container,
-        borderColor: i.enabledOpacity
+        borderColor: n.enabledOpacity
       },
       "& .M4LImage-root": {
         marginRight: 6,
         marginLeft: 6,
-        ...l(
+        ...s(
           r,
           o?.size || "medium",
           "base",
-          (a) => ({
-            height: a,
-            width: a
+          (e) => ({
+            height: e,
+            width: e
           })
         )
       },
-      ...l(
+      ...s(
         r,
         o?.size || "medium",
         "box",
-        (a) => ({
+        (e) => ({
           //height: 'auto !important',
-          minHeight: `${a}!important`
+          minHeight: `${e}!important`
         })
       )
     };
@@ -69,13 +76,13 @@ const d = {
    * Estilos para el icono de los items del menú
    */
   menuItemIcon: ({ ownerState: r, theme: o }) => {
-    const e = r?.selected ? r?.color === "error" ? o.vars.palette.error.enabled : o.vars.palette.primary.enabled : r?.color === "default" ? o.vars.palette.text.primary : o.vars.palette[r?.color ?? "default"].enabled;
-    return {
+    const a = r?.selected ? r?.color === "error" ? o.vars.palette.error.enabled : o.vars.palette.primary.enabled : r?.color === "default" ? o.vars.palette.text.primary : o.vars.palette[r?.color ?? "default"].enabled;
+    return console.log("finalColor", a), {
       "&.MenuItemEndIcon-root": {
         marginLeft: "auto"
       },
-      "& .M4LIcon-icon": {
-        backgroundColor: e
+      [`&.${i.menuItemIcon}.M4LIcon-root:not(.${i.iconExternal}) .M4LIcon-icon`]: {
+        backgroundColor: a
       }
     };
   },
@@ -83,11 +90,11 @@ const d = {
    * Estilos para el icono de los items del menú cuando están seleccionados
    */
   menuItemIconChecked: ({ theme: r, ownerState: o }) => {
-    const e = o?.selected ? o?.color === "error" ? r.vars.palette.error.enabled : r.vars.palette.primary.enabled : o?.color === "default" ? r.vars.palette.text.primary : r.vars.palette[o?.color ?? "default"].enabled;
+    const a = o?.selected ? o?.color === "error" ? r.vars.palette.error.enabled : r.vars.palette.primary.enabled : o?.color === "default" ? r.vars.palette.text.primary : r.vars.palette[o?.color ?? "default"].enabled;
     return {
       visibility: o?.checkable && o?.checked ? "visible" : "hidden",
       "& .M4LIcon-icon": {
-        backgroundColor: e
+        backgroundColor: a
       },
       variants: []
     };
@@ -111,7 +118,7 @@ const d = {
       display: "flex",
       alignItems: "center",
       background: `${r.vars.palette.skeleton.default} !important`,
-      ...l(
+      ...s(
         r,
         o?.size || "medium",
         "action"

package/components/extended/mui/MenuItem/constants.d.ts

@@ -9,5 +9,5 @@ export declare const MENUITEM_KEY_COMPONENT = "M4LMenuItem";
 /**
  * Inventario de clases CSS para el componente MenuItem
  */
-export declare const MENUITEM_CLASSES: Record<"root" | "menuItemIcon" | "menuItemIconChecked" | "skeletonMenuItem" | "menuItemTypography", string>;
+export declare const MENUITEM_CLASSES: Record<"root" | "menuItemIcon" | "menuItemIconChecked" | "skeletonMenuItem" | "menuItemTypography" | "iconExternal" | "startAdornment" | "endAdornment", string>;
 //# sourceMappingURL=constants.d.ts.map

package/components/extended/mui/MenuItem/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/mui/MenuItem/constants.ts"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,eAAO,MAAM,sBAAsB,gBAAgB,CAAC;AACpD;;GAEG;AACH,eAAO,MAAM,gBAAgB,6GAA6D,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/mui/MenuItem/constants.ts"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,eAAO,MAAM,sBAAsB,gBAAgB,CAAC;AAQpD;;GAEG;AACH,eAAO,MAAM,gBAAgB,kKAAqG,CAAC"}

package/components/extended/mui/MenuItem/constants.js

@@ -1,7 +1,11 @@
-import { getComponentClasses as o } from "../../../../utils/getComponentSlotRoot.js";
+import { getComponentClasses as n } from "../../../../utils/getComponentSlotRoot.js";
 import { MenuItemSlots as t } from "./slots/MenuItemEnum.js";
-const e = "M4LMenuItem", E = o(e, t);
+const e = "M4LMenuItem", o = {
+  iconExternal: "iconExternal",
+  startAdornment: "startAdornment",
+  endAdornment: "endAdornment"
+}, s = n(e, { ...t, ...o });
 export {
-  E as MENUITEM_CLASSES,
+  s as MENUITEM_CLASSES,
   e as MENUITEM_KEY_COMPONENT
 };

package/components/extended/mui/NavLink/constants.d.ts

@@ -11,5 +11,5 @@ export declare const NAV_LINK_SPECIFY = "M4lclassCssSpecificity";
 /**
  * Inventario de clases CSS para el componente Typography.
  */
-export declare const classNavLinkRoot: Record<"root" | "skeletonStyled" | "typographyStyled" | "routerNavLinkStyled", string>;
+export declare const classNavLinkRoot: Record<"root" | "typographyStyled" | "skeletonStyled" | "routerNavLinkStyled", string>;
 //# sourceMappingURL=constants.d.ts.map