Calendar

A month or week of records: spans as chart-coloured bars in lanes; on phones dots and the day’s agenda.

Group: Data · Kind: macro · in the lite catalog

Preview

example

Open in the playground

Variants

view · week

Props

Prop	Type	Required	Bindable	Description
source	string	–	–	Where a records by binding lands (reads month or week).
view	month | week	–	–	Month grid or one week. Default "month".
labelField	string	–	–	The row field a bar shows. Default "title".
detailField	string	–	–	The agenda subtitle field. Default "detail".
metaField	string	–	–	The agenda meta field. Default "status".
style	style	–	–	Frame styles.

Events

• on.select: runs an action
• on.open: runs an action

Slots

None.

Children

none

A2UI basic mapping

No basic catalog component maps here.

Built from

Box · Row · Section · Text

Accessibility

Role: table

table of the month or week; each day a button named by its date (aria-selected on the selected day) that fires select in the day’s scope; each bar a button that fires open in its scope; the phone agenda a list of rows.

Keys	Action
Tab through the days and the bars; Enter Space	select a day, open a bar

Theming

Recipe parts: Calendar/root Calendar/frame Calendar/head Calendar/weekday Calendar/weekdayName Calendar/weekdayInitial Calendar/weeks Calendar/week Calendar/shade Calendar/shadeCell Calendar/cells Calendar/day Calendar/number Calendar/numberText Calendar/compact Calendar/compactNumber Calendar/compactNumberText Calendar/dots Calendar/dot Calendar/bars Calendar/segment Calendar/label Calendar/more Calendar/agenda Calendar/entry Calendar/entryTone

Keyed by: view weekend inMonth today selected tone marker contL contR :hover :pressed :focus :disabled :checked :open :selected :invalid :dragover

Themes · Write a theme

Related

Row · Section · Text · Table · Chart · Sparkline · StatTile · Timeline