MCPInstall

claude-code-source-recovery

Skill for exploring and understanding the recovered Claude Code 2.1.88 TypeScript source code, including its CLI architecture, command system, MCP integration, and Ink/React terminal UI components.

Installs
694
Last 24h
—
Trending rank
—
Security
Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/reason-machines/trending-skills --skill claude-code-source-recovery
  1. 01

    Install

    Run the command in your project. The CLI asks which agents to install for.

  2. 02

    Describe the task

    Ask your agent for something this skill covers. It loads claude-code-source-recovery automatically when relevant.

  3. 03

    Review the result

    The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Claude Code 2.1.88 Source Recovery

Skill by ara.so — Daily 2026 Skills collection.

What This Project Is

This repository contains the recovered TypeScript source code of @anthropic-ai/claude-code version 2.1.88. On 2026-03-31, Anthropic accidentally published a cli.js.map (57MB) source map to npm that contained the full sourcesContent of the bundled CLI. After extraction and reconstruction, the result is ~700,000 lines of TypeScript source code organized into a readable directory structure.

The project is useful for:

  • Studying production CLI architecture patterns (Ink/React in terminal)
  • Understanding how MCP (Model Context Protocol) is implemented in a real CLI
  • Learning how Claude Code manages sessions, commands, authentication, and tool execution

Repository Structure

src/
├── entrypoints/        # CLI bootstrap and initialization
├── commands/           # Command definitions (login, mcp, review, tasks, etc.)
├── components/         # Ink/React terminal UI components
├── services/           # Core business logic (sync, remote capabilities, policies)
├── hooks/              # Terminal state management hooks
├── utils/              # Auth, file ops, process management helpers
└── ink/                # Custom terminal rendering infrastructure

Installing the Original 2.1.88 Package (Tencent Mirror Cache)

The official npm version was pulled. Use the Tencent mirror cache while available:

npm install -g https://mirrors.cloud.tencent.com/npm/@anthropic-ai/claude-code/-/claude-code-2.1.88.tgz

Extracting Source from the Source Map

If you have the original cli.js.map, you can recover sources programmatically:

import fs from "fs";
import path from "path";
import zlib from "zlib";

interface SourceMap {
  version: number;
  sources: string[];
  sourcesContent: (string | null)[];
  mappings: string;
}

async function extractSourceMap(mapPath: string, outDir: string) {
  const raw = fs.readFileSync(mapPath, "utf-8");
  const sourceMap: SourceMap = JSON.parse(raw);

  for (let i = 0; i < sourceMap.sources.length; i++) {
    const sourcePath = sourceMap.sources[i];
    const content = sourceMap.sourcesContent[i];

    if (!content) continue;

    // Normalize path: strip webpack/bundle prefixes
    const normalized = sourcePath
      .replace(/^webpack:\/\/\//, "")
      .replace(/^\.\//, "");

    const outPath = path.join(outDir, normalized);
    fs.mkdirSync(path.dirname(outPath), { recursive: true });
    fs.writeFileSync(outPath, content, "utf-8");
  }

  console.log(`Extracted ${sourceMap.sources.length} source files to ${outDir}`);
}

extractSourceMap("cli.js.map", "./recovered-src");

Key Architectural Patterns

1. CLI Entrypoint Bootstrap

// src/entrypoints/cli.ts (representative pattern)
import { render } from "ink";
import React from "react";
import { App } from "../components/App";
import { parseArgs } from "../utils/args";

async function main() {
  const args = parseArgs(process.argv.slice(2));

  if (args.command) {
    // Dispatch to named command handler
    const handler = await loadCommand(args.command);
    await handler.run(args);
  } else {
    // Default: launch interactive REPL via Ink
    render(React.createElement(App, { initialArgs: args }));
  }
}

main().catch((err) => {
  console.error(err);
  process.exit(1);
});

2. Command Loading System

Commands support built-in, dynamic skills, plugins, and MCP sources:

// src/commands/loader.ts (representative pattern)
type CommandSource = "builtin" | "skill" | "plugin" | "mcp";

interface Command {
  name: string;
  source: CommandSource;
  description: string;
  run(args: ParsedArgs): Promise<void>;
}

async function loadCommand(name: string): Promise<Command> {
  // 1. Check built-in commands first
  const builtin = builtinCommands.get(name);
  if (builtin) return builtin;

  // 2. Check MCP-registered commands
  const mcpCmd = await mcpRegistry.resolve(name);
  if (mcpCmd) return mcpCmd;

  // 3. Dynamic skill loading
  const skill = await loadSkillCommand(name);
  if (skill) return skill;

  throw new Error(`Unknown command: ${name}`);
}

3. Ink/React Terminal UI Component Pattern

// src/components/ChatView.tsx (representative pattern)
import React, { useState, useEffect } from "react";
import { Box, Text, useInput } from "ink";
import { useConversation } from "../hooks/useConversation";

interface ChatViewProps {
  sessionId: string;
}

export function ChatView({ sessionId }: ChatViewProps) {
  const { messages, sendMessage, isStreaming } = useConversation(sessionId);
  const [input, setInput] = useState("");

  useInput((char, key) => {
    if (key.return) {
      sendMessage(input);
      setInput("");
    } else if (key.backspace) {
      setInput((prev) => prev.slice(0, -1));
    } else {
      setInput((prev) => prev + char);
    }
  });

  return (
    <Box flexDirection="column" height="100%">
      <Box flexDirection="column" flexGrow={1} overflowY="hidden">
        {messages.map((msg, i) => (
          <Box key={i} marginBottom={1}>
            <Text color={msg.role === "assistant" ? "cyan" : "white"}>
              {msg.role === "assistant" ? "Claude: " : "You: "}
            </Text>
            <Text>{msg.content}</Text>
          </Box>
        ))}
        {isStreaming && <Text color="gray">▋</Text>}
      </Box>
      <Box borderStyle="single" paddingX={1}>
        <Text>{">"} </Text>
        <Text>{input}</Text>
      </Box>
    </Box>
  );
}

4. MCP (Model Context Protocol) Integration

// src/services/mcpClient.ts (representative pattern)
import { McpClient, Transport } from "@anthropic-ai/mcp";

interface McpServerConfig {
  name: string;
  command: string;
  args: string[];
  env?: Record<string, string>;
}

class McpRegistry {
  private clients = new Map<string, McpClient>();

  async connect(config: McpServerConfig): Promise<void> {
    const transport = new StdioTransport({
      command: config.command,
      args: config.args,
      env: { ...process.env, ...config.env },
    });

    const client = new McpClient({ name: "claude-code", version: "2.1.88" });
    await client.connect(transport);

    // Discover tools exposed by this MCP server
    const { tools } = await client.listTools();
    for (const tool of tools) {
      this.registerTool(config.name, tool);
    }

    this.clients.set(config.name, client);
  }

  async callTool(serverName: string, toolName: string, args: unknown) {
    const client = this.clients.get(serverName);
    if (!client) throw new Error(`MCP server not connected: ${serverName}`);
    return client.callTool({ name: toolName, arguments: args as Record<string, unknown> });
  }

  async resolve(commandName: string): Promise<Command | null> {
    // Map MCP tool names to CLI commands
    for (const [server, tools] of this.toolRegistry) {
      const tool = tools.find((t) => t.name === commandName);
      if (tool) {
        return {
          name: commandName,
          source: "mcp",
          description: tool.description ?? "",
          run: async (args) => {
            const result = await this.callTool(server, commandName, args);
            console.log(result.content);
          },
        };
      }
    }
    return null;
  }

  private toolRegistry = new Map<string, Array<{ name: string; description?: string }>>();

  private registerTool(server: string, tool: { name: string; description?: string }) {
    const existing = this.toolRegistry.get(server) ?? [];
    this.toolRegistry.set(server, [...existing, tool]);
  }
}

export const mcpRegistry = new McpRegistry();

5. Authentication Utilities

// src/utils/auth.ts (representative pattern)
import fs from "fs";
import path from "path";
import os from "os";

const CONFIG_DIR = path.join(os.homedir(), ".claude");
const CREDENTIALS_FILE = path.join(CONFIG_DIR, "credentials.json");

interface Credentials {
  apiKey?: string;
  sessionToken?: string;
  expiresAt?: string;
}

export function loadCredentials(): Credentials {
  if (!fs.existsSync(CREDENTIALS_FILE)) return {};
  return JSON.parse(fs.readFileSync(CREDENTIALS_FILE, "utf-8"));
}

export function saveCredentials(creds: Credentials): void {
  fs.mkdirSync(CONFIG_DIR, { recursive: true });
  fs.writeFileSync(CREDENTIALS_FILE, JSON.stringify(creds, null, 2), {
    mode: 0o600, // owner read/write only
  });
}

export function getApiKey(): string {
  // Priority: env var > credentials file
  if (process.env.ANTHROPIC_API_KEY) {
    return process.env.ANTHROPIC_API_KEY;
  }
  const creds = loadCredentials();
  if (creds.apiKey) return creds.apiKey;
  throw new Error("No API key found. Run `claude login` or set ANTHROPIC_API_KEY.");
}

6. Feature Flags Pattern

// src/utils/featureFlags.ts (representative pattern)
// Feature flags are resolved at build time via bun:bundle macros
// and at runtime via environment variables

type FeatureFlag =
  | "ENABLE_MCP_STREAMING"
  | "ENABLE_TASKS_COMMAND"
  | "ENABLE_REVIEW_COMMAND"
  | "ENABLE_REMOTE_CAPABILITIES";

const RUNTIME_FLAGS: Record<FeatureFlag, boolean> = {
  ENABLE_MCP_STREAMING: process.env.CLAUDE_FF_MCP_STREAMING === "1",
  ENABLE_TASKS_COMMAND: process.env.CLAUDE_FF_TASKS === "1",
  ENABLE_REVIEW_COMMAND: process.env.CLAUDE_FF_REVIEW === "1",
  ENABLE_REMOTE_CAPABILITIES: process.env.CLAUDE_FF_REMOTE === "1",
};

export function isEnabled(flag: FeatureFlag): boolean {
  return RUNTIME_FLAGS[flag] ?? false;
}

// Usage in command loader:
// if (isEnabled("ENABLE_TASKS_COMMAND")) {
//   registerCommand(tasksCommand);
// }

Commands Documented in Source

CommandDescription
claude loginOAuth/API key authentication flow
claude mcpManage MCP server connections
claude reviewCode review workflow
claude tasksTask/todo management
claude configView and edit configuration

Hooks: Terminal State Management

// src/hooks/useConversation.ts (representative pattern)
import { useState, useCallback, useRef } from "react";
import Anthropic from "@anthropic-ai/sdk";

export function useConversation(sessionId: string) {
  const [messages, setMessages] = useState<Message[]>([]);
  const [isStreaming, setIsStreaming] = useState(false);
  const clientRef = useRef(new Anthropic({ apiKey: process.env.ANTHROPIC_API_KEY }));

  const sendMessage = useCallback(async (content: string) => {
    const userMessage: Message = { role: "user", content };
    setMessages((prev) => [...prev, userMessage]);
    setIsStreaming(true);

    let assistantContent = "";

    try {
      const stream = await clientRef.current.messages.stream({
        model: "claude-opus-4-5",
        max_tokens: 8096,
        messages: [...messages, userMessage].map((m) => ({
          role: m.role,
          content: m.content,
        })),
      });

      for await (const chunk of stream) {
        if (
          chunk.type === "content_block_delta" &&
          chunk.delta.type === "text_delta"
        ) {
          assistantContent += chunk.delta.text;
          setMessages((prev) => {
            const next = [...prev];
            const last = next[next.length - 1];
            if (last?.role === "assistant") {
              next[next.length - 1] = { ...last, content: assistantContent };
            } else {
              next.push({ role: "assistant", content: assistantContent });
            }
            return next;
          });
        }
      }
    } finally {
      setIsStreaming(false);
    }
  }, [messages]);

  return { messages, sendMessage, isStreaming };
}

Environment Variables

VariablePurpose
ANTHROPIC_API_KEYPrimary API key for Claude API calls
CLAUDE_FF_MCP_STREAMINGEnable MCP streaming feature flag (1/0)
CLAUDE_FF_TASKSEnable tasks command feature flag
CLAUDE_FF_REVIEWEnable review command feature flag
CLAUDE_FF_REMOTEEnable remote capabilities feature flag
CLAUDE_CONFIG_DIROverride default ~/.claude config directory

Attempting to Run the Recovered Source

# 1. Clone the repo
git clone https://github.com/ponponon/claude_code_src
cd claude_code_src

# 2. Add a package.json (not included — must be reconstructed)
cat > package.json << 'EOF'
{
  "name": "claude-code-recovered",
  "version": "2.1.88",
  "type": "module",
  "dependencies": {
    "@anthropic-ai/sdk": "^0.51.0",
    "ink": "^5.0.0",
    "react": "^18.0.0",
    "commander": "^12.0.0"
  },
  "devDependencies": {
    "typescript": "^5.0.0",
    "@types/react": "^18.0.0",
    "@types/node": "^22.0.0"
  }
}
EOF

# 3. Install deps
npm install

# 4. Set your API key
export ANTHROPIC_API_KEY=your_key_here

# 5. Compile (bun:bundle macros will need stubs)
npx tsc --noEmit  # type-check only

Note: The source uses bun:bundle macros for feature flag tree-shaking. You'll need to stub these or use Bun to build.


Troubleshooting

ProblemSolution
bun:bundle import errorsReplace with runtime flag checks or use Bun as the build tool
Missing package.jsonReconstruct from node_modules references in source imports
cli.js.map too large to parse in-memoryStream-parse with stream-json npm package
Tencent mirror link brokenCheck archive.org or other npm mirror caches
TypeScript path aliases unresolvedAdd paths to tsconfig.json matching the original bundle's alias structure

Legal Notes

  • This repository is not affiliated with Anthropic.
  • Original code copyright belongs to Anthropic.
  • This project is for archival and research purposes only.
  • Do not use recovered code in production or commercial products without proper licensing.

FAQ

What does the claude-code-source-recovery skill do?

Skill for exploring and understanding the recovered Claude Code 2.1.88 TypeScript source code, including its CLI architecture, command system, MCP integration, and Ink/React terminal UI components.

How do I install claude-code-source-recovery?

Run npx skills add https://github.com/reason-machines/trending-skills --skill claude-code-source-recovery in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/claude-code-source-recovery/ (personal) or .claude/skills/claude-code-source-recovery/ (project).

Which AI agents can use claude-code-source-recovery?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is claude-code-source-recovery safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains claude-code-source-recovery?

It is published by reason-machines in reason-machines/trending-skills. It has 694 recorded installs.

More from reason-machines/trending-skills

View all →

openclaw-control-center

reason-machines/trending-skills

Local-first, security-first control center for OpenClaw agents — visibility dashboard with readonly defaults, token attribution, collaboration tracing, and safe write operations.

Data & Databases4.4K installs

inkos-multi-agent-novel-writing

reason-machines/trending-skills

Multi-agent CLI system for autonomous novel writing, auditing, and revision with human review gates

Docs & Writing2.8K installs

claude-hud-statusline

reason-machines/trending-skills

A Claude Code plugin that displays a real-time HUD showing context usage, active tools, running agents, and todo progress in your terminal statusline.

understand-anything-knowledge-graph

reason-machines/trending-skills

Turn any codebase into an interactive knowledge graph using Claude Code skills — explore, search, and ask questions about any project visually.

agency-agents-ai-specialists

reason-machines/trending-skills

A collection of specialized AI agent personalities for Claude Code, Cursor, Aider, Windsurf, and other AI coding tools — covering engineering, design, marketing, sales, and more.

AI & Agents2.1K installs

agent-browser-automation

reason-machines/trending-skills

Headless browser automation CLI for AI agents using native Rust binary with Chrome DevTools Protocol

Popular frontend & design skills

View category →

setup-matt-pocock-skills

mattpocock/skills

Configure this repo for the engineering skills: set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.

Frontend & Design1.1M installs

frontend-design

anthropics/skills

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.

OfficialFrontend & Design1M installs

hyperframes-animation

heygen-com/hyperframes

All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.

prototype

mattpocock/skills

Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.

Frontend & Design999.2K installs

hyperframes-core

heygen-com/hyperframes

The HyperFrames composition contract — build one renderable project. Use for composition structure, the data- timing attributes, class="clip", tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.

Frontend & Design930.5K installs

vercel-react-best-practices

vercel-labs/agent-skills

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

OfficialFrontend & Design843.1K installs