calendar: How do you express scheduled events?

A workshop schedule can show dates and sessions together. Navigating to another month changes the view, not the meeting times. Editing and persistence require separate target-specific verification.

Start with these properties

mode selects a month, week, day or agenda view. props.events is an array of schedule entries: date supplies the date and label the name. These events are calendar data, unlike node-level events that connect interactions to handlers. locale affects month and weekday names.

Read a structural example

From the source registry. This is structural reading material, not a live demo; referenced resources and actions require an application.

{
  "id": "schedule",
  "type": "calendar",
  "props": {
    "mode": "month",
    "events": [
      {
        "date": "2024-03-15",
        "label": "Team standup",
        "intent": "info"
      },
      {
        "date": "2024-03-20",
        "label": "Release v2.0",
        "intent": "success"
      }
    ]
  }
}

The dates are source examples, not this conference’s schedule. intent gives an entry information or success presentation semantics; it neither changes the date nor establishes that an event has finished. Rescheduling requires an operation on the schedule resource.

Read the calendar reference.