50e6f491ad
* Use npm package names to load internal deps This is necessary so that published Astro components work. These components will be built by esinstall and therefore they cannot rely on `_astro_internal`. The fix is to use npm specifiers everywhere. * Move most of frontend to internal * Mark astro/internal/markdown.js as external * Move markdown stuff to its own package This moves the markdown stuff to its own package so that we can externalize it in the markdown component. * Add the changeset
43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
import { visit } from 'unist-util-visit';
|
|
|
|
/** */
|
|
export function remarkCodeBlock() {
|
|
const visitor = (node: any) => {
|
|
const { data, meta } = node;
|
|
let lang = node.lang || 'html'; // default to html matches GFM behavior.
|
|
|
|
let currentClassName = data?.hProperties?.class ?? '';
|
|
node.data = node.data || {};
|
|
node.data.hProperties = node.data.hProperties || {};
|
|
node.data.hProperties = { ...node.data.hProperties, class: `language-${lang} ${currentClassName}`.trim(), lang, meta };
|
|
|
|
return node;
|
|
};
|
|
return () => (tree: any) => visit(tree, 'code', visitor);
|
|
}
|
|
|
|
/** */
|
|
export function rehypeCodeBlock() {
|
|
const escapeCode = (code: any) => {
|
|
code.children = code.children.map((child: any) => {
|
|
if (child.type === 'text') {
|
|
return { ...child, value: child.value.replace(/\{/g, '{') };
|
|
}
|
|
return child;
|
|
});
|
|
};
|
|
const visitor = (node: any) => {
|
|
if (node.tagName === 'code') {
|
|
escapeCode(node);
|
|
return;
|
|
}
|
|
|
|
if (node.tagName !== 'pre') return;
|
|
const code = node.children[0];
|
|
if (code.tagName !== 'code') return;
|
|
node.properties = { ...code.properties };
|
|
|
|
return node;
|
|
};
|
|
return () => (tree: any) => visit(tree, 'element', visitor);
|
|
}
|