# LivaSwitch
Package: @dataliva/livalib
Description: @dataliva/livalib anahtar (aç/kapat) bileşeni.

DevExtreme'in Switch bileşeni üzerine kurulu; renk için `variant` ve boyut
için `size` prop'larıyla genişletilmiş bir aç/kapat anahtarı.

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

## Renk varyantları

`variant` açık durumdaki rengi belirler. Sırasıyla `primary`, `secondary`,
`success`, `warning`, `danger`.

**Örnek — Renk varyantları:**

```tsx
<LivaSwitch variant="primary" defaultValue={true} />
<LivaSwitch variant="secondary" defaultValue={true} />
<LivaSwitch variant="success" defaultValue={true} />
<LivaSwitch variant="warning" defaultValue={true} />
<LivaSwitch variant="danger" defaultValue={true} />
```

## Boyutlar

Sırasıyla `small`, `medium`, `large`.

**Örnek — Boyutlar:**

```tsx
<LivaSwitch size="small" defaultValue={true} />
<LivaSwitch size="medium" defaultValue={true} />
<LivaSwitch size="large" defaultValue={true} />
```

## Kontrollü değer

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

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

```tsx
const [acik, setAcik] = useState<boolean>(true);

<LivaSwitch
  value={acik}
  onValueChanged={(e) => setAcik(e.value)}
/>
<span>Bildirimler: {acik ? "Açık" : "Kapalı"}</span>
```

## Durumlar

`disabled` etkileşimi tamamen kapatır; `readOnly` değeri korur ama görünümü
soluklaştırmaz, `hint` üzerine gelindiğinde ipucu gösterir.

**Örnek — Durumlar:**

```tsx
<LivaSwitch disabled />
<LivaSwitch defaultValue={true} disabled />
<LivaSwitch defaultValue={true} readOnly />
<LivaSwitch hint="Bildirimleri aç/kapat" />
```

## Prop'lar

| Prop | Tip | Varsayılan |
|------|------|---------|
| `value` | `boolean` | `false` |
| `defaultValue` | `boolean` | — |
| `onValueChanged` | `(e) => void` | — |
| `variant` | `'primary' \| 'secondary' \| 'success' \| 'warning' \| 'danger'` | `'primary'` |
| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` |
| `disabled` | `boolean` | `false` |
| `readOnly` | `boolean` | `false` |
| `hint` | `string` | — |
| `className` | `string` | — |

Ayrıca DevExtreme `ISwitchOptions`'tan gelen tüm prop'lar (ör.
`switchedOnText`, `switchedOffText`, `width`).