waybetter 0.1.1 → 0.7.0

package/dist/runtime/stringPackTranslate.js

@@ -0,0 +1,267 @@
+// Translate mode for string packs (published as `waybetter/runtime/stringPackTranslate`): the site's
+// strings carry an invisible marker naming their key, so clicking a word on the page tells which
+// key it is. The author types a replacement (checked with the pack rules right there), the edits
+// collect in the tab as a draft pack that applies on the next reload, and Export copies the pack
+// file. Nothing leaves the page; the draft lives in the tab's session storage.
+//
+// The markers change the site's text (invisible characters at the end of each string), so exact
+// comparisons in the site's own code may notice: translate mode is for authors, never on by default,
+// and leaving it reloads the page without markers.
+import { compilePack, inventoryLookup, validateString } from "./stringPacks.js";
+const START = '⁣';
+const DIGITS = ['​', '‌', '‍', '⁠'];
+const MARKED = /⁣([​‌‍⁠]+)⁣/g;
+export function createMarker() {
+    const ids = [];
+    const index = new Map();
+    const code = (id) => {
+        let n = index.get(id);
+        if (n === undefined) {
+            n = ids.length;
+            ids.push(id);
+            index.set(id, n);
+        }
+        let digits = '';
+        do {
+            digits = DIGITS[n % 4] + digits;
+            n = Math.floor(n / 4);
+        } while (n);
+        return START + digits + START;
+    };
+    return {
+        mark(id, value) {
+            if (typeof value === 'string')
+                return value + code(id);
+            if (typeof value === 'function') {
+                const original = value;
+                return function (...args) {
+                    const out = original.apply(this, args);
+                    return typeof out === 'string' ? out + code(id) : out;
+                };
+            }
+            return value;
+        },
+        ids(text) {
+            const out = [];
+            for (const match of text.matchAll(MARKED)) {
+                let n = 0;
+                for (const ch of match[1])
+                    n = n * 4 + DIGITS.indexOf(ch);
+                const id = ids[n];
+                if (id && !out.includes(id))
+                    out.push(id);
+            }
+            return out;
+        },
+        strip: text => text.replace(MARKED, ''),
+    };
+}
+export const DRAFT_KEY = 'wayBetter.translateDraft';
+export function readDraft(storage) {
+    try {
+        const value = JSON.parse(storage.getItem(DRAFT_KEY) ?? 'null');
+        return value && typeof value === 'object' && typeof value.strings === 'object' && value.strings !== null ? value : null;
+    }
+    catch {
+        return null;
+    }
+}
+/** The draft as a pack document for `site`/`catalog`. */
+export function draftPack(draft, site, catalog) {
+    return {
+        format: 1, site, catalog, language: draft.language || 'en-x-draft', name: draft.name || 'My strings', authors: ['Me'],
+        version: '0.1.0', strings: { ...draft.strings },
+    };
+}
+/** Checks one edit against the key's shape; `null` when it can be used. */
+export function checkEdit(lookup, id, value) {
+    const shape = lookup(id);
+    if (!shape)
+        return 'this key is not in the inventory';
+    const result = validateString(shape, value);
+    return 'reason' in result ? result.reason : null;
+}
+/** English defaults (the app passes its own words). */
+export const TRANSLATE_WORDS = {
+    bar: 'Translate mode', hint: 'Click a word to change it.', edits: count => `${count} ${count === 1 ? 'edit' : 'edits'}`,
+    exportPack: 'Copy pack file', copied: 'Pack file copied', exit: 'Leave', reload: 'Reload to see it',
+    key: 'Key', original: 'Now', parameters: 'Parameters', plural: 'plural', save: 'Save', cancel: 'Cancel', remove: 'Remove edit',
+    notTranslatable: 'This string cannot be changed by a pack yet.', choose: 'Which one?',
+};
+const CSS = `
+:host { all: initial; }
+.bar { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 2147483646; display: flex; gap: 10px; align-items: center;
+  padding: 8px 12px; border-radius: 12px; background: #111827; color: #f9fafb; font: 13px/1.3 system-ui, sans-serif; box-shadow: 0 8px 24px rgba(0,0,0,.35); }
+.bar b { font-weight: 600; } .bar span { color: #cbd5e1; }
+button { font: inherit; border: 0; border-radius: 8px; padding: 6px 10px; cursor: pointer; background: #334155; color: #f9fafb; }
+button.primary { background: #2563eb; }
+.pop { position: fixed; z-index: 2147483647; width: 360px; max-width: calc(100vw - 24px); padding: 12px; border-radius: 12px; background: #fff; color: #111827;
+  font: 13px/1.4 system-ui, sans-serif; box-shadow: 0 12px 32px rgba(0,0,0,.3); display: grid; gap: 8px; }
+.pop small { color: #475569; } .pop code { font-size: 12px; color: #334155; }
+.pop textarea { width: 100%; box-sizing: border-box; min-height: 64px; font: inherit; padding: 6px; border: 1px solid #cbd5e1; border-radius: 8px; }
+.pop .row { display: flex; gap: 8px; justify-content: flex-end; } .pop .err { color: #b91c1c; }
+.pop .pick { display: grid; gap: 4px; } .pop .pick button { text-align: left; background: #e2e8f0; color: #111827; }
+`;
+/**
+ * The page part of translate mode: a bar (edits, copy the pack file, leave) and an editor for the
+ * string under a click. Clicks on marked text are the editor's while the mode is on.
+ */
+export function installTranslateUi(win, options) {
+    const doc = win.document;
+    const currentWords = () => ({ ...TRANSLATE_WORDS, ...(typeof options.words === 'function' ? options.words() : options.words) });
+    const lookup = inventoryLookup(options.inventory);
+    const storage = win.sessionStorage;
+    const draft = () => readDraft(storage) ?? { language: '', name: '', strings: {} };
+    const save = (next) => { try {
+        storage.setItem(DRAFT_KEY, JSON.stringify(next));
+    }
+    catch { /* storage full or blocked */ } };
+    const host = doc.createElement('wb-translate');
+    const root = host.attachShadow({ mode: 'open' });
+    const style = doc.createElement('style');
+    style.textContent = CSS;
+    root.append(style);
+    const bar = doc.createElement('div');
+    bar.className = 'bar';
+    root.append(bar);
+    let pop = null;
+    let changed = false;
+    const button = (label, onClick, primary = false) => {
+        const el = doc.createElement('button');
+        el.textContent = label;
+        if (primary)
+            el.className = 'primary';
+        el.addEventListener('click', event => { event.preventDefault(); event.stopPropagation(); onClick(); });
+        return el;
+    };
+    const renderBar = () => {
+        const words = currentWords();
+        bar.replaceChildren();
+        const title = doc.createElement('b');
+        title.textContent = words.bar;
+        const hint = doc.createElement('span');
+        hint.textContent = `${words.hint} · ${words.edits(Object.keys(draft().strings).length)}`;
+        bar.append(title, hint);
+        if (changed)
+            bar.append(button(words.reload, () => win.location.reload(), true));
+        bar.append(button(words.exportPack, () => {
+            const text = JSON.stringify(draftPack(draft(), options.site, options.catalog), null, 2);
+            void win.navigator.clipboard?.writeText(text).then(() => { hint.textContent = words.copied; }).catch(() => { });
+        }));
+        bar.append(button(words.exit, options.exit));
+    };
+    const closePop = () => { pop?.remove(); pop = null; };
+    const edit = (id, x, y, now) => {
+        const words = currentWords();
+        closePop();
+        pop = doc.createElement('div');
+        pop.className = 'pop';
+        pop.style.left = `${Math.max(12, Math.min(x, win.innerWidth - 372))}px`;
+        pop.style.top = `${Math.max(12, Math.min(y + 12, win.innerHeight - 260))}px`;
+        const shape = lookup(id);
+        const head = doc.createElement('small');
+        head.textContent = `${words.key}: `;
+        const code = doc.createElement('code');
+        code.textContent = id;
+        head.append(code);
+        const current = doc.createElement('div');
+        current.textContent = `${words.original}: ${now}`;
+        pop.append(head, current);
+        if (!shape || (shape.kind !== 'text' && shape.kind !== 'message')) {
+            const note = doc.createElement('div');
+            note.textContent = words.notTranslatable;
+            pop.append(note, button(words.cancel, closePop));
+            root.append(pop);
+            return;
+        }
+        if (shape.params?.length) {
+            const params = doc.createElement('small');
+            params.textContent = `${words.parameters}: ${shape.params.map(name => `{${name}}${shape.plural?.includes(name) ? ` (${words.plural})` : ''}`).join(', ')}`;
+            pop.append(params);
+        }
+        const input = doc.createElement('textarea');
+        input.value = draft().strings[id] ?? now;
+        const error = doc.createElement('div');
+        error.className = 'err';
+        const row = doc.createElement('div');
+        row.className = 'row';
+        if (draft().strings[id] !== undefined) {
+            row.append(button(words.remove, () => { const next = draft(); delete next.strings[id]; save(next); changed = true; closePop(); renderBar(); }));
+        }
+        row.append(button(words.cancel, closePop), button(words.save, () => {
+            const value = input.value.trim();
+            const problem = checkEdit(lookup, id, value);
+            if (problem) {
+                error.textContent = problem;
+                return;
+            }
+            const next = draft();
+            next.strings[id] = value;
+            save(next);
+            changed = true;
+            closePop();
+            renderBar();
+        }, true));
+        pop.append(input, error, row);
+        root.append(pop);
+        input.focus();
+    };
+    /** The marked keys at a click: the element's own text and labels, then up to three parents. */
+    const keysAt = (target) => {
+        for (let el = target, depth = 0; el && depth < 4; el = el.parentElement, depth += 1) {
+            const texts = [el.textContent ?? '', el.getAttribute('aria-label') ?? '', el.getAttribute('placeholder') ?? '', el.getAttribute('title') ?? ''];
+            const found = texts.flatMap(text => options.marker.ids(text).map(id => ({ id, text: options.marker.strip(text) })));
+            if (found.length)
+                return found.filter((item, i) => found.findIndex(other => other.id === item.id) === i).slice(0, 8);
+        }
+        return [];
+    };
+    const onClick = (event) => {
+        const words = currentWords();
+        if (event.composedPath().includes(host))
+            return;
+        const found = keysAt(event.target);
+        if (!found.length)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        if (found.length === 1) {
+            edit(found[0].id, event.clientX, event.clientY, found[0].text);
+            return;
+        }
+        closePop();
+        pop = doc.createElement('div');
+        pop.className = 'pop';
+        pop.style.left = `${Math.max(12, Math.min(event.clientX, win.innerWidth - 372))}px`;
+        pop.style.top = `${Math.max(12, Math.min(event.clientY + 12, win.innerHeight - 260))}px`;
+        const pick = doc.createElement('div');
+        pick.className = 'pick';
+        const label = doc.createElement('small');
+        label.textContent = words.choose;
+        pick.append(label, ...found.map(item => button(`${item.text.slice(0, 60)} · ${item.id}`, () => edit(item.id, event.clientX, event.clientY, item.text))));
+        pop.append(pick, button(words.cancel, closePop));
+        root.append(pop);
+    };
+    const mount = () => { (doc.body ?? doc.documentElement).append(host); renderBar(); };
+    if (doc.body)
+        mount();
+    else
+        doc.addEventListener('DOMContentLoaded', mount, { once: true });
+    win.addEventListener('click', onClick, true);
+    return { dispose() { win.removeEventListener('click', onClick, true); host.remove(); } };
+}
+/** The draft as the last pack of a delivery (it applies over the others), when it has any string. */
+export function withDraft(packs, storage, site, catalog, inventory) {
+    const draft = readDraft(storage);
+    if (!draft || !Object.keys(draft.strings).length)
+        return [...packs];
+    const pack = draftPack(draft, site, catalog);
+    try {
+        compilePack(pack, inventory);
+    }
+    catch {
+        return [...packs];
+    }
+    return [...packs, pack];
+}
+//# sourceMappingURL=stringPackTranslate.js.map

package/dist/runtime/stringPackTranslate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stringPackTranslate.js","sourceRoot":"","sources":["../../../runtime/src/stringPackTranslate.ts"],"names":[],"mappings":"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","sourcesContent":["// Translate mode for string packs (published as `waybetter/runtime/stringPackTranslate`): the site's\n// strings carry an invisible marker naming their key, so clicking a word on the page tells which\n// key it is. The author types a replacement (checked with the pack rules right there), the edits\n// collect in the tab as a draft pack that applies on the next reload, and Export copies the pack\n// file. Nothing leaves the page; the draft lives in the tab's session storage.\n//\n// The markers change the site's text (invisible characters at the end of each string), so exact\n// comparisons in the site's own code may notice: translate mode is for authors, never on by default,\n// and leaving it reloads the page without markers.\nimport { compilePack, inventoryLookup, validateString, type InventoryLookup, type PageInventory, type StringPack } from './stringPacks.ts';\n\nconst START = '⁣';\nconst DIGITS = ['​', '‌', '‍', '⁠'];\nconst MARKED = /⁣([​‌‍⁠]+)⁣/g;\n\nexport type Marker = {\n  /** The value with its key's marker (strings, and functions whose result is a string). */\n  mark(id: string, value: unknown): unknown;\n  /** The keys marked in a text, in order. */\n  ids(text: string): string[];\n  /** The text without markers. */\n  strip(text: string): string;\n};\n\nexport function createMarker(): Marker {\n  const ids: string[] = [];\n  const index = new Map<string, number>();\n  const code = (id: string) => {\n    let n = index.get(id);\n    if (n === undefined) { n = ids.length; ids.push(id); index.set(id, n); }\n    let digits = '';\n    do { digits = DIGITS[n % 4] + digits; n = Math.floor(n / 4); } while (n);\n    return START + digits + START;\n  };\n  return {\n    mark(id, value) {\n      if (typeof value === 'string') return value + code(id);\n      if (typeof value === 'function') {\n        const original = value as (...args: unknown[]) => unknown;\n        return function (this: unknown, ...args: unknown[]) {\n          const out = original.apply(this, args);\n          return typeof out === 'string' ? out + code(id) : out;\n        };\n      }\n      return value;\n    },\n    ids(text) {\n      const out: string[] = [];\n      for (const match of text.matchAll(MARKED)) {\n        let n = 0;\n        for (const ch of match[1]!) n = n * 4 + DIGITS.indexOf(ch);\n        const id = ids[n];\n        if (id && !out.includes(id)) out.push(id);\n      }\n      return out;\n    },\n    strip: text => text.replace(MARKED, ''),\n  };\n}\n\n/** The author's edits in this tab. */\nexport type TranslateDraft = { language: string; name: string; strings: Record<string, string> };\n\nexport const DRAFT_KEY = 'wayBetter.translateDraft';\n\nexport function readDraft(storage: Pick<Storage, 'getItem'>): TranslateDraft | null {\n  try {\n    const value = JSON.parse(storage.getItem(DRAFT_KEY) ?? 'null') as TranslateDraft | null;\n    return value && typeof value === 'object' && typeof value.strings === 'object' && value.strings !== null ? value : null;\n  } catch {\n    return null;\n  }\n}\n\n/** The draft as a pack document for `site`/`catalog`. */\nexport function draftPack(draft: TranslateDraft, site: string, catalog: string): StringPack {\n  return {\n    format: 1, site, catalog, language: draft.language || 'en-x-draft', name: draft.name || 'My strings', authors: ['Me'],\n    version: '0.1.0', strings: { ...draft.strings },\n  };\n}\n\n/** Checks one edit against the key's shape; `null` when it can be used. */\nexport function checkEdit(lookup: InventoryLookup, id: string, value: string): string | null {\n  const shape = lookup(id);\n  if (!shape) return 'this key is not in the inventory';\n  const result = validateString(shape, value);\n  return 'reason' in result ? result.reason : null;\n}\n\nexport type TranslateWords = {\n  bar: string; hint: string; edits(count: number): string; exportPack: string; copied: string; exit: string; reload: string;\n  key: string; original: string; parameters: string; plural: string; save: string; cancel: string; remove: string; notTranslatable: string; choose: string;\n};\n\n/** English defaults (the app passes its own words). */\nexport const TRANSLATE_WORDS: TranslateWords = {\n  bar: 'Translate mode', hint: 'Click a word to change it.', edits: count => `${count} ${count === 1 ? 'edit' : 'edits'}`,\n  exportPack: 'Copy pack file', copied: 'Pack file copied', exit: 'Leave', reload: 'Reload to see it',\n  key: 'Key', original: 'Now', parameters: 'Parameters', plural: 'plural', save: 'Save', cancel: 'Cancel', remove: 'Remove edit',\n  notTranslatable: 'This string cannot be changed by a pack yet.', choose: 'Which one?',\n};\n\nexport type TranslateUiOptions = {\n  inventory: PageInventory;\n  marker: Marker;\n  site: string;\n  catalog: string;\n  /** The bar's and the editor's words; a function is asked again each time they are drawn (the app's language may change). */\n  words?: Partial<TranslateWords> | (() => Partial<TranslateWords>);\n  /** Leaves translate mode (the app drops the flag and reloads). */\n  exit(): void;\n};\n\nconst CSS = `\n:host { all: initial; }\n.bar { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 2147483646; display: flex; gap: 10px; align-items: center;\n  padding: 8px 12px; border-radius: 12px; background: #111827; color: #f9fafb; font: 13px/1.3 system-ui, sans-serif; box-shadow: 0 8px 24px rgba(0,0,0,.35); }\n.bar b { font-weight: 600; } .bar span { color: #cbd5e1; }\nbutton { font: inherit; border: 0; border-radius: 8px; padding: 6px 10px; cursor: pointer; background: #334155; color: #f9fafb; }\nbutton.primary { background: #2563eb; }\n.pop { position: fixed; z-index: 2147483647; width: 360px; max-width: calc(100vw - 24px); padding: 12px; border-radius: 12px; background: #fff; color: #111827;\n  font: 13px/1.4 system-ui, sans-serif; box-shadow: 0 12px 32px rgba(0,0,0,.3); display: grid; gap: 8px; }\n.pop small { color: #475569; } .pop code { font-size: 12px; color: #334155; }\n.pop textarea { width: 100%; box-sizing: border-box; min-height: 64px; font: inherit; padding: 6px; border: 1px solid #cbd5e1; border-radius: 8px; }\n.pop .row { display: flex; gap: 8px; justify-content: flex-end; } .pop .err { color: #b91c1c; }\n.pop .pick { display: grid; gap: 4px; } .pop .pick button { text-align: left; background: #e2e8f0; color: #111827; }\n`;\n\n/**\n * The page part of translate mode: a bar (edits, copy the pack file, leave) and an editor for the\n * string under a click. Clicks on marked text are the editor's while the mode is on.\n */\nexport function installTranslateUi(win: Window, options: TranslateUiOptions): { dispose(): void } {\n  const doc = win.document;\n  const currentWords = (): TranslateWords => ({ ...TRANSLATE_WORDS, ...(typeof options.words === 'function' ? options.words() : options.words) });\n  const lookup = inventoryLookup(options.inventory);\n  const storage = win.sessionStorage;\n  const draft = (): TranslateDraft => readDraft(storage) ?? { language: '', name: '', strings: {} };\n  const save = (next: TranslateDraft) => { try { storage.setItem(DRAFT_KEY, JSON.stringify(next)); } catch { /* storage full or blocked */ } };\n\n  const host = doc.createElement('wb-translate');\n  const root = host.attachShadow({ mode: 'open' });\n  const style = doc.createElement('style');\n  style.textContent = CSS;\n  root.append(style);\n  const bar = doc.createElement('div');\n  bar.className = 'bar';\n  root.append(bar);\n  let pop: HTMLElement | null = null;\n  let changed = false;\n\n  const button = (label: string, onClick: () => void, primary = false) => {\n    const el = doc.createElement('button');\n    el.textContent = label;\n    if (primary) el.className = 'primary';\n    el.addEventListener('click', event => { event.preventDefault(); event.stopPropagation(); onClick(); });\n    return el;\n  };\n  const renderBar = () => {\n    const words = currentWords();\n    bar.replaceChildren();\n    const title = doc.createElement('b');\n    title.textContent = words.bar;\n    const hint = doc.createElement('span');\n    hint.textContent = `${words.hint} · ${words.edits(Object.keys(draft().strings).length)}`;\n    bar.append(title, hint);\n    if (changed) bar.append(button(words.reload, () => win.location.reload(), true));\n    bar.append(button(words.exportPack, () => {\n      const text = JSON.stringify(draftPack(draft(), options.site, options.catalog), null, 2);\n      void win.navigator.clipboard?.writeText(text).then(() => { hint.textContent = words.copied; }).catch(() => {});\n    }));\n    bar.append(button(words.exit, options.exit));\n  };\n  const closePop = () => { pop?.remove(); pop = null; };\n\n  const edit = (id: string, x: number, y: number, now: string) => {\n    const words = currentWords();\n    closePop();\n    pop = doc.createElement('div');\n    pop.className = 'pop';\n    pop.style.left = `${Math.max(12, Math.min(x, win.innerWidth - 372))}px`;\n    pop.style.top = `${Math.max(12, Math.min(y + 12, win.innerHeight - 260))}px`;\n    const shape = lookup(id);\n    const head = doc.createElement('small');\n    head.textContent = `${words.key}: `;\n    const code = doc.createElement('code');\n    code.textContent = id;\n    head.append(code);\n    const current = doc.createElement('div');\n    current.textContent = `${words.original}: ${now}`;\n    pop.append(head, current);\n    if (!shape || (shape.kind !== 'text' && shape.kind !== 'message')) {\n      const note = doc.createElement('div');\n      note.textContent = words.notTranslatable;\n      pop.append(note, button(words.cancel, closePop));\n      root.append(pop);\n      return;\n    }\n    if (shape.params?.length) {\n      const params = doc.createElement('small');\n      params.textContent = `${words.parameters}: ${shape.params.map(name => `{${name}}${shape.plural?.includes(name) ? ` (${words.plural})` : ''}`).join(', ')}`;\n      pop.append(params);\n    }\n    const input = doc.createElement('textarea');\n    input.value = draft().strings[id] ?? now;\n    const error = doc.createElement('div');\n    error.className = 'err';\n    const row = doc.createElement('div');\n    row.className = 'row';\n    if (draft().strings[id] !== undefined) {\n      row.append(button(words.remove, () => { const next = draft(); delete next.strings[id]; save(next); changed = true; closePop(); renderBar(); }));\n    }\n    row.append(button(words.cancel, closePop), button(words.save, () => {\n      const value = input.value.trim();\n      const problem = checkEdit(lookup, id, value);\n      if (problem) { error.textContent = problem; return; }\n      const next = draft();\n      next.strings[id] = value;\n      save(next);\n      changed = true;\n      closePop();\n      renderBar();\n    }, true));\n    pop.append(input, error, row);\n    root.append(pop);\n    input.focus();\n  };\n\n  /** The marked keys at a click: the element's own text and labels, then up to three parents. */\n  const keysAt = (target: Element | null) => {\n    for (let el = target, depth = 0; el && depth < 4; el = el.parentElement, depth += 1) {\n      const texts = [el.textContent ?? '', el.getAttribute('aria-label') ?? '', el.getAttribute('placeholder') ?? '', el.getAttribute('title') ?? ''];\n      const found = texts.flatMap(text => options.marker.ids(text).map(id => ({ id, text: options.marker.strip(text) })));\n      if (found.length) return found.filter((item, i) => found.findIndex(other => other.id === item.id) === i).slice(0, 8);\n    }\n    return [];\n  };\n  const onClick = (event: MouseEvent) => {\n    const words = currentWords();\n    if (event.composedPath().includes(host)) return;\n    const found = keysAt(event.target as Element | null);\n    if (!found.length) return;\n    event.preventDefault();\n    event.stopPropagation();\n    if (found.length === 1) { edit(found[0]!.id, event.clientX, event.clientY, found[0]!.text); return; }\n    closePop();\n    pop = doc.createElement('div');\n    pop.className = 'pop';\n    pop.style.left = `${Math.max(12, Math.min(event.clientX, win.innerWidth - 372))}px`;\n    pop.style.top = `${Math.max(12, Math.min(event.clientY + 12, win.innerHeight - 260))}px`;\n    const pick = doc.createElement('div');\n    pick.className = 'pick';\n    const label = doc.createElement('small');\n    label.textContent = words.choose;\n    pick.append(label, ...found.map(item => button(`${item.text.slice(0, 60)} · ${item.id}`, () => edit(item.id, event.clientX, event.clientY, item.text))));\n    pop.append(pick, button(words.cancel, closePop));\n    root.append(pop);\n  };\n\n  const mount = () => { (doc.body ?? doc.documentElement).append(host); renderBar(); };\n  if (doc.body) mount(); else doc.addEventListener('DOMContentLoaded', mount, { once: true });\n  win.addEventListener('click', onClick, true);\n  return { dispose() { win.removeEventListener('click', onClick, true); host.remove(); } };\n}\n\n/** The draft as the last pack of a delivery (it applies over the others), when it has any string. */\nexport function withDraft(packs: readonly unknown[], storage: Pick<Storage, 'getItem'>, site: string, catalog: string, inventory: PageInventory): unknown[] {\n  const draft = readDraft(storage);\n  if (!draft || !Object.keys(draft.strings).length) return [...packs];\n  const pack = draftPack(draft, site, catalog);\n  try { compilePack(pack, inventory); } catch { return [...packs]; }\n  return [...packs, pack];\n}\n"]}

package/dist/runtime/stringPacks.d.ts

@@ -0,0 +1,248 @@
+import { parseMessage } from './i18n.ts';
+type Parts = ReturnType<typeof parseMessage>;
+/**
+ * What the site's value for a key is:
+ * - `text`: a plain string;
+ * - `message`: a function of a parameter object that returns a string;
+ * - `rich`: text with element slots (a link or a button inside a sentence). It can be replaced when
+ *   the inventory knows its slot count (`slots`): the pack value then places the site's own
+ *   elements with `{e0}`, `{e1}`, …, each exactly once (the last may be left out); the value itself is still plain text;
+ * - `format`: a compiled number/date/currency formatter (not text).
+ * Only `text`, `message` and `rich` with known `slots` can be replaced by a pack.
+ */
+export type StringKind = 'text' | 'message' | 'rich' | 'format';
+export type InventoryEntry = {
+    kind: StringKind;
+    /** Parameter names the site's value takes (`message`). */
+    params?: string[];
+    /** Parameters the site's value pluralizes: known to be numbers, so a pack may pluralize them. */
+    plural?: string[];
+    /** Parameters the site's value selects on. */
+    select?: string[];
+    /** Element slots of a `rich` value (`{e0}` … `{e<slots-1>}` in a pack value; the last may be left out). Without it the key is closed. */
+    slots?: number;
+    /** Tag slot names, for catalogs whose values carry `<tag>…</tag>` slots. */
+    tags?: string[];
+    /** Hash of the base-language value (`hashText`): drift detection; never the text itself. */
+    hash: string;
+    /** Part of the catalog the key arrives with (default `main`), e.g. a lazily loaded `emoji` group. */
+    group?: string;
+};
+/** The known keys of one catalog of one site. It carries ids and shapes, never the site's text. */
+export type StringInventory = {
+    format: 1;
+    site: string;
+    catalog: string;
+    /** Language the hashes were taken from. */
+    base: string;
+    /** The site build the inventory was read from. */
+    build?: string;
+    entries: Record<string, InventoryEntry>;
+};
+/**
+ * When a pack applies. Without a condition it always does. `languages`: only while the site shows
+ * one of these languages (a tag matches itself and its regional forms: `en` matches `en-GB`), for
+ * example a rewording of English that must not touch a Turkish page.
+ */
+export type PackCondition = {
+    languages?: string[];
+};
+/**
+ * A pack's rewording rule: whole words replaced inside the site's own text, wherever it appears
+ * (`{ "Post": "Tweet", "posts": "tweets" }`). It carries none of the site's sentences, so it keeps
+ * working when the site words a string differently, and it applies to a value of the site (or of an
+ * earlier pack) that no later pack replaced. Words are matched exactly (case as written), never
+ * inside a longer word, and never in a parameter's value (a user named "Post" stays "Post").
+ */
+export type PackRewrite = {
+    words: Record<string, string>;
+};
+/** A string pack document: metadata and `key id -> text`. */
+export type StringPack = {
+    format: 1;
+    site: string;
+    catalog: string;
+    /** BCP 47 tag of the pack's language (private-use tags are fine: `en-x-pirate`). */
+    language: string;
+    name: string;
+    authors: string[];
+    /** A language whose plural rules the pack follows when the runtime does not know `language`. */
+    base?: string;
+    /** The pack applies only when this holds (default: always). */
+    when?: PackCondition;
+    /** Rewords the site's text instead of (or besides) replacing keys. */
+    rewrite?: PackRewrite;
+    version?: string;
+    description?: string;
+    strings: Record<string, string>;
+};
+export declare const STRING_PACK_LIMITS: Readonly<{
+    strings: 40000;
+    value: 2000;
+    name: 80;
+    authors: 16;
+}>;
+export declare const MAIN_GROUP = "main";
+/** Whether a pack can replace a value of this kind (a `rich` one only with known `slots`: pass the shape). */
+export declare function translatable(kind: StringKind | Pick<EntryShape, 'kind' | 'slots'>): boolean;
+/** Whether `language` (the site's) satisfies a pack's `when`. */
+export declare function conditionHolds(when: PackCondition | undefined, language: string | undefined): boolean;
+/** 53-bit hash of a text as 11 base-36 characters. Same result in every runtime. */
+export declare function hashText(text: string): string;
+/** The facts the validator and the engine need about one key. */
+export type EntryShape = Pick<InventoryEntry, 'kind' | 'params' | 'plural' | 'select' | 'tags' | 'slots'>;
+export type InventoryLookup = (id: string) => EntryShape | undefined;
+/**
+ * The inventory as it ships inside a page runtime: ids and shapes only, no hashes, a fraction of
+ * the size. `text` and `closed` are space-separated ids; a message is `name name*` (`*` = plural,
+ * `?` = select).
+ */
+export type PageInventory = {
+    site: string;
+    catalog: string;
+    text: string;
+    message: Record<string, string>;
+    closed: string;
+    /** Rich entries a pack can replace: id -> slot count. */
+    rich?: Record<string, number>;
+    /** A slice: only the keys some pack names. A key missing from a slice is not a new key of the site. */
+    partial?: boolean;
+};
+export declare function packInventory(inventory: StringInventory): PageInventory;
+/**
+ * The part of an inventory that the given keys need: what travels to a page together with the
+ * packs it should apply (a page never needs the rest). Keys the inventory does not have are left
+ * out, so they stay unknown there too.
+ */
+export declare function sliceInventory(inventory: StringInventory | PageInventory, ids: Iterable<string>): PageInventory;
+/** Whether untrusted data has the shape of a page inventory (ids and parameter names only). */
+export declare function isPageInventory(input: unknown): input is PageInventory;
+/** A lookup over either form. The page form is decoded on first use. */
+export declare function inventoryLookup(inventory: StringInventory | PageInventory): InventoryLookup;
+export type PackIssue = {
+    level: 'error' | 'warning';
+    key?: string;
+    message: string;
+};
+/** Checks the document envelope. Errors mean the pack is not applied at all. */
+export declare function checkPackShape(input: unknown): PackIssue[];
+/**
+ * Validates one pack value against the key's inventory entry. Returns the parsed message, or the
+ * reason it is refused (the original then stays).
+ */
+export declare function validateString(shape: EntryShape, value: unknown): {
+    parts: Parts;
+} | {
+    reason: string;
+};
+/**
+ * A replaced `rich` value in the shape X's own renderer reads: piece `n` is shown, then the site's
+ * element `order[n]` (the last piece has no element after it).
+ */
+export type RichTemplate = {
+    readonly pieces: readonly string[];
+    readonly order: readonly number[];
+};
+export type CompiledValue = {
+    text: string;
+} | {
+    parts: Parts;
+} | {
+    rich: RichTemplate;
+};
+export type PackReport = {
+    /** Entries in the pack. */
+    total: number;
+    /** Entries that are valid for an inventory key. */
+    valid: number;
+    /** Ids the inventory does not have: never applied. */
+    unknown: string[];
+    /** Values that failed validation: not applied, the original stays. */
+    rejected: {
+        id: string;
+        reason: string;
+    }[];
+};
+export type CompiledPack = {
+    name: string;
+    language: string;
+    base?: string;
+    when?: PackCondition;
+    /** The pack's word rewriting, ready to apply to a text. */
+    rewrite?: (text: string) => string;
+    site: string;
+    catalog: string;
+    values: ReadonlyMap<string, CompiledValue>;
+    report: PackReport;
+};
+/**
+ * Validates a pack against an inventory. Throws on a malformed envelope or a pack for another
+ * site/catalog; every other problem is per key and lands in `report`.
+ */
+export declare function compilePack(input: unknown, inventory: StringInventory | PageInventory): CompiledPack;
+/**
+ * Renders a validated message. A parameter is inserted the way string concatenation would
+ * (`String(value)`, nothing for a missing one); `#` is the plural's own value.
+ */
+export declare function renderMessage(parts: Parts, params: Readonly<Record<string, unknown>>, languages: readonly (string | undefined)[], pound?: unknown): string;
+export type EngineStats = {
+    /** Keys the site registered. */
+    seen: number;
+    /** Keys a pack value was used for. */
+    applied: number;
+    /** Keys the site registered that the inventory does not have (new keys: drift). */
+    unlisted: string[];
+    /** Keys whose live value does not have the inventory's kind: left untouched. */
+    mismatched: string[];
+};
+export type StringEngine = {
+    /**
+     * The value to use for `id`, given the site's own value: a pack's, or exactly `original`.
+     * Feeding a value this engine produced back in returns the same value (idempotent).
+     */
+    resolve(id: string, original: unknown): unknown;
+    /**
+     * The language the site shows (what packs with a `when.languages` condition are checked
+     * against). Set before the first `resolve`; until then conditional packs do not apply.
+     */
+    setLanguage(language: string): void;
+    /** The site's own values of the keys a pack changed: what restoring needs. */
+    originals(): ReadonlyMap<string, unknown>;
+    stats(): EngineStats;
+};
+/** `packs` in application order: a later pack wins over an earlier one for the same key. */
+export declare function createStringEngine(inventory: StringInventory | PageInventory | InventoryLookup, packs: readonly CompiledPack[]): StringEngine;
+/**
+ * The whole catalog at once: a new object with the packs applied; `catalog` itself is not
+ * changed. `applyPacks(applyPacks(c, …), …)` with one engine equals `applyPacks(c, …)`.
+ */
+export declare function applyPacks(catalog: Readonly<Record<string, unknown>>, engine: StringEngine): Record<string, unknown>;
+/** The inverse: every value a pack changed is the site's own again; `catalog` is not changed. */
+export declare function restoreCatalog(catalog: Readonly<Record<string, unknown>>, engine: StringEngine): Record<string, unknown>;
+export type Coverage = {
+    /** Keys a pack can replace (text and messages). */
+    translatable: number;
+    /** Of those, keys the pack has a valid value for. */
+    translated: number;
+    /** Keys that exist but cannot be replaced by data yet (rich text, formatters). */
+    closed: number;
+};
+/** Coverage of a compiled pack per group of the inventory, plus `all`. */
+export declare function coverage(inventory: StringInventory, pack: Pick<CompiledPack, 'values'>): Record<string, Coverage>;
+export type DriftReport = {
+    /** Keys the site has that the inventory lacks. */
+    added: string[];
+    /** Keys whose base-language value changed (same shape). */
+    reworded: string[];
+    /** Keys whose kind or parameters changed: pack values for them have to be checked again. */
+    reshaped: string[];
+    /** Inventory keys the site no longer has. Only for groups whose base catalog was loaded. */
+    vanished: string[];
+};
+/**
+ * Compares an inventory with what was observed now. `loaded` names the groups whose base catalog
+ * was actually read: a key can only be called vanished when its group was (a lazily loaded group
+ * that never arrived says nothing about its keys).
+ */
+export declare function driftReport(inventory: StringInventory, observed: Readonly<Record<string, InventoryEntry>>, loaded: readonly string[]): DriftReport;
+export {};