github-mobile-reader 0.1.3 → 0.1.4

package/README.ko.md

@@ -44,7 +44,7 @@ data
 - **GitHub Action** — 레포에 YAML 파일 하나만 추가하면 PR마다 Reader 문서가 자동 생성됩니다
 - **파일별 분리 출력** — 변경된 JS/TS 파일마다 독립적인 섹션으로 출력
 - **JSX/Tailwind 인식** — `.jsx`/`.tsx` 파일은 컴포넌트 트리(`🎨 JSX Structure`)와 Tailwind 클래스 diff(`💅 Style Changes`)를 별도 섹션으로 분리 출력
-- **양방향 diff 추적** — 추가된 코드와 삭제된 코드를 각각 별도 섹션으로 표시
+- **심볼 단위 요약** — 전체 코드 블록을 덤프하는 대신, 어떤 함수/컴포넌트가 추가·삭제·수정됐는지 목록으로 표시
 - **보수적 설계** — 패턴이 애매할 때는 잘못된 정보를 보여주는 대신 덜 보여줍니다
 - **보안 기본값** — 토큰은 `$GITHUB_TOKEN` 환경변수로만 읽음 — 셸 히스토리나 `ps` 목록에 노출되는 `--token` 플래그 없음
 
@@ -108,18 +108,20 @@ npx github-mobile-reader --repo owner/repo --all
 
 PR마다 `reader-output/pr-<번호>.md` 파일 하나가 생성됩니다.
 
-JSX/TSX 파일은 추가 섹션이 생성됩니다:
+변경 요약이 없는 파일은 자동으로 생략됩니다. JSX/TSX 파일은 추가 섹션이 생성됩니다:
 
 ```
 # 📖 PR #42 — My Feature
 
 ## 📄 `src/App.tsx`
 
-### 🧠 Logical Flow   ← JS 로직 트리
+### 변경된 함수 / 컴포넌트
+- ✅ `parseArgs()` — added
+- ✏️ `processPR()` — modified
+- ❌ `oldHelper()` — removed
+
 ### 🎨 JSX Structure  ← 컴포넌트 계층 구조 (JSX/TSX 전용)
 ### 💅 Style Changes  ← 추가/제거된 Tailwind 클래스 (JSX/TSX 전용)
-### ✅ Added Code
-### ❌ Removed Code
 ```
 
 > **참고:** `reader-output/`는 기본적으로 `.gitignore`에 포함되어 있습니다 — 생성된 파일은 로컬에만 저장되며 레포지토리에 커밋되지 않습니다.
@@ -220,8 +222,9 @@ src/languages/
 이 라이브러리를 사용하는 가장 쉬운 방법입니다. 매 PR마다 자동으로:
 
 1. 변경된 `.js` / `.jsx` / `.ts` / `.tsx` / `.mjs` / `.cjs` 파일의 diff를 파싱
-2. `docs/reader/pr-<번호>.md` 파일을 레포에 저장
-3. PR에 요약 코멘트를 자동으로 달아줍니다
+2. Reader Markdown 요약을 **PR 코멘트**로 게시 (파일 커밋 불필요)
+
+> **브랜치 보호 규칙과 호환** — 워크플로우는 `pull-requests: write` 권한만 필요합니다. 커밋을 push하지 않으므로 엄격한 브랜치 보호 규칙이 설정된 레포에서도 동작합니다.
 
 ### Step 1 — 워크플로우 파일 추가
 
@@ -235,7 +238,6 @@ on:
     types: [opened, synchronize, reopened]
 
 permissions:
-  contents: write # .md 파일 커밋
   pull-requests: write # PR 코멘트 작성
 
 jobs:
@@ -247,44 +249,45 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v4
         with:
-          fetch-depth: 0 # git diff에 전체 히스토리 필요
+          fetch-depth: 0
 
-      - name: Generate Reader Markdown
-        uses: 3rdflr/github-mobile-reader@v1
+      - name: Setup Node
+        uses: actions/setup-node@v4
         with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-          base_branch: ${{ github.base_ref }}
-          output_dir: docs/reader
+          node-version: '20'
+
+      - name: Generate Reader Markdown
+        run: npx github-mobile-reader@latest --repo ${{ github.repository }} --pr ${{ github.event.pull_request.number }} --out ./reader-output
         env:
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-
-      - name: Commit Reader Markdown
-        run: |
-          git config user.name  "github-actions[bot]"
-          git config user.email "github-actions[bot]@users.noreply.github.com"
-          git add docs/reader/
-          if git diff --cached --quiet; then
-            echo "변경사항 없음"
-          else
-            git commit -m "docs(reader): PR #${{ github.event.pull_request.number }} 모바일 리더 업데이트 [skip ci]"
-            git push
-          fi
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Post PR Comment
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const fs = require('fs');
+            const path = './reader-output/pr-${{ github.event.pull_request.number }}.md';
+            if (!fs.existsSync(path)) { console.log('생성된 파일 없음.'); return; }
+            const body = fs.readFileSync(path, 'utf8');
+            const comments = await github.rest.issues.listComments({
+              owner: context.repo.owner, repo: context.repo.repo,
+              issue_number: ${{ github.event.pull_request.number }},
+            });
+            const prev = comments.data.find(c =>
+              c.user.login === 'github-actions[bot]' && c.body.startsWith('# 📖 PR #')
+            );
+            if (prev) await github.rest.issues.deleteComment({
+              owner: context.repo.owner, repo: context.repo.repo, comment_id: prev.id,
+            });
+            await github.rest.issues.createComment({
+              owner: context.repo.owner, repo: context.repo.repo,
+              issue_number: ${{ github.event.pull_request.number }}, body,
+            });
 ```
 
 ### Step 2 — PR 열기
 
-이게 전부입니다. 이후 모든 PR에 자동으로:
-
-- `docs/reader/pr-<번호>.md` 파일 생성
-- 생성된 파일 링크가 담긴 PR 코멘트 자동 게시
-
-### Action 입력값
-
-| 입력값         | 필수 | 기본값        | 설명                               |
-| -------------- | ---- | ------------- | ---------------------------------- |
-| `github_token` | ✅   | —             | `${{ secrets.GITHUB_TOKEN }}` 사용 |
-| `base_branch`  | ❌   | `main`        | PR이 머지되는 대상 브랜치          |
-| `output_dir`   | ❌   | `docs/reader` | 생성된 `.md` 파일 저장 경로        |
+이게 전부입니다. 이후 모든 PR에 `github-actions[bot]`이 Reader Markdown 코멘트를 자동으로 달아줍니다. 새 커밋을 push할 때마다 코멘트가 업데이트됩니다 (중복 게시 없음).
 
 ---
 
@@ -363,47 +366,53 @@ console.log(treeLines.join("\n"));
 
 ## 출력 형식
 
-생성된 Reader Markdown 문서는 네 개의 섹션으로 구성됩니다:
+생성된 Reader Markdown 코멘트는 다음 구조로 작성됩니다:
 
-````markdown
-# 📖 GitHub Reader View
+```markdown
+# 📖 PR #42 — My Feature
 
-> Generated by **github-mobile-reader**
 > Repository: my-org/my-repo
-> Pull Request: #42
 > Commit: `a1b2c3d`
-> File: `src/api/users.ts`
+> 변경된 JS/TS 파일: 2개
 
 ---
 
-## 🧠 Logical Flow
+## 📄 `src/api/users.ts`
 
-```
-getData()
- └─ filter(callback)
-     └─ map(item → value)
-         └─ reduce(callback)
-```
+### 변경된 함수 / 컴포넌트
 
-## ✅ Added Code
+- ✅ `getUser()` — added
+- ✏️ `updateUser()` — modified
+- ❌ `legacyFetch()` — removed
 
-```typescript
-const result = getData()
-  .filter((item) => item.active)
-  .map((item) => item.value)
-  .reduce((a, b) => a + b, 0);
-```
+---
+
+## 📄 `src/components/UserCard.tsx`
+
+### 변경된 함수 / 컴포넌트
 
-## ❌ Removed Code
+- ✏️ `UserCard()` — modified
 
-```typescript
-const result = getData().map((item) => item.value);
+### 🎨 JSX Structure
+
+```
+div
+  header
+  section
+    UserAvatar
+    UserName
 ```
 
+### 💅 Style Changes
+
+**div**
+  + dark:bg-gray-900  rounded-xl
+  - bg-white
+
 ---
 
-🛠 Auto-generated by github-mobile-reader. Do not edit manually.
-````
+🛠 Auto-generated by github-mobile-reader.
+```
 
 ---
 

package/README.md

@@ -42,7 +42,7 @@ data
 - **GitHub Action** — drop one YAML block into any repo and get auto-generated Reader docs on every PR
 - **File-by-file output** — each changed JS/TS file gets its own independent section in the output
 - **JSX/Tailwind aware** — `.jsx`/`.tsx` files get a component tree (`🎨 JSX Structure`) and a Tailwind class diff (`💅 Style Changes`) instead of one unreadable blob
-- **Tracks both sides of a diff** — shows added _and_ removed code in separate sections
+- **Symbol-level summary** — instead of dumping entire code blocks, the output lists which functions/components were added, removed, or modified
 - **Conservative by design** — when a pattern is ambiguous, the library shows less rather than showing something wrong
 - **Secure by default** — token is read from `$GITHUB_TOKEN` only; no flag that leaks to shell history or `ps`
 
@@ -177,18 +177,20 @@ Token: read from `$GITHUB_TOKEN` environment variable (60 req/hr unauthenticated
 
 Each PR produces one file: `reader-output/pr-<number>.md`.
 
-Inside that file, every changed JS/TS file gets its own section. JSX/TSX files get two extra sections:
+Inside that file, every changed JS/TS file gets its own section. Files with no detectable symbol changes are automatically skipped.
 
 ```
 # 📖 PR #42 — My Feature
 
 ## 📄 `src/App.tsx`
 
-### 🧠 Logical Flow   ← JS logic tree
+### 변경된 함수 / 컴포넌트
+- ✅ `parseArgs()` — added
+- ✏️ `processPR()` — modified
+- ❌ `oldHelper()` — removed
+
 ### 🎨 JSX Structure  ← component hierarchy (JSX/TSX only)
 ### 💅 Style Changes  ← added/removed Tailwind classes (JSX/TSX only)
-### ✅ Added Code
-### ❌ Removed Code
 ```
 
 > **Note:** `reader-output/` is gitignored by default — the generated files are local only and not committed to your repository.
@@ -218,8 +220,9 @@ console.log(markdown);
 The easiest way to use this library is as a GitHub Action. On every pull request it will:
 
 1. Parse the diff of all changed `.js` / `.jsx` / `.ts` / `.tsx` / `.mjs` / `.cjs` files
-2. Write a Reader Markdown file to `docs/reader/pr-<number>.md` inside your repo
-3. Post a summary comment directly on the PR
+2. Post a Reader Markdown summary as a **PR comment** (no file commits required)
+
+> **Branch protection compatible** — the workflow only needs `pull-requests: write` permission. It does not push any commits, so it works even with strict branch protection rules.
 
 ### Step 1 — Add the workflow file
 
@@ -233,8 +236,7 @@ on:
     types: [opened, synchronize, reopened]
 
 permissions:
-  contents: write # commit the generated .md file
-  pull-requests: write # post the PR comment
+  pull-requests: write # post PR comment
 
 jobs:
   generate-reader:
@@ -245,44 +247,45 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v4
         with:
-          fetch-depth: 0 # full history required for git diff
+          fetch-depth: 0
 
-      - name: Generate Reader Markdown
-        uses: 3rdflr/github-mobile-reader@v1
+      - name: Setup Node
+        uses: actions/setup-node@v4
         with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-          base_branch: ${{ github.base_ref }}
-          output_dir: docs/reader
+          node-version: '20'
+
+      - name: Generate Reader Markdown
+        run: npx github-mobile-reader@latest --repo ${{ github.repository }} --pr ${{ github.event.pull_request.number }} --out ./reader-output
         env:
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-
-      - name: Commit Reader Markdown
-        run: |
-          git config user.name  "github-actions[bot]"
-          git config user.email "github-actions[bot]@users.noreply.github.com"
-          git add docs/reader/
-          if git diff --cached --quiet; then
-            echo "No changes to commit"
-          else
-            git commit -m "docs(reader): update mobile reader for PR #${{ github.event.pull_request.number }} [skip ci]"
-            git push
-          fi
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Post PR Comment
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const fs = require('fs');
+            const path = './reader-output/pr-${{ github.event.pull_request.number }}.md';
+            if (!fs.existsSync(path)) { console.log('No reader file generated.'); return; }
+            const body = fs.readFileSync(path, 'utf8');
+            const comments = await github.rest.issues.listComments({
+              owner: context.repo.owner, repo: context.repo.repo,
+              issue_number: ${{ github.event.pull_request.number }},
+            });
+            const prev = comments.data.find(c =>
+              c.user.login === 'github-actions[bot]' && c.body.startsWith('# 📖 PR #')
+            );
+            if (prev) await github.rest.issues.deleteComment({
+              owner: context.repo.owner, repo: context.repo.repo, comment_id: prev.id,
+            });
+            await github.rest.issues.createComment({
+              owner: context.repo.owner, repo: context.repo.repo,
+              issue_number: ${{ github.event.pull_request.number }}, body,
+            });
 ```
 
 ### Step 2 — Open a PR
 
-That's it. Every subsequent PR will automatically get:
-
-- A Reader Markdown file at `docs/reader/pr-<number>.md`
-- A comment on the PR linking to the generated file
-
-### Action Inputs
-
-| Input          | Required | Default       | Description                         |
-| -------------- | -------- | ------------- | ----------------------------------- |
-| `github_token` | ✅       | —             | Use `${{ secrets.GITHUB_TOKEN }}`   |
-| `base_branch`  | ❌       | `main`        | The branch the PR is merging into   |
-| `output_dir`   | ❌       | `docs/reader` | Directory for generated `.md` files |
+That's it. Every subsequent PR will automatically get a Reader Markdown comment posted by `github-actions[bot]`. The comment is updated (not duplicated) on every new push.
 
 ---
 
@@ -361,49 +364,53 @@ console.log(treeLines.join("\n"));
 
 ## Output Format
 
-A generated Reader Markdown document has four sections:
+A generated Reader Markdown comment has the following structure:
 
 ```markdown
-# 📖 GitHub Reader View
+# 📖 PR #42 — My Feature
 
-> Generated by **github-mobile-reader**
 > Repository: my-org/my-repo
-> Pull Request: #42
 > Commit: `a1b2c3d`
-> File: `src/api/users.ts`
+> 변경된 JS/TS 파일: 2개
 
 ---
 
-## 🧠 Logical Flow
-```
+## 📄 `src/api/users.ts`
 
-getData()
-└─ filter(callback)
-└─ map(item → value)
-└─ reduce(callback)
+### 변경된 함수 / 컴포넌트
 
-````
+- ✅ `getUser()` — added
+- ✏️ `updateUser()` — modified
+- ❌ `legacyFetch()` — removed
 
-## ✅ Added Code
+---
 
-```typescript
-const result = getData()
-  .filter(item => item.active)
-  .map(item => item.value)
-  .reduce((a, b) => a + b, 0)
-````
+## 📄 `src/components/UserCard.tsx`
 
-## ❌ Removed Code
+### 변경된 함수 / 컴포넌트
 
-```typescript
-const result = getData().map((item) => item.value);
+- ✏️ `UserCard()` — modified
+
+### 🎨 JSX Structure
+
+```
+div
+  header
+  section
+    UserAvatar
+    UserName
 ```
 
----
+### 💅 Style Changes
 
-🛠 Auto-generated by github-mobile-reader. Do not edit manually.
+**div**
+  + dark:bg-gray-900  rounded-xl
+  - bg-white
 
-````
+---
+
+🛠 Auto-generated by github-mobile-reader.
+```
 
 ---
 

package/dist/action.js

@@ -32,7 +32,9 @@ function isJSXFile(filename) {
   return /\.(jsx|tsx)$/.test(filename);
 }
 function hasJSXContent(lines) {
-  return lines.some((l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l));
+  return lines.some(
+    (l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l)
+  );
 }
 function isClassNameOnlyLine(line) {
   return /^className=/.test(line.trim());
@@ -40,7 +42,9 @@ function isClassNameOnlyLine(line) {
 function extractClassName(line) {
   const staticMatch = line.match(/className="([^"]*)"/);
   if (staticMatch) return staticMatch[1];
-  const ternaryMatch = line.match(/className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/);
+  const ternaryMatch = line.match(
+    /className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/
+  );
   if (ternaryMatch) return `${ternaryMatch[1]} ${ternaryMatch[2]}`;
   const templateMatch = line.match(/className=\{`([^`]*)`\}/);
   if (templateMatch) {
@@ -62,14 +66,16 @@ function parseClassNameChanges(addedLines, removedLines) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).added.add(c));
   }
   for (const line of removedLines.filter((l) => /className=/.test(l))) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).removed.add(c));
   }
   const changes = [];
@@ -87,7 +93,8 @@ function renderStyleChanges(changes) {
   for (const change of changes) {
     lines.push(`**${change.component}**`);
     if (change.added.length > 0) lines.push(`  + ${change.added.join("  ")}`);
-    if (change.removed.length > 0) lines.push(`  - ${change.removed.join("  ")}`);
+    if (change.removed.length > 0)
+      lines.push(`  - ${change.removed.join("  ")}`);
   }
   return lines;
 }
@@ -156,8 +163,12 @@ function parseJSXToFlowTree(lines) {
 }
 function filterDiffLines(diffText) {
   const lines = diffText.split("\n");
-  const added = lines.filter((l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+").map((l) => l.substring(1));
-  const removed = lines.filter((l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-").map((l) => l.substring(1));
+  const added = lines.filter(
+    (l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+"
+  ).map((l) => l.substring(1));
+  const removed = lines.filter(
+    (l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-"
+  ).map((l) => l.substring(1));
   return { added, removed };
 }
 function getIndentDepth(line) {
@@ -166,14 +177,14 @@ function getIndentDepth(line) {
   return Math.floor(match[1].length / 2);
 }
 function extractChangedSymbols(addedLines, removedLines) {
-  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s*)?\(/;
+  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s+)?\(?|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*[a-z]\w+\s*[<(]/;
   const COMPONENT_RE = /^(?:export\s+)?(?:default\s+)?(?:function|const)\s+([A-Z][a-z][A-Za-z0-9]*)/;
   const extract = (lines) => {
     const names = /* @__PURE__ */ new Set();
     for (const line of lines) {
       const cm = line.match(COMPONENT_RE) || line.match(FUNC_RE);
       if (cm) {
-        const name = cm[1] || cm[2];
+        const name = cm[1] || cm[2] || cm[3];
         if (name) names.add(name);
       }
     }
@@ -185,7 +196,10 @@ function extractChangedSymbols(addedLines, removedLines) {
   const seen = /* @__PURE__ */ new Set();
   for (const name of addedNames) {
     seen.add(name);
-    results.push({ name, status: removedNames.has(name) ? "modified" : "added" });
+    results.push({
+      name,
+      status: removedNames.has(name) ? "modified" : "added"
+    });
   }
   for (const name of removedNames) {
     if (!seen.has(name)) {
@@ -246,7 +260,9 @@ function generateReaderMarkdown(diffText, meta = {}) {
     sections.push("");
   }
   sections.push("---");
-  sections.push("\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually.");
+  sections.push(
+    "\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually."
+  );
   return sections.join("\n");
 }
 

package/dist/cli.js

@@ -32,7 +32,9 @@ function isJSXFile(filename) {
   return /\.(jsx|tsx)$/.test(filename);
 }
 function hasJSXContent(lines) {
-  return lines.some((l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l));
+  return lines.some(
+    (l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l)
+  );
 }
 function isClassNameOnlyLine(line) {
   return /^className=/.test(line.trim());
@@ -40,7 +42,9 @@ function isClassNameOnlyLine(line) {
 function extractClassName(line) {
   const staticMatch = line.match(/className="([^"]*)"/);
   if (staticMatch) return staticMatch[1];
-  const ternaryMatch = line.match(/className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/);
+  const ternaryMatch = line.match(
+    /className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/
+  );
   if (ternaryMatch) return `${ternaryMatch[1]} ${ternaryMatch[2]}`;
   const templateMatch = line.match(/className=\{`([^`]*)`\}/);
   if (templateMatch) {
@@ -62,14 +66,16 @@ function parseClassNameChanges(addedLines, removedLines) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).added.add(c));
   }
   for (const line of removedLines.filter((l) => /className=/.test(l))) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).removed.add(c));
   }
   const changes = [];
@@ -87,7 +93,8 @@ function renderStyleChanges(changes) {
   for (const change of changes) {
     lines.push(`**${change.component}**`);
     if (change.added.length > 0) lines.push(`  + ${change.added.join("  ")}`);
-    if (change.removed.length > 0) lines.push(`  - ${change.removed.join("  ")}`);
+    if (change.removed.length > 0)
+      lines.push(`  - ${change.removed.join("  ")}`);
   }
   return lines;
 }
@@ -156,8 +163,12 @@ function parseJSXToFlowTree(lines) {
 }
 function filterDiffLines(diffText) {
   const lines = diffText.split("\n");
-  const added = lines.filter((l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+").map((l) => l.substring(1));
-  const removed = lines.filter((l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-").map((l) => l.substring(1));
+  const added = lines.filter(
+    (l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+"
+  ).map((l) => l.substring(1));
+  const removed = lines.filter(
+    (l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-"
+  ).map((l) => l.substring(1));
   return { added, removed };
 }
 function getIndentDepth(line) {
@@ -166,14 +177,14 @@ function getIndentDepth(line) {
   return Math.floor(match[1].length / 2);
 }
 function extractChangedSymbols(addedLines, removedLines) {
-  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s*)?\(/;
+  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s+)?\(?|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*[a-z]\w+\s*[<(]/;
   const COMPONENT_RE = /^(?:export\s+)?(?:default\s+)?(?:function|const)\s+([A-Z][a-z][A-Za-z0-9]*)/;
   const extract = (lines) => {
     const names = /* @__PURE__ */ new Set();
     for (const line of lines) {
       const cm = line.match(COMPONENT_RE) || line.match(FUNC_RE);
       if (cm) {
-        const name = cm[1] || cm[2];
+        const name = cm[1] || cm[2] || cm[3];
         if (name) names.add(name);
       }
     }
@@ -185,7 +196,10 @@ function extractChangedSymbols(addedLines, removedLines) {
   const seen = /* @__PURE__ */ new Set();
   for (const name of addedNames) {
     seen.add(name);
-    results.push({ name, status: removedNames.has(name) ? "modified" : "added" });
+    results.push({
+      name,
+      status: removedNames.has(name) ? "modified" : "added"
+    });
   }
   for (const name of removedNames) {
     if (!seen.has(name)) {
@@ -246,7 +260,9 @@ function generateReaderMarkdown(diffText, meta = {}) {
     sections.push("");
   }
   sections.push("---");
-  sections.push("\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually.");
+  sections.push(
+    "\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually."
+  );
   return sections.join("\n");
 }
 

package/dist/index.d.mts

@@ -14,7 +14,7 @@ declare enum Priority {
     OTHER = 5
 }
 interface FlowNode {
-    type: 'root' | 'chain' | 'condition' | 'loop' | 'function' | 'call';
+    type: "root" | "chain" | "condition" | "loop" | "function" | "call";
     name: string;
     children: FlowNode[];
     depth: number;
@@ -74,7 +74,7 @@ declare function parseDiffToLogicalFlow(diffText: string): ParseResult;
  */
 declare function extractChangedSymbols(addedLines: string[], removedLines: string[]): {
     name: string;
-    status: 'added' | 'removed' | 'modified';
+    status: "added" | "removed" | "modified";
 }[];
 /**
  * Render JSX tree as a single compact line: div > header > button(onClick)

package/dist/index.d.ts

@@ -14,7 +14,7 @@ declare enum Priority {
     OTHER = 5
 }
 interface FlowNode {
-    type: 'root' | 'chain' | 'condition' | 'loop' | 'function' | 'call';
+    type: "root" | "chain" | "condition" | "loop" | "function" | "call";
     name: string;
     children: FlowNode[];
     depth: number;
@@ -74,7 +74,7 @@ declare function parseDiffToLogicalFlow(diffText: string): ParseResult;
  */
 declare function extractChangedSymbols(addedLines: string[], removedLines: string[]): {
     name: string;
-    status: 'added' | 'removed' | 'modified';
+    status: "added" | "removed" | "modified";
 }[];
 /**
  * Render JSX tree as a single compact line: div > header > button(onClick)

package/dist/index.js

@@ -54,7 +54,9 @@ function isJSXFile(filename) {
   return /\.(jsx|tsx)$/.test(filename);
 }
 function hasJSXContent(lines) {
-  return lines.some((l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l));
+  return lines.some(
+    (l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l)
+  );
 }
 function isClassNameOnlyLine(line) {
   return /^className=/.test(line.trim());
@@ -62,7 +64,9 @@ function isClassNameOnlyLine(line) {
 function extractClassName(line) {
   const staticMatch = line.match(/className="([^"]*)"/);
   if (staticMatch) return staticMatch[1];
-  const ternaryMatch = line.match(/className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/);
+  const ternaryMatch = line.match(
+    /className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/
+  );
   if (ternaryMatch) return `${ternaryMatch[1]} ${ternaryMatch[2]}`;
   const templateMatch = line.match(/className=\{`([^`]*)`\}/);
   if (templateMatch) {
@@ -84,14 +88,16 @@ function parseClassNameChanges(addedLines, removedLines) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).added.add(c));
   }
   for (const line of removedLines.filter((l) => /className=/.test(l))) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).removed.add(c));
   }
   const changes = [];
@@ -109,7 +115,8 @@ function renderStyleChanges(changes) {
   for (const change of changes) {
     lines.push(`**${change.component}**`);
     if (change.added.length > 0) lines.push(`  + ${change.added.join("  ")}`);
-    if (change.removed.length > 0) lines.push(`  - ${change.removed.join("  ")}`);
+    if (change.removed.length > 0)
+      lines.push(`  - ${change.removed.join("  ")}`);
   }
   return lines;
 }
@@ -178,8 +185,12 @@ function parseJSXToFlowTree(lines) {
 }
 function filterDiffLines(diffText) {
   const lines = diffText.split("\n");
-  const added = lines.filter((l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+").map((l) => l.substring(1));
-  const removed = lines.filter((l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-").map((l) => l.substring(1));
+  const added = lines.filter(
+    (l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+"
+  ).map((l) => l.substring(1));
+  const removed = lines.filter(
+    (l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-"
+  ).map((l) => l.substring(1));
   return { added, removed };
 }
 function normalizeCode(lines) {
@@ -360,14 +371,14 @@ function parseDiffToLogicalFlow(diffText) {
   };
 }
 function extractChangedSymbols(addedLines, removedLines) {
-  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s*)?\(/;
+  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s+)?\(?|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*[a-z]\w+\s*[<(]/;
   const COMPONENT_RE = /^(?:export\s+)?(?:default\s+)?(?:function|const)\s+([A-Z][a-z][A-Za-z0-9]*)/;
   const extract = (lines) => {
     const names = /* @__PURE__ */ new Set();
     for (const line of lines) {
       const cm = line.match(COMPONENT_RE) || line.match(FUNC_RE);
       if (cm) {
-        const name = cm[1] || cm[2];
+        const name = cm[1] || cm[2] || cm[3];
         if (name) names.add(name);
       }
     }
@@ -379,7 +390,10 @@ function extractChangedSymbols(addedLines, removedLines) {
   const seen = /* @__PURE__ */ new Set();
   for (const name of addedNames) {
     seen.add(name);
-    results.push({ name, status: removedNames.has(name) ? "modified" : "added" });
+    results.push({
+      name,
+      status: removedNames.has(name) ? "modified" : "added"
+    });
   }
   for (const name of removedNames) {
     if (!seen.has(name)) {
@@ -440,7 +454,9 @@ function generateReaderMarkdown(diffText, meta = {}) {
     sections.push("");
   }
   sections.push("---");
-  sections.push("\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually.");
+  sections.push(
+    "\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually."
+  );
   return sections.join("\n");
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/index.mjs

@@ -11,7 +11,9 @@ function isJSXFile(filename) {
   return /\.(jsx|tsx)$/.test(filename);
 }
 function hasJSXContent(lines) {
-  return lines.some((l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l));
+  return lines.some(
+    (l) => /<[A-Z][A-Za-z]*[\s/>]/.test(l) || /return\s*\(/.test(l)
+  );
 }
 function isClassNameOnlyLine(line) {
   return /^className=/.test(line.trim());
@@ -19,7 +21,9 @@ function isClassNameOnlyLine(line) {
 function extractClassName(line) {
   const staticMatch = line.match(/className="([^"]*)"/);
   if (staticMatch) return staticMatch[1];
-  const ternaryMatch = line.match(/className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/);
+  const ternaryMatch = line.match(
+    /className=\{[^?]+\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/
+  );
   if (ternaryMatch) return `${ternaryMatch[1]} ${ternaryMatch[2]}`;
   const templateMatch = line.match(/className=\{`([^`]*)`\}/);
   if (templateMatch) {
@@ -41,14 +45,16 @@ function parseClassNameChanges(addedLines, removedLines) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).added.add(c));
   }
   for (const line of removedLines.filter((l) => /className=/.test(l))) {
     const cls = extractClassName(line);
     const comp = extractComponentFromLine(line);
     if (!cls) continue;
-    if (!componentMap.has(comp)) componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
+    if (!componentMap.has(comp))
+      componentMap.set(comp, { added: /* @__PURE__ */ new Set(), removed: /* @__PURE__ */ new Set() });
     cls.split(/\s+/).filter(Boolean).forEach((c) => componentMap.get(comp).removed.add(c));
   }
   const changes = [];
@@ -66,7 +72,8 @@ function renderStyleChanges(changes) {
   for (const change of changes) {
     lines.push(`**${change.component}**`);
     if (change.added.length > 0) lines.push(`  + ${change.added.join("  ")}`);
-    if (change.removed.length > 0) lines.push(`  - ${change.removed.join("  ")}`);
+    if (change.removed.length > 0)
+      lines.push(`  - ${change.removed.join("  ")}`);
   }
   return lines;
 }
@@ -135,8 +142,12 @@ function parseJSXToFlowTree(lines) {
 }
 function filterDiffLines(diffText) {
   const lines = diffText.split("\n");
-  const added = lines.filter((l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+").map((l) => l.substring(1));
-  const removed = lines.filter((l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-").map((l) => l.substring(1));
+  const added = lines.filter(
+    (l) => l.startsWith("+") && !l.startsWith("+++") && l.trim() !== "+"
+  ).map((l) => l.substring(1));
+  const removed = lines.filter(
+    (l) => l.startsWith("-") && !l.startsWith("---") && l.trim() !== "-"
+  ).map((l) => l.substring(1));
   return { added, removed };
 }
 function normalizeCode(lines) {
@@ -317,14 +328,14 @@ function parseDiffToLogicalFlow(diffText) {
   };
 }
 function extractChangedSymbols(addedLines, removedLines) {
-  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s*)?\(/;
+  const FUNC_RE = /^(?:export\s+)?(?:async\s+)?function\s+([a-z]\w+)|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*(?:async\s+)?\(?|^(?:export\s+)?(?:const|let|var)\s+([a-z]\w+)\s*=\s*[a-z]\w+\s*[<(]/;
   const COMPONENT_RE = /^(?:export\s+)?(?:default\s+)?(?:function|const)\s+([A-Z][a-z][A-Za-z0-9]*)/;
   const extract = (lines) => {
     const names = /* @__PURE__ */ new Set();
     for (const line of lines) {
       const cm = line.match(COMPONENT_RE) || line.match(FUNC_RE);
       if (cm) {
-        const name = cm[1] || cm[2];
+        const name = cm[1] || cm[2] || cm[3];
         if (name) names.add(name);
       }
     }
@@ -336,7 +347,10 @@ function extractChangedSymbols(addedLines, removedLines) {
   const seen = /* @__PURE__ */ new Set();
   for (const name of addedNames) {
     seen.add(name);
-    results.push({ name, status: removedNames.has(name) ? "modified" : "added" });
+    results.push({
+      name,
+      status: removedNames.has(name) ? "modified" : "added"
+    });
   }
   for (const name of removedNames) {
     if (!seen.has(name)) {
@@ -397,7 +411,9 @@ function generateReaderMarkdown(diffText, meta = {}) {
     sections.push("");
   }
   sections.push("---");
-  sections.push("\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually.");
+  sections.push(
+    "\u{1F6E0} Auto-generated by [github-mobile-reader](https://github.com/3rdflr/github-mobile-reader). Do not edit manually."
+  );
   return sections.join("\n");
 }
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "github-mobile-reader",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Transform git diffs into mobile-friendly Markdown — no more horizontal scrolling when reviewing code on your phone.",
   "keywords": [
     "github",