@progress/kendo-angular-upload 7.1.4-dev.202111031056 → 8.0.0-dev.202201111351

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: 1635936938,
+    publishDate: 1641908983,
     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) {
@@ -127,25 +131,25 @@ FileListItemActionButtonComponent = tslib_1.__decorate([
       <strong class="k-upload-status">
         <span class="k-upload-pct" *ngIf="isUploading || isPaused">{{progress}}%</span>
 
-        <button type="button" *ngIf="isFailed" class="k-button k-button-icon k-flat k-upload-action"
-          [ngClass]="{ 'k-state-focused': this.retryFocused }"
+        <button type="button" *ngIf="isFailed" class="k-button k-icon-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-upload-action"
+          [ngClass]="{ 'k-focus': this.retryFocused }"
           [attr.tabIndex]="-1"
           (focus)="onFocus('retry')"
           (blur)="onBlur('retry')"
           (click)="onRetryClick()">
-          <span class="k-icon k-retry k-i-refresh-sm"
+          <span class="k-icon k-button-icon k-retry k-i-refresh-sm"
             [attr.aria-label]="retryButtonTitle"
             [attr.title]="retryButtonTitle">
           </span>
         </button>
 
-        <button *ngIf="isResumable" type="button" class="k-button k-button-icon k-flat k-upload-action"
-          [ngClass]="{ 'k-state-focused': this.pauseResumeFocused }"
+        <button *ngIf="isResumable" type="button" class="k-button k-icon-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-upload-action"
+          [ngClass]="{ 'k-focus': this.pauseResumeFocused }"
           [attr.tabIndex]="-1"
           (focus)="onFocus('pauseResume')"
           (blur)="onBlur('pauseResume')"
           (click)="onPauseResumeClick()">
-          <span class="k-icon"
+          <span class="k-icon k-button-icon"
             [ngClass]="{
               'k-i-play-sm': isPaused,
               'k-i-pause-sm': !isPaused
@@ -155,13 +159,13 @@ FileListItemActionButtonComponent = tslib_1.__decorate([
           </span>
         </button>
 
-        <button type="button" *ngIf="isActionButtonVisible" class="k-button k-button-icon k-flat k-upload-action"
-          [ngClass]="{ 'k-state-focused': this.actionFocused }"
+        <button type="button" *ngIf="isActionButtonVisible" class="k-button k-icon-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-upload-action"
+          [ngClass]="{ 'k-focus': this.actionFocused }"
           [attr.tabIndex]="-1"
           (focus)="onFocus('action')"
           (blur)="onBlur('action')"
-          (click)="onRemoveCancelClick()">
-          <span class="k-icon"
+          (click)="onRemoveCancelClick($event)">
+          <span class="k-icon k-button-icon"
             [ngClass]="{
               'k-i-cancel': isUploading,
               'k-delete k-i-x': !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) {
@@ -113,14 +122,14 @@ UploadActionButtonsComponent = tslib_1.__decorate([
     Component({
         selector: 'kendo-upload-action-buttons',
         template: `
-        <button #clearButton type="button" class="k-button k-clear-selected"
+        <button #clearButton type="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base 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"
+        <button #uploadButton type="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-primary k-upload-selected"
             [attr.tabIndex]="-1"
-            (click)="performUpload($event)">
+            (click)="onUploadButtonClick($event)">
                 {{textFor('uploadSelectedFiles')}}
         </button>
     `

package/dist/es2015/upload.component.js

@@ -419,7 +419,7 @@ let UploadComponent = UploadComponent_1 = class UploadComponent {
      * @hidden
      */
     onFileSelectButtonFocus(_event) {
-        this.renderer.addClass(this.fileSelectButton.nativeElement, 'k-state-focused');
+        this.renderer.addClass(this.fileSelectButton.nativeElement, 'k-focus');
         if (!this.navigation.focused) {
             this.navigation.focusedIndex = -1;
         }
@@ -428,7 +428,7 @@ let UploadComponent = UploadComponent_1 = class UploadComponent {
      * @hidden
      */
     onFileSelectButtonBlur(_event) {
-        this.renderer.removeClass(this.fileSelectButton.nativeElement, 'k-state-focused');
+        this.renderer.removeClass(this.fileSelectButton.nativeElement, 'k-focus');
     }
     /**
      * @hidden
@@ -831,7 +831,7 @@ tslib_1.__decorate([
     tslib_1.__metadata("design:type", Boolean)
 ], UploadComponent.prototype, "hostDefaultClasses", void 0);
 tslib_1.__decorate([
-    HostBinding('class.k-state-disabled'),
+    HostBinding('class.k-disabled'),
     tslib_1.__metadata("design:type", Boolean),
     tslib_1.__metadata("design:paramtypes", [])
 ], UploadComponent.prototype, "hostDisabledClass", null);
@@ -938,7 +938,7 @@ UploadComponent = UploadComponent_1 = tslib_1.__decorate([
              [attr.tabindex]="selectButtonTabIndex"
              (focus)="onFileSelectButtonFocus($event)"
              (blur)="onFileSelectButtonBlur($event)"
-             class="k-button k-upload-button">
+             class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-upload-button">
           <input #fileSelect kendoFileSelect
             [attr.accept]="accept ? accept : null"
             [attr.aria-hidden]="true"

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: 1635936938,
+    publishDate: 1641908983,
     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'
 };
@@ -1725,7 +1725,7 @@ let FileSelectComponent = FileSelectComponent_1 = class FileSelectComponent {
      * @hidden
      */
     onFileSelectButtonFocus(_event) {
-        this.renderer.addClass(this.fileSelectButton.nativeElement, 'k-state-focused');
+        this.renderer.addClass(this.fileSelectButton.nativeElement, 'k-focus');
         if (!this.navigation.focused) {
             this.navigation.focusedIndex = -1;
         }
@@ -1734,7 +1734,7 @@ let FileSelectComponent = FileSelectComponent_1 = class FileSelectComponent {
      * @hidden
      */
     onFileSelectButtonBlur(_event) {
-        this.renderer.removeClass(this.fileSelectButton.nativeElement, 'k-state-focused');
+        this.renderer.removeClass(this.fileSelectButton.nativeElement, 'k-focus');
     }
     subscribeBlur() {
         if (!isDocumentAvailable()) {
@@ -1874,7 +1874,7 @@ __decorate([
     __metadata("design:type", Boolean)
 ], FileSelectComponent.prototype, "hostDefaultClasses", void 0);
 __decorate([
-    HostBinding('class.k-state-disabled'),
+    HostBinding('class.k-disabled'),
     __metadata("design:type", Boolean),
     __metadata("design:paramtypes", [])
 ], FileSelectComponent.prototype, "hostDisabledClass", null);
@@ -1939,7 +1939,7 @@ FileSelectComponent = FileSelectComponent_1 = __decorate([
                 [attr.tabindex]="selectButtonTabIndex"
                 (focus)="onFileSelectButtonFocus($event)"
                 (blur)="onFileSelectButtonBlur($event)"
-                class="k-button k-upload-button">
+                class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-upload-button">
                 <input #fileSelect kendoFileSelect
                     [attr.accept]="accept ? accept : null"
                     [dir]="direction"
@@ -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) {
@@ -2665,25 +2668,25 @@ FileListItemActionButtonComponent = __decorate([
       <strong class="k-upload-status">
         <span class="k-upload-pct" *ngIf="isUploading || isPaused">{{progress}}%</span>
 
-        <button type="button" *ngIf="isFailed" class="k-button k-button-icon k-flat k-upload-action"
-          [ngClass]="{ 'k-state-focused': this.retryFocused }"
+        <button type="button" *ngIf="isFailed" class="k-button k-icon-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-upload-action"
+          [ngClass]="{ 'k-focus': this.retryFocused }"
           [attr.tabIndex]="-1"
           (focus)="onFocus('retry')"
           (blur)="onBlur('retry')"
           (click)="onRetryClick()">
-          <span class="k-icon k-retry k-i-refresh-sm"
+          <span class="k-icon k-button-icon k-retry k-i-refresh-sm"
             [attr.aria-label]="retryButtonTitle"
             [attr.title]="retryButtonTitle">
           </span>
         </button>
 
-        <button *ngIf="isResumable" type="button" class="k-button k-button-icon k-flat k-upload-action"
-          [ngClass]="{ 'k-state-focused': this.pauseResumeFocused }"
+        <button *ngIf="isResumable" type="button" class="k-button k-icon-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-upload-action"
+          [ngClass]="{ 'k-focus': this.pauseResumeFocused }"
           [attr.tabIndex]="-1"
           (focus)="onFocus('pauseResume')"
           (blur)="onBlur('pauseResume')"
           (click)="onPauseResumeClick()">
-          <span class="k-icon"
+          <span class="k-icon k-button-icon"
             [ngClass]="{
               'k-i-play-sm': isPaused,
               'k-i-pause-sm': !isPaused
@@ -2693,13 +2696,13 @@ FileListItemActionButtonComponent = __decorate([
           </span>
         </button>
 
-        <button type="button" *ngIf="isActionButtonVisible" class="k-button k-button-icon k-flat k-upload-action"
-          [ngClass]="{ 'k-state-focused': this.actionFocused }"
+        <button type="button" *ngIf="isActionButtonVisible" class="k-button k-icon-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-upload-action"
+          [ngClass]="{ 'k-focus': this.actionFocused }"
           [attr.tabIndex]="-1"
           (focus)="onFocus('action')"
           (blur)="onBlur('action')"
-          (click)="onRemoveCancelClick()">
-          <span class="k-icon"
+          (click)="onRemoveCancelClick($event)">
+          <span class="k-icon k-button-icon"
             [ngClass]="{
               'k-i-cancel': isUploading,
               'k-delete k-i-x': !isUploading
@@ -2712,7 +2715,8 @@ FileListItemActionButtonComponent = __decorate([
     `
     }),
     __metadata("design:paramtypes", [UploadService,
-        LocalizationService])
+        LocalizationService,
+        NavigationService])
 ], FileListItemActionButtonComponent);
 
 /**
@@ -3538,7 +3542,7 @@ let UploadComponent = UploadComponent_1 = class UploadComponent {
      * @hidden
      */
     onFileSelectButtonFocus(_event) {
-        this.renderer.addClass(this.fileSelectButton.nativeElement, 'k-state-focused');
+        this.renderer.addClass(this.fileSelectButton.nativeElement, 'k-focus');
         if (!this.navigation.focused) {
             this.navigation.focusedIndex = -1;
         }
@@ -3547,7 +3551,7 @@ let UploadComponent = UploadComponent_1 = class UploadComponent {
      * @hidden
      */
     onFileSelectButtonBlur(_event) {
-        this.renderer.removeClass(this.fileSelectButton.nativeElement, 'k-state-focused');
+        this.renderer.removeClass(this.fileSelectButton.nativeElement, 'k-focus');
     }
     /**
      * @hidden
@@ -3950,7 +3954,7 @@ __decorate([
     __metadata("design:type", Boolean)
 ], UploadComponent.prototype, "hostDefaultClasses", void 0);
 __decorate([
-    HostBinding('class.k-state-disabled'),
+    HostBinding('class.k-disabled'),
     __metadata("design:type", Boolean),
     __metadata("design:paramtypes", [])
 ], UploadComponent.prototype, "hostDisabledClass", null);
@@ -4057,7 +4061,7 @@ UploadComponent = UploadComponent_1 = __decorate([
              [attr.tabindex]="selectButtonTabIndex"
              (focus)="onFileSelectButtonFocus($event)"
              (blur)="onFileSelectButtonBlur($event)"
-             class="k-button k-upload-button">
+             class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-upload-button">
           <input #fileSelect kendoFileSelect
             [attr.accept]="accept ? accept : null"
             [attr.aria-hidden]="true"
@@ -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) {
@@ -4441,14 +4454,14 @@ UploadActionButtonsComponent = __decorate([
     Component({
         selector: 'kendo-upload-action-buttons',
         template: `
-        <button #clearButton type="button" class="k-button k-clear-selected"
+        <button #clearButton type="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base 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"
+        <button #uploadButton type="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-primary k-upload-selected"
             [attr.tabIndex]="-1"
-            (click)="performUpload($event)">
+            (click)="onUploadButtonClick($event)">
                 {{textFor('uploadSelectedFiles')}}
         </button>
     `