feat(m02-df): 입력 판 단위 칸을 UnitPick 으로 — 변수 · 새 요소 · DF 길로 확인

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

M02_MasterTemplete/DataFlow/M02_DF_InputPanel.ts

@@ -38,6 +38,7 @@ import {
   type M01Row,
 } from "./M02_DF_InputPanel_Build";
 import { renderLogicInput } from "./M02_DF_InputPanel_Logic";
+import { NO_UNIT, createUnitPick } from "./M02_DF_UnitPick";
 import { renderMaterial } from "./M02_DF_InputPanel_Material";
 import { renderTablePick } from "./M02_DF_InputPanel_Table";
 import { renderVariables } from "./M02_DF_InputPanel_Vars";
@@ -417,7 +418,18 @@ function newForm(
 ): HTMLElement {
   const name = createInputField({ type: "text", label: t("NewName"), compact: true });
   const spec = createInputField({ type: "text", label: t("NewSpec"), compact: true });
-  const unit = createInputField({ type: "text", label: t("NewUnit"), compact: true });
+  let unitValue = "";
+  const unit = el("div", { className: "m02-dfip__unitfield" });
+  const drawUnit = (): void =>
+    unit.replaceChildren(
+      el("span", { className: "m02-dfip__muted", text: t("NewUnit") }),
+      createUnitPick({
+        value: unitValue || NO_UNIT,
+        ariaLabel: t("NewUnit"),
+        onPick: (u) => ((unitValue = u === NO_UNIT ? "" : u), drawUnit()),
+      }),
+    );
+  drawUnit();
   const value = createInputField({ type: "text", label: t("NewValue"), compact: true });
   const go = createButton({
     label: t("Make"),
@@ -432,7 +444,7 @@ function newForm(
         group,
         name: name.input.value.trim(),
         spec: spec.input.value.trim(),
-        unit: unit.input.value.trim(),
+        unit: unitValue,
         value: n,
       }).then(
         (made) => {
@@ -455,14 +467,7 @@ function newForm(
   });
   const d = el("details", {
     className: "m02-dfip__new",
-    children: [
-      el("summary", { text: t("NewHead") }),
-      name.root,
-      spec.root,
-      unit.root,
-      value.root,
-      go,
-    ],
+    children: [el("summary", { text: t("NewHead") }), name.root, spec.root, unit, value.root, go],
   });
   return d;
 }