Kuzenbo Charts Usage
Use this skill for external app code that consumes the stable public package @kuzenbo/charts@0.0.6 .
Runtime Setup
- Install required runtime set:
npm install @kuzenbo/charts @kuzenbo/core @kuzenbo/theme recharts
- Ensure theme stylesheet is loaded once:
import "@kuzenbo/theme/prebuilt/kuzenbo.css";
Chart Workflow
-
Choose the chart primitive from references/chart-exports.md .
-
Shape data as array records and define a typed series list with name , label , and color .
-
Add formatter functions (valueFormatter , axis formatters) early to avoid formatting drift.
-
Turn on only needed affordances (withLegend , withTooltip , axis toggles) to keep charts readable.
Guardrails
-
Stay on public exports only (@kuzenbo/charts/ui/* listed in references).
-
Keep @kuzenbo/core and @kuzenbo/theme present in runtime.
-
Use semantic chart color vars (var(--color-chart-1) etc.) instead of hardcoded palette literals when possible.
-
If a requested chart type is absent, choose the nearest exported primitive and state the tradeoff.
References
-
references/chart-exports.md
-
references/chart-starter-pattern.md