# LivaList
Package: @dataliva/livalib
Description: @dataliva/livalib liste bileşeni.

DevExtreme List üzerine kurulu hafif liste bileşeni. `items` dizisindeki
öğeleri `displayExpr` alanına göre gösterir; tekli/çoklu seçim, öğe başına
düzenle/sil aksiyonları ve özel `itemRender` desteği sunar.

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

## Basit liste

`items` zorunludur; `keyExpr` öğe anahtarını, `displayExpr` görüntülenecek
alanı belirtir.

```tsx
type Sehir = { id: number; ad: string; bolge: string };

const sehirler: Sehir[] = [
  { id: 1, ad: "İstanbul", bolge: "Marmara" },
  { id: 2, ad: "Ankara", bolge: "İç Anadolu" },
  // ...
];
```

**Örnek — Basit liste:**

```tsx
<LivaList items={sehirler} keyExpr="id" displayExpr="ad" height={300} width="100%" />
```

## Seçim

`selectionMode="multiple"` ile `showSelectionControls` her öğeye onay kutusu
ekler. Seçilen anahtarlar `selectedKeys` ile kontrol edilebilir,
`onSelectionChanged` ile dinlenir.

**Örnek — Çoklu seçim:**

```tsx
<LivaList
  items={sehirler}
  keyExpr="id"
  displayExpr="ad"
  selectionMode="multiple"
  showSelectionControls
  height={300}
  width="100%"
/>
```

## Öğe aksiyonları

`showItemActions` her öğeye düzenle/sil düğmeleri ekler. `actionsPlacement`
düğmelerin görünme biçimini belirler: `'hover'` üzerine gelince, `'always'`
her zaman, `'menu'` ise üç nokta menüsünde gösterir. `onEdit` ve `onDelete`
geri çağrıları tıklanan öğeyi alır.

**Örnek — Öğe aksiyonları:**

```tsx
<LivaList
  items={sehirler}
  keyExpr="id"
  displayExpr="ad"
  showItemActions
  actionsPlacement="always"
  onEdit={(item) => alert("Düzenle: " + item.ad)}
  onDelete={(item) => alert("Sil: " + item.ad)}
  height={300}
  width="100%"
/>
```

## Prop'lar

| Prop | Tip | Varsayılan |
|------|------|---------|
| `items` | `LivaListItem[]` | — (zorunlu) |
| `keyExpr` | `string` | — |
| `displayExpr` | `string` | — |
| `selectionMode` | `'none' \| 'single' \| 'multiple'` | — |
| `showSelectionControls` | `boolean` | — |
| `selectedKeys` | `any[]` | — |
| `onSelectionChanged` | `(e) => void` | — |
| `showItemActions` | `boolean` | — |
| `actionsPlacement` | `'hover' \| 'always' \| 'menu'` | — |
| `onEdit` | `(item: LivaListItem) => void` | — |
| `onDelete` | `(item: LivaListItem) => void` | — |
| `itemRender` | `(item, index, actionsElement) => ReactNode` | — |
| `itemClassName` | `string \| ((item) => string)` | — |
| `height` | `number \| string` | — |
| `width` | `number \| string` | — |

Ayrıca DevExtreme List'ten gelen diğer seçenekler (ör. `searchEnabled`,
`grouped`, `noDataText`) doğrudan kullanılabilir.