feat(M01): 로직 개선 시험 「식으로 새로 만들기」 화면 — 식 적기 · 분석 · 변수 정하기 · 막힌 자리 짚기 · 시험 계산 · 저장 (PLAN 3-3)

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PAdA5ThqmtVSsbzjusk1cJ

M01_MasterData/M01_MasterData_UI_LogicLab.ts

@@ -34,6 +34,8 @@ import { buildList, logicId, type ListItem, type ListMark } from "./M01_MasterDa
 import type { SideHandle } from "./M01_MasterData_UI_Side";
 import { tx } from "./M01_MasterData_UI_Logic_Text";
 import { buildLabDetail } from "./M01_MasterData_UI_LogicLab_Detail";
+import { buildNewLogic } from "./M01_MasterData_UI_LogicLab_New";
+import { tn } from "./M01_MasterData_UI_LogicLab_New_Text";
 import "./M01_MasterData_UI_Logic_Style.css";
 
 /** 저장 안 한 로직 하나 — origKey null = 새 로직 · row null = 지움 */
@@ -80,10 +82,12 @@ export async function mountM01LogicLab(
 ): Promise<LogicHandle> {
   let drafts = loadDrafts();
   let opened: Opened | null = null;
+  let creating = false; // 「식으로 새로 만들기」 화면이 열려 있음
   let calcInputs = "";
   const editor = el("div", { className: "m01-logic__editor" });
   const errors = el("div", { className: "m01-logic__reasons", attrs: { hidden: "" } });
   const calc = el("div", { className: "m01lab__calc" });
+  const newHost = el("div", { className: "m01lab__new", attrs: { hidden: "" } });
   const filterHost = el("div");
   const waiting = el("p", { className: "m01-logic__muted", text: tx("Loading") });
   let loaded = false; // 첫 목록이 오기 전에는 「0 줄」 빈 표를 보이지 않음
@@ -165,10 +169,12 @@ export async function mountM01LogicLab(
 
   const drawEditor = (): void => {
     // 고른 로직이 없으면 목록 · 있으면 호표 표 + 시험 계산
-    const listing = !opened;
+    const listing = !opened && !creating;
     list.root.hidden = !listing || !loaded;
     waiting.hidden = loaded;
-    editor.hidden = back.hidden = listing;
+    editor.hidden = !opened;
+    back.hidden = listing;
+    newHost.hidden = !creating;
     if (!opened) return;
     if (!opened.row) {
       editor.replaceChildren(
@@ -192,6 +198,7 @@ export async function mountM01LogicLab(
 
   const show = (next: Opened | null): void => {
     opened = next;
+    creating = false;
     errors.hidden = true;
     drawEditor();
     drawCalc();
@@ -251,7 +258,7 @@ export async function mountM01LogicLab(
         restore: true,
         onPick: (sub, detail) => {
           list.setPick(sub, detail);
-          if (opened) show(null);
+          if (opened || creating) show(null);
         },
       }),
     );
@@ -335,6 +342,29 @@ export async function mountM01LogicLab(
     }
   };
 
+  /** 식으로 새로 만들기 — 저장하면 목록을 다시 받아 그 로직의 상세 화면을 엶 */
+  const startNew = (): void => {
+    opened = null;
+    creating = true;
+    newHost.replaceChildren(
+      buildNewLogic({
+        onSaved: (key) => {
+          void (async () => {
+            try {
+              await reload();
+              await openKeyOn(key);
+            } catch (error) {
+              showToast(error instanceof Error ? error.message : tx("Load_Failed"), "error");
+            }
+          })();
+        },
+        onClose: () => show(null),
+      }),
+    );
+    drawEditor();
+    drawCalc();
+  };
+
   const saveButton = createButton({ label: tx("Bar_Save"), onClick: () => void onSave() });
   const discardButton = createButton({
     label: tx("Bar_Discard"),
@@ -347,6 +377,7 @@ export async function mountM01LogicLab(
       back,
       el("h2", { text: tx("Title") }),
       pending,
+      createButton({ label: tn("Open"), variant: "filled", onClick: startNew }),
       createButton({ label: tx("Bar_Delete"), variant: "danger", onClick: () => void onDelete() }),
       discardButton,
       saveButton,
@@ -358,7 +389,7 @@ export async function mountM01LogicLab(
       children: [
         el("main", {
           className: "m01-logic__main",
-          children: [bar, errors, waiting, list.root, editor],
+          children: [bar, errors, waiting, list.root, editor, newHost],
         }),
       ],
     }),