/* =============================================================================
 * B05_Profile_UI_Panel_Sections.ts
 * 종단 보기 좌측 패널의 **칸 정의**(등록부 `registerPanelSection`) — 페이지 설정 · 계획노선 ·
 * 선택 포인트 상세. 「구조물 배치」는 두 보기 공용이라 `design_sections.ts` 에 있다.
 *
 * 칸 차례(2026-08-18 사용자 확정): 구조물 배치 > 페이지 설정 > 계획노선
 * > 선택 포인트(평소 숨김) > 아래 고정 영역. 「경로 계산 설정」은 `Old/` 로 옮김(54-24). 재료는 `_Panel_Settings` · `_Panel_Route` 가 만들어
 * `ctx.parts` 로 건넨다.
 * ========================================================================== */

import "../A00_Common/design/design_sections";
import { createSectionFrame, part, registerPanelSection } from "../A00_Common/design/design_panel";
import type { RoutePart } from "./B05_Profile_UI_Panel_Route";
import type { SettingsPart } from "./B05_Profile_UI_Panel_Settings";

registerPanelSection({
  id: "page-settings",
  title: "페이지 설정",
  views: ["profile"],
  order: 20,
  build: (ctx, view) => {
    const frame = createSectionFrame(view, "페이지 설정", true);
    frame.body.append(...part<SettingsPart>(ctx, "settings").nodes);
    return frame.root;
  },
});

registerPanelSection({
  id: "planned-route",
  title: "계획노선",
  views: ["profile"],
  order: 30,
  build: (ctx, view) => {
    const frame = createSectionFrame(view, "계획노선");
    frame.body.append(part<RoutePart>(ctx, "route").plannedRouteButton);
    return frame.root;
  },
});

registerPanelSection({
  id: "selected-point",
  title: "선택 포인트 상세 설정",
  views: ["profile"],
  order: 50,
  build: (ctx, view) => {
    const frame = createSectionFrame(view, "선택 포인트 상세 설정");
    const route = part<RoutePart>(ctx, "route");
    frame.body.append(...route.selectedNodes);
    route.bindSelectedRoot(frame.root);
    return frame.root;
  },
});