claude-code-source-recovery

What this skill does

# Claude Code 2.1.88 Source Recovery

> Skill by [ara.so](https://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:

```bash
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:

```typescript
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

```typescript
// 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:

```typescript
// 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

```typescript
// 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

```typescript
// 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

```typescript
// 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_DI