@progress/kendo-angular-icons 24.2.2-develop.9 → 25.0.0-develop.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/progress-kendo-angular-icons.mjs +32 -32
- package/index.d.ts +478 -11
- package/package-metadata.mjs +2 -2
- package/package.json +8 -8
- package/common/icon-base.d.ts +0 -37
- package/common/icon-settings.d.ts +0 -21
- package/common/icon-settings.service.d.ts +0 -51
- package/common/icons.service.d.ts +0 -58
- package/common/models/flip.d.ts +0 -15
- package/common/models/icon-settings.d.ts +0 -40
- package/common/models/icon-type.d.ts +0 -9
- package/common/models/index.d.ts +0 -10
- package/common/models/size.d.ts +0 -19
- package/common/models/svg-icon-variant.d.ts +0 -9
- package/common/models/theme-color.d.ts +0 -20
- package/common/util.d.ts +0 -8
- package/directives.d.ts +0 -60
- package/icon/icon.component.d.ts +0 -31
- package/icon-wrapper/icon-wrapper.component.d.ts +0 -47
- package/icon.module.d.ts +0 -29
- package/icons.module.d.ts +0 -30
- package/package-metadata.d.ts +0 -9
- package/svg-icon/svg-icon.component.d.ts +0 -60
- package/svg-icon.module.d.ts +0 -29
|
@@ -19,8 +19,8 @@ const packageMetadata = {
|
|
|
19
19
|
productName: 'Kendo UI for Angular',
|
|
20
20
|
productCode: 'KENDOUIANGULAR',
|
|
21
21
|
productCodes: ['KENDOUIANGULAR'],
|
|
22
|
-
publishDate:
|
|
23
|
-
version: '
|
|
22
|
+
publishDate: 1783679731,
|
|
23
|
+
version: '25.0.0-develop.1',
|
|
24
24
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
25
25
|
};
|
|
26
26
|
|
|
@@ -91,10 +91,10 @@ class IconBaseDirective {
|
|
|
91
91
|
this.renderer = renderer;
|
|
92
92
|
validatePackage(packageMetadata);
|
|
93
93
|
}
|
|
94
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
95
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
94
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconBaseDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
|
|
95
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: IconBaseDirective, isStandalone: true, selector: "[kendoIconBase]", inputs: { flip: "flip", themeColor: "themeColor", size: "size" }, host: { properties: { "class.k-flip-h": "this.horizontalFlip", "class.k-flip-v": "this.verticalFlip" } }, ngImport: i0 });
|
|
96
96
|
}
|
|
97
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
97
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconBaseDirective, decorators: [{
|
|
98
98
|
type: Directive,
|
|
99
99
|
args: [{
|
|
100
100
|
selector: '[kendoIconBase]'
|
|
@@ -150,10 +150,10 @@ class IconComponent extends IconBaseDirective {
|
|
|
150
150
|
this.element = element;
|
|
151
151
|
this.renderer = renderer;
|
|
152
152
|
}
|
|
153
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
154
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
153
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
154
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: IconComponent, isStandalone: true, selector: "kendo-icon", inputs: { name: "name" }, host: { properties: { "class.k-icon": "this.hostClass", "class.k-font-icon": "this.hostClass", "attr.aria-hidden": "this.hostAriaHidden" } }, exportAs: ["kendoIcon"], usesInheritance: true, ngImport: i0, template: '', isInline: true });
|
|
155
155
|
}
|
|
156
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconComponent, decorators: [{
|
|
157
157
|
type: Component,
|
|
158
158
|
args: [{
|
|
159
159
|
exportAs: 'kendoIcon',
|
|
@@ -265,15 +265,15 @@ class SVGIconComponent extends IconBaseDirective {
|
|
|
265
265
|
`);
|
|
266
266
|
}
|
|
267
267
|
}
|
|
268
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
269
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
268
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SVGIconComponent, deps: [{ token: i1_1.DomSanitizer }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
269
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SVGIconComponent, isStandalone: true, selector: "kendo-svg-icon, kendo-svgicon", inputs: { icon: "icon", variant: "variant" }, host: { properties: { "class.k-svg-icon": "this.hostClass", "class.k-icon": "this.hostClass", "attr.aria-hidden": "this.hostAriaHidden" } }, exportAs: ["kendoSVGIcon"], usesInheritance: true, ngImport: i0, template: `
|
|
270
270
|
@if (visible) {
|
|
271
271
|
<svg [style.pointerEvents]="'none'" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
272
272
|
[attr.viewBox]="icon.viewBox" [innerHTML]="content" aria-hidden="true">
|
|
273
273
|
</svg>
|
|
274
274
|
}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
275
275
|
}
|
|
276
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
276
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SVGIconComponent, decorators: [{
|
|
277
277
|
type: Component,
|
|
278
278
|
args: [{
|
|
279
279
|
exportAs: 'kendoSVGIcon',
|
|
@@ -354,10 +354,10 @@ class IconSettingsService {
|
|
|
354
354
|
getCustomFontIconClass(_key) {
|
|
355
355
|
return null;
|
|
356
356
|
}
|
|
357
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
358
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
357
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconSettingsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
358
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconSettingsService });
|
|
359
359
|
}
|
|
360
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
360
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconSettingsService, decorators: [{
|
|
361
361
|
type: Injectable
|
|
362
362
|
}] });
|
|
363
363
|
|
|
@@ -444,10 +444,10 @@ class IconsService {
|
|
|
444
444
|
const customClass = this.iconSettingsService && this.iconSettingsService.getCustomFontIconClass(key);
|
|
445
445
|
return customClass;
|
|
446
446
|
}
|
|
447
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
448
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
447
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconsService, deps: [{ token: ICON_SETTINGS, optional: true }, { token: IconSettingsService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
448
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconsService, providedIn: 'root' });
|
|
449
449
|
}
|
|
450
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
450
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconsService, decorators: [{
|
|
451
451
|
type: Injectable,
|
|
452
452
|
args: [{
|
|
453
453
|
providedIn: 'root'
|
|
@@ -533,8 +533,8 @@ https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/
|
|
|
533
533
|
ngOnDestroy() {
|
|
534
534
|
this.subs.unsubscribe();
|
|
535
535
|
}
|
|
536
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
537
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
536
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconWrapperComponent, deps: [{ token: IconsService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
537
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: IconWrapperComponent, isStandalone: true, selector: "kendo-icon-wrapper", inputs: { name: "name", svgIcon: "svgIcon", innerCssClass: "innerCssClass", customFontClass: "customFontClass", size: "size" }, host: { properties: { "class.k-icon-wrapper-host": "this.hostClass" } }, exportAs: ["kendoIconWrapper"], ngImport: i0, template: `
|
|
538
538
|
@if (iconSettings?.type === 'svg' && hasSvgIcon) {
|
|
539
539
|
<kendo-svgicon
|
|
540
540
|
[ngClass]="innerCssClass"
|
|
@@ -556,7 +556,7 @@ https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/
|
|
|
556
556
|
}
|
|
557
557
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "kendo-icon", inputs: ["name"], exportAs: ["kendoIcon"] }, { kind: "component", type: SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }] });
|
|
558
558
|
}
|
|
559
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
559
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconWrapperComponent, decorators: [{
|
|
560
560
|
type: Component,
|
|
561
561
|
args: [{
|
|
562
562
|
exportAs: 'kendoIconWrapper',
|
|
@@ -620,11 +620,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
|
|
|
620
620
|
* ```
|
|
621
621
|
*/
|
|
622
622
|
class IconModule {
|
|
623
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
624
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
625
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
623
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
624
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: IconModule, imports: [IconComponent], exports: [IconComponent] });
|
|
625
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconModule });
|
|
626
626
|
}
|
|
627
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
627
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconModule, decorators: [{
|
|
628
628
|
type: NgModule,
|
|
629
629
|
args: [{
|
|
630
630
|
exports: [IconComponent],
|
|
@@ -652,11 +652,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
|
|
|
652
652
|
* ```
|
|
653
653
|
*/
|
|
654
654
|
class SVGIconModule {
|
|
655
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
656
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
657
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
655
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SVGIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
656
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: SVGIconModule, imports: [SVGIconComponent], exports: [SVGIconComponent] });
|
|
657
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SVGIconModule });
|
|
658
658
|
}
|
|
659
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
659
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SVGIconModule, decorators: [{
|
|
660
660
|
type: NgModule,
|
|
661
661
|
args: [{
|
|
662
662
|
exports: [SVGIconComponent],
|
|
@@ -746,11 +746,11 @@ const KENDO_ICONS = [
|
|
|
746
746
|
* ```
|
|
747
747
|
*/
|
|
748
748
|
class IconsModule {
|
|
749
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
750
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
751
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
749
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
750
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: IconsModule, imports: [IconComponent, SVGIconComponent], exports: [IconComponent, SVGIconComponent] });
|
|
751
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconsModule, providers: [IconsService] });
|
|
752
752
|
}
|
|
753
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
753
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IconsModule, decorators: [{
|
|
754
754
|
type: NgModule,
|
|
755
755
|
args: [{
|
|
756
756
|
imports: [
|
package/index.d.ts
CHANGED
|
@@ -2,15 +2,482 @@
|
|
|
2
2
|
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
export { SVGIconModule } from './svg-icon.module';
|
|
10
|
-
export { IconsModule } from './icons.module';
|
|
11
|
-
export { IconFlip, IconSize, IconThemeColor, IconType, IconSettings, IconVariant } from './common/models';
|
|
12
|
-
export { IconsService } from './common/icons.service';
|
|
13
|
-
export { IconSettingsService } from './common/icon-settings.service';
|
|
14
|
-
export { ICON_SETTINGS } from './common/icon-settings';
|
|
5
|
+
import * as i0 from '@angular/core';
|
|
6
|
+
import { ElementRef, Renderer2, OnInit, OnDestroy, InjectionToken } from '@angular/core';
|
|
7
|
+
import { SafeHtml, DomSanitizer } from '@angular/platform-browser';
|
|
8
|
+
import { SVGIcon } from '@progress/kendo-svg-icons';
|
|
15
9
|
export { SVGIcon } from '@progress/kendo-svg-icons';
|
|
16
|
-
|
|
10
|
+
import { Subject } from 'rxjs';
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* Specifies the `IconThemeColor` of the icon.
|
|
14
|
+
*
|
|
15
|
+
* Use this type to set the icon theme color. The possible values are:
|
|
16
|
+
* - `inherit` (Default)—Applies coloring based on the current color.
|
|
17
|
+
* - `primary` —Applies coloring based on primary theme color.
|
|
18
|
+
* - `secondary`—Applies coloring based on secondary theme color.
|
|
19
|
+
* - `tertiary`— Applies coloring based on tertiary theme color.
|
|
20
|
+
* - `info`—Applies coloring based on info theme color.
|
|
21
|
+
* - `success`— Applies coloring based on success theme color.
|
|
22
|
+
* - `warning`— Applies coloring based on warning theme color.
|
|
23
|
+
* - `error`— Applies coloring based on error theme color.
|
|
24
|
+
* - `inverse`— Applies coloring based on inverse theme color.
|
|
25
|
+
*
|
|
26
|
+
*/
|
|
27
|
+
type IconThemeColor = 'inherit' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'inverse';
|
|
28
|
+
|
|
29
|
+
/**
|
|
30
|
+
* Specifies the `IconSize` of the icon.
|
|
31
|
+
*
|
|
32
|
+
* Use this type to set the icon size. The possible values are:
|
|
33
|
+
* - `default` (Default)—Font-size: 16px; Width: 16px; Height: 16px.
|
|
34
|
+
* - `xsmall`—Font-size: 12px; Width: 12px; Height: 12px.
|
|
35
|
+
* - `small`—Font-size: 14px; Width: 14px; Height: 14px.
|
|
36
|
+
* - `medium`—Font-size: 16px; Width: 16px; Height: 16px.
|
|
37
|
+
* - `large`—Font-size: 20px; Width: 20px; Height: 20px.
|
|
38
|
+
* - `xlarge`—Font-size: 24px; Width: 24px; Height: 24px.
|
|
39
|
+
* - `xxlarge`—Font-size: 32px; Width: 32px; Height: 32px.
|
|
40
|
+
* - `xxxlarge`—Font-size: 48px; Width: 48px; Height: 48px.
|
|
41
|
+
*
|
|
42
|
+
*/
|
|
43
|
+
type IconSize = 'default' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge';
|
|
44
|
+
|
|
45
|
+
/**
|
|
46
|
+
* Specifies the `IconFlip` direction.
|
|
47
|
+
*
|
|
48
|
+
* Use this type to control how to flip an icon. The possible values are:
|
|
49
|
+
* - `default`: No flip applied.
|
|
50
|
+
* - `horizontal`: Flip the icon horizontally.
|
|
51
|
+
* - `vertical`: Flip the icon vertically.
|
|
52
|
+
* - `both`: Flip the icon both horizontally and vertically.
|
|
53
|
+
*
|
|
54
|
+
*/
|
|
55
|
+
type IconFlip = 'default' | 'horizontal' | 'vertical' | 'both';
|
|
56
|
+
|
|
57
|
+
/**
|
|
58
|
+
* @hidden
|
|
59
|
+
*/
|
|
60
|
+
declare abstract class IconBaseDirective {
|
|
61
|
+
element: ElementRef;
|
|
62
|
+
renderer: Renderer2;
|
|
63
|
+
get horizontalFlip(): boolean;
|
|
64
|
+
get verticalFlip(): boolean;
|
|
65
|
+
/**
|
|
66
|
+
* Flips the icon horizontally, vertically, or in both directions.
|
|
67
|
+
*/
|
|
68
|
+
flip: IconFlip;
|
|
69
|
+
/**
|
|
70
|
+
* Sets the `IconThemeColor` for the icon. Use this property to apply a theme color.
|
|
71
|
+
*/
|
|
72
|
+
set themeColor(themeColor: IconThemeColor);
|
|
73
|
+
get themeColor(): IconThemeColor;
|
|
74
|
+
/**
|
|
75
|
+
* Sets the `IconSize` for the icon. Use this property to change the icon size.
|
|
76
|
+
*/
|
|
77
|
+
set size(size: IconSize);
|
|
78
|
+
get size(): IconSize;
|
|
79
|
+
_themeColor: IconThemeColor;
|
|
80
|
+
_size: IconSize;
|
|
81
|
+
constructor(element: ElementRef, renderer: Renderer2);
|
|
82
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IconBaseDirective, never>;
|
|
83
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<IconBaseDirective, "[kendoIconBase]", never, { "flip": { "alias": "flip"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, true, never>;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
/**
|
|
87
|
+
* Represents the [Kendo UI Icon component for Angular](https://www.telerik.com/kendo-angular-ui/components/icons/icon).
|
|
88
|
+
* Used to display icons from the [Kendo UI Icons](https://www.telerik.com/kendo-angular-ui/components/icons/icon/icon-list) collection.
|
|
89
|
+
*
|
|
90
|
+
* @example
|
|
91
|
+
* ```html
|
|
92
|
+
* <kendo-icon name="home"></kendo-icon>
|
|
93
|
+
* ```
|
|
94
|
+
*/
|
|
95
|
+
declare class IconComponent extends IconBaseDirective {
|
|
96
|
+
element: ElementRef;
|
|
97
|
+
renderer: Renderer2;
|
|
98
|
+
hostClass: boolean;
|
|
99
|
+
hostAriaHidden: boolean;
|
|
100
|
+
/**
|
|
101
|
+
* Sets the `Icon` to render. Supports all [Kendo UI Icons](https://www.telerik.com/kendo-angular-ui/components/icons/icon/icon-list).
|
|
102
|
+
*/
|
|
103
|
+
set name(name: string);
|
|
104
|
+
get name(): string;
|
|
105
|
+
private _name;
|
|
106
|
+
constructor(element: ElementRef, renderer: Renderer2);
|
|
107
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IconComponent, never>;
|
|
108
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<IconComponent, "kendo-icon", ["kendoIcon"], { "name": { "alias": "name"; "required": false; }; }, {}, never, never, true, never>;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
/**
|
|
112
|
+
* Specifies the style variant of an SVG icon.
|
|
113
|
+
*
|
|
114
|
+
*/
|
|
115
|
+
type IconVariant = 'solid' | 'outline' | 'duotone';
|
|
116
|
+
|
|
117
|
+
/**
|
|
118
|
+
* Represents the [Kendo UI SVG Icon component for Angular](https://www.telerik.com/kendo-angular-ui/components/icons/svgicon).
|
|
119
|
+
* Used to display icons from the [Kendo UI SVG Icons](https://www.telerik.com/kendo-angular-ui/components/icons/svgicon/svgicon-list) collection.
|
|
120
|
+
*
|
|
121
|
+
* @example
|
|
122
|
+
* ```ts
|
|
123
|
+
* import { KENDO_ICONS } from "@progress/kendo-angular-icons";
|
|
124
|
+
* import { paperclipIcon } from "@progress/kendo-svg-icons";
|
|
125
|
+
*
|
|
126
|
+
* @Component({
|
|
127
|
+
* selector: "my-app",
|
|
128
|
+
* imports: [KENDO_ICONS],
|
|
129
|
+
* template: `
|
|
130
|
+
* <kendo-svg-icon [icon]="paperclipIcon"></kendo-svg-icon>
|
|
131
|
+
* `,
|
|
132
|
+
* providers: [],
|
|
133
|
+
* })
|
|
134
|
+
* export class AppComponent {
|
|
135
|
+
* public paperclipIcon = paperclipIcon;
|
|
136
|
+
* }
|
|
137
|
+
* ```
|
|
138
|
+
*/
|
|
139
|
+
declare class SVGIconComponent extends IconBaseDirective implements OnInit {
|
|
140
|
+
private domSanitizer;
|
|
141
|
+
element: ElementRef;
|
|
142
|
+
renderer: Renderer2;
|
|
143
|
+
hostClass: boolean;
|
|
144
|
+
hostAriaHidden: boolean;
|
|
145
|
+
/**
|
|
146
|
+
* Sets the `SVGIcon` to render. Supports all [Kendo UI SVG Icons](https://www.telerik.com/kendo-angular-ui/components/icons/svgicon/svgicon-list).
|
|
147
|
+
*/
|
|
148
|
+
set icon(icon: SVGIcon);
|
|
149
|
+
get icon(): SVGIcon;
|
|
150
|
+
/**
|
|
151
|
+
* Sets the style variant of the icon.
|
|
152
|
+
*
|
|
153
|
+
* > Requires `@progress/kendo-svg-icons` v5 or later for the `variants` property to be available on icons.
|
|
154
|
+
*/
|
|
155
|
+
set variant(variant: IconVariant);
|
|
156
|
+
get variant(): IconVariant;
|
|
157
|
+
get content(): SafeHtml;
|
|
158
|
+
get visible(): boolean;
|
|
159
|
+
private _icon;
|
|
160
|
+
private _variant;
|
|
161
|
+
constructor(domSanitizer: DomSanitizer, element: ElementRef, renderer: Renderer2);
|
|
162
|
+
ngOnInit(): void;
|
|
163
|
+
private verifyIconProperty;
|
|
164
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SVGIconComponent, never>;
|
|
165
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SVGIconComponent, "kendo-svg-icon, kendo-svgicon", ["kendoSVGIcon"], { "icon": { "alias": "icon"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; }, {}, never, never, true, never>;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
/**
|
|
169
|
+
* Specifies the `IconType` for icons.
|
|
170
|
+
* Use `IconType` to set how the icon renders.
|
|
171
|
+
*/
|
|
172
|
+
type IconType = 'font' | 'svg';
|
|
173
|
+
|
|
174
|
+
/**
|
|
175
|
+
* Represents the icon settings for Kendo UI icons.
|
|
176
|
+
* Use the `IconSettings` interface to set the icon `type`, `themeColor`, `size`, and `flip` direction.
|
|
177
|
+
*
|
|
178
|
+
* @example
|
|
179
|
+
* ```typescript
|
|
180
|
+
* const settings: IconSettings = {
|
|
181
|
+
* type: 'svg',
|
|
182
|
+
* themeColor: 'primary',
|
|
183
|
+
* size: 'large',
|
|
184
|
+
* flip: 'horizontal'
|
|
185
|
+
* };
|
|
186
|
+
* ```
|
|
187
|
+
*/
|
|
188
|
+
interface IconSettings {
|
|
189
|
+
/**
|
|
190
|
+
* Sets the `type` of the icon.
|
|
191
|
+
*/
|
|
192
|
+
type?: IconType;
|
|
193
|
+
/**
|
|
194
|
+
* Sets the `themeColor` of the icon.
|
|
195
|
+
*/
|
|
196
|
+
themeColor?: IconThemeColor;
|
|
197
|
+
/**
|
|
198
|
+
* Sets the `size` of the icon.
|
|
199
|
+
*/
|
|
200
|
+
size?: IconSize;
|
|
201
|
+
/**
|
|
202
|
+
* Sets the `flip` direction of the icon.
|
|
203
|
+
*/
|
|
204
|
+
flip?: IconFlip;
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
/**
|
|
208
|
+
* Represents the service that manages icon settings.
|
|
209
|
+
* Use the `notify` method to update icon settings dynamically.
|
|
210
|
+
*
|
|
211
|
+
* @example
|
|
212
|
+
* ```typescript
|
|
213
|
+
* constructor(private iconSettingsService: IconSettingsService) {}
|
|
214
|
+
*
|
|
215
|
+
* this.iconSettingsService.notify({ themeColor: 'primary' });
|
|
216
|
+
* ```
|
|
217
|
+
*/
|
|
218
|
+
declare class IconSettingsService {
|
|
219
|
+
/**
|
|
220
|
+
* @hidden
|
|
221
|
+
*/
|
|
222
|
+
readonly changes: Subject<IconSettings>;
|
|
223
|
+
/**
|
|
224
|
+
* Notifies subscribers about changes in the icon settings.
|
|
225
|
+
*
|
|
226
|
+
* @param iconSettings - (Optional) Sets a new value for the [icon settings token](https://www.telerik.com/kendo-angular-ui/components/icons/api/icon_settings).
|
|
227
|
+
* @example
|
|
228
|
+
* ```typescript
|
|
229
|
+
* iconSettingsService.notify({ size: 'large' });
|
|
230
|
+
* ```
|
|
231
|
+
*/
|
|
232
|
+
notify(iconSettings?: IconSettings): void;
|
|
233
|
+
/**
|
|
234
|
+
* Returns the [`SVGIcon`](https://www.telerik.com/kendo-angular-ui/components/icons/api/svgicon) object for the provided key.
|
|
235
|
+
* Override in a custom service to provide custom SVG icons.
|
|
236
|
+
*
|
|
237
|
+
* @hidden
|
|
238
|
+
*/
|
|
239
|
+
getSvgIcon(_name: string): SVGIcon;
|
|
240
|
+
/**
|
|
241
|
+
* Returns the list of classes to be rendered on the host `SPAN` element of custom font icons.
|
|
242
|
+
* Override in a custom service to provide classes for custom font icons.
|
|
243
|
+
*
|
|
244
|
+
* @hidden
|
|
245
|
+
*/
|
|
246
|
+
getCustomFontIconClass(_key: string): string;
|
|
247
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IconSettingsService, never>;
|
|
248
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<IconSettingsService>;
|
|
249
|
+
}
|
|
250
|
+
|
|
251
|
+
/**
|
|
252
|
+
* Represents the service that manages icon settings.
|
|
253
|
+
* Add this service to the `providers` array when you use it in a standalone component.
|
|
254
|
+
*
|
|
255
|
+
* @example
|
|
256
|
+
* ```typescript
|
|
257
|
+
* import { IconsService } from '@progress/kendo-angular-icons';
|
|
258
|
+
*
|
|
259
|
+
* @Component({
|
|
260
|
+
* selector: 'my-component',
|
|
261
|
+
* standalone: true,
|
|
262
|
+
* imports: [ ... ],
|
|
263
|
+
* providers: [IconsService, { provide: ICON_SETTINGS, useValue: { type: 'font' } }],
|
|
264
|
+
* template: `...`
|
|
265
|
+
* })
|
|
266
|
+
* export class AppComponent {}
|
|
267
|
+
* ```
|
|
268
|
+
*/
|
|
269
|
+
declare class IconsService implements OnDestroy {
|
|
270
|
+
private _iconSettings;
|
|
271
|
+
private iconSettingsService;
|
|
272
|
+
/**
|
|
273
|
+
* Notifies subscribers of the initial icon settings and on each call to `notify`.
|
|
274
|
+
* @hidden
|
|
275
|
+
*/
|
|
276
|
+
readonly changes: Subject<IconSettings>;
|
|
277
|
+
private subs;
|
|
278
|
+
constructor(_iconSettings: IconSettings, iconSettingsService: IconSettingsService);
|
|
279
|
+
/**
|
|
280
|
+
* @hidden
|
|
281
|
+
*/
|
|
282
|
+
get iconSettings(): IconSettings;
|
|
283
|
+
ngOnDestroy(): void;
|
|
284
|
+
/**
|
|
285
|
+
* Returns the [`SVGIcon`](https://www.telerik.com/kendo-angular-ui/components/icons/api/svgicon) object for the provided key.
|
|
286
|
+
* Override in a custom service to provide custom SVG icons.
|
|
287
|
+
* @hidden
|
|
288
|
+
*/
|
|
289
|
+
getSvgIcon(name: string): SVGIcon;
|
|
290
|
+
/**
|
|
291
|
+
* Returns the list of classes to be rendered on the host `SPAN` element of custom font icons.
|
|
292
|
+
* Override in a custom service to provide classes for custom font icons.
|
|
293
|
+
* @hidden
|
|
294
|
+
*/
|
|
295
|
+
getCustomFontIconClass(key: string): string;
|
|
296
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IconsService, [{ optional: true; }, { optional: true; }]>;
|
|
297
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<IconsService>;
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
/**
|
|
301
|
+
* @hidden
|
|
302
|
+
*/
|
|
303
|
+
declare class IconWrapperComponent implements OnDestroy {
|
|
304
|
+
private iconsService;
|
|
305
|
+
element: ElementRef;
|
|
306
|
+
hostClass: boolean;
|
|
307
|
+
/**
|
|
308
|
+
* Sets the name for an existing font icon in a Kendo UI theme to render.
|
|
309
|
+
* Supports all [Kendo UI Icons](https://www.telerik.com/kendo-angular-ui/components/styling/icons#icons-list).
|
|
310
|
+
*/
|
|
311
|
+
name: string;
|
|
312
|
+
/**
|
|
313
|
+
* Sets the [SVGIcon](https://www.telerik.com/kendo-angular-ui/components/icons/api/svgicon) to render.
|
|
314
|
+
*/
|
|
315
|
+
svgIcon: SVGIcon;
|
|
316
|
+
/**
|
|
317
|
+
* Sets an additional class on the internal Icon component.
|
|
318
|
+
*/
|
|
319
|
+
innerCssClass: string;
|
|
320
|
+
/**
|
|
321
|
+
* Sets a custom font icon class using the API of the consuming component.
|
|
322
|
+
*/
|
|
323
|
+
customFontClass: string;
|
|
324
|
+
/**
|
|
325
|
+
* Sets the `IconSize` for the icon.
|
|
326
|
+
*/
|
|
327
|
+
size: IconSize;
|
|
328
|
+
get customClasses(): string;
|
|
329
|
+
iconSettings: IconSettings;
|
|
330
|
+
get hasSvgIcon(): boolean;
|
|
331
|
+
get customFontIconClass(): string;
|
|
332
|
+
private subs;
|
|
333
|
+
constructor(iconsService: IconsService, element: ElementRef);
|
|
334
|
+
ngOnDestroy(): void;
|
|
335
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IconWrapperComponent, never>;
|
|
336
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<IconWrapperComponent, "kendo-icon-wrapper", ["kendoIconWrapper"], { "name": { "alias": "name"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; "innerCssClass": { "alias": "innerCssClass"; "required": false; }; "customFontClass": { "alias": "customFontClass"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, true, never>;
|
|
337
|
+
}
|
|
338
|
+
|
|
339
|
+
/**
|
|
340
|
+
* Represents the [`NgModule`](link:site.data.urls.angular['ngmoduleapi']) definition for the Icon component.
|
|
341
|
+
*
|
|
342
|
+
* @example
|
|
343
|
+
* ```typescript
|
|
344
|
+
* import { NgModule } from '@angular/core';
|
|
345
|
+
* import { IconModule } from '@progress/kendo-angular-icons';
|
|
346
|
+
* import { BrowserModule } from '@angular/platform-browser';
|
|
347
|
+
* import { AppComponent } from './app.component';
|
|
348
|
+
*
|
|
349
|
+
* @NgModule({
|
|
350
|
+
* declarations: [AppComponent],
|
|
351
|
+
* imports: [BrowserModule, IconModule],
|
|
352
|
+
* bootstrap: [AppComponent]
|
|
353
|
+
* })
|
|
354
|
+
* export class AppModule {}
|
|
355
|
+
* ```
|
|
356
|
+
*/
|
|
357
|
+
declare class IconModule {
|
|
358
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IconModule, never>;
|
|
359
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<IconModule, never, [typeof IconComponent], [typeof IconComponent]>;
|
|
360
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<IconModule>;
|
|
361
|
+
}
|
|
362
|
+
|
|
363
|
+
/**
|
|
364
|
+
* Represents the [`NgModule`](link:site.data.urls.angular['ngmoduleapi']) definition for the SVG Icon component.
|
|
365
|
+
*
|
|
366
|
+
* @example
|
|
367
|
+
* ```typescript
|
|
368
|
+
* import { NgModule } from '@angular/core';
|
|
369
|
+
* import { SVGIconModule } from '@progress/kendo-angular-icons';
|
|
370
|
+
* import { BrowserModule } from '@angular/platform-browser';
|
|
371
|
+
* import { AppComponent } from './app.component';
|
|
372
|
+
*
|
|
373
|
+
* @NgModule({
|
|
374
|
+
* declarations: [AppComponent],
|
|
375
|
+
* imports: [BrowserModule, SVGIconModule],
|
|
376
|
+
* bootstrap: [AppComponent]
|
|
377
|
+
* })
|
|
378
|
+
* export class AppModule {}
|
|
379
|
+
* ```
|
|
380
|
+
*/
|
|
381
|
+
declare class SVGIconModule {
|
|
382
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SVGIconModule, never>;
|
|
383
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SVGIconModule, never, [typeof SVGIconComponent], [typeof SVGIconComponent]>;
|
|
384
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SVGIconModule>;
|
|
385
|
+
}
|
|
386
|
+
|
|
387
|
+
/**
|
|
388
|
+
* Represents the [`NgModule`](link:site.data.urls.angular['ngmoduleapi']) definition for the Icons components.
|
|
389
|
+
*
|
|
390
|
+
* @example
|
|
391
|
+
* ```typescript
|
|
392
|
+
* import { NgModule } from '@angular/core';
|
|
393
|
+
* import { IconsModule } from '@progress/kendo-angular-icons';
|
|
394
|
+
* import { BrowserModule } from '@angular/platform-browser';
|
|
395
|
+
* import { AppComponent } from './app.component';
|
|
396
|
+
*
|
|
397
|
+
* @NgModule({
|
|
398
|
+
* declarations: [AppComponent],
|
|
399
|
+
* imports: [BrowserModule, IconsModule],
|
|
400
|
+
* bootstrap: [AppComponent]
|
|
401
|
+
* })
|
|
402
|
+
* export class AppModule {}
|
|
403
|
+
* ```
|
|
404
|
+
*/
|
|
405
|
+
declare class IconsModule {
|
|
406
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IconsModule, never>;
|
|
407
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<IconsModule, never, [typeof IconComponent, typeof SVGIconComponent], [typeof IconComponent, typeof SVGIconComponent]>;
|
|
408
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<IconsModule>;
|
|
409
|
+
}
|
|
410
|
+
|
|
411
|
+
/**
|
|
412
|
+
* Represents the token for the `IconSettings` of Kendo UI for Angular components.
|
|
413
|
+
* Use this token to configure icon settings. ([See example.](https://www.telerik.com/kendo-angular-ui/components/icons/icon-settings#icons-configuration))
|
|
414
|
+
*
|
|
415
|
+
* @example
|
|
416
|
+
* ```typescript
|
|
417
|
+
* import { NgModule } from '@angular/core';
|
|
418
|
+
*
|
|
419
|
+
* @NgModule({
|
|
420
|
+
* providers: [{ provide: ICON_SETTINGS, useValue: { type: 'svg', size: 'xsmall' } }]
|
|
421
|
+
* })
|
|
422
|
+
* export class AppModule {}
|
|
423
|
+
* ```
|
|
424
|
+
*/
|
|
425
|
+
declare const ICON_SETTINGS: InjectionToken<IconSettings>;
|
|
426
|
+
|
|
427
|
+
/**
|
|
428
|
+
* Represents the utility array that contains all `KendoIcon`-related components and directives.
|
|
429
|
+
*
|
|
430
|
+
* @example
|
|
431
|
+
* ```typescript
|
|
432
|
+
* import { Component } from '@angular/core';
|
|
433
|
+
* import { KENDO_ICON } from '@progress/kendo-angular-icons';
|
|
434
|
+
*
|
|
435
|
+
* @Component({
|
|
436
|
+
* selector: 'my-app',
|
|
437
|
+
* standalone: true,
|
|
438
|
+
* imports: [KENDO_ICON],
|
|
439
|
+
* template: `...`,
|
|
440
|
+
* })
|
|
441
|
+
* export class AppComponent {}
|
|
442
|
+
* ```
|
|
443
|
+
*/
|
|
444
|
+
declare const KENDO_ICON: readonly [typeof IconComponent];
|
|
445
|
+
/**
|
|
446
|
+
* Represents the utility array that contains all `KendoSVGIcon`-related components and directives.
|
|
447
|
+
*
|
|
448
|
+
* @example
|
|
449
|
+
* ```typescript
|
|
450
|
+
* import { Component } from '@angular/core';
|
|
451
|
+
* import { KENDO_SVGICON } from '@progress/kendo-angular-icons';
|
|
452
|
+
*
|
|
453
|
+
* @Component({
|
|
454
|
+
* selector: 'my-app',
|
|
455
|
+
* standalone: true,
|
|
456
|
+
* imports: [KENDO_SVGICON],
|
|
457
|
+
* template: `...`,
|
|
458
|
+
* })
|
|
459
|
+
* export class AppComponent {}
|
|
460
|
+
* ```
|
|
461
|
+
*/
|
|
462
|
+
declare const KENDO_SVGICON: readonly [typeof SVGIconComponent];
|
|
463
|
+
/**
|
|
464
|
+
* Represents the utility array that contains all `@progress/kendo-angular-icons`-related components and directives.
|
|
465
|
+
*
|
|
466
|
+
* @example
|
|
467
|
+
* ```typescript
|
|
468
|
+
* import { Component, ViewEncapsulation } from '@angular/core';
|
|
469
|
+
* import { KENDO_ICONS } from '@progress/kendo-angular-icons';
|
|
470
|
+
*
|
|
471
|
+
* @Component({
|
|
472
|
+
* selector: 'my-app',
|
|
473
|
+
* standalone: true,
|
|
474
|
+
* imports: [KENDO_ICONS],
|
|
475
|
+
* template: `...`,
|
|
476
|
+
* })
|
|
477
|
+
* export class AppComponent {}
|
|
478
|
+
* ```
|
|
479
|
+
*/
|
|
480
|
+
declare const KENDO_ICONS: readonly [typeof IconComponent, typeof SVGIconComponent];
|
|
481
|
+
|
|
482
|
+
export { ICON_SETTINGS, IconComponent, IconModule, IconSettingsService, IconWrapperComponent, IconsModule, IconsService, KENDO_ICON, KENDO_ICONS, KENDO_SVGICON, SVGIconComponent, SVGIconModule };
|
|
483
|
+
export type { IconFlip, IconSettings, IconSize, IconThemeColor, IconType, IconVariant };
|
package/package-metadata.mjs
CHANGED
|
@@ -7,7 +7,7 @@ export const packageMetadata = {
|
|
|
7
7
|
"productCodes": [
|
|
8
8
|
"KENDOUIANGULAR"
|
|
9
9
|
],
|
|
10
|
-
"publishDate":
|
|
11
|
-
"version": "
|
|
10
|
+
"publishDate": 1783679731,
|
|
11
|
+
"version": "25.0.0-develop.1",
|
|
12
12
|
"licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
|
|
13
13
|
};
|