From 1efaef6be0265c68eac706623778e8ad23b33247 Mon Sep 17 00:00:00 2001
From: Ben Holmes <hey@bholmes.dev>
Date: Wed, 24 May 2023 16:52:22 -0400
Subject: Markdoc - Shiki (#7187)

* chore: remove unused util

* chore: changeset

* deps: shiki

* wip: first stab at shiki markdoc config

* feat: get shiki working!

* refactor: return HTML string directly from transform

* chore: move shiki to markdoc dev dep

* refactor: use async cache with clear docs on why

* test: transform units with Shiki config options

* refactor: switch to `extends` model

* refactor: nodes/ -> extensions/

* feat: raise friendly error for Promise extensions

* docs: README

* chore: lint

* chore: dead file

* chore: lowercase for fuzzy find please

* fix: bad ctx spread

* chore: clean up cache, add shiki imp error

* chore: add shiki to optional peer deps

* chore: hoist those consts

* docs: more explicit "install shiki now please"

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>

* oops bad find and replace

* chore: update changeset

* nit: period haunts me

---------

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
---
 packages/integrations/markdoc/components/TreeNode.ts | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

(limited to 'packages/integrations/markdoc/components/TreeNode.ts')

diff --git a/packages/integrations/markdoc/components/TreeNode.ts b/packages/integrations/markdoc/components/TreeNode.ts
index a60597a0d..d12180a18 100644
--- a/packages/integrations/markdoc/components/TreeNode.ts
+++ b/packages/integrations/markdoc/components/TreeNode.ts
@@ -2,12 +2,18 @@ import type { AstroInstance } from 'astro';
 import { Fragment } from 'astro/jsx-runtime';
 import type { RenderableTreeNode } from '@markdoc/markdoc';
 import Markdoc from '@markdoc/markdoc';
-import { createComponent, renderComponent, render } from 'astro/runtime/server/index.js';
+import {
+	createComponent,
+	renderComponent,
+	render,
+	HTMLString,
+	isHTMLString,
+} from 'astro/runtime/server/index.js';
 
 export type TreeNode =
 	| {
 			type: 'text';
-			content: string;
+			content: string | HTMLString;
 	  }
 	| {
 			type: 'component';
@@ -25,6 +31,7 @@ export type TreeNode =
 export const ComponentNode = createComponent({
 	factory(result: any, { treeNode }: { treeNode: TreeNode }) {
 		if (treeNode.type === 'text') return render`${treeNode.content}`;
+
 		const slots = {
 			default: () =>
 				render`${treeNode.children.map((child) =>
@@ -46,7 +53,9 @@ export const ComponentNode = createComponent({
 });
 
 export function createTreeNode(node: RenderableTreeNode | RenderableTreeNode[]): TreeNode {
-	if (typeof node === 'string' || typeof node === 'number') {
+	if (isHTMLString(node)) {
+		return { type: 'text', content: node as HTMLString };
+	} else if (typeof node === 'string' || typeof node === 'number') {
 		return { type: 'text', content: String(node) };
 	} else if (Array.isArray(node)) {
 		return {
-- 
cgit v1.2.3