Update to v0.15.0

esm2022/public-api.mjs

@@ -3,4 +3,5 @@
  */
 export * from './tailwind-preset';
 export * from './lib/components/atoms/button/button.component';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2NpcmNsZXRvbmUvc3JjL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLG1CQUFtQixDQUFDO0FBRWxDLGNBQWMsZ0RBQWdELENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIGNpcmNsZXRvbmVcbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL3RhaWx3aW5kLXByZXNldCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvYXRvbXMvYnV0dG9uL2J1dHRvbi5jb21wb25lbnQnO1xuIl19
+export * from './lib/components/atoms/icon/icon.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2NpcmNsZXRvbmUvc3JjL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLG1CQUFtQixDQUFDO0FBRWxDLGNBQWMsZ0RBQWdELENBQUM7QUFDL0QsY0FBYyw0Q0FBNEMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2YgY2lyY2xldG9uZVxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vdGFpbHdpbmQtcHJlc2V0JztcblxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9hdG9tcy9idXR0b24vYnV0dG9uLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2F0b21zL2ljb24vaWNvbi5jb21wb25lbnQnO1xuIl19

fesm2022/circletone.mjs

@@ -84,6 +84,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: Input
             }] } });
 
+class IconComponent {
+    constructor() {
+        this.icon = '';
+        this.iconClass = '';
+        this.fill = 'currentColor';
+        this.strokeWidth = 1.5;
+        this.strokeColor = 'currentColor';
+        this.size = '6';
+        this.iconPath = '';
+    }
+    ngOnInit() {
+        this.iconPath = this.getIconPath();
+        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 ` assets/images/icons.svg#${this.icon}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconComponent, deps: [], 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]=\"iconPath\"></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]=\"iconPath\"></use>\n</svg>\n" }]
+        }], propDecorators: { icon: [{
+                type: Input
+            }], iconClass: [{
+                type: Input
+            }], fill: [{
+                type: Input
+            }], strokeWidth: [{
+                type: Input
+            }], strokeColor: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }] } });
+
 /*
  * Public API Surface of circletone
  */
@@ -92,5 +137,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ButtonComponent, tailwindPreset };
+export { ButtonComponent, IconComponent, tailwindPreset };
 //# sourceMappingURL=circletone.mjs.map

lib/components/atoms/icon/icon.component.d.ts

@@ -0,0 +1,16 @@
+import { OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class IconComponent implements OnInit {
+    icon: string;
+    iconClass: string;
+    fill: string;
+    strokeWidth: number;
+    strokeColor: string;
+    size: string;
+    iconPath: string;
+    ngOnInit(): void;
+    getFormattedColor(color: string): string;
+    getIconPath(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IconComponent, "ct-icon", never, { "icon": { "alias": "icon"; "required": false; }; "iconClass": { "alias": "iconClass"; "required": false; }; "fill": { "alias": "fill"; "required": false; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; }; "strokeColor": { "alias": "strokeColor"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, true, never>;
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "circletone",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "peerDependencies": {
     "@angular/common": "^17.3.0",
     "@angular/core": "^17.3.0"

public-api.d.ts

@@ -1,2 +1,3 @@
 export * from './tailwind-preset';
 export * from './lib/components/atoms/button/button.component';
+export * from './lib/components/atoms/icon/icon.component';