icon.component.mjs 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. import { NgClass } from '@angular/common';
  2. import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
  3. import * as i0 from "@angular/core";
  4. export class IconComponent {
  5. constructor() {
  6. this.icon = '';
  7. this.iconClass = '';
  8. this.fill = 'currentColor';
  9. this.strokeWidth = 1.5;
  10. this.strokeColor = 'currentColor';
  11. this.size = '6';
  12. this.iconPath = '';
  13. }
  14. ngOnInit() {
  15. this.iconPath = this.getIconPath();
  16. this.strokeColor = this.getFormattedColor(this.strokeColor);
  17. this.fill = this.getFormattedColor(this.fill);
  18. }
  19. getFormattedColor(color) {
  20. if (color.startsWith('--')) {
  21. const rgbValue = getComputedStyle(document.documentElement).getPropertyValue(color).trim();
  22. return `rgb(${rgbValue})`;
  23. }
  24. return color;
  25. }
  26. getIconPath() {
  27. return `assets/icons.svg#${this.icon}`;
  28. }
  29. static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
  30. 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]=\"iconPath\"></use>\n</svg>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
  31. }
  32. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconComponent, decorators: [{
  33. type: Component,
  34. 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]=\"iconPath\"></use>\n</svg>\n" }]
  35. }], propDecorators: { icon: [{
  36. type: Input
  37. }], iconClass: [{
  38. type: Input
  39. }], fill: [{
  40. type: Input
  41. }], strokeWidth: [{
  42. type: Input
  43. }], strokeColor: [{
  44. type: Input
  45. }], size: [{
  46. type: Input
  47. }] } });
  48. //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jaXJjbGV0b25lL3NyYy9saWIvY29tcG9uZW50cy9hdG9tcy9pY29uL2ljb24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2lyY2xldG9uZS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvaWNvbi9pY29uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMxQyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxNQUFNLGVBQWUsQ0FBQzs7QUFTbEYsTUFBTSxPQUFPLGFBQWE7SUFQMUI7UUFRVyxTQUFJLEdBQUcsRUFBRSxDQUFDO1FBQ1YsY0FBUyxHQUFHLEVBQUUsQ0FBQztRQUNmLFNBQUksR0FBRyxjQUFjLENBQUM7UUFDdEIsZ0JBQVcsR0FBRyxHQUFHLENBQUM7UUFDbEIsZ0JBQVcsR0FBRyxjQUFjLENBQUM7UUFDN0IsU0FBSSxHQUFHLEdBQUcsQ0FBQztRQUNwQixhQUFRLEdBQUcsRUFBRSxDQUFDO0tBbUJmO0lBakJDLFFBQVE7UUFDTixJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUNuQyxJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDNUQsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ2hELENBQUM7SUFFRCxpQkFBaUIsQ0FBQyxLQUFhO1FBQzdCLElBQUksS0FBSyxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDO1lBQzNCLE1BQU0sUUFBUSxHQUFHLGdCQUFnQixDQUFDLFFBQVEsQ0FBQyxlQUFlLENBQUMsQ0FBQyxnQkFBZ0IsQ0FBQyxLQUFLLENBQUMsQ0FBQyxJQUFJLEVBQUUsQ0FBQztZQUMzRixPQUFPLE9BQU8sUUFBUSxHQUFHLENBQUM7UUFDNUIsQ0FBQztRQUNELE9BQU8sS0FBSyxDQUFDO0lBQ2YsQ0FBQztJQUVELFdBQVc7UUFDVCxPQUFPLG9CQUFvQixJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDekMsQ0FBQzs4R0F6QlUsYUFBYTtrR0FBYixhQUFhLHlNQ1YxQixzTkFRQSw0Q0RGWSxPQUFPOzsyRkFJTixhQUFhO2tCQVB6QixTQUFTOytCQUNFLFNBQVMsY0FDUCxJQUFJLFdBQ1AsQ0FBQyxPQUFPLENBQUMsbUJBRUQsdUJBQXVCLENBQUMsTUFBTTs4QkFHdEMsSUFBSTtzQkFBWixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ0NsYXNzIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY3QtaWNvbicsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtOZ0NsYXNzXSxcbiAgdGVtcGxhdGVVcmw6ICcuL2ljb24uY29tcG9uZW50Lmh0bWwnLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgSWNvbkNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIGljb24gPSAnJztcbiAgQElucHV0KCkgaWNvbkNsYXNzID0gJyc7XG4gIEBJbnB1dCgpIGZpbGwgPSAnY3VycmVudENvbG9yJztcbiAgQElucHV0KCkgc3Ryb2tlV2lkdGggPSAxLjU7XG4gIEBJbnB1dCgpIHN0cm9rZUNvbG9yID0gJ2N1cnJlbnRDb2xvcic7XG4gIEBJbnB1dCgpIHNpemUgPSAnNic7XG4gIGljb25QYXRoID0gJyc7XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5pY29uUGF0aCA9IHRoaXMuZ2V0SWNvblBhdGgoKTtcbiAgICB0aGlzLnN0cm9rZUNvbG9yID0gdGhpcy5nZXRGb3JtYXR0ZWRDb2xvcih0aGlzLnN0cm9rZUNvbG9yKTtcbiAgICB0aGlzLmZpbGwgPSB0aGlzLmdldEZvcm1hdHRlZENvbG9yKHRoaXMuZmlsbCk7XG4gIH1cblxuICBnZXRGb3JtYXR0ZWRDb2xvcihjb2xvcjogc3RyaW5nKTogc3RyaW5nIHtcbiAgICBpZiAoY29sb3Iuc3RhcnRzV2l0aCgnLS0nKSkge1xuICAgICAgY29uc3QgcmdiVmFsdWUgPSBnZXRDb21wdXRlZFN0eWxlKGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkuZ2V0UHJvcGVydHlWYWx1ZShjb2xvcikudHJpbSgpO1xuICAgICAgcmV0dXJuIGByZ2IoJHtyZ2JWYWx1ZX0pYDtcbiAgICB9XG4gICAgcmV0dXJuIGNvbG9yO1xuICB9XG5cbiAgZ2V0SWNvblBhdGgoKSB7XG4gICAgcmV0dXJuIGBhc3NldHMvaWNvbnMuc3ZnIyR7dGhpcy5pY29ufWA7XG4gIH1cbn1cbiIsIjxzdmdcbiAgW25nQ2xhc3NdPVwiaWNvbkNsYXNzXCJcbiAgW2F0dHIuZmlsbF09XCJmaWxsXCJcbiAgW2F0dHIuc3Ryb2tlLXdpZHRoXT1cInN0cm9rZVdpZHRoXCJcbiAgW2F0dHIuc3Ryb2tlXT1cInN0cm9rZUNvbG9yXCJcbiAgY2xhc3M9XCJmbGV4IHNpemUtZnVsbFwiPlxuICA8dXNlIFthdHRyLnhsaW5rOmhyZWZdPVwiaWNvblBhdGhcIj48L3VzZT5cbjwvc3ZnPlxuIl19