@wallarm-org/design-system 0.44.1 → 0.44.2-rc-fix-WDS-125-table-sorting.1

package/dist/components/Table/TableContext/TableProvider.js

@@ -8,7 +8,7 @@ import { useTableState } from "../hooks/index.js";
 import { TABLE_EXPAND_COLUMN_ID, TABLE_MIN_COLUMN_WIDTH, TABLE_SELECT_COLUMN_ID, TABLE_SKELETON_ROWS, TABLE_VIRTUALIZATION_OVERSCAN, createExpandColumn, createSelectionColumn } from "../lib/index.js";
 import { TableContext } from "./TableContext.js";
 const TableProvider = (props)=>{
-    const { data, columns, isLoading = false, skeletonCount = TABLE_SKELETON_ROWS, children, getRowId, sorting: sortingProp, onSortingChange, rowSelection: rowSelectionProp, onRowSelectionChange, columnSizing: columnSizingProp, onColumnSizingChange, columnPinning: columnPinningProp, onColumnPinningChange, columnOrder: columnOrderProp, onColumnOrderChange, grouping: groupingProp, onGroupingChange, expanded: expandedProp, onExpandedChange, renderGroupRow, getSubRows, renderExpandedRow, columnVisibility: columnVisibilityProp, onColumnVisibilityChange, defaultColumnVisibility, defaultColumnOrder, virtualized, estimateRowHeight, overscan = TABLE_VIRTUALIZATION_OVERSCAN, onEndReached, onEndReachedThreshold, onMasterCellClick, activeRowId: activeRowIdProp } = props;
+    const { data, columns, isLoading = false, skeletonCount = TABLE_SKELETON_ROWS, children, getRowId, sorting: sortingProp, onSortingChange, manualSorting = false, rowSelection: rowSelectionProp, onRowSelectionChange, columnSizing: columnSizingProp, onColumnSizingChange, columnPinning: columnPinningProp, onColumnPinningChange, columnOrder: columnOrderProp, onColumnOrderChange, grouping: groupingProp, onGroupingChange, expanded: expandedProp, onExpandedChange, renderGroupRow, getSubRows, renderExpandedRow, columnVisibility: columnVisibilityProp, onColumnVisibilityChange, defaultColumnVisibility, defaultColumnOrder, virtualized, estimateRowHeight, overscan = TABLE_VIRTUALIZATION_OVERSCAN, onEndReached, onEndReachedThreshold, onMasterCellClick, activeRowId: activeRowIdProp } = props;
     const masterCellActiveRowId = activeRowIdProp ?? null;
     const sortingEnabled = !!onSortingChange;
     const selectionEnabled = !!onRowSelectionChange;
@@ -131,9 +131,10 @@ const TableProvider = (props)=>{
         getRowId,
         getSubRows,
         getCoreRowModel: getCoreRowModel(),
-        ...sortingEnabled && {
+        ...sortingEnabled && !manualSorting && {
             getSortedRowModel: getSortedRowModel()
         },
+        manualSorting,
         ...groupingEnabled && {
             getGroupedRowModel: getGroupedRowModel()
         },

package/dist/components/Table/types.d.ts

@@ -155,6 +155,15 @@ export interface TableProps<T> extends TestableProps {
     className?: string;
     sorting?: TableSortingState;
     onSortingChange?: TableOnChangeFn<TableSortingState>;
+    /**
+     * When `true`, disables TanStack's client-side sort. The table renders rows
+     * in the order they appear in `data` and only fires `onSortingChange` on
+     * header clicks. Use this when sorting is performed server-side and the
+     * server returns pre-sorted rows.
+     *
+     * Default: `false` (client-side sort via TanStack's `getSortedRowModel`).
+     */
+    manualSorting?: boolean;
     rowSelection?: TableRowSelectionState;
     onRowSelectionChange?: TableOnChangeFn<TableRowSelectionState>;
     columnSizing?: TableColumnSizingState;

package/dist/metadata/components.json

@@ -1,6 +1,6 @@
 {
-  "version": "0.44.0",
-  "generatedAt": "2026-05-21T14:47:58.859Z",
+  "version": "0.44.1",
+  "generatedAt": "2026-05-25T13:37:58.453Z",
   "components": [
     {
       "name": "Accordion",
@@ -48812,6 +48812,12 @@
           "type": "TableSortingState | undefined",
           "required": false
         },
+        {
+          "name": "manualSorting",
+          "type": "boolean | undefined",
+          "required": false,
+          "description": "When `true`, disables TanStack's client-side sort. The table renders rows\nin the order they appear in `data` and only fires `onSortingChange` on\nheader clicks. Use this when sorting is performed server-side and the\nserver returns pre-sorted rows.\n\nDefault: `false` (client-side sort via TanStack's `getSortedRowModel`)."
+        },
         {
           "name": "rowSelection",
           "type": "TableRowSelectionState | undefined",
@@ -48963,6 +48969,10 @@
           "name": "Sorting",
           "code": "() => {\n  const [sorting, setSorting] = useState<TableSortingState>([]);\n\n  return (\n    <Table\n      data={securityEvents}\n      columns={securityColumns}\n      getRowId={row => row.id}\n      sorting={sorting}\n      onSortingChange={setSorting}\n    />\n  );\n}"
         },
+        {
+          "name": "ManualSorting",
+          "code": "() => {\n  const [sorting, setSorting] = useState<TableSortingState>([]);\n  const data = useMemo(() => sortSecurityEvents(sorting), [sorting]);\n\n  return (\n    <Table\n      data={data}\n      columns={securityColumns}\n      getRowId={row => row.id}\n      sorting={sorting}\n      onSortingChange={setSorting}\n      manualSorting\n      data-testid='manual-sort-table'\n    />\n  );\n}"
+        },
         {
           "name": "LoadingState",
           "code": "() => (\n  <Table data={[]} columns={securityColumns} isLoading />\n)"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wallarm-org/design-system",
-  "version": "0.44.1",
+  "version": "0.44.2-rc-fix-WDS-125-table-sorting.1",
   "description": "Core design system library with React components and Storybook documentation",
   "publishConfig": {
     "access": "public",