vantage-md 0.1.7 → 0.5.4

package/dist/react.js

@@ -36,25 +36,503 @@ var BLOCK_TAGS = /* @__PURE__ */ new Set([
   "hr",
   "div"
 ]);
-function visit(node) {
+function visit(node, offset) {
   if ("children" in node) {
     for (const child of node.children) {
       if (child.type === "element") {
         if (BLOCK_TAGS.has(child.tagName) && child.position?.start?.line) {
           child.properties = child.properties || {};
-          child.properties["dataSourceLine"] = child.position.start.line;
+          child.properties["dataSourceLine"] = child.position.start.line + offset;
         }
-        visit(child);
+        visit(child, offset);
       }
     }
   }
 }
-var rehypeSourceLines = () => {
+var rehypeSourceLines = (options) => {
+  const offset = options?.offset ?? 0;
   return (tree) => {
-    visit(tree);
+    visit(tree, offset);
   };
 };
 var rehypeSourceLines_default = rehypeSourceLines;
+
+// src/vantageDirectives.ts
+var VANTAGE_TONES = [
+  "note",
+  "tip",
+  "important",
+  "warning",
+  "caution",
+  "muted"
+];
+var VANTAGE_EMPHASIS = ["strong", "normal", "quiet"];
+var VANTAGE_BADGES = [
+  "draft",
+  "stale",
+  "blocked",
+  "done",
+  "wip"
+];
+var VANTAGE_COLLAPSED = ["true", "false"];
+var VANTAGE_RUNS = ["start", "middle", "end", "only"];
+var VANTAGE_STYLE_TARGETS = [
+  "p",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "li",
+  "blockquote",
+  "pre",
+  "table",
+  "tr",
+  "ul",
+  "ol",
+  "hr",
+  "div"
+];
+var VANTAGE_ANCHOR_TARGETS = [
+  "p",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "li",
+  "blockquote",
+  "pre",
+  "table"
+];
+var STYLE_KEYS = {
+  tone: VANTAGE_TONES,
+  emphasis: VANTAGE_EMPHASIS,
+  badge: VANTAGE_BADGES,
+  collapsed: VANTAGE_COLLAPSED
+};
+var DIRECTIVE_VOCABULARY = {
+  section: STYLE_KEYS,
+  block: STYLE_KEYS,
+  oq: { id: null, leaning: null }
+};
+var WS = /[ \t\r\n]*/y;
+var SENTINEL_PREFIX = /^[ \t\r\n]*vantage:/;
+var NAME = /[a-z][a-z0-9-]*/y;
+var UNQUOTED = /[A-Za-z0-9_.:#-]+/y;
+var QUOTED = /"[^"]*"/y;
+function token(comment, offset) {
+  const rest = comment.slice(offset);
+  const end = rest.search(/[ \t\r\n]/);
+  const word = end === -1 ? rest : rest.slice(0, end);
+  return word.length > 24 ? `${word.slice(0, 24)}\u2026` : word;
+}
+function matchAt(pattern, comment, offset) {
+  pattern.lastIndex = offset;
+  const match = pattern.exec(comment);
+  return match === null ? null : match[0];
+}
+function skipWhitespace(comment, offset) {
+  return matchAt(WS, comment, offset)?.length ?? 0;
+}
+function malformed(reason, offset) {
+  return { kind: "malformed", reason, offset };
+}
+function parseVantageDirective(comment) {
+  const sentinel = SENTINEL_PREFIX.exec(comment);
+  if (sentinel === null) return null;
+  let at = sentinel[0].length;
+  at += skipWhitespace(comment, at);
+  const nameOffset = at;
+  const name = matchAt(NAME, comment, at);
+  if (name === null) {
+    return malformed("no directive name after `vantage:`", at);
+  }
+  at += name.length;
+  const pairs = [];
+  while (at < comment.length) {
+    const gap = skipWhitespace(comment, at);
+    at += gap;
+    if (at >= comment.length) break;
+    if (gap === 0) {
+      return malformed(`\`${token(comment, at)}\` needs a space before it`, at);
+    }
+    const keyOffset = at;
+    const key = matchAt(NAME, comment, at);
+    if (key === null) {
+      return malformed(
+        `\`${token(comment, at)}\` is not a \`key=value\` pair`,
+        at
+      );
+    }
+    at += key.length;
+    if (comment[at] !== "=") {
+      return malformed(`\`${key}\` is not followed by \`=value\``, at);
+    }
+    at += 1;
+    const valueOffset = at;
+    const quoted = matchAt(QUOTED, comment, at);
+    if (quoted !== null) {
+      at += quoted.length;
+      pairs.push({
+        key,
+        value: quoted.slice(1, -1),
+        keyOffset,
+        valueOffset,
+        quoted: true
+      });
+      continue;
+    }
+    const unquoted = matchAt(UNQUOTED, comment, at);
+    if (unquoted === null) {
+      const found = token(comment, at);
+      return malformed(
+        found === "" ? `\`${key}=\` has no value` : `\`${found}\` is not a valid value for \`${key}\``,
+        at
+      );
+    }
+    at += unquoted.length;
+    pairs.push({ key, value: unquoted, keyOffset, valueOffset, quoted: false });
+  }
+  return { kind: "directive", name, nameOffset, pairs };
+}
+
+// src/rehypeVantageDirectives.ts
+var STYLE_TARGET_TAGS = new Set(VANTAGE_STYLE_TARGETS);
+var ANCHOR_TARGET_TAGS = new Set(VANTAGE_ANCHOR_TARGETS);
+var HEADING_DEPTHS = /* @__PURE__ */ new Map([
+  ["h1", 1],
+  ["h2", 2],
+  ["h3", 3],
+  ["h4", 4],
+  ["h5", 5],
+  ["h6", 6]
+]);
+var RANGE_PROPERTIES = /* @__PURE__ */ new Map([
+  ["tone", "dataVantageTone"],
+  ["emphasis", "dataVantageEmphasis"]
+]);
+var POINT_PROPERTIES = /* @__PURE__ */ new Map([["badge", "dataVantageBadge"]]);
+var RUN_PROPERTY = "dataVantageRun";
+var OQ_PROPERTY = "dataVantageOq";
+var LEANING_PROPERTY = "dataVantageLeaning";
+var COLLAPSED_PROPERTY = "dataVantageCollapsed";
+var COLLAPSE_GROUP_PROPERTY = "dataVantageCollapseGroup";
+var COLLAPSE_TOGGLE_PROPERTY = "dataVantageCollapseToggle";
+var MAX_LEANING = 500;
+function isSkippable(node) {
+  if (node.type === "comment" || node.type === "doctype") return true;
+  if (node.type === "text") return node.value.trim() === "";
+  return false;
+}
+function headingDepth(node) {
+  if (node.type !== "element") return void 0;
+  return HEADING_DEPTHS.get(node.tagName);
+}
+function setProperty(element, property, value) {
+  element.properties = element.properties ?? {};
+  element.properties[property] = value;
+}
+function runValue(index, length) {
+  if (length === 1) return "only";
+  if (index === 0) return "start";
+  return index === length - 1 ? "end" : "middle";
+}
+function vocabularyOf(name, key) {
+  return DIRECTIVE_VOCABULARY[name]?.[key];
+}
+function accepts(name, key, value) {
+  const values = vocabularyOf(name, key);
+  if (values === void 0) return false;
+  return values === null || values.includes(value);
+}
+function styleRange(children, targetIndex, name) {
+  const range = [targetIndex];
+  const depth = name === "section" ? headingDepth(children[targetIndex]) : void 0;
+  if (depth === void 0) return range;
+  for (let i = targetIndex + 1; i < children.length; i++) {
+    const node = children[i];
+    const nodeDepth = headingDepth(node);
+    if (nodeDepth !== void 0 && nodeDepth <= depth) break;
+    if (node.type === "element" && STYLE_TARGET_TAGS.has(node.tagName)) {
+      range.push(i);
+    }
+  }
+  return range;
+}
+function collapsesSection(name, pairs, target) {
+  if (name !== "section") return false;
+  if (pairs.get("collapsed") !== "true") return false;
+  return headingDepth(target) !== void 0;
+}
+function stampStyle(children, targetIndex, name, pairs, state) {
+  const target = children[targetIndex];
+  if (!STYLE_TARGET_TAGS.has(target.tagName)) return;
+  const rangeStamps = [];
+  const targetStamps = [];
+  for (const [key, value] of pairs) {
+    if (!accepts(name, key, value)) continue;
+    const rangeProperty = RANGE_PROPERTIES.get(key);
+    if (rangeProperty !== void 0) {
+      rangeStamps.push([rangeProperty, value]);
+      continue;
+    }
+    const pointProperty = POINT_PROPERTIES.get(key);
+    if (pointProperty !== void 0) targetStamps.push([pointProperty, value]);
+  }
+  const collapses = collapsesSection(name, pairs, target);
+  if (rangeStamps.length === 0 && targetStamps.length === 0 && !collapses) {
+    return;
+  }
+  const range = styleRange(children, targetIndex, name);
+  const group = collapses && range.length > 1 ? String(state.nextGroup++) : void 0;
+  for (let i = 0; i < range.length; i++) {
+    const element = children[range[i]];
+    for (const [property, value] of rangeStamps) {
+      setProperty(element, property, value);
+    }
+    if (i === 0) {
+      for (const [property, value] of targetStamps) {
+        setProperty(element, property, value);
+      }
+    }
+    if (rangeStamps.length > 0) {
+      setProperty(element, RUN_PROPERTY, runValue(i, range.length));
+    }
+    if (group === void 0) continue;
+    if (i === 0) {
+      setProperty(element, COLLAPSE_TOGGLE_PROPERTY, group);
+    } else {
+      setProperty(element, COLLAPSED_PROPERTY, "true");
+      setProperty(element, COLLAPSE_GROUP_PROPERTY, group);
+    }
+  }
+}
+function stampOq(target, pairs) {
+  setProperty(target, OQ_PROPERTY, "true");
+  const leaning = pairs.get("leaning");
+  if (leaning === void 0) return;
+  const text = leaning.replace(/\s+/g, " ").trim().slice(0, MAX_LEANING);
+  if (text !== "") setProperty(target, LEANING_PROPERTY, text);
+}
+function stampRun(children, targetIndex, run, state) {
+  const target = children[targetIndex];
+  const style = /* @__PURE__ */ new Map();
+  const oq = /* @__PURE__ */ new Map();
+  let styleName;
+  let hasOq = false;
+  for (const directive of run) {
+    if (directive.name === "section" || directive.name === "block") {
+      styleName = directive.name;
+      for (const pair of directive.pairs) style.set(pair.key, pair.value);
+    } else if (directive.name === "oq") {
+      hasOq = true;
+      for (const pair of directive.pairs) oq.set(pair.key, pair.value);
+    }
+  }
+  if (styleName !== void 0) {
+    stampStyle(children, targetIndex, styleName, style, state);
+  }
+  if (hasOq && ANCHOR_TARGET_TAGS.has(target.tagName)) {
+    stampOq(target, oq);
+  }
+}
+function directiveOf(node) {
+  if (node.type !== "comment") return void 0;
+  const parsed = parseVantageDirective(node.value);
+  return parsed !== null && parsed.kind === "directive" ? parsed : void 0;
+}
+function processChildren(parent, state) {
+  const children = parent.children;
+  let i = 0;
+  while (i < children.length) {
+    const node = children[i];
+    if (node.type === "element") {
+      processChildren(node, state);
+      i++;
+      continue;
+    }
+    const first = directiveOf(node);
+    if (first === void 0) {
+      i++;
+      continue;
+    }
+    const run = [first];
+    let j = i + 1;
+    let targetIndex = -1;
+    for (; j < children.length; j++) {
+      const next = children[j];
+      if (next.type === "element") {
+        targetIndex = j;
+        break;
+      }
+      if (!isSkippable(next)) break;
+      const directive = directiveOf(next);
+      if (directive !== void 0) run.push(directive);
+    }
+    if (targetIndex >= 0) stampRun(children, targetIndex, run, state);
+    i = j;
+  }
+}
+var rehypeVantageDirectives = () => {
+  return (tree) => {
+    processChildren(tree, { nextGroup: 1 });
+  };
+};
+var rehypeVantageDirectives_default = rehypeVantageDirectives;
+
+// src/rehypeVantageMathStamps.ts
+var CARRIED_KEY = "vantageDisplayMathStamps";
+function classNames(node) {
+  const value = node.properties?.className;
+  return Array.isArray(value) ? value.map(String) : [];
+}
+function isDisplayMath(node) {
+  if (node.type !== "element" || node.tagName !== "pre") return false;
+  return node.children.some(
+    (child) => child.type === "element" && child.tagName === "code" && classNames(child).includes("language-math")
+  );
+}
+function carriedProperties(properties) {
+  const carried = {};
+  for (const [key, value] of Object.entries(properties ?? {})) {
+    if (key === "dataSourceLine" || key.startsWith("dataVantage")) {
+      carried[key] = value;
+    }
+  }
+  return carried;
+}
+function collect(parent, out) {
+  const children = parent.children;
+  for (let i = 0; i < children.length; i++) {
+    const node = children[i];
+    if (node.type !== "element") continue;
+    if (isDisplayMath(node)) {
+      const properties = carriedProperties(node.properties);
+      if (Object.keys(properties).length > 0) {
+        out.push({
+          parent,
+          anchor: i === 0 ? void 0 : children[i - 1],
+          properties
+        });
+      }
+      continue;
+    }
+    collect(node, out);
+  }
+}
+function reapply(carried) {
+  for (const { parent, anchor, properties } of carried) {
+    const siblings = parent.children;
+    let index = 0;
+    if (anchor !== void 0) {
+      const at = siblings.indexOf(anchor);
+      if (at === -1) continue;
+      index = at + 1;
+    }
+    const replacement = siblings[index];
+    if (replacement === void 0 || replacement.type !== "element") continue;
+    if (!classNames(replacement).some((name) => name.startsWith("katex"))) {
+      continue;
+    }
+    replacement.properties ??= {};
+    for (const [key, value] of Object.entries(properties)) {
+      replacement.properties[key] ??= value;
+    }
+  }
+}
+var rehypeCaptureMathStamps = () => {
+  return (tree, file) => {
+    const carried = [];
+    collect(tree, carried);
+    file.data[CARRIED_KEY] = carried;
+  };
+};
+var rehypeRestoreMathStamps = () => {
+  return (_tree, file) => {
+    const carried = file.data[CARRIED_KEY];
+    delete file.data[CARRIED_KEY];
+    if (Array.isArray(carried)) reapply(carried);
+  };
+};
+var SAFE_STYLE_PROPERTIES = [
+  // Box metrics. `top`/`right`/`bottom`/`left` are inert now that `position` is
+  // banned, and they stay only because dropping them would fail the whole
+  // attribute for a document that writes one — the all-or-nothing rule below
+  // makes every removal a behaviour change. They buy an attacker nothing that
+  // negative `margin` does not already buy.
+  "height",
+  "min-height",
+  "max-height",
+  "width",
+  "min-width",
+  "max-width",
+  "top",
+  "bottom",
+  "left",
+  "right",
+  "margin",
+  "margin-top",
+  "margin-right",
+  "margin-bottom",
+  "margin-left",
+  "padding",
+  "padding-top",
+  "padding-right",
+  "padding-bottom",
+  "padding-left",
+  // Rules and boxes.
+  "border",
+  "border-style",
+  "border-color",
+  "border-width",
+  "border-top-width",
+  "border-right-width",
+  "border-bottom-width",
+  "border-left-width",
+  "border-top-style",
+  "border-right-style",
+  "border-bottom-style",
+  "border-left-style",
+  "border-top-color",
+  "border-right-color",
+  "border-bottom-color",
+  "border-left-color",
+  "border-radius",
+  // Typography.
+  "color",
+  "background-color",
+  "font",
+  "font-size",
+  "font-style",
+  "font-weight",
+  "font-family",
+  "font-variant",
+  "line-height",
+  "letter-spacing",
+  "word-spacing",
+  "text-align",
+  "text-decoration",
+  "text-indent",
+  "white-space",
+  "vertical-align",
+  "list-style-type",
+  // Flow.
+  "display",
+  "float",
+  "clear",
+  "opacity",
+  "overflow"
+];
+var VALUE = `[^;:()"'\\\\]*`;
+var DECLARATION = `(?:(?:${SAFE_STYLE_PROPERTIES.join("|")})\\s*:${VALUE})`;
+var SAFE_STYLE = new RegExp(
+  `^\\s*(?:${DECLARATION};\\s*)*${DECLARATION}?$`,
+  "i"
+);
+var COLLAPSE_GROUP_ID = /^[0-9]+$/;
 var sanitizeSchema = {
   ...defaultSchema,
   tagNames: [
@@ -90,20 +568,94 @@ var sanitizeSchema = {
     "*": [
       ...defaultSchema.attributes?.["*"] || [],
       "className",
-      "style",
-      "dataSourceLine"
+      ["style", SAFE_STYLE],
+      "dataSourceLine",
+      // What `rehypeVantageDirectives` compiles a `<!-- vantage: … -->` comment
+      // into, named individually — never by a `data-vantage-*` wildcard, which
+      // would readmit whatever a future bug emits and whatever a document
+      // hand-writes as raw HTML.
+      //
+      // The value lists are the belt to the plugin's braces: the vocabulary is
+      // closed in the plugin *and* here, imported from the one module that
+      // defines it, so even if a refactor let an unvalidated value reach the
+      // tree the sanitiser still refuses it.
+      ["dataVantageTone", ...VANTAGE_TONES],
+      ["dataVantageEmphasis", ...VANTAGE_EMPHASIS],
+      ["dataVantageBadge", ...VANTAGE_BADGES],
+      ["dataVantageCollapsed", ...VANTAGE_COLLAPSED],
+      // The other half of `collapsed`: which group a hidden block belongs to,
+      // and which group a heading toggles. Both are plugin-minted counters with
+      // no vocabulary to allowlist, so they take a pattern instead —
+      // `hast-util-sanitize` accepts a `RegExp` in place of a literal value.
+      // A pattern rather than a bare name because the JS interpolates the value
+      // into a selector: anything but digits has no business reaching it.
+      ["dataVantageCollapseGroup", COLLAPSE_GROUP_ID],
+      ["dataVantageCollapseToggle", COLLAPSE_GROUP_ID],
+      ["dataVantageRun", ...VANTAGE_RUNS],
+      ["dataVantageOq", "true"],
+      // The design's one genuinely free-text value: the body of a review
+      // comment, so it cannot be value-allowlisted and this entry is name-only.
+      // Two defences remain rather than three — `hast` escapes the value on
+      // serialisation and React sets it through the DOM property path, so it
+      // cannot break out of the attribute — and the honest record of that is in
+      // the design doc rather than a third layer implied here.
+      "dataVantageLeaning"
     ],
     code: [...defaultSchema.attributes?.code || [], "className"],
-    span: [...defaultSchema.attributes?.span || [], "className", "style"],
-    div: [...defaultSchema.attributes?.div || [], "className", "style"],
+    span: [
+      ...defaultSchema.attributes?.span || [],
+      "className",
+      ["style", SAFE_STYLE]
+    ],
+    div: [
+      ...defaultSchema.attributes?.div || [],
+      "className",
+      ["style", SAFE_STYLE]
+    ],
     a: [...defaultSchema.attributes?.a || [], "id", "className"],
     math: ["xmlns"],
     annotation: ["encoding"],
     img: [...defaultSchema.attributes?.img || [], "loading"],
-    td: [...defaultSchema.attributes?.td || [], "style"],
-    th: [...defaultSchema.attributes?.th || [], "style"]
+    td: [...defaultSchema.attributes?.td || [], ["style", SAFE_STYLE]],
+    th: [...defaultSchema.attributes?.th || [], ["style", SAFE_STYLE]]
   }
 };
+
+// src/pipeline.ts
+function buildRemarkPlugins(options = {}) {
+  const { gfm = true, math = true } = options;
+  const plugins = [];
+  if (gfm) plugins.push([remarkGfm, { singleTilde: false }]);
+  if (math) plugins.push([remarkMath, { singleDollarTextMath: false }]);
+  return plugins;
+}
+function buildRehypePlugins(options = {}) {
+  const {
+    math = true,
+    highlight = true,
+    sourceLines = true,
+    sanitize = true,
+    bodyLineOffset = 0
+  } = options;
+  const plugins = [rehypeRaw];
+  if (sourceLines) {
+    plugins.push([rehypeSourceLines_default, { offset: bodyLineOffset }]);
+  }
+  plugins.push(rehypeVantageDirectives_default);
+  if (sanitize) plugins.push([rehypeSanitize, sanitizeSchema]);
+  plugins.push(rehypeSlug);
+  if (highlight) plugins.push(rehypeHighlight);
+  if (math) {
+    plugins.push(rehypeCaptureMathStamps, rehypeKatex, rehypeRestoreMathStamps);
+  }
+  return plugins;
+}
+function buildPipeline(options = {}) {
+  return {
+    remarkPlugins: buildRemarkPlugins(options),
+    rehypePlugins: buildRehypePlugins(options)
+  };
+}
 function parseFrontmatter(content) {
   if (content.startsWith("+++")) {
     return parseFrontmatterWithDelimiter(content, "+++", "toml");
@@ -111,24 +663,74 @@ function parseFrontmatter(content) {
   if (content.startsWith("---")) {
     return parseFrontmatterWithDelimiter(content, "---", "yaml");
   }
-  return { frontmatter: {}, body: content, format: "none" };
+  return withOffset(content, {
+    frontmatter: {},
+    body: content,
+    format: "none"
+  });
+}
+function withOffset(content, parsed) {
+  const stripped = content.slice(0, content.length - parsed.body.length);
+  let bodyLineOffset = 0;
+  for (const ch of stripped) {
+    if (ch === "\n") bodyLineOffset++;
+  }
+  return { ...parsed, bodyLineOffset };
 }
 function parseFrontmatterWithDelimiter(content, delimiter, format) {
   const searchStart = delimiter.length;
   const endIndex = content.indexOf(`
 ${delimiter}`, searchStart);
   if (endIndex === -1) {
-    return { frontmatter: {}, body: content, format: "none" };
+    return withOffset(content, {
+      frontmatter: {},
+      body: content,
+      format: "none",
+      problem: { kind: "unterminated", delimiter }
+    });
   }
   const raw = content.slice(searchStart + 1, endIndex).trim();
   const bodyStart = endIndex + 1 + delimiter.length;
   const body = content.slice(bodyStart).replace(/^\n/, "");
   try {
-    const frontmatter = format === "toml" ? parse(raw) : YAML.parse(raw);
-    return { frontmatter: frontmatter || {}, body, format };
-  } catch {
-    return { frontmatter: {}, body: content, format: "none" };
+    const parsed = format === "toml" ? parse(raw) : YAML.parse(raw);
+    return withOffset(content, {
+      frontmatter: parsed || {},
+      body,
+      format,
+      ...isMapping(parsed) ? {} : { problem: { kind: "not-a-mapping", delimiter } }
+    });
+  } catch (error) {
+    return withOffset(content, {
+      frontmatter: {},
+      body: content,
+      format: "none",
+      problem: { kind: "invalid", delimiter, ...errorPosition(error) }
+    });
+  }
+}
+function isMapping(value) {
+  return value === null || value === void 0 || typeof value === "object" && !Array.isArray(value);
+}
+function errorPosition(error) {
+  const message = error instanceof Error ? error.message : String(error);
+  const source = error;
+  const yamlPosition = source?.linePos?.[0];
+  if (typeof yamlPosition?.line === "number") {
+    return {
+      message,
+      line: yamlPosition.line,
+      ...typeof yamlPosition.col === "number" ? { column: yamlPosition.col } : {}
+    };
+  }
+  if (typeof source?.line === "number") {
+    return {
+      message,
+      line: source.line,
+      ...typeof source.column === "number" ? { column: source.column } : {}
+    };
   }
+  return { message };
 }
 
 // src/mermaidCache.ts
@@ -155,23 +757,286 @@ async function getMermaid() {
   }
   return mermaidLoading;
 }
-var AlertTriangleIcon = () => /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-4 h-4 shrink-0", children: [
-  /* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
-  /* @__PURE__ */ jsx("path", { d: "M12 9v4" }),
-  /* @__PURE__ */ jsx("path", { d: "M12 17h.01" })
-] });
-var ChevronDownIcon = () => /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3 h-3", children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" }) });
-var ChevronUpIcon = () => /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3 h-3", children: /* @__PURE__ */ jsx("path", { d: "m18 15-6-6-6 6" }) });
-var MaximizeIcon = () => /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-4 h-4 text-gray-600", children: [
-  /* @__PURE__ */ jsx("polyline", { points: "15 3 21 3 21 9" }),
-  /* @__PURE__ */ jsx("polyline", { points: "9 21 3 21 3 15" }),
-  /* @__PURE__ */ jsx("line", { x1: "21", x2: "14", y1: "3", y2: "10" }),
-  /* @__PURE__ */ jsx("line", { x1: "3", x2: "10", y1: "21", y2: "14" })
-] });
-var CloseIcon = () => /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-5 h-5", children: [
-  /* @__PURE__ */ jsx("path", { d: "M18 6 6 18" }),
-  /* @__PURE__ */ jsx("path", { d: "m6 6 12 12" })
-] });
+var AlertTriangleIcon = () => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-4 h-4 shrink-0",
+    children: [
+      /* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+      /* @__PURE__ */ jsx("path", { d: "M12 9v4" }),
+      /* @__PURE__ */ jsx("path", { d: "M12 17h.01" })
+    ]
+  }
+);
+var ChevronDownIcon = () => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "12",
+    height: "12",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-3 h-3",
+    children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" })
+  }
+);
+var ChevronUpIcon = () => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "12",
+    height: "12",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-3 h-3",
+    children: /* @__PURE__ */ jsx("path", { d: "m18 15-6-6-6 6" })
+  }
+);
+var MaximizeIcon = () => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-4 h-4 text-gray-600",
+    children: [
+      /* @__PURE__ */ jsx("polyline", { points: "15 3 21 3 21 9" }),
+      /* @__PURE__ */ jsx("polyline", { points: "9 21 3 21 3 15" }),
+      /* @__PURE__ */ jsx("line", { x1: "21", x2: "14", y1: "3", y2: "10" }),
+      /* @__PURE__ */ jsx("line", { x1: "3", x2: "10", y1: "21", y2: "14" })
+    ]
+  }
+);
+var CloseIcon = () => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "20",
+    height: "20",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-5 h-5",
+    children: [
+      /* @__PURE__ */ jsx("path", { d: "M18 6 6 18" }),
+      /* @__PURE__ */ jsx("path", { d: "m6 6 12 12" })
+    ]
+  }
+);
+var PlusIcon = () => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-4 h-4",
+    children: [
+      /* @__PURE__ */ jsx("path", { d: "M5 12h14" }),
+      /* @__PURE__ */ jsx("path", { d: "M12 5v14" })
+    ]
+  }
+);
+var MinusIcon = () => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-4 h-4",
+    children: /* @__PURE__ */ jsx("path", { d: "M5 12h14" })
+  }
+);
+var ResetIcon = () => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "w-4 h-4",
+    children: [
+      /* @__PURE__ */ jsx("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
+      /* @__PURE__ */ jsx("path", { d: "M3 3v5h5" })
+    ]
+  }
+);
+var MIN_SCALE = 0.2;
+var MAX_SCALE = 8;
+function ZoomableSvg({ svg }) {
+  const [scale, setScale] = useState(1);
+  const [offset, setOffset] = useState({ x: 0, y: 0 });
+  const dragRef = useRef(null);
+  const [isDragging, setIsDragging] = useState(false);
+  const viewportRef = useRef(null);
+  const reset = useCallback(() => {
+    setScale(1);
+    setOffset({ x: 0, y: 0 });
+  }, []);
+  const zoomBy = useCallback(
+    (factor, anchor) => {
+      setScale((prev) => {
+        const next = Math.min(MAX_SCALE, Math.max(MIN_SCALE, prev * factor));
+        if (next === prev) return prev;
+        const rect = viewportRef.current?.getBoundingClientRect();
+        if (rect) {
+          const ax = (anchor?.x ?? rect.width / 2) - rect.width / 2;
+          const ay = (anchor?.y ?? rect.height / 2) - rect.height / 2;
+          setOffset((o) => ({
+            x: ax - (ax - o.x) * next / prev,
+            y: ay - (ay - o.y) * next / prev
+          }));
+        }
+        return next;
+      });
+    },
+    []
+  );
+  const handleWheel = useCallback(
+    (e) => {
+      e.preventDefault();
+      const rect = viewportRef.current?.getBoundingClientRect();
+      const anchor = rect ? { x: e.clientX - rect.left, y: e.clientY - rect.top } : void 0;
+      zoomBy(e.deltaY < 0 ? 1.15 : 1 / 1.15, anchor);
+    },
+    [zoomBy]
+  );
+  const handlePointerDown = (e) => {
+    e.currentTarget.setPointerCapture(e.pointerId);
+    dragRef.current = {
+      startX: e.clientX,
+      startY: e.clientY,
+      originX: offset.x,
+      originY: offset.y
+    };
+    setIsDragging(true);
+  };
+  const handlePointerMove = (e) => {
+    const d = dragRef.current;
+    if (!d) return;
+    setOffset({
+      x: d.originX + (e.clientX - d.startX),
+      y: d.originY + (e.clientY - d.startY)
+    });
+  };
+  const endDrag = (e) => {
+    if (dragRef.current) {
+      try {
+        e.currentTarget.releasePointerCapture(e.pointerId);
+      } catch {
+      }
+    }
+    dragRef.current = null;
+    setIsDragging(false);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "relative w-full h-full", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: viewportRef,
+        onWheel: handleWheel,
+        onPointerDown: handlePointerDown,
+        onPointerMove: handlePointerMove,
+        onPointerUp: endDrag,
+        onPointerLeave: endDrag,
+        onDoubleClick: reset,
+        className: "w-full h-full overflow-hidden touch-none select-none",
+        style: { cursor: isDragging ? "grabbing" : "grab" },
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "mermaid-zoom flex items-center justify-center w-full h-full",
+            style: {
+              transform: `translate(${offset.x}px, ${offset.y}px) scale(${scale})`,
+              transformOrigin: "center center",
+              transition: isDragging ? "none" : "transform 0.08s ease-out"
+            },
+            dangerouslySetInnerHTML: { __html: svg }
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "absolute bottom-4 right-4 flex items-center gap-1 rounded-lg bg-white/95 shadow-md border border-gray-200 px-1.5 py-1", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => zoomBy(1 / 1.3),
+          className: "p-1.5 rounded hover:bg-gray-100 text-gray-600",
+          "aria-label": "Zoom out",
+          title: "Zoom out",
+          children: /* @__PURE__ */ jsx(MinusIcon, {})
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: reset,
+          className: "px-2 py-1 text-xs font-medium rounded hover:bg-gray-100 text-gray-600 min-w-[3rem]",
+          title: "Reset zoom (or double-click)",
+          children: [
+            Math.round(scale * 100),
+            "%"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => zoomBy(1.3),
+          className: "p-1.5 rounded hover:bg-gray-100 text-gray-600",
+          "aria-label": "Zoom in",
+          title: "Zoom in",
+          children: /* @__PURE__ */ jsx(PlusIcon, {})
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "w-px h-5 bg-gray-200 mx-0.5" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: reset,
+          className: "p-1.5 rounded hover:bg-gray-100 text-gray-600",
+          "aria-label": "Reset view",
+          title: "Reset view",
+          children: /* @__PURE__ */ jsx(ResetIcon, {})
+        }
+      )
+    ] })
+  ] });
+}
 function extractErrorMessage(err) {
   if (err instanceof Error) {
     const msg = err.message;
@@ -210,12 +1075,12 @@ function DiagramModal({
       children: /* @__PURE__ */ jsxs(
         "div",
         {
-          className: "bg-white rounded-lg shadow-xl w-full max-w-5xl max-h-[90vh] flex flex-col",
+          className: "bg-white rounded-lg shadow-xl w-[96vw] h-[94vh] flex flex-col overflow-hidden",
           role: "dialog",
           "aria-modal": "true",
           onClick: (e) => e.stopPropagation(),
           children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border-b", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border-b shrink-0", children: [
               /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold", children: "Mermaid Diagram" }),
               /* @__PURE__ */ jsx(
                 "button",
@@ -227,7 +1092,7 @@ function DiagramModal({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx("div", { className: "p-4 overflow-auto flex-1", children })
+            /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden bg-gray-50", children })
           ]
         }
       )
@@ -346,33 +1211,114 @@ var MermaidDiagramInner = ({ code }) => {
         ]
       }
     ),
-    /* @__PURE__ */ jsx(
-      DiagramModal,
-      {
-        isOpen: isModalOpen,
-        onClose: () => setIsModalOpen(false),
-        children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: "flex justify-center items-center min-h-[50vh]",
-            dangerouslySetInnerHTML: { __html: svg }
-          }
-        )
-      }
-    )
+    /* @__PURE__ */ jsx(DiagramModal, { isOpen: isModalOpen, onClose: () => setIsModalOpen(false), children: /* @__PURE__ */ jsx(ZoomableSvg, { svg }) })
   ] });
 };
 var MermaidDiagram = memo(
   MermaidDiagramInner,
   (prevProps, nextProps) => prevProps.code === nextProps.code
 );
-var FileTextIcon = () => /* @__PURE__ */ jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "text-slate-400", children: [
-  /* @__PURE__ */ jsx("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
-  /* @__PURE__ */ jsx("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" }),
-  /* @__PURE__ */ jsx("path", { d: "M10 9H8" }),
-  /* @__PURE__ */ jsx("path", { d: "M16 13H8" }),
-  /* @__PURE__ */ jsx("path", { d: "M16 17H8" })
-] });
+
+// src/vantageFrontmatter.ts
+var DOC_STATUSES = [
+  "draft",
+  "in-review",
+  "accepted",
+  "deprecated"
+];
+var VANTAGE_FRONTMATTER_KEYS = ["status-chip"];
+var DOC_STATUS_TONES = {
+  draft: "muted",
+  "in-review": "warning",
+  accepted: "tip",
+  deprecated: "caution"
+};
+var STATUS_CHIP_VALUES = [
+  ...DOC_STATUSES,
+  "true",
+  "false"
+];
+function isDocStatus(value) {
+  return typeof value === "string" && DOC_STATUSES.includes(value);
+}
+function isTable(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value) && !(value instanceof Date);
+}
+function readVantageFrontmatter(frontmatter) {
+  const issues = [];
+  if (!Object.hasOwn(frontmatter, "vantage")) return { issues };
+  const value = frontmatter["vantage"];
+  if (!isTable(value)) {
+    issues.push({ kind: "not-a-table", value });
+    return { issues };
+  }
+  let statusChip;
+  for (const key of Object.keys(value)) {
+    if (!VANTAGE_FRONTMATTER_KEYS.includes(key)) {
+      issues.push({ kind: "unknown-key", key });
+      continue;
+    }
+    if (key === "status-chip") {
+      statusChip = readStatusChip(frontmatter, value[key], issues);
+    }
+  }
+  return { ...statusChip === void 0 ? {} : { statusChip }, issues };
+}
+function readStatusChip(frontmatter, raw, issues) {
+  const status = frontmatter["status"];
+  if (raw === false) return void 0;
+  if (raw === true) {
+    if (isDocStatus(status)) return status;
+    issues.push({ kind: "status-chip-orphan", status });
+    return void 0;
+  }
+  if (isDocStatus(raw)) {
+    if (isDocStatus(status) && status !== raw) {
+      issues.push({ kind: "status-chip-disagrees", chip: raw, status });
+    }
+    return raw;
+  }
+  issues.push({
+    kind: "bad-value",
+    key: "status-chip",
+    value: raw,
+    legal: STATUS_CHIP_VALUES
+  });
+  return void 0;
+}
+var DocumentStatusChipInner = ({
+  status
+}) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    className: `vantage-chip vantage-chip--${DOC_STATUS_TONES[status]}`,
+    "data-vantage-status": status,
+    title: `Document status: ${status}`,
+    children: status
+  }
+);
+var DocumentStatusChip = memo(DocumentStatusChipInner);
+var FileTextIcon = () => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "14",
+    height: "14",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "text-slate-400",
+    children: [
+      /* @__PURE__ */ jsx("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+      /* @__PURE__ */ jsx("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" }),
+      /* @__PURE__ */ jsx("path", { d: "M10 9H8" }),
+      /* @__PURE__ */ jsx("path", { d: "M16 13H8" }),
+      /* @__PURE__ */ jsx("path", { d: "M16 17H8" })
+    ]
+  }
+);
 function isStringArray(value) {
   return Array.isArray(value) && value.every((item) => typeof item === "string");
 }
@@ -416,6 +1362,7 @@ function ValueCell({ value }) {
 function flattenEntries(entries) {
   const result = [];
   for (const [key, value] of entries) {
+    if (key === "vantage") continue;
     if (key === "taxonomies" && isPlainObject(value)) {
       for (const [taxKey, taxVal] of Object.entries(value)) {
         result.push([taxKey, taxVal]);
@@ -433,31 +1380,33 @@ function flattenEntries(entries) {
 var FrontmatterDisplayInner = ({
   frontmatter
 }) => {
-  const raw = Object.entries(frontmatter);
-  if (raw.length === 0) return null;
-  const entries = flattenEntries(raw);
-  return /* @__PURE__ */ jsxs("div", { className: "mb-8 rounded-lg overflow-hidden bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-800 dark:to-slate-800/80 border border-slate-200 dark:border-slate-700 shadow-sm", children: [
-    /* @__PURE__ */ jsxs("div", { className: "px-4 py-2.5 bg-white/60 dark:bg-slate-900/40 border-b border-slate-200 dark:border-slate-700 flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx(FileTextIcon, {}),
-      /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-slate-500 dark:text-slate-400 uppercase tracking-wider", children: "Metadata" })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsx("table", { className: "w-full text-sm", children: /* @__PURE__ */ jsx("tbody", { children: entries.map(([key, value]) => /* @__PURE__ */ jsxs(
-      "tr",
-      {
-        className: "border-b border-slate-200/60 dark:border-slate-700/60 last:border-0",
-        children: [
-          /* @__PURE__ */ jsx("td", { className: "py-2 pr-4 font-medium text-slate-500 dark:text-slate-400 whitespace-nowrap align-top w-1/4 min-w-[100px]", children: key }),
-          /* @__PURE__ */ jsx("td", { className: "py-2 text-slate-800 dark:text-slate-200 align-top", children: /* @__PURE__ */ jsx(ValueCell, { value }) })
-        ]
-      },
-      key
-    )) }) }) })
+  const entries = flattenEntries(Object.entries(frontmatter));
+  const { statusChip } = readVantageFrontmatter(frontmatter);
+  if (entries.length === 0 && statusChip === void 0) return null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    statusChip !== void 0 && /* @__PURE__ */ jsx("div", { className: "vantage-chrome", children: /* @__PURE__ */ jsx(DocumentStatusChip, { status: statusChip }) }),
+    entries.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-8 rounded-lg overflow-hidden bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-800 dark:to-slate-800/80 border border-slate-200 dark:border-slate-700 shadow-sm", children: [
+      /* @__PURE__ */ jsxs("div", { className: "px-4 py-2.5 bg-white/60 dark:bg-slate-900/40 border-b border-slate-200 dark:border-slate-700 flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(FileTextIcon, {}),
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-slate-500 dark:text-slate-400 uppercase tracking-wider", children: "Metadata" })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsx("table", { className: "w-full text-sm", children: /* @__PURE__ */ jsx("tbody", { children: entries.map(([key, value]) => /* @__PURE__ */ jsxs(
+        "tr",
+        {
+          className: "border-b border-slate-200/60 dark:border-slate-700/60 last:border-0",
+          children: [
+            /* @__PURE__ */ jsx("td", { className: "py-2 pr-4 font-medium text-slate-500 dark:text-slate-400 whitespace-nowrap align-top w-1/4 min-w-[100px]", children: key }),
+            /* @__PURE__ */ jsx("td", { className: "py-2 text-slate-800 dark:text-slate-200 align-top", children: /* @__PURE__ */ jsx(ValueCell, { value }) })
+          ]
+        },
+        key
+      )) }) }) })
+    ] })
   ] });
 };
 var FrontmatterDisplay = memo(FrontmatterDisplayInner);
 
-// src/scrollToLineAnchor.ts
-var HIGHLIGHT_CLASS = "line-anchor-highlight";
+// src/lineAnchor.ts
 function parseLineAnchor(hash) {
   if (!hash) return null;
   const frag = hash.startsWith("#") ? hash.slice(1) : hash;
@@ -467,6 +1416,9 @@ function parseLineAnchor(hash) {
   const end = match[2] ? parseInt(match[2], 10) : start;
   return { start: Math.min(start, end), end: Math.max(start, end) };
 }
+
+// src/scrollToLineAnchor.ts
+var HIGHLIGHT_CLASS = "line-anchor-highlight";
 function clearLineAnchorHighlights(container) {
   container.querySelectorAll(`.${HIGHLIGHT_CLASS}`).forEach((node) => {
     node.classList.remove(HIGHLIGHT_CLASS);
@@ -479,10 +1431,7 @@ function scrollToLineAnchor(container, hash) {
   const blocks = container.querySelectorAll("[data-source-line]");
   let firstMatch = null;
   for (const block of blocks) {
-    const line = parseInt(
-      block.dataset.sourceLine || "0",
-      10
-    );
+    const line = parseInt(block.dataset.sourceLine || "0", 10);
     if (line >= range.start && line <= range.end) {
       block.classList.add(HIGHLIGHT_CLASS);
       if (!firstMatch) firstMatch = block;
@@ -629,9 +1578,13 @@ var MarkdownViewerInner = ({
 }) => {
   const containerRef = useRef(null);
   useLineAnchor(containerRef, hash);
-  const { frontmatter, body } = useMemo(() => {
+  const { frontmatter, body, bodyLineOffset } = useMemo(() => {
     return parseFrontmatter(content);
   }, [content]);
+  const { remarkPlugins, rehypePlugins } = useMemo(
+    () => buildPipeline({ bodyLineOffset }),
+    [bodyLineOffset]
+  );
   const handleLinkClick = useCallback(
     (e, href) => {
       if (href.startsWith("#")) {
@@ -754,18 +1707,8 @@ var MarkdownViewerInner = ({
         /* @__PURE__ */ jsx(
           ReactMarkdown,
           {
-            remarkPlugins: [
-              [remarkGfm, { singleTilde: false }],
-              [remarkMath, { singleDollarTextMath: false }]
-            ],
-            rehypePlugins: [
-              rehypeRaw,
-              rehypeSourceLines_default,
-              [rehypeSanitize, sanitizeSchema],
-              rehypeSlug,
-              rehypeHighlight,
-              rehypeKatex
-            ],
+            remarkPlugins,
+            rehypePlugins,
             urlTransform: transformImageUri,
             components: markdownComponents,
             children: body
@@ -792,27 +1735,22 @@ async function renderMarkdown(content, options = {}) {
   if (parseFm) {
     parsed = parseFrontmatter(content);
   } else {
-    parsed = { frontmatter: {}, body: content, format: "none" };
-  }
-  const remarkPlugins = [];
-  const rehypePlugins = [];
-  if (gfm) remarkPlugins.push([remarkGfm, { singleTilde: false }]);
-  if (math) remarkPlugins.push([remarkMath, { singleDollarTextMath: false }]);
-  rehypePlugins.push([rehypeRaw]);
-  if (sourceLines) rehypePlugins.push([rehypeSourceLines_default]);
-  if (sanitize) rehypePlugins.push([rehypeSanitize, sanitizeSchema]);
-  rehypePlugins.push([rehypeSlug]);
-  if (highlight) rehypePlugins.push([rehypeHighlight]);
-  if (math) rehypePlugins.push([rehypeKatex]);
-  let processor = unified().use(remarkParse);
-  for (const [plugin, ...args] of remarkPlugins) {
-    processor = processor.use(plugin, ...args);
-  }
-  processor = processor.use(remarkRehype, { allowDangerousHtml: true });
-  for (const [plugin, ...args] of rehypePlugins) {
-    processor = processor.use(plugin, ...args);
-  }
-  processor = processor.use(rehypeStringify);
+    parsed = {
+      frontmatter: {},
+      body: content,
+      format: "none",
+      bodyLineOffset: 0
+    };
+  }
+  const { remarkPlugins, rehypePlugins } = buildPipeline({
+    gfm,
+    math,
+    highlight,
+    sourceLines,
+    sanitize,
+    bodyLineOffset: parsed.bodyLineOffset
+  });
+  const processor = unified().use(remarkParse).use(remarkPlugins).use(remarkRehype, { allowDangerousHtml: true }).use(rehypePlugins).use(rehypeStringify);
   const result = await processor.process(parsed.body);
   return {
     html: String(result),
@@ -893,6 +1831,6 @@ function resolveLinks(html, options = {}) {
   );
 }
 
-export { FrontmatterDisplay, MarkdownViewer, MermaidDiagram, clearLineAnchorHighlights, parseFrontmatter, parseLineAnchor, rehypeSourceLines_default as rehypeSourceLines, renderMarkdown, renderMermaidBlocks, resolveLinks, sanitizeSchema, scrollToLineAnchor, useLineAnchor };
+export { DOC_STATUSES, DOC_STATUS_TONES, DocumentStatusChip, FrontmatterDisplay, MarkdownViewer, MermaidDiagram, VANTAGE_FRONTMATTER_KEYS, buildPipeline, buildRemarkPlugins, clearLineAnchorHighlights, isDocStatus, parseFrontmatter, parseLineAnchor, readVantageFrontmatter, rehypeSourceLines_default as rehypeSourceLines, renderMarkdown, renderMermaidBlocks, resolveLinks, sanitizeSchema, scrollToLineAnchor, useLineAnchor };
 //# sourceMappingURL=react.js.map
 //# sourceMappingURL=react.js.map