Component library · Lunnoa Reports

Narrative

<Recommendation>

workshopAgendaContentNarrative

Actionable next step with priority, owner, and effort.

When to use: Whenever the report tells the client to do something. Always answer 'what should they do, and by when'. Use sparingly: a 12-page report typically has 5–8.

Preview

RecommendationDo nowEffort: MOwner: COO + IT Director

Commit to a 12-week first wave covering invoice intake, order acks, and HR triage

The three use cases share a deployment pattern (Lunnoa agent + ERP API + ticket fan-out) and together cover the largest concentration of manual hours we observed.

Prop	Type	Notes
priority	"now" \| "next" \| "later"	Optional. Default: `next`. Wave assignment. now = wave 1, next = wave 2, later = backlog.Values: now, next, laterExample: `now`
title	string	Required. The recommendation as an imperative sentence.Example: `Commit to a 12-week first wave covering invoice intake, order acks, and HR triage`
owner	string	Optional. Named role or person responsible.Example: `COO + IT Director`
effort	"S" \| "M" \| "L" \| "XL"	Optional. T-shirt size estimate.Values: S, M, L, XLExample: `M`
children	ReactNode	Required. Rationale and next-step detail.

Examples

<Recommendation priority="now" title="Commit to a 12-week first wave covering invoice intake, order acks, and HR triage" effort="M" owner="COO + IT Director">
    The three use cases share a deployment pattern (Lunnoa agent + ERP
    API + ticket fan-out) and together cover the largest concentration of
    manual hours we observed.
</Recommendation>

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

Phase 1 — Foundation
Weeks 1–3
- ERP middleware exposed
- Lunnoa platform deployed
Phase 2 — Build the three flows
Weeks 4–8
- HR triage live week 5
- Invoice intake live week 8

Prop	Type	Notes
phases	{ label: string; when: string; status?: 'done'\|'active'\|'planned'; items?: string[] }[]	Required. Phases in chronological order.
title	string	Optional. Section title for the timeline.
description	string	Optional. 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"] }
    ]}
/>