waybetter 0.1.1 → 0.6.0

package/dist/runtime/stringPackHook.d.ts

@@ -0,0 +1,84 @@
+import { type EngineStats, type PackReport, type PageInventory, type StringEngine, type StringInventory } from './stringPacks.ts';
+/** What an adapter reports to and asks from the framework. None of these throw. */
+export type CatalogSink = {
+    /** A catalog file of this adapter was seen loading (whether or not the hook then matches). */
+    seen(group?: string): void;
+    /** The hook matched: the site is about to register values in `language`. */
+    matched(language: string, group?: string): void;
+    /** The value to register for `id`: a pack's, or exactly `original`. */
+    resolve(id: string, original: unknown): unknown;
+};
+export type CatalogHookAdapter = {
+    /** The catalog (key space) this adapter hooks; packs and the inventory name the same one. */
+    catalog: string;
+    /** Installs the hook at document start; returns its removal. Must not change the site's objects. */
+    install(win: Window, sink: CatalogSink): () => void;
+};
+export type CatalogSetup = {
+    adapter: CatalogHookAdapter;
+    inventory: StringInventory | PageInventory;
+    /** Pack documents in application order (a later one wins). Untrusted data: validated here. */
+    packs: readonly unknown[];
+};
+/**
+ * `ok`: the hook matched and keys went through it.
+ * `not-matched`: a catalog file was seen but the hook did not match it (the site changed).
+ * `no-catalog`: no catalog file was seen at all (another build of the site, or not loaded yet).
+ */
+export type HookStatus = 'pending' | 'ok' | 'not-matched' | 'no-catalog';
+export type CatalogReport = {
+    catalog: string;
+    status: HookStatus;
+    /** Languages the site registered through the hook. */
+    languages: string[];
+    /** Catalog files seen, per group. */
+    seen: Record<string, number>;
+    packs: {
+        name: string;
+        language: string;
+        report: PackReport;
+    }[];
+    /** Pack documents that were refused as a whole. */
+    refused: string[];
+    engine: EngineStats;
+};
+export type StringPacksHandle = {
+    status(catalog?: string): HookStatus;
+    report(): CatalogReport[];
+    /** The engines, per catalog (the originals they keep are what a restore needs). */
+    engine(catalog: string): StringEngine | undefined;
+    dispose(): void;
+};
+export type StringPacksOptions = {
+    /** When the self-check decides (default 15 s after install). */
+    settleMs?: number;
+    /** Called once per catalog when its status is decided (`ok` as soon as it is reached). */
+    onStatus?: (report: CatalogReport) => void;
+    /**
+     * Translate mode: every value passes through here after the packs (the marker of
+     * stringPackTranslate.ts), and the catalog is hooked even without a usable pack.
+     */
+    mark?: (id: string, value: unknown) => unknown;
+};
+/**
+ * Installs the adapters that have at least one usable pack. A catalog without packs is not hooked
+ * (the site runs untouched), so its status stays `pending`.
+ */
+export declare function installStringPacks(win: Window, setups: readonly CatalogSetup[], options?: StringPacksOptions): StringPacksHandle;
+type Chunk = [unknown, Record<string, unknown> | unknown[], ...unknown[]];
+/**
+ * Calls `onChunk(chunk, script)` for every chunk pushed onto `win[name]`, before the site's own
+ * `push` gets it; `script` is the URL of the script doing the push (`''` when unknown). Install at
+ * document start. The array and webpack's own `push` replacement keep working unchanged: the
+ * wrapper calls exactly the `push` that was current when it was read, with the same arguments. An
+ * exception in `onChunk` is swallowed. Returns the removal.
+ */
+export declare function watchChunkArray(win: object, name: string, onChunk: (chunk: Chunk, script: string) => void): () => void;
+/**
+ * Wraps the module factories of one chunk so that what they `require` passes through `map`:
+ * `map(exports)` returns a replacement for that one call, or `undefined` to hand out the module's
+ * own exports. The module itself is never changed (return a shadow, e.g. `Object.create(exports)`).
+ * Only call this for a chunk you have identified; other chunks must stay untouched.
+ */
+export declare function mapChunkRequires(chunk: Chunk, map: (exports: unknown) => unknown): void;
+export {};

package/dist/runtime/stringPackHook.js

@@ -0,0 +1,220 @@
+// String packs in the page (published as `waybetter/runtime/stringPackHook`): the per-site
+// "catalog hook adapter" interface, the installer that connects adapters to the engine of
+// stringPacks.ts, a self-check that says when a hook did not match, and the generic half of a
+// common hook point (a webpack chunk array).
+//
+// How a site hands its strings to its own code is that site's implementation detail, so the hook
+// is an adapter the app supplies. One site can have several catalogs (different builds of the
+// site, different key spaces); each gets its own adapter, inventory and packs.
+//
+// Everything here fails open: an exception inside a wrapper leaves the site's own behaviour as it
+// was, and with no pack installed nothing is hooked at all.
+import { compilePack, createStringEngine, } from "./stringPacks.js";
+/**
+ * Installs the adapters that have at least one usable pack. A catalog without packs is not hooked
+ * (the site runs untouched), so its status stays `pending`.
+ */
+export function installStringPacks(win, setups, options = {}) {
+    const timers = win;
+    const states = setups.map(setup => {
+        const packs = [];
+        const refused = [];
+        for (const document of setup.packs) {
+            try {
+                packs.push(compilePack(document, setup.inventory));
+            }
+            catch (error) {
+                refused.push(error instanceof Error ? error.message : String(error));
+            }
+        }
+        const usable = packs.filter(pack => pack.values.size > 0);
+        return {
+            catalog: setup.adapter.catalog, adapter: setup.adapter, packs, refused, usable,
+            engine: usable.length || options.mark ? createStringEngine(setup.inventory, usable) : null,
+            seen: {}, languages: new Set(), keys: 0, settled: false, told: false,
+            remove: null,
+        };
+    });
+    const status = (state) => {
+        if (state.languages.size && state.keys > 0)
+            return 'ok';
+        if (!state.settled)
+            return 'pending';
+        return Object.keys(state.seen).length ? 'not-matched' : 'no-catalog';
+    };
+    const reportOf = (state) => ({
+        catalog: state.catalog,
+        status: status(state),
+        languages: [...state.languages],
+        seen: { ...state.seen },
+        packs: state.packs.map(pack => ({ name: pack.name, language: pack.language, report: pack.report })),
+        refused: [...state.refused],
+        engine: state.engine?.stats() ?? { seen: 0, applied: 0, unlisted: [], mismatched: [] },
+    });
+    const tell = (state) => {
+        if (state.told || status(state) === 'pending')
+            return;
+        state.told = true;
+        try {
+            options.onStatus?.(reportOf(state));
+        }
+        catch { /* a reporter must not break the page */ }
+    };
+    for (const state of states) {
+        const engine = state.engine;
+        if (!engine)
+            continue;
+        const sink = {
+            seen(group = 'main') { state.seen[group] = (state.seen[group] ?? 0) + 1; },
+            matched(language) { state.languages.add(String(language)); },
+            resolve(id, original) {
+                try {
+                    state.keys += 1;
+                    const resolved = engine.resolve(id, original);
+                    const value = options.mark ? options.mark(id, resolved) : resolved;
+                    if (state.keys === 1)
+                        tell(state);
+                    return value;
+                }
+                catch {
+                    return original;
+                }
+            },
+        };
+        try {
+            state.remove = state.adapter.install(win, sink);
+        }
+        catch {
+            state.remove = null;
+        }
+    }
+    const hooked = states.filter(state => state.engine);
+    const timer = hooked.length
+        ? timers.setTimeout(() => { for (const state of hooked) {
+            state.settled = true;
+            tell(state);
+        } }, options.settleMs ?? 15000)
+        : null;
+    return {
+        status: catalog => {
+            const state = catalog ? states.find(item => item.catalog === catalog) : hooked[0] ?? states[0];
+            return state ? status(state) : 'pending';
+        },
+        report: () => states.map(reportOf),
+        engine: catalog => states.find(item => item.catalog === catalog)?.engine ?? undefined,
+        dispose() {
+            if (timer !== null)
+                timers.clearTimeout(timer);
+            for (const state of states) {
+                try {
+                    state.remove?.();
+                }
+                catch { /* the hook is gone either way */ }
+                state.remove = null;
+            }
+        },
+    };
+}
+/**
+ * Calls `onChunk(chunk, script)` for every chunk pushed onto `win[name]`, before the site's own
+ * `push` gets it; `script` is the URL of the script doing the push (`''` when unknown). Install at
+ * document start. The array and webpack's own `push` replacement keep working unchanged: the
+ * wrapper calls exactly the `push` that was current when it was read, with the same arguments. An
+ * exception in `onChunk` is swallowed. Returns the removal.
+ */
+export function watchChunkArray(win, name, onChunk) {
+    const holder = win;
+    const existing = holder[name];
+    const array = Array.isArray(existing) ? existing : [];
+    if (!Array.isArray(existing))
+        holder[name] = array;
+    const done = new WeakSet();
+    let current = array.push;
+    let active = true;
+    const look = (items) => {
+        if (!active)
+            return;
+        for (let index = 0; index < items.length; index += 1) {
+            const chunk = items[index];
+            if (typeof chunk !== 'object' || chunk === null || done.has(chunk))
+                continue;
+            done.add(chunk);
+            try {
+                onChunk(chunk, holder.document?.currentScript?.src ?? '');
+            }
+            catch {
+                // Fail open: the chunk goes on to the site exactly as it came.
+            }
+        }
+    };
+    try {
+        Object.defineProperty(array, 'push', {
+            configurable: true,
+            enumerable: false,
+            get() {
+                const target = current;
+                return function push(...items) {
+                    look(items);
+                    return target.apply(this, items);
+                };
+            },
+            set(next) { current = next; },
+        });
+    }
+    catch {
+        return () => { };
+    }
+    return () => {
+        active = false;
+        try {
+            if (current === Array.prototype.push)
+                delete array.push;
+            else
+                Object.defineProperty(array, 'push', { configurable: true, enumerable: false, writable: true, value: current });
+        }
+        catch {
+            // Left as the pass-through wrapper.
+        }
+    };
+}
+/**
+ * Wraps the module factories of one chunk so that what they `require` passes through `map`:
+ * `map(exports)` returns a replacement for that one call, or `undefined` to hand out the module's
+ * own exports. The module itself is never changed (return a shadow, e.g. `Object.create(exports)`).
+ * Only call this for a chunk you have identified; other chunks must stay untouched.
+ */
+export function mapChunkRequires(chunk, map) {
+    const modules = chunk[1];
+    if (typeof modules !== 'object' || modules === null)
+        return;
+    const table = modules;
+    for (const id of Object.keys(table)) {
+        const factory = table[id];
+        if (typeof factory !== 'function')
+            continue;
+        table[id] = function (module, exports, require, ...rest) {
+            let through = require;
+            if (typeof require === 'function') {
+                try {
+                    through = new Proxy(require, {
+                        apply(target, self, args) {
+                            const result = Reflect.apply(target, self, args);
+                            try {
+                                const replaced = map(result);
+                                return replaced === undefined ? result : replaced;
+                            }
+                            catch {
+                                return result;
+                            }
+                        },
+                    });
+                }
+                catch {
+                    through = require;
+                }
+            }
+            return factory.call(this, module, exports, through, ...rest);
+        };
+    }
+}
+//# sourceMappingURL=stringPackHook.js.map

package/dist/runtime/stringPackHook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stringPackHook.js","sourceRoot":"","sources":["../../../runtime/src/stringPackHook.ts"],"names":[],"mappings":"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","sourcesContent":["// String packs in the page (published as `waybetter/runtime/stringPackHook`): the per-site\n// \"catalog hook adapter\" interface, the installer that connects adapters to the engine of\n// stringPacks.ts, a self-check that says when a hook did not match, and the generic half of a\n// common hook point (a webpack chunk array).\n//\n// How a site hands its strings to its own code is that site's implementation detail, so the hook\n// is an adapter the app supplies. One site can have several catalogs (different builds of the\n// site, different key spaces); each gets its own adapter, inventory and packs.\n//\n// Everything here fails open: an exception inside a wrapper leaves the site's own behaviour as it\n// was, and with no pack installed nothing is hooked at all.\nimport {\n  compilePack, createStringEngine, type CompiledPack, type EngineStats, type PackReport, type PageInventory, type StringEngine,\n  type StringInventory,\n} from './stringPacks.ts';\n\n// -------------------------------------------------------------------------------------------\n// The adapter interface\n\n/** What an adapter reports to and asks from the framework. None of these throw. */\nexport type CatalogSink = {\n  /** A catalog file of this adapter was seen loading (whether or not the hook then matches). */\n  seen(group?: string): void;\n  /** The hook matched: the site is about to register values in `language`. */\n  matched(language: string, group?: string): void;\n  /** The value to register for `id`: a pack's, or exactly `original`. */\n  resolve(id: string, original: unknown): unknown;\n};\n\nexport type CatalogHookAdapter = {\n  /** The catalog (key space) this adapter hooks; packs and the inventory name the same one. */\n  catalog: string;\n  /** Installs the hook at document start; returns its removal. Must not change the site's objects. */\n  install(win: Window, sink: CatalogSink): () => void;\n};\n\nexport type CatalogSetup = {\n  adapter: CatalogHookAdapter;\n  inventory: StringInventory | PageInventory;\n  /** Pack documents in application order (a later one wins). Untrusted data: validated here. */\n  packs: readonly unknown[];\n};\n\n/**\n * `ok`: the hook matched and keys went through it.\n * `not-matched`: a catalog file was seen but the hook did not match it (the site changed).\n * `no-catalog`: no catalog file was seen at all (another build of the site, or not loaded yet).\n */\nexport type HookStatus = 'pending' | 'ok' | 'not-matched' | 'no-catalog';\n\nexport type CatalogReport = {\n  catalog: string;\n  status: HookStatus;\n  /** Languages the site registered through the hook. */\n  languages: string[];\n  /** Catalog files seen, per group. */\n  seen: Record<string, number>;\n  packs: { name: string; language: string; report: PackReport }[];\n  /** Pack documents that were refused as a whole. */\n  refused: string[];\n  engine: EngineStats;\n};\n\nexport type StringPacksHandle = {\n  status(catalog?: string): HookStatus;\n  report(): CatalogReport[];\n  /** The engines, per catalog (the originals they keep are what a restore needs). */\n  engine(catalog: string): StringEngine | undefined;\n  dispose(): void;\n};\n\nexport type StringPacksOptions = {\n  /** When the self-check decides (default 15 s after install). */\n  settleMs?: number;\n  /** Called once per catalog when its status is decided (`ok` as soon as it is reached). */\n  onStatus?: (report: CatalogReport) => void;\n  /**\n   * Translate mode: every value passes through here after the packs (the marker of\n   * stringPackTranslate.ts), and the catalog is hooked even without a usable pack.\n   */\n  mark?: (id: string, value: unknown) => unknown;\n};\n\ntype TimerWindow = { setTimeout(handler: () => void, ms: number): unknown; clearTimeout(id: never): void };\n\n/**\n * Installs the adapters that have at least one usable pack. A catalog without packs is not hooked\n * (the site runs untouched), so its status stays `pending`.\n */\nexport function installStringPacks(win: Window, setups: readonly CatalogSetup[], options: StringPacksOptions = {}): StringPacksHandle {\n  const timers = win as unknown as TimerWindow;\n  const states = setups.map(setup => {\n    const packs: CompiledPack[] = [];\n    const refused: string[] = [];\n    for (const document of setup.packs) {\n      try {\n        packs.push(compilePack(document, setup.inventory));\n      } catch (error) {\n        refused.push(error instanceof Error ? error.message : String(error));\n      }\n    }\n    const usable = packs.filter(pack => pack.values.size > 0);\n    return {\n      catalog: setup.adapter.catalog, adapter: setup.adapter, packs, refused, usable,\n      engine: usable.length || options.mark ? createStringEngine(setup.inventory, usable) : null,\n      seen: {} as Record<string, number>, languages: new Set<string>(), keys: 0, settled: false, told: false,\n      remove: null as null | (() => void),\n    };\n  });\n  type State = (typeof states)[number];\n\n  const status = (state: State): HookStatus => {\n    if (state.languages.size && state.keys > 0) return 'ok';\n    if (!state.settled) return 'pending';\n    return Object.keys(state.seen).length ? 'not-matched' : 'no-catalog';\n  };\n  const reportOf = (state: State): CatalogReport => ({\n    catalog: state.catalog,\n    status: status(state),\n    languages: [...state.languages],\n    seen: { ...state.seen },\n    packs: state.packs.map(pack => ({ name: pack.name, language: pack.language, report: pack.report })),\n    refused: [...state.refused],\n    engine: state.engine?.stats() ?? { seen: 0, applied: 0, unlisted: [], mismatched: [] },\n  });\n  const tell = (state: State) => {\n    if (state.told || status(state) === 'pending') return;\n    state.told = true;\n    try { options.onStatus?.(reportOf(state)); } catch { /* a reporter must not break the page */ }\n  };\n\n  for (const state of states) {\n    const engine = state.engine;\n    if (!engine) continue;\n    const sink: CatalogSink = {\n      seen(group = 'main') { state.seen[group] = (state.seen[group] ?? 0) + 1; },\n      matched(language) { state.languages.add(String(language)); },\n      resolve(id, original) {\n        try {\n          state.keys += 1;\n          const resolved = engine.resolve(id, original);\n          const value = options.mark ? options.mark(id, resolved) : resolved;\n          if (state.keys === 1) tell(state);\n          return value;\n        } catch {\n          return original;\n        }\n      },\n    };\n    try {\n      state.remove = state.adapter.install(win, sink);\n    } catch {\n      state.remove = null;\n    }\n  }\n\n  const hooked = states.filter(state => state.engine);\n  const timer = hooked.length\n    ? timers.setTimeout(() => { for (const state of hooked) { state.settled = true; tell(state); } }, options.settleMs ?? 15000)\n    : null;\n\n  return {\n    status: catalog => {\n      const state = catalog ? states.find(item => item.catalog === catalog) : hooked[0] ?? states[0];\n      return state ? status(state) : 'pending';\n    },\n    report: () => states.map(reportOf),\n    engine: catalog => states.find(item => item.catalog === catalog)?.engine ?? undefined,\n    dispose() {\n      if (timer !== null) timers.clearTimeout(timer as never);\n      for (const state of states) {\n        try { state.remove?.(); } catch { /* the hook is gone either way */ }\n        state.remove = null;\n      }\n    },\n  };\n}\n\n// -------------------------------------------------------------------------------------------\n// A webpack chunk array as the hook point\n//\n// A webpack site loads its code as chunks pushed onto a global array\n// (`(globalThis.webpackChunk_x ||= []).push([ids, modules, runtime?])`); webpack's runtime later\n// replaces the array's `push` with its own and replays what is already there. Watching the array\n// therefore sees every chunk before its modules are installed, whichever loads first.\n\ntype Chunk = [unknown, Record<string, unknown> | unknown[], ...unknown[]];\n\n/**\n * Calls `onChunk(chunk, script)` for every chunk pushed onto `win[name]`, before the site's own\n * `push` gets it; `script` is the URL of the script doing the push (`''` when unknown). Install at\n * document start. The array and webpack's own `push` replacement keep working unchanged: the\n * wrapper calls exactly the `push` that was current when it was read, with the same arguments. An\n * exception in `onChunk` is swallowed. Returns the removal.\n */\nexport function watchChunkArray(win: object, name: string, onChunk: (chunk: Chunk, script: string) => void): () => void {\n  const holder = win as Record<string, unknown> & { document?: { currentScript?: { src?: string } | null } };\n  const existing = holder[name];\n  const array: unknown[] = Array.isArray(existing) ? existing : [];\n  if (!Array.isArray(existing)) holder[name] = array;\n  const done = new WeakSet<object>();\n  let current: (...items: unknown[]) => number = array.push;\n  let active = true;\n  const look = (items: ArrayLike<unknown>) => {\n    if (!active) return;\n    for (let index = 0; index < items.length; index += 1) {\n      const chunk = items[index];\n      if (typeof chunk !== 'object' || chunk === null || done.has(chunk)) continue;\n      done.add(chunk);\n      try {\n        onChunk(chunk as Chunk, holder.document?.currentScript?.src ?? '');\n      } catch {\n        // Fail open: the chunk goes on to the site exactly as it came.\n      }\n    }\n  };\n  try {\n    Object.defineProperty(array, 'push', {\n      configurable: true,\n      enumerable: false,\n      get() {\n        const target = current;\n        return function push(this: unknown, ...items: unknown[]) {\n          look(items);\n          return target.apply(this, items);\n        };\n      },\n      set(next: (...items: unknown[]) => number) { current = next; },\n    });\n  } catch {\n    return () => {};\n  }\n  return () => {\n    active = false;\n    try {\n      if (current === Array.prototype.push) delete (array as { push?: unknown }).push;\n      else Object.defineProperty(array, 'push', { configurable: true, enumerable: false, writable: true, value: current });\n    } catch {\n      // Left as the pass-through wrapper.\n    }\n  };\n}\n\n/**\n * Wraps the module factories of one chunk so that what they `require` passes through `map`:\n * `map(exports)` returns a replacement for that one call, or `undefined` to hand out the module's\n * own exports. The module itself is never changed (return a shadow, e.g. `Object.create(exports)`).\n * Only call this for a chunk you have identified; other chunks must stay untouched.\n */\nexport function mapChunkRequires(chunk: Chunk, map: (exports: unknown) => unknown): void {\n  const modules = chunk[1];\n  if (typeof modules !== 'object' || modules === null) return;\n  const table = modules as Record<string, unknown>;\n  for (const id of Object.keys(table)) {\n    const factory = table[id];\n    if (typeof factory !== 'function') continue;\n    table[id] = function (this: unknown, module: unknown, exports: unknown, require: unknown, ...rest: unknown[]) {\n      let through = require;\n      if (typeof require === 'function') {\n        try {\n          through = new Proxy(require, {\n            apply(target, self, args) {\n              const result = Reflect.apply(target as (...a: unknown[]) => unknown, self, args);\n              try {\n                const replaced = map(result);\n                return replaced === undefined ? result : replaced;\n              } catch {\n                return result;\n              }\n            },\n          });\n        } catch {\n          through = require;\n        }\n      }\n      return (factory as (...a: unknown[]) => unknown).call(this, module, exports, through, ...rest);\n    };\n  }\n}\n"]}

package/dist/runtime/stringPackTranslate.d.ts

@@ -0,0 +1,59 @@
+import { type InventoryLookup, type PageInventory, type StringPack } from './stringPacks.ts';
+export type Marker = {
+    /** The value with its key's marker (strings, and functions whose result is a string). */
+    mark(id: string, value: unknown): unknown;
+    /** The keys marked in a text, in order. */
+    ids(text: string): string[];
+    /** The text without markers. */
+    strip(text: string): string;
+};
+export declare function createMarker(): Marker;
+/** The author's edits in this tab. */
+export type TranslateDraft = {
+    language: string;
+    name: string;
+    strings: Record<string, string>;
+};
+export declare const DRAFT_KEY = "wayBetter.translateDraft";
+export declare function readDraft(storage: Pick<Storage, 'getItem'>): TranslateDraft | null;
+/** The draft as a pack document for `site`/`catalog`. */
+export declare function draftPack(draft: TranslateDraft, site: string, catalog: string): StringPack;
+/** Checks one edit against the key's shape; `null` when it can be used. */
+export declare function checkEdit(lookup: InventoryLookup, id: string, value: string): string | null;
+export type TranslateWords = {
+    bar: string;
+    hint: string;
+    edits(count: number): string;
+    exportPack: string;
+    copied: string;
+    exit: string;
+    reload: string;
+    key: string;
+    original: string;
+    parameters: string;
+    save: string;
+    cancel: string;
+    remove: string;
+    notTranslatable: string;
+    choose: string;
+};
+/** English defaults (the app passes its own words). */
+export declare const TRANSLATE_WORDS: TranslateWords;
+export type TranslateUiOptions = {
+    inventory: PageInventory;
+    marker: Marker;
+    site: string;
+    catalog: string;
+    words?: Partial<TranslateWords>;
+    /** Leaves translate mode (the app drops the flag and reloads). */
+    exit(): void;
+};
+/**
+ * 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 declare function installTranslateUi(win: Window, options: TranslateUiOptions): {
+    dispose(): void;
+};
+/** The draft as the last pack of a delivery (it applies over the others), when it has any string. */
+export declare function withDraft(packs: readonly unknown[], storage: Pick<Storage, 'getItem'>, site: string, catalog: string, inventory: PageInventory): unknown[];

package/dist/runtime/stringPackTranslate.js

@@ -0,0 +1,264 @@
+// 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', 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 words = { ...TRANSLATE_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 = () => {
+        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) => {
+        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) ? ' (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) => {
+        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