From throughline
Authors, refreshes, or reconciles usage documentation for an existing design-system component. Drafts a canonical doc record, projects it to Figma, the doc card, and code, then resolves drift via reviewable per-item choices.
How this command is triggered — by the user, by Claude, or both
Slash command
/throughline:document-componentThe summary Claude sees in its command listing — used to decide when to auto-load this command
Document a single existing component end to end, using the settings already in
`design-system.json` (`project.uiFramework`, `figma.mechanism`, `sync.platforms`)
rather than re-asking configuration. Scale explanation to `user.codingLevel`.
Ask which component to document (e.g. "Button"), then:
1. **Author/refresh the record.** Run the doc-authoring pipeline from
the `component-builder` skill's *Author the documentation record* step —
ingest any existing docs first (brownfield), then infer → enrich (from
`${CLAUDE_PLUGIN_ROOT}/references/component-doc-archetypes.md`) → specialize →...Document a single existing component end to end, using the settings already in
design-system.json (project.uiFramework, figma.mechanism, sync.platforms)
rather than re-asking configuration. Scale explanation to user.codingLevel.
Ask which component to document (e.g. "Button"), then:
component-builder skill's Author the documentation record step —
ingest any existing docs first (brownfield), then infer → enrich (from
${CLAUDE_PLUGIN_ROOT}/references/component-doc-archetypes.md) → specialize →
interview. The user approves the drafted record; imported/user blocks are
never overwritten.design-system/docs/components/<Name>.doc.json, set the
Figma component description, enrich the doc card, and (if the repo/code side
exists) render MDX/JSDoc and run docs:digest per the
storybook-chromatic-builder render step.docs:check. For each drifted surface, offer a per-item
choice — re-render (canonical wins) or pull-back (fold the surface edit
into the record) — and land the result as a reviewable change. On a brownfield
component's first pass, adopt existing content (provenance: imported) rather
than overwriting it.${CLAUDE_PLUGIN_ROOT}/references/guide-voice.md: the outcome, what you set
aside and why, one recommended next step, and at most one light alternative.
Read existing state to name what is actually outstanding rather than guessing —
a component at status: "draft" with no code surface in meta[name].doc.surfaces
means the code side is deferred. Do not close with a grid of co-equal options.See ${CLAUDE_PLUGIN_ROOT}/references/component-doc-schema.md for the record schema,
fingerprint contract, and projection mapping. If a component was never built in
Figma, point the user at component-builder first.
npx claudepluginhub jrpease/throughline --plugin throughline/component-docsGenerates Storybook-style component documentation from Figma — props, variants, usage guidelines, spacing specs, and code snippets. Accepts Figma URL, component name, or 'all components'.
/describe-componentProduces a machine-readable component description with six sections (purpose, props, anti-patterns, composition, accessibility, examples) and JSON metadata for AI tooling.
/update-docsUpdates living documentation to keep design, implementation, and validation aligned. Invokes a doc-updater agent to produce structured, reviewable output with assumptions and risks.
/documentGenerates focused documentation for a specified target component, function, or feature. Supports inline/external/API/guide types and brief/detailed styles.
/update-app-designUpdates the application design document to reflect codebase changes, new features, and project evolution. Reads existing doc, detects changes, and interactively syncs.
/design-reviewReviews the current design_doc.json, validates structure, displays it in a readable format, and enables interactive edits to components, patterns, decisions, and story mappings.