import { ISlottable } from '../../../Behaviors/Slottable';
import { TabPanelAlignment } from '../../../Types/TabPanelAlignment';
import { TabStripPlacement } from '../../../Types/TabStripPlacement';
import { CustomElement } from '../../Abstracts/CustomElement';
import type { ITabElementProps } from './ITabElementProps';
import { TabItemElement } from './TabItemElement';
declare const TabElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Slottable").ISlottableProps & ISlottable) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
/**
 * Tab - A navigation component for switching between different content panels within the same context.
 *
 * @description
 * The Tab component provides a tabbed interface for organizing and switching between multiple content
 * panels. It displays tab strip items as navigation headers and manages the visibility of associated
 * content panels. Tabs support multiple placements (top, bottom, left, right), customizable alignment,
 * visual indicators, and optional swipe gestures. The component is ideal for organizing related content
 * into separate views without navigating to different pages, commonly used in settings panels, product
 * details, dashboards, and multi-section forms.
 *
 * @name Tab
 * @element mosaik-tab
 * @category Selectors
 *
 * @slot - The default slot for tab items (mosaik-tab-item elements)
 * @slot end - Content displayed after the tab strip (e.g., action buttons)
 * @slot start - Content displayed before the tab strip (e.g., toolbar buttons)
 *
 * @csspart content - The main content area for active tab panel
 * @csspart header - The header container with tab strip
 * @csspart root - The root container element
 * @csspart tabPanel - The tab panel wrapper element
 * @csspart tabStrip - The tab strip container
 * @csspart tabStripItem - Individual tab strip item elements
 *
 * @cssprop {String} --tab-background-color - The background fill color
 * @cssprop {String} --tab-border-color - The border color
 * @cssprop {String} --tab-border-radius - The corner rounding radius
 * @cssprop {String} --tab-border-style - The border line style
 * @cssprop {String} --tab-border-width - The border thickness
 * @cssprop {String} --tab-divider-height - The height of divider lines
 * @cssprop {String} --tab-font-family - The font family for tab text
 * @cssprop {String} --tab-font-letter-spacing - The letter spacing for tab text
 * @cssprop {String} --tab-font-line-height - The line height for tab text
 * @cssprop {String} --tab-font-size - The font size for tab text
 * @cssprop {String} --tab-font-text-decoration - The text decoration style
 * @cssprop {String} --tab-font-text-transform - The text transformation style
 * @cssprop {String} --tab-font-weight - The font weight for tab text
 * @cssprop {String} --tab-foreground-color - The text and icon color
 * @cssprop {String} --tab-gap - The spacing between elements
 * @cssprop {String} --tab-indicator-height - The height of the selection indicator
 * @cssprop {String} --tab-padding-bottom - The bottom padding inside the tab container
 * @cssprop {String} --tab-padding-left - The left padding inside the tab container
 * @cssprop {String} --tab-padding-right - The right padding inside the tab container
 * @cssprop {String} --tab-padding-top - The top padding inside the tab container
 * @cssprop {String} --tab-panel-background-color - The background color of the panel
 * @cssprop {String} --tab-shadow - The shadow CSS custom property.
 * @cssprop {String} --tab-shadow-blur - The shadow blur CSS custom property.
 * @cssprop {String} --tab-shadow-color - The shadow color CSS custom property.
 * @cssprop {String} --tab-shadow-offset-x - The shadow offset x CSS custom property.
 * @cssprop {String} --tab-shadow-offset-y - The shadow offset y CSS custom property.
 * @cssprop {String} --tab-shadow-spread - The shadow spread CSS custom property.
 * @cssprop {String} --tab-strip-background-color - The background color of the strip
 * @cssprop {String} --tab-strip-padding-bottom - The bottom padding inside the strip
 * @cssprop {String} --tab-strip-padding-left - The left padding inside the strip
 * @cssprop {String} --tab-strip-padding-right - The right padding inside the strip
 * @cssprop {String} --tab-strip-padding-top - The top padding inside the strip
 * @cssprop {String} --tab-transition-duration - The duration of transitions
 * @cssprop {String} --tab-transition-mode - The timing function for transitions
 * @cssprop {String} --tab-transition-property - The CSS properties to transition
 * @cssprop {String} --tab-translate - The translate CSS custom property.
 *
 * @fires connected {ConnectedEvent} - Fired when connected to the DOM
 * @fires changed {PropertyChangedEvent} - Fired when properties change
 *
 * @dependency mosaik-tab-panel - The Tab Panel element.
 * @dependency mosaik-tab-strip - The Tab Strip element.
 * @dependency mosaik-tab-strip-item - The Tab Strip Item element.
 *
 * @example
 * Basic tabs with three panels:
 * ```html
 * <mosaik-tab>
 *   <mosaik-tab-item is-selected>
 *     <p>Overview content goes here.</p>
 *   </mosaik-tab-item>
 *   <mosaik-tab-item>
 *     <p>Details content goes here.</p>
 *   </mosaik-tab-item>
 *   <mosaik-tab-item>
 *     <p>Settings content goes here.</p>
 *   </mosaik-tab-item>
 * </mosaik-tab>
 * ```
 *
 * @example
 * Tabs with bottom placement and primary variant:
 * ```html
 * <mosaik-tab placement="bottom" variant="primary">
 *   <mosaik-tab-item is-selected>
 *     <p>Home content</p>
 *   </mosaik-tab-item>
 *   <mosaik-tab-item>
 *     <p>Search content</p>
 *   </mosaik-tab-item>
 *   <mosaik-tab-item>
 *     <p>Profile content</p>
 *   </mosaik-tab-item>
 * </mosaik-tab>
 * ```
 *
 * @example
 * Tabs with center alignment and gestures:
 * ```html
 * <mosaik-tab alignment="center" enable-gestures>
 *   <mosaik-tab-item>Content 1</mosaik-tab-item>
 *   <mosaik-tab-item>Content 2</mosaik-tab-item>
 *   <mosaik-tab-item>Content 3</mosaik-tab-item>
 * </mosaik-tab>
 * ```
 *
 * @public
 */
export declare class TabElement extends TabElement_base implements ITabElementProps, ISlottable {
    private readonly _provider;
    private _alignment;
    private _placement;
    private _hasIndicator;
    private _enableGestures;
    /**
     * @public
     */
    constructor();
    /**
     * Returns the `is` property.
     *
     * @public
     * @static
     * @readonly
    */
    static get is(): string;
    /**
     * Gets or sets the `alignment` property.
     *
     * @public
     * @attr
     */
    get alignment(): TabPanelAlignment;
    set alignment(value: TabPanelAlignment);
    /**
     * 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);
    /**
     * Gets or sets the `enableGestures` property.
     *
     * @public
     * @attr
     */
    get enableGestures(): boolean;
    set enableGestures(value: boolean);
    /**
     * Returns the items of the tab.
     *
     * @public
     * @readonly
     */
    get items(): Array<TabItemElement>;
    /**
     * Returns the selected tab item.
     *
     * @public
     * @readonly
     */
    get selectedItem(): TabItemElement | null;
    /**
     * Returns the selected index.
     *
     * @public
     * @readonly
     */
    get selectedIndex(): number;
    /**
     * Selects the specified tab item.
     *
     * @public
     * @param tabItem - The tab item to select.
     */
    select(tabItem: TabItemElement): 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;
    /**
     * @protected
     * @override
     */
    protected onApplyTemplate(): void;
    /**
     * @protected
     */
    protected onTabItemSelectionChanged(event: CustomEvent): void;
}
/**
 * @public
 */
export declare namespace TabElement {
    type Props = ITabElementProps;
}
/**
 * @public
 */
declare global {
    interface HTMLElementTagNameMap {
        'mosaik-tab': TabElement;
    }
}
export {};
//# sourceMappingURL=TabElement.d.ts.map