12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061 |
- import { DOCUMENT, NgClass } from '@angular/common';
- import { ChangeDetectionStrategy, Component, Inject, Input } from '@angular/core';
- import { icons } from './icon.constants';
- import * as i0 from "@angular/core";
- export class IconComponent {
- constructor(renderer, document, el) {
- this.renderer = renderer;
- this.document = document;
- this.el = el;
- this.icon = '';
- this.iconClass = '';
- this.fill = 'currentColor';
- this.strokeWidth = 1.5;
- this.strokeColor = 'currentColor';
- this.size = '6';
- this.iconPath = '';
- }
- ngOnInit() {
- this.injectSVG();
- this.strokeColor = this.getFormattedColor(this.strokeColor);
- this.fill = this.getFormattedColor(this.fill);
- }
- getFormattedColor(color) {
- if (color.startsWith('--')) {
- const rgbValue = getComputedStyle(document.documentElement).getPropertyValue(color).trim();
- return `rgb(${rgbValue})`;
- }
- return color;
- }
- getIconPath() {
- return `#${this.icon}`;
- }
- injectSVG() {
- const svgElement = this.renderer.createElement('div');
- this.renderer.setProperty(svgElement, 'innerHTML', icons);
- this.renderer.setStyle(svgElement, 'display', 'none');
- this.renderer.appendChild(this.document.body, svgElement);
- }
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconComponent, deps: [{ token: i0.Renderer2 }, { token: DOCUMENT }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: IconComponent, isStandalone: true, selector: "ct-icon", inputs: { icon: "icon", iconClass: "iconClass", fill: "fill", strokeWidth: "strokeWidth", strokeColor: "strokeColor", size: "size" }, ngImport: i0, template: "<svg\n [ngClass]=\"iconClass\"\n [attr.fill]=\"fill\"\n [attr.stroke-width]=\"strokeWidth\"\n [attr.stroke]=\"strokeColor\"\n class=\"flex size-full\">\n <use [attr.xlink:href]=\"getIconPath()\"></use>\n</svg>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
- }
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconComponent, decorators: [{
- type: Component,
- args: [{ selector: 'ct-icon', standalone: true, imports: [NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg\n [ngClass]=\"iconClass\"\n [attr.fill]=\"fill\"\n [attr.stroke-width]=\"strokeWidth\"\n [attr.stroke]=\"strokeColor\"\n class=\"flex size-full\">\n <use [attr.xlink:href]=\"getIconPath()\"></use>\n</svg>\n" }]
- }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: Document, decorators: [{
- type: Inject,
- args: [DOCUMENT]
- }] }, { type: i0.ElementRef }], propDecorators: { icon: [{
- type: Input
- }], iconClass: [{
- type: Input
- }], fill: [{
- type: Input
- }], strokeWidth: [{
- type: Input
- }], strokeColor: [{
- type: Input
- }], size: [{
- type: Input
- }] } });
|