@siemens/element-ng 49.12.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 +170 -143
- 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 +34 -33
- 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 +289 -128
- 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 +46 -30
- 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 +20 -16
- 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 +138 -134
- 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 +88 -47
- 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 +218 -117
- 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 +93 -74
- 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 +13 -25
- package/types/siemens-element-ng-autocomplete.d.ts +19 -19
- 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 +135 -40
- 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-header-dropdown.d.ts +5 -0
- 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 +6 -9
- 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-tabs.d.ts +4 -0
- package/types/siemens-element-ng-toast-notification.d.ts +0 -1
- package/types/siemens-element-ng-tooltip.d.ts +10 -26
- 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';
|
|
@@ -12,6 +12,7 @@ import { BOOTSTRAP_BREAKPOINTS } from '@siemens/element-ng/resize-observer';
|
|
|
12
12
|
import { t, SiTranslatePipe } from '@siemens/element-translate-ng/translate';
|
|
13
13
|
import { Subject, of } from 'rxjs';
|
|
14
14
|
import { switchMap, map } from 'rxjs/operators';
|
|
15
|
+
import { SiTooltipService, SiTooltipDirective } from '@siemens/element-ng/tooltip';
|
|
15
16
|
import { SiAvatarComponent } from '@siemens/element-ng/avatar';
|
|
16
17
|
import { ActivatedRoute, RouterLinkActive, RouterLink } from '@angular/router';
|
|
17
18
|
import { SiLinkModule } from '@siemens/element-ng/link';
|
|
@@ -28,28 +29,36 @@ class SiApplicationHeaderComponent {
|
|
|
28
29
|
*
|
|
29
30
|
* @defaultValue 'sm'
|
|
30
31
|
*/
|
|
31
|
-
expandBreakpoint = input('sm',
|
|
32
|
-
|
|
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 */ []));
|
|
33
36
|
/**
|
|
34
37
|
* @defaultValue
|
|
35
38
|
* ```
|
|
36
39
|
* t(() => $localize`:@@SI_APPLICATION_HEADER.LAUNCHPAD:Launchpad`)
|
|
37
40
|
* ```
|
|
38
41
|
*/
|
|
39
|
-
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 */ []));
|
|
40
44
|
/** @internal */
|
|
41
45
|
closeMobileMenus = new Subject();
|
|
42
46
|
/** @internal */
|
|
43
|
-
mobileNavigationExpanded = signal(false,
|
|
47
|
+
mobileNavigationExpanded = signal(false, /* @ts-ignore */
|
|
48
|
+
...(ngDevMode ? [{ debugName: "mobileNavigationExpanded" }] : /* istanbul ignore next */ []));
|
|
44
49
|
/** @internal */
|
|
45
|
-
hasNavigation = signal(false,
|
|
46
|
-
|
|
47
|
-
|
|
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 */ []));
|
|
48
56
|
id = `__si-application-header-${SiApplicationHeaderComponent.idCounter++}`;
|
|
49
57
|
toggleNavigation = t(() => $localize `:@@SI_APPLICATION_HEADER.TOGGLE_NAVIGATION:Toggle navigation`);
|
|
50
58
|
injector = inject(Injector);
|
|
51
59
|
icons = addIcons({ elementThumbnails, elementMenu });
|
|
52
|
-
navigationToggle = viewChild('navigationToggle',
|
|
60
|
+
navigationToggle = viewChild('navigationToggle', /* @ts-ignore */
|
|
61
|
+
...(ngDevMode ? [{ debugName: "navigationToggle" }] : /* istanbul ignore next */ []));
|
|
53
62
|
focusTrap = viewChild.required(CdkTrapFocus);
|
|
54
63
|
breakpointObserver = inject(BreakpointObserver);
|
|
55
64
|
openDropdown;
|
|
@@ -152,12 +161,12 @@ class SiApplicationHeaderComponent {
|
|
|
152
161
|
this.dropdownClosed();
|
|
153
162
|
}
|
|
154
163
|
}
|
|
155
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
156
|
-
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" }] });
|
|
157
166
|
}
|
|
158
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiApplicationHeaderComponent, decorators: [{
|
|
159
168
|
type: Component,
|
|
160
|
-
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"] }]
|
|
161
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 }] }] } });
|
|
162
171
|
|
|
163
172
|
/**
|
|
@@ -166,15 +175,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
166
175
|
*/
|
|
167
176
|
class SiAccountDetailsComponent {
|
|
168
177
|
/** The user's full name. */
|
|
169
|
-
name = input.required(
|
|
178
|
+
name = input.required(/* @ts-ignore */
|
|
179
|
+
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
170
180
|
/** The user's company name. */
|
|
171
|
-
company = input(
|
|
181
|
+
company = input(/* @ts-ignore */
|
|
182
|
+
...(ngDevMode ? [undefined, { debugName: "company" }] : /* istanbul ignore next */ []));
|
|
172
183
|
/** The user's email address. */
|
|
173
|
-
email = input(
|
|
184
|
+
email = input(/* @ts-ignore */
|
|
185
|
+
...(ngDevMode ? [undefined, { debugName: "email" }] : /* istanbul ignore next */ []));
|
|
174
186
|
/** The user's role. */
|
|
175
|
-
userRole = input(
|
|
176
|
-
|
|
177
|
-
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: `
|
|
178
191
|
<div class="mx-5">
|
|
179
192
|
<div class="si-h5">{{ name() }}</div>
|
|
180
193
|
@if (email()) {
|
|
@@ -191,9 +204,9 @@ class SiAccountDetailsComponent {
|
|
|
191
204
|
</div>
|
|
192
205
|
}
|
|
193
206
|
</div>
|
|
194
|
-
`, isInline: true, dependencies: [{ kind: "pipe", type: SiTranslatePipe, name: "translate" }]
|
|
207
|
+
`, isInline: true, dependencies: [{ kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
195
208
|
}
|
|
196
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
209
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiAccountDetailsComponent, decorators: [{
|
|
197
210
|
type: Component,
|
|
198
211
|
args: [{
|
|
199
212
|
selector: 'si-account-details',
|
|
@@ -215,8 +228,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
215
228
|
</div>
|
|
216
229
|
}
|
|
217
230
|
</div>
|
|
218
|
-
|
|
219
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
231
|
+
`
|
|
220
232
|
}]
|
|
221
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 }] }] } });
|
|
222
234
|
|
|
@@ -232,8 +244,8 @@ class SiHeaderNavigationItemComponent {
|
|
|
232
244
|
optional: true
|
|
233
245
|
});
|
|
234
246
|
icons = addIcons({ elementDown2 });
|
|
235
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
236
|
-
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: [
|
|
237
249
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
238
250
|
], ngImport: i0, template: `
|
|
239
251
|
<div class="item-title">
|
|
@@ -242,9 +254,9 @@ class SiHeaderNavigationItemComponent {
|
|
|
242
254
|
@if (dropdownTrigger) {
|
|
243
255
|
<si-icon class="dropdown-caret" [icon]="icons.elementDown2" />
|
|
244
256
|
}
|
|
245
|
-
`, 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"] }] });
|
|
246
258
|
}
|
|
247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
259
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderNavigationItemComponent, decorators: [{
|
|
248
260
|
type: Component,
|
|
249
261
|
args: [{
|
|
250
262
|
// eslint-disable-next-line @angular-eslint/component-selector
|
|
@@ -261,7 +273,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
261
273
|
providers: [
|
|
262
274
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
263
275
|
],
|
|
264
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
265
276
|
host: {
|
|
266
277
|
class: 'header-item focus-inside',
|
|
267
278
|
'[class.dropdown-toggle]': '!!dropdownTrigger'
|
|
@@ -284,11 +295,14 @@ class SiHeaderCollapsibleActionsComponent {
|
|
|
284
295
|
* t(() => $localize`:@@SI_APPLICATION_HEADER.TOGGLE_ACTIONS:Toggle actions`)
|
|
285
296
|
* ```
|
|
286
297
|
*/
|
|
287
|
-
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 */ []));
|
|
288
300
|
/** @internal **/
|
|
289
|
-
mobileExpanded = signal(false,
|
|
301
|
+
mobileExpanded = signal(false, /* @ts-ignore */
|
|
302
|
+
...(ngDevMode ? [{ debugName: "mobileExpanded" }] : /* istanbul ignore next */ []));
|
|
290
303
|
/** @internal **/
|
|
291
|
-
badgeCount = signal(0,
|
|
304
|
+
badgeCount = signal(0, /* @ts-ignore */
|
|
305
|
+
...(ngDevMode ? [{ debugName: "badgeCount" }] : /* istanbul ignore next */ []));
|
|
292
306
|
id = `__si-header-collapsible-actions-${SiHeaderCollapsibleActionsComponent.idCounter++}`;
|
|
293
307
|
icons = addIcons({ elementOptionsVertical });
|
|
294
308
|
toggle = viewChild.required('toggle');
|
|
@@ -325,16 +339,16 @@ class SiHeaderCollapsibleActionsComponent {
|
|
|
325
339
|
this.toggle().nativeElement.focus();
|
|
326
340
|
}
|
|
327
341
|
}
|
|
328
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
329
|
-
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: [
|
|
330
344
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
331
|
-
], 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" }] });
|
|
332
346
|
}
|
|
333
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
347
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderCollapsibleActionsComponent, decorators: [{
|
|
334
348
|
type: Component,
|
|
335
349
|
args: [{ selector: 'si-header-collapsible-actions', imports: [SiTranslatePipe, A11yModule, SiIconComponent], providers: [
|
|
336
350
|
{ provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
|
|
337
|
-
],
|
|
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"] }]
|
|
338
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 }] }] } });
|
|
339
353
|
|
|
340
354
|
/**
|
|
@@ -365,10 +379,10 @@ class SiHeaderActionItemBase {
|
|
|
365
379
|
queueMicrotask(() => this.header.closeMobileMenus.next());
|
|
366
380
|
}
|
|
367
381
|
}
|
|
368
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
369
|
-
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 });
|
|
370
384
|
}
|
|
371
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
385
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionItemBase, decorators: [{
|
|
372
386
|
type: Directive,
|
|
373
387
|
args: [{}]
|
|
374
388
|
}], propDecorators: { click: [{
|
|
@@ -391,14 +405,38 @@ class SiHeaderActionIconItemBase extends SiHeaderActionItemBase {
|
|
|
391
405
|
* - =number, the number will be shown and automatically trimmed if \>99
|
|
392
406
|
* - =true, an empty red dot will be shown
|
|
393
407
|
*/
|
|
394
|
-
badge = input(
|
|
395
|
-
|
|
408
|
+
badge = input(/* @ts-ignore */
|
|
409
|
+
...(ngDevMode ? [undefined, { debugName: "badge" }] : /* istanbul ignore next */ []));
|
|
410
|
+
tooltipService = inject(SiTooltipService);
|
|
411
|
+
elementRef = inject(ElementRef);
|
|
412
|
+
existingTooltip = inject(SiTooltipDirective, { optional: true, host: true });
|
|
413
|
+
badgeDot = computed(() => typeof this.badge() === 'boolean' ? this.badge() : false, /* @ts-ignore */
|
|
414
|
+
...(ngDevMode ? [{ debugName: "badgeDot" }] : /* istanbul ignore next */ []));
|
|
396
415
|
badgeValue = computed(() => {
|
|
397
416
|
const badge = this.badge();
|
|
398
417
|
return typeof badge === 'number'
|
|
399
418
|
? `${badge > 99 ? '+' : ''}${Math.min(99, Math.round(badge))}`
|
|
400
419
|
: undefined;
|
|
401
|
-
},
|
|
420
|
+
}, /* @ts-ignore */
|
|
421
|
+
...(ngDevMode ? [{ debugName: "badgeValue" }] : /* istanbul ignore next */ []));
|
|
422
|
+
constructor() {
|
|
423
|
+
super();
|
|
424
|
+
effect(onCleanup => this.setupTooltip(onCleanup));
|
|
425
|
+
}
|
|
426
|
+
setupTooltip(onCleanup) {
|
|
427
|
+
const hasActiveTooltip = !!this.existingTooltip &&
|
|
428
|
+
!this.existingTooltip.isDisabled() &&
|
|
429
|
+
!!this.existingTooltip.siTooltip();
|
|
430
|
+
if (this.visuallyHideTitle() && !hasActiveTooltip) {
|
|
431
|
+
const tooltipRef = this.tooltipService.createTooltip({
|
|
432
|
+
element: this.elementRef,
|
|
433
|
+
placement: 'auto',
|
|
434
|
+
tooltip: this.itemTitle,
|
|
435
|
+
tooltipContext: () => undefined
|
|
436
|
+
});
|
|
437
|
+
onCleanup(() => tooltipRef.destroy());
|
|
438
|
+
}
|
|
439
|
+
}
|
|
402
440
|
ngOnChanges(changes) {
|
|
403
441
|
if (changes.badge) {
|
|
404
442
|
if (changes.badge.currentValue && !changes.badge.previousValue) {
|
|
@@ -409,16 +447,15 @@ class SiHeaderActionIconItemBase extends SiHeaderActionItemBase {
|
|
|
409
447
|
}
|
|
410
448
|
}
|
|
411
449
|
}
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
}
|
|
415
|
-
static
|
|
416
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.8", type: SiHeaderActionIconItemBase, isStandalone: true, inputs: { badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
|
|
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 });
|
|
417
454
|
}
|
|
418
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
455
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionIconItemBase, decorators: [{
|
|
419
456
|
type: Directive,
|
|
420
457
|
args: [{}]
|
|
421
|
-
}], propDecorators: { badge: [{ type: i0.Input, args: [{ isSignal: true, alias: "badge", required: false }] }] } });
|
|
458
|
+
}], ctorParameters: () => [], propDecorators: { badge: [{ type: i0.Input, args: [{ isSignal: true, alias: "badge", required: false }] }] } });
|
|
422
459
|
|
|
423
460
|
/**
|
|
424
461
|
* Copyright (c) Siemens 2016 - 2026
|
|
@@ -427,17 +464,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
427
464
|
/** Adds an action item to the header. Should be located inside `.header-actions`. */
|
|
428
465
|
class SiHeaderActionItemComponent extends SiHeaderActionIconItemBase {
|
|
429
466
|
/** The icon to be shown. */
|
|
430
|
-
icon = input.required(
|
|
431
|
-
|
|
432
|
-
|
|
467
|
+
icon = input.required(/* @ts-ignore */
|
|
468
|
+
...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
469
|
+
itemTitle = viewChild.required('itemTitle');
|
|
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"] }] });
|
|
433
472
|
}
|
|
434
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
473
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionItemComponent, decorators: [{
|
|
435
474
|
type: Component,
|
|
436
|
-
args: [{ selector: 'button[si-header-action-item], a[si-header-action-item]', imports: [SiIconComponent],
|
|
475
|
+
args: [{ selector: 'button[si-header-action-item], a[si-header-action-item]', imports: [SiIconComponent], providers: [SiTooltipService], host: {
|
|
437
476
|
class: 'header-item focus-inside',
|
|
438
477
|
'[class.dropdown-toggle]': '!!dropdownTrigger'
|
|
439
|
-
}, 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 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" }]
|
|
440
|
-
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }] } });
|
|
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" }]
|
|
479
|
+
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], itemTitle: [{ type: i0.ViewChild, args: ['itemTitle', { isSignal: true }] }] } });
|
|
441
480
|
|
|
442
481
|
/**
|
|
443
482
|
* Copyright (c) Siemens 2016 - 2026
|
|
@@ -446,20 +485,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
446
485
|
/** Adds an account item to the header. Should be located inside `.header-actions`. */
|
|
447
486
|
class SiHeaderAccountItemComponent extends SiHeaderActionIconItemBase {
|
|
448
487
|
/** Name of the account. */
|
|
449
|
-
name = input.required(
|
|
488
|
+
name = input.required(/* @ts-ignore */
|
|
489
|
+
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
450
490
|
/** Initials of the account. If not provided, they will be calculated. */
|
|
451
|
-
initials = input(
|
|
491
|
+
initials = input(/* @ts-ignore */
|
|
492
|
+
...(ngDevMode ? [undefined, { debugName: "initials" }] : /* istanbul ignore next */ []));
|
|
452
493
|
/** URL to an image which should be shown instead of the initials. */
|
|
453
|
-
imageUrl = input(
|
|
454
|
-
|
|
455
|
-
|
|
494
|
+
imageUrl = input(/* @ts-ignore */
|
|
495
|
+
...(ngDevMode ? [undefined, { debugName: "imageUrl" }] : /* istanbul ignore next */ []));
|
|
496
|
+
itemTitle = this.name;
|
|
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"] }] });
|
|
456
499
|
}
|
|
457
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
500
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderAccountItemComponent, decorators: [{
|
|
458
501
|
type: Component,
|
|
459
|
-
args: [{ selector: 'button[si-header-account-item]', imports: [SiAvatarComponent, SiIconComponent],
|
|
502
|
+
args: [{ selector: 'button[si-header-account-item]', imports: [SiAvatarComponent, SiIconComponent], providers: [SiTooltipService], host: {
|
|
460
503
|
class: 'header-item focus-inside px-4 py-0',
|
|
461
504
|
'[class.dropdown-toggle]': '!!dropdownTrigger'
|
|
462
|
-
}, 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"] }]
|
|
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"] }]
|
|
463
506
|
}], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], initials: [{ type: i0.Input, args: [{ isSignal: true, alias: "initials", required: false }] }], imageUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageUrl", required: false }] }] } });
|
|
464
507
|
|
|
465
508
|
/**
|
|
@@ -472,13 +515,14 @@ class SiHeaderSelectionItemComponent extends SiHeaderActionItemBase {
|
|
|
472
515
|
*
|
|
473
516
|
* @defaultValue false
|
|
474
517
|
*/
|
|
475
|
-
open = input(false,
|
|
476
|
-
|
|
477
|
-
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"] }] });
|
|
478
522
|
}
|
|
479
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
523
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderSelectionItemComponent, decorators: [{
|
|
480
524
|
type: Component,
|
|
481
|
-
args: [{ selector: 'button[si-header-selection-item]', imports: [SiIconComponent],
|
|
525
|
+
args: [{ selector: 'button[si-header-selection-item]', imports: [SiIconComponent], host: {
|
|
482
526
|
class: 'header-item header-selection-item focus-inside dropdown-toggle',
|
|
483
527
|
'[class.show]': 'open()'
|
|
484
528
|
}, template: "<div class=\"item-title\">\n <ng-content />\n</div>\n<si-icon class=\"d-block dropdown-caret\" [icon]=\"icons.elementDown2\" />\n" }]
|
|
@@ -490,7 +534,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
490
534
|
*/
|
|
491
535
|
/** The siemens logo. Should be located inside `.header-brand`. */
|
|
492
536
|
class SiHeaderLogoDirective {
|
|
493
|
-
logoText = signal(undefined,
|
|
537
|
+
logoText = signal(undefined, /* @ts-ignore */
|
|
538
|
+
...(ngDevMode ? [{ debugName: "logoText" }] : /* istanbul ignore next */ []));
|
|
494
539
|
elementRef = inject(ElementRef);
|
|
495
540
|
injector = inject(Injector);
|
|
496
541
|
ngOnInit() {
|
|
@@ -504,10 +549,10 @@ class SiHeaderLogoDirective {
|
|
|
504
549
|
.replace(/^["']|["']$/g, ''))
|
|
505
550
|
}, { injector: this.injector });
|
|
506
551
|
}
|
|
507
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
508
|
-
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 });
|
|
509
554
|
}
|
|
510
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
555
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderLogoDirective, decorators: [{
|
|
511
556
|
type: Directive,
|
|
512
557
|
args: [{
|
|
513
558
|
selector: 'si-header-logo, [siHeaderLogo]',
|
|
@@ -521,47 +566,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
521
566
|
args: ['window:theme-switch']
|
|
522
567
|
}] } });
|
|
523
568
|
|
|
524
|
-
/**
|
|
525
|
-
* Copyright (c) Siemens 2016 - 2026
|
|
526
|
-
* SPDX-License-Identifier: MIT
|
|
527
|
-
*/
|
|
528
|
-
/**
|
|
529
|
-
* The siemens logo.
|
|
530
|
-
* Should be located inside `.header-brand`.
|
|
531
|
-
*
|
|
532
|
-
* @deprecated Use the {@link SiHeaderLogoDirective} instead.
|
|
533
|
-
* The new component will use the logo provided by the global theme instead
|
|
534
|
-
* of containing a hard coded siemens logo.
|
|
535
|
-
* ```html
|
|
536
|
-
* // previous
|
|
537
|
-
* <a si-header-siemens-logo routerLink="/" aria-label="Siemens" class="d-none d-md-flex"></a>
|
|
538
|
-
* // new
|
|
539
|
-
* <a siHeaderLogo routerLink="/" class="d-none d-md-flex"></a>
|
|
540
|
-
* ```
|
|
541
|
-
*
|
|
542
|
-
*/
|
|
543
|
-
class SiHeaderSiemensLogoComponent extends SiHeaderLogoDirective {
|
|
544
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiHeaderSiemensLogoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
545
|
-
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 });
|
|
546
|
-
}
|
|
547
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiHeaderSiemensLogoComponent, decorators: [{
|
|
548
|
-
type: Component,
|
|
549
|
-
args: [{
|
|
550
|
-
selector: 'si-header-siemens-logo, [si-header-siemens-logo]',
|
|
551
|
-
template: '',
|
|
552
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
553
|
-
}]
|
|
554
|
-
}] });
|
|
555
|
-
|
|
556
569
|
/**
|
|
557
570
|
* Copyright (c) Siemens 2016 - 2026
|
|
558
571
|
* SPDX-License-Identifier: MIT
|
|
559
572
|
*/
|
|
560
573
|
class SiHeaderActionsDirective {
|
|
561
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
562
|
-
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 });
|
|
563
576
|
}
|
|
564
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
577
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderActionsDirective, decorators: [{
|
|
565
578
|
type: Directive,
|
|
566
579
|
args: [{
|
|
567
580
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -575,10 +588,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
575
588
|
* SPDX-License-Identifier: MIT
|
|
576
589
|
*/
|
|
577
590
|
class SiHeaderBrandDirective {
|
|
578
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
579
|
-
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 });
|
|
580
593
|
}
|
|
581
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
594
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderBrandDirective, decorators: [{
|
|
582
595
|
type: Directive,
|
|
583
596
|
args: [{
|
|
584
597
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -600,12 +613,12 @@ class SiHeaderNavigationComponent {
|
|
|
600
613
|
ngOnDestroy() {
|
|
601
614
|
this.header.hasNavigation.set(false);
|
|
602
615
|
}
|
|
603
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
604
|
-
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" }] });
|
|
605
618
|
}
|
|
606
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
619
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiHeaderNavigationComponent, decorators: [{
|
|
607
620
|
type: Component,
|
|
608
|
-
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" }]
|
|
609
622
|
}], ctorParameters: () => [] });
|
|
610
623
|
|
|
611
624
|
/**
|
|
@@ -614,17 +627,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
614
627
|
*/
|
|
615
628
|
class SiLaunchpadAppComponent {
|
|
616
629
|
/** @defaultValue false */
|
|
617
|
-
external = input(false, { ...(ngDevMode ? { debugName: "external" } : {}), transform: booleanAttribute });
|
|
630
|
+
external = input(false, { ...(ngDevMode ? { debugName: "external" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
618
631
|
/** @defaultValue false */
|
|
619
|
-
active = input(false, { ...(ngDevMode ? { debugName: "active" } : {}), transform: booleanAttribute });
|
|
632
|
+
active = input(false, { ...(ngDevMode ? { debugName: "active" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
620
633
|
/** @defaultValue false */
|
|
621
|
-
enableFavoriteToggle = input(false, { ...(ngDevMode ? { debugName: "enableFavoriteToggle" } : {}), transform: booleanAttribute });
|
|
634
|
+
enableFavoriteToggle = input(false, { ...(ngDevMode ? { debugName: "enableFavoriteToggle" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
622
635
|
/** @defaultValue false */
|
|
623
|
-
favorite = model(false,
|
|
636
|
+
favorite = model(false, /* @ts-ignore */
|
|
637
|
+
...(ngDevMode ? [{ debugName: "favorite" }] : /* istanbul ignore next */ []));
|
|
624
638
|
/** @defaultValue false */
|
|
625
|
-
action = input(false, { ...(ngDevMode ? { debugName: "action" } : {}), transform: booleanAttribute });
|
|
626
|
-
iconUrl = input(
|
|
627
|
-
|
|
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 */ []));
|
|
628
644
|
/**
|
|
629
645
|
* Aria-label for the external link icon.
|
|
630
646
|
*
|
|
@@ -633,7 +649,8 @@ class SiLaunchpadAppComponent {
|
|
|
633
649
|
* t(() => $localize`:@@SI_LAUNCHPAD.EXTERNAL_LINK:External application`)
|
|
634
650
|
* ```
|
|
635
651
|
*/
|
|
636
|
-
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 */ []));
|
|
637
654
|
icons = addIcons({ elementExport, elementFavorites, elementFavoritesFilled });
|
|
638
655
|
header = inject(SiApplicationHeaderComponent);
|
|
639
656
|
favoriteClicked(event) {
|
|
@@ -644,12 +661,12 @@ class SiLaunchpadAppComponent {
|
|
|
644
661
|
click() {
|
|
645
662
|
this.header.closeLaunchpad();
|
|
646
663
|
}
|
|
647
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
648
|
-
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" }] });
|
|
649
666
|
}
|
|
650
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
667
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiLaunchpadAppComponent, decorators: [{
|
|
651
668
|
type: Component,
|
|
652
|
-
args: [{ selector: 'a[si-launchpad-app]', imports: [SiIconComponent, SiTranslatePipe],
|
|
669
|
+
args: [{ selector: 'a[si-launchpad-app]', imports: [SiIconComponent, SiTranslatePipe], host: {
|
|
653
670
|
class: 'focus-inside',
|
|
654
671
|
'[class.active]': 'active()',
|
|
655
672
|
'[class.action]': 'action()'
|
|
@@ -675,7 +692,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
675
692
|
* t(() => $localize`:@@SI_LAUNCHPAD.CLOSE:Close launchpad`)
|
|
676
693
|
* ```
|
|
677
694
|
*/
|
|
678
|
-
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 */ []));
|
|
679
697
|
/**
|
|
680
698
|
* Title of the launchpad.
|
|
681
699
|
*
|
|
@@ -684,20 +702,23 @@ class SiLaunchpadFactoryComponent {
|
|
|
684
702
|
* t(() => $localize`:@@SI_LAUNCHPAD.TITLE:Switch applications`)
|
|
685
703
|
* ```
|
|
686
704
|
*/
|
|
687
|
-
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 */ []));
|
|
688
707
|
/**
|
|
689
708
|
* Subtitle of the launchpad.
|
|
690
709
|
* When not provided, no subtitle is displayed.
|
|
691
710
|
*/
|
|
692
|
-
subtitleText = input(
|
|
711
|
+
subtitleText = input(/* @ts-ignore */
|
|
712
|
+
...(ngDevMode ? [undefined, { debugName: "subtitleText" }] : /* istanbul ignore next */ []));
|
|
693
713
|
/** All app items shown in the launchpad. */
|
|
694
|
-
apps = input.required(
|
|
714
|
+
apps = input.required(/* @ts-ignore */
|
|
715
|
+
...(ngDevMode ? [{ debugName: "apps" }] : /* istanbul ignore next */ []));
|
|
695
716
|
/**
|
|
696
717
|
* Allow the user to select favorite apps which will then be displayed at the top.
|
|
697
718
|
*
|
|
698
719
|
* @defaultValue false
|
|
699
720
|
*/
|
|
700
|
-
enableFavorites = input(false, { ...(ngDevMode ? { debugName: "enableFavorites" } : {}), transform: booleanAttribute });
|
|
721
|
+
enableFavorites = input(false, { ...(ngDevMode ? { debugName: "enableFavorites" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
701
722
|
/**
|
|
702
723
|
* Title of the favorite apps section.
|
|
703
724
|
*
|
|
@@ -706,7 +727,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
706
727
|
* t(() => $localize`:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorites`)
|
|
707
728
|
* ```
|
|
708
729
|
*/
|
|
709
|
-
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 */ []));
|
|
710
732
|
/**
|
|
711
733
|
* Title of the show more apps button.
|
|
712
734
|
*
|
|
@@ -715,7 +737,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
715
737
|
* t(() => $localize`:@@SI_LAUNCHPAD.SHOW_MORE:Show more`)
|
|
716
738
|
* ```
|
|
717
739
|
*/
|
|
718
|
-
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 */ []));
|
|
719
742
|
/**
|
|
720
743
|
* Title of the show less apps button.
|
|
721
744
|
*
|
|
@@ -724,7 +747,8 @@ class SiLaunchpadFactoryComponent {
|
|
|
724
747
|
* t(() => $localize`:@@SI_LAUNCHPAD.SHOW_LESS:Show less`)
|
|
725
748
|
* ```
|
|
726
749
|
*/
|
|
727
|
-
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 */ []));
|
|
728
752
|
favoriteChange = output();
|
|
729
753
|
showAllApps = false;
|
|
730
754
|
categories = computed(() => {
|
|
@@ -744,11 +768,14 @@ class SiLaunchpadFactoryComponent {
|
|
|
744
768
|
categories.push({ name: '', apps: [...apps] });
|
|
745
769
|
}
|
|
746
770
|
return categories;
|
|
747
|
-
},
|
|
771
|
+
}, /* @ts-ignore */
|
|
772
|
+
...(ngDevMode ? [{ debugName: "categories" }] : /* istanbul ignore next */ []));
|
|
748
773
|
favorites = computed(() => this.apps()
|
|
749
774
|
.flatMap(app => ('apps' in app ? app.apps : app))
|
|
750
|
-
.filter(app => app.favorite),
|
|
751
|
-
|
|
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 */ []));
|
|
752
779
|
icons = addIcons({ elementDown2, elementCancel });
|
|
753
780
|
activatedRoute = inject(ActivatedRoute, { optional: true });
|
|
754
781
|
header = inject(SiApplicationHeaderComponent);
|
|
@@ -772,10 +799,10 @@ class SiLaunchpadFactoryComponent {
|
|
|
772
799
|
return false;
|
|
773
800
|
}
|
|
774
801
|
}
|
|
775
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
776
|
-
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" }] });
|
|
777
804
|
}
|
|
778
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
805
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiLaunchpadFactoryComponent, decorators: [{
|
|
779
806
|
type: Component,
|
|
780
807
|
args: [{ selector: 'si-launchpad-factory', imports: [
|
|
781
808
|
A11yModule,
|
|
@@ -785,7 +812,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
785
812
|
SiIconComponent,
|
|
786
813
|
RouterLinkActive,
|
|
787
814
|
RouterLink
|
|
788
|
-
],
|
|
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"] }]
|
|
789
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"] }] } });
|
|
790
817
|
|
|
791
818
|
/**
|
|
@@ -797,5 +824,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
797
824
|
* Generated bundle index. Do not edit.
|
|
798
825
|
*/
|
|
799
826
|
|
|
800
|
-
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 };
|
|
801
828
|
//# sourceMappingURL=siemens-element-ng-application-header.mjs.map
|