Select

Input where a user must select from a list of options. Usually used when there is a huge list of options (otherwise a Radio would suffice).

	
selected: 
	
PropTypeDescription
labelstringRequired Select label
namestringSelect name attribute
idstringHTML id attribute
options{label: string, value: any}[]Array of options
bind:valueanyTwo-way binding for state
<script lang="ts">
import Select from '../components/select.svelte';

let value = '';
</script>

<Select
  label="Select a country"
  bind:value
  name="country"
  options={[
    {label: 'Argentina',      value: 'ar'},
    {label: 'Brazil',         value: 'br'},
    {label: 'Cambodia',       value: 'kh'},
    {label: 'Canada',         value: 'ca'},
    {label: 'Chile',          value: 'cl'},
    {label: 'China',          value: 'cn'},
    {label: 'Colombia',       value: 'co'},
    {label: 'Greece',         value: 'gr'},
    {label: 'India',          value: 'in'},
    {label: 'Ireland',        value: 'ie'},
    {label: 'Japan',          value: 'jp'},
    {label: 'Kenya',          value: 'ke'},
    {label: 'Mexico',         value: 'mx'},
    {label: 'Panama',         value: 'pa'},
    {label: 'Rwanda',         value: 'rw'},
    {label: 'Serbia',         value: 'rs'},
    {label: 'Thailand',       value: 'th'},
    {label: 'United Kingdom', value: 'uk'},
    {label: 'United States',  value: 'us'},
  ]}
/>

<pre>
  <code>
selected: {value}
  </code>
</pre>