@openpresentation/opf-editor 0.10.6 → 0.11.0

package/dist/templates.js

@@ -0,0 +1,331 @@
+// Templates (RR-32): the headless model behind the Fill template panel. A template is an OPF file
+// with variables; filling it resolves the variables to a concrete deck (core resolveVariables).
+// Everything here reads and writes the document through the session, so a fill, a declaration
+// and a token insertion are validated, undoable JSON Patch edits like any other. Importing this
+// module needs no DOM. Core is read from the namespace so an older core still loads this module;
+// the functions then throw "templates-unavailable".
+import * as core from "@openpresentation/opf";
+import { OPFEditorError, getValueAtPath, opfPathToJsonPointer } from "./index.js";
+
+const VARIABLE_ID = /^[a-z][a-z0-9-]*$/;
+const KINDS = ["color", "text", "number", "date", "image", "url", "list"];
+
+/** The form control each variable kind uses. */
+export const TEMPLATE_INPUT_TYPES = Object.freeze({
+  color: "color",
+  text: "text",
+  number: "number",
+  date: "date",
+  image: "image",
+  url: "url",
+  list: "list",
+});
+
+function fail(code, message, details) {
+  return new OPFEditorError(code, message, details);
+}
+
+function requireCore() {
+  if (typeof core.resolveVariables !== "function" || typeof core.listVariables !== "function") {
+    throw fail("templates-unavailable", "Templates need a core release that ships resolveVariables (@openpresentation/opf after 0.11.4).");
+  }
+}
+
+function checkEditor(editor) {
+  if (!editor || typeof editor.applyPatch !== "function" || typeof editor.subscribe !== "function") {
+    throw fail("invalid-editor", "Expected an editor session created by createEditorSession.");
+  }
+}
+
+const isObject = (value) => value !== null && typeof value === "object" && !Array.isArray(value);
+
+/** True when the core this editor runs on can resolve template variables. */
+export function templatesAvailable() {
+  return typeof core.resolveVariables === "function" && typeof core.listVariables === "function";
+}
+
+/** True when the document is marked as a template (`template: true`). */
+export function isTemplateDocument(document) {
+  return isObject(document) && document.template === true;
+}
+
+/** True when the document is a template or declares a variable that is not a color. */
+export function hasTemplateVariables(document) {
+  return templatesAvailable() && core.hasContentVariables(document);
+}
+
+function humanize(id) {
+  const words = id.replaceAll("-", " ");
+  return words.charAt(0).toUpperCase() + words.slice(1);
+}
+
+/** The text a form control shows for a value. Rich text shows its plain text. */
+export function valueToFieldText(kind, value) {
+  if (value === undefined || value === null) return "";
+  switch (kind) {
+    case "list":
+      return Array.isArray(value) ? value.join("\n") : String(value);
+    case "image":
+      return isObject(value) ? String(value.src ?? "") : String(value);
+    case "text":
+      if (Array.isArray(value)) return value.map((run) => (typeof run === "string" ? run : String(run?.text ?? ""))).join("");
+      return String(value);
+    default:
+      return String(value);
+  }
+}
+
+/**
+ * Parse what a form control holds. A blank control clears the value (the declared value, if any,
+ * applies again). Returns `{ ok: true, value }` (value undefined when cleared) or `{ ok: false, message }`.
+ */
+export function fieldTextToValue(kind, text) {
+  requireCore();
+  if (typeof text !== "string") return { ok: false, message: "Expected text." };
+  if (text.trim() === "") return { ok: true, value: undefined };
+  const coerced = core.coerceVariableValue(kind, kind === "text" ? text : text.trim());
+  return coerced.ok ? { ok: true, value: coerced.value } : { ok: false, message: `${coerced.message}.` };
+}
+
+/**
+ * The variables of a document as form fields, with the state a panel needs:
+ * `status` is "filled" (a value was supplied), "default" (the declaration has a value), "unfilled"
+ * (required, no value) or "optional" (not required, no value).
+ */
+export function listTemplateFields(document, values = {}) {
+  requireCore();
+  const declared = new Map(core.variableDeclarations(document).map((declaration) => [declaration.id, declaration]));
+  return core.listVariables(document, values).map((info) => {
+    const declaration = declared.get(info.id);
+    const supplied = Object.hasOwn(values, info.id) && values[info.id] !== undefined && values[info.id] !== null;
+    const defaultValue = declaration?.value;
+    const value = supplied ? info.value : defaultValue;
+    const status = supplied ? "filled" : defaultValue !== undefined ? "default" : info.required ? "unfilled" : "optional";
+    return {
+      id: info.id,
+      kind: info.kind,
+      input: TEMPLATE_INPUT_TYPES[info.kind],
+      label: info.label ?? humanize(info.id),
+      description: info.description,
+      required: info.required,
+      format: info.format,
+      example: info.example,
+      value,
+      defaultValue,
+      text: supplied ? valueToFieldText(info.kind, value) : "",
+      placeholder: valueToFieldText(info.kind, defaultValue !== undefined ? defaultValue : info.example),
+      rich: info.kind === "text" && Array.isArray(value),
+      status,
+      uses: info.uses,
+    };
+  });
+}
+
+/** The summary a panel shows: how many required variables still need a value. */
+export function templateStatus(document, values = {}) {
+  const fields = listTemplateFields(document, values);
+  const required = fields.filter((field) => field.required);
+  const unfilled = fields.filter((field) => field.status === "unfilled").map((field) => field.id);
+  return {
+    template: isTemplateDocument(document),
+    fieldCount: fields.length,
+    requiredCount: required.length,
+    filledRequiredCount: required.length - unfilled.length,
+    unfilled,
+    complete: unfilled.length === 0,
+  };
+}
+
+/**
+ * Preview data for the supplied values: the concrete deck with each unfilled variable's example (or its
+ * token when it has none). Never throws for missing values; the diagnostics say what was unfilled.
+ */
+export function previewTemplate(document, values = {}) {
+  requireCore();
+  return core.resolveVariables(document, values, { examples: true, partial: true });
+}
+
+/**
+ * A fill session over an editor: values live here until `apply()` fills the document with them as one
+ * undoable edit. `set`/`setText`/`clear` change a value, `preview()` shows the result without touching the
+ * document, `subscribe` notifies listeners (a panel redraws on it).
+ */
+export function createTemplateFill(editor, options = {}) {
+  requireCore();
+  checkEditor(editor);
+  let values = {};
+  const listeners = new Set();
+  const emit = () => {
+    for (const listener of listeners) listener(api);
+  };
+  const declared = () => new Set(core.variableDeclarations(editor.document).map((declaration) => declaration.id));
+  const kindOf = (id) => core.variableDeclarations(editor.document).find((declaration) => declaration.id === id)?.kind;
+  const api = {
+    get values() {
+      return structuredClone(values);
+    },
+    fields() {
+      return listTemplateFields(editor.document, values);
+    },
+    status() {
+      return templateStatus(editor.document, values);
+    },
+    preview() {
+      return previewTemplate(editor.document, values);
+    },
+    set(id, value) {
+      if (!declared().has(id)) throw fail("unknown-variable", `No variable '${id}' is declared.`, { id });
+      if (value === undefined || value === null) {
+        delete values[id];
+      } else {
+        const coerced = core.coerceVariableValue(kindOf(id), value);
+        if (!coerced.ok) throw fail("invalid-variable-value", `Value for '${id}': ${coerced.message}.`, { id });
+        values[id] = coerced.value;
+      }
+      emit();
+      return api;
+    },
+    setText(id, text) {
+      if (!declared().has(id)) throw fail("unknown-variable", `No variable '${id}' is declared.`, { id });
+      const parsed = fieldTextToValue(kindOf(id), text);
+      if (!parsed.ok) return parsed;
+      api.set(id, parsed.value);
+      return { ok: true, value: parsed.value };
+    },
+    clear(id) {
+      return api.set(id, undefined);
+    },
+    /** Drop values for variables the document no longer declares (after an edit removed one). */
+    prune() {
+      const known = declared();
+      let changed = false;
+      for (const id of Object.keys(values)) if (!known.has(id)) { delete values[id]; changed = true; }
+      if (changed) emit();
+      return api;
+    },
+    reset() {
+      values = {};
+      emit();
+      return api;
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    /**
+     * Fill the document: the variables are resolved with the values, and the concrete deck replaces the
+     * document as one undoable, validated edit. Unfilled required variables refuse the fill unless
+     * `partial` is set (the unfilled ones stay declared for a later pass).
+     */
+    apply({ partial = false, meta = {} } = {}) {
+      const document = editor.document;
+      const result = core.resolveVariables(document, values, { partial, template: false });
+      const errors = result.diagnostics.filter((entry) => entry.severity === "error");
+      if (errors.length) {
+        const unfilled = errors.some((entry) => entry.code === "variable-unfilled");
+        throw fail(unfilled ? "unfilled-variables" : "invalid-variables", errors[0].message, { issues: errors, unfilled: result.unfilled });
+      }
+      const change = editor.applyPatch([{ op: "replace", path: "", value: result.presentation }], {
+        source: "template-fill",
+        rejectInvalid: true,
+        ...meta,
+        ...options.meta,
+      });
+      values = {};
+      emit();
+      return { ...change, unfilled: result.unfilled, complete: result.complete, diagnostics: result.diagnostics };
+    },
+  };
+  return api;
+}
+
+/** The token text for a variable: `{{id}}`, or `{{id|format}}` with a one-off format. */
+export function variableToken(id, format) {
+  if (!VARIABLE_ID.test(id)) throw fail("invalid-variable-id", "A variable id is lowercase kebab-case: letters, digits and hyphens, starting with a letter.", { id });
+  return format ? `{{${id}|${format}}}` : `{{${id}}}`;
+}
+
+/** An unused variable id derived from a label, for a "new variable" form. */
+export function suggestVariableId(document, label = "value") {
+  const base = String(label).normalize("NFKD").replace(/[̀-ͯ]/g, "").toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "").replace(/^[^a-z]+/, "") || "value";
+  const taken = new Set(isObject(document?.variables) ? Object.keys(document.variables) : []);
+  if (!taken.has(base)) return base;
+  for (let n = 2; ; n++) if (!taken.has(`${base}-${n}`)) return `${base}-${n}`;
+}
+
+function declarationPatches(document, id, declaration) {
+  if (!VARIABLE_ID.test(id)) throw fail("invalid-variable-id", "A variable id is lowercase kebab-case: letters, digits and hyphens, starting with a letter.", { id });
+  const entry = typeof declaration === "string" ? declaration : structuredClone(declaration);
+  if (typeof entry !== "string" && !(isObject(entry) && KINDS.includes(entry.type))) {
+    throw fail("invalid-variable", `A variable declaration is a hex color or an object whose type is one of ${KINDS.join(", ")}.`, { id });
+  }
+  const variables = document.variables;
+  if (variables !== undefined && !isObject(variables)) throw fail("invalid-variable", "The document's variables field is not an object.", { id });
+  if (variables && Object.hasOwn(variables, id)) throw fail("variable-exists", `A variable '${id}' is already declared.`, { id });
+  return variables === undefined
+    ? [{ op: "add", path: "/variables", value: { [id]: entry } }]
+    : [{ op: "add", path: opfPathToJsonPointer(["variables", id]), value: entry }];
+}
+
+/** Declare a variable as one undoable edit. The resulting document must validate (a required variable with no value needs `template: true`). */
+export function declareVariable(editor, id, declaration, meta = {}) {
+  requireCore();
+  checkEditor(editor);
+  return editor.applyPatch(declarationPatches(editor.document, id, declaration), { source: "template-variable", rejectInvalid: true, ...meta });
+}
+
+/** Mark the document as a template (or, with `false`, as a normal deck) as one undoable edit. */
+export function setTemplate(editor, enabled, meta = {}) {
+  checkEditor(editor);
+  const document = editor.document;
+  const present = Object.hasOwn(document, "template");
+  const patches = enabled
+    ? [{ op: present ? "replace" : "add", path: "/template", value: true }]
+    : present
+      ? [{ op: "remove", path: "/template" }]
+      : [];
+  if (!patches.length) return { document, patches: [], inversePatches: [], validation: editor.validation };
+  return editor.applyPatch(patches, { source: "template-mode", rejectInvalid: true, ...meta });
+}
+
+/**
+ * Insert a variable token into a text field as one undoable edit. `path` addresses a string, or a TextRun[]
+ * (`runIndex` picks the run, default the last). `start`/`end` are UTF-16 offsets into that string (a
+ * selection is replaced; default: the end). To use a variable that is not declared yet pass `declare`,
+ * the declaration, and both changes commit together.
+ */
+export function insertVariableToken(editor, path, id, { start, end, runIndex, format, declare, meta = {} } = {}) {
+  requireCore();
+  checkEditor(editor);
+  const document = editor.document;
+  const token = variableToken(id, format);
+  const patches = [];
+  const declaredNow = isObject(document.variables) && Object.hasOwn(document.variables, id);
+  if (!declaredNow) {
+    if (declare === undefined) throw fail("unknown-variable", `No variable '${id}' is declared. Declare it first, or pass its declaration.`, { id });
+    patches.push(...declarationPatches(document, id, declare));
+  }
+  const pointer = opfPathToJsonPointer(path);
+  const current = getValueAtPath(document, path);
+  const splice = (text) => {
+    const from = start === undefined ? text.length : start;
+    const to = end === undefined ? from : end;
+    if (!Number.isInteger(from) || !Number.isInteger(to) || from < 0 || to < from || to > text.length) {
+      throw fail("invalid-selection", "The selection is outside the text.", { start: from, end: to });
+    }
+    return `${text.slice(0, from)}${token}${text.slice(to)}`;
+  };
+  if (typeof current === "string") {
+    patches.push({ op: "replace", path: pointer, value: splice(current) });
+  } else if (Array.isArray(current) && current.length) {
+    const index = runIndex ?? current.length - 1;
+    const run = current[index];
+    if (typeof run === "string") patches.push({ op: "replace", path: `${pointer}/${index}`, value: splice(run) });
+    else if (isObject(run) && typeof run.text === "string") patches.push({ op: "replace", path: `${pointer}/${index}/text`, value: splice(run.text) });
+    else throw fail("not-text", "That run has no text to insert into.", { path });
+  } else {
+    throw fail("not-text", "Select a text field (a string or rich text runs) to insert a variable.", { path });
+  }
+  const change = editor.applyPatch(patches, { source: "template-token", rejectInvalid: true, ...meta });
+  return { ...change, token };
+}

package/dist/zip.d.ts

@@ -0,0 +1,4 @@
+/** CRC-32 of the bytes, as an unsigned integer. */
+export declare function crc32(bytes: Uint8Array): number;
+/** A ZIP archive of `[{ name, bytes }]` (deflated when the platform can, stored otherwise; fixed timestamps so equal input gives equal bytes). */
+export declare function createZip(entries: Array<{ name: string; bytes: Uint8Array }>, options?: { compress?: boolean; signal?: AbortSignal }): Promise<Uint8Array>;

package/dist/zip.js

@@ -0,0 +1,71 @@
+// A minimal ZIP writer for the multi-file downloads (all slides as PNG or SVG). One archive, no dependency, a fixed
+// timestamp (1980-01-01) so the same files always give the same bytes. Entries are stored, or deflated when the
+// platform has CompressionStream (the SVG slides compress well; the PNGs do not need it).
+
+const CRC_TABLE = (() => {
+  const table = new Uint32Array(256);
+  for (let index = 0; index < 256; index++) {
+    let value = index;
+    for (let bit = 0; bit < 8; bit++) value = value & 1 ? 0xedb88320 ^ (value >>> 1) : value >>> 1;
+    table[index] = value >>> 0;
+  }
+  return table;
+})();
+
+/** CRC-32 of the bytes, as an unsigned integer. */
+export function crc32(bytes) {
+  let crc = 0xffffffff;
+  for (let index = 0; index < bytes.length; index++) crc = CRC_TABLE[(crc ^ bytes[index]) & 0xff] ^ (crc >>> 8);
+  return (crc ^ 0xffffffff) >>> 0;
+}
+
+async function deflateRaw(bytes) {
+  const stream = new Blob([bytes]).stream().pipeThrough(new CompressionStream("deflate-raw"));
+  return new Uint8Array(await new Response(stream).arrayBuffer());
+}
+
+/**
+ * Build a ZIP archive from `[{ name, bytes }]`. `compress` (default true) deflates an entry when that makes it smaller and the
+ * platform can; the result is a valid ZIP either way. `signal` stops between entries.
+ */
+export async function createZip(entries, { compress = true, signal } = {}) {
+  const encoder = new TextEncoder();
+  const canDeflate = compress && typeof CompressionStream === "function" && typeof Blob === "function";
+  const local = [], central = [];
+  let offset = 0;
+  for (const entry of entries) {
+    signal?.throwIfAborted?.();
+    const name = encoder.encode(entry.name);
+    const bytes = entry.bytes instanceof Uint8Array ? entry.bytes : new Uint8Array(entry.bytes);
+    const crc = crc32(bytes);
+    let stored = bytes, method = 0;
+    if (canDeflate && bytes.length > 64) {
+      const packed = await deflateRaw(bytes);
+      if (packed.length < bytes.length) { stored = packed; method = 8; }
+    }
+    // 2.0 to extract deflate; bit 11 says the name is UTF-8; time 00:00:00, date 1980-01-01.
+    const header = new DataView(new ArrayBuffer(30));
+    header.setUint32(0, 0x04034b50, true); header.setUint16(4, 20, true); header.setUint16(6, 0x0800, true); header.setUint16(8, method, true);
+    header.setUint16(10, 0, true); header.setUint16(12, 0x21, true);
+    header.setUint32(14, crc, true); header.setUint32(18, stored.length, true); header.setUint32(22, bytes.length, true);
+    header.setUint16(26, name.length, true); header.setUint16(28, 0, true);
+    local.push(new Uint8Array(header.buffer), name, stored);
+    const directory = new DataView(new ArrayBuffer(46));
+    directory.setUint32(0, 0x02014b50, true); directory.setUint16(4, 20, true); directory.setUint16(6, 20, true); directory.setUint16(8, 0x0800, true); directory.setUint16(10, method, true);
+    directory.setUint16(12, 0, true); directory.setUint16(14, 0x21, true);
+    directory.setUint32(16, crc, true); directory.setUint32(20, stored.length, true); directory.setUint32(24, bytes.length, true);
+    directory.setUint16(28, name.length, true); directory.setUint32(42, offset, true);
+    central.push(new Uint8Array(directory.buffer), name);
+    offset += 30 + name.length + stored.length;
+  }
+  const size = central.reduce((total, part) => total + part.length, 0);
+  const end = new DataView(new ArrayBuffer(22));
+  end.setUint32(0, 0x06054b50, true); end.setUint16(8, entries.length, true); end.setUint16(10, entries.length, true);
+  end.setUint32(12, size, true); end.setUint32(16, offset, true);
+  const parts = [...local, ...central, new Uint8Array(end.buffer)];
+  const out = new Uint8Array(parts.reduce((total, part) => total + part.length, 0));
+  let position = 0;
+  for (const part of parts) { out.set(part, position); position += part.length; }
+  if (offset > 0xfffffffe || entries.length > 0xfffe) throw new Error("The archive is too large for a ZIP file without ZIP64. Export fewer slides at a time.");
+  return out;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openpresentation/opf-editor",
-  "version": "0.10.6",
+  "version": "0.11.0",
   "description": "Embeddable local OPF editor primitives built on the deterministic renderer.",
   "license": "MIT",
   "type": "module",
@@ -78,31 +78,163 @@
       "types": "./dist/json-options.d.ts",
       "default": "./dist/json-options.js"
     },
+    "./export": {
+      "types": "./dist/export.d.ts",
+      "default": "./dist/export.js"
+    },
     "./switches": {
       "types": "./dist/switches.d.ts",
       "default": "./dist/switches.js"
+    },
+    "./block-convert": {
+      "types": "./dist/block-convert.d.ts",
+      "default": "./dist/block-convert.js"
+    },
+    "./design-options": {
+      "types": "./dist/design-options.d.ts",
+      "default": "./dist/design-options.js"
+    },
+    "./tables": {
+      "types": "./dist/table-options.d.ts",
+      "default": "./dist/table-options.js"
+    },
+    "./design-controls": {
+      "types": "./dist/design-controls.d.ts",
+      "default": "./dist/design-controls.js"
+    },
+    "./templates": {
+      "types": "./dist/templates.d.ts",
+      "default": "./dist/templates.js"
+    },
+    "./template-panel": {
+      "types": "./dist/template-panel.d.ts",
+      "default": "./dist/template-panel.js"
+    },
+    "./assets": {
+      "types": "./dist/assets.d.ts",
+      "default": "./dist/assets.js"
+    },
+    "./backgrounds": {
+      "types": "./dist/background-options.d.ts",
+      "default": "./dist/background-options.js"
+    },
+    "./review": {
+      "types": "./dist/review.d.ts",
+      "default": "./dist/review.js"
+    },
+    "./review-panel": {
+      "types": "./dist/review-panel.d.ts",
+      "default": "./dist/review-panel.js"
+    },
+    "./content-actions": {
+      "types": "./dist/content-actions.d.ts",
+      "default": "./dist/content-actions.js"
+    },
+    "./image-crop": {
+      "types": "./dist/image-crop.d.ts",
+      "default": "./dist/image-crop.js"
+    },
+    "./image-cropper": {
+      "types": "./dist/image-cropper.d.ts",
+      "default": "./dist/image-cropper.js"
+    },
+    "./find": {
+      "types": "./dist/find-replace.d.ts",
+      "default": "./dist/find-replace.js"
+    },
+    "./find-panel": {
+      "types": "./dist/find-panel.d.ts",
+      "default": "./dist/find-panel.js"
+    },
+    "./data-grid": {
+      "types": "./dist/data-grid.d.ts",
+      "default": "./dist/data-grid.js"
+    },
+    "./chart-data": {
+      "types": "./dist/chart-data.d.ts",
+      "default": "./dist/chart-data.js"
+    },
+    "./grid-text": {
+      "types": "./dist/grid-text.d.ts",
+      "default": "./dist/grid-text.js"
+    },
+    "./slides": {
+      "types": "./dist/slides.d.ts",
+      "default": "./dist/slides.js"
+    },
+    "./outline": {
+      "types": "./dist/outline.d.ts",
+      "default": "./dist/outline.js"
+    },
+    "./slide-manager": {
+      "types": "./dist/slide-manager.d.ts",
+      "default": "./dist/slide-manager.js"
+    },
+    "./outline-view": {
+      "types": "./dist/outline-view.d.ts",
+      "default": "./dist/outline-view.js"
+    },
+    "./persistence": {
+      "types": "./dist/persistence.d.ts",
+      "default": "./dist/persistence.js"
+    },
+    "./persistence-ui": {
+      "types": "./dist/persistence-ui.d.ts",
+      "default": "./dist/persistence-ui.js"
+    },
+    "./chart-options": {
+      "types": "./dist/chart-options.d.ts",
+      "default": "./dist/chart-options.js"
+    },
+    "./chart-options-panel": {
+      "types": "./dist/chart-options-panel.d.ts",
+      "default": "./dist/chart-options-panel.js"
+    },
+    "./numbering": {
+      "types": "./dist/numbering.d.ts",
+      "default": "./dist/numbering.js"
+    },
+    "./numbering-panel": {
+      "types": "./dist/numbering-panel.d.ts",
+      "default": "./dist/numbering-panel.js"
+    },
+    "./annotations": {
+      "types": "./dist/annotations.d.ts",
+      "default": "./dist/annotations.js"
     }
   },
   "types": "./dist/index.d.ts",
   "sideEffects": false,
   "scripts": {
     "build": "node scripts/build.mjs",
-    "typecheck": "node --check src/index.js && node --check src/react.js && node --check src/svelte.js && node --check scripts/build.mjs && node --check scripts/validate-package.mjs && node --check test/smoke.mjs && node --check test/component-smoke.mjs && node --check src/canvas.js && node --check src/canvas-fields.js && node --check test/canvas-fields.mjs && node --check test/browser-canvas.mjs && node --check src/transfer.js && node --check src/presentation-ids.js && node --check src/font-defaults.js && node --check src/color-authoring.js && node --check test/presentation-ids.mjs && node --check src/galleries.js && node --check examples/transfer-controls.js && node --check src/schema.js && node --check src/schema-inspector.js && node --check test/rich-table-browser.mjs && node --check test/styled-table.mjs && node --check test/styled-table-browser.mjs && node --check examples/pptx-controls.js && node --check scripts/build-playground.mjs && node --check test/playground-pptx.mjs && node --check test/playground-script-fonts.mjs && node --check test/playground-lazy-fonts.mjs && node --check test/playground-base-fonts.mjs && node --check src/text-input.js && node --check src/rich-text.js && node --check src/rich-text-input.js && node --check src/rich-text-toolbar.js && node --check test/rich-text.mjs && node --check test/rich-input-browser.mjs && node --check src/json-editor.js && node --check src/json-menu.js && node --check src/json-options.js && node --check src/json-source.js && node --check src/switches.js && node --check test/switches.mjs && node --check test/switches-export.mjs && node --check test/placeholder-selection.mjs && node --check test/selection-browser.mjs && node --check scripts/check-font-hotlinks.mjs && node --check scripts/check-font-hotlinks.test.mjs && node --check src/exact-source.js && node --check test/exact-source.mjs && node --check test/playground-source.mjs && node --check src/font-gate.js && node --check test/font-gate.mjs && node --check test/font-gate-registry.mjs && node --check test/playground-ensure-fonts.mjs && node --check test/canvas-fonts-browser.mjs && node --check src/text-pointer.js && node --check test/click-entry-browser.mjs",
-    "test": "npm run build && npm run check:font-hotlinks && node test/accepted-text.mjs && node test/smoke.mjs && node test/component-smoke.mjs && node test/canvas-fields.mjs && node test/transfer.mjs && node test/gallery-font-roles.mjs && node test/default-font-scheme.mjs && node test/presentation-ids.mjs && node test/schema.mjs && node test/rich-text.mjs && node test/layout.mjs && node test/blocks.mjs && node test/styled-table.mjs && node test/json-source.mjs && node test/json-options.mjs && node test/switches.mjs && node test/switches-export.mjs && node test/placeholder-selection.mjs && node test/exact-source.mjs && node test/font-gate.mjs && node test/font-gate-registry.mjs",
+    "typecheck": "node --check src/index.js && node --check src/annotations.js && node --check test/annotations.mjs && node --check src/react.js && node --check src/svelte.js && node --check scripts/build.mjs && node --check scripts/validate-package.mjs && node --check test/smoke.mjs && node --check test/component-smoke.mjs && node --check src/canvas.js && node --check src/canvas-fields.js && node --check test/canvas-fields.mjs && node --check test/browser-canvas.mjs && node --check src/transfer.js && node --check src/presentation-ids.js && node --check src/font-defaults.js && node --check src/color-authoring.js && node --check test/presentation-ids.mjs && node --check src/galleries.js && node --check examples/transfer-controls.js && node --check src/schema.js && node --check src/schema-inspector.js && node --check test/rich-table-browser.mjs && node --check test/styled-table.mjs && node --check test/styled-table-browser.mjs && node --check examples/pptx-controls.js && node --check scripts/build-playground.mjs && node --check test/playground-pptx.mjs && node --check test/playground-script-fonts.mjs && node --check test/playground-lazy-fonts.mjs && node --check test/playground-base-fonts.mjs && node --check src/text-input.js && node --check src/rich-text.js && node --check src/rich-text-input.js && node --check src/rich-text-toolbar.js && node --check test/rich-text.mjs && node --check test/rich-input-browser.mjs && node --check src/json-editor.js && node --check src/json-menu.js && node --check src/json-options.js && node --check src/json-source.js && node --check src/switches.js && node --check test/switches.mjs && node --check test/switches-export.mjs && node --check test/placeholder-selection.mjs && node --check test/selection-browser.mjs && node --check scripts/check-font-hotlinks.mjs && node --check scripts/check-font-hotlinks.test.mjs && node --check src/exact-source.js && node --check test/exact-source.mjs && node --check test/playground-source.mjs && node --check src/font-gate.js && node --check test/font-gate.mjs && node --check test/font-gate-registry.mjs && node --check test/playground-ensure-fonts.mjs && node --check test/canvas-fonts-browser.mjs && node --check src/text-pointer.js && node --check test/click-entry-browser.mjs && node --check src/edit-helpers.js && node --check src/block-convert.js && node --check src/design-options.js && node --check src/table-options.js && node --check src/design-controls.js && node --check test/block-convert.mjs && node --check test/design-options.mjs && node --check test/table-options.mjs && node --check test/switches-ui.mjs && node --check test/design-controls-browser.mjs && node --check src/assets.js && node --check src/chart-options.js && node --check src/chart-options-panel.js && node --check examples/chart-controls.js && node --check test/chart-options.mjs && node --check test/chart-options-browser.mjs && node --check src/background-options.js && node --check test/assets.mjs && node --check test/background-options.mjs && node --check test/design-gaps-browser.mjs && node --check src/templates.js && node --check src/template-panel.js && node --check examples/template-controls.js && node --check test/templates.mjs && node --check test/template-panel-browser.mjs && node --check src/grid-text.js && node --check src/grid-model.js && node --check src/table-structure.js && node --check src/chart-data.js && node --check src/data-grid.js && node --check test/data-grid.mjs && node --check test/data-grid-browser.mjs && node --check src/slides.js && node --check src/outline.js && node --check src/slide-manager.js && node --check src/outline-view.js && node --check test/slides.mjs && node --check test/outline.mjs && node --check test/slides-browser.mjs && node --check src/persistence.js && node --check src/persistence-ui.js && node --check test/persistence.mjs && node --check test/persistence-browser.mjs && node --check src/find-replace.js && node --check src/find-panel.js && node --check src/image-crop.js && node --check src/image-cropper.js && node --check examples/find-controls.js && node --check examples/crop-controls.js && node --check examples/mobile-controls.js && node --check test/find-replace.mjs && node --check test/image-crop.mjs && node --check test/support/playground-harness.mjs && node --check test/find-replace-browser.mjs && node --check test/image-crop-browser.mjs && node --check test/mobile-browser.mjs && node --check src/content-actions.js && node --check src/content-controls.js && node --check test/content-actions.mjs && node --check test/font-gate-latin-families.mjs && node --check src/review.js && node --check src/review-panel.js && node --check examples/review-controls.js && node --check test/review.mjs && node --check test/review-panel-browser.mjs && node --check test/patch.mjs && node --check src/export.js && node --check src/zip.js && node --check examples/download-controls.js && node --check test/export.mjs && node --check test/playground-download.mjs && node --check src/numbering.js && node --check src/numbering-panel.js && node --check examples/numbering-controls.js && node --check test/numbering.mjs && node --check test/numbering-panel-browser.mjs",
+    "test": "npm run build && npm run check:font-hotlinks && node test/accepted-text.mjs && node test/smoke.mjs && node test/component-smoke.mjs && node test/canvas-fields.mjs && node test/transfer.mjs && node test/gallery-font-roles.mjs && node test/default-font-scheme.mjs && node test/presentation-ids.mjs && node test/schema.mjs && node test/rich-text.mjs && node test/layout.mjs && node test/blocks.mjs && node test/styled-table.mjs && node test/json-source.mjs && node test/json-options.mjs && node test/switches.mjs && node test/block-convert.mjs && node test/design-options.mjs && node test/templates.mjs && node test/table-options.mjs && node test/annotations.mjs && node test/switches-ui.mjs && node test/assets.mjs && node test/chart-options.mjs && node test/background-options.mjs && node test/slides.mjs && node test/outline.mjs && node test/persistence.mjs && node test/switches-export.mjs && node test/placeholder-selection.mjs && node test/exact-source.mjs && node test/font-gate.mjs && node test/data-grid.mjs && node test/font-gate-registry.mjs && node test/find-replace.mjs && node test/image-crop.mjs && node test/content-actions.mjs && node test/font-gate-latin-families.mjs && node test/review.mjs && node test/patch.mjs && node test/export.mjs && node test/numbering.mjs",
     "validate": "node scripts/validate-package.mjs",
     "test:packed": "node test/packed-install.mjs",
     "prepack": "npm run build",
     "check:font-hotlinks": "node --test scripts/check-font-hotlinks.test.mjs && node scripts/check-font-hotlinks.mjs",
     "check:font-hotlinks:built": "node scripts/check-font-hotlinks.mjs --built dist artifacts/playground",
     "build:playground": "node scripts/build-playground.mjs",
-    "test:playground": "npm run build:playground && npm run check:font-hotlinks:built && node test/playground-pptx.mjs && node test/playground-script-fonts.mjs artifacts/playground-script-fonts && node test/playground-lazy-fonts.mjs artifacts/playground-lazy-fonts && node test/playground-base-fonts.mjs artifacts/playground-base-fonts && node test/playground-source.mjs && node test/playground-ensure-fonts.mjs artifacts/playground-ensure-fonts && node test/canvas-fonts-browser.mjs artifacts/canvas-fonts",
+    "test:playground": "npm run build:playground && npm run check:font-hotlinks:built && node test/playground-pptx.mjs && node test/playground-script-fonts.mjs artifacts/playground-script-fonts && node test/playground-lazy-fonts.mjs artifacts/playground-lazy-fonts && node test/playground-base-fonts.mjs artifacts/playground-base-fonts && node test/playground-source.mjs && node test/design-controls-browser.mjs && node test/design-gaps-browser.mjs && node test/chart-options-browser.mjs && node test/persistence-browser.mjs && node test/slides-browser.mjs && node test/template-panel-browser.mjs && node test/numbering-panel-browser.mjs && node test/playground-ensure-fonts.mjs artifacts/playground-ensure-fonts && node test/canvas-fonts-browser.mjs artifacts/canvas-fonts && node test/find-replace-browser.mjs && node test/image-crop-browser.mjs && node test/mobile-browser.mjs && node test/review-panel-browser.mjs && node test/playground-download.mjs artifacts/playground-download",
     "test:code-browser": "node test/code-browser.mjs",
     "test:selection-browser": "node test/selection-browser.mjs",
     "test:click-entry-browser": "node test/click-entry-browser.mjs",
     "test:metric-browser": "node test/metric-browser.mjs",
     "test:rich-input-browser": "node test/rich-input-browser.mjs",
     "test:json": "npm run build && node test/json-source.mjs && node test/json-options.mjs",
-    "test:json-browser": "node test/json-editor-browser.mjs"
+    "test:json-browser": "node test/json-editor-browser.mjs",
+    "test:design-controls-browser": "node test/design-controls-browser.mjs",
+    "test:template-panel-browser": "node test/template-panel-browser.mjs",
+    "test:design-gaps-browser": "node test/design-gaps-browser.mjs",
+    "test:data-grid-browser": "node test/data-grid-browser.mjs",
+    "test:slides-browser": "node test/slides-browser.mjs",
+    "test:persistence-browser": "node test/persistence-browser.mjs",
+    "test:find-browser": "node test/find-replace-browser.mjs",
+    "test:crop-browser": "node test/image-crop-browser.mjs",
+    "test:mobile-browser": "node test/mobile-browser.mjs",
+    "test:review-panel-browser": "node test/review-panel-browser.mjs",
+    "test:chart-options-browser": "node test/chart-options-browser.mjs",
+    "test:numbering-panel-browser": "node test/numbering-panel-browser.mjs"
   },
   "dependencies": {
     "@codemirror/autocomplete": "6.20.3",
@@ -114,11 +246,11 @@
     "@codemirror/state": "6.7.6",
     "@codemirror/view": "6.43.13",
     "@lezer/highlight": "1.2.4",
-    "@openpresentation/opf": "^0.11.4",
+    "@openpresentation/opf": "^0.12.0",
     "jsonc-parser": "3.3.1"
   },
   "peerDependencies": {
-    "@openpresentation/opf-render": "^0.11.0"
+    "@openpresentation/opf-render": "^0.12.0"
   },
   "peerDependenciesMeta": {
     "@openpresentation/opf-render": {
@@ -144,11 +276,14 @@
     "@expo-google-fonts/noto-sans-kr": "0.4.3",
     "@expo-google-fonts/noto-sans-lao": "0.4.2",
     "@expo-google-fonts/noto-sans-malayalam": "0.4.2",
+    "@expo-google-fonts/noto-sans-math": "0.4.2",
     "@expo-google-fonts/noto-sans-mongolian": "0.4.1",
     "@expo-google-fonts/noto-sans-myanmar": "0.4.2",
     "@expo-google-fonts/noto-sans-oriya": "0.4.2",
     "@expo-google-fonts/noto-sans-sc": "0.4.3",
     "@expo-google-fonts/noto-sans-sinhala": "0.4.2",
+    "@expo-google-fonts/noto-sans-symbols": "0.4.1",
+    "@expo-google-fonts/noto-sans-symbols-2": "0.4.1",
     "@expo-google-fonts/noto-sans-syriac": "0.4.2",
     "@expo-google-fonts/noto-sans-tamil": "0.4.3",
     "@expo-google-fonts/noto-sans-tc": "0.4.3",
@@ -157,9 +292,14 @@
     "@expo-google-fonts/noto-sans-thai": "0.4.2",
     "@expo-google-fonts/noto-serif-hebrew": "0.4.2",
     "@expo-google-fonts/noto-serif-tibetan": "0.4.2",
-    "@openpresentation/opf-pptx": "^0.11.7",
-    "@openpresentation/opf-render": "^0.11.9",
+    "@openpresentation/opf-pptx": "^0.12.0",
+    "@openpresentation/opf-render": "^0.12.0",
+    "axe-core": "4.13.0",
     "esbuild": "0.28.2",
-    "playwright": "1.63.0"
+    "pdfjs-dist": "6.3.289",
+    "playwright": "1.63.0",
+    "@expo-google-fonts/noto-color-emoji": "0.4.6",
+    "@expo-google-fonts/noto-emoji": "0.4.7",
+    "@expo-google-fonts/stix-two-math": "0.4.0"
   }
 }