/* 알약 막대 시험 틀 — 진짜 부품(createSpreadsheet)에 `links` 선택 · 가짜 입력값 · 가짜 자재 목록(호스트 항목 + 자재찾기).
 * Vite 개발 서버가 바로 풂: /resources/tester/spreadsheet/harness_links.html?mode=입력|자재
 * window.ss = 부품 손잡이(getDoc · getLinkedValues) · window.ssFind = 자재찾기 부른 글 목록 */
import "../../../ui_template/ui_template_theme.css"; // 앱 색 · 간격 토큰
import { createSpreadsheet } from "../../../A00_Common/spreadsheet/spreadsheet";
import type { LinkMaterial, Workbook } from "../../../A00_Common/spreadsheet/spreadsheet";

const w = window as unknown as Record<string, unknown>;
const mode = new URLSearchParams(location.search).get("mode") === "자재" ? "자재" : "입력";

const book: Workbook = {
  종류: "통합문서",
  판: 1,
  열: "harness",
  서식: [{}],
  시트: [
    {
      id: "s1",
      이름: "면적산출",
      칸: {
        A1: { 값: "길이" },
        B1: { 값: 12.5 },
        A2: { 값: "높이" },
        B2: { 값: 3 },
        A3: { 값: "면적" },
        B3: { 식: "B1*B2" },
      },
    },
  ],
  활성: "s1",
};

const MATERIALS: LinkMaterial[] = [
  { 코드: "M001", 이름: "레미콘", 규격: "25-21-12", 단위: "m³" },
  { 코드: "M002", 이름: "철근", 규격: "SD400 D13", 단위: "ton" },
  { 코드: "M003", 이름: "거푸집", 규격: "합판 3회", 단위: "m²" },
];
const asked: string[] = [];
w.ssFind = asked;
w.ssItems = [] as unknown[]; // onItemsChange 로 받은 목록들(부른 순서)
// 자재 모드 — 호스트가 주는 처음 목록(자재 정보 포함): 레미콘 하나
const hostItems = MATERIALS.slice(0, 1).map((m) => ({
  키: m.코드,
  이름: `${m.이름} ${m.규격}`,
  단위: m.단위,
  자재: m,
}));

w.ss = createSpreadsheet(document.getElementById("host")!, book, {
  tabs: false,
  onChange: () => (w.ssChanges = ((w.ssChanges as number) ?? 0) + 1),
  links: {
    모드: mode,
    항목:
      mode === "자재"
        ? hostItems
        : [
            { 키: "L", 이름: "길이", 단위: "m" },
            { 키: "H", 이름: "높이", 단위: "m" },
            { 키: "A", 이름: "면적", 단위: "m²" },
          ],
    onItemsChange: (목록) => (w.ssItems as unknown[]).push(목록),
    자재찾기: async (글) => {
      asked.push(글);
      await new Promise((r) => setTimeout(r, 50));
      return MATERIALS.filter((m) => !글 || `${m.코드}${m.이름}${m.규격}`.includes(글));
    },
  },
});