{ "$schema": "https://shadcn-svelte.com/schema/registry-item.json", "name": "big-calendar", "title": "Big Calendar", "type": "registry:ui", "description": "A month, week, day, and agenda scheduling surface with exclusive event end dates, fullscreen navigation, and height-aware month rows.", "dependencies": [ "@internationalized/date@^3.12.2", "@lucide/svelte@^1.28.0" ], "registryDependencies": [ "./status-badge.json", "button", "calendar", "card", "popover", "skeleton", "toggle-group" ], "files": [ { "content": "\n\n{#if groups.length === 0}\n\t
\n\t\t

{emptyLabel}

\n\t\t

\n\t\t\tNothing is scheduled in this range. Step forward or pick another date.\n\t\t

\n\t
\n{:else}\n\t
\n\t\t{#each groups as group (group.day.getTime())}\n\t\t\t
\n\t\t\t\t\n\t\t\t\t\t{formatFullDayLabel(group.day, locale)}\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t{#each group.events as event (event.id)}\n\t\t\t\t\t\t\n\t\t\t\t\t{/each}\n\t\t\t\t
\n\t\t\t
\n\t\t{/each}\n\t\n{/if}\n", "type": "registry:file", "target": "big-calendar/big-calendar-agenda.svelte" }, { "content": "import type { BigCalendarView, BigCalendarWeekday } from './big-calendar-types.js';\n\nexport const MINUTE_MS = 60 * 1000;\nexport const HOUR_MS = 60 * MINUTE_MS;\nexport const DAY_MS = 24 * HOUR_MS;\n\n/**\n * All arithmetic here runs in the viewer's local time zone, so an unparseable\n * or missing anchor would spread `NaN` through every column. Fall back to today.\n */\nexport function resolveCalendarDate(date: Date | undefined, fallback = new Date()): Date {\n\tif (!date || Number.isNaN(date.getTime())) return new Date(fallback);\n\treturn new Date(date);\n}\n\nexport function startOfDay(date: Date): Date {\n\treturn new Date(date.getFullYear(), date.getMonth(), date.getDate());\n}\n\nexport function addDays(date: Date, amount: number): Date {\n\tconst result = new Date(date);\n\tresult.setDate(result.getDate() + amount);\n\treturn result;\n}\n\nexport function addMonths(date: Date, amount: number): Date {\n\treturn new Date(date.getFullYear(), date.getMonth() + amount, 1);\n}\n\nexport function startOfMonth(date: Date): Date {\n\treturn new Date(date.getFullYear(), date.getMonth(), 1);\n}\n\nexport function startOfWeek(date: Date, weekStartsOn: BigCalendarWeekday): Date {\n\tconst result = startOfDay(date);\n\tresult.setDate(result.getDate() - ((result.getDay() - weekStartsOn + 7) % 7));\n\treturn result;\n}\n\nexport function isSameDay(a: Date, b: Date): boolean {\n\treturn (\n\t\ta.getFullYear() === b.getFullYear() &&\n\t\ta.getMonth() === b.getMonth() &&\n\t\ta.getDate() === b.getDate()\n\t);\n}\n\n/** Days between two local dates, ignoring the time of day and DST-shortened days. */\nexport function differenceInDays(later: Date, earlier: Date): number {\n\treturn Math.round((startOfDay(later).getTime() - startOfDay(earlier).getTime()) / DAY_MS);\n}\n\nexport function buildDayRange(start: Date, count: number): Date[] {\n\tconst days: Date[] = [];\n\tfor (let index = 0; index < count; index += 1) days.push(addDays(startOfDay(start), index));\n\treturn days;\n}\n\nexport interface CalendarRange {\n\t/** Exclusive, matching `BigCalendarEvent`. */\n\tend: Date;\n\tstart: Date;\n}\n\n/**\n * The range the view claims to be showing. The month view draws whole weeks, so\n * its rendered grid is wider than this — see `buildMonthWeeks`.\n */\nexport function getPeriodRange(\n\tview: BigCalendarView,\n\tanchor: Date,\n\tweekStartsOn: BigCalendarWeekday,\n\tagendaLength: number\n): CalendarRange {\n\tif (view === 'month') {\n\t\tconst start = startOfMonth(anchor);\n\t\treturn { start, end: addMonths(start, 1) };\n\t}\n\tif (view === 'week') {\n\t\tconst start = startOfWeek(anchor, weekStartsOn);\n\t\treturn { start, end: addDays(start, 7) };\n\t}\n\tif (view === 'day') {\n\t\tconst start = startOfDay(anchor);\n\t\treturn { start, end: addDays(start, 1) };\n\t}\n\tconst start = startOfDay(anchor);\n\treturn { start, end: addDays(start, Math.max(1, agendaLength)) };\n}\n\n/** Days actually drawn, which for the month view is the surrounding whole weeks. */\nexport function getVisibleDays(\n\tview: BigCalendarView,\n\tanchor: Date,\n\tweekStartsOn: BigCalendarWeekday,\n\tagendaLength: number\n): Date[] {\n\tif (view === 'month') return buildMonthWeeks(anchor, weekStartsOn).flat();\n\tconst { start, end } = getPeriodRange(view, anchor, weekStartsOn, agendaLength);\n\treturn buildDayRange(start, differenceInDays(end, start));\n}\n\n/**\n * Whole weeks covering the anchor's month. The row count follows the month\n * rather than being fixed at six, so a short month does not draw a trailing\n * week that belongs entirely to the next one.\n */\nexport function buildMonthWeeks(anchor: Date, weekStartsOn: BigCalendarWeekday): Date[][] {\n\tconst monthStart = startOfMonth(anchor);\n\tconst gridStart = startOfWeek(monthStart, weekStartsOn);\n\tconst monthEnd = addMonths(monthStart, 1);\n\tconst weekCount = Math.ceil(differenceInDays(monthEnd, gridStart) / 7);\n\tconst weeks: Date[][] = [];\n\tfor (let week = 0; week < weekCount; week += 1) {\n\t\tweeks.push(buildDayRange(addDays(gridStart, week * 7), 7));\n\t}\n\treturn weeks;\n}\n\nexport function shiftCalendarDate(\n\tview: BigCalendarView,\n\tanchor: Date,\n\tsteps: number,\n\tagendaLength: number\n): Date {\n\tif (view === 'month') return addMonths(anchor, steps);\n\tif (view === 'week') return addDays(anchor, steps * 7);\n\tif (view === 'day') return addDays(anchor, steps);\n\treturn addDays(anchor, steps * Math.max(1, agendaLength));\n}\n\n/** Minutes from local midnight, used to place blocks in the hour grid. */\nexport function minutesSinceMidnight(date: Date, day: Date): number {\n\treturn (date.getTime() - startOfDay(day).getTime()) / MINUTE_MS;\n}\n", "type": "registry:file", "target": "big-calendar/big-calendar-date.ts" }, { "content": "\n\n onEventClick(event) : undefined}\n\tclass={cn(\n\t\t'w-full min-w-0 overflow-hidden text-left text-xs leading-tight',\n\t\tinteractive &&\n\t\t\t'cursor-pointer transition-opacity hover:opacity-85 focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50',\n\t\tvariant === 'row'\n\t\t\t? 'flex items-start gap-2 rounded-md px-2 py-1.5 hover:bg-accent'\n\t\t\t: getEventToneClass(event.tone),\n\t\tvariant === 'band' && 'flex h-5 items-center gap-1 rounded-sm px-1.5 font-medium',\n\t\tvariant === 'band' && continuesBefore && 'rounded-l-none',\n\t\tvariant === 'band' && continuesAfter && 'rounded-r-none',\n\t\tvariant === 'block' && 'flex h-full flex-col rounded-sm px-1.5 py-0.5',\n\t\tclassName\n\t)}\n>\n\t{#if variant === 'row'}\n\t\t\n\t\t{time}\n\t\t\n\t\t\n\t\t\t{event.title}\n\t\t\t{#if event.description}\n\t\t\t\t{event.description}\n\t\t\t{/if}\n\t\t\n\t{:else if variant === 'band'}\n\t\t{#if continuesBefore}‹{/if}\n\t\t{event.title}\n\t\t{#if continuesAfter}›{/if}\n\t{:else}\n\t\t{event.title}\n\t\t{time}\n\t{/if}\n\n", "type": "registry:file", "target": "big-calendar/big-calendar-event.svelte" }, { "content": "import type {\n\tBigCalendarAgendaGroup,\n\tBigCalendarBlock,\n\tBigCalendarDayRow,\n\tBigCalendarEvent,\n\tBigCalendarSegment\n} from './big-calendar-types.js';\n\nimport {\n\taddDays,\n\tDAY_MS,\n\tdifferenceInDays,\n\tminutesSinceMidnight,\n\tstartOfDay\n} from './big-calendar-date.js';\n\n/** Shortest span a normalized event may have, so a point in time still draws. */\nconst MIN_DURATION_MS = 15 * 60 * 1000;\n\nfunction clamp(value: number, min: number, max: number): number {\n\treturn Math.min(Math.max(value, min), max);\n}\n\n/**\n * Events arrive from callers and ultimately from upstream systems, so a missing\n * or reversed range is expected rather than exceptional. Drop what cannot be\n * placed at all and repair what can, instead of laying out `NaN`.\n */\nexport function normalizeEvents(events: BigCalendarEvent[]): BigCalendarEvent[] {\n\tconst normalized: BigCalendarEvent[] = [];\n\tfor (const event of events) {\n\t\tconst start = event.start instanceof Date ? event.start.getTime() : Number.NaN;\n\t\tconst end = event.end instanceof Date ? event.end.getTime() : Number.NaN;\n\t\tif (Number.isNaN(start)) continue;\n\t\tconst safeEnd = Number.isNaN(end) || end <= start ? start + MIN_DURATION_MS : end;\n\t\tnormalized.push({ ...event, start: new Date(start), end: new Date(safeEnd) });\n\t}\n\treturn sortEvents(normalized);\n}\n\n/** Earliest first, then longest first, so wider bands settle into the top lanes. */\nexport function sortEvents(events: BigCalendarEvent[]): BigCalendarEvent[] {\n\treturn [...events].sort((a, b) => {\n\t\tconst byStart = a.start.getTime() - b.start.getTime();\n\t\tif (byStart !== 0) return byStart;\n\t\tconst byDuration =\n\t\t\tb.end.getTime() - b.start.getTime() - (a.end.getTime() - a.start.getTime());\n\t\tif (byDuration !== 0) return byDuration;\n\t\treturn a.title.localeCompare(b.title);\n\t});\n}\n\nexport function overlapsRange(event: BigCalendarEvent, start: Date, end: Date): boolean {\n\treturn event.start.getTime() < end.getTime() && event.end.getTime() > start.getTime();\n}\n\n/**\n * Whether an event belongs in a day-spanning band rather than the hour grid.\n * A timed event that crosses midnight cannot be drawn as one block in a single\n * day column, so it joins the all-day lane alongside explicitly all-day events.\n */\nexport function isAllDayEvent(event: BigCalendarEvent): boolean {\n\tif (event.allDay) return true;\n\tif (event.end.getTime() - event.start.getTime() >= DAY_MS) return true;\n\treturn !isSameLocalDay(event.start, new Date(event.end.getTime() - 1));\n}\n\nfunction isSameLocalDay(a: Date, b: Date): boolean {\n\treturn startOfDay(a).getTime() === startOfDay(b).getTime();\n}\n\n/**\n * Lay events out as horizontal bands across a row of days, stacking overlapping\n * bands into lanes. Used for both a month week row and the all-day lane of the\n * week and day grids. `maxLanes` of `null` keeps every lane.\n */\nexport function packDayRow(\n\tdays: Date[],\n\tevents: BigCalendarEvent[],\n\tmaxLanes: null | number = null\n): BigCalendarDayRow {\n\tconst overflowByColumn = days.map(() => 0);\n\tconst segments: BigCalendarSegment[] = [];\n\tif (days.length === 0) return { days, segments, overflowByColumn, laneCount: 0 };\n\n\tconst rowStart = startOfDay(days[0]);\n\tconst rowEnd = addDays(startOfDay(days[days.length - 1]), 1);\n\tconst lanes: boolean[][] = [];\n\tlet laneCount = 0;\n\n\tfor (const event of sortEvents(events)) {\n\t\tif (!overlapsRange(event, rowStart, rowEnd)) continue;\n\n\t\tconst columnStart = clamp(differenceInDays(event.start, rowStart), 0, days.length - 1);\n\t\t// `end` is exclusive, so the last covered day is the one holding `end - 1ms`.\n\t\tconst lastCovered = new Date(event.end.getTime() - 1);\n\t\tconst columnEnd = clamp(differenceInDays(lastCovered, rowStart), columnStart, days.length - 1);\n\n\t\tlet lane = lanes.findIndex((occupied) => {\n\t\t\tfor (let column = columnStart; column <= columnEnd; column += 1) {\n\t\t\t\tif (occupied[column]) return false;\n\t\t\t}\n\t\t\treturn true;\n\t\t});\n\t\tif (lane === -1) {\n\t\t\tlane = lanes.length;\n\t\t\tlanes.push(days.map(() => false));\n\t\t}\n\t\tfor (let column = columnStart; column <= columnEnd; column += 1) lanes[lane][column] = true;\n\n\t\tif (maxLanes !== null && lane >= maxLanes) {\n\t\t\tfor (let column = columnStart; column <= columnEnd; column += 1) overflowByColumn[column] += 1;\n\t\t\tcontinue;\n\t\t}\n\n\t\tlaneCount = Math.max(laneCount, lane + 1);\n\t\tsegments.push({\n\t\t\tcolumnStart,\n\t\t\tcontinuesAfter: event.end.getTime() > rowEnd.getTime(),\n\t\t\tcontinuesBefore: event.start.getTime() < rowStart.getTime(),\n\t\t\tevent,\n\t\t\tkey: `${event.id}:${rowStart.getTime()}:${columnStart}`,\n\t\t\tlane,\n\t\t\tspan: columnEnd - columnStart + 1\n\t\t});\n\t}\n\n\treturn { days, segments, overflowByColumn, laneCount };\n}\n\n/**\n * Vertical metrics of a month week row, in rem. They mirror the row's grid\n * template in `big-calendar-month.svelte`; change both together.\n */\nexport const MONTH_ROW_REM = {\n\theader: 1.75,\n\tlane: 1.375,\n\tgap: 0.125,\n\tmore: 1,\n\tpaddingBottom: 0.25\n} as const;\n\n/**\n * Lanes a filled month row can draw at the height it was given. Every lane is\n * shown when they all fit; otherwise room is kept for the \"+N more\" line, and\n * at least one lane always shows so a short row still hints at its contents.\n */\nexport function fitMonthLanes(rowHeightRem: number, laneCount: number): number {\n\tconst { header, lane, gap, more, paddingBottom } = MONTH_ROW_REM;\n\t// The header, the \"+N more\" row and the trailing filler each add a gap.\n\tconst room = rowHeightRem - header - paddingBottom - 2 * gap;\n\tconst fitsAll = Math.floor((room + 1e-6) / (lane + gap));\n\tif (laneCount <= fitsAll) return laneCount;\n\treturn Math.max(1, Math.floor((room - more + 1e-6) / (lane + gap)));\n}\n\n/** Every event touching a day, in display order. Used by the \"+N more\" popover. */\nexport function getEventsForDay(\n\tday: Date,\n\tevents: BigCalendarEvent[]\n): BigCalendarEvent[] {\n\tconst dayStart = startOfDay(day);\n\tconst dayEnd = addDays(dayStart, 1);\n\treturn sortEvents(events.filter((event) => overlapsRange(event, dayStart, dayEnd)));\n}\n\n/**\n * Place timed events inside one day column of the hour grid, splitting mutually\n * overlapping events into side-by-side columns. Ratios are relative to the\n * visible hour window so the caller owns the pixel height.\n */\nexport function buildTimeBlocks(\n\tday: Date,\n\tevents: BigCalendarEvent[],\n\tstartHour: number,\n\tendHour: number\n): BigCalendarBlock[] {\n\tconst windowStart = startHour * 60;\n\tconst windowEnd = endHour * 60;\n\tconst windowLength = windowEnd - windowStart;\n\tif (windowLength <= 0) return [];\n\n\tconst placed: Array<{\n\t\tblock: BigCalendarBlock;\n\t\tendMinutes: number;\n\t\tstartMinutes: number;\n\t}> = [];\n\n\tfor (const event of sortEvents(events)) {\n\t\tif (isAllDayEvent(event)) continue;\n\t\tconst rawStart = minutesSinceMidnight(event.start, day);\n\t\tconst rawEnd = minutesSinceMidnight(event.end, day);\n\t\tif (rawEnd <= windowStart || rawStart >= windowEnd) continue;\n\n\t\tconst startMinutes = clamp(rawStart, windowStart, windowEnd);\n\t\tconst endMinutes = clamp(rawEnd, windowStart, windowEnd);\n\t\tplaced.push({\n\t\t\tblock: {\n\t\t\t\tcolumn: 0,\n\t\t\t\tcolumnCount: 1,\n\t\t\t\tcontinuesAfter: rawEnd > windowEnd,\n\t\t\t\tcontinuesBefore: rawStart < windowStart,\n\t\t\t\tevent,\n\t\t\t\theightRatio: (endMinutes - startMinutes) / windowLength,\n\t\t\t\tkey: `${event.id}:${startOfDay(day).getTime()}`,\n\t\t\t\ttopRatio: (startMinutes - windowStart) / windowLength\n\t\t\t},\n\t\t\tendMinutes,\n\t\t\tstartMinutes\n\t\t});\n\t}\n\n\t// Split into clusters of transitively overlapping blocks; each cluster is\n\t// divided into as many columns as its widest pile-up requires.\n\tlet cluster: typeof placed = [];\n\tlet clusterEnd = Number.NEGATIVE_INFINITY;\n\tconst flush = (): void => {\n\t\tif (cluster.length === 0) return;\n\t\tconst columnEnds: number[] = [];\n\t\tfor (const item of cluster) {\n\t\t\tlet column = columnEnds.findIndex((end) => end <= item.startMinutes);\n\t\t\tif (column === -1) {\n\t\t\t\tcolumn = columnEnds.length;\n\t\t\t\tcolumnEnds.push(item.endMinutes);\n\t\t\t} else {\n\t\t\t\tcolumnEnds[column] = item.endMinutes;\n\t\t\t}\n\t\t\titem.block.column = column;\n\t\t}\n\t\tfor (const item of cluster) item.block.columnCount = columnEnds.length;\n\t\tcluster = [];\n\t};\n\n\tfor (const item of placed) {\n\t\tif (item.startMinutes >= clusterEnd) {\n\t\t\tflush();\n\t\t\tclusterEnd = item.endMinutes;\n\t\t} else {\n\t\t\tclusterEnd = Math.max(clusterEnd, item.endMinutes);\n\t\t}\n\t\tcluster.push(item);\n\t}\n\tflush();\n\n\treturn placed.map((item) => item.block);\n}\n\n/**\n * Group events by the days they cover within the range. An event spanning three\n * days appears under each of them, so scanning one day tells the whole story.\n */\nexport function buildAgendaGroups(\n\tevents: BigCalendarEvent[],\n\tstart: Date,\n\tend: Date\n): BigCalendarAgendaGroup[] {\n\tconst groups: BigCalendarAgendaGroup[] = [];\n\tconst dayCount = differenceInDays(end, start);\n\tfor (let index = 0; index < dayCount; index += 1) {\n\t\tconst day = addDays(startOfDay(start), index);\n\t\tconst dayEvents = getEventsForDay(day, events);\n\t\tif (dayEvents.length > 0) groups.push({ day, events: dayEvents });\n\t}\n\treturn groups;\n}\n", "type": "registry:file", "target": "big-calendar/big-calendar-layout.ts" }, { "content": "\n\n
\n\t
\n\t\t{#each weekdayLabels as label, index (index)}\n\t\t\t
\n\t\t\t\t{label}\n\t\t\t
\n\t\t{/each}\n\t
\n\n\t{#each rows as row, weekIndex (weekIndex)}\n\t\t\n\t\t\n\t\t\t\n\t\t\t
\n\t\t\t\t{#each row.days as day (day.getTime())}\n\t\t\t\t\t{@const outside = day.getMonth() !== anchorMonth}\n\t\t\t\t\t{@const cellClass = cn(\n\t\t\t\t\t\t'border-r last:border-r-0',\n\t\t\t\t\t\toutside && 'bg-muted/30',\n\t\t\t\t\t\tisSameDay(day, today) && 'bg-primary/5'\n\t\t\t\t\t)}\n\t\t\t\t\t{#if onSlotClick}\n\t\t\t\t\t\t selectDay(day)}\n\t\t\t\t\t\t\tclass={cn(\n\t\t\t\t\t\t\t\tcellClass,\n\t\t\t\t\t\t\t\t'cursor-pointer hover:bg-accent/50 focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-inset focus-visible:ring-ring/50'\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t{:else}\n\t\t\t\t\t\t
\n\t\t\t\t\t{/if}\n\t\t\t\t{/each}\n\t\t\t
\n\n\t\t\t\n\t\t\t\t{#each row.days as day, column (day.getTime())}\n\t\t\t\t\t{@const outside = day.getMonth() !== anchorMonth}\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{day.getDate()}\n\t\t\t\t\t\t\n\t\t\t\t\t
\n\t\t\t\t{/each}\n\n\t\t\t\t{#each row.segments as segment (segment.key)}\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t{/each}\n\n\t\t\t\t{#each row.days as day, column (day.getTime())}\n\t\t\t\t\t{#if row.overflowByColumn[column] > 0}\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t+{row.overflowByColumn[column]} more\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t{formatFullDayLabel(day, locale)}\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t{#each getEventsForDay(day, events) as event (event.id)}\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t{/each}\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t{/if}\n\t\t\t\t{/each}\n\t\t\t\n\t\t\n\t{/each}\n\n", "type": "registry:file", "target": "big-calendar/big-calendar-month.svelte" }, { "content": "import type {\n\tBigCalendarEvent,\n\tBigCalendarEventTone,\n\tBigCalendarView\n} from './big-calendar-types.js';\n\nimport { addDays, isSameDay, startOfDay } from './big-calendar-date.js';\nimport { isAllDayEvent } from './big-calendar-layout.js';\n\nexport const VIEW_LABELS: Record = {\n\tagenda: 'Agenda',\n\tday: 'Day',\n\tmonth: 'Month',\n\tweek: 'Week'\n};\n\n/** Filled bands, used where the event is the whole affordance. */\nexport function getEventToneClass(tone: BigCalendarEventTone | undefined): string {\n\tif (tone === 'secondary') return 'bg-secondary text-secondary-foreground ring-1 ring-border';\n\tif (tone === 'accent') return 'bg-accent text-accent-foreground ring-1 ring-border';\n\tif (tone === 'muted') return 'bg-muted text-muted-foreground ring-1 ring-border';\n\tif (tone === 'destructive') return 'bg-destructive/15 text-destructive ring-1 ring-destructive/25';\n\tif (tone === 'success') return 'bg-success/15 text-success ring-1 ring-success/25';\n\tif (tone === 'warning') return 'bg-warning/15 text-warning ring-1 ring-warning/25';\n\treturn 'bg-primary text-primary-foreground';\n}\n\n/** The small dot in month chips and agenda rows, where text stays foreground-coloured. */\nexport function getEventDotClass(tone: BigCalendarEventTone | undefined): string {\n\tif (tone === 'secondary') return 'bg-secondary-foreground';\n\tif (tone === 'accent') return 'bg-accent-foreground';\n\tif (tone === 'muted') return 'bg-muted-foreground';\n\tif (tone === 'destructive') return 'bg-destructive';\n\tif (tone === 'success') return 'bg-success';\n\tif (tone === 'warning') return 'bg-warning';\n\treturn 'bg-primary';\n}\n\nfunction formatter(locale: string, options: Intl.DateTimeFormatOptions): Intl.DateTimeFormat {\n\treturn new Intl.DateTimeFormat(locale, options);\n}\n\nexport function formatTime(date: Date, locale: string): string {\n\treturn formatter(locale, { hour: 'numeric', minute: '2-digit' }).format(date);\n}\n\nexport function formatHourLabel(hour: number, locale: string): string {\n\treturn formatter(locale, { hour: 'numeric' }).format(new Date(2000, 0, 1, hour));\n}\n\nexport function formatWeekdayLabel(day: Date, locale: string, short = true): string {\n\treturn formatter(locale, { weekday: short ? 'short' : 'long' }).format(day);\n}\n\nexport function formatDayLabel(day: Date, locale: string): string {\n\treturn formatter(locale, { day: 'numeric', month: 'short' }).format(day);\n}\n\nexport function formatFullDayLabel(day: Date, locale: string): string {\n\treturn formatter(locale, {\n\t\tday: 'numeric',\n\t\tmonth: 'long',\n\t\tweekday: 'long',\n\t\tyear: 'numeric'\n\t}).format(day);\n}\n\n/** The heading for the visible range. `end` is exclusive. */\nexport function formatRangeTitle(\n\tview: BigCalendarView,\n\tstart: Date,\n\tend: Date,\n\tlocale: string\n): string {\n\tif (view === 'month') return formatter(locale, { month: 'long', year: 'numeric' }).format(start);\n\tif (view === 'day') return formatFullDayLabel(start, locale);\n\n\t// `formatRange` collapses the parts the two ends share, in the order the\n\t// locale wants them — \"Aug 17 – 23, 2026\" rather than a hand-assembled string.\n\tconst last = addDays(startOfDay(end), -1);\n\treturn formatter(locale, { day: 'numeric', month: 'short', year: 'numeric' }).formatRange(\n\t\tstart,\n\t\tlast\n\t);\n}\n\n/** The time range shown beside an event title. All-day events report their span. */\nexport function formatEventTime(event: BigCalendarEvent, locale: string): string {\n\tif (!isAllDayEvent(event)) {\n\t\treturn `${formatTime(event.start, locale)} – ${formatTime(event.end, locale)}`;\n\t}\n\tconst lastCovered = new Date(event.end.getTime() - 1);\n\tif (isSameDay(event.start, lastCovered)) return 'All day';\n\treturn `${formatDayLabel(event.start, locale)} – ${formatDayLabel(lastCovered, locale)}`;\n}\n\nexport function getContinuationLabel(continuesBefore: boolean, continuesAfter: boolean): string {\n\tif (continuesBefore && continuesAfter) return 'Starts and ends outside this range';\n\tif (continuesBefore) return 'Starts before this range';\n\tif (continuesAfter) return 'Continues past this range';\n\treturn '';\n}\n\n/** The accessible name for an event control, so a chip is not read as bare text. */\nexport function describeEvent(event: BigCalendarEvent, locale: string): string {\n\tconst parts = [event.title, formatEventTime(event, locale)];\n\tif (event.description) parts.push(event.description);\n\treturn parts.join(', ');\n}\n", "type": "registry:file", "target": "big-calendar/big-calendar-presentation.ts" }, { "content": "\n\n
\n\t
\n\t\t
\n\t\t{#each days as day (day.getTime())}\n\t\t\t\n\t\t\t\t
{formatWeekdayLabel(day, locale)}
\n\t\t\t\t\n\t\t\t\t\t{day.getDate()}\n\t\t\t\t
\n\t\t\t
\n\t\t{/each}\n\t\n\n\t{#if allDayRow.segments.length > 0}\n\t\t
\n\t\t\t
All day
\n\t\t\t\n\t\t\t\t{#each allDayRow.segments as segment (segment.key)}\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t
\n\t\t\t\t{/each}\n\t\t\t\n\t\t\n\t{/if}\n\n\t\n\t
\n\t\t\n\t\t\t
\n\t\t\t\t{#each hours as hour, index (hour)}\n\t\t\t\t\t{#if index > 0}\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{formatHourLabel(hour, locale)}\n\t\t\t\t\t\t
\n\t\t\t\t\t{/if}\n\t\t\t\t{/each}\n\t\t\t
\n\n\t\t\t{#each columns as column (column.day.getTime())}\n\t\t\t\t\n\t\t\t\t\t{#if onSlotClick}\n\t\t\t\t\t\t{#each hours as hour (hour)}\n\t\t\t\t\t\t\t selectSlot(column.day, hour)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t{/each}\n\t\t\t\t\t{/if}\n\n\t\t\t\t\t{#each column.blocks as block (block.key)}\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t{/each}\n\n\t\t\t\t\t{#if nowRatio !== null && isSameDay(column.day, now)}\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t{/if}\n\t\t\t\t\n\t\t\t{/each}\n\t\t\n\t\n\n", "type": "registry:file", "target": "big-calendar/big-calendar-time-grid.svelte" }, { "content": "\n\n
\n\t\t{#if filters}\n\t\t\t{@render filters()}\n\t\t{/if}\n\t\t{#if views.length > 1}\n\t\t\t\n\t\t\t\t{#each views as item (item)}\n\t\t\t\t\t\n\t\t\t\t\t\t{VIEW_LABELS[item]}\n\t\t\t\t\t\n\t\t\t\t{/each}\n\t\t\t\n\t\t{/if}\n\t
\n\t\t\n\t\t\t\n\t\t\t\t{#snippet child({ props })}\n\t\t\t\t\t\n\t\t\t\t\t\t{rangeTitle}\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t{/snippet}\n\t\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\n\t\t\n\t\t\n\t\t onNavigate(-1)}\n\t\t>\n\t\t\t\n\t\t\n\t\t\n\t\t\n\t\t\t{#if isFullscreen}\n\t\t\t\t\n\t\t\t{:else}\n\t\t\t\t\n\t\t\t{/if}\n\t\t\n\t
\n
\n", "type": "registry:file", "target": "big-calendar/big-calendar-toolbar.svelte" }, { "content": "import type { Snippet } from 'svelte';\n\nexport type BigCalendarView = 'agenda' | 'day' | 'month' | 'week';\n\nexport type BigCalendarEventTone =\n\t| 'accent'\n\t| 'destructive'\n\t| 'muted'\n\t| 'primary'\n\t| 'secondary'\n\t| 'success'\n\t| 'warning';\n\n/** Sunday is 0, matching `Date.prototype.getDay`. */\nexport type BigCalendarWeekday = 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\n/**\n * A scheduled entry. `end` is exclusive, matching `GanttEvent` and common\n * calendar APIs. An all-day entry covering July 6–10 passes July 6 as `start`\n * and July 11 as `end`.\n */\nexport interface BigCalendarEvent {\n\tallDay?: boolean;\n\tdata?: TData;\n\t/** Secondary line shown in the agenda list and the event tooltip. */\n\tdescription?: string;\n\tend: Date;\n\tid: string;\n\tstart: Date;\n\ttitle: string;\n\ttone?: BigCalendarEventTone;\n}\n\n/** A contiguous run of days one event occupies inside one rendered day row. */\nexport interface BigCalendarSegment {\n\t/** Zero-based index of the first day column this segment covers. */\n\tcolumnStart: number;\n\t/** True when the event continues past the last day of this row. */\n\tcontinuesAfter: boolean;\n\t/** True when the event began before the first day of this row. */\n\tcontinuesBefore: boolean;\n\tevent: BigCalendarEvent;\n\tkey: string;\n\t/** Stacking row within the day row. Zero is the topmost. */\n\tlane: number;\n\t/** Number of day columns covered, at least one. */\n\tspan: number;\n}\n\nexport interface BigCalendarDayRow {\n\tdays: Date[];\n\t/** Lanes actually occupied by `segments`, so callers can size the row. */\n\tlaneCount: number;\n\t/** Count of segments hidden by the lane budget, per day column. */\n\toverflowByColumn: number[];\n\t/** Segments that fit within the lane budget. */\n\tsegments: BigCalendarSegment[];\n}\n\n/** A timed event placed inside one day column of the week or day grid. */\nexport interface BigCalendarBlock {\n\t/** Zero-based column within the cluster of mutually overlapping blocks. */\n\tcolumn: number;\n\t/** Total columns the cluster was split into. */\n\tcolumnCount: number;\n\t/** True when the event ends after the visible hour window. */\n\tcontinuesAfter: boolean;\n\t/** True when the event starts before the visible hour window. */\n\tcontinuesBefore: boolean;\n\tevent: BigCalendarEvent;\n\t/** Height as a fraction of the visible hour window. */\n\theightRatio: number;\n\tkey: string;\n\t/** Offset from the top of the visible hour window, as a fraction of it. */\n\ttopRatio: number;\n}\n\nexport interface BigCalendarAgendaGroup {\n\tday: Date;\n\tevents: BigCalendarEvent[];\n}\n\nexport interface BigCalendarSlot {\n\t/** Exclusive, matching `BigCalendarEvent`. */\n\tend: Date;\n\tstart: Date;\n}\n\nexport interface BigCalendarProps {\n\t/** Days covered by one page of the agenda view. */\n\tagendaLength?: number;\n\t/**\n\t * `card` wraps the calendar in its own titled card. Use `bare` when it is\n\t * already inside a card that carries the heading, so the two do not nest.\n\t */\n\tchrome?: 'bare' | 'card';\n\tclass?: string;\n\tdefaultDate?: Date;\n\tdefaultView?: BigCalendarView;\n\t/** Shown when the visible range holds no events. */\n\temptyLabel?: string;\n\t/** Exclusive last hour drawn in the week and day grids, 1–24. */\n\tendHour?: number;\n\tevents: BigCalendarEvent[];\n\t/**\n\t * Stretch the calendar to the height its container offers instead of sizing\n\t * to its rows. The container must give it a height to fill — inside a\n\t * `flex-1` column the month rows share the leftover space evenly.\n\t */\n\tfill?: boolean;\n\tloading?: boolean;\n\tlocale?: string;\n\t/** Lanes a month cell shows before collapsing the rest into \"+N more\". */\n\tmaxEventsPerDay?: number;\n\tonDateChange?: (date: Date) => void;\n\tonEventClick?: (event: BigCalendarEvent) => void;\n\t/** Fired when an empty day cell or hour slot is activated. */\n\tonSlotClick?: (slot: BigCalendarSlot) => void;\n\tonViewChange?: (view: BigCalendarView) => void;\n\t/** Hour the week and day grids scroll to on load, 0–23. */\n\tscrollToHour?: number;\n\t/** First hour drawn in the week and day grids, 0–23. */\n\tstartHour?: number;\n\ttitle?: string;\n\t/** Optional controls rendered at the start of the calendar toolbar. */\n\ttoolbarStart?: Snippet;\n\t/** Views offered in the toolbar, in the order given. */\n\tviews?: BigCalendarView[];\n\tweekStartsOn?: BigCalendarWeekday;\n}\n", "type": "registry:file", "target": "big-calendar/big-calendar-types.ts" }, { "content": "\n\n\n\n{#snippet toolbar()}\n\t goToDate(new Date())}\n\t\tonNavigate={navigate}\n\t\tonToggleFullscreen={toggleFullscreen}\n\t\tonViewSelect={selectView}\n\t\tview={activeView}\n\t\tviews={offeredViews}\n\t/>\n{/snippet}\n\n{#snippet body()}\n\t{#if loading}\n\t\t
\n\t\t\t{#each Array.from({ length: 5 }, (_, index) => index) as row (row)}\n\t\t\t\t\n\t\t\t{/each}\n\t\t
\n\t{:else if activeView === 'month'}\n\t\t\n\t{:else if activeView === 'agenda'}\n\t\t
\n\t\t\t\n\t\t
\n\t{:else}\n\t\t\n\t{/if}\n{/snippet}\n\n{#if chrome === 'bare'}\n\t\n\t\n\t\t
\n\t\t\t{@render toolbar()}\n\t\t
\n\t\t\n\t\t\t{@render body()}\n\t\t\n\t\n{:else}\n\t\n\t\t
\n\t\t\t\n\t\t\t\t{title}\n\t\t\t\t{visibleEvents.length}\n\t\t\t\n\t\t\t
{@render toolbar()}
\n\t\t
\n\t\t\n\t\t\t{@render body()}\n\t\t\n\t\n{/if}\n", "type": "registry:file", "target": "big-calendar/big-calendar.svelte" }, { "content": "export type {\n\tBigCalendarAgendaGroup,\n\tBigCalendarBlock,\n\tBigCalendarDayRow,\n\tBigCalendarEvent,\n\tBigCalendarEventTone,\n\tBigCalendarProps,\n\tBigCalendarSegment,\n\tBigCalendarSlot,\n\tBigCalendarView,\n\tBigCalendarWeekday\n} from './big-calendar-types.js';\n\nexport { default as BigCalendar } from './big-calendar.svelte';\n", "type": "registry:file", "target": "big-calendar/index.ts" } ] }