cax-design-system 3.0.0 → 3.0.1

package/fesm2022/cax-design-system-tableconfiguration.mjs

@@ -70,10 +70,10 @@ class Tableconfiguration {
         }
         this.fontSizeChange.emit(this.fontConfiguration);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: Tableconfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.21", type: Tableconfiguration, isStandalone: true, selector: "cax-tableconfiguration", inputs: { fontConfiguration: "fontConfiguration", rowConfiguration: "rowConfiguration" }, outputs: { rowHeightChange: "rowHeightChange", fontSizeChange: "fontSizeChange", saveDefault: "saveDefault" }, host: { classAttribute: "cax-element" }, ngImport: i0, template: "<div class=\"table-configuration\">\n    <div class=\"table-font-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Font Size</span>\n            <cax-button (click)=\"emitTableConfiguration()\" [label]=\"'Save as default'\" [link]=\"true\" [size]=\"'small'\"></cax-button>\n        </div>\n        <div class=\"font-configuration\">\n            <div class=\"font-labels\">\n                <span class=\"cax-text-body-md-regular\" *ngFor=\"let option of fontSizeOptions\" [class.active]=\"getFontValue() === option\" [style.fontSize]=\"option + 'px'\" (click)=\"onFontLabelClick(option)\" class=\"cursor-pointer\">\n                    {{ option }}px\n                </span>\n            </div>\n            <div class=\"slider-wrapper\">\n                <cax-slider [min]=\"12\" [max]=\"18\" [step]=\"2\" [ngModel]=\"getFontValue()\" (onChange)=\"onSliderChange($event)\"></cax-slider>\n            </div>\n        </div>\n    </div>\n    <div class=\"table-row-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Row Height</span>\n        </div>\n        <div class=\"row-configuration\">\n            <li\n                class=\"cax-text-action-md-semibold\"\n                [class.active]=\"rowConfiguration === 'sm' && (fontConfiguration === 'sm' || fontConfiguration === 'md')\"\n                [class.disabled]=\"fontConfiguration === 'lg' || fontConfiguration === 'xl'\"\n                (click)=\"updateRowHeight('sm')\"\n            >\n                Small\n            </li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'md'\" (click)=\"updateRowHeight('md')\">Medium</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'lg'\" (click)=\"updateRowHeight('lg')\">Large</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'xl'\" (click)=\"updateRowHeight('xl')\">Extra Large</li>\n        </div>\n    </div>\n</div>\n", styles: ["cax-slider{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "cax-button", inputs: ["type", "iconPos", "icon", "badge", "rightIcon", "leftIcon", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i3.Slider, selector: "cax-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: Tableconfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: Tableconfiguration, isStandalone: true, selector: "cax-tableconfiguration", inputs: { fontConfiguration: "fontConfiguration", rowConfiguration: "rowConfiguration" }, outputs: { rowHeightChange: "rowHeightChange", fontSizeChange: "fontSizeChange", saveDefault: "saveDefault" }, host: { classAttribute: "cax-element" }, ngImport: i0, template: "<div class=\"table-configuration\">\n    <div class=\"table-font-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Font Size</span>\n            <cax-button (click)=\"emitTableConfiguration()\" [label]=\"'Save as default'\" [link]=\"true\" [size]=\"'small'\"></cax-button>\n        </div>\n        <div class=\"font-configuration\">\n            <div class=\"font-labels\">\n                <span class=\"cax-text-body-md-regular\" *ngFor=\"let option of fontSizeOptions\" [class.active]=\"getFontValue() === option\" [style.fontSize]=\"option + 'px'\" (click)=\"onFontLabelClick(option)\" class=\"cursor-pointer\">\n                    {{ option }}px\n                </span>\n            </div>\n            <div class=\"slider-wrapper\">\n                <cax-slider [min]=\"12\" [max]=\"18\" [step]=\"2\" [ngModel]=\"getFontValue()\" (onChange)=\"onSliderChange($event)\"></cax-slider>\n            </div>\n        </div>\n    </div>\n    <div class=\"table-row-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Row Height</span>\n        </div>\n        <div class=\"row-configuration\">\n            <li\n                class=\"cax-text-action-md-semibold\"\n                [class.active]=\"rowConfiguration === 'sm' && (fontConfiguration === 'sm' || fontConfiguration === 'md')\"\n                [class.disabled]=\"fontConfiguration === 'lg' || fontConfiguration === 'xl'\"\n                (click)=\"updateRowHeight('sm')\"\n            >\n                Small\n            </li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'md'\" (click)=\"updateRowHeight('md')\">Medium</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'lg'\" (click)=\"updateRowHeight('lg')\">Large</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'xl'\" (click)=\"updateRowHeight('xl')\">Extra Large</li>\n        </div>\n    </div>\n</div>\n", styles: ["cax-slider{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "cax-button", inputs: ["type", "iconPos", "icon", "badge", "rightIcon", "leftIcon", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i3.Slider, selector: "cax-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: Tableconfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: Tableconfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'cax-tableconfiguration', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [ButtonModule, CommonModule, SliderModule, FormsModule], standalone: true, host: {
                         class: 'cax-element'
@@ -91,11 +91,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
             }] } });
 
 class TableconfigurationModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TableconfigurationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: TableconfigurationModule, imports: [Tableconfiguration], exports: [Tableconfiguration] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TableconfigurationModule, imports: [Tableconfiguration] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TableconfigurationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: TableconfigurationModule, imports: [Tableconfiguration], exports: [Tableconfiguration] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TableconfigurationModule, imports: [Tableconfiguration] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TableconfigurationModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TableconfigurationModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [Tableconfiguration],

package/fesm2022/cax-design-system-tableconfiguration.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-tableconfiguration.mjs","sources":["../../src/app/components/tableconfiguration/tableconfiguration.ts","../../src/app/components/tableconfiguration/tableconfiguration.html","../../src/app/components/tableconfiguration/tableconfiguration.module.ts","../../src/app/components/tableconfiguration/cax-design-system-tableconfiguration.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';\nimport { ButtonModule } from 'cax-design-system/button';\nimport { SliderModule } from 'cax-design-system/slider';\nimport { FormsModule } from '@angular/forms';\n\n@Component({\n    selector: 'cax-tableconfiguration',\n    templateUrl: './tableconfiguration.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./tableconfiguration.scss'],\n    imports: [ButtonModule, CommonModule, SliderModule, FormsModule],\n    standalone: true,\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Tableconfiguration {\n    @Input() fontConfiguration: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n    @Input() rowConfiguration: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n    fontSizeOptions = [12, 14, 16, 18];\n\n    @Output() rowHeightChange: EventEmitter<'sm' | 'md' | 'lg' | 'xl'> = new EventEmitter<'sm' | 'md' | 'lg' | 'xl'>();\n    @Output() fontSizeChange: EventEmitter<'sm' | 'md' | 'lg' | 'xl'> = new EventEmitter<'sm' | 'md' | 'lg' | 'xl'>();\n    @Output() saveDefault: EventEmitter<any> = new EventEmitter();\n\n    getFontValue() {\n        switch (this.fontConfiguration) {\n            case 'sm':\n                return 12;\n            case 'md':\n                return 14;\n            case 'lg':\n                return 16;\n            case 'xl':\n                return 18;\n        }\n    }\n\n    updateRowHeight(size: 'sm' | 'md' | 'lg' | 'xl') {\n        if (size == 'sm' && (this.fontConfiguration === 'lg' || this.fontConfiguration === 'xl')) {\n            this.rowHeightChange.emit(this.rowConfiguration);\n        } else {\n            this.rowConfiguration = size;\n            this.rowHeightChange.emit(this.rowConfiguration);\n        }\n    }\n\n    emitTableConfiguration() {\n        this.saveDefault.emit({ fontSize: this.fontConfiguration, rowSize: this.rowConfiguration });\n    }\n\n    onSliderChange(event: any) {\n        this.updateFontConfiguration(event.value);\n    }\n\n    onFontLabelClick(value: number) {\n        this.updateFontConfiguration(value);\n    }\n\n    private updateFontConfiguration(newValue: number) {\n        switch (newValue) {\n            case 12:\n                this.fontConfiguration = 'sm';\n                break;\n            case 14:\n                this.fontConfiguration = 'md';\n                break;\n            case 16:\n                this.fontConfiguration = 'lg';\n                if (this.rowConfiguration === 'sm') this.rowConfiguration = 'md';\n                break;\n            case 18:\n                this.fontConfiguration = 'xl';\n                if (this.rowConfiguration === 'sm') this.rowConfiguration = 'md';\n                break;\n            default:\n                this.fontConfiguration = 'md';\n                break;\n        }\n        this.fontSizeChange.emit(this.fontConfiguration);\n    }\n}\n","<div class=\"table-configuration\">\n    <div class=\"table-font-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Font Size</span>\n            <cax-button (click)=\"emitTableConfiguration()\" [label]=\"'Save as default'\" [link]=\"true\" [size]=\"'small'\"></cax-button>\n        </div>\n        <div class=\"font-configuration\">\n            <div class=\"font-labels\">\n                <span class=\"cax-text-body-md-regular\" *ngFor=\"let option of fontSizeOptions\" [class.active]=\"getFontValue() === option\" [style.fontSize]=\"option + 'px'\" (click)=\"onFontLabelClick(option)\" class=\"cursor-pointer\">\n                    {{ option }}px\n                </span>\n            </div>\n            <div class=\"slider-wrapper\">\n                <cax-slider [min]=\"12\" [max]=\"18\" [step]=\"2\" [ngModel]=\"getFontValue()\" (onChange)=\"onSliderChange($event)\"></cax-slider>\n            </div>\n        </div>\n    </div>\n    <div class=\"table-row-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Row Height</span>\n        </div>\n        <div class=\"row-configuration\">\n            <li\n                class=\"cax-text-action-md-semibold\"\n                [class.active]=\"rowConfiguration === 'sm' && (fontConfiguration === 'sm' || fontConfiguration === 'md')\"\n                [class.disabled]=\"fontConfiguration === 'lg' || fontConfiguration === 'xl'\"\n                (click)=\"updateRowHeight('sm')\"\n            >\n                Small\n            </li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'md'\" (click)=\"updateRowHeight('md')\">Medium</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'lg'\" (click)=\"updateRowHeight('lg')\">Large</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'xl'\" (click)=\"updateRowHeight('xl')\">Extra Large</li>\n        </div>\n    </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { Tableconfiguration } from './tableconfiguration';\n\n@NgModule({\n    imports: [Tableconfiguration],\n    exports: [Tableconfiguration]\n})\nexport class TableconfigurationModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cax-design-system-tableconfiguration.mjs","sources":["../../src/app/components/tableconfiguration/tableconfiguration.ts","../../src/app/components/tableconfiguration/tableconfiguration.html","../../src/app/components/tableconfiguration/tableconfiguration.module.ts","../../src/app/components/tableconfiguration/cax-design-system-tableconfiguration.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';\nimport { ButtonModule } from 'cax-design-system/button';\nimport { SliderModule } from 'cax-design-system/slider';\nimport { FormsModule } from '@angular/forms';\n\n@Component({\n    selector: 'cax-tableconfiguration',\n    templateUrl: './tableconfiguration.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./tableconfiguration.scss'],\n    imports: [ButtonModule, CommonModule, SliderModule, FormsModule],\n    standalone: true,\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Tableconfiguration {\n    @Input() fontConfiguration: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n    @Input() rowConfiguration: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n    fontSizeOptions = [12, 14, 16, 18];\n\n    @Output() rowHeightChange: EventEmitter<'sm' | 'md' | 'lg' | 'xl'> = new EventEmitter<'sm' | 'md' | 'lg' | 'xl'>();\n    @Output() fontSizeChange: EventEmitter<'sm' | 'md' | 'lg' | 'xl'> = new EventEmitter<'sm' | 'md' | 'lg' | 'xl'>();\n    @Output() saveDefault: EventEmitter<any> = new EventEmitter();\n\n    getFontValue() {\n        switch (this.fontConfiguration) {\n            case 'sm':\n                return 12;\n            case 'md':\n                return 14;\n            case 'lg':\n                return 16;\n            case 'xl':\n                return 18;\n        }\n    }\n\n    updateRowHeight(size: 'sm' | 'md' | 'lg' | 'xl') {\n        if (size == 'sm' && (this.fontConfiguration === 'lg' || this.fontConfiguration === 'xl')) {\n            this.rowHeightChange.emit(this.rowConfiguration);\n        } else {\n            this.rowConfiguration = size;\n            this.rowHeightChange.emit(this.rowConfiguration);\n        }\n    }\n\n    emitTableConfiguration() {\n        this.saveDefault.emit({ fontSize: this.fontConfiguration, rowSize: this.rowConfiguration });\n    }\n\n    onSliderChange(event: any) {\n        this.updateFontConfiguration(event.value);\n    }\n\n    onFontLabelClick(value: number) {\n        this.updateFontConfiguration(value);\n    }\n\n    private updateFontConfiguration(newValue: number) {\n        switch (newValue) {\n            case 12:\n                this.fontConfiguration = 'sm';\n                break;\n            case 14:\n                this.fontConfiguration = 'md';\n                break;\n            case 16:\n                this.fontConfiguration = 'lg';\n                if (this.rowConfiguration === 'sm') this.rowConfiguration = 'md';\n                break;\n            case 18:\n                this.fontConfiguration = 'xl';\n                if (this.rowConfiguration === 'sm') this.rowConfiguration = 'md';\n                break;\n            default:\n                this.fontConfiguration = 'md';\n                break;\n        }\n        this.fontSizeChange.emit(this.fontConfiguration);\n    }\n}\n","<div class=\"table-configuration\">\n    <div class=\"table-font-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Font Size</span>\n            <cax-button (click)=\"emitTableConfiguration()\" [label]=\"'Save as default'\" [link]=\"true\" [size]=\"'small'\"></cax-button>\n        </div>\n        <div class=\"font-configuration\">\n            <div class=\"font-labels\">\n                <span class=\"cax-text-body-md-regular\" *ngFor=\"let option of fontSizeOptions\" [class.active]=\"getFontValue() === option\" [style.fontSize]=\"option + 'px'\" (click)=\"onFontLabelClick(option)\" class=\"cursor-pointer\">\n                    {{ option }}px\n                </span>\n            </div>\n            <div class=\"slider-wrapper\">\n                <cax-slider [min]=\"12\" [max]=\"18\" [step]=\"2\" [ngModel]=\"getFontValue()\" (onChange)=\"onSliderChange($event)\"></cax-slider>\n            </div>\n        </div>\n    </div>\n    <div class=\"table-row-size\">\n        <div class=\"header-details\">\n            <span class=\"cax-text-action-md-medium\">Row Height</span>\n        </div>\n        <div class=\"row-configuration\">\n            <li\n                class=\"cax-text-action-md-semibold\"\n                [class.active]=\"rowConfiguration === 'sm' && (fontConfiguration === 'sm' || fontConfiguration === 'md')\"\n                [class.disabled]=\"fontConfiguration === 'lg' || fontConfiguration === 'xl'\"\n                (click)=\"updateRowHeight('sm')\"\n            >\n                Small\n            </li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'md'\" (click)=\"updateRowHeight('md')\">Medium</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'lg'\" (click)=\"updateRowHeight('lg')\">Large</li>\n            <li class=\"cax-text-action-md-semibold\" [class.active]=\"rowConfiguration === 'xl'\" (click)=\"updateRowHeight('xl')\">Extra Large</li>\n        </div>\n    </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { Tableconfiguration } from './tableconfiguration';\n\n@NgModule({\n    imports: [Tableconfiguration],\n    exports: [Tableconfiguration]\n})\nexport class TableconfigurationModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cax-design-system-tabmenu.mjs

@@ -102,7 +102,7 @@ class TabMenu {
     _focusableItems;
     _model;
     _activeItem;
-    focusedItemInfo = signal(null);
+    focusedItemInfo = signal(null, ...(ngDevMode ? [{ debugName: "focusedItemInfo" }] : []));
     get focusableItems() {
         if (!this._focusableItems || !this._focusableItems.length) {
             this._focusableItems = (this.model || []).reduce((result, item) => {
@@ -337,8 +337,8 @@ class TabMenu {
             });
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabMenu, deps: [{ token: PLATFORM_ID }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.21", type: TabMenu, isStandalone: false, selector: "p-tabMenu", inputs: { model: "model", activeItem: "activeItem", scrollable: ["scrollable", "scrollable", booleanAttribute], popup: ["popup", "popup", booleanAttribute], style: "style", styleClass: "styleClass", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy" }, outputs: { activeItemChange: "activeItemChange" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "navbar", first: true, predicate: ["navbar"], descendants: true }, { propertyName: "inkbar", first: true, predicate: ["inkbar"], descendants: true }, { propertyName: "prevBtn", first: true, predicate: ["prevBtn"], descendants: true }, { propertyName: "nextBtn", first: true, predicate: ["nextBtn"], descendants: true }, { propertyName: "tabLink", predicate: ["tabLink"], descendants: true }, { propertyName: "tab", predicate: ["tab"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabMenu, deps: [{ token: PLATFORM_ID }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.25", type: TabMenu, isStandalone: false, selector: "p-tabMenu", inputs: { model: "model", activeItem: "activeItem", scrollable: ["scrollable", "scrollable", booleanAttribute], popup: ["popup", "popup", booleanAttribute], style: "style", styleClass: "styleClass", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy" }, outputs: { activeItemChange: "activeItemChange" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "navbar", first: true, predicate: ["navbar"], descendants: true }, { propertyName: "inkbar", first: true, predicate: ["inkbar"], descendants: true }, { propertyName: "prevBtn", first: true, predicate: ["prevBtn"], descendants: true }, { propertyName: "nextBtn", first: true, predicate: ["nextBtn"], descendants: true }, { propertyName: "tabLink", predicate: ["tabLink"], descendants: true }, { propertyName: "tab", predicate: ["tab"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
         <div [ngClass]="{ 'p-tabmenu p-component': true, 'p-tabmenu-scrollable': scrollable }" [ngStyle]="style" [class]="styleClass">
             <div class="p-tabmenu-nav-container">
                 <button *ngIf="scrollable && !backwardIsDisabled" #prevBtn class="p-tabmenu-nav-prev p-tabmenu-nav-btn p-link" (click)="navBackward()" type="button" role="navigation" pRipple>
@@ -424,7 +424,7 @@ class TabMenu {
         </div>
     `, isInline: true, styles: ["@layer cax{.p-tabmenu-nav-container{position:relative}.p-tabmenu-scrollable .p-tabmenu-nav-container{overflow:hidden}.p-tabmenu-nav-content{overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior:contain auto}.p-tabmenu-nav-btn{position:absolute;top:0;z-index:2;height:100%;display:flex;align-items:center;justify-content:center}.p-tabmenu-nav-prev{left:0}.p-tabmenu-nav-next{right:0}.p-tabview-nav-content::-webkit-scrollbar{display:none}.p-tabmenu-nav{display:flex;margin:0;padding:0;list-style-type:none;flex-wrap:nowrap}.p-tabmenu-nav a{cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center;position:relative;text-decoration:none;overflow:hidden}.p-tabmenu-nav a:focus{z-index:1}.p-tabmenu-nav .p-menuitem-text{line-height:1;white-space:nowrap}.p-tabmenu-ink-bar{display:none;z-index:1}.p-tabmenu-nav-content::-webkit-scrollbar{display:none}.p-tabmenuitem:not(.p-hidden){display:flex}}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(() => i2.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgStyle), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i0.forwardRef(() => i1.RouterLink), selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i0.forwardRef(() => i1.RouterLinkActive), selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: i0.forwardRef(() => i3.Tooltip), selector: "[caxTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "caxTooltip", "tooltipDisabled", "tooltipOptions", "linkUrl", "linkText"] }, { kind: "component", type: i0.forwardRef(() => ChevronLeftIcon), selector: "ChevronLeftIcon" }, { kind: "component", type: i0.forwardRef(() => ChevronRightIcon), selector: "ChevronRightIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabMenu, decorators: [{
             type: Component,
             args: [{ selector: 'p-tabMenu', template: `
         <div [ngClass]="{ 'p-tabmenu p-component': true, 'p-tabmenu-scrollable': scrollable }" [ngStyle]="style" [class]="styleClass">
@@ -562,11 +562,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
                 args: [CaxTemplate]
             }] } });
 class TabMenuModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: TabMenuModule, declarations: [TabMenu], imports: [CommonModule, RouterModule, SharedModule, RippleModule, TooltipModule, ChevronLeftIcon, ChevronRightIcon], exports: [TabMenu, RouterModule, SharedModule, TooltipModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabMenuModule, imports: [CommonModule, RouterModule, SharedModule, RippleModule, TooltipModule, ChevronLeftIcon, ChevronRightIcon, RouterModule, SharedModule, TooltipModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: TabMenuModule, declarations: [TabMenu], imports: [CommonModule, RouterModule, SharedModule, RippleModule, TooltipModule, ChevronLeftIcon, ChevronRightIcon], exports: [TabMenu, RouterModule, SharedModule, TooltipModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabMenuModule, imports: [CommonModule, RouterModule, SharedModule, RippleModule, TooltipModule, ChevronLeftIcon, ChevronRightIcon, RouterModule, SharedModule, TooltipModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabMenuModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabMenuModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, RouterModule, SharedModule, RippleModule, TooltipModule, ChevronLeftIcon, ChevronRightIcon],

package/fesm2022/cax-design-system-tabmenu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-tabmenu.mjs","sources":["../../src/app/components/tabmenu/tabmenu.ts","../../src/app/components/tabmenu/cax-design-system-tabmenu.ts"],"sourcesContent":["import { CommonModule, isPlatformBrowser } from '@angular/common';\nimport {\n    AfterContentInit,\n    AfterViewChecked,\n    AfterViewInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    Inject,\n    Input,\n    NgModule,\n    OnDestroy,\n    Output,\n    PLATFORM_ID,\n    QueryList,\n    SimpleChanges,\n    TemplateRef,\n    ViewChild,\n    ViewChildren,\n    ViewEncapsulation,\n    booleanAttribute,\n    signal\n} from '@angular/core';\nimport { ActivatedRoute, NavigationEnd, Router, RouterModule } from '@angular/router';\nimport { MenuItem, CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { ChevronLeftIcon } from 'cax-design-system/icons/chevronleft';\nimport { ChevronRightIcon } from 'cax-design-system/icons/chevronright';\nimport { RippleModule } from 'cax-design-system/ripple';\nimport { TooltipModule } from 'cax-design-system/tooltip';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { ObjectUtils } from 'cax-design-system/utils';\nimport { filter } from 'rxjs/operators';\n\n/**\n * TabMenu is a navigation component that displays items as tab headers.\n * @group Components\n */\n@Component({\n    selector: 'p-tabMenu',\n    template: `\n        <div [ngClass]=\"{ 'p-tabmenu p-component': true, 'p-tabmenu-scrollable': scrollable }\" [ngStyle]=\"style\" [class]=\"styleClass\">\n            <div class=\"p-tabmenu-nav-container\">\n                <button *ngIf=\"scrollable && !backwardIsDisabled\" #prevBtn class=\"p-tabmenu-nav-prev p-tabmenu-nav-btn p-link\" (click)=\"navBackward()\" type=\"button\" role=\"navigation\" pRipple>\n                    <ChevronLeftIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n                    <ng-template *ngTemplateOutlet=\"previousIconTemplate\"></ng-template>\n                </button>\n                <div #content class=\"p-tabmenu-nav-content\" (scroll)=\"onScroll($event)\">\n                    <ul #navbar class=\"p-tabmenu-nav p-reset\" role=\"menubar\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\">\n                        <li\n                            #tab\n                            *ngFor=\"let item of focusableItems; let i = index\"\n                            role=\"presentation\"\n                            [ngStyle]=\"item.style\"\n                            [class]=\"item.styleClass\"\n                            [attr.data-p-disabled]=\"disabled(item)\"\n                            [attr.data-p-highlight]=\"focusedItemInfo() === item\"\n                            (click)=\"itemClick($event, item)\"\n                            (keydown)=\"onKeydownItem($event, i, item)\"\n                            (focus)=\"onMenuItemFocus(item)\"\n                            [ngClass]=\"{ 'p-tabmenuitem': true, 'p-disabled': getItemProp(item, 'disabled'), 'p-highlight': isActive(item), 'p-hidden': item.visible === false }\"\n                            caxTooltip\n                            [tooltipOptions]=\"item.tooltipOptions\"\n                        >\n                            <a\n                                #tabLink\n                                *ngIf=\"!item.routerLink && !itemTemplate\"\n                                class=\"p-menuitem-link\"\n                                role=\"menuitem\"\n                                [attr.href]=\"getItemProp(item, 'url')\"\n                                [attr.id]=\"getItemProp(item, 'id')\"\n                                [attr.aria-disabled]=\"disabled(item)\"\n                                [attr.aria-label]=\"getItemProp(item, 'label')\"\n                                [attr.tabindex]=\"disabled(item) ? -1 : 0\"\n                                [target]=\"getItemProp(item, 'target')\"\n                                pRipple\n                            >\n                                <ng-container>\n                                    <span class=\"p-menuitem-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon\" [ngStyle]=\"item.iconStyle\"></span>\n                                    <span class=\"p-menuitem-text\" *ngIf=\"item.escape !== false; else htmlLabel\">{{ getItemProp(item, 'label') }}</span>\n                                    <ng-template #htmlLabel><span class=\"p-menuitem-text\" [innerHTML]=\"getItemProp(item, 'label')\"></span></ng-template>\n                                    <span class=\"p-menuitem-badge\" *ngIf=\"item.badge\" [ngClass]=\"item.badgeStyleClass\">{{ getItemProp(item, 'badge') }}</span>\n                                </ng-container>\n                            </a>\n                            <a\n                                #tabLink\n                                *ngIf=\"item.routerLink && !itemTemplate\"\n                                [routerLink]=\"item.routerLink\"\n                                [queryParams]=\"item.queryParams\"\n                                [routerLinkActive]=\"'p-menuitem-link-active'\"\n                                [routerLinkActiveOptions]=\"item.routerLinkActiveOptions || { exact: false }\"\n                                role=\"menuitem\"\n                                class=\"p-menuitem-link\"\n                                [target]=\"item.target\"\n                                [attr.id]=\"getItemProp(item, 'id')\"\n                                [attr.aria-disabled]=\"disabled(item)\"\n                                [attr.aria-label]=\"getItemProp(item, 'label')\"\n                                [attr.tabindex]=\"disabled(item) ? -1 : 0\"\n                                [fragment]=\"item.fragment\"\n                                [queryParamsHandling]=\"item.queryParamsHandling\"\n                                [preserveFragment]=\"item.preserveFragment\"\n                                [skipLocationChange]=\"item.skipLocationChange\"\n                                [replaceUrl]=\"item.replaceUrl\"\n                                [state]=\"item.state\"\n                                pRipple\n                            >\n                                <ng-container>\n                                    <span class=\"p-menuitem-icon\" [attr.aria-hidden]=\"true\" [ngClass]=\"item.icon\" *ngIf=\"item.icon\" [ngStyle]=\"item.iconStyle\"></span>\n                                    <span class=\"p-menuitem-text\" *ngIf=\"item.escape !== false; else htmlRouteLabel\">{{ getItemProp(item, 'label') }}</span>\n                                    <ng-template #htmlRouteLabel><span class=\"p-menuitem-text\" [innerHTML]=\"getItemProp(item, 'label')\"></span></ng-template>\n                                    <span class=\"p-menuitem-badge\" *ngIf=\"item.badge\" [ngClass]=\"item.badgeStyleClass\">{{ getItemProp(item, 'badge') }}</span>\n                                </ng-container>\n                            </a>\n                            <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, index: i }\"></ng-container>\n                        </li>\n                        <li #inkbar class=\"p-tabmenu-ink-bar\" role=\"none\"></li>\n                    </ul>\n                </div>\n                <button *ngIf=\"scrollable && !forwardIsDisabled\" #nextBtn class=\"p-tabmenu-nav-next p-tabmenu-nav-btn p-link\" (click)=\"navForward()\" type=\"button\" role=\"navigation\" pRipple>\n                    <ChevronRightIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n                    <ng-template *ngTemplateOutlet=\"nextIconTemplate\"></ng-template>\n                </button>\n            </div>\n        </div>\n    `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./tabmenu.css'],\n    standalone: false,\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class TabMenu implements AfterContentInit, AfterViewInit, AfterViewChecked, OnDestroy {\n    /**\n     * An array of menuitems.\n     * @group Props\n     */\n    @Input() set model(value: MenuItem[] | undefined) {\n        this._model = value;\n        this._focusableItems = (this._model || []).reduce((result, item) => {\n            result.push(item);\n\n            return result;\n        }, []);\n    }\n    get model(): MenuItem[] | undefined {\n        return this._model;\n    }\n    /**\n     * Defines the default active menuitem\n     * @group Props\n     */\n    @Input() set activeItem(value: MenuItem | undefined) {\n        this._activeItem = value;\n        this.activeItemChange.emit(value);\n        this.tabChanged = true;\n    }\n\n    get activeItem(): MenuItem | undefined {\n        return this._activeItem;\n    }\n    /**\n     * When enabled displays buttons at each side of the tab headers to scroll the tab list.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) scrollable: boolean | undefined;\n    /**\n     * Defines if popup mode enabled.\n     */\n    @Input({ transform: booleanAttribute }) popup: boolean | undefined;\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Defines a string value that labels an interactive element.\n     * @group Props\n     */\n    @Input() ariaLabel: string | undefined;\n    /**\n     * Identifier of the underlying input element.\n     * @group Props\n     */\n    @Input() ariaLabelledBy: string | undefined;\n    /**\n     * Event fired when a tab is selected.\n     * @param {MenuItem} item - Menu item.\n     * @group Emits\n     */\n    @Output() activeItemChange: EventEmitter<MenuItem> = new EventEmitter<MenuItem>();\n\n    @ViewChild('content') content: Nullable<ElementRef>;\n\n    @ViewChild('navbar') navbar: Nullable<ElementRef>;\n\n    @ViewChild('inkbar') inkbar: Nullable<ElementRef>;\n\n    @ViewChild('prevBtn') prevBtn: Nullable<ElementRef>;\n\n    @ViewChild('nextBtn') nextBtn: Nullable<ElementRef>;\n\n    @ViewChildren('tabLink') tabLink: Nullable<QueryList<ElementRef>>;\n\n    @ViewChildren('tab') tab: Nullable<QueryList<ElementRef>>;\n\n    @ContentChildren(CaxTemplate) templates: QueryList<CaxTemplate> | undefined;\n\n    itemTemplate: Nullable<TemplateRef<any>>;\n\n    previousIconTemplate: Nullable<TemplateRef<any>>;\n\n    nextIconTemplate: Nullable<TemplateRef<any>>;\n\n    tabChanged: boolean | undefined;\n\n    backwardIsDisabled: boolean = true;\n\n    forwardIsDisabled: boolean = false;\n\n    private timerIdForAutoScroll: any = null;\n\n    _focusableItems: MenuItem[] | undefined | any;\n\n    _model: MenuItem[] | undefined;\n\n    _activeItem: MenuItem | undefined;\n\n    focusedItemInfo = signal<any>(null);\n\n    get focusableItems() {\n        if (!this._focusableItems || !this._focusableItems.length) {\n            this._focusableItems = (this.model || []).reduce((result, item) => {\n                result.push(item);\n\n                return result;\n            }, []);\n        }\n        return this._focusableItems;\n    }\n\n    constructor(\n        @Inject(PLATFORM_ID) private platformId: any,\n        private router: Router,\n        private route: ActivatedRoute,\n        private cd: ChangeDetectorRef\n    ) {\n        this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe((event: NavigationEnd) => {\n            this.cd.markForCheck();\n        });\n    }\n\n    ngOnChanges(simpleChange: SimpleChanges) {\n        if (simpleChange.activeItem) {\n            this.autoScrollForActiveItem();\n        }\n    }\n\n    ngAfterContentInit() {\n        this.templates?.forEach((item) => {\n            switch (item.getType()) {\n                case 'item':\n                    this.itemTemplate = item.template;\n                    break;\n\n                case 'nexticon':\n                    this.nextIconTemplate = item.template;\n                    break;\n\n                case 'previousicon':\n                    this.previousIconTemplate = item.template;\n                    break;\n\n                default:\n                    this.itemTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    ngAfterViewInit(): void {\n        if (isPlatformBrowser(this.platformId)) {\n            this.updateInkBar();\n            this.autoScrollForActiveItem();\n            this.initButtonState();\n        }\n    }\n\n    ngAfterViewChecked() {\n        if (isPlatformBrowser(this.platformId)) {\n            this.updateInkBar();\n            this.tabChanged = false;\n        }\n    }\n\n    ngOnDestroy(): void {\n        this.clearAutoScrollHandler();\n    }\n\n    isActive(item: MenuItem) {\n        if (item.routerLink) {\n            const routerLink = Array.isArray(item.routerLink) ? item.routerLink : [item.routerLink];\n\n            return this.router.isActive(this.router.createUrlTree(routerLink, { relativeTo: this.route }).toString(), item.routerLinkActiveOptions?.exact ?? item.routerLinkActiveOptions ?? false);\n        }\n\n        return item === this.activeItem;\n    }\n\n    getItemProp(item: any, name: string) {\n        return item ? ObjectUtils.getItemValue(item[name]) : undefined;\n    }\n\n    visible(item) {\n        return typeof item.visible === 'function' ? item.visible() : item.visible !== false;\n    }\n\n    disabled(item) {\n        return typeof item.disabled === 'function' ? item.disabled() : item.disabled;\n    }\n\n    onMenuItemFocus(item) {\n        this.focusedItemInfo.set(item);\n    }\n\n    itemClick(event: Event, item: MenuItem) {\n        if (item.disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        if (!item.url && !item.routerLink) {\n            event.preventDefault();\n        }\n\n        if (item.command) {\n            item.command({\n                originalEvent: event,\n                item: item\n            });\n        }\n\n        this.activeItem = item;\n        this.tabChanged = true;\n        this.cd.markForCheck();\n    }\n\n    onKeydownItem(event, index, item) {\n        let i = index;\n\n        let foundElement = {};\n        const tabLinks = this.tabLink.toArray();\n        const tabs = this.tab.toArray();\n\n        switch (event.code) {\n            case 'ArrowRight':\n                foundElement = this.findNextItem(tabs, i);\n                i = foundElement['i'];\n                break;\n\n            case 'ArrowLeft':\n                foundElement = this.findPrevItem(tabs, i);\n                i = foundElement['i'];\n                break;\n\n            case 'End':\n                foundElement = this.findPrevItem(tabs, this.model.length);\n                i = foundElement['i'];\n\n                event.preventDefault();\n                break;\n\n            case 'Home':\n                foundElement = this.findNextItem(tabs, -1);\n                i = foundElement['i'];\n\n                event.preventDefault();\n                break;\n\n            case 'Space':\n            case 'Enter':\n                this.itemClick(event, item);\n                break;\n\n            case 'Tab':\n                this.onTabKeyDown(tabLinks);\n                break;\n\n            default:\n                break;\n        }\n\n        if (tabLinks[i] && tabLinks[index]) {\n            tabLinks[index].nativeElement.tabIndex = '-1';\n            tabLinks[i].nativeElement.tabIndex = '0';\n            tabLinks[i].nativeElement.focus();\n        }\n        this.cd.markForCheck();\n    }\n\n    onTabKeyDown(tabLinks) {\n        tabLinks.forEach((item) => {\n            item.nativeElement.tabIndex = DomHandler.getAttribute(item.nativeElement.parentElement, 'data-p-highlight') ? '0' : '-1';\n        });\n    }\n\n    findNextItem(items, index) {\n        let i = index + 1;\n\n        if (i >= items.length) {\n            return { nextItem: items[items.length], i: items.length };\n        }\n\n        let nextItem = items[i];\n\n        if (nextItem) return DomHandler.getAttribute(nextItem.nativeElement, 'data-p-disabled') ? this.findNextItem(items, i) : { nextItem: nextItem.nativeElement, i };\n        else return null;\n    }\n\n    findPrevItem(items, index) {\n        let i = index - 1;\n\n        if (i < 0) {\n            return { prevItem: items[0], i: 0 };\n        }\n\n        let prevItem = items[i];\n\n        if (prevItem) return DomHandler.getAttribute(prevItem.nativeElement, 'data-p-disabled') ? this.findPrevItem(items, i) : { prevItem: prevItem.nativeElement, i };\n        else return null;\n    }\n\n    updateInkBar() {\n        const tabHeader = DomHandler.findSingle(this.navbar?.nativeElement, 'li.p-highlight');\n        if (tabHeader) {\n            (this.inkbar as ElementRef).nativeElement.style.width = DomHandler.getWidth(tabHeader) + 'px';\n            (this.inkbar as ElementRef).nativeElement.style.left = DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(this.navbar?.nativeElement).left + 'px';\n        }\n    }\n\n    getVisibleButtonWidths() {\n        return [this.prevBtn?.nativeElement, this.nextBtn?.nativeElement].reduce((acc, el) => (el ? acc + DomHandler.getWidth(el) : acc), 0);\n    }\n\n    updateButtonState() {\n        const content = this.content?.nativeElement;\n        const { scrollLeft, scrollWidth } = content;\n        const width = DomHandler.getWidth(content);\n\n        this.backwardIsDisabled = scrollLeft === 0;\n        this.forwardIsDisabled = parseInt(scrollLeft) === scrollWidth - width;\n    }\n\n    updateScrollBar(index: number): void {\n        const tabHeader = this.navbar?.nativeElement.children[index];\n\n        if (!tabHeader) {\n            return;\n        }\n\n        if (tabHeader && typeof tabHeader.scrollIntoView === 'function') {\n            tabHeader.scrollIntoView({ block: 'nearest', inline: 'center' });\n        }\n    }\n\n    onScroll(event: Event) {\n        this.scrollable && this.updateButtonState();\n\n        event.preventDefault();\n    }\n\n    navBackward() {\n        const content = this.content?.nativeElement;\n        const width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();\n        const pos = content.scrollLeft - width;\n        content.scrollLeft = pos <= 0 ? 0 : pos;\n    }\n\n    navForward() {\n        const content = this.content?.nativeElement;\n        const width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();\n        const pos = content.scrollLeft + width;\n        const lastPos = content.scrollWidth - width;\n        content.scrollLeft = pos >= lastPos ? lastPos : pos;\n    }\n\n    private autoScrollForActiveItem(): void {\n        if (!this.scrollable) {\n            return;\n        }\n\n        this.clearAutoScrollHandler();\n        // We have to wait for the rendering and then can scroll to element.\n        this.timerIdForAutoScroll = setTimeout(() => {\n            const activeItem = (this.model as MenuItem[]).findIndex((menuItem) => this.isActive(menuItem));\n\n            if (activeItem !== -1) {\n                this.updateScrollBar(activeItem);\n            }\n        });\n    }\n\n    private clearAutoScrollHandler(): void {\n        if (this.timerIdForAutoScroll) {\n            clearTimeout(this.timerIdForAutoScroll);\n            this.timerIdForAutoScroll = null;\n        }\n    }\n\n    private initButtonState(): void {\n        if (this.scrollable) {\n            // We have to wait for the rendering and then retrieve the actual size element from the DOM.\n            // in future `Promise.resolve` can be changed to `queueMicrotask` (if ie11 support will be dropped)\n            Promise.resolve().then(() => {\n                this.updateButtonState();\n                this.cd.markForCheck();\n            });\n        }\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RouterModule, SharedModule, RippleModule, TooltipModule, ChevronLeftIcon, ChevronRightIcon],\n    exports: [TabMenu, RouterModule, SharedModule, TooltipModule],\n    declarations: [TabMenu]\n})\nexport class TabMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cax-design-system-tabmenu.mjs","sources":["../../src/app/components/tabmenu/tabmenu.ts","../../src/app/components/tabmenu/cax-design-system-tabmenu.ts"],"sourcesContent":["import { CommonModule, isPlatformBrowser } from '@angular/common';\nimport {\n    AfterContentInit,\n    AfterViewChecked,\n    AfterViewInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    Inject,\n    Input,\n    NgModule,\n    OnDestroy,\n    Output,\n    PLATFORM_ID,\n    QueryList,\n    SimpleChanges,\n    TemplateRef,\n    ViewChild,\n    ViewChildren,\n    ViewEncapsulation,\n    booleanAttribute,\n    signal\n} from '@angular/core';\nimport { ActivatedRoute, NavigationEnd, Router, RouterModule } from '@angular/router';\nimport { MenuItem, CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { ChevronLeftIcon } from 'cax-design-system/icons/chevronleft';\nimport { ChevronRightIcon } from 'cax-design-system/icons/chevronright';\nimport { RippleModule } from 'cax-design-system/ripple';\nimport { TooltipModule } from 'cax-design-system/tooltip';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { ObjectUtils } from 'cax-design-system/utils';\nimport { filter } from 'rxjs/operators';\n\n/**\n * TabMenu is a navigation component that displays items as tab headers.\n * @group Components\n */\n@Component({\n    selector: 'p-tabMenu',\n    template: `\n        <div [ngClass]=\"{ 'p-tabmenu p-component': true, 'p-tabmenu-scrollable': scrollable }\" [ngStyle]=\"style\" [class]=\"styleClass\">\n            <div class=\"p-tabmenu-nav-container\">\n                <button *ngIf=\"scrollable && !backwardIsDisabled\" #prevBtn class=\"p-tabmenu-nav-prev p-tabmenu-nav-btn p-link\" (click)=\"navBackward()\" type=\"button\" role=\"navigation\" pRipple>\n                    <ChevronLeftIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n                    <ng-template *ngTemplateOutlet=\"previousIconTemplate\"></ng-template>\n                </button>\n                <div #content class=\"p-tabmenu-nav-content\" (scroll)=\"onScroll($event)\">\n                    <ul #navbar class=\"p-tabmenu-nav p-reset\" role=\"menubar\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\">\n                        <li\n                            #tab\n                            *ngFor=\"let item of focusableItems; let i = index\"\n                            role=\"presentation\"\n                            [ngStyle]=\"item.style\"\n                            [class]=\"item.styleClass\"\n                            [attr.data-p-disabled]=\"disabled(item)\"\n                            [attr.data-p-highlight]=\"focusedItemInfo() === item\"\n                            (click)=\"itemClick($event, item)\"\n                            (keydown)=\"onKeydownItem($event, i, item)\"\n                            (focus)=\"onMenuItemFocus(item)\"\n                            [ngClass]=\"{ 'p-tabmenuitem': true, 'p-disabled': getItemProp(item, 'disabled'), 'p-highlight': isActive(item), 'p-hidden': item.visible === false }\"\n                            caxTooltip\n                            [tooltipOptions]=\"item.tooltipOptions\"\n                        >\n                            <a\n                                #tabLink\n                                *ngIf=\"!item.routerLink && !itemTemplate\"\n                                class=\"p-menuitem-link\"\n                                role=\"menuitem\"\n                                [attr.href]=\"getItemProp(item, 'url')\"\n                                [attr.id]=\"getItemProp(item, 'id')\"\n                                [attr.aria-disabled]=\"disabled(item)\"\n                                [attr.aria-label]=\"getItemProp(item, 'label')\"\n                                [attr.tabindex]=\"disabled(item) ? -1 : 0\"\n                                [target]=\"getItemProp(item, 'target')\"\n                                pRipple\n                            >\n                                <ng-container>\n                                    <span class=\"p-menuitem-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon\" [ngStyle]=\"item.iconStyle\"></span>\n                                    <span class=\"p-menuitem-text\" *ngIf=\"item.escape !== false; else htmlLabel\">{{ getItemProp(item, 'label') }}</span>\n                                    <ng-template #htmlLabel><span class=\"p-menuitem-text\" [innerHTML]=\"getItemProp(item, 'label')\"></span></ng-template>\n                                    <span class=\"p-menuitem-badge\" *ngIf=\"item.badge\" [ngClass]=\"item.badgeStyleClass\">{{ getItemProp(item, 'badge') }}</span>\n                                </ng-container>\n                            </a>\n                            <a\n                                #tabLink\n                                *ngIf=\"item.routerLink && !itemTemplate\"\n                                [routerLink]=\"item.routerLink\"\n                                [queryParams]=\"item.queryParams\"\n                                [routerLinkActive]=\"'p-menuitem-link-active'\"\n                                [routerLinkActiveOptions]=\"item.routerLinkActiveOptions || { exact: false }\"\n                                role=\"menuitem\"\n                                class=\"p-menuitem-link\"\n                                [target]=\"item.target\"\n                                [attr.id]=\"getItemProp(item, 'id')\"\n                                [attr.aria-disabled]=\"disabled(item)\"\n                                [attr.aria-label]=\"getItemProp(item, 'label')\"\n                                [attr.tabindex]=\"disabled(item) ? -1 : 0\"\n                                [fragment]=\"item.fragment\"\n                                [queryParamsHandling]=\"item.queryParamsHandling\"\n                                [preserveFragment]=\"item.preserveFragment\"\n                                [skipLocationChange]=\"item.skipLocationChange\"\n                                [replaceUrl]=\"item.replaceUrl\"\n                                [state]=\"item.state\"\n                                pRipple\n                            >\n                                <ng-container>\n                                    <span class=\"p-menuitem-icon\" [attr.aria-hidden]=\"true\" [ngClass]=\"item.icon\" *ngIf=\"item.icon\" [ngStyle]=\"item.iconStyle\"></span>\n                                    <span class=\"p-menuitem-text\" *ngIf=\"item.escape !== false; else htmlRouteLabel\">{{ getItemProp(item, 'label') }}</span>\n                                    <ng-template #htmlRouteLabel><span class=\"p-menuitem-text\" [innerHTML]=\"getItemProp(item, 'label')\"></span></ng-template>\n                                    <span class=\"p-menuitem-badge\" *ngIf=\"item.badge\" [ngClass]=\"item.badgeStyleClass\">{{ getItemProp(item, 'badge') }}</span>\n                                </ng-container>\n                            </a>\n                            <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, index: i }\"></ng-container>\n                        </li>\n                        <li #inkbar class=\"p-tabmenu-ink-bar\" role=\"none\"></li>\n                    </ul>\n                </div>\n                <button *ngIf=\"scrollable && !forwardIsDisabled\" #nextBtn class=\"p-tabmenu-nav-next p-tabmenu-nav-btn p-link\" (click)=\"navForward()\" type=\"button\" role=\"navigation\" pRipple>\n                    <ChevronRightIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n                    <ng-template *ngTemplateOutlet=\"nextIconTemplate\"></ng-template>\n                </button>\n            </div>\n        </div>\n    `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./tabmenu.css'],\n    standalone: false,\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class TabMenu implements AfterContentInit, AfterViewInit, AfterViewChecked, OnDestroy {\n    /**\n     * An array of menuitems.\n     * @group Props\n     */\n    @Input() set model(value: MenuItem[] | undefined) {\n        this._model = value;\n        this._focusableItems = (this._model || []).reduce((result, item) => {\n            result.push(item);\n\n            return result;\n        }, []);\n    }\n    get model(): MenuItem[] | undefined {\n        return this._model;\n    }\n    /**\n     * Defines the default active menuitem\n     * @group Props\n     */\n    @Input() set activeItem(value: MenuItem | undefined) {\n        this._activeItem = value;\n        this.activeItemChange.emit(value);\n        this.tabChanged = true;\n    }\n\n    get activeItem(): MenuItem | undefined {\n        return this._activeItem;\n    }\n    /**\n     * When enabled displays buttons at each side of the tab headers to scroll the tab list.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) scrollable: boolean | undefined;\n    /**\n     * Defines if popup mode enabled.\n     */\n    @Input({ transform: booleanAttribute }) popup: boolean | undefined;\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Defines a string value that labels an interactive element.\n     * @group Props\n     */\n    @Input() ariaLabel: string | undefined;\n    /**\n     * Identifier of the underlying input element.\n     * @group Props\n     */\n    @Input() ariaLabelledBy: string | undefined;\n    /**\n     * Event fired when a tab is selected.\n     * @param {MenuItem} item - Menu item.\n     * @group Emits\n     */\n    @Output() activeItemChange: EventEmitter<MenuItem> = new EventEmitter<MenuItem>();\n\n    @ViewChild('content') content: Nullable<ElementRef>;\n\n    @ViewChild('navbar') navbar: Nullable<ElementRef>;\n\n    @ViewChild('inkbar') inkbar: Nullable<ElementRef>;\n\n    @ViewChild('prevBtn') prevBtn: Nullable<ElementRef>;\n\n    @ViewChild('nextBtn') nextBtn: Nullable<ElementRef>;\n\n    @ViewChildren('tabLink') tabLink: Nullable<QueryList<ElementRef>>;\n\n    @ViewChildren('tab') tab: Nullable<QueryList<ElementRef>>;\n\n    @ContentChildren(CaxTemplate) templates: QueryList<CaxTemplate> | undefined;\n\n    itemTemplate: Nullable<TemplateRef<any>>;\n\n    previousIconTemplate: Nullable<TemplateRef<any>>;\n\n    nextIconTemplate: Nullable<TemplateRef<any>>;\n\n    tabChanged: boolean | undefined;\n\n    backwardIsDisabled: boolean = true;\n\n    forwardIsDisabled: boolean = false;\n\n    private timerIdForAutoScroll: any = null;\n\n    _focusableItems: MenuItem[] | undefined | any;\n\n    _model: MenuItem[] | undefined;\n\n    _activeItem: MenuItem | undefined;\n\n    focusedItemInfo = signal<any>(null);\n\n    get focusableItems() {\n        if (!this._focusableItems || !this._focusableItems.length) {\n            this._focusableItems = (this.model || []).reduce((result, item) => {\n                result.push(item);\n\n                return result;\n            }, []);\n        }\n        return this._focusableItems;\n    }\n\n    constructor(\n        @Inject(PLATFORM_ID) private platformId: any,\n        private router: Router,\n        private route: ActivatedRoute,\n        private cd: ChangeDetectorRef\n    ) {\n        this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe((event: NavigationEnd) => {\n            this.cd.markForCheck();\n        });\n    }\n\n    ngOnChanges(simpleChange: SimpleChanges) {\n        if (simpleChange.activeItem) {\n            this.autoScrollForActiveItem();\n        }\n    }\n\n    ngAfterContentInit() {\n        this.templates?.forEach((item) => {\n            switch (item.getType()) {\n                case 'item':\n                    this.itemTemplate = item.template;\n                    break;\n\n                case 'nexticon':\n                    this.nextIconTemplate = item.template;\n                    break;\n\n                case 'previousicon':\n                    this.previousIconTemplate = item.template;\n                    break;\n\n                default:\n                    this.itemTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    ngAfterViewInit(): void {\n        if (isPlatformBrowser(this.platformId)) {\n            this.updateInkBar();\n            this.autoScrollForActiveItem();\n            this.initButtonState();\n        }\n    }\n\n    ngAfterViewChecked() {\n        if (isPlatformBrowser(this.platformId)) {\n            this.updateInkBar();\n            this.tabChanged = false;\n        }\n    }\n\n    ngOnDestroy(): void {\n        this.clearAutoScrollHandler();\n    }\n\n    isActive(item: MenuItem) {\n        if (item.routerLink) {\n            const routerLink = Array.isArray(item.routerLink) ? item.routerLink : [item.routerLink];\n\n            return this.router.isActive(this.router.createUrlTree(routerLink, { relativeTo: this.route }).toString(), item.routerLinkActiveOptions?.exact ?? item.routerLinkActiveOptions ?? false);\n        }\n\n        return item === this.activeItem;\n    }\n\n    getItemProp(item: any, name: string) {\n        return item ? ObjectUtils.getItemValue(item[name]) : undefined;\n    }\n\n    visible(item) {\n        return typeof item.visible === 'function' ? item.visible() : item.visible !== false;\n    }\n\n    disabled(item) {\n        return typeof item.disabled === 'function' ? item.disabled() : item.disabled;\n    }\n\n    onMenuItemFocus(item) {\n        this.focusedItemInfo.set(item);\n    }\n\n    itemClick(event: Event, item: MenuItem) {\n        if (item.disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        if (!item.url && !item.routerLink) {\n            event.preventDefault();\n        }\n\n        if (item.command) {\n            item.command({\n                originalEvent: event,\n                item: item\n            });\n        }\n\n        this.activeItem = item;\n        this.tabChanged = true;\n        this.cd.markForCheck();\n    }\n\n    onKeydownItem(event, index, item) {\n        let i = index;\n\n        let foundElement = {};\n        const tabLinks = this.tabLink.toArray();\n        const tabs = this.tab.toArray();\n\n        switch (event.code) {\n            case 'ArrowRight':\n                foundElement = this.findNextItem(tabs, i);\n                i = foundElement['i'];\n                break;\n\n            case 'ArrowLeft':\n                foundElement = this.findPrevItem(tabs, i);\n                i = foundElement['i'];\n                break;\n\n            case 'End':\n                foundElement = this.findPrevItem(tabs, this.model.length);\n                i = foundElement['i'];\n\n                event.preventDefault();\n                break;\n\n            case 'Home':\n                foundElement = this.findNextItem(tabs, -1);\n                i = foundElement['i'];\n\n                event.preventDefault();\n                break;\n\n            case 'Space':\n            case 'Enter':\n                this.itemClick(event, item);\n                break;\n\n            case 'Tab':\n                this.onTabKeyDown(tabLinks);\n                break;\n\n            default:\n                break;\n        }\n\n        if (tabLinks[i] && tabLinks[index]) {\n            tabLinks[index].nativeElement.tabIndex = '-1';\n            tabLinks[i].nativeElement.tabIndex = '0';\n            tabLinks[i].nativeElement.focus();\n        }\n        this.cd.markForCheck();\n    }\n\n    onTabKeyDown(tabLinks) {\n        tabLinks.forEach((item) => {\n            item.nativeElement.tabIndex = DomHandler.getAttribute(item.nativeElement.parentElement, 'data-p-highlight') ? '0' : '-1';\n        });\n    }\n\n    findNextItem(items, index) {\n        let i = index + 1;\n\n        if (i >= items.length) {\n            return { nextItem: items[items.length], i: items.length };\n        }\n\n        let nextItem = items[i];\n\n        if (nextItem) return DomHandler.getAttribute(nextItem.nativeElement, 'data-p-disabled') ? this.findNextItem(items, i) : { nextItem: nextItem.nativeElement, i };\n        else return null;\n    }\n\n    findPrevItem(items, index) {\n        let i = index - 1;\n\n        if (i < 0) {\n            return { prevItem: items[0], i: 0 };\n        }\n\n        let prevItem = items[i];\n\n        if (prevItem) return DomHandler.getAttribute(prevItem.nativeElement, 'data-p-disabled') ? this.findPrevItem(items, i) : { prevItem: prevItem.nativeElement, i };\n        else return null;\n    }\n\n    updateInkBar() {\n        const tabHeader = DomHandler.findSingle(this.navbar?.nativeElement, 'li.p-highlight');\n        if (tabHeader) {\n            (this.inkbar as ElementRef).nativeElement.style.width = DomHandler.getWidth(tabHeader) + 'px';\n            (this.inkbar as ElementRef).nativeElement.style.left = DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(this.navbar?.nativeElement).left + 'px';\n        }\n    }\n\n    getVisibleButtonWidths() {\n        return [this.prevBtn?.nativeElement, this.nextBtn?.nativeElement].reduce((acc, el) => (el ? acc + DomHandler.getWidth(el) : acc), 0);\n    }\n\n    updateButtonState() {\n        const content = this.content?.nativeElement;\n        const { scrollLeft, scrollWidth } = content;\n        const width = DomHandler.getWidth(content);\n\n        this.backwardIsDisabled = scrollLeft === 0;\n        this.forwardIsDisabled = parseInt(scrollLeft) === scrollWidth - width;\n    }\n\n    updateScrollBar(index: number): void {\n        const tabHeader = this.navbar?.nativeElement.children[index];\n\n        if (!tabHeader) {\n            return;\n        }\n\n        if (tabHeader && typeof tabHeader.scrollIntoView === 'function') {\n            tabHeader.scrollIntoView({ block: 'nearest', inline: 'center' });\n        }\n    }\n\n    onScroll(event: Event) {\n        this.scrollable && this.updateButtonState();\n\n        event.preventDefault();\n    }\n\n    navBackward() {\n        const content = this.content?.nativeElement;\n        const width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();\n        const pos = content.scrollLeft - width;\n        content.scrollLeft = pos <= 0 ? 0 : pos;\n    }\n\n    navForward() {\n        const content = this.content?.nativeElement;\n        const width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();\n        const pos = content.scrollLeft + width;\n        const lastPos = content.scrollWidth - width;\n        content.scrollLeft = pos >= lastPos ? lastPos : pos;\n    }\n\n    private autoScrollForActiveItem(): void {\n        if (!this.scrollable) {\n            return;\n        }\n\n        this.clearAutoScrollHandler();\n        // We have to wait for the rendering and then can scroll to element.\n        this.timerIdForAutoScroll = setTimeout(() => {\n            const activeItem = (this.model as MenuItem[]).findIndex((menuItem) => this.isActive(menuItem));\n\n            if (activeItem !== -1) {\n                this.updateScrollBar(activeItem);\n            }\n        });\n    }\n\n    private clearAutoScrollHandler(): void {\n        if (this.timerIdForAutoScroll) {\n            clearTimeout(this.timerIdForAutoScroll);\n            this.timerIdForAutoScroll = null;\n        }\n    }\n\n    private initButtonState(): void {\n        if (this.scrollable) {\n            // We have to wait for the rendering and then retrieve the actual size element from the DOM.\n            // in future `Promise.resolve` can be changed to `queueMicrotask` (if ie11 support will be dropped)\n            Promise.resolve().then(() => {\n                this.updateButtonState();\n                this.cd.markForCheck();\n            });\n        }\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RouterModule, SharedModule, RippleModule, TooltipModule, ChevronLeftIcon, ChevronRightIcon],\n    exports: [TabMenu, RouterModule, SharedModule, TooltipModule],\n    declarations: [TabMenu]\n})\nexport class TabMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cax-design-system-tabview.mjs

@@ -238,10 +238,10 @@ class TabPanel {
     ngOnDestroy() {
         this.view = null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabPanel, deps: [{ token: forwardRef(() => TabView) }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.21", type: TabPanel, isStandalone: false, selector: "cax-tabPanel", inputs: { closable: ["closable", "closable", booleanAttribute], headerStyle: "headerStyle", headerStyleClass: "headerStyleClass", cache: ["cache", "cache", booleanAttribute], tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", selected: "selected", disabled: "disabled", pinned: "pinned", header: "header", icon: "icon", leftIcon: "leftIcon", rightIcon: "rightIcon" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], ngImport: i0, template: "<div *ngIf=\"!closed\" class=\"cax-tabview-panel\" role=\"tabpanel\" [hidden]=\"!selected\" [attr.id]=\"tabView.getTabContentId(id)\" [attr.aria-hidden]=\"!selected\" [attr.aria-labelledby]=\"tabView.getTabHeaderActionId(id)\" [attr.data-pc-name]=\"'tabpanel'\">\n    <ng-content></ng-content>\n    <ng-container *ngIf=\"contentTemplate && (cache ? loaded : selected)\">\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabPanel, deps: [{ token: forwardRef(() => TabView) }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.25", type: TabPanel, isStandalone: false, selector: "cax-tabPanel", inputs: { closable: ["closable", "closable", booleanAttribute], headerStyle: "headerStyle", headerStyleClass: "headerStyleClass", cache: ["cache", "cache", booleanAttribute], tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", selected: "selected", disabled: "disabled", pinned: "pinned", header: "header", icon: "icon", leftIcon: "leftIcon", rightIcon: "rightIcon" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], ngImport: i0, template: "<div *ngIf=\"!closed\" class=\"cax-tabview-panel\" role=\"tabpanel\" [hidden]=\"!selected\" [attr.id]=\"tabView.getTabContentId(id)\" [attr.aria-hidden]=\"!selected\" [attr.aria-labelledby]=\"tabView.getTabHeaderActionId(id)\" [attr.data-pc-name]=\"'tabpanel'\">\n    <ng-content></ng-content>\n    <ng-container *ngIf=\"contentTemplate && (cache ? loaded : selected)\">\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabPanel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabPanel, decorators: [{
             type: Component,
             args: [{ selector: 'cax-tabPanel', host: {
                         class: 'cax-element'
@@ -915,10 +915,10 @@ class TabView {
         }
         this.cd.detectChanges();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabView, deps: [{ token: PLATFORM_ID }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.21", type: TabView, isStandalone: false, selector: "cax-tabView", inputs: { fullMode: "fullMode", size: "size", style: "style", styleClass: "styleClass", controlClose: ["controlClose", "controlClose", booleanAttribute], scrollable: ["scrollable", "scrollable", booleanAttribute], activeIndex: "activeIndex", selectOnFocus: ["selectOnFocus", "selectOnFocus", booleanAttribute], nextButtonAriaLabel: "nextButtonAriaLabel", prevButtonAriaLabel: "prevButtonAriaLabel", autoHideButtons: ["autoHideButtons", "autoHideButtons", booleanAttribute], tabindex: ["tabindex", "tabindex", numberAttribute], mode: "mode", pinnedIndexes: "pinnedIndexes" }, outputs: { onChange: "onChange", onClose: "onClose", activeIndexChange: "activeIndexChange" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "tabPanels", predicate: TabPanel }, { propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "navbar", first: true, predicate: ["navbar"], descendants: true }, { propertyName: "prevBtn", first: true, predicate: ["prevBtn"], descendants: true }, { propertyName: "nextBtn", first: true, predicate: ["nextBtn"], descendants: true }, { propertyName: "inkbar", first: true, predicate: ["inkbar"], descendants: true }, { propertyName: "elementToObserve", first: true, predicate: ["elementToObserve"], descendants: true }], ngImport: i0, template: "<div\n    [ngClass]=\"{ 'cax-tabview cax-component': true, 'cax-tabview-scrollable': scrollable, 'cax-tabview-sm': size === 'sm', 'cax-tabview-md': size === 'md', 'cax-tabview-lg': size === 'lg' }\"\n    [ngStyle]=\"style\"\n    [class]=\"styleClass\"\n    [attr.data-pc-name]=\"'tabview'\"\n>\n    <div #elementToObserve class=\"cax-tabview-nav-container\" *ngIf=\"mode == 'line'\" [ngClass]=\"fullMode ? 'block-mode' : 'flex-mode'\">\n        <button\n            *ngIf=\"scrollable && !backwardIsDisabled && buttonVisible\"\n            #prevBtn\n            class=\"cax-tabview-nav-prev cax-tabview-nav-btn cax-link\"\n            (click)=\"navBackward()\"\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"prevButtonAriaLabel\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronLeftIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"previousIconTemplate\"></ng-template>\n        </button>\n        <div #content class=\"cax-tabview-nav-content\" (scroll)=\"onScroll($event)\" [attr.data-pc-section]=\"'navcontent'\">\n            <ul #navbar class=\"cax-tabview-nav\" role=\"tablist\" [attr.data-pc-section]=\"'nav'\">\n                <ng-template ngFor let-tab [ngForOf]=\"tabs\" let-i=\"index\">\n                    <li\n                        role=\"presentation\"\n                        [ngClass]=\"{ 'cax-highlight': tab.selected, 'cax-disabled': tab.disabled }\"\n                        [attr.data-cax-disabled]=\"tab.disabled\"\n                        [ngStyle]=\"tab.headerStyle\"\n                        [class]=\"tab.headerStyleClass\"\n                        [class.full-mode]=\"fullMode\"\n                        [class.half-mode]=\"!fullMode\"\n                        *ngIf=\"!tab.closed\"\n                    >\n                        <a\n                            role=\"tab\"\n                            class=\"cax-tabview-nav-link\"\n                            [caxTooltip]=\"tab.tooltip\"\n                            [tooltipPosition]=\"tab.tooltipPosition\"\n                            [positionStyle]=\"tab.tooltipPositionStyle\"\n                            [tooltipStyleClass]=\"tab.tooltipStyleClass\"\n                            [attr.id]=\"getTabHeaderActionId(tab.id)\"\n                            [attr.aria-controls]=\"getTabContentId(tab.id)\"\n                            [attr.aria-selected]=\"tab.selected\"\n                            [attr.tabindex]=\"tab.disabled ? '-1' : tabindex\"\n                            [attr.aria-disabled]=\"tab.disabled\"\n                            [attr.data-pc-index]=\"i\"\n                            [attr.data-pc-section]=\"'headeraction'\"\n                            (click)=\"open($event, tab)\"\n                            (keydown)=\"onTabKeyDown($event, tab)\"\n                            caxRipple\n                        >\n                            <ng-container *ngIf=\"!tab.headerTemplate\">\n                                <span class=\"cax-tabview-left-icon\" [ngClass]=\"tab.leftIcon\" *ngIf=\"tab.leftIcon && !tab.leftIconTemplate\"></span>\n                                <span *ngIf=\"tab.leftIconTemplate\" class=\"cax-tabview-left-icon\">\n                                    <ng-template *ngTemplateOutlet=\"tab.leftIconTemplate\"></ng-template>\n                                </span>\n                                <span *ngIf=\"tab.icon\" class=\"cax-dynamic-icon\" [class]=\"tab.icon\"></span>\n                                <span class=\"cax-tabview-title\" [class]=\"tab.selected ? `cax-text-action-${size}-semibold` : `cax-text-action-${size}-medium`\">{{ tab.header }}</span>\n                                <span class=\"cax-tabview-right-icon\" [ngClass]=\"tab.rightIcon\" *ngIf=\"tab.rightIcon && !tab.rightIconTemplate\"></span>\n                                <span *ngIf=\"tab.rightIconTemplate\" class=\"cax-tabview-right-icon\">\n                                    <ng-template *ngTemplateOutlet=\"tab.rightIconTemplate\"></ng-template>\n                                </span>\n                            </ng-container>\n                            <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\n                            <ng-container *ngIf=\"tab.closable\">\n                                <TimesIcon *ngIf=\"!tab.closeIconTemplate\" [styleClass]=\"'cax-tabview-close'\" (click)=\"close($event, tab)\" />\n                                <span class=\"cax-tabview-close\" *ngIf=\"tab.closeIconTemplate\">\n                                    <ng-template *ngTemplateOutlet=\"tab.closeIconTemplate\"></ng-template>\n                                </span>\n                            </ng-container>\n                        </a>\n                    </li>\n                </ng-template>\n                <li #inkbar class=\"cax-tabview-ink-bar\" role=\"presentation\" aria-hidden=\"true\" [attr.data-pc-section]=\"'inkbar'\"></li>\n            </ul>\n        </div>\n\n        <!-- Configurable Template -->\n        <div class=\"cax-tabview-action-buttons\" *ngIf=\"mode == 'line' && actionTemplate && !fullMode\">\n            <div class=\"cax-tabview-separator\"></div>\n            <ng-container *ngTemplateOutlet=\"actionTemplate\"></ng-container>\n        </div>\n\n        <button\n            *ngIf=\"scrollable && !forwardIsDisabled && buttonVisible\"\n            #nextBtn\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"nextButtonAriaLabel\"\n            class=\"cax-tabview-nav-next cax-tabview-nav-btn cax-link\"\n            (click)=\"navForward()\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronRightIcon *ngIf=\"!nextIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"nextIconTemplate\"></ng-template>\n        </button>\n    </div>\n    <div #elementToObserve class=\"cax-tabview-nav-container cax-segment-tabview-container\" *ngIf=\"mode == 'segment'\">\n        <button\n            *ngIf=\"scrollable && !backwardIsDisabled && buttonVisible && !segmentOverflow\"\n            #prevBtnSegment\n            class=\"cax-tabview-nav-prev cax-segment-tabview-nav-btn cax-link\"\n            (click)=\"navBackward()\"\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"prevButtonAriaLabel\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronLeftIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"previousIconTemplate\"></ng-template>\n        </button>\n        <div class=\"cax-segment-tabview-header\" style=\"position: relative\">\n            <div #content class=\"cax-tabview-nav-content\" (scroll)=\"onScroll($event)\" [attr.data-pc-section]=\"'navcontent'\" [style.overflow-x]=\"segmentOverflow ? 'hidden' : ''\">\n                <ul #navbar class=\"cax-segment-tabview-nav\" role=\"tablist\" [attr.data-pc-section]=\"'nav'\">\n                    <ng-template ngFor let-tab [ngForOf]=\"tabs\" let-i=\"index\">\n                        <li\n                            role=\"presentation\"\n                            [ngClass]=\"{ 'cax-highlight': tab.selected, 'cax-disabled': tab.disabled, 'pinned': tab.pinned, 'cax-segment-last-visible': tab.segmentLastVisible }\"\n                            [style.visibility]=\"tab.segmentHidden ? 'hidden' : 'visible'\"\n                            [style.pointer-events]=\"tab.segmentHidden ? 'none' : 'auto'\"\n                            [attr.data-cax-disabled]=\"tab.disabled\"\n                            [ngStyle]=\"tab.headerStyle\"\n                            [class]=\"tab.headerStyleClass\"\n                            *ngIf=\"!tab.closed\"\n                        >\n                            <a\n                                role=\"tab\"\n                                class=\"cax-segment-tabview-nav-link\"\n                                [caxTooltip]=\"tab.tooltip\"\n                                [tooltipPosition]=\"tab.tooltipPosition\"\n                                [positionStyle]=\"tab.tooltipPositionStyle\"\n                                [tooltipStyleClass]=\"tab.tooltipStyleClass\"\n                                [attr.id]=\"getTabHeaderActionId(tab.id)\"\n                                [attr.aria-controls]=\"getTabContentId(tab.id)\"\n                                [attr.aria-selected]=\"tab.selected\"\n                                [attr.tabindex]=\"tab.disabled ? '-1' : tabindex\"\n                                [attr.aria-disabled]=\"tab.disabled\"\n                                [attr.data-pc-index]=\"i\"\n                                [attr.data-pc-section]=\"'headeraction'\"\n                                (click)=\"open($event, tab)\"\n                                (keydown)=\"onTabKeyDown($event, tab)\"\n                                caxRipple\n                            >\n                                <ng-container *ngIf=\"!tab.headerTemplate\">\n                                    <span class=\"cax-tabview-left-icon\" [ngClass]=\"tab.leftIcon\" *ngIf=\"tab.leftIcon && !tab.leftIconTemplate\"></span>\n                                    <span *ngIf=\"tab.leftIconTemplate\" class=\"cax-tabview-left-icon\">\n                                        <ng-template *ngTemplateOutlet=\"tab.leftIconTemplate\"></ng-template>\n                                    </span>\n                                    <span *ngIf=\"tab.icon\" class=\"cax-dynamic-icon\" [class]=\"tab.icon\"></span>\n                                    <span *ngIf=\"tab.header\" class=\"cax-tabview-title\" [class]=\"tab.selected ? `cax-text-action-${size}-semibold` : `cax-text-action-${size}-medium`\">{{ tab.header }}</span>\n                                    <span class=\"cax-tabview-right-icon\" [ngClass]=\"tab.rightIcon\" *ngIf=\"tab.rightIcon && !tab.rightIconTemplate\"></span>\n                                    <span *ngIf=\"tab.rightIconTemplate\" class=\"cax-tabview-right-icon\">\n                                        <ng-template *ngTemplateOutlet=\"tab.rightIconTemplate\"></ng-template>\n                                    </span>\n                                </ng-container>\n                                <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\n                                <ng-container *ngIf=\"tab.closable\">\n                                    <TimesIcon *ngIf=\"!tab.closeIconTemplate\" [styleClass]=\"'cax-segment-tabview-close'\" (click)=\"close($event, tab)\" />\n                                    <span class=\"cax-segment-tabview-close\" *ngIf=\"tab.closeIconTemplate\">\n                                        <ng-template *ngTemplateOutlet=\"tab.closeIconTemplate\"></ng-template>\n                                    </span>\n                                </ng-container>\n                            </a>\n                        </li>\n                    </ng-template>\n                </ul>\n            </div>\n            <div *ngIf=\"segmentOverflow\" class=\"cax-segment-more-tabs\">\n                <button\n                    type=\"button\"\n                    class=\"cax-segment-more-btn\"\n                    [class.cax-segment-more-btn-active]=\"op.overlayVisible\"\n                    [class]=\"op.overlayVisible ? `cax-text-action-${size}-semibold` : `cax-text-action-${size}-medium`\"\n                    caxRipple\n                    (click)=\"op.toggle($event)\"\n                >\n                    +{{hiddenTabsCount}} tabs\n                    <span class=\"cax cax-segment-more-icon\" [ngClass]=\"op.overlayVisible ? 'cax-alt-arrow-up' : 'cax-alt-arrow-down'\"></span>\n                </button>\n\n                <!-- Overlay panel for hidden segment tabs -->\n                <cax-overlayPanel #op appendTo=\"body\" [style]=\"{padding: '0'}\" styleClass=\"cax-segment-more-overlay-panel\">\n                    <ul class=\"cax-segment-more-list\">\n                        <li *ngFor=\"let tab of hiddenTabs\" class=\"cax-segment-more-item cax-link\" (click)=\"op.hide(); open($event, tab)\" caxRipple>\n                            <span class=\"cax-segment-more-item-content\">\n                                <span class=\"cax-tabview-left-icon\" [ngClass]=\"tab.leftIcon\" *ngIf=\"tab.leftIcon && !tab.leftIconTemplate\"></span>\n                                <span *ngIf=\"tab.icon\" class=\"cax-dynamic-icon\" [class]=\"tab.icon\"></span>\n                                <span class=\"cax-tabview-title cax-text-action-md-medium\">{{ tab.header }}</span>\n                                <span class=\"cax-tabview-right-icon\" [ngClass]=\"tab.rightIcon\" *ngIf=\"tab.rightIcon && !tab.rightIconTemplate\"></span>\n                            </span>\n                            <span *ngIf=\"tab.closable\" class=\"cax-segment-more-close\" (click)=\"close($event, tab); $event.stopPropagation()\">\n                                <TimesIcon *ngIf=\"!tab.closeIconTemplate\" />\n                                <ng-template *ngTemplateOutlet=\"tab.closeIconTemplate\"></ng-template>\n                            </span>\n                        </li>\n                    </ul>\n                </cax-overlayPanel>\n            </div>\n        </div>\n        <button\n            *ngIf=\"scrollable && !forwardIsDisabled && buttonVisible && !segmentOverflow\"\n            #nextBtn\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"nextButtonAriaLabel\"\n            class=\"cax-tabview-nav-next cax-segment-tabview-nav-btn cax-link\"\n            (click)=\"navForward()\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronRightIcon *ngIf=\"!nextIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"nextIconTemplate\"></ng-template>\n        </button>\n    </div>\n    <div class=\"cax-tabview-panels\">\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: ["@layer cax{.cax-tabview-nav-container{position:relative;overflow-y:visible}.cax-tabview-nav-container.block-mode{display:block}.cax-tabview-nav-container.flex-mode{display:flex}.cax-tabview-action-buttons{display:flex;align-items:center;margin-left:auto}.cax-tabview-separator{width:2px;height:35px;display:inline-block;vertical-align:middle;margin-right:8px}.cax-tabview-scrollable .cax-tabview-nav-container{overflow:hidden;white-space:nowrap}.cax-tabview-nav-content{overflow-x:auto;overflow-y:visible;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior:contain auto;flex:1 1 auto;min-width:0}.cax-tabview-nav{display:inline-flex;position:relative;min-width:100%;height:100%;margin:0;padding:0;list-style-type:none;flex:1 1 auto}.cax-tabview-nav li.full-mode{display:flex;justify-content:center;align-items:center;flex:1!important}.cax-tabview-nav li.full-mode cax-tabview .cax-tabview-nav li .cax-tabview-nav-link{border:none}.cax-tabview-nav li.half-mode{display:flex;justify-content:center;align-items:center;flex:none!important}.cax-tabview-nav-link{cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center;position:relative;text-decoration:none;overflow:hidden}.cax-tabview-ink-bar{display:block;z-index:1}.cax-tabview-nav-link:focus{z-index:1}.cax-tabview-title{line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto;min-width:0}.cax-tabview-nav-btn{position:absolute;top:0;z-index:2;height:100%;display:flex;align-items:center;justify-content:center}.cax-tabview-nav-prev{left:0}.cax-tabview-nav-next{right:0}.cax-tabview-nav-content::-webkit-scrollbar{display:none}.cax-tabview-close{z-index:1}.cax-segment-tabview-container{flex-direction:row}.cax-segment-tabview-header{display:flex;align-items:center;height:100%}.cax-segment-tabview-nav{display:inline-flex;min-width:100%;margin:0;padding:0;list-style-type:none;flex:1 1 auto}.cax-segment-tabview-nav-link{cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center;position:relative;text-decoration:none;overflow:hidden}.cax-segment-tabview-nav-link{z-index:1}.cax-left-arrow,.cax-right-arrow{position:sticky;top:0;z-index:100;background:transparent;border:none;cursor:pointer;font-size:1.25rem}.cax-arrow-buttons{display:flex;align-items:center;gap:16px}.cax-left-arrow,.cax-right-arrow{position:sticky;left:0;z-index:100;transition:transform .2s ease}.cax-left-arrow{left:0;padding-left:var(--space-200)}.cax-right-arrow{right:0;padding-right:var(--space-200)}.cax-dynamic-icon{font-size:1.25rem;cursor:pointer}.cax-segment-tabview-nav-btn{position:absolute;top:0;z-index:2;height:100%;display:flex;align-items:center;justify-content:center}.cax-segment-tabview-nav li.pinned{position:sticky;left:var(--pinned-left, 0);z-index:10;background-color:var(--white-100)}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.Tooltip, selector: "[caxTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "caxTooltip", "tooltipDisabled", "tooltipOptions", "linkUrl", "linkText"] }, { kind: "directive", type: i3.Ripple, selector: "[caxRipple]" }, { kind: "component", type: i4.TimesIcon, selector: "TimesIcon" }, { kind: "component", type: i5.ChevronLeftIcon, selector: "ChevronLeftIcon" }, { kind: "component", type: i6.ChevronRightIcon, selector: "ChevronRightIcon" }, { kind: "component", type: i7.OverlayPanel, selector: "cax-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "variant", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabView, deps: [{ token: PLATFORM_ID }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.25", type: TabView, isStandalone: false, selector: "cax-tabView", inputs: { fullMode: "fullMode", size: "size", style: "style", styleClass: "styleClass", controlClose: ["controlClose", "controlClose", booleanAttribute], scrollable: ["scrollable", "scrollable", booleanAttribute], activeIndex: "activeIndex", selectOnFocus: ["selectOnFocus", "selectOnFocus", booleanAttribute], nextButtonAriaLabel: "nextButtonAriaLabel", prevButtonAriaLabel: "prevButtonAriaLabel", autoHideButtons: ["autoHideButtons", "autoHideButtons", booleanAttribute], tabindex: ["tabindex", "tabindex", numberAttribute], mode: "mode", pinnedIndexes: "pinnedIndexes" }, outputs: { onChange: "onChange", onClose: "onClose", activeIndexChange: "activeIndexChange" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "tabPanels", predicate: TabPanel }, { propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "navbar", first: true, predicate: ["navbar"], descendants: true }, { propertyName: "prevBtn", first: true, predicate: ["prevBtn"], descendants: true }, { propertyName: "nextBtn", first: true, predicate: ["nextBtn"], descendants: true }, { propertyName: "inkbar", first: true, predicate: ["inkbar"], descendants: true }, { propertyName: "elementToObserve", first: true, predicate: ["elementToObserve"], descendants: true }], ngImport: i0, template: "<div\n    [ngClass]=\"{ 'cax-tabview cax-component': true, 'cax-tabview-scrollable': scrollable, 'cax-tabview-sm': size === 'sm', 'cax-tabview-md': size === 'md', 'cax-tabview-lg': size === 'lg' }\"\n    [ngStyle]=\"style\"\n    [class]=\"styleClass\"\n    [attr.data-pc-name]=\"'tabview'\"\n>\n    <div #elementToObserve class=\"cax-tabview-nav-container\" *ngIf=\"mode == 'line'\" [ngClass]=\"fullMode ? 'block-mode' : 'flex-mode'\">\n        <button\n            *ngIf=\"scrollable && !backwardIsDisabled && buttonVisible\"\n            #prevBtn\n            class=\"cax-tabview-nav-prev cax-tabview-nav-btn cax-link\"\n            (click)=\"navBackward()\"\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"prevButtonAriaLabel\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronLeftIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"previousIconTemplate\"></ng-template>\n        </button>\n        <div #content class=\"cax-tabview-nav-content\" (scroll)=\"onScroll($event)\" [attr.data-pc-section]=\"'navcontent'\">\n            <ul #navbar class=\"cax-tabview-nav\" role=\"tablist\" [attr.data-pc-section]=\"'nav'\">\n                <ng-template ngFor let-tab [ngForOf]=\"tabs\" let-i=\"index\">\n                    <li\n                        role=\"presentation\"\n                        [ngClass]=\"{ 'cax-highlight': tab.selected, 'cax-disabled': tab.disabled }\"\n                        [attr.data-cax-disabled]=\"tab.disabled\"\n                        [ngStyle]=\"tab.headerStyle\"\n                        [class]=\"tab.headerStyleClass\"\n                        [class.full-mode]=\"fullMode\"\n                        [class.half-mode]=\"!fullMode\"\n                        *ngIf=\"!tab.closed\"\n                    >\n                        <a\n                            role=\"tab\"\n                            class=\"cax-tabview-nav-link\"\n                            [caxTooltip]=\"tab.tooltip\"\n                            [tooltipPosition]=\"tab.tooltipPosition\"\n                            [positionStyle]=\"tab.tooltipPositionStyle\"\n                            [tooltipStyleClass]=\"tab.tooltipStyleClass\"\n                            [attr.id]=\"getTabHeaderActionId(tab.id)\"\n                            [attr.aria-controls]=\"getTabContentId(tab.id)\"\n                            [attr.aria-selected]=\"tab.selected\"\n                            [attr.tabindex]=\"tab.disabled ? '-1' : tabindex\"\n                            [attr.aria-disabled]=\"tab.disabled\"\n                            [attr.data-pc-index]=\"i\"\n                            [attr.data-pc-section]=\"'headeraction'\"\n                            (click)=\"open($event, tab)\"\n                            (keydown)=\"onTabKeyDown($event, tab)\"\n                            caxRipple\n                        >\n                            <ng-container *ngIf=\"!tab.headerTemplate\">\n                                <span class=\"cax-tabview-left-icon\" [ngClass]=\"tab.leftIcon\" *ngIf=\"tab.leftIcon && !tab.leftIconTemplate\"></span>\n                                <span *ngIf=\"tab.leftIconTemplate\" class=\"cax-tabview-left-icon\">\n                                    <ng-template *ngTemplateOutlet=\"tab.leftIconTemplate\"></ng-template>\n                                </span>\n                                <span *ngIf=\"tab.icon\" class=\"cax-dynamic-icon\" [class]=\"tab.icon\"></span>\n                                <span class=\"cax-tabview-title\" [class]=\"tab.selected ? `cax-text-action-${size}-semibold` : `cax-text-action-${size}-medium`\">{{ tab.header }}</span>\n                                <span class=\"cax-tabview-right-icon\" [ngClass]=\"tab.rightIcon\" *ngIf=\"tab.rightIcon && !tab.rightIconTemplate\"></span>\n                                <span *ngIf=\"tab.rightIconTemplate\" class=\"cax-tabview-right-icon\">\n                                    <ng-template *ngTemplateOutlet=\"tab.rightIconTemplate\"></ng-template>\n                                </span>\n                            </ng-container>\n                            <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\n                            <ng-container *ngIf=\"tab.closable\">\n                                <TimesIcon *ngIf=\"!tab.closeIconTemplate\" [styleClass]=\"'cax-tabview-close'\" (click)=\"close($event, tab)\" />\n                                <span class=\"cax-tabview-close\" *ngIf=\"tab.closeIconTemplate\">\n                                    <ng-template *ngTemplateOutlet=\"tab.closeIconTemplate\"></ng-template>\n                                </span>\n                            </ng-container>\n                        </a>\n                    </li>\n                </ng-template>\n                <li #inkbar class=\"cax-tabview-ink-bar\" role=\"presentation\" aria-hidden=\"true\" [attr.data-pc-section]=\"'inkbar'\"></li>\n            </ul>\n        </div>\n\n        <!-- Configurable Template -->\n        <div class=\"cax-tabview-action-buttons\" *ngIf=\"mode == 'line' && actionTemplate && !fullMode\">\n            <div class=\"cax-tabview-separator\"></div>\n            <ng-container *ngTemplateOutlet=\"actionTemplate\"></ng-container>\n        </div>\n\n        <button\n            *ngIf=\"scrollable && !forwardIsDisabled && buttonVisible\"\n            #nextBtn\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"nextButtonAriaLabel\"\n            class=\"cax-tabview-nav-next cax-tabview-nav-btn cax-link\"\n            (click)=\"navForward()\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronRightIcon *ngIf=\"!nextIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"nextIconTemplate\"></ng-template>\n        </button>\n    </div>\n    <div #elementToObserve class=\"cax-tabview-nav-container cax-segment-tabview-container\" *ngIf=\"mode == 'segment'\">\n        <button\n            *ngIf=\"scrollable && !backwardIsDisabled && buttonVisible && !segmentOverflow\"\n            #prevBtnSegment\n            class=\"cax-tabview-nav-prev cax-segment-tabview-nav-btn cax-link\"\n            (click)=\"navBackward()\"\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"prevButtonAriaLabel\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronLeftIcon *ngIf=\"!previousIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"previousIconTemplate\"></ng-template>\n        </button>\n        <div class=\"cax-segment-tabview-header\" style=\"position: relative\">\n            <div #content class=\"cax-tabview-nav-content\" (scroll)=\"onScroll($event)\" [attr.data-pc-section]=\"'navcontent'\" [style.overflow-x]=\"segmentOverflow ? 'hidden' : ''\">\n                <ul #navbar class=\"cax-segment-tabview-nav\" role=\"tablist\" [attr.data-pc-section]=\"'nav'\">\n                    <ng-template ngFor let-tab [ngForOf]=\"tabs\" let-i=\"index\">\n                        <li\n                            role=\"presentation\"\n                            [ngClass]=\"{ 'cax-highlight': tab.selected, 'cax-disabled': tab.disabled, 'pinned': tab.pinned, 'cax-segment-last-visible': tab.segmentLastVisible }\"\n                            [style.visibility]=\"tab.segmentHidden ? 'hidden' : 'visible'\"\n                            [style.pointer-events]=\"tab.segmentHidden ? 'none' : 'auto'\"\n                            [attr.data-cax-disabled]=\"tab.disabled\"\n                            [ngStyle]=\"tab.headerStyle\"\n                            [class]=\"tab.headerStyleClass\"\n                            *ngIf=\"!tab.closed\"\n                        >\n                            <a\n                                role=\"tab\"\n                                class=\"cax-segment-tabview-nav-link\"\n                                [caxTooltip]=\"tab.tooltip\"\n                                [tooltipPosition]=\"tab.tooltipPosition\"\n                                [positionStyle]=\"tab.tooltipPositionStyle\"\n                                [tooltipStyleClass]=\"tab.tooltipStyleClass\"\n                                [attr.id]=\"getTabHeaderActionId(tab.id)\"\n                                [attr.aria-controls]=\"getTabContentId(tab.id)\"\n                                [attr.aria-selected]=\"tab.selected\"\n                                [attr.tabindex]=\"tab.disabled ? '-1' : tabindex\"\n                                [attr.aria-disabled]=\"tab.disabled\"\n                                [attr.data-pc-index]=\"i\"\n                                [attr.data-pc-section]=\"'headeraction'\"\n                                (click)=\"open($event, tab)\"\n                                (keydown)=\"onTabKeyDown($event, tab)\"\n                                caxRipple\n                            >\n                                <ng-container *ngIf=\"!tab.headerTemplate\">\n                                    <span class=\"cax-tabview-left-icon\" [ngClass]=\"tab.leftIcon\" *ngIf=\"tab.leftIcon && !tab.leftIconTemplate\"></span>\n                                    <span *ngIf=\"tab.leftIconTemplate\" class=\"cax-tabview-left-icon\">\n                                        <ng-template *ngTemplateOutlet=\"tab.leftIconTemplate\"></ng-template>\n                                    </span>\n                                    <span *ngIf=\"tab.icon\" class=\"cax-dynamic-icon\" [class]=\"tab.icon\"></span>\n                                    <span *ngIf=\"tab.header\" class=\"cax-tabview-title\" [class]=\"tab.selected ? `cax-text-action-${size}-semibold` : `cax-text-action-${size}-medium`\">{{ tab.header }}</span>\n                                    <span class=\"cax-tabview-right-icon\" [ngClass]=\"tab.rightIcon\" *ngIf=\"tab.rightIcon && !tab.rightIconTemplate\"></span>\n                                    <span *ngIf=\"tab.rightIconTemplate\" class=\"cax-tabview-right-icon\">\n                                        <ng-template *ngTemplateOutlet=\"tab.rightIconTemplate\"></ng-template>\n                                    </span>\n                                </ng-container>\n                                <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\n                                <ng-container *ngIf=\"tab.closable\">\n                                    <TimesIcon *ngIf=\"!tab.closeIconTemplate\" [styleClass]=\"'cax-segment-tabview-close'\" (click)=\"close($event, tab)\" />\n                                    <span class=\"cax-segment-tabview-close\" *ngIf=\"tab.closeIconTemplate\">\n                                        <ng-template *ngTemplateOutlet=\"tab.closeIconTemplate\"></ng-template>\n                                    </span>\n                                </ng-container>\n                            </a>\n                        </li>\n                    </ng-template>\n                </ul>\n            </div>\n            <div *ngIf=\"segmentOverflow\" class=\"cax-segment-more-tabs\">\n                <button\n                    type=\"button\"\n                    class=\"cax-segment-more-btn\"\n                    [class.cax-segment-more-btn-active]=\"op.overlayVisible\"\n                    [class]=\"op.overlayVisible ? `cax-text-action-${size}-semibold` : `cax-text-action-${size}-medium`\"\n                    caxRipple\n                    (click)=\"op.toggle($event)\"\n                >\n                    +{{hiddenTabsCount}} tabs\n                    <span class=\"cax cax-segment-more-icon\" [ngClass]=\"op.overlayVisible ? 'cax-alt-arrow-up' : 'cax-alt-arrow-down'\"></span>\n                </button>\n\n                <!-- Overlay panel for hidden segment tabs -->\n                <cax-overlayPanel #op appendTo=\"body\" [style]=\"{padding: '0'}\" styleClass=\"cax-segment-more-overlay-panel\">\n                    <ul class=\"cax-segment-more-list\">\n                        <li *ngFor=\"let tab of hiddenTabs\" class=\"cax-segment-more-item cax-link\" (click)=\"op.hide(); open($event, tab)\" caxRipple>\n                            <span class=\"cax-segment-more-item-content\">\n                                <span class=\"cax-tabview-left-icon\" [ngClass]=\"tab.leftIcon\" *ngIf=\"tab.leftIcon && !tab.leftIconTemplate\"></span>\n                                <span *ngIf=\"tab.icon\" class=\"cax-dynamic-icon\" [class]=\"tab.icon\"></span>\n                                <span class=\"cax-tabview-title cax-text-action-md-medium\">{{ tab.header }}</span>\n                                <span class=\"cax-tabview-right-icon\" [ngClass]=\"tab.rightIcon\" *ngIf=\"tab.rightIcon && !tab.rightIconTemplate\"></span>\n                            </span>\n                            <span *ngIf=\"tab.closable\" class=\"cax-segment-more-close\" (click)=\"close($event, tab); $event.stopPropagation()\">\n                                <TimesIcon *ngIf=\"!tab.closeIconTemplate\" />\n                                <ng-template *ngTemplateOutlet=\"tab.closeIconTemplate\"></ng-template>\n                            </span>\n                        </li>\n                    </ul>\n                </cax-overlayPanel>\n            </div>\n        </div>\n        <button\n            *ngIf=\"scrollable && !forwardIsDisabled && buttonVisible && !segmentOverflow\"\n            #nextBtn\n            [attr.tabindex]=\"tabindex\"\n            [attr.aria-label]=\"nextButtonAriaLabel\"\n            class=\"cax-tabview-nav-next cax-segment-tabview-nav-btn cax-link\"\n            (click)=\"navForward()\"\n            type=\"button\"\n            caxRipple\n        >\n            <ChevronRightIcon *ngIf=\"!nextIconTemplate\" [attr.aria-hidden]=\"true\" />\n            <ng-template *ngTemplateOutlet=\"nextIconTemplate\"></ng-template>\n        </button>\n    </div>\n    <div class=\"cax-tabview-panels\">\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: ["@layer cax{.cax-tabview-nav-container{position:relative;overflow-y:visible}.cax-tabview-nav-container.block-mode{display:block}.cax-tabview-nav-container.flex-mode{display:flex}.cax-tabview-action-buttons{display:flex;align-items:center;margin-left:auto}.cax-tabview-separator{width:2px;height:35px;display:inline-block;vertical-align:middle;margin-right:8px}.cax-tabview-scrollable .cax-tabview-nav-container{overflow:hidden;white-space:nowrap}.cax-tabview-nav-content{overflow-x:auto;overflow-y:visible;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior:contain auto;flex:1 1 auto;min-width:0}.cax-tabview-nav{display:inline-flex;position:relative;min-width:100%;height:100%;margin:0;padding:0;list-style-type:none;flex:1 1 auto}.cax-tabview-nav li.full-mode{display:flex;justify-content:center;align-items:center;flex:1!important}.cax-tabview-nav li.full-mode cax-tabview .cax-tabview-nav li .cax-tabview-nav-link{border:none}.cax-tabview-nav li.half-mode{display:flex;justify-content:center;align-items:center;flex:none!important}.cax-tabview-nav-link{cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center;position:relative;text-decoration:none;overflow:hidden}.cax-tabview-ink-bar{display:block;z-index:1}.cax-tabview-nav-link:focus{z-index:1}.cax-tabview-title{line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto;min-width:0}.cax-tabview-nav-btn{position:absolute;top:0;z-index:2;height:100%;display:flex;align-items:center;justify-content:center}.cax-tabview-nav-prev{left:0}.cax-tabview-nav-next{right:0}.cax-tabview-nav-content::-webkit-scrollbar{display:none}.cax-tabview-close{z-index:1}.cax-segment-tabview-container{flex-direction:row}.cax-segment-tabview-header{display:flex;align-items:center;height:100%}.cax-segment-tabview-nav{display:inline-flex;min-width:100%;margin:0;padding:0;list-style-type:none;flex:1 1 auto}.cax-segment-tabview-nav-link{cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center;position:relative;text-decoration:none;overflow:hidden}.cax-segment-tabview-nav-link{z-index:1}.cax-left-arrow,.cax-right-arrow{position:sticky;top:0;z-index:100;background:transparent;border:none;cursor:pointer;font-size:1.25rem}.cax-arrow-buttons{display:flex;align-items:center;gap:16px}.cax-left-arrow,.cax-right-arrow{position:sticky;left:0;z-index:100;transition:transform .2s ease}.cax-left-arrow{left:0;padding-left:var(--space-200)}.cax-right-arrow{right:0;padding-right:var(--space-200)}.cax-dynamic-icon{font-size:1.25rem;cursor:pointer}.cax-segment-tabview-nav-btn{position:absolute;top:0;z-index:2;height:100%;display:flex;align-items:center;justify-content:center}.cax-segment-tabview-nav li.pinned{position:sticky;left:var(--pinned-left, 0);z-index:10;background-color:var(--white-100)}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.Tooltip, selector: "[caxTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "caxTooltip", "tooltipDisabled", "tooltipOptions", "linkUrl", "linkText"] }, { kind: "directive", type: i3.Ripple, selector: "[caxRipple]" }, { kind: "component", type: i4.TimesIcon, selector: "TimesIcon" }, { kind: "component", type: i5.ChevronLeftIcon, selector: "ChevronLeftIcon" }, { kind: "component", type: i6.ChevronRightIcon, selector: "ChevronRightIcon" }, { kind: "component", type: i7.OverlayPanel, selector: "cax-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "variant", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabView, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabView, decorators: [{
             type: Component,
             args: [{ selector: 'cax-tabView', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: false, host: {
                         class: 'cax-element'
@@ -992,11 +992,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
             }] } });
 
 class TabViewModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: TabViewModule, declarations: [TabView, TabPanel], imports: [CommonModule, SharedModule, TooltipModule, RippleModule, TimesIcon, ChevronLeftIcon, ChevronRightIcon, ButtonModule, OverlayPanel], exports: [TabView, TabPanel, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabViewModule, imports: [CommonModule, SharedModule, TooltipModule, RippleModule, TimesIcon, ChevronLeftIcon, ChevronRightIcon, ButtonModule, OverlayPanel, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: TabViewModule, declarations: [TabView, TabPanel], imports: [CommonModule, SharedModule, TooltipModule, RippleModule, TimesIcon, ChevronLeftIcon, ChevronRightIcon, ButtonModule, OverlayPanel], exports: [TabView, TabPanel, SharedModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabViewModule, imports: [CommonModule, SharedModule, TooltipModule, RippleModule, TimesIcon, ChevronLeftIcon, ChevronRightIcon, ButtonModule, OverlayPanel, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TabViewModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TabViewModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, SharedModule, TooltipModule, RippleModule, TimesIcon, ChevronLeftIcon, ChevronRightIcon, ButtonModule, OverlayPanel],