@luckydye/calendar 1.3.0 → 1.3.1

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@luckydye/calendar",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "author": "Tim Havlicek",
   "contributors": [],
   "description": "",
   "type": "module",
   "main": "dist/calendar.js",
-  "types": "src/calendar.ts",
+  "types": "src/lib.ts",
   "scripts": {
     "build:app": "APP=true bunx --bun vite build --outDir=dist/calendar --base=./",
     "build": "bunx --bun vite build",

package/src/CalDAVConfig.ts

@@ -44,7 +44,20 @@ interface InhouseSource extends CalendarSource {
   locked?: boolean;
 }
 
-type ConfigurableSource = CalDAVSourceConfig | ICalSource | GoogleSource | InhouseSource;
+interface TimeseriesJsonSource extends CalendarSource {
+  type: "timeseries-json";
+  credentials: {
+    url: string;
+  };
+  locked?: boolean;
+}
+
+type ConfigurableSource =
+  | CalDAVSourceConfig
+  | ICalSource
+  | GoogleSource
+  | InhouseSource
+  | TimeseriesJsonSource;
 
 interface SidebarCalendar {
   id: string;
@@ -621,6 +634,22 @@ export class CalDAVConfigElement extends LitElement {
         enabled: this.formData.enabled ?? true,
         locked: this.formData.locked ?? false,
       } as ICalSource;
+    } else if (this.formData.type === "timeseries-json") {
+      if (!this.formData.credentials?.url) {
+        return;
+      }
+
+      source = {
+        id: this.editingId || crypto.randomUUID(),
+        name: this.formData.name,
+        type: "timeseries-json",
+        credentials: {
+          url: this.formData.credentials.url,
+        },
+        color: this.formData.color || "#06B6D4",
+        enabled: this.formData.enabled ?? true,
+        locked: this.formData.locked ?? false,
+      } as TimeseriesJsonSource;
     } else if (this.formData.type === "google") {
       if (!this.formData.credentials?.accessToken) {
         alert('Please authenticate with Google before adding the calendar');
@@ -899,12 +928,15 @@ export class CalDAVConfigElement extends LitElement {
                 this.updateForm("color", "#4285F4");
               } else if (type === "caldav" && !this.formData.color) {
                 this.updateForm("color", "#FF6E68");
+              } else if (type === "timeseries-json" && !this.formData.color) {
+                this.updateForm("color", "#06B6D4");
               }
             }}
             ?disabled=${isEditing}
           >
             <option value="caldav">CalDAV (with credentials)</option>
             <option value="ical">iCal URL</option>
+            <option value="timeseries-json">Timeseries JSON (URL)</option>
             <option value="google">Google Calendar</option>
             <option value="inhouse">Inhouse Booking System</option>
           </select>
@@ -972,6 +1004,23 @@ export class CalDAVConfigElement extends LitElement {
                   />
                 </div>
               `
+            : sourceType === "timeseries-json"
+              ? html`
+                  <div class="form-group">
+                    <label class="form-label">Timeseries JSON URL</label>
+                    <input
+                      class="form-input"
+                      type="text"
+                      placeholder="https://example.com/data.json"
+                      .value=${this.formData.credentials?.url || ""}
+                      @input=${(e: Event) =>
+                        this.updateForm("url", (e.target as HTMLInputElement).value)}
+                    />
+                    <small style="color: var(--text-muted, rgba(255, 255, 255, 0.5)); font-size: 11px;">
+                      Expected format: JSON array of objects with a <code>timestamp</code> field. Rendered as a heatmap backdrop.
+                    </small>
+                  </div>
+                `
             : sourceType === "google"
               ? html`
                 <div class="google-auth-section">

package/src/CalendarInternal.ts

@@ -49,6 +49,7 @@ export interface CalendarEvent {
   status?: 'TENTATIVE' | 'CONFIRMED' | 'CANCELLED';
   reminders?: NotificationConfig[];
   isAllDay?: boolean;
+  visualStyle?: 'heatmap';
 }
 
 export interface WeekInfo {
@@ -72,8 +73,9 @@ export interface EventSegment {
 }
 
 // Configuration for the sliding window buffer
-const BUFFER_WEEKS = 12; // Weeks to keep as buffer outside viewport
-const EXTEND_WEEKS = 12; // Weeks to add when extending
+const BUFFER_WEEKS = 4; // Trigger extension when within this many weeks of the edge
+const EXTEND_WEEKS = 26; // Weeks to add per extension (~6 months); must be >> BUFFER_WEEKS so
+// the scroll thumb lands well past the buffer entry after each extension, preventing cascade
 const MAX_WEEKS = 96; // Maximum weeks to keep in memory (trim beyond this)
 
 export class CalendarInternal {
@@ -258,18 +260,21 @@ export class CalendarInternal {
 
   getFilteredEvents(filter?: string) {
     const baseEvents = Array.from(this.calendarEvents.values());
+    return this.filterEvents(baseEvents, filter);
+  }
 
+  filterEvents(events: CalendarEvent[], filter?: string): CalendarEvent[] {
     // Filter by enabled calendars
     // Note: enabledCalendars contains calendar IDs, not sourceIds
     const enabledEvents = this.enabledCalendars.size > 0
-      ? baseEvents.filter(e => {
+      ? events.filter(e => {
           // For backwards compatibility: check both sourceId and calendarId
           // CalDAV events: match via calendarId
           // Other sources: match via sourceId
           return (e.calendarId && this.enabledCalendars.has(e.calendarId)) ||
                  (e.sourceId && this.enabledCalendars.has(e.sourceId));
         })
-      : baseEvents;
+      : events;
 
     // Mark events from locked calendars as read-only
     const lockedEvents = this.lockedCalendars.size > 0

package/src/CalendarLayer.ts

@@ -0,0 +1,28 @@
+import type { WeekInfo } from "./CalendarInternal.js";
+
+// Minimum dayHeight at which timed events are rendered at their actual time-of-day position.
+export const TIME_SCALE_DAY_HEIGHT = 300;
+
+export interface LayerContext {
+	ctx: CanvasRenderingContext2D;
+	width: number;
+	height: number;
+	scrollTop: number;
+	dayWidth: number;
+	dayHeight: number;
+	leftGutterWidth: number;
+	columnsPerRow: number;
+	rowsPerWeek: number;
+	visibleWeeks: WeekInfo[];
+	allWeeks: WeekInfo[];
+	fontFamily: string;
+	styles: Record<string, string>;
+	getDayVisualPosition: (dayIndex: number) => { row: number; col: number };
+	filter: string | null;
+}
+
+export interface CalendarLayer {
+	name: string;
+	enabled: boolean;
+	render(lc: LayerContext): void;
+}