{
  "_copyright": "Copyright (c) 2026, Salesforce, Inc., All rights reserved. For full license text, see the LICENSE.txt file",
  "$schema": "https://slds.lightningdesignsystem.com/schemas/uif-foundation.v1.json",
  "apiVersion": "1.0.0",
  "name": "RadioButtonGroup",
  "description": "A group of radio buttons styled as a segmented button bar.",
  "structure": {
    "name": "root",
    "restrict": [
      "fieldset",
      "div"
    ],
    "description": "Initializes radio button",
    "attributes": {
      "static": {
        "role": "radiogroup"
      }
    },
    "children": [
      {
        "name": "legend",
        "restrict": [
          "legend"
        ],
        "description": "Group label; may contain the requiredIndicator followed by label text",
        "slot": {
          "name": "legend",
          "required": true
        },
        "children": [
          {
            "name": "requiredIndicator",
            "restrict": [
              "abbr"
            ],
            "description": "Visual indicator that a selection is required; rendered with title='required' and aria-hidden so screen readers rely on aria-required",
            "attributes": {
              "static": {
                "title": "required",
                "aria-hidden": "true"
              }
            },
            "renderWhen": {
              "prop": "required",
              "eq": "true"
            }
          }
        ]
      },
      {
        "name": "control",
        "restrict": [
          "div"
        ],
        "description": "Form-element control wrapper; hosts the radio group and any error message",
        "children": [
          {
            "name": "group",
            "restrict": [
              "div"
            ],
            "description": "Initializes radio button",
            "slot": {
              "name": "default"
            },
            "children": [
              {
                "name": "option",
                "restrict": [
                  "span"
                ],
                "description": "A single radio option wrapper that visually styles as a button; repeats once per choice",
                "children": [
                  {
                    "name": "input",
                    "restrict": [
                      "input"
                    ],
                    "description": "The native radio input that backs this option",
                    "attributes": {
                      "static": {
                        "type": "radio"
                      }
                    }
                  },
                  {
                    "name": "label",
                    "restrict": [
                      "label"
                    ],
                    "description": "Label element inside of a radio button",
                    "children": [
                      {
                        "name": "labelText",
                        "restrict": [
                          "span"
                        ],
                        "description": "Create styled button when adjacent to the input[radio] element",
                        "slot": {
                          "name": "labelText",
                          "required": true
                        }
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "name": "errorMessage",
            "restrict": [
              "div"
            ],
            "description": "Validation error message; referenced by each input's aria-describedby when present",
            "renderWhen": {
              "prop": "hasError",
              "eq": "true"
            }
          }
        ]
      }
    ]
  },
  "states": [
    {
      "name": "disabled",
      "type": "boolean",
      "aria": "aria-disabled",
      "description": "Whether the radio button group is disabled; mirrored as the disabled attribute on each input"
    },
    {
      "name": "required",
      "type": "boolean",
      "aria": "aria-required",
      "description": "Whether a selection is required"
    },
    {
      "name": "hasError",
      "type": "boolean",
      "description": "Whether the radio button group has a validation error"
    }
  ],
  "accessibility": {
    "requirements": [
      {
        "id": "radiogroup-role",
        "description": "Container must have role='radiogroup'"
      },
      {
        "id": "arrow-navigation",
        "description": "Arrow keys should navigate between options"
      },
      {
        "id": "error-described-by",
        "description": "When hasError is true, each radio input must reference the errorMessage id via aria-describedby"
      },
      {
        "id": "required-indicator-hidden",
        "description": "The visual required indicator must be aria-hidden so assistive technology relies on aria-required instead of the asterisk glyph"
      }
    ]
  }
}