Scheduler - Timeline View
Render horizontal day, week, month, and year timelines with long event content and RTL support.
#Usage
import { Scheduler } from '@primeui/vue-scheduler';<Scheduler.Root view="timelineWeek" :timeline-slot-duration="60" :timeline-slot-width="96">
<Scheduler.Header />
<Scheduler.Content>
<Scheduler.Timeline>
<Scheduler.TimelineHeaderCell />
<Scheduler.TimelineCell />
<Scheduler.TimelineEvent />
</Scheduler.Timeline>
</Scheduler.Content>
</Scheduler.Root>Timeline views turn time into horizontal lanes. The header-cell, timeline-cell, and timeline-event outlets are the main parts to customize when duration, scrolling, and dense horizontal planning are the focus.
#Day
Use timelineDay for short ranges and precise duration comparisons.
#Timeline Week
timelineWeek uses a horizontal range for multi-day duration and order comparisons.
#Month
timelineMonth shows longer event windows, header tiers, and horizontal scrolling.
#Year
timelineYear stresses virtual scrolling and compact event labels.
#Long Content
Long titles and durations should stay readable instead of overflowing into neighboring lanes.
#RTL
Timeline view supports right-to-left direction with the same event data and interaction model.
#Customization
Customize timeline event bars with application-owned cards. Timeline geometry handles horizontal placement, duration sizing, drag state, and scroll behavior.
#API
Timeline-focused view values are timelineDay, timelineWeek, timelineMonth, and timelineYear. Common props are timelineSlotDuration, timelineSlotWidth, timelineVirtualScroll, and Scheduler.TimelineEvent.