Files
kebab/tasks/p9/p9-fb-11-ask-markdown-render.md
altair823 c462dbf6a4 feat(kebab-tui): p9-fb-11 ask answer markdown rendering
도그푸딩 item 9 — TUI Ask 답변 본문이 raw `**bold**` / `# Title` /
` ```code``` ` 그대로 보여 가독성 떨어지던 문제 해소. pulldown-cmark
파싱 → ratatui Span/Line 변환.

## 핵심 변경

- **`kebab-tui::markdown::render(text, &Theme) -> Vec<Line<'static>>`**
  신규. pulldown-cmark = "0.13" (이미 kebab-parse-md 가 사용 중인
  버전) 위에 build.

  inline:
  - `**bold**` / `__bold__` → `Modifier::BOLD`
  - `*italic*` / `_italic_` → `Modifier::ITALIC`
  - `~~strike~~` → `Modifier::CROSSED_OUT`
  - `` `code` `` → `Role::Hint` (DIM 스타일 — 터미널 호환성 위해 bg
    color 보다 안전)
  - `[text](url)` → `Role::CitationMarker` + `Modifier::UNDERLINED`

  block:
  - heading H1/H2 → `Role::Heading` (Cyan + BOLD), H3-H6 → `Role::Title`
    (White + BOLD)
  - bullet list `-`/`*` → `- ` + 깊이별 indent
  - ordered list `1.` → 실제 번호 prefix + indent
  - fenced code block ``` ``` ``` → `  ` indented + `Role::Hint`
  - blockquote `>` → 좌측 `▎` bar (중첩 시 반복) + `Role::Hint`
  - table `| col |` → `| col1 | col2 |` 식 줄, `|` separator 색 강조
  - horizontal rule `---` → `─` × 40

- **streaming 안전성**: 매 frame 재 parse 가 spec — pulldown
  토크나이저가 µs/KB 라 비용 무시. unterminated `**` (사용자가 한창
  입력 중인 inline 가 닫히기 전) 은 pulldown 이 Text 로 처리 →
  literal `**` 그대로 표시 (글자 누락 X).

- **`ask::push_turn_lines` 통합**: grounded 답변에서만 markdown
  렌더 사용. refusal turn (`Role::Warning` override) 와 streaming
  turn (`Role::Hint`) 은 raw 로 두어 role color 시그널이 markdown
  스타일에 묻히지 않도록. body line 들은 `  ` indent 로 transcript
  에서 답변 본문 시각 구분.

- **CLI `kebab ask` 출력은 raw markdown** — 터미널 호환성 + pipe
  처리 시 안정성 위해 (ANSI escape 없이 plain text).

## 테스트 (markdown.rs 14 unit)

- empty input → 빈 라인 1 줄 (caller scroll/measure 안전)
- plain text → 단일 라인 + paragraph blank
- bold / italic / strikethrough / inline code → 해당 modifier 검증
- link → UNDERLINED 검증
- heading H1 → BOLD 텍스트 span
- bullet list `-` / numbered list `1./2.` → prefix 검증
- code fence body → 줄별 `  ` indent 보존
- blockquote → `▎` prefix
- 2x2 table → `|`-separated 줄 검증
- unterminated `**` → 글자 누락 없음 (streaming 안전성 회귀 방지)
- composite (heading + para + list + code) → 문서 순서 보존

기존 75 TUI 테스트 + 신규 14 markdown = 89 통과. clippy clean.

## 문서

- README `kebab tui` 행에 markdown 렌더 안내 + CLI 는 raw 명시
- HANDOFF: 2026-05-03 entry
- spec status planned → in_progress

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-03 03:33:21 +00:00

2.0 KiB

phase, component, task_id, title, status, depends_on, unblocks, contract_source, contract_sections, source_feedback
phase component task_id title status depends_on unblocks contract_source contract_sections source_feedback
P9 kebab-tui (ask pane) p9-fb-11 Ask answer markdown rendering (bold/italic/code/list/table) in_progress
p9-fb-14
../../docs/superpowers/specs/2026-04-27-kebab-final-form-design.md
§7 RAG
§10 UX
p9-dogfooding-feedback.md item 9

p9-fb-11 — Ask markdown render

Goal

ask 답변의 markdown 문법을 ratatui Span / Line 으로 변환해 시각 구분. raw **bold** 사라지고 실제 bold 표시.

Allowed dependencies

  • pulldown-cmark (이미 워크스페이스에 있음).
  • ratatui (기존).

Public surface

kebab-tui::markdown::render(text: &str, theme: &Theme) -> Vec<Line<'static>>. theme 은 p9-fb-14.

Behavior contract

inline:

  • **bold** / __bold__Modifier::BOLD.
  • *italic* / _italic_Modifier::ITALIC.
  • inline code ` → bg theme.code_bg.
  • 링크 [text](url) → underline + theme.link.

block:

  • heading #, ##, ... → fg color 에 따라 hierarchy.
  • list bullet - / * / 1. → indent + bullet char.
  • code fence → 박스 widget + monospace assumed.
  • table | col | → ratatui Table widget. column auto-width.
  • blockquote > → 좌측 vertical bar + dim fg.

streaming 처리: 마지막 incomplete inline span (e.g. 닫지 않은 **) 은 raw 로 표시. complete 부분만 styled. 매 frame 재 parse — cheap, ms 단위.

Test plan

kind description
unit **hi** → 1 Span with BOLD modifier
unit code fence → CodeBlock 변환
unit table 2x2 → ratatui Table
snapshot 복합 답변 (heading + list + code) → snapshot 비교

DoD

  • cargo test -p kebab-tui 통과
  • 도그푸딩: bold / italic / table 답변 정상 렌더
  • CLI ask 출력은 raw markdown 유지 (terminal 호환성)

Out of scope

  • 이미지 (markdown img tag) 렌더링 — 터미널 한계
  • 링크 클릭 / 따라가기 (P+)