feat: JSON 转代码工具

- 左侧 JSON 输入，右侧实时生成 TypeScript / Go / Python 代码
- 递归类型推断、对象数组合并、缺失键标记可选
- 拖拽导入、粘贴弹窗、示例、复制、下载
- 深浅色主题切换，localStorage 持久化

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Author: wangruofeng

.github/workflows/deploy.yml

@@ -0,0 +1,40 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches: [main]
+  workflow_dispatch:
+
+# 部署 Pages 需要 pages:write 与 id-token:write（OIDC）
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# 避免并发部署相互覆盖
+concurrency:
+  group: pages
+  cancel-in-progress: false
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Pages
+        id: pages
+        uses: actions/configure-pages@v5
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: '.'   # 仓库根目录即站点根（index.html 在根）
+
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -0,0 +1,16 @@
+# 系统文件
+.DS_Store
+Thumbs.db
+
+# 编辑器
+.vscode/
+.idea/
+*.swp
+
+# 测试 / 工具临时产物
+.playwright-mcp/
+node_modules/
+*.log
+
+# 截图（如不想纳入版本）
+/*.png

CLAUDE.md

@@ -0,0 +1,38 @@
+
+# json-to-code — 项目约定（给 AI 协作时参考）
+
+纯前端、单文件的 JSON 转代码工具。面向人类的说明见 `README.md`；本文件记录**改代码时必须知道的红线与约定**。项目与同级目录 `../json-viewer`、`../xml-viewer` 保持同一套设计与代码风格。
+
+## 红线（不要破坏）
+
+- **单文件、零构建、零依赖**：全部 HTML / CSS / JS 都在 `index.html` 一个文件里。**禁止**引入打包器（Vite/Webpack 等）、框架（React/Vue 等）、npm 依赖或构建步骤。新增能力用原生 JS 实现。
+- **纯前端、无后端**：所有解析、类型推断与代码生成均在浏览器本地完成，不上传任何数据。
+- 主题用根元素 `html.dark` 类切换，配色全部走 `:root` / `html.dark` 里的 CSS 变量。新增颜色请复用已有变量，不要硬编码。`localStorage` key 固定为 `j2c-theme`。
+- `favicon.svg` 为独立文件，使用蓝紫渐变（`#2563eb` → `#7c3aed`）圆角方块 + 白色 `{}›` 标志。
+
+## 文件结构
+
+- `index.html` — 全部代码（结构 + 样式 + 脚本）。
+- `favicon.svg` — 站点图标。
+- `.github/workflows/deploy.yml` — GitHub Pages 部署：仓库根即站点根，push 到 `main` 自动部署。
+- `README.md` — 面向用户的功能说明与在线访问地址。
+- `CLAUDE.md` — 本文件，记录协作约定。
+
+## UI 约定
+
+- **按钮文案保持极简**：每个按钮都带 SVG 图标，图标已承担表意，文字尽量短（如「导入」「粘贴」「示例」「复制代码」「下载」）。
+- 工具栏按钮（导入 / 粘贴 / 示例 / 复制代码 / 下载）+ 语言分段控件（TypeScript / Go / Python）。
+- 页头右侧两个图标按钮：GitHub 源码链接（仓库 `https://github.com/wangruofeng/json-to-code`，新标签页打开）、深浅色主题切换。
+- 主体为左右分栏：左侧 JSON 输入，右侧生成代码（只读 `pre`）。
+- 统计区固定格式：`N 个类型 · M 行代码`。
+
+## 解析与生成约定
+
+- JSON 解析失败时，按 json-viewer 风格展示错误框，并定位到具体行列与字符偏移。
+- 类型推断：递归合并；数组元素取联合类型；对象数组合并为单一类型（键取并集，缺失键标记可选）；全整数样本映射为整数类型。
+- TypeScript 输出 `interface`，可选字段加 `?`，联合类型用 `\|`；Go 输出 `struct + json tag`，缺失键加 `omitempty`；Python 输出 `@dataclass`，字段转 `snake_case`，缺失键默认 `None`。
+- 代码着色仅分关键字 / 类型 / 标识符三色，必须使用 `createElement` 渲染，禁止 `innerHTML` 注入生成后的代码。
+
+## 在线地址
+
+已部署到 GitHub Pages：https://blog.wangruofeng007.com/json-to-code/

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 wangruofeng
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,56 @@
+
+# JSON 转代码工具
+
+一个纯前端的单文件 JSON 转代码工具，双击 `index.html` 即可使用，无需安装、无需后端、无任何外部依赖。
+
+## 功能特性
+
+- 📝 **JSON 输入**：支持左侧直接编辑、粘贴 JSON 文本、拖拽 `.json` 文件导入，或从工具栏「粘贴」弹窗输入。
+- 🔄 **一键切换目标语言**：TypeScript / Go / Python 分段控件实时切换。
+- 🧠 **智能类型推断**：
+  - 递归合并对象数组为单一类型；
+  - 键取并集，缺失键自动标记为可选；
+  - 混合数组生成联合类型（TypeScript `string | number`，Go/Python 兜底）。
+- 🏷️ **根类型命名**：可自定义根类型名称，非法字符自动清理为 PascalCase。
+- 📋 **复制 / 下载代码**：一键复制生成结果，或下载 `.ts` / `.go` / `.py` 文件。
+- 🎨 **深浅色主题切换**：跟随系统或手动切换，配置持久化到 `localStorage`。
+- 📊 **实时统计**：生成类型数与代码行数。
+
+## 类型映射表
+
+| JSON 值 | TypeScript | Go | Python |
+|---|---|---|---|
+| 字符串 | `string` | `string` | `str` |
+| 整数 | `number` | `int` | `int` |
+| 浮点数 | `number` | `float64` | `float` |
+| 布尔 | `boolean` | `bool` | `bool` |
+| `null` | `null` | `interface{}` | `None` / `Optional` |
+| 数组 | `T[]` | `[]T` | `list[T]` |
+| 对象 | `interface` | `struct` | `@dataclass` |
+| 混合数组 | `A \| B \| ...` | `interface{}` | `Any` |
+| 可选字段 | `field?: T` | `omitempty` | 默认值 `None` |
+
+## 使用方式
+
+直接用浏览器打开 `index.html` 即可：
+
+```bash
+open index.html        # macOS
+# 或拖入浏览器
+```
+
+点击「示例」可快速体验嵌套对象、数组合并、混合类型等效果。
+
+## 技术说明
+
+- 单一 HTML 文件 + 独立 `favicon.svg`，原生 HTML / CSS / JavaScript，零依赖、零构建步骤。
+- 所有解析与生成均在浏览器本地完成，不上传任何数据。
+- 代码着色使用 `createElement` 构建 DOM，避免 `innerHTML` 注入。
+
+## 在线访问
+
+已通过 GitHub Pages 部署，可直接访问：
+
+🔗 **https://blog.wangruofeng007.com/json-to-code/**
+
+源码仓库：https://github.com/wangruofeng/json-to-code