import { LitElement } from 'lit';
import '../badge/Badge.js';
import '../icon/Icon.js';
export interface TabProps {
    name?: string;
    label?: string;
    description?: string;
    disabled?: boolean;
    symbol?: string;
    iconPosition?: 'leading' | 'trailing';
    iconOnly?: boolean;
    error?: boolean;
    badge?: string;
}
declare const Tab_base: (new (...args: any[]) => import("../../util/EventEmitterMixin.js").EventEmitterMixinInterface) & (new (...args: any[]) => import("../../util/ReadyMixin.js").ReadyMixinInterface) & typeof LitElement;
/**
 * An individual tab within a tab group.
 *
 * Renders a button with role="tab" that participates in keyboard navigation
 * and selection state managed by the parent `btu-tabs` container.
 *
 * @element btu-tab
 *
 * @fires {CustomEvent} btu-tab-ready - Fired after first render
 * @fires {CustomEvent<{name: string}>} btu-tab-change - Fired when a non-disabled tab with a name is clicked
 *
 * @cssprop --badge-color-background - Background color of the count indicator badge (default: gray-50)
 * @cssprop --badge-color-foreground - Text color of the count indicator badge (default: gray-700)
 *
 * @example
 * ```html
 * <btu-tabs>
 *   <btu-tab name="main" label="Main"></btu-tab>
 *   <btu-tab name="seo" label="SEO"></btu-tab>
 *   <btu-tab name="styles" label="Styles" disabled></btu-tab>
 * </btu-tabs>
 * ```
 */
export default class Tab extends Tab_base {
    static get tagName(): string;
    /**
     * Value that identifies this tab and links it to panel elements that share the same `name` attribute.
     * @attr name
     */
    name?: string;
    /**
     * Text displayed in the tab.
     * @attr
     */
    label?: string;
    /**
     * Accessibility description for screen readers.
     * @attr
     */
    description?: string;
    /**
     * Whether the tab is disabled and non-interactive.
     * @attr
     */
    disabled: boolean;
    /**
     * Lucide icon symbol to display.
     * @attr
     */
    symbol?: string;
    /**
     * Placement of the icon relative to the label.
     * @attr icon-position
     */
    iconPosition: 'leading' | 'trailing';
    /**
     * When true, hides the label visually while maintaining accessibility.
     * @attr icon-only
     */
    iconOnly: boolean;
    /**
     * When true, displays an error badge on the tab.
     * @attr
     */
    error: boolean;
    /**
     * Displays a badge with the given value alongside the label.
     * @attr
     */
    badge?: string;
    /** @internal Active state set by parent btu-tabs */
    _active: boolean;
    /** @internal Roving tabindex value set by parent btu-tabs */
    _tabindex: number;
    /** @internal Set by parent btu-tabs */
    size: 'xs' | 'sm' | 'md' | 'lg';
    /** @internal */
    private initialClasses;
    connectedCallback(): void;
    createRenderRoot(): this;
    willUpdate(): void;
    firstUpdated(): void;
    /** @internal */
    private handleClick;
    render(): import("lit-html").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'btu-tab': Tab;
    }
}
export {};
//# sourceMappingURL=Tab.d.ts.map