fix(M02): 흐름도 패널 처음 배율 = 읽히는 최소 0.6(넘치면 왼쪽 위 입력 상자부터) · 「한눈에」 단추는 전체(0.25) · 크게 보기는 그대로 0.9(PLAN 36-3 덧)

- 다이어그램 opts.fitAllMin(단추) · fitMin(저절로) 나눔 · Paper · Panel 이 넘김
- 시험 diagram_parts 8 + panel 2 통과 · DataFlow 전부 검사 초록

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

M02_MasterTemplete/DataFlow/M02_DF_Diagram.ts

@@ -314,13 +314,22 @@ export function renderDiagram(
     applyView();
     drawLines();
   };
-  const fit = (): void => {
+  /** 맞추기 — 저절로(처음 · 다시 맞춤)는 fitMin · 「한눈에」 단추는 fitAllMin(전체가 보이게) */
+  const fit = (button = false): void => {
     const rects = lg.boxes.map((b) => {
       const n = world.querySelector<HTMLElement>(`.m02-dfdg__box[data-box="${CSS.escape(b.id)}"]`);
       return { x: b.x, y: b.y, w: n?.offsetWidth ?? 180, h: n?.offsetHeight ?? 80 };
     });
     const r = view.getBoundingClientRect();
-    Object.assign(st, fitView(rects, { w: r.width, h: r.height }, 40, opts.fitMin));
+    Object.assign(
+      st,
+      fitView(
+        rects,
+        { w: r.width, h: r.height },
+        40,
+        button ? (opts.fitAllMin ?? opts.fitMin) : opts.fitMin,
+      ),
+    );
     applyView();
     drawLines();
   };
@@ -400,7 +409,7 @@ export function renderDiagram(
       sm("ZoomOut", () => setZoom(st.zoom / 1.2)),
       zoomLabel,
       sm("ZoomIn", () => setZoom(st.zoom * 1.2)),
-      sm("Fit", fit),
+      sm("Fit", () => fit(true)),
       ...(ro
         ? []
         : [

M02_MasterTemplete/DataFlow/M02_DF_Diagram_Parts.ts

@@ -124,6 +124,8 @@ export interface DiagramOpts {
   fitKey?: number;
   /** 저절로 맞출 때 가장 작은 확대 — 없으면 FIT_MIN(좁은 패널은 더 작게) */
   fitMin?: number;
+  /** 「한눈에」 단추로 맞출 때 가장 작은 확대 — 없으면 fitMin */
+  fitAllMin?: number;
 }
 
 /* ── 알약 · 자리 ────────────────────────────────────────────────────── */

M02_MasterTemplete/DataFlow/M02_DF_Panel.ts

@@ -52,8 +52,10 @@ export interface FlowPanel {
 
 export const PANEL_MIN = 320;
 export const STRIP_WIDTH = 40;
-/** 좁은 패널에서 저절로 맞출 때 가장 작은 확대 */
-export const PANEL_FIT_MIN = 0.25;
+/** 패널에서 저절로 맞출 때 가장 작은 확대 — 글이 읽히는 최소 */
+export const PANEL_FIT_MIN = 0.6;
+/** 패널 「한눈에」 단추 — 전체가 보이게(가장 작은 확대) */
+export const PANEL_FIT_ALL_MIN = 0.25;
 const WIDTH_KEY = "m02.dfpanel.width";
 const FOLD_KEY = "m02.dfpanel.folded";
 
@@ -94,8 +96,9 @@ export function mountFlowPanel(host: HTMLElement, opts: FlowPanelOpts): FlowPane
     readOnly: opts.readOnly,
     onChange: opts.onChange,
     logics: opts.logics,
-    // 좁은 패널은 「한눈에」 가 되게 더 작게 · 크게 보기는 글이 읽히게 90% 아래로 안 내림
+    // 패널 처음 배율 = 글이 읽히는 최소(넘치면 왼쪽 위 입력 상자부터) · 「한눈에」 단추는 전체 · 크게 보기는 90%
     fitMin: () => (full ? 0.9 : PANEL_FIT_MIN),
+    fitAllMin: () => (full ? 0.9 : PANEL_FIT_ALL_MIN),
   });
   const { diagram, detail, summary, note, undo } = paper.parts;
   let width = storedWidth(readStore(WIDTH_KEY));

M02_MasterTemplete/DataFlow/M02_DF_Paper.ts

@@ -55,6 +55,8 @@ export interface PaperOpts {
   logics?(key: string): Promise<CfLogic | null>;
   /** 저절로 맞출 때 가장 작은 확대 — 부를 때마다 물음(패널 · 크게 보기가 다름) */
   fitMin?(): number;
+  /** 「한눈에」 단추의 가장 작은 확대 — 없으면 fitMin */
+  fitAllMin?(): number;
 }
 
 export interface Paper {
@@ -307,6 +309,7 @@ export function createPaper(opts: PaperOpts): Paper {
       readOnly,
       fitKey,
       fitMin: opts.fitMin?.(),
+      fitAllMin: opts.fitAllMin?.(),
     });
     drawPanel();
     renderSummary(summaryHost, lg, result, { change: editExample, select: choose }, { values });

resources/tester/test_m02_df_diagram_parts.py

@@ -43,7 +43,7 @@ const out = jobs.map((job) => {
   if (job.op === "deps") return m.depLines(job.lg).map((d) => ({ id: d.id, from: d.from, to: d.to }));
   if (job.op === "inTrace") return m.depLines(job.lg).map((d) => m.depInTrace(d, job.steps));
   if (job.op === "rest") return job.breaks.map((b) => m.isRest(b));
-  if (job.op === "fit") return m.fitView(job.rects, job.view);
+  if (job.op === "fit") return m.fitView(job.rects, job.view, 40, job.min);
   if (job.op === "value") return job.values.map((v) => m.showValue(v));
   if (job.op === "end") return m.depEnd(job.a, job.tag);
   if (job.op === "restParts") {
@@ -404,3 +404,18 @@ def test_지반_토사_쉼_흐림은_브레이커로_깨기_하나():
     assert got["boxes"] == ["brk"]
     assert got["links"] == ["l2", "l6"]
     assert got["pills"] == ["brk|굴착량", "sum|브레이커 경비"]
+
+
+def test_패널_처음_배율은_읽히는_최소_넘치면_왼쪽_위부터():
+    rects = [{"x": 40, "y": 40, "w": 200, "h": 120}, {"x": 1500, "y": 600, "w": 200, "h": 120}]
+    auto, whole = run(
+        [
+            {"op": "fit", "rects": rects, "view": {"w": 500, "h": 400}, "min": 0.6},
+            {"op": "fit", "rects": rects, "view": {"w": 500, "h": 400}, "min": 0.25},
+        ]
+    )
+    # 처음 — 0.6 아래로 안 내림 · 넘치면 왼쪽 위(첫 상자 - 여백)가 판 왼쪽 위
+    assert auto["zoom"] == 0.6
+    assert auto["panX"] == 0 and auto["panY"] == 0
+    # 한눈에 — 전체가 들어가게 더 작게
+    assert whole["zoom"] < 0.6