@connectif/ui-components 6.0.3 → 6.0.5

package/dist/index.js

@@ -97,7 +97,7 @@ var require_react_is_development = __commonJS({
         var ContextProvider = REACT_PROVIDER_TYPE;
         var Element2 = REACT_ELEMENT_TYPE;
         var ForwardRef2 = REACT_FORWARD_REF_TYPE;
-        var Fragment44 = REACT_FRAGMENT_TYPE;
+        var Fragment45 = REACT_FRAGMENT_TYPE;
         var Lazy = REACT_LAZY_TYPE;
         var Memo2 = REACT_MEMO_TYPE;
         var Portal = REACT_PORTAL_TYPE;
@@ -156,7 +156,7 @@ var require_react_is_development = __commonJS({
         exports.ContextProvider = ContextProvider;
         exports.Element = Element2;
         exports.ForwardRef = ForwardRef2;
-        exports.Fragment = Fragment44;
+        exports.Fragment = Fragment45;
         exports.Lazy = Lazy;
         exports.Memo = Memo2;
         exports.Portal = Portal;
@@ -9471,7 +9471,7 @@ var TooltipMenu_default = TooltipMenu;
 
 // src/components/tooltip/TextEllipsis.tsx
 import * as React17 from "react";
-import { jsx as jsx32 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx32 } from "react/jsx-runtime";
 var TextEllipsis = ({
   text,
   typographyVariant,
@@ -9481,47 +9481,49 @@ var TextEllipsis = ({
   maxWidth: maxWidth2,
   "data-test": dataTest,
   sx,
-  zIndex
+  zIndex,
+  disableTooltip = false
 }) => {
   const textElementRef = React17.useRef(
     null
   );
-  return /* @__PURE__ */ jsx32(
+  const getTypography = () => /* @__PURE__ */ jsx32(
+    Typography_default,
+    {
+      color: color2,
+      ref: textElementRef,
+      component: "div",
+      variant: typographyVariant,
+      noWrap: lines <= 1,
+      sx: {
+        width: width2 || void 0,
+        cursor: "inherit",
+        maxWidth: maxWidth2 || void 0,
+        ...lines > 1 && {
+          WebkitLineClamp: lines,
+          textOverflow: "ellipsis",
+          overflow: "hidden",
+          WebkitBoxOrient: "vertical",
+          wordWrap: "break-word",
+          display: "-webkit-box",
+          whiteSpace: "unset"
+        },
+        ...sx
+      },
+      "data-test": dataTest,
+      children: text || "\xA0"
+    }
+  );
+  return /* @__PURE__ */ jsx32(Fragment4, { children: !disableTooltip ? /* @__PURE__ */ jsx32(
     TextEllipsisTooltip_default,
     {
       title: text ?? "\xA0",
       textEllipsableElement: textElementRef,
       lines,
       zIndex,
-      children: /* @__PURE__ */ jsx32(
-        Typography_default,
-        {
-          color: color2,
-          ref: textElementRef,
-          component: "div",
-          variant: typographyVariant,
-          noWrap: lines <= 1,
-          sx: {
-            width: width2 || void 0,
-            cursor: "inherit",
-            maxWidth: maxWidth2 || void 0,
-            ...lines > 1 && {
-              WebkitLineClamp: lines,
-              textOverflow: "ellipsis",
-              overflow: "hidden",
-              WebkitBoxOrient: "vertical",
-              wordWrap: "break-word",
-              display: "-webkit-box",
-              whiteSpace: "unset"
-            },
-            ...sx
-          },
-          "data-test": dataTest,
-          children: text || "\xA0"
-        }
-      )
+      children: getTypography()
     }
-  );
+  ) : getTypography() });
 };
 var TextEllipsis_default = TextEllipsis;
 
@@ -9594,7 +9596,7 @@ var AvatarCard_default = AvatarCard;
 // src/components/button/MenuIconButton.tsx
 import * as React19 from "react";
 import MuiMenu from "@mui/material/Menu";
-import { Fragment as Fragment4, jsx as jsx34, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx34, jsxs as jsxs13 } from "react/jsx-runtime";
 var MenuIconButton = React19.forwardRef(function MenuIconButton2({
   children,
   isOpen: managedIsOpen,
@@ -9639,7 +9641,7 @@ var MenuIconButton = React19.forwardRef(function MenuIconButton2({
     setAnchorEl(element);
   };
   const isOpen = typeof managedIsOpen === "boolean" ? managedIsOpen : internalIsOpen;
-  return /* @__PURE__ */ jsxs13(Fragment4, { children: [
+  return /* @__PURE__ */ jsxs13(Fragment5, { children: [
     /* @__PURE__ */ jsx34(
       IconButton_default,
       {
@@ -10374,7 +10376,7 @@ var ButtonWithActions_default = ButtonWithActions;
 // src/components/button/MenuButton.tsx
 import * as React24 from "react";
 import MuiMenu3 from "@mui/material/Menu";
-import { Fragment as Fragment5, jsx as jsx43, jsxs as jsxs18 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx43, jsxs as jsxs18 } from "react/jsx-runtime";
 var MenuButton = React24.forwardRef(function MenuButton2({
   children,
   isOpen: managedIsOpen,
@@ -10419,7 +10421,7 @@ var MenuButton = React24.forwardRef(function MenuButton2({
     setAnchorEl(element);
   };
   const isOpen = typeof managedIsOpen === "boolean" ? managedIsOpen : internalIsOpen;
-  return /* @__PURE__ */ jsxs18(Fragment5, { children: [
+  return /* @__PURE__ */ jsxs18(Fragment6, { children: [
     /* @__PURE__ */ jsx43(
       Button_default,
       {
@@ -11371,7 +11373,7 @@ import * as React32 from "react";
 // src/components/chip/MenuChip.tsx
 import * as React29 from "react";
 import MuiMenu4 from "@mui/material/Menu";
-import { Fragment as Fragment6, jsx as jsx61, jsxs as jsxs23 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx61, jsxs as jsxs23 } from "react/jsx-runtime";
 var MenuChip = React29.forwardRef(function MenuChip2({
   children,
   isOpen: managedIsOpen,
@@ -11413,7 +11415,7 @@ var MenuChip = React29.forwardRef(function MenuChip2({
     setAnchorEl(element);
   };
   const isOpen = typeof managedIsOpen === "boolean" ? managedIsOpen : internalIsOpen;
-  return /* @__PURE__ */ jsxs23(Fragment6, { children: [
+  return /* @__PURE__ */ jsxs23(Fragment7, { children: [
     /* @__PURE__ */ jsx61(
       Chip_default,
       {
@@ -11550,7 +11552,7 @@ var GlobalStyles_default = globalStyles;
 // src/components/chip/ChipHiddenCounter.tsx
 import * as React30 from "react";
 import { Popper } from "@mui/material";
-import { Fragment as Fragment7, jsx as jsx62, jsxs as jsxs24 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx62, jsxs as jsxs24 } from "react/jsx-runtime";
 var TOOLTIP_DATA_TEST_ID = "chip-container-tooltip";
 var COUNTER_LABEL_DATA_TEST_ID = "chip-counter-label";
 var MAX_TOOLTIP_WIDTH = 362;
@@ -11584,7 +11586,7 @@ var ChipHiddenCounter = ({
     const alertButtonWidth = !warningTooltip ? 0 : WIDTH_ALERT_BUTTON;
     return !isDeletable ? `${MAX_TOOLTIP_WIDTH - alertButtonWidth}px` : `${MAX_TOOLTIP_WIDTH - WIDTH_DELETABLE_BUTTON - alertButtonWidth}px`;
   };
-  return /* @__PURE__ */ jsx62(Fragment7, { children: hiddenChips.length > 0 && /* @__PURE__ */ jsxs24(Fragment7, { children: [
+  return /* @__PURE__ */ jsx62(Fragment8, { children: hiddenChips.length > 0 && /* @__PURE__ */ jsxs24(Fragment8, { children: [
     /* @__PURE__ */ jsx62(
       Box_default2,
       {
@@ -12050,7 +12052,7 @@ var ChipViewer = ({
 var ChipViewer_default = ChipViewer;
 
 // src/components/card/EnhancedCard.tsx
-import { Fragment as Fragment8, jsx as jsx65, jsxs as jsxs26 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx65, jsxs as jsxs26 } from "react/jsx-runtime";
 var cardWidthBySize = {
   S: 110,
   M: 110,
@@ -12411,7 +12413,7 @@ var EnhancedCard = React32.forwardRef(
               )
             }
           ),
-          isHovered && hoverComponent && /* @__PURE__ */ jsxs26(Fragment8, { children: [
+          isHovered && hoverComponent && /* @__PURE__ */ jsxs26(Fragment9, { children: [
             /* @__PURE__ */ jsx65(
               Box_default2,
               {
@@ -12609,7 +12611,7 @@ var incrementLabelStyles = {
 };
 
 // src/utils/ChartUtils.tsx
-import { Fragment as Fragment10, jsx as jsx68, jsxs as jsxs28 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx68, jsxs as jsxs28 } from "react/jsx-runtime";
 function useTooltipFormatter(chartTooltipEntryFormatter = ({
   seriesName,
   value
@@ -12627,7 +12629,7 @@ function useTooltipFormatter(chartTooltipEntryFormatter = ({
       return tooltipOrder;
     };
     params.sort((a, b) => getOrder(a) - getOrder(b));
-    const tooltip = /* @__PURE__ */ jsxs28(Fragment10, { children: [
+    const tooltip = /* @__PURE__ */ jsxs28(Fragment11, { children: [
       !getTooltip && /* @__PURE__ */ jsx68(Typography_default, { variant: "tooltip", children: params[0].name }),
       params.map((p) => {
         const entry = chartTooltipEntryFormatter({
@@ -13648,7 +13650,7 @@ var DonutChartLegendItem_default = DonutChartLegendItem;
 
 // src/components/chart/DonutChart.tsx
 import { alpha as alpha4 } from "@mui/material/styles";
-import { Fragment as Fragment13, jsx as jsx75, jsxs as jsxs33 } from "react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx75, jsxs as jsxs33 } from "react/jsx-runtime";
 var DonutChart = ({
   style: style3,
   isLoading,
@@ -13814,7 +13816,7 @@ var DonutChart = ({
         flexDirection: "column",
         ...style3
       },
-      children: isLoading ? /* @__PURE__ */ jsx75(Skeleton_default, { variant: "rectangular", height: "100%", width: "100%" }) : /* @__PURE__ */ jsxs33(Fragment13, { children: [
+      children: isLoading ? /* @__PURE__ */ jsx75(Skeleton_default, { variant: "rectangular", height: "100%", width: "100%" }) : /* @__PURE__ */ jsxs33(Fragment14, { children: [
         /* @__PURE__ */ jsxs33(Box_default2, { sx: { flexGrow: 1, position: "relative" }, children: [
           showIcon && /* @__PURE__ */ jsx75(
             Icon_default,
@@ -16269,7 +16271,7 @@ var useTranslation = () => {
 import {
   Dialog as MuiDialog
 } from "@mui/material";
-import { Fragment as Fragment15, jsx as jsx83, jsxs as jsxs39 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx83, jsxs as jsxs39 } from "react/jsx-runtime";
 var sizes5 = {
   S: "480px",
   M: "640px",
@@ -16292,7 +16294,7 @@ var Dialog = ({
   ...rest
 }) => {
   const { palette: palette2 } = useCustomTheme();
-  const getDialogContent = () => /* @__PURE__ */ jsxs39(Fragment15, { children: [
+  const getDialogContent = () => /* @__PURE__ */ jsxs39(Fragment16, { children: [
     /* @__PURE__ */ jsxs39(
       Stack_default,
       {
@@ -18399,23 +18401,23 @@ function formatPhone(phone, format2) {
 }
 
 // src/components/formatter/CompactNumberFormatter.tsx
-import { Fragment as Fragment16, jsx as jsx87 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx87 } from "react/jsx-runtime";
 var CompactNumberFormatter = ({ value }) => {
   const { locale } = React40.useContext(IntlContext);
-  return /* @__PURE__ */ jsx87(Fragment16, { children: formatCompactNumber(value, locale) });
+  return /* @__PURE__ */ jsx87(Fragment17, { children: formatCompactNumber(value, locale) });
 };
 var CompactNumberFormatter_default = CompactNumberFormatter;
 
 // src/components/formatter/CurrencyFormatter.tsx
 import * as React41 from "react";
-import { Fragment as Fragment17, jsx as jsx88 } from "react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx88 } from "react/jsx-runtime";
 var CurrencyFormatter = ({
   value,
   notation,
   currency
 }) => {
   const { locale, currency: contextCurrency } = React41.useContext(IntlContext);
-  return /* @__PURE__ */ jsx88(Fragment17, { children: formatCurrency(
+  return /* @__PURE__ */ jsx88(Fragment18, { children: formatCurrency(
     value,
     locale,
     currency ?? contextCurrency,
@@ -18426,37 +18428,37 @@ var CurrencyFormatter_default = CurrencyFormatter;
 
 // src/components/formatter/NumberFormatter.tsx
 import * as React42 from "react";
-import { Fragment as Fragment18, jsx as jsx89 } from "react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx89 } from "react/jsx-runtime";
 var NumberFormatter = ({ value, fractionSize }) => {
   const { locale } = React42.useContext(IntlContext);
-  return /* @__PURE__ */ jsx89(Fragment18, { children: formatNumber(value, locale, fractionSize) });
+  return /* @__PURE__ */ jsx89(Fragment19, { children: formatNumber(value, locale, fractionSize) });
 };
 var NumberFormatter_default = NumberFormatter;
 
 // src/components/formatter/PercentageFormatter.tsx
 import * as React43 from "react";
-import { Fragment as Fragment19, jsx as jsx90 } from "react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx90 } from "react/jsx-runtime";
 var PercentageFormatter = ({
   value,
   fractionSize
 }) => {
   const { locale } = React43.useContext(IntlContext);
-  return /* @__PURE__ */ jsx90(Fragment19, { children: formatPercentage(value, locale, fractionSize) });
+  return /* @__PURE__ */ jsx90(Fragment20, { children: formatPercentage(value, locale, fractionSize) });
 };
 var PercentageFormatter_default = PercentageFormatter;
 
 // src/components/formatter/DateFormatter.tsx
 import * as React44 from "react";
-import { Fragment as Fragment20, jsx as jsx91 } from "react/jsx-runtime";
+import { Fragment as Fragment21, jsx as jsx91 } from "react/jsx-runtime";
 var DateFormatter = ({ date, format: format2 }) => {
   const { locale, timezone } = React44.useContext(IntlContext);
-  return /* @__PURE__ */ jsx91(Fragment20, { children: formatDate(date, locale, timezone, format2) });
+  return /* @__PURE__ */ jsx91(Fragment21, { children: formatDate(date, locale, timezone, format2) });
 };
 var DateFormatter_default = DateFormatter;
 
 // src/components/formatter/PhoneFormatter.tsx
-import { Fragment as Fragment21, jsx as jsx92 } from "react/jsx-runtime";
-var PhoneFormatter = ({ phone, format: format2 }) => /* @__PURE__ */ jsx92(Fragment21, { children: formatPhone(phone, format2) });
+import { Fragment as Fragment22, jsx as jsx92 } from "react/jsx-runtime";
+var PhoneFormatter = ({ phone, format: format2 }) => /* @__PURE__ */ jsx92(Fragment22, { children: formatPhone(phone, format2) });
 var PhoneFormatter_default = PhoneFormatter;
 
 // src/components/header/HeaderTitle.tsx
@@ -19288,7 +19290,7 @@ var InputHelperText = React51.forwardRef(
 var InputHelperText_default = InputHelperText;
 
 // src/components/input/TextField.tsx
-import { Fragment as Fragment22, jsx as jsx101, jsxs as jsxs45 } from "react/jsx-runtime";
+import { Fragment as Fragment23, jsx as jsx101, jsxs as jsxs45 } from "react/jsx-runtime";
 var commonInputStylesOptions = {
   shouldForwardProp: (prop) => prop !== "variant" && prop !== "typographyVariant"
 };
@@ -19550,7 +19552,7 @@ var TextField = React52.forwardRef(function TextField2({
       ]
     }
   );
-  return /* @__PURE__ */ jsxs45(Fragment22, { children: [
+  return /* @__PURE__ */ jsxs45(Fragment23, { children: [
     label && /* @__PURE__ */ jsx101(
       InputLabel_default,
       {
@@ -20445,7 +20447,7 @@ var DateIntervalPickerInputs = ({
 var DateIntervalPickerInputs_default = DateIntervalPickerInputs;
 
 // src/components/input/date-interval-picker/DateIntervalRangeSelector.tsx
-import { Fragment as Fragment23, jsx as jsx112, jsxs as jsxs51 } from "react/jsx-runtime";
+import { Fragment as Fragment24, jsx as jsx112, jsxs as jsxs51 } from "react/jsx-runtime";
 var DateIntervalRangeSelector = ({
   state,
   color: color2,
@@ -20761,7 +20763,7 @@ var DateIntervalRangeSelector = ({
     }
     return newState;
   };
-  return /* @__PURE__ */ jsxs51(Fragment23, { children: [
+  return /* @__PURE__ */ jsxs51(Fragment24, { children: [
     /* @__PURE__ */ jsx112(
       Box_default2,
       {
@@ -21353,7 +21355,9 @@ var DateIntervalPickerInputButton = ({
             }
           ),
           value: dateText,
-          disabled
+          disabled,
+          onChange: () => {
+          }
         }
       )
     }
@@ -21463,7 +21467,7 @@ var DateIntervalPicker_default = DateIntervalPicker;
 // src/components/input/SelectPopoverItem.tsx
 import { Grid as Grid2, Stack as Stack9 } from "@mui/material";
 import { lighten as lighten3 } from "@mui/material";
-import { Fragment as Fragment24, jsx as jsx117, jsxs as jsxs55 } from "react/jsx-runtime";
+import { Fragment as Fragment25, jsx as jsx117, jsxs as jsxs55 } from "react/jsx-runtime";
 var bgColorLightCoefficient2 = 0.9;
 var SelectPopoverItem = ({
   onClick,
@@ -21509,7 +21513,7 @@ var SelectPopoverItem = ({
           },
           onClick: () => !disabled && typeof onClick === "function" && onClick(),
           children: [
-            !selectableItemComponent && /* @__PURE__ */ jsxs55(Fragment24, { children: [
+            !selectableItemComponent && /* @__PURE__ */ jsxs55(Fragment25, { children: [
               /* @__PURE__ */ jsxs55(
                 Box_default2,
                 {
@@ -21529,7 +21533,7 @@ var SelectPopoverItem = ({
                           cursor: disabled ? "default" : "pointer"
                         },
                         typographyVariant: "body1",
-                        text: /* @__PURE__ */ jsxs55(Fragment24, { children: [
+                        text: /* @__PURE__ */ jsxs55(Fragment25, { children: [
                           iconId && /* @__PURE__ */ jsx117(
                             Icon_default,
                             {
@@ -22116,7 +22120,7 @@ var DaysOfWeekPicker_default = DaysOfWeekPicker;
 // src/components/input/ColorPicker.tsx
 import * as React65 from "react";
 import GradientColorPicker from "react-best-gradient-color-picker";
-import { Fragment as Fragment25, jsx as jsx121, jsxs as jsxs56 } from "react/jsx-runtime";
+import { Fragment as Fragment26, jsx as jsx121, jsxs as jsxs56 } from "react/jsx-runtime";
 var colorRegex = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$|^rgba?\((\d{1,3}), {0,1}(\d{1,3}), {0,1}(\d{1,3})(, {0,1}([01]|0?\.\d+))?\)$/;
 var isValidColor = (color2) => colorRegex.test(color2);
 var colorPickerDefaultColors = [
@@ -22255,7 +22259,7 @@ var ColorPicker = React65.forwardRef(function ColorPickerWrapper({
       };
     }
   }, [anchorEl]);
-  return /* @__PURE__ */ jsxs56(Fragment25, { children: [
+  return /* @__PURE__ */ jsxs56(Fragment26, { children: [
     /* @__PURE__ */ jsx121(
       TextField_default,
       {
@@ -22644,7 +22648,7 @@ var CategorizedPickerGroupItem = function CategorizedPickerGroupItem2({
 var CategorizedPickerGroupItem_default = CategorizedPickerGroupItem;
 
 // src/components/input/categorized-picker/CategorizedPickerItem.tsx
-import { Fragment as Fragment26, jsx as jsx126, jsxs as jsxs58 } from "react/jsx-runtime";
+import { Fragment as Fragment27, jsx as jsx126, jsxs as jsxs58 } from "react/jsx-runtime";
 var CategorizedPickerItem = function CategorizedPickerItem2({
   option,
   selectedId,
@@ -22662,7 +22666,7 @@ var CategorizedPickerItem = function CategorizedPickerItem2({
       behavior: "smooth"
     });
   };
-  return /* @__PURE__ */ jsxs58(Fragment26, { children: [
+  return /* @__PURE__ */ jsxs58(Fragment27, { children: [
     option.categorizedPickerItemType === "option" && /* @__PURE__ */ jsx126(
       CategorizedPickerOptionItem_default,
       {
@@ -22702,18 +22706,18 @@ var CategorizedPickerItem_default = CategorizedPickerItem;
 
 // src/components/input/categorized-picker/CategorizedPickerEmptyCategoryPanel.tsx
 import { Stack as Stack10 } from "@mui/material";
-import { Fragment as Fragment27, jsx as jsx127 } from "react/jsx-runtime";
+import { Fragment as Fragment28, jsx as jsx127 } from "react/jsx-runtime";
 var CategorizedPickerEmptyCategoryPanel = function CategorizedPickerEmptyCategoryPanel2({
   selectedCategory,
   isEmptyCategories
 }) {
   const { t } = useTranslation();
-  return /* @__PURE__ */ jsx127(Fragment27, { children: !selectedCategory?.emptyData ? /* @__PURE__ */ jsx127(Stack10, { padding: "12px", alignItems: "center", children: /* @__PURE__ */ jsx127(Typography_default, { variant: "body2", color: grey600, children: isEmptyCategories ? t("CATEGORIZED_PICKER.NO_RESULTS") : t("CATEGORIZED_PICKER.NO_OPTIONS") }) }) : selectedCategory.emptyData });
+  return /* @__PURE__ */ jsx127(Fragment28, { children: !selectedCategory?.emptyData ? /* @__PURE__ */ jsx127(Stack10, { padding: "12px", alignItems: "center", children: /* @__PURE__ */ jsx127(Typography_default, { variant: "body2", color: grey600, children: isEmptyCategories ? t("CATEGORIZED_PICKER.NO_RESULTS") : t("CATEGORIZED_PICKER.NO_OPTIONS") }) }) : selectedCategory.emptyData });
 };
 var CategorizedPickerEmptyCategoryPanel_default = CategorizedPickerEmptyCategoryPanel;
 
 // src/components/input/categorized-picker/CategorizedPickerCategoryPanel.tsx
-import { Fragment as Fragment28, jsx as jsx128 } from "react/jsx-runtime";
+import { Fragment as Fragment29, jsx as jsx128 } from "react/jsx-runtime";
 var CategorizedPickerCategoryPanel = function CategorizedPickerCategoryPanel2({
   value,
   selectedCategory,
@@ -22800,7 +22804,7 @@ var CategorizedPickerCategoryPanel = function CategorizedPickerCategoryPanel2({
     result.push(...getGroups(withGroup));
     return result;
   };
-  return /* @__PURE__ */ jsx128(Fragment28, { children: !selectedCategory || !categoryOptions?.length ? /* @__PURE__ */ jsx128(
+  return /* @__PURE__ */ jsx128(Fragment29, { children: !selectedCategory || !categoryOptions?.length ? /* @__PURE__ */ jsx128(
     CategorizedPickerEmptyCategoryPanel_default,
     {
       selectedCategory,
@@ -22832,7 +22836,7 @@ function orderOptions(a, b) {
 var CategorizedPickerCategoryPanel_default = CategorizedPickerCategoryPanel;
 
 // src/components/input/categorized-picker/CategorizedPicker.tsx
-import { Fragment as Fragment29, jsx as jsx129, jsxs as jsxs59 } from "react/jsx-runtime";
+import { Fragment as Fragment30, jsx as jsx129, jsxs as jsxs59 } from "react/jsx-runtime";
 var ChevronIcon2 = ({ disabled }) => /* @__PURE__ */ jsx129(
   Icon_default,
   {
@@ -22936,7 +22940,7 @@ var CategorizedPicker = function CategorizedPicker2({
       setSelectedCategory(filteredSelectedCategory);
     }
   }, [filteredCategories, selectedCategory]);
-  return /* @__PURE__ */ jsxs59(Fragment29, { children: [
+  return /* @__PURE__ */ jsxs59(Fragment30, { children: [
     /* @__PURE__ */ jsx129(
       Select3,
       {
@@ -23148,6 +23152,7 @@ var SelectPopover = function SelectPopover2({
   onCancel,
   onLoadMore,
   onSearch,
+  onPendingSelectionChange,
   debounce = 500,
   multiple = false,
   hasMore = false,
@@ -23258,25 +23263,31 @@ var SelectPopover = function SelectPopover2({
       updatedCurrentItems[previousSelectedIndex].color = originalColor2;
     }
     setCurrentItems(updatedCurrentItems);
+    let newCurrentSelectedItems;
     if (updatedItem.selected) {
       if (multiple) {
-        setCurrentSelectedItems(
-          currentSelectedItems.concat(updatedItem.id)
+        newCurrentSelectedItems = currentSelectedItems.concat(
+          updatedItem.id
         );
       } else {
-        setCurrentSelectedItems([updatedItem.id]);
+        newCurrentSelectedItems = [updatedItem.id];
       }
     } else {
       if (multiple) {
-        setCurrentSelectedItems(
-          currentSelectedItems.filter(
-            (selectedItemId) => selectedItemId !== item.id
-          )
+        newCurrentSelectedItems = currentSelectedItems.filter(
+          (selectedItemId) => selectedItemId !== item.id
         );
       } else {
-        setCurrentSelectedItems([]);
+        newCurrentSelectedItems = [];
       }
     }
+    setCurrentSelectedItems(newCurrentSelectedItems);
+    if (onPendingSelectionChange) {
+      onPendingSelectionChange(
+        newCurrentSelectedItems,
+        updatedCurrentItems.map((item2) => item2.id)
+      );
+    }
   };
   return /* @__PURE__ */ jsxs60(
     Popover_default,
@@ -23470,7 +23481,7 @@ var arraysEqual = (a, b) => {
 var SelectPopover_default = SelectPopover;
 
 // src/components/input/ItemSelector.tsx
-import { Fragment as Fragment30, jsx as jsx131, jsxs as jsxs61 } from "react/jsx-runtime";
+import { Fragment as Fragment31, jsx as jsx131, jsxs as jsxs61 } from "react/jsx-runtime";
 var ItemSelector = function ItemSelector2({
   items,
   selectedItems,
@@ -23503,7 +23514,9 @@ var ItemSelector = function ItemSelector2({
   onLoadMore,
   onSearch,
   onClose,
-  getWarningTooltip
+  onOpen,
+  getWarningTooltip,
+  onPendingSelectionChange
 }) {
   const [anchorEl, setAnchorEl] = React71.useState();
   const [searchText, setSearchText] = React71.useState("");
@@ -23533,155 +23546,157 @@ var ItemSelector = function ItemSelector2({
     const selectedItem = selectedItems[0]?.id;
     return selectedItem ? [selectedItem] : "";
   };
-  return /* @__PURE__ */ jsxs61(Fragment30, { children: [
-    /* @__PURE__ */ jsx131(
-      Stack_default,
+  const onOpenSelector = () => {
+    if (selectRef.current) {
+      onOpen && onOpen();
+      setAnchorEl(selectRef.current);
+    }
+  };
+  return /* @__PURE__ */ jsxs61(Fragment31, { children: [
+    /* @__PURE__ */ jsx131(Stack_default, { onClick: onOpenSelector, children: /* @__PURE__ */ jsx131(
+      Select_default,
       {
-        onClick: () => selectRef.current && setAnchorEl(selectRef.current),
-        children: /* @__PURE__ */ jsx131(
-          Select_default,
-          {
-            ref: selectRef,
-            open: false,
-            multiple: isMultiple(),
-            variant,
-            disabled,
-            options: selectedItems.map((item) => ({
-              value: item.id,
-              label: renderChipLabel(item)
-            })),
-            value: getSelectedValue(),
-            renderValue: (value) => {
-              let component;
-              if (!value || !Array.isArray(value) || value.length === 0) {
-                component = /* @__PURE__ */ jsx131(Fragment30, { children: /* @__PURE__ */ jsx131(
-                  Stack_default,
+        ref: selectRef,
+        open: false,
+        multiple: isMultiple(),
+        variant,
+        disabled,
+        options: selectedItems.map((item) => ({
+          value: item.id,
+          label: renderChipLabel(item)
+        })),
+        value: getSelectedValue(),
+        renderValue: (value) => {
+          let component;
+          if (!value || !Array.isArray(value) || value.length === 0) {
+            component = /* @__PURE__ */ jsx131(Fragment31, { children: /* @__PURE__ */ jsx131(
+              Stack_default,
+              {
+                direction: "row",
+                flexWrap: "wrap",
+                padding: "6px 0",
+                children: /* @__PURE__ */ jsx131(
+                  Typography_default,
                   {
-                    direction: "row",
-                    flexWrap: "wrap",
-                    padding: "6px 0",
-                    children: /* @__PURE__ */ jsx131(
-                      Typography_default,
-                      {
-                        variant: "body2",
-                        color: grey600,
-                        children: placeholder
-                      }
-                    )
+                    variant: "body2",
+                    color: grey600,
+                    children: placeholder
                   }
-                ) });
-              } else {
-                component = /* @__PURE__ */ jsxs61(
-                  Stack_default,
-                  {
-                    direction: "row",
-                    alignItems: "center",
-                    gap: "8px",
-                    width: "100%",
-                    justifyContent: "space-between",
-                    children: [
-                      /* @__PURE__ */ jsx131(Stack_default, { flex: 1, children: /* @__PURE__ */ jsx131(
-                        ChipViewer_default,
-                        {
-                          chipSx: {
-                            alignSelf: "center"
-                          },
-                          chipVariant: "dark",
-                          values: value,
-                          ...!disabled && {
-                            onRemoveChip: (event, id) => {
-                              onChange(
-                                selectedItems.filter(
-                                  (i) => i.id !== id
-                                )
-                              );
-                              event.stopPropagation();
-                            }
-                          },
-                          numberLines: 1,
-                          renderChipLabel: (id) => {
-                            const item = selectedItems.find(
-                              (i) => i.id === id
+                )
+              }
+            ) });
+          } else {
+            component = /* @__PURE__ */ jsxs61(
+              Stack_default,
+              {
+                direction: "row",
+                alignItems: "center",
+                gap: "8px",
+                width: "100%",
+                justifyContent: "space-between",
+                children: [
+                  /* @__PURE__ */ jsx131(Stack_default, { flex: 1, minWidth: 0, children: /* @__PURE__ */ jsx131(
+                    ChipViewer_default,
+                    {
+                      chipSx: {
+                        alignSelf: "center"
+                      },
+                      chipVariant: "dark",
+                      values: value,
+                      ...!disabled && {
+                        onRemoveChip: (event, id) => {
+                          onChange(
+                            selectedItems.filter(
+                              (i) => i.id !== id
+                            )
+                          );
+                          event.stopPropagation();
+                        }
+                      },
+                      numberLines: 1,
+                      renderChipLabel: (id) => {
+                        const item = selectedItems.find(
+                          (i) => i.id === id
+                        );
+                        return item ? renderChipLabel(item) : "";
+                      },
+                      getWarningTooltip: (chipId) => {
+                        if (getWarningTooltip) {
+                          const selectedItem = selectedItems.find(
+                            (selectedItem2) => selectedItem2.id === chipId
+                          );
+                          if (selectedItem) {
+                            return getWarningTooltip(
+                              selectedItem
                             );
-                            return item ? renderChipLabel(item) : "";
-                          },
-                          getWarningTooltip: (chipId) => {
-                            if (getWarningTooltip) {
-                              const selectedItem = selectedItems.find(
-                                (selectedItem2) => selectedItem2.id === chipId
-                              );
-                              if (selectedItem) {
-                                return getWarningTooltip(
-                                  selectedItem
-                                );
-                              }
-                            }
-                            return "";
-                          },
-                          forceRecalculate: disabled
+                          }
                         }
-                      ) }),
-                      !disabled && isMultiple() && value.length > 1 && /* @__PURE__ */ jsx131(
-                        Tooltip_default,
+                        return "";
+                      },
+                      forceRecalculate: disabled
+                    }
+                  ) }),
+                  !disabled && isMultiple() && /* @__PURE__ */ jsx131(Stack_default, { minWidth: "32px", children: value.length > 1 && /* @__PURE__ */ jsx131(
+                    Tooltip_default,
+                    {
+                      title: t(
+                        "AUTOCOMPLETE.CLEAR"
+                      ),
+                      children: /* @__PURE__ */ jsx131(
+                        IconButton_default,
                         {
-                          title: t("AUTOCOMPLETE.CLEAR"),
-                          children: /* @__PURE__ */ jsx131(
-                            IconButton_default,
-                            {
-                              iconId: "close",
-                              size: "M",
-                              sx: {
-                                padding: 0
-                              },
-                              onClick: (event) => {
-                                onChange([]);
-                                event.stopPropagation();
-                                event.preventDefault();
-                              },
-                              "data-test": "clear-autocomplete"
-                            }
-                          )
+                          iconId: "close",
+                          size: "M",
+                          sx: {
+                            padding: 0
+                          },
+                          onClick: (event) => {
+                            onChange([]);
+                            event.stopPropagation();
+                            event.preventDefault();
+                          },
+                          "data-test": "clear-autocomplete"
                         }
                       )
-                    ]
-                  }
-                );
+                    }
+                  ) })
+                ]
               }
-              return /* @__PURE__ */ jsxs61(
-                Stack_default,
-                {
-                  direction: "row",
-                  justifyContent: "space-between",
-                  alignItems: "center",
-                  height: "100%",
-                  children: [
-                    component,
-                    /* @__PURE__ */ jsx131(
-                      Divider_default,
-                      {
-                        variant: "middle",
-                        orientation: "vertical",
-                        flexItem: true
-                      }
-                    )
-                  ]
-                }
-              );
-            },
-            sx: {
-              "& .MuiInputBase-input.MuiSelect-select": {
-                height: "34px",
-                lineHeight: "24px"
-              },
-              width: "100%",
-              ...isError ? {
-                borderColor: errorMain
-              } : {}
-            }
+            );
           }
-        )
+          return /* @__PURE__ */ jsxs61(
+            Stack_default,
+            {
+              direction: "row",
+              justifyContent: "space-between",
+              alignItems: "center",
+              height: "100%",
+              children: [
+                component,
+                /* @__PURE__ */ jsx131(
+                  Divider_default,
+                  {
+                    variant: "middle",
+                    orientation: "vertical",
+                    flexItem: true
+                  }
+                )
+              ]
+            }
+          );
+        },
+        sx: {
+          "& .MuiInputBase-input.MuiSelect-select": {
+            height: "34px",
+            lineHeight: "24px"
+          },
+          width: "100%",
+          ...isError ? {
+            borderColor: errorMain
+          } : {}
+        }
       }
-    ),
+    ) }),
     helperText && /* @__PURE__ */ jsx131(InputHelperText_default, { severity: isError ? "error" : "info", children: helperText }),
     /* @__PURE__ */ jsx131(
       SelectPopover_default,
@@ -23735,7 +23750,8 @@ var ItemSelector = function ItemSelector2({
         itemsPerRow,
         itemsTitle,
         selectableItemComponent,
-        paddingContent
+        paddingContent,
+        onPendingSelectionChange
       }
     )
   ] });
@@ -23847,7 +23863,7 @@ var AutocompleteInputSelection = function AutocompleteInputSelection2({
 var AutocompleteInputSelection_default = AutocompleteInputSelection;
 
 // src/components/input/autocomplete/AutocompleteInput.tsx
-import { Fragment as Fragment31, jsx as jsx133, jsxs as jsxs63 } from "react/jsx-runtime";
+import { Fragment as Fragment32, jsx as jsx133, jsxs as jsxs63 } from "react/jsx-runtime";
 var CLEAR_BUTTON_WIDTH = 36;
 var sizes6 = {
   XS: {
@@ -23890,7 +23906,7 @@ var AutocompleteInput = function AutocompleteInput2({
   const [isHover, setIsHover] = React73.useState(false);
   const dirty = !!inputValue || Array.isArray(value) && value.length > 0 || !Array.isArray(value) && !!value;
   const showClearButton = !disabled && dirty && !disableClear && (isOpenPopover || isHover);
-  return /* @__PURE__ */ jsx133(Fragment31, { children: /* @__PURE__ */ jsx133(
+  return /* @__PURE__ */ jsx133(Fragment32, { children: /* @__PURE__ */ jsx133(
     DebouncedTextField_default,
     {
       ref: inputRef,
@@ -24086,7 +24102,7 @@ function getInitialListScroll({
 }
 
 // src/components/input/autocomplete/AutocompleteList.tsx
-import { Fragment as Fragment32, jsx as jsx134, jsxs as jsxs64 } from "react/jsx-runtime";
+import { Fragment as Fragment33, jsx as jsx134, jsxs as jsxs64 } from "react/jsx-runtime";
 var AUTOCOMPLETE_ITEM_HEIGHT = 44;
 var AutocompleteList = function AutocompleteList2({
   options,
@@ -24149,7 +24165,7 @@ var AutocompleteList = function AutocompleteList2({
       option.id
     );
   };
-  return /* @__PURE__ */ jsx134(Fragment32, { children: /* @__PURE__ */ jsx134(
+  return /* @__PURE__ */ jsx134(Fragment33, { children: /* @__PURE__ */ jsx134(
     ClickAwayListener,
     {
       onClickAway: (event) => onClickAwayPopover(
@@ -24222,7 +24238,7 @@ var AutocompleteList = function AutocompleteList2({
 var AutocompleteList_default = AutocompleteList;
 
 // src/components/input/autocomplete/Autocomplete.tsx
-import { Fragment as Fragment33, jsx as jsx135, jsxs as jsxs65 } from "react/jsx-runtime";
+import { Fragment as Fragment34, jsx as jsx135, jsxs as jsxs65 } from "react/jsx-runtime";
 var MIN_AUTOCOMPLETE_WIDTH = "328px";
 var Autocomplete = function Autocomplete2({
   variant = "default",
@@ -24539,7 +24555,7 @@ var Autocomplete = function Autocomplete2({
     setNextIndexByValue(value2);
     onChange && onChange(event, value2);
   };
-  return /* @__PURE__ */ jsxs65(Fragment33, { children: [
+  return /* @__PURE__ */ jsxs65(Fragment34, { children: [
     /* @__PURE__ */ jsx135(
       AutocompleteInput_default,
       {
@@ -24681,7 +24697,7 @@ var CodeEditor_default = React76.forwardRef(CodeEditor);
 
 // src/components/input/CodeEditorPopup.tsx
 import format from "html-format";
-import { Fragment as Fragment34, jsx as jsx137, jsxs as jsxs66 } from "react/jsx-runtime";
+import { Fragment as Fragment35, jsx as jsx137, jsxs as jsxs66 } from "react/jsx-runtime";
 var FORMAT_CHARACTERS_LINE = 120;
 var FORMAT_NUMBER_SPACES_INDENTATION = 2;
 var CodeEditorPopup = ({
@@ -24724,7 +24740,7 @@ var CodeEditorPopup = ({
     " ".repeat(FORMAT_NUMBER_SPACES_INDENTATION),
     FORMAT_CHARACTERS_LINE
   );
-  return /* @__PURE__ */ jsxs66(Fragment34, { children: [
+  return /* @__PURE__ */ jsxs66(Fragment35, { children: [
     readonly && /* @__PURE__ */ jsx137(
       Dialog_default,
       {
@@ -24890,7 +24906,7 @@ var CodeEditorPopup = ({
 var CodeEditorPopup_default = CodeEditorPopup;
 
 // src/components/input/TextEditor.tsx
-import { Fragment as Fragment35, jsx as jsx138, jsxs as jsxs67 } from "react/jsx-runtime";
+import { Fragment as Fragment36, jsx as jsx138, jsxs as jsxs67 } from "react/jsx-runtime";
 var DEFAULT_TOOLBAR_INSERT_MENU_ITEMS = [
   "link",
   "image",
@@ -25176,7 +25192,7 @@ var TextEditor = function TextEditor2({
         };
     }
   };
-  return /* @__PURE__ */ jsxs67(Fragment35, { children: [
+  return /* @__PURE__ */ jsxs67(Fragment36, { children: [
     /* @__PURE__ */ jsx138(
       Editor,
       {
@@ -25233,7 +25249,7 @@ var TextEditor_default = TextEditor;
 
 // src/components/input/PhoneField.tsx
 import * as React79 from "react";
-import { Fragment as Fragment36, jsx as jsx139, jsxs as jsxs68 } from "react/jsx-runtime";
+import { Fragment as Fragment37, jsx as jsx139, jsxs as jsxs68 } from "react/jsx-runtime";
 var maxPhoneLengthWithPrefix = 16;
 var PhoneField = React79.forwardRef(function PhoneField2({
   value,
@@ -25319,7 +25335,7 @@ var PhoneField = React79.forwardRef(function PhoneField2({
       groupElements: true,
       ...rest,
       className: `Cn-PhoneField ${className}`,
-      startAdornment: /* @__PURE__ */ jsxs68(Fragment36, { children: [
+      startAdornment: /* @__PURE__ */ jsxs68(Fragment37, { children: [
         rest.startAdornment,
         select
       ] }),
@@ -25754,7 +25770,7 @@ var DatePickerPopover = ({
 var DatePickerPopover_default = DatePickerPopover;
 
 // src/components/input/DatePicker.tsx
-import { Fragment as Fragment37, jsx as jsx143, jsxs as jsxs71 } from "react/jsx-runtime";
+import { Fragment as Fragment38, jsx as jsx143, jsxs as jsxs71 } from "react/jsx-runtime";
 var DatePicker = React82.forwardRef(
   function DatePicker2({ value, onChange, onBlur, onKeyDown, minDate, maxDate, ...rest }, ref) {
     const { locale, timezone } = React82.useContext(IntlContext);
@@ -25830,7 +25846,7 @@ var DatePicker = React82.forwardRef(
       const text = value && !isNaN(value.getTime()) ? tz10(value, timezone).format(dateInputFormat) : "";
       setTextValue(text);
     }, [dateInputFormat, timezone, value]);
-    return /* @__PURE__ */ jsxs71(Fragment37, { children: [
+    return /* @__PURE__ */ jsxs71(Fragment38, { children: [
       /* @__PURE__ */ jsx143(
         TextField_default,
         {
@@ -25873,7 +25889,7 @@ var DatePicker_default = DatePicker;
 // src/components/input/Checkbox.tsx
 import MuiCheckbox from "@mui/material/Checkbox";
 import { FormControlLabel, FormGroup } from "@mui/material";
-import { Fragment as Fragment38, jsx as jsx144, jsxs as jsxs72 } from "react/jsx-runtime";
+import { Fragment as Fragment39, jsx as jsx144, jsxs as jsxs72 } from "react/jsx-runtime";
 var MaterialCheckbox = ({
   checked,
   disabled,
@@ -25906,7 +25922,7 @@ var Checkbox = ({
   inputClass,
   onChange,
   tabIndex
-}) => /* @__PURE__ */ jsxs72(Fragment38, { children: [
+}) => /* @__PURE__ */ jsxs72(Fragment39, { children: [
   !label && /* @__PURE__ */ jsx144(
     MaterialCheckbox,
     {
@@ -25948,7 +25964,7 @@ var Checkbox_default = Checkbox;
 import * as React83 from "react";
 import MuiRadio from "@mui/material/Radio";
 import { FormControlLabel as FormControlLabel2 } from "@mui/material";
-import { Fragment as Fragment39, jsx as jsx145, jsxs as jsxs73 } from "react/jsx-runtime";
+import { Fragment as Fragment40, jsx as jsx145, jsxs as jsxs73 } from "react/jsx-runtime";
 var Radio = React83.forwardRef(function Radio2({
   label,
   labelPlacement = "end",
@@ -25985,7 +26001,7 @@ var Radio = React83.forwardRef(function Radio2({
       size: size === "S" ? "small" : "medium"
     }
   );
-  return /* @__PURE__ */ jsxs73(Fragment39, { children: [
+  return /* @__PURE__ */ jsxs73(Fragment40, { children: [
     !label && radio,
     label && /* @__PURE__ */ jsx145(
       FormControlLabel2,
@@ -26638,7 +26654,7 @@ var MarkdownRenderer_default = MarkdownRenderer;
 
 // src/components/navbar/Navbar.tsx
 import { Drawer as Drawer2 } from "@mui/material";
-import { Fragment as Fragment40, jsx as jsx153, jsxs as jsxs78 } from "react/jsx-runtime";
+import { Fragment as Fragment41, jsx as jsx153, jsxs as jsxs78 } from "react/jsx-runtime";
 var Navbar = ({
   topContent,
   bottomContent,
@@ -26646,7 +26662,7 @@ var Navbar = ({
   drawerBottomContent,
   onClose,
   isDrawerOpen = false
-}) => /* @__PURE__ */ jsxs78(Fragment40, { children: [
+}) => /* @__PURE__ */ jsxs78(Fragment41, { children: [
   /* @__PURE__ */ jsxs78(
     Box_default2,
     {
@@ -26870,7 +26886,7 @@ var NavbarLogo_default = NavbarLogo;
 
 // src/components/overlay/DonutFocusOverlay.tsx
 import * as React89 from "react";
-import { Fragment as Fragment41, jsx as jsx157, jsxs as jsxs80 } from "react/jsx-runtime";
+import { Fragment as Fragment42, jsx as jsx157, jsxs as jsxs80 } from "react/jsx-runtime";
 var DonutFocusOverlay = ({
   isVisible,
   elementRef,
@@ -26911,7 +26927,7 @@ 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__ */ jsxs80(Fragment41, { children: [
+  return /* @__PURE__ */ jsxs80(Fragment42, { children: [
     /* @__PURE__ */ jsx157(
       Box_default2,
       {
@@ -26956,7 +26972,7 @@ var DonutFocusOverlay = ({
 var DonutFocusOverlay_default = DonutFocusOverlay;
 
 // src/components/pager/Pager.tsx
-import { Fragment as Fragment42, jsx as jsx158, jsxs as jsxs81 } from "react/jsx-runtime";
+import { Fragment as Fragment43, jsx as jsx158, jsxs as jsxs81 } from "react/jsx-runtime";
 var Pager = ({
   page,
   pageSize,
@@ -26982,7 +26998,7 @@ var Pager = ({
         sx: { minWidth: 78 }
       }
     ),
-    allowedPageSizes && /* @__PURE__ */ jsxs81(Fragment42, { children: [
+    allowedPageSizes && /* @__PURE__ */ jsxs81(Fragment43, { children: [
       /* @__PURE__ */ jsx158(Label, { children: t("PAGER.ROWS_PER_PAGE") }),
       /* @__PURE__ */ jsx158(
         Select_default,
@@ -28626,7 +28642,7 @@ var WidgetTitle_default = WidgetTitle;
 
 // src/components/window/MinimizableWindow.tsx
 import * as React98 from "react";
-import { Fragment as Fragment43, jsx as jsx185, jsxs as jsxs89 } from "react/jsx-runtime";
+import { Fragment as Fragment44, jsx as jsx185, jsxs as jsxs89 } from "react/jsx-runtime";
 var sizes7 = {
   M: 400,
   L: 500,
@@ -28744,12 +28760,12 @@ var MinimizableWindow = React98.forwardRef(function MinimizableWindow2({
       }
     }, 750);
   };
-  return /* @__PURE__ */ jsxs89(Fragment43, { children: [
+  return /* @__PURE__ */ jsxs89(Fragment44, { children: [
     isDraggingState && /* @__PURE__ */ jsx185(
       Box_default2,
       {
         sx: {
-          position: "absolute",
+          position: "fixed",
           zIndex: 999999,
           width: window.innerWidth,
           height: window.innerHeight,
@@ -28766,7 +28782,7 @@ var MinimizableWindow = React98.forwardRef(function MinimizableWindow2({
       {
         ref: overlayRef,
         sx: {
-          position: "absolute",
+          position: "fixed",
           zIndex: 999998,
           bottom: "8px",
           left: window.innerWidth / 2 - sizes7[size] / 2,