Skip to content

Commit 2b0402d

Browse files
authored
Merge branch '21.0.x' into rivanova/fix-16458-21.0.x
2 parents 69303b8 + 73a6cb4 commit 2b0402d

16 files changed

Lines changed: 231 additions & 29 deletions

File tree

projects/igniteui-angular/core/src/core/styles/components/combo/_combo-theme.scss

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -178,6 +178,7 @@
178178

179179
.igx-input-group {
180180
%igx-combo__toggle-button {
181+
cursor: pointer;
181182
background: var-get($theme, 'toggle-button-background');
182183
color: var-get($theme, 'toggle-button-foreground');
183184
}
@@ -286,4 +287,12 @@
286287
}
287288
}
288289
}
290+
291+
igx-combo {
292+
%form-group-input,
293+
%form-group-prefix,
294+
%form-group-suffix {
295+
cursor: pointer;
296+
}
297+
}
289298
}

projects/igniteui-angular/core/src/core/styles/components/input/_input-group-theme.scss

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -59,8 +59,8 @@
5959
$material-box-top-padding: sizable(rem(16px), rem(20px), rem(24px));
6060
$material-border-top-padding: sizable(rem(8px), rem(12px), rem(16px));
6161

62-
$textarea-top-padding: map.get((
63-
'material': rem(0px),
62+
$textarea-padding: map.get((
63+
'material': sizable(rem(8px), rem(12px), rem(16px)),
6464
'fluent': sizable(rem(6px), rem(10px), rem(14px)),
6565
'bootstrap': sizable(rem(4px), rem(8px), rem(12px)),
6666
'indigo': sizable(rem(4px), rem(6px), rem(8px)),
@@ -149,6 +149,7 @@
149149
[igxPrefix] {
150150
@extend %form-group-prefix;
151151
outline-style: none;
152+
cursor: default;
152153

153154
&:first-child {
154155
@if $variant == 'fluent' {
@@ -164,6 +165,7 @@
164165
[igxSuffix] {
165166
@extend %form-group-suffix;
166167
outline-style: none;
168+
cursor: default;
167169

168170
&:last-child {
169171
@if $variant == 'fluent' {
@@ -1289,7 +1291,7 @@
12891291

12901292
%textarea-group-label--focused {
12911293
transform: translateY(0);
1292-
top: calc(#{$material-box-top-padding} / 4);
1294+
top: calc(#{$textarea-padding} / 4);
12931295
}
12941296

12951297
%textarea-group-label--filled--border,
@@ -1425,7 +1427,6 @@
14251427
}
14261428

14271429
%form-group-input--hover {
1428-
cursor: pointer;
14291430
color: var-get($theme, 'filled-text-hover-color');
14301431

14311432
&::placeholder {
@@ -1434,7 +1435,6 @@
14341435
}
14351436

14361437
%form-group-input--focus {
1437-
cursor: text;
14381438
color: var-get($theme, 'focused-text-color');
14391439

14401440
&::placeholder {
@@ -1465,9 +1465,10 @@
14651465
resize: vertical;
14661466
overflow: hidden;
14671467
z-index: 1;
1468+
padding-block-end: $textarea-padding;
14681469

14691470
@if $material-theme {
1470-
padding: 0;
1471+
padding-block-start: 0;
14711472
}
14721473
}
14731474

@@ -2023,14 +2024,14 @@
20232024
}
20242025

20252026
%indigo-textarea {
2026-
padding-block: $textarea-top-padding 0;
2027+
padding-block: $textarea-padding;
20272028
padding-inline: pad-inline(rem(2px), rem(4px), rem(6px));
20282029
inset-block-end: rem(2px);
20292030
}
20302031

20312032
%fluent-textarea {
20322033
padding-inline: pad-inline(rem(8px));
2033-
padding-block: $textarea-top-padding 0;
2034+
padding-block: $textarea-padding;
20342035
}
20352036

20362037
%fluent-input-disabled {
@@ -2292,7 +2293,7 @@
22922293
);
22932294

22942295
&:is(textarea) {
2295-
padding-block: $textarea-top-padding 0;
2296+
padding-block: $textarea-padding;
22962297
}
22972298
}
22982299

projects/igniteui-angular/core/src/core/styles/components/select/_select-theme.scss

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515

1616
.igx-input-group {
1717
%igx-select__toggle-button {
18+
cursor: pointer;
1819
background: var-get($theme, 'toggle-button-background');
1920
color: var-get($theme, 'toggle-button-foreground');
2021
}
@@ -60,4 +61,12 @@
6061
color: var-get($theme, 'toggle-button-foreground-disabled');
6162
}
6263
}
64+
65+
igx-select {
66+
%form-group-input,
67+
%form-group-prefix,
68+
%form-group-suffix {
69+
cursor: pointer;
70+
}
71+
}
6372
}

projects/igniteui-angular/core/src/core/styles/components/stepper/_stepper-theme.scss

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -350,6 +350,7 @@
350350

351351
%igx-stepper__step-content-wrapper {
352352
margin-inline-start: $v-line-indent;
353+
padding-inline-start: $v-line-indent;
353354
position: relative;
354355
min-height: if($variant == 'indigo', rem(24px), rem(32px));
355356

@@ -364,12 +365,6 @@
364365
}
365366
}
366367

367-
[aria-selected='true'] {
368-
%igx-stepper__step-content-wrapper {
369-
padding-inline-start: $v-line-indent;
370-
}
371-
}
372-
373368
@if $variant == 'indigo' {
374369
[aria-selected='true'] {
375370
%igx-stepper__step-content-wrapper {

projects/igniteui-angular/grids/core/src/api.service.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -289,7 +289,9 @@ export class GridBaseAPIService<T extends GridType> implements GridServiceType {
289289
}
290290

291291
public should_apply_number_style(column: ColumnType): boolean {
292-
return column.dataType === GridColumnDataType.Number;
292+
return column.dataType === GridColumnDataType.Number
293+
|| column.dataType === GridColumnDataType.Currency
294+
|| column.dataType === GridColumnDataType.Percent;
293295
}
294296

295297
public get_data(): any[] {

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -354,7 +354,8 @@ export class IgxGridMRLNavigationService extends IgxGridNavigationService {
354354

355355
private hasNextVerticalPosition(prev = false) {
356356
if ((prev && this.activeNode.row === 0 && (!this.isDataRow(this.activeNode.row) || this.activeNode.layout.rowStart === 1)) ||
357-
(!prev && this.activeNode.row >= this.grid.dataView.length - 1 && this.activeNode.column === this.lastColIndexPerMRLBlock())) {
357+
(!prev && this.activeNode.row >= this.grid.dataView.length - 1 &&
358+
this.activeNode.layout.rowStart === this.lastRowStartPerBlock())) {
358359
return false;
359360
}
360361
return true;

projects/igniteui-angular/grids/core/src/headers/grid-header.component.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -151,7 +151,9 @@ export class IgxGridHeaderComponent implements DoCheck, OnDestroy {
151151

152152
@HostBinding('class.igx-grid-th--number')
153153
public get numberStyle() {
154-
return this.column.dataType === GridColumnDataType.Number;
154+
return this.column.dataType === GridColumnDataType.Number
155+
|| this.column.dataType === GridColumnDataType.Currency
156+
|| this.column.dataType === GridColumnDataType.Percent;
155157
}
156158

157159
@HostBinding('class.igx-grid-th--sortable')

projects/igniteui-angular/grids/core/src/services/excel/excel-exporter-grid.spec.ts

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -898,6 +898,49 @@ describe('Excel Exporter', () => {
898898
await exportAndVerify(hGrid, options, actualData.exportHierarchicalDataWithExpandedRows);
899899
});
900900

901+
it('should export hierarchical grid with expanded rows when using primaryKey', async () => {
902+
hGrid.primaryKey = 'Artist';
903+
fix.detectChanges();
904+
905+
const firstRow = hGrid.gridAPI.get_row_by_index(0) as IgxHierarchicalRowComponent;
906+
const secondRow = hGrid.gridAPI.get_row_by_index(1) as IgxHierarchicalRowComponent;
907+
908+
UIInteractions.simulateClickAndSelectEvent(firstRow.expander);
909+
fix.detectChanges();
910+
expect(firstRow.expanded).toBe(true);
911+
912+
let childGrids = hGrid.gridAPI.getChildGrids(false);
913+
914+
const firstChildGrid = childGrids[0];
915+
const firstChildRow = firstChildGrid.gridAPI.get_row_by_index(2) as IgxHierarchicalRowComponent;
916+
917+
UIInteractions.simulateClickAndSelectEvent(firstChildRow.expander);
918+
fix.detectChanges();
919+
expect(firstChildRow.expanded).toBe(true);
920+
921+
const secondChildGrid = childGrids[1];
922+
const secondChildRow = secondChildGrid.gridAPI.get_row_by_index(0) as IgxHierarchicalRowComponent;
923+
924+
UIInteractions.simulateClickAndSelectEvent(secondChildRow.expander);
925+
fix.detectChanges();
926+
expect(secondChildRow.expanded).toBe(true);
927+
928+
UIInteractions.simulateClickAndSelectEvent(secondRow.expander);
929+
fix.detectChanges();
930+
expect(secondRow.expanded).toBe(true);
931+
932+
childGrids = hGrid.gridAPI.getChildGrids(false);
933+
934+
const thirdChildGrid = childGrids[3];
935+
const thirdChildRow = thirdChildGrid.gridAPI.get_row_by_index(0) as IgxHierarchicalRowComponent;
936+
937+
UIInteractions.simulateClickAndSelectEvent(thirdChildRow.expander);
938+
fix.detectChanges();
939+
expect(thirdChildRow.expanded).toBe(true);
940+
941+
await exportAndVerify(hGrid, options, actualData.exportHierarchicalDataWithExpandedRows);
942+
});
943+
901944
it('should export hierarchical grid data with frozen headers', async () => {
902945
options.freezeHeaders = true;
903946
fix.detectChanges();

projects/igniteui-angular/grids/core/src/services/exporter-common/base-export-service.ts

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -632,7 +632,8 @@ export abstract class IgxBaseExporter {
632632
const columnFields = this._ownersMap.get(grid).columns.map(col => col.field);
633633

634634
for (const entry of records) {
635-
const expansionStateVal = grid.expansionStates.has(entry) ? grid.expansionStates.get(entry) : grid.getDefaultExpandState(entry);
635+
const rowKey = grid.primaryKey ? entry[grid.primaryKey] : entry;
636+
const expansionStateVal = grid.expansionStates.has(rowKey) ? grid.expansionStates.get(rowKey) : grid.getDefaultExpandState(entry);
636637

637638
const dataWithoutChildren = Object.keys(entry)
638639
.filter(k => columnFields.includes(k))
@@ -653,8 +654,8 @@ export abstract class IgxBaseExporter {
653654

654655
for (const island of childLayoutList) {
655656
const path: IPathSegment = {
656-
rowID: island.primaryKey ? entry[island.primaryKey] : entry,
657-
rowKey: island.primaryKey ? entry[island.primaryKey] : entry,
657+
rowID: grid.primaryKey ? entry[grid.primaryKey] : entry,
658+
rowKey: grid.primaryKey ? entry[grid.primaryKey] : entry,
658659
rowIslandKey: island.key
659660
};
660661

@@ -793,24 +794,27 @@ export abstract class IgxBaseExporter {
793794
this.flatRecords.push(exportRecord);
794795

795796
if (island.children.length > 0) {
797+
const islandRowKey = grid?.primaryKey ? rec[grid.primaryKey] : rec;
796798
const islandExpansionStateVal = grid === undefined ?
797799
false :
798-
grid.expansionStates.has(rec) ?
799-
grid.expansionStates.get(rec) :
800+
grid.expansionStates.has(islandRowKey) ?
801+
grid.expansionStates.get(islandRowKey) :
800802
false;
801803

802804
for (const childIsland of island.children) {
803805
const path: IPathSegment = {
804-
rowID: childIsland.primaryKey ? rec[childIsland.primaryKey] : rec,
805-
rowKey: childIsland.primaryKey ? rec[childIsland.primaryKey] : rec,
806+
rowID: grid?.primaryKey ? rec[grid.primaryKey] : rec,
807+
rowKey: grid?.primaryKey ? rec[grid.primaryKey] : rec,
806808
rowIslandKey: childIsland.key
807809
};
808810

809811
// only defined when row is expanded in UI
810812
const childIslandGrid = grid?.gridAPI.getChildGrid([path]);
811813
const keyRecordData = this.prepareIslandData(island, childIslandGrid, rec[childIsland.key]) || [];
812814

813-
this.getAllChildColumnsAndData(childIsland, keyRecordData, islandExpansionStateVal, childIslandGrid);
815+
// Children should only be visible if both parent and current row are expanded
816+
const combinedExpansionState = expansionStateVal && islandExpansionStateVal;
817+
this.getAllChildColumnsAndData(childIsland, keyRecordData, combinedExpansionState, childIslandGrid);
814818
}
815819
}
816820
}

projects/igniteui-angular/grids/core/src/services/pdf/pdf-exporter-grid.spec.ts

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -372,6 +372,46 @@ describe('PDF Grid Exporter', () => {
372372
exporter.export(hGrid, options);
373373
});
374374

375+
it('should export hierarchical grid with expanded rows when using primaryKey', (done) => {
376+
const fix = TestBed.createComponent(IgxHierarchicalGridExportComponent);
377+
fix.detectChanges();
378+
379+
const hGrid = fix.componentInstance.hGrid;
380+
381+
// Set primary key on the grid
382+
hGrid.primaryKey = 'Artist';
383+
fix.detectChanges();
384+
385+
// Limit data for test performance
386+
hGrid.data = hGrid.data.slice(0, 1);
387+
fix.detectChanges();
388+
389+
const firstRowData = hGrid.data[0];
390+
391+
hGrid.toggleRow(firstRowData['Artist']);
392+
fix.detectChanges();
393+
394+
expect(hGrid.expansionStates.get(firstRowData['Artist'])).toBe(true);
395+
396+
const childGrids = hGrid.gridAPI.getChildGrids(false) as any[];
397+
expect(childGrids.length).toBeGreaterThan(0);
398+
399+
const firstChildGrid = childGrids[0];
400+
expect(firstChildGrid.data.length).toBeGreaterThan(0);
401+
402+
// Spy on drawDataRow to count exported rows
403+
const drawDataRowSpy = spyOn<any>(exporter as any, 'drawDataRow').and.callThrough();
404+
405+
exporter.exportEnded.pipe(first()).subscribe(() => {
406+
const minExpectedRows = 1 + firstChildGrid.data.length;
407+
expect(drawDataRowSpy.calls.count()).toBeGreaterThanOrEqual(minExpectedRows,
408+
'Child rows should be exported when parent is expanded via toggleRow with primaryKey');
409+
done();
410+
});
411+
412+
exporter.export(hGrid, options);
413+
});
414+
375415
it('should export tree grid with hierarchical data', (done) => {
376416
TestBed.configureTestingModule({
377417
imports: [

0 commit comments

Comments
 (0)