@siemens/element-ng 47.5.0 → 47.7.0

package/connection-strength/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export * from './si-connection-strength.component';

package/content-action-bar/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export * from './si-content-action-bar.component';

package/content-action-bar/si-content-action-bar.component.d.ts

@@ -1,6 +1,6 @@
 import { AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
 import { MenuItem as MenuItemLegacy } from '@siemens/element-ng/common';
-import { MenuItemAction, MenuItemCheckbox, MenuItem, MenuItemRadio } from '@siemens/element-ng/menu';
+import { MenuItem, MenuItemAction, MenuItemCheckbox, MenuItemRadio } from '@siemens/element-ng/menu';
 import { ContentActionBarMainItem, ViewType } from './si-content-action-bar.model';
 import * as i0 from "@angular/core";
 export declare class SiContentActionBarComponent implements OnChanges, AfterViewInit {

package/content-action-bar/si-content-action-bar.model.d.ts

@@ -1,9 +1,9 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
-import { MenuItemAction, MenuItemGroup, MenuItemLink, MenuItemRouterLink } from '@siemens/element-ng/menu';
+import { MenuItemAction, MenuItemCheckbox, MenuItemGroup, MenuItemLink, MenuItemRouterLink } from '@siemens/element-ng/menu';
 export type ViewType = 'collapsible' | 'expanded' | 'mobile';
-export type ContentActionBarMainItem = (MenuItemAction | MenuItemLink | MenuItemRouterLink | MenuItemGroup) & {
+export type ContentActionBarMainItem = (MenuItemAction | MenuItemCheckbox | MenuItemLink | MenuItemRouterLink | MenuItemGroup) & {
     iconOnly?: boolean;
 };

package/copyright-notice/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export * from './si-copyright-notice.component';

package/copyright-notice/si-copyright-notice.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { InjectionToken } from '@angular/core';

package/datatable/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { Provider } from '@angular/core';

package/datatable/si-datatable-interaction.directive.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { OnDestroy, OnInit } from '@angular/core';

package/date-range-filter/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export * from './si-date-range-filter.component';

package/date-range-filter/si-date-range-filter.component.d.ts

@@ -9,6 +9,8 @@ export declare class PresetMatchFilterPipe implements PipeTransform {
 }
 export declare class SiDateRangeFilterComponent implements OnChanges {
     private readonly service;
+    private readonly mediaMatcher;
+    protected readonly smallScreen: boolean;
     /** The filter range object */
     readonly range: import("@angular/core").ModelSignal<DateRangeFilter>;
     /** List of preset time ranges. When not present or empty, the preset section won't show */
@@ -216,6 +218,7 @@ export declare class SiDateRangeFilterComponent implements OnChanges {
     readonly applyClicked: import("@angular/core").OutputEmitterRef<void>;
     /** Base configuration on how the dates should be displayed, parts of it may be overwritten internally. */
     readonly datepickerConfig: import("@angular/core").InputSignal<DatepickerInputConfig | undefined>;
+    protected readonly icons: Record<"elementDown2", string>;
     protected advancedMode: boolean;
     protected dateRange: DateRange;
     protected point1Now: boolean;
@@ -230,6 +233,7 @@ export declare class SiDateRangeFilterComponent implements OnChanges {
     protected readonly dateRangeConfig: import("@angular/core").Signal<DatepickerConfig>;
     protected readonly filteredPresetList: import("@angular/core").Signal<DateRangePreset[]>;
     protected readonly presetFilter: import("@angular/core").WritableSignal<string>;
+    protected readonly presetOpen: import("@angular/core").WritableSignal<boolean>;
     protected readonly inputMode: import("@angular/core").Signal<boolean>;
     ngOnChanges(changes: SimpleChanges): void;
     private getDateNow;
@@ -242,7 +246,7 @@ export declare class SiDateRangeFilterComponent implements OnChanges {
     protected updateFromDateRange(): void;
     protected point1Changed(): void;
     protected point2Changed(): void;
-    protected selectPresetItem(item: DateRangePreset): void;
+    protected selectPresetItem(event: Event, item: DateRangePreset): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SiDateRangeFilterComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SiDateRangeFilterComponent, "si-date-range-filter", never, { "range": { "alias": "range"; "required": true; "isSignal": true; }; "presetList": { "alias": "presetList"; "required": false; "isSignal": true; }; "presetSearch": { "alias": "presetSearch"; "required": false; "isSignal": true; }; "enableTimeSelection": { "alias": "enableTimeSelection"; "required": false; "isSignal": true; }; "basicMode": { "alias": "basicMode"; "required": false; "isSignal": true; }; "reverseInputFields": { "alias": "reverseInputFields"; "required": false; "isSignal": true; }; "showApplyButton": { "alias": "showApplyButton"; "required": false; "isSignal": true; }; "hideAdvancedMode": { "alias": "hideAdvancedMode"; "required": false; "isSignal": true; }; "refLabel": { "alias": "refLabel"; "required": false; "isSignal": true; }; "fromLabel": { "alias": "fromLabel"; "required": false; "isSignal": true; }; "toLabel": { "alias": "toLabel"; "required": false; "isSignal": true; }; "rangeLabel": { "alias": "rangeLabel"; "required": false; "isSignal": true; }; "todayLabel": { "alias": "todayLabel"; "required": false; "isSignal": true; }; "nowLabel": { "alias": "nowLabel"; "required": false; "isSignal": true; }; "dateLabel": { "alias": "dateLabel"; "required": false; "isSignal": true; }; "previewLabel": { "alias": "previewLabel"; "required": false; "isSignal": true; }; "datePlaceholder": { "alias": "datePlaceholder"; "required": false; "isSignal": true; }; "beforeLabel": { "alias": "beforeLabel"; "required": false; "isSignal": true; }; "afterLabel": { "alias": "afterLabel"; "required": false; "isSignal": true; }; "withinLabel": { "alias": "withinLabel"; "required": false; "isSignal": true; }; "valueLabel": { "alias": "valueLabel"; "required": false; "isSignal": true; }; "unitLabel": { "alias": "unitLabel"; "required": false; "isSignal": true; }; "searchLabel": { "alias": "searchLabel"; "required": false; "isSignal": true; }; "presetLabel": { "alias": "presetLabel"; "required": false; "isSignal": true; }; "advancedLabel": { "alias": "advancedLabel"; "required": false; "isSignal": true; }; "applyLabel": { "alias": "applyLabel"; "required": false; "isSignal": true; }; "datepickerConfig": { "alias": "datepickerConfig"; "required": false; "isSignal": true; }; }, { "range": "rangeChange"; "applyClicked": "applyClicked"; }, never, never, true, never>;
 }

package/date-range-filter/si-date-range-filter.types.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { TranslatableString } from '@siemens/element-translate-ng/translate';

package/date-range-filter/si-relative-date.component.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { OnChanges, SimpleChanges } from '@angular/core';

package/datepicker/components/si-calendar-date-cell.directive.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { ElementRef } from '@angular/core';

package/datepicker/components/si-initial-focus.component.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { AfterViewInit } from '@angular/core';

package/datepicker/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export * from './si-datepicker.model';

package/datepicker/si-datepicker.directive.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { AfterViewInit, ElementRef } from '@angular/core';

package/datepicker/si-datepicker.model.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { TranslatableString } from '@siemens/element-translate-ng/translate';

package/datepicker/si-timepicker.component.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 import { FocusOrigin } from '@angular/cdk/a11y';

package/electron-titlebar/electron.helpers.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export declare const runsInElectron: () => boolean;

package/electron-titlebar/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export * from './si-electron-titlebar.module';

package/empty-state/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 export * from './si-empty-state.component';

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

@@ -0,0 +1,157 @@
+import { NgTemplateOutlet } from '@angular/common';
+import { HttpClient } from '@angular/common/http';
+import * as i0 from '@angular/core';
+import { inject, input, computed, signal, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { SiCollapsiblePanelComponent } from '@siemens/element-ng/accordion';
+import { SiCopyrightNoticeComponent } from '@siemens/element-ng/copyright-notice';
+import { addIcons, elementDocument, SiIconNextComponent } from '@siemens/element-ng/icon';
+import { SiLinkDirective } from '@siemens/element-ng/link';
+import { SiTranslatePipe } from '@siemens/element-translate-ng/translate';
+
+/**
+ * Copyright (c) Siemens 2016 - 2025
+ * SPDX-License-Identifier: MIT
+ */
+class SiAboutComponent {
+    http = inject(HttpClient);
+    sanitizer = inject(DomSanitizer);
+    /**
+     * Title shown above the about information.
+     */
+    aboutTitle = input.required();
+    /**
+     * Define mode to display the licenses. See {@link LicenseInfo}
+     */
+    licenseInfo = input.required();
+    /**
+     * Path to the application logo. Use for image
+     */
+    icon = input();
+    /**
+     * Name of element icon. Use as alternative to image
+     */
+    iconName = input();
+    /**
+     * Title of this application.
+     */
+    appName = input.required();
+    /**
+     * Sub titles of the application. Shown as a list below the application name. (Optional)
+     */
+    subheading = input();
+    /**
+     * Link to `Acceptable Use Policy`.
+     */
+    acceptableUsePolicyLink = input();
+    /**
+     * Link to `Corporate Information`.
+     */
+    imprintLink = input();
+    /**
+     * Link to `Privacy Notice`.
+     */
+    privacyLink = input();
+    /**
+     * Link to `Cookie Notice`.
+     */
+    cookieNoticeLink = input();
+    /**
+     * Link to `Terms of Use`.
+     */
+    termsLink = input();
+    /**
+     * Additional links listed in the about section.
+     *
+     * @defaultValue []
+     */
+    links = input([]);
+    /**
+     * Copyright information to be displayed. Alternatively, you can use the {@link SI_COPYRIGHT_DETAILS} global inject.
+     */
+    copyrightDetails = input();
+    sanitizedUrl = computed(() => {
+        const licenseInfo = this.licenseInfo();
+        return licenseInfo.iframe != null
+            ? this.sanitizer.bypassSecurityTrustResourceUrl(licenseInfo.iframe)
+            : undefined;
+    });
+    licenseApi = signal([]);
+    icons = addIcons({ elementDocument });
+    ngOnInit() {
+        const licenseInfo = this.licenseInfo();
+        if (licenseInfo.api) {
+            this.http.get(licenseInfo.api, { responseType: 'json' }).subscribe(data => {
+                this.licenseApi.set(data);
+                if (this.licenseApi().length === 1) {
+                    data[0].isOpen = false;
+                    this.licenseApi.set([...data]);
+                    this.toggleLoadLicenseApi(this.licenseApi()[0]);
+                }
+            });
+        }
+    }
+    toggleLoadLicenseApi(apiInfo) {
+        const licenseApi = this.licenseApi();
+        if (!apiInfo.isOpen && !apiInfo.files) {
+            this.http.get(apiInfo.href, { responseType: 'json' }).subscribe(files => {
+                apiInfo.files = files;
+                this.licenseApi.set([...licenseApi]);
+            });
+        }
+        apiInfo.isOpen = !apiInfo.isOpen;
+        this.licenseApi.set([...licenseApi]);
+    }
+    toggleLoadLicenseContent(apiInfo) {
+        const licenseApi = this.licenseApi();
+        apiInfo.isOpen = !apiInfo.isOpen;
+        if (!apiInfo.content) {
+            this.http.get(apiInfo.href, { responseType: 'text' }).subscribe((content) => {
+                apiInfo.content = content;
+                this.licenseApi.set([...licenseApi]);
+            });
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiAboutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: SiAboutComponent, isStandalone: true, selector: "si-about", inputs: { aboutTitle: { classPropertyName: "aboutTitle", publicName: "aboutTitle", isSignal: true, isRequired: true, transformFunction: null }, licenseInfo: { classPropertyName: "licenseInfo", publicName: "licenseInfo", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: true, isRequired: false, transformFunction: null }, appName: { classPropertyName: "appName", publicName: "appName", isSignal: true, isRequired: true, transformFunction: null }, subheading: { classPropertyName: "subheading", publicName: "subheading", isSignal: true, isRequired: false, transformFunction: null }, acceptableUsePolicyLink: { classPropertyName: "acceptableUsePolicyLink", publicName: "acceptableUsePolicyLink", isSignal: true, isRequired: false, transformFunction: null }, imprintLink: { classPropertyName: "imprintLink", publicName: "imprintLink", isSignal: true, isRequired: false, transformFunction: null }, privacyLink: { classPropertyName: "privacyLink", publicName: "privacyLink", isSignal: true, isRequired: false, transformFunction: null }, cookieNoticeLink: { classPropertyName: "cookieNoticeLink", publicName: "cookieNoticeLink", isSignal: true, isRequired: false, transformFunction: null }, termsLink: { classPropertyName: "termsLink", publicName: "termsLink", isSignal: true, isRequired: false, transformFunction: null }, links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, copyrightDetails: { classPropertyName: "copyrightDetails", publicName: "copyrightDetails", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"row mx-6 mt-6\">\n  <div class=\"col-md-6 mb-6\">\n    <div class=\"card overflow-hidden\">\n      <div class=\"card-header text-truncate\">\n        {{ aboutTitle() }}\n      </div>\n\n      <div>\n        <div class=\"list-group-item text-center\">\n          @let appIcon = iconName();\n          @if (icon()) {\n            <img\n              class=\"rounded-circle\"\n              height=\"150\"\n              [src]=\"icon()\"\n              [alt]=\"appName() + '\\'s Logo'\"\n            />\n          } @else if (appIcon) {\n            <si-icon-next class=\"app-icon\" [icon]=\"appIcon\" />\n          }\n          <h3>{{ appName() }}</h3>\n          @for (item of subheading(); track $index) {\n            <p>{{ item }}</p>\n          }\n          <si-copyright-notice [copyright]=\"copyrightDetails()\" />\n        </div>\n\n        @if (imprintLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: imprintLink() }\"\n          />\n        }\n        @if (privacyLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: privacyLink() }\"\n          />\n        }\n        @if (cookieNoticeLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: cookieNoticeLink() }\"\n          />\n        }\n        @if (termsLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: termsLink() }\"\n          />\n        }\n        @if (acceptableUsePolicyLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: acceptableUsePolicyLink() }\"\n          />\n        }\n        @for (item of links(); track $index) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: item }\"\n          />\n        }\n      </div>\n    </div>\n  </div>\n\n  <div class=\"col-md-6 mb-6\">\n    <div class=\"card overflow-hidden\" [class.h-100]=\"licenseInfo().iframe\">\n      <div class=\"card-header text-truncate\">\n        {{ licenseInfo().title }}\n      </div>\n\n      <div class=\"h-100\">\n        @if (licenseInfo().text) {\n          <pre class=\"list-group-item\">{{ licenseInfo().text }}</pre>\n        }\n\n        @if (sanitizedUrl()) {\n          <iframe class=\"w-100 h-100\" [src]=\"sanitizedUrl()\" [title]=\"licenseInfo().title\"></iframe>\n        }\n\n        @if (licenseInfo().api) {\n          @for (api of licenseApi(); track $index) {\n            <si-collapsible-panel\n              colorVariant=\"base-0\"\n              class=\"license-api\"\n              [heading]=\"api.name\"\n              (panelToggle)=\"toggleLoadLicenseApi(api)\"\n            >\n              @for (file of api.files; track $index) {\n                <si-collapsible-panel\n                  colorVariant=\"base-0\"\n                  class=\"license-api-file\"\n                  [icon]=\"licenseInfo().icon ? licenseInfo().icon : icons.elementDocument\"\n                  [heading]=\"file.name\"\n                  (panelToggle)=\"toggleLoadLicenseContent(file)\"\n                >\n                  <pre class=\"license-api-file-content px-6 pt-6\">{{ file.content }}</pre>\n                </si-collapsible-panel>\n              }\n            </si-collapsible-panel>\n          }\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #linkTemplate let-link=\"link\">\n  <a\n    class=\"list-group-item si-title-2 text-body focus-inside\"\n    siLinkDefaultTarget=\"_blank\"\n    [siLink]=\"link\"\n  >\n    {{ link.title | translate }}\n  </a>\n</ng-template>\n", styles: [".list-group-item{border-width:0 0 1px;padding-inline:16px}.list-group-item.with-border:first-child{border-block-start-width:1px}.list-group-item:last-child{border-block-end-width:0}.app-icon{font-size:150px}iframe{border-style:none;min-block-size:500px;margin-block-end:-5px}pre{word-break:break-word;white-space:pre-wrap}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiCollapsiblePanelComponent, selector: "si-collapsible-panel", inputs: ["heading", "headerCssClasses", "contentBgClasses", "contentCssClasses", "opened", "icon", "disabled", "colorVariant", "badge", "badgeColor"], outputs: ["openedChange", "panelToggle", "toggle"] }, { kind: "component", type: SiCopyrightNoticeComponent, selector: "si-copyright-notice", inputs: ["copyright"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }, { kind: "directive", type: SiLinkDirective, selector: "[siLink]", inputs: ["siLink", "siLinkDefaultTarget", "actionParam", "activeClass", "exactMatch", "ariaCurrent"], outputs: ["activeChange"], exportAs: ["siLink"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiAboutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'si-about', imports: [
+                        NgTemplateOutlet,
+                        SiCollapsiblePanelComponent,
+                        SiCopyrightNoticeComponent,
+                        SiIconNextComponent,
+                        SiLinkDirective,
+                        SiTranslatePipe
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row mx-6 mt-6\">\n  <div class=\"col-md-6 mb-6\">\n    <div class=\"card overflow-hidden\">\n      <div class=\"card-header text-truncate\">\n        {{ aboutTitle() }}\n      </div>\n\n      <div>\n        <div class=\"list-group-item text-center\">\n          @let appIcon = iconName();\n          @if (icon()) {\n            <img\n              class=\"rounded-circle\"\n              height=\"150\"\n              [src]=\"icon()\"\n              [alt]=\"appName() + '\\'s Logo'\"\n            />\n          } @else if (appIcon) {\n            <si-icon-next class=\"app-icon\" [icon]=\"appIcon\" />\n          }\n          <h3>{{ appName() }}</h3>\n          @for (item of subheading(); track $index) {\n            <p>{{ item }}</p>\n          }\n          <si-copyright-notice [copyright]=\"copyrightDetails()\" />\n        </div>\n\n        @if (imprintLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: imprintLink() }\"\n          />\n        }\n        @if (privacyLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: privacyLink() }\"\n          />\n        }\n        @if (cookieNoticeLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: cookieNoticeLink() }\"\n          />\n        }\n        @if (termsLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: termsLink() }\"\n          />\n        }\n        @if (acceptableUsePolicyLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: acceptableUsePolicyLink() }\"\n          />\n        }\n        @for (item of links(); track $index) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: item }\"\n          />\n        }\n      </div>\n    </div>\n  </div>\n\n  <div class=\"col-md-6 mb-6\">\n    <div class=\"card overflow-hidden\" [class.h-100]=\"licenseInfo().iframe\">\n      <div class=\"card-header text-truncate\">\n        {{ licenseInfo().title }}\n      </div>\n\n      <div class=\"h-100\">\n        @if (licenseInfo().text) {\n          <pre class=\"list-group-item\">{{ licenseInfo().text }}</pre>\n        }\n\n        @if (sanitizedUrl()) {\n          <iframe class=\"w-100 h-100\" [src]=\"sanitizedUrl()\" [title]=\"licenseInfo().title\"></iframe>\n        }\n\n        @if (licenseInfo().api) {\n          @for (api of licenseApi(); track $index) {\n            <si-collapsible-panel\n              colorVariant=\"base-0\"\n              class=\"license-api\"\n              [heading]=\"api.name\"\n              (panelToggle)=\"toggleLoadLicenseApi(api)\"\n            >\n              @for (file of api.files; track $index) {\n                <si-collapsible-panel\n                  colorVariant=\"base-0\"\n                  class=\"license-api-file\"\n                  [icon]=\"licenseInfo().icon ? licenseInfo().icon : icons.elementDocument\"\n                  [heading]=\"file.name\"\n                  (panelToggle)=\"toggleLoadLicenseContent(file)\"\n                >\n                  <pre class=\"license-api-file-content px-6 pt-6\">{{ file.content }}</pre>\n                </si-collapsible-panel>\n              }\n            </si-collapsible-panel>\n          }\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #linkTemplate let-link=\"link\">\n  <a\n    class=\"list-group-item si-title-2 text-body focus-inside\"\n    siLinkDefaultTarget=\"_blank\"\n    [siLink]=\"link\"\n  >\n    {{ link.title | translate }}\n  </a>\n</ng-template>\n", styles: [".list-group-item{border-width:0 0 1px;padding-inline:16px}.list-group-item.with-border:first-child{border-block-start-width:1px}.list-group-item:last-child{border-block-end-width:0}.app-icon{font-size:150px}iframe{border-style:none;min-block-size:500px;margin-block-end:-5px}pre{word-break:break-word;white-space:pre-wrap}\n"] }]
+        }] });
+
+/**
+ * Copyright (c) Siemens 2016 - 2025
+ * SPDX-License-Identifier: MIT
+ */
+class SiAboutModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiAboutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.6", ngImport: i0, type: SiAboutModule, imports: [SiAboutComponent], exports: [SiAboutComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiAboutModule, imports: [SiAboutComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiAboutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [SiAboutComponent],
+                    exports: [SiAboutComponent]
+                }]
+        }] });
+
+/**
+ * Copyright (c) Siemens 2016 - 2025
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SiAboutComponent, SiAboutModule };
+//# sourceMappingURL=siemens-element-ng-about.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"siemens-element-ng-about.mjs","sources":["../../../../projects/element-ng/about/si-about.component.ts","../../../../projects/element-ng/about/si-about.component.html","../../../../projects/element-ng/about/si-about.module.ts","../../../../projects/element-ng/about/index.ts","../../../../projects/element-ng/about/siemens-element-ng-about.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgTemplateOutlet } from '@angular/common';\nimport { HttpClient } from '@angular/common/http';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  OnInit,\n  signal\n} from '@angular/core';\nimport { DomSanitizer } from '@angular/platform-browser';\nimport { SiCollapsiblePanelComponent } from '@siemens/element-ng/accordion';\nimport { CopyrightDetails, SiCopyrightNoticeComponent } from '@siemens/element-ng/copyright-notice';\nimport { addIcons, elementDocument, SiIconNextComponent } from '@siemens/element-ng/icon';\nimport { Link, SiLinkDirective } from '@siemens/element-ng/link';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\n\nimport { ApiInfo, LicenseInfo } from './si-about-data.model';\n\n@Component({\n  selector: 'si-about',\n  imports: [\n    NgTemplateOutlet,\n    SiCollapsiblePanelComponent,\n    SiCopyrightNoticeComponent,\n    SiIconNextComponent,\n    SiLinkDirective,\n    SiTranslatePipe\n  ],\n  templateUrl: './si-about.component.html',\n  styleUrl: './si-about.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiAboutComponent implements OnInit {\n  private http = inject(HttpClient);\n  private sanitizer = inject(DomSanitizer);\n\n  /**\n   * Title shown above the about information.\n   */\n  readonly aboutTitle = input.required<string>();\n  /**\n   * Define mode to display the licenses. See {@link LicenseInfo}\n   */\n  readonly licenseInfo = input.required<LicenseInfo>();\n  /**\n   * Path to the application logo. Use for image\n   */\n  readonly icon = input<string>();\n  /**\n   * Name of element icon. Use as alternative to image\n   */\n  readonly iconName = input<string>();\n  /**\n   * Title of this application.\n   */\n  readonly appName = input.required<string>();\n  /**\n   * Sub titles of the application. Shown as a list below the application name. (Optional)\n   */\n  readonly subheading = input<string[]>();\n  /**\n   * Link to `Acceptable Use Policy`.\n   */\n  readonly acceptableUsePolicyLink = input<Link>();\n  /**\n   * Link to `Corporate Information`.\n   */\n  readonly imprintLink = input<Link>();\n  /**\n   * Link to `Privacy Notice`.\n   */\n  readonly privacyLink = input<Link>();\n  /**\n   * Link to `Cookie Notice`.\n   */\n  readonly cookieNoticeLink = input<Link>();\n  /**\n   * Link to `Terms of Use`.\n   */\n  readonly termsLink = input<Link>();\n  /**\n   * Additional links listed in the about section.\n   *\n   * @defaultValue []\n   */\n  readonly links = input<Link[]>([]);\n  /**\n   * Copyright information to be displayed. Alternatively, you can use the {@link SI_COPYRIGHT_DETAILS} global inject.\n   */\n  readonly copyrightDetails = input<CopyrightDetails>();\n\n  protected readonly sanitizedUrl = computed(() => {\n    const licenseInfo = this.licenseInfo();\n    return licenseInfo.iframe != null\n      ? this.sanitizer.bypassSecurityTrustResourceUrl(licenseInfo.iframe)\n      : undefined;\n  });\n\n  protected readonly licenseApi = signal<ApiInfo[]>([]);\n  protected readonly icons = addIcons({ elementDocument });\n\n  ngOnInit(): void {\n    const licenseInfo = this.licenseInfo();\n    if (licenseInfo.api) {\n      this.http.get<ApiInfo[]>(licenseInfo.api, { responseType: 'json' }).subscribe(data => {\n        this.licenseApi.set(data);\n        if (this.licenseApi().length === 1) {\n          data[0].isOpen = false;\n          this.licenseApi.set([...data]);\n          this.toggleLoadLicenseApi(this.licenseApi()[0]);\n        }\n      });\n    }\n  }\n\n  protected toggleLoadLicenseApi(apiInfo: ApiInfo): void {\n    const licenseApi = this.licenseApi();\n    if (!apiInfo.isOpen && !apiInfo.files) {\n      this.http.get<ApiInfo[]>(apiInfo.href, { responseType: 'json' }).subscribe(files => {\n        apiInfo.files = files;\n        this.licenseApi.set([...licenseApi]);\n      });\n    }\n    apiInfo.isOpen = !apiInfo.isOpen;\n    this.licenseApi.set([...licenseApi]);\n  }\n\n  protected toggleLoadLicenseContent(apiInfo: ApiInfo): void {\n    const licenseApi = this.licenseApi();\n    apiInfo.isOpen = !apiInfo.isOpen;\n    if (!apiInfo.content) {\n      this.http.get(apiInfo.href, { responseType: 'text' }).subscribe((content: string) => {\n        apiInfo.content = content;\n        this.licenseApi.set([...licenseApi]);\n      });\n    }\n  }\n}\n","<div class=\"row mx-6 mt-6\">\n  <div class=\"col-md-6 mb-6\">\n    <div class=\"card overflow-hidden\">\n      <div class=\"card-header text-truncate\">\n        {{ aboutTitle() }}\n      </div>\n\n      <div>\n        <div class=\"list-group-item text-center\">\n          @let appIcon = iconName();\n          @if (icon()) {\n            <img\n              class=\"rounded-circle\"\n              height=\"150\"\n              [src]=\"icon()\"\n              [alt]=\"appName() + '\\'s Logo'\"\n            />\n          } @else if (appIcon) {\n            <si-icon-next class=\"app-icon\" [icon]=\"appIcon\" />\n          }\n          <h3>{{ appName() }}</h3>\n          @for (item of subheading(); track $index) {\n            <p>{{ item }}</p>\n          }\n          <si-copyright-notice [copyright]=\"copyrightDetails()\" />\n        </div>\n\n        @if (imprintLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: imprintLink() }\"\n          />\n        }\n        @if (privacyLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: privacyLink() }\"\n          />\n        }\n        @if (cookieNoticeLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: cookieNoticeLink() }\"\n          />\n        }\n        @if (termsLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: termsLink() }\"\n          />\n        }\n        @if (acceptableUsePolicyLink()) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: acceptableUsePolicyLink() }\"\n          />\n        }\n        @for (item of links(); track $index) {\n          <ng-container\n            [ngTemplateOutlet]=\"linkTemplate\"\n            [ngTemplateOutletContext]=\"{ link: item }\"\n          />\n        }\n      </div>\n    </div>\n  </div>\n\n  <div class=\"col-md-6 mb-6\">\n    <div class=\"card overflow-hidden\" [class.h-100]=\"licenseInfo().iframe\">\n      <div class=\"card-header text-truncate\">\n        {{ licenseInfo().title }}\n      </div>\n\n      <div class=\"h-100\">\n        @if (licenseInfo().text) {\n          <pre class=\"list-group-item\">{{ licenseInfo().text }}</pre>\n        }\n\n        @if (sanitizedUrl()) {\n          <iframe class=\"w-100 h-100\" [src]=\"sanitizedUrl()\" [title]=\"licenseInfo().title\"></iframe>\n        }\n\n        @if (licenseInfo().api) {\n          @for (api of licenseApi(); track $index) {\n            <si-collapsible-panel\n              colorVariant=\"base-0\"\n              class=\"license-api\"\n              [heading]=\"api.name\"\n              (panelToggle)=\"toggleLoadLicenseApi(api)\"\n            >\n              @for (file of api.files; track $index) {\n                <si-collapsible-panel\n                  colorVariant=\"base-0\"\n                  class=\"license-api-file\"\n                  [icon]=\"licenseInfo().icon ? licenseInfo().icon : icons.elementDocument\"\n                  [heading]=\"file.name\"\n                  (panelToggle)=\"toggleLoadLicenseContent(file)\"\n                >\n                  <pre class=\"license-api-file-content px-6 pt-6\">{{ file.content }}</pre>\n                </si-collapsible-panel>\n              }\n            </si-collapsible-panel>\n          }\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #linkTemplate let-link=\"link\">\n  <a\n    class=\"list-group-item si-title-2 text-body focus-inside\"\n    siLinkDefaultTarget=\"_blank\"\n    [siLink]=\"link\"\n  >\n    {{ link.title | translate }}\n  </a>\n</ng-template>\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiAboutComponent } from './si-about.component';\n\n@NgModule({\n  imports: [SiAboutComponent],\n  exports: [SiAboutComponent]\n})\nexport class SiAboutModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-about.component';\nexport * from './si-about.module';\nexport * from './si-about-data.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-accordion.mjs

@@ -5,13 +5,12 @@ import { signal, Injectable, input, model, booleanAttribute, output, computed, i
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { areAnimationsDisabled } from '@siemens/element-ng/common';
 import { addIcons, elementDown2, SiIconNextComponent } from '@siemens/element-ng/icon';
-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, filter } from 'rxjs';
 import { ResizeObserverService } from '@siemens/element-ng/resize-observer';
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 /** @internal */
@@ -37,7 +36,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
  */
 /** @internal */
@@ -63,7 +62,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
  */
 let controlIdCounter = 1;
@@ -114,7 +113,7 @@ class SiCollapsiblePanelComponent {
      */
     badge = input();
     /**
-     * Defines the background color of the badge. Default is specific to SiMPL flavour.
+     * Defines the background color of the badge. Default is specific to Element flavour.
      */
     badgeColor = input();
     /**
@@ -193,7 +192,7 @@ class SiCollapsiblePanelComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiCollapsiblePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: SiCollapsiblePanelComponent, isStandalone: true, selector: "si-collapsible-panel", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, headerCssClasses: { classPropertyName: "headerCssClasses", publicName: "headerCssClasses", isSignal: true, isRequired: false, transformFunction: null }, contentBgClasses: { classPropertyName: "contentBgClasses", publicName: "contentBgClasses", isSignal: true, isRequired: false, transformFunction: null }, contentCssClasses: { classPropertyName: "contentCssClasses", publicName: "contentCssClasses", isSignal: true, isRequired: false, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, colorVariant: { classPropertyName: "colorVariant", publicName: "colorVariant", isSignal: true, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, badgeColor: { classPropertyName: "badgeColor", publicName: "badgeColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "openedChange", panelToggle: "panelToggle", toggle: "toggle" }, host: { properties: { "class": "colorVariant()", "class.opened": "opened()", "class.hcollapsed": "hcollapsed()", "class.full-height": "fullHeight()" } }, viewQueries: [{ propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"collapsible-header focus-inside px-6\"\n  role=\"button\"\n  [ngClass]=\"headerCssClasses()\"\n  [attr.tabindex]=\"disabled() ? '' : '0'\"\n  [id]=\"headerId\"\n  [class.open]=\"opened()\"\n  [class.disabled]=\"disabled()\"\n  [title]=\"hcollapsed() ? (heading() | translate) : ''\"\n  [attr.aria-expanded]=\"opened() && !hcollapsed()\"\n  [attr.aria-disabled]=\"disabled()\"\n  [attr.aria-controls]=\"controlId\"\n  [attr.aria-label]=\"hcollapsed() ? (heading() | translate) : ''\"\n  (keydown)=\"keydown($event)\"\n  (click)=\"doToggle($event)\"\n>\n  @let headerIcon = icon();\n  @if (headerIcon) {\n    <si-icon-next\n      class=\"icon ms-n2 me-2\"\n      [icon]=\"headerIcon\"\n      [class.collapsed-icon]=\"isHCollapsible\"\n    />\n  }\n  @if (icon() && badge() !== undefined && badge() !== '') {\n    <span class=\"badge-text\">\n      {{ badge() }}\n    </span>\n  }\n  <div class=\"si-title-2 autohide\">\n    {{ heading() | translate }}\n    <ng-content select=\"[si-panel-heading]\" />\n  </div>\n\n  @if (badge() !== undefined && badge() !== '') {\n    <span class=\"badge autohide\" [ngClass]=\"'bg-' + badgeColor()\">\n      {{ badge() }}\n    </span>\n  }\n  <span class=\"ms-auto overflow-hidden\">\n    <si-icon-next class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n  </span>\n</div>\n<div\n  #content\n  class=\"collapsible-content\"\n  role=\"region\"\n  [id]=\"controlId\"\n  [ngClass]=\"contentBgClasses()\"\n  [@showHide]=\"showHide\"\n  [attr.aria-labelledby]=\"headerId\"\n  [class.full-height]=\"fullHeight()\"\n>\n  @if (opened()) {\n    <div>\n      <div [ngClass]=\"contentCssClasses()\">\n        <ng-content />\n      </div>\n    </div>\n  }\n</div>\n", styles: [":host{--__radius: var(--si-accordion-radius, var(--element-button-radius));display:flex;flex-direction:column;background:var(--element-base-0);padding-block-end:2px}:host:not(.hcollapsed) .collapsed-icon,:host:not(.hcollapsed) .badge-text{display:none}:host.hcollapsed{background:var(--element-base-1)}:host.hcollapsed .collapsible-header .autohide,:host.hcollapsed .collapsible-content{display:none}:host.hcollapsed .collapsible-header{padding-block:8px}:host.hcollapsed .collapsible-header:hover{background:var(--element-base-1-hover)}:host.full-height{transition:flex-grow calc(.5s * var(--element-animations-enabled, 1))}:host.full-height.opened,:host.full-height .collapsible-content{flex:1 1 0}:host.full-height .collapsible-content>div{flex:1 0 0}.collapsible-header{display:flex;align-items:center;background:var(--element-base-1);color:var(--element-text-primary);padding-block:12px;border-radius:var(--__radius)}.collapsible-header.disabled{color:var(--element-text-disabled)}.collapsible-header.open{border-end-start-radius:0;border-end-end-radius:0}.collapsible-header:not(.disabled){cursor:pointer}.collapsible-header:not(.disabled):hover{text-decoration:none;background:var(--element-base-1-hover)}.dropdown-caret{transition:transform calc(.5s * var(--element-animations-enabled, 1));color:var(--element-ui-1)}.open .dropdown-caret{transform:rotate(180deg)}.collapsible-content{overflow:hidden;display:flex;flex-direction:column;background:var(--element-base-1);border-end-start-radius:var(--__radius);border-end-end-radius:var(--__radius)}.collapsible-content.full-height{overflow:auto}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }, { kind: "ngmodule", type: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }], animations: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: SiCollapsiblePanelComponent, isStandalone: true, selector: "si-collapsible-panel", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, headerCssClasses: { classPropertyName: "headerCssClasses", publicName: "headerCssClasses", isSignal: true, isRequired: false, transformFunction: null }, contentBgClasses: { classPropertyName: "contentBgClasses", publicName: "contentBgClasses", isSignal: true, isRequired: false, transformFunction: null }, contentCssClasses: { classPropertyName: "contentCssClasses", publicName: "contentCssClasses", isSignal: true, isRequired: false, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, colorVariant: { classPropertyName: "colorVariant", publicName: "colorVariant", isSignal: true, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, badgeColor: { classPropertyName: "badgeColor", publicName: "badgeColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "openedChange", panelToggle: "panelToggle", toggle: "toggle" }, host: { properties: { "class": "colorVariant()", "class.opened": "opened()", "class.hcollapsed": "hcollapsed()", "class.full-height": "fullHeight()" } }, viewQueries: [{ propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"collapsible-header focus-inside px-6\"\n  role=\"button\"\n  [ngClass]=\"headerCssClasses()\"\n  [attr.tabindex]=\"disabled() ? '' : '0'\"\n  [id]=\"headerId\"\n  [class.open]=\"opened()\"\n  [class.disabled]=\"disabled()\"\n  [title]=\"hcollapsed() ? (heading() | translate) : ''\"\n  [attr.aria-expanded]=\"opened() && !hcollapsed()\"\n  [attr.aria-disabled]=\"disabled()\"\n  [attr.aria-controls]=\"controlId\"\n  [attr.aria-label]=\"hcollapsed() ? (heading() | translate) : ''\"\n  (keydown)=\"keydown($event)\"\n  (click)=\"doToggle($event)\"\n>\n  @let headerIcon = icon();\n  @if (headerIcon) {\n    <si-icon-next\n      class=\"icon ms-n2 me-2\"\n      [icon]=\"headerIcon\"\n      [class.collapsed-icon]=\"isHCollapsible\"\n    />\n  }\n  @if (icon() && badge() !== undefined && badge() !== '') {\n    <span class=\"badge-text\">\n      {{ badge() }}\n    </span>\n  }\n  <div class=\"si-title-2 autohide\">\n    {{ heading() | translate }}\n    <ng-content select=\"[si-panel-heading]\" />\n  </div>\n\n  @if (badge() !== undefined && badge() !== '') {\n    <span class=\"badge autohide\" [ngClass]=\"'bg-' + badgeColor()\">\n      {{ badge() }}\n    </span>\n  }\n  <span class=\"ms-auto overflow-hidden\">\n    <si-icon-next class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n  </span>\n</div>\n<div\n  #content\n  class=\"collapsible-content\"\n  role=\"region\"\n  [id]=\"controlId\"\n  [ngClass]=\"contentBgClasses()\"\n  [@showHide]=\"showHide\"\n  [attr.aria-labelledby]=\"headerId\"\n  [class.full-height]=\"fullHeight()\"\n>\n  @if (opened()) {\n    <div>\n      <div [ngClass]=\"contentCssClasses()\">\n        <ng-content />\n      </div>\n    </div>\n  }\n</div>\n", styles: [":host{--__radius: var(--si-accordion-radius, var(--element-button-radius));display:flex;flex-direction:column;background:var(--element-base-0);padding-block-end:2px}:host:not(.hcollapsed) .collapsed-icon,:host:not(.hcollapsed) .badge-text{display:none}:host.hcollapsed{background:var(--element-base-1)}:host.hcollapsed .collapsible-header .autohide,:host.hcollapsed .collapsible-content{display:none}:host.hcollapsed .collapsible-header{padding-block:8px}:host.hcollapsed .collapsible-header:hover{background:var(--element-base-1-hover)}:host.full-height{transition:flex-grow calc(.5s * var(--element-animations-enabled, 1))}:host.full-height.opened,:host.full-height .collapsible-content{flex:1 1 0}:host.full-height .collapsible-content>div{flex:1 0 0}.collapsible-header{display:flex;align-items:center;background:var(--element-base-1);color:var(--element-text-primary);padding-block:12px;border-radius:var(--__radius)}.collapsible-header.disabled{color:var(--element-text-disabled)}.collapsible-header.open{border-end-start-radius:0;border-end-end-radius:0}.collapsible-header:not(.disabled){cursor:pointer}.collapsible-header:not(.disabled):hover{text-decoration:none;background:var(--element-base-1-hover)}.dropdown-caret{transition:transform calc(.5s * var(--element-animations-enabled, 1));color:var(--element-ui-1)}.open .dropdown-caret{transform:rotate(180deg)}.collapsible-content{overflow:hidden;display:flex;flex-direction:column;background:var(--element-base-1);border-end-start-radius:var(--__radius);border-end-end-radius:var(--__radius)}.collapsible-content.full-height{overflow:auto}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], animations: [
             trigger('showHide', [
                 transition('*=>hide', [
                     style({ overflow: 'hidden' }),
@@ -208,7 +207,7 @@ class SiCollapsiblePanelComponent {
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiCollapsiblePanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-collapsible-panel', animations: [
+            args: [{ selector: 'si-collapsible-panel', imports: [NgClass, SiIconNextComponent, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, animations: [
                         trigger('showHide', [
                             transition('*=>hide', [
                                 style({ overflow: 'hidden' }),
@@ -219,7 +218,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
                                 query(':enter', [style({ blockSize: '0' }), animate('0.5s ease', style({ blockSize: '*' }))], { optional: true })
                             ])
                         ])
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgClass, SiIconNextComponent, SiTranslateModule], host: {
+                    ], host: {
                         '[class]': 'colorVariant()',
                         '[class.opened]': 'opened()',
                         '[class.hcollapsed]': 'hcollapsed()',
@@ -228,7 +227,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImpor
         }], ctorParameters: () => [] });
 
 /**
- * Copyright Siemens 2016 - 2025.
+ * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
 const PANEL_MIN_HEIGHT = 100;
@@ -285,7 +284,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 SiAccordionModule {
@@ -302,7 +301,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
  */