PortfolioPage
v1.0.15Updated 27 Aug 2026Composed example portfolio page: StatCard health summary + FilterBar + program-grouped project rows, each program fused with a shared-axis TimelineHorizontal mini-Gantt.
Preview
Live · 8 storiesDefaultOpen ↗
▸Why this is recommendedpageportfolioprojectstimeline+3
The default, out-of-the-box PortfolioPage.
Recommended for+14
- ✓Reference for multi-project portfolio / PMO overview screens
- ✓Program status roll-ups with health + schedule at a glance
Tags+6
pageportfolioprojectstimelineganttexampledefault
Features+4
- StatCard health summary (on track / at risk / late / overall progress)
- FilterBar with active at-risk chip variant
- Program-grouped project rows: health Badge, owner Avatar, Progress, dates
- Per-program shared-axis TimelineHorizontal (one lane per project)
- Chart-token program identity dots
Not recommended for−2
- ✕Direct embedding
- ✕Single-project schedules (use RoadmapPage) or task boards (use KanbanPage)
Install
Ask your agent, or call the MCP tool directly. The resolved bundle is written into your project.
Usage
Tick variants in the left menu — each adds a tab with that variant’s real story source, the same code the preview above renders.
Props
No documented props — PortfolioPage is composed rather than configured. See the source for its full signature.