@m4l/components 2.0.7 → 3.0.1

package/components/SideBar/{index.50868466.js → index-Cg1bZn8y.js}

@@ -1,23 +1,24 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { O as NavItemMainRoot, Q as NavSubItemContentRoot, T as NavListSubItemRoot, U as ContainerListSubItem, V as ContentGroupsRoot, X as WrapperGroup, Y as WrapperGroupTitle, Z as CollapseButtonRoot, _ as WrapperContentMobile, $ as SideBarRoot } from "../../styles/index.ccd8acc4.js";
+import { O as NavItemMainRoot, Q as NavSubItemContentRoot, T as NavListSubItemRoot, U as ContainerListSubItem, V as ContentGroupsRoot, X as WrapperGroup, Y as WrapperGroupTitle, Z as CollapseButtonRoot, _ as WrapperContentMobile, $ as SideBarRoot } from "../../styles/index-Cc9p_h7i.js";
 import { createContext, useState, useContext, useEffect } from "react";
 import { generateUtilityClasses, Collapse, Drawer as Drawer$1, useTheme } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../utils/index.ebfbb70f.js";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
+import { g as getComponentUtilityClass } from "../../utils/index-DiMrtgIu.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
 import { useEnvironment, useBase, BaseProvider } from "@m4l/core";
 import { useResponsiveDesktop } from "@m4l/graphics";
-import { I as Icon, A as ArrowIcon } from "../Icon/index.0f315ccd.js";
-import { T as Typography } from "../mui_extended/Typography/index.61dd3fc6.js";
+import { I as Icon, A as ArrowIcon } from "../Icon/index-CedboS6y.js";
+import { T as Typography } from "../mui_extended/Typography/index-DKPqV11f.js";
 import clsx from "clsx";
 import { useLocation } from "react-router-dom";
-import { I as Image } from "../Image/index.32b58ce4.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.caf17392.js";
+import { I as Image } from "../Image/index-B7FhR9uF.js";
+import { I as IconButton } from "../mui_extended/IconButton/index-BfDbi0cC.js";
 import { useResponsive } from "@m4l/styles";
 const componentName = "M4LSideBar";
 generateUtilityClasses(
   componentName,
   [
+    /* elements */
     "root",
     "containerSideBarLogo",
     "contentDesktop",
@@ -54,6 +55,7 @@ generateUtilityClasses(
     "drawer",
     "popover",
     "wrapperLogoFooter",
+    /* states or variants of elements */
     "collapsed",
     "visible",
     "subItemActive",
@@ -62,6 +64,12 @@ generateUtilityClasses(
     "variantComercial",
     "overlapping"
   ]
+  /*  returna un objeto igual a:
+      {
+          root: 'M4LSideBar-root',
+  
+      } 
+      */
 );
 const getSideBarClassesByState = (ownerState) => {
   const slots = {
@@ -122,6 +130,13 @@ const getSideBarClassesByState = (ownerState) => {
   const composedClasses = unstable_composeClasses(slots, getComponentUtilityClass(componentName), {});
   return {
     ...composedClasses
+    /* retorna un objeto para una variante de tipo = 'password':
+        {
+            input : "M4LRHFTextField-input"
+            root: "M4LRHFTextField-root M4LRHFTextField-variantPassword"
+            skeleton: "M4LRHFTextField-skeleton"
+        };
+        */
   };
 };
 const initialState = {
@@ -141,6 +156,7 @@ const initialState = {
   },
   isItemActive: () => false,
   expandedWidth: "",
+  // Obtener las clases iniciales para la barra lateral
   classes: getSideBarClassesByState({ collapsed: false, visible: true }),
   companyName: ""
 };
@@ -165,31 +181,33 @@ const SideBarProvider = (props) => {
     classes,
     companyName
   } = value;
-  return /* @__PURE__ */ jsx(
-    SideBarContext.Provider,
-    {
-      value: {
-        collapsed,
-        visible,
-        onToggleCollapse,
-        onToggleVisible,
-        menuData,
-        onClick,
-        companyLogoNormalUrl,
-        companyLogoSmallUrl,
-        isItemActive,
-        expandedWidth,
-        classes,
-        companyName,
-        onToggleOverlay,
-        overlay
-      },
-      children
-    }
+  return (
+    // Proporcionar el contexto con las propiedades desestructuradas
+    /* @__PURE__ */ jsx(
+      SideBarContext.Provider,
+      {
+        value: {
+          collapsed,
+          visible,
+          onToggleCollapse,
+          onToggleVisible,
+          menuData,
+          onClick,
+          companyLogoNormalUrl,
+          companyLogoSmallUrl,
+          isItemActive,
+          expandedWidth,
+          classes,
+          companyName,
+          onToggleOverlay,
+          overlay
+        },
+        children
+      }
+    )
   );
 };
 const useSideBar = () => useContext(SideBarContext);
-const useSideBar$1 = useSideBar;
 const SIDEBAR_PREFIX = "M4LSideBar";
 const getNameDataTestId = (KEY) => {
   return `${SIDEBAR_PREFIX}-${KEY}`;
@@ -198,7 +216,7 @@ const NavItemMainContent = (props) => {
   const { item, onClick, handlerOpen, changeVisible, open } = props;
   const { title, icon_url: icon, children } = item;
   const { host_static_assets, environment_assets } = useEnvironment();
-  const { classes } = useSideBar$1();
+  const { classes } = useSideBar();
   const isDesktop = useResponsiveDesktop();
   const handlerClick = (event) => {
     onClick && onClick(item);
@@ -231,7 +249,7 @@ const NavItemMainContent = (props) => {
 function NavItemMain(props) {
   const { item, setOpen, open } = props;
   const { children } = item;
-  const { onClick, isItemActive, onToggleVisible, classes } = useSideBar$1();
+  const { onClick, isItemActive, onToggleVisible, classes } = useSideBar();
   const active = isItemActive(item);
   if (children) {
     return /* @__PURE__ */ jsx(
@@ -267,7 +285,7 @@ const NavSubItemContent = (props) => {
   const { item, onClick, closePopover = () => {
   }, setOpenSub, openSub } = props;
   const { title, icon_url } = item;
-  const { isItemActive, onToggleVisible, classes } = useSideBar$1();
+  const { isItemActive, onToggleVisible, classes } = useSideBar();
   const active = isItemActive(item);
   const isDesktop = useResponsiveDesktop();
   const hasChildren = item.children && Array.isArray(item.children) && item.children.length > 0;
@@ -308,7 +326,7 @@ const NavSubItemContent = (props) => {
 };
 function NavSubItem(props) {
   const { item, closePopover, setOpenSub, openSub } = props;
-  const { onClick } = useSideBar$1();
+  const { onClick } = useSideBar();
   return /* @__PURE__ */ jsx(
     NavSubItemContent,
     {
@@ -325,7 +343,7 @@ function NavListSubItem(props) {
   } } = props;
   const { setAncestorActive } = useBase();
   const [internalItemActive, setInternalItemActive] = useState(false);
-  const { classes, isItemActive } = useSideBar$1();
+  const { classes, isItemActive } = useSideBar();
   const active = isItemActive(list);
   const [openSub, setOpenSub] = useState(false);
   const hasChildren = list.children && Array.isArray(list.children) && list.children.length > 0;
@@ -386,7 +404,7 @@ function NavListSubItem(props) {
 }
 function ItemListMain(props) {
   const { list } = props;
-  const { isItemActive, classes } = useSideBar$1();
+  const { isItemActive, classes } = useSideBar();
   const location = useLocation();
   const [internalItemActive, setInternalItemActive] = useState(false);
   const [active, setActive] = useState(false);
@@ -465,7 +483,7 @@ function ItemListMain(props) {
   );
 }
 const ContentGroups = () => {
-  const { menuData, classes } = useSideBar$1();
+  const { menuData, classes } = useSideBar();
   const [itemMainActive, setItemMainActive] = useState(-1);
   if (menuData && menuData.length > 0) {
     return /* @__PURE__ */ jsxs(
@@ -509,7 +527,7 @@ const ContentGroups = () => {
   );
 };
 function FooterSidebar(_props) {
-  const { classes, companyLogoNormalUrl } = useSideBar$1();
+  const { classes, companyLogoNormalUrl } = useSideBar();
   return /* @__PURE__ */ jsx(
     CollapseButtonRoot,
     {
@@ -531,7 +549,7 @@ function FooterSidebar(_props) {
 const MENU_COLLAPSED_SIZE = "14px";
 const MENU_COLLAPSED_CONTAINER_SIZE = "15px";
 const ContentComponent = () => {
-  const { collapsed, onToggleCollapse, classes, onToggleOverlay, overlay } = useSideBar$1();
+  const { collapsed, onToggleCollapse, classes, onToggleOverlay, overlay } = useSideBar();
   const handlerOnMouseEnter = () => {
     if (collapsed) {
       onToggleOverlay(true);
@@ -592,7 +610,7 @@ const ContentComponent = () => {
   );
 };
 const ContentDesktop = () => {
-  const { classes, collapsed, expandedWidth, overlay } = useSideBar$1();
+  const { classes, collapsed, expandedWidth, overlay } = useSideBar();
   const areaExpandMenuSize = collapsed ? !overlay ? MENU_COLLAPSED_SIZE : expandedWidth : expandedWidth;
   return /* @__PURE__ */ jsx("div", { className: classes.areaExpandMenu, style: { width: areaExpandMenuSize }, children: /* @__PURE__ */ jsx(ContentComponent, {}) });
 };
@@ -609,7 +627,7 @@ const ContentMobile = () => {
     collapsed,
     classes,
     companyName
-  } = useSideBar$1();
+  } = useSideBar();
   const theme = useTheme();
   return /* @__PURE__ */ jsx(
     Drawer,
@@ -690,43 +708,51 @@ const SideBar = (props) => {
     variantStyle
   };
   const classes = getSideBarClassesByState(ownerState);
-  return /* @__PURE__ */ jsx(
-    SideBarRoot,
-    {
-      className: classes.root,
-      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("root") } : {},
-      children: /* @__PURE__ */ jsx(
-        SideBarProvider,
-        {
-          value: {
-            collapsed,
-            visible,
-            onToggleCollapse,
-            onToggleVisible,
-            menuData,
-            onClick,
-            companyLogoNormalUrl,
-            companyLogoSmallUrl,
-            isItemActive,
-            expandedWidth,
-            classes,
-            companyName
-          },
-          children: /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: classes.wrapperSideBar,
-              style: { width: collapsed ? MENU_COLLAPSED_SIZE : expandedWidth },
-              children: !isMobile ? /* @__PURE__ */ jsx(ContentDesktop, {}) : /* @__PURE__ */ jsx(ContentMobile, {})
-            }
-          )
-        }
-      )
-    }
+  return (
+    /**
+     * Componente SideBarRoot.
+     * Este componente representa la raíz de la barra lateral.
+     *
+     */
+    /* @__PURE__ */ jsx(
+      SideBarRoot,
+      {
+        className: classes.root,
+        ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("root") } : {},
+        children: /* @__PURE__ */ jsx(
+          SideBarProvider,
+          {
+            value: {
+              // Propiedades y funciones proporcionadas a través del contexto
+              collapsed,
+              visible,
+              onToggleCollapse,
+              onToggleVisible,
+              menuData,
+              onClick,
+              companyLogoNormalUrl,
+              companyLogoSmallUrl,
+              isItemActive,
+              expandedWidth,
+              classes,
+              companyName
+            },
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: classes.wrapperSideBar,
+                style: { width: collapsed ? MENU_COLLAPSED_SIZE : expandedWidth },
+                children: !isMobile ? /* @__PURE__ */ jsx(ContentDesktop, {}) : /* @__PURE__ */ jsx(ContentMobile, {})
+              }
+            )
+          }
+        )
+      }
+    )
   );
 };
 export {
   SideBar as S,
   getNameDataTestId as g,
-  useSideBar$1 as u
+  useSideBar as u
 };

package/components/SplitLayout/{index.c2b8dcb8.js → index-CYnKlhi5.js}

@@ -1,15 +1,17 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { a0 as SplitLayoutRoot, a1 as SplitMaster, a2 as SplitDetail } from "../../styles/index.ccd8acc4.js";
+import { a0 as SplitLayoutRoot, a1 as SplitMaster, a2 as SplitDetail } from "../../styles/index-Cc9p_h7i.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import clsx from "clsx";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { S as SplitterLayout } from "../../react-splitter-layout.8b1655c8.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
+import { S as SplitterLayout } from "../../react-splitter-layout-C-JTsNGs.js";
 const componentName = "M4LSplitLayout";
 generateUtilityClasses(componentName, [
+  /* elements */
   "root",
   "firstPart",
   "secondPart",
+  /* states or variants of elements */
   "stateVertical",
   "stateHorizontal"
 ]);

package/components/ToastContainer/ToastContainer.d.ts

@@ -1,2 +1,2 @@
-import { ToastContainerProps } from './types';
+import type { ToastContainerProps } from './types';
 export declare const ToastContainer: (props: ToastContainerProps) => import("react/jsx-runtime").JSX.Element;

package/components/ToastContainer/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const TOAST_KEY_COMPONENT = "M4LToastContainer";
+export declare const DEFAULT_CLOSE_TIME = 30000;
+export declare const ICONS_PATH = "frontend/components/toast/assets/icons";

package/components/ToastContainer/helpers/toaster.d.ts

@@ -0,0 +1,4 @@
+import { ToastOptions } from 'react-toastify';
+import { Toaster } from '@m4l/core';
+declare function createToaster(containerId: ToastOptions['containerId']): Toaster;
+export default createToaster;

package/components/ToastContainer/icons.d.ts

@@ -0,0 +1,9 @@
+export declare const ICONS: {
+    readonly SUCCESS: "success.svg";
+    readonly INFO: "info.svg";
+    readonly WARNING: "warning.svg";
+    readonly ERROR: "error.svg";
+    readonly DEFAULT: "info.svg";
+    readonly CLOSE: "close.svg";
+    readonly PIN: "pin.svg";
+};

package/components/ToastContainer/index-B5VGIn45.js

@@ -0,0 +1,191 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { ToastContainer as ToastContainer$1, toast } from "react-toastify";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId-BaBTWhBr.js";
+import "react-toastify/dist/ReactToastify.min.css";
+import { useState } from "react";
+import { useEnvironment } from "@m4l/core";
+import { styled } from "@mui/material/styles";
+import { a3 as toastStyles } from "../../styles/index-Cc9p_h7i.js";
+import { I as Icon } from "../Icon/index-CedboS6y.js";
+var ToastContainerSlots = /* @__PURE__ */ ((ToastContainerSlots2) => {
+  ToastContainerSlots2["root"] = "root";
+  ToastContainerSlots2["messageRoot"] = "messageRoot";
+  ToastContainerSlots2["messageHeader"] = "messageHeader";
+  ToastContainerSlots2["messageIconRoot"] = "messageIconRoot";
+  ToastContainerSlots2["messageIcon"] = "messageIcon";
+  ToastContainerSlots2["messageTitle"] = "messageTitle";
+  ToastContainerSlots2["messageDescription"] = "messageDescription";
+  ToastContainerSlots2["messageCloseButton"] = "messageCloseButton";
+  ToastContainerSlots2["messageCloseButtonIcon"] = "messageCloseButtonIcon";
+  ToastContainerSlots2["messagePinButton"] = "messagePinButton";
+  ToastContainerSlots2["messagePinButtonIcon"] = "messagePinButtonIcon";
+  return ToastContainerSlots2;
+})(ToastContainerSlots || {});
+const TOAST_KEY_COMPONENT = "M4LToastContainer";
+const DEFAULT_CLOSE_TIME = 3e4;
+const ICONS_PATH = "frontend/components/toast/assets/icons";
+const RootStyled = styled("div", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.root
+})(toastStyles?.root);
+const MessageRootStyled = styled("div", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageRoot
+})(toastStyles?.messageRoot);
+const MessageHeaderStyled = styled("div", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageHeader
+})(toastStyles?.messageHeader);
+const MessageIconRootStyled = styled("div", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageIconRoot
+})(toastStyles?.messageIconRoot);
+const MessageIconStyled = styled(Icon, {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageIcon
+})(toastStyles?.messageIcon);
+const MessageTitleStyled = styled("strong", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageTitle
+})(toastStyles?.messageTitle);
+const MessageDescriptionStyled = styled("p", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageDescription
+})(toastStyles?.messageDescription);
+const MessageCloseButtonStyled = styled("button", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageCloseButton
+})(toastStyles?.messageCloseButton);
+const MessageCloseButtonIconStyled = styled(Icon, {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messageCloseButtonIcon
+})(toastStyles?.messageCloseButtonIcon);
+const MessagePinButtonStyled = styled("button", {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messagePinButton
+})(toastStyles?.messagePinButton);
+const MessagePinButtonIconStyled = styled(Icon, {
+  name: TOAST_KEY_COMPONENT,
+  slot: ToastContainerSlots.messagePinButtonIcon
+})(toastStyles?.messagePinButtonIcon);
+const ToastContainer = (props) => {
+  const { children, fixed = true, dataTestId, ...restProps } = props;
+  const ownerState = { fixed };
+  return /* @__PURE__ */ jsxs(
+    RootStyled,
+    {
+      ownerState,
+      ...getPropDataTestId(dataTestId, ToastContainerSlots.root),
+      children: [
+        /* @__PURE__ */ jsx(
+          ToastContainer$1,
+          {
+            stacked: true,
+            icon: false,
+            closeButton: false,
+            autoClose: DEFAULT_CLOSE_TIME,
+            theme: "light",
+            ...restProps
+          }
+        ),
+        children
+      ]
+    }
+  );
+};
+const ICONS = {
+  SUCCESS: "success.svg",
+  INFO: "info.svg",
+  WARNING: "warning.svg",
+  ERROR: "error.svg",
+  DEFAULT: "info.svg",
+  CLOSE: "close.svg",
+  PIN: "pin.svg"
+};
+const iconTypes = {
+  default: ICONS.DEFAULT,
+  info: ICONS.INFO,
+  success: ICONS.SUCCESS,
+  warning: ICONS.WARNING,
+  error: ICONS.ERROR
+};
+const ToastMessage = (props) => {
+  const [isPinned, setIsPinned] = useState(false);
+  const { type, title, description, closeToast, toastId, containerId } = props;
+  const ownerState = { type };
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const iconToShow = iconTypes?.[type || "default"] || iconTypes.default;
+  const iconTypePath = `${host_static_assets}/${environment_assets}/${ICONS_PATH}/${iconToShow}`;
+  const iconClosePath = `${host_static_assets}/${environment_assets}/${ICONS_PATH}/${ICONS.CLOSE}`;
+  const iconPinPath = `${host_static_assets}/${environment_assets}/${ICONS_PATH}/${ICONS.PIN}`;
+  function pinToast() {
+    if (toastId) {
+      toast.update(toastId, { containerId, autoClose: false, closeOnClick: false });
+      setIsPinned(true);
+    }
+  }
+  return /* @__PURE__ */ jsxs(MessageRootStyled, { ownerState, children: [
+    /* @__PURE__ */ jsxs(MessageHeaderStyled, { ownerState, children: [
+      /* @__PURE__ */ jsx(MessageIconRootStyled, { ownerState, children: /* @__PURE__ */ jsx(MessageIconStyled, { src: iconTypePath, ownerState }) }),
+      /* @__PURE__ */ jsx(MessageTitleStyled, { ownerState, children: title }),
+      !isPinned && /* @__PURE__ */ jsx(
+        MessagePinButtonStyled,
+        {
+          onClick: pinToast,
+          ownerState,
+          "aria-describedby": `${TOAST_KEY_COMPONENT}-pin`,
+          children: /* @__PURE__ */ jsx(MessagePinButtonIconStyled, { src: iconPinPath, size: "small", ownerState })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        MessageCloseButtonStyled,
+        {
+          onClick: closeToast,
+          ownerState,
+          "aria-describedby": `${TOAST_KEY_COMPONENT}-close`,
+          children: /* @__PURE__ */ jsx(MessageCloseButtonIconStyled, { src: iconClosePath, size: "small", ownerState })
+        }
+      )
+    ] }),
+    description && /* @__PURE__ */ jsx(MessageDescriptionStyled, { ownerState, children: description })
+  ] });
+};
+function optionsToProps(toastProps, containerId) {
+  return {
+    containerId,
+    type: toastProps?.type,
+    toastId: toastProps?.toastId,
+    autoClose: toastProps?.autoClose
+  };
+}
+function triggerToast({ props, toastOptions, containerId, type = "default" }) {
+  const currentContainerId = containerId || toastOptions?.containerId;
+  const allProps = { ...props, ...optionsToProps(toastOptions, currentContainerId) };
+  const toastFn = type === "default" || type === void 0 ? toast : toast[type];
+  const id = toastFn(/* @__PURE__ */ jsx(ToastMessage, { ...allProps }), {
+    ...toastOptions,
+    containerId: currentContainerId
+  });
+  if (!toastOptions?.toastId) {
+    toast.update(id, {
+      containerId: currentContainerId,
+      render: /* @__PURE__ */ jsx(ToastMessage, { ...allProps, toastId: id })
+    });
+  }
+  return toastOptions?.toastId || id;
+}
+function createToaster(containerId) {
+  const toaster = (props, toastOptions = {}) => {
+    return triggerToast({ props, toastOptions, containerId });
+  };
+  toaster.success = (props, toastOptions = {}) => triggerToast({ props, toastOptions, type: "success", containerId });
+  toaster.info = (props, toastOptions = {}) => triggerToast({ props, toastOptions, type: "info", containerId });
+  toaster.warning = (props, toastOptions = {}) => triggerToast({ props, toastOptions, type: "warning", containerId });
+  toaster.error = (props, toastOptions = {}) => triggerToast({ props, toastOptions, type: "error", containerId });
+  return toaster;
+}
+export {
+  ToastContainer as T,
+  ToastMessage as a,
+  createToaster as c
+};

package/components/ToastContainer/index.d.ts

@@ -1,2 +1,3 @@
 export { ToastContainer } from './ToastContainer';
+export { default as createToaster } from './helpers/toaster';
 export { ToastMessage } from './subcomponents/ToastMessage';

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

@@ -0,0 +1,13 @@
+export declare enum ToastContainerSlots {
+    root = "root",
+    messageRoot = "messageRoot",
+    messageHeader = "messageHeader",
+    messageIconRoot = "messageIconRoot",
+    messageIcon = "messageIcon",
+    messageTitle = "messageTitle",
+    messageDescription = "messageDescription",
+    messageCloseButton = "messageCloseButton",
+    messageCloseButtonIcon = "messageCloseButtonIcon",
+    messagePinButton = "messagePinButton",
+    messagePinButtonIcon = "messagePinButtonIcon"
+}

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

@@ -0,0 +1,2 @@
+export * from './toastContainerSlots';
+export { ToastContainerSlots } from './ToastContainerEnum';

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

@@ -0,0 +1,34 @@
+/// <reference types="react" />
+export declare const RootStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Partial<import("../types").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, 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").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, 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").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, 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").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, 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").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, {}, {}>;
+export declare const MessageTitleStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Partial<import("../types").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, keyof import("react").ClassAttributes<HTMLElement> | keyof import("react").HTMLAttributes<HTMLElement>>, {}>;
+export declare const MessageDescriptionStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Partial<import("../types").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, keyof import("react").ClassAttributes<HTMLParagraphElement> | keyof import("react").HTMLAttributes<HTMLParagraphElement>>, {}>;
+export declare const MessageCloseButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Partial<import("../types").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, keyof import("react").ClassAttributes<HTMLButtonElement> | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>>, {}>;
+export declare const MessageCloseButtonIconStyled: import("@emotion/styled").StyledComponent<Pick<import("../../Icon").IconProps, keyof import("../../Icon").IconProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Partial<import("../types").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, {}, {}>;
+export declare const MessagePinButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Partial<import("../types").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, keyof import("react").ClassAttributes<HTMLButtonElement> | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>>, {}>;
+export declare const MessagePinButtonIconStyled: import("@emotion/styled").StyledComponent<Pick<import("../../Icon").IconProps, keyof import("../../Icon").IconProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Partial<import("../types").ToastContainerProps> & Record<string, unknown> & {
+    ownerState: Partial<import("../types").ToastContainerProps> & Record<string, unknown>;
+}, {}, {}>;

package/components/ToastContainer/subcomponents/ToastMessage/ToastMessage.d.ts

@@ -0,0 +1,2 @@
+import { ToastMessageProps } from '../../types';
+export declare const ToastMessage: (props: ToastMessageProps) => import("react/jsx-runtime").JSX.Element;

package/components/ToastContainer/subcomponents/ToastMessage/index.d.ts

@@ -1,2 +1 @@
-import { ToastMessageProps } from './types';
-export declare const ToastMessage: (props: ToastMessageProps) => import("react/jsx-runtime").JSX.Element;
+export { ToastMessage } from './ToastMessage';