Anex UI logoAnex UI
npm install anexui
Documentation

Documentation

Select

A styled native <select> dropdown with placeholder and error state.

Preview

Usage

import { Select } from "anexui";

<Select>
  <option value="react">React</option>
  <option value="vue">Vue</option>
  <option value="svelte">Svelte</option>
</Select>
Copy code

Placeholder

<Select placeholder="Choose a framework">
  <option value="react">React</option>
  <option value="vue">Vue</option>
</Select>
Copy code

Error state

<Select error placeholder="Select an option" aria-describedby="sel-err">
  <option value="a">Option A</option>
</Select>
<p id="sel-err">Please select an option.</p>
Copy code

Disabled

<Select disabled>
  <option>Unavailable</option>
</Select>
Copy code

With label

import { Label, Select } from "anexui";

<Label htmlFor="framework">Framework</Label>
<Select id="framework" placeholder="Pick one">
  <option value="react">React</option>
  <option value="vue">Vue</option>
</Select>
Copy code

Props

| Prop | Type | Default | Description | |---|---|---|---| | error | boolean | false | Sets aria-invalid, applies error styling | | placeholder | string | — | Renders a disabled first option as a hint | | disabled | boolean | false | Disables the select |

All standard HTML <select> attributes are accepted.

Accessibility