/**
 * SearchBar Component
 *
 * Interactive search input component with query suggestions support.
 *
 * ## Usage modes
 *
 * 1. **Full bundle** — SearchBar inside SearchProvider, inline dropdown enabled (default):
 *    ```tsx
 *    <SearchProvider client={client}>
 *      <SearchBar />
 *    </SearchProvider>
 *    ```
 *
 * 2. **Standalone (controlled)** — no suggestions fetch, no internal state drives the input:
 *    ```tsx
 *    <SearchBar value={query} onChange={setQuery} inlineDropdown={false} />
 *    ```
 *
 * 3. **Standalone (navigate)** — input only, Enter navigates to configurable URL:
 *    ```tsx
 *    <SearchBar
 *      inlineDropdown={false}
 *      submitMode="navigate"
 *      searchResultsUrl="/search?q="
 *    />
 *    ```
 *
 * 4. **Truly minimal** — no Seekora dependencies whatsoever (see SearchInput):
 *    ```tsx
 *    <SearchInput value={query} onChange={setQuery} onSubmit={handleSubmit} />
 *    ```
 */
import React from "react";
import type { SearchOptions } from "@seekora-ai/search-sdk";
export type SearchBarSize = "small" | "medium" | "large";
export interface SearchBarTheme {
    container?: string;
    input?: string;
    inputFocused?: string;
    suggestionsContainer?: string;
    suggestionItem?: string;
    suggestionItemHover?: string;
    suggestionItemActive?: string;
    searchIcon?: string;
    clearButton?: string;
    submitButton?: string;
}
export interface SearchBarProps {
    placeholder?: string;
    showSuggestions?: boolean;
    debounceMs?: number;
    minQueryLength?: number;
    maxSuggestions?: number;
    onSearch?: (query: string, results: any) => void;
    onQueryChange?: (query: string) => void;
    onSuggestionSelect?: (suggestion: string) => void;
    onSearchStateChange?: (state: {
        results: any;
        loading: boolean;
        error: Error | null;
    }) => void;
    searchOptions?: Omit<SearchOptions, "q">;
    className?: string;
    style?: React.CSSProperties;
    theme?: SearchBarTheme;
    renderSuggestion?: (suggestion: string, index: number) => React.ReactNode;
    /** Custom render for the search icon. If not provided, a default magnifying glass SVG is rendered. */
    renderSearchIcon?: () => React.ReactNode;
    /** Whether to show a clear button when the query is non-empty (default: true) */
    showClearButton?: boolean;
    /** Custom render for the clear icon */
    renderClearIcon?: () => React.ReactNode;
    /** Whether to show a submit button to the right of the input (default: false) */
    showSubmitButton?: boolean;
    /** Custom render for the submit button */
    renderSubmitButton?: () => React.ReactNode;
    /** Size variant controlling padding and font size (default: 'medium') */
    size?: SearchBarSize;
    /** Trigger search automatically as user types, with debounce (default: false).
     *  When true, uses `debounceMs` for the delay. Enter still triggers immediately. */
    searchAsYouType?: boolean;
    /**
     * When true (default), SearchBar renders its own inline suggestions dropdown.
     * Set to false when the consumer mounts a standalone QuerySuggestionsDropdown
     * alongside this component to avoid rendering two dropdowns simultaneously.
     */
    inlineDropdown?: boolean;
    /**
     * Pass the ref of an external standalone dropdown (e.g. QuerySuggestionsDropdown)
     * that the consumer has wired alongside this SearchBar. Used in dev mode to
     * warn when both inlineDropdown is true AND an external dropdown ref is provided,
     * which would result in two simultaneous dropdowns.
     */
    externalDropdownRef?: React.RefObject<unknown>;
    /**
     * How Enter key / submit button behaves (default: 'spa').
     * - 'spa': calls onSearch(query) and prevents any ancestor form submission.
     * - 'navigate': does not preventDefault — lets an ancestor <form action="...">
     *   submit naturally. Falls back to window.location.href navigation if no
     *   ancestor form is present.
     */
    submitMode?: "spa" | "navigate";
    /**
     * Controlled value for the search input. When provided, the input text is
     * driven externally rather than by the internal SearchStateManager query.
     * Must be paired with `onChange` to keep the value in sync.
     */
    value?: string;
    /**
     * Called whenever the user types, clears, or otherwise changes the input.
     * Receives the new string value. In controlled mode (value prop provided),
     * this is the only way the consumer learns of user keystrokes — internal
     * state is NOT updated.
     */
    onChange?: (next: string) => void;
    /**
     * URL prefix used when submitMode='navigate' and no ancestor <form> is present.
     * The encoded query is appended verbatim: `searchResultsUrl + encodeURIComponent(query)`.
     * Default: "/search?q="
     * Example: pass "/find?query=" for storefronts that use a different search route.
     */
    searchResultsUrl?: string;
}
export declare const SearchBar: React.FC<SearchBarProps>;
//# sourceMappingURL=SearchBar.d.ts.map