Calendar Canvas
Display calendar views and enable interactive meeting time selection.
Example Prompts
Try asking:
- •"Schedule a 30-minute meeting with Alice and Bob sometime next week"
- •"Find a time when the engineering team is all free on Tuesday"
- •"Show me my calendar for this week"
- •"When is everyone available for a 1-hour planning session?"
- •"Block off 2-4pm on Friday for focused work"
OpenCode Tools
High-Level (Recommended)
Pick a meeting time:
code
Use canvas_pick_meeting_time with:
calendars: [
{
name: "Alice",
events: [
{ id: "1", title: "Standup", start: "2025-01-06T09:00:00", end: "2025-01-06T09:30:00" }
]
},
{
name: "Bob",
events: [
{ id: "2", title: "Call", start: "2025-01-06T14:00:00", end: "2025-01-06T15:00:00" }
]
}
]
durationMinutes: 30
startHour: 9
endHour: 17
Display calendar (read-only):
code
Use canvas_display_calendar with:
events: [
{ id: "1", title: "Team Meeting", start: "2025-01-06T10:00:00", end: "2025-01-06T11:00:00" }
]
Low-Level (Full Control)
code
Use canvas_spawn with:
kind: "calendar"
scenario: "meeting-picker" or "display"
config: { calendars: [...], durationMinutes: 30 }
Scenarios
display (default)
View-only calendar display. User can navigate weeks but cannot select times.
meeting-picker
Interactive scenario for selecting a free time slot when viewing multiple people's calendars.
- •Shows multiple calendars overlaid with different colors
- •User can click on free slots to select a meeting time
- •Selection is returned via IPC
- •Supports configurable time slot granularity (15/30/60 min)
Configuration
Display Config
typescript
interface CalendarConfig {
events: CalendarEvent[];
}
interface CalendarEvent {
id: string;
title: string;
start: string; // ISO datetime
end: string; // ISO datetime
calendar?: string; // Calendar name
location?: string;
description?: string;
}
Meeting Picker Config
typescript
interface MeetingPickerConfig {
calendars: NamedCalendar[];
durationMinutes?: number; // Default: 30
startHour?: number; // Default: 9
endHour?: number; // Default: 17
}
interface NamedCalendar {
name: string; // Person's name
events: CalendarEvent[]; // Their busy times
}
Controls
Display scenario:
- •
Left/Rightorh/l: Navigate between days - •
norPageDown: Next week - •
porPageUp: Previous week - •
t: Jump to today - •
qorEsc: Quit
Meeting picker scenario:
- •Mouse click: Select a free time slot
- •
Left/Right: Navigate weeks - •
t: Jump to today - •
qorEsc: Cancel selection
Selection Result
typescript
interface MeetingPickerResult {
startTime: string; // ISO datetime
endTime: string; // ISO datetime
duration: number; // Minutes
}
Tool Response
The canvas_pick_meeting_time tool returns:
typescript
{
success: true,
data: {
startTime: "2025-01-06T10:00:00",
endTime: "2025-01-06T10:30:00",
duration: 30
}
}
// or
{
success: true,
cancelled: true // User pressed Esc/q
}
// or
{
success: false,
error: "Canvas requires a tmux session"
}