import * as react from 'react'; import { DetailedHTMLProps, HTMLAttributes, InputHTMLAttributes, ReactNode, MouseEventHandler, ChangeEventHandler, SetStateAction } from 'react'; import * as react_jsx_runtime from 'react/jsx-runtime'; type ColorScheme = "auto" | "light" | "dark"; type WithStyle = T & { noStyle?: boolean; }; declare namespace ForwardProps { interface PropMap { div: DetailedHTMLProps, HTMLDivElement>; input: DetailedHTMLProps, HTMLInputElement>; span: DetailedHTMLProps, HTMLSpanElement>; } interface ElementMap { div: HTMLDivElement; input: HTMLInputElement; span: HTMLSpanElement; } type Kind = keyof PropMap; } type ForwardProps = keyof O extends never ? ForwardProps.PropMap[E] : Extract extends never ? ForwardProps.PropMap[E] & O : Omit & O; type OptionInput = { id: string; data?: Data; }; type OptionConfig = WithStyle & { /** * Provide a custom comparison function for the option's data. * Prevents unecessary re-renders when the data has not changed. * Performs a shallow equality check by default. */ compare?(a: Data, b: Data): boolean; }>; type OptionProps = ForwardProps<"div", OptionConfig>; type Option = OptionInput & { node: HTMLDivElement; }; declare const Option: (props: OptionProps) => JSX.Element; type OptionMap = Record>; interface Options { list: Option[]; map: OptionMap; ids: string[]; } interface Ids { dialog: string | null; input: string | null; listbox: string | null; } interface Nodes { dialog: HTMLDivElement | null; input: HTMLInputElement | null; listbox: HTMLDivElement | null; panel: HTMLDivElement | null; } interface SearchState { ids: Ids; nodes: Nodes; options: Options; selected: Option | null; } type ContextCallback = (...args: [...Params, search: Search]) => void | Promise; type Callback = (...args: A) => void | Promise; type KeyDownCallback = Callback<[ e: KeyboardEvent, search: Search ]>; type SubmitCallback = Callback<[ option: Option, search: Search ]>; type ChangeCallback = Callback<[ option: Option | null, search: Search ]>; type CloseCallback = Callback<[search: Search]>; type OpenCallback = Callback<[search: Search]>; interface SearchProps extends WithStyle { open?: boolean; setOpen?(open: boolean): void; children?: ReactNode; colorScheme?: ColorScheme; /** * Custom callback to handle the submission of an option. An option is submitted when a user: * - Clicks on an option * - Presses the `Enter` key while an option is selected */ onSubmit?: SubmitCallback; /** * Custom callback to handle changes to the selected option. This callback is called whenever an option is selected or unselected, which can occur when a user: * - Hovers over an option * - Navigates via the keyboard: `ArrowUp`, `ArrowDown`, `Home`, `End` */ onChange?: ChangeCallback; /** * Apply your own logic to handle keydown events. * * To cancel the default behavior, run `e.preventDefault()`. */ onKeyDown?: KeyDownCallback; onClose?: CloseCallback; onOpen?: OpenCallback; } interface Search extends SearchState { isOpen: boolean; isVisible: boolean; setOpen(open: boolean): void; close(): void; open(): void; select(id: string): void; unselect(id?: string): void; submit(id: string): Promise; } declare function Search({ open: propOpen, setOpen: setPropOpen, children, noStyle, colorScheme, onSubmit, onChange, onKeyDown, onClose, onOpen, }: SearchProps): JSX.Element; declare const useSearch: () => Search; interface TriggerChildProps { "aria-haspopup": boolean; "aria-expanded": boolean; "aria-controls"?: string; "data-opens"?: string; onClick: MouseEventHandler; } type TriggerChildCallback = (props: TriggerChildProps) => ReactNode; type TriggerChildren = ReactNode | TriggerChildCallback; type TriggerProps = { children?: TriggerChildren; }; declare const Trigger: ({ children }: TriggerProps) => react_jsx_runtime.JSX.Element; type PortalOptions = WithStyle<{ container?: Element | DocumentFragment; /** Optionally pass through a render function. It will only be called when the search modal is open, which can improve performance. */ children?: ReactNode | ((search: Search) => ReactNode); }>; type PortalProps = ForwardProps<"div", PortalOptions>; declare const Portal: (props: Omit, HTMLDivElement>, "children" | "noStyle" | "container"> & { container?: Element | DocumentFragment; /** Optionally pass through a render function. It will only be called when the search modal is open, which can improve performance. */ children?: ReactNode | ((search: Search) => ReactNode); } & { noStyle?: boolean; }) => JSX.Element; type PanelOptions = WithStyle<{}>; type PanelProps = ForwardProps<"div", PanelOptions>; declare const Panel: (props: react.ClassAttributes & react.HTMLAttributes & { noStyle?: boolean; }) => JSX.Element; type BackdropOptions = WithStyle<{}>; type BackdropProps = ForwardProps<"span", BackdropOptions>; declare const Backdrop: (props: react.ClassAttributes & react.HTMLAttributes & { noStyle?: boolean; }) => JSX.Element; type InputOptions = WithStyle<{ label?: string | null | false; placeholder?: string | null | false; autoFocus?: boolean; }>; type InputProps = ForwardProps<"input", InputOptions>; declare const Input: (props: Omit, HTMLInputElement>, "placeholder" | "autoFocus" | "noStyle" | "label"> & { label?: string | null | false; placeholder?: string | null | false; autoFocus?: boolean; } & { noStyle?: boolean; }) => JSX.Element; type ResultsOptions = WithStyle<{ /** * The default behavior will 'hide' the listbox when there are no options visible. * It will still be visible to screen readers. */ noHide?: boolean; }>; type ResultsProps = ForwardProps<"div", ResultsOptions>; declare const Results: (props: react.ClassAttributes & react.HTMLAttributes & { /** * The default behavior will 'hide' the listbox when there are no options visible. * It will still be visible to screen readers. */ noHide?: boolean; } & { noStyle?: boolean; }) => JSX.Element; type ContainerOptions = WithStyle<{ noOverflow?: boolean; }>; type ContainerProps = ForwardProps<"div", ContainerOptions>; declare const Container: (props: react.ClassAttributes & react.HTMLAttributes & { noOverflow?: boolean; } & { noStyle?: boolean; }) => JSX.Element; declare function Consumer({ children, }: { children?: ReactNode | ((search: Search) => ReactNode | void); }): react_jsx_runtime.JSX.Element; interface QueryOptions { debounce?: Debounce; format?(query: string): string; initialItems?: I[]; } interface QueryInputProps { value: string; onChange: ChangeEventHandler; } type Query = { items: I[]; query: string; setQuery(action: SetStateAction): void; inputProps: QueryInputProps; isLoading: boolean; isFetching: boolean; isWaiting: boolean; isNotFound: boolean; isStale: boolean; isError: boolean; error?: unknown; /** Clears the query and resets the search state. */ reset(): void; }; type DynamicDebounce = (query: string) => number; type Debounce = number | DynamicDebounce; declare const useQuery: (getItems: (query: string) => Promise | Item[], options?: QueryOptions) => Query; export { Backdrop, type BackdropOptions, type BackdropProps, type Callback, type ChangeCallback, type CloseCallback, type ColorScheme, Consumer, Container, type ContainerOptions, type ContainerProps, type ContextCallback, type Debounce, type DynamicDebounce, ForwardProps, type Ids, Input, type InputOptions, type InputProps, type KeyDownCallback, type Nodes, type OpenCallback, Option, type OptionConfig, type OptionInput, type OptionMap, type OptionProps, type Options, Panel, type PanelOptions, type PanelProps, Portal, type PortalOptions, type PortalProps, type Query, type QueryInputProps, type QueryOptions, Results, type ResultsOptions, type ResultsProps, Search as Root, Search, type SearchProps, type SubmitCallback, Trigger, type TriggerChildCallback, type TriggerChildProps, type TriggerChildren, type TriggerProps, type WithStyle, useQuery, useSearch };