@m4l/components 9.50.0 → 9.51.0-beta-m4lcom-764-device-picker.0

package/components/SettingsLayout/subcomponents/SettingFullscreen/SettingFullscreen.js

@@ -1,31 +1,31 @@
-import { jsx as r } from "@emotion/react/jsx-runtime";
-import { useState as m } from "react";
-import { Icon as i } from "@m4l/base";
-import { useModuleDictionary as f } from "@m4l/core";
-import { DICTIONARY as l } from "../../dictionary.js";
-import { PATH_ICONS as n } from "../../icons.js";
-import { SettingFullscreenStyled as a } from "../../slots/SettingsLayoutSlots.js";
-const C = (c) => {
-  const { prefixPathIcon: e } = c, [t, o] = m(!1), { getLabel: s } = f(), u = () => {
-    document.fullscreenElement ? document.exitFullscreen && (document.exitFullscreen(), o(!1)) : (document.documentElement.requestFullscreen(), o(!0));
+import { jsx as l } from "@emotion/react/jsx-runtime";
+import { useState as u } from "react";
+import { Icon as s } from "@m4l/base";
+import { useModuleDictionary as m } from "@m4l/core";
+import { DICTIONARY as r } from "../../dictionary.js";
+import { PATH_ICONS as o } from "../../icons.js";
+import { SettingFullscreenStyled as i } from "../../slots/SettingsLayoutSlots.js";
+const p = () => {
+  const [e, t] = u(!1), { getLabel: n } = m(), c = () => {
+    document.fullscreenElement ? document.exitFullscreen && (document.exitFullscreen(), t(!1)) : (document.documentElement.requestFullscreen(), t(!0));
   };
-  return /* @__PURE__ */ r(
-    a,
+  return /* @__PURE__ */ l(
+    i,
     {
       fullWidth: !0,
       variant: "contained",
       color: "default",
-      startIcon: /* @__PURE__ */ r(
-        i,
+      startIcon: /* @__PURE__ */ l(
+        s,
         {
-          src: t ? `${e}/${n.FULLSCREEN_EXIT}` : `${e}/${n.FULLSCREEN}`
+          src: e ? o.FULLSCREEN_EXIT : o.FULLSCREEN
         }
       ),
-      onClick: u,
-      label: s(t ? l.EXIT_FULLSCREEN : l.FULLSCREEN)
+      onClick: c,
+      label: n(e ? r.EXIT_FULLSCREEN : r.FULLSCREEN)
     }
   );
 };
 export {
-  C as SettingFullscreen
+  p as SettingFullscreen
 };

package/components/SettingsLayout/subcomponents/SettingItem/types.d.ts

@@ -1,5 +1,6 @@
+import { IconProps } from '@m4l/base';
 export interface SettingItemProps {
-    iconUrl: string;
+    iconUrl: NonNullable<IconProps['src']>;
     onChange?: VoidFunction;
     selected: boolean;
 }

package/components/SettingsLayout/subcomponents/SettingItem/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingItem/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,QAAQ,EAAE,OAAO,CAAC;CACnB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEtC,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,WAAW,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,QAAQ,EAAE,OAAO,CAAC;CACnB"}

package/components/SettingsLayout/subcomponents/SettingItemColor/SettingItemColor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SettingItemColor.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingItemColor/SettingItemColor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAKhD;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAAI,OAAO,qBAAqB,qDAmB5D,CAAC"}
+{"version":3,"file":"SettingItemColor.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingItemColor/SettingItemColor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAKhD;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAAI,OAAO,qBAAqB,qDAkB5D,CAAC"}

package/components/SettingsLayout/subcomponents/SettingItemColor/SettingItemColor.js

@@ -1,23 +1,22 @@
-import { jsx as e } from "@emotion/react/jsx-runtime";
-import { SettingItemColorContainerStyled as m, SettingItemColorStyled as a } from "../../slots/SettingsLayoutSlots.js";
+import { jsx as o } from "@emotion/react/jsx-runtime";
+import { SettingItemColorContainerStyled as i, SettingItemColorStyled as l } from "../../slots/SettingsLayoutSlots.js";
 import { PATH_ICONS as c } from "../../icons.js";
-import { useEnvironment as l } from "@m4l/core";
-const h = (o) => {
-  const { onChange: t, selected: r, color: n } = o, { host_static_assets: i, environment_assets: s } = l();
-  return /* @__PURE__ */ e(m, { children: /* @__PURE__ */ e(
-    a,
+const d = (t) => {
+  const { onChange: e, selected: r, color: n } = t;
+  return /* @__PURE__ */ o(i, { children: /* @__PURE__ */ o(
+    l,
     {
-      src: `${i}/${s}/${c.COLOR}`,
-      ...t ? {
-        onClick: t,
+      src: c.COLOR,
+      ...e ? {
+        onClick: e,
         tabIndex: 0,
         role: "radio",
         "aria-checked": !0
       } : {},
-      ownerState: { selected: r, onChange: !!t, color: n }
+      ownerState: { selected: r, onChange: !!e, color: n }
     }
   ) });
 };
 export {
-  h as SettingItemColor
+  d as SettingItemColor
 };

package/components/SettingsLayout/subcomponents/SettingMode/SettingMode.d.ts

@@ -1,6 +1,5 @@
-import { SettingModeProps } from './types';
 /**
  * Configuración de modo de tema
  */
-export declare const SettingMode: (props: SettingModeProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const SettingMode: () => import("@emotion/react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SettingMode.d.ts.map

package/components/SettingsLayout/subcomponents/SettingMode/SettingMode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SettingMode.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingMode/SettingMode.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAG3C;;GAEG;AACH,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,qDAgClD,CAAC"}
+{"version":3,"file":"SettingMode.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingMode/SettingMode.tsx"],"names":[],"mappings":"AAaA;;GAEG;AACH,eAAO,MAAM,WAAW,wDA+BvB,CAAC"}

package/components/SettingsLayout/subcomponents/SettingMode/SettingMode.js

@@ -1,34 +1,34 @@
-import { jsxs as r, jsx as e } from "@emotion/react/jsx-runtime";
-import { useModuleDictionary as g } from "@m4l/core";
-import { PATH_ICONS as n } from "../../icons.js";
-import { DICTIONARY as p } from "../../dictionary.js";
-import { Icon as S, Typography as h } from "@m4l/base";
-import { SettingContainerStyled as f, SettingIconTitleStyled as I, SettingItemContentStyled as $ } from "../../slots/SettingsLayoutSlots.js";
+import { jsxs as n, jsx as e } from "@emotion/react/jsx-runtime";
+import { useModuleDictionary as a } from "@m4l/core";
+import { PATH_ICONS as o } from "../../icons.js";
+import { DICTIONARY as d } from "../../dictionary.js";
+import { Icon as g, Typography as S } from "@m4l/base";
+import { SettingContainerStyled as p, SettingIconTitleStyled as h, SettingItemContentStyled as f } from "../../slots/SettingsLayoutSlots.js";
 import { useThemeSettingsStore as y } from "@m4l/graphics";
-import { SettingItem as C } from "../SettingItem/SettingItem.js";
-const A = (i) => {
-  const { prefixPathIcon: o } = i, { settingsActions: m, themeUserSettings: s } = y((t) => t), { onChangeMode: c } = m, { getLabel: l } = g();
-  return /* @__PURE__ */ r(f, { role: "group", "aria-label": "theme-mode-options", children: [
-    /* @__PURE__ */ r(I, { children: [
-      /* @__PURE__ */ e(S, { src: `${o}/${n.MODE}` }),
-      /* @__PURE__ */ e(h, { variant: "bodyStandard", children: l(p.MODE) })
+import { SettingItem as I } from "../SettingItem/SettingItem.js";
+const x = () => {
+  const { settingsActions: r, themeUserSettings: i } = y((t) => t), { onChangeMode: m } = r, { getLabel: s } = a();
+  return /* @__PURE__ */ n(p, { role: "group", "aria-label": "theme-mode-options", children: [
+    /* @__PURE__ */ n(h, { children: [
+      /* @__PURE__ */ e(g, { src: o.MODE }),
+      /* @__PURE__ */ e(S, { variant: "bodyStandard", children: s(d.MODE) })
     ] }),
-    /* @__PURE__ */ e($, { children: ["light", "dark"].map((t, a) => {
-      const d = s.themeMode === t;
+    /* @__PURE__ */ e(f, { children: ["light", "dark"].map((t, l) => {
+      const c = i.themeMode === t;
       return /* @__PURE__ */ e(
-        C,
+        I,
         {
-          iconUrl: t === "light" ? `${o}/${n.SUN}` : `${o}/${n.MOON}`,
-          selected: d,
+          iconUrl: t === "light" ? o.SUN : o.MOON,
+          selected: c,
           onChange: () => {
-            c(t);
+            m(t);
           }
         },
-        `${t}-${a}`
+        `${t}-${l}`
       );
     }) })
   ] });
 };
 export {
-  A as SettingMode
+  x as SettingMode
 };

package/components/SettingsLayout/subcomponents/SettingsLayoutBase/SettingsLayoutBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsLayoutBase.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingsLayoutBase/SettingsLayoutBase.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAKlD;;GAEG;AACH,eAAO,MAAM,kBAAkB,GAAI,OAAO,uBAAuB,qDAiEhE,CAAC"}
+{"version":3,"file":"SettingsLayoutBase.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingsLayoutBase/SettingsLayoutBase.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAKlD;;GAEG;AACH,eAAO,MAAM,kBAAkB,GAAI,OAAO,uBAAuB,qDAgEhE,CAAC"}

package/components/SettingsLayout/subcomponents/SettingsLayoutBase/SettingsLayoutBase.js

@@ -1,72 +1,70 @@
-import { jsxs as o, Fragment as h, jsx as t } from "@emotion/react/jsx-runtime";
-import { AnimatePresence as u } from "framer-motion";
-import { useModuleDictionary as y } from "@m4l/core";
-import { PATH_ICONS as i } from "../../icons.js";
-import { BackdropStyled as C, SettingsLayoutRootStyled as A, HeaderContainerStyled as b, TypographyStyled as E, HeaderActionsStyled as L, BodyContentStyled as T } from "../../slots/SettingsLayoutSlots.js";
-import w from "../SettingDirection/SettingDirection.js";
-import { DICTIONARY as D } from "../../dictionary.js";
-import { useThemeSettingsStore as I } from "@m4l/graphics";
-import { SETTINGS_LAYOUT_CLASSES as s } from "../../constants.js";
-import { IconButton as l } from "../../../extended/mui/IconButton/IconButton.js";
+import { jsxs as e, Fragment as h, jsx as t } from "@emotion/react/jsx-runtime";
+import { AnimatePresence as f } from "framer-motion";
+import { useModuleDictionary as u } from "@m4l/core";
+import { PATH_ICONS as n } from "../../icons.js";
+import { BackdropStyled as y, SettingsLayoutRootStyled as C, HeaderContainerStyled as A, TypographyStyled as b, HeaderActionsStyled as E, BodyContentStyled as L } from "../../slots/SettingsLayoutSlots.js";
+import { DICTIONARY as T } from "../../dictionary.js";
+import { useThemeSettingsStore as w } from "@m4l/graphics";
+import { SETTINGS_LAYOUT_CLASSES as i } from "../../constants.js";
+import { IconButton as s } from "../../../extended/mui/IconButton/IconButton.js";
 import { SettingMode as N } from "../SettingMode/SettingMode.js";
 import { SettingColorPresets as O } from "../SettingColorPresets/SettingColorPresets.js";
-import { SettingFullscreen as R } from "../SettingFullscreen/SettingFullscreen.js";
-const G = (a) => {
+import { SettingFullscreen as D } from "../SettingFullscreen/SettingFullscreen.js";
+const Y = (l) => {
   const {
-    open: r,
-    themeUserSettings: m,
-    settingsActions: c
-  } = I((f) => f), { prefixPathIcon: e, width: S } = a, { themeDirection: d } = m, { onResetSetting: p, handleOpen: n } = c, { getLabel: g } = y();
-  return /* @__PURE__ */ o(h, { children: [
+    open: o,
+    themeUserSettings: a,
+    settingsActions: m
+  } = w((g) => g), { width: c } = l, { themeDirection: S } = a, { onResetSetting: d, handleOpen: r } = m, { getLabel: p } = u();
+  return /* @__PURE__ */ e(h, { children: [
     /* @__PURE__ */ t(
-      C,
+      y,
       {
         ownerState: {},
-        open: r,
-        onClick: () => n()
+        open: o,
+        onClick: () => r()
       }
     ),
-    /* @__PURE__ */ t(u, { children: r && /* @__PURE__ */ o(A, { role: "form", "aria-label": "settings-layout", ownerState: { themeDirection: d, width: S }, className: s.root, children: [
-      /* @__PURE__ */ o(b, { ownerState: {}, className: s.headerContainer, children: [
+    /* @__PURE__ */ t(f, { children: o && /* @__PURE__ */ e(C, { role: "form", "aria-label": "settings-layout", ownerState: { themeDirection: S, width: c }, className: i.root, children: [
+      /* @__PURE__ */ e(A, { ownerState: {}, className: i.headerContainer, children: [
         /* @__PURE__ */ t(
-          E,
+          b,
           {
             ownerState: {},
             variant: "subtitleDens",
             ellipsis: !0,
-            children: g(D.MODULE_NAME)
+            children: p(T.MODULE_NAME)
           }
         ),
-        /* @__PURE__ */ o(L, { children: [
+        /* @__PURE__ */ e(E, { children: [
           /* @__PURE__ */ t(
-            l,
+            s,
             {
-              src: `${e}/${i.REFRESH}`,
-              onClick: p,
+              src: n.REFRESH,
+              onClick: d,
               role: "button",
               "aria-label": "reset-setting"
             }
           ),
           /* @__PURE__ */ t(
-            l,
+            s,
             {
-              src: `${e}/${i.CLOSE}`,
-              onClick: () => n(),
+              src: n.CLOSE,
+              onClick: () => r(),
               role: "button",
               "aria-label": "close-settings"
             }
           )
         ] })
       ] }),
-      /* @__PURE__ */ o(T, { ownerState: {}, children: [
-        /* @__PURE__ */ t(N, { prefixPathIcon: e }),
-        /* @__PURE__ */ t(w, { prefixPathIcon: e }),
-        /* @__PURE__ */ t(O, { prefixPathIcon: e }),
-        /* @__PURE__ */ t(R, { prefixPathIcon: e })
+      /* @__PURE__ */ e(L, { ownerState: {}, children: [
+        /* @__PURE__ */ t(N, {}),
+        /* @__PURE__ */ t(O, {}),
+        /* @__PURE__ */ t(D, {})
       ] })
     ] }) })
   ] });
 };
 export {
-  G as SettingsLayoutBase
+  Y as SettingsLayoutBase
 };

package/components/SettingsLayout/subcomponents/SettingsLayoutBase/types.d.ts

@@ -1,6 +1,5 @@
 import { SettingsLayoutProps } from '../../types';
 export interface SettingsLayoutBaseProps {
-    prefixPathIcon: string;
     width: SettingsLayoutProps['width'];
 }
 //# sourceMappingURL=types.d.ts.map

package/components/SettingsLayout/subcomponents/SettingsLayoutBase/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingsLayoutBase/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,WAAW,uBAAuB;IACtC,cAAc,EAAE,MAAM,CAAC;IACvB,KAAK,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAAC;CACrC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SettingsLayout/subcomponents/SettingsLayoutBase/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAAC;CACrC"}

package/components/SideBar/SideBar.d.ts

@@ -5,7 +5,6 @@ import { SideBarProps } from './types';
  * de selección y activación. Además, permite alternar la visibilidad y el anclaje de la barra lateral.
  * ### Dependencias:
  * - **`useMobile:`** Hook que devuelve un valor booleano indicando si la aplicación se está ejecutando en un entorno de escritorio.
- * - **`useEnvironmen:`** Hook que devuelve el estado del entorno de la aplicación.
  * - **`useFirstRender:`** Hook que devuelve un valor booleano indicando si el componente se está renderizando por primera vez.
  */
 export declare const SideBar: import('react').MemoExoticComponent<(props: SideBarProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/components/SideBar/SideBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SideBar.d.ts","sourceRoot":"","sources":["../../../../../../packages/components/src/components/SideBar/SideBar.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAUvC;;;;;;;;GAQG;AACH,eAAO,MAAM,OAAO,8CAAgB,YAAY,sDAuD9C,CAAC"}
+{"version":3,"file":"SideBar.d.ts","sourceRoot":"","sources":["../../../../../../packages/components/src/components/SideBar/SideBar.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAQvC;;;;;;;GAOG;AACH,eAAO,MAAM,OAAO,8CAAgB,YAAY,sDAsD9C,CAAC"}

package/components/SideBar/SideBar.js

@@ -1,58 +1,56 @@
 import { jsx as e } from "@emotion/react/jsx-runtime";
-import { SideBarProvider as x } from "./context/sideBarContext/index.js";
-import { SideBarMobile as I } from "./subcomponents/SideBarMobile/index.js";
-import { SideBarDesktop as y } from "./subcomponents/SideBarDesktop/index.js";
-import { memo as B, useMemo as C } from "react";
-import { getMenuDataWithState as T } from "./helpers/getMenuDataWithState/index.js";
-import { useIsMobile as _ } from "@m4l/graphics";
-import { getDataToSkeleton as k } from "./helpers/getDataToSkeleton/index.js";
-import { PATH_ICONS as P } from "./constants.js";
-import { useEnvironment as W } from "@m4l/core";
-const q = B((r) => {
-  const { host_static_assets: m, environment_assets: n } = W(), {
-    anchored: a,
-    visible: i,
-    onToggleAnchored: s,
-    onToggleVisible: p,
+import { SideBarProvider as b } from "./context/sideBarContext/index.js";
+import { SideBarMobile as x } from "./subcomponents/SideBarMobile/index.js";
+import { SideBarDesktop as v } from "./subcomponents/SideBarDesktop/index.js";
+import { memo as y, useMemo as B } from "react";
+import { getMenuDataWithState as I } from "./helpers/getMenuDataWithState/index.js";
+import { useIsMobile as k } from "@m4l/graphics";
+import { getDataToSkeleton as C } from "./helpers/getDataToSkeleton/index.js";
+const V = y((r) => {
+  const {
+    anchored: m,
+    visible: a,
+    onToggleAnchored: n,
+    onToggleVisible: i,
     menuData: t,
     onMenuItemClick: l,
-    companyLogoUrl: c,
+    companyLogoUrl: p,
     companyLogoSmallUrl: d,
     moduleSelectedId: o,
-    expandedWidth: u = "230px",
-    companyName: f,
-    companySlogan: S,
-    urlIconPrefix: g = `${m}/${n}${P}`,
-    headerComponent: h,
-    footerComponent: D,
-    variant: v = "host"
-  } = r, M = C(() => T({ menuData: t ?? k(), moduleSelectedId: o }), [t, o]), b = _();
+    expandedWidth: c = "230px",
+    companyName: s,
+    companySlogan: u,
+    urlIconPrefix: f = "",
+    headerComponent: S,
+    footerComponent: g,
+    variant: h = "host"
+  } = r, D = B(() => I({ menuData: t ?? C(), moduleSelectedId: o }), [t, o]), M = k();
   return /* @__PURE__ */ e(
-    x,
+    b,
     {
       value: {
         // Propiedades y funciones proporcionadas a través del contexto
-        anchored: a,
-        visible: i,
-        onToggleAnchored: s,
-        onToggleVisible: p,
-        menuData: M,
+        anchored: m,
+        visible: a,
+        onToggleAnchored: n,
+        onToggleVisible: i,
+        menuData: D,
         onMenuItemClick: l,
-        companyLogoUrl: c,
+        companyLogoUrl: p,
         companyLogoSmallUrl: d,
         moduleSelectedId: o,
-        expandedWidth: u,
-        companyName: f,
-        companySlogan: S,
-        urlIconPrefix: g,
-        variant: v,
-        headerComponent: h,
-        footerComponent: D
+        expandedWidth: c,
+        companyName: s,
+        companySlogan: u,
+        urlIconPrefix: f,
+        variant: h,
+        headerComponent: S,
+        footerComponent: g
       },
-      children: b ? /* @__PURE__ */ e(I, {}) : /* @__PURE__ */ e(y, {})
+      children: M ? /* @__PURE__ */ e(x, {}) : /* @__PURE__ */ e(v, {})
     }
   );
 });
 export {
-  q as SideBar
+  V as SideBar
 };

package/components/SideBar/constants.js

@@ -1,19 +1,18 @@
-import { ContentComponentSlots as o, SideBarFooterSlots as t, HeaderSidebarSlots as S, ContentGroupsSlots as e, SideBarMobileSlots as n, SideBarDesktopSlots as _ } from "./slots/SideBarEnum.js";
-const E = "M4LSideBar", r = "/frontend/domain/microfrontends/", A = {
+import { ContentComponentSlots as o, SideBarFooterSlots as t, HeaderSidebarSlots as S, ContentGroupsSlots as e, SideBarMobileSlots as _, SideBarDesktopSlots as s } from "./slots/SideBarEnum.js";
+const n = "M4LSideBar", A = {
+  ...s,
   ..._,
-  ...n,
   ...e,
   ...S,
   ...t,
   ...o
-}, i = "is-root", C = "menu-active", c = "item-in-tree-active", d = "has-children", L = "item-closed";
+}, i = "is-root", r = "menu-active", C = "item-in-tree-active", c = "has-children", L = "item-closed";
 export {
   A as ALL_SIDEBAR_SLOTS,
-  d as CLASS_NAME_HAS_CHILDREN,
+  c as CLASS_NAME_HAS_CHILDREN,
   i as CLASS_NAME_IS_ROOT,
   L as CLASS_NAME_ITEM_CLOSED,
-  c as CLASS_NAME_ITEM_IN_TREE_ACTIVE,
-  C as CLASS_NAME_MENU_ACTIVE,
-  r as PATH_ICONS,
-  E as SIDEBAR_KEY_COMPONENT
+  C as CLASS_NAME_ITEM_IN_TREE_ACTIVE,
+  r as CLASS_NAME_MENU_ACTIVE,
+  n as SIDEBAR_KEY_COMPONENT
 };

package/components/SideBar/helpers/resolveMenuItemIconUrl.d.ts

@@ -1,5 +1,6 @@
+import { IconProps } from '@m4l/base';
 type ResolveMenuItemIconUrlOptions = {
-    iconUrl?: string | null;
+    iconUrl?: IconProps['src'] | null;
     urlIconPrefix?: string;
 };
 /**
@@ -8,6 +9,6 @@ type ResolveMenuItemIconUrlOptions = {
  * Backend menu payloads can still contain `null`, `undefined`, or their literal string forms.
  * Those values should behave as "no icon" instead of producing requests such as `.../api/v1null`.
  */
-export declare function resolveMenuItemIconUrl({ iconUrl, urlIconPrefix, }: ResolveMenuItemIconUrlOptions): string;
+export declare function resolveMenuItemIconUrl({ iconUrl, urlIconPrefix, }: ResolveMenuItemIconUrlOptions): string | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
 export {};
 //# sourceMappingURL=resolveMenuItemIconUrl.d.ts.map

package/components/SideBar/helpers/resolveMenuItemIconUrl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"resolveMenuItemIconUrl.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/SideBar/helpers/resolveMenuItemIconUrl.ts"],"names":[],"mappings":"AAAA,KAAK,6BAA6B,GAAG;IACnC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAMF;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,aAAkB,GACnB,EAAE,6BAA6B,UAgB/B"}
+{"version":3,"file":"resolveMenuItemIconUrl.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/SideBar/helpers/resolveMenuItemIconUrl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEtC,KAAK,6BAA6B,GAAG;IACnC,OAAO,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAMF;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,aAAkB,GACnB,EAAE,6BAA6B,uGAoB/B"}

package/components/SideBar/helpers/resolveMenuItemIconUrl.js

@@ -1,12 +1,14 @@
-function r(e) {
-  return /^(?:[a-z][a-z\d+\-.]*:|\/\/)/iu.test(e);
+function r(t) {
+  return /^(?:[a-z][a-z\d+\-.]*:|\/\/)/iu.test(t);
 }
 function u({
-  iconUrl: e,
-  urlIconPrefix: t = ""
+  iconUrl: t,
+  urlIconPrefix: n = ""
 }) {
-  const n = typeof e == "string" ? e.trim() : "";
-  return !n || n === "null" || n === "undefined" ? "" : r(n) ? n : `${t}${n}`;
+  if (t && typeof t != "string")
+    return t;
+  const e = typeof t == "string" ? t.trim() : "";
+  return !e || e === "null" || e === "undefined" ? "" : r(e) ? e : `${n}${e}`;
 }
 export {
   u as resolveMenuItemIconUrl

package/components/SideBar/slots/SideBarSlots.d.ts

@@ -34,7 +34,7 @@ export declare const ContainerAdornmentIconStyled: import('@emotion/styled').Sty
 export declare const BackgroundAdornmentIconStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
     ownerState?: (Partial<import('../types').SideBarOwnerState> & 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 ButtonAnchoredStyled: import('@emotion/styled').StyledComponent<Pick<Omit<import('../..').IconButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>, "color" | "content" | "translate" | "action" | "classes" | "children" | "className" | "sx" | "form" | "slot" | "style" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "component" | "name" | "size" | "instaceDataTestId" | "variant" | "src" | "tooltip" | "value" | "icon" | "selected" | "dataTestId" | "placement" | "rotationAngle" | "instanceDataTestId" | "disabled" | "ariaLabel" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "type" | "badgeProps" | keyof import('react').RefAttributes<HTMLButtonElement>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
+export declare const ButtonAnchoredStyled: import('@emotion/styled').StyledComponent<Pick<Omit<import('../..').IconButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>, "color" | "content" | "translate" | "action" | "classes" | "children" | "className" | "sx" | "form" | "slot" | "style" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "component" | "name" | "size" | "instaceDataTestId" | "type" | "variant" | "src" | "tooltip" | "value" | "icon" | "selected" | "dataTestId" | "placement" | "rotationAngle" | "instanceDataTestId" | "disabled" | "ariaLabel" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "badgeProps" | keyof import('react').RefAttributes<HTMLButtonElement>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
     ownerState?: (Partial<import('../types').SideBarOwnerState> & Record<string, unknown>) | undefined;
 }, {}, {}>;
 export declare const ContainerFooterStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {

package/components/SideBar/subcomponents/ContentComponent/style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SideBar/subcomponents/ContentComponent/style.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAErD,eAAO,MAAM,sBAAsB,EAAE,sBAmUpC,CAAC"}
+{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SideBar/subcomponents/ContentComponent/style.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAKrD,eAAO,MAAM,sBAAsB,EAAE,sBA0UpC,CAAC"}

package/components/SideBar/subcomponents/ContentComponent/style.js

@@ -1,7 +1,8 @@
 import { CLASS_NAME_IS_ROOT as r, CLASS_NAME_MENU_ACTIVE as a, CLASS_NAME_ITEM_IN_TREE_ACTIVE as t, CLASS_NAME_HAS_CHILDREN as p, CLASS_NAME_ITEM_CLOSED as s } from "../../constants.js";
+import { ICON_SVG_SHAPE_SELECTOR as d } from "@m4l/base";
 import { getTypographyStyles as i } from "../../../../utils/getTypographyStyles.js";
-import { getSizeStyles as d } from "../../../../utils/getSizeStyles/getSizeStyles.js";
-const c = {
+import { getSizeStyles as l } from "../../../../utils/getSizeStyles/getSizeStyles.js";
+const b = {
   /**
    * Estilos del contenedor principal del sidebar
    */
@@ -13,7 +14,7 @@ const c = {
     width: "100%",
     backgroundColor: e.vars.palette.background.default,
     '& [class*="M4LMenuItem-root"]': {
-      ...d(
+      ...l(
         e,
         o?.size || "medium",
         "action",
@@ -123,6 +124,13 @@ const c = {
       },
       "&:not(.item-in-tree-active) > .M4LSideBar-wrapperMenuItem .M4LSideBar-backgroundAdornmentIcon .M4LIcon-root .M4LIcon-icon": {
         backgroundColor: `${e.vars.palette.text.primary}!important`
+      },
+      "&:not(.item-in-tree-active) > .M4LSideBar-wrapperMenuItem .M4LSideBar-backgroundAdornmentIcon .M4LIcon-root .MuiSvgIcon-root": {
+        color: `${e.vars.palette.text.primary}!important`,
+        [d]: {
+          fill: `${e.vars.palette.text.primary}!important`,
+          stroke: "none"
+        }
       }
       /*  '& > .MuiCollapse-root': {
         paddingRight: theme.vars.size.baseSpacings['sp0-5'],
@@ -271,5 +279,5 @@ const c = {
   })
 };
 export {
-  c as contentComponentStyles
+  b as contentComponentStyles
 };

package/components/SideBar/subcomponents/TreeGroupItems/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SideBar/subcomponents/TreeGroupItems/styles.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAClD,eAAO,MAAM,kBAAkB,EAAE,mBAiMhC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/SideBar/subcomponents/TreeGroupItems/styles.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAkBlD,eAAO,MAAM,kBAAkB,EAAE,mBAkMhC,CAAC"}