Single-select

<jv-single-select label="Favoritfrukt">
  <select id="select_medium">
    <option value="">-- Inget valt --</option>
    <option>Ananas</option>
    <option>Apelsin</option>
    <option>Banan</option>
    <option>Blodapelsin</option>
    <option>Clementin</option>
    <option>Dadel</option>
    <option>Kiwifrukt</option>
    <option>Päron</option>
    <option>Äpple</option>
  </select>
</jv-single-select>

<jv-single-select label="Favoritfrukt" size="small">
  <select id="select_small">
    <option value="">-- Inget valt --</option>
    <option>Ananas</option>
    <option>Apelsin</option>
    <option>Banan</option>
    <option>Blodapelsin</option>
    <option>Clementin</option>
    <option>Dadel</option>
    <option>Kiwifrukt</option>
    <option>Päron</option>
    <option>Äpple</option>
  </select>
</jv-single-select>

<jv-single-select label="Favoritfrukt">
  <select id="select_required" required="">
    <option value="">-- Inget valt --</option>
    <option>Ananas</option>
    <option>Apelsin</option>
    <option>Banan</option>
    <option>Blodapelsin</option>
    <option>Clementin</option>
    <option>Dadel</option>
    <option>Kiwifrukt</option>
    <option>Päron</option>
    <option>Äpple</option>
  </select>
</jv-single-select>

<jv-single-select error-text="Välj en frukt" label="Favoritfrukt" required="" valid="false">
  <select id="select_error">
    <option value="">-- Inget valt --</option>
    <option>Ananas</option>
    <option>Apelsin</option>
    <option>Banan</option>
    <option>Blodapelsin</option>
    <option>Clementin</option>
    <option>Dadel</option>
    <option>Kiwifrukt</option>
    <option>Päron</option>
    <option>Äpple</option>
  </select>
</jv-single-select>

<jv-single-select help-text-ref="helptext" label="Favoritfrukt">
  <span class="label__description" slot="helptext">Den frukt du köper oftast</span>
  <select id="select_statisk">
    <option value="">-- Inget valt --</option>
    <option>Ananas</option>
    <option>Apelsin</option>
    <option>Banan</option>
    <option>Blodapelsin</option>
    <option>Clementin</option>
    <option>Dadel</option>
    <option>Kiwifrukt</option>
    <option>Päron</option>
    <option>Äpple</option>
  </select>
</jv-single-select>

<jv-single-select error-text="Välj en frukt" help-text-ref="helptext" label="Favoritfrukt">
  <jv-help-text slot="helptext">Den frukt du köper oftast</jv-help-text>
  <select id="dynamisk_select" required="">
    <option value="">-- Inget valt --</option>
    <option>Ananas</option>
    <option>Apelsin</option>
    <option>Banan</option>
    <option>Blodapelsin</option>
    <option>Clementin</option>
    <option>Dadel</option>
    <option>Kiwifrukt</option>
    <option>Päron</option>
    <option>Äpple</option>
  </select>
</jv-single-select>

<jv-single-select error-text="Välj en frukt" help-text-ref="helptext" label="Favoritfrukt" selected-value="Ananas">
  <jv-help-text slot="helptext">Den frukt du köper oftast</jv-help-text>
  <select disabled="" id="select_disabled">
    <option value="">-- Inget valt --</option>
    <option selected="">Ananas</option>
    <option>Apelsin</option>
    <option>Banan</option>
    <option>Blodapelsin</option>
    <option>Clementin</option>
    <option>Dadel</option>
    <option>Kiwifrukt</option>
    <option>Päron</option>
    <option>Äpple</option>
  </select>
</jv-single-select>