@m4l/components 9.2.56 → 9.2.58-beta.1

package/components/ScrollBar/index.js

@@ -0,0 +1 @@
+

package/components/ScrollBar/slots/ScrollBarSlots.d.ts

@@ -1,6 +1,3 @@
-export declare const RootScrollBar: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').ScrollBarProps> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').ScrollBarProps> & Record<string, unknown>;
+export declare const ScrollbarRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState?: (Partial<import('../types').ScrollBarOwnerState> & 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 SimpleBarStyled: import('@emotion/styled').StyledComponent<Pick<import('simplebar-react').Props & import('react').RefAttributes<import('simplebar-core').default | null>, keyof import('simplebar-react').Props | keyof import('react').RefAttributes<import('simplebar-core').default | null>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').ScrollBarProps> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').ScrollBarProps> & Record<string, unknown>;
-}, {}, {}>;

package/components/ScrollBar/slots/ScrollBarSlots.js

@@ -1,17 +1,11 @@
 import { styled } from "@mui/material/styles";
-import SimpleBarReact from "simplebar-react";
-import { S as SCROLL_KEY_COMPONENT } from "../constants.js";
-import { S as ScrollBarSlots } from "./ScrollBarEnum.js";
+import { S as ScrollbarSlots } from "./ScrollbarEnum.js";
+import { a as SCROLL_BAR_KEY_COMPONENTS } from "../constants.js";
 import { s as scrollBarStyles } from "../ScrollBar.styles.js";
-const RootScrollBar = styled("div", {
-  name: SCROLL_KEY_COMPONENT,
-  slot: ScrollBarSlots.root
-})(scrollBarStyles?.root);
-const SimpleBarStyled = styled(SimpleBarReact, {
-  name: SCROLL_KEY_COMPONENT,
-  slot: ScrollBarSlots.scrollBar
-})(scrollBarStyles?.scrollBar);
+const ScrollbarRootStyled = styled("div", {
+  name: SCROLL_BAR_KEY_COMPONENTS,
+  slot: ScrollbarSlots.root
+})(scrollBarStyles.root);
 export {
-  RootScrollBar as R,
-  SimpleBarStyled as S
+  ScrollbarRootStyled as S
 };

package/components/ScrollBar/slots/ScrollbarEnum.d.ts

@@ -0,0 +1,3 @@
+export declare enum ScrollbarSlots {
+    root = "root"
+}

package/components/ScrollBar/slots/ScrollbarEnum.js

@@ -0,0 +1,7 @@
+var ScrollbarSlots = /* @__PURE__ */ ((ScrollbarSlots2) => {
+  ScrollbarSlots2["root"] = "root";
+  return ScrollbarSlots2;
+})(ScrollbarSlots || {});
+export {
+  ScrollbarSlots as S
+};

package/components/ScrollBar/types.d.ts

@@ -1,49 +1,30 @@
-import { SxProps, Theme } from '@mui/material';
 import { ReactNode } from 'react';
-import { Props as SimpleProps } from 'simplebar-react';
-import { SCROLL_KEY_COMPONENT } from './constants';
-import { OverridesStyleRules } from '@mui/material/styles/overrides';
-import { ScrollBarSlots } from './slots';
-/**
- * Props for the ScrollBar component.
- */
-export interface ScrollBarProps extends SimpleProps {
+import { ScrollbarSlots } from './slots/ScrollbarEnum';
+import { SCROLL_BAR_KEY_COMPONENTS } from './constants';
+import { Theme } from '@mui/material';
+import { M4LOverridesStyleRules } from '../../@types/augmentations';
+export interface ScrollBarProps {
     /**
-     * The content of the ScrollBar.
+     * ScrollBar children
      */
     children: ReactNode;
     /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
+     * ScrollBar hide tracks
+     * @deprecated
      */
-    sx?: SxProps;
+    autoHide?: boolean;
     /**
-     * The orientation of the ScrollBar.
-     * @default 'vertical'
+     * ScrollBar overflowX
      */
-    orientation?: 'vertical' | 'horizontal';
+    overflowX?: boolean;
     /**
-     * The class name of the ScrollBar.
+     * ScrollBar overflowY
      */
-    className?: string;
-    /**
-     * The data-testid attribute for testing purposes.
-     */
-    dataTestId?: string;
+    overflowY?: boolean;
+}
+export type ScrollBarSlotsType = keyof typeof ScrollbarSlots;
+export interface ScrollBarOwnerState {
+    overflowX: ScrollBarProps['overflowX'];
+    overflowY: ScrollBarProps['overflowY'];
 }
-/**
- * The owner state for the ScrollBar component.
- */
-export type ownerState = ScrollBarProps;
-/**
- * The owner state for the ScrollBar component.
- * @deprecated This type is redundant and can be removed.
- */
-export type ScrollBarOwnerState = ScrollBarProps & {};
-/**
- * The type for the ScrollBar slots.
- */
-export type ScrollBarSlotsType = keyof typeof ScrollBarSlots;
-/**
- * The styles for the ScrollBar component.
- */
-export type ScrollBarStyles = OverridesStyleRules<ScrollBarSlots, typeof SCROLL_KEY_COMPONENT, Theme>;
+export type ScrollBarStyles = M4LOverridesStyleRules<ScrollBarSlotsType, typeof SCROLL_BAR_KEY_COMPONENTS, Theme>;

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

@@ -1,51 +1,51 @@
-export declare const ContainerDesktopRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerDesktopRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState?: (Partial<import('../types').SideBarOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, keyof import('react').HTMLAttributes<HTMLElement> | keyof import('react').ClassAttributes<HTMLElement>>, {}>;
-export declare const ContainerDesktopContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerDesktopContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerBtnAnchoredStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerBtnAnchoredStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerContentGroupsRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerContentGroupsRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState?: (Partial<import('../types').SideBarOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, keyof import('react').HTMLAttributes<HTMLElement> | keyof import('react').ClassAttributes<HTMLElement>>, {}>;
-export declare const ContainerContentGroupsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerContentGroupsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState?: (Partial<import('../types').SideBarOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, keyof import('react').HTMLAttributes<HTMLElement> | keyof import('react').ClassAttributes<HTMLElement>>, {}>;
-export declare const ContainerContentTitleStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerContentTitleStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerContentNavItemsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerContentNavItemsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState?: (Partial<import('../types').SideBarOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, keyof import('react').HTMLAttributes<HTMLElement> | keyof import('react').ClassAttributes<HTMLElement>>, {}>;
-export declare const ContainerContentItemStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerContentItemStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerArrowIconRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerArrowIconRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerHeaderSidebarRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerHeaderSidebarRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState?: (Partial<import('../types').SideBarOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, keyof import('react').HTMLAttributes<HTMLElement> | keyof import('react').ClassAttributes<HTMLElement>>, {}>;
-export declare const ContainerTitleSubtitleStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerTitleSubtitleStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerFooterStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerFooterStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerSideBarMobileStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerSideBarMobileStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContentComponentRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContentComponentRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContentComponentHideStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContentComponentHideStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerComponentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerComponentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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 ContainerMenuItemsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').SideBarOwnerState> & Record<string, unknown> & {
-    ownerState: Partial<import('../types').SideBarOwnerState> & Record<string, unknown>;
+export declare const ContainerMenuItemsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').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>>, {}>;

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

@@ -1,2 +1,2 @@
-import { SideBarStyles } from '../../types';
-export declare const contentComponentStyles: SideBarStyles;
+import { ContentComponentStyles } from '../../types';
+export declare const contentComponentStyles: ContentComponentStyles;

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

@@ -4,11 +4,11 @@ const contentComponentStyles = {
    */
   contentComponentRoot: ({ theme }) => ({
     position: "relative",
-    display: "grid",
     height: "100%",
-    gridTemplateRows: "auto 1fr auto",
     width: "auto",
-    backgroundColor: theme.vars.palette.background.default
+    backgroundColor: theme.vars.palette.background.default,
+    display: "flex",
+    flexDirection: "column"
   }),
   /**
    * Estilos del contenedor que oculta el contenido cuando se encuentra des anclado.
@@ -18,11 +18,12 @@ const contentComponentStyles = {
     height: "100%",
     overflow: "hidden",
     transition: "all 0.5s",
-    ...!ownerState.anchored && {
-      width: ownerState?.anchored && ownerState.isDesktop ? ownerState.expandedWidth : !ownerState.isDesktop ? "100%" : theme.vars.size.baseSpacings.sp4,
+    flex: 1,
+    ...!ownerState?.anchored && {
+      width: ownerState?.anchored && ownerState?.isDesktop ? ownerState?.expandedWidth : !ownerState?.isDesktop ? "100%" : theme.vars.size.baseSpacings.sp4,
       "&:hover": {
         transition: "all 0.5s",
-        width: ownerState.expandedWidth,
+        width: ownerState?.expandedWidth,
         contentVisibility: "visible",
         '& [class*="containerFooter"]': {
           borderWidth: theme.vars.size.baseSpacings["sp0-5"]
@@ -35,7 +36,9 @@ const contentComponentStyles = {
    */
   containerComponent: ({ ownerState }) => ({
     height: "100%",
-    width: ownerState.expandedWidth
+    width: ownerState?.expandedWidth,
+    display: "flex",
+    flexDirection: "column"
   })
 };
 export {

package/components/SideBar/subcomponents/ContentGroups/index.js

@@ -17,10 +17,10 @@ const ContentGroups = (contentGroupsProps) => {
     noItems: menuData.length === 0
   };
   const renderTitle = (title) => {
-    return /* @__PURE__ */ jsx(ContainerContentTitleStyled, { ownerState: {}, children: /* @__PURE__ */ jsx(Typography, { variant: "bodyDens", skeletonWidth: "100px", children: title }) });
+    return /* @__PURE__ */ jsx(ContainerContentTitleStyled, { children: /* @__PURE__ */ jsx(Typography, { variant: "bodyDens", skeletonWidth: "100px", children: title }) });
   };
   const renderItems = (item) => {
-    return /* @__PURE__ */ jsx(ContainerContentNavItemsStyled, { ownerState: {}, children: item?.map((list) => /* @__PURE__ */ jsx(ContainerMenuItemsMain, { item: list, openSubItem: true, size: currentSize }, list.title)) });
+    return /* @__PURE__ */ jsx(ContainerContentNavItemsStyled, { children: item?.map((list) => /* @__PURE__ */ jsx(ContainerMenuItemsMain, { item: list, openSubItem: true, size: currentSize }, list.title)) });
   };
   const renderItemsDisabled = () => {
     return /* @__PURE__ */ jsx(ContainerContentTitleStyled, { ownerState: { disabled: true }, children: /* @__PURE__ */ jsx(
@@ -39,7 +39,7 @@ const ContentGroups = (contentGroupsProps) => {
       ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("content-groups") } : {},
       children: menuData.length > 0 ? menuData.map((itemGroup) => (
         /* Render title section in menusidebar */
-        /* @__PURE__ */ jsxs(ContainerContentGroupsStyled, { ownerState: {}, children: [
+        /* @__PURE__ */ jsxs(ContainerContentGroupsStyled, { children: [
           renderTitle(itemGroup.title),
           renderItems(itemGroup.children)
         ] }, itemGroup.title)

package/components/SideBar/subcomponents/ContentGroups/styles.d.ts

@@ -1,2 +1,2 @@
-import { SideBarStyles } from '../../types';
-export declare const contentGroupStyles: SideBarStyles;
+import { ContentGroupsStyles } from '../../types';
+export declare const contentGroupStyles: ContentGroupsStyles;

package/components/SideBar/subcomponents/ContentGroups/styles.js

@@ -10,7 +10,7 @@ const contentGroupStyles = {
     overflowY: "auto",
     padding: `${theme.vars.size.baseSpacings.sp3} 0px 0px 0px`,
     alignItems: "center",
-    justifyContent: ownerState.noItems ? "center" : "flex-start"
+    justifyContent: ownerState?.noItems ? "center" : "flex-start"
   }),
   /**
    * Wrapper for every principal item group in the sidebar
@@ -18,8 +18,11 @@ const contentGroupStyles = {
   containerContentGroups: ({ theme }) => ({
     display: "flex",
     width: "100%",
+    height: "100%",
     flexDirection: "column",
-    padding: `${theme.vars.size.baseSpacings.sp3} 0px`
+    padding: `${theme.vars.size.baseSpacings.sp3} 0px`,
+    flex: 1,
+    overflow: "auto"
   }),
   /**
    * Title wrapper for every principal item group in the sidebar
@@ -29,7 +32,7 @@ const contentGroupStyles = {
     color: theme.vars.palette.text.primary,
     textAlign: "left",
     "& .MuiTypography-root": {
-      color: !ownerState.disabled ? theme.vars.palette.text.primary : `${theme.vars.palette.text.primary} !important`
+      color: !ownerState?.disabled ? theme.vars.palette.text.primary : `${theme.vars.palette.text.primary} !important`
     }
   }),
   /**
@@ -52,6 +55,15 @@ const contentGroupStyles = {
     alignItems: "center",
     cursor: "pointer",
     padding: theme.spacing(0.5)
+  }),
+  /**
+   *Style para el contenedor del icono de flecha que indica si el item está colapsado o descolapsado para los items padres
+   */
+  containerArrowIconRoot: () => ({
+    display: "flex",
+    alignSelf: "center",
+    lineHeight: 0,
+    marginLeft: "auto"
   })
 };
 export {

package/components/SideBar/subcomponents/ContentGroups/subcomponents/ContainerMenuItemsMain/styles.d.ts

@@ -1,2 +1,2 @@
-import { SideBarStyles } from '../../../../types';
-export declare const containerMenuItemsMainStyles: SideBarStyles;
+import { ContainerMenuItemsMainStyles } from '../../../../types';
+export declare const containerMenuItemsMainStyles: ContainerMenuItemsMainStyles;

package/components/SideBar/subcomponents/ContentGroups/subcomponents/ContainerMenuItemsMain/styles.js

@@ -11,7 +11,7 @@ const containerMenuItemsMainStyles = {
     gap: theme.vars.size.baseSpacings["sp0-5"],
     ...getHeightSizeStyles(
       theme.generalSettings.isMobile,
-      ownerState.size || "medium",
+      ownerState?.size || "medium",
       "container",
       (height) => {
         return {
@@ -40,15 +40,6 @@ const containerMenuItemsMainStyles = {
       flexDirection: "column",
       gap: theme.vars.size.baseSpacings["sp0-5"]
     }
-  }),
-  /**
-   *Style para el contenedor del icono de flecha que indica si el item está colapsado o descolapsado para los items padres
-   */
-  containerArrowIconRoot: () => ({
-    display: "flex",
-    alignSelf: "center",
-    lineHeight: 0,
-    marginLeft: "auto"
   })
 };
 export {

package/components/SideBar/subcomponents/ContentGroups/subcomponents/ContainerMenuItemsMain/subcomponents/ArrowIcon/index.js

@@ -11,7 +11,6 @@ function ArrowIcon(props) {
   return /* @__PURE__ */ jsx(
     ContainerArrowIconRootStyled,
     {
-      ownerState: {},
       ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("arrowIconRoot") } : {},
       children: /* @__PURE__ */ jsx(
         IconButton,

package/components/SideBar/subcomponents/FooterSidebar/styles.d.ts

@@ -1,2 +1,2 @@
-import { SideBarStyles } from '../../types';
-export declare const footerSideBarStyles: SideBarStyles;
+import { SideBarFooterStyles } from '../../types';
+export declare const footerSideBarStyles: SideBarFooterStyles;

package/components/SideBar/subcomponents/HeaderSidebar/index.js

@@ -3,7 +3,7 @@ import { k as ContainerHeaderSidebarRootStyled, l as ContainerTitleSubtitleStyle
 import { T as Typography } from "../../../mui_extended/Typography/Typography.js";
 import { I as Image } from "../../../Image/Image.js";
 const HeaderSidebar = ({ srcIcon, title, subtitle }) => {
-  return /* @__PURE__ */ jsxs(ContainerHeaderSidebarRootStyled, { ownerState: {}, role: "heading", children: [
+  return /* @__PURE__ */ jsxs(ContainerHeaderSidebarRootStyled, { role: "heading", children: [
     /* @__PURE__ */ jsx(
       Image,
       {
@@ -14,7 +14,7 @@ const HeaderSidebar = ({ srcIcon, title, subtitle }) => {
       },
       "Logo"
     ),
-    /* @__PURE__ */ jsxs(ContainerTitleSubtitleStyled, { ownerState: {}, children: [
+    /* @__PURE__ */ jsxs(ContainerTitleSubtitleStyled, { children: [
       /* @__PURE__ */ jsx(Typography, { variant: "subtitleDens", size: "medium", skeletonWidth: 120, children: title }),
       /* @__PURE__ */ jsx(Typography, { variant: "paragraph", size: "medium", margin: 0, skeletonWidth: 150, children: subtitle })
     ] })

package/components/SideBar/subcomponents/HeaderSidebar/styles.d.ts

@@ -1,2 +1,2 @@
-import { SideBarStyles } from '../../types';
-export declare const headerSidebarStyles: SideBarStyles;
+import { HeaderSidebarStyles } from '../../types';
+export declare const headerSidebarStyles: HeaderSidebarStyles;

package/components/SideBar/subcomponents/SideBarDesktop/styles.d.ts

@@ -1,2 +1,2 @@
-import { SideBarStyles } from '../../types';
-export declare const sideBarDesktopStyles: SideBarStyles;
+import { SideBarDesktopStyles } from '../../types';
+export declare const sideBarDesktopStyles: SideBarDesktopStyles;

package/components/SideBar/subcomponents/SideBarDesktop/styles.js

@@ -5,7 +5,7 @@ const sideBarDesktopStyles = {
    * sin que se oculte por el overflow hidden que tiene el contenido del sidebar
    */
   containerDesktopContent: ({ theme, ownerState }) => {
-    const width = ownerState?.anchored ? ownerState.expandedWidth : theme.vars.size.baseSpacings.sp4;
+    const width = ownerState?.anchored ? ownerState?.expandedWidth : theme.vars.size.baseSpacings.sp4;
     return {
       height: "100%",
       position: "relative",
@@ -22,7 +22,7 @@ const sideBarDesktopStyles = {
     width: "fit-content",
     overflow: "visible",
     borderRight: `1px solid ${theme.vars.palette.border.default}`,
-    position: !ownerState.anchored ? "absolute" : "relative",
+    position: !ownerState?.anchored ? "absolute" : "relative",
     inset: 0,
     //add hover effect
     zIndex: 999

package/components/SideBar/subcomponents/SideBarMobile/index.js

@@ -23,7 +23,6 @@ const SideBarMobile = () => {
       children: /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
         ContainerSideBarMobileStyled,
         {
-          ownerState: {},
           ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("contentMobile") } : {},
           children: /* @__PURE__ */ jsx(ContentComponent, {})
         }

package/components/SideBar/subcomponents/SideBarMobile/styles.d.ts

@@ -1,2 +1,2 @@
-import { SideBarStyles } from '../../types';
-export declare const sideBarMobileStyles: SideBarStyles;
+import { SideBarMobileStyles } from '../../types';
+export declare const sideBarMobileStyles: SideBarMobileStyles;

package/components/SideBar/types.d.ts

@@ -1,8 +1,8 @@
 import { Sizes } from '@m4l/styles';
 import { ContainerMenuItemsMainSlots, ContentComponentSlots, ContentGroupsSlots, HeaderSidebarSlots, SideBarDesktopSlots, SideBarFooterSlots, SideBarMobileSlots } from './slots/SideBarEnum';
-import { OverridesStyleRules } from '@mui/material/styles/overrides';
 import { SIDEBAR_KEY_COMPONENT } from './constants';
 import { Theme } from '@mui/material/styles';
+import { M4LOverridesStyleRules } from '../../@types/augmentations';
 /**
  * define la estructura de datos para un elemento de menú en la barra lateral.
  */
@@ -88,4 +88,11 @@ export type SideBarSlotsType = ContainerMenuItemsMainSlots | SideBarDesktopSlots
 export type SideBarOwnerState = Pick<IMenuDataWithState, 'active' | 'itemInTreeActive'> & {
     [key: string]: any;
 };
-export type SideBarStyles = Partial<OverridesStyleRules<SideBarSlotsType, typeof SIDEBAR_KEY_COMPONENT, Theme> | undefined> | undefined;
+export type SideBarStyles = M4LOverridesStyleRules<SideBarSlotsType, typeof SIDEBAR_KEY_COMPONENT, Theme>;
+export type ContainerMenuItemsMainStyles = M4LOverridesStyleRules<ContainerMenuItemsMainSlots, typeof SIDEBAR_KEY_COMPONENT, Theme>;
+export type SideBarDesktopStyles = M4LOverridesStyleRules<SideBarDesktopSlots, typeof SIDEBAR_KEY_COMPONENT, Theme>;
+export type ContentGroupsStyles = M4LOverridesStyleRules<ContentGroupsSlots, typeof SIDEBAR_KEY_COMPONENT, Theme>;
+export type HeaderSidebarStyles = M4LOverridesStyleRules<HeaderSidebarSlots, typeof SIDEBAR_KEY_COMPONENT, Theme>;
+export type SideBarFooterStyles = M4LOverridesStyleRules<SideBarFooterSlots, typeof SIDEBAR_KEY_COMPONENT, Theme>;
+export type SideBarMobileStyles = M4LOverridesStyleRules<SideBarMobileSlots, typeof SIDEBAR_KEY_COMPONENT, Theme>;
+export type ContentComponentStyles = M4LOverridesStyleRules<ContentComponentSlots, typeof SIDEBAR_KEY_COMPONENT, Theme>;

package/components/WindowBase/WindowBase.js

@@ -7,14 +7,14 @@ import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import clsx from "clsx";
 import { H as HeaderWindowBase } from "./subcomponents/Header/HeaderWindowBase.js";
 import { E as EditionInfo } from "./subcomponents/EditionInfo/EditionInfo.js";
-import { W as WindowBaseStyled, C as ContentWindowStyled, L as LinearProgressIndeterminateStyled } from "./slots/WindowBaseSlots.js";
+import { W as WindowBaseStyled, T as ToastContainerStyled, C as ContentWindowStyled, L as LinearProgressIndeterminateStyled } from "./slots/WindowBaseSlots.js";
 import { W as WindowBaseSlots } from "./slots/WindowBaseEnum.js";
-import { T as ToastContainer } from "../ToastContainer/ToastContainer.js";
 const WindowBase = (props) => {
   const {
     children,
     size = "medium",
     selected = false,
+    maximized,
     variant = "outlined",
     version,
     buildTime,
@@ -25,14 +25,17 @@ const WindowBase = (props) => {
     windowId,
     onMouseDown,
     editionInfo,
+    type = "layout",
     ...other
   } = props;
   const { currentSize } = useComponentSize(size);
-  const normalizedSize = currentSize === "large" ? "medium" : currentSize;
+  const computedVariant = maximized ? "text" : variant;
   const ownerState = {
     selected,
-    variant,
-    size: normalizedSize
+    variant: computedVariant,
+    size: currentSize,
+    type,
+    maximized
   };
   return /* @__PURE__ */ jsx(AppearanceComponentProvider, { defaultSize: currentSize, children: /* @__PURE__ */ jsxs(
     WindowBaseStyled,
@@ -49,12 +52,15 @@ const WindowBase = (props) => {
             version,
             buildTime,
             size,
+            variant,
             selected,
+            maximized,
             onClose,
+            type,
             ...other
           }
         ),
-        /* @__PURE__ */ jsx(ToastContainer, { fixed: false, position: "top-right", containerId: windowId }),
+        /* @__PURE__ */ jsx(ToastContainerStyled, { fixed: false, position: "top-right", containerId: windowId }),
         editionInfo && /* @__PURE__ */ jsx(EditionInfo, { editionInfo }),
         /* @__PURE__ */ jsx(
           ContentWindowStyled,
@@ -64,7 +70,7 @@ const WindowBase = (props) => {
             children
           }
         ),
-        isLoading && /* @__PURE__ */ jsx(LinearProgressIndeterminateStyled, { ownerState: {} })
+        isLoading && /* @__PURE__ */ jsx(LinearProgressIndeterminateStyled, {})
       ]
     }
   ) });