Which programming languages are supported?

It supports a wide array of languages including TypeScript, JavaScript, Python, Go, Rust, Java, SQL, and frontend formats like Svelte, Vue, and Astro.

How does incremental re-indexing work?

The skill compares the modification timestamps (mtime) of your files against the last indexed run, ensuring only new or changed files are scanned to save time.

Can I use the output with other tools?

Yes, the skill produces a standard FlowSpec JSON (v1.2.0) which can be imported into design tools, documentation generators, or other MCP-compatible plugins.

Does this skill index sensitive information?

No. The annotator is pre-configured to exclude .env files, secrets, and git-ignored paths, focusing only on structural logic and variable names rather than values.

What is a FlowSpec index?

A FlowSpec index is a structured JSON file that maps your code's data points, UI components, and logic into a standardized format for architectural analysis and AI consumption.

FlowSpec Codebase Annotator

Name: FlowSpec Codebase Annotator
Author: Jktfe

byJktfe

•

Learning & Documentation

Extracts and indexes FlowSpec-compatible architectural elements from source code to enable spec-driven development and automated documentation.

The Annotate skill transforms your repository into a structured architectural map by identifying DataPoints, UI components, and data transforms directly from your source files. It uses advanced extraction logic to infer data constraints from TypeScript types, Zod schemas, and HTML5 attributes while mapping complex UI hierarchies and layouts across frameworks like React, Svelte, and Vue. By maintaining a persistent, incremental index that only re-processes modified files, it provides a high-performance bridge between your actual implementation and formal FlowSpec documentation, ensuring your project specifications never drift from the code.

Key Features

01Incremental re-indexing using filesystem timestamps for optimal performance

021 GitHub stars

03Automated DataPoint extraction with constraint detection from Zod and TypeScript

04Standardized FlowSpec v1.2.0 JSON output for easy tool integration

05Multi-framework support including React, Svelte, Vue, and backend languages

06UI hierarchy and layout analysis for components and screens

Use Cases

01Generating architectural specifications for legacy codebases

02Preparing codebase metadata for AI-assisted development and MCP tools

03Synchronizing design-system documentation with actual component implementations

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add jktfe/flowspec-claude-code-plugin annotate

For use in Claude.ai and ChatGPT

Download Skill