);
}
/* diff 배지 */
function Delta({ now, prev, unit }) {
if (prev === undefined || prev === null) return NEW;
// 시간 델타는 0.1h 단위로 떨어진다 — 부동소수점 잔차(15.199999999999996)를 화면에 흘리지 않는다.
const d = Math.round((now - prev) * 10) / 10;
if (d === 0) return —;
const up = d > 0;
return {up ? "▲" : "▼"} {Math.abs(d)}{unit || ""};
}
/* 모달 */
/* 모달 — Esc 닫기 + 초기 포커스 + 포커스 트랩 (E8).
트랩이 없으면 Tab이 모달 밖 배경 컨트롤로 새어 나가 키보드 사용자가 길을 잃는다. */
const FOCUSABLE = 'a[href],button:not([disabled]),textarea:not([disabled]),input:not([disabled]),select:not([disabled]),[tabindex]:not([tabindex="-1"])';
function Modal({ title, children, onClose, footer, width }) {
const boxRef = useRef(null);
const titleId = useRef("mt-" + Math.random().toString(36).slice(2, 7)).current;
useEffect(() => {
const prev = document.activeElement;
const box = boxRef.current;
const items = () => Array.from(box ? box.querySelectorAll(FOCUSABLE) : []).filter((el) => el.offsetParent !== null);
const first = items()[0];
(first || box).focus({ preventScroll: true });
const h = (e) => {
if (e.key === "Escape") return onClose();
if (e.key !== "Tab") return;
const list = items(); if (!list.length) return;
const a = list[0], z = list[list.length - 1];
if (e.shiftKey && document.activeElement === a) { e.preventDefault(); z.focus(); }
else if (!e.shiftKey && document.activeElement === z) { e.preventDefault(); a.focus(); }
else if (box && !box.contains(document.activeElement)) { e.preventDefault(); a.focus(); }
};
window.addEventListener("keydown", h);
return () => { window.removeEventListener("keydown", h); if (prev && prev.focus) prev.focus({ preventScroll: true }); };
}, []);
return (
e.stopPropagation()}>
{title}
{children}
{footer &&
{footer}
}
);
}
/* 게이트 안내 (W3-2) — "왜 지금은 못 쓰는지 + 다음에 뭘 하면 되는지".
화면을 통째로 흐리게만 하면 사용자는 고장으로 읽는다(E2). */
function GateNotice({ icon, title, body, actionLabel, onAction, tone }) {
const c = tone === "ok" ? "ok" : "accent";
return (
{title}
{body}
{onAction && }
);
}
/* 카드 헤더 */
function CardHead({ icon, title, sub, right }) {
return (
{icon && }
{title}
{sub && {sub}}
{right &&
{right}
}
);
}
/* 빈 상태 */
function Empty({ icon, title, desc }) {
return (
{title}
{desc &&
{desc}
}
);
}
/* ── §01 검수 findings (자동 점검 신호) ─────────────────── */
const SEV = {
error: { dot: "var(--danger)", soft: "var(--danger-soft)", line: "var(--danger-line)", ink: "var(--danger)", icon: "error", label: "확정 전 확인 필요" },
warn: { dot: "var(--warn)", soft: "var(--warn-soft)", line: "var(--warn-line)", ink: "color-mix(in oklab, var(--warn) 72%, black)", icon: "warning", label: "확인 권장" },
info: { dot: "var(--ink-4)", soft: "var(--bg-sunken)", line: "var(--line-2)", ink: "var(--ink-3)", icon: "info", label: "참고" },
};
const SEV_RANK = { error: 3, warn: 2, info: 1 };
function topSeverity(items) {
let s = null, r = 0;
(items || []).forEach((f) => { if (SEV_RANK[f.severity] > r) { r = SEV_RANK[f.severity]; s = f.severity; } });
return s;
}
/* 리스크 카운트 배지 (대시보드 카드·검수 요약) */
function RiskBadge({ errors, warns, infos, size }) {
const e = errors || 0, w = warns || 0, n = infos || 0;
const h = size === "sm" ? 18 : 20;
if (!e && !w && !n) return 이상 없음;
const chip = (count, sev) => count > 0 && (
{count}
);
return {chip(e, "error")}{chip(w, "warn")}{chip(n, "info")};
}
/* 근로자 행 옆 신호 점 */
function FindingDot({ items }) {
const sev = topSeverity(items);
if (!sev) return null;
const n = (items || []).length;
return (
"· " + f.message).join("\n")} style={{ display: "inline-flex", alignItems: "center", gap: 3, marginLeft: 6, verticalAlign: "middle" }}>
{n > 1 && {n}}
);
}
/* findings 항목 (검수 화면 패널) */
function FindingItem({ f, onDismiss, canDismiss }) {
const s = SEV[f.severity] || SEV.info;
return (
{f.empName && {f.empName}}
{f.message}{f.code}
{f.hint &&
{f.hint}
}
{canDismiss && f.empId && (
)}
);
}
Object.assign(window, {
Ms, KRW, STATUS_META, StatusPill, ClientAvatar, SchemeTag, SCHEME_META, schemeStyle,
Stepper, Timeline, Board, Delta, Modal, CardHead, Empty,
SEV, topSeverity, RiskBadge, FindingDot, FindingItem,
useState, useEffect, useRef, useMemo,
});
/* 인쇄용 문서 창 — 브라우저 기본 "PDF로 저장"을 그대로 쓴다(F4).
PDF 라이브러리를 얹지 않는 이유: 증명서 1종을 위해 400KB를 로드할 이유가 없다.
ponytail: 서명·직인 이미지가 필요해지면 그때 라이브러리를 검토한다. */
function printDocument(title, bodyHtml) {
const w = window.open("", "_blank", "width=760,height=900");
if (!w) return false;
w.document.write(`${title}
${bodyHtml}`);
w.document.close();
w.focus();
setTimeout(() => w.print(), 250);
return true;
}
window.printDocument = printDocument;