/* =============================================================================
 * B03_FileInput_UI_Guide.ts
 * 파일 입력 좌측 안내 패널 (2026-09-03 사용자 지시).
 *
 * 종전에는 고르는 방법·필요한 파일 목록이 **선택 영역과 카드 안에** 길게 들어가 있어
 * 카드 한 장이 220px씩 차지했다. 안내는 한 번 읽으면 되는 것이라 다른 단계(B04·B05)와
 * 같은 자리 — 공용 오버레이의 좌측 패널(`createWorkflowOverlays.optionsContent`) — 로
 * 옮기고, 본문은 고르는 자리만 남긴다.
 *
 * 문단 구획은 공용 `ui-sidebar-section`을 쓴다(B04·B05 좌측 패널과 같은 테두리·간격).
 * ========================================================================== */

import { ui_locales, currentLanguageIndex } from "@ui/ui_template_locale";

function L(key: keyof typeof ui_locales): string {
  return ui_locales[key][currentLanguageIndex];
}

/** 안내 문단 하나 — 제목 + 항목 목록. */
function section(
  titleKey: keyof typeof ui_locales,
  itemKeys: (keyof typeof ui_locales)[],
): HTMLElement {
  const group = document.createElement("section");
  group.className = "ui-sidebar-section b03-file__guide-group";

  const title = document.createElement("h3");
  title.className = "b03-file__guide-title";
  title.textContent = L(titleKey);

  const list = document.createElement("ul");
  list.className = "b03-file__guide-list";
  for (const key of itemKeys) {
    const item = document.createElement("li");
    item.textContent = L(key);
    list.append(item);
  }

  group.append(title, list);
  return group;
}

/** 좌측 패널 본문 — 필요한 파일 · 고르는 방법 · 알아 둘 것. */
export function createInputGuide(): HTMLElement {
  const guide = document.createElement("div");
  guide.className = "b03-file__guide";
  guide.append(
    section("B03_Guide_Files_Title", [
      "B03_Guide_Files_Route",
      "B03_Guide_Files_Terrain",
      "B03_Guide_Files_Optional",
    ]),
    section("B03_Guide_How_Title", [
      "B03_Guide_How_Drop",
      "B03_Guide_How_Card",
      "B03_Guide_How_Temp",
    ]),
    section("B03_Guide_Notes_Title", [
      "B03_Guide_Notes_Replace",
      "B03_Guide_Notes_Crs",
      "B03_Guide_Notes_LasFree",
    ]),
  );
  return guide;
}