Merge origin/sub_laptop_6 into sub_laptop_7 — _Drainage_Side 충돌은 sub6 의 DesignSideFactory 모양에 맞추고 켜고 끄기를 살림

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

B05_Profile/B05_Profile_UI_Drainage_Side.ts

@@ -1,48 +1,47 @@
 /* =============================================================================
  * B05_Profile_UI_Drainage_Side.ts
- * 배수유역도를 종단도의 **side 판**으로 끼우는 홀로 선 창구(계획서 24-2e).
+ * 배수유역도를 종단도 오른쪽 판(`side`)으로 끼우는 홀로 선 함수(계획서 24-2c · 24-2e).
+ * 판 자리 약속은 `A00_Common/design/design_profile.ts` 의 `DesignSideFactory` 다 —
+ * `createDrainageSide` 가 그 모양 그대로다(`(host) => 판`).
  *
- * 판(`createDrainagePanel`)은 종단 패널을 모른다 — 종단쪽 일은 전부 `DrainageSideHost`
- * (= `DrainagePanelCallbacks`, `_Panel_Types` 약속)로 받고, 종단쪽에서 들어오는 일은
- * `panel` 의 창구(`setRoute` · `setIntervalSpans` · `pipeChainages` · `setPipeChainages` ·
+ * 판(`createDrainagePanel`)은 종단 패널을 모른다 — 종단쪽 일은 전부 `host`
+ * (`DrainagePanelCallbacks` + projectId · view, `_Panel_Types` 약속)로 받고, 종단쪽에서 들어오는 일은
+ * 판의 창구(`setRoute` · `setIntervalSpans` · `pipeChainages` · `setPipeChainages` ·
  * `selectPipeAtChainage` …)로만 한다.
  *   · 관 목록이 바뀜(최소 흙덮기 경고 · 구조물 라인 · 통합 목록) = `host.onPipesChanged`
- *   · 관 자리 읽기 · 쓰기(되돌리기) = `panel.pipeChainages()` · `panel.setPipeChainages()`
+ *   · 관 자리 읽기 · 쓰기(되돌리기) = `pipeChainages()` · `setPipeChainages()`
  *   · 우클릭 메뉴의 구조물 종류 = `host.structureMenuItems`
- *   · 구간 띠 · 노선 = `panel.setIntervalSpans()` · `panel.setRoute()`
+ *   · 구간 띠 · 노선 = `setIntervalSpans()` · `setRoute()`
  * 두 보기(종단 · 횡단)에서 같은 판을 끼우고 **켜고 끈다** — 끄면 자리를 비우되 관 · 유역
  * 상태는 그대로 살아 있다(다시 켜면 이어서 보임). 켬 · 끔을 어디에 적을지는 끼우는 쪽 몫이다.
  * ========================================================================== */
 
 import "./B05_Profile_UI_Style_Drainage.css"; // 홀로 서려면 판이 자기 모양을 들고 온다.
+import type { DesignSideBoard, DesignSideHost } from "../A00_Common/design/design_profile";
 import { createDrainagePanel } from "./B05_Profile_UI_Drainage_Panel";
-import type { DrainagePanel, DrainagePanelCallbacks } from "./B05_Profile_UI_Drainage_Panel_Types";
 
-/** 종단쪽이 넘기는 이음 — 판 바깥 약속(`DrainagePanelCallbacks`) 그대로. */
-export type DrainageSideHost = DrainagePanelCallbacks;
+/** 종단쪽이 넘기는 이음 — 판 바깥 약속(`DrainagePanelCallbacks`)에 projectId · view 를 더한 것. */
+export type DrainageSideHost = DesignSideHost;
 
-export interface DrainageSide {
-  /** 종단도 side 자리에 붙일 뿌리. */
-  root: HTMLElement;
-  /** 판의 창구 — 종단쪽이 노선 · 구간 띠 · 관 자리 · 선택을 밀어 넣는다. */
-  panel: DrainagePanel;
+/** 종단도 side 판 = 배수유역 판 창구 그대로 + 켜고 끔. */
+export type DrainageSideBoard = DesignSideBoard & {
   /** 켜고 끈다. 켜면 숨겼던 사이 바뀐 크기 · 그림을 판이 스스로 다시 맞춘다. */
   setVisible: (visible: boolean) => void;
   isVisible: () => boolean;
   /** 켬 · 끔이 바뀔 때마다 부른다(단추 표시 · 저장). 해제 함수를 돌려준다. */
   onVisibleChange: (listener: (visible: boolean) => void) => () => void;
-  dispose: () => void;
-}
+};
 
 export interface DrainageSideOptions {
   /** 처음 켤지(기본 켬). */
   visible?: boolean;
 }
 
+/** `DesignSideFactory` — 종단도를 만들 때 한 번 부른다. */
 export function createDrainageSide(
-  host: DrainageSideHost = {},
+  host: DrainageSideHost,
   options: DrainageSideOptions = {},
-): DrainageSide {
+): DrainageSideBoard {
   const panel = createDrainagePanel(host);
   const listeners = new Set<(visible: boolean) => void>();
   let visible = true;
@@ -60,8 +59,9 @@ export function createDrainageSide(
   }
 
   return {
-    root: panel.root,
-    panel,
+    ...panel,
+    // 보기가 바뀌어도 판은 다시 안 만든다 — 켬 · 끔은 끼우는 쪽이 `setVisible` 로 정한다.
+    setView: () => {},
     setVisible,
     isVisible: () => visible,
     onVisibleChange(listener) {
@@ -75,8 +75,8 @@ export function createDrainageSide(
   };
 }
 
-/** 켜고 끄는 단추 — 어느 보기에서든 같은 모양 · 같은 글. 누르면 `side` 를 뒤집는다. */
-export function createDrainageToggleButton(side: DrainageSide): HTMLButtonElement {
+/** 켜고 끄는 단추 — 어느 보기에서든 같은 모양 · 같은 글. 누르면 판을 뒤집는다. */
+export function createDrainageToggleButton(side: DrainageSideBoard): HTMLButtonElement {
   const button = document.createElement("button");
   button.type = "button";
   button.className = "ui-btn ui-btn--ghost b05-drainage__toggle";

resources/tester/test_b05_drainage_side.py

@@ -53,6 +53,9 @@ def test_켜고_끄는_창구():
     ):
         assert name in side
     assert "root.hidden" in side or "panel.root.hidden" in side
+    # 종단도 판 자리 약속(`DesignSideFactory` · design_profile.ts) 모양 그대로
+    assert "DesignSideBoard" in side and "DesignSideHost" in side
+    assert "export function createDrainageSide(" in side
     types = (B05 / "B05_Profile_UI_Drainage_Panel_Types.ts").read_text(encoding="utf-8")
     assert "export interface DrainagePipeReport" in types
     assert "onPipesChanged?: (pipes: DrainagePipeReport[]) => void;" in types