@siemens/element-ng 47.6.0 → 47.7.0

package/fesm2022/siemens-element-ng-application-header.mjs

@@ -1,4 +1,4 @@
-import * as i2 from '@angular/cdk/a11y';
+import * as i1 from '@angular/cdk/a11y';
 import { CdkTrapFocus, A11yModule } from '@angular/cdk/a11y';
 import { BreakpointObserver } from '@angular/cdk/layout';
 import { NgClass, NgTemplateOutlet, CommonModule } from '@angular/common';
@@ -7,15 +7,14 @@ import { input, signal, inject, Injector, viewChild, ChangeDetectionStrategy, Co
 import { SI_HEADER_WITH_DROPDOWNS, SiHeaderDropdownTriggerDirective, SI_HEADER_DROPDOWN_OPTIONS } from '@siemens/element-ng/header-dropdown';
 import { addIcons, elementMenu, elementThumbnails, SiIconNextComponent, elementDown2, elementOptionsVertical, elementFavoritesFilled, elementFavorites, elementExport, elementCancel } from '@siemens/element-ng/icon';
 import { BOOTSTRAP_BREAKPOINTS } from '@siemens/element-ng/resize-observer';
-import * as i1 from '@siemens/element-translate-ng/translate';
-import { SiTranslateModule } from '@siemens/element-translate-ng/translate';
+import { SiTranslatePipe } from '@siemens/element-translate-ng/translate';
 import { Subject, defer, of } from 'rxjs';
 import { map, skip, takeUntil } from 'rxjs/operators';
 import { SiAvatarComponent } from '@siemens/element-ng/avatar';
 import { SiLinkModule } from '@siemens/element-ng/link';
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /** Root component for the application header. */
@@ -153,15 +152,15 @@ class SiApplicationHeaderComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiApplicationHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", 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\"\n  [ngClass]=\"'expand-' + expandBreakpoint()\"\n  [class.show-navigation]=\"mobileNavigationExpanded()\"\n>\n  @if (launchpad()) {\n    <button\n      type=\"button\"\n      class=\"header-toggle focus-inside\"\n      [class.show]=\"launchpadOpen()\"\n      [class.d-none]=\"hasNavigation()\"\n      [ngClass]=\"'d-' + expandBreakpoint() + '-block'\"\n      [attr.aria-expanded]=\"launchpadOpen()\"\n      [attr.aria-label]=\"launchpadLabel() | translate\"\n      [attr.aria-controls]=\"id + '-launchpad'\"\n      (click)=\"toggleLaunchpad()\"\n    >\n      <si-icon-next [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-next [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 [id]=\"id + '-launchpad'\">\n    <ng-template [ngTemplateOutlet]=\"launchpad()!\" [ngTemplateOutletInjector]=\"injector\" />\n  </div>\n}\n\n@if (openDropdownCount() || launchpadOpen()) {\n  <div\n    class=\"modal-backdrop\"\n    [ngClass]=\"launchpadOpen() ? 'd-block' : 'd-' + expandBreakpoint() + '-none'\"\n    (click)=\"backdropClicked()\"\n  ></div>\n}\n", styles: [".modal-backdrop{z-index:1032}\n"], dependencies: [{ kind: "ngmodule", type: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", 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\"\n  [ngClass]=\"'expand-' + expandBreakpoint()\"\n  [class.show-navigation]=\"mobileNavigationExpanded()\"\n>\n  @if (launchpad()) {\n    <button\n      type=\"button\"\n      class=\"header-toggle focus-inside\"\n      [class.show]=\"launchpadOpen()\"\n      [class.d-none]=\"hasNavigation()\"\n      [ngClass]=\"'d-' + expandBreakpoint() + '-block'\"\n      [attr.aria-expanded]=\"launchpadOpen()\"\n      [attr.aria-label]=\"launchpadLabel() | translate\"\n      [attr.aria-controls]=\"id + '-launchpad'\"\n      (click)=\"toggleLaunchpad()\"\n    >\n      <si-icon-next [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-next [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 [id]=\"id + '-launchpad'\">\n    <ng-template [ngTemplateOutlet]=\"launchpad()!\" [ngTemplateOutletInjector]=\"injector\" />\n  </div>\n}\n\n@if (openDropdownCount() || launchpadOpen()) {\n  <div\n    class=\"modal-backdrop\"\n    [ngClass]=\"launchpadOpen() ? 'd-block' : 'd-' + expandBreakpoint() + '-none'\"\n    (click)=\"backdropClicked()\"\n  ></div>\n}\n", styles: [".modal-backdrop{z-index:1032}\n"], dependencies: [{ kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiApplicationHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-application-header', imports: [SiTranslateModule, NgClass, A11yModule, NgTemplateOutlet, SiIconNextComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiApplicationHeaderComponent }], template: "<header\n  class=\"application-header\"\n  [ngClass]=\"'expand-' + expandBreakpoint()\"\n  [class.show-navigation]=\"mobileNavigationExpanded()\"\n>\n  @if (launchpad()) {\n    <button\n      type=\"button\"\n      class=\"header-toggle focus-inside\"\n      [class.show]=\"launchpadOpen()\"\n      [class.d-none]=\"hasNavigation()\"\n      [ngClass]=\"'d-' + expandBreakpoint() + '-block'\"\n      [attr.aria-expanded]=\"launchpadOpen()\"\n      [attr.aria-label]=\"launchpadLabel() | translate\"\n      [attr.aria-controls]=\"id + '-launchpad'\"\n      (click)=\"toggleLaunchpad()\"\n    >\n      <si-icon-next [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-next [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 [id]=\"id + '-launchpad'\">\n    <ng-template [ngTemplateOutlet]=\"launchpad()!\" [ngTemplateOutletInjector]=\"injector\" />\n  </div>\n}\n\n@if (openDropdownCount() || launchpadOpen()) {\n  <div\n    class=\"modal-backdrop\"\n    [ngClass]=\"launchpadOpen() ? 'd-block' : 'd-' + expandBreakpoint() + '-none'\"\n    (click)=\"backdropClicked()\"\n  ></div>\n}\n", styles: [".modal-backdrop{z-index:1032}\n"] }]
+            args: [{ selector: 'si-application-header', imports: [SiTranslatePipe, NgClass, A11yModule, NgTemplateOutlet, SiIconNextComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiApplicationHeaderComponent }], template: "<header\n  class=\"application-header\"\n  [ngClass]=\"'expand-' + expandBreakpoint()\"\n  [class.show-navigation]=\"mobileNavigationExpanded()\"\n>\n  @if (launchpad()) {\n    <button\n      type=\"button\"\n      class=\"header-toggle focus-inside\"\n      [class.show]=\"launchpadOpen()\"\n      [class.d-none]=\"hasNavigation()\"\n      [ngClass]=\"'d-' + expandBreakpoint() + '-block'\"\n      [attr.aria-expanded]=\"launchpadOpen()\"\n      [attr.aria-label]=\"launchpadLabel() | translate\"\n      [attr.aria-controls]=\"id + '-launchpad'\"\n      (click)=\"toggleLaunchpad()\"\n    >\n      <si-icon-next [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-next [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 [id]=\"id + '-launchpad'\">\n    <ng-template [ngTemplateOutlet]=\"launchpad()!\" [ngTemplateOutletInjector]=\"injector\" />\n  </div>\n}\n\n@if (openDropdownCount() || launchpadOpen()) {\n  <div\n    class=\"modal-backdrop\"\n    [ngClass]=\"launchpadOpen() ? 'd-block' : 'd-' + expandBreakpoint() + '-none'\"\n    (click)=\"backdropClicked()\"\n  ></div>\n}\n", styles: [".modal-backdrop{z-index:1032}\n"] }]
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /** Adds a navigation item to the header. Should be located inside `.header-navigation`. */
@@ -189,6 +188,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: 'button[si-header-navigation-item], a[si-header-navigation-item]',
+                    imports: [SiIconNextComponent],
                     template: `
     <div class="item-title">
       <ng-content />
@@ -197,20 +197,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
       <si-icon-next class="dropdown-caret" [icon]="icons.elementDown2" />
     }
   `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                     host: {
                         class: 'header-item focus-inside',
                         '[class.dropdown-toggle]': '!!dropdownTrigger'
                     },
                     providers: [
                         { provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
-                    ],
-                    imports: [SiIconNextComponent],
-                    changeDetection: ChangeDetectionStrategy.OnPush
+                    ]
                 }]
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /** Container for actions that should be collapsed in mobile mode. */
@@ -273,17 +272,17 @@ class SiHeaderCollapsibleActionsComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiHeaderCollapsibleActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.6", 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: [
             { provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
-        ], 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-next [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: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], 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-next [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: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiHeaderCollapsibleActionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-header-collapsible-actions', imports: [SiTranslateModule, A11yModule, SiIconNextComponent], host: { class: 'd-contents' }, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+            args: [{ selector: 'si-header-collapsible-actions', imports: [SiTranslatePipe, A11yModule, SiIconNextComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'd-contents' }, providers: [
                         { provide: SI_HEADER_DROPDOWN_OPTIONS, useValue: { disableRootFocusTrapForInlineMode: true } }
                     ], 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-next [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"] }]
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 class SiHeaderActionItemBase {
@@ -322,7 +321,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
             }] } });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /**
@@ -366,7 +365,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /** Adds an action item to the header. Should be located inside `.header-actions`. */
@@ -385,7 +384,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /** Adds an account item to the header. Should be located inside `.header-actions`. */
@@ -408,7 +407,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 class SiHeaderSelectionItemComponent extends SiHeaderActionItemBase {
@@ -430,7 +429,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /** The siemens logo. Should be located inside `.header-brand`. */
@@ -467,7 +466,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
             }] } });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /**
@@ -499,7 +498,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 class SiHeaderActionsDirective {
@@ -516,7 +515,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 class SiHeaderBrandDirective {
@@ -533,7 +532,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 class SiHeaderNavigationComponent {
@@ -559,12 +558,13 @@ class SiHeaderNavigationComponent {
       </button>
     }
     <ng-content />
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }] });
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiHeaderNavigationComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'si-header-navigation',
+                    imports: [NgClass, SiTranslatePipe, SiIconNextComponent],
                     template: `
     @if (header.launchpad()) {
       <button
@@ -579,13 +579,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
     }
     <ng-content />
   `,
-                    imports: [NgClass, SiTranslateModule, SiIconNextComponent],
                     host: { class: 'header-navigation', role: 'navigation' }
                 }]
         }], ctorParameters: () => [] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 class SiLaunchpadAppComponent {
@@ -630,7 +629,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
             }] } });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 class SiLaunchpadFactoryComponent {
@@ -735,7 +734,7 @@ class SiLaunchpadFactoryComponent {
         return items.some(item => 'apps' in item);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiLaunchpadFactoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", 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: "<div\n  class=\"app-switcher pt-8 g-5 g-sm-9 container-fluid\"\n  cdkTrapFocus\n  cdkTrapFocusAutoCapture\n  (keydown.escape)=\"escape()\"\n>\n  @if (titleText()) {\n    <p class=\"mb-4 si-title-1 lh-1\">{{ titleText() | translate }}</p>\n  }\n  @if (subtitleText()) {\n    <p class=\"si-body-2 text-secondary mb-4\">{{ subtitleText() | translate }}</p>\n  }\n  <div class=\"apps-scroll pb-8 ms-n2 ps-2\">\n    @for (category of categories(); track category; let first = $first) {\n      @if (!enableFavorites() || !hasFavorites() || first || showAllApps) {\n        <div class=\"mt-4\">\n          @if (category.name) {\n            <span class=\"si-title-1\">\n              {{ category.name | translate }}\n            </span>\n          }\n          <div class=\"mt-4 d-flex flex-wrap gap-4\">\n            @for (app of category.apps; track app) {\n              <!-- eslint-disable @angular-eslint/template/no-any -->\n              <!-- temporary until old primary-navbar is removed -->\n              <a\n                si-launchpad-app\n                [enableFavoriteToggle]=\"enableFavorites() && !$any(app)._noFavorite\"\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              <!-- eslint-enable @angular-eslint/template/no-any -->\n            }\n          </div>\n        </div>\n      }\n\n      @if (enableFavorites() && first && hasFavorites()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-link dropdown-toggle text-decoration-none my-4 si-title-2\"\n          [class.show]=\"showAllApps\"\n          (click)=\"showAllApps = !showAllApps\"\n        >\n          <b>{{ (showAllApps ? showLessAppsText() : showMoreAppsText()) | translate }}</b>\n          <si-icon-next class=\"dropdown-caret icon\" [icon]=\"icons.elementDown2\" />\n        </button>\n      }\n    }\n  </div>\n  <button\n    type=\"button\"\n    class=\"btn btn-circle btn-sm btn-ghost position-absolute top-0 end-0 mt-6 me-4\"\n    [attr.aria-label]=\"closeText() | translate\"\n    (click)=\"closeLaunchpad()\"\n  >\n    <si-icon-next [icon]=\"icons.elementCancel\" />\n  </button>\n</div>\n", styles: [".app-switcher{position:fixed;inset-block-start:calc(48px + var(--element-titlebar-spacing, 0px) + var(--element-system-banner-spacing, 0px));inset-inline:0;min-block-size:200px;max-block-size:calc(100vh - 48px - var(--element-titlebar-spacing, 0px) - var(--element-system-banner-spacing, 0px));display:flex;flex-direction:column;z-index:1033;background-color:var(--element-base-1);box-shadow:inset 0 0 4px var(--element-box-shadow-color-1),inset 0 4px 4px var(--element-box-shadow-color-2)}.apps-scroll{overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SiLinkModule }, { kind: "ngmodule", type: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }, { kind: "component", type: SiLaunchpadAppComponent, selector: "a[si-launchpad-app]", inputs: ["external", "active", "enableFavoriteToggle", "favorite", "action", "iconUrl", "iconClass"], outputs: ["favoriteChange"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", 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: "<div\n  class=\"app-switcher pt-8 g-5 g-sm-9 container-fluid\"\n  cdkTrapFocus\n  cdkTrapFocusAutoCapture\n  (keydown.escape)=\"escape()\"\n>\n  @if (titleText()) {\n    <p class=\"mb-4 si-title-1 lh-1\">{{ titleText() | translate }}</p>\n  }\n  @if (subtitleText()) {\n    <p class=\"si-body-2 text-secondary mb-4\">{{ subtitleText() | translate }}</p>\n  }\n  <div class=\"apps-scroll pb-8 ms-n2 ps-2\">\n    @for (category of categories(); track category; let first = $first) {\n      @if (!enableFavorites() || !hasFavorites() || first || showAllApps) {\n        <div class=\"mt-4\">\n          @if (category.name) {\n            <span class=\"si-title-1\">\n              {{ category.name | translate }}\n            </span>\n          }\n          <div class=\"mt-4 d-flex flex-wrap gap-4\">\n            @for (app of category.apps; track app) {\n              <!-- eslint-disable @angular-eslint/template/no-any -->\n              <!-- temporary until old primary-navbar is removed -->\n              <a\n                si-launchpad-app\n                [enableFavoriteToggle]=\"enableFavorites() && !$any(app)._noFavorite\"\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              <!-- eslint-enable @angular-eslint/template/no-any -->\n            }\n          </div>\n        </div>\n      }\n\n      @if (enableFavorites() && first && hasFavorites()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-link dropdown-toggle text-decoration-none my-4 si-title-2\"\n          [class.show]=\"showAllApps\"\n          (click)=\"showAllApps = !showAllApps\"\n        >\n          <b>{{ (showAllApps ? showLessAppsText() : showMoreAppsText()) | translate }}</b>\n          <si-icon-next class=\"dropdown-caret icon\" [icon]=\"icons.elementDown2\" />\n        </button>\n      }\n    }\n  </div>\n  <button\n    type=\"button\"\n    class=\"btn btn-circle btn-sm btn-ghost position-absolute top-0 end-0 mt-6 me-4\"\n    [attr.aria-label]=\"closeText() | translate\"\n    (click)=\"closeLaunchpad()\"\n  >\n    <si-icon-next [icon]=\"icons.elementCancel\" />\n  </button>\n</div>\n", styles: [".app-switcher{position:fixed;inset-block-start:calc(48px + var(--element-titlebar-spacing, 0px) + var(--element-system-banner-spacing, 0px));inset-inline:0;min-block-size:200px;max-block-size:calc(100vh - 48px - var(--element-titlebar-spacing, 0px) - var(--element-system-banner-spacing, 0px));display:flex;flex-direction:column;z-index:1033;background-color:var(--element-base-1);box-shadow:inset 0 0 4px var(--element-box-shadow-color-1),inset 0 4px 4px var(--element-box-shadow-color-2)}.apps-scroll{overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SiLinkModule }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "component", type: SiLaunchpadAppComponent, selector: "a[si-launchpad-app]", inputs: ["external", "active", "enableFavoriteToggle", "favorite", "action", "iconUrl", "iconClass"], outputs: ["favoriteChange"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiLaunchpadFactoryComponent, decorators: [{
             type: Component,
@@ -743,14 +742,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
                         A11yModule,
                         CommonModule,
                         SiLinkModule,
-                        SiTranslateModule,
+                        SiTranslatePipe,
                         SiLaunchpadAppComponent,
                         SiIconNextComponent
                     ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"app-switcher pt-8 g-5 g-sm-9 container-fluid\"\n  cdkTrapFocus\n  cdkTrapFocusAutoCapture\n  (keydown.escape)=\"escape()\"\n>\n  @if (titleText()) {\n    <p class=\"mb-4 si-title-1 lh-1\">{{ titleText() | translate }}</p>\n  }\n  @if (subtitleText()) {\n    <p class=\"si-body-2 text-secondary mb-4\">{{ subtitleText() | translate }}</p>\n  }\n  <div class=\"apps-scroll pb-8 ms-n2 ps-2\">\n    @for (category of categories(); track category; let first = $first) {\n      @if (!enableFavorites() || !hasFavorites() || first || showAllApps) {\n        <div class=\"mt-4\">\n          @if (category.name) {\n            <span class=\"si-title-1\">\n              {{ category.name | translate }}\n            </span>\n          }\n          <div class=\"mt-4 d-flex flex-wrap gap-4\">\n            @for (app of category.apps; track app) {\n              <!-- eslint-disable @angular-eslint/template/no-any -->\n              <!-- temporary until old primary-navbar is removed -->\n              <a\n                si-launchpad-app\n                [enableFavoriteToggle]=\"enableFavorites() && !$any(app)._noFavorite\"\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              <!-- eslint-enable @angular-eslint/template/no-any -->\n            }\n          </div>\n        </div>\n      }\n\n      @if (enableFavorites() && first && hasFavorites()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-link dropdown-toggle text-decoration-none my-4 si-title-2\"\n          [class.show]=\"showAllApps\"\n          (click)=\"showAllApps = !showAllApps\"\n        >\n          <b>{{ (showAllApps ? showLessAppsText() : showMoreAppsText()) | translate }}</b>\n          <si-icon-next class=\"dropdown-caret icon\" [icon]=\"icons.elementDown2\" />\n        </button>\n      }\n    }\n  </div>\n  <button\n    type=\"button\"\n    class=\"btn btn-circle btn-sm btn-ghost position-absolute top-0 end-0 mt-6 me-4\"\n    [attr.aria-label]=\"closeText() | translate\"\n    (click)=\"closeLaunchpad()\"\n  >\n    <si-icon-next [icon]=\"icons.elementCancel\" />\n  </button>\n</div>\n", styles: [".app-switcher{position:fixed;inset-block-start:calc(48px + var(--element-titlebar-spacing, 0px) + var(--element-system-banner-spacing, 0px));inset-inline:0;min-block-size:200px;max-block-size:calc(100vh - 48px - var(--element-titlebar-spacing, 0px) - var(--element-system-banner-spacing, 0px));display:flex;flex-direction:column;z-index:1033;background-color:var(--element-base-1);box-shadow:inset 0 0 4px var(--element-box-shadow-color-1),inset 0 4px 4px var(--element-box-shadow-color-2)}.apps-scroll{overflow-y:auto}\n"] }]
         }] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */