Calendar

Note

The Calendar component is experimental. The API may change in future versions.

How do I make a calendar from a model?

Point auto__model at a model and tell the calendar which date field to place events on with event__attr. By default the calendar shows the current month; pass year and month to show a specific one. Each row of the queryset becomes an event. You can also pass rows (or auto__rows) directly instead of a model:

calendar = Calendar(
    auto__model=Album,
    event__attr='published_date',
    event__display_name=lambda event, **_: event.name,
    year=1983,
    month=11,
)

▼ Hide result

Toggle structure

How do I style the calendar’s cells?

Each kind of cell has its own config namespace where you can set attrs, a tag and so on: day for a day cell, day_number for the date number inside it, weekday for the weekday header row, and today, weekend and other_month for those special days:

calendar = Calendar(
    auto__model=Album,
    event__attr='published_date',
    year=1983,
    month=11,
    today__attrs__class={'bg-warning': True},
    weekend__attrs__class={'bg-light': True},
    other_month__attrs__style__opacity='0.5',
    weekday__attrs__class={'fw-bold': True},
)

▼ Hide result

Toggle structure

How do I customize the calendar navigation and actions?

The previous/next month navigation row is configured through navigation, and you can add your own buttons or links via actions, just like on a table or form:

calendar = Calendar(
    auto__model=Album,
    event__attr='published_date',
    year=1983,
    month=11,
    navigation__attrs__class={'bg-light': True},
    actions__today=Action(display_name='Today', attrs__href='?'),
)

▼ Hide result

Toggle structure