@ngxi/eva 0.12.18 → 0.12.20

package/dist/index.js

@@ -1,6 +1,7 @@
 import * as i0 from "@angular/core";
-import { inject, PLATFORM_ID, ElementRef, Renderer2, input, computed, effect, Directive } from "@angular/core";
+import { inject, PLATFORM_ID, ElementRef, Renderer2, input, computed, effect, SecurityContext, Directive } from "@angular/core";
 import { isPlatformServer } from "@angular/common";
+import { DomSanitizer } from "@angular/platform-browser";
 const evaActivityFill = {
   "body": '<path fill="currentColor" d="M14.33 20h-.21a2 2 0 0 1-1.76-1.58L9.68 6l-2.76 6.4A1 1 0 0 1 6 13H3a1 1 0 0 1 0-2h2.34l2.51-5.79a2 2 0 0 1 3.79.38L14.32 18l2.76-6.38A1 1 0 0 1 18 11h3a1 1 0 0 1 0 2h-2.34l-2.51 5.79A2 2 0 0 1 14.33 20"/>',
   "width": 24,
@@ -2943,44 +2944,47 @@ const evaWifiOutline = {
 };
 class Ngxi {
   constructor() {
-    this.platform = inject(PLATFORM_ID);
+    this.platformId = inject(PLATFORM_ID);
     this.el = inject(ElementRef);
     this.renderer = inject(Renderer2);
-    this.icon = input(null);
-    this.width = input();
-    this.height = input();
-    this.viewBox = input();
-    this.resolvedWidth = computed(() => this.width() ?? this.icon()?.width);
-    this.resolvedHeight = computed(() => this.height() ?? this.icon()?.height);
-    this.resolvedViewBox = computed(() => this.viewBox() ?? this.icon()?.viewBox);
+    this.sanitizer = inject(DomSanitizer);
+    this.icon = input(null, ...[]);
+    this.width = input(...[]);
+    this.height = input(...[]);
+    this.viewBox = input(...[]);
+    this.resolvedWidth = computed(() => this.width() ?? this.icon()?.width, ...[]);
+    this.resolvedHeight = computed(() => this.height() ?? this.icon()?.height, ...[]);
+    this.resolvedViewBox = computed(() => this.viewBox() ?? this.icon()?.viewBox, ...[]);
     this.setBody = effect(() => {
       const icon = this.icon();
       if (!icon) {
         this.renderer.setProperty(this.el.nativeElement, "innerHTML", "");
         return;
       }
-      if (isPlatformServer(this.platform)) {
-        this.el.nativeElement.innerHTML = icon.body;
-        this.el.nativeElement.setAttribute("data-ngxi-ssr", "");
+      const sanitizedBody = this.sanitizer.sanitize(SecurityContext.HTML, icon.body);
+      if (isPlatformServer(this.platformId)) {
+        this.renderer.setProperty(this.el.nativeElement, "innerHTML", sanitizedBody);
+        this.renderer.setAttribute(this.el.nativeElement, "data-ngxi-ssr", "");
         return;
       }
       if (this.el.nativeElement.hasAttribute("data-ngxi-ssr")) {
-        this.el.nativeElement.removeAttribute("data-ngxi-ssr");
-        if (this.el.nativeElement.innerHTML === icon.body) {
+        if (this.el.nativeElement.innerHTML.trim() === sanitizedBody?.trim()) {
+          this.renderer.removeAttribute(this.el.nativeElement, "data-ngxi-ssr");
           return;
         }
+        this.renderer.removeAttribute(this.el.nativeElement, "data-ngxi-ssr");
       }
-      this.renderer.setProperty(this.el.nativeElement, "innerHTML", icon.body);
-    });
+      this.renderer.setProperty(this.el.nativeElement, "innerHTML", sanitizedBody);
+    }, ...[]);
   }
   static {
-    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Ngxi, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.2", ngImport: i0, type: Ngxi, deps: [], target: i0.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: Ngxi, isStandalone: true, selector: "svg[ngxi]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, viewBox: { classPropertyName: "viewBox", publicName: "viewBox", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "img" }, properties: { "attr.width": "resolvedWidth()", "attr.height": "resolvedHeight()", "attr.viewBox": "resolvedViewBox()" } }, ngImport: i0 });
+    this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.2", type: Ngxi, isStandalone: true, selector: "svg[ngxi]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, viewBox: { classPropertyName: "viewBox", publicName: "viewBox", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "img" }, properties: { "attr.width": "resolvedWidth()", "attr.height": "resolvedHeight()", "attr.viewBox": "resolvedViewBox()" } }, ngImport: i0 });
   }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Ngxi, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.2", ngImport: i0, type: Ngxi, decorators: [{
   type: Directive,
   args: [{
     standalone: true,
@@ -2995,16 +2999,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 }] });
 class NgxiEva {
   constructor() {
-    this.ngxiEva = input.required();
+    this.ngxiEva = input.required(...[]);
   }
   static {
-    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NgxiEva, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.2", ngImport: i0, type: NgxiEva, deps: [], target: i0.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: NgxiEva, isStandalone: true, selector: "svg[ngxiEva]", inputs: { ngxiEva: { classPropertyName: "ngxiEva", publicName: "ngxiEva", isSignal: true, isRequired: true, transformFunction: null } }, hostDirectives: [{ directive: Ngxi, inputs: ["icon", "ngxiEva", "width", "width", "height", "height", "viewBox", "viewBox"] }], ngImport: i0 });
+    this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.2", type: NgxiEva, isStandalone: true, selector: "svg[ngxiEva]", inputs: { ngxiEva: { classPropertyName: "ngxiEva", publicName: "ngxiEva", isSignal: true, isRequired: true, transformFunction: null } }, hostDirectives: [{ directive: Ngxi, inputs: ["icon", "ngxiEva", "width", "width", "height", "height", "viewBox", "viewBox"] }], ngImport: i0 });
   }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NgxiEva, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.2", ngImport: i0, type: NgxiEva, decorators: [{
   type: Directive,
   args: [{
     standalone: true,