Select

The shared select renders a visible label, an optional description, and a native <select> from option records. Its shortcode bridge lets documentation use the same partial as templates.

Example#

When to use#

• Use a select when the reader picks one option from a list too long for a row of visible controls
• Prefer filter chips or radio buttons when the options are few; visible choices scan faster than a collapsed list
• Not for navigation — a select that changes the page on selection surprises keyboard users

Implementation#

{{ partial "select.html" (dict
  "id" "update-frequency"
  "name" "frequency"
  "label" "Update frequency"
  "description" "Choose how often to receive a summary."
  "selected" "weekly"
  "options" (slice
    (dict "value" "daily" "label" "Daily")
    (dict "value" "weekly" "label" "Weekly")
    (dict "value" "monthly" "label" "Monthly")
  )
) }}

The partial renders the field structure and does not add JavaScript. The browser supplies keyboard operation, validation, and the platform picker. Markdown pages use the select shortcode.

Options#

Accessibility#

• The visible <label> points to the native <select> through matching for and id values
• The optional description is programmatically associated through aria-describedby
• Native select keyboard behaviour and mobile pickers remain intact because the component does not rebuild the control with custom elements
• Required, disabled, selected, and disabled-option states use native HTML attributes