Select
A wrapper component arround native HTML select.
View source
<script lang="ts">
import { Select } from 'svxui';
const options = ['option1', 'option2', 'option3', 'option4', 'option5']
</script>
<Select {options} />
API Reference
Property | Type | Default | Description |
---|---|---|---|
color | string | number | symbol | "neutral" | Select color |
elementRef $bindable | HTMLSelectElement | Rendered DOM element | |
fullWidth | boolean | false | Select full size |
options required | SelectOption[] | string[] | number[] | "[]" | Select options |
radius | union | Select radius | |
resolveLabel | SelectOptionResolver | Resolve label fron SelectOption object | |
resolveValue | SelectOptionResolver | Resolve value of option | |
selectSize | number | null | "4" | Native html size |
size | union | "2" | Select size |
Type Definitions
export type SelectOption = {
label: string | number;
value: string | number;
disabled?: boolean | undefined;
};
export type SelectOptionResolver = <T>(item: T) => string | number;