방식 C 를 테스트 컨테이너에서 꺼내 로직 화면 기본 보기로 올림(옛 호표 표는 「고급」).
상자를 누르면 값·출처에 더해 쉬운 말 풀이와 원문 표 미리보기(걸린 줄 강조)가 펼쳐짐.
자체 로직은 [고치기] 로 상자 안에서 고치고 줄을 더하거나 지움 — 정본은 「본떠 만들기」 뒤.
- UI_Test_C·_Model·_Style → UI_Logic_Flow·_Model·_Style
- UI_Test_Pick 의 재료·기계 바꿔 고르기를 UI_Logic_Pick 에 합침
- 방식 B 의 설명 카드 로직을 UI_Logic_Note 로 옮겨 흐름 그림과 같이 씀
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PAdA5ThqmtVSsbzjusk1cJ
M01_MasterData_UI_Test_B.ts 새 파일 — export function render(host, logicKey)
하나로 접속. fetchLogic·runCalc·elements·table 기존 Store·API 그대로 재사용
(새 엔진·새 계산 없음).
호표 줄을 누르면 옆 카드에 이 수량이 어디서 왔나 표시: 식 속 찾기(표,조건).칸
호출을 뽑아 그 소요량·계수 표를 /elements+/table 로 다시 읽어 걸린 줄 강조 ·
중간 식 이름에 「할증」 들어간 것은 적용된 할증으로 따로 보임 · 쉬운 말
풀이(찾기·만약 호출을 문장으로, 나머지는 원문 식) · 계산 답의 middle 값으로
할증률 등 중간 계산값 표시. 입력 바꾸면 자동 재계산(디바운스 300ms)해 호표·
카드 같이 갱신.
검증: npm run typecheck 통과(0). ORCA 로 임시 붙여 확인하려 했으나 로그인
화면에 막혀(시험 계정 없음) 실제 화면 확인은 못 함 — 임의 판정: typecheck만으로
마감(임시 연결은 확인 뒤 되돌려 커밋 안 함).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WaS48Nvs26o3aFUpcfJxVv
eomsangdonandClaude Opus 5