# Radio

## Overview

A UI element that allows users to make a single selection from a list of options.

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FcnH1xjwe4bmGDbvKLJDm%2FCleanShot%202025-08-19%20at%2013.37.15%402x-min.png?alt=media&#x26;token=d3686aca-864c-48a1-8351-49fa237d09cd" alt=""><figcaption></figcaption></figure>

### Properties

<table><thead><tr><th width="130.2890625">Name</th><th width="146.1484375">Type</th><th>Description</th></tr></thead><tbody><tr><td><code>name</code></td><td><code>string</code></td><td>Component name</td></tr><tr><td><code>value</code></td><td><code>any</code></td><td>Current component value</td></tr><tr><td><code>valid</code></td><td><code>boolean</code></td><td>Indicates if the component is valid</td></tr><tr><td><code>validating</code></td><td><code>boolean</code></td><td>Indicates if the component is validating</td></tr></tbody></table>

### Methods

<table><thead><tr><th width="155.5390625">Name</th><th width="179.55859375">Parameters</th><th width="101.05078125">Returns</th><th>Description</th></tr></thead><tbody><tr><td><code>setValue</code></td><td><code>value: any</code></td><td><code>void</code></td><td>Set component value</td></tr><tr><td><code>setOptions</code></td><td><code>options: object[]</code></td><td><code>void</code></td><td><p>Set options for the radio component. Options is an array of objects with the following structure:<br><code>{</code><br></p><p><code>value: any;</code><br></p><p><code>label: string;</code><br></p><p><code>}</code></p></td></tr><tr><td><code>setDisabled</code></td><td><code>disabled: boolean</code></td><td><code>void</code></td><td>Disable or enable the component</td></tr><tr><td><code>reset</code></td><td>–</td><td><code>void</code></td><td>Reset component to the initial value</td></tr><tr><td><code>resetValidation</code></td><td>–</td><td><code>void</code></td><td>Clear validation errors</td></tr><tr><td><code>setErrors</code></td><td><p><code>errors: string |</code> </p><p><code>string[] | null</code></p></td><td><code>void</code></td><td>Mark the component as invalid and displays errors</td></tr></tbody></table>

### Triggers

<table><thead><tr><th width="134.31640625">Name</th><th>Description</th></tr></thead><tbody><tr><td><strong>On Change</strong></td><td>Triggered when the component's state changes</td></tr><tr><td><strong>On Focus</strong></td><td>Triggered when the component is in focus</td></tr><tr><td><strong>On Blur</strong></td><td>Triggered when the component loses focus</td></tr><tr><td><strong>On Init</strong></td><td>Triggered when the component is initialized</td></tr></tbody></table>
