import { JSXInterface } from '../jsx';
import { BasicElement, CSSResultGroup, PropertyValues, TemplateResult } from '@refinitiv-ui/core';
import '../button/index.js';
import '../layout/index.js';
/**
 * Container for tabs
 *
 * @fires value-changed - Fired when the user changes an active tab. The event is not triggered if `value` property is changed programmatically.
 */
export declare class TabBar extends BasicElement {
    /**
     * Element version number
     * @returns version number
     */
    static get version(): string;
    protected readonly defaultRole = "tablist";
    /**
     * A `CSSResultGroup` that will be used
     * to style the host, slotted children
     * and the internal template of the element.
     * @returns CSS template
     */
    static get styles(): CSSResultGroup;
    /**
     * Specify tab's horizontal alignment
     */
    alignment: 'left' | 'center' | 'right';
    /**
     * Use level styling from theme
     */
    level: '1' | '2' | '3';
    /**
     * Use to switch from horizontal to vertical layout.
     */
    vertical: boolean;
    /**
     * Internal value of tab bar.
     * Controlled by public setter and getter
     */
    private _value;
    /**
     * Value of tab-bar, derived from value of an active tab.
     * @param value Element value
     * @default -
     */
    set value(value: string);
    get value(): string;
    private content;
    private leftBtn;
    private rightBtn;
    private isScrolling;
    /**
     * Called after the element’s DOM has been updated the first time.
     * register scroll event on content element to toggle scroll button
     * @param changedProperties Properties that has changed
     * @returns {void}
     */
    protected firstUpdated(changedProperties: PropertyValues): void;
    /**
     * Called when the element’s DOM has been updated and rendered
     * @param changedProperties Properties that has changed
     * @returns {void}
     */
    protected updated(changedProperties: PropertyValues): void;
    /**
     * Handles content's container resize
     * @param event Resize event
     * @returns {void}
     */
    private handleResize;
    /**
     * Return true if incoming value matches one of the existing tabs
     * @param value Value to check
     * @returns true if incoming value matches one of the existing tabs
     */
    protected isValidValue(value: string): boolean;
    /**
     * On *user-interaction* set the value and notify.
     * @param value New value
     * @returns {void}
     */
    protected setValueAndNotify(value: string): void;
    /**
     * When the slot changes, set the level, toggle the scroll button, and set the value
     * @returns {void}
     */
    private onSlotChange;
    /**
     * Mark tab as active
     * @param value value of tab to select
     * @returns {void}
     */
    private activateTab;
    /**
     * Set tab value and fires `tab-changed` event
     * @param event - Event
     * @returns {void}
     */
    private onTap;
    /**
     * Get the value of a tab
     * @param tab - The tab element.
     * @returns The value of the tab.
     */
    private getTabValue;
    /**
     * Return the tab's label, or its textContent, or an empty string
     * @param tab - The tab element.
     * @returns The tab label.
     */
    private getTabLabel;
    /**
     * Get Tab elements from slot
     * @returns the array of Tab
     */
    private getTabElements;
    /**
     * Get focusable tab elements
     * @returns the array of focusable tab
     */
    private getFocusableTabs;
    /**
     * Set tab level attribute accordingly
     * @returns {void}
     */
    private setLevel;
    /**
     * Hide/Show scroll button when element is overflow.
     * @param elementWidth width of element
     * @returns {void}
     */
    private toggleScrollButton;
    /**
     * Update scroll position when clicked on left button
     * @returns {void}
     */
    private handleScrollLeft;
    /**
     * Update scroll position when clicked on right button
     * @returns {void}
     */
    private handleScrollRight;
    /**
     * Focus and set active to tab
     * @param tab - The element that was clicked.
     * @return {void}
     */
    private focusAndSetActiveTab;
    /**
     * Navigate to first focusable tab of the tab bar
     * @returns {void}
     */
    private first;
    /**
     * Navigate to last focusable tab of the tab bar
     * @returns {void}
     */
    private last;
    /**
     * Navigate to next or previous focusable tab
     * @param direction up/next; down/previous
     * @returns {void}
     */
    private navigateToSibling;
    /**
     * Handles key down event
     * @param event Key down event object
     * @returns {void}
     */
    private onKeyDown;
    /**
     * Sets the tabindex to -1 for all tabs except the active tab.
     * @param target the tab to be focused
     * @param tabList Array of tabs that contains target
     * @returns {void}
     */
    private rovingTabIndex;
    /**
     * Set tabIndex to all tabs
     * @returns {void}
     */
    private manageTabIndex;
    /**
     * A `TemplateResult` that will be used
     * to render the updated internal template.
     * @return Render template
     */
    protected render(): TemplateResult;
}
declare global {
    interface HTMLElementTagNameMap {
        'ef-tab-bar': TabBar;
    }
}

declare global {
  interface HTMLElementTagNameMap {
    'ef-tab-bar': TabBar;
  }

  namespace JSX {
    interface IntrinsicElements {
      'ef-tab-bar': Partial<TabBar> | JSXInterface.HTMLAttributes<TabBar>;
    }
  }
}

export {};