@siemens/element-ng 47.1.0-next.3 → 47.1.0

package/fesm2022/siemens-element-ng-navbar.mjs

@@ -0,0 +1,386 @@
+import { NgTemplateOutlet, NgClass } from '@angular/common';
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, output, viewChild, signal, Component, inject, NgModule } from '@angular/core';
+import { SiHeaderDropdownComponent, SiHeaderDropdownTriggerDirective, SiHeaderDropdownItemsFactoryComponent, SI_HEADER_WITH_DROPDOWNS } from '@siemens/element-ng/header-dropdown';
+import { SiLinkDirective } from '@siemens/element-ng/link';
+import * as i1 from '@siemens/element-translate-ng/translate';
+import { SiTranslateModule } from '@siemens/element-translate-ng/translate';
+import { A11yModule } from '@angular/cdk/a11y';
+import { SiApplicationHeaderComponent, SiHeaderCollapsibleActionsComponent, SiLaunchpadFactoryComponent, SiHeaderAccountItemComponent, SiHeaderNavigationItemComponent, SiHeaderBrandDirective, SiHeaderNavigationComponent, SiHeaderActionsDirective, SiHeaderLogoDirective } from '@siemens/element-ng/application-header';
+import { defer } from 'rxjs';
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+/** @deprecated Use the new `si-application-header` instead. */
+class SiNavbarPrimaryComponent {
+    /**
+     * List of navbar items which should be displayed at the left (in LTR) side next to the
+     * banner.
+     *
+     * @defaultValue []
+     */
+    primaryItems = input([]);
+    /**
+     * List of account dropdown elements (defined by `title` and `link`).
+     *
+     * The menu item can have submenu items (supplying `items`: MenuItem[]).
+     * Submenu items can be divided into groups by separators. A separator is
+     * an item with only '-' set as `title`.
+     *
+     * Alternatively, you can can create a custom content by putting your html
+     * code between the <si-navbar-primary> tags. In this case you don't need this
+     * property (will be ignored if you set anyway).
+     */
+    accountItems = input();
+    /**
+     * Account settings name (`title`) and profile picture (`image` or `icon`)
+     */
+    account = input();
+    /**
+     * URL of the navbar brand.
+     */
+    logoUrl = input();
+    /**
+     * Title of the application.
+     */
+    appTitle = input();
+    /**
+     * Configurable home link that is used at the logo and app title.
+     * Use `undefined` to disable the link.
+     *
+     * @defaultValue
+     * ```
+     * { link: '/' }
+     * ```
+     */
+    home = input({ link: '/' });
+    /**
+     * title for the launchpad
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.TITLE:Launchpad`
+     * ```
+     */
+    appSwitcherTitle = input($localize `:@@SI_LAUNCHPAD.TITLE:Launchpad`);
+    /**
+     * sub-title for the launchpad
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.SUB_TITLE:Access all your apps`
+     * ```
+     */
+    appSwitcherSubTitle = input($localize `:@@SI_LAUNCHPAD.SUB_TITLE:Access all your apps`);
+    /**
+     * Title or translate key for the favorite apps section.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorite apps`
+     * ```
+     */
+    favoriteAppsTitle = input($localize `:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorite apps`);
+    /**
+     * Title or translate key for the default apps section.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE:Apps`
+     * ```
+     */
+    defaultAppsTitle = input($localize `:@@SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE:Apps`);
+    /**
+     * Title or translate key for the show more apps button.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.SHOW_MORE:Show more`
+     * ```
+     */
+    showMoreAppsTitle = input($localize `:@@SI_LAUNCHPAD.SHOW_MORE:Show more`);
+    /**
+     * Title or translate key for the show less apps button.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.SHOW_LESS:Show less`
+     * ```
+     */
+    showLessAppsTitle = input($localize `:@@SI_LAUNCHPAD.SHOW_LESS:Show less`);
+    /**
+     * All app items shown in the launchpad. The launchpad will not be visible if the
+     * app items are undefined. The launchpad will be visible if the app items are an
+     * empty array.
+     */
+    appItems = input();
+    /**
+     * Like `appItems` but with the addition of categories. If this is set, `appItems` is ignored.
+     */
+    appCategoryItems = input();
+    /**
+     * Allow the user to favorite apps which will then be displayed at the top.
+     *
+     * @defaultValue false
+     */
+    appItemsFavorites = input(false, { transform: booleanAttribute });
+    /**
+     * "all apps" link in the launchpad
+     */
+    allAppsLink = input();
+    /**
+     * Specifies whether the component should automatically be focused as soon as it is loaded.
+     *
+     * @defaultValue false
+     */
+    focusOnLoad = input(false, { transform: booleanAttribute });
+    /**
+     * Marks the navbar as primary navigation element. Needed for a11y (screen reader).
+     * Only one element should be primary. If multiple navbars are used, it's up to the
+     * user of the components to label them in the correct order.
+     *
+     * @defaultValue 'Primary'
+     */
+    navAriaLabel = input('Primary');
+    /**
+     * Text to close the launchpad. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.CLOSE:Close launchpad`
+     * ```
+     */
+    closeAppSwitcherText = input($localize `:@@SI_LAUNCHPAD.CLOSE:Close launchpad`);
+    /**
+     * Text for the launchpad icon. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_NAVBAR.OPEN_LAUNCHPAD:Open launchpad`
+     * ```
+     */
+    openAppSwitcherText = input($localize `:@@SI_NAVBAR.OPEN_LAUNCHPAD:Open launchpad`);
+    /**
+     * Text or translate key for the toggle navigation icon. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_NAVBAR.TOGGLE_NAVIGATION:Toggle navigation`
+     * ```
+     */
+    toggleNavigationText = input($localize `:@@SI_NAVBAR.TOGGLE_NAVIGATION:Toggle navigation`);
+    /**
+     * Aria label for the main menu landmark
+     *
+     * @defaultValue 'Header main'
+     */
+    ariaLabelMainMenu = input('Header main');
+    /**
+     * Aria label for the secondary menu landmark
+     *
+     * @defaultValue 'Header secondary'
+     */
+    ariaLabelSecondaryMenu = input('Header secondary');
+    appItemFavoriteChanged = output();
+    /** @internal */
+    header = viewChild.required(SiApplicationHeaderComponent);
+    /** @internal */
+    collapsibleActions = viewChild(SiHeaderCollapsibleActionsComponent);
+    /** @internal */
+    navItemCount = signal(0);
+    newAppItems;
+    active;
+    /** @internal */
+    // defer is required as header is not available at the time of creation.`
+    inlineDropdown = defer(() => this.header().inlineDropdown);
+    /** @internal */
+    onDropdownItemTriggered() {
+        this.header().onDropdownItemTriggered();
+    }
+    /** @internal */
+    ngOnChanges(changes) {
+        if (changes.appItems || changes.appCategoryItems) {
+            const appItems = this.appItems();
+            const appCategoryItems = this.appCategoryItems();
+            if (appCategoryItems) {
+                this.newAppItems = appCategoryItems.map(category => ({
+                    // Violation by intention.
+                    // Empty strings should also be replaced by the default title.
+                    // We rely on this in our examples, so projects might as well.
+                    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+                    name: category.category || this.defaultAppsTitle(),
+                    apps: this.convertApps(category.items)
+                }));
+                const allAppsLink = this.allAppsLink();
+                if (allAppsLink && this.newAppItems.length) {
+                    const lastCategory = this.newAppItems.at(-1);
+                    lastCategory.apps.push({
+                        name: allAppsLink.title,
+                        iconClass: allAppsLink.icon ?? 'element-plus',
+                        href: allAppsLink.href,
+                        target: allAppsLink.target,
+                        _noFavorite: true // this should not show up in public API, but we need it for now.
+                    });
+                }
+            }
+            else if (appItems) {
+                this.newAppItems = this.convertApps(appItems);
+                const allAppsLink = this.allAppsLink();
+                if (allAppsLink) {
+                    this.newAppItems.push({
+                        name: allAppsLink.title,
+                        iconClass: allAppsLink.icon ?? 'element-plus',
+                        href: allAppsLink.href,
+                        target: allAppsLink.target,
+                        _noFavorite: true // this should not show up in public API, but we need it for now.
+                    });
+                }
+            }
+        }
+    }
+    convertApps(apps) {
+        return apps.map(app => ({
+            name: app.title,
+            href: app.href,
+            external: app.isExternal,
+            active: app.isActive,
+            target: app.target,
+            iconClass: app.icon,
+            favorite: app.isFavorite,
+            _src: app // this should not show up in public API, but we need it for now.
+        }));
+    }
+    onFavoriteChange({ app, favorite }) {
+        this.appItemFavoriteChanged.emit([app._src, favorite]);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarPrimaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: SiNavbarPrimaryComponent, isStandalone: true, selector: "si-navbar-primary", inputs: { primaryItems: { classPropertyName: "primaryItems", publicName: "primaryItems", isSignal: true, isRequired: false, transformFunction: null }, accountItems: { classPropertyName: "accountItems", publicName: "accountItems", isSignal: true, isRequired: false, transformFunction: null }, account: { classPropertyName: "account", publicName: "account", isSignal: true, isRequired: false, transformFunction: null }, logoUrl: { classPropertyName: "logoUrl", publicName: "logoUrl", isSignal: true, isRequired: false, transformFunction: null }, appTitle: { classPropertyName: "appTitle", publicName: "appTitle", isSignal: true, isRequired: false, transformFunction: null }, home: { classPropertyName: "home", publicName: "home", isSignal: true, isRequired: false, transformFunction: null }, appSwitcherTitle: { classPropertyName: "appSwitcherTitle", publicName: "appSwitcherTitle", isSignal: true, isRequired: false, transformFunction: null }, appSwitcherSubTitle: { classPropertyName: "appSwitcherSubTitle", publicName: "appSwitcherSubTitle", isSignal: true, isRequired: false, transformFunction: null }, favoriteAppsTitle: { classPropertyName: "favoriteAppsTitle", publicName: "favoriteAppsTitle", isSignal: true, isRequired: false, transformFunction: null }, defaultAppsTitle: { classPropertyName: "defaultAppsTitle", publicName: "defaultAppsTitle", isSignal: true, isRequired: false, transformFunction: null }, showMoreAppsTitle: { classPropertyName: "showMoreAppsTitle", publicName: "showMoreAppsTitle", isSignal: true, isRequired: false, transformFunction: null }, showLessAppsTitle: { classPropertyName: "showLessAppsTitle", publicName: "showLessAppsTitle", isSignal: true, isRequired: false, transformFunction: null }, appItems: { classPropertyName: "appItems", publicName: "appItems", isSignal: true, isRequired: false, transformFunction: null }, appCategoryItems: { classPropertyName: "appCategoryItems", publicName: "appCategoryItems", isSignal: true, isRequired: false, transformFunction: null }, appItemsFavorites: { classPropertyName: "appItemsFavorites", publicName: "appItemsFavorites", isSignal: true, isRequired: false, transformFunction: null }, allAppsLink: { classPropertyName: "allAppsLink", publicName: "allAppsLink", isSignal: true, isRequired: false, transformFunction: null }, focusOnLoad: { classPropertyName: "focusOnLoad", publicName: "focusOnLoad", isSignal: true, isRequired: false, transformFunction: null }, navAriaLabel: { classPropertyName: "navAriaLabel", publicName: "navAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, closeAppSwitcherText: { classPropertyName: "closeAppSwitcherText", publicName: "closeAppSwitcherText", isSignal: true, isRequired: false, transformFunction: null }, openAppSwitcherText: { classPropertyName: "openAppSwitcherText", publicName: "openAppSwitcherText", isSignal: true, isRequired: false, transformFunction: null }, toggleNavigationText: { classPropertyName: "toggleNavigationText", publicName: "toggleNavigationText", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelMainMenu: { classPropertyName: "ariaLabelMainMenu", publicName: "ariaLabelMainMenu", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelSecondaryMenu: { classPropertyName: "ariaLabelSecondaryMenu", publicName: "ariaLabelSecondaryMenu", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { appItemFavoriteChanged: "appItemFavoriteChanged" }, providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiNavbarPrimaryComponent }], viewQueries: [{ propertyName: "header", first: true, predicate: SiApplicationHeaderComponent, descendants: true, isSignal: true }, { propertyName: "collapsibleActions", first: true, predicate: SiHeaderCollapsibleActionsComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<si-application-header [launchpad]=\"newAppItems ? launchpad : undefined\">\n  <si-header-brand>\n    @if (logoUrl()) {\n      <a class=\"header-logo header-custom-logo px-6 focus-inside\" [siLink]=\"home()\">\n        <img alt=\"Siemens logo\" [src]=\"logoUrl()\" />\n      </a>\n    } @else {\n      <a siHeaderLogo class=\"d-none d-md-flex\" [siLink]=\"home()\"></a>\n    }\n    @if (appTitle()) {\n      <span class=\"application-name\">{{ appTitle() }}</span>\n    }\n  </si-header-brand>\n\n  @if (primaryItems().length) {\n    <si-header-navigation [attr.aria-label]=\"ariaLabelMainMenu()\">\n      @for (item of primaryItems(); track $index) {\n        @if (item.items) {\n          <button\n            type=\"button\"\n            si-header-navigation-item\n            [siHeaderDropdownTriggerFor]=\"dropdown\"\n            [class.active]=\"active === item\"\n          >\n            {{ item.title | translate }}\n            <ng-template #dropdown>\n              <si-header-dropdown>\n                <si-header-dropdown-items-factory\n                  [items]=\"item.items\"\n                  (activeChange)=\"$event ? (active = item) : null\"\n                />\n              </si-header-dropdown>\n            </ng-template>\n          </button>\n        } @else {\n          <a\n            si-header-navigation-item\n            activeClass=\"active\"\n            [siLink]=\"item\"\n            (activeChange)=\"$event ? (active = item) : null\"\n          >\n            {{ item.title | translate }}\n          </a>\n        }\n      }\n    </si-header-navigation>\n  }\n  @if (navItemCount() || account()) {\n    <si-header-actions [attr.aria-label]=\"ariaLabelSecondaryMenu()\">\n      @if (navItemCount()) {\n        @if (navItemCount() === 1) {\n          <ng-container *ngTemplateOutlet=\"actions\" />\n        } @else {\n          <si-header-collapsible-actions>\n            <ng-container *ngTemplateOutlet=\"actions\" />\n          </si-header-collapsible-actions>\n        }\n      }\n      @if (account()) {\n        <!--eslint-disable @angular-eslint/template/elements-content -->\n        <button\n          si-header-account-item\n          type=\"button\"\n          [name]=\"account()!.title\"\n          [initials]=\"account()!.initials\"\n          [imageUrl]=\"account()!.image\"\n          [siHeaderDropdownTriggerFor]=\"accountDropdown\"\n        ></button>\n        <!--eslint-enable @angular-eslint/template/elements-content -->\n\n        <ng-template #accountDropdown>\n          <si-header-dropdown>\n            <div class=\"d-block userinfo mx-5 mb-4\">\n              <div class=\"si-title-2 text-truncate\">{{ account()!.title }}</div>\n              @if (account()!.email) {\n                <div class=\"email\">{{ account()!.email }}</div>\n              }\n              <div class=\"d-flex align-items-center text-secondary mt-2\">\n                @if (account()!.company) {\n                  <span class=\"label me-4\">{{ account()!.company | translate }}</span>\n                }\n                @if (account()!.role) {\n                  <span class=\"ms-0 badge bg-default\">\n                    {{ account()!.role | translate }}\n                  </span>\n                }\n              </div>\n            </div>\n            @if (accountItems()?.length) {\n              <div class=\"d-block dropdown-divider\" role=\"separator\"></div>\n              <si-header-dropdown-items-factory [items]=\"accountItems()!\" />\n            }\n            @if (account()!.customContent) {\n              <div class=\"d-block dropdown-divider\" role=\"separator\"></div>\n              <ng-content />\n            }\n          </si-header-dropdown>\n        </ng-template>\n      }\n    </si-header-actions>\n  } @else {\n    <!-- Seems like @if makes ng-content believe that there is always a header-actions section. So we have to add it here. -->\n    <si-header-actions />\n  }\n</si-application-header>\n\n<ng-template #launchpad>\n  <si-launchpad-factory\n    [showLessAppsText]=\"showLessAppsTitle()\"\n    [showMoreAppsText]=\"showMoreAppsTitle()\"\n    [closeText]=\"closeAppSwitcherText()\"\n    [titleText]=\"appSwitcherTitle()\"\n    [subtitleText]=\"appSwitcherSubTitle()\"\n    [enableFavorites]=\"appItemsFavorites()\"\n    [favoriteAppsText]=\"favoriteAppsTitle()\"\n    [apps]=\"newAppItems!\"\n    (favoriteChange)=\"onFavoriteChange($event)\"\n  />\n</ng-template>\n<ng-template #actions>\n  <ng-content select=\"si-navbar-item[quickAction], element-navbar-item[quickAction='true']\" />\n</ng-template>\n", styles: [".header-custom-logo{content:initial;inline-size:auto}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SiLinkDirective, selector: "[siLink]", inputs: ["siLink", "siLinkDefaultTarget", "actionParam", "activeClass", "exactMatch", "ariaCurrent"], outputs: ["activeChange"], exportAs: ["siLink"] }, { kind: "ngmodule", type: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }, { kind: "component", type: SiApplicationHeaderComponent, selector: "si-application-header", inputs: ["expandBreakpoint", "launchpad", "launchpadLabel"] }, { kind: "component", type: SiLaunchpadFactoryComponent, selector: "si-launchpad-factory", inputs: ["closeText", "titleText", "subtitleText", "apps", "enableFavorites", "favoriteAppsText", "showMoreAppsText", "showLessAppsText"], outputs: ["favoriteChange"] }, { kind: "component", type: SiHeaderAccountItemComponent, selector: "button[si-header-account-item]", inputs: ["name", "initials", "imageUrl"] }, { kind: "component", type: SiHeaderDropdownComponent, selector: "si-header-dropdown" }, { kind: "directive", type: SiHeaderDropdownTriggerDirective, selector: "[siHeaderDropdownTriggerFor]", inputs: ["siHeaderDropdownTriggerFor", "dropdownData"], outputs: ["openChange"], exportAs: ["siHeaderDropdownTrigger"] }, { kind: "component", type: SiHeaderDropdownItemsFactoryComponent, selector: "si-header-dropdown-items-factory", inputs: ["items"], outputs: ["activeChange"] }, { kind: "component", type: SiHeaderNavigationItemComponent, selector: "button[si-header-navigation-item], a[si-header-navigation-item]" }, { kind: "directive", type: SiHeaderBrandDirective, selector: "si-header-brand" }, { kind: "component", type: SiHeaderNavigationComponent, selector: "si-header-navigation" }, { kind: "directive", type: SiHeaderActionsDirective, selector: "si-header-actions" }, { kind: "component", type: SiHeaderCollapsibleActionsComponent, selector: "si-header-collapsible-actions", inputs: ["mobileToggleLabel"] }, { kind: "directive", type: SiHeaderLogoDirective, selector: "si-header-logo, [siHeaderLogo]" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarPrimaryComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'si-navbar-primary', imports: [
+                        A11yModule,
+                        NgTemplateOutlet,
+                        SiLinkDirective,
+                        SiTranslateModule,
+                        SiApplicationHeaderComponent,
+                        SiLaunchpadFactoryComponent,
+                        SiHeaderAccountItemComponent,
+                        SiHeaderDropdownComponent,
+                        SiHeaderDropdownTriggerDirective,
+                        SiHeaderDropdownItemsFactoryComponent,
+                        SiHeaderNavigationItemComponent,
+                        SiHeaderBrandDirective,
+                        SiHeaderNavigationComponent,
+                        SiHeaderActionsDirective,
+                        SiHeaderCollapsibleActionsComponent,
+                        SiHeaderLogoDirective
+                    ], providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiNavbarPrimaryComponent }], template: "<si-application-header [launchpad]=\"newAppItems ? launchpad : undefined\">\n  <si-header-brand>\n    @if (logoUrl()) {\n      <a class=\"header-logo header-custom-logo px-6 focus-inside\" [siLink]=\"home()\">\n        <img alt=\"Siemens logo\" [src]=\"logoUrl()\" />\n      </a>\n    } @else {\n      <a siHeaderLogo class=\"d-none d-md-flex\" [siLink]=\"home()\"></a>\n    }\n    @if (appTitle()) {\n      <span class=\"application-name\">{{ appTitle() }}</span>\n    }\n  </si-header-brand>\n\n  @if (primaryItems().length) {\n    <si-header-navigation [attr.aria-label]=\"ariaLabelMainMenu()\">\n      @for (item of primaryItems(); track $index) {\n        @if (item.items) {\n          <button\n            type=\"button\"\n            si-header-navigation-item\n            [siHeaderDropdownTriggerFor]=\"dropdown\"\n            [class.active]=\"active === item\"\n          >\n            {{ item.title | translate }}\n            <ng-template #dropdown>\n              <si-header-dropdown>\n                <si-header-dropdown-items-factory\n                  [items]=\"item.items\"\n                  (activeChange)=\"$event ? (active = item) : null\"\n                />\n              </si-header-dropdown>\n            </ng-template>\n          </button>\n        } @else {\n          <a\n            si-header-navigation-item\n            activeClass=\"active\"\n            [siLink]=\"item\"\n            (activeChange)=\"$event ? (active = item) : null\"\n          >\n            {{ item.title | translate }}\n          </a>\n        }\n      }\n    </si-header-navigation>\n  }\n  @if (navItemCount() || account()) {\n    <si-header-actions [attr.aria-label]=\"ariaLabelSecondaryMenu()\">\n      @if (navItemCount()) {\n        @if (navItemCount() === 1) {\n          <ng-container *ngTemplateOutlet=\"actions\" />\n        } @else {\n          <si-header-collapsible-actions>\n            <ng-container *ngTemplateOutlet=\"actions\" />\n          </si-header-collapsible-actions>\n        }\n      }\n      @if (account()) {\n        <!--eslint-disable @angular-eslint/template/elements-content -->\n        <button\n          si-header-account-item\n          type=\"button\"\n          [name]=\"account()!.title\"\n          [initials]=\"account()!.initials\"\n          [imageUrl]=\"account()!.image\"\n          [siHeaderDropdownTriggerFor]=\"accountDropdown\"\n        ></button>\n        <!--eslint-enable @angular-eslint/template/elements-content -->\n\n        <ng-template #accountDropdown>\n          <si-header-dropdown>\n            <div class=\"d-block userinfo mx-5 mb-4\">\n              <div class=\"si-title-2 text-truncate\">{{ account()!.title }}</div>\n              @if (account()!.email) {\n                <div class=\"email\">{{ account()!.email }}</div>\n              }\n              <div class=\"d-flex align-items-center text-secondary mt-2\">\n                @if (account()!.company) {\n                  <span class=\"label me-4\">{{ account()!.company | translate }}</span>\n                }\n                @if (account()!.role) {\n                  <span class=\"ms-0 badge bg-default\">\n                    {{ account()!.role | translate }}\n                  </span>\n                }\n              </div>\n            </div>\n            @if (accountItems()?.length) {\n              <div class=\"d-block dropdown-divider\" role=\"separator\"></div>\n              <si-header-dropdown-items-factory [items]=\"accountItems()!\" />\n            }\n            @if (account()!.customContent) {\n              <div class=\"d-block dropdown-divider\" role=\"separator\"></div>\n              <ng-content />\n            }\n          </si-header-dropdown>\n        </ng-template>\n      }\n    </si-header-actions>\n  } @else {\n    <!-- Seems like @if makes ng-content believe that there is always a header-actions section. So we have to add it here. -->\n    <si-header-actions />\n  }\n</si-application-header>\n\n<ng-template #launchpad>\n  <si-launchpad-factory\n    [showLessAppsText]=\"showLessAppsTitle()\"\n    [showMoreAppsText]=\"showMoreAppsTitle()\"\n    [closeText]=\"closeAppSwitcherText()\"\n    [titleText]=\"appSwitcherTitle()\"\n    [subtitleText]=\"appSwitcherSubTitle()\"\n    [enableFavorites]=\"appItemsFavorites()\"\n    [favoriteAppsText]=\"favoriteAppsTitle()\"\n    [apps]=\"newAppItems!\"\n    (favoriteChange)=\"onFavoriteChange($event)\"\n  />\n</ng-template>\n<ng-template #actions>\n  <ng-content select=\"si-navbar-item[quickAction], element-navbar-item[quickAction='true']\" />\n</ng-template>\n", styles: [".header-custom-logo{content:initial;inline-size:auto}\n"] }]
+        }] });
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+/** @deprecated Use the new `si-application-header` instead. */
+class SiNavbarItemComponent {
+    /**
+     * MenuItem to display in the navbar.
+     */
+    item = input.required();
+    /**
+     * Is the item a quick action displayed on the end (right in LTR) side
+     *
+     * @defaultValue false
+     */
+    quickAction = input(false, { transform: booleanAttribute });
+    dropdownTrigger = viewChild(SiHeaderDropdownTriggerDirective);
+    active = false;
+    navbar = inject(SiNavbarPrimaryComponent);
+    hasBadge = false;
+    ngOnInit() {
+        this.navbar.header().closeMobileMenus.subscribe(() => this.dropdownTrigger()?.close());
+        this.navbar.navItemCount.update(value => value + 1);
+    }
+    ngDoCheck() {
+        const item = this.item();
+        const newHasBadge = !!(item.badge ?? item.badgeDot);
+        if (this.quickAction() && this.hasBadge !== newHasBadge) {
+            this.hasBadge = newHasBadge;
+            if (this.hasBadge) {
+                this.navbar.collapsibleActions()?.badgeCount.update(value => value + 1);
+            }
+            else {
+                this.navbar.collapsibleActions()?.badgeCount.update(value => value - 1);
+            }
+        }
+    }
+    ngOnDestroy() {
+        this.navbar.navItemCount.update(value => value - 1);
+    }
+    click() {
+        if (!this.dropdownTrigger()) {
+            this.navbar.header().closeMobileMenus.next();
+        }
+    }
+    get visuallyHideTitle() {
+        return !this.navbar.collapsibleActions()?.mobileExpanded();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: SiNavbarItemComponent, isStandalone: true, selector: "si-navbar-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, quickAction: { classPropertyName: "quickAction", publicName: "quickAction", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "d-contents" }, viewQueries: [{ propertyName: "dropdownTrigger", first: true, predicate: SiHeaderDropdownTriggerDirective, descendants: true, isSignal: true }], ngImport: i0, template: "@if (item().items || item().customContent) {\n  <button\n    type=\"button\"\n    class=\"header-item focus-inside\"\n    [class.active]=\"active\"\n    [attr.aria-label]=\"item().title | translate\"\n    [siHeaderDropdownTriggerFor]=\"dropdown\"\n    (click)=\"click()\"\n  >\n    <ng-container *ngTemplateOutlet=\"itemContent\" />\n    <div class=\"element-down-2 dropdown-caret\" aria-hidden=\"true\"></div>\n  </button>\n} @else {\n  <a\n    class=\"header-item focus-inside\"\n    activeClass=\"active\"\n    [siLink]=\"item()\"\n    [attr.aria-label]=\"item().title | translate\"\n    (activeChange)=\"active = $event\"\n    (click)=\"click()\"\n  >\n    <ng-container *ngTemplateOutlet=\"itemContent\" />\n  </a>\n}\n\n<ng-template #itemContent>\n  <div class=\"icon\" aria-hidden=\"true\" [ngClass]=\"item().icon\"></div>\n  @if (item().badge) {\n    <div class=\"badge-text\">{{ item().badge }}</div>\n  }\n  <ng-content select=\"si-avatar\" />\n  <div class=\"item-title\" [class.visually-hidden]=\"visuallyHideTitle\">\n    {{ item().title | translate }}\n  </div>\n</ng-template>\n\n<ng-template #dropdown>\n  <si-header-dropdown>\n    @if (item().items) {\n      <si-header-dropdown-items-factory [items]=\"item().items!\" (activeChange)=\"active = $event\" />\n    }\n    @if (item().customContent) {\n      <ng-content />\n    }\n  </si-header-dropdown>\n</ng-template>\n", dependencies: [{ kind: "directive", type: SiLinkDirective, selector: "[siLink]", inputs: ["siLink", "siLinkDefaultTarget", "actionParam", "activeClass", "exactMatch", "ariaCurrent"], outputs: ["activeChange"], exportAs: ["siLink"] }, { kind: "ngmodule", type: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiHeaderDropdownComponent, selector: "si-header-dropdown" }, { kind: "component", type: SiHeaderDropdownItemsFactoryComponent, selector: "si-header-dropdown-items-factory", inputs: ["items"], outputs: ["activeChange"] }, { kind: "directive", type: SiHeaderDropdownTriggerDirective, selector: "[siHeaderDropdownTriggerFor]", inputs: ["siHeaderDropdownTriggerFor", "dropdownData"], outputs: ["openChange"], exportAs: ["siHeaderDropdownTrigger"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'si-navbar-item', imports: [
+                        SiLinkDirective,
+                        SiTranslateModule,
+                        NgClass,
+                        NgTemplateOutlet,
+                        SiHeaderDropdownComponent,
+                        SiHeaderDropdownItemsFactoryComponent,
+                        SiHeaderDropdownTriggerDirective
+                    ], host: { class: 'd-contents' }, template: "@if (item().items || item().customContent) {\n  <button\n    type=\"button\"\n    class=\"header-item focus-inside\"\n    [class.active]=\"active\"\n    [attr.aria-label]=\"item().title | translate\"\n    [siHeaderDropdownTriggerFor]=\"dropdown\"\n    (click)=\"click()\"\n  >\n    <ng-container *ngTemplateOutlet=\"itemContent\" />\n    <div class=\"element-down-2 dropdown-caret\" aria-hidden=\"true\"></div>\n  </button>\n} @else {\n  <a\n    class=\"header-item focus-inside\"\n    activeClass=\"active\"\n    [siLink]=\"item()\"\n    [attr.aria-label]=\"item().title | translate\"\n    (activeChange)=\"active = $event\"\n    (click)=\"click()\"\n  >\n    <ng-container *ngTemplateOutlet=\"itemContent\" />\n  </a>\n}\n\n<ng-template #itemContent>\n  <div class=\"icon\" aria-hidden=\"true\" [ngClass]=\"item().icon\"></div>\n  @if (item().badge) {\n    <div class=\"badge-text\">{{ item().badge }}</div>\n  }\n  <ng-content select=\"si-avatar\" />\n  <div class=\"item-title\" [class.visually-hidden]=\"visuallyHideTitle\">\n    {{ item().title | translate }}\n  </div>\n</ng-template>\n\n<ng-template #dropdown>\n  <si-header-dropdown>\n    @if (item().items) {\n      <si-header-dropdown-items-factory [items]=\"item().items!\" (activeChange)=\"active = $event\" />\n    }\n    @if (item().customContent) {\n      <ng-content />\n    }\n  </si-header-dropdown>\n</ng-template>\n" }]
+        }] });
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+const components = [SiNavbarItemComponent, SiNavbarPrimaryComponent];
+/** @deprecated Use the new `si-application-header` instead. */
+class SiNavbarModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarModule, imports: [SiNavbarItemComponent, SiNavbarPrimaryComponent], exports: [SiNavbarItemComponent, SiNavbarPrimaryComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarModule, imports: [components] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiNavbarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: components,
+                    exports: components
+                }]
+        }] });
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SiNavbarItemComponent, SiNavbarModule, SiNavbarPrimaryComponent };
+//# sourceMappingURL=siemens-element-ng-navbar.mjs.map

package/fesm2022/siemens-element-ng-navbar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"siemens-element-ng-navbar.mjs","sources":["../../../../projects/element-ng/navbar/si-navbar-primary/si-navbar-primary.component.ts","../../../../projects/element-ng/navbar/si-navbar-primary/si-navbar-primary.component.html","../../../../projects/element-ng/navbar/si-navbar-item/si-navbar-item.component.ts","../../../../projects/element-ng/navbar/si-navbar-item/si-navbar-item.component.html","../../../../projects/element-ng/navbar/si-navbar-item/index.ts","../../../../projects/element-ng/navbar/si-navbar-primary/index.ts","../../../../projects/element-ng/navbar/si-navbar.module.ts","../../../../projects/element-ng/navbar/index.ts","../../../../projects/element-ng/navbar/siemens-element-ng-navbar.ts"],"sourcesContent":["/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  input,\n  OnChanges,\n  output,\n  signal,\n  SimpleChanges,\n  viewChild\n} from '@angular/core';\nimport {\n  App,\n  AppCategory,\n  FavoriteChangeEvent,\n  SiApplicationHeaderComponent,\n  SiHeaderAccountItemComponent,\n  SiHeaderActionsDirective,\n  SiHeaderBrandDirective,\n  SiHeaderCollapsibleActionsComponent,\n  SiHeaderLogoDirective,\n  SiHeaderNavigationComponent,\n  SiHeaderNavigationItemComponent,\n  SiLaunchpadFactoryComponent\n} from '@siemens/element-ng/application-header';\nimport { MenuItem } from '@siemens/element-ng/common';\nimport {\n  HeaderWithDropdowns,\n  SI_HEADER_WITH_DROPDOWNS,\n  SiHeaderDropdownComponent,\n  SiHeaderDropdownItemsFactoryComponent,\n  SiHeaderDropdownTriggerDirective\n} from '@siemens/element-ng/header-dropdown';\nimport { Link, SiLinkDirective } from '@siemens/element-ng/link';\nimport { SiTranslateModule } from '@siemens/element-translate-ng/translate';\nimport { defer } from 'rxjs';\n\nimport { AccountItem } from '../account.model';\nimport { AppItem, AppItemCategory } from './si-navbar-primary.model';\n\n/** @deprecated Use the new `si-application-header` instead. */\n@Component({\n  selector: 'si-navbar-primary',\n  templateUrl: './si-navbar-primary.component.html',\n  imports: [\n    A11yModule,\n    NgTemplateOutlet,\n    SiLinkDirective,\n    SiTranslateModule,\n    SiApplicationHeaderComponent,\n    SiLaunchpadFactoryComponent,\n    SiHeaderAccountItemComponent,\n    SiHeaderDropdownComponent,\n    SiHeaderDropdownTriggerDirective,\n    SiHeaderDropdownItemsFactoryComponent,\n    SiHeaderNavigationItemComponent,\n    SiHeaderBrandDirective,\n    SiHeaderNavigationComponent,\n    SiHeaderActionsDirective,\n    SiHeaderCollapsibleActionsComponent,\n    SiHeaderLogoDirective\n  ],\n  styles: `\n    .header-custom-logo {\n      content: initial;\n      inline-size: auto;\n    }\n  `,\n  providers: [{ provide: SI_HEADER_WITH_DROPDOWNS, useExisting: SiNavbarPrimaryComponent }]\n})\nexport class SiNavbarPrimaryComponent implements OnChanges, HeaderWithDropdowns {\n  /**\n   * List of navbar items which should be displayed at the left (in LTR) side next to the\n   * banner.\n   *\n   * @defaultValue []\n   */\n  readonly primaryItems = input<MenuItem[]>([]);\n  /**\n   * List of account dropdown elements (defined by `title` and `link`).\n   *\n   * The menu item can have submenu items (supplying `items`: MenuItem[]).\n   * Submenu items can be divided into groups by separators. A separator is\n   * an item with only '-' set as `title`.\n   *\n   * Alternatively, you can can create a custom content by putting your html\n   * code between the <si-navbar-primary> tags. In this case you don't need this\n   * property (will be ignored if you set anyway).\n   */\n  readonly accountItems = input<MenuItem[]>();\n  /**\n   * Account settings name (`title`) and profile picture (`image` or `icon`)\n   */\n  readonly account = input<AccountItem>();\n  /**\n   * URL of the navbar brand.\n   */\n  readonly logoUrl = input<string>();\n  /**\n   * Title of the application.\n   */\n  readonly appTitle = input<string>();\n  /**\n   * Configurable home link that is used at the logo and app title.\n   * Use `undefined` to disable the link.\n   *\n   * @defaultValue\n   * ```\n   * { link: '/' }\n   * ```\n   */\n  readonly home = input<Link | undefined>({ link: '/' });\n  /**\n   * title for the launchpad\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_LAUNCHPAD.TITLE:Launchpad`\n   * ```\n   */\n  readonly appSwitcherTitle = input($localize`:@@SI_LAUNCHPAD.TITLE:Launchpad`);\n\n  /**\n   * sub-title for the launchpad\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_LAUNCHPAD.SUB_TITLE:Access all your apps`\n   * ```\n   */\n  readonly appSwitcherSubTitle = input($localize`:@@SI_LAUNCHPAD.SUB_TITLE:Access all your apps`);\n\n  /**\n   * Title or translate key for the favorite apps section.\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorite apps`\n   * ```\n   */\n  readonly favoriteAppsTitle = input($localize`:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorite apps`);\n\n  /**\n   * Title or translate key for the default apps section.\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE:Apps`\n   * ```\n   */\n  readonly defaultAppsTitle = input($localize`:@@SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE:Apps`);\n\n  /**\n   * Title or translate key for the show more apps button.\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_LAUNCHPAD.SHOW_MORE:Show more`\n   * ```\n   */\n  readonly showMoreAppsTitle = input($localize`:@@SI_LAUNCHPAD.SHOW_MORE:Show more`);\n\n  /**\n   * Title or translate key for the show less apps button.\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_LAUNCHPAD.SHOW_LESS:Show less`\n   * ```\n   */\n  readonly showLessAppsTitle = input($localize`:@@SI_LAUNCHPAD.SHOW_LESS:Show less`);\n\n  /**\n   * All app items shown in the launchpad. The launchpad will not be visible if the\n   * app items are undefined. The launchpad will be visible if the app items are an\n   * empty array.\n   */\n  readonly appItems = input<AppItem[]>();\n  /**\n   * Like `appItems` but with the addition of categories. If this is set, `appItems` is ignored.\n   */\n  readonly appCategoryItems = input<AppItemCategory[]>();\n\n  /**\n   * Allow the user to favorite apps which will then be displayed at the top.\n   *\n   * @defaultValue false\n   */\n  readonly appItemsFavorites = input(false, { transform: booleanAttribute });\n  /**\n   * \"all apps\" link in the launchpad\n   */\n  readonly allAppsLink = input<MenuItem>();\n  /**\n   * Specifies whether the component should automatically be focused as soon as it is loaded.\n   *\n   * @defaultValue false\n   */\n  readonly focusOnLoad = input(false, { transform: booleanAttribute });\n\n  /**\n   * Marks the navbar as primary navigation element. Needed for a11y (screen reader).\n   * Only one element should be primary. If multiple navbars are used, it's up to the\n   * user of the components to label them in the correct order.\n   *\n   * @defaultValue 'Primary'\n   */\n  readonly navAriaLabel = input('Primary');\n\n  /**\n   * Text to close the launchpad. Needed for a11y.\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_LAUNCHPAD.CLOSE:Close launchpad`\n   * ```\n   */\n  readonly closeAppSwitcherText = input($localize`:@@SI_LAUNCHPAD.CLOSE:Close launchpad`);\n\n  /**\n   * Text for the launchpad icon. Needed for a11y.\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_NAVBAR.OPEN_LAUNCHPAD:Open launchpad`\n   * ```\n   */\n  readonly openAppSwitcherText = input($localize`:@@SI_NAVBAR.OPEN_LAUNCHPAD:Open launchpad`);\n\n  /**\n   * Text or translate key for the toggle navigation icon. Needed for a11y.\n   *\n   * @defaultValue\n   * ```\n   * $localize`:@@SI_NAVBAR.TOGGLE_NAVIGATION:Toggle navigation`\n   * ```\n   */\n  readonly toggleNavigationText = input(\n    $localize`:@@SI_NAVBAR.TOGGLE_NAVIGATION:Toggle navigation`\n  );\n\n  /**\n   * Aria label for the main menu landmark\n   *\n   * @defaultValue 'Header main'\n   */\n  readonly ariaLabelMainMenu = input('Header main');\n\n  /**\n   * Aria label for the secondary menu landmark\n   *\n   * @defaultValue 'Header secondary'\n   */\n  readonly ariaLabelSecondaryMenu = input('Header secondary');\n\n  readonly appItemFavoriteChanged = output<[AppItem, boolean]>();\n\n  /** @internal */\n  readonly header = viewChild.required(SiApplicationHeaderComponent);\n  /** @internal */\n  readonly collapsibleActions = viewChild(SiHeaderCollapsibleActionsComponent);\n  /** @internal */\n  readonly navItemCount = signal(0);\n\n  protected newAppItems?: App[] | AppCategory[];\n  protected active?: MenuItem;\n\n  /** @internal */\n  // defer is required as header is not available at the time of creation.`\n  readonly inlineDropdown = defer(() => this.header().inlineDropdown);\n\n  /** @internal */\n  onDropdownItemTriggered(): void {\n    this.header().onDropdownItemTriggered();\n  }\n\n  /** @internal */\n  ngOnChanges(changes: SimpleChanges): void {\n    if (changes.appItems || changes.appCategoryItems) {\n      const appItems = this.appItems();\n      const appCategoryItems = this.appCategoryItems();\n      if (appCategoryItems) {\n        this.newAppItems = appCategoryItems.map(category => ({\n          // Violation by intention.\n          // Empty strings should also be replaced by the default title.\n          // We rely on this in our examples, so projects might as well.\n          // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n          name: category.category || this.defaultAppsTitle(),\n          apps: this.convertApps(category.items)\n        }));\n        const allAppsLink = this.allAppsLink();\n        if (allAppsLink && this.newAppItems.length) {\n          const lastCategory = this.newAppItems.at(-1)!;\n          lastCategory.apps.push({\n            name: allAppsLink.title!,\n            iconClass: allAppsLink.icon ?? 'element-plus',\n            href: allAppsLink.href!,\n            target: allAppsLink.target,\n            _noFavorite: true // this should not show up in public API, but we need it for now.\n          } as App);\n        }\n      } else if (appItems) {\n        this.newAppItems = this.convertApps(appItems!);\n        const allAppsLink = this.allAppsLink();\n        if (allAppsLink) {\n          this.newAppItems.push({\n            name: allAppsLink.title!,\n            iconClass: allAppsLink.icon ?? 'element-plus',\n            href: allAppsLink.href!,\n            target: allAppsLink.target,\n            _noFavorite: true // this should not show up in public API, but we need it for now.\n          } as App);\n        }\n      }\n    }\n  }\n\n  private convertApps(apps: AppItem[]): App[] {\n    return apps.map(app => ({\n      name: app.title!,\n      href: app.href!,\n      external: app.isExternal,\n      active: app.isActive,\n      target: app.target,\n      iconClass: app.icon,\n      favorite: app.isFavorite,\n      _src: app // this should not show up in public API, but we need it for now.\n    }));\n  }\n\n  protected onFavoriteChange({ app, favorite }: FavoriteChangeEvent): void {\n    this.appItemFavoriteChanged.emit([(app as any)._src, favorite]);\n  }\n}\n","<si-application-header [launchpad]=\"newAppItems ? launchpad : undefined\">\n  <si-header-brand>\n    @if (logoUrl()) {\n      <a class=\"header-logo header-custom-logo px-6 focus-inside\" [siLink]=\"home()\">\n        <img alt=\"Siemens logo\" [src]=\"logoUrl()\" />\n      </a>\n    } @else {\n      <a siHeaderLogo class=\"d-none d-md-flex\" [siLink]=\"home()\"></a>\n    }\n    @if (appTitle()) {\n      <span class=\"application-name\">{{ appTitle() }}</span>\n    }\n  </si-header-brand>\n\n  @if (primaryItems().length) {\n    <si-header-navigation [attr.aria-label]=\"ariaLabelMainMenu()\">\n      @for (item of primaryItems(); track $index) {\n        @if (item.items) {\n          <button\n            type=\"button\"\n            si-header-navigation-item\n            [siHeaderDropdownTriggerFor]=\"dropdown\"\n            [class.active]=\"active === item\"\n          >\n            {{ item.title | translate }}\n            <ng-template #dropdown>\n              <si-header-dropdown>\n                <si-header-dropdown-items-factory\n                  [items]=\"item.items\"\n                  (activeChange)=\"$event ? (active = item) : null\"\n                />\n              </si-header-dropdown>\n            </ng-template>\n          </button>\n        } @else {\n          <a\n            si-header-navigation-item\n            activeClass=\"active\"\n            [siLink]=\"item\"\n            (activeChange)=\"$event ? (active = item) : null\"\n          >\n            {{ item.title | translate }}\n          </a>\n        }\n      }\n    </si-header-navigation>\n  }\n  @if (navItemCount() || account()) {\n    <si-header-actions [attr.aria-label]=\"ariaLabelSecondaryMenu()\">\n      @if (navItemCount()) {\n        @if (navItemCount() === 1) {\n          <ng-container *ngTemplateOutlet=\"actions\" />\n        } @else {\n          <si-header-collapsible-actions>\n            <ng-container *ngTemplateOutlet=\"actions\" />\n          </si-header-collapsible-actions>\n        }\n      }\n      @if (account()) {\n        <!--eslint-disable @angular-eslint/template/elements-content -->\n        <button\n          si-header-account-item\n          type=\"button\"\n          [name]=\"account()!.title\"\n          [initials]=\"account()!.initials\"\n          [imageUrl]=\"account()!.image\"\n          [siHeaderDropdownTriggerFor]=\"accountDropdown\"\n        ></button>\n        <!--eslint-enable @angular-eslint/template/elements-content -->\n\n        <ng-template #accountDropdown>\n          <si-header-dropdown>\n            <div class=\"d-block userinfo mx-5 mb-4\">\n              <div class=\"si-title-2 text-truncate\">{{ account()!.title }}</div>\n              @if (account()!.email) {\n                <div class=\"email\">{{ account()!.email }}</div>\n              }\n              <div class=\"d-flex align-items-center text-secondary mt-2\">\n                @if (account()!.company) {\n                  <span class=\"label me-4\">{{ account()!.company | translate }}</span>\n                }\n                @if (account()!.role) {\n                  <span class=\"ms-0 badge bg-default\">\n                    {{ account()!.role | translate }}\n                  </span>\n                }\n              </div>\n            </div>\n            @if (accountItems()?.length) {\n              <div class=\"d-block dropdown-divider\" role=\"separator\"></div>\n              <si-header-dropdown-items-factory [items]=\"accountItems()!\" />\n            }\n            @if (account()!.customContent) {\n              <div class=\"d-block dropdown-divider\" role=\"separator\"></div>\n              <ng-content />\n            }\n          </si-header-dropdown>\n        </ng-template>\n      }\n    </si-header-actions>\n  } @else {\n    <!-- Seems like @if makes ng-content believe that there is always a header-actions section. So we have to add it here. -->\n    <si-header-actions />\n  }\n</si-application-header>\n\n<ng-template #launchpad>\n  <si-launchpad-factory\n    [showLessAppsText]=\"showLessAppsTitle()\"\n    [showMoreAppsText]=\"showMoreAppsTitle()\"\n    [closeText]=\"closeAppSwitcherText()\"\n    [titleText]=\"appSwitcherTitle()\"\n    [subtitleText]=\"appSwitcherSubTitle()\"\n    [enableFavorites]=\"appItemsFavorites()\"\n    [favoriteAppsText]=\"favoriteAppsTitle()\"\n    [apps]=\"newAppItems!\"\n    (favoriteChange)=\"onFavoriteChange($event)\"\n  />\n</ng-template>\n<ng-template #actions>\n  <ng-content select=\"si-navbar-item[quickAction], element-navbar-item[quickAction='true']\" />\n</ng-template>\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  DoCheck,\n  inject,\n  input,\n  OnDestroy,\n  OnInit,\n  viewChild\n} from '@angular/core';\nimport { MenuItem } from '@siemens/element-ng/common';\nimport {\n  SiHeaderDropdownComponent,\n  SiHeaderDropdownItemsFactoryComponent,\n  SiHeaderDropdownTriggerDirective\n} from '@siemens/element-ng/header-dropdown';\nimport { SiLinkDirective } from '@siemens/element-ng/link';\nimport { SiTranslateModule } from '@siemens/element-translate-ng/translate';\n\nimport { SiNavbarPrimaryComponent } from '../si-navbar-primary/si-navbar-primary.component';\n\n/** @deprecated Use the new `si-application-header` instead. */\n@Component({\n  selector: 'si-navbar-item',\n  templateUrl: './si-navbar-item.component.html',\n  imports: [\n    SiLinkDirective,\n    SiTranslateModule,\n    NgClass,\n    NgTemplateOutlet,\n    SiHeaderDropdownComponent,\n    SiHeaderDropdownItemsFactoryComponent,\n    SiHeaderDropdownTriggerDirective\n  ],\n  host: { class: 'd-contents' }\n})\nexport class SiNavbarItemComponent implements OnInit, DoCheck, OnDestroy {\n  /**\n   * MenuItem to display in the navbar.\n   */\n  readonly item = input.required<MenuItem>();\n\n  /**\n   * Is the item a quick action displayed on the end (right in LTR) side\n   *\n   * @defaultValue false\n   */\n  readonly quickAction = input(false, { transform: booleanAttribute });\n\n  readonly dropdownTrigger = viewChild(SiHeaderDropdownTriggerDirective);\n\n  protected active = false;\n  protected navbar = inject(SiNavbarPrimaryComponent);\n\n  private hasBadge = false;\n\n  ngOnInit(): void {\n    this.navbar.header().closeMobileMenus.subscribe(() => this.dropdownTrigger()?.close());\n    this.navbar.navItemCount.update(value => value + 1);\n  }\n\n  ngDoCheck(): void {\n    const item = this.item();\n    const newHasBadge = !!(item.badge ?? item.badgeDot);\n    if (this.quickAction() && this.hasBadge !== newHasBadge) {\n      this.hasBadge = newHasBadge;\n      if (this.hasBadge) {\n        this.navbar.collapsibleActions()?.badgeCount.update(value => value + 1);\n      } else {\n        this.navbar.collapsibleActions()?.badgeCount.update(value => value - 1);\n      }\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.navbar.navItemCount.update(value => value - 1);\n  }\n\n  protected click(): void {\n    if (!this.dropdownTrigger()) {\n      this.navbar.header().closeMobileMenus.next();\n    }\n  }\n\n  protected get visuallyHideTitle(): boolean {\n    return !this.navbar.collapsibleActions()?.mobileExpanded();\n  }\n}\n","@if (item().items || item().customContent) {\n  <button\n    type=\"button\"\n    class=\"header-item focus-inside\"\n    [class.active]=\"active\"\n    [attr.aria-label]=\"item().title | translate\"\n    [siHeaderDropdownTriggerFor]=\"dropdown\"\n    (click)=\"click()\"\n  >\n    <ng-container *ngTemplateOutlet=\"itemContent\" />\n    <div class=\"element-down-2 dropdown-caret\" aria-hidden=\"true\"></div>\n  </button>\n} @else {\n  <a\n    class=\"header-item focus-inside\"\n    activeClass=\"active\"\n    [siLink]=\"item()\"\n    [attr.aria-label]=\"item().title | translate\"\n    (activeChange)=\"active = $event\"\n    (click)=\"click()\"\n  >\n    <ng-container *ngTemplateOutlet=\"itemContent\" />\n  </a>\n}\n\n<ng-template #itemContent>\n  <div class=\"icon\" aria-hidden=\"true\" [ngClass]=\"item().icon\"></div>\n  @if (item().badge) {\n    <div class=\"badge-text\">{{ item().badge }}</div>\n  }\n  <ng-content select=\"si-avatar\" />\n  <div class=\"item-title\" [class.visually-hidden]=\"visuallyHideTitle\">\n    {{ item().title | translate }}\n  </div>\n</ng-template>\n\n<ng-template #dropdown>\n  <si-header-dropdown>\n    @if (item().items) {\n      <si-header-dropdown-items-factory [items]=\"item().items!\" (activeChange)=\"active = $event\" />\n    }\n    @if (item().customContent) {\n      <ng-content />\n    }\n  </si-header-dropdown>\n</ng-template>\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-navbar-item.component';\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-navbar-primary.component';\nexport * from './si-navbar-primary.model';\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiNavbarItemComponent } from './si-navbar-item/si-navbar-item.component';\nimport { SiNavbarPrimaryComponent } from './si-navbar-primary/si-navbar-primary.component';\n\nconst components = [SiNavbarItemComponent, SiNavbarPrimaryComponent];\n\n/** @deprecated Use the new `si-application-header` instead. */\n@NgModule({\n  imports: components,\n  exports: components\n})\nexport class SiNavbarModule {}\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-navbar-item/index';\nexport * from './si-navbar-primary/index';\nexport * from './si-navbar.module';\nexport * from './account.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/siemens-element-ng-translate.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"siemens-element-ng-translate.mjs","sources":["../../../../projects/element-ng/translate/si-translatable-keys.interface.ts","../../../../projects/element-ng/translate/si-translatable-overrides.provider.ts","../../../../projects/element-ng/translate/index.ts","../../../../projects/element-ng/translate/siemens-element-ng-translate.ts"],"sourcesContent":["/* eslint-disable */\n\n// Auto-generated file. Run 'yarn update-translatable-keys' to update.\n\nexport interface SiTranslatableKeys {\n  'SI_APPLICATION_HEADER.LAUNCHPAD'?: string;\n  'SI_APPLICATION_HEADER.TOGGLE_ACTIONS'?: string;\n  'SI_APPLICATION_HEADER.TOGGLE_NAVIGATION'?: string;\n  'SI_LAUNCHPAD.CLOSE'?: string;\n  'SI_LAUNCHPAD.FAVORITE_APPS'?: string;\n  'SI_LAUNCHPAD.SHOW_LESS'?: string;\n  'SI_LAUNCHPAD.SHOW_MORE'?: string;\n  'SI_LAUNCHPAD.SUBTITLE'?: string;\n  'SI_LAUNCHPAD.TITLE'?: string;\n}\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nimport { Provider } from '@angular/core';\nimport { SI_TRANSLATABLE_VALUES } from '@siemens/element-translate-ng/translate';\n\nimport { SiTranslatableKeys } from './si-translatable-keys.interface';\n\nexport const provideSiTranslatableOverrides: (values: SiTranslatableKeys) => Provider = values => ({\n  useValue: values,\n  multi: true,\n  provide: SI_TRANSLATABLE_VALUES\n});\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-translatable-keys.interface';\nexport * from './si-translatable-overrides.provider';\n// @deprecated use @simpl-labs/element-translate-ng/translate directly\nexport * from '@siemens/element-translate-ng/translate';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAAA;;MCSa,8BAA8B,GAA6C,MAAM,KAAK;AACjG,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,KAAK,EAAE,IAAI;AACX,IAAA,OAAO,EAAE;AACV,CAAA;;ACbD;;;AAGG;;ACHH;;AAEG;;;;"}
+{"version":3,"file":"siemens-element-ng-translate.mjs","sources":["../../../../projects/element-ng/translate/si-translatable-keys.interface.ts","../../../../projects/element-ng/translate/si-translatable-overrides.provider.ts","../../../../projects/element-ng/translate/index.ts","../../../../projects/element-ng/translate/siemens-element-ng-translate.ts"],"sourcesContent":["/* eslint-disable */\n\n// Auto-generated file. Run 'yarn update-translatable-keys' to update.\n\nexport interface SiTranslatableKeys {\n  'SI_APPLICATION_HEADER.LAUNCHPAD'?: string;\n  'SI_APPLICATION_HEADER.TOGGLE_ACTIONS'?: string;\n  'SI_APPLICATION_HEADER.TOGGLE_NAVIGATION'?: string;\n  'SI_LAUNCHPAD.CLOSE'?: string;\n  'SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE'?: string;\n  'SI_LAUNCHPAD.FAVORITE_APPS'?: string;\n  'SI_LAUNCHPAD.SHOW_LESS'?: string;\n  'SI_LAUNCHPAD.SHOW_MORE'?: string;\n  'SI_LAUNCHPAD.SUBTITLE'?: string;\n  'SI_LAUNCHPAD.SUB_TITLE'?: string;\n  'SI_LAUNCHPAD.TITLE'?: string;\n  'SI_NAVBAR.OPEN_LAUNCHPAD'?: string;\n  'SI_NAVBAR.TOGGLE_NAVIGATION'?: string;\n}\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nimport { Provider } from '@angular/core';\nimport { SI_TRANSLATABLE_VALUES } from '@siemens/element-translate-ng/translate';\n\nimport { SiTranslatableKeys } from './si-translatable-keys.interface';\n\nexport const provideSiTranslatableOverrides: (values: SiTranslatableKeys) => Provider = values => ({\n  useValue: values,\n  multi: true,\n  provide: SI_TRANSLATABLE_VALUES\n});\n","/**\n * Copyright Siemens 2016 - 2025.\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-translatable-keys.interface';\nexport * from './si-translatable-overrides.provider';\n// @deprecated use @simpl-labs/element-translate-ng/translate directly\nexport * from '@siemens/element-translate-ng/translate';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAAA;;MCSa,8BAA8B,GAA6C,MAAM,KAAK;AACjG,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,KAAK,EAAE,IAAI;AACX,IAAA,OAAO,EAAE;AACV,CAAA;;ACbD;;;AAGG;;ACHH;;AAEG;;;;"}

package/navbar/account.model.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+import { EntityStatusType, MenuItem } from '@siemens/element-ng/common';
+import { TranslatableString } from '@siemens/element-translate-ng/translate';
+/** @deprecated Use the new `si-application-header` instead. */
+export interface AccountItem extends MenuItem {
+    /**
+     * Full name of user
+     */
+    title: string;
+    /**
+     * Initials to be displayed as avatar if no `icon` and also no `image` are provided.
+     * If also no initials are provided, they will be automatically calculated from the `title`.
+     */
+    initials?: string;
+    /**
+     * The status (success, info, warning, caution, danger, critical, pending, progress) to be
+     * visualized.
+     */
+    avatarStatus?: EntityStatusType;
+    /**
+     * aria-label for avatar status
+     */
+    avatarStatusAriaLabel?: TranslatableString;
+    /**
+     * Email address of the user
+     */
+    email?: string;
+    /**
+     * Name of the Company
+     */
+    company?: string;
+    /**
+     * Role name shown as a badge in the bottom
+     */
+    role?: string;
+}

package/navbar/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+export * from './si-navbar-item/index';
+export * from './si-navbar-primary/index';
+export * from './si-navbar.module';
+export * from './account.model';

package/navbar/package.json

@@ -0,0 +1,3 @@
+{
+  "module": "../fesm2022/siemens-element-ng-navbar.mjs"
+}

package/navbar/si-navbar-item/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+export * from './si-navbar-item.component';

package/navbar/si-navbar-item/si-navbar-item.component.d.ts

@@ -0,0 +1,29 @@
+import { DoCheck, OnDestroy, OnInit } from '@angular/core';
+import { MenuItem } from '@siemens/element-ng/common';
+import { SiHeaderDropdownTriggerDirective } from '@siemens/element-ng/header-dropdown';
+import { SiNavbarPrimaryComponent } from '../si-navbar-primary/si-navbar-primary.component';
+import * as i0 from "@angular/core";
+/** @deprecated Use the new `si-application-header` instead. */
+export declare class SiNavbarItemComponent implements OnInit, DoCheck, OnDestroy {
+    /**
+     * MenuItem to display in the navbar.
+     */
+    readonly item: import("@angular/core").InputSignal<MenuItem>;
+    /**
+     * Is the item a quick action displayed on the end (right in LTR) side
+     *
+     * @defaultValue false
+     */
+    readonly quickAction: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    readonly dropdownTrigger: import("@angular/core").Signal<SiHeaderDropdownTriggerDirective | undefined>;
+    protected active: boolean;
+    protected navbar: SiNavbarPrimaryComponent;
+    private hasBadge;
+    ngOnInit(): void;
+    ngDoCheck(): void;
+    ngOnDestroy(): void;
+    protected click(): void;
+    protected get visuallyHideTitle(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiNavbarItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SiNavbarItemComponent, "si-navbar-item", never, { "item": { "alias": "item"; "required": true; "isSignal": true; }; "quickAction": { "alias": "quickAction"; "required": false; "isSignal": true; }; }, {}, never, ["si-avatar", "*"], true, never>;
+}

package/navbar/si-navbar-primary/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+export * from './si-navbar-primary.component';
+export * from './si-navbar-primary.model';

package/navbar/si-navbar-primary/si-navbar-primary.component.d.ts

@@ -0,0 +1,198 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import { App, AppCategory, FavoriteChangeEvent, SiApplicationHeaderComponent, SiHeaderCollapsibleActionsComponent } from '@siemens/element-ng/application-header';
+import { MenuItem } from '@siemens/element-ng/common';
+import { HeaderWithDropdowns } from '@siemens/element-ng/header-dropdown';
+import { Link } from '@siemens/element-ng/link';
+import { AccountItem } from '../account.model';
+import { AppItem, AppItemCategory } from './si-navbar-primary.model';
+import * as i0 from "@angular/core";
+/** @deprecated Use the new `si-application-header` instead. */
+export declare class SiNavbarPrimaryComponent implements OnChanges, HeaderWithDropdowns {
+    /**
+     * List of navbar items which should be displayed at the left (in LTR) side next to the
+     * banner.
+     *
+     * @defaultValue []
+     */
+    readonly primaryItems: import("@angular/core").InputSignal<MenuItem[]>;
+    /**
+     * List of account dropdown elements (defined by `title` and `link`).
+     *
+     * The menu item can have submenu items (supplying `items`: MenuItem[]).
+     * Submenu items can be divided into groups by separators. A separator is
+     * an item with only '-' set as `title`.
+     *
+     * Alternatively, you can can create a custom content by putting your html
+     * code between the <si-navbar-primary> tags. In this case you don't need this
+     * property (will be ignored if you set anyway).
+     */
+    readonly accountItems: import("@angular/core").InputSignal<MenuItem[] | undefined>;
+    /**
+     * Account settings name (`title`) and profile picture (`image` or `icon`)
+     */
+    readonly account: import("@angular/core").InputSignal<AccountItem | undefined>;
+    /**
+     * URL of the navbar brand.
+     */
+    readonly logoUrl: import("@angular/core").InputSignal<string | undefined>;
+    /**
+     * Title of the application.
+     */
+    readonly appTitle: import("@angular/core").InputSignal<string | undefined>;
+    /**
+     * Configurable home link that is used at the logo and app title.
+     * Use `undefined` to disable the link.
+     *
+     * @defaultValue
+     * ```
+     * { link: '/' }
+     * ```
+     */
+    readonly home: import("@angular/core").InputSignal<Link | undefined>;
+    /**
+     * title for the launchpad
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.TITLE:Launchpad`
+     * ```
+     */
+    readonly appSwitcherTitle: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * sub-title for the launchpad
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.SUB_TITLE:Access all your apps`
+     * ```
+     */
+    readonly appSwitcherSubTitle: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Title or translate key for the favorite apps section.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.FAVORITE_APPS:Favorite apps`
+     * ```
+     */
+    readonly favoriteAppsTitle: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Title or translate key for the default apps section.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE:Apps`
+     * ```
+     */
+    readonly defaultAppsTitle: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Title or translate key for the show more apps button.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.SHOW_MORE:Show more`
+     * ```
+     */
+    readonly showMoreAppsTitle: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Title or translate key for the show less apps button.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.SHOW_LESS:Show less`
+     * ```
+     */
+    readonly showLessAppsTitle: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * All app items shown in the launchpad. The launchpad will not be visible if the
+     * app items are undefined. The launchpad will be visible if the app items are an
+     * empty array.
+     */
+    readonly appItems: import("@angular/core").InputSignal<AppItem[] | undefined>;
+    /**
+     * Like `appItems` but with the addition of categories. If this is set, `appItems` is ignored.
+     */
+    readonly appCategoryItems: import("@angular/core").InputSignal<AppItemCategory[] | undefined>;
+    /**
+     * Allow the user to favorite apps which will then be displayed at the top.
+     *
+     * @defaultValue false
+     */
+    readonly appItemsFavorites: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * "all apps" link in the launchpad
+     */
+    readonly allAppsLink: import("@angular/core").InputSignal<MenuItem | undefined>;
+    /**
+     * Specifies whether the component should automatically be focused as soon as it is loaded.
+     *
+     * @defaultValue false
+     */
+    readonly focusOnLoad: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Marks the navbar as primary navigation element. Needed for a11y (screen reader).
+     * Only one element should be primary. If multiple navbars are used, it's up to the
+     * user of the components to label them in the correct order.
+     *
+     * @defaultValue 'Primary'
+     */
+    readonly navAriaLabel: import("@angular/core").InputSignal<string>;
+    /**
+     * Text to close the launchpad. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_LAUNCHPAD.CLOSE:Close launchpad`
+     * ```
+     */
+    readonly closeAppSwitcherText: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Text for the launchpad icon. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_NAVBAR.OPEN_LAUNCHPAD:Open launchpad`
+     * ```
+     */
+    readonly openAppSwitcherText: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Text or translate key for the toggle navigation icon. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_NAVBAR.TOGGLE_NAVIGATION:Toggle navigation`
+     * ```
+     */
+    readonly toggleNavigationText: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Aria label for the main menu landmark
+     *
+     * @defaultValue 'Header main'
+     */
+    readonly ariaLabelMainMenu: import("@angular/core").InputSignal<string>;
+    /**
+     * Aria label for the secondary menu landmark
+     *
+     * @defaultValue 'Header secondary'
+     */
+    readonly ariaLabelSecondaryMenu: import("@angular/core").InputSignal<string>;
+    readonly appItemFavoriteChanged: import("@angular/core").OutputEmitterRef<[AppItem, boolean]>;
+    /** @internal */
+    readonly header: import("@angular/core").Signal<SiApplicationHeaderComponent>;
+    /** @internal */
+    readonly collapsibleActions: import("@angular/core").Signal<SiHeaderCollapsibleActionsComponent | undefined>;
+    /** @internal */
+    readonly navItemCount: import("@angular/core").WritableSignal<number>;
+    protected newAppItems?: App[] | AppCategory[];
+    protected active?: MenuItem;
+    /** @internal */
+    readonly inlineDropdown: import("rxjs").Observable<boolean>;
+    /** @internal */
+    onDropdownItemTriggered(): void;
+    /** @internal */
+    ngOnChanges(changes: SimpleChanges): void;
+    private convertApps;
+    protected onFavoriteChange({ app, favorite }: FavoriteChangeEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiNavbarPrimaryComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SiNavbarPrimaryComponent, "si-navbar-primary", never, { "primaryItems": { "alias": "primaryItems"; "required": false; "isSignal": true; }; "accountItems": { "alias": "accountItems"; "required": false; "isSignal": true; }; "account": { "alias": "account"; "required": false; "isSignal": true; }; "logoUrl": { "alias": "logoUrl"; "required": false; "isSignal": true; }; "appTitle": { "alias": "appTitle"; "required": false; "isSignal": true; }; "home": { "alias": "home"; "required": false; "isSignal": true; }; "appSwitcherTitle": { "alias": "appSwitcherTitle"; "required": false; "isSignal": true; }; "appSwitcherSubTitle": { "alias": "appSwitcherSubTitle"; "required": false; "isSignal": true; }; "favoriteAppsTitle": { "alias": "favoriteAppsTitle"; "required": false; "isSignal": true; }; "defaultAppsTitle": { "alias": "defaultAppsTitle"; "required": false; "isSignal": true; }; "showMoreAppsTitle": { "alias": "showMoreAppsTitle"; "required": false; "isSignal": true; }; "showLessAppsTitle": { "alias": "showLessAppsTitle"; "required": false; "isSignal": true; }; "appItems": { "alias": "appItems"; "required": false; "isSignal": true; }; "appCategoryItems": { "alias": "appCategoryItems"; "required": false; "isSignal": true; }; "appItemsFavorites": { "alias": "appItemsFavorites"; "required": false; "isSignal": true; }; "allAppsLink": { "alias": "allAppsLink"; "required": false; "isSignal": true; }; "focusOnLoad": { "alias": "focusOnLoad"; "required": false; "isSignal": true; }; "navAriaLabel": { "alias": "navAriaLabel"; "required": false; "isSignal": true; }; "closeAppSwitcherText": { "alias": "closeAppSwitcherText"; "required": false; "isSignal": true; }; "openAppSwitcherText": { "alias": "openAppSwitcherText"; "required": false; "isSignal": true; }; "toggleNavigationText": { "alias": "toggleNavigationText"; "required": false; "isSignal": true; }; "ariaLabelMainMenu": { "alias": "ariaLabelMainMenu"; "required": false; "isSignal": true; }; "ariaLabelSecondaryMenu": { "alias": "ariaLabelSecondaryMenu"; "required": false; "isSignal": true; }; }, { "appItemFavoriteChanged": "appItemFavoriteChanged"; }, never, ["*", "si-navbar-item[quickAction], element-navbar-item[quickAction='true']"], true, never>;
+}

package/navbar/si-navbar-primary/si-navbar-primary.model.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+import { MenuItem } from '@siemens/element-ng/common';
+import { TranslatableString } from '@siemens/element-translate-ng/translate';
+/**
+ * The AppItem is used to show apps in the launchpad.
+ * @deprecated Use the new `si-application-header` instead.
+ */
+export interface AppItem extends MenuItem {
+    /**
+     * If `true`, the app is marked as a favorite.
+     */
+    isFavorite?: boolean;
+    /**
+     * If `true`, the app is marked as an external application opening in a new browser tab.
+     */
+    isExternal?: boolean;
+}
+/**
+ * The AppItemCategory is used to show app categories in the launchpad.
+ * @deprecated Use the new `si-application-header` instead.
+ */
+export interface AppItemCategory {
+    /**
+     * The name of the app category. Can be a translation key.
+     */
+    category?: TranslatableString;
+    /**
+     * The apps to show under this category.
+     */
+    items: AppItem[];
+}

package/navbar/si-navbar.module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./si-navbar-item/si-navbar-item.component";
+import * as i2 from "./si-navbar-primary/si-navbar-primary.component";
+/** @deprecated Use the new `si-application-header` instead. */
+export declare class SiNavbarModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiNavbarModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SiNavbarModule, never, [typeof i1.SiNavbarItemComponent, typeof i2.SiNavbarPrimaryComponent], [typeof i1.SiNavbarItemComponent, typeof i2.SiNavbarPrimaryComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SiNavbarModule>;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@siemens/element-ng",
   "description": "Element Angular component library, implementing the Siemens Design Language",
-  "version": "47.1.0-next.3",
+  "version": "47.1.0",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -24,8 +24,8 @@
     "@angular/core": "19",
     "@angular/forms": "19",
     "@angular/router": "19",
-    "@siemens/element-translate-ng": "47.1.0-next.3",
-    "@siemens/element-theme": "47.1.0-next.3"
+    "@siemens/element-translate-ng": "47.1.0",
+    "@siemens/element-theme": "47.1.0"
   },
   "peerDependenciesMeta": {
     "@angular/animations": {
@@ -66,6 +66,10 @@
       "types": "./link/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-link.mjs"
     },
+    "./navbar": {
+      "types": "./navbar/index.d.ts",
+      "default": "./fesm2022/siemens-element-ng-navbar.mjs"
+    },
     "./resize-observer": {
       "types": "./resize-observer/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-resize-observer.mjs"

package/template-i18n.json

@@ -0,0 +1,15 @@
+{
+  "SI_APPLICATION_HEADER.LAUNCHPAD": "Launchpad",
+  "SI_APPLICATION_HEADER.TOGGLE_ACTIONS": "Toggle actions",
+  "SI_APPLICATION_HEADER.TOGGLE_NAVIGATION": "Toggle navigation",
+  "SI_LAUNCHPAD.CLOSE": "Close launchpad",
+  "SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE": "Apps",
+  "SI_LAUNCHPAD.FAVORITE_APPS": "Favorite apps",
+  "SI_LAUNCHPAD.SHOW_LESS": "Show less",
+  "SI_LAUNCHPAD.SHOW_MORE": "Show more",
+  "SI_LAUNCHPAD.SUBTITLE": "Access all your apps",
+  "SI_LAUNCHPAD.SUB_TITLE": "Access all your apps",
+  "SI_LAUNCHPAD.TITLE": "Launchpad",
+  "SI_NAVBAR.OPEN_LAUNCHPAD": "Open launchpad",
+  "SI_NAVBAR.TOGGLE_NAVIGATION": "Toggle navigation"
+}

package/translate/si-translatable-keys.interface.d.ts

@@ -3,9 +3,13 @@ export interface SiTranslatableKeys {
     'SI_APPLICATION_HEADER.TOGGLE_ACTIONS'?: string;
     'SI_APPLICATION_HEADER.TOGGLE_NAVIGATION'?: string;
     'SI_LAUNCHPAD.CLOSE'?: string;
+    'SI_LAUNCHPAD.DEFAULT_CATEGORY_TITLE'?: string;
     'SI_LAUNCHPAD.FAVORITE_APPS'?: string;
     'SI_LAUNCHPAD.SHOW_LESS'?: string;
     'SI_LAUNCHPAD.SHOW_MORE'?: string;
     'SI_LAUNCHPAD.SUBTITLE'?: string;
+    'SI_LAUNCHPAD.SUB_TITLE'?: string;
     'SI_LAUNCHPAD.TITLE'?: string;
+    'SI_NAVBAR.OPEN_LAUNCHPAD'?: string;
+    'SI_NAVBAR.TOGGLE_NAVIGATION'?: string;
 }