Native Select

Description

Create a browser-native select with an optional label and helper text.

Usage

bc_native_select(
  ...,
  label = NULL,
  id = NULL,
  aria_label = NULL,
  placeholder = NULL,
  size = "default",
  description = NULL,
  name = id,
  disabled = FALSE,
  invalid = FALSE
)

bc_native_select_option(value, ..., label = NULL)

bc_native_select_group(label, ...)

Arguments

Argument	Description
`...`	For `bc_native_select()`, options from `bc_native_select_option()` and `bc_native_select_group()`. For the other functions, extra tag attributes or content.
`label`	String or tag. The field label for `bc_native_select()`, the option text for `bc_native_select_option()`, or the group title for `bc_native_select_group()`.
`id`	String. The select ID. Required when `label` is set.
`aria_label`	String. Accessible name for the select when there is no `label`.
`placeholder`	String. Text of a blank first option, such as `"Select a fruit"`.
`size`	String. `"default"` or `"sm"`.
`description`	String or tag. Helper text shown under the select.
`name`	String. The input name. Defaults to `id`.
`disabled`	Bool. Whether the input is disabled. Defaults to `FALSE`.
`invalid`	Bool. Whether to show the invalid state. Defaults to `FALSE`.
`value`	String. The option's value.

Value

An htmltools tag.

Details

Needs a label or an aria_label, not both.

Examples

bc_native_select(
  bc_native_select_option("Apple", value = "apple"),
  bc_native_select_option("Banana", value = "banana"),
  bc_native_select_option("Blueberry", value = "blueberry"),
  aria_label = "Fruit",
  placeholder = "Select a fruit"
)


bc_native_select(
  bc_native_select_group(
    "Vegetables",
    bc_native_select_option("Carrot", value = "carrot"),
    bc_native_select_option("Potato", value = "potato")
  ),
  id = "food",
  label = "Food",
  placeholder = "Select food"
)

Food