diff --git a/docs/core/components/data-column.component.md b/docs/core/components/data-column.component.md index 1e9e3d36c5..8ae1adb127 100644 --- a/docs/core/components/data-column.component.md +++ b/docs/core/components/data-column.component.md @@ -48,6 +48,7 @@ Defines column properties for DataTable, Tasklist, Document List and other compo | cssClass | `string` | | Additional CSS class to be applied to column (header and cells). | | customData | `any` | | You can specify any custom data which can be used by any specific feature | | draggable | `boolean` | false | Enable drag and drop for header column | +| resizable | `boolean` | true | Enable column resizing | | editable | `boolean` | false | Toggles the editing support of the column data. | | focus | `boolean` | true | Enable or disable cell focus | | format | `string` | | Value format (if supported by the parent component), for example format of the date. | diff --git a/lib/core/src/lib/datatable/components/datatable/datatable.component.html b/lib/core/src/lib/datatable/components/datatable/datatable.component.html index 2ff665667e..0c93039d72 100644 --- a/lib/core/src/lib/datatable/components/datatable/datatable.component.html +++ b/lib/core/src/lib/datatable/components/datatable/datatable.component.html @@ -96,7 +96,7 @@
diff --git a/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts b/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts index baa2c4a103..685650f9db 100644 --- a/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts +++ b/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts @@ -1694,6 +1694,10 @@ describe('Column Resizing', () => { const getResizeHandler = (): HTMLDivElement => fixture.debugElement.nativeElement.querySelector('.adf-datatable__resize-handle'); + const getResizeHandlersCount = (): number => { + const resizeHandlers = fixture.debugElement.nativeElement.querySelectorAll('.adf-datatable__resize-handle'); + return resizeHandlers.length; + }; const testClassesAfterResizing = (headerColumnsSelector = '.adf-datatable-cell-header', excludedClass = 'adf-datatable__cursor--pointer') => { dataTable.isResizingEnabled = true; @@ -1744,6 +1748,22 @@ describe('Column Resizing', () => { }); }); + it('should display resize handle for each column by default', () => { + dataTable.isResizingEnabled = true; + fixture.detectChanges(); + + expect(getResizeHandlersCount()).toBe(2); + }); + + it('should NOT display resize handle for the column when the column has resizable param set to false', () => { + dataTable.isResizingEnabled = true; + dataTableSchema[0].resizable = false; + dataTable.data = new ObjectDataTableAdapter([...data], [...dataTableSchema]); + fixture.detectChanges(); + + expect(getResizeHandlersCount()).toBe(1); + }); + it('should display resize handle when the feature is Enabled [isResizingEnabled=true]', () => { dataTable.isResizingEnabled = true; diff --git a/lib/core/src/lib/datatable/data-column/data-column.component.stories.ts b/lib/core/src/lib/datatable/data-column/data-column.component.stories.ts index 6be7ac94c9..a6156f3326 100644 --- a/lib/core/src/lib/datatable/data-column/data-column.component.stories.ts +++ b/lib/core/src/lib/datatable/data-column/data-column.component.stories.ts @@ -85,6 +85,20 @@ export default { } } }, + resizable: { + description: 'Toggles resize for column.', + control: { type: 'boolean' }, + defaultValue: true, + table: { + category: 'Component Inputs', + type: { + summary: 'boolean' + }, + defaultValue: { + summary: true + } + } + }, editable: { description: 'Toggles the editing support of the column data.', control: { type: 'boolean', disable: true }, @@ -328,8 +342,8 @@ const template: Story = (args: DataColumnComponent & { rows template: ` - { sortingKey?: string; header?: TemplateRef; draggable?: boolean; + resizable?: boolean; isHidden?: boolean; width?: number; customData?: T; diff --git a/lib/core/src/lib/datatable/data/object-datacolumn.model.ts b/lib/core/src/lib/datatable/data/object-datacolumn.model.ts index c9bf0d6296..07d62dab9c 100644 --- a/lib/core/src/lib/datatable/data/object-datacolumn.model.ts +++ b/lib/core/src/lib/datatable/data/object-datacolumn.model.ts @@ -35,6 +35,7 @@ export class ObjectDataColumn implements DataColumn { sortingKey?: string; header?: TemplateRef; draggable: boolean; + resizable: boolean; isHidden: boolean; customData?: T; width?: number; @@ -58,6 +59,7 @@ export class ObjectDataColumn implements DataColumn { this.sortingKey = input.sortingKey; this.header = input.header; this.draggable = input.draggable ?? false; + this.resizable = input.resizable ?? true; this.isHidden = input.isHidden ?? false; this.customData = input.customData; this.width = input.width; diff --git a/lib/core/src/lib/mock/data-column.mock.ts b/lib/core/src/lib/mock/data-column.mock.ts index de7636a58a..cd30f9b1e2 100644 --- a/lib/core/src/lib/mock/data-column.mock.ts +++ b/lib/core/src/lib/mock/data-column.mock.ts @@ -36,6 +36,7 @@ export const getDataColumnMock = ( sortingKey: 'sortingKey', header: undefined, draggable: false, + resizable: true, isHidden: false, customData: undefined, ...column diff --git a/lib/extensions/src/lib/config/document-list.extensions.ts b/lib/extensions/src/lib/config/document-list.extensions.ts index 2a8590b9df..8c55887d8b 100644 --- a/lib/extensions/src/lib/config/document-list.extensions.ts +++ b/lib/extensions/src/lib/config/document-list.extensions.ts @@ -50,4 +50,5 @@ export interface DocumentListPresetRef extends ExtensionElement { visible?: string; }; draggable?: boolean; + resizable?: boolean; } diff --git a/lib/extensions/src/lib/config/schema/plugin-extension.schema.json b/lib/extensions/src/lib/config/schema/plugin-extension.schema.json index e626b9d798..92be6d5a03 100644 --- a/lib/extensions/src/lib/config/schema/plugin-extension.schema.json +++ b/lib/extensions/src/lib/config/schema/plugin-extension.schema.json @@ -565,6 +565,10 @@ "desktopOnly": { "description": "Display column only for large screens", "type": "boolean" + }, + "resizable": { + "description": "Toggles resizable state of the column", + "type": "boolean" } } }