import * as i0 from '@angular/core';
import { InjectionToken, inject, TemplateRef, Directive, contentChild, viewChild, input, booleanAttribute, ChangeDetectionStrategy, Component, ViewContainerRef, ChangeDetectorRef, PLATFORM_ID, contentChildren, viewChildren, signal, numberAttribute, output, effect, ElementRef, computed, DestroyRef } from '@angular/core';
import * as i2 from '@angular/cdk/portal';
import { TemplatePortal, PortalModule } from '@angular/cdk/portal';
import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
import * as i1 from '@angular/common';
import { isPlatformBrowser, CommonModule } from '@angular/common';
import * as i1$1 from '@ngstarter-ui/components/core';
import { Ripple } from '@ngstarter-ui/components/core';
import { Subscription, fromEvent, debounceTime } from 'rxjs';
import { filter } from 'rxjs/operators';
import { RouterLink, Router, NavigationEnd } from '@angular/router';

const TAB_LABEL = new InjectionToken('EmrTabLabel');
class TabLabel {
    template = inject(TemplateRef);
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: TabLabel, isStandalone: true, selector: "[ngsTabLabel], [ngs-tab-label]", providers: [{ provide: TAB_LABEL, useExisting: TabLabel }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabLabel, decorators: [{
            type: Directive,
            args: [{
                    selector: '[ngsTabLabel], [ngs-tab-label]',
                    standalone: true,
                    providers: [{ provide: TAB_LABEL, useExisting: TabLabel }],
                }]
        }] });
const TAB_CONTENT = new InjectionToken('EmrTabContent');
class TabContent {
    template = inject(TemplateRef);
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: TabContent, isStandalone: true, selector: "[ngsTabContent], [ngs-tab-content]", providers: [{ provide: TAB_CONTENT, useExisting: TabContent }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabContent, decorators: [{
            type: Directive,
            args: [{
                    selector: '[ngsTabContent], [ngs-tab-content]',
                    standalone: true,
                    providers: [{ provide: TAB_CONTENT, useExisting: TabContent }],
                }]
        }] });

class Tab {
    templateLabel = contentChild(TAB_LABEL, ...(ngDevMode ? [{ debugName: "templateLabel" }] : /* istanbul ignore next */ []));
    explicitContent = contentChild(TAB_CONTENT, ...(ngDevMode ? [{ debugName: "explicitContent" }] : /* istanbul ignore next */ []));
    implicitContent = viewChild(TemplateRef, ...(ngDevMode ? [{ debugName: "implicitContent" }] : /* istanbul ignore next */ []));
    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
    ariaLabel = input('', { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
    ariaLabelledby = input('', { ...(ngDevMode ? { debugName: "ariaLabelledby" } : /* istanbul ignore next */ {}), alias: 'aria-labelledby' });
    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    _contentPortal = null;
    _prepareContent(viewContainerRef) {
        if (!this._contentPortal) {
            const template = this.explicitContent()?.template || this.implicitContent();
            if (template) {
                this._contentPortal = new TemplatePortal(template, viewContainerRef);
            }
        }
        return this._contentPortal;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Tab, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: Tab, isStandalone: true, selector: "ngs-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "aria-labelledby", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ngs-tab" }, queries: [{ propertyName: "templateLabel", first: true, predicate: TAB_LABEL, descendants: true, isSignal: true }, { propertyName: "explicitContent", first: true, predicate: TAB_CONTENT, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "implicitContent", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], exportAs: ["ngsTab"], ngImport: i0, template: "<ng-template>\n  <ng-content/>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Tab, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-tab', exportAs: 'ngsTab', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        'class': 'ngs-tab',
                    }, template: "<ng-template>\n  <ng-content/>\n</ng-template>\n" }]
        }], propDecorators: { templateLabel: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TAB_LABEL), { isSignal: true }] }], explicitContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TAB_CONTENT), { isSignal: true }] }], implicitContent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-labelledby", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });

class TabGroup {
    _viewContainerRef = inject(ViewContainerRef);
    _cdr = inject(ChangeDetectorRef);
    _platformId = inject(PLATFORM_ID);
    _tabsSubscription = Subscription.EMPTY;
    _resizeSubscription = Subscription.EMPTY;
    _resizeObserver = null;
    _tabs = contentChildren(Tab, ...(ngDevMode ? [{ debugName: "_tabs" }] : /* istanbul ignore next */ []));
    _tabLabels = viewChildren('tabLabel', ...(ngDevMode ? [{ debugName: "_tabLabels" }] : /* istanbul ignore next */ []));
    _tabListContainer = viewChild('tabListContainer', ...(ngDevMode ? [{ debugName: "_tabListContainer" }] : /* istanbul ignore next */ []));
    _tabList = viewChild('tabList', ...(ngDevMode ? [{ debugName: "_tabList" }] : /* istanbul ignore next */ []));
    _showPaginationControls = signal(false, ...(ngDevMode ? [{ debugName: "_showPaginationControls" }] : /* istanbul ignore next */ []));
    _disableScrollBefore = signal(true, ...(ngDevMode ? [{ debugName: "_disableScrollBefore" }] : /* istanbul ignore next */ []));
    _disableScrollAfter = signal(true, ...(ngDevMode ? [{ debugName: "_disableScrollAfter" }] : /* istanbul ignore next */ []));
    selectedIndex = input(0, { ...(ngDevMode ? { debugName: "selectedIndex" } : /* istanbul ignore next */ {}), transform: numberAttribute });
    headerPosition = input('above', ...(ngDevMode ? [{ debugName: "headerPosition" }] : /* istanbul ignore next */ []));
    preserveContent = input(false, { ...(ngDevMode ? { debugName: "preserveContent" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    stretchTabs = input(true, { ...(ngDevMode ? { debugName: "stretchTabs" } : /* istanbul ignore next */ {}), alias: 'ngs-stretch-tabs',
        transform: booleanAttribute });
    alignTabs = input('start', { ...(ngDevMode ? { debugName: "alignTabs" } : /* istanbul ignore next */ {}), alias: 'ngs-align-tabs' });
    disableRipple = input(false, { ...(ngDevMode ? { debugName: "disableRipple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    animationDuration = input('500ms', { ...(ngDevMode ? { debugName: "animationDuration" } : /* istanbul ignore next */ {}), transform: (value) => {
            return /^\d+$/.test(value + '') ? value + 'ms' : value + '';
        } });
    enterAnimation = input('', { ...(ngDevMode ? { debugName: "enterAnimation" } : /* istanbul ignore next */ {}), alias: 'animate.enter' });
    leaveAnimation = input('', { ...(ngDevMode ? { debugName: "leaveAnimation" } : /* istanbul ignore next */ {}), alias: 'animate.leave' });
    selectedIndexChange = output();
    selectedTabChange = output();
    focusChange = output();
    _isActive = {};
    _selectedIndex = 0;
    _prevIndex = 0;
    _isInitialized = false;
    constructor() {
        this._selectedIndex = this.selectedIndex();
        this._prevIndex = this._selectedIndex;
        this._isActive[this._selectedIndex] = true;
        effect((onCleanup) => {
            const selectedIndex = this.selectedIndex();
            if (this._selectedIndex !== selectedIndex) {
                this._prevIndex = this._selectedIndex;
                this._isActive[this._prevIndex] = true;
                this._selectedIndex = selectedIndex;
                this._isActive[this._selectedIndex] = true;
                this._cdr.markForCheck();
                const prevIndex = this._prevIndex;
                const timeout = setTimeout(() => {
                    delete this._isActive[prevIndex];
                    this._cdr.markForCheck();
                }, parseInt(this.animationDuration()));
                onCleanup(() => clearTimeout(timeout));
            }
            setTimeout(() => {
                if (this._isInitialized) {
                    this._scrollToTab(this._selectedIndex);
                }
                this._updatePagination();
            });
        });
        this._tabsSubscription = toObservable(this._tabs).subscribe(() => {
            this._clampIndex();
            this._cdr.markForCheck();
            setTimeout(() => {
                this._updatePagination();
            });
        });
        effect(() => {
            this._tabs();
            setTimeout(() => {
                this._updatePagination();
            });
        });
    }
    ngAfterViewInit() {
        this._isInitialized = true;
        if (isPlatformBrowser(this._platformId)) {
            this._resizeSubscription = fromEvent(window, 'resize')
                .pipe(debounceTime(100))
                .subscribe(() => {
                this._updatePagination();
            });
            this._resizeObserver = new ResizeObserver(() => {
                this._updatePagination();
            });
            this._resizeObserver.observe(this._tabListContainer()?.nativeElement);
            this._resizeObserver.observe(this._tabList()?.nativeElement);
        }
        setTimeout(() => {
            this._updatePagination();
        });
    }
    ngOnDestroy() {
        this._tabsSubscription.unsubscribe();
        this._resizeSubscription.unsubscribe();
        this._resizeObserver?.disconnect();
    }
    _clampIndex() {
        if (this._tabs().length === 0) {
            this._selectedIndex = 0;
            return;
        }
        this._selectedIndex = Math.max(0, Math.min(this._selectedIndex, this._tabs().length - 1));
    }
    _updatePagination() {
        if (!isPlatformBrowser(this._platformId)) {
            return;
        }
        const containerEl = this._tabListContainer()?.nativeElement;
        const listEl = this._tabList()?.nativeElement;
        if (containerEl && listEl) {
            const showPaginationControls = listEl.scrollWidth > containerEl.clientWidth;
            if (showPaginationControls !== this._showPaginationControls()) {
                this._showPaginationControls.set(showPaginationControls);
                this._cdr.detectChanges();
            }
            this._updateScrollButtonsState();
        }
    }
    _updateScrollButtonsState() {
        if (!isPlatformBrowser(this._platformId)) {
            return;
        }
        const containerEl = this._tabListContainer()?.nativeElement;
        if (containerEl) {
            const scrollLeft = containerEl.scrollLeft;
            const disableScrollBefore = scrollLeft <= 0;
            const disableScrollAfter = Math.ceil(scrollLeft + containerEl.clientWidth) >= containerEl.scrollWidth;
            if (disableScrollBefore !== this._disableScrollBefore() || disableScrollAfter !== this._disableScrollAfter()) {
                this._disableScrollBefore.set(disableScrollBefore);
                this._disableScrollAfter.set(disableScrollAfter);
                this._cdr.detectChanges();
            }
        }
    }
    _scrollToTab(index) {
        if (!isPlatformBrowser(this._platformId)) {
            return;
        }
        const labels = this._tabLabels();
        const containerEl = this._tabListContainer()?.nativeElement;
        if (labels[index] && containerEl) {
            const labelEl = labels[index].nativeElement;
            const containerRect = containerEl.getBoundingClientRect();
            const labelRect = labelEl.getBoundingClientRect();
            if (labelRect.left < containerRect.left) {
                containerEl.scrollBy({ left: labelRect.left - containerRect.left, behavior: 'smooth' });
            }
            else if (labelRect.right > containerRect.right) {
                containerEl.scrollBy({ left: labelRect.right - containerRect.right, behavior: 'smooth' });
            }
        }
    }
    _scrollBefore() {
        if (!isPlatformBrowser(this._platformId)) {
            return;
        }
        const containerEl = this._tabListContainer()?.nativeElement;
        if (containerEl) {
            containerEl.scrollBy({ left: -containerEl.clientWidth / 2, behavior: 'smooth' });
        }
    }
    _scrollAfter() {
        if (!isPlatformBrowser(this._platformId)) {
            return;
        }
        const containerEl = this._tabListContainer()?.nativeElement;
        if (containerEl) {
            containerEl.scrollBy({ left: containerEl.clientWidth / 2, behavior: 'smooth' });
        }
    }
    _handleScroll() {
        this._updateScrollButtonsState();
    }
    _onTabHeaderClick(index) {
        const tabs = this._tabs();
        const labels = this._tabLabels();
        if (tabs[index].disabled() || this._selectedIndex === index) {
            return;
        }
        this._prevIndex = this._selectedIndex;
        this._selectedIndex = index;
        this._isActive[this._prevIndex] = true;
        this._isActive[this._selectedIndex] = true;
        this.selectedIndexChange.emit(index);
        this.selectedTabChange.emit({
            index,
            tab: tabs[index]
        });
        this._cdr.markForCheck();
        const prevIndex = this._prevIndex;
        setTimeout(() => {
            delete this._isActive[prevIndex];
            this._cdr.markForCheck();
        }, parseInt(this.animationDuration()));
        if (labels[index]) {
            this._scrollToTab(index);
        }
    }
    _getTabContent(tab) {
        return tab._prepareContent(this._viewContainerRef);
    }
    _getEnterAnimation(index) {
        let direction = '';
        const selectedIndex = this._selectedIndex;
        if (this._prevIndex > selectedIndex) {
            direction = 'left';
        }
        else if (this._prevIndex < selectedIndex) {
            direction = 'right';
        }
        if (this.enterAnimation()) {
            return this.enterAnimation();
        }
        if (direction === '' || index !== selectedIndex) {
            return '';
        }
        // If moving right (prev < current), the new tab should slide in from the RIGHT
        return `ngs-tab-group-enter-${direction}`;
    }
    _getLeaveAnimation(index) {
        let direction = '';
        const selectedIndex = this._selectedIndex;
        if (this._prevIndex > selectedIndex) {
            direction = 'left';
        }
        else if (this._prevIndex < selectedIndex) {
            direction = 'right';
        }
        if (this.leaveAnimation()) {
            return this.leaveAnimation();
        }
        if (direction === '' || index !== this._prevIndex || index === selectedIndex) {
            return '';
        }
        // If moving right (prev < current), the old tab should slide out to the LEFT
        const leaveDirection = direction === 'right' ? 'left' : 'right';
        return `ngs-tab-group-leave-${leaveDirection}`;
    }
    _onKeydown(event) {
        const tabs = this._tabs();
        const labels = this._tabLabels();
        let newIndex = this._selectedIndex;
        if (event.key === 'ArrowRight') {
            newIndex = (this._selectedIndex + 1) % tabs.length;
        }
        else if (event.key === 'ArrowLeft') {
            newIndex = (this._selectedIndex - 1 + tabs.length) % tabs.length;
        }
        else if (event.key === 'Home') {
            newIndex = 0;
        }
        else if (event.key === 'End') {
            newIndex = tabs.length - 1;
        }
        else {
            return;
        }
        event.preventDefault();
        // Skip disabled tabs
        const direction = (newIndex >= this._selectedIndex) ? 1 : -1;
        const startIndex = newIndex;
        while (tabs[newIndex].disabled()) {
            newIndex = (newIndex + direction + tabs.length) % tabs.length;
            if (newIndex === startIndex)
                break; // All tabs disabled or looped back
        }
        if (newIndex !== this._selectedIndex && !tabs[newIndex].disabled()) {
            this._prevIndex = this._selectedIndex;
            this._selectedIndex = newIndex;
            this._isActive[this._prevIndex] = true;
            this._isActive[this._selectedIndex] = true;
            this.selectedIndexChange.emit(newIndex);
            this.selectedTabChange.emit({
                index: newIndex,
                tab: tabs[newIndex]
            });
            this._cdr.markForCheck();
            const prevIndex = this._prevIndex;
            setTimeout(() => {
                delete this._isActive[prevIndex];
                this._cdr.markForCheck();
            }, parseInt(this.animationDuration()));
            if (isPlatformBrowser(this._platformId)) {
                labels[newIndex].nativeElement.focus({ preventScroll: true });
                this._scrollToTab(newIndex);
            }
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: TabGroup, isStandalone: true, selector: "ngs-tab-group", inputs: { selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null }, headerPosition: { classPropertyName: "headerPosition", publicName: "headerPosition", isSignal: true, isRequired: false, transformFunction: null }, preserveContent: { classPropertyName: "preserveContent", publicName: "preserveContent", isSignal: true, isRequired: false, transformFunction: null }, stretchTabs: { classPropertyName: "stretchTabs", publicName: "ngs-stretch-tabs", isSignal: true, isRequired: false, transformFunction: null }, alignTabs: { classPropertyName: "alignTabs", publicName: "ngs-align-tabs", isSignal: true, isRequired: false, transformFunction: null }, disableRipple: { classPropertyName: "disableRipple", publicName: "disableRipple", isSignal: true, isRequired: false, transformFunction: null }, animationDuration: { classPropertyName: "animationDuration", publicName: "animationDuration", isSignal: true, isRequired: false, transformFunction: null }, enterAnimation: { classPropertyName: "enterAnimation", publicName: "animate.enter", isSignal: true, isRequired: false, transformFunction: null }, leaveAnimation: { classPropertyName: "leaveAnimation", publicName: "animate.leave", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndexChange: "selectedIndexChange", selectedTabChange: "selectedTabChange", focusChange: "focusChange" }, host: { properties: { "class.ngs-tab-group-inverted": "headerPosition() === \"below\"", "style.--ngs-tab-group-animation-duration": "animationDuration()" }, classAttribute: "ngs-tab-group" }, queries: [{ propertyName: "_tabs", predicate: Tab, isSignal: true }], viewQueries: [{ propertyName: "_tabLabels", predicate: ["tabLabel"], descendants: true, isSignal: true }, { propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, isSignal: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ngs-tab-group-header-container\" [class.ngs-tab-group-header-pagination-controls-enabled]=\"_showPaginationControls()\">\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-before\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollBefore()\"\n            (click)=\"_scrollBefore()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n\n  <div class=\"ngs-tab-group-header\"\n       #tabListContainer\n       role=\"tablist\"\n       (scroll)=\"_handleScroll()\"\n       (keydown)=\"_onKeydown($event)\">\n    <div class=\"ngs-tab-group-header-list\" #tabList\n         [class.ngs-tab-group-header-list-align-start]=\"alignTabs() === 'start'\"\n         [class.ngs-tab-group-header-list-align-center]=\"alignTabs() === 'center'\"\n         [class.ngs-tab-group-header-list-align-end]=\"alignTabs() === 'end'\">\n      @for (tab of _tabs(); track tab; let i = $index) {\n        <div\n          #tabLabel\n          class=\"ngs-tab-label\"\n          role=\"tab\"\n          ngsRipple\n          [ngsRippleDisabled]=\"tab.disabled() || disableRipple()\"\n          [id]=\"'ngs-tab-label-' + i\"\n          [attr.aria-controls]=\"'ngs-tab-panel-' + i\"\n          [attr.aria-selected]=\"_selectedIndex === i\"\n          [attr.aria-disabled]=\"tab.disabled()\"\n          [attr.aria-label]=\"tab.ariaLabel()\"\n          [attr.aria-labelledby]=\"tab.ariaLabelledby()\"\n          [tabIndex]=\"_selectedIndex === i ? 0 : -1\"\n          [class.ngs-tab-label-active]=\"_selectedIndex === i\"\n          [class.ngs-tab-label-disabled]=\"tab.disabled()\"\n          [class.ngs-tab-label-stretched]=\"stretchTabs()\"\n          (click)=\"_onTabHeaderClick(i)\"\n        >\n          @if (tab.templateLabel()) {\n            <ng-container [ngTemplateOutlet]=\"tab.templateLabel()!.template\" />\n          } @else {\n            {{ tab.label() }}\n          }\n        </div>\n      }\n    </div>\n  </div>\n\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-after\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollAfter()\"\n            (click)=\"_scrollAfter()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n</div>\n\n<div class=\"ngs-tab-group-content\">\n  <div class=\"ngs-tab-panel-container\">\n    @for (tab of _tabs(); track tab; let i = $index) {\n      @if (_selectedIndex === i || preserveContent() || _isActive[i]) {\n        <div\n          class=\"ngs-tab-panel\"\n          [class.ngs-tab-panel-active]=\"_selectedIndex === i\"\n          [class.ngs-tab-group-enter-left]=\"_getEnterAnimation(i) === 'ngs-tab-group-enter-left'\"\n          [class.ngs-tab-group-enter-right]=\"_getEnterAnimation(i) === 'ngs-tab-group-enter-right'\"\n          [class.ngs-tab-group-leave-left]=\"_getLeaveAnimation(i) === 'ngs-tab-group-leave-left'\"\n          [class.ngs-tab-group-leave-right]=\"_getLeaveAnimation(i) === 'ngs-tab-group-leave-right'\"\n          role=\"tabpanel\"\n          [id]=\"'ngs-tab-panel-' + i\"\n          [attr.aria-labelledby]=\"'ngs-tab-label-' + i\"\n          [animate.enter]=\"_getEnterAnimation(i)\"\n          [animate.leave]=\"_getLeaveAnimation(i)\"\n        >\n          <ng-template [cdkPortalOutlet]=\"_getTabContent(tab)\" />\n        </div>\n      }\n    }\n  </div>\n</div>\n", styles: [":host{--ngs-tab-group-header-border-bottom: 1px solid var(--ngs-color-subtle);--ngs-tab-group-header-border-top: none;--ngs-tab-label-padding: 12px 16px;--ngs-tab-label-cursor: pointer;--ngs-tab-label-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-active-color: var(--ngs-color-primary);--ngs-tab-label-active-border-bottom: 2px solid var(--ngs-color-primary);--ngs-tab-label-active-border-top: 2px solid var(--ngs-color-primary);--ngs-tab-label-disabled-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-disabled-cursor: default;--ngs-tab-label-transition: color var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1);display:flex;flex-direction:column}:host.ngs-tab-group-inverted{flex-direction:column-reverse;--ngs-tab-group-header-border-bottom: none;--ngs-tab-group-header-border-top: 1px solid var(--ngs-color-subtle)}:host .ngs-tab-group-header-container{display:flex;flex-direction:row;position:relative;overflow:hidden;flex:none}:host .ngs-tab-group-header-container:before,:host .ngs-tab-group-header-container:after{content:\"\";position:absolute;left:0;right:0;z-index:1;pointer-events:none}:host .ngs-tab-group-header-container:before{top:0;border-top:var(--ngs-tab-group-header-border-top)}:host .ngs-tab-group-header-container:after{bottom:0;border-bottom:var(--ngs-tab-group-header-border-bottom)}:host .ngs-tab-group-header{display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex:1 0 auto}:host .ngs-tab-group-header::-webkit-scrollbar{display:none}:host .ngs-tab-label,:host .ngs-tab-link{padding:var(--ngs-tab-label-padding);cursor:var(--ngs-tab-label-cursor);color:var(--ngs-tab-label-color);position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:var(--ngs-tab-label-transition);white-space:nowrap;outline:none;flex:none;text-decoration:none}:host .ngs-tab-label:focus-visible,:host .ngs-tab-link:focus-visible{background:var(--ngs-color-surface-container-high)}:host .ngs-tab-label.ngs-tab-label-stretched,:host .ngs-tab-label.ngs-tab-link-stretched,:host .ngs-tab-link.ngs-tab-label-stretched,:host .ngs-tab-link.ngs-tab-link-stretched{flex-grow:1}:host .ngs-tab-label.ngs-tab-label-active,:host .ngs-tab-label.ngs-tab-link-active,:host .ngs-tab-link.ngs-tab-label-active,:host .ngs-tab-link.ngs-tab-link-active{color:var(--ngs-tab-label-active-color)}:host .ngs-tab-label.ngs-tab-label-active:after,:host .ngs-tab-label.ngs-tab-link-active:after,:host .ngs-tab-link.ngs-tab-label-active:after,:host .ngs-tab-link.ngs-tab-link-active:after{content:\"\";position:absolute;left:0;right:0;bottom:0;height:0;border-bottom:var(--ngs-tab-label-active-border-bottom);z-index:2}.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-link-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-link-active:after{bottom:auto;top:0;border-bottom:none;border-top:var(--ngs-tab-label-active-border-top);z-index:2}:host .ngs-tab-label.ngs-tab-label-disabled,:host .ngs-tab-label.ngs-tab-link-disabled,:host .ngs-tab-link.ngs-tab-label-disabled,:host .ngs-tab-link.ngs-tab-link-disabled{color:var(--ngs-tab-label-disabled-color);cursor:var(--ngs-tab-label-disabled-cursor);pointer-events:none}:host .ngs-tab-group-header-list{display:flex;flex-direction:row;flex-wrap:nowrap;width:max-content;min-width:100%}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-start{justify-content:flex-start}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-center{justify-content:center}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-end{justify-content:flex-end}:host .ngs-tab-group-pagination-control{padding:0 12px;cursor:pointer;display:flex;align-items:center;justify-content:center;background:none;border:none;outline:none;color:var(--ngs-tab-label-color);transition:opacity .2s cubic-bezier(.35,0,.25,1)}:host .ngs-tab-group-pagination-control.ngs-tab-group-pagination-control-disabled{opacity:.38;cursor:default;pointer-events:none}:host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-icon{width:10px;height:10px;border-top:2px solid currentColor;border-right:2px solid currentColor;display:inline-block}:host .ngs-tab-group-pagination-control-before .ngs-tab-group-pagination-control-icon{transform:rotate(-135deg);margin-left:4px}:host .ngs-tab-group-pagination-control-after .ngs-tab-group-pagination-control-icon{transform:rotate(45deg);margin-right:4px}:host{--ngs-tab-content-padding: 0;--ngs-tab-panel-transition: opacity var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1)}:host .ngs-tab-panel{width:100%;flex-shrink:0;box-sizing:border-box;animation-duration:var(--ngs-tab-group-animation-duration, .5s);animation-fill-mode:forwards;animation-timing-function:cubic-bezier(.35,0,.25,1);position:relative;display:none}:host .ngs-tab-panel.ngs-tab-panel-active,:host .ngs-tab-panel.ngs-tab-group-leave-left,:host .ngs-tab-panel.ngs-tab-group-leave-right,:host .ngs-tab-panel.ngs-tab-group-enter-left,:host .ngs-tab-panel.ngs-tab-group-enter-right{display:block}:host .ngs-tab-panel:not(.ngs-tab-panel-active){position:absolute;top:0;left:0;z-index:1;pointer-events:none}:host .ngs-tab-panel.ngs-tab-panel-active{z-index:2}@keyframes ngs-tab-group-enter-left{0%{transform:translate3d(-100%,0,0)}to{transform:none}}@keyframes ngs-tab-group-enter-right{0%{transform:translate3d(100%,0,0)}to{transform:none}}@keyframes ngs-tab-group-leave-left{0%{transform:none}to{transform:translate3d(-100%,0,0)}}@keyframes ngs-tab-group-leave-right{0%{transform:none}to{transform:translate3d(100%,0,0)}}:host .ngs-tab-group-enter-left{animation-name:ngs-tab-group-enter-left}:host .ngs-tab-group-enter-right{animation-name:ngs-tab-group-enter-right}:host .ngs-tab-group-leave-left{animation-name:ngs-tab-group-leave-left}:host .ngs-tab-group-leave-right{animation-name:ngs-tab-group-leave-right}:host .ngs-tab-group-content{padding:var(--ngs-tab-content-padding);overflow:hidden;position:relative;flex-grow:1}:host .ngs-tab-panel-container{display:flex;flex-direction:row;position:relative;overflow:hidden;height:100%}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: Ripple, selector: "[ngsRipple]", inputs: ["ngsRippleColor", "ngsRippleUnbounded", "ngsRippleCentered", "ngsRippleRadius", "ngsRippleAnimation", "ngsRippleDisabled", "ngsRippleTrigger"], outputs: ["ngsRippleCenteredChange", "ngsRippleDisabledChange", "ngsRippleTriggerChange"], exportAs: ["ngsRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabGroup, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-tab-group', standalone: true, imports: [CommonModule, PortalModule, Ripple], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        'class': 'ngs-tab-group',
                        '[class.ngs-tab-group-inverted]': 'headerPosition() === "below"',
                        '[style.--ngs-tab-group-animation-duration]': 'animationDuration()',
                    }, template: "<div class=\"ngs-tab-group-header-container\" [class.ngs-tab-group-header-pagination-controls-enabled]=\"_showPaginationControls()\">\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-before\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollBefore()\"\n            (click)=\"_scrollBefore()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n\n  <div class=\"ngs-tab-group-header\"\n       #tabListContainer\n       role=\"tablist\"\n       (scroll)=\"_handleScroll()\"\n       (keydown)=\"_onKeydown($event)\">\n    <div class=\"ngs-tab-group-header-list\" #tabList\n         [class.ngs-tab-group-header-list-align-start]=\"alignTabs() === 'start'\"\n         [class.ngs-tab-group-header-list-align-center]=\"alignTabs() === 'center'\"\n         [class.ngs-tab-group-header-list-align-end]=\"alignTabs() === 'end'\">\n      @for (tab of _tabs(); track tab; let i = $index) {\n        <div\n          #tabLabel\n          class=\"ngs-tab-label\"\n          role=\"tab\"\n          ngsRipple\n          [ngsRippleDisabled]=\"tab.disabled() || disableRipple()\"\n          [id]=\"'ngs-tab-label-' + i\"\n          [attr.aria-controls]=\"'ngs-tab-panel-' + i\"\n          [attr.aria-selected]=\"_selectedIndex === i\"\n          [attr.aria-disabled]=\"tab.disabled()\"\n          [attr.aria-label]=\"tab.ariaLabel()\"\n          [attr.aria-labelledby]=\"tab.ariaLabelledby()\"\n          [tabIndex]=\"_selectedIndex === i ? 0 : -1\"\n          [class.ngs-tab-label-active]=\"_selectedIndex === i\"\n          [class.ngs-tab-label-disabled]=\"tab.disabled()\"\n          [class.ngs-tab-label-stretched]=\"stretchTabs()\"\n          (click)=\"_onTabHeaderClick(i)\"\n        >\n          @if (tab.templateLabel()) {\n            <ng-container [ngTemplateOutlet]=\"tab.templateLabel()!.template\" />\n          } @else {\n            {{ tab.label() }}\n          }\n        </div>\n      }\n    </div>\n  </div>\n\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-after\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollAfter()\"\n            (click)=\"_scrollAfter()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n</div>\n\n<div class=\"ngs-tab-group-content\">\n  <div class=\"ngs-tab-panel-container\">\n    @for (tab of _tabs(); track tab; let i = $index) {\n      @if (_selectedIndex === i || preserveContent() || _isActive[i]) {\n        <div\n          class=\"ngs-tab-panel\"\n          [class.ngs-tab-panel-active]=\"_selectedIndex === i\"\n          [class.ngs-tab-group-enter-left]=\"_getEnterAnimation(i) === 'ngs-tab-group-enter-left'\"\n          [class.ngs-tab-group-enter-right]=\"_getEnterAnimation(i) === 'ngs-tab-group-enter-right'\"\n          [class.ngs-tab-group-leave-left]=\"_getLeaveAnimation(i) === 'ngs-tab-group-leave-left'\"\n          [class.ngs-tab-group-leave-right]=\"_getLeaveAnimation(i) === 'ngs-tab-group-leave-right'\"\n          role=\"tabpanel\"\n          [id]=\"'ngs-tab-panel-' + i\"\n          [attr.aria-labelledby]=\"'ngs-tab-label-' + i\"\n          [animate.enter]=\"_getEnterAnimation(i)\"\n          [animate.leave]=\"_getLeaveAnimation(i)\"\n        >\n          <ng-template [cdkPortalOutlet]=\"_getTabContent(tab)\" />\n        </div>\n      }\n    }\n  </div>\n</div>\n", styles: [":host{--ngs-tab-group-header-border-bottom: 1px solid var(--ngs-color-subtle);--ngs-tab-group-header-border-top: none;--ngs-tab-label-padding: 12px 16px;--ngs-tab-label-cursor: pointer;--ngs-tab-label-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-active-color: var(--ngs-color-primary);--ngs-tab-label-active-border-bottom: 2px solid var(--ngs-color-primary);--ngs-tab-label-active-border-top: 2px solid var(--ngs-color-primary);--ngs-tab-label-disabled-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-disabled-cursor: default;--ngs-tab-label-transition: color var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1);display:flex;flex-direction:column}:host.ngs-tab-group-inverted{flex-direction:column-reverse;--ngs-tab-group-header-border-bottom: none;--ngs-tab-group-header-border-top: 1px solid var(--ngs-color-subtle)}:host .ngs-tab-group-header-container{display:flex;flex-direction:row;position:relative;overflow:hidden;flex:none}:host .ngs-tab-group-header-container:before,:host .ngs-tab-group-header-container:after{content:\"\";position:absolute;left:0;right:0;z-index:1;pointer-events:none}:host .ngs-tab-group-header-container:before{top:0;border-top:var(--ngs-tab-group-header-border-top)}:host .ngs-tab-group-header-container:after{bottom:0;border-bottom:var(--ngs-tab-group-header-border-bottom)}:host .ngs-tab-group-header{display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex:1 0 auto}:host .ngs-tab-group-header::-webkit-scrollbar{display:none}:host .ngs-tab-label,:host .ngs-tab-link{padding:var(--ngs-tab-label-padding);cursor:var(--ngs-tab-label-cursor);color:var(--ngs-tab-label-color);position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:var(--ngs-tab-label-transition);white-space:nowrap;outline:none;flex:none;text-decoration:none}:host .ngs-tab-label:focus-visible,:host .ngs-tab-link:focus-visible{background:var(--ngs-color-surface-container-high)}:host .ngs-tab-label.ngs-tab-label-stretched,:host .ngs-tab-label.ngs-tab-link-stretched,:host .ngs-tab-link.ngs-tab-label-stretched,:host .ngs-tab-link.ngs-tab-link-stretched{flex-grow:1}:host .ngs-tab-label.ngs-tab-label-active,:host .ngs-tab-label.ngs-tab-link-active,:host .ngs-tab-link.ngs-tab-label-active,:host .ngs-tab-link.ngs-tab-link-active{color:var(--ngs-tab-label-active-color)}:host .ngs-tab-label.ngs-tab-label-active:after,:host .ngs-tab-label.ngs-tab-link-active:after,:host .ngs-tab-link.ngs-tab-label-active:after,:host .ngs-tab-link.ngs-tab-link-active:after{content:\"\";position:absolute;left:0;right:0;bottom:0;height:0;border-bottom:var(--ngs-tab-label-active-border-bottom);z-index:2}.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-link-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-link-active:after{bottom:auto;top:0;border-bottom:none;border-top:var(--ngs-tab-label-active-border-top);z-index:2}:host .ngs-tab-label.ngs-tab-label-disabled,:host .ngs-tab-label.ngs-tab-link-disabled,:host .ngs-tab-link.ngs-tab-label-disabled,:host .ngs-tab-link.ngs-tab-link-disabled{color:var(--ngs-tab-label-disabled-color);cursor:var(--ngs-tab-label-disabled-cursor);pointer-events:none}:host .ngs-tab-group-header-list{display:flex;flex-direction:row;flex-wrap:nowrap;width:max-content;min-width:100%}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-start{justify-content:flex-start}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-center{justify-content:center}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-end{justify-content:flex-end}:host .ngs-tab-group-pagination-control{padding:0 12px;cursor:pointer;display:flex;align-items:center;justify-content:center;background:none;border:none;outline:none;color:var(--ngs-tab-label-color);transition:opacity .2s cubic-bezier(.35,0,.25,1)}:host .ngs-tab-group-pagination-control.ngs-tab-group-pagination-control-disabled{opacity:.38;cursor:default;pointer-events:none}:host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-icon{width:10px;height:10px;border-top:2px solid currentColor;border-right:2px solid currentColor;display:inline-block}:host .ngs-tab-group-pagination-control-before .ngs-tab-group-pagination-control-icon{transform:rotate(-135deg);margin-left:4px}:host .ngs-tab-group-pagination-control-after .ngs-tab-group-pagination-control-icon{transform:rotate(45deg);margin-right:4px}:host{--ngs-tab-content-padding: 0;--ngs-tab-panel-transition: opacity var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1)}:host .ngs-tab-panel{width:100%;flex-shrink:0;box-sizing:border-box;animation-duration:var(--ngs-tab-group-animation-duration, .5s);animation-fill-mode:forwards;animation-timing-function:cubic-bezier(.35,0,.25,1);position:relative;display:none}:host .ngs-tab-panel.ngs-tab-panel-active,:host .ngs-tab-panel.ngs-tab-group-leave-left,:host .ngs-tab-panel.ngs-tab-group-leave-right,:host .ngs-tab-panel.ngs-tab-group-enter-left,:host .ngs-tab-panel.ngs-tab-group-enter-right{display:block}:host .ngs-tab-panel:not(.ngs-tab-panel-active){position:absolute;top:0;left:0;z-index:1;pointer-events:none}:host .ngs-tab-panel.ngs-tab-panel-active{z-index:2}@keyframes ngs-tab-group-enter-left{0%{transform:translate3d(-100%,0,0)}to{transform:none}}@keyframes ngs-tab-group-enter-right{0%{transform:translate3d(100%,0,0)}to{transform:none}}@keyframes ngs-tab-group-leave-left{0%{transform:none}to{transform:translate3d(-100%,0,0)}}@keyframes ngs-tab-group-leave-right{0%{transform:none}to{transform:translate3d(100%,0,0)}}:host .ngs-tab-group-enter-left{animation-name:ngs-tab-group-enter-left}:host .ngs-tab-group-enter-right{animation-name:ngs-tab-group-enter-right}:host .ngs-tab-group-leave-left{animation-name:ngs-tab-group-leave-left}:host .ngs-tab-group-leave-right{animation-name:ngs-tab-group-leave-right}:host .ngs-tab-group-content{padding:var(--ngs-tab-content-padding);overflow:hidden;position:relative;flex-grow:1}:host .ngs-tab-panel-container{display:flex;flex-direction:row;position:relative;overflow:hidden;height:100%}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], ctorParameters: () => [], propDecorators: { _tabs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => Tab), { isSignal: true }] }], _tabLabels: [{ type: i0.ViewChildren, args: ['tabLabel', { isSignal: true }] }], _tabListContainer: [{ type: i0.ViewChild, args: ['tabListContainer', { isSignal: true }] }], _tabList: [{ type: i0.ViewChild, args: ['tabList', { isSignal: true }] }], selectedIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIndex", required: false }] }], headerPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerPosition", required: false }] }], preserveContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "preserveContent", required: false }] }], stretchTabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngs-stretch-tabs", required: false }] }], alignTabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngs-align-tabs", required: false }] }], disableRipple: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableRipple", required: false }] }], animationDuration: [{ type: i0.Input, args: [{ isSignal: true, alias: "animationDuration", required: false }] }], enterAnimation: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate.enter", required: false }] }], leaveAnimation: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate.leave", required: false }] }], selectedIndexChange: [{ type: i0.Output, args: ["selectedIndexChange"] }], selectedTabChange: [{ type: i0.Output, args: ["selectedTabChange"] }], focusChange: [{ type: i0.Output, args: ["focusChange"] }] } });

class TabLink {
    _el = inject((ElementRef));
    _parent = inject(TabNavBar, { optional: true });
    _routerLink = inject(RouterLink, { optional: true });
    // Whether the link is currently active
    active = computed(() => {
        const parent = this._parent;
        if (!parent?.isActiveFn) {
            return false;
        }
        const fn = parent.isActiveFn();
        return fn(this);
    }, ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
    // Whether the link is disabled
    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    // Optional external control to disable ripple on this link
    rippleDisabled = input(false, { ...(ngDevMode ? { debugName: "rippleDisabled" } : /* istanbul ignore next */ {}), alias: 'ngsRippleDisabled', transform: booleanAttribute });
    // Combined ripple disabled state: own disabled OR parent bar disableRipple OR explicit input
    get ngsRippleDisabled() {
        return this.disabled() || !!this._parent?.disableRipple() || this.rippleDisabled();
    }
    // Link should control the provided nav panel id when active
    _ariaControls() {
        const panel = this._parent?.tabPanel();
        return this.active() && panel ? panel.id : null;
    }
    // Prevent click when disabled, otherwise let parent handle focus/scroll
    _onClick(event) {
        if (this.disabled()) {
            event.preventDefault();
            event.stopImmediatePropagation();
        }
    }
    focus() { this._el.nativeElement.focus(); }
    get elementRef() { return this._el; }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabLink, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: TabLink, isStandalone: true, selector: "a[ngs-tab-link]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, rippleDisabled: { classPropertyName: "rippleDisabled", publicName: "ngsRippleDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tab" }, listeners: { "click": "_onClick($event)" }, properties: { "class.ngs-tab-link-active": "active()", "class.ngs-tab-link-disabled": "disabled()", "attr.aria-selected": "active() ? \"true\" : \"false\"", "attr.aria-disabled": "disabled() ? \"true\" : \"false\"", "tabIndex": "disabled() ? -1 : 0", "attr.aria-controls": "_ariaControls()" }, classAttribute: "ngs-tab-link" }, hostDirectives: [{ directive: i1$1.Ripple, inputs: ["ngsRippleDisabled", "ngsRippleDisabled"] }], ngImport: i0, template: "<ng-content/>\n", styles: [":host{--ngs-tab-label-padding: 12px 16px;--ngs-tab-label-cursor: pointer;--ngs-tab-label-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-active-color: var(--ngs-color-primary);--ngs-tab-label-active-border-bottom: 2px solid var(--ngs-color-primary);--ngs-tab-label-transition: color var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1);--ngs-tab-label-disabled-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-disabled-cursor: default;padding:var(--ngs-tab-label-padding);cursor:var(--ngs-tab-label-cursor);color:var(--ngs-tab-label-color);position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:var(--ngs-tab-label-transition);white-space:nowrap;outline:none;flex:none;text-decoration:none}:host:focus-visible{background:var(--ngs-color-surface-container-high)}:host.ngs-tab-link-stretched{flex-grow:1}:host.ngs-tab-link-active{color:var(--ngs-tab-label-active-color)}:host.ngs-tab-link-active:after{content:\"\";position:absolute;left:0;right:0;bottom:0;height:0;border-bottom:var(--ngs-tab-label-active-border-bottom);z-index:2}:host.ngs-tab-link-disabled{color:var(--ngs-tab-label-disabled-color);cursor:var(--ngs-tab-label-disabled-cursor);pointer-events:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabLink, decorators: [{
            type: Component,
            args: [{ selector: 'a[ngs-tab-link]', standalone: true, host: {
                        'role': 'tab',
                        'class': 'ngs-tab-link',
                        '[class.ngs-tab-link-active]': 'active()',
                        '[class.ngs-tab-link-disabled]': 'disabled()',
                        '[attr.aria-selected]': 'active() ? "true" : "false"',
                        '[attr.aria-disabled]': 'disabled() ? "true" : "false"',
                        '[tabIndex]': 'disabled() ? -1 : 0',
                        '[attr.aria-controls]': '_ariaControls()',
                        '(click)': '_onClick($event)'
                    }, hostDirectives: [
                        { directive: Ripple, inputs: ['ngsRippleDisabled: ngsRippleDisabled'] }
                    ], template: "<ng-content/>\n", styles: [":host{--ngs-tab-label-padding: 12px 16px;--ngs-tab-label-cursor: pointer;--ngs-tab-label-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-active-color: var(--ngs-color-primary);--ngs-tab-label-active-border-bottom: 2px solid var(--ngs-color-primary);--ngs-tab-label-transition: color var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1);--ngs-tab-label-disabled-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-disabled-cursor: default;padding:var(--ngs-tab-label-padding);cursor:var(--ngs-tab-label-cursor);color:var(--ngs-tab-label-color);position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:var(--ngs-tab-label-transition);white-space:nowrap;outline:none;flex:none;text-decoration:none}:host:focus-visible{background:var(--ngs-color-surface-container-high)}:host.ngs-tab-link-stretched{flex-grow:1}:host.ngs-tab-link-active{color:var(--ngs-tab-label-active-color)}:host.ngs-tab-link-active:after{content:\"\";position:absolute;left:0;right:0;bottom:0;height:0;border-bottom:var(--ngs-tab-label-active-border-bottom);z-index:2}:host.ngs-tab-link-disabled{color:var(--ngs-tab-label-disabled-color);cursor:var(--ngs-tab-label-disabled-cursor);pointer-events:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], rippleDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsRippleDisabled", required: false }] }] } });

class TabNavBar {
    _cdr = inject(ChangeDetectorRef);
    platformId = inject(PLATFORM_ID);
    currentUrl = signal(isPlatformBrowser(inject(PLATFORM_ID)) ? inject(Router).url : '', ...(ngDevMode ? [{ debugName: "currentUrl" }] : /* istanbul ignore next */ []));
    _router = inject(Router);
    _destroyRef = inject(DestroyRef);
    // Projected links
    _links = contentChildren(TabLink, ...(ngDevMode ? [{ debugName: "_links" }] : /* istanbul ignore next */ []));
    // Scrolling container references
    _tabListContainer = viewChild('tabListContainer', ...(ngDevMode ? [{ debugName: "_tabListContainer" }] : /* istanbul ignore next */ []));
    _tabList = viewChild('tabList', ...(ngDevMode ? [{ debugName: "_tabList" }] : /* istanbul ignore next */ []));
    // Pagination state
    _showPaginationControls = signal(false, ...(ngDevMode ? [{ debugName: "_showPaginationControls" }] : /* istanbul ignore next */ []));
    _disableScrollBefore = signal(true, ...(ngDevMode ? [{ debugName: "_disableScrollBefore" }] : /* istanbul ignore next */ []));
    _disableScrollAfter = signal(true, ...(ngDevMode ? [{ debugName: "_disableScrollAfter" }] : /* istanbul ignore next */ []));
    // External bindings
    tabPanel = input(null, ...(ngDevMode ? [{ debugName: "tabPanel" }] : /* istanbul ignore next */ []));
    disableRipple = input(false, ...(ngDevMode ? [{ debugName: "disableRipple" }] : /* istanbul ignore next */ []));
    activator = input(...(ngDevMode ? [undefined, { debugName: "activator" }] : /* istanbul ignore next */ []));
    isActiveFn = computed(() => (link) => {
        const activatorFn = this.activator();
        if (activatorFn) {
            return activatorFn(link);
        }
        return this.defaultIsActive(link);
    }, ...(ngDevMode ? [{ debugName: "isActiveFn" }] : /* istanbul ignore next */ []));
    _resizeObserver = null;
    _resizeSubscription = Subscription.EMPTY;
    defaultIsActive(link) {
        const el = link.elementRef.nativeElement;
        // @ts-ignore
        const routerLink = link['_routerLink'];
        let href = '';
        if (routerLink) {
            href = this._router.serializeUrl(routerLink.urlTree);
        }
        else {
            href = el.getAttribute('href') || '';
        }
        if (!href || href === '#') {
            return false;
        }
        try {
            const linkPath = new URL(href, window.location.origin).pathname;
            const currentPath = new URL(this.currentUrl(), window.location.origin).pathname;
            return currentPath === linkPath;
        }
        catch {
            return false;
        }
    }
    constructor() {
        // Update pagination when links change (signal-based)
        effect(() => {
            // Track the projected links array reactively
            this._links();
            // Trigger re-evaluation of currentUrl to ensure links react to projection
            this.currentUrl.set(this._router.url);
            Promise.resolve().then(() => {
                this._updatePagination();
                this._cdr.markForCheck();
            });
            // Fallback: double check after a small delay to ensure routerLink has updated its urlTree
            setTimeout(() => {
                this.currentUrl.set(this._router.url);
                this._cdr.markForCheck();
            }, 0);
        });
    }
    ngOnInit() {
        if (isPlatformBrowser(this.platformId)) {
            this.currentUrl.set(this._router.url);
            this._router.events.pipe(filter((event) => event instanceof NavigationEnd), takeUntilDestroyed(this._destroyRef)).subscribe(() => {
                this.currentUrl.set(this._router.url);
            });
        }
    }
    ngAfterViewInit() {
        if (isPlatformBrowser(this.platformId)) {
            // Fallback: listen to container resize
            const container = this._tabListContainer()?.nativeElement;
            if (container && 'ResizeObserver' in window) {
                this._resizeObserver = new ResizeObserver(() => this._updatePagination());
                this._resizeObserver.observe(container);
            }
            else if (container) {
                this._resizeSubscription = fromEvent(window, 'resize')
                    .pipe(debounceTime(100))
                    .subscribe(() => this._updatePagination());
            }
        }
        this._updatePagination();
    }
    ngOnDestroy() {
        this._resizeObserver?.disconnect();
        this._resizeSubscription.unsubscribe();
    }
    _handleScroll() {
        this._updateScrollButtonsState();
    }
    _scrollBefore() {
        const container = this._tabListContainer()?.nativeElement;
        if (!container)
            return;
        container.scrollBy({ left: -container.clientWidth, behavior: 'smooth' });
    }
    _scrollAfter() {
        const container = this._tabListContainer()?.nativeElement;
        if (!container)
            return;
        container.scrollBy({ left: container.clientWidth, behavior: 'smooth' });
    }
    _updatePagination() {
        const container = this._tabListContainer()?.nativeElement;
        const list = this._tabList()?.nativeElement;
        if (!container || !list)
            return;
        const show = list.scrollWidth > container.clientWidth + 1;
        this._showPaginationControls.set(show);
        this._updateScrollButtonsState();
    }
    _updateScrollButtonsState() {
        const container = this._tabListContainer()?.nativeElement;
        if (!container)
            return;
        const maxScroll = container.scrollWidth - container.clientWidth;
        this._disableScrollBefore.set(container.scrollLeft <= 0);
        this._disableScrollAfter.set(container.scrollLeft >= maxScroll);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabNavBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: TabNavBar, isStandalone: true, selector: "ngs-tab-nav-bar, [ngs-tab-nav-bar]", inputs: { tabPanel: { classPropertyName: "tabPanel", publicName: "tabPanel", isSignal: true, isRequired: false, transformFunction: null }, disableRipple: { classPropertyName: "disableRipple", publicName: "disableRipple", isSignal: true, isRequired: false, transformFunction: null }, activator: { classPropertyName: "activator", publicName: "activator", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ngs-tab-nav-bar" }, queries: [{ propertyName: "_links", predicate: TabLink, isSignal: true }], viewQueries: [{ propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, isSignal: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, isSignal: true }], exportAs: ["ngsTabNavBar"], ngImport: i0, template: "<div class=\"ngs-tab-group-header-container\" [class.ngs-tab-group-header-pagination-controls-enabled]=\"_showPaginationControls()\">\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-before\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollBefore()\"\n            (click)=\"_scrollBefore()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n\n  <div class=\"ngs-tab-group-header\"\n       #tabListContainer\n       (scroll)=\"_handleScroll()\">\n    <div class=\"ngs-tab-group-header-list\" #tabList>\n      <ng-content select=\"a[ngs-tab-link]\"/>\n    </div>\n  </div>\n\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-after\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollAfter()\"\n            (click)=\"_scrollAfter()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n</div>\n", styles: [":host{--ngs-tab-group-header-border-bottom: 1px solid var(--ngs-color-subtle);--ngs-tab-group-header-border-top: none;--ngs-tab-label-padding: 12px 16px;--ngs-tab-label-cursor: pointer;--ngs-tab-label-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-active-color: var(--ngs-color-primary);--ngs-tab-label-active-border-bottom: 2px solid var(--ngs-color-primary);--ngs-tab-label-active-border-top: 2px solid var(--ngs-color-primary);--ngs-tab-label-disabled-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-disabled-cursor: default;--ngs-tab-label-transition: color var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1);display:flex;flex-direction:column}:host.ngs-tab-group-inverted{flex-direction:column-reverse;--ngs-tab-group-header-border-bottom: none;--ngs-tab-group-header-border-top: 1px solid var(--ngs-color-subtle)}:host .ngs-tab-group-header-container{display:flex;flex-direction:row;position:relative;overflow:hidden;flex:none}:host .ngs-tab-group-header-container:before,:host .ngs-tab-group-header-container:after{content:\"\";position:absolute;left:0;right:0;z-index:1;pointer-events:none}:host .ngs-tab-group-header-container:before{top:0;border-top:var(--ngs-tab-group-header-border-top)}:host .ngs-tab-group-header-container:after{bottom:0;border-bottom:var(--ngs-tab-group-header-border-bottom)}:host .ngs-tab-group-header{display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex:1 0 auto}:host .ngs-tab-group-header::-webkit-scrollbar{display:none}:host .ngs-tab-label,:host .ngs-tab-link{padding:var(--ngs-tab-label-padding);cursor:var(--ngs-tab-label-cursor);color:var(--ngs-tab-label-color);position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:var(--ngs-tab-label-transition);white-space:nowrap;outline:none;flex:none;text-decoration:none}:host .ngs-tab-label:focus-visible,:host .ngs-tab-link:focus-visible{background:var(--ngs-color-surface-container-high)}:host .ngs-tab-label.ngs-tab-label-stretched,:host .ngs-tab-label.ngs-tab-link-stretched,:host .ngs-tab-link.ngs-tab-label-stretched,:host .ngs-tab-link.ngs-tab-link-stretched{flex-grow:1}:host .ngs-tab-label.ngs-tab-label-active,:host .ngs-tab-label.ngs-tab-link-active,:host .ngs-tab-link.ngs-tab-label-active,:host .ngs-tab-link.ngs-tab-link-active{color:var(--ngs-tab-label-active-color)}:host .ngs-tab-label.ngs-tab-label-active:after,:host .ngs-tab-label.ngs-tab-link-active:after,:host .ngs-tab-link.ngs-tab-label-active:after,:host .ngs-tab-link.ngs-tab-link-active:after{content:\"\";position:absolute;left:0;right:0;bottom:0;height:0;border-bottom:var(--ngs-tab-label-active-border-bottom);z-index:2}.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-link-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-link-active:after{bottom:auto;top:0;border-bottom:none;border-top:var(--ngs-tab-label-active-border-top);z-index:2}:host .ngs-tab-label.ngs-tab-label-disabled,:host .ngs-tab-label.ngs-tab-link-disabled,:host .ngs-tab-link.ngs-tab-label-disabled,:host .ngs-tab-link.ngs-tab-link-disabled{color:var(--ngs-tab-label-disabled-color);cursor:var(--ngs-tab-label-disabled-cursor);pointer-events:none}:host .ngs-tab-group-header-list{display:flex;flex-direction:row;flex-wrap:nowrap;width:max-content;min-width:100%}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-start{justify-content:flex-start}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-center{justify-content:center}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-end{justify-content:flex-end}:host .ngs-tab-group-pagination-control{padding:0 12px;cursor:pointer;display:flex;align-items:center;justify-content:center;background:none;border:none;outline:none;color:var(--ngs-tab-label-color);transition:opacity .2s cubic-bezier(.35,0,.25,1)}:host .ngs-tab-group-pagination-control.ngs-tab-group-pagination-control-disabled{opacity:.38;cursor:default;pointer-events:none}:host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-icon{width:10px;height:10px;border-top:2px solid currentColor;border-right:2px solid currentColor;display:inline-block}:host .ngs-tab-group-pagination-control-before .ngs-tab-group-pagination-control-icon{transform:rotate(-135deg);margin-left:4px}:host .ngs-tab-group-pagination-control-after .ngs-tab-group-pagination-control-icon{transform:rotate(45deg);margin-right:4px}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabNavBar, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-tab-nav-bar, [ngs-tab-nav-bar]', exportAs: 'ngsTabNavBar', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        'class': 'ngs-tab-nav-bar'
                    }, template: "<div class=\"ngs-tab-group-header-container\" [class.ngs-tab-group-header-pagination-controls-enabled]=\"_showPaginationControls()\">\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-before\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollBefore()\"\n            (click)=\"_scrollBefore()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n\n  <div class=\"ngs-tab-group-header\"\n       #tabListContainer\n       (scroll)=\"_handleScroll()\">\n    <div class=\"ngs-tab-group-header-list\" #tabList>\n      <ng-content select=\"a[ngs-tab-link]\"/>\n    </div>\n  </div>\n\n  @if (_showPaginationControls()) {\n    <button class=\"ngs-tab-group-pagination-control ngs-tab-group-pagination-control-after\"\n            [class.ngs-tab-group-pagination-control-disabled]=\"_disableScrollAfter()\"\n            (click)=\"_scrollAfter()\"\n            type=\"button\"\n            aria-hidden=\"true\">\n      <div class=\"ngs-tab-group-pagination-control-icon\"></div>\n    </button>\n  }\n</div>\n", styles: [":host{--ngs-tab-group-header-border-bottom: 1px solid var(--ngs-color-subtle);--ngs-tab-group-header-border-top: none;--ngs-tab-label-padding: 12px 16px;--ngs-tab-label-cursor: pointer;--ngs-tab-label-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-active-color: var(--ngs-color-primary);--ngs-tab-label-active-border-bottom: 2px solid var(--ngs-color-primary);--ngs-tab-label-active-border-top: 2px solid var(--ngs-color-primary);--ngs-tab-label-disabled-color: var(--ngs-color-on-surface-variant);--ngs-tab-label-disabled-cursor: default;--ngs-tab-label-transition: color var(--ngs-tab-group-animation-duration, .2s) cubic-bezier(.35, 0, .25, 1);display:flex;flex-direction:column}:host.ngs-tab-group-inverted{flex-direction:column-reverse;--ngs-tab-group-header-border-bottom: none;--ngs-tab-group-header-border-top: 1px solid var(--ngs-color-subtle)}:host .ngs-tab-group-header-container{display:flex;flex-direction:row;position:relative;overflow:hidden;flex:none}:host .ngs-tab-group-header-container:before,:host .ngs-tab-group-header-container:after{content:\"\";position:absolute;left:0;right:0;z-index:1;pointer-events:none}:host .ngs-tab-group-header-container:before{top:0;border-top:var(--ngs-tab-group-header-border-top)}:host .ngs-tab-group-header-container:after{bottom:0;border-bottom:var(--ngs-tab-group-header-border-bottom)}:host .ngs-tab-group-header{display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex:1 0 auto}:host .ngs-tab-group-header::-webkit-scrollbar{display:none}:host .ngs-tab-label,:host .ngs-tab-link{padding:var(--ngs-tab-label-padding);cursor:var(--ngs-tab-label-cursor);color:var(--ngs-tab-label-color);position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:var(--ngs-tab-label-transition);white-space:nowrap;outline:none;flex:none;text-decoration:none}:host .ngs-tab-label:focus-visible,:host .ngs-tab-link:focus-visible{background:var(--ngs-color-surface-container-high)}:host .ngs-tab-label.ngs-tab-label-stretched,:host .ngs-tab-label.ngs-tab-link-stretched,:host .ngs-tab-link.ngs-tab-label-stretched,:host .ngs-tab-link.ngs-tab-link-stretched{flex-grow:1}:host .ngs-tab-label.ngs-tab-label-active,:host .ngs-tab-label.ngs-tab-link-active,:host .ngs-tab-link.ngs-tab-label-active,:host .ngs-tab-link.ngs-tab-link-active{color:var(--ngs-tab-label-active-color)}:host .ngs-tab-label.ngs-tab-label-active:after,:host .ngs-tab-label.ngs-tab-link-active:after,:host .ngs-tab-link.ngs-tab-label-active:after,:host .ngs-tab-link.ngs-tab-link-active:after{content:\"\";position:absolute;left:0;right:0;bottom:0;height:0;border-bottom:var(--ngs-tab-label-active-border-bottom);z-index:2}.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-label.ngs-tab-link-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-label-active:after,.ngs-tab-group-inverted :host .ngs-tab-link.ngs-tab-link-active:after{bottom:auto;top:0;border-bottom:none;border-top:var(--ngs-tab-label-active-border-top);z-index:2}:host .ngs-tab-label.ngs-tab-label-disabled,:host .ngs-tab-label.ngs-tab-link-disabled,:host .ngs-tab-link.ngs-tab-label-disabled,:host .ngs-tab-link.ngs-tab-link-disabled{color:var(--ngs-tab-label-disabled-color);cursor:var(--ngs-tab-label-disabled-cursor);pointer-events:none}:host .ngs-tab-group-header-list{display:flex;flex-direction:row;flex-wrap:nowrap;width:max-content;min-width:100%}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-start{justify-content:flex-start}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-center{justify-content:center}:host .ngs-tab-group-header-list.ngs-tab-group-header-list-align-end{justify-content:flex-end}:host .ngs-tab-group-pagination-control{padding:0 12px;cursor:pointer;display:flex;align-items:center;justify-content:center;background:none;border:none;outline:none;color:var(--ngs-tab-label-color);transition:opacity .2s cubic-bezier(.35,0,.25,1)}:host .ngs-tab-group-pagination-control.ngs-tab-group-pagination-control-disabled{opacity:.38;cursor:default;pointer-events:none}:host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-before{border-right:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}.ngs-tab-group-inverted :host .ngs-tab-group-pagination-control-after{border-left:1px solid var(--ngs-color-outline-variant)}:host .ngs-tab-group-pagination-control-icon{width:10px;height:10px;border-top:2px solid currentColor;border-right:2px solid currentColor;display:inline-block}:host .ngs-tab-group-pagination-control-before .ngs-tab-group-pagination-control-icon{transform:rotate(-135deg);margin-left:4px}:host .ngs-tab-group-pagination-control-after .ngs-tab-group-pagination-control-icon{transform:rotate(45deg);margin-right:4px}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], ctorParameters: () => [], propDecorators: { _links: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TabLink), { isSignal: true }] }], _tabListContainer: [{ type: i0.ViewChild, args: ['tabListContainer', { isSignal: true }] }], _tabList: [{ type: i0.ViewChild, args: ['tabList', { isSignal: true }] }], tabPanel: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabPanel", required: false }] }], disableRipple: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableRipple", required: false }] }], activator: [{ type: i0.Input, args: [{ isSignal: true, alias: "activator", required: false }] }] } });

let nextUniqueId = 0;
class TabNavPanel {
    id = `ngs-tab-nav-panel-${nextUniqueId++}`;
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabNavPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TabNavPanel, isStandalone: true, selector: "ngs-tab-nav-panel", host: { attributes: { "role": "tabpanel" }, properties: { "attr.id": "id" }, classAttribute: "ngs-tab-nav-panel" }, exportAs: ["ngsTabNavPanel"], ngImport: i0, template: '<ng-content/>', isInline: true });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TabNavPanel, decorators: [{
            type: Component,
            args: [{
                    selector: 'ngs-tab-nav-panel',
                    exportAs: 'ngsTabNavPanel',
                    standalone: true,
                    host: {
                        'class': 'ngs-tab-nav-panel',
                        'role': 'tabpanel',
                        '[attr.id]': 'id'
                    },
                    template: '<ng-content/>'
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { TAB_CONTENT, TAB_LABEL, Tab, TabContent, TabGroup, TabLabel, TabLink, TabNavBar, TabNavPanel };
//# sourceMappingURL=ngstarter-ui-components-tabs.mjs.map
