Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA select where unavailable options stay in the list, dimmed, with the reason written under them instead of silently disappearing.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use this when availability depends on something the person can change or should know: plan, location, time of day, stock.
Do not use it for options that will never be available. Remove those.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
label | string | - | Visible label. |
options | { value, label, disabledReason? }[] | - | A disabledReason disables the option and explains it. |
value / onValueChange | string / fn | - | Controlled value. |
aria-disabled and cannot be chosen by pointer or keyboard.| Key | Action |
|---|---|
| Arrow keys | skip disabled options |
| Enter | chooses an available option |
The pattern ships a Testing Library test (select-disabled-reasons.test.tsx) that covers reasons as text, disabled options not selectable and choosing an available one.