ngxi
Version:
Icon set for Angular applications
60 lines (59 loc) • 2.83 kB
JavaScript
import { isPlatformServer } from "@angular/common";
import * as i0 from "@angular/core";
import { inject, PLATFORM_ID, ElementRef, Renderer2, input, computed, effect, Directive } from "@angular/core";
class Ngxi {
constructor() {
this.platform = 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.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", "");
return;
}
if (this.el.nativeElement.hasAttribute("data-ngxi-ssr")) {
this.el.nativeElement.removeAttribute("data-ngxi-ssr");
if (this.el.nativeElement.innerHTML === icon.body) {
return;
}
}
this.renderer.setProperty(this.el.nativeElement, "innerHTML", icon.body);
});
}
static {
this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", 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 });
}
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Ngxi, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: "svg[ngxi]",
host: {
"role": "img",
"[attr.width]": "resolvedWidth()",
"[attr.height]": "resolvedHeight()",
"[attr.viewBox]": "resolvedViewBox()"
}
}]
}] });
export {
Ngxi
};
//# sourceMappingURL=index.js.map