@progress/kendo-angular-upload 21.1.1-develop.1 → 21.2.0-develop.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/esm2022/fileselect.component.mjs +102 -101
- package/esm2022/package-metadata.mjs +2 -2
- package/esm2022/rendering/file-list-item-action-button.component.mjs +95 -86
- package/esm2022/rendering/file-list-multiple-items.component.mjs +61 -55
- package/esm2022/rendering/file-list-single-item.component.mjs +45 -41
- package/esm2022/rendering/file-list.component.mjs +49 -47
- package/esm2022/upload.component.mjs +207 -198
- package/fesm2022/progress-kendo-angular-upload.mjs +559 -525
- package/package.json +8 -8
- package/schematics/ngAdd/index.js +7 -3
|
@@ -16,7 +16,7 @@ import { filter } from 'rxjs/operators';
|
|
|
16
16
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
17
17
|
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
18
18
|
import { ButtonComponent } from '@progress/kendo-angular-buttons';
|
|
19
|
-
import {
|
|
19
|
+
import { NgClass, NgTemplateOutlet } from '@angular/common';
|
|
20
20
|
import { IconWrapperComponent, IconsService } from '@progress/kendo-angular-icons';
|
|
21
21
|
import { ProgressBarComponent } from '@progress/kendo-angular-progressbar';
|
|
22
22
|
import { PopupService } from '@progress/kendo-angular-popup';
|
|
@@ -1585,8 +1585,8 @@ const packageMetadata = {
|
|
|
1585
1585
|
productName: 'Kendo UI for Angular',
|
|
1586
1586
|
productCode: 'KENDOUIANGULAR',
|
|
1587
1587
|
productCodes: ['KENDOUIANGULAR'],
|
|
1588
|
-
publishDate:
|
|
1589
|
-
version: '21.
|
|
1588
|
+
publishDate: 1763998113,
|
|
1589
|
+
version: '21.2.0-develop.1',
|
|
1590
1590
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
1591
1591
|
};
|
|
1592
1592
|
|
|
@@ -2278,56 +2278,61 @@ class FileListItemActionButtonComponent {
|
|
|
2278
2278
|
return true;
|
|
2279
2279
|
}
|
|
2280
2280
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileListItemActionButtonComponent, deps: [{ token: UploadService }, { token: i1$1.LocalizationService }, { token: NavigationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2281
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2281
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FileListItemActionButtonComponent, isStandalone: true, selector: "kendo-upload-file-list-item-action-button", inputs: { file: "file", disabled: "disabled", progress: "progress" }, ngImport: i0, template: `
|
|
2282
2282
|
<span class="k-upload-actions">
|
|
2283
|
-
|
|
2284
|
-
|
|
2283
|
+
@if (isUploading || isPaused) {
|
|
2284
|
+
<span class="k-upload-pct">{{progress}}%</span>
|
|
2285
|
+
}
|
|
2286
|
+
|
|
2287
|
+
@if (isFailed) {
|
|
2285
2288
|
<button
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
|
|
2289
|
-
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2293
|
-
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
(click)="onRetryClick()"
|
|
2289
|
+
kendoButton
|
|
2290
|
+
type="button"
|
|
2291
|
+
class="k-upload-action k-retry"
|
|
2292
|
+
fillMode="flat"
|
|
2293
|
+
[attr.tabIndex]="-1"
|
|
2294
|
+
[attr.aria-hidden]="true"
|
|
2295
|
+
[attr.title]="retryButtonTitle"
|
|
2296
|
+
[svgIcon]="retrySVGIcon"
|
|
2297
|
+
icon="refresh-sm"
|
|
2298
|
+
(pointerdown)="$event.preventDefault()"
|
|
2299
|
+
(click)="onRetryClick()"
|
|
2298
2300
|
></button>
|
|
2299
|
-
|
|
2301
|
+
}
|
|
2302
|
+
|
|
2303
|
+
@if (isResumable) {
|
|
2300
2304
|
<button
|
|
2301
|
-
|
|
2302
|
-
|
|
2303
|
-
|
|
2304
|
-
|
|
2305
|
-
|
|
2306
|
-
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
(click)="onPauseResumeClick()"
|
|
2305
|
+
kendoButton
|
|
2306
|
+
type="button"
|
|
2307
|
+
class="k-upload-action"
|
|
2308
|
+
fillMode="flat"
|
|
2309
|
+
[attr.tabIndex]="-1"
|
|
2310
|
+
[attr.aria-hidden]="true"
|
|
2311
|
+
[attr.title]="pauseResumeButtonTitle"
|
|
2312
|
+
[svgIcon]="isPaused ? playSVGIcon : pauseSVGIcon"
|
|
2313
|
+
[icon]="isPaused ? 'play-sm' : 'pause-sm'"
|
|
2314
|
+
(pointerdown)="$event.preventDefault()"
|
|
2315
|
+
(click)="onPauseResumeClick()"
|
|
2313
2316
|
></button>
|
|
2314
|
-
|
|
2315
|
-
|
|
2316
|
-
|
|
2317
|
-
|
|
2318
|
-
|
|
2319
|
-
|
|
2320
|
-
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2325
|
-
|
|
2326
|
-
|
|
2327
|
-
|
|
2317
|
+
}
|
|
2318
|
+
|
|
2319
|
+
@if (isActionButtonVisible) {
|
|
2320
|
+
<button
|
|
2321
|
+
kendoButton
|
|
2322
|
+
class="k-upload-action"
|
|
2323
|
+
[class.k-delete]="!isUploading"
|
|
2324
|
+
fillMode="flat"
|
|
2325
|
+
type="button"
|
|
2326
|
+
[attr.tabIndex]="-1"
|
|
2327
|
+
[attr.aria-hidden]="true"
|
|
2328
|
+
[attr.title]="actionButtonTitle"
|
|
2329
|
+
[svgIcon]="isUploading ? cancelSVGIcon : deleteSVGIcon"
|
|
2330
|
+
[icon]="isUploading ? 'cancel' : 'x'"
|
|
2331
|
+
(click)="onRemoveCancelClick($event)"
|
|
2328
2332
|
></button>
|
|
2333
|
+
}
|
|
2329
2334
|
</span>
|
|
2330
|
-
`, isInline: true, dependencies: [{ kind: "
|
|
2335
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
|
|
2331
2336
|
}
|
|
2332
2337
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileListItemActionButtonComponent, decorators: [{
|
|
2333
2338
|
type: Component,
|
|
@@ -2335,56 +2340,61 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
2335
2340
|
selector: 'kendo-upload-file-list-item-action-button',
|
|
2336
2341
|
template: `
|
|
2337
2342
|
<span class="k-upload-actions">
|
|
2338
|
-
|
|
2339
|
-
|
|
2343
|
+
@if (isUploading || isPaused) {
|
|
2344
|
+
<span class="k-upload-pct">{{progress}}%</span>
|
|
2345
|
+
}
|
|
2346
|
+
|
|
2347
|
+
@if (isFailed) {
|
|
2340
2348
|
<button
|
|
2341
|
-
|
|
2342
|
-
|
|
2343
|
-
|
|
2344
|
-
|
|
2345
|
-
|
|
2346
|
-
|
|
2347
|
-
|
|
2348
|
-
|
|
2349
|
-
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
(click)="onRetryClick()"
|
|
2349
|
+
kendoButton
|
|
2350
|
+
type="button"
|
|
2351
|
+
class="k-upload-action k-retry"
|
|
2352
|
+
fillMode="flat"
|
|
2353
|
+
[attr.tabIndex]="-1"
|
|
2354
|
+
[attr.aria-hidden]="true"
|
|
2355
|
+
[attr.title]="retryButtonTitle"
|
|
2356
|
+
[svgIcon]="retrySVGIcon"
|
|
2357
|
+
icon="refresh-sm"
|
|
2358
|
+
(pointerdown)="$event.preventDefault()"
|
|
2359
|
+
(click)="onRetryClick()"
|
|
2353
2360
|
></button>
|
|
2354
|
-
|
|
2361
|
+
}
|
|
2362
|
+
|
|
2363
|
+
@if (isResumable) {
|
|
2355
2364
|
<button
|
|
2356
|
-
|
|
2357
|
-
|
|
2358
|
-
|
|
2359
|
-
|
|
2360
|
-
|
|
2361
|
-
|
|
2362
|
-
|
|
2363
|
-
|
|
2364
|
-
|
|
2365
|
-
|
|
2366
|
-
|
|
2367
|
-
(click)="onPauseResumeClick()"
|
|
2365
|
+
kendoButton
|
|
2366
|
+
type="button"
|
|
2367
|
+
class="k-upload-action"
|
|
2368
|
+
fillMode="flat"
|
|
2369
|
+
[attr.tabIndex]="-1"
|
|
2370
|
+
[attr.aria-hidden]="true"
|
|
2371
|
+
[attr.title]="pauseResumeButtonTitle"
|
|
2372
|
+
[svgIcon]="isPaused ? playSVGIcon : pauseSVGIcon"
|
|
2373
|
+
[icon]="isPaused ? 'play-sm' : 'pause-sm'"
|
|
2374
|
+
(pointerdown)="$event.preventDefault()"
|
|
2375
|
+
(click)="onPauseResumeClick()"
|
|
2368
2376
|
></button>
|
|
2369
|
-
|
|
2370
|
-
|
|
2371
|
-
|
|
2372
|
-
|
|
2373
|
-
|
|
2374
|
-
|
|
2375
|
-
|
|
2376
|
-
|
|
2377
|
-
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
|
|
2377
|
+
}
|
|
2378
|
+
|
|
2379
|
+
@if (isActionButtonVisible) {
|
|
2380
|
+
<button
|
|
2381
|
+
kendoButton
|
|
2382
|
+
class="k-upload-action"
|
|
2383
|
+
[class.k-delete]="!isUploading"
|
|
2384
|
+
fillMode="flat"
|
|
2385
|
+
type="button"
|
|
2386
|
+
[attr.tabIndex]="-1"
|
|
2387
|
+
[attr.aria-hidden]="true"
|
|
2388
|
+
[attr.title]="actionButtonTitle"
|
|
2389
|
+
[svgIcon]="isUploading ? cancelSVGIcon : deleteSVGIcon"
|
|
2390
|
+
[icon]="isUploading ? 'cancel' : 'x'"
|
|
2391
|
+
(click)="onRemoveCancelClick($event)"
|
|
2383
2392
|
></button>
|
|
2393
|
+
}
|
|
2384
2394
|
</span>
|
|
2385
2395
|
`,
|
|
2386
2396
|
standalone: true,
|
|
2387
|
-
imports: [
|
|
2397
|
+
imports: [ButtonComponent]
|
|
2388
2398
|
}]
|
|
2389
2399
|
}], ctorParameters: () => [{ type: UploadService }, { type: i1$1.LocalizationService }, { type: NavigationService }], propDecorators: { file: [{
|
|
2390
2400
|
type: Input
|
|
@@ -2445,52 +2455,55 @@ class FileListMultipleItemsComponent extends FileListItemBase {
|
|
|
2445
2455
|
return this.files[0].state === FileState.Failed;
|
|
2446
2456
|
}
|
|
2447
2457
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileListMultipleItemsComponent, deps: [{ token: i1$1.LocalizationService }, { token: UploadService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2448
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2458
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FileListMultipleItemsComponent, isStandalone: true, selector: "kendo-upload-file-list-multiple-items", inputs: { disabled: "disabled", files: "files", fileInfoTemplate: "fileInfoTemplate" }, usesInheritance: true, ngImport: i0, template: `
|
|
2449
2459
|
<kendo-progressbar
|
|
2450
|
-
|
|
2451
|
-
|
|
2452
|
-
|
|
2453
|
-
|
|
2460
|
+
[@progressState]="showProgress"
|
|
2461
|
+
[value]="progressComplete"
|
|
2462
|
+
[label]="{ visible: false }"
|
|
2463
|
+
>
|
|
2454
2464
|
</kendo-progressbar>
|
|
2455
2465
|
<span class="k-file-icon-wrapper">
|
|
2456
|
-
|
|
2457
|
-
|
|
2458
|
-
|
|
2459
|
-
|
|
2460
|
-
|
|
2466
|
+
<kendo-icon-wrapper
|
|
2467
|
+
name="copy"
|
|
2468
|
+
size="xxlarge"
|
|
2469
|
+
[svgIcon]="copySVGIcon"
|
|
2470
|
+
innerCssClass="k-file-icon"
|
|
2461
2471
|
>
|
|
2462
|
-
|
|
2472
|
+
</kendo-icon-wrapper>
|
|
2463
2473
|
</span>
|
|
2464
2474
|
<span class="k-multiple-files-wrapper">
|
|
2465
|
-
|
|
2466
|
-
|
|
2467
|
-
|
|
2468
|
-
|
|
2469
|
-
|
|
2475
|
+
@if (!fileInfoTemplate) {
|
|
2476
|
+
@for (file of files; track file) {
|
|
2477
|
+
<span class="k-file-info">
|
|
2478
|
+
<span [title]="file.name" class="k-file-name">
|
|
2479
|
+
{{file.name}}
|
|
2480
|
+
</span>
|
|
2470
2481
|
<span [attr.aria-live]="'polite'" [ngClass]="{
|
|
2471
2482
|
'k-file-validation-message': file.validationErrors,
|
|
2472
2483
|
'k-file-size': !file.validationErrors
|
|
2473
2484
|
}"
|
|
2474
|
-
|
|
2475
|
-
|
|
2476
|
-
|
|
2477
|
-
|
|
2478
|
-
</
|
|
2485
|
+
>{{fileStatusText(file)}}</span>
|
|
2486
|
+
</span>
|
|
2487
|
+
}
|
|
2488
|
+
<span class="k-file-summary"
|
|
2489
|
+
>{{batchStatusText}}</span>
|
|
2490
|
+
}
|
|
2491
|
+
@if (fileInfoTemplate) {
|
|
2479
2492
|
<ng-container
|
|
2480
|
-
|
|
2481
|
-
[ngTemplateOutlet]="fileInfoTemplate.templateRef"
|
|
2493
|
+
[ngTemplateOutlet]="fileInfoTemplate.templateRef"
|
|
2482
2494
|
[ngTemplateOutletContext]="{
|
|
2483
2495
|
templateRef: fileInfoTemplate.templateRef,
|
|
2484
2496
|
state: files[0].state,
|
|
2485
2497
|
$implicit: files
|
|
2486
2498
|
}"></ng-container>
|
|
2499
|
+
}
|
|
2487
2500
|
</span>
|
|
2488
2501
|
<kendo-upload-file-list-item-action-button
|
|
2489
|
-
|
|
2490
|
-
|
|
2491
|
-
|
|
2502
|
+
[file]='files[0]'
|
|
2503
|
+
[disabled]='disabled'
|
|
2504
|
+
[progress]='progressComplete'>
|
|
2492
2505
|
</kendo-upload-file-list-item-action-button>
|
|
2493
|
-
|
|
2506
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ProgressBarComponent, selector: "kendo-progressbar", inputs: ["label", "progressCssStyle", "progressCssClass", "emptyCssStyle", "emptyCssClass", "animation"], outputs: ["animationEnd"], exportAs: ["kendoProgressBar"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FileListItemActionButtonComponent, selector: "kendo-upload-file-list-item-action-button", inputs: ["file", "disabled", "progress"] }], animations: [
|
|
2494
2507
|
trigger('progressState', [
|
|
2495
2508
|
state('active', style({ opacity: 1 })),
|
|
2496
2509
|
state('inactive', style({ opacity: 0 })),
|
|
@@ -2515,52 +2528,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
2515
2528
|
selector: 'kendo-upload-file-list-multiple-items',
|
|
2516
2529
|
template: `
|
|
2517
2530
|
<kendo-progressbar
|
|
2518
|
-
|
|
2519
|
-
|
|
2520
|
-
|
|
2521
|
-
|
|
2531
|
+
[@progressState]="showProgress"
|
|
2532
|
+
[value]="progressComplete"
|
|
2533
|
+
[label]="{ visible: false }"
|
|
2534
|
+
>
|
|
2522
2535
|
</kendo-progressbar>
|
|
2523
2536
|
<span class="k-file-icon-wrapper">
|
|
2524
|
-
|
|
2525
|
-
|
|
2526
|
-
|
|
2527
|
-
|
|
2528
|
-
|
|
2537
|
+
<kendo-icon-wrapper
|
|
2538
|
+
name="copy"
|
|
2539
|
+
size="xxlarge"
|
|
2540
|
+
[svgIcon]="copySVGIcon"
|
|
2541
|
+
innerCssClass="k-file-icon"
|
|
2529
2542
|
>
|
|
2530
|
-
|
|
2543
|
+
</kendo-icon-wrapper>
|
|
2531
2544
|
</span>
|
|
2532
2545
|
<span class="k-multiple-files-wrapper">
|
|
2533
|
-
|
|
2534
|
-
|
|
2535
|
-
|
|
2536
|
-
|
|
2537
|
-
|
|
2546
|
+
@if (!fileInfoTemplate) {
|
|
2547
|
+
@for (file of files; track file) {
|
|
2548
|
+
<span class="k-file-info">
|
|
2549
|
+
<span [title]="file.name" class="k-file-name">
|
|
2550
|
+
{{file.name}}
|
|
2551
|
+
</span>
|
|
2538
2552
|
<span [attr.aria-live]="'polite'" [ngClass]="{
|
|
2539
2553
|
'k-file-validation-message': file.validationErrors,
|
|
2540
2554
|
'k-file-size': !file.validationErrors
|
|
2541
2555
|
}"
|
|
2542
|
-
|
|
2543
|
-
|
|
2544
|
-
|
|
2545
|
-
|
|
2546
|
-
</
|
|
2556
|
+
>{{fileStatusText(file)}}</span>
|
|
2557
|
+
</span>
|
|
2558
|
+
}
|
|
2559
|
+
<span class="k-file-summary"
|
|
2560
|
+
>{{batchStatusText}}</span>
|
|
2561
|
+
}
|
|
2562
|
+
@if (fileInfoTemplate) {
|
|
2547
2563
|
<ng-container
|
|
2548
|
-
|
|
2549
|
-
[ngTemplateOutlet]="fileInfoTemplate.templateRef"
|
|
2564
|
+
[ngTemplateOutlet]="fileInfoTemplate.templateRef"
|
|
2550
2565
|
[ngTemplateOutletContext]="{
|
|
2551
2566
|
templateRef: fileInfoTemplate.templateRef,
|
|
2552
2567
|
state: files[0].state,
|
|
2553
2568
|
$implicit: files
|
|
2554
2569
|
}"></ng-container>
|
|
2570
|
+
}
|
|
2555
2571
|
</span>
|
|
2556
2572
|
<kendo-upload-file-list-item-action-button
|
|
2557
|
-
|
|
2558
|
-
|
|
2559
|
-
|
|
2573
|
+
[file]='files[0]'
|
|
2574
|
+
[disabled]='disabled'
|
|
2575
|
+
[progress]='progressComplete'>
|
|
2560
2576
|
</kendo-upload-file-list-item-action-button>
|
|
2561
|
-
|
|
2577
|
+
`,
|
|
2562
2578
|
standalone: true,
|
|
2563
|
-
imports: [ProgressBarComponent, IconWrapperComponent,
|
|
2579
|
+
imports: [ProgressBarComponent, IconWrapperComponent, NgClass, NgTemplateOutlet, FileListItemActionButtonComponent]
|
|
2564
2580
|
}]
|
|
2565
2581
|
}], ctorParameters: () => [{ type: i1$1.LocalizationService }, { type: UploadService }], propDecorators: { disabled: [{
|
|
2566
2582
|
type: Input
|
|
@@ -2620,44 +2636,46 @@ class FileListSingleItemComponent extends FileListItemBase {
|
|
|
2620
2636
|
return !this.isUploadFailed && !this.isUploadSuccessful;
|
|
2621
2637
|
}
|
|
2622
2638
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileListSingleItemComponent, deps: [{ token: i1$1.LocalizationService }, { token: UploadService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2623
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2639
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FileListSingleItemComponent, isStandalone: true, selector: "kendo-upload-file-list-single-item", inputs: { disabled: "disabled", file: "file", fileInfoTemplate: "fileInfoTemplate" }, usesInheritance: true, ngImport: i0, template: `
|
|
2624
2640
|
<kendo-progressbar
|
|
2625
|
-
|
|
2626
|
-
|
|
2627
|
-
|
|
2628
|
-
|
|
2641
|
+
[@progressState]="showProgress"
|
|
2642
|
+
[value]="progressComplete"
|
|
2643
|
+
[label]="{ visible: false }"
|
|
2644
|
+
>
|
|
2629
2645
|
</kendo-progressbar>
|
|
2630
2646
|
<span class="k-file-icon-wrapper">
|
|
2631
|
-
|
|
2632
|
-
|
|
2633
|
-
|
|
2634
|
-
|
|
2635
|
-
|
|
2647
|
+
<kendo-icon-wrapper
|
|
2648
|
+
size="xxlarge"
|
|
2649
|
+
[name]="fileGroupClass"
|
|
2650
|
+
[svgIcon]="fileSVGGroupIcon"
|
|
2651
|
+
innerCssClass="k-file-icon"
|
|
2636
2652
|
>
|
|
2637
|
-
|
|
2653
|
+
</kendo-icon-wrapper>
|
|
2638
2654
|
</span>
|
|
2639
2655
|
<span class="k-file-info">
|
|
2640
|
-
|
|
2641
|
-
|
|
2656
|
+
@if (!fileInfoTemplate) {
|
|
2657
|
+
<span class="k-file-name" [title]="file.name">{{ file.name }}</span>
|
|
2642
2658
|
<span [attr.aria-live]="'polite'" [ngClass]="{
|
|
2643
2659
|
'k-file-validation-message': file.validationErrors,
|
|
2644
2660
|
'k-file-size': !file.validationErrors && isNotYetUploaded,
|
|
2645
2661
|
'k-file-summary': isUploadSuccessful || isUploadFailed
|
|
2646
2662
|
}"
|
|
2647
|
-
|
|
2648
|
-
|
|
2649
|
-
|
|
2663
|
+
>{{fileStatusText}}</span>
|
|
2664
|
+
}
|
|
2665
|
+
@if (fileInfoTemplate) {
|
|
2666
|
+
<ng-container [ngTemplateOutlet]="fileInfoTemplate.templateRef" [ngTemplateOutletContext]="{
|
|
2650
2667
|
templateRef: fileInfoTemplate.templateRef,
|
|
2651
2668
|
state: file.state,
|
|
2652
2669
|
$implicit: [file]
|
|
2653
2670
|
}"></ng-container>
|
|
2671
|
+
}
|
|
2654
2672
|
</span>
|
|
2655
2673
|
<kendo-upload-file-list-item-action-button
|
|
2656
|
-
|
|
2657
|
-
|
|
2658
|
-
|
|
2674
|
+
[file]='file'
|
|
2675
|
+
[disabled]='disabled'
|
|
2676
|
+
[progress]='progressComplete'>
|
|
2659
2677
|
</kendo-upload-file-list-item-action-button>
|
|
2660
|
-
|
|
2678
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ProgressBarComponent, selector: "kendo-progressbar", inputs: ["label", "progressCssStyle", "progressCssClass", "emptyCssStyle", "emptyCssClass", "animation"], outputs: ["animationEnd"], exportAs: ["kendoProgressBar"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FileListItemActionButtonComponent, selector: "kendo-upload-file-list-item-action-button", inputs: ["file", "disabled", "progress"] }], animations: [
|
|
2661
2679
|
trigger('progressState', [
|
|
2662
2680
|
state('active', style({ opacity: 1 })),
|
|
2663
2681
|
state('inactive', style({ opacity: 0 })),
|
|
@@ -2682,44 +2700,46 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
2682
2700
|
selector: 'kendo-upload-file-list-single-item',
|
|
2683
2701
|
template: `
|
|
2684
2702
|
<kendo-progressbar
|
|
2685
|
-
|
|
2686
|
-
|
|
2687
|
-
|
|
2688
|
-
|
|
2703
|
+
[@progressState]="showProgress"
|
|
2704
|
+
[value]="progressComplete"
|
|
2705
|
+
[label]="{ visible: false }"
|
|
2706
|
+
>
|
|
2689
2707
|
</kendo-progressbar>
|
|
2690
2708
|
<span class="k-file-icon-wrapper">
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
|
|
2694
|
-
|
|
2695
|
-
|
|
2709
|
+
<kendo-icon-wrapper
|
|
2710
|
+
size="xxlarge"
|
|
2711
|
+
[name]="fileGroupClass"
|
|
2712
|
+
[svgIcon]="fileSVGGroupIcon"
|
|
2713
|
+
innerCssClass="k-file-icon"
|
|
2696
2714
|
>
|
|
2697
|
-
|
|
2715
|
+
</kendo-icon-wrapper>
|
|
2698
2716
|
</span>
|
|
2699
2717
|
<span class="k-file-info">
|
|
2700
|
-
|
|
2701
|
-
|
|
2718
|
+
@if (!fileInfoTemplate) {
|
|
2719
|
+
<span class="k-file-name" [title]="file.name">{{ file.name }}</span>
|
|
2702
2720
|
<span [attr.aria-live]="'polite'" [ngClass]="{
|
|
2703
2721
|
'k-file-validation-message': file.validationErrors,
|
|
2704
2722
|
'k-file-size': !file.validationErrors && isNotYetUploaded,
|
|
2705
2723
|
'k-file-summary': isUploadSuccessful || isUploadFailed
|
|
2706
2724
|
}"
|
|
2707
|
-
|
|
2708
|
-
|
|
2709
|
-
|
|
2725
|
+
>{{fileStatusText}}</span>
|
|
2726
|
+
}
|
|
2727
|
+
@if (fileInfoTemplate) {
|
|
2728
|
+
<ng-container [ngTemplateOutlet]="fileInfoTemplate.templateRef" [ngTemplateOutletContext]="{
|
|
2710
2729
|
templateRef: fileInfoTemplate.templateRef,
|
|
2711
2730
|
state: file.state,
|
|
2712
2731
|
$implicit: [file]
|
|
2713
2732
|
}"></ng-container>
|
|
2733
|
+
}
|
|
2714
2734
|
</span>
|
|
2715
2735
|
<kendo-upload-file-list-item-action-button
|
|
2716
|
-
|
|
2717
|
-
|
|
2718
|
-
|
|
2736
|
+
[file]='file'
|
|
2737
|
+
[disabled]='disabled'
|
|
2738
|
+
[progress]='progressComplete'>
|
|
2719
2739
|
</kendo-upload-file-list-item-action-button>
|
|
2720
|
-
|
|
2740
|
+
`,
|
|
2721
2741
|
standalone: true,
|
|
2722
|
-
imports: [ProgressBarComponent, IconWrapperComponent,
|
|
2742
|
+
imports: [ProgressBarComponent, IconWrapperComponent, NgClass, NgTemplateOutlet, FileListItemActionButtonComponent]
|
|
2723
2743
|
}]
|
|
2724
2744
|
}], ctorParameters: () => [{ type: i1$1.LocalizationService }, { type: UploadService }], propDecorators: { disabled: [{
|
|
2725
2745
|
type: Input
|
|
@@ -2813,67 +2833,69 @@ class FileListComponent {
|
|
|
2813
2833
|
this.actionSubscription.unsubscribe();
|
|
2814
2834
|
}
|
|
2815
2835
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileListComponent, deps: [{ token: UploadService }, { token: NavigationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2816
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2817
|
-
|
|
2818
|
-
|
|
2819
|
-
|
|
2820
|
-
|
|
2821
|
-
|
|
2822
|
-
|
|
2823
|
-
|
|
2824
|
-
|
|
2825
|
-
|
|
2826
|
-
|
|
2827
|
-
|
|
2828
|
-
|
|
2829
|
-
|
|
2830
|
-
|
|
2831
|
-
|
|
2832
|
-
|
|
2833
|
-
|
|
2834
|
-
|
|
2835
|
-
|
|
2836
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FileListComponent, isStandalone: true, selector: "[kendo-upload-file-list]", inputs: { disabled: "disabled", fileList: "fileList", fileTemplate: "fileTemplate", fileInfoTemplate: "fileInfoTemplate" }, host: { properties: { "attr.role": "this.fileListRole" } }, viewQueries: [{ propertyName: "fileListItems", predicate: FileListItemDirective, descendants: true }], ngImport: i0, template: `
|
|
2837
|
+
@for (files of fileList; track files; let index = $index) {
|
|
2838
|
+
<li kendoUploadFileListItem [files]='files' [index]='index' role="listitem">
|
|
2839
|
+
@if (files.length === 1 && !fileTemplate) {
|
|
2840
|
+
<kendo-upload-file-list-single-item
|
|
2841
|
+
class='k-file-single'
|
|
2842
|
+
[disabled]='disabled'
|
|
2843
|
+
[file]='files[0]'
|
|
2844
|
+
[fileInfoTemplate]="fileInfoTemplate"></kendo-upload-file-list-single-item>
|
|
2845
|
+
}
|
|
2846
|
+
@if (files.length > 1 && !fileTemplate) {
|
|
2847
|
+
<kendo-upload-file-list-multiple-items
|
|
2848
|
+
class='k-file-multiple'
|
|
2849
|
+
[disabled]='disabled'
|
|
2850
|
+
[files]='files'
|
|
2851
|
+
[fileInfoTemplate]="fileInfoTemplate"></kendo-upload-file-list-multiple-items>
|
|
2852
|
+
}
|
|
2853
|
+
@if (fileTemplate) {
|
|
2854
|
+
<ng-container
|
|
2855
|
+
[ngTemplateOutlet]="fileTemplate.templateRef" [ngTemplateOutletContext]="{
|
|
2836
2856
|
templateRef: fileTemplate.templateRef,
|
|
2837
2857
|
state: files[0].state,
|
|
2838
2858
|
$implicit: files
|
|
2839
2859
|
}"></ng-container>
|
|
2840
|
-
|
|
2841
|
-
|
|
2842
|
-
|
|
2860
|
+
}
|
|
2861
|
+
</li>
|
|
2862
|
+
}
|
|
2863
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: FileListItemDirective, selector: "[kendoUploadFileListItem]", inputs: ["files", "index"] }, { kind: "component", type: FileListSingleItemComponent, selector: "kendo-upload-file-list-single-item", inputs: ["disabled", "file", "fileInfoTemplate"] }, { kind: "component", type: FileListMultipleItemsComponent, selector: "kendo-upload-file-list-multiple-items", inputs: ["disabled", "files", "fileInfoTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
2843
2864
|
}
|
|
2844
2865
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileListComponent, decorators: [{
|
|
2845
2866
|
type: Component,
|
|
2846
2867
|
args: [{
|
|
2847
2868
|
selector: '[kendo-upload-file-list]',
|
|
2848
2869
|
template: `
|
|
2849
|
-
|
|
2850
|
-
|
|
2851
|
-
|
|
2852
|
-
|
|
2853
|
-
|
|
2854
|
-
|
|
2855
|
-
|
|
2856
|
-
|
|
2857
|
-
|
|
2858
|
-
|
|
2859
|
-
|
|
2860
|
-
|
|
2861
|
-
|
|
2862
|
-
|
|
2863
|
-
|
|
2864
|
-
|
|
2865
|
-
|
|
2866
|
-
|
|
2867
|
-
|
|
2870
|
+
@for (files of fileList; track files; let index = $index) {
|
|
2871
|
+
<li kendoUploadFileListItem [files]='files' [index]='index' role="listitem">
|
|
2872
|
+
@if (files.length === 1 && !fileTemplate) {
|
|
2873
|
+
<kendo-upload-file-list-single-item
|
|
2874
|
+
class='k-file-single'
|
|
2875
|
+
[disabled]='disabled'
|
|
2876
|
+
[file]='files[0]'
|
|
2877
|
+
[fileInfoTemplate]="fileInfoTemplate"></kendo-upload-file-list-single-item>
|
|
2878
|
+
}
|
|
2879
|
+
@if (files.length > 1 && !fileTemplate) {
|
|
2880
|
+
<kendo-upload-file-list-multiple-items
|
|
2881
|
+
class='k-file-multiple'
|
|
2882
|
+
[disabled]='disabled'
|
|
2883
|
+
[files]='files'
|
|
2884
|
+
[fileInfoTemplate]="fileInfoTemplate"></kendo-upload-file-list-multiple-items>
|
|
2885
|
+
}
|
|
2886
|
+
@if (fileTemplate) {
|
|
2887
|
+
<ng-container
|
|
2888
|
+
[ngTemplateOutlet]="fileTemplate.templateRef" [ngTemplateOutletContext]="{
|
|
2868
2889
|
templateRef: fileTemplate.templateRef,
|
|
2869
2890
|
state: files[0].state,
|
|
2870
2891
|
$implicit: files
|
|
2871
2892
|
}"></ng-container>
|
|
2872
|
-
|
|
2873
|
-
|
|
2874
|
-
|
|
2893
|
+
}
|
|
2894
|
+
</li>
|
|
2895
|
+
}
|
|
2896
|
+
`,
|
|
2875
2897
|
standalone: true,
|
|
2876
|
-
imports: [
|
|
2898
|
+
imports: [FileListItemDirective, FileListSingleItemComponent, FileListMultipleItemsComponent, NgTemplateOutlet]
|
|
2877
2899
|
}]
|
|
2878
2900
|
}], ctorParameters: () => [{ type: UploadService }, { type: NavigationService }], propDecorators: { disabled: [{
|
|
2879
2901
|
type: Input
|
|
@@ -4015,7 +4037,7 @@ class UploadComponent extends UploadFileSelectBase {
|
|
|
4015
4037
|
}));
|
|
4016
4038
|
}
|
|
4017
4039
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: UploadComponent, deps: [{ token: UploadService }, { token: i1$1.LocalizationService }, { token: NavigationService }, { token: DropZoneService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
4018
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
4040
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: UploadComponent, isStandalone: true, selector: "kendo-upload", inputs: { autoUpload: "autoUpload", batch: "batch", withCredentials: "withCredentials", saveField: "saveField", saveHeaders: "saveHeaders", saveMethod: "saveMethod", saveUrl: "saveUrl", responseType: "responseType", removeField: "removeField", removeHeaders: "removeHeaders", removeMethod: "removeMethod", removeUrl: "removeUrl", chunkable: "chunkable", concurrent: "concurrent", showFileList: "showFileList", tabIndex: "tabIndex", actionsLayout: "actionsLayout" }, outputs: { cancel: "cancel", clear: "clear", complete: "complete", error: "error", pause: "pause", resume: "resume", success: "success", upload: "upload", uploadProgress: "uploadProgress", valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.dir" } }, providers: [
|
|
4019
4041
|
LocalizationService,
|
|
4020
4042
|
NavigationService,
|
|
4021
4043
|
UploadService,
|
|
@@ -4031,116 +4053,121 @@ class UploadComponent extends UploadFileSelectBase {
|
|
|
4031
4053
|
}
|
|
4032
4054
|
], viewQueries: [{ propertyName: "fileSelectInput", first: true, predicate: ["fileSelectInput"], descendants: true, static: true }], exportAs: ["kendoUpload"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
|
|
4033
4055
|
<ng-container kendoUploadLocalizedMessages
|
|
4034
|
-
|
|
4035
|
-
|
|
4036
|
-
|
|
4037
|
-
|
|
4038
|
-
|
|
4039
|
-
|
|
4040
|
-
|
|
4041
|
-
|
|
4042
|
-
|
|
4043
|
-
|
|
4044
|
-
|
|
4045
|
-
|
|
4046
|
-
|
|
4047
|
-
|
|
4048
|
-
|
|
4049
|
-
|
|
4050
|
-
|
|
4051
|
-
|
|
4052
|
-
|
|
4053
|
-
|
|
4054
|
-
|
|
4055
|
-
|
|
4056
|
-
|
|
4057
|
-
|
|
4058
|
-
|
|
4059
|
-
|
|
4060
|
-
|
|
4061
|
-
|
|
4062
|
-
|
|
4063
|
-
|
|
4064
|
-
|
|
4065
|
-
|
|
4066
|
-
|
|
4067
|
-
|
|
4068
|
-
|
|
4069
|
-
|
|
4070
|
-
|
|
4071
|
-
|
|
4072
|
-
|
|
4073
|
-
|
|
4074
|
-
|
|
4075
|
-
|
|
4076
|
-
|
|
4077
|
-
|
|
4078
|
-
|
|
4079
|
-
|
|
4080
|
-
|
|
4081
|
-
|
|
4082
|
-
|
|
4083
|
-
|
|
4084
|
-
|
|
4085
|
-
|
|
4086
|
-
|
|
4087
|
-
|
|
4088
|
-
|
|
4089
|
-
|
|
4090
|
-
|
|
4091
|
-
|
|
4092
|
-
|
|
4093
|
-
|
|
4056
|
+
i18n-cancel="kendo.upload.cancel|The text for the Cancel button"
|
|
4057
|
+
cancel="Cancel"
|
|
4058
|
+
|
|
4059
|
+
i18n-clearSelectedFiles="kendo.upload.clearSelectedFiles|The text for the Clear button"
|
|
4060
|
+
clearSelectedFiles="Clear"
|
|
4061
|
+
|
|
4062
|
+
i18n-dropFilesHere="kendo.upload.dropFilesHere|The drop zone hint"
|
|
4063
|
+
dropFilesHere="Drop files here to upload"
|
|
4064
|
+
|
|
4065
|
+
i18n-filesBatchStatus="kendo.upload.filesBatchStatus|The status message for a batch of files"
|
|
4066
|
+
filesBatchStatus="files"
|
|
4067
|
+
|
|
4068
|
+
i18n-filesBatchStatusFailed="kendo.upload.filesBatchStatusFailed|The status message for a batch of files after failed upload"
|
|
4069
|
+
filesBatchStatusFailed="files failed to upload."
|
|
4070
|
+
|
|
4071
|
+
i18n-filesBatchStatusUploaded="kendo.upload.filesBatchStatusUploaded|The status message for a batch of files after successful upload"
|
|
4072
|
+
filesBatchStatusUploaded="files successfully uploaded."
|
|
4073
|
+
|
|
4074
|
+
i18n-fileStatusFailed="kendo.upload.fileStatusFailed|The file status message after failed upload"
|
|
4075
|
+
fileStatusFailed="File failed to upload."
|
|
4076
|
+
|
|
4077
|
+
i18n-fileStatusUploaded="kendo.upload.fileStatusUploaded|The file status message after successful upload"
|
|
4078
|
+
fileStatusUploaded="File successfully uploaded."
|
|
4079
|
+
|
|
4080
|
+
i18n-headerStatusPaused="kendo.upload.headerStatusPaused|The header status message when the file upload is paused"
|
|
4081
|
+
headerStatusPaused="Paused"
|
|
4082
|
+
|
|
4083
|
+
i18n-headerStatusUploaded="kendo.upload.headerStatusUploaded|The header status message after file upload completion"
|
|
4084
|
+
headerStatusUploaded="Done"
|
|
4085
|
+
|
|
4086
|
+
i18n-headerStatusUploading="kendo.upload.headerStatusUploading|The header status message during file upload"
|
|
4087
|
+
headerStatusUploading="Uploading..."
|
|
4088
|
+
|
|
4089
|
+
i18n-invalidFileExtension="kendo.upload.invalidFileExtension|The text for the invalid allowed extensions restriction message"
|
|
4090
|
+
invalidFileExtension="File type not allowed."
|
|
4091
|
+
|
|
4092
|
+
i18n-invalidMaxFileSize="kendo.upload.invalidMaxFileSize|The text for the invalid max file size restriction message"
|
|
4093
|
+
invalidMaxFileSize="File size too large."
|
|
4094
|
+
|
|
4095
|
+
i18n-invalidMinFileSize="kendo.upload.invalidMinFileSize|The text for the invalid min file size restriction message"
|
|
4096
|
+
invalidMinFileSize="File size too small."
|
|
4097
|
+
|
|
4098
|
+
i18n-pause="kendo.upload.pause|The text for the Pause button"
|
|
4099
|
+
pause="Pause"
|
|
4100
|
+
|
|
4101
|
+
i18n-remove="kendo.upload.remove|The text for the Remove button"
|
|
4102
|
+
remove="Remove"
|
|
4103
|
+
|
|
4104
|
+
i18n-resume="kendo.upload.resume|The text for the Resume button"
|
|
4105
|
+
resume="Resume"
|
|
4106
|
+
|
|
4107
|
+
i18n-retry="kendo.upload.retry|The text for the Retry button"
|
|
4108
|
+
retry="Retry"
|
|
4109
|
+
|
|
4110
|
+
i18n-select="kendo.upload.select|The text for the Select button"
|
|
4111
|
+
select="Select files..."
|
|
4112
|
+
|
|
4113
|
+
i18n-uploadSelectedFiles="kendo.upload.uploadSelectedFiles|The text for the Upload files button"
|
|
4114
|
+
uploadSelectedFiles="Upload"
|
|
4115
|
+
>
|
|
4094
4116
|
</ng-container>
|
|
4095
4117
|
<div kendoUploadInternalDropZone
|
|
4096
|
-
|
|
4097
|
-
|
|
4098
|
-
|
|
4099
|
-
|
|
4100
|
-
|
|
4101
|
-
|
|
4102
|
-
|
|
4103
|
-
|
|
4104
|
-
|
|
4105
|
-
|
|
4106
|
-
|
|
4107
|
-
|
|
4108
|
-
|
|
4109
|
-
|
|
4110
|
-
|
|
4111
|
-
|
|
4112
|
-
|
|
4113
|
-
|
|
4114
|
-
|
|
4115
|
-
|
|
4116
|
-
|
|
4117
|
-
|
|
4118
|
-
|
|
4119
|
-
|
|
4120
|
-
|
|
4121
|
-
|
|
4122
|
-
|
|
4123
|
-
|
|
4124
|
-
|
|
4125
|
-
|
|
4126
|
-
|
|
4118
|
+
[restrictions]="restrictions"
|
|
4119
|
+
[multiple]="multiple"
|
|
4120
|
+
[disabled]="disabled"
|
|
4121
|
+
>
|
|
4122
|
+
<div class="k-upload-button-wrap">
|
|
4123
|
+
<button
|
|
4124
|
+
kendoButton
|
|
4125
|
+
#fileSelectButton
|
|
4126
|
+
class="k-upload-button"
|
|
4127
|
+
type="button"
|
|
4128
|
+
(click)="fileSelectInput.click()"
|
|
4129
|
+
(focus)="onFileSelectButtonFocus()"
|
|
4130
|
+
[id]="focusableId"
|
|
4131
|
+
[attr.aria-label]="textFor('select')"
|
|
4132
|
+
[attr.tabindex]="tabindex"
|
|
4133
|
+
[attr.aria-expanded]="hasFileList"
|
|
4134
|
+
[attr.aria-controls]="hasFileList ? fileListId : undefined"
|
|
4135
|
+
>
|
|
4136
|
+
{{textFor('select')}}
|
|
4137
|
+
</button>
|
|
4138
|
+
<input kendoFileSelect #fileSelectInput
|
|
4139
|
+
[dir]="direction"
|
|
4140
|
+
[accept]="accept"
|
|
4141
|
+
[restrictions]="restrictions"
|
|
4142
|
+
[multiple]="multiple"
|
|
4143
|
+
[disabled]="disabled"
|
|
4144
|
+
[required]="isControlRequired" />
|
|
4145
|
+
</div>
|
|
4146
|
+
@if (showTotalStatus) {
|
|
4147
|
+
<kendo-upload-status-total
|
|
4148
|
+
class="k-upload-status"
|
|
4149
|
+
[fileList]="fileList">
|
|
4127
4150
|
</kendo-upload-status-total>
|
|
4128
|
-
|
|
4151
|
+
}
|
|
4152
|
+
<div class="k-dropzone-hint">{{textFor('dropFilesHere')}}</div>
|
|
4129
4153
|
</div>
|
|
4130
|
-
|
|
4154
|
+
@if (hasFileList) {
|
|
4155
|
+
<ul kendo-upload-file-list
|
|
4131
4156
|
class="k-upload-files k-reset"
|
|
4132
4157
|
[disabled]="disabled"
|
|
4133
4158
|
[fileList]="fileList.files"
|
|
4134
4159
|
[fileTemplate]="fileTemplate"
|
|
4135
4160
|
[fileInfoTemplate]="fileInfoTemplate"
|
|
4136
4161
|
[id]="fileListId">
|
|
4137
|
-
|
|
4138
|
-
|
|
4139
|
-
|
|
4162
|
+
</ul>
|
|
4163
|
+
}
|
|
4164
|
+
@if (showActionButtons) {
|
|
4165
|
+
<kendo-upload-action-buttons
|
|
4140
4166
|
[disabled]="disabled"
|
|
4141
4167
|
[actionsLayout]="actionsLayout">
|
|
4142
|
-
|
|
4143
|
-
|
|
4168
|
+
</kendo-upload-action-buttons>
|
|
4169
|
+
}
|
|
4170
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoUploadLocalizedMessages],\n [kendoFileSelectLocalizedMessages],\n [kendoUploadDropZoneLocalizedMessages]\n " }, { kind: "directive", type: DropZoneInternalDirective, selector: "\n [kendoUploadInternalDropZone],\n [kendoFileSelectInternalDropZone]\n ", inputs: ["disabled", "multiple", "restrictions"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: FileSelectDirective, selector: "[kendoFileSelect]", inputs: ["dir", "disabled", "multiple", "restrictions", "accept", "required"] }, { kind: "component", type: UploadStatusTotalComponent, selector: "kendo-upload-status-total", inputs: ["fileList"] }, { kind: "component", type: FileListComponent, selector: "[kendo-upload-file-list]", inputs: ["disabled", "fileList", "fileTemplate", "fileInfoTemplate"] }, { kind: "component", type: UploadActionButtonsComponent, selector: "kendo-upload-action-buttons", inputs: ["disabled", "actionsLayout"] }] });
|
|
4144
4171
|
}
|
|
4145
4172
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: UploadComponent, decorators: [{
|
|
4146
4173
|
type: Component,
|
|
@@ -4164,118 +4191,123 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
4164
4191
|
selector: 'kendo-upload',
|
|
4165
4192
|
template: `
|
|
4166
4193
|
<ng-container kendoUploadLocalizedMessages
|
|
4167
|
-
|
|
4168
|
-
|
|
4169
|
-
|
|
4170
|
-
|
|
4171
|
-
|
|
4172
|
-
|
|
4173
|
-
|
|
4174
|
-
|
|
4175
|
-
|
|
4176
|
-
|
|
4177
|
-
|
|
4178
|
-
|
|
4179
|
-
|
|
4180
|
-
|
|
4181
|
-
|
|
4182
|
-
|
|
4183
|
-
|
|
4184
|
-
|
|
4185
|
-
|
|
4186
|
-
|
|
4187
|
-
|
|
4188
|
-
|
|
4189
|
-
|
|
4190
|
-
|
|
4191
|
-
|
|
4192
|
-
|
|
4193
|
-
|
|
4194
|
-
|
|
4195
|
-
|
|
4196
|
-
|
|
4197
|
-
|
|
4198
|
-
|
|
4199
|
-
|
|
4200
|
-
|
|
4201
|
-
|
|
4202
|
-
|
|
4203
|
-
|
|
4204
|
-
|
|
4205
|
-
|
|
4206
|
-
|
|
4207
|
-
|
|
4208
|
-
|
|
4209
|
-
|
|
4210
|
-
|
|
4211
|
-
|
|
4212
|
-
|
|
4213
|
-
|
|
4214
|
-
|
|
4215
|
-
|
|
4216
|
-
|
|
4217
|
-
|
|
4218
|
-
|
|
4219
|
-
|
|
4220
|
-
|
|
4221
|
-
|
|
4222
|
-
|
|
4223
|
-
|
|
4224
|
-
|
|
4225
|
-
|
|
4226
|
-
|
|
4194
|
+
i18n-cancel="kendo.upload.cancel|The text for the Cancel button"
|
|
4195
|
+
cancel="Cancel"
|
|
4196
|
+
|
|
4197
|
+
i18n-clearSelectedFiles="kendo.upload.clearSelectedFiles|The text for the Clear button"
|
|
4198
|
+
clearSelectedFiles="Clear"
|
|
4199
|
+
|
|
4200
|
+
i18n-dropFilesHere="kendo.upload.dropFilesHere|The drop zone hint"
|
|
4201
|
+
dropFilesHere="Drop files here to upload"
|
|
4202
|
+
|
|
4203
|
+
i18n-filesBatchStatus="kendo.upload.filesBatchStatus|The status message for a batch of files"
|
|
4204
|
+
filesBatchStatus="files"
|
|
4205
|
+
|
|
4206
|
+
i18n-filesBatchStatusFailed="kendo.upload.filesBatchStatusFailed|The status message for a batch of files after failed upload"
|
|
4207
|
+
filesBatchStatusFailed="files failed to upload."
|
|
4208
|
+
|
|
4209
|
+
i18n-filesBatchStatusUploaded="kendo.upload.filesBatchStatusUploaded|The status message for a batch of files after successful upload"
|
|
4210
|
+
filesBatchStatusUploaded="files successfully uploaded."
|
|
4211
|
+
|
|
4212
|
+
i18n-fileStatusFailed="kendo.upload.fileStatusFailed|The file status message after failed upload"
|
|
4213
|
+
fileStatusFailed="File failed to upload."
|
|
4214
|
+
|
|
4215
|
+
i18n-fileStatusUploaded="kendo.upload.fileStatusUploaded|The file status message after successful upload"
|
|
4216
|
+
fileStatusUploaded="File successfully uploaded."
|
|
4217
|
+
|
|
4218
|
+
i18n-headerStatusPaused="kendo.upload.headerStatusPaused|The header status message when the file upload is paused"
|
|
4219
|
+
headerStatusPaused="Paused"
|
|
4220
|
+
|
|
4221
|
+
i18n-headerStatusUploaded="kendo.upload.headerStatusUploaded|The header status message after file upload completion"
|
|
4222
|
+
headerStatusUploaded="Done"
|
|
4223
|
+
|
|
4224
|
+
i18n-headerStatusUploading="kendo.upload.headerStatusUploading|The header status message during file upload"
|
|
4225
|
+
headerStatusUploading="Uploading..."
|
|
4226
|
+
|
|
4227
|
+
i18n-invalidFileExtension="kendo.upload.invalidFileExtension|The text for the invalid allowed extensions restriction message"
|
|
4228
|
+
invalidFileExtension="File type not allowed."
|
|
4229
|
+
|
|
4230
|
+
i18n-invalidMaxFileSize="kendo.upload.invalidMaxFileSize|The text for the invalid max file size restriction message"
|
|
4231
|
+
invalidMaxFileSize="File size too large."
|
|
4232
|
+
|
|
4233
|
+
i18n-invalidMinFileSize="kendo.upload.invalidMinFileSize|The text for the invalid min file size restriction message"
|
|
4234
|
+
invalidMinFileSize="File size too small."
|
|
4235
|
+
|
|
4236
|
+
i18n-pause="kendo.upload.pause|The text for the Pause button"
|
|
4237
|
+
pause="Pause"
|
|
4238
|
+
|
|
4239
|
+
i18n-remove="kendo.upload.remove|The text for the Remove button"
|
|
4240
|
+
remove="Remove"
|
|
4241
|
+
|
|
4242
|
+
i18n-resume="kendo.upload.resume|The text for the Resume button"
|
|
4243
|
+
resume="Resume"
|
|
4244
|
+
|
|
4245
|
+
i18n-retry="kendo.upload.retry|The text for the Retry button"
|
|
4246
|
+
retry="Retry"
|
|
4247
|
+
|
|
4248
|
+
i18n-select="kendo.upload.select|The text for the Select button"
|
|
4249
|
+
select="Select files..."
|
|
4250
|
+
|
|
4251
|
+
i18n-uploadSelectedFiles="kendo.upload.uploadSelectedFiles|The text for the Upload files button"
|
|
4252
|
+
uploadSelectedFiles="Upload"
|
|
4253
|
+
>
|
|
4227
4254
|
</ng-container>
|
|
4228
4255
|
<div kendoUploadInternalDropZone
|
|
4229
|
-
|
|
4230
|
-
|
|
4231
|
-
|
|
4232
|
-
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4241
|
-
|
|
4242
|
-
|
|
4243
|
-
|
|
4244
|
-
|
|
4245
|
-
|
|
4246
|
-
|
|
4247
|
-
|
|
4248
|
-
|
|
4249
|
-
|
|
4250
|
-
|
|
4251
|
-
|
|
4252
|
-
|
|
4253
|
-
|
|
4254
|
-
|
|
4255
|
-
|
|
4256
|
-
|
|
4257
|
-
|
|
4258
|
-
|
|
4259
|
-
|
|
4256
|
+
[restrictions]="restrictions"
|
|
4257
|
+
[multiple]="multiple"
|
|
4258
|
+
[disabled]="disabled"
|
|
4259
|
+
>
|
|
4260
|
+
<div class="k-upload-button-wrap">
|
|
4261
|
+
<button
|
|
4262
|
+
kendoButton
|
|
4263
|
+
#fileSelectButton
|
|
4264
|
+
class="k-upload-button"
|
|
4265
|
+
type="button"
|
|
4266
|
+
(click)="fileSelectInput.click()"
|
|
4267
|
+
(focus)="onFileSelectButtonFocus()"
|
|
4268
|
+
[id]="focusableId"
|
|
4269
|
+
[attr.aria-label]="textFor('select')"
|
|
4270
|
+
[attr.tabindex]="tabindex"
|
|
4271
|
+
[attr.aria-expanded]="hasFileList"
|
|
4272
|
+
[attr.aria-controls]="hasFileList ? fileListId : undefined"
|
|
4273
|
+
>
|
|
4274
|
+
{{textFor('select')}}
|
|
4275
|
+
</button>
|
|
4276
|
+
<input kendoFileSelect #fileSelectInput
|
|
4277
|
+
[dir]="direction"
|
|
4278
|
+
[accept]="accept"
|
|
4279
|
+
[restrictions]="restrictions"
|
|
4280
|
+
[multiple]="multiple"
|
|
4281
|
+
[disabled]="disabled"
|
|
4282
|
+
[required]="isControlRequired" />
|
|
4283
|
+
</div>
|
|
4284
|
+
@if (showTotalStatus) {
|
|
4285
|
+
<kendo-upload-status-total
|
|
4286
|
+
class="k-upload-status"
|
|
4287
|
+
[fileList]="fileList">
|
|
4260
4288
|
</kendo-upload-status-total>
|
|
4261
|
-
|
|
4289
|
+
}
|
|
4290
|
+
<div class="k-dropzone-hint">{{textFor('dropFilesHere')}}</div>
|
|
4262
4291
|
</div>
|
|
4263
|
-
|
|
4292
|
+
@if (hasFileList) {
|
|
4293
|
+
<ul kendo-upload-file-list
|
|
4264
4294
|
class="k-upload-files k-reset"
|
|
4265
4295
|
[disabled]="disabled"
|
|
4266
4296
|
[fileList]="fileList.files"
|
|
4267
4297
|
[fileTemplate]="fileTemplate"
|
|
4268
4298
|
[fileInfoTemplate]="fileInfoTemplate"
|
|
4269
4299
|
[id]="fileListId">
|
|
4270
|
-
|
|
4271
|
-
|
|
4272
|
-
|
|
4300
|
+
</ul>
|
|
4301
|
+
}
|
|
4302
|
+
@if (showActionButtons) {
|
|
4303
|
+
<kendo-upload-action-buttons
|
|
4273
4304
|
[disabled]="disabled"
|
|
4274
4305
|
[actionsLayout]="actionsLayout">
|
|
4275
|
-
|
|
4306
|
+
</kendo-upload-action-buttons>
|
|
4307
|
+
}
|
|
4276
4308
|
`,
|
|
4277
4309
|
standalone: true,
|
|
4278
|
-
imports: [LocalizedMessagesDirective, DropZoneInternalDirective, ButtonComponent, FileSelectDirective,
|
|
4310
|
+
imports: [LocalizedMessagesDirective, DropZoneInternalDirective, ButtonComponent, FileSelectDirective, UploadStatusTotalComponent, FileListComponent, UploadActionButtonsComponent]
|
|
4279
4311
|
}]
|
|
4280
4312
|
}], ctorParameters: () => [{ type: UploadService }, { type: i1$1.LocalizationService }, { type: NavigationService }, { type: DropZoneService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.Injector }], propDecorators: { autoUpload: [{
|
|
4281
4313
|
type: Input
|
|
@@ -4845,7 +4877,7 @@ class FileSelectComponent extends UploadFileSelectBase {
|
|
|
4845
4877
|
this.uploadService.component = 'FileSelect';
|
|
4846
4878
|
}
|
|
4847
4879
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileSelectComponent, deps: [{ token: UploadService }, { token: i1$1.LocalizationService }, { token: NavigationService }, { token: DropZoneService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
4848
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
4880
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FileSelectComponent, isStandalone: true, selector: "kendo-fileselect", inputs: { name: "name" }, outputs: { valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.dir" } }, providers: [
|
|
4849
4881
|
LocalizationService,
|
|
4850
4882
|
NavigationService,
|
|
4851
4883
|
UploadService,
|
|
@@ -4861,67 +4893,68 @@ class FileSelectComponent extends UploadFileSelectBase {
|
|
|
4861
4893
|
}
|
|
4862
4894
|
], viewQueries: [{ propertyName: "fileSelectInput", first: true, predicate: ["fileSelectInput"], descendants: true, static: true }], exportAs: ["kendoFileSelect"], usesInheritance: true, ngImport: i0, template: `
|
|
4863
4895
|
<ng-container kendoFileSelectLocalizedMessages
|
|
4864
|
-
|
|
4865
|
-
|
|
4866
|
-
|
|
4867
|
-
|
|
4868
|
-
|
|
4869
|
-
|
|
4870
|
-
|
|
4871
|
-
|
|
4872
|
-
|
|
4873
|
-
|
|
4874
|
-
|
|
4875
|
-
|
|
4876
|
-
|
|
4877
|
-
|
|
4878
|
-
|
|
4879
|
-
|
|
4880
|
-
|
|
4881
|
-
|
|
4896
|
+
i18n-dropFilesHere="kendo.fileselect.dropFilesHere|The drop zone hint"
|
|
4897
|
+
dropFilesHere="Drop files here to select"
|
|
4898
|
+
|
|
4899
|
+
i18n-invalidFileExtension="kendo.fileselect.invalidFileExtension|The text for the invalid allowed extensions restriction message"
|
|
4900
|
+
invalidFileExtension="File type not allowed."
|
|
4901
|
+
|
|
4902
|
+
i18n-invalidMaxFileSize="kendo.fileselect.invalidMaxFileSize|The text for the invalid max file size restriction message"
|
|
4903
|
+
invalidMaxFileSize="File size too large."
|
|
4904
|
+
|
|
4905
|
+
i18n-invalidMinFileSize="kendo.fileselect.invalidMinFileSize|The text for the invalid min file size restriction message"
|
|
4906
|
+
invalidMinFileSize="File size too small."
|
|
4907
|
+
|
|
4908
|
+
i18n-remove="kendo.fileselect.remove|The text for the Remove button"
|
|
4909
|
+
remove="Remove"
|
|
4910
|
+
|
|
4911
|
+
i18n-select="kendo.fileselect.select|The text for the Select button"
|
|
4912
|
+
select="Select files..."
|
|
4913
|
+
>
|
|
4882
4914
|
</ng-container>
|
|
4883
4915
|
<div kendoFileSelectInternalDropZone
|
|
4884
|
-
|
|
4885
|
-
|
|
4886
|
-
|
|
4887
|
-
|
|
4916
|
+
[restrictions]="restrictions"
|
|
4917
|
+
[multiple]="multiple"
|
|
4918
|
+
[disabled]="disabled">
|
|
4919
|
+
<div class="k-upload-button-wrap">
|
|
4888
4920
|
<button
|
|
4889
|
-
|
|
4890
|
-
|
|
4891
|
-
|
|
4892
|
-
|
|
4893
|
-
|
|
4894
|
-
|
|
4895
|
-
|
|
4896
|
-
|
|
4897
|
-
|
|
4898
|
-
|
|
4899
|
-
|
|
4900
|
-
|
|
4901
|
-
|
|
4902
|
-
|
|
4921
|
+
kendoButton
|
|
4922
|
+
#fileSelectButton
|
|
4923
|
+
class="k-upload-button"
|
|
4924
|
+
type="button"
|
|
4925
|
+
role="button"
|
|
4926
|
+
(click)="fileSelectInput.click()"
|
|
4927
|
+
(focus)="onFileSelectButtonFocus()"
|
|
4928
|
+
[id]="focusableId"
|
|
4929
|
+
[attr.aria-label]="textFor('select')"
|
|
4930
|
+
[attr.tabindex]="tabindex"
|
|
4931
|
+
[attr.aria-expanded]="hasFileList"
|
|
4932
|
+
[attr.aria-controls]="hasFileList ? fileListId : undefined"
|
|
4933
|
+
>
|
|
4934
|
+
{{textFor('select')}}
|
|
4903
4935
|
</button>
|
|
4904
4936
|
<input kendoFileSelect #fileSelectInput
|
|
4905
|
-
|
|
4906
|
-
|
|
4907
|
-
|
|
4908
|
-
|
|
4909
|
-
|
|
4910
|
-
|
|
4911
|
-
|
|
4912
|
-
|
|
4913
|
-
|
|
4937
|
+
[dir]="direction"
|
|
4938
|
+
[accept]="accept"
|
|
4939
|
+
[restrictions]="restrictions"
|
|
4940
|
+
[multiple]="multiple"
|
|
4941
|
+
[disabled]="disabled"
|
|
4942
|
+
[required]="isControlRequired"
|
|
4943
|
+
/>
|
|
4944
|
+
</div>
|
|
4945
|
+
<div class="k-dropzone-hint">{{textFor('dropFilesHere')}}</div>
|
|
4914
4946
|
</div>
|
|
4915
|
-
|
|
4947
|
+
@if (hasFileList) {
|
|
4948
|
+
<ul kendo-upload-file-list
|
|
4916
4949
|
class="k-upload-files k-reset"
|
|
4917
|
-
*ngIf="hasFileList"
|
|
4918
4950
|
[disabled]="disabled"
|
|
4919
4951
|
[fileList]="fileList.files"
|
|
4920
4952
|
[fileTemplate]="fileTemplate"
|
|
4921
4953
|
[fileInfoTemplate]="fileInfoTemplate"
|
|
4922
4954
|
[id]="fileListId">
|
|
4923
|
-
|
|
4924
|
-
|
|
4955
|
+
</ul>
|
|
4956
|
+
}
|
|
4957
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoUploadLocalizedMessages],\n [kendoFileSelectLocalizedMessages],\n [kendoUploadDropZoneLocalizedMessages]\n " }, { kind: "directive", type: DropZoneInternalDirective, selector: "\n [kendoUploadInternalDropZone],\n [kendoFileSelectInternalDropZone]\n ", inputs: ["disabled", "multiple", "restrictions"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: FileSelectDirective, selector: "[kendoFileSelect]", inputs: ["dir", "disabled", "multiple", "restrictions", "accept", "required"] }, { kind: "component", type: FileListComponent, selector: "[kendo-upload-file-list]", inputs: ["disabled", "fileList", "fileTemplate", "fileInfoTemplate"] }] });
|
|
4925
4958
|
}
|
|
4926
4959
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FileSelectComponent, decorators: [{
|
|
4927
4960
|
type: Component,
|
|
@@ -4945,69 +4978,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
4945
4978
|
selector: 'kendo-fileselect',
|
|
4946
4979
|
template: `
|
|
4947
4980
|
<ng-container kendoFileSelectLocalizedMessages
|
|
4948
|
-
|
|
4949
|
-
|
|
4950
|
-
|
|
4951
|
-
|
|
4952
|
-
|
|
4953
|
-
|
|
4954
|
-
|
|
4955
|
-
|
|
4956
|
-
|
|
4957
|
-
|
|
4958
|
-
|
|
4959
|
-
|
|
4960
|
-
|
|
4961
|
-
|
|
4962
|
-
|
|
4963
|
-
|
|
4964
|
-
|
|
4965
|
-
|
|
4981
|
+
i18n-dropFilesHere="kendo.fileselect.dropFilesHere|The drop zone hint"
|
|
4982
|
+
dropFilesHere="Drop files here to select"
|
|
4983
|
+
|
|
4984
|
+
i18n-invalidFileExtension="kendo.fileselect.invalidFileExtension|The text for the invalid allowed extensions restriction message"
|
|
4985
|
+
invalidFileExtension="File type not allowed."
|
|
4986
|
+
|
|
4987
|
+
i18n-invalidMaxFileSize="kendo.fileselect.invalidMaxFileSize|The text for the invalid max file size restriction message"
|
|
4988
|
+
invalidMaxFileSize="File size too large."
|
|
4989
|
+
|
|
4990
|
+
i18n-invalidMinFileSize="kendo.fileselect.invalidMinFileSize|The text for the invalid min file size restriction message"
|
|
4991
|
+
invalidMinFileSize="File size too small."
|
|
4992
|
+
|
|
4993
|
+
i18n-remove="kendo.fileselect.remove|The text for the Remove button"
|
|
4994
|
+
remove="Remove"
|
|
4995
|
+
|
|
4996
|
+
i18n-select="kendo.fileselect.select|The text for the Select button"
|
|
4997
|
+
select="Select files..."
|
|
4998
|
+
>
|
|
4966
4999
|
</ng-container>
|
|
4967
5000
|
<div kendoFileSelectInternalDropZone
|
|
4968
|
-
|
|
4969
|
-
|
|
4970
|
-
|
|
4971
|
-
|
|
5001
|
+
[restrictions]="restrictions"
|
|
5002
|
+
[multiple]="multiple"
|
|
5003
|
+
[disabled]="disabled">
|
|
5004
|
+
<div class="k-upload-button-wrap">
|
|
4972
5005
|
<button
|
|
4973
|
-
|
|
4974
|
-
|
|
4975
|
-
|
|
4976
|
-
|
|
4977
|
-
|
|
4978
|
-
|
|
4979
|
-
|
|
4980
|
-
|
|
4981
|
-
|
|
4982
|
-
|
|
4983
|
-
|
|
4984
|
-
|
|
4985
|
-
|
|
4986
|
-
|
|
5006
|
+
kendoButton
|
|
5007
|
+
#fileSelectButton
|
|
5008
|
+
class="k-upload-button"
|
|
5009
|
+
type="button"
|
|
5010
|
+
role="button"
|
|
5011
|
+
(click)="fileSelectInput.click()"
|
|
5012
|
+
(focus)="onFileSelectButtonFocus()"
|
|
5013
|
+
[id]="focusableId"
|
|
5014
|
+
[attr.aria-label]="textFor('select')"
|
|
5015
|
+
[attr.tabindex]="tabindex"
|
|
5016
|
+
[attr.aria-expanded]="hasFileList"
|
|
5017
|
+
[attr.aria-controls]="hasFileList ? fileListId : undefined"
|
|
5018
|
+
>
|
|
5019
|
+
{{textFor('select')}}
|
|
4987
5020
|
</button>
|
|
4988
5021
|
<input kendoFileSelect #fileSelectInput
|
|
4989
|
-
|
|
4990
|
-
|
|
4991
|
-
|
|
4992
|
-
|
|
4993
|
-
|
|
4994
|
-
|
|
4995
|
-
|
|
5022
|
+
[dir]="direction"
|
|
5023
|
+
[accept]="accept"
|
|
5024
|
+
[restrictions]="restrictions"
|
|
5025
|
+
[multiple]="multiple"
|
|
5026
|
+
[disabled]="disabled"
|
|
5027
|
+
[required]="isControlRequired"
|
|
5028
|
+
/>
|
|
5029
|
+
</div>
|
|
5030
|
+
<div class="k-dropzone-hint">{{textFor('dropFilesHere')}}</div>
|
|
4996
5031
|
</div>
|
|
4997
|
-
|
|
4998
|
-
|
|
4999
|
-
<ul kendo-upload-file-list
|
|
5032
|
+
@if (hasFileList) {
|
|
5033
|
+
<ul kendo-upload-file-list
|
|
5000
5034
|
class="k-upload-files k-reset"
|
|
5001
|
-
*ngIf="hasFileList"
|
|
5002
5035
|
[disabled]="disabled"
|
|
5003
5036
|
[fileList]="fileList.files"
|
|
5004
5037
|
[fileTemplate]="fileTemplate"
|
|
5005
5038
|
[fileInfoTemplate]="fileInfoTemplate"
|
|
5006
5039
|
[id]="fileListId">
|
|
5007
|
-
|
|
5008
|
-
|
|
5040
|
+
</ul>
|
|
5041
|
+
}
|
|
5042
|
+
`,
|
|
5009
5043
|
standalone: true,
|
|
5010
|
-
imports: [LocalizedMessagesDirective, DropZoneInternalDirective, ButtonComponent, FileSelectDirective,
|
|
5044
|
+
imports: [LocalizedMessagesDirective, DropZoneInternalDirective, ButtonComponent, FileSelectDirective, FileListComponent]
|
|
5011
5045
|
}]
|
|
5012
5046
|
}], ctorParameters: () => [{ type: UploadService }, { type: i1$1.LocalizationService }, { type: NavigationService }, { type: DropZoneService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.Injector }], propDecorators: { fileSelectInput: [{
|
|
5013
5047
|
type: ViewChild,
|