Merge remote-tracking branch 'origin/sub_laptop_5' into main_laptop_1

ui_template/ui_template_modal.css

@@ -100,6 +100,15 @@
   font-weight: 700;
   color: var(--color-text);
 }
+/* 확인창 덧 내용(표 · `detail`) — 넓은 판 · 넘치면 안에서 스크롤 */
+.ui-confirm__panel.ui-confirm__panel--wide {
+  max-width: min(720px, 92vw);
+}
+.ui-confirm__detail {
+  max-height: 40vh;
+  overflow: auto;
+  margin-bottom: var(--spacing-16);
+}
 .ui-confirm__input {
   box-sizing: border-box;
   width: 100%;

ui_template/ui_template_modal.ts

@@ -105,6 +105,8 @@ export interface AskOptions {
   cancelLabel?: string;
   /** 위험 확인 — 확인 단추 빨강 */
   danger?: boolean;
+  /** 덧 내용(표 등) — 글 아래 · 있으면 판이 넓어지고 넘치면 안에서 스크롤 */
+  detail?: HTMLElement;
 }
 
 /** 갈래 묻기 단추 하나 — 누르면 `value` · 맨 뒤 단추가 주 단추(filled) */
@@ -126,6 +128,10 @@ export function confirmPanel(
   const panel = el("div", { className: "ui-confirm__panel", attrs: { role: "dialog" } });
   if (opts.title) panel.append(el("h3", { className: "ui-confirm__title", text: opts.title }));
   panel.append(el("p", { className: "ui-confirm__message", text: opts.message }));
+  if (opts.detail) {
+    panel.classList.add("ui-confirm__panel--wide");
+    panel.append(el("div", { className: "ui-confirm__detail", children: [opts.detail] }));
+  }
   let input: HTMLInputElement | null = null;
   if (opts.field) {
     const box = el("input", {