Calendar (month view)

Status: ✅ Implemented

Intent

Show dated items — a team schedule, a content plan, bookings — on a familiar month grid, so when things happen reads at a glance and clustering is visible.

Solution

Use the Calendar component: month is any LocalDate in the month to display (the grid is derived from it), and each CalendarEvent is placed on its date as a small chip. A chip carries an optional accent color and an optional actionId that makes it clickable (dispatches the standard action-requested event).

@Section("March 2026")
Component calendar = Calendar.builder()
        .month(LocalDate.of(2026, 3, 1))
        .events(List.of(
                CalendarEvent.builder().title("Sprint planning")
                        .date(LocalDate.of(2026, 3, 2)).color("#3b82f6").build(),
                CalendarEvent.builder().title("Release 3.1")
                        .date(LocalDate.of(2026, 3, 13)).color("#10b981")
                        .actionId("openRelease").build()))
        .build();

The renderer is dependency-free (a Monday-first CSS grid), themes through the standard CSS variables, marks today, and works in dark mode. On mobile (React Native) and in the IntelliJ plugin the same events render as an agenda list (sorted by date) — the natural narrow-viewport adaptation.

When to use it

Use a Calendar to show dated events on a month for scanning and light interaction (click an event to drill in). It is read-only by design; for scheduling/drag-to-create, pair it with a form that creates or moves events and re-renders. Demo: /calendar-demo.