Document Dev Components
Why
The layer ships 11 dev components but only 5 were registered in the design site. The control-panel family (DevControls, DevControlSlider, DevControlColor, DevControlSelect, DevControlSection) and DevMetaPropsMachine had no documentation or demos, making it harder for developers to discover and use the full dev tooling when building component demos.
Objective
Register all missing dev components and create interactive demos for every dev component, so the design site fully documents its own tooling.
Scope
- New
dev-controlsregistry group for the 6 control-panel components - 6 new component entries in
component-registry.ts - 11 demo files in
_demos/(5 existing doc primitives + 6 new controls) - Both
devanddev-controlsgroups hidden from public components index
Key Changes
app/data/component-registry.ts— addeddev-controlsgroup + 6 entriesapp/pages/components/index.vue— filter excludesdev-controlsapp/pages/components/coverage.vue— filter excludesdev-controlsapp/pages/components/_demos/Dev*.vue— 11 new demo files
Outcome
All 11 dev components are documented with interactive demos at /components/dev/ and /components/dev-controls/. Developers writing new component demos can reference the tooling documentation.
Visual record
4 captures — heroes, page slices, and full-page renders. Click to view.




In the archive
Artifacts
- cycle-creation.md