import type { IElementRef, OnCreate, OnDestroy, OnRender } from '@melodicdev/core';
import type { Size } from '../../../types/index.js';
import type { TabsVariant, TabsOrientation, TabConfig } from './tabs.types.js';
/**
 * ml-tabs - Tabbed interface component with optional router integration
 *
 * @example Simple mode with slotted panels:
 * ```html
 * <ml-tabs value="tab1">
 *   <ml-tab slot="tab" value="tab1" label="First"></ml-tab>
 *   <ml-tab slot="tab" value="tab2" label="Second"></ml-tab>
 *   <ml-tab-panel value="tab1">Content 1</ml-tab-panel>
 *   <ml-tab-panel value="tab2">Content 2</ml-tab-panel>
 * </ml-tabs>
 * ```
 *
 * @example With tab configs:
 * ```html
 * <ml-tabs .tabs=${tabs} value="users">
 *   <ml-tab-panel value="users">Users content</ml-tab-panel>
 *   <ml-tab-panel value="settings">Settings content</ml-tab-panel>
 * </ml-tabs>
 * ```
 *
 * @example Routed mode with child routes:
 * ```html
 * <ml-tabs routed .tabs=${[
 *   { value: 'users', label: 'Users', href: '/admin/users' },
 *   { value: 'settings', label: 'Settings', href: '/admin/settings' }
 * ]}>
 *   <router-outlet></router-outlet>
 * </ml-tabs>
 * ```
 *
 * @slot tab - Tab header elements (ml-tab)
 * @slot default - Tab panel content or router-outlet
 *
 * @fires ml:change - Emitted when active tab changes
 */
export declare class TabsComponent implements IElementRef, OnCreate, OnDestroy, OnRender {
    elementRef: HTMLElement;
    /** Currently active tab value */
    value: string;
    /** Visual variant */
    variant: TabsVariant;
    /** Size variant */
    size: Size;
    /** Tab orientation */
    orientation: TabsOrientation;
    /** Enable router integration */
    routed: boolean;
    /** Tab configurations (alternative to slotted ml-tab elements) */
    tabs: TabConfig[];
    /** Internal tracking of slotted tabs */
    private _slottedTabs;
    /** Navigation event listener for routed mode */
    private readonly _handleNavigation;
    /** Listener for ml:tab-click from slotted ml-tab elements */
    private readonly _handleTabClick;
    onCreate(): void;
    onRender(): void;
    onDestroy(): void;
    /** Handle tab slot changes */
    handleTabSlotChange: (event: Event) => void;
    /** Handle tab click */
    handleTabClick: (tabValue: string, href?: string) => void;
    /** Handle keyboard navigation */
    handleKeyDown: (event: KeyboardEvent) => void;
    /** Get all tabs (from config or slotted) */
    getAllTabs(): TabConfig[];
    /** Get tab by value */
    private getTabByValue;
    /** Update active state on slotted tabs */
    private updateTabStates;
    /** Update panel visibility */
    private updatePanelVisibility;
    /** Focus a specific tab */
    private focusTab;
    /** Sync active tab with current route (for routed mode) */
    private syncWithRoute;
    /** Handle navigation events (routed mode) */
    private onNavigation;
}
//# sourceMappingURL=tabs.component.d.ts.map