@connectif/ui-components 5.4.2 → 5.5.1

package/dist/index.js

@@ -8170,8 +8170,7 @@ var BaseListItem = ({
           {
             sx: {
               flexGrow: 1,
-              width: "100%",
-              overflow: "auto"
+              width: "100%"
             },
             children: children ? children : /* @__PURE__ */ jsxs2(Fragment2, { children: [
               /* @__PURE__ */ jsx7(
@@ -19093,13 +19092,13 @@ var TextFieldContainer = React49.forwardRef(function TextFieldContainer2({
         display: "flex",
         alignItems: multiline ? "start" : "center",
         gap: "8px",
-        backgroundColor: variant === "default" ? palette2.common.white : "transparent",
+        backgroundColor: variant === "default" ? disabled ? palette2.grey[50] : palette2.common.white : "transparent",
         width: "100%",
         minHeight: "36px",
         overflow: "hidden",
         border: variant === "default" ? `1px solid ${palette2.grey[200]}` : "none",
         borderRadius: variant === "default" ? "4px" : 0,
-        color: isFocused ? effectiveActiveColor : palette2.grey[400],
+        color: disabled ? palette2.grey[500] : isFocused ? effectiveActiveColor : palette2.grey[400],
         padding: variant === "default" ? "1px 1px 1px 7px" : "2px 2px 2px 8px",
         boxSizing: "border-box",
         justifyContent: "end",
@@ -19111,9 +19110,6 @@ var TextFieldContainer = React49.forwardRef(function TextFieldContainer2({
           borderColor: palette2.error.main,
           color: palette2.error.main
         },
-        ...disabled && {
-          opacity: 0.5
-        },
         ...highlighted && {
           backgroundColor: lighten(effectiveActiveColor, 0.6)
         },
@@ -19243,22 +19239,22 @@ import { Fragment as Fragment22, jsx as jsx101, jsxs as jsxs45 } from "react/jsx
 var commonInputStylesOptions = {
   shouldForwardProp: (prop) => prop !== "variant" && prop !== "typographyVariant"
 };
-function getCommonInputStyles({ palette: palette2 }, { disabled, typographyVariant }) {
+function getCommonInputStyles({ palette: palette2 }, { disabled, typographyVariant, readOnly }) {
   return {
     ...variants[typographyVariant ?? "body2"],
-    backgroundColor: "transparent",
+    backgroundColor: disabled || readOnly ? palette2.grey[50] : "transparent",
     display: "block",
     width: "0",
     minWidth: "64px",
     flexGrow: 1,
     border: "none",
-    color: disabled ? palette2.grey[600] : palette2.grey[800],
+    color: disabled ? palette2.grey[500] : palette2.grey[900],
     boxSizing: "border-box",
     outline: "none",
     padding: "6px 0",
     textOverflow: "ellipsis",
     "&::placeholder": {
-      color: palette2.grey[600]
+      color: palette2.grey[500]
     }
   };
 }
@@ -19362,7 +19358,7 @@ var TextField = React52.forwardRef(function TextField2({
       isError,
       multiline,
       sx: {
-        backgroundColor: readOnly ? palette2.grey[50] : "transparent",
+        backgroundColor: disabled || readOnly ? palette2.grey[50] : "transparent",
         ...sx
       },
       onClick: onContainerClick,
@@ -20214,7 +20210,7 @@ var ExtendedTextField = ({
   InputProps,
   error,
   ...rest
-}) => /* @__PURE__ */ jsx110(TextField_default, { ...inputProps, ...rest });
+}) => /* @__PURE__ */ jsx110(TextField_default, { ...rest, ...inputProps, readOnly: InputProps.readOnly });
 var TimeField = function TimeField2({
   onChange,
   value,
@@ -21265,6 +21261,16 @@ var BootstrapInput = styled7(InputBase, {
   backgroundColor: "white",
   cursor: "default",
   maxWidth: "100%",
+  "&.Mui-disabled": {
+    backgroundColor: palette2.grey[50],
+    ".MuiSelect-select": {
+      color: palette2.grey[500],
+      WebkitTextFillColor: palette2.grey[500],
+      span: {
+        color: "inherit !important"
+      }
+    }
+  },
   "& .MuiInputBase-input.MuiSelect-select": {
     ...variants["button-medium"],
     padding: "0 36px 0 12px !important",
@@ -21296,7 +21302,7 @@ var ChevronIcon = ({ disabled = false }) => {
       sx: {
         marginLeft: "-24px !important",
         transform: "translateX(-8px) !important",
-        color: disabled ? `${palette2.grey[400]} !important` : palette2.grey[800]
+        color: disabled ? `${palette2.grey[500]} !important` : palette2.grey[800]
       }
     }
   );
@@ -22010,42 +22016,90 @@ var normalizeBlack = (color2) => {
 };
 
 // src/components/input/UploadClickableArea.tsx
+import * as React64 from "react";
 import { Box as Box3 } from "@mui/material";
 import { jsx as jsx119, jsxs as jsxs55 } from "react/jsx-runtime";
 var UploadClickableArea = ({
   accept,
   onFilesChanged,
-  children
-}) => /* @__PURE__ */ jsxs55(
-  Box3,
-  {
-    component: "label",
-    style: {
-      cursor: "pointer",
-      display: "inline-block"
+  children,
+  draggingOverElement
+}) => {
+  const [isDraggingOver, setIsDraggingOver] = React64.useState(false);
+  const handleDrop = React64.useCallback(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
+        onFilesChanged(e.dataTransfer.files);
+        e.dataTransfer.clearData();
+      }
+      setIsDraggingOver(false);
     },
-    children: [
-      /* @__PURE__ */ jsx119(
-        "input",
-        {
-          type: "file",
-          accept,
-          hidden: true,
-          onChange: (e) => e?.target?.files && onFilesChanged(e?.target?.files)
-        }
-      ),
-      children
-    ]
-  }
-);
+    [onFilesChanged]
+  );
+  const handleDragOver = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsDraggingOver(true);
+  };
+  const handleDragLeave = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsDraggingOver(false);
+  };
+  return /* @__PURE__ */ jsxs55(
+    Box3,
+    {
+      component: "label",
+      onDrop: handleDrop,
+      onDragOver: handleDragOver,
+      onDragLeave: handleDragLeave,
+      style: {
+        cursor: "pointer",
+        display: "inline-block"
+      },
+      children: [
+        /* @__PURE__ */ jsx119(
+          "input",
+          {
+            type: "file",
+            accept,
+            hidden: true,
+            onChange: (e) => e?.target?.files && onFilesChanged(e?.target?.files)
+          }
+        ),
+        /* @__PURE__ */ jsxs55(Box3, { position: "relative", sx: { pointerEvents: "none" }, children: [
+          children,
+          isDraggingOver && draggingOverElement && /* @__PURE__ */ jsx119(
+            Box3,
+            {
+              position: "absolute",
+              top: "0",
+              left: "0",
+              width: "100%",
+              height: "100%",
+              zIndex: "1",
+              "data-testid": "upload-clickable-area-dragging-over-component-container",
+              sx: {
+                pointerEvents: "none"
+              },
+              children: draggingOverElement
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
 var UploadClickableArea_default = UploadClickableArea;
 
 // src/components/input/categorized-picker/CategorizedPicker.tsx
-import React66 from "react";
+import React67 from "react";
 import { Grid as Grid3, Popover as Popover2, Select as Select3, Stack as Stack11 } from "@mui/material";
 
 // src/components/input/categorized-picker/CategorizedPickerOptionItem.tsx
-import * as React64 from "react";
+import * as React65 from "react";
 import { jsx as jsx120 } from "react/jsx-runtime";
 var CategorizedPickerOptionItem = function CategorizedPickerOptionItem2({
   option,
@@ -22056,8 +22110,8 @@ var CategorizedPickerOptionItem = function CategorizedPickerOptionItem2({
   onSelect,
   onScrollToItem
 }) {
-  const itemRef = React64.useRef(null);
-  React64.useEffect(() => {
+  const itemRef = React65.useRef(null);
+  React65.useEffect(() => {
     if (selectedId === option.id && itemRef.current) {
       onScrollToItem(itemRef.current);
     }
@@ -22130,7 +22184,7 @@ var CategorizedPickerSubcategoryItem = function CategorizedPickerSubcategoryItem
 var CategorizedPickerSubcategoryItem_default = CategorizedPickerSubcategoryItem;
 
 // src/components/input/categorized-picker/CategorizedPickerGroupItem.tsx
-import * as React65 from "react";
+import * as React66 from "react";
 import { jsx as jsx122 } from "react/jsx-runtime";
 var CategorizedPickerGroupItem = function CategorizedPickerGroupItem2({
   option,
@@ -22141,7 +22195,7 @@ var CategorizedPickerGroupItem = function CategorizedPickerGroupItem2({
   onSelect,
   onScrollToItem
 }) {
-  const [isCollapsed, setCollapsed] = React65.useState(
+  const [isCollapsed, setCollapsed] = React66.useState(
     !searchText && !option.options.some(
       (opt) => opt.categorizedPickerItemType === "option" && opt.id === selectedId
     )
@@ -22414,13 +22468,13 @@ var CategorizedPicker = function CategorizedPicker2({
   onChange
 }) {
   const { t } = useTranslation();
-  const categoryRefs = React66.useRef(
+  const categoryRefs = React67.useRef(
     {}
   );
-  const anchorRef = React66.useRef(null);
-  const [open, setOpen] = React66.useState(false);
-  const [search, setSearch] = React66.useState("");
-  const unfilteredCategories = React66.useMemo(
+  const anchorRef = React67.useRef(null);
+  const [open, setOpen] = React67.useState(false);
+  const [search, setSearch] = React67.useState("");
+  const unfilteredCategories = React67.useMemo(
     () => categories.map((category) => ({
       ...category,
       categoryOptions: options.filter(category.filter)
@@ -22429,30 +22483,30 @@ var CategorizedPicker = function CategorizedPicker2({
     ),
     [categories, options]
   );
-  const [filteredCategories, setFilteredCategories] = React66.useState(unfilteredCategories);
-  const getDefaultSelectedCategory = React66.useCallback(
+  const [filteredCategories, setFilteredCategories] = React67.useState(unfilteredCategories);
+  const getDefaultSelectedCategory = React67.useCallback(
     () => filteredCategories.find(
       (category) => category.categoryOptions.some((option) => option.id === value?.id)
     ),
     [filteredCategories, value]
   );
-  const [selectedCategory, setSelectedCategory] = React66.useState(getDefaultSelectedCategory());
-  const onTypeSearch = React66.useCallback(
+  const [selectedCategory, setSelectedCategory] = React67.useState(getDefaultSelectedCategory());
+  const onTypeSearch = React67.useCallback(
     (event) => {
       setSearch(event.target.value);
     },
     []
   );
-  const openPopover = React66.useCallback(() => {
+  const openPopover = React67.useCallback(() => {
     setOpen(true);
     setSearch("");
     setSelectedCategory(getDefaultSelectedCategory());
     onOpen?.();
   }, [getDefaultSelectedCategory, onOpen]);
-  const closePopover = React66.useCallback(() => {
+  const closePopover = React67.useCallback(() => {
     setOpen(false);
   }, []);
-  React66.useEffect(() => {
+  React67.useEffect(() => {
     const tokens = search.split(",").map((s) => s.trim()).filter((s) => !!s);
     if (tokens.length === 0) {
       setFilteredCategories(unfilteredCategories);
@@ -22482,7 +22536,7 @@ var CategorizedPicker = function CategorizedPicker2({
     }).filter((category) => !!category);
     setFilteredCategories(nextCategories);
   }, [categories, options, search, unfilteredCategories]);
-  React66.useEffect(() => {
+  React67.useEffect(() => {
     const filteredSelectedCategory = selectedCategory && filteredCategories.find(
       (category) => category.name === selectedCategory.name
     );
@@ -22689,12 +22743,12 @@ var CategorizedPicker = function CategorizedPicker2({
 var CategorizedPicker_default = CategorizedPicker;
 
 // src/components/input/ItemSelector.tsx
-import * as React68 from "react";
+import * as React69 from "react";
 
 // src/components/input/SelectPopover.tsx
-import * as React67 from "react";
+import * as React68 from "react";
 import { Grid as Grid4, Stack as Stack12 } from "@mui/material";
-import { useState as useState25 } from "react";
+import { useState as useState26 } from "react";
 import InfiniteScroll from "react-infinite-scroll-component";
 import { jsx as jsx127, jsxs as jsxs58 } from "react/jsx-runtime";
 var defaultItemsColorStyles = {
@@ -22728,11 +22782,11 @@ var SelectPopover = function SelectPopover2({
   paddingContent
 }) {
   const { t } = useTranslation();
-  const [searchText, setSearchText] = useState25("");
-  const [isScrollBottom, setIsScrollBottom] = useState25(false);
-  const [currentItems, setCurrentItems] = useState25([]);
-  const [currentSelectedItems, setCurrentSelectedItems] = React67.useState([]);
-  const prevSelectedItemsIdsRef = React67.useRef([]);
+  const [searchText, setSearchText] = useState26("");
+  const [isScrollBottom, setIsScrollBottom] = useState26(false);
+  const [currentItems, setCurrentItems] = useState26([]);
+  const [currentSelectedItems, setCurrentSelectedItems] = React68.useState([]);
+  const prevSelectedItemsIdsRef = React68.useRef([]);
   const onSearchTextChanged = (text) => {
     onSearch(text);
     setSearchText(text);
@@ -22744,7 +22798,7 @@ var SelectPopover = function SelectPopover2({
     }
     setCurrentSelectedItems(selectedItemsIds);
   };
-  React67.useEffect(() => {
+  React68.useEffect(() => {
     const prevSelectedItemsIds = prevSelectedItemsIdsRef.current;
     if (keepCurrentSelectionOnSearch && anchorEl) {
       let nextSelectedItems = currentSelectedItems;
@@ -23050,16 +23104,16 @@ var ItemSelector = function ItemSelector2({
   onSearch,
   onClose
 }) {
-  const [anchorEl, setAnchorEl] = React68.useState();
-  const [searchText, setSearchText] = React68.useState("");
-  const allShownItemsRef = React68.useRef(items);
-  const selectRef = React68.useRef(null);
-  React68.useEffect(() => {
+  const [anchorEl, setAnchorEl] = React69.useState();
+  const [searchText, setSearchText] = React69.useState("");
+  const allShownItemsRef = React69.useRef(items);
+  const selectRef = React69.useRef(null);
+  React69.useEffect(() => {
     if (anchorEl) {
       onSearch(searchText);
     }
   }, [anchorEl, onSearch, searchText]);
-  React68.useEffect(() => {
+  React69.useEffect(() => {
     const allShownItems = allShownItemsRef.current;
     allShownItemsRef.current = allShownItems.concat(
       items.filter(
@@ -23305,7 +23359,7 @@ var ItemSelector = function ItemSelector2({
 var ItemSelector_default = ItemSelector;
 
 // src/components/input/autocomplete/Autocomplete.tsx
-import * as React72 from "react";
+import * as React73 from "react";
 
 // src/utils/RegExpUtils.ts
 var map = {
@@ -23319,10 +23373,10 @@ var map = {
 var toDiacriticInsensitiveString = (input) => Array.from(input).map((char) => map[char] ? `[${map[char]}]` : char).join("");
 
 // src/components/input/autocomplete/AutocompleteInput.tsx
-import * as React70 from "react";
+import * as React71 from "react";
 
 // src/components/input/autocomplete/AutocompleteInputSelection.tsx
-import * as React69 from "react";
+import * as React70 from "react";
 import { jsx as jsx129, jsxs as jsxs60 } from "react/jsx-runtime";
 var AUTOCOMPLETE_PADDING_RIGHT = 6;
 var AutocompleteInputSelection = function AutocompleteInputSelection2({
@@ -23335,7 +23389,7 @@ var AutocompleteInputSelection = function AutocompleteInputSelection2({
   onRemoveValue
 }) {
   const { palette: palette2 } = useCustomTheme();
-  const stackRef = React69.useRef(null);
+  const stackRef = React70.useRef(null);
   return /* @__PURE__ */ jsxs60(
     Stack_default,
     {
@@ -23439,7 +23493,7 @@ var AutocompleteInput = function AutocompleteInput2({
 }) {
   const { palette: palette2 } = useCustomTheme();
   const { t } = useTranslation();
-  const [isHover, setIsHover] = React70.useState(false);
+  const [isHover, setIsHover] = React71.useState(false);
   const dirty = !!inputValue || Array.isArray(value) && value.length > 0 || !Array.isArray(value) && !!value;
   const showClearButton = !disabled && dirty && !disableClear && (isOpenPopover || isHover);
   return /* @__PURE__ */ jsx130(Fragment30, { children: /* @__PURE__ */ jsx130(
@@ -23612,7 +23666,7 @@ var AutocompleteInput = function AutocompleteInput2({
 var AutocompleteInput_default = AutocompleteInput;
 
 // src/components/input/autocomplete/AutocompleteList.tsx
-import * as React71 from "react";
+import * as React72 from "react";
 import { Popper as Popper2, ClickAwayListener } from "@mui/material";
 import { FixedSizeList as FixedSizeList3 } from "react-window";
 import AutoSizer5 from "react-virtualized-auto-sizer";
@@ -23657,7 +23711,7 @@ var AutocompleteList = function AutocompleteList2({
 }) {
   const { palette: palette2 } = useCustomTheme();
   const { t } = useTranslation();
-  const listRef = React71.useRef(null);
+  const listRef = React72.useRef(null);
   const getText = (option) => {
     const isInOptions = options.some((elem) => elem.id === option.id);
     if (!isInOptions) {
@@ -23803,15 +23857,15 @@ var Autocomplete = function Autocomplete2({
   onOpen = () => ({}),
   disableClear
 }) {
-  const anchorRef = React72.useRef(null);
-  const inputRef = React72.useRef(null);
-  const [placeholder, setPlaceholder] = React72.useState(
+  const anchorRef = React73.useRef(null);
+  const inputRef = React73.useRef(null);
+  const [placeholder, setPlaceholder] = React73.useState(
     textFieldProps?.placeholder || ""
   );
-  const _renderLabel = React72.useCallback((id) => id, []);
-  const [inputValue, setInputValue] = React72.useState("");
-  const [isDirty, setDirty] = React72.useState(false);
-  const getOptionsLabeled = React72.useCallback(
+  const _renderLabel = React73.useCallback((id) => id, []);
+  const [inputValue, setInputValue] = React73.useState("");
+  const [isDirty, setDirty] = React73.useState(false);
+  const getOptionsLabeled = React73.useCallback(
     (options2, inputValue2 = "") => {
       const searchValue = escapeRegExp2(inputValue2.trim());
       const regExp = new RegExp(
@@ -23842,7 +23896,7 @@ var Autocomplete = function Autocomplete2({
       renderLabel
     ]
   );
-  const getAllowFreeTextOption = React72.useCallback(
+  const getAllowFreeTextOption = React73.useCallback(
     (inputValue2) => {
       if (allowFreeText) {
         const freeOption = {
@@ -23860,27 +23914,27 @@ var Autocomplete = function Autocomplete2({
     },
     [_renderLabel, allowFreeText, options, renderLabel]
   );
-  const [filteredOptions, setFilteredOptions] = React72.useState(getOptionsLabeled([...options]));
-  const virtualListRef = React72.createRef();
-  const [isOpenPopover, setOpenPopover] = React72.useState(false);
+  const [filteredOptions, setFilteredOptions] = React73.useState(getOptionsLabeled([...options]));
+  const virtualListRef = React73.createRef();
+  const [isOpenPopover, setOpenPopover] = React73.useState(false);
   const getSelectedIndexEmpty = () => multiple ? [] : void 0;
-  const [selectedIndex, setSelectedIndex] = React72.useState(getSelectedIndexEmpty());
-  const [highlightedIndex, setHighlightedIndex] = React72.useState(-1);
-  React72.useEffect(() => {
+  const [selectedIndex, setSelectedIndex] = React73.useState(getSelectedIndexEmpty());
+  const [highlightedIndex, setHighlightedIndex] = React73.useState(-1);
+  React73.useEffect(() => {
     setFilteredOptions(getOptionsLabeled([...options]));
   }, [options]);
   const canAddValues = maxValues === void 0 || maxValues === 0 || !!multiple && Array.isArray(value) && value.length < maxValues;
-  React72.useEffect(() => {
+  React73.useEffect(() => {
     if (disabled) {
       setOpenPopover(false);
     }
   }, [disabled]);
-  React72.useEffect(() => {
+  React73.useEffect(() => {
     if (!canAddValues && isOpenPopover) {
       closePopover();
     }
   }, [canAddValues, isOpenPopover]);
-  const getLastSelectedIndex = React72.useCallback(() => {
+  const getLastSelectedIndex = React73.useCallback(() => {
     if (Array.isArray(selectedIndex) && selectedIndex.length > 0) {
       return selectedIndex[selectedIndex.length - 1];
     } else if (typeof selectedIndex === "number") {
@@ -23888,7 +23942,7 @@ var Autocomplete = function Autocomplete2({
     }
     return void 0;
   }, [selectedIndex]);
-  React72.useEffect(() => {
+  React73.useEffect(() => {
     if (isOpenPopover) {
       if (highlightedIndex > -1) {
         virtualListRef.current?.scrollToItem(highlightedIndex);
@@ -24160,7 +24214,7 @@ function elementIsDescendantOrEqual(parent2, descendant) {
 }
 
 // src/components/input/TextEditor.tsx
-import React75 from "react";
+import React76 from "react";
 import { Editor } from "@tinymce/tinymce-react";
 import "tinymce/tinymce";
 import "tinymce/models/dom/model";
@@ -24181,10 +24235,10 @@ import "tinymce/plugins/wordcount";
 import "tinymce/plugins/emoticons/js/emojis";
 
 // src/components/input/CodeEditorPopup.tsx
-import React74 from "react";
+import React75 from "react";
 
 // src/components/input/CodeEditor.tsx
-import React73 from "react";
+import React74 from "react";
 import CodeMirror, {
   EditorView
 } from "@uiw/react-codemirror";
@@ -24227,7 +24281,7 @@ var CodeEditor = function CodeEditor2({
     }
   );
 };
-var CodeEditor_default = React73.forwardRef(CodeEditor);
+var CodeEditor_default = React74.forwardRef(CodeEditor);
 
 // src/components/input/CodeEditorPopup.tsx
 import format from "html-format";
@@ -24247,9 +24301,9 @@ var CodeEditorPopup = ({
   onCancel
 }) => {
   const { t } = useTranslation();
-  const [valueModified, setValueModified] = React74.useState(value);
-  const [hasErrors, setHasErrors] = React74.useState(false);
-  React74.useEffect(() => {
+  const [valueModified, setValueModified] = React75.useState(value);
+  const [hasErrors, setHasErrors] = React75.useState(false);
+  React75.useEffect(() => {
     if (open) {
       setValueModified(value);
     }
@@ -24479,15 +24533,15 @@ var TextEditor = function TextEditor2({
   ...rest
 }) {
   const { t } = useTranslation();
-  const editorRef = React75.useRef(null);
-  const [internalValue] = React75.useState(
+  const editorRef = React76.useRef(null);
+  const [internalValue] = React76.useState(
     initialValue ?? t("TEXT_EDITOR.INITIAL_VALUE")
   );
-  const [contentValue, setContentValue] = React75.useState("");
-  const [codeEditorChanges, setCodeEditorChanges] = React75.useState("");
-  const [isCodeEditorDirty, setIsCodeEditorDirty] = React75.useState(false);
-  const [isCodeEditorOpened, setIsCodeEditorOpened] = React75.useState(false);
-  const [isDirty, setIsDirty] = React75.useState(false);
+  const [contentValue, setContentValue] = React76.useState("");
+  const [codeEditorChanges, setCodeEditorChanges] = React76.useState("");
+  const [isCodeEditorDirty, setIsCodeEditorDirty] = React76.useState(false);
+  const [isCodeEditorOpened, setIsCodeEditorOpened] = React76.useState(false);
+  const [isDirty, setIsDirty] = React76.useState(false);
   const codeEditorButtonIndexToUse = codeEditorButtonIndex ?? customToolbarGroups.insert?.items?.length ?? DEFAULT_TOOLBAR_INSERT_MENU_ITEMS.length;
   const defaultToolbarInsertMenuItemsWithCodeEditor = DEFAULT_TOOLBAR_INSERT_MENU_ITEMS.slice();
   defaultToolbarInsertMenuItemsWithCodeEditor.splice(
@@ -24501,12 +24555,12 @@ var TextEditor = function TextEditor2({
     0,
     "cnCodeEditor"
   );
-  const onTextChange = React75.useCallback(() => {
+  const onTextChange = React76.useCallback(() => {
     if (editorRef.current) {
       onChange(editorRef.current?.getContent());
     }
   }, [onChange]);
-  const onTextEditorDirty = React75.useCallback(
+  const onTextEditorDirty = React76.useCallback(
     (textEditorDirty) => {
       editorRef.current?.setDirty(textEditorDirty);
       setIsDirty(textEditorDirty);
@@ -24519,7 +24573,7 @@ var TextEditor = function TextEditor2({
     },
     [onDirty, onTextChange]
   );
-  React75.useEffect(() => {
+  React76.useEffect(() => {
     if (resetDirty && editorRef.current?.isDirty()) {
       onTextEditorDirty(false);
     }
@@ -24527,7 +24581,7 @@ var TextEditor = function TextEditor2({
       onResetDirty();
     }
   }, [onResetDirty, onTextEditorDirty, resetDirty]);
-  React75.useEffect(() => {
+  React76.useEffect(() => {
     if (newValue && editorRef.current) {
       editorRef.current.setContent(newValue);
       if (onNewValueSetter) {
@@ -24535,7 +24589,7 @@ var TextEditor = function TextEditor2({
       }
     }
   }, [newValue, onNewValueSetter]);
-  React75.useEffect(() => {
+  React76.useEffect(() => {
     if (forceCloseCodeEditor) {
       setIsCodeEditorOpened(false);
       if (onForceCloseCodeEditor) {
@@ -24782,10 +24836,10 @@ var TextEditor = function TextEditor2({
 var TextEditor_default = TextEditor;
 
 // src/components/input/PhoneField.tsx
-import * as React76 from "react";
+import * as React77 from "react";
 import { Fragment as Fragment35, jsx as jsx136, jsxs as jsxs66 } from "react/jsx-runtime";
 var maxPhoneLengthWithPrefix = 16;
-var PhoneField = React76.forwardRef(function PhoneField2({
+var PhoneField = React77.forwardRef(function PhoneField2({
   value,
   onChange,
   defaultCountryCode = "34",
@@ -24793,20 +24847,20 @@ var PhoneField = React76.forwardRef(function PhoneField2({
   codeSelectProps,
   ...rest
 }, ref) {
-  const [countryCode, setCountryCode] = React76.useState(defaultCountryCode);
-  const [textValue, setTextValue] = React76.useState("");
-  const countryCodeOptions = React76.useMemo(
+  const [countryCode, setCountryCode] = React77.useState(defaultCountryCode);
+  const [textValue, setTextValue] = React77.useState("");
+  const countryCodeOptions = React77.useMemo(
     () => allCountries.map((c) => ({
       value: c.countryCode,
       label: `+${c.countryCode} ${c.name}`
     })),
     []
   );
-  const sanitizeTextValue = React76.useCallback(
+  const sanitizeTextValue = React77.useCallback(
     (value2) => value2.replace(/[^\d]/g, ""),
     []
   );
-  const onChangeText = React76.useCallback(
+  const onChangeText = React77.useCallback(
     (event) => {
       const sanitizedTextValue = sanitizeTextValue(
         event.target.value
@@ -24820,7 +24874,7 @@ var PhoneField = React76.forwardRef(function PhoneField2({
     },
     [countryCode, onChange, sanitizeTextValue, textValue]
   );
-  const onChangeCountryCode = React76.useCallback(
+  const onChangeCountryCode = React77.useCallback(
     (countryCode2) => {
       const sanitizedTextValue = sanitizeTextValue(textValue).substring(
         0,
@@ -24836,7 +24890,7 @@ var PhoneField = React76.forwardRef(function PhoneField2({
     },
     [onChange, sanitizeTextValue, textValue]
   );
-  React76.useEffect(() => {
+  React77.useEffect(() => {
     const countryCode2 = getCountryCode(value);
     if (!countryCode2) {
       setTextValue("");
@@ -24881,7 +24935,7 @@ var PhoneField = React76.forwardRef(function PhoneField2({
 var PhoneField_default = PhoneField;
 
 // src/components/input/NumberField.tsx
-import * as React77 from "react";
+import * as React78 from "react";
 import { jsx as jsx137, jsxs as jsxs67 } from "react/jsx-runtime";
 var setValueAndTriggerChangeEvent = (r2, value) => {
   const propDescriptor = Object.getOwnPropertyDescriptor(
@@ -24898,7 +24952,7 @@ var setValueAndTriggerChangeEvent = (r2, value) => {
     r2.current.dispatchEvent(e);
   }
 };
-var NumberField = React77.forwardRef(function NumberField2({
+var NumberField = React78.forwardRef(function NumberField2({
   value,
   type = "integer",
   onChange,
@@ -24915,16 +24969,16 @@ var NumberField = React77.forwardRef(function NumberField2({
   ...rest
 }, ref) {
   const { palette: palette2 } = useCustomTheme();
-  const inputRef = React77.useRef(null);
-  const numberToString = React77.useCallback(
+  const inputRef = React78.useRef(null);
+  const numberToString = React78.useCallback(
     (value2) => typeof value2 === "number" && !isNaN(value2) ? fractionDigits !== 0 ? value2.toFixed(fractionDigits) : value2.toString() : "",
     [fractionDigits]
   );
-  const stringToNumber = React77.useCallback(
+  const stringToNumber = React78.useCallback(
     (value2) => !value2 || isNaN(+value2) ? null : +value2,
     []
   );
-  const sanitizeDecimalTextValue = React77.useCallback(
+  const sanitizeDecimalTextValue = React78.useCallback(
     (value2) => {
       const negativeSign = value2.charAt(0) === "-" ? "-" : "";
       const numbersAndDots = value2.replace(/[^\d.]/g, "");
@@ -24936,7 +24990,7 @@ var NumberField = React77.forwardRef(function NumberField2({
     },
     [fractionDigits]
   );
-  const sanitizeIntegerTextValue = React77.useCallback(
+  const sanitizeIntegerTextValue = React78.useCallback(
     (value2) => {
       const negativeSign = value2.charAt(0) === "-" ? "-" : "";
       const numbers = value2.replace(/[^\d]/g, "");
@@ -24944,7 +24998,7 @@ var NumberField = React77.forwardRef(function NumberField2({
     },
     []
   );
-  const _onChange = React77.useCallback(
+  const _onChange = React78.useCallback(
     (event) => {
       const sanitizedTextValue = type === "integer" ? sanitizeIntegerTextValue(event.target.value) : sanitizeDecimalTextValue(event.target.value);
       let numericValue = stringToNumber(sanitizedTextValue);
@@ -24974,7 +25028,7 @@ var NumberField = React77.forwardRef(function NumberField2({
       numberToString
     ]
   );
-  const stepUp = React77.useCallback(() => {
+  const stepUp = React78.useCallback(() => {
     if (typeof value === "number" && !isNaN(value)) {
       setValueAndTriggerChangeEvent(
         ref ?? inputRef,
@@ -24987,7 +25041,7 @@ var NumberField = React77.forwardRef(function NumberField2({
       );
     }
   }, [numberToString, ref, step, value]);
-  const stepDown = React77.useCallback(() => {
+  const stepDown = React78.useCallback(() => {
     if (typeof value === "number" && !isNaN(value)) {
       setValueAndTriggerChangeEvent(
         ref ?? inputRef,
@@ -25000,7 +25054,7 @@ var NumberField = React77.forwardRef(function NumberField2({
       );
     }
   }, [numberToString, ref, step, value]);
-  const _onKeyDown = React77.useCallback(
+  const _onKeyDown = React78.useCallback(
     (event) => {
       onKeyDown && onKeyDown(event);
       if (step <= 0) {
@@ -25019,8 +25073,8 @@ var NumberField = React77.forwardRef(function NumberField2({
     },
     [onKeyDown, step, stepDown, stepUp]
   );
-  const [textValue, setTextValue] = React77.useState(numberToString(value));
-  const _onBlur = React77.useCallback(
+  const [textValue, setTextValue] = React78.useState(numberToString(value));
+  const _onBlur = React78.useCallback(
     (event) => {
       onBlur && onBlur(event);
       const text = numberToString(value);
@@ -25082,7 +25136,7 @@ var NumberField = React77.forwardRef(function NumberField2({
       }
     )
   ] }) : endAdornment;
-  React77.useEffect(() => {
+  React78.useEffect(() => {
     if (stringToNumber(textValue) !== value) {
       setTextValue(numberToString(value));
     }
@@ -25103,11 +25157,11 @@ var NumberField = React77.forwardRef(function NumberField2({
 var NumberField_default = NumberField;
 
 // src/components/input/DatePicker.tsx
-import * as React79 from "react";
+import * as React80 from "react";
 import { tz as tz8 } from "moment-timezone";
 
 // src/components/input/DatePickerStatic.tsx
-import * as React78 from "react";
+import * as React79 from "react";
 import { tz as tz7 } from "moment-timezone";
 import { jsx as jsx138, jsxs as jsxs68 } from "react/jsx-runtime";
 var minYear = 1900;
@@ -25118,13 +25172,13 @@ var DatePickerStatic = ({
   minDate,
   maxDate
 }) => {
-  const { timezone } = React78.useContext(IntlContext);
-  const [selectedDateParts, setSelectedDateParts] = React78.useState(void 0);
-  const [visibleMonth, setVisibleMonth] = React78.useState({
+  const { timezone } = React79.useContext(IntlContext);
+  const [selectedDateParts, setSelectedDateParts] = React79.useState(void 0);
+  const [visibleMonth, setVisibleMonth] = React79.useState({
     year: minYear,
     month: 0
   });
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     if (selectedDateParts) {
       setVisibleMonth({
         year: selectedDateParts.year,
@@ -25138,7 +25192,7 @@ var DatePickerStatic = ({
       });
     }
   }, [selectedDateParts, timezone]);
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     if (!value || isNaN(value.getTime())) {
       setSelectedDateParts(void 0);
       return;
@@ -25160,25 +25214,25 @@ var DatePickerStatic = ({
   const endYear = maxDate && !isNaN(maxDate.getTime()) ? maxDate.getFullYear() : maxYear;
   const startMonth = minDate && !isNaN(minDate.getTime()) ? minDate.getMonth() : 0;
   const endMonth = maxDate && !isNaN(maxDate.getTime()) ? maxDate.getMonth() : 11;
-  const options = React78.useMemo(
+  const options = React79.useMemo(
     () => Array.from(Array(endYear - startYear + 1)).map((_, i) => ({
       value: startYear + i
     })),
     [endYear, startYear]
   );
-  const navigatePreviousMonth = React78.useCallback(() => {
+  const navigatePreviousMonth = React79.useCallback(() => {
     setVisibleMonth({
       month: visibleMonth.month === 0 ? 11 : visibleMonth.month - 1,
       year: visibleMonth.month === 0 ? visibleMonth.year - 1 : visibleMonth.year
     });
   }, [visibleMonth]);
-  const navigateNextMonth = React78.useCallback(() => {
+  const navigateNextMonth = React79.useCallback(() => {
     setVisibleMonth({
       month: visibleMonth.month === 11 ? 0 : visibleMonth.month + 1,
       year: visibleMonth.month === 11 ? visibleMonth.year + 1 : visibleMonth.year
     });
   }, [visibleMonth]);
-  const onChangeYear = React78.useCallback(
+  const onChangeYear = React79.useCallback(
     (value2) => {
       const month = value2 === startYear ? Math.max(startMonth, visibleMonth.month) : value2 === endYear ? Math.min(endMonth, visibleMonth.month) : visibleMonth.month;
       setVisibleMonth({
@@ -25188,11 +25242,11 @@ var DatePickerStatic = ({
     },
     [endMonth, endYear, startMonth, startYear, visibleMonth.month]
   );
-  const minSimpleDate = React78.useMemo(
+  const minSimpleDate = React79.useMemo(
     () => dateToSimpleDate(minDate, timezone),
     [minDate, timezone]
   );
-  const maxSimpleDate = React78.useMemo(
+  const maxSimpleDate = React79.useMemo(
     () => dateToSimpleDate(maxDate, timezone),
     [maxDate, timezone]
   );
@@ -25304,18 +25358,18 @@ var DatePickerPopover_default = DatePickerPopover;
 
 // src/components/input/DatePicker.tsx
 import { Fragment as Fragment36, jsx as jsx140, jsxs as jsxs69 } from "react/jsx-runtime";
-var DatePicker = React79.forwardRef(
+var DatePicker = React80.forwardRef(
   function DatePicker2({ value, onChange, onBlur, onKeyDown, minDate, maxDate, ...rest }, ref) {
-    const { locale, timezone } = React79.useContext(IntlContext);
+    const { locale, timezone } = React80.useContext(IntlContext);
     const dateInputFormat = getDateInputFormatForLocale(locale);
     const { t } = useTranslation();
-    const dateInputFormatPlaceholder = React79.useMemo(
+    const dateInputFormatPlaceholder = React80.useMemo(
       () => dateInputFormat.replace(/Y/g, t("DATE_COMPONENTS.YEAR_LETTER")).replace(/M/g, t("DATE_COMPONENTS.MONTH_LETTER")).replace(/D/g, t("DATE_COMPONENTS.DAY_LETTER")),
       [dateInputFormat, t]
     );
-    const _containerRef = React79.useRef(null);
-    const [isPopoverOpen, setPopoverOpen] = React79.useState(false);
-    const [textValue, setTextValue] = React79.useState("");
+    const _containerRef = React80.useRef(null);
+    const [isPopoverOpen, setPopoverOpen] = React80.useState(false);
+    const [textValue, setTextValue] = React80.useState("");
     let anchorEl = null;
     if (isPopoverOpen) {
       if (rest.containerRef && typeof rest.containerRef === "object" && rest.containerRef.current) {
@@ -25324,21 +25378,21 @@ var DatePicker = React79.forwardRef(
         anchorEl = _containerRef.current;
       }
     }
-    const isValidDate = React79.useCallback(
+    const isValidDate = React80.useCallback(
       (dateString) => {
         const date = parseDateForLocale(dateString, locale, timezone);
         return !isNaN(date.getTime()) && (!minDate || date >= minDate) && (!maxDate || date <= maxDate);
       },
       [locale, maxDate, minDate, timezone]
     );
-    const onSelect = React79.useCallback(
+    const onSelect = React80.useCallback(
       (date) => {
         setPopoverOpen(false);
         onChange && onChange(date);
       },
       [onChange]
     );
-    const onChangeTextField = React79.useCallback(
+    const onChangeTextField = React80.useCallback(
       (event) => {
         setTextValue(event.target.value);
         if (!event.target.value && value) {
@@ -25357,7 +25411,7 @@ var DatePicker = React79.forwardRef(
       },
       [isValidDate, locale, onChange, timezone, value]
     );
-    const onBlurTextField = React79.useCallback(
+    const onBlurTextField = React80.useCallback(
       (event) => {
         if (!isValidDate(event.target.value)) {
           value ? onChange && onChange(null) : setTextValue("");
@@ -25366,7 +25420,7 @@ var DatePicker = React79.forwardRef(
       },
       [isValidDate, onChange, onBlur, value]
     );
-    const onKeyDownTextField = React79.useCallback(
+    const onKeyDownTextField = React80.useCallback(
       (event) => {
         if (event.key === "ArrowDown") {
           setPopoverOpen(true);
@@ -25375,7 +25429,7 @@ var DatePicker = React79.forwardRef(
       },
       [onKeyDown]
     );
-    React79.useEffect(() => {
+    React80.useEffect(() => {
       const text = value && !isNaN(value.getTime()) ? tz8(value, timezone).format(dateInputFormat) : "";
       setTextValue(text);
     }, [dateInputFormat, timezone, value]);
@@ -25494,11 +25548,11 @@ var Checkbox = ({
 var Checkbox_default = Checkbox;
 
 // src/components/input/Radio.tsx
-import * as React80 from "react";
+import * as React81 from "react";
 import MuiRadio from "@mui/material/Radio";
 import { FormControlLabel as FormControlLabel2 } from "@mui/material";
 import { Fragment as Fragment38, jsx as jsx142, jsxs as jsxs71 } from "react/jsx-runtime";
-var Radio = React80.forwardRef(function Radio2({
+var Radio = React81.forwardRef(function Radio2({
   label,
   labelPlacement = "end",
   onChange,
@@ -25509,7 +25563,7 @@ var Radio = React80.forwardRef(function Radio2({
   size = "M",
   ...rest
 }, ref) {
-  const _onChange = React80.useCallback(
+  const _onChange = React81.useCallback(
     (event) => {
       onChange && onChange(event, event.target.value);
     },
@@ -25553,7 +25607,7 @@ var Radio = React80.forwardRef(function Radio2({
 var Radio_default = Radio;
 
 // src/components/input/PageSelector.tsx
-import * as React81 from "react";
+import * as React82 from "react";
 import { jsx as jsx143, jsxs as jsxs72 } from "react/jsx-runtime";
 var PageSelector = ({
   currentPage,
@@ -25562,12 +25616,12 @@ var PageSelector = ({
   text,
   onPageChange
 }) => {
-  const handlePrevious = React81.useCallback(() => {
+  const handlePrevious = React82.useCallback(() => {
     if (currentPage > 1) {
       onPageChange(Math.max(1, currentPage - 1));
     }
   }, [currentPage, onPageChange]);
-  const handleNext = React81.useCallback(() => {
+  const handleNext = React82.useCallback(() => {
     onPageChange(
       Math.min(Math.ceil(totalItems / pageSize), currentPage + 1)
     );
@@ -25665,7 +25719,7 @@ var LinearProgress = ({
 var LinearProgress_default = LinearProgress;
 
 // src/components/progress/CircularProgress.tsx
-import * as React82 from "react";
+import * as React83 from "react";
 import MuiCircularProgress from "@mui/material/CircularProgress";
 import Typography3 from "@mui/material/Typography";
 import Box4 from "@mui/material/Box";
@@ -25691,7 +25745,7 @@ var CircularProgress = ({
   typographyColor = black,
   gradientColors
 }) => {
-  const gradientName = React82.useRef(
+  const gradientName = React83.useRef(
     gradientColors ? crypto.randomUUID() : void 0
   );
   return /* @__PURE__ */ jsxs73(
@@ -25982,7 +26036,7 @@ var Loader = ({
 var Loader_default = Loader;
 
 // src/components/markdown/MarkdownRenderer.tsx
-import React83 from "react";
+import React84 from "react";
 import Markdown from "markdown-to-jsx";
 import { styled as styled8 } from "@mui/material/styles";
 import "katex/dist/katex.min.css";
@@ -26125,13 +26179,13 @@ var renderWithMath = (text) => {
   }
   return parts;
 };
-var renderChildrenWithMath = (children) => React83.Children.map(children, (child) => {
+var renderChildrenWithMath = (children) => React84.Children.map(children, (child) => {
   if (typeof child === "string") {
     return renderWithMath(child);
   }
-  if (React83.isValidElement(child)) {
+  if (React84.isValidElement(child)) {
     const element = child;
-    return React83.cloneElement(element, {
+    return React84.cloneElement(element, {
       ...element.props,
       children: renderChildrenWithMath(element.props.children)
     });
@@ -26248,10 +26302,10 @@ var Navbar = ({
 var Navbar_default = Navbar;
 
 // src/components/navbar/NavbarButton.tsx
-import * as React84 from "react";
+import * as React85 from "react";
 import { Box as Box6, ButtonBase as ButtonBase2 } from "@mui/material";
 import { jsx as jsx151, jsxs as jsxs77 } from "react/jsx-runtime";
-var NavbarButton = React84.forwardRef(
+var NavbarButton = React85.forwardRef(
   function NavbarButton2({
     iconId,
     srcUrl,
@@ -26394,10 +26448,10 @@ var NavbarHeader = ({ text }) => /* @__PURE__ */ jsx152(
 var NavbarHeader_default = NavbarHeader;
 
 // src/components/navbar/NavbarLogo.tsx
-import * as React85 from "react";
+import * as React86 from "react";
 import { ButtonBase as ButtonBase3 } from "@mui/material";
 import { jsx as jsx153 } from "react/jsx-runtime";
-var NavbarLogo = React85.forwardRef(
+var NavbarLogo = React86.forwardRef(
   function NavbarButton3({ src, ...rest }, ref) {
     return /* @__PURE__ */ jsx153(
       ButtonBase3,
@@ -26418,7 +26472,7 @@ var NavbarLogo = React85.forwardRef(
 var NavbarLogo_default = NavbarLogo;
 
 // src/components/overlay/DonutFocusOverlay.tsx
-import * as React86 from "react";
+import * as React87 from "react";
 import { Fragment as Fragment40, jsx as jsx154, jsxs as jsxs78 } from "react/jsx-runtime";
 var DonutFocusOverlay = ({
   isVisible,
@@ -26428,8 +26482,8 @@ var DonutFocusOverlay = ({
   chipLabel,
   chipPosition = "right"
 }) => {
-  const [clientRect, setClientRect] = React86.useState();
-  React86.useEffect(() => {
+  const [clientRect, setClientRect] = React87.useState();
+  React87.useEffect(() => {
     if (!elementRef?.current) {
       setClientRect(void 0);
       return;
@@ -26578,17 +26632,17 @@ var Pager_default = Pager;
 
 // src/components/scrollable/HorizontalScrollable.tsx
 import { ButtonBase as ButtonBase4 } from "@mui/material";
-import * as React87 from "react";
+import * as React88 from "react";
 import { jsx as jsx156, jsxs as jsxs80 } from "react/jsx-runtime";
 var HorizontalScrollable = ({
   style: style3,
   children,
   stepDistance = 200
 }) => {
-  const horizontalContainerRef = React87.useRef(null);
-  const [isLeftArrowHidden, setLeftArrowHidden] = React87.useState(true);
-  const [isRightArrowHidden, setRightArrowHidden] = React87.useState(true);
-  React87.useEffect(() => {
+  const horizontalContainerRef = React88.useRef(null);
+  const [isLeftArrowHidden, setLeftArrowHidden] = React88.useState(true);
+  const [isRightArrowHidden, setRightArrowHidden] = React88.useState(true);
+  React88.useEffect(() => {
     if (!horizontalContainerRef.current) {
       return;
     }
@@ -26693,7 +26747,7 @@ var HorizontalScrollable = ({
 var HorizontalScrollable_default = HorizontalScrollable;
 
 // src/components/scrollable/Carousel.tsx
-import * as React88 from "react";
+import * as React89 from "react";
 import { jsx as jsx157, jsxs as jsxs81 } from "react/jsx-runtime";
 var buttonStyles = {
   color: grey800,
@@ -26713,23 +26767,23 @@ function Carousel({
   padding: padding2 = 8,
   alignment = "left"
 }) {
-  const rootRef = React88.useRef(null);
-  const containerRef = React88.useRef(null);
-  const previousClientWidth = React88.useRef(null);
-  const isScrolling = React88.useRef(false);
-  const [isLeftArrowHidden, setLeftArrowHidden] = React88.useState(true);
-  const [isRightArrowHidden, setRightArrowHidden] = React88.useState(true);
-  const [paddingElement, setPaddingElement] = React88.useState();
-  const [visibleCount, setVisibleCount] = React88.useState();
-  const showedElementsRef = React88.useRef(void 0);
-  const updateArrows = React88.useCallback(() => {
+  const rootRef = React89.useRef(null);
+  const containerRef = React89.useRef(null);
+  const previousClientWidth = React89.useRef(null);
+  const isScrolling = React89.useRef(false);
+  const [isLeftArrowHidden, setLeftArrowHidden] = React89.useState(true);
+  const [isRightArrowHidden, setRightArrowHidden] = React89.useState(true);
+  const [paddingElement, setPaddingElement] = React89.useState();
+  const [visibleCount, setVisibleCount] = React89.useState();
+  const showedElementsRef = React89.useRef(void 0);
+  const updateArrows = React89.useCallback(() => {
     if (!showedElementsRef.current) {
       return;
     }
     setLeftArrowHidden(showedElementsRef.current.start === 0);
     setRightArrowHidden(showedElementsRef.current.end === items.length - 1);
   }, [items.length]);
-  const getUsableWidth = React88.useCallback(
+  const getUsableWidth = React89.useCallback(
     (el) => {
       let current = el;
       while (current) {
@@ -26743,7 +26797,7 @@ function Carousel({
     },
     []
   );
-  const resetCarousel = React88.useCallback(
+  const resetCarousel = React89.useCallback(
     (root, container) => {
       root.style.width = "";
       showedElementsRef.current = void 0;
@@ -26751,7 +26805,7 @@ function Carousel({
     },
     []
   );
-  const setMeasures = React88.useCallback(
+  const setMeasures = React89.useCallback(
     (root, container, nextElementsIndex) => {
       const children = Array.from(container.children);
       if (children.length === 0) {
@@ -26780,7 +26834,7 @@ function Carousel({
     },
     [alignment, gap2, getUsableWidth, items.length, padding2]
   );
-  const updateVisibleCount = React88.useCallback(() => {
+  const updateVisibleCount = React89.useCallback(() => {
     const root = rootRef.current;
     const container = containerRef.current;
     if (!container || !parent) {
@@ -26827,7 +26881,7 @@ function Carousel({
     updateArrows,
     resetCarousel
   ]);
-  const getInitialWidth = React88.useCallback(
+  const getInitialWidth = React89.useCallback(
     (el) => {
       let current = el;
       let width2 = 0;
@@ -26845,7 +26899,7 @@ function Carousel({
     },
     []
   );
-  const resizeObserverCallback = React88.useCallback(() => {
+  const resizeObserverCallback = React89.useCallback(() => {
     if (!rootRef.current || !containerRef.current) {
       return;
     }
@@ -26856,7 +26910,7 @@ function Carousel({
     previousClientWidth.current = newClientWidth;
     updateVisibleCount();
   }, [getInitialWidth, updateVisibleCount]);
-  React88.useEffect(() => {
+  React89.useEffect(() => {
     const container = containerRef.current;
     if (!container) {
       return;
@@ -27043,7 +27097,7 @@ import {
 } from "notistack";
 
 // src/components/snackbar/Snackbar.tsx
-import * as React89 from "react";
+import * as React90 from "react";
 import { SnackbarContent } from "notistack";
 import { Typography as Typography4 } from "@mui/material";
 import { jsx as jsx159, jsxs as jsxs82 } from "react/jsx-runtime";
@@ -27071,7 +27125,7 @@ var iconColors = {
   error: error300,
   warning: complementary300
 };
-var Snackbar = React89.forwardRef(
+var Snackbar = React90.forwardRef(
   function Snackbar2({
     severity = "info",
     message,
@@ -27083,10 +27137,10 @@ var Snackbar = React89.forwardRef(
     identifierKey: key,
     dataTestKey
   }, ref) {
-    const actionClickHandler = React89.useCallback(() => {
+    const actionClickHandler = React90.useCallback(() => {
       onActionClick && onActionClick(key);
     }, [onActionClick, key]);
-    const closeClickHandler = React89.useCallback(() => {
+    const closeClickHandler = React90.useCallback(() => {
       onCloseClick && onCloseClick(key);
     }, [onCloseClick, key]);
     return /* @__PURE__ */ jsx159(
@@ -27252,12 +27306,12 @@ var TabButton = ({
 var TabButton_default = TabButton;
 
 // src/components/tab/Tabs.tsx
-import * as React91 from "react";
+import * as React92 from "react";
 import MuiTabs from "@mui/material/Tabs";
 
 // src/components/layout/SwipeableViews.tsx
-import * as React90 from "react";
-import { useEffect as useEffect25, useRef as useRef30, useState as useState36 } from "react";
+import * as React91 from "react";
+import { useEffect as useEffect25, useRef as useRef30, useState as useState37 } from "react";
 import { jsx as jsx162 } from "react/jsx-runtime";
 var styles = {
   container: {
@@ -27294,7 +27348,7 @@ function SwipeableViews({
   const containerRef = useRef30(null);
   const scrollTimeout = useRef30(null);
   const scrollingMethod = useRef30("none");
-  const [previousIndex, setPreviousIndex] = useState36(index);
+  const [previousIndex, setPreviousIndex] = useState37(index);
   const hideScrollAnimation = useRef30(true);
   useEffect25(() => {
     if (containerRef.current) {
@@ -27356,9 +27410,9 @@ function SwipeableViews({
           );
         }, 100);
       },
-      children: React90.Children.map(children, (child, childIndex) => {
+      children: React91.Children.map(children, (child, childIndex) => {
         let mountedChild = false;
-        if (React90.isValidElement(child)) {
+        if (React91.isValidElement(child)) {
           mountedChild = !!child.props.keepMounted;
         }
         return /* @__PURE__ */ jsx162(
@@ -27401,8 +27455,8 @@ var Tabs = ({
   hideLineTabs = false,
   backgroundScrollButtons = Colors_exports.white
 }) => {
-  const tabsRef = React91.useRef(null);
-  const [value, setValue] = React91.useState(0);
+  const tabsRef = React92.useRef(null);
+  const [value, setValue] = React92.useState(0);
   const measureTextWidthRange = (child) => {
     const walker = document.createTreeWalker(child, NodeFilter.SHOW_TEXT, {
       acceptNode: (node) => node.textContent?.trim() ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT
@@ -27416,7 +27470,7 @@ var Tabs = ({
     const rect = range.getBoundingClientRect();
     return Math.round(rect.width);
   };
-  const waitForSmoothScrollEnd = React91.useCallback(
+  const waitForSmoothScrollEnd = React92.useCallback(
     (container, onEnd) => {
       let prev = container.scrollLeft;
       let idleFrames = 0;
@@ -27440,7 +27494,7 @@ var Tabs = ({
     },
     []
   );
-  const calculateIndicatorTabWidth = React91.useCallback((index) => {
+  const calculateIndicatorTabWidth = React92.useCallback((index) => {
     if (!tabsRef.current) {
       return null;
     }
@@ -27459,7 +27513,7 @@ var Tabs = ({
     indicator.style.width = `${textWidth}px`;
     indicator.style.left = `${left}px`;
   }, []);
-  React91.useEffect(() => {
+  React92.useEffect(() => {
     if (!tabsRef.current) {
       return;
     }
@@ -27666,12 +27720,12 @@ var TableCell = ({
 var TableCell_default = TableCell;
 
 // src/components/table/TableCellCopy.tsx
-import * as React92 from "react";
+import * as React93 from "react";
 import { jsx as jsx170 } from "react/jsx-runtime";
 var TableCellCopy = ({ text, textToCopy, ...rest }) => {
   const { t } = useTranslation();
-  const [isCopied, setIsCopied] = React92.useState(false);
-  const [showIcon, setShowIcon] = React92.useState(false);
+  const [isCopied, setIsCopied] = React93.useState(false);
+  const [showIcon, setShowIcon] = React93.useState(false);
   const manageButtonClicked = () => {
     void navigator.clipboard.writeText(textToCopy ?? text);
     if (isCopied) {
@@ -27806,9 +27860,9 @@ var ToolbarBreadcrumb_default = ToolbarBreadcrumb;
 
 // src/components/toolbar/ToolbarBreadcrumbButton.tsx
 import { ButtonBase as ButtonBase5 } from "@mui/material";
-import * as React93 from "react";
+import * as React94 from "react";
 import { jsx as jsx175 } from "react/jsx-runtime";
-var ToolbarBreadcrumbButton = React93.forwardRef(function ToolbarBreadcrumbButton2({ text, className, ...rest }, ref) {
+var ToolbarBreadcrumbButton = React94.forwardRef(function ToolbarBreadcrumbButton2({ text, className, ...rest }, ref) {
   return /* @__PURE__ */ jsx175(
     ButtonBase5,
     {
@@ -27920,20 +27974,20 @@ var Toolbar = ({
 var Toolbar_default = Toolbar;
 
 // src/components/toolbar/ToolbarTitle.tsx
-import * as React94 from "react";
-import { useState as useState39 } from "react";
+import * as React95 from "react";
+import { useState as useState40 } from "react";
 import { jsx as jsx177, jsxs as jsxs85 } from "react/jsx-runtime";
-var ToolbarTitle = React94.forwardRef(function ToolbarTitle2({
+var ToolbarTitle = React95.forwardRef(function ToolbarTitle2({
   title,
   align = "left",
   className,
   hoverActions,
   color: color2 = grey900
 }, ref) {
-  const textElementRef = React94.useRef(
+  const textElementRef = React95.useRef(
     null
   );
-  const [showHoverActions, setShowHoverActions] = useState39(false);
+  const [showHoverActions, setShowHoverActions] = useState40(false);
   return /* @__PURE__ */ jsx177(Box_default2, { sx: { maxWidth: "100%" }, children: /* @__PURE__ */ jsx177(
     TextEllipsisTooltip_default,
     {
@@ -28174,7 +28228,7 @@ var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE
 var WidgetTitle_default = WidgetTitle;
 
 // src/components/window/MinimizableWindow.tsx
-import * as React95 from "react";
+import * as React96 from "react";
 import { Fragment as Fragment42, jsx as jsx182, jsxs as jsxs87 } from "react/jsx-runtime";
 var sizes6 = {
   M: 400,
@@ -28200,7 +28254,7 @@ var iconButtonsStyles = {
     backgroundColor: "rgba(255, 255, 255, 0.2)"
   }
 };
-var MinimizableWindow = React95.forwardRef(function MinimizableWindow2({
+var MinimizableWindow = React96.forwardRef(function MinimizableWindow2({
   children,
   title,
   size = "M",
@@ -28220,17 +28274,17 @@ var MinimizableWindow = React95.forwardRef(function MinimizableWindow2({
   onBack
 }, ref) {
   const { t } = useTranslation();
-  const overlayRef = React95.useRef(null);
-  const windowRef = React95.useRef(null);
-  const headerRef = React95.useRef(null);
-  const [isDraggingState, setIsDraggingState] = React95.useState(false);
-  const diffRef = React95.useRef({ x: 0, y: 0 });
-  React95.useImperativeHandle(ref, () => ({
+  const overlayRef = React96.useRef(null);
+  const windowRef = React96.useRef(null);
+  const headerRef = React96.useRef(null);
+  const [isDraggingState, setIsDraggingState] = React96.useState(false);
+  const diffRef = React96.useRef({ x: 0, y: 0 });
+  React96.useImperativeHandle(ref, () => ({
     window: windowRef.current,
     header: headerRef.current,
     overlay: overlayRef.current
   }));
-  React95.useEffect(() => {
+  React96.useEffect(() => {
     if (open) {
       overlayRef.current?.style.removeProperty("transform");
       overlayRef.current?.style.removeProperty("opacity");
@@ -28458,31 +28512,31 @@ var MinimizableWindow = React95.forwardRef(function MinimizableWindow2({
 var MinimizableWindow_default = MinimizableWindow;
 
 // src/hooks/useFormatters.ts
-import { useCallback as useCallback23, useContext as useContext16 } from "react";
+import { useCallback as useCallback24, useContext as useContext16 } from "react";
 var useFormatters = () => {
   const { locale, currency, timezone } = useContext16(IntlContext);
   return {
-    formatCompactNumber: useCallback23(
+    formatCompactNumber: useCallback24(
       (value) => formatCompactNumber(value, locale),
       [locale]
     ),
-    formatNumber: useCallback23(
+    formatNumber: useCallback24(
       (value, fractionSize) => formatNumber(value, locale, fractionSize),
       [locale]
     ),
-    formatPercentage: useCallback23(
+    formatPercentage: useCallback24(
       (value, fractionSize) => formatPercentage(value, locale, fractionSize),
       [locale]
     ),
-    formatCurrency: useCallback23(
+    formatCurrency: useCallback24(
       (value, notation) => formatCurrency(value, locale, currency, notation),
       [currency, locale]
     ),
-    formatDate: useCallback23(
+    formatDate: useCallback24(
       (date, format2) => formatDate(date, locale, timezone, format2),
       [locale, timezone]
     ),
-    formatPhone: useCallback23(
+    formatPhone: useCallback24(
       (phone, format2) => formatPhone(phone, format2),
       []
     )