@super-calendar/native 2.3.2 → 2.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,10 +1,36 @@
1
- import { C as CalendarThemeProvider, D as mergeTheme, E as defaultTheme, O as useCalendarTheme, S as CalendarTheme, T as darkTheme, _ as RenderEvent, a as MonthPagerProps, b as WeekStartsOn, c as BusinessHours, d as EventAccessibilityLabelContext, f as EventAccessibilityLabeler, g as RecurrenceRule, h as RecurrenceFrequency, i as MonthPager, l as CalendarEvent, m as ICalendarEvent, n as MonthList, o as MonthView, p as EventKeyExtractor, r as MonthListProps, s as MonthViewProps, t as DefaultMonthEvent, u as CalendarMode, v as RenderEventArgs, w as PartialCalendarTheme, x as WeekdayFormat, y as TimeGridMode } from "./DefaultMonthEvent-BW6qy50X.js";
1
+ import { A as darkTheme, C as RenderEventArgs, D as CalendarTheme, E as WeekdayFormat, M as mergeTheme, N as useCalendarTheme, O as CalendarThemeProvider, S as RenderEvent, T as WeekStartsOn, _ as EventAccessibilityLabeler, a as MonthPager, b as RecurrenceFrequency, c as MonthViewProps, d as SlotDefault, f as SlotStyleProps, g as EventAccessibilityLabelContext, h as CalendarMode, i as MonthListSlot, j as defaultTheme, k as PartialCalendarTheme, l as MonthViewSlot, m as CalendarEvent, n as MonthList, o as MonthPagerProps, p as BusinessHours, r as MonthListProps, s as MonthView, t as DefaultMonthEvent, u as ResolvedSlot, v as EventKeyExtractor, w as TimeGridMode, x as RecurrenceRule, y as ICalendarEvent } from "./DefaultMonthEvent-BSvuJUFk.js";
2
2
  import { Locale } from "date-fns";
3
3
  import { ComponentType, ReactElement } from "react";
4
4
  import { StyleProp, ViewStyle } from "react-native";
5
5
  import { SharedValue, useSharedValue } from "react-native-reanimated";
6
- import { CalendarEvent as CalendarEvent$1, DateRange, DateSelectionConstraints, DaySelectionState, EventAccessibilityLabeler as EventAccessibilityLabeler$1, MonthGrid, MonthGridDay, MonthGridWeek, MonthGridWeekday, PositionedEvent, UseDateRangeOptions, UseMonthGridOptions, WeekdayFormat as WeekdayFormat$1, buildMonthGrid, buildMonthWeeks, daySelectionState, eventsInTimeZone, expandRecurringEvents, getIsToday, getViewDays, getWeekDays, isAllDayEvent, isDateSelectable, isRangeEndpoint, isSameCalendarDay, isWeekend, isWithinDateRange, layoutDayEvents, minutesIntoDay, nextDateRange, toZonedTime, useDateRange, useMonthGrid, weekdayFormatToken } from "@super-calendar/core";
7
-
6
+ import { CalendarEvent as CalendarEvent$1, DateRange, DateSelectionConstraints, DaySelectionState, EventAccessibilityLabeler as EventAccessibilityLabeler$1, ICalEvent, MonthGrid, MonthGridDay, MonthGridWeek, MonthGridWeekday, PositionedEvent, ToICalendarOptions, UseDateRangeOptions, UseMonthGridOptions, WeekdayFormat as WeekdayFormat$1, buildMonthGrid, buildMonthWeeks, daySelectionState, eventsInTimeZone, expandRecurringEvents, getIsToday, getViewDays, getWeekDays, isAllDayEvent, isDateSelectable, isRangeEndpoint, isSameCalendarDay, isWeekend, isWithinDateRange, layoutDayEvents, minutesIntoDay, nextDateRange, parseICalendar, toICalendar, toZonedTime, useDateRange, useMonthGrid, weekdayFormatToken } from "@super-calendar/core";
7
+ //#region src/components/Agenda.d.ts
8
+ /**
9
+ * The styleable parts of {@link Agenda}. Mirrors the dom renderer's slot names;
10
+ * the event itself is styled by `renderEvent` (or the theme), not a slot.
11
+ */
12
+ type AgendaSlot = "dayHeader" | "eventRow" | "empty";
13
+ /** Props for {@link Agenda}, the day-grouped list view of events. */
14
+ type AgendaProps<T> = SlotStyleProps<AgendaSlot> & {
15
+ events: CalendarEvent<T>[];
16
+ locale?: Locale;
17
+ renderEvent: RenderEvent<T>;
18
+ keyExtractor: EventKeyExtractor<T>;
19
+ onPressEvent: (event: CalendarEvent<T>) => void;
20
+ onLongPressEvent?: (event: CalendarEvent<T>) => void;
21
+ onPressDay?: (date: Date) => void;
22
+ /** Highlight this date's header instead of the real "today". */
23
+ activeDate?: Date;
24
+ /** Drawn between rows of the agenda list. */
25
+ itemSeparatorComponent?: ComponentType<unknown> | null;
26
+ };
27
+ /**
28
+ * A vertical, day-grouped list of events (no time grid). Events are sorted by
29
+ * start, grouped under a date header per day. The consumer controls which
30
+ * events (and therefore which date range) are shown.
31
+ */
32
+ declare function Agenda<T>({ events, locale, renderEvent, keyExtractor, onPressEvent, onLongPressEvent, onPressDay, activeDate, itemSeparatorComponent, classNames, styles: styleOverrides }: AgendaProps<T>): ReactElement;
33
+ //#endregion
8
34
  //#region src/components/TimeGrid.d.ts
9
35
  /** Default height in pixels of one hour row on the time grid. */
10
36
  declare const DEFAULT_HOUR_HEIGHT = 48;
@@ -23,9 +49,21 @@ type EventDragHandler<T> = (event: CalendarEvent<T>, start: Date, end: Date) =>
23
49
  type EventDragStartHandler<T> = (event: CalendarEvent<T>) => void;
24
50
  /** Replace the hour-axis label. Receives the hour (0–23) and the `ampm` flag. */
25
51
  type HourRenderer = (hour: number, ampm: boolean) => React.ReactNode;
52
+ /**
53
+ * The styleable parts of {@link TimeGrid}. Mirrors the dom renderer's slot names
54
+ * where the structure matches; `columnHeaderDateText`, `weekendShade` and
55
+ * `daySeparator` are native-only (the dom grid styles those through its
56
+ * `dayColumn`/`columnHeaderDate` elements). Slots rendered as Reanimated views
57
+ * (`gridLines` sub-hour dividers, `businessHours`, `weekendShade`,
58
+ * `daySeparator`, `event`, `nowIndicator`, `createGhost`) always honour the
59
+ * `styles` map; their `className` reaches the element but needs a Tailwind
60
+ * runtime that styles Animated components.
61
+ */
62
+ type TimeGridSlot = "header" | "weekNumber" | "columnHeader" | "columnHeaderWeekday" | "columnHeaderDate" | "columnHeaderDateText" | "allDayLane" | "allDayLabel" | "allDayColumn" | "allDayEvent" | "hourLabel" | "gridLines" | "businessHours" | "weekendShade" | "daySeparator" | "event" | "nowIndicator" | "createGhost";
26
63
  /** Props for {@link TimeGrid}, the day/week timetable view. */
27
- type TimeGridProps<T> = {
28
- mode: TimeGridMode; /** Day columns to show in `custom` mode. Ignored by day/3days/week. Default 1. */
64
+ type TimeGridProps<T> = SlotStyleProps<TimeGridSlot> & {
65
+ mode: TimeGridMode;
66
+ /** Day columns to show in `custom` mode. Ignored by day/3days/week. Default 1. */
29
67
  numberOfDays?: number;
30
68
  /**
31
69
  * Last weekday of a `custom` partial-week view (0–6). When set, `custom` shows
@@ -35,9 +73,11 @@ type TimeGridProps<T> = {
35
73
  weekEndsOn?: WeekStartsOn;
36
74
  date: Date;
37
75
  events: CalendarEvent<T>[];
38
- cellHeight: SharedValue<number>; /** Initial per-hour row height in px; seeds scroll/zoom without reading the shared value during render. */
76
+ cellHeight: SharedValue<number>;
77
+ /** Initial per-hour row height in px; seeds scroll/zoom without reading the shared value during render. */
39
78
  hourHeight?: number;
40
- weekStartsOn: WeekStartsOn; /** Column-header weekday label width: `narrow` ("M"), `short` ("Mon", default), or `long` ("Monday"). */
79
+ weekStartsOn: WeekStartsOn;
80
+ /** Column-header weekday label width: `narrow` ("M"), `short` ("Mon", default), or `long` ("Monday"). */
41
81
  weekdayFormat?: WeekdayFormat$1;
42
82
  renderEvent: RenderEvent<T>;
43
83
  /**
@@ -48,30 +88,48 @@ type TimeGridProps<T> = {
48
88
  eventAccessibilityLabel?: EventAccessibilityLabeler$1<T>;
49
89
  keyExtractor: EventKeyExtractor<T>;
50
90
  scrollOffsetMinutes?: number;
51
- hourColumnWidth?: number; /** Hide the left hour-axis column (lines stay, labels/gutter go). Default false. */
52
- hideHours?: boolean; /** Sub-hour divider lines per hour (e.g. 2 = half-hours). Default 1 (none). */
53
- timeslots?: number; /** Show the all-day lane above the grid. Default true. */
54
- showAllDayEventCell?: boolean; /** Per-date style merged onto each day column. */
91
+ hourColumnWidth?: number;
92
+ /** Hide the left hour-axis column (lines stay, labels/gutter go). Default false. */
93
+ hideHours?: boolean;
94
+ /** Sub-hour divider lines per hour (e.g. 2 = half-hours). Default 1 (none). */
95
+ timeslots?: number;
96
+ /** Show the all-day lane above the grid. Default true. */
97
+ showAllDayEventCell?: boolean;
98
+ /** Per-date style merged onto each day column. */
55
99
  calendarCellStyle?: (date: Date) => StyleProp<ViewStyle>;
56
- businessHours?: BusinessHours; /** Show the ISO week number in the header gutter. Default false. */
57
- showWeekNumber?: boolean; /** Element rendered between the day header and the grid. */
58
- headerComponent?: React.ReactNode; /** First hour shown (0–23). Default 0. */
59
- minHour?: number; /** Last hour shown, exclusive (1–24). Default 24. */
60
- maxHour?: number; /** Show hour labels in 12-hour AM/PM form. Default false (24h). */
61
- ampm?: boolean; /** Reverse day-column order (right-to-left). Default false. */
100
+ businessHours?: BusinessHours;
101
+ /** Show the ISO week number in the header gutter. Default false. */
102
+ showWeekNumber?: boolean;
103
+ /** Element rendered between the day header and the grid. */
104
+ headerComponent?: React.ReactNode;
105
+ /** First hour shown (0–23). Default 0. */
106
+ minHour?: number;
107
+ /** Last hour shown, exclusive (1–24). Default 24. */
108
+ maxHour?: number;
109
+ /** Show hour labels in 12-hour AM/PM form. Default false (24h). */
110
+ ampm?: boolean;
111
+ /** Reverse day-column order (right-to-left). Default false. */
62
112
  isRTL?: boolean;
63
113
  minHourHeight?: number;
64
114
  maxHourHeight?: number;
65
115
  showNowIndicator?: boolean;
66
116
  locale?: Locale;
67
- freeSwipe?: boolean; /** Allow swiping between pages. Default true. */
68
- swipeEnabled?: boolean; /** Show the vertical scroll indicator on the time grid. Default true. */
69
- showVerticalScrollIndicator?: boolean; /** Allow vertical scrolling of the time grid. Default true. */
70
- verticalScrollEnabled?: boolean; /** Prefix for the week-number label (e.g. "W"). Default "W". */
71
- weekNumberPrefix?: string; /** Replace the hour-axis label. Receives the hour (0–23) and `ampm`. */
72
- hourComponent?: HourRenderer; /** Highlight this date in the header instead of the real "today". */
73
- activeDate?: Date; /** After an empty-cell press, snap the pager back to the active page. Default false. */
74
- resetPageOnPressCell?: boolean; /** Minutes a drag-to-move/resize snaps to. Default 15. */
117
+ freeSwipe?: boolean;
118
+ /** Allow swiping between pages. Default true. */
119
+ swipeEnabled?: boolean;
120
+ /** Show the vertical scroll indicator on the time grid. Default true. */
121
+ showVerticalScrollIndicator?: boolean;
122
+ /** Allow vertical scrolling of the time grid. Default true. */
123
+ verticalScrollEnabled?: boolean;
124
+ /** Prefix for the week-number label (e.g. "W"). Default "W". */
125
+ weekNumberPrefix?: string;
126
+ /** Replace the hour-axis label. Receives the hour (0–23) and `ampm`. */
127
+ hourComponent?: HourRenderer;
128
+ /** Highlight this date in the header instead of the real "today". */
129
+ activeDate?: Date;
130
+ /** After an empty-cell press, snap the pager back to the active page. Default false. */
131
+ resetPageOnPressCell?: boolean;
132
+ /** Minutes a drag-to-move/resize snaps to. Default 15. */
75
133
  dragStepMinutes?: number;
76
134
  /**
77
135
  * Show the resize grip on draggable events. Default true. Set false to keep
@@ -84,66 +142,19 @@ type TimeGridProps<T> = {
84
142
  * Enable drag-to-move and drag-to-resize on the week/day grid. Called with the
85
143
  * event's new start/end (snapped to `dragStepMinutes`); update your own state.
86
144
  */
87
- onDragEvent?: EventDragHandler<T>; /** Fired the moment an event is grabbed for a move or resize (e.g. for haptics). */
145
+ onDragEvent?: EventDragHandler<T>;
146
+ /** Fired the moment an event is grabbed for a move or resize (e.g. for haptics). */
88
147
  onDragStart?: EventDragStartHandler<T>;
89
148
  onPressCell?: (date: Date) => void;
90
149
  onLongPressCell?: (date: Date) => void;
91
- onCreateEvent?: (start: Date, end: Date) => void; /** Tap a day's column header (default header only). */
150
+ onCreateEvent?: (start: Date, end: Date) => void;
151
+ /** Tap a day's column header (default header only). */
92
152
  onPressDateHeader?: (date: Date) => void;
93
- onChangeDate: (date: Date) => void; /** Optional header above the grid (e.g. weekday labels). Rendered full-width. */
153
+ onChangeDate: (date: Date) => void;
154
+ /** Optional header above the grid (e.g. weekday labels). Rendered full-width. */
94
155
  renderHeader?: (days: Date[]) => React.ReactNode;
95
156
  };
96
- declare function TimeGridInner<T>({
97
- mode,
98
- numberOfDays,
99
- weekEndsOn,
100
- date,
101
- events,
102
- cellHeight,
103
- hourHeight,
104
- weekStartsOn,
105
- weekdayFormat,
106
- renderEvent,
107
- eventAccessibilityLabel,
108
- keyExtractor,
109
- scrollOffsetMinutes,
110
- hourColumnWidth: hourColumnWidthProp,
111
- hideHours,
112
- timeslots,
113
- showAllDayEventCell,
114
- calendarCellStyle,
115
- businessHours,
116
- showWeekNumber,
117
- headerComponent,
118
- minHour,
119
- maxHour,
120
- ampm,
121
- isRTL,
122
- minHourHeight,
123
- maxHourHeight,
124
- showNowIndicator,
125
- locale,
126
- freeSwipe,
127
- swipeEnabled,
128
- showVerticalScrollIndicator,
129
- verticalScrollEnabled,
130
- weekNumberPrefix,
131
- hourComponent,
132
- activeDate,
133
- resetPageOnPressCell,
134
- dragStepMinutes,
135
- showDragHandle,
136
- onPressEvent,
137
- onLongPressEvent,
138
- onDragEvent,
139
- onDragStart,
140
- onPressCell,
141
- onLongPressCell,
142
- onCreateEvent,
143
- onPressDateHeader,
144
- onChangeDate,
145
- renderHeader
146
- }: TimeGridProps<T>): ReactElement;
157
+ declare function TimeGridInner<T>({ mode, numberOfDays, weekEndsOn, date, events, cellHeight, hourHeight, weekStartsOn, weekdayFormat, renderEvent, eventAccessibilityLabel, keyExtractor, scrollOffsetMinutes, hourColumnWidth: hourColumnWidthProp, hideHours, timeslots, showAllDayEventCell, calendarCellStyle, businessHours, showWeekNumber, headerComponent, minHour, maxHour, ampm, isRTL, minHourHeight, maxHourHeight, showNowIndicator, locale, freeSwipe, swipeEnabled, showVerticalScrollIndicator, verticalScrollEnabled, weekNumberPrefix, hourComponent, activeDate, resetPageOnPressCell, dragStepMinutes, showDragHandle, onPressEvent, onLongPressEvent, onDragEvent, onDragStart, onPressCell, onLongPressCell, onCreateEvent, onPressDateHeader, onChangeDate, renderHeader, classNames, styles: styleOverrides }: TimeGridProps<T>): ReactElement;
147
158
  /**
148
159
  * The timetable view used in day, 3days, week, and custom modes: an
149
160
  * hour-by-hour grid with positioned event boxes, an all-day lane, pinch-to-zoom
@@ -166,14 +177,22 @@ declare function TimeGridInner<T>({
166
177
  declare const TimeGrid: typeof TimeGridInner;
167
178
  //#endregion
168
179
  //#region src/components/Calendar.d.ts
180
+ /**
181
+ * Every styleable slot across the Calendar's views. The month slots reach the
182
+ * month pager, the grid slots reach the time grid, and the agenda slots reach
183
+ * the schedule view; slots for views that aren't rendered are ignored.
184
+ */
185
+ type CalendarSlot = MonthViewSlot | TimeGridSlot | AgendaSlot;
169
186
  /** Props for the {@link Calendar} component. */
170
- type CalendarProps<T> = {
187
+ type CalendarProps<T> = SlotStyleProps<CalendarSlot> & {
171
188
  events: CalendarEvent<T>[];
172
189
  mode: CalendarMode;
173
190
  date: Date;
174
- onChangeDate: (date: Date) => void; /** Fired alongside `onChangeDate` with the `[start, end]` of the newly-visible range. */
191
+ onChangeDate: (date: Date) => void;
192
+ /** Fired alongside `onChangeDate` with the `[start, end]` of the newly-visible range. */
175
193
  onChangeDateRange?: (range: [Date, Date]) => void;
176
- onPressEvent: (event: CalendarEvent<T>) => void; /** Long-press an event (month/week/day). */
194
+ onPressEvent: (event: CalendarEvent<T>) => void;
195
+ /** Long-press an event (month/week/day). */
177
196
  onLongPressEvent?: (event: CalendarEvent<T>) => void;
178
197
  /**
179
198
  * Enable drag-to-move and drag-to-resize on the week/day grid. Called with the
@@ -190,18 +209,25 @@ type CalendarProps<T> = {
190
209
  * `Haptics.impactAsync()` from `expo-haptics`. Native-only and inert unless
191
210
  * `onDragEvent` is also set.
192
211
  */
193
- onDragStart?: EventDragStartHandler<T>; /** Minutes a drag-to-move/resize snaps to. Default 15. */
212
+ onDragStart?: EventDragStartHandler<T>;
213
+ /** Minutes a drag-to-move/resize snaps to. Default 15. */
194
214
  dragStepMinutes?: number;
195
215
  /**
196
216
  * Show the resize grip on draggable events. Default true. Set false to keep
197
217
  * drag-to-move and drag-to-resize working while hiding the visible indicator.
198
218
  */
199
- showDragHandle?: boolean; /** Tap a day cell (month mode) — e.g. drill into the day view. */
200
- onPressDay?: (date: Date) => void; /** Long-press a day cell (month mode). */
201
- onLongPressDay?: (date: Date) => void; /** Tap the "+N more" overflow label in a month cell. */
202
- onPressMore?: (events: CalendarEvent<T>[], date: Date) => void; /** Tap empty space on the week/day grid; receives the date+time pressed. */
203
- onPressCell?: (date: Date) => void; /** After an empty-cell press, snap the pager back to the active page. Default false. */
204
- resetPageOnPressCell?: boolean; /** Long-press empty space on the week/day grid; receives the date+time. */
219
+ showDragHandle?: boolean;
220
+ /** Tap a day cell (month mode) — e.g. drill into the day view. */
221
+ onPressDay?: (date: Date) => void;
222
+ /** Long-press a day cell (month mode). */
223
+ onLongPressDay?: (date: Date) => void;
224
+ /** Tap the "+N more" overflow label in a month cell. */
225
+ onPressMore?: (events: CalendarEvent<T>[], date: Date) => void;
226
+ /** Tap empty space on the week/day grid; receives the date+time pressed. */
227
+ onPressCell?: (date: Date) => void;
228
+ /** After an empty-cell press, snap the pager back to the active page. Default false. */
229
+ resetPageOnPressCell?: boolean;
230
+ /** Long-press empty space on the week/day grid; receives the date+time. */
205
231
  onLongPressCell?: (date: Date) => void;
206
232
  /**
207
233
  * Enable drag-to-create on the week/day grid: long-press empty space and drag
@@ -210,74 +236,115 @@ type CalendarProps<T> = {
210
236
  * stationary press yields a one-step range. Native-only; supersedes
211
237
  * `onLongPressCell` on empty space when set.
212
238
  */
213
- onCreateEvent?: (start: Date, end: Date) => void; /** Tap a day's column header on the week/day grid (default header only). */
239
+ onCreateEvent?: (start: Date, end: Date) => void;
240
+ /** Tap a day's column header on the week/day grid (default header only). */
214
241
  onPressDateHeader?: (date: Date) => void;
215
242
  /**
216
243
  * Max event chips per month cell before they collapse into "+N more". Omit to
217
244
  * auto-fit as many as the cell height allows (default); set a number for a
218
245
  * fixed cap. Pass an explicit value when using a custom `renderEvent`.
219
246
  */
220
- maxVisibleEventCount?: number; /** Sort each month day's events by start. Default true. */
221
- sortedMonthView?: boolean; /** Month overflow label template; `{moreCount}` is replaced. Default "{moreCount} More". */
222
- moreLabel?: string; /** Show dimmed adjacent-month days in the month grid. Default true. */
223
- showAdjacentMonths?: boolean; /** Ignore taps on month-cell events (day taps still fire). Default false. */
224
- disableMonthEventCellPress?: boolean; /** First day of the week. Sunday = 0 (default) … Saturday = 6. */
225
- weekStartsOn?: WeekStartsOn; /** Weekday header label width: `narrow` ("M"), `short` ("Mon", default), or `long` ("Monday"). */
226
- weekdayFormat?: WeekdayFormat$1; /** Number of day columns when `mode="custom"`. Ignored by other modes. Default 1. */
247
+ maxVisibleEventCount?: number;
248
+ /** Sort each month day's events by start. Default true. */
249
+ sortedMonthView?: boolean;
250
+ /** Month overflow label template; `{moreCount}` is replaced. Default "{moreCount} More". */
251
+ moreLabel?: string;
252
+ /** Show dimmed adjacent-month days in the month grid. Default true. */
253
+ showAdjacentMonths?: boolean;
254
+ /** Ignore taps on month-cell events (day taps still fire). Default false. */
255
+ disableMonthEventCellPress?: boolean;
256
+ /** First day of the week. Sunday = 0 (default) … Saturday = 6. */
257
+ weekStartsOn?: WeekStartsOn;
258
+ /** Weekday header label width: `narrow` ("M"), `short` ("Mon", default), or `long` ("Monday"). */
259
+ weekdayFormat?: WeekdayFormat$1;
260
+ /** Number of day columns when `mode="custom"`. Ignored by other modes. Default 1. */
227
261
  numberOfDays?: number;
228
262
  /**
229
263
  * Last weekday of a `custom` partial-week view (0–6). When set, `custom` shows
230
264
  * `weekStartsOn`…`weekEndsOn` of the visible week and pages by week, taking
231
265
  * precedence over `numberOfDays`. Ignored by other modes.
232
266
  */
233
- weekEndsOn?: WeekStartsOn; /** Replace the built-in event box. Return a `flex: 1` element. */
267
+ weekEndsOn?: WeekStartsOn;
268
+ /** Replace the built-in event box. Return a `flex: 1` element. */
234
269
  renderEvent?: RenderEvent<T>;
235
270
  /**
236
271
  * Override the screen-reader label for each event. Receives the event and a
237
272
  * `{ mode, isAllDay, ampm }` context; return the full text to announce. Applies
238
273
  * across every view. Defaults to the built-in title-and-time label.
239
274
  */
240
- eventAccessibilityLabel?: EventAccessibilityLabeler$1<T>; /** Per-event style merged onto the built-in event box (static or a function of the event). */
241
- eventCellStyle?: StyleProp<ViewStyle> | ((event: CalendarEvent<T>) => StyleProp<ViewStyle>); /** Per-date style for month cells and week/day columns (e.g. shade specific dates). */
275
+ eventAccessibilityLabel?: EventAccessibilityLabeler$1<T>;
276
+ /** Per-event style merged onto the built-in event box (static or a function of the event). */
277
+ eventCellStyle?: StyleProp<ViewStyle> | ((event: CalendarEvent<T>) => StyleProp<ViewStyle>);
278
+ /** Per-date style for month cells and week/day columns (e.g. shade specific dates). */
242
279
  calendarCellStyle?: (date: Date) => StyleProp<ViewStyle>;
243
280
  /**
244
281
  * Week/day grid only: open hours per day for business-hours shading. Hours
245
282
  * outside the returned `{ start, end }` are tinted; return `null` to shade the
246
283
  * whole day (closed). Omit for no shading.
247
284
  */
248
- businessHours?: BusinessHours; /** Stable key per event. Defaults to start-time + index. */
249
- keyExtractor?: EventKeyExtractor<T>; /** Partial theme merged over the defaults. */
250
- theme?: PartialCalendarTheme; /** Externally-owned per-hour row height (week/day). Created internally if omitted. */
251
- cellHeight?: ReturnType<typeof useSharedValue<number>>; /** Initial per-hour row height in px (week/day). Default 48. */
285
+ businessHours?: BusinessHours;
286
+ /** Stable key per event. Defaults to start-time + index. */
287
+ keyExtractor?: EventKeyExtractor<T>;
288
+ /** Partial theme merged over the defaults. */
289
+ theme?: PartialCalendarTheme;
290
+ /** Externally-owned per-hour row height (week/day). Created internally if omitted. */
291
+ cellHeight?: ReturnType<typeof useSharedValue<number>>;
292
+ /** Initial per-hour row height in px (week/day). Default 48. */
252
293
  hourHeight?: number;
253
294
  minHourHeight?: number;
254
295
  maxHourHeight?: number;
255
- hourColumnWidth?: number; /** Hide the left hour-axis column on the week/day grid. Default false. */
256
- hideHours?: boolean; /** Sub-hour divider lines per hour on the week/day grid (e.g. 2 = half-hours). Default 1. */
296
+ hourColumnWidth?: number;
297
+ /** Hide the left hour-axis column on the week/day grid. Default false. */
298
+ hideHours?: boolean;
299
+ /** Sub-hour divider lines per hour on the week/day grid (e.g. 2 = half-hours). Default 1. */
257
300
  timeslots?: number;
258
301
  /**
259
302
  * Show the all-day lane above the week/day grid. Default true. When false the
260
303
  * lane is never rendered, so all-day events (see `ICalendarEvent.allDay` and
261
304
  * whole-day spans) are not shown on the time grid.
262
305
  */
263
- showAllDayEventCell?: boolean; /** Show the ISO week number in the week/day header gutter. Default false. */
264
- showWeekNumber?: boolean; /** Prefix for the week-number label (e.g. "W"). Default "W". */
265
- weekNumberPrefix?: string; /** Replace the hour-axis label on the week/day grid. Receives the hour (0–23) and `ampm`. */
266
- hourComponent?: HourRenderer; /** Always render six week rows in month view, for a fixed-height grid. Default false. */
267
- showSixWeeks?: boolean; /** Allow swiping between pages (all modes). Default true. */
268
- swipeEnabled?: boolean; /** Show the vertical scroll indicator on the week/day grid. Default true. */
269
- showVerticalScrollIndicator?: boolean; /** Allow vertical scrolling of the week/day grid. Default true. */
270
- verticalScrollEnabled?: boolean; /** Element rendered between the day header and the week/day grid. */
271
- headerComponent?: React.ReactNode; /** First hour shown on the week/day grid (0–23). Default 0. */
272
- minHour?: number; /** Last hour shown on the week/day grid, exclusive (1–24). Default 24. */
273
- maxHour?: number; /** Show hour labels (and built-in event times) in 12-hour AM/PM form. Default false (24h). */
274
- ampm?: boolean; /** Show the time range in the built-in event renderer (day/week/schedule). Default true. */
275
- showTime?: boolean; /** Add a trailing ellipsis (…) when an event title overflows in the built-in renderer; otherwise the text is clipped. Default false. */
276
- ellipsizeTitle?: boolean; /** Label the built-in renderer shows for an all-day event in the schedule (and its screen-reader text). Default "All day". */
277
- allDayLabel?: string; /** Initial vertical scroll, in minutes from midnight (week/day). */
278
- scrollOffsetMinutes?: number; /** Show the current-time line on the week/day grid. Default true. */
279
- showNowIndicator?: boolean; /** A date-fns `Locale` for weekday/date labels. Defaults to English. */
280
- locale?: Locale; /** Highlight this date (header/cell/agenda) instead of the real "today". */
306
+ showAllDayEventCell?: boolean;
307
+ /** Show the ISO week number in the week/day header gutter. Default false. */
308
+ showWeekNumber?: boolean;
309
+ /** Prefix for the week-number label (e.g. "W"). Default "W". */
310
+ weekNumberPrefix?: string;
311
+ /** Replace the hour-axis label on the week/day grid. Receives the hour (0–23) and `ampm`. */
312
+ hourComponent?: HourRenderer;
313
+ /** Always render six week rows in month view, for a fixed-height grid. Default false. */
314
+ showSixWeeks?: boolean;
315
+ /** Allow swiping between pages (all modes). Default true. */
316
+ swipeEnabled?: boolean;
317
+ /** Show the vertical scroll indicator on the week/day grid. Default true. */
318
+ showVerticalScrollIndicator?: boolean;
319
+ /** Allow vertical scrolling of the week/day grid. Default true. */
320
+ verticalScrollEnabled?: boolean;
321
+ /** Element rendered between the day header and the week/day grid. */
322
+ headerComponent?: React.ReactNode;
323
+ /** First hour shown on the week/day grid (0–23). Default 0. */
324
+ minHour?: number;
325
+ /** Last hour shown on the week/day grid, exclusive (1–24). Default 24. */
326
+ maxHour?: number;
327
+ /** Show hour labels (and built-in event times) in 12-hour AM/PM form. Default false (24h). */
328
+ ampm?: boolean;
329
+ /** Show the time range in the built-in event renderer (day/week/schedule). Default true. */
330
+ showTime?: boolean;
331
+ /** Add a trailing ellipsis (…) when an event title overflows in the built-in renderer; otherwise the text is clipped. Default false. */
332
+ ellipsizeTitle?: boolean;
333
+ /** Label the built-in renderer shows for an all-day event in the schedule (and its screen-reader text). Default "All day". */
334
+ allDayLabel?: string;
335
+ /** Initial vertical scroll, in minutes from midnight (week/day). */
336
+ scrollOffsetMinutes?: number;
337
+ /** Show the current-time line on the week/day grid. Default true. */
338
+ showNowIndicator?: boolean;
339
+ /** A date-fns `Locale` for weekday/date labels. Defaults to English. */
340
+ locale?: Locale;
341
+ /**
342
+ * Display events in this IANA time zone (e.g. `"America/New_York"`), DST-correct
343
+ * and independent of the device zone. Display-only: it shifts the wall-clock the
344
+ * grid lays out from, it doesn't change your `Date`s. Uses `eventsInTimeZone`.
345
+ */
346
+ timeZone?: string;
347
+ /** Highlight this date (header/cell/agenda) instead of the real "today". */
281
348
  activeDate?: Date;
282
349
  /**
283
350
  * Lay the day columns out right-to-left (month, week/day grid and all-day lane).
@@ -290,15 +357,18 @@ type CalendarProps<T> = {
290
357
  * Allow a fling to carry across several pages before snapping. Default false:
291
358
  * one day/week/month per swipe.
292
359
  */
293
- freeSwipe?: boolean; /** Custom header above the week/day grid. Receives the visible days. */
294
- renderTimeGridHeader?: (days: Date[]) => React.ReactNode; /** Replace the weekday-label header above the month grid. Return `null` to hide it. */
360
+ freeSwipe?: boolean;
361
+ /** Custom header above the week/day grid. Receives the visible days. */
362
+ renderTimeGridHeader?: (days: Date[]) => React.ReactNode;
363
+ /** Replace the weekday-label header above the month grid. Return `null` to hide it. */
295
364
  renderHeaderForMonthView?: (weekDays: Date[]) => React.ReactNode;
296
365
  /**
297
366
  * Month mode only: replace the default date badge in each day cell. Receives
298
367
  * the day; return your own date label (e.g. a number with a dot or badge).
299
368
  * Event chips and the "+N more" label still render below it.
300
369
  */
301
- renderCustomDateForMonth?: (date: Date) => React.ReactNode; /** Drawn between rows of the `schedule` (agenda) list. */
370
+ renderCustomDateForMonth?: (date: Date) => React.ReactNode;
371
+ /** Drawn between rows of the `schedule` (agenda) list. */
302
372
  itemSeparatorComponent?: React.ComponentType<unknown> | null;
303
373
  };
304
374
  /**
@@ -327,105 +397,7 @@ type CalendarProps<T> = {
327
397
  * }
328
398
  * ```
329
399
  */
330
- declare function Calendar<T>({
331
- events,
332
- mode,
333
- date,
334
- onChangeDate,
335
- onChangeDateRange,
336
- onPressEvent,
337
- onLongPressEvent,
338
- onDragEvent,
339
- onDragStart,
340
- dragStepMinutes,
341
- showDragHandle,
342
- onPressDay,
343
- onLongPressDay,
344
- onPressMore,
345
- onPressCell,
346
- resetPageOnPressCell,
347
- onLongPressCell,
348
- onCreateEvent,
349
- onPressDateHeader,
350
- maxVisibleEventCount,
351
- sortedMonthView,
352
- moreLabel,
353
- showAdjacentMonths,
354
- disableMonthEventCellPress,
355
- weekStartsOn,
356
- weekdayFormat,
357
- numberOfDays,
358
- weekEndsOn,
359
- renderEvent,
360
- eventAccessibilityLabel,
361
- eventCellStyle,
362
- calendarCellStyle,
363
- businessHours,
364
- keyExtractor,
365
- theme,
366
- cellHeight: cellHeightProp,
367
- hourHeight,
368
- minHourHeight,
369
- maxHourHeight,
370
- hourColumnWidth,
371
- hideHours,
372
- timeslots,
373
- showAllDayEventCell,
374
- showWeekNumber,
375
- weekNumberPrefix,
376
- hourComponent,
377
- showSixWeeks,
378
- swipeEnabled,
379
- showVerticalScrollIndicator,
380
- verticalScrollEnabled,
381
- headerComponent,
382
- minHour,
383
- maxHour,
384
- ampm,
385
- showTime,
386
- ellipsizeTitle,
387
- allDayLabel,
388
- scrollOffsetMinutes,
389
- showNowIndicator,
390
- locale,
391
- activeDate,
392
- isRTL,
393
- freeSwipe,
394
- renderTimeGridHeader,
395
- renderHeaderForMonthView,
396
- renderCustomDateForMonth,
397
- itemSeparatorComponent
398
- }: CalendarProps<T>): ReactElement;
399
- //#endregion
400
- //#region src/components/Agenda.d.ts
401
- /** Props for {@link Agenda}, the day-grouped list view of events. */
402
- type AgendaProps<T> = {
403
- events: CalendarEvent<T>[];
404
- locale?: Locale;
405
- renderEvent: RenderEvent<T>;
406
- keyExtractor: EventKeyExtractor<T>;
407
- onPressEvent: (event: CalendarEvent<T>) => void;
408
- onLongPressEvent?: (event: CalendarEvent<T>) => void;
409
- onPressDay?: (date: Date) => void; /** Highlight this date's header instead of the real "today". */
410
- activeDate?: Date; /** Drawn between rows of the agenda list. */
411
- itemSeparatorComponent?: ComponentType<unknown> | null;
412
- };
413
- /**
414
- * A vertical, day-grouped list of events (no time grid). Events are sorted by
415
- * start, grouped under a date header per day. The consumer controls which
416
- * events (and therefore which date range) are shown.
417
- */
418
- declare function Agenda<T>({
419
- events,
420
- locale,
421
- renderEvent,
422
- keyExtractor,
423
- onPressEvent,
424
- onLongPressEvent,
425
- onPressDay,
426
- activeDate,
427
- itemSeparatorComponent
428
- }: AgendaProps<T>): ReactElement;
400
+ declare function Calendar<T>({ events, mode, date, onChangeDate, onChangeDateRange, onPressEvent, onLongPressEvent, onDragEvent, onDragStart, dragStepMinutes, showDragHandle, onPressDay, onLongPressDay, onPressMore, onPressCell, resetPageOnPressCell, onLongPressCell, onCreateEvent, onPressDateHeader, maxVisibleEventCount, sortedMonthView, moreLabel, showAdjacentMonths, disableMonthEventCellPress, weekStartsOn, weekdayFormat, numberOfDays, weekEndsOn, renderEvent, eventAccessibilityLabel, eventCellStyle, calendarCellStyle, businessHours, keyExtractor, theme, cellHeight: cellHeightProp, hourHeight, minHourHeight, maxHourHeight, hourColumnWidth, hideHours, timeslots, showAllDayEventCell, showWeekNumber, weekNumberPrefix, hourComponent, showSixWeeks, swipeEnabled, showVerticalScrollIndicator, verticalScrollEnabled, headerComponent, minHour, maxHour, ampm, showTime, ellipsizeTitle, allDayLabel, scrollOffsetMinutes, showNowIndicator, locale, timeZone, activeDate, isRTL, freeSwipe, renderTimeGridHeader, renderHeaderForMonthView, renderCustomDateForMonth, itemSeparatorComponent, classNames, styles: styleOverrides }: CalendarProps<T>): ReactElement;
429
401
  //#endregion
430
402
  //#region src/components/DefaultEvent.d.ts
431
403
  /**
@@ -436,20 +408,7 @@ declare function Agenda<T>({
436
408
  * only shows once a full line is free beneath the title. Pass your own
437
409
  * `renderEvent` to `<Calendar>` to replace it entirely.
438
410
  */
439
- declare function DefaultEvent<T>({
440
- event,
441
- mode,
442
- boxHeight,
443
- isAllDay,
444
- ampm,
445
- showTime,
446
- ellipsizeTitle,
447
- allDayLabel,
448
- accessibilityLabel: accessibilityLabelProp,
449
- cellStyle,
450
- onPress,
451
- onLongPress
452
- }: RenderEventArgs<T>): ReactElement;
411
+ declare function DefaultEvent<T>({ event, mode, boxHeight, isAllDay, ampm, showTime, ellipsizeTitle, allDayLabel, accessibilityLabel: accessibilityLabelProp, accessibilityActions, onAccessibilityAction, cellStyle, onPress, onLongPress }: RenderEventArgs<T>): ReactElement;
453
412
  //#endregion
454
413
  //#region src/components/ResourceTimeline.d.ts
455
414
  /** A schedulable lane (room, person, machine) events are grouped under. */
@@ -462,15 +421,27 @@ interface Resource {
462
421
  /** Props passed to a custom resource-timeline event renderer. */
463
422
  interface ResourceEventArgs<T = unknown> {
464
423
  event: CalendarEvent$1<T>;
465
- /** Pixel width of the event bar. */
424
+ /**
425
+ * Pixel width of the event bar. In the vertical orientation the columns flex
426
+ * to the container, so this is 0 there; size against `height` instead.
427
+ */
466
428
  width: number;
429
+ /** Pixel height of the event bar; set in the vertical orientation. */
430
+ height?: number;
467
431
  onPress: () => void;
468
432
  }
469
433
  /** Props for {@link ResourceTimeline}. */
470
434
  interface ResourceTimelineProps<T = unknown> {
471
- /** The day to lay out along the horizontal axis. */
435
+ /** The day to lay out along the time axis. */
472
436
  date: Date;
473
- /** The rows, top to bottom. */
437
+ /**
438
+ * Lay the day out along the horizontal axis with resources as rows (the
439
+ * default), or down the vertical axis with resources as columns, like the
440
+ * time grid. Vertical reads better on narrow screens: the columns share the
441
+ * width instead of the axis scrolling sideways.
442
+ */
443
+ orientation?: "horizontal" | "vertical";
444
+ /** The resource lanes: rows when horizontal, columns when vertical. */
474
445
  resources: Resource[];
475
446
  /** Events; each is placed in the row named by `resourceId(event)`. */
476
447
  events: CalendarEvent$1<T>[];
@@ -480,11 +451,13 @@ interface ResourceTimelineProps<T = unknown> {
480
451
  startHour?: number;
481
452
  /** Last hour shown, exclusive (default 24). */
482
453
  endHour?: number;
483
- /** Pixels per hour along the axis (default 80). */
454
+ /** Pixels per hour along the horizontal axis (default 80). Horizontal only. */
484
455
  hourWidth?: number;
485
- /** Height of each resource row in px (default 56). */
456
+ /** Pixels per hour down the vertical axis (default 48). Vertical only. */
457
+ hourHeight?: number;
458
+ /** Height of each resource row in px (default 56). Horizontal only. */
486
459
  rowHeight?: number;
487
- /** Width of the left resource-label column in px (default 140). */
460
+ /** Width of the left resource-label column in px (default 140). Horizontal only. */
488
461
  labelWidth?: number;
489
462
  /** 12-hour AM/PM axis labels (default false). */
490
463
  ampm?: boolean;
@@ -492,12 +465,38 @@ interface ResourceTimelineProps<T = unknown> {
492
465
  renderEvent?: ComponentType<ResourceEventArgs<T>>;
493
466
  /** Tap an event. */
494
467
  onPressEvent?: (event: CalendarEvent$1<T>) => void;
468
+ /**
469
+ * Long-press an event. When `onDragEvent` is also set, a long-press picks the
470
+ * bar up to move instead, so this fires only for non-draggable bars.
471
+ */
472
+ onLongPressEvent?: (event: CalendarEvent$1<T>) => void;
495
473
  /**
496
474
  * Enables drag-to-move and edge-resize along the time axis: long-press a bar to
497
475
  * move it, or drag its right edge to resize. Called with the proposed new
498
476
  * start/end; return `false` to reject the drop (it snaps back).
499
477
  */
500
478
  onDragEvent?: (event: CalendarEvent$1<T>, start: Date, end: Date) => void | boolean;
479
+ /** Tap empty lane space; called with the snapped time and the lane's resource. */
480
+ onPressCell?: (at: Date, resource: Resource) => void;
481
+ /**
482
+ * Long-press empty lane space. When `onCreateEvent` is also set, the long-press
483
+ * starts the create drag instead, so this fires only without it.
484
+ */
485
+ onLongPressCell?: (at: Date, resource: Resource) => void;
486
+ /**
487
+ * Long-press empty lane space, then drag along the time axis to sweep out a new
488
+ * event; called with the swept start/end and the lane's resource.
489
+ */
490
+ onCreateEvent?: (start: Date, end: Date, resource: Resource) => void;
491
+ /**
492
+ * Shade the hours outside this window, per lane. Same shape as the Calendar's
493
+ * `businessHours` plus the lane's resource, so per-resource opening hours work
494
+ * (return `null` for a fully closed lane). A date-only function is accepted.
495
+ */
496
+ businessHours?: (date: Date, resource: Resource) => {
497
+ start: number;
498
+ end: number;
499
+ } | null;
501
500
  /** Snap dragged events to this many minutes (default 15). */
502
501
  dragStepMinutes?: number;
503
502
  }
@@ -519,21 +518,6 @@ interface ResourceTimelineProps<T = unknown> {
519
518
  * />
520
519
  * ```
521
520
  */
522
- declare function ResourceTimeline<T = unknown>({
523
- date,
524
- resources,
525
- events,
526
- resourceId,
527
- startHour,
528
- endHour,
529
- hourWidth,
530
- rowHeight,
531
- labelWidth,
532
- ampm,
533
- renderEvent,
534
- onPressEvent,
535
- onDragEvent,
536
- dragStepMinutes
537
- }: ResourceTimelineProps<T>): ReactElement;
521
+ declare function ResourceTimeline<T = unknown>({ date, orientation, resources, events, resourceId, startHour, endHour, hourWidth, hourHeight, rowHeight, labelWidth, ampm, renderEvent, onPressEvent, onLongPressEvent, onDragEvent, onPressCell, onLongPressCell, onCreateEvent, businessHours, dragStepMinutes }: ResourceTimelineProps<T>): ReactElement;
538
522
  //#endregion
539
- export { Agenda, type AgendaProps, type BusinessHours, Calendar, type CalendarEvent, type CalendarMode, type CalendarProps, type CalendarTheme, CalendarThemeProvider, DEFAULT_HOUR_HEIGHT, type DateRange, type DateSelectionConstraints, type DaySelectionState, DefaultEvent, DefaultMonthEvent, type EventAccessibilityLabelContext, type EventAccessibilityLabeler, type EventDragHandler, type EventDragStartHandler, type EventKeyExtractor, type HourRenderer, type ICalendarEvent, type MonthGrid, type MonthGridDay, type MonthGridWeek, type MonthGridWeekday, MonthList, type MonthListProps, MonthPager, type MonthPagerProps, MonthView, type MonthViewProps, type PartialCalendarTheme, type PositionedEvent, type RecurrenceFrequency, type RecurrenceRule, type RenderEvent, type RenderEventArgs, type Resource, type ResourceEventArgs, ResourceTimeline, type ResourceTimelineProps, TimeGrid, type TimeGridMode, type TimeGridProps, type UseDateRangeOptions, type UseMonthGridOptions, type WeekStartsOn, type WeekdayFormat, buildMonthGrid, buildMonthWeeks, darkTheme, daySelectionState, defaultTheme, eventsInTimeZone, expandRecurringEvents, getIsToday, getViewDays, getWeekDays, isAllDayEvent, isDateSelectable, isRangeEndpoint, isSameCalendarDay, isWeekend, isWithinDateRange, layoutDayEvents, mergeTheme, minutesIntoDay, nextDateRange, toZonedTime, useCalendarTheme, useDateRange, useMonthGrid, weekdayFormatToken };
523
+ export { Agenda, type AgendaProps, type AgendaSlot, type BusinessHours, Calendar, type CalendarEvent, type CalendarMode, type CalendarProps, type CalendarSlot, type CalendarTheme, CalendarThemeProvider, DEFAULT_HOUR_HEIGHT, type DateRange, type DateSelectionConstraints, type DaySelectionState, DefaultEvent, DefaultMonthEvent, type EventAccessibilityLabelContext, type EventAccessibilityLabeler, type EventDragHandler, type EventDragStartHandler, type EventKeyExtractor, type HourRenderer, type ICalEvent, type ICalendarEvent, type MonthGrid, type MonthGridDay, type MonthGridWeek, type MonthGridWeekday, MonthList, type MonthListProps, type MonthListSlot, MonthPager, type MonthPagerProps, MonthView, type MonthViewProps, type MonthViewSlot, type PartialCalendarTheme, type PositionedEvent, type RecurrenceFrequency, type RecurrenceRule, type RenderEvent, type RenderEventArgs, type ResolvedSlot, type Resource, type ResourceEventArgs, ResourceTimeline, type ResourceTimelineProps, type SlotDefault, type SlotStyleProps, TimeGrid, type TimeGridMode, type TimeGridProps, type TimeGridSlot, type ToICalendarOptions, type UseDateRangeOptions, type UseMonthGridOptions, type WeekStartsOn, type WeekdayFormat, buildMonthGrid, buildMonthWeeks, darkTheme, daySelectionState, defaultTheme, eventsInTimeZone, expandRecurringEvents, getIsToday, getViewDays, getWeekDays, isAllDayEvent, isDateSelectable, isRangeEndpoint, isSameCalendarDay, isWeekend, isWithinDateRange, layoutDayEvents, mergeTheme, minutesIntoDay, nextDateRange, parseICalendar, toICalendar, toZonedTime, useCalendarTheme, useDateRange, useMonthGrid, weekdayFormatToken };