npm - @ihabdevteam/core - Versions diffs - 0.8.0 - Mend

@ihabdevteam/core 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (848) hide show

package/dist/packages/core/src/components/Word/wordTablePrint.js ADDED Viewed

@@ -0,0 +1,210 @@
+'use client';
+// ── 단어표 인쇄/캡처 HTML 엔진 ─────────────────────────────────────────────
+// WordTableBlock에서 분리한 순수 함수 모듈 — React와 무관한 문서 문자열 생성만 담당한다.
+// els: 페이지(용지)별 콘텐츠 엘리먼트. 2개 이상이면 각 페이지를 별도 용지로 감싸고
+// 인쇄 시 페이지마다 강제 개행(page-break)한다.
+// autoPrint: 문서 로드 후 자동으로 인쇄 대화상자를 띄운다.
+// (win.onload를 밖에서 나중에 붙이면 document.write+close가 이미 load를 발생시켜
+//  못 잡는 경우가 있어, 문서 자신의 <script> 안에서 직접 호출해 타이밍을 보장한다)
+function escapeHtml(s) {
+    return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+}
+/**
+ * 파일명(문서 title·다운로드 파일명)에 쓰이는 사용자 입력값(단어표 이름 등)에서 Windows/macOS
+ * 파일시스템에서 문제되는 문자(\ / : * ? " < > |)를 밑줄로 치환한다. 없으면 "PDF로 저장"·
+ * .html 다운로드 시 파일명이 깨지거나 저장 자체가 실패할 수 있다.
+ */
+export function sanitizeFileName(name) {
+    return name.replace(/[\\/:*?"<>|]/g, '_').trim();
+}
+/**
+ * 캡처한 콘텐츠 엘리먼트들을 화면 밖 숨김 iframe에서 인쇄한다. 전역 @media print(모든
+ * .word-table 노출)나 팝업 차단의 간섭 없이 넘긴 엘리먼트만 격리 인쇄한다. WordTableBlock의
+ * 다중 페이지 인쇄와 WordTablePopup의 단일 표 인쇄가 공용으로 쓴다.
+ * @public
+ */
+export function printWordTableElements(elements, paperW, paperH, fileName = '', header = '') {
+    if (elements.length === 0)
+        return;
+    const safeFileName = fileName ? sanitizeFileName(fileName) : '';
+    // "PDF로 저장" 기본 파일명은 iframe이 아니라 최상위 탭(document)의 title에서 온다.
+    if (safeFileName) {
+        const prevTitle = document.title;
+        document.title = safeFileName;
+        const restore = () => { document.title = prevTitle; window.removeEventListener('afterprint', restore); };
+        window.addEventListener('afterprint', restore);
+    }
+    const iframe = document.createElement('iframe');
+    iframe.style.cssText = 'position:fixed;left:-10000px;top:0;width:1200px;height:900px;border:0;';
+    document.body.appendChild(iframe);
+    const doc = iframe.contentDocument;
+    if (!doc) {
+        iframe.remove();
+        return;
+    }
+    doc.open();
+    doc.write(captureHtml(elements, paperW, paperH, true, safeFileName, header));
+    doc.close();
+    iframe.contentWindow?.addEventListener('afterprint', () => setTimeout(() => iframe.remove(), 0));
+}
+// 인쇄 시 PDF로 저장할 때 OS가 제안하는 기본 파일명은 문서 <title>에서 온다.
+export function captureHtml(els, paperW, paperH, autoPrint = false, fileName = '', header = '') {
+    fileName = fileName ? sanitizeFileName(fileName) : '';
+    const styles = Array.from(document.styleSheets).flatMap(sheet => {
+        try {
+            return Array.from(sheet.cssRules).map(r => r.cssText);
+        }
+        catch {
+            return [];
+        }
+    }).join('\n');
+    // styles.css의 다크 테마는 <html data-theme="..."> 속성으로 켜진다. 새 문서는 이 속성이
+    // 없어 "auto"로 취급되고, OS가 다크 모드면 프로그램상 라이트 테마여도 팝업만 다크로 보였다.
+    const theme = document.documentElement.getAttribute('data-theme') || 'light';
+    /* 종이 맨 위에 찍는 한 줄(누구의·언제·무슨 표). **격자만 인쇄되므로** 이것이 없으면
+       뽑아 둔 채점지가 며칠 뒤 누구 것인지 알 수 없는 종이가 된다. 쪽마다 찍는다 —
+       여러 장이 섞이면 첫 장에만 있는 이름은 소용이 없다. */
+    const headHtml = header ? `<div class="paper-head">${escapeHtml(header)}</div>` : '';
+    const wraps = els.map(el => {
+        const clone = el.cloneNode(true);
+        clone.querySelectorAll('[data-play-state="play"]').forEach(s => s.style.display = '');
+        clone.querySelectorAll('[data-play-state="pause"]').forEach(s => s.style.display = 'none');
+        /* **안 매긴 채점 단추는 아예 뺀다.**
+           숨김이 `:hover` 에 달려 있어서다. 인쇄는 화면 밖 iframe 에서 도니 마우스가 닿을
+           일이 없지만, **새 창과 내려받은 HTML 은 사람이 보는 문서다** — 거기서 칸 위로
+           마우스가 지나가면 빈 ○△✕ 셋이 불쑥 뜬다. 채점을 남긴 기록에 눌리지도 않는
+           단추가 나타나는 것은 맞지 않는다.
+           복사할 때 지우면 인쇄·새 창·내려받기가 한꺼번에 맞는다. */
+        clone.querySelectorAll('.word-table-cell__score-slot:not(.word-table-cell__score-slot--on)')
+            .forEach(s => s.remove());
+        return `<div class="paper-wrap">${headHtml}${clone.outerHTML}</div>`;
+    }).join('\n');
+    /* eslint-disable no-useless-escape -- 아래 문자열의 `<\/script>`는 실제 <script> 태그로 파싱되어 삽입되므로, 이스케이프가 없으면 바깥 <script> 태그가 조기 종료된다 */
+    return `<!DOCTYPE html>
+<html data-theme="${theme}">
+  <head>
+    <meta charset="utf-8">
+    ${fileName ? `<title>${escapeHtml(fileName)}</title>` : ''}
+    <style>${styles}</style>
+    <style>
+      * { box-sizing: border-box; }
+      html, body { margin: 0; padding: 24px 0; width: 100%; min-height: 100%; background: #f0f0f0; overflow: auto; }
+      body { display: flex; flex-direction: column; align-items: center; gap: 24px; }
+      .paper-wrap {
+        width: ${paperW}px; height: ${paperH}px;
+        padding: 57px;
+        background: #fff;
+        box-shadow: 0 4px 24px rgba(0,0,0,.14);
+        border: 1px solid #ccc;
+        flex-shrink: 0;
+        transform-origin: top center;
+      }
+      .word-table-block__card-close { display: none; }
+      /* 머리글은 격자 위에 얹힌다. 용지 안쪽 여백(57px)을 이미 .paper-wrap 이 갖고 있어
+         여기서는 아래 간격만 준다. 격자는 제 높이를 스스로 잡으므로 밀려도 잘리지 않는다. */
+      .paper-head {
+        font-size: 13px;
+        line-height: 1.4;
+        color: #444;
+        margin-bottom: 10px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .new-window-close {
+        position: fixed; top: 16px; right: 16px;
+        box-shadow: 0 2px 8px rgba(0,0,0,.12);
+      }
+      @media print {
+        /* 용지 방향을 단어표 설정과 일치시켜 인쇄 대화상자 기본값으로 반영 */
+        @page { size: A4 ${paperW > paperH ? 'landscape' : 'portrait'}; margin: 0; }
+        /* 본 문서에서 복사해온 WordTable.css의 print 규칙은 body * 를 전부 숨기고
+           .word-table 만 다시 보여주는데, 이 팝업엔 .word-table 래퍼가 없어(내용은
+           .word-table-block__content 클론) 전부 숨겨진 채 인쇄된다. 여기서 복원한다. */
+        body * { visibility: visible; }
+        html, body { background: #fff; overflow: visible; padding: 0; gap: 0; }
+        .paper-wrap {
+          box-shadow: none; border: none; transform: none !important; width: 100% !important; height: 100% !important;
+          page-break-after: always; break-after: page;
+        }
+        .paper-wrap:last-child { page-break-after: auto; break-after: auto; }
+        .word-table-cell__play-button { display: none; }
+        .new-window-close { display: none; }
+      }
+    </style>
+  </head>
+  <body>
+    ${wraps}
+    <button class="button button48 button48--dot button--variant-default button--align-center new-window-close" onclick="window.close()"><span class="button__icon button__icon--medium"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="button__icon-svg"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></span></button>
+  <script>
+    function scale() {
+      var pad = 40;
+      var sw = (window.innerWidth  - pad) / ${paperW};
+      var sh = (window.innerHeight - pad) / ${paperH};
+      var s  = Math.min(sw, sh, 1);
+      document.querySelectorAll('.paper-wrap').forEach(function(paper) {
+        paper.style.transform = 'scale(' + s + ')';
+      });
+    }
+    scale();
+    window.addEventListener('resize', scale);
+    function resetWrap(w) {
+      var pp = w.querySelector('[data-play-state="play"]');
+      var pa = w.querySelector('[data-play-state="pause"]');
+      if (pp) pp.style.display = '';
+      if (pa) pa.style.display = 'none';
+    }
+    document.querySelectorAll('.word-table-cell__play-button').forEach(function(wrap) {
+      var src = wrap.getAttribute('data-audio-src');
+      if (!src) return;
+      var playSpan  = wrap.querySelector('[data-play-state="play"]');
+      var pauseSpan = wrap.querySelector('[data-play-state="pause"]');
+      var audio = null;
+      function setPlaying(on) {
+        if (playSpan)  playSpan.style.display  = on ? 'none' : '';
+        if (pauseSpan) pauseSpan.style.display = on ? '' : 'none';
+        wrap._playing = on;
+      }
+      wrap.addEventListener('click', function() {
+        if (audio && !audio.paused) { audio.pause(); setPlaying(false); return; }
+        document.querySelectorAll('.word-table-cell__play-button').forEach(function(w) {
+          if (w !== wrap && w._audio) { w._audio.pause(); resetWrap(w); }
+        });
+        audio = new Audio(src);
+        wrap._audio = audio;
+        setPlaying(true);
+        audio.onended = function() { setPlaying(false); };
+        audio.onerror = function() { setPlaying(false); };
+        audio.play().catch(function() { setPlaying(false); });
+      });
+    });
+    ${autoPrint ? `
+    // document.write 직후 바로 window.print()를 부르면 이미지(비동기 로드)와
+    // 레이아웃이 아직 반영되기 전이라 빈 페이지로 인쇄되는 경우가 있어,
+    // 모든 <img> 로드 완료 + rAF 2틱(레이아웃/페인트 확정) 이후에 인쇄한다.
+    (function () {
+      var MAX_WAIT_MS = 3000;
+      var timedOut = false;
+      var timer = setTimeout(function () { timedOut = true; afterReady(); }, MAX_WAIT_MS);
+      var pending = Array.prototype.filter.call(document.images, function (img) { return !img.complete; });
+      var remaining = pending.length;
+      function afterReady() {
+        if (timer) { clearTimeout(timer); timer = null; }
+        requestAnimationFrame(function () {
+          requestAnimationFrame(function () { window.print(); });
+        });
+      }
+      if (remaining === 0) { afterReady(); return; }
+      pending.forEach(function (img) {
+        function done() { if (timedOut) return; remaining--; if (remaining <= 0) afterReady(); }
+        img.addEventListener('load', done, { once: true });
+        img.addEventListener('error', done, { once: true });
+      });
+    })();
+    ` : ''}
+  <\/script>
+  </body>
+</html>`;
+    /* eslint-enable no-useless-escape */
+}

package/dist/packages/core/src/components/Word/wordTableRecommend.d.ts ADDED Viewed

@@ -0,0 +1,67 @@
+/**
+ * **다음에 쓸 표를 고른다.**
+ *
+ * 고객마다 약한 낱말은 이미 쌓여 있다(`wordScoreStats`). 치료사가 다음에 하는 일은
+ * "그럼 어느 표로 하지?" 인데, 표가 수십 개면 그걸 눈으로 맞춰 보는 일이 다시 숙제가 된다.
+ * 가진 표들을 약한 낱말과 대 보고 잘 맞는 것부터 내놓는다.
+ *
+ * 화면도 통신도 없다. 표 목록과 약한 낱말만 받아 순서를 매긴다.
+ */
+/** 고를 수 있는 표 하나 — 칸마다의 낱말만 알면 된다. */
+export interface TableCandidate {
+    id: string;
+    name: string;
+    kind?: 'pair' | 'single';
+    /** 칸 순서대로의 낱말. 대립쌍은 `가구 / 마구` 처럼 한 줄로 합친 것 */
+    cellLabels: readonly string[];
+}
+export interface Recommendation {
+    id: string;
+    name: string;
+    kind?: 'pair' | 'single';
+    /** 이 표가 품고 있는 약한 낱말들(원래 차례대로) */
+    covered: string[];
+    /** 표 전체 칸 수 — 나머지는 이미 잡힌 것이거나 안 해 본 것이다 */
+    totalCells: number;
+}
+/**
+ * 약한 낱말을 많이 품은 표부터 내놓는다.
+ *
+ * 순서는 세 겹이다.
+ *
+ *  1. **품은 개수가 많은 것** — 한 시간에 더 많이 다룰 수 있다.
+ *  2. 같으면 **칸이 적은 것.** 같은 넷을 다루는 데 8칸짜리와 40칸짜리가 있으면 8칸이 낫다 —
+ *     나머지 36칸은 이미 잡힌 낱말을 다시 물어보는 시간이다.
+ *  3. 그래도 같으면 이름순. 안 그러면 새로 고칠 때마다 차례가 흔들려 보고 있던 줄을 놓친다.
+ *
+ * **하나도 안 품은 표는 아예 안 내놓는다.** 목록을 채우려고 상관없는 표를 끼워 넣으면,
+ * 위에서 서너 개만 보고 고르는 사람에게 "이게 추천된 것" 이라는 잘못된 신호가 된다.
+ */
+export declare function recommendTables(tables: readonly TableCandidate[], weakLabels: readonly string[], limit?: number): Recommendation[];
+/**
+ * 추천할 표가 없을 때 **새로 만들 낱말들.**
+ *
+ * 가진 표 어디에도 그 낱말이 없으면 고를 표가 없다. 그때는 약한 낱말만 모아 새 표를
+ * 만드는 편이 낫다 — 이미 있는 표에서 억지로 고르면 상관없는 칸이 대부분인 시간이 된다.
+ *
+ * **추천이 이미 충분하면 만들지 않는다.** 표가 자꾸 늘면 목록이 지저분해지고, 다음에
+ * 고를 때 또 헷갈린다.
+ */
+export declare function uncoveredLabels(recommendations: readonly Recommendation[], weakLabels: readonly string[]): string[];
+/**
+ * 새 표에 담을 **칸**을 가진 표들에서 찾아온다.
+ *
+ * 낱말만 알아서는 표를 못 만든다. 칸 하나에는 이미지·표준 발음·동형어 번호까지 붙어 있고,
+ * 그것 없이 글자만 넣으면 **쓸 수 있는 표가 안 된다**(그림을 보고 고르는 과제인데 그림이 없다).
+ * 그래서 같은 낱말을 담은 칸을 통째로 가져온다.
+ *
+ * 낱말 하나에 **처음 만난 칸 하나만** 가져온다 — 같은 대립쌍이 여러 표에 있으면
+ * 그만큼 중복해서 담기고, 새 표에 같은 칸이 여러 번 들어간다.
+ *
+ * `labels` 의 차례를 지킨다. 부르는 쪽이 이미 약한 순서로 정렬해 넘기므로,
+ * 표를 훑은 차례로 담으면 그 순서가 흐트러진다.
+ */
+export declare function cellsForLabels<C>(tables: readonly {
+    cells: readonly C[];
+    labelOf: (cell: C) => string;
+}[], labels: readonly string[]): C[];

package/dist/packages/core/src/components/Word/wordTableRecommend.js ADDED Viewed

@@ -0,0 +1,91 @@
+/**
+ * **다음에 쓸 표를 고른다.**
+ *
+ * 고객마다 약한 낱말은 이미 쌓여 있다(`wordScoreStats`). 치료사가 다음에 하는 일은
+ * "그럼 어느 표로 하지?" 인데, 표가 수십 개면 그걸 눈으로 맞춰 보는 일이 다시 숙제가 된다.
+ * 가진 표들을 약한 낱말과 대 보고 잘 맞는 것부터 내놓는다.
+ *
+ * 화면도 통신도 없다. 표 목록과 약한 낱말만 받아 순서를 매긴다.
+ */
+/**
+ * 약한 낱말을 많이 품은 표부터 내놓는다.
+ *
+ * 순서는 세 겹이다.
+ *
+ *  1. **품은 개수가 많은 것** — 한 시간에 더 많이 다룰 수 있다.
+ *  2. 같으면 **칸이 적은 것.** 같은 넷을 다루는 데 8칸짜리와 40칸짜리가 있으면 8칸이 낫다 —
+ *     나머지 36칸은 이미 잡힌 낱말을 다시 물어보는 시간이다.
+ *  3. 그래도 같으면 이름순. 안 그러면 새로 고칠 때마다 차례가 흔들려 보고 있던 줄을 놓친다.
+ *
+ * **하나도 안 품은 표는 아예 안 내놓는다.** 목록을 채우려고 상관없는 표를 끼워 넣으면,
+ * 위에서 서너 개만 보고 고르는 사람에게 "이게 추천된 것" 이라는 잘못된 신호가 된다.
+ */
+export function recommendTables(tables, weakLabels, limit = 5) {
+    /* 약한 낱말을 Set 으로 — 표가 수십 개면 칸마다 배열을 훑는 비용이 쌓인다. */
+    const 약한것 = new Set(weakLabels);
+    if (약한것.size === 0)
+        return [];
+    const out = [];
+    for (const t of tables) {
+        /* **한 표 안에서 같은 낱말이 두 번 나와도 한 번으로 센다** — 대립쌍표에는 같은 쌍이
+           거듭 나오는 일이 있고, 그걸 두 번 세면 실속 없는 표가 위로 올라온다. */
+        const 품은것 = new Set();
+        const covered = [];
+        for (const label of t.cellLabels) {
+            if (약한것.has(label) && !품은것.has(label)) {
+                품은것.add(label);
+                covered.push(label);
+            }
+        }
+        if (covered.length === 0)
+            continue;
+        out.push({ id: t.id, name: t.name, kind: t.kind, covered, totalCells: t.cellLabels.length });
+    }
+    out.sort((a, b) => b.covered.length - a.covered.length
+        || a.totalCells - b.totalCells
+        || a.name.localeCompare(b.name));
+    return out.slice(0, Math.max(0, limit));
+}
+/**
+ * 추천할 표가 없을 때 **새로 만들 낱말들.**
+ *
+ * 가진 표 어디에도 그 낱말이 없으면 고를 표가 없다. 그때는 약한 낱말만 모아 새 표를
+ * 만드는 편이 낫다 — 이미 있는 표에서 억지로 고르면 상관없는 칸이 대부분인 시간이 된다.
+ *
+ * **추천이 이미 충분하면 만들지 않는다.** 표가 자꾸 늘면 목록이 지저분해지고, 다음에
+ * 고를 때 또 헷갈린다.
+ */
+export function uncoveredLabels(recommendations, weakLabels) {
+    const 덮인것 = new Set(recommendations.flatMap(r => r.covered));
+    return weakLabels.filter(l => !덮인것.has(l));
+}
+/**
+ * 새 표에 담을 **칸**을 가진 표들에서 찾아온다.
+ *
+ * 낱말만 알아서는 표를 못 만든다. 칸 하나에는 이미지·표준 발음·동형어 번호까지 붙어 있고,
+ * 그것 없이 글자만 넣으면 **쓸 수 있는 표가 안 된다**(그림을 보고 고르는 과제인데 그림이 없다).
+ * 그래서 같은 낱말을 담은 칸을 통째로 가져온다.
+ *
+ * 낱말 하나에 **처음 만난 칸 하나만** 가져온다 — 같은 대립쌍이 여러 표에 있으면
+ * 그만큼 중복해서 담기고, 새 표에 같은 칸이 여러 번 들어간다.
+ *
+ * `labels` 의 차례를 지킨다. 부르는 쪽이 이미 약한 순서로 정렬해 넘기므로,
+ * 표를 훑은 차례로 담으면 그 순서가 흐트러진다.
+ */
+export function cellsForLabels(tables, labels) {
+    const 찾은것 = new Map();
+    for (const t of tables) {
+        for (const cell of t.cells) {
+            const label = t.labelOf(cell);
+            if (!찾은것.has(label))
+                찾은것.set(label, cell);
+        }
+    }
+    const out = [];
+    for (const label of labels) {
+        const cell = 찾은것.get(label);
+        if (cell !== undefined)
+            out.push(cell);
+    }
+    return out;
+}

package/dist/packages/core/src/components/Word/wordTableReview.d.ts ADDED Viewed

@@ -0,0 +1,49 @@
+import type { ScoreMark } from './wordTableScoring';
+/**
+ * 다음 표에 담을 칸들.
+ *
+ * · `✕` 틀림 — 당연히 담는다
+ * · `△` 애매 — 담는다. 다시 들려주면 맞히는 정도라 **굳히지 않으면 곧 틀림으로 내려간다.**
+ *   여기서 빼면 애매를 매기는 뜻이 없어진다(맞음으로 친 것과 같아진다).
+ * · `○` 맞음 — 뺀다
+ * · 안 매긴 칸 — **뺀다.** 안 해 본 것이지 못 한 것이 아니다. 넣으면 채점을 반쯤 하다 만
+ *   경우에 "안 해 본 칸"이 복습표를 가득 채워, 원래 표와 거의 같은 것이 다시 만들어진다.
+ *
+ * **원래 차례를 지킨다.** 대립쌍표의 칸 순서는 발음의 흐름을 따라 짜여 있는 경우가 많아
+ * (같은 초성끼리 묶는 식) 어려운 것부터로 다시 늘어놓으면 그 흐름이 깨진다. 치료사가
+ * 이미 아는 표와 닮아 있는 편이 쓰기에도 낫다.
+ */
+export declare function reviewCells<T>(items: readonly T[], marks: Record<string, ScoreMark | null | undefined>): T[];
+/**
+ * 복습표 이름.
+ *
+ * 원래 이름을 앞에 두어 **목록에서 나란히 붙어 보이게** 한다(대개 이름순·최신순으로 본다).
+ * 날짜를 붙이는 것은 같은 표를 여러 번 돌리기 때문이다 — 없으면 같은 이름이 쌓여
+ * 어느 것이 이번 것인지 알 수 없다.
+ */
+export declare function reviewTableName(original: string, today: Date): string;
+/**
+ * 칸 번호 → 그때 보인 낱말. 채점과 **함께 저장한다.**
+ *
+ * 채점은 칸 번호로만 남는다. 그 번호를 낱말로 되돌리려면 표를 열어 봐야 하는데,
+ * **표가 그대로 있을 때만 맞는 방법이다** — 칸을 하나 지우면 그 뒤 번호가 전부 밀려
+ * 지난 채점이 엉뚱한 낱말의 기록으로 바뀐다. 화면에는 그럴듯한 낱말이 뜨고,
+ * 틀렸다는 자국은 아무 데도 없다.
+ *
+ * 매긴 칸만 담는다 — 안 매긴 칸의 낱말은 쓸 데가 없고, 표가 클수록 그냥 무게다.
+ */
+export declare function labelsForSave(labels: readonly string[], marks: Record<string, ScoreMark | null | undefined>): Record<string, string>;
+/** 한 칸의 낱말들을 한 줄로 — 대립쌍은 `가게 / 가재`. */
+export declare function cellLabel(words: readonly {
+    label: string;
+}[]): string;
+/**
+ * 채점한 표를 인쇄할 때 종이 맨 위에 찍는 한 줄.
+ *
+ * **누구의, 언제, 무슨 표인지가 종이에 없으면 기록이 못 된다.** 채점지를 여러 장 뽑아
+ * 두면 며칠 뒤에는 어느 것이 누구 것인지 알 수 없다 — 화면에는 고객 이름이 떠 있지만
+ * 인쇄되는 것은 격자뿐이라 종이에는 아무 단서도 안 남는다.
+ *
+ * 이름을 앞에 둔다. 종이를 넘겨 볼 때 먼저 찾는 것이 이름이기 때문이다.
+ */
+export declare function scoreSheetHeader(customerName: string, tableName: string, today: Date): string;

package/dist/packages/core/src/components/Word/wordTableReview.js ADDED Viewed

@@ -0,0 +1,112 @@
+import { toKstYmd, formatYmd } from '../../utils/date';
+/**
+ * 채점 결과로 **다음에 훈련할 표**를 짠다.
+ *
+ * 표를 한 번 돌리고 나면 칸마다 O·△·✕ 가 붙는다. 다음 시간에 같은 표를 통째로 다시
+ * 돌리는 것은 낭비다 — 맞힌 칸을 또 물어보는 데 시간을 쓰고, 정작 틀린 칸은 다른 것들
+ * 사이에 묻힌다. **틀리거나 애매했던 칸만 모아** 새 표로 만든다.
+ *
+ * 이 파일에는 화면도 저장도 없다. 무엇을 담을지만 안다.
+ */
+/** 다음 표에 담을 표시 — 틀림과 애매. */
+const 담을것 = new Set(['x', 'triangle']);
+/**
+ * 다음 표에 담을 칸들.
+ *
+ * · `✕` 틀림 — 당연히 담는다
+ * · `△` 애매 — 담는다. 다시 들려주면 맞히는 정도라 **굳히지 않으면 곧 틀림으로 내려간다.**
+ *   여기서 빼면 애매를 매기는 뜻이 없어진다(맞음으로 친 것과 같아진다).
+ * · `○` 맞음 — 뺀다
+ * · 안 매긴 칸 — **뺀다.** 안 해 본 것이지 못 한 것이 아니다. 넣으면 채점을 반쯤 하다 만
+ *   경우에 "안 해 본 칸"이 복습표를 가득 채워, 원래 표와 거의 같은 것이 다시 만들어진다.
+ *
+ * **원래 차례를 지킨다.** 대립쌍표의 칸 순서는 발음의 흐름을 따라 짜여 있는 경우가 많아
+ * (같은 초성끼리 묶는 식) 어려운 것부터로 다시 늘어놓으면 그 흐름이 깨진다. 치료사가
+ * 이미 아는 표와 닮아 있는 편이 쓰기에도 낫다.
+ */
+export function reviewCells(items, marks) {
+    const out = [];
+    for (let i = 0; i < items.length; i++) {
+        const m = marks[String(i)];
+        if (m && 담을것.has(m))
+            out.push(items[i]);
+    }
+    return out;
+}
+/**
+ * 복습표 이름.
+ *
+ * 원래 이름을 앞에 두어 **목록에서 나란히 붙어 보이게** 한다(대개 이름순·최신순으로 본다).
+ * 날짜를 붙이는 것은 같은 표를 여러 번 돌리기 때문이다 — 없으면 같은 이름이 쌓여
+ * 어느 것이 이번 것인지 알 수 없다.
+ */
+export function reviewTableName(original, today) {
+    /* 지역 날짜가 아니라 KST 로 읽는다 — 이 날짜는 **표 이름에 저장되고** 같은 이름끼리
+       겹치는지 세는 데 쓰인다. 기기 시간대를 따르면 같은 날 만든 표가 다른 날짜를 달고
+       남아 회차 세기가 어긋난다. */
+    const [, 월, 일] = toKstYmd(today).split('-');
+    const 날짜 = `${월}.${일}`;
+    /* **복습표를 또 복습하면 꼬리가 쌓인다.** 그대로 두면
+       `검수 대립쌍 복습 08.29 복습 08.30 복습 09.02` 처럼 자란다 — 복습을 거듭하는 것은
+       정상 쓰임이라 금방 읽을 수 없는 이름이 된다. 붙어 있던 복습 꼬리를 떼고 새로 단다.
+       떼면서 **몇 번째 복습인지 센다.** 꼬리만 떼고 날짜만 새로 달면 같은 날 두 번 복습할 때
+       이름이 똑같아진다(실측: 목록에 `… 복습 08.29` 가 둘 나란히 떴다). 회차는 그 충돌을
+       없앨 뿐 아니라, 치료사가 정작 알고 싶은 것이기도 하다 — **몇 번을 걸러도 안 잡히는
+       낱말들**이라는 뜻이다.
+       '복습' 은 뒤에 `MM.DD` 가 따라와야만 꼬리로 본다 — "복습 자료" 같은 사람이 지은
+       이름을 잘라 먹지 않으려는 것이다. */
+    const 꼬리 = /\s*(?:(\d+)차\s*)?복습\s*\d{2}\.\d{2}$/;
+    let 바탕 = original.trim();
+    let 세대 = 1;
+    for (;;) {
+        const m = 꼬리.exec(바탕);
+        if (!m)
+            break;
+        세대 = Math.max(세대, (m[1] ? Number(m[1]) : 1) + 1);
+        바탕 = 바탕.slice(0, m.index).trim();
+    }
+    const 회차 = 세대 >= 2 ? `${세대}차 ` : '';
+    return `${바탕 || '단어표'} ${회차}복습 ${날짜}`;
+}
+/**
+ * 칸 번호 → 그때 보인 낱말. 채점과 **함께 저장한다.**
+ *
+ * 채점은 칸 번호로만 남는다. 그 번호를 낱말로 되돌리려면 표를 열어 봐야 하는데,
+ * **표가 그대로 있을 때만 맞는 방법이다** — 칸을 하나 지우면 그 뒤 번호가 전부 밀려
+ * 지난 채점이 엉뚱한 낱말의 기록으로 바뀐다. 화면에는 그럴듯한 낱말이 뜨고,
+ * 틀렸다는 자국은 아무 데도 없다.
+ *
+ * 매긴 칸만 담는다 — 안 매긴 칸의 낱말은 쓸 데가 없고, 표가 클수록 그냥 무게다.
+ */
+export function labelsForSave(labels, marks) {
+    const out = {};
+    for (const [k, v] of Object.entries(marks)) {
+        if (v !== 'o' && v !== 'triangle' && v !== 'x')
+            continue;
+        const i = Number(k);
+        const label = labels[i];
+        if (label)
+            out[k] = label;
+    }
+    return out;
+}
+/** 한 칸의 낱말들을 한 줄로 — 대립쌍은 `가게 / 가재`. */
+export function cellLabel(words) {
+    return words.map(w => w.label).join(' / ');
+}
+/**
+ * 채점한 표를 인쇄할 때 종이 맨 위에 찍는 한 줄.
+ *
+ * **누구의, 언제, 무슨 표인지가 종이에 없으면 기록이 못 된다.** 채점지를 여러 장 뽑아
+ * 두면 며칠 뒤에는 어느 것이 누구 것인지 알 수 없다 — 화면에는 고객 이름이 떠 있지만
+ * 인쇄되는 것은 격자뿐이라 종이에는 아무 단서도 안 남는다.
+ *
+ * 이름을 앞에 둔다. 종이를 넘겨 볼 때 먼저 찾는 것이 이름이기 때문이다.
+ */
+export function scoreSheetHeader(customerName, tableName, today) {
+    /* 인쇄물에 찍히는 날짜다 — 치료실의 그날(KST)이어야 한다. */
+    const 날짜 = formatYmd(today);
+    return [customerName.trim(), 날짜, tableName.trim()].filter(Boolean).join(' · ');
+}

package/dist/packages/core/src/components/Word/wordTableScoring.d.ts ADDED Viewed

@@ -0,0 +1,100 @@
+/**
+ * 단어표 채점 — 표의 한 **칸**에 매기는 표시와 그 셈.
+ *
+ * 치료사가 표를 보여 주고 칸마다 맞았는지 표시한다(대립쌍표는 쌍 하나가 한 시행이다). 종이에 하던 일을 화면에서
+ * 그대로 하게 하는 것이라, 표시는 셋뿐이다.
+ *
+ *   O   맞음
+ *   △   반응은 했으나 정확하지 않음(다시 들려주면 맞히는 정도)
+ *   X   틀림
+ *
+ * 이 파일에는 **화면이 없다.** 표시가 어떤 순서로 도는지, 몇 개가 맞았는지만 안다.
+ * 그래야 표 없이 표로 확인할 수 있다.
+ */
+/** 채점 표시. `null` 은 아직 안 매긴 것 — 0점과는 다르다. */
+export type ScoreMark = 'o' | 'triangle' | 'x';
+/**
+ * 표의 한 **칸**을 가리키는 열쇠.
+ *
+ * 낱말 하나가 아니라 칸 하나다. **대립쌍표에서 한 칸은 낱말 둘이지만 시행은 한 번**이다 —
+ * 듣고 둘 중 하나를 고르는 것이라, 맞았는지 틀렸는지는 쌍에 대해 매긴다. 낱말마다
+ * 매기게 하면 '가게'는 맞고 '가재'는 틀렸다는, 이 과제에 없는 답이 만들어진다.
+ * 단어표(칸당 낱말 하나)에서는 칸과 낱말이 같으므로 규칙이 하나로 통한다.
+ *
+ * 같은 낱말이 표에 여러 번 나오므로(대립쌍표의 '가다'는 여섯 번) 낱말이 아니라 자리로 센다.
+ */
+export declare function scoreKey(cellIndex: number): string;
+/** 매길 수 있는 표시 — 화면에 이 순서로 늘어놓는다(맞음 → 애매 → 틀림) */
+export declare const MARKS: readonly ScoreMark[];
+/**
+ * 어떤 표시를 눌렀을 때 그 칸이 갖게 될 값.
+ *
+ * **이미 매겨진 것을 다시 누르면 지운다.** 지울 길이 없으면 잘못 누른 표시를 없애려고
+ * 치료사가 팝업을 닫았다 다시 열게 되고, 그러면 그때까지 매긴 것이 전부 사라진다.
+ * 세 단추를 늘어놓는 방식이라 "다른 표시로 바꾸기"는 그 단추를 누르면 되고,
+ * "지우기"만 따로 길을 내 주면 된다.
+ */
+export declare function markAfterClick(current: ScoreMark | null, clicked: ScoreMark): ScoreMark | null;
+/** 표시마다 쓰는 아이콘 이름(lucide). 저장소가 쓰는 아이콘 체계를 그대로 따른다. */
+export declare const MARK_ICON: Record<ScoreMark, string>;
+/**
+ * 표시마다 쓰는 단추 변형.
+ *
+ * **모양(아이콘)이 이미 셋을 가르고 색은 거들 뿐이다** — 색만으로 구분하게 두면
+ * 색을 잘 못 가리는 사람에게는 세 표시가 같아진다.
+ */
+/**
+ * 고른 표시의 단추 변형.
+ *
+ * △ 는 `sub`(청록)였는데 **파랑 옆에서 '좋음' 계열로 읽혔다** — ○ 와 △ 가 나란히
+ * 있으면 둘 다 통과한 것처럼 보인다. 애매함은 주의색이 맞다.
+ *
+ * `Button` 에 warn 변형이 없어 이름만 여기서 정하고, 색은 `WordTable.css` 가
+ * `--color-warn` 으로 입힌다(변형을 새로 만들면 앱 전체 단추에 영향이 간다).
+ */
+export declare const MARK_VARIANT: Record<ScoreMark, 'main' | 'warn' | 'danger'>;
+export interface ScoreSummary {
+    /** 매긴 칸 수 */
+    marked: number;
+    o: number;
+    triangle: number;
+    x: number;
+    /**
+     * 정답률(0~1). **매긴 것만 분모로 삼는다** — 아직 안 매긴 칸을 오답으로 세면
+     * 채점을 시작하자마자 0%가 되고, 반쯤 매긴 상태의 숫자가 뜻을 잃는다.
+     * 매긴 것이 없으면 `null` 이다(0% 와 구별해야 한다).
+     */
+    rate: number | null;
+}
+/**
+ * 표시들을 센다.
+ *
+ * △ 를 **반 점으로 친다.** 맞음도 틀림도 아닌 것을 어느 한쪽에 몰아넣으면 그 표시를
+ * 두는 뜻이 없어진다. (다르게 세고 싶으면 이 함수만 고치면 된다 — 화면은 여기 결과만 쓴다.)
+ */
+export declare function summarize(marks: Record<string, ScoreMark | null | undefined>): ScoreSummary;
+/**
+ * 저장에 실을 표시들만 남긴다.
+ *
+ * 화면 쪽 상태에는 **지운 칸이 `null` 로 남는다** — 한 번 매겼다 지우면 그 열쇠가
+ * 사라지지 않고 값만 비는 식이다(`markAfterClick` 참고). 그대로 서버에 보내면
+ * `{"3": null}` 같은 것이 저장되고, 나중에 "3번 칸은 채점했는데 값이 없다"는,
+ * 있지도 않은 상태를 읽게 된다. 안 매긴 칸은 **아예 없어야** 한다.
+ */
+export declare function marksForSave(marks: Record<string, ScoreMark | null | undefined>): Record<string, ScoreMark>;
+/**
+ * 쪽마다 **첫 칸이 표 전체에서 몇 번째인가.**
+ *
+ * 표가 여러 쪽으로 나뉘면 쪽마다 표 컴포넌트가 따로 뜨고 칸 번호를 0부터 다시 센다.
+ * 그대로 두면 1쪽 0번과 2쪽 0번이 같은 열쇠가 되어 **채점이 서로를 덮어쓴다** —
+ * 8칸짜리 두 쪽을 매기면 뒤쪽 8칸이 앞쪽을 지운다. 쪽의 시작 번호를 더해 유일하게 만든다.
+ */
+export declare function pageStartIndexes(pageLengths: readonly number[]): number[];
+/**
+ * 채점 화면을 떠나려 할 때 **물어봐야 하는가.**
+ *
+ * 채점은 저장하기 전까지 화면에만 있다. 훈련 한 시간을 매긴 뒤 닫기를 스치면 그대로
+ * 사라졌다(실측: 두 칸을 매기고 X 를 누르니 아무 말 없이 닫혔다). 잃을 것이 있을 때만
+ * 붙잡는다 — 아무것도 안 매겼거나 이미 저장했으면 묻는 것이 방해일 뿐이다.
+ */
+export declare function shouldConfirmDiscard(markedCount: number, alreadySaved: boolean): boolean;