import { HTMLTemplateResult, PropertyValueMap } from "lit";
import { FRoot } from "../../mixins/components/f-root/f-root";
import { FDiv } from "../f-div/f-div";
import { FSuggest } from "../f-suggest/f-suggest";
export type FSearchState = "primary" | "default" | "success" | "warning" | "danger";
export type FSearchCustomEvent<Type = unknown> = {
    value: Type;
    scope: string;
};
export type FSearchSuffixWhen = (value: string) => boolean;
export type FSearchSuggestionsCategory = Record<string, string[]>;
export type FSearchOptionTemplate<Type = unknown> = {
    value: Type;
    template: (value?: string) => HTMLTemplateResult;
    toString: () => string;
};
export type FSearchResultWhen = (suggestion: string | FSearchOptionTemplate, value?: string) => boolean;
export type FSearchSuggestions = string[] | FSearchSuggestionsCategory | FSearchOptionTemplate[];
export type FSearchScope = string[] | "none";
export declare class FSearch extends FRoot {
    /**
     * css loaded from scss file
     */
    static styles: import("lit").CSSResult[];
    /**
     * @attribute Variants are various visual representations of an input field.
     */
    variant?: "curved" | "round" | "block";
    /**
     * @attribute Categories are various visual representations of an input field.
     */
    category?: "fill" | "outline" | "transparent";
    /**
     * @attribute results to show on value
     */
    result?: FSearchSuggestions;
    /**
     * @attribute disable showing result
     */
    disableResult: boolean;
    /**
     * @attribute States are used to communicate purpose and connotations.
     */
    state?: FSearchState;
    /**
     * @attribute f-input can have 2 sizes. By default size is inherited by the parent f-field.
     */
    size?: "medium" | "small";
    /**
     * @attribute Defines the value of a f-search.
     */
    value?: string;
    /**
     * @attribute sets the value of scope in use
     */
    selectedScope?: string;
    /**
     * for vue2 camelcase support
     */
    set ["selected-scope"](val: string);
    /**
     * @attribute Defines the placeholder text
     */
    placeholder?: string;
    /**
     * @attribute Shows scope list if not none
     */
    scope?: FSearchScope;
    /**
     * @attribute Shows disabled state of input element
     */
    disabled?: boolean;
    /**
     * @attribute  Displays a close icon-button on the right side of the input that allows the user to clear the input value
     */
    clear?: boolean;
    /**
     * @attribute Note: Provides an icon button to trigger the search query. Note: Search icon on left is not shown if search-button is true.
     */
    ["search-button"]?: boolean;
    /**
     * @attribute Loader icon .
     */
    loading?: boolean;
    /**
     * to customize result
     */
    resultWhen: FSearchResultWhen;
    set ["result-when"](val: FSearchResultWhen);
    /**
     * @attribute max height for options
     */
    resultMaxHeight?: string;
    labelSlot: HTMLElement;
    descriptionSlot: HTMLElement;
    helpSlot: HTMLElement;
    headerSection: FDiv;
    helperTextSection: FDiv;
    suggestElement: FSuggest;
    /**
     * @attribute assigned elements inside slot label
     */
    _labelNodes: NodeListOf<HTMLElement>;
    /**
     * @attribute assigned elements inside slot description
     */
    _descriptionNodes: NodeListOf<HTMLElement>;
    /**
     * @attribute assigned elements inside slot help
     */
    _helpNodes: NodeListOf<HTMLElement>;
    /**
     * has label slot
     */
    get hasLabel(): boolean;
    /**
     * has description slot
     */
    get hasDescription(): boolean;
    /**
     * has help slot
     */
    get hasHelperText(): boolean;
    /**
     * emit input custom event
     */
    handleInput(e: CustomEvent<{
        value: unknown;
    }>): void;
    /**
     * emit input custom event for scope
     */
    handleScopeSelection(e: CustomEvent<{
        value: string;
    }>): void;
    /**
     * emit search custom event
     */
    handleSearchClick(e: CustomEvent): void;
    /**
     * clear input value on clear icon clicked
     */
    clearInputValue(): void;
    /**
     *
     * @param value string for value
     * @param scope string for scope value
     */
    dispatchInputEvent(value: any, scope?: string): void;
    /**
     * set styling class
     */
    get applyStyling(): "f-search-border" | "f-search-border-button" | "f-search-suggest-button" | "f-search-suggest";
    /**
     * conditional help section display for false spacing issue
     */
    displayHelpSection(): void;
    /**
     * conditional header section display for false spacing issue
     */
    displayHeaderSection(): void;
    protected willUpdate(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
    render(): import("lit-html").TemplateResult<1>;
    protected updated(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
}
/**
 * Required for typescript
 */
declare global {
    interface HTMLElementTagNameMap {
        "f-search": FSearch;
    }
}
