@siemens/element-ng 49.13.0 → 51.0.0-rc.3
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/README.md +1 -1
- package/fesm2022/siemens-element-ng-about.mjs +41 -25
- package/fesm2022/siemens-element-ng-about.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-accordion.mjs +56 -39
- package/fesm2022/siemens-element-ng-accordion.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-action-modal.mjs +81 -51
- package/fesm2022/siemens-element-ng-action-modal.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-ag-grid.mjs +15 -12
- package/fesm2022/siemens-element-ng-ag-grid.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-application-header.mjs +142 -137
- package/fesm2022/siemens-element-ng-application-header.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-auto-collapsable-list.mjs +34 -28
- package/fesm2022/siemens-element-ng-auto-collapsable-list.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-autocomplete.mjs +27 -22
- package/fesm2022/siemens-element-ng-autocomplete.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-avatar.mjs +31 -21
- package/fesm2022/siemens-element-ng-avatar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-badge.mjs +9 -8
- package/fesm2022/siemens-element-ng-badge.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-breadcrumb-router.mjs +17 -14
- package/fesm2022/siemens-element-ng-breadcrumb-router.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-breadcrumb.mjs +18 -15
- package/fesm2022/siemens-element-ng-breadcrumb.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-card.mjs +71 -46
- package/fesm2022/siemens-element-ng-card.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-carousel.mjs +55 -32
- package/fesm2022/siemens-element-ng-carousel.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-chat-messages.mjs +175 -111
- package/fesm2022/siemens-element-ng-chat-messages.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-circle-status.mjs +37 -24
- package/fesm2022/siemens-element-ng-circle-status.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-color-picker.mjs +24 -16
- package/fesm2022/siemens-element-ng-color-picker.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-column-selection-dialog.mjs +52 -33
- package/fesm2022/siemens-element-ng-column-selection-dialog.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-common.mjs +12 -12
- package/fesm2022/siemens-element-ng-connection-strength.mjs +14 -12
- package/fesm2022/siemens-element-ng-connection-strength.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-content-action-bar.mjs +35 -26
- package/fesm2022/siemens-element-ng-content-action-bar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-copyright-notice.mjs +19 -14
- package/fesm2022/siemens-element-ng-copyright-notice.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-dashboard.mjs +327 -213
- package/fesm2022/siemens-element-ng-dashboard.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-datatable.mjs +8 -8
- package/fesm2022/siemens-element-ng-datatable.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-date-range-filter.mjs +119 -72
- package/fesm2022/siemens-element-ng-date-range-filter.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-datepicker.mjs +358 -234
- package/fesm2022/siemens-element-ng-datepicker.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-electron-titlebar.mjs +21 -16
- package/fesm2022/siemens-element-ng-electron-titlebar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-empty-state.mjs +15 -12
- package/fesm2022/siemens-element-ng-empty-state.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-file-uploader.mjs +93 -81
- package/fesm2022/siemens-element-ng-file-uploader.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-filter-bar.mjs +29 -22
- package/fesm2022/siemens-element-ng-filter-bar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-filtered-search.mjs +243 -147
- package/fesm2022/siemens-element-ng-filtered-search.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-footer.mjs +12 -10
- package/fesm2022/siemens-element-ng-footer.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-form.mjs +267 -84
- package/fesm2022/siemens-element-ng-form.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-formly-legacy.mjs +99 -0
- package/fesm2022/siemens-element-ng-formly-legacy.mjs.map +1 -0
- package/fesm2022/siemens-element-ng-formly.mjs +220 -315
- package/fesm2022/siemens-element-ng-formly.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-header-dropdown.mjs +38 -29
- package/fesm2022/siemens-element-ng-header-dropdown.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-help-button.mjs +5 -5
- package/fesm2022/siemens-element-ng-help-button.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-icon.mjs +46 -47
- package/fesm2022/siemens-element-ng-icon.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-info-page.mjs +17 -11
- package/fesm2022/siemens-element-ng-info-page.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-inline-notification.mjs +19 -14
- package/fesm2022/siemens-element-ng-inline-notification.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-ip-input.mjs +19 -15
- package/fesm2022/siemens-element-ng-ip-input.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-landing-page.mjs +118 -72
- package/fesm2022/siemens-element-ng-landing-page.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-language-switcher.mjs +16 -12
- package/fesm2022/siemens-element-ng-language-switcher.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-link.mjs +31 -21
- package/fesm2022/siemens-element-ng-link.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-list-details.mjs +73 -54
- package/fesm2022/siemens-element-ng-list-details.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-loading-spinner.mjs +42 -33
- package/fesm2022/siemens-element-ng-loading-spinner.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-localization.mjs +14 -12
- package/fesm2022/siemens-element-ng-localization.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-main-detail-container.mjs +46 -29
- package/fesm2022/siemens-element-ng-main-detail-container.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-markdown-renderer.mjs +6 -5
- package/fesm2022/siemens-element-ng-markdown-renderer.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-menu.mjs +56 -48
- package/fesm2022/siemens-element-ng-menu.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-modal.mjs +12 -10
- package/fesm2022/siemens-element-ng-modal.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-navbar-vertical-next.mjs +133 -94
- package/fesm2022/siemens-element-ng-navbar-vertical-next.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-navbar-vertical.mjs +117 -81
- package/fesm2022/siemens-element-ng-navbar-vertical.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-navbar.mjs +67 -41
- package/fesm2022/siemens-element-ng-navbar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-notification-item.mjs +19 -11
- package/fesm2022/siemens-element-ng-notification-item.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-number-input.mjs +38 -27
- package/fesm2022/siemens-element-ng-number-input.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-pagination.mjs +31 -20
- package/fesm2022/siemens-element-ng-pagination.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-password-strength.mjs +31 -22
- package/fesm2022/siemens-element-ng-password-strength.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-password-toggle.mjs +18 -13
- package/fesm2022/siemens-element-ng-password-toggle.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-phone-number.mjs +121 -138
- package/fesm2022/siemens-element-ng-phone-number.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-photo-upload.mjs +76 -45
- package/fesm2022/siemens-element-ng-photo-upload.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-pills-input.mjs +63 -58
- package/fesm2022/siemens-element-ng-pills-input.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-popover-legacy.mjs +43 -28
- package/fesm2022/siemens-element-ng-popover-legacy.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-popover.mjs +33 -26
- package/fesm2022/siemens-element-ng-popover.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-progressbar.mjs +23 -16
- package/fesm2022/siemens-element-ng-progressbar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-resize-observer.mjs +32 -43
- package/fesm2022/siemens-element-ng-resize-observer.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-result-details-list.mjs +12 -10
- package/fesm2022/siemens-element-ng-result-details-list.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-search-bar.mjs +32 -24
- package/fesm2022/siemens-element-ng-search-bar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-select.mjs +212 -154
- package/fesm2022/siemens-element-ng-select.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-shadow-root.mjs +3 -3
- package/fesm2022/siemens-element-ng-side-panel.mjs +119 -75
- package/fesm2022/siemens-element-ng-side-panel.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-skip-links.mjs +14 -13
- package/fesm2022/siemens-element-ng-skip-links.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-slider.mjs +42 -28
- package/fesm2022/siemens-element-ng-slider.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-split.mjs +268 -254
- package/fesm2022/siemens-element-ng-split.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-status-bar.mjs +57 -47
- package/fesm2022/siemens-element-ng-status-bar.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-status-counter.mjs +15 -11
- package/fesm2022/siemens-element-ng-status-counter.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-status-toggle.mjs +22 -14
- package/fesm2022/siemens-element-ng-status-toggle.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-summary-chip.mjs +25 -16
- package/fesm2022/siemens-element-ng-summary-chip.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-summary-widget.mjs +27 -17
- package/fesm2022/siemens-element-ng-summary-widget.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-system-banner.mjs +11 -8
- package/fesm2022/siemens-element-ng-system-banner.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tabs-legacy.mjs +16 -15
- package/fesm2022/siemens-element-ng-tabs-legacy.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tabs.mjs +59 -45
- package/fesm2022/siemens-element-ng-tabs.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-theme.mjs +5 -4
- package/fesm2022/siemens-element-ng-theme.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-threshold.mjs +59 -40
- package/fesm2022/siemens-element-ng-threshold.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-toast-notification.mjs +45 -40
- package/fesm2022/siemens-element-ng-toast-notification.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tooltip.mjs +52 -54
- package/fesm2022/siemens-element-ng-tooltip.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tour.mjs +28 -19
- package/fesm2022/siemens-element-ng-tour.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-translate.mjs +0 -1
- package/fesm2022/siemens-element-ng-translate.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tree-view.mjs +92 -73
- package/fesm2022/siemens-element-ng-tree-view.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-typeahead.mjs +75 -67
- package/fesm2022/siemens-element-ng-typeahead.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-wizard.mjs +72 -48
- package/fesm2022/siemens-element-ng-wizard.mjs.map +1 -1
- package/formly-legacy/package.json +4 -0
- package/package.json +20 -22
- package/schematics/migration.json +4 -4
- package/schematics/migrations/data/class-member-replacement.js +1 -19
- package/schematics/migrations/data/component-property-names.js +1 -25
- package/schematics/migrations/data/element-class-changes.js +1 -28
- package/schematics/migrations/data/element-migration-data.js +2 -0
- package/schematics/migrations/data/element-selectors.js +1 -11
- package/schematics/migrations/data/index.js +0 -4
- package/schematics/migrations/data/migration-test-data.js +9 -6
- package/schematics/migrations/data/provider-function-removals.js +7 -0
- package/schematics/migrations/data/symbol-removals.js +7 -7
- package/schematics/migrations/data/symbol-renaming.js +1 -48
- package/schematics/migrations/element-migration/element-migration.js +3 -6
- package/schematics/migrations/utilities/import-removal.js +39 -0
- package/schematics/migrations/utilities/index.js +2 -0
- package/schematics/migrations/utilities/provider-function-removal.migration.js +116 -0
- package/schematics/ng-update/index.js +1 -1
- package/schematics/ng-update/{migrate-to-v49.js → migrate-to-v51.js} +2 -2
- package/template-i18n.json +3 -6
- package/types/siemens-element-ng-application-header.d.ts +1 -21
- package/types/siemens-element-ng-chat-messages.d.ts +6 -4
- package/types/siemens-element-ng-circle-status.d.ts +1 -1
- package/types/siemens-element-ng-date-range-filter.d.ts +1 -1
- package/types/siemens-element-ng-datepicker.d.ts +1 -12
- package/types/siemens-element-ng-file-uploader.d.ts +5 -23
- package/types/siemens-element-ng-filtered-search.d.ts +1 -1
- package/types/siemens-element-ng-form.d.ts +134 -37
- package/types/siemens-element-ng-formly-legacy.d.ts +40 -0
- package/types/siemens-element-ng-formly.d.ts +34 -167
- package/types/siemens-element-ng-icon.d.ts +2 -19
- package/types/siemens-element-ng-navbar-vertical-next.d.ts +6 -1
- package/types/siemens-element-ng-notification-item.d.ts +12 -0
- package/types/siemens-element-ng-phone-number.d.ts +5 -8
- package/types/siemens-element-ng-resize-observer.d.ts +0 -17
- package/types/siemens-element-ng-split.d.ts +95 -63
- package/types/siemens-element-ng-status-bar.d.ts +5 -13
- package/types/siemens-element-ng-status-counter.d.ts +1 -1
- package/types/siemens-element-ng-toast-notification.d.ts +0 -1
- package/types/siemens-element-ng-translate.d.ts +1 -5
- package/fesm2022/siemens-element-ng-icon-status.mjs +0 -46
- package/fesm2022/siemens-element-ng-icon-status.mjs.map +0 -1
- package/fesm2022/siemens-element-ng-sort-bar.mjs +0 -99
- package/fesm2022/siemens-element-ng-sort-bar.mjs.map +0 -1
- package/icon-status/package.json +0 -4
- package/schematics/vitest-setup.js +0 -5
- package/sort-bar/package.json +0 -4
- package/types/siemens-element-ng-icon-status.d.ts +0 -25
- package/types/siemens-element-ng-sort-bar.d.ts +0 -59
- /package/{LICENSE.md → LICENSE} +0 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, booleanAttribute, output, inject, ElementRef, LOCALE_ID, Directive, computed, viewChild,
|
|
2
|
+
import { input, booleanAttribute, output, inject, ElementRef, LOCALE_ID, Directive, computed, viewChild, Component, numberAttribute, signal, effect, untracked, ChangeDetectionStrategy, NgModule } from '@angular/core';
|
|
3
3
|
import { elementUpload, elementRedo, elementDocument, elementDelete, elementCancel } from '@siemens/element-icons';
|
|
4
4
|
import { addIcons, SiIconComponent, SiStatusIconComponent } from '@siemens/element-ng/icon';
|
|
5
5
|
import { t, SiTranslatePipe } from '@siemens/element-translate-ng/translate';
|
|
@@ -44,7 +44,8 @@ class SiFileUploadDirective {
|
|
|
44
44
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`)
|
|
45
45
|
* ```
|
|
46
46
|
*/
|
|
47
|
-
errorTextFileType = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`),
|
|
47
|
+
errorTextFileType = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`), /* @ts-ignore */
|
|
48
|
+
...(ngDevMode ? [{ debugName: "errorTextFileType" }] : /* istanbul ignore next */ []));
|
|
48
49
|
/**
|
|
49
50
|
* Message or translation key if file exceeds the maximum file size limit.
|
|
50
51
|
*
|
|
@@ -53,29 +54,32 @@ class SiFileUploadDirective {
|
|
|
53
54
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`)
|
|
54
55
|
* ```
|
|
55
56
|
*/
|
|
56
|
-
errorTextFileMaxSize = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`),
|
|
57
|
+
errorTextFileMaxSize = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`), /* @ts-ignore */
|
|
58
|
+
...(ngDevMode ? [{ debugName: "errorTextFileMaxSize" }] : /* istanbul ignore next */ []));
|
|
57
59
|
/**
|
|
58
60
|
* Define which file types are suggested in file browser.
|
|
59
61
|
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#attr-accept
|
|
60
62
|
*/
|
|
61
|
-
accept = input(
|
|
63
|
+
accept = input(/* @ts-ignore */
|
|
64
|
+
...(ngDevMode ? [undefined, { debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
62
65
|
/**
|
|
63
66
|
* Define maximal allowed file size in bytes.
|
|
64
67
|
*/
|
|
65
|
-
maxFileSize = input(
|
|
68
|
+
maxFileSize = input(/* @ts-ignore */
|
|
69
|
+
...(ngDevMode ? [undefined, { debugName: "maxFileSize" }] : /* istanbul ignore next */ []));
|
|
66
70
|
/**
|
|
67
71
|
* Defines whether the file input allows selecting multiple files.
|
|
68
72
|
* When {@link directoryUpload} is enabled, this will have no effect.
|
|
69
73
|
*
|
|
70
74
|
* @defaultValue false
|
|
71
75
|
*/
|
|
72
|
-
multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : {}), transform: booleanAttribute });
|
|
76
|
+
multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
73
77
|
/**
|
|
74
78
|
* Enable directory upload.
|
|
75
79
|
*
|
|
76
80
|
* @defaultValue false
|
|
77
81
|
*/
|
|
78
|
-
directoryUpload = input(false, { ...(ngDevMode ? { debugName: "directoryUpload" } : {}), transform: booleanAttribute });
|
|
82
|
+
directoryUpload = input(false, { ...(ngDevMode ? { debugName: "directoryUpload" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
79
83
|
/**
|
|
80
84
|
* Event emitted when valid files are added.
|
|
81
85
|
* Invalid files (due to size or type) will be ignored and instead the {@link fileError} event will be emitted.
|
|
@@ -260,10 +264,10 @@ class SiFileUploadDirective {
|
|
|
260
264
|
}
|
|
261
265
|
return numberFormat.format(num) + suffix;
|
|
262
266
|
}
|
|
263
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
264
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
267
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploadDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
268
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: SiFileUploadDirective, isStandalone: true, selector: "input[type=\"file\"][siFileUpload]", inputs: { errorTextFileType: { classPropertyName: "errorTextFileType", publicName: "errorTextFileType", isSignal: true, isRequired: false, transformFunction: null }, errorTextFileMaxSize: { classPropertyName: "errorTextFileMaxSize", publicName: "errorTextFileMaxSize", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, directoryUpload: { classPropertyName: "directoryUpload", publicName: "directoryUpload", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { validFiles: "validFiles", filesAdded: "filesAdded", fileError: "fileError" }, host: { listeners: { "change": "onInputChange($event)" }, properties: { "attr.accept": "accept()", "multiple": "directoryUpload() || multiple()", "attr.webkitdirectory": "directoryUpload() ? \"\" : null" } }, ngImport: i0 });
|
|
265
269
|
}
|
|
266
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
270
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploadDirective, decorators: [{
|
|
267
271
|
type: Directive,
|
|
268
272
|
args: [{
|
|
269
273
|
selector: 'input[type="file"][siFileUpload]',
|
|
@@ -282,23 +286,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
282
286
|
*/
|
|
283
287
|
class SiFileDropzoneComponent {
|
|
284
288
|
/**
|
|
285
|
-
* Text or translation key of the
|
|
289
|
+
* Text or translation key of the drag&drop field.
|
|
286
290
|
*
|
|
287
291
|
* @defaultValue
|
|
288
292
|
* ```
|
|
289
|
-
* t(() => $localize`:@@SI_FILE_UPLOADER.
|
|
293
|
+
* t(() => $localize`:@@SI_FILE_UPLOADER.DROP:Drop files here or click to upload`)
|
|
290
294
|
* ```
|
|
291
295
|
*/
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
* Text or translation key of the drag&drop field (is combined with the `uploadTextFileSelect`).
|
|
295
|
-
*
|
|
296
|
-
* @defaultValue
|
|
297
|
-
* ```
|
|
298
|
-
* t(() => $localize`:@@SI_FILE_UPLOADER.DROP:Drop files here or`)
|
|
299
|
-
* ```
|
|
300
|
-
*/
|
|
301
|
-
uploadDropText = input(t(() => $localize `:@@SI_FILE_UPLOADER.DROP:Drop files here or`), ...(ngDevMode ? [{ debugName: "uploadDropText" }] : []));
|
|
296
|
+
uploadDropText = input(t(() => $localize `:@@SI_FILE_UPLOADER.DROP:Drop files here or click to upload`), /* @ts-ignore */
|
|
297
|
+
...(ngDevMode ? [{ debugName: "uploadDropText" }] : /* istanbul ignore next */ []));
|
|
302
298
|
/**
|
|
303
299
|
* Text or translation key for max file size.
|
|
304
300
|
*
|
|
@@ -307,7 +303,8 @@ class SiFileDropzoneComponent {
|
|
|
307
303
|
* t(() => $localize`:@@SI_FILE_UPLOADER.MAX_SIZE:Max. {{maxFileSize}} upload size.`)
|
|
308
304
|
* ```
|
|
309
305
|
*/
|
|
310
|
-
maxFileSizeText = input(t(() => $localize `:@@SI_FILE_UPLOADER.MAX_SIZE:Max. {{maxFileSize}} upload size.`),
|
|
306
|
+
maxFileSizeText = input(t(() => $localize `:@@SI_FILE_UPLOADER.MAX_SIZE:Max. {{maxFileSize}} upload size.`), /* @ts-ignore */
|
|
307
|
+
...(ngDevMode ? [{ debugName: "maxFileSizeText" }] : /* istanbul ignore next */ []));
|
|
311
308
|
/**
|
|
312
309
|
* Text or translation key for accepted types.
|
|
313
310
|
*
|
|
@@ -316,7 +313,8 @@ class SiFileDropzoneComponent {
|
|
|
316
313
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES:Accepted file types: {{accept}}.`)
|
|
317
314
|
* ```
|
|
318
315
|
*/
|
|
319
|
-
acceptText = input(t(() => $localize `:@@SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES:Accepted file types: {{accept}}.`),
|
|
316
|
+
acceptText = input(t(() => $localize `:@@SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES:Accepted file types: {{accept}}.`), /* @ts-ignore */
|
|
317
|
+
...(ngDevMode ? [{ debugName: "acceptText" }] : /* istanbul ignore next */ []));
|
|
320
318
|
/**
|
|
321
319
|
* Text or translation key of message title if incorrect file type is dragged / dropped.
|
|
322
320
|
*
|
|
@@ -325,7 +323,8 @@ class SiFileDropzoneComponent {
|
|
|
325
323
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`)
|
|
326
324
|
* ```
|
|
327
325
|
*/
|
|
328
|
-
errorTextFileType = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`),
|
|
326
|
+
errorTextFileType = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`), /* @ts-ignore */
|
|
327
|
+
...(ngDevMode ? [{ debugName: "errorTextFileType" }] : /* istanbul ignore next */ []));
|
|
329
328
|
/**
|
|
330
329
|
* Message or translation key if file exceeds the maximum file size limit.
|
|
331
330
|
*
|
|
@@ -334,23 +333,26 @@ class SiFileDropzoneComponent {
|
|
|
334
333
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`)
|
|
335
334
|
* ```
|
|
336
335
|
*/
|
|
337
|
-
errorTextFileMaxSize = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`),
|
|
336
|
+
errorTextFileMaxSize = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`), /* @ts-ignore */
|
|
337
|
+
...(ngDevMode ? [{ debugName: "errorTextFileMaxSize" }] : /* istanbul ignore next */ []));
|
|
338
338
|
/**
|
|
339
339
|
* Define which file types are suggested in file browser.
|
|
340
340
|
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#attr-accept
|
|
341
341
|
*/
|
|
342
|
-
accept = input(
|
|
342
|
+
accept = input(/* @ts-ignore */
|
|
343
|
+
...(ngDevMode ? [undefined, { debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
343
344
|
/**
|
|
344
345
|
* Define maximal allowed file size in bytes.
|
|
345
346
|
*/
|
|
346
|
-
maxFileSize = input(
|
|
347
|
+
maxFileSize = input(/* @ts-ignore */
|
|
348
|
+
...(ngDevMode ? [undefined, { debugName: "maxFileSize" }] : /* istanbul ignore next */ []));
|
|
347
349
|
/**
|
|
348
350
|
* Defines whether the file input allows selecting multiple files.
|
|
349
351
|
* When {@link directoryUpload} is enabled, this will have no effect.
|
|
350
352
|
*
|
|
351
353
|
* @defaultValue false
|
|
352
354
|
*/
|
|
353
|
-
multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : {}), transform: booleanAttribute });
|
|
355
|
+
multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
354
356
|
/**
|
|
355
357
|
* Event emitted when valid files are added.
|
|
356
358
|
* Invalid files are also included here, but with status 'invalid' and an errorText describing why they were ignored.
|
|
@@ -365,11 +367,12 @@ class SiFileDropzoneComponent {
|
|
|
365
367
|
*
|
|
366
368
|
* @defaultValue false
|
|
367
369
|
*/
|
|
368
|
-
directoryUpload = input(false, { ...(ngDevMode ? { debugName: "directoryUpload" } : {}), transform: booleanAttribute });
|
|
370
|
+
directoryUpload = input(false, { ...(ngDevMode ? { debugName: "directoryUpload" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
369
371
|
maxFileSizeString = computed(() => {
|
|
370
372
|
const maxFileSize = this.maxFileSize();
|
|
371
373
|
return maxFileSize ? this.fileUploadDirective().fileSizeToString(maxFileSize) : '';
|
|
372
|
-
},
|
|
374
|
+
}, /* @ts-ignore */
|
|
375
|
+
...(ngDevMode ? [{ debugName: "maxFileSizeString" }] : /* istanbul ignore next */ []));
|
|
373
376
|
icons = addIcons({ elementUpload });
|
|
374
377
|
dragOver = false;
|
|
375
378
|
fileUploadDirective = viewChild.required(SiFileUploadDirective);
|
|
@@ -403,37 +406,29 @@ class SiFileDropzoneComponent {
|
|
|
403
406
|
reset() {
|
|
404
407
|
this.fileUploadDirective().reset();
|
|
405
408
|
}
|
|
406
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
407
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
409
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileDropzoneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
410
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiFileDropzoneComponent, isStandalone: true, selector: "si-file-dropzone", inputs: { uploadDropText: { classPropertyName: "uploadDropText", publicName: "uploadDropText", isSignal: true, isRequired: false, transformFunction: null }, maxFileSizeText: { classPropertyName: "maxFileSizeText", publicName: "maxFileSizeText", isSignal: true, isRequired: false, transformFunction: null }, acceptText: { classPropertyName: "acceptText", publicName: "acceptText", isSignal: true, isRequired: false, transformFunction: null }, errorTextFileType: { classPropertyName: "errorTextFileType", publicName: "errorTextFileType", isSignal: true, isRequired: false, transformFunction: null }, errorTextFileMaxSize: { classPropertyName: "errorTextFileMaxSize", publicName: "errorTextFileMaxSize", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, directoryUpload: { classPropertyName: "directoryUpload", publicName: "directoryUpload", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filesAdded: "filesAdded", fileError: "fileError" }, viewQueries: [{ propertyName: "fileUploadDirective", first: true, predicate: SiFileUploadDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n class=\"drag-and-drop rounded p-6\"\n [class.drag-over]=\"dragOver\"\n (drop)=\"dropHandler($event)\"\n (dragover)=\"dragOverHandler($event)\"\n (dragleave)=\"dragOver = false\"\n>\n <si-icon class=\"mb-6 si-display-bold\" [icon]=\"icons.elementUpload\" />\n <span class=\"drag-and-drop-description si-h5 d-flex\">\n <button type=\"button\" class=\"select-file si-h5 mb-0\" (click)=\"triggerFileSelect()\">\n {{ uploadDropText() | translate }}\n </button>\n <input\n #fileInput\n type=\"file\"\n tabindex=\"-1\"\n class=\"d-none\"\n siFileUpload\n [accept]=\"accept()\"\n [maxFileSize]=\"maxFileSize()\"\n [multiple]=\"multiple()\"\n [directoryUpload]=\"directoryUpload()\"\n [errorTextFileType]=\"errorTextFileType()\"\n [errorTextFileMaxSize]=\"errorTextFileMaxSize()\"\n (filesAdded)=\"onFilesAdded($event)\"\n (fileError)=\"onFileError($event)\"\n (cancel)=\"$event.stopPropagation()\"\n />\n </span>\n @if (maxFileSize() || accept()) {\n <div class=\"allowed si-caption mt-6 text-center\">\n @if (maxFileSize()) {\n {{ maxFileSizeText() | translate: { maxFileSize: maxFileSizeString() } }}\n }\n @if (accept()) {\n {{ acceptText() | translate: { accept: accept() } }}\n }\n </div>\n }\n</div>\n", styles: [":host{display:block}.select-file{margin-block-end:0;padding:0;border:0;background:transparent;cursor:pointer;color:var(--element-ui-0)}.select-file:hover,.select-file:active{text-decoration:underline}.drag-and-drop{background-color:var(--element-base-1);border:1px dashed var(--element-ui-2);display:flex;flex-direction:column;justify-content:center;align-items:center}.drag-and-drop.drag-over{border:1px solid var(--element-focus-default);box-shadow:0 0 0 1px var(--element-focus-default)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiFileUploadDirective, selector: "input[type=\"file\"][siFileUpload]", inputs: ["errorTextFileType", "errorTextFileMaxSize", "accept", "maxFileSize", "multiple", "directoryUpload"], outputs: ["validFiles", "filesAdded", "fileError"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
408
411
|
}
|
|
409
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
412
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileDropzoneComponent, decorators: [{
|
|
410
413
|
type: Component,
|
|
411
|
-
args: [{ selector: 'si-file-dropzone', imports: [SiIconComponent, SiTranslatePipe, SiFileUploadDirective],
|
|
412
|
-
}], propDecorators: {
|
|
414
|
+
args: [{ selector: 'si-file-dropzone', imports: [SiIconComponent, SiTranslatePipe, SiFileUploadDirective], template: "<div\n class=\"drag-and-drop rounded p-6\"\n [class.drag-over]=\"dragOver\"\n (drop)=\"dropHandler($event)\"\n (dragover)=\"dragOverHandler($event)\"\n (dragleave)=\"dragOver = false\"\n>\n <si-icon class=\"mb-6 si-display-bold\" [icon]=\"icons.elementUpload\" />\n <span class=\"drag-and-drop-description si-h5 d-flex\">\n <button type=\"button\" class=\"select-file si-h5 mb-0\" (click)=\"triggerFileSelect()\">\n {{ uploadDropText() | translate }}\n </button>\n <input\n #fileInput\n type=\"file\"\n tabindex=\"-1\"\n class=\"d-none\"\n siFileUpload\n [accept]=\"accept()\"\n [maxFileSize]=\"maxFileSize()\"\n [multiple]=\"multiple()\"\n [directoryUpload]=\"directoryUpload()\"\n [errorTextFileType]=\"errorTextFileType()\"\n [errorTextFileMaxSize]=\"errorTextFileMaxSize()\"\n (filesAdded)=\"onFilesAdded($event)\"\n (fileError)=\"onFileError($event)\"\n (cancel)=\"$event.stopPropagation()\"\n />\n </span>\n @if (maxFileSize() || accept()) {\n <div class=\"allowed si-caption mt-6 text-center\">\n @if (maxFileSize()) {\n {{ maxFileSizeText() | translate: { maxFileSize: maxFileSizeString() } }}\n }\n @if (accept()) {\n {{ acceptText() | translate: { accept: accept() } }}\n }\n </div>\n }\n</div>\n", styles: [":host{display:block}.select-file{margin-block-end:0;padding:0;border:0;background:transparent;cursor:pointer;color:var(--element-ui-0)}.select-file:hover,.select-file:active{text-decoration:underline}.drag-and-drop{background-color:var(--element-base-1);border:1px dashed var(--element-ui-2);display:flex;flex-direction:column;justify-content:center;align-items:center}.drag-and-drop.drag-over{border:1px solid var(--element-focus-default);box-shadow:0 0 0 1px var(--element-focus-default)}\n"] }]
|
|
415
|
+
}], propDecorators: { uploadDropText: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadDropText", required: false }] }], maxFileSizeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFileSizeText", required: false }] }], acceptText: [{ type: i0.Input, args: [{ isSignal: true, alias: "acceptText", required: false }] }], errorTextFileType: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorTextFileType", required: false }] }], errorTextFileMaxSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorTextFileMaxSize", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], maxFileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFileSize", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], filesAdded: [{ type: i0.Output, args: ["filesAdded"] }], fileError: [{ type: i0.Output, args: ["fileError"] }], directoryUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "directoryUpload", required: false }] }], fileUploadDirective: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SiFileUploadDirective), { isSignal: true }] }] } });
|
|
413
416
|
|
|
414
417
|
/**
|
|
415
418
|
* Copyright (c) Siemens 2016 - 2026
|
|
416
419
|
* SPDX-License-Identifier: MIT
|
|
417
420
|
*/
|
|
418
421
|
class SiFileUploaderComponent {
|
|
419
|
-
/**
|
|
420
|
-
* Text of the link to open the file select dialog (follows `uploadDropText`).
|
|
421
|
-
*
|
|
422
|
-
* @defaultValue
|
|
423
|
-
* ```
|
|
424
|
-
* t(() => $localize`:@@SI_FILE_UPLOADER.FILE_SELECT:click to upload`)
|
|
425
|
-
* ```
|
|
426
|
-
*/
|
|
427
|
-
uploadTextFileSelect = input(t(() => $localize `:@@SI_FILE_UPLOADER.FILE_SELECT:click to upload`), ...(ngDevMode ? [{ debugName: "uploadTextFileSelect" }] : []));
|
|
428
422
|
/**
|
|
429
423
|
* Text instructing a user to drop the files inside the dropzone.
|
|
430
424
|
*
|
|
431
425
|
* @defaultValue
|
|
432
426
|
* ```
|
|
433
|
-
* t(() => $localize`:@@SI_FILE_UPLOADER.DROP:Drop files here or`)
|
|
427
|
+
* t(() => $localize`:@@SI_FILE_UPLOADER.DROP:Drop files here or click to upload`)
|
|
434
428
|
* ```
|
|
435
429
|
*/
|
|
436
|
-
uploadDropText = input(t(() => $localize `:@@SI_FILE_UPLOADER.DROP:Drop files here or`),
|
|
430
|
+
uploadDropText = input(t(() => $localize `:@@SI_FILE_UPLOADER.DROP:Drop files here or click to upload`), /* @ts-ignore */
|
|
431
|
+
...(ngDevMode ? [{ debugName: "uploadDropText" }] : /* istanbul ignore next */ []));
|
|
437
432
|
/**
|
|
438
433
|
* Text to describe the maximum file size.
|
|
439
434
|
*
|
|
@@ -442,7 +437,8 @@ class SiFileUploaderComponent {
|
|
|
442
437
|
* t(() => $localize`:@@SI_FILE_UPLOADER.MAX_SIZE:Max. {{maxFileSize}} upload size.`)
|
|
443
438
|
* ```
|
|
444
439
|
*/
|
|
445
|
-
maxFileSizeText = input(t(() => $localize `:@@SI_FILE_UPLOADER.MAX_SIZE:Max. {{maxFileSize}} upload size.`),
|
|
440
|
+
maxFileSizeText = input(t(() => $localize `:@@SI_FILE_UPLOADER.MAX_SIZE:Max. {{maxFileSize}} upload size.`), /* @ts-ignore */
|
|
441
|
+
...(ngDevMode ? [{ debugName: "maxFileSizeText" }] : /* istanbul ignore next */ []));
|
|
446
442
|
/**
|
|
447
443
|
* Error message shown when the maximum number of files are reached.
|
|
448
444
|
*
|
|
@@ -451,7 +447,8 @@ class SiFileUploaderComponent {
|
|
|
451
447
|
* t(() => $localize`:@@SI_FILE_UPLOADER.MAX_FILE_REACHED:Max. {{maxFiles}} files`)
|
|
452
448
|
* ```
|
|
453
449
|
*/
|
|
454
|
-
maxFilesReachedText = input(t(() => $localize `:@@SI_FILE_UPLOADER.MAX_FILE_REACHED:Max. {{maxFiles}} files`),
|
|
450
|
+
maxFilesReachedText = input(t(() => $localize `:@@SI_FILE_UPLOADER.MAX_FILE_REACHED:Max. {{maxFiles}} files`), /* @ts-ignore */
|
|
451
|
+
...(ngDevMode ? [{ debugName: "maxFilesReachedText" }] : /* istanbul ignore next */ []));
|
|
455
452
|
/**
|
|
456
453
|
* Text for the accepted file types.
|
|
457
454
|
*
|
|
@@ -460,7 +457,8 @@ class SiFileUploaderComponent {
|
|
|
460
457
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES:Accepted file types: {{accept}}.`)
|
|
461
458
|
* ```
|
|
462
459
|
*/
|
|
463
|
-
acceptText = input(t(() => $localize `:@@SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES:Accepted file types: {{accept}}.`),
|
|
460
|
+
acceptText = input(t(() => $localize `:@@SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES:Accepted file types: {{accept}}.`), /* @ts-ignore */
|
|
461
|
+
...(ngDevMode ? [{ debugName: "acceptText" }] : /* istanbul ignore next */ []));
|
|
464
462
|
/**
|
|
465
463
|
* Text used inside the upload button.
|
|
466
464
|
*
|
|
@@ -469,7 +467,8 @@ class SiFileUploaderComponent {
|
|
|
469
467
|
* t(() => $localize`:@@SI_FILE_UPLOADER.UPLOAD:Upload`)
|
|
470
468
|
* ```
|
|
471
469
|
*/
|
|
472
|
-
uploadButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOAD:Upload`),
|
|
470
|
+
uploadButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOAD:Upload`), /* @ts-ignore */
|
|
471
|
+
...(ngDevMode ? [{ debugName: "uploadButtonText" }] : /* istanbul ignore next */ []));
|
|
473
472
|
/**
|
|
474
473
|
* Text used inside the clear button.
|
|
475
474
|
*
|
|
@@ -478,7 +477,8 @@ class SiFileUploaderComponent {
|
|
|
478
477
|
* t(() => $localize`:@@SI_FILE_UPLOADER.CLEAR:Clear`)
|
|
479
478
|
* ```
|
|
480
479
|
*/
|
|
481
|
-
clearButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.CLEAR:Clear`),
|
|
480
|
+
clearButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.CLEAR:Clear`), /* @ts-ignore */
|
|
481
|
+
...(ngDevMode ? [{ debugName: "clearButtonText" }] : /* istanbul ignore next */ []));
|
|
482
482
|
/**
|
|
483
483
|
* Text shown during the file upload.
|
|
484
484
|
*
|
|
@@ -487,7 +487,8 @@ class SiFileUploaderComponent {
|
|
|
487
487
|
* t(() => $localize`:@@SI_FILE_UPLOADER.UPLOADING:Uploading`)
|
|
488
488
|
* ```
|
|
489
489
|
*/
|
|
490
|
-
uploadingText = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOADING:Uploading`),
|
|
490
|
+
uploadingText = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOADING:Uploading`), /* @ts-ignore */
|
|
491
|
+
...(ngDevMode ? [{ debugName: "uploadingText" }] : /* istanbul ignore next */ []));
|
|
491
492
|
/**
|
|
492
493
|
* Text shown to remove a file from the file list. Required for a11y.
|
|
493
494
|
*
|
|
@@ -496,7 +497,8 @@ class SiFileUploaderComponent {
|
|
|
496
497
|
* t(() => $localize`:@@SI_FILE_UPLOADER.REMOVE:Remove`)
|
|
497
498
|
* ```
|
|
498
499
|
*/
|
|
499
|
-
removeButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.REMOVE:Remove`),
|
|
500
|
+
removeButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.REMOVE:Remove`), /* @ts-ignore */
|
|
501
|
+
...(ngDevMode ? [{ debugName: "removeButtonText" }] : /* istanbul ignore next */ []));
|
|
500
502
|
/**
|
|
501
503
|
* Text of cancel button. Shown during upload. Required for a11y.
|
|
502
504
|
*
|
|
@@ -505,7 +507,8 @@ class SiFileUploaderComponent {
|
|
|
505
507
|
* t(() => $localize`:@@SI_FILE_UPLOADER.CANCEL:Cancel`)
|
|
506
508
|
* ```
|
|
507
509
|
*/
|
|
508
|
-
cancelButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.CANCEL:Cancel`),
|
|
510
|
+
cancelButtonText = input(t(() => $localize `:@@SI_FILE_UPLOADER.CANCEL:Cancel`), /* @ts-ignore */
|
|
511
|
+
...(ngDevMode ? [{ debugName: "cancelButtonText" }] : /* istanbul ignore next */ []));
|
|
509
512
|
/**
|
|
510
513
|
* Text shown if the upload was successful.
|
|
511
514
|
*
|
|
@@ -514,7 +517,8 @@ class SiFileUploaderComponent {
|
|
|
514
517
|
* t(() => $localize`:@@SI_FILE_UPLOADER.UPLOAD_COMPLETED:Upload completed`)
|
|
515
518
|
* ```
|
|
516
519
|
*/
|
|
517
|
-
successTextTitle = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOAD_COMPLETED:Upload completed`),
|
|
520
|
+
successTextTitle = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOAD_COMPLETED:Upload completed`), /* @ts-ignore */
|
|
521
|
+
...(ngDevMode ? [{ debugName: "successTextTitle" }] : /* istanbul ignore next */ []));
|
|
518
522
|
/**
|
|
519
523
|
* Text shown if the upload failed.
|
|
520
524
|
*
|
|
@@ -523,13 +527,14 @@ class SiFileUploaderComponent {
|
|
|
523
527
|
* t(() => $localize`:@@SI_FILE_UPLOADER.UPLOAD_FAILED:Upload failed`)
|
|
524
528
|
* ```
|
|
525
529
|
*/
|
|
526
|
-
errorUploadFailed = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOAD_FAILED:Upload failed`),
|
|
530
|
+
errorUploadFailed = input(t(() => $localize `:@@SI_FILE_UPLOADER.UPLOAD_FAILED:Upload failed`), /* @ts-ignore */
|
|
531
|
+
...(ngDevMode ? [{ debugName: "errorUploadFailed" }] : /* istanbul ignore next */ []));
|
|
527
532
|
/**
|
|
528
533
|
* On failed upload, show the error received from the server.
|
|
529
534
|
*
|
|
530
535
|
* @defaultValue false
|
|
531
536
|
*/
|
|
532
|
-
showHttpError = input(false, { ...(ngDevMode ? { debugName: "showHttpError" } : {}), transform: booleanAttribute });
|
|
537
|
+
showHttpError = input(false, { ...(ngDevMode ? { debugName: "showHttpError" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
533
538
|
/**
|
|
534
539
|
* Text shown to indicate that an incorrect file type was added to file list.
|
|
535
540
|
*
|
|
@@ -538,7 +543,8 @@ class SiFileUploaderComponent {
|
|
|
538
543
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`)
|
|
539
544
|
* ```
|
|
540
545
|
*/
|
|
541
|
-
errorTextFileType = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`),
|
|
546
|
+
errorTextFileType = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_TYPE:Incorrect file type selected`), /* @ts-ignore */
|
|
547
|
+
...(ngDevMode ? [{ debugName: "errorTextFileType" }] : /* istanbul ignore next */ []));
|
|
542
548
|
/**
|
|
543
549
|
* Message or translation key if file exceeds the maximum file size limit.
|
|
544
550
|
*
|
|
@@ -547,7 +553,8 @@ class SiFileUploaderComponent {
|
|
|
547
553
|
* t(() => $localize`:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`)
|
|
548
554
|
* ```
|
|
549
555
|
*/
|
|
550
|
-
errorTextFileMaxSize = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`),
|
|
556
|
+
errorTextFileMaxSize = input(t(() => $localize `:@@SI_FILE_UPLOADER.ERROR_FILE_SIZE_EXCEEDED:File exceeds allowed maximum size of {{maxFileSize}}`), /* @ts-ignore */
|
|
557
|
+
...(ngDevMode ? [{ debugName: "errorTextFileMaxSize" }] : /* istanbul ignore next */ []));
|
|
551
558
|
/**
|
|
552
559
|
* Config for HTTP request to upload file.
|
|
553
560
|
*
|
|
@@ -568,48 +575,50 @@ class SiFileUploaderComponent {
|
|
|
568
575
|
url: '',
|
|
569
576
|
fieldName: 'upload_file',
|
|
570
577
|
responseType: 'json'
|
|
571
|
-
},
|
|
578
|
+
}, /* @ts-ignore */
|
|
579
|
+
...(ngDevMode ? [{ debugName: "uploadConfig" }] : /* istanbul ignore next */ []));
|
|
572
580
|
/**
|
|
573
581
|
* Define which file types are suggested in file browser.
|
|
574
582
|
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#attr-accept
|
|
575
583
|
*/
|
|
576
|
-
accept = input(
|
|
584
|
+
accept = input(/* @ts-ignore */
|
|
585
|
+
...(ngDevMode ? [undefined, { debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
577
586
|
/**
|
|
578
587
|
* Define maximal allowed file size in bytes.
|
|
579
588
|
*
|
|
580
589
|
* @defaultValue undefined
|
|
581
590
|
*/
|
|
582
|
-
maxFileSize = input(undefined, { ...(ngDevMode ? { debugName: "maxFileSize" } : {}), transform: numberAttribute });
|
|
591
|
+
maxFileSize = input(undefined, { ...(ngDevMode ? { debugName: "maxFileSize" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
583
592
|
/**
|
|
584
593
|
* Define maximal allowed number of files.
|
|
585
594
|
* When {@link directoryUpload} is enabled, this will have no effect.
|
|
586
595
|
* @defaultValue 10
|
|
587
596
|
*/
|
|
588
|
-
maxFiles = input(10, { ...(ngDevMode ? { debugName: "maxFiles" } : {}), transform: numberAttribute });
|
|
597
|
+
maxFiles = input(10, { ...(ngDevMode ? { debugName: "maxFiles" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
589
598
|
/**
|
|
590
599
|
* Maximum number of concurrent uploads.
|
|
591
600
|
*
|
|
592
601
|
* @defaultValue 3
|
|
593
602
|
*/
|
|
594
|
-
maxConcurrentUploads = input(3, { ...(ngDevMode ? { debugName: "maxConcurrentUploads" } : {}), transform: numberAttribute });
|
|
603
|
+
maxConcurrentUploads = input(3, { ...(ngDevMode ? { debugName: "maxConcurrentUploads" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
595
604
|
/**
|
|
596
605
|
* Numbers of retries for failed uploads.
|
|
597
606
|
*
|
|
598
607
|
* @defaultValue 0
|
|
599
608
|
*/
|
|
600
|
-
retries = input(0, { ...(ngDevMode ? { debugName: "retries" } : {}), transform: numberAttribute });
|
|
609
|
+
retries = input(0, { ...(ngDevMode ? { debugName: "retries" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
601
610
|
/**
|
|
602
611
|
* Auto-upload mode - automatically start upload once files are added.
|
|
603
612
|
*
|
|
604
613
|
* @defaultValue false
|
|
605
614
|
*/
|
|
606
|
-
autoUpload = input(false, { ...(ngDevMode ? { debugName: "autoUpload" } : {}), transform: booleanAttribute });
|
|
615
|
+
autoUpload = input(false, { ...(ngDevMode ? { debugName: "autoUpload" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
607
616
|
/**
|
|
608
617
|
* Disable the upload button.
|
|
609
618
|
*
|
|
610
619
|
* @defaultValue false
|
|
611
620
|
*/
|
|
612
|
-
disableUpload = input(false, { ...(ngDevMode ? { debugName: "disableUpload" } : {}), transform: booleanAttribute });
|
|
621
|
+
disableUpload = input(false, { ...(ngDevMode ? { debugName: "disableUpload" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
613
622
|
/**
|
|
614
623
|
* Enable directory upload mode.
|
|
615
624
|
* When enabled, the file input will accept directories and upload all files within as a flat list.
|
|
@@ -620,7 +629,7 @@ class SiFileUploaderComponent {
|
|
|
620
629
|
*
|
|
621
630
|
* @defaultValue false
|
|
622
631
|
*/
|
|
623
|
-
directoryUpload = input(false, { ...(ngDevMode ? { debugName: "directoryUpload" } : {}), transform: booleanAttribute });
|
|
632
|
+
directoryUpload = input(false, { ...(ngDevMode ? { debugName: "directoryUpload" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
624
633
|
/**
|
|
625
634
|
* Emits when a user press cancel during upload. The event provides the file details.
|
|
626
635
|
*/
|
|
@@ -640,11 +649,14 @@ class SiFileUploaderComponent {
|
|
|
640
649
|
elementDocument,
|
|
641
650
|
elementRedo
|
|
642
651
|
});
|
|
643
|
-
files = signal([],
|
|
652
|
+
files = signal([], /* @ts-ignore */
|
|
653
|
+
...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
|
|
644
654
|
pending = 0;
|
|
645
655
|
uploading = 0;
|
|
646
|
-
uploadEnabled = signal(false,
|
|
647
|
-
|
|
656
|
+
uploadEnabled = signal(false, /* @ts-ignore */
|
|
657
|
+
...(ngDevMode ? [{ debugName: "uploadEnabled" }] : /* istanbul ignore next */ []));
|
|
658
|
+
maxFilesReached = signal(false, /* @ts-ignore */
|
|
659
|
+
...(ngDevMode ? [{ debugName: "maxFilesReached" }] : /* istanbul ignore next */ []));
|
|
648
660
|
dropZone = viewChild.required('dropZone');
|
|
649
661
|
http = inject(HttpClient, { optional: true });
|
|
650
662
|
constructor() {
|
|
@@ -870,10 +882,10 @@ class SiFileUploaderComponent {
|
|
|
870
882
|
countValid() {
|
|
871
883
|
return this.files().reduce((acc, f) => acc + (f.status !== 'invalid' ? 1 : 0), 0);
|
|
872
884
|
}
|
|
873
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
874
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
885
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
886
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiFileUploaderComponent, isStandalone: true, selector: "si-file-uploader", inputs: { uploadDropText: { classPropertyName: "uploadDropText", publicName: "uploadDropText", isSignal: true, isRequired: false, transformFunction: null }, maxFileSizeText: { classPropertyName: "maxFileSizeText", publicName: "maxFileSizeText", isSignal: true, isRequired: false, transformFunction: null }, maxFilesReachedText: { classPropertyName: "maxFilesReachedText", publicName: "maxFilesReachedText", isSignal: true, isRequired: false, transformFunction: null }, acceptText: { classPropertyName: "acceptText", publicName: "acceptText", isSignal: true, isRequired: false, transformFunction: null }, uploadButtonText: { classPropertyName: "uploadButtonText", publicName: "uploadButtonText", isSignal: true, isRequired: false, transformFunction: null }, clearButtonText: { classPropertyName: "clearButtonText", publicName: "clearButtonText", isSignal: true, isRequired: false, transformFunction: null }, uploadingText: { classPropertyName: "uploadingText", publicName: "uploadingText", isSignal: true, isRequired: false, transformFunction: null }, removeButtonText: { classPropertyName: "removeButtonText", publicName: "removeButtonText", isSignal: true, isRequired: false, transformFunction: null }, cancelButtonText: { classPropertyName: "cancelButtonText", publicName: "cancelButtonText", isSignal: true, isRequired: false, transformFunction: null }, successTextTitle: { classPropertyName: "successTextTitle", publicName: "successTextTitle", isSignal: true, isRequired: false, transformFunction: null }, errorUploadFailed: { classPropertyName: "errorUploadFailed", publicName: "errorUploadFailed", isSignal: true, isRequired: false, transformFunction: null }, showHttpError: { classPropertyName: "showHttpError", publicName: "showHttpError", isSignal: true, isRequired: false, transformFunction: null }, errorTextFileType: { classPropertyName: "errorTextFileType", publicName: "errorTextFileType", isSignal: true, isRequired: false, transformFunction: null }, errorTextFileMaxSize: { classPropertyName: "errorTextFileMaxSize", publicName: "errorTextFileMaxSize", isSignal: true, isRequired: false, transformFunction: null }, uploadConfig: { classPropertyName: "uploadConfig", publicName: "uploadConfig", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, maxConcurrentUploads: { classPropertyName: "maxConcurrentUploads", publicName: "maxConcurrentUploads", isSignal: true, isRequired: false, transformFunction: null }, retries: { classPropertyName: "retries", publicName: "retries", isSignal: true, isRequired: false, transformFunction: null }, autoUpload: { classPropertyName: "autoUpload", publicName: "autoUpload", isSignal: true, isRequired: false, transformFunction: null }, disableUpload: { classPropertyName: "disableUpload", publicName: "disableUpload", isSignal: true, isRequired: false, transformFunction: null }, directoryUpload: { classPropertyName: "directoryUpload", publicName: "directoryUpload", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { uploadCanceled: "uploadCanceled", uploadCompleted: "uploadCompleted", filesChanges: "filesChanges" }, viewQueries: [{ propertyName: "dropZone", first: true, predicate: ["dropZone"], descendants: true, isSignal: true }], ngImport: i0, template: "<si-file-dropzone\n #dropZone\n [class]=\"autoUpload() ? 'mb-8' : 'mb-4'\"\n [uploadDropText]=\"uploadDropText()\"\n [multiple]=\"maxFiles() > 1\"\n [directoryUpload]=\"directoryUpload()\"\n [maxFileSizeText]=\"maxFileSizeText()\"\n [acceptText]=\"acceptText()\"\n [errorTextFileType]=\"errorTextFileType()\"\n [errorTextFileMaxSize]=\"errorTextFileMaxSize()\"\n [accept]=\"accept()\"\n [maxFileSize]=\"maxFileSize()\"\n (filesAdded)=\"handleFiles($event)\"\n/>\n\n@if (maxFilesReached()) {\n <si-inline-notification\n class=\"mb-4\"\n severity=\"info\"\n [message]=\"maxFilesReachedText()\"\n [translationParams]=\"{ maxFiles: maxFiles() }\"\n />\n}\n\n<div class=\"file-list\">\n @for (file of files(); track file) {\n <div class=\"file\" [class.fade-out]=\"file.fadeOut\">\n <si-icon class=\"icon align-self-center ms-6 me-4\" icon=\"element-document\" />\n <div class=\"flex-fill overflow-hidden mt-6\">\n <div class=\"file-info\">\n <div class=\"file-name text-truncate si-h5\">{{ file.fileName }}</div>\n <div class=\"file-size text-secondary\">{{ file.size }}</div>\n @if (file.errorText) {\n <div\n class=\"d-inline-flex gap-2 error text-truncate\"\n [class.text-warning]=\"file.status === 'invalid'\"\n [class.text-danger]=\"file.status === 'error'\"\n >\n <si-status-icon\n class=\"icon-sm\"\n [status]=\"file.status === 'invalid' ? 'warning' : 'danger'\"\n />\n {{ file.errorText | translate: file.errorParams }}\n @if (file.httpErrorText) {\n : {{ file.httpErrorText }}\n }\n </div>\n } @else {\n <div class=\"position-relative mt-1 mb-5\">\n <div class=\"position-absolute end-0 progress-value\">{{ file.progress }} %</div>\n <si-progressbar\n height=\"small\"\n [value]=\"file.progress\"\n [ariaLabel]=\"uploadingText() | translate\"\n />\n </div>\n }\n </div>\n </div>\n <div class=\"status align-self-center text-nowrap ps-4 pe-6\">\n @if (file.status === 'error') {\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary me-4\"\n [disabled]=\"!uploadEnabled()\"\n [title]=\"uploadButtonText() | translate\"\n [attr.aria-label]=\"uploadButtonText() | translate\"\n (click)=\"retryUpload(file)\"\n >\n <si-icon [icon]=\"icons.elementRedo\" />\n </button>\n }\n @if (file.status === 'added' || file.status === 'error' || file.status === 'invalid') {\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary-ghost\"\n [title]=\"removeButtonText() | translate\"\n [attr.aria-label]=\"removeButtonText() | translate\"\n (click)=\"removeFile($index)\"\n >\n <si-icon [icon]=\"icons.elementDelete\" />\n </button>\n }\n @if (file.status === 'uploading' || file.status === 'queued') {\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary\"\n [title]=\"cancelButtonText() | translate\"\n [attr.aria-label]=\"cancelButtonText() | translate\"\n (click)=\"cancelUpload(file)\"\n >\n <si-icon [icon]=\"icons.elementCancel\" />\n </button>\n }\n @if (file.status === 'success') {\n <si-status-icon class=\"icon mx-2\" status=\"success\" />\n }\n </div>\n </div>\n }\n</div>\n\n@if (!autoUpload()) {\n <div class=\"buttons text-end\">\n <button\n type=\"button\"\n class=\"btn btn-secondary me-4\"\n [disabled]=\"pending || !files().length\"\n (click)=\"reset()\"\n >{{ clearButtonText() | translate }}</button\n >\n <button\n type=\"button\"\n class=\"btn btn-primary\"\n [disabled]=\"!uploadEnabled()\"\n (click)=\"fileUpload()\"\n >{{ uploadButtonText() | translate }}</button\n >\n </div>\n}\n", styles: [":host{display:flex;flex-direction:column;justify-content:center;align-items:stretch}:host>*{min-inline-size:320px;max-inline-size:680px;inline-size:100%;align-self:center}.file-list{overflow-y:auto}.file-info{display:flex;justify-content:center;flex-direction:column}.progress-value{inset-block-start:-1lh}.file{display:flex;position:relative;margin-block-end:8px;min-block-size:72px;transition:opacity calc(.5s * var(--element-animations-enabled, 1))}.fade-out{opacity:0}\n"], dependencies: [{ kind: "component", type: SiStatusIconComponent, selector: "si-status-icon", inputs: ["status"] }, { kind: "component", type: SiFileDropzoneComponent, selector: "si-file-dropzone", inputs: ["uploadDropText", "maxFileSizeText", "acceptText", "errorTextFileType", "errorTextFileMaxSize", "accept", "maxFileSize", "multiple", "directoryUpload"], outputs: ["filesAdded", "fileError"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiInlineNotificationComponent, selector: "si-inline-notification", inputs: ["severity", "heading", "message", "action", "translationParams", "embedded"] }, { kind: "component", type: SiProgressbarComponent, selector: "si-progressbar", inputs: ["ariaLabel", "max", "value", "heading", "progress", "height"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
875
887
|
}
|
|
876
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploaderComponent, decorators: [{
|
|
877
889
|
type: Component,
|
|
878
890
|
args: [{ selector: 'si-file-uploader', imports: [
|
|
879
891
|
SiStatusIconComponent,
|
|
@@ -882,19 +894,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
882
894
|
SiInlineNotificationComponent,
|
|
883
895
|
SiProgressbarComponent,
|
|
884
896
|
SiTranslatePipe
|
|
885
|
-
], changeDetection: ChangeDetectionStrategy.
|
|
886
|
-
}], ctorParameters: () => [], propDecorators: {
|
|
897
|
+
], changeDetection: ChangeDetectionStrategy.Eager, template: "<si-file-dropzone\n #dropZone\n [class]=\"autoUpload() ? 'mb-8' : 'mb-4'\"\n [uploadDropText]=\"uploadDropText()\"\n [multiple]=\"maxFiles() > 1\"\n [directoryUpload]=\"directoryUpload()\"\n [maxFileSizeText]=\"maxFileSizeText()\"\n [acceptText]=\"acceptText()\"\n [errorTextFileType]=\"errorTextFileType()\"\n [errorTextFileMaxSize]=\"errorTextFileMaxSize()\"\n [accept]=\"accept()\"\n [maxFileSize]=\"maxFileSize()\"\n (filesAdded)=\"handleFiles($event)\"\n/>\n\n@if (maxFilesReached()) {\n <si-inline-notification\n class=\"mb-4\"\n severity=\"info\"\n [message]=\"maxFilesReachedText()\"\n [translationParams]=\"{ maxFiles: maxFiles() }\"\n />\n}\n\n<div class=\"file-list\">\n @for (file of files(); track file) {\n <div class=\"file\" [class.fade-out]=\"file.fadeOut\">\n <si-icon class=\"icon align-self-center ms-6 me-4\" icon=\"element-document\" />\n <div class=\"flex-fill overflow-hidden mt-6\">\n <div class=\"file-info\">\n <div class=\"file-name text-truncate si-h5\">{{ file.fileName }}</div>\n <div class=\"file-size text-secondary\">{{ file.size }}</div>\n @if (file.errorText) {\n <div\n class=\"d-inline-flex gap-2 error text-truncate\"\n [class.text-warning]=\"file.status === 'invalid'\"\n [class.text-danger]=\"file.status === 'error'\"\n >\n <si-status-icon\n class=\"icon-sm\"\n [status]=\"file.status === 'invalid' ? 'warning' : 'danger'\"\n />\n {{ file.errorText | translate: file.errorParams }}\n @if (file.httpErrorText) {\n : {{ file.httpErrorText }}\n }\n </div>\n } @else {\n <div class=\"position-relative mt-1 mb-5\">\n <div class=\"position-absolute end-0 progress-value\">{{ file.progress }} %</div>\n <si-progressbar\n height=\"small\"\n [value]=\"file.progress\"\n [ariaLabel]=\"uploadingText() | translate\"\n />\n </div>\n }\n </div>\n </div>\n <div class=\"status align-self-center text-nowrap ps-4 pe-6\">\n @if (file.status === 'error') {\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary me-4\"\n [disabled]=\"!uploadEnabled()\"\n [title]=\"uploadButtonText() | translate\"\n [attr.aria-label]=\"uploadButtonText() | translate\"\n (click)=\"retryUpload(file)\"\n >\n <si-icon [icon]=\"icons.elementRedo\" />\n </button>\n }\n @if (file.status === 'added' || file.status === 'error' || file.status === 'invalid') {\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary-ghost\"\n [title]=\"removeButtonText() | translate\"\n [attr.aria-label]=\"removeButtonText() | translate\"\n (click)=\"removeFile($index)\"\n >\n <si-icon [icon]=\"icons.elementDelete\" />\n </button>\n }\n @if (file.status === 'uploading' || file.status === 'queued') {\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary\"\n [title]=\"cancelButtonText() | translate\"\n [attr.aria-label]=\"cancelButtonText() | translate\"\n (click)=\"cancelUpload(file)\"\n >\n <si-icon [icon]=\"icons.elementCancel\" />\n </button>\n }\n @if (file.status === 'success') {\n <si-status-icon class=\"icon mx-2\" status=\"success\" />\n }\n </div>\n </div>\n }\n</div>\n\n@if (!autoUpload()) {\n <div class=\"buttons text-end\">\n <button\n type=\"button\"\n class=\"btn btn-secondary me-4\"\n [disabled]=\"pending || !files().length\"\n (click)=\"reset()\"\n >{{ clearButtonText() | translate }}</button\n >\n <button\n type=\"button\"\n class=\"btn btn-primary\"\n [disabled]=\"!uploadEnabled()\"\n (click)=\"fileUpload()\"\n >{{ uploadButtonText() | translate }}</button\n >\n </div>\n}\n", styles: [":host{display:flex;flex-direction:column;justify-content:center;align-items:stretch}:host>*{min-inline-size:320px;max-inline-size:680px;inline-size:100%;align-self:center}.file-list{overflow-y:auto}.file-info{display:flex;justify-content:center;flex-direction:column}.progress-value{inset-block-start:-1lh}.file{display:flex;position:relative;margin-block-end:8px;min-block-size:72px;transition:opacity calc(.5s * var(--element-animations-enabled, 1))}.fade-out{opacity:0}\n"] }]
|
|
898
|
+
}], ctorParameters: () => [], propDecorators: { uploadDropText: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadDropText", required: false }] }], maxFileSizeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFileSizeText", required: false }] }], maxFilesReachedText: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFilesReachedText", required: false }] }], acceptText: [{ type: i0.Input, args: [{ isSignal: true, alias: "acceptText", required: false }] }], uploadButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadButtonText", required: false }] }], clearButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearButtonText", required: false }] }], uploadingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadingText", required: false }] }], removeButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeButtonText", required: false }] }], cancelButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelButtonText", required: false }] }], successTextTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "successTextTitle", required: false }] }], errorUploadFailed: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorUploadFailed", required: false }] }], showHttpError: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHttpError", required: false }] }], errorTextFileType: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorTextFileType", required: false }] }], errorTextFileMaxSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorTextFileMaxSize", required: false }] }], uploadConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadConfig", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], maxFileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFileSize", required: false }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], maxConcurrentUploads: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxConcurrentUploads", required: false }] }], retries: [{ type: i0.Input, args: [{ isSignal: true, alias: "retries", required: false }] }], autoUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoUpload", required: false }] }], disableUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableUpload", required: false }] }], directoryUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "directoryUpload", required: false }] }], uploadCanceled: [{ type: i0.Output, args: ["uploadCanceled"] }], uploadCompleted: [{ type: i0.Output, args: ["uploadCompleted"] }], filesChanges: [{ type: i0.Output, args: ["filesChanges"] }], dropZone: [{ type: i0.ViewChild, args: ['dropZone', { isSignal: true }] }] } });
|
|
887
899
|
|
|
888
900
|
/**
|
|
889
901
|
* Copyright (c) Siemens 2016 - 2026
|
|
890
902
|
* SPDX-License-Identifier: MIT
|
|
891
903
|
*/
|
|
892
904
|
class SiFileUploaderModule {
|
|
893
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
894
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
895
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
905
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
906
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploaderModule, imports: [SiFileDropzoneComponent, SiFileUploaderComponent, SiFileUploadDirective], exports: [SiFileDropzoneComponent, SiFileUploaderComponent, SiFileUploadDirective] });
|
|
907
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploaderModule, imports: [SiFileDropzoneComponent, SiFileUploaderComponent] });
|
|
896
908
|
}
|
|
897
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
909
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiFileUploaderModule, decorators: [{
|
|
898
910
|
type: NgModule,
|
|
899
911
|
args: [{
|
|
900
912
|
imports: [SiFileDropzoneComponent, SiFileUploaderComponent, SiFileUploadDirective],
|