ng-animated-icons 0.0.1 → 1.0.0
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/README.md
CHANGED
|
@@ -30,11 +30,15 @@ npm i ng-animated-icons
|
|
|
30
30
|
pnpm i ng-animated-icons
|
|
31
31
|
```
|
|
32
32
|
|
|
33
|
+
Yarn has some known issues with installing peer dependencies automatically, and need to be installed explicitly:
|
|
34
|
+
|
|
33
35
|
```bash
|
|
34
|
-
yarn add ng-animated-icons
|
|
36
|
+
yarn add ng-animated-icons @angular/cdk
|
|
35
37
|
```
|
|
36
38
|
|
|
37
|
-
Or copy just the required icons from the repository.
|
|
39
|
+
Or copy just the required icons from the repository.
|
|
40
|
+
|
|
41
|
+
Use [the docs](https://icons.ajitpanigrahi.com/) to find the files and copy the source code into your project. The only relative import is for the injection token, so consider either adding this file directory beside your icons or you can delete the relevant lines should you choose to skip this.
|
|
38
42
|
|
|
39
43
|
## Usage
|
|
40
44
|
|
|
@@ -3270,7 +3270,7 @@ class BatteryChargingIcon {
|
|
|
3270
3270
|
handleMouseEnter(forced = false) {
|
|
3271
3271
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
3272
3272
|
this.isAnimating.set(true);
|
|
3273
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
3273
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 1500);
|
|
3274
3274
|
}
|
|
3275
3275
|
}
|
|
3276
3276
|
constructor() {
|
|
@@ -3307,7 +3307,7 @@ class BatteryChargingIcon {
|
|
|
3307
3307
|
<svg:path class="battery-charging" d="m11 7-3 5h4l-3 5" />
|
|
3308
3308
|
<svg:line x1="22" x2="22" y1="11" y2="13" />
|
|
3309
3309
|
</svg>
|
|
3310
|
-
`, isInline: true, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-charging-icon.animate .battery-charging{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:.1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3310
|
+
`, isInline: true, styles: [":host{display:inline-block}.battery-charging-icon{overflow:visible}.battery-charging-icon.animate .battery-charging{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:.1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3311
3311
|
}
|
|
3312
3312
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BatteryChargingIcon, decorators: [{
|
|
3313
3313
|
type: Component,
|
|
@@ -3335,7 +3335,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3335
3335
|
'aria-label': 'battery-charging',
|
|
3336
3336
|
role: 'img',
|
|
3337
3337
|
'(mouseenter)': 'handleMouseEnter()',
|
|
3338
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-charging-icon.animate .battery-charging{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:.1}}\n"] }]
|
|
3338
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-charging-icon{overflow:visible}.battery-charging-icon.animate .battery-charging{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:.1}}\n"] }]
|
|
3339
3339
|
}], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
3340
3340
|
|
|
3341
3341
|
class BatteryFullIcon {
|
|
@@ -3350,7 +3350,7 @@ class BatteryFullIcon {
|
|
|
3350
3350
|
handleMouseEnter(forced = false) {
|
|
3351
3351
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
3352
3352
|
this.isAnimating.set(true);
|
|
3353
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
3353
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 1500);
|
|
3354
3354
|
}
|
|
3355
3355
|
}
|
|
3356
3356
|
constructor() {
|
|
@@ -3388,7 +3388,7 @@ class BatteryFullIcon {
|
|
|
3388
3388
|
<svg:line class="battery-bar battery-bar-2" x1="10" x2="10" y1="11" y2="13" />
|
|
3389
3389
|
<svg:line class="battery-bar battery-bar-3" x1="14" x2="14" y1="11" y2="13" />
|
|
3390
3390
|
</svg>
|
|
3391
|
-
`, isInline: true, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}.battery-icon.animate .battery-bar-3{opacity:0;animation-delay:1.2s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3391
|
+
`, isInline: true, styles: [":host{display:inline-block}.battery-full-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-full-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-full-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-full-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}.battery-full-icon.animate .battery-bar-3{opacity:0;animation-delay:1.2s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3392
3392
|
}
|
|
3393
3393
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BatteryFullIcon, decorators: [{
|
|
3394
3394
|
type: Component,
|
|
@@ -3417,7 +3417,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3417
3417
|
'aria-label': 'battery-full',
|
|
3418
3418
|
role: 'img',
|
|
3419
3419
|
'(mouseenter)': 'handleMouseEnter()',
|
|
3420
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}.battery-icon.animate .battery-bar-3{opacity:0;animation-delay:1.2s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"] }]
|
|
3420
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-full-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-full-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-full-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-full-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}.battery-full-icon.animate .battery-bar-3{opacity:0;animation-delay:1.2s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"] }]
|
|
3421
3421
|
}], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
3422
3422
|
|
|
3423
3423
|
class BatteryLowIcon {
|
|
@@ -3432,7 +3432,7 @@ class BatteryLowIcon {
|
|
|
3432
3432
|
handleMouseEnter(forced = false) {
|
|
3433
3433
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
3434
3434
|
this.isAnimating.set(true);
|
|
3435
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
3435
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 700);
|
|
3436
3436
|
}
|
|
3437
3437
|
}
|
|
3438
3438
|
constructor() {
|
|
@@ -3468,7 +3468,7 @@ class BatteryLowIcon {
|
|
|
3468
3468
|
<svg:line x1="22" x2="22" y1="11" y2="13" />
|
|
3469
3469
|
<svg:line class="battery-bar battery-bar-1" x1="6" x2="6" y1="11" y2="13" />
|
|
3470
3470
|
</svg>
|
|
3471
|
-
`, isInline: true, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3471
|
+
`, isInline: true, styles: [":host{display:inline-block}.battery-low-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-low-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-low-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3472
3472
|
}
|
|
3473
3473
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BatteryLowIcon, decorators: [{
|
|
3474
3474
|
type: Component,
|
|
@@ -3495,7 +3495,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3495
3495
|
'aria-label': 'battery-low',
|
|
3496
3496
|
role: 'img',
|
|
3497
3497
|
'(mouseenter)': 'handleMouseEnter()',
|
|
3498
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"] }]
|
|
3498
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-low-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-low-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-low-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"] }]
|
|
3499
3499
|
}], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
3500
3500
|
|
|
3501
3501
|
class BatteryMediumIcon {
|
|
@@ -3510,7 +3510,7 @@ class BatteryMediumIcon {
|
|
|
3510
3510
|
handleMouseEnter(forced = false) {
|
|
3511
3511
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
3512
3512
|
this.isAnimating.set(true);
|
|
3513
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
3513
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 1100);
|
|
3514
3514
|
}
|
|
3515
3515
|
}
|
|
3516
3516
|
constructor() {
|
|
@@ -3547,7 +3547,7 @@ class BatteryMediumIcon {
|
|
|
3547
3547
|
<svg:line class="battery-bar battery-bar-1" x1="6" x2="6" y1="11" y2="13" />
|
|
3548
3548
|
<svg:line class="battery-bar battery-bar-2" x1="10" x2="10" y1="11" y2="13" />
|
|
3549
3549
|
</svg>
|
|
3550
|
-
`, isInline: true, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3550
|
+
`, isInline: true, styles: [":host{display:inline-block}.battery-medium-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-medium-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-medium-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-medium-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3551
3551
|
}
|
|
3552
3552
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BatteryMediumIcon, decorators: [{
|
|
3553
3553
|
type: Component,
|
|
@@ -3575,7 +3575,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3575
3575
|
'aria-label': 'battery-medium',
|
|
3576
3576
|
role: 'img',
|
|
3577
3577
|
'(mouseenter)': 'handleMouseEnter()',
|
|
3578
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"] }]
|
|
3578
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-medium-icon{overflow:visible}.battery-bar{opacity:1;transition:opacity .3s ease}.battery-medium-icon.animate .battery-bar{animation:fadeInSequence .3s ease forwards}.battery-medium-icon.animate .battery-bar-1{opacity:0;animation-delay:.4s}.battery-medium-icon.animate .battery-bar-2{opacity:0;animation-delay:.8s}@keyframes fadeInSequence{0%{opacity:0}to{opacity:1}}\n"] }]
|
|
3579
3579
|
}], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
3580
3580
|
|
|
3581
3581
|
class BatteryWarningIcon {
|
|
@@ -3590,7 +3590,7 @@ class BatteryWarningIcon {
|
|
|
3590
3590
|
handleMouseEnter(forced = false) {
|
|
3591
3591
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
3592
3592
|
this.isAnimating.set(true);
|
|
3593
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
3593
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 1500);
|
|
3594
3594
|
}
|
|
3595
3595
|
}
|
|
3596
3596
|
constructor() {
|
|
@@ -3628,7 +3628,7 @@ class BatteryWarningIcon {
|
|
|
3628
3628
|
<svg:path d="M22 11v2" />
|
|
3629
3629
|
<svg:path d="M6 7H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2" />
|
|
3630
3630
|
</svg>
|
|
3631
|
-
`, isInline: true, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-icon.animate .battery-warning{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3631
|
+
`, isInline: true, styles: [":host{display:inline-block}.battery-warning-icon{overflow:visible}.battery-warning-icon.animate .battery-warning{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3632
3632
|
}
|
|
3633
3633
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BatteryWarningIcon, decorators: [{
|
|
3634
3634
|
type: Component,
|
|
@@ -3657,7 +3657,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3657
3657
|
'aria-label': 'battery-warning',
|
|
3658
3658
|
role: 'img',
|
|
3659
3659
|
'(mouseenter)': 'handleMouseEnter()',
|
|
3660
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-icon{overflow:visible}.battery-icon.animate .battery-warning{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}\n"] }]
|
|
3660
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.battery-warning-icon{overflow:visible}.battery-warning-icon.animate .battery-warning{opacity:0;animation:blink .5s 3}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}\n"] }]
|
|
3661
3661
|
}], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
3662
3662
|
|
|
3663
3663
|
class BatteryIcon {
|
|
@@ -3672,7 +3672,7 @@ class BatteryIcon {
|
|
|
3672
3672
|
handleMouseEnter(forced = false) {
|
|
3673
3673
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
3674
3674
|
this.isAnimating.set(true);
|
|
3675
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
3675
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 1500);
|
|
3676
3676
|
}
|
|
3677
3677
|
}
|
|
3678
3678
|
constructor() {
|
|
@@ -9990,7 +9990,7 @@ class CheckCheckIcon {
|
|
|
9990
9990
|
handleMouseEnter(forced = false) {
|
|
9991
9991
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
9992
9992
|
this.isAnimating.set(true);
|
|
9993
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
9993
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 500);
|
|
9994
9994
|
}
|
|
9995
9995
|
}
|
|
9996
9996
|
constructor() {
|
|
@@ -10066,7 +10066,7 @@ class CheckIcon {
|
|
|
10066
10066
|
handleMouseEnter(forced = false) {
|
|
10067
10067
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
10068
10068
|
this.isAnimating.set(true);
|
|
10069
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
10069
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 500);
|
|
10070
10070
|
}
|
|
10071
10071
|
}
|
|
10072
10072
|
constructor() {
|
|
@@ -11196,7 +11196,7 @@ class CircleAlertIcon {
|
|
|
11196
11196
|
handleMouseEnter(forced = false) {
|
|
11197
11197
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
11198
11198
|
this.isAnimating.set(true);
|
|
11199
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
11199
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 500);
|
|
11200
11200
|
}
|
|
11201
11201
|
}
|
|
11202
11202
|
constructor() {
|
|
@@ -11234,7 +11234,7 @@ class CircleAlertIcon {
|
|
|
11234
11234
|
<svg:line x1="12" x2="12.01" y1="16" y2="16" />
|
|
11235
11235
|
</svg:g>
|
|
11236
11236
|
</svg>
|
|
11237
|
-
`, isInline: true, styles: [":host{display:inline-block}.
|
|
11237
|
+
`, isInline: true, styles: [":host{display:inline-block}.circle-alert-icon.animate{animation:primaryAnimation .5s ease-in-out}@keyframes primaryAnimation{0%{transform:scale(1) rotate(0)}20%{transform:scale(1.1) rotate(-3deg)}40%{transform:scale(1.1) rotate(3deg)}60%{transform:scale(1.1) rotate(-2deg)}to{transform:scale(1) rotate(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
11238
11238
|
}
|
|
11239
11239
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CircleAlertIcon, decorators: [{
|
|
11240
11240
|
type: Component,
|
|
@@ -11263,7 +11263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
11263
11263
|
'aria-label': 'circle-alert',
|
|
11264
11264
|
role: 'img',
|
|
11265
11265
|
'(mouseenter)': 'handleMouseEnter()',
|
|
11266
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.
|
|
11266
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.circle-alert-icon.animate{animation:primaryAnimation .5s ease-in-out}@keyframes primaryAnimation{0%{transform:scale(1) rotate(0)}20%{transform:scale(1.1) rotate(-3deg)}40%{transform:scale(1.1) rotate(3deg)}60%{transform:scale(1.1) rotate(-2deg)}to{transform:scale(1) rotate(0)}}\n"] }]
|
|
11267
11267
|
}], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
11268
11268
|
|
|
11269
11269
|
class CircleArrowDownIcon {
|
|
@@ -35723,7 +35723,7 @@ class TriangleAlertIcon {
|
|
|
35723
35723
|
handleMouseEnter(forced = false) {
|
|
35724
35724
|
if (forced || (!this.animate() && !this.isAnimating())) {
|
|
35725
35725
|
this.isAnimating.set(true);
|
|
35726
|
-
this.#timer = setTimeout(() => this.isAnimating.set(false),
|
|
35726
|
+
this.#timer = setTimeout(() => this.isAnimating.set(false), 500);
|
|
35727
35727
|
}
|
|
35728
35728
|
}
|
|
35729
35729
|
constructor() {
|
|
@@ -35759,7 +35759,7 @@ class TriangleAlertIcon {
|
|
|
35759
35759
|
<svg:path d="M12 9v4" />
|
|
35760
35760
|
<svg:path d="M12 17h.01" />
|
|
35761
35761
|
</svg>
|
|
35762
|
-
`, isInline: true, styles: [":host{display:inline-block}.
|
|
35762
|
+
`, isInline: true, styles: [":host{display:inline-block}.triangle-alert-icon.animate{animation:primaryAnimation .5s ease-in-out}@keyframes primaryAnimation{0%{transform:scale(1) rotate(0)}20%{transform:scale(1.1) rotate(-3deg)}40%{transform:scale(1.1) rotate(3deg)}60%{transform:scale(1.1) rotate(-2deg)}to{transform:scale(1) rotate(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
35763
35763
|
}
|
|
35764
35764
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TriangleAlertIcon, decorators: [{
|
|
35765
35765
|
type: Component,
|
|
@@ -35786,7 +35786,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
35786
35786
|
'aria-label': 'triangle-alert',
|
|
35787
35787
|
role: 'img',
|
|
35788
35788
|
'(mouseenter)': 'handleMouseEnter()',
|
|
35789
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.
|
|
35789
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}.triangle-alert-icon.animate{animation:primaryAnimation .5s ease-in-out}@keyframes primaryAnimation{0%{transform:scale(1) rotate(0)}20%{transform:scale(1.1) rotate(-3deg)}40%{transform:scale(1.1) rotate(3deg)}60%{transform:scale(1.1) rotate(-2deg)}to{transform:scale(1) rotate(0)}}\n"] }]
|
|
35790
35790
|
}], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
35791
35791
|
|
|
35792
35792
|
class UmbrellaOffIcon {
|