import { LitElement } from 'lit';
import '../Button/Button';
import '../Icon/Icon';
import type { CttIconName } from '../Icon/Icon';
export interface DropdownOption {
    id: string | number;
    label: string;
    value?: unknown;
    description?: string;
    disabled?: boolean;
    icon?: string;
    onClick?: (option: DropdownOption, element?: HTMLElement) => void;
}
declare global {
    interface HTMLElementTagNameMap {
        'ctt-button-dropdown': CttButtonDropdown;
    }
}
/**
 * CTT ButtonDropdown Component
 *
 * A dropdown component that uses a button as the trigger.
 * Combines button properties with dropdown functionality and uses a portal for positioning.
 *
 * @example
 * ```html
 * <ctt-button-dropdown
 *   label="Select Option"
 *   variant="primary"
 *   size="medium"
 *   .options=${[{label: 'Option 1', value: 1}, {label: 'Option 2', value: 2}]}>
 * </ctt-button-dropdown>
 * ```
 */
export declare class CttButtonDropdown<T = DropdownOption> extends LitElement {
    static styles: import("lit").CSSResult[];
    /**
     * Button variant
     */
    buttonVariant: 'primary' | 'secondary' | 'tertiary' | 'basic' | 'ghost';
    /**
     * Button size
     */
    size: 'small' | 'medium' | 'large';
    /**
     * Button label text
     */
    label: string;
    /**
     * Array of options to display in the dropdown
     */
    options: T[];
    /**
     * The current selected value
     */
    get value(): unknown;
    set value(newValue: unknown);
    private _value;
    /**
     * Whether the dropdown is disabled
     */
    disabled: boolean;
    /**
     * Whether to show descriptions for options
     */
    hasDescription: boolean;
    /**
     * Whether to update button label when option is selected
     */
    updateLabelOnSelect: boolean;
    /**
     * Property name to use for the option label
     */
    labelKey?: keyof T;
    /**
     * Property name to use for the option value
     */
    valueKey?: keyof T;
    /**
     * Property name to use for the option description
     */
    descriptionKey?: keyof T;
    /**
     * Property name to use for the option disabled state
     */
    disabledKey?: keyof T;
    /**
     * Whether to show right chevron icon in button
     */
    showChevron: boolean;
    /**
     * Button icon left
     */
    iconLeft: boolean;
    /**
     * Button icon left name
     */
    iconLeftName: CttIconName;
    /**
     * Button border radius
     */
    borderRadius: 'none' | 'pill' | 'small' | 'extraSmall';
    /**
     * Button loading state
     */
    loading: boolean;
    /**
     * Whether the dropdown is open
     */
    get open(): boolean;
    set open(value: boolean);
    /**
     * Internal state for dropdown open/closed
     */
    private _isOpen;
    /**
     * Unique ID for the dropdown portal
     */
    private _dropdownId;
    /**
     * Portal reference for dropdown
     */
    private _portalRef;
    /**
     * Flag to prevent outside click during option selection
     */
    private _isOptionClicking;
    constructor();
    connectedCallback(): void;
    disconnectedCallback(): void;
    private _getOptionLabel;
    private _getOptionValue;
    private _getOptionDescription;
    private _getOptionDisabled;
    private _isOptionSelected;
    private _getDisplayText;
    private _getVerticalOffset;
    private _applyChevronAnimation;
    private _handleTriggerClick;
    private _setupPortalDropdown;
    private _createOptionElement;
    private _handleOptionClick;
    private _closeAllOtherDropdowns;
    private _closeDropdown;
    private _handleOutsideClick;
    render(): import("lit-html").TemplateResult<1>;
}