Skip to content

Commit f5e0800

Browse files
simeonoffsimeonoff
committed
Merge branch 'master' into simeonoff/scoped-styles
2 parents f17e8d4 + cc47e51 commit f5e0800

File tree

11 files changed

+158
-69
lines changed

11 files changed

+158
-69
lines changed

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

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Component, ViewChild, TemplateRef } from '@angular/core';
1+
import { Component, ViewChild, TemplateRef, ChangeDetectionStrategy } from '@angular/core';
22
import { TestBed, fakeAsync, tick, waitForAsync } from '@angular/core/testing';
33
import { By } from '@angular/platform-browser';
44
import {
@@ -1143,7 +1143,8 @@ class CarouselTestComponent {
11431143
<igx-slide><h3>Slide4</h3></igx-slide>
11441144
</igx-carousel>
11451145
`,
1146-
imports: [IgxCarouselComponent, IgxSlideComponent]
1146+
imports: [IgxCarouselComponent, IgxSlideComponent],
1147+
changeDetection: ChangeDetectionStrategy.OnPush
11471148
})
11481149
class CarouselAnimationsComponent {
11491150
@ViewChild('carousel', { static: true }) public carousel: IgxCarouselComponent;
@@ -1224,7 +1225,7 @@ class CarouselTemplateSetInTypescriptTestComponent {
12241225
@Component({
12251226
template: `
12261227
<igx-carousel #carousel [loop]="loop" [animationType]="'none'">
1227-
@for (slide of slides; track slide) {
1228+
@for (slide of slides; track slide.text) {
12281229
<igx-slide [active]="slide.active">
12291230
<igx-slide><h3>{{slide.text}}</h3></igx-slide>
12301231
</igx-slide>
@@ -1240,10 +1241,6 @@ class CarouselDynamicSlidesComponent {
12401241
public slides = [];
12411242

12421243
constructor() {
1243-
this.addNewSlide();
1244-
}
1245-
1246-
public addNewSlide() {
12471244
this.slides.push(
12481245
{ text: 'Slide 1', active: false },
12491246
{ text: 'Slide 2', active: false },

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1048,6 +1048,7 @@ export class IgxCarouselComponent extends IgxCarouselComponentBase implements On
10481048
}
10491049
this.slideChanged.emit({ carousel: this, slide });
10501050
this.restartInterval();
1051+
this.cdr.markForCheck();
10511052
}
10521053
}
10531054

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

Lines changed: 17 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -380,14 +380,17 @@
380380
} @else {
381381
min-height: 100% !important;
382382
}
383+
383384
transition: color $transition-timing, background $transition-timing;
384385

385-
@if $material-theme {
386-
padding-inline: pad-inline(rem(12px), rem(14px), rem(16px));
387-
} @else if $indigo-theme {
388-
padding-inline: pad-inline(rem(2px), rem(4px), rem(6px));
389-
} @else {
390-
padding-inline: pad-inline(rem(8px), rem(12px), rem(16px));
386+
&:not(:empty) {
387+
@if $material-theme {
388+
padding-inline: pad-inline(rem(12px), rem(14px), rem(16px));
389+
} @else if $indigo-theme {
390+
padding-inline: pad-inline(rem(2px), rem(4px), rem(6px));
391+
} @else {
392+
padding-inline: pad-inline(rem(8px), rem(12px), rem(16px));
393+
}
391394
}
392395
}
393396

@@ -816,16 +819,16 @@
816819
%form-group-bundle-start {
817820
border-color: var-get($theme, 'hover-border-color');
818821
}
819-
822+
820823
%igx-input-group__filler {
821824
border-color: var-get($theme, 'hover-border-color');
822825
}
823-
826+
824827
%igx-input-group__notch {
825828
border-block-start-color: var-get($theme, 'hover-border-color');
826829
border-block-end-color: var-get($theme, 'hover-border-color');
827830
}
828-
831+
829832
%form-group-bundle-end {
830833
border-color: var-get($theme, 'hover-border-color');
831834
}
@@ -1009,8 +1012,8 @@
10091012
}
10101013

10111014
%form-group-label--focused-border:not(:is(
1012-
%form-group-border--error,
1013-
%form-group-border--warning,
1015+
%form-group-border--error,
1016+
%form-group-border--warning,
10141017
%form-group-border--success))
10151018
{
10161019
&:hover {
@@ -1887,7 +1890,9 @@
18871890
%form-group-suffix-fluent,
18881891
%form-group-prefix-fluent-search,
18891892
%form-group-suffix-fluent-search {
1890-
padding-inline: pad-inline(rem(8px), rem(12px), rem(16px));
1893+
&:not(:empty) {
1894+
padding-inline: pad-inline(rem(8px), rem(12px), rem(16px));
1895+
}
18911896
}
18921897

18931898
%fluent-upload-button {

‎projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.spec.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2183,13 +2183,13 @@ class TestDragDropStrategiesComponent extends TestDragDropLinkedSingleComponent
21832183
<igx-icon igxDragHandle>drag_indicator</igx-icon>
21842184
<span>Movies list</span>
21852185
</div>
2186-
@for (category of categoriesNotes; track category) {
2186+
@for (category of categoriesNotes; track category.text) {
21872187
<div class="movieListItem" igxDrag [ghost]="false">
21882188
<div>
21892189
<igx-icon igxDragHandle>drag_indicator</igx-icon>
21902190
<span>{{category.text}}</span>
21912191
</div>
2192-
@for (note of getCategoryMovies(category.text); track note) {
2192+
@for (note of getCategoryMovies(category.text); track note.text) {
21932193
<div class="movieListItem" igxDrag [ghost]="false">
21942194
<div>
21952195
<igx-icon igxDragHandle>drag_indicator</igx-icon>
@@ -2204,11 +2204,11 @@ class TestDragDropStrategiesComponent extends TestDragDropLinkedSingleComponent
22042204
imports: [IgxIconComponent, IgxDragDirective, IgxDragHandleDirective]
22052205
})
22062206
class TestDragDropNestedComponent extends TestDragDropComponent {
2207-
public categoriesNotes = [
2207+
protected categoriesNotes = [
22082208
{ text: 'Action', dragged: false },
22092209
{ text: 'Fantasy', dragged: false }
22102210
];
2211-
public listNotes = [
2211+
protected listNotes = [
22122212
{ text: 'Avengers: Endgame', category: 'Action', dragged: false },
22132213
{ text: 'Avatar', category: 'Fantasy', dragged: false },
22142214
{ text: 'Titanic', category: 'Drama', dragged: false },
@@ -2218,7 +2218,7 @@ class TestDragDropNestedComponent extends TestDragDropComponent {
22182218
{ text: 'The Avengers', category: 'Action', dragged: false }
22192219
];
22202220

2221-
public getCategoryMovies(inCategory: string){
2221+
protected getCategoryMovies(inCategory: string){
22222222
return this.listNotes.filter(item => item.category === inCategory);
22232223
}
22242224
}

‎projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-search.component.html‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,16 +9,16 @@
99
(keydown)="onInputKeyDown($event)"
1010
[placeholder]="esf.column?.grid.resourceStrings.igx_grid_excel_search_placeholder"
1111
autocomplete="off"/>
12-
<igx-suffix>
1312
@if (searchValue || searchValue === 0) {
14-
<igx-icon
15-
family="default"
16-
name="input_clear"
17-
(click)="clearInput()"
18-
tabindex="0">
19-
</igx-icon>
13+
<igx-suffix>
14+
<igx-icon
15+
family="default"
16+
name="input_clear"
17+
(click)="clearInput()"
18+
tabindex="0">
19+
</igx-icon>
20+
</igx-suffix>
2021
}
21-
</igx-suffix>
2222
</igx-input-group>
2323

2424
@if (!isHierarchical()) {

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

Lines changed: 64 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,13 @@ import {
1515
IgxGridAdvancedFilteringComponent,
1616
IgxGridExternalAdvancedFilteringComponent,
1717
IgxGridAdvancedFilteringBindingComponent,
18-
IgxGridAdvancedFilteringDynamicColumnsComponent
18+
IgxGridAdvancedFilteringDynamicColumnsComponent,
19+
IgxGridAdvancedFilteringWithToolbarComponent
1920
} from '../../test-utils/grid-samples.spec';
2021
import { FormattedValuesFilteringStrategy } from '../../data-operations/filtering-strategy';
2122
import { IgxHierGridExternalAdvancedFilteringComponent } from '../../test-utils/hierarchical-grid-components.spec';
2223
import { IgxHierarchicalGridComponent } from '../hierarchical-grid/public_api';
23-
import { IFilteringEventArgs } from '../public_api';
24+
import { IFilteringEventArgs, IgxGridToolbarAdvancedFilteringComponent } from '../public_api';
2425
import { SampleTestData } from '../../test-utils/sample-test-data.spec';
2526
import { QueryBuilderFunctions } from '../../query-builder/query-builder-functions.spec';
2627
import { By } from '@angular/platform-browser';
@@ -37,7 +38,8 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
3738
IgxGridExternalAdvancedFilteringComponent,
3839
IgxGridAdvancedFilteringBindingComponent,
3940
IgxHierGridExternalAdvancedFilteringComponent,
40-
IgxGridAdvancedFilteringDynamicColumnsComponent
41+
IgxGridAdvancedFilteringDynamicColumnsComponent,
42+
IgxGridAdvancedFilteringWithToolbarComponent
4143
]
4244
});
4345
}));
@@ -1194,6 +1196,65 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
11941196
}));
11951197
});
11961198

1199+
describe('Advanced filtering with toolbar', () => {
1200+
let fix: ComponentFixture<IgxGridAdvancedFilteringWithToolbarComponent>;
1201+
let grid: IgxGridComponent;
1202+
1203+
beforeEach(fakeAsync(() => {
1204+
fix = TestBed.createComponent(IgxGridAdvancedFilteringWithToolbarComponent);
1205+
grid = fix.componentInstance.grid;
1206+
fix.detectChanges();
1207+
}));
1208+
1209+
it('Should update toolbar when advancedFilteringExpressionsTreeChange emits a new value', fakeAsync(() => {
1210+
// Set initial filtering expressions tree
1211+
const tree = new FilteringExpressionsTree(FilteringLogic.And);
1212+
tree.filteringOperands.push({
1213+
fieldName: 'ProductName',
1214+
condition: IgxStringFilteringOperand.instance().condition('contains'),
1215+
searchVal: 'angular',
1216+
ignoreCase: true
1217+
});
1218+
1219+
// Apply the initial filtering tree
1220+
grid.advancedFilteringExpressionsTree = tree;
1221+
fix.detectChanges();
1222+
1223+
// Create a new filtering tree with more filters
1224+
const updatedTree = new FilteringExpressionsTree(FilteringLogic.And);
1225+
updatedTree.filteringOperands.push({
1226+
fieldName: 'Downloads',
1227+
condition: IgxStringFilteringOperand.instance().condition('equals'),
1228+
searchVal: 10,
1229+
ignoreCase: true
1230+
});
1231+
updatedTree.filteringOperands.push({
1232+
fieldName: 'ProductName',
1233+
condition: IgxStringFilteringOperand.instance().condition('contains'),
1234+
searchVal: 'angular',
1235+
ignoreCase: true
1236+
});
1237+
updatedTree.filteringOperands.push({
1238+
fieldName: 'Category',
1239+
condition: IgxStringFilteringOperand.instance().condition('equals'),
1240+
searchVal: 'electronics',
1241+
ignoreCase: false
1242+
});
1243+
1244+
// Update the filtering expressions tree
1245+
grid.advancedFilteringExpressionsTree = updatedTree;
1246+
fix.detectChanges();
1247+
1248+
// Verify the correct number of filters
1249+
const toolbarDebugElement = fix.debugElement.query(By.directive(IgxGridToolbarAdvancedFilteringComponent));
1250+
const toolbarComponent = toolbarDebugElement.componentInstance as IgxGridToolbarAdvancedFilteringComponent;
1251+
const numberOfFilters = (toolbarComponent as any).numberOfColumns;
1252+
1253+
expect(grid.advancedFilteringExpressionsTree.filteringOperands.length).toEqual(3);
1254+
expect(numberOfFilters).toEqual(3);
1255+
}));
1256+
})
1257+
11971258
describe('Localization - ', () => {
11981259
it('Should correctly change resource strings for Advanced Filtering dialog.', fakeAsync(() => {
11991260
const fix = TestBed.createComponent(IgxGridAdvancedFilteringComponent);

‎projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.ts‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { AfterViewInit, Component, Inject, Input } from '@angular/core';
1+
import { AfterViewInit, Component, Inject, Input, OnInit } from '@angular/core';
22
import { IgxToolbarToken } from './token';
33
import { OverlaySettings } from '../../services/overlay/utilities';
44
import { IgxIconComponent } from '../../icon/icon.component';
@@ -31,7 +31,7 @@ import { isTree } from '../../data-operations/expressions-tree-util';
3131
templateUrl: './grid-toolbar-advanced-filtering.component.html',
3232
imports: [IgxButtonDirective, IgxRippleDirective, IgxIconComponent]
3333
})
34-
export class IgxGridToolbarAdvancedFilteringComponent implements AfterViewInit {
34+
export class IgxGridToolbarAdvancedFilteringComponent implements OnInit {
3535
protected numberOfColumns: number;
3636
/**
3737
* Returns the grid containing this component.
@@ -44,17 +44,19 @@ export class IgxGridToolbarAdvancedFilteringComponent implements AfterViewInit {
4444
@Input()
4545
public overlaySettings: OverlaySettings;
4646

47-
constructor( @Inject(IgxToolbarToken) private toolbar: IgxToolbarToken) {
48-
this.grid?.advancedFilteringExpressionsTreeChange.subscribe(filteringTree => {
49-
this.numberOfColumns = this.extractUniqueFieldNamesFromFilterTree(filteringTree).length;
50-
});
51-
}
47+
constructor( @Inject(IgxToolbarToken) private toolbar: IgxToolbarToken) { }
5248

5349
/**
5450
* @hidden
5551
*/
56-
public ngAfterViewInit(): void {
52+
public ngOnInit(): void {
53+
// Initial value
5754
this.numberOfColumns = this.grid?.advancedFilteringExpressionsTree ? this.extractUniqueFieldNamesFromFilterTree(this.grid?.advancedFilteringExpressionsTree).length : 0;
55+
56+
// Subscribing for future updates
57+
this.grid?.advancedFilteringExpressionsTreeChange.subscribe(filteringTree => {
58+
this.numberOfColumns = this.extractUniqueFieldNamesFromFilterTree(filteringTree).length;
59+
});
5860
}
5961

6062
protected extractUniqueFieldNamesFromFilterTree(filteringTree?: IFilteringExpressionsTree) : string[] {

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3053,7 +3053,7 @@ class IgxSelectTemplateFormComponent {
30533053
<igx-icon>alarm</igx-icon>
30543054
</igx-prefix>
30553055
<igx-select-item>None</igx-select-item>
3056-
@for (item of items; track item) {
3056+
@for (item of items; track item.field) {
30573057
<igx-select-item [value]="item.field">
30583058
{{ item.field }}
30593059
</igx-select-item>

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -493,7 +493,7 @@ describe('IgxTabs', () => {
493493
expect(tabs.items.length).toBe(2);
494494
expect(tabs.selectedIndex).toBe(0);
495495

496-
fixture.componentInstance.addTab(3);
496+
fixture.componentInstance.addTab();
497497
fixture.detectChanges();
498498
tick(100);
499499

‎projects/igniteui-angular/src/lib/test-utils/grid-samples.spec.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1121,6 +1121,29 @@ export class IgxGridAdvancedFilteringComponent extends BasicGridComponent {
11211121
}
11221122
}
11231123

1124+
@Component({
1125+
template: `<igx-grid [data]="data" height="500px" [allowAdvancedFiltering]="false">
1126+
<igx-grid-toolbar >
1127+
<igx-grid-toolbar-actions>
1128+
<igx-grid-toolbar-advanced-filtering>Really advanced filtering</igx-grid-toolbar-advanced-filtering>
1129+
</igx-grid-toolbar-actions>
1130+
</igx-grid-toolbar>
1131+
<igx-column width="100px" [field]="'ID'" [header]="'HeaderID'" [hasSummary]="true"></igx-column>
1132+
<igx-column width="100px" [field]="'ProductName'" dataType="string"></igx-column>
1133+
<igx-column width="100px" [field]="'Downloads'" dataType="number" [hasSummary]="true"></igx-column>
1134+
<igx-column width="100px" [field]="'Released'" dataType="boolean"></igx-column>
1135+
<igx-column width="100px" [field]="'ReleaseDate'" dataType="date" headerClasses="header-release-date"></igx-column>
1136+
<igx-column width="100px" [field]="'AnotherField'" [header]="'Another Field'" dataType="string" [filters]="customFilter">
1137+
<igx-column width="100px" [field]="'ReleaseTime'" dataType="time"></igx-column>
1138+
</igx-column>
1139+
</igx-grid>`,
1140+
imports: [IgxGridComponent, IgxColumnComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent]
1141+
})
1142+
export class IgxGridAdvancedFilteringWithToolbarComponent extends BasicGridComponent {
1143+
public customFilter = CustomFilter.instance();
1144+
public override data = SampleTestData.excelFilteringData();
1145+
}
1146+
11241147
@Component({
11251148
template: `<igx-grid [data]="data" height="500px" [allowAdvancedFiltering]="true">
11261149
<igx-grid-toolbar></igx-grid-toolbar>

0 commit comments

Comments
 (0)