diff --git a/projects/addon-table/components/table/table.options.ts b/projects/addon-table/components/table/table.options.ts index 63355bb3c41f..293de4867962 100644 --- a/projects/addon-table/components/table/table.options.ts +++ b/projects/addon-table/components/table/table.options.ts @@ -4,6 +4,7 @@ import type {TuiSizeL, TuiSizeS} from '@taiga-ui/core/types'; export interface TuiTableOptions { readonly direction: -1 | 1; + readonly requiredSort: boolean; readonly open: boolean; readonly resizable: boolean; readonly size: TuiSizeL | TuiSizeS; @@ -21,6 +22,7 @@ export const TUI_TABLE_DEFAULT_OPTIONS: TuiTableOptions = { open: true, size: 'm', direction: 1, + requiredSort: false, sortIcons: { asc: '@tui.chevron-up', desc: '@tui.chevron-down', diff --git a/projects/addon-table/components/table/th/th.component.ts b/projects/addon-table/components/table/th/th.component.ts index aae561ad7bc5..9bc1533fa48b 100644 --- a/projects/addon-table/components/table/th/th.component.ts +++ b/projects/addon-table/components/table/th/th.component.ts @@ -26,6 +26,7 @@ import {TUI_TABLE_OPTIONS} from '../table.options'; host: { '[style.width.px]': 'width', '[class._sticky]': 'sticky', + '[attr.requiredSort]': 'requiredSort', }, }) export class TuiTableTh>> { @@ -53,6 +54,9 @@ export class TuiTableTh>> { @Input() public sticky = this.options.sticky; + @Input() + public requiredSort = this.options.requiredSort; + public get key(): keyof T { if (!this.head) { throw new TuiTableSortKeyException(); @@ -76,8 +80,10 @@ export class TuiTableTh>> { } protected updateSorterAndDirection(): void { + const sorter = this.requiredSort ? this.sorter : null; + this.table?.updateSorterAndDirection( - this.isCurrentAndAscDirection ? null : this.sorter, + this.isCurrentAndAscDirection ? sorter : this.sorter, ); } diff --git a/projects/demo/src/modules/components/table/examples/4/index.html b/projects/demo/src/modules/components/table/examples/4/index.html index fac29ddf7879..c6254112a990 100644 --- a/projects/demo/src/modules/components/table/examples/4/index.html +++ b/projects/demo/src/modules/components/table/examples/4/index.html @@ -69,6 +69,7 @@ *tuiHead="'age'" tuiSortable tuiTh + [requiredSort]="true" > Age