C
CalendoPro

Timeline Agenda Calendar

Vertical timeline with grouped events – perfect for schedules & meetings

Add Event

All Events

Settings

Usage Example

// Initialize Timeline Calendar
const timeline = new CalendoPro.Timeline('#my-timeline', {
  daysToShow: 7,
  expandable: true,
  showEmptyDays: false,
  events: [
    {
      id: '1',
      date: '2025-01-15',
      title: 'Team Standup',
      time: '09:00',
      description: 'Daily sync',
      color: '#6366f1'
    }
  ],
  onEventClick: (event) => console.log('Clicked:', event)
});
📋

Grouped by Date

Events automatically grouped and sorted by date and time.

🔄

Expand/Collapse

Toggle day groups to focus on what matters.

📌

Sticky Headers

Date headers stay visible while scrolling through events.