Feat: change to shiki default md renderer (#2824)

* feat: change Shiki to default

* refactor: update blog styles for shiki

* feat: update examples/docs styles for Shiki

* refactor: remove Prism-ish examples/docs styles

* refactor: simplify rules with `all: unset`

* refactor: remove Prism styles

* refactor: examples/with-md remove Prism-specific line-highlight

* chore: add changeset

* chore: update changeset versions

* refactor: update syntax highlight test for scoped styles

* fix: apply scoped style class to pre and span lines

* feat: test that scoped styles cascade to shiki code

* refactor: pass scopedClassName explicitly

1 files changed, 4 insertions, 4 deletions

diff --git a/packages/markdown/remark/src/index.ts b/packages/markdown/remark/src/index.ts
index e8a315ef1..3ea436795 100644
--- a/packages/markdown/remark/src/index.ts
+++ b/packages/markdown/remark/src/index.ts
@@ -38,7 +38,7 @@ export async function renderMarkdown(content: string, opts?: MarkdownRenderingOp
 	let { remarkPlugins = [], rehypePlugins = [] } = opts ?? {};
 	const scopedClassName = opts?.$?.scopedClassName;
 	const mode = opts?.mode ?? 'mdx';
-	const syntaxHighlight = opts?.syntaxHighlight ?? 'prism';
+	const syntaxHighlight = opts?.syntaxHighlight ?? 'shiki';
 	const shikiConfig = opts?.shikiConfig ?? {};
 	const isMDX = mode === 'mdx';
 	const { headers, rehypeCollectHeaders } = createCollectHeaders();
@@ -67,10 +67,10 @@ export async function renderMarkdown(content: string, opts?: MarkdownRenderingOp
 		parser.use([scopedStyles(scopedClassName)]);
 	}
 
-	if (syntaxHighlight === 'prism') {
+	if (syntaxHighlight === 'shiki') {
+		parser.use([await remarkShiki(shikiConfig, scopedClassName)]);
+	} else if (syntaxHighlight === 'prism') {
 		parser.use([remarkPrism(scopedClassName)]);
-	} else if (syntaxHighlight === 'shiki') {
-		parser.use([await remarkShiki(shikiConfig)]);
 	}
 
 	parser.use([[markdownToHtml as any, { allowDangerousHtml: true, passThrough: ['raw', 'mdxTextExpression', 'mdxJsxTextElement', 'mdxJsxFlowElement'] }]]);