Calendar Planner

1"use client";
2 
3import { useRef, useState, useMemo, useEffect, useCallback } from "react";
4import { motion, AnimatePresence } from "motion/react";
5import { cn } from "@/lib/utils";
6 
7/**
8 * Calendar Planner — a vertical stream of days.
9 *
10 * No grid. Time flows downward like a notebook.
11 * Past days fade, today glows with an accent bar,
12 * future days wait quietly. Events live inline,
13 * right next to the date they belong to.
14 * Select a day, type, press Enter.
15 *
16 * The stream IS the schedule.
17 */
18 
19/* ── Types ── */
20 
21export interface PlannerEvent {
22  id: string;
23  title: string;
24  date: string; // "YYYY-MM-DD"
25}
26 
27export interface CalendarPlannerProps {
28  events?: PlannerEvent[];
29  onAdd?: (event: PlannerEvent) => void;
30  onRemove?: (id: string) => void;
31  sound?: boolean;
32}
33 
34/* ── Constants ── */
35 
36const DAY_NAMES = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
37 
38/* ── Helpers ── */
39 
40function pad2(n: number): string {
41  return String(n).padStart(2, "0");
42}
43 
44function toKey(y: number, m: number, d: number): string {
45  return `${y}-${pad2(m + 1)}-${pad2(d)}`;
46}
47 
48function getDayName(y: number, m: number, d: number): string {
49  return DAY_NAMES[(new Date(y, m, d).getDay() + 6) % 7];
50}
51 
52function isWeekend(y: number, m: number, d: number): boolean {
53  const dow = new Date(y, m, d).getDay();
54  return dow === 0 || dow === 6;
55}
56 
57/* ── Audio ── */
58 
59let _ctx: AudioContext | null = null;
60let _buf: AudioBuffer | null = null;
61 
62function audioCtx() {
63  if (!_ctx) {
64    _ctx = new (window.AudioContext ||
65      (window as unknown as { webkitAudioContext: typeof AudioContext })
66        .webkitAudioContext)();
67  }
68  if (_ctx.state === "suspended") _ctx.resume();
69  return _ctx;
70}
71 
72function ensureBuf(ac: AudioContext): AudioBuffer {
73  if (_buf && _buf.sampleRate === ac.sampleRate) return _buf;
74  const rate = ac.sampleRate;
75  const len = Math.floor(rate * 0.003);
76  const buf = ac.createBuffer(1, len, rate);
77  const ch = buf.getChannelData(0);
78  for (let i = 0; i < len; i++) {
79    const t = i / len;
80    ch[i] = (Math.random() * 2 - 1) * (1 - t) ** 4;
81  }
82  _buf = buf;
83  return buf;
84}
85 
86function playTick(last: React.MutableRefObject<number>) {
87  const now = performance.now();
88  if (now - last.current < 80) return;
89  last.current = now;
90  try {
91    const ac = audioCtx();
92    const buf = ensureBuf(ac);
93    const src = ac.createBufferSource();
94    const gain = ac.createGain();
95    src.buffer = buf;
96    src.playbackRate.value = 1.15;
97// … truncated