Select

A select is a form control that allows users to select an option from a list of options.

Import

import { Select } from "@aeonkit/react";

Usage

Default

Uses the native select element to render a dropdown list.

Preview

Pick a US CityChicagoNew YorkSan FranciscoSeattleHoustonLos AngelesMiami

Code

<div className="flex flex-col gap-1 w-72">
  <Label htmlFor="city">Pick a US City</Label>
  <Select id="city" defaultValue="houston" className="w-full max-w-xs">
    <option value="chicago">Chicago</option>
    <option value="new-york">New York</option>
    <option value="san-francisco">San Francisco</option>
    <option value="seattle">Seattle</option>
    <option value="houston">Houston</option>
    <option value="los-angeles">Los Angeles</option>
    <option value="miami">Miami</option>
  </Select>
</div>

Props

Select

API Interface: SelectProps