@siemens/element-ng 51.0.0-rc.9 → 51.0.0

package/schematics/utils/template-utils.js

@@ -3,54 +3,40 @@
  * SPDX-License-Identifier: MIT
  */
 import ts from 'typescript';
-export const getInlineTemplates = (source) => {
-    const templateNodes = [];
-    const componentDecoratorVisitor = (node) => {
-        if (ts.isDecorator(node) &&
-            ts.isCallExpression(node.expression) &&
-            ts.isIdentifier(node.expression.expression) &&
-            node.expression.expression.text === 'Component') {
-            const arg = node.expression.arguments[0];
-            if (ts.isObjectLiteralExpression(arg)) {
-                const template = arg.properties.find(property => ts.isPropertyAssignment(property) &&
-                    ts.isIdentifier(property.name) &&
-                    property.name.text === 'template');
-                const initializer = template?.initializer;
-                if (initializer &&
-                    (ts.isNoSubstitutionTemplateLiteral(initializer) || ts.isStringLiteral(initializer))) {
-                    templateNodes.push(initializer);
+export const getComponentTemplates = (source) => {
+    const templates = [];
+    const visit = (node) => {
+        if (ts.isClassDeclaration(node)) {
+            for (const decorator of ts.getDecorators(node) ?? []) {
+                const call = decorator.expression;
+                if (!ts.isCallExpression(call) ||
+                    !ts.isIdentifier(call.expression) ||
+                    call.expression.text !== 'Component') {
+                    continue;
                 }
-            }
-        }
-        else {
-            node.forEachChild(componentDecoratorVisitor);
-        }
-    };
-    source.forEachChild(componentDecoratorVisitor);
-    return templateNodes;
-};
-export const getTemplateUrl = (source) => {
-    const templateUrls = [];
-    const componentDecoratorVisitor = (node) => {
-        if (ts.isDecorator(node) &&
-            ts.isCallExpression(node.expression) &&
-            ts.isIdentifier(node.expression.expression) &&
-            node.expression.expression.text === 'Component') {
-            const arg = node.expression.arguments[0];
-            if (ts.isObjectLiteralExpression(arg)) {
-                const template = arg.properties.find(property => ts.isPropertyAssignment(property) &&
-                    ts.isIdentifier(property.name) &&
-                    property.name.text === 'templateUrl');
-                const initializer = template?.initializer;
-                if (initializer && ts.isStringLiteral(initializer)) {
-                    templateUrls.push(initializer.text);
+                const metadata = call.arguments[0];
+                if (!metadata || !ts.isObjectLiteralExpression(metadata)) {
+                    continue;
+                }
+                for (const property of metadata.properties) {
+                    if (!ts.isPropertyAssignment(property) || !ts.isIdentifier(property.name)) {
+                        continue;
+                    }
+                    const value = property.initializer;
+                    if (property.name.text === 'template' &&
+                        (ts.isStringLiteral(value) || ts.isNoSubstitutionTemplateLiteral(value))) {
+                        templates.push({ component: node, kind: 'inline', node: value });
+                    }
+                    else if (property.name.text === 'templateUrl' && ts.isStringLiteral(value)) {
+                        templates.push({ component: node, kind: 'external', url: value.text });
+                    }
                 }
             }
         }
-        else {
-            node.forEachChild(componentDecoratorVisitor);
-        }
+        ts.forEachChild(node, visit);
     };
-    source.forEachChild(componentDecoratorVisitor);
-    return templateUrls;
+    visit(source);
+    return templates;
 };
+export const getInlineTemplates = (source) => getComponentTemplates(source).flatMap(template => template.kind === 'inline' ? [template.node] : []);
+export const getTemplateUrl = (source) => getComponentTemplates(source).flatMap(template => template.kind === 'external' ? [template.url] : []);

package/types/siemens-element-ng-chat-messages.d.ts

@@ -1,10 +1,9 @@
 import * as _siemens_element_translate_ng_translate from '@siemens/element-translate-ng/translate';
-import { TranslatableString as TranslatableString$1 } from '@siemens/element-translate-ng/translate';
+import { TranslatableString } from '@siemens/element-translate-ng/translate';
 import * as _angular_core from '@angular/core';
 import { TemplateRef, AfterContentInit, OnDestroy, AfterViewInit, ElementRef } from '@angular/core';
 import { MenuItem } from '@siemens/element-ng/menu';
 import { SourceReference } from '@siemens/element-ng/source-chip';
-import { TranslatableString } from '@siemens/element-translate-ng/translate-types';
 import { SiModalService } from '@siemens/element-ng/modal';
 import { FileUploadError, UploadFile } from '@siemens/element-ng/file-uploader';
 import * as i1 from '@siemens/element-ng/resize-observer';
@@ -99,6 +98,73 @@ declare class SiAiMessageComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiAiMessageComponent, "si-ai-message", never, { "content": { "alias": "content"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "secondaryActions": { "alias": "secondaryActions"; "required": false; "isSignal": true; }; "actionParam": { "alias": "actionParam"; "required": false; "isSignal": true; }; "sources": { "alias": "sources"; "required": false; "isSignal": true; }; "secondaryActionsLabel": { "alias": "secondaryActionsLabel"; "required": false; "isSignal": true; }; }, { "sourceClicked": "sourceClicked"; }, never, ["*"], true, never>;
 }
 
+/**
+ * Collapsible activity message for displaying progress and intermediate steps in a chat.
+ *
+ * @experimental
+ */
+declare class SiActivityMessageComponent {
+    /** Activity heading. */
+    readonly heading: _angular_core.InputSignal<TranslatableString>;
+    /** Activity icon. */
+    readonly icon: _angular_core.InputSignal<string | undefined>;
+    /** Current state of the activity. */
+    readonly state: _angular_core.InputSignal<"running" | "failed" | undefined>;
+    /**
+     * Whether the activity details are expanded.
+     *
+     * @defaultValue false
+     */
+    readonly expanded: _angular_core.ModelSignal<boolean>;
+    protected readonly icons: Record<"elementRight2" | "elementCircleFilled" | "elementIssue", string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiActivityMessageComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiActivityMessageComponent, "si-activity-message", never, { "heading": { "alias": "heading"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; }, never, ["*"], true, never>;
+}
+
+/**
+ * Titled content part for use inside an activity message.
+ *
+ * @experimental
+ */
+declare class SiActivityMessagePartComponent {
+    /** Part heading. */
+    readonly heading: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Whether the part can be collapsed and expanded.
+     *
+     * @defaultValue false
+     */
+    readonly collapsible: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether collapsible content is expanded.
+     *
+     * @defaultValue true
+     */
+    readonly expanded: _angular_core.ModelSignal<boolean>;
+    protected readonly icons: Record<"elementRight2" | "elementCircleFilled", string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiActivityMessagePartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiActivityMessagePartComponent, "si-activity-message-part", never, { "heading": { "alias": "heading"; "required": true; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; }, never, ["*"], true, never>;
+}
+
+/**
+ * Collapsible container for grouping multiple activity messages.
+ *
+ * @experimental
+ */
+declare class SiActivityTraceComponent {
+    /** Trace heading. */
+    readonly heading: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Whether the trace content is expanded.
+     *
+     * @defaultValue false
+     */
+    readonly expanded: _angular_core.ModelSignal<boolean>;
+    protected readonly icons: Record<"elementRight2", string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiActivityTraceComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiActivityTraceComponent, "si-activity-trace", never, { "heading": { "alias": "heading"; "required": true; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; }, never, ["*"], true, never>;
+}
+
 /**
  * Attachment item interface for file attachments in chat messages, used by {@link SiAttachmentListComponent} and inside {@link SiUserMessageComponent} as well as {@link SiChatInputComponent}.
  *
@@ -328,7 +394,7 @@ declare class SiChatInputComponent implements AfterViewInit {
      * t(() => $localize`:@@SI_CHAT_INPUT.PLACEHOLDER:Enter a message…`)
      * ```
      */
-    readonly placeholder: _angular_core.InputSignal<TranslatableString$1>;
+    readonly placeholder: _angular_core.InputSignal<TranslatableString>;
     /**
      * Whether the input is disabled
      * @defaultValue false
@@ -356,10 +422,9 @@ declare class SiChatInputComponent implements AfterViewInit {
      * If not provided, the component will look for projected content with the `siChatInputDisclaimer` directive.
      * If both are empty, no disclaimer section will be shown (handled via CSS :empty).
      */
-    readonly disclaimer: _angular_core.InputSignal<TranslatableString$1 | undefined>;
+    readonly disclaimer: _angular_core.InputSignal<TranslatableString | undefined>;
     /**
-     * Primary actions available in the input (attach files, etc.)
-     * All actions displayed inline
+     * Primary actions available in the input. Provide at most one action.
      * @defaultValue []
      */
     readonly actions: _angular_core.InputSignal<MessageAction[]>;
@@ -406,7 +471,7 @@ declare class SiChatInputComponent implements AfterViewInit {
      * t(() => $localize`:@@SI_CHAT_INPUT.SEND:Send`)
      * ```
      */
-    readonly sendButtonLabel: _angular_core.InputSignal<TranslatableString$1>;
+    readonly sendButtonLabel: _angular_core.InputSignal<TranslatableString>;
     /**
      * Send button icon
      *
@@ -421,7 +486,7 @@ declare class SiChatInputComponent implements AfterViewInit {
      * t(() => $localize`:@@SI_CHAT_INPUT.INTERRUPT:Stop processing`)
      * ```
      */
-    readonly interruptButtonLabel: _angular_core.InputSignal<TranslatableString$1>;
+    readonly interruptButtonLabel: _angular_core.InputSignal<TranslatableString>;
     /**
      * Auto-focus the input on component initialization
      * @defaultValue false
@@ -435,7 +500,7 @@ declare class SiChatInputComponent implements AfterViewInit {
      * t(() => $localize`:@@SI_CHAT_INPUT.ATTACH_FILE:Attach file`)
      * ```
      */
-    readonly attachFileLabel: _angular_core.InputSignal<TranslatableString$1>;
+    readonly attachFileLabel: _angular_core.InputSignal<TranslatableString>;
     /**
      * Remove attachment aria label.
      * The attachment name is available with `{{attachment}}`.
@@ -445,7 +510,7 @@ declare class SiChatInputComponent implements AfterViewInit {
      * t(() => $localize`:@@SI_ATTACHMENT_LIST.REMOVE_ATTACHMENT:Remove {{attachment}}`)
      * ```
      */
-    readonly removeAttachmentLabel: _angular_core.InputSignal<TranslatableString$1>;
+    readonly removeAttachmentLabel: _angular_core.InputSignal<TranslatableString>;
     /**
      * More actions button aria label
      *
@@ -454,7 +519,7 @@ declare class SiChatInputComponent implements AfterViewInit {
      * t(() => $localize`:@@SI_CHAT_INPUT.SECONDARY_ACTIONS:Additional actions`)
      * ```
      */
-    readonly secondaryActionsLabel: _angular_core.InputSignal<TranslatableString$1>;
+    readonly secondaryActionsLabel: _angular_core.InputSignal<TranslatableString>;
     /**
      * Suggested follow-up prompts to display as pill buttons above the chat input.
      * Use `followUpPromptSelected` to handle selection and update the input value.
@@ -487,14 +552,14 @@ declare class SiChatInputComponent implements AfterViewInit {
     protected readonly hasAttachments: _angular_core.Signal<boolean>;
     protected readonly hasActions: _angular_core.Signal<boolean>;
     protected readonly hasSecondaryActions: _angular_core.Signal<boolean>;
-    protected readonly allMenuActions: _angular_core.Signal<MenuItem[]>;
+    protected readonly combinedMenuActions: _angular_core.Signal<MenuItem[]>;
     protected readonly hasMenuActions: _angular_core.Signal<boolean>;
     protected triggerFileInput(): void;
     protected readonly canSend: _angular_core.Signal<boolean>;
     protected readonly showInterruptButton: _angular_core.Signal<boolean>;
     protected readonly buttonDisabled: _angular_core.Signal<boolean>;
     protected readonly buttonIcon: _angular_core.Signal<string>;
-    protected readonly buttonLabel: _angular_core.Signal<TranslatableString$1>;
+    protected readonly buttonLabel: _angular_core.Signal<TranslatableString>;
     protected readonly dragOver: _angular_core.WritableSignal<boolean>;
     private readonly injector;
     protected onInputChange(value: string): void;
@@ -673,10 +738,10 @@ declare class SiUserMessageComponent {
 }
 
 interface PromptCategory {
-    label: TranslatableString$1;
+    label: TranslatableString;
 }
 interface PromptSuggestion {
-    text: TranslatableString$1;
+    text: TranslatableString;
 }
 /**
  * AI welcome screen component for displaying initial state in AI chat interfaces.
@@ -691,7 +756,6 @@ interface PromptSuggestion {
  * - Clickable prompt suggestion cards
  * - Optional refresh button to regenerate suggestions
  *
- * @see {@link SiAiChatContainerComponent} for the AI chat container which uses this component
  * @see {@link SiChatContainerComponent} for the base chat container
  *
  * @experimental
@@ -722,5 +786,5 @@ declare class SiAiWelcomeScreenComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiAiWelcomeScreenComponent, "si-ai-welcome-screen", never, { "categories": { "alias": "categories"; "required": false; "isSignal": true; }; "selectedCategory": { "alias": "selectedCategory"; "required": false; "isSignal": true; }; "promptSuggestions": { "alias": "promptSuggestions"; "required": false; "isSignal": true; }; }, { "selectedCategory": "selectedCategoryChange"; "promptSelected": "promptSelected"; }, never, ["*"], true, never>;
 }
 
-export { SiAiMessageComponent, SiAiWelcomeScreenComponent, SiAttachmentListComponent, SiChatContainerComponent, SiChatContainerInputDirective, SiChatInputComponent, SiChatInputDisclaimerDirective, SiChatMessageActionDirective, SiChatMessageComponent, SiUserMessageComponent };
+export { SiActivityMessageComponent, SiActivityMessagePartComponent, SiActivityTraceComponent, SiAiMessageComponent, SiAiWelcomeScreenComponent, SiAttachmentListComponent, SiChatContainerComponent, SiChatContainerInputDirective, SiChatInputComponent, SiChatInputDisclaimerDirective, SiChatMessageActionDirective, SiChatMessageComponent, SiUserMessageComponent };
 export type { Attachment, ChatInputAttachment, MessageAction, PromptCategory, PromptSuggestion };

package/types/siemens-element-ng-form.d.ts

@@ -340,6 +340,8 @@ declare class SiFormItemComponent implements AfterContentInit, AfterContentCheck
     readonly required: _angular_core.Signal<boolean>;
     /** @internal */
     readonly control: _angular_core.Signal<_angular_forms.AbstractControl<any, any, any> | null | undefined>;
+    /** @internal */
+    readonly radioGroupName: _angular_core.Signal<string | undefined>;
     ngOnChanges(changes: SimpleChanges<this>): void;
     ngOnInit(): void;
     ngAfterContentInit(): void;
@@ -358,6 +360,7 @@ declare class SiFormItemComponent implements AfterContentInit, AfterContentCheck
 
 interface SiFormFieldsetControl {
     readonly control: Signal<unknown>;
+    readonly radioGroupName?: Signal<string | undefined>;
     readonly required: Signal<boolean>;
     readonly touched: Signal<boolean>;
     readonly errors: Signal<readonly SiFormError[]>;

package/types/siemens-element-ng-list-details.d.ts

@@ -1,5 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { OnInit, OnChanges, OnDestroy, SimpleChanges, Signal } from '@angular/core';
+import { SplitUnit } from '@siemens/element-ng/split';
 import { Subject, BehaviorSubject } from 'rxjs';
 import { TranslatableString } from '@siemens/element-translate-ng/translate';
 
@@ -8,6 +9,8 @@ declare class SiListDetailsComponent implements OnInit, OnChanges, OnDestroy {
     private elementRef;
     private resizeObserver;
     private readonly listDetailsContainer;
+    private readonly listPart;
+    private readonly split;
     protected readonly animationsGloballyDisabled: boolean;
     /**
      * A numeric value defining the minimum width in px, which the component needs
@@ -35,11 +38,22 @@ declare class SiListDetailsComponent implements OnInit, OnChanges, OnDestroy {
      */
     readonly disableResizing: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
-     * The percentage width of the list view of the overall component width.
+     * The list pane size, updated when the split is resized or restored.
+     * With resizing enabled, the value uses {@link listWidthUnit}: pixels for `px`,
+     * or a percentage-based fractional weight for `fr`. With resizing disabled,
+     * the value is always interpreted as a percentage.
+     * Percentage values must be in the inclusive range 0-100; values outside this
+     * range fall back to a 32/68 list/details split.
      *
-     * @defaultValue 32
+     * @defaultValue 300
      */
     readonly listWidth: _angular_core.ModelSignal<number>;
+    /**
+     * Unit used for the list split part when resizing is enabled.
+     *
+     * @defaultValue 'px'
+     */
+    readonly listWidthUnit: _angular_core.InputSignal<SplitUnit>;
     /**
      * Sets the minimal width of the list component in pixel.
      *
@@ -57,6 +71,13 @@ declare class SiListDetailsComponent implements OnInit, OnChanges, OnDestroy {
      * Required for persistence of ui state.
      */
     readonly stateId: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Percentage width shared by static and resizable `fr` layouts.
+     * The migration sets `listWidthUnit="fr"` without setting `listWidth`, so the default
+     * pixel width of 300 must fall back to 32 to preserve the legacy 32/68 split.
+     * @internal
+     */
+    readonly listWidthPercent: _angular_core.Signal<number>;
     protected readonly splitSizes: _angular_core.Signal<[number, number]>;
     protected readonly listStateId: _angular_core.Signal<string | undefined>;
     protected readonly detailsStateId: _angular_core.Signal<string | undefined>;
@@ -79,6 +100,7 @@ declare class SiListDetailsComponent implements OnInit, OnChanges, OnDestroy {
     ngOnDestroy(): void;
     private readonly resizeDimensions;
     protected onSplitSizesChange(sizes: number[]): void;
+    private getListSizePx;
     /** @internal */
     detailsBackClicked(options?: {
         animationDone?: () => void;
@@ -86,7 +108,7 @@ declare class SiListDetailsComponent implements OnInit, OnChanges, OnDestroy {
     protected detailsExpandedAnimationDone(event: TransitionEvent): void;
     private transferFocus;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiListDetailsComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiListDetailsComponent, "si-list-details", never, { "expandBreakpoint": { "alias": "expandBreakpoint"; "required": false; "isSignal": true; }; "detailsActive": { "alias": "detailsActive"; "required": false; "isSignal": true; }; "disableResizing": { "alias": "disableResizing"; "required": false; "isSignal": true; }; "listWidth": { "alias": "listWidth"; "required": false; "isSignal": true; }; "minListSize": { "alias": "minListSize"; "required": false; "isSignal": true; }; "minDetailsSize": { "alias": "minDetailsSize"; "required": false; "isSignal": true; }; "stateId": { "alias": "stateId"; "required": false; "isSignal": true; }; }, { "detailsActive": "detailsActiveChange"; "listWidth": "listWidthChange"; }, never, ["si-list-pane", "si-details-pane"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiListDetailsComponent, "si-list-details", never, { "expandBreakpoint": { "alias": "expandBreakpoint"; "required": false; "isSignal": true; }; "detailsActive": { "alias": "detailsActive"; "required": false; "isSignal": true; }; "disableResizing": { "alias": "disableResizing"; "required": false; "isSignal": true; }; "listWidth": { "alias": "listWidth"; "required": false; "isSignal": true; }; "listWidthUnit": { "alias": "listWidthUnit"; "required": false; "isSignal": true; }; "minListSize": { "alias": "minListSize"; "required": false; "isSignal": true; }; "minDetailsSize": { "alias": "minDetailsSize"; "required": false; "isSignal": true; }; "stateId": { "alias": "stateId"; "required": false; "isSignal": true; }; }, { "detailsActive": "detailsActiveChange"; "listWidth": "listWidthChange"; }, never, ["si-list-pane", "si-details-pane"], true, never>;
 }
 
 declare class SiListPaneComponent {

package/types/siemens-element-ng-main-detail-container.d.ts

@@ -1,5 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import { SplitUnit } from '@siemens/element-ng/split';
 import { TranslatableString } from '@siemens/element-translate-ng/translate';
 
 declare class SiMainDetailContainerComponent implements OnInit, OnChanges {
@@ -9,6 +10,8 @@ declare class SiMainDetailContainerComponent implements OnInit, OnChanges {
     private readonly resizeObserver;
     private readonly changeDetectorRef;
     private readonly destroyRef;
+    private readonly splitElement;
+    private readonly mainSplitPart;
     /**
      * A numeric value defining the minimum width in px, which the container needs
      * to be displayed in its large layout. Whenever smaller than
@@ -101,8 +104,23 @@ declare class SiMainDetailContainerComponent implements OnInit, OnChanges {
      */
     readonly detailContainerClass: _angular_core.InputSignal<string>;
     /**
-     * The percentage width of the main container from the overall component width.
-     * Can be a number or `'default'`, which is 32% when {@link resizableParts} is active, otherwise 50%.
+     * Unit used for the main split part when {@link resizableParts} is enabled.
+     *
+     * @defaultValue 'px'
+     */
+    readonly mainContainerWidthUnit: _angular_core.InputSignal<SplitUnit>;
+    /**
+     * The size of the main container. When {@link resizableParts} is enabled,
+     * the value is interpreted using {@link mainContainerWidthUnit} and updates as the splitter is moved.
+     * With `mainContainerWidthUnit="fr"`, numeric values must be from `0` to `100` (inclusive).
+     * The main and detail fractional weights are the value and `100 - value`;
+     * out-of-range values fall back to `32` and `68`.
+     * In the static layout, numeric values represent a percentage from `0` to `100`
+     * (inclusive); out-of-range values leave both containers without max-size constraints.
+     * Pixel widths are not limited to the `0` to `100` range.
+     *
+     * With `'default'`, resizable pixel layouts use {@link minMainSize}, resizable fractional
+     * layouts use main and detail weights of `32` and `68`, and static layouts use `50%`.
      *
      * @defaultValue 'default'
      */
@@ -145,11 +163,13 @@ declare class SiMainDetailContainerComponent implements OnInit, OnChanges {
      * Get the max size to limit in the static flex layout (if less than 50%), otherwise not set
      */
     private getMaxSize;
+    private getSplitSizes;
+    private getMainSizePx;
     private determineLayout;
     private doAnimation;
     private updateDetailsFocusable;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiMainDetailContainerComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiMainDetailContainerComponent, "si-main-detail-container", never, { "largeLayoutBreakpoint": { "alias": "largeLayoutBreakpoint"; "required": false; "isSignal": true; }; "detailsActive": { "alias": "detailsActive"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "truncateHeading": { "alias": "truncateHeading"; "required": false; "isSignal": true; }; "detailsHeading": { "alias": "detailsHeading"; "required": false; "isSignal": true; }; "resizableParts": { "alias": "resizableParts"; "required": false; "isSignal": true; }; "hideBackButton": { "alias": "hideBackButton"; "required": false; "isSignal": true; }; "detailsBackButtonText": { "alias": "detailsBackButtonText"; "required": false; "isSignal": true; }; "containerClass": { "alias": "containerClass"; "required": false; "isSignal": true; }; "mainContainerClass": { "alias": "mainContainerClass"; "required": false; "isSignal": true; }; "detailContainerClass": { "alias": "detailContainerClass"; "required": false; "isSignal": true; }; "mainContainerWidth": { "alias": "mainContainerWidth"; "required": false; "isSignal": true; }; "minMainSize": { "alias": "minMainSize"; "required": false; "isSignal": true; }; "minDetailSize": { "alias": "minDetailSize"; "required": false; "isSignal": true; }; "stateId": { "alias": "stateId"; "required": false; "isSignal": true; }; }, { "hasLargeSizeChange": "hasLargeSizeChange"; "detailsActive": "detailsActiveChange"; "mainContainerWidth": "mainContainerWidthChange"; }, never, ["[slot=mainSearch]", "[slot=mainActions]", "[slot=mainData]", "[slot=detailActions]", "[slot=details]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiMainDetailContainerComponent, "si-main-detail-container", never, { "largeLayoutBreakpoint": { "alias": "largeLayoutBreakpoint"; "required": false; "isSignal": true; }; "detailsActive": { "alias": "detailsActive"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "truncateHeading": { "alias": "truncateHeading"; "required": false; "isSignal": true; }; "detailsHeading": { "alias": "detailsHeading"; "required": false; "isSignal": true; }; "resizableParts": { "alias": "resizableParts"; "required": false; "isSignal": true; }; "hideBackButton": { "alias": "hideBackButton"; "required": false; "isSignal": true; }; "detailsBackButtonText": { "alias": "detailsBackButtonText"; "required": false; "isSignal": true; }; "containerClass": { "alias": "containerClass"; "required": false; "isSignal": true; }; "mainContainerClass": { "alias": "mainContainerClass"; "required": false; "isSignal": true; }; "detailContainerClass": { "alias": "detailContainerClass"; "required": false; "isSignal": true; }; "mainContainerWidthUnit": { "alias": "mainContainerWidthUnit"; "required": false; "isSignal": true; }; "mainContainerWidth": { "alias": "mainContainerWidth"; "required": false; "isSignal": true; }; "minMainSize": { "alias": "minMainSize"; "required": false; "isSignal": true; }; "minDetailSize": { "alias": "minDetailSize"; "required": false; "isSignal": true; }; "stateId": { "alias": "stateId"; "required": false; "isSignal": true; }; }, { "hasLargeSizeChange": "hasLargeSizeChange"; "detailsActive": "detailsActiveChange"; "mainContainerWidth": "mainContainerWidthChange"; }, never, ["[slot=mainSearch]", "[slot=mainActions]", "[slot=mainData]", "[slot=detailActions]", "[slot=details]"], true, never>;
 }
 
 declare class SiMainDetailContainerModule {

package/types/siemens-element-ng-select.d.ts

@@ -171,6 +171,9 @@ declare class SiSelectComponent<T> implements SiFormItemControl {
     protected readonly optionTemplate: _angular_core.Signal<TemplateRef<{
         $implicit: SelectOption<T>;
     }> | undefined>;
+    protected readonly selectedValueTemplate: _angular_core.Signal<TemplateRef<{
+        $implicit: SelectOption<T>;
+    }> | undefined>;
     protected readonly groupTemplate: _angular_core.Signal<TemplateRef<{
         $implicit: SelectGroup<T>;
     }> | undefined>;
@@ -205,7 +208,7 @@ declare class SiSelectComponent<T> implements SiFormItemControl {
     close(): void;
     protected backdropClick(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiSelectComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSelectComponent<any>, "si-select", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "labelledbyInput": { "alias": "labelledby"; "required": false; "isSignal": true; }; "filterPlaceholder": { "alias": "filterPlaceholder"; "required": false; "isSignal": true; }; "noResultsFoundLabel": { "alias": "noResultsFoundLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "scrollStrategy": { "alias": "scrollStrategy"; "required": false; "isSignal": true; }; "errormessageId": { "alias": "errormessageId"; "required": false; "isSignal": true; }; "hasFilter": { "alias": "hasFilter"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, ["optionTemplate", "groupTemplate", "actionsTemplate"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSelectComponent<any>, "si-select", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "labelledbyInput": { "alias": "labelledby"; "required": false; "isSignal": true; }; "filterPlaceholder": { "alias": "filterPlaceholder"; "required": false; "isSignal": true; }; "noResultsFoundLabel": { "alias": "noResultsFoundLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "scrollStrategy": { "alias": "scrollStrategy"; "required": false; "isSignal": true; }; "errormessageId": { "alias": "errormessageId"; "required": false; "isSignal": true; }; "hasFilter": { "alias": "hasFilter"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, ["optionTemplate", "selectedValueTemplate", "groupTemplate", "actionsTemplate"], never, true, never>;
 }
 
 /**
@@ -438,7 +441,8 @@ declare class SiSelectMultiValueDirective<T> extends SiSelectSelectionStrategy<T
 }
 
 /**
- * The directive allows to template/customize the value option rendering.
+ * The directive allows to template/customize the option rendering in the dropdown.
+ * It is also used for rendering selected values in the input if no input template is provided.
  * This requires using the {@link SiSelectSimpleOptionsDirective} to specify options as input.
  *
  * @example
@@ -457,6 +461,29 @@ declare class SiSelectOptionTemplateDirective {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiSelectOptionTemplateDirective, "[siSelectOptionTemplate]", never, {}, {}, never, never, true, never>;
 }
 
+/**
+ * The directive allows to template/customize the selected value rendering in the select input.
+ * This requires using the {@link SiSelectSimpleOptionsDirective} to specify options as input.
+ *
+ * @example
+ * ```html
+ * <si-select [options]="[
+ *   { type: 'option', value: 'good', label: 'Good' },
+ *   { type: 'option', value: 'fair', label: 'Fair' }
+ * ]">
+ *   <ng-template siSelectValueTemplate let-option>{{ option.label }}</ng-template>
+ * </si-select>
+ * ```
+ */
+declare class SiSelectValueTemplateDirective {
+    /** @internal */
+    static ngTemplateContextGuard<T = any>(directive: SiSelectValueTemplateDirective, context: unknown): context is {
+        $implicit: SelectOption<T>;
+    };
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiSelectValueTemplateDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiSelectValueTemplateDirective, "[siSelectValueTemplate]", never, {}, {}, never, never, true, never>;
+}
+
 /**
  * The directive allows to template/customize the group option rendering.
  * This requires using the {@link SiSelectSimpleOptionsDirective} to specify options as input.
@@ -508,7 +535,7 @@ declare class SiSelectActionsDirective {
 
 declare class SiSelectModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiSelectModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SiSelectModule, never, [typeof SiSelectActionDirective, typeof SiSelectActionsDirective, typeof SiSelectComponent, typeof SiSelectGroupTemplateDirective, typeof SiSelectMultiValueDirective, typeof SiSelectOptionTemplateDirective, typeof SiSelectSimpleOptionsDirective, typeof SiSelectSingleValueDirective], [typeof SiSelectActionDirective, typeof SiSelectActionsDirective, typeof SiSelectComponent, typeof SiSelectGroupTemplateDirective, typeof SiSelectMultiValueDirective, typeof SiSelectOptionTemplateDirective, typeof SiSelectSimpleOptionsDirective, typeof SiSelectSingleValueDirective]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SiSelectModule, never, [typeof SiSelectActionDirective, typeof SiSelectActionsDirective, typeof SiSelectComponent, typeof SiSelectGroupTemplateDirective, typeof SiSelectMultiValueDirective, typeof SiSelectOptionTemplateDirective, typeof SiSelectValueTemplateDirective, typeof SiSelectSimpleOptionsDirective, typeof SiSelectSingleValueDirective], [typeof SiSelectActionDirective, typeof SiSelectActionsDirective, typeof SiSelectComponent, typeof SiSelectGroupTemplateDirective, typeof SiSelectMultiValueDirective, typeof SiSelectOptionTemplateDirective, typeof SiSelectValueTemplateDirective, typeof SiSelectSimpleOptionsDirective, typeof SiSelectSingleValueDirective]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<SiSelectModule>;
 }
 
@@ -817,5 +844,5 @@ declare class SiSelectComboboxValueComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSelectComboboxValueComponent, "si-select-combobox-value", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconColor": { "alias": "iconColor"; "required": false; "isSignal": true; }; "stackedIcon": { "alias": "stackedIcon"; "required": false; "isSignal": true; }; "stackedIconColor": { "alias": "stackedIconColor"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
-export { SiCustomSelectDirective, SiSelectActionDirective, SiSelectActionsDirective, SiSelectComboboxComponent, SiSelectComboboxValueComponent, SiSelectComponent, SiSelectDropdownDirective, SiSelectGroupTemplateDirective, SiSelectLazyOptionsDirective, SiSelectListHasFilterComponent, SiSelectModule, SiSelectMultiValueDirective, SiSelectOptionTemplateDirective, SiSelectSimpleOptionsDirective, SiSelectSingleValueDirective };
+export { SiCustomSelectDirective, SiSelectActionDirective, SiSelectActionsDirective, SiSelectComboboxComponent, SiSelectComboboxValueComponent, SiSelectComponent, SiSelectDropdownDirective, SiSelectGroupTemplateDirective, SiSelectLazyOptionsDirective, SiSelectListHasFilterComponent, SiSelectModule, SiSelectMultiValueDirective, SiSelectOptionTemplateDirective, SiSelectSimpleOptionsDirective, SiSelectSingleValueDirective, SiSelectValueTemplateDirective };
 export type { SelectGroup, SelectItem, SelectOption, SelectOptionSource, SiSelectDropdownContentType };

package/types/siemens-element-ng-side-panel.d.ts

@@ -423,7 +423,7 @@ declare class SiSidePanelContentComponent implements OnInit {
     toggleFullscreen(): void;
     protected toggleSidePanel(event?: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiSidePanelContentComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSidePanelContentComponent, "si-side-panel-content", never, { "collapsibleInput": { "alias": "collapsible"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "primaryActions": { "alias": "primaryActions"; "required": false; "isSignal": true; }; "secondaryActions": { "alias": "secondaryActions"; "required": false; "isSignal": true; }; "statusActions": { "alias": "statusActions"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "closeButtonLabel": { "alias": "closeButtonLabel"; "required": false; "isSignal": true; }; "toggleItemLabel": { "alias": "toggleItemLabel"; "required": false; "isSignal": true; }; "enterFullscreenLabel": { "alias": "enterFullscreenLabel"; "required": false; "isSignal": true; }; "exitFullscreenLabel": { "alias": "exitFullscreenLabel"; "required": false; "isSignal": true; }; "showMobileDrawerBadge": { "alias": "showMobileDrawerBadge"; "required": false; "isSignal": true; }; "displayMode": { "alias": "displayMode"; "required": false; "isSignal": true; }; "navigateConfig": { "alias": "navigateConfig"; "required": false; "isSignal": true; }; }, { "searchEvent": "searchEvent"; }, never, ["si-side-panel-actions", "*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSidePanelContentComponent, "si-side-panel-content", never, { "collapsibleInput": { "alias": "collapsible"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "primaryActions": { "alias": "primaryActions"; "required": false; "isSignal": true; }; "secondaryActions": { "alias": "secondaryActions"; "required": false; "isSignal": true; }; "statusActions": { "alias": "statusActions"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "closeButtonLabel": { "alias": "closeButtonLabel"; "required": false; "isSignal": true; }; "toggleItemLabel": { "alias": "toggleItemLabel"; "required": false; "isSignal": true; }; "enterFullscreenLabel": { "alias": "enterFullscreenLabel"; "required": false; "isSignal": true; }; "exitFullscreenLabel": { "alias": "exitFullscreenLabel"; "required": false; "isSignal": true; }; "showMobileDrawerBadge": { "alias": "showMobileDrawerBadge"; "required": false; "isSignal": true; }; "displayMode": { "alias": "displayMode"; "required": false; "isSignal": true; }; "navigateConfig": { "alias": "navigateConfig"; "required": false; "isSignal": true; }; }, { "searchEvent": "searchEvent"; }, never, ["[siSidePanelBackButton]", "si-side-panel-actions", "*"], true, never>;
 }
 
 /**
@@ -496,11 +496,25 @@ declare class SiSidePanelActionComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSidePanelActionComponent, "button[si-side-panel-action], a[si-side-panel-action]", never, { "icon": { "alias": "icon"; "required": true; "isSignal": true; }; "iconColor": { "alias": "iconColor"; "required": false; "isSignal": true; }; "stackedIcon": { "alias": "stackedIcon"; "required": false; "isSignal": true; }; "stackedIconColor": { "alias": "stackedIconColor"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
+/**
+ * Back button for navigating from side-panel details to the previous view.
+ *
+ * @example
+ * ```html
+ * <button type="button" siSidePanelBackButton aria-label="Back" (click)="back()"></button>
+ * ```
+ */
+declare class SiSidePanelBackButtonComponent {
+    protected readonly icons: Record<"elementLeft4", string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiSidePanelBackButtonComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSidePanelBackButtonComponent, "button[siSidePanelBackButton], a[siSidePanelBackButton]", never, {}, {}, never, ["*"], true, never>;
+}
+
 declare class SiSidePanelModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiSidePanelModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SiSidePanelModule, never, [typeof SiSidePanelComponent, typeof SiSidePanelContentComponent, typeof SiSidePanelActionsComponent, typeof SiSidePanelActionComponent], [typeof SiSidePanelComponent, typeof SiSidePanelContentComponent, typeof SiSidePanelActionsComponent, typeof SiSidePanelActionComponent]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SiSidePanelModule, never, [typeof SiSidePanelComponent, typeof SiSidePanelContentComponent, typeof SiSidePanelActionsComponent, typeof SiSidePanelActionComponent, typeof SiSidePanelBackButtonComponent], [typeof SiSidePanelComponent, typeof SiSidePanelContentComponent, typeof SiSidePanelActionsComponent, typeof SiSidePanelActionComponent, typeof SiSidePanelBackButtonComponent]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<SiSidePanelModule>;
 }
 
-export { SiSidePanelActionComponent, SiSidePanelActionsComponent, SiSidePanelComponent, SiSidePanelContentComponent, SiSidePanelModule, SiSidePanelService };
+export { SiSidePanelActionComponent, SiSidePanelActionsComponent, SiSidePanelBackButtonComponent, SiSidePanelComponent, SiSidePanelContentComponent, SiSidePanelModule, SiSidePanelService };
 export type { SidePanelDisplayMode, SidePanelMode, SidePanelNavigateConfig, SidePanelNavigateLink, SidePanelNavigateRouterLink, SidePanelSize, StatusItem };

package/types/siemens-element-ng-split.d.ts

@@ -10,7 +10,6 @@ import { TranslatableString } from '@siemens/element-translate-ng/translate';
 type CollapseTo = 'to-start' | 'to-end';
 type SplitOrientation = 'horizontal' | 'vertical';
 type SplitUnit = 'px' | 'fr';
-type Scale = 'none' | 'auto';
 interface Action {
     iconClass: string;
     tooltip: string;
@@ -72,13 +71,6 @@ declare class SiSplitPartComponent {
      * @defaultValue false
      */
     readonly removeContentOnCollapse: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    /**
-     * Defines the behavior of the split part during scaling.
-     * E.g. when set to `none`, the spit part will keep its current size even when the parent container grows or shrinks.
-     *
-     * @defaultValue 'auto'
-     */
-    readonly scale: _angular_core.InputSignal<Scale>;
     /**
      * Defines if the header of the split part is visible. Default is true.
      *
@@ -178,7 +170,7 @@ declare class SiSplitPartComponent {
     private refreshCollapsedToEnd;
     private refreshCollapseToStart;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiSplitPartComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSplitPartComponent, "si-split-part", never, { "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "collapseIconClass": { "alias": "collapseIconClass"; "required": false; "isSignal": true; }; "collapseToMinSize": { "alias": "collapseToMinSize"; "required": false; "isSignal": true; }; "headerTemplate": { "alias": "headerTemplate"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "minSize": { "alias": "minSize"; "required": false; "isSignal": true; }; "removeContentOnCollapse": { "alias": "removeContentOnCollapse"; "required": false; "isSignal": true; }; "scale": { "alias": "scale"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "collapseLabel": { "alias": "collapseLabel"; "required": false; "isSignal": true; }; "stateId": { "alias": "stateId"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": true; "isSignal": true; }; "unit": { "alias": "unit"; "required": true; "isSignal": true; }; "collapseOthers": { "alias": "collapseOthers"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "collapseChanged": "collapseChanged"; "stateChange": "stateChange"; }, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiSplitPartComponent, "si-split-part", never, { "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "collapseIconClass": { "alias": "collapseIconClass"; "required": false; "isSignal": true; }; "collapseToMinSize": { "alias": "collapseToMinSize"; "required": false; "isSignal": true; }; "headerTemplate": { "alias": "headerTemplate"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "minSize": { "alias": "minSize"; "required": false; "isSignal": true; }; "removeContentOnCollapse": { "alias": "removeContentOnCollapse"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "collapseLabel": { "alias": "collapseLabel"; "required": false; "isSignal": true; }; "stateId": { "alias": "stateId"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": true; "isSignal": true; }; "unit": { "alias": "unit"; "required": true; "isSignal": true; }; "collapseOthers": { "alias": "collapseOthers"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "collapseChanged": "collapseChanged"; "stateChange": "stateChange"; }, never, ["*"], true, never>;
 }
 
 interface Gutter {
@@ -226,6 +218,7 @@ declare class SiSplitComponent {
     private setupParts;
     private refreshAllPartSizes;
     protected resizeStart(gutter: Gutter, event: Event): void;
+    private emitSizesChange;
     private measureContainerSize;
     private getPosition;
     private saveUIState;
@@ -241,4 +234,4 @@ declare class SiSplitModule {
 }
 
 export { SiSplitComponent, SiSplitModule, SiSplitPartComponent };
-export type { Action, CollapseTo, PartState, Scale, SplitOrientation, SplitUnit };
+export type { Action, CollapseTo, PartState, SplitOrientation, SplitUnit };