```js
initialState = { value: "ID_GROUP1_OPTION2" };

<div>
    <h4>Group 1</h4>
    <RadioButtonGroup id="g1">
        <RadioButton
            name="g1rb1"
            onChange={ (e) => setState({ value: e.target.value }) }
            value="ID_GROUP1_OPTION1"
            label="Group 1 Option 1"
            checked={ state.value === "ID_GROUP1_OPTION1" }
        />
        <RadioButton
            name="g1rb2"
            onChange={ (e) => setState({ value: e.target.value }) }
            value="ID_GROUP1_OPTION2"
            label="Group 1 Option 2"
            checked={ state.value === "ID_GROUP1_OPTION2" }
        />
    </RadioButtonGroup>
    <label>Selected value for group is: { state.value }</label>
</div>
```

---

```js
initialState = { value: "None" };

<div>
    <h4>Group 2</h4>
    <RadioButtonGroup id="g2">
        <RadioButton
            name="g2rb1"
            onChange={ (e) => setState({ value: e.target.value }) }
            value="ID_GROUP2_OPTION1"
            label="Group 2 Option 1"
        />
        <RadioButton
            name="g2rb2"
            onChange={ (e) => setState({ value: e.target.value }) }
            value="ID_GROUP21_OPTION2"
            label="Group 2 Option 2"
            disabled
        />
    </RadioButtonGroup>
    <label>Selected value for group is: { state.value }</label>
</div>
```
