"use client"; import { Autocomplete as AutocompletePrimitive } from "@base-ui/react/autocomplete"; import { ChevronsUpDownIcon, XIcon } from "lucide-react"; import type React from "react"; import { cn } from "@/registry/default/lib/utils"; import { Input } from "@/registry/default/ui/input"; import { ScrollArea } from "@/registry/default/ui/scroll-area"; export const Autocomplete: typeof AutocompletePrimitive.Root = AutocompletePrimitive.Root; export function AutocompleteInput({ className, showTrigger = false, showClear = false, startAddon, size, triggerProps, clearProps, ...props }: Omit & { showTrigger?: boolean; showClear?: boolean; startAddon?: React.ReactNode; size?: "sm" | "default" | "lg" | number; ref?: React.Ref; triggerProps?: AutocompletePrimitive.Trigger.Props; clearProps?: AutocompletePrimitive.Clear.Props; }): React.ReactElement { const sizeValue = (size ?? "default") as "sm" | "default" | "lg" | number; return ( {startAddon && ( )} } {...props} /> {showTrigger && ( )} {showClear && ( )} ); } export function AutocompletePopup({ className, children, side = "bottom", sideOffset = 4, alignOffset, align = "start", anchor, portalProps, ...props }: AutocompletePrimitive.Popup.Props & { align?: AutocompletePrimitive.Positioner.Props["align"]; sideOffset?: AutocompletePrimitive.Positioner.Props["sideOffset"]; alignOffset?: AutocompletePrimitive.Positioner.Props["alignOffset"]; side?: AutocompletePrimitive.Positioner.Props["side"]; anchor?: AutocompletePrimitive.Positioner.Props["anchor"]; portalProps?: AutocompletePrimitive.Portal.Props; }): React.ReactElement { return ( {children} ); } export function AutocompleteItem({ className, children, ...props }: AutocompletePrimitive.Item.Props): React.ReactElement { return ( {children} ); } export function AutocompleteSeparator({ className, ...props }: AutocompletePrimitive.Separator.Props): React.ReactElement { return ( ); } export function AutocompleteGroup({ className, ...props }: AutocompletePrimitive.Group.Props): React.ReactElement { return ( ); } export function AutocompleteGroupLabel({ className, ...props }: AutocompletePrimitive.GroupLabel.Props): React.ReactElement { return ( ); } export function AutocompleteEmpty({ className, ...props }: AutocompletePrimitive.Empty.Props): React.ReactElement { return ( ); } export function AutocompleteRow({ className, ...props }: AutocompletePrimitive.Row.Props): React.ReactElement { return ( ); } export function AutocompleteValue({ ...props }: AutocompletePrimitive.Value.Props): React.ReactElement { return ( ); } export function AutocompleteList({ className, ...props }: AutocompletePrimitive.List.Props): React.ReactElement { return ( ); } export function AutocompleteClear({ className, ...props }: AutocompletePrimitive.Clear.Props): React.ReactElement { return ( ); } export function AutocompleteStatus({ className, ...props }: AutocompletePrimitive.Status.Props): React.ReactElement { return ( ); } export function AutocompleteCollection({ ...props }: AutocompletePrimitive.Collection.Props): React.ReactElement { return ( ); } export function AutocompleteTrigger({ className, children, ...props }: AutocompletePrimitive.Trigger.Props): React.ReactElement { return ( {children} ); } export const useAutocompleteFilter: typeof AutocompletePrimitive.useFilter = AutocompletePrimitive.useFilter; export { AutocompletePrimitive };

Autocomplete

Instalação

Dependências

Registry dependencies