@progress/kendo-angular-upload 8.0.2 → 9.0.0-dev.202204191139

package/{dist/es2015 → esm2015}/dropzone-external.directive.js

@@ -2,13 +2,14 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
 import { Directive, HostListener, Input } from '@angular/core';
 import { assignGuidToFiles, getAllFileInfo, isPresent } from './common/util';
 import { validateFiles } from './common/validation-util';
 import { DropZoneService } from './dropzone.service';
 import { UploadComponent } from './upload.component';
-let UploadDropZoneDirective = class UploadDropZoneDirective {
+import * as i0 from "@angular/core";
+import * as i1 from "./dropzone.service";
+export class UploadDropZoneDirective {
     constructor(dropZoneService) {
         this.dropZoneService = dropZoneService;
     }
@@ -58,36 +59,29 @@ let UploadDropZoneDirective = class UploadDropZoneDirective {
     get componentInstance() {
         return this.dropZoneService.getComponents(this.zoneId);
     }
-};
-tslib_1.__decorate([
-    Input('kendoUploadDropZone'),
-    tslib_1.__metadata("design:type", String)
-], UploadDropZoneDirective.prototype, "zoneId", void 0);
-tslib_1.__decorate([
-    HostListener('dragenter'),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", []),
-    tslib_1.__metadata("design:returntype", Boolean)
-], UploadDropZoneDirective.prototype, "onElementDragEnter", null);
-tslib_1.__decorate([
-    HostListener('dragover'),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", []),
-    tslib_1.__metadata("design:returntype", Boolean)
-], UploadDropZoneDirective.prototype, "onElementDragOver", null);
-tslib_1.__decorate([
-    HostListener('drop', ['$event']),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", [Object]),
-    tslib_1.__metadata("design:returntype", Boolean)
-], UploadDropZoneDirective.prototype, "onDropListener", null);
-UploadDropZoneDirective = tslib_1.__decorate([
-    Directive({
-        providers: [
-            DropZoneService
-        ],
-        selector: '[kendoUploadDropZone], [kendoFileSelectDropZone]'
-    }),
-    tslib_1.__metadata("design:paramtypes", [DropZoneService])
-], UploadDropZoneDirective);
-export { UploadDropZoneDirective };
+}
+UploadDropZoneDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: UploadDropZoneDirective, deps: [{ token: i1.DropZoneService }], target: i0.ɵɵFactoryTarget.Directive });
+UploadDropZoneDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: UploadDropZoneDirective, selector: "[kendoUploadDropZone], [kendoFileSelectDropZone]", inputs: { zoneId: ["kendoUploadDropZone", "zoneId"] }, host: { listeners: { "dragenter": "onElementDragEnter()", "dragover": "onElementDragOver()", "drop": "onDropListener($event)" } }, providers: [
+        DropZoneService
+    ], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: UploadDropZoneDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    providers: [
+                        DropZoneService
+                    ],
+                    selector: '[kendoUploadDropZone], [kendoFileSelectDropZone]'
+                }]
+        }], ctorParameters: function () { return [{ type: i1.DropZoneService }]; }, propDecorators: { zoneId: [{
+                type: Input,
+                args: ['kendoUploadDropZone']
+            }], onElementDragEnter: [{
+                type: HostListener,
+                args: ['dragenter']
+            }], onElementDragOver: [{
+                type: HostListener,
+                args: ['dragover']
+            }], onDropListener: [{
+                type: HostListener,
+                args: ['drop', ['$event']]
+            }] } });

package/{dist/es2015 → esm2015}/dropzone-internal.directive.js

@@ -2,16 +2,16 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
-import { Directive, ElementRef, HostBinding, HostListener, Input, Renderer2, NgZone } from '@angular/core';
+import { Directive, HostBinding, HostListener, Input } from '@angular/core';
 import { assignGuidToFiles, getAllFileInfo } from './common/util';
 import { validateFiles } from './common/validation-util';
 import { DropZoneBase } from './dropzone-base';
-import { UploadService } from './upload.service';
+import * as i0 from "@angular/core";
+import * as i1 from "./upload.service";
 /**
  * @hidden
  */
-let DropZoneInternalDirective = class DropZoneInternalDirective extends DropZoneBase {
+export class DropZoneInternalDirective extends DropZoneBase {
     constructor(element, renderer, ngZone, uploadService) {
         super(element, renderer, 'k-dropzone-hover');
         this.ngZone = ngZone;
@@ -70,39 +70,27 @@ let DropZoneInternalDirective = class DropZoneInternalDirective extends DropZone
         }
         return false;
     }
-};
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], DropZoneInternalDirective.prototype, "disabled", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], DropZoneInternalDirective.prototype, "multiple", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object)
-], DropZoneInternalDirective.prototype, "restrictions", void 0);
-tslib_1.__decorate([
-    HostBinding('class.k-dropzone'),
-    tslib_1.__metadata("design:type", Boolean)
-], DropZoneInternalDirective.prototype, "initialClassName", void 0);
-tslib_1.__decorate([
-    HostListener('drop', ['$event']),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", [Object]),
-    tslib_1.__metadata("design:returntype", Boolean)
-], DropZoneInternalDirective.prototype, "onDropListener", null);
-DropZoneInternalDirective = tslib_1.__decorate([
-    Directive({
-        selector: `
+}
+DropZoneInternalDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DropZoneInternalDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.UploadService }], target: i0.ɵɵFactoryTarget.Directive });
+DropZoneInternalDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: DropZoneInternalDirective, selector: "\n      [kendoUploadInternalDropZone],\n      [kendoFileSelectInternalDropZone]\n    ", inputs: { disabled: "disabled", multiple: "multiple", restrictions: "restrictions" }, host: { listeners: { "drop": "onDropListener($event)" }, properties: { "class.k-dropzone": "this.initialClassName" } }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DropZoneInternalDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `
       [kendoUploadInternalDropZone],
       [kendoFileSelectInternalDropZone]
     `
-    }),
-    tslib_1.__metadata("design:paramtypes", [ElementRef,
-        Renderer2,
-        NgZone,
-        UploadService])
-], DropZoneInternalDirective);
-export { DropZoneInternalDirective };
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i1.UploadService }]; }, propDecorators: { disabled: [{
+                type: Input
+            }], multiple: [{
+                type: Input
+            }], restrictions: [{
+                type: Input
+            }], initialClassName: [{
+                type: HostBinding,
+                args: ['class.k-dropzone']
+            }], onDropListener: [{
+                type: HostListener,
+                args: ['drop', ['$event']]
+            }] } });

package/esm2015/dropzone.component.js

@@ -0,0 +1,112 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component, HostBinding, Input } from '@angular/core';
+import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
+import { DropZoneBase } from './dropzone-base';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-l10n";
+import * as i2 from "./localization/localized-messages.directive";
+import * as i3 from "./dropzone-external.directive";
+import * as i4 from "@angular/common";
+/**
+ * Represents the [Kendo UI UploadDropZone component for Angular]({% slug overview_upload %}).
+ */
+export class UploadDropZoneComponent extends DropZoneBase {
+    constructor(element, renderer, localization) {
+        super(element, renderer, 'k-external-dropzone-hover');
+        this.localization = localization;
+        this.hostClass = true;
+        this.localizationChangeSubscription = this.localization.changes.subscribe(({ rtl }) => {
+            this.direction = rtl ? 'rtl' : 'ltr';
+        });
+    }
+    get dirAttribute() {
+        return this.direction;
+    }
+    /**
+     * @hidden
+     */
+    textFor(key) {
+        return this.localization.get(key);
+    }
+    /**
+     * @hidden
+     */
+    get iconClasses() {
+        if (this.icon) {
+            return `k-icon k-i-${this.icon}`;
+        }
+        if (this.iconClass) {
+            return `${this.iconClass}`;
+        }
+        return 'k-icon k-i-upload';
+    }
+    ngOnDestroy() {
+        if (this.localizationChangeSubscription) {
+            this.localizationChangeSubscription.unsubscribe();
+        }
+    }
+}
+UploadDropZoneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: UploadDropZoneComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+UploadDropZoneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: UploadDropZoneComponent, selector: "kendo-uploaddropzone", inputs: { zoneId: "zoneId", icon: "icon", iconClass: "iconClass" }, host: { properties: { "class.k-external-dropzone": "this.hostClass", "attr.dir": "this.dirAttribute" } }, providers: [
+        LocalizationService,
+        {
+            provide: L10N_PREFIX,
+            useValue: 'kendo.uploaddropzone'
+        }
+    ], exportAs: ["kendoUploadDropZone"], usesInheritance: true, ngImport: i0, template: `
+    <ng-container kendoUploadDropZoneLocalizedMessages
+      i18n-externalDropFilesHere='kendo.uploaddropzone.externalDropFilesHere|Sets the external drop-zone hint'
+      externalDropFilesHere='Drag and drop files here to upload'
+    >
+    </ng-container>
+    <div class='k-dropzone-inner' [kendoUploadDropZone]="zoneId">
+      <span [ngClass]="iconClasses"></span>
+      <span class="k-dropzone-hint">{{ textFor('externalDropFilesHere') }}</span>
+      <span class="k-dropzone-note">
+        <ng-content></ng-content>
+      </span>
+    </div>
+  `, isInline: true, directives: [{ type: i2.LocalizedMessagesDirective, selector: "\n    [kendoUploadLocalizedMessages],\n    [kendoFileSelectLocalizedMessages],\n    [kendoUploadDropZoneLocalizedMessages]\n  " }, { type: i3.UploadDropZoneDirective, selector: "[kendoUploadDropZone], [kendoFileSelectDropZone]", inputs: ["kendoUploadDropZone"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: UploadDropZoneComponent, decorators: [{
+            type: Component,
+            args: [{
+                    exportAs: 'kendoUploadDropZone',
+                    providers: [
+                        LocalizationService,
+                        {
+                            provide: L10N_PREFIX,
+                            useValue: 'kendo.uploaddropzone'
+                        }
+                    ],
+                    selector: 'kendo-uploaddropzone',
+                    template: `
+    <ng-container kendoUploadDropZoneLocalizedMessages
+      i18n-externalDropFilesHere='kendo.uploaddropzone.externalDropFilesHere|Sets the external drop-zone hint'
+      externalDropFilesHere='Drag and drop files here to upload'
+    >
+    </ng-container>
+    <div class='k-dropzone-inner' [kendoUploadDropZone]="zoneId">
+      <span [ngClass]="iconClasses"></span>
+      <span class="k-dropzone-hint">{{ textFor('externalDropFilesHere') }}</span>
+      <span class="k-dropzone-note">
+        <ng-content></ng-content>
+      </span>
+    </div>
+  `
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }]; }, propDecorators: { hostClass: [{
+                type: HostBinding,
+                args: ['class.k-external-dropzone']
+            }], dirAttribute: [{
+                type: HostBinding,
+                args: ['attr.dir']
+            }], zoneId: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], iconClass: [{
+                type: Input
+            }] } });

package/{dist/es2015 → esm2015}/dropzone.service.js

@@ -2,13 +2,13 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
 import { Injectable } from '@angular/core';
+import * as i0 from "@angular/core";
 let components = {};
 /**
  * @hidden
  */
-let DropZoneService = class DropZoneService {
+export class DropZoneService {
     addComponent(component, zoneId) {
         if (this.has(zoneId)) {
             components[zoneId].push(component);
@@ -23,8 +23,9 @@ let DropZoneService = class DropZoneService {
     has(id) {
         return id in components;
     }
-};
-DropZoneService = tslib_1.__decorate([
-    Injectable()
-], DropZoneService);
-export { DropZoneService };
+}
+DropZoneService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DropZoneService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DropZoneService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DropZoneService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DropZoneService, decorators: [{
+            type: Injectable
+        }] });

package/{dist/es2015 → esm2015}/events/cancel-event.js

@@ -30,6 +30,7 @@
  */
 export class CancelEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `cancel` event.
      * @param files - The list of the files that were going to be uploaded.
      */

package/{dist/es2015 → esm2015}/events/clear-event.js

@@ -31,6 +31,7 @@ import { PreventableEvent } from './preventable-event';
  */
 export class ClearEvent extends PreventableEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `clear` event.
      */
     constructor() { super(); }

package/{dist/es2015 → esm2015}/events/error-event.js

@@ -29,6 +29,7 @@
  */
 export class ErrorEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `error` event.
      *
      * @param files - The list of the files that failed to be uploaded or removed.

package/{dist/es2015 → esm2015}/events/pause-event.js

@@ -31,6 +31,7 @@
  */
 export class PauseEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `pause` event.
      * @param file - The file that is going to be paused.
      */

package/{dist/es2015 → esm2015}/events/remove-event.js

@@ -30,6 +30,7 @@ import { PreventableEvent } from './preventable-event';
  */
 export class RemoveEvent extends PreventableEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `remove` event.
      * @param files - The list of the files that will be removed.
      * @param headers - The headers of the request.

package/{dist/es2015 → esm2015}/events/resume-event.js

@@ -31,6 +31,7 @@
  */
 export class ResumeEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `resume` event.
      * @param file - The file that is going to be resumed.
      */

package/{dist/es2015 → esm2015}/events/select-event.js

@@ -30,6 +30,7 @@ import { PreventableEvent } from './preventable-event';
  */
 export class SelectEvent extends PreventableEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `select` event.
      * @param files - The list of the selected files.
      */

package/{dist/es2015 → esm2015}/events/success-event.js

@@ -30,6 +30,7 @@ import { PreventableEvent } from './preventable-event';
  */
 export class SuccessEvent extends PreventableEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `success` event.
      * @param files - The list of the files that were uploaded or removed.
      * @param operation - The operation type (`upload` or `remove`).

package/{dist/es2015 → esm2015}/events/upload-event.js

@@ -30,6 +30,7 @@ import { PreventableEvent } from './preventable-event';
  */
 export class UploadEvent extends PreventableEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `upload` event.
      * @param files - The list of the files that will be uploaded.
      * @param headers - The headers of the request.

package/{dist/es2015 → esm2015}/events/upload-progress-event.js

@@ -29,6 +29,7 @@
  */
 export class UploadProgressEvent {
     /**
+     * @hidden
      * Constructs the event arguments for the `uploadprogress` event.
      * @param files - The list of files that are being uploaded.
      * @param percentComplete - The portion that has been uploaded.

package/esm2015/file-select.directive.js

@@ -0,0 +1,100 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Directive, HostBinding, HostListener, Input } from '@angular/core';
+import { assignGuidToFiles, inputFiles } from './common/util';
+import { validateFiles } from './common/validation-util';
+import * as i0 from "@angular/core";
+import * as i1 from "./upload.service";
+import * as i2 from "./navigation.service";
+/**
+ * @hidden
+ */
+export class FileSelectDirective {
+    constructor(uploadService, navigation, el) {
+        this.uploadService = uploadService;
+        this.navigation = navigation;
+        this.type = "file";
+        this.autocomplete = "off";
+        this.tabIndex = -1;
+        this.element = el;
+    }
+    get nameAttribute() {
+        return this.uploadService.async.saveField;
+    }
+    get multipleAttribute() {
+        return this.multiple ? "multiple" : null;
+    }
+    get dirAttribute() {
+        return this.dir;
+    }
+    get disabledAttribute() {
+        return this.disabled ? "true" : null;
+    }
+    onInputChange(event) {
+        const ua = navigator.userAgent;
+        const webkit = /(webkit)[ \/]([\w.]+)/i;
+        const ie = /(windows)[ \/]([\w.]+)/i;
+        let selectedFiles = inputFiles(event.target);
+        selectedFiles = assignGuidToFiles(selectedFiles, !this.uploadService.async.batch);
+        validateFiles(selectedFiles, this.restrictions);
+        if (!this.multiple) {
+            this.uploadService.clearFiles();
+        }
+        this.uploadService.addFiles(selectedFiles);
+        /*
+        Chrome, IE, Edge and Safari do not trigger a `change` event
+        when a file with the same name is selected a number of consecutive times.
+        As a workaround, clear the input value after handling the file.
+        */
+        const native = this.element.nativeElement;
+        if (ua.match(webkit) || ua.match(ie)) {
+            native.type = "";
+            native.type = "file";
+        }
+        setTimeout(() => {
+            this.navigation.focusedIndex = -1;
+        });
+    }
+}
+FileSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FileSelectDirective, deps: [{ token: i1.UploadService }, { token: i2.NavigationService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+FileSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: FileSelectDirective, selector: "[kendoFileSelect]", inputs: { dir: "dir", disabled: "disabled", multiple: "multiple", restrictions: "restrictions" }, host: { listeners: { "change": "onInputChange($event)" }, properties: { "attr.type": "this.type", "attr.autocomplete": "this.autocomplete", "attr.tabindex": "this.tabIndex", "attr.name": "this.nameAttribute", "attr.multiple": "this.multipleAttribute", "attr.dir": "this.dirAttribute", "attr.disabled": "this.disabledAttribute" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FileSelectDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoFileSelect]'
+                }]
+        }], ctorParameters: function () { return [{ type: i1.UploadService }, { type: i2.NavigationService }, { type: i0.ElementRef }]; }, propDecorators: { dir: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], multiple: [{
+                type: Input
+            }], restrictions: [{
+                type: Input
+            }], type: [{
+                type: HostBinding,
+                args: ["attr.type"]
+            }], autocomplete: [{
+                type: HostBinding,
+                args: ["attr.autocomplete"]
+            }], tabIndex: [{
+                type: HostBinding,
+                args: ["attr.tabindex"]
+            }], nameAttribute: [{
+                type: HostBinding,
+                args: ["attr.name"]
+            }], multipleAttribute: [{
+                type: HostBinding,
+                args: ["attr.multiple"]
+            }], dirAttribute: [{
+                type: HostBinding,
+                args: ["attr.dir"]
+            }], disabledAttribute: [{
+                type: HostBinding,
+                args: ["attr.disabled"]
+            }], onInputChange: [{
+                type: HostListener,
+                args: ["change", ["$event"]]
+            }] } });