import { LitElement } from 'lit';
import '../badge/Badge.js';
import '../dropdown/Dropdown.js';
import '../dropdown/DropdownItem.js';
import '../dropdown/DropdownMenu.js';
import '../icon/Icon.js';
export interface TabsProps {
    size?: 'xs' | 'sm' | 'md' | 'lg';
    activeTab?: string;
    variant?: 'full' | 'menu';
}
declare const Tabs_base: (new (...args: any[]) => import("../../util/RovingTabindexMixin.js").RovingTabindexInterface) & (new (...args: any[]) => import("../../util/EventEmitterMixin.js").EventEmitterMixinInterface) & (new (...args: any[]) => import("../../util/ReadyMixin.js").ReadyMixinInterface) & typeof LitElement;
/**
 * A container component for managing a group of tabs.
 *
 * Provides selection state management, size propagation to child tabs,
 * and keyboard navigation following the WAI-ARIA Tabs pattern.
 *
 * When a tab becomes active, direct sibling elements that share the same
 * `name` value are shown; other siblings with a `name` attribute are
 * hidden. Only direct siblings are managed — nested tab groups control their
 * own panels independently.
 *
 * @element btu-tabs
 *
 * @fires {CustomEvent} btu-tabs-ready - Fired after first render and initialization
 * @fires {CustomEvent<{name: string}>} btu-tabs-show - Fired when a tab becomes active
 * @fires {CustomEvent<{name: string}>} btu-tabs-hide - Fired when a tab is deactivated
 * @fires {CustomEvent<{name: string}>} btu-tab-change - Fired when a tab is selected (bubbles from btu-tab)
 * @fires {CustomEvent} btu-tab-ready - Fired when a child tab finishes initialization (bubbles from btu-tab)
 *
 * @cssprop --tabs-active-color - Text and icon color of the active tab (default: gray-700)
 * @cssprop --tabs-active-indicator-color - Color of the active tab underline indicator (default: primary-500 → primary-700 → primary-900 gradient)
 * @cssprop --tabs-border-color - Color of the bottom border divider (default: gray-200)
 * @cssprop --tabs-color - Text and icon color for all tabs (default: gray-500; active/hover tabs use gray-700)
 * @cssprop --tabs-background - Background color for all tab buttons (default: transparent)
 * @cssprop --tabs-container-background - Background color of the tabs container (default: theme white)
 * @cssprop --tabs-hover-background - Background color of a tab on hover (default: gray-100)
 * @cssprop --tabs-hover-color - Text and icon color of a tab on hover (default: gray-700)
 * @cssprop --tabs-gap - Spacing between tabs (default: 1rem)
 *
 * @example
 * ```html
 * <div>
 *   <btu-tabs size="md" active-tab="main">
 *     <btu-tab name="main" label="Main"></btu-tab>
 *     <btu-tab name="seo" label="SEO"></btu-tab>
 *     <btu-tab name="overrides" label="Overrides"></btu-tab>
 *   </btu-tabs>
 *   <div name="main" role="tabpanel">Main content</div>
 *   <div name="seo" role="tabpanel">SEO content</div>
 *   <div name="overrides" role="tabpanel">Overrides content</div>
 * </div>
 * ```
 */
export default class Tabs extends Tabs_base {
    static get tagName(): string;
    /**
     * Size variant applied to all child tabs.
     * @attr
     */
    size: 'xs' | 'sm' | 'md' | 'lg';
    /**
     * The `name` value of the currently active tab.
     * @attr active-tab
     */
    activeTab?: string;
    /**
     * Layout variant.
     * - 'full': tabs scroll horizontally when they overflow (default)
     * - 'menu': all tabs are hidden; the active tab label and a chevron dropdown are shown instead
     * @attr
     */
    variant: 'full' | 'menu';
    /** @internal */
    private initialClasses;
    /** @internal Bound event handler for cleanup */
    private boundHandleTabChange;
    /** @internal Bound event handler for cleanup */
    private boundHandleKeyDown;
    /** @internal */
    _getRovingTargets(): HTMLElement[];
    /** @internal Menu variant state */
    private rafId;
    private menuWrapper;
    private menuDropdown;
    private menuLabel;
    private menuIcon;
    private menuErrorBadge;
    private get _dropdownSize();
    private get _menuIconSize();
    connectedCallback(): void;
    disconnectedCallback(): void;
    createRenderRoot(): this;
    willUpdate(): void;
    firstUpdated(): void;
    updated(changedProperties: Map<string, unknown>): void;
    /** @internal Tear down a variant's DOM and state before switching to another */
    private teardownVariant;
    /** @internal */
    private syncTabs;
    /** @internal Show/hide panel elements that are direct siblings with a matching name value */
    private syncPanels;
    /** @internal */
    private getTabs;
    /** @internal */
    private activateTab;
    /** @internal */
    private handleTabChange;
    /** @internal Keyboard navigation following WAI-ARIA Tabs pattern */
    private handleKeyDown;
    /** @internal */
    private initMenu;
    /** @internal */
    private updateMenuItems;
    /** @internal */
    private syncMenuState;
    render(): import("lit-html").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'btu-tabs': Tabs;
    }
}
export {};
//# sourceMappingURL=Tabs.d.ts.map