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

package/dist/components/index.js

@@ -6871,6 +6871,7 @@ var useStyles46 = makeStyles46()((theme) => ({
   tableHeaderContent: {
     borderBottom: "1px solid",
     borderBottomColor: colors.neutral300,
+    backgroundColor: colors.neutral100,
     whiteSpace: "nowrap",
     "& .filter-menu-trigger": {
       visibility: "hidden",
@@ -6921,7 +6922,7 @@ var SmartTableHeader = ({
   };
   const isSortActive = (headCellId) => orderBy === headCellId;
   return /* @__PURE__ */ jsx109(TableHead, { className: classes.root, children: /* @__PURE__ */ jsxs74(TableRow, { children: [
-    enableCheckboxSelection ? /* @__PURE__ */ jsx109(TableCell, { padding: "checkbox", children: /* @__PURE__ */ jsx109(
+    enableCheckboxSelection ? /* @__PURE__ */ jsx109(TableCell, { padding: "checkbox", sx: { backgroundColor: colors.neutral100 }, children: /* @__PURE__ */ jsx109(
       Checkbox5,
       {
         color: "primary",
@@ -7396,16 +7397,28 @@ import { Box as Box33, Button as Button14, Typography as Typography28 } from "@m
 import { jsx as jsx116, jsxs as jsxs78 } from "react/jsx-runtime";
 var TableDesktopRowSelectionBar = ({
   isEveryRowInPageSelected,
-  isRowsInAllPagesSelected,
+  isRowsFromAllPagesSelected,
   numSelectedRows,
   totalRowCount,
-  handleRowSelectionBarClick
+  onSelectRowsFromAllPagesClick,
+  onClearSelectionClick
 }) => {
-  return isEveryRowInPageSelected ? /* @__PURE__ */ jsxs78(
+  const isAnyRowSelected = numSelectedRows > 0;
+  const getSelectedRowsText = () => {
+    if (isRowsFromAllPagesSelected) {
+      return `All ${totalRowCount} rows from all pages are selected based on your filters.`;
+    }
+    if (isEveryRowInPageSelected) {
+      return `All ${numSelectedRows} rows on this page are selected.`;
+    }
+    return `${numSelectedRows} row${numSelectedRows > 1 ? "s" : ""} selected.`;
+  };
+  return isAnyRowSelected ? /* @__PURE__ */ jsxs78(
     Box33,
     {
       sx: {
         p: 1,
+        height: 40,
         gap: 2,
         display: "flex",
         justifyContent: "center",
@@ -7413,8 +7426,13 @@ var TableDesktopRowSelectionBar = ({
         backgroundColor: colors.neutral150
       },
       children: [
-        /* @__PURE__ */ jsx116(Typography28, { children: isRowsInAllPagesSelected ? `All ${totalRowCount} rows are selected based on your filters.` : `All ${numSelectedRows} rows on this page are selected.` }),
-        /* @__PURE__ */ jsx116(Button14, { onClick: handleRowSelectionBarClick, children: isRowsInAllPagesSelected ? "Clear Selection" : `Select all ${totalRowCount} rows from all pages based on your filters.` })
+        /* @__PURE__ */ jsx116(Typography28, { children: getSelectedRowsText() }),
+        !isRowsFromAllPagesSelected ? /* @__PURE__ */ jsxs78(Button14, { onClick: onSelectRowsFromAllPagesClick, children: [
+          "Select all ",
+          totalRowCount,
+          " rows from all pages based on your filters"
+        ] }) : null,
+        /* @__PURE__ */ jsx116(Button14, { onClick: onClearSelectionClick, children: "Clear Selection" })
       ]
     }
   ) : null;
@@ -7501,7 +7519,7 @@ var TableDesktop = ({
     appliedFilters?.sortField || "delivery_date"
   );
   const [selectedRows, setSelectedRows] = useState17(/* @__PURE__ */ new Set());
-  const [isRowsInAllPagesSelected, setIsRowsInAllPagesSelected] = useState17(false);
+  const [isRowsFromAllPagesSelected, setIsRowsFromAllPagesSelected] = useState17(false);
   const { toolbar: Toolbar2 } = components ?? {};
   const { toolbarProps, footerProps } = componentsProps ?? {};
   const numRows = useMemo3(
@@ -7529,15 +7547,18 @@ var TableDesktop = ({
       updateSort(property, orderDir);
     }
   };
+  const selectAllRowsInPage = () => {
+    const allRowsIds = new Set(data.map((n) => n[keyField]));
+    ;
+    setSelectedRows(allRowsIds);
+  };
   const resetSelectedRows = () => {
     setSelectedRows(/* @__PURE__ */ new Set());
-    setIsRowsInAllPagesSelected(false);
+    setIsRowsFromAllPagesSelected(false);
   };
   const handleSelectAllClick = (event) => {
     if (event.target.checked) {
-      const allRowsIds = new Set(data.map((n) => n[keyField]));
-      ;
-      setSelectedRows(allRowsIds);
+      selectAllRowsInPage();
       return;
     }
     resetSelectedRows();
@@ -7551,15 +7572,22 @@ var TableDesktop = ({
       } else {
         newSelected.add(rowId);
       }
+      if (newSelected.size < numRows) {
+        setIsRowsFromAllPagesSelected(false);
+      }
       return newSelected;
     });
   };
-  const handleRowSelectionBarClick = () => {
-    if (isRowsInAllPagesSelected) {
-      resetSelectedRows();
-      return;
-    }
-    setIsRowsInAllPagesSelected(true);
+  const handleSelectRowsFromAllPagesClick = () => {
+    setIsRowsFromAllPagesSelected(true);
+    selectAllRowsInPage();
+  };
+  const handleClearSelectionClick = () => {
+    resetSelectedRows();
+  };
+  const handleApplyFilters = (updatedFilters, shouldSave) => {
+    resetSelectedRows();
+    onApplyFilters?.(updatedFilters, shouldSave);
   };
   const handlePageChange = (event, page) => {
     resetSelectedRows();
@@ -7571,13 +7599,13 @@ var TableDesktop = ({
     }
   }, [enableCheckboxSelection]);
   useEffect11(() => {
-    if (isEveryRowInPageSelected || isRowsInAllPagesSelected) {
+    if (isEveryRowInPageSelected || isRowsFromAllPagesSelected) {
       const rowsIdsSet = new Set(data.map((obj) => obj[keyField]));
       setSelectedRows(
         (prev) => new Set([...prev].filter((value) => rowsIdsSet.has(value)))
       );
     }
-  }, [data, setSelectedRows, isEveryRowInPageSelected, isRowsInAllPagesSelected]);
+  }, [data, setSelectedRows, isEveryRowInPageSelected, isRowsFromAllPagesSelected]);
   return /* @__PURE__ */ jsx118(
     Box34,
     {
@@ -7601,7 +7629,7 @@ var TableDesktop = ({
               Toolbar2,
               {
                 selectedRows: [...selectedRows],
-                isRowsInAllPagesSelected,
+                isRowsInAllPagesSelected: isRowsFromAllPagesSelected,
                 ...toolbarProps
               }
             ) : null,
@@ -7609,10 +7637,11 @@ var TableDesktop = ({
               TableDesktopRowSelectionBar,
               {
                 isEveryRowInPageSelected,
-                isRowsInAllPagesSelected,
+                isRowsFromAllPagesSelected,
                 numSelectedRows: selectedRows.size,
                 totalRowCount: totalDataCount ?? 0,
-                handleRowSelectionBarClick
+                onSelectRowsFromAllPagesClick: handleSelectRowsFromAllPagesClick,
+                onClearSelectionClick: handleClearSelectionClick
               }
             ),
             /* @__PURE__ */ jsx118(
@@ -7656,7 +7685,7 @@ var TableDesktop = ({
                           headerFilters: headerFilters ?? {},
                           onRequestSort: handleRequestSort,
                           onSelectAllClick: handleSelectAllClick,
-                          onApplyFilters,
+                          onApplyFilters: handleApplyFilters,
                           shouldShowCheckOnFilter
                         }
                       ),