@m4l/components 9.1.9 → 9.1.10

package/components/SideBar/types.d.ts

@@ -1,59 +1,56 @@
-import { getSideBarClassesByState } from './classes/index';
-/**
- * Propiedades para el componente que contiene el logo.
- */
-export interface LogoConainerProps {
-    collapsed: boolean;
-}
-/**
- * Propiedades para el componente WrapperSideBar.
- */
-export interface WrapperSideBarProps {
-    /**  Indica si la barra lateral está visible.*/
-    visible: boolean;
-}
+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';
 /**
  * define la estructura de datos para un elemento de menú en la barra lateral.
+ * @createdAt 2024-11-01 10:51:01 - automatic
  */
-export interface MenuDataType {
+export interface MenuDataType extends Record<string, any> {
     title: string;
-    icon_url?: string;
-    module_id?: string;
+    iconUrl?: string;
+    moduleId?: string;
     path?: string;
-    /** Puerto de depuración asociado al elemento de menú.*/
-    debug_port?: number;
-    /** Subelementos de menú.*/
+    debugPort?: number;
     children?: Array<MenuDataType>;
 }
 /**
  * Propiedades para el componente SideBar.
+ * @createdAt 2024-11-01 10:51:01 - automatic
  */
 export interface SideBarProps {
-    /** Datos del menú de la barra lateral.*/
-    menuData: Array<MenuDataType>;
-    /** Función manejadora del clic en un elemento de la barra lateral.*/
-    onClick: (item: MenuDataType) => void;
-    /** Función para determinar si un elemento de la barra lateral está activo.*/
-    isItemActive: (item: MenuDataType) => boolean;
-    /** Función para alternar el estado colapsado de la barra lateral.*/
-    onToggleCollapse: VoidFunction;
-    /** Función para alternar la visibilidad de la barra lateral.*/
-    onToggleVisible: VoidFunction;
-    /** Indica si la barra lateral está colapsada.*/
-    collapsed: boolean;
-    /**  Indica si la barra lateral está visible.*/
+    menuData?: Array<MenuDataType>;
+    anchored: boolean;
     visible: boolean;
     companyLogoSmallUrl?: string;
     companyLogoNormalUrl?: string;
     expandedWidth?: string | number;
     companyName?: string;
+    companySlogan?: string;
     variantStyle?: 'variantDefault' | 'variantComercial';
+    moduleSelectedId?: string;
+    onMenuItemClick: (item: MenuDataType) => void;
+    onToggleAnchored: (anchored: boolean) => void;
+    onToggleVisible: (visible: boolean) => void;
+    /**
+     * Tamaño del componente, puede ser uno de los valores definidos en 'small' , 'medium'
+     */
+    size?: Extract<Sizes, 'small' | 'medium'>;
 }
 /**
- * Tipo que representa las clases CSS generadas por el estado de la barra lateral.
+ * Interface que representa el estado de un elemento de menú en la barra lateral.
  */
-export type Classes = ReturnType<typeof getSideBarClassesByState>;
+export interface IMenuDataWithState extends MenuDataType {
+    active?: boolean;
+    itemInTreeActive?: boolean;
+    children?: Array<IMenuDataWithState>;
+}
 /**
- * Tipo que representa el estado de la barra lateral con propiedades 'collapsed' y 'visible'.
+ * OwnerState con las propiedades de estado del sideBar
  */
-export type SideBarState = Pick<SideBarProps, 'collapsed' | 'visible' | 'variantStyle'>;
+export type SideBarSlotsType = ContainerMenuItemsMainSlots | SideBarDesktopSlots | ContentGroupsSlots | HeaderSidebarSlots | SideBarFooterSlots | SideBarMobileSlots | ContentComponentSlots;
+export type SideBarOwnerState = Pick<IMenuDataWithState, 'active' | 'itemInTreeActive'> & {
+    [key: string]: any;
+};
+export type SideBarStyles = Partial<OverridesStyleRules<SideBarSlotsType, typeof SIDEBAR_KEY_COMPONENT, Theme> | undefined> | undefined;

package/components/ToastContainer/slots/toastContainerSlots.d.ts

@@ -1,15 +1,15 @@
 export declare const RootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown> & {
     ownerState: Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown>;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const MessageRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown> & {
     ownerState: Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown>;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const MessageHeaderStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown> & {
     ownerState: Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown>;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const MessageIconRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown> & {
     ownerState: Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown>;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const MessageIconStyled: import('@emotion/styled').StyledComponent<Pick<import('../../Icon').IconProps, keyof import('../../Icon').IconProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown> & {
     ownerState: Partial<import('../types').ToastContainerOwnerState> & Record<string, unknown>;
 }, {}, {}>;

package/components/WindowBase/WindowBase.d.ts

@@ -0,0 +1,11 @@
+import { WindowBaseProps } from './types';
+/**
+ * Base Window Component.
+ * This component provides a basic structure for a modal window.
+ * It uses hooks like `useModal` and utility style classes.
+ * @author cesar - automatic
+ * @createdAt 2024-11-15 18:08:44 - automatic
+ * @updatedAt 2024-11-29 14:22:50 - automatic
+ * @updatedUser cesar - automatic
+ */
+export declare const WindowBase: (props: WindowBaseProps) => import("react/jsx-runtime").JSX.Element;

package/components/WindowBase/WindowBase.js

@@ -0,0 +1,63 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { A as AppearanceComponentProvider } from "../../contexts/AppearanceComponentContext/AppearanceComponentContext.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { W as WINDOW_BASE_KEY_COMPONENT } from "./constants.js";
+import { g as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
+import clsx from "clsx";
+import { u as useComponentSize } from "../../hooks/useComponentSize/useComponentSize.js";
+import { W as WindowBaseStyled, H as HeaderWindowStyled, C as ContentWindowStyled } from "./slots/WindowBaseSlots.js";
+import { W as WindowBaseSlots } from "./slots/WindowBaseEnum.js";
+const WindowBase = (props) => {
+  const {
+    children,
+    size = "medium",
+    color = "default",
+    selected = false,
+    variant = "outlined",
+    version,
+    dataTestId,
+    onClose,
+    ...other
+  } = props;
+  const { currentSize } = useComponentSize(size);
+  const normalizedSize = currentSize === "large" ? "medium" : currentSize;
+  const ownerState = {
+    windowBaseColor: color,
+    windowBaseSelected: selected,
+    windowBaseVariant: variant,
+    windowBaseSize: normalizedSize
+  };
+  return /* @__PURE__ */ jsx(AppearanceComponentProvider, { defaultSize: currentSize, children: /* @__PURE__ */ jsxs(
+    WindowBaseStyled,
+    {
+      className: clsx(getComponentSlotRoot(WINDOW_BASE_KEY_COMPONENT)),
+      ...getPropDataTestId(WINDOW_BASE_KEY_COMPONENT, WindowBaseSlots.wrapperWindowBase, dataTestId),
+      ownerState,
+      children: [
+        /* @__PURE__ */ jsx(
+          HeaderWindowStyled,
+          {
+            ...getPropDataTestId(WINDOW_BASE_KEY_COMPONENT, WindowBaseSlots.headerContentWindowBase, dataTestId),
+            version,
+            size,
+            ownerState,
+            selected,
+            onClose,
+            ...other
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ContentWindowStyled,
+          {
+            ...getPropDataTestId(WINDOW_BASE_KEY_COMPONENT, WindowBaseSlots.contentWindowBase, dataTestId),
+            ownerState,
+            children
+          }
+        )
+      ]
+    }
+  ) });
+};
+export {
+  WindowBase as W
+};

package/components/WindowBase/WindowBase.styles.d.ts

@@ -0,0 +1,9 @@
+import { WindowBaseStyles } from './types';
+/**
+ * Calcula la altura del header de la ventana base.
+ * @author cesar - automatic
+ * @createdAt 2024-11-18 11:10:16 - automatic
+ * @updatedAt 2024-11-21 09:46:45 - automatic
+ * @updatedUser cesar - automatic
+ */
+export declare const windowBaseStyles: WindowBaseStyles;

package/components/WindowBase/WindowBase.styles.js

@@ -0,0 +1,204 @@
+const windowBaseStyles = {
+  /**
+   * Styles for the window base wrapper component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-15 18:08:44 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  wrapperWindowBase: ({ theme, ownerState }) => ({
+    height: "100%",
+    width: "100%",
+    borderRadius: theme.vars.size.borderRadius.r1,
+    ...ownerState?.windowBaseVariant === "outlined" && {
+      border: theme.vars.size.borderStroke.container,
+      ...ownerState?.windowBaseSelected ? {
+        borderColor: theme.vars.palette.border.main
+      } : {
+        borderColor: theme.vars.palette.border.default
+      }
+    },
+    backgroundColor: theme.vars.palette.background.default
+  }),
+  //
+  /**
+   * Styles for the content of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-15 18:08:44 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  contentWindowBase: ({ theme }) => ({
+    padding: theme.vars.size.baseSpacings.sp3
+  }),
+  /**
+   * Styles for the header of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-15 18:08:44 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  headerWindowComponent: ({ theme, ownerState }) => ({
+    width: "100%",
+    display: "flex",
+    padding: theme.vars.size.baseSpacings.sp1,
+    alignItems: "center",
+    justifyContent: "space-between",
+    flexShrink: 0,
+    alignSelf: "stretch",
+    ...theme.generalSettings.isMobile ? {
+      ...ownerState.windowBaseSize === "small" && {
+        height: theme.vars.size.mobile.small.container
+      },
+      ...ownerState.windowBaseSize === "medium" && {
+        height: theme.vars.size.mobile.medium.container
+      }
+    } : {
+      ...ownerState.windowBaseSize === "small" && {
+        height: theme.vars.size.desktop.small.container
+      },
+      ...ownerState.windowBaseSize === "medium" && {
+        height: theme.vars.size.desktop.medium.container
+      }
+    },
+    ...ownerState?.windowBaseSelected ? {
+      background: theme.vars.palette[ownerState?.windowBaseColor ?? "default"].selectedOpacity
+    } : {
+      background: theme.vars.palette[ownerState?.windowBaseColor ?? "default"].opacity
+    }
+  }),
+  /**
+   * Styles for the content of the header of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-15 18:08:44 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  headerContentWindowBase: ({ theme }) => ({
+    display: "flex",
+    alignItems: "center",
+    paddingLeft: theme.vars.size.baseSpacings.sp1,
+    paddingRight: theme.vars.size.baseSpacings.sp1,
+    color: theme.vars.palette.text.primary,
+    gap: theme.vars.size.baseSpacings.sp0
+  }),
+  /**
+   * Styles for the title of the header of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-15 18:08:44 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  headerTitleWindowBase: ({ theme }) => ({
+    width: "auto",
+    color: theme.vars.palette.text.primary,
+    fontWeight: `${theme.typography.fontWeightBold} !important`
+  }),
+  /**
+   * Styles for the subtitle container of the header of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-15 18:08:44 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  subtitleContainer: ({ theme }) => ({
+    display: "flex",
+    alignItems: "center",
+    color: theme.vars.palette.text.primary
+  }),
+  /**
+   * Styles for the dot window base component.
+   * @param theme The theme object.
+   * @param ownerState The owner state object.
+   * @returns An object containing the styles for the dot window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-22 19:40:23 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  pointWindowBase: ({ theme, ownerState }) => ({
+    display: "flex",
+    alignItems: "center",
+    color: theme.vars.palette.text.primary,
+    ...theme.generalSettings.isMobile ? {
+      ...ownerState.windowBaseSize === "small" && {
+        height: theme.vars.size.mobile.small.base
+      },
+      ...ownerState.windowBaseSize === "medium" && {
+        height: theme.vars.size.mobile.medium.base
+      }
+    } : {
+      ...ownerState.windowBaseSize === "small" && {
+        height: theme.vars.size.desktop.small.base
+      },
+      ...ownerState.windowBaseSize === "medium" && {
+        height: theme.vars.size.desktop.medium.base
+      }
+    }
+  }),
+  /**
+   * Styles for the subtitle of the header of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-15 18:08:44 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  headerSubTitleWindowBase: ({ theme }) => ({
+    width: "auto !important",
+    height: "auto !important",
+    color: `${theme.vars.palette.text.primary} !important`
+  }),
+  /**
+   * Styles for the icon of the header of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-18 08:11:19 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  headerIconWindowBase: ({ theme }) => ({
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: theme.vars.size.borderRadius["r0-5"],
+    color: theme.vars.palette.text.primary
+  }),
+  /**
+   * Styles for the icons wrapper of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-18 08:11:19 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  iconsWrapperWindowBase: () => ({
+    display: "flex",
+    alignItems: "center"
+  }),
+  /**
+   * Styles for the dot icon of the window base component.
+   * @author cesar - automatic
+   * @createdAt 2024-11-22 19:40:23 - automatic
+   * @updatedAt 2024-11-29 14:22:50 - automatic
+   * @updatedUser cesar - automatic
+   */
+  pointIcon: ({ theme, ownerState }) => ({
+    color: theme.vars.palette.text.primary,
+    ...theme.generalSettings.isMobile ? {
+      ...ownerState.windowBaseSize === "small" && {
+        height: theme.vars.size.mobile.small.base
+      },
+      ...ownerState.windowBaseSize === "medium" && {
+        height: theme.vars.size.mobile.medium.base
+      }
+    } : {
+      ...ownerState.windowBaseSize === "small" && {
+        height: theme.vars.size.desktop.small.base
+      },
+      ...ownerState.windowBaseSize === "medium" && {
+        height: theme.vars.size.desktop.medium.base
+      }
+    }
+  })
+};
+export {
+  windowBaseStyles as w
+};

package/components/WindowBase/constants.d.ts

@@ -0,0 +1 @@
+export declare const WINDOW_BASE_KEY_COMPONENT = "M4LWindowBase";

package/components/WindowBase/constants.js

@@ -0,0 +1,4 @@
+const WINDOW_BASE_KEY_COMPONENT = "M4LWindowBase";
+export {
+  WINDOW_BASE_KEY_COMPONENT as W
+};

package/components/WindowBase/icons.d.ts

@@ -0,0 +1,6 @@
+export declare const ICONS: {
+    CLOSE: string;
+    VERSION: string;
+    MORE_VERTICAL: string;
+    POINT: string;
+};

package/components/WindowBase/icons.js

@@ -0,0 +1,9 @@
+const ICONS = {
+  CLOSE: "close.svg",
+  VERSION: "branch.svg",
+  MORE_VERTICAL: "more_vertical.svg",
+  POINT: "point.svg"
+};
+export {
+  ICONS as I
+};

package/components/WindowBase/index.d.ts

@@ -0,0 +1,9 @@
+export * from './WindowBase.styles';
+export * from './WindowBase';
+export * from './constants';
+export * from './icons';
+export * from './slots/WindowBaseEnum';
+export * from './slots/WindowBaseSlots';
+export * from './subcomponents/Header/HeaderWindowBase';
+export * from './subcomponents/Header/types';
+export * from './types';

package/components/WindowBase/index.js

@@ -0,0 +1 @@
+

package/components/WindowBase/slots/WindowBaseEnum.d.ts

@@ -0,0 +1,16 @@
+export declare enum WindowBaseSlots {
+    wrapperWindowBase = "wrapperWindowBase",
+    contentWindowBase = "contentWindowBase",
+    headerWindowBase = "headerWindowBase",
+    headerContentWindowBase = "headerContentWindowBase",
+    headerTitleWindowBase = "headerTitleWindowBase",
+    headerSubTitleWindowBase = "headerSubTitleWindowBase",
+    pointWindowBase = "pointWindowBase",
+    pointIcon = "pointIcon",
+    subtitleContainer = "subtitleContainer",
+    headerIconWindowBase = "headerIconWindowBase",
+    menuActionsWindowBase = "menuActionsWindowBase",
+    closeWindowBase = "closeWindowBase",
+    iconsWrapperWindowBase = "iconsWrapperWindowBase",
+    headerWindowComponent = "headerWindowComponent"
+}

package/components/WindowBase/slots/WindowBaseEnum.js

@@ -0,0 +1,20 @@
+var WindowBaseSlots = /* @__PURE__ */ ((WindowBaseSlots2) => {
+  WindowBaseSlots2["wrapperWindowBase"] = "wrapperWindowBase";
+  WindowBaseSlots2["contentWindowBase"] = "contentWindowBase";
+  WindowBaseSlots2["headerWindowBase"] = "headerWindowBase";
+  WindowBaseSlots2["headerContentWindowBase"] = "headerContentWindowBase";
+  WindowBaseSlots2["headerTitleWindowBase"] = "headerTitleWindowBase";
+  WindowBaseSlots2["headerSubTitleWindowBase"] = "headerSubTitleWindowBase";
+  WindowBaseSlots2["pointWindowBase"] = "pointWindowBase";
+  WindowBaseSlots2["pointIcon"] = "pointIcon";
+  WindowBaseSlots2["subtitleContainer"] = "subtitleContainer";
+  WindowBaseSlots2["headerIconWindowBase"] = "headerIconWindowBase";
+  WindowBaseSlots2["menuActionsWindowBase"] = "menuActionsWindowBase";
+  WindowBaseSlots2["closeWindowBase"] = "closeWindowBase";
+  WindowBaseSlots2["iconsWrapperWindowBase"] = "iconsWrapperWindowBase";
+  WindowBaseSlots2["headerWindowComponent"] = "headerWindowComponent";
+  return WindowBaseSlots2;
+})(WindowBaseSlots || {});
+export {
+  WindowBaseSlots as W
+};

package/components/WindowBase/slots/WindowBaseSlots.d.ts

@@ -0,0 +1,95 @@
+/**
+ * Styled Components for WindowBase
+ *
+ * These styled components provide the foundational structure and styling
+ * for the `WindowBase` component, including its header, content, and icons.
+ */
+/**
+ * Root component for the WindowBase container.
+ */
+export declare const WindowBaseStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * Header component for the WindowBase container.
+ */
+export declare const HeaderWindowStyled: import('@emotion/styled').StyledComponent<Pick<import('../subcomponents/Header').HeaderProps & Pick<import('..').WindowBaseProps, "size"> & {
+    windowBaseColor?: import('..').WindowBaseProps["color"];
+    windowBaseSelected?: import('..').WindowBaseProps["selected"];
+    windowBaseVariant?: import('..').WindowBaseProps["variant"];
+    windowBaseSize?: import('..').WindowBaseProps["size"];
+}, "onClose" | "title" | "size" | "selected" | "color" | "variant" | "version" | "subTitle" | "iconUrl" | "windowBaseColor" | "windowBaseSelected" | "windowBaseVariant" | "windowBaseSize"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+/**
+ * Content component for the WindowBase container.
+ */
+export declare const ContentWindowStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * Header container for the component.
+ */
+export declare const HeaderWindowComponentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * Content wrapper for the header.
+ */
+export declare const HeaderContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * Icon component for the header.
+ */
+export declare const IconWindowStyled: import('@emotion/styled').StyledComponent<Pick<import('../../Icon').IconProps, keyof import('../../Icon').IconProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+/**
+ * Title component for the header.
+ */
+export declare const TitleWindowStyled: import('@emotion/styled').StyledComponent<Pick<import('../../mui_extended/Typography/types').TypographyProps, keyof import('../../mui_extended/Typography/types').TypographyProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+/**
+ * Subtitle component for the header.
+ */
+export declare const SubtitleWindowStyled: import('@emotion/styled').StyledComponent<Pick<import('../../mui_extended/Typography/types').TypographyProps, keyof import('../../mui_extended/Typography/types').TypographyProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+/**
+ * Subtitle container for the header.
+ */
+export declare const SubtitleContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * Point component for the header.
+ */
+export declare const PointStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * Point icon component for the header.
+ */
+export declare const PointIconStyled: import('@emotion/styled').StyledComponent<Pick<import('../../Icon').IconProps, keyof import('../../Icon').IconProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+/**
+ * Wrapper for icons in the header.
+ */
+export declare const IconsWrapperStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * Styled component for menu actions in the header.
+ */
+export declare const MenuActionsWindowsStyled: import('@emotion/styled').StyledComponent<Pick<import('../../mui_extended/MenuActions/types').MenuActionsProps, keyof import('../../mui_extended/MenuActions/types').MenuActionsProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+/**
+ * Styled component for the close button in the header.
+ */
+export declare const CloseWindowStyled: import('@emotion/styled').StyledComponent<Pick<import('../../mui_extended/IconButton/types').IconButtonProps, keyof import('../../mui_extended/IconButton/types').IconButtonProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('..').WindowBaseOwnerState> & Record<string, unknown> & {
+    ownerState: Partial<import('..').WindowBaseOwnerState> & Record<string, unknown>;
+}, {}, {}>;