@siemens/element-ng 48.0.0-next.2 → 48.0.0-next.3

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

@@ -1 +1 @@
-{"version":3,"file":"siemens-element-ng-tabs.mjs","sources":["../../../../projects/element-ng/tabs/si-tab/si-tab.component.ts","../../../../projects/element-ng/tabs/si-tabset/si-tabset.component.ts","../../../../projects/element-ng/tabs/si-tabset/si-tabset.component.html","../../../../projects/element-ng/tabs/si-tabset/index.ts","../../../../projects/element-ng/tabs/si-tab/index.ts","../../../../projects/element-ng/tabs/si-tabs.module.ts","../../../../projects/element-ng/tabs/index.ts","../../../../projects/element-ng/tabs/siemens-element-ng-tabs.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\n/* eslint-disable @angular-eslint/prefer-output-emitter-ref */\nimport {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  EventEmitter,\n  HostBinding,\n  Input,\n  OnChanges,\n  Output,\n  signal\n} from '@angular/core';\nimport { TranslatableString } from '@siemens/element-translate-ng/translate';\n\nimport { SiTabsetComponent } from '../si-tabset/index';\n\n@Component({\n  selector: 'si-tab',\n  template: '<ng-content />',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    role: 'tabpanel'\n  }\n})\nexport class SiTabComponent implements OnChanges {\n  private static idCounter = 0;\n  /** Title of the tab item. */\n  @Input() heading?: TranslatableString;\n  /** Icon of the tab item. */\n  @Input() icon?: string;\n  /** Alternative name or translation key for icon. Used for A11y. */\n  @Input() iconAltText?: TranslatableString;\n  /**\n   * Additional badge content. A value of\n   * - `true` will render a red dot\n   * - any string without a `badgeColor` will render a red dot with text\n   * - any string with a `badgeColor` will render a normal badge\n   */\n  @Input() badgeContent?: TranslatableString | boolean;\n  /**\n   * Background color of the badge.\n   * If no color is provided a red dot badge will be rendered.\n   */\n  @Input() badgeColor?: string;\n  /**\n   * Disables the tab.\n   *\n   * @defaultValue false\n   */\n  @Input({ transform: booleanAttribute }) disabled = false;\n  /**\n   * Close the current tab.\n   *\n   * @defaultValue false\n   */\n  @Input({ transform: booleanAttribute }) closable? = false;\n  /** Event emitter to notify when a tab is closed. */\n  @Output() readonly closeTriggered = new EventEmitter<SiTabComponent>();\n\n  /** @internal */\n  @HostBinding('id') id = `__si-tab-panel-${SiTabComponent.idCounter++}`;\n  /** @internal */\n  @HostBinding('attr.aria-labelledby') tabId = `__si-tab-${SiTabComponent.idCounter}`;\n\n  @HostBinding('attr.hidden')\n  protected get isHidden(): boolean | null {\n    return !this.active() ? true : null;\n  }\n\n  private parent?: SiTabsetComponent;\n\n  /** @internal */\n  readonly active = signal(false);\n\n  /** @internal */\n  registerParent(parent: SiTabsetComponent): void {\n    this.parent = parent;\n  }\n\n  ngOnChanges(): void {\n    this.parent?.notifyChildrenChanged();\n  }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\n/* eslint-disable @angular-eslint/prefer-output-emitter-ref */\nimport { NgClass } from '@angular/common';\nimport {\n  AfterViewInit,\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ContentChildren,\n  ElementRef,\n  EventEmitter,\n  inject,\n  Input,\n  OnDestroy,\n  Output,\n  QueryList,\n  viewChild,\n  viewChildren\n} from '@angular/core';\nimport { isRTL, WebComponentContentChildren } from '@siemens/element-ng/common';\nimport {\n  addIcons,\n  elementCancel,\n  elementLeft3,\n  elementRight3,\n  SiIconNextComponent\n} from '@siemens/element-ng/icon';\nimport { SiResizeObserverDirective } from '@siemens/element-ng/resize-observer';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\nimport { asyncScheduler, Subscription } from 'rxjs';\nimport { first, observeOn } from 'rxjs/operators';\n\nimport { SiTabComponent } from '../si-tab/si-tab.component';\n\nexport interface SiTabDeselectionEvent {\n  /**\n   * The target tab\n   */\n  target: SiTabComponent;\n  /**\n   * The index of target tab\n   */\n  tabIndex: number;\n  /**\n   * To be called to prevent switching the tab\n   */\n  cancel: () => void;\n}\n\nconst SCROLL_INCREMENT = 55;\n\n@Component({\n  selector: 'si-tabset',\n  imports: [NgClass, SiIconNextComponent, SiResizeObserverDirective, SiTranslatePipe],\n  templateUrl: './si-tabset.component.html',\n  styleUrl: './si-tabset.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiTabsetComponent implements AfterViewInit, OnDestroy {\n  /**\n   * Contains the current tab components.\n   */\n  @WebComponentContentChildren(SiTabComponent)\n  @ContentChildren(SiTabComponent)\n  protected tabPanels!: QueryList<SiTabComponent>;\n\n  /**\n   * Component variable to indicate if scrolling is necessary or the container is big enough to display all tabs.\n   */\n  protected scrollable = false;\n\n  protected xPos = 0;\n  protected endArrowDisabled = false;\n  protected focusedTabIndex?: number;\n  protected readonly icons = addIcons({ elementCancel, elementLeft3, elementRight3 });\n\n  /**\n   * If selectDefaultTab is passed as 'false', this implies no default tab selection\n   * i.e. on initial load of tabset component no tab gets selected.\n   *\n   * @defaultValue true\n   */\n  @Input({ transform: booleanAttribute }) selectDefaultTab = true;\n\n  /**\n   * Sets a selected tab index. This will activate the tab of the provided\n   * index, activates the tab and fires a notification about the change.\n   * If index is passed as -1 i.e. `selectedTabIndex = -1`, this implies to clear all tab selection.\n   * @defaultref {@link _selectedTabIndex}\n   */\n  @Input()\n  set selectedTabIndex(tabIndex: number) {\n    if (this.initialized && this.tabPanels.get(tabIndex)) {\n      this.selectTab(this.tabPanels.get(tabIndex)!);\n    } else {\n      this.initTabIndex = tabIndex;\n    }\n  }\n\n  /**\n   * Returns the currently selected tab index.\n   */\n  get selectedTabIndex(): number {\n    return this.tabPanels?.toArray().findIndex(tab => tab.active());\n  }\n\n  /** Define an optional max-width in px for the tab buttons. The minimum value is `100`. */\n  @Input() tabButtonMaxWidth?: number;\n\n  /**\n   * Event emitter to notify about selected tab index changes. You can either\n   * use bi-directional binding with [(selectedTabIndex)] or separate both with\n   * [selectedTabIndex]=... and (selectedTabIndexChange)=...\n   */\n  @Output() readonly selectedTabIndexChange = new EventEmitter<number>();\n\n  /**\n   * Event emitter to notify when a tab became inactive.\n   */\n  @Output() readonly deselect = new EventEmitter<SiTabDeselectionEvent>();\n\n  private initTabIndex = 0;\n  private initialized = false;\n  private subscription?: Subscription;\n  private readonly tabContainer = viewChild.required<ElementRef>('tabContainer');\n  private readonly innerTabContainer =\n    viewChild.required<ElementRef<HTMLDivElement>>('innerTabContainer');\n  private readonly tabs = viewChildren<ElementRef<HTMLButtonElement>>('tabElement');\n  private changeDetectorRef = inject(ChangeDetectorRef);\n\n  ngAfterViewInit(): void {\n    this.initialized = true;\n    this.subscription = this.tabPanels.changes.subscribe(() => {\n      this.tabPanels.forEach(tab => tab.registerParent(this));\n      this.changeDetectorRef.markForCheck();\n    });\n    this.tabPanels.notifyOnChanges();\n\n    if (this.selectDefaultTab) {\n      if (this.tabPanels.length) {\n        queueMicrotask(() => this.selectTab(this.tabPanels.get(this.initTabIndex)!));\n      } else {\n        // no tabs are there yet. But maybe there will be some soon, so let's wait for it\n        this.subscription.add(\n          this.tabPanels.changes\n            .pipe(\n              first(() => !!this.tabPanels.length),\n              observeOn(asyncScheduler)\n            )\n            .subscribe(() => {\n              this.selectTab(this.tabPanels.get(this.initTabIndex)!);\n              this.changeDetectorRef.markForCheck();\n            })\n        );\n      }\n    }\n\n    setTimeout(() => {\n      this.resize();\n    });\n  }\n\n  ngOnDestroy(): void {\n    this.subscription?.unsubscribe();\n    this.subscription = undefined as any;\n  }\n\n  /** @internal */\n  notifyChildrenChanged(): void {\n    this.changeDetectorRef.markForCheck();\n  }\n\n  protected isTabFocusable(index: number): boolean {\n    const tab = this.tabPanels.get(index)!;\n    return !tab.disabled;\n  }\n\n  protected focusNext(): void {\n    do {\n      this.focusedTabIndex = (this.focusedTabIndex ?? 0) + 1;\n      if (this.focusedTabIndex >= this.tabs().length) {\n        this.focusedTabIndex = 0;\n      }\n    } while (!this.isTabFocusable(this.focusedTabIndex));\n    this.tabs().at(this.focusedTabIndex!)!.nativeElement.focus();\n  }\n\n  protected focusPrevious(): void {\n    do {\n      this.focusedTabIndex = (this.focusedTabIndex ?? 0) - 1;\n      if (this.focusedTabIndex < 0) {\n        this.focusedTabIndex += this.tabs().length;\n      }\n    } while (!this.isTabFocusable(this.focusedTabIndex));\n    this.tabs().at(this.focusedTabIndex!)!.nativeElement.focus();\n  }\n\n  protected resize(): void {\n    this.scrollable =\n      Math.round(this.tabContainer().nativeElement.offsetWidth) <\n      this.innerTabContainer().nativeElement.scrollWidth;\n    this.scroll(0);\n  }\n\n  /**\n   * Finds the index of the provided tab and sets the index as new selected tab index\n   *\n   * @param selectedTab - The tab to be selected. This must already be part of the container.\n   */\n  protected selectTab(selectedTab: SiTabComponent): void {\n    if (selectedTab?.disabled) {\n      return;\n    }\n    const tabs = this.tabPanels.toArray();\n    const newTabIndex = tabs.indexOf(selectedTab);\n    const currentTabIndex = tabs.findIndex(tab => tab.active());\n    let continueWithSelection = newTabIndex !== currentTabIndex;\n\n    if (continueWithSelection && currentTabIndex !== -1) {\n      const currentTab = tabs[currentTabIndex];\n      const deselectEvent: SiTabDeselectionEvent = {\n        target: currentTab,\n        tabIndex: currentTabIndex,\n        cancel: () => {\n          continueWithSelection = false;\n          currentTab.active.set(true);\n        }\n      };\n\n      currentTab.active.set(false);\n      this.deselect.emit(deselectEvent);\n    }\n\n    if (continueWithSelection) {\n      selectedTab.active.set(true);\n      this.changeDetectorRef.markForCheck();\n      this.selectedTabIndexChange.emit(newTabIndex);\n    }\n  }\n\n  /**\n   * Scrolls the tab headers to the end (right in LTR).\n   */\n  protected scrollEnd(): void {\n    this.scroll(SCROLL_INCREMENT);\n  }\n\n  /**\n   * Scrolls the tab headers to the start (left in LTR).\n   */\n  protected scrollStart(): void {\n    this.scroll(-SCROLL_INCREMENT);\n  }\n\n  private scroll(inc: number): void {\n    this.xPos += inc;\n    this.xPos = Math.max(\n      0,\n      Math.min(\n        this.innerTabContainer().nativeElement.scrollWidth -\n          this.innerTabContainer().nativeElement.offsetWidth,\n        this.xPos\n      )\n    );\n\n    this.endArrowDisabled =\n      this.xPos + this.tabContainer().nativeElement.offsetWidth >=\n      this.innerTabContainer().nativeElement.scrollWidth;\n\n    this.innerTabContainer().nativeElement.style.transform = `translateX(${\n      this.xPos * (isRTL() ? 1 : -1)\n    }px)`;\n  }\n\n  protected mouseScroll(event: WheelEvent): void {\n    if (event.deltaY < 0) {\n      this.scroll(-SCROLL_INCREMENT);\n    } else {\n      this.scroll(SCROLL_INCREMENT);\n    }\n\n    if (this.xPos || !this.endArrowDisabled) {\n      event.preventDefault();\n    }\n  }\n\n  /** @internal */\n  focus(index: number): void {\n    this.focusedTabIndex = index;\n  }\n\n  /** @internal */\n  blur(): void {\n    this.focusedTabIndex = undefined;\n  }\n\n  protected closeTab(event: MouseEvent, tab: SiTabComponent): void {\n    event.stopPropagation();\n    let targetActiveTab: SiTabComponent | undefined;\n    if (tab.active()) {\n      const index = this.tabPanels.toArray().indexOf(tab);\n      targetActiveTab = this.tabPanels.toArray()[index + 1] ?? this.tabPanels.toArray()[index - 1];\n      if (targetActiveTab) {\n        this.selectTab(targetActiveTab);\n      }\n    } else {\n      targetActiveTab = this.tabPanels.find(otherTabs => otherTabs.active());\n    }\n\n    if (targetActiveTab) {\n      // The focus will always get the next element due browser behavior.\n      // Setting it to the active element solves this.\n      setTimeout(() => {\n        this.tabs().at(this.tabPanels.toArray().indexOf(targetActiveTab))!.nativeElement.focus();\n      });\n    }\n    tab.closeTriggered.emit(tab);\n    this.focusedTabIndex = undefined;\n  }\n}\n","<div\n  class=\"nav nav-tabs tab-container-header focus-inside\"\n  role=\"tablist\"\n  [class.is-scrollable]=\"scrollable\"\n  (siResizeObserver)=\"resize()\"\n>\n  @if (scrollable) {\n    <button\n      type=\"button\"\n      class=\"tab-container-control focus-inside\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      [hidden]=\"!xPos\"\n      (keydown.enter)=\"scrollStart()\"\n      (mousedown)=\"scrollStart()\"\n    >\n      <si-icon-next class=\"icon flip-rtl\" [icon]=\"icons.elementLeft3\" />\n    </button>\n  }\n\n  <div #tabContainer class=\"tab-container-buttonbar\" (wheel)=\"mouseScroll($event)\">\n    <div #innerTabContainer class=\"tab-container-buttonbar-list focus-inside\">\n      @for (tab of tabPanels; track $index) {\n        <button\n          #tabElement\n          type=\"button\"\n          role=\"tab\"\n          class=\"nav-link focus-inside px-5\"\n          [class.pe-3]=\"tab.closable\"\n          [attr.aria-controls]=\"tab.id\"\n          [id]=\"tab.tabId\"\n          [style.max-width.px]=\"tabButtonMaxWidth\"\n          [tabindex]=\"!tab.disabled && tab.active() && focusedTabIndex === undefined ? 0 : -1\"\n          [class.active]=\"tab.active()\"\n          [attr.aria-selected]=\"tab.active()\"\n          [class.disabled]=\"tab.disabled\"\n          (click)=\"selectTab(tab)\"\n          (keydown.arrowLeft)=\"focusPrevious()\"\n          (keydown.arrowRight)=\"focusNext()\"\n          (keydown.delete)=\"tab.closeTriggered.emit(tab)\"\n          (blur)=\"blur()\"\n          (focus)=\"focus($index)\"\n        >\n          <span class=\"text-truncate\">{{ tab.heading | translate }}</span>\n          @if (tab.icon) {\n            <si-icon-next\n              class=\"icon\"\n              [attr.role]=\"tab.iconAltText ? 'img' : 'presentation'\"\n              [icon]=\"tab.icon\"\n              [attr.aria-label]=\"(tab.iconAltText | translate) ?? undefined\"\n            />\n          }\n          @if (tab.badgeContent === true) {\n            <span class=\"badge-dot\"></span>\n          } @else if (tab.badgeContent && tab.badgeColor) {\n            <span class=\"badge\" [ngClass]=\"'bg-' + tab.badgeColor\">\n              {{ tab.badgeContent | translate }}\n            </span>\n          } @else if (tab.badgeContent && !tab.badgeColor) {\n            <span class=\"badge-text\"> {{ tab.badgeContent | translate }}</span>\n          }\n          @if (tab.closable && !tab.disabled) {\n            <si-icon-next\n              class=\"ms-2 btn btn-circle btn-xs btn-ghost close\"\n              [icon]=\"icons.elementCancel\"\n              (click)=\"closeTab($event, tab)\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n  @if (scrollable) {\n    <button\n      type=\"button\"\n      class=\"tab-container-control is-end focus-inside\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      [hidden]=\"endArrowDisabled\"\n      (keydown.enter)=\"scrollEnd()\"\n      (mousedown)=\"scrollEnd()\"\n    >\n      <si-icon-next class=\"icon flip-rtl\" [icon]=\"icons.elementRight3\" />\n    </button>\n  }\n</div>\n\n<ng-content />\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-tabset.component';\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-tab.component';\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiTabComponent } from './si-tab/si-tab.component';\nimport { SiTabsetComponent } from './si-tabset/si-tabset.component';\n\nconst components = [SiTabsetComponent, SiTabComponent];\n@NgModule({\n  imports: components,\n  exports: components\n})\nexport class SiTabsModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-tabset/index';\nexport * from './si-tab/index';\nexport * from './si-tabs.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"siemens-element-ng-tabs.mjs","sources":["../../../../projects/element-ng/tabs/si-tab/si-tab.component.ts","../../../../projects/element-ng/tabs/si-tabset/si-tabset.component.ts","../../../../projects/element-ng/tabs/si-tabset/si-tabset.component.html","../../../../projects/element-ng/tabs/si-tabset/index.ts","../../../../projects/element-ng/tabs/si-tab/index.ts","../../../../projects/element-ng/tabs/si-tabs.module.ts","../../../../projects/element-ng/tabs/index.ts","../../../../projects/element-ng/tabs/siemens-element-ng-tabs.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\n/* eslint-disable @angular-eslint/prefer-output-emitter-ref */\nimport {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  EventEmitter,\n  HostBinding,\n  Input,\n  OnChanges,\n  Output,\n  signal\n} from '@angular/core';\nimport { TranslatableString } from '@siemens/element-translate-ng/translate';\n\nimport { SiTabsetComponent } from '../si-tabset/index';\n\n@Component({\n  selector: 'si-tab',\n  template: '<ng-content />',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    role: 'tabpanel'\n  }\n})\nexport class SiTabComponent implements OnChanges {\n  private static idCounter = 0;\n  /** Title of the tab item. */\n  @Input() heading?: TranslatableString;\n  /** Icon of the tab item. */\n  @Input() icon?: string;\n  /** Alternative name or translation key for icon. Used for A11y. */\n  @Input() iconAltText?: TranslatableString;\n  /**\n   * Additional badge content. A value of\n   * - `true` will render a red dot\n   * - any string without a `badgeColor` will render a red dot with text\n   * - any string with a `badgeColor` will render a normal badge\n   */\n  @Input() badgeContent?: TranslatableString | boolean;\n  /**\n   * Background color of the badge.\n   * If no color is provided a red dot badge will be rendered.\n   */\n  @Input() badgeColor?: string;\n  /**\n   * Disables the tab.\n   *\n   * @defaultValue false\n   */\n  @Input({ transform: booleanAttribute }) disabled = false;\n  /**\n   * Close the current tab.\n   *\n   * @defaultValue false\n   */\n  @Input({ transform: booleanAttribute }) closable? = false;\n  /** Event emitter to notify when a tab is closed. */\n  @Output() readonly closeTriggered = new EventEmitter<SiTabComponent>();\n\n  /** @internal */\n  @HostBinding('id') id = `__si-tab-panel-${SiTabComponent.idCounter++}`;\n  /** @internal */\n  @HostBinding('attr.aria-labelledby') tabId = `__si-tab-${SiTabComponent.idCounter}`;\n\n  @HostBinding('attr.hidden')\n  protected get isHidden(): boolean | null {\n    return !this.active() ? true : null;\n  }\n\n  private parent?: SiTabsetComponent;\n\n  /** @internal */\n  readonly active = signal(false);\n\n  /** @internal */\n  registerParent(parent: SiTabsetComponent): void {\n    this.parent = parent;\n  }\n\n  ngOnChanges(): void {\n    this.parent?.notifyChildrenChanged();\n  }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\n/* eslint-disable @angular-eslint/prefer-output-emitter-ref */\nimport { NgClass } from '@angular/common';\nimport {\n  AfterViewInit,\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ContentChildren,\n  ElementRef,\n  EventEmitter,\n  inject,\n  Input,\n  OnDestroy,\n  Output,\n  QueryList,\n  viewChild,\n  viewChildren\n} from '@angular/core';\nimport { isRTL, WebComponentContentChildren } from '@siemens/element-ng/common';\nimport {\n  addIcons,\n  elementCancel,\n  elementLeft3,\n  elementRight3,\n  SiIconComponent\n} from '@siemens/element-ng/icon';\nimport { SiResizeObserverDirective } from '@siemens/element-ng/resize-observer';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\nimport { asyncScheduler, Subscription } from 'rxjs';\nimport { first, observeOn } from 'rxjs/operators';\n\nimport { SiTabComponent } from '../si-tab/si-tab.component';\n\nexport interface SiTabDeselectionEvent {\n  /**\n   * The target tab\n   */\n  target: SiTabComponent;\n  /**\n   * The index of target tab\n   */\n  tabIndex: number;\n  /**\n   * To be called to prevent switching the tab\n   */\n  cancel: () => void;\n}\n\nconst SCROLL_INCREMENT = 55;\n\n@Component({\n  selector: 'si-tabset',\n  imports: [NgClass, SiIconComponent, SiResizeObserverDirective, SiTranslatePipe],\n  templateUrl: './si-tabset.component.html',\n  styleUrl: './si-tabset.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiTabsetComponent implements AfterViewInit, OnDestroy {\n  /**\n   * Contains the current tab components.\n   */\n  @WebComponentContentChildren(SiTabComponent)\n  @ContentChildren(SiTabComponent)\n  protected tabPanels!: QueryList<SiTabComponent>;\n\n  /**\n   * Component variable to indicate if scrolling is necessary or the container is big enough to display all tabs.\n   */\n  protected scrollable = false;\n\n  protected xPos = 0;\n  protected endArrowDisabled = false;\n  protected focusedTabIndex?: number;\n  protected readonly icons = addIcons({ elementCancel, elementLeft3, elementRight3 });\n\n  /**\n   * If selectDefaultTab is passed as 'false', this implies no default tab selection\n   * i.e. on initial load of tabset component no tab gets selected.\n   *\n   * @defaultValue true\n   */\n  @Input({ transform: booleanAttribute }) selectDefaultTab = true;\n\n  /**\n   * Sets a selected tab index. This will activate the tab of the provided\n   * index, activates the tab and fires a notification about the change.\n   * If index is passed as -1 i.e. `selectedTabIndex = -1`, this implies to clear all tab selection.\n   * @defaultref {@link _selectedTabIndex}\n   */\n  @Input()\n  set selectedTabIndex(tabIndex: number) {\n    if (this.initialized && this.tabPanels.get(tabIndex)) {\n      this.selectTab(this.tabPanels.get(tabIndex)!);\n    } else {\n      this.initTabIndex = tabIndex;\n    }\n  }\n\n  /**\n   * Returns the currently selected tab index.\n   */\n  get selectedTabIndex(): number {\n    return this.tabPanels?.toArray().findIndex(tab => tab.active());\n  }\n\n  /** Define an optional max-width in px for the tab buttons. The minimum value is `100`. */\n  @Input() tabButtonMaxWidth?: number;\n\n  /**\n   * Event emitter to notify about selected tab index changes. You can either\n   * use bi-directional binding with [(selectedTabIndex)] or separate both with\n   * [selectedTabIndex]=... and (selectedTabIndexChange)=...\n   */\n  @Output() readonly selectedTabIndexChange = new EventEmitter<number>();\n\n  /**\n   * Event emitter to notify when a tab became inactive.\n   */\n  @Output() readonly deselect = new EventEmitter<SiTabDeselectionEvent>();\n\n  private initTabIndex = 0;\n  private initialized = false;\n  private subscription?: Subscription;\n  private readonly tabContainer = viewChild.required<ElementRef>('tabContainer');\n  private readonly innerTabContainer =\n    viewChild.required<ElementRef<HTMLDivElement>>('innerTabContainer');\n  private readonly tabs = viewChildren<ElementRef<HTMLButtonElement>>('tabElement');\n  private changeDetectorRef = inject(ChangeDetectorRef);\n\n  ngAfterViewInit(): void {\n    this.initialized = true;\n    this.subscription = this.tabPanels.changes.subscribe(() => {\n      this.tabPanels.forEach(tab => tab.registerParent(this));\n      this.changeDetectorRef.markForCheck();\n    });\n    this.tabPanels.notifyOnChanges();\n\n    if (this.selectDefaultTab) {\n      if (this.tabPanels.length) {\n        queueMicrotask(() => this.selectTab(this.tabPanels.get(this.initTabIndex)!));\n      } else {\n        // no tabs are there yet. But maybe there will be some soon, so let's wait for it\n        this.subscription.add(\n          this.tabPanels.changes\n            .pipe(\n              first(() => !!this.tabPanels.length),\n              observeOn(asyncScheduler)\n            )\n            .subscribe(() => {\n              this.selectTab(this.tabPanels.get(this.initTabIndex)!);\n              this.changeDetectorRef.markForCheck();\n            })\n        );\n      }\n    }\n\n    setTimeout(() => {\n      this.resize();\n    });\n  }\n\n  ngOnDestroy(): void {\n    this.subscription?.unsubscribe();\n    this.subscription = undefined as any;\n  }\n\n  /** @internal */\n  notifyChildrenChanged(): void {\n    this.changeDetectorRef.markForCheck();\n  }\n\n  protected isTabFocusable(index: number): boolean {\n    const tab = this.tabPanels.get(index)!;\n    return !tab.disabled;\n  }\n\n  protected focusNext(): void {\n    do {\n      this.focusedTabIndex = (this.focusedTabIndex ?? 0) + 1;\n      if (this.focusedTabIndex >= this.tabs().length) {\n        this.focusedTabIndex = 0;\n      }\n    } while (!this.isTabFocusable(this.focusedTabIndex));\n    this.tabs().at(this.focusedTabIndex!)!.nativeElement.focus();\n  }\n\n  protected focusPrevious(): void {\n    do {\n      this.focusedTabIndex = (this.focusedTabIndex ?? 0) - 1;\n      if (this.focusedTabIndex < 0) {\n        this.focusedTabIndex += this.tabs().length;\n      }\n    } while (!this.isTabFocusable(this.focusedTabIndex));\n    this.tabs().at(this.focusedTabIndex!)!.nativeElement.focus();\n  }\n\n  protected resize(): void {\n    this.scrollable =\n      Math.round(this.tabContainer().nativeElement.offsetWidth) <\n      this.innerTabContainer().nativeElement.scrollWidth;\n    this.scroll(0);\n  }\n\n  /**\n   * Finds the index of the provided tab and sets the index as new selected tab index\n   *\n   * @param selectedTab - The tab to be selected. This must already be part of the container.\n   */\n  protected selectTab(selectedTab: SiTabComponent): void {\n    if (selectedTab?.disabled) {\n      return;\n    }\n    const tabs = this.tabPanels.toArray();\n    const newTabIndex = tabs.indexOf(selectedTab);\n    const currentTabIndex = tabs.findIndex(tab => tab.active());\n    let continueWithSelection = newTabIndex !== currentTabIndex;\n\n    if (continueWithSelection && currentTabIndex !== -1) {\n      const currentTab = tabs[currentTabIndex];\n      const deselectEvent: SiTabDeselectionEvent = {\n        target: currentTab,\n        tabIndex: currentTabIndex,\n        cancel: () => {\n          continueWithSelection = false;\n          currentTab.active.set(true);\n        }\n      };\n\n      currentTab.active.set(false);\n      this.deselect.emit(deselectEvent);\n    }\n\n    if (continueWithSelection) {\n      selectedTab.active.set(true);\n      this.changeDetectorRef.markForCheck();\n      this.selectedTabIndexChange.emit(newTabIndex);\n    }\n  }\n\n  /**\n   * Scrolls the tab headers to the end (right in LTR).\n   */\n  protected scrollEnd(): void {\n    this.scroll(SCROLL_INCREMENT);\n  }\n\n  /**\n   * Scrolls the tab headers to the start (left in LTR).\n   */\n  protected scrollStart(): void {\n    this.scroll(-SCROLL_INCREMENT);\n  }\n\n  private scroll(inc: number): void {\n    this.xPos += inc;\n    this.xPos = Math.max(\n      0,\n      Math.min(\n        this.innerTabContainer().nativeElement.scrollWidth -\n          this.innerTabContainer().nativeElement.offsetWidth,\n        this.xPos\n      )\n    );\n\n    this.endArrowDisabled =\n      this.xPos + this.tabContainer().nativeElement.offsetWidth >=\n      this.innerTabContainer().nativeElement.scrollWidth;\n\n    this.innerTabContainer().nativeElement.style.transform = `translateX(${\n      this.xPos * (isRTL() ? 1 : -1)\n    }px)`;\n  }\n\n  protected mouseScroll(event: WheelEvent): void {\n    if (event.deltaY < 0) {\n      this.scroll(-SCROLL_INCREMENT);\n    } else {\n      this.scroll(SCROLL_INCREMENT);\n    }\n\n    if (this.xPos || !this.endArrowDisabled) {\n      event.preventDefault();\n    }\n  }\n\n  /** @internal */\n  focus(index: number): void {\n    this.focusedTabIndex = index;\n  }\n\n  /** @internal */\n  blur(): void {\n    this.focusedTabIndex = undefined;\n  }\n\n  protected closeTab(event: MouseEvent, tab: SiTabComponent): void {\n    event.stopPropagation();\n    let targetActiveTab: SiTabComponent | undefined;\n    if (tab.active()) {\n      const index = this.tabPanels.toArray().indexOf(tab);\n      targetActiveTab = this.tabPanels.toArray()[index + 1] ?? this.tabPanels.toArray()[index - 1];\n      if (targetActiveTab) {\n        this.selectTab(targetActiveTab);\n      }\n    } else {\n      targetActiveTab = this.tabPanels.find(otherTabs => otherTabs.active());\n    }\n\n    if (targetActiveTab) {\n      // The focus will always get the next element due browser behavior.\n      // Setting it to the active element solves this.\n      setTimeout(() => {\n        this.tabs().at(this.tabPanels.toArray().indexOf(targetActiveTab))!.nativeElement.focus();\n      });\n    }\n    tab.closeTriggered.emit(tab);\n    this.focusedTabIndex = undefined;\n  }\n}\n","<div\n  class=\"nav nav-tabs tab-container-header focus-inside\"\n  role=\"tablist\"\n  [class.is-scrollable]=\"scrollable\"\n  (siResizeObserver)=\"resize()\"\n>\n  @if (scrollable) {\n    <button\n      type=\"button\"\n      class=\"tab-container-control focus-inside\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      [hidden]=\"!xPos\"\n      (keydown.enter)=\"scrollStart()\"\n      (mousedown)=\"scrollStart()\"\n    >\n      <si-icon class=\"icon flip-rtl\" [icon]=\"icons.elementLeft3\" />\n    </button>\n  }\n\n  <div #tabContainer class=\"tab-container-buttonbar\" (wheel)=\"mouseScroll($event)\">\n    <div #innerTabContainer class=\"tab-container-buttonbar-list focus-inside\">\n      @for (tab of tabPanels; track $index) {\n        <button\n          #tabElement\n          type=\"button\"\n          role=\"tab\"\n          class=\"nav-link focus-inside px-5\"\n          [class.pe-3]=\"tab.closable\"\n          [attr.aria-controls]=\"tab.id\"\n          [id]=\"tab.tabId\"\n          [style.max-width.px]=\"tabButtonMaxWidth\"\n          [tabindex]=\"!tab.disabled && tab.active() && focusedTabIndex === undefined ? 0 : -1\"\n          [class.active]=\"tab.active()\"\n          [attr.aria-selected]=\"tab.active()\"\n          [class.disabled]=\"tab.disabled\"\n          (click)=\"selectTab(tab)\"\n          (keydown.arrowLeft)=\"focusPrevious()\"\n          (keydown.arrowRight)=\"focusNext()\"\n          (keydown.delete)=\"tab.closeTriggered.emit(tab)\"\n          (blur)=\"blur()\"\n          (focus)=\"focus($index)\"\n        >\n          <span class=\"text-truncate\">{{ tab.heading | translate }}</span>\n          @if (tab.icon) {\n            <si-icon\n              class=\"icon\"\n              [attr.role]=\"tab.iconAltText ? 'img' : 'presentation'\"\n              [icon]=\"tab.icon\"\n              [attr.aria-label]=\"(tab.iconAltText | translate) ?? undefined\"\n            />\n          }\n          @if (tab.badgeContent === true) {\n            <span class=\"badge-dot\"></span>\n          } @else if (tab.badgeContent && tab.badgeColor) {\n            <span class=\"badge\" [ngClass]=\"'bg-' + tab.badgeColor\">\n              {{ tab.badgeContent | translate }}\n            </span>\n          } @else if (tab.badgeContent && !tab.badgeColor) {\n            <span class=\"badge-text\"> {{ tab.badgeContent | translate }}</span>\n          }\n          @if (tab.closable && !tab.disabled) {\n            <si-icon\n              class=\"ms-2 btn btn-circle btn-xs btn-ghost close\"\n              [icon]=\"icons.elementCancel\"\n              (click)=\"closeTab($event, tab)\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n  @if (scrollable) {\n    <button\n      type=\"button\"\n      class=\"tab-container-control is-end focus-inside\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      [hidden]=\"endArrowDisabled\"\n      (keydown.enter)=\"scrollEnd()\"\n      (mousedown)=\"scrollEnd()\"\n    >\n      <si-icon class=\"icon flip-rtl\" [icon]=\"icons.elementRight3\" />\n    </button>\n  }\n</div>\n\n<ng-content />\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-tabset.component';\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-tab.component';\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiTabComponent } from './si-tab/si-tab.component';\nimport { SiTabsetComponent } from './si-tabset/si-tabset.component';\n\nconst components = [SiTabsetComponent, SiTabComponent];\n@NgModule({\n  imports: components,\n  exports: components\n})\nexport class SiTabsModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-tabset/index';\nexport * from './si-tab/index';\nexport * from './si-tabs.module';\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-threshold.mjs

@@ -3,7 +3,7 @@ import * as i0 from '@angular/core';
 import { input, computed, Component, model, booleanAttribute, output, viewChildren, NgModule } from '@angular/core';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
-import { SiIconNextComponent, addIcons, elementPlus } from '@siemens/element-ng/icon';
+import { SiIconComponent, addIcons, elementPlus } from '@siemens/element-ng/icon';
 import { SiNumberInputComponent } from '@siemens/element-ng/number-input';
 import { SiSelectComponent, SiSelectSingleValueDirective, SiSelectSimpleOptionsDirective } from '@siemens/element-ng/select';
 import { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';
@@ -39,38 +39,30 @@ class SiReadonlyThresholdOptionComponent {
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SiReadonlyThresholdOptionComponent, isStandalone: true, selector: "si-readonly-threshold-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "d-flex align-items-center py-2 my-4 px-4 si-title-2" }, ngImport: i0, template: `@let opt = option();
     @if (opt && opt.icon) {
       <i class="icon-stack">
-        <si-icon-next
+        <si-icon
           class="icon me-2"
           [icon]="opt.icon"
           [ngClass]="[(!opt.disabled && color()) || '']"
         />
         @if (opt.type === 'option' && opt.stackedIcon) {
-          <si-icon-next
-            class="icon me-2"
-            [icon]="opt.stackedIcon"
-            [ngClass]="opt.stackedIconColor"
-          />
+          <si-icon class="icon me-2" [icon]="opt.stackedIcon" [ngClass]="opt.stackedIconColor" />
         }
       </i>
     }
-    <span class="text-truncate">{{ label() | translate }}</span>`, isInline: true, styles: [":host{block-size:2rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }] });
+    <span class="text-truncate">{{ label() | translate }}</span>`, isInline: true, styles: [":host{block-size:2rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SiReadonlyThresholdOptionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-readonly-threshold-option', imports: [NgClass, SiTranslatePipe, SiIconNextComponent], template: `@let opt = option();
+            args: [{ selector: 'si-readonly-threshold-option', imports: [NgClass, SiTranslatePipe, SiIconComponent], template: `@let opt = option();
     @if (opt && opt.icon) {
       <i class="icon-stack">
-        <si-icon-next
+        <si-icon
           class="icon me-2"
           [icon]="opt.icon"
           [ngClass]="[(!opt.disabled && color()) || '']"
         />
         @if (opt.type === 'option' && opt.stackedIcon) {
-          <si-icon-next
-            class="icon me-2"
-            [icon]="opt.stackedIcon"
-            [ngClass]="opt.stackedIconColor"
-          />
+          <si-icon class="icon me-2" [icon]="opt.stackedIcon" [ngClass]="opt.stackedIconColor" />
         }
       </i>
     }
@@ -266,7 +258,7 @@ class SiThresholdComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SiThresholdComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SiThresholdComponent, isStandalone: true, selector: "si-threshold", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, thresholdSteps: { classPropertyName: "thresholdSteps", publicName: "thresholdSteps", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, stepSize: { classPropertyName: "stepSize", publicName: "stepSize", isSignal: true, isRequired: false, transformFunction: null }, maxSteps: { classPropertyName: "maxSteps", publicName: "maxSteps", isSignal: true, isRequired: false, transformFunction: null }, validation: { classPropertyName: "validation", publicName: "validation", isSignal: true, isRequired: false, transformFunction: null }, canAddRemoveSteps: { classPropertyName: "canAddRemoveSteps", publicName: "canAddRemoveSteps", isSignal: true, isRequired: false, transformFunction: null }, horizontalLayout: { classPropertyName: "horizontalLayout", publicName: "horizontalLayout", isSignal: true, isRequired: false, transformFunction: null }, showDecIncButtons: { classPropertyName: "showDecIncButtons", publicName: "showDecIncButtons", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, readonlyConditions: { classPropertyName: "readonlyConditions", publicName: "readonlyConditions", isSignal: true, isRequired: false, transformFunction: null }, deleteAriaLabel: { classPropertyName: "deleteAriaLabel", publicName: "deleteAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, addAriaLabel: { classPropertyName: "addAriaLabel", publicName: "addAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, inputAriaLabel: { classPropertyName: "inputAriaLabel", publicName: "inputAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, statusAriaLabel: { classPropertyName: "statusAriaLabel", publicName: "statusAriaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thresholdSteps: "thresholdStepsChange", validChange: "validChange" }, host: { properties: { "class.add-remove": "canAddRemoveSteps()", "class.horizontal": "horizontalLayout()", "class.dec-inc-buttons": "showDecIncButtons()" } }, viewQueries: [{ propertyName: "numberInputs", predicate: SiNumberInputComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "@for (step of thresholdSteps(); track step) {\n  <div class=\"ths-step\">\n    @if (!$first) {\n      <div class=\"ths-value d-flex align-items-center\">\n        @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n          <button\n            type=\"button\"\n            class=\"btn btn-circle btn-sm btn-ghost element-delete m-4\"\n            [attr.aria-label]=\"deleteAriaLabel() | translate\"\n            (click)=\"deleteStep($index)\"\n          ></button>\n        }\n        @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n          <div class=\"py-4 my-4\">&#8203;</div>\n        }\n        <div class=\"line\">\n          <div class=\"segment\" [ngClass]=\"colors()[$index - 1]\"></div>\n          <div class=\"dot\"></div>\n          <div class=\"segment\" [ngClass]=\"colors()[$index]\"></div>\n        </div>\n        <div class=\"d-flex align-items-center text-nowrap m-4\">\n          <si-number-input\n            #valueInput=\"ngModel\"\n            class=\"form-control text-end\"\n            [class.is-invalid]=\"step.valid === false\"\n            [aria-label]=\"inputAriaLabel() | translate\"\n            [readonly]=\"readonly()\"\n            [ngModelOptions]=\"{ standalone: true }\"\n            [min]=\"minValue()\"\n            [max]=\"maxValue()\"\n            [step]=\"stepSize()\"\n            [unit]=\"unit()\"\n            [showButtons]=\"showDecIncButtons()\"\n            [required]=\"true\"\n            [(ngModel)]=\"step.value\"\n            (ngModelChange)=\"stepChange()\"\n          />\n        </div>\n      </div>\n    }\n    @if ($first && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n    <div class=\"ths-option d-flex align-items-center\">\n      @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-circle btn-sm btn-secondary m-4\"\n          [disabled]=\"maxSteps() && $count >= maxSteps()\"\n          [attr.aria-label]=\"addAriaLabel() | translate\"\n          (click)=\"addStep($index)\"\n        >\n          <si-icon-next [icon]=\"icons.elementPlus\" />\n        </button>\n      }\n      @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n        <div class=\"py-4 my-4\">&#8203;</div>\n      }\n      <div class=\"line\" [ngClass]=\"colors()[$index]\">\n        <div class=\"segment\"></div>\n      </div>\n      @if (!readonly() && !readonlyConditions()) {\n        <si-select\n          class=\"my-4\"\n          [ariaLabel]=\"statusAriaLabel() | translate\"\n          [readonly]=\"readonly()\"\n          [options]=\"options()\"\n          [(value)]=\"step.optionValue\"\n          (valueChange)=\"stepChange()\"\n        />\n      }\n      @if (readonly() || readonlyConditions()) {\n        <si-readonly-threshold-option [options]=\"options()\" [value]=\"step.optionValue\" />\n      }\n    </div>\n    @if ($last && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n  </div>\n}\n\n<ng-template #startend let-color=\"color\">\n  <div class=\"ths-value d-flex align-items-center startend\">\n    <div class=\"py-4 my-4\">&#8203;</div>\n    <div class=\"line\">\n      <div class=\"segment\" [ngClass]=\"color\"></div>\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{--direction-main: column;--direction-option: row;--direction-value: row;--input-width: calc(var(--input-base-width, 90px) + var(--buttons-width, 0px))}:host.horizontal{--direction-main: row;--direction-option: column;--direction-value: column-reverse;--value-margin: -24px;padding-inline:calc(var(--value-margin) * -1)}:host.dec-inc-buttons{--buttons-width: 48px}:host,.ths-step{display:flex;flex-direction:var(--direction-main)}.ths-option{flex-direction:var(--direction-option);min-inline-size:var(--option-width, 160px)}.ths-value{flex-direction:var(--direction-value);margin-inline:var(--value-margin)}si-select{border-radius:var(--element-button-radius);overflow:hidden}.form-control{inline-size:var(--input-width);block-size:calc(1rem + 16px)}.line{align-self:stretch;flex-basis:16px;display:flex;flex-direction:var(--direction-main);align-items:center;color:var(--element-ui-2);gap:4px}.segment{flex:1;border:1px solid currentColor}.dot{inline-size:6px;block-size:6px;border:1px solid var(--element-ui-2);border-radius:50%}.startend{inline-size:calc(var(--input-width) / 2)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }, { kind: "component", type: SiNumberInputComponent, selector: "si-number-input", inputs: ["min", "max", "step", "value", "unit", "showButtons", "aria-label", "inputId", "disabled", "readonly", "placeholder"], outputs: ["valueChange"] }, { kind: "component", type: SiSelectComponent, selector: "si-select", inputs: ["id", "ariaLabel", "labelledby", "filterPlaceholder", "noResultsFoundLabel", "placeholder", "readonly", "hasFilter"], outputs: ["dropdownClose", "openChange"] }, { kind: "directive", type: SiSelectSingleValueDirective, selector: "si-select:not([multi])" }, { kind: "directive", type: SiSelectSimpleOptionsDirective, selector: "si-select[options]", inputs: ["options", "optionEqualCheckFn"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "component", type: SiReadonlyThresholdOptionComponent, selector: "si-readonly-threshold-option", inputs: ["value", "options"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SiThresholdComponent, isStandalone: true, selector: "si-threshold", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, thresholdSteps: { classPropertyName: "thresholdSteps", publicName: "thresholdSteps", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, stepSize: { classPropertyName: "stepSize", publicName: "stepSize", isSignal: true, isRequired: false, transformFunction: null }, maxSteps: { classPropertyName: "maxSteps", publicName: "maxSteps", isSignal: true, isRequired: false, transformFunction: null }, validation: { classPropertyName: "validation", publicName: "validation", isSignal: true, isRequired: false, transformFunction: null }, canAddRemoveSteps: { classPropertyName: "canAddRemoveSteps", publicName: "canAddRemoveSteps", isSignal: true, isRequired: false, transformFunction: null }, horizontalLayout: { classPropertyName: "horizontalLayout", publicName: "horizontalLayout", isSignal: true, isRequired: false, transformFunction: null }, showDecIncButtons: { classPropertyName: "showDecIncButtons", publicName: "showDecIncButtons", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, readonlyConditions: { classPropertyName: "readonlyConditions", publicName: "readonlyConditions", isSignal: true, isRequired: false, transformFunction: null }, deleteAriaLabel: { classPropertyName: "deleteAriaLabel", publicName: "deleteAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, addAriaLabel: { classPropertyName: "addAriaLabel", publicName: "addAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, inputAriaLabel: { classPropertyName: "inputAriaLabel", publicName: "inputAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, statusAriaLabel: { classPropertyName: "statusAriaLabel", publicName: "statusAriaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thresholdSteps: "thresholdStepsChange", validChange: "validChange" }, host: { properties: { "class.add-remove": "canAddRemoveSteps()", "class.horizontal": "horizontalLayout()", "class.dec-inc-buttons": "showDecIncButtons()" } }, viewQueries: [{ propertyName: "numberInputs", predicate: SiNumberInputComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "@for (step of thresholdSteps(); track step) {\n  <div class=\"ths-step\">\n    @if (!$first) {\n      <div class=\"ths-value d-flex align-items-center\">\n        @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n          <button\n            type=\"button\"\n            class=\"btn btn-circle btn-sm btn-ghost element-delete m-4\"\n            [attr.aria-label]=\"deleteAriaLabel() | translate\"\n            (click)=\"deleteStep($index)\"\n          ></button>\n        }\n        @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n          <div class=\"py-4 my-4\">&#8203;</div>\n        }\n        <div class=\"line\">\n          <div class=\"segment\" [ngClass]=\"colors()[$index - 1]\"></div>\n          <div class=\"dot\"></div>\n          <div class=\"segment\" [ngClass]=\"colors()[$index]\"></div>\n        </div>\n        <div class=\"d-flex align-items-center text-nowrap m-4\">\n          <si-number-input\n            #valueInput=\"ngModel\"\n            class=\"form-control text-end\"\n            [class.is-invalid]=\"step.valid === false\"\n            [aria-label]=\"inputAriaLabel() | translate\"\n            [readonly]=\"readonly()\"\n            [ngModelOptions]=\"{ standalone: true }\"\n            [min]=\"minValue()\"\n            [max]=\"maxValue()\"\n            [step]=\"stepSize()\"\n            [unit]=\"unit()\"\n            [showButtons]=\"showDecIncButtons()\"\n            [required]=\"true\"\n            [(ngModel)]=\"step.value\"\n            (ngModelChange)=\"stepChange()\"\n          />\n        </div>\n      </div>\n    }\n    @if ($first && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n    <div class=\"ths-option d-flex align-items-center\">\n      @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-circle btn-sm btn-secondary m-4\"\n          [disabled]=\"maxSteps() && $count >= maxSteps()\"\n          [attr.aria-label]=\"addAriaLabel() | translate\"\n          (click)=\"addStep($index)\"\n        >\n          <si-icon [icon]=\"icons.elementPlus\" />\n        </button>\n      }\n      @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n        <div class=\"py-4 my-4\">&#8203;</div>\n      }\n      <div class=\"line\" [ngClass]=\"colors()[$index]\">\n        <div class=\"segment\"></div>\n      </div>\n      @if (!readonly() && !readonlyConditions()) {\n        <si-select\n          class=\"my-4\"\n          [ariaLabel]=\"statusAriaLabel() | translate\"\n          [readonly]=\"readonly()\"\n          [options]=\"options()\"\n          [(value)]=\"step.optionValue\"\n          (valueChange)=\"stepChange()\"\n        />\n      }\n      @if (readonly() || readonlyConditions()) {\n        <si-readonly-threshold-option [options]=\"options()\" [value]=\"step.optionValue\" />\n      }\n    </div>\n    @if ($last && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n  </div>\n}\n\n<ng-template #startend let-color=\"color\">\n  <div class=\"ths-value d-flex align-items-center startend\">\n    <div class=\"py-4 my-4\">&#8203;</div>\n    <div class=\"line\">\n      <div class=\"segment\" [ngClass]=\"color\"></div>\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{--direction-main: column;--direction-option: row;--direction-value: row;--input-width: calc(var(--input-base-width, 90px) + var(--buttons-width, 0px))}:host.horizontal{--direction-main: row;--direction-option: column;--direction-value: column-reverse;--value-margin: -24px;padding-inline:calc(var(--value-margin) * -1)}:host.dec-inc-buttons{--buttons-width: 48px}:host,.ths-step{display:flex;flex-direction:var(--direction-main)}.ths-option{flex-direction:var(--direction-option);min-inline-size:var(--option-width, 160px)}.ths-value{flex-direction:var(--direction-value);margin-inline:var(--value-margin)}si-select{border-radius:var(--element-button-radius);overflow:hidden}.form-control{inline-size:var(--input-width);block-size:calc(1rem + 16px)}.line{align-self:stretch;flex-basis:16px;display:flex;flex-direction:var(--direction-main);align-items:center;color:var(--element-ui-2);gap:4px}.segment{flex:1;border:1px solid currentColor}.dot{inline-size:6px;block-size:6px;border:1px solid var(--element-ui-2);border-radius:50%}.startend{inline-size:calc(var(--input-width) / 2)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiNumberInputComponent, selector: "si-number-input", inputs: ["min", "max", "step", "value", "unit", "showButtons", "aria-label", "inputId", "disabled", "readonly", "placeholder"], outputs: ["valueChange"] }, { kind: "component", type: SiSelectComponent, selector: "si-select", inputs: ["id", "ariaLabel", "labelledby", "filterPlaceholder", "noResultsFoundLabel", "placeholder", "readonly", "hasFilter"], outputs: ["dropdownClose", "openChange"] }, { kind: "directive", type: SiSelectSingleValueDirective, selector: "si-select:not([multi])" }, { kind: "directive", type: SiSelectSimpleOptionsDirective, selector: "si-select[options]", inputs: ["options", "optionEqualCheckFn"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "component", type: SiReadonlyThresholdOptionComponent, selector: "si-readonly-threshold-option", inputs: ["value", "options"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SiThresholdComponent, decorators: [{
             type: Component,
@@ -274,7 +266,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                         FormsModule,
                         NgClass,
                         NgTemplateOutlet,
-                        SiIconNextComponent,
+                        SiIconComponent,
                         SiNumberInputComponent,
                         SiSelectComponent,
                         SiSelectSingleValueDirective,
@@ -285,7 +277,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                         '[class.add-remove]': 'canAddRemoveSteps()',
                         '[class.horizontal]': 'horizontalLayout()',
                         '[class.dec-inc-buttons]': 'showDecIncButtons()'
-                    }, template: "@for (step of thresholdSteps(); track step) {\n  <div class=\"ths-step\">\n    @if (!$first) {\n      <div class=\"ths-value d-flex align-items-center\">\n        @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n          <button\n            type=\"button\"\n            class=\"btn btn-circle btn-sm btn-ghost element-delete m-4\"\n            [attr.aria-label]=\"deleteAriaLabel() | translate\"\n            (click)=\"deleteStep($index)\"\n          ></button>\n        }\n        @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n          <div class=\"py-4 my-4\">&#8203;</div>\n        }\n        <div class=\"line\">\n          <div class=\"segment\" [ngClass]=\"colors()[$index - 1]\"></div>\n          <div class=\"dot\"></div>\n          <div class=\"segment\" [ngClass]=\"colors()[$index]\"></div>\n        </div>\n        <div class=\"d-flex align-items-center text-nowrap m-4\">\n          <si-number-input\n            #valueInput=\"ngModel\"\n            class=\"form-control text-end\"\n            [class.is-invalid]=\"step.valid === false\"\n            [aria-label]=\"inputAriaLabel() | translate\"\n            [readonly]=\"readonly()\"\n            [ngModelOptions]=\"{ standalone: true }\"\n            [min]=\"minValue()\"\n            [max]=\"maxValue()\"\n            [step]=\"stepSize()\"\n            [unit]=\"unit()\"\n            [showButtons]=\"showDecIncButtons()\"\n            [required]=\"true\"\n            [(ngModel)]=\"step.value\"\n            (ngModelChange)=\"stepChange()\"\n          />\n        </div>\n      </div>\n    }\n    @if ($first && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n    <div class=\"ths-option d-flex align-items-center\">\n      @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-circle btn-sm btn-secondary m-4\"\n          [disabled]=\"maxSteps() && $count >= maxSteps()\"\n          [attr.aria-label]=\"addAriaLabel() | translate\"\n          (click)=\"addStep($index)\"\n        >\n          <si-icon-next [icon]=\"icons.elementPlus\" />\n        </button>\n      }\n      @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n        <div class=\"py-4 my-4\">&#8203;</div>\n      }\n      <div class=\"line\" [ngClass]=\"colors()[$index]\">\n        <div class=\"segment\"></div>\n      </div>\n      @if (!readonly() && !readonlyConditions()) {\n        <si-select\n          class=\"my-4\"\n          [ariaLabel]=\"statusAriaLabel() | translate\"\n          [readonly]=\"readonly()\"\n          [options]=\"options()\"\n          [(value)]=\"step.optionValue\"\n          (valueChange)=\"stepChange()\"\n        />\n      }\n      @if (readonly() || readonlyConditions()) {\n        <si-readonly-threshold-option [options]=\"options()\" [value]=\"step.optionValue\" />\n      }\n    </div>\n    @if ($last && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n  </div>\n}\n\n<ng-template #startend let-color=\"color\">\n  <div class=\"ths-value d-flex align-items-center startend\">\n    <div class=\"py-4 my-4\">&#8203;</div>\n    <div class=\"line\">\n      <div class=\"segment\" [ngClass]=\"color\"></div>\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{--direction-main: column;--direction-option: row;--direction-value: row;--input-width: calc(var(--input-base-width, 90px) + var(--buttons-width, 0px))}:host.horizontal{--direction-main: row;--direction-option: column;--direction-value: column-reverse;--value-margin: -24px;padding-inline:calc(var(--value-margin) * -1)}:host.dec-inc-buttons{--buttons-width: 48px}:host,.ths-step{display:flex;flex-direction:var(--direction-main)}.ths-option{flex-direction:var(--direction-option);min-inline-size:var(--option-width, 160px)}.ths-value{flex-direction:var(--direction-value);margin-inline:var(--value-margin)}si-select{border-radius:var(--element-button-radius);overflow:hidden}.form-control{inline-size:var(--input-width);block-size:calc(1rem + 16px)}.line{align-self:stretch;flex-basis:16px;display:flex;flex-direction:var(--direction-main);align-items:center;color:var(--element-ui-2);gap:4px}.segment{flex:1;border:1px solid currentColor}.dot{inline-size:6px;block-size:6px;border:1px solid var(--element-ui-2);border-radius:50%}.startend{inline-size:calc(var(--input-width) / 2)}\n"] }]
+                    }, template: "@for (step of thresholdSteps(); track step) {\n  <div class=\"ths-step\">\n    @if (!$first) {\n      <div class=\"ths-value d-flex align-items-center\">\n        @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n          <button\n            type=\"button\"\n            class=\"btn btn-circle btn-sm btn-ghost element-delete m-4\"\n            [attr.aria-label]=\"deleteAriaLabel() | translate\"\n            (click)=\"deleteStep($index)\"\n          ></button>\n        }\n        @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n          <div class=\"py-4 my-4\">&#8203;</div>\n        }\n        <div class=\"line\">\n          <div class=\"segment\" [ngClass]=\"colors()[$index - 1]\"></div>\n          <div class=\"dot\"></div>\n          <div class=\"segment\" [ngClass]=\"colors()[$index]\"></div>\n        </div>\n        <div class=\"d-flex align-items-center text-nowrap m-4\">\n          <si-number-input\n            #valueInput=\"ngModel\"\n            class=\"form-control text-end\"\n            [class.is-invalid]=\"step.valid === false\"\n            [aria-label]=\"inputAriaLabel() | translate\"\n            [readonly]=\"readonly()\"\n            [ngModelOptions]=\"{ standalone: true }\"\n            [min]=\"minValue()\"\n            [max]=\"maxValue()\"\n            [step]=\"stepSize()\"\n            [unit]=\"unit()\"\n            [showButtons]=\"showDecIncButtons()\"\n            [required]=\"true\"\n            [(ngModel)]=\"step.value\"\n            (ngModelChange)=\"stepChange()\"\n          />\n        </div>\n      </div>\n    }\n    @if ($first && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n    <div class=\"ths-option d-flex align-items-center\">\n      @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-circle btn-sm btn-secondary m-4\"\n          [disabled]=\"maxSteps() && $count >= maxSteps()\"\n          [attr.aria-label]=\"addAriaLabel() | translate\"\n          (click)=\"addStep($index)\"\n        >\n          <si-icon [icon]=\"icons.elementPlus\" />\n        </button>\n      }\n      @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n        <div class=\"py-4 my-4\">&#8203;</div>\n      }\n      <div class=\"line\" [ngClass]=\"colors()[$index]\">\n        <div class=\"segment\"></div>\n      </div>\n      @if (!readonly() && !readonlyConditions()) {\n        <si-select\n          class=\"my-4\"\n          [ariaLabel]=\"statusAriaLabel() | translate\"\n          [readonly]=\"readonly()\"\n          [options]=\"options()\"\n          [(value)]=\"step.optionValue\"\n          (valueChange)=\"stepChange()\"\n        />\n      }\n      @if (readonly() || readonlyConditions()) {\n        <si-readonly-threshold-option [options]=\"options()\" [value]=\"step.optionValue\" />\n      }\n    </div>\n    @if ($last && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n  </div>\n}\n\n<ng-template #startend let-color=\"color\">\n  <div class=\"ths-value d-flex align-items-center startend\">\n    <div class=\"py-4 my-4\">&#8203;</div>\n    <div class=\"line\">\n      <div class=\"segment\" [ngClass]=\"color\"></div>\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{--direction-main: column;--direction-option: row;--direction-value: row;--input-width: calc(var(--input-base-width, 90px) + var(--buttons-width, 0px))}:host.horizontal{--direction-main: row;--direction-option: column;--direction-value: column-reverse;--value-margin: -24px;padding-inline:calc(var(--value-margin) * -1)}:host.dec-inc-buttons{--buttons-width: 48px}:host,.ths-step{display:flex;flex-direction:var(--direction-main)}.ths-option{flex-direction:var(--direction-option);min-inline-size:var(--option-width, 160px)}.ths-value{flex-direction:var(--direction-value);margin-inline:var(--value-margin)}si-select{border-radius:var(--element-button-radius);overflow:hidden}.form-control{inline-size:var(--input-width);block-size:calc(1rem + 16px)}.line{align-self:stretch;flex-basis:16px;display:flex;flex-direction:var(--direction-main);align-items:center;color:var(--element-ui-2);gap:4px}.segment{flex:1;border:1px solid currentColor}.dot{inline-size:6px;block-size:6px;border:1px solid var(--element-ui-2);border-radius:50%}.startend{inline-size:calc(var(--input-width) / 2)}\n"] }]
         }] });
 
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"siemens-element-ng-threshold.mjs","sources":["../../../../projects/element-ng/threshold/si-readonly-threshold-option.component.ts","../../../../projects/element-ng/threshold/si-threshold.component.ts","../../../../projects/element-ng/threshold/si-threshold.component.html","../../../../projects/element-ng/threshold/si-threshold.module.ts","../../../../projects/element-ng/threshold/index.ts","../../../../projects/element-ng/threshold/siemens-element-ng-threshold.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgClass } from '@angular/common';\nimport { Component, computed, input } from '@angular/core';\nimport { SiIconNextComponent } from '@siemens/element-ng/icon';\nimport { SelectOption, SelectOptionLegacy } from '@siemens/element-ng/select';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\n\n@Component({\n  selector: 'si-readonly-threshold-option',\n  imports: [NgClass, SiTranslatePipe, SiIconNextComponent],\n  template: `@let opt = option();\n    @if (opt && opt.icon) {\n      <i class=\"icon-stack\">\n        <si-icon-next\n          class=\"icon me-2\"\n          [icon]=\"opt.icon\"\n          [ngClass]=\"[(!opt.disabled && color()) || '']\"\n        />\n        @if (opt.type === 'option' && opt.stackedIcon) {\n          <si-icon-next\n            class=\"icon me-2\"\n            [icon]=\"opt.stackedIcon\"\n            [ngClass]=\"opt.stackedIconColor\"\n          />\n        }\n      </i>\n    }\n    <span class=\"text-truncate\">{{ label() | translate }}</span>`,\n  styleUrl: './si-readonly-threshold-option.component.scss',\n  host: { class: 'd-flex align-items-center py-2 my-4 px-4 si-title-2' }\n})\nexport class SiReadonlyThresholdOptionComponent {\n  readonly value = input.required<string>();\n  readonly options = input.required<SelectOptionLegacy[] | SelectOption<unknown>[]>();\n\n  protected readonly option = computed(() => {\n    const options = this.options();\n    const value = this.value();\n    if (value && options) {\n      return options.find(opt => (opt.type === 'option' ? opt.value === value : opt.id === value));\n    }\n    return undefined;\n  });\n\n  protected readonly color = computed(() => {\n    const option = this.option();\n    return !option || option.disabled\n      ? undefined\n      : option.type === 'option'\n        ? option.iconColor\n        : option.color;\n  });\n\n  protected readonly label = computed(() => {\n    const option = this.option();\n    return option?.type === 'option' ? option.label : option?.title;\n  });\n}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  computed,\n  input,\n  model,\n  OnChanges,\n  output,\n  viewChildren\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { addIcons, elementPlus, SiIconNextComponent } from '@siemens/element-ng/icon';\nimport { SiNumberInputComponent } from '@siemens/element-ng/number-input';\nimport {\n  SelectOption,\n  SelectOptionLegacy,\n  SiSelectComponent,\n  SiSelectSimpleOptionsDirective,\n  SiSelectSingleValueDirective\n} from '@siemens/element-ng/select';\nimport { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';\n\nimport { SiReadonlyThresholdOptionComponent } from './si-readonly-threshold-option.component';\n\n/**\n * One step in a list of thresholds\n */\nexport interface ThresholdStep {\n  /** Threshold value, the first step has no value */\n  value?: number;\n  /** One of the `SelectOption.id` */\n  optionValue: string;\n  /** When set to `false`, input fields are highlighted as invalid */\n  valid?: boolean;\n}\n\n@Component({\n  selector: 'si-threshold',\n  imports: [\n    FormsModule,\n    NgClass,\n    NgTemplateOutlet,\n    SiIconNextComponent,\n    SiNumberInputComponent,\n    SiSelectComponent,\n    SiSelectSingleValueDirective,\n    SiSelectSimpleOptionsDirective,\n    SiTranslatePipe,\n    SiReadonlyThresholdOptionComponent\n  ],\n  templateUrl: './si-threshold.component.html',\n  styleUrl: './si-threshold.component.scss',\n  host: {\n    '[class.add-remove]': 'canAddRemoveSteps()',\n    '[class.horizontal]': 'horizontalLayout()',\n    '[class.dec-inc-buttons]': 'showDecIncButtons()'\n  }\n})\nexport class SiThresholdComponent implements OnChanges {\n  /**\n   * Options to be shown in select dropdown\n   *\n   * @defaultValue []\n   */\n  readonly options = input<SelectOptionLegacy[] | SelectOption<unknown>[]>([]);\n  /**\n   * The thresholds\n   *\n   * @defaultValue []\n   */\n  readonly thresholdSteps = model<ThresholdStep[]>([]);\n  /**\n   * The unit to show\n   *\n   * @defaultValue ''\n   */\n  readonly unit = input('');\n  /**\n   * The min. value for the threshold value\n   *\n   * @defaultValue 0\n   */\n  readonly minValue = input(0);\n  /**\n   * The max. value for the threshold value\n   *\n   * @defaultValue 100\n   */\n  readonly maxValue = input(100);\n  /**\n   * The step size for the threshold value\n   *\n   * @defaultValue 1\n   */\n  readonly stepSize = input(1);\n  /**\n   * Max. number of steps, 0 for no hard limit\n   *\n   * @defaultValue 0\n   */\n  readonly maxSteps = input(0);\n  /**\n   * Do validation?\n   *\n   * @defaultValue true\n   */\n  readonly validation = input(true, { transform: booleanAttribute });\n  /**\n   * When disabled, steps cannot be added/removed\n   *\n   * @defaultValue true\n   */\n  readonly canAddRemoveSteps = input(true, { transform: booleanAttribute });\n  /**\n   * Use horizontal layout?\n   *\n   * @defaultValue false\n   */\n  readonly horizontalLayout = input(false, { transform: booleanAttribute });\n  /**\n   * Show dec/inc buttons?\n   *\n   * @defaultValue true\n   */\n  readonly showDecIncButtons = input(true, { transform: booleanAttribute });\n  /**\n   * The obvious\n   *\n   * @defaultValue false\n   */\n  readonly readonly = input(false, { transform: booleanAttribute });\n  /**\n   * Indicate that the threshold options are readonly and cannot be changed. This will also disable adding / removing steps.\n   *\n   * @defaultValue false\n   */\n  readonly readonlyConditions = input(false, { transform: booleanAttribute });\n  /**\n   * The aria-label for delete button\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.DELETE:Delete step`)\n   * ```\n   */\n  readonly deleteAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.DELETE:Delete step`));\n  /**\n   * The aria-label for add button\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.ADD:Add step`)\n   * ```\n   */\n  readonly addAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.ADD:Add step`));\n  /**\n   * The aria-label for input field\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.INPUT_LABEL:Threshold value`)\n   * ```\n   */\n  readonly inputAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.INPUT_LABEL:Threshold value`));\n  /**\n   * The aria-label for status selection\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.STATUS:Status`)\n   * ```\n   */\n  readonly statusAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.STATUS:Status`));\n\n  /** Fired when validation status changes */\n  readonly validChange = output<boolean>();\n\n  protected readonly colors = computed(() => {\n    const colorMap = new Map<unknown, string>();\n    for (const opt of this.options()) {\n      if (opt.type === 'option') {\n        colorMap.set(opt.value, opt.iconColor ?? '');\n      } else if (!opt.type) {\n        colorMap.set(opt.id, opt.color ?? '');\n      }\n    }\n    return this.thresholdSteps().map(ths => colorMap.get(ths.optionValue) ?? '');\n  });\n\n  protected readonly icons = addIcons({ elementPlus });\n  private _valid = true;\n  /**\n   * Whether the current input value is valid or not.\n   */\n  get valid(): boolean {\n    return this._valid;\n  }\n\n  private readonly numberInputs = viewChildren(SiNumberInputComponent);\n\n  ngOnChanges(): void {\n    this.validate();\n  }\n\n  protected deleteStep(index: number): void {\n    const updated = [...this.thresholdSteps()];\n    updated.splice(index, 1);\n    this.thresholdSteps.set(updated);\n    this.validate();\n  }\n\n  protected addStep(index: number): void {\n    const newStep: ThresholdStep = { ...this.thresholdSteps()[index], value: undefined };\n    const updated = [...this.thresholdSteps()];\n    updated.splice(index + 1, 0, newStep);\n    this.thresholdSteps.set(updated);\n    this.validate();\n    setTimeout(() => this.numberInputs()[index].inputElement().nativeElement.focus());\n  }\n\n  protected stepChange(): void {\n    this.thresholdSteps.set([...this.thresholdSteps()]);\n    this.validate();\n  }\n\n  private validate(): void {\n    const prevValid = this.valid;\n    this._valid = true;\n    for (let i = 1; i < this.thresholdSteps().length; i++) {\n      const step = this.thresholdSteps()[i];\n\n      if (this.validation()) {\n        const prev = this.thresholdSteps()[i - 1];\n        const next = this.thresholdSteps()[i + 1];\n\n        // valid: withing min/max, each step is lower than next step with step size between\n        step.valid =\n          step.value != null &&\n          step.value >= this.minValue() &&\n          step.value <= this.maxValue() &&\n          (prev.value == null || step.value - this.stepSize() >= prev.value) &&\n          (next?.value == null || step.value + this.stepSize() <= next.value);\n        this._valid &&= step.valid;\n      } else {\n        step.valid = true;\n      }\n    }\n    if (this.valid !== prevValid) {\n      this.validChange.emit(this.valid);\n    }\n  }\n}\n","@for (step of thresholdSteps(); track step) {\n  <div class=\"ths-step\">\n    @if (!$first) {\n      <div class=\"ths-value d-flex align-items-center\">\n        @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n          <button\n            type=\"button\"\n            class=\"btn btn-circle btn-sm btn-ghost element-delete m-4\"\n            [attr.aria-label]=\"deleteAriaLabel() | translate\"\n            (click)=\"deleteStep($index)\"\n          ></button>\n        }\n        @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n          <div class=\"py-4 my-4\">&#8203;</div>\n        }\n        <div class=\"line\">\n          <div class=\"segment\" [ngClass]=\"colors()[$index - 1]\"></div>\n          <div class=\"dot\"></div>\n          <div class=\"segment\" [ngClass]=\"colors()[$index]\"></div>\n        </div>\n        <div class=\"d-flex align-items-center text-nowrap m-4\">\n          <si-number-input\n            #valueInput=\"ngModel\"\n            class=\"form-control text-end\"\n            [class.is-invalid]=\"step.valid === false\"\n            [aria-label]=\"inputAriaLabel() | translate\"\n            [readonly]=\"readonly()\"\n            [ngModelOptions]=\"{ standalone: true }\"\n            [min]=\"minValue()\"\n            [max]=\"maxValue()\"\n            [step]=\"stepSize()\"\n            [unit]=\"unit()\"\n            [showButtons]=\"showDecIncButtons()\"\n            [required]=\"true\"\n            [(ngModel)]=\"step.value\"\n            (ngModelChange)=\"stepChange()\"\n          />\n        </div>\n      </div>\n    }\n    @if ($first && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n    <div class=\"ths-option d-flex align-items-center\">\n      @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-circle btn-sm btn-secondary m-4\"\n          [disabled]=\"maxSteps() && $count >= maxSteps()\"\n          [attr.aria-label]=\"addAriaLabel() | translate\"\n          (click)=\"addStep($index)\"\n        >\n          <si-icon-next [icon]=\"icons.elementPlus\" />\n        </button>\n      }\n      @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n        <div class=\"py-4 my-4\">&#8203;</div>\n      }\n      <div class=\"line\" [ngClass]=\"colors()[$index]\">\n        <div class=\"segment\"></div>\n      </div>\n      @if (!readonly() && !readonlyConditions()) {\n        <si-select\n          class=\"my-4\"\n          [ariaLabel]=\"statusAriaLabel() | translate\"\n          [readonly]=\"readonly()\"\n          [options]=\"options()\"\n          [(value)]=\"step.optionValue\"\n          (valueChange)=\"stepChange()\"\n        />\n      }\n      @if (readonly() || readonlyConditions()) {\n        <si-readonly-threshold-option [options]=\"options()\" [value]=\"step.optionValue\" />\n      }\n    </div>\n    @if ($last && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n  </div>\n}\n\n<ng-template #startend let-color=\"color\">\n  <div class=\"ths-value d-flex align-items-center startend\">\n    <div class=\"py-4 my-4\">&#8203;</div>\n    <div class=\"line\">\n      <div class=\"segment\" [ngClass]=\"color\"></div>\n    </div>\n  </div>\n</ng-template>\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiThresholdComponent } from './si-threshold.component';\n\n@NgModule({\n  imports: [SiThresholdComponent],\n  exports: [SiThresholdComponent]\n})\nexport class SiThresholdModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-threshold.component';\nexport * from './si-threshold.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;AAAA;;;AAGG;MA+BU,kCAAkC,CAAA;AACpC,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAU;AAChC,IAAA,OAAO,GAAG,KAAK,CAAC,QAAQ,EAAkD;AAEhE,IAAA,MAAM,GAAG,QAAQ,CAAC,MAAK;AACxC,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE;AAC9B,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;AAC1B,QAAA,IAAI,KAAK,IAAI,OAAO,EAAE;AACpB,YAAA,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,KAAK,GAAG,CAAC,IAAI,KAAK,QAAQ,GAAG,GAAG,CAAC,KAAK,KAAK,KAAK,GAAG,GAAG,CAAC,EAAE,KAAK,KAAK,CAAC,CAAC;;AAE9F,QAAA,OAAO,SAAS;AAClB,KAAC,CAAC;AAEiB,IAAA,KAAK,GAAG,QAAQ,CAAC,MAAK;AACvC,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;AAC5B,QAAA,OAAO,CAAC,MAAM,IAAI,MAAM,CAAC;AACvB,cAAE;AACF,cAAE,MAAM,CAAC,IAAI,KAAK;kBACd,MAAM,CAAC;AACT,kBAAE,MAAM,CAAC,KAAK;AACpB,KAAC,CAAC;AAEiB,IAAA,KAAK,GAAG,QAAQ,CAAC,MAAK;AACvC,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;AAC5B,QAAA,OAAO,MAAM,EAAE,IAAI,KAAK,QAAQ,GAAG,MAAM,CAAC,KAAK,GAAG,MAAM,EAAE,KAAK;AACjE,KAAC,CAAC;uGAzBS,kCAAkC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlC,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kCAAkC,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,8BAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,qDAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EArBnC,CAAA;;;;;;;;;;;;;;;;;AAiBqD,gEAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,0BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAlBrD,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAE,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,mBAAmB,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAsB5C,kCAAkC,EAAA,UAAA,EAAA,CAAA;kBAxB9C,SAAS;+BACE,8BAA8B,EAAA,OAAA,EAC/B,CAAC,OAAO,EAAE,eAAe,EAAE,mBAAmB,CAAC,EAAA,QAAA,EAC9C,CAAA;;;;;;;;;;;;;;;;;AAiBqD,gEAAA,CAAA,EAAA,IAAA,EAEzD,EAAE,KAAK,EAAE,qDAAqD,EAAE,EAAA,MAAA,EAAA,CAAA,0BAAA,CAAA,EAAA;;;AChCxE;;;AAGG;MA4DU,oBAAoB,CAAA;AAC/B;;;;AAIG;AACM,IAAA,OAAO,GAAG,KAAK,CAAiD,EAAE,CAAC;AAC5E;;;;AAIG;AACM,IAAA,cAAc,GAAG,KAAK,CAAkB,EAAE,CAAC;AACpD;;;;AAIG;AACM,IAAA,IAAI,GAAG,KAAK,CAAC,EAAE,CAAC;AACzB;;;;AAIG;AACM,IAAA,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC;AAC5B;;;;AAIG;AACM,IAAA,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC;AAC9B;;;;AAIG;AACM,IAAA,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC;AAC5B;;;;AAIG;AACM,IAAA,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC;AAC5B;;;;AAIG;IACM,UAAU,GAAG,KAAK,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AAClE;;;;AAIG;IACM,iBAAiB,GAAG,KAAK,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AACzE;;;;AAIG;IACM,gBAAgB,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AACzE;;;;AAIG;IACM,iBAAiB,GAAG,KAAK,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AACzE;;;;AAIG;IACM,QAAQ,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AACjE;;;;AAIG;IACM,kBAAkB,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AAC3E;;;;;;;AAOG;AACM,IAAA,eAAe,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM,SAAS,CAAA,CAAA,kCAAA,CAAoC,CAAC,CAAC;AACxF;;;;;;;AAOG;AACM,IAAA,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM,SAAS,CAAA,CAAA,4BAAA,CAA8B,CAAC,CAAC;AAC/E;;;;;;;AAOG;AACM,IAAA,cAAc,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM,SAAS,CAAA,CAAA,2CAAA,CAA6C,CAAC,CAAC;AAChG;;;;;;;AAOG;AACM,IAAA,eAAe,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM,SAAS,CAAA,CAAA,6BAAA,CAA+B,CAAC,CAAC;;IAG1E,WAAW,GAAG,MAAM,EAAW;AAErB,IAAA,MAAM,GAAG,QAAQ,CAAC,MAAK;AACxC,QAAA,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAmB;QAC3C,KAAK,MAAM,GAAG,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;AAChC,YAAA,IAAI,GAAG,CAAC,IAAI,KAAK,QAAQ,EAAE;AACzB,gBAAA,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,CAAC,SAAS,IAAI,EAAE,CAAC;;AACvC,iBAAA,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE;AACpB,gBAAA,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,EAAE,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC;;;QAGzC,OAAO,IAAI,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,GAAG,IAAI,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;AAC9E,KAAC,CAAC;AAEiB,IAAA,KAAK,GAAG,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IAC5C,MAAM,GAAG,IAAI;AACrB;;AAEG;AACH,IAAA,IAAI,KAAK,GAAA;QACP,OAAO,IAAI,CAAC,MAAM;;AAGH,IAAA,YAAY,GAAG,YAAY,CAAC,sBAAsB,CAAC;IAEpE,WAAW,GAAA;QACT,IAAI,CAAC,QAAQ,EAAE;;AAGP,IAAA,UAAU,CAAC,KAAa,EAAA;QAChC,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;AAC1C,QAAA,OAAO,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;AACxB,QAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC;QAChC,IAAI,CAAC,QAAQ,EAAE;;AAGP,IAAA,OAAO,CAAC,KAAa,EAAA;AAC7B,QAAA,MAAM,OAAO,GAAkB,EAAE,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE;QACpF,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAC1C,OAAO,CAAC,MAAM,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC;AACrC,QAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC;QAChC,IAAI,CAAC,QAAQ,EAAE;QACf,UAAU,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC,KAAK,CAAC,CAAC,YAAY,EAAE,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;;IAGzE,UAAU,GAAA;AAClB,QAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC;QACnD,IAAI,CAAC,QAAQ,EAAE;;IAGT,QAAQ,GAAA;AACd,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK;AAC5B,QAAA,IAAI,CAAC,MAAM,GAAG,IAAI;AAClB,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACrD,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;AAErC,YAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;gBACrB,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;gBACzC,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;;AAGzC,gBAAA,IAAI,CAAC,KAAK;oBACR,IAAI,CAAC,KAAK,IAAI,IAAI;AAClB,wBAAA,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,QAAQ,EAAE;AAC7B,wBAAA,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,QAAQ,EAAE;AAC7B,yBAAC,IAAI,CAAC,KAAK,IAAI,IAAI,IAAI,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC;AAClE,yBAAC,IAAI,EAAE,KAAK,IAAI,IAAI,IAAI,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC;AACrE,gBAAA,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK;;iBACrB;AACL,gBAAA,IAAI,CAAC,KAAK,GAAG,IAAI;;;AAGrB,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;YAC5B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;;;uGA9L1B,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAApB,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,UAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,UAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,eAAA,EAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,eAAA,EAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,cAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,kBAAA,EAAA,qBAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,uBAAA,EAAA,qBAAA,EAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,cAAA,EAAA,SAAA,EA4Ic,sBAAsB,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC3MrE,m7GA+FA,0nCDnDI,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,wIAAA,EAAA,MAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACX,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACP,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAChB,mBAAmB,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,sBAAsB,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,KAAA,EAAA,KAAA,EAAA,MAAA,EAAA,OAAA,EAAA,MAAA,EAAA,aAAA,EAAA,YAAA,EAAA,SAAA,EAAA,UAAA,EAAA,UAAA,EAAA,aAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACtB,iBAAiB,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,IAAA,EAAA,WAAA,EAAA,YAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,WAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,EAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACjB,4BAA4B,mEAC5B,8BAA8B,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,oBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAC9B,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACf,kCAAkC,EAAA,QAAA,EAAA,8BAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAUzB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAtBhC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,cAAc,EAAA,OAAA,EACf;wBACP,WAAW;wBACX,OAAO;wBACP,gBAAgB;wBAChB,mBAAmB;wBACnB,sBAAsB;wBACtB,iBAAiB;wBACjB,4BAA4B;wBAC5B,8BAA8B;wBAC9B,eAAe;wBACf;qBACD,EAAA,IAAA,EAGK;AACJ,wBAAA,oBAAoB,EAAE,qBAAqB;AAC3C,wBAAA,oBAAoB,EAAE,oBAAoB;AAC1C,wBAAA,yBAAyB,EAAE;AAC5B,qBAAA,EAAA,QAAA,EAAA,m7GAAA,EAAA,MAAA,EAAA,CAAA,mkCAAA,CAAA,EAAA;;;AE7DH;;;AAGG;MASU,iBAAiB,CAAA;uGAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;wGAAjB,iBAAiB,EAAA,OAAA,EAAA,CAHlB,oBAAoB,CAAA,EAAA,OAAA,EAAA,CACpB,oBAAoB,CAAA,EAAA,CAAA;AAEnB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,YAHlB,oBAAoB,CAAA,EAAA,CAAA;;2FAGnB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAJ7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,oBAAoB,CAAC;oBAC/B,OAAO,EAAE,CAAC,oBAAoB;AAC/B,iBAAA;;;ACXD;;;AAGG;;ACHH;;AAEG;;;;"}
+{"version":3,"file":"siemens-element-ng-threshold.mjs","sources":["../../../../projects/element-ng/threshold/si-readonly-threshold-option.component.ts","../../../../projects/element-ng/threshold/si-threshold.component.ts","../../../../projects/element-ng/threshold/si-threshold.component.html","../../../../projects/element-ng/threshold/si-threshold.module.ts","../../../../projects/element-ng/threshold/index.ts","../../../../projects/element-ng/threshold/siemens-element-ng-threshold.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgClass } from '@angular/common';\nimport { Component, computed, input } from '@angular/core';\nimport { SiIconComponent } from '@siemens/element-ng/icon';\nimport { SelectOption, SelectOptionLegacy } from '@siemens/element-ng/select';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\n\n@Component({\n  selector: 'si-readonly-threshold-option',\n  imports: [NgClass, SiTranslatePipe, SiIconComponent],\n  template: `@let opt = option();\n    @if (opt && opt.icon) {\n      <i class=\"icon-stack\">\n        <si-icon\n          class=\"icon me-2\"\n          [icon]=\"opt.icon\"\n          [ngClass]=\"[(!opt.disabled && color()) || '']\"\n        />\n        @if (opt.type === 'option' && opt.stackedIcon) {\n          <si-icon class=\"icon me-2\" [icon]=\"opt.stackedIcon\" [ngClass]=\"opt.stackedIconColor\" />\n        }\n      </i>\n    }\n    <span class=\"text-truncate\">{{ label() | translate }}</span>`,\n  styleUrl: './si-readonly-threshold-option.component.scss',\n  host: { class: 'd-flex align-items-center py-2 my-4 px-4 si-title-2' }\n})\nexport class SiReadonlyThresholdOptionComponent {\n  readonly value = input.required<string>();\n  readonly options = input.required<SelectOptionLegacy[] | SelectOption<unknown>[]>();\n\n  protected readonly option = computed(() => {\n    const options = this.options();\n    const value = this.value();\n    if (value && options) {\n      return options.find(opt => (opt.type === 'option' ? opt.value === value : opt.id === value));\n    }\n    return undefined;\n  });\n\n  protected readonly color = computed(() => {\n    const option = this.option();\n    return !option || option.disabled\n      ? undefined\n      : option.type === 'option'\n        ? option.iconColor\n        : option.color;\n  });\n\n  protected readonly label = computed(() => {\n    const option = this.option();\n    return option?.type === 'option' ? option.label : option?.title;\n  });\n}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  computed,\n  input,\n  model,\n  OnChanges,\n  output,\n  viewChildren\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { addIcons, elementPlus, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiNumberInputComponent } from '@siemens/element-ng/number-input';\nimport {\n  SelectOption,\n  SelectOptionLegacy,\n  SiSelectComponent,\n  SiSelectSimpleOptionsDirective,\n  SiSelectSingleValueDirective\n} from '@siemens/element-ng/select';\nimport { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';\n\nimport { SiReadonlyThresholdOptionComponent } from './si-readonly-threshold-option.component';\n\n/**\n * One step in a list of thresholds\n */\nexport interface ThresholdStep {\n  /** Threshold value, the first step has no value */\n  value?: number;\n  /** One of the `SelectOption.id` */\n  optionValue: string;\n  /** When set to `false`, input fields are highlighted as invalid */\n  valid?: boolean;\n}\n\n@Component({\n  selector: 'si-threshold',\n  imports: [\n    FormsModule,\n    NgClass,\n    NgTemplateOutlet,\n    SiIconComponent,\n    SiNumberInputComponent,\n    SiSelectComponent,\n    SiSelectSingleValueDirective,\n    SiSelectSimpleOptionsDirective,\n    SiTranslatePipe,\n    SiReadonlyThresholdOptionComponent\n  ],\n  templateUrl: './si-threshold.component.html',\n  styleUrl: './si-threshold.component.scss',\n  host: {\n    '[class.add-remove]': 'canAddRemoveSteps()',\n    '[class.horizontal]': 'horizontalLayout()',\n    '[class.dec-inc-buttons]': 'showDecIncButtons()'\n  }\n})\nexport class SiThresholdComponent implements OnChanges {\n  /**\n   * Options to be shown in select dropdown\n   *\n   * @defaultValue []\n   */\n  readonly options = input<SelectOptionLegacy[] | SelectOption<unknown>[]>([]);\n  /**\n   * The thresholds\n   *\n   * @defaultValue []\n   */\n  readonly thresholdSteps = model<ThresholdStep[]>([]);\n  /**\n   * The unit to show\n   *\n   * @defaultValue ''\n   */\n  readonly unit = input('');\n  /**\n   * The min. value for the threshold value\n   *\n   * @defaultValue 0\n   */\n  readonly minValue = input(0);\n  /**\n   * The max. value for the threshold value\n   *\n   * @defaultValue 100\n   */\n  readonly maxValue = input(100);\n  /**\n   * The step size for the threshold value\n   *\n   * @defaultValue 1\n   */\n  readonly stepSize = input(1);\n  /**\n   * Max. number of steps, 0 for no hard limit\n   *\n   * @defaultValue 0\n   */\n  readonly maxSteps = input(0);\n  /**\n   * Do validation?\n   *\n   * @defaultValue true\n   */\n  readonly validation = input(true, { transform: booleanAttribute });\n  /**\n   * When disabled, steps cannot be added/removed\n   *\n   * @defaultValue true\n   */\n  readonly canAddRemoveSteps = input(true, { transform: booleanAttribute });\n  /**\n   * Use horizontal layout?\n   *\n   * @defaultValue false\n   */\n  readonly horizontalLayout = input(false, { transform: booleanAttribute });\n  /**\n   * Show dec/inc buttons?\n   *\n   * @defaultValue true\n   */\n  readonly showDecIncButtons = input(true, { transform: booleanAttribute });\n  /**\n   * The obvious\n   *\n   * @defaultValue false\n   */\n  readonly readonly = input(false, { transform: booleanAttribute });\n  /**\n   * Indicate that the threshold options are readonly and cannot be changed. This will also disable adding / removing steps.\n   *\n   * @defaultValue false\n   */\n  readonly readonlyConditions = input(false, { transform: booleanAttribute });\n  /**\n   * The aria-label for delete button\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.DELETE:Delete step`)\n   * ```\n   */\n  readonly deleteAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.DELETE:Delete step`));\n  /**\n   * The aria-label for add button\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.ADD:Add step`)\n   * ```\n   */\n  readonly addAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.ADD:Add step`));\n  /**\n   * The aria-label for input field\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.INPUT_LABEL:Threshold value`)\n   * ```\n   */\n  readonly inputAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.INPUT_LABEL:Threshold value`));\n  /**\n   * The aria-label for status selection\n   *\n   * @defaultValue\n   * ```\n   * t(() => $localize`:@@SI_THRESHOLD.STATUS:Status`)\n   * ```\n   */\n  readonly statusAriaLabel = input(t(() => $localize`:@@SI_THRESHOLD.STATUS:Status`));\n\n  /** Fired when validation status changes */\n  readonly validChange = output<boolean>();\n\n  protected readonly colors = computed(() => {\n    const colorMap = new Map<unknown, string>();\n    for (const opt of this.options()) {\n      if (opt.type === 'option') {\n        colorMap.set(opt.value, opt.iconColor ?? '');\n      } else if (!opt.type) {\n        colorMap.set(opt.id, opt.color ?? '');\n      }\n    }\n    return this.thresholdSteps().map(ths => colorMap.get(ths.optionValue) ?? '');\n  });\n\n  protected readonly icons = addIcons({ elementPlus });\n  private _valid = true;\n  /**\n   * Whether the current input value is valid or not.\n   */\n  get valid(): boolean {\n    return this._valid;\n  }\n\n  private readonly numberInputs = viewChildren(SiNumberInputComponent);\n\n  ngOnChanges(): void {\n    this.validate();\n  }\n\n  protected deleteStep(index: number): void {\n    const updated = [...this.thresholdSteps()];\n    updated.splice(index, 1);\n    this.thresholdSteps.set(updated);\n    this.validate();\n  }\n\n  protected addStep(index: number): void {\n    const newStep: ThresholdStep = { ...this.thresholdSteps()[index], value: undefined };\n    const updated = [...this.thresholdSteps()];\n    updated.splice(index + 1, 0, newStep);\n    this.thresholdSteps.set(updated);\n    this.validate();\n    setTimeout(() => this.numberInputs()[index].inputElement().nativeElement.focus());\n  }\n\n  protected stepChange(): void {\n    this.thresholdSteps.set([...this.thresholdSteps()]);\n    this.validate();\n  }\n\n  private validate(): void {\n    const prevValid = this.valid;\n    this._valid = true;\n    for (let i = 1; i < this.thresholdSteps().length; i++) {\n      const step = this.thresholdSteps()[i];\n\n      if (this.validation()) {\n        const prev = this.thresholdSteps()[i - 1];\n        const next = this.thresholdSteps()[i + 1];\n\n        // valid: withing min/max, each step is lower than next step with step size between\n        step.valid =\n          step.value != null &&\n          step.value >= this.minValue() &&\n          step.value <= this.maxValue() &&\n          (prev.value == null || step.value - this.stepSize() >= prev.value) &&\n          (next?.value == null || step.value + this.stepSize() <= next.value);\n        this._valid &&= step.valid;\n      } else {\n        step.valid = true;\n      }\n    }\n    if (this.valid !== prevValid) {\n      this.validChange.emit(this.valid);\n    }\n  }\n}\n","@for (step of thresholdSteps(); track step) {\n  <div class=\"ths-step\">\n    @if (!$first) {\n      <div class=\"ths-value d-flex align-items-center\">\n        @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n          <button\n            type=\"button\"\n            class=\"btn btn-circle btn-sm btn-ghost element-delete m-4\"\n            [attr.aria-label]=\"deleteAriaLabel() | translate\"\n            (click)=\"deleteStep($index)\"\n          ></button>\n        }\n        @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n          <div class=\"py-4 my-4\">&#8203;</div>\n        }\n        <div class=\"line\">\n          <div class=\"segment\" [ngClass]=\"colors()[$index - 1]\"></div>\n          <div class=\"dot\"></div>\n          <div class=\"segment\" [ngClass]=\"colors()[$index]\"></div>\n        </div>\n        <div class=\"d-flex align-items-center text-nowrap m-4\">\n          <si-number-input\n            #valueInput=\"ngModel\"\n            class=\"form-control text-end\"\n            [class.is-invalid]=\"step.valid === false\"\n            [aria-label]=\"inputAriaLabel() | translate\"\n            [readonly]=\"readonly()\"\n            [ngModelOptions]=\"{ standalone: true }\"\n            [min]=\"minValue()\"\n            [max]=\"maxValue()\"\n            [step]=\"stepSize()\"\n            [unit]=\"unit()\"\n            [showButtons]=\"showDecIncButtons()\"\n            [required]=\"true\"\n            [(ngModel)]=\"step.value\"\n            (ngModelChange)=\"stepChange()\"\n          />\n        </div>\n      </div>\n    }\n    @if ($first && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n    <div class=\"ths-option d-flex align-items-center\">\n      @if (canAddRemoveSteps() && !readonly() && !readonlyConditions()) {\n        <button\n          type=\"button\"\n          class=\"btn btn-circle btn-sm btn-secondary m-4\"\n          [disabled]=\"maxSteps() && $count >= maxSteps()\"\n          [attr.aria-label]=\"addAriaLabel() | translate\"\n          (click)=\"addStep($index)\"\n        >\n          <si-icon [icon]=\"icons.elementPlus\" />\n        </button>\n      }\n      @if (!canAddRemoveSteps() || readonly() || readonlyConditions()) {\n        <div class=\"py-4 my-4\">&#8203;</div>\n      }\n      <div class=\"line\" [ngClass]=\"colors()[$index]\">\n        <div class=\"segment\"></div>\n      </div>\n      @if (!readonly() && !readonlyConditions()) {\n        <si-select\n          class=\"my-4\"\n          [ariaLabel]=\"statusAriaLabel() | translate\"\n          [readonly]=\"readonly()\"\n          [options]=\"options()\"\n          [(value)]=\"step.optionValue\"\n          (valueChange)=\"stepChange()\"\n        />\n      }\n      @if (readonly() || readonlyConditions()) {\n        <si-readonly-threshold-option [options]=\"options()\" [value]=\"step.optionValue\" />\n      }\n    </div>\n    @if ($last && horizontalLayout()) {\n      <ng-container\n        [ngTemplateOutlet]=\"startend\"\n        [ngTemplateOutletContext]=\"{ color: colors()[$index] }\"\n      />\n    }\n  </div>\n}\n\n<ng-template #startend let-color=\"color\">\n  <div class=\"ths-value d-flex align-items-center startend\">\n    <div class=\"py-4 my-4\">&#8203;</div>\n    <div class=\"line\">\n      <div class=\"segment\" [ngClass]=\"color\"></div>\n    </div>\n  </div>\n</ng-template>\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiThresholdComponent } from './si-threshold.component';\n\n@NgModule({\n  imports: [SiThresholdComponent],\n  exports: [SiThresholdComponent]\n})\nexport class SiThresholdModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2025\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-threshold.component';\nexport * from './si-threshold.module';\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-toast-notification.mjs

@@ -7,7 +7,7 @@ import { t, SiTranslatePipe, SiTranslateService, SiNoTranslateService } from '@s
 import { ReplaySubject, Subject } from 'rxjs';
 import { trigger, transition, style, animate } from '@angular/animations';
 import { areAnimationsDisabled } from '@siemens/element-ng/common';
-import { STATUS_ICON_CONFIG, addIcons, elementCancel, SiIconNextComponent, SiStatusIconComponent } from '@siemens/element-ng/icon';
+import { STATUS_ICON_CONFIG, addIcons, elementCancel, SiIconComponent, SiStatusIconComponent } from '@siemens/element-ng/icon';
 import * as i1 from '@siemens/element-ng/link';
 import { SiLinkModule } from '@siemens/element-ng/link';
 
@@ -20,7 +20,8 @@ const SI_TOAST_AUTO_HIDE_DELAY = 6000;
 class SiToastNotificationComponent {
     statusIcons = inject(STATUS_ICON_CONFIG);
     toast = input.required();
-    closeAriaLabel = t(() => $localize `:@@SI_TOAST.CLOSE:Close`);
+    closeAriaLabelDefault = t(() => $localize `:@@SI_TOAST.CLOSE:Close`);
+    closeAriaLabel = computed(() => this.toast().closeAriaLabel ?? this.closeAriaLabelDefault);
     icons = addIcons({ elementCancel });
     status = computed(() => {
         const toast = this.toast();
@@ -51,20 +52,15 @@ class SiToastNotificationComponent {
             this.resumed.emit();
         }
     }
-    ngOnChanges(changes) {
-        if (changes?.toast.currentValue) {
-            this.closeAriaLabel = this.toast().closeAriaLabel ?? this.closeAriaLabel;
-        }
-    }
     close() {
         this.toast().close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SiToastNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SiToastNotificationComponent, isStandalone: true, selector: "si-toast-notification", inputs: { toast: { classPropertyName: "toast", publicName: "toast", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { paused: "paused", resumed: "resumed" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, usesOnChanges: true, ngImport: i0, template: "@let toastValue = toast();\n@let autoClose = !toastValue.disableAutoClose;\n@let manualClose = !toastValue.disableManualClose;\n<div class=\"si-toast elevation-2\" [class.si-toast-auto-close]=\"autoClose\">\n  @if (autoClose) {\n    <div\n      class=\"si-toast-timer-bar\"\n      [style.--play-state]=\"animationMode()\"\n      [style.--toast-timer-duration.s]=\"toastTimeoutInSeconds()\"\n    ></div>\n  }\n  <div class=\"bar\" [ngClass]=\"statusColor()\"></div>\n  <si-status-icon class=\"icon\" [status]=\"status()\" />\n\n  <div class=\"toast-content px-4\">\n    <p class=\"toast-title\"\n      ><b>{{ toastValue.title | translate: toastValue.translationParams }}</b></p\n    >\n    @if (toastValue.message) {\n      <p class=\"mt-4\">{{ toastValue.message | translate: toastValue.translationParams }}</p>\n    }\n    @if (toastValue.action) {\n      <p [class.mt-3]=\"toastValue.message\" [class.mt-4]=\"!toastValue.message\">\n        <a [siLink]=\"toastValue.action\">{{\n          toastValue.action!.title | translate: toastValue.translationParams\n        }}</a>\n      </p>\n    }\n  </div>\n  @if (manualClose) {\n    <button\n      type=\"button\"\n      tabindex=\"0\"\n      class=\"btn btn-circle btn-sm btn-ghost mt-n2 me-n2\"\n      [attr.aria-label]=\"closeAriaLabel | translate\"\n      (keydown.enter)=\"close()\"\n      (click)=\"close()\"\n    >\n      <si-icon-next [icon]=\"icons.elementCancel\" />\n    </button>\n  }\n</div>\n", styles: [".si-toast-timer-bar,.si-toast.si-toast-auto-close:before{position:absolute;inset-block-end:0;inset-inline-start:0;block-size:2px}:host{display:block}.si-toast{block-size:auto;position:relative;display:flex;align-items:flex-start;color:var(--element-text-primary);background:var(--element-base-3);border-radius:var(--element-radius-2);padding-inline:12px 8px;padding-block:8px;margin-block-end:20px;font-size:1rem;pointer-events:all;overflow:hidden;min-inline-size:250px;max-inline-size:calc(100vw - 40px)}@media (min-width: 768px){.si-toast{max-inline-size:400px}}.si-toast.si-toast-auto-close{padding-block-end:10px}.si-toast.si-toast-auto-close:before{content:\"\";background:var(--element-ui-4);inset-inline-end:0}.bar{inset-block-start:0;inset-inline-start:0;position:absolute;inline-size:4px;block-size:100%;background:currentColor}@keyframes si-toast-auto-close-animation{0%{inline-size:100%}to{inline-size:0}}.si-toast-timer-bar{animation:si-toast-auto-close-animation var(--toast-timer-duration, 4s) linear forwards;animation-play-state:var(--play-state, running);background-color:var(--element-ui-0)}.toast-content{flex:1;overflow:hidden;white-space:nowrap}.toast-content p{margin-block:0;line-height:1.125rem;white-space:pre-line;overflow-wrap:break-word;word-wrap:break-word}.toast-content .toast-title{line-height:1.5rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SiLinkModule }, { kind: "directive", type: i1.SiLinkDirective, selector: "[siLink]", inputs: ["siLink", "siLinkDefaultTarget", "actionParam", "activeClass", "exactMatch", "ariaCurrent"], outputs: ["activeChange"], exportAs: ["siLink"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }, { kind: "component", type: SiStatusIconComponent, selector: "si-status-icon", inputs: ["status"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SiToastNotificationComponent, isStandalone: true, selector: "si-toast-notification", inputs: { toast: { classPropertyName: "toast", publicName: "toast", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { paused: "paused", resumed: "resumed" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, ngImport: i0, template: "@let toastValue = toast();\n@let autoClose = !toastValue.disableAutoClose;\n@let manualClose = !toastValue.disableManualClose;\n<div class=\"si-toast elevation-2\" [class.si-toast-auto-close]=\"autoClose\">\n  @if (autoClose) {\n    <div\n      class=\"si-toast-timer-bar\"\n      [style.--play-state]=\"animationMode()\"\n      [style.--toast-timer-duration.s]=\"toastTimeoutInSeconds()\"\n    ></div>\n  }\n  <div class=\"bar\" [ngClass]=\"statusColor()\"></div>\n  <si-status-icon class=\"icon\" [status]=\"status()\" />\n\n  <div class=\"toast-content px-4\">\n    <p class=\"toast-title\"\n      ><b>{{ toastValue.title | translate: toastValue.translationParams }}</b></p\n    >\n    @if (toastValue.message) {\n      <p class=\"mt-4\">{{ toastValue.message | translate: toastValue.translationParams }}</p>\n    }\n    @if (toastValue.action) {\n      <p [class.mt-3]=\"toastValue.message\" [class.mt-4]=\"!toastValue.message\">\n        <a [siLink]=\"toastValue.action\">{{\n          toastValue.action!.title | translate: toastValue.translationParams\n        }}</a>\n      </p>\n    }\n  </div>\n  @if (manualClose) {\n    <button\n      type=\"button\"\n      tabindex=\"0\"\n      class=\"btn btn-circle btn-sm btn-ghost mt-n2 me-n2\"\n      [attr.aria-label]=\"closeAriaLabel() | translate\"\n      (keydown.enter)=\"close()\"\n      (click)=\"close()\"\n    >\n      <si-icon [icon]=\"icons.elementCancel\" />\n    </button>\n  }\n</div>\n", styles: [".si-toast-timer-bar,.si-toast.si-toast-auto-close:before{position:absolute;inset-block-end:0;inset-inline-start:0;block-size:2px}:host{display:block}.si-toast{block-size:auto;position:relative;display:flex;align-items:flex-start;color:var(--element-text-primary);background:var(--element-base-3);border-radius:var(--element-radius-2);padding-inline:12px 8px;padding-block:8px;margin-block-end:20px;font-size:1rem;pointer-events:all;overflow:hidden;min-inline-size:250px;max-inline-size:calc(100vw - 40px)}@media (min-width: 768px){.si-toast{max-inline-size:400px}}.si-toast.si-toast-auto-close{padding-block-end:10px}.si-toast.si-toast-auto-close:before{content:\"\";background:var(--element-ui-4);inset-inline-end:0}.bar{inset-block-start:0;inset-inline-start:0;position:absolute;inline-size:4px;block-size:100%;background:currentColor}@keyframes si-toast-auto-close-animation{0%{inline-size:100%}to{inline-size:0}}.si-toast-timer-bar{animation:si-toast-auto-close-animation var(--toast-timer-duration, 4s) linear forwards;animation-play-state:var(--play-state, running);background-color:var(--element-ui-0)}.toast-content{flex:1;overflow:hidden;white-space:nowrap}.toast-content p{margin-block:0;line-height:1.125rem;white-space:pre-line;overflow-wrap:break-word;word-wrap:break-word}.toast-content .toast-title{line-height:1.5rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SiLinkModule }, { kind: "directive", type: i1.SiLinkDirective, selector: "[siLink]", inputs: ["siLink", "siLinkDefaultTarget", "actionParam", "activeClass", "exactMatch", "ariaCurrent"], outputs: ["activeChange"], exportAs: ["siLink"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiStatusIconComponent, selector: "si-status-icon", inputs: ["status"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SiToastNotificationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-toast-notification', imports: [NgClass, SiLinkModule, SiIconNextComponent, SiStatusIconComponent, SiTranslatePipe], template: "@let toastValue = toast();\n@let autoClose = !toastValue.disableAutoClose;\n@let manualClose = !toastValue.disableManualClose;\n<div class=\"si-toast elevation-2\" [class.si-toast-auto-close]=\"autoClose\">\n  @if (autoClose) {\n    <div\n      class=\"si-toast-timer-bar\"\n      [style.--play-state]=\"animationMode()\"\n      [style.--toast-timer-duration.s]=\"toastTimeoutInSeconds()\"\n    ></div>\n  }\n  <div class=\"bar\" [ngClass]=\"statusColor()\"></div>\n  <si-status-icon class=\"icon\" [status]=\"status()\" />\n\n  <div class=\"toast-content px-4\">\n    <p class=\"toast-title\"\n      ><b>{{ toastValue.title | translate: toastValue.translationParams }}</b></p\n    >\n    @if (toastValue.message) {\n      <p class=\"mt-4\">{{ toastValue.message | translate: toastValue.translationParams }}</p>\n    }\n    @if (toastValue.action) {\n      <p [class.mt-3]=\"toastValue.message\" [class.mt-4]=\"!toastValue.message\">\n        <a [siLink]=\"toastValue.action\">{{\n          toastValue.action!.title | translate: toastValue.translationParams\n        }}</a>\n      </p>\n    }\n  </div>\n  @if (manualClose) {\n    <button\n      type=\"button\"\n      tabindex=\"0\"\n      class=\"btn btn-circle btn-sm btn-ghost mt-n2 me-n2\"\n      [attr.aria-label]=\"closeAriaLabel | translate\"\n      (keydown.enter)=\"close()\"\n      (click)=\"close()\"\n    >\n      <si-icon-next [icon]=\"icons.elementCancel\" />\n    </button>\n  }\n</div>\n", styles: [".si-toast-timer-bar,.si-toast.si-toast-auto-close:before{position:absolute;inset-block-end:0;inset-inline-start:0;block-size:2px}:host{display:block}.si-toast{block-size:auto;position:relative;display:flex;align-items:flex-start;color:var(--element-text-primary);background:var(--element-base-3);border-radius:var(--element-radius-2);padding-inline:12px 8px;padding-block:8px;margin-block-end:20px;font-size:1rem;pointer-events:all;overflow:hidden;min-inline-size:250px;max-inline-size:calc(100vw - 40px)}@media (min-width: 768px){.si-toast{max-inline-size:400px}}.si-toast.si-toast-auto-close{padding-block-end:10px}.si-toast.si-toast-auto-close:before{content:\"\";background:var(--element-ui-4);inset-inline-end:0}.bar{inset-block-start:0;inset-inline-start:0;position:absolute;inline-size:4px;block-size:100%;background:currentColor}@keyframes si-toast-auto-close-animation{0%{inline-size:100%}to{inline-size:0}}.si-toast-timer-bar{animation:si-toast-auto-close-animation var(--toast-timer-duration, 4s) linear forwards;animation-play-state:var(--play-state, running);background-color:var(--element-ui-0)}.toast-content{flex:1;overflow:hidden;white-space:nowrap}.toast-content p{margin-block:0;line-height:1.125rem;white-space:pre-line;overflow-wrap:break-word;word-wrap:break-word}.toast-content .toast-title{line-height:1.5rem}\n"] }]
+            args: [{ selector: 'si-toast-notification', imports: [NgClass, SiLinkModule, SiIconComponent, SiStatusIconComponent, SiTranslatePipe], template: "@let toastValue = toast();\n@let autoClose = !toastValue.disableAutoClose;\n@let manualClose = !toastValue.disableManualClose;\n<div class=\"si-toast elevation-2\" [class.si-toast-auto-close]=\"autoClose\">\n  @if (autoClose) {\n    <div\n      class=\"si-toast-timer-bar\"\n      [style.--play-state]=\"animationMode()\"\n      [style.--toast-timer-duration.s]=\"toastTimeoutInSeconds()\"\n    ></div>\n  }\n  <div class=\"bar\" [ngClass]=\"statusColor()\"></div>\n  <si-status-icon class=\"icon\" [status]=\"status()\" />\n\n  <div class=\"toast-content px-4\">\n    <p class=\"toast-title\"\n      ><b>{{ toastValue.title | translate: toastValue.translationParams }}</b></p\n    >\n    @if (toastValue.message) {\n      <p class=\"mt-4\">{{ toastValue.message | translate: toastValue.translationParams }}</p>\n    }\n    @if (toastValue.action) {\n      <p [class.mt-3]=\"toastValue.message\" [class.mt-4]=\"!toastValue.message\">\n        <a [siLink]=\"toastValue.action\">{{\n          toastValue.action!.title | translate: toastValue.translationParams\n        }}</a>\n      </p>\n    }\n  </div>\n  @if (manualClose) {\n    <button\n      type=\"button\"\n      tabindex=\"0\"\n      class=\"btn btn-circle btn-sm btn-ghost mt-n2 me-n2\"\n      [attr.aria-label]=\"closeAriaLabel() | translate\"\n      (keydown.enter)=\"close()\"\n      (click)=\"close()\"\n    >\n      <si-icon [icon]=\"icons.elementCancel\" />\n    </button>\n  }\n</div>\n", styles: [".si-toast-timer-bar,.si-toast.si-toast-auto-close:before{position:absolute;inset-block-end:0;inset-inline-start:0;block-size:2px}:host{display:block}.si-toast{block-size:auto;position:relative;display:flex;align-items:flex-start;color:var(--element-text-primary);background:var(--element-base-3);border-radius:var(--element-radius-2);padding-inline:12px 8px;padding-block:8px;margin-block-end:20px;font-size:1rem;pointer-events:all;overflow:hidden;min-inline-size:250px;max-inline-size:calc(100vw - 40px)}@media (min-width: 768px){.si-toast{max-inline-size:400px}}.si-toast.si-toast-auto-close{padding-block-end:10px}.si-toast.si-toast-auto-close:before{content:\"\";background:var(--element-ui-4);inset-inline-end:0}.bar{inset-block-start:0;inset-inline-start:0;position:absolute;inline-size:4px;block-size:100%;background:currentColor}@keyframes si-toast-auto-close-animation{0%{inline-size:100%}to{inline-size:0}}.si-toast-timer-bar{animation:si-toast-auto-close-animation var(--toast-timer-duration, 4s) linear forwards;animation-play-state:var(--play-state, running);background-color:var(--element-ui-0)}.toast-content{flex:1;overflow:hidden;white-space:nowrap}.toast-content p{margin-block:0;line-height:1.125rem;white-space:pre-line;overflow-wrap:break-word;word-wrap:break-word}.toast-content .toast-title{line-height:1.5rem}\n"] }]
         }], propDecorators: { onMouseEnter: [{
                 type: HostListener,
                 args: ['mouseenter']