@bigbinary/neeto-atoms 1.0.25 → 1.0.26

package/dist/cjs/{DataTable-Cw0ly-hT.js → DataTable-BBxgDBnO.js}

@@ -3555,11 +3555,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 (jsxRuntime.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 ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { children: allRowsSelectedMessage ?? selectAllRowMessage }), clearSelectionButtonLabel && (jsxRuntime.jsx(primitives_Button.Button, { variant: "link", onClick: () => setBulkSelectedAllRows(false), children: clearSelectionButtonLabel }))] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { children: selectAllRowMessage }), jsxRuntime.jsx(primitives_Button.Button, { variant: "link", onClick: () => setBulkSelectedAllRows(true), children: selectAllRowButtonLabel })] })) }));
+    const { selectAllRowMessage, selectAllRowButtonLabel, allRowsSelectedMessage, clearSelectionButtonLabel, } = bulkSelectAllRowsProps;
+    return (jsxRuntime.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 ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { children: allRowsSelectedMessage ?? selectAllRowMessage }), jsxRuntime.jsx(primitives_Button.Button, { variant: "link", onClick: onClearBulkSelection, children: clearSelectionButtonLabel ?? "Clear selection" })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { children: selectAllRowMessage }), jsxRuntime.jsx(primitives_Button.Button, { variant: "link", onClick: onBulkSelectAll, children: selectAllRowButtonLabel })] })) }));
 };
 
 const DataTablePagination = ({ currentPage, pageCount, onPageChange, }) => {
@@ -3607,7 +3607,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 = React.useMemo(() => getRowIdProp ??
         ((row) => row.id), [getRowIdProp]);
     const { sorting, onSortingChange } = useTableSort({
@@ -3622,13 +3622,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 = React.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,
@@ -3701,7 +3709,37 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
         onColumnVisibilityChange,
         onColumnOrderChange,
     });
-    const isBulkAllSelected = !!bulkSelectAllRowsProps && table.getIsAllPageRowsSelected();
+    const [bulkSelectedAllRows, setBulkSelectedAllRowsInternal] = React.useState(false);
+    const isAutoSelectingRef = React.useRef(false);
+    const bulkSelectedRef = React.useRef(false);
+    bulkSelectedRef.current = bulkSelectedAllRows;
+    // Auto-select all page rows when in bulk mode (handles page navigation)
+    React.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 &&
@@ -3713,8 +3751,7 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
             onSortingChange([{ id: columnId, desc }]);
         }
     };
-    return (jsxRuntime.jsxs("div", { className: utils.cn("relative flex min-h-0 w-full flex-col", className), children: [loading && jsxRuntime.jsx(LoadingOverlay, {}), bulkSelectAllRowsProps &&
-                (data.length !== totalCount || isBulkAllSelected) && (jsxRuntime.jsx(BulkSelectCallout, { bulkSelectAllRowsProps: bulkSelectAllRowsProps, isAllPageRowsSelected: table.getIsAllPageRowsSelected(), isBulkAllSelected: isBulkAllSelected })), jsxRuntime.jsx("div", { className: utils.cn("min-h-0 flex-1 overflow-auto", bordered && "rounded-lg border"), children: jsxRuntime.jsxs(primitives_Table.Table, { children: [jsxRuntime.jsx(primitives_Table.TableHeader, { className: "sticky top-0 z-20 bg-muted", children: table.getHeaderGroups().map(headerGroup => {
+    return (jsxRuntime.jsxs("div", { className: utils.cn("relative flex min-h-0 w-full flex-col", className), children: [loading && jsxRuntime.jsx(LoadingOverlay, {}), (showSelectAllCallout || showAllSelectedCallout) && (jsxRuntime.jsx(BulkSelectCallout, { bulkSelectAllRowsProps: bulkSelectAllRowsProps, isAllPageRowsSelected: isAllPageRowsSelected, isBulkAllSelected: bulkSelectedAllRows, onBulkSelectAll: handleBulkSelectAll, onClearBulkSelection: handleClearBulkSelection })), jsxRuntime.jsx("div", { className: utils.cn("min-h-0 flex-1 overflow-auto", bordered && "rounded-lg border"), children: jsxRuntime.jsxs(primitives_Table.Table, { children: [jsxRuntime.jsx(primitives_Table.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 (jsxRuntime.jsx(primitives_Table.TableRow, { className: "hover:bg-muted", children: headerGroup.headers.map((header, headerIndex) => {
@@ -3753,7 +3790,7 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
                                     const isPinned = cell.column.getIsPinned();
                                     const isSelCell = cell.column.id === "_selection";
                                     return (jsxRuntime.jsx(primitives_Table.TableCell, { className: utils.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(),
@@ -3781,4 +3818,4 @@ exports.useColumnVisibility = useColumnVisibility;
 exports.useTablePagination = useTablePagination;
 exports.useTableSelection = useTableSelection;
 exports.useTableSort = useTableSort;
-//# sourceMappingURL=DataTable-Cw0ly-hT.js.map
+//# sourceMappingURL=DataTable-BBxgDBnO.js.map