@progress/kendo-angular-upload 16.3.0-develop.3 → 16.3.0-develop.4

package/common/base.d.ts

@@ -0,0 +1,161 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ChangeDetectorRef, ElementRef, EventEmitter, Injector, NgZone } from "@angular/core";
+import { RemoveEvent, SelectEvent } from "../events";
+import { FileTemplateDirective } from "../templates/file-template.directive";
+import { FileInfoTemplateDirective } from "../templates/file-info-template.directive";
+import { FileMap, FileRestrictions } from "../types";
+import { UploadService } from "../upload.service";
+import { FormControl } from "@angular/forms";
+import { NavigationService } from "../navigation.service";
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export declare abstract class UploadFileSelectBase {
+    protected uploadService: UploadService;
+    protected navigation: NavigationService;
+    protected cdr: ChangeDetectorRef;
+    protected injector: Injector;
+    protected zone: NgZone;
+    /**
+     * @hidden
+     */
+    fileTemplate: FileTemplateDirective;
+    /**
+     * @hidden
+     */
+    fileInfoTemplate: FileInfoTemplateDirective;
+    /**
+     * @hidden
+     */
+    fileSelectButton: ElementRef;
+    /**
+     * Sets the `accept` attribute of the internal `input` element of the component.
+     */
+    accept: string;
+    /**
+     * Disables the component.
+     *
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Enables the selection of multiple files
+     * If set to `false`, only one file can be selected at a time.
+     * @default true
+     */
+    multiple: boolean;
+    /**
+     * Toggles the visibility of the file list.
+     * @default true
+     */
+    showFileList: boolean;
+    /**
+     * Specifies the [`tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the component.
+     * @default 0
+     */
+    tabindex: number;
+    /**
+     * Sets the restrictions for selected files.
+     */
+    set restrictions(restrictions: FileRestrictions);
+    get restrictions(): FileRestrictions;
+    /**
+     * Specifies the id of the external drop zone to associate with the component.
+     */
+    zoneId: string;
+    /**
+     * @hidden
+     */
+    focusableId: string;
+    /**
+     * @hidden
+     */
+    hostDefaultClasses: boolean;
+    /**
+     * @hidden
+     */
+    get hostDisabledClass(): boolean;
+    /**
+     * Fires when the user navigates outside the component.
+     */
+    onBlur: EventEmitter<any>;
+    /**
+     * Fires when the component is focused.
+     */
+    onFocus: EventEmitter<any>;
+    /**
+     * Fires when files are selected. If prevented, the selected files will not be added to the list.
+     */
+    select: EventEmitter<SelectEvent>;
+    /**
+     * Fires when a file is about to be removed. If prevented, the file will remain in the list.
+     */
+    remove: EventEmitter<RemoveEvent>;
+    /**
+     * @hidden
+     */
+    _restrictions: FileRestrictions;
+    /**
+     * @hidden
+     */
+    fileList: FileMap;
+    constructor(uploadService: UploadService, navigation: NavigationService, cdr: ChangeDetectorRef, injector: Injector, zone: NgZone);
+    /**
+     * @hidden
+     */
+    get formControl(): FormControl;
+    /**
+     * @hidden
+     */
+    get isControlRequired(): boolean;
+    /**
+     * @hidden
+     */
+    get hasFileList(): boolean;
+    /**
+     * @hidden
+     */
+    writeValue(newValue: any, validation: Function, callback: string): void;
+    protected onTouchedCallback: Function;
+    protected onChangeCallback: Function;
+    /**
+     * @hidden
+     */
+    registerOnChange(fn: any): void;
+    /**
+     * @hidden
+     */
+    registerOnTouched(fn: any): void;
+    /**
+     * @hidden
+     */
+    setDisabledState(isDisabled: boolean): void;
+    /**
+     * @hidden
+     */
+    onFileSelectButtonFocus(): void;
+    /**
+     * Focuses the component's `Select files` button.
+     */
+    focus(): void;
+    /**
+     * @hidden
+     * @deprecated
+     */
+    focusComponent(): void;
+    /**
+     * Blurs the component if it was previously focused.
+     */
+    blur(): void;
+    /**
+     * @hidden
+     * @deprecated
+     */
+    blurComponent(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UploadFileSelectBase, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<UploadFileSelectBase, never, never, { "accept": "accept"; "disabled": "disabled"; "multiple": "multiple"; "showFileList": "showFileList"; "tabindex": "tabindex"; "restrictions": "restrictions"; "zoneId": "zoneId"; "focusableId": "focusableId"; }, { "onBlur": "blur"; "onFocus": "focus"; "select": "select"; "remove": "remove"; }, ["fileTemplate", "fileInfoTemplate"], never, false, never>;
+}

package/common/util.d.ts

@@ -57,7 +57,7 @@ export declare const IGNORE_TARGET_CLASSES = "k-icon k-select k-input k-multisel
 /**
  * @hidden
  */
-export declare const UPLOAD_CLASSES = "k-upload-button k-clear-selected k-upload-selected k-upload-action";
+export declare const UPLOAD_CLASSES = "k-upload-button k-clear-selected k-upload-selected k-upload-action k-file";
 /**
  * @hidden
  */

package/esm2020/common/base.mjs

@@ -0,0 +1,247 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ChangeDetectorRef, ContentChild, Directive, ElementRef, EventEmitter, HostBinding, Injector, Input, NgZone, Output, ViewChild } from "@angular/core";
+import { guid, isControlRequired } from "@progress/kendo-angular-common";
+import { FileTemplateDirective } from "../templates/file-template.directive";
+import { FileInfoTemplateDirective } from "../templates/file-info-template.directive";
+import { UploadService } from "../upload.service";
+import { NgControl } from "@angular/forms";
+import { NavigationService } from "../navigation.service";
+import * as i0 from "@angular/core";
+import * as i1 from "../upload.service";
+import * as i2 from "../navigation.service";
+/**
+ * @hidden
+ */
+export class UploadFileSelectBase {
+    constructor(uploadService, navigation, cdr, injector, zone) {
+        this.uploadService = uploadService;
+        this.navigation = navigation;
+        this.cdr = cdr;
+        this.injector = injector;
+        this.zone = zone;
+        /**
+         * Disables the component.
+         *
+         * @default false
+         */
+        this.disabled = false;
+        /**
+         * Enables the selection of multiple files
+         * If set to `false`, only one file can be selected at a time.
+         * @default true
+         */
+        this.multiple = true;
+        /**
+         * Toggles the visibility of the file list.
+         * @default true
+         */
+        this.showFileList = true;
+        /**
+         * Specifies the [`tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the component.
+         * @default 0
+         */
+        this.tabindex = 0;
+        /**
+         * @hidden
+         */
+        this.focusableId = `k-${guid()}`;
+        /**
+         * @hidden
+         */
+        this.hostDefaultClasses = true;
+        /**
+         * Fires when the user navigates outside the component.
+         */
+        this.onBlur = new EventEmitter();
+        /**
+         * Fires when the component is focused.
+         */
+        this.onFocus = new EventEmitter();
+        /**
+         * Fires when files are selected. If prevented, the selected files will not be added to the list.
+         */
+        this.select = new EventEmitter();
+        /**
+         * Fires when a file is about to be removed. If prevented, the file will remain in the list.
+         */
+        this.remove = new EventEmitter();
+        /**
+         * @hidden
+         */
+        this._restrictions = {
+            allowedExtensions: [],
+            maxFileSize: 0,
+            minFileSize: 0
+        };
+        this.onTouchedCallback = (_) => { };
+        this.onChangeCallback = (_) => { };
+        this.fileList = this.uploadService.files;
+    }
+    /**
+     * Sets the restrictions for selected files.
+     */
+    set restrictions(restrictions) {
+        const parsedRestrictions = Object.assign({}, this.restrictions, restrictions);
+        this._restrictions = parsedRestrictions;
+    }
+    get restrictions() {
+        return this._restrictions;
+    }
+    /**
+     * @hidden
+     */
+    get hostDisabledClass() {
+        return this.disabled;
+    }
+    /**
+     * @hidden
+     */
+    get formControl() {
+        const ngControl = this.injector.get(NgControl, null);
+        return ngControl?.control || null;
+    }
+    /**
+     * @hidden
+     */
+    get isControlRequired() {
+        return isControlRequired(this.formControl);
+    }
+    /**
+     * @hidden
+     */
+    get hasFileList() {
+        const hasFileList = this.showFileList && this.fileList.count > 0;
+        this.navigation.fileListVisible = hasFileList;
+        return hasFileList;
+    }
+    /**
+     * @hidden
+     */
+    writeValue(newValue, validation, callback) {
+        let isValid = true;
+        if (newValue instanceof Array) {
+            newValue.forEach((file) => {
+                if (!validation(file)) {
+                    isValid = false;
+                }
+            });
+            if (isValid) {
+                this.uploadService[callback](newValue);
+            }
+        }
+        if (newValue === null) {
+            this.fileList.clear();
+        }
+        this.cdr.markForCheck();
+    }
+    /**
+     * @hidden
+     */
+    registerOnChange(fn) {
+        this.onChangeCallback = fn;
+    }
+    /**
+     * @hidden
+     */
+    registerOnTouched(fn) {
+        this.onTouchedCallback = fn;
+    }
+    /**
+     * @hidden
+     */
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    /**
+     * @hidden
+     */
+    onFileSelectButtonFocus() {
+        if (!this.navigation.focused) {
+            this.navigation.focusedIndex = -1;
+        }
+    }
+    /**
+     * Focuses the component's `Select files` button.
+     */
+    focus() {
+        this.zone.runOutsideAngular(() => {
+            setTimeout(() => {
+                this.fileSelectButton.nativeElement.focus();
+                this.navigation.focused = true;
+            });
+        });
+    }
+    /**
+     * @hidden
+     * @deprecated
+     */
+    focusComponent() {
+        this.focus();
+    }
+    /**
+     * Blurs the component if it was previously focused.
+     */
+    blur() {
+        if (this.navigation.focused) {
+            this.navigation.focused = false;
+            document.activeElement.blur();
+        }
+    }
+    /**
+     * @hidden
+     * @deprecated
+     */
+    blurComponent() {
+        this.blur();
+    }
+}
+UploadFileSelectBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UploadFileSelectBase, deps: [{ token: i1.UploadService }, { token: i2.NavigationService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+UploadFileSelectBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: UploadFileSelectBase, inputs: { accept: "accept", disabled: "disabled", multiple: "multiple", showFileList: "showFileList", tabindex: "tabindex", restrictions: "restrictions", zoneId: "zoneId", focusableId: "focusableId" }, outputs: { onBlur: "blur", onFocus: "focus", select: "select", remove: "remove" }, host: { properties: { "class.k-upload": "this.hostDefaultClasses", "class.k-disabled": "this.hostDisabledClass" } }, queries: [{ propertyName: "fileTemplate", first: true, predicate: FileTemplateDirective, descendants: true }, { propertyName: "fileInfoTemplate", first: true, predicate: FileInfoTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "fileSelectButton", first: true, predicate: ["fileSelectButton"], descendants: true, read: ElementRef, static: true }], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UploadFileSelectBase, decorators: [{
+            type: Directive,
+            args: [{}]
+        }], ctorParameters: function () { return [{ type: i1.UploadService }, { type: i2.NavigationService }, { type: i0.ChangeDetectorRef }, { type: i0.Injector }, { type: i0.NgZone }]; }, propDecorators: { fileTemplate: [{
+                type: ContentChild,
+                args: [FileTemplateDirective]
+            }], fileInfoTemplate: [{
+                type: ContentChild,
+                args: [FileInfoTemplateDirective]
+            }], fileSelectButton: [{
+                type: ViewChild,
+                args: ['fileSelectButton', { static: true, read: ElementRef }]
+            }], accept: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], multiple: [{
+                type: Input
+            }], showFileList: [{
+                type: Input
+            }], tabindex: [{
+                type: Input
+            }], restrictions: [{
+                type: Input
+            }], zoneId: [{
+                type: Input
+            }], focusableId: [{
+                type: Input
+            }], hostDefaultClasses: [{
+                type: HostBinding,
+                args: ['class.k-upload']
+            }], hostDisabledClass: [{
+                type: HostBinding,
+                args: ['class.k-disabled']
+            }], onBlur: [{
+                type: Output,
+                args: ['blur']
+            }], onFocus: [{
+                type: Output,
+                args: ['focus']
+            }], select: [{
+                type: Output
+            }], remove: [{
+                type: Output
+            }] } });

package/esm2020/common/util.mjs

@@ -176,7 +176,7 @@ export const IGNORE_TARGET_CLASSES = 'k-icon k-select k-input k-multiselect-wrap
 /**
  * @hidden
  */
-export const UPLOAD_CLASSES = 'k-upload-button k-clear-selected k-upload-selected k-upload-action';
+export const UPLOAD_CLASSES = 'k-upload-button k-clear-selected k-upload-selected k-upload-action k-file';
 const isVisible = (element) => {
     const rect = element.getBoundingClientRect();
     return !!(rect.width && rect.height) && window.getComputedStyle(element).visibility !== 'hidden';