@mozaic-ds/vue/src/components/radio/README.md

Mozaic-Vue is the Vue.js implementation of ADEO Design system

# MRadio

A radio button is a selection control that allows users to choose a single option from a list of mutually exclusive choices. Unlike checkboxes, only one option can be selected at a time within the same group. Radio Buttons are commonly used in forms, surveys, and settings where a single choice must be made.


## Props

| Name | Description | Type | Default |
| --- | --- | --- | --- | 
| `id*` | A unique identifier for the radio, used to associate the label with the form element. | `string` | - |
| `name` | The name attribute for the radio element, typically used for form submission. | `string` | - |
| `label` | The text label displayed next to the radio. | `string` | - |
| `modelValue` | The radio's checked state, bound via v-model. | `boolean` | - |
| `isInvalid` | If `true`, applies an invalid state to the radio. | `boolean` | - |
| `disabled` | If `true`, disables the radio, making it non-interactive. | `boolean` | - |

## Events

| Name | Description | Type |
| --- | --- | --- |
| `update:modelValue` | Emits when the radio value changes, updating the modelValue prop. | [value: boolean] |

## Dependencies

### Used By

- [MRadioGroup](../radiogroup)
- [MTileSelectable](../tileselectable)

### Graph

```mermaid
graph TD;
  MRadioGroup --> MRadio
  MTileSelectable --> MRadio
style MRadio fill:#008240,stroke:#333,stroke-width:4px
```