ComboboxInput() — ui Function Reference

Architecture documentation for the ComboboxInput() function in combobox.tsx from the ui codebase.

Function tsx ComponentRegistry ChartRegistry

Entity Profile

ComponentRegistry→ ChartRegistry→ ComboboxInput() — ui Function Reference

Dependency Diagram

graph TD
  e9e7989a_4890_4580_8e98_ec9641832e5c["ComboboxInput()"]
  1a6296a3_162d_d8cc_b69b_ee8d2255b8cd["combobox.tsx"]
  e9e7989a_4890_4580_8e98_ec9641832e5c -->|defined in| 1a6296a3_162d_d8cc_b69b_ee8d2255b8cd
  style e9e7989a_4890_4580_8e98_ec9641832e5c fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/registry/new-york-v4/ui/combobox.tsx lines 55–90

function ComboboxInput({
  className,
  children,
  disabled = false,
  showTrigger = true,
  showClear = false,
  ...props
}: ComboboxPrimitive.Input.Props & {
  showTrigger?: boolean
  showClear?: boolean
}) {
  return (
    <InputGroup className={cn("w-auto", className)}>
      <ComboboxPrimitive.Input
        render={<InputGroupInput disabled={disabled} />}
        {...props}
      />
      <InputGroupAddon align="inline-end">
        {showTrigger && (
          <InputGroupButton
            size="icon-xs"
            variant="ghost"
            asChild
            data-slot="input-group-button"
            className="group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent"
            disabled={disabled}
          >
            <ComboboxTrigger />
          </InputGroupButton>
        )}
        {showClear && <ComboboxClear disabled={disabled} />}
      </InputGroupAddon>
      {children}
    </InputGroup>
  )
}