@natoora-libs/core 0.1.18-dev-doug-1 → 0.1.18-dev-doug-3

package/dist/components/index.js

@@ -458,7 +458,17 @@ var AppLabel = ({ appName }) => {
 var AppLabel_default = AppLabel;
 
 // src/components/AutocompleteFilterMenuContent/AutocompleteFilterMenuContent.tsx
-import { Box as Box7, Button as Button4, Divider, Tooltip as Tooltip4, Typography as Typography4 } from "@mui/material";
+import CheckIcon2 from "@mui/icons-material/Check";
+import { Box as Box7, Button as Button4, Chip as Chip2, Divider, Skeleton, Tooltip as Tooltip4, Typography as Typography4 } from "@mui/material";
+
+// src/utils/resolveObjectType.ts
+var resolveObjectType = (object, fieldName) => {
+  if (!object || typeof object !== "object") {
+    return object;
+  }
+  ;
+  return object[fieldName] ?? "";
+};
 
 // src/components/Buttons/ExtendedButton/ExtendedButton.tsx
 import { memo as memo2 } from "react";
@@ -642,15 +652,6 @@ var ExtendedButton_default = memo2(ExtendedButton);
 import CheckIcon from "@mui/icons-material/Check";
 import { Box as Box5, Checkbox, Tooltip as Tooltip3 } from "@mui/material";
 
-// src/utils/resolveObjectType.ts
-var resolveObjectType = (object, fieldName) => {
-  if (!object || typeof object !== "object") {
-    return object;
-  }
-  ;
-  return object[fieldName] ?? "";
-};
-
 // src/components/DynamicOverflowTooltip/DynamicOverflowTooltip.tsx
 import { useRef } from "react";
 import { Box as Box4, Tooltip as Tooltip2 } from "@mui/material";
@@ -675,6 +676,7 @@ var useCheckOverflow = ({
 import { jsx as jsx7 } from "react/jsx-runtime";
 var DynamicOverflowTooltip = ({
   arrow = false,
+  maxWidth = "auto",
   children,
   tooltipDescription
 }) => {
@@ -690,6 +692,7 @@ var DynamicOverflowTooltip = ({
         {
           ref,
           sx: {
+            maxWidth,
             overflowX: "hidden",
             whiteSpace: "nowrap",
             textOverflow: "ellipsis"
@@ -739,11 +742,12 @@ var FilterOptionsCheckboxes = ({
             Box5,
             {
               sx: {
+                maxWidth,
+                gap: 2,
+                flexGrow: 1,
                 display: "flex",
                 alignItems: "center",
-                justifyContent: "space-between",
-                maxWidth,
-                flexGrow: 1
+                justifyContent: "space-between"
               },
               children: [
                 /* @__PURE__ */ jsx8(DynamicOverflowTooltip, { tooltipDescription: String(filterLabel), arrow: true, children: filterLabel }),
@@ -784,10 +788,11 @@ var SearchFieldDebounced = ({
     }
     ;
     debounceRef.current = window.setTimeout(() => {
-      if (input.length < minCharacters) {
+      const trimmedInput = input.trim();
+      if (trimmedInput.length < minCharacters) {
         return;
       }
-      onSearch(input);
+      onSearch(trimmedInput);
     }, debounceDelay);
   };
   useEffect2(() => {
@@ -824,19 +829,40 @@ var SearchFieldDebounced = ({
 
 // src/components/AutocompleteFilterMenuContent/AutocompleteFilterMenuContent.tsx
 import { Fragment, jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
-var MAX_HEIGHT = 500;
 var AutocompleteFilterMenuContent = ({
+  columnId,
+  labelFieldName,
   selectedFilterOptions,
+  isLoading = false,
+  maxWidth = 208,
+  maxHeight = 500,
   onFilterOptionChange,
   onApplyFiltersClick,
   shouldShowCheckOnFilter,
-  headCell: {
-    onAutocompleteFilterChange,
-    filterOptions,
-    fieldName: labelFieldName = "",
-    id: columnId
-  }
+  onAutocompleteFilterChange,
+  filterOptions
 }) => {
+  const renderLoading = () => /* @__PURE__ */ jsx10(Skeleton, { variant: "rounded", height: 26, sx: { m: 1 } });
+  const renderOptions = () => filterOptions?.length ? /* @__PURE__ */ jsx10(
+    FilterOptionsCheckboxes,
+    {
+      columnId,
+      maxWidth,
+      labelFieldName,
+      filterOptions,
+      selectedFilterOptions,
+      onFilterOptionChange,
+      shouldShowCheckOnFilter
+    }
+  ) : /* @__PURE__ */ jsx10(
+    Typography4,
+    {
+      variant: "body2",
+      color: "textSecondary",
+      sx: { p: 1, maxWidth: 260 },
+      children: "Start searching (minimum 3 characters) to view the results."
+    }
+  );
   return /* @__PURE__ */ jsxs6(Box7, { sx: { display: "flex", flexDirection: "column" }, children: [
     /* @__PURE__ */ jsx10(
       SearchFieldDebounced,
@@ -854,9 +880,9 @@ var AutocompleteFilterMenuContent = ({
       Box7,
       {
         sx: {
+          maxHeight,
           display: "flex",
           flexDirection: "column",
-          maxHeight: MAX_HEIGHT,
           overflowX: "hidden",
           "&::-webkit-scrollbar": {
             width: "8px",
@@ -875,38 +901,51 @@ var AutocompleteFilterMenuContent = ({
         },
         children: [
           selectedFilterOptions.length ? /* @__PURE__ */ jsxs6(Fragment, { children: [
-            /* @__PURE__ */ jsx10(Box7, { sx: { px: 1, pt: 1 }, children: /* @__PURE__ */ jsx10(
-              FilterOptionsCheckboxes,
+            /* @__PURE__ */ jsx10(
+              Box7,
               {
-                columnId,
-                labelFieldName,
-                filterOptions: selectedFilterOptions,
-                selectedFilterOptions,
-                onFilterOptionChange,
-                shouldShowCheckOnFilter
+                sx: {
+                  px: 1,
+                  pt: 1,
+                  pb: 0.5,
+                  gap: 1,
+                  display: "flex",
+                  flexDirection: "column"
+                },
+                children: selectedFilterOptions?.map((option) => {
+                  const filterId = resolveObjectType(option, "id");
+                  const filterLabel = resolveObjectType(option, labelFieldName);
+                  return /* @__PURE__ */ jsxs6(
+                    Box7,
+                    {
+                      sx: {
+                        pl: 1,
+                        pr: 1.25,
+                        flexGrow: 1,
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "space-between"
+                      },
+                      children: [
+                        /* @__PURE__ */ jsx10(Box7, { sx: { maxWidth }, children: /* @__PURE__ */ jsx10(
+                          Chip2,
+                          {
+                            size: "small",
+                            label: filterLabel,
+                            onDelete: () => onFilterOptionChange(option)
+                          }
+                        ) }),
+                        shouldShowCheckOnFilter?.(columnId, option) ? /* @__PURE__ */ jsx10(Tooltip4, { title: "This filter is saved as default", children: /* @__PURE__ */ jsx10(CheckIcon2, { fontSize: "small", color: "action" }) }) : null
+                      ]
+                    },
+                    filterId
+                  );
+                })
               }
-            ) }),
+            ),
             /* @__PURE__ */ jsx10(Divider, { sx: { my: 0.5 } })
           ] }) : null,
-          /* @__PURE__ */ jsx10(Box7, { sx: { p: 1 }, children: !filterOptions?.length ? /* @__PURE__ */ jsx10(
-            Typography4,
-            {
-              variant: "body2",
-              color: "textSecondary",
-              sx: { p: 1, maxWidth: 260 },
-              children: "Start searching (minimum 3 characters) to view the results."
-            }
-          ) : /* @__PURE__ */ jsx10(
-            FilterOptionsCheckboxes,
-            {
-              columnId,
-              labelFieldName,
-              filterOptions,
-              selectedFilterOptions,
-              onFilterOptionChange,
-              shouldShowCheckOnFilter
-            }
-          ) })
+          /* @__PURE__ */ jsx10(Box7, { sx: { p: 1 }, children: isLoading ? renderLoading() : renderOptions() })
         ]
       }
     ),
@@ -3174,22 +3213,32 @@ function ActionButton(props) {
 }
 
 // src/components/CheckboxFilterMenuContent/CheckboxFilterMenuContent.tsx
-import { Box as Box12, Button as Button12, Checkbox as Checkbox2, Divider as Divider2, FormControlLabel, Tooltip as Tooltip6, Typography as Typography8 } from "@mui/material";
+import { Box as Box12, Button as Button12, Checkbox as Checkbox2, Divider as Divider2, FormControlLabel, Skeleton as Skeleton2, Tooltip as Tooltip6, Typography as Typography8 } from "@mui/material";
 import { jsx as jsx71, jsxs as jsxs40 } from "react/jsx-runtime";
-var MAX_HEIGHT2 = 500;
 var CheckboxFilterMenuContent = ({
+  columnId,
+  labelFieldName,
+  isLoading = false,
   selectedFilterOptions,
   filterOptions,
+  maxHeight = 500,
+  width = 276,
   shouldShowCheckOnFilter,
   onSelectAllChange,
   onFilterOptionChange,
-  onApplyFiltersClick,
-  headCell: {
-    id: columnId,
-    fieldName: labelFieldName = ""
-  }
+  onApplyFiltersClick
 }) => {
-  return /* @__PURE__ */ jsxs40(Box12, { sx: { display: "flex", flexDirection: "column" }, children: [
+  const renderLoading = () => /* @__PURE__ */ jsxs40(Box12, { "data-testid": "loading-skeletons", sx: { width }, children: [
+    /* @__PURE__ */ jsx71(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
+    /* @__PURE__ */ jsx71(Divider2, {}),
+    /* @__PURE__ */ jsx71(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
+    /* @__PURE__ */ jsx71(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
+    /* @__PURE__ */ jsx71(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
+    /* @__PURE__ */ jsx71(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
+    /* @__PURE__ */ jsx71(Divider2, {}),
+    /* @__PURE__ */ jsx71(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } })
+  ] });
+  const renderContent = () => /* @__PURE__ */ jsxs40(Box12, { sx: { display: "flex", flexDirection: "column" }, children: [
     /* @__PURE__ */ jsx71(Box12, { sx: { px: 2, pt: 1 }, children: /* @__PURE__ */ jsx71(
       FormControlLabel,
       {
@@ -3234,17 +3283,9 @@ var CheckboxFilterMenuContent = ({
             sx: {
               pl: 0.5,
               pr: 2,
-              maxHeight: MAX_HEIGHT2
+              maxHeight
             },
-            children: !filterOptions?.length ? /* @__PURE__ */ jsx71(
-              Typography8,
-              {
-                variant: "body2",
-                color: "textSecondary",
-                sx: { py: 1, px: 2 },
-                children: "No options available."
-              }
-            ) : /* @__PURE__ */ jsx71(
+            children: filterOptions?.length ? /* @__PURE__ */ jsx71(
               FilterOptionsCheckboxes,
               {
                 columnId,
@@ -3254,6 +3295,14 @@ var CheckboxFilterMenuContent = ({
                 onFilterOptionChange,
                 shouldShowCheckOnFilter
               }
+            ) : /* @__PURE__ */ jsx71(
+              Typography8,
+              {
+                variant: "body2",
+                color: "textSecondary",
+                sx: { py: 1, px: 2 },
+                children: "No options available."
+              }
             )
           }
         )
@@ -3294,6 +3343,10 @@ var CheckboxFilterMenuContent = ({
       }
     )
   ] });
+  if (isLoading) {
+    return renderLoading();
+  }
+  return renderContent();
 };
 
 // src/components/CompanyLogo/CompanyLogo.tsx
@@ -4005,7 +4058,7 @@ var ControlledValidTextInput_default = ControlledValidTextInput;
 
 // src/components/DataGrid/DataGrid.tsx
 import { useState as useState4 } from "react";
-import { Paper as Paper2, Skeleton } from "@mui/material";
+import { Paper as Paper2, Skeleton as Skeleton3 } from "@mui/material";
 import { DataGrid as MUIDataGrid } from "@mui/x-data-grid";
 import { makeStyles as makeStyles21 } from "tss-react/mui";
 import { Fragment as Fragment2, jsx as jsx80, jsxs as jsxs46 } from "react/jsx-runtime";
@@ -4063,7 +4116,7 @@ var DataGrid = ({
         height: height || rows.length * rowHeight + headerAndFooterHeight
       },
       children: /* @__PURE__ */ jsx80(Paper2, { className: classes.paper, children: isLoading ? /* @__PURE__ */ jsx80("div", { children: [...Array(Math.floor(10))].map((i) => /* @__PURE__ */ jsx80(
-        Skeleton,
+        Skeleton3,
         {
           animation: "pulse",
           style: { margin: "8px", opacity: 0.4 },
@@ -4737,7 +4790,7 @@ function VirtualizedList(props) {
 
 // src/components/LocationsSectionInfo/LocationsSectionInfo.tsx
 import { Fragment as Fragment8 } from "react";
-import { Box as Box22, Chip as Chip2, Typography as Typography16 } from "@mui/material";
+import { Box as Box22, Chip as Chip3, Typography as Typography16 } from "@mui/material";
 import { purple } from "@mui/material/colors";
 import classNames2 from "classnames";
 import { makeStyles as makeStyles29 } from "tss-react/mui";
@@ -4789,7 +4842,7 @@ var LocationsSectionInfo = ({
   };
   return /* @__PURE__ */ jsxs55(Box22, { className: classes.container, children: [
     /* @__PURE__ */ jsx91(
-      Chip2,
+      Chip3,
       {
         className: classNames2(classes.defaultChip, {
           [classes.stockChip]: isStock,
@@ -6991,14 +7044,11 @@ var Switch_default = memo19(LabelledSwitch);
 // src/components/SmartTableHeaderFilterMenu/SmartTableHeaderFilterMenu.tsx
 import { useMemo as useMemo2, useState as useState16, useEffect as useEffect11, memo as memo20 } from "react";
 import {
-  Box as Box32,
-  Divider as Divider11,
-  Menu as Menu4,
-  Skeleton as Skeleton2
+  Menu as Menu4
 } from "@mui/material";
 import classNames3 from "classnames";
 import { Fragment as Fragment12, jsx as jsx113, jsxs as jsxs76 } from "react/jsx-runtime";
-var MAX_WIDTH = 272;
+var MAX_WIDTH = 276;
 var findFilterIndex = (filters, filterOption) => filters.findIndex((item) => {
   if (typeof item === "string" && typeof filterOption === "string") {
     return item === filterOption;
@@ -7070,50 +7120,6 @@ var SmartTableHeaderFilterMenu = memo20(({
   useEffect11(() => {
     setSelectedFilterOptions(headerFilters[headCell.id] ?? []);
   }, [headerFilters, headCell.id]);
-  const renderLoadingSkeletons = /* @__PURE__ */ jsxs76(Box32, { "data-testid": "loading-skeletons", sx: { width: MAX_WIDTH }, children: [
-    /* @__PURE__ */ jsx113(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
-    /* @__PURE__ */ jsx113(Divider11, {}),
-    /* @__PURE__ */ jsx113(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
-    /* @__PURE__ */ jsx113(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
-    /* @__PURE__ */ jsx113(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
-    /* @__PURE__ */ jsx113(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } }),
-    /* @__PURE__ */ jsx113(Divider11, {}),
-    /* @__PURE__ */ jsx113(Skeleton2, { variant: "rounded", height: 24, sx: { m: 1 } })
-  ] });
-  const renderMenuContent = useMemo2(() => {
-    if (headCell.isAutocompleteFilterMenu) {
-      return /* @__PURE__ */ jsx113(
-        AutocompleteFilterMenuContent,
-        {
-          headCell,
-          selectedFilterOptions,
-          onFilterOptionChange: handleFilterOptionChange,
-          onApplyFiltersClick: handleApplyFiltersClick,
-          shouldShowCheckOnFilter
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx113(
-      CheckboxFilterMenuContent,
-      {
-        headCell,
-        selectedFilterOptions,
-        filterOptions: filterOptionsData ?? [],
-        onSelectAllChange: handleSelectAllChange,
-        onFilterOptionChange: handleFilterOptionChange,
-        onApplyFiltersClick: handleApplyFiltersClick,
-        shouldShowCheckOnFilter
-      }
-    );
-  }, [
-    headCell,
-    selectedFilterOptions,
-    handleFilterOptionChange,
-    handleApplyFiltersClick,
-    shouldShowCheckOnFilter,
-    filterOptionsData,
-    handleSelectAllChange
-  ]);
   return /* @__PURE__ */ jsxs76(Fragment12, { children: [
     /* @__PURE__ */ jsx113(
       ActiveFiltersIconButton,
@@ -7139,7 +7145,33 @@ var SmartTableHeaderFilterMenu = memo20(({
         },
         anchorOrigin: { vertical: "bottom", horizontal: "right" },
         transformOrigin: { vertical: "top", horizontal: "right" },
-        children: headCell.isFetchingFilterOptions ? renderLoadingSkeletons : renderMenuContent
+        children: headCell.isAutocompleteFilterMenu ? /* @__PURE__ */ jsx113(
+          AutocompleteFilterMenuContent,
+          {
+            columnId: headCell.id,
+            labelFieldName: headCell.fieldName ?? "",
+            isLoading: headCell.isFetchingFilterOptions,
+            filterOptions: headCell.filterOptions,
+            onAutocompleteFilterChange: headCell.onAutocompleteFilterChange,
+            selectedFilterOptions,
+            onFilterOptionChange: handleFilterOptionChange,
+            onApplyFiltersClick: handleApplyFiltersClick,
+            shouldShowCheckOnFilter
+          }
+        ) : /* @__PURE__ */ jsx113(
+          CheckboxFilterMenuContent,
+          {
+            columnId: headCell.id,
+            labelFieldName: headCell.fieldName ?? "",
+            isLoading: headCell.isFetchingFilterOptions,
+            selectedFilterOptions,
+            filterOptions: filterOptionsData ?? [],
+            onSelectAllChange: handleSelectAllChange,
+            onFilterOptionChange: handleFilterOptionChange,
+            onApplyFiltersClick: handleApplyFiltersClick,
+            shouldShowCheckOnFilter
+          }
+        )
       }
     )
   ] });
@@ -7148,7 +7180,7 @@ var SmartTableHeaderFilterMenu = memo20(({
 // src/components/SmartTableHeader/SmartTableHeader.tsx
 import { memo as memo21 } from "react";
 import {
-  Box as Box33,
+  Box as Box32,
   Checkbox as Checkbox6,
   TableCell,
   TableHead,
@@ -7218,7 +7250,7 @@ var SmartTableHeader = memo21(({
               }
             },
             children: /* @__PURE__ */ jsxs77(
-              Box33,
+              Box32,
               {
                 display: "flex",
                 flexDirection: "row",
@@ -7278,7 +7310,7 @@ var SmartTableHeader = memo21(({
 var import_debounce = __toESM(require_debounce(), 1);
 import { useLayoutEffect, useState as useState17 } from "react";
 import {
-  Box as Box35,
+  Box as Box34,
   Paper as Paper10,
   Table as MUITable,
   TableBody,
@@ -7292,13 +7324,13 @@ import { makeStyles as makeStyles45 } from "tss-react/mui";
 import { v4 as uuidv4 } from "uuid";
 
 // src/components/TableLoading/TableLoading.tsx
-import { Box as Box34, Skeleton as Skeleton3 } from "@mui/material";
+import { Box as Box33, Skeleton as Skeleton4 } from "@mui/material";
 import { jsx as jsx115 } from "react/jsx-runtime";
 var TableLoading = ({
   rowsPerPage,
   rowHeight
-}) => /* @__PURE__ */ jsx115(Box34, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ jsx115(
-  Skeleton3,
+}) => /* @__PURE__ */ jsx115(Box33, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ jsx115(
+  Skeleton4,
   {
     animation: "pulse",
     "data-testid": "table-loading-skeleton",
@@ -7435,7 +7467,7 @@ var Table = ({
     }
     return rowsComponents;
   };
-  return /* @__PURE__ */ jsx116(Paper10, { className: classes.root, children: /* @__PURE__ */ jsx116(Box35, { className: classes.paper, children: isLoading ? /* @__PURE__ */ jsx116(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ jsx116(TableContainer, { className: classes.container, children: /* @__PURE__ */ jsxs78(MUITable, { size: "medium", stickyHeader: true, children: [
+  return /* @__PURE__ */ jsx116(Paper10, { className: classes.root, children: /* @__PURE__ */ jsx116(Box34, { className: classes.paper, children: isLoading ? /* @__PURE__ */ jsx116(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ jsx116(TableContainer, { className: classes.container, children: /* @__PURE__ */ jsxs78(MUITable, { size: "medium", stickyHeader: true, children: [
     /* @__PURE__ */ jsx116(TableHead2, { className: classes.header, children: /* @__PURE__ */ jsx116(TableRow2, { children: headCells?.map((headCell) => /* @__PURE__ */ jsx116(
       TableCell2,
       {
@@ -7472,12 +7504,12 @@ import {
   Table as Table2,
   TableBody as TableBody3,
   TableContainer as TableContainer2,
-  Box as Box38
+  Box as Box37
 } from "@mui/material";
 
 // src/components/TableDesktopFooter/TableDesktopFooter.tsx
 import Refresh3 from "@mui/icons-material/Refresh";
-import { Box as Box36, Button as Button15, MenuItem as MenuItem4, Pagination as Pagination2, Select as Select4, Stack, Typography as Typography28 } from "@mui/material";
+import { Box as Box35, Button as Button15, MenuItem as MenuItem4, Pagination as Pagination2, Select as Select4, Stack, Typography as Typography28 } from "@mui/material";
 import { jsx as jsx117, jsxs as jsxs79 } from "react/jsx-runtime";
 var TableDesktopFooter = ({
   numPages,
@@ -7490,7 +7522,7 @@ var TableDesktopFooter = ({
   isFetching
 }) => {
   return /* @__PURE__ */ jsxs79(
-    Box36,
+    Box35,
     {
       py: 1,
       gap: 2,
@@ -7526,7 +7558,7 @@ var TableDesktopFooter = ({
             ]
           }
         ),
-        /* @__PURE__ */ jsxs79(Box36, { display: "flex", children: [
+        /* @__PURE__ */ jsxs79(Box35, { display: "flex", children: [
           /* @__PURE__ */ jsxs79(Stack, { direction: "row", spacing: 2, alignItems: "center", children: [
             /* @__PURE__ */ jsx117(Typography28, { children: "Rows per page:" }),
             /* @__PURE__ */ jsx117(
@@ -7556,7 +7588,7 @@ var TableDesktopFooter = ({
 };
 
 // src/components/TableDesktopLoadingState/TableDesktopLoadingState.tsx
-import { Skeleton as Skeleton4, TableCell as TableCell3, TableRow as TableRow3 } from "@mui/material";
+import { Skeleton as Skeleton5, TableCell as TableCell3, TableRow as TableRow3 } from "@mui/material";
 import { jsx as jsx118 } from "react/jsx-runtime";
 var getRange = (n) => Array.from({ length: n }, (_, i) => i + 1);
 var TableDesktopLoadingState = ({
@@ -7566,7 +7598,7 @@ var TableDesktopLoadingState = ({
   rowHeight
 }) => {
   return getRange(Math.min(numRows, rowsPerPage)).map((rowNum) => /* @__PURE__ */ jsx118(TableRow3, { children: getRange(numColumns).map((colNum) => /* @__PURE__ */ jsx118(TableCell3, { children: /* @__PURE__ */ jsx118(
-    Skeleton4,
+    Skeleton5,
     {
       animation: "pulse",
       variant: "rounded",
@@ -7727,7 +7759,7 @@ var TableDesktopRows = ({
 };
 
 // src/components/TableDesktopRowSelectionBar/TableDesktopRowSelectionBar.tsx
-import { Box as Box37, Button as Button17, Typography as Typography30 } from "@mui/material";
+import { Box as Box36, Button as Button17, Typography as Typography30 } from "@mui/material";
 import { jsx as jsx121, jsxs as jsxs82 } from "react/jsx-runtime";
 var TableDesktopRowSelectionBar = ({
   isEveryRowInPageSelected,
@@ -7748,7 +7780,7 @@ var TableDesktopRowSelectionBar = ({
     return `${numSelectedRows} row${numSelectedRows > 1 ? "s" : ""} selected.`;
   };
   return isAnyRowSelected ? /* @__PURE__ */ jsxs82(
-    Box37,
+    Box36,
     {
       sx: {
         p: 1,
@@ -7990,7 +8022,7 @@ var TableDesktop = ({
     ]
   );
   return /* @__PURE__ */ jsx123(
-    Box38,
+    Box37,
     {
       sx: {
         height,
@@ -8371,14 +8403,14 @@ var TableDesktopEditableField = memo23(TableDesktopEditableFieldComponent);
 
 // src/components/TableDesktopCell/TableDesktopCell.tsx
 import { useEffect as useEffect14, useState as useState22 } from "react";
-import CheckIcon2 from "@mui/icons-material/Check";
+import CheckIcon3 from "@mui/icons-material/Check";
 import CloseIcon from "@mui/icons-material/Close";
 import EditIcon from "@mui/icons-material/Edit";
 import { IconButton as IconButton4, TableCell as TableCell6, Tooltip as Tooltip11 } from "@mui/material";
 import { Fragment as Fragment14, jsx as jsx128, jsxs as jsxs85 } from "react/jsx-runtime";
 var getReadOnlyBooleanIcon = (value) => {
   if (value) {
-    return /* @__PURE__ */ jsx128(CheckIcon2, { sx: { fontSize: 16 } });
+    return /* @__PURE__ */ jsx128(CheckIcon3, { sx: { fontSize: 16 } });
   }
   return "-";
 };
@@ -8550,7 +8582,7 @@ var TableHeader = ({ cells, onSort = null }) => {
 var TableHeader_default = memo24(TableHeader);
 
 // src/components/TextDivider/TextDivider.tsx
-import { Box as Box39, Typography as Typography32, Divider as Divider12, Button as Button18 } from "@mui/material";
+import { Box as Box38, Typography as Typography32, Divider as Divider11, Button as Button18 } from "@mui/material";
 import { makeStyles as makeStyles48 } from "tss-react/mui";
 import { jsx as jsx130, jsxs as jsxs86 } from "react/jsx-runtime";
 var useStyles48 = makeStyles48()(() => ({
@@ -8590,15 +8622,15 @@ var TextDivider = ({
   const { classes } = useStyles48();
   const iconColor = color ?? colors.neutral900;
   return /* @__PURE__ */ jsxs86(
-    Box39,
+    Box38,
     {
       display: "flex",
       alignItems: "center",
       justifyContent: "space-between",
       className: classes.container,
       children: [
-        /* @__PURE__ */ jsx130(Divider12, { className: classes.leftDivider }),
-        /* @__PURE__ */ jsx130(Button18, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ jsxs86(Box39, { className: classes.center, children: [
+        /* @__PURE__ */ jsx130(Divider11, { className: classes.leftDivider }),
+        /* @__PURE__ */ jsx130(Button18, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ jsxs86(Box38, { className: classes.center, children: [
           Icon2 && iconPosition === "left" && /* @__PURE__ */ jsx130(Icon2, { className: classes.icon, style: { color: iconColor } }),
           /* @__PURE__ */ jsx130(
             Typography32,
@@ -8611,7 +8643,7 @@ var TextDivider = ({
           ),
           Icon2 && iconPosition === "right" && /* @__PURE__ */ jsx130(Icon2, { className: classes.icon, style: { color: iconColor } })
         ] }) }),
-        /* @__PURE__ */ jsx130(Divider12, { className: classes.rightDivider })
+        /* @__PURE__ */ jsx130(Divider11, { className: classes.rightDivider })
       ]
     }
   );
@@ -8725,7 +8757,7 @@ var ThemedDateRangePicker_default = ThemedDateRangePicker;
 
 // src/components/TheToolbar/TheToolbar.tsx
 import { memo as memo25 } from "react";
-import { AppBar, Box as Box40, Toolbar } from "@mui/material";
+import { AppBar, Box as Box39, Toolbar } from "@mui/material";
 import { makeStyles as makeStyles50 } from "tss-react/mui";
 import { jsx as jsx132, jsxs as jsxs87 } from "react/jsx-runtime";
 var useStyles50 = makeStyles50()((theme) => ({
@@ -8747,7 +8779,7 @@ var TheToolbar = ({
   rightSection
 }) => {
   const { classes } = useStyles50();
-  return /* @__PURE__ */ jsxs87(Box40, { children: [
+  return /* @__PURE__ */ jsxs87(Box39, { children: [
     /* @__PURE__ */ jsx132(AppBar, { children: /* @__PURE__ */ jsxs87(Toolbar, { className: classes.topBar, children: [
       /* @__PURE__ */ jsx132(
         RoundButton_default,
@@ -8767,8 +8799,8 @@ var TheToolbar = ({
           imageLogoLightSmall
         }
       ),
-      /* @__PURE__ */ jsx132(Box40, { ml: 2, children: leftSection }),
-      /* @__PURE__ */ jsx132(Box40, { ml: "auto", children: rightSection })
+      /* @__PURE__ */ jsx132(Box39, { ml: 2, children: leftSection }),
+      /* @__PURE__ */ jsx132(Box39, { ml: "auto", children: rightSection })
     ] }) }),
     LeftDrawer
   ] });
@@ -8821,8 +8853,8 @@ import {
   Typography as Typography33,
   Dialog as Dialog5,
   Backdrop,
-  Box as Box41,
-  Divider as Divider13,
+  Box as Box40,
+  Divider as Divider12,
   Paper as Paper12,
   Fade as Fade2
 } from "@mui/material";
@@ -8868,9 +8900,9 @@ var TwoButtonDialog = ({
       BackdropComponent: Backdrop,
       BackdropProps: { timeout: 500 },
       children: /* @__PURE__ */ jsx134(Fade2, { in: open, children: /* @__PURE__ */ jsxs88(Paper12, { className: classes.paper, children: [
-        /* @__PURE__ */ jsxs88(Box41, { className: classes.mb, children: [
+        /* @__PURE__ */ jsxs88(Box40, { className: classes.mb, children: [
           /* @__PURE__ */ jsx134(Typography33, { variant: "h5", component: "div", children: /* @__PURE__ */ jsx134(
-            Box41,
+            Box40,
             {
               sx: {
                 fontWeight: 600
@@ -8879,7 +8911,7 @@ var TwoButtonDialog = ({
             }
           ) }),
           /* @__PURE__ */ jsxs88(
-            Box41,
+            Box40,
             {
               className: classes.mt,
               sx: {
@@ -8892,8 +8924,8 @@ var TwoButtonDialog = ({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx134(Divider13, {}),
-        /* @__PURE__ */ jsxs88(Box41, { className: classes.buttonContainer, children: [
+        /* @__PURE__ */ jsx134(Divider12, {}),
+        /* @__PURE__ */ jsxs88(Box40, { className: classes.buttonContainer, children: [
           /* @__PURE__ */ jsx134(
             FilledButton_default,
             {