@tailng-ui/primitives 0.11.0 → 0.13.0

package/src/lib/navigation/tabs/tng-tabs.js

@@ -1,6 +1,6 @@
-import { __decorate } from "tslib";
 import { Directive, ElementRef, HostBinding, HostListener, inject, input, output, } from '@angular/core';
 import { createTngIdFactory } from '@tailng-ui/cdk';
+import * as i0 from "@angular/core";
 const createTabId = createTngIdFactory('tng-tab');
 const createPanelId = createTngIdFactory('tng-tab-panel');
 let nextRegistrationOrder = 0;
@@ -92,7 +92,7 @@ function isFocusableInteractiveElement(element) {
         element.matches('[tabindex]') ||
         element.matches('[contenteditable="true"]'));
 }
-let TngTabs = class TngTabs {
+export class TngTabs {
     hostRef = inject(ElementRef);
     tabs = new Set();
     panels = new Set();
@@ -103,36 +103,16 @@ let TngTabs = class TngTabs {
     focusedValue = null;
     hasUserSelection = false;
     initialized = false;
-    value = input(undefined, {
-        transform: normalizeOptionalValueInput,
-    });
-    defaultValue = input(undefined, {
-        transform: normalizeOptionalValueInput,
-    });
-    activation = input('auto', {
-        transform: normalizeActivationInput,
-    });
-    orientation = input('horizontal', {
-        transform: normalizeOrientationInput,
-    });
-    scrollButtons = input('off', {
-        transform: normalizeScrollButtonsInput,
-    });
-    loop = input(true, {
-        transform: normalizeBooleanInput,
-    });
-    dir = input('auto', {
-        transform: normalizeDirectionInput,
-    });
-    disabled = input(false, {
-        transform: normalizeBooleanInput,
-    });
-    lazy = input(undefined, {
-        transform: normalizeOptionalBooleanInput,
-    });
-    keepAlive = input(undefined, {
-        transform: normalizeOptionalBooleanInput,
-    });
+    value = input(undefined, { ...(ngDevMode ? { debugName: "value" } : {}), transform: normalizeOptionalValueInput });
+    defaultValue = input(undefined, { ...(ngDevMode ? { debugName: "defaultValue" } : {}), transform: normalizeOptionalValueInput });
+    activation = input('auto', { ...(ngDevMode ? { debugName: "activation" } : {}), transform: normalizeActivationInput });
+    orientation = input('horizontal', { ...(ngDevMode ? { debugName: "orientation" } : {}), transform: normalizeOrientationInput });
+    scrollButtons = input('off', { ...(ngDevMode ? { debugName: "scrollButtons" } : {}), transform: normalizeScrollButtonsInput });
+    loop = input(true, { ...(ngDevMode ? { debugName: "loop" } : {}), transform: normalizeBooleanInput });
+    dir = input('auto', { ...(ngDevMode ? { debugName: "dir" } : {}), transform: normalizeDirectionInput });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: normalizeBooleanInput });
+    lazy = input(undefined, { ...(ngDevMode ? { debugName: "lazy" } : {}), transform: normalizeOptionalBooleanInput });
+    keepAlive = input(undefined, { ...(ngDevMode ? { debugName: "keepAlive" } : {}), transform: normalizeOptionalBooleanInput });
     valueChange = output();
     tabChange = output();
     focusChange = output();
@@ -766,38 +746,36 @@ let TngTabs = class TngTabs {
             inline: 'nearest',
         });
     }
-};
-__decorate([
-    HostBinding('attr.data-slot')
-], TngTabs.prototype, "dataSlot", void 0);
-__decorate([
-    HostBinding('attr.data-orientation')
-], TngTabs.prototype, "dataOrientation", null);
-__decorate([
-    HostBinding('attr.data-activation')
-], TngTabs.prototype, "dataActivation", null);
-__decorate([
-    HostBinding('attr.data-disabled')
-], TngTabs.prototype, "dataDisabled", null);
-TngTabs = __decorate([
-    Directive({
-        selector: '[tngTabs]',
-        exportAs: 'tngTabs',
-        standalone: true,
-    })
-], TngTabs);
-export { TngTabs };
-let TngTabList = class TngTabList {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabs, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: TngTabs, isStandalone: true, selector: "[tngTabs]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, defaultValue: { classPropertyName: "defaultValue", publicName: "defaultValue", isSignal: true, isRequired: false, transformFunction: null }, activation: { classPropertyName: "activation", publicName: "activation", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, scrollButtons: { classPropertyName: "scrollButtons", publicName: "scrollButtons", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null }, dir: { classPropertyName: "dir", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, keepAlive: { classPropertyName: "keepAlive", publicName: "keepAlive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", tabChange: "tabChange", focusChange: "focusChange" }, host: { properties: { "attr.data-slot": "this.dataSlot", "attr.data-orientation": "this.dataOrientation", "attr.data-activation": "this.dataActivation", "attr.data-disabled": "this.dataDisabled" } }, exportAs: ["tngTabs"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabs, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tngTabs]',
+                    exportAs: 'tngTabs',
+                    standalone: true,
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], defaultValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultValue", required: false }] }], activation: [{ type: i0.Input, args: [{ isSignal: true, alias: "activation", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], scrollButtons: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollButtons", required: false }] }], loop: [{ type: i0.Input, args: [{ isSignal: true, alias: "loop", required: false }] }], dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], keepAlive: [{ type: i0.Input, args: [{ isSignal: true, alias: "keepAlive", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], tabChange: [{ type: i0.Output, args: ["tabChange"] }], focusChange: [{ type: i0.Output, args: ["focusChange"] }], dataSlot: [{
+                type: HostBinding,
+                args: ['attr.data-slot']
+            }], dataOrientation: [{
+                type: HostBinding,
+                args: ['attr.data-orientation']
+            }], dataActivation: [{
+                type: HostBinding,
+                args: ['attr.data-activation']
+            }], dataDisabled: [{
+                type: HostBinding,
+                args: ['attr.data-disabled']
+            }] } });
+export class TngTabList {
     hostRef = inject(ElementRef);
     tabs = inject(TngTabs, { host: true });
-    ariaLabel = input(undefined, {
-        alias: 'ariaLabel',
-        transform: normalizeOptionalStringInput,
-    });
-    ariaLabelledby = input(undefined, {
-        alias: 'ariaLabelledby',
-        transform: normalizeOptionalStringInput,
-    });
+    ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : {}), alias: 'ariaLabel',
+        transform: normalizeOptionalStringInput });
+    ariaLabelledby = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabelledby" } : {}), alias: 'ariaLabelledby',
+        transform: normalizeOptionalStringInput });
     dataSlot = 'tab-list';
     role = 'tablist';
     tabIndex = '-1';
@@ -828,43 +806,45 @@ let TngTabList = class TngTabList {
     getHostElement() {
         return this.hostRef.nativeElement;
     }
-};
-__decorate([
-    HostBinding('attr.data-slot')
-], TngTabList.prototype, "dataSlot", void 0);
-__decorate([
-    HostBinding('attr.role')
-], TngTabList.prototype, "role", void 0);
-__decorate([
-    HostBinding('attr.tabindex')
-], TngTabList.prototype, "tabIndex", void 0);
-__decorate([
-    HostBinding('attr.aria-orientation')
-], TngTabList.prototype, "ariaOrientation", null);
-__decorate([
-    HostBinding('attr.aria-label')
-], TngTabList.prototype, "hostAriaLabel", null);
-__decorate([
-    HostBinding('attr.aria-labelledby')
-], TngTabList.prototype, "hostAriaLabelledby", null);
-__decorate([
-    HostListener('wheel', ['$event'])
-], TngTabList.prototype, "onWheel", null);
-__decorate([
-    HostListener('scroll')
-], TngTabList.prototype, "onScroll", null);
-__decorate([
-    HostListener('focus')
-], TngTabList.prototype, "onFocus", null);
-TngTabList = __decorate([
-    Directive({
-        selector: '[tngTabList]',
-        exportAs: 'tngTabList',
-        standalone: true,
-    })
-], TngTabList);
-export { TngTabList };
-let TngTabsScrollButtonPrev = class TngTabsScrollButtonPrev {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabList, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: TngTabList, isStandalone: true, selector: "[tngTabList]", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "wheel": "onWheel($event)", "scroll": "onScroll()", "focus": "onFocus()" }, properties: { "attr.data-slot": "this.dataSlot", "attr.role": "this.role", "attr.tabindex": "this.tabIndex", "attr.aria-orientation": "this.ariaOrientation", "attr.aria-label": "this.hostAriaLabel", "attr.aria-labelledby": "this.hostAriaLabelledby" } }, exportAs: ["tngTabList"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabList, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tngTabList]',
+                    exportAs: 'tngTabList',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], dataSlot: [{
+                type: HostBinding,
+                args: ['attr.data-slot']
+            }], role: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], tabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
+            }], ariaOrientation: [{
+                type: HostBinding,
+                args: ['attr.aria-orientation']
+            }], hostAriaLabel: [{
+                type: HostBinding,
+                args: ['attr.aria-label']
+            }], hostAriaLabelledby: [{
+                type: HostBinding,
+                args: ['attr.aria-labelledby']
+            }], onWheel: [{
+                type: HostListener,
+                args: ['wheel', ['$event']]
+            }], onScroll: [{
+                type: HostListener,
+                args: ['scroll']
+            }], onFocus: [{
+                type: HostListener,
+                args: ['focus']
+            }] } });
+export class TngTabsScrollButtonPrev {
     tabs = inject(TngTabs, { host: true });
     dataSlot = 'tabs-scroll-button-prev';
     get hidden() {
@@ -888,34 +868,36 @@ let TngTabsScrollButtonPrev = class TngTabsScrollButtonPrev {
     onClick(event) {
         this.tabs.onScrollButtonClick('prev', event);
     }
-};
-__decorate([
-    HostBinding('attr.data-slot')
-], TngTabsScrollButtonPrev.prototype, "dataSlot", void 0);
-__decorate([
-    HostBinding('attr.hidden')
-], TngTabsScrollButtonPrev.prototype, "hidden", null);
-__decorate([
-    HostBinding('attr.disabled')
-], TngTabsScrollButtonPrev.prototype, "disabled", null);
-__decorate([
-    HostBinding('attr.aria-disabled')
-], TngTabsScrollButtonPrev.prototype, "ariaDisabled", null);
-__decorate([
-    HostBinding('attr.data-disabled')
-], TngTabsScrollButtonPrev.prototype, "dataDisabled", null);
-__decorate([
-    HostListener('click', ['$event'])
-], TngTabsScrollButtonPrev.prototype, "onClick", null);
-TngTabsScrollButtonPrev = __decorate([
-    Directive({
-        selector: '[tngTabsScrollButtonPrev]',
-        exportAs: 'tngTabsScrollButtonPrev',
-        standalone: true,
-    })
-], TngTabsScrollButtonPrev);
-export { TngTabsScrollButtonPrev };
-let TngTabsScrollButtonNext = class TngTabsScrollButtonNext {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabsScrollButtonPrev, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: TngTabsScrollButtonPrev, isStandalone: true, selector: "[tngTabsScrollButtonPrev]", host: { listeners: { "click": "onClick($event)" }, properties: { "attr.data-slot": "this.dataSlot", "attr.hidden": "this.hidden", "attr.disabled": "this.disabled", "attr.aria-disabled": "this.ariaDisabled", "attr.data-disabled": "this.dataDisabled" } }, exportAs: ["tngTabsScrollButtonPrev"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabsScrollButtonPrev, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tngTabsScrollButtonPrev]',
+                    exportAs: 'tngTabsScrollButtonPrev',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [], propDecorators: { dataSlot: [{
+                type: HostBinding,
+                args: ['attr.data-slot']
+            }], hidden: [{
+                type: HostBinding,
+                args: ['attr.hidden']
+            }], disabled: [{
+                type: HostBinding,
+                args: ['attr.disabled']
+            }], ariaDisabled: [{
+                type: HostBinding,
+                args: ['attr.aria-disabled']
+            }], dataDisabled: [{
+                type: HostBinding,
+                args: ['attr.data-disabled']
+            }], onClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });
+export class TngTabsScrollButtonNext {
     tabs = inject(TngTabs, { host: true });
     dataSlot = 'tabs-scroll-button-next';
     get hidden() {
@@ -939,52 +921,48 @@ let TngTabsScrollButtonNext = class TngTabsScrollButtonNext {
     onClick(event) {
         this.tabs.onScrollButtonClick('next', event);
     }
-};
-__decorate([
-    HostBinding('attr.data-slot')
-], TngTabsScrollButtonNext.prototype, "dataSlot", void 0);
-__decorate([
-    HostBinding('attr.hidden')
-], TngTabsScrollButtonNext.prototype, "hidden", null);
-__decorate([
-    HostBinding('attr.disabled')
-], TngTabsScrollButtonNext.prototype, "disabled", null);
-__decorate([
-    HostBinding('attr.aria-disabled')
-], TngTabsScrollButtonNext.prototype, "ariaDisabled", null);
-__decorate([
-    HostBinding('attr.data-disabled')
-], TngTabsScrollButtonNext.prototype, "dataDisabled", null);
-__decorate([
-    HostListener('click', ['$event'])
-], TngTabsScrollButtonNext.prototype, "onClick", null);
-TngTabsScrollButtonNext = __decorate([
-    Directive({
-        selector: '[tngTabsScrollButtonNext]',
-        exportAs: 'tngTabsScrollButtonNext',
-        standalone: true,
-    })
-], TngTabsScrollButtonNext);
-export { TngTabsScrollButtonNext };
-let TngTab = class TngTab {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabsScrollButtonNext, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: TngTabsScrollButtonNext, isStandalone: true, selector: "[tngTabsScrollButtonNext]", host: { listeners: { "click": "onClick($event)" }, properties: { "attr.data-slot": "this.dataSlot", "attr.hidden": "this.hidden", "attr.disabled": "this.disabled", "attr.aria-disabled": "this.ariaDisabled", "attr.data-disabled": "this.dataDisabled" } }, exportAs: ["tngTabsScrollButtonNext"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabsScrollButtonNext, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tngTabsScrollButtonNext]',
+                    exportAs: 'tngTabsScrollButtonNext',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [], propDecorators: { dataSlot: [{
+                type: HostBinding,
+                args: ['attr.data-slot']
+            }], hidden: [{
+                type: HostBinding,
+                args: ['attr.hidden']
+            }], disabled: [{
+                type: HostBinding,
+                args: ['attr.disabled']
+            }], ariaDisabled: [{
+                type: HostBinding,
+                args: ['attr.aria-disabled']
+            }], dataDisabled: [{
+                type: HostBinding,
+                args: ['attr.data-disabled']
+            }], onClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });
+export class TngTab {
     hostRef = inject(ElementRef);
     tabs = inject(TngTabs, { host: true });
     resolvedId = createTabId();
     registrationOrder = nextRegistrationOrder++;
     lastKnownValue = null;
     lastKnownDisabled = false;
-    valueInput = input(undefined, {
-        alias: 'value',
-        transform: normalizeOptionalValueInput,
-    });
-    disabledInput = input(false, {
-        alias: 'disabled',
-        transform: normalizeBooleanInput,
-    });
-    panelId = input(undefined, {
-        alias: 'panelId',
-        transform: normalizeOptionalStringInput,
-    });
+    valueInput = input(undefined, { ...(ngDevMode ? { debugName: "valueInput" } : {}), alias: 'value',
+        transform: normalizeOptionalValueInput });
+    disabledInput = input(false, { ...(ngDevMode ? { debugName: "disabledInput" } : {}), alias: 'disabled',
+        transform: normalizeBooleanInput });
+    panelId = input(undefined, { ...(ngDevMode ? { debugName: "panelId" } : {}), alias: 'panelId',
+        transform: normalizeOptionalStringInput });
     dataSlot = 'tab';
     role = 'tab';
     get id() {
@@ -1100,58 +1078,60 @@ let TngTab = class TngTab {
         this.resolvedId = hostId;
         return true;
     }
-};
-__decorate([
-    HostBinding('attr.data-slot')
-], TngTab.prototype, "dataSlot", void 0);
-__decorate([
-    HostBinding('attr.role')
-], TngTab.prototype, "role", void 0);
-__decorate([
-    HostBinding('attr.id')
-], TngTab.prototype, "id", null);
-__decorate([
-    HostBinding('attr.tabindex')
-], TngTab.prototype, "tabIndex", null);
-__decorate([
-    HostBinding('attr.aria-selected')
-], TngTab.prototype, "ariaSelected", null);
-__decorate([
-    HostBinding('attr.aria-controls')
-], TngTab.prototype, "ariaControls", null);
-__decorate([
-    HostBinding('attr.aria-disabled')
-], TngTab.prototype, "ariaDisabled", null);
-__decorate([
-    HostBinding('attr.disabled')
-], TngTab.prototype, "hostDisabled", null);
-__decorate([
-    HostBinding('attr.data-selected')
-], TngTab.prototype, "dataSelected", null);
-__decorate([
-    HostBinding('attr.data-focused')
-], TngTab.prototype, "dataFocused", null);
-__decorate([
-    HostBinding('attr.data-disabled')
-], TngTab.prototype, "dataDisabled", null);
-__decorate([
-    HostListener('click', ['$event'])
-], TngTab.prototype, "onClick", null);
-__decorate([
-    HostListener('focus')
-], TngTab.prototype, "onFocus", null);
-__decorate([
-    HostListener('keydown', ['$event'])
-], TngTab.prototype, "onKeydown", null);
-TngTab = __decorate([
-    Directive({
-        selector: '[tngTab]',
-        exportAs: 'tngTab',
-        standalone: true,
-    })
-], TngTab);
-export { TngTab };
-let TngTabPanel = class TngTabPanel {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTab, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: TngTab, isStandalone: true, selector: "[tngTab]", inputs: { valueInput: { classPropertyName: "valueInput", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, panelId: { classPropertyName: "panelId", publicName: "panelId", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)", "focus": "onFocus()", "keydown": "onKeydown($event)" }, properties: { "attr.data-slot": "this.dataSlot", "attr.role": "this.role", "attr.id": "this.id", "attr.tabindex": "this.tabIndex", "attr.aria-selected": "this.ariaSelected", "attr.aria-controls": "this.ariaControls", "attr.aria-disabled": "this.ariaDisabled", "attr.disabled": "this.hostDisabled", "attr.data-selected": "this.dataSelected", "attr.data-focused": "this.dataFocused", "attr.data-disabled": "this.dataDisabled" } }, exportAs: ["tngTab"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTab, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tngTab]',
+                    exportAs: 'tngTab',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [], propDecorators: { valueInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], panelId: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelId", required: false }] }], dataSlot: [{
+                type: HostBinding,
+                args: ['attr.data-slot']
+            }], role: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], id: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }], tabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
+            }], ariaSelected: [{
+                type: HostBinding,
+                args: ['attr.aria-selected']
+            }], ariaControls: [{
+                type: HostBinding,
+                args: ['attr.aria-controls']
+            }], ariaDisabled: [{
+                type: HostBinding,
+                args: ['attr.aria-disabled']
+            }], hostDisabled: [{
+                type: HostBinding,
+                args: ['attr.disabled']
+            }], dataSelected: [{
+                type: HostBinding,
+                args: ['attr.data-selected']
+            }], dataFocused: [{
+                type: HostBinding,
+                args: ['attr.data-focused']
+            }], dataDisabled: [{
+                type: HostBinding,
+                args: ['attr.data-disabled']
+            }], onClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }], onFocus: [{
+                type: HostListener,
+                args: ['focus']
+            }], onKeydown: [{
+                type: HostListener,
+                args: ['keydown', ['$event']]
+            }] } });
+export class TngTabPanel {
     hostRef = inject(ElementRef);
     tabs = inject(TngTabs, { host: true });
     resolvedId = createPanelId();
@@ -1160,18 +1140,12 @@ let TngTabPanel = class TngTabPanel {
     activated = false;
     anchor = null;
     lastKnownValue = null;
-    valueInput = input(undefined, {
-        alias: 'value',
-        transform: normalizeOptionalValueInput,
-    });
-    labelledById = input(undefined, {
-        alias: 'labelledById',
-        transform: normalizeOptionalStringInput,
-    });
-    unmountOnExit = input(false, {
-        alias: 'unmountOnExit',
-        transform: normalizeBooleanInput,
-    });
+    valueInput = input(undefined, { ...(ngDevMode ? { debugName: "valueInput" } : {}), alias: 'value',
+        transform: normalizeOptionalValueInput });
+    labelledById = input(undefined, { ...(ngDevMode ? { debugName: "labelledById" } : {}), alias: 'labelledById',
+        transform: normalizeOptionalStringInput });
+    unmountOnExit = input(false, { ...(ngDevMode ? { debugName: "unmountOnExit" } : {}), alias: 'unmountOnExit',
+        transform: normalizeBooleanInput });
     dataSlot = 'tab-panel';
     role = 'tabpanel';
     get id() {
@@ -1320,31 +1294,33 @@ let TngTabPanel = class TngTabPanel {
         this.resolvedId = hostId;
         return true;
     }
-};
-__decorate([
-    HostBinding('attr.data-slot')
-], TngTabPanel.prototype, "dataSlot", void 0);
-__decorate([
-    HostBinding('attr.role')
-], TngTabPanel.prototype, "role", void 0);
-__decorate([
-    HostBinding('attr.id')
-], TngTabPanel.prototype, "id", null);
-__decorate([
-    HostBinding('attr.aria-labelledby')
-], TngTabPanel.prototype, "ariaLabelledby", null);
-__decorate([
-    HostBinding('attr.hidden')
-], TngTabPanel.prototype, "hidden", null);
-__decorate([
-    HostBinding('attr.data-active')
-], TngTabPanel.prototype, "dataActive", null);
-TngTabPanel = __decorate([
-    Directive({
-        selector: '[tngTabPanel]',
-        exportAs: 'tngTabPanel',
-        standalone: true,
-    })
-], TngTabPanel);
-export { TngTabPanel };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabPanel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: TngTabPanel, isStandalone: true, selector: "[tngTabPanel]", inputs: { valueInput: { classPropertyName: "valueInput", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, labelledById: { classPropertyName: "labelledById", publicName: "labelledById", isSignal: true, isRequired: false, transformFunction: null }, unmountOnExit: { classPropertyName: "unmountOnExit", publicName: "unmountOnExit", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-slot": "this.dataSlot", "attr.role": "this.role", "attr.id": "this.id", "attr.aria-labelledby": "this.ariaLabelledby", "attr.hidden": "this.hidden", "attr.data-active": "this.dataActive" } }, exportAs: ["tngTabPanel"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTabPanel, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tngTabPanel]',
+                    exportAs: 'tngTabPanel',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [], propDecorators: { valueInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], labelledById: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelledById", required: false }] }], unmountOnExit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unmountOnExit", required: false }] }], dataSlot: [{
+                type: HostBinding,
+                args: ['attr.data-slot']
+            }], role: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], id: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }], ariaLabelledby: [{
+                type: HostBinding,
+                args: ['attr.aria-labelledby']
+            }], hidden: [{
+                type: HostBinding,
+                args: ['attr.hidden']
+            }], dataActive: [{
+                type: HostBinding,
+                args: ['attr.data-active']
+            }] } });
 //# sourceMappingURL=tng-tabs.js.map