feat(calendar): replace list view with month/week/day grid + date detail dialog

カレンダー画面を一覧表示から実際のカレンダーグリッドへ変更。

- lib/calendar/grid.ts: 月グリッド/週/時間グリッド/取得範囲(rangeForView)の純粋な日付ヘルパー (+22 unit tests)
- components/calendar/: CalendarView(月/週/日 切替・prev/next/今日)・MonthView(truncateチップ)・WeekView・DayView(時間グリッド+終日)・EventDetailDialog(詳細・フォーカス管理)・sourceColors
- page.tsx: view/date searchParamsから範囲を計算しServer Componentで取得、CalendarViewへ渡す
- e2e: 表示切替・詳細ダイアログ・ナビステップ(週=7日/日=1日)を追加
This commit is contained in:
Ken Yasue
2026-06-25 08:46:58 +02:00
parent 9fce9e9215
commit 41d65f58bb
11 changed files with 1127 additions and 50 deletions

View File

@ -0,0 +1,28 @@
/** カレンダーイベントの来源ごとの色とラベル。 */
export const SOURCE_COLORS: Record<string, string> = {
event: 'bg-blue-100 text-blue-700',
milestone: 'bg-purple-100 text-purple-700',
todo: 'bg-yellow-100 text-yellow-700',
};
export const SOURCE_CHIP_BORDER: Record<string, string> = {
event: 'border-blue-200',
milestone: 'border-purple-200',
todo: 'border-yellow-200',
};
export const SOURCE_LABELS: Record<string, string> = {
event: 'イベント',
milestone: 'マイルストーン',
todo: 'ToDo',
};
export const WEEKDAY_LABELS = [
'日',
'月',
'火',
'水',
'木',
'金',
'土',
] as const;