Basic Components
Dropdown Selector
The dropdown selector component provides a way to select values from a predefined list of options, supporting custom triggers and alignment.
Usage Examples
Basic Usage
The most basic dropdown selector usage for selecting values from predefined options.
300px
Alignment
Use the alignment property to set the dropdown menu alignment: left (left-aligned), right (right-aligned).
300px
Custom Width
Use the width property to customize the dropdown selector width.
300px
Icon Mode
Icon mode is suitable for mobile devices, showing only icons without text labels.
300px
Properties
| Property | Basic component module for translation keys shared across all component documentation pages | Type | Default |
|---|---|---|---|
| options | Dropdown options array | array | [] |
| alignment | Dropdown menu alignment | string | left |
| width | Dropdown selector width | string | w-48 |
| icon-mode | Whether to enable icon mode | boolean | false |
| icon | Icon displayed in icon mode | string | |
| display-label | Custom display label | string |
Design Empowers, Innovation Unlimited