@natoora-libs/core 0.1.9-dev-doug-4 → 0.1.9-dev-doug-6

package/dist/components/index.js

@@ -2781,7 +2781,7 @@ var RoundButton = ({
       onClick(e);
     }
   };
-  const Button14 = /* @__PURE__ */ jsx63(
+  const Button15 = /* @__PURE__ */ jsx63(
     Fab,
     {
       className: cx(
@@ -2805,7 +2805,7 @@ var RoundButton = ({
       children: icon ? iconComponentMap[icon] : children || ""
     }
   );
-  return tooltip ? /* @__PURE__ */ jsx63(Tooltip2, { title: tooltip, children: Button14 }) : Button14;
+  return tooltip ? /* @__PURE__ */ jsx63(Tooltip2, { title: tooltip, children: Button15 }) : Button15;
 };
 var RoundButton_default = RoundButton;
 
@@ -6592,7 +6592,7 @@ var Switch_default = memo19(LabelledSwitch);
 import { useMemo as useMemo3, useState as useState16, useEffect as useEffect11, memo as memo21 } from "react";
 import CheckIcon from "@mui/icons-material/Check";
 import {
-  Box as Box30,
+  Box as Box29,
   Checkbox as Checkbox5,
   Divider as Divider9,
   FormControlLabel as FormControlLabel3,
@@ -6616,7 +6616,8 @@ import {
   TableBody,
   TableContainer,
   Skeleton as Skeleton2,
-  Box as Box29
+  TableRow as TableRow3,
+  TableCell as TableCell3
 } from "@mui/material";
 import { makeStyles as makeStyles47 } from "tss-react/mui";
 
@@ -6813,6 +6814,7 @@ var TableEmptyResult_default = TableEmptyResult;
 
 // src/components/TableDesktop/TableDesktop.tsx
 import { jsx as jsx110, jsxs as jsxs75 } from "react/jsx-runtime";
+var ROW_HEIGHT = 56;
 var useStyles47 = makeStyles47()((theme) => ({
   root: {
     justifyContent: "space-between",
@@ -6898,14 +6900,14 @@ var TableDesktop = ({
   onApplyFilters,
   shouldShowCheckOnFilter
 }) => {
+  const { classes } = useStyles47();
   const [order, setOrder] = useState15(appliedFilters?.sortDir || "desc");
   const [orderBy, setOrderBy] = useState15(
     appliedFilters?.sortField || "delivery_date"
   );
   const [selected, setSelected] = useState15(/* @__PURE__ */ new Set());
   const [page] = useState15(0);
-  const { classes } = useStyles47();
-  const rowHeight = 56;
+  const numRows = data.length;
   const emptyRows = useMemo2(
     () => rowsPerPage - data.length,
     [rowsPerPage, data]
@@ -6951,6 +6953,18 @@ var TableDesktop = ({
   );
   const renderTableRows = useMemo2(() => {
     const sortedData = disableInternalSort ? data : stableSort(data, getComparator(order, orderBy));
+    if (isLoading) {
+      return [...Array(Math.min(numRows, rowsPerPage))].map((_, rowIndex) => /* @__PURE__ */ jsx110(TableRow3, { children: [...Array(visibleHeadCells.length)].map((_2, cellIndex) => /* @__PURE__ */ jsx110(TableCell3, { children: /* @__PURE__ */ jsx110(
+        Skeleton2,
+        {
+          animation: "pulse",
+          variant: "rounded",
+          height: ROW_HEIGHT - 33,
+          sx: { bgcolor: colors.neutral150 },
+          "data-testid": "loading-skeleton"
+        }
+      ) }, cellIndex)) }, rowIndex));
+    }
     return sortedData.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((row, index) => {
       const isItemSelected = selected.has(row[keyField]);
       return /* @__PURE__ */ jsx110(
@@ -6962,8 +6976,8 @@ var TableDesktop = ({
             deleteItem,
             isItemSelected,
             enableCheckboxSelection,
-            enableRowActions,
-            keyFieldValue: row[keyField],
+            rowHeight: ROW_HEIGHT,
+            rowId: row[keyField],
             handleRowCheckboxChange,
             visibleHeadCells
           }
@@ -6993,17 +7007,7 @@ var TableDesktop = ({
     }
   }, [enableCheckboxSelection]);
   return /* @__PURE__ */ jsx110("div", { className: classes.root, style: { height }, children: /* @__PURE__ */ jsxs75(Paper10, { className: classes.paper, children: [
-    isLoading ? /* @__PURE__ */ jsx110(Box29, { width: "100%", overflow: "hidden", children: [...Array(Math.floor(rowsPerPage ?? 50))].map((_, index) => /* @__PURE__ */ jsx110(
-      Skeleton2,
-      {
-        animation: "pulse",
-        variant: "rounded",
-        sx: { margin: 1 },
-        height: rowHeight,
-        "data-testid": "loading-skeleton"
-      },
-      index
-    )) }) : /* @__PURE__ */ jsx110(TableContainer, { className: classes.container, children: /* @__PURE__ */ jsxs75(
+    /* @__PURE__ */ jsx110(TableContainer, { className: classes.container, children: /* @__PURE__ */ jsxs75(
       Table,
       {
         stickyHeader: true,
@@ -7018,7 +7022,7 @@ var TableDesktop = ({
               order,
               orderBy,
               numSelected: selected.size,
-              numRows: data.length,
+              numRows,
               enableCheckboxSelection,
               headerFilters: headerFilters ?? {},
               onRequestSort: handleRequestSort,
@@ -7156,7 +7160,7 @@ var SmartTableHeaderFilterMenu = ({
   const isOptionChecked = useMemo3(() => (resolvedOption) => !!selectedFilters?.some(
     (value) => resolveOptionType(value, headCell.fieldName ?? "") === resolvedOption
   ), [selectedFilters]);
-  const loadingSkeletons = /* @__PURE__ */ jsxs76(Box30, { "data-testid": "loading-skeletons", width: 272, children: [
+  const loadingSkeletons = /* @__PURE__ */ jsxs76(Box29, { "data-testid": "loading-skeletons", width: 272, children: [
     /* @__PURE__ */ jsx111(Skeleton3, { variant: "rounded", className: classes.skeleton }),
     /* @__PURE__ */ jsx111(Divider9, {}),
     /* @__PURE__ */ jsx111(Skeleton3, { variant: "rounded", className: classes.skeleton }),
@@ -7186,8 +7190,8 @@ var SmartTableHeaderFilterMenu = ({
         "data-testid": "filter-menu",
         anchorOrigin: { vertical: "bottom", horizontal: "right" },
         transformOrigin: { vertical: "top", horizontal: "right" },
-        children: headCell.isFetchingFilterOptions ? loadingSkeletons : /* @__PURE__ */ jsxs76(Box30, { className: classes.filterMenu, children: [
-          /* @__PURE__ */ jsx111(Box30, { px: 3, mb: 0.5, children: /* @__PURE__ */ jsx111(
+        children: headCell.isFetchingFilterOptions ? loadingSkeletons : /* @__PURE__ */ jsxs76(Box29, { className: classes.filterMenu, children: [
+          /* @__PURE__ */ jsx111(Box29, { px: 3, mb: 0.5, children: /* @__PURE__ */ jsx111(
             FormControlLabel3,
             {
               label: "Select All",
@@ -7209,11 +7213,11 @@ var SmartTableHeaderFilterMenu = ({
             }
           ) }),
           /* @__PURE__ */ jsx111(Divider9, { sx: { mb: 0.5 } }),
-          /* @__PURE__ */ jsx111(Box30, { className: classes.filterOptions, children: filterOptionsData?.map(
+          /* @__PURE__ */ jsx111(Box29, { className: classes.filterOptions, children: filterOptionsData?.map(
             (option) => {
               const resolvedOption = resolveOptionType(option, headCell.fieldName ?? "");
               return /* @__PURE__ */ jsxs76(
-                Box30,
+                Box29,
                 {
                   className: classes.filter,
                   children: [
@@ -7240,7 +7244,7 @@ var SmartTableHeaderFilterMenu = ({
             }
           ) }),
           /* @__PURE__ */ jsx111(Divider9, { sx: { mb: 0.5 } }),
-          /* @__PURE__ */ jsxs76(Box30, { className: classes.applyFilterButtonsContainer, children: [
+          /* @__PURE__ */ jsxs76(Box29, { className: classes.applyFilterButtonsContainer, children: [
             /* @__PURE__ */ jsx111(
               ExtendedButton_default,
               {
@@ -7273,26 +7277,26 @@ var SmartTableHeaderFilterMenu_default = memo21(SmartTableHeaderFilterMenu);
 var import_debounce = __toESM(require_debounce(), 1);
 import { useLayoutEffect, useState as useState17 } from "react";
 import {
-  Box as Box32,
+  Box as Box31,
   Paper as Paper11,
   Table as MUITable,
   TableBody as TableBody2,
-  TableCell as TableCell3,
+  TableCell as TableCell4,
   TableContainer as TableContainer2,
   TableHead as TableHead2,
-  TableRow as TableRow3,
+  TableRow as TableRow4,
   TableSortLabel as TableSortLabel2
 } from "@mui/material";
 import { makeStyles as makeStyles49 } from "tss-react/mui";
 import { v4 as uuidv4 } from "uuid";
 
 // src/components/TableLoading/TableLoading.tsx
-import { Box as Box31, Skeleton as Skeleton4 } from "@mui/material";
+import { Box as Box30, Skeleton as Skeleton4 } from "@mui/material";
 import { jsx as jsx112 } from "react/jsx-runtime";
 var TableLoading = ({
   rowsPerPage,
   rowHeight
-}) => /* @__PURE__ */ jsx112(Box31, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ jsx112(
+}) => /* @__PURE__ */ jsx112(Box30, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ jsx112(
   Skeleton4,
   {
     animation: "pulse",
@@ -7421,18 +7425,18 @@ var Table2 = ({
       if (RenderItem) {
         return /* @__PURE__ */ jsx113(RenderItem, { ...row }, row.id);
       }
-      return /* @__PURE__ */ jsx113(TableRow3, { hover: true, onClick: () => onRowClick?.(row), children: headCells?.map((column) => /* @__PURE__ */ jsx113(TableCell3, { children: row[column.id] }, column.id)) }, row.id);
+      return /* @__PURE__ */ jsx113(TableRow4, { hover: true, onClick: () => onRowClick?.(row), children: headCells?.map((column) => /* @__PURE__ */ jsx113(TableCell4, { children: row[column.id] }, column.id)) }, row.id);
     });
     if (emptyRows > 0 && rowsPerPage > emptyRows) {
       rowsComponents.push(
-        /* @__PURE__ */ jsx113(TableRow3, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ jsx113(TableCell3, { colSpan: 8 }) }, uuidv4())
+        /* @__PURE__ */ jsx113(TableRow4, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ jsx113(TableCell4, { colSpan: 8 }) }, uuidv4())
       );
     }
     return rowsComponents;
   };
-  return /* @__PURE__ */ jsx113(Paper11, { className: classes.root, children: /* @__PURE__ */ jsx113(Box32, { className: classes.paper, children: isLoading ? /* @__PURE__ */ jsx113(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ jsx113(TableContainer2, { className: classes.container, children: /* @__PURE__ */ jsxs77(MUITable, { size: "medium", stickyHeader: true, children: [
-    /* @__PURE__ */ jsx113(TableHead2, { className: classes.header, children: /* @__PURE__ */ jsx113(TableRow3, { children: headCells?.map((headCell) => /* @__PURE__ */ jsx113(
-      TableCell3,
+  return /* @__PURE__ */ jsx113(Paper11, { className: classes.root, children: /* @__PURE__ */ jsx113(Box31, { className: classes.paper, children: isLoading ? /* @__PURE__ */ jsx113(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ jsx113(TableContainer2, { className: classes.container, children: /* @__PURE__ */ jsxs77(MUITable, { size: "medium", stickyHeader: true, children: [
+    /* @__PURE__ */ jsx113(TableHead2, { className: classes.header, children: /* @__PURE__ */ jsx113(TableRow4, { children: headCells?.map((headCell) => /* @__PURE__ */ jsx113(
+      TableCell4,
       {
         align: "left",
         sortDirection: orderBy === headCell.id ? order : void 0,
@@ -7450,52 +7454,95 @@ var Table2 = ({
     )) }) }),
     /* @__PURE__ */ jsxs77(TableBody2, { children: [
       getTableRows(),
-      rowsPerPage === emptyRows && /* @__PURE__ */ jsx113(TableRow3, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ jsx113(TableCell3, { colSpan: 8, align: "center", children: "Nothing to display" }) })
+      rowsPerPage === emptyRows && /* @__PURE__ */ jsx113(TableRow4, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ jsx113(TableCell4, { colSpan: 8, align: "center", children: "Nothing to display" }) })
     ] })
   ] }) }) }) });
 };
 var Table_default = Table2;
 
-// src/components/TableDesktopRowActions/TableDesktopRowActions.tsx
-import { Box as Box33, TableCell as TableCell4 } from "@mui/material";
-import { jsx as jsx114 } from "react/jsx-runtime";
-var TableDesktopRowActions = ({
-  isRowHovered,
-  children,
-  sx,
-  zIndex = 1,
-  backgroundColor
+// src/components/TableDesktopFooter/TableDesktopFooter.tsx
+import Refresh3 from "@mui/icons-material/Refresh";
+import { Box as Box32, Button as Button13, MenuItem as MenuItem4, Pagination as Pagination2, Select as Select4, Stack, Typography as Typography27 } from "@mui/material";
+import { jsx as jsx114, jsxs as jsxs78 } from "react/jsx-runtime";
+var TableDesktopFooter = ({
+  numPages,
+  page,
+  pageSize,
+  pageSizeOptions,
+  handlePageChange,
+  handlePageSizeChange,
+  refetch,
+  isFetching
 }) => {
-  return isRowHovered ? /* @__PURE__ */ jsx114(
-    TableCell4,
+  return /* @__PURE__ */ jsxs78(
+    Box32,
     {
-      padding: "none",
-      sx: {
-        top: 0,
-        right: 0,
-        zIndex,
-        position: "sticky",
-        display: "flex",
-        justifyContent: "flex-end",
-        alignItems: "center"
-      },
-      children: /* @__PURE__ */ jsx114(
-        Box33,
-        {
-          sx,
-          display: "flex",
-          flexDirection: "row",
-          bgcolor: backgroundColor ?? colors.neutral100,
-          children
-        }
-      )
+      py: 1,
+      gap: 2,
+      display: "flex",
+      justifyContent: "space-between",
+      alignItems: "center",
+      borderTop: `1px solid ${colors.neutral300}`,
+      bgcolor: (theme) => theme.palette.background.default,
+      children: [
+        /* @__PURE__ */ jsxs78(
+          Button13,
+          {
+            disableRipple: true,
+            variant: "outlined",
+            onClick: () => refetch(),
+            disabled: isFetching,
+            sx: {
+              ml: 1,
+              gap: 1,
+              borderRadius: 25,
+              color: colors.neutral800,
+              borderColor: colors.neutral600
+            },
+            children: [
+              /* @__PURE__ */ jsx114(
+                Refresh3,
+                {
+                  fontSize: "small",
+                  color: isFetching ? "disabled" : "primary"
+                }
+              ),
+              "REFRESH"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs78(Box32, { display: "flex", children: [
+          /* @__PURE__ */ jsxs78(Stack, { direction: "row", spacing: 2, alignItems: "center", children: [
+            /* @__PURE__ */ jsx114(Typography27, { children: "Rows per page:" }),
+            /* @__PURE__ */ jsx114(
+              Select4,
+              {
+                value: pageSize,
+                onChange: handlePageSizeChange,
+                size: "small",
+                variant: "standard",
+                children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx114(MenuItem4, { value: size, children: size }, size))
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx114(
+            Pagination2,
+            {
+              color: "standard",
+              count: numPages,
+              page,
+              onChange: handlePageChange
+            }
+          )
+        ] })
+      ]
     }
-  ) : null;
+  );
 };
 
 // src/components/TableDesktopRowCell/TableDesktopRowCell.tsx
 import { useEffect as useEffect13, useRef as useRef5, useState as useState20 } from "react";
-import { Checkbox as Checkbox6, TableCell as TableCell5, TextField as TextField9, Tooltip as Tooltip7 } from "@mui/material";
+import { Box as Box33, Checkbox as Checkbox6, IconButton as IconButton4, TableCell as TableCell5, TextField as TextField9, Tooltip as Tooltip7 } from "@mui/material";
 
 // src/components/TableDesktopRowCell/TableDesktopSmartSelect.tsx
 import { useState as useState18, memo as memo22, useEffect as useEffect12 } from "react";
@@ -7512,6 +7559,7 @@ var TableDesktopSmartSelect = memo22(({
   inputLabel,
   fieldName,
   rowId,
+  disabled,
   filterOptions,
   refetchFilterOptions,
   isFetchingFilterOptions,
@@ -7537,6 +7585,7 @@ var TableDesktopSmartSelect = memo22(({
       value: valueId,
       inputLabel,
       options,
+      disabled,
       refetch: refetchFilterOptions,
       isFetching: isFetchingFilterOptions,
       defaultOption: {
@@ -7562,11 +7611,12 @@ var TableDesktopTextField = ({
   rowId,
   editInitialValue,
   inputLabel,
+  disabled,
   validateInput,
   onUpdateEditableCell
 }) => {
   const [value, setValue] = useState19(editInitialValue);
-  const hasError = useMemo4(() => validateInput?.(value), [value, validateInput]);
+  const hasError = useMemo4(() => !validateInput?.(value), [value, validateInput]);
   return /* @__PURE__ */ jsx116(
     TextField8,
     {
@@ -7575,6 +7625,7 @@ var TableDesktopTextField = ({
       defaultValue: value,
       label: inputLabel,
       error: hasError,
+      disabled,
       onChange: ({ target: { value: value2 } }) => {
         setValue(value2);
       },
@@ -7589,38 +7640,55 @@ var TableDesktopTextField = ({
 };
 
 // src/components/TableDesktopRowCell/TableDesktopRowCell.tsx
-import { jsx as jsx117 } from "react/jsx-runtime";
+import Close2 from "@mui/icons-material/Close";
+import Edit3 from "@mui/icons-material/Edit";
+import { jsx as jsx117, jsxs as jsxs79 } from "react/jsx-runtime";
 var TableDesktopRowCell = ({
-  ref,
   inputLabel,
   editInitialValue,
   rowId,
   fieldName,
   width,
-  isEditMode,
+  disabled,
   readOnlyValue,
   editableCellType,
   filterOptions,
   refetchFilterOptions,
   isFetchingFilterOptions,
   validateInput,
-  onUpdateEditableCell
+  onUpdateEditableCell,
+  onCellClick
 }) => {
   const cellRef = useRef5(null);
   const [isOverflowed, setIsOverflowed] = useState20(false);
+  const [isCellHovered, setIsCellHovered] = useState20(false);
+  const [isEditMode, setIsEditMode] = useState20(false);
   useEffect13(() => {
-    const ref2 = cellRef.current;
-    if (ref2) {
-      setIsOverflowed(ref2.scrollWidth > ref2.clientWidth);
+    const ref = cellRef.current;
+    if (ref) {
+      setIsOverflowed(ref.scrollWidth > ref.clientWidth);
     }
   }, [readOnlyValue, width]);
+  useEffect13(() => {
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") {
+        setIsEditMode(false);
+      }
+    };
+    if (isEditMode) {
+      window.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isEditMode]);
   const editableComponents = {
     "select": /* @__PURE__ */ jsx117(
       TableDesktopSmartSelect,
       {
-        ref,
         rowId,
         fieldName,
+        disabled,
         initialValue: editInitialValue,
         inputLabel: inputLabel ?? "",
         filterOptions,
@@ -7633,6 +7701,7 @@ var TableDesktopRowCell = ({
       Checkbox6,
       {
         disableRipple: true,
+        disabled,
         defaultChecked: editInitialValue,
         onChange: ({ target: { checked } }) => {
           onUpdateEditableCell?.(rowId, checked);
@@ -7643,6 +7712,7 @@ var TableDesktopRowCell = ({
       TableDesktopTextField,
       {
         rowId,
+        disabled,
         editInitialValue,
         inputLabel: inputLabel ?? "",
         validateInput,
@@ -7654,6 +7724,7 @@ var TableDesktopRowCell = ({
       {
         fullWidth: true,
         variant: "standard",
+        disabled,
         defaultValue: editInitialValue,
         label: inputLabel,
         onChange: (e) => {
@@ -7676,18 +7747,49 @@ var TableDesktopRowCell = ({
     }
     return "-";
   };
+  const handleEditClick = (e) => {
+    e.stopPropagation();
+    setIsEditMode((prev) => !prev);
+  };
   return /* @__PURE__ */ jsx117(Tooltip7, { title: isOverflowed ? String(readOnlyValue) : "", arrow: true, children: /* @__PURE__ */ jsx117(
     TableCell5,
     {
       ref: cellRef,
       align: "left",
+      onMouseEnter: () => editableCellType && !disabled && setIsCellHovered(true),
+      onMouseLeave: () => editableCellType && !disabled && setIsCellHovered(false),
+      onClick: (event) => !disabled && onCellClick?.(event, isEditMode),
       sx: {
+        padding: 1,
         width: width ?? "auto",
         overflow: "hidden",
         textOverflow: "ellipsis",
-        whiteSpace: "nowrap"
+        whiteSpace: "nowrap",
+        position: "relative",
+        cursor: disabled ? "default" : "pointer",
+        opacity: disabled ? 0.2 : 1,
+        ":hover": editableCellType && {
+          background: isEditMode ? colors.lightBlueBackground : colors.neutral100
+        },
+        background: isEditMode ? colors.lightBlueBackground : (theme) => theme.palette.background.default
       },
-      children: isEditMode && editableCellType ? editableComponents[editableCellType] : typeof readOnlyValue === "boolean" ? getReadOnlyBooleanIcon(readOnlyValue) : readOnlyValue
+      children: /* @__PURE__ */ jsxs79(Box33, { p: 1, children: [
+        isCellHovered ? /* @__PURE__ */ jsx117(Tooltip7, { title: "Toggle Edit Mode", children: /* @__PURE__ */ jsx117(
+          IconButton4,
+          {
+            onClick: handleEditClick,
+            sx: {
+              position: "absolute",
+              top: 0,
+              right: 0,
+              zIndex: 1,
+              borderRadius: 0
+            },
+            children: isEditMode ? /* @__PURE__ */ jsx117(Close2, { fontSize: "small", color: "error" }) : /* @__PURE__ */ jsx117(Edit3, { fontSize: "small" })
+          }
+        ) }) : null,
+        isEditMode && editableCellType ? editableComponents[editableCellType] : typeof readOnlyValue === "boolean" ? getReadOnlyBooleanIcon(readOnlyValue) : readOnlyValue
+      ] })
     }
   ) });
 };
@@ -7695,7 +7797,7 @@ var TableDesktopRowCell = ({
 // src/components/TableHeader/TableHeader.tsx
 import { memo as memo23, useEffect as useEffect14, useState as useState21 } from "react";
 import { ImportExport as ImportExportIcon } from "@mui/icons-material";
-import { TableCell as TableCell6, TableHead as TableHead3, TableRow as TableRow4, TableSortLabel as TableSortLabel3 } from "@mui/material";
+import { TableCell as TableCell6, TableHead as TableHead3, TableRow as TableRow5, TableSortLabel as TableSortLabel3 } from "@mui/material";
 import { makeStyles as makeStyles50 } from "tss-react/mui";
 import { jsx as jsx118 } from "react/jsx-runtime";
 var useStyles50 = makeStyles50()(() => ({
@@ -7742,7 +7844,7 @@ var TableHeader = ({ cells, onSort = null }) => {
     });
     setSortableCells(sortedCells);
   };
-  return /* @__PURE__ */ jsx118(TableHead3, { children: /* @__PURE__ */ jsx118(TableRow4, { children: sortableCells.map((cell, key) => /* @__PURE__ */ jsx118(TableCell6, { children: cell.isSortable ? /* @__PURE__ */ jsx118(
+  return /* @__PURE__ */ jsx118(TableHead3, { children: /* @__PURE__ */ jsx118(TableRow5, { children: sortableCells.map((cell, key) => /* @__PURE__ */ jsx118(TableCell6, { children: cell.isSortable ? /* @__PURE__ */ jsx118(
     TableSortLabel3,
     {
       className: classes.sortLabel,
@@ -7756,9 +7858,9 @@ var TableHeader = ({ cells, onSort = null }) => {
 var TableHeader_default = memo23(TableHeader);
 
 // src/components/TextDivider/TextDivider.tsx
-import { Box as Box34, Typography as Typography27, Divider as Divider10, Button as Button13 } from "@mui/material";
+import { Box as Box34, Typography as Typography28, Divider as Divider10, Button as Button14 } from "@mui/material";
 import { makeStyles as makeStyles51 } from "tss-react/mui";
-import { jsx as jsx119, jsxs as jsxs78 } from "react/jsx-runtime";
+import { jsx as jsx119, jsxs as jsxs80 } from "react/jsx-runtime";
 var useStyles51 = makeStyles51()(() => ({
   icon: {
     fontSize: 20
@@ -7795,7 +7897,7 @@ var TextDivider = ({
 }) => {
   const { classes } = useStyles51();
   const iconColor = color ?? colors.neutral900;
-  return /* @__PURE__ */ jsxs78(
+  return /* @__PURE__ */ jsxs80(
     Box34,
     {
       display: "flex",
@@ -7804,10 +7906,10 @@ var TextDivider = ({
       className: classes.container,
       children: [
         /* @__PURE__ */ jsx119(Divider10, { className: classes.leftDivider }),
-        /* @__PURE__ */ jsx119(Button13, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ jsxs78(Box34, { className: classes.center, children: [
+        /* @__PURE__ */ jsx119(Button14, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ jsxs80(Box34, { className: classes.center, children: [
           Icon2 && iconPosition === "left" && /* @__PURE__ */ jsx119(Icon2, { className: classes.icon, style: { color: iconColor } }),
           /* @__PURE__ */ jsx119(
-            Typography27,
+            Typography28,
             {
               color: "textSecondary",
               className: classes.title,
@@ -7933,7 +8035,7 @@ var ThemedDateRangePicker_default = ThemedDateRangePicker;
 import { memo as memo24 } from "react";
 import { AppBar, Box as Box35, Toolbar } from "@mui/material";
 import { makeStyles as makeStyles53 } from "tss-react/mui";
-import { jsx as jsx121, jsxs as jsxs79 } from "react/jsx-runtime";
+import { jsx as jsx121, jsxs as jsxs81 } from "react/jsx-runtime";
 var useStyles53 = makeStyles53()((theme) => ({
   menuButton: {
     color: theme.palette.primary.contrastText
@@ -7953,8 +8055,8 @@ var TheToolbar = ({
   rightSection
 }) => {
   const { classes } = useStyles53();
-  return /* @__PURE__ */ jsxs79(Box35, { children: [
-    /* @__PURE__ */ jsx121(AppBar, { children: /* @__PURE__ */ jsxs79(Toolbar, { className: classes.topBar, children: [
+  return /* @__PURE__ */ jsxs81(Box35, { children: [
+    /* @__PURE__ */ jsx121(AppBar, { children: /* @__PURE__ */ jsxs81(Toolbar, { className: classes.topBar, children: [
       /* @__PURE__ */ jsx121(
         RoundButton_default,
         {
@@ -8024,7 +8126,7 @@ var ToastMessage_default = ToastMessage;
 
 // src/components/TwoButtonDialog/TwoButtonDialog.tsx
 import {
-  Typography as Typography28,
+  Typography as Typography29,
   Dialog as Dialog5,
   Backdrop,
   Box as Box36,
@@ -8033,7 +8135,7 @@ import {
   Fade as Fade2
 } from "@mui/material";
 import { makeStyles as makeStyles54 } from "tss-react/mui";
-import { jsx as jsx123, jsxs as jsxs80 } from "react/jsx-runtime";
+import { jsx as jsx123, jsxs as jsxs82 } from "react/jsx-runtime";
 var useStyles54 = makeStyles54()((theme) => ({
   paper: {
     padding: theme.spacing(2)
@@ -8073,9 +8175,9 @@ var TwoButtonDialog = ({
       closeAfterTransition: true,
       BackdropComponent: Backdrop,
       BackdropProps: { timeout: 500 },
-      children: /* @__PURE__ */ jsx123(Fade2, { in: open, children: /* @__PURE__ */ jsxs80(Paper12, { className: classes.paper, children: [
-        /* @__PURE__ */ jsxs80(Box36, { className: classes.mb, children: [
-          /* @__PURE__ */ jsx123(Typography28, { variant: "h5", component: "div", children: /* @__PURE__ */ jsx123(
+      children: /* @__PURE__ */ jsx123(Fade2, { in: open, children: /* @__PURE__ */ jsxs82(Paper12, { className: classes.paper, children: [
+        /* @__PURE__ */ jsxs82(Box36, { className: classes.mb, children: [
+          /* @__PURE__ */ jsx123(Typography29, { variant: "h5", component: "div", children: /* @__PURE__ */ jsx123(
             Box36,
             {
               sx: {
@@ -8084,7 +8186,7 @@ var TwoButtonDialog = ({
               children: title
             }
           ) }),
-          /* @__PURE__ */ jsxs80(
+          /* @__PURE__ */ jsxs82(
             Box36,
             {
               className: classes.mt,
@@ -8092,14 +8194,14 @@ var TwoButtonDialog = ({
                 fontWeight: 600
               },
               children: [
-                subtitle1 && /* @__PURE__ */ jsx123(Typography28, { variant: "subtitle1", children: subtitle1 }),
-                subtitle2 && /* @__PURE__ */ jsx123(Typography28, { variant: "subtitle1", children: subtitle2 })
+                subtitle1 && /* @__PURE__ */ jsx123(Typography29, { variant: "subtitle1", children: subtitle1 }),
+                subtitle2 && /* @__PURE__ */ jsx123(Typography29, { variant: "subtitle1", children: subtitle2 })
               ]
             }
           )
         ] }),
         /* @__PURE__ */ jsx123(Divider11, {}),
-        /* @__PURE__ */ jsxs80(Box36, { className: classes.buttonContainer, children: [
+        /* @__PURE__ */ jsxs82(Box36, { className: classes.buttonContainer, children: [
           /* @__PURE__ */ jsx123(
             FilledButton_default,
             {
@@ -8131,9 +8233,9 @@ var TwoButtonDialog_default = TwoButtonDialog;
 
 // src/components/UserBust/UserBust.tsx
 import { memo as memo25 } from "react";
-import { Avatar as Avatar2, Typography as Typography29 } from "@mui/material";
-import { jsx as jsx124, jsxs as jsxs81 } from "react/jsx-runtime";
-var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ jsxs81("div", { children: [
+import { Avatar as Avatar2, Typography as Typography30 } from "@mui/material";
+import { jsx as jsx124, jsxs as jsxs83 } from "react/jsx-runtime";
+var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ jsxs83("div", { children: [
   /* @__PURE__ */ jsx124(
     Avatar2,
     {
@@ -8142,9 +8244,9 @@ var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ jsxs8
       style: { width: avatarProps.width, height: avatarProps.height }
     }
   ),
-  /* @__PURE__ */ jsxs81("div", { style: { paddingTop: 16 }, children: [
-    /* @__PURE__ */ jsx124(Typography29, { ...typographyProps.name, children: `${user.first_name} ${user.last_name}` }),
-    /* @__PURE__ */ jsx124(Typography29, { ...typographyProps.username, children: user.username })
+  /* @__PURE__ */ jsxs83("div", { style: { paddingTop: 16 }, children: [
+    /* @__PURE__ */ jsx124(Typography30, { ...typographyProps.name, children: `${user.first_name} ${user.last_name}` }),
+    /* @__PURE__ */ jsx124(Typography30, { ...typographyProps.username, children: user.username })
   ] })
 ] });
 var UserBust_default = memo25(UserBust);
@@ -8240,7 +8342,7 @@ export {
   Switch_default as Switch,
   Table_default as Table,
   TableDesktop_default as TableDesktop,
-  TableDesktopRowActions,
+  TableDesktopFooter,
   TableDesktopRowCell,
   TableDesktopSmartSelect,
   TableEmptyResult_default as TableEmptyResult,