Runtime fingerprintToken readout from the active provider chain.
Live DS
Runtime
Platform
Rottay
Rottay / ModernPlatform Flagship
Primary
#0A0A0ASecondary #6B6B6B
Radius
14pxxl 18px
Density
normalBorder-light cards
Accent
Badge
Compact runtime evidence across 3+ token signals.
Published DS package · Pattern Library · Rottay / modernShared route metadata for the active runtime, kept inline so the shell reads like a thin header band.
Flow diagram showing weighted relationships between nodes
Ordered transitions or stage weights where movement matters more than isolated points.
How to read this pageUse the sidebar showroom controls to change engine and tenant, then judge whether the chart still reads clearly without extra editorial staging around it.
TierChartA specialized visualization pattern.
FamilyFlowStart with step continuity.
Best forexplaining stagesCompare against basic charts.
Live preview
Validate the chart in the active showroom runtime
Sidebar engine and tenant drive this
Flow
This preview should stand on the chart itself: legibility, token use, spacing, and interaction rhythm all need to hold without extra local storytelling chrome.
Loading chart preview...The interactive chart canvas mounts client-side so the docs page stays stable while the preview runtime boots.
ImportPublished package entrypoint, ready to copy.
tsx
1 line
Consumption
Runtime-aware snippet
ImportTSX
Quick copy
import { SankeyChart } from '@rottay/design-system';
UsagePaste-ready example that shows the base contract first.
tsx
13 lines
Consumption
Runtime-aware snippet
UsageTSX
Quick copy
API surface
Props
6 rows
SankeyChart propsProp contracts stay readable across dark-first and light-first tenants.
6 props
3 required
3 optional
Fast readStart with required props, then scan defaults before dropping to per-row details.
Contract postureThis reference stays intentionally concise so the primitive contract remains scannable.