@open330/kiwimu 0.8.0 → 1.1.0

package/README.md

@@ -4,19 +4,41 @@
 
 # Kiwi Mu
 
-**나만의 학습 위키를 만드세요**
+**Turn any textbook into your personal learning wiki**
 
-전공책, PDF, 웹 콘텐츠를 넣으면 — LLM이 챕터/개념별로 분석하여 상호 링크된 학습 위키를 자동 생성합니다.
+전공책, PDF, 웹 콘텐츠를 넣으면 — LLM이 자동으로 상호 링크된 학습 위키 + 퀴즈를 생성합니다.
 
 [![npm](https://img.shields.io/npm/v/@open330/kiwimu?style=flat-square&color=cb3837&logo=npm)](https://www.npmjs.com/package/@open330/kiwimu)
 [![Bun](https://img.shields.io/badge/Bun-1.0+-fbf0df?style=flat-square&logo=bun&logoColor=black)](https://bun.sh)
 [![TypeScript](https://img.shields.io/badge/TypeScript-5.0+-3178C6?style=flat-square&logo=typescript&logoColor=white)](https://typescriptlang.org)
 [![License](https://img.shields.io/badge/License-MIT-green?style=flat-square)](LICENSE)
 
+<br>
+
+<img src="https://github.com/Open330/kiwimu/raw/main/.context/marketing/demo.gif" alt="kiwimu v1.1 데모: 본문 드래그 → 질문 → 위키 페이지로 저장" width="720">
+
+<br>
+
+> **v1.1 — 위키는 만드는 게 아니라 자라는 거였다.**
+> 본문 드래그 → 팝오버 질문 → AI 답변 → 한 번 클릭으로 정식 위키 페이지로 승격. ([상세 글](https://jiun.dev/posts/kiwimu-v1-1))
+
 </div>
 
 ---
 
+## What's new in v1.1
+
+- 🔖 **출처 추적 (Provenance Tracking)** — 모든 AI 생성 문장에 인라인 인용 자동 부착, 출처 커버리지 행렬 제공
+- 🧱 **스키마 레이어** — `kiwi.toml`의 5줄로 카테고리·용어·페이지 템플릿을 정의하면 LLM이 그 안에서만 작동
+- 💬 **질문 → 위키 승격** — 본문 드래그 → 질문 → "위키에 저장" 한 번이면 정식 페이지. 중복 자동 감지
+- 📑 **콘텐츠 카탈로그** — 자동 카테고리 분류 + 출처 커버리지 한눈 보기
+- 📈 **활동 로그** — 페이지 생성·질문·프로모트·스키마 변경이 시간선으로 누적
+- 👁️ **링크 미리보기 (Peek Panel)** — `/wiki/*` 링크 클릭 시 우측 슬라이드 패널로 미리보기, 확장 버튼으로 전체 이동. 너비 드래그 조절·다이어그램·인라인 편집·드래그 Q&A까지 패널 안에서 그대로 동작
+- 🗂️ **트랙 그룹핑 (Track Grouping)** — `kiwi.toml` 설정으로 사이드바·인덱스를 자동 카테고리(트랙)별로 묶어서 표시
+- 🔑 **인증 토큰 영속화** — 서버 재시작해도 쿠키 기반으로 인증 유지 (관리 페이지·동적 Q&A 한 번 로그인하면 끝)
+
+---
+
 ## 30초 데모 체험
 
 API key 없이 바로 체험할 수 있습니다:
@@ -53,16 +75,37 @@ Kiwi Mu는 LLM을 활용해 이 연결을 **자동으로** 만들어, 지식을
 - **LLM 기반 문서 분석** — 챕터/섹션 구조를 보존한 원본 페이지 + 핵심 개념별 자동 생성 페이지
 - **원본/개념 분리** — 📖 원본 문서와 📝 개념 문서를 시각적으로 구분
 - **자동 상호 링크** — 원본↔개념 간 유기적 cross-link + 외부 참고 자료 (Wikipedia 등)
-- **학습 퀴즈** — 개념 페이지 기반 빈칸 채우기 / OX / 단답형 퀴즈 자동 생성
+- **Dynamic Q&A** — 텍스트 드래그 → 팝오버 질문 → LLM이 새 개념 페이지 자동 생성 + 하이라이트 링크
+- **웹 페이지 편집** — serve 모드에서 ✏️ 마크다운 편집
+- **SM-2 간격 반복** — Anki 스타일 SRS (퀴즈 자동 생성 포함)
+- **학습 대시보드** — 숙달도, 약한 개념, 복습 일정 시각화
+- **MD 파일 + 디렉토리 일괄 인제스트** — `kiwimu add <directory>`로 .md 파일 일괄 처리
+- **LaTeX 수식 렌더링** — KaTeX 기반 수학 수식 지원
+- **Mermaid 다이어그램 지원** — Mermaid.js 기반 다이어그램 렌더링
 - **지식 그래프** — D3.js 인터랙티브 그래프 (원본: 파란색, 개념: 초록색)
-- **데모 모드** — API key 없이 `--demo`로 즉시 체험
-- **다양한 파일 지원** — URL, PDF, DOCX, PPTX, PPT, DOC, KEY, RTF
+- **데모 모드** — API key 없이 `--demo`로 즉시 체험 (양자역학 + 자료구조)
+- **다양한 파일 지원** — URL, PDF, DOCX, PPTX, PPT, DOC, KEY, RTF, **MD** (디렉토리 일괄 인제스트 지원)
 - **4개 LLM 프로바이더** — Google Gemini, Azure OpenAI, OpenAI, Anthropic
-- **다크 모드** — 시스템 테마에 자동 대응
+- **다크 모드** — 시스템 테마에 자동 대응 (100% 커버리지)
 - **모바일 지원** — 햄버거 메뉴 + 슬라이드 사이드바
+- **접근성** — ARIA 속성, 검색 키보드 네비게이션
 - **웹 UI** — 브라우저에서 문서 추가, 설정 변경, 빌드 실행
 - **토큰 사용량 추적** — API 호출 수, 토큰, 예상 비용을 웹에서 확인
 - **원클릭 배포** — GitHub Pages / Vercel
+- **라이브 데모** — [kiwimu.internal.jiun.dev](https://kiwimu.internal.jiun.dev)
+
+## vs. Alternatives
+
+| Feature | Kiwi Mu | NotebookLM | Obsidian | Anki |
+|---------|---------|------------|----------|------|
+| Auto wiki from PDF | ✅ | ❌ | ❌ | ❌ |
+| Knowledge graph | ✅ | ❌ | ✅ (plugin) | ❌ |
+| Auto quiz generation | ✅ | ❌ | ❌ | ❌ (manual) |
+| Spaced repetition | ✅ (basic) | ❌ | ❌ | ✅ |
+| Self-hosted | ✅ | ❌ | ✅ | ✅ |
+| One-click deploy | ✅ | ❌ | ❌ | ❌ |
+| Open source | ✅ | ❌ | ❌ | ✅ |
+| Free | ✅ | ✅ | Freemium | ✅ |
 
 ## Quick Start
 
@@ -112,7 +155,7 @@ Interactive 프롬프트가 실행됩니다:
 │  ○ Anthropic Claude
 
 ◆ 모델명
-│  gemini-2.0-flash-lite
+│  gemini-3.1-flash-lite-preview
 
 ◆ API Key
 │  ••••••••••••
@@ -149,6 +192,17 @@ bunx @open330/kiwimu quiz -n 10
 
 웹에서도 `http://localhost:8000/quiz.html`에서 카드 플립 방식으로 퀴즈를 풀 수 있습니다.
 
+### Dynamic Q&A
+
+위키 페이지에서 이해가 안 되는 부분을 드래그하면, 팝오버가 나타나 LLM에게 질문할 수 있습니다.
+
+1. **텍스트 드래그** — 궁금한 구절을 선택
+2. **팝오버 질문** — "이게 뭐야?", 자유 질문, 또는 자동 생성 질문 선택
+3. **새 개념 페이지 생성** — LLM이 답변을 새로운 개념 페이지로 자동 생성
+4. **하이라이트 링크** — 드래그한 텍스트가 새 페이지로의 링크로 변환
+
+`kiwimu serve` 모드에서 실시간으로 동작합니다. 학습 중 발생하는 궁금증을 즉시 해결하고, 위키가 유기적으로 확장됩니다.
+
 ### 빌드 및 서버
 
 ```bash
@@ -165,7 +219,7 @@ bunx @open330/kiwimu serve -p 3000
 
 ### 관리 페이지
 
-`kiwimu serve` 실행 후 콘솔에 표시되는 admin URL로 접속:
+`kiwimu serve` 실행 후 콘솔에 표시되는 관리 URL (`/manage?token=...`)로 접속:
 - 위키 이름 변경
 - LLM 프로바이더/모델/API Key 설정
 - 토큰 사용량 및 예상 비용 확인
@@ -190,7 +244,8 @@ bunx @open330/kiwimu deploy --target vercel
 |------|------|
 | `kiwimu init [name]` | 새 위키 프로젝트 생성 (interactive CLI) |
 | `kiwimu init --demo` | 샘플 데이터로 즉시 체험 (API key 불필요) |
-| `kiwimu add <source>` | URL 또는 파일 추가 (PDF, DOCX, PPTX, DOC, PPT, KEY, RTF) |
+| `kiwimu add <source>` | URL 또는 파일 추가 (PDF, DOCX, PPTX, DOC, PPT, KEY, RTF, MD) |
+| `kiwimu add <directory>` | 디렉토리 내 모든 .md 파일 일괄 인제스트 |
 | `kiwimu build` | 정적 위키 사이트 빌드 |
 | `kiwimu serve [-p port]` | 웹 서버 실행 (문서 추가/관리 가능) |
 | `kiwimu quiz [-n count]` | 터미널에서 학습 퀴즈 풀기 |
@@ -208,22 +263,23 @@ bunx @open330/kiwimu deploy --target vercel
 | PPTX | ZIP/XML 파싱 |
 | DOC / PPT / RTF | macOS textutil |
 | KEY (Keynote) | 텍스트 추출 (제한적) |
+| Markdown (.md) | 직접 텍스트 추출 (디렉토리 일괄 지원) |
 
 ## Supported LLM Providers
 
 | 프로바이더 | 추천 모델 | 비고 |
 |-----------|----------|------|
-| **Google Gemini** | `gemini-2.0-flash-lite` | [무료 API key](https://aistudio.google.com/) |
-| Azure OpenAI | `gpt-5-nano` | Azure 구독 필요 |
-| OpenAI | `gpt-4o` | API key 필요 |
-| Anthropic | `claude-sonnet-4-20250514` | API key 필요 |
+| **Google Gemini** | `gemini-3.1-flash-lite-preview` | [무료 API key](https://aistudio.google.com/) |
+| Azure OpenAI | `gpt-5.4-nano` | Azure 구독 필요 |
+| OpenAI | `gpt-5.4` | API key 필요 |
+| Anthropic | `claude-sonnet-4-6` | API key 필요 |
 
 ## Architecture
 
 ```
-소스 (URL / PDF / DOCX / PPTX / DOC / PPT / KEY / RTF)
+소스 (URL / PDF / DOCX / PPTX / DOC / PPT / KEY / RTF / MD)
     ↓
-[ Ingest ]      ── Cheerio / pdf-parse / mammoth / jszip / textutil
+[ Ingest ]      ── Cheerio / pdf-parse / mammoth / jszip / textutil / MD 직접 추출
     ↓
 [ Phase 1 ]     ── LLM: 원본 구조 추출 (📖 원본 페이지) — 병렬 처리 (concurrency=3)
     ↓
@@ -233,24 +289,45 @@ bunx @open330/kiwimu deploy --target vercel
     ↓
 [ Phase 3 ]     ── [[wiki link]] 해석 + 원본↔개념 cross-link
     ↓
-[ Build ]       ── 정적 HTML (사이드바, KaTeX, 지식 그래프, 퀴즈, 다크 모드)
+[ Build ]       ── 정적 HTML (사이드바, KaTeX, Mermaid, 지식 그래프, 퀴즈, 다크 모드)
     ↓
 [ Deploy ]      ── GitHub Pages / Vercel
+
+[ Dynamic Q&A ] ── 텍스트 드래그 → 팝오버 → LLM 질문 → 새 개념 페이지 생성 + 하이라이트 링크
+                   (serve 모드에서 실시간 동작)
 ```
 
 ```
 project-dir/
-├── kiwi.toml          # 프로젝트 + LLM 설정
-├── kiwi.db            # SQLite (문서, 링크, 퀴즈, 사용량)
-├── uploads/           # 업로드된 파일
-└── _site/             # 빌드 결과
-    ├── index.html     # 홈 (문서 목록)
-    ├── graph.html     # 지식 그래프
-    ├── quiz.html      # 학습 퀴즈
-    ├── wiki/          # 각 문서 페이지
-    │   └── random.html  # 임의 문서
-    ├── static/        # CSS, JS, 로고
+├── kiwi.toml              # 프로젝트 + LLM 설정
+├── kiwi.db                # SQLite (문서, 링크, 퀴즈, 사용량)
+├── uploads/               # 업로드된 파일
+└── _site/                 # 빌드 결과
+    ├── index.html         # 홈 (문서 목록)
+    ├── graph.html         # 지식 그래프
+    ├── quiz.html          # 학습 퀴즈
+    ├── dashboard.html     # 학습 대시보드
+    ├── wiki/              # 각 문서 페이지
+    │   └── random.html    # 임의 문서
+    ├── static/            # CSS, JS, 로고
+    │   ├── dynamic-qa.js  # Dynamic Q&A (드래그→팝오버→질문)
+    │   └── edit-page.js   # 웹 페이지 편집 모달
     └── search-index.json
+
+src/
+├── services/
+│   ├── dynamic-qa.ts      # Dynamic Q&A 서버 로직
+│   └── ingest.ts          # 공유 인제스트 로직
+├── ingest/
+│   ├── markdown.ts        # Markdown 파일 파싱 (디렉토리 일괄 지원)
+│   ├── web.ts / pdf.ts / docx.ts / pptx.ts
+│   └── ...
+├── demo/
+│   ├── sample-data.ts     # 데모 샘플 데이터
+│   └── setup.ts           # 데모 초기화
+└── build/static/
+    ├── dynamic-qa.js      # Dynamic Q&A 클라이언트
+    └── edit-page.js       # 페이지 편집 클라이언트
 ```
 
 ## Tech Stack
@@ -263,7 +340,8 @@ project-dir/
 - **JSZip** — PPTX 파싱
 - **Marked** + **sanitize-html** — Markdown → 안전한 HTML
 - **D3.js** — 지식 그래프
-- **KaTeX** — 수학 수식 렌더링
+- **KaTeX** — LaTeX 수학 수식 렌더링
+- **Mermaid.js** — 다이어그램 렌더링
 - **gh-pages** — GitHub Pages 배포
 
 ## Security

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open330/kiwimu",
-  "version": "0.8.0",
+  "version": "1.1.0",
   "description": "Turn textbooks, PDFs, and web content into your own interlinked learning wiki powered by LLM",
   "type": "module",
   "bin": {

package/src/build/renderer.ts

@@ -1,17 +1,44 @@
-import { mkdirSync, rmSync, cpSync, existsSync } from "fs";
+import { mkdirSync, rmSync, cpSync, existsSync, readFileSync, writeFileSync } from "fs";
 import { join, dirname } from "path";
 import { marked } from "marked";
 import sanitizeHtml from "sanitize-html";
-import type { KiwiConfig } from "../config";
+import { loadConfig, type KiwiConfig } from "../config";
 import type { Store } from "../store";
 import { buildGraphData } from "../pipeline/graph";
-import { renderPage, renderIndex, renderGraph, renderQuizPage } from "./templates";
+import { renderCitationFootnotes } from "../pipeline/citations";
+import { renderPage, renderIndex, renderGraph, renderQuizPage, renderDashboardPage, renderCatalogPage } from "./templates";
+
+function escapeHtmlChars(s: string): string {
+  return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+}
+
+// Fallback: catches any ```mermaid block that slipped past the placeholder pre-pass.
+// Keeps marked's existing escaping intact — the browser decodes via textContent
+// when mermaid.js reads the diagram source.
+function convertMermaidBlocks(html: string): string {
+  if (!html.includes('language-mermaid')) return html;
+  return html.replace(
+    /<pre><code class="language-mermaid">([\s\S]*?)<\/code><\/pre>/g,
+    (_match, code: string) => {
+      if (!code.trim()) return '';
+      return `<pre class="mermaid">${code}</pre>`;
+    }
+  );
+}
 
 // Fix internal wiki links: /wiki/slug → /wiki/slug.html
-function fixWikiLinks(html: string): string {
+// Mark non-existent pages as "red links" (wiki convention for missing pages)
+function fixWikiLinks(html: string, existingSlugs?: Set<string>): string {
   return html.replace(/href="\/wiki\/([^"]+?)"/g, (match, slug) => {
-    if (slug.endsWith(".html")) return match;
-    return `href="/wiki/${slug}.html"`;
+    const cleanSlug = slug.endsWith(".html") ? slug.replace(".html", "") : slug;
+    const decodedSlug = decodeURIComponent(cleanSlug);
+    const href = slug.endsWith(".html") ? match : `href="/wiki/${slug}.html"`;
+
+    // If we have slug list and this page doesn't exist, mark as red link
+    if (existingSlugs && !existingSlugs.has(decodedSlug) && !existingSlugs.has(cleanSlug)) {
+      return `${href} class="redlink" title="문서 없음: ${decodedSlug}"`;
+    }
+    return href;
   });
 }
 
@@ -43,6 +70,79 @@ function generateToc(markdown: string): string {
     .join("")}</ul></div>`;
 }
 
+// Shared markdown rendering + sanitization logic
+export async function renderPageContent(page: { content: string }, existingSlugs?: Set<string>): Promise<string> {
+  // Convert [[wiki links]] to markdown links before rendering
+  // [[slug]] → [slug](/wiki/slug.html)
+  // [[slug|display text]] → [display text](/wiki/slug.html)
+  let markdown = page.content.replace(/\[\[([^\]|]+?)(?:\|([^\]]+?))?\]\]/g, (_match, slug, display) => {
+    const text = display || slug.replace(/-/g, ' ');
+    return `[${text}](/wiki/${encodeURIComponent(slug)}.html)`;
+  });
+
+  // Protect LaTeX math from marked() processing
+  // Replace $...$ and $$...$$ with placeholders to prevent _ and * from being parsed as markdown
+  const mathPlaceholders: string[] = [];
+  markdown = markdown.replace(/\$\$[\s\S]+?\$\$/g, (match) => {
+    mathPlaceholders.push(match);
+    return `%%MATH_BLOCK_${mathPlaceholders.length - 1}%%`;
+  });
+  markdown = markdown.replace(/\$(?!\$)(.+?)\$/g, (match) => {
+    mathPlaceholders.push(match);
+    return `%%MATH_INLINE_${mathPlaceholders.length - 1}%%`;
+  });
+
+  // Protect mermaid fenced blocks: extract verbatim before marked sees them, so
+  // node labels containing markdown chars (*, _, |) or HTML chars (<, >, ")
+  // never get mangled by marked or stripped by sanitize-html.
+  const mermaidBlocks: string[] = [];
+  markdown = markdown.replace(/```mermaid\r?\n([\s\S]*?)```/g, (_match, body: string) => {
+    mermaidBlocks.push(body);
+    return `\n\n%%MERMAID_BLOCK_${mermaidBlocks.length - 1}%%\n\n`;
+  });
+
+  let htmlContent = await marked(markdown);
+
+  // Restore LaTeX math from placeholders
+  htmlContent = htmlContent.replace(/%%MATH_(BLOCK|INLINE)_(\d+)%%/g, (_match, _type, idx) => {
+    return mathPlaceholders[parseInt(idx)] || '';
+  });
+  // Fallback: convert any leftover marked-emitted mermaid code blocks
+  htmlContent = convertMermaidBlocks(htmlContent);
+  htmlContent = sanitizeHtml(htmlContent, {
+    allowedTags: sanitizeHtml.defaults.allowedTags.concat([
+      'img', 'details', 'summary', 'kbd', 'del', 's', 'sup', 'sub',
+      'span', 'div', 'section', 'figure', 'figcaption', 'mark',
+      'pre', 'code'
+    ]),
+    allowedAttributes: {
+      ...sanitizeHtml.defaults.allowedAttributes,
+      '*': ['id', 'class'],
+      'img': ['src', 'alt', 'title', 'width', 'height'],
+      'a': ['href', 'title', 'target', 'rel'],
+      'span': ['class'],  // For KaTeX
+      'pre': ['class'],   // For Mermaid
+      'code': ['class'],
+    },
+    allowedSchemes: ['http', 'https', 'mailto'],
+  });
+
+  // Restore mermaid blocks AFTER sanitize so the diagram source is preserved
+  // verbatim. Escape only the HTML structural chars so the browser's textContent
+  // (which mermaid.js uses) yields the original characters.
+  htmlContent = htmlContent.replace(
+    /(?:<p>\s*)?%%MERMAID_BLOCK_(\d+)%%(?:\s*<\/p>)?/g,
+    (_match, idx) => {
+      const body = mermaidBlocks[parseInt(idx, 10)] || '';
+      if (!body.trim()) return '';
+      return `<pre class="mermaid">${escapeHtmlChars(body)}</pre>`;
+    }
+  );
+
+  htmlContent = fixWikiLinks(htmlContent, existingSlugs);
+  return htmlContent;
+}
+
 export async function buildSite(store: Store, config: KiwiConfig, projectRoot: string): Promise<number> {
   const outputDir = join(projectRoot, config.build.output_dir);
   const wikiDir = join(outputDir, "wiki");
@@ -57,36 +157,53 @@ export async function buildSite(store: Store, config: KiwiConfig, projectRoot: s
     cpSync(assetsDir, staticDir, { recursive: true });
   }
 
-  // Copy logo
-  const logoSrc = join(projectRoot, "..", "assets", "logos", "logo_2_minimalist_icon_transparent.png");
-  const logoSrc2 = join(projectRoot, "assets", "logos", "logo_2_minimalist_icon_transparent.png");
-  const logoFile = existsSync(logoSrc) ? logoSrc : existsSync(logoSrc2) ? logoSrc2 : null;
-  if (logoFile) {
+  // Copy logo (check multiple possible locations).
+  // Order: shipped-with-kiwimu (works for both git clone and npm install), then
+  // wiki-project-local overrides, then Docker path, then the assetsDir copy
+  // already produced above (so Bun.file lookups stay consistent).
+  const kiwimuAssets = join(dirname(import.meta.path), "..", "..", "assets", "logos", "logo_2_minimalist_icon_transparent.png");
+  const logoCandidates = [
+    kiwimuAssets,
+    join(projectRoot, "..", "assets", "logos", "logo_2_minimalist_icon_transparent.png"),
+    join(projectRoot, "assets", "logos", "logo_2_minimalist_icon_transparent.png"),
+    "/app/assets/logos/logo_2_minimalist_icon_transparent.png", // Docker path
+    join(staticDir, "logo.png"), // already copied via assetsDir → use it as the source
+  ];
+  const logoFile = logoCandidates.find(p => existsSync(p)) || null;
+  if (logoFile && logoFile !== join(staticDir, "logo.png")) {
     cpSync(logoFile, join(staticDir, "logo.png"));
   }
 
+  // Browsers fetch /favicon.ico from the site root regardless of HTML markup,
+  // so we mirror it from the bundled static assets if present.
+  const faviconSrc = join(staticDir, "favicon.ico");
+  if (existsSync(faviconSrc)) {
+    cpSync(faviconSrc, join(outputDir, "favicon.ico"));
+  } else if (logoFile) {
+    // Fall back to the logo as a favicon so /favicon.ico never 404s.
+    cpSync(logoFile, join(outputDir, "favicon.ico"));
+  }
+
   const pages = store.listPages();
   const sourcePages = store.listSourcePages();
   const conceptPages = store.listConceptPages();
   const wikiName = config.project.name;
   const backlinksMap = store.getAllBacklinksGrouped();
+  const allSlugs = new Set(pages.map(p => p.slug));
+  const categories = config.categories;
+
+  // Build source_id → uri map so PageLink rows can carry sourceUri (used by templates for category grouping)
+  const sourceUriMap = new Map<number, string>();
+  for (const s of store.listSources()) sourceUriMap.set(s.id, s.uri);
+  const sourceLink = (p: { slug: string; title: string; source_id: number; origin?: string }) => ({
+    slug: p.slug,
+    title: p.title,
+    sourceUri: sourceUriMap.get(p.source_id),
+    ...(p.origin ? { origin: p.origin } : {}),
+  });
 
   for (const page of pages) {
-    let htmlContent = await marked(page.content);
-    htmlContent = sanitizeHtml(htmlContent, {
-      allowedTags: sanitizeHtml.defaults.allowedTags.concat([
-        'img', 'details', 'summary', 'kbd', 'del', 's', 'sup', 'sub',
-        'span', 'div', 'section', 'figure', 'figcaption', 'mark'
-      ]),
-      allowedAttributes: {
-        ...sanitizeHtml.defaults.allowedAttributes,
-        '*': ['id', 'class', 'style'],
-        'img': ['src', 'alt', 'title', 'width', 'height'],
-        'a': ['href', 'title', 'target', 'rel'],
-      },
-      allowedSchemes: ['http', 'https', 'mailto'],
-    });
-    htmlContent = fixWikiLinks(htmlContent);
+    const htmlContent = await renderPageContent(page, allSlugs);
 
     const { body, externalRefs } = extractExternalRefs(htmlContent);
     const toc = generateToc(page.content);
@@ -96,17 +213,25 @@ export async function buildSite(store: Store, config: KiwiConfig, projectRoot: s
       pageType: bl.page_type,
     }));
 
+    // Citations footer
+    const citations = store.getCitationsForPage(page.id);
+    const citationsHtml = renderCitationFootnotes(citations);
+
     const html = renderPage({
       wikiName,
       pageTitle: page.title,
       pageSlug: page.slug,
       pageType: page.page_type,
+      pageId: page.id,
+      origin: page.origin,
       content: body,
       externalRefs,
       toc,
       backlinks,
-      sourcePages: sourcePages.map((p) => ({ slug: p.slug, title: p.title })),
-      conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title })),
+      citationsHtml,
+      sourcePages: sourcePages.map(sourceLink),
+      conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title, origin: p.origin })),
+      categories,
     });
 
     await Bun.write(join(wikiDir, `${page.slug}.html`), html);
@@ -114,9 +239,10 @@ export async function buildSite(store: Store, config: KiwiConfig, projectRoot: s
 
   const indexHtml = renderIndex({
     wikiName,
-    sourcePages: sourcePages.map((p) => ({ slug: p.slug, title: p.title })),
+    sourcePages: sourcePages.map(sourceLink),
     conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title })),
-    sourceCount: store.listSources().length,
+    sourceCount: store.countSources(),
+    categories,
   });
   await Bun.write(join(outputDir, "index.html"), indexHtml);
 
@@ -126,8 +252,9 @@ export async function buildSite(store: Store, config: KiwiConfig, projectRoot: s
     join(outputDir, "graph.html"),
     renderGraph({
       wikiName,
-      sourcePages: sourcePages.map((p) => ({ slug: p.slug, title: p.title })),
+      sourcePages: sourcePages.map(sourceLink),
       conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title })),
+      categories,
     })
   );
 
@@ -146,7 +273,41 @@ export async function buildSite(store: Store, config: KiwiConfig, projectRoot: s
         page_title: q.page_title,
         page_slug: q.page_slug,
       })),
-      sourcePages: sourcePages.map((p) => ({ slug: p.slug, title: p.title })),
+      sourcePages: sourcePages.map(sourceLink),
+      conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title })),
+      categories,
+    })
+  );
+
+  // Dashboard page
+  const stats = store.getLearningStats();
+  const weakConcepts = store.getWeakConcepts(10);
+  const recentAttempts = store.getQuizHistory(20);
+  await Bun.write(
+    join(outputDir, "dashboard.html"),
+    renderDashboardPage({
+      wikiName,
+      stats,
+      weakConcepts,
+      recentAttempts,
+      sourcePages: sourcePages.map(sourceLink),
+      conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title })),
+      categories,
+    })
+  );
+
+  // Catalog (index) page
+  const { generateContentIndex } = await import("../services/index-generator");
+  const contentIndex = await generateContentIndex(store);
+  await Bun.write(
+    join(outputDir, "catalog.html"),
+    renderCatalogPage({
+      wikiName,
+      categories: contentIndex.categories,
+      totalPages: contentIndex.totalPages,
+      totalLinks: contentIndex.totalLinks,
+      generatedAt: contentIndex.generatedAt,
+      sourcePages: sourcePages.map(sourceLink),
       conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title })),
     })
   );
@@ -174,3 +335,82 @@ fetch('/search-index.json').then(r=>r.json()).then(pages=>{
 
   return pages.length;
 }
+
+export async function buildSinglePage(root: string, store: Store, slug: string): Promise<void> {
+  const page = store.getPage(slug);
+  if (!page) return;
+
+  const config = loadConfig(root);
+  const siteDir = join(root, config.build?.output_dir || "_site");
+  const wikiDir = join(siteDir, "wiki");
+  mkdirSync(wikiDir, { recursive: true });
+
+  const sourcePages = store.listSourcePages();
+  const conceptPages = store.listConceptPages();
+  const wikiName = config.project.name;
+  const backlinksMap = store.getAllBacklinksGrouped();
+
+  const sourceUriMap = new Map<number, string>();
+  for (const s of store.listSources()) sourceUriMap.set(s.id, s.uri);
+  const sourceLink = (p: { slug: string; title: string; source_id: number; origin?: string }) => ({
+    slug: p.slug,
+    title: p.title,
+    sourceUri: sourceUriMap.get(p.source_id),
+    ...(p.origin ? { origin: p.origin } : {}),
+  });
+
+  // Render the single page
+  const htmlContent = await renderPageContent(page);
+
+  const { body, externalRefs } = extractExternalRefs(htmlContent);
+  const toc = generateToc(page.content);
+  const backlinks = (backlinksMap.get(page.id) || []).map((bl) => ({
+    slug: bl.slug,
+    title: bl.title,
+    pageType: bl.page_type,
+  }));
+
+  // Citations footer
+  const citations = store.getCitationsForPage(page.id);
+  const citationsHtml = renderCitationFootnotes(citations);
+
+  const html = renderPage({
+    wikiName,
+    pageTitle: page.title,
+    pageSlug: page.slug,
+    pageType: page.page_type,
+    pageId: page.id,
+    origin: page.origin,
+    content: body,
+    externalRefs,
+    toc,
+    backlinks,
+    citationsHtml,
+    sourcePages: sourcePages.map(sourceLink),
+    conceptPages: conceptPages.map((p) => ({ slug: p.slug, title: p.title, origin: p.origin })),
+    categories: config.categories,
+  });
+
+  await Bun.write(join(wikiDir, `${page.slug}.html`), html);
+
+  // Update search-index.json
+  const searchIndexPath = join(siteDir, "search-index.json");
+  let searchData: Array<{ slug: string; title: string; preview: string; type: string }> = [];
+  if (existsSync(searchIndexPath)) {
+    try {
+      searchData = JSON.parse(readFileSync(searchIndexPath, "utf-8"));
+    } catch {
+      searchData = [];
+    }
+  }
+  // Remove existing entry for this slug if any
+  searchData = searchData.filter((p) => p.slug !== page.slug);
+  // Append new entry
+  searchData.push({
+    slug: page.slug,
+    title: page.title,
+    preview: page.content.slice(0, 200),
+    type: page.page_type,
+  });
+  await Bun.write(searchIndexPath, JSON.stringify(searchData));
+}