@aiandralves/ai-ui 1.0.0

package/esm2022/lib/components/upload/demo/selected.js

@@ -0,0 +1,53 @@
+import { Component, inject, signal } from "@angular/core";
+import { AiUpload, AiUploadSelected } from "../upload";
+import { AiFileUploadService } from "../upload.service";
+import * as i0 from "@angular/core";
+export class DemoUploadSelectedComponent {
+    #fileUpload = inject(AiFileUploadService);
+    accept = ".png, .jpg, .jpeg, .gif, .pdf";
+    imageConfig = signal(null, ...(ngDevMode ? [{ debugName: "imageConfig" }] : []));
+    docConfig = signal({
+        name: "documento.pdf",
+        size: "2.5 MB",
+        base64: "",
+    }, ...(ngDevMode ? [{ debugName: "docConfig" }] : []));
+    async onChangeFile(file) {
+        const result = await this.#fileUpload.readAsBase64(file);
+        this.imageConfig.set(result);
+    }
+    onDeleteDoc() {
+        console.log("Implementar o remover arquivo.");
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoUploadSelectedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: DemoUploadSelectedComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
+        <div class="flex flex-col gap-y-6 w-full max-w-lg">
+            <ai-upload class="w-full" [accept]="accept" (changeFile)="onChangeFile($event)" />
+
+            @if (imageConfig()) {
+                <ai-upload-selected type="card" [config]="imageConfig()" (remove)="imageConfig.set(null)" />
+            }
+
+            <ai-upload-selected type="card" [config]="docConfig()" (remove)="onDeleteDoc()" />
+            <ai-upload-selected type="list" [config]="docConfig()" (remove)="onDeleteDoc()" />
+        </div>
+    `, isInline: true, dependencies: [{ kind: "component", type: AiUpload, selector: "ai-upload", inputs: ["id", "type", "accept", "multiple", "disabled", "class"], outputs: ["changeFile", "changeFiles"], exportAs: ["aiUpload"] }, { kind: "component", type: AiUploadSelected, selector: "ai-upload-selected", inputs: ["config", "type", "class"], outputs: ["remove"], exportAs: ["aiUploadSelected"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoUploadSelectedComponent, decorators: [{
+            type: Component,
+            args: [{
+                    imports: [AiUpload, AiUploadSelected],
+                    template: `
+        <div class="flex flex-col gap-y-6 w-full max-w-lg">
+            <ai-upload class="w-full" [accept]="accept" (changeFile)="onChangeFile($event)" />
+
+            @if (imageConfig()) {
+                <ai-upload-selected type="card" [config]="imageConfig()" (remove)="imageConfig.set(null)" />
+            }
+
+            <ai-upload-selected type="card" [config]="docConfig()" (remove)="onDeleteDoc()" />
+            <ai-upload-selected type="list" [config]="docConfig()" (remove)="onDeleteDoc()" />
+        </div>
+    `,
+                }]
+        }] });
+//# sourceMappingURL=selected.js.map

package/esm2022/lib/components/upload/demo/selected.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selected.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/components/upload/demo/selected.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAE1D,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAEvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;;AAiBxD,MAAM,OAAO,2BAA2B;IACpC,WAAW,GAAG,MAAM,CAAC,mBAAmB,CAAC,CAAC;IAE1C,MAAM,GAAG,+BAA+B,CAAC;IACzC,WAAW,GAAG,MAAM,CAAsB,IAAI,uDAAC,CAAC;IAEhD,SAAS,GAAG,MAAM,CAAe;QAC7B,IAAI,EAAE,eAAe;QACrB,IAAI,EAAE,QAAQ;QACd,MAAM,EAAE,EAAE;KACb,qDAAC,CAAC;IAEH,KAAK,CAAC,YAAY,CAAC,IAAU;QACzB,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;QACzD,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IACjC,CAAC;IAED,WAAW;QACP,OAAO,CAAC,GAAG,CAAC,gCAAgC,CAAC,CAAC;IAClD,CAAC;uGAnBQ,2BAA2B;2FAA3B,2BAA2B,wEAb1B;;;;;;;;;;;KAWT,4DAZS,QAAQ,yLAAE,gBAAgB;;2FAc3B,2BAA2B;kBAfvC,SAAS;mBAAC;oBACP,OAAO,EAAE,CAAC,QAAQ,EAAE,gBAAgB,CAAC;oBACrC,QAAQ,EAAE;;;;;;;;;;;KAWT;iBACJ","sourcesContent":["import { Component, inject, signal } from \"@angular/core\";\r\n\r\nimport { AiUpload, AiUploadSelected } from \"../upload\";\r\nimport { AiFileUpload } from \"../upload.interface\";\r\nimport { AiFileUploadService } from \"../upload.service\";\r\n\r\n@Component({\r\n    imports: [AiUpload, AiUploadSelected],\r\n    template: `\r\n        <div class=\"flex flex-col gap-y-6 w-full max-w-lg\">\r\n            <ai-upload class=\"w-full\" [accept]=\"accept\" (changeFile)=\"onChangeFile($event)\" />\r\n\r\n            @if (imageConfig()) {\r\n                <ai-upload-selected type=\"card\" [config]=\"imageConfig()\" (remove)=\"imageConfig.set(null)\" />\r\n            }\r\n\r\n            <ai-upload-selected type=\"card\" [config]=\"docConfig()\" (remove)=\"onDeleteDoc()\" />\r\n            <ai-upload-selected type=\"list\" [config]=\"docConfig()\" (remove)=\"onDeleteDoc()\" />\r\n        </div>\r\n    `,\r\n})\r\nexport class DemoUploadSelectedComponent {\r\n    #fileUpload = inject(AiFileUploadService);\r\n\r\n    accept = \".png, .jpg, .jpeg, .gif, .pdf\";\r\n    imageConfig = signal<AiFileUpload | null>(null);\r\n\r\n    docConfig = signal<AiFileUpload>({\r\n        name: \"documento.pdf\",\r\n        size: \"2.5 MB\",\r\n        base64: \"\",\r\n    });\r\n\r\n    async onChangeFile(file: File) {\r\n        const result = await this.#fileUpload.readAsBase64(file);\r\n        this.imageConfig.set(result);\r\n    }\r\n\r\n    onDeleteDoc() {\r\n        console.log(\"Implementar o remover arquivo.\");\r\n    }\r\n}\r\n"]}

package/esm2022/lib/components/upload/demo/upload.js

@@ -0,0 +1,15 @@
+import { DemoUploadDefaultComponent } from "./default";
+import { DemoUploadDropzoneComponent } from "./dropzone";
+import { DemoUploadMultipleComponent } from "./multiple";
+import { DemoUploadSelectedComponent } from "./selected";
+export const UPLOAD = {
+    componentName: "upload",
+    examples: [
+        { name: "default", component: DemoUploadDefaultComponent },
+        { name: "dropzone", component: DemoUploadDropzoneComponent },
+        { name: "multiple", component: DemoUploadMultipleComponent },
+        { name: "selected", component: DemoUploadSelectedComponent },
+    ],
+};
+export { DemoUploadDefaultComponent, DemoUploadDropzoneComponent, DemoUploadMultipleComponent, DemoUploadSelectedComponent };
+//# sourceMappingURL=upload.js.map

package/esm2022/lib/components/upload/demo/upload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/components/upload/demo/upload.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,MAAM,WAAW,CAAC;AACvD,OAAO,EAAE,2BAA2B,EAAE,MAAM,YAAY,CAAC;AACzD,OAAO,EAAE,2BAA2B,EAAE,MAAM,YAAY,CAAC;AACzD,OAAO,EAAE,2BAA2B,EAAE,MAAM,YAAY,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG;IAClB,aAAa,EAAE,QAAQ;IACvB,QAAQ,EAAE;QACN,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,0BAA0B,EAAE;QAC1D,EAAE,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,2BAA2B,EAAE;QAC5D,EAAE,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,2BAA2B,EAAE;QAC5D,EAAE,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,2BAA2B,EAAE;KAC/D;CACJ,CAAC;AAEF,OAAO,EAAE,0BAA0B,EAAE,2BAA2B,EAAE,2BAA2B,EAAE,2BAA2B,EAAE,CAAC","sourcesContent":["import { DemoUploadDefaultComponent } from \"./default\";\r\nimport { DemoUploadDropzoneComponent } from \"./dropzone\";\r\nimport { DemoUploadMultipleComponent } from \"./multiple\";\r\nimport { DemoUploadSelectedComponent } from \"./selected\";\r\n\r\nexport const UPLOAD = {\r\n    componentName: \"upload\",\r\n    examples: [\r\n        { name: \"default\", component: DemoUploadDefaultComponent },\r\n        { name: \"dropzone\", component: DemoUploadDropzoneComponent },\r\n        { name: \"multiple\", component: DemoUploadMultipleComponent },\r\n        { name: \"selected\", component: DemoUploadSelectedComponent },\r\n    ],\r\n};\r\n\r\nexport { DemoUploadDefaultComponent, DemoUploadDropzoneComponent, DemoUploadMultipleComponent, DemoUploadSelectedComponent };\r\n"]}

package/esm2022/lib/components/upload/index.js

@@ -0,0 +1,5 @@
+export * from "./demo/upload";
+export * from "./upload";
+export * from "./upload.interface";
+export * from "./upload.service";
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/upload/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/upload/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,oBAAoB,CAAC;AACnC,cAAc,kBAAkB,CAAC","sourcesContent":["export * from \"./demo/upload\";\r\nexport * from \"./upload\";\r\nexport * from \"./upload.interface\";\r\nexport * from \"./upload.service\";\r\n"]}

package/esm2022/lib/components/upload/upload.interface.js

@@ -0,0 +1 @@
+//# sourceMappingURL=upload.interface.js.map

package/esm2022/lib/components/upload/upload.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload.interface.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/upload/upload.interface.ts"],"names":[],"mappings":"","sourcesContent":["export interface AiFileUpload<T = unknown> {\r\n    file?: File;\r\n    name: string;\r\n    base64: string;\r\n    value?: T | null;\r\n    size?: string | number;\r\n    disabled?: boolean;\r\n}\r\n"]}

package/esm2022/lib/components/upload/upload.js

@@ -0,0 +1,227 @@
+import { ChangeDetectionStrategy, Component, computed, input, output, viewChild, ViewEncapsulation } from "@angular/core";
+import { mergeClasses, transform } from "../../core";
+import { AiEmpty } from "../empty";
+import { AiIcon } from "../icon";
+import { uploadSelectedVariants, uploadVariants } from "./upload.variants";
+import * as i0 from "@angular/core";
+export class AiUpload {
+    id = input("", ...(ngDevMode ? [{ debugName: "id" }] : []));
+    type = input("button", ...(ngDevMode ? [{ debugName: "type" }] : []));
+    accept = input("", ...(ngDevMode ? [{ debugName: "accept" }] : []));
+    multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : {}), transform });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform });
+    class = input("", ...(ngDevMode ? [{ debugName: "class" }] : []));
+    changeFile = output();
+    changeFiles = output();
+    fileInput = viewChild.required("fileInput");
+    classes = computed(() => mergeClasses(uploadVariants({ type: this.type(), disabled: this.disabled() }), this.class()), ...(ngDevMode ? [{ debugName: "classes" }] : []));
+    onFileChange(event) {
+        const input = event.target;
+        const files = Array.from(input.files ?? []);
+        if (files.length > 0) {
+            this.changeFile.emit(files[0]);
+            this.changeFiles.emit(files);
+            input.value = "";
+        }
+    }
+    onDragOver(event) {
+        event.preventDefault();
+        event.stopPropagation();
+    }
+    onDrop(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        const files = Array.from(event.dataTransfer?.files ?? []);
+        if (files.length > 0) {
+            this.changeFile.emit(files[0]);
+            this.changeFiles.emit(files);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiUpload, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: AiUpload, isStandalone: true, selector: "ai-upload", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeFile: "changeFile", changeFiles: "changeFiles" }, host: { classAttribute: "block" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], exportAs: ["aiUpload"], ngImport: i0, template: `
+        <input #fileInput type="file" class="hidden" [attr.id]="id() || null" [multiple]="multiple()" [accept]="accept()" (change)="onFileChange($event)" />
+        @if (type() === "button") {
+            <button [class]="classes()" (click)="fileInput.click()">
+                <ai-icon icon="upload-cloud-2" size="lg" class="text-muted-foreground" />
+                <div class="flex flex-col text-left">
+                    <span class="text-sm font-medium">Fazer upload de arquivo</span>
+                </div>
+            </button>
+            @if (accept()) {
+                <span class="text-xs text-muted-foreground">Formatos de arquivos permitidos: {{ accept() }}.</span>
+            }
+        } @else {
+            <button [class]="classes()" (click)="fileInput.click()" (dragover)="onDragOver($event)" (drop)="onDrop($event)">
+                <ai-icon icon="upload-cloud-2" size="xl" class="text-muted-foreground" />
+                <div class="text-center">
+                    <span class="text-sm font-medium">Click para carregar ou arraste e solte</span>
+                </div>
+                @if (accept()) {
+                    <span class="text-xs text-muted-foreground">Formatos de arquivos permitidos: {{ accept() }}</span>
+                }
+            </button>
+        }
+    `, isInline: true, dependencies: [{ kind: "component", type: AiIcon, selector: "ai-icon, [ai-icon]", inputs: ["icon", "size", "type", "disabled", "class"], exportAs: ["aiIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiUpload, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "ai-upload",
+                    exportAs: "aiUpload",
+                    imports: [AiIcon],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    template: `
+        <input #fileInput type="file" class="hidden" [attr.id]="id() || null" [multiple]="multiple()" [accept]="accept()" (change)="onFileChange($event)" />
+        @if (type() === "button") {
+            <button [class]="classes()" (click)="fileInput.click()">
+                <ai-icon icon="upload-cloud-2" size="lg" class="text-muted-foreground" />
+                <div class="flex flex-col text-left">
+                    <span class="text-sm font-medium">Fazer upload de arquivo</span>
+                </div>
+            </button>
+            @if (accept()) {
+                <span class="text-xs text-muted-foreground">Formatos de arquivos permitidos: {{ accept() }}.</span>
+            }
+        } @else {
+            <button [class]="classes()" (click)="fileInput.click()" (dragover)="onDragOver($event)" (drop)="onDrop($event)">
+                <ai-icon icon="upload-cloud-2" size="xl" class="text-muted-foreground" />
+                <div class="text-center">
+                    <span class="text-sm font-medium">Click para carregar ou arraste e solte</span>
+                </div>
+                @if (accept()) {
+                    <span class="text-xs text-muted-foreground">Formatos de arquivos permitidos: {{ accept() }}</span>
+                }
+            </button>
+        }
+    `,
+                    host: {
+                        class: "block",
+                    },
+                }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], changeFile: [{ type: i0.Output, args: ["changeFile"] }], changeFiles: [{ type: i0.Output, args: ["changeFiles"] }], fileInput: [{ type: i0.ViewChild, args: ["fileInput", { isSignal: true }] }] } });
+export class AiUploadSelected {
+    config = input(null, ...(ngDevMode ? [{ debugName: "config" }] : []));
+    type = input("list", ...(ngDevMode ? [{ debugName: "type" }] : []));
+    class = input("", ...(ngDevMode ? [{ debugName: "class" }] : []));
+    remove = output();
+    configArray = computed(() => {
+        const c = this.config();
+        if (!c)
+            return [];
+        return Array.isArray(c) ? c : [c];
+    }, ...(ngDevMode ? [{ debugName: "configArray" }] : []));
+    classes = computed(() => mergeClasses(uploadSelectedVariants({ type: this.type() }), this.class()), ...(ngDevMode ? [{ debugName: "classes" }] : []));
+    isImage(item) {
+        return item.base64?.startsWith("data:image/") ?? false;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiUploadSelected, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: AiUploadSelected, isStandalone: true, selector: "ai-upload-selected", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { remove: "remove" }, host: { classAttribute: "block" }, exportAs: ["aiUploadSelected"], ngImport: i0, template: `
+        @if (configArray().length > 0) {
+            @if (type() === "card") {
+                <div class="flex flex-col gap-3 w-full">
+                    @for (item of configArray(); track item.name) {
+                        <div [class]="classes()">
+                            @if (isImage(item)) {
+                                <img [src]="item.base64" [alt]="item.name" class="w-full h-40 object-cover" />
+                            } @else {
+                                <div class="flex items-center justify-center h-40 bg-transparent">
+                                    <ai-empty icon="file-text" [title]="item.name" description="Arquivo sem visualização" />
+                                </div>
+                            }
+                            <div class="flex items-center justify-between gap-3 px-4 py-3 w-full">
+                                <div class="flex items-center gap-2 min-w-0">
+                                    <span class="text-sm font-semibold truncate max-w-[12em]">{{ item.name }}</span>
+                                    @if (item.size) {
+                                        <span class="text-xs text-muted-foreground shrink-0">{{ item.size }}</span>
+                                    }
+                                </div>
+                                <button type="button" class="shrink-0 cursor-pointer text-muted-foreground hover:text-destructive transition-colors" (click)="remove.emit(item)">
+                                    <ai-icon icon="delete-bin" size="sm" />
+                                </button>
+                            </div>
+                        </div>
+                    }
+                </div>
+            } @else {
+                <div class="flex flex-col gap-2 w-full">
+                    @for (item of configArray(); track item.name) {
+                        <div [class]="classes()">
+                            <ai-icon icon="file-text" class="shrink-0 text-muted-foreground" />
+                            <div class="flex flex-col flex-1 min-w-0">
+                                <span class="text-sm font-semibold truncate max-w-[12em]">{{ item.name }}</span>
+                            </div>
+                            @if (item.size) {
+                                <span class="text-xs text-muted-foreground shrink-0">{{ item.size }}</span>
+                            }
+                            <button type="button" class="shrink-0 cursor-pointer text-muted-foreground hover:text-destructive transition-colors" (click)="remove.emit(item)">
+                                <ai-icon icon="delete-bin" size="sm" />
+                            </button>
+                        </div>
+                    }
+                </div>
+            }
+        }
+    `, isInline: true, dependencies: [{ kind: "component", type: AiIcon, selector: "ai-icon, [ai-icon]", inputs: ["icon", "size", "type", "disabled", "class"], exportAs: ["aiIcon"] }, { kind: "component", type: AiEmpty, selector: "ai-empty", inputs: ["actions", "icon", "image", "title", "description", "class"], exportAs: ["aiEmpty"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiUploadSelected, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "ai-upload-selected",
+                    exportAs: "aiUploadSelected",
+                    imports: [AiIcon, AiEmpty],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    template: `
+        @if (configArray().length > 0) {
+            @if (type() === "card") {
+                <div class="flex flex-col gap-3 w-full">
+                    @for (item of configArray(); track item.name) {
+                        <div [class]="classes()">
+                            @if (isImage(item)) {
+                                <img [src]="item.base64" [alt]="item.name" class="w-full h-40 object-cover" />
+                            } @else {
+                                <div class="flex items-center justify-center h-40 bg-transparent">
+                                    <ai-empty icon="file-text" [title]="item.name" description="Arquivo sem visualização" />
+                                </div>
+                            }
+                            <div class="flex items-center justify-between gap-3 px-4 py-3 w-full">
+                                <div class="flex items-center gap-2 min-w-0">
+                                    <span class="text-sm font-semibold truncate max-w-[12em]">{{ item.name }}</span>
+                                    @if (item.size) {
+                                        <span class="text-xs text-muted-foreground shrink-0">{{ item.size }}</span>
+                                    }
+                                </div>
+                                <button type="button" class="shrink-0 cursor-pointer text-muted-foreground hover:text-destructive transition-colors" (click)="remove.emit(item)">
+                                    <ai-icon icon="delete-bin" size="sm" />
+                                </button>
+                            </div>
+                        </div>
+                    }
+                </div>
+            } @else {
+                <div class="flex flex-col gap-2 w-full">
+                    @for (item of configArray(); track item.name) {
+                        <div [class]="classes()">
+                            <ai-icon icon="file-text" class="shrink-0 text-muted-foreground" />
+                            <div class="flex flex-col flex-1 min-w-0">
+                                <span class="text-sm font-semibold truncate max-w-[12em]">{{ item.name }}</span>
+                            </div>
+                            @if (item.size) {
+                                <span class="text-xs text-muted-foreground shrink-0">{{ item.size }}</span>
+                            }
+                            <button type="button" class="shrink-0 cursor-pointer text-muted-foreground hover:text-destructive transition-colors" (click)="remove.emit(item)">
+                                <ai-icon icon="delete-bin" size="sm" />
+                            </button>
+                        </div>
+                    }
+                </div>
+            }
+        }
+    `,
+                    host: {
+                        class: "block",
+                    },
+                }]
+        }], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], remove: [{ type: i0.Output, args: ["remove"] }] } });
+//# sourceMappingURL=upload.js.map

package/esm2022/lib/components/upload/upload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/upload/upload.ts"],"names":[],"mappings":"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","sourcesContent":["import { ClassValue } from \"clsx\";\r\n\r\nimport { ChangeDetectionStrategy, Component, computed, ElementRef, input, output, viewChild, ViewEncapsulation } from \"@angular/core\";\r\n\r\nimport { mergeClasses, transform } from \"../../core\";\r\nimport { AiEmpty } from \"../empty\";\r\nimport { AiIcon } from \"../icon\";\r\nimport { AiFileUpload } from \"./upload.interface\";\r\nimport { uploadSelectedVariants, UploadSelectedVariants, uploadVariants, UploadVariants } from \"./upload.variants\";\r\n\r\n@Component({\r\n    selector: \"ai-upload\",\r\n    exportAs: \"aiUpload\",\r\n    imports: [AiIcon],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None,\r\n    template: `\r\n        <input #fileInput type=\"file\" class=\"hidden\" [attr.id]=\"id() || null\" [multiple]=\"multiple()\" [accept]=\"accept()\" (change)=\"onFileChange($event)\" />\r\n        @if (type() === \"button\") {\r\n            <button [class]=\"classes()\" (click)=\"fileInput.click()\">\r\n                <ai-icon icon=\"upload-cloud-2\" size=\"lg\" class=\"text-muted-foreground\" />\r\n                <div class=\"flex flex-col text-left\">\r\n                    <span class=\"text-sm font-medium\">Fazer upload de arquivo</span>\r\n                </div>\r\n            </button>\r\n            @if (accept()) {\r\n                <span class=\"text-xs text-muted-foreground\">Formatos de arquivos permitidos: {{ accept() }}.</span>\r\n            }\r\n        } @else {\r\n            <button [class]=\"classes()\" (click)=\"fileInput.click()\" (dragover)=\"onDragOver($event)\" (drop)=\"onDrop($event)\">\r\n                <ai-icon icon=\"upload-cloud-2\" size=\"xl\" class=\"text-muted-foreground\" />\r\n                <div class=\"text-center\">\r\n                    <span class=\"text-sm font-medium\">Click para carregar ou arraste e solte</span>\r\n                </div>\r\n                @if (accept()) {\r\n                    <span class=\"text-xs text-muted-foreground\">Formatos de arquivos permitidos: {{ accept() }}</span>\r\n                }\r\n            </button>\r\n        }\r\n    `,\r\n    host: {\r\n        class: \"block\",\r\n    },\r\n})\r\nexport class AiUpload {\r\n    readonly id = input<string>(\"\");\r\n    readonly type = input<UploadVariants[\"type\"]>(\"button\");\r\n    readonly accept = input(\"\");\r\n    readonly multiple = input<boolean, string | boolean>(false, { transform });\r\n    readonly disabled = input<boolean, string | boolean>(false, { transform });\r\n    readonly class = input<ClassValue>(\"\");\r\n\r\n    readonly changeFile = output<File>();\r\n    readonly changeFiles = output<File[]>();\r\n\r\n    readonly fileInput = viewChild.required<ElementRef<HTMLInputElement>>(\"fileInput\");\r\n\r\n    protected readonly classes = computed(() => mergeClasses(uploadVariants({ type: this.type(), disabled: this.disabled() }), this.class()));\r\n\r\n    onFileChange(event: Event) {\r\n        const input = event.target as HTMLInputElement;\r\n        const files = Array.from(input.files ?? []);\r\n        if (files.length > 0) {\r\n            this.changeFile.emit(files[0]);\r\n            this.changeFiles.emit(files);\r\n            input.value = \"\";\r\n        }\r\n    }\r\n\r\n    onDragOver(event: DragEvent) {\r\n        event.preventDefault();\r\n        event.stopPropagation();\r\n    }\r\n\r\n    onDrop(event: DragEvent) {\r\n        event.preventDefault();\r\n        event.stopPropagation();\r\n        const files = Array.from(event.dataTransfer?.files ?? []);\r\n        if (files.length > 0) {\r\n            this.changeFile.emit(files[0]);\r\n            this.changeFiles.emit(files);\r\n        }\r\n    }\r\n}\r\n\r\n@Component({\r\n    selector: \"ai-upload-selected\",\r\n    exportAs: \"aiUploadSelected\",\r\n    imports: [AiIcon, AiEmpty],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None,\r\n    template: `\r\n        @if (configArray().length > 0) {\r\n            @if (type() === \"card\") {\r\n                <div class=\"flex flex-col gap-3 w-full\">\r\n                    @for (item of configArray(); track item.name) {\r\n                        <div [class]=\"classes()\">\r\n                            @if (isImage(item)) {\r\n                                <img [src]=\"item.base64\" [alt]=\"item.name\" class=\"w-full h-40 object-cover\" />\r\n                            } @else {\r\n                                <div class=\"flex items-center justify-center h-40 bg-transparent\">\r\n                                    <ai-empty icon=\"file-text\" [title]=\"item.name\" description=\"Arquivo sem visualização\" />\r\n                                </div>\r\n                            }\r\n                            <div class=\"flex items-center justify-between gap-3 px-4 py-3 w-full\">\r\n                                <div class=\"flex items-center gap-2 min-w-0\">\r\n                                    <span class=\"text-sm font-semibold truncate max-w-[12em]\">{{ item.name }}</span>\r\n                                    @if (item.size) {\r\n                                        <span class=\"text-xs text-muted-foreground shrink-0\">{{ item.size }}</span>\r\n                                    }\r\n                                </div>\r\n                                <button type=\"button\" class=\"shrink-0 cursor-pointer text-muted-foreground hover:text-destructive transition-colors\" (click)=\"remove.emit(item)\">\r\n                                    <ai-icon icon=\"delete-bin\" size=\"sm\" />\r\n                                </button>\r\n                            </div>\r\n                        </div>\r\n                    }\r\n                </div>\r\n            } @else {\r\n                <div class=\"flex flex-col gap-2 w-full\">\r\n                    @for (item of configArray(); track item.name) {\r\n                        <div [class]=\"classes()\">\r\n                            <ai-icon icon=\"file-text\" class=\"shrink-0 text-muted-foreground\" />\r\n                            <div class=\"flex flex-col flex-1 min-w-0\">\r\n                                <span class=\"text-sm font-semibold truncate max-w-[12em]\">{{ item.name }}</span>\r\n                            </div>\r\n                            @if (item.size) {\r\n                                <span class=\"text-xs text-muted-foreground shrink-0\">{{ item.size }}</span>\r\n                            }\r\n                            <button type=\"button\" class=\"shrink-0 cursor-pointer text-muted-foreground hover:text-destructive transition-colors\" (click)=\"remove.emit(item)\">\r\n                                <ai-icon icon=\"delete-bin\" size=\"sm\" />\r\n                            </button>\r\n                        </div>\r\n                    }\r\n                </div>\r\n            }\r\n        }\r\n    `,\r\n    host: {\r\n        class: \"block\",\r\n    },\r\n})\r\nexport class AiUploadSelected {\r\n    readonly config = input<AiFileUpload | AiFileUpload[] | null>(null);\r\n    readonly type = input<UploadSelectedVariants[\"type\"]>(\"list\");\r\n    readonly class = input<ClassValue>(\"\");\r\n\r\n    readonly remove = output<AiFileUpload>();\r\n\r\n    protected readonly configArray = computed<AiFileUpload[]>(() => {\r\n        const c = this.config();\r\n        if (!c) return [];\r\n        return Array.isArray(c) ? c : [c];\r\n    });\r\n\r\n    protected readonly classes = computed(() => mergeClasses(uploadSelectedVariants({ type: this.type() }), this.class()));\r\n\r\n    protected isImage(item: AiFileUpload): boolean {\r\n        return item.base64?.startsWith(\"data:image/\") ?? false;\r\n    }\r\n}\r\n"]}

package/esm2022/lib/components/upload/upload.service.js

@@ -0,0 +1,36 @@
+import { Injectable } from "@angular/core";
+import * as i0 from "@angular/core";
+export class AiFileUploadService {
+    readAsBase64(file) {
+        return new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            reader.onload = () => {
+                resolve({
+                    file,
+                    name: file.name,
+                    base64: reader.result,
+                    size: this._formatSize(file.size),
+                });
+            };
+            reader.onerror = () => reject(reader.error);
+            reader.readAsDataURL(file);
+        });
+    }
+    _formatSize(bytes) {
+        if (bytes === 0)
+            return "0 Bytes";
+        const k = 1024;
+        const sizes = ["Bytes", "KB", "MB", "GB"];
+        const i = Math.floor(Math.log(bytes) / Math.log(k));
+        return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiFileUploadService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiFileUploadService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiFileUploadService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: "root",
+                }]
+        }] });
+//# sourceMappingURL=upload.service.js.map

package/esm2022/lib/components/upload/upload.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload.service.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/upload/upload.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;;AAO3C,MAAM,OAAO,mBAAmB;IAC5B,YAAY,CAAC,IAAU;QACnB,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;YACnC,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;YAChC,MAAM,CAAC,MAAM,GAAG,GAAG,EAAE;gBACjB,OAAO,CAAC;oBACJ,IAAI;oBACJ,IAAI,EAAE,IAAI,CAAC,IAAI;oBACf,MAAM,EAAE,MAAM,CAAC,MAAgB;oBAC/B,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;iBACpC,CAAC,CAAC;YACP,CAAC,CAAC;YACF,MAAM,CAAC,OAAO,GAAG,GAAG,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC5C,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAC/B,CAAC,CAAC,CAAC;IACP,CAAC;IAEO,WAAW,CAAC,KAAa;QAC7B,IAAI,KAAK,KAAK,CAAC;YAAE,OAAO,SAAS,CAAC;QAClC,MAAM,CAAC,GAAG,IAAI,CAAC;QACf,MAAM,KAAK,GAAG,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;QAC1C,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;QACpD,OAAO,UAAU,CAAC,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;IAC5E,CAAC;uGAvBQ,mBAAmB;2GAAnB,mBAAmB,cAFhB,MAAM;;2FAET,mBAAmB;kBAH/B,UAAU;mBAAC;oBACR,UAAU,EAAE,MAAM;iBACrB","sourcesContent":["import { Injectable } from \"@angular/core\";\r\n\r\nimport { AiFileUpload } from \"./upload.interface\";\r\n\r\n@Injectable({\r\n    providedIn: \"root\",\r\n})\r\nexport class AiFileUploadService {\r\n    readAsBase64(file: File): Promise<AiFileUpload<string>> {\r\n        return new Promise((resolve, reject) => {\r\n            const reader = new FileReader();\r\n            reader.onload = () => {\r\n                resolve({\r\n                    file,\r\n                    name: file.name,\r\n                    base64: reader.result as string,\r\n                    size: this._formatSize(file.size),\r\n                });\r\n            };\r\n            reader.onerror = () => reject(reader.error);\r\n            reader.readAsDataURL(file);\r\n        });\r\n    }\r\n\r\n    private _formatSize(bytes: number): string {\r\n        if (bytes === 0) return \"0 Bytes\";\r\n        const k = 1024;\r\n        const sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\"];\r\n        const i = Math.floor(Math.log(bytes) / Math.log(k));\r\n        return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + \" \" + sizes[i];\r\n    }\r\n}\r\n"]}

package/esm2022/lib/components/upload/upload.variants.js

@@ -0,0 +1,29 @@
+import { cva } from "class-variance-authority";
+export const uploadVariants = cva("flex w-full cursor-pointer transition-colors", {
+    variants: {
+        type: {
+            button: "flex-row items-center gap-3 rounded-lg border border-border px-4 py-3 hover:bg-muted/50",
+            dropzone: "flex-col items-center justify-center gap-2 rounded-lg border-2 border-dashed border-border p-8 hover:border-primary/50 hover:bg-muted/30",
+        },
+        disabled: {
+            true: "pointer-events-none opacity-50",
+            false: "",
+        },
+    },
+    defaultVariants: {
+        type: "button",
+        disabled: false,
+    },
+});
+export const uploadSelectedVariants = cva("flex items-center w-full rounded-lg border border-border transition-colors", {
+    variants: {
+        type: {
+            list: "flex-row gap-3 px-4 py-3",
+            card: "flex-col overflow-hidden",
+        },
+    },
+    defaultVariants: {
+        type: "list",
+    },
+});
+//# sourceMappingURL=upload.variants.js.map

package/esm2022/lib/components/upload/upload.variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload.variants.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/upload/upload.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAgB,MAAM,0BAA0B,CAAC;AAE7D,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAC,8CAA8C,EAAE;IAC9E,QAAQ,EAAE;QACN,IAAI,EAAE;YACF,MAAM,EAAE,yFAAyF;YACjG,QAAQ,EAAE,0IAA0I;SACvJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,gCAAgC;YACtC,KAAK,EAAE,EAAE;SACZ;KACJ;IACD,eAAe,EAAE;QACb,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,KAAK;KAClB;CACJ,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAC,4EAA4E,EAAE;IACpH,QAAQ,EAAE;QACN,IAAI,EAAE;YACF,IAAI,EAAE,0BAA0B;YAChC,IAAI,EAAE,0BAA0B;SACnC;KACJ;IACD,eAAe,EAAE;QACb,IAAI,EAAE,MAAM;KACf;CACJ,CAAC,CAAC","sourcesContent":["import { cva, VariantProps } from \"class-variance-authority\";\r\n\r\nexport const uploadVariants = cva(\"flex w-full cursor-pointer transition-colors\", {\r\n    variants: {\r\n        type: {\r\n            button: \"flex-row items-center gap-3 rounded-lg border border-border px-4 py-3 hover:bg-muted/50\",\r\n            dropzone: \"flex-col items-center justify-center gap-2 rounded-lg border-2 border-dashed border-border p-8 hover:border-primary/50 hover:bg-muted/30\",\r\n        },\r\n        disabled: {\r\n            true: \"pointer-events-none opacity-50\",\r\n            false: \"\",\r\n        },\r\n    },\r\n    defaultVariants: {\r\n        type: \"button\",\r\n        disabled: false,\r\n    },\r\n});\r\n\r\nexport const uploadSelectedVariants = cva(\"flex items-center w-full rounded-lg border border-border transition-colors\", {\r\n    variants: {\r\n        type: {\r\n            list: \"flex-row gap-3 px-4 py-3\",\r\n            card: \"flex-col overflow-hidden\",\r\n        },\r\n    },\r\n    defaultVariants: {\r\n        type: \"list\",\r\n    },\r\n});\r\n\r\nexport type UploadVariants = VariantProps<typeof uploadVariants>;\r\nexport type UploadSelectedVariants = VariantProps<typeof uploadSelectedVariants>;\r\n"]}

package/esm2022/lib/core/directives/generate-id.directive.js

@@ -0,0 +1,29 @@
+import { computed, Directive, inject, Injectable, input } from "@angular/core";
+import * as i0 from "@angular/core";
+class GenerateIdService {
+    #counter = 0;
+    generate(prefix) {
+        return `${prefix}-${++this.#counter}`;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: GenerateIdService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: GenerateIdService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: GenerateIdService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+export class GenerateIdDirective {
+    #service = inject(GenerateIdService);
+    aiId = input("ssr", ...(ngDevMode ? [{ debugName: "aiId" }] : []));
+    id = computed(() => this.#service.generate(this.aiId()), ...(ngDevMode ? [{ debugName: "id" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: GenerateIdDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: GenerateIdDirective, isStandalone: true, selector: "[aiId]", inputs: { aiId: { classPropertyName: "aiId", publicName: "aiId", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["aiId"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: GenerateIdDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[aiId]",
+                    exportAs: "aiId",
+                }]
+        }], propDecorators: { aiId: [{ type: i0.Input, args: [{ isSignal: true, alias: "aiId", required: false }] }] } });
+//# sourceMappingURL=generate-id.directive.js.map

package/esm2022/lib/core/directives/generate-id.directive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate-id.directive.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/core/directives/generate-id.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;;AAE/E,MACM,iBAAiB;IACnB,QAAQ,GAAG,CAAC,CAAC;IAEb,QAAQ,CAAC,MAAc;QACnB,OAAO,GAAG,MAAM,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;IAC1C,CAAC;uGALC,iBAAiB;2GAAjB,iBAAiB,cADG,MAAM;;2FAC1B,iBAAiB;kBADtB,UAAU;mBAAC,EAAE,UAAU,EAAE,MAAM,EAAE;;AAalC,MAAM,OAAO,mBAAmB;IAC5B,QAAQ,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC;IAE5B,IAAI,GAAG,KAAK,CAAC,KAAK,gDAAC,CAAC;IACpB,EAAE,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,8CAAC,CAAC;uGAJzD,mBAAmB;2FAAnB,mBAAmB;;2FAAnB,mBAAmB;kBAJ/B,SAAS;mBAAC;oBACP,QAAQ,EAAE,QAAQ;oBAClB,QAAQ,EAAE,MAAM;iBACnB","sourcesContent":["import { computed, Directive, inject, Injectable, input } from \"@angular/core\";\r\n\r\n@Injectable({ providedIn: \"root\" })\r\nclass GenerateIdService {\r\n    #counter = 0;\r\n\r\n    generate(prefix: string) {\r\n        return `${prefix}-${++this.#counter}`;\r\n    }\r\n}\r\n\r\n@Directive({\r\n    selector: \"[aiId]\",\r\n    exportAs: \"aiId\",\r\n})\r\nexport class GenerateIdDirective {\r\n    #service = inject(GenerateIdService);\r\n\r\n    readonly aiId = input(\"ssr\");\r\n    readonly id = computed(() => this.#service.generate(this.aiId()));\r\n}\r\n"]}

package/esm2022/lib/core/directives/index.js

@@ -0,0 +1,4 @@
+export * from "./generate-id.directive";
+export * from "./normalize";
+export * from "./string-template-ref.directive";
+//# sourceMappingURL=index.js.map

package/esm2022/lib/core/directives/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/core/directives/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,aAAa,CAAC;AAC5B,cAAc,iCAAiC,CAAC","sourcesContent":["export * from \"./generate-id.directive\";\r\nexport * from \"./normalize\";\r\nexport * from \"./string-template-ref.directive\";\r\n"]}

package/esm2022/lib/core/directives/normalize/index.js

@@ -0,0 +1,4 @@
+export * from "./normalize.config";
+export * from "./normalize.directive";
+export * from "./strategies";
+//# sourceMappingURL=index.js.map

package/esm2022/lib/core/directives/normalize/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/core/directives/normalize/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,cAAc,CAAC","sourcesContent":["export * from \"./normalize.config\";\r\nexport * from \"./normalize.directive\";\r\nexport * from \"./strategies\";\r\n"]}

package/esm2022/lib/core/directives/normalize/normalize.config.js

@@ -0,0 +1,7 @@
+import { z } from "zod";
+export const normalizeConfigSchema = z.object({
+    hyphen: z.boolean().optional(),
+    underscore: z.boolean().optional(),
+    dot: z.boolean().optional(),
+});
+//# sourceMappingURL=normalize.config.js.map

package/esm2022/lib/core/directives/normalize/normalize.config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"normalize.config.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/core/directives/normalize/normalize.config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,CAAC,MAAM,CAAC;IAC1C,MAAM,EAAE,CAAC,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;IAC9B,UAAU,EAAE,CAAC,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;IAClC,GAAG,EAAE,CAAC,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;CAC9B,CAAC,CAAC","sourcesContent":["import { z } from \"zod\";\r\n\r\nexport const normalizeConfigSchema = z.object({\r\n    hyphen: z.boolean().optional(),\r\n    underscore: z.boolean().optional(),\r\n    dot: z.boolean().optional(),\r\n});\r\n\r\nexport type AiNormalizeConfig = z.infer<typeof normalizeConfigSchema>;\r\n"]}

package/esm2022/lib/core/directives/normalize/normalize.directive.js

@@ -0,0 +1,37 @@
+import { computed, Directive, ElementRef, HostListener, inject, input } from "@angular/core";
+import { NgControl } from "@angular/forms";
+import { NORMALIZE_STRATEGIES } from "./strategies";
+import * as i0 from "@angular/core";
+export class AiNormalizeDirective {
+    #elementRef = inject(ElementRef);
+    #ngControl = inject(NgControl, { optional: true });
+    normalize = input(...(ngDevMode ? [undefined, { debugName: "normalize" }] : []));
+    normalizeConfig = input(...(ngDevMode ? [undefined, { debugName: "normalizeConfig" }] : []));
+    #strategy = computed(() => {
+        const type = this.normalize();
+        return type ? NORMALIZE_STRATEGIES[type] : null;
+    }, ...(ngDevMode ? [{ debugName: "#strategy" }] : []));
+    onInput(event) {
+        const input = event.target;
+        if (!input)
+            return;
+        const strategy = this.#strategy();
+        if (!strategy)
+            return;
+        const normalized = strategy.normalize(input.value, this.normalizeConfig());
+        this.#elementRef.nativeElement.value = normalized;
+        this.#ngControl?.control?.setValue(normalized, { emitEvent: false });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiNormalizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: AiNormalizeDirective, isStandalone: true, selector: "[normalize]", inputs: { normalize: { classPropertyName: "normalize", publicName: "normalize", isSignal: true, isRequired: false, transformFunction: null }, normalizeConfig: { classPropertyName: "normalizeConfig", publicName: "normalizeConfig", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "onInput($event)" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiNormalizeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[normalize]",
+                }]
+        }], propDecorators: { normalize: [{ type: i0.Input, args: [{ isSignal: true, alias: "normalize", required: false }] }], normalizeConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "normalizeConfig", required: false }] }], onInput: [{
+                type: HostListener,
+                args: ["input", ["$event"]]
+            }] } });
+//# sourceMappingURL=normalize.directive.js.map

package/esm2022/lib/core/directives/normalize/normalize.directive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"normalize.directive.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/core/directives/normalize/normalize.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAmB,oBAAoB,EAAE,MAAM,cAAc,CAAC;;AAKrE,MAAM,OAAO,oBAAoB;IAC7B,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;IACjC,UAAU,GAAG,MAAM,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAEnD,SAAS,GAAG,KAAK,+DAAmB,CAAC;IACrC,eAAe,GAAG,KAAK,qEAAiC,CAAC;IAEzD,SAAS,GAAG,QAAQ,CAAC,GAAG,EAAE;QACtB,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAC9B,OAAO,IAAI,CAAC,CAAC,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IACpD,CAAC,qDAAC,CAAC;IAGH,OAAO,CAAC,KAAY;QAChB,MAAM,KAAK,GAAG,KAAK,CAAC,MAAiC,CAAC;QACtD,IAAI,CAAC,KAAK;YAAE,OAAO;QAEnB,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAClC,IAAI,CAAC,QAAQ;YAAE,OAAO;QAEtB,MAAM,UAAU,GAAG,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC;QAE3E,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,KAAK,GAAG,UAAU,CAAC;QAClD,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE,QAAQ,CAAC,UAAU,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;IACzE,CAAC;uGAxBQ,oBAAoB;2FAApB,oBAAoB;;2FAApB,oBAAoB;kBAHhC,SAAS;mBAAC;oBACP,QAAQ,EAAE,aAAa;iBAC1B;;sBAaI,YAAY;uBAAC,OAAO,EAAE,CAAC,QAAQ,CAAC","sourcesContent":["import { computed, Directive, ElementRef, HostListener, inject, input } from \"@angular/core\";\r\nimport { NgControl } from \"@angular/forms\";\r\nimport { AiNormalizeConfig } from \"./normalize.config\";\r\nimport { AiNormalizeType, NORMALIZE_STRATEGIES } from \"./strategies\";\r\n\r\n@Directive({\r\n    selector: \"[normalize]\",\r\n})\r\nexport class AiNormalizeDirective {\r\n    #elementRef = inject(ElementRef);\r\n    #ngControl = inject(NgControl, { optional: true });\r\n\r\n    normalize = input<AiNormalizeType>();\r\n    normalizeConfig = input<AiNormalizeConfig | undefined>();\r\n\r\n    #strategy = computed(() => {\r\n        const type = this.normalize();\r\n        return type ? NORMALIZE_STRATEGIES[type] : null;\r\n    });\r\n\r\n    @HostListener(\"input\", [\"$event\"])\r\n    onInput(event: Event) {\r\n        const input = event.target as HTMLInputElement | null;\r\n        if (!input) return;\r\n\r\n        const strategy = this.#strategy();\r\n        if (!strategy) return;\r\n\r\n        const normalized = strategy.normalize(input.value, this.normalizeConfig());\r\n\r\n        this.#elementRef.nativeElement.value = normalized;\r\n        this.#ngControl?.control?.setValue(normalized, { emitEvent: false });\r\n    }\r\n}\r\n"]}

package/esm2022/lib/core/directives/normalize/strategies/alfa.strategy.js

@@ -0,0 +1,14 @@
+export class AlfaNormalizeStrategy {
+    normalize(value, config) {
+        let extraChars = "";
+        if (config?.hyphen)
+            extraChars += "\\-";
+        if (config?.underscore)
+            extraChars += "_";
+        if (config?.dot)
+            extraChars += "\\.";
+        const regex = new RegExp(`[^\\p{L}\\s${extraChars}]`, "gu");
+        return value.replace(regex, "");
+    }
+}
+//# sourceMappingURL=alfa.strategy.js.map

package/esm2022/lib/core/directives/normalize/strategies/alfa.strategy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alfa.strategy.js","sourceRoot":"","sources":["../../../../../../../../../libs/ai-ui/src/lib/core/directives/normalize/strategies/alfa.strategy.ts"],"names":[],"mappings":"AAGA,MAAM,OAAO,qBAAqB;IAC9B,SAAS,CAAC,KAAa,EAAE,MAA0B;QAC/C,IAAI,UAAU,GAAG,EAAE,CAAC;QAEpB,IAAI,MAAM,EAAE,MAAM;YAAE,UAAU,IAAI,KAAK,CAAC;QACxC,IAAI,MAAM,EAAE,UAAU;YAAE,UAAU,IAAI,GAAG,CAAC;QAC1C,IAAI,MAAM,EAAE,GAAG;YAAE,UAAU,IAAI,KAAK,CAAC;QAErC,MAAM,KAAK,GAAG,IAAI,MAAM,CAAC,cAAc,UAAU,GAAG,EAAE,IAAI,CAAC,CAAC;QAC5D,OAAO,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;IACpC,CAAC;CACJ","sourcesContent":["import { AiNormalizeConfig } from \"../normalize.config\";\r\nimport { NormalizeStrategy } from \"./normalize.strategy\";\r\n\r\nexport class AlfaNormalizeStrategy implements NormalizeStrategy {\r\n    normalize(value: string, config?: AiNormalizeConfig): string {\r\n        let extraChars = \"\";\r\n\r\n        if (config?.hyphen) extraChars += \"\\\\-\";\r\n        if (config?.underscore) extraChars += \"_\";\r\n        if (config?.dot) extraChars += \"\\\\.\";\r\n\r\n        const regex = new RegExp(`[^\\\\p{L}\\\\s${extraChars}]`, \"gu\");\r\n        return value.replace(regex, \"\");\r\n    }\r\n}\r\n"]}

package/esm2022/lib/core/directives/normalize/strategies/alfanum.strategy.js

@@ -0,0 +1,14 @@
+export class AlfanumNormalizeStrategy {
+    normalize(value, config) {
+        let extraChars = "";
+        if (config?.hyphen)
+            extraChars += "\\-";
+        if (config?.underscore)
+            extraChars += "_";
+        if (config?.dot)
+            extraChars += "\\.";
+        const regex = new RegExp(`[^\\p{L}0-9\\s${extraChars}]`, "gu");
+        return value.replace(regex, "");
+    }
+}
+//# sourceMappingURL=alfanum.strategy.js.map

package/esm2022/lib/core/directives/normalize/strategies/alfanum.strategy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alfanum.strategy.js","sourceRoot":"","sources":["../../../../../../../../../libs/ai-ui/src/lib/core/directives/normalize/strategies/alfanum.strategy.ts"],"names":[],"mappings":"AAGA,MAAM,OAAO,wBAAwB;IACjC,SAAS,CAAC,KAAa,EAAE,MAA0B;QAC/C,IAAI,UAAU,GAAG,EAAE,CAAC;QAEpB,IAAI,MAAM,EAAE,MAAM;YAAE,UAAU,IAAI,KAAK,CAAC;QACxC,IAAI,MAAM,EAAE,UAAU;YAAE,UAAU,IAAI,GAAG,CAAC;QAC1C,IAAI,MAAM,EAAE,GAAG;YAAE,UAAU,IAAI,KAAK,CAAC;QAErC,MAAM,KAAK,GAAG,IAAI,MAAM,CAAC,iBAAiB,UAAU,GAAG,EAAE,IAAI,CAAC,CAAC;QAE/D,OAAO,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;IACpC,CAAC;CACJ","sourcesContent":["import { AiNormalizeConfig } from \"../normalize.config\";\r\nimport { NormalizeStrategy } from \"./normalize.strategy\";\r\n\r\nexport class AlfanumNormalizeStrategy implements NormalizeStrategy {\r\n    normalize(value: string, config?: AiNormalizeConfig): string {\r\n        let extraChars = \"\";\r\n\r\n        if (config?.hyphen) extraChars += \"\\\\-\";\r\n        if (config?.underscore) extraChars += \"_\";\r\n        if (config?.dot) extraChars += \"\\\\.\";\r\n\r\n        const regex = new RegExp(`[^\\\\p{L}0-9\\\\s${extraChars}]`, \"gu\");\r\n\r\n        return value.replace(regex, \"\");\r\n    }\r\n}\r\n"]}