@progress/kendo-angular-upload
Version:
Kendo UI Angular Upload Component
127 lines (126 loc) • 6.15 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
/* eslint-disable no-debugger */
import { Component, Input, HostBinding, ViewChild, ElementRef } from '@angular/core';
import { UploadService } from '../upload.service';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { NavigationService } from '../navigation.service';
import * as i0 from "@angular/core";
import * as i1 from "../upload.service";
import * as i2 from "@progress/kendo-angular-l10n";
import * as i3 from "../navigation.service";
/**
* @hidden
*/
export class UploadActionButtonsComponent {
uploadService;
localization;
navigation;
disabled;
actionsLayout;
clearButton;
uploadButton;
hostDefaultClass = true;
get actionButtonsEndClassName() {
return this.actionsLayout === 'end';
}
get actionButtonsStretchedClassName() {
return this.actionsLayout === 'stretched';
}
get actionButtonsStartClassName() {
return this.actionsLayout === 'start';
}
get actionButtonsCenterClassName() {
return this.actionsLayout === 'center';
}
constructor(uploadService, localization, navigation) {
this.uploadService = uploadService;
this.localization = localization;
this.navigation = navigation;
}
onUploadButtonFocus() {
if (!this.navigation.focused) {
this.navigation.focusedIndex = this.navigation.lastIndex;
}
}
onUploadButtonClick(event) {
event.stopImmediatePropagation();
this.performUpload();
}
performUpload() {
if (!this.disabled) {
this.uploadService.uploadFiles();
this.navigation.focusSelectButton();
}
}
onClearButtonClick(event) {
event.stopImmediatePropagation();
this.clearFiles();
}
clearFiles() {
if (!this.disabled) {
this.uploadService.clearFiles();
this.navigation.focusSelectButton();
}
}
textFor(key) {
return this.localization.get(key);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UploadActionButtonsComponent, deps: [{ token: i1.UploadService }, { token: i2.LocalizationService }, { token: i3.NavigationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: UploadActionButtonsComponent, isStandalone: true, selector: "kendo-upload-action-buttons", inputs: { disabled: "disabled", actionsLayout: "actionsLayout" }, host: { properties: { "class.k-actions": "this.hostDefaultClass", "class.k-actions-end": "this.actionButtonsEndClassName", "class.k-actions-stretched": "this.actionButtonsStretchedClassName", "class.k-actions-start": "this.actionButtonsStartClassName", "class.k-actions-center": "this.actionButtonsCenterClassName" } }, viewQueries: [{ propertyName: "clearButton", first: true, predicate: ["clearButton"], descendants: true, static: true }, { propertyName: "uploadButton", first: true, predicate: ["uploadButton"], descendants: true, static: true }], ngImport: i0, template: `
<button #clearButton role="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-clear-selected"
(click)="onClearButtonClick($event)">
{{textFor('clearSelectedFiles')}}
</button>
<button #uploadButton role="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-primary k-upload-selected"
(focus)="onUploadButtonFocus()"
(click)="onUploadButtonClick($event)">
{{textFor('uploadSelectedFiles')}}
</button>
`, isInline: true });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UploadActionButtonsComponent, decorators: [{
type: Component,
args: [{
selector: 'kendo-upload-action-buttons',
template: `
<button #clearButton role="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-clear-selected"
(click)="onClearButtonClick($event)">
{{textFor('clearSelectedFiles')}}
</button>
<button #uploadButton role="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-primary k-upload-selected"
(focus)="onUploadButtonFocus()"
(click)="onUploadButtonClick($event)">
{{textFor('uploadSelectedFiles')}}
</button>
`,
standalone: true
}]
}], ctorParameters: function () { return [{ type: i1.UploadService }, { type: i2.LocalizationService }, { type: i3.NavigationService }]; }, propDecorators: { disabled: [{
type: Input
}], actionsLayout: [{
type: Input
}], clearButton: [{
type: ViewChild,
args: ['clearButton', { static: true }]
}], uploadButton: [{
type: ViewChild,
args: ['uploadButton', { static: true }]
}], hostDefaultClass: [{
type: HostBinding,
args: ['class.k-actions']
}], actionButtonsEndClassName: [{
type: HostBinding,
args: ['class.k-actions-end']
}], actionButtonsStretchedClassName: [{
type: HostBinding,
args: ['class.k-actions-stretched']
}], actionButtonsStartClassName: [{
type: HostBinding,
args: ['class.k-actions-start']
}], actionButtonsCenterClassName: [{
type: HostBinding,
args: ['class.k-actions-center']
}] } });