@wirekyt/angular 0.0.26 → 0.0.29

package/dist/fesm2022/wirekyt-angular-file-upload.mjs

@@ -0,0 +1,604 @@
+import * as fileUpload from '@wirekyt/dom/machines/file-upload';
+export { anatomy as fileUploadAnatomy } from '@wirekyt/dom/machines/file-upload';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, TemplateRef, ViewContainerRef, effect, DestroyRef, Directive, numberAttribute, input, booleanAttribute, model, output, Renderer2, ElementRef, forwardRef, computed, signal, untracked } from '@angular/core';
+import { injectLocale, injectEnvironment, createId, useMachine, bindProps } from '@wirekyt/angular';
+import { injectFieldContextOptional } from '@wirekyt/angular/field';
+
+const FILE_UPLOAD_CONTEXT = new InjectionToken("WIREKYT.FILE_UPLOAD_CONTEXT");
+function injectFileUploadContext() {
+    return inject(FILE_UPLOAD_CONTEXT);
+}
+
+class FileUploadContext {
+    static ngTemplateContextGuard(_directive, context) {
+        void context;
+        return true;
+    }
+    fileUpload = injectFileUploadContext();
+    templateRef = inject(TemplateRef);
+    viewContainer = inject(ViewContainerRef);
+    constructor() {
+        const view = this.viewContainer.createEmbeddedView(this.templateRef, {
+            $implicit: this.fileUpload.api,
+            api: this.fileUpload.api,
+        });
+        effect(() => {
+            this.fileUpload.api();
+            view.detectChanges();
+        });
+        inject(DestroyRef).onDestroy(() => view.destroy());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadContext, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadContext, isStandalone: true, selector: "[file-upload-context]", exportAs: ["fileUploadContext"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadContext, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-context]",
+                    standalone: true,
+                    exportAs: "fileUploadContext",
+                }]
+        }], ctorParameters: () => [] });
+
+const FILE_UPLOAD_ITEM_CONTEXT = new InjectionToken("WIREKYT.FILE_UPLOAD_ITEM_CONTEXT");
+function injectFileUploadItemContext() {
+    const context = inject(FILE_UPLOAD_ITEM_CONTEXT, { optional: true });
+    if (!context) {
+        throw new Error("FILE_UPLOAD_ITEM_CONTEXT not found: a file-upload item part directive must be used inside a [file-upload-item] directive.");
+    }
+    return context;
+}
+
+function useFileUpload(options) {
+    const locale = injectLocale();
+    const environment = injectEnvironment();
+    const field = injectFieldContextOptional();
+    const fallbackId = createId();
+    return useMachine({
+        machine: fileUpload.machine,
+        context: () => {
+            const props = options.context();
+            const id = props.id ?? fallbackId;
+            const merged = {
+                dir: locale.dir,
+                locale: locale.locale,
+                getRootNode: environment.getRootNode,
+                ...props,
+                id,
+            };
+            if (field) {
+                const fieldIds = field.ids;
+                const baseIds = (props.ids ?? {});
+                merged.ids = {
+                    label: fieldIds.label,
+                    hiddenInput: fieldIds.control,
+                    ...baseIds,
+                };
+                const disabled = Boolean(props.disabled) || field.disabled();
+                const invalid = Boolean(props.invalid) || field.invalid();
+                const readOnly = Boolean(props.readOnly) || field.readOnly();
+                const required = Boolean(props.required) || field.required();
+                merged.disabled = disabled || undefined;
+                merged.invalid = invalid || undefined;
+                merged.readOnly = readOnly || undefined;
+                merged.required = required || undefined;
+            }
+            return merged;
+        },
+        connect: (service, normalize) => fileUpload.connect(service, normalize),
+    });
+}
+
+const optionalNumberAttribute = (value) => {
+    if (value === null || value === undefined || value === "")
+        return undefined;
+    const next = numberAttribute(value);
+    return Number.isFinite(next) ? next : undefined;
+};
+class FileUploadRoot {
+    id = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    elementIds = input(undefined, { ...(ngDevMode ? { debugName: "elementIds" } : /* istanbul ignore next */ {}), alias: "ids" });
+    translations = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "translations" }] : /* istanbul ignore next */ []));
+    name = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    accept = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    invalid = input(false, { ...(ngDevMode ? { debugName: "invalid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    readOnly = input(false, { ...(ngDevMode ? { debugName: "readOnly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    allowDrop = input(undefined, { ...(ngDevMode ? { debugName: "allowDrop" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined || value === null ? undefined : booleanAttribute(value) });
+    maxFileSize = input(undefined, { ...(ngDevMode ? { debugName: "maxFileSize" } : /* istanbul ignore next */ {}), transform: optionalNumberAttribute });
+    minFileSize = input(undefined, { ...(ngDevMode ? { debugName: "minFileSize" } : /* istanbul ignore next */ {}), transform: optionalNumberAttribute });
+    maxFiles = input(undefined, { ...(ngDevMode ? { debugName: "maxFiles" } : /* istanbul ignore next */ {}), transform: optionalNumberAttribute });
+    preventDocumentDrop = input(undefined, { ...(ngDevMode ? { debugName: "preventDocumentDrop" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined || value === null ? undefined : booleanAttribute(value) });
+    validate = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "validate" }] : /* istanbul ignore next */ []));
+    defaultAcceptedFiles = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultAcceptedFiles" }] : /* istanbul ignore next */ []));
+    acceptedFiles = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "acceptedFiles" }] : /* istanbul ignore next */ []));
+    capture = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "capture" }] : /* istanbul ignore next */ []));
+    directory = input(undefined, { ...(ngDevMode ? { debugName: "directory" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined || value === null ? undefined : booleanAttribute(value) });
+    transformFiles = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "transformFiles" }] : /* istanbul ignore next */ []));
+    locale = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []));
+    fileChange = output();
+    fileAccept = output();
+    fileReject = output();
+    machine = useFileUpload({
+        context: () => ({
+            id: this.id(),
+            ids: this.elementIds(),
+            translations: this.translations(),
+            name: this.name(),
+            accept: this.accept(),
+            disabled: this.disabled() || undefined,
+            required: this.required() || undefined,
+            invalid: this.invalid() || undefined,
+            readOnly: this.readOnly() || undefined,
+            allowDrop: this.allowDrop(),
+            maxFileSize: this.maxFileSize(),
+            minFileSize: this.minFileSize(),
+            maxFiles: this.maxFiles(),
+            preventDocumentDrop: this.preventDocumentDrop(),
+            validate: this.validate(),
+            defaultAcceptedFiles: this.defaultAcceptedFiles(),
+            acceptedFiles: this.acceptedFiles(),
+            capture: this.capture(),
+            directory: this.directory(),
+            transformFiles: this.transformFiles(),
+            locale: this.locale(),
+            onFileChange: (details) => {
+                if (!filesShallowEqual(this.acceptedFiles(), details.acceptedFiles)) {
+                    this.acceptedFiles.set([...details.acceptedFiles]);
+                }
+                this.fileChange.emit(details);
+            },
+            onFileAccept: (details) => this.fileAccept.emit(details),
+            onFileReject: (details) => this.fileReject.emit(details),
+        }),
+    });
+    state = this.machine.state;
+    api = this.machine.api;
+    service = this.machine.service;
+    send = this.machine.send;
+    constructor() {
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => this.api().getRootProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadRoot, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: FileUploadRoot, isStandalone: true, selector: "[file-upload-root]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, elementIds: { classPropertyName: "elementIds", publicName: "ids", isSignal: true, isRequired: false, transformFunction: null }, translations: { classPropertyName: "translations", publicName: "translations", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, allowDrop: { classPropertyName: "allowDrop", publicName: "allowDrop", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, minFileSize: { classPropertyName: "minFileSize", publicName: "minFileSize", isSignal: true, isRequired: false, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, preventDocumentDrop: { classPropertyName: "preventDocumentDrop", publicName: "preventDocumentDrop", isSignal: true, isRequired: false, transformFunction: null }, validate: { classPropertyName: "validate", publicName: "validate", isSignal: true, isRequired: false, transformFunction: null }, defaultAcceptedFiles: { classPropertyName: "defaultAcceptedFiles", publicName: "defaultAcceptedFiles", isSignal: true, isRequired: false, transformFunction: null }, acceptedFiles: { classPropertyName: "acceptedFiles", publicName: "acceptedFiles", isSignal: true, isRequired: false, transformFunction: null }, capture: { classPropertyName: "capture", publicName: "capture", isSignal: true, isRequired: false, transformFunction: null }, directory: { classPropertyName: "directory", publicName: "directory", isSignal: true, isRequired: false, transformFunction: null }, transformFiles: { classPropertyName: "transformFiles", publicName: "transformFiles", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { acceptedFiles: "acceptedFilesChange", fileChange: "fileChange", fileAccept: "fileAccept", fileReject: "fileReject" }, providers: [{ provide: FILE_UPLOAD_CONTEXT, useExisting: forwardRef(() => FileUploadRoot) }], exportAs: ["fileUploadRoot"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadRoot, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-root]",
+                    standalone: true,
+                    exportAs: "fileUploadRoot",
+                    providers: [{ provide: FILE_UPLOAD_CONTEXT, useExisting: forwardRef(() => FileUploadRoot) }],
+                }]
+        }], ctorParameters: () => [], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], elementIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "ids", required: false }] }], translations: [{ type: i0.Input, args: [{ isSignal: true, alias: "translations", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], allowDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowDrop", required: false }] }], maxFileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFileSize", required: false }] }], minFileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "minFileSize", required: false }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], preventDocumentDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventDocumentDrop", required: false }] }], validate: [{ type: i0.Input, args: [{ isSignal: true, alias: "validate", required: false }] }], defaultAcceptedFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultAcceptedFiles", required: false }] }], acceptedFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "acceptedFiles", required: false }] }, { type: i0.Output, args: ["acceptedFilesChange"] }], capture: [{ type: i0.Input, args: [{ isSignal: true, alias: "capture", required: false }] }], directory: [{ type: i0.Input, args: [{ isSignal: true, alias: "directory", required: false }] }], transformFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "transformFiles", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], fileChange: [{ type: i0.Output, args: ["fileChange"] }], fileAccept: [{ type: i0.Output, args: ["fileAccept"] }], fileReject: [{ type: i0.Output, args: ["fileReject"] }] } });
+const filesShallowEqual = (a, b) => Array.isArray(a) && a.length === b.length && a.every((file, index) => file === b[index]);
+
+class FileUploadRootProvider {
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    state = computed(() => this.value().state(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    api = computed(() => this.value().api(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "api" }] : /* istanbul ignore next */ []));
+    send = (event) => this.value().send(event);
+    get service() {
+        return this.value().service;
+    }
+    resolveValue() {
+        return this.value();
+    }
+    constructor() {
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => this.api().getRootProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadRootProvider, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: FileUploadRootProvider, isStandalone: true, selector: "[file-upload-root-provider]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
+            { provide: FILE_UPLOAD_CONTEXT, useExisting: forwardRef(() => FileUploadRootProvider) },
+        ], exportAs: ["fileUploadRootProvider"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadRootProvider, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-root-provider]",
+                    standalone: true,
+                    exportAs: "fileUploadRootProvider",
+                    providers: [
+                        { provide: FILE_UPLOAD_CONTEXT, useExisting: forwardRef(() => FileUploadRootProvider) },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] } });
+
+class FileUploadLabel {
+    constructor() {
+        const context = injectFileUploadContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getLabelProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadLabel, isStandalone: true, selector: "[file-upload-label]", exportAs: ["fileUploadLabel"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadLabel, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-label]",
+                    standalone: true,
+                    exportAs: "fileUploadLabel",
+                }]
+        }], ctorParameters: () => [] });
+
+class FileUploadTrigger {
+    constructor() {
+        const context = injectFileUploadContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getTriggerProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadTrigger, isStandalone: true, selector: "[file-upload-trigger]", exportAs: ["fileUploadTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-trigger]",
+                    standalone: true,
+                    exportAs: "fileUploadTrigger",
+                }]
+        }], ctorParameters: () => [] });
+
+class FileUploadDropzone {
+    disableClick = input(undefined, { ...(ngDevMode ? { debugName: "disableClick" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined || value === null ? undefined : booleanAttribute(value) });
+    constructor() {
+        const context = injectFileUploadContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getDropzoneProps({ disableClick: this.disableClick() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadDropzone, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: FileUploadDropzone, isStandalone: true, selector: "[file-upload-dropzone]", inputs: { disableClick: { classPropertyName: "disableClick", publicName: "disableClick", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["fileUploadDropzone"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadDropzone, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-dropzone]",
+                    standalone: true,
+                    exportAs: "fileUploadDropzone",
+                }]
+        }], ctorParameters: () => [], propDecorators: { disableClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableClick", required: false }] }] } });
+
+class FileUploadHiddenInput {
+    constructor() {
+        const context = injectFileUploadContext();
+        const field = injectFieldContextOptional();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => ({
+                ...context.api().getHiddenInputProps(),
+                "aria-describedby": field?.ariaDescribedby(),
+            }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadHiddenInput, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadHiddenInput, isStandalone: true, selector: "input[file-upload-hidden-input]", exportAs: ["fileUploadHiddenInput"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadHiddenInput, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "input[file-upload-hidden-input]",
+                    standalone: true,
+                    exportAs: "fileUploadHiddenInput",
+                }]
+        }], ctorParameters: () => [] });
+
+class FileUploadClearTrigger {
+    constructor() {
+        const context = injectFileUploadContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getClearTriggerProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadClearTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadClearTrigger, isStandalone: true, selector: "[file-upload-clear-trigger]", exportAs: ["fileUploadClearTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadClearTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-clear-trigger]",
+                    standalone: true,
+                    exportAs: "fileUploadClearTrigger",
+                }]
+        }], ctorParameters: () => [] });
+
+const FILE_UPLOAD_ITEM_GROUP_CONTEXT = new InjectionToken("WIREKYT.FILE_UPLOAD_ITEM_GROUP_CONTEXT");
+function injectFileUploadItemGroupContextOptional() {
+    return inject(FILE_UPLOAD_ITEM_GROUP_CONTEXT, { optional: true });
+}
+class FileUploadItemGroup {
+    type = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectFileUploadContext();
+        const typeSignal = computed(() => this.type(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "typeSignal" }] : /* istanbul ignore next */ []));
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemGroupProps({ type: typeSignal() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: FileUploadItemGroup, isStandalone: true, selector: "[file-upload-item-group]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            { provide: FILE_UPLOAD_ITEM_GROUP_CONTEXT, useExisting: forwardRef(() => FileUploadItemGroup) },
+        ], exportAs: ["fileUploadItemGroup"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemGroup, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-item-group]",
+                    standalone: true,
+                    exportAs: "fileUploadItemGroup",
+                    providers: [
+                        { provide: FILE_UPLOAD_ITEM_GROUP_CONTEXT, useExisting: forwardRef(() => FileUploadItemGroup) },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }] } });
+
+class FileUploadItem {
+    file = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "file" }] : /* istanbul ignore next */ []));
+    group = injectFileUploadItemGroupContextOptional();
+    type = computed(() => this.group?.type(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectFileUploadContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemProps({ file: this.file(), type: this.type() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: FileUploadItem, isStandalone: true, selector: "[file-upload-item]", inputs: { file: { classPropertyName: "file", publicName: "file", isSignal: true, isRequired: true, transformFunction: null } }, providers: [{ provide: FILE_UPLOAD_ITEM_CONTEXT, useExisting: forwardRef(() => FileUploadItem) }], exportAs: ["fileUploadItem"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItem, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-item]",
+                    standalone: true,
+                    exportAs: "fileUploadItem",
+                    providers: [{ provide: FILE_UPLOAD_ITEM_CONTEXT, useExisting: forwardRef(() => FileUploadItem) }],
+                }]
+        }], ctorParameters: () => [], propDecorators: { file: [{ type: i0.Input, args: [{ isSignal: true, alias: "file", required: true }] }] } });
+
+class FileUploadItemName {
+    constructor() {
+        const context = injectFileUploadContext();
+        const item = injectFileUploadItemContext();
+        const elementRef = inject(ElementRef);
+        const renderer = inject(Renderer2);
+        const destroyRef = inject(DestroyRef);
+        let ownsTextContent = false;
+        effect(() => {
+            const fileName = item.file().name;
+            queueMicrotask(() => {
+                if (!ownsTextContent && elementRef.nativeElement.textContent?.trim().length !== 0)
+                    return;
+                ownsTextContent = true;
+                renderer.setProperty(elementRef.nativeElement, "textContent", fileName);
+            });
+        });
+        bindProps({
+            elementRef,
+            renderer,
+            destroyRef,
+            props: () => context.api().getItemNameProps({ file: item.file(), type: item.type() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemName, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadItemName, isStandalone: true, selector: "[file-upload-item-name]", exportAs: ["fileUploadItemName"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemName, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-item-name]",
+                    standalone: true,
+                    exportAs: "fileUploadItemName",
+                }]
+        }], ctorParameters: () => [] });
+
+class FileUploadItemSizeText {
+    constructor() {
+        const context = injectFileUploadContext();
+        const item = injectFileUploadItemContext();
+        const elementRef = inject(ElementRef);
+        const renderer = inject(Renderer2);
+        const destroyRef = inject(DestroyRef);
+        let ownsTextContent = false;
+        effect(() => {
+            const sizeText = context.api().getFileSize(item.file());
+            queueMicrotask(() => {
+                if (!ownsTextContent && elementRef.nativeElement.textContent?.trim().length !== 0)
+                    return;
+                ownsTextContent = true;
+                renderer.setProperty(elementRef.nativeElement, "textContent", sizeText);
+            });
+        });
+        bindProps({
+            elementRef,
+            renderer,
+            destroyRef,
+            props: () => context.api().getItemSizeTextProps({ file: item.file(), type: item.type() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemSizeText, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadItemSizeText, isStandalone: true, selector: "[file-upload-item-size-text]", exportAs: ["fileUploadItemSizeText"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemSizeText, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-item-size-text]",
+                    standalone: true,
+                    exportAs: "fileUploadItemSizeText",
+                }]
+        }], ctorParameters: () => [] });
+
+class FileUploadItemPreview {
+    type = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    context = injectFileUploadContext();
+    item = injectFileUploadItemContext();
+    matches = computed(() => {
+        const pattern = this.type();
+        if (!pattern || pattern === "*/*")
+            return true;
+        const mimeType = this.item.file().type;
+        if (pattern.endsWith("/*")) {
+            return mimeType.startsWith(pattern.slice(0, -1));
+        }
+        if (/[\^$*?()[\]{}|\\]/.test(pattern)) {
+            try {
+                return new RegExp(pattern).test(mimeType);
+            }
+            catch {
+                return false;
+            }
+        }
+        return mimeType === pattern;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "matches" }] : /* istanbul ignore next */ []));
+    constructor() {
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => ({
+                ...this.context
+                    .api()
+                    .getItemPreviewProps({ file: this.item.file(), type: this.item.type() }),
+                hidden: this.matches() ? undefined : true,
+            }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemPreview, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: FileUploadItemPreview, isStandalone: true, selector: "[file-upload-item-preview]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["fileUploadItemPreview"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemPreview, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-item-preview]",
+                    standalone: true,
+                    exportAs: "fileUploadItemPreview",
+                }]
+        }], ctorParameters: () => [], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }] } });
+
+class FileUploadItemPreviewImage {
+    urlSignal = signal(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "urlSignal" }] : /* istanbul ignore next */ []));
+    url = this.urlSignal.asReadonly();
+    constructor() {
+        const context = injectFileUploadContext();
+        const item = injectFileUploadItemContext();
+        effect((onCleanup) => {
+            const file = item.file();
+            if (!file.type.startsWith("image/")) {
+                this.urlSignal.set(undefined);
+                return;
+            }
+            const revoke = untracked(() => context.api().createFileUrl(file, (url) => untracked(() => this.urlSignal.set(url))));
+            onCleanup(() => {
+                this.urlSignal.set(undefined);
+                revoke();
+            });
+        });
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => {
+                const url = this.urlSignal();
+                if (!url)
+                    return { hidden: true };
+                return context
+                    .api()
+                    .getItemPreviewImageProps({ file: item.file(), type: item.type(), url });
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemPreviewImage, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadItemPreviewImage, isStandalone: true, selector: "img[file-upload-item-preview-image]", exportAs: ["fileUploadItemPreviewImage"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemPreviewImage, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "img[file-upload-item-preview-image]",
+                    standalone: true,
+                    exportAs: "fileUploadItemPreviewImage",
+                }]
+        }], ctorParameters: () => [] });
+
+class FileUploadItemDeleteTrigger {
+    constructor() {
+        const context = injectFileUploadContext();
+        const item = injectFileUploadItemContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemDeleteTriggerProps({ file: item.file(), type: item.type() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemDeleteTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: FileUploadItemDeleteTrigger, isStandalone: true, selector: "[file-upload-item-delete-trigger]", exportAs: ["fileUploadItemDeleteTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: FileUploadItemDeleteTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[file-upload-item-delete-trigger]",
+                    standalone: true,
+                    exportAs: "fileUploadItemDeleteTrigger",
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { FILE_UPLOAD_CONTEXT, FILE_UPLOAD_ITEM_CONTEXT, FILE_UPLOAD_ITEM_GROUP_CONTEXT, FileUploadClearTrigger, FileUploadContext, FileUploadDropzone, FileUploadHiddenInput, FileUploadItem, FileUploadItemDeleteTrigger, FileUploadItemGroup, FileUploadItemName, FileUploadItemPreview, FileUploadItemPreviewImage, FileUploadItemSizeText, FileUploadLabel, FileUploadRoot, FileUploadRootProvider, FileUploadTrigger, injectFileUploadContext, injectFileUploadItemContext, injectFileUploadItemGroupContextOptional, useFileUpload };
+//# sourceMappingURL=wirekyt-angular-file-upload.mjs.map