import { CSSResultArray, PropertyValues, TemplateResult } from 'lit';
import { DesktopController } from '../../utils/button-interaction-controllers/desktop-controller';
import { MobileController } from '../../utils/button-interaction-controllers/mobile-controller';
import { Focusable } from '../../utils/focusable';
import { DependencyManagerController } from '../../utils/reactive-controllers/dependency-manger';
import { MatchMediaController } from '../../utils/reactive-controllers/match-media';
import { PendingStateController } from '../../utils/reactive-controllers/pending-state';
import '../icon';
import '../options';
import { LuzmoOptions, OptionIconRenderer } from '../options/options';
import '../overlay';
import { LuzmoOverlay } from '../overlay/overlay';
import { Placement } from '../overlay/overlay-types';
import { SlottableRequestEvent } from '../overlay/slottable-request-event';
import '../popover';
import '../progress-circle';
import '../tooltip';
import { LuzmoTooltip } from '../tooltip/tooltip';
export declare const DESCRIPTION_ID = "select-option-menu";
export declare const SEARCH_AS_OF_NUM_ITEMS = 20;
declare const LuzmoSelect_base: typeof Focusable & {
    new (...args: any[]): import("../..").SizedElementInterface;
    prototype: import("../..").SizedElementInterface;
};
/**
 * @element luzmo-select
 *
 * @slot label - The placeholder content for the Select
 * @slot description - The description content for the Select
 * @slot tooltip - Tooltip to to be applied to the the Select Button
 * @fires change - Announces that the `value` of the element has changed
 * @fires luzmo-opened - Announces that the overlay has been opened
 * @fires luzmo-closed - Announces that the overlay has been closed
 * @fires luzmo-search - Announces that the search has been updated
 * @fires luzmo-scrolled - Announces that the user has scrolled within the options menu. Only fires when the options menu is virtualized.
 * @attr size - The size of the select: `s`, `m`, `l` or `xl`
 */
export declare class LuzmoSelect extends LuzmoSelect_base {
    /**
     * @internal
     */
    static get styles(): CSSResultArray;
    /**
     * @internal
     */
    button: HTMLButtonElement;
    /**
     * @attr disabled - Whether the Picker is disabled.
     * @default false
     */
    disabled: boolean;
    /**
     * @attr focused - Whether the Picker is focused.
     * @default false
     */
    focused: boolean;
    /**
     * @attr icons - Whether to show icons only in menu (`only`) or not in menu items (`none`) or do show them (`undefined`)
     */
    icons?: 'only' | 'none';
    /**
     * @attr variant - Type of visual selection. Possible values: `checkmarks`, `checkboxes`, `highlight`
     * @default 'checkmarks'
     */
    variant?: 'checkmarks' | 'checkboxes' | 'highlight';
    /**
     * @attr emphasized - Whether the Select checkboxes are emphasized.
     * @default false
     */
    emphasized: boolean;
    /**
     * @attr invalid - Whether the select is marked invalid.
     * @default false
     */
    invalid: boolean;
    /**
     * @attr search - Whether the search input is visible.
     * @default 'auto'
     */
    search?: 'on' | 'off' | 'auto';
    /**
     * @attr no-wrap - Whether the text in the option childs should wrap
     * @default false
     */
    noWrap: boolean;
    /**
     * @attr retrieving - Whether items are currently being retrieved.
     * @default false
     */
    retrieving: boolean;
    /**
     * @attr pending - Whether the select is currently marked as pending.
     * @default false
     */
    pending: boolean;
    /**
     * @attr clearable - Whether the Select is clearable.
     * @default false
     */
    clearable: boolean;
    /**
     * @attr hide-dropdown-icon - Whether the dropdown disclosure icon is hidden.
     * @default false
     */
    hideDropdownIcon: boolean;
    /**
     * Defines a string value that labels the Picker while it is in pending state.
     * @attr pending-label
     * @default 'Pending'
     */
    pendingLabel: string;
    /**
     * Defines a string value that labels the search input field.
     * @attr search-label
     * @default 'Search'
     */
    searchLabel: string;
    /**
     * Defines a string value that is displayed when no results are found.
     * @attr no-results-label
     * @default 'No results'
     */
    noResultsLabel: string;
    /**
     * @attr no-data-label - Defines a string value that labels the Picker when no data is available.
     * @default 'No data'
     */
    noDataLabel: string;
    /**
     * @attr multiple-label-template - Defines a string value that labels the Picker when multiple items are selected.
     * @default 'Selected {count} items'
     */
    multipleLabelTemplate: string;
    /**
     * @attr label - The label of the select. This is used to set the aria-label of the select and is shown when no value is selected.
     * @default 'Select'
     */
    label: string;
    /**
     * @attr open - Whether the Picker is open.
     * @default false
     */
    open: boolean;
    /**
     * @attr readonly - Whether the select is readonly.
     * @default false
     */
    readonly: boolean;
    /**
     * @attr label-alignment - The alignment of the label.
     * @default 'inline'
     */
    labelAlignment?: 'inline';
    /**
     * @internal
     */
    displayLabelContent?: {
        label?: string;
        icon?: string;
        shortLabel?: string;
    };
    /**
     * @internal
     */
    searchString?: string;
    /**
     * @internal
     */
    optionsMenu: LuzmoOptions;
    /**
     * @internal
     */
    searchInput: HTMLInputElement;
    /**
     * @internal
     */
    overlayElement: LuzmoOverlay;
    /**
     * @type {"top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end"}
     * @attr
     */
    placement: Placement;
    /**
     * @attr quiet - Display as a quiet picker
     * @default false
     */
    quiet: boolean;
    /**
     * The value of the select.
     * @type {(string | number | null)[]}
     * @default []
     */
    value: (string | number | null)[];
    /**
     * The options of the select.
     * @type {any[]}
     * @default []
     */
    options: any[];
    /**
     * Optional icon renderer callback forwarded to luzmo-options.
     * Return null to use the default icon/imgSrc rendering.
     */
    optionIconRenderer?: OptionIconRenderer;
    /**
     * @internal
     */
    get selfManageFocusElement(): boolean;
    selects: undefined | 'single' | 'multiple';
    /**
     * @internal
     */
    dependencyManager: DependencyManagerController;
    /**
     * @internal
     */
    isMobile: MatchMediaController;
    /**
     * @internal
     */
    strategy: DesktopController | MobileController;
    /**
     * @internal
     */
    pendingStateController: PendingStateController<this>;
    /**
     * @internal
     */
    protected listRole: 'listbox' | 'menu';
    /**
     * @internal
     */
    protected itemRole: string;
    /**
     * @internal
     */
    protected tooltipEl?: LuzmoTooltip;
    /**
     * @internal
     */
    protected hasRenderedOverlay: boolean;
    /**
     * @internal
     */
    private _selfManageFocusElement;
    /**
     * @internal
     */
    private selectionPromise;
    /**
     * @internal
     */
    private enterKeydownOn;
    /**
     * @internal
     */
    private _selectedOptions;
    constructor();
    /**
     * @internal
     */
    get focusElement(): HTMLElement;
    forceFocusVisible(): void;
    click(): void;
    handleButtonBlur(): void;
    focus(options?: FocusOptions): void;
    handleHelperFocus(): void;
    handleChange(event: CustomEvent): void;
    handleButtonFocus(event: FocusEvent): void;
    toggle(target?: boolean): void;
    close(): void;
    /**
     * @internal
     */
    handleSlottableRequest: (_event: SlottableRequestEvent) => void;
    bindEvents(): void;
    connectedCallback(): void;
    disconnectedCallback(): void;
    protected handleTooltipSlotchange(event: Event & {
        target: HTMLSlotElement;
    }): void;
    /**
     * @internal
     */
    protected renderAngleIcon: () => TemplateResult;
    /**
     * @internal
     */
    protected renderAlertIcon: () => TemplateResult;
    /**
     * @internal
     */
    protected get labelTemplate(): TemplateResult[];
    protected update(changes: PropertyValues<this>): void;
    protected bindButtonKeydownListener(): void;
    protected willUpdate(changes: PropertyValues<this>): void;
    protected updated(changes: PropertyValues<this>): void;
    protected firstUpdated(changes: PropertyValues<this>): void;
    private _getCssVarInPixels;
    private _estimatePopoverWidth;
    /**
     * @internal
     */
    protected get dismissHelper(): TemplateResult;
    protected render(): TemplateResult;
    /**
     * @internal
     */
    protected get renderDescriptionSlot(): TemplateResult;
    protected setSelectedOptionsFromValue(): void;
    protected renderSearchInput(): TemplateResult;
    /**
     * @internal
     */
    protected get renderMenu(): TemplateResult;
    protected renderOverlay(menu: TemplateResult): TemplateResult;
    protected renderContainer(menu: TemplateResult): TemplateResult;
    protected getUpdateComplete(): Promise<boolean>;
    /**
     * @internal
     */
    protected handleEnterKeydown: (event: KeyboardEvent) => void;
    protected handleScrolled(event: any): void;
    protected handleExceededTop(event: Event): void;
    protected handleSearchInput(event: Event): void;
    protected handleSearchKeydown(event: KeyboardEvent): void;
    /**
     * @internal
     */
    protected clearValue: (event: Event) => void;
    protected handleEscape: (event: KeyboardEvent) => void;
    /**
     * @internal
     */
    protected handleKeydown: (event: KeyboardEvent) => void;
}
export {};