Scheduler - Agenda View

#Usage

import { Scheduler } from '@primeui/vue-scheduler';

<Scheduler.Root view="agenda" :agenda-days="14" show-empty-days>
    <Scheduler.Header />
    <Scheduler.Content>
        <Scheduler.Agenda>
            <Scheduler.AgendaDateHeader />
            <Scheduler.AgendaEvent />
        </Scheduler.Agenda>
    </Scheduler.Content>
</Scheduler.Root>

Agenda view uses date-header and event-row parts instead of a grid. Use it for scan-friendly lists, mobile summaries, printed run sheets, and schedules where upcoming work matters more than spatial placement.

#Agenda Rows

Agenda rows pair PrimeOne event UI with grouped date headers.

#Grouped Headers

Custom agenda date grouping can place the date label and event count before the rows.

#Custom Date Header

Replace the agenda date header without replacing date grouping or count context.

#I18n

Locale output changes agenda labels while the event data stays the same.

#Customization

Customize agenda rows or date headers. The runtime context still handles grouping, event ordering, keyboard targets, and overlay triggers.

#API

Agenda-focused props include view="agenda", agendaDays, showEmptyDays, noEventsMessage, agendaEventShell, Scheduler.AgendaDateHeader, and Scheduler.AgendaEvent.

#Related Docs

• Locale and Calendars
• Event UI