Fix markdoc render code block in if tag (#12930)

1 files changed, 8 insertions, 9 deletions

diff --git a/packages/integrations/markdoc/components/Renderer.astro b/packages/integrations/markdoc/components/Renderer.astro
index c26d92ad7..270604091 100644
--- a/packages/integrations/markdoc/components/Renderer.astro
+++ b/packages/integrations/markdoc/components/Renderer.astro
@@ -1,6 +1,6 @@
 ---
 //! astro-head-inject
-import type { Config } from '@markdoc/markdoc';
+import type { Config, RenderableTreeNodes } from '@markdoc/markdoc';
 import Markdoc from '@markdoc/markdoc';
 import { ComponentNode, createTreeNode } from './TreeNode.js';
 
@@ -12,13 +12,12 @@ type Props = {
 const { stringifiedAst, config } = Astro.props as Props;
 
 const ast = Markdoc.Ast.fromJSON(stringifiedAst);
-const content = await Markdoc.transform(ast, config);
+// The AST may be an array, and `transform` has overloads for arrays and non-array cases,
+// However TypeScript seems to struggle to combine both overloads into a single signature.
+// Also, `transform` returns a promise here but the types don't reflect that.
+// @ts-expect-error
+const content = (await Markdoc.transform(ast, config)) as RenderableTreeNodes;
+const treeNode = await createTreeNode(content);
 ---
 
-{
-	Array.isArray(content) ? (
-		content.map(async (c) => <ComponentNode treeNode={await createTreeNode(c)} />)
-	) : (
-		<ComponentNode treeNode={await createTreeNode(content)} />
-	)
-}
+<ComponentNode treeNode={treeNode} />