Skip to content

Commit 399a26b

Browse files
simeonoffsimeonoff
authored
Merge branch 'master' into simeonoff/dockmgr-theme
2 parents 7ed35c3 + 5053978 commit 399a26b

File tree

22 files changed

+372
-54
lines changed

22 files changed

+372
-54
lines changed

‎CHANGELOG.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,16 @@ All notable changes for each version of this project will be documented in this
77
### General
88
- `igxCombo`
99
- **Behavioral Change** - Change default positioning strategy from `ConnectedPositioningStrategy` to `AutoPositionStrategy`. The [`Auto`](https://www.infragistics.com/products/ignite-ui-angular/angular/components/overlay_position.html#auto) strategy will initially try to show the element like the Connected strategy does. If the element goes out of the viewport Auto will flip the starting point and the direction, i.e. if the direction is 'bottom', it will switch it to 'top' and so on. If after flipping direction the content goes out of the view, auto strategy will revert to initial start point and direction and will push the content into the view. Note after pushing the content it may hide the combo's input.
10+
- `IgxOverlay`
11+
- Added new property - `closeOnEsc` - in `OverlaySettings`. The overlay can now be prevented from closing, on escape keypress, by setting the property to `false`, by default it's `true`.
12+
- `igxDialog`
13+
- Added `closeOnEscapeKey` - with it, the dialog can be allowed or prevented from closing when `Esc` is pressed.
1014
- `IgxNavbar`:
1115
- **Breaking Changes** - The `igx-action-icon` has been renamed to `igx-navbar-action`. It should get renamed in your components via `ng update`;
16+
- `igxGrid`
17+
- Added `onScroll` event, which is emitted when the grid is scrolled vertically or horizontally.
18+
- `igxTreeGrid`
19+
- Removed `onDataPreLoad` event as it is specific for remote virtualization implementation, which is not supported for the `igxTreeGrid`. A more generic `onScroll` event is exposed and can be used instead.
1220

1321
### New Features
1422
- `IgxGridState` directive

‎projects/igniteui-angular/migrations/update-10_1_0/changes/outputs.json

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"$schema": "../../common/schema/binding.schema.json",
3+
"changes": [
4+
{
5+
"name": "onDataPreLoad",
6+
"replaceWith": "onScroll",
7+
"owner": {
8+
"selector": "igx-tree-grid",
9+
"type": "component"
10+
}
11+
}
12+
]
13+
}

‎projects/igniteui-angular/migrations/update-10_1_0/index.spec.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -105,4 +105,18 @@ describe('Update 10.1.0', () => {
105105
.toEqual(expectedFileContent);
106106
});
107107

108+
it('should replace onDataPreLoad with onScroll ', async () => {
109+
appTree.create(
110+
`/testSrc/appPrefix/component/tree-grid.component.html`,
111+
'<igx-tree-grid (onDataPreLoad)="handleEvent($event)"></igx-tree-grid>'
112+
);
113+
114+
const tree = await schematicRunner.runSchematicAsync('migration-16', {}, appTree)
115+
.toPromise();
116+
117+
expect(tree.readContent('/testSrc/appPrefix/component/tree-grid.component.html'))
118+
.toEqual('<igx-tree-grid (onScroll)="handleEvent($event)"></igx-tree-grid>');
119+
120+
});
121+
108122
});

‎projects/igniteui-angular/src/lib/core/styles/components/drop-down/_drop-down-component.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,11 @@
1717
@extend %igx-drop-down__list !optional;
1818
}
1919

20+
@include e(list, $m: empty) {
21+
@extend %igx-drop-down__list !optional;
22+
@extend %igx-drop-down__list--empty !optional;
23+
}
24+
2025
@include e(list-scroll) {
2126
@extend %igx-drop-down__list-scroll !optional;
2227
}

‎projects/igniteui-angular/src/lib/core/styles/components/drop-down/_drop-down-theme.scss

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -229,15 +229,15 @@
229229
border: --var($theme, 'border-width') solid --var($theme, 'border-color');
230230
}
231231

232+
%igx-drop-down__list--empty {
233+
box-shadow: none;
234+
}
235+
232236
%igx-drop-down__list-scroll {
233237
overflow-y: auto;
234238
overflow-x: hidden;
235239
position: relative;
236240

237-
&:empty {
238-
box-shadow: none;
239-
}
240-
241241
igx-input-group {
242242
margin-top: -16px !important;
243243
}

‎projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -783,6 +783,7 @@ export class IgxDatePickerComponent implements IDatePicker, ControlValueAccessor
783783

784784
this._modalOverlaySettings = {
785785
closeOnOutsideClick: true,
786+
closeOnEsc: true,
786787
modal: true,
787788
outlet: this.outlet
788789
};

‎projects/igniteui-angular/src/lib/dialog/dialog.component.ts

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,15 @@ export class IgxDialogComponent implements IToggleView, OnInit, OnDestroy, After
8383
this._isModal = val;
8484
}
8585

86+
get closeOnEscapeKey() {
87+
return this._closeOnEscapeKey;
88+
}
89+
90+
set closeOnEscapeKey(val: boolean) {
91+
this._overlayDefaultSettings.closeOnEsc = val;
92+
this._closeOnEscapeKey = val;
93+
}
94+
8695
/**
8796
* An @Input property controlling the `title` of the dialog.
8897
* ```html
@@ -301,6 +310,7 @@ export class IgxDialogComponent implements IToggleView, OnInit, OnDestroy, After
301310

302311
private _overlayDefaultSettings: OverlaySettings;
303312
private _closeOnOutsideSelect = false;
313+
private _closeOnEscapeKey = true;
304314
private _isModal = true;
305315
protected destroy$ = new Subject<boolean>();
306316

@@ -404,6 +414,7 @@ export class IgxDialogComponent implements IToggleView, OnInit, OnDestroy, After
404414
positionStrategy: new GlobalPositionStrategy(this._positionSettings),
405415
scrollStrategy: new NoOpScrollStrategy(),
406416
modal: this.isModal,
417+
closeOnEsc: this._closeOnEscapeKey,
407418
closeOnOutsideClick: this.closeOnOutsideSelect
408419
};
409420
}
@@ -503,7 +514,6 @@ export class IgxDialogComponent implements IToggleView, OnInit, OnDestroy, After
503514
}
504515

505516
}
506-
507517
}
508518

509519
export interface IDialogEventArgs extends IBaseEventArgs {

‎projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1142,6 +1142,47 @@ describe('IgxForOf directive -', () => {
11421142
expect(firstInnerDisplayContainer.children[0].textContent).toBe('0');
11431143
});
11441144
});
1145+
1146+
describe('on create new instance', () => {
1147+
let fix: ComponentFixture<VerticalVirtualCreateComponent>;
1148+
1149+
configureTestSuite();
1150+
beforeAll(async(() => {
1151+
TestBed.configureTestingModule({
1152+
declarations: [
1153+
VerticalVirtualCreateComponent
1154+
],
1155+
imports: [IgxForOfModule],
1156+
providers: [{ provide: NgZone, useFactory: () => zone = new TestNgZone() }]
1157+
}).compileComponents();
1158+
}));
1159+
1160+
beforeEach(() => {
1161+
fix = TestBed.createComponent(VerticalVirtualCreateComponent);
1162+
fix.componentInstance.data = dg.generateVerticalData(fix.componentInstance.cols);
1163+
fix.componentRef.hostView.detectChanges();
1164+
fix.detectChanges();
1165+
1166+
});
1167+
1168+
it('should reset scroll position if new component is created.', async () => {
1169+
const scrollComponent = fix.debugElement.query(By.css(VERTICAL_SCROLLER)).componentInstance;
1170+
expect(scrollComponent.scrollAmount).toBe(0);
1171+
expect(scrollComponent.destroyed).toBeFalsy();
1172+
1173+
scrollComponent.nativeElement.scrollTop = 500;
1174+
fix.detectChanges();
1175+
await wait(100);
1176+
fix.detectChanges();
1177+
expect(scrollComponent.scrollAmount).toBe(500);
1178+
1179+
fix.componentInstance.exists = true;
1180+
fix.detectChanges();
1181+
await wait();
1182+
const secondForOf = fix.componentInstance.secondForOfDir;
1183+
expect(secondForOf.state.startIndex).toBe(0);
1184+
});
1185+
});
11451186
});
11461187

11471188
class DataGenerator {
@@ -1405,6 +1446,45 @@ export class VerticalVirtualDestroyComponent extends VerticalVirtualComponent {
14051446
public exists = true;
14061447
}
14071448

1449+
@Component({
1450+
template: `
1451+
<div #container [style.width]='width' [style.height]='height'>
1452+
<ng-template #scrollContainer igxFor let-rowData [igxForOf]="data"
1453+
[igxForScrollOrientation]="'vertical'"
1454+
[igxForContainerSize]='height'
1455+
[igxForItemSize]='itemSize'>
1456+
<div [style.display]="'flex'" [style.height]="rowData.height || itemSize || '50px'">
1457+
<div [style.min-width]=cols[0].width>{{rowData['1']}}</div>
1458+
<div [style.min-width]=cols[1].width>{{rowData['2']}}</div>
1459+
<div [style.min-width]=cols[2].width>{{rowData['3']}}</div>
1460+
<div [style.min-width]=cols[3].width>{{rowData['4']}}</div>
1461+
<div [style.min-width]=cols[4].width>{{rowData['5']}}</div>
1462+
</div>
1463+
</ng-template>
1464+
</div>
1465+
<div *ngIf='exists' #container [style.width]='width' [style.height]='height'>
1466+
<ng-template #scrollContainer2 igxFor let-rowData [igxForOf]="data"
1467+
[igxForScrollOrientation]="'vertical'"
1468+
[igxForContainerSize]='height'
1469+
[igxForItemSize]='itemSize'>
1470+
<div [style.display]="'flex'" [style.height]="rowData.height || itemSize || '50px'">
1471+
<div [style.min-width]=cols[0].width>{{rowData['1']}}</div>
1472+
<div [style.min-width]=cols[1].width>{{rowData['2']}}</div>
1473+
<div [style.min-width]=cols[2].width>{{rowData['3']}}</div>
1474+
<div [style.min-width]=cols[3].width>{{rowData['4']}}</div>
1475+
<div [style.min-width]=cols[4].width>{{rowData['5']}}</div>
1476+
</div>
1477+
</ng-template>
1478+
</div>
1479+
`
1480+
})
1481+
export class VerticalVirtualCreateComponent extends VerticalVirtualComponent {
1482+
public exists = false;
1483+
1484+
@ViewChild('scrollContainer2', { read: IgxForOfDirective, static: false })
1485+
public secondForOfDir: IgxForOfDirective<any>;
1486+
}
1487+
14081488
/** Only horizontally virtualized component */
14091489
@Component({
14101490
template: `

‎projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,8 @@ export class IgxForOfContext<T> {
6868

6969
}
7070

71-
@Directive({ selector: '[igxFor][igxForOf]' })
71+
@Directive({ selector: '[igxFor][igxForOf]',
72+
providers: [ IgxForOfScrollSyncService ] })
7273
export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestroy, AfterViewInit {
7374

7475
/**

‎projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -475,6 +475,7 @@ describe('IgxToggle', () => {
475475
positionStrategy: jasmine.any(ConnectedPositioningStrategy) as any,
476476
closeOnOutsideClick: true,
477477
modal: false,
478+
closeOnEsc: true,
478479
scrollStrategy: jasmine.any(AbsoluteScrollStrategy) as any,
479480
excludePositionTarget: true
480481
};
@@ -498,6 +499,7 @@ describe('IgxToggle', () => {
498499
positionStrategy: jasmine.any(ConnectedPositioningStrategy) as any,
499500
closeOnOutsideClick: true,
500501
modal: false,
502+
closeOnEsc: true,
501503
scrollStrategy: jasmine.any(AbsoluteScrollStrategy) as any,
502504
excludePositionTarget: true
503505
};
@@ -533,6 +535,7 @@ describe('IgxToggle', () => {
533535
positionStrategy: jasmine.any(ConnectedPositioningStrategy) as any,
534536
closeOnOutsideClick: true,
535537
modal: false,
538+
closeOnEsc: true,
536539
scrollStrategy: jasmine.any(AbsoluteScrollStrategy) as any,
537540
excludePositionTarget: true
538541
};
@@ -591,6 +594,7 @@ describe('IgxToggle', () => {
591594
positionStrategy: jasmine.any(ConnectedPositioningStrategy) as any,
592595
closeOnOutsideClick: true,
593596
modal: false,
597+
closeOnEsc: true,
594598
scrollStrategy: jasmine.any(AbsoluteScrollStrategy) as any,
595599
outlet: jasmine.any(IgxOverlayOutletDirective) as any,
596600
excludePositionTarget: true

0 commit comments

Comments
 (0)