Skip to content

Commit e14cad8

Browse files
ChronosSFChronosSF
authored
Merge branch '9.1.x' into dkamburov/fix-7483-9.1.x
2 parents 25de1da + 65bfe7f commit e14cad8

File tree

9 files changed

+110
-32
lines changed

9 files changed

+110
-32
lines changed

‎projects/igniteui-angular/src/lib/calendar/calendar-base.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -379,7 +379,7 @@ export class IgxCalendarBaseDirective implements ControlValueAccessor {
379379
const result = [];
380380
start = this.getDateOnly(start);
381381
end = this.getDateOnly(end);
382-
while (start.getTime() !== end.getTime()) {
382+
while (start.getTime() < end.getTime()) {
383383
start = this.calendarModel.timedelta(start, 'day', 1);
384384
result.push(start);
385385
}

‎projects/igniteui-angular/src/lib/core/styles/base/utilities/_functions.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -276,12 +276,12 @@
276276
/// @param {Color} $color - The base color used to generate the palette.
277277
/// @param {Map} $shades - A map of variations as keys and opacities as values.
278278
/// Based on the Material color system.
279-
/// @returns {Map} - A map consisting of 10 grayscale color variations and 10
279+
/// @returns {Map} - A map consisting of 10 color variations and 10
280280
/// text contrast colors for each variation.
281281
@function grayscale-palette($color, $shades) {
282282
$result: ();
283283
@each $saturation, $opacity in $shades {
284-
$shade: rgba(grayscale($color), $opacity);
284+
$shade: rgba($color, $opacity);
285285
$result: map-merge($result, ($saturation: $shade));
286286
}
287287
@return $result;
@@ -297,7 +297,7 @@
297297
/// @param {Color} $success [#4eb862] - The success color used throughout the application.
298298
/// @param {Color} $warn [#fbb13c] - The warning color used throughout the application.
299299
/// @param {Color} $error [#ff134a] - The error color used throughout the application.
300-
/// @param {Color} $grays [#000 | $igx-foreground-color] - The color used for generating the grayscale palette.
300+
/// @param {Color} $grays [#000 | $igx-foreground-color] - The color used for generating the grays palette.
301301
/// @param {Color} $surface [#fff] - The color used as a background in components, such as cards, sheets, and menus.
302302
/// @returns {Map} - A map consisting of 74 color variations, including the `primary`, `secondary`, `grays`,
303303
/// `info`, `success`, `warn`, and `error` colors.

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

Lines changed: 44 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { IgxDateRangePickerComponent } from './date-range-picker.component';
21
import { ComponentFixture, async, TestBed, fakeAsync, tick } from '@angular/core/testing';
32
import { Component, OnInit, ViewChild, DebugElement } from '@angular/core';
43
import { IgxInputGroupModule } from '../input-group/public_api';
@@ -13,6 +12,8 @@ import { configureTestSuite } from '../test-utils/configure-suite';
1312
import { HelperTestFunctions } from '../calendar/calendar-helper-utils';
1413
import { IgxDateTimeEditorModule } from '../directives/date-time-editor/public_api';
1514
import { DateRangeType } from '../core/dates';
15+
import { IgxDateRangePickerComponent, IgxDateRangeEndComponent } from './public_api';
16+
import { IgxIconModule } from '../icon/public_api';
1617

1718
// The number of milliseconds in one day
1819
const ONE_DAY = 1000 * 60 * 60 * 24;
@@ -494,7 +495,8 @@ describe('IgxDateRangePicker', () => {
494495
DateRangeTwoInputsTestComponent,
495496
DateRangeTwoInputsNgModelTestComponent
496497
],
497-
imports: [IgxDateRangePickerModule, IgxDateTimeEditorModule, IgxInputGroupModule, FormsModule, NoopAnimationsModule]
498+
imports: [IgxDateRangePickerModule, IgxDateTimeEditorModule,
499+
IgxInputGroupModule, FormsModule, NoopAnimationsModule, IgxIconModule]
498500
})
499501
.compileComponents();
500502
}));
@@ -633,6 +635,43 @@ describe('IgxDateRangePicker', () => {
633635
}));
634636
});
635637

638+
it('should focus the last focused input after the calendar closes - dropdown', fakeAsync(() => {
639+
fixture.componentInstance.mode = InteractionMode.DropDown;
640+
fixture.detectChanges();
641+
642+
endInput = fixture.debugElement.queryAll(By.css('.igx-input-group'))[1];
643+
UIInteractions.simulateClickAndSelectEvent(endInput.nativeElement);
644+
645+
UIInteractions.triggerEventHandlerKeyDown('ArrowDown', endInput, true);
646+
tick();
647+
fixture.detectChanges();
648+
649+
UIInteractions.triggerEventHandlerKeyDown('Escape', calendar);
650+
fixture.detectChanges();
651+
tick(100);
652+
653+
expect(fixture.componentInstance.dateRange.projectedInputs
654+
.find(i => i instanceof IgxDateRangeEndComponent).isFocused)
655+
.toBeTruthy();
656+
}));
657+
658+
it('should focus the last focused input after the calendar closes - dialog', fakeAsync(() => {
659+
endInput = fixture.debugElement.queryAll(By.css('.igx-input-group'))[1];
660+
UIInteractions.simulateClickAndSelectEvent(endInput.nativeElement);
661+
662+
UIInteractions.triggerEventHandlerKeyDown('ArrowDown', endInput, true);
663+
tick();
664+
fixture.detectChanges();
665+
666+
UIInteractions.triggerEventHandlerKeyDown('Escape', calendar);
667+
fixture.detectChanges();
668+
tick(100);
669+
670+
expect(fixture.componentInstance.dateRange.projectedInputs
671+
.find(i => i instanceof IgxDateRangeEndComponent).isFocused)
672+
.toBeTruthy();
673+
}));
674+
636675
describe('Data binding', () => {
637676
it('should properly update component value with ngModel bound to projected inputs - #7353', fakeAsync(() => {
638677
fixture = TestBed.createComponent(DateRangeTwoInputsNgModelTestComponent);
@@ -822,6 +861,9 @@ export class DateRangeTestComponent implements OnInit {
822861
template: `
823862
<igx-date-range-picker [mode]="mode" [(ngModel)]="range" required>
824863
<igx-date-range-start>
864+
<igx-picker-toggle igxPrefix>
865+
<igx-icon>calendar_view_day</igx-icon>
866+
</igx-picker-toggle>
825867
<input igxInput igxDateTimeEditor type="text">
826868
</igx-date-range-start>
827869
<igx-date-range-end>

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

Lines changed: 21 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -415,12 +415,13 @@ export class IgxDateRangePickerComponent extends DisplayDensityBase
415415
private _value: DateRange;
416416
private _collapsed = true;
417417
private _ngControl: NgControl;
418-
private _statusChanges$: Subscription;
419418
private $destroy = new Subject();
419+
private _statusChanges$: Subscription;
420+
private $toggleClickNotifier = new Subject();
420421
private _minValue: Date | string;
421422
private _maxValue: Date | string;
422-
private $toggleClickNotifier = new Subject();
423423
private _positionSettings: PositionSettings;
424+
private _focusedInput: IgxDateRangeInputsBaseComponent;
424425
private _dialogOverlaySettings: OverlaySettings = {
425426
closeOnOutsideClick: true,
426427
modal: true
@@ -620,6 +621,7 @@ export class IgxDateRangePickerComponent extends DisplayDensityBase
620621
this.subscribeToDateEditorEvents();
621622
this.configPositionStrategy();
622623
this.configOverlaySettings();
624+
this.cacheFocusedInput();
623625
this.attachOnTouched();
624626

625627
const subsToClicked = () => {
@@ -688,7 +690,13 @@ export class IgxDateRangePickerComponent extends DisplayDensityBase
688690
this.updateValidityOnBlur();
689691
} else {
690692
// input click
691-
this.focusInput();
693+
if (this.hasProjectedInputs && this._focusedInput) {
694+
this._focusedInput.setFocus();
695+
this._focusedInput = null;
696+
}
697+
if (this.inputDirective) {
698+
this.inputDirective.focus();
699+
}
692700
}
693701
}
694702

@@ -715,15 +723,6 @@ export class IgxDateRangePickerComponent extends DisplayDensityBase
715723
}
716724
}
717725

718-
private focusInput() {
719-
// TODO: should we always focus start input?
720-
(this.projectedInputs
721-
.find(i => i instanceof IgxDateRangeStartComponent) as IgxDateRangeStartComponent)?.setFocus();
722-
if (this.inputDirective) {
723-
this.inputDirective.focus();
724-
}
725-
}
726-
727726
/** @hidden @internal */
728727
public handleClosed(): void {
729728
this._collapsed = true;
@@ -901,6 +900,16 @@ export class IgxDateRangePickerComponent extends DisplayDensityBase
901900
}
902901
}
903902

903+
private cacheFocusedInput(): void {
904+
if (this.hasProjectedInputs) {
905+
this.projectedInputs.forEach(i => {
906+
fromEvent(i.dateTimeEditor.nativeElement, 'focus')
907+
.pipe(takeUntil(this.$destroy))
908+
.subscribe(() => this._focusedInput = i);
909+
});
910+
}
911+
}
912+
904913
private configPositionStrategy(): void {
905914
this._positionSettings = {
906915
openAnimation: fadeIn,

‎projects/igniteui-angular/src/lib/grids/api.service.ts‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -546,10 +546,6 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
546546
return false;
547547
}
548548

549-
public atInexistingPage(): boolean {
550-
return this.grid.totalPages - 1 > this.grid.page;
551-
}
552-
553549
public get_row_expansion_state(record: any): boolean {
554550
const grid = this.grid;
555551
const states = grid.expansionStates;

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

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -211,7 +211,7 @@ export class IgxFilteringService implements OnDestroy {
211211
}
212212

213213
/**
214-
* Clear the filter of a given column.
214+
* Clears the filter of a given column if name is provided. Otherwise clears the filters of all columns.
215215
*/
216216
public clearFilter(field: string): void {
217217
if (field) {
@@ -231,6 +231,11 @@ export class IgxFilteringService implements OnDestroy {
231231
if (field) {
232232
const expressions = this.getExpressions(field);
233233
expressions.length = 0;
234+
} else {
235+
this.grid.columns.forEach(c => {
236+
const expressions = this.getExpressions(c.field);
237+
expressions.length = 0;
238+
});
234239
}
235240

236241
this.isFiltering = false;

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

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2861,12 +2861,6 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
28612861
this.summaryService.clearSummaryCache();
28622862
this._pipeTrigger++;
28632863
this.notifyChanges();
2864-
if (this.transactions.getAggregatedChanges(false).length === 0) {
2865-
// Needs better check, calling 'transactions.clear()' will also trigger this
2866-
if (this.gridAPI.atInexistingPage()) {
2867-
this.page--;
2868-
}
2869-
}
28702864
});
28712865

28722866
this.resizeNotify.pipe(destructor, filter(() => !this._init), throttleTime(100, undefined, {leading: true, trailing: true}))

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

Lines changed: 34 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2068,6 +2068,40 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => {
20682068
expect(chipDiv.classList.contains('igx-chip__item--selected')).toBe(false, 'chip is not committed');
20692069
expect(input.value).toBe('', 'input value is present and not committed');
20702070
}));
2071+
2072+
it('should not retain expression values in cell filter after calling grid clearFilter() method.', fakeAsync(() => {
2073+
// Click on 'ProductName' filter chip
2074+
GridFunctions.clickFilterCellChipUI(fix, 'ProductName');
2075+
fix.detectChanges();
2076+
2077+
// Enter expression
2078+
GridFunctions.typeValueInFilterRowInput('NetAdvantage', fix);
2079+
tick(DEBOUNCETIME);
2080+
GridFunctions.closeFilterRow(fix);
2081+
fix.detectChanges();
2082+
2083+
// Verify filtered data
2084+
expect(grid.filteredData.length).toEqual(1);
2085+
2086+
// Clear filters of all columns
2087+
grid.clearFilter();
2088+
fix.detectChanges();
2089+
2090+
// Verify filtered data
2091+
expect(grid.filteredData).toBeNull();
2092+
2093+
// Click on 'ProductName' filter chip
2094+
GridFunctions.clickFilterCellChipUI(fix, 'ProductName');
2095+
fix.detectChanges();
2096+
2097+
// Verify there are no chips since we cleared all filters
2098+
const filteringRow = fix.debugElement.query(By.directive(IgxGridFilteringRowComponent));
2099+
const conditionChips = filteringRow.queryAll(By.directive(IgxChipComponent));
2100+
expect(conditionChips.length).toBe(0);
2101+
2102+
// Verify filtered data
2103+
expect(grid.filteredData).toBeNull();
2104+
}));
20712105
});
20722106

20732107
describe('Integration scenarios', () => {
@@ -2373,8 +2407,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => {
23732407
expect(colOperands[0].nativeElement.innerText).toEqual('AND');
23742408
expect(colIndicator.length).toEqual(0);
23752409
}));
2376-
2377-
23782410
});
23792411

23802412
describe(null, () => {

‎src/app/grid-row-edit/grid-row-edit-sample.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ <h4>Cancel Grid Edit Events</h4>
9191
</div>
9292
<app-grid-with-transactions>
9393
<igx-grid #gridRowEditTransaction [data]="data" [primaryKey]="'ProductID'" width="900px" height="700px"
94-
[rowEditable]="true" [paging]="true" [perPage]="10" (onRowEdit)="rowEditDone($event)"
94+
[rowEditable]="true" [paging]="true" [perPage]="5" (onRowEdit)="rowEditDone($event)"
9595
(onRowEditCancel)="rowEditCancel($event)" (onRowEditEnter)="rowEditEnter($event)"
9696
(onCellEditEnter)="cellEnterEditMode($event)" (onCellEdit)="cellEditDone($event)"
9797
(onCellEditCancel)="cellEditCancel($event)">

0 commit comments

Comments
 (0)