# LivaScheduler
Package: @dataliva/livalib
Description: @dataliva/livalib randevu ve takvim planlayıcı bileşeni.

DevExtreme Scheduler üzerine kurulu randevu/takvim bileşeni. Gün, hafta ve
ay görünümleri; randevu ekleme, taşıma ve yeniden boyutlandırma; kaynak
bazlı renklendirme ve gruplama destekler. Varsayılan saat dilimi
`Europe/Istanbul`, haftanın ilk günü Pazartesi'dir.

```tsx
import {
  LivaScheduler,
  type LivaSchedulerView,
  type LivaSchedulerResource,
} from "@dataliva/livalib";
```

## Haftalık görünüm

`dataSource` içindeki her kayıt en az `text`, `startDate` ve `endDate`
alanlarını taşır. `views` ile kullanıcıya sunulacak görünümler, `defaultCurrentView`
ile açılış görünümü, `defaultCurrentDate` ile açılış tarihi belirlenir.
Boş bir hücreye çift tıklayarak yeni randevu ekleyebilir, mevcut randevuları
sürükleyerek taşıyabilirsiniz.

**Örnek — Haftalık görünüm:**

```tsx
const randevular: Randevu[] = [
  {
    text: "Bütçe planlama toplantısı",
    startDate: new Date(2026, 5, 15, 10, 0),
    endDate: new Date(2026, 5, 15, 11, 30),
  },
  // ...
];

<LivaScheduler
  dataSource={randevular}
  views={[
    { type: "day", displayName: "Gün" },
    { type: "week", displayName: "Hafta" },
    { type: "month", displayName: "Ay" },
  ]}
  defaultCurrentView="week"
  defaultCurrentDate={new Date(2026, 5, 15)}
  startDayHour={8}
  endDayHour={18}
  height={480}
/>
```

## Kaynaklar ile renklendirme

`resources` ile randevular bir kaynağa (salon, personel, departman vb.)
bağlanır; her kaynağın rengi randevu kartına uygulanır. `fieldExpr`,
randevu kaydındaki eşleşen alanın adını belirtir. Birden fazla kaynak
tanımlanabilir ve `groups` ile takvim kaynak bazında gruplanabilir.

**Örnek — Kaynaklar ile renklendirme:**

```tsx
const salonlar = [
  { id: 1, text: "Toplantı Salonu A", color: "#1e88e5" },
  { id: 2, text: "Toplantı Salonu B", color: "#43a047" },
  { id: 3, text: "Konferans Salonu", color: "#fb8c00" },
];

const kaynaklar: LivaSchedulerResource[] = [
  {
    label: "Salon",
    fieldExpr: "salonId",
    dataSource: salonlar,
    valueExpr: "id",
    displayExpr: "text",
    colorExpr: "color",
  },
];

<LivaScheduler
  dataSource={salonluRandevular}
  views={[{ type: "week", displayName: "Hafta" }]}
  defaultCurrentView="week"
  defaultCurrentDate={new Date(2026, 5, 15)}
  resources={kaynaklar}
  startDayHour={8}
  endDayHour={18}
  height={480}
/>
```

## Randevu düğmesi

`showAppointmentButton` açıldığında takvimin üzerine hazır bir "randevu
ekle" düğmesi yerleştirilir; metni, simgesi, rengi ve boyutu
`appointmentButtonText`, `appointmentButtonIcon`, `appointmentButtonVariant`
ve `appointmentButtonSize` ile özelleştirilir. Düğme, DevExtreme'in randevu
ekleme popup'ını açar ve `onAppointmentButtonClick` olayını tetikler.

## Prop'lar

| Prop | Tip | Varsayılan |
|------|------|---------|
| `dataSource` | `any[]` | — |
| `views` | `LivaSchedulerView[]` | `[]` |
| `defaultCurrentView` | `SchedulerTypes.ViewType` | `'week'` |
| `defaultCurrentDate` | `Date` | bugün |
| `height` | `number \| string` | `600` |
| `width` | `number \| string` | `'100%'` |
| `startDayHour` | `number` | `8` |
| `endDayHour` | `number` | `18` |
| `firstDayOfWeek` | `SchedulerTypes.FirstDayOfWeek` | `1` |
| `showAllDayPanel` | `boolean` | `true` |
| `timeZone` | `string` | `'Europe/Istanbul'` |
| `resources` | `LivaSchedulerResource[]` | `[]` |
| `groups` | `string[]` | `[]` |
| `allowAdding` | `boolean` | `true` |
| `allowDragging` | `boolean` | `true` |
| `showAppointmentButton` | `boolean` | `false` |

Ayrıca `allowUpdating`, `allowDeleting`, `allowResizing` (tümü `true`);
`onAppointmentClick`, `onAppointmentAdded`, `onAppointmentUpdated`,
`onAppointmentDeleted`, `onCurrentViewChanged`, `onCurrentDateChanged`,
`onCellClick` gibi olay prop'ları ve `appointmentComponent`,
`dataCellComponent`, `resourceCellComponent` özelleştirme prop'ları
mevcuttur. Tanınmayan tüm prop'lar alttaki DevExtreme Scheduler'a aktarılır.