StellarUI

<stellar-calendar-event>

Calendar event card that can stand alone or feed `stellar-calendar-events`.

Properties

Component

Example

Preview

Markup

Copy

<stellar-calendar-event
  date="2026-04-22"
  start="08:30"
  end="09:30"
  title="Standup"
  appearance="soft"
  tone="primary"
>
</stellar-calendar-event>

API

Complete props, events, slots, and implementation notes for the event card.

Props

Prop	Type	Default
`date`	`string`	`''`
`start`	`string`	`''`
`end`	`string`	`''`
`title`	`string`	`''`
`subtitle`	`string`	`''`
`appearance`	`solid \| outline \| dash \| soft \| ghost \| link`	`solid`
`tone`	`neutral \| primary \| secondary \| tertiary \| error`	`neutral`
`readonly`	`boolean`	`false`
`disabled`	`boolean`	`false`

Events

Event	Kind	Notes

Slots

Slot	Notes

Notes

The event card renders by itself and can also be consumed as a source child by `<stellar-calendar-events>`.
Use `date`, `start`, `end`, `title`, `subtitle`, `appearance`, and `tone` to build event cards in the calendar grid.
Set `date` as ISO (`YYYY-MM-DD`) or use `HH:MM` with an inline fallback day.