@progress/kendo-angular-icons 25.0.0 → 25.1.0-develop.10

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.
@@ -19,8 +19,8 @@ const packageMetadata = {
19
19
  productName: 'Kendo UI for Angular',
20
20
  productCode: 'KENDOUIANGULAR',
21
21
  productCodes: ['KENDOUIANGULAR'],
22
- publishDate: 1786525749,
23
- version: '25.0.0',
22
+ publishDate: 1787669866,
23
+ version: '25.1.0-develop.10',
24
24
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
25
25
  };
26
26
 
@@ -50,6 +50,24 @@ class IconBaseDirective {
50
50
  * Flips the icon horizontally, vertically, or in both directions.
51
51
  */
52
52
  flip;
53
+ /**
54
+ * Rotates the icon by `45`-degree steps.
55
+ */
56
+ set rotate(rotate) {
57
+ const element = this.element.nativeElement;
58
+ const currentClass = this.rotateClass(this._rotate);
59
+ const nextClass = this.rotateClass(rotate);
60
+ if (currentClass) {
61
+ this.renderer.removeClass(element, currentClass);
62
+ }
63
+ if (nextClass) {
64
+ this.renderer.addClass(element, nextClass);
65
+ }
66
+ this._rotate = rotate;
67
+ }
68
+ get rotate() {
69
+ return this._rotate;
70
+ }
53
71
  /**
54
72
  * Sets the `IconThemeColor` for the icon. Use this property to apply a theme color.
55
73
  */
@@ -86,13 +104,17 @@ class IconBaseDirective {
86
104
  }
87
105
  _themeColor;
88
106
  _size;
107
+ _rotate;
89
108
  constructor(element, renderer) {
90
109
  this.element = element;
91
110
  this.renderer = renderer;
92
111
  validatePackage(packageMetadata);
93
112
  }
113
+ rotateClass(rotate) {
114
+ return rotate === undefined || rotate === null ? undefined : `k-rotate-${rotate}`;
115
+ }
94
116
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", 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.27", 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 });
117
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: IconBaseDirective, isStandalone: true, selector: "[kendoIconBase]", inputs: { flip: "flip", rotate: "rotate", themeColor: "themeColor", size: "size" }, host: { properties: { "class.k-flip-h": "this.horizontalFlip", "class.k-flip-v": "this.verticalFlip" } }, ngImport: i0 });
96
118
  }
97
119
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: IconBaseDirective, decorators: [{
98
120
  type: Directive,
@@ -107,6 +129,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
107
129
  args: ['class.k-flip-v']
108
130
  }], flip: [{
109
131
  type: Input
132
+ }], rotate: [{
133
+ type: Input
110
134
  }], themeColor: [{
111
135
  type: Input
112
136
  }], size: [{
@@ -591,7 +615,8 @@ https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/
591
615
  [size]="size || iconSettings?.size"
592
616
  [themeColor]="iconSettings?.themeColor"
593
617
  [variant]="iconSettings?.variant"
594
- [flip]="iconSettings?.flip"></kendo-svgicon>
618
+ [flip]="iconSettings?.flip"
619
+ [rotate]="iconSettings?.rotate"></kendo-svgicon>
595
620
  } @else {
596
621
  @if (!customFontIconClass) {
597
622
  <kendo-icon
@@ -599,7 +624,8 @@ https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/
599
624
  [name]="name"
600
625
  [size]="size || iconSettings?.size"
601
626
  [themeColor]="iconSettings?.themeColor"
602
- [flip]="iconSettings?.flip"></kendo-icon>
627
+ [flip]="iconSettings?.flip"
628
+ [rotate]="iconSettings?.rotate"></kendo-icon>
603
629
  } @else {
604
630
  <span [ngClass]="customClasses"></span>
605
631
  }
@@ -619,7 +645,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
619
645
  [size]="size || iconSettings?.size"
620
646
  [themeColor]="iconSettings?.themeColor"
621
647
  [variant]="iconSettings?.variant"
622
- [flip]="iconSettings?.flip"></kendo-svgicon>
648
+ [flip]="iconSettings?.flip"
649
+ [rotate]="iconSettings?.rotate"></kendo-svgicon>
623
650
  } @else {
624
651
  @if (!customFontIconClass) {
625
652
  <kendo-icon
@@ -627,7 +654,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
627
654
  [name]="name"
628
655
  [size]="size || iconSettings?.size"
629
656
  [themeColor]="iconSettings?.themeColor"
630
- [flip]="iconSettings?.flip"></kendo-icon>
657
+ [flip]="iconSettings?.flip"
658
+ [rotate]="iconSettings?.rotate"></kendo-icon>
631
659
  } @else {
632
660
  <span [ngClass]="customClasses"></span>
633
661
  }
package/index.d.ts CHANGED
@@ -54,6 +54,13 @@ type IconSize = 'default' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' |
54
54
  */
55
55
  type IconFlip = 'default' | 'horizontal' | 'vertical' | 'both';
56
56
 
57
+ /**
58
+ * Specifies the `IconRotate` degree.
59
+ *
60
+ * Use this type to control icon rotation in `45`-degree steps, where the degree is provided as a number.
61
+ */
62
+ type IconRotate = 0 | 45 | 90 | 135 | 180 | 225 | 270 | 315;
63
+
57
64
  /**
58
65
  * @hidden
59
66
  */
@@ -66,6 +73,11 @@ declare abstract class IconBaseDirective {
66
73
  * Flips the icon horizontally, vertically, or in both directions.
67
74
  */
68
75
  flip: IconFlip;
76
+ /**
77
+ * Rotates the icon by `45`-degree steps.
78
+ */
79
+ set rotate(rotate: IconRotate);
80
+ get rotate(): IconRotate;
69
81
  /**
70
82
  * Sets the `IconThemeColor` for the icon. Use this property to apply a theme color.
71
83
  */
@@ -78,9 +90,11 @@ declare abstract class IconBaseDirective {
78
90
  get size(): IconSize;
79
91
  _themeColor: IconThemeColor;
80
92
  _size: IconSize;
93
+ _rotate: IconRotate;
81
94
  constructor(element: ElementRef, renderer: Renderer2);
95
+ private rotateClass;
82
96
  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>;
97
+ static ɵdir: i0.ɵɵDirectiveDeclaration<IconBaseDirective, "[kendoIconBase]", never, { "flip": { "alias": "flip"; "required": false; }; "rotate": { "alias": "rotate"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, true, never>;
84
98
  }
85
99
 
86
100
  /**
@@ -175,7 +189,7 @@ type IconType = 'font' | 'svg';
175
189
 
176
190
  /**
177
191
  * Represents the icon settings for Kendo UI icons.
178
- * Use the `IconSettings` interface to set the icon `type`, `themeColor`, `size`, and `flip` direction.
192
+ * Use the `IconSettings` interface to set the icon `type`, `themeColor`, `size`, `flip`, and `rotate` values.
179
193
  *
180
194
  * @example
181
195
  * ```typescript
@@ -184,6 +198,7 @@ type IconType = 'font' | 'svg';
184
198
  * themeColor: 'primary',
185
199
  * size: 'large',
186
200
  * flip: 'horizontal',
201
+ * rotate: 90,
187
202
  * variant: 'outline'
188
203
  * };
189
204
  * ```
@@ -205,6 +220,10 @@ interface IconSettings {
205
220
  * Sets the `flip` direction of the icon.
206
221
  */
207
222
  flip?: IconFlip;
223
+ /**
224
+ * Sets the `rotate` degree of the icon. The `flip` direction takes precedence over the rotation degree when both are applied.
225
+ */
226
+ rotate?: IconRotate;
208
227
  /**
209
228
  * Sets the `variant` of the SVG icon.
210
229
  * Requires `@progress/kendo-svg-icons` version `5.0.0` or later.
@@ -508,4 +527,4 @@ declare const KENDO_SVGICON: readonly [typeof SVGIconComponent];
508
527
  declare const KENDO_ICONS: readonly [typeof IconComponent, typeof SVGIconComponent];
509
528
 
510
529
  export { ICON_SETTINGS, IconComponent, IconModule, IconSettingsService, IconWrapperComponent, IconsModule, IconsService, KENDO_ICON, KENDO_ICONS, KENDO_SVGICON, SVGIconComponent, SVGIconModule };
511
- export type { IconFlip, IconSettings, IconSize, IconThemeColor, IconType, IconVariant };
530
+ export type { IconFlip, IconRotate, IconSettings, IconSize, IconThemeColor, IconType, IconVariant };
@@ -7,7 +7,7 @@ export const packageMetadata = {
7
7
  "productCodes": [
8
8
  "KENDOUIANGULAR"
9
9
  ],
10
- "publishDate": 1786525749,
11
- "version": "25.0.0",
10
+ "publishDate": 1787669866,
11
+ "version": "25.1.0-develop.10",
12
12
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
13
13
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-icons",
3
- "version": "25.0.0",
3
+ "version": "25.1.0-develop.10",
4
4
  "description": "Kendo UI Angular component starter template",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -31,7 +31,7 @@
31
31
  "package": {
32
32
  "productName": "Kendo UI for Angular",
33
33
  "productCode": "KENDOUIANGULAR",
34
- "publishDate": 1786525749,
34
+ "publishDate": 1787669866,
35
35
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
36
36
  }
37
37
  },
@@ -42,7 +42,7 @@
42
42
  "@angular/platform-browser": "20 - 22",
43
43
  "@progress/kendo-licensing": "^1.11.0",
44
44
  "@progress/kendo-svg-icons": "^4.9.0 || ^5.0.0",
45
- "@progress/kendo-angular-common": "25.0.0",
45
+ "@progress/kendo-angular-common": "25.1.0-develop.10",
46
46
  "rxjs": "^6.5.3 || ^7.0.0"
47
47
  },
48
48
  "peerDependenciesMeta": {
@@ -52,7 +52,7 @@
52
52
  },
53
53
  "dependencies": {
54
54
  "tslib": "^2.3.1",
55
- "@progress/kendo-angular-schematics": "25.0.0"
55
+ "@progress/kendo-angular-schematics": "25.1.0-develop.10"
56
56
  },
57
57
  "schematics": "./schematics/collection.json",
58
58
  "module": "fesm2022/progress-kendo-angular-icons.mjs",