import { Placement } from '@floating-ui/dom';
import { EventEmitter } from '../../stencil-public-runtime';
import { Observable } from 'rxjs';
import { ErrorMap } from '../cat-form-hint/cat-form-hint';
export interface Item {
    id: string;
}
export interface Page<T> {
    content: T[];
    last: boolean;
    totalElements?: number;
}
export interface RenderInfo {
    label: string;
    description?: string;
    avatar?: {
        src?: string;
        round?: boolean;
        initials?: string;
        icon?: string;
    };
}
/**
 * @property customId - Change the ID of item for the given one.
 * @property resolve - Resolves the value of the select.
 * @property retrieve - Retrieves the options of the select.
 * @property render - Renders the items of the select.
 * @property renderOptions$ - Observable that triggers re-rendering of options when emitted (doesn't support tags).
 */
export interface CatSelectConnector<T extends Item = any> {
    customId?: (item: T) => string;
    resolve: (ids: string[]) => Observable<T[]>;
    retrieve: (term: string, page: number) => Observable<Page<T>>;
    render: (item: T) => RenderInfo;
    renderOptions$?: Observable<void>;
}
export interface CatSelectState {
    term: string;
    isOpen: boolean;
    isLoading: boolean;
    isFirstLoading: boolean;
    isResolving: boolean;
    options: {
        item: Item;
        render: RenderInfo;
    }[];
    tempSelection: {
        item: Item;
        render: RenderInfo;
    }[];
    selection: {
        item: Item;
        render: RenderInfo;
    }[];
    activeOptionIndex: number;
    activeSelectionIndex: number;
    totalElements?: number;
}
export interface CatSelectMultipleTaggingValue {
    ids: string[];
    tags: string[];
}
export interface CatSelectTaggingValue {
    id: string;
    tag: string;
}
export type CatSelectValue = string | string[] | CatSelectTaggingValue | CatSelectMultipleTaggingValue;
/**
 * Select lets user choose one option from an options' menu.
 * Consider using select when you have 6 or more options. Select component supports any content type.
 *
 * @slot hint - Optional hint element to be displayed with the select.
 * @slot label - The slotted label. If both the label property and the label slot are present,
 * only the label slot will be displayed.
 * @part label - The native label element.
 * @part input - The native input element.
 */
export declare class CatSelect {
    private static readonly SKELETON_COUNT;
    private static readonly DROPDOWN_OFFSET;
    private readonly _id;
    private get id();
    private dropdown?;
    private trigger?;
    private input?;
    private errorMapSrc?;
    private subscription?;
    private renderSubscription?;
    private term$;
    private more$;
    private valueChangedBySelection;
    private cleanupFloatingUi?;
    hostElement: HTMLElement;
    connector?: CatSelectConnector;
    state: CatSelectState;
    hasSlottedLabel: boolean;
    hasSlottedHint: boolean;
    errorMap?: ErrorMap | true;
    /**
     * Whether the label need a marker to shown if the select is required or optional.
     */
    requiredMarker?: 'none' | 'required' | 'optional' | 'none!' | 'optional!' | 'required!';
    /**
     * Whether the label is on top or left.
     */
    horizontal?: boolean;
    /**
     * If the horizontal value is not provided, this fallback value is used. Can be set by form-group.
     * @internal
     */
    fallbackHorizontal?: boolean;
    /**
     * Enable multiple selection.
     */
    multiple: boolean;
    /**
     * The debounce time for the search.
     */
    debounce: number;
    /**
     * The placement of the select.
     */
    placement: Placement;
    /**
     * The value of the select. <br />
     * <br />
     * The value of the select depends on whether it is allowed to choose a single item or several items. <br />
     * When only one item can be selected, the value is the id of the item, in case several items can be selected, the value is an array of ids of the selected items. <br />
     * <br />
     * In case the user can add new items to the select (tags activated), the value in the single select is an object (CatSelectTaggingValue) with the id of the item or the name of the created item,
     * in the case of multiple select, it is an object (CatSelectMultipleTaggingValue) with the array of the ids of the items selected and the array of the names of the items created
     */
    value?: CatSelectValue;
    /**
     * Whether the select is disabled.
     */
    disabled: boolean;
    /**
     * The placeholder text to display within the select.
     */
    placeholder?: string;
    /**
     * Optional hint text(s) to be displayed with the select.
     */
    hint?: string | string[];
    /**
     * A unique identifier for the input.
     */
    identifier?: string;
    /**
     * The label for the select.
     */
    label: string;
    /**
     * The name of the form control. Submitted with the form as part of a name/value pair.
     */
    name?: string;
    /**
     * Visually hide the label, but still show it to assistive technologies like screen readers.
     */
    labelHidden: boolean;
    /**
     * A value is required or must be checked for the form to be submittable.
     */
    required: boolean;
    /**
     * Whether the select should show a clear button.
     */
    clearable: boolean;
    /**
     * Whether the select should add new items.
     */
    tags: boolean;
    /**
     * Optional hint text to be displayed on the new item to be added.
     */
    tagHint?: string;
    /**
     * The text to display in the dropdown if no results are found.
     */
    noItems?: string;
    /**
     * The validation errors for this input. Will render a hint under the input
     * with the translated error message(s) `error.${key}`. If an object is
     * passed, the keys will be used as error keys and the values translation
     * parameters.
     * If the value is `true`, the input will be marked as invalid without any
     * hints under the input.
     */
    errors?: boolean | string[] | ErrorMap;
    /**
     * Fine-grained control over when the errors are shown. Can be `false` to
     * never show errors, `true` to show errors on blur, or a number to show
     * errors change with the given delay in milliseconds or immediately on blur.
     */
    errorUpdate: boolean | number;
    /**
     * Attributes that will be added to the native HTML input element.
     */
    nativeAttributes?: {
        [key: string]: string;
    };
    /**
     * A unique identifier for the underlying native element that is used for
     * testing purposes. The attribute is added as `data-test` attribute and acts
     * as a shorthand for `nativeAttributes={ 'data-test': 'test-Id' }`.
     */
    testId?: string;
    onConnectorChanged(connector: CatSelectConnector): void;
    onValueChanged(): void;
    onErrorsChanged(newValue?: boolean | string[] | ErrorMap, _oldValue?: unknown, update?: boolean): void;
    onStateChanged(newState: CatSelectState, oldState: CatSelectState): void;
    /**
     * Emitted when the select dropdown is opened.
     */
    catOpen: EventEmitter<FocusEvent>;
    /**
     * Emitted when the select dropdown is closed.
     */
    catClose: EventEmitter<FocusEvent>;
    /**
     * Emitted when the value is changed.
     */
    catChange: EventEmitter<CatSelectValue>;
    /**
     * Emitted when the select loses the focus.
     */
    catBlur: EventEmitter<FocusEvent>;
    componentDidLoad(): void;
    componentWillLoad(): void;
    componentWillRender(): void;
    onBlur(event: FocusEvent): void;
    onKeyDown(event: KeyboardEvent): void;
    onKeyUp(event: KeyboardEvent): void;
    /**
     * Programmatically move focus to the input. Use this method instead of
     * `input.focus()`.
     *
     * @param options An optional object providing options to control aspects of
     * the focusing process.
     */
    doFocus(options?: FocusOptions): Promise<void>;
    /**
     * Programmatically remove focus from the input. Use this method instead of
     * `input.blur()`.
     */
    doBlur(): Promise<void>;
    /**
     * Clear the input.
     */
    clear(): Promise<void>;
    /**
     * Connect the functions of the select
     *
     * @param connector - The {@link CatSelectConnector} of the select.
     */
    connect(connector: CatSelectConnector): Promise<void>;
    render(): any;
    private get hasHint();
    private get invalid();
    private get optionsList();
    private resolve;
    private toSelectItems;
    private show;
    private hide;
    private search;
    private isSelected;
    private select;
    private deselect;
    private rerenderOptions;
    private toggle;
    private clearInput;
    private reset;
    private onClick;
    private onInput;
    private update;
    private patchState;
    private isPillboxActive;
    private get activeDescendant();
    private onArrowKeyDown;
    private get tagTextHelp();
    private isTagSelected;
    private createTag;
    private removeTag;
    private toggleTag;
    private initIds;
    private initTags;
    private setTransparentCaret;
    private showErrors;
    private errorUpdateTimeoutId?;
    private showErrorsIfTimeout;
    private showErrorsIfNoFocus;
}