@progress/kendo-angular-upload 7.1.3 → 7.1.5-dev.202111161429

package/dist/es2015/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-upload',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1634118943,
+    publishDate: 1637072903,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/dist/es2015/rendering/file-list-item-action-button.component.d.ts

@@ -5,23 +5,25 @@
 import { FileInfo } from '../types';
 import { UploadService } from '../upload.service';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { NavigationService } from './../navigation.service';
 /**
  * @hidden
  */
 export declare class FileListItemActionButtonComponent {
     private uploadService;
     private localization;
+    private navigation;
     file: FileInfo;
     disabled: boolean;
     progress: Number;
     actionFocused: boolean;
     retryFocused: boolean;
     pauseResumeFocused: boolean;
-    constructor(uploadService: UploadService, localization: LocalizationService);
+    constructor(uploadService: UploadService, localization: LocalizationService, navigation: NavigationService);
     onFocus(type: string): void;
     onBlur(type: string): void;
     onRetryClick(): void;
-    onRemoveCancelClick(): void;
+    onRemoveCancelClick(event?: any): void;
     onPauseResumeClick(): void;
     readonly actionButtonTitle: string;
     readonly retryButtonTitle: string;

package/dist/es2015/rendering/file-list-item-action-button.component.js

@@ -7,13 +7,15 @@ import { Input, Component } from '@angular/core';
 import { FileState } from '../types';
 import { UploadService } from '../upload.service';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { NavigationService } from './../navigation.service';
 /**
  * @hidden
  */
 let FileListItemActionButtonComponent = class FileListItemActionButtonComponent {
-    constructor(uploadService, localization) {
+    constructor(uploadService, localization, navigation) {
         this.uploadService = uploadService;
         this.localization = localization;
+        this.navigation = navigation;
         this.actionFocused = false;
         this.retryFocused = false;
         this.pauseResumeFocused = false;
@@ -46,10 +48,11 @@ let FileListItemActionButtonComponent = class FileListItemActionButtonComponent
         }
         this.uploadService.retryFiles(this.file.uid);
     }
-    onRemoveCancelClick() {
+    onRemoveCancelClick(event) {
         if (this.disabled) {
             return;
         }
+        event.stopImmediatePropagation();
         const uid = this.file.uid;
         if (this.file.state === FileState.Uploading) {
             this.uploadService.cancelFiles(uid);
@@ -57,6 +60,7 @@ let FileListItemActionButtonComponent = class FileListItemActionButtonComponent
         else {
             this.uploadService.removeFiles(uid);
         }
+        this.navigation.focusSelectButton();
     }
     onPauseResumeClick() {
         if (this.disabled) {
@@ -160,7 +164,7 @@ FileListItemActionButtonComponent = tslib_1.__decorate([
           [attr.tabIndex]="-1"
           (focus)="onFocus('action')"
           (blur)="onBlur('action')"
-          (click)="onRemoveCancelClick()">
+          (click)="onRemoveCancelClick($event)">
           <span class="k-icon"
             [ngClass]="{
               'k-i-cancel': isUploading,
@@ -174,6 +178,7 @@ FileListItemActionButtonComponent = tslib_1.__decorate([
     `
     }),
     tslib_1.__metadata("design:paramtypes", [UploadService,
-        LocalizationService])
+        LocalizationService,
+        NavigationService])
 ], FileListItemActionButtonComponent);
 export { FileListItemActionButtonComponent };

package/dist/es2015/rendering/upload-action-buttons.component.d.ts

@@ -30,7 +30,9 @@ export declare class UploadActionButtonsComponent implements OnDestroy {
     onFocus(): void;
     focusButton(button: string): void;
     ngOnDestroy(): void;
-    performUpload(_event?: any): void;
-    clearFiles(_event?: any): void;
+    onUploadButtonClick(event?: any): void;
+    performUpload(): void;
+    onClearButtonClick(event?: any): void;
+    clearFiles(): void;
     textFor(key: string): string;
 }

package/dist/es2015/rendering/upload-action-buttons.component.js

@@ -39,7 +39,6 @@ let UploadActionButtonsComponent = class UploadActionButtonsComponent {
             else {
                 this.performUpload();
             }
-            this.navigation.focusSelectButton();
         });
     }
     onFocus() {
@@ -55,14 +54,24 @@ let UploadActionButtonsComponent = class UploadActionButtonsComponent {
         this.actionSubscription.unsubscribe();
         this.focusSubscription.unsubscribe();
     }
-    performUpload(_event) {
+    onUploadButtonClick(event) {
+        event.stopImmediatePropagation();
+        this.performUpload();
+    }
+    performUpload() {
         if (!this.disabled) {
             this.uploadService.uploadFiles();
+            this.navigation.focusSelectButton();
         }
     }
-    clearFiles(_event) {
+    onClearButtonClick(event) {
+        event.stopImmediatePropagation();
+        this.clearFiles();
+    }
+    clearFiles() {
         if (!this.disabled) {
             this.uploadService.clearFiles();
+            this.navigation.focusSelectButton();
         }
     }
     textFor(key) {
@@ -115,12 +124,12 @@ UploadActionButtonsComponent = tslib_1.__decorate([
         template: `
         <button #clearButton type="button" class="k-button k-clear-selected"
             [attr.tabIndex]="-1"
-            (click)="clearFiles($event)">
+            (click)="onClearButtonClick($event)">
                 {{textFor('clearSelectedFiles')}}
         </button>
         <button #uploadButton type="button" class="k-button k-primary k-upload-selected"
             [attr.tabIndex]="-1"
-            (click)="performUpload($event)">
+            (click)="onUploadButtonClick($event)">
                 {{textFor('uploadSelectedFiles')}}
         </button>
     `

package/dist/es2015/upload.service.js

@@ -178,7 +178,7 @@ let UploadService = class UploadService {
             filesToUpload = this.fileList.filesToUpload;
         }
         if (!this.async.concurrent && !this.fileList.hasFileWithState([FileState.Uploading])) {
-            filesToUpload = [this.fileList.firstFileToUpload];
+            filesToUpload = this.fileList.firstFileToUpload ? [this.fileList.firstFileToUpload] : [];
         }
         if (filesToUpload && filesToUpload.length > 0) {
             this._uploadFiles(filesToUpload);

package/dist/fesm2015/index.js

@@ -21,7 +21,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-upload',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1634118943,
+    publishDate: 1637072903,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
@@ -1040,7 +1040,7 @@ let UploadService = class UploadService {
             filesToUpload = this.fileList.filesToUpload;
         }
         if (!this.async.concurrent && !this.fileList.hasFileWithState([FileState.Uploading])) {
-            filesToUpload = [this.fileList.firstFileToUpload];
+            filesToUpload = this.fileList.firstFileToUpload ? [this.fileList.firstFileToUpload] : [];
         }
         if (filesToUpload && filesToUpload.length > 0) {
             this._uploadFiles(filesToUpload);
@@ -2549,9 +2549,10 @@ FileListComponent = __decorate([
  * @hidden
  */
 let FileListItemActionButtonComponent = class FileListItemActionButtonComponent {
-    constructor(uploadService, localization) {
+    constructor(uploadService, localization, navigation) {
         this.uploadService = uploadService;
         this.localization = localization;
+        this.navigation = navigation;
         this.actionFocused = false;
         this.retryFocused = false;
         this.pauseResumeFocused = false;
@@ -2584,10 +2585,11 @@ let FileListItemActionButtonComponent = class FileListItemActionButtonComponent
         }
         this.uploadService.retryFiles(this.file.uid);
     }
-    onRemoveCancelClick() {
+    onRemoveCancelClick(event) {
         if (this.disabled) {
             return;
         }
+        event.stopImmediatePropagation();
         const uid = this.file.uid;
         if (this.file.state === FileState.Uploading) {
             this.uploadService.cancelFiles(uid);
@@ -2595,6 +2597,7 @@ let FileListItemActionButtonComponent = class FileListItemActionButtonComponent
         else {
             this.uploadService.removeFiles(uid);
         }
+        this.navigation.focusSelectButton();
     }
     onPauseResumeClick() {
         if (this.disabled) {
@@ -2698,7 +2701,7 @@ FileListItemActionButtonComponent = __decorate([
           [attr.tabIndex]="-1"
           (focus)="onFocus('action')"
           (blur)="onBlur('action')"
-          (click)="onRemoveCancelClick()">
+          (click)="onRemoveCancelClick($event)">
           <span class="k-icon"
             [ngClass]="{
               'k-i-cancel': isUploading,
@@ -2712,7 +2715,8 @@ FileListItemActionButtonComponent = __decorate([
     `
     }),
     __metadata("design:paramtypes", [UploadService,
-        LocalizationService])
+        LocalizationService,
+        NavigationService])
 ], FileListItemActionButtonComponent);
 
 /**
@@ -2995,8 +2999,8 @@ let FileSelectDirective = class FileSelectDirective {
     }
     onInputChange(event) {
         const ua = navigator.userAgent;
-        const chrome = /(chrome)[ \/]([\w.]+)/i;
-        const safari = /(webkit)[ \/]([\w.]+)/i;
+        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);
@@ -3005,12 +3009,12 @@ let FileSelectDirective = class FileSelectDirective {
         }
         this.uploadService.addFiles(selectedFiles);
         /*
-        Chrome and Internet Explorer do not trigger a `change` event
+        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(chrome) && ua.match(safari))) {
+        if (ua.match(webkit) || ua.match(ie)) {
             native.type = "";
             native.type = "file";
         }
@@ -4367,7 +4371,6 @@ let UploadActionButtonsComponent = class UploadActionButtonsComponent {
             else {
                 this.performUpload();
             }
-            this.navigation.focusSelectButton();
         });
     }
     onFocus() {
@@ -4383,14 +4386,24 @@ let UploadActionButtonsComponent = class UploadActionButtonsComponent {
         this.actionSubscription.unsubscribe();
         this.focusSubscription.unsubscribe();
     }
-    performUpload(_event) {
+    onUploadButtonClick(event) {
+        event.stopImmediatePropagation();
+        this.performUpload();
+    }
+    performUpload() {
         if (!this.disabled) {
             this.uploadService.uploadFiles();
+            this.navigation.focusSelectButton();
         }
     }
-    clearFiles(_event) {
+    onClearButtonClick(event) {
+        event.stopImmediatePropagation();
+        this.clearFiles();
+    }
+    clearFiles() {
         if (!this.disabled) {
             this.uploadService.clearFiles();
+            this.navigation.focusSelectButton();
         }
     }
     textFor(key) {
@@ -4443,12 +4456,12 @@ UploadActionButtonsComponent = __decorate([
         template: `
         <button #clearButton type="button" class="k-button k-clear-selected"
             [attr.tabIndex]="-1"
-            (click)="clearFiles($event)">
+            (click)="onClearButtonClick($event)">
                 {{textFor('clearSelectedFiles')}}
         </button>
         <button #uploadButton type="button" class="k-button k-primary k-upload-selected"
             [attr.tabIndex]="-1"
-            (click)="performUpload($event)">
+            (click)="onUploadButtonClick($event)">
                 {{textFor('uploadSelectedFiles')}}
         </button>
     `

package/dist/fesm5/index.js

@@ -21,7 +21,7 @@ var packageMetadata = {
     name: '@progress/kendo-angular-upload',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1634118943,
+    publishDate: 1637072903,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
@@ -1099,7 +1099,7 @@ var UploadService = /** @class */ (function () {
             filesToUpload = this.fileList.filesToUpload;
         }
         if (!this.async.concurrent && !this.fileList.hasFileWithState([FileState.Uploading])) {
-            filesToUpload = [this.fileList.firstFileToUpload];
+            filesToUpload = this.fileList.firstFileToUpload ? [this.fileList.firstFileToUpload] : [];
         }
         if (filesToUpload && filesToUpload.length > 0) {
             this._uploadFiles(filesToUpload);
@@ -2640,9 +2640,10 @@ var FileListComponent = /** @class */ (function () {
  * @hidden
  */
 var FileListItemActionButtonComponent = /** @class */ (function () {
-    function FileListItemActionButtonComponent(uploadService, localization) {
+    function FileListItemActionButtonComponent(uploadService, localization, navigation) {
         this.uploadService = uploadService;
         this.localization = localization;
+        this.navigation = navigation;
         this.actionFocused = false;
         this.retryFocused = false;
         this.pauseResumeFocused = false;
@@ -2675,10 +2676,11 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
         }
         this.uploadService.retryFiles(this.file.uid);
     };
-    FileListItemActionButtonComponent.prototype.onRemoveCancelClick = function () {
+    FileListItemActionButtonComponent.prototype.onRemoveCancelClick = function (event) {
         if (this.disabled) {
             return;
         }
+        event.stopImmediatePropagation();
         var uid = this.file.uid;
         if (this.file.state === FileState.Uploading) {
             this.uploadService.cancelFiles(uid);
@@ -2686,6 +2688,7 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
         else {
             this.uploadService.removeFiles(uid);
         }
+        this.navigation.focusSelectButton();
     };
     FileListItemActionButtonComponent.prototype.onPauseResumeClick = function () {
         if (this.disabled) {
@@ -2783,10 +2786,11 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
     FileListItemActionButtonComponent = __decorate([
         Component({
             selector: 'kendo-upload-file-list-item-action-button',
-            template: "\n      <strong class=\"k-upload-status\">\n        <span class=\"k-upload-pct\" *ngIf=\"isUploading || isPaused\">{{progress}}%</span>\n\n        <button type=\"button\" *ngIf=\"isFailed\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.retryFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('retry')\"\n          (blur)=\"onBlur('retry')\"\n          (click)=\"onRetryClick()\">\n          <span class=\"k-icon k-retry k-i-refresh-sm\"\n            [attr.aria-label]=\"retryButtonTitle\"\n            [attr.title]=\"retryButtonTitle\">\n          </span>\n        </button>\n\n        <button *ngIf=\"isResumable\" type=\"button\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.pauseResumeFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('pauseResume')\"\n          (blur)=\"onBlur('pauseResume')\"\n          (click)=\"onPauseResumeClick()\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-play-sm': isPaused,\n              'k-i-pause-sm': !isPaused\n            }\"\n            [attr.aria-label]='pauseResumeButtonTitle'\n            [attr.title]='pauseResumeButtonTitle'>\n          </span>\n        </button>\n\n        <button type=\"button\" *ngIf=\"isActionButtonVisible\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.actionFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('action')\"\n          (blur)=\"onBlur('action')\"\n          (click)=\"onRemoveCancelClick()\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-cancel': isUploading,\n              'k-delete k-i-x': !isUploading\n            }\"\n            [attr.aria-label]='actionButtonTitle'\n            [attr.title]='actionButtonTitle'>\n          </span>\n        </button>\n      </strong>\n    "
+            template: "\n      <strong class=\"k-upload-status\">\n        <span class=\"k-upload-pct\" *ngIf=\"isUploading || isPaused\">{{progress}}%</span>\n\n        <button type=\"button\" *ngIf=\"isFailed\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.retryFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('retry')\"\n          (blur)=\"onBlur('retry')\"\n          (click)=\"onRetryClick()\">\n          <span class=\"k-icon k-retry k-i-refresh-sm\"\n            [attr.aria-label]=\"retryButtonTitle\"\n            [attr.title]=\"retryButtonTitle\">\n          </span>\n        </button>\n\n        <button *ngIf=\"isResumable\" type=\"button\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.pauseResumeFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('pauseResume')\"\n          (blur)=\"onBlur('pauseResume')\"\n          (click)=\"onPauseResumeClick()\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-play-sm': isPaused,\n              'k-i-pause-sm': !isPaused\n            }\"\n            [attr.aria-label]='pauseResumeButtonTitle'\n            [attr.title]='pauseResumeButtonTitle'>\n          </span>\n        </button>\n\n        <button type=\"button\" *ngIf=\"isActionButtonVisible\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.actionFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('action')\"\n          (blur)=\"onBlur('action')\"\n          (click)=\"onRemoveCancelClick($event)\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-cancel': isUploading,\n              'k-delete k-i-x': !isUploading\n            }\"\n            [attr.aria-label]='actionButtonTitle'\n            [attr.title]='actionButtonTitle'>\n          </span>\n        </button>\n      </strong>\n    "
         }),
         __metadata("design:paramtypes", [UploadService,
-            LocalizationService])
+            LocalizationService,
+            NavigationService])
     ], FileListItemActionButtonComponent);
     return FileListItemActionButtonComponent;
 }());
@@ -3063,8 +3067,8 @@ var FileSelectDirective = /** @class */ (function () {
     FileSelectDirective.prototype.onInputChange = function (event) {
         var _this = this;
         var ua = navigator.userAgent;
-        var chrome = /(chrome)[ \/]([\w.]+)/i;
-        var safari = /(webkit)[ \/]([\w.]+)/i;
+        var webkit = /(webkit)[ \/]([\w.]+)/i;
+        var ie = /(windows)[ \/]([\w.]+)/i;
         var selectedFiles = inputFiles(event.target);
         selectedFiles = assignGuidToFiles(selectedFiles, !this.uploadService.async.batch);
         validateFiles(selectedFiles, this.restrictions);
@@ -3073,12 +3077,12 @@ var FileSelectDirective = /** @class */ (function () {
         }
         this.uploadService.addFiles(selectedFiles);
         /*
-        Chrome and Internet Explorer do not trigger a `change` event
+        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.
         */
         var native = this.element.nativeElement;
-        if (!(!ua.match(chrome) && ua.match(safari))) {
+        if (ua.match(webkit) || ua.match(ie)) {
             native.type = "";
             native.type = "file";
         }
@@ -4455,7 +4459,6 @@ var UploadActionButtonsComponent = /** @class */ (function () {
             else {
                 _this.performUpload();
             }
-            _this.navigation.focusSelectButton();
         });
     };
     UploadActionButtonsComponent.prototype.onFocus = function () {
@@ -4472,14 +4475,24 @@ var UploadActionButtonsComponent = /** @class */ (function () {
         this.actionSubscription.unsubscribe();
         this.focusSubscription.unsubscribe();
     };
-    UploadActionButtonsComponent.prototype.performUpload = function (_event) {
+    UploadActionButtonsComponent.prototype.onUploadButtonClick = function (event) {
+        event.stopImmediatePropagation();
+        this.performUpload();
+    };
+    UploadActionButtonsComponent.prototype.performUpload = function () {
         if (!this.disabled) {
             this.uploadService.uploadFiles();
+            this.navigation.focusSelectButton();
         }
     };
-    UploadActionButtonsComponent.prototype.clearFiles = function (_event) {
+    UploadActionButtonsComponent.prototype.onClearButtonClick = function (event) {
+        event.stopImmediatePropagation();
+        this.clearFiles();
+    };
+    UploadActionButtonsComponent.prototype.clearFiles = function () {
         if (!this.disabled) {
             this.uploadService.clearFiles();
+            this.navigation.focusSelectButton();
         }
     };
     UploadActionButtonsComponent.prototype.textFor = function (key) {
@@ -4528,7 +4541,7 @@ var UploadActionButtonsComponent = /** @class */ (function () {
     UploadActionButtonsComponent = __decorate([
         Component({
             selector: 'kendo-upload-action-buttons',
-            template: "\n        <button #clearButton type=\"button\" class=\"k-button k-clear-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"clearFiles($event)\">\n                {{textFor('clearSelectedFiles')}}\n        </button>\n        <button #uploadButton type=\"button\" class=\"k-button k-primary k-upload-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"performUpload($event)\">\n                {{textFor('uploadSelectedFiles')}}\n        </button>\n    "
+            template: "\n        <button #clearButton type=\"button\" class=\"k-button k-clear-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"onClearButtonClick($event)\">\n                {{textFor('clearSelectedFiles')}}\n        </button>\n        <button #uploadButton type=\"button\" class=\"k-button k-primary k-upload-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"onUploadButtonClick($event)\">\n                {{textFor('uploadSelectedFiles')}}\n        </button>\n    "
         }),
         __metadata("design:paramtypes", [UploadService,
             LocalizationService,

package/dist/npm/file-select.directive.js

@@ -53,8 +53,8 @@ var FileSelectDirective = /** @class */ (function () {
     FileSelectDirective.prototype.onInputChange = function (event) {
         var _this = this;
         var ua = navigator.userAgent;
-        var chrome = /(chrome)[ \/]([\w.]+)/i;
-        var safari = /(webkit)[ \/]([\w.]+)/i;
+        var webkit = /(webkit)[ \/]([\w.]+)/i;
+        var ie = /(windows)[ \/]([\w.]+)/i;
         var selectedFiles = util_1.inputFiles(event.target);
         selectedFiles = util_1.assignGuidToFiles(selectedFiles, !this.uploadService.async.batch);
         validation_util_1.validateFiles(selectedFiles, this.restrictions);
@@ -63,12 +63,12 @@ var FileSelectDirective = /** @class */ (function () {
         }
         this.uploadService.addFiles(selectedFiles);
         /*
-        Chrome and Internet Explorer do not trigger a `change` event
+        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.
         */
         var native = this.element.nativeElement;
-        if (!(!ua.match(chrome) && ua.match(safari))) {
+        if (ua.match(webkit) || ua.match(ie)) {
             native.type = "";
             native.type = "file";
         }

package/dist/npm/package-metadata.js

@@ -11,7 +11,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-angular-upload',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1634118943,
+    publishDate: 1637072903,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/dist/npm/rendering/file-list-item-action-button.component.js

@@ -9,13 +9,15 @@ var core_1 = require("@angular/core");
 var types_1 = require("../types");
 var upload_service_1 = require("../upload.service");
 var kendo_angular_l10n_1 = require("@progress/kendo-angular-l10n");
+var navigation_service_1 = require("./../navigation.service");
 /**
  * @hidden
  */
 var FileListItemActionButtonComponent = /** @class */ (function () {
-    function FileListItemActionButtonComponent(uploadService, localization) {
+    function FileListItemActionButtonComponent(uploadService, localization, navigation) {
         this.uploadService = uploadService;
         this.localization = localization;
+        this.navigation = navigation;
         this.actionFocused = false;
         this.retryFocused = false;
         this.pauseResumeFocused = false;
@@ -48,10 +50,11 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
         }
         this.uploadService.retryFiles(this.file.uid);
     };
-    FileListItemActionButtonComponent.prototype.onRemoveCancelClick = function () {
+    FileListItemActionButtonComponent.prototype.onRemoveCancelClick = function (event) {
         if (this.disabled) {
             return;
         }
+        event.stopImmediatePropagation();
         var uid = this.file.uid;
         if (this.file.state === types_1.FileState.Uploading) {
             this.uploadService.cancelFiles(uid);
@@ -59,6 +62,7 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
         else {
             this.uploadService.removeFiles(uid);
         }
+        this.navigation.focusSelectButton();
     };
     FileListItemActionButtonComponent.prototype.onPauseResumeClick = function () {
         if (this.disabled) {
@@ -156,10 +160,11 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
     FileListItemActionButtonComponent = tslib_1.__decorate([
         core_1.Component({
             selector: 'kendo-upload-file-list-item-action-button',
-            template: "\n      <strong class=\"k-upload-status\">\n        <span class=\"k-upload-pct\" *ngIf=\"isUploading || isPaused\">{{progress}}%</span>\n\n        <button type=\"button\" *ngIf=\"isFailed\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.retryFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('retry')\"\n          (blur)=\"onBlur('retry')\"\n          (click)=\"onRetryClick()\">\n          <span class=\"k-icon k-retry k-i-refresh-sm\"\n            [attr.aria-label]=\"retryButtonTitle\"\n            [attr.title]=\"retryButtonTitle\">\n          </span>\n        </button>\n\n        <button *ngIf=\"isResumable\" type=\"button\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.pauseResumeFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('pauseResume')\"\n          (blur)=\"onBlur('pauseResume')\"\n          (click)=\"onPauseResumeClick()\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-play-sm': isPaused,\n              'k-i-pause-sm': !isPaused\n            }\"\n            [attr.aria-label]='pauseResumeButtonTitle'\n            [attr.title]='pauseResumeButtonTitle'>\n          </span>\n        </button>\n\n        <button type=\"button\" *ngIf=\"isActionButtonVisible\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.actionFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('action')\"\n          (blur)=\"onBlur('action')\"\n          (click)=\"onRemoveCancelClick()\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-cancel': isUploading,\n              'k-delete k-i-x': !isUploading\n            }\"\n            [attr.aria-label]='actionButtonTitle'\n            [attr.title]='actionButtonTitle'>\n          </span>\n        </button>\n      </strong>\n    "
+            template: "\n      <strong class=\"k-upload-status\">\n        <span class=\"k-upload-pct\" *ngIf=\"isUploading || isPaused\">{{progress}}%</span>\n\n        <button type=\"button\" *ngIf=\"isFailed\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.retryFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('retry')\"\n          (blur)=\"onBlur('retry')\"\n          (click)=\"onRetryClick()\">\n          <span class=\"k-icon k-retry k-i-refresh-sm\"\n            [attr.aria-label]=\"retryButtonTitle\"\n            [attr.title]=\"retryButtonTitle\">\n          </span>\n        </button>\n\n        <button *ngIf=\"isResumable\" type=\"button\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.pauseResumeFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('pauseResume')\"\n          (blur)=\"onBlur('pauseResume')\"\n          (click)=\"onPauseResumeClick()\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-play-sm': isPaused,\n              'k-i-pause-sm': !isPaused\n            }\"\n            [attr.aria-label]='pauseResumeButtonTitle'\n            [attr.title]='pauseResumeButtonTitle'>\n          </span>\n        </button>\n\n        <button type=\"button\" *ngIf=\"isActionButtonVisible\" class=\"k-button k-button-icon k-flat k-upload-action\"\n          [ngClass]=\"{ 'k-state-focused': this.actionFocused }\"\n          [attr.tabIndex]=\"-1\"\n          (focus)=\"onFocus('action')\"\n          (blur)=\"onBlur('action')\"\n          (click)=\"onRemoveCancelClick($event)\">\n          <span class=\"k-icon\"\n            [ngClass]=\"{\n              'k-i-cancel': isUploading,\n              'k-delete k-i-x': !isUploading\n            }\"\n            [attr.aria-label]='actionButtonTitle'\n            [attr.title]='actionButtonTitle'>\n          </span>\n        </button>\n      </strong>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [upload_service_1.UploadService,
-            kendo_angular_l10n_1.LocalizationService])
+            kendo_angular_l10n_1.LocalizationService,
+            navigation_service_1.NavigationService])
     ], FileListItemActionButtonComponent);
     return FileListItemActionButtonComponent;
 }());

package/dist/npm/rendering/upload-action-buttons.component.js

@@ -58,7 +58,6 @@ var UploadActionButtonsComponent = /** @class */ (function () {
             else {
                 _this.performUpload();
             }
-            _this.navigation.focusSelectButton();
         });
     };
     UploadActionButtonsComponent.prototype.onFocus = function () {
@@ -75,14 +74,24 @@ var UploadActionButtonsComponent = /** @class */ (function () {
         this.actionSubscription.unsubscribe();
         this.focusSubscription.unsubscribe();
     };
-    UploadActionButtonsComponent.prototype.performUpload = function (_event) {
+    UploadActionButtonsComponent.prototype.onUploadButtonClick = function (event) {
+        event.stopImmediatePropagation();
+        this.performUpload();
+    };
+    UploadActionButtonsComponent.prototype.performUpload = function () {
         if (!this.disabled) {
             this.uploadService.uploadFiles();
+            this.navigation.focusSelectButton();
         }
     };
-    UploadActionButtonsComponent.prototype.clearFiles = function (_event) {
+    UploadActionButtonsComponent.prototype.onClearButtonClick = function (event) {
+        event.stopImmediatePropagation();
+        this.clearFiles();
+    };
+    UploadActionButtonsComponent.prototype.clearFiles = function () {
         if (!this.disabled) {
             this.uploadService.clearFiles();
+            this.navigation.focusSelectButton();
         }
     };
     UploadActionButtonsComponent.prototype.textFor = function (key) {
@@ -131,7 +140,7 @@ var UploadActionButtonsComponent = /** @class */ (function () {
     UploadActionButtonsComponent = tslib_1.__decorate([
         core_1.Component({
             selector: 'kendo-upload-action-buttons',
-            template: "\n        <button #clearButton type=\"button\" class=\"k-button k-clear-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"clearFiles($event)\">\n                {{textFor('clearSelectedFiles')}}\n        </button>\n        <button #uploadButton type=\"button\" class=\"k-button k-primary k-upload-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"performUpload($event)\">\n                {{textFor('uploadSelectedFiles')}}\n        </button>\n    "
+            template: "\n        <button #clearButton type=\"button\" class=\"k-button k-clear-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"onClearButtonClick($event)\">\n                {{textFor('clearSelectedFiles')}}\n        </button>\n        <button #uploadButton type=\"button\" class=\"k-button k-primary k-upload-selected\"\n            [attr.tabIndex]=\"-1\"\n            (click)=\"onUploadButtonClick($event)\">\n                {{textFor('uploadSelectedFiles')}}\n        </button>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [upload_service_1.UploadService,
             kendo_angular_l10n_1.LocalizationService,

package/dist/npm/upload.service.js

@@ -188,7 +188,7 @@ var UploadService = /** @class */ (function () {
             filesToUpload = this.fileList.filesToUpload;
         }
         if (!this.async.concurrent && !this.fileList.hasFileWithState([types_1.FileState.Uploading])) {
-            filesToUpload = [this.fileList.firstFileToUpload];
+            filesToUpload = this.fileList.firstFileToUpload ? [this.fileList.firstFileToUpload] : [];
         }
         if (filesToUpload && filesToUpload.length > 0) {
             this._uploadFiles(filesToUpload);