@siemens/element-ng 47.2.0 → 47.4.0

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

@@ -0,0 +1,395 @@
+import { __decorate } from 'tslib';
+import { NgClass } from '@angular/common';
+import * as i0 from '@angular/core';
+import { EventEmitter, signal, booleanAttribute, HostBinding, Output, Input, ChangeDetectionStrategy, Component, viewChild, viewChildren, inject, ChangeDetectorRef, ContentChildren, NgModule } from '@angular/core';
+import { isRTL, WebComponentContentChildren } from '@siemens/element-ng/common';
+import { addIcons, elementRight3, elementLeft3, elementCancel, SiIconNextComponent, SiIconComponent } from '@siemens/element-ng/icon';
+import { SiResizeObserverDirective } from '@siemens/element-ng/resize-observer';
+import * as i1 from '@siemens/element-translate-ng/translate';
+import { SiTranslateModule } from '@siemens/element-translate-ng/translate';
+import { asyncScheduler } from 'rxjs';
+import { first, observeOn } from 'rxjs/operators';
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+class SiTabComponent {
+    static idCounter = 0;
+    /** Title of the tab item. */
+    heading;
+    /** Icon of the tab item. */
+    icon;
+    /** Alternative name or translation key for icon. Used for A11y. */
+    iconAltText;
+    /**
+     * Additional badge content. A value of
+     * - `true` will render a red dot
+     * - any string without a `badgeColor` will render a red dot with text
+     * - any string with a `badgeColor` will render a normal badge
+     */
+    badgeContent;
+    /**
+     * Background color of the badge.
+     * If no color is provided a red dot badge will be rendered.
+     */
+    badgeColor;
+    /**
+     * Disables the tab.
+     *
+     * @defaultValue false
+     */
+    disabled = false;
+    /**
+     * Close the current tab.
+     *
+     * @defaultValue false
+     */
+    closable = false;
+    /** Event emitter to notify when a tab is closed. */
+    closeTriggered = new EventEmitter();
+    /** @internal */
+    id = `__si-tab-panel-${SiTabComponent.idCounter++}`;
+    /** @internal */
+    tabId = `__si-tab-${SiTabComponent.idCounter}`;
+    get isHidden() {
+        return !this.active() ? true : null;
+    }
+    parent;
+    /** @internal */
+    active = signal(false);
+    /** @internal */
+    registerParent(parent) {
+        this.parent = parent;
+    }
+    ngOnChanges() {
+        this.parent?.notifyChildrenChanged();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.6", type: SiTabComponent, isStandalone: true, selector: "si-tab", inputs: { heading: "heading", icon: "icon", iconAltText: "iconAltText", badgeContent: "badgeContent", badgeColor: "badgeColor", disabled: ["disabled", "disabled", booleanAttribute], closable: ["closable", "closable", booleanAttribute] }, outputs: { closeTriggered: "closeTriggered" }, host: { attributes: { "role": "tabpanel" }, properties: { "id": "this.id", "attr.aria-labelledby": "this.tabId", "attr.hidden": "this.isHidden" } }, usesOnChanges: true, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiTabComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'si-tab',
+                    template: '<ng-content />',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        role: 'tabpanel'
+                    }
+                }]
+        }], propDecorators: { heading: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], iconAltText: [{
+                type: Input
+            }], badgeContent: [{
+                type: Input
+            }], badgeColor: [{
+                type: Input
+            }], disabled: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], closable: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], closeTriggered: [{
+                type: Output
+            }], id: [{
+                type: HostBinding,
+                args: ['id']
+            }], tabId: [{
+                type: HostBinding,
+                args: ['attr.aria-labelledby']
+            }], isHidden: [{
+                type: HostBinding,
+                args: ['attr.hidden']
+            }] } });
+
+const SCROLL_INCREMENT = 55;
+class SiTabsetComponent {
+    /**
+     * Contains the current tab components.
+     */
+    tabPanels;
+    /**
+     * Component variable to indicate if scrolling is necessary or the container is big enough to display all tabs.
+     */
+    scrollable = false;
+    xPos = 0;
+    endArrowDisabled = false;
+    focusedTabIndex;
+    icons = addIcons({ elementCancel, elementLeft3, elementRight3 });
+    /**
+     * If selectDefaultTab is passed as 'false', this implies no default tab selection
+     * i.e. on initial load of tabset component no tab gets selected.
+     *
+     * @defaultValue true
+     */
+    selectDefaultTab = true;
+    /**
+     * Sets a selected tab index. This will activate the tab of the provided
+     * index, activates the tab and fires a notification about the change.
+     * If index is passed as -1 i.e. `selectedTabIndex = -1`, this implies to clear all tab selection.
+     * @defaultref {@link _selectedTabIndex}
+     */
+    set selectedTabIndex(tabIndex) {
+        if (this.initialized && this.tabPanels.get(tabIndex)) {
+            this.selectTab(this.tabPanels.get(tabIndex));
+        }
+        else {
+            this.initTabIndex = tabIndex;
+        }
+    }
+    /**
+     * Returns the currently selected tab index.
+     */
+    get selectedTabIndex() {
+        return this.tabPanels?.toArray().findIndex(tab => tab.active());
+    }
+    /** Define an optional max-width in px for the tab buttons. The minimum value is `100`. */
+    tabButtonMaxWidth;
+    /**
+     * Event emitter to notify about selected tab index changes. You can either
+     * use bi-directional binding with [(selectedTabIndex)] or separate both with
+     * [selectedTabIndex]=... and (selectedTabIndexChange)=...
+     */
+    selectedTabIndexChange = new EventEmitter();
+    /**
+     * Event emitter to notify when a tab became inactive.
+     */
+    deselect = new EventEmitter();
+    initTabIndex = 0;
+    initialized = false;
+    subscription;
+    tabContainer = viewChild.required('tabContainer');
+    innerTabContainer = viewChild.required('innerTabContainer');
+    tabs = viewChildren('tabElement');
+    changeDetectorRef = inject(ChangeDetectorRef);
+    ngAfterViewInit() {
+        this.initialized = true;
+        this.subscription = this.tabPanels.changes.subscribe(() => {
+            this.tabPanels.forEach(tab => tab.registerParent(this));
+            this.changeDetectorRef.markForCheck();
+        });
+        this.tabPanels.notifyOnChanges();
+        if (this.selectDefaultTab) {
+            if (this.tabPanels.length) {
+                queueMicrotask(() => this.selectTab(this.tabPanels.get(this.initTabIndex)));
+            }
+            else {
+                // no tabs are there yet. But maybe there will be some soon, so let's wait for it
+                this.subscription.add(this.tabPanels.changes
+                    .pipe(first(() => !!this.tabPanels.length), observeOn(asyncScheduler))
+                    .subscribe(() => {
+                    this.selectTab(this.tabPanels.get(this.initTabIndex));
+                    this.changeDetectorRef.markForCheck();
+                }));
+            }
+        }
+        setTimeout(() => {
+            this.resize();
+        });
+    }
+    ngOnDestroy() {
+        this.subscription?.unsubscribe();
+        this.subscription = undefined;
+    }
+    /** @internal */
+    notifyChildrenChanged() {
+        this.changeDetectorRef.markForCheck();
+    }
+    isTabFocusable(index) {
+        const tab = this.tabPanels.get(index);
+        return !tab.disabled;
+    }
+    focusNext() {
+        do {
+            this.focusedTabIndex = (this.focusedTabIndex ?? 0) + 1;
+            if (this.focusedTabIndex >= this.tabs().length) {
+                this.focusedTabIndex = 0;
+            }
+        } while (!this.isTabFocusable(this.focusedTabIndex));
+        this.tabs().at(this.focusedTabIndex).nativeElement.focus();
+    }
+    focusPrevious() {
+        do {
+            this.focusedTabIndex = (this.focusedTabIndex ?? 0) - 1;
+            if (this.focusedTabIndex < 0) {
+                this.focusedTabIndex += this.tabs().length;
+            }
+        } while (!this.isTabFocusable(this.focusedTabIndex));
+        this.tabs().at(this.focusedTabIndex).nativeElement.focus();
+    }
+    resize() {
+        this.scrollable =
+            Math.round(this.tabContainer().nativeElement.offsetWidth) <
+                this.innerTabContainer().nativeElement.scrollWidth;
+        this.scroll(0);
+    }
+    /**
+     * Finds the index of the provided tab and sets the index as new selected tab index
+     *
+     * @param selectedTab - The tab to be selected. This must already be part of the container.
+     */
+    selectTab(selectedTab) {
+        if (selectedTab?.disabled) {
+            return;
+        }
+        const tabs = this.tabPanels.toArray();
+        const newTabIndex = tabs.indexOf(selectedTab);
+        const currentTabIndex = tabs.findIndex(tab => tab.active());
+        let continueWithSelection = newTabIndex !== currentTabIndex;
+        if (continueWithSelection && currentTabIndex !== -1) {
+            const currentTab = tabs[currentTabIndex];
+            const deselectEvent = {
+                target: currentTab,
+                tabIndex: currentTabIndex,
+                cancel: () => {
+                    continueWithSelection = false;
+                    currentTab.active.set(true);
+                }
+            };
+            currentTab.active.set(false);
+            this.deselect.emit(deselectEvent);
+        }
+        if (continueWithSelection) {
+            selectedTab.active.set(true);
+            this.changeDetectorRef.markForCheck();
+            this.selectedTabIndexChange.emit(newTabIndex);
+        }
+    }
+    /**
+     * Scrolls the tab headers to the end (right in LTR).
+     */
+    scrollEnd() {
+        this.scroll(SCROLL_INCREMENT);
+    }
+    /**
+     * Scrolls the tab headers to the start (left in LTR).
+     */
+    scrollStart() {
+        this.scroll(-SCROLL_INCREMENT);
+    }
+    scroll(inc) {
+        this.xPos += inc;
+        this.xPos = Math.max(0, Math.min(this.innerTabContainer().nativeElement.scrollWidth -
+            this.innerTabContainer().nativeElement.offsetWidth, this.xPos));
+        this.endArrowDisabled =
+            this.xPos + this.tabContainer().nativeElement.offsetWidth >=
+                this.innerTabContainer().nativeElement.scrollWidth;
+        this.innerTabContainer().nativeElement.style.transform = `translateX(${this.xPos * (isRTL() ? 1 : -1)}px)`;
+    }
+    mouseScroll(event) {
+        if (event.deltaY < 0) {
+            this.scroll(-SCROLL_INCREMENT);
+        }
+        else {
+            this.scroll(SCROLL_INCREMENT);
+        }
+        if (this.xPos || !this.endArrowDisabled) {
+            event.preventDefault();
+        }
+    }
+    /** @internal */
+    focus(index) {
+        this.focusedTabIndex = index;
+    }
+    /** @internal */
+    blur() {
+        this.focusedTabIndex = undefined;
+    }
+    closeTab(event, tab) {
+        event.stopPropagation();
+        let targetActiveTab;
+        if (tab.active()) {
+            const index = this.tabPanels.toArray().indexOf(tab);
+            targetActiveTab = this.tabPanels.toArray()[index + 1] ?? this.tabPanels.toArray()[index - 1];
+            if (targetActiveTab) {
+                this.selectTab(targetActiveTab);
+            }
+        }
+        else {
+            targetActiveTab = this.tabPanels.find(otherTabs => otherTabs.active());
+        }
+        if (targetActiveTab) {
+            // The focus will always get the next element due browser behavior.
+            // Setting it to the active element solves this.
+            setTimeout(() => {
+                this.tabs().at(this.tabPanels.toArray().indexOf(targetActiveTab)).nativeElement.focus();
+            });
+        }
+        tab.closeTriggered.emit(tab);
+        this.focusedTabIndex = undefined;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiTabsetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: SiTabsetComponent, isStandalone: true, selector: "si-tabset", inputs: { selectDefaultTab: ["selectDefaultTab", "selectDefaultTab", booleanAttribute], selectedTabIndex: "selectedTabIndex", tabButtonMaxWidth: "tabButtonMaxWidth" }, outputs: { selectedTabIndexChange: "selectedTabIndexChange", deselect: "deselect" }, queries: [{ propertyName: "tabPanels", predicate: SiTabComponent }], 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-next class=\"icon flip-rtl\" [icon]=\"icons.elementLeft3\" />\n    </button>\n  }\n\n  <div #tabContainer class=\"tab-container-buttonbar\" (wheel)=\"mouseScroll($event)\">\n    <div #innerTabContainer class=\"tab-container-buttonbar-list focus-inside\">\n      @for (tab of tabPanels; track $index) {\n        <button\n          #tabElement\n          type=\"button\"\n          role=\"tab\"\n          class=\"nav-link focus-inside px-5\"\n          [attr.aria-controls]=\"tab.id\"\n          [id]=\"tab.tabId\"\n          [style.max-width.px]=\"tabButtonMaxWidth\"\n          [tabindex]=\"!tab.disabled && tab.active() && focusedTabIndex === undefined ? 0 : -1\"\n          [class.active]=\"tab.active()\"\n          [attr.aria-selected]=\"tab.active()\"\n          [class.disabled]=\"tab.disabled\"\n          (click)=\"selectTab(tab)\"\n          (keydown.arrowLeft)=\"focusPrevious()\"\n          (keydown.arrowRight)=\"focusNext()\"\n          (keydown.delete)=\"tab.closeTriggered.emit(tab)\"\n          (blur)=\"blur()\"\n          (focus)=\"focus($index)\"\n        >\n          <span class=\"text-truncate\">{{ tab.heading | translate }}</span>\n          @if (tab.icon) {\n            <si-icon-next\n              class=\"icon\"\n              [attr.role]=\"tab.iconAltText ? 'img' : 'presentation'\"\n              [icon]=\"tab.icon\"\n              [attr.aria-label]=\"(tab.iconAltText | translate) ?? undefined\"\n            />\n          }\n          @if (tab.badgeContent === true) {\n            <span class=\"badge-dot\"></span>\n          } @else if (tab.badgeContent && tab.badgeColor) {\n            <span class=\"badge\" [ngClass]=\"'bg-' + tab.badgeColor\">\n              {{ tab.badgeContent | translate }}\n            </span>\n          } @else if (tab.badgeContent && !tab.badgeColor) {\n            <span class=\"badge-text\"> {{ tab.badgeContent | translate }}</span>\n          }\n          @if (tab.closable && !tab.disabled) {\n            <si-icon-next\n              class=\"ms-4 me-n4 btn btn-circle btn-xs btn-ghost close\"\n              [icon]=\"icons.elementCancel\"\n              (click)=\"closeTab($event, tab)\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n  @if (scrollable) {\n    <button\n      type=\"button\"\n      class=\"tab-container-control is-end focus-inside\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      [hidden]=\"endArrowDisabled\"\n      (keydown.enter)=\"scrollEnd()\"\n      (mousedown)=\"scrollEnd()\"\n    >\n      <si-icon-next class=\"icon flip-rtl\" [icon]=\"icons.elementRight3\" />\n    </button>\n  }\n</div>\n\n<ng-content />\n", 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}.nav-link span.badge-dot{inset-block-end:100%;inset-inline-start:12px;margin-inline-end:12px}.nav-link span.badge-text{inset-block-end:calc(100% - 7px);inset-inline-start:2px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SiIconNextComponent, selector: "si-icon-next", inputs: ["icon"] }, { kind: "directive", type: SiResizeObserverDirective, selector: "[siResizeObserver]", inputs: ["resizeThrottle"], outputs: ["siResizeObserver"] }, { kind: "ngmodule", type: SiTranslateModule }, { kind: "pipe", type: i1.SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+__decorate([
+    WebComponentContentChildren(SiTabComponent)
+], SiTabsetComponent.prototype, "tabPanels", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiTabsetComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'si-tabset', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        NgClass,
+                        SiIconNextComponent,
+                        SiIconComponent,
+                        SiResizeObserverDirective,
+                        SiTranslateModule
+                    ], 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-next class=\"icon flip-rtl\" [icon]=\"icons.elementLeft3\" />\n    </button>\n  }\n\n  <div #tabContainer class=\"tab-container-buttonbar\" (wheel)=\"mouseScroll($event)\">\n    <div #innerTabContainer class=\"tab-container-buttonbar-list focus-inside\">\n      @for (tab of tabPanels; track $index) {\n        <button\n          #tabElement\n          type=\"button\"\n          role=\"tab\"\n          class=\"nav-link focus-inside px-5\"\n          [attr.aria-controls]=\"tab.id\"\n          [id]=\"tab.tabId\"\n          [style.max-width.px]=\"tabButtonMaxWidth\"\n          [tabindex]=\"!tab.disabled && tab.active() && focusedTabIndex === undefined ? 0 : -1\"\n          [class.active]=\"tab.active()\"\n          [attr.aria-selected]=\"tab.active()\"\n          [class.disabled]=\"tab.disabled\"\n          (click)=\"selectTab(tab)\"\n          (keydown.arrowLeft)=\"focusPrevious()\"\n          (keydown.arrowRight)=\"focusNext()\"\n          (keydown.delete)=\"tab.closeTriggered.emit(tab)\"\n          (blur)=\"blur()\"\n          (focus)=\"focus($index)\"\n        >\n          <span class=\"text-truncate\">{{ tab.heading | translate }}</span>\n          @if (tab.icon) {\n            <si-icon-next\n              class=\"icon\"\n              [attr.role]=\"tab.iconAltText ? 'img' : 'presentation'\"\n              [icon]=\"tab.icon\"\n              [attr.aria-label]=\"(tab.iconAltText | translate) ?? undefined\"\n            />\n          }\n          @if (tab.badgeContent === true) {\n            <span class=\"badge-dot\"></span>\n          } @else if (tab.badgeContent && tab.badgeColor) {\n            <span class=\"badge\" [ngClass]=\"'bg-' + tab.badgeColor\">\n              {{ tab.badgeContent | translate }}\n            </span>\n          } @else if (tab.badgeContent && !tab.badgeColor) {\n            <span class=\"badge-text\"> {{ tab.badgeContent | translate }}</span>\n          }\n          @if (tab.closable && !tab.disabled) {\n            <si-icon-next\n              class=\"ms-4 me-n4 btn btn-circle btn-xs btn-ghost close\"\n              [icon]=\"icons.elementCancel\"\n              (click)=\"closeTab($event, tab)\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n  @if (scrollable) {\n    <button\n      type=\"button\"\n      class=\"tab-container-control is-end focus-inside\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      [hidden]=\"endArrowDisabled\"\n      (keydown.enter)=\"scrollEnd()\"\n      (mousedown)=\"scrollEnd()\"\n    >\n      <si-icon-next class=\"icon flip-rtl\" [icon]=\"icons.elementRight3\" />\n    </button>\n  }\n</div>\n\n<ng-content />\n", 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}.nav-link span.badge-dot{inset-block-end:100%;inset-inline-start:12px;margin-inline-end:12px}.nav-link span.badge-text{inset-block-end:calc(100% - 7px);inset-inline-start:2px}\n"] }]
+        }], propDecorators: { tabPanels: [{
+                type: ContentChildren,
+                args: [SiTabComponent]
+            }], selectDefaultTab: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], selectedTabIndex: [{
+                type: Input
+            }], tabButtonMaxWidth: [{
+                type: Input
+            }], selectedTabIndexChange: [{
+                type: Output
+            }], deselect: [{
+                type: Output
+            }] } });
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+const components = [SiTabsetComponent, SiTabComponent];
+class SiTabsModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.6", ngImport: i0, type: SiTabsModule, imports: [SiTabsetComponent, SiTabComponent], exports: [SiTabsetComponent, SiTabComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiTabsModule, imports: [SiTabsetComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SiTabsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: components,
+                    exports: components
+                }]
+        }] });
+
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SiTabComponent, SiTabsModule, SiTabsetComponent };
+//# sourceMappingURL=siemens-element-ng-tabs.mjs.map

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

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