diff --git a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic-multiselect/demo.component.ts b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic-multiselect/demo.component.ts index d941d0a16c..6938e0a705 100644 --- a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic-multiselect/demo.component.ts +++ b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic-multiselect/demo.component.ts @@ -76,7 +76,6 @@ export class DemoComponent { constructor() { const gridOptions: GridOptions = { columnDefs: this.#columnDefs, - rowSelection: 'multiple', }; this.gridOptions = this.#agGridSvc.getGridOptions({ diff --git a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic/demo.component.ts b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic/demo.component.ts index b2b95f075e..4ddd165ff2 100644 --- a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic/demo.component.ts +++ b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/basic/demo.component.ts @@ -67,7 +67,7 @@ export class DemoComponent { constructor() { const gridOptions: GridOptions = { columnDefs: this.#columnDefs, - rowSelection: 'single', + selection: { mode: 'singleRow' }, }; this.gridOptions = this.#agGridSvc.getGridOptions({ diff --git a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager-multiselect/view-grid.component.ts b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager-multiselect/view-grid.component.ts index 63a0ee54f0..0efce19128 100644 --- a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager-multiselect/view-grid.component.ts +++ b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager-multiselect/view-grid.component.ts @@ -172,7 +172,6 @@ export class ViewGridComponent implements OnInit, OnDestroy { this.gridOptions = this.#agGridSvc.getGridOptions({ gridOptions: { columnDefs: this.#columnDefs, - rowSelection: 'multiple', onGridReady: this.onGridReady.bind(this), }, }); diff --git a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager/view-grid.component.ts b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager/view-grid.component.ts index 9423eeb75a..262c5eaf06 100644 --- a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager/view-grid.component.ts +++ b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/data-manager/view-grid.component.ts @@ -158,8 +158,8 @@ export class ViewGridComponent implements OnInit, OnDestroy { this.gridOptions = this.#agGridSvc.getGridOptions({ gridOptions: { columnDefs: this.#columnDefs, - rowSelection: 'single', onGridReady: this.onGridReady.bind(this), + selection: { mode: 'singleRow' }, }, }); diff --git a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/paging/demo.component.ts b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/paging/demo.component.ts index 9711e23d96..b0986b9bef 100644 --- a/apps/code-examples/src/app/code-examples/ag-grid/data-grid/paging/demo.component.ts +++ b/apps/code-examples/src/app/code-examples/ag-grid/data-grid/paging/demo.component.ts @@ -97,7 +97,7 @@ export class DemoComponent implements OnInit, OnDestroy { onGridReady: (gridReadyEvent): void => { this.onGridReady(gridReadyEvent); }, - rowSelection: 'single', + selection: { mode: 'singleRow' }, pagination: true, suppressPaginationPanel: true, paginationPageSize: this.pageSize, diff --git a/apps/playground/src/app/components/ag-grid/edit-complex-cells/edit-complex-cells.component.ts b/apps/playground/src/app/components/ag-grid/edit-complex-cells/edit-complex-cells.component.ts index 0bfd83917d..8d1c1e0dae 100644 --- a/apps/playground/src/app/components/ag-grid/edit-complex-cells/edit-complex-cells.component.ts +++ b/apps/playground/src/app/components/ag-grid/edit-complex-cells/edit-complex-cells.component.ts @@ -387,7 +387,6 @@ export class EditComplexCellsComponent implements OnInit { onGridSizeChanged: () => { this.sizeGrid(); }, - rowSelection: 'multiple', suppressColumnVirtualisation: true, stopEditingWhenCellsLoseFocus: false, }; diff --git a/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.spec.ts b/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.spec.ts index 53a9b38715..338e97ca37 100644 --- a/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.spec.ts +++ b/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.spec.ts @@ -329,6 +329,28 @@ describe('SkyAgGridService', () => { ?.enableCellTextSelection, ).toBeFalsy(); }); + + it('should update selection options', () => { + expect( + agGridService.getGridOptions({ + gridOptions: { rowSelection: 'single' }, + }), + ).toEqual( + jasmine.objectContaining({ + selection: { mode: 'singleRow' }, + }), + ); + + expect( + agGridService.getGridOptions({ + gridOptions: { enableRangeSelection: true }, + }), + ).toEqual( + jasmine.objectContaining({ + selection: { mode: 'cell' }, + }), + ); + }); }); describe('getEditableGridOptions', () => { @@ -338,6 +360,7 @@ describe('SkyAgGridService', () => { }); expect(editableGridOptions.rowSelection).toBeUndefined(); + expect(editableGridOptions.selection).toBeUndefined(); }); }); diff --git a/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.ts b/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.ts index c07804c67d..8efedca4be 100644 --- a/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.ts +++ b/libs/components/ag-grid/src/lib/modules/ag-grid/ag-grid.service.ts @@ -203,6 +203,21 @@ export class SkyAgGridService implements OnDestroy { defaultGridOptions: GridOptions, providedGridOptions: GridOptions, ): GridOptions { + if ( + !providedGridOptions.selection && + ('rowSelection' in providedGridOptions || + 'enableRangeSelection' in providedGridOptions) + ) { + if (providedGridOptions.rowSelection === 'single') { + providedGridOptions.selection = { mode: 'singleRow' }; + } + if (providedGridOptions.enableRangeSelection) { + providedGridOptions.selection = { mode: 'cell' }; + } + delete providedGridOptions.rowSelection; + delete providedGridOptions.enableRangeSelection; + } + const mergedGridOptions: GridOptions = { ...defaultGridOptions, ...providedGridOptions, @@ -232,13 +247,14 @@ export class SkyAgGridService implements OnDestroy { ...defaultGridOptions.icons, ...providedGridOptions.icons, }, + selection: providedGridOptions.selection ?? defaultGridOptions.selection, }; // Enable text selection unless explicitly disabled or conflicting with another setting. if ( mergedGridOptions.enableCellTextSelection || (!('enableCellTextSelection' in mergedGridOptions) && - !mergedGridOptions.enableRangeSelection && + mergedGridOptions.selection?.mode !== 'cell' && !mergedGridOptions.columnDefs?.some((col: ColDef) => col.editable)) ) { mergedGridOptions.context ||= {}; @@ -516,11 +532,15 @@ export class SkyAgGridService implements OnDestroy { }, loadingOverlayComponent: SkyAgGridLoadingComponent, onCellFocused: () => this.#onCellFocused(), - rowMultiSelectWithClick: true, - rowSelection: 'multiple', + selection: { + mode: 'multiRow', + enableClickSelection: false, + enableMultiSelectWithClick: true, + checkboxes: false, + headerCheckbox: false, + }, singleClickEdit: true, sortingOrder: ['desc', 'asc', null], - suppressRowClickSelection: true, suppressDragLeaveHidesColumns: true, }; @@ -597,9 +617,7 @@ export class SkyAgGridService implements OnDestroy { #getDefaultEditableGridOptions(args: SkyGetGridOptionsArgs): GridOptions { const defaultGridOptions = this.#getDefaultGridOptions(args); - - defaultGridOptions.rowSelection = undefined; - + delete defaultGridOptions.selection; return defaultGridOptions; } diff --git a/libs/components/ag-grid/src/lib/styles/_base.scss b/libs/components/ag-grid/src/lib/styles/_base.scss index fe902a8611..e583b78bef 100644 --- a/libs/components/ag-grid/src/lib/styles/_base.scss +++ b/libs/components/ag-grid/src/lib/styles/_base.scss @@ -153,6 +153,8 @@ $modernDarkThemeCompact: map.merge($modernDarkThemeBase, $modernThemeCompact); .ag-theme-sky-data-entry-grid-modern-dark-compact { @include ag-grid-extra.ag-grid-extra(); + --ag-list-item-height: var(--ag-row-height); + .ag-header-cell { cursor: initial;