@siemens/element-ng 49.12.0 → 49.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/fesm2022/siemens-element-ng-accordion.mjs +4 -3
  2. package/fesm2022/siemens-element-ng-accordion.mjs.map +1 -1
  3. package/fesm2022/siemens-element-ng-application-header.mjs +35 -13
  4. package/fesm2022/siemens-element-ng-application-header.mjs.map +1 -1
  5. package/fesm2022/siemens-element-ng-autocomplete.mjs +9 -13
  6. package/fesm2022/siemens-element-ng-autocomplete.mjs.map +1 -1
  7. package/fesm2022/siemens-element-ng-form.mjs +24 -46
  8. package/fesm2022/siemens-element-ng-form.mjs.map +1 -1
  9. package/fesm2022/siemens-element-ng-header-dropdown.mjs +14 -7
  10. package/fesm2022/siemens-element-ng-header-dropdown.mjs.map +1 -1
  11. package/fesm2022/siemens-element-ng-ip-input.mjs +1 -1
  12. package/fesm2022/siemens-element-ng-ip-input.mjs.map +1 -1
  13. package/fesm2022/siemens-element-ng-phone-number.mjs +63 -42
  14. package/fesm2022/siemens-element-ng-phone-number.mjs.map +1 -1
  15. package/fesm2022/siemens-element-ng-popover.mjs +7 -9
  16. package/fesm2022/siemens-element-ng-popover.mjs.map +1 -1
  17. package/fesm2022/siemens-element-ng-summary-chip.mjs +2 -2
  18. package/fesm2022/siemens-element-ng-summary-chip.mjs.map +1 -1
  19. package/fesm2022/siemens-element-ng-tabs.mjs +33 -6
  20. package/fesm2022/siemens-element-ng-tabs.mjs.map +1 -1
  21. package/fesm2022/siemens-element-ng-tooltip.mjs +178 -75
  22. package/fesm2022/siemens-element-ng-tooltip.mjs.map +1 -1
  23. package/fesm2022/siemens-element-ng-tour.mjs +4 -1
  24. package/fesm2022/siemens-element-ng-tour.mjs.map +1 -1
  25. package/fesm2022/siemens-element-ng-tree-view.mjs +28 -7
  26. package/fesm2022/siemens-element-ng-tree-view.mjs.map +1 -1
  27. package/package.json +3 -3
  28. package/types/siemens-element-ng-application-header.d.ts +12 -4
  29. package/types/siemens-element-ng-autocomplete.d.ts +19 -19
  30. package/types/siemens-element-ng-form.d.ts +1 -3
  31. package/types/siemens-element-ng-header-dropdown.d.ts +5 -0
  32. package/types/siemens-element-ng-phone-number.d.ts +2 -2
  33. package/types/siemens-element-ng-popover.d.ts +2 -2
  34. package/types/siemens-element-ng-tabs.d.ts +4 -0
  35. package/types/siemens-element-ng-tooltip.d.ts +10 -26
  36. package/types/siemens-element-ng-tree-view.d.ts +14 -3
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@siemens/element-ng",
3
3
  "description": "Element Angular component library, implementing the Siemens Design Language",
4
- "version": "49.12.0",
4
+ "version": "49.14.0",
5
5
  "license": "MIT",
6
6
  "repository": {
7
7
  "type": "git",
@@ -43,8 +43,8 @@
43
43
  "@ngx-formly/bootstrap": "^6.2.2",
44
44
  "@ngx-formly/core": "^6.2.2",
45
45
  "@siemens/element-icons": "1",
46
- "@siemens/element-translate-ng": "49.12.0",
47
- "@siemens/element-theme": "49.12.0",
46
+ "@siemens/element-translate-ng": "49.14.0",
47
+ "@siemens/element-theme": "49.14.0",
48
48
  "@siemens/ngx-datatable": "22 - 26",
49
49
  "ag-grid-community": "^34.3.1 || ^35.0.0",
50
50
  "flag-icons": "^7.3.2",
@@ -1,7 +1,7 @@
1
1
  import * as _siemens_element_translate_ng_translate from '@siemens/element-translate-ng/translate';
2
2
  import { TranslatableString } from '@siemens/element-translate-ng/translate';
3
3
  import * as _angular_core from '@angular/core';
4
- import { OnDestroy, TemplateRef, Injector, OnInit, OnChanges, SimpleChanges } from '@angular/core';
4
+ import { OnDestroy, TemplateRef, Injector, OnInit, OnChanges, Signal, ElementRef, SimpleChanges } from '@angular/core';
5
5
  import { HeaderWithDropdowns, SiHeaderDropdownTriggerDirective } from '@siemens/element-ng/header-dropdown';
6
6
  import { Subject } from 'rxjs';
7
7
  import * as _siemens_element_ng_application_header from '@siemens/element-ng/application-header';
@@ -147,10 +147,16 @@ declare abstract class SiHeaderActionIconItemBase extends SiHeaderActionItemBase
147
147
  * - =true, an empty red dot will be shown
148
148
  */
149
149
  readonly badge: _angular_core.InputSignal<number | boolean | null | undefined>;
150
- protected readonly badgeDot: _angular_core.Signal<boolean>;
151
- protected readonly badgeValue: _angular_core.Signal<string | undefined>;
150
+ protected abstract readonly itemTitle: Signal<string | ElementRef<Element>>;
151
+ private readonly tooltipService;
152
+ private readonly elementRef;
153
+ private readonly existingTooltip;
154
+ protected readonly badgeDot: Signal<boolean>;
155
+ protected readonly badgeValue: Signal<string | undefined>;
156
+ constructor();
157
+ private setupTooltip;
152
158
  ngOnChanges(changes: SimpleChanges<this>): void;
153
- protected get visuallyHideTitle(): boolean;
159
+ protected readonly visuallyHideTitle: Signal<boolean>;
154
160
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiHeaderActionIconItemBase, never>;
155
161
  static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiHeaderActionIconItemBase, never, never, { "badge": { "alias": "badge"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
156
162
  }
@@ -159,6 +165,7 @@ declare abstract class SiHeaderActionIconItemBase extends SiHeaderActionItemBase
159
165
  declare class SiHeaderActionItemComponent extends SiHeaderActionIconItemBase {
160
166
  /** The icon to be shown. */
161
167
  readonly icon: _angular_core.InputSignal<string>;
168
+ protected readonly itemTitle: _angular_core.Signal<ElementRef<HTMLElement>>;
162
169
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiHeaderActionItemComponent, never>;
163
170
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiHeaderActionItemComponent, "button[si-header-action-item], a[si-header-action-item]", never, { "icon": { "alias": "icon"; "required": true; "isSignal": true; }; }, {}, never, ["si-avatar", "*"], true, never>;
164
171
  }
@@ -171,6 +178,7 @@ declare class SiHeaderAccountItemComponent extends SiHeaderActionIconItemBase {
171
178
  readonly initials: _angular_core.InputSignal<string | undefined>;
172
179
  /** URL to an image which should be shown instead of the initials. */
173
180
  readonly imageUrl: _angular_core.InputSignal<string | undefined>;
181
+ protected readonly itemTitle: _angular_core.InputSignal<string>;
174
182
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiHeaderAccountItemComponent, never>;
175
183
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiHeaderAccountItemComponent, "button[si-header-account-item]", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "initials": { "alias": "initials"; "required": false; "isSignal": true; }; "imageUrl": { "alias": "imageUrl"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
176
184
  }
@@ -1,4 +1,4 @@
1
- import * as i0 from '@angular/core';
1
+ import * as _angular_core from '@angular/core';
2
2
  import { OnInit } from '@angular/core';
3
3
  import { Highlightable } from '@angular/cdk/a11y';
4
4
 
@@ -12,30 +12,30 @@ declare class SiAutocompleteOptionDirective<T = unknown> implements Highlightabl
12
12
  * `__si-autocomplete-option-${SiAutocompleteOptionDirective.idCounter++}`
13
13
  * ```
14
14
  */
15
- readonly id: i0.InputSignal<string>;
15
+ readonly id: _angular_core.InputSignal<string>;
16
16
  /** @defaultValue false */
17
- readonly disabledInput: i0.InputSignalWithTransform<boolean, unknown>;
17
+ readonly disabledInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
18
18
  get disabled(): boolean;
19
19
  /** @defaultValue undefined */
20
- readonly value: i0.InputSignal<T | undefined>;
21
- protected active?: boolean;
20
+ readonly value: _angular_core.InputSignal<T | undefined>;
21
+ protected readonly active: _angular_core.WritableSignal<boolean>;
22
22
  protected click(): void;
23
23
  /** @internal */
24
24
  setActiveStyles(): void;
25
25
  /** @internal */
26
26
  setInactiveStyles(): void;
27
- static ɵfac: i0.ɵɵFactoryDeclaration<SiAutocompleteOptionDirective<any>, never>;
28
- static ɵdir: i0.ɵɵDirectiveDeclaration<SiAutocompleteOptionDirective<any>, "[siAutocompleteOption]", ["siAutocompleteOption"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "siAutocompleteOption"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
27
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiAutocompleteOptionDirective<any>, never>;
28
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiAutocompleteOptionDirective<any>, "[siAutocompleteOption]", ["siAutocompleteOption"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "siAutocompleteOption"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
29
29
  }
30
30
 
31
31
  declare class SiAutocompleteDirective<T> {
32
32
  /** @internal */
33
- readonly listbox: i0.WritableSignal<SiAutocompleteListboxDirective<T> | undefined>;
33
+ readonly listbox: _angular_core.WritableSignal<SiAutocompleteListboxDirective<T> | undefined>;
34
34
  protected get activeDescendant(): string;
35
35
  protected keydown(event: KeyboardEvent): void;
36
36
  get active(): SiAutocompleteOptionDirective<T> | undefined | null;
37
- static ɵfac: i0.ɵɵFactoryDeclaration<SiAutocompleteDirective<any>, never>;
38
- static ɵdir: i0.ɵɵDirectiveDeclaration<SiAutocompleteDirective<any>, "input[siAutocomplete]", ["siAutocomplete"], {}, {}, never, never, true, never>;
37
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiAutocompleteDirective<any>, never>;
38
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiAutocompleteDirective<any>, "input[siAutocomplete]", ["siAutocomplete"], {}, {}, never, never, true, never>;
39
39
  }
40
40
 
41
41
  declare class SiAutocompleteListboxDirective<T> implements OnInit {
@@ -47,11 +47,11 @@ declare class SiAutocompleteListboxDirective<T> implements OnInit {
47
47
  * `__si-autocomplete-listbox-${SiAutocompleteListboxDirective.idCounter++}`
48
48
  * ```
49
49
  */
50
- readonly id: i0.InputSignal<string>;
51
- readonly autocomplete: i0.InputSignal<SiAutocompleteDirective<T>>;
50
+ readonly id: _angular_core.InputSignal<string>;
51
+ readonly autocomplete: _angular_core.InputSignal<SiAutocompleteDirective<T>>;
52
52
  /** @defaultValue 0 */
53
- readonly siAutocompleteDefaultIndex: i0.InputSignal<number>;
54
- readonly siAutocompleteOptionSubmitted: i0.OutputEmitterRef<T | undefined>;
53
+ readonly siAutocompleteDefaultIndex: _angular_core.InputSignal<number>;
54
+ readonly siAutocompleteOptionSubmitted: _angular_core.OutputEmitterRef<T | undefined>;
55
55
  private injector;
56
56
  private keyManager;
57
57
  private changeDetectorRef;
@@ -62,14 +62,14 @@ declare class SiAutocompleteListboxDirective<T> implements OnInit {
62
62
  /** @internal */
63
63
  onKeydown(event: KeyboardEvent): void;
64
64
  get active(): SiAutocompleteOptionDirective<T> | null;
65
- static ɵfac: i0.ɵɵFactoryDeclaration<SiAutocompleteListboxDirective<any>, never>;
66
- static ɵdir: i0.ɵɵDirectiveDeclaration<SiAutocompleteListboxDirective<any>, "[siAutocompleteListboxFor]", ["siAutocompleteListbox"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "siAutocompleteListboxFor"; "required": true; "isSignal": true; }; "siAutocompleteDefaultIndex": { "alias": "siAutocompleteDefaultIndex"; "required": false; "isSignal": true; }; }, { "siAutocompleteOptionSubmitted": "siAutocompleteOptionSubmitted"; }, ["options"], never, true, never>;
65
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiAutocompleteListboxDirective<any>, never>;
66
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiAutocompleteListboxDirective<any>, "[siAutocompleteListboxFor]", ["siAutocompleteListbox"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "siAutocompleteListboxFor"; "required": true; "isSignal": true; }; "siAutocompleteDefaultIndex": { "alias": "siAutocompleteDefaultIndex"; "required": false; "isSignal": true; }; }, { "siAutocompleteOptionSubmitted": "siAutocompleteOptionSubmitted"; }, ["options"], never, true, never>;
67
67
  }
68
68
 
69
69
  declare class SiAutocompleteModule {
70
- static ɵfac: i0.ɵɵFactoryDeclaration<SiAutocompleteModule, never>;
71
- static ɵmod: i0.ɵɵNgModuleDeclaration<SiAutocompleteModule, never, [typeof SiAutocompleteDirective, typeof SiAutocompleteListboxDirective, typeof SiAutocompleteOptionDirective], [typeof SiAutocompleteDirective, typeof SiAutocompleteListboxDirective, typeof SiAutocompleteOptionDirective]>;
72
- static ɵinj: i0.ɵɵInjectorDeclaration<SiAutocompleteModule>;
70
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiAutocompleteModule, never>;
71
+ static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SiAutocompleteModule, never, [typeof SiAutocompleteDirective, typeof SiAutocompleteListboxDirective, typeof SiAutocompleteOptionDirective], [typeof SiAutocompleteDirective, typeof SiAutocompleteListboxDirective, typeof SiAutocompleteOptionDirective]>;
72
+ static ɵinj: _angular_core.ɵɵInjectorDeclaration<SiAutocompleteModule>;
73
73
  }
74
74
 
75
75
  export { SiAutocompleteDirective, SiAutocompleteListboxDirective, SiAutocompleteModule, SiAutocompleteOptionDirective };
@@ -365,13 +365,11 @@ declare class SiFormValidationTooltipDirective implements OnDestroy, DoCheck {
365
365
  private readonly errors;
366
366
  private currentErrors;
367
367
  private touched;
368
- private activationCount;
369
368
  protected readonly describedBy: string;
370
369
  ngDoCheck(): void;
371
370
  ngOnDestroy(): void;
372
- protected increaseActivation(): void;
373
371
  private updateErrors;
374
- protected decreaseActivation(): void;
372
+ private createTooltip;
375
373
  private destroyTooltip;
376
374
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiFormValidationTooltipDirective, never>;
377
375
  static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiFormValidationTooltipDirective, "[siFormValidationTooltip]", never, { "formErrorMapper": { "alias": "formErrorMapper"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
@@ -27,6 +27,11 @@ declare class SiHeaderDropdownTriggerDirective implements OnChanges, OnInit, OnD
27
27
  private readonly parent;
28
28
  /** @internal */
29
29
  readonly navbar: _siemens_element_ng_header_dropdown.HeaderWithDropdowns | null;
30
+ /**
31
+ * Whether the dropdown is opened inline (mobile) instead of in an overlay (desktop).
32
+ * Inline dropdowns are simple disclosure groups, while overlay dropdowns are dialogs.
33
+ */
34
+ protected readonly inline: _angular_core.Signal<boolean>;
30
35
  private readonly injector;
31
36
  private viewRef?;
32
37
  private portal?;
@@ -142,7 +142,7 @@ declare class SiPhoneNumberInputComponent implements ControlValueAccessor, Valid
142
142
  */
143
143
  readonly errormessageId: _angular_core.InputSignal<string>;
144
144
  protected readonly phoneInput: _angular_core.Signal<ElementRef<HTMLInputElement>>;
145
- protected selectedCountry?: CountryInfo;
145
+ protected readonly selectedCountry: _angular_core.WritableSignal<CountryInfo | undefined>;
146
146
  protected placeholder: string;
147
147
  protected readonly countryFocused: _angular_core.WritableSignal<boolean>;
148
148
  protected open: boolean;
@@ -153,7 +153,7 @@ declare class SiPhoneNumberInputComponent implements ControlValueAccessor, Valid
153
153
  private readonly allowedCountries;
154
154
  private readonly disabledNgControl;
155
155
  private isValidNumber;
156
- private phoneNumber?;
156
+ private readonly phoneNumber;
157
157
  private onChange;
158
158
  private onTouched;
159
159
  ngOnChanges(changes: SimpleChanges<this>): void;
@@ -50,9 +50,9 @@ declare class SiPopoverDirective implements OnDestroy {
50
50
  */
51
51
  readonly scrollStrategy: _angular_core.InputSignal<ScrollStrategy | undefined>;
52
52
  /**
53
- * Emits an event when the popover is shown/hidden
53
+ * Emits `true` when the popover is shown, `false` when the popover is hidden.
54
54
  */
55
- readonly visibilityChange: _angular_core.OutputEmitterRef<void>;
55
+ readonly visibilityChange: _angular_core.OutputEmitterRef<boolean>;
56
56
  /** @internal */
57
57
  readonly popoverCounter: number;
58
58
  /** @internal */
@@ -48,12 +48,16 @@ declare abstract class SiTabBaseDirective implements OnDestroy, FocusableOption
48
48
  readonly tabContent: Signal<TemplateRef<any> | undefined>;
49
49
  private static tabCounter;
50
50
  private indexBeforeClose;
51
+ private readonly tooltipService;
52
+ private readonly existingTooltip;
53
+ private tooltipRef?;
51
54
  /** @internal */
52
55
  tabId: string;
53
56
  protected readonly icons: Record<"elementCancel", string>;
54
57
  protected tabset: _siemens_element_ng_tabs.SiTabsetComponent;
55
58
  private readonly index;
56
59
  constructor();
60
+ private setupIconTooltip;
57
61
  ngOnDestroy(): void;
58
62
  protected closeTab(event: Event): void;
59
63
  /** @internal */
@@ -1,6 +1,6 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { OnDestroy, TemplateRef, Type, ElementRef, Injector } from '@angular/core';
3
- import { ScrollStrategy, OverlayRef } from '@angular/cdk/overlay';
3
+ import { ScrollStrategy } from '@angular/cdk/overlay';
4
4
  import { TranslatableString } from '@siemens/element-translate-ng/translate';
5
5
  import { positions } from '@siemens/element-ng/common';
6
6
 
@@ -35,16 +35,10 @@ declare class SiTooltipDirective implements OnDestroy {
35
35
  readonly tooltipContext: i0.InputSignal<unknown>;
36
36
  protected describedBy: string;
37
37
  private tooltipRef?;
38
- private showTimeout?;
39
38
  private tooltipService;
40
39
  private elementRef;
41
- private isBrowser;
40
+ constructor();
42
41
  ngOnDestroy(): void;
43
- private clearShowTimeout;
44
- private showTooltip;
45
- protected focusIn(event: FocusEvent): void;
46
- protected show(): void;
47
- protected hide(): void;
48
42
  static ɵfac: i0.ɵɵFactoryDeclaration<SiTooltipDirective, never>;
49
43
  static ɵdir: i0.ɵɵDirectiveDeclaration<SiTooltipDirective, "[siTooltip]", never, { "siTooltip": { "alias": "siTooltip"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "isDisabled": { "alias": "isDisabled"; "required": false; "isSignal": true; }; "tooltipScrollStrategy": { "alias": "tooltipScrollStrategy"; "required": false; "isSignal": true; }; "tooltipContext": { "alias": "tooltipContext"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
50
44
  }
@@ -60,27 +54,15 @@ declare class SiTooltipModule {
60
54
  * SPDX-License-Identifier: MIT
61
55
  */
62
56
 
63
- type SiTooltipContent = TranslatableString | TemplateRef<any> | Type<any> | null | undefined;
57
+ type SiTooltipContent = TranslatableString | TemplateRef<any> | Type<any> | ElementRef<Element> | null | undefined;
64
58
 
65
59
  /**
66
60
  * Copyright (c) Siemens 2016 - 2026
67
61
  * SPDX-License-Identifier: MIT
68
62
  */
69
63
 
70
- /**
71
- * TooltipRef is attached to a specific element.
72
- * Use it to show or hide a tooltip for that element.
73
- *
74
- * @internal
75
- */
76
- declare class TooltipRef {
77
- private overlayRef;
78
- private element;
79
- private injector?;
80
- constructor(overlayRef: OverlayRef, element: ElementRef, injector?: Injector | undefined);
81
- private subscription?;
82
- show(): void;
83
- hide(): void;
64
+ /** @internal */
65
+ interface TooltipRef {
84
66
  destroy(): void;
85
67
  }
86
68
  /**
@@ -92,17 +74,19 @@ declare class TooltipRef {
92
74
  */
93
75
  declare class SiTooltipService {
94
76
  private overlay;
77
+ private isBrowser;
95
78
  createTooltip(config: {
96
- describedBy: string;
79
+ describedBy?: string;
97
80
  element: ElementRef;
98
81
  placement: keyof typeof positions;
99
82
  injector?: Injector;
100
83
  tooltip: () => SiTooltipContent;
101
84
  tooltipContext: () => unknown;
102
- scrollStrategy?: ScrollStrategy;
85
+ scrollStrategy?: () => ScrollStrategy | undefined;
103
86
  }): TooltipRef;
104
87
  static ɵfac: i0.ɵɵFactoryDeclaration<SiTooltipService, never>;
105
88
  static ɵprov: i0.ɵɵInjectableDeclaration<SiTooltipService>;
106
89
  }
107
90
 
108
- export { SiTooltipDirective, SiTooltipModule, SiTooltipService, TooltipRef };
91
+ export { SiTooltipDirective, SiTooltipModule, SiTooltipService };
92
+ export type { TooltipRef };
@@ -1,5 +1,5 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { OnInit, AfterViewInit, DoCheck, TemplateRef, OnChanges, OnDestroy, AfterViewChecked, Signal, SimpleChanges, ElementRef } from '@angular/core';
2
+ import { OnInit, AfterViewInit, DoCheck, TemplateRef, OnChanges, OnDestroy, AfterViewChecked, TrackByFunction, Signal, SimpleChanges, ElementRef } from '@angular/core';
3
3
  import { MenuItem } from '@siemens/element-ng/common';
4
4
  import { MenuItem as MenuItem$1 } from '@siemens/element-ng/menu';
5
5
  import { TranslatableString } from '@siemens/element-translate-ng/translate';
@@ -20,7 +20,7 @@ declare class SiTreeViewItemComponent implements OnInit, AfterViewInit, Focusabl
20
20
  };
21
21
  protected treeViewComponent: _siemens_element_ng_tree_view.SiTreeViewComponent;
22
22
  /** @internal */
23
- treeItem: TreeItem;
23
+ get treeItem(): TreeItem;
24
24
  private scrollIntoView;
25
25
  private childrenLoaded;
26
26
  protected templates: _angular_core.Signal<readonly _siemens_element_ng_tree_view.SiTreeViewItemTemplateDirective[]>;
@@ -204,6 +204,16 @@ declare class SiTreeViewComponent implements OnInit, OnChanges, OnDestroy, After
204
204
  * @defaultref {@link _items}
205
205
  */
206
206
  readonly items: _angular_core.InputSignal<TreeItem<any>[]>;
207
+ /**
208
+ * Identifies tree items when the items input is replaced. Provide a stable key to retain
209
+ * rendered item views for immutable data updates.
210
+ *
211
+ * @defaultValue
212
+ * ```
213
+ * (_index, item) => item
214
+ * ```
215
+ */
216
+ readonly trackBy: _angular_core.InputSignal<TrackByFunction<TreeItem<any>>>;
207
217
  /**
208
218
  * Sets the tree item to be selected.
209
219
  */
@@ -539,7 +549,7 @@ declare class SiTreeViewComponent implements OnInit, OnChanges, OnDestroy, After
539
549
  private treeItemsUpdated;
540
550
  private selectTreeItems;
541
551
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiTreeViewComponent, never>;
542
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiTreeViewComponent, "si-tree-view", never, { "contextMenuItems": { "alias": "contextMenuItems"; "required": false; "isSignal": true; }; "childrenIndentation": { "alias": "childrenIndentation"; "required": false; "isSignal": true; }; "horizontalScrolling": { "alias": "horizontalScrolling"; "required": false; "isSignal": true; }; "compactMode": { "alias": "compactMode"; "required": false; "isSignal": true; }; "expandCollapseAll": { "alias": "expandCollapseAll"; "required": false; "isSignal": true; }; "expandAllTooltip": { "alias": "expandAllTooltip"; "required": false; "isSignal": true; }; "collapseAllTooltip": { "alias": "collapseAllTooltip"; "required": false; "isSignal": true; }; "icons": { "alias": "icons"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pagesVirtualized": { "alias": "pagesVirtualized"; "required": false; "isSignal": true; }; "folderStateStart": { "alias": "folderStateStart"; "required": false; "isSignal": true; }; "isVirtualized": { "alias": "isVirtualized"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "selectedItem": { "alias": "selectedItem"; "required": false; "isSignal": true; }; "singleSelectMode": { "alias": "singleSelectMode"; "required": false; "isSignal": true; }; "enableDataField1": { "alias": "enableDataField1"; "required": false; "isSignal": true; }; "enableDataField2": { "alias": "enableDataField2"; "required": false; "isSignal": true; }; "enableStateIndicator": { "alias": "enableStateIndicator"; "required": false; "isSignal": true; }; "enableIcon": { "alias": "enableIcon"; "required": false; "isSignal": true; }; "enableContextMenuButton": { "alias": "enableContextMenuButton"; "required": false; "isSignal": true; }; "enableSelection": { "alias": "enableSelection"; "required": false; "isSignal": true; }; "deleteChildrenOnCollapse": { "alias": "deleteChildrenOnCollapse"; "required": false; "isSignal": true; }; "flatTree": { "alias": "flatTree"; "required": false; "isSignal": true; }; "groupedList": { "alias": "groupedList"; "required": false; "isSignal": true; }; "enableCheckbox": { "alias": "enableCheckbox"; "required": false; "isSignal": true; }; "enableOptionbox": { "alias": "enableOptionbox"; "required": false; "isSignal": true; }; "expandOnClick": { "alias": "expandOnClick"; "required": false; "isSignal": true; }; "inheritChecked": { "alias": "inheritChecked"; "required": false; "isSignal": true; }; "noActionsString": { "alias": "noActionsString"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; }, { "itemsVirtualizedChanged": "itemsVirtualizedChanged"; "treeItemFolderClicked": "treeItemFolderClicked"; "treeItemFolderStateChanged": "treeItemFolderStateChanged"; "treeItemClicked": "treeItemClicked"; "treeItemCheckboxClicked": "treeItemCheckboxClicked"; "loadChildren": "loadChildren"; "treeItemsSelected": "treeItemsSelected"; }, ["templates", "treeItemContentTemplate", "nextItems"], ["[cdkDropList], [siTreeViewItem]"], true, never>;
552
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiTreeViewComponent, "si-tree-view", never, { "contextMenuItems": { "alias": "contextMenuItems"; "required": false; "isSignal": true; }; "childrenIndentation": { "alias": "childrenIndentation"; "required": false; "isSignal": true; }; "horizontalScrolling": { "alias": "horizontalScrolling"; "required": false; "isSignal": true; }; "compactMode": { "alias": "compactMode"; "required": false; "isSignal": true; }; "expandCollapseAll": { "alias": "expandCollapseAll"; "required": false; "isSignal": true; }; "expandAllTooltip": { "alias": "expandAllTooltip"; "required": false; "isSignal": true; }; "collapseAllTooltip": { "alias": "collapseAllTooltip"; "required": false; "isSignal": true; }; "icons": { "alias": "icons"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pagesVirtualized": { "alias": "pagesVirtualized"; "required": false; "isSignal": true; }; "folderStateStart": { "alias": "folderStateStart"; "required": false; "isSignal": true; }; "isVirtualized": { "alias": "isVirtualized"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "trackBy": { "alias": "trackBy"; "required": false; "isSignal": true; }; "selectedItem": { "alias": "selectedItem"; "required": false; "isSignal": true; }; "singleSelectMode": { "alias": "singleSelectMode"; "required": false; "isSignal": true; }; "enableDataField1": { "alias": "enableDataField1"; "required": false; "isSignal": true; }; "enableDataField2": { "alias": "enableDataField2"; "required": false; "isSignal": true; }; "enableStateIndicator": { "alias": "enableStateIndicator"; "required": false; "isSignal": true; }; "enableIcon": { "alias": "enableIcon"; "required": false; "isSignal": true; }; "enableContextMenuButton": { "alias": "enableContextMenuButton"; "required": false; "isSignal": true; }; "enableSelection": { "alias": "enableSelection"; "required": false; "isSignal": true; }; "deleteChildrenOnCollapse": { "alias": "deleteChildrenOnCollapse"; "required": false; "isSignal": true; }; "flatTree": { "alias": "flatTree"; "required": false; "isSignal": true; }; "groupedList": { "alias": "groupedList"; "required": false; "isSignal": true; }; "enableCheckbox": { "alias": "enableCheckbox"; "required": false; "isSignal": true; }; "enableOptionbox": { "alias": "enableOptionbox"; "required": false; "isSignal": true; }; "expandOnClick": { "alias": "expandOnClick"; "required": false; "isSignal": true; }; "inheritChecked": { "alias": "inheritChecked"; "required": false; "isSignal": true; }; "noActionsString": { "alias": "noActionsString"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; }, { "itemsVirtualizedChanged": "itemsVirtualizedChanged"; "treeItemFolderClicked": "treeItemFolderClicked"; "treeItemFolderStateChanged": "treeItemFolderStateChanged"; "treeItemClicked": "treeItemClicked"; "treeItemCheckboxClicked": "treeItemCheckboxClicked"; "loadChildren": "loadChildren"; "treeItemsSelected": "treeItemsSelected"; }, ["templates", "treeItemContentTemplate", "nextItems"], ["[cdkDropList], [siTreeViewItem]"], true, never>;
543
553
  }
544
554
 
545
555
  /**
@@ -749,6 +759,7 @@ declare class SiTreeViewItemDirective implements AfterViewInit, OnDestroy {
749
759
  private differs;
750
760
  private cdRef;
751
761
  private differ;
762
+ private trackBy?;
752
763
  private subscription;
753
764
  private itemsVirtualizedDirty;
754
765
  ngAfterViewInit(): void;