Data Dashboard Builder
Builds a local, data-backed dashboard with charts, tables and a sources panel.
Install
npx skills add JimLiu/baoyu-design --skill claude-dashboard -g -a claude-code -y- Repository
- JimLiu/baoyu-design5.8k
- Category
- Data and ML
- Updated
- 3d ago
- License
- See repository
- Context cost
- Mediumabout 3,000 tokens
- Runs scripts
- Yes, review before use
What it does
Use this for a local, data-backed dashboard, metrics page, KPI tracker, scorecard, data visualization or recurring report that opens in the bundled live editor: a page or scroll story of charts, numbers and tables over datasets (a CSV/TSV/JSON file the user has, or data you gather and attach), with a Sources panel that shows where every number comes from. Read it when creating, filling, refreshing or revising one. You write the datasets, then the page as plain HTML, into the dashboard's own store with this skill's script. Not for a static HTML mockup or a picture of a dashboard: that is the baoyu-design skill.
Dashboard, the shared type
A dashboard is a page you write over datasets the type loads, attributes
and refreshes. Everything is a document in its own store, written with
write-db. SKILL.md, artifact-type/ and scripts/ are the type's own
files: leave them as they are.
What the person asks for is what you build; the defaults apply only to what
they left unsaid. Whatever the page's own code can draw or do is allowed: any
chart, control or interaction. A chart they named is the one you draw, by hand
where d3 has no helper; if you draw another, say which and why.
The calls
A dashboard is a folder, <root>: designs/<slug>/ in the current project
unless the person names another (<slug>: the title in lowercase words joined
by -; a title not in Latin letters, such as a Chinese one, takes a short
English rendering of it: x-account-analytics). The first write-db or
upload creates it. One script, Node 22 or later with nothing to install,
does every call; below, A is <this skill's folder>/scripts/artifact.mjs.
