Component library

Showing 1 component in the shared kit with role agenda.

Dashboard

  • <RoadmapTimeline>

    sharedTimelineAgendaContentDashboard

    Vertical phased timeline with status badges per phase.

    When to use: Use in roadmap / delivery plan sections to sequence work across phases (typically 3–5 phases). In SEO reports, use it for the remediation and content roadmap (e.g. technical fixes → content production → authority building).

    Preview

    Wave 1 — 12-week delivery

    1. Phase 1 — Foundation
      Weeks 1–3
      • ERP middleware exposed
      • Lunnoa platform deployed
    2. Phase 2 — Build the three flows
      Weeks 4–8
      • HR triage live week 5
      • Invoice intake live week 8
    PropTypeNotes
    phases{ label: string; when: string; status?: 'done'|'active'|'planned'; items?: string[] }[]Required. Phases in chronological order.
    titlestringOptional. Section title for the timeline.
    descriptionstringOptional. Subtitle.

    Examples

    <RoadmapTimeline
        title="Wave 1 — 12-week delivery"
        phases={[
            { label: "Phase 1 — Foundation", when: "Weeks 1–3", status: "active", items: ["ERP middleware exposed", "Lunnoa platform deployed"] },
            { label: "Phase 2 — Build the three flows", when: "Weeks 4–8", status: "planned", items: ["HR triage live week 5", "Invoice intake live week 8"] }
        ]}
    />