feat(717-2a): M02 왼쪽 맨 위 「단가산출」 칸 — 층 단추 따로(기본 개인) · 폴더 나무 · 목록표 · 상세 자리 · 대시보드 줄

- 새 UI_Side_Sangeun.ts — 서고 칸(716-4) kind sangeun · 목록표 고름 sangeunList
- 새 Sangeun_View.ts — 이름 · 단위 · 바탕 · 덮개 · 더한 줄 · 뺀 줄 · 열린 입력 요약 + 상세 자리표(717-2b 가 갈음)
- UI_Main 종류 sangeun 갈래 · 목록표 조건에 sangeun · Library_List 열 표(단가산출 = 바탕 · 고친 줄 · 쓰는 곳) · sangeunBlank(단위 식 · 바탕 없음)
- UI_Page 단가산출 층 상태 sk · UI_Side 맨 위 칸 · reveal 「단가산출」 · Layer open 「단가산출」 · Api Kind sangeun
- m_settings_nav 대시보드 마스터 템플릿 묶음 「단가산출」 줄(?open=단가산출) · locale_m2 키
- 낡은 글 대조 시험 넷 고침(197_1 · b01_settings_cards · m02_layer_screen · m02_precombo_scope) — 대시보드 줄 하나 늘고 OPENS · reveal · 목록 열 표 · 칸 차례가 바뀜

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

M02_MasterTemplete/M02_MasterTemplete_UI_Side.ts

@@ -1,8 +1,8 @@
 /* =============================================================================
  * M02_MasterTemplete_UI_Side.ts
- * 마스터 템플릿 좌측 패널 차례(716-3) — 「일위대가」(층 단추 따로 · 2단 폴더 나무 · `UI_Side_Precombo` ·
+ * 마스터 템플릿 좌측 패널 차례(716-3 · 717-2a) — 「단가산출」(층 단추 따로 · 기본 개인 · `UI_Side_Sangeun`) › 「일위대가」(층 단추 따로 · 2단 폴더 나무 · `UI_Side_Precombo` ·
  * 50-3 · 134-3) › 「구조물 조합」(층 단추 · 나무) › 수평 구분선 › 「일위대가 불러오기」(구조물 조합 층 ·
- * `Hopyo_Side` · 324-4) › 「도면 양식」(새로 · 본떠 · 지우기) › 실무문서. 「단가산출」 칸은 맨 위(717-2a).
+ * `Hopyo_Side` · 324-4) › 「도면 양식」(새로 · 본떠 · 지우기) › 실무문서.
  * 구조물 옵션 정의는 M01 로 옮김(716-1).
  * 서버 길은 계약 `6_계약.md`.
  * 구조물 도면 · 일위대가 · 면적산출 상세는 좌측 줄이 아니라 항목 카드 [수정]으로(PLAN 45-2).
@@ -36,6 +36,7 @@ import { HOPYO_BUILT } from "./M02_MasterTemplete_Hopyo_Check";
 import { buildHopyoSection } from "./M02_MasterTemplete_Hopyo_Side";
 import { canEdit, type Selection } from "./M02_MasterTemplete_UI_Main";
 import { buildPrecomboSection, type PrecomboOptions } from "./M02_MasterTemplete_UI_Side_Precombo";
+import { buildSangeunSection, type SangeunOptions } from "./M02_MasterTemplete_UI_Side_Sangeun";
 import { createEmpty } from "@ui/ui_template_empty";
 import { createDivider } from "@ui/ui_template_divider";
 
@@ -67,6 +68,8 @@ export interface SideOptions {
   tree?: HTMLElement[];
   /** 「일위대가」 층(134-3 · 페이지 층과 따로 · 층 단추는 페이지가 만듦) */
   precombo: Pick<PrecomboOptions, "scope" | "bar" | "more">;
+  /** 「단가산출」 층(717-2a · 일위대가 층과 따로 · 층 단추는 페이지가 만듦) */
+  sangeun: Pick<SangeunOptions, "scope" | "bar">;
 }
 
 export interface SideHandle {
@@ -75,9 +78,11 @@ export interface SideHandle {
   /** 고름 표시를 지금 열린 것 한 줄로 — 편집 칸이 무엇을 열든(카드 [도면 수정] 등) 부름 */
   paint: () => void;
   /** 진입 해시 `open`(PLAN 27-1d) — 그 컨테이너를 펼침 · 도면은 시스템 층에만 · 옵션은 M01 로 옮겨 아무 일 없음 */
-  reveal: (target: "옵션" | "도면" | "일위대가조합") => void;
+  reveal: (target: "옵션" | "도면" | "일위대가조합" | "단가산출") => void;
   /** 사전조합 층이 바뀜(134-3) — 그 컨테이너만 다시 그림 */
   refreshPrecombo: () => Promise<void>;
+  /** 단가산출 층이 바뀜(717-2a) — 그 컨테이너만 다시 그림 */
+  refreshSangeun: () => Promise<void>;
 }
 
 /** 서버 이름 규칙과 같게 — 화면에서 먼저 막음 */
@@ -133,7 +138,7 @@ export function buildSide(opt: SideOptions): SideHandle {
   openOnExpand(summary, async () => {
     if (!isPicked("table", STRUCTURE_TABLE) && (await opt.confirmLeave())) opt.onOpen(null);
   });
-  // 일위대가 서고(50-3 · 134-3) — 맨 위 칸 · 층은 페이지 층과 따로
+  // 일위대가 서고(50-3 · 134-3) — 단가산출 다음 칸 · 층은 페이지 층과 따로
   const precombo = buildPrecomboSection({
     ...opt.precombo,
     confirmLeave: opt.confirmLeave,
@@ -141,10 +146,18 @@ export function buildSide(opt: SideOptions): SideHandle {
     getOpen: opt.getOpen,
   });
   const precomboSec = section(L("M02_PrecomboTitle"), precombo.body);
+  // 단가산출 서고(717-2a) — 맨 위 칸 · 층은 일위대가 층과 따로
+  const sangeun = buildSangeunSection({
+    ...opt.sangeun,
+    confirmLeave: opt.confirmLeave,
+    onOpen: opt.onOpen,
+    getOpen: opt.getOpen,
+  });
+  const sangeunSec = section(L("M02_SangeunTitle"), sangeun.body);
   // 실무자료로 일위대가를 만들었음(확인 창 · 엑셀 보기 창) → 목록 다시 · 이 패널이 내려갔으면 듣기 끝
   const onBuilt = (): void =>
     precombo.body.isConnected
-      ? void precombo.refresh()
+      ? void Promise.all([precombo.refresh(), sangeun.refresh()])
       : document.removeEventListener(HOPYO_BUILT, onBuilt);
   document.addEventListener(HOPYO_BUILT, onBuilt);
   // 도면 양식은 시스템 층(마스터 템플릿)에만
@@ -171,6 +184,7 @@ export function buildSide(opt: SideOptions): SideHandle {
   const listHost = el("div", {
     className: "m02-side__lists ui-sidebar-panel",
     children: [
+      sangeunSec,
       precomboSec,
       summary,
       createDivider(),
@@ -229,6 +243,7 @@ export function buildSide(opt: SideOptions): SideHandle {
    * (양식이 열려 있으면 실무문서 고름은 지움) */
   function paint(): void {
     paintList();
+    sangeun.paint();
     precombo.paint();
     hopyo.paint();
     paintButtons();
@@ -253,7 +268,7 @@ export function buildSide(opt: SideOptions): SideHandle {
     if (mine !== seq) return;
     paintList();
     paintButtons();
-    await precombo.refresh();
+    await Promise.all([precombo.refresh(), sangeun.refresh()]);
   }
 
   /* --- 시스템 층 새로 · 본떠 · 지우기(도면 양식만 — 구조물 도면은 집계표 열이 정함) --- */
@@ -333,11 +348,25 @@ export function buildSide(opt: SideOptions): SideHandle {
     }
   }
 
-  const reveal = (target: "옵션" | "도면" | "일위대가조합"): void => {
-    const sec = target === "일위대가조합" ? precomboSec : target === "도면" ? drawing : null;
+  const reveal = (target: "옵션" | "도면" | "일위대가조합" | "단가산출"): void => {
+    const sec =
+      target === "단가산출"
+        ? sangeunSec
+        : target === "일위대가조합"
+          ? precomboSec
+          : target === "도면"
+            ? drawing
+            : null;
     sec?.classList.remove("is-collapsed");
   };
 
   void refresh();
-  return { root, refresh, paint, reveal, refreshPrecombo: precombo.refresh };
+  return {
+    root,
+    refresh,
+    paint,
+    reveal,
+    refreshPrecombo: precombo.refresh,
+    refreshSangeun: sangeun.refresh,
+  };
 }