@natoora-libs/core 0.2.48-dev-doug-1 → 0.2.49-dev-doug-1

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;

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;

package/dist/components/index.js

@@ -6380,7 +6380,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";
@@ -6395,11 +6395,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: {
@@ -6419,7 +6426,9 @@ var PaginationForTable = ({
   pagination,
   position = "relative",
   style,
-  updateFilters
+  updateFilters,
+  siblingCount = 1,
+  boundaryCount = 1
 }) => {
   const { classes, cx } = useStyles33();
   const handleChange = (event, value) => {
@@ -6427,7 +6436,7 @@ var PaginationForTable = ({
   };
   const isFixed = position === "fixed";
   return /* @__PURE__ */ jsx106(Paper5, { children: /* @__PURE__ */ jsxs69(
-    "div",
+    Box33,
     {
       style,
       className: cx(classes.root, className, {
@@ -6438,14 +6447,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
           }
-        )
+        ) })
       ]
     }
   ) });
@@ -6984,7 +6995,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 }) => {
@@ -6996,7 +7007,7 @@ var RenderAvatar = ({ active }) => {
     }
   }));
   return /* @__PURE__ */ jsxs73(
-    Box33,
+    Box34,
     {
       sx: { display: "flex", flexDirection: "column", alignItems: "center" },
       children: [
@@ -7162,7 +7173,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) => ({
@@ -7220,7 +7231,7 @@ var RowProductCard = ({
         }),
         children: [
           /* @__PURE__ */ jsxs75(
-            Box34,
+            Box35,
             {
               className: classes.upperRow,
               sx: {
@@ -7240,7 +7251,7 @@ var RowProductCard = ({
           hasColumns ? /* @__PURE__ */ jsxs75(Fragment11, { children: [
             /* @__PURE__ */ jsx112(Divider6, { className: classes.divider }),
             /* @__PURE__ */ jsx112(
-              Box34,
+              Box35,
               {
                 sx: {
                   display: "flex",
@@ -7262,7 +7273,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) => ({
@@ -7374,7 +7385,7 @@ var ScrollableDialog = ({
         ] }),
         /* @__PURE__ */ jsx113(Divider7, {}),
         footer ? /* @__PURE__ */ jsx113(
-          Box35,
+          Box36,
           {
             className: classes.footer,
             id: "dialog-footer",
@@ -7392,7 +7403,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
@@ -7533,9 +7544,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,
@@ -7548,9 +7559,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
   ] }) });
 };
@@ -7558,7 +7569,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
@@ -7568,7 +7579,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) => ({
@@ -7646,7 +7657,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,
       {
@@ -7714,8 +7725,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,
@@ -7729,7 +7740,7 @@ var SearchAndFilterHeaderForTable = (props) => {
         }
       ),
       copy && /* @__PURE__ */ jsx117(
-        Box38,
+        Box39,
         {
           sx: {
             margin: 0.5
@@ -7738,13 +7749,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,
@@ -7766,7 +7777,7 @@ var SearchHeader = ({
       },
       children: [
         /* @__PURE__ */ jsxs81(
-          Box39,
+          Box40,
           {
             sx: {
               display: "flex",
@@ -7774,7 +7785,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,
                   {
@@ -7800,7 +7811,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) => ({
@@ -7858,8 +7869,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,
         {
@@ -7878,7 +7889,7 @@ var SectionName = ({
         }
       ) }) : null
     ] }),
-    /* @__PURE__ */ jsxs82(Box40, { className: classes.actionButtons, children: [
+    /* @__PURE__ */ jsxs82(Box41, { className: classes.actionButtons, children: [
       buttonText ? /* @__PURE__ */ jsx119(
         ExtendedButton_default,
         {
@@ -7902,7 +7913,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,
@@ -7945,18 +7956,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: {
@@ -7999,7 +8010,7 @@ var SmartMultipleSelect = ({
               return /* @__PURE__ */ jsx120(DynamicOverflowTooltip, { tooltipDescription: valuesString, children: valuesString });
             },
             children: isLoading ? /* @__PURE__ */ jsx120(
-              Box41,
+              Box42,
               {
                 sx: {
                   display: "flex",
@@ -8242,7 +8253,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,
@@ -8313,7 +8324,7 @@ var SmartTableHeader = memo22(
             }
           },
           children: /* @__PURE__ */ jsxs86(
-            Box42,
+            Box43,
             {
               display: "flex",
               flexDirection: "row",
@@ -8371,7 +8382,7 @@ var SmartTableHeader = memo22(
 // src/components/Table/Table.tsx
 import { useLayoutEffect, useState as useState18 } from "react";
 import {
-  Box as Box44,
+  Box as Box45,
   Paper as Paper12,
   Table as MUITable,
   TableBody,
@@ -8386,12 +8397,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",
@@ -8529,7 +8540,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,
       {
@@ -8562,7 +8573,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";
@@ -8736,7 +8747,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,
@@ -8757,7 +8768,7 @@ var TableDesktopRowSelectionBar = ({
     return `${numSelectedRows} row${numSelectedRows > 1 ? "s" : ""} selected.`;
   };
   return isAnyRowSelected ? /* @__PURE__ */ jsxs90(
-    Box45,
+    Box46,
     {
       sx: {
         p: 1,
@@ -8992,7 +9003,7 @@ var TableDesktop = ({
     );
   };
   return /* @__PURE__ */ jsx132(
-    Box46,
+    Box47,
     {
       sx: {
         height,
@@ -9661,7 +9672,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,
@@ -9681,7 +9692,7 @@ var TableDesktopFooter = ({
   isFetching
 }) => {
   return /* @__PURE__ */ jsxs93(
-    Box47,
+    Box48,
     {
       sx: {
         py: 1,
@@ -9713,7 +9724,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(
@@ -9853,7 +9864,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,
@@ -9917,7 +9928,7 @@ var TableDesktopToolbar = ({
     });
   };
   return /* @__PURE__ */ jsxs95(
-    Box48,
+    Box49,
     {
       sx: {
         borderBottom: "1px solid",
@@ -9926,7 +9937,7 @@ var TableDesktopToolbar = ({
       },
       children: [
         /* @__PURE__ */ jsxs95(
-          Box48,
+          Box49,
           {
             sx: {
               py: 1,
@@ -9938,7 +9949,7 @@ var TableDesktopToolbar = ({
             },
             children: [
               /* @__PURE__ */ jsxs95(
-                Box48,
+                Box49,
                 {
                   sx: {
                     py: 1,
@@ -9986,7 +9997,7 @@ var TableDesktopToolbar = ({
                 }
               ),
               /* @__PURE__ */ jsx141(
-                Box48,
+                Box49,
                 {
                   ref: scrollRef,
                   sx: {
@@ -10008,7 +10019,7 @@ var TableDesktopToolbar = ({
                       return null;
                     }
                     return editableCellType && /* @__PURE__ */ jsx141(
-                      Box48,
+                      Box49,
                       {
                         sx: { width, flex: "0 0 auto" },
                         children: /* @__PURE__ */ jsx141(
@@ -10061,7 +10072,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,
@@ -10176,7 +10187,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()(() => ({
@@ -10216,7 +10227,7 @@ var TextDivider = ({
   const { classes } = useStyles47();
   const iconColor = color ?? colors.neutral900;
   return /* @__PURE__ */ jsxs96(
-    Box49,
+    Box50,
     {
       display: "flex",
       alignItems: "center",
@@ -10224,7 +10235,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,
@@ -10351,7 +10362,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) => ({
@@ -10378,9 +10389,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,
@@ -10389,7 +10400,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",
@@ -10399,7 +10410,7 @@ var TheToolbar = ({
         }
       ) }),
       /* @__PURE__ */ jsx145(
-        Box50,
+        Box51,
         {
           ml: { xs: 0, lg: 2 },
           sx: { flexShrink: 0, display: { xs: "none", xl: "block" } },
@@ -10407,7 +10418,7 @@ var TheToolbar = ({
         }
       ),
       centerSection ? /* @__PURE__ */ jsx145(
-        Box50,
+        Box51,
         {
           sx: {
             flexGrow: 1,
@@ -10417,8 +10428,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
   ] });
@@ -10471,7 +10482,7 @@ import {
   Typography as Typography38,
   Dialog as Dialog5,
   Backdrop,
-  Box as Box51,
+  Box as Box52,
   Divider as Divider13,
   Paper as Paper14,
   Fade as Fade2
@@ -10518,9 +10529,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
@@ -10529,7 +10540,7 @@ var TwoButtonDialog = ({
             }
           ) }),
           /* @__PURE__ */ jsxs98(
-            Box51,
+            Box52,
             {
               className: classes.mt,
               sx: {
@@ -10543,7 +10554,7 @@ var TwoButtonDialog = ({
           )
         ] }),
         /* @__PURE__ */ jsx147(Divider13, {}),
-        /* @__PURE__ */ jsxs98(Box51, { className: classes.buttonContainer, children: [
+        /* @__PURE__ */ jsxs98(Box52, { className: classes.buttonContainer, children: [
           /* @__PURE__ */ jsx147(
             FilledButton_default,
             {