Scheduler

Scheduler is a time canvas, not a date picker. In its day / week / work-week views it draws a vertical hour axis with day columns, slot lines, an all-day lane and a live now-line, and positions events by their start/end — packing overlapping events side-by-side. view="month" switches to a day-grid with multi-day spanning bars, and view="agenda" to a chronological list. It is a full editor: drag empty time to create, drag a block to move it (even across days), drag its edges to resize — by pointer or keyboard — with optimistic callbacks so you own the events. All time math flows through one clock, so a timeZone and DST transitions stay correct, and events with an rrule expand to occurrences for the visible span. For picking a single date, use calendar/date-picker — Scheduler can't shrink to that, and DayPicker can't stretch to this.

Own the data; treat the callbacks as intents. events is a controlled data prop — onEventMove / onEventResize / onRangeSelect hand you the proposed range (plus a meta identifying the recurrence occurrence via baseId + occurrenceStart); apply it to your own state. Nothing mutates until you do.

Style only through tone × appearance and the render slot. Give events a tone (the shared vocabulary) and appearance (solid/soft/outline); reach for renderEvent when you need custom content — it applies in every placement (column, all-day, month cell, agenda row). Don't hand-position or hardcode colors; the canvas computes geometry into CSS variables.

Keep it operable and honest. The keyboard model is the differentiator — arrow-navigate events, Enter to open, Shift/Alt+arrows to reschedule; don't strip the focus ring or the sr-only instructions. Pass date/defaultDate for SSR-deterministic output, and a timeZone when events live in a fixed zone.