@coreui/icons-angular 5.2.22 → 5.2.23

package/esm2022/lib/shared/html-attr.directive.mjs

@@ -1,28 +1,31 @@
-import { Directive, Input } from '@angular/core';
+import { Directive, effect, ElementRef, inject, input, Renderer2 } from '@angular/core';
 import * as i0 from "@angular/core";
 export class HtmlAttributesDirective {
-    constructor(renderer, el) {
-        this.renderer = renderer;
-        this.el = el;
-    }
-    ngOnInit() {
-        const attribs = this.cHtmlAttr;
-        for (const attr in attribs) {
-            if (attr === 'style' && typeof attribs[attr] === 'object') {
-                this.setStyle(attribs[attr]);
-            }
-            else if (attr === 'class') {
-                this.addClass(attribs[attr]);
-            }
-            else {
-                this.setAttrib(attr, attribs[attr]);
+    constructor() {
+        this.cHtmlAttr = input();
+        this.#renderer = inject(Renderer2);
+        this.#elementRef = inject(ElementRef);
+        this.attrEffect = effect(() => {
+            const attribs = this.cHtmlAttr();
+            for (const attr in attribs) {
+                if (attr === 'style' && typeof attribs[attr] === 'object') {
+                    this.setStyle(attribs[attr]);
+                }
+                else if (attr === 'class') {
+                    this.addClass(attribs[attr]);
+                }
+                else {
+                    this.setAttrib(attr, attribs[attr]);
+                }
             }
-        }
+        });
     }
+    #renderer;
+    #elementRef;
     setStyle(styles) {
         for (const style in styles) {
             if (style) {
-                this.renderer.setStyle(this.el.nativeElement, style, styles[style]);
+                this.#renderer.setStyle(this.#elementRef.nativeElement, style, styles[style]);
             }
         }
     }
@@ -31,16 +34,16 @@ export class HtmlAttributesDirective {
         classArray
             .filter((element) => element.length > 0)
             .forEach((element) => {
-            this.renderer.addClass(this.el.nativeElement, element);
+            this.#renderer.addClass(this.#elementRef.nativeElement, element);
         });
     }
     setAttrib(key, value) {
         value !== null
-            ? this.renderer.setAttribute(this.el.nativeElement, key, value)
-            : this.renderer.removeAttribute(this.el.nativeElement, key);
+            ? this.#renderer.setAttribute(this.#elementRef.nativeElement, key, value)
+            : this.#renderer.removeAttribute(this.#elementRef.nativeElement, key);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: HtmlAttributesDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.9", type: HtmlAttributesDirective, isStandalone: true, selector: "[cHtmlAttr]", inputs: { cHtmlAttr: "cHtmlAttr" }, exportAs: ["cHtmlAttr"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: HtmlAttributesDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.9", type: HtmlAttributesDirective, isStandalone: true, selector: "[cHtmlAttr]", inputs: { cHtmlAttr: { classPropertyName: "cHtmlAttr", publicName: "cHtmlAttr", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["cHtmlAttr"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: HtmlAttributesDirective, decorators: [{
             type: Directive,
@@ -49,7 +52,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
                     exportAs: 'cHtmlAttr',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { cHtmlAttr: [{
-                type: Input
-            }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaHRtbC1hdHRyLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvcmV1aS1pY29ucy1hbmd1bGFyL3NyYy9saWIvc2hhcmVkL2h0bWwtYXR0ci5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxLQUFLLEVBQXFCLE1BQU0sZUFBZSxDQUFDOztBQU9oRixNQUFNLE9BQU8sdUJBQXVCO0lBR2xDLFlBQ1UsUUFBbUIsRUFDbkIsRUFBYztRQURkLGFBQVEsR0FBUixRQUFRLENBQVc7UUFDbkIsT0FBRSxHQUFGLEVBQUUsQ0FBWTtJQUNyQixDQUFDO0lBRUosUUFBUTtRQUNOLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUM7UUFDL0IsS0FBSyxNQUFNLElBQUksSUFBSSxPQUFPLEVBQUUsQ0FBQztZQUMzQixJQUFJLElBQUksS0FBSyxPQUFPLElBQUksT0FBTyxPQUFPLENBQUMsSUFBSSxDQUFDLEtBQUssUUFBUSxFQUFFLENBQUM7Z0JBQzFELElBQUksQ0FBQyxRQUFRLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7WUFDL0IsQ0FBQztpQkFBTSxJQUFJLElBQUksS0FBSyxPQUFPLEVBQUUsQ0FBQztnQkFDNUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQztZQUMvQixDQUFDO2lCQUFNLENBQUM7Z0JBQ04sSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLEVBQUUsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7WUFDdEMsQ0FBQztRQUNILENBQUM7SUFDSCxDQUFDO0lBRU8sUUFBUSxDQUFDLE1BQTRCO1FBQzNDLEtBQUssTUFBTSxLQUFLLElBQUksTUFBTSxFQUFFLENBQUM7WUFDM0IsSUFBSSxLQUFLLEVBQUUsQ0FBQztnQkFDVixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsRUFBRSxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7WUFDdEUsQ0FBQztRQUNILENBQUM7SUFDSCxDQUFDO0lBRU8sUUFBUSxDQUFDLE9BQTBCO1FBQ3pDLE1BQU0sVUFBVSxHQUFHLEtBQUssQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUN6RSxVQUFVO2FBQ1AsTUFBTSxDQUFDLENBQUMsT0FBTyxFQUFFLEVBQUUsQ0FBQyxPQUFPLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQzthQUN2QyxPQUFPLENBQUMsQ0FBQyxPQUFPLEVBQUUsRUFBRTtZQUNuQixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsRUFBRSxPQUFPLENBQUMsQ0FBQztRQUN6RCxDQUFDLENBQUMsQ0FBQztJQUNQLENBQUM7SUFFTyxTQUFTLENBQUMsR0FBVyxFQUFFLEtBQW9CO1FBQ2pELEtBQUssS0FBSyxJQUFJO1lBQ1osQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxFQUFFLEdBQUcsRUFBRSxLQUFLLENBQUM7WUFDL0QsQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxFQUFFLEdBQUcsQ0FBQyxDQUFDO0lBQ2hFLENBQUM7OEdBMUNVLHVCQUF1QjtrR0FBdkIsdUJBQXVCOzsyRkFBdkIsdUJBQXVCO2tCQUxuQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxhQUFhO29CQUN2QixRQUFRLEVBQUUsV0FBVztvQkFDckIsVUFBVSxFQUFFLElBQUk7aUJBQ2pCO3VHQUVVLFNBQVM7c0JBQWpCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIElucHV0LCBPbkluaXQsIFJlbmRlcmVyMiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbY0h0bWxBdHRyXScsXG4gIGV4cG9ydEFzOiAnY0h0bWxBdHRyJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZVxufSlcbmV4cG9ydCBjbGFzcyBIdG1sQXR0cmlidXRlc0RpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIGNIdG1sQXR0cj86IHsgW2tleTogc3RyaW5nXTogYW55IH07XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyLFxuICAgIHByaXZhdGUgZWw6IEVsZW1lbnRSZWZcbiAgKSB7fVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIGNvbnN0IGF0dHJpYnMgPSB0aGlzLmNIdG1sQXR0cjtcbiAgICBmb3IgKGNvbnN0IGF0dHIgaW4gYXR0cmlicykge1xuICAgICAgaWYgKGF0dHIgPT09ICdzdHlsZScgJiYgdHlwZW9mIGF0dHJpYnNbYXR0cl0gPT09ICdvYmplY3QnKSB7XG4gICAgICAgIHRoaXMuc2V0U3R5bGUoYXR0cmlic1thdHRyXSk7XG4gICAgICB9IGVsc2UgaWYgKGF0dHIgPT09ICdjbGFzcycpIHtcbiAgICAgICAgdGhpcy5hZGRDbGFzcyhhdHRyaWJzW2F0dHJdKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXMuc2V0QXR0cmliKGF0dHIsIGF0dHJpYnNbYXR0cl0pO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgc2V0U3R5bGUoc3R5bGVzOiB7IFt4OiBzdHJpbmddOiBhbnkgfSk6IHZvaWQge1xuICAgIGZvciAoY29uc3Qgc3R5bGUgaW4gc3R5bGVzKSB7XG4gICAgICBpZiAoc3R5bGUpIHtcbiAgICAgICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZSh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQsIHN0eWxlLCBzdHlsZXNbc3R5bGVdKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBwcml2YXRlIGFkZENsYXNzKGNsYXNzZXM6IHN0cmluZyB8IHN0cmluZ1tdKTogdm9pZCB7XG4gICAgY29uc3QgY2xhc3NBcnJheSA9IEFycmF5LmlzQXJyYXkoY2xhc3NlcykgPyBjbGFzc2VzIDogY2xhc3Nlcy5zcGxpdCgnICcpO1xuICAgIGNsYXNzQXJyYXlcbiAgICAgIC5maWx0ZXIoKGVsZW1lbnQpID0+IGVsZW1lbnQubGVuZ3RoID4gMClcbiAgICAgIC5mb3JFYWNoKChlbGVtZW50KSA9PiB7XG4gICAgICAgIHRoaXMucmVuZGVyZXIuYWRkQ2xhc3ModGhpcy5lbC5uYXRpdmVFbGVtZW50LCBlbGVtZW50KTtcbiAgICAgIH0pO1xuICB9XG5cbiAgcHJpdmF0ZSBzZXRBdHRyaWIoa2V5OiBzdHJpbmcsIHZhbHVlOiBzdHJpbmcgfCBudWxsKTogdm9pZCB7XG4gICAgdmFsdWUgIT09IG51bGxcbiAgICAgID8gdGhpcy5yZW5kZXJlci5zZXRBdHRyaWJ1dGUodGhpcy5lbC5uYXRpdmVFbGVtZW50LCBrZXksIHZhbHVlKVxuICAgICAgOiB0aGlzLnJlbmRlcmVyLnJlbW92ZUF0dHJpYnV0ZSh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQsIGtleSk7XG4gIH1cbn1cbiJdfQ==
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaHRtbC1hdHRyLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvcmV1aS1pY29ucy1hbmd1bGFyL3NyYy9saWIvc2hhcmVkL2h0bWwtYXR0ci5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsVUFBVSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU94RixNQUFNLE9BQU8sdUJBQXVCO0lBTHBDO1FBTVcsY0FBUyxHQUFHLEtBQUssRUFBdUIsQ0FBQztRQUV6QyxjQUFTLEdBQUcsTUFBTSxDQUFDLFNBQVMsQ0FBQyxDQUFDO1FBQzlCLGdCQUFXLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBRWpDLGVBQVUsR0FBRyxNQUFNLENBQUMsR0FBRyxFQUFFO1lBQ2hDLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztZQUNqQyxLQUFLLE1BQU0sSUFBSSxJQUFJLE9BQU8sRUFBRSxDQUFDO2dCQUMzQixJQUFJLElBQUksS0FBSyxPQUFPLElBQUksT0FBTyxPQUFPLENBQUMsSUFBSSxDQUFDLEtBQUssUUFBUSxFQUFFLENBQUM7b0JBQzFELElBQUksQ0FBQyxRQUFRLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7Z0JBQy9CLENBQUM7cUJBQU0sSUFBSSxJQUFJLEtBQUssT0FBTyxFQUFFLENBQUM7b0JBQzVCLElBQUksQ0FBQyxRQUFRLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7Z0JBQy9CLENBQUM7cUJBQU0sQ0FBQztvQkFDTixJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksRUFBRSxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQztnQkFDdEMsQ0FBQztZQUNILENBQUM7UUFDSCxDQUFDLENBQUMsQ0FBQztLQXdCSjtJQXRDVSxTQUFTLENBQXFCO0lBQzlCLFdBQVcsQ0FBc0I7SUFlbEMsUUFBUSxDQUFDLE1BQTJCO1FBQzFDLEtBQUssTUFBTSxLQUFLLElBQUksTUFBTSxFQUFFLENBQUM7WUFDM0IsSUFBSSxLQUFLLEVBQUUsQ0FBQztnQkFDVixJQUFJLENBQUMsU0FBUyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLGFBQWEsRUFBRSxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7WUFDaEYsQ0FBQztRQUNILENBQUM7SUFDSCxDQUFDO0lBRU8sUUFBUSxDQUFDLE9BQTBCO1FBQ3pDLE1BQU0sVUFBVSxHQUFHLEtBQUssQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUN6RSxVQUFVO2FBQ1AsTUFBTSxDQUFDLENBQUMsT0FBTyxFQUFFLEVBQUUsQ0FBQyxPQUFPLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQzthQUN2QyxPQUFPLENBQUMsQ0FBQyxPQUFPLEVBQUUsRUFBRTtZQUNuQixJQUFJLENBQUMsU0FBUyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLGFBQWEsRUFBRSxPQUFPLENBQUMsQ0FBQztRQUNuRSxDQUFDLENBQUMsQ0FBQztJQUNQLENBQUM7SUFFTyxTQUFTLENBQUMsR0FBVyxFQUFFLEtBQW9CO1FBQ2pELEtBQUssS0FBSyxJQUFJO1lBQ1osQ0FBQyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsYUFBYSxFQUFFLEdBQUcsRUFBRSxLQUFLLENBQUM7WUFDekUsQ0FBQyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsYUFBYSxFQUFFLEdBQUcsQ0FBQyxDQUFDO0lBQzFFLENBQUM7OEdBeENVLHVCQUF1QjtrR0FBdkIsdUJBQXVCOzsyRkFBdkIsdUJBQXVCO2tCQUxuQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxhQUFhO29CQUN2QixRQUFRLEVBQUUsV0FBVztvQkFDckIsVUFBVSxFQUFFLElBQUk7aUJBQ2pCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBlZmZlY3QsIEVsZW1lbnRSZWYsIGluamVjdCwgaW5wdXQsIFJlbmRlcmVyMiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbY0h0bWxBdHRyXScsXG4gIGV4cG9ydEFzOiAnY0h0bWxBdHRyJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZVxufSlcbmV4cG9ydCBjbGFzcyBIdG1sQXR0cmlidXRlc0RpcmVjdGl2ZSB7XG4gIHJlYWRvbmx5IGNIdG1sQXR0ciA9IGlucHV0PFJlY29yZDxzdHJpbmcsIGFueT4+KCk7XG5cbiAgcmVhZG9ubHkgI3JlbmRlcmVyID0gaW5qZWN0KFJlbmRlcmVyMik7XG4gIHJlYWRvbmx5ICNlbGVtZW50UmVmID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuXG4gIHJlYWRvbmx5IGF0dHJFZmZlY3QgPSBlZmZlY3QoKCkgPT4ge1xuICAgIGNvbnN0IGF0dHJpYnMgPSB0aGlzLmNIdG1sQXR0cigpO1xuICAgIGZvciAoY29uc3QgYXR0ciBpbiBhdHRyaWJzKSB7XG4gICAgICBpZiAoYXR0ciA9PT0gJ3N0eWxlJyAmJiB0eXBlb2YgYXR0cmlic1thdHRyXSA9PT0gJ29iamVjdCcpIHtcbiAgICAgICAgdGhpcy5zZXRTdHlsZShhdHRyaWJzW2F0dHJdKTtcbiAgICAgIH0gZWxzZSBpZiAoYXR0ciA9PT0gJ2NsYXNzJykge1xuICAgICAgICB0aGlzLmFkZENsYXNzKGF0dHJpYnNbYXR0cl0pO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgdGhpcy5zZXRBdHRyaWIoYXR0ciwgYXR0cmlic1thdHRyXSk7XG4gICAgICB9XG4gICAgfVxuICB9KTtcblxuICBwcml2YXRlIHNldFN0eWxlKHN0eWxlczogUmVjb3JkPHN0cmluZywgYW55Pik6IHZvaWQge1xuICAgIGZvciAoY29uc3Qgc3R5bGUgaW4gc3R5bGVzKSB7XG4gICAgICBpZiAoc3R5bGUpIHtcbiAgICAgICAgdGhpcy4jcmVuZGVyZXIuc2V0U3R5bGUodGhpcy4jZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LCBzdHlsZSwgc3R5bGVzW3N0eWxlXSk7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBhZGRDbGFzcyhjbGFzc2VzOiBzdHJpbmcgfCBzdHJpbmdbXSk6IHZvaWQge1xuICAgIGNvbnN0IGNsYXNzQXJyYXkgPSBBcnJheS5pc0FycmF5KGNsYXNzZXMpID8gY2xhc3NlcyA6IGNsYXNzZXMuc3BsaXQoJyAnKTtcbiAgICBjbGFzc0FycmF5XG4gICAgICAuZmlsdGVyKChlbGVtZW50KSA9PiBlbGVtZW50Lmxlbmd0aCA+IDApXG4gICAgICAuZm9yRWFjaCgoZWxlbWVudCkgPT4ge1xuICAgICAgICB0aGlzLiNyZW5kZXJlci5hZGRDbGFzcyh0aGlzLiNlbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsIGVsZW1lbnQpO1xuICAgICAgfSk7XG4gIH1cblxuICBwcml2YXRlIHNldEF0dHJpYihrZXk6IHN0cmluZywgdmFsdWU6IHN0cmluZyB8IG51bGwpOiB2b2lkIHtcbiAgICB2YWx1ZSAhPT0gbnVsbFxuICAgICAgPyB0aGlzLiNyZW5kZXJlci5zZXRBdHRyaWJ1dGUodGhpcy4jZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LCBrZXksIHZhbHVlKVxuICAgICAgOiB0aGlzLiNyZW5kZXJlci5yZW1vdmVBdHRyaWJ1dGUodGhpcy4jZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LCBrZXkpO1xuICB9XG59XG4iXX0=

package/fesm2022/coreui-icons-angular.mjs

@@ -1,25 +1,23 @@
 import * as i0 from '@angular/core';
-import { Injectable, NgModule, Optional, SkipSelf, inject, ElementRef, signal, computed, afterNextRender, Directive, Input, HostBinding, Renderer2, Component, ViewChild } from '@angular/core';
+import { Injectable, NgModule, Optional, SkipSelf, inject, input, computed, Directive, Renderer2, ElementRef, effect, signal, viewChild, afterNextRender, Component } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { NgClass } from '@angular/common';
 
 class IconSetService {
-    constructor() {
-        this._iconNames = {};
-        this._icons = {};
-    }
     get iconNames() {
-        return this._iconNames;
+        return this.#iconNames;
     }
+    #iconNames = {};
     get icons() {
-        return this._icons;
+        return this.#icons;
     }
     set icons(iconSet) {
         for (const iconsKey in iconSet) {
-            this._iconNames[iconsKey] = iconsKey;
+            this.#iconNames[iconsKey] = iconsKey;
         }
-        this._icons = iconSet;
+        this.#icons = iconSet;
     }
+    #icons = {};
     getIcon(name) {
         const icon = this.icons[name];
         if (!icon) {
@@ -76,83 +74,68 @@ function transformName(value) {
 }
 
 class IconDirective {
-    #elementRef;
-    #sanitizer;
-    #iconSet;
     constructor() {
-        this.#elementRef = inject(ElementRef);
         this.#sanitizer = inject(DomSanitizer);
         this.#iconSet = inject(IconSetService);
-        this.#content = signal('');
-        this.size = '';
-        this.#name = signal('');
-        this.ariaHidden = true;
-        this.xmlns = 'http://www.w3.org/2000/svg';
-        this.pointerEvents = 'none';
-        this.role = 'img';
+        this.content = input(undefined, { alias: 'cIcon' });
+        this.customClasses = input();
+        this.size = input('');
+        this.title = input();
+        this.height = input();
+        this.width = input();
+        this.name = input('', { transform: transformName });
+        this.viewBoxInput = input(undefined, { alias: 'viewBox' });
+        this.xmlns = input('http://www.w3.org/2000/svg');
+        this.pointerEvents = input('none', { alias: 'pointer-events' });
+        this.role = input('img');
+        this.hostClasses = computed(() => {
+            const computedSize = this.computedSize();
+            const classes = {
+                icon: true,
+                [`icon-${computedSize}`]: !!computedSize
+            };
+            return this.customClasses() ?? classes;
+        });
+        this.viewBox = computed(() => {
+            return this.viewBoxInput() ?? this.scale();
+        });
         this.innerHtml = computed(() => {
-            const code = Array.isArray(this.code()) ? (this.code()[1] ?? this.code()[0] ?? '') : this.code() || '';
+            const codeVal = this.code();
+            const code = Array.isArray(codeVal) ? (codeVal?.[1] ?? codeVal?.[0] ?? '') : codeVal || '';
             // todo proper sanitize
             // const sanitized = this.sanitizer.sanitize(SecurityContext.HTML, code);
-            return this.#sanitizer.bypassSecurityTrustHtml(this.titleCode + code || '');
+            return this.#sanitizer.bypassSecurityTrustHtml(this.#titleCode() + code || '');
+        });
+        this.#titleCode = computed(() => {
+            return this.title() ? `<title>${this.title()}</title>` : '';
         });
         this.code = computed(() => {
-            if (this.#content()) {
-                return this.#content();
+            const content = this.content();
+            if (content) {
+                return content;
             }
-            if (this.#iconSet && this.#name()) {
-                return this.#iconSet.getIcon(this.#name());
+            const name = this.name();
+            if (this.#iconSet && name) {
+                return this.#iconSet.getIcon(name);
             }
-            if (this.#name() && !this.#iconSet?.icons[this.#name()]) {
-                console.warn(`cIcon directive: The '${this.#name()}' icon not found. Add it to the IconSet service for use with the 'name' property. \n`, this.#name());
+            if (name && !this.#iconSet?.icons[name]) {
+                console.warn(`cIcon directive: The '${name}' icon not found. Add it to the IconSet service for use with the 'name' property. \n`, name);
             }
             return '';
         });
         this.scale = computed(() => {
             return Array.isArray(this.code()) && (this.code()?.length ?? 0) > 1 ? `0 0 ${this.code()?.[0]}` : '0 0 64 64';
         });
-        afterNextRender({
-            write: () => {
-                this.#elementRef.nativeElement.innerHTML = this.innerHtml();
-            }
+        this.computedSize = computed(() => {
+            const addCustom = !this.size() && (this.width() || this.height());
+            return this.size() === 'custom' || addCustom ? 'custom-size' : this.size();
         });
     }
-    set content(value) {
-        this.#content.set(value);
-    }
-    #content;
-    set name(value) {
-        this.#name.set(value);
-    }
-    get name() {
-        return this.#name();
-    }
-    #name;
-    set viewBox(viewBox) {
-        this._viewBox = viewBox;
-    }
-    get viewBox() {
-        return this._viewBox ?? this.scale();
-    }
-    get hostClasses() {
-        return this.computedClasses;
-    }
-    get titleCode() {
-        return this.title ? `<title>${this.title}</title>` : '';
-    }
-    get computedSize() {
-        const addCustom = !this.size && (this.width || this.height);
-        return this.size === 'custom' || addCustom ? 'custom-size' : this.size;
-    }
-    get computedClasses() {
-        const classes = {
-            icon: true,
-            [`icon-${this.computedSize}`]: !!this.computedSize
-        };
-        return this.customClasses ?? classes;
-    }
+    #sanitizer;
+    #iconSet;
+    #titleCode;
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: IconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.2.9", type: IconDirective, isStandalone: true, selector: "svg[cIcon]", inputs: { content: ["cIcon", "content"], customClasses: "customClasses", size: "size", title: "title", height: "height", width: "width", name: ["name", "name", transformName], viewBox: "viewBox", xmlns: "xmlns", pointerEvents: ["pointer-events", "pointerEvents"], role: "role" }, host: { attributes: { "ngSkipHydration": "true" }, properties: { "innerHtml": "innerHtml()", "attr.viewBox": "this.viewBox", "attr.aria-hidden": "this.ariaHidden", "attr.xmlns": "this.xmlns", "attr.pointer-events": "this.pointerEvents", "attr.role": "this.role", "class": "this.hostClasses" } }, exportAs: ["cIcon"], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.9", type: IconDirective, isStandalone: true, selector: "svg[cIcon]", inputs: { content: { classPropertyName: "content", publicName: "cIcon", isSignal: true, isRequired: false, transformFunction: null }, customClasses: { classPropertyName: "customClasses", publicName: "customClasses", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, viewBoxInput: { classPropertyName: "viewBoxInput", publicName: "viewBox", isSignal: true, isRequired: false, transformFunction: null }, xmlns: { classPropertyName: "xmlns", publicName: "xmlns", isSignal: true, isRequired: false, transformFunction: null }, pointerEvents: { classPropertyName: "pointerEvents", publicName: "pointer-events", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "ngSkipHydration": "true" }, properties: { "innerHtml": "innerHtml()", "class": "hostClasses()", "attr.viewBox": "viewBox()", "attr.xmlns": "xmlns()", "attr.pointer-events": "pointerEvents()", "attr.role": "role()", "attr.aria-hidden": "true" } }, exportAs: ["cIcon"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: IconDirective, decorators: [{
             type: Directive,
@@ -160,76 +143,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
                     exportAs: 'cIcon',
                     selector: 'svg[cIcon]',
                     standalone: true,
-                    host: { ngSkipHydration: 'true', '[innerHtml]': 'innerHtml()' }
+                    host: {
+                        ngSkipHydration: 'true',
+                        '[innerHtml]': 'innerHtml()',
+                        '[class]': 'hostClasses()',
+                        '[attr.viewBox]': 'viewBox()',
+                        '[attr.xmlns]': 'xmlns()',
+                        '[attr.pointer-events]': 'pointerEvents()',
+                        '[attr.role]': 'role()',
+                        '[attr.aria-hidden]': 'true'
+                    }
                 }]
-        }], ctorParameters: () => [], propDecorators: { content: [{
-                type: Input,
-                args: ['cIcon']
-            }], customClasses: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], height: [{
-                type: Input
-            }], width: [{
-                type: Input
-            }], name: [{
-                type: Input,
-                args: [{ transform: transformName }]
-            }], viewBox: [{
-                type: HostBinding,
-                args: ['attr.viewBox']
-            }, {
-                type: Input
-            }], ariaHidden: [{
-                type: HostBinding,
-                args: ['attr.aria-hidden']
-            }], xmlns: [{
-                type: HostBinding,
-                args: ['attr.xmlns']
-            }, {
-                type: Input
-            }], pointerEvents: [{
-                type: HostBinding,
-                args: ['attr.pointer-events']
-            }, {
-                type: Input,
-                args: ['pointer-events']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }, {
-                type: Input
-            }], hostClasses: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
+        }] });
 
 class HtmlAttributesDirective {
-    constructor(renderer, el) {
-        this.renderer = renderer;
-        this.el = el;
-    }
-    ngOnInit() {
-        const attribs = this.cHtmlAttr;
-        for (const attr in attribs) {
-            if (attr === 'style' && typeof attribs[attr] === 'object') {
-                this.setStyle(attribs[attr]);
-            }
-            else if (attr === 'class') {
-                this.addClass(attribs[attr]);
-            }
-            else {
-                this.setAttrib(attr, attribs[attr]);
+    constructor() {
+        this.cHtmlAttr = input();
+        this.#renderer = inject(Renderer2);
+        this.#elementRef = inject(ElementRef);
+        this.attrEffect = effect(() => {
+            const attribs = this.cHtmlAttr();
+            for (const attr in attribs) {
+                if (attr === 'style' && typeof attribs[attr] === 'object') {
+                    this.setStyle(attribs[attr]);
+                }
+                else if (attr === 'class') {
+                    this.addClass(attribs[attr]);
+                }
+                else {
+                    this.setAttrib(attr, attribs[attr]);
+                }
             }
-        }
+        });
     }
+    #renderer;
+    #elementRef;
     setStyle(styles) {
         for (const style in styles) {
             if (style) {
-                this.renderer.setStyle(this.el.nativeElement, style, styles[style]);
+                this.#renderer.setStyle(this.#elementRef.nativeElement, style, styles[style]);
             }
         }
     }
@@ -238,16 +190,16 @@ class HtmlAttributesDirective {
         classArray
             .filter((element) => element.length > 0)
             .forEach((element) => {
-            this.renderer.addClass(this.el.nativeElement, element);
+            this.#renderer.addClass(this.#elementRef.nativeElement, element);
         });
     }
     setAttrib(key, value) {
         value !== null
-            ? this.renderer.setAttribute(this.el.nativeElement, key, value)
-            : this.renderer.removeAttribute(this.el.nativeElement, key);
+            ? this.#renderer.setAttribute(this.#elementRef.nativeElement, key, value)
+            : this.#renderer.removeAttribute(this.#elementRef.nativeElement, key);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: HtmlAttributesDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.9", type: HtmlAttributesDirective, isStandalone: true, selector: "[cHtmlAttr]", inputs: { cHtmlAttr: "cHtmlAttr" }, exportAs: ["cHtmlAttr"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: HtmlAttributesDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.9", type: HtmlAttributesDirective, isStandalone: true, selector: "[cHtmlAttr]", inputs: { cHtmlAttr: { classPropertyName: "cHtmlAttr", publicName: "cHtmlAttr", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["cHtmlAttr"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: HtmlAttributesDirective, decorators: [{
             type: Directive,
@@ -256,120 +208,97 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
                     exportAs: 'cHtmlAttr',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { cHtmlAttr: [{
-                type: Input
-            }] } });
+        }] });
 
 class IconComponent {
     #renderer;
     #elementRef;
     #sanitizer;
     #iconSet;
+    #hostElement;
     constructor() {
         this.#renderer = inject(Renderer2);
         this.#elementRef = inject(ElementRef);
         this.#sanitizer = inject(DomSanitizer);
         this.#iconSet = inject(IconSetService);
-        this.#content = signal('');
-        this.attributes = { role: 'img' };
-        this.size = '';
-        this.use = '';
-        this.#name = signal('');
+        this.#hostElement = signal(undefined);
+        this.content = input();
+        this.attributes = input({ role: 'img' });
+        this.customClasses = input();
+        this.size = input('');
+        this.title = input();
+        this.use = input('');
+        this.height = input();
+        this.width = input();
+        this.name = input('', { transform: transformName });
+        this.viewBoxInput = input(undefined, { alias: 'viewBox' });
+        this.svgElementRef = viewChild('svgElement');
+        this.svgElementEffect = effect(() => {
+            const svgElementRef = this.svgElementRef();
+            const hostElement = this.#hostElement()?.nativeElement;
+            if (svgElementRef && hostElement) {
+                const svgElement = svgElementRef.nativeElement;
+                hostElement.classList?.values()?.forEach((item) => {
+                    this.#renderer.addClass(svgElement, item);
+                });
+                const parentElement = this.#renderer.parentNode(hostElement);
+                this.#renderer.insertBefore(parentElement, svgElement, hostElement);
+                this.#renderer.removeChild(parentElement, hostElement);
+            }
+        });
+        this.viewBox = computed(() => {
+            return this.viewBoxInput() ?? this.scale();
+        });
         this.innerHtml = computed(() => {
-            const code = Array.isArray(this.code()) ? (this.code()[1] ?? this.code()[0] ?? '') : this.code() || '';
+            const codeVal = this.code();
+            const code = Array.isArray(codeVal) ? (codeVal?.[1] ?? codeVal?.[0] ?? '') : codeVal || '';
             // todo proper sanitize
             // const sanitized = this.sanitizer.sanitize(SecurityContext.HTML, code);
-            return this.#sanitizer.bypassSecurityTrustHtml(this.titleCode + code || '');
+            return this.#sanitizer.bypassSecurityTrustHtml(this.#titleCode() + code || '');
+        });
+        this.#titleCode = computed(() => {
+            return this.title() ? `<title>${this.title()}</title>` : '';
         });
         this.code = computed(() => {
-            if (this.#content()) {
-                return this.#content();
+            const content = this.content();
+            if (content) {
+                return content;
             }
-            if (this.#iconSet && this.#name()) {
-                return this.#iconSet.getIcon(this.#name());
+            const name = this.name();
+            if (this.#iconSet && name) {
+                return this.#iconSet.getIcon(name);
             }
-            if (this.#name() && !this.#iconSet?.icons[this.#name()]) {
-                console.warn(`c-icon component: icon name '${this.#name()}' does not exist for IconSet service. ` +
-                    `To use icon by 'name' prop you need to add it to IconSet service. \n`, this.#name());
+            if (name && !this.#iconSet?.icons[name]) {
+                console.warn(`c-icon component: The '${name}' icon not found. Add it to the IconSet service for use with the 'name' property. \n`, name);
             }
             return '';
         });
         this.scale = computed(() => {
-            return Array.isArray(this.code()) && this.code().length > 1 ? `0 0 ${this.code()[0]}` : '0 0 64 64';
+            return Array.isArray(this.code()) && (this.code()?.length ?? 0) > 1 ? `0 0 ${this.code()?.[0]}` : '0 0 64 64';
         });
-        this.#renderer.setStyle(this.#elementRef.nativeElement, 'display', 'none');
-    }
-    set content(value) {
-        this.#content.set(value);
-    }
-    #content;
-    set name(value) {
-        this.#name.set(value);
-    }
-    get name() {
-        return this.#name();
-    }
-    #name;
-    set viewBox(viewBox) {
-        this._viewBox = viewBox;
-    }
-    get viewBox() {
-        return this._viewBox ?? this.scale();
-    }
-    ngAfterViewInit() {
-        this.#elementRef.nativeElement.classList.forEach((item) => {
-            this.#renderer.addClass(this.svgElementRef.nativeElement, item);
+        this.computedSize = computed(() => {
+            const addCustom = !this.size() && (this.width() || this.height());
+            return this.size() === 'custom' || addCustom ? 'custom-size' : this.size();
+        });
+        this.computedClasses = computed(() => {
+            const classes = {
+                icon: true,
+                [`icon-${this.computedSize()}`]: !!this.computedSize()
+            };
+            return this.customClasses() ?? classes;
+        });
+        afterNextRender(() => {
+            this.#hostElement.set(this.#elementRef);
         });
-        const parentElement = this.#renderer.parentNode(this.#elementRef.nativeElement);
-        const svgElement = this.svgElementRef.nativeElement;
-        this.#renderer.insertBefore(parentElement, svgElement, this.#elementRef.nativeElement);
-        this.#renderer.removeChild(parentElement, this.#elementRef.nativeElement);
-    }
-    get titleCode() {
-        return this.title ? `<title>${this.title}</title>` : '';
-    }
-    get computedSize() {
-        const addCustom = !this.size && (this.width || this.height);
-        return this.size === 'custom' || addCustom ? 'custom-size' : this.size;
-    }
-    get computedClasses() {
-        const classes = {
-            icon: true,
-            [`icon-${this.computedSize}`]: !!this.computedSize
-        };
-        return this.customClasses ?? classes;
     }
+    #titleCode;
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: IconComponent, isStandalone: true, selector: "c-icon", inputs: { content: "content", attributes: "attributes", customClasses: "customClasses", size: "size", title: "title", use: "use", height: "height", width: "width", name: ["name", "name", transformName], viewBox: "viewBox" }, host: { attributes: { "ngSkipHydration": "true" } }, viewQueries: [{ propertyName: "svgElementRef", first: true, predicate: ["svgElement"], descendants: true, read: ElementRef }], exportAs: ["cIconComponent"], ngImport: i0, template: "@if (!use && !!code) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width\"\n    [attr.height]=\"height || width\"\n    [attr.viewBox]=\"viewBox\"\n    [innerHtml]=\"innerHtml()\"\n    [ngClass]=\"computedClasses\"\n    [cHtmlAttr]=\"attributes\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n  </svg>\n} @else if (use) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width\"\n    [attr.height]=\"height || width\"\n    [ngClass]=\"computedClasses\"\n    [cHtmlAttr]=\"attributes\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n    <use [attr.href]=\"use\"></use>\n  </svg>\n}\n", styles: [".icon{display:inline-block;color:inherit;text-align:center;vertical-align:-.125rem;fill:currentColor}.icon:not(.icon-c-s):not(.icon-custom-size){width:1rem;height:1rem;font-size:1rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xxl{width:2rem;height:2rem;font-size:2rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xl{width:1.5rem;height:1.5rem;font-size:1.5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-lg{width:1.25rem;height:1.25rem;font-size:1.25rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-sm{width:.875rem;height:.875rem;font-size:.875rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-3xl{width:3rem;height:3rem;font-size:3rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-4xl{width:4rem;height:4rem;font-size:4rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-5xl{width:5rem;height:5rem;font-size:5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-6xl{width:6rem;height:6rem;font-size:6rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-7xl{width:7rem;height:7rem;font-size:7rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-8xl{width:8rem;height:8rem;font-size:8rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-9xl{width:9rem;height:9rem;font-size:9rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: HtmlAttributesDirective, selector: "[cHtmlAttr]", inputs: ["cHtmlAttr"], exportAs: ["cHtmlAttr"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: IconComponent, isStandalone: true, selector: "c-icon", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, attributes: { classPropertyName: "attributes", publicName: "attributes", isSignal: true, isRequired: false, transformFunction: null }, customClasses: { classPropertyName: "customClasses", publicName: "customClasses", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, use: { classPropertyName: "use", publicName: "use", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, viewBoxInput: { classPropertyName: "viewBoxInput", publicName: "viewBox", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "ngSkipHydration": "true" }, styleAttribute: "display: none" }, viewQueries: [{ propertyName: "svgElementRef", first: true, predicate: ["svgElement"], descendants: true, isSignal: true }], exportAs: ["cIconComponent"], ngImport: i0, template: "@if (!use() && !!code()) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"height() || width()\"\n    [attr.viewBox]=\"viewBox() ?? scale()\"\n    [innerHtml]=\"innerHtml()\"\n    [ngClass]=\"computedClasses()\"\n    [cHtmlAttr]=\"attributes()\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n  </svg>\n} @else if (use()) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"height() || width()\"\n    [ngClass]=\"computedClasses()\"\n    [cHtmlAttr]=\"attributes()\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n    <use [attr.href]=\"use()\"></use>\n  </svg>\n}\n", styles: [".icon{display:inline-block;color:inherit;text-align:center;vertical-align:-.125rem;fill:currentColor}.icon:not(.icon-c-s):not(.icon-custom-size){width:1rem;height:1rem;font-size:1rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xxl{width:2rem;height:2rem;font-size:2rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xl{width:1.5rem;height:1.5rem;font-size:1.5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-lg{width:1.25rem;height:1.25rem;font-size:1.25rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-sm{width:.875rem;height:.875rem;font-size:.875rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-3xl{width:3rem;height:3rem;font-size:3rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-4xl{width:4rem;height:4rem;font-size:4rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-5xl{width:5rem;height:5rem;font-size:5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-6xl{width:6rem;height:6rem;font-size:6rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-7xl{width:7rem;height:7rem;font-size:7rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-8xl{width:8rem;height:8rem;font-size:8rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-9xl{width:9rem;height:9rem;font-size:9rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: HtmlAttributesDirective, selector: "[cHtmlAttr]", inputs: ["cHtmlAttr"], exportAs: ["cHtmlAttr"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: IconComponent, decorators: [{
             type: Component,
-            args: [{ exportAs: 'cIconComponent', imports: [NgClass, HtmlAttributesDirective], selector: 'c-icon', standalone: true, host: { ngSkipHydration: 'true' }, template: "@if (!use && !!code) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width\"\n    [attr.height]=\"height || width\"\n    [attr.viewBox]=\"viewBox\"\n    [innerHtml]=\"innerHtml()\"\n    [ngClass]=\"computedClasses\"\n    [cHtmlAttr]=\"attributes\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n  </svg>\n} @else if (use) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width\"\n    [attr.height]=\"height || width\"\n    [ngClass]=\"computedClasses\"\n    [cHtmlAttr]=\"attributes\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n    <use [attr.href]=\"use\"></use>\n  </svg>\n}\n", styles: [".icon{display:inline-block;color:inherit;text-align:center;vertical-align:-.125rem;fill:currentColor}.icon:not(.icon-c-s):not(.icon-custom-size){width:1rem;height:1rem;font-size:1rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xxl{width:2rem;height:2rem;font-size:2rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xl{width:1.5rem;height:1.5rem;font-size:1.5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-lg{width:1.25rem;height:1.25rem;font-size:1.25rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-sm{width:.875rem;height:.875rem;font-size:.875rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-3xl{width:3rem;height:3rem;font-size:3rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-4xl{width:4rem;height:4rem;font-size:4rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-5xl{width:5rem;height:5rem;font-size:5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-6xl{width:6rem;height:6rem;font-size:6rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-7xl{width:7rem;height:7rem;font-size:7rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-8xl{width:8rem;height:8rem;font-size:8rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-9xl{width:9rem;height:9rem;font-size:9rem}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { content: [{
-                type: Input
-            }], attributes: [{
-                type: Input
-            }], customClasses: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], use: [{
-                type: Input
-            }], height: [{
-                type: Input
-            }], width: [{
-                type: Input
-            }], name: [{
-                type: Input,
-                args: [{ transform: transformName }]
-            }], viewBox: [{
-                type: Input
-            }], svgElementRef: [{
-                type: ViewChild,
-                args: ['svgElement', { read: ElementRef }]
-            }] } });
+            args: [{ exportAs: 'cIconComponent', imports: [NgClass, HtmlAttributesDirective], selector: 'c-icon', standalone: true, host: { ngSkipHydration: 'true', style: 'display: none' }, template: "@if (!use() && !!code()) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"height() || width()\"\n    [attr.viewBox]=\"viewBox() ?? scale()\"\n    [innerHtml]=\"innerHtml()\"\n    [ngClass]=\"computedClasses()\"\n    [cHtmlAttr]=\"attributes()\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n  </svg>\n} @else if (use()) {\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"height() || width()\"\n    [ngClass]=\"computedClasses()\"\n    [cHtmlAttr]=\"attributes()\"\n    aria-hidden=\"true\"\n    pointer-events=\"none\"\n    role=\"img\"\n    #svgElement\n  >\n    <use [attr.href]=\"use()\"></use>\n  </svg>\n}\n", styles: [".icon{display:inline-block;color:inherit;text-align:center;vertical-align:-.125rem;fill:currentColor}.icon:not(.icon-c-s):not(.icon-custom-size){width:1rem;height:1rem;font-size:1rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xxl{width:2rem;height:2rem;font-size:2rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-xl{width:1.5rem;height:1.5rem;font-size:1.5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-lg{width:1.25rem;height:1.25rem;font-size:1.25rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-sm{width:.875rem;height:.875rem;font-size:.875rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-3xl{width:3rem;height:3rem;font-size:3rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-4xl{width:4rem;height:4rem;font-size:4rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-5xl{width:5rem;height:5rem;font-size:5rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-6xl{width:6rem;height:6rem;font-size:6rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-7xl{width:7rem;height:7rem;font-size:7rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-8xl{width:8rem;height:8rem;font-size:8rem}.icon:not(.icon-c-s):not(.icon-custom-size).icon-9xl{width:9rem;height:9rem;font-size:9rem}\n"] }]
+        }], ctorParameters: () => [] });
 
 class IconModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: IconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }