Skip to content

Commit 435807a

Browse files
simeonoffsimeonoff
authored
Merge branch 'master' into mpopov/esf-header-icon-MASTER
2 parents 302d5cc + 4767e7d commit 435807a

16 files changed

+314
-89
lines changed

‎projects/igniteui-angular/src/lib/grids/cell.component.ts

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ import { DeprecateMethod } from '../core/deprecateDecorators';
2323
import { HammerGesturesManager } from '../core/touch';
2424
import { ColumnType } from './common/column.interface';
2525
import { RowType } from './common/row.interface';
26-
import { GridSelectionMode } from './common/enums';
26+
import { GridSelectionMode, GridKeydownTargetType } from './common/enums';
2727
import { GridType } from './common/grid.interface';
2828
import { ISearchInfo } from './grid/public_api';
2929

@@ -738,7 +738,7 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
738738
}
739739
if (!isLeftClick(event)) {
740740
event.preventDefault();
741-
this.setActiveNode();
741+
this.grid.navigation.setActiveNode({rowIndex: this.rowIndex, colIndex: this.visibleColumnIndex});
742742
this.selectionService.addKeyboardRange();
743743
this.selectionService.initKeyboardState();
744744
this.selectionService.primaryButton = false;
@@ -823,7 +823,8 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
823823
*/
824824
public activate(event: FocusEvent | KeyboardEvent) {
825825
const node = this.selectionNode;
826-
this.setActiveNode();
826+
this.grid.navigation.setActiveNode({ row: this.rowIndex, column: this.visibleColumnIndex });
827+
827828
const shouldEmitSelection = !this.selectionService.isActiveNode(node);
828829

829830
if (this.selectionService.primaryButton) {
@@ -843,9 +844,9 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
843844
if (this.grid.isCellSelectable && shouldEmitSelection) {
844845
this.grid.onSelection.emit({ cell: this, event });
845846
}
846-
this.grid.cdr.detectChanges();
847847
}
848848

849+
849850
/**
850851
* If the provided string matches the text in the cell, the text gets highlighted.
851852
* ```typescript
@@ -888,13 +889,4 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
888889
meta.set('pinned', this.grid.isRecordPinnedByViewIndex(this.row.index));
889890
return meta;
890891
}
891-
892-
private setActiveNode() {
893-
if (this.grid.navigation.activeNode) {
894-
Object.assign(this.grid.navigation.activeNode, {row: this.rowIndex, column: this.visibleColumnIndex});
895-
} else {
896-
const layout = this.column.columnLayoutChild ? this.grid.navigation.layout(this.visibleColumnIndex) : null;
897-
this.grid.navigation.activeNode = { row: this.rowIndex, column: this.visibleColumnIndex, layout: layout };
898-
}
899-
}
900892
}

‎projects/igniteui-angular/src/lib/grids/common/enums.ts

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,13 @@ export enum GridSummaryCalculationMode {
1515
rootAndChildLevels = 'rootAndChildLevels'
1616
}
1717

18-
export enum GridKeydownTargetType {
19-
dataCell = 'dataCell',
20-
summaryCell = 'summaryCell',
21-
groupRow = 'groupRow',
22-
hierarchicalRow = 'hierarchicalRow'
23-
}
18+
export type GridKeydownTargetType =
19+
'dataCell' |
20+
'summaryCell' |
21+
'groupRow' |
22+
'hierarchicalRow' |
23+
'headerCell' |
24+
'masterDetailRow';
2425

2526
export enum GridSelectionMode {
2627
none = 'none',

‎projects/igniteui-angular/src/lib/grids/common/events.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,3 +162,10 @@ export interface IGridScrollEventArgs extends IBaseEventArgs {
162162
/** The new scroll position */
163163
scrollPosition: number;
164164
}
165+
166+
export interface IActiveNodeChangeEventArgs extends IBaseEventArgs {
167+
row: number;
168+
column: number;
169+
level?: number;
170+
tag: GridKeydownTargetType;
171+
}

‎projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,8 @@ import {
141141
IRowToggleEventArgs,
142142
IColumnSelectionEventArgs,
143143
IPinRowEventArgs,
144-
IGridScrollEventArgs
144+
IGridScrollEventArgs,
145+
IActiveNodeChangeEventArgs
145146
} from './common/events';
146147
import { IgxAdvancedFilteringDialogComponent } from './filtering/advanced-filtering/advanced-filtering-dialog.component';
147148
import { GridType } from './common/grid.interface';
@@ -1481,6 +1482,17 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
14811482
@Output()
14821483
public onRowPinning = new EventEmitter<IPinRowEventArgs>();
14831484

1485+
/**
1486+
* Emmited when the active node is changed.
1487+
*
1488+
* @example
1489+
* ```
1490+
* <igx-grid [data]="data" [autoGenerate]="true" (activeNodeChange)="activeNodeChange($event)"></igx-grid>
1491+
* ```
1492+
*/
1493+
@Output()
1494+
public activeNodeChange = new EventEmitter<IActiveNodeChangeEventArgs>();
1495+
14841496
/**
14851497
* @hidden @internal
14861498
*/
@@ -5858,30 +5870,36 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
58585870
cb(cbArgs);
58595871
});
58605872
}
5873+
5874+
if (this.dataView[rowIndex].detailsData) {
5875+
this.navigation.setActiveNode({row: rowIndex});
5876+
this.cdr.detectChanges();
5877+
}
5878+
58615879
return;
58625880
}
58635881
const args = this.getNavigationArguments(row, visibleColIndex);
58645882
cb(args);
58655883
}
58665884

58675885
private getNavigationArguments(row, visibleColIndex) {
5868-
let targetType, target;
5886+
let targetType: GridKeydownTargetType, target;
58695887
switch (row.nativeElement.tagName.toLowerCase()) {
58705888
case 'igx-grid-groupby-row':
5871-
targetType = GridKeydownTargetType.groupRow;
5889+
targetType = 'groupRow';
58725890
target = row;
58735891
break;
58745892
case 'igx-grid-summary-row':
5875-
targetType = GridKeydownTargetType.summaryCell;
5893+
targetType = 'summaryCell';
58765894
target = visibleColIndex !== -1 ?
58775895
row.summaryCells.find(c => c.visibleColumnIndex === visibleColIndex) : row.summaryCells.first;
58785896
break;
58795897
case 'igx-child-grid-row':
5880-
targetType = GridKeydownTargetType.hierarchicalRow;
5898+
targetType = 'hierarchicalRow';
58815899
target = row;
58825900
break;
58835901
default:
5884-
targetType = GridKeydownTargetType.dataCell;
5902+
targetType = 'dataCell';
58855903
target = visibleColIndex !== -1 ? row.cells.find(c => c.visibleColumnIndex === visibleColIndex) : row.cells.first;
58865904
break;
58875905
}
@@ -6381,8 +6399,8 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
63816399
const rowIndex = activeCell.row;
63826400
const visibleColIndex = activeCell.layout ? activeCell.layout.columnVisibleIndex : activeCell.column;
63836401
this.navigateTo(rowIndex, visibleColIndex, (c) => {
6384-
if (c.targetType === GridKeydownTargetType.dataCell && c.target) {
6385-
c.target.activate();
6402+
if (c.targetType === 'dataCell' && c.target) {
6403+
c.target.activate(event);
63866404
}
63876405
});
63886406
}

‎projects/igniteui-angular/src/lib/grids/grid-mrl-navigation.service.ts

Lines changed: 29 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { first } from 'rxjs/operators';
44
import { IgxColumnComponent } from './columns/column.component';
55
import { IgxGridNavigationService } from './grid-navigation.service';
66
import { HORIZONTAL_NAV_KEYS, HEADER_KEYS } from '../core/utils';
7+
import { GridKeydownTargetType } from './common/enums';
78

89
/** @hidden */
910
@Injectable()
@@ -227,26 +228,45 @@ export class IgxGridMRLNavigationService extends IgxGridNavigationService {
227228
const col = key.includes('down') ? this.getNextRowIndex(children, false) : this.getPreviousRowIndex(children, false);
228229
if (!col) { return; }
229230
this.activeNode.column = col.visibleIndex;
230-
const newLayout = this.layout(this.activeNode.column);
231-
Object.assign(this.activeNode.layout, {rowStart: newLayout.rowStart, rowEnd: newLayout.rowEnd});
231+
const layout = this.layout(this.activeNode.column);
232+
const nextLayout = {...this.activeNode.layout, rowStart: layout.rowStart, rowEnd: layout.rowEnd};
233+
this.setActiveNode({row: this.activeNode.row, layout: nextLayout});
232234
return;
233235
}
234-
this.horizontalNav(event, key, -1);
236+
this.horizontalNav(event, key, -1, 'headerCell');
235237
}
236238

237-
protected horizontalNav(event: KeyboardEvent, key: string, rowIndex: number) {
239+
protected horizontalNav(event: KeyboardEvent, key: string, rowIndex: number, tag: GridKeydownTargetType) {
238240
const ctrl = event.ctrlKey;
239241
if (!HORIZONTAL_NAV_KEYS.has(key) || event.altKey) { return; }
240242
this.activeNode.row = rowIndex;
243+
244+
const newActiveNode = {
245+
column: this.activeNode.column,
246+
mchCache: {
247+
level: this.activeNode.level,
248+
visibleIndex: this.activeNode.column
249+
}
250+
};
251+
241252
if ((key.includes('left') || key === 'home') && this.activeNode.column > 0) {
242-
this.activeNode.column = ctrl || key === 'home' ? this.firstIndexPerRow : this.getNextHorizontalCellPosition(true).column;
253+
newActiveNode.column = ctrl || key === 'home' ? this.firstIndexPerRow : this.getNextHorizontalCellPosition(true).column;
243254
}
244255
if ((key.includes('right') || key === 'end') && this.activeNode.column !== this.lastIndexPerRow) {
245-
this.activeNode.column = ctrl || key === 'end' ? this.lastIndexPerRow : this.getNextHorizontalCellPosition().column;
256+
newActiveNode.column = ctrl || key === 'end' ? this.lastIndexPerRow : this.getNextHorizontalCellPosition().column;
246257
}
247-
const newLayout = this.layout(this.activeNode.column);
248-
Object.assign(this.activeNode.layout, {colStart: newLayout.colStart, rowEnd: newLayout.rowEnd});
249-
this.performHorizontalScrollToCell(this.activeNode.column);
258+
259+
if (tag === 'headerCell') {
260+
const column = this.grid.getColumnByVisibleIndex(newActiveNode.column);
261+
newActiveNode.mchCache.level = column.level;
262+
newActiveNode.mchCache.visibleIndex = column.visibleIndex;
263+
}
264+
265+
const layout = this.layout(newActiveNode.column);
266+
const newLayout = {...this.activeNode.layout, colStart: layout.colStart, rowEnd: layout.rowEnd};
267+
this.setActiveNode({row: this.activeNode.row, column: newActiveNode.column,
268+
layout: newLayout, mchCache: newActiveNode.mchCache});
269+
this.performHorizontalScrollToCell(newActiveNode.column);
250270
}
251271

252272
private get lastIndexPerRow(): number {

0 commit comments

Comments
 (0)