@indigina/ui-kit 1.1.0 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/kit-file-upload/kit-file-upload.component.mjs +13 -4
- package/fesm2015/indigina-ui-kit.mjs +12 -3
- package/fesm2015/indigina-ui-kit.mjs.map +1 -1
- package/fesm2020/indigina-ui-kit.mjs +12 -3
- package/fesm2020/indigina-ui-kit.mjs.map +1 -1
- package/lib/components/kit-file-upload/kit-file-upload.component.d.ts +7 -2
- package/package.json +1 -1
|
@@ -16,7 +16,7 @@ export class KitFileUploadComponent {
|
|
|
16
16
|
/**
|
|
17
17
|
* Defines the URL of the endpoint for the upload request
|
|
18
18
|
*/
|
|
19
|
-
this.saveUrl =
|
|
19
|
+
this.saveUrl = '';
|
|
20
20
|
/**
|
|
21
21
|
* Defines the initial list of files
|
|
22
22
|
*/
|
|
@@ -25,6 +25,10 @@ export class KitFileUploadComponent {
|
|
|
25
25
|
* An action which is emitted when download file button clicked
|
|
26
26
|
*/
|
|
27
27
|
this.fileDownloaded = new EventEmitter();
|
|
28
|
+
/**
|
|
29
|
+
* An action which is emitted when files are selected
|
|
30
|
+
*/
|
|
31
|
+
this.filesSelected = new EventEmitter();
|
|
28
32
|
this.KitSvgIcon = KitSvgIcon;
|
|
29
33
|
this.KitButtonKind = KitButtonKind;
|
|
30
34
|
this.kitFileUploadValidationErrorMap = {
|
|
@@ -35,6 +39,9 @@ export class KitFileUploadComponent {
|
|
|
35
39
|
onFileDownload(file) {
|
|
36
40
|
this.fileDownloaded.emit(file);
|
|
37
41
|
}
|
|
42
|
+
onFilesSelect(files) {
|
|
43
|
+
this.filesSelected.emit(files);
|
|
44
|
+
}
|
|
38
45
|
getValidationError(error) {
|
|
39
46
|
const valueGetter = this.kitFileUploadValidationErrorMap[error];
|
|
40
47
|
return valueGetter && valueGetter();
|
|
@@ -44,10 +51,10 @@ export class KitFileUploadComponent {
|
|
|
44
51
|
}
|
|
45
52
|
}
|
|
46
53
|
KitFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: KitFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
47
|
-
KitFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: KitFileUploadComponent, selector: "kit-file-upload", inputs: { saveUrl: "saveUrl", files: "files", selectFilesLabel: "selectFilesLabel", dropzoneLabel: "dropzoneLabel", restrictions: "restrictions", restrictionsErrorMessages: "restrictionsErrorMessages" }, outputs: { fileDownloaded: "fileDownloaded" }, ngImport: i0, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [(ngModel)]=\"files\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.FileTemplateDirective, selector: "[kendoUploadFileTemplate], [kendoFileSelectFileTemplate]" }, { kind: "component", type: i2.CustomMessagesComponent, selector: "kendo-upload-messages, kendo-fileselect-messages, kendo-uploaddropzone-messages" }, { kind: "component", type: i2.UploadComponent, selector: "kendo-upload", inputs: ["autoUpload", "batch", "withCredentials", "saveField", "saveHeaders", "saveMethod", "saveUrl", "responseType", "removeField", "removeHeaders", "removeMethod", "removeUrl", "chunkable", "concurrent", "multiple", "disabled", "showFileList", "tabindex", "zoneId", "tabIndex", "accept", "restrictions", "focusableId", "actionsLayout"], outputs: ["blur", "cancel", "clear", "complete", "error", "focus", "pause", "remove", "resume", "select", "success", "upload", "uploadProgress", "valueChange"], exportAs: ["kendoUpload"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
54
|
+
KitFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: KitFileUploadComponent, selector: "kit-file-upload", inputs: { saveUrl: "saveUrl", files: "files", selectFilesLabel: "selectFilesLabel", dropzoneLabel: "dropzoneLabel", restrictions: "restrictions", restrictionsErrorMessages: "restrictionsErrorMessages" }, outputs: { fileDownloaded: "fileDownloaded", filesSelected: "filesSelected" }, ngImport: i0, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [autoUpload]=\"false\"\n [(ngModel)]=\"files\"\n (select)=\"onFilesSelect($event.files)\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}.kit-file-upload .k-upload .k-actions{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.FileTemplateDirective, selector: "[kendoUploadFileTemplate], [kendoFileSelectFileTemplate]" }, { kind: "component", type: i2.CustomMessagesComponent, selector: "kendo-upload-messages, kendo-fileselect-messages, kendo-uploaddropzone-messages" }, { kind: "component", type: i2.UploadComponent, selector: "kendo-upload", inputs: ["autoUpload", "batch", "withCredentials", "saveField", "saveHeaders", "saveMethod", "saveUrl", "responseType", "removeField", "removeHeaders", "removeMethod", "removeUrl", "chunkable", "concurrent", "multiple", "disabled", "showFileList", "tabindex", "zoneId", "tabIndex", "accept", "restrictions", "focusableId", "actionsLayout"], outputs: ["blur", "cancel", "clear", "complete", "error", "focus", "pause", "remove", "resume", "select", "success", "upload", "uploadProgress", "valueChange"], exportAs: ["kendoUpload"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
48
55
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: KitFileUploadComponent, decorators: [{
|
|
49
56
|
type: Component,
|
|
50
|
-
args: [{ selector: 'kit-file-upload', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [(ngModel)]=\"files\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}\n"] }]
|
|
57
|
+
args: [{ selector: 'kit-file-upload', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [autoUpload]=\"false\"\n [(ngModel)]=\"files\"\n (select)=\"onFilesSelect($event.files)\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}.kit-file-upload .k-upload .k-actions{display:none}\n"] }]
|
|
51
58
|
}], propDecorators: { saveUrl: [{
|
|
52
59
|
type: Input
|
|
53
60
|
}], files: [{
|
|
@@ -62,5 +69,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
62
69
|
type: Input
|
|
63
70
|
}], fileDownloaded: [{
|
|
64
71
|
type: Output
|
|
72
|
+
}], filesSelected: [{
|
|
73
|
+
type: Output
|
|
65
74
|
}] } });
|
|
66
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
75
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia2l0LWZpbGUtdXBsb2FkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3VpLWtpdC9zcmMvbGliL2NvbXBvbmVudHMva2l0LWZpbGUtdXBsb2FkL2tpdC1maWxlLXVwbG9hZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1raXQvc3JjL2xpYi9jb21wb25lbnRzL2tpdC1maWxlLXVwbG9hZC9raXQtZmlsZS11cGxvYWQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNuSCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDL0QsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLG9DQUFvQyxDQUFDOzs7Ozs7QUFHaEUsSUFBSyw0QkFHSjtBQUhELFdBQUssNEJBQTRCO0lBQy9CLCtFQUErQyxDQUFBO0lBQy9DLDRFQUE0QyxDQUFBO0FBQzlDLENBQUMsRUFISSw0QkFBNEIsS0FBNUIsNEJBQTRCLFFBR2hDO0FBU0QsTUFBTSxPQUFPLHNCQUFzQjtJQVBuQztRQVFFOztXQUVHO1FBQ00sWUFBTyxHQUFXLEVBQUUsQ0FBQztRQUU5Qjs7V0FFRztRQUNNLFVBQUssR0FBd0IsRUFBRSxDQUFDO1FBc0J6Qzs7V0FFRztRQUNPLG1CQUFjLEdBQW9DLElBQUksWUFBWSxFQUFxQixDQUFDO1FBRWxHOztXQUVHO1FBQ08sa0JBQWEsR0FBc0MsSUFBSSxZQUFZLEVBQXVCLENBQUM7UUFFNUYsZUFBVSxHQUFzQixVQUFVLENBQUM7UUFDM0Msa0JBQWEsR0FBeUIsYUFBYSxDQUFDO1FBQ3BELG9DQUErQixHQUFpQztZQUN2RSxDQUFDLDRCQUE0QixDQUFDLHNCQUFzQixDQUFDLEVBQUUsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLHlCQUF5QixFQUFFLGlCQUFpQixJQUFJLEVBQUU7WUFDcEgsQ0FBQyw0QkFBNEIsQ0FBQyxxQkFBcUIsQ0FBQyxFQUFFLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyx5QkFBeUIsRUFBRSxXQUFXLElBQUksRUFBRTtTQUM5RyxDQUFDO0tBa0JIO0lBaEJDLGNBQWMsQ0FBQyxJQUF1QjtRQUNwQyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUNqQyxDQUFDO0lBRUQsYUFBYSxDQUFDLEtBQTBCO1FBQ3RDLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2pDLENBQUM7SUFFRCxrQkFBa0IsQ0FBQyxLQUFhO1FBQzlCLE1BQU0sV0FBVyxHQUFpQixJQUFJLENBQUMsK0JBQStCLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDOUUsT0FBTyxXQUFXLElBQUksV0FBVyxFQUFFLENBQUM7SUFDdEMsQ0FBQztJQUVELGFBQWEsQ0FBQyxLQUEwQjtRQUN0QyxPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7O21IQS9EVSxzQkFBc0I7dUdBQXRCLHNCQUFzQixrVkNqQm5DLCt6Q0FrQ0E7MkZEakJhLHNCQUFzQjtrQkFQbEMsU0FBUzsrQkFDRSxpQkFBaUIsbUJBR1YsdUJBQXVCLENBQUMsTUFBTSxpQkFDaEMsaUJBQWlCLENBQUMsSUFBSTs4QkFNNUIsT0FBTztzQkFBZixLQUFLO2dCQUtHLEtBQUs7c0JBQWIsS0FBSztnQkFLRyxnQkFBZ0I7c0JBQXhCLEtBQUs7Z0JBS0csYUFBYTtzQkFBckIsS0FBSztnQkFLRyxZQUFZO3NCQUFwQixLQUFLO2dCQUtHLHlCQUF5QjtzQkFBakMsS0FBSztnQkFLSSxjQUFjO3NCQUF2QixNQUFNO2dCQUtHLGFBQWE7c0JBQXRCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBLaXRCdXR0b25LaW5kIH0gZnJvbSAnLi4va2l0LWJ1dHRvbi9raXQtYnV0dG9uLmNvbnN0JztcbmltcG9ydCB7IEtpdFN2Z0ljb24gfSBmcm9tICcuLi9raXQtc3ZnLWljb24va2l0LXN2Zy1pY29uLmNvbnN0JztcbmltcG9ydCB7IEtpdEZpbGVVcGxvYWRGaWxlLCBLaXRGaWxlVXBsb2FkRmlsZVJlc3RyaWN0aW9ucywgS2l0RmlsZVVwbG9hZEZpbGVSZXN0cmljdGlvbnNNZXNzYWdlcyB9IGZyb20gJy4va2l0LWZpbGUtdXBsb2FkLm1vZGVsJztcblxuZW51bSBLaXRGaWxlVXBsb2FkVmFsaWRhdGlvbkVycm9yIHtcbiAgSU5WQUxJRF9GSUxFX0VYVEVOU0lPTiA9ICdpbnZhbGlkRmlsZUV4dGVuc2lvbicsXG4gIElOVkFMSURfTUFYX0ZJTEVfU0laRSA9ICdpbnZhbGlkTWF4RmlsZVNpemUnLFxufVxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdraXQtZmlsZS11cGxvYWQnLFxuICB0ZW1wbGF0ZVVybDogJy4va2l0LWZpbGUtdXBsb2FkLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4va2l0LWZpbGUtdXBsb2FkLmNvbXBvbmVudC5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxufSlcbmV4cG9ydCBjbGFzcyBLaXRGaWxlVXBsb2FkQ29tcG9uZW50IHtcbiAgLyoqXG4gICAqIERlZmluZXMgdGhlIFVSTCBvZiB0aGUgZW5kcG9pbnQgZm9yIHRoZSB1cGxvYWQgcmVxdWVzdFxuICAgKi9cbiAgQElucHV0KCkgc2F2ZVVybDogc3RyaW5nID0gJyc7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgdGhlIGluaXRpYWwgbGlzdCBvZiBmaWxlc1xuICAgKi9cbiAgQElucHV0KCkgZmlsZXM6IEtpdEZpbGVVcGxvYWRGaWxlW10gPSBbXTtcblxuICAvKipcbiAgICogRGVmaW5lcyBhIGxhYmVsIGZvciBcIlNlbGVjdCBmaWxlc1wiIGJ1dHRvblxuICAgKi9cbiAgQElucHV0KCkgc2VsZWN0RmlsZXNMYWJlbD86IHN0cmluZztcblxuICAvKipcbiAgICogRGVmaW5lcyBhIGxhYmVsIGZvciBkcm9wem9uZVxuICAgKi9cbiAgQElucHV0KCkgZHJvcHpvbmVMYWJlbD86IHN0cmluZztcblxuICAvKipcbiAgICogRGVmaW5lcyB0aGUgcmVzdHJpY3Rpb25zIGZvciBzZWxlY3RlZCBmaWxlc1xuICAgKi9cbiAgQElucHV0KCkgcmVzdHJpY3Rpb25zPzogS2l0RmlsZVVwbG9hZEZpbGVSZXN0cmljdGlvbnM7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgYSBsaXN0IG9mIGVycm9yIG1lc3NhZ2VzIGZvciBzZWxlY3RlZCBmaWxlc1xuICAgKi9cbiAgQElucHV0KCkgcmVzdHJpY3Rpb25zRXJyb3JNZXNzYWdlcz86IEtpdEZpbGVVcGxvYWRGaWxlUmVzdHJpY3Rpb25zTWVzc2FnZXM7XG5cbiAgLyoqXG4gICAqIEFuIGFjdGlvbiB3aGljaCBpcyBlbWl0dGVkIHdoZW4gZG93bmxvYWQgZmlsZSBidXR0b24gY2xpY2tlZFxuICAgKi9cbiAgQE91dHB1dCgpIGZpbGVEb3dubG9hZGVkOiBFdmVudEVtaXR0ZXI8S2l0RmlsZVVwbG9hZEZpbGU+ID0gbmV3IEV2ZW50RW1pdHRlcjxLaXRGaWxlVXBsb2FkRmlsZT4oKTtcblxuICAvKipcbiAgICogQW4gYWN0aW9uIHdoaWNoIGlzIGVtaXR0ZWQgd2hlbiBmaWxlcyBhcmUgc2VsZWN0ZWRcbiAgICovXG4gIEBPdXRwdXQoKSBmaWxlc1NlbGVjdGVkOiBFdmVudEVtaXR0ZXI8S2l0RmlsZVVwbG9hZEZpbGVbXT4gPSBuZXcgRXZlbnRFbWl0dGVyPEtpdEZpbGVVcGxvYWRGaWxlW10+KCk7XG5cbiAgcmVhZG9ubHkgS2l0U3ZnSWNvbjogdHlwZW9mIEtpdFN2Z0ljb24gPSBLaXRTdmdJY29uO1xuICByZWFkb25seSBLaXRCdXR0b25LaW5kOiB0eXBlb2YgS2l0QnV0dG9uS2luZCA9IEtpdEJ1dHRvbktpbmQ7XG4gIHJlYWRvbmx5IGtpdEZpbGVVcGxvYWRWYWxpZGF0aW9uRXJyb3JNYXA6IFJlY29yZDxzdHJpbmcsICgpID0+IHN0cmluZz4gPSB7XG4gICAgW0tpdEZpbGVVcGxvYWRWYWxpZGF0aW9uRXJyb3IuSU5WQUxJRF9GSUxFX0VYVEVOU0lPTl06ICgpID0+IHRoaXMucmVzdHJpY3Rpb25zRXJyb3JNZXNzYWdlcz8uYWxsb3dlZEV4dGVuc2lvbnMgfHwgJycsXG4gICAgW0tpdEZpbGVVcGxvYWRWYWxpZGF0aW9uRXJyb3IuSU5WQUxJRF9NQVhfRklMRV9TSVpFXTogKCkgPT4gdGhpcy5yZXN0cmljdGlvbnNFcnJvck1lc3NhZ2VzPy5tYXhGaWxlU2l6ZSB8fCAnJyxcbiAgfTtcblxuICBvbkZpbGVEb3dubG9hZChmaWxlOiBLaXRGaWxlVXBsb2FkRmlsZSk6IHZvaWQge1xuICAgIHRoaXMuZmlsZURvd25sb2FkZWQuZW1pdChmaWxlKTtcbiAgfVxuXG4gIG9uRmlsZXNTZWxlY3QoZmlsZXM6IEtpdEZpbGVVcGxvYWRGaWxlW10pOiB2b2lkIHtcbiAgICB0aGlzLmZpbGVzU2VsZWN0ZWQuZW1pdChmaWxlcyk7XG4gIH1cblxuICBnZXRWYWxpZGF0aW9uRXJyb3IoZXJyb3I6IHN0cmluZyk6IHN0cmluZyB7XG4gICAgY29uc3QgdmFsdWVHZXR0ZXI6ICgpID0+IHN0cmluZyA9IHRoaXMua2l0RmlsZVVwbG9hZFZhbGlkYXRpb25FcnJvck1hcFtlcnJvcl07XG4gICAgcmV0dXJuIHZhbHVlR2V0dGVyICYmIHZhbHVlR2V0dGVyKCk7XG4gIH1cblxuICBnZXRUeXBlZEZpbGVzKGZpbGVzOiBLaXRGaWxlVXBsb2FkRmlsZVtdKTogS2l0RmlsZVVwbG9hZEZpbGVbXSB7XG4gICAgcmV0dXJuIGZpbGVzO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwia2l0LWZpbGUtdXBsb2FkXCI+XG4gIDxrZW5kby11cGxvYWQgW3NhdmVVcmxdPVwic2F2ZVVybFwiXG4gICAgICAgICAgICAgICAgW3dpdGhDcmVkZW50aWFsc109XCJmYWxzZVwiXG4gICAgICAgICAgICAgICAgW3Jlc3RyaWN0aW9uc109XCJyZXN0cmljdGlvbnNcIlxuICAgICAgICAgICAgICAgIFthdXRvVXBsb2FkXT1cImZhbHNlXCJcbiAgICAgICAgICAgICAgICBbKG5nTW9kZWwpXT1cImZpbGVzXCJcbiAgICAgICAgICAgICAgICAoc2VsZWN0KT1cIm9uRmlsZXNTZWxlY3QoJGV2ZW50LmZpbGVzKVwiPlxuICAgIDxrZW5kby11cGxvYWQtbWVzc2FnZXMgW3NlbGVjdF09XCJzZWxlY3RGaWxlc0xhYmVsXCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgIFtkcm9wRmlsZXNIZXJlXT1cImRyb3B6b25lTGFiZWxcIlxuICAgID48L2tlbmRvLXVwbG9hZC1tZXNzYWdlcz5cblxuICAgIDxuZy10ZW1wbGF0ZSBrZW5kb1VwbG9hZEZpbGVUZW1wbGF0ZSBsZXQtZmlsZXM+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZ2V0VHlwZWRGaWxlcyhmaWxlcyk7IGxldCBmaWxlc1wiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCBmaWxlIG9mIGZpbGVzXCI+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cImZpbGUtaW5mb1wiPlxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImZpbGUtbmFtZVwiPlxuICAgICAgICAgICAgICB7eyBmaWxlLm5hbWUgfX1cbiAgICAgICAgICAgIDwvZGl2PlxuXG4gICAgICAgICAgICA8ZGl2ICpuZ0Zvcj1cImxldCBlcnJvciBvZiBmaWxlLnZhbGlkYXRpb25FcnJvcnNcIiBjbGFzcz1cImZpbGUtdmFsaWRhdGlvbi1tZXNzYWdlXCI+XG4gICAgICAgICAgICAgIHt7IGdldFZhbGlkYXRpb25FcnJvcihlcnJvcikgfX1cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxidXR0b24gKm5nSWY9XCIhZmlsZS52YWxpZGF0aW9uRXJyb3JzXCIgY2xhc3M9XCJkb3dubG9hZC1idXR0b25cIj5cbiAgICAgICAgICAgIDxraXQtc3ZnLWljb24gY2xhc3M9XCJkb3dubG9hZC1idXR0b24taWNvblwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgIFtpY29uXT1cIktpdFN2Z0ljb24uRE9XTkxPQURcIlxuICAgICAgICAgICAgICAgICAgICAgICAgICAoY2xpY2spPVwib25GaWxlRG93bmxvYWQoZmlsZSlcIlxuICAgICAgICAgICAgPjwva2l0LXN2Zy1pY29uPlxuICAgICAgICAgIDwvYnV0dG9uPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgIDwvbmctY29udGFpbmVyPlxuICAgIDwvbmctdGVtcGxhdGU+XG4gIDwva2VuZG8tdXBsb2FkPlxuPC9kaXY+XG4iXX0=
|
|
@@ -3305,7 +3305,7 @@ class KitFileUploadComponent {
|
|
|
3305
3305
|
/**
|
|
3306
3306
|
* Defines the URL of the endpoint for the upload request
|
|
3307
3307
|
*/
|
|
3308
|
-
this.saveUrl =
|
|
3308
|
+
this.saveUrl = '';
|
|
3309
3309
|
/**
|
|
3310
3310
|
* Defines the initial list of files
|
|
3311
3311
|
*/
|
|
@@ -3314,6 +3314,10 @@ class KitFileUploadComponent {
|
|
|
3314
3314
|
* An action which is emitted when download file button clicked
|
|
3315
3315
|
*/
|
|
3316
3316
|
this.fileDownloaded = new EventEmitter();
|
|
3317
|
+
/**
|
|
3318
|
+
* An action which is emitted when files are selected
|
|
3319
|
+
*/
|
|
3320
|
+
this.filesSelected = new EventEmitter();
|
|
3317
3321
|
this.KitSvgIcon = KitSvgIcon;
|
|
3318
3322
|
this.KitButtonKind = KitButtonKind;
|
|
3319
3323
|
this.kitFileUploadValidationErrorMap = {
|
|
@@ -3324,6 +3328,9 @@ class KitFileUploadComponent {
|
|
|
3324
3328
|
onFileDownload(file) {
|
|
3325
3329
|
this.fileDownloaded.emit(file);
|
|
3326
3330
|
}
|
|
3331
|
+
onFilesSelect(files) {
|
|
3332
|
+
this.filesSelected.emit(files);
|
|
3333
|
+
}
|
|
3327
3334
|
getValidationError(error) {
|
|
3328
3335
|
const valueGetter = this.kitFileUploadValidationErrorMap[error];
|
|
3329
3336
|
return valueGetter && valueGetter();
|
|
@@ -3333,10 +3340,10 @@ class KitFileUploadComponent {
|
|
|
3333
3340
|
}
|
|
3334
3341
|
}
|
|
3335
3342
|
KitFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: KitFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3336
|
-
KitFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: KitFileUploadComponent, selector: "kit-file-upload", inputs: { saveUrl: "saveUrl", files: "files", selectFilesLabel: "selectFilesLabel", dropzoneLabel: "dropzoneLabel", restrictions: "restrictions", restrictionsErrorMessages: "restrictionsErrorMessages" }, outputs: { fileDownloaded: "fileDownloaded" }, ngImport: i0, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [(ngModel)]=\"files\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.FileTemplateDirective, selector: "[kendoUploadFileTemplate], [kendoFileSelectFileTemplate]" }, { kind: "component", type: i2$3.CustomMessagesComponent, selector: "kendo-upload-messages, kendo-fileselect-messages, kendo-uploaddropzone-messages" }, { kind: "component", type: i2$3.UploadComponent, selector: "kendo-upload", inputs: ["autoUpload", "batch", "withCredentials", "saveField", "saveHeaders", "saveMethod", "saveUrl", "responseType", "removeField", "removeHeaders", "removeMethod", "removeUrl", "chunkable", "concurrent", "multiple", "disabled", "showFileList", "tabindex", "zoneId", "tabIndex", "accept", "restrictions", "focusableId", "actionsLayout"], outputs: ["blur", "cancel", "clear", "complete", "error", "focus", "pause", "remove", "resume", "select", "success", "upload", "uploadProgress", "valueChange"], exportAs: ["kendoUpload"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3343
|
+
KitFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: KitFileUploadComponent, selector: "kit-file-upload", inputs: { saveUrl: "saveUrl", files: "files", selectFilesLabel: "selectFilesLabel", dropzoneLabel: "dropzoneLabel", restrictions: "restrictions", restrictionsErrorMessages: "restrictionsErrorMessages" }, outputs: { fileDownloaded: "fileDownloaded", filesSelected: "filesSelected" }, ngImport: i0, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [autoUpload]=\"false\"\n [(ngModel)]=\"files\"\n (select)=\"onFilesSelect($event.files)\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}.kit-file-upload .k-upload .k-actions{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.FileTemplateDirective, selector: "[kendoUploadFileTemplate], [kendoFileSelectFileTemplate]" }, { kind: "component", type: i2$3.CustomMessagesComponent, selector: "kendo-upload-messages, kendo-fileselect-messages, kendo-uploaddropzone-messages" }, { kind: "component", type: i2$3.UploadComponent, selector: "kendo-upload", inputs: ["autoUpload", "batch", "withCredentials", "saveField", "saveHeaders", "saveMethod", "saveUrl", "responseType", "removeField", "removeHeaders", "removeMethod", "removeUrl", "chunkable", "concurrent", "multiple", "disabled", "showFileList", "tabindex", "zoneId", "tabIndex", "accept", "restrictions", "focusableId", "actionsLayout"], outputs: ["blur", "cancel", "clear", "complete", "error", "focus", "pause", "remove", "resume", "select", "success", "upload", "uploadProgress", "valueChange"], exportAs: ["kendoUpload"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3337
3344
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: KitFileUploadComponent, decorators: [{
|
|
3338
3345
|
type: Component,
|
|
3339
|
-
args: [{ selector: 'kit-file-upload', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [(ngModel)]=\"files\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}\n"] }]
|
|
3346
|
+
args: [{ selector: 'kit-file-upload', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-file-upload\">\n <kendo-upload [saveUrl]=\"saveUrl\"\n [withCredentials]=\"false\"\n [restrictions]=\"restrictions\"\n [autoUpload]=\"false\"\n [(ngModel)]=\"files\"\n (select)=\"onFilesSelect($event.files)\">\n <kendo-upload-messages [select]=\"selectFilesLabel\"\n [dropFilesHere]=\"dropzoneLabel\"\n ></kendo-upload-messages>\n\n <ng-template kendoUploadFileTemplate let-files>\n <ng-container *ngIf=\"getTypedFiles(files); let files\">\n <ng-container *ngFor=\"let file of files\">\n <div class=\"file-info\">\n <div class=\"file-name\">\n {{ file.name }}\n </div>\n\n <div *ngFor=\"let error of file.validationErrors\" class=\"file-validation-message\">\n {{ getValidationError(error) }}\n </div>\n </div>\n <button *ngIf=\"!file.validationErrors\" class=\"download-button\">\n <kit-svg-icon class=\"download-button-icon\"\n [icon]=\"KitSvgIcon.DOWNLOAD\"\n (click)=\"onFileDownload(file)\"\n ></kit-svg-icon>\n </button>\n </ng-container>\n </ng-container>\n </ng-template>\n </kendo-upload>\n</div>\n", styles: [".kit-file-upload .k-upload{display:flex;flex-direction:column;gap:8px;border:none}.kit-file-upload .k-upload .k-upload-button{position:relative;padding:0;display:flex;align-items:center;min-width:initial;gap:6px;color:var(--ui-kit-color-main);font-weight:500;font-size:14px;border:none;background:none}.kit-file-upload .k-upload .k-upload-button:focus{box-shadow:none}.kit-file-upload .k-upload .k-upload-button:hover .k-button-text{text-decoration:underline}.kit-file-upload .k-upload .k-upload-button:after{content:\"\\e11e\";display:inline-block;position:static;opacity:1;line-height:1;font-size:16px;font-family:WebComponentsIcons,sans-serif}.kit-file-upload .k-upload .k-dropzone{padding:12px 10px;border:2px dashed transparent;background:none}.kit-file-upload .k-upload .k-dropzone.k-hover{border-color:var(--ui-kit-color-main);background:none}.kit-file-upload .k-upload .k-upload-status{display:none}.kit-file-upload .k-upload .k-upload-status+.k-dropzone-hint{display:block}.kit-file-upload .k-upload .k-upload-files{display:flex;flex-direction:column;gap:8px;max-height:initial;border:none}.kit-file-upload .k-upload .k-upload-files .k-file{align-items:center;padding:10px;border:none;background:var(--ui-kit-color-grey-8)}.kit-file-upload .k-upload .k-upload-files .k-file.k-focus{box-shadow:none}.kit-file-upload .k-upload .file-info{flex:1}.kit-file-upload .k-upload .file-name{color:var(--ui-kit-color-cobalt);font-size:14px}.kit-file-upload .k-upload .file-validation-message{color:var(--ui-kit-color-red);font-size:12px}.kit-file-upload .k-upload .download-button{padding:0;border:none;background:none;cursor:pointer}.kit-file-upload .k-upload .download-button:hover .download-button-icon{stroke:var(--ui-kit-color-main)}.kit-file-upload .k-upload .download-button-icon{display:block;width:24px;height:24px;stroke:var(--ui-kit-color-grey-7);fill:none}.kit-file-upload .k-upload .k-actions{display:none}\n"] }]
|
|
3340
3347
|
}], propDecorators: { saveUrl: [{
|
|
3341
3348
|
type: Input
|
|
3342
3349
|
}], files: [{
|
|
@@ -3351,6 +3358,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
3351
3358
|
type: Input
|
|
3352
3359
|
}], fileDownloaded: [{
|
|
3353
3360
|
type: Output
|
|
3361
|
+
}], filesSelected: [{
|
|
3362
|
+
type: Output
|
|
3354
3363
|
}] } });
|
|
3355
3364
|
|
|
3356
3365
|
class KitFileUploadModule {
|