Select

A trigger that reads as a field, and a list whose chosen row carries a lit left edge.

Installation

npx shadcn@latest add @afterglow/select

Composition

Component structure.

Select
├── SelectTrigger
│   └── SelectValue
└── SelectContent
    ├── SelectGroup
    │   ├── SelectLabel
    │   └── SelectItem
    ├── SelectSeparator
    ├── SelectScrollUpButton
    └── SelectScrollDownButton

API Reference

A label has to sit inside its SelectGroup. Base UI throws when it does not, and it throws at open time rather than at compile time.

SelectTrigger

Prop	Type	Default
size	"default" \| "sm"	"default"

SelectContent

Base UI's Portal, Positioner and Popup in one part, so the list is one element at the call site rather than three.

Everything else is Base UI select's API, documented there.