Campo de seleção

Campo de seleção

O campo select armazena um valor escolhido a partir de uma lista controlada de opções.

Ideal para

  • variantes visuais
  • opções de alinhamento
  • opções de tamanho
  • configurações controladas semelhantes a categorias

Exemplo de esquema

{
  "name": "theme",
  "label": "Theme",
  "type": "select",
  "options": ["light", "dark", "accent"]
}

Exemplo de estilo rótulo/valor:

{
  "name": "alignment",
  "label": "Alignment",
  "type": "select",
  "options": [
    { "label": "Left", "value": "left" },
    { "label": "Center", "value": "center" },
    { "label": "Right", "value": "right" }
  ]
}

Uso no template

<section class="theme-{{ theme }}">
  ...
</section>

Quando usar

Use select quando os autores devem escolher uma opção conhecida e os valores permitidos devem permanecer controlados.

Quando não usar

Não use select para:

  • texto livre
  • alternâncias verdadeiro/falso
  • várias linhas repetíveis

Use text, checkbox ou repeater em vez disso.

Notas técnicas

  • mantenha os valores das opções estáveis após o lançamento, pois os templates podem depender deles
  • use valores amigáveis para máquinas e rótulos amigáveis para humanos
  • evite transformar select em um depósito oculto de conteúdo com opções demais
  • prefira checkbox para alternâncias binárias e repeater para estruturas baseadas em linhas

Relacionados