Skip to content

Commit 863c46a

Browse files
zdrawkuzdrawku
authored
Merge branch 'master' into fluent-theme
2 parents e7d0c6f + 4394b0f commit 863c46a

File tree

10 files changed

+120
-31
lines changed

10 files changed

+120
-31
lines changed

‎projects/igniteui-angular/src/lib/core/styles/components/navdrawer/_navdrawer-theme.scss‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -209,6 +209,10 @@
209209
%aside--mini {
210210
width: rem(60px);
211211
transition-duration: .2s, .2s;
212+
213+
%item {
214+
justify-content: center;
215+
}
212216
}
213217

214218
%aside--normal {
@@ -251,17 +255,18 @@
251255
%item {
252256
position: relative;
253257
display: flex;
258+
align-items: center;
254259
flex-flow: row nowrap;
255260
color: --var($theme, 'item-text-color');
256261
max-height: rem(48px);
257-
padding: rem(12px) rem(16px);
262+
min-width: rem(32px);
263+
padding: rem(12px) rem(8px);
258264
cursor: pointer;
259-
align-items: center;
260265
user-select: none;
261266
outline: transparent;
262267
white-space: nowrap;
263268
border-radius: --var($theme, 'item-border-radius');
264-
margin: 8px;
269+
margin: rem(8px) rem(8px);
265270

266271
> igx-icon + span {
267272
margin-left: rem(32px);

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

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2003,8 +2003,6 @@ export class IgxColumnLayoutComponent extends IgxColumnGroupComponent implements
20032003
}
20042004

20052005
this.children.forEach(child => {
2006-
child.disableHiding = true;
2007-
child.disablePinning = true;
20082006
child.movable = false;
20092007
});
20102008
}

‎projects/igniteui-angular/src/lib/grids/grid/grid.multi-row-layout.integration.spec.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -801,6 +801,21 @@ describe('IgxGrid - multi-row-layout Integration - ', () => {
801801

802802
verifyDOMMatchesLayoutSettings(gridFirstRow, fixture.componentInstance.colGroups);
803803
});
804+
805+
it('should render unpin and hide column buttons into the excel style filter', () => {
806+
const filterIcons = fixture.debugElement.queryAll(By.css('.igx-excel-filter__icon'));
807+
expect(filterIcons.length).not.toBe(0);
808+
809+
filterIcons[0].nativeElement.click();
810+
fixture.detectChanges();
811+
812+
const excelMenu = grid.nativeElement.querySelector('.igx-excel-filter__menu');
813+
const unpinComponent = excelMenu.querySelector('.igx-excel-filter__actions-unpin');
814+
const hideComponent = excelMenu.querySelector('.igx-excel-filter__actions-hide');
815+
816+
expect(unpinComponent).toBeDefined();
817+
expect(hideComponent).toBeDefined();
818+
});
804819
});
805820

806821
describe('GroupBy ', () => {

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -436,7 +436,7 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseCompone
436436

437437
protected onColumnsChanged(change: QueryList<IgxColumnComponent>) {
438438
this.updateColumnList();
439-
const cols = change.filter(c => c.grid === this);
439+
const cols = change.filter(c => c.gridAPI.grid === this);
440440
if (cols.length > 0) {
441441
this.columnList.reset(cols);
442442
super.onColumnsChanged(this.columnList);

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.navigation.spec.ts‎

Lines changed: 39 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -930,49 +930,76 @@ describe('IgxHierarchicalGrid Multi-layout Navigation', () => {
930930
hierarchicalGrid = fixture.componentInstance.hgrid;
931931
setupHierarchicalGridScrollDetection(fixture, hierarchicalGrid);
932932
}));
933-
it('should allow navigating up/down between sibling child grids.', (async () => {
933+
934+
it('should allow navigating up between sibling child grids.', (async () => {
934935
hierarchicalGrid.verticalScrollContainer.scrollTo(2);
935936
await wait(100);
936937
fixture.detectChanges();
937938
const child1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
938939
const child2 = hierarchicalGrid.hgridAPI.getChildGrids(false)[4];
939940

940941
const child2Cell = child2.dataRowList.toArray()[0].cells.toArray()[0];
941-
child2Cell.nativeElement.focus();
942-
await wait(100);
943-
fixture.detectChanges();
944-
945-
let keyboardEvent = new KeyboardEvent('keydown', {
942+
const keyboardEvent = new KeyboardEvent('keydown', {
946943
code: 'ArrowUp',
947944
key: 'ArrowUp'
948945
});
949946
child2Cell.dispatchEvent(keyboardEvent);
947+
fixture.detectChanges();
950948
await wait(100);
951949
fixture.detectChanges();
952950
const lastCellPrevRI = child1.dataRowList.toArray()[1].cells.toArray()[0];
953951

954952
expect(lastCellPrevRI.selected).toBe(true);
955-
expect(lastCellPrevRI.focused).toBe(true);
956953
expect(lastCellPrevRI.rowIndex).toBe(9);
954+
}));
955+
it('should allow navigating down between sibling child grids.', (async () => {
956+
hierarchicalGrid.verticalScrollContainer.scrollTo(2);
957+
await wait(100);
958+
fixture.detectChanges();
959+
const child1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
960+
const child2 = hierarchicalGrid.hgridAPI.getChildGrids(false)[4];
957961

958-
keyboardEvent = new KeyboardEvent('keydown', {
962+
child1.verticalScrollContainer.scrollTo(child1.verticalScrollContainer.igxForOf.length - 1);
963+
await wait(100);
964+
fixture.detectChanges();
965+
966+
const keyboardEvent = new KeyboardEvent('keydown', {
959967
code: 'ArrowDown',
960968
key: 'ArrowDown'
961969
});
970+
const child2Cell = child2.dataRowList.toArray()[0].cells.toArray()[0];
971+
const lastCellPrevRI = child1.dataRowList.toArray()[1].cells.toArray()[0];
962972
lastCellPrevRI.dispatchEvent(keyboardEvent);
973+
fixture.detectChanges();
963974
await wait(100);
964975
fixture.detectChanges();
965976
expect(child2Cell.selected).toBe(true);
966977
}));
967-
it('should allow navigating with Tab/Shift+Tab between sibling child grids.', (async () => {
978+
979+
it('should allow navigating with Tab between sibling child grids.', (async () => {
968980
const child1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
969981
const child2 = hierarchicalGrid.hgridAPI.getChildGrids(false)[4];
970982

971-
const child2Cell = child2.dataRowList.toArray()[0].cells.toArray()[0];
972-
child2Cell.nativeElement.focus();
973-
await wait(240);
983+
child1.verticalScrollContainer.scrollTo(child1.verticalScrollContainer.igxForOf.length - 1);
984+
await wait(100);
974985
fixture.detectChanges();
986+
const rowVirt = child1.dataRowList.toArray()[0].virtDirRow;
987+
rowVirt.scrollTo(rowVirt.igxForOf.length - 1);
988+
await wait(100);
989+
fixture.detectChanges();
990+
const child1Cell = child1.getCellByColumn(9, 'childData');
991+
const child2Cell = child2.dataRowList.toArray()[0].cells.toArray()[0];
992+
// Tab from last cell in 1st child
993+
child1Cell.nativeElement.dispatchEvent(new KeyboardEvent('keydown', { key: 'Tab'}));
994+
await wait(100);
995+
fixture.detectChanges();
996+
expect(child2Cell.selected).toBe(true);
997+
}));
998+
it('should allow navigating with Shift+Tab between sibling child grids.', (async () => {
999+
const child1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
1000+
const child2 = hierarchicalGrid.hgridAPI.getChildGrids(false)[4];
9751001

1002+
const child2Cell = child2.dataRowList.toArray()[0].cells.toArray()[0];
9761003
// Shift + Tab from 2nd child
9771004
child2Cell.nativeElement.dispatchEvent(new KeyboardEvent('keydown', { key: 'Tab', shiftKey: true }));
9781005
await wait(240);
@@ -983,13 +1010,6 @@ describe('IgxHierarchicalGrid Multi-layout Navigation', () => {
9831010
expect(child1Cell.selected).toBe(true);
9841011
expect(child1Cell.rowIndex).toBe(9);
9851012
expect(child1Cell.columnIndex).toBe(6);
986-
987-
// Tab from last cell in 1st child
988-
child1Cell.nativeElement.dispatchEvent(new KeyboardEvent('keydown', { key: 'Tab'}));
989-
await wait(100);
990-
fixture.detectChanges();
991-
992-
expect(child2Cell.selected).toBe(true);
9931013
}));
9941014
it('should navigate up from parent row to the correct child sibling.', (async () => {
9951015
const parentCell = hierarchicalGrid.dataRowList.toArray()[1].cells.toArray()[0];

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -906,6 +906,30 @@ describe('IgxHierarchicalGrid Template Changing Scenarios', () => {
906906
expect(child2Headers[2].nativeElement.innerText).toEqual('Col1');
907907
});
908908

909+
it('should render correct columns when setting columns for parent and child post init using ngFor', () => {
910+
const row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
911+
UIInteractions.clickElement(row.expander);
912+
fixture.detectChanges();
913+
914+
const child1Grids = fixture.debugElement.queryAll(By.css('igx-child-grid-row'));
915+
const child1Grid = child1Grids[0].query(By.css('igx-hierarchical-grid')).componentInstance;
916+
917+
fixture.componentInstance.parentCols = ['Col1', 'Col2'];
918+
fixture.componentInstance.islandCols1 = ['ID', 'ProductName', 'Col1'];
919+
fixture.detectChanges();
920+
// check parent cols
921+
expect(hierarchicalGrid.columns.length).toBe(4);
922+
expect(hierarchicalGrid.columns[0].field).toBe('ID');
923+
expect(hierarchicalGrid.columns[1].field).toBe('ProductName');
924+
expect(hierarchicalGrid.columns[2].field).toBe('Col1');
925+
expect(hierarchicalGrid.columns[3].field).toBe('Col2');
926+
// check child cols
927+
expect(child1Grid.columns.length).toBe(3);
928+
expect(hierarchicalGrid.columns[0].field).toBe('ID');
929+
expect(hierarchicalGrid.columns[1].field).toBe('ProductName');
930+
expect(hierarchicalGrid.columns[2].field).toBe('Col1');
931+
});
932+
909933
it('should update columns for expanded child when adding column to row island', () => {
910934
const row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
911935
UIInteractions.clickElement(row.expander);
@@ -1206,6 +1230,7 @@ export class IgxHGridRemoteOnDemandComponent {
12061230
<igx-hierarchical-grid #hierarchicalGrid [data]="data" [autoGenerate]="false" [height]="'500px'" [width]="'800px'" >
12071231
<igx-column field="ID"></igx-column>
12081232
<igx-column field="ProductName"></igx-column>
1233+
<igx-column *ngFor="let colField of parentCols" [field]="colField"></igx-column>
12091234
<igx-row-island [key]="'childData'" [autoGenerate]="false" #rowIsland [height]="'350px'">
12101235
<igx-column *ngFor="let colField of islandCols1" [field]="colField"></igx-column>
12111236
<igx-row-island [key]="'childData'" [autoGenerate]="false" #rowIsland2 [height]="'200px'">
@@ -1217,6 +1242,7 @@ export class IgxHGridRemoteOnDemandComponent {
12171242
export class IgxHierarchicalGridColumnsUpdateComponent extends IgxHierarchicalGridTestBaseComponent implements AfterViewInit {
12181243
public cols1 = ['ID', 'ProductName', 'Col1', 'Col2', 'Col3'];
12191244
public cols2 = ['ID', 'ProductName', 'Col1'];
1245+
public parentCols = [];
12201246
public islandCols1 = [];
12211247
public islandCols2 = [];
12221248
constructor(public cdr: ChangeDetectorRef) {

‎projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.component.spec.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -240,7 +240,7 @@ describe('Navigation Drawer', () => {
240240
fixture.detectChanges();
241241
asideElem = fixture.debugElement.query(By.css('.igx-nav-drawer__aside'));
242242

243-
expect(asideElem.styles['width']).toEqual('60px');
243+
expect(asideElem.styles['width']).toEqual('68px');
244244

245245
fixture.componentInstance.miniView = false;
246246
fixture.detectChanges();
@@ -441,9 +441,10 @@ describe('Navigation Drawer', () => {
441441
fixture = TestBed.createComponent(TestComponentDIComponent);
442442
fixture.detectChanges();
443443

444-
fixture.componentInstance.drawerMiniWidth = 60;
444+
fixture.componentInstance.drawerMiniWidth = 68;
445445
fixture.detectChanges();
446-
expect(fixture.componentInstance.viewChild.maxEdgeZone).toBe(66);
446+
expect(fixture.componentInstance.viewChild.maxEdgeZone)
447+
.toBe(fixture.componentInstance.drawerMiniWidth * 1.1);
447448

448449
fixture.componentInstance.drawerMiniWidth = 80;
449450
fixture.detectChanges();

‎projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.component.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -183,7 +183,7 @@ export class IgxNavigationDrawerComponent implements
183183
@Input() public width = '280px';
184184

185185
/**
186-
* Width of the drawer in its mini state. Defaults to 60px.
186+
* Width of the drawer in its mini state. Defaults to 68px.
187187
*
188188
* ```typescript
189189
* // get
@@ -195,7 +195,7 @@ export class IgxNavigationDrawerComponent implements
195195
* <igx-nav-drawer [miniWidth]="'34px'"></igx-nav-drawer>
196196
* ```
197197
*/
198-
@Input() public miniWidth = '60px';
198+
@Input() public miniWidth = '68px';
199199

200200
/**
201201
* Pinned state change output for two-way binding.

‎src/app/hierarchical-grid/hierarchical-grid.sample.html‎

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ <h4 class="sample-title">Sample three</h4>
6666
<igx-hierarchical-grid [data]="localData" [autoGenerate]="true" [height]="'600px'" [width]="'800px'" #hGrid2>
6767

6868
<igx-row-island [key]="'childData'" [autoGenerate]="true" [rowSelectable]='isRowSelectable' [allowFiltering]='true' >
69-
<div *ngIf='riToggle'>
69+
<div *ngIf='riToggle'>
7070
<igx-row-island [key]="'childData'" [autoGenerate]="true" [rowSelectable]='isRowSelectable' [allowFiltering]='true'></igx-row-island>
7171
</div>
7272
</igx-row-island>
@@ -81,5 +81,20 @@ <h4 class="sample-title">Sample three</h4>
8181
</div> -->
8282
</igx-hierarchical-grid>
8383

84+
<h4 class="sample-title">Sample 4</h4>
85+
<div class="sample-actions">
86+
<button igxButton="raised" (click)='LoadMoreColumns()'>Change columns runtime</button>
87+
</div>
88+
<igx-hierarchical-grid [data]="localData" [autoGenerate]="false" [height]="'600px'" [width]="'800px'" #hGrid2>
89+
<igx-column field="ID" [resizable]="true" [pinned]="true" [filterable]='true'></igx-column>
90+
<igx-column field="ChildLevels" [resizable]="true" [groupable]='true'></igx-column>
91+
<igx-column field="ProductName" hasSummary='true'></igx-column>
92+
<igx-column *ngFor="let c of columns" [field]="c"></igx-column>
93+
<igx-row-island [key]="'childData'" [autoGenerate]="false" [rowSelectable]='isRowSelectable' [allowFiltering]='true'>
94+
<igx-column field="ID" [hasSummary]='true' [dataType]="'number'"></igx-column>
95+
<igx-column *ngFor="let c of childColumns" [field]="c"></igx-column>
96+
</igx-row-island>
97+
</igx-hierarchical-grid>
98+
8499

85100
</div>

‎src/app/hierarchical-grid/hierarchical-grid.sample.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,10 @@ export class HierarchicalGridSampleComponent {
1515
displayDensities;
1616
riToggle = true;
1717

18+
19+
public columns;
20+
public childColumns;
21+
1822
@ViewChild('layout1', { static: true })
1923
layout1: IgxRowIslandComponent;
2024

@@ -96,4 +100,9 @@ export class HierarchicalGridSampleComponent {
96100
selectDensity(event) {
97101
this.density = this.displayDensities[event.index].label;
98102
}
103+
104+
public LoadMoreColumns() {
105+
this.columns = ['Col1', 'Col2', 'Col3'];
106+
this.childColumns = ['ChildCol1', 'ChildCol2'];
107+
}
99108
}

0 commit comments

Comments
 (0)