<template name="baseSelect">
    <select
        id="{{this.id}}"
        class="{{this.class}}"
        name="{{this.name}}"
        multiple="{{#if this.multiple}}multiple{{/if}}"
        disabled="{{#if this.disabled}}disabled{{/if}}"
        {{this.tagAttributes}}
    >
        {{>UI.contentBlock}}
        {{>baseSelectOptions this.items}}
    </select>
</template>

<template name="baseSelectOptions">
    {{#each item in (reactive this)}}
        {{#if item.items}}
            <optgroup label="{{item.label}}">
                {{>baseSelectOptions item.items}}
            </optgroup>
        {{else}}
            <option
                value="{{item.value}}"
                selected="{{#if eq item.value (reactive this.value)}}selected{{/if}}"
            >{{item.label}}</option>
        {{/if}}
    {{/each}}
</template>
