import { ISlottable } from '../../../Behaviors/Slottable'; import { Orientation } from '../../../Types/Orientation'; import { TabStripPlacement } from '../../../Types/TabStripPlacement'; import { CustomElement } from '../../Abstracts/CustomElement'; import { ITabStripElementProps } from './ITabStripElementProps'; import { TabStripItemElement } from './TabStripItemElement'; declare const TabStripElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Slottable").ISlottableProps & ISlottable) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * TabStrip - A navigation container for organizing and switching between related content panels. * * Provides tab-based navigation with keyboard support, visual indicators, and flexible placement options. * Manages tab selection states and coordinates with tab panel content. Essential for organizing * complex interfaces with multiple related views or data sets. * * @name TabStripElement * @element mosaik-tab-strip * @category Selectors * * @csspart tab-strip - The main tab strip container * @csspart tab-list - Container for the tab buttons * @csspart indicator - Active tab indicator element * @csspart overflow - Overflow controls for scrollable tabs * * @cssprop {Color} --tab-strip-background-color - Background color of the tab strip * @cssprop {Color} --tab-strip-border-color - Border color for tab strip edges * @cssprop {String} --tab-strip-gap - Spacing between individual tabs * @cssprop {String} --tab-strip-padding - Internal padding of the tab strip * @cssprop {Color} --tab-indicator-color - Color of the active tab indicator * @cssprop {String} --tab-indicator-height - Height of the tab indicator bar * @cssprop {Color} --tab-selected-background - Background color of selected tabs * @cssprop {Color} --tab-hover-background - Background color on tab hover * * @dependency InkBarElement - Provides the active tab indicator animation * * @example * Basic horizontal tab strip: * ```html * * Overview * Details * Settings * * ``` * * @example * Tab strip with indicator and disabled item: * ```html * * Dashboard * Analytics * Admin * * ``` * * @example * Vertical tab strip: * ```html * * Home * Profile * Settings * * ``` * * @public */ export declare class TabStripElement extends TabStripElement_base implements ITabStripElementProps, ISlottable { private readonly _provider; private readonly _resizeController; private readonly _keyboardController; private _indicatorElement; private _placement; private _hasIndicator; /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the `placement` property. * * @public * @attr */ get placement(): TabStripPlacement; set placement(value: TabStripPlacement); /** * Gets or sets the `hasIndicator` property. * * @public * @attr */ get hasIndicator(): boolean; set hasIndicator(value: boolean); /** * Returns the items of the tab strip. * * @public * @readonly */ get items(): Array; /** * Returns the selected tab item. * * @public * @readonly */ get selectedItem(): TabStripItemElement | null; /** * Returns the selected index. * * @public * @readonly */ get selectedIndex(): number; /** * Selects the specified tab item. * * @public * @param tabStripItem - The tab item to select. */ select(tabStripItem: TabStripItemElement): void; /** * Selects the specified tab item by its index. * * @public * @param index - The index of the tab item to select. */ selectByIndex(index: number): void; /** * Selects the specified tab item by its value. * * @public * @param value - The value of the tab item to select. */ selectByValue(value: unknown): void; /** * @public * @override */ onSlotChanges(slotName?: string): void; /** * @protected * @override */ protected onApplyTemplate(): void; /** * @protected */ protected onClick(event: Event): void; /** * @protected */ protected onTabStripItemSelectionChanged(event: CustomEvent): void; /** * @protected */ protected onDisabledPropertyChange(): void; /** * @protected */ protected onVariantPropertyChange(): void; /** * @protected */ protected onDirPropertyChange(): void; /** * @protected */ protected onOrientationPropertyChanged(_prev?: Orientation, next?: Orientation): void; /** * @protected */ protected onHasIndicatorPropertyChanged(_prev?: boolean, next?: boolean): void; /** * @private */ private alignIndicatorTo; /** * @private */ private getCurrent; } /** * @public */ export declare namespace TabStripElement { type Props = ITabStripElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-tab-strip': TabStripElement; } } export {}; //# sourceMappingURL=TabStripElement.d.ts.map