@natoora-libs/core 0.2.45 → 0.2.46

package/dist/components/index.d.cts

@@ -772,8 +772,10 @@ interface PaginationForTableProps {
     position?: any;
     style?: any;
     updateFilters: any;
+    siblingCount?: number;
+    boundaryCount?: number;
 }
-declare const PaginationForTable: ({ appliedFilters, className, page, pagination, position, style, updateFilters, }: PaginationForTableProps) => react_jsx_runtime.JSX.Element;
+declare const PaginationForTable: ({ appliedFilters, className, page, pagination, position, style, updateFilters, siblingCount, boundaryCount }: PaginationForTableProps) => react_jsx_runtime.JSX.Element;
 
 interface PhoneInputProps {
     value?: string | null;
@@ -928,12 +930,11 @@ type SearchHeaderProps = {
     children?: ReactNode;
     onSearch?: (value: string) => void;
     value?: string;
-    initialValue?: string;
     onChange?: (e: React__default.ChangeEvent<HTMLInputElement>) => void;
     onKeyDown?: (e: React__default.KeyboardEvent<HTMLInputElement>) => void;
     width?: number;
 };
-declare const SearchHeader: ({ renderButton, renderExtraAction, children, onSearch, value, onChange, onKeyDown, width, initialValue }: SearchHeaderProps) => react_jsx_runtime.JSX.Element;
+declare const SearchHeader: ({ renderButton, renderExtraAction, children, onSearch, value, onChange, onKeyDown, width, }: SearchHeaderProps) => react_jsx_runtime.JSX.Element;
 
 interface ISearchWithFiltersProps {
     enterPressedInSearch?: () => void;

package/dist/components/index.d.ts

@@ -772,8 +772,10 @@ interface PaginationForTableProps {
     position?: any;
     style?: any;
     updateFilters: any;
+    siblingCount?: number;
+    boundaryCount?: number;
 }
-declare const PaginationForTable: ({ appliedFilters, className, page, pagination, position, style, updateFilters, }: PaginationForTableProps) => react_jsx_runtime.JSX.Element;
+declare const PaginationForTable: ({ appliedFilters, className, page, pagination, position, style, updateFilters, siblingCount, boundaryCount }: PaginationForTableProps) => react_jsx_runtime.JSX.Element;
 
 interface PhoneInputProps {
     value?: string | null;
@@ -928,12 +930,11 @@ type SearchHeaderProps = {
     children?: ReactNode;
     onSearch?: (value: string) => void;
     value?: string;
-    initialValue?: string;
     onChange?: (e: React__default.ChangeEvent<HTMLInputElement>) => void;
     onKeyDown?: (e: React__default.KeyboardEvent<HTMLInputElement>) => void;
     width?: number;
 };
-declare const SearchHeader: ({ renderButton, renderExtraAction, children, onSearch, value, onChange, onKeyDown, width, initialValue }: SearchHeaderProps) => react_jsx_runtime.JSX.Element;
+declare const SearchHeader: ({ renderButton, renderExtraAction, children, onSearch, value, onChange, onKeyDown, width, }: SearchHeaderProps) => react_jsx_runtime.JSX.Element;
 
 interface ISearchWithFiltersProps {
     enterPressedInSearch?: () => void;

package/dist/components/index.js

@@ -6669,7 +6669,7 @@ var NumpadPlus = ({ handleClick, handleUndo }) => {
 var NumpadPlus_default = NumpadPlus;
 
 // src/components/Pagination/Pagination.tsx
-import { Pagination, Paper as Paper5, Typography as Typography22 } from "@mui/material";
+import { Pagination, Paper as Paper5, Typography as Typography22, Box as Box33 } from "@mui/material";
 import { makeStyles as makeStyles33 } from "tss-react/mui";
 import { jsx as jsx106, jsxs as jsxs69 } from "react/jsx-runtime";
 var paginationHeight = "56px";
@@ -6684,11 +6684,18 @@ var useStyles33 = makeStyles33()((theme) => ({
     borderRadius: "0 0 4px 4px",
     width: "100%",
     height: paginationHeight,
+    overflow: "hidden",
     "& > *": {
       margin: theme.spacing(2)
     },
-    "& .MuiTypography-body1": {
-      fontSize: ".850rem"
+    "& .MuiPagination-root": {
+      minWidth: 0
+    },
+    "& .MuiPagination-ul": {
+      flexWrap: "nowrap"
+    },
+    "& .MuiPaginationItem-root": {
+      flexShrink: 0
     }
   },
   fixed: {
@@ -6708,7 +6715,9 @@ var PaginationForTable = ({
   pagination,
   position = "relative",
   style,
-  updateFilters
+  updateFilters,
+  siblingCount = 1,
+  boundaryCount = 1
 }) => {
   const { classes, cx } = useStyles33();
   const handleChange = (event, value) => {
@@ -6716,7 +6725,7 @@ var PaginationForTable = ({
   };
   const isFixed = position === "fixed";
   return /* @__PURE__ */ jsx106(Paper5, { children: /* @__PURE__ */ jsxs69(
-    "div",
+    Box33,
     {
       style,
       className: cx(classes.root, className, {
@@ -6727,14 +6736,16 @@ var PaginationForTable = ({
           "Page: ",
           page
         ] }),
-        /* @__PURE__ */ jsx106(
+        /* @__PURE__ */ jsx106(Box33, { style: { overflowX: "auto", maxWidth: 400 }, children: /* @__PURE__ */ jsx106(
           Pagination,
           {
             count: pagination.num_pages,
-            page,
-            onChange: handleChange
+            page: Number(page),
+            onChange: handleChange,
+            siblingCount,
+            boundaryCount
           }
-        )
+        ) })
       ]
     }
   ) });
@@ -7273,7 +7284,7 @@ var ProductBust = withStyles4(PBust, (theme) => ({
 var ProductBust_default = ProductBust;
 
 // src/components/RenderAvatar/RenderAvatar.tsx
-import { Avatar, Badge, Box as Box33, Typography as Typography25 } from "@mui/material";
+import { Avatar, Badge, Box as Box34, Typography as Typography25 } from "@mui/material";
 import { withStyles as withStyles5 } from "tss-react/mui";
 import { jsx as jsx110, jsxs as jsxs73 } from "react/jsx-runtime";
 var RenderAvatar = ({ active }) => {
@@ -7285,7 +7296,7 @@ var RenderAvatar = ({ active }) => {
     }
   }));
   return /* @__PURE__ */ jsxs73(
-    Box33,
+    Box34,
     {
       sx: { display: "flex", flexDirection: "column", alignItems: "center" },
       children: [
@@ -7451,7 +7462,7 @@ var RenderContentList = ({
 var RenderContentList_default = RenderContentList;
 
 // src/components/RowProductCard/RowProductCard.tsx
-import { Box as Box34, Divider as Divider6, Paper as Paper6, Typography as Typography26 } from "@mui/material";
+import { Box as Box35, Divider as Divider6, Paper as Paper6, Typography as Typography26 } from "@mui/material";
 import { makeStyles as makeStyles36 } from "tss-react/mui";
 import { Fragment as Fragment11, jsx as jsx112, jsxs as jsxs75 } from "react/jsx-runtime";
 var useStyles36 = makeStyles36()((theme) => ({
@@ -7509,7 +7520,7 @@ var RowProductCard = ({
         }),
         children: [
           /* @__PURE__ */ jsxs75(
-            Box34,
+            Box35,
             {
               className: classes.upperRow,
               sx: {
@@ -7529,7 +7540,7 @@ var RowProductCard = ({
           hasColumns ? /* @__PURE__ */ jsxs75(Fragment11, { children: [
             /* @__PURE__ */ jsx112(Divider6, { className: classes.divider }),
             /* @__PURE__ */ jsx112(
-              Box34,
+              Box35,
               {
                 sx: {
                   display: "flex",
@@ -7551,7 +7562,7 @@ var RowProductCard_default = RowProductCard;
 
 // src/components/ScrollableDialog/ScrollableDialog.tsx
 import { useEffect as useEffect10, useRef as useRef7, useState as useState13 } from "react";
-import { Box as Box35, Dialog as Dialog4, Divider as Divider7, Fade, Paper as Paper7, Typography as Typography27 } from "@mui/material";
+import { Box as Box36, Dialog as Dialog4, Divider as Divider7, Fade, Paper as Paper7, Typography as Typography27 } from "@mui/material";
 import { makeStyles as makeStyles37 } from "tss-react/mui";
 import { jsx as jsx113, jsxs as jsxs76 } from "react/jsx-runtime";
 var useStyles37 = makeStyles37()((theme) => ({
@@ -7663,7 +7674,7 @@ var ScrollableDialog = ({
         ] }),
         /* @__PURE__ */ jsx113(Divider7, {}),
         footer ? /* @__PURE__ */ jsx113(
-          Box35,
+          Box36,
           {
             className: classes.footer,
             id: "dialog-footer",
@@ -7681,7 +7692,7 @@ var ScrollableDialog = ({
 var ScrollableDialog_default = ScrollableDialog;
 
 // src/components/SearchAndFilterHeader/SearchAndFilterHeader.tsx
-import { Box as Box36, Paper as Paper9 } from "@mui/material";
+import { Box as Box37, Paper as Paper9 } from "@mui/material";
 import { makeStyles as makeStyles39 } from "tss-react/mui";
 
 // src/components/SearchWithFilters/SearchWithFilters.tsx
@@ -7822,9 +7833,9 @@ var SearchAndFilterHeader = ({
   searchValue
 }) => {
   const { classes } = useStyles39();
-  return /* @__PURE__ */ jsx115(Paper9, { children: /* @__PURE__ */ jsxs78(Box36, { className: classes.wrapper, children: [
-    /* @__PURE__ */ jsxs78(Box36, { className: classes.container, children: [
-      /* @__PURE__ */ jsxs78(Box36, { className: classes.leftSection, children: [
+  return /* @__PURE__ */ jsx115(Paper9, { children: /* @__PURE__ */ jsxs78(Box37, { className: classes.wrapper, children: [
+    /* @__PURE__ */ jsxs78(Box37, { className: classes.container, children: [
+      /* @__PURE__ */ jsxs78(Box37, { className: classes.leftSection, children: [
         /* @__PURE__ */ jsx115(AppLabel_default, { appName }),
         /* @__PURE__ */ jsx115(
           SearchWithFilters_default,
@@ -7837,9 +7848,9 @@ var SearchAndFilterHeader = ({
           }
         )
       ] }),
-      /* @__PURE__ */ jsx115(Box36, { children: extraButton })
+      /* @__PURE__ */ jsx115(Box37, { children: extraButton })
     ] }),
-    showFilters ? /* @__PURE__ */ jsx115(Box36, { children: filtersComponent }) : null,
+    showFilters ? /* @__PURE__ */ jsx115(Box37, { children: filtersComponent }) : null,
     appliedFiltersComponent
   ] }) });
 };
@@ -7847,7 +7858,7 @@ var SearchAndFilterHeader_default = SearchAndFilterHeader;
 
 // src/components/SearchAndFilterHeader/SearchAndFilterHeaderForTable.tsx
 import * as React7 from "react";
-import { Box as Box38 } from "@mui/material";
+import { Box as Box39 } from "@mui/material";
 import { makeStyles as makeStyles41 } from "tss-react/mui";
 
 // src/components/SearchWithFilters/SearchWithFiltersForTable.tsx
@@ -7857,7 +7868,7 @@ import {
   ArrowDropUp as ArrowDropUpIcon2,
   Search as SearchIcon2
 } from "@mui/icons-material";
-import { Box as Box37, Button as Button15, Divider as Divider9, InputBase as InputBase3, Paper as Paper10 } from "@mui/material";
+import { Box as Box38, Button as Button15, Divider as Divider9, InputBase as InputBase3, Paper as Paper10 } from "@mui/material";
 import { makeStyles as makeStyles40 } from "tss-react/mui";
 import { Fragment as Fragment12, jsx as jsx116, jsxs as jsxs79 } from "react/jsx-runtime";
 var useStyles40 = makeStyles40()((theme) => ({
@@ -7935,7 +7946,7 @@ var SearchWithFiltersForTable = (props) => {
   };
   const ArrowIcon = isOpen ? ArrowDropUpIcon2 : ArrowDropDownIcon2;
   return /* @__PURE__ */ jsxs79(Paper10, { className: classes.c_search, children: [
-    /* @__PURE__ */ jsx116(Box37, { className: classes.c_search__icon, children: /* @__PURE__ */ jsx116(SearchIcon2, { className: classes.icon, fontSize: "small" }) }),
+    /* @__PURE__ */ jsx116(Box38, { className: classes.c_search__icon, children: /* @__PURE__ */ jsx116(SearchIcon2, { className: classes.icon, fontSize: "small" }) }),
     /* @__PURE__ */ jsx116(
       InputBase3,
       {
@@ -8003,8 +8014,8 @@ var SearchAndFilterHeaderForTable = (props) => {
     searchedValue
   } = props;
   const { classes } = useStyles41();
-  return /* @__PURE__ */ jsxs80(Box38, { className: classes.container, children: [
-    /* @__PURE__ */ jsxs80(Box38, { className: classes.leftSection, children: [
+  return /* @__PURE__ */ jsxs80(Box39, { className: classes.container, children: [
+    /* @__PURE__ */ jsxs80(Box39, { className: classes.leftSection, children: [
       /* @__PURE__ */ jsx117(AppLabel_default, { appName }),
       /* @__PURE__ */ jsx117(
         SearchWithFiltersForTable_default,
@@ -8018,7 +8029,7 @@ var SearchAndFilterHeaderForTable = (props) => {
         }
       ),
       copy && /* @__PURE__ */ jsx117(
-        Box38,
+        Box39,
         {
           sx: {
             margin: 0.5
@@ -8027,13 +8038,13 @@ var SearchAndFilterHeaderForTable = (props) => {
         }
       )
     ] }),
-    /* @__PURE__ */ jsx117(Box38, { children: button })
+    /* @__PURE__ */ jsx117(Box39, { children: button })
   ] });
 };
 var SearchAndFilterHeaderForTable_default = React7.memo(SearchAndFilterHeaderForTable);
 
 // src/components/SearchHeader/SearchHeader.tsx
-import { Box as Box39, Paper as Paper11 } from "@mui/material";
+import { Box as Box40, Paper as Paper11 } from "@mui/material";
 import { jsx as jsx118, jsxs as jsxs81 } from "react/jsx-runtime";
 var SearchHeader = ({
   renderButton,
@@ -8043,8 +8054,7 @@ var SearchHeader = ({
   value,
   onChange,
   onKeyDown,
-  width,
-  initialValue
+  width
 }) => {
   return /* @__PURE__ */ jsxs81(
     Paper11,
@@ -8056,7 +8066,7 @@ var SearchHeader = ({
       },
       children: [
         /* @__PURE__ */ jsxs81(
-          Box39,
+          Box40,
           {
             sx: {
               display: "flex",
@@ -8064,7 +8074,7 @@ var SearchHeader = ({
               alignItems: "center"
             },
             children: [
-              /* @__PURE__ */ jsxs81(Box39, { sx: { display: "flex", gap: 1, alignItems: "center" }, children: [
+              /* @__PURE__ */ jsxs81(Box40, { sx: { display: "flex", gap: 1, alignItems: "center" }, children: [
                 /* @__PURE__ */ jsx118(
                   SearchFieldDebounced,
                   {
@@ -8072,8 +8082,7 @@ var SearchHeader = ({
                     onSearch,
                     value,
                     onChange,
-                    onKeyDown,
-                    initialValue
+                    onKeyDown
                   }
                 ),
                 renderExtraAction
@@ -8091,7 +8100,7 @@ var SearchHeader = ({
 // src/components/SectionName/SectionName.tsx
 import HistoryIcon from "@mui/icons-material/History";
 import InfoIcon from "@mui/icons-material/Info";
-import { Box as Box40, Divider as Divider10, IconButton as IconButton6, Tooltip as Tooltip10, Typography as Typography28 } from "@mui/material";
+import { Box as Box41, Divider as Divider10, IconButton as IconButton6, Tooltip as Tooltip10, Typography as Typography28 } from "@mui/material";
 import { makeStyles as makeStyles42 } from "tss-react/mui";
 import { jsx as jsx119, jsxs as jsxs82 } from "react/jsx-runtime";
 var useStyles42 = makeStyles42()((theme) => ({
@@ -8149,8 +8158,8 @@ var SectionName = ({
       }
     }
   };
-  return /* @__PURE__ */ jsxs82(Box40, { className: classes.container, children: [
-    /* @__PURE__ */ jsxs82(Box40, { className: classes.titleContainer, children: [
+  return /* @__PURE__ */ jsxs82(Box41, { className: classes.container, children: [
+    /* @__PURE__ */ jsxs82(Box41, { className: classes.titleContainer, children: [
       /* @__PURE__ */ jsx119(
         Typography28,
         {
@@ -8169,7 +8178,7 @@ var SectionName = ({
         }
       ) }) : null
     ] }),
-    /* @__PURE__ */ jsxs82(Box40, { className: classes.actionButtons, children: [
+    /* @__PURE__ */ jsxs82(Box41, { className: classes.actionButtons, children: [
       buttonText ? /* @__PURE__ */ jsx119(
         ExtendedButton_default,
         {
@@ -8193,7 +8202,7 @@ var SectionName_default = SectionName;
 // src/components/SmartMultipleSelect/SmartMultipleSelect.tsx
 import { useState as useState16 } from "react";
 import {
-  Box as Box41,
+  Box as Box42,
   Checkbox as Checkbox7,
   CircularProgress as CircularProgress5,
   FormControl as FormControl5,
@@ -8236,18 +8245,18 @@ var SmartMultipleSelect = ({
     onChange?.(newValues);
   };
   const renderMenuContent = () => !menuOptions?.length ? /* @__PURE__ */ jsx120(
-    Box41,
+    Box42,
     {
       sx: { display: "flex", justifyContent: "center", alignItems: "center" },
       children: /* @__PURE__ */ jsx120(Typography29, { children: emptyMessage })
     }
-  ) : /* @__PURE__ */ jsx120(Box41, { sx: { display: "flex", flexDirection: "column" }, children: menuOptions?.map((option, index) => {
+  ) : /* @__PURE__ */ jsx120(Box42, { sx: { display: "flex", flexDirection: "column" }, children: menuOptions?.map((option, index) => {
     const selectedValues = values ?? localValues ?? [];
     const isSelected = selectedValues.some(
       (selected) => selected.value === option.value
     );
     return /* @__PURE__ */ jsxs83(
-      Box41,
+      Box42,
       {
         onClick: () => handleChangeOption(option),
         sx: {
@@ -8290,7 +8299,7 @@ var SmartMultipleSelect = ({
               return /* @__PURE__ */ jsx120(DynamicOverflowTooltip, { tooltipDescription: valuesString, children: valuesString });
             },
             children: isLoading ? /* @__PURE__ */ jsx120(
-              Box41,
+              Box42,
               {
                 sx: {
                   display: "flex",
@@ -8533,7 +8542,7 @@ var SmartTableHeaderFilterMenu = ({
 // src/components/SmartTableHeader/SmartTableHeader.tsx
 import { memo as memo22 } from "react";
 import {
-  Box as Box42,
+  Box as Box43,
   Checkbox as Checkbox8,
   TableCell,
   TableHead,
@@ -8604,7 +8613,7 @@ var SmartTableHeader = memo22(
             }
           },
           children: /* @__PURE__ */ jsxs86(
-            Box42,
+            Box43,
             {
               display: "flex",
               flexDirection: "row",
@@ -8663,7 +8672,7 @@ var SmartTableHeader = memo22(
 var import_debounce = __toESM(require_debounce(), 1);
 import { useLayoutEffect, useState as useState18 } from "react";
 import {
-  Box as Box44,
+  Box as Box45,
   Paper as Paper12,
   Table as MUITable,
   TableBody,
@@ -8677,12 +8686,12 @@ import { makeStyles as makeStyles44 } from "tss-react/mui";
 import { v4 as uuidv4 } from "uuid";
 
 // src/components/TableLoading/TableLoading.tsx
-import { Box as Box43, Skeleton as Skeleton4 } from "@mui/material";
+import { Box as Box44, Skeleton as Skeleton4 } from "@mui/material";
 import { jsx as jsx125 } from "react/jsx-runtime";
 var TableLoading = ({
   rowsPerPage,
   rowHeight
-}) => /* @__PURE__ */ jsx125(Box43, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ jsx125(
+}) => /* @__PURE__ */ jsx125(Box44, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ jsx125(
   Skeleton4,
   {
     animation: "pulse",
@@ -8820,7 +8829,7 @@ var Table = ({
     }
     return rowsComponents;
   };
-  return /* @__PURE__ */ jsx126(Paper12, { className: classes.root, children: /* @__PURE__ */ jsx126(Box44, { className: classes.paper, children: isLoading ? /* @__PURE__ */ jsx126(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ jsx126(TableContainer, { className: classes.container, children: /* @__PURE__ */ jsxs87(MUITable, { size: "medium", stickyHeader: true, children: [
+  return /* @__PURE__ */ jsx126(Paper12, { className: classes.root, children: /* @__PURE__ */ jsx126(Box45, { className: classes.paper, children: isLoading ? /* @__PURE__ */ jsx126(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ jsx126(TableContainer, { className: classes.container, children: /* @__PURE__ */ jsxs87(MUITable, { size: "medium", stickyHeader: true, children: [
     /* @__PURE__ */ jsx126(TableHead2, { className: classes.header, children: /* @__PURE__ */ jsx126(TableRow2, { children: headCells?.map((headCell) => /* @__PURE__ */ jsx126(
       TableCell2,
       {
@@ -8853,7 +8862,7 @@ import {
   useEffect as useEffect13,
   useRef as useRef8
 } from "react";
-import { Paper as Paper13, Table as Table2, TableBody as TableBody3, TableContainer as TableContainer2, Box as Box46 } from "@mui/material";
+import { Paper as Paper13, Table as Table2, TableBody as TableBody3, TableContainer as TableContainer2, Box as Box47 } from "@mui/material";
 
 // src/components/TableDesktopLoadingState/TableDesktopLoadingState.tsx
 import { Skeleton as Skeleton5, TableCell as TableCell3, TableRow as TableRow3 } from "@mui/material";
@@ -9027,7 +9036,7 @@ var TableDesktopRows = ({
 };
 
 // src/components/TableDesktopRowSelectionBar/TableDesktopRowSelectionBar.tsx
-import { Box as Box45, Button as Button17, Typography as Typography33 } from "@mui/material";
+import { Box as Box46, Button as Button17, Typography as Typography33 } from "@mui/material";
 import { jsx as jsx130, jsxs as jsxs90 } from "react/jsx-runtime";
 var TableDesktopRowSelectionBar = ({
   isEveryRowInPageSelected,
@@ -9048,7 +9057,7 @@ var TableDesktopRowSelectionBar = ({
     return `${numSelectedRows} row${numSelectedRows > 1 ? "s" : ""} selected.`;
   };
   return isAnyRowSelected ? /* @__PURE__ */ jsxs90(
-    Box45,
+    Box46,
     {
       sx: {
         p: 1,
@@ -9283,7 +9292,7 @@ var TableDesktop = ({
     );
   };
   return /* @__PURE__ */ jsx132(
-    Box46,
+    Box47,
     {
       sx: {
         height,
@@ -9952,7 +9961,7 @@ var TableDesktopEditableField = ({
 // src/components/TableDesktopFooter/TableDesktopFooter.tsx
 import Refresh3 from "@mui/icons-material/Refresh";
 import {
-  Box as Box47,
+  Box as Box48,
   Button as Button18,
   MenuItem as MenuItem4,
   Pagination as Pagination2,
@@ -9972,7 +9981,7 @@ var TableDesktopFooter = ({
   isFetching
 }) => {
   return /* @__PURE__ */ jsxs93(
-    Box47,
+    Box48,
     {
       sx: {
         py: 1,
@@ -10004,7 +10013,7 @@ var TableDesktopFooter = ({
             )
           }
         ) : null,
-        /* @__PURE__ */ jsxs93(Box47, { sx: { display: "flex", ml: "auto", py: 1 }, children: [
+        /* @__PURE__ */ jsxs93(Box48, { sx: { display: "flex", ml: "auto", py: 1 }, children: [
           pageSize && pageSizeOptions && onPageSizeChange ? /* @__PURE__ */ jsxs93(Stack, { direction: "row", spacing: 2, alignItems: "center", children: [
             /* @__PURE__ */ jsx139(Typography35, { fontSize: 12, children: "Rows per page:" }),
             /* @__PURE__ */ jsx139(
@@ -10144,7 +10153,7 @@ import Download from "@mui/icons-material/Download";
 import KeyboardArrowLeft2 from "@mui/icons-material/KeyboardArrowLeft";
 import KeyboardArrowRight2 from "@mui/icons-material/KeyboardArrowRight";
 import {
-  Box as Box48,
+  Box as Box49,
   Button as Button19,
   Divider as Divider11,
   FormControlLabel as FormControlLabel7,
@@ -10208,7 +10217,7 @@ var TableDesktopToolbar = ({
     });
   };
   return /* @__PURE__ */ jsxs95(
-    Box48,
+    Box49,
     {
       sx: {
         borderBottom: "1px solid",
@@ -10217,7 +10226,7 @@ var TableDesktopToolbar = ({
       },
       children: [
         /* @__PURE__ */ jsxs95(
-          Box48,
+          Box49,
           {
             sx: {
               py: 1,
@@ -10229,7 +10238,7 @@ var TableDesktopToolbar = ({
             },
             children: [
               /* @__PURE__ */ jsxs95(
-                Box48,
+                Box49,
                 {
                   sx: {
                     py: 1,
@@ -10277,7 +10286,7 @@ var TableDesktopToolbar = ({
                 }
               ),
               /* @__PURE__ */ jsx141(
-                Box48,
+                Box49,
                 {
                   ref: scrollRef,
                   sx: {
@@ -10299,7 +10308,7 @@ var TableDesktopToolbar = ({
                       return null;
                     }
                     return editableCellType && /* @__PURE__ */ jsx141(
-                      Box48,
+                      Box49,
                       {
                         sx: { width, flex: "0 0 auto" },
                         children: /* @__PURE__ */ jsx141(
@@ -10352,7 +10361,7 @@ var TableDesktopToolbar = ({
                     children: "APPLY"
                   }
                 )
-              ] }) : /* @__PURE__ */ jsxs95(Box48, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+              ] }) : /* @__PURE__ */ jsxs95(Box49, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
                 renderInfoIcons,
                 renderExportCsvDialog ? /* @__PURE__ */ jsx141(Tooltip13, { title: "Download List", children: /* @__PURE__ */ jsx141("span", { style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx141(
                   IconButton8,
@@ -10467,7 +10476,7 @@ var TableHeader = ({ cells, onSort = null }) => {
 var TableHeader_default = memo23(TableHeader);
 
 // src/components/TextDivider/TextDivider.tsx
-import { Box as Box49, Typography as Typography37, Divider as Divider12, Button as Button20 } from "@mui/material";
+import { Box as Box50, Typography as Typography37, Divider as Divider12, Button as Button20 } from "@mui/material";
 import { makeStyles as makeStyles47 } from "tss-react/mui";
 import { jsx as jsx143, jsxs as jsxs96 } from "react/jsx-runtime";
 var useStyles47 = makeStyles47()(() => ({
@@ -10507,7 +10516,7 @@ var TextDivider = ({
   const { classes } = useStyles47();
   const iconColor = color ?? colors.neutral900;
   return /* @__PURE__ */ jsxs96(
-    Box49,
+    Box50,
     {
       display: "flex",
       alignItems: "center",
@@ -10515,7 +10524,7 @@ var TextDivider = ({
       className: classes.container,
       children: [
         /* @__PURE__ */ jsx143(Divider12, { className: classes.leftDivider }),
-        /* @__PURE__ */ jsx143(Button20, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ jsxs96(Box49, { className: classes.center, children: [
+        /* @__PURE__ */ jsx143(Button20, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ jsxs96(Box50, { className: classes.center, children: [
           Icon2 && iconPosition === "left" && /* @__PURE__ */ jsx143(Icon2, { className: classes.icon, style: { color: iconColor } }),
           /* @__PURE__ */ jsx143(
             Typography37,
@@ -10642,7 +10651,7 @@ var ThemedDateRangePicker_default = ThemedDateRangePicker;
 
 // src/components/TheToolbar/TheToolbar.tsx
 import { memo as memo24 } from "react";
-import { AppBar, Box as Box50, Toolbar } from "@mui/material";
+import { AppBar, Box as Box51, Toolbar } from "@mui/material";
 import { makeStyles as makeStyles49 } from "tss-react/mui";
 import { jsx as jsx145, jsxs as jsxs97 } from "react/jsx-runtime";
 var useStyles49 = makeStyles49()((theme) => ({
@@ -10669,9 +10678,9 @@ var TheToolbar = ({
   isAuthenticated = true
 }) => {
   const { classes } = useStyles49();
-  return /* @__PURE__ */ jsxs97(Box50, { children: [
+  return /* @__PURE__ */ jsxs97(Box51, { children: [
     /* @__PURE__ */ jsx145(AppBar, { children: /* @__PURE__ */ jsxs97(Toolbar, { className: classes.topBar, children: [
-      isAuthenticated ? /* @__PURE__ */ jsx145(Box50, { sx: { flexShrink: 0, display: "flex" }, children: /* @__PURE__ */ jsx145(
+      isAuthenticated ? /* @__PURE__ */ jsx145(Box51, { sx: { flexShrink: 0, display: "flex" }, children: /* @__PURE__ */ jsx145(
         RoundButton_default,
         {
           className: classes.menuButton,
@@ -10680,7 +10689,7 @@ var TheToolbar = ({
           onClick: handleOpen
         }
       ) }) : null,
-      /* @__PURE__ */ jsx145(Box50, { sx: { display: { xs: "none", lg: "block" }, flexShrink: 0 }, children: /* @__PURE__ */ jsx145(
+      /* @__PURE__ */ jsx145(Box51, { sx: { display: { xs: "none", lg: "block" }, flexShrink: 0 }, children: /* @__PURE__ */ jsx145(
         CompanyLogo_default,
         {
           size: "small",
@@ -10690,7 +10699,7 @@ var TheToolbar = ({
         }
       ) }),
       /* @__PURE__ */ jsx145(
-        Box50,
+        Box51,
         {
           ml: { xs: 0, lg: 2 },
           sx: { flexShrink: 0, display: { xs: "none", xl: "block" } },
@@ -10698,7 +10707,7 @@ var TheToolbar = ({
         }
       ),
       centerSection ? /* @__PURE__ */ jsx145(
-        Box50,
+        Box51,
         {
           sx: {
             flexGrow: 1,
@@ -10708,8 +10717,8 @@ var TheToolbar = ({
           },
           children: centerSection
         }
-      ) : /* @__PURE__ */ jsx145(Box50, { sx: { flexGrow: 1 } }),
-      /* @__PURE__ */ jsx145(Box50, { sx: { flexShrink: 0, display: { xs: "none", xl: "block" } }, children: rightSection })
+      ) : /* @__PURE__ */ jsx145(Box51, { sx: { flexGrow: 1 } }),
+      /* @__PURE__ */ jsx145(Box51, { sx: { flexShrink: 0, display: { xs: "none", xl: "block" } }, children: rightSection })
     ] }) }),
     LeftDrawer
   ] });
@@ -10762,7 +10771,7 @@ import {
   Typography as Typography38,
   Dialog as Dialog5,
   Backdrop,
-  Box as Box51,
+  Box as Box52,
   Divider as Divider13,
   Paper as Paper14,
   Fade as Fade2
@@ -10809,9 +10818,9 @@ var TwoButtonDialog = ({
       BackdropComponent: Backdrop,
       BackdropProps: { timeout: 500 },
       children: /* @__PURE__ */ jsx147(Fade2, { in: open, children: /* @__PURE__ */ jsxs98(Paper14, { className: classes.paper, children: [
-        /* @__PURE__ */ jsxs98(Box51, { className: classes.mb, children: [
+        /* @__PURE__ */ jsxs98(Box52, { className: classes.mb, children: [
           /* @__PURE__ */ jsx147(Typography38, { variant: "h5", component: "div", children: /* @__PURE__ */ jsx147(
-            Box51,
+            Box52,
             {
               sx: {
                 fontWeight: 600
@@ -10820,7 +10829,7 @@ var TwoButtonDialog = ({
             }
           ) }),
           /* @__PURE__ */ jsxs98(
-            Box51,
+            Box52,
             {
               className: classes.mt,
               sx: {
@@ -10834,7 +10843,7 @@ var TwoButtonDialog = ({
           )
         ] }),
         /* @__PURE__ */ jsx147(Divider13, {}),
-        /* @__PURE__ */ jsxs98(Box51, { className: classes.buttonContainer, children: [
+        /* @__PURE__ */ jsxs98(Box52, { className: classes.buttonContainer, children: [
           /* @__PURE__ */ jsx147(
             FilledButton_default,
             {