Select

PreviousNext

Searchable Base UI combobox with rich options, validation states, and refined popup motion.

Choose the role closest to your work.

Installation

pnpm dlx shadcn@latest add https://matos-ui.com/r/select.json

Usage

import { Select } from "@/components/matos-ui/select"

<Select
  label="Role"
  options={[
    { value: "design", label: "Design", description: "Product and systems" },
    { value: "engineering", label: "Engineering" },
  ]}
  value={role}
  onValueChange={setRole}
  error={errors.role?.message}
/>

Select behaves like a compact command menu: opening it focuses a search field inside the popup, where users can filter options, navigate matches with the keyboard, and select with Enter. It supports option icons and descriptions, disabled, direct integration with a React Hook Form Controller, an emptyMessage, and custom searchText for options whose labels are not plain strings.

Password InputTextarea