@hugeicons/angular
Version:
HugeIcons Pro Angular Component Library https://hugeicons.com
114 lines • 10.2 kB
JavaScript
import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
import { CommonModule } from '@angular/common';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class HugeiconsIconComponent {
size = 24;
strokeWidth;
absoluteStrokeWidth = false;
icon;
altIcon;
color = 'currentColor';
class = '';
showAlt = false;
paths = [];
ngOnInit() {
this.updatePaths();
}
ngOnChanges(changes) {
this.updatePaths();
}
updatePaths() {
const currentIcon = this.showAlt && this.altIcon ? this.altIcon : this.icon;
if (!currentIcon || !Array.isArray(currentIcon)) {
this.paths = [];
return;
}
const calculatedStrokeWidth = this.strokeWidth !== undefined
? (this.absoluteStrokeWidth ? (Number(this.strokeWidth) * 24) / Number(this.size) : this.strokeWidth)
: undefined;
const strokeProps = calculatedStrokeWidth !== undefined ? {
strokeWidth: calculatedStrokeWidth,
stroke: 'currentColor'
} : {};
this.paths = currentIcon.map(([_, attrs]) => ({
d: attrs['d'],
fill: attrs['fill'] || 'none',
opacity: attrs['opacity'],
fillRule: attrs['fillRule'],
...strokeProps
}));
}
trackByFn(index) {
return index;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HugeiconsIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: HugeiconsIconComponent, isStandalone: true, selector: "hugeicons-icon", inputs: { size: "size", strokeWidth: "strokeWidth", absoluteStrokeWidth: "absoluteStrokeWidth", icon: "icon", altIcon: "altIcon", color: "color", class: "class", showAlt: "showAlt" }, usesOnChanges: true, ngImport: i0, template: `
<svg
[attr.width]="size"
[attr.height]="size"
viewBox="0 0 24 24"
fill="none"
[attr.color]="color"
[class]="class"
xmlns="http://www.w3.org/2000/svg"
>
<path
*ngFor="let path of paths; trackBy: trackByFn"
[attr.d]="path.d"
[attr.fill]="path.fill"
[attr.opacity]="path.opacity"
[attr.fill-rule]="path.fillRule"
[attr.stroke]="path.stroke"
[attr.stroke-width]="path.strokeWidth"
/>
</svg>
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HugeiconsIconComponent, decorators: [{
type: Component,
args: [{
selector: 'hugeicons-icon',
standalone: true,
imports: [CommonModule],
template: `
<svg
[attr.width]="size"
[attr.height]="size"
viewBox="0 0 24 24"
fill="none"
[attr.color]="color"
[class]="class"
xmlns="http://www.w3.org/2000/svg"
>
<path
*ngFor="let path of paths; trackBy: trackByFn"
[attr.d]="path.d"
[attr.fill]="path.fill"
[attr.opacity]="path.opacity"
[attr.fill-rule]="path.fillRule"
[attr.stroke]="path.stroke"
[attr.stroke-width]="path.strokeWidth"
/>
</svg>
`,
changeDetection: ChangeDetectionStrategy.OnPush
}]
}], propDecorators: { size: [{
type: Input
}], strokeWidth: [{
type: Input
}], absoluteStrokeWidth: [{
type: Input
}], icon: [{
type: Input
}], altIcon: [{
type: Input
}], color: [{
type: Input
}], class: [{
type: Input
}], showAlt: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaHVnZWljb25zLWljb24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvaHVnZWljb25zLWljb24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLHVCQUF1QixFQUFvQyxNQUFNLGVBQWUsQ0FBQztBQUM1RyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7OztBQStCL0MsTUFBTSxPQUFPLHNCQUFzQjtJQUN4QixJQUFJLEdBQW9CLEVBQUUsQ0FBQztJQUMzQixXQUFXLENBQVU7SUFDckIsbUJBQW1CLEdBQUcsS0FBSyxDQUFDO0lBQzVCLElBQUksQ0FBaUI7SUFDckIsT0FBTyxDQUFpQjtJQUN4QixLQUFLLEdBQUcsY0FBYyxDQUFDO0lBQ3ZCLEtBQUssR0FBRyxFQUFFLENBQUM7SUFDWCxPQUFPLEdBQUcsS0FBSyxDQUFDO0lBRXpCLEtBQUssR0FPQSxFQUFFLENBQUM7SUFFUixRQUFRO1FBQ04sSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFFRCxXQUFXLENBQUMsT0FBc0I7UUFDaEMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFFTyxXQUFXO1FBQ2pCLE1BQU0sV0FBVyxHQUFHLElBQUksQ0FBQyxPQUFPLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQztRQUU1RSxJQUFJLENBQUMsV0FBVyxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxXQUFXLENBQUMsRUFBRTtZQUMvQyxJQUFJLENBQUMsS0FBSyxHQUFHLEVBQUUsQ0FBQztZQUNoQixPQUFPO1NBQ1I7UUFFRCxNQUFNLHFCQUFxQixHQUFHLElBQUksQ0FBQyxXQUFXLEtBQUssU0FBUztZQUMxRCxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsR0FBRyxFQUFFLENBQUMsR0FBRyxNQUFNLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDO1lBQ3JHLENBQUMsQ0FBQyxTQUFTLENBQUM7UUFFZCxNQUFNLFdBQVcsR0FBRyxxQkFBcUIsS0FBSyxTQUFTLENBQUMsQ0FBQyxDQUFDO1lBQ3hELFdBQVcsRUFBRSxxQkFBcUI7WUFDbEMsTUFBTSxFQUFFLGNBQWM7U0FDdkIsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1FBRVAsSUFBSSxDQUFDLEtBQUssR0FBRyxXQUFXLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsS0FBSyxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7WUFDNUMsQ0FBQyxFQUFFLEtBQUssQ0FBQyxHQUFHLENBQUM7WUFDYixJQUFJLEVBQUUsS0FBSyxDQUFDLE1BQU0sQ0FBQyxJQUFJLE1BQU07WUFDN0IsT0FBTyxFQUFFLEtBQUssQ0FBQyxTQUFTLENBQUM7WUFDekIsUUFBUSxFQUFFLEtBQUssQ0FBQyxVQUFVLENBQUM7WUFDM0IsR0FBRyxXQUFXO1NBQ2YsQ0FBQyxDQUFDLENBQUM7SUFDTixDQUFDO0lBRUQsU0FBUyxDQUFDLEtBQWE7UUFDckIsT0FBTyxLQUFLLENBQUM7SUFDZixDQUFDO3dHQXZEVSxzQkFBc0I7NEZBQXRCLHNCQUFzQix1UkF4QnZCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW9CVCwyREFyQlMsWUFBWTs7NEZBeUJYLHNCQUFzQjtrQkE1QmxDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGdCQUFnQjtvQkFDMUIsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLE9BQU8sRUFBRSxDQUFDLFlBQVksQ0FBQztvQkFDdkIsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW9CVDtvQkFDRCxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtpQkFDaEQ7OEJBR1UsSUFBSTtzQkFBWixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csbUJBQW1CO3NCQUEzQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgT25Jbml0LCBPbkNoYW5nZXMsIFNpbXBsZUNoYW5nZXMgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBJY29uU3ZnT2JqZWN0IH0gZnJvbSAnLi4vbGliL3R5cGVzJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnaHVnZWljb25zLWljb24nLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlXSxcbiAgdGVtcGxhdGU6IGBcbiAgICA8c3ZnXG4gICAgICBbYXR0ci53aWR0aF09XCJzaXplXCJcbiAgICAgIFthdHRyLmhlaWdodF09XCJzaXplXCJcbiAgICAgIHZpZXdCb3g9XCIwIDAgMjQgMjRcIlxuICAgICAgZmlsbD1cIm5vbmVcIlxuICAgICAgW2F0dHIuY29sb3JdPVwiY29sb3JcIlxuICAgICAgW2NsYXNzXT1cImNsYXNzXCJcbiAgICAgIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIlxuICAgID5cbiAgICAgIDxwYXRoXG4gICAgICAgICpuZ0Zvcj1cImxldCBwYXRoIG9mIHBhdGhzOyB0cmFja0J5OiB0cmFja0J5Rm5cIlxuICAgICAgICBbYXR0ci5kXT1cInBhdGguZFwiXG4gICAgICAgIFthdHRyLmZpbGxdPVwicGF0aC5maWxsXCJcbiAgICAgICAgW2F0dHIub3BhY2l0eV09XCJwYXRoLm9wYWNpdHlcIlxuICAgICAgICBbYXR0ci5maWxsLXJ1bGVdPVwicGF0aC5maWxsUnVsZVwiXG4gICAgICAgIFthdHRyLnN0cm9rZV09XCJwYXRoLnN0cm9rZVwiXG4gICAgICAgIFthdHRyLnN0cm9rZS13aWR0aF09XCJwYXRoLnN0cm9rZVdpZHRoXCJcbiAgICAgIC8+XG4gICAgPC9zdmc+XG4gIGAsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoXG59KVxuXG5leHBvcnQgY2xhc3MgSHVnZWljb25zSWNvbkNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25DaGFuZ2VzIHtcbiAgQElucHV0KCkgc2l6ZTogc3RyaW5nIHwgbnVtYmVyID0gMjQ7XG4gIEBJbnB1dCgpIHN0cm9rZVdpZHRoPzogbnVtYmVyO1xuICBASW5wdXQoKSBhYnNvbHV0ZVN0cm9rZVdpZHRoID0gZmFsc2U7XG4gIEBJbnB1dCgpIGljb24hOiBJY29uU3ZnT2JqZWN0O1xuICBASW5wdXQoKSBhbHRJY29uPzogSWNvblN2Z09iamVjdDtcbiAgQElucHV0KCkgY29sb3IgPSAnY3VycmVudENvbG9yJztcbiAgQElucHV0KCkgY2xhc3MgPSAnJztcbiAgQElucHV0KCkgc2hvd0FsdCA9IGZhbHNlO1xuXG4gIHBhdGhzOiBBcnJheTx7XG4gICAgZDogc3RyaW5nO1xuICAgIGZpbGw6IHN0cmluZztcbiAgICBvcGFjaXR5Pzogc3RyaW5nO1xuICAgIGZpbGxSdWxlPzogc3RyaW5nO1xuICAgIHN0cm9rZT86IHN0cmluZztcbiAgICBzdHJva2VXaWR0aD86IG51bWJlcjtcbiAgfT4gPSBbXTtcblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLnVwZGF0ZVBhdGhzKCk7XG4gIH1cblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKSB7XG4gICAgdGhpcy51cGRhdGVQYXRocygpO1xuICB9XG5cbiAgcHJpdmF0ZSB1cGRhdGVQYXRocygpIHtcbiAgICBjb25zdCBjdXJyZW50SWNvbiA9IHRoaXMuc2hvd0FsdCAmJiB0aGlzLmFsdEljb24gPyB0aGlzLmFsdEljb24gOiB0aGlzLmljb247XG5cbiAgICBpZiAoIWN1cnJlbnRJY29uIHx8ICFBcnJheS5pc0FycmF5KGN1cnJlbnRJY29uKSkge1xuICAgICAgdGhpcy5wYXRocyA9IFtdO1xuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIGNvbnN0IGNhbGN1bGF0ZWRTdHJva2VXaWR0aCA9IHRoaXMuc3Ryb2tlV2lkdGggIT09IHVuZGVmaW5lZFxuICAgICAgPyAodGhpcy5hYnNvbHV0ZVN0cm9rZVdpZHRoID8gKE51bWJlcih0aGlzLnN0cm9rZVdpZHRoKSAqIDI0KSAvIE51bWJlcih0aGlzLnNpemUpIDogdGhpcy5zdHJva2VXaWR0aClcbiAgICAgIDogdW5kZWZpbmVkO1xuXG4gICAgY29uc3Qgc3Ryb2tlUHJvcHMgPSBjYWxjdWxhdGVkU3Ryb2tlV2lkdGggIT09IHVuZGVmaW5lZCA/IHtcbiAgICAgIHN0cm9rZVdpZHRoOiBjYWxjdWxhdGVkU3Ryb2tlV2lkdGgsXG4gICAgICBzdHJva2U6ICdjdXJyZW50Q29sb3InXG4gICAgfSA6IHt9O1xuXG4gICAgdGhpcy5wYXRocyA9IGN1cnJlbnRJY29uLm1hcCgoW18sIGF0dHJzXSkgPT4gKHtcbiAgICAgIGQ6IGF0dHJzWydkJ10sXG4gICAgICBmaWxsOiBhdHRyc1snZmlsbCddIHx8ICdub25lJyxcbiAgICAgIG9wYWNpdHk6IGF0dHJzWydvcGFjaXR5J10sXG4gICAgICBmaWxsUnVsZTogYXR0cnNbJ2ZpbGxSdWxlJ10sXG4gICAgICAuLi5zdHJva2VQcm9wc1xuICAgIH0pKTtcbiAgfVxuXG4gIHRyYWNrQnlGbihpbmRleDogbnVtYmVyKSB7XG4gICAgcmV0dXJuIGluZGV4O1xuICB9XG59Il19