/**
 * The search bar is an input element used for searching server side resources or to filter local results.
 *
 * ## Accessibility
 *
 * ### Landmark role=search
 * Given there is only one instance of `<oc-search-bar>` per page/route, this component should communicate its purpose, being the main site search, to screen readers ([explainer of landmark roles](https://www.washington.edu/accessibility/web/landmarks/)). If the component serves as a filter form, it is advised to disable the landmark role via `isFilter="true"`.
 *
 * ### Making sure a submit button exits
 *
 * Both a search and filter form does need a submit button, regardless if the button is visually perceivable or not. If a "buttonless" look is desired, use `button-hidden="true"`, which renders the button visually hidden.
 *
 * The `aria-label` of the loading spinner can be set via `customLoadingAccessibleLabel`. If not set, it will default to "Loading results".
 */
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
    /**
     * Set the search query
     */
    value: {
        type: StringConstructor;
        required: false;
        default: any;
    };
    /**
     * The icon to be displayed
     */
    icon: {
        type: StringConstructor;
        required: false;
        default: string;
    };
    /**
     * Informative placeholder about the data to be entered
     */
    placeholder: {
        type: StringConstructor;
        required: false;
        default: string;
    };
    /**
     * Informative label about the data to be entered
     */
    label: {
        type: StringConstructor;
        required: true;
        default: string;
    };
    /**
     * Indicator if the search bar should be of smaller size
     */
    small: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Determine the button text
     */
    buttonLabel: {
        type: StringConstructor[];
        required: false;
        default: string;
    };
    /**
     * Determine the button visibility
     */
    buttonHidden: {
        type: BooleanConstructor[];
        required: false;
        default: boolean;
    };
    /**
     * If set to true the search event is triggered on each entered character
     */
    typeAhead: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * automatically trim whitespaces around search term
     */
    trimQuery: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * If set to true data is loaded and the user cannot enter further data
     */
    loading: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * If set to true the search landmark role is removed since it's not the page's main search function anymore
     */
    isFilter: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * The aria-label for the loading spinner
     */
    loadingAccessibleLabel: {
        type: StringConstructor;
        required: false;
        default: string;
    };
    /**
     * Show a "cancel" button next to the search bar.
     */
    showCancelButton: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Variation of the cancel button
     */
    cancelButtonVariation: {
        type: StringConstructor;
        required: false;
        default: string;
        validator: (value: string) => boolean;
    };
    /**
     * Appearance of the cancel button
     */
    cancelButtonAppearance: {
        type: StringConstructor;
        required: false;
        default: string;
        validator: (value: string) => boolean;
    };
    /**
     * Handler function for when the cancel button is clicked.
     */
    cancelHandler: {
        type: FunctionConstructor;
        required: false;
        default: () => void;
    };
}>, {
    query: import('vue').Ref<string, string>;
    inputIconRightPadding: import('vue').ComputedRef<"125px" | "48px">;
}, {}, {
    searchQuery(): string;
    spinnerSize(): "xsmall" | "medium";
    inputClass(): string[];
    loadingAccessibleLabelValue(): string;
}, {
    focusSearchInput(): void;
    onSearch(): void;
    onType(query: string): void;
    onCancel(): void;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("input" | "search" | "clear" | "keyup" | "advancedSearch")[], "input" | "search" | "clear" | "keyup" | "advancedSearch", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
    /**
     * Set the search query
     */
    value: {
        type: StringConstructor;
        required: false;
        default: any;
    };
    /**
     * The icon to be displayed
     */
    icon: {
        type: StringConstructor;
        required: false;
        default: string;
    };
    /**
     * Informative placeholder about the data to be entered
     */
    placeholder: {
        type: StringConstructor;
        required: false;
        default: string;
    };
    /**
     * Informative label about the data to be entered
     */
    label: {
        type: StringConstructor;
        required: true;
        default: string;
    };
    /**
     * Indicator if the search bar should be of smaller size
     */
    small: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Determine the button text
     */
    buttonLabel: {
        type: StringConstructor[];
        required: false;
        default: string;
    };
    /**
     * Determine the button visibility
     */
    buttonHidden: {
        type: BooleanConstructor[];
        required: false;
        default: boolean;
    };
    /**
     * If set to true the search event is triggered on each entered character
     */
    typeAhead: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * automatically trim whitespaces around search term
     */
    trimQuery: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * If set to true data is loaded and the user cannot enter further data
     */
    loading: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * If set to true the search landmark role is removed since it's not the page's main search function anymore
     */
    isFilter: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * The aria-label for the loading spinner
     */
    loadingAccessibleLabel: {
        type: StringConstructor;
        required: false;
        default: string;
    };
    /**
     * Show a "cancel" button next to the search bar.
     */
    showCancelButton: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Variation of the cancel button
     */
    cancelButtonVariation: {
        type: StringConstructor;
        required: false;
        default: string;
        validator: (value: string) => boolean;
    };
    /**
     * Appearance of the cancel button
     */
    cancelButtonAppearance: {
        type: StringConstructor;
        required: false;
        default: string;
        validator: (value: string) => boolean;
    };
    /**
     * Handler function for when the cancel button is clicked.
     */
    cancelHandler: {
        type: FunctionConstructor;
        required: false;
        default: () => void;
    };
}>> & Readonly<{
    onInput?: (...args: any[]) => any;
    onKeyup?: (...args: any[]) => any;
    onClear?: (...args: any[]) => any;
    onSearch?: (...args: any[]) => any;
    onAdvancedSearch?: (...args: any[]) => any;
}>, {
    label: string;
    small: boolean;
    value: string;
    icon: string;
    loading: boolean;
    placeholder: string;
    buttonLabel: string;
    buttonHidden: boolean;
    typeAhead: boolean;
    trimQuery: boolean;
    isFilter: boolean;
    loadingAccessibleLabel: string;
    showCancelButton: boolean;
    cancelButtonVariation: string;
    cancelButtonAppearance: string;
    cancelHandler: Function;
}, {}, {
    OcButton: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
        type: {
            type: StringConstructor;
            default: string;
            validator: (value: any) => boolean;
        };
        disabled: {
            type: BooleanConstructor;
            default: boolean;
        };
        size: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        href: {
            type: StringConstructor;
            default: any;
        };
        target: {
            type: StringConstructor;
            default: any;
            validator: (value: string) => boolean;
        };
        to: {
            type: import('vue').PropType<import('vue-router').RouteLocationRaw>;
            default: any;
        };
        ariaLabel: {
            type: StringConstructor;
            default: any;
        };
        submit: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        variation: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        appearance: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        justifyContent: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        gapSize: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        showSpinner: {
            type: BooleanConstructor;
            default: boolean;
        };
    }>, {}, {}, {
        $_ocButton_buttonClass(): string[];
        additionalAttributes(): {
            disabled: boolean;
            type: string;
            to: import('vue-router').RouteLocationRaw;
            target: string;
            href: string;
        };
        handlers(): {
            click: (event: MouseEvent) => void;
        };
    }, {
        $_ocButton_onClick(event: MouseEvent): void;
    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "click"[], "click", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
        type: {
            type: StringConstructor;
            default: string;
            validator: (value: any) => boolean;
        };
        disabled: {
            type: BooleanConstructor;
            default: boolean;
        };
        size: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        href: {
            type: StringConstructor;
            default: any;
        };
        target: {
            type: StringConstructor;
            default: any;
            validator: (value: string) => boolean;
        };
        to: {
            type: import('vue').PropType<import('vue-router').RouteLocationRaw>;
            default: any;
        };
        ariaLabel: {
            type: StringConstructor;
            default: any;
        };
        submit: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        variation: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        appearance: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        justifyContent: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        gapSize: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        showSpinner: {
            type: BooleanConstructor;
            default: boolean;
        };
    }>> & Readonly<{
        onClick?: (...args: any[]) => any;
    }>, {
        type: string;
        size: string;
        variation: string;
        target: string;
        disabled: boolean;
        href: string;
        to: import('vue-router').RouteLocationRaw;
        ariaLabel: string;
        submit: string;
        appearance: string;
        justifyContent: string;
        gapSize: string;
        showSpinner: boolean;
    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    OcGrid: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
        gutter: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        flex: {
            type: BooleanConstructor[];
            default: boolean;
        };
    }>, {}, {}, {
        classes(): any[];
    }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
        gutter: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        flex: {
            type: BooleanConstructor[];
            default: boolean;
        };
    }>> & Readonly<{}>, {
        flex: boolean;
        gutter: string;
    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    OcIcon: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
        name: {
            type: StringConstructor;
            default: string;
        };
        fillType: {
            type: StringConstructor;
            required: false;
            default: string;
            validator: (value: string) => boolean;
        };
        accessibleLabel: {
            type: StringConstructor;
            default: string;
        };
        type: {
            type: StringConstructor;
            default: string;
        };
        size: {
            type: StringConstructor;
            default: string;
            validator: (value: unknown) => boolean;
        };
        variation: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        color: {
            type: StringConstructor;
            required: false;
            default: string;
        };
    }>, {}, {}, {
        svgTitleId(): string;
        nameWithFillType(): string;
    }, {
        sizeClass(c: string): string;
        variationClass(c: string): string;
        prefix(string: string): string;
        transformSvgElement(svg: SVGElement): SVGElement;
    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "loaded"[], "loaded", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
        name: {
            type: StringConstructor;
            default: string;
        };
        fillType: {
            type: StringConstructor;
            required: false;
            default: string;
            validator: (value: string) => boolean;
        };
        accessibleLabel: {
            type: StringConstructor;
            default: string;
        };
        type: {
            type: StringConstructor;
            default: string;
        };
        size: {
            type: StringConstructor;
            default: string;
            validator: (value: unknown) => boolean;
        };
        variation: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
        color: {
            type: StringConstructor;
            required: false;
            default: string;
        };
    }>> & Readonly<{
        onLoaded?: (...args: any[]) => any;
    }>, {
        name: string;
        type: string;
        fillType: string;
        accessibleLabel: string;
        size: string;
        variation: string;
        color: string;
    }, {}, {
        InlineSvg: import('vue').DefineComponent<import('vue-inline-svg').InlineSvgProps, unknown, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, import('vue-inline-svg').InlineSvgProps>;
    }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    OcSpinner: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
        ariaLabel: {
            type: StringConstructor;
            required: false;
            default: string;
        };
        size: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
    }>, {}, {}, {
        $_ocSpinner_class(): string[];
    }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
        ariaLabel: {
            type: StringConstructor;
            required: false;
            default: string;
        };
        size: {
            type: StringConstructor;
            default: string;
            validator: (value: string) => boolean;
        };
    }>> & Readonly<{}>, {
        size: string;
        ariaLabel: string;
    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
export default _default;