<p>React RadioButton is an extension to standard radio button element with theming.</p>
<h3 id="setup">Setup</h3>
<p>Refer to PrimeReact <a target="_blank" href="https://primefaces.org/primereact/showcase/#/setup">setup documentation</a> for download and installation steps for your environment.</p>
<h3 id="import">Import</h3>
<pre><code class="lang-js"><span class="hljs-keyword">import</span> { RadioButton } <span class="hljs-keyword">from</span> <span class="hljs-string">'primereact/radiobutton'</span>;
</code></pre>
<h3 id="getting-started">Getting Started</h3>
<p>RadioButton is used as a controlled input with checked and onChange properties.</p>
<pre><code class="lang-html"><span class="hljs-tag">&lt;<span class="hljs-name">RadioButton</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"val1"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"city"</span> <span class="hljs-attr">onChange</span>=<span class="hljs-string">{(e)</span> =&gt;</span> setValue(e.value)} checked={value === 'val1'} /&gt;
<span class="hljs-tag">&lt;<span class="hljs-name">RadioButton</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"val2"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"city"</span> <span class="hljs-attr">onChange</span>=<span class="hljs-string">{(e)</span> =&gt;</span> setValue(e.value)} checked={value === 'val2'} /&gt;
</code></pre>
<h3 id="theming">Theming</h3>
<p>RadioButton supports various themes featuring Material, Bootstrap, Fluent as well as your own custom themes via the <a target="_blank" href="https://primefaces.org/primereact/showcase/#/theming">Designer</a> tool.</p>
<h3 id="resources">Resources</h3>
<p>Visit the PrimeReact <a target="_blank" href="https://primefaces.org/primereact/showcase/#/radiobutton">RadioButton</a> showcase for demos and documentation.</p>
<h3 id="setup">Setup</h3>
<p>Refer to PrimeReact <a target="_blank" href="https://primefaces.org/primereact/showcase/#/setup">setup documentation</a> for download and installation steps for your environment.</p>


React RadioButton is an extension to standard radio button element with theming.

### Setup

Refer to PrimeReact [setup documentation](https://primefaces.org/primereact/showcase/#/setup) for download and installation steps for your environment.

### Import

```js
import { RadioButton } from 'primereact/radiobutton';
```

### Getting Started

RadioButton is used as a controlled input with checked and onChange properties.

```html
<RadioButton value="val1" name="city" onChange={(e) => setValue(e.value)} checked={value === 'val1'} />
<RadioButton value="val2" name="city" onChange={(e) => setValue(e.value)} checked={value === 'val2'} />
```

### Theming

RadioButton supports various themes featuring Material, Bootstrap, Fluent as well as your own custom themes via the [Designer](https://primefaces.org/primereact/showcase/#/theming) tool.

### Resources

Visit the PrimeReact [RadioButton](https://primefaces.org/primereact/showcase/#/radiobutton) showcase for demos and documentation.


### Setup

Refer to PrimeReact [setup documentation](https://primefaces.org/primereact/showcase/#/setup) for download and installation steps for your environment.
