# LivaPivotGrid
Package: @dataliva/livalib
Description: @dataliva/livalib pivot (özet) tablo bileşeni.

DevExtreme PivotGrid üzerine kurulu özet tablo bileşeni. Düz bir veri dizisini
`fields` tanımındaki satır, sütun ve veri alanlarına göre gruplayıp özetler;
alan seçici, sıralama, filtreleme ve isteğe bağlı grafik görünümü sunar.

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

## Temel pivot

`dataSource` düz bir dizi olabilir. `fields` dizisindeki her öğe bir pivot
alanıdır: `dataField` veri alanını, `area` alanın yerleşimini (`'row'`,
`'column'`, `'data'`), `summaryType` ise özetleme biçimini (ör. `sum`)
belirler. Aşağıdaki örnek bölge satırları ile ürün sütunlarının kesişiminde
tutar toplamlarını gösterir; veri alanı tanımlanmayan `ceyrek` kolonu
otomatik olarak toplanır.

```tsx
type Satis = { bolge: string; urun: string; ceyrek: string; tutar: number };

const satislar: Satis[] = [
  { bolge: "Marmara", urun: "Klima", ceyrek: "Ç1", tutar: 185000 },
  { bolge: "Ege", urun: "Klima", ceyrek: "Ç1", tutar: 210000 },
  // ...
];

const alanlar = [
  { caption: "Bölge", dataField: "bolge", area: "row" },
  { caption: "Ürün", dataField: "urun", area: "column" },
  { caption: "Tutar", dataField: "tutar", dataType: "number", summaryType: "sum", format: "#,##0", area: "data" },
];
```

**Örnek — Temel pivot (bölge × ürün):**

```tsx
<LivaPivotGrid
  dataSource={satislar}
  fields={alanlar}
  gridHeight={360}
  gridWidth="100%"
  showBorders
  fieldChooserEnabled={false}
  chartVisible={false}
/>
```

## Çeyrek kırılımı ve alan seçici

Aynı `area` değerine sahip birden fazla alan iç içe kırılım oluşturur; burada
bölge satırları çeyrek bazında detaylanır. `rowHeaderLayout="tree"` satır
başlıklarını tek hiyerarşi sütununda kompakt gösterir. `fieldChooserEnabled`
alan başlıklarına tıklandığında alan seçiciyi açar; `allowSorting` ve
`allowFiltering` başlıklar üzerinden sıralama ve filtrelemeyi etkinleştirir.

**Örnek — Çeyrek kırılımı ve alan seçici:**

```tsx
<LivaPivotGrid
  dataSource={satislar}
  fields={detayAlanlar}
  gridHeight={420}
  gridWidth="100%"
  showBorders
  rowHeaderLayout="tree"
  fieldChooserEnabled
  allowSorting
  allowFiltering
  chartVisible={false}
/>
```

## Prop'lar

| Prop | Tip | Varsayılan |
|------|------|---------|
| `fields` | `any[]` | — |
| `dataSource` | `any[] \| PivotGridDataSource \| { xmlaStoreOptions }` | — |
| `gridHeight` | `number \| string` | — |
| `gridWidth` | `number \| string` | — |
| `currency` | `'USD' \| 'EUR' \| 'TRY'` | — |
| `chartVisible` | `boolean` | — |
| `chartType` | `'bar' \| 'line' \| 'area' \| 'spline' \| 'stackedbar' \| 'stackedarea'` | — |
| `showRowTotals` | `boolean` | — |
| `showColumnTotals` | `boolean` | — |
| `showRowGrandTotals` | `boolean` | — |
| `showColumnGrandTotals` | `boolean` | — |
| `fieldChooserEnabled` | `boolean` | — |
| `allowSorting` | `boolean` | — |
| `allowFiltering` | `boolean` | — |
| `rowHeaderLayout` | `'standard' \| 'tree'` | — |

Ayrıca `scrollingMode` (`'standard' \| 'virtual'`), `emptyValuePlaceholder`,
`exportEnabled`, `rowHeaderColumnWidth` ve `onCellClick` desteklenir.