feat(Table): aria-sort support added (#26)

src/components/HeaderCell/HeaderCell.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import type {Header} from '@tanstack/react-table';
 import {flexRender} from '@tanstack/react-table';
 
-import {getCellStyles, getHeaderCellClassModes} from '../../utils';
+import {getAriaSort, getCellStyles, getHeaderCellClassModes} from '../../utils';
 import type {ResizeHandleProps} from '../ResizeHandle';
 import {ResizeHandle} from '../ResizeHandle';
 import type {SortIndicatorProps} from '../SortIndicator';
@@ -72,6 +72,7 @@ export const HeaderCell = <TData, TValue>({
             rowSpan={rowSpan > 1 ? rowSpan : undefined}
             onClick={header.column.getToggleSortingHandler()}
             style={getCellStyles(header)}
+            aria-sort={getAriaSort(header.column.getIsSorted())}
             {...attributes}
         >
             {flexRender(header.column.columnDef.header, header.getContext())}{' '}

src/utils/getAriaSort.ts

@@ -0,0 +1,9 @@
+import type {SortDirection} from '@tanstack/react-table';
+
+export const getAriaSort = (sortDirection: SortDirection | false) => {
+    if (!sortDirection) {
+        return undefined;
+    }
+
+    return sortDirection === 'asc' ? 'ascending' : 'descending';
+};

src/utils/index.ts

@@ -1,4 +1,5 @@
 export * from './cn';
+export * from './getAriaSort';
 export * from './getCellClassModes';
 export * from './getCellStyles';
 export * from './getColumnPinningClassModes';