Skip to content

Commit 4d42b79

Browse files
ChronosSFChronosSF
authored
Merge branch 'master' into sstoychev/groupingstrategy-master
2 parents 6beefb4 + 45cd818 commit 4d42b79

File tree

8 files changed

+102
-29
lines changed

8 files changed

+102
-29
lines changed

‎projects/igniteui-angular/src/lib/core/styles/components/slider/_slider-theme.scss

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -340,7 +340,6 @@
340340
width: 100%;
341341
height: rem($slider-track-height);
342342
background-size: 100% em($slider-track-height);
343-
background-color: --var($theme, 'track-step-color');
344343
opacity: .85;
345344
transition: opacity .2s $ease-out-quad;
346345
z-index: 1;

‎projects/igniteui-angular/src/lib/grids/common/events.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,7 @@ export interface IRowToggleEventArgs extends IBaseEventArgs {
163163
/**
164164
* Event emitted when a row's pin state changes.
165165
*/
166-
export interface IPinRowEventArgs extends IBaseEventArgs {
166+
export interface IPinRowEventArgs extends IBaseEventArgs, CancelableEventArgs {
167167
/**
168168
* The ID of the row, that was pinned/unpinned.
169169
* ID is either the primaryKey value or the data record instance.
@@ -172,7 +172,7 @@ export interface IPinRowEventArgs extends IBaseEventArgs {
172172
row?: RowType;
173173
/** The index at which to pin the row in the pinned rows collection. */
174174
insertAtIndex?: number;
175-
/** Whether or noy the row is pinned or unpinned. */
175+
/** Whether or not the row is pinned or unpinned. */
176176
readonly isPinned: boolean;
177177
}
178178

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

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4652,10 +4652,15 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
46524652
insertAtIndex: index,
46534653
isPinned: true,
46544654
rowID,
4655-
row
4655+
row,
4656+
cancel: false
46564657
};
46574658
this.rowPinning.emit(eventArgs);
46584659

4660+
if (eventArgs.cancel) {
4661+
return;
4662+
}
4663+
46594664
this.crudService.endEdit(false);
46604665

46614666
const insertIndex = typeof eventArgs.insertAtIndex === 'number' ? eventArgs.insertAtIndex : this._pinnedRecordIDs.length;
@@ -4688,10 +4693,15 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
46884693
const eventArgs: IPinRowEventArgs = {
46894694
isPinned: false,
46904695
rowID,
4691-
row
4696+
row,
4697+
cancel: false
46924698
};
46934699
this.rowPinning.emit(eventArgs);
46944700

4701+
if (eventArgs.cancel) {
4702+
return;
4703+
}
4704+
46954705
this.crudService.endEdit(false);
46964706
this._pinnedRecordIDs.splice(index, 1);
46974707
this.pipeTrigger++;

‎projects/igniteui-angular/src/lib/grids/grid/grid-row-pinning.spec.ts

Lines changed: 61 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { TestBed, fakeAsync, tick } from '@angular/core/testing';
33
import { By } from '@angular/platform-browser';
44
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
55
import { IgxGridComponent } from './grid.component';
6-
import { IgxGridModule } from './public_api';
6+
import { IgxGridModule, IPinRowEventArgs } from './public_api';
77
import { configureTestSuite } from '../../test-utils/configure-suite';
88
import { ColumnPinningPosition, RowPinningPosition } from '../common/enums';
99
import { IPinningConfig } from '../grid.common';
@@ -164,7 +164,8 @@ describe('Row Pinning #grid', () => {
164164
rowID,
165165
insertAtIndex: 0,
166166
isPinned: true,
167-
row
167+
row,
168+
cancel: false
168169
});
169170

170171
row = grid.getRowByIndex(0);
@@ -190,7 +191,8 @@ describe('Row Pinning #grid', () => {
190191
rowID,
191192
insertAtIndex: 0,
192193
isPinned: true,
193-
row
194+
row,
195+
cancel: false
194196
});
195197

196198
row.unpin();
@@ -200,6 +202,62 @@ describe('Row Pinning #grid', () => {
200202
expect(grid.rowPinned.emit).toHaveBeenCalledTimes(2);
201203
});
202204

205+
it(`Should be able to cancel rowPinning on pin/unpin event.`, () => {
206+
spyOn(grid.rowPinning, 'emit').and.callThrough();
207+
let sub = grid.rowPinning.subscribe((e: IPinRowEventArgs) => {
208+
e.cancel = true;
209+
});
210+
211+
const row = grid.getRowByIndex(0);
212+
const rowID = row.key;
213+
expect(row.pinned).toBeFalsy();
214+
215+
row.pin();
216+
fix.detectChanges();
217+
218+
expect(grid.rowPinning.emit).toHaveBeenCalledTimes(1);
219+
expect(grid.rowPinning.emit).toHaveBeenCalledWith({
220+
insertAtIndex: 0,
221+
isPinned: true,
222+
rowID,
223+
row,
224+
cancel: true
225+
});
226+
expect(row.pinned).toBeFalsy();
227+
228+
sub.unsubscribe();
229+
230+
row.pin();
231+
fix.detectChanges();
232+
233+
expect(grid.rowPinning.emit).toHaveBeenCalledTimes(2);
234+
expect(grid.rowPinning.emit).toHaveBeenCalledWith({
235+
insertAtIndex: 0,
236+
isPinned: true,
237+
rowID,
238+
row,
239+
cancel: false
240+
});
241+
expect(row.pinned).toBe(true);
242+
243+
sub = grid.rowPinning.subscribe((e: IPinRowEventArgs) => {
244+
e.cancel = true;
245+
});
246+
247+
row.unpin();
248+
fix.detectChanges();
249+
250+
expect(grid.rowPinning.emit).toHaveBeenCalledTimes(3);
251+
expect(grid.rowPinning.emit).toHaveBeenCalledWith({
252+
isPinned: false,
253+
rowID,
254+
row,
255+
cancel: true
256+
});
257+
expect(row.pinned).toBe(true);
258+
sub.unsubscribe();
259+
});
260+
203261
it('should pin/unpin via grid API methods.', () => {
204262
// pin 2nd row
205263
grid.pinRow(fix.componentInstance.data[1]);

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

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,8 @@ import {
66
Inject,
77
Input,
88
OnDestroy,
9-
OnInit,
109
Optional
1110
} from '@angular/core';
12-
import { first } from 'rxjs/operators';
1311
import { Subscription } from 'rxjs';
1412
import { IDisplayDensityOptions, DisplayDensityToken, DisplayDensityBase } from '../../core/displayDensity';
1513
import { IgxIconService } from '../../icon/public_api';
@@ -30,7 +28,7 @@ import { GridType } from '../common/grid.interface';
3028
selector: 'igx-grid-toolbar',
3129
templateUrl: './grid-toolbar.component.html'
3230
})
33-
export class IgxGridToolbarComponent extends DisplayDensityBase implements OnInit, OnDestroy {
31+
export class IgxGridToolbarComponent extends DisplayDensityBase implements OnDestroy {
3432

3533
/**
3634
* When enabled, shows the indeterminate progress bar.
@@ -106,10 +104,6 @@ export class IgxGridToolbarComponent extends DisplayDensityBase implements OnIni
106104
return this.displayDensity === 'compact';
107105
}
108106

109-
/** @hidden @internal */
110-
@HostBinding('style.max-width.px')
111-
@HostBinding('style.flex-basis.px')
112-
public width = null;
113107

114108
protected _grid: IgxGridBaseDirective;
115109
protected sub: Subscription;
@@ -125,12 +119,6 @@ export class IgxGridToolbarComponent extends DisplayDensityBase implements OnIni
125119
this.iconService.addSvgIconFromText(unpinLeft.name, unpinLeft.value, 'imx-icons');
126120
}
127121

128-
/** @hidden @internal */
129-
public ngOnInit() {
130-
this.grid.rendered$.pipe(first()).subscribe(() => this.width = this.grid.outerWidth);
131-
this.sub = this.grid.resizeNotify.subscribe(() => this.width = this.grid.outerWidth);
132-
}
133-
134122
/** @hidden @internal */
135123
public ngOnDestroy() {
136124
this.sub?.unsubscribe();

‎projects/igniteui-angular/src/lib/icon/icon.service.ts

Lines changed: 23 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ export class IgxIconService {
105105
* this.iconService.addSvgIcon('aruba', '/assets/svg/country_flags/aruba.svg', 'svg-flags');
106106
* ```
107107
*/
108-
public addSvgIcon(name: string, url: string, family = this._family) {
108+
public addSvgIcon(name: string, url: string, family = this._family, stripMeta = false) {
109109
if (name && url) {
110110
const safeUrl = this._sanitizer.bypassSecurityTrustResourceUrl(url);
111111
if (!safeUrl) {
@@ -119,7 +119,7 @@ export class IgxIconService {
119119

120120
if (!this.isSvgIconCached(name, family)) {
121121
this.fetchSvg(url).subscribe((res) => {
122-
this.cacheSvgIcon(name, res, family);
122+
this.cacheSvgIcon(name, res, family, stripMeta);
123123
this._iconLoaded.next({ name, value: res, family });
124124
});
125125
}
@@ -135,13 +135,13 @@ export class IgxIconService {
135135
* <path d="M74 74h54v54H74" /></svg>', 'svg-flags');
136136
* ```
137137
*/
138-
public addSvgIconFromText(name: string, iconText: string, family: string = '') {
138+
public addSvgIconFromText(name: string, iconText: string, family: string = '', stripMeta = false) {
139139
if (name && iconText) {
140-
if(this.isSvgIconCached(name, family)) {
140+
if (this.isSvgIconCached(name, family)) {
141141
return;
142142
}
143143

144-
this.cacheSvgIcon(name, iconText, family);
144+
this.cacheSvgIcon(name, iconText, family, stripMeta);
145145
} else {
146146
throw new Error('You should provide at least `name` and `iconText` to register an svg icon.');
147147
}
@@ -155,7 +155,7 @@ export class IgxIconService {
155155
*/
156156
public isSvgIconCached(name: string, family: string = ''): boolean {
157157
const familyClassName = this.familyClassName(family);
158-
if(this._cachedSvgIcons.has(familyClassName)) {
158+
if (this._cachedSvgIcons.has(familyClassName)) {
159159
const familyRegistry = this._cachedSvgIcons.get(familyClassName) as Map<string, SafeHtml>;
160160
return familyRegistry.has(name);
161161
}
@@ -185,7 +185,9 @@ export class IgxIconService {
185185
/**
186186
* @hidden
187187
*/
188-
private cacheSvgIcon(name: string, value: string, family: string = '') {
188+
private cacheSvgIcon(name: string, value: string, family = this._family, stripMeta: boolean) {
189+
family = !!family ? family : this._family;
190+
189191
if (name && value) {
190192
const doc = this._domParser.parseFromString(value, 'image/svg+xml');
191193
const svg = doc.querySelector('svg') as SVGElement;
@@ -197,6 +199,20 @@ export class IgxIconService {
197199
if (svg) {
198200
svg.setAttribute('fit', '');
199201
svg.setAttribute('preserveAspectRatio', 'xMidYMid meet');
202+
203+
if (stripMeta) {
204+
const title = svg.querySelector('title');
205+
const desc = svg.querySelector('desc');
206+
207+
if (title) {
208+
svg.removeChild(title);
209+
}
210+
211+
if (desc) {
212+
svg.removeChild(desc);
213+
}
214+
}
215+
200216
const safeSvg = this._sanitizer.bypassSecurityTrustHtml(svg.outerHTML);
201217
this._cachedSvgIcons.get(family).set(name, safeSvg);
202218
}

‎src/app/icon/icon.sample.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,6 @@ export class IconSampleComponent implements OnInit {
1919
this._iconService.addSvgIcon('equals', '/assets/svg/filtering/equals.svg', 'svg-flags');
2020
this._iconService.addSvgIcon('is_empty', '/assets/svg/filtering/is_empty.svg', 'svg-flags');
2121
this._iconService.addSvgIcon('starts_with', '/assets/svg/filtering/starts_with.svg', 'svg-flags');
22-
this._iconService.addSvgIcon('copy', '/assets/svg/filtering/copy.svg');
22+
this._iconService.addSvgIcon('copy', '/assets/svg/filtering/copy.svg', '', true);
2323
}
2424
}

‎src/assets/svg/filtering/copy.svg

Lines changed: 2 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)