@synerise/ds-table-new 1.0.2 → 1.0.4

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.0.4](https://github.com/Synerise/synerise-design/compare/@synerise/ds-table-new@1.0.3...@synerise/ds-table-new@1.0.4) (2026-04-22)
+
+### Bug Fixes
+
+- **table-new:** row selection status & row props/styles ([d730118](https://github.com/Synerise/synerise-design/commit/d730118303bfe0679ae08a249d5984735e2f55c9))
+
+## [1.0.3](https://github.com/Synerise/synerise-design/compare/@synerise/ds-table-new@1.0.2...@synerise/ds-table-new@1.0.3) (2026-04-21)
+
+**Note:** Version bump only for package @synerise/ds-table-new
+
 ## [1.0.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-table-new@1.0.1...@synerise/ds-table-new@1.0.2) (2026-04-20)
 
 **Note:** Version bump only for package @synerise/ds-table-new

package/dist/Table.types.d.ts

@@ -1,5 +1,5 @@
 import { PaginationProps } from 'antd/lib/pagination';
-import { MouseEvent, MutableRefObject, ReactElement, ReactNode, RefObject } from 'react';
+import { HTMLAttributes, MouseEvent, MutableRefObject, ReactElement, ReactNode, RefObject } from 'react';
 import { SearchInputProps } from '@synerise/ds-search';
 import { TooltipProps } from '@synerise/ds-tooltip';
 import { Column, ColumnDef, ColumnMeta, Row, RowData } from '@tanstack/react-table';
@@ -75,6 +75,15 @@ export type SharedTableProps<TData, TValue> = {
     dataSourceTotalCount?: number;
     expandable?: Expandable<TData>;
     onRowClick?: (row: TData, event: MouseEvent<HTMLTableRowElement>) => void;
+    /**
+     * Returns arbitrary HTML attributes (style, className, data-*, event handlers, etc.)
+     * to apply to a row's <tr> element. Use this for per-row styling or custom events
+     * beyond simple click handling.
+     *
+     * If the returned attributes include `onClick`, it fires BEFORE `onRowClick`. Call
+     * `event.preventDefault()` inside `getRowProps`'s onClick to suppress `onRowClick`.
+     */
+    getRowProps?: (row: TData) => HTMLAttributes<HTMLTableRowElement>;
     /**
      * Returns tooltip props for a given row, or false to disable tooltip.
      * When provided, the entire row is wrapped in a Tooltip component.
@@ -433,13 +442,13 @@ export type CustomCounterArgs = {
     content: ReactNode;
 };
 export type CustomCounterFn = (props: CustomCounterArgs) => ReactNode;
-export type TableBodyProps<TData, TValue> = Pick<BaseTableProps<TData, TValue>, 'infiniteScroll' | 'cellHeight' | 'emptyDataComponent' | 'onRowClick' | 'getRowTooltipProps'> & {
+export type TableBodyProps<TData, TValue> = Pick<BaseTableProps<TData, TValue>, 'infiniteScroll' | 'cellHeight' | 'emptyDataComponent' | 'onRowClick' | 'getRowProps' | 'getRowTooltipProps'> & {
     texts: TableBodyTexts;
     withBodyScroll?: boolean;
     tableBodyScrollRef?: React.MutableRefObject<HTMLElement | null>;
     maxHeight?: number;
 };
-export type TableEmptyBodyProps<TData, TValue> = Pick<TableBodyProps<TData, TValue>, 'emptyDataComponent'> & {
+export type TableEmptyBodyProps<TData, TValue> = Pick<TableBodyProps<TData, TValue>, 'emptyDataComponent' | 'tableBodyScrollRef'> & {
     texts: TableEmptyBodyTexts;
 };
 export type TableCounterProps<TData, TValue> = Pick<BaseTableProps<TData, TValue>, 'renderCustomCounter' | 'isCounterLoading'> & {
@@ -501,7 +510,7 @@ export type TableRowProps<TData> = {
     isSelected?: boolean;
     isExpanded?: boolean;
     isParentExpanded?: boolean;
-} & Pick<SharedTableProps<TData, unknown>, 'onRowClick' | 'getRowTooltipProps'>;
+} & Pick<SharedTableProps<TData, unknown>, 'onRowClick' | 'getRowProps' | 'getRowTooltipProps'>;
 export type TableRowVirtualProps<TData> = TableRowProps<TData> & {
     cellHeight: number;
     virtual: VirtualItem;

package/dist/VirtualTable.js

@@ -243,7 +243,7 @@ const VirtualTable = ({
     rowVirtualizer.scrollToOffset(0);
   }, [onBackToTop, rowVirtualizer]);
   return /* @__PURE__ */ jsx(TableContext.Provider, { value: tableContextValue, children: /* @__PURE__ */ jsx(StickyContext.Provider, { value: stickyValue, children: /* @__PURE__ */ jsxs(SelectionContext.Provider, { value: selectionConfig, children: [
-    /* @__PURE__ */ jsx(BaseTable, { columnSizing, isColumnSizingReady, texts, tableOuterRef, tableBodyScrollRef, withScroll: withContainerScroll, withBodyScroll, maxHeight, hasPagination: false, infiniteScroll, isLoading, searchQuery, setSearchQuery, handleSearchClear, hasBuiltInSearch, searchProps, dataSourceTotalCount: totalDataCount, ...props }),
+    /* @__PURE__ */ jsx(BaseTable, { columnSizing, isColumnSizingReady, texts, tableOuterRef, tableBodyScrollRef, withScroll: withContainerScroll, withBodyScroll, maxHeight, hasPagination: false, infiniteScroll, isLoading, searchQuery, setSearchQuery, handleSearchClear, hasBuiltInSearch, searchProps, dataSourceTotalCount: totalDataCount, cellHeight, ...props }),
     showBackToTopButton && /* @__PURE__ */ jsx(BackToTopButton, { label: texts.infiniteScrollBackToTop, onClick: handleBackToTop, scrollContainerRef: scrollableContainerRef, hasData: !tableIsEmpty && columns.length > 0, threshold: (stickyData.titleBarHeight || 0) + (Number.isFinite(stickyData.containerPaddingTop) ? stickyData.containerPaddingTop : 0) })
   ] }) }) });
 };

package/dist/components/BaseTable/BaseTable.d.ts

@@ -1,3 +1,3 @@
 import { default as React } from 'react';
 import { BaseTableProps, TableInternalProps } from '../../Table.types';
-export declare const BaseTable: <TData extends object, TValue>({ infiniteScroll, cellHeight, className, itemsMenu, texts, isCounterLoading, isLoading, rowKey, title, hideTitleBar, hideTitlePart, renderCustomCounter, renderSelectionTitle, searchComponent, filterComponent, headerWithBorderTop, emptyDataComponent, headerButton, hideColumnNames, expandable, columnSizing, isColumnSizingReady, paginationProps, hasPagination, disableColumnNamesLineBreak, dataSourceTotalCount, cardStyles, tableOuterRef, withScroll, withBodyScroll, maxHeight, tableBodyScrollRef, onRowClick, getRowTooltipProps, searchQuery, setSearchQuery, handleSearchClear, hasBuiltInSearch, searchProps, }: BaseTableProps<TData, TValue> & TableInternalProps) => React.JSX.Element;
+export declare const BaseTable: <TData extends object, TValue>({ infiniteScroll, cellHeight, className, itemsMenu, texts, isCounterLoading, isLoading, rowKey, title, hideTitleBar, hideTitlePart, renderCustomCounter, renderSelectionTitle, searchComponent, filterComponent, headerWithBorderTop, emptyDataComponent, headerButton, hideColumnNames, expandable, columnSizing, isColumnSizingReady, paginationProps, hasPagination, disableColumnNamesLineBreak, dataSourceTotalCount, cardStyles, tableOuterRef, withScroll, withBodyScroll, maxHeight, tableBodyScrollRef, onRowClick, getRowProps, getRowTooltipProps, searchQuery, setSearchQuery, handleSearchClear, hasBuiltInSearch, searchProps, }: BaseTableProps<TData, TValue> & TableInternalProps) => React.JSX.Element;

package/dist/components/BaseTable/BaseTable.js

@@ -46,6 +46,7 @@ const BaseTable = ({
   maxHeight,
   tableBodyScrollRef,
   onRowClick,
+  getRowProps,
   getRowTooltipProps,
   searchQuery,
   setSearchQuery,
@@ -94,13 +95,13 @@ const BaseTable = ({
   const tableBodyContent = /* @__PURE__ */ jsx(TableHorizontalScroll, { stickyRight: table.getRightTotalSize(), stickyLeft: table.getLeftTotalSize(), ref: (element) => {
     tableBodyWrapperRef.current = element;
     addNode(element);
-  }, children: /* @__PURE__ */ jsx(StyledTable, { role: "table", children: isLoading ? /* @__PURE__ */ jsx(TableBodySkeleton, { wrapperRef: tableBodyWrapperRef, cellHeight }, "table-body-skeleton") : /* @__PURE__ */ jsx(TableBody, { cellHeight, infiniteScroll, emptyDataComponent, texts, onRowClick, getRowTooltipProps }, "table-body") }) });
+  }, children: /* @__PURE__ */ jsx(StyledTable, { role: "table", children: isLoading ? /* @__PURE__ */ jsx(TableBodySkeleton, { wrapperRef: tableBodyWrapperRef, cellHeight }, "table-body-skeleton") : /* @__PURE__ */ jsx(TableBody, { cellHeight, infiniteScroll, emptyDataComponent, texts, onRowClick, getRowProps, getRowTooltipProps }, "table-body") }) });
   const unifiedTableContent = /* @__PURE__ */ jsx(TableHorizontalScroll, { stickyRight: table.getRightTotalSize(), stickyLeft: table.getLeftTotalSize(), ref: (element) => {
     tableBodyWrapperRef.current = element;
     addNode(element);
   }, children: /* @__PURE__ */ jsxs(StyledTable, { role: "table", children: [
     !hideColumnNames && (!isEmpty || isLoading) && /* @__PURE__ */ jsx(TableColumns, { texts, disableColumnNamesLineBreak }),
-    isLoading ? /* @__PURE__ */ jsx(TableBodySkeleton, { wrapperRef: tableBodyWrapperRef, cellHeight }, "table-body-skeleton") : /* @__PURE__ */ jsx(TableBody, { withBodyScroll, tableBodyScrollRef, maxHeight, cellHeight, infiniteScroll, emptyDataComponent, texts, onRowClick, getRowTooltipProps }, "table-body")
+    isLoading ? /* @__PURE__ */ jsx(TableBodySkeleton, { wrapperRef: tableBodyWrapperRef, cellHeight }, "table-body-skeleton") : /* @__PURE__ */ jsx(TableBody, { withBodyScroll, tableBodyScrollRef, maxHeight, cellHeight, infiniteScroll, emptyDataComponent, texts, onRowClick, getRowProps, getRowTooltipProps }, "table-body")
   ] }) });
   return /* @__PURE__ */ jsxs(BaseTableWrapper, { isEmpty, columnSizing, $isColumnSizingReady: isColumnSizingReady, $size: size, children: [
     /* @__PURE__ */ jsxs(TableContainer, { ref: tableOuterRef, className, withBorderTop: headerWithBorderTop, cardStyles, withScroll, $maxHeight: maxHeight, "data-testid": "ds-table-container", children: [

package/dist/components/BaseTable/BaseTable.styles.js

@@ -20,7 +20,7 @@ const TableSkeleton = /* @__PURE__ */ styled(DSSkeleton).withConfig({
 const StyledTable = /* @__PURE__ */ styled.table.withConfig({
   displayName: "BaseTablestyles__StyledTable",
   componentId: "sc-1oa5lc2-4"
-})(["width:var(--table-size);border-spacing:0;border-collapse:separate;@keyframes ds-table-row-highlight{0%{background-color:transparent;}5%{background-color:var( --ds-highlight-color,", " );}30%{background-color:var( --ds-highlight-color,", " );}100%{background-color:transparent;}}tr.ds-table-row-highlight td{transition:background 0.3s ease-in-out;animation:ds-table-row-highlight var(--ds-highlight-duration,600ms) ease-in-out forwards;}"], (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-050"]);
+})(["width:var(--table-size);min-width:100%;border-spacing:0;border-collapse:separate;@keyframes ds-table-row-highlight{0%{background-color:transparent;}5%{background-color:var( --ds-highlight-color,", " );}30%{background-color:var( --ds-highlight-color,", " );}100%{background-color:transparent;}}tr.ds-table-row-highlight td{transition:background 0.3s ease-in-out;animation:ds-table-row-highlight var(--ds-highlight-duration,600ms) ease-in-out forwards;}"], (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-050"]);
 const TableColumnsHorizontalScroll = /* @__PURE__ */ styled(TableHorizontalScroll).withConfig({
   displayName: "BaseTablestyles__TableColumnsHorizontalScroll",
   componentId: "sc-1oa5lc2-5"

package/dist/components/TableBody/TableBody.d.ts

@@ -1,3 +1,3 @@
 import { default as React } from 'react';
 import { TableBodyProps } from '../../Table.types';
-export declare const TableBody: <TData extends object, TValue>({ cellHeight, infiniteScroll, onRowClick, getRowTooltipProps, withBodyScroll, tableBodyScrollRef, maxHeight, emptyDataComponent, texts, }: TableBodyProps<TData, TValue>) => React.JSX.Element;
+export declare const TableBody: <TData extends object, TValue>({ cellHeight, infiniteScroll, onRowClick, getRowProps, getRowTooltipProps, withBodyScroll, tableBodyScrollRef, maxHeight, emptyDataComponent, texts, }: TableBodyProps<TData, TValue>) => React.JSX.Element;

package/dist/components/TableBody/TableBody.js

@@ -9,6 +9,7 @@ const TableBody = ({
   cellHeight = DEFAULT_CELL_HEIGHT,
   infiniteScroll,
   onRowClick,
+  getRowProps,
   getRowTooltipProps,
   withBodyScroll,
   tableBodyScrollRef,
@@ -49,12 +50,12 @@ const TableBody = ({
     // Virtualized: place spacer and absolutely-positioned rows
     virtualItems.map((virtual) => {
       const row = allRows[virtual.index];
-      return /* @__PURE__ */ jsx(TableRowVirtual, { virtual, cellHeight, row, texts, onRowClick, getRowTooltipProps, rowIndex: virtual.index, infiniteScroll, isLast: virtual.index === allRows.length - 1, isSelected: row.getIsSelected(), isExpanded: row.getIsExpanded(), isParentExpanded: row.getIsAllParentsExpanded() }, row.id);
+      return /* @__PURE__ */ jsx(TableRowVirtual, { virtual, cellHeight, row, texts, onRowClick, getRowProps, getRowTooltipProps, rowIndex: virtual.index, infiniteScroll, isLast: virtual.index === allRows.length - 1, isSelected: row.getIsSelected(), isExpanded: row.getIsExpanded(), isParentExpanded: row.getIsAllParentsExpanded() }, row.id);
     })
   ) : (
     // Non-virtualized: render all rows in the normal flow
-    allRows.map((row) => /* @__PURE__ */ jsx(TableRow, { onRowClick, getRowTooltipProps, row, isSelected: row.getIsSelected(), isExpanded: row.getIsExpanded(), isParentExpanded: row.getIsAllParentsExpanded() }, row.id))
-  ) }, "virtual-table-body") : /* @__PURE__ */ jsx(TableEmptyBody, { emptyDataComponent, texts });
+    allRows.map((row) => /* @__PURE__ */ jsx(TableRow, { onRowClick, getRowProps, getRowTooltipProps, row, isSelected: row.getIsSelected(), isExpanded: row.getIsExpanded(), isParentExpanded: row.getIsAllParentsExpanded() }, row.id))
+  ) }, "virtual-table-body") : /* @__PURE__ */ jsx(TableEmptyBody, { emptyDataComponent, texts, tableBodyScrollRef });
 };
 export {
   TableBody

package/dist/components/TableBody/TableEmptyBody/TableEmptyBody.d.ts

@@ -1,3 +1,3 @@
 import { default as React } from 'react';
 import { TableEmptyBodyProps } from '../../../Table.types';
-export declare const TableEmptyBody: <TData, TValue>({ emptyDataComponent, texts, }: TableEmptyBodyProps<TData, TValue>) => React.JSX.Element;
+export declare const TableEmptyBody: <TData, TValue>({ emptyDataComponent, texts, tableBodyScrollRef, }: TableEmptyBodyProps<TData, TValue>) => React.JSX.Element;

package/dist/components/TableBody/TableEmptyBody/TableEmptyBody.js

@@ -5,13 +5,18 @@ import { useTableContext } from "../../../contexts/TableContext.js";
 import { TBody, Tr, Td, TableEmptyBodyWrapper } from "./TableEmptyBody.styles.js";
 const TableEmptyBody = ({
   emptyDataComponent,
-  texts
+  texts,
+  tableBodyScrollRef
 }) => {
   const {
     table
   } = useTableContext();
   const colSpan = table.getAllLeafColumns().length;
-  return /* @__PURE__ */ jsx(TBody, { children: /* @__PURE__ */ jsx(Tr, { children: /* @__PURE__ */ jsx(Td, { colSpan, children: /* @__PURE__ */ jsx(TableEmptyBodyWrapper, { children: emptyDataComponent !== void 0 ? emptyDataComponent : /* @__PURE__ */ jsx(Result, { description: texts.emptyText || /* @__PURE__ */ jsx(FormattedMessage, { id: "DS.TABLE.EMPTY_TEXT" }), type: "no-results", noSearchResults: true }) }) }) }) });
+  return /* @__PURE__ */ jsx(TBody, { ref: (node) => {
+    if (tableBodyScrollRef) {
+      tableBodyScrollRef.current = node;
+    }
+  }, children: /* @__PURE__ */ jsx(Tr, { children: /* @__PURE__ */ jsx(Td, { colSpan, children: /* @__PURE__ */ jsx(TableEmptyBodyWrapper, { children: emptyDataComponent !== void 0 ? emptyDataComponent : /* @__PURE__ */ jsx(Result, { description: texts.emptyText || /* @__PURE__ */ jsx(FormattedMessage, { id: "DS.TABLE.EMPTY_TEXT" }), type: "no-results", noSearchResults: true }) }) }) }) });
 };
 export {
   TableEmptyBody

package/dist/components/TableBody/TableRow/TableRow.d.ts

@@ -1,3 +1,3 @@
 import { default as React } from 'react';
 import { TableRowProps } from '../../../Table.types';
-export declare const TableRow: <TData extends object>({ row, onRowClick, getRowTooltipProps, }: TableRowProps<TData>) => React.JSX.Element;
+export declare const TableRow: <TData extends object>({ row, onRowClick, getRowProps, getRowTooltipProps, }: TableRowProps<TData>) => React.JSX.Element;

package/dist/components/TableBody/TableRow/TableRow.js

@@ -7,12 +7,22 @@ import { Tr } from "./TableRow.styles.js";
 const TableRow = ({
   row,
   onRowClick,
+  getRowProps,
   getRowTooltipProps
 }) => {
-  const rowContent = /* @__PURE__ */ jsx(Tr, { "data-key": row.id, "data-row-depth": row.depth, "data-row-index": row.index, "data-index": row.index, role: "row", onClick: onRowClick ? (event) => {
-    event.stopPropagation();
-    onRowClick && onRowClick(row.original, event);
-  } : void 0, children: row.getVisibleCells().map((cell, columnIndex) => {
+  const customRowProps = getRowProps?.(row.original) ?? {};
+  const {
+    onClick: customOnClick,
+    ...restCustomRowProps
+  } = customRowProps;
+  const mergedOnClick = onRowClick || customOnClick ? (event) => {
+    customOnClick?.(event);
+    if (onRowClick && !event.isDefaultPrevented()) {
+      event.stopPropagation();
+      onRowClick(row.original, event);
+    }
+  } : void 0;
+  const rowContent = /* @__PURE__ */ jsx(Tr, { "data-key": row.id, "data-row-depth": row.depth, "data-row-index": row.index, "data-index": row.index, role: "row", ...restCustomRowProps, onClick: mergedOnClick, children: row.getVisibleCells().map((cell, columnIndex) => {
     const cellId = `cell-${cell.column.id}-${cell.row.id}`;
     const isColumnSorted = isSorted(cell.column);
     const cellContent = flexRender(cell.column.columnDef.cell, cell.getContext());

package/dist/components/TableBody/TableRow/TableRowVirtual.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
 import { TableRowVirtualProps } from '../../../Table.types';
-declare const TableRowVirtualInner: <TData extends object>({ cellHeight, rowIndex, virtual, infiniteScroll, texts, row, isLast, onRowClick, getRowTooltipProps, isExpanded: _isExpanded, isParentExpanded, }: TableRowVirtualProps<TData>) => React.JSX.Element;
+declare const TableRowVirtualInner: <TData extends object>({ cellHeight, rowIndex, virtual, infiniteScroll, texts, row, isLast, onRowClick, getRowProps, getRowTooltipProps, isExpanded: _isExpanded, isParentExpanded, }: TableRowVirtualProps<TData>) => React.JSX.Element;
 export declare const TableRowVirtual: typeof TableRowVirtualInner;
 export {};

package/dist/components/TableBody/TableRow/TableRowVirtual.js

@@ -17,6 +17,7 @@ const TableRowVirtualInner = ({
   row,
   isLast,
   onRowClick,
+  getRowProps,
   getRowTooltipProps,
   isExpanded: _isExpanded,
   isParentExpanded
@@ -65,18 +66,29 @@ const TableRowVirtualInner = ({
     });
   }, [cellHeight, isChild]);
   const rowTooltipProps = getRowTooltipProps?.(row.original);
+  const customRowProps = getRowProps?.(row.original) ?? {};
+  const {
+    onClick: customOnClick,
+    style: customStyle,
+    ...restCustomRowProps
+  } = customRowProps;
+  const mergedOnClick = onRowClick || customOnClick ? (event) => {
+    customOnClick?.(event);
+    if (onRowClick && !event.isDefaultPrevented()) {
+      event.stopPropagation();
+      onRowClick(row.original, event);
+    }
+  } : void 0;
   const virtualRowContent = /* @__PURE__ */ jsx(VirtualRow, { "data-key": row.id, "data-row-depth": row.depth, "data-row-ischild": isChild, "data-row-index": virtual.index, "data-index": virtual.index, ...isChild ? {
     "data-row-expanded": isChildExpanded
-  } : {}, ref: rowVirtualizer?.measureElement, style: {
+  } : {}, ...restCustomRowProps, ref: rowVirtualizer?.measureElement, style: {
+    ...customStyle,
     position: "absolute",
     top: `${top}px`,
     height: `${isVisible ? virtual.size : 0}px`,
     left: 0,
     right: 0
-  }, isVisible, isChild, onClick: onRowClick ? (event) => {
-    event.stopPropagation();
-    onRowClick && onRowClick(row.original, event);
-  } : void 0, children: renderRow(row) }, row.id);
+  }, isVisible, isChild, onClick: mergedOnClick, children: renderRow(row) }, row.id);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     isFirst && renderLoaderRow("TOP"),
     rowTooltipProps ? /* @__PURE__ */ jsx(Tooltip, { ...rowTooltipProps, children: virtualRowContent }) : virtualRowContent,

package/dist/components/TableBody/TableRowSelection/TableRowSelection.d.ts

@@ -1,3 +1,3 @@
 import { default as React } from 'react';
 import { TableRowSelectionProps } from '../../../Table.types';
-export declare const TableRowSelection: <TData extends object>({ texts, row, }: TableRowSelectionProps<TData>) => React.JSX.Element;
+export declare const TableRowSelection: <TData extends object>({ texts, row, }: TableRowSelectionProps<TData>) => React.JSX.Element | null;

package/dist/components/TableBody/TableRowSelection/TableRowSelection.js

@@ -18,6 +18,12 @@ const TableRowSelection = ({
     globalSelected,
     limit
   } = selection || {};
+  const {
+    unavailable
+  } = selection?.checkRowSelectionStatus?.(row.original) ?? {};
+  if (unavailable) {
+    return null;
+  }
   const isGlobalAllSelected = globalSelectionOnChange !== void 0 && globalSelected;
   const isSelected = row.getIsSelected();
   const totalSelectedCount = Object.keys(table.getState().rowSelection).length;

package/dist/components/TableHeader/TableHeaderSelection/TableHeaderSelection.js

@@ -23,11 +23,11 @@ const TableHeaderSelection = ({
   const totalSelectedCount = Object.keys(table.getState().rowSelection).length;
   const visibleRowCount = table.getRowModel().rows.length;
   const visibleSelectedCount = table.getFilteredSelectedRowModel().rows.length;
-  const isAllVisibleSelected = visibleRowCount > 0 && visibleSelectedCount === visibleRowCount;
-  const isAnySelected = visibleSelectedCount > 0 && !isAllVisibleSelected;
   const allRecordsCount = visibleRowCount;
   const selectedRecordsCount = totalSelectedCount;
   const selectableRecordsCount = table.getRowModel().rows.filter((row) => row.getCanSelect()).length;
+  const isAllVisibleSelected = selectableRecordsCount > 0 && visibleSelectedCount === selectableRecordsCount;
+  const isAnySelected = visibleSelectedCount > 0 && !isAllVisibleSelected;
   const disabledBulkSelection = Boolean(allRecordsCount === 0 || selectableRecordsCount === 0 || hasSelectionLimit && selectedRecordsCount === 0);
   const selectionTooltipTitle = useMemo(() => {
     if (hasGlobalSelection) {

package/dist/hooks/useTable.js

@@ -101,7 +101,7 @@ const useTable = ({
   } = useColumnSizing({
     columnWidths,
     wrapperRef,
-    enabled: requireColumnSizing || hasAnyColumnWidth
+    enabled: columnWidths.length > 0 && (requireColumnSizing || hasAnyColumnWidth)
   });
   const {
     rightPinnedColumns,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-table-new",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "TableNew UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -34,27 +34,27 @@
   "types": "dist/index.d.ts",
   "dependencies": {
     "@floating-ui/react": "^0.27.16",
-    "@synerise/ds-badge": "^1.0.46",
-    "@synerise/ds-button": "^1.5.20",
-    "@synerise/ds-checkbox": "^1.2.23",
-    "@synerise/ds-copy-icon": "^1.2.4",
-    "@synerise/ds-dropdown": "^1.3.5",
+    "@synerise/ds-badge": "^1.0.47",
+    "@synerise/ds-button": "^1.5.21",
+    "@synerise/ds-checkbox": "^1.2.24",
+    "@synerise/ds-copy-icon": "^1.2.5",
+    "@synerise/ds-dropdown": "^1.3.6",
     "@synerise/ds-flag": "^1.0.10",
-    "@synerise/ds-icon": "^1.15.3",
-    "@synerise/ds-inline-alert": "^1.1.17",
-    "@synerise/ds-input": "^1.7.0",
-    "@synerise/ds-input-number": "^1.2.37",
+    "@synerise/ds-icon": "^1.16.0",
+    "@synerise/ds-inline-alert": "^1.1.18",
+    "@synerise/ds-input": "^1.7.1",
+    "@synerise/ds-input-number": "^1.2.38",
     "@synerise/ds-loader": "^1.0.15",
-    "@synerise/ds-modal": "^1.4.4",
-    "@synerise/ds-pagination": "^1.0.55",
-    "@synerise/ds-result": "^1.0.51",
-    "@synerise/ds-scrollbar": "^1.2.19",
-    "@synerise/ds-search": "^1.5.13",
-    "@synerise/ds-skeleton": "^1.0.47",
-    "@synerise/ds-tag": "^1.4.20",
-    "@synerise/ds-tags": "^1.5.31",
-    "@synerise/ds-tooltip": "^1.4.12",
-    "@synerise/ds-typography": "^1.1.15",
+    "@synerise/ds-modal": "^1.4.5",
+    "@synerise/ds-pagination": "^1.0.56",
+    "@synerise/ds-result": "^1.0.52",
+    "@synerise/ds-scrollbar": "^1.2.20",
+    "@synerise/ds-search": "^1.5.15",
+    "@synerise/ds-skeleton": "^1.0.48",
+    "@synerise/ds-tag": "^1.4.21",
+    "@synerise/ds-tags": "^1.5.32",
+    "@synerise/ds-tooltip": "^1.4.13",
+    "@synerise/ds-typography": "^1.1.16",
     "@synerise/ds-utils": "^1.8.0",
     "@tanstack/react-table": "^8.21.3",
     "@tanstack/react-virtual": "^3.13.12",
@@ -71,5 +71,5 @@
     "react-intl": ">= 3.12.0 <= 6.8",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "4766ad0a45eea48ac75745bc9e7525f5dccc71e0"
+  "gitHead": "519e7db3c177aabeec594d84658c0357f532bf0a"
 }