live-spec

Keeping UI documentation in sync with code changes requires generating per-page live-spec.ts files that automatically update when pages change. This approach reads source files to infer structure, merges user intent with code, and mounts a floating widget for on-page viewing.

Automated page-level requirements generation works by reading source files to infer component structure and merging user intent with existing code. It writes a live-spec.ts file beside pages, exposing export and tag triggers to manage documentation during development.

The best way to version control page-level requirements is to maintain a live-spec.history.ts file. This enables tracking changes over time and provides export options triggered via specific slash commands to manage page specification versions.

Yes, you can aggregate all per-page requirements into a single PRD by generating a project-wide live-spec.all.ts file. This consolidates individual page specifications and export options, providing a comprehensive view of the entire project's interface documentation.

UI and specification documentation drifts during development because manually updating interface docs to match code changes is costly and error-prone. Without automated synchronization, per-page requirements quickly fall out of lockstep with the actual implementation.

You need a floating widget for viewing interface requirements during development when you want immediate, on-page access to current page specifications. This ensures the live-spec documentation remains visible and accessible without navigating away from the code.