Skip to content

Commit dcfad33

Browse files
authored
Merge branch 'master' into tzhelev/gridSearch-exactMatch
2 parents eb42587 + 8bf832e commit dcfad33

18 files changed

+358
-297
lines changed

projects/igniteui-angular/src/lib/chips/chip.component.ts

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -297,18 +297,15 @@ export class IgxChipComponent implements AfterViewInit {
297297
* }
298298
* ```
299299
*/
300+
@Input()
300301
public get selected() {
301302
return this._selected;
302303
}
303304

304305
/**
305306
* Sets the `IgxChipComponent` to be selected.
306-
* ```typescript
307-
* @ViewChild('myChip')
308-
* public chip: IgxChipComponent;
309-
* ngAfterViewInit(){
310-
* this.chip.selected = true;
311-
* }
307+
* ```html
308+
* <igx-chip #myChip [id]="'igx-chip-1'" [selectable]="true" [selected]="true">
312309
* ```
313310
*/
314311
public set selected(newValue: boolean) {

projects/igniteui-angular/src/lib/chips/chips-area.spec.ts

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,24 @@ class TestChipComponent {
3737
public chips: QueryList<IgxChipComponent>;
3838
}
3939

40+
@Component({
41+
template: `
42+
<igx-chips-area #chipsArea>
43+
<igx-chip #chipElem [id]="1" [draggable]="true" [removable]="true" [selectable]="true" [selected]="true">
44+
<span #label [class]="'igx-chip__text'">first chip</span>
45+
</igx-chip>
46+
<igx-chip #chipElem [id]="2" [draggable]="false" [removable]="false" [selectable]="false" [selected]="true">
47+
<span #label [class]="'igx-chip__text'">second chip</span>
48+
</igx-chip>
49+
<igx-chip #chipElem [id]="3" [draggable]="true" [removable]="true" [selectable]="true" [selected]="false">
50+
<span #label [class]="'igx-chip__text'">third chip</span>
51+
</igx-chip>
52+
</igx-chips-area>
53+
`
54+
})
55+
class TestChipSelectComponent extends TestChipComponent {
56+
}
57+
4058
@Component({
4159
template:
4260
`
@@ -108,7 +126,8 @@ describe('IgxChipsArea', () => {
108126
TestBed.configureTestingModule({
109127
declarations: [
110128
TestChipComponent,
111-
TestChipReorderComponent
129+
TestChipReorderComponent,
130+
TestChipSelectComponent
112131
],
113132
imports: [FormsModule, IgxIconModule, IgxChipsModule]
114133
}).compileComponents();
@@ -555,6 +574,19 @@ describe('IgxChipsArea', () => {
555574
});
556575
});
557576

577+
it('should be able to select chip using input property', () => {
578+
const fix = TestBed.createComponent(TestChipSelectComponent);
579+
fix.detectChanges();
580+
581+
const firstChipComp = fix.componentInstance.chips.toArray()[0];
582+
const secondChipComp = fix.componentInstance.chips.toArray()[1];
583+
const thirdChipComp = fix.componentInstance.chips.toArray()[2];
584+
585+
expect(firstChipComp.selected).toBe(true);
586+
expect(secondChipComp.selected).toBe(true);
587+
expect(thirdChipComp.selected).toBe(false);
588+
});
589+
558590
it('should be able to select chip using api when selectable is set to false', () => {
559591
const fix = TestBed.createComponent(TestChipComponent);
560592
fix.detectChanges();

projects/igniteui-angular/src/lib/combo/combo.component.spec.ts

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1481,6 +1481,27 @@ describe('igxCombo', () => {
14811481
expectedOutput += ', ' + combo.data[9];
14821482
expect(inputElement.value).toEqual(expectedOutput);
14831483
}));
1484+
1485+
it('Should properly handle selection manipulation through onSelectionChange emit', fakeAsync(() => {
1486+
const fixture = TestBed.createComponent(IgxComboSampleComponent);
1487+
fixture.detectChanges();
1488+
const combo = fixture.componentInstance.combo;
1489+
// override selection
1490+
fixture.componentInstance.onSelectionChange = (event) => {
1491+
event.newSelection = [];
1492+
};
1493+
combo.toggle();
1494+
tick();
1495+
// No items are initially selected
1496+
expect(combo.selectedItems()).toEqual([]);
1497+
// Select the first 5 items
1498+
combo.selectItems(fixture.componentInstance.initData.splice(0, 5));
1499+
tick();
1500+
fixture.detectChanges();
1501+
tick();
1502+
// onSelectionChange fires and overrides the selection to be [];
1503+
expect(combo.selectedItems()).toEqual([]);
1504+
}));
14841505
});
14851506

14861507
describe('Rendering tests: ', () => {
@@ -3057,7 +3078,8 @@ class IgxComboScrollTestComponent {
30573078
@Component({
30583079
template: `
30593080
<igx-combo #combo [placeholder]="'Location'" [data]='items'
3060-
[filterable]='true' [valueKey]="'field'" [groupKey]="'region'" [width]="'400px'" [allowCustomValues]="true">
3081+
[filterable]='true' [valueKey]="'field'" [groupKey]="'region'" [width]="'400px'"
3082+
(onSelectionChange)="onSelectionChange($event)" [allowCustomValues]="true">
30613083
<ng-template #itemTemplate let-display let-key="valueKey">
30623084
<div class="state-card--simple">
30633085
<span class="small-red-circle"></span>

projects/igniteui-angular/src/lib/combo/combo.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1065,8 +1065,8 @@ export class IgxComboComponent implements AfterViewInit, ControlValueAccessor, O
10651065
const args: IComboSelectionChangeEventArgs = { oldSelection, newSelection };
10661066
this.onSelectionChange.emit(args);
10671067
newSelectionAsSet = new Set();
1068-
for (let i = 0; i < newSelection.length; i++) {
1069-
newSelectionAsSet.add(newSelection[i]);
1068+
for (let i = 0; i < args.newSelection.length; i++) {
1069+
newSelectionAsSet.add(args.newSelection[i]);
10701070
}
10711071
this.selectionAPI.set_selection(this.id, newSelectionAsSet);
10721072
this.value = this.dataType !== DataTypes.PRIMITIVE ?

projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-component.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -240,6 +240,10 @@
240240
@extend %igx-grid__group-expand-btn !optional;
241241
}
242242

243+
@include e(filtering-outlet) {
244+
@extend %igx-grid__filtering-outlet !optional;
245+
}
246+
243247
@for $i from 1 through 10 {
244248
@include e(row-indentation, $m: level-#{$i}) {
245249
@extend %igx-grid__row-indentation--level-#{$i} !optional;

projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-theme.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1295,4 +1295,8 @@
12951295
padding-left: #{$i*map-get($grid-grouping-indicator-padding, 'compact')};
12961296
}
12971297
}
1298+
1299+
%igx-grid__filtering-outlet {
1300+
z-index: 99999;
1301+
}
12981302
}

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

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
import { Component, DebugElement } from '@angular/core';
2-
import { async, discardPeriodicTasks, fakeAsync, TestBed, tick } from '@angular/core/testing';
2+
import { async, TestBed } from '@angular/core/testing';
33
import { FormsModule } from '@angular/forms';
44
import { By } from '@angular/platform-browser';
5-
import { IgxAvatarComponent, IgxAvatarModule } from '../../avatar/avatar.component';
6-
import { IgxDragDropModule, RestrictDrag } from './dragdrop.directive';
5+
import { IgxDragDropModule } from './dragdrop.directive';
76

87
describe('IgxDrag', () => {
98

@@ -13,7 +12,6 @@ describe('IgxDrag', () => {
1312
],
1413
imports: [
1514
FormsModule,
16-
IgxAvatarModule,
1715
IgxDragDropModule
1816
]
1917
})

projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.ts

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,26 +8,104 @@ export class IgxTextSelectionDirective {
88

99
private selectionState = true;
1010

11+
/**
12+
* Returns whether the input element is selectable through the directive.
13+
*
14+
* ```typescript
15+
* // get
16+
* @ViewChild('firstName',
17+
* {read: IgxTextSelectionDirective})
18+
* public firstName: IgxTextSelectionDirective;
19+
*
20+
* public getFirstNameSelectionStatus() {
21+
* return this.firstName.selected;
22+
* }
23+
* ```
24+
*/
1125
@Input('igxTextSelection')
1226
get selected(): boolean {
1327
return this.selectionState;
1428
}
1529

30+
/**
31+
* Determines whether the input element could be selected through the directive.
32+
*
33+
*```html
34+
* <!--set-->
35+
* <input
36+
* type="text"
37+
* id="firstName"
38+
* [igxTextSelection]="true">
39+
* </input>
40+
*
41+
* <input
42+
* type="text"
43+
* id="lastName"
44+
* igxTextSelection
45+
* [selected]="true">
46+
* </input>
47+
* ```
48+
*/
1649
set selected(val: boolean) {
1750
this.selectionState = val;
1851
}
1952

53+
/**
54+
* Returns the nativeElement of the element where the directive was applied.
55+
*
56+
* ```html
57+
* <input
58+
* type="text"
59+
* id="firstName"
60+
* igxTextSelection>
61+
* </input>
62+
* ```
63+
*
64+
* ```typescript
65+
* @ViewChild('firstName',
66+
* {read: IgxTextSelectionDirective})
67+
* public inputElement: IgxTextSelectionDirective;
68+
*
69+
* public getNativeElement() {
70+
* return this.inputElement.nativeElement;
71+
* }
72+
* ```
73+
*/
2074
get nativeElement() {
2175
return this.element.nativeElement;
2276
}
2377

78+
/**
79+
* @hidden
80+
*/
2481
@HostListener('focus')
2582
onFocus() {
2683
this.trigger();
2784
}
2885

2986
constructor(private element: ElementRef) { }
3087

88+
/**
89+
* Triggers the selection of the element if it is marked as selectable.
90+
*
91+
* ```html
92+
* <input
93+
* type="text"
94+
* id="firstName"
95+
* igxTextSelection>
96+
* </input>
97+
* ```
98+
*
99+
* ```typescript
100+
* @ViewChild('firstName',
101+
* {read: IgxTextSelectionDirective})
102+
* public inputElement: IgxTextSelectionDirective;
103+
*
104+
* public triggerElementSelection() {
105+
* this.inputElement.trigger();
106+
* }
107+
* ```
108+
*/
31109
trigger() {
32110
if (this.selected && this.nativeElement.value.length) {
33111
requestAnimationFrame(() => this.nativeElement.setSelectionRange(0, this.nativeElement.value.length));

projects/igniteui-angular/src/lib/grid/api.service.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,8 @@ export class IgxGridAPIService {
9393
this.editCellState.delete(gridId);
9494
}
9595
}
96+
97+
this.get(gridId).refreshSearch();
9698
}
9799

98100

0 commit comments

Comments
 (0)