@bigbinary/neeto-atoms 1.0.25 → 1.0.26

package/dist/{DataTable-Dre7vc3w.js → DataTable-DYam_kUE.js}

@@ -3534,11 +3534,11 @@ const ResizeHandle = ({ header }) => {
             : "bg-border opacity-0 group-hover/head:opacity-100") }));
 };
 
-const BulkSelectCallout = ({ bulkSelectAllRowsProps, isAllPageRowsSelected, isBulkAllSelected, }) => {
-    if (!isAllPageRowsSelected)
+const BulkSelectCallout = ({ bulkSelectAllRowsProps, isAllPageRowsSelected, isBulkAllSelected, onBulkSelectAll, onClearBulkSelection, }) => {
+    if (!isAllPageRowsSelected && !isBulkAllSelected)
         return null;
-    const { selectAllRowMessage, selectAllRowButtonLabel, setBulkSelectedAllRows, allRowsSelectedMessage, clearSelectionButtonLabel, } = bulkSelectAllRowsProps;
-    return (jsx("div", { className: "mb-2 flex items-center justify-center gap-1 rounded-lg bg-primary/10 px-4 py-1.5 text-sm text-primary", children: isBulkAllSelected ? (jsxs(Fragment, { children: [jsx("span", { children: allRowsSelectedMessage ?? selectAllRowMessage }), clearSelectionButtonLabel && (jsx(Button, { variant: "link", onClick: () => setBulkSelectedAllRows(false), children: clearSelectionButtonLabel }))] })) : (jsxs(Fragment, { children: [jsx("span", { children: selectAllRowMessage }), jsx(Button, { variant: "link", onClick: () => setBulkSelectedAllRows(true), children: selectAllRowButtonLabel })] })) }));
+    const { selectAllRowMessage, selectAllRowButtonLabel, allRowsSelectedMessage, clearSelectionButtonLabel, } = bulkSelectAllRowsProps;
+    return (jsx("div", { className: "mb-2 flex items-center justify-center gap-1 rounded-lg bg-primary/10 px-4 py-1.5 text-sm text-primary", children: isBulkAllSelected ? (jsxs(Fragment, { children: [jsx("span", { children: allRowsSelectedMessage ?? selectAllRowMessage }), jsx(Button, { variant: "link", onClick: onClearBulkSelection, children: clearSelectionButtonLabel ?? "Clear selection" })] })) : (jsxs(Fragment, { children: [jsx("span", { children: selectAllRowMessage }), jsx(Button, { variant: "link", onClick: onBulkSelectAll, children: selectAllRowButtonLabel })] })) }));
 };
 
 const DataTablePagination = ({ currentPage, pageCount, onPageChange, }) => {
@@ -3586,7 +3586,7 @@ const HeaderCellMenu = ({ column, enableAddColumn, enableColumnFreeze, isColumnP
                             }) }))] })] }) }));
 };
 
-const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp, onSortingChange: onSortingChangeProp, enableSorting = true, enableURLSort = true, totalCount, pageSize = DEFAULT_PAGE_SIZE, currentPage: currentPageProp, onPageChange: onPageChangeProp, enableURLPagination = true, enableRowSelection: enableRowSelectionProp, selectedRowKeys, onRowSelect, bulkSelectAllRowsProps, enableColumnResize = true, enableColumnFreeze = true, columnPinning: columnPinningProp, onColumnPinningChange: onColumnPinningChangeProp, localStorageKeyPrefix, columnVisibility: columnVisibilityProp, onColumnVisibilityChange: onColumnVisibilityChangeProp, onColumnHide: onColumnHideProp, enableColumnReorder = false, columnOrder: columnOrderProp, onColumnOrderChange: onColumnOrderChangeProp, enableAddColumn = false, onColumnAdd, onColumnDelete, onColumnUpdate, onMoreActionClick, enableHeaderMenu, loading = false, bordered = true, className, emptyMessage, onRowClick, allowRowClick = true, }) => {
+const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp, onSortingChange: onSortingChangeProp, enableSorting = false, enableURLSort = true, totalCount, pageSize = DEFAULT_PAGE_SIZE, currentPage: currentPageProp, onPageChange: onPageChangeProp, enableURLPagination = true, enableRowSelection: enableRowSelectionProp, selectedRowKeys, onRowSelect, bulkSelectAllRowsProps, enableColumnResize = true, enableColumnFreeze = true, columnPinning: columnPinningProp, onColumnPinningChange: onColumnPinningChangeProp, localStorageKeyPrefix, columnVisibility: columnVisibilityProp, onColumnVisibilityChange: onColumnVisibilityChangeProp, onColumnHide: onColumnHideProp, enableColumnReorder = false, columnOrder: columnOrderProp, onColumnOrderChange: onColumnOrderChangeProp, enableAddColumn = false, onColumnAdd, onColumnDelete, onColumnUpdate, onMoreActionClick, enableHeaderMenu, loading = false, bordered = true, className, emptyMessage, onRowClick, allowRowClick = true, }) => {
     const getRowId = useMemo(() => getRowIdProp ??
         ((row) => row.id), [getRowIdProp]);
     const { sorting, onSortingChange } = useTableSort({
@@ -3601,13 +3601,21 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
         onPageChange: onPageChangeProp,
         enableURLPagination,
     });
-    const { rowSelection, onRowSelectionChange, selectionColumn, enableRowSelection, } = useTableSelection({
+    const { rowSelection, onRowSelectionChange: originalOnRowSelectionChange, selectionColumn, enableRowSelection, } = useTableSelection({
         enableRowSelection: enableRowSelectionProp,
         selectedRowKeys,
         onRowSelect,
         data,
         getRowId,
     });
+    // Wrap selection change to detect manual deselection while in bulk mode
+    const onRowSelectionChange = useCallback((updaterOrValue) => {
+        if (bulkSelectedRef.current && !isAutoSelectingRef.current) {
+            setBulkSelectedAllRowsInternal(false);
+            bulkSelectAllRowsProps?.setBulkSelectedAllRows(false);
+        }
+        originalOnRowSelectionChange(updaterOrValue);
+    }, [originalOnRowSelectionChange, bulkSelectAllRowsProps]);
     const { columnPinning, onColumnPinningChange, toggleColumnPin, isColumnPinned, } = useColumnPinning({
         enabled: enableColumnFreeze,
         columnPinning: columnPinningProp,
@@ -3680,7 +3688,37 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
         onColumnVisibilityChange,
         onColumnOrderChange,
     });
-    const isBulkAllSelected = !!bulkSelectAllRowsProps && table.getIsAllPageRowsSelected();
+    const [bulkSelectedAllRows, setBulkSelectedAllRowsInternal] = useState(false);
+    const isAutoSelectingRef = useRef(false);
+    const bulkSelectedRef = useRef(false);
+    bulkSelectedRef.current = bulkSelectedAllRows;
+    // Auto-select all page rows when in bulk mode (handles page navigation)
+    useEffect(() => {
+        if (bulkSelectedAllRows) {
+            isAutoSelectingRef.current = true;
+            table.toggleAllPageRowsSelected(true);
+            // Reset flag after React processes the state update
+            requestAnimationFrame(() => {
+                isAutoSelectingRef.current = false;
+            });
+        }
+    }, [bulkSelectedAllRows, data]);
+    const isAllPageRowsSelected = table.getIsAllPageRowsSelected();
+    const showSelectAllCallout = !!bulkSelectAllRowsProps &&
+        isAllPageRowsSelected &&
+        pageCount > 1 &&
+        !bulkSelectedAllRows;
+    const showAllSelectedCallout = !!bulkSelectAllRowsProps && bulkSelectedAllRows;
+    const handleBulkSelectAll = () => {
+        setBulkSelectedAllRowsInternal(true);
+        bulkSelectAllRowsProps?.setBulkSelectedAllRows(true);
+    };
+    const handleClearBulkSelection = () => {
+        setBulkSelectedAllRowsInternal(false);
+        bulkSelectAllRowsProps?.setBulkSelectedAllRows(false);
+        table.toggleAllPageRowsSelected(false);
+        onRowSelect?.([], []);
+    };
     const handleSort = (columnId, desc) => {
         const isSameSort = sorting.length > 0 &&
             sorting[0].id === columnId &&
@@ -3692,8 +3730,7 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
             onSortingChange([{ id: columnId, desc }]);
         }
     };
-    return (jsxs("div", { className: cn("relative flex min-h-0 w-full flex-col", className), children: [loading && jsx(LoadingOverlay, {}), bulkSelectAllRowsProps &&
-                (data.length !== totalCount || isBulkAllSelected) && (jsx(BulkSelectCallout, { bulkSelectAllRowsProps: bulkSelectAllRowsProps, isAllPageRowsSelected: table.getIsAllPageRowsSelected(), isBulkAllSelected: isBulkAllSelected })), jsx("div", { className: cn("min-h-0 flex-1 overflow-auto", bordered && "rounded-lg border"), children: jsxs(Table, { children: [jsx(TableHeader, { className: "sticky top-0 z-20 bg-muted", children: table.getHeaderGroups().map(headerGroup => {
+    return (jsxs("div", { className: cn("relative flex min-h-0 w-full flex-col", className), children: [loading && jsx(LoadingOverlay, {}), (showSelectAllCallout || showAllSelectedCallout) && (jsx(BulkSelectCallout, { bulkSelectAllRowsProps: bulkSelectAllRowsProps, isAllPageRowsSelected: isAllPageRowsSelected, isBulkAllSelected: bulkSelectedAllRows, onBulkSelectAll: handleBulkSelectAll, onClearBulkSelection: handleClearBulkSelection })), jsx("div", { className: cn("min-h-0 flex-1 overflow-auto", bordered && "rounded-lg border"), children: jsxs(Table, { children: [jsx(TableHeader, { className: "sticky top-0 z-20 bg-muted", children: table.getHeaderGroups().map(headerGroup => {
                                 const dataHeaders = headerGroup.headers.filter(h => h.column.id !== "_selection");
                                 const totalDataSize = dataHeaders.reduce((sum, h) => sum + h.getSize(), 0);
                                 return (jsx(TableRow, { className: "hover:bg-muted", children: headerGroup.headers.map((header, headerIndex) => {
@@ -3732,7 +3769,7 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
                                     const isPinned = cell.column.getIsPinned();
                                     const isSelCell = cell.column.id === "_selection";
                                     return (jsx(TableCell, { className: cn(isPinned &&
-                                            "sticky z-10 bg-background group-data-[state=selected]:bg-muted"), style: {
+                                            "sticky z-10 bg-background group-hover:bg-muted/50 group-data-[state=selected]:bg-muted"), style: {
                                             width: selectionColumn && isSelCell
                                                 ? 0
                                                 : cell.column.getSize(),
@@ -3754,4 +3791,4 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
 };
 
 export { DataTable as D, useColumnPinning as a, useColumnVisibility as b, useTablePagination as c, useTableSelection as d, useTableSort as e, useColumnOrdering as u };
-//# sourceMappingURL=DataTable-Dre7vc3w.js.map
+//# sourceMappingURL=DataTable-DYam_kUE.js.map