- 7C.1 theme.ts 확장 [ba4d6e4] — color/shadow/font.display/animations 추가 - 7C.2 Phosphor React Icon 어댑터 [0d2303a] — 57 아이콘 매핑 - 7C.3 Inter + JetBrains Mono next/font [140a7c3] — CSS variable 바인딩 - 7C.4 primitives.tsx 증축 [b9874ad] — Button white, Card glow, StatCard, KbdHint, PageHeader, AppShellLayout - 7C.5 Toast 컴포넌트 [eb10dfe] — slideIn + undo + progress ring + hover pause 통합 빌드: 16/16 페이지 생성, TS 에러 0. 다음: Phase 7A (KICE PDF 파싱 파이프라인).
25 lines
1.9 KiB
JSON
25 lines
1.9 KiB
JSON
{
|
|
"task_id": "7C.2",
|
|
"title": "Phosphor React Icon 어댑터",
|
|
"goal": "디자인 파일에서 사용되는 <i class=\"ph ph-xxx\"> 클래스를 React 컴포넌트로 교체할 수 있게 Icon 어댑터를 만든다.",
|
|
"checks": [
|
|
"frontend/package.json 에 @phosphor-icons/react 추가 (pnpm install 로)",
|
|
"frontend/src/components/ui/Icon.tsx 신규 — name, weight, size, color, className props",
|
|
"name 매핑: 디자인 파일에 등장한 아이콘 전부 지원 — squares-four, book-open, arrows-clockwise, trend-up, folders, infinity, fire, check, x, triangle, stack, target, chart-polar, chart-line-up, chart-pie-slice, chart-bar, check-circle, magic-wand, plus, caret-up, caret-down, caret-right, caret-left, book-bookmark, function, dna, clock-counter-clockwise, pencil-simple, archive, users, chalkboard-teacher, sliders, file-pdf, moon-stars, devices, keyboard, brain, funnel, magnifying-glass, download-simple, calendar-blank, calendar-check, bell-ringing, bell, sparkle, minus, dots-three, translate, book-open-text, skip, info, sign-out, camera, crown, export, gear, arrow-right",
|
|
"weight prop: 'thin'|'light'|'regular'|'bold'|'fill'|'duotone' (기본 regular)",
|
|
"사용 예시 주석에 '<Icon name=\"squares-four\" size={20} />' 포함",
|
|
"타입 안전: name 은 string literal union",
|
|
"기존 layout.tsx 의 phosphor CDN <link> 또는 <script> 있으면 **제거 금지** (다른 곳에서 쓰고 있을 수 있음 — 확인 후 건드리지 말 것). 신규 Icon 컴포넌트만 추가"
|
|
],
|
|
"non_goals": [
|
|
"기존 <i class=\"ph ph-*\"> 사용처를 전부 교체 (그건 7D 페이지 재디자인에서)",
|
|
"아이콘 sprite sheet 생성",
|
|
"Icon 내부에서 tooltip/지연 로드"
|
|
],
|
|
"runtime_validation": [],
|
|
"risk_flags": [],
|
|
"reviewer_profile": "static",
|
|
"effort_score": 0,
|
|
"deliverable": "frontend/src/components/ui/Icon.tsx + package.json 의존 추가"
|
|
}
|