npm - @siemens/element-ng - Versions diffs - 49.7.0 → 49.9.0 - Mend

@siemens/element-ng 49.7.0 → 49.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (124) hide show

package/fesm2022/siemens-element-ng-status-toggle.mjs CHANGED Viewed

@@ -167,7 +167,7 @@ class SiStatusToggleComponent {
                 useExisting: forwardRef(() => SiStatusToggleComponent),
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "containerElement", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "draggableElement", first: true, predicate: ["draggable"], descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  #container\n  role=\"radiogroup\"\n  class=\"status-toggle-container\"\n  [class.disabled]=\"isDisabled()\"\n  (mousedown)=\"handleMouseDown($event)\"\n  (touchstart)=\"handleTouchStart($event)\"\n>\n  @let itemsValue = items();\n  <div\n    #draggable\n    class=\"toggle-draggable\"\n    [class.animated]=\"animated()\"\n    [class.disabled]=\"isDisabled()\"\n    [style.inset-inline-start]=\"draggablePosition()\"\n    [style.width.%]=\"100 / itemsValue.length\"\n  >\n    <div class=\"visible-toggle-draggable\"></div>\n  </div>\n\n  @let selIndexValue = selectedIndex();\n  @for (item of itemsValue; track $index) {\n    <div\n      #items\n      class=\"status-toggle-item focus-inside px-4\"\n      role=\"radio\"\n      [attr.aria-checked]=\"$index === selIndexValue\"\n      [attr.tabindex]=\"isDisabled() || item.disabled ? '' : '0'\"\n      [attr.aria-disabled]=\"isDisabled() || item.disabled\"\n      [class.active]=\"$index === selIndexValue\"\n      [class.disabled]=\"item.disabled || isDisabled()\"\n      [style.width.%]=\"100 / $count\"\n      (keydown.enter)=\"selectItem($index)\"\n    >\n      <span class=\"icon icon-stack\">\n        <si-icon\n          [class]=\"$index === selIndexValue ? (item.activeIconClass ?? 'active') : ''\"\n          [icon]=\"$index === selIndexValue ? (item.activeIcon ?? item.icon) : item.icon\"\n        />\n        @if ($index === selIndexValue && item.activeIconStacked) {\n          <si-icon\n            [class]=\"item.activeIconStackedClass ?? `${item.activeIconClass}-contrast`\"\n            [icon]=\"item.activeIconStacked\"\n          />\n        }\n      </span>\n      <span\n        class=\"text-truncate\"\n        [class]=\"$index === selIndexValue ? (item.activeTextClass ?? 'active') : ''\"\n      >\n        {{ item.text | translate }}\n      </span>\n    </div>\n  }\n</div>\n", styles: [":host{display:block;block-size:48px;border:1px solid var(--element-ui-4);border-radius:var(--element-radius-2);background:var(--element-base-2);padding:2px}.status-toggle-container{position:relative;display:flex;gap:2px;inline-size:100%;block-size:100%;border-radius:var(--element-radius-1);justify-content:space-around;z-index:0;-webkit-user-select:none;user-select:none}.status-toggle-container.disabled .toggle-draggable{display:none}.status-toggle-container.disabled .status-toggle-item{color:var(--element-text-disabled)}.status-toggle-item{display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:10;color:var(--element-text-secondary);border-radius:1px;cursor:pointer}.status-toggle-item.active{color:var(--element-text-primary)!important}.status-toggle-item.disabled{cursor:default;color:var(--element-text-disabled)!important}.status-toggle-item span{max-inline-size:100%;-webkit-user-select:none;user-select:none}.toggle-draggable{position:absolute;inset-block:0;z-index:1;cursor:pointer}.toggle-draggable.animated{transition:all .4s ease}.visible-toggle-draggable{inline-size:100%;block-size:100%;border-radius:1px;background:var(--element-base-1-selected)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "containerElement", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "draggableElement", first: true, predicate: ["draggable"], descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  #container\n  role=\"radiogroup\"\n  class=\"status-toggle-container\"\n  [class.disabled]=\"isDisabled()\"\n  (mousedown)=\"handleMouseDown($event)\"\n  (touchstart)=\"handleTouchStart($event)\"\n>\n  @let itemsValue = items();\n  <div\n    #draggable\n    class=\"toggle-draggable\"\n    [class.animated]=\"animated()\"\n    [class.disabled]=\"isDisabled()\"\n    [style.inset-inline-start]=\"draggablePosition()\"\n    [style.width.%]=\"100 / itemsValue.length\"\n  >\n    <div class=\"visible-toggle-draggable\"></div>\n  </div>\n\n  @let selIndexValue = selectedIndex();\n  @for (item of itemsValue; track $index) {\n    <div\n      #items\n      class=\"status-toggle-item focus-inside px-4\"\n      role=\"radio\"\n      [attr.aria-checked]=\"$index === selIndexValue\"\n      [attr.tabindex]=\"isDisabled() || item.disabled ? '' : '0'\"\n      [attr.aria-disabled]=\"isDisabled() || item.disabled\"\n      [class.active]=\"$index === selIndexValue\"\n      [class.disabled]=\"item.disabled || isDisabled()\"\n      [style.width.%]=\"100 / $count\"\n      (keydown.enter)=\"selectItem($index)\"\n    >\n      <span class=\"icon icon-stack\">\n        <si-icon\n          [class]=\"$index === selIndexValue ? (item.activeIconClass ?? 'active') : ''\"\n          [icon]=\"$index === selIndexValue ? (item.activeIcon ?? item.icon) : item.icon\"\n        />\n        @if ($index === selIndexValue && item.activeIconStacked) {\n          <si-icon\n            [class]=\"item.activeIconStackedClass ?? `${item.activeIconClass}-contrast`\"\n            [icon]=\"item.activeIconStacked\"\n          />\n        }\n      </span>\n      <span\n        class=\"text-truncate\"\n        [class]=\"$index === selIndexValue ? (item.activeTextClass ?? 'active') : ''\"\n      >\n        {{ item.text | translate }}\n      </span>\n    </div>\n  }\n</div>\n", styles: [":host{display:block;border:1px solid var(--element-ui-4);border-radius:var(--element-radius-2);background:var(--element-base-2);padding:3px}.status-toggle-container{position:relative;display:flex;gap:2px;inline-size:100%;block-size:100%;border-radius:var(--element-radius-1);justify-content:space-around;z-index:0;-webkit-user-select:none;user-select:none}.status-toggle-container.disabled .toggle-draggable{display:none}.status-toggle-container.disabled .status-toggle-item{color:var(--element-text-disabled)}.status-toggle-item{display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:10;color:var(--element-text-secondary);border-radius:1px;cursor:pointer;padding-block:2px}.status-toggle-item.active{color:var(--element-text-primary)!important}.status-toggle-item.disabled{cursor:default;color:var(--element-text-disabled)!important}.status-toggle-item span{max-inline-size:100%;-webkit-user-select:none;user-select:none}.toggle-draggable{position:absolute;inset-block:0;z-index:1;cursor:pointer}.toggle-draggable.animated{transition:all .4s ease}.visible-toggle-draggable{inline-size:100%;block-size:100%;border-radius:1px;background:var(--element-base-1-selected)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiStatusToggleComponent, decorators: [{
             type: Component,
@@ -178,7 +178,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                             useExisting: forwardRef(() => SiStatusToggleComponent),
                             multi: true
                         }
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  #container\n  role=\"radiogroup\"\n  class=\"status-toggle-container\"\n  [class.disabled]=\"isDisabled()\"\n  (mousedown)=\"handleMouseDown($event)\"\n  (touchstart)=\"handleTouchStart($event)\"\n>\n  @let itemsValue = items();\n  <div\n    #draggable\n    class=\"toggle-draggable\"\n    [class.animated]=\"animated()\"\n    [class.disabled]=\"isDisabled()\"\n    [style.inset-inline-start]=\"draggablePosition()\"\n    [style.width.%]=\"100 / itemsValue.length\"\n  >\n    <div class=\"visible-toggle-draggable\"></div>\n  </div>\n\n  @let selIndexValue = selectedIndex();\n  @for (item of itemsValue; track $index) {\n    <div\n      #items\n      class=\"status-toggle-item focus-inside px-4\"\n      role=\"radio\"\n      [attr.aria-checked]=\"$index === selIndexValue\"\n      [attr.tabindex]=\"isDisabled() || item.disabled ? '' : '0'\"\n      [attr.aria-disabled]=\"isDisabled() || item.disabled\"\n      [class.active]=\"$index === selIndexValue\"\n      [class.disabled]=\"item.disabled || isDisabled()\"\n      [style.width.%]=\"100 / $count\"\n      (keydown.enter)=\"selectItem($index)\"\n    >\n      <span class=\"icon icon-stack\">\n        <si-icon\n          [class]=\"$index === selIndexValue ? (item.activeIconClass ?? 'active') : ''\"\n          [icon]=\"$index === selIndexValue ? (item.activeIcon ?? item.icon) : item.icon\"\n        />\n        @if ($index === selIndexValue && item.activeIconStacked) {\n          <si-icon\n            [class]=\"item.activeIconStackedClass ?? `${item.activeIconClass}-contrast`\"\n            [icon]=\"item.activeIconStacked\"\n          />\n        }\n      </span>\n      <span\n        class=\"text-truncate\"\n        [class]=\"$index === selIndexValue ? (item.activeTextClass ?? 'active') : ''\"\n      >\n        {{ item.text | translate }}\n      </span>\n    </div>\n  }\n</div>\n", styles: [":host{display:block;block-size:48px;border:1px solid var(--element-ui-4);border-radius:var(--element-radius-2);background:var(--element-base-2);padding:2px}.status-toggle-container{position:relative;display:flex;gap:2px;inline-size:100%;block-size:100%;border-radius:var(--element-radius-1);justify-content:space-around;z-index:0;-webkit-user-select:none;user-select:none}.status-toggle-container.disabled .toggle-draggable{display:none}.status-toggle-container.disabled .status-toggle-item{color:var(--element-text-disabled)}.status-toggle-item{display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:10;color:var(--element-text-secondary);border-radius:1px;cursor:pointer}.status-toggle-item.active{color:var(--element-text-primary)!important}.status-toggle-item.disabled{cursor:default;color:var(--element-text-disabled)!important}.status-toggle-item span{max-inline-size:100%;-webkit-user-select:none;user-select:none}.toggle-draggable{position:absolute;inset-block:0;z-index:1;cursor:pointer}.toggle-draggable.animated{transition:all .4s ease}.visible-toggle-draggable{inline-size:100%;block-size:100%;border-radius:1px;background:var(--element-base-1-selected)}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  #container\n  role=\"radiogroup\"\n  class=\"status-toggle-container\"\n  [class.disabled]=\"isDisabled()\"\n  (mousedown)=\"handleMouseDown($event)\"\n  (touchstart)=\"handleTouchStart($event)\"\n>\n  @let itemsValue = items();\n  <div\n    #draggable\n    class=\"toggle-draggable\"\n    [class.animated]=\"animated()\"\n    [class.disabled]=\"isDisabled()\"\n    [style.inset-inline-start]=\"draggablePosition()\"\n    [style.width.%]=\"100 / itemsValue.length\"\n  >\n    <div class=\"visible-toggle-draggable\"></div>\n  </div>\n\n  @let selIndexValue = selectedIndex();\n  @for (item of itemsValue; track $index) {\n    <div\n      #items\n      class=\"status-toggle-item focus-inside px-4\"\n      role=\"radio\"\n      [attr.aria-checked]=\"$index === selIndexValue\"\n      [attr.tabindex]=\"isDisabled() || item.disabled ? '' : '0'\"\n      [attr.aria-disabled]=\"isDisabled() || item.disabled\"\n      [class.active]=\"$index === selIndexValue\"\n      [class.disabled]=\"item.disabled || isDisabled()\"\n      [style.width.%]=\"100 / $count\"\n      (keydown.enter)=\"selectItem($index)\"\n    >\n      <span class=\"icon icon-stack\">\n        <si-icon\n          [class]=\"$index === selIndexValue ? (item.activeIconClass ?? 'active') : ''\"\n          [icon]=\"$index === selIndexValue ? (item.activeIcon ?? item.icon) : item.icon\"\n        />\n        @if ($index === selIndexValue && item.activeIconStacked) {\n          <si-icon\n            [class]=\"item.activeIconStackedClass ?? `${item.activeIconClass}-contrast`\"\n            [icon]=\"item.activeIconStacked\"\n          />\n        }\n      </span>\n      <span\n        class=\"text-truncate\"\n        [class]=\"$index === selIndexValue ? (item.activeTextClass ?? 'active') : ''\"\n      >\n        {{ item.text | translate }}\n      </span>\n    </div>\n  }\n</div>\n", styles: [":host{display:block;border:1px solid var(--element-ui-4);border-radius:var(--element-radius-2);background:var(--element-base-2);padding:3px}.status-toggle-container{position:relative;display:flex;gap:2px;inline-size:100%;block-size:100%;border-radius:var(--element-radius-1);justify-content:space-around;z-index:0;-webkit-user-select:none;user-select:none}.status-toggle-container.disabled .toggle-draggable{display:none}.status-toggle-container.disabled .status-toggle-item{color:var(--element-text-disabled)}.status-toggle-item{display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:10;color:var(--element-text-secondary);border-radius:1px;cursor:pointer;padding-block:2px}.status-toggle-item.active{color:var(--element-text-primary)!important}.status-toggle-item.disabled{cursor:default;color:var(--element-text-disabled)!important}.status-toggle-item span{max-inline-size:100%;-webkit-user-select:none;user-select:none}.toggle-draggable{position:absolute;inset-block:0;z-index:1;cursor:pointer}.toggle-draggable.animated{transition:all .4s ease}.visible-toggle-draggable{inline-size:100%;block-size:100%;border-radius:1px;background:var(--element-base-1-selected)}\n"] }]
         }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], containerElement: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }], draggableElement: [{ type: i0.ViewChild, args: ['draggable', { isSignal: true }] }] } });
 /**

package/fesm2022/siemens-element-ng-status-toggle.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"siemens-element-ng-status-toggle.mjs","sources":["../../../../projects/element-ng/status-toggle/si-status-toggle.component.ts","../../../../projects/element-ng/status-toggle/si-status-toggle.component.html","../../../../projects/element-ng/status-toggle/index.ts","../../../../projects/element-ng/status-toggle/siemens-element-ng-status-toggle.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n forwardRef,\n input,\n model,\n OnChanges,\n OnDestroy,\n OnInit,\n output,\n signal,\n SimpleChanges,\n viewChild\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { isRTL, listenGlobal } from '@siemens/element-ng/common';\nimport { SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\n\nimport { StatusToggleItem } from './status-toggle.model';\n\n@Component({\n selector: 'si-status-toggle',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-status-toggle.component.html',\n styleUrl: './si-status-toggle.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n // eslint-disable-next-line @angular-eslint/no-forward-ref\n useExisting: forwardRef(() => SiStatusToggleComponent),\n multi: true\n }\n ],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiStatusToggleComponent implements ControlValueAccessor, OnInit, OnDestroy, OnChanges {\n /* List of status items. /\n readonly items = input.required<StatusToggleItem[]>();\n /\n Disabled state for the whole component.\n * @defaultValue false\n /\n readonly disabled = input(false);\n / Value of currently selected status item. /\n readonly value = model<string \| number>();\n\n /* Emitted when an item is clicked. /\n readonly itemClick = output<string \| number>();\n\n private readonly containerElement = viewChild.required<ElementRef>('container');\n private readonly draggableElement = viewChild.required<ElementRef>('draggable');\n\n private boundingX = 0;\n private x0 = 0;\n private offset0 = 0;\n private onChange?: (value: string \| number) => void;\n private onTouched?: () => void;\n private unlistenDragEvents: (() => void)[] = [];\n private readonly internalDisabled = signal(false);\n\n protected readonly selectedIndex = signal<number \| undefined>(undefined);\n protected readonly draggablePosition = signal('');\n protected readonly animated = signal(false);\n protected readonly isDisabled = computed(() => this.disabled() \|\| this.internalDisabled());\n\n ngOnChanges(changes: SimpleChanges<this>): void {\n if (changes.value) {\n this.setValue(this.value(), true, false);\n }\n }\n\n ngOnInit(): void {\n const selectedIndex = this.items().findIndex(v => v.value === this.value());\n if (selectedIndex >= 0) {\n this.selectItem(selectedIndex, false, false);\n }\n }\n\n ngOnDestroy(): void {\n this.handleDragEnd();\n }\n\n /* @internal /\n writeValue(value: string \| number): void {\n this.setValue(value, true, false);\n }\n\n /* @internal /\n registerOnChange(fn: (value: string \| number) => void): void {\n this.onChange = fn;\n }\n\n /* @internal /\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /* @internal /\n setDisabledState(isDisabled: boolean): void {\n this.internalDisabled.set(isDisabled);\n }\n\n protected handleMouseDown(event: MouseEvent): void {\n if (this.isDisabled() \|\| event.buttons !== 1) {\n return;\n }\n if (this.handleDragStart(event)) {\n this.unlistenDragEvents.push(listenGlobal('mousemove', e => this.handleDragMove(e)));\n this.unlistenDragEvents.push(listenGlobal('mouseup', e => this.handleDragEnd(e)));\n }\n }\n\n protected handleTouchStart(event: TouchEvent): void {\n if (event.touches.length !== 1 \|\| this.disabled()) {\n return;\n }\n if (this.handleDragStart(event)) {\n this.unlistenDragEvents.push(listenGlobal('touchmove', e => this.handleDragMove(e), true));\n this.unlistenDragEvents.push(listenGlobal('touchend', e => this.handleDragEnd(e)));\n }\n }\n\n private handleDragStart(event: Event): boolean {\n const rect = this.containerElement().nativeElement.getBoundingClientRect();\n this.boundingX = rect.x;\n const draggable = this.draggableElement().nativeElement;\n\n this.offset0 = draggable.offsetLeft;\n this.x0 = this.getX(event);\n\n // adjust for click outside current selection\n const clickIndex = this.getUnderlyingIndex(this.x0, true);\n const currentIndex = this.getUnderlyingIndex(this.offset0);\n const factor = isRTL() ? -1 : 1;\n this.offset0 += (clickIndex - currentIndex) draggable.offsetWidth * factor;\n\n this.handleDragMove(event);\n return true;\n }\n\n private handleDragEnd(event?: Event): void {\n this.arrangeToUnderlyingItem(event);\n this.unlistenDragEvents.forEach(handler => handler());\n this.unlistenDragEvents.length = 0;\n }\n\n private getOffset(event: Event, isStart = false): number {\n const containerWidth = this.containerElement().nativeElement.clientWidth;\n const draggableWidth = this.draggableElement().nativeElement.clientWidth;\n\n const dX = this.getX(event) - this.x0;\n const left = Math.min(Math.max(0, this.offset0 + dX), containerWidth - draggableWidth);\n return isStart && isRTL() ? containerWidth - draggableWidth - left : left;\n }\n\n private getUnderlyingIndex(offsetLeft: number, floor = false): number {\n const pos = offsetLeft / this.draggableElement().nativeElement.clientWidth;\n const element = floor ? Math.floor(pos) : Math.round(pos);\n const len = this.items().length;\n const index = isRTL() ? len - element - 1 : element;\n return Math.max(0, Math.min(len - 1, index));\n }\n\n private arrangeToUnderlyingItem(event?: Event): void {\n if (event && !this.isDisabled()) {\n const index = this.getUnderlyingIndex(this.getOffset(event));\n this.selectItem(this.items()[index].disabled ? this.selectedIndex() : index);\n this.onTouched?.();\n }\n }\n\n private handleDragMove(event: Event): void {\n if (event.cancelable) {\n event.preventDefault();\n event.stopPropagation();\n }\n this.draggablePosition.set(`${this.getOffset(event, true)}px`);\n this.animated.set(false);\n }\n\n private getX(event: Event): number {\n const clientX =\n (event as MouseEvent).clientX ?? (event as TouchEvent).changedTouches[0]?.clientX ?? 0;\n return clientX - this.boundingX;\n }\n\n private setValue(val?: string \| number, animated = true, emit = false): void {\n this.selectItem(\n this.items().findIndex(v => v.value === val),\n animated,\n emit\n );\n }\n\n protected selectItem(index: number \| undefined, animated = true, emit = true): void {\n if (index === undefined \|\| index === -1 \|\| this.isDisabled()) {\n return;\n }\n\n const values = this.items();\n const value = values[index];\n if (!value.disabled) {\n const prevIndex = this.selectedIndex();\n\n this.value.set(value.value);\n this.animated.set(animated);\n this.selectedIndex.set(index);\n this.draggablePosition.set(`${(100 / values.length) * index}%`);\n\n if (emit && index !== prevIndex) {\n if (this.onChange) {\n this.onChange(this.value()!);\n }\n }\n\n if (emit) {\n this.itemClick.emit(this.value()!);\n }\n }\n }\n}\n","<div\n #container\n role=\"radiogroup\"\n class=\"status-toggle-container\"\n [class.disabled]=\"isDisabled()\"\n (mousedown)=\"handleMouseDown($event)\"\n (touchstart)=\"handleTouchStart($event)\"\n>\n @let itemsValue = items();\n <div\n #draggable\n class=\"toggle-draggable\"\n [class.animated]=\"animated()\"\n [class.disabled]=\"isDisabled()\"\n [style.inset-inline-start]=\"draggablePosition()\"\n [style.width.%]=\"100 / itemsValue.length\"\n >\n <div class=\"visible-toggle-draggable\"></div>\n </div>\n\n @let selIndexValue = selectedIndex();\n @for (item of itemsValue; track $index) {\n <div\n #items\n class=\"status-toggle-item focus-inside px-4\"\n role=\"radio\"\n [attr.aria-checked]=\"$index === selIndexValue\"\n [attr.tabindex]=\"isDisabled() \|\| item.disabled ? '' : '0'\"\n [attr.aria-disabled]=\"isDisabled() \|\| item.disabled\"\n [class.active]=\"$index === selIndexValue\"\n [class.disabled]=\"item.disabled \|\| isDisabled()\"\n [style.width.%]=\"100 / $count\"\n (keydown.enter)=\"selectItem($index)\"\n >\n <span class=\"icon icon-stack\">\n <si-icon\n [class]=\"$index === selIndexValue ? (item.activeIconClass ?? 'active') : ''\"\n [icon]=\"$index === selIndexValue ? (item.activeIcon ?? item.icon) : item.icon\"\n />\n @if ($index === selIndexValue && item.activeIconStacked) {\n <si-icon\n [class]=\"item.activeIconStackedClass ?? `${item.activeIconClass}-contrast`\"\n [icon]=\"item.activeIconStacked\"\n />\n }\n </span>\n <span\n class=\"text-truncate\"\n [class]=\"$index === selIndexValue ? (item.activeTextClass ?? 'active') : ''\"\n >\n {{ item.text \| translate }}\n </span>\n </div>\n }\n</div>\n","/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-status-toggle.component';\nexport * from './status-toggle.model';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"siemens-element-ng-status-toggle.mjs","sources":["../../../../projects/element-ng/status-toggle/si-status-toggle.component.ts","../../../../projects/element-ng/status-toggle/si-status-toggle.component.html","../../../../projects/element-ng/status-toggle/index.ts","../../../../projects/element-ng/status-toggle/siemens-element-ng-status-toggle.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n forwardRef,\n input,\n model,\n OnChanges,\n OnDestroy,\n OnInit,\n output,\n signal,\n SimpleChanges,\n viewChild\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { isRTL, listenGlobal } from '@siemens/element-ng/common';\nimport { SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\n\nimport { StatusToggleItem } from './status-toggle.model';\n\n@Component({\n selector: 'si-status-toggle',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-status-toggle.component.html',\n styleUrl: './si-status-toggle.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n // eslint-disable-next-line @angular-eslint/no-forward-ref\n useExisting: forwardRef(() => SiStatusToggleComponent),\n multi: true\n }\n ],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiStatusToggleComponent implements ControlValueAccessor, OnInit, OnDestroy, OnChanges {\n /* List of status items. /\n readonly items = input.required<StatusToggleItem[]>();\n /\n Disabled state for the whole component.\n * @defaultValue false\n /\n readonly disabled = input(false);\n / Value of currently selected status item. /\n readonly value = model<string \| number>();\n\n /* Emitted when an item is clicked. /\n readonly itemClick = output<string \| number>();\n\n private readonly containerElement = viewChild.required<ElementRef>('container');\n private readonly draggableElement = viewChild.required<ElementRef>('draggable');\n\n private boundingX = 0;\n private x0 = 0;\n private offset0 = 0;\n private onChange?: (value: string \| number) => void;\n private onTouched?: () => void;\n private unlistenDragEvents: (() => void)[] = [];\n private readonly internalDisabled = signal(false);\n\n protected readonly selectedIndex = signal<number \| undefined>(undefined);\n protected readonly draggablePosition = signal('');\n protected readonly animated = signal(false);\n protected readonly isDisabled = computed(() => this.disabled() \|\| this.internalDisabled());\n\n ngOnChanges(changes: SimpleChanges<this>): void {\n if (changes.value) {\n this.setValue(this.value(), true, false);\n }\n }\n\n ngOnInit(): void {\n const selectedIndex = this.items().findIndex(v => v.value === this.value());\n if (selectedIndex >= 0) {\n this.selectItem(selectedIndex, false, false);\n }\n }\n\n ngOnDestroy(): void {\n this.handleDragEnd();\n }\n\n /* @internal /\n writeValue(value: string \| number): void {\n this.setValue(value, true, false);\n }\n\n /* @internal /\n registerOnChange(fn: (value: string \| number) => void): void {\n this.onChange = fn;\n }\n\n /* @internal /\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /* @internal /\n setDisabledState(isDisabled: boolean): void {\n this.internalDisabled.set(isDisabled);\n }\n\n protected handleMouseDown(event: MouseEvent): void {\n if (this.isDisabled() \|\| event.buttons !== 1) {\n return;\n }\n if (this.handleDragStart(event)) {\n this.unlistenDragEvents.push(listenGlobal('mousemove', e => this.handleDragMove(e)));\n this.unlistenDragEvents.push(listenGlobal('mouseup', e => this.handleDragEnd(e)));\n }\n }\n\n protected handleTouchStart(event: TouchEvent): void {\n if (event.touches.length !== 1 \|\| this.disabled()) {\n return;\n }\n if (this.handleDragStart(event)) {\n this.unlistenDragEvents.push(listenGlobal('touchmove', e => this.handleDragMove(e), true));\n this.unlistenDragEvents.push(listenGlobal('touchend', e => this.handleDragEnd(e)));\n }\n }\n\n private handleDragStart(event: Event): boolean {\n const rect = this.containerElement().nativeElement.getBoundingClientRect();\n this.boundingX = rect.x;\n const draggable = this.draggableElement().nativeElement;\n\n this.offset0 = draggable.offsetLeft;\n this.x0 = this.getX(event);\n\n // adjust for click outside current selection\n const clickIndex = this.getUnderlyingIndex(this.x0, true);\n const currentIndex = this.getUnderlyingIndex(this.offset0);\n const factor = isRTL() ? -1 : 1;\n this.offset0 += (clickIndex - currentIndex) draggable.offsetWidth * factor;\n\n this.handleDragMove(event);\n return true;\n }\n\n private handleDragEnd(event?: Event): void {\n this.arrangeToUnderlyingItem(event);\n this.unlistenDragEvents.forEach(handler => handler());\n this.unlistenDragEvents.length = 0;\n }\n\n private getOffset(event: Event, isStart = false): number {\n const containerWidth = this.containerElement().nativeElement.clientWidth;\n const draggableWidth = this.draggableElement().nativeElement.clientWidth;\n\n const dX = this.getX(event) - this.x0;\n const left = Math.min(Math.max(0, this.offset0 + dX), containerWidth - draggableWidth);\n return isStart && isRTL() ? containerWidth - draggableWidth - left : left;\n }\n\n private getUnderlyingIndex(offsetLeft: number, floor = false): number {\n const pos = offsetLeft / this.draggableElement().nativeElement.clientWidth;\n const element = floor ? Math.floor(pos) : Math.round(pos);\n const len = this.items().length;\n const index = isRTL() ? len - element - 1 : element;\n return Math.max(0, Math.min(len - 1, index));\n }\n\n private arrangeToUnderlyingItem(event?: Event): void {\n if (event && !this.isDisabled()) {\n const index = this.getUnderlyingIndex(this.getOffset(event));\n this.selectItem(this.items()[index].disabled ? this.selectedIndex() : index);\n this.onTouched?.();\n }\n }\n\n private handleDragMove(event: Event): void {\n if (event.cancelable) {\n event.preventDefault();\n event.stopPropagation();\n }\n this.draggablePosition.set(`${this.getOffset(event, true)}px`);\n this.animated.set(false);\n }\n\n private getX(event: Event): number {\n const clientX =\n (event as MouseEvent).clientX ?? (event as TouchEvent).changedTouches[0]?.clientX ?? 0;\n return clientX - this.boundingX;\n }\n\n private setValue(val?: string \| number, animated = true, emit = false): void {\n this.selectItem(\n this.items().findIndex(v => v.value === val),\n animated,\n emit\n );\n }\n\n protected selectItem(index: number \| undefined, animated = true, emit = true): void {\n if (index === undefined \|\| index === -1 \|\| this.isDisabled()) {\n return;\n }\n\n const values = this.items();\n const value = values[index];\n if (!value.disabled) {\n const prevIndex = this.selectedIndex();\n\n this.value.set(value.value);\n this.animated.set(animated);\n this.selectedIndex.set(index);\n this.draggablePosition.set(`${(100 / values.length) * index}%`);\n\n if (emit && index !== prevIndex) {\n if (this.onChange) {\n this.onChange(this.value()!);\n }\n }\n\n if (emit) {\n this.itemClick.emit(this.value()!);\n }\n }\n }\n}\n","<div\n #container\n role=\"radiogroup\"\n class=\"status-toggle-container\"\n [class.disabled]=\"isDisabled()\"\n (mousedown)=\"handleMouseDown($event)\"\n (touchstart)=\"handleTouchStart($event)\"\n>\n @let itemsValue = items();\n <div\n #draggable\n class=\"toggle-draggable\"\n [class.animated]=\"animated()\"\n [class.disabled]=\"isDisabled()\"\n [style.inset-inline-start]=\"draggablePosition()\"\n [style.width.%]=\"100 / itemsValue.length\"\n >\n <div class=\"visible-toggle-draggable\"></div>\n </div>\n\n @let selIndexValue = selectedIndex();\n @for (item of itemsValue; track $index) {\n <div\n #items\n class=\"status-toggle-item focus-inside px-4\"\n role=\"radio\"\n [attr.aria-checked]=\"$index === selIndexValue\"\n [attr.tabindex]=\"isDisabled() \|\| item.disabled ? '' : '0'\"\n [attr.aria-disabled]=\"isDisabled() \|\| item.disabled\"\n [class.active]=\"$index === selIndexValue\"\n [class.disabled]=\"item.disabled \|\| isDisabled()\"\n [style.width.%]=\"100 / $count\"\n (keydown.enter)=\"selectItem($index)\"\n >\n <span class=\"icon icon-stack\">\n <si-icon\n [class]=\"$index === selIndexValue ? (item.activeIconClass ?? 'active') : ''\"\n [icon]=\"$index === selIndexValue ? (item.activeIcon ?? item.icon) : item.icon\"\n />\n @if ($index === selIndexValue && item.activeIconStacked) {\n <si-icon\n [class]=\"item.activeIconStackedClass ?? `${item.activeIconClass}-contrast`\"\n [icon]=\"item.activeIconStacked\"\n />\n }\n </span>\n <span\n class=\"text-truncate\"\n [class]=\"$index === selIndexValue ? (item.activeTextClass ?? 'active') : ''\"\n >\n {{ item.text \| translate }}\n </span>\n </div>\n }\n</div>\n","/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-status-toggle.component';\nexport * from './status-toggle.model';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/siemens-element-ng-summary-chip.mjs CHANGED Viewed

@@ -55,11 +55,11 @@ class SiSummaryChipComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSummaryChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiSummaryChipComponent, isStandalone: true, selector: "si-summary-chip", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, stackedIcon: { classPropertyName: "stackedIcon", publicName: "stackedIcon", isSignal: true, isRequired: false, transformFunction: null }, stackedColor: { classPropertyName: "stackedColor", publicName: "stackedColor", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hideLabel: { classPropertyName: "hideLabel", publicName: "hideLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, ngImport: i0, template: "<div\n  class=\"chip\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"disabled() ? '' : '0'\"\n  [attr.aria-disabled]=\"disabled()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack my-n2 ms-n2\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  @let value = this.value();\n  <div class=\"si-body\" [class.visually-hidden]=\"hideLabel() && value && actualIcon.icon\">\n    {{ label() | translate }}\n  </div>\n  @if (value) {\n    <div class=\"si-h5\">{{ value | translate }}</div>\n  }\n</div>\n", styles: [".chip{display:inline-flex;align-items:center;border:1px solid var(--element-ui-3);border-radius:16px;padding-block:7px;padding-inline:8px;gap:4px}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiSummaryChipComponent, isStandalone: true, selector: "si-summary-chip", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, stackedIcon: { classPropertyName: "stackedIcon", publicName: "stackedIcon", isSignal: true, isRequired: false, transformFunction: null }, stackedColor: { classPropertyName: "stackedColor", publicName: "stackedColor", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hideLabel: { classPropertyName: "hideLabel", publicName: "hideLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, ngImport: i0, template: "<div\n  class=\"chip\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"disabled() ? '' : '0'\"\n  [attr.aria-disabled]=\"disabled()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n  (keydown.space)=\"$event.preventDefault(); toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack my-n2 ms-n2\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  @let value = this.value();\n  <div class=\"si-body\" [class.visually-hidden]=\"hideLabel() && value && actualIcon.icon\">\n    {{ label() | translate }}\n  </div>\n  @if (value) {\n    <div class=\"si-h5\">{{ value | translate }}</div>\n  }\n</div>\n", styles: [".chip{display:inline-flex;align-items:center;border:1px solid var(--element-ui-3);border-radius:16px;padding-block:7px;padding-inline:8px;gap:4px}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSummaryChipComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-summary-chip', imports: [SiIconComponent, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"chip\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"disabled() ? '' : '0'\"\n  [attr.aria-disabled]=\"disabled()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack my-n2 ms-n2\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  @let value = this.value();\n  <div class=\"si-body\" [class.visually-hidden]=\"hideLabel() && value && actualIcon.icon\">\n    {{ label() | translate }}\n  </div>\n  @if (value) {\n    <div class=\"si-h5\">{{ value | translate }}</div>\n  }\n</div>\n", styles: [".chip{display:inline-flex;align-items:center;border:1px solid var(--element-ui-3);border-radius:16px;padding-block:7px;padding-inline:8px;gap:4px}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"] }]
+            args: [{ selector: 'si-summary-chip', imports: [SiIconComponent, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"chip\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"disabled() ? '' : '0'\"\n  [attr.aria-disabled]=\"disabled()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n  (keydown.space)=\"$event.preventDefault(); toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack my-n2 ms-n2\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  @let value = this.value();\n  <div class=\"si-body\" [class.visually-hidden]=\"hideLabel() && value && actualIcon.icon\">\n    {{ label() | translate }}\n  </div>\n  @if (value) {\n    <div class=\"si-h5\">{{ value | translate }}</div>\n  }\n</div>\n", styles: [".chip{display:inline-flex;align-items:center;border:1px solid var(--element-ui-3);border-radius:16px;padding-block:7px;padding-inline:8px;gap:4px}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"] }]
         }], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], stackedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "stackedIcon", required: false }] }], stackedColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "stackedColor", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }, { type: i0.Output, args: ["selectedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hideLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideLabel", required: false }] }] } });
 /**

package/fesm2022/siemens-element-ng-summary-chip.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"siemens-element-ng-summary-chip.mjs","sources":["../../../../projects/element-ng/summary-chip/si-summary-chip.component.ts","../../../../projects/element-ng/summary-chip/si-summary-chip.component.html","../../../../projects/element-ng/summary-chip/index.ts","../../../../projects/element-ng/summary-chip/siemens-element-ng-summary-chip.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n inject,\n input,\n model\n} from '@angular/core';\nimport { ExtendedStatusType } from '@siemens/element-ng/common';\nimport { SiIconComponent, STATUS_ICON_CONFIG } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, TranslatableString } from '@siemens/element-translate-ng/translate';\n\n@Component({\n selector: 'si-summary-chip',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-summary-chip.component.html',\n styleUrl: './si-summary-chip.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiSummaryChipComponent {\n private readonly statusIcons = inject(STATUS_ICON_CONFIG);\n /* Status. Alternatively, use {@link icon} and {@link color}. /\n readonly status = input<ExtendedStatusType>();\n /* Icon token, see {@link https://element.siemens.io/icons/element}. /\n readonly icon = input<string>();\n /* Color class, see {@link https://element.siemens.io/typography/#color-variants-classes}. /\n readonly color = input<string>();\n /* Icon token, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedIcon = input<string>();\n /* Color class, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedColor = input<string>();\n /* The label. /\n readonly label = input.required<TranslatableString>();\n /* Value to display. /\n readonly value = input<TranslatableString>();\n /\n Selected state, will change when clicked.\n * @defaultValue false\n /\n readonly selected = model(false);\n /\n Disabled state.\n * @defaultValue false\n /\n readonly disabled = input(false, { transform: booleanAttribute });\n /\n Whether to hide the label. Only takes effect when both {@link icon} and {@link value} are provided. The label will still be used for screen-readers.\n * @defaultValue false\n /\n readonly hideLabel = input(false, { transform: booleanAttribute });\n\n protected readonly statusIcon = computed(() => {\n const status = this.status();\n return status\n ? this.statusIcons[status]\n : {\n icon: this.icon(),\n color: this.color(),\n stacked: this.stackedIcon(),\n stackedColor: this.stackedColor()\n };\n });\n\n protected toggleSelected(): void {\n if (!this.disabled()) {\n this.selected.set(!this.selected());\n }\n }\n}\n","<div\n class=\"chip\"\n role=\"checkbox\"\n [attr.tabindex]=\"disabled() ? '' : '0'\"\n [attr.aria-disabled]=\"disabled()\"\n [attr.aria-checked]=\"selected()\"\n [class.selected]=\"selected()\"\n [class.disabled]=\"disabled()\"\n (click)=\"toggleSelected()\"\n (keydown.enter)=\"toggleSelected()\"\n>\n @let actualIcon = statusIcon();\n @if (actualIcon.icon) {\n <span class=\"icon icon-stack my-n2 ms-n2\">\n <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n @if (actualIcon.stacked) {\n <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n }\n </span>\n }\n @let value = this.value();\n <div class=\"si-body\" [class.visually-hidden]=\"hideLabel() && value && actualIcon.icon\">\n {{ label() \| translate }}\n </div>\n @if (value) {\n <div class=\"si-h5\">{{ value \| translate }}</div>\n }\n</div>\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-summary-chip.component';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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~~q4BA4BA~~,EAAA,MAAA,EAAA,CAAA,wXAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,~~EDTY~~,eAAe,iEAAE,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAK/B,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAPlC,SAAS;+BACE,iBAAiB,EAAA,OAAA,EAClB,CAAC,eAAe,EAAE,eAAe,CAAC,EAAA,eAAA,EAG1B,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,~~q4BAAA~~,EAAA,MAAA,EAAA,CAAA,wXAAA,CAAA,EAAA;;;AEtBjD;;;AAGG;;ACHH;;AAEG;;;;"}
1	+ {"version":3,"file":"siemens-element-ng-summary-chip.mjs","sources":["../../../../projects/element-ng/summary-chip/si-summary-chip.component.ts","../../../../projects/element-ng/summary-chip/si-summary-chip.component.html","../../../../projects/element-ng/summary-chip/index.ts","../../../../projects/element-ng/summary-chip/siemens-element-ng-summary-chip.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n inject,\n input,\n model\n} from '@angular/core';\nimport { ExtendedStatusType } from '@siemens/element-ng/common';\nimport { SiIconComponent, STATUS_ICON_CONFIG } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, TranslatableString } from '@siemens/element-translate-ng/translate';\n\n@Component({\n selector: 'si-summary-chip',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-summary-chip.component.html',\n styleUrl: './si-summary-chip.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiSummaryChipComponent {\n private readonly statusIcons = inject(STATUS_ICON_CONFIG);\n /* Status. Alternatively, use {@link icon} and {@link color}. /\n readonly status = input<ExtendedStatusType>();\n /* Icon token, see {@link https://element.siemens.io/icons/element}. /\n readonly icon = input<string>();\n /* Color class, see {@link https://element.siemens.io/typography/#color-variants-classes}. /\n readonly color = input<string>();\n /* Icon token, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedIcon = input<string>();\n /* Color class, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedColor = input<string>();\n /* The label. /\n readonly label = input.required<TranslatableString>();\n /* Value to display. /\n readonly value = input<TranslatableString>();\n /\n Selected state, will change when clicked.\n * @defaultValue false\n /\n readonly selected = model(false);\n /\n Disabled state.\n * @defaultValue false\n /\n readonly disabled = input(false, { transform: booleanAttribute });\n /\n Whether to hide the label. Only takes effect when both {@link icon} and {@link value} are provided. The label will still be used for screen-readers.\n * @defaultValue false\n /\n readonly hideLabel = input(false, { transform: booleanAttribute });\n\n protected readonly statusIcon = computed(() => {\n const status = this.status();\n return status\n ? this.statusIcons[status]\n : {\n icon: this.icon(),\n color: this.color(),\n stacked: this.stackedIcon(),\n stackedColor: this.stackedColor()\n };\n });\n\n protected toggleSelected(): void {\n if (!this.disabled()) {\n this.selected.set(!this.selected());\n }\n }\n}\n","<div\n class=\"chip\"\n role=\"checkbox\"\n [attr.tabindex]=\"disabled() ? '' : '0'\"\n [attr.aria-disabled]=\"disabled()\"\n [attr.aria-checked]=\"selected()\"\n [class.selected]=\"selected()\"\n [class.disabled]=\"disabled()\"\n (click)=\"toggleSelected()\"\n (keydown.enter)=\"toggleSelected()\"\n (keydown.space)=\"$event.preventDefault(); toggleSelected()\"\n>\n @let actualIcon = statusIcon();\n @if (actualIcon.icon) {\n <span class=\"icon icon-stack my-n2 ms-n2\">\n <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n @if (actualIcon.stacked) {\n <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n }\n </span>\n }\n @let value = this.value();\n <div class=\"si-body\" [class.visually-hidden]=\"hideLabel() && value && actualIcon.icon\">\n {{ label() \| translate }}\n </div>\n @if (value) {\n <div class=\"si-h5\">{{ value \| translate }}</div>\n }\n</div>\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-summary-chip.component';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;AAAA;;;AAGG;MAqBU,sBAAsB,CAAA;AAChB,IAAA,WAAW,GAAG,MAAM,CAAC,kBAAkB,CAAC;;IAEhD,MAAM,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAsB;;IAEpC,IAAI,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;;IAEtB,KAAK,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,OAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;;IAEvB,WAAW,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,aAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;;IAE7B,YAAY,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,cAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;;AAE9B,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAsB;;IAE5C,KAAK,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,OAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAsB;AAC5C;;;AAGG;AACM,IAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,oDAAC;AAChC;;;AAGG;IACM,QAAQ,GAAG,KAAK,CAAC,KAAK,qDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AACjE;;;AAGG;IACM,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAE/C,IAAA,UAAU,GAAG,QAAQ,CAAC,MAAK;AAC5C,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;AAC5B,QAAA,OAAO;AACL,cAAE,IAAI,CAAC,WAAW,CAAC,MAAM;AACzB,cAAE;AACE,gBAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE;AACjB,gBAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE;AACnB,gBAAA,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE;AAC3B,gBAAA,YAAY,EAAE,IAAI,CAAC,YAAY;aAChC;AACP,IAAA,CAAC,sDAAC;IAEQ,cAAc,GAAA;AACtB,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE;YACpB,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;QACrC;IACF;uGAhDW,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAtB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,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,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,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,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,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,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECxBnC,s8BA6BA,EAAA,MAAA,EAAA,CAAA,wXAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDVY,eAAe,iEAAE,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAK/B,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAPlC,SAAS;+BACE,iBAAiB,EAAA,OAAA,EAClB,CAAC,eAAe,EAAE,eAAe,CAAC,EAAA,eAAA,EAG1B,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,s8BAAA,EAAA,MAAA,EAAA,CAAA,wXAAA,CAAA,EAAA;;;AEtBjD;;;AAGG;;ACHH;;AAEG;;;;"}

package/fesm2022/siemens-element-ng-summary-widget.mjs CHANGED Viewed

@@ -56,11 +56,11 @@ class SiSummaryWidgetComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSummaryWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiSummaryWidgetComponent, isStandalone: true, selector: "si-summary-widget", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, stackedIcon: { classPropertyName: "stackedIcon", publicName: "stackedIcon", isSignal: true, isRequired: false, transformFunction: null }, stackedColor: { classPropertyName: "stackedColor", publicName: "stackedColor", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, ngImport: i0, template: "<div\n  class=\"widget ps-2 pe-4 gap-2\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"interactive() ? '0' : ''\"\n  [attr.aria-disabled]=\"!interactive()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  [class.interactive]=\"interactive()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  <div class=\"d-flex flex-column py-2\" [class.ps-2]=\"!actualIcon.icon\">\n    <div class=\"si-h5\">{{ value() | translate }}</div>\n    <div class=\"si-body text-secondary\">{{ label() | translate }}</div>\n  </div>\n</div>\n", styles: [".widget{display:inline-flex;align-items:start;block-size:100%;border-radius:var(--element-radius-1)}.widget.interactive{cursor:pointer}.widget.interactive:not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiSummaryWidgetComponent, isStandalone: true, selector: "si-summary-widget", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, stackedIcon: { classPropertyName: "stackedIcon", publicName: "stackedIcon", isSignal: true, isRequired: false, transformFunction: null }, stackedColor: { classPropertyName: "stackedColor", publicName: "stackedColor", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, ngImport: i0, template: "<div\n  class=\"widget ps-2 pe-4 gap-2\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"interactive() ? '0' : ''\"\n  [attr.aria-disabled]=\"!interactive()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  [class.interactive]=\"interactive()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n  (keydown.space)=\"$event.preventDefault(); toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  <div class=\"d-flex flex-column py-2\" [class.ps-2]=\"!actualIcon.icon\">\n    <div class=\"si-h5\">{{ value() | translate }}</div>\n    <div class=\"si-body text-secondary\">{{ label() | translate }}</div>\n  </div>\n</div>\n", styles: [".widget{display:inline-flex;align-items:start;block-size:100%;border-radius:var(--element-radius-1)}.widget.interactive{cursor:pointer}.widget.interactive:not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSummaryWidgetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-summary-widget', imports: [SiIconComponent, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"widget ps-2 pe-4 gap-2\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"interactive() ? '0' : ''\"\n  [attr.aria-disabled]=\"!interactive()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  [class.interactive]=\"interactive()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  <div class=\"d-flex flex-column py-2\" [class.ps-2]=\"!actualIcon.icon\">\n    <div class=\"si-h5\">{{ value() | translate }}</div>\n    <div class=\"si-body text-secondary\">{{ label() | translate }}</div>\n  </div>\n</div>\n", styles: [".widget{display:inline-flex;align-items:start;block-size:100%;border-radius:var(--element-radius-1)}.widget.interactive{cursor:pointer}.widget.interactive:not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"] }]
+            args: [{ selector: 'si-summary-widget', imports: [SiIconComponent, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"widget ps-2 pe-4 gap-2\"\n  role=\"checkbox\"\n  [attr.tabindex]=\"interactive() ? '0' : ''\"\n  [attr.aria-disabled]=\"!interactive()\"\n  [attr.aria-checked]=\"selected()\"\n  [class.selected]=\"selected()\"\n  [class.disabled]=\"disabled()\"\n  [class.interactive]=\"interactive()\"\n  (click)=\"toggleSelected()\"\n  (keydown.enter)=\"toggleSelected()\"\n  (keydown.space)=\"$event.preventDefault(); toggleSelected()\"\n>\n  @let actualIcon = statusIcon();\n  @if (actualIcon.icon) {\n    <span class=\"icon icon-stack\">\n      <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n      @if (actualIcon.stacked) {\n        <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n      }\n    </span>\n  }\n  <div class=\"d-flex flex-column py-2\" [class.ps-2]=\"!actualIcon.icon\">\n    <div class=\"si-h5\">{{ value() | translate }}</div>\n    <div class=\"si-body text-secondary\">{{ label() | translate }}</div>\n  </div>\n</div>\n", styles: [".widget{display:inline-flex;align-items:start;block-size:100%;border-radius:var(--element-radius-1)}.widget.interactive{cursor:pointer}.widget.interactive:not(.selected):hover{background:var(--element-base-1-hover)}.selected{background:var(--element-base-1-selected)}.disabled{opacity:var(--element-action-disabled-opacity)}\n"] }]
         }], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], stackedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "stackedIcon", required: false }] }], stackedColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "stackedColor", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }, { type: i0.Output, args: ["selectedChange"] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 /**

package/fesm2022/siemens-element-ng-summary-widget.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"siemens-element-ng-summary-widget.mjs","sources":["../../../../projects/element-ng/summary-widget/si-summary-widget.component.ts","../../../../projects/element-ng/summary-widget/si-summary-widget.component.html","../../../../projects/element-ng/summary-widget/index.ts","../../../../projects/element-ng/summary-widget/siemens-element-ng-summary-widget.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n input,\n model\n} from '@angular/core';\nimport { ExtendedStatusType, STATUS_ICON } from '@siemens/element-ng/common';\nimport { SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, TranslatableString } from '@siemens/element-translate-ng/translate';\n\n@Component({\n selector: 'si-summary-widget',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-summary-widget.component.html',\n styleUrl: './si-summary-widget.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiSummaryWidgetComponent {\n /* Status. Alternatively, use {@link icon} and {@link color}. /\n readonly status = input<ExtendedStatusType>();\n /* Icon token, see {@link https://element.siemens.io/icons/element}. /\n readonly icon = input<string>();\n /* Color class, see {@link https://element.siemens.io/fundamentals/typography/#color-variants-classes}. /\n readonly color = input<string>();\n /* Icon token, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedIcon = input<string>();\n /* Color class, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedColor = input<string>();\n /* The label. /\n readonly label = input.required<TranslatableString>();\n /* Value to display. /\n readonly value = input.required<TranslatableString>();\n /\n Selected state, will change when clicked.\n * @defaultValue false\n /\n readonly selected = model(false);\n /\n Readonly state.\n * @defaultValue false\n /\n readonly readonly = input(false, { transform: booleanAttribute });\n /\n Disabled state.\n * @defaultValue false\n /\n readonly disabled = input(false, { transform: booleanAttribute });\n\n protected readonly interactive = computed(() => !this.disabled() && !this.readonly());\n\n protected readonly statusIcon = computed(() => {\n const status = this.status();\n return status\n ? STATUS_ICON[status]\n : {\n icon: this.icon(),\n color: this.color(),\n stacked: this.stackedIcon(),\n stackedColor: this.stackedColor()\n };\n });\n\n protected toggleSelected(): void {\n if (this.interactive()) {\n this.selected.set(!this.selected());\n }\n }\n}\n","<div\n class=\"widget ps-2 pe-4 gap-2\"\n role=\"checkbox\"\n [attr.tabindex]=\"interactive() ? '0' : ''\"\n [attr.aria-disabled]=\"!interactive()\"\n [attr.aria-checked]=\"selected()\"\n [class.selected]=\"selected()\"\n [class.disabled]=\"disabled()\"\n [class.interactive]=\"interactive()\"\n (click)=\"toggleSelected()\"\n (keydown.enter)=\"toggleSelected()\"\n>\n @let actualIcon = statusIcon();\n @if (actualIcon.icon) {\n <span class=\"icon icon-stack\">\n <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n @if (actualIcon.stacked) {\n <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n }\n </span>\n }\n <div class=\"d-flex flex-column py-2\" [class.ps-2]=\"!actualIcon.icon\">\n <div class=\"si-h5\">{{ value() \| translate }}</div>\n <div class=\"si-body text-secondary\">{{ label() \| translate }}</div>\n </div>\n</div>\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-summary-widget.component';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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~~m6BA0BA~~,EAAA,MAAA,EAAA,CAAA,wUAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,~~EDRY~~,eAAe,iEAAE,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAK/B,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;+BACE,mBAAmB,EAAA,OAAA,EACpB,CAAC,eAAe,EAAE,eAAe,CAAC,EAAA,eAAA,EAG1B,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,~~m6BAAA~~,EAAA,MAAA,EAAA,CAAA,wUAAA,CAAA,EAAA;;;AErBjD;;;AAGG;;ACHH;;AAEG;;;;"}
1	+ {"version":3,"file":"siemens-element-ng-summary-widget.mjs","sources":["../../../../projects/element-ng/summary-widget/si-summary-widget.component.ts","../../../../projects/element-ng/summary-widget/si-summary-widget.component.html","../../../../projects/element-ng/summary-widget/index.ts","../../../../projects/element-ng/summary-widget/siemens-element-ng-summary-widget.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n input,\n model\n} from '@angular/core';\nimport { ExtendedStatusType, STATUS_ICON } from '@siemens/element-ng/common';\nimport { SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, TranslatableString } from '@siemens/element-translate-ng/translate';\n\n@Component({\n selector: 'si-summary-widget',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-summary-widget.component.html',\n styleUrl: './si-summary-widget.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiSummaryWidgetComponent {\n /* Status. Alternatively, use {@link icon} and {@link color}. /\n readonly status = input<ExtendedStatusType>();\n /* Icon token, see {@link https://element.siemens.io/icons/element}. /\n readonly icon = input<string>();\n /* Color class, see {@link https://element.siemens.io/fundamentals/typography/#color-variants-classes}. /\n readonly color = input<string>();\n /* Icon token, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedIcon = input<string>();\n /* Color class, see {@link https://element.siemens.io/fundamentals/icons/}. /\n readonly stackedColor = input<string>();\n /* The label. /\n readonly label = input.required<TranslatableString>();\n /* Value to display. /\n readonly value = input.required<TranslatableString>();\n /\n Selected state, will change when clicked.\n * @defaultValue false\n /\n readonly selected = model(false);\n /\n Readonly state.\n * @defaultValue false\n /\n readonly readonly = input(false, { transform: booleanAttribute });\n /\n Disabled state.\n * @defaultValue false\n /\n readonly disabled = input(false, { transform: booleanAttribute });\n\n protected readonly interactive = computed(() => !this.disabled() && !this.readonly());\n\n protected readonly statusIcon = computed(() => {\n const status = this.status();\n return status\n ? STATUS_ICON[status]\n : {\n icon: this.icon(),\n color: this.color(),\n stacked: this.stackedIcon(),\n stackedColor: this.stackedColor()\n };\n });\n\n protected toggleSelected(): void {\n if (this.interactive()) {\n this.selected.set(!this.selected());\n }\n }\n}\n","<div\n class=\"widget ps-2 pe-4 gap-2\"\n role=\"checkbox\"\n [attr.tabindex]=\"interactive() ? '0' : ''\"\n [attr.aria-disabled]=\"!interactive()\"\n [attr.aria-checked]=\"selected()\"\n [class.selected]=\"selected()\"\n [class.disabled]=\"disabled()\"\n [class.interactive]=\"interactive()\"\n (click)=\"toggleSelected()\"\n (keydown.enter)=\"toggleSelected()\"\n (keydown.space)=\"$event.preventDefault(); toggleSelected()\"\n>\n @let actualIcon = statusIcon();\n @if (actualIcon.icon) {\n <span class=\"icon icon-stack\">\n <si-icon [class]=\"actualIcon.color\" [icon]=\"actualIcon.icon\" />\n @if (actualIcon.stacked) {\n <si-icon [class]=\"actualIcon.stackedColor\" [icon]=\"actualIcon.stacked\" />\n }\n </span>\n }\n <div class=\"d-flex flex-column py-2\" [class.ps-2]=\"!actualIcon.icon\">\n <div class=\"si-h5\">{{ value() \| translate }}</div>\n <div class=\"si-body text-secondary\">{{ label() \| translate }}</div>\n </div>\n</div>\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-summary-widget.component';\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-tabs-legacy.mjs CHANGED Viewed

@@ -334,14 +334,14 @@ class SiTabsetLegacyComponent {
         this.focusedTabIndex = undefined;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabsetLegacyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabsetLegacyComponent, isStandalone: true, selector: "si-tabset-legacy", inputs: { selectDefaultTab: ["selectDefaultTab", "selectDefaultTab", booleanAttribute], selectedTabIndex: "selectedTabIndex", tabButtonMaxWidth: "tabButtonMaxWidth" }, outputs: { selectedTabIndexChange: "selectedTabIndexChange", deselect: "deselect" }, queries: [{ propertyName: "tabPanels", predicate: SiTabLegacyComponent }], viewQueries: [{ propertyName: "tabContainer", first: true, predicate: ["tabContainer"], descendants: true, isSignal: true }, { propertyName: "innerTabContainer", first: true, predicate: ["innerTabContainer"], descendants: true, isSignal: true }, { propertyName: "tabs", predicate: ["tabElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<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\" [class]=\"`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-sm 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", styles: [":host{display:block;flex-direction:column}.tab-container-header{overflow:hidden;display:flex}.tab-container-buttonbar{flex:1;overflow:hidden}.tab-container-buttonbar-list{display:flex;margin:0;padding:0;list-style-type:none;transition:calc(.25s * var(--element-animations-enabled, 1))}.tab-container-buttonbar-list-item{flex:none}.tab-container-control{background:transparent;border:0;-webkit-user-select:none;user-select:none;padding-inline:0 7px;padding-block:6px 10px}.tab-container-control .is-end{padding-inline:7px 0}.tab-container-control:hover{color:var(--element-text-active)}.tab-container-control:disabled{color:var(--element-text-disabled);cursor:default}.nav-link{flex-shrink:0;color:var(--element-text-secondary)}.nav-link span.badge-dot{inset-block-end:calc(.625rem + 8px);inset-inline-start:.75rem;margin-inline-end:.75rem}.nav-link span.badge-text{inset-block-start:-11px;inset-inline-start:2px}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiResizeObserverDirective, selector: "[siResizeObserver]", inputs: ["resizeThrottle", "emitInitial"], outputs: ["siResizeObserver"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabsetLegacyComponent, isStandalone: true, selector: "si-tabset-legacy", inputs: { selectDefaultTab: ["selectDefaultTab", "selectDefaultTab", booleanAttribute], selectedTabIndex: "selectedTabIndex", tabButtonMaxWidth: "tabButtonMaxWidth" }, outputs: { selectedTabIndexChange: "selectedTabIndexChange", deselect: "deselect" }, queries: [{ propertyName: "tabPanels", predicate: SiTabLegacyComponent }], viewQueries: [{ propertyName: "tabContainer", first: true, predicate: ["tabContainer"], descendants: true, isSignal: true }, { propertyName: "innerTabContainer", first: true, predicate: ["innerTabContainer"], descendants: true, isSignal: true }, { propertyName: "tabs", predicate: ["tabElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<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\" [class]=\"`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-sm btn-tertiary-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", styles: [":host{display:block;flex-direction:column}.tab-container-header{overflow:hidden;display:flex}.tab-container-buttonbar{flex:1;overflow:hidden}.tab-container-buttonbar-list{display:flex;margin:0;padding:0;list-style-type:none;transition:calc(.25s * var(--element-animations-enabled, 1))}.tab-container-buttonbar-list-item{flex:none}.tab-container-control{background:transparent;border:0;-webkit-user-select:none;user-select:none;padding-inline:0 7px;padding-block:6px 10px}.tab-container-control .is-end{padding-inline:7px 0}.tab-container-control:hover{color:var(--element-text-active)}.tab-container-control:disabled{color:var(--element-text-disabled);cursor:default}.nav-link{flex-shrink:0;color:var(--element-text-secondary)}.nav-link span.badge-dot{inset-block-end:calc(.625rem + 8px);inset-inline-start:.75rem;margin-inline-end:.75rem}.nav-link span.badge-text{inset-block-start:-11px;inset-inline-start:2px}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiResizeObserverDirective, selector: "[siResizeObserver]", inputs: ["resizeThrottle", "emitInitial"], outputs: ["siResizeObserver"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 __decorate([
     WebComponentContentChildren(SiTabLegacyComponent)
 ], SiTabsetLegacyComponent.prototype, "tabPanels", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabsetLegacyComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-tabset-legacy', imports: [SiIconComponent, SiResizeObserverDirective, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<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\" [class]=\"`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-sm 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", styles: [":host{display:block;flex-direction:column}.tab-container-header{overflow:hidden;display:flex}.tab-container-buttonbar{flex:1;overflow:hidden}.tab-container-buttonbar-list{display:flex;margin:0;padding:0;list-style-type:none;transition:calc(.25s * var(--element-animations-enabled, 1))}.tab-container-buttonbar-list-item{flex:none}.tab-container-control{background:transparent;border:0;-webkit-user-select:none;user-select:none;padding-inline:0 7px;padding-block:6px 10px}.tab-container-control .is-end{padding-inline:7px 0}.tab-container-control:hover{color:var(--element-text-active)}.tab-container-control:disabled{color:var(--element-text-disabled);cursor:default}.nav-link{flex-shrink:0;color:var(--element-text-secondary)}.nav-link span.badge-dot{inset-block-end:calc(.625rem + 8px);inset-inline-start:.75rem;margin-inline-end:.75rem}.nav-link span.badge-text{inset-block-start:-11px;inset-inline-start:2px}\n"] }]
+            args: [{ selector: 'si-tabset-legacy', imports: [SiIconComponent, SiResizeObserverDirective, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<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\" [class]=\"`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-sm btn-tertiary-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", styles: [":host{display:block;flex-direction:column}.tab-container-header{overflow:hidden;display:flex}.tab-container-buttonbar{flex:1;overflow:hidden}.tab-container-buttonbar-list{display:flex;margin:0;padding:0;list-style-type:none;transition:calc(.25s * var(--element-animations-enabled, 1))}.tab-container-buttonbar-list-item{flex:none}.tab-container-control{background:transparent;border:0;-webkit-user-select:none;user-select:none;padding-inline:0 7px;padding-block:6px 10px}.tab-container-control .is-end{padding-inline:7px 0}.tab-container-control:hover{color:var(--element-text-active)}.tab-container-control:disabled{color:var(--element-text-disabled);cursor:default}.nav-link{flex-shrink:0;color:var(--element-text-secondary)}.nav-link span.badge-dot{inset-block-end:calc(.625rem + 8px);inset-inline-start:.75rem;margin-inline-end:.75rem}.nav-link span.badge-text{inset-block-start:-11px;inset-inline-start:2px}\n"] }]
         }], propDecorators: { tabPanels: [{
                 type: ContentChildren,
                 args: [SiTabLegacyComponent]

package/fesm2022/siemens-element-ng-tabs-legacy.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"siemens-element-ng-tabs-legacy.mjs","sources":["../../../../projects/element-ng/tabs-legacy/si-tab/si-tab-legacy.component.ts","../../../../projects/element-ng/tabs-legacy/si-tabset/si-tabset-legacy.component.ts","../../../../projects/element-ng/tabs-legacy/si-tabset/si-tabset-legacy.component.html","../../../../projects/element-ng/tabs-legacy/si-tabset/index.ts","../../../../projects/element-ng/tabs-legacy/si-tab/index.ts","../../../../projects/element-ng/tabs-legacy/si-tabs-legacy.module.ts","../../../../projects/element-ng/tabs-legacy/index.ts","../../../../projects/element-ng/tabs-legacy/siemens-element-ng-tabs-legacy.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\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 { SiTabsetLegacyComponent } from '../si-tabset/index';\n\n/\n @deprecated Use the new components from `@siemens/element-ng/tabs` instead.\n * See {@link https://element.siemens.io/components/layout-navigation/tabs/#code}\n * for usage instructions.\n /\n@Component({\n selector: 'si-tab-legacy',\n template: '<ng-content />',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n role: 'tabpanel'\n }\n})\nexport class SiTabLegacyComponent 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<SiTabLegacyComponent>();\n\n /* @internal /\n @HostBinding('id') id = `__si-tab-panel-${SiTabLegacyComponent.idCounter++}`;\n /* @internal /\n @HostBinding('attr.aria-labelledby') tabId = `__si-tab-${SiTabLegacyComponent.idCounter}`;\n\n @HostBinding('attr.hidden')\n protected get isHidden(): boolean \| null {\n return !this.active() ? true : null;\n }\n\n private parent?: SiTabsetLegacyComponent;\n\n /* @internal /\n readonly active = signal(false);\n\n /* @internal /\n registerParent(parent: SiTabsetLegacyComponent): void {\n this.parent = parent;\n }\n\n ngOnChanges(): void {\n this.parent?.notifyChildrenChanged();\n }\n}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\n/ eslint-disable @angular-eslint/prefer-output-emitter-ref /\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 { elementCancel, elementLeft3, elementRight3 } from '@siemens/element-icons';\nimport { isRTL, WebComponentContentChildren } from '@siemens/element-ng/common';\nimport { addIcons, SiIconComponent } 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 { SiTabLegacyComponent } from '../si-tab/si-tab-legacy.component';\n\nexport interface SiTabDeselectionEvent {\n /\n The target tab\n /\n target: SiTabLegacyComponent;\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/\n @deprecated Use the new components from `@siemens/element-ng/tabs` instead.\n * See {@link https://element.siemens.io/components/layout-navigation/tabs/#code}\n * for usage instructions.\n /\n@Component({\n selector: 'si-tabset-legacy',\n imports: [SiIconComponent, SiResizeObserverDirective, SiTranslatePipe],\n templateUrl: './si-tabset-legacy.component.html',\n styleUrl: './si-tabset-legacy.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiTabsetLegacyComponent implements AfterViewInit, OnDestroy {\n /\n Contains the current tab components.\n /\n @WebComponentContentChildren(SiTabLegacyComponent)\n @ContentChildren(SiTabLegacyComponent)\n protected tabPanels!: QueryList<SiTabLegacyComponent>;\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: SiTabLegacyComponent): 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: SiTabLegacyComponent): void {\n event.stopPropagation();\n let targetActiveTab: SiTabLegacyComponent \| 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\" [class]=\"`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-sm 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 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-tabset-legacy.component';\n","/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-tab-legacy.component';\n","/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { NgModule } from '@angular/core';\n\nimport { SiTabLegacyComponent } from './si-tab/si-tab-legacy.component';\nimport { SiTabsetLegacyComponent } from './si-tabset/si-tabset-legacy.component';\n\nconst components = [SiTabsetLegacyComponent, SiTabLegacyComponent];\n\n/\n @deprecated Use the new components from `@siemens/element-ng/tabs` instead.\n * See {@link https://element.siemens.io/components/layout-navigation/tabs/#code}\n * for usage instructions.\n /\n@NgModule({\n imports: components,\n exports: components\n})\nexport class SiTabsLegacyModule {}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-tabset/index';\nexport * from './si-tab/index';\nexport * from './si-tabs-legacy.module';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"siemens-element-ng-tabs-legacy.mjs","sources":["../../../../projects/element-ng/tabs-legacy/si-tab/si-tab-legacy.component.ts","../../../../projects/element-ng/tabs-legacy/si-tabset/si-tabset-legacy.component.ts","../../../../projects/element-ng/tabs-legacy/si-tabset/si-tabset-legacy.component.html","../../../../projects/element-ng/tabs-legacy/si-tabset/index.ts","../../../../projects/element-ng/tabs-legacy/si-tab/index.ts","../../../../projects/element-ng/tabs-legacy/si-tabs-legacy.module.ts","../../../../projects/element-ng/tabs-legacy/index.ts","../../../../projects/element-ng/tabs-legacy/siemens-element-ng-tabs-legacy.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\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 { SiTabsetLegacyComponent } from '../si-tabset/index';\n\n/\n @deprecated Use the new components from `@siemens/element-ng/tabs` instead.\n * See {@link https://element.siemens.io/components/layout-navigation/tabs/#code}\n * for usage instructions.\n /\n@Component({\n selector: 'si-tab-legacy',\n template: '<ng-content />',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n role: 'tabpanel'\n }\n})\nexport class SiTabLegacyComponent 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<SiTabLegacyComponent>();\n\n /* @internal /\n @HostBinding('id') id = `__si-tab-panel-${SiTabLegacyComponent.idCounter++}`;\n /* @internal /\n @HostBinding('attr.aria-labelledby') tabId = `__si-tab-${SiTabLegacyComponent.idCounter}`;\n\n @HostBinding('attr.hidden')\n protected get isHidden(): boolean \| null {\n return !this.active() ? true : null;\n }\n\n private parent?: SiTabsetLegacyComponent;\n\n /* @internal /\n readonly active = signal(false);\n\n /* @internal /\n registerParent(parent: SiTabsetLegacyComponent): void {\n this.parent = parent;\n }\n\n ngOnChanges(): void {\n this.parent?.notifyChildrenChanged();\n }\n}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\n/ eslint-disable @angular-eslint/prefer-output-emitter-ref /\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 { elementCancel, elementLeft3, elementRight3 } from '@siemens/element-icons';\nimport { isRTL, WebComponentContentChildren } from '@siemens/element-ng/common';\nimport { addIcons, SiIconComponent } 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 { SiTabLegacyComponent } from '../si-tab/si-tab-legacy.component';\n\nexport interface SiTabDeselectionEvent {\n /\n The target tab\n /\n target: SiTabLegacyComponent;\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/\n @deprecated Use the new components from `@siemens/element-ng/tabs` instead.\n * See {@link https://element.siemens.io/components/layout-navigation/tabs/#code}\n * for usage instructions.\n /\n@Component({\n selector: 'si-tabset-legacy',\n imports: [SiIconComponent, SiResizeObserverDirective, SiTranslatePipe],\n templateUrl: './si-tabset-legacy.component.html',\n styleUrl: './si-tabset-legacy.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiTabsetLegacyComponent implements AfterViewInit, OnDestroy {\n /\n Contains the current tab components.\n /\n @WebComponentContentChildren(SiTabLegacyComponent)\n @ContentChildren(SiTabLegacyComponent)\n protected tabPanels!: QueryList<SiTabLegacyComponent>;\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: SiTabLegacyComponent): 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: SiTabLegacyComponent): void {\n event.stopPropagation();\n let targetActiveTab: SiTabLegacyComponent \| 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\" [class]=\"`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-sm btn-tertiary-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 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-tabset-legacy.component';\n","/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-tab-legacy.component';\n","/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { NgModule } from '@angular/core';\n\nimport { SiTabLegacyComponent } from './si-tab/si-tab-legacy.component';\nimport { SiTabsetLegacyComponent } from './si-tabset/si-tabset-legacy.component';\n\nconst components = [SiTabsetLegacyComponent, SiTabLegacyComponent];\n\n/\n @deprecated Use the new components from `@siemens/element-ng/tabs` instead.\n * See {@link https://element.siemens.io/components/layout-navigation/tabs/#code}\n * for usage instructions.\n /\n@NgModule({\n imports: components,\n exports: components\n})\nexport class SiTabsLegacyModule {}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-tabset/index';\nexport * from './si-tab/index';\nexport * from './si-tabs-legacy.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-tabs.mjs CHANGED Viewed

@@ -204,7 +204,7 @@ class SiTabLinkComponent extends SiTabBaseDirective {
         super.selectTab(retainFocus);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabLinkComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabLinkComponent, isStandalone: true, selector: "a[si-tab][routerLink]", providers: [{ provide: SiTabBaseDirective, useExisting: SiTabLinkComponent }], usesInheritance: true, hostDirectives: [{ directive: i1.RouterLinkActive }], ngImport: i0, template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiTabBadgeComponent, selector: "si-tab-badge", inputs: ["badgeContent", "badgeColor"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabLinkComponent, isStandalone: true, selector: "a[si-tab][routerLink]", providers: [{ provide: SiTabBaseDirective, useExisting: SiTabLinkComponent }], usesInheritance: true, hostDirectives: [{ directive: i1.RouterLinkActive }], ngImport: i0, template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiTabBadgeComponent, selector: "si-tab-badge", inputs: ["badgeContent", "badgeColor"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabLinkComponent, decorators: [{
             type: Component,
@@ -212,7 +212,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                         {
                             directive: RouterLinkActive
                         }
-                    ], template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"] }]
+                    ], template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"] }]
         }] });
 /**
@@ -374,14 +374,14 @@ class SiTabComponent extends SiTabBaseDirective {
         this.active.set(false);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabComponent, isStandalone: true, selector: "si-tab", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, canActivate: { classPropertyName: "canActivate", publicName: "canActivate", isSignal: true, isRequired: false, transformFunction: null }, canDeactivate: { classPropertyName: "canDeactivate", publicName: "canDeactivate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange" }, host: { listeners: { "click": "selectTabByUser()", "keydown.enter": "selectTabByUser()" } }, providers: [{ provide: SiTabBaseDirective, useExisting: SiTabComponent }], usesInheritance: true, ngImport: i0, template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiTabBadgeComponent, selector: "si-tab-badge", inputs: ["badgeContent", "badgeColor"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabComponent, isStandalone: true, selector: "si-tab", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, canActivate: { classPropertyName: "canActivate", publicName: "canActivate", isSignal: true, isRequired: false, transformFunction: null }, canDeactivate: { classPropertyName: "canDeactivate", publicName: "canDeactivate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange" }, host: { listeners: { "click": "selectTabByUser()", "keydown.enter": "selectTabByUser()" } }, providers: [{ provide: SiTabBaseDirective, useExisting: SiTabComponent }], usesInheritance: true, ngImport: i0, template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiTabBadgeComponent, selector: "si-tab-badge", inputs: ["badgeContent", "badgeColor"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabComponent, decorators: [{
             type: Component,
             args: [{ selector: 'si-tab', imports: [SiIconComponent, SiTranslatePipe, SiTabBadgeComponent], providers: [{ provide: SiTabBaseDirective, useExisting: SiTabComponent }], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '(click)': 'selectTabByUser()',
                         '(keydown.enter)': 'selectTabByUser()'
-                    }, template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"] }]
+                    }, template: "@let icon = this.icon();\n@if (icon) {\n  <si-icon class=\"tab-icon\" [icon]=\"icon\" [attr.title]=\"heading() | translate\" />\n} @else {\n  <span class=\"text-truncate\">{{ heading() | translate }}</span>\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n  <si-icon\n    class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n    [icon]=\"icons.elementCancel\"\n    (click)=\"closeTab($event)\"\n  />\n}\n\n<ng-template #tabContent>\n  <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"] }]
         }], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }, { type: i0.Output, args: ["activeChange"] }], canActivate: [{ type: i0.Input, args: [{ isSignal: true, alias: "canActivate", required: false }] }], canDeactivate: [{ type: i0.Input, args: [{ isSignal: true, alias: "canDeactivate", required: false }] }] } });
 /**