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

package/dist/es/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
  */
 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;
@@ -46,10 +48,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);
@@ -57,6 +60,7 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
         else {
             this.uploadService.removeFiles(uid);
         }
+        this.navigation.focusSelectButton();
     };
     FileListItemActionButtonComponent.prototype.onPauseResumeClick = function () {
         if (this.disabled) {
@@ -154,10 +158,11 @@ var FileListItemActionButtonComponent = /** @class */ (function () {
     FileListItemActionButtonComponent = tslib_1.__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    "
         }),
         tslib_1.__metadata("design:paramtypes", [UploadService,
-            LocalizationService])
+            LocalizationService,
+            NavigationService])
     ], FileListItemActionButtonComponent);
     return FileListItemActionButtonComponent;
 }());

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

@@ -56,7 +56,6 @@ var UploadActionButtonsComponent = /** @class */ (function () {
             else {
                 _this.performUpload();
             }
-            _this.navigation.focusSelectButton();
         });
     };
     UploadActionButtonsComponent.prototype.onFocus = function () {
@@ -73,14 +72,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) {
@@ -129,7 +138,7 @@ var UploadActionButtonsComponent = /** @class */ (function () {
     UploadActionButtonsComponent = tslib_1.__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    "
         }),
         tslib_1.__metadata("design:paramtypes", [UploadService,
             LocalizationService,