# LivaRadioGroup
Package: @dataliva/livalib
Description: @dataliva/livalib radyo düğmesi grubu bileşeni.

DevExtreme'in RadioGroup bileşeni üzerine kurulu; yerleşim için
`orientation`, renk için `variant` ve boyut için `size` prop'larıyla
genişletilmiş bir radyo düğmesi grubu.

```tsx
import { LivaRadioGroup } from "@dataliva/livalib";
```

## Yatay ve dikey yerleşim

`orientation` seçeneklerin dizilişini belirler; varsayılan dikeydir.

**Örnek — Yatay ve dikey yerleşim:**

```tsx
const odemeYontemleri = [
  { text: "Kredi Kartı", value: "kart" },
  { text: "Havale / EFT", value: "havale" },
  { text: "Kapıda Ödeme", value: "kapida" },
];

<LivaRadioGroup
  dataSource={odemeYontemleri}
  displayExpr="text"
  valueExpr="value"
  label="Yatay"
  orientation="horizontal"
  defaultValue="kart"
/>
<LivaRadioGroup
  dataSource={odemeYontemleri}
  displayExpr="text"
  valueExpr="value"
  label="Dikey"
  orientation="vertical"
  defaultValue="havale"
/>
```

## Renk varyantları

`variant` seçili radyo düğmesinin rengini belirler.

**Örnek — Renk varyantları:**

```tsx
const secenekler = [
  { text: "Evet", value: 1 },
  { text: "Hayır", value: 0 },
];

<LivaRadioGroup dataSource={secenekler} displayExpr="text" valueExpr="value" label="Primary" variant="primary" orientation="horizontal" defaultValue={1} />
<LivaRadioGroup dataSource={secenekler} displayExpr="text" valueExpr="value" label="Secondary" variant="secondary" orientation="horizontal" defaultValue={1} />
<LivaRadioGroup dataSource={secenekler} displayExpr="text" valueExpr="value" label="Success" variant="success" orientation="horizontal" defaultValue={1} />
<LivaRadioGroup dataSource={secenekler} displayExpr="text" valueExpr="value" label="Warning" variant="warning" orientation="horizontal" defaultValue={1} />
<LivaRadioGroup dataSource={secenekler} displayExpr="text" valueExpr="value" label="Danger" variant="danger" orientation="horizontal" defaultValue={1} />
```

## Kontrollü değer

`value` ve `onValueChanged` ile bileşen React state'ine bağlanır.

**Örnek — Kontrollü değer:**

```tsx
const [yontem, setYontem] = useState<string>("kart");

<LivaRadioGroup
  dataSource={odemeYontemleri}
  displayExpr="text"
  valueExpr="value"
  label="Ödeme yöntemi"
  value={yontem}
  onValueChanged={(e: { value: string }) => setYontem(e.value)}
/>
<span>Seçilen: {secilen ? secilen.text : "—"}</span>
```

## Durumlar

`disabled` grubu kapatır; `required` etikete yıldız ekler, `hint` alanın
altında yardım metni gösterir.

**Örnek — Durumlar:**

```tsx
<LivaRadioGroup
  dataSource={odemeYontemleri}
  displayExpr="text"
  valueExpr="value"
  label="Devre dışı"
  defaultValue="kart"
  disabled
/>
<LivaRadioGroup
  dataSource={odemeYontemleri}
  displayExpr="text"
  valueExpr="value"
  label="Zorunlu alan"
  required
  hint="Bir ödeme yöntemi seçin"
/>
```

## Prop'lar

| Prop | Tip | Varsayılan |
|------|------|---------|
| `dataSource` | `any[]` | — |
| `value` | `any` | — |
| `onValueChanged` | `(e) => void` | — |
| `orientation` | `'horizontal' \| 'vertical'` | `'vertical'` |
| `variant` | `'primary' \| 'secondary' \| 'success' \| 'warning' \| 'danger'` | `'primary'` |
| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` |
| `label` | `string` | — |
| `labelPosition` | `LabelPosition` | `'top-start'` |
| `labelWidth` | `number \| string` | — |
| `disabled` | `boolean` | `false` |
| `required` | `boolean` | `false` |
| `hint` | `string` | — |
| `className` | `string` | — |

Ayrıca DevExtreme `IRadioGroupOptions`'tan gelen tüm prop'lar (ör.
`displayExpr`, `valueExpr`, `defaultValue`).