@vamos-ui/react 0.0.0-stage → 0.3.0

package/dist/scheduler/scheduler.d.ts

@@ -0,0 +1,168 @@
+/**
+ * Agenda / scheduler: day, week, work week, month and list views over one event model, with
+ * overlap layout, drag create / move / resize (snapped), a now line, business hours, holidays
+ * and an explicit time zone. Own engine on date-fns + `usePointerDrag` + the scheduler core.
+ */
+import * as React from "react";
+import type { IsoDate, WorkCalendar } from "../locale-data/core/types.js";
+import { type ScheduleTone } from "./shared.js";
+export declare const schedulerLabels: {
+    today: string;
+    previous: string;
+    next: string;
+    view: string;
+    day: string;
+    week: string;
+    workweek: string;
+    month: string;
+    list: string;
+    allDay: string;
+    more: string;
+    moreLabel: string;
+    emptyWeek: string;
+    emptyDay: string;
+    emptyHint: string;
+    tentative: string;
+    canceled: string;
+    readOnly: string;
+    timeRange: string;
+    allDayOn: string;
+    multiDay: string;
+    newEvent: string;
+    slotCursor: string;
+    open: string;
+    changeTime: string;
+    changeTimeTitle: string;
+    changeTimeDescription: string;
+    date: string;
+    start: string;
+    end: string;
+    save: string;
+    cancel: string;
+    endBeforeStart: string;
+    saveFailed: string;
+    loading: string;
+    outsideHours: string;
+    moved: string;
+    created: string;
+    timeZone: string;
+    nowLine: string;
+    events: string;
+    dayGrid: string;
+    weekNumber: string;
+};
+export type SchedulerLabels = typeof schedulerLabels;
+export type SchedulerView = "day" | "week" | "workweek" | "month" | "list";
+export interface SchedulerEvent {
+    id: string;
+    title: string;
+    /** Timed: UTC ISO instant. All-day: `YYYY-MM-DD`. */
+    start: string;
+    /** Timed: UTC ISO instant (exclusive). All-day: `YYYY-MM-DD`, the last day (inclusive). */
+    end: string;
+    allDay?: boolean;
+    tone?: ScheduleTone | (string & {});
+    status?: "confirmed" | "tentative" | "canceled";
+    /** `false` locks the event; an object locks one interaction. Default: editable when `onEventChange` is set. */
+    editable?: boolean | {
+        move?: boolean;
+        resize?: boolean;
+    };
+    location?: string;
+    resourceIds?: string[];
+    /** Your payload (passed back untouched). */
+    data?: unknown;
+}
+export interface SchedulerEventChange {
+    id: string;
+    start: string;
+    end: string;
+    allDay: boolean;
+}
+export interface SchedulerCreateRange {
+    start: string;
+    end: string;
+    allDay: boolean;
+}
+export interface SchedulerRenderState {
+    view: SchedulerView;
+    /** Short block (≤ 30 min) or month / lane bar: render one line. */
+    compact: boolean;
+    /** The formatted time range ("14:00 – 15:00"). */
+    timeLabel: string;
+}
+export interface SchedulerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    events: SchedulerEvent[];
+    view?: SchedulerView;
+    defaultView?: SchedulerView;
+    onViewChange?(view: SchedulerView): void;
+    /** Views offered in the switch. Default `["day", "week", "month", "list"]`. */
+    views?: SchedulerView[];
+    /** The focused date, `YYYY-MM-DD`. Default: today in `timeZone`. */
+    date?: IsoDate;
+    defaultDate?: IsoDate;
+    onDateChange?(date: IsoDate): void;
+    /** Visible days changed (fetch events for them). Inclusive `YYYY-MM-DD` bounds. */
+    onRangeChange?(range: {
+        start: IsoDate;
+        end: IsoDate;
+    }): void;
+    /** Grid line step. Default 30. */
+    slotMinutes?: 5 | 10 | 15 | 30 | 60;
+    /** Drag / keyboard step. Default 15. Hold Alt while dragging for 5-minute steps. */
+    snapMinutes?: number;
+    /** Visible part of the day in time views. Default `{ start: "00:00", end: "24:00" }`. */
+    dayRange?: {
+        start: string;
+        end: string;
+    };
+    /** Time scrolled into view on open. Default: business-hours start, else "08:00". */
+    scrollToTime?: string;
+    /** Height of the scrolling time grid (CSS length). Default `"36rem"`. */
+    height?: string | number;
+    /** Work days, business hours and holidays. Default from the locale (tr → Turkish public holidays). */
+    workCalendar?: WorkCalendar;
+    /** Moves and new events outside business hours are refused (danger outline while dragging). */
+    restrictToBusinessHours?: boolean;
+    /** IANA zone for every time shown and every instant produced. Default: `LocaleProvider` `timeZone`. */
+    timeZone?: string;
+    /** Drag (or keyboard) on empty time creates a range. */
+    onCreate?(range: SchedulerCreateRange): void;
+    /** Move / resize. Applied optimistically; a rejected promise reverts the event and shows a toast. */
+    onEventChange?(change: SchedulerEventChange): void | Promise<void>;
+    /** Click / Enter on an event. */
+    onEventOpen?(id: string, event: SchedulerEvent): void;
+    renderEvent?(event: SchedulerEvent, state: SchedulerRenderState): React.ReactNode;
+    /** Month view: bars per day before "+N more". Default 3. */
+    maxEventsPerDay?: number;
+    /** `"embedded"` hides the toolbar (cards, side panels). */
+    variant?: "full" | "embedded";
+    /** Dims events, shows a spinner and keeps the old events visible. */
+    loading?: boolean;
+    /** No create / move / resize anywhere. */
+    readOnly?: boolean;
+    /** Extra toolbar content (filters, a "New event" button). */
+    toolbar?: React.ReactNode;
+    /** List view: number of days from the week start. Default 7. */
+    listDays?: number;
+    /** Fixed "now" (tests, screenshots). Default: the live clock. */
+    now?: Date | number;
+    labels?: Partial<SchedulerLabels>;
+}
+export declare const schedulerVariants: (props?: ({
+    variant?: "full" | "embedded" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * ```tsx
+ * <Scheduler
+ *   events={events}
+ *   defaultView="week"
+ *   timeZone="Europe/Istanbul"
+ *   onCreate={(r) => openCreateDialog(r)}
+ *   onEventChange={(c) => api.events.update(c)}
+ * />
+ * ```
+ */
+export declare const Scheduler: React.ForwardRefExoticComponent<SchedulerProps & React.RefAttributes<HTMLDivElement>>;
+/** Number of days an event spans (inclusive), in a zone. */
+export declare function schedulerEventDays(e: Pick<SchedulerEvent, "start" | "end" | "allDay">, timeZone?: string): number;