Turn React/TS IntoAI-Ready ContextTurn React/TS Into AI-Ready Context
Generate AI-ready context bundles from your React/TypeScript codebase in seconds. Zero config, up to 70% token savings.
Fast • Deterministic • Zero Config • Open Source
Install the CLI
npm install -g logicstamp-contextBuilt by Developers, for Developers
LogicStamp is 100% open source and community-driven. Contribute code, report issues, suggest features, or just star the repo to show your support.
Stop Pasting Code.
Start Stamping Context.
One command. Instant AI-ready context bundles. Zero manual work.
The Manual Grind
30+ minutes of copying, pasting, and explaining your codebase
Result: 30+ minutes wasted copying files, searching for dependencies, and manually explaining your codebase. Incomplete context leads to confused AI responses. Pay for 3x more tokens than needed. Frustrated developer.
The LogicStamp Way
One command. 8-10 seconds usually for mid-sized projects. Optimized context every time.
Result: 30 minutes → 8-10 seconds (usually for mid-sized projects). One command ($ stamp context) generates optimized context.json files with complete dependency graphs. Up to 70% cost savings. AI has complete context of your entire codebase. Happy developer.
Why Developers Choose LogicStamp
Professional-grade tooling for modern development workflows
Up to 70% smaller context bundles
Strips out imports, boilerplate, and implementation details. Only contracts and type signatures.
Automatic dependency graphs
AI sees your entire codebase structure, imports, and component relationships instantly.
Always up-to-date
Run stamp context before each AI session. Fresh context in seconds, not stale READMEs.
CI/CD context drift detection
Track architectural changes with stamp context compare in your build pipeline.
LogicStamp is your codebase's stamp of approval. One command generates a verified, AI-optimized snapshot of your entire project structure—like an official document stamped and certified for AI consumption.
How it works
$ npm i -g logicstamp-context changed 1 package, and audited 3 packages in 1s found 0 vulnerabilities $ stamp context 🔍 Scanning /project/src... Found 24 files 🔨 Analyzing components... Analyzed 24 components 📊 Building dependency graph... 📋 Using profile: llm-chat (depth=1, header only, max 100 nodes) 📦 Generating context for 22 root components (depth=1)... 🔍 Validating generated context... ✅ Validation passed 📝 Writing context files for 5 folders... ✓ context.json (2 bundles) ✓ src/context.json (3 bundles) ✓ src/components/context.json (5 bundles) ✓ src/utils/context.json (2 bundles) ✓ app/context.json (3 bundles) 📝 Writing main context index... ✓ context_main.json (index of 5 folders) ✅ 6 context files written successfully 📊 Summary: Total components: 24 Root components: 22 Leaf components: 20 Bundles generated: 22 Total nodes in context: 25 Total edges: 3 Missing dependencies: 0 📏 Token Estimates (header mode): GPT-4o-mini: 14,484 | Full code: ~41,383 (~65% savings) Claude: 12,875 | Full code: ~36,785 (~65% savings) 📊 Mode Comparison: none: ~8,691 tokens header: ~14,484 tokens full: ~41,383 tokens ⏱ Completed in 3225ms▋
Works with your favorite tools
Seamlessly integrate with your existing development workflow and boost productivity
Supported Frameworks
AI-ready context generation for modern frontend frameworks and TypeScript codebases.
TypeScript-first by design
LogicStamp Context currently analyzes .ts and .tsx files only. JavaScript .js and .jsx files are not analyzed yet, so components written in JS won't appear in context bundles.
React
Analyze React components with hooks, props, and JSX structure
- Props signature extraction
- Hook dependency analysis
- Component structure contracts
Next.js
Full support for Next.js with App Router and Server Components
- App Router context bundles
- Server/Client component detection
- Route dependency graphs
TypeScript
Deep TypeScript analysis for types, interfaces, and generics
- Type signature extraction
- Interface documentation
- Generic parameter tracking
MCPFeatured
Model Context Protocol integration for AI assistants
- Context bundle access
- Real-time codebase queries
- AI assistant integration
Vue
Vue 3 support with Composition API and SFC analysis
- SFC structure analysis
- Composition API tracking
- Template dependencies
Upcoming Enhancements
New features planned for the LogicStamp CLI
- MCP (Model Context Protocol) integration
- Contract verification upgrades (advanced rules + deeper validation)
- Enhanced contract management (grouped bundles, project-level insights)
- Additional UI framework support for styles (ShadCN/UI, Radix UI, Styled Components, Emotion, Chakra UI, Ant Design, etc.)
Development Tools
Works with your existing development tools and CI/CD pipelines
FAQs
Quick answers to common questions
LogicStamp Context scans your React/TypeScript codebase and generates structured context bundles optimized for AI consumption. It analyzes component structure, extracts logic signatures (props, state, events), builds dependency graphs, and packages everything into machine-readable JSON with built-in token optimization. No configuration needed—just run `stamp context` and get instant AI-ready context bundles.
Pasting raw code wastes tokens on boilerplate, imports, and redundant formatting. LogicStamp Context extracts only what AI needs—component contracts, dependency relationships, and logic signatures—saving up to 65% tokens compared to full source code. Plus, it provides structured context that AI can actually parse and understand, not just raw text.
Yes! LogicStamp Context is completely free and open-source. Install it globally with npm i -g logicstamp-context and use it without limits. The CLI is production-ready and includes context generation, drift detection, validation, and token optimization. Upcoming enhancements include advanced contract verification and enhanced contract management features.
Currently supports React and TypeScript projects (including Next.js). Coming soon: Vue 3, MCP integration, and other modern frameworks. Works with any React/TypeScript codebase regardless of styling solution (Tailwind, styled-components, CSS modules, etc.).
Install globally with `npm i -g logicstamp-context`, navigate to your project directory, and run `stamp context`. The CLI generates multiple `context.json` files (one per folder) plus a `context_main.json` index with AI-ready bundles. Share these files with Claude, ChatGPT, or any AI assistant for instant codebase understanding. Use `stamp context validate` to verify the output.
LogicStamp Context offers three modes: `none` (contracts only, up to 80% savings), `header` (recommended, up to 65% savings with JSDoc headers), and `full` (complete source). The header mode includes just enough context for AI to understand component logic without wasting tokens on implementation details. Use `--compare-modes` to see exact savings for your codebase. Token estimation: LogicStamp Context includes @dqbd/tiktoken (GPT-4) and @anthropic-ai/tokenizer (Claude) as optional dependencies. npm will automatically attempt to install them when you install logicstamp-context. If installation succeeds, you get model-accurate token counts. If installation fails or is skipped (normal for optional dependencies), the tool gracefully falls back to character-based estimation. Manual installation is optional—only needed if you need accurate token counts AND automatic installation failed: npm install @dqbd/tiktoken @anthropic-ai/tokenizer
LogicStamp Context generates per-root bundles (one bundle per page/feature component) rather than individual files per component. Each bundle contains the root component plus its complete dependency graph—all related components together. This design matches how developers work: when you need help with a specific page or feature, share that bundle and the AI has complete context in one self-contained unit.
The `stamp context style` command generates context bundles with visual and layout metadata included. It extracts style information from your components including Tailwind CSS classes, SCSS/CSS modules, inline styles, styled-components/Emotion, framer-motion animations, and Material UI components. This enables AI assistants to understand visual design, suggest visually consistent components, analyze layout patterns, track color palettes, and identify animations. Use it when you need AI to understand the visual aspects of your UI, not just the logic. Note: Style metadata adds more tokens (~58-65% of raw source vs ~30% for header mode), so use `--compare-modes` to see the exact cost impact for your codebase.
Watch mode is currently under evaluation. The context and compare workflow may work better with MCP (Model Context Protocol) integration without watch mode, as MCP provides more efficient and controlled context updates. We're exploring whether watch mode adds value or if the MCP-based approach offers a superior developer experience.
Need more detailed information?
Explore the LogicStamp docs for setup guides, profiles, token savings examples, CI workflows, and advanced configuration of stamp context.
Ready to supercharge your AI workflow?
Generate AI-ready context from your codebase in seconds. Fast, deterministic, zero-config.
"Stop pasting code. Start sharing structured context bundles that AI actually understands. LogicStamp Context transforms your codebase into machine-readable documentation with built-in token optimization."— LogicStamp Team