@connectif/ui-components 2.0.12 → 2.0.15

package/dist/index.js

@@ -1997,6 +1997,7 @@ import {
   mdiHumanMale,
   mdiHumanMaleFemale,
   mdiHumanPregnant,
+  mdiIdentifier,
   mdiImage,
   mdiImageAlbum,
   mdiImageArea,
@@ -3837,6 +3838,7 @@ var icons = {
   "human-male-female": mdiHumanMaleFemale,
   "human-pregnant": mdiHumanPregnant,
   image: mdiImage,
+  identifier: mdiIdentifier,
   "image-album": mdiImageAlbum,
   "image-area": mdiImageArea,
   "image-area-close": mdiImageAreaClose,
@@ -24230,9 +24232,32 @@ var Loader = ({
 var Loader_default = Loader;
 
 // src/components/markdown/MarkdownRenderer.tsx
+import React76 from "react";
 import Markdown from "markdown-to-jsx";
 import { styled as styled8 } from "@mui/material/styles";
-import { jsx as jsx136 } from "react/jsx-runtime";
+import "katex/dist/katex.min.css";
+
+// src/components/markdown/KatexRenderer.tsx
+import katex from "katex";
+import { jsx as jsx136, jsxs as jsxs69 } from "react/jsx-runtime";
+var KatexRenderer = ({ children, block }) => {
+  try {
+    const html2 = katex.renderToString(children, {
+      throwOnError: false,
+      displayMode: block
+    });
+    return /* @__PURE__ */ jsx136("span", { dangerouslySetInnerHTML: { __html: html2 } });
+  } catch (err) {
+    return /* @__PURE__ */ jsxs69("pre", { style: { color: "red" }, children: [
+      "KaTeX error: $",
+      err.message
+    ] });
+  }
+};
+var KatexRenderer_default = KatexRenderer;
+
+// src/components/markdown/MarkdownRenderer.tsx
+import { jsx as jsx137 } from "react/jsx-runtime";
 var MarkdownContainer = styled8("div")(
   ({ color: color2, backgroundColor: backgroundColor2 = "transparent", variant }) => ({
     color: color2,
@@ -24293,14 +24318,57 @@ var MarkdownContainer = styled8("div")(
     }
   })
 );
+var renderWithMath = (text) => {
+  const parts = [];
+  const regex = /\$\$([\s\S]+?)\$\$|\$([\s\S]+?)\$/g;
+  let lastIndex = 0;
+  let match;
+  while ((match = regex.exec(text)) !== null) {
+    const [full, blockExpr, inlineExpr] = match;
+    const start = match.index;
+    if (start > lastIndex) {
+      parts.push(text.slice(lastIndex, start));
+    }
+    if (blockExpr) {
+      parts.push(
+        /* @__PURE__ */ jsx137(KatexRenderer_default, { block: true, children: blockExpr.trim() }, start)
+      );
+    } else if (inlineExpr) {
+      parts.push(
+        /* @__PURE__ */ jsx137(KatexRenderer_default, { children: inlineExpr.trim() }, start)
+      );
+    }
+    lastIndex = regex.lastIndex;
+  }
+  if (lastIndex < text.length) {
+    parts.push(text.slice(lastIndex));
+  }
+  return parts;
+};
 var MarkdownRenderer = ({
   text,
   ...rest
-}) => /* @__PURE__ */ jsx136(MarkdownContainer, { ...rest, children: /* @__PURE__ */ jsx136(
+}) => /* @__PURE__ */ jsx137(MarkdownContainer, { ...rest, children: /* @__PURE__ */ jsx137(
   Markdown,
   {
     options: {
-      forceBlock: true
+      forceBlock: true,
+      overrides: {
+        p: {
+          component: ({ children, ...props }) => {
+            const renderChildren = React76.Children.map(
+              children,
+              (child) => {
+                if (typeof child === "string") {
+                  return renderWithMath(child);
+                }
+                return child;
+              }
+            );
+            return /* @__PURE__ */ jsx137("p", { ...props, children: renderChildren });
+          }
+        }
+      }
     },
     children: text
   }
@@ -24309,7 +24377,7 @@ var MarkdownRenderer_default = MarkdownRenderer;
 
 // src/components/navbar/Navbar.tsx
 import { Drawer as Drawer2 } from "@mui/material";
-import { Fragment as Fragment32, jsx as jsx137, jsxs as jsxs69 } from "react/jsx-runtime";
+import { Fragment as Fragment32, jsx as jsx138, jsxs as jsxs70 } from "react/jsx-runtime";
 var Navbar = ({
   topContent,
   bottomContent,
@@ -24317,8 +24385,8 @@ var Navbar = ({
   drawerBottomContent,
   onClose,
   isDrawerOpen = false
-}) => /* @__PURE__ */ jsxs69(Fragment32, { children: [
-  /* @__PURE__ */ jsxs69(
+}) => /* @__PURE__ */ jsxs70(Fragment32, { children: [
+  /* @__PURE__ */ jsxs70(
     Box_default,
     {
       sx: {
@@ -24333,12 +24401,12 @@ var Navbar = ({
       },
       className: "Slim-Vertical-Scroll",
       children: [
-        /* @__PURE__ */ jsx137(Box_default, { children: topContent }),
-        /* @__PURE__ */ jsx137(Box_default, { children: bottomContent })
+        /* @__PURE__ */ jsx138(Box_default, { children: topContent }),
+        /* @__PURE__ */ jsx138(Box_default, { children: bottomContent })
       ]
     }
   ),
-  /* @__PURE__ */ jsxs69(
+  /* @__PURE__ */ jsxs70(
     Drawer2,
     {
       open: isDrawerOpen,
@@ -24361,8 +24429,8 @@ var Navbar = ({
       },
       onClose,
       children: [
-        /* @__PURE__ */ jsx137("div", { children: drawerTopContent }),
-        /* @__PURE__ */ jsx137("div", { children: drawerBottomContent })
+        /* @__PURE__ */ jsx138("div", { children: drawerTopContent }),
+        /* @__PURE__ */ jsx138("div", { children: drawerBottomContent })
       ]
     }
   )
@@ -24370,10 +24438,10 @@ var Navbar = ({
 var Navbar_default = Navbar;
 
 // src/components/navbar/NavbarButton.tsx
-import * as React76 from "react";
+import * as React77 from "react";
 import { Box as Box6, ButtonBase as ButtonBase2 } from "@mui/material";
-import { jsx as jsx138, jsxs as jsxs70 } from "react/jsx-runtime";
-var NavbarButton = React76.forwardRef(
+import { jsx as jsx139, jsxs as jsxs71 } from "react/jsx-runtime";
+var NavbarButton = React77.forwardRef(
   function NavbarButton2({
     iconId,
     srcUrl,
@@ -24387,7 +24455,7 @@ var NavbarButton = React76.forwardRef(
       if (!highlighted) {
         return element;
       }
-      return /* @__PURE__ */ jsxs70(
+      return /* @__PURE__ */ jsxs71(
         Box6,
         {
           sx: {
@@ -24397,7 +24465,7 @@ var NavbarButton = React76.forwardRef(
             position: "relative"
           },
           children: [
-            /* @__PURE__ */ jsx138(
+            /* @__PURE__ */ jsx139(
               Box6,
               {
                 sx: {
@@ -24413,7 +24481,7 @@ var NavbarButton = React76.forwardRef(
                 }
               }
             ),
-            /* @__PURE__ */ jsx138(
+            /* @__PURE__ */ jsx139(
               Box6,
               {
                 sx: {
@@ -24428,7 +24496,7 @@ var NavbarButton = React76.forwardRef(
         }
       );
     };
-    return /* @__PURE__ */ jsxs70(
+    return /* @__PURE__ */ jsxs71(
       ButtonBase2,
       {
         className: "NavbarButton-root",
@@ -24446,7 +24514,7 @@ var NavbarButton = React76.forwardRef(
         },
         children: [
           srcUrl ? getButtonContent(
-            /* @__PURE__ */ jsx138(
+            /* @__PURE__ */ jsx139(
               Avatar_default,
               {
                 className: "NavbarButton-icon",
@@ -24456,7 +24524,7 @@ var NavbarButton = React76.forwardRef(
               }
             )
           ) : getButtonContent(
-            /* @__PURE__ */ jsx138(
+            /* @__PURE__ */ jsx139(
               Icon_default,
               {
                 id: iconId,
@@ -24472,7 +24540,7 @@ var NavbarButton = React76.forwardRef(
               }
             )
           ),
-          badgeIconProps && /* @__PURE__ */ jsx138(
+          badgeIconProps && /* @__PURE__ */ jsx139(
             Icon_default,
             {
               ...badgeIconProps,
@@ -24494,8 +24562,8 @@ var NavbarButton = React76.forwardRef(
 var NavbarButton_default = NavbarButton;
 
 // src/components/navbar/NavbarHeader.tsx
-import { jsx as jsx139 } from "react/jsx-runtime";
-var NavbarHeader = ({ text }) => /* @__PURE__ */ jsx139(
+import { jsx as jsx140 } from "react/jsx-runtime";
+var NavbarHeader = ({ text }) => /* @__PURE__ */ jsx140(
   Typography_default,
   {
     sx: {
@@ -24515,12 +24583,12 @@ var NavbarHeader = ({ text }) => /* @__PURE__ */ jsx139(
 var NavbarHeader_default = NavbarHeader;
 
 // src/components/navbar/NavbarLogo.tsx
-import * as React77 from "react";
+import * as React78 from "react";
 import { ButtonBase as ButtonBase3 } from "@mui/material";
-import { jsx as jsx140 } from "react/jsx-runtime";
-var NavbarLogo = React77.forwardRef(
+import { jsx as jsx141 } from "react/jsx-runtime";
+var NavbarLogo = React78.forwardRef(
   function NavbarButton3({ src, ...rest }, ref) {
-    return /* @__PURE__ */ jsx140(
+    return /* @__PURE__ */ jsx141(
       ButtonBase3,
       {
         ref,
@@ -24531,7 +24599,7 @@ var NavbarLogo = React77.forwardRef(
           borderBottom: `1px solid ${grey200}`,
           boxSizing: "border-box"
         },
-        children: /* @__PURE__ */ jsx140("img", { src, width: "32px", height: "32px" })
+        children: /* @__PURE__ */ jsx141("img", { src, width: "32px", height: "32px" })
       }
     );
   }
@@ -24539,8 +24607,8 @@ var NavbarLogo = React77.forwardRef(
 var NavbarLogo_default = NavbarLogo;
 
 // src/components/overlay/DonutFocusOverlay.tsx
-import * as React78 from "react";
-import { Fragment as Fragment33, jsx as jsx141, jsxs as jsxs71 } from "react/jsx-runtime";
+import * as React79 from "react";
+import { Fragment as Fragment33, jsx as jsx142, jsxs as jsxs72 } from "react/jsx-runtime";
 var DonutFocusOverlay = ({
   isVisible,
   elementRef,
@@ -24549,8 +24617,8 @@ var DonutFocusOverlay = ({
   chipLabel,
   chipPosition = "right"
 }) => {
-  const [clientRect, setClientRect] = React78.useState();
-  React78.useEffect(() => {
+  const [clientRect, setClientRect] = React79.useState();
+  React79.useEffect(() => {
     if (!elementRef?.current) {
       setClientRect(void 0);
       return;
@@ -24581,8 +24649,8 @@ var DonutFocusOverlay = ({
   const internalTopHalfCircle = `${internalCircleRadius} ${internalCircleRadius} 0 0 1 ${startPointX + donutWidth + internalCircleRadius * 2} ${startPointY}`;
   const externalTopHalfCircle = `${externalCircleRadius} ${externalCircleRadius} 0 0 0 ${startPointX} ${startPointY}`;
   const path = `path("M ${startPointX} ${startPointY} A ${externalBottomHalfCircle} m ${-donutWidth} 0 A ${internalBottomHalfCircle} A ${internalTopHalfCircle} m ${donutWidth} 0 A ${externalTopHalfCircle} Z")`;
-  return /* @__PURE__ */ jsxs71(Fragment33, { children: [
-    /* @__PURE__ */ jsx141(
+  return /* @__PURE__ */ jsxs72(Fragment33, { children: [
+    /* @__PURE__ */ jsx142(
       Box_default,
       {
         sx: {
@@ -24599,7 +24667,7 @@ var DonutFocusOverlay = ({
         }
       }
     ),
-    chipLabel && /* @__PURE__ */ jsx141(
+    chipLabel && /* @__PURE__ */ jsx142(
       Chip_default,
       {
         label: chipLabel,
@@ -24626,7 +24694,7 @@ var DonutFocusOverlay = ({
 var DonutFocusOverlay_default = DonutFocusOverlay;
 
 // src/components/pager/Pager.tsx
-import { Fragment as Fragment34, jsx as jsx142, jsxs as jsxs72 } from "react/jsx-runtime";
+import { Fragment as Fragment34, jsx as jsx143, jsxs as jsxs73 } from "react/jsx-runtime";
 var Pager = ({
   page,
   pageSize,
@@ -24640,10 +24708,10 @@ var Pager = ({
   const to = Math.min(current + pageSize, total);
   const pages = Math.max(Math.ceil(total / pageSize), 1);
   const options = [...Array(pages).keys()].map((i) => ({ value: i + 1 }));
-  const Label = ({ children }) => /* @__PURE__ */ jsx142(Typography_default, { color: Colors_exports.grey400, sx: { padding: "0 8px" }, children });
-  return /* @__PURE__ */ jsxs72(Stack_default, { direction: "row", sx: { alignItems: "center" }, children: [
-    /* @__PURE__ */ jsx142(Label, { children: t("PAGER.PAGE") }),
-    /* @__PURE__ */ jsx142(
+  const Label = ({ children }) => /* @__PURE__ */ jsx143(Typography_default, { color: Colors_exports.grey400, sx: { padding: "0 8px" }, children });
+  return /* @__PURE__ */ jsxs73(Stack_default, { direction: "row", sx: { alignItems: "center" }, children: [
+    /* @__PURE__ */ jsx143(Label, { children: t("PAGER.PAGE") }),
+    /* @__PURE__ */ jsx143(
       Select_default,
       {
         value: page,
@@ -24652,9 +24720,9 @@ var Pager = ({
         sx: { minWidth: 78 }
       }
     ),
-    allowedPageSizes && /* @__PURE__ */ jsxs72(Fragment34, { children: [
-      /* @__PURE__ */ jsx142(Label, { children: t("PAGER.ROWS_PER_PAGE") }),
-      /* @__PURE__ */ jsx142(
+    allowedPageSizes && /* @__PURE__ */ jsxs73(Fragment34, { children: [
+      /* @__PURE__ */ jsx143(Label, { children: t("PAGER.ROWS_PER_PAGE") }),
+      /* @__PURE__ */ jsx143(
         Select_default,
         {
           value: pageSize,
@@ -24668,7 +24736,7 @@ var Pager = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs72(Label, { children: [
+    /* @__PURE__ */ jsxs73(Label, { children: [
       from,
       " - ",
       to,
@@ -24677,7 +24745,7 @@ var Pager = ({
       " ",
       total
     ] }),
-    /* @__PURE__ */ jsx142(
+    /* @__PURE__ */ jsx143(
       IconButton_default,
       {
         disabled: page <= 1,
@@ -24685,7 +24753,7 @@ var Pager = ({
         onClick: () => onPageChange(page - 1, pageSize)
       }
     ),
-    /* @__PURE__ */ jsx142(
+    /* @__PURE__ */ jsx143(
       IconButton_default,
       {
         disabled: page > total / pageSize,
@@ -24699,17 +24767,17 @@ var Pager_default = Pager;
 
 // src/components/scrollable/HorizontalScrollable.tsx
 import { ButtonBase as ButtonBase4 } from "@mui/material";
-import * as React79 from "react";
-import { jsx as jsx143, jsxs as jsxs73 } from "react/jsx-runtime";
+import * as React80 from "react";
+import { jsx as jsx144, jsxs as jsxs74 } from "react/jsx-runtime";
 var HorizontalScrollable = ({
   style: style3,
   children,
   stepDistance = 200
 }) => {
-  const horizontalContainerRef = React79.useRef(null);
-  const [isLeftArrowHidden, setLeftArrowHidden] = React79.useState(true);
-  const [isRightArrowHidden, setRightArrowHidden] = React79.useState(true);
-  React79.useEffect(() => {
+  const horizontalContainerRef = React80.useRef(null);
+  const [isLeftArrowHidden, setLeftArrowHidden] = React80.useState(true);
+  const [isRightArrowHidden, setRightArrowHidden] = React80.useState(true);
+  React80.useEffect(() => {
     if (!horizontalContainerRef.current) {
       return;
     }
@@ -24749,8 +24817,8 @@ var HorizontalScrollable = ({
     );
     current.scrollBy(stepDistance, 0);
   };
-  return /* @__PURE__ */ jsxs73(Box_default, { sx: { position: "relative", ...style3 }, children: [
-    /* @__PURE__ */ jsx143(
+  return /* @__PURE__ */ jsxs74(Box_default, { sx: { position: "relative", ...style3 }, children: [
+    /* @__PURE__ */ jsx144(
       ButtonBase4,
       {
         sx: {
@@ -24767,10 +24835,10 @@ var HorizontalScrollable = ({
           ...isLeftArrowHidden && { display: "none" }
         },
         onClick: () => leftScroll(),
-        children: /* @__PURE__ */ jsx143(Icon_default, { id: "chevron-left" })
+        children: /* @__PURE__ */ jsx144(Icon_default, { id: "chevron-left" })
       }
     ),
-    /* @__PURE__ */ jsx143(
+    /* @__PURE__ */ jsx144(
       Box_default,
       {
         ref: horizontalContainerRef,
@@ -24789,7 +24857,7 @@ var HorizontalScrollable = ({
         children
       }
     ),
-    /* @__PURE__ */ jsx143(
+    /* @__PURE__ */ jsx144(
       ButtonBase4,
       {
         sx: {
@@ -24806,7 +24874,7 @@ var HorizontalScrollable = ({
           ...isRightArrowHidden && { display: "none" }
         },
         onClick: () => rightScroll(),
-        children: /* @__PURE__ */ jsx143(Icon_default, { id: "chevron-right" })
+        children: /* @__PURE__ */ jsx144(Icon_default, { id: "chevron-right" })
       }
     )
   ] });
@@ -24817,12 +24885,12 @@ var HorizontalScrollable_default = HorizontalScrollable;
 import {
   SnackbarProvider as NotistackSnackbarProvider
 } from "notistack";
-import { jsx as jsx144 } from "react/jsx-runtime";
+import { jsx as jsx145 } from "react/jsx-runtime";
 var SnackbarProvider = ({
   children,
   maxSnack = 3,
   domRoot
-}) => /* @__PURE__ */ jsx144(
+}) => /* @__PURE__ */ jsx145(
   NotistackSnackbarProvider,
   {
     maxSnack,
@@ -24840,10 +24908,10 @@ import {
 } from "notistack";
 
 // src/components/snackbar/Snackbar.tsx
-import * as React80 from "react";
+import * as React81 from "react";
 import { SnackbarContent } from "notistack";
 import { Typography as Typography4 } from "@mui/material";
-import { jsx as jsx145, jsxs as jsxs74 } from "react/jsx-runtime";
+import { jsx as jsx146, jsxs as jsxs75 } from "react/jsx-runtime";
 var sizeStyles5 = {
   M: {
     width: "344px",
@@ -24868,7 +24936,7 @@ var iconColors = {
   error: error300,
   warning: complementary300
 };
-var Snackbar = React80.forwardRef(
+var Snackbar = React81.forwardRef(
   function Snackbar2({
     severity = "info",
     message,
@@ -24880,13 +24948,13 @@ var Snackbar = React80.forwardRef(
     identifierKey: key,
     dataTestKey
   }, ref) {
-    const actionClickHandler = React80.useCallback(() => {
+    const actionClickHandler = React81.useCallback(() => {
       onActionClick && onActionClick(key);
     }, [onActionClick, key]);
-    const closeClickHandler = React80.useCallback(() => {
+    const closeClickHandler = React81.useCallback(() => {
       onCloseClick && onCloseClick(key);
     }, [onCloseClick, key]);
-    return /* @__PURE__ */ jsx145(
+    return /* @__PURE__ */ jsx146(
       SnackbarContent,
       {
         ref,
@@ -24904,14 +24972,14 @@ var Snackbar = React80.forwardRef(
         ...dataTestKey && {
           "data-test": dataTestKey
         },
-        children: /* @__PURE__ */ jsxs74(
+        children: /* @__PURE__ */ jsxs75(
           Stack_default,
           {
             direction: "row",
             spacing: 2,
             sx: { width: "100%", alignItems: "center" },
             children: [
-              withIcon && /* @__PURE__ */ jsx145(
+              withIcon && /* @__PURE__ */ jsx146(
                 Box_default,
                 {
                   sx: {
@@ -24919,10 +24987,10 @@ var Snackbar = React80.forwardRef(
                     flexShrink: 0,
                     color: iconColors[severity]
                   },
-                  children: /* @__PURE__ */ jsx145(Icon_default, { id: severityIcons[severity] })
+                  children: /* @__PURE__ */ jsx146(Icon_default, { id: severityIcons[severity] })
                 }
               ),
-              /* @__PURE__ */ jsx145(
+              /* @__PURE__ */ jsx146(
                 Typography4,
                 {
                   variant: "body2",
@@ -24930,7 +24998,7 @@ var Snackbar = React80.forwardRef(
                   children: message
                 }
               ),
-              actionText && /* @__PURE__ */ jsx145(Box_default, { sx: { flexGrow: 0, flexShrink: 0 }, children: /* @__PURE__ */ jsx145(
+              actionText && /* @__PURE__ */ jsx146(Box_default, { sx: { flexGrow: 0, flexShrink: 0 }, children: /* @__PURE__ */ jsx146(
                 Button_default,
                 {
                   sx: {
@@ -24945,7 +25013,7 @@ var Snackbar = React80.forwardRef(
                   onClick: actionClickHandler
                 }
               ) }),
-              /* @__PURE__ */ jsx145(Box_default, { sx: { flexGrow: 0, flexShrink: 0 }, children: /* @__PURE__ */ jsx145(
+              /* @__PURE__ */ jsx146(Box_default, { sx: { flexGrow: 0, flexShrink: 0 }, children: /* @__PURE__ */ jsx146(
                 IconButton_default,
                 {
                   iconId: "close",
@@ -24970,7 +25038,7 @@ var Snackbar_default = Snackbar;
 
 // src/components/snackbar/enqueueSnackbar.tsx
 import { closeSnackbar as closeSnackbar2 } from "notistack";
-import { jsx as jsx146 } from "react/jsx-runtime";
+import { jsx as jsx147 } from "react/jsx-runtime";
 var enqueueSnackbar = (message, options = {}) => {
   const {
     persist,
@@ -24986,7 +25054,7 @@ var enqueueSnackbar = (message, options = {}) => {
     autoHideDuration: autoHideDurationMs ?? 1e4,
     persist: persist ?? false,
     content(key, message2) {
-      return /* @__PURE__ */ jsx146(
+      return /* @__PURE__ */ jsx147(
         Snackbar_default,
         {
           identifierKey: key,
@@ -25003,7 +25071,7 @@ var enqueueSnackbar = (message, options = {}) => {
 
 // src/components/tab/TabButton.tsx
 import MuiTab from "@mui/material/Tab";
-import { jsx as jsx147 } from "react/jsx-runtime";
+import { jsx as jsx148 } from "react/jsx-runtime";
 var TabButton = ({
   children,
   disabled = false,
@@ -25012,10 +25080,10 @@ var TabButton = ({
   dataTestId,
   disableUppercase = false,
   ...rest
-}) => /* @__PURE__ */ jsx147(
+}) => /* @__PURE__ */ jsx148(
   MuiTab,
   {
-    label: /* @__PURE__ */ jsx147(
+    label: /* @__PURE__ */ jsx148(
       "div",
       {
         style: {
@@ -25047,13 +25115,13 @@ var TabButton = ({
 var TabButton_default = TabButton;
 
 // src/components/tab/Tabs.tsx
-import * as React82 from "react";
+import * as React83 from "react";
 import MuiTabs from "@mui/material/Tabs";
 
 // src/components/layout/SwipeableViews.tsx
-import * as React81 from "react";
+import * as React82 from "react";
 import { useEffect as useEffect21, useRef as useRef22, useState as useState31 } from "react";
-import { jsx as jsx148 } from "react/jsx-runtime";
+import { jsx as jsx149 } from "react/jsx-runtime";
 var styles = {
   container: {
     maxHeight: "100%",
@@ -25124,7 +25192,7 @@ function SwipeableViews({
       return () => cancelAnimationFrame(animationFrame);
     }
   }, [index]);
-  return /* @__PURE__ */ jsx148(
+  return /* @__PURE__ */ jsx149(
     "div",
     {
       ...rootProps,
@@ -25147,7 +25215,7 @@ function SwipeableViews({
           );
         }, 100);
       },
-      children: React81.Children.map(children, (child, childIndex) => /* @__PURE__ */ jsx148(
+      children: React82.Children.map(children, (child, childIndex) => /* @__PURE__ */ jsx149(
         "div",
         {
           className: "Slim-Vertical-Scroll",
@@ -25160,7 +25228,7 @@ function SwipeableViews({
 }
 
 // src/components/tab/Tabs.tsx
-import { jsx as jsx149, jsxs as jsxs75 } from "react/jsx-runtime";
+import { jsx as jsx150, jsxs as jsxs76 } from "react/jsx-runtime";
 var Tabs = ({
   tabButtons,
   children,
@@ -25171,7 +25239,7 @@ var Tabs = ({
   contained = false,
   scrollbarGutter
 }) => {
-  const [value, setValue] = React82.useState(0);
+  const [value, setValue] = React83.useState(0);
   const handleChangeIndex = (index) => {
     onChangeTab?.(index);
     setValue(index);
@@ -25182,7 +25250,7 @@ var Tabs = ({
     bottom: 0,
     borderRadius: "8px 8px 0 0"
   };
-  return /* @__PURE__ */ jsxs75(
+  return /* @__PURE__ */ jsxs76(
     Box_default,
     {
       sx: {
@@ -25196,7 +25264,7 @@ var Tabs = ({
         }
       },
       children: [
-        /* @__PURE__ */ jsx149(
+        /* @__PURE__ */ jsx150(
           MuiTabs,
           {
             value: currentTabIndex ?? value,
@@ -25222,7 +25290,7 @@ var Tabs = ({
             children: tabButtons
           }
         ),
-        /* @__PURE__ */ jsx149(
+        /* @__PURE__ */ jsx150(
           Box_default,
           {
             sx: {
@@ -25231,7 +25299,7 @@ var Tabs = ({
                 height: "100%"
               }
             },
-            children: /* @__PURE__ */ jsx149(
+            children: /* @__PURE__ */ jsx150(
               SwipeableViews,
               {
                 index: currentTabIndex ?? value,
@@ -25259,8 +25327,8 @@ var Tabs = ({
 var Tabs_default = Tabs;
 
 // src/components/tab/TabContent.tsx
-import { jsx as jsx150 } from "react/jsx-runtime";
-var TabContent = ({ children }) => /* @__PURE__ */ jsx150(
+import { jsx as jsx151 } from "react/jsx-runtime";
+var TabContent = ({ children }) => /* @__PURE__ */ jsx151(
   Box_default,
   {
     sx: {
@@ -25277,8 +25345,8 @@ import {
   TableRow as MuiTableRow,
   TableCell as MuiTableCell
 } from "@mui/material";
-import { jsx as jsx151 } from "react/jsx-runtime";
-var TableDivider = () => /* @__PURE__ */ jsx151(MuiTableRow, { children: /* @__PURE__ */ jsx151(
+import { jsx as jsx152 } from "react/jsx-runtime";
+var TableDivider = () => /* @__PURE__ */ jsx152(MuiTableRow, { children: /* @__PURE__ */ jsx152(
   MuiTableCell,
   {
     colSpan: 1e3,
@@ -25291,8 +25359,8 @@ var TableDivider_default = TableDivider;
 import {
   TableSortLabel as MuiTableSortLabel
 } from "@mui/material";
-import { jsx as jsx152 } from "react/jsx-runtime";
-var TableSortLabel = ({ children, ...rest }) => /* @__PURE__ */ jsx152(MuiTableSortLabel, { ...rest, children });
+import { jsx as jsx153 } from "react/jsx-runtime";
+var TableSortLabel = ({ children, ...rest }) => /* @__PURE__ */ jsx153(MuiTableSortLabel, { ...rest, children });
 var TableSortLabel_default = TableSortLabel;
 
 // src/components/table/Table.tsx
@@ -25300,21 +25368,21 @@ import {
   TableContainer,
   Table as MuiTable
 } from "@mui/material";
-import { jsx as jsx153 } from "react/jsx-runtime";
-var Table = ({ children, sx, className }) => /* @__PURE__ */ jsx153(TableContainer, { className: "Slim-Horizontal-Scroll", children: /* @__PURE__ */ jsx153(MuiTable, { sx: { backgroundColor: white, ...sx }, className, children }) });
+import { jsx as jsx154 } from "react/jsx-runtime";
+var Table = ({ children, sx, className }) => /* @__PURE__ */ jsx154(TableContainer, { className: "Slim-Horizontal-Scroll", children: /* @__PURE__ */ jsx154(MuiTable, { sx: { backgroundColor: white, ...sx }, className, children }) });
 var Table_default = Table;
 
 // src/components/table/TableBody.tsx
 import { TableBody as MuiTableBody } from "@mui/material";
-import { jsx as jsx154 } from "react/jsx-runtime";
-var TableBody = ({ children }) => /* @__PURE__ */ jsx154(MuiTableBody, { children });
+import { jsx as jsx155 } from "react/jsx-runtime";
+var TableBody = ({ children }) => /* @__PURE__ */ jsx155(MuiTableBody, { children });
 var TableBody_default = TableBody;
 
 // src/components/table/TableCell.tsx
 import {
   TableCell as MuiTableCell2
 } from "@mui/material";
-import { jsx as jsx155 } from "react/jsx-runtime";
+import { jsx as jsx156 } from "react/jsx-runtime";
 var TableCell = ({
   children,
   size = "M",
@@ -25325,7 +25393,7 @@ var TableCell = ({
   onClick,
   noBorder = false,
   ...rest
-}) => /* @__PURE__ */ jsx155(
+}) => /* @__PURE__ */ jsx156(
   MuiTableCell2,
   {
     ...rest,
@@ -25349,12 +25417,12 @@ var TableCell = ({
 var TableCell_default = TableCell;
 
 // src/components/table/TableCellCopy.tsx
-import * as React83 from "react";
-import { jsx as jsx156 } from "react/jsx-runtime";
+import * as React84 from "react";
+import { jsx as jsx157 } from "react/jsx-runtime";
 var TableCellCopy = ({ text, textToCopy, ...rest }) => {
   const { t } = useTranslation();
-  const [isCopied, setIsCopied] = React83.useState(false);
-  const [showIcon, setShowIcon] = React83.useState(false);
+  const [isCopied, setIsCopied] = React84.useState(false);
+  const [showIcon, setShowIcon] = React84.useState(false);
   const manageButtonClicked = () => {
     void navigator.clipboard.writeText(textToCopy ?? text);
     if (isCopied) {
@@ -25368,7 +25436,7 @@ var TableCellCopy = ({ text, textToCopy, ...rest }) => {
   const getIconId = () => !isCopied ? "content-copy" : "check";
   const iconHiddenClass = "icon-hidden";
   const iconCopiedClass = "icon-copied";
-  return /* @__PURE__ */ jsx156(TableCell_default, { ...rest, sx: { padding: 0 }, children: /* @__PURE__ */ jsx156(
+  return /* @__PURE__ */ jsx157(TableCell_default, { ...rest, sx: { padding: 0 }, children: /* @__PURE__ */ jsx157(
     Stack_default,
     {
       direction: "row",
@@ -25377,7 +25445,7 @@ var TableCellCopy = ({ text, textToCopy, ...rest }) => {
       onMouseEnter: () => setShowIcon(true),
       onMouseLeave: () => setShowIcon(false),
       onClick: manageButtonClicked,
-      children: /* @__PURE__ */ jsx156(Tooltip_default, { title: t(!isCopied ? "COPY" : "COPIED"), children: /* @__PURE__ */ jsx156(
+      children: /* @__PURE__ */ jsx157(Tooltip_default, { title: t(!isCopied ? "COPY" : "COPIED"), children: /* @__PURE__ */ jsx157(
         Button_default,
         {
           className: isCopied ? iconCopiedClass : !showIcon ? iconHiddenClass : "",
@@ -25407,21 +25475,21 @@ var TableCellCopy_default = TableCellCopy;
 
 // src/components/table/TableHead.tsx
 import { TableHead as MuiTableHead } from "@mui/material";
-import { jsx as jsx157 } from "react/jsx-runtime";
-var TableHead = ({ children }) => /* @__PURE__ */ jsx157(MuiTableHead, { children });
+import { jsx as jsx158 } from "react/jsx-runtime";
+var TableHead = ({ children }) => /* @__PURE__ */ jsx158(MuiTableHead, { children });
 var TableHead_default = TableHead;
 
 // src/components/table/TableRow.tsx
 import {
   TableRow as MuiTableRow2
 } from "@mui/material";
-import { jsx as jsx158 } from "react/jsx-runtime";
+import { jsx as jsx159 } from "react/jsx-runtime";
 var TableRow = ({
   children,
   isFollowedByNestedTable = false,
   fadeInLeftAnimation = false,
   sx
-}) => /* @__PURE__ */ jsx158(
+}) => /* @__PURE__ */ jsx159(
   MuiTableRow2,
   {
     className: `${isFollowedByNestedTable ? "Followed-By-Nested-Table" : ""} ${fadeInLeftAnimation ? "animated fadeInLeft" : ""}`,
@@ -25433,14 +25501,14 @@ var TableRow_default = TableRow;
 
 // src/components/table/NestedTable.tsx
 import { Collapse as Collapse7 } from "@mui/material";
-import { jsx as jsx159 } from "react/jsx-runtime";
+import { jsx as jsx160 } from "react/jsx-runtime";
 var NestedTable = ({
   colSpan,
   children,
   className = "",
   sx,
   isVisible = true
-}) => /* @__PURE__ */ jsx159(TableRow_default, { children: /* @__PURE__ */ jsx159(
+}) => /* @__PURE__ */ jsx160(TableRow_default, { children: /* @__PURE__ */ jsx160(
   TableCell_default,
   {
     colSpan,
@@ -25449,14 +25517,14 @@ var NestedTable = ({
       height: "auto",
       ...!isVisible && { borderBottom: "none" }
     },
-    children: /* @__PURE__ */ jsx159(Collapse7, { in: isVisible, children: /* @__PURE__ */ jsx159(Box_default, { sx: { padding: "16px", backgroundColor: grey100 }, children: /* @__PURE__ */ jsx159(Paper_default, { children: /* @__PURE__ */ jsx159(Table_default, { sx, className: `Nested-Table ${className}`, children }) }) }) })
+    children: /* @__PURE__ */ jsx160(Collapse7, { in: isVisible, children: /* @__PURE__ */ jsx160(Box_default, { sx: { padding: "16px", backgroundColor: grey100 }, children: /* @__PURE__ */ jsx160(Paper_default, { children: /* @__PURE__ */ jsx160(Table_default, { sx, className: `Nested-Table ${className}`, children }) }) }) })
   }
 ) });
 var NestedTable_default = NestedTable;
 
 // src/components/toolbar/ToolbarBreadcrumb.tsx
-import { jsx as jsx160 } from "react/jsx-runtime";
-var ToolbarBreadcrumb = ({ parts = [] }) => /* @__PURE__ */ jsx160(
+import { jsx as jsx161 } from "react/jsx-runtime";
+var ToolbarBreadcrumb = ({ parts = [] }) => /* @__PURE__ */ jsx161(
   Stack_default,
   {
     direction: "row",
@@ -25466,7 +25534,7 @@ var ToolbarBreadcrumb = ({ parts = [] }) => /* @__PURE__ */ jsx160(
       (previous, current, index) => [
         ...previous,
         ...index > 0 ? [
-          /* @__PURE__ */ jsx160(
+          /* @__PURE__ */ jsx161(
             Typography_default,
             {
               color: grey500,
@@ -25489,10 +25557,10 @@ var ToolbarBreadcrumb_default = ToolbarBreadcrumb;
 
 // src/components/toolbar/ToolbarBreadcrumbButton.tsx
 import { ButtonBase as ButtonBase5 } from "@mui/material";
-import * as React84 from "react";
-import { jsx as jsx161 } from "react/jsx-runtime";
-var ToolbarBreadcrumbButton = React84.forwardRef(function ToolbarBreadcrumbButton2({ text, className, ...rest }, ref) {
-  return /* @__PURE__ */ jsx161(
+import * as React85 from "react";
+import { jsx as jsx162 } from "react/jsx-runtime";
+var ToolbarBreadcrumbButton = React85.forwardRef(function ToolbarBreadcrumbButton2({ text, className, ...rest }, ref) {
+  return /* @__PURE__ */ jsx162(
     ButtonBase5,
     {
       className: `Cn-ToolbarBreadcrumbButton ${className}`,
@@ -25511,14 +25579,14 @@ var ToolbarBreadcrumbButton = React84.forwardRef(function ToolbarBreadcrumbButto
         }
       },
       ...rest,
-      children: /* @__PURE__ */ jsx161(Typography_default, { color: "inherit", component: "div", variant: "h6", noWrap: true, children: text })
+      children: /* @__PURE__ */ jsx162(Typography_default, { color: "inherit", component: "div", variant: "h6", noWrap: true, children: text })
     }
   );
 });
 var ToolbarBreadcrumbButton_default = ToolbarBreadcrumbButton;
 
 // src/components/toolbar/Toolbar.tsx
-import { jsx as jsx162, jsxs as jsxs76 } from "react/jsx-runtime";
+import { jsx as jsx163, jsxs as jsxs77 } from "react/jsx-runtime";
 var Toolbar = ({
   children,
   rightActions,
@@ -25527,7 +25595,7 @@ var Toolbar = ({
   sx,
   dataTestId,
   onClickToolbar
-}) => /* @__PURE__ */ jsxs76(
+}) => /* @__PURE__ */ jsxs77(
   Box_default,
   {
     className: `Cn-Toolbar ${className}`,
@@ -25547,7 +25615,7 @@ var Toolbar = ({
     onClick: onClickToolbar,
     "data-testid": dataTestId,
     children: [
-      /* @__PURE__ */ jsxs76(
+      /* @__PURE__ */ jsxs77(
         Box_default,
         {
           sx: {
@@ -25559,7 +25627,7 @@ var Toolbar = ({
             width: "100%"
           },
           children: [
-            leftActions && /* @__PURE__ */ jsx162(
+            leftActions && /* @__PURE__ */ jsx163(
               Box_default,
               {
                 className: `Cn-Toolbar-left`,
@@ -25569,7 +25637,7 @@ var Toolbar = ({
                 children: leftActions
               }
             ),
-            /* @__PURE__ */ jsx162(
+            /* @__PURE__ */ jsx163(
               Box_default,
               {
                 className: `Cn-Toolbar-children`,
@@ -25584,7 +25652,7 @@ var Toolbar = ({
           ]
         }
       ),
-      rightActions && /* @__PURE__ */ jsx162(
+      rightActions && /* @__PURE__ */ jsx163(
         Box_default,
         {
           className: `Cn-Toolbar-right`,
@@ -25603,24 +25671,24 @@ var Toolbar = ({
 var Toolbar_default = Toolbar;
 
 // src/components/toolbar/ToolbarTitle.tsx
-import * as React85 from "react";
+import * as React86 from "react";
 import { useState as useState34 } from "react";
-import { jsx as jsx163, jsxs as jsxs77 } from "react/jsx-runtime";
-var ToolbarTitle = React85.forwardRef(function ToolbarTitle2({
+import { jsx as jsx164, jsxs as jsxs78 } from "react/jsx-runtime";
+var ToolbarTitle = React86.forwardRef(function ToolbarTitle2({
   title,
   align = "left",
   className,
   hoverActions,
   color: color2 = grey900
 }, ref) {
-  const textElementRef = React85.useRef(null);
+  const textElementRef = React86.useRef(null);
   const [showHoverActions, setShowHoverActions] = useState34(false);
-  return /* @__PURE__ */ jsx163(Box_default, { sx: { maxWidth: "100%" }, children: /* @__PURE__ */ jsx163(
+  return /* @__PURE__ */ jsx164(Box_default, { sx: { maxWidth: "100%" }, children: /* @__PURE__ */ jsx164(
     TextEllipsisTooltip_default,
     {
       title: title ?? "\xA0",
       textEllipsableElement: textElementRef,
-      children: /* @__PURE__ */ jsxs77(
+      children: /* @__PURE__ */ jsxs78(
         Typography_default,
         {
           color: color2,
@@ -25638,7 +25706,7 @@ var ToolbarTitle = React85.forwardRef(function ToolbarTitle2({
           },
           children: [
             title || "\xA0",
-            hoverActions && showHoverActions && /* @__PURE__ */ jsx163(
+            hoverActions && showHoverActions && /* @__PURE__ */ jsx164(
               Box_default,
               {
                 sx: {
@@ -25667,13 +25735,13 @@ var Slide_default = Slide;
 
 // src/components/widget/WidgetLegendItem.tsx
 import { ButtonBase as ButtonBase6 } from "@mui/material";
-import { jsx as jsx164, jsxs as jsxs78 } from "react/jsx-runtime";
+import { jsx as jsx165, jsxs as jsxs79 } from "react/jsx-runtime";
 var WidgetLegendItem = ({
   groupLabel,
   legendDirection = "column",
   items = [],
   onClick
-}) => /* @__PURE__ */ jsx164(
+}) => /* @__PURE__ */ jsx165(
   ButtonBase6,
   {
     tabIndex: onClick ? 0 : -1,
@@ -25687,7 +25755,7 @@ var WidgetLegendItem = ({
       p: "2px 12px",
       cursor: onClick ? "pointer" : "default"
     },
-    children: /* @__PURE__ */ jsxs78(
+    children: /* @__PURE__ */ jsxs79(
       Box_default,
       {
         sx: {
@@ -25699,7 +25767,7 @@ var WidgetLegendItem = ({
           color: grey800
         },
         children: [
-          groupLabel && /* @__PURE__ */ jsx164(
+          groupLabel && /* @__PURE__ */ jsx165(
             Typography_default,
             {
               variant: "overline",
@@ -25721,7 +25789,7 @@ var WidgetLegendItem = ({
               style: style3
             }, i) => {
               const incrementLabelIconId = incrementLabelType && incrementLabelStyles[incrementLabelType].icon;
-              return /* @__PURE__ */ jsxs78(
+              return /* @__PURE__ */ jsxs79(
                 Box_default,
                 {
                   sx: {
@@ -25731,7 +25799,7 @@ var WidgetLegendItem = ({
                     paddingRight: legendDirection === "row" ? "12px" : "inherit"
                   },
                   children: [
-                    iconColor && /* @__PURE__ */ jsx164(
+                    iconColor && /* @__PURE__ */ jsx165(
                       Icon_default,
                       {
                         id: iconId,
@@ -25742,7 +25810,7 @@ var WidgetLegendItem = ({
                         size: iconSize
                       }
                     ),
-                    label && /* @__PURE__ */ jsx164(
+                    label && /* @__PURE__ */ jsx165(
                       Typography_default,
                       {
                         variant: "caption",
@@ -25751,7 +25819,7 @@ var WidgetLegendItem = ({
                         children: label
                       }
                     ),
-                    value && /* @__PURE__ */ jsx164(
+                    value && /* @__PURE__ */ jsx165(
                       Typography_default,
                       {
                         sx: style3,
@@ -25760,7 +25828,7 @@ var WidgetLegendItem = ({
                         children: value
                       }
                     ),
-                    incrementLabelValue && /* @__PURE__ */ jsx164(
+                    incrementLabelValue && /* @__PURE__ */ jsx165(
                       IncrementLabel_default,
                       {
                         label: incrementLabelValue,
@@ -25786,8 +25854,8 @@ var WidgetLegendItem_default = WidgetLegendItem;
 
 // src/components/widget/Widget.tsx
 import MuiCard2 from "@mui/material/Card";
-import { jsx as jsx165 } from "react/jsx-runtime";
-var Widget = ({ children }) => /* @__PURE__ */ jsx165(
+import { jsx as jsx166 } from "react/jsx-runtime";
+var Widget = ({ children }) => /* @__PURE__ */ jsx166(
   MuiCard2,
   {
     variant: "elevation",
@@ -25811,8 +25879,8 @@ var Widget = ({ children }) => /* @__PURE__ */ jsx165(
 var Widget_default = Widget;
 
 // src/components/widget/WidgetActions.tsx
-import { jsx as jsx166 } from "react/jsx-runtime";
-var WidgetActions = ({ children }) => /* @__PURE__ */ jsx166(
+import { jsx as jsx167 } from "react/jsx-runtime";
+var WidgetActions = ({ children }) => /* @__PURE__ */ jsx167(
   Box_default,
   {
     sx: {
@@ -25826,8 +25894,8 @@ var WidgetActions = ({ children }) => /* @__PURE__ */ jsx166(
 var WidgetActions_default = WidgetActions;
 
 // src/components/widget/WidgetTitle.tsx
-import { jsx as jsx167 } from "react/jsx-runtime";
-var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE__ */ jsx167(
+import { jsx as jsx168 } from "react/jsx-runtime";
+var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE__ */ jsx168(
   Box_default,
   {
     sx: {
@@ -25837,7 +25905,7 @@ var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE
       maxWidth: "100%",
       ...sx
     },
-    children: /* @__PURE__ */ jsx167(
+    children: /* @__PURE__ */ jsx168(
       Typography_default,
       {
         variant: "subtitle2",
@@ -25851,12 +25919,12 @@ var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE
       }
     )
   }
-) : /* @__PURE__ */ jsx167("span", {});
+) : /* @__PURE__ */ jsx168("span", {});
 var WidgetTitle_default = WidgetTitle;
 
 // src/components/window/MinimizableWindow.tsx
-import * as React86 from "react";
-import { Fragment as Fragment35, jsx as jsx168, jsxs as jsxs79 } from "react/jsx-runtime";
+import * as React87 from "react";
+import { Fragment as Fragment35, jsx as jsx169, jsxs as jsxs80 } from "react/jsx-runtime";
 var sizes6 = {
   M: 400,
   L: 500,
@@ -25881,32 +25949,34 @@ var iconButtonsStyles = {
     backgroundColor: "rgba(255, 255, 255, 0.2)"
   }
 };
-var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
+var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
   children,
   title,
   size = "M",
   open,
   closeable = true,
   showBackButton = false,
+  backButton,
   sx,
   targetElement,
   contentHeight,
+  iconSizes: iconSizes4 = "S",
   onMinimize,
   onClose,
   onBack
 }, ref) {
   const { t } = useTranslation();
-  const overlayRef = React86.useRef(null);
-  const windowRef = React86.useRef(null);
-  const headerRef = React86.useRef(null);
-  const [isDraggingState, setIsDraggingState] = React86.useState(false);
-  const diffRef = React86.useRef({ x: 0, y: 0 });
-  React86.useImperativeHandle(ref, () => ({
+  const overlayRef = React87.useRef(null);
+  const windowRef = React87.useRef(null);
+  const headerRef = React87.useRef(null);
+  const [isDraggingState, setIsDraggingState] = React87.useState(false);
+  const diffRef = React87.useRef({ x: 0, y: 0 });
+  React87.useImperativeHandle(ref, () => ({
     window: windowRef.current,
     header: headerRef.current,
     overlay: overlayRef.current
   }));
-  React86.useEffect(() => {
+  React87.useEffect(() => {
     if (open) {
       overlayRef.current?.style.removeProperty("transform");
       overlayRef.current?.style.removeProperty("opacity");
@@ -25968,8 +26038,8 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
       }
     }, 750);
   };
-  return /* @__PURE__ */ jsxs79(Fragment35, { children: [
-    isDraggingState && /* @__PURE__ */ jsx168(
+  return /* @__PURE__ */ jsxs80(Fragment35, { children: [
+    isDraggingState && /* @__PURE__ */ jsx169(
       Box_default,
       {
         sx: {
@@ -25985,7 +26055,7 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
         onMouseMove: (ev) => handleMouseMove(ev)
       }
     ),
-    /* @__PURE__ */ jsx168(
+    /* @__PURE__ */ jsx169(
       Box_default,
       {
         ref: overlayRef,
@@ -26002,7 +26072,7 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
           ...!open && { pointerEvents: "none" },
           transition: "transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), left 0.4s cubic-bezier(0.4, 0, 0.2, 1)"
         },
-        children: /* @__PURE__ */ jsxs79(
+        children: /* @__PURE__ */ jsxs80(
           Stack_default,
           {
             sx: {
@@ -26013,7 +26083,7 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
             width: `${sizes6[size]}px`,
             height: contentHeight !== void 0 && headerRef.current ? `${contentHeight + contentPadding + headerRef.current.scrollHeight}px` : void 0,
             children: [
-              /* @__PURE__ */ jsxs79(
+              /* @__PURE__ */ jsxs80(
                 Stack_default,
                 {
                   ref: headerRef,
@@ -26027,32 +26097,32 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
                   onMouseDown: handleMouseDown,
                   minHeight: "44px",
                   children: [
-                    /* @__PURE__ */ jsx168(
+                    /* @__PURE__ */ jsx169(
                       Stack_default,
                       {
                         direction: "row",
                         alignItems: "center",
                         onMouseDown: (ev) => ev.stopPropagation(),
-                        children: showBackButton && /* @__PURE__ */ jsx168(
+                        children: showBackButton && (!backButton ? /* @__PURE__ */ jsx169(
                           Tooltip_default,
                           {
                             title: t("MINIMIZABLE_WINDOW.GO_BACK"),
                             zIndex: 999999,
                             placement: "top",
-                            children: /* @__PURE__ */ jsx168(
+                            children: /* @__PURE__ */ jsx169(
                               IconButton_default,
                               {
-                                size: "S",
+                                size: iconSizes4,
                                 iconId: "arrow-left",
                                 onClick: onBack,
                                 sx: iconButtonsStyles
                               }
                             )
                           }
-                        )
+                        ) : backButton)
                       }
                     ),
-                    /* @__PURE__ */ jsx168(
+                    /* @__PURE__ */ jsx169(
                       Box_default,
                       {
                         sx: {
@@ -26060,26 +26130,26 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
                           left: "50%",
                           transform: "translateX(-50%)"
                         },
-                        children: typeof title === "string" ? /* @__PURE__ */ jsx168(Typography_default, { children: title }) : title
+                        children: typeof title === "string" ? /* @__PURE__ */ jsx169(Typography_default, { children: title }) : title
                       }
                     ),
-                    /* @__PURE__ */ jsxs79(
+                    /* @__PURE__ */ jsxs80(
                       Stack_default,
                       {
                         direction: "row",
                         alignItems: "center",
                         onMouseDown: (ev) => ev.stopPropagation(),
                         children: [
-                          /* @__PURE__ */ jsx168(Box_default, { children: /* @__PURE__ */ jsx168(
+                          /* @__PURE__ */ jsx169(Box_default, { children: /* @__PURE__ */ jsx169(
                             Tooltip_default,
                             {
                               title: t("MINIMIZABLE_WINDOW.MINIMIZE"),
                               zIndex: 999999,
                               placement: "top",
-                              children: /* @__PURE__ */ jsx168(
+                              children: /* @__PURE__ */ jsx169(
                                 IconButton_default,
                                 {
-                                  size: "S",
+                                  size: iconSizes4,
                                   iconId: "minus",
                                   onClick: () => {
                                     applyMinimizeTransition();
@@ -26092,16 +26162,16 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
                               )
                             }
                           ) }),
-                          closeable && /* @__PURE__ */ jsx168(Box_default, { sx: { padding: "0 8px" }, children: /* @__PURE__ */ jsx168(
+                          closeable && /* @__PURE__ */ jsx169(Box_default, { sx: { padding: "0 8px" }, children: /* @__PURE__ */ jsx169(
                             Tooltip_default,
                             {
                               title: t("MINIMIZABLE_WINDOW.CLOSE"),
                               zIndex: 999999,
                               placement: "top",
-                              children: /* @__PURE__ */ jsx168(
+                              children: /* @__PURE__ */ jsx169(
                                 IconButton_default,
                                 {
-                                  size: "S",
+                                  size: iconSizes4,
                                   iconId: "close",
                                   onClick: onCloseModal,
                                   sx: iconButtonsStyles
@@ -26115,7 +26185,7 @@ var MinimizableWindow = React86.forwardRef(function MinimizableWindow2({
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx168(
+              /* @__PURE__ */ jsx169(
                 Stack_default,
                 {
                   sx: {