@charlescms/astro 0.1.0

package/src/analyzer.js

@@ -0,0 +1,639 @@
+import { parse } from "@astrojs/compiler";
+import { getFrontmatter } from "./astro-frontmatter.js";
+import { isDisplayTextField } from "./data-analyzer.js";
+export { getFrontmatter } from "./astro-frontmatter.js";
+export { extractDataCollections, extractNavCollections } from "./data-analyzer.js";
+import { fieldName } from "./fields.js";
+import { createEntryId } from "./ids.js";
+import { buildConstantTrees, resolveExpressionTree } from "./js-ast.js";
+
+// Builds the byte-exact edit map for an Astro template.
+//
+// The Astro compiler provides the syntax tree; this module only accepts static
+// source regions that can be located and verified exactly. Dynamic expressions
+// remain code and are deliberately never turned into editable content.
+const editableTags = new Set([
+  "a",
+  "address",
+  "audio",
+  "button",
+  "blockquote",
+  "caption",
+  "cite",
+  "figcaption",
+  "legend",
+  "summary",
+  "td",
+  "th",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "iframe",
+  "img",
+  "li",
+  "dd",
+  "dt",
+  "object",
+  "p",
+  "source",
+  "span",
+  "strong",
+  "em",
+  "b",
+  "i",
+  "small",
+  // SVG <text> (e.g. an inline logo monogram). It is NOT a rich-text block, so it
+  // edits through the simple input panel rather than inline contentEditable (which
+  // SVG does not support) — still a byte-exact edit of the text in the source.
+  "text",
+  "video"
+]);
+
+// Link destinations are structure, not content. In particular, never create an
+// editable operation for href/target/rel. Anchors can still expose their static
+// visible text through buildTextOperation below.
+const editableAttributes = new Set(["src", "alt", "title", "poster", "data"]);
+const mediaTags = new Set(["audio", "embed", "iframe", "img", "object", "source", "video"]);
+const voidLikeMediaTags = new Set(["embed", "img", "source"]);
+
+// Role-based classification (see plan "Nested markup & rich text"):
+// a rich-text block owns its inline descendants and is edited as one fragment;
+// inline marks/text inside it get no separate entries.
+// `div` and `label` are included so a container whose ENTIRE content is a single
+// static text run (a styled note like `<div class="hero-note">…</div>`, a form
+// `<label>Email address</label>`) is editable too. The isPureInlineSubtree guard
+// keeps this safe: a div/label that wraps child ELEMENTS (a layout container, or
+// a label around an <input>) is never matched — only direct-text ones are.
+const richTextBlockTags = new Set(["p", "h1", "h2", "h3", "h4", "h5", "h6", "li", "blockquote", "figcaption", "div", "label"]);
+// Marks the content-only serializer can round-trip losslessly. <span> is left
+// out on purpose: it usually carries styling (a class or inline style) the editor
+// must not strip, so a block wrapping text in a <span> is not offered as one
+// editable rich-text region (the serializer would drop the span on save).
+const inlineMarkTags = new Set(["strong", "em", "b", "i", "a", "code", "small", "u", "mark", "br"]);
+
+/**
+ * Locate every editable region in an `.astro` file and return its source map.
+ *
+ * Markup walking is AST-driven (the Astro compiler), so tag/text/attribute
+ * boundaries are exact instead of guessed. Frontmatter `const` resolution stays
+ * a focused JS-source pass (collectStaticConstants) — that is value extraction
+ * from JS, not markup parsing, and is independent of how we walk the template.
+ *
+ * @param {string} source Raw `.astro` file contents.
+ * @param {string} file File path; non-`.astro` or `node_modules` inputs are returned untouched.
+ * @returns {Promise<{code: string, entries: Object}>} The unchanged source plus a
+ *   map of entry id → descriptor ({ file, tag, operations, ... }) for each editable region.
+ */
+export async function transformAstroSource(source, file) {
+  if (!file.endsWith(".astro") || file.includes("/node_modules/")) {
+    return { code: source, entries: {} };
+  }
+
+  const { ast } = await parse(source, { position: true });
+  // @astrojs/compiler reports UTF-8 BYTE offsets; JS strings are UTF-16. Any
+  // multibyte char (—, ©, umlauts) before a position would otherwise drift every
+  // span. Remap all AST offsets to char indices once, up front.
+  normalizeAstOffsets(ast, buildByteToCharMap(source));
+  const constants = collectStaticConstants(source);
+  const entries = {};
+  const insertions = [];
+
+  const addEntry = (element, operations) => {
+    const id = createEntryId(file, operations);
+    entries[id] = { id, file, tag: element.name, operations };
+    if (mediaTags.has(element.name) || hasAttribute(element, "data-charlescms-block")) {
+      const outer = buildOuterSpan(source, element);
+      if (outer) Object.assign(entries[id], outer);
+    }
+    const fields = operations.map((operation) => fieldName(operation)).join(",");
+    const openTagEnd = findOpenTagEnd(source, element.position.start.offset);
+    const selfClosing = source[openTagEnd - 2] === "/";
+    insertions.push({
+      index: selfClosing ? openTagEnd - 2 : openTagEnd - 1,
+      value: ` data-charlescms-id="${id}" data-charlescms-fields="${fields}"`
+    });
+  };
+
+  // Display-text passed as a string-literal prop to a component
+  // (`<PageHero title="…" intro="…" />`) is content that lives at an exact byte
+  // span in this .astro, but renders inside the component — so it can't be an
+  // inline source-mapped element here. It is collected as a page-text entry and
+  // edited (byte-verified) from the Content panel, never bound in the DOM.
+  const propOps = [];
+  const collectComponentProps = (node) => {
+    for (const attribute of node.attributes || []) {
+      if (attribute.kind !== "quoted") continue;
+      if (!isDisplayTextProp(attribute.name, attribute.value)) continue;
+      const span = locateAttributeValue(source, attribute);
+      if (!span) continue;
+      propOps.push({
+        kind: "attribute",
+        name: `prop${propOps.length}_${attribute.name}`,
+        quote: span.quote,
+        start: span.start,
+        end: span.end,
+        oldValue: attribute.value
+      });
+    }
+  };
+
+  // A static text label passed as a component's child — `<Button>Get started</Button>`,
+  // `<Button><Icon/> Star on GitHub</Button>` — is display copy that lives at an
+  // exact byte span in THIS .astro, but renders through the component's <slot/>
+  // into a tag we cannot know. So it is collected as page text (byte-verified
+  // edit, surfaced inline by the content bridge's text match), never DOM-bound by
+  // guessing the rendered tag. Only a clean label qualifies: a single static text
+  // node, optionally beside decorative icons/marks. Anything with an expression,
+  // a block child, or a word-bearing nested component is structure or dynamic
+  // content and stays locked.
+  const collectComponentSlotText = (node) => {
+    const meaningful = (node.children || []).filter((child) => !isBlankText(child));
+    const textNodes = meaningful.filter((child) => child.type === "text");
+    const others = meaningful.filter((child) => child.type !== "text");
+    if (textNodes.length !== 1) return;
+    if (others.length > 0 && !others.every(isDecorativeInline)) return;
+    const operation = buildPlainTextOperation(textNodes[0], `prop${propOps.length}_label`);
+    if (operation && isEditableProse(operation.oldValue)) propOps.push(operation);
+  };
+
+  const visit = (node) => {
+    if (node.type !== "element" || node.position?.start?.offset == null) {
+      if ((node.type === "component" || node.type === "custom-element") && node.position?.start?.offset != null) {
+        // Astro's <Image>/<Picture> render an <img> and FORWARD extra attributes
+        // to it (verified), so they edit like any media element: build the same
+        // src/alt operations (string OR a src/alt that resolves to a static const)
+        // and inject an id that reaches the rendered <img>. This is universal —
+        // it covers every Astro site using astro:assets, with no per-site rules.
+        if (node.name === "Image" || node.name === "Picture") {
+          const operations = buildOperations(source, node, constants);
+          if (operations.length > 0) addEntry(node, operations);
+        } else {
+          collectComponentProps(node);
+          collectComponentSlotText(node);
+        }
+      }
+      for (const child of node.children || []) visit(child);
+      return;
+    }
+
+    if (hasAttribute(node, "data-charlescms-sections")) {
+      const directChildren = (node.children || []).filter((child) => !isBlankText(child));
+      if (directChildren.length > 0 && directChildren.every(isStaticSectionChild)) {
+        const anchors = directChildren
+          .map((child, index) => {
+            const outer = buildOuterSpan(source, child);
+            return outer ? { anchorId: `anchor_${index}`, tag: child.name, ...outer } : null;
+          })
+          .filter(Boolean);
+        if (anchors.length === directChildren.length) {
+          const id = createEntryId(file, anchors);
+          entries[id] = {
+            id,
+            file,
+            tag: node.name,
+            kind: "section-container",
+            operations: [],
+            anchors,
+            sectionClass: staticAttributeValue(node, "data-charlescms-section-class"),
+            tools: normalizeSectionTools(staticAttributeValue(node, "data-charlescms-section-tools"))
+          };
+        }
+      }
+    }
+
+    if (hasAttribute(node, "data-charlescms-block")) {
+      // The block entry identifies the WHOLE section (so it can be removed as
+      // one), but we still descend: a published section's headings, paragraphs
+      // and images are ordinary page content, edited inline like everything
+      // else — there is no separate block editor.
+      const operation = buildBlockHtmlOperation(source, node);
+      if (operation) addEntry(node, [operation]);
+      for (const child of node.children || []) visit(child);
+      return;
+    }
+
+    // A rich-text block owns its whole inner fragment; do not descend into it.
+    if (isRichTextRegion(node)) {
+      const operation = buildRichTextOperation(source, node);
+      if (operation) {
+        addEntry(node, [operation]);
+        return;
+      }
+    }
+
+    if (editableTags.has(node.name)) {
+      const operations = buildOperations(source, node, constants);
+      if (operations.length > 0) addEntry(node, operations);
+    }
+
+    for (const child of node.children || []) visit(child);
+  };
+
+  visit(ast);
+  if (propOps.length > 0) {
+    const id = createEntryId(file, propOps);
+    entries[id] = { id, file, tag: "page", kind: "data", label: "page text", operations: propOps };
+  }
+
+  return {
+    code: applyInsertions(source, insertions),
+    entries
+  };
+}
+
+// A component prop carries display copy when its name is not a structural one
+// (class/id/href/src/style/slot/…) and its value is plain text, not a path,
+// link, asset, or multi-line value. A newline is excluded so an edited prop can
+// never reshape the component tag.
+function isDisplayTextProp(name, value) {
+  if (!isDisplayTextField(name, value)) return false;
+  if (/^(?:slot|set:|is:|client:|server:|transition:|data-)/i.test(name)) return false;
+  return !/[\r\n]/.test(String(value || ""));
+}
+
+function buildBlockHtmlOperation(source, element) {
+  const innerStart = findOpenTagEnd(source, element.position.start.offset);
+  const closeTag = `</${element.name}>`;
+  const endOffset = element.position?.end?.offset;
+  const innerEnd = endOffset != null && source.slice(endOffset - closeTag.length, endOffset).toLowerCase() === closeTag
+    ? endOffset - closeTag.length
+    : source.indexOf(`</${element.name}`, innerStart);
+  if (innerEnd < innerStart) return null;
+  return {
+    kind: "block-html",
+    name: "body",
+    start: innerStart,
+    end: innerEnd,
+    oldValue: source.slice(innerStart, innerEnd)
+  };
+}
+
+function hasAttribute(element, name) {
+  return (element.attributes || []).some((attribute) => attribute.name === name);
+}
+
+function staticAttributeValue(element, name) {
+  const attribute = (element.attributes || []).find((item) => item.name === name);
+  return attribute?.kind === "quoted" ? String(attribute.value || "") : "";
+}
+
+function isStaticSectionChild(node) {
+  return (node.type === "element" || node.type === "component" || node.type === "custom-element")
+    && node.position?.start?.offset != null
+    && node.position?.end?.offset != null;
+}
+
+function normalizeSectionTools(value) {
+  const allowed = new Set(["header", "paragraph", "image", "list", "quote", "delimiter"]);
+  const tools = String(value || "")
+    .split(",")
+    .map((item) => item.trim().toLowerCase())
+    .filter((item) => allowed.has(item));
+  return tools.length ? [...new Set(tools)] : [...allowed];
+}
+
+function buildOuterSpan(source, element) {
+  const start = element.position?.start?.offset;
+  let end = element.position?.end?.offset;
+  if (start == null || end == null || end <= start) return null;
+  const openTagEnd = findOpenTagEnd(source, start);
+  const selfClosing = source[openTagEnd - 2] === "/";
+  if (selfClosing || voidLikeMediaTags.has(element.name)) {
+    end = openTagEnd;
+  } else {
+    const closeTag = `</${element.name}>`;
+    if (source.slice(end - closeTag.length, end).toLowerCase() !== closeTag) {
+      const closeStart = source.indexOf(`</${element.name}`, openTagEnd);
+      if (closeStart !== -1) end = source.indexOf(">", closeStart) + 1;
+    }
+  }
+  return {
+    outerStart: start,
+    outerEnd: end,
+    outerValue: source.slice(start, end)
+  };
+}
+
+// A rich-text region is a block-level text container whose entire subtree is
+// static text + allowed inline marks (no expressions, components, media, or
+// block children). It is edited as one fragment, enabling formatting on any
+// paragraph/heading — including ones that are currently plain text.
+function isRichTextRegion(node) {
+  if (!richTextBlockTags.has(node.name)) return false;
+  if (!hasMeaningfulText(node)) return false;
+  // div/label are permissive — they cover a styled note or a form label, which is
+  // a genuine TEXT RUN (it has direct text). A div/label that only wraps inline
+  // elements is a layout container (e.g. a grid of <a> buttons), not copy, and
+  // must NOT collapse into one rich-text region — its children stay individually
+  // editable. The semantic block tags (p, h1–h6, li, …) keep the looser rule.
+  if ((node.name === "div" || node.name === "label") && !hasDirectText(node)) return false;
+  return isPureInlineSubtree(node);
+}
+
+function hasDirectText(node) {
+  return (node.children || []).some((child) => child.type === "text" && (child.value ?? "").trim());
+}
+
+function isPureInlineSubtree(node) {
+  for (const child of node.children || []) {
+    if (child.type === "text") continue;
+    if (child.type !== "element") return false; // expression, component, comment
+    if (!inlineMarkTags.has(child.name)) return false;
+    if ((child.attributes || []).some((attribute) => attribute.kind === "expression")) return false;
+    if (!isPureInlineSubtree(child)) return false;
+  }
+  return true;
+}
+
+function hasMeaningfulText(node) {
+  if (node.type === "text") return Boolean((node.value ?? "").trim());
+  if (node.type === "expression") return false;
+  return (node.children || []).some(hasMeaningfulText);
+}
+
+function buildRichTextOperation(source, element) {
+  const innerStart = findOpenTagEnd(source, element.position.start.offset);
+  const closeTag = `</${element.name}>`;
+  const endOffset = element.position?.end?.offset;
+  let innerEnd;
+  if (endOffset != null && source.slice(endOffset - closeTag.length, endOffset).toLowerCase() === closeTag) {
+    innerEnd = endOffset - closeTag.length;
+  } else {
+    innerEnd = source.indexOf(`</${element.name}`, innerStart);
+  }
+  if (innerEnd < innerStart) return null;
+  const oldValue = source.slice(innerStart, innerEnd);
+  if (!oldValue.trim()) return null;
+  return {
+    kind: "rich-text",
+    name: "text",
+    start: innerStart,
+    end: innerEnd,
+    oldValue
+  };
+}
+
+function buildOperations(source, element, constants) {
+  const operations = [];
+
+  for (const attribute of element.attributes || []) {
+    if (!editableAttributes.has(attribute.name)) continue;
+    if (attribute.kind === "quoted") {
+      const span = locateAttributeValue(source, attribute);
+      if (!span) continue;
+      operations.push({
+        kind: "attribute",
+        name: attribute.name,
+        quote: span.quote,
+        start: span.start,
+        end: span.end,
+        oldValue: attribute.value
+      });
+    } else if (attribute.kind === "expression") {
+      const resolved = constants.resolve(String(attribute.value).trim());
+      if (!resolved) continue;
+      operations.push({
+        kind: "attribute-expression",
+        name: attribute.name,
+        // The resolved value lives inside a JS string literal in frontmatter, so
+        // the write re-escapes for THAT quote, not for HTML. The char just before
+        // the value span is the literal's opening quote.
+        quote: source[resolved.start - 1],
+        start: resolved.start,
+        end: resolved.end,
+        oldValue: resolved.value,
+        expression: String(attribute.value).trim()
+      });
+    }
+  }
+
+  operations.push(...buildTextOperations(source, element, constants));
+
+  return operations;
+}
+
+// Returns the text operation(s) for an element. A direct text edit is only safe
+// when the content is a single static text node, or a single expression that
+// resolves to a static const. When static text is INTERLEAVED with {expressions}
+// (e.g. `© {year} Company`), each static run becomes its own editable segment and
+// the expressions stay locked. Rich-text regions are handled before this path.
+function buildTextOperations(source, element, constants) {
+  const children = element.children || [];
+  const meaningful = children.filter((child) => !isBlankText(child));
+
+  if (meaningful.length === 1 && meaningful[0].type === "expression") {
+    const expression = readExpressionSource(meaningful[0]);
+    if (expression == null) return [];
+    const resolved = constants.resolve(expression);
+    if (!resolved) return [];
+    return [{ kind: "text-expression", name: "text", start: resolved.start, end: resolved.end, oldValue: resolved.value, expression, quote: source[resolved.start - 1] }];
+  }
+
+  if (meaningful.length === 1 && meaningful[0].type === "text") {
+    return asArray(buildPlainTextOperation(meaningful[0]));
+  }
+
+  // One real text node beside only decorative inline children — a trailing "↗"
+  // arrow, an icon <svg>, a chevron <span> carrying no words. The visible label
+  // is that single text node, byte-mapped exactly; the icon is left untouched.
+  const textNodes = meaningful.filter((child) => child.type === "text");
+  const others = meaningful.filter((child) => child.type !== "text");
+  if (textNodes.length === 1 && others.length > 0 && others.every(isDecorativeInline)) {
+    return asArray(buildPlainTextOperation(textNodes[0]));
+  }
+
+  if (meaningful.length === 0 && children.length === 1 && children[0].type === "text") {
+    return asArray(buildPlainTextOperation(children[0]));
+  }
+
+  // Static text interleaved with {expressions} — only when every child is text
+  // or an expression (any inline element would make the fragment ambiguous, and
+  // is left to the rich-text path). Each static run carrying words becomes its
+  // own editable segment; the live expressions between them stay untouched.
+  if (meaningful.length > 1
+    && meaningful.every((child) => child.type === "text" || child.type === "expression")
+    && meaningful.some((child) => child.type === "expression")) {
+    return meaningful
+      .filter((child) => child.type === "text" && isEditableProse(child.value))
+      .map((child, index) => buildPlainTextOperation(child, `seg${index}`))
+      .filter(Boolean);
+  }
+  return [];
+}
+
+function asArray(operation) {
+  return operation ? [operation] : [];
+}
+
+// A static run worth offering as a segment: it carries real words, not just a
+// lone symbol or a bare HTML entity (e.g. `&copy;`, `·`, `—`).
+function isEditableProse(value) {
+  const text = String(value || "").trim();
+  if (/^&[a-z]+\d*;$/i.test(text)) return false;
+  return /[\p{L}\p{N}]{2,}/u.test(text.replace(/&[a-z]+\d*;/gi, ""));
+}
+
+// An inline child that carries no words — an icon or a symbol like "↗", "→",
+// "×". Editing the sibling text must never disturb it, and it never counts as
+// editable text itself. This covers two forms with identical safety:
+//   • an inline ELEMENT (a chevron <svg>, an arrow <span>, a mark like <strong>);
+//   • an icon COMPONENT (<ChevronRight/>, <Icon name="arrow"/>) — pervasive in
+//     modern themes next to button/link labels. We only ever edit the sibling
+//     text node's exact byte span, never the component, and the runtime binds
+//     only when the element's rendered textContent matches that text — so an
+//     icon that unexpectedly renders words simply stays unbound, never miswritten.
+function isDecorativeInline(node) {
+  if (node.type === "component" || node.type === "custom-element") {
+    // An icon/decoration component carries no words in source, so editing the
+    // sibling text never touches it. Its attributes (commonly expressions like
+    // size={16} or name={dir}) have no bearing on that text edit, and the runtime
+    // binds only while the element's rendered textContent still matches — so an
+    // icon that renders words just stays unbound, never miswritten.
+    return !/[\p{L}\p{N}]/u.test(nodeText(node));
+  }
+  if (node.type !== "element") return false;
+  if (!inlineMarkTags.has(node.name) && !["span", "svg", "i", "use", "path"].includes(node.name)) return false;
+  if ((node.attributes || []).some((attribute) => attribute.kind === "expression")) return false;
+  return !/[\p{L}\p{N}]/u.test(nodeText(node));
+}
+
+function nodeText(node) {
+  if (node.type === "text") return node.value ?? "";
+  return (node.children || []).map(nodeText).join("");
+}
+
+function buildPlainTextOperation(textNode, name = "text") {
+  const start = textNode.position?.start?.offset;
+  const end = textNode.position?.end?.offset;
+  if (start == null || end == null) return null;
+  const raw = textNode.value ?? "";
+  const oldValue = raw.trim();
+  if (!oldValue) return null;
+  const leading = raw.match(/^\s*/)?.[0].length || 0;
+  const trailing = raw.match(/\s*$/)?.[0].length || 0;
+  return {
+    kind: "text",
+    name,
+    start: start + leading,
+    end: end - trailing,
+    oldValue
+  };
+}
+
+// The compiler models `{expr}` as an expression node whose token children carry
+// the JS (its own position offsets are unreliable, so we read the children, not
+// the source). A non-text token (nested element/expression) means it is not a
+// simple value expression — return null so it is treated as dynamic.
+function readExpressionSource(node) {
+  const parts = [];
+  for (const child of node.children || []) {
+    if (child.type !== "text") return null;
+    parts.push(child.value ?? "");
+  }
+  const expression = parts.join("").trim();
+  return expression || null;
+}
+
+// Attribute nodes expose only a start offset (the attribute name). The exact
+// value span is derived from the raw quoted token, located from that offset.
+function locateAttributeValue(source, attribute) {
+  if (String(attribute.value).includes("{") || String(attribute.value).includes("}")) return null;
+  const from = attribute.position?.start?.offset;
+  if (from == null) return null;
+  const raw = attribute.raw;
+  if (!raw || (raw[0] !== '"' && raw[0] !== "'")) return null;
+  const rawStart = source.indexOf(raw, from);
+  if (rawStart === -1) return null;
+  const quote = raw[0];
+  const valueStart = rawStart + 1;
+  return {
+    quote,
+    start: valueStart,
+    end: valueStart + attribute.value.length
+  };
+}
+
+// Build a lookup from UTF-8 byte offset → UTF-16 char index. Every byte of a
+// multibyte char maps to that char's index; the final entry maps total length.
+function buildByteToCharMap(source) {
+  const map = [];
+  let byte = 0;
+  for (let i = 0; i < source.length; ) {
+    const codePoint = source.codePointAt(i);
+    const byteLength = codePoint <= 0x7f ? 1 : codePoint <= 0x7ff ? 2 : codePoint <= 0xffff ? 3 : 4;
+    for (let k = 0; k < byteLength; k++) map[byte + k] = i;
+    byte += byteLength;
+    i += codePoint > 0xffff ? 2 : 1;
+  }
+  map[byte] = source.length;
+  return map;
+}
+
+function normalizeAstOffsets(node, map) {
+  const convert = (position) => {
+    if (position?.start && typeof position.start.offset === "number") {
+      position.start.offset = map[position.start.offset] ?? position.start.offset;
+    }
+    if (position?.end && typeof position.end.offset === "number") {
+      position.end.offset = map[position.end.offset] ?? position.end.offset;
+    }
+  };
+  convert(node.position);
+  for (const attribute of node.attributes || []) convert(attribute.position);
+  for (const child of node.children || []) normalizeAstOffsets(child, map);
+}
+
+function isBlankText(node) {
+  return node.type === "text" && !(node.value ?? "").trim();
+}
+
+// Scan from the opening `<` to the `>` that closes the open tag, ignoring `>`
+// inside quoted or `{expression}` attribute values.
+function findOpenTagEnd(source, start) {
+  let quote = null;
+  let braceDepth = 0;
+  for (let i = start + 1; i < source.length; i++) {
+    const ch = source[i];
+    if (quote) {
+      if (ch === quote) quote = null;
+      continue;
+    }
+    if (ch === '"' || ch === "'") quote = ch;
+    else if (ch === "{") braceDepth++;
+    else if (ch === "}") braceDepth = Math.max(0, braceDepth - 1);
+    else if (ch === ">" && braceDepth === 0) return i + 1;
+  }
+  return source.length;
+}
+
+function collectStaticConstants(source) {
+  const frontmatter = getFrontmatter(source);
+  if (!frontmatter) return EMPTY_CONSTANTS;
+  // Resolution is delegated to the Babel parser (js-ast.js): the full JS/TS
+  // grammar with exact source offsets, so const data structures resolve at any
+  // nesting depth (`team[0].links.site`). It is still NOT an evaluator — only
+  // string/object/array literal shapes become resolvable; calls, template
+  // literals, conditions and identifiers stay dynamic. If the frontmatter cannot
+  // be parsed it is invalid TypeScript, so the page does not build anyway: we
+  // resolve nothing rather than guess, and every write stays byte-verified
+  // downstream regardless.
+  const trees = buildConstantTrees(frontmatter.value, frontmatter.offset);
+  if (!trees) return EMPTY_CONSTANTS;
+  return { resolve: (expression) => resolveExpressionTree(trees, expression) };
+}
+
+const EMPTY_CONSTANTS = { resolve: () => null };
+
+function applyInsertions(source, insertions) {
+  let code = source;
+  // Work backwards so each earlier source offset remains valid after inserting
+  // attributes at later offsets. This is the only template rewrite performed by
+  // the analyzer; expressions and rendered control flow remain byte-identical.
+  for (const insertion of insertions.sort((a, b) => b.index - a.index)) {
+    code = `${code.slice(0, insertion.index)}${insertion.value}${code.slice(insertion.index)}`;
+  }
+  return code;
+}