import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
import { OptionValue } from '../q2-option-list/q2-option-list';
/**
 * @name Pill
 * @category Display
 * @summary Use for displaying and removing active filters in data views.
 * @slot decorator - An optional slot that supports an [Icon](https://tecton.q2developer.com/design-system/q2-icon) to be displayed before the pill label.
 * @slot popover-top - An optional slot to display custom content persistently at the top of the popover. This is **not** compatible with the action sheet workflow.
 * @slot popover-bottom - An optional slot to display custom content persistently at the bottom of the popover. This is **not** compatible with the action sheet workflow.
 */
export declare class Q2Pill implements ComponentInterface {
    mutationObserver: MutationObserver;
    optionList: HTMLQ2OptionListElement;
    popoverBottomContainer: HTMLElement;
    popoverElement: HTMLQ2PopoverElement;
    popoverTopContainer: HTMLElement;
    primaryBtn: HTMLButtonElement;
    primaryBtnWrapper: HTMLElement;
    scheduledAfterRender: (() => void)[];
    hostElement: HTMLElement;
    hasPopoverBottom: boolean;
    hasPopoverTop: boolean;
    optionCount: number;
    selectedOptionElements: HTMLQ2OptionElement[];
    /** Determine if the elements is in the selected state, with values. */
    active: boolean;
    /** Indicates that the pill has no border */
    borderless: boolean;
    /** Indicates the pill cannot be focused or interacted with. */
    disabled: boolean;
    /**
     * Instructs the component to use the action sheet workflow for displaying its options.
     *
     * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).
     */
    hoist: boolean;
    /**
     * The text that populates the label.
     * @localizable
     */
    label: string;
    /**
     * The maximum number of characters to display before ellipcizing.
     * @info
     * Limitless by default.
     */
    maxLength: number;
    /**
     * Enables the multi-select ability for the dropdown.
     * @info
     * Only applicable when options are provided.
     */
    multiple: boolean;
    /**
     * Determine whether the popover is open or closed.
     *
     * @readonly
     */
    open: boolean;
    /** Determines the label that is applied to the option list for accessibility purposes. */
    optionListLabel: string;
    /** Aligns the popover dropdown to the left or right side of the input field. */
    popoverAlignment: 'left' | 'right';
    /**
     * Force the direction of the popover dropdown when it opens.
     * If no value is passed, the component will auto-detect the direction based on available space.
     */
    popoverDirection: 'up' | 'down';
    /**
     * Force the maximum height of the popover. This value will be interpreted as pixels.
     * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.
     */
    popoverMaxHeight: number;
    /** @deprecated */
    popoverMinHeight: number;
    /** A list of the selected options on the element. */
    selectedOptions: OptionValue[];
    /** The color of the element when in the active state. */
    theme: 'primary' | 'secondary' | 'tertiary';
    /** The value emitted when the component is selected. */
    value: string;
    /**
     * Emitted when the pill is clicked or the selected options change.
     *
     * When multi-select is enabled, `value` will be `undefined`.
     * @legacyEvent
     * @deprecated Use 'tctChange' instead
     */
    change: EventEmitter<{
        value: string;
        values: OptionValue[];
        active: boolean;
    }>;
    /**
     * Emitted when the pill is clicked or the selected options change.
     *
     * When multi-select is enabled, `value` will be `undefined`.
     * @legacyEvent
     */
    tctChange: EventEmitter<{
        value: string;
        values: OptionValue[];
        active: boolean;
    }>;
    disconnectedCallback(): void;
    componentWillLoad(): void;
    componentDidLoad(): void;
    componentDidRender(): void;
    handleSelectedDisplay(): void;
    delegateFocus(event: FocusEvent): void;
    popoverStateHandler({ detail: { open } }: CustomEvent<{
        open: boolean;
    }>): Promise<void>;
    /**
     * Emulates clicking the `<button>` to hide the popover if it is visible.
     *
     * @testOnly
     */
    closePopover(): Promise<void>;
    /**
     * Emulates clicking the `<button>` to display the popover if it is hidden.
     *
     * @testOnly
     */
    openPopover(): Promise<void>;
    /**
     * Emulates clicking the `<button>` to display the popover and selecting the option(s) with the specified value(s).
     *
     * If multi-select is enabled and the `closePopover` argument is `true` (default), the popover will be closed
     * after the option(s) are selected.
     *
     * @testOnly
     */
    setValue(values: string | string[], options?: {
        closePopover?: boolean;
    }): Promise<void>;
    selectedOptionsChanged(newValue: any): void;
    valueChanged(newValue: any, _oldValue: any, propName: any): Promise<void>;
    get buttonContent(): {
        text: string;
        truncatedText: string;
    };
    _togglePopover(): void;
    _truncate(text?: string, maxLength?: number): string;
    clearSelectedOptions: () => void;
    determineOptionCount: () => Promise<void>;
    executeActionSheet: (event: MouseEvent | KeyboardEvent) => Promise<void>;
    filterSlottedElements: () => void;
    getOption: (value: string) => Promise<import("../..").ValidOptionElements>;
    getOptionListOptions: () => Promise<import("../..").ValidOptionElements[]>;
    handleChange: (event: any) => void;
    handleClick: (event: MouseEvent) => Promise<void>;
    handleFocusOut: (event: FocusEvent) => Promise<void>;
    handleKeydown: (event: KeyboardEvent) => Promise<void>;
    handleOptionListExternalKeydown: (event: KeyboardEvent) => Promise<void>;
    handleSelectionChanges: (changeDetails: {
        value?: string;
        values?: OptionValue[];
    }) => Promise<void>;
    handleSlotKeydown: (event: KeyboardEvent) => void;
    handleTctChange: (event: CustomEvent) => void;
    handleWrapperClick: () => void;
    onClickElsewhere: (event: CustomEvent) => void;
    onMutationObserved: () => void;
    onPopoverState: (event: CustomEvent<{
        open: boolean;
        action: "close" | "select" | "open";
    }>) => void;
    setOptionListActiveElement: (index: number) => Promise<void>;
    syncValueProperties: () => void;
    updateSelectedOptionElements: () => Promise<void>;
    updateSlotState: () => void;
    renderHiddenElement(): any;
    renderIcon(): any;
    render(): any;
}