title: Radio
label: Radio
status: live

context:
  component-type: form
  radio_legend:
        legend__text: Which do you like?

variants:
  - name: default
    context:
      required: true
      radio_name: newsletter
      radio_value: commit
      radio_label:
        form__label: "By selecting this radio you agree you like pizza."
        form__label_for: commit-to-newsletters
  - name: stacked
    label: Stacked Group Example
    context:
      item_01:
        radio_value: Apples
        radio_name: fruits
        radio_label:
          form__label: Apples
          form__label_for: 01
        radio_helper:
          helper_text: "Some text to help with things"
      item_02:
        radio_value: Bananas
        radio_name: fruits
        radio_label:
          form__label: Bananas
          form__label_for: 02
      item_03:
        radio_value: Mangos
        radio_name: fruits
        radio_label:
          form__label: Mangos
          form__label_for: 03
      item_04:
        radio_value: Oranges
        radio_name: fruits
        radio_label:
          form__label: Oranges
          form__label_for: 04
      item_05:
        radio_value: Pears
        radio_name: fruits
        radio_label:
          form__label: Pears
          form__label_for: 05
        disabled: true
      item_06:
        radio_value: Strawberries
        radio_name: fruits
        radio_label:
          form__label: Strawberries
          form__label_for: 06
  - name: clustered
    label: Clustered Group Example
    context:
      radio_name: peter
      inline: true
      item_01:
        radio_value: Apples
        radio_name: fruits
        radio_label:
          form__label: Apples
          form__label_for: fruit_01
        radio_helper:
          helper_text: "Some text to help with things"
      item_02:
        radio_value: Bananas
        radio_name: fruits
        radio_label:
          form__label: Bananas
          form__label_for: fruit_02
      item_03:
        radio_value: Mangos
        radio_name: fruits
        radio_label:
          form__label: Mangos
          form__label_for: fruit_03
      item_04:
        radio_value: Oranges
        radio_name: fruits
        radio_label:
          form__label: Oranges
          form__label_for: fruit_04
      item_05:
        radio_value: Pears
        radio_name: fruits
        radio_label:
          form__label: Pears
          form__label_for: fruit_05
        disabled: true
      item_06:
        radio_value: Strawberries
        radio_name: fruits
        radio_label:
          form__label: Strawberries
          form__label_for: fruit_06