fancy-ui-core 0.0.1

package/README.md

@@ -0,0 +1,7 @@
+# core
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test core` to execute the unit tests.

package/esm2022/fancy-ui-core.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmFuY3ktdWktY29yZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvcmUvc3JjL2ZhbmN5LXVpLWNvcmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLFNBQVMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9pbmRleCc7XG4iXX0=

package/esm2022/index.mjs

@@ -0,0 +1,4 @@
+export * from './lib/icon/icon.component';
+export * from './lib/button/button.component';
+export * from './lib/provide';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wYWNrYWdlcy9jb3JlL3NyYy9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLDJCQUEyQixDQUFDO0FBQzFDLGNBQWMsK0JBQStCLENBQUM7QUFFOUMsY0FBYyxlQUFlLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2xpYi9pY29uL2ljb24uY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2J1dHRvbi9idXR0b24uY29tcG9uZW50JztcblxuZXhwb3J0ICogZnJvbSAnLi9saWIvcHJvdmlkZSc7XG4iXX0=

package/esm2022/lib/button/button.component.mjs

@@ -0,0 +1,36 @@
+import { Component, EventEmitter, Output, input, viewChild } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { timer } from 'rxjs';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+export class ButtonComponent {
+    constructor() {
+        /** The label of the Button. */
+        this.label = input('');
+        /** Flag to show the butto in a disabled state. */
+        this.disabled = input(false);
+        /** An event called if the button is tapped. */
+        this.tap = new EventEmitter();
+        this.waveSpan = viewChild('wave');
+        this.animate = false;
+    }
+    click(event) {
+        const waveSpan = this.waveSpan();
+        if (waveSpan) {
+            waveSpan.nativeElement.style.left = event.offsetX + 'px';
+            waveSpan.nativeElement.style.top = event.offsetY + 'px';
+        }
+        this.animate = true;
+        timer(800).subscribe(() => this.animate = false);
+        this.tap.next();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.2.1", type: ButtonComponent, isStandalone: true, selector: "fui-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tap: "tap" }, viewQueries: [{ propertyName: "waveSpan", first: true, predicate: ["wave"], descendants: true, isSignal: true }], ngImport: i0, template: "<button (click)=\"tap.next()\" [disabled]=\"disabled()\" class=\"bg-primary rounded overflow-hidden group relative hover:shadow\" >\n    <div class=\"text-on-primary p-component rounded\" [ngClass]=\"{'group-hover:bg-hover': !animate, 'bg-primary': animate}\" (click)=\"click($event)\">{{label()}}</div>\n    <span #wave class=\"absolute w-full h-full rounded-[50%] bg-tint animate-ripple\" [ngClass]=\"{'hidden': !animate}\"></span>\n</button>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fui-button', standalone: true, imports: [CommonModule], template: "<button (click)=\"tap.next()\" [disabled]=\"disabled()\" class=\"bg-primary rounded overflow-hidden group relative hover:shadow\" >\n    <div class=\"text-on-primary p-component rounded\" [ngClass]=\"{'group-hover:bg-hover': !animate, 'bg-primary': animate}\" (click)=\"click($event)\">{{label()}}</div>\n    <span #wave class=\"absolute w-full h-full rounded-[50%] bg-tint animate-ripple\" [ngClass]=\"{'hidden': !animate}\"></span>\n</button>\n" }]
+        }], propDecorators: { tap: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvcmUvc3JjL2xpYi9idXR0b24vYnV0dG9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvcmUvc3JjL2xpYi9idXR0b24vYnV0dG9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsWUFBWSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzlGLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sTUFBTSxDQUFDOzs7QUFRN0IsTUFBTSxPQUFPLGVBQWU7SUFONUI7UUFPRSwrQkFBK0I7UUFDL0IsVUFBSyxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNsQixrREFBa0Q7UUFDbEQsYUFBUSxHQUFHLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN4QiwrQ0FBK0M7UUFFL0MsUUFBRyxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7UUFFL0IsYUFBUSxHQUFHLFNBQVMsQ0FBYSxNQUFNLENBQUMsQ0FBQztRQUV6QyxZQUFPLEdBQUcsS0FBSyxDQUFDO0tBYWpCO0lBWEMsS0FBSyxDQUFDLEtBQTBDO1FBQzlDLE1BQU0sUUFBUSxHQUFHLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUNqQyxJQUFHLFFBQVEsRUFBRSxDQUFDO1lBQ1osUUFBUSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsSUFBSSxHQUFHLEtBQUssQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDO1lBQ3pELFFBQVEsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLEdBQUcsR0FBRyxLQUFLLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQztRQUMxRCxDQUFDO1FBQ0QsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUM7UUFDcEIsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQyxDQUFDO1FBQ2pELElBQUksQ0FBQyxHQUFHLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDbEIsQ0FBQzs4R0F0QlUsZUFBZTtrR0FBZixlQUFlLHNkQ1Y1QixnY0FJQSwyQ0RHWSxZQUFZOzsyRkFHWCxlQUFlO2tCQU4zQixTQUFTOytCQUNFLFlBQVksY0FDVixJQUFJLFdBQ1AsQ0FBQyxZQUFZLENBQUM7OEJBVXZCLEdBQUc7c0JBREYsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgRXZlbnRFbWl0dGVyLCBPdXRwdXQsIGlucHV0LCB2aWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyB0aW1lciB9IGZyb20gJ3J4anMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdmdWktYnV0dG9uJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gIHRlbXBsYXRlVXJsOiAnLi9idXR0b24uY29tcG9uZW50Lmh0bWwnXG59KVxuZXhwb3J0IGNsYXNzIEJ1dHRvbkNvbXBvbmVudCB7XG4gIC8qKiBUaGUgbGFiZWwgb2YgdGhlIEJ1dHRvbi4gKi9cbiAgbGFiZWwgPSBpbnB1dCgnJyk7XG4gIC8qKiBGbGFnIHRvIHNob3cgdGhlIGJ1dHRvIGluIGEgZGlzYWJsZWQgc3RhdGUuICovXG4gIGRpc2FibGVkID0gaW5wdXQoZmFsc2UpO1xuICAvKiogQW4gZXZlbnQgY2FsbGVkIGlmIHRoZSBidXR0b24gaXMgdGFwcGVkLiAqL1xuICBAT3V0cHV0KClcbiAgdGFwID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuXG4gIHdhdmVTcGFuID0gdmlld0NoaWxkPEVsZW1lbnRSZWY+KCd3YXZlJyk7XG5cbiAgYW5pbWF0ZSA9IGZhbHNlO1xuXG4gIGNsaWNrKGV2ZW50OiB7IG9mZnNldFg6IG51bWJlciwgb2Zmc2V0WTogbnVtYmVyfSkge1xuICAgIGNvbnN0IHdhdmVTcGFuID0gdGhpcy53YXZlU3BhbigpO1xuICAgIGlmKHdhdmVTcGFuKSB7XG4gICAgICB3YXZlU3Bhbi5uYXRpdmVFbGVtZW50LnN0eWxlLmxlZnQgPSBldmVudC5vZmZzZXRYICsgJ3B4JztcbiAgICAgIHdhdmVTcGFuLm5hdGl2ZUVsZW1lbnQuc3R5bGUudG9wID0gZXZlbnQub2Zmc2V0WSArICdweCc7XG4gICAgfVxuICAgIHRoaXMuYW5pbWF0ZSA9IHRydWU7XG4gICAgdGltZXIoODAwKS5zdWJzY3JpYmUoKCkgPT4gdGhpcy5hbmltYXRlID0gZmFsc2UpO1xuICAgIHRoaXMudGFwLm5leHQoKTtcbiAgfVxuXG59XG4iLCI8YnV0dG9uIChjbGljayk9XCJ0YXAubmV4dCgpXCIgW2Rpc2FibGVkXT1cImRpc2FibGVkKClcIiBjbGFzcz1cImJnLXByaW1hcnkgcm91bmRlZCBvdmVyZmxvdy1oaWRkZW4gZ3JvdXAgcmVsYXRpdmUgaG92ZXI6c2hhZG93XCIgPlxuICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LW9uLXByaW1hcnkgcC1jb21wb25lbnQgcm91bmRlZFwiIFtuZ0NsYXNzXT1cInsnZ3JvdXAtaG92ZXI6YmctaG92ZXInOiAhYW5pbWF0ZSwgJ2JnLXByaW1hcnknOiBhbmltYXRlfVwiIChjbGljayk9XCJjbGljaygkZXZlbnQpXCI+e3tsYWJlbCgpfX08L2Rpdj5cbiAgICA8c3BhbiAjd2F2ZSBjbGFzcz1cImFic29sdXRlIHctZnVsbCBoLWZ1bGwgcm91bmRlZC1bNTAlXSBiZy10aW50IGFuaW1hdGUtcmlwcGxlXCIgW25nQ2xhc3NdPVwieydoaWRkZW4nOiAhYW5pbWF0ZX1cIj48L3NwYW4+XG48L2J1dHRvbj5cbiJdfQ==

package/esm2022/lib/icon/icon.component.mjs

@@ -0,0 +1,20 @@
+import { Component, input } from '@angular/core';
+import { NgIconComponent } from '@ng-icons/core';
+import * as i0 from "@angular/core";
+export class IconComponent {
+    constructor() {
+        this.name = input.required();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.2.1", type: IconComponent, isStandalone: true, selector: "fui-icon", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `<ng-icon [name]="name()"></ng-icon>`, isInline: true, dependencies: [{ kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: IconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'fui-icon',
+                    standalone: true,
+                    imports: [NgIconComponent],
+                    template: `<ng-icon [name]="name()"></ng-icon>`
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wYWNrYWdlcy9jb3JlL3NyYy9saWIvaWNvbi9pY29uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7O0FBUWpELE1BQU0sT0FBTyxhQUFhO0lBTjFCO1FBT0UsU0FBSSxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQVUsQ0FBQztLQUNqQzs4R0FGWSxhQUFhO2tHQUFiLGFBQWEsb01BRmQscUNBQXFDLDREQURyQyxlQUFlOzsyRkFHZCxhQUFhO2tCQU56QixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxVQUFVO29CQUNwQixVQUFVLEVBQUUsSUFBSTtvQkFDaEIsT0FBTyxFQUFFLENBQUMsZUFBZSxDQUFDO29CQUMxQixRQUFRLEVBQUUscUNBQXFDO2lCQUNoRCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgaW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5nSWNvbkNvbXBvbmVudCB9IGZyb20gJ0BuZy1pY29ucy9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZnVpLWljb24nLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbTmdJY29uQ29tcG9uZW50XSxcbiAgdGVtcGxhdGU6IGA8bmctaWNvbiBbbmFtZV09XCJuYW1lKClcIj48L25nLWljb24+YFxufSlcbmV4cG9ydCBjbGFzcyBJY29uQ29tcG9uZW50IHtcbiAgbmFtZSA9IGlucHV0LnJlcXVpcmVkPHN0cmluZz4oKTtcbn1cbiJdfQ==

package/esm2022/lib/provide.mjs

@@ -0,0 +1,12 @@
+import { provideIcons, provideNgIconsConfig } from '@ng-icons/core';
+import { heroArrowLeft } from '@ng-icons/heroicons/outline';
+import { matMoreVertOutline } from '@ng-icons/material-icons/outline';
+export function provideFancyUi() {
+    return [
+        provideIcons({ heroArrowLeft, matMoreVertOutline }),
+        provideNgIconsConfig({
+            size: '100%',
+        }),
+    ];
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvdmlkZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvcmUvc3JjL2xpYi9wcm92aWRlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFBRSxZQUFZLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNwRSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDNUQsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFFdEUsTUFBTSxVQUFVLGNBQWM7SUFDMUIsT0FBTztRQUNILFlBQVksQ0FBQyxFQUFDLGFBQWEsRUFBRSxrQkFBa0IsRUFBQyxDQUFDO1FBQ2pELG9CQUFvQixDQUFDO1lBQ2pCLElBQUksRUFBRSxNQUFNO1NBQ2IsQ0FBQztLQUNQLENBQUM7QUFDTixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgUHJvdmlkZXIgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5pbXBvcnQgeyBwcm92aWRlSWNvbnMsIHByb3ZpZGVOZ0ljb25zQ29uZmlnIH0gZnJvbSAnQG5nLWljb25zL2NvcmUnO1xyXG5pbXBvcnQgeyBoZXJvQXJyb3dMZWZ0IH0gZnJvbSAnQG5nLWljb25zL2hlcm9pY29ucy9vdXRsaW5lJztcclxuaW1wb3J0IHsgbWF0TW9yZVZlcnRPdXRsaW5lIH0gZnJvbSAnQG5nLWljb25zL21hdGVyaWFsLWljb25zL291dGxpbmUnO1xyXG5cclxuZXhwb3J0IGZ1bmN0aW9uIHByb3ZpZGVGYW5jeVVpKCk6IFByb3ZpZGVyW10ge1xyXG4gICAgcmV0dXJuIFtcclxuICAgICAgICBwcm92aWRlSWNvbnMoe2hlcm9BcnJvd0xlZnQsIG1hdE1vcmVWZXJ0T3V0bGluZX0pLFxyXG4gICAgICAgIHByb3ZpZGVOZ0ljb25zQ29uZmlnKHtcclxuICAgICAgICAgICAgc2l6ZTogJzEwMCUnLFxyXG4gICAgICAgICAgfSksXHJcbiAgICBdO1xyXG59XHJcbiJdfQ==

package/fesm2022/fancy-ui-core.mjs

@@ -0,0 +1,72 @@
+import * as i0 from '@angular/core';
+import { input, Component, EventEmitter, viewChild, Output } from '@angular/core';
+import { NgIconComponent, provideIcons, provideNgIconsConfig } from '@ng-icons/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { timer } from 'rxjs';
+import { heroArrowLeft } from '@ng-icons/heroicons/outline';
+import { matMoreVertOutline } from '@ng-icons/material-icons/outline';
+
+class IconComponent {
+    constructor() {
+        this.name = input.required();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.2.1", type: IconComponent, isStandalone: true, selector: "fui-icon", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `<ng-icon [name]="name()"></ng-icon>`, isInline: true, dependencies: [{ kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: IconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'fui-icon',
+                    standalone: true,
+                    imports: [NgIconComponent],
+                    template: `<ng-icon [name]="name()"></ng-icon>`
+                }]
+        }] });
+
+class ButtonComponent {
+    constructor() {
+        /** The label of the Button. */
+        this.label = input('');
+        /** Flag to show the butto in a disabled state. */
+        this.disabled = input(false);
+        /** An event called if the button is tapped. */
+        this.tap = new EventEmitter();
+        this.waveSpan = viewChild('wave');
+        this.animate = false;
+    }
+    click(event) {
+        const waveSpan = this.waveSpan();
+        if (waveSpan) {
+            waveSpan.nativeElement.style.left = event.offsetX + 'px';
+            waveSpan.nativeElement.style.top = event.offsetY + 'px';
+        }
+        this.animate = true;
+        timer(800).subscribe(() => this.animate = false);
+        this.tap.next();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.2.1", type: ButtonComponent, isStandalone: true, selector: "fui-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tap: "tap" }, viewQueries: [{ propertyName: "waveSpan", first: true, predicate: ["wave"], descendants: true, isSignal: true }], ngImport: i0, template: "<button (click)=\"tap.next()\" [disabled]=\"disabled()\" class=\"bg-primary rounded overflow-hidden group relative hover:shadow\" >\n    <div class=\"text-on-primary p-component rounded\" [ngClass]=\"{'group-hover:bg-hover': !animate, 'bg-primary': animate}\" (click)=\"click($event)\">{{label()}}</div>\n    <span #wave class=\"absolute w-full h-full rounded-[50%] bg-tint animate-ripple\" [ngClass]=\"{'hidden': !animate}\"></span>\n</button>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fui-button', standalone: true, imports: [CommonModule], template: "<button (click)=\"tap.next()\" [disabled]=\"disabled()\" class=\"bg-primary rounded overflow-hidden group relative hover:shadow\" >\n    <div class=\"text-on-primary p-component rounded\" [ngClass]=\"{'group-hover:bg-hover': !animate, 'bg-primary': animate}\" (click)=\"click($event)\">{{label()}}</div>\n    <span #wave class=\"absolute w-full h-full rounded-[50%] bg-tint animate-ripple\" [ngClass]=\"{'hidden': !animate}\"></span>\n</button>\n" }]
+        }], propDecorators: { tap: [{
+                type: Output
+            }] } });
+
+function provideFancyUi() {
+    return [
+        provideIcons({ heroArrowLeft, matMoreVertOutline }),
+        provideNgIconsConfig({
+            size: '100%',
+        }),
+    ];
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ButtonComponent, IconComponent, provideFancyUi };
+//# sourceMappingURL=fancy-ui-core.mjs.map

package/fesm2022/fancy-ui-core.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"fancy-ui-core.mjs","sources":["../../../../packages/core/src/lib/icon/icon.component.ts","../../../../packages/core/src/lib/button/button.component.ts","../../../../packages/core/src/lib/button/button.component.html","../../../../packages/core/src/lib/provide.ts","../../../../packages/core/src/fancy-ui-core.ts"],"sourcesContent":["import { Component, input } from '@angular/core';\nimport { NgIconComponent } from '@ng-icons/core';\n\n@Component({\n  selector: 'fui-icon',\n  standalone: true,\n  imports: [NgIconComponent],\n  template: `<ng-icon [name]=\"name()\"></ng-icon>`\n})\nexport class IconComponent {\n  name = input.required<string>();\n}\n","import { Component, ElementRef, EventEmitter, Output, input, viewChild } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { timer } from 'rxjs';\n\n@Component({\n  selector: 'fui-button',\n  standalone: true,\n  imports: [CommonModule],\n  templateUrl: './button.component.html'\n})\nexport class ButtonComponent {\n  /** The label of the Button. */\n  label = input('');\n  /** Flag to show the butto in a disabled state. */\n  disabled = input(false);\n  /** An event called if the button is tapped. */\n  @Output()\n  tap = new EventEmitter<void>();\n\n  waveSpan = viewChild<ElementRef>('wave');\n\n  animate = false;\n\n  click(event: { offsetX: number, offsetY: number}) {\n    const waveSpan = this.waveSpan();\n    if(waveSpan) {\n      waveSpan.nativeElement.style.left = event.offsetX + 'px';\n      waveSpan.nativeElement.style.top = event.offsetY + 'px';\n    }\n    this.animate = true;\n    timer(800).subscribe(() => this.animate = false);\n    this.tap.next();\n  }\n\n}\n","<button (click)=\"tap.next()\" [disabled]=\"disabled()\" class=\"bg-primary rounded overflow-hidden group relative hover:shadow\" >\n    <div class=\"text-on-primary p-component rounded\" [ngClass]=\"{'group-hover:bg-hover': !animate, 'bg-primary': animate}\" (click)=\"click($event)\">{{label()}}</div>\n    <span #wave class=\"absolute w-full h-full rounded-[50%] bg-tint animate-ripple\" [ngClass]=\"{'hidden': !animate}\"></span>\n</button>\n","import { Provider } from \"@angular/core\";\r\nimport { provideIcons, provideNgIconsConfig } from '@ng-icons/core';\r\nimport { heroArrowLeft } from '@ng-icons/heroicons/outline';\r\nimport { matMoreVertOutline } from '@ng-icons/material-icons/outline';\r\n\r\nexport function provideFancyUi(): Provider[] {\r\n    return [\r\n        provideIcons({heroArrowLeft, matMoreVertOutline}),\r\n        provideNgIconsConfig({\r\n            size: '100%',\r\n          }),\r\n    ];\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -0,0 +1,3 @@
+export * from './lib/icon/icon.component';
+export * from './lib/button/button.component';
+export * from './lib/provide';

package/lib/button/button.component.d.ts

@@ -0,0 +1,18 @@
+import { ElementRef, EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class ButtonComponent {
+    /** The label of the Button. */
+    label: import("@angular/core").InputSignal<string>;
+    /** Flag to show the butto in a disabled state. */
+    disabled: import("@angular/core").InputSignal<boolean>;
+    /** An event called if the button is tapped. */
+    tap: EventEmitter<void>;
+    waveSpan: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    animate: boolean;
+    click(event: {
+        offsetX: number;
+        offsetY: number;
+    }): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "fui-button", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "tap": "tap"; }, never, never, true, never>;
+}

package/lib/icon/icon.component.d.ts

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+export declare class IconComponent {
+    name: import("@angular/core").InputSignal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IconComponent, "fui-icon", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/provide.d.ts

@@ -0,0 +1,2 @@
+import { Provider } from "@angular/core";
+export declare function provideFancyUi(): Provider[];

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "fancy-ui-core",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@angular/common": "^17.2.0",
+    "@angular/core": "^17.2.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/fancy-ui-core.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/fancy-ui-core.mjs",
+      "esm": "./esm2022/fancy-ui-core.mjs",
+      "default": "./fesm2022/fancy-ui-core.mjs"
+    }
+  }
+}

package/tailwind.preset.js

@@ -0,0 +1,142 @@
+const plugin = require('tailwindcss/plugin');
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  theme: {
+    extend: {
+      colors: {
+        primary: {
+          DEFAULT: 'var(--color-primary)',
+          background: 'var(--color-primary-background)',
+          container: 'var(--color-primary-container)',
+        },
+        secondary: {
+          DEFAULT: 'var(--color-secondary)',
+          background: 'var(--color-secondary-background)',
+          container: 'var(--color-secondary-container)',
+        },
+        accent: {
+          DEFAULT: 'var(--color-accent)',
+          background: 'var(--color-accent-background)',
+          container: 'var(--color-accent-container)',
+        },
+        background: {
+          DEFAULT: 'var(--color-background)',
+          variant: 'var(--color-background-variant)',
+        }, 
+        outline: 'var(--color-outline)',
+        hover: 'var(--color-hover)',
+        shade: 'var(--color-shade)',
+        tint: 'var(--color-tint)',
+        success: 'var(--color-success)',
+        error: 'var(--color-error)',
+        on: {
+          primary: {
+            DEFAULT: 'var(--color-on-primary)',
+            background: 'var(--color-on-primary-background)',
+            container: 'var(--color-on-primary-container)',
+          },
+          secondary: {
+            DEFAULT: 'var(--color-on-secondary)',
+            background: 'var(--color-on-secondary-background)',
+            container: 'var(--color-on-secondary-container)',
+          },
+          accent: {
+            DEFAULT: 'var(--color-on-accent)',
+            background: 'var(--color-on-accent-background)',
+            container: 'var(--color-on-accent-container)',
+          },
+        }
+      },
+      spacing:  {
+        'rim': '8px',
+        'rim/2': '4px',
+        'component': '10px',
+        'component/2': '5px',
+        'element': '10px',
+        'icon': '24px',
+        'iconX2': '48px',
+        'hover': '48px',
+      },
+      fontSize: {
+        'title': '24px',
+        'subtitle': '14px',
+        'label': '11px'
+      },
+      fontWeight: {
+        'title': '300',
+        'label': '300'
+      },
+      borderRadius: {
+        DEFAULT: '12px',
+        component: '12px',
+        element: '12px'
+      },
+      boxShadow: {
+        DEFAULT: '0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%)'
+      },
+      keyframes: {
+        ripple: {
+          '0%': { 
+            'transform-origin': 'top left',
+            transform: 'scale(0) translateX(-50%) translateY(-50%)',
+          },
+          '100%': { 
+            'transform-origin': 'top left',
+            transform: 'scale(4) translateX(-50%) translateY(-50%)',
+            opacity: 0 
+          },
+        }
+      },
+      animation: {
+        ripple: 'ripple 800ms linear',
+      }
+    },
+    variables: {
+      DEFAULT: {
+        color: {
+          primary: '#333333',
+          'primary-background': '#f5f5f5',
+          'primary-container': '#e7e7e7',
+          secondary: '#555555',
+          'secondary-background': '#f7f7f7',
+          'secondary-container': '#ebebeb',
+          accent: '#777777',
+          'accent-background': '#f8f8f8',
+          'accent-container': '#efefef',
+          background: '#f7f7f7',
+          'background-variant': '#d8d8d8',
+          outline: '#cecece',
+          hover: '#00000025',
+          shade: '#00000015',
+          tint: '#FFFFFF90',
+          success: '#009900',
+          error: '#DD0000',
+          on: {
+            primary: '#fbfbfb',
+            'primary-background': '#030303',
+            'primary-container': '#030303',
+            secondary: '#fcfcfc',
+            'secondary-background': '#040404',
+            'secondary-container': '#040404',
+            accent: '#fcfcfc',
+            'accent-background': '#060606',
+            'accent-container': '#060606'
+          }
+        }
+      }
+    }
+  },
+  plugins: [
+    require('@mertasan/tailwindcss-variables'),
+    plugin(fuiComponents)
+  ]
+};
+
+function fuiComponents({ addComponents }) {
+  addComponents({
+    '.shell-background': {
+      'background-color': 'green'
+    }
+  });
+}