/** * @usevyre/react — Combobox * * AI CONTEXT: * ┌─────────────────────────────────────────────────────────┐ * │ Component: Combobox │ * │ Import: import { Combobox } from "@usevyre/react" │ * │ │ * │ Props: │ * │ options = { value: string; label: string; │ * │ disabled?: boolean }[] │ * │ value = string | null (controlled) │ * │ onChange = (value: string | null) => void │ * │ placeholder = string │ * │ disabled = boolean │ * │ size = "sm"|"md"(default)|"lg" │ * │ emptyText = string (default: "No results") │ * │ disablePortal = boolean (default: false) — render the │ * │ dropdown inline instead of portaling │ * │ it to . Portaling (default) keeps │ * │ the dropdown visible inside Modal / │ * │ overflow:hidden containers. │ * │ │ * │ Behavior: │ * │ Click input → show all options │ * │ Type → filter by case-insensitive contains │ * │ Select → close, update value, clear search │ * │ Escape → close dropdown │ * │ Click outside → close dropdown │ * │ ArrowUp/Down → keyboard navigation │ * │ Enter → select highlighted option │ * │ │ * │ Differs from Select: has searchable text input │ * │ Differs from Command: single-value pick, not palette │ * └─────────────────────────────────────────────────────────┘ * * @example * const [lang, setLang] = useState(null); * * * // Clear selection * setVal(v)} options={options} /> * // Pass null to onChange to clear */ import React from "react"; import type { BaseProps } from "../../types"; type ComboboxSize = "sm" | "md" | "lg"; export interface ComboboxOption { value: string; label: string; disabled?: boolean; } export interface ComboboxProps extends Omit, "onChange">, BaseProps { options: ComboboxOption[]; value: string | null; onChange: (value: string | null) => void; placeholder?: string; disabled?: boolean; size?: ComboboxSize; emptyText?: string; /** * Render the dropdown inline inside the component instead of teleporting it * to . Default false: the dropdown portals to body so it stays visible * inside Modal / overflow:hidden containers (issue #18). */ disablePortal?: boolean; } export declare const Combobox: React.ForwardRefExoticComponent>; export {};