@svgrid/grid 2.2.27 → 2.2.29

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.
Files changed (248) hide show
  1. package/README.md +199 -199
  2. package/dist/FlexRender.svelte +96 -96
  3. package/dist/GridFooter.svelte +179 -179
  4. package/dist/GridMenus.svelte +782 -734
  5. package/dist/SvAutoComplete.svelte +165 -165
  6. package/dist/SvCalendar.svelte +503 -503
  7. package/dist/SvCarousel.svelte +141 -141
  8. package/dist/SvCheckBox.svelte +101 -101
  9. package/dist/SvColorInput.svelte +181 -181
  10. package/dist/SvComboBox.svelte +275 -275
  11. package/dist/SvContextMenu.svelte +116 -116
  12. package/dist/SvCountryInput.svelte +160 -160
  13. package/dist/SvDrawer.svelte +254 -250
  14. package/dist/SvDropDownList.svelte +374 -374
  15. package/dist/SvDurationInput.svelte +126 -126
  16. package/dist/SvField.svelte +293 -293
  17. package/dist/SvForm.svelte +437 -437
  18. package/dist/SvGrid.controller.svelte.d.ts +14 -1
  19. package/dist/SvGrid.controller.svelte.js +112 -28
  20. package/dist/SvGrid.css +2704 -2723
  21. package/dist/SvGrid.svelte +3361 -3333
  22. package/dist/SvGrid.types.d.ts +20 -5
  23. package/dist/SvGridChart.svelte +1724 -1724
  24. package/dist/SvGridChartPanel.svelte +485 -485
  25. package/dist/SvGridChartView.svelte +70 -70
  26. package/dist/SvGridDropdown.svelte +696 -696
  27. package/dist/SvGridSelect.svelte +259 -259
  28. package/dist/SvGroupCell.svelte +109 -109
  29. package/dist/SvListBox.svelte +326 -287
  30. package/dist/SvListBox.svelte.d.ts +10 -1
  31. package/dist/SvMaskedInput.svelte +122 -122
  32. package/dist/SvMenu.svelte +124 -124
  33. package/dist/SvMenuList.svelte +146 -146
  34. package/dist/SvMultiSelect.svelte +281 -281
  35. package/dist/SvNumberInput.svelte +168 -168
  36. package/dist/SvOtpInput.svelte +158 -158
  37. package/dist/SvPasswordInput.svelte +151 -151
  38. package/dist/SvPhoneInput.svelte +133 -131
  39. package/dist/SvPopover.svelte +197 -197
  40. package/dist/SvRadioGroup.svelte +107 -107
  41. package/dist/SvRowGroupPanel.svelte +170 -170
  42. package/dist/SvScrollArea.svelte +61 -61
  43. package/dist/SvSlider.svelte +200 -200
  44. package/dist/SvSwitchButton.svelte +107 -107
  45. package/dist/SvTagsInput.svelte +112 -112
  46. package/dist/SvTextInput.svelte +147 -147
  47. package/dist/SvTimePicker.svelte +245 -245
  48. package/dist/SvToaster.svelte +159 -159
  49. package/dist/SvToggleButton.svelte +85 -85
  50. package/dist/SvTooltip.svelte +161 -161
  51. package/dist/SvTour.svelte +204 -204
  52. package/dist/SvTree.svelte +437 -437
  53. package/dist/SvTreeSelect.svelte +233 -233
  54. package/dist/cdn/GridMenus-Da_p7SKS.js +486 -0
  55. package/dist/cdn/GridMenus-Ds3OpzZT.js +490 -0
  56. package/dist/cdn/{SvDateTimePicker-B1sDc9Pz.js → SvDateTimePicker-B8GopjhC.js} +2 -2
  57. package/dist/cdn/{SvDateTimePicker-Bh0FTs1E.js → SvDateTimePicker-DB0aIEk8.js} +2 -2
  58. package/dist/cdn/{SvGridChart-Bgk4hDs8.js → SvGridChart-BcLCYvw9.js} +1 -1
  59. package/dist/cdn/{SvGridChart-BKQsO5fZ.js → SvGridChart-BhnFdLd0.js} +1 -1
  60. package/dist/cdn/{SvGridChartPanel-DkCc2Z7b.js → SvGridChartPanel-Cmx9DHAS.js} +1 -1
  61. package/dist/cdn/{SvGridChartPanel-DSkHIQDd.js → SvGridChartPanel-DvjwxLvK.js} +1 -1
  62. package/dist/cdn/{SvGridChartView-BrbVaELm.js → SvGridChartView-B40DTJSX.js} +1 -1
  63. package/dist/cdn/{SvGridChartView-i9rWvSKg.js → SvGridChartView-PwqI4s02.js} +1 -1
  64. package/dist/cdn/{SvGridDropdown-D08sVmAy.js → SvGridDropdown-DjALc_4f.js} +1 -1
  65. package/dist/cdn/{SvGridDropdown-CGxxopQ4.js → SvGridDropdown-hpnHvOGt.js} +1 -1
  66. package/dist/cdn/{src-cgs1wcUS.js → src-BLJfdyL0.js} +4034 -3889
  67. package/dist/cdn/{src-Cw8d9U8j.js → src-DYDCiC0D.js} +7053 -6908
  68. package/dist/cdn/svgrid.js +9 -9
  69. package/dist/cdn/svgrid.svelte-external.js +9 -9
  70. package/dist/chart-export.js +8 -8
  71. package/dist/column-groups.js +8 -10
  72. package/dist/column-id.d.ts +9 -0
  73. package/dist/column-id.js +25 -0
  74. package/dist/core.js +2 -1
  75. package/dist/createListbox.svelte.d.ts +15 -2
  76. package/dist/createListbox.svelte.js +27 -6
  77. package/dist/editing.d.ts +1 -0
  78. package/dist/editing.js +45 -10
  79. package/dist/filtering/excel-filters.d.ts +30 -10
  80. package/dist/filtering/excel-filters.js +96 -15
  81. package/dist/index.d.ts +2 -2
  82. package/dist/index.js +2 -2
  83. package/dist/menus.d.ts +2 -0
  84. package/dist/menus.js +25 -0
  85. package/dist/row-resize.js +40 -0
  86. package/dist/selection.js +1 -1
  87. package/package.json +10 -10
  88. package/src/FlexRender.svelte +96 -96
  89. package/src/GridFooter.svelte +179 -179
  90. package/src/GridMenus.svelte +782 -734
  91. package/src/SvAutoComplete.svelte +165 -165
  92. package/src/SvCalendar.svelte +503 -503
  93. package/src/SvCalendar.test.ts +226 -226
  94. package/src/SvCarousel.svelte +141 -141
  95. package/src/SvCheckBox.svelte +101 -101
  96. package/src/SvColorInput.svelte +181 -181
  97. package/src/SvComboBox.svelte +275 -275
  98. package/src/SvContextMenu.svelte +116 -116
  99. package/src/SvCountryInput.svelte +160 -160
  100. package/src/SvDrawer.svelte +254 -250
  101. package/src/SvDrawer.test.ts +18 -1
  102. package/src/SvDropDownList.svelte +374 -374
  103. package/src/SvDurationInput.svelte +126 -126
  104. package/src/SvField.svelte +293 -293
  105. package/src/SvForm.svelte +437 -437
  106. package/src/SvForm.test.ts +411 -411
  107. package/src/SvGrid.controller.svelte.ts +3335 -3239
  108. package/src/SvGrid.css +2704 -2723
  109. package/src/SvGrid.svelte +3361 -3333
  110. package/src/SvGrid.types.ts +1628 -1613
  111. package/src/SvGridChart.svelte +1724 -1724
  112. package/src/SvGridChartPanel.svelte +485 -485
  113. package/src/SvGridChartView.svelte +70 -70
  114. package/src/SvGridDropdown.svelte +696 -696
  115. package/src/SvGridSelect.svelte +259 -259
  116. package/src/SvGroupCell.svelte +109 -109
  117. package/src/SvListBox.svelte +326 -287
  118. package/src/SvMaskedInput.svelte +122 -122
  119. package/src/SvMenu.svelte +124 -124
  120. package/src/SvMenu.test.ts +97 -97
  121. package/src/SvMenuList.svelte +146 -146
  122. package/src/SvMultiSelect.svelte +281 -281
  123. package/src/SvNavPane.test.ts +15 -4
  124. package/src/SvNumberInput.svelte +168 -168
  125. package/src/SvOtpInput.svelte +158 -158
  126. package/src/SvPasswordInput.svelte +151 -151
  127. package/src/SvPhoneInput.svelte +133 -131
  128. package/src/SvPopover.svelte +197 -197
  129. package/src/SvRadioGroup.svelte +107 -107
  130. package/src/SvRowGroupPanel.svelte +170 -170
  131. package/src/SvScrollArea.svelte +61 -61
  132. package/src/SvSlider.svelte +200 -200
  133. package/src/SvSwitchButton.svelte +107 -107
  134. package/src/SvTagsInput.svelte +112 -112
  135. package/src/SvTextInput.svelte +147 -147
  136. package/src/SvTimePicker.svelte +245 -245
  137. package/src/SvToaster.svelte +159 -159
  138. package/src/SvToaster.test.ts +95 -95
  139. package/src/SvToggleButton.svelte +85 -85
  140. package/src/SvTooltip.svelte +161 -161
  141. package/src/SvTour.svelte +204 -204
  142. package/src/SvTree.svelte +437 -437
  143. package/src/SvTreeSelect.svelte +233 -233
  144. package/src/a11y/dismissable.test.ts +119 -119
  145. package/src/a11y/dismissable.ts +114 -114
  146. package/src/a11y.contract.test.ts +49 -49
  147. package/src/a11y.test.ts +59 -59
  148. package/src/a11y.ts +61 -61
  149. package/src/ai.test.ts +502 -502
  150. package/src/ai.ts +1391 -1391
  151. package/src/build-api.coverage.test.ts +633 -633
  152. package/src/build-api.ts +895 -895
  153. package/src/builtin-editors.grid.test.ts +85 -85
  154. package/src/cell-formatting.ts +169 -169
  155. package/src/cell-render.ts +469 -469
  156. package/src/chart-export.ts +201 -201
  157. package/src/chart-view.svelte.ts +36 -36
  158. package/src/chart.ts +2296 -2296
  159. package/src/collaboration.test.ts +104 -104
  160. package/src/collaboration.ts +167 -167
  161. package/src/column-groups.test.ts +48 -0
  162. package/src/column-groups.ts +8 -10
  163. package/src/column-id.ts +30 -0
  164. package/src/core.performance.test.ts +30 -30
  165. package/src/core.ts +1112 -1111
  166. package/src/createAutocomplete.svelte.ts +132 -132
  167. package/src/createCombobox.svelte.ts +191 -191
  168. package/src/createCountryInput.svelte.ts +157 -157
  169. package/src/createDropdownList.svelte.ts +168 -168
  170. package/src/createForm.svelte.ts +386 -386
  171. package/src/createGrid.svelte.ts +42 -42
  172. package/src/createGrid.test.ts +10 -10
  173. package/src/createGridState.svelte.ts +17 -17
  174. package/src/createListbox.svelte.ts +39 -7
  175. package/src/createMenu.svelte.ts +225 -225
  176. package/src/createPopoverSelect.svelte.ts +213 -213
  177. package/src/createSlider.svelte.ts +191 -191
  178. package/src/createTooltip.svelte.ts +144 -144
  179. package/src/createTree.svelte.ts +319 -319
  180. package/src/editing.test.ts +949 -859
  181. package/src/editing.ts +709 -675
  182. package/src/editor-contract.ts +157 -157
  183. package/src/export-data-api.test.ts +126 -126
  184. package/src/export-format.test.ts +107 -107
  185. package/src/export-format.ts +598 -598
  186. package/src/filter-operators.ts +157 -157
  187. package/src/filtering/excel-filters.test.ts +44 -1
  188. package/src/filtering/excel-filters.ts +91 -14
  189. package/src/flex-render.ts +3 -3
  190. package/src/form-field.ts +127 -127
  191. package/src/index.ts +715 -713
  192. package/src/js-scroller.svelte.ts +173 -173
  193. package/src/keyboard.test.ts +59 -59
  194. package/src/keyboard.ts +97 -97
  195. package/src/list-nav.test.ts +49 -49
  196. package/src/list-nav.ts +29 -29
  197. package/src/list-option.test.ts +56 -56
  198. package/src/list-option.ts +172 -172
  199. package/src/menus.test.ts +736 -700
  200. package/src/menus.ts +679 -652
  201. package/src/merge-objects.ts +48 -48
  202. package/src/overlays.test.ts +90 -90
  203. package/src/render-component.ts +28 -28
  204. package/src/row-resize.test.ts +100 -0
  205. package/src/row-resize.ts +36 -0
  206. package/src/scheduler-model.test.ts +562 -562
  207. package/src/scheduler-model.ts +872 -872
  208. package/src/selection.test.ts +754 -754
  209. package/src/selection.ts +600 -600
  210. package/src/server-data-source.test.ts +289 -289
  211. package/src/server-data-source.ts +413 -413
  212. package/src/sparkline.test.ts +68 -68
  213. package/src/sparkline.ts +169 -169
  214. package/src/spreadsheet.test.ts +489 -489
  215. package/src/spreadsheet.ts +312 -312
  216. package/src/static-functions.ts +11 -11
  217. package/src/subscribe.ts +38 -38
  218. package/src/svgrid-wrapper.types.ts +524 -524
  219. package/src/svgrid.api-extensions.test.ts +8 -3
  220. package/src/svgrid.behavior.test.ts +706 -706
  221. package/src/svgrid.cell-dom-ids.test.ts +96 -0
  222. package/src/svgrid.charting.test.ts +534 -534
  223. package/src/svgrid.conditional-stat-scope.test.ts +111 -0
  224. package/src/svgrid.features.test.ts +157 -157
  225. package/src/svgrid.filter-menu-listbox.svelte.test.ts +308 -0
  226. package/src/svgrid.filter-menu-scroll.test.ts +3 -1
  227. package/src/svgrid.group-header-ids.test.ts +121 -0
  228. package/src/svgrid.new-features.wrapper.test.ts +251 -251
  229. package/src/svgrid.wrapper.test.ts +40 -40
  230. package/src/test-setup.ts +62 -62
  231. package/src/themes/index.ts +215 -215
  232. package/src/toast-store.svelte.ts +246 -246
  233. package/src/toast-store.test.ts +147 -147
  234. package/src/ui-buttons.test.ts +144 -144
  235. package/src/ui-inputs.test.ts +118 -118
  236. package/src/ui-range.test.ts +70 -70
  237. package/src/ui-selection.test.ts +155 -155
  238. package/src/ui-tier1.test.ts +142 -142
  239. package/src/virtual.test.ts +88 -88
  240. package/src/virtualization/column-virtualizer.test.ts +27 -27
  241. package/src/virtualization/column-virtualizer.ts +30 -30
  242. package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
  243. package/src/virtualization/types.ts +30 -30
  244. package/src/virtualization/virtualizer.test.ts +47 -47
  245. package/src/virtualization/virtualizer.ts +296 -296
  246. package/themes/ember.css +71 -71
  247. package/dist/cdn/GridMenus-BzxEYNtW.js +0 -421
  248. package/dist/cdn/GridMenus-Dr-nGEXn.js +0 -417
@@ -1,872 +1,872 @@
1
- /**
2
- * scheduler-model - the pure, framework-free core behind SvGridScheduler (the
3
- * calendar / scheduler *view of the grid*). No Svelte, no DOM: just date math
4
- * over the native `Date`, so every rule here is unit-tested directly.
5
- *
6
- * It does three things the view leans on:
7
- * 1. resolve rows into concrete event instances for a visible window, expanding
8
- * recurring rows via the shared `recurrence` engine (see recurrence.ts);
9
- * 2. pack overlapping timed events into side-by-side columns for the time-grid
10
- * (week / day) views;
11
- * 3. compute the visible date range + navigation for each view.
12
- *
13
- * Deliberately avoids the arg-less `new Date()` / `Date.now()` (they are
14
- * non-deterministic and unavailable in some execution contexts) - the caller
15
- * supplies "today"/the anchor date and passes it in.
16
- */
17
- import {
18
- addDays,
19
- addMonths,
20
- startOfDay,
21
- startOfMonth,
22
- startOfWeek,
23
- withTime,
24
- toDate,
25
- isSameDay,
26
- type DateLike,
27
- } from './datetime/date-core'
28
- import { expandRecurrence, type RecurrenceRule } from './recurrence'
29
- import type { SchedulerView, SchedulerResource, SchedulerCollisionMode } from './SvGrid.types'
30
-
31
- export type { SchedulerView, SchedulerResource, SchedulerCollisionMode }
32
-
33
- /** A concrete event instance placed on the calendar (one row may yield many when
34
- * it recurs). `key` is unique per instance; `rowKey` ties it back to its row. */
35
- export type ResolvedEvent<TData = unknown> = {
36
- key: string
37
- rowKey: string
38
- row: TData
39
- title: string
40
- start: Date
41
- end: Date
42
- allDay: boolean
43
- color?: string
44
- /** Optional secondary accent (e.g. a category) shown as a left strip, distinct
45
- * from the main `color`. */
46
- color2?: string
47
- /** Free/busy status (busy | free | tentative | oof) for a distinct visual. */
48
- status?: string
49
- resourceId?: string
50
- /** True when this instance came from expanding a recurrence rule. */
51
- recurring: boolean
52
- /** For a recurring instance, its canonical (pre-override) occurrence start -
53
- * the identity used to key {@link RecurrenceException} overrides. */
54
- occurrenceStart?: Date
55
- /** True when a recurring instance carries a per-occurrence override. */
56
- isException?: boolean
57
- }
58
-
59
- /** A per-occurrence override of a recurring event (the model's shape; the
60
- * component maps the consumer's `SchedulerException` onto this). */
61
- export type RecurrenceException = {
62
- occurrenceStart: DateLike
63
- deleted?: boolean
64
- start?: DateLike | null
65
- end?: DateLike | null
66
- title?: string
67
- allDay?: boolean
68
- /** Per-occurrence overrides for any other field, merged over the row for just
69
- * this occurrence (attendees, calendar, color, resource, ...). */
70
- fields?: Record<string, unknown>
71
- }
72
-
73
- /** Field accessors the model uses to read an event off a row. The component
74
- * builds this from `SchedulerConfig`, applying its move/edit overlay first so
75
- * a dragged event resolves at its new time without mutating the source row. */
76
- export type EventSpec<TData> = {
77
- getKey: (row: TData) => string
78
- getStart: (row: TData) => DateLike | null | undefined
79
- getEnd?: (row: TData) => DateLike | null | undefined
80
- getAllDay?: (row: TData) => boolean
81
- getTitle?: (row: TData) => string
82
- getColor?: (row: TData) => string | undefined
83
- /** Optional secondary accent color (rendered as a left strip). */
84
- getSecondaryColor?: (row: TData) => string | undefined
85
- /** Optional free/busy status. */
86
- getStatus?: (row: TData) => string | undefined
87
- getResource?: (row: TData) => string | undefined
88
- getRecurrence?: (
89
- row: TData,
90
- ) => RecurrenceRule | ReadonlyArray<RecurrenceRule> | null | undefined
91
- /** Per-occurrence overrides for a recurring row (deleted / moved / edited). */
92
- getExceptions?: (row: TData) => ReadonlyArray<RecurrenceException> | null | undefined
93
- /** Fallback event length (minutes) when a row has a start but no end. Default 60. */
94
- defaultDurationMin?: number
95
- }
96
-
97
- const MS_MIN = 60_000
98
-
99
- /** True when [aStart,aEnd] and [bStart,bEnd] overlap (touching counts as overlap
100
- * only for zero-length events). */
101
- function rangesOverlap(aStart: Date, aEnd: Date, bStart: Date, bEnd: Date): boolean {
102
- return aStart.getTime() < bEnd.getTime() && aEnd.getTime() > bStart.getTime()
103
- }
104
-
105
- /** One working window: `[start, end)` hours, optionally limited to `days`
106
- * (weekday 0 = Sun … 6 = Sat). Omitting `days` applies it to every day. */
107
- export type WorkingWindow = {
108
- days?: ReadonlyArray<number>
109
- start: number
110
- end: number
111
- }
112
-
113
- /**
114
- * The working `[startMin, endMin]` intervals for `weekday`, from `windows`,
115
- * clamped to `[bandStartMin, bandEndMin]` and merged. Empty = the whole day is
116
- * off. Pure; used for per-resource availability shading + enforcement.
117
- */
118
- export function workingIntervals(
119
- weekday: number,
120
- windows: ReadonlyArray<WorkingWindow>,
121
- bandStartMin: number,
122
- bandEndMin: number,
123
- ): Array<[number, number]> {
124
- const raw: Array<[number, number]> = []
125
- for (const w of windows) {
126
- if (w.days && !w.days.includes(weekday)) continue
127
- const s = Math.max(bandStartMin, w.start * 60)
128
- const e = Math.min(bandEndMin, w.end * 60)
129
- if (e > s) raw.push([s, e])
130
- }
131
- raw.sort((a, b) => a[0] - b[0])
132
- const merged: Array<[number, number]> = []
133
- for (const iv of raw) {
134
- const last = merged[merged.length - 1]
135
- if (last && iv[0] <= last[1]) last[1] = Math.max(last[1], iv[1])
136
- else merged.push([iv[0], iv[1]])
137
- }
138
- return merged
139
- }
140
-
141
- /** True when `[startMin, endMin]` lies wholly inside one working interval. */
142
- export function withinWorking(
143
- startMin: number,
144
- endMin: number,
145
- intervals: ReadonlyArray<readonly [number, number]>,
146
- ): boolean {
147
- return intervals.some(([a, b]) => startMin >= a && endMin <= b)
148
- }
149
-
150
- /**
151
- * True when placing `[start,end]` on `resourceId` would overlap another event on
152
- * the SAME resource (ignoring the event identified by `excludeRowKey`). Used to
153
- * enforce `disableConflicts` (no double-booking). All-day/timed both count.
154
- */
155
- export function hasConflict<TData>(
156
- start: Date,
157
- end: Date,
158
- resourceId: string | undefined,
159
- events: ReadonlyArray<ResolvedEvent<TData>>,
160
- excludeRowKey?: string,
161
- ): boolean {
162
- for (const e of events) {
163
- if (e.rowKey === excludeRowKey) continue
164
- if ((e.resourceId ?? undefined) !== (resourceId ?? undefined)) continue
165
- if (rangesOverlap(start, end, e.start, e.end)) return true
166
- }
167
- return false
168
- }
169
-
170
- /**
171
- * How many events on the SAME resource overlap `[start,end]` (excluding
172
- * `excludeRowKey`). Used to enforce `maxEventsPerSlot` (resource capacity): a
173
- * move/create is blocked when this count would reach the cap.
174
- */
175
- export function overlapCount<TData>(
176
- start: Date,
177
- end: Date,
178
- resourceId: string | undefined,
179
- events: ReadonlyArray<ResolvedEvent<TData>>,
180
- excludeRowKey?: string,
181
- ): number {
182
- let n = 0
183
- for (const e of events) {
184
- if (e.rowKey === excludeRowKey) continue
185
- if ((e.resourceId ?? undefined) !== (resourceId ?? undefined)) continue
186
- if (rangesOverlap(start, end, e.start, e.end)) n++
187
- }
188
- return n
189
- }
190
-
191
- /** True when the minute range `[sMin,eMin)` overlaps any of the given hour bands. */
192
- export function overlapsBands(
193
- sMin: number,
194
- eMin: number,
195
- bands: ReadonlyArray<{ start: number; end: number }>,
196
- ): boolean {
197
- for (const b of bands) {
198
- if (sMin < b.end * 60 && eMin > b.start * 60) return true
199
- }
200
- return false
201
- }
202
-
203
- /**
204
- * Resolve `rows` into the event instances visible in `[rangeStart, rangeEnd]`.
205
- * Recurring rows are expanded to one instance per matching day (keeping the base
206
- * event's time-of-day and duration); single rows are included when they overlap
207
- * the window. Result is sorted by start (all-day first within a start).
208
- */
209
- export function resolveEvents<TData>(
210
- rows: ReadonlyArray<TData>,
211
- spec: EventSpec<TData>,
212
- rangeStart: Date,
213
- rangeEnd: Date,
214
- ): ResolvedEvent<TData>[] {
215
- const defDur = Math.max(1, spec.defaultDurationMin ?? 60)
216
- const out: ResolvedEvent<TData>[] = []
217
-
218
- for (const row of rows) {
219
- const start = toDate(spec.getStart(row))
220
- if (!start) continue
221
- const rawEnd = spec.getEnd ? toDate(spec.getEnd(row)) : null
222
- const end =
223
- rawEnd && rawEnd.getTime() > start.getTime()
224
- ? rawEnd
225
- : new Date(start.getTime() + defDur * MS_MIN)
226
- const durationMs = end.getTime() - start.getTime()
227
-
228
- const rowKey = spec.getKey(row)
229
- const title = spec.getTitle?.(row) ?? ''
230
- const allDay = spec.getAllDay?.(row) ?? false
231
- const color = spec.getColor?.(row)
232
- const color2 = spec.getSecondaryColor?.(row)
233
- const status = spec.getStatus?.(row)
234
- const resourceId = spec.getResource?.(row)
235
- const rule = spec.getRecurrence?.(row)
236
-
237
- if (rule) {
238
- // One instance per matching day, carrying the base time-of-day + duration.
239
- // Recurrence begins at the event's OWN start - never emit an occurrence
240
- // before it, so clip the expansion's lower bound to the start date (a rule
241
- // like "weekly on Mon-Fri" must not back-fill days before the event began).
242
- const from = start.getTime() > rangeStart.getTime() ? start : rangeStart
243
- const days = expandRecurrence(rule, from, rangeEnd)
244
- // Per-occurrence overrides keyed by the occurrence's canonical start time.
245
- const exs = spec.getExceptions?.(row)
246
- const exMap = exs?.length
247
- ? new Map(exs.map((e) => [toDate(e.occurrenceStart)?.getTime() ?? NaN, e]))
248
- : null
249
- for (const day of days) {
250
- const occStart = allDay ? startOfDay(day) : withTime(day, start)
251
- const ex = exMap?.get(occStart.getTime())
252
- if (ex?.deleted) continue // this occurrence was removed
253
- let iStart = occStart
254
- let iEnd = new Date(occStart.getTime() + durationMs)
255
- let iTitle = title
256
- let iAllDay = allDay
257
- // Per-occurrence overrides of ANY other field: merge onto a copy of the
258
- // row for this instance, then re-derive the surfaced props from it so a
259
- // "This event" change to attendees / calendar / color / resource shows.
260
- let iRow = row
261
- let iColor = color
262
- let iColor2 = color2
263
- let iStatus = status
264
- let iResource = resourceId
265
- if (ex) {
266
- const exS = toDate(ex.start)
267
- const exE = toDate(ex.end)
268
- if (exS) {
269
- iStart = exS
270
- iEnd = exE && exE.getTime() > exS.getTime() ? exE : new Date(exS.getTime() + durationMs)
271
- } else if (exE) {
272
- iEnd = exE
273
- }
274
- if (ex.title != null) iTitle = ex.title
275
- if (ex.allDay != null) iAllDay = ex.allDay
276
- if (ex.fields) {
277
- iRow = { ...(row as Record<string, unknown>), ...ex.fields } as TData
278
- iColor = spec.getColor?.(iRow) ?? color
279
- iColor2 = spec.getSecondaryColor?.(iRow) ?? color2
280
- iStatus = spec.getStatus?.(iRow) ?? status
281
- iResource = spec.getResource?.(iRow) ?? resourceId
282
- if (ex.title == null) iTitle = spec.getTitle?.(iRow) ?? iTitle
283
- }
284
- }
285
- if (!rangesOverlap(iStart, iEnd, rangeStart, rangeEnd)) continue
286
- out.push({
287
- // Key on the CANONICAL occurrence start so a moved occurrence keeps its identity.
288
- key: `${rowKey}#${occStart.getFullYear()}-${occStart.getMonth() + 1}-${occStart.getDate()}T${occStart.getHours()}:${occStart.getMinutes()}`,
289
- rowKey,
290
- row: iRow,
291
- title: iTitle,
292
- start: iStart,
293
- end: iEnd,
294
- allDay: iAllDay,
295
- color: iColor,
296
- color2: iColor2,
297
- status: iStatus,
298
- resourceId: iResource,
299
- recurring: true,
300
- occurrenceStart: occStart,
301
- isException: !!ex,
302
- })
303
- }
304
- } else if (rangesOverlap(start, end, rangeStart, rangeEnd)) {
305
- out.push({
306
- key: rowKey,
307
- rowKey,
308
- row,
309
- title,
310
- start,
311
- end,
312
- allDay,
313
- color,
314
- color2,
315
- status,
316
- resourceId,
317
- recurring: false,
318
- })
319
- }
320
- }
321
-
322
- out.sort((a, b) => {
323
- const d = a.start.getTime() - b.start.getTime()
324
- if (d !== 0) return d
325
- if (a.allDay !== b.allDay) return a.allDay ? -1 : 1
326
- return a.end.getTime() - b.end.getTime()
327
- })
328
- return out
329
- }
330
-
331
- /** Events that touch `day` (any calendar day the event spans), timed + all-day. */
332
- export function eventsOnDay<TData>(
333
- events: ReadonlyArray<ResolvedEvent<TData>>,
334
- day: Date,
335
- ): ResolvedEvent<TData>[] {
336
- const dayStart = startOfDay(day)
337
- const dayEnd = addDays(dayStart, 1)
338
- return events.filter((e) => rangesOverlap(e.start, e.end, dayStart, dayEnd))
339
- }
340
-
341
- /**
342
- * A continuous month-view bar for one event within one week row: the columns it
343
- * spans (`startCol`..`endCol`, 0-6) and the `lane` (stack row) it sits in. Events
344
- * that cross a week boundary are split into one segment per week (with
345
- * `continuesLeft`/`continuesRight` flags so the view can flatten that edge).
346
- */
347
- export type MonthSegment<TData = unknown> = {
348
- event: ResolvedEvent<TData>
349
- startCol: number
350
- endCol: number
351
- lane: number
352
- continuesLeft: boolean
353
- continuesRight: boolean
354
- }
355
-
356
- const MS_DAY = 86_400_000
357
-
358
- /**
359
- * Lay out one week row of the month grid as continuous spanning bars. `weekStart`
360
- * is the local-midnight first day of the 7-day row. Returns each overlapping
361
- * event as a {@link MonthSegment} clipped to the week, with greedy lane packing
362
- * so bars never overlap, plus the total `laneCount`.
363
- */
364
- export function monthWeekSegments<TData>(
365
- events: ReadonlyArray<ResolvedEvent<TData>>,
366
- weekStart: Date,
367
- ): { segments: MonthSegment<TData>[]; laneCount: number } {
368
- const ws = startOfDay(weekStart)
369
- const we = addDays(ws, 7)
370
- const colOf = (d: Date) => Math.floor((startOfDay(d).getTime() - ws.getTime()) / MS_DAY)
371
-
372
- const out: MonthSegment<TData>[] = []
373
- for (const e of events) {
374
- const firstDay = startOfDay(e.start)
375
- // Last covered day: the day of (end - 1ms), so an end at exact midnight does
376
- // not spill onto the next day. Guard against zero/negative-length events.
377
- const lastDay = startOfDay(new Date(Math.max(e.start.getTime(), e.end.getTime() - 1)))
378
- if (lastDay.getTime() < ws.getTime() || firstDay.getTime() >= we.getTime()) continue
379
- const startCol = Math.max(0, colOf(firstDay))
380
- const endCol = Math.min(6, colOf(lastDay))
381
- if (endCol < startCol) continue
382
- out.push({
383
- event: e,
384
- startCol,
385
- endCol,
386
- lane: 0,
387
- continuesLeft: firstDay.getTime() < ws.getTime(),
388
- continuesRight: lastDay.getTime() >= we.getTime(),
389
- })
390
- }
391
-
392
- // Order: earliest start, then longest, then all-day before timed, then start time.
393
- out.sort(
394
- (a, b) =>
395
- a.startCol - b.startCol ||
396
- b.endCol - b.startCol - (a.endCol - a.startCol) ||
397
- (a.event.allDay === b.event.allDay
398
- ? a.event.start.getTime() - b.event.start.getTime()
399
- : a.event.allDay
400
- ? -1
401
- : 1),
402
- )
403
-
404
- // Greedy lane packing: a lane tracks the last column it is occupied through.
405
- const laneEnd: number[] = []
406
- for (const seg of out) {
407
- let lane = 0
408
- for (; lane < laneEnd.length; lane++) if (seg.startCol > (laneEnd[lane] ?? -1)) break
409
- laneEnd[lane] = seg.endCol
410
- seg.lane = lane
411
- }
412
- return { segments: out, laneCount: laneEnd.length }
413
- }
414
-
415
- /** A timed event positioned within a time-grid column. `topPct`/`heightPct` are
416
- * 0-100 of the visible day; `leftPct`/`widthPct`/`zIndex` place it horizontally
417
- * among overlapping peers (already resolved for the chosen collision mode). */
418
- export type PositionedEvent<TData = unknown> = {
419
- event: ResolvedEvent<TData>
420
- topPct: number
421
- heightPct: number
422
- col: number
423
- colCount: number
424
- leftPct: number
425
- widthPct: number
426
- zIndex: number
427
- }
428
-
429
- /** A `+N more` tile emitted by `cap` mode for the events that didn't fit. */
430
- export type OverflowMarker<TData = unknown> = {
431
- topPct: number
432
- heightPct: number
433
- leftPct: number
434
- widthPct: number
435
- /** Number of hidden events this tile stands for. */
436
- count: number
437
- /** The hidden events (chronological), for the "+N more" popover. */
438
- events: ResolvedEvent<TData>[]
439
- }
440
-
441
- /** The full time-grid layout for one day: positioned events + any overflow tiles. */
442
- export type DayLayout<TData = unknown> = {
443
- events: PositionedEvent<TData>[]
444
- overflows: OverflowMarker<TData>[]
445
- }
446
-
447
- export type LayoutOptions = {
448
- dayStartHour?: number
449
- dayEndHour?: number
450
- /** Collision layout mode. Default `split`. */
451
- mode?: SchedulerCollisionMode
452
- /** `cap` mode: max columns before overflow (min 2). Default 3. */
453
- maxColumns?: number
454
- /** `stack` mode: horizontal offset per overlapping event, in % of column. */
455
- stackOffsetPct?: number
456
- /** `stack` mode: the narrowest a stacked event may get, in % of column. */
457
- stackMinWidthPct?: number
458
- }
459
-
460
- /**
461
- * Lay out the timed events of a single day for the time-grid, resolving
462
- * collisions per {@link SchedulerCollisionMode}. `dayStartHour`/`dayEndHour`
463
- * bound the visible band (e.g. 8..18); events are clamped to it. All-day events
464
- * are ignored here (the view renders them in a separate all-day row).
465
- */
466
- export function layoutDayEvents<TData>(
467
- dayEvents: ReadonlyArray<ResolvedEvent<TData>>,
468
- day: Date,
469
- opts: LayoutOptions = {},
470
- ): DayLayout<TData> {
471
- const dayStartHour = opts.dayStartHour ?? 0
472
- const dayEndHour = opts.dayEndHour ?? 24
473
- const mode = opts.mode ?? 'split'
474
- const maxColumns = Math.max(2, Math.floor(opts.maxColumns ?? 3))
475
- const stackOffset = opts.stackOffsetPct ?? 14
476
- const stackMinWidth = opts.stackMinWidthPct ?? 42
477
-
478
- const base = startOfDay(day)
479
- const bandStartMin = dayStartHour * 60
480
- const bandEndMin = dayEndHour * 60
481
- const bandLen = Math.max(1, bandEndMin - bandStartMin)
482
-
483
- type Item = { event: ResolvedEvent<TData>; startMin: number; endMin: number; col: number }
484
- const items: Item[] = []
485
- for (const e of dayEvents) {
486
- if (e.allDay) continue
487
- const s = Math.max(bandStartMin, (e.start.getTime() - base.getTime()) / MS_MIN)
488
- const en = Math.min(bandEndMin, (e.end.getTime() - base.getTime()) / MS_MIN)
489
- if (en <= bandStartMin || s >= bandEndMin) continue
490
- items.push({ event: e, startMin: s, endMin: Math.max(s + 1, en), col: 0 })
491
- }
492
- items.sort((a, b) => a.startMin - b.startMin || a.endMin - b.endMin)
493
-
494
- const events: PositionedEvent<TData>[] = []
495
- const overflows: OverflowMarker<TData>[] = []
496
- const topOf = (min: number) => ((min - bandStartMin) / bandLen) * 100
497
- const heightOf = (a: number, b: number) => ((b - a) / bandLen) * 100
498
- const maxStackShift = Math.max(0, Math.floor((100 - stackMinWidth) / stackOffset))
499
-
500
- // Walk clusters of transitively-overlapping events; within each cluster assign
501
- // greedy columns, then resolve horizontal geometry for the chosen mode.
502
- let cluster: Item[] = []
503
- let clusterEnd = -Infinity
504
- const flush = () => {
505
- if (!cluster.length) return
506
- const colEnds: number[] = []
507
- for (const it of cluster) {
508
- let c = 0
509
- for (; c < colEnds.length; c++) if (it.startMin >= (colEnds[c] ?? Infinity)) break
510
- colEnds[c] = it.endMin
511
- it.col = c
512
- }
513
- const colCount = colEnds.length
514
-
515
- if (mode === 'stack' && colCount > 1) {
516
- for (const it of cluster) {
517
- const shift = Math.min(it.col, maxStackShift) * stackOffset
518
- events.push({
519
- event: it.event,
520
- topPct: topOf(it.startMin),
521
- heightPct: heightOf(it.startMin, it.endMin),
522
- col: it.col,
523
- colCount,
524
- leftPct: shift,
525
- widthPct: 100 - shift,
526
- zIndex: it.col + 1,
527
- })
528
- }
529
- } else if (mode === 'cap' && colCount > maxColumns) {
530
- const realCols = maxColumns - 1 // reserve the last visible slot for overflow
531
- const hidden: Item[] = []
532
- for (const it of cluster) {
533
- if (it.col < realCols) {
534
- events.push({
535
- event: it.event,
536
- topPct: topOf(it.startMin),
537
- heightPct: heightOf(it.startMin, it.endMin),
538
- col: it.col,
539
- colCount: maxColumns,
540
- leftPct: (it.col / maxColumns) * 100,
541
- widthPct: 100 / maxColumns,
542
- zIndex: 1,
543
- })
544
- } else {
545
- hidden.push(it)
546
- }
547
- }
548
- if (hidden.length) {
549
- const start = Math.min(...hidden.map((h) => h.startMin))
550
- const end = Math.max(...hidden.map((h) => h.endMin))
551
- overflows.push({
552
- topPct: topOf(start),
553
- heightPct: heightOf(start, end),
554
- leftPct: (realCols / maxColumns) * 100,
555
- widthPct: 100 / maxColumns,
556
- count: hidden.length,
557
- events: hidden.map((h) => h.event),
558
- })
559
- }
560
- } else {
561
- // split (and cap when the cluster fits within maxColumns): each event
562
- // starts in its greedy column, then EXPANDS rightward across any columns
563
- // that hold no event overlapping it in time - so an event with free space
564
- // beside it fills the gap instead of staying a narrow 1/colCount sliver.
565
- for (const it of cluster) {
566
- let span = 1
567
- for (let c = it.col + 1; c < colCount; c++) {
568
- const blocked = cluster.some(
569
- (o) => o !== it && o.col === c && o.startMin < it.endMin && o.endMin > it.startMin,
570
- )
571
- if (blocked) break
572
- span++
573
- }
574
- events.push({
575
- event: it.event,
576
- topPct: topOf(it.startMin),
577
- heightPct: heightOf(it.startMin, it.endMin),
578
- col: it.col,
579
- colCount,
580
- leftPct: (it.col / colCount) * 100,
581
- widthPct: (span / colCount) * 100,
582
- zIndex: 1,
583
- })
584
- }
585
- }
586
-
587
- cluster = []
588
- clusterEnd = -Infinity
589
- }
590
- for (const it of items) {
591
- if (cluster.length && it.startMin >= clusterEnd) flush()
592
- cluster.push(it)
593
- clusterEnd = Math.max(clusterEnd, it.endMin)
594
- }
595
- flush()
596
- return { events, overflows }
597
- }
598
-
599
- /** One day's bucket of events for the agenda (list) view. */
600
- export type AgendaGroup<TData = unknown> = {
601
- day: Date
602
- events: ResolvedEvent<TData>[]
603
- }
604
-
605
- /** Group resolved events by calendar day for the agenda view (days with no
606
- * events are omitted; groups and their events are in chronological order). */
607
- export function agendaGroups<TData>(
608
- events: ReadonlyArray<ResolvedEvent<TData>>,
609
- ): AgendaGroup<TData>[] {
610
- const groups: AgendaGroup<TData>[] = []
611
- for (const e of [...events].sort((a, b) => a.start.getTime() - b.start.getTime())) {
612
- const last = groups[groups.length - 1]
613
- if (last && isSameDay(last.day, e.start)) last.events.push(e)
614
- else groups.push({ day: startOfDay(e.start), events: [e] })
615
- }
616
- return groups
617
- }
618
-
619
- /**
620
- * The visible date window for a view anchored on `anchor`. Used both to size the
621
- * grid and to bound event resolution (recurrence expansion clips to it).
622
- * `agendaDays` controls the agenda span (default 30).
623
- */
624
- export function rangeForView(
625
- view: SchedulerView,
626
- anchor: Date,
627
- weekStartsOn = 0,
628
- agendaDays = 30,
629
- ): { start: Date; end: Date } {
630
- switch (view) {
631
- case 'month': {
632
- const start = startOfWeek(startOfMonth(anchor), weekStartsOn)
633
- return { start, end: addDays(start, 42) } // fixed 6-week grid
634
- }
635
- case 'week': {
636
- const start = startOfWeek(anchor, weekStartsOn)
637
- return { start, end: addDays(start, 7) }
638
- }
639
- case 'day': {
640
- const start = startOfDay(anchor)
641
- return { start, end: addDays(start, 1) }
642
- }
643
- case 'agenda': {
644
- const start = startOfDay(anchor)
645
- return { start, end: addDays(start, Math.max(1, agendaDays)) }
646
- }
647
- case 'timelineDay':
648
- return { start: startOfDay(anchor), end: addDays(startOfDay(anchor), 1) }
649
- case 'timelineWeek': {
650
- const start = startOfWeek(anchor, weekStartsOn)
651
- return { start, end: addDays(start, 7) }
652
- }
653
- case 'timelineMonth': {
654
- const start = startOfMonth(anchor)
655
- return { start, end: startOfMonth(addMonths(anchor, 1)) }
656
- }
657
- case 'timelineYear': {
658
- const start = new Date(anchor.getFullYear(), 0, 1)
659
- return { start, end: new Date(anchor.getFullYear() + 1, 0, 1) }
660
- }
661
- }
662
- }
663
-
664
- /** The 7 (or fewer) day columns rendered for the week / day views. */
665
- export function daysForView(view: SchedulerView, anchor: Date, weekStartsOn = 0): Date[] {
666
- if (view === 'day') return [startOfDay(anchor)]
667
- const start = startOfWeek(anchor, weekStartsOn)
668
- return Array.from({ length: 7 }, (_, i) => addDays(start, i))
669
- }
670
-
671
- /** Move the anchor one view-unit in `dir` (-1 back, +1 forward). */
672
- export function navigateAnchor(view: SchedulerView, anchor: Date, dir: number): Date {
673
- switch (view) {
674
- case 'month':
675
- return addMonths(anchor, dir)
676
- case 'week':
677
- return addDays(anchor, 7 * dir)
678
- case 'day':
679
- return addDays(anchor, dir)
680
- case 'agenda':
681
- return addDays(anchor, 30 * dir)
682
- case 'timelineDay':
683
- return addDays(anchor, dir)
684
- case 'timelineWeek':
685
- return addDays(anchor, 7 * dir)
686
- case 'timelineMonth':
687
- return addMonths(anchor, dir)
688
- case 'timelineYear':
689
- return new Date(anchor.getFullYear() + dir, anchor.getMonth(), anchor.getDate())
690
- }
691
- }
692
-
693
- // --- timeline views (horizontal: time left→right, resources as rows) ----------
694
-
695
- const TL_WD = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
696
- const TL_MO = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
697
- const tlHourLabel = (h: number) =>
698
- h === 0 ? '12 AM' : h < 12 ? `${h} AM` : h === 12 ? '12 PM' : `${h - 12} PM`
699
-
700
- /** One column of the timeline's minor (tick) header row. */
701
- export type TimelineTick = {
702
- start: Date
703
- end: Date
704
- leftPct: number
705
- widthPct: number
706
- label: string
707
- today: boolean
708
- }
709
- /** One cell of the timeline's major (grouping) header row, spanning several ticks. */
710
- export type TimelineMajor = { label: string; leftPct: number; widthPct: number }
711
- /** The horizontal axis: its window [start, end] (the day band for `timelineDay`),
712
- * the minor `ticks`, and the coarser `majors` above them. */
713
- export type TimelineAxis = {
714
- start: Date
715
- end: Date
716
- totalMs: number
717
- ticks: TimelineTick[]
718
- majors: TimelineMajor[]
719
- }
720
-
721
- // Group consecutive ticks that share a key into a coarser major cell.
722
- function groupMajors(
723
- ticks: TimelineTick[],
724
- keyOf: (t: TimelineTick) => string,
725
- labelOf: (t: TimelineTick) => string,
726
- ): TimelineMajor[] {
727
- const out: (TimelineMajor & { _k?: string })[] = []
728
- for (const t of ticks) {
729
- const k = keyOf(t)
730
- const last = out[out.length - 1]
731
- if (last && last._k === k) last.widthPct += t.widthPct
732
- else out.push({ _k: k, label: labelOf(t), leftPct: t.leftPct, widthPct: t.widthPct })
733
- }
734
- return out.map(({ _k, ...m }) => m)
735
- }
736
-
737
- /**
738
- * Build the timeline header axis for `view` over `[rangeStart, rangeEnd]`. For
739
- * `timelineDay` the axis is clamped to the `dayStartHour..dayEndHour` band (so
740
- * events outside it clip, matching the vertical day view). Ticks are hours (day),
741
- * days (week / month) or months (year); majors are the date, the month(s), or
742
- * quarters. All geometry is percentage of the axis window.
743
- */
744
- export function timelineAxis(
745
- view: SchedulerView,
746
- rangeStart: Date,
747
- rangeEnd: Date,
748
- opts: { dayStartHour?: number; dayEndHour?: number; today?: Date | null } = {},
749
- ): TimelineAxis {
750
- const dayStartHour = opts.dayStartHour ?? 0
751
- const dayEndHour = opts.dayEndHour ?? 24
752
- const today = opts.today ? startOfDay(opts.today) : null
753
- const isToday = (d: Date) => (today ? isSameDay(d, today) : false)
754
-
755
- let start = rangeStart
756
- let end = rangeEnd
757
- if (view === 'timelineDay') {
758
- start = new Date(rangeStart.getFullYear(), rangeStart.getMonth(), rangeStart.getDate(), dayStartHour)
759
- end = new Date(rangeStart.getFullYear(), rangeStart.getMonth(), rangeStart.getDate(), 0, 0, 0, 0)
760
- end = new Date(end.getTime() + dayEndHour * 3_600_000)
761
- }
762
- const total = Math.max(1, end.getTime() - start.getTime())
763
- const base = start.getTime()
764
- const mk = (s: Date, e: Date, label: string): TimelineTick => ({
765
- start: s,
766
- end: e,
767
- leftPct: ((s.getTime() - base) / total) * 100,
768
- widthPct: ((e.getTime() - s.getTime()) / total) * 100,
769
- label,
770
- today: isToday(s),
771
- })
772
-
773
- const ticks: TimelineTick[] = []
774
- let majors: TimelineMajor[] = []
775
-
776
- if (view === 'timelineDay') {
777
- for (let h = dayStartHour; h < dayEndHour; h++) {
778
- const s = new Date(rangeStart.getFullYear(), rangeStart.getMonth(), rangeStart.getDate(), h)
779
- ticks.push(mk(s, new Date(s.getTime() + 3_600_000), tlHourLabel(h)))
780
- }
781
- majors = [
782
- { label: `${TL_WD[rangeStart.getDay()]}, ${TL_MO[rangeStart.getMonth()]} ${rangeStart.getDate()}`, leftPct: 0, widthPct: 100 },
783
- ]
784
- } else if (view === 'timelineWeek' || view === 'timelineMonth') {
785
- let cur = startOfDay(start)
786
- while (cur.getTime() < end.getTime()) {
787
- const nxt = addDays(cur, 1)
788
- const label = view === 'timelineWeek' ? `${TL_WD[cur.getDay()]} ${cur.getDate()}` : `${cur.getDate()}`
789
- ticks.push(mk(cur, nxt, label))
790
- cur = nxt
791
- }
792
- majors = groupMajors(
793
- ticks,
794
- (t) => `${t.start.getFullYear()}-${t.start.getMonth()}`,
795
- (t) => `${TL_MO[t.start.getMonth()]} ${t.start.getFullYear()}`,
796
- )
797
- } else if (view === 'timelineYear') {
798
- const y = rangeStart.getFullYear()
799
- for (let m = 0; m < 12; m++) {
800
- ticks.push(mk(new Date(y, m, 1), new Date(y, m + 1, 1), TL_MO[m]))
801
- }
802
- majors = groupMajors(
803
- ticks,
804
- (t) => `${Math.floor(t.start.getMonth() / 3)}`,
805
- (t) => `Q${Math.floor(t.start.getMonth() / 3) + 1} ${t.start.getFullYear()}`,
806
- )
807
- }
808
-
809
- return { start, end, totalMs: total, ticks, majors }
810
- }
811
-
812
- /** An event's horizontal geometry within the axis window, or `null` when it
813
- * falls entirely outside it. `continuesLeft/Right` flag a clipped edge. */
814
- export function timelineGeom(
815
- start: Date,
816
- end: Date,
817
- axisStart: Date,
818
- axisMs: number,
819
- ): { leftPct: number; widthPct: number; continuesLeft: boolean; continuesRight: boolean } | null {
820
- const a = axisStart.getTime()
821
- const b = a + axisMs
822
- const s = Math.max(start.getTime(), a)
823
- const e = Math.min(end.getTime(), b)
824
- if (e <= a || s >= b || e <= s) return null
825
- return {
826
- leftPct: ((s - a) / axisMs) * 100,
827
- widthPct: ((e - s) / axisMs) * 100,
828
- continuesLeft: start.getTime() < a,
829
- continuesRight: end.getTime() > b,
830
- }
831
- }
832
-
833
- /** One resource's timeline row: its events lane-packed so overlaps stack. */
834
- export type TimelineRow<TData = unknown> = {
835
- resource: SchedulerResource | null
836
- laneCount: number
837
- items: { event: ResolvedEvent<TData>; lane: number }[]
838
- }
839
-
840
- /**
841
- * Bucket `events` by resource into rows (a single `null` row when there are no
842
- * resources), then greedily lane-pack each row so overlapping events stack. An
843
- * event whose `resourceId` matches no resource is dropped.
844
- */
845
- export function timelineRows<TData>(
846
- resources: ReadonlyArray<SchedulerResource> | null | undefined,
847
- events: ReadonlyArray<ResolvedEvent<TData>>,
848
- ): TimelineRow<TData>[] {
849
- const hasRes = !!(resources && resources.length)
850
- const rows = hasRes
851
- ? resources!.map((r) => ({ resource: r as SchedulerResource | null, evs: [] as ResolvedEvent<TData>[] }))
852
- : [{ resource: null as SchedulerResource | null, evs: [] as ResolvedEvent<TData>[] }]
853
- const byId = new Map<string | null, (typeof rows)[number]>()
854
- for (const r of rows) byId.set(r.resource?.id ?? null, r)
855
-
856
- for (const ev of events) {
857
- const row = hasRes ? byId.get(ev.resourceId ?? '') : rows[0]
858
- if (row) row.evs.push(ev)
859
- }
860
-
861
- return rows.map((r) => {
862
- const sorted = [...r.evs].sort((a, b) => a.start.getTime() - b.start.getTime() || a.end.getTime() - b.end.getTime())
863
- const laneEnd: number[] = []
864
- const items = sorted.map((event) => {
865
- let lane = 0
866
- for (; lane < laneEnd.length; lane++) if (event.start.getTime() >= (laneEnd[lane] ?? -Infinity)) break
867
- laneEnd[lane] = event.end.getTime()
868
- return { event, lane }
869
- })
870
- return { resource: r.resource, laneCount: Math.max(1, laneEnd.length), items }
871
- })
872
- }
1
+ /**
2
+ * scheduler-model - the pure, framework-free core behind SvGridScheduler (the
3
+ * calendar / scheduler *view of the grid*). No Svelte, no DOM: just date math
4
+ * over the native `Date`, so every rule here is unit-tested directly.
5
+ *
6
+ * It does three things the view leans on:
7
+ * 1. resolve rows into concrete event instances for a visible window, expanding
8
+ * recurring rows via the shared `recurrence` engine (see recurrence.ts);
9
+ * 2. pack overlapping timed events into side-by-side columns for the time-grid
10
+ * (week / day) views;
11
+ * 3. compute the visible date range + navigation for each view.
12
+ *
13
+ * Deliberately avoids the arg-less `new Date()` / `Date.now()` (they are
14
+ * non-deterministic and unavailable in some execution contexts) - the caller
15
+ * supplies "today"/the anchor date and passes it in.
16
+ */
17
+ import {
18
+ addDays,
19
+ addMonths,
20
+ startOfDay,
21
+ startOfMonth,
22
+ startOfWeek,
23
+ withTime,
24
+ toDate,
25
+ isSameDay,
26
+ type DateLike,
27
+ } from './datetime/date-core'
28
+ import { expandRecurrence, type RecurrenceRule } from './recurrence'
29
+ import type { SchedulerView, SchedulerResource, SchedulerCollisionMode } from './SvGrid.types'
30
+
31
+ export type { SchedulerView, SchedulerResource, SchedulerCollisionMode }
32
+
33
+ /** A concrete event instance placed on the calendar (one row may yield many when
34
+ * it recurs). `key` is unique per instance; `rowKey` ties it back to its row. */
35
+ export type ResolvedEvent<TData = unknown> = {
36
+ key: string
37
+ rowKey: string
38
+ row: TData
39
+ title: string
40
+ start: Date
41
+ end: Date
42
+ allDay: boolean
43
+ color?: string
44
+ /** Optional secondary accent (e.g. a category) shown as a left strip, distinct
45
+ * from the main `color`. */
46
+ color2?: string
47
+ /** Free/busy status (busy | free | tentative | oof) for a distinct visual. */
48
+ status?: string
49
+ resourceId?: string
50
+ /** True when this instance came from expanding a recurrence rule. */
51
+ recurring: boolean
52
+ /** For a recurring instance, its canonical (pre-override) occurrence start -
53
+ * the identity used to key {@link RecurrenceException} overrides. */
54
+ occurrenceStart?: Date
55
+ /** True when a recurring instance carries a per-occurrence override. */
56
+ isException?: boolean
57
+ }
58
+
59
+ /** A per-occurrence override of a recurring event (the model's shape; the
60
+ * component maps the consumer's `SchedulerException` onto this). */
61
+ export type RecurrenceException = {
62
+ occurrenceStart: DateLike
63
+ deleted?: boolean
64
+ start?: DateLike | null
65
+ end?: DateLike | null
66
+ title?: string
67
+ allDay?: boolean
68
+ /** Per-occurrence overrides for any other field, merged over the row for just
69
+ * this occurrence (attendees, calendar, color, resource, ...). */
70
+ fields?: Record<string, unknown>
71
+ }
72
+
73
+ /** Field accessors the model uses to read an event off a row. The component
74
+ * builds this from `SchedulerConfig`, applying its move/edit overlay first so
75
+ * a dragged event resolves at its new time without mutating the source row. */
76
+ export type EventSpec<TData> = {
77
+ getKey: (row: TData) => string
78
+ getStart: (row: TData) => DateLike | null | undefined
79
+ getEnd?: (row: TData) => DateLike | null | undefined
80
+ getAllDay?: (row: TData) => boolean
81
+ getTitle?: (row: TData) => string
82
+ getColor?: (row: TData) => string | undefined
83
+ /** Optional secondary accent color (rendered as a left strip). */
84
+ getSecondaryColor?: (row: TData) => string | undefined
85
+ /** Optional free/busy status. */
86
+ getStatus?: (row: TData) => string | undefined
87
+ getResource?: (row: TData) => string | undefined
88
+ getRecurrence?: (
89
+ row: TData,
90
+ ) => RecurrenceRule | ReadonlyArray<RecurrenceRule> | null | undefined
91
+ /** Per-occurrence overrides for a recurring row (deleted / moved / edited). */
92
+ getExceptions?: (row: TData) => ReadonlyArray<RecurrenceException> | null | undefined
93
+ /** Fallback event length (minutes) when a row has a start but no end. Default 60. */
94
+ defaultDurationMin?: number
95
+ }
96
+
97
+ const MS_MIN = 60_000
98
+
99
+ /** True when [aStart,aEnd] and [bStart,bEnd] overlap (touching counts as overlap
100
+ * only for zero-length events). */
101
+ function rangesOverlap(aStart: Date, aEnd: Date, bStart: Date, bEnd: Date): boolean {
102
+ return aStart.getTime() < bEnd.getTime() && aEnd.getTime() > bStart.getTime()
103
+ }
104
+
105
+ /** One working window: `[start, end)` hours, optionally limited to `days`
106
+ * (weekday 0 = Sun … 6 = Sat). Omitting `days` applies it to every day. */
107
+ export type WorkingWindow = {
108
+ days?: ReadonlyArray<number>
109
+ start: number
110
+ end: number
111
+ }
112
+
113
+ /**
114
+ * The working `[startMin, endMin]` intervals for `weekday`, from `windows`,
115
+ * clamped to `[bandStartMin, bandEndMin]` and merged. Empty = the whole day is
116
+ * off. Pure; used for per-resource availability shading + enforcement.
117
+ */
118
+ export function workingIntervals(
119
+ weekday: number,
120
+ windows: ReadonlyArray<WorkingWindow>,
121
+ bandStartMin: number,
122
+ bandEndMin: number,
123
+ ): Array<[number, number]> {
124
+ const raw: Array<[number, number]> = []
125
+ for (const w of windows) {
126
+ if (w.days && !w.days.includes(weekday)) continue
127
+ const s = Math.max(bandStartMin, w.start * 60)
128
+ const e = Math.min(bandEndMin, w.end * 60)
129
+ if (e > s) raw.push([s, e])
130
+ }
131
+ raw.sort((a, b) => a[0] - b[0])
132
+ const merged: Array<[number, number]> = []
133
+ for (const iv of raw) {
134
+ const last = merged[merged.length - 1]
135
+ if (last && iv[0] <= last[1]) last[1] = Math.max(last[1], iv[1])
136
+ else merged.push([iv[0], iv[1]])
137
+ }
138
+ return merged
139
+ }
140
+
141
+ /** True when `[startMin, endMin]` lies wholly inside one working interval. */
142
+ export function withinWorking(
143
+ startMin: number,
144
+ endMin: number,
145
+ intervals: ReadonlyArray<readonly [number, number]>,
146
+ ): boolean {
147
+ return intervals.some(([a, b]) => startMin >= a && endMin <= b)
148
+ }
149
+
150
+ /**
151
+ * True when placing `[start,end]` on `resourceId` would overlap another event on
152
+ * the SAME resource (ignoring the event identified by `excludeRowKey`). Used to
153
+ * enforce `disableConflicts` (no double-booking). All-day/timed both count.
154
+ */
155
+ export function hasConflict<TData>(
156
+ start: Date,
157
+ end: Date,
158
+ resourceId: string | undefined,
159
+ events: ReadonlyArray<ResolvedEvent<TData>>,
160
+ excludeRowKey?: string,
161
+ ): boolean {
162
+ for (const e of events) {
163
+ if (e.rowKey === excludeRowKey) continue
164
+ if ((e.resourceId ?? undefined) !== (resourceId ?? undefined)) continue
165
+ if (rangesOverlap(start, end, e.start, e.end)) return true
166
+ }
167
+ return false
168
+ }
169
+
170
+ /**
171
+ * How many events on the SAME resource overlap `[start,end]` (excluding
172
+ * `excludeRowKey`). Used to enforce `maxEventsPerSlot` (resource capacity): a
173
+ * move/create is blocked when this count would reach the cap.
174
+ */
175
+ export function overlapCount<TData>(
176
+ start: Date,
177
+ end: Date,
178
+ resourceId: string | undefined,
179
+ events: ReadonlyArray<ResolvedEvent<TData>>,
180
+ excludeRowKey?: string,
181
+ ): number {
182
+ let n = 0
183
+ for (const e of events) {
184
+ if (e.rowKey === excludeRowKey) continue
185
+ if ((e.resourceId ?? undefined) !== (resourceId ?? undefined)) continue
186
+ if (rangesOverlap(start, end, e.start, e.end)) n++
187
+ }
188
+ return n
189
+ }
190
+
191
+ /** True when the minute range `[sMin,eMin)` overlaps any of the given hour bands. */
192
+ export function overlapsBands(
193
+ sMin: number,
194
+ eMin: number,
195
+ bands: ReadonlyArray<{ start: number; end: number }>,
196
+ ): boolean {
197
+ for (const b of bands) {
198
+ if (sMin < b.end * 60 && eMin > b.start * 60) return true
199
+ }
200
+ return false
201
+ }
202
+
203
+ /**
204
+ * Resolve `rows` into the event instances visible in `[rangeStart, rangeEnd]`.
205
+ * Recurring rows are expanded to one instance per matching day (keeping the base
206
+ * event's time-of-day and duration); single rows are included when they overlap
207
+ * the window. Result is sorted by start (all-day first within a start).
208
+ */
209
+ export function resolveEvents<TData>(
210
+ rows: ReadonlyArray<TData>,
211
+ spec: EventSpec<TData>,
212
+ rangeStart: Date,
213
+ rangeEnd: Date,
214
+ ): ResolvedEvent<TData>[] {
215
+ const defDur = Math.max(1, spec.defaultDurationMin ?? 60)
216
+ const out: ResolvedEvent<TData>[] = []
217
+
218
+ for (const row of rows) {
219
+ const start = toDate(spec.getStart(row))
220
+ if (!start) continue
221
+ const rawEnd = spec.getEnd ? toDate(spec.getEnd(row)) : null
222
+ const end =
223
+ rawEnd && rawEnd.getTime() > start.getTime()
224
+ ? rawEnd
225
+ : new Date(start.getTime() + defDur * MS_MIN)
226
+ const durationMs = end.getTime() - start.getTime()
227
+
228
+ const rowKey = spec.getKey(row)
229
+ const title = spec.getTitle?.(row) ?? ''
230
+ const allDay = spec.getAllDay?.(row) ?? false
231
+ const color = spec.getColor?.(row)
232
+ const color2 = spec.getSecondaryColor?.(row)
233
+ const status = spec.getStatus?.(row)
234
+ const resourceId = spec.getResource?.(row)
235
+ const rule = spec.getRecurrence?.(row)
236
+
237
+ if (rule) {
238
+ // One instance per matching day, carrying the base time-of-day + duration.
239
+ // Recurrence begins at the event's OWN start - never emit an occurrence
240
+ // before it, so clip the expansion's lower bound to the start date (a rule
241
+ // like "weekly on Mon-Fri" must not back-fill days before the event began).
242
+ const from = start.getTime() > rangeStart.getTime() ? start : rangeStart
243
+ const days = expandRecurrence(rule, from, rangeEnd)
244
+ // Per-occurrence overrides keyed by the occurrence's canonical start time.
245
+ const exs = spec.getExceptions?.(row)
246
+ const exMap = exs?.length
247
+ ? new Map(exs.map((e) => [toDate(e.occurrenceStart)?.getTime() ?? NaN, e]))
248
+ : null
249
+ for (const day of days) {
250
+ const occStart = allDay ? startOfDay(day) : withTime(day, start)
251
+ const ex = exMap?.get(occStart.getTime())
252
+ if (ex?.deleted) continue // this occurrence was removed
253
+ let iStart = occStart
254
+ let iEnd = new Date(occStart.getTime() + durationMs)
255
+ let iTitle = title
256
+ let iAllDay = allDay
257
+ // Per-occurrence overrides of ANY other field: merge onto a copy of the
258
+ // row for this instance, then re-derive the surfaced props from it so a
259
+ // "This event" change to attendees / calendar / color / resource shows.
260
+ let iRow = row
261
+ let iColor = color
262
+ let iColor2 = color2
263
+ let iStatus = status
264
+ let iResource = resourceId
265
+ if (ex) {
266
+ const exS = toDate(ex.start)
267
+ const exE = toDate(ex.end)
268
+ if (exS) {
269
+ iStart = exS
270
+ iEnd = exE && exE.getTime() > exS.getTime() ? exE : new Date(exS.getTime() + durationMs)
271
+ } else if (exE) {
272
+ iEnd = exE
273
+ }
274
+ if (ex.title != null) iTitle = ex.title
275
+ if (ex.allDay != null) iAllDay = ex.allDay
276
+ if (ex.fields) {
277
+ iRow = { ...(row as Record<string, unknown>), ...ex.fields } as TData
278
+ iColor = spec.getColor?.(iRow) ?? color
279
+ iColor2 = spec.getSecondaryColor?.(iRow) ?? color2
280
+ iStatus = spec.getStatus?.(iRow) ?? status
281
+ iResource = spec.getResource?.(iRow) ?? resourceId
282
+ if (ex.title == null) iTitle = spec.getTitle?.(iRow) ?? iTitle
283
+ }
284
+ }
285
+ if (!rangesOverlap(iStart, iEnd, rangeStart, rangeEnd)) continue
286
+ out.push({
287
+ // Key on the CANONICAL occurrence start so a moved occurrence keeps its identity.
288
+ key: `${rowKey}#${occStart.getFullYear()}-${occStart.getMonth() + 1}-${occStart.getDate()}T${occStart.getHours()}:${occStart.getMinutes()}`,
289
+ rowKey,
290
+ row: iRow,
291
+ title: iTitle,
292
+ start: iStart,
293
+ end: iEnd,
294
+ allDay: iAllDay,
295
+ color: iColor,
296
+ color2: iColor2,
297
+ status: iStatus,
298
+ resourceId: iResource,
299
+ recurring: true,
300
+ occurrenceStart: occStart,
301
+ isException: !!ex,
302
+ })
303
+ }
304
+ } else if (rangesOverlap(start, end, rangeStart, rangeEnd)) {
305
+ out.push({
306
+ key: rowKey,
307
+ rowKey,
308
+ row,
309
+ title,
310
+ start,
311
+ end,
312
+ allDay,
313
+ color,
314
+ color2,
315
+ status,
316
+ resourceId,
317
+ recurring: false,
318
+ })
319
+ }
320
+ }
321
+
322
+ out.sort((a, b) => {
323
+ const d = a.start.getTime() - b.start.getTime()
324
+ if (d !== 0) return d
325
+ if (a.allDay !== b.allDay) return a.allDay ? -1 : 1
326
+ return a.end.getTime() - b.end.getTime()
327
+ })
328
+ return out
329
+ }
330
+
331
+ /** Events that touch `day` (any calendar day the event spans), timed + all-day. */
332
+ export function eventsOnDay<TData>(
333
+ events: ReadonlyArray<ResolvedEvent<TData>>,
334
+ day: Date,
335
+ ): ResolvedEvent<TData>[] {
336
+ const dayStart = startOfDay(day)
337
+ const dayEnd = addDays(dayStart, 1)
338
+ return events.filter((e) => rangesOverlap(e.start, e.end, dayStart, dayEnd))
339
+ }
340
+
341
+ /**
342
+ * A continuous month-view bar for one event within one week row: the columns it
343
+ * spans (`startCol`..`endCol`, 0-6) and the `lane` (stack row) it sits in. Events
344
+ * that cross a week boundary are split into one segment per week (with
345
+ * `continuesLeft`/`continuesRight` flags so the view can flatten that edge).
346
+ */
347
+ export type MonthSegment<TData = unknown> = {
348
+ event: ResolvedEvent<TData>
349
+ startCol: number
350
+ endCol: number
351
+ lane: number
352
+ continuesLeft: boolean
353
+ continuesRight: boolean
354
+ }
355
+
356
+ const MS_DAY = 86_400_000
357
+
358
+ /**
359
+ * Lay out one week row of the month grid as continuous spanning bars. `weekStart`
360
+ * is the local-midnight first day of the 7-day row. Returns each overlapping
361
+ * event as a {@link MonthSegment} clipped to the week, with greedy lane packing
362
+ * so bars never overlap, plus the total `laneCount`.
363
+ */
364
+ export function monthWeekSegments<TData>(
365
+ events: ReadonlyArray<ResolvedEvent<TData>>,
366
+ weekStart: Date,
367
+ ): { segments: MonthSegment<TData>[]; laneCount: number } {
368
+ const ws = startOfDay(weekStart)
369
+ const we = addDays(ws, 7)
370
+ const colOf = (d: Date) => Math.floor((startOfDay(d).getTime() - ws.getTime()) / MS_DAY)
371
+
372
+ const out: MonthSegment<TData>[] = []
373
+ for (const e of events) {
374
+ const firstDay = startOfDay(e.start)
375
+ // Last covered day: the day of (end - 1ms), so an end at exact midnight does
376
+ // not spill onto the next day. Guard against zero/negative-length events.
377
+ const lastDay = startOfDay(new Date(Math.max(e.start.getTime(), e.end.getTime() - 1)))
378
+ if (lastDay.getTime() < ws.getTime() || firstDay.getTime() >= we.getTime()) continue
379
+ const startCol = Math.max(0, colOf(firstDay))
380
+ const endCol = Math.min(6, colOf(lastDay))
381
+ if (endCol < startCol) continue
382
+ out.push({
383
+ event: e,
384
+ startCol,
385
+ endCol,
386
+ lane: 0,
387
+ continuesLeft: firstDay.getTime() < ws.getTime(),
388
+ continuesRight: lastDay.getTime() >= we.getTime(),
389
+ })
390
+ }
391
+
392
+ // Order: earliest start, then longest, then all-day before timed, then start time.
393
+ out.sort(
394
+ (a, b) =>
395
+ a.startCol - b.startCol ||
396
+ b.endCol - b.startCol - (a.endCol - a.startCol) ||
397
+ (a.event.allDay === b.event.allDay
398
+ ? a.event.start.getTime() - b.event.start.getTime()
399
+ : a.event.allDay
400
+ ? -1
401
+ : 1),
402
+ )
403
+
404
+ // Greedy lane packing: a lane tracks the last column it is occupied through.
405
+ const laneEnd: number[] = []
406
+ for (const seg of out) {
407
+ let lane = 0
408
+ for (; lane < laneEnd.length; lane++) if (seg.startCol > (laneEnd[lane] ?? -1)) break
409
+ laneEnd[lane] = seg.endCol
410
+ seg.lane = lane
411
+ }
412
+ return { segments: out, laneCount: laneEnd.length }
413
+ }
414
+
415
+ /** A timed event positioned within a time-grid column. `topPct`/`heightPct` are
416
+ * 0-100 of the visible day; `leftPct`/`widthPct`/`zIndex` place it horizontally
417
+ * among overlapping peers (already resolved for the chosen collision mode). */
418
+ export type PositionedEvent<TData = unknown> = {
419
+ event: ResolvedEvent<TData>
420
+ topPct: number
421
+ heightPct: number
422
+ col: number
423
+ colCount: number
424
+ leftPct: number
425
+ widthPct: number
426
+ zIndex: number
427
+ }
428
+
429
+ /** A `+N more` tile emitted by `cap` mode for the events that didn't fit. */
430
+ export type OverflowMarker<TData = unknown> = {
431
+ topPct: number
432
+ heightPct: number
433
+ leftPct: number
434
+ widthPct: number
435
+ /** Number of hidden events this tile stands for. */
436
+ count: number
437
+ /** The hidden events (chronological), for the "+N more" popover. */
438
+ events: ResolvedEvent<TData>[]
439
+ }
440
+
441
+ /** The full time-grid layout for one day: positioned events + any overflow tiles. */
442
+ export type DayLayout<TData = unknown> = {
443
+ events: PositionedEvent<TData>[]
444
+ overflows: OverflowMarker<TData>[]
445
+ }
446
+
447
+ export type LayoutOptions = {
448
+ dayStartHour?: number
449
+ dayEndHour?: number
450
+ /** Collision layout mode. Default `split`. */
451
+ mode?: SchedulerCollisionMode
452
+ /** `cap` mode: max columns before overflow (min 2). Default 3. */
453
+ maxColumns?: number
454
+ /** `stack` mode: horizontal offset per overlapping event, in % of column. */
455
+ stackOffsetPct?: number
456
+ /** `stack` mode: the narrowest a stacked event may get, in % of column. */
457
+ stackMinWidthPct?: number
458
+ }
459
+
460
+ /**
461
+ * Lay out the timed events of a single day for the time-grid, resolving
462
+ * collisions per {@link SchedulerCollisionMode}. `dayStartHour`/`dayEndHour`
463
+ * bound the visible band (e.g. 8..18); events are clamped to it. All-day events
464
+ * are ignored here (the view renders them in a separate all-day row).
465
+ */
466
+ export function layoutDayEvents<TData>(
467
+ dayEvents: ReadonlyArray<ResolvedEvent<TData>>,
468
+ day: Date,
469
+ opts: LayoutOptions = {},
470
+ ): DayLayout<TData> {
471
+ const dayStartHour = opts.dayStartHour ?? 0
472
+ const dayEndHour = opts.dayEndHour ?? 24
473
+ const mode = opts.mode ?? 'split'
474
+ const maxColumns = Math.max(2, Math.floor(opts.maxColumns ?? 3))
475
+ const stackOffset = opts.stackOffsetPct ?? 14
476
+ const stackMinWidth = opts.stackMinWidthPct ?? 42
477
+
478
+ const base = startOfDay(day)
479
+ const bandStartMin = dayStartHour * 60
480
+ const bandEndMin = dayEndHour * 60
481
+ const bandLen = Math.max(1, bandEndMin - bandStartMin)
482
+
483
+ type Item = { event: ResolvedEvent<TData>; startMin: number; endMin: number; col: number }
484
+ const items: Item[] = []
485
+ for (const e of dayEvents) {
486
+ if (e.allDay) continue
487
+ const s = Math.max(bandStartMin, (e.start.getTime() - base.getTime()) / MS_MIN)
488
+ const en = Math.min(bandEndMin, (e.end.getTime() - base.getTime()) / MS_MIN)
489
+ if (en <= bandStartMin || s >= bandEndMin) continue
490
+ items.push({ event: e, startMin: s, endMin: Math.max(s + 1, en), col: 0 })
491
+ }
492
+ items.sort((a, b) => a.startMin - b.startMin || a.endMin - b.endMin)
493
+
494
+ const events: PositionedEvent<TData>[] = []
495
+ const overflows: OverflowMarker<TData>[] = []
496
+ const topOf = (min: number) => ((min - bandStartMin) / bandLen) * 100
497
+ const heightOf = (a: number, b: number) => ((b - a) / bandLen) * 100
498
+ const maxStackShift = Math.max(0, Math.floor((100 - stackMinWidth) / stackOffset))
499
+
500
+ // Walk clusters of transitively-overlapping events; within each cluster assign
501
+ // greedy columns, then resolve horizontal geometry for the chosen mode.
502
+ let cluster: Item[] = []
503
+ let clusterEnd = -Infinity
504
+ const flush = () => {
505
+ if (!cluster.length) return
506
+ const colEnds: number[] = []
507
+ for (const it of cluster) {
508
+ let c = 0
509
+ for (; c < colEnds.length; c++) if (it.startMin >= (colEnds[c] ?? Infinity)) break
510
+ colEnds[c] = it.endMin
511
+ it.col = c
512
+ }
513
+ const colCount = colEnds.length
514
+
515
+ if (mode === 'stack' && colCount > 1) {
516
+ for (const it of cluster) {
517
+ const shift = Math.min(it.col, maxStackShift) * stackOffset
518
+ events.push({
519
+ event: it.event,
520
+ topPct: topOf(it.startMin),
521
+ heightPct: heightOf(it.startMin, it.endMin),
522
+ col: it.col,
523
+ colCount,
524
+ leftPct: shift,
525
+ widthPct: 100 - shift,
526
+ zIndex: it.col + 1,
527
+ })
528
+ }
529
+ } else if (mode === 'cap' && colCount > maxColumns) {
530
+ const realCols = maxColumns - 1 // reserve the last visible slot for overflow
531
+ const hidden: Item[] = []
532
+ for (const it of cluster) {
533
+ if (it.col < realCols) {
534
+ events.push({
535
+ event: it.event,
536
+ topPct: topOf(it.startMin),
537
+ heightPct: heightOf(it.startMin, it.endMin),
538
+ col: it.col,
539
+ colCount: maxColumns,
540
+ leftPct: (it.col / maxColumns) * 100,
541
+ widthPct: 100 / maxColumns,
542
+ zIndex: 1,
543
+ })
544
+ } else {
545
+ hidden.push(it)
546
+ }
547
+ }
548
+ if (hidden.length) {
549
+ const start = Math.min(...hidden.map((h) => h.startMin))
550
+ const end = Math.max(...hidden.map((h) => h.endMin))
551
+ overflows.push({
552
+ topPct: topOf(start),
553
+ heightPct: heightOf(start, end),
554
+ leftPct: (realCols / maxColumns) * 100,
555
+ widthPct: 100 / maxColumns,
556
+ count: hidden.length,
557
+ events: hidden.map((h) => h.event),
558
+ })
559
+ }
560
+ } else {
561
+ // split (and cap when the cluster fits within maxColumns): each event
562
+ // starts in its greedy column, then EXPANDS rightward across any columns
563
+ // that hold no event overlapping it in time - so an event with free space
564
+ // beside it fills the gap instead of staying a narrow 1/colCount sliver.
565
+ for (const it of cluster) {
566
+ let span = 1
567
+ for (let c = it.col + 1; c < colCount; c++) {
568
+ const blocked = cluster.some(
569
+ (o) => o !== it && o.col === c && o.startMin < it.endMin && o.endMin > it.startMin,
570
+ )
571
+ if (blocked) break
572
+ span++
573
+ }
574
+ events.push({
575
+ event: it.event,
576
+ topPct: topOf(it.startMin),
577
+ heightPct: heightOf(it.startMin, it.endMin),
578
+ col: it.col,
579
+ colCount,
580
+ leftPct: (it.col / colCount) * 100,
581
+ widthPct: (span / colCount) * 100,
582
+ zIndex: 1,
583
+ })
584
+ }
585
+ }
586
+
587
+ cluster = []
588
+ clusterEnd = -Infinity
589
+ }
590
+ for (const it of items) {
591
+ if (cluster.length && it.startMin >= clusterEnd) flush()
592
+ cluster.push(it)
593
+ clusterEnd = Math.max(clusterEnd, it.endMin)
594
+ }
595
+ flush()
596
+ return { events, overflows }
597
+ }
598
+
599
+ /** One day's bucket of events for the agenda (list) view. */
600
+ export type AgendaGroup<TData = unknown> = {
601
+ day: Date
602
+ events: ResolvedEvent<TData>[]
603
+ }
604
+
605
+ /** Group resolved events by calendar day for the agenda view (days with no
606
+ * events are omitted; groups and their events are in chronological order). */
607
+ export function agendaGroups<TData>(
608
+ events: ReadonlyArray<ResolvedEvent<TData>>,
609
+ ): AgendaGroup<TData>[] {
610
+ const groups: AgendaGroup<TData>[] = []
611
+ for (const e of [...events].sort((a, b) => a.start.getTime() - b.start.getTime())) {
612
+ const last = groups[groups.length - 1]
613
+ if (last && isSameDay(last.day, e.start)) last.events.push(e)
614
+ else groups.push({ day: startOfDay(e.start), events: [e] })
615
+ }
616
+ return groups
617
+ }
618
+
619
+ /**
620
+ * The visible date window for a view anchored on `anchor`. Used both to size the
621
+ * grid and to bound event resolution (recurrence expansion clips to it).
622
+ * `agendaDays` controls the agenda span (default 30).
623
+ */
624
+ export function rangeForView(
625
+ view: SchedulerView,
626
+ anchor: Date,
627
+ weekStartsOn = 0,
628
+ agendaDays = 30,
629
+ ): { start: Date; end: Date } {
630
+ switch (view) {
631
+ case 'month': {
632
+ const start = startOfWeek(startOfMonth(anchor), weekStartsOn)
633
+ return { start, end: addDays(start, 42) } // fixed 6-week grid
634
+ }
635
+ case 'week': {
636
+ const start = startOfWeek(anchor, weekStartsOn)
637
+ return { start, end: addDays(start, 7) }
638
+ }
639
+ case 'day': {
640
+ const start = startOfDay(anchor)
641
+ return { start, end: addDays(start, 1) }
642
+ }
643
+ case 'agenda': {
644
+ const start = startOfDay(anchor)
645
+ return { start, end: addDays(start, Math.max(1, agendaDays)) }
646
+ }
647
+ case 'timelineDay':
648
+ return { start: startOfDay(anchor), end: addDays(startOfDay(anchor), 1) }
649
+ case 'timelineWeek': {
650
+ const start = startOfWeek(anchor, weekStartsOn)
651
+ return { start, end: addDays(start, 7) }
652
+ }
653
+ case 'timelineMonth': {
654
+ const start = startOfMonth(anchor)
655
+ return { start, end: startOfMonth(addMonths(anchor, 1)) }
656
+ }
657
+ case 'timelineYear': {
658
+ const start = new Date(anchor.getFullYear(), 0, 1)
659
+ return { start, end: new Date(anchor.getFullYear() + 1, 0, 1) }
660
+ }
661
+ }
662
+ }
663
+
664
+ /** The 7 (or fewer) day columns rendered for the week / day views. */
665
+ export function daysForView(view: SchedulerView, anchor: Date, weekStartsOn = 0): Date[] {
666
+ if (view === 'day') return [startOfDay(anchor)]
667
+ const start = startOfWeek(anchor, weekStartsOn)
668
+ return Array.from({ length: 7 }, (_, i) => addDays(start, i))
669
+ }
670
+
671
+ /** Move the anchor one view-unit in `dir` (-1 back, +1 forward). */
672
+ export function navigateAnchor(view: SchedulerView, anchor: Date, dir: number): Date {
673
+ switch (view) {
674
+ case 'month':
675
+ return addMonths(anchor, dir)
676
+ case 'week':
677
+ return addDays(anchor, 7 * dir)
678
+ case 'day':
679
+ return addDays(anchor, dir)
680
+ case 'agenda':
681
+ return addDays(anchor, 30 * dir)
682
+ case 'timelineDay':
683
+ return addDays(anchor, dir)
684
+ case 'timelineWeek':
685
+ return addDays(anchor, 7 * dir)
686
+ case 'timelineMonth':
687
+ return addMonths(anchor, dir)
688
+ case 'timelineYear':
689
+ return new Date(anchor.getFullYear() + dir, anchor.getMonth(), anchor.getDate())
690
+ }
691
+ }
692
+
693
+ // --- timeline views (horizontal: time left→right, resources as rows) ----------
694
+
695
+ const TL_WD = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
696
+ const TL_MO = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
697
+ const tlHourLabel = (h: number) =>
698
+ h === 0 ? '12 AM' : h < 12 ? `${h} AM` : h === 12 ? '12 PM' : `${h - 12} PM`
699
+
700
+ /** One column of the timeline's minor (tick) header row. */
701
+ export type TimelineTick = {
702
+ start: Date
703
+ end: Date
704
+ leftPct: number
705
+ widthPct: number
706
+ label: string
707
+ today: boolean
708
+ }
709
+ /** One cell of the timeline's major (grouping) header row, spanning several ticks. */
710
+ export type TimelineMajor = { label: string; leftPct: number; widthPct: number }
711
+ /** The horizontal axis: its window [start, end] (the day band for `timelineDay`),
712
+ * the minor `ticks`, and the coarser `majors` above them. */
713
+ export type TimelineAxis = {
714
+ start: Date
715
+ end: Date
716
+ totalMs: number
717
+ ticks: TimelineTick[]
718
+ majors: TimelineMajor[]
719
+ }
720
+
721
+ // Group consecutive ticks that share a key into a coarser major cell.
722
+ function groupMajors(
723
+ ticks: TimelineTick[],
724
+ keyOf: (t: TimelineTick) => string,
725
+ labelOf: (t: TimelineTick) => string,
726
+ ): TimelineMajor[] {
727
+ const out: (TimelineMajor & { _k?: string })[] = []
728
+ for (const t of ticks) {
729
+ const k = keyOf(t)
730
+ const last = out[out.length - 1]
731
+ if (last && last._k === k) last.widthPct += t.widthPct
732
+ else out.push({ _k: k, label: labelOf(t), leftPct: t.leftPct, widthPct: t.widthPct })
733
+ }
734
+ return out.map(({ _k, ...m }) => m)
735
+ }
736
+
737
+ /**
738
+ * Build the timeline header axis for `view` over `[rangeStart, rangeEnd]`. For
739
+ * `timelineDay` the axis is clamped to the `dayStartHour..dayEndHour` band (so
740
+ * events outside it clip, matching the vertical day view). Ticks are hours (day),
741
+ * days (week / month) or months (year); majors are the date, the month(s), or
742
+ * quarters. All geometry is percentage of the axis window.
743
+ */
744
+ export function timelineAxis(
745
+ view: SchedulerView,
746
+ rangeStart: Date,
747
+ rangeEnd: Date,
748
+ opts: { dayStartHour?: number; dayEndHour?: number; today?: Date | null } = {},
749
+ ): TimelineAxis {
750
+ const dayStartHour = opts.dayStartHour ?? 0
751
+ const dayEndHour = opts.dayEndHour ?? 24
752
+ const today = opts.today ? startOfDay(opts.today) : null
753
+ const isToday = (d: Date) => (today ? isSameDay(d, today) : false)
754
+
755
+ let start = rangeStart
756
+ let end = rangeEnd
757
+ if (view === 'timelineDay') {
758
+ start = new Date(rangeStart.getFullYear(), rangeStart.getMonth(), rangeStart.getDate(), dayStartHour)
759
+ end = new Date(rangeStart.getFullYear(), rangeStart.getMonth(), rangeStart.getDate(), 0, 0, 0, 0)
760
+ end = new Date(end.getTime() + dayEndHour * 3_600_000)
761
+ }
762
+ const total = Math.max(1, end.getTime() - start.getTime())
763
+ const base = start.getTime()
764
+ const mk = (s: Date, e: Date, label: string): TimelineTick => ({
765
+ start: s,
766
+ end: e,
767
+ leftPct: ((s.getTime() - base) / total) * 100,
768
+ widthPct: ((e.getTime() - s.getTime()) / total) * 100,
769
+ label,
770
+ today: isToday(s),
771
+ })
772
+
773
+ const ticks: TimelineTick[] = []
774
+ let majors: TimelineMajor[] = []
775
+
776
+ if (view === 'timelineDay') {
777
+ for (let h = dayStartHour; h < dayEndHour; h++) {
778
+ const s = new Date(rangeStart.getFullYear(), rangeStart.getMonth(), rangeStart.getDate(), h)
779
+ ticks.push(mk(s, new Date(s.getTime() + 3_600_000), tlHourLabel(h)))
780
+ }
781
+ majors = [
782
+ { label: `${TL_WD[rangeStart.getDay()]}, ${TL_MO[rangeStart.getMonth()]} ${rangeStart.getDate()}`, leftPct: 0, widthPct: 100 },
783
+ ]
784
+ } else if (view === 'timelineWeek' || view === 'timelineMonth') {
785
+ let cur = startOfDay(start)
786
+ while (cur.getTime() < end.getTime()) {
787
+ const nxt = addDays(cur, 1)
788
+ const label = view === 'timelineWeek' ? `${TL_WD[cur.getDay()]} ${cur.getDate()}` : `${cur.getDate()}`
789
+ ticks.push(mk(cur, nxt, label))
790
+ cur = nxt
791
+ }
792
+ majors = groupMajors(
793
+ ticks,
794
+ (t) => `${t.start.getFullYear()}-${t.start.getMonth()}`,
795
+ (t) => `${TL_MO[t.start.getMonth()]} ${t.start.getFullYear()}`,
796
+ )
797
+ } else if (view === 'timelineYear') {
798
+ const y = rangeStart.getFullYear()
799
+ for (let m = 0; m < 12; m++) {
800
+ ticks.push(mk(new Date(y, m, 1), new Date(y, m + 1, 1), TL_MO[m]))
801
+ }
802
+ majors = groupMajors(
803
+ ticks,
804
+ (t) => `${Math.floor(t.start.getMonth() / 3)}`,
805
+ (t) => `Q${Math.floor(t.start.getMonth() / 3) + 1} ${t.start.getFullYear()}`,
806
+ )
807
+ }
808
+
809
+ return { start, end, totalMs: total, ticks, majors }
810
+ }
811
+
812
+ /** An event's horizontal geometry within the axis window, or `null` when it
813
+ * falls entirely outside it. `continuesLeft/Right` flag a clipped edge. */
814
+ export function timelineGeom(
815
+ start: Date,
816
+ end: Date,
817
+ axisStart: Date,
818
+ axisMs: number,
819
+ ): { leftPct: number; widthPct: number; continuesLeft: boolean; continuesRight: boolean } | null {
820
+ const a = axisStart.getTime()
821
+ const b = a + axisMs
822
+ const s = Math.max(start.getTime(), a)
823
+ const e = Math.min(end.getTime(), b)
824
+ if (e <= a || s >= b || e <= s) return null
825
+ return {
826
+ leftPct: ((s - a) / axisMs) * 100,
827
+ widthPct: ((e - s) / axisMs) * 100,
828
+ continuesLeft: start.getTime() < a,
829
+ continuesRight: end.getTime() > b,
830
+ }
831
+ }
832
+
833
+ /** One resource's timeline row: its events lane-packed so overlaps stack. */
834
+ export type TimelineRow<TData = unknown> = {
835
+ resource: SchedulerResource | null
836
+ laneCount: number
837
+ items: { event: ResolvedEvent<TData>; lane: number }[]
838
+ }
839
+
840
+ /**
841
+ * Bucket `events` by resource into rows (a single `null` row when there are no
842
+ * resources), then greedily lane-pack each row so overlapping events stack. An
843
+ * event whose `resourceId` matches no resource is dropped.
844
+ */
845
+ export function timelineRows<TData>(
846
+ resources: ReadonlyArray<SchedulerResource> | null | undefined,
847
+ events: ReadonlyArray<ResolvedEvent<TData>>,
848
+ ): TimelineRow<TData>[] {
849
+ const hasRes = !!(resources && resources.length)
850
+ const rows = hasRes
851
+ ? resources!.map((r) => ({ resource: r as SchedulerResource | null, evs: [] as ResolvedEvent<TData>[] }))
852
+ : [{ resource: null as SchedulerResource | null, evs: [] as ResolvedEvent<TData>[] }]
853
+ const byId = new Map<string | null, (typeof rows)[number]>()
854
+ for (const r of rows) byId.set(r.resource?.id ?? null, r)
855
+
856
+ for (const ev of events) {
857
+ const row = hasRes ? byId.get(ev.resourceId ?? '') : rows[0]
858
+ if (row) row.evs.push(ev)
859
+ }
860
+
861
+ return rows.map((r) => {
862
+ const sorted = [...r.evs].sort((a, b) => a.start.getTime() - b.start.getTime() || a.end.getTime() - b.end.getTime())
863
+ const laneEnd: number[] = []
864
+ const items = sorted.map((event) => {
865
+ let lane = 0
866
+ for (; lane < laneEnd.length; lane++) if (event.start.getTime() >= (laneEnd[lane] ?? -Infinity)) break
867
+ laneEnd[lane] = event.end.getTime()
868
+ return { event, lane }
869
+ })
870
+ return { resource: r.resource, laneCount: Math.max(1, laneEnd.length), items }
871
+ })
872
+ }