@motionscript/code 0.0.0-stage → 0.1.0-alpha.10

package/dist/highlight.d.ts

@@ -0,0 +1,51 @@
+import { CodeHighlightStyle, CodeTheme } from "./style.js";
+/**
+ * The source as the highlighter and the commands see it: lines joined by `\n`.
+ * A `\r\n` (or a lone `\r`) from a file or a clipboard would otherwise survive
+ * as a character at the end of a line, measured and drawn as a token.
+ */
+export declare function normalizeSource(code: string): string;
+export declare const DEFAULT_THEMES: string[];
+export declare const DEFAULT_LANGS: string[];
+/** Register a custom {@link CodeHighlightStyle} so Code nodes can reference it by name. */
+export declare function registerCodeTheme(style: CodeHighlightStyle): void;
+/**
+ * Resolve a theme reference (a registered name, or a CodeHighlightStyle object)
+ * to a concrete style. Unknown names fall back to the Motion Canvas default so a
+ * stray theme string never throws, with one warning per name.
+ */
+export declare function resolveTheme(theme: CodeTheme): CodeHighlightStyle;
+/**
+ * Load the parsers for `langs` (themes are synchronous, so they're a no-op here
+ * but kept in the signature for API parity with the former Shiki implementation).
+ * Resolves once every requested language's parser is available. Unknown languages
+ * resolve without loading anything — {@link canHighlight} stays false for them and
+ * the node renders them as plain text, with one warning per language. A grammar
+ * whose import is rejected is reported the same way and is tried again by the
+ * next call.
+ */
+export declare function ensureHighlighter(_themes?: string[], langs?: string[]): Promise<void>;
+/**
+ * Load a syntax-highlight language into the shared highlighter. Exposed so a Code
+ * node's asset loader can run it on the timeline, and so apps can preload
+ * languages explicitly. Returns once the parser is ready (or immediately for an
+ * unsupported language). The `theme` arg is accepted for backwards compatibility.
+ */
+export declare function loadCodeLanguage(language: string, _theme?: string): Promise<void>;
+export declare function initSyntaxHighlighter(themes?: string[], langs?: string[]): Promise<void>;
+/** True once `language` can be tokenized (its parser has loaded). */
+export declare function canHighlight(language: string, _theme?: CodeTheme): boolean;
+/**
+ * Tokenize `code` into per-line, colored tokens — the contract the rest of the
+ * Code component consumes. Combines {@link tokenizeCode} (structural split) with
+ * {@link highlightAt} (per-run color), then breaks tokens at newlines so each
+ * output line is a row of single-line, single-color tokens.
+ *
+ * Callers must have checked {@link canHighlight} first; this returns a single
+ * uncolored line per source line if the parser isn't loaded.
+ */
+export declare function highlightToTokens(code: string, language: string, theme?: CodeTheme): {
+    content: string;
+    color?: string;
+}[][];
+//# sourceMappingURL=highlight.d.ts.map

package/dist/highlight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.d.ts","sourceRoot":"","sources":["../src/highlight.ts"],"names":[],"mappings":"AAEA,OAAO,EAEH,kBAAkB,EAClB,SAAS,EAGZ,MAAM,SAAS,CAAC;AA6DjB;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAEpD;AAYD,eAAO,MAAM,cAAc,UAA+B,CAAC;AAC3D,eAAO,MAAM,aAAa,UAAiD,CAAC;AAO5E,2FAA2F;AAC3F,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,kBAAkB,GAAG,IAAI,CAEjE;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,SAAS,GAAG,kBAAkB,CAUjE;AAOD;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAC7B,OAAO,GAAE,MAAM,EAAmB,EAClC,KAAK,GAAE,MAAM,EAAkB,GAChC,OAAO,CAAC,IAAI,CAAC,CA0Cf;AAED;;;;;GAKG;AACH,wBAAsB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAEvF;AAED,wBAAsB,qBAAqB,CACvC,MAAM,GAAE,MAAM,EAAmB,EACjC,KAAK,GAAE,MAAM,EAAkB,GAChC,OAAO,CAAC,IAAI,CAAC,CAEf;AAED,qEAAqE;AACrE,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAE1E;AAqFD;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAC7B,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,EAChB,KAAK,GAAE,SAAiC,GACzC;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,EAAE,EAAE,CA0CzC"}

package/dist/highlight.js

@@ -0,0 +1,277 @@
+import { highlightTree } from "@lezer/highlight";
+import { BUILTIN_THEMES, DefaultHighlightStyle, compileStyle, } from "./style.js";
+/**
+ * Lezer-backed syntax highlighting for the Code component, replacing the former
+ * Shiki wiring. This mirrors Motion Canvas's `LezerHighlighter`:
+ *
+ *  - {@link prepareHighlight} parses code once and builds a `from:to` → color map
+ *    by walking {@link highlightTree}.
+ *  - {@link tokenizeCode} splits code at parse-tree leaf boundaries.
+ *  - {@link highlightAt} resolves the color (and run length) for a character index.
+ *
+ * Parsers load lazily and asynchronously (dynamic import) so the bundle doesn't
+ * pull in every grammar. The node's asset loader awaits {@link ensureHighlighter}
+ * before tokenizing; until a parser resolves, callers fall back to plain text and
+ * re-tokenize once {@link canHighlight} returns true.
+ */
+/** Dynamic-import factories for each supported language → a Lezer {@link Parser}. */
+const LANGUAGE_LOADERS = {
+    typescript: async () => (await import("@lezer/javascript")).parser.configure({ dialect: "ts" }),
+    tsx: async () => (await import("@lezer/javascript")).parser.configure({ dialect: "ts jsx" }),
+    javascript: async () => (await import("@lezer/javascript")).parser,
+    jsx: async () => (await import("@lezer/javascript")).parser.configure({ dialect: "jsx" }),
+    python: async () => (await import("@lezer/python")).parser,
+    json: async () => (await import("@lezer/json")).parser,
+    html: async () => (await import("@lezer/html")).parser,
+    css: async () => (await import("@lezer/css")).parser,
+    rust: async () => (await import("@lezer/rust")).parser,
+    go: async () => (await import("@lezer/go")).parser,
+    java: async () => (await import("@lezer/java")).parser,
+    cpp: async () => (await import("@lezer/cpp")).parser,
+    php: async () => (await import("@lezer/php")).parser,
+    markdown: async () => (await import("@lezer/markdown")).parser,
+    xml: async () => (await import("@lezer/xml")).parser,
+    yaml: async () => (await import("@lezer/yaml")).parser,
+};
+// Aliases so common language strings resolve to a loader above.
+const LANGUAGE_ALIASES = {
+    ts: "typescript",
+    js: "javascript",
+    py: "python",
+    "c++": "cpp",
+    md: "markdown",
+    yml: "yaml",
+    shell: "javascript", // no shell grammar bundled; fall back rather than throw
+};
+/** Names that mean "no grammar, on purpose": drawn as plain text without a warning. */
+const PLAIN_LANGUAGES = new Set(["", "text", "plaintext"]);
+const warned = new Set();
+/** One `console.warn` per `kind:name` for the life of the process, so a listing redrawn every frame says it once. */
+function warnOnce(kind, name, message) {
+    const key = `${kind}:${name}`;
+    if (warned.has(key))
+        return;
+    warned.add(key);
+    console.warn(`[Code] ${message}`);
+}
+/**
+ * The source as the highlighter and the commands see it: lines joined by `\n`.
+ * A `\r\n` (or a lone `\r`) from a file or a clipboard would otherwise survive
+ * as a character at the end of a line, measured and drawn as a token.
+ */
+export function normalizeSource(code) {
+    return code.indexOf("\r") === -1 ? code : code.replace(/\r\n?/g, "\n");
+}
+function resolveLanguageKey(language) {
+    const key = language.toLowerCase();
+    return LANGUAGE_ALIASES[key] ?? key;
+}
+// Loaded parsers and in-flight loads, keyed by resolved language key, so
+// concurrent Code nodes asking for the same language share one dynamic import.
+const loadedParsers = new Map();
+const inFlightLangs = new Map();
+export const DEFAULT_THEMES = [DefaultHighlightStyle.name];
+export const DEFAULT_LANGS = ["typescript", "javascript", "json", "python"];
+// Theme registry, seeded with the built-ins (Motion Canvas default + GitHub
+// dark/light). The `theme` prop is a string name or a CodeHighlightStyle object;
+// apps can register additional styles by name and reference them by that name.
+const themesByName = new Map(Object.entries(BUILTIN_THEMES));
+/** Register a custom {@link CodeHighlightStyle} so Code nodes can reference it by name. */
+export function registerCodeTheme(style) {
+    themesByName.set(style.name, style);
+}
+/**
+ * Resolve a theme reference (a registered name, or a CodeHighlightStyle object)
+ * to a concrete style. Unknown names fall back to the Motion Canvas default so a
+ * stray theme string never throws, with one warning per name.
+ */
+export function resolveTheme(theme) {
+    if (typeof theme !== "string")
+        return theme;
+    const style = themesByName.get(theme);
+    if (style)
+        return style;
+    warnOnce("theme", theme, `unknown theme "${theme}"; using "${DefaultHighlightStyle.name}". Built-in themes: ${Object.keys(BUILTIN_THEMES).join(", ")}; register others with registerCodeTheme.`);
+    return DefaultHighlightStyle;
+}
+/** Has `language` finished loading its parser? */
+function isLanguageLoaded(language) {
+    return loadedParsers.has(resolveLanguageKey(language));
+}
+/**
+ * Load the parsers for `langs` (themes are synchronous, so they're a no-op here
+ * but kept in the signature for API parity with the former Shiki implementation).
+ * Resolves once every requested language's parser is available. Unknown languages
+ * resolve without loading anything — {@link canHighlight} stays false for them and
+ * the node renders them as plain text, with one warning per language. A grammar
+ * whose import is rejected is reported the same way and is tried again by the
+ * next call.
+ */
+export function ensureHighlighter(_themes = DEFAULT_THEMES, langs = DEFAULT_LANGS) {
+    const jobs = [];
+    for (const lang of langs) {
+        const key = resolveLanguageKey(lang);
+        if (loadedParsers.has(key))
+            continue;
+        const loader = LANGUAGE_LOADERS[key];
+        if (!loader) {
+            // Unsupported language; leave it unhighlighted, and say so.
+            if (!PLAIN_LANGUAGES.has(key)) {
+                warnOnce("language", key, `no grammar for language "${lang}"; drawing it as plain text. Supported: ${Object.keys(LANGUAGE_LOADERS).join(", ")} (aliases: ${Object.keys(LANGUAGE_ALIASES).join(", ")}).`);
+            }
+            continue;
+        }
+        let job = inFlightLangs.get(key);
+        if (!job) {
+            job = loader()
+                .then(parser => {
+                loadedParsers.set(key, parser);
+                return parser;
+            })
+                .catch((error) => {
+                warnOnce("load", key, `could not load the "${lang}" grammar; drawing it as plain text: ${error instanceof Error ? error.message : String(error)}`);
+                return null;
+            })
+                .finally(() => inFlightLangs.delete(key));
+            inFlightLangs.set(key, job);
+        }
+        jobs.push(job);
+    }
+    return jobs.length === 0 ? Promise.resolve() : Promise.all(jobs).then(() => undefined);
+}
+/**
+ * Load a syntax-highlight language into the shared highlighter. Exposed so a Code
+ * node's asset loader can run it on the timeline, and so apps can preload
+ * languages explicitly. Returns once the parser is ready (or immediately for an
+ * unsupported language). The `theme` arg is accepted for backwards compatibility.
+ */
+export async function loadCodeLanguage(language, _theme) {
+    await ensureHighlighter(DEFAULT_THEMES, [language]);
+}
+export async function initSyntaxHighlighter(themes = DEFAULT_THEMES, langs = DEFAULT_LANGS) {
+    await ensureHighlighter(themes, langs);
+}
+/** True once `language` can be tokenized (its parser has loaded). */
+export function canHighlight(language, _theme) {
+    return isLanguageLoaded(language);
+}
+function nodeId(from, to) {
+    return `${from}:${to}`;
+}
+/**
+ * Parse `code` and build the per-node color map. Mirrors Motion Canvas's
+ * `LezerHighlighter.prepare`: for each highlighted range, walk the subtree and
+ * record the color against every contained node's `from:to` id, so a later
+ * {@link highlightAt} lookup by `resolveInner` index finds it.
+ */
+function prepareHighlight(code, language, style) {
+    const parser = loadedParsers.get(resolveLanguageKey(language));
+    if (!parser)
+        return null;
+    const tree = parser.parse(code);
+    const highlighter = compileStyle(style);
+    const colorLookup = new Map();
+    highlightTree(tree, highlighter, (from, to, classes) => {
+        // tagHighlighter emits our color string as the "class".
+        const color = classes;
+        if (!color)
+            return;
+        const cursor = tree.cursorAt(from, 1);
+        do {
+            colorLookup.set(nodeId(cursor.from, cursor.to), color);
+        } while (cursor.next() && cursor.to <= to);
+    });
+    return { tree, code, colorLookup };
+}
+/**
+ * Resolve the color and run length for the token starting at `index`. Mirrors
+ * Motion Canvas's `LezerHighlighter.highlight`: resolve the innermost node, look
+ * up its color, and report how far the run extends (`skipAhead`).
+ */
+function highlightAt(index, cache) {
+    const node = cache.tree.resolveInner(index, 1);
+    const color = cache.colorLookup.get(nodeId(node.from, node.to));
+    if (color) {
+        return { color, skipAhead: node.to - index };
+    }
+    // No color: skip past a childless (leaf) node so we don't re-resolve every char.
+    const skipAhead = node.firstChild ? 0 : node.to - index;
+    return { color: null, skipAhead };
+}
+/**
+ * Split `code` into structural tokens at parse-tree leaf boundaries, including the
+ * gaps between leaves (whitespace/punctuation). Mirrors Motion Canvas's
+ * `LezerHighlighter.tokenize`; this segmentation is what the token-level
+ * append/insert/erase/replace animations diff against, so matching it keeps the
+ * animation behavior identical to Motion Canvas.
+ */
+function tokenizeCode(code, language) {
+    const parser = loadedParsers.get(resolveLanguageKey(language));
+    if (!parser)
+        return [code];
+    const tree = parser.parse(code);
+    const cursor = tree.cursor();
+    const tokens = [];
+    let current = 0;
+    do {
+        if (!cursor.node.firstChild) {
+            if (cursor.from > current)
+                tokens.push(code.slice(current, cursor.from));
+            if (cursor.from < cursor.to)
+                tokens.push(code.slice(cursor.from, cursor.to));
+            current = cursor.to;
+        }
+    } while (cursor.next());
+    if (current < code.length)
+        tokens.push(code.slice(current));
+    return tokens;
+}
+/**
+ * Tokenize `code` into per-line, colored tokens — the contract the rest of the
+ * Code component consumes. Combines {@link tokenizeCode} (structural split) with
+ * {@link highlightAt} (per-run color), then breaks tokens at newlines so each
+ * output line is a row of single-line, single-color tokens.
+ *
+ * Callers must have checked {@link canHighlight} first; this returns a single
+ * uncolored line per source line if the parser isn't loaded.
+ */
+export function highlightToTokens(code, language, theme = DefaultHighlightStyle) {
+    code = normalizeSource(code);
+    const style = resolveTheme(theme);
+    const cache = prepareHighlight(code, language, style);
+    const lines = [[]];
+    const pushLine = () => lines.push([]);
+    if (!cache) {
+        // Parser unavailable: one uncolored token per source line.
+        return code.split("\n").map(line => [{ content: line, color: style.defaultColor }]);
+    }
+    // Walk the structural tokens, coloring each by its starting index and
+    // splitting on newlines so no token spans rows.
+    let index = 0;
+    for (const token of tokenizeCode(code, language)) {
+        let offset = 0;
+        while (offset < token.length) {
+            const { color, skipAhead } = highlightAt(index + offset, cache);
+            // Extend the run as far as the highlight says, but never past this
+            // structural token and never across a newline (lines are drawn rows).
+            let runEnd = offset + Math.max(skipAhead, 1);
+            if (runEnd > token.length)
+                runEnd = token.length;
+            const newlineRel = token.indexOf("\n", offset);
+            if (newlineRel !== -1 && newlineRel < runEnd)
+                runEnd = newlineRel;
+            const slice = token.slice(offset, runEnd);
+            if (slice.length > 0) {
+                lines[lines.length - 1].push({ content: slice, color: color ?? style.defaultColor });
+            }
+            if (newlineRel === runEnd) {
+                pushLine();
+                runEnd += 1; // consume the newline itself
+            }
+            offset = runEnd;
+        }
+        index += token.length;
+    }
+    return lines;
+}
+//# sourceMappingURL=highlight.js.map

package/dist/highlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.js","sourceRoot":"","sources":["../src/highlight.ts"],"names":[],"mappings":"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","sourcesContent":["import { Parser, Tree } from \"@lezer/common\";\nimport { highlightTree } from \"@lezer/highlight\";\nimport {\n    BUILTIN_THEMES,\n    CodeHighlightStyle,\n    CodeTheme,\n    DefaultHighlightStyle,\n    compileStyle,\n} from \"./style\";\n\n/**\n * Lezer-backed syntax highlighting for the Code component, replacing the former\n * Shiki wiring. This mirrors Motion Canvas's `LezerHighlighter`:\n *\n *  - {@link prepareHighlight} parses code once and builds a `from:to` → color map\n *    by walking {@link highlightTree}.\n *  - {@link tokenizeCode} splits code at parse-tree leaf boundaries.\n *  - {@link highlightAt} resolves the color (and run length) for a character index.\n *\n * Parsers load lazily and asynchronously (dynamic import) so the bundle doesn't\n * pull in every grammar. The node's asset loader awaits {@link ensureHighlighter}\n * before tokenizing; until a parser resolves, callers fall back to plain text and\n * re-tokenize once {@link canHighlight} returns true.\n */\n\n/** Dynamic-import factories for each supported language → a Lezer {@link Parser}. */\nconst LANGUAGE_LOADERS: Record<string, () => Promise<Parser>> = {\n    typescript: async () => (await import(\"@lezer/javascript\")).parser.configure({ dialect: \"ts\" }),\n    tsx: async () => (await import(\"@lezer/javascript\")).parser.configure({ dialect: \"ts jsx\" }),\n    javascript: async () => (await import(\"@lezer/javascript\")).parser,\n    jsx: async () => (await import(\"@lezer/javascript\")).parser.configure({ dialect: \"jsx\" }),\n    python: async () => (await import(\"@lezer/python\")).parser,\n    json: async () => (await import(\"@lezer/json\")).parser,\n    html: async () => (await import(\"@lezer/html\")).parser,\n    css: async () => (await import(\"@lezer/css\")).parser,\n    rust: async () => (await import(\"@lezer/rust\")).parser,\n    go: async () => (await import(\"@lezer/go\")).parser,\n    java: async () => (await import(\"@lezer/java\")).parser,\n    cpp: async () => (await import(\"@lezer/cpp\")).parser,\n    php: async () => (await import(\"@lezer/php\")).parser,\n    markdown: async () => (await import(\"@lezer/markdown\")).parser,\n    xml: async () => (await import(\"@lezer/xml\")).parser,\n    yaml: async () => (await import(\"@lezer/yaml\")).parser,\n};\n\n// Aliases so common language strings resolve to a loader above.\nconst LANGUAGE_ALIASES: Record<string, string> = {\n    ts: \"typescript\",\n    js: \"javascript\",\n    py: \"python\",\n    \"c++\": \"cpp\",\n    md: \"markdown\",\n    yml: \"yaml\",\n    shell: \"javascript\", // no shell grammar bundled; fall back rather than throw\n};\n\n/** Names that mean \"no grammar, on purpose\": drawn as plain text without a warning. */\nconst PLAIN_LANGUAGES = new Set([\"\", \"text\", \"plaintext\"]);\n\nconst warned = new Set<string>();\n\n/** One `console.warn` per `kind:name` for the life of the process, so a listing redrawn every frame says it once. */\nfunction warnOnce(kind: string, name: string, message: string): void {\n    const key = `${kind}:${name}`;\n    if (warned.has(key)) return;\n    warned.add(key);\n    console.warn(`[Code] ${message}`);\n}\n\n/**\n * The source as the highlighter and the commands see it: lines joined by `\\n`.\n * A `\\r\\n` (or a lone `\\r`) from a file or a clipboard would otherwise survive\n * as a character at the end of a line, measured and drawn as a token.\n */\nexport function normalizeSource(code: string): string {\n    return code.indexOf(\"\\r\") === -1 ? code : code.replace(/\\r\\n?/g, \"\\n\");\n}\n\nfunction resolveLanguageKey(language: string): string {\n    const key = language.toLowerCase();\n    return LANGUAGE_ALIASES[key] ?? key;\n}\n\n// Loaded parsers and in-flight loads, keyed by resolved language key, so\n// concurrent Code nodes asking for the same language share one dynamic import.\nconst loadedParsers = new Map<string, Parser>();\nconst inFlightLangs = new Map<string, Promise<Parser | null>>();\n\nexport const DEFAULT_THEMES = [DefaultHighlightStyle.name];\nexport const DEFAULT_LANGS = [\"typescript\", \"javascript\", \"json\", \"python\"];\n\n// Theme registry, seeded with the built-ins (Motion Canvas default + GitHub\n// dark/light). The `theme` prop is a string name or a CodeHighlightStyle object;\n// apps can register additional styles by name and reference them by that name.\nconst themesByName = new Map<string, CodeHighlightStyle>(Object.entries(BUILTIN_THEMES));\n\n/** Register a custom {@link CodeHighlightStyle} so Code nodes can reference it by name. */\nexport function registerCodeTheme(style: CodeHighlightStyle): void {\n    themesByName.set(style.name, style);\n}\n\n/**\n * Resolve a theme reference (a registered name, or a CodeHighlightStyle object)\n * to a concrete style. Unknown names fall back to the Motion Canvas default so a\n * stray theme string never throws, with one warning per name.\n */\nexport function resolveTheme(theme: CodeTheme): CodeHighlightStyle {\n    if (typeof theme !== \"string\") return theme;\n    const style = themesByName.get(theme);\n    if (style) return style;\n    warnOnce(\n        \"theme\",\n        theme,\n        `unknown theme \"${theme}\"; using \"${DefaultHighlightStyle.name}\". Built-in themes: ${Object.keys(BUILTIN_THEMES).join(\", \")}; register others with registerCodeTheme.`,\n    );\n    return DefaultHighlightStyle;\n}\n\n/** Has `language` finished loading its parser? */\nfunction isLanguageLoaded(language: string): boolean {\n    return loadedParsers.has(resolveLanguageKey(language));\n}\n\n/**\n * Load the parsers for `langs` (themes are synchronous, so they're a no-op here\n * but kept in the signature for API parity with the former Shiki implementation).\n * Resolves once every requested language's parser is available. Unknown languages\n * resolve without loading anything — {@link canHighlight} stays false for them and\n * the node renders them as plain text, with one warning per language. A grammar\n * whose import is rejected is reported the same way and is tried again by the\n * next call.\n */\nexport function ensureHighlighter(\n    _themes: string[] = DEFAULT_THEMES,\n    langs: string[] = DEFAULT_LANGS,\n): Promise<void> {\n    const jobs: Promise<unknown>[] = [];\n\n    for (const lang of langs) {\n        const key = resolveLanguageKey(lang);\n        if (loadedParsers.has(key)) continue;\n\n        const loader = LANGUAGE_LOADERS[key];\n        if (!loader) {\n            // Unsupported language; leave it unhighlighted, and say so.\n            if (!PLAIN_LANGUAGES.has(key)) {\n                warnOnce(\n                    \"language\",\n                    key,\n                    `no grammar for language \"${lang}\"; drawing it as plain text. Supported: ${Object.keys(LANGUAGE_LOADERS).join(\", \")} (aliases: ${Object.keys(LANGUAGE_ALIASES).join(\", \")}).`,\n                );\n            }\n            continue;\n        }\n\n        let job = inFlightLangs.get(key);\n        if (!job) {\n            job = loader()\n                .then(parser => {\n                    loadedParsers.set(key, parser);\n                    return parser;\n                })\n                .catch((error: unknown) => {\n                    warnOnce(\n                        \"load\",\n                        key,\n                        `could not load the \"${lang}\" grammar; drawing it as plain text: ${error instanceof Error ? error.message : String(error)}`,\n                    );\n                    return null;\n                })\n                .finally(() => inFlightLangs.delete(key));\n            inFlightLangs.set(key, job);\n        }\n        jobs.push(job);\n    }\n\n    return jobs.length === 0 ? Promise.resolve() : Promise.all(jobs).then(() => undefined);\n}\n\n/**\n * Load a syntax-highlight language into the shared highlighter. Exposed so a Code\n * node's asset loader can run it on the timeline, and so apps can preload\n * languages explicitly. Returns once the parser is ready (or immediately for an\n * unsupported language). The `theme` arg is accepted for backwards compatibility.\n */\nexport async function loadCodeLanguage(language: string, _theme?: string): Promise<void> {\n    await ensureHighlighter(DEFAULT_THEMES, [language]);\n}\n\nexport async function initSyntaxHighlighter(\n    themes: string[] = DEFAULT_THEMES,\n    langs: string[] = DEFAULT_LANGS,\n): Promise<void> {\n    await ensureHighlighter(themes, langs);\n}\n\n/** True once `language` can be tokenized (its parser has loaded). */\nexport function canHighlight(language: string, _theme?: CodeTheme): boolean {\n    return isLanguageLoaded(language);\n}\n\n/** A parsed-and-prepared highlight cache for one snapshot of code. */\ninterface HighlightCache {\n    tree: Tree;\n    code: string;\n    // `${from}:${to}` node id → color, exactly as Motion Canvas keys it.\n    colorLookup: Map<string, string>;\n}\n\nfunction nodeId(from: number, to: number): string {\n    return `${from}:${to}`;\n}\n\n/**\n * Parse `code` and build the per-node color map. Mirrors Motion Canvas's\n * `LezerHighlighter.prepare`: for each highlighted range, walk the subtree and\n * record the color against every contained node's `from:to` id, so a later\n * {@link highlightAt} lookup by `resolveInner` index finds it.\n */\nfunction prepareHighlight(code: string, language: string, style: CodeHighlightStyle): HighlightCache | null {\n    const parser = loadedParsers.get(resolveLanguageKey(language));\n    if (!parser) return null;\n\n    const tree = parser.parse(code);\n    const highlighter = compileStyle(style);\n    const colorLookup = new Map<string, string>();\n\n    highlightTree(tree, highlighter, (from, to, classes) => {\n        // tagHighlighter emits our color string as the \"class\".\n        const color = classes;\n        if (!color) return;\n        const cursor = tree.cursorAt(from, 1);\n        do {\n            colorLookup.set(nodeId(cursor.from, cursor.to), color);\n        } while (cursor.next() && cursor.to <= to);\n    });\n\n    return { tree, code, colorLookup };\n}\n\n/**\n * Resolve the color and run length for the token starting at `index`. Mirrors\n * Motion Canvas's `LezerHighlighter.highlight`: resolve the innermost node, look\n * up its color, and report how far the run extends (`skipAhead`).\n */\nfunction highlightAt(index: number, cache: HighlightCache): { color: string | null; skipAhead: number } {\n    const node = cache.tree.resolveInner(index, 1);\n    const color = cache.colorLookup.get(nodeId(node.from, node.to));\n    if (color) {\n        return { color, skipAhead: node.to - index };\n    }\n    // No color: skip past a childless (leaf) node so we don't re-resolve every char.\n    const skipAhead = node.firstChild ? 0 : node.to - index;\n    return { color: null, skipAhead };\n}\n\n/**\n * Split `code` into structural tokens at parse-tree leaf boundaries, including the\n * gaps between leaves (whitespace/punctuation). Mirrors Motion Canvas's\n * `LezerHighlighter.tokenize`; this segmentation is what the token-level\n * append/insert/erase/replace animations diff against, so matching it keeps the\n * animation behavior identical to Motion Canvas.\n */\nfunction tokenizeCode(code: string, language: string): string[] {\n    const parser = loadedParsers.get(resolveLanguageKey(language));\n    if (!parser) return [code];\n\n    const tree = parser.parse(code);\n    const cursor = tree.cursor();\n    const tokens: string[] = [];\n    let current = 0;\n\n    do {\n        if (!cursor.node.firstChild) {\n            if (cursor.from > current) tokens.push(code.slice(current, cursor.from));\n            if (cursor.from < cursor.to) tokens.push(code.slice(cursor.from, cursor.to));\n            current = cursor.to;\n        }\n    } while (cursor.next());\n\n    if (current < code.length) tokens.push(code.slice(current));\n    return tokens;\n}\n\n/**\n * Tokenize `code` into per-line, colored tokens — the contract the rest of the\n * Code component consumes. Combines {@link tokenizeCode} (structural split) with\n * {@link highlightAt} (per-run color), then breaks tokens at newlines so each\n * output line is a row of single-line, single-color tokens.\n *\n * Callers must have checked {@link canHighlight} first; this returns a single\n * uncolored line per source line if the parser isn't loaded.\n */\nexport function highlightToTokens(\n    code: string,\n    language: string,\n    theme: CodeTheme = DefaultHighlightStyle,\n): { content: string; color?: string }[][] {\n    code = normalizeSource(code);\n    const style = resolveTheme(theme);\n    const cache = prepareHighlight(code, language, style);\n\n    const lines: { content: string; color?: string }[][] = [[]];\n    const pushLine = () => lines.push([]);\n\n    if (!cache) {\n        // Parser unavailable: one uncolored token per source line.\n        return code.split(\"\\n\").map(line => [{ content: line, color: style.defaultColor }]);\n    }\n\n    // Walk the structural tokens, coloring each by its starting index and\n    // splitting on newlines so no token spans rows.\n    let index = 0;\n    for (const token of tokenizeCode(code, language)) {\n        let offset = 0;\n        while (offset < token.length) {\n            const { color, skipAhead } = highlightAt(index + offset, cache);\n            // Extend the run as far as the highlight says, but never past this\n            // structural token and never across a newline (lines are drawn rows).\n            let runEnd = offset + Math.max(skipAhead, 1);\n            if (runEnd > token.length) runEnd = token.length;\n            const newlineRel = token.indexOf(\"\\n\", offset);\n            if (newlineRel !== -1 && newlineRel < runEnd) runEnd = newlineRel;\n\n            const slice = token.slice(offset, runEnd);\n            if (slice.length > 0) {\n                lines[lines.length - 1].push({ content: slice, color: color ?? style.defaultColor });\n            }\n\n            if (newlineRel === runEnd) {\n                pushLine();\n                runEnd += 1; // consume the newline itself\n            }\n            offset = runEnd;\n        }\n        index += token.length;\n    }\n\n    return lines;\n}\n"]}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export * from './node.js';
+export * from './engine.js';
+export { NODES } from "./nodes.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -0,0 +1,4 @@
+export * from './node.js';
+export * from './engine.js';
+export { NODES } from "./nodes.js";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export * from './node';\nexport * from './engine';\nexport { NODES } from \"./nodes\";\n"]}

package/dist/layout.d.ts

@@ -0,0 +1,77 @@
+import type { InsetsResolved, MeasureContext2D, RenderContext2D } from "@motionscript/sdk";
+import type { TokenAdvanceCache } from "./measure-cache.js";
+import type { IdLine } from "./tokens.js";
+/**
+ * Everything about a listing's geometry that is *not* its content — the type,
+ * the padding, whether there is a gutter. Split out from the node so a layout
+ * can be computed for a token structure the node is no longer holding: during a
+ * structural transition the frame is the interpolation of two of them, and the
+ * one that is going away is not reachable through `this` any more.
+ */
+export interface CodeMetrics {
+    fontSize: number;
+    fontFamily: string;
+    lineHeight: number;
+    letterSpacing: number;
+    padding: InsetsResolved;
+    showLineNumbers: boolean;
+    lineNumberGap: number;
+}
+/** Where one token sits: its LEFT edge, and the vertical CENTRE of its line's slot. */
+export interface TokenBox {
+    x: number;
+    y: number;
+}
+/**
+ * A resolved listing geometry: every token placed, in the node's own space
+ * (origin at the block's centre, y-up).
+ *
+ * Positions are absolute rather than "a running sum plus a width scale", which
+ * is the whole point. A token's place in the *next* structure is knowable
+ * without drawing it, so a transition can move a token from where it was to
+ * where it will be instead of faking the motion by collapsing the advance of
+ * its neighbours — which is what made an insert look like a pile of glyphs at
+ * the left margin springing apart.
+ */
+export interface CodeLayout {
+    /** Token id → placement. */
+    tokens: Map<number, TokenBox>;
+    /** Vertical centre of each line's slot, by line index. */
+    lineY: number[];
+    /**
+     * Width of each line's ink, by line index — the sum of its tokens' advances,
+     * so a blank line is `0` and a short line is short.
+     *
+     * Returned rather than kept local because it is the only thing that knows a
+     * listing is **ragged**: `innerW` is the longest line, and everything that
+     * asks where the text actually is (hit testing, for one) would otherwise have
+     * to treat the block as a rectangle the width of its longest row.
+     */
+    lineW: number[];
+    /** Line id → its index in this structure (i.e. its line *number* minus one). */
+    lineIndex: Map<number, number>;
+    gutter: number;
+    gutterGap: number;
+    /** Content size, no padding. */
+    innerW: number;
+    innerH: number;
+    /** Content size plus padding — what the block draws and measures as. */
+    blockW: number;
+    blockH: number;
+    /** Left edge of the code column (after padding and gutter). */
+    startX: number;
+}
+/**
+ * Signature of everything a layout depends on other than the token structure
+ * itself. A cached layout survives exactly as long as this is unchanged.
+ */
+export declare function metricsSignature(m: CodeMetrics): string;
+/**
+ * Place every token of `lines`.
+ *
+ * Pure in (lines, metrics, font measurements), which is what lets a caller cache
+ * one per structure rather than recomputing it per frame — a transition's two
+ * endpoints are both fixed for its whole duration.
+ */
+export declare function layoutCode(lines: IdLine[], m: CodeMetrics, cache: TokenAdvanceCache, scope: MeasureContext2D | RenderContext2D): CodeLayout;
+//# sourceMappingURL=layout.d.ts.map

package/dist/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC3F,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEvC;;;;;;GAMG;AACH,MAAM,WAAW,WAAW;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,cAAc,CAAC;IACxB,eAAe,EAAE,OAAO,CAAC;IACzB,aAAa,EAAE,MAAM,CAAC;CACzB;AAED,uFAAuF;AACvF,MAAM,WAAW,QAAQ;IACrB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACb;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,UAAU;IACvB,4BAA4B;IAC5B,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IAC9B,0DAA0D;IAC1D,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB;;;;;;;;OAQG;IACH,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,gFAAgF;IAChF,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,gCAAgC;IAChC,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,wEAAwE;IACxE,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,MAAM,EAAE,MAAM,CAAC;CAClB;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,WAAW,GAAG,MAAM,CAOvD;AAwBD;;;;;;GAMG;AACH,wBAAgB,UAAU,CACtB,KAAK,EAAE,MAAM,EAAE,EACf,CAAC,EAAE,WAAW,EACd,KAAK,EAAE,iBAAiB,EACxB,KAAK,EAAE,gBAAgB,GAAG,eAAe,GAC1C,UAAU,CA0CZ"}

package/dist/layout.js

@@ -0,0 +1,74 @@
+/**
+ * Signature of everything a layout depends on other than the token structure
+ * itself. A cached layout survives exactly as long as this is unchanged.
+ */
+export function metricsSignature(m) {
+    const p = m.padding;
+    return [
+        m.fontSize, m.fontFamily, m.lineHeight, m.letterSpacing,
+        p.left, p.right, p.top, p.bottom,
+        m.showLineNumbers ? 1 : 0, m.lineNumberGap,
+    ].join("|");
+}
+/**
+ * Horizontal gap between the line-number column and the code text. Sized in
+ * space-widths so it scales with the font, and measured with letterSpacing 0 —
+ * line numbers and the gap don't carry the code's letter-spacing.
+ */
+function gutterGapOf(scope, m, cache) {
+    return cache.advance(scope, " ", m.fontSize, m.fontFamily, 0) * m.lineNumberGap;
+}
+/** Width of the line-number column for a structure of `lineCount` lines, gap included. */
+function gutterOf(scope, m, cache, lineCount, gap) {
+    if (!m.showLineNumbers)
+        return 0;
+    const sample = String(Math.max(1, lineCount));
+    return cache.advance(scope, sample, m.fontSize, m.fontFamily, 0) + gap;
+}
+/**
+ * Place every token of `lines`.
+ *
+ * Pure in (lines, metrics, font measurements), which is what lets a caller cache
+ * one per structure rather than recomputing it per frame — a transition's two
+ * endpoints are both fixed for its whole duration.
+ */
+export function layoutCode(lines, m, cache, scope) {
+    const lineH = m.fontSize * m.lineHeight;
+    const gutterGap = m.showLineNumbers ? gutterGapOf(scope, m, cache) : 0;
+    const gutter = gutterOf(scope, m, cache, lines.length, gutterGap);
+    const widths = new Array(lines.length);
+    let maxLineWidth = 0;
+    for (let i = 0; i < lines.length; i++) {
+        let w = 0;
+        for (const tok of lines[i].tokens) {
+            w += cache.advance(scope, tok.content, m.fontSize, m.fontFamily, m.letterSpacing);
+        }
+        widths[i] = w;
+        if (w > maxLineWidth)
+            maxLineWidth = w;
+    }
+    const innerW = maxLineWidth + gutter;
+    const innerH = lines.length * lineH;
+    const blockW = innerW + m.padding.left + m.padding.right;
+    const blockH = innerH + m.padding.top + m.padding.bottom;
+    const startX = -blockW / 2 + m.padding.left + gutter;
+    // y-up author space: the first line sits at the TOP of the block, so the
+    // cursor starts at the top edge (+half height, minus top padding) and steps
+    // DOWNWARD by subtracting a line height per row.
+    const startY = blockH / 2 - m.padding.top;
+    const tokens = new Map();
+    const lineY = new Array(lines.length);
+    const lineIndex = new Map();
+    for (let i = 0; i < lines.length; i++) {
+        const centerY = startY - i * lineH - lineH / 2;
+        lineY[i] = centerY;
+        lineIndex.set(lines[i].id, i);
+        let x = startX;
+        for (const tok of lines[i].tokens) {
+            tokens.set(tok.id, { x, y: centerY });
+            x += cache.advance(scope, tok.content, m.fontSize, m.fontFamily, m.letterSpacing);
+        }
+    }
+    return { tokens, lineY, lineW: widths, lineIndex, gutter, gutterGap, innerW, innerH, blockW, blockH, startX };
+}
+//# sourceMappingURL=layout.js.map

package/dist/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAmEA;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAAC,CAAc;IAC3C,MAAM,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC;IACpB,OAAO;QACH,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,aAAa;QACvD,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,MAAM;QAChC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,aAAa;KAC7C,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAChB,CAAC;AAED;;;;GAIG;AACH,SAAS,WAAW,CAAC,KAAyC,EAAE,CAAc,EAAE,KAAwB;IACpG,OAAO,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,aAAa,CAAC;AACpF,CAAC;AAED,0FAA0F;AAC1F,SAAS,QAAQ,CACb,KAAyC,EACzC,CAAc,EACd,KAAwB,EACxB,SAAiB,EACjB,GAAW;IAEX,IAAI,CAAC,CAAC,CAAC,eAAe;QAAE,OAAO,CAAC,CAAC;IACjC,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC;IAC9C,OAAO,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,GAAG,GAAG,CAAC;AAC3E,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,UAAU,CACtB,KAAe,EACf,CAAc,EACd,KAAwB,EACxB,KAAyC;IAEzC,MAAM,KAAK,GAAG,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,UAAU,CAAC;IACxC,MAAM,SAAS,GAAG,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACvE,MAAM,MAAM,GAAG,QAAQ,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAElE,MAAM,MAAM,GAAa,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACjD,IAAI,YAAY,GAAG,CAAC,CAAC;IACrB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACpC,IAAI,CAAC,GAAG,CAAC,CAAC;QACV,KAAK,MAAM,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;YAChC,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC;QACtF,CAAC;QACD,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;QACd,IAAI,CAAC,GAAG,YAAY;YAAE,YAAY,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,MAAM,MAAM,GAAG,YAAY,GAAG,MAAM,CAAC;IACrC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;IACpC,MAAM,MAAM,GAAG,MAAM,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC;IACzD,MAAM,MAAM,GAAG,MAAM,GAAG,CAAC,CAAC,OAAO,CAAC,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC;IACzD,MAAM,MAAM,GAAG,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,GAAG,MAAM,CAAC;IACrD,yEAAyE;IACzE,4EAA4E;IAC5E,iDAAiD;IACjD,MAAM,MAAM,GAAG,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC;IAE1C,MAAM,MAAM,GAAG,IAAI,GAAG,EAAoB,CAAC;IAC3C,MAAM,KAAK,GAAa,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,IAAI,GAAG,EAAkB,CAAC;IAE5C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACpC,MAAM,OAAO,GAAG,MAAM,GAAG,CAAC,GAAG,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC;QAC/C,KAAK,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC;QACnB,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;QAC9B,IAAI,CAAC,GAAG,MAAM,CAAC;QACf,KAAK,MAAM,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;YAChC,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;YACtC,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC;QACtF,CAAC;IACL,CAAC;IAED,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;AAClH,CAAC","sourcesContent":["import type { InsetsResolved, MeasureContext2D, RenderContext2D } from \"@motionscript/sdk\";\nimport type { TokenAdvanceCache } from \"./measure-cache\";\nimport type { IdLine } from \"./tokens\";\n\n/**\n * Everything about a listing's geometry that is *not* its content — the type,\n * the padding, whether there is a gutter. Split out from the node so a layout\n * can be computed for a token structure the node is no longer holding: during a\n * structural transition the frame is the interpolation of two of them, and the\n * one that is going away is not reachable through `this` any more.\n */\nexport interface CodeMetrics {\n    fontSize: number;\n    fontFamily: string;\n    lineHeight: number;\n    letterSpacing: number;\n    padding: InsetsResolved;\n    showLineNumbers: boolean;\n    lineNumberGap: number;\n}\n\n/** Where one token sits: its LEFT edge, and the vertical CENTRE of its line's slot. */\nexport interface TokenBox {\n    x: number;\n    y: number;\n}\n\n/**\n * A resolved listing geometry: every token placed, in the node's own space\n * (origin at the block's centre, y-up).\n *\n * Positions are absolute rather than \"a running sum plus a width scale\", which\n * is the whole point. A token's place in the *next* structure is knowable\n * without drawing it, so a transition can move a token from where it was to\n * where it will be instead of faking the motion by collapsing the advance of\n * its neighbours — which is what made an insert look like a pile of glyphs at\n * the left margin springing apart.\n */\nexport interface CodeLayout {\n    /** Token id → placement. */\n    tokens: Map<number, TokenBox>;\n    /** Vertical centre of each line's slot, by line index. */\n    lineY: number[];\n    /**\n     * Width of each line's ink, by line index — the sum of its tokens' advances,\n     * so a blank line is `0` and a short line is short.\n     *\n     * Returned rather than kept local because it is the only thing that knows a\n     * listing is **ragged**: `innerW` is the longest line, and everything that\n     * asks where the text actually is (hit testing, for one) would otherwise have\n     * to treat the block as a rectangle the width of its longest row.\n     */\n    lineW: number[];\n    /** Line id → its index in this structure (i.e. its line *number* minus one). */\n    lineIndex: Map<number, number>;\n    gutter: number;\n    gutterGap: number;\n    /** Content size, no padding. */\n    innerW: number;\n    innerH: number;\n    /** Content size plus padding — what the block draws and measures as. */\n    blockW: number;\n    blockH: number;\n    /** Left edge of the code column (after padding and gutter). */\n    startX: number;\n}\n\n/**\n * Signature of everything a layout depends on other than the token structure\n * itself. A cached layout survives exactly as long as this is unchanged.\n */\nexport function metricsSignature(m: CodeMetrics): string {\n    const p = m.padding;\n    return [\n        m.fontSize, m.fontFamily, m.lineHeight, m.letterSpacing,\n        p.left, p.right, p.top, p.bottom,\n        m.showLineNumbers ? 1 : 0, m.lineNumberGap,\n    ].join(\"|\");\n}\n\n/**\n * Horizontal gap between the line-number column and the code text. Sized in\n * space-widths so it scales with the font, and measured with letterSpacing 0 —\n * line numbers and the gap don't carry the code's letter-spacing.\n */\nfunction gutterGapOf(scope: MeasureContext2D | RenderContext2D, m: CodeMetrics, cache: TokenAdvanceCache): number {\n    return cache.advance(scope, \" \", m.fontSize, m.fontFamily, 0) * m.lineNumberGap;\n}\n\n/** Width of the line-number column for a structure of `lineCount` lines, gap included. */\nfunction gutterOf(\n    scope: MeasureContext2D | RenderContext2D,\n    m: CodeMetrics,\n    cache: TokenAdvanceCache,\n    lineCount: number,\n    gap: number,\n): number {\n    if (!m.showLineNumbers) return 0;\n    const sample = String(Math.max(1, lineCount));\n    return cache.advance(scope, sample, m.fontSize, m.fontFamily, 0) + gap;\n}\n\n/**\n * Place every token of `lines`.\n *\n * Pure in (lines, metrics, font measurements), which is what lets a caller cache\n * one per structure rather than recomputing it per frame — a transition's two\n * endpoints are both fixed for its whole duration.\n */\nexport function layoutCode(\n    lines: IdLine[],\n    m: CodeMetrics,\n    cache: TokenAdvanceCache,\n    scope: MeasureContext2D | RenderContext2D,\n): CodeLayout {\n    const lineH = m.fontSize * m.lineHeight;\n    const gutterGap = m.showLineNumbers ? gutterGapOf(scope, m, cache) : 0;\n    const gutter = gutterOf(scope, m, cache, lines.length, gutterGap);\n\n    const widths: number[] = new Array(lines.length);\n    let maxLineWidth = 0;\n    for (let i = 0; i < lines.length; i++) {\n        let w = 0;\n        for (const tok of lines[i].tokens) {\n            w += cache.advance(scope, tok.content, m.fontSize, m.fontFamily, m.letterSpacing);\n        }\n        widths[i] = w;\n        if (w > maxLineWidth) maxLineWidth = w;\n    }\n\n    const innerW = maxLineWidth + gutter;\n    const innerH = lines.length * lineH;\n    const blockW = innerW + m.padding.left + m.padding.right;\n    const blockH = innerH + m.padding.top + m.padding.bottom;\n    const startX = -blockW / 2 + m.padding.left + gutter;\n    // y-up author space: the first line sits at the TOP of the block, so the\n    // cursor starts at the top edge (+half height, minus top padding) and steps\n    // DOWNWARD by subtracting a line height per row.\n    const startY = blockH / 2 - m.padding.top;\n\n    const tokens = new Map<number, TokenBox>();\n    const lineY: number[] = new Array(lines.length);\n    const lineIndex = new Map<number, number>();\n\n    for (let i = 0; i < lines.length; i++) {\n        const centerY = startY - i * lineH - lineH / 2;\n        lineY[i] = centerY;\n        lineIndex.set(lines[i].id, i);\n        let x = startX;\n        for (const tok of lines[i].tokens) {\n            tokens.set(tok.id, { x, y: centerY });\n            x += cache.advance(scope, tok.content, m.fontSize, m.fontFamily, m.letterSpacing);\n        }\n    }\n\n    return { tokens, lineY, lineW: widths, lineIndex, gutter, gutterGap, innerW, innerH, blockW, blockH, startX };\n}\n"]}

package/dist/measure-cache.d.ts

@@ -0,0 +1,38 @@
+import { MeasureContext2D, RenderContext2D } from "@motionscript/sdk";
+/**
+ * Memoizes text-advance measurements for the Code node.
+ *
+ * `scope.measureText` runs a full paragraph layout (shaping plus
+ * font object alloc/free) on every call — far too expensive to repeat for every
+ * token on every frame. A token's advance only depends on (content, fontSize,
+ * fontFamily, letterSpacing); content changes only at edit time and the font
+ * inputs only change via props, so the same string measures to the same width
+ * across the many static frames the player renders.
+ *
+ * fontSize + fontFamily fold into a `signature` checked once per frame: when it
+ * changes the cache clears. letterSpacing folds into the per-entry key so the
+ * letter-spaced token advances and the unspaced gutter advances coexist in one
+ * map. The signature check (not the node's `set()`) is the invalidation point on
+ * purpose — animated/bound font props (`to({ fontSize })`, `fontSize={() => …}`)
+ * bypass `set()` but still flow through the per-frame signature comparison.
+ *
+ * NOTE: the two `measureText` implementations in packages/browser/src
+ * (measure-scope.ts and render-context.ts) are uncached and shape+free fonts on
+ * every call. A shared cache there would speed up all text nodes, but it touches
+ * shared infra and cross-font correctness, so it's intentionally left out here.
+ */
+export declare class TokenAdvanceCache {
+    private cache;
+    private sig;
+    /** Signature of the font inputs that, when changed, invalidate every entry. */
+    signature(fontSize: number, fontFamily: string): string;
+    /** Clear the cache if the font signature changed since the last frame. */
+    sync(sig: string): void;
+    /**
+     * Advance width of `content`, measured once per unique (content,
+     * letterSpacing) pair under the current font signature. Call `sync()` first
+     * each frame so a font change is reflected.
+     */
+    advance(scope: MeasureContext2D | RenderContext2D, content: string, fontSize: number, fontFamily: string, letterSpacing: number): number;
+}
+//# sourceMappingURL=measure-cache.d.ts.map

package/dist/measure-cache.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"measure-cache.d.ts","sourceRoot":"","sources":["../src/measure-cache.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEtE;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,qBAAa,iBAAiB;IAC1B,OAAO,CAAC,KAAK,CAA6B;IAC1C,OAAO,CAAC,GAAG,CAAM;IAEjB,+EAA+E;IAC/E,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,MAAM;IAIvD,0EAA0E;IAC1E,IAAI,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAOvB;;;;OAIG;IACH,OAAO,CACH,KAAK,EAAE,gBAAgB,GAAG,eAAe,EACzC,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,MAAM,EAClB,aAAa,EAAE,MAAM,GACtB,MAAM;CAYZ"}

package/dist/measure-cache.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"measure-cache.js","sourceRoot":"","sources":["../src/measure-cache.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,OAAO,iBAAiB;IAClB,KAAK,GAAG,IAAI,GAAG,EAAkB,CAAC;IAClC,GAAG,GAAG,EAAE,CAAC;IAEjB,+EAA+E;IAC/E,SAAS,CAAC,QAAgB,EAAE,UAAkB;QAC1C,OAAO,GAAG,QAAQ,IAAI,UAAU,EAAE,CAAC;IACvC,CAAC;IAED,0EAA0E;IAC1E,IAAI,CAAC,GAAW;QACZ,IAAI,GAAG,KAAK,IAAI,CAAC,GAAG,EAAE,CAAC;YACnB,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;YACnB,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACnB,CAAC;IACL,CAAC;IAED;;;;OAIG;IACH,OAAO,CACH,KAAyC,EACzC,OAAe,EACf,QAAgB,EAChB,UAAkB,EAClB,aAAqB;QAErB,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,CAAC,CAAC;QACnC,MAAM,GAAG,GAAG,GAAG,OAAO,IAAI,aAAa,EAAE,CAAC;QAC1C,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;QAChC,IAAI,GAAG,KAAK,SAAS;YAAE,OAAO,GAAG,CAAC;QAClC,wEAAwE;QACxE,8DAA8D;QAC9D,iDAAiD;QACjD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,WAAW,CAAC,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,CAAC,CAAC;QAC7F,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;QAC3B,OAAO,KAAK,CAAC;IACjB,CAAC;CACJ","sourcesContent":["import { MeasureContext2D, RenderContext2D } from \"@motionscript/sdk\";\n\n/**\n * Memoizes text-advance measurements for the Code node.\n *\n * `scope.measureText` runs a full paragraph layout (shaping plus\n * font object alloc/free) on every call — far too expensive to repeat for every\n * token on every frame. A token's advance only depends on (content, fontSize,\n * fontFamily, letterSpacing); content changes only at edit time and the font\n * inputs only change via props, so the same string measures to the same width\n * across the many static frames the player renders.\n *\n * fontSize + fontFamily fold into a `signature` checked once per frame: when it\n * changes the cache clears. letterSpacing folds into the per-entry key so the\n * letter-spaced token advances and the unspaced gutter advances coexist in one\n * map. The signature check (not the node's `set()`) is the invalidation point on\n * purpose — animated/bound font props (`to({ fontSize })`, `fontSize={() => …}`)\n * bypass `set()` but still flow through the per-frame signature comparison.\n *\n * NOTE: the two `measureText` implementations in packages/browser/src\n * (measure-scope.ts and render-context.ts) are uncached and shape+free fonts on\n * every call. A shared cache there would speed up all text nodes, but it touches\n * shared infra and cross-font correctness, so it's intentionally left out here.\n */\nexport class TokenAdvanceCache {\n    private cache = new Map<string, number>();\n    private sig = \"\";\n\n    /** Signature of the font inputs that, when changed, invalidate every entry. */\n    signature(fontSize: number, fontFamily: string): string {\n        return `${fontSize}|${fontFamily}`;\n    }\n\n    /** Clear the cache if the font signature changed since the last frame. */\n    sync(sig: string): void {\n        if (sig !== this.sig) {\n            this.cache.clear();\n            this.sig = sig;\n        }\n    }\n\n    /**\n     * Advance width of `content`, measured once per unique (content,\n     * letterSpacing) pair under the current font signature. Call `sync()` first\n     * each frame so a font change is reflected.\n     */\n    advance(\n        scope: MeasureContext2D | RenderContext2D,\n        content: string,\n        fontSize: number,\n        fontFamily: string,\n        letterSpacing: number,\n    ): number {\n        if (content.length === 0) return 0;\n        const key = `${content}\u0000${letterSpacing}`;\n        const hit = this.cache.get(key);\n        if (hit !== undefined) return hit;\n        // Only the advance width is cached: a code block's geometry is a column\n        // of x offsets, and its line height comes from the node's own\n        // `lineHeight` prop rather than from the shaper.\n        const { width } = scope.measureText(content, fontSize, fontFamily, undefined, letterSpacing);\n        this.cache.set(key, width);\n        return width;\n    }\n}\n"]}