@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
|
@@ -3,7 +3,7 @@ import { CdkTrapFocus, A11yModule } from '@angular/cdk/a11y';
|
|
|
3
3
|
import { BreakpointObserver } from '@angular/cdk/layout';
|
|
4
4
|
import { NgTemplateOutlet } from '@angular/common';
|
|
5
5
|
import * as i0 from '@angular/core';
|
|
6
|
-
import { input, signal, inject, Injector, viewChild, effect, untracked,
|
|
6
|
+
import { input, signal, inject, Injector, viewChild, effect, untracked, Component, HostListener, Directive, ElementRef, computed, afterNextRender, booleanAttribute, model, output } from '@angular/core';
|
|
7
7
|
import { toSignal, toObservable } from '@angular/core/rxjs-interop';
|
|
8
8
|
import { elementMenu, elementThumbnails, elementDown2, elementOptionsVertical, elementFavoritesFilled, elementFavorites, elementExport, elementCancel } from '@siemens/element-icons';
|
|
9
9
|
import { SI_HEADER_WITH_DROPDOWNS, SiHeaderDropdownTriggerDirective, SI_HEADER_DROPDOWN_OPTIONS } from '@siemens/element-ng/header-dropdown';
|
|
@@ -29,28 +29,36 @@ class SiApplicationHeaderComponent {
|
|
|
29
29
|
*
|
|
30
30
|
* @defaultValue 'sm'
|
|
31
31
|
*/
|
|
32
|
-
expandBreakpoint = input('sm',
|
|
33
|
-
|
|
32
|
+
expandBreakpoint = input('sm', /* @ts-ignore */
|
|
33
|
+
...(ngDevMode ? [{ debugName: "expandBreakpoint" }] : /* istanbul ignore next */ []));
|
|
34
|
+
launchpad = input(/* @ts-ignore */
|
|
35
|
+
...(ngDevMode ? [undefined, { debugName: "launchpad" }] : /* istanbul ignore next */ []));
|
|
34
36
|
/**
|
|
35
37
|
* @defaultValue
|
|
36
38
|
* ```
|
|
37
39
|
* t(() => $localize`:@@SI_APPLICATION_HEADER.LAUNCHPAD:Launchpad`)
|
|
38
40
|
* ```
|
|
39
41
|
*/
|
|
40
|
-
launchpadLabel = input(t(() => $localize `:@@SI_APPLICATION_HEADER.LAUNCHPAD:Launchpad`),
|
|
42
|
+
launchpadLabel = input(t(() => $localize `:@@SI_APPLICATION_HEADER.LAUNCHPAD:Launchpad`), /* @ts-ignore */
|
|
43
|
+
...(ngDevMode ? [{ debugName: "launchpadLabel" }] : /* istanbul ignore next */ []));
|
|
41
44
|
/** @internal */
|
|
42
45
|
closeMobileMenus = new Subject();
|
|
43
46
|
/** @internal */
|
|
44
|
-
mobileNavigationExpanded = signal(false,
|
|
47
|
+
mobileNavigationExpanded = signal(false, /* @ts-ignore */
|
|
48
|
+
...(ngDevMode ? [{ debugName: "mobileNavigationExpanded" }] : /* istanbul ignore next */ []));
|
|
45
49
|
/** @internal */
|
|
46
|
-
hasNavigation = signal(false,
|
|
47
|
-
|
|
48
|
-
|
|
50
|
+
hasNavigation = signal(false, /* @ts-ignore */
|
|
51
|
+
...(ngDevMode ? [{ debugName: "hasNavigation" }] : /* istanbul ignore next */ []));
|
|
52
|
+
openDropdownCount = signal(0, /* @ts-ignore */
|
|
53
|
+
...(ngDevMode ? [{ debugName: "openDropdownCount" }] : /* istanbul ignore next */ []));
|
|
54
|
+
launchpadOpen = signal(false, /* @ts-ignore */
|
|
55
|
+
...(ngDevMode ? [{ debugName: "launchpadOpen" }] : /* istanbul ignore next */ []));
|
|
49
56
|
id = `__si-application-header-${SiApplicationHeaderComponent.idCounter++}`;
|
|
50
57
|
toggleNavigation = t(() => $localize `:@@SI_APPLICATION_HEADER.TOGGLE_NAVIGATION:Toggle navigation`);
|
|
51
58
|
injector = inject(Injector);
|
|
52
59
|
icons = addIcons({ elementThumbnails, elementMenu });
|
|
53
|
-
navigationToggle = viewChild('navigationToggle',
|
|
60
|
+
navigationToggle = viewChild('navigationToggle', /* @ts-ignore */
|
|
61
|
+
...(ngDevMode ? [{ debugName: "navigationToggle" }] : /* istanbul ignore next */ []));
|
|
54
62
|
focusTrap = viewChild.required(CdkTrapFocus);
|
|
55
63
|
breakpointObserver = inject(BreakpointObserver);
|
|
56
64
|
openDropdown;
|
|
@@ -153,12 +161,12 @@ class SiApplicationHeaderComponent {
|
|
|
153
161
|
this.dropdownClosed();
|
|
154
162
|
}
|
|
155
163
|
}
|
|
156
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
157
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
164
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiApplicationHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
165
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiApplicationHeaderComponent, isStandalone: true, selector: "si-application-header", inputs: { expandBreakpoint: { classPropertyName: "expandBreakpoint", publicName: "expandBreakpoint", isSignal: true, isRequired: false, transformFunction: null }, launchpad: { classPropertyName: "launchpad", publicName: "launchpad", isSignal: true, isRequired: false, transformFunction: null }, launchpadLabel: { classPropertyName: "launchpadLabel", publicName: "launchpadLabel", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiApplicationHeaderComponent }], viewQueries: [{ propertyName: "navigationToggle", first: true, predicate: ["navigationToggle"], descendants: true, isSignal: true }, { propertyName: "focusTrap", first: true, predicate: CdkTrapFocus, descendants: true, isSignal: true }], ngImport: i0, template: "<header\n [class]=\"`application-header expand-${expandBreakpoint()}`\"\n [class.show-navigation]=\"mobileNavigationExpanded()\"\n>\n @if (launchpad()) {\n <button\n type=\"button\"\n aria-haspopup=\"dialog\"\n [class]=\"`header-toggle focus-inside d-${expandBreakpoint()}-block`\"\n [class.show]=\"launchpadOpen()\"\n [class.d-none]=\"hasNavigation()\"\n [attr.aria-expanded]=\"launchpadOpen()\"\n [attr.aria-label]=\"launchpadLabel() | translate\"\n [attr.aria-controls]=\"id + '-launchpad'\"\n (click)=\"toggleLaunchpad()\"\n >\n <si-icon class=\"icon-lg\" [icon]=\"icons.elementThumbnails\" />\n </button>\n }\n @if (hasNavigation()) {\n <button\n #navigationToggle\n type=\"button\"\n class=\"header-toggle focus-inside\"\n [class.show]=\"mobileNavigationExpanded()\"\n [attr.aria-expanded]=\"mobileNavigationExpanded()\"\n [attr.aria-label]=\"toggleNavigation | translate\"\n [attr.aria-controls]=\"id + '-navigation-wrapper'\"\n (click)=\"toggleMobileNavigationExpanded()\"\n >\n <si-icon class=\"icon-lg\" [icon]=\"icons.elementMenu\" />\n </button>\n }\n <ng-content select=\"si-header-brand, element-header-brand\">\n <div class=\"header-brand\"></div>\n </ng-content>\n\n <div\n class=\"d-contents\"\n [id]=\"id + '-navigation-wrapper'\"\n [cdkTrapFocus]=\"mobileNavigationExpanded()\"\n (keydown.escape)=\"navigationEscapePressed()\"\n >\n <ng-content select=\"si-header-navigation, element-header-navigation\">\n <div class=\"header-navigation\"></div>\n </ng-content>\n </div>\n\n <ng-content select=\"si-header-actions, element-header-actions\">\n <div class=\"header-actions\"></div>\n </ng-content>\n</header>\n\n@if (launchpadOpen() && launchpad()) {\n <div\n role=\"dialog\"\n aria-modal=\"true\"\n [id]=\"id + '-launchpad'\"\n [attr.aria-label]=\"launchpadLabel() | translate\"\n >\n <ng-template [ngTemplateOutlet]=\"launchpad()!\" [ngTemplateOutletInjector]=\"injector\" />\n </div>\n}\n\n@if (openDropdownCount() || launchpadOpen()) {\n <div\n [class]=\"`modal-backdrop ${launchpadOpen() ? 'd-block' : `d-${expandBreakpoint()}-none`}`\"\n (click)=\"backdropClicked()\"\n ></div>\n}\n", styles: [".modal-backdrop{z-index:1032}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
158
166
|
}
|
|
159
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiApplicationHeaderComponent, decorators: [{
|
|
160
168
|
type: Component,
|
|
161
|
-
args: [{ selector: 'si-application-header', imports: [SiTranslatePipe, A11yModule, NgTemplateOutlet, SiIconComponent], providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiApplicationHeaderComponent }],
|
|
169
|
+
args: [{ selector: 'si-application-header', imports: [SiTranslatePipe, A11yModule, NgTemplateOutlet, SiIconComponent], providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiApplicationHeaderComponent }], template: "<header\n [class]=\"`application-header expand-${expandBreakpoint()}`\"\n [class.show-navigation]=\"mobileNavigationExpanded()\"\n>\n @if (launchpad()) {\n <button\n type=\"button\"\n aria-haspopup=\"dialog\"\n [class]=\"`header-toggle focus-inside d-${expandBreakpoint()}-block`\"\n [class.show]=\"launchpadOpen()\"\n [class.d-none]=\"hasNavigation()\"\n [attr.aria-expanded]=\"launchpadOpen()\"\n [attr.aria-label]=\"launchpadLabel() | translate\"\n [attr.aria-controls]=\"id + '-launchpad'\"\n (click)=\"toggleLaunchpad()\"\n >\n <si-icon class=\"icon-lg\" [icon]=\"icons.elementThumbnails\" />\n </button>\n }\n @if (hasNavigation()) {\n <button\n #navigationToggle\n type=\"button\"\n class=\"header-toggle focus-inside\"\n [class.show]=\"mobileNavigationExpanded()\"\n [attr.aria-expanded]=\"mobileNavigationExpanded()\"\n [attr.aria-label]=\"toggleNavigation | translate\"\n [attr.aria-controls]=\"id + '-navigation-wrapper'\"\n (click)=\"toggleMobileNavigationExpanded()\"\n >\n <si-icon class=\"icon-lg\" [icon]=\"icons.elementMenu\" />\n </button>\n }\n <ng-content select=\"si-header-brand, element-header-brand\">\n <div class=\"header-brand\"></div>\n </ng-content>\n\n <div\n class=\"d-contents\"\n [id]=\"id + '-navigation-wrapper'\"\n [cdkTrapFocus]=\"mobileNavigationExpanded()\"\n (keydown.escape)=\"navigationEscapePressed()\"\n >\n <ng-content select=\"si-header-navigation, element-header-navigation\">\n <div class=\"header-navigation\"></div>\n </ng-content>\n </div>\n\n <ng-content select=\"si-header-actions, element-header-actions\">\n <div class=\"header-actions\"></div>\n </ng-content>\n</header>\n\n@if (launchpadOpen() && launchpad()) {\n <div\n role=\"dialog\"\n aria-modal=\"true\"\n [id]=\"id + '-launchpad'\"\n [attr.aria-label]=\"launchpadLabel() | translate\"\n >\n <ng-template [ngTemplateOutlet]=\"launchpad()!\" [ngTemplateOutletInjector]=\"injector\" />\n </div>\n}\n\n@if (openDropdownCount() || launchpadOpen()) {\n <div\n [class]=\"`modal-backdrop ${launchpadOpen() ? 'd-block' : `d-${expandBreakpoint()}-none`}`\"\n (click)=\"backdropClicked()\"\n ></div>\n}\n", styles: [".modal-backdrop{z-index:1032}\n"] }]
|
|
162
170
|
}], ctorParameters: () => [], propDecorators: { expandBreakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandBreakpoint", required: false }] }], launchpad: [{ type: i0.Input, args: [{ isSignal: true, alias: "launchpad", required: false }] }], launchpadLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "launchpadLabel", required: false }] }], navigationToggle: [{ type: i0.ViewChild, args: ['navigationToggle', { isSignal: true }] }], focusTrap: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkTrapFocus), { isSignal: true }] }] } });
|
|
163
171
|
|
|
164
172
|
/**
|
|
@@ -167,15 +175,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
167
175
|
*/
|
|
168
176
|
class SiAccountDetailsComponent {
|
|
169
177
|
/** The user's full name. */
|
|
170
|
-
name = input.required(
|
|
178
|
+
name = input.required(/* @ts-ignore */
|
|
179
|
+
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
171
180
|
/** The user's company name. */
|
|
172
|
-
company = input(
|
|
181
|
+
company = input(/* @ts-ignore */
|
|
182
|
+
...(ngDevMode ? [undefined, { debugName: "company" }] : /* istanbul ignore next */ []));
|
|
173
183
|
/** The user's email address. */
|
|
174
|
-
email = input(
|
|
184
|
+
email = input(/* @ts-ignore */
|
|
185
|
+
...(ngDevMode ? [undefined, { debugName: "email" }] : /* istanbul ignore next */ []));
|
|
175
186
|
/** The user's role. */
|
|
176
|
-
userRole = input(
|
|
177
|
-
|
|
178
|
-
static
|
|
187
|
+
userRole = input(/* @ts-ignore */
|
|
188
|
+
...(ngDevMode ? [undefined, { debugName: "userRole" }] : /* istanbul ignore next */ []));
|
|
189
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiAccountDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
190
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiAccountDetailsComponent, isStandalone: true, selector: "si-account-details", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, company: { classPropertyName: "company", publicName: "company", isSignal: true, isRequired: false, transformFunction: null }, email: { classPropertyName: "email", publicName: "email", isSignal: true, isRequired: false, transformFunction: null }, userRole: { classPropertyName: "userRole", publicName: "userRole", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
179
191
|
<div class="mx-5">
|
|
180
192
|
<div class="si-h5">{{ name() }}</div>
|
|
181
193
|
@if (email()) {
|
|
@@ -192,9 +204,9 @@ class SiAccountDetailsComponent {
|
|
|
192
204
|
</div>
|
|
193
205
|
}
|
|
194
206
|
</div>
|
|
195
|
-
`, isInline: true, dependencies: [{ kind: "pipe", type: SiTranslatePipe, name: "translate" }]
|
|
207
|
+
`, isInline: true, dependencies: [{ kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
196
208
|
}
|
|
197
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
209
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiAccountDetailsComponent, decorators: [{
|
|
198
210
|
type: Component,
|
|
199
211
|
args: [{
|
|
200
212
|
selector: 'si-account-details',
|
|
@@ -216,8 +228,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
216
228
|
</div>
|
|
217
229
|
}
|
|
218
230
|
</div>
|
|
219
|
-
|
|
220
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
231
|
+
`
|
|
221
232
|
}]
|
|
222
233
|
}], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], company: [{ type: i0.Input, args: [{ isSignal: true, alias: "company", required: false }] }], email: [{ type: i0.Input, args: [{ isSignal: true, alias: "email", required: false }] }], userRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "userRole", required: false }] }] } });
|
|
223
234
|
|
|
@@ -233,8 +244,8 @@ class SiHeaderNavigationItemComponent {
|
|
|
233
244
|
optional: true
|
|
234
245
|
});
|
|
235
246
|
icons = addIcons({ elementDown2 });
|
|
236
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
237
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
247
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
248
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiHeaderNavigationItemComponent, isStandalone: true, selector: "button[si-header-navigation-item], a[si-header-navigation-item]", host: { properties: { "class.dropdown-toggle": "!!dropdownTrigger" }, classAttribute: "header-item focus-inside" }, providers: [
|
|
238
249
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
239
250
|
], ngImport: i0, template: `
|
|
240
251
|
<div class="item-title">
|
|
@@ -243,9 +254,9 @@ class SiHeaderNavigationItemComponent {
|
|
|
243
254
|
@if (dropdownTrigger) {
|
|
244
255
|
<si-icon class="dropdown-caret" [icon]="icons.elementDown2" />
|
|
245
256
|
}
|
|
246
|
-
`, isInline: true, dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }]
|
|
257
|
+
`, isInline: true, dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }] });
|
|
247
258
|
}
|
|
248
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
259
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderNavigationItemComponent, decorators: [{
|
|
249
260
|
type: Component,
|
|
250
261
|
args: [{
|
|
251
262
|
// eslint-disable-next-line @angular-eslint/component-selector
|
|
@@ -262,7 +273,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
262
273
|
providers: [
|
|
263
274
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
264
275
|
],
|
|
265
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
266
276
|
host: {
|
|
267
277
|
class: 'header-item focus-inside',
|
|
268
278
|
'[class.dropdown-toggle]': '!!dropdownTrigger'
|
|
@@ -285,11 +295,14 @@ class SiHeaderCollapsibleActionsComponent {
|
|
|
285
295
|
* t(() => $localize`:@@SI_APPLICATION_HEADER.TOGGLE_ACTIONS:Toggle actions`)
|
|
286
296
|
* ```
|
|
287
297
|
*/
|
|
288
|
-
mobileToggleLabel = input(t(() => $localize `:@@SI_APPLICATION_HEADER.TOGGLE_ACTIONS:Toggle actions`),
|
|
298
|
+
mobileToggleLabel = input(t(() => $localize `:@@SI_APPLICATION_HEADER.TOGGLE_ACTIONS:Toggle actions`), /* @ts-ignore */
|
|
299
|
+
...(ngDevMode ? [{ debugName: "mobileToggleLabel" }] : /* istanbul ignore next */ []));
|
|
289
300
|
/** @internal **/
|
|
290
|
-
mobileExpanded = signal(false,
|
|
301
|
+
mobileExpanded = signal(false, /* @ts-ignore */
|
|
302
|
+
...(ngDevMode ? [{ debugName: "mobileExpanded" }] : /* istanbul ignore next */ []));
|
|
291
303
|
/** @internal **/
|
|
292
|
-
badgeCount = signal(0,
|
|
304
|
+
badgeCount = signal(0, /* @ts-ignore */
|
|
305
|
+
...(ngDevMode ? [{ debugName: "badgeCount" }] : /* istanbul ignore next */ []));
|
|
293
306
|
id = `__si-header-collapsible-actions-${SiHeaderCollapsibleActionsComponent.idCounter++}`;
|
|
294
307
|
icons = addIcons({ elementOptionsVertical });
|
|
295
308
|
toggle = viewChild.required('toggle');
|
|
@@ -326,16 +339,16 @@ class SiHeaderCollapsibleActionsComponent {
|
|
|
326
339
|
this.toggle().nativeElement.focus();
|
|
327
340
|
}
|
|
328
341
|
}
|
|
329
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
330
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
342
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderCollapsibleActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
343
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: SiHeaderCollapsibleActionsComponent, isStandalone: true, selector: "si-header-collapsible-actions", inputs: { mobileToggleLabel: { classPropertyName: "mobileToggleLabel", publicName: "mobileToggleLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "d-contents" }, providers: [
|
|
331
344
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
332
|
-
], viewQueries: [{ propertyName: "toggle", first: true, predicate: ["toggle"], descendants: true, isSignal: true }, { propertyName: "focusTrap", first: true, predicate: CdkTrapFocus, descendants: true, isSignal: true }], ngImport: i0, template: "<button\n #toggle\n type=\"button\"\n class=\"header-toggle focus-inside\"\n [class.show]=\"mobileExpanded()\"\n [attr.aria-expanded]=\"mobileExpanded()\"\n [attr.aria-label]=\"mobileToggleLabel() | translate\"\n [attr.aria-controls]=\"id + '-content'\"\n (click)=\"toggleMobileExpanded()\"\n>\n <si-icon class=\"icon-lg\" [icon]=\"icons.elementOptionsVertical\" [class.badge-dot]=\"badgeCount()\" />\n</button>\n<div\n class=\"header-collapsible-actions\"\n [id]=\"id + '-content'\"\n [class.show]=\"mobileExpanded()\"\n [cdkTrapFocus]=\"mobileExpanded()\"\n (keydown.escape)=\"escapePressed()\"\n>\n <ng-content />\n</div>\n", styles: [".badge-dot:after{inset-inline-end:4px}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }]
|
|
345
|
+
], viewQueries: [{ propertyName: "toggle", first: true, predicate: ["toggle"], descendants: true, isSignal: true }, { propertyName: "focusTrap", first: true, predicate: CdkTrapFocus, descendants: true, isSignal: true }], ngImport: i0, template: "<button\n #toggle\n type=\"button\"\n class=\"header-toggle focus-inside\"\n [class.show]=\"mobileExpanded()\"\n [attr.aria-expanded]=\"mobileExpanded()\"\n [attr.aria-label]=\"mobileToggleLabel() | translate\"\n [attr.aria-controls]=\"id + '-content'\"\n (click)=\"toggleMobileExpanded()\"\n>\n <si-icon class=\"icon-lg\" [icon]=\"icons.elementOptionsVertical\" [class.badge-dot]=\"badgeCount()\" />\n</button>\n<div\n class=\"header-collapsible-actions\"\n [id]=\"id + '-content'\"\n [class.show]=\"mobileExpanded()\"\n [cdkTrapFocus]=\"mobileExpanded()\"\n (keydown.escape)=\"escapePressed()\"\n>\n <ng-content />\n</div>\n", styles: [".badge-dot:after{inset-inline-end:4px}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
333
346
|
}
|
|
334
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
347
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderCollapsibleActionsComponent, decorators: [{
|
|
335
348
|
type: Component,
|
|
336
349
|
args: [{ selector: 'si-header-collapsible-actions', imports: [SiTranslatePipe, A11yModule, SiIconComponent], providers: [
|
|
337
350
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
338
|
-
],
|
|
351
|
+
], host: { class: 'd-contents' }, template: "<button\n #toggle\n type=\"button\"\n class=\"header-toggle focus-inside\"\n [class.show]=\"mobileExpanded()\"\n [attr.aria-expanded]=\"mobileExpanded()\"\n [attr.aria-label]=\"mobileToggleLabel() | translate\"\n [attr.aria-controls]=\"id + '-content'\"\n (click)=\"toggleMobileExpanded()\"\n>\n <si-icon class=\"icon-lg\" [icon]=\"icons.elementOptionsVertical\" [class.badge-dot]=\"badgeCount()\" />\n</button>\n<div\n class=\"header-collapsible-actions\"\n [id]=\"id + '-content'\"\n [class.show]=\"mobileExpanded()\"\n [cdkTrapFocus]=\"mobileExpanded()\"\n (keydown.escape)=\"escapePressed()\"\n>\n <ng-content />\n</div>\n", styles: [".badge-dot:after{inset-inline-end:4px}\n"] }]
|
|
339
352
|
}], propDecorators: { mobileToggleLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileToggleLabel", required: false }] }], toggle: [{ type: i0.ViewChild, args: ['toggle', { isSignal: true }] }], focusTrap: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkTrapFocus), { isSignal: true }] }] } });
|
|
340
353
|
|
|
341
354
|
/**
|
|
@@ -366,10 +379,10 @@ class SiHeaderActionItemBase {
|
|
|
366
379
|
queueMicrotask(() => this.header.closeMobileMenus.next());
|
|
367
380
|
}
|
|
368
381
|
}
|
|
369
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
370
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
382
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionItemBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
383
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: SiHeaderActionItemBase, isStandalone: true, host: { listeners: { "click": "click()" } }, ngImport: i0 });
|
|
371
384
|
}
|
|
372
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
385
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionItemBase, decorators: [{
|
|
373
386
|
type: Directive,
|
|
374
387
|
args: [{}]
|
|
375
388
|
}], propDecorators: { click: [{
|
|
@@ -392,17 +405,20 @@ class SiHeaderActionIconItemBase extends SiHeaderActionItemBase {
|
|
|
392
405
|
* - =number, the number will be shown and automatically trimmed if \>99
|
|
393
406
|
* - =true, an empty red dot will be shown
|
|
394
407
|
*/
|
|
395
|
-
badge = input(
|
|
408
|
+
badge = input(/* @ts-ignore */
|
|
409
|
+
...(ngDevMode ? [undefined, { debugName: "badge" }] : /* istanbul ignore next */ []));
|
|
396
410
|
tooltipService = inject(SiTooltipService);
|
|
397
411
|
elementRef = inject(ElementRef);
|
|
398
412
|
existingTooltip = inject(SiTooltipDirective, { optional: true, host: true });
|
|
399
|
-
badgeDot = computed(() => typeof this.badge() === 'boolean' ? this.badge() : false,
|
|
413
|
+
badgeDot = computed(() => typeof this.badge() === 'boolean' ? this.badge() : false, /* @ts-ignore */
|
|
414
|
+
...(ngDevMode ? [{ debugName: "badgeDot" }] : /* istanbul ignore next */ []));
|
|
400
415
|
badgeValue = computed(() => {
|
|
401
416
|
const badge = this.badge();
|
|
402
417
|
return typeof badge === 'number'
|
|
403
418
|
? `${badge > 99 ? '+' : ''}${Math.min(99, Math.round(badge))}`
|
|
404
419
|
: undefined;
|
|
405
|
-
},
|
|
420
|
+
}, /* @ts-ignore */
|
|
421
|
+
...(ngDevMode ? [{ debugName: "badgeValue" }] : /* istanbul ignore next */ []));
|
|
406
422
|
constructor() {
|
|
407
423
|
super();
|
|
408
424
|
effect(onCleanup => this.setupTooltip(onCleanup));
|
|
@@ -431,11 +447,12 @@ class SiHeaderActionIconItemBase extends SiHeaderActionItemBase {
|
|
|
431
447
|
}
|
|
432
448
|
}
|
|
433
449
|
}
|
|
434
|
-
visuallyHideTitle = computed(() => !this.collapsibleActions?.mobileExpanded(),
|
|
435
|
-
|
|
436
|
-
static
|
|
450
|
+
visuallyHideTitle = computed(() => !this.collapsibleActions?.mobileExpanded(), /* @ts-ignore */
|
|
451
|
+
...(ngDevMode ? [{ debugName: "visuallyHideTitle" }] : /* istanbul ignore next */ []));
|
|
452
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionIconItemBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
453
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: SiHeaderActionIconItemBase, isStandalone: true, inputs: { badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
|
|
437
454
|
}
|
|
438
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
455
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionIconItemBase, decorators: [{
|
|
439
456
|
type: Directive,
|
|
440
457
|
args: [{}]
|
|
441
458
|
}], ctorParameters: () => [], propDecorators: { badge: [{ type: i0.Input, args: [{ isSignal: true, alias: "badge", required: false }] }] } });
|
|
@@ -447,14 +464,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
447
464
|
/** Adds an action item to the header. Should be located inside `.header-actions`. */
|
|
448
465
|
class SiHeaderActionItemComponent extends SiHeaderActionIconItemBase {
|
|
449
466
|
/** The icon to be shown. */
|
|
450
|
-
icon = input.required(
|
|
467
|
+
icon = input.required(/* @ts-ignore */
|
|
468
|
+
...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
451
469
|
itemTitle = viewChild.required('itemTitle');
|
|
452
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
453
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
470
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
471
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiHeaderActionItemComponent, isStandalone: true, selector: "button[si-header-action-item], a[si-header-action-item]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.dropdown-toggle": "!!dropdownTrigger" }, classAttribute: "header-item focus-inside" }, providers: [SiTooltipService], viewQueries: [{ propertyName: "itemTitle", first: true, predicate: ["itemTitle"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<si-icon class=\"icon-lg\" [class.badge-dot]=\"badgeDot()\" [icon]=\"icon()\" />\n@if (badgeValue()) {\n <span class=\"badge-text\">{{ badgeValue() }}</span>\n}\n<ng-content select=\"si-avatar\" />\n<div #itemTitle class=\"item-title\" [class.visually-hidden]=\"visuallyHideTitle()\">\n <ng-content />\n</div>\n@if (dropdownTrigger) {\n <si-icon class=\"dropdown-caret\" [icon]=\"icons.elementDown2\" />\n}\n", dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }] });
|
|
454
472
|
}
|
|
455
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
473
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionItemComponent, decorators: [{
|
|
456
474
|
type: Component,
|
|
457
|
-
args: [{ selector: 'button[si-header-action-item], a[si-header-action-item]', imports: [SiIconComponent], providers: [SiTooltipService],
|
|
475
|
+
args: [{ selector: 'button[si-header-action-item], a[si-header-action-item]', imports: [SiIconComponent], providers: [SiTooltipService], host: {
|
|
458
476
|
class: 'header-item focus-inside',
|
|
459
477
|
'[class.dropdown-toggle]': '!!dropdownTrigger'
|
|
460
478
|
}, template: "<si-icon class=\"icon-lg\" [class.badge-dot]=\"badgeDot()\" [icon]=\"icon()\" />\n@if (badgeValue()) {\n <span class=\"badge-text\">{{ badgeValue() }}</span>\n}\n<ng-content select=\"si-avatar\" />\n<div #itemTitle class=\"item-title\" [class.visually-hidden]=\"visuallyHideTitle()\">\n <ng-content />\n</div>\n@if (dropdownTrigger) {\n <si-icon class=\"dropdown-caret\" [icon]=\"icons.elementDown2\" />\n}\n" }]
|
|
@@ -467,18 +485,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
467
485
|
/** Adds an account item to the header. Should be located inside `.header-actions`. */
|
|
468
486
|
class SiHeaderAccountItemComponent extends SiHeaderActionIconItemBase {
|
|
469
487
|
/** Name of the account. */
|
|
470
|
-
name = input.required(
|
|
488
|
+
name = input.required(/* @ts-ignore */
|
|
489
|
+
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
471
490
|
/** Initials of the account. If not provided, they will be calculated. */
|
|
472
|
-
initials = input(
|
|
491
|
+
initials = input(/* @ts-ignore */
|
|
492
|
+
...(ngDevMode ? [undefined, { debugName: "initials" }] : /* istanbul ignore next */ []));
|
|
473
493
|
/** URL to an image which should be shown instead of the initials. */
|
|
474
|
-
imageUrl = input(
|
|
494
|
+
imageUrl = input(/* @ts-ignore */
|
|
495
|
+
...(ngDevMode ? [undefined, { debugName: "imageUrl" }] : /* istanbul ignore next */ []));
|
|
475
496
|
itemTitle = this.name;
|
|
476
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
477
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
497
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderAccountItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
498
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiHeaderAccountItemComponent, isStandalone: true, selector: "button[si-header-account-item]", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, initials: { classPropertyName: "initials", publicName: "initials", isSignal: true, isRequired: false, transformFunction: null }, imageUrl: { classPropertyName: "imageUrl", publicName: "imageUrl", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.dropdown-toggle": "!!dropdownTrigger" }, classAttribute: "header-item focus-inside px-4 py-0" }, providers: [SiTooltipService], usesInheritance: true, ngImport: i0, template: "<si-avatar\n size=\"small\"\n color=\"0\"\n [altText]=\"name()\"\n [initials]=\"initials()\"\n [imageUrl]=\"imageUrl()\"\n/>\n<div class=\"item-title\" aria-hidden=\"true\" [class.d-none]=\"visuallyHideTitle()\">\n {{ name() }}\n</div>\n@if (badgeValue()) {\n <div class=\"badge-text\">{{ badgeValue() }}</div>\n}\n@if (dropdownTrigger) {\n <si-icon class=\"dropdown-caret\" [icon]=\"icons.elementDown2\" />\n}\n", styles: ["si-avatar.small{--avatar-size: calc(1.5rem + 8px) }\n"], dependencies: [{ kind: "component", type: SiAvatarComponent, selector: "si-avatar", inputs: ["size", "imageUrl", "icon", "initials", "color", "altText", "status", "statusAriaLabel"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }] });
|
|
478
499
|
}
|
|
479
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
500
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderAccountItemComponent, decorators: [{
|
|
480
501
|
type: Component,
|
|
481
|
-
args: [{ selector: 'button[si-header-account-item]', imports: [SiAvatarComponent, SiIconComponent], providers: [SiTooltipService],
|
|
502
|
+
args: [{ selector: 'button[si-header-account-item]', imports: [SiAvatarComponent, SiIconComponent], providers: [SiTooltipService], host: {
|
|
482
503
|
class: 'header-item focus-inside px-4 py-0',
|
|
483
504
|
'[class.dropdown-toggle]': '!!dropdownTrigger'
|
|
484
505
|
}, template: "<si-avatar\n size=\"small\"\n color=\"0\"\n [altText]=\"name()\"\n [initials]=\"initials()\"\n [imageUrl]=\"imageUrl()\"\n/>\n<div class=\"item-title\" aria-hidden=\"true\" [class.d-none]=\"visuallyHideTitle()\">\n {{ name() }}\n</div>\n@if (badgeValue()) {\n <div class=\"badge-text\">{{ badgeValue() }}</div>\n}\n@if (dropdownTrigger) {\n <si-icon class=\"dropdown-caret\" [icon]=\"icons.elementDown2\" />\n}\n", styles: ["si-avatar.small{--avatar-size: calc(1.5rem + 8px) }\n"] }]
|
|
@@ -494,13 +515,14 @@ class SiHeaderSelectionItemComponent extends SiHeaderActionItemBase {
|
|
|
494
515
|
*
|
|
495
516
|
* @defaultValue false
|
|
496
517
|
*/
|
|
497
|
-
open = input(false,
|
|
498
|
-
|
|
499
|
-
static
|
|
518
|
+
open = input(false, /* @ts-ignore */
|
|
519
|
+
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
520
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderSelectionItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
521
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: SiHeaderSelectionItemComponent, isStandalone: true, selector: "button[si-header-selection-item]", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.show": "open()" }, classAttribute: "header-item header-selection-item focus-inside dropdown-toggle" }, usesInheritance: true, ngImport: i0, template: "<div class=\"item-title\">\n <ng-content />\n</div>\n<si-icon class=\"d-block dropdown-caret\" [icon]=\"icons.elementDown2\" />\n", dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }] });
|
|
500
522
|
}
|
|
501
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
523
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderSelectionItemComponent, decorators: [{
|
|
502
524
|
type: Component,
|
|
503
|
-
args: [{ selector: 'button[si-header-selection-item]', imports: [SiIconComponent],
|
|
525
|
+
args: [{ selector: 'button[si-header-selection-item]', imports: [SiIconComponent], host: {
|
|
504
526
|
class: 'header-item header-selection-item focus-inside dropdown-toggle',
|
|
505
527
|
'[class.show]': 'open()'
|
|
506
528
|
}, template: "<div class=\"item-title\">\n <ng-content />\n</div>\n<si-icon class=\"d-block dropdown-caret\" [icon]=\"icons.elementDown2\" />\n" }]
|
|
@@ -512,7 +534,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
512
534
|
*/
|
|
513
535
|
/** The siemens logo. Should be located inside `.header-brand`. */
|
|
514
536
|
class SiHeaderLogoDirective {
|
|
515
|
-
logoText = signal(undefined,
|
|
537
|
+
logoText = signal(undefined, /* @ts-ignore */
|
|
538
|
+
...(ngDevMode ? [{ debugName: "logoText" }] : /* istanbul ignore next */ []));
|
|
516
539
|
elementRef = inject(ElementRef);
|
|
517
540
|
injector = inject(Injector);
|
|
518
541
|
ngOnInit() {
|
|
@@ -526,10 +549,10 @@ class SiHeaderLogoDirective {
|
|
|
526
549
|
.replace(/^["']|["']$/g, ''))
|
|
527
550
|
}, { injector: this.injector });
|
|
528
551
|
}
|
|
529
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
530
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
552
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderLogoDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
553
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: SiHeaderLogoDirective, isStandalone: true, selector: "si-header-logo, [siHeaderLogo]", host: { listeners: { "window:theme-switch": "updateLogoText()" }, properties: { "attr.aria-label": "logoText()" }, classAttribute: "header-logo px-6 focus-inside" }, ngImport: i0 });
|
|
531
554
|
}
|
|
532
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
555
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderLogoDirective, decorators: [{
|
|
533
556
|
type: Directive,
|
|
534
557
|
args: [{
|
|
535
558
|
selector: 'si-header-logo, [siHeaderLogo]',
|
|
@@ -543,47 +566,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
543
566
|
args: ['window:theme-switch']
|
|
544
567
|
}] } });
|
|
545
568
|
|
|
546
|
-
/**
|
|
547
|
-
* Copyright (c) Siemens 2016 - 2026
|
|
548
|
-
* SPDX-License-Identifier: MIT
|
|
549
|
-
*/
|
|
550
|
-
/**
|
|
551
|
-
* The siemens logo.
|
|
552
|
-
* Should be located inside `.header-brand`.
|
|
553
|
-
*
|
|
554
|
-
* @deprecated Use the {@link SiHeaderLogoDirective} instead.
|
|
555
|
-
* The new component will use the logo provided by the global theme instead
|
|
556
|
-
* of containing a hard coded siemens logo.
|
|
557
|
-
* ```html
|
|
558
|
-
* // previous
|
|
559
|
-
* <a si-header-siemens-logo routerLink="/" aria-label="Siemens" class="d-none d-md-flex"></a>
|
|
560
|
-
* // new
|
|
561
|
-
* <a siHeaderLogo routerLink="/" class="d-none d-md-flex"></a>
|
|
562
|
-
* ```
|
|
563
|
-
*
|
|
564
|
-
*/
|
|
565
|
-
class SiHeaderSiemensLogoComponent extends SiHeaderLogoDirective {
|
|
566
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiHeaderSiemensLogoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
567
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiHeaderSiemensLogoComponent, isStandalone: true, selector: "si-header-siemens-logo, [si-header-siemens-logo]", usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
568
|
-
}
|
|
569
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiHeaderSiemensLogoComponent, decorators: [{
|
|
570
|
-
type: Component,
|
|
571
|
-
args: [{
|
|
572
|
-
selector: 'si-header-siemens-logo, [si-header-siemens-logo]',
|
|
573
|
-
template: '',
|
|
574
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
575
|
-
}]
|
|
576
|
-
}] });
|
|
577
|
-
|
|
578
569
|
/**
|
|
579
570
|
* Copyright (c) Siemens 2016 - 2026
|
|
580
571
|
* SPDX-License-Identifier: MIT
|
|
581
572
|
*/
|
|
582
573
|
class SiHeaderActionsDirective {
|
|
583
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
584
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
574
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
575
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: SiHeaderActionsDirective, isStandalone: true, selector: "si-header-actions", host: { classAttribute: "header-actions" }, ngImport: i0 });
|
|
585
576
|
}
|
|
586
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
577
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionsDirective, decorators: [{
|
|
587
578
|
type: Directive,
|
|
588
579
|
args: [{
|
|
589
580
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -597,10 +588,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
597
588
|
* SPDX-License-Identifier: MIT
|
|
598
589
|
*/
|
|
599
590
|
class SiHeaderBrandDirective {
|
|
600
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
601
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
591
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderBrandDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
592
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: SiHeaderBrandDirective, isStandalone: true, selector: "si-header-brand", host: { classAttribute: "header-brand" }, ngImport: i0 });
|
|
602
593
|
}
|
|
603
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
594
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderBrandDirective, decorators: [{
|
|
604
595
|
type: Directive,
|
|
605
596
|
args: [{
|
|
606
597
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -622,12 +613,12 @@ class SiHeaderNavigationComponent {
|
|
|
622
613
|
ngOnDestroy() {
|
|
623
614
|
this.header.hasNavigation.set(false);
|
|
624
615
|
}
|
|
625
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
626
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
616
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
617
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiHeaderNavigationComponent, isStandalone: true, selector: "si-header-navigation", host: { attributes: { "role": "navigation" }, classAttribute: "header-navigation" }, ngImport: i0, template: "@if (header.launchpad()) {\n <button\n type=\"button\"\n [class]=\"`header-item focus-inside d-${header.expandBreakpoint()}-none`\"\n (click)=\"header.openLaunchpad()\"\n >\n <si-icon class=\"icon-lg pe-5\" [icon]=\"icons.elementThumbnails\" />\n {{ header.launchpadLabel() | translate }}\n </button>\n}\n<ng-content />\n", dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
627
618
|
}
|
|
628
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
619
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderNavigationComponent, decorators: [{
|
|
629
620
|
type: Component,
|
|
630
|
-
args: [{ selector: 'si-header-navigation', imports: [SiTranslatePipe, SiIconComponent],
|
|
621
|
+
args: [{ selector: 'si-header-navigation', imports: [SiTranslatePipe, SiIconComponent], host: { class: 'header-navigation', role: 'navigation' }, template: "@if (header.launchpad()) {\n <button\n type=\"button\"\n [class]=\"`header-item focus-inside d-${header.expandBreakpoint()}-none`\"\n (click)=\"header.openLaunchpad()\"\n >\n <si-icon class=\"icon-lg pe-5\" [icon]=\"icons.elementThumbnails\" />\n {{ header.launchpadLabel() | translate }}\n </button>\n}\n<ng-content />\n" }]
|
|
631
622
|
}], ctorParameters: () => [] });
|
|
632
623
|
|
|
633
624
|
/**
|
|
@@ -636,17 +627,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
636
627
|
*/
|
|
637
628
|
class SiLaunchpadAppComponent {
|
|
638
629
|
/** @defaultValue false */
|
|
639
|
-
external = input(false, { ...(ngDevMode ? { debugName: "external" } : {}), transform: booleanAttribute });
|
|
630
|
+
external = input(false, { ...(ngDevMode ? { debugName: "external" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
640
631
|
/** @defaultValue false */
|
|
641
|
-
active = input(false, { ...(ngDevMode ? { debugName: "active" } : {}), transform: booleanAttribute });
|
|
632
|
+
active = input(false, { ...(ngDevMode ? { debugName: "active" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
642
633
|
/** @defaultValue false */
|
|
643
|
-
enableFavoriteToggle = input(false, { ...(ngDevMode ? { debugName: "enableFavoriteToggle" } : {}), transform: booleanAttribute });
|
|
634
|
+
enableFavoriteToggle = input(false, { ...(ngDevMode ? { debugName: "enableFavoriteToggle" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
644
635
|
/** @defaultValue false */
|
|
645
|
-
favorite = model(false,
|
|
636
|
+
favorite = model(false, /* @ts-ignore */
|
|
637
|
+
...(ngDevMode ? [{ debugName: "favorite" }] : /* istanbul ignore next */ []));
|
|
646
638
|
/** @defaultValue false */
|
|
647
|
-
action = input(false, { ...(ngDevMode ? { debugName: "action" } : {}), transform: booleanAttribute });
|
|
648
|
-
iconUrl = input(
|
|
649
|
-
|
|
639
|
+
action = input(false, { ...(ngDevMode ? { debugName: "action" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
640
|
+
iconUrl = input(/* @ts-ignore */
|
|
641
|
+
...(ngDevMode ? [undefined, { debugName: "iconUrl" }] : /* istanbul ignore next */ []));
|
|
642
|
+
iconClass = input(/* @ts-ignore */
|
|
643
|
+
...(ngDevMode ? [undefined, { debugName: "iconClass" }] : /* istanbul ignore next */ []));
|
|
650
644
|
/**
|
|
651
645
|
* Aria-label for the external link icon.
|
|
652
646
|
*
|
|
@@ -655,7 +649,8 @@ class SiLaunchpadAppComponent {
|
|
|
655
649
|
* t(() => $localize`:@@SI_LAUNCHPAD.EXTERNAL_LINK:External application`)
|
|
656
650
|
* ```
|
|
657
651
|
*/
|
|
658
|
-
externalLinkText = input(t(() => $localize `:@@SI_LAUNCHPAD.EXTERNAL_LINK:External application`),
|
|
652
|
+
externalLinkText = input(t(() => $localize `:@@SI_LAUNCHPAD.EXTERNAL_LINK:External application`), /* @ts-ignore */
|
|
653
|
+
...(ngDevMode ? [{ debugName: "externalLinkText" }] : /* istanbul ignore next */ []));
|
|
659
654
|
icons = addIcons({ elementExport, elementFavorites, elementFavoritesFilled });
|
|
660
655
|
header = inject(SiApplicationHeaderComponent);
|
|
661
656
|
favoriteClicked(event) {
|
|
@@ -666,12 +661,12 @@ class SiLaunchpadAppComponent {
|
|
|
666
661
|
click() {
|
|
667
662
|
this.header.closeLaunchpad();
|
|
668
663
|
}
|
|
669
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
670
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
664
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiLaunchpadAppComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
665
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiLaunchpadAppComponent, isStandalone: true, selector: "a[si-launchpad-app]", inputs: { external: { classPropertyName: "external", publicName: "external", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, enableFavoriteToggle: { classPropertyName: "enableFavoriteToggle", publicName: "enableFavoriteToggle", isSignal: true, isRequired: false, transformFunction: null }, favorite: { classPropertyName: "favorite", publicName: "favorite", isSignal: true, isRequired: false, transformFunction: null }, action: { classPropertyName: "action", publicName: "action", isSignal: true, isRequired: false, transformFunction: null }, iconUrl: { classPropertyName: "iconUrl", publicName: "iconUrl", isSignal: true, isRequired: false, transformFunction: null }, iconClass: { classPropertyName: "iconClass", publicName: "iconClass", isSignal: true, isRequired: false, transformFunction: null }, externalLinkText: { classPropertyName: "externalLinkText", publicName: "externalLinkText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { favorite: "favoriteChange" }, host: { listeners: { "keydown.space": "favoriteClicked($event)", "click": "click()" }, properties: { "class.active": "active()", "class.action": "action()" }, classAttribute: "focus-inside" }, ngImport: i0, template: "@if (iconUrl()) {\n <img alt=\"\" width=\"64\" height=\"64\" class=\"app-icon\" [src]=\"iconUrl()\" />\n} @else if (iconClass()) {\n <si-icon class=\"app-icon\" [icon]=\"iconClass()!\" />\n}\n<div class=\"app-text\">\n <div class=\"si-h4 d-flex align-items-center mw-100 gap-1\">\n <span class=\"text-truncate\">\n <ng-content select=\"[app-name]\" />\n </span>\n @if (external()) {\n <si-icon\n class=\"icon\"\n [icon]=\"icons.elementExport\"\n [attr.aria-label]=\"externalLinkText() | translate\"\n />\n }\n </div>\n <div class=\"si-body text-secondary mt-2 text-truncate mw-100\">\n <ng-content select=\"[app-systemName]\" />\n </div>\n</div>\n@if (enableFavoriteToggle()) {\n <si-icon\n class=\"icon favorite-icon\"\n [class.is-favorite]=\"favorite()\"\n [icon]=\"favorite() ? icons.elementFavoritesFilled : icons.elementFavorites\"\n (click)=\"favoriteClicked($event)\"\n />\n}\n", styles: [":host{display:flex;align-items:center;flex-flow:column nowrap;position:relative;padding-block:24px;inline-size:calc(7rem + 40px);max-inline-size:calc(7rem + 40px);padding-inline:8px;color:var(--element-text-primary);border-radius:var(--element-radius-2)}:host.action{color:var(--element-action-primary)}:host.active,:host:hover{color:var(--element-text-primary);text-decoration:none}:host.active{background-color:var(--element-base-1-selected)}:host:hover{background-color:var(--element-base-1-hover)}.app-text{display:flex;align-items:center;flex-direction:column;max-inline-size:100%;overflow:hidden}.app-icon{display:flex;align-items:center;justify-content:center;inline-size:3rem;block-size:3rem;margin-block-end:8px;border-radius:var(--element-radius-2)}.app-icon:is(si-icon){background:var(--element-launchpad-app-background);font-size:2.5rem;padding:4px;color:var(--element-launchpad-app-color)}.favorite-icon{position:absolute;inset-inline-end:16px;inset-block-start:16px;color:var(--element-text-primary)}.is-favorite{color:var(--element-status-caution)}@media(max-width:767.98px){:host{flex-flow:row nowrap;inline-size:100%;max-inline-size:100%;padding:8px}:host:has(.favorite-icon){padding-inline-end:32px}.app-icon{margin-block-end:0;margin-inline-end:8px}.app-text{align-items:start}.favorite-icon{inset-inline-end:8px;inset-block-start:8px}}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
671
666
|
}
|
|
672
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
667
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiLaunchpadAppComponent, decorators: [{
|
|
673
668
|
type: Component,
|
|
674
|
-
args: [{ selector: 'a[si-launchpad-app]', imports: [SiIconComponent, SiTranslatePipe],
|
|
669
|
+
args: [{ selector: 'a[si-launchpad-app]', imports: [SiIconComponent, SiTranslatePipe], host: {
|
|
675
670
|
class: 'focus-inside',
|
|
676
671
|
'[class.active]': 'active()',
|
|
677
672
|
'[class.action]': 'action()'
|
|
@@ -697,7 +692,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
697
692
|
* t(() => $localize`:@@SI_LAUNCHPAD.CLOSE:Close launchpad`)
|
|
698
693
|
* ```
|
|
699
694
|
*/
|
|
700
|
-
closeText = input(t(() => $localize `:@@SI_LAUNCHPAD.CLOSE:Close launchpad`),
|
|
695
|
+
closeText = input(t(() => $localize `:@@SI_LAUNCHPAD.CLOSE:Close launchpad`), /* @ts-ignore */
|
|
696
|
+
...(ngDevMode ? [{ debugName: "closeText" }] : /* istanbul ignore next */ []));
|
|
701
697
|
/**
|
|
702
698
|
* Title of the launchpad.
|
|
703
699
|
*
|
|
@@ -706,20 +702,23 @@ class SiLaunchpadFactoryComponent {
|
|
|
706
702
|
* t(() => $localize`:@@SI_LAUNCHPAD.TITLE:Switch applications`)
|
|
707
703
|
* ```
|
|
708
704
|
*/
|
|
709
|
-
titleText = input(t(() => $localize `:@@SI_LAUNCHPAD.TITLE:Switch applications`),
|
|
705
|
+
titleText = input(t(() => $localize `:@@SI_LAUNCHPAD.TITLE:Switch applications`), /* @ts-ignore */
|
|
706
|
+
...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
710
707
|
/**
|
|
711
708
|
* Subtitle of the launchpad.
|
|
712
709
|
* When not provided, no subtitle is displayed.
|
|
713
710
|
*/
|
|
714
|
-
subtitleText = input(
|
|
711
|
+
subtitleText = input(/* @ts-ignore */
|
|
712
|
+
...(ngDevMode ? [undefined, { debugName: "subtitleText" }] : /* istanbul ignore next */ []));
|
|
715
713
|
/** All app items shown in the launchpad. */
|
|
716
|
-
apps = input.required(
|
|
714
|
+
apps = input.required(/* @ts-ignore */
|
|
715
|
+
...(ngDevMode ? [{ debugName: "apps" }] : /* istanbul ignore next */ []));
|
|
717
716
|
/**
|
|
718
717
|
* Allow the user to select favorite apps which will then be displayed at the top.
|
|
719
718
|
*
|
|
720
719
|
* @defaultValue false
|
|
721
720
|
*/
|
|
722
|
-
enableFavorites = input(false, { ...(ngDevMode ? { debugName: "enableFavorites" } : {}), transform: booleanAttribute });
|
|
721
|
+
enableFavorites = input(false, { ...(ngDevMode ? { debugName: "enableFavorites" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
723
722
|
/**
|
|
724
723
|
* Title of the favorite apps section.
|
|
725
724
|
*
|
|
@@ -728,7 +727,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
728
727
|
* t(() => $localize`:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorites`)
|
|
729
728
|
* ```
|
|
730
729
|
*/
|
|
731
|
-
favoriteAppsText = input(t(() => $localize `:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorites`),
|
|
730
|
+
favoriteAppsText = input(t(() => $localize `:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorites`), /* @ts-ignore */
|
|
731
|
+
...(ngDevMode ? [{ debugName: "favoriteAppsText" }] : /* istanbul ignore next */ []));
|
|
732
732
|
/**
|
|
733
733
|
* Title of the show more apps button.
|
|
734
734
|
*
|
|
@@ -737,7 +737,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
737
737
|
* t(() => $localize`:@@SI_LAUNCHPAD.SHOW_MORE:Show more`)
|
|
738
738
|
* ```
|
|
739
739
|
*/
|
|
740
|
-
showMoreAppsText = input(t(() => $localize `:@@SI_LAUNCHPAD.SHOW_MORE:Show more`),
|
|
740
|
+
showMoreAppsText = input(t(() => $localize `:@@SI_LAUNCHPAD.SHOW_MORE:Show more`), /* @ts-ignore */
|
|
741
|
+
...(ngDevMode ? [{ debugName: "showMoreAppsText" }] : /* istanbul ignore next */ []));
|
|
741
742
|
/**
|
|
742
743
|
* Title of the show less apps button.
|
|
743
744
|
*
|
|
@@ -746,7 +747,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
746
747
|
* t(() => $localize`:@@SI_LAUNCHPAD.SHOW_LESS:Show less`)
|
|
747
748
|
* ```
|
|
748
749
|
*/
|
|
749
|
-
showLessAppsText = input(t(() => $localize `:@@SI_LAUNCHPAD.SHOW_LESS:Show less`),
|
|
750
|
+
showLessAppsText = input(t(() => $localize `:@@SI_LAUNCHPAD.SHOW_LESS:Show less`), /* @ts-ignore */
|
|
751
|
+
...(ngDevMode ? [{ debugName: "showLessAppsText" }] : /* istanbul ignore next */ []));
|
|
750
752
|
favoriteChange = output();
|
|
751
753
|
showAllApps = false;
|
|
752
754
|
categories = computed(() => {
|
|
@@ -766,11 +768,14 @@ class SiLaunchpadFactoryComponent {
|
|
|
766
768
|
categories.push({ name: '', apps: [...apps] });
|
|
767
769
|
}
|
|
768
770
|
return categories;
|
|
769
|
-
},
|
|
771
|
+
}, /* @ts-ignore */
|
|
772
|
+
...(ngDevMode ? [{ debugName: "categories" }] : /* istanbul ignore next */ []));
|
|
770
773
|
favorites = computed(() => this.apps()
|
|
771
774
|
.flatMap(app => ('apps' in app ? app.apps : app))
|
|
772
|
-
.filter(app => app.favorite),
|
|
773
|
-
|
|
775
|
+
.filter(app => app.favorite), /* @ts-ignore */
|
|
776
|
+
...(ngDevMode ? [{ debugName: "favorites" }] : /* istanbul ignore next */ []));
|
|
777
|
+
hasFavorites = computed(() => this.favorites().length > 0, /* @ts-ignore */
|
|
778
|
+
...(ngDevMode ? [{ debugName: "hasFavorites" }] : /* istanbul ignore next */ []));
|
|
774
779
|
icons = addIcons({ elementDown2, elementCancel });
|
|
775
780
|
activatedRoute = inject(ActivatedRoute, { optional: true });
|
|
776
781
|
header = inject(SiApplicationHeaderComponent);
|
|
@@ -794,10 +799,10 @@ class SiLaunchpadFactoryComponent {
|
|
|
794
799
|
return false;
|
|
795
800
|
}
|
|
796
801
|
}
|
|
797
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
798
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
802
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiLaunchpadFactoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
803
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiLaunchpadFactoryComponent, isStandalone: true, selector: "si-launchpad-factory", inputs: { closeText: { classPropertyName: "closeText", publicName: "closeText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, subtitleText: { classPropertyName: "subtitleText", publicName: "subtitleText", isSignal: true, isRequired: false, transformFunction: null }, apps: { classPropertyName: "apps", publicName: "apps", isSignal: true, isRequired: true, transformFunction: null }, enableFavorites: { classPropertyName: "enableFavorites", publicName: "enableFavorites", isSignal: true, isRequired: false, transformFunction: null }, favoriteAppsText: { classPropertyName: "favoriteAppsText", publicName: "favoriteAppsText", isSignal: true, isRequired: false, transformFunction: null }, showMoreAppsText: { classPropertyName: "showMoreAppsText", publicName: "showMoreAppsText", isSignal: true, isRequired: false, transformFunction: null }, showLessAppsText: { classPropertyName: "showLessAppsText", publicName: "showLessAppsText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { favoriteChange: "favoriteChange" }, ngImport: i0, template: "<!-- temporary until old primary-navbar is removed -->\n<div\n class=\"app-switcher gap-6 g-5 g-sm-9 container-fluid\"\n cdkTrapFocus\n cdkTrapFocusAutoCapture\n (keydown.escape)=\"escape()\"\n>\n @if (titleText()) {\n <div class=\"apps-header\">\n <span>\n <p class=\"si-h4 lh-1 m-0\">{{ titleText() | translate }}</p>\n @if (subtitleText()) {\n <p class=\"si-body text-secondary mt-4 mb-0\">{{ subtitleText() | translate }}</p>\n }\n </span>\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary-ghost\"\n [attr.aria-label]=\"closeText() | translate\"\n (click)=\"closeLaunchpad()\"\n >\n <si-icon [icon]=\"icons.elementCancel\" />\n </button>\n </div>\n }\n <div class=\"apps-scroll ms-n2 ps-2\">\n @for (category of categories(); track category.name; let first = $first) {\n @if (!enableFavorites() || !hasFavorites() || first || showAllApps) {\n <div>\n @if (category.name) {\n <div\n class=\"si-h4 launchpad-category-title mb-6\"\n [class.mt-4]=\"first\"\n [class.mt-8]=\"!first\"\n >\n {{ category.name | translate }}\n </div>\n }\n <div class=\"d-flex flex-wrap gap-4\">\n @for (app of category.apps; track app) {\n @switch (app.type) {\n @case ('router-link') {\n <a\n si-launchpad-app\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"app.activeMatchOptions ?? { exact: false }\"\n [enableFavoriteToggle]=\"enableFavorites() && !isFavoriteToggleDisabled(app)\"\n [external]=\"app.external\"\n [iconUrl]=\"app.iconUrl\"\n [iconClass]=\"app.iconClass\"\n [favorite]=\"!!app.favorite\"\n [routerLink]=\"app.routerLink\"\n [queryParams]=\"app.extras?.queryParams\"\n [queryParamsHandling]=\"app.extras?.queryParamsHandling\"\n [fragment]=\"app.extras?.fragment\"\n [state]=\"app.extras?.state\"\n [relativeTo]=\"app.extras?.relativeTo ?? this.activatedRoute\"\n [preserveFragment]=\"app.extras?.preserveFragment\"\n [skipLocationChange]=\"app.extras?.skipLocationChange\"\n [replaceUrl]=\"app.extras?.replaceUrl\"\n (favoriteChange)=\"toggleFavorite(app, $event)\"\n >\n <span app-name>{{ app.name | translate }}</span>\n <span app-systemName>{{ app.systemName | translate }}</span>\n </a>\n }\n @default {\n <!--fallback for existing apps that do not have a type defined -->\n <a\n si-launchpad-app\n [enableFavoriteToggle]=\"enableFavorites() && !isFavoriteToggleDisabled(app)\"\n [favorite]=\"!!app.favorite\"\n [href]=\"app.href\"\n [target]=\"app.target ?? ''\"\n [active]=\"app.active\"\n [external]=\"app.external\"\n [iconUrl]=\"app.iconUrl\"\n [iconClass]=\"app.iconClass\"\n (favoriteChange)=\"toggleFavorite(app, $event)\"\n >\n <span app-name>{{ app.name | translate }}</span>\n <span app-systemName>{{ app.systemName | translate }}</span>\n </a>\n }\n }\n }\n </div>\n </div>\n }\n\n @if (enableFavorites() && first && hasFavorites()) {\n <button\n type=\"button\"\n class=\"btn btn-link btn-show-all dropdown-toggle text-decoration-none\"\n [class.show]=\"showAllApps\"\n (click)=\"showAllApps = !showAllApps\"\n >\n <b>{{ (showAllApps ? showLessAppsText() : showMoreAppsText()) | translate }}</b>\n <si-icon class=\"link-icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n </button>\n }\n }\n </div>\n</div>\n", styles: [".app-switcher{position:fixed;inset-block-start:calc(1.5rem + 25px + var(--element-titlebar-spacing, 0px) + var(--element-system-banner-spacing, 0px));inset-inline:0;min-block-size:200px;max-block-size:calc(100vb - (1.5rem + 25px) - var(--element-titlebar-spacing, 0px) - var(--element-system-banner-spacing, 0px));padding:16px;display:flex;flex-direction:column;z-index:1033;background-color:var(--element-base-1)}@media(min-width:992px){.app-switcher{padding-block:16px;padding-inline:24px}}.apps-header{display:flex;align-items:center;justify-content:space-between}.apps-scroll{overflow-y:auto;padding-inline-end:16px;margin-inline-end:-16px}.btn-show-all{margin-block-start:16px;margin-block-end:8px}.btn-show-all.show{margin-block-end:24px}.btn-show-all.show:has(+div .launchpad-category-title){margin-block-end:0}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: SiLinkModule }, { kind: "component", type: SiLaunchpadAppComponent, selector: "a[si-launchpad-app]", inputs: ["external", "active", "enableFavoriteToggle", "favorite", "action", "iconUrl", "iconClass", "externalLinkText"], outputs: ["favoriteChange"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
799
804
|
}
|
|
800
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
805
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiLaunchpadFactoryComponent, decorators: [{
|
|
801
806
|
type: Component,
|
|
802
807
|
args: [{ selector: 'si-launchpad-factory', imports: [
|
|
803
808
|
A11yModule,
|
|
@@ -807,7 +812,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
807
812
|
SiIconComponent,
|
|
808
813
|
RouterLinkActive,
|
|
809
814
|
RouterLink
|
|
810
|
-
],
|
|
815
|
+
], template: "<!-- temporary until old primary-navbar is removed -->\n<div\n class=\"app-switcher gap-6 g-5 g-sm-9 container-fluid\"\n cdkTrapFocus\n cdkTrapFocusAutoCapture\n (keydown.escape)=\"escape()\"\n>\n @if (titleText()) {\n <div class=\"apps-header\">\n <span>\n <p class=\"si-h4 lh-1 m-0\">{{ titleText() | translate }}</p>\n @if (subtitleText()) {\n <p class=\"si-body text-secondary mt-4 mb-0\">{{ subtitleText() | translate }}</p>\n }\n </span>\n <button\n type=\"button\"\n class=\"btn btn-circle btn-tertiary-ghost\"\n [attr.aria-label]=\"closeText() | translate\"\n (click)=\"closeLaunchpad()\"\n >\n <si-icon [icon]=\"icons.elementCancel\" />\n </button>\n </div>\n }\n <div class=\"apps-scroll ms-n2 ps-2\">\n @for (category of categories(); track category.name; let first = $first) {\n @if (!enableFavorites() || !hasFavorites() || first || showAllApps) {\n <div>\n @if (category.name) {\n <div\n class=\"si-h4 launchpad-category-title mb-6\"\n [class.mt-4]=\"first\"\n [class.mt-8]=\"!first\"\n >\n {{ category.name | translate }}\n </div>\n }\n <div class=\"d-flex flex-wrap gap-4\">\n @for (app of category.apps; track app) {\n @switch (app.type) {\n @case ('router-link') {\n <a\n si-launchpad-app\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"app.activeMatchOptions ?? { exact: false }\"\n [enableFavoriteToggle]=\"enableFavorites() && !isFavoriteToggleDisabled(app)\"\n [external]=\"app.external\"\n [iconUrl]=\"app.iconUrl\"\n [iconClass]=\"app.iconClass\"\n [favorite]=\"!!app.favorite\"\n [routerLink]=\"app.routerLink\"\n [queryParams]=\"app.extras?.queryParams\"\n [queryParamsHandling]=\"app.extras?.queryParamsHandling\"\n [fragment]=\"app.extras?.fragment\"\n [state]=\"app.extras?.state\"\n [relativeTo]=\"app.extras?.relativeTo ?? this.activatedRoute\"\n [preserveFragment]=\"app.extras?.preserveFragment\"\n [skipLocationChange]=\"app.extras?.skipLocationChange\"\n [replaceUrl]=\"app.extras?.replaceUrl\"\n (favoriteChange)=\"toggleFavorite(app, $event)\"\n >\n <span app-name>{{ app.name | translate }}</span>\n <span app-systemName>{{ app.systemName | translate }}</span>\n </a>\n }\n @default {\n <!--fallback for existing apps that do not have a type defined -->\n <a\n si-launchpad-app\n [enableFavoriteToggle]=\"enableFavorites() && !isFavoriteToggleDisabled(app)\"\n [favorite]=\"!!app.favorite\"\n [href]=\"app.href\"\n [target]=\"app.target ?? ''\"\n [active]=\"app.active\"\n [external]=\"app.external\"\n [iconUrl]=\"app.iconUrl\"\n [iconClass]=\"app.iconClass\"\n (favoriteChange)=\"toggleFavorite(app, $event)\"\n >\n <span app-name>{{ app.name | translate }}</span>\n <span app-systemName>{{ app.systemName | translate }}</span>\n </a>\n }\n }\n }\n </div>\n </div>\n }\n\n @if (enableFavorites() && first && hasFavorites()) {\n <button\n type=\"button\"\n class=\"btn btn-link btn-show-all dropdown-toggle text-decoration-none\"\n [class.show]=\"showAllApps\"\n (click)=\"showAllApps = !showAllApps\"\n >\n <b>{{ (showAllApps ? showLessAppsText() : showMoreAppsText()) | translate }}</b>\n <si-icon class=\"link-icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n </button>\n }\n }\n </div>\n</div>\n", styles: [".app-switcher{position:fixed;inset-block-start:calc(1.5rem + 25px + var(--element-titlebar-spacing, 0px) + var(--element-system-banner-spacing, 0px));inset-inline:0;min-block-size:200px;max-block-size:calc(100vb - (1.5rem + 25px) - var(--element-titlebar-spacing, 0px) - var(--element-system-banner-spacing, 0px));padding:16px;display:flex;flex-direction:column;z-index:1033;background-color:var(--element-base-1)}@media(min-width:992px){.app-switcher{padding-block:16px;padding-inline:24px}}.apps-header{display:flex;align-items:center;justify-content:space-between}.apps-scroll{overflow-y:auto;padding-inline-end:16px;margin-inline-end:-16px}.btn-show-all{margin-block-start:16px;margin-block-end:8px}.btn-show-all.show{margin-block-end:24px}.btn-show-all.show:has(+div .launchpad-category-title){margin-block-end:0}\n"] }]
|
|
811
816
|
}], propDecorators: { closeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], subtitleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitleText", required: false }] }], apps: [{ type: i0.Input, args: [{ isSignal: true, alias: "apps", required: true }] }], enableFavorites: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableFavorites", required: false }] }], favoriteAppsText: [{ type: i0.Input, args: [{ isSignal: true, alias: "favoriteAppsText", required: false }] }], showMoreAppsText: [{ type: i0.Input, args: [{ isSignal: true, alias: "showMoreAppsText", required: false }] }], showLessAppsText: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLessAppsText", required: false }] }], favoriteChange: [{ type: i0.Output, args: ["favoriteChange"] }] } });
|
|
812
817
|
|
|
813
818
|
/**
|
|
@@ -819,5 +824,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
819
824
|
* Generated bundle index. Do not edit.
|
|
820
825
|
*/
|
|
821
826
|
|
|
822
|
-
export { SiAccountDetailsComponent, SiApplicationHeaderComponent, SiHeaderAccountItemComponent, SiHeaderActionItemComponent, SiHeaderActionsDirective, SiHeaderBrandDirective, SiHeaderCollapsibleActionsComponent, SiHeaderLogoDirective, SiHeaderNavigationComponent, SiHeaderNavigationItemComponent, SiHeaderSelectionItemComponent,
|
|
827
|
+
export { SiAccountDetailsComponent, SiApplicationHeaderComponent, SiHeaderAccountItemComponent, SiHeaderActionItemComponent, SiHeaderActionsDirective, SiHeaderBrandDirective, SiHeaderCollapsibleActionsComponent, SiHeaderLogoDirective, SiHeaderNavigationComponent, SiHeaderNavigationItemComponent, SiHeaderSelectionItemComponent, SiLaunchpadFactoryComponent };
|
|
823
828
|
//# sourceMappingURL=siemens-element-ng-application-header.mjs.map
|