Icon Picker
Searchable picker for choosing an icon from the project's icon sets (hugeicons + lucide). Stores the icon name as a string.
Default
Click to open the picker dialog, then search and select.
With value
Bind v-model to a preset icon name to start with a selection.
Custom prefix
Restrict the search to a single icon set with the prefix prop.
API Reference
Props, events, and slots for each sub-component.
IconPicker
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| modelValue | string | null | null | Selected icon name. Supports v-model. |
| prefix | string | "hugeicons,lucide" | Comma-separated icon set prefixes to search. |
| placeholder | string | "Pick an icon" | Trigger button label when no icon is selected. |
| disabled | boolean | false | Disable the trigger. |
| popular | string[] | — | Icon names shown before any search query. |
Events
| Event | Description |
|---|---|
| update:modelValue | Fires with the chosen icon name (or null). Enables v-model. |