displaying-timelineslisted

# Displaying Timelines & Activity Components ## Purpose This skill enables systematic creation of timeline and activity components, from simple vertical timelines to complex interactive Gantt charts. It provides clear decision frameworks based on use case and data characteristics, ensuring optimal performance, real-time updates, and accessible implementations. ## When to Use Activate this skill when: - Creating activity feeds (social, notifications, audit logs) - Displaying timelines (vertical, horizontal, interactive) - Building Gantt charts or project schedules - Implementing calendar interfaces (month, week, day views) - Showing chronological events or historical data - Handling real-time activity updates - Requiring timestamp formatting (relative, absolute) - Ensuring timeline accessibility or responsive behavior ## Quick Decision Framework Select component type based on use case: ``` Social Activity → Activity Feed (infinite scroll, reactions) System Events → Audit Log (searchable, exportable, precise timestamps) User Notifications → Notification Feed (read/unread, grouped by date) Historical Events → Vertical Timeline (milestones, alternating sides) Project Planning → Gantt Chart (dependencies, drag-to-reschedule) Scheduling → Calendar Interface (month/week/day views) Interactive Roadmap → Horizontal Timeline (zoom, pan, filter) ``` For detailed selection criteria, reference `references/component-selection.md`. ## C