fix: properly handle multiple transclusions

quartz/components/renderPage.tsx

@@ -9,7 +9,6 @@ import {
 } from "../util/resources"
 import { FullSlug, RelativeURL, joinSegments, normalizeHastElement } from "../util/path"
 import { clone } from "../util/clone"
-import { visit } from "unist-util-visit"
 import { Root, Element, ElementContent } from "hast"
 import { GlobalConfiguration } from "../cfg"
 import { i18n } from "../i18n"
@@ -110,19 +109,37 @@ export function pageResources(
   return resources
 }
 
-function renderTranscludes(
+/** @internal Exported for testing only. */
+export function renderTranscludes(
   root: Root,
   cfg: GlobalConfiguration,
   slug: FullSlug,
   componentData: QuartzComponentProps,
   visited: Set<FullSlug>,
 ) {
-  // process transcludes in componentData
+  // Walk the tree manually instead of using visit() so we can track the
-  visit(root, "element", (node, _index, _parent) => {
+  // ancestor chain for cycle detection. visit() runs the callback before
-    if (node.tagName === "blockquote") {
+  // descending into replaced children, so a Set-based guard there falsely
-      const classNames = (node.properties?.className ?? []) as string[]
+  // rejects sibling transclusions of the same target.
-      if (classNames.includes("transclude")) {
+  function walk(node: Element | Root) {
-        const inner = node.children[0] as Element
+    const children = (node as Root).children ?? []
+    for (let i = 0; i < children.length; i++) {
+      const child = children[i]
+      if (child?.type !== "element") continue
+      const el = child as Element
+
+      if (el.tagName !== "blockquote") {
+        walk(el)
+        continue
+      }
+
+      const classNames = (el.properties?.className ?? []) as string[]
+      if (!classNames.includes("transclude")) {
+        walk(el)
+        continue
+      }
+
+      const inner = el.children[0] as Element
       const transcludeTarget = (inner.properties["data-slug"] ?? slug) as FullSlug
       if (visited.has(transcludeTarget)) {
         console.warn(
@@ -131,7 +148,7 @@ function renderTranscludes(
             `Warning: Skipping circular transclusion: ${slug} -> ${transcludeTarget}`,
           ),
         )
-          node.children = [
+        el.children = [
           {
             type: "element",
             tagName: "p",
@@ -144,16 +161,13 @@ function renderTranscludes(
             ],
           },
         ]
-          return
+        continue
       }
+
       visited.add(transcludeTarget)
 
       let page = componentData.allFiles.find((f) => f.slug === transcludeTarget)
       if (!page) {
-          // Virtual pages from PageType plugins have slugs without extensions
-          // (e.g. "plugins/CanvasPage") but CrawlLinks resolves wikilinks like
-          // ![[CanvasPage.canvas]] to "plugins/CanvasPage.canvas". Fall back to
-          // stripping the extension from the transclude target.
         const dotIdx = transcludeTarget.lastIndexOf(".")
         const slashIdx = transcludeTarget.lastIndexOf("/")
         if (dotIdx > slashIdx + 1) {
@@ -162,10 +176,11 @@ function renderTranscludes(
         }
       }
       if (!page) {
-          return
+        visited.delete(transcludeTarget)
+        continue
       }
 
-        let blockRef = node.properties.dataBlock as string | undefined
+      let blockRef = el.properties.dataBlock as string | undefined
       if (blockRef?.startsWith("#^")) {
         // block transclude
         blockRef = blockRef.slice("#^".length)
@@ -180,7 +195,7 @@ function renderTranscludes(
             }
           }
 
-            node.children = [
+          el.children = [
             normalizeHastElement(blockNode, slug, transcludeTarget),
             {
               type: "element",
@@ -201,32 +216,29 @@ function renderTranscludes(
         let startIdx = undefined
         let startDepth = undefined
         let endIdx = undefined
-          for (const [i, el] of page.htmlAst.children.entries()) {
+        for (const [i, htmlEl] of page.htmlAst.children.entries()) {
-            // skip non-headers
+          if (!(htmlEl.type === "element" && htmlEl.tagName.match(headerRegex))) continue
-            if (!(el.type === "element" && el.tagName.match(headerRegex))) continue
+          const depth = Number(htmlEl.tagName.substring(1))
-            const depth = Number(el.tagName.substring(1))
 
-            // lookin for our blockref
           if (startIdx === undefined || startDepth === undefined) {
-              // skip until we find the blockref that matches
+            if (htmlEl.properties?.id === blockRef) {
-              if (el.properties?.id === blockRef) {
               startIdx = i
               startDepth = depth
             }
           } else if (depth <= startDepth) {
-              // looking for new header that is same level or higher
             endIdx = i
             break
           }
         }
 
         if (startIdx === undefined) {
-            return
+          visited.delete(transcludeTarget)
+          continue
         }
 
-          node.children = [
+        el.children = [
-            ...(page.htmlAst.children.slice(startIdx, endIdx) as ElementContent[]).map((child) =>
+          ...(page.htmlAst.children.slice(startIdx, endIdx) as ElementContent[]).map((c) =>
-              normalizeHastElement(child as Element, slug, transcludeTarget),
+            normalizeHastElement(c as Element, slug, transcludeTarget),
           ),
           {
             type: "element",
@@ -242,7 +254,7 @@ function renderTranscludes(
         ]
       } else if (page.htmlAst) {
         // page transclude
-          node.children = [
+        el.children = [
           {
             type: "element",
             tagName: "h1",
@@ -258,8 +270,8 @@ function renderTranscludes(
               },
             ],
           },
-            ...(page.htmlAst.children as ElementContent[]).map((child) =>
+          ...(page.htmlAst.children as ElementContent[]).map((c) =>
-              normalizeHastElement(child as Element, slug, transcludeTarget),
+            normalizeHastElement(c as Element, slug, transcludeTarget),
           ),
           {
             type: "element",
@@ -274,9 +286,15 @@ function renderTranscludes(
           },
         ]
       }
+
+      // Recurse into the replaced children to resolve nested transclusions,
+      // then remove from visited so sibling embeds of the same target work.
+      walk(el)
+      visited.delete(transcludeTarget)
     }
   }
-  })
+
+  walk(root)
 }
 
 export function renderPage(