COMPONENTS // FORM CONTROLS
Select
Blueprint Schematic styled custom select dropdown primitive, featuring form-field height matching (48px), integrated labels, color badges, and floating glassmorphism menu.
1. Form Field Select (With Label & Color Dots)
Form Field Select
Matches InputField height (48px) with integrated label and indicator dots.SCHEDULE CATEGORY
Selected: skills
2. Medium Select
Role Select
Select user account role3. Small Compact Select
Compact Status Select
Ideal for data tables and compact filter barsAPI Properties (Props API)
| Property | Type | Default | Description |
|---|---|---|---|
| label | string | '' | Label displayed above dropdown trigger |
| items | SelectOption[] | [] | Array of select options { value, label, color?, disabled? } |
| value | string | '' | Selected value (supports bind:value) |
| size | 'field' | 'md' | 'sm' | 'field' | Height dimensions (field = 48px matching InputField, md = medium, sm = compact) |
| placeholder | string | 'Chọn...' | Placeholder hint text when unselected |
| name | string | undefined | undefined | Underlying form field name |
| disabled | boolean | false | Disables dropdown interaction |