Phase 9d · Tier B

RN-universal Chart pilot

Scaffolded

Three lightweight chart primitives — bar, line, area. Cut to the most-needed types per the 9a inventory. Pure RN — no SVG, no Skia. ~470 LOC of View + absolute positioning.

Bar chart — side-by-side

Two series rendered as paired bars per category.

Bar chart — stacked

Same data, stacked so each bar shows the total height.

Line chart

Connect-the-dots line chart. Two series.

Area chart

Same data set rendered as an area chart with translucent fill.

Library decision

Per Phase 9 Q2, every Tier B primitive must record its library choice. RnChart ships with no new runtime dependency.

  • recharts (~7 M/wk, MIT) — shadcn's choice; web-only (DOM SVG + DOM event handlers).
  • victory-native@41.20.2 (~355 k/wk, MIT) — 9a inventory's recommendation. Pulls react-native-skia peer dep (~3 MB unpacked). Same blocker as react-native-reanimated (rejected for RnSlider) and expo-document-picker (rejected for RnFileUpload).
  • react-native-svg (~3 M/wk, MIT) — peer dep for any real charting. Same blocker.
  • react-native-chart-kit (~120 k/wk, MIT) — wraps react-native-svg. Same blocker.
  • This implementation — pure RN core. View + absolute positioning + percentage heights/widths. Line segments via thin Views rotated to angles. No SVG, no Skia.

Semantics

Aspectshadcn (recharts)RNNotes
Bar (side-by-side)BarChart + BarRnBarChart yKeys=[a,b]Same default
Bar (stacked)Bar stackIdRnBarChart stackedBoolean prop
LineLineChart + LineRnLineChart yKeys=[a,b]Straight segments only
AreaAreaChart + AreaRnAreaChartPer-segment rectangular fill (approximation)
Pie / donutPieChart— (deferred)0.3.x candidate
TooltipChartTooltip / Recharts.Tooltip— (deferred)0.3.x candidate
Legendauto from configauto from configSame
Y-axis ticksYAxis component— (deferred)X-axis labels only in v1