@astrojs/markdown-remark 2.2.0 → 2.2.1

package/src/frontmatter-injection.ts

@@ -1,41 +0,0 @@
-import type { VFile, VFileData as Data } from 'vfile';
-import type { MarkdownAstroData } from './types.js';
-
-function isValidAstroData(obj: unknown): obj is MarkdownAstroData {
-	if (typeof obj === 'object' && obj !== null && obj.hasOwnProperty('frontmatter')) {
-		const { frontmatter } = obj as any;
-		try {
-			// ensure frontmatter is JSON-serializable
-			JSON.stringify(frontmatter);
-		} catch {
-			return false;
-		}
-		return typeof frontmatter === 'object' && frontmatter !== null;
-	}
-	return false;
-}
-
-export class InvalidAstroDataError extends TypeError {}
-
-export function safelyGetAstroData(vfileData: Data): MarkdownAstroData | InvalidAstroDataError {
-	const { astro } = vfileData;
-
-	if (!astro || !isValidAstroData(astro)) {
-		return new InvalidAstroDataError();
-	}
-
-	return astro;
-}
-
-export function toRemarkInitializeAstroData({
-	userFrontmatter,
-}: {
-	userFrontmatter: Record<string, any>;
-}) {
-	return () =>
-		function (tree: any, vfile: VFile) {
-			if (!vfile.data.astro) {
-				vfile.data.astro = { frontmatter: userFrontmatter };
-			}
-		};
-}

package/src/index.ts

@@ -1,170 +0,0 @@
-import type {
-	AstroMarkdownOptions,
-	MarkdownRenderingOptions,
-	MarkdownRenderingResult,
-	MarkdownVFile,
-} from './types';
-
-import { toRemarkInitializeAstroData } from './frontmatter-injection.js';
-import { loadPlugins } from './load-plugins.js';
-import { rehypeHeadingIds } from './rehype-collect-headings.js';
-import { remarkCollectImages } from './remark-collect-images.js';
-import remarkPrism from './remark-prism.js';
-import scopedStyles from './remark-scoped-styles.js';
-import remarkShiki from './remark-shiki.js';
-
-import rehypeRaw from 'rehype-raw';
-import rehypeStringify from 'rehype-stringify';
-import remarkGfm from 'remark-gfm';
-import markdown from 'remark-parse';
-import markdownToHtml from 'remark-rehype';
-import remarkSmartypants from 'remark-smartypants';
-import { unified } from 'unified';
-import { VFile } from 'vfile';
-import { rehypeImages } from './rehype-images.js';
-
-export { rehypeHeadingIds } from './rehype-collect-headings.js';
-export { remarkCollectImages } from './remark-collect-images.js';
-export * from './types.js';
-
-export const markdownConfigDefaults: Omit<Required<AstroMarkdownOptions>, 'drafts'> = {
-	syntaxHighlight: 'shiki',
-	shikiConfig: {
-		langs: [],
-		theme: 'github-dark',
-		wrap: false,
-	},
-	remarkPlugins: [],
-	rehypePlugins: [],
-	remarkRehype: {},
-	gfm: true,
-	smartypants: true,
-};
-
-// Skip nonessential plugins during performance benchmark runs
-const isPerformanceBenchmark = Boolean(process.env.ASTRO_PERFORMANCE_BENCHMARK);
-
-/** Shared utility for rendering markdown */
-export async function renderMarkdown(
-	content: string,
-	opts: MarkdownRenderingOptions
-): Promise<MarkdownRenderingResult> {
-	let {
-		fileURL,
-		syntaxHighlight = markdownConfigDefaults.syntaxHighlight,
-		shikiConfig = markdownConfigDefaults.shikiConfig,
-		remarkPlugins = markdownConfigDefaults.remarkPlugins,
-		rehypePlugins = markdownConfigDefaults.rehypePlugins,
-		remarkRehype = markdownConfigDefaults.remarkRehype,
-		gfm = markdownConfigDefaults.gfm,
-		smartypants = markdownConfigDefaults.smartypants,
-		frontmatter: userFrontmatter = {},
-	} = opts;
-	const input = new VFile({ value: content, path: fileURL });
-	const scopedClassName = opts.$?.scopedClassName;
-
-	let parser = unified()
-		.use(markdown)
-		.use(toRemarkInitializeAstroData({ userFrontmatter }))
-		.use([]);
-
-	if (!isPerformanceBenchmark && gfm) {
-		if (gfm) {
-			parser.use(remarkGfm);
-		}
-		if (smartypants) {
-			parser.use(remarkSmartypants);
-		}
-	}
-
-	const loadedRemarkPlugins = await Promise.all(loadPlugins(remarkPlugins));
-	const loadedRehypePlugins = await Promise.all(loadPlugins(rehypePlugins));
-
-	loadedRemarkPlugins.forEach(([plugin, pluginOpts]) => {
-		parser.use([[plugin, pluginOpts]]);
-	});
-
-	if (!isPerformanceBenchmark) {
-		if (scopedClassName) {
-			parser.use([scopedStyles(scopedClassName)]);
-		}
-
-		if (syntaxHighlight === 'shiki') {
-			parser.use([await remarkShiki(shikiConfig, scopedClassName)]);
-		} else if (syntaxHighlight === 'prism') {
-			parser.use([remarkPrism(scopedClassName)]);
-		}
-
-		if (opts.experimentalAssets) {
-			// Apply later in case user plugins resolve relative image paths
-			parser.use([remarkCollectImages]);
-		}
-	}
-
-	parser.use([
-		[
-			markdownToHtml as any,
-			{
-				allowDangerousHtml: true,
-				passThrough: [],
-				...remarkRehype,
-			},
-		],
-	]);
-
-	loadedRehypePlugins.forEach(([plugin, pluginOpts]) => {
-		parser.use([[plugin, pluginOpts]]);
-	});
-
-	if (opts.experimentalAssets) {
-		parser.use(rehypeImages());
-	}
-	if (!isPerformanceBenchmark) {
-		parser.use([rehypeHeadingIds]);
-	}
-
-	parser.use([rehypeRaw]).use(rehypeStringify, { allowDangerousHtml: true });
-
-	let vfile: MarkdownVFile;
-	try {
-		vfile = await parser.process(input);
-	} catch (err) {
-		// Ensure that the error message contains the input filename
-		// to make it easier for the user to fix the issue
-		err = prefixError(err, `Failed to parse Markdown file "${input.path}"`);
-		// eslint-disable-next-line no-console
-		console.error(err);
-		throw err;
-	}
-
-	const headings = vfile?.data.__astroHeadings || [];
-	return {
-		metadata: { headings, source: content, html: String(vfile.value) },
-		code: String(vfile.value),
-		vfile,
-	};
-}
-
-function prefixError(err: any, prefix: string) {
-	// If the error is an object with a `message` property, attempt to prefix the message
-	if (err && err.message) {
-		try {
-			err.message = `${prefix}:\n${err.message}`;
-			return err;
-		} catch (error) {
-			// Any errors here are ok, there's fallback code below
-		}
-	}
-
-	// If that failed, create a new error with the desired message and attempt to keep the stack
-	const wrappedError = new Error(`${prefix}${err ? `: ${err}` : ''}`);
-	try {
-		wrappedError.stack = err.stack;
-		// @ts-expect-error
-		wrappedError.cause = err;
-	} catch (error) {
-		// It's ok if we could not set the stack or cause - the message is the most important part
-	}
-
-	return wrappedError;
-}

package/src/internal.ts

@@ -1,5 +0,0 @@
-export {
-	InvalidAstroDataError,
-	safelyGetAstroData,
-	toRemarkInitializeAstroData,
-} from './frontmatter-injection.js';

package/src/load-plugins.ts

@@ -1,42 +0,0 @@
-import { resolve as importMetaResolve } from 'import-meta-resolve';
-import path from 'path';
-import type * as unified from 'unified';
-import { pathToFileURL } from 'url';
-
-const cwdUrlStr = pathToFileURL(path.join(process.cwd(), 'package.json')).toString();
-
-async function importPlugin(p: string | unified.Plugin): Promise<unified.Plugin> {
-	if (typeof p === 'string') {
-		// Try import from this package first
-		try {
-			const importResult = await import(p);
-			return importResult.default;
-		} catch {}
-
-		// Try import from user project
-		const resolved = await importMetaResolve(p, cwdUrlStr);
-		const importResult = await import(resolved);
-		return importResult.default;
-	}
-
-	return p;
-}
-
-export function loadPlugins(
-	items: (string | [string, any] | unified.Plugin<any[], any> | [unified.Plugin<any[], any>, any])[]
-): Promise<[unified.Plugin, any?]>[] {
-	return items.map((p) => {
-		return new Promise((resolve, reject) => {
-			if (Array.isArray(p)) {
-				const [plugin, opts] = p;
-				return importPlugin(plugin)
-					.then((m) => resolve([m, opts]))
-					.catch((e) => reject(e));
-			}
-
-			return importPlugin(p)
-				.then((m) => resolve([m]))
-				.catch((e) => reject(e));
-		});
-	});
-}

package/src/rehype-collect-headings.ts

@@ -1,129 +0,0 @@
-import type { Expression, Super } from 'estree';
-import Slugger from 'github-slugger';
-import type { MdxTextExpression } from 'mdast-util-mdx-expression';
-import type { Node } from 'unist';
-import { visit } from 'unist-util-visit';
-
-import { InvalidAstroDataError, safelyGetAstroData } from './frontmatter-injection.js';
-import type { MarkdownAstroData, MarkdownHeading, MarkdownVFile, RehypePlugin } from './types.js';
-
-const rawNodeTypes = new Set(['text', 'raw', 'mdxTextExpression']);
-const codeTagNames = new Set(['code', 'pre']);
-
-export function rehypeHeadingIds(): ReturnType<RehypePlugin> {
-	return function (tree, file: MarkdownVFile) {
-		const headings: MarkdownHeading[] = [];
-		const slugger = new Slugger();
-		const isMDX = isMDXFile(file);
-		const astroData = safelyGetAstroData(file.data);
-		visit(tree, (node) => {
-			if (node.type !== 'element') return;
-			const { tagName } = node;
-			if (tagName[0] !== 'h') return;
-			const [_, level] = tagName.match(/h([0-6])/) ?? [];
-			if (!level) return;
-			const depth = Number.parseInt(level);
-
-			let text = '';
-			visit(node, (child, __, parent) => {
-				if (child.type === 'element' || parent == null) {
-					return;
-				}
-				if (child.type === 'raw') {
-					if (child.value.match(/^\n?<.*>\n?$/)) {
-						return;
-					}
-				}
-				if (rawNodeTypes.has(child.type)) {
-					if (isMDX || codeTagNames.has(parent.tagName)) {
-						let value = child.value;
-						if (isMdxTextExpression(child) && !(astroData instanceof InvalidAstroDataError)) {
-							const frontmatterPath = getMdxFrontmatterVariablePath(child);
-							if (Array.isArray(frontmatterPath) && frontmatterPath.length > 0) {
-								const frontmatterValue = getMdxFrontmatterVariableValue(astroData, frontmatterPath);
-								if (typeof frontmatterValue === 'string') {
-									value = frontmatterValue;
-								}
-							}
-						}
-						text += value;
-					} else {
-						text += child.value.replace(/\{/g, '${');
-					}
-				}
-			});
-
-			node.properties = node.properties || {};
-			if (typeof node.properties.id !== 'string') {
-				let slug = slugger.slug(text);
-
-				if (slug.endsWith('-')) slug = slug.slice(0, -1);
-
-				node.properties.id = slug;
-			}
-
-			headings.push({ depth, slug: node.properties.id, text });
-		});
-
-		file.data.__astroHeadings = headings;
-	};
-}
-
-function isMDXFile(file: MarkdownVFile) {
-	return Boolean(file.history[0]?.endsWith('.mdx'));
-}
-
-/**
- * Check if an ESTree entry is `frontmatter.*.VARIABLE`.
- * If it is, return the variable path (i.e. `["*", ..., "VARIABLE"]`) minus the `frontmatter` prefix.
- */
-function getMdxFrontmatterVariablePath(node: MdxTextExpression): string[] | Error {
-	if (!node.data?.estree || node.data.estree.body.length !== 1) return new Error();
-
-	const statement = node.data.estree.body[0];
-
-	// Check for "[ANYTHING].[ANYTHING]".
-	if (statement?.type !== 'ExpressionStatement' || statement.expression.type !== 'MemberExpression')
-		return new Error();
-
-	let expression: Expression | Super = statement.expression;
-	const expressionPath: string[] = [];
-
-	// Traverse the expression, collecting the variable path.
-	while (
-		expression.type === 'MemberExpression' &&
-		expression.property.type === (expression.computed ? 'Literal' : 'Identifier')
-	) {
-		expressionPath.push(
-			expression.property.type === 'Literal'
-				? String(expression.property.value)
-				: expression.property.name
-		);
-
-		expression = expression.object;
-	}
-
-	// Check for "frontmatter.[ANYTHING]".
-	if (expression.type !== 'Identifier' || expression.name !== 'frontmatter') return new Error();
-
-	return expressionPath.reverse();
-}
-
-function getMdxFrontmatterVariableValue(astroData: MarkdownAstroData, path: string[]) {
-	let value: MdxFrontmatterVariableValue = astroData.frontmatter;
-
-	for (const key of path) {
-		if (!value[key]) return undefined;
-
-		value = value[key];
-	}
-
-	return value;
-}
-
-function isMdxTextExpression(node: Node): node is MdxTextExpression {
-	return node.type === 'mdxTextExpression';
-}
-
-type MdxFrontmatterVariableValue =
-	MarkdownAstroData['frontmatter'][keyof MarkdownAstroData['frontmatter']];

package/src/rehype-images.ts

@@ -1,19 +0,0 @@
-import { visit } from 'unist-util-visit';
-import type { MarkdownVFile } from './types.js';
-
-export function rehypeImages() {
-	return () =>
-		function (tree: any, file: MarkdownVFile) {
-			visit(tree, (node) => {
-				if (node.type !== 'element') return;
-				if (node.tagName !== 'img') return;
-
-				if (node.properties?.src) {
-					if (file.data.imagePaths?.has(node.properties.src)) {
-						node.properties['__ASTRO_IMAGE_'] = node.properties.src;
-						delete node.properties.src;
-					}
-				}
-			});
-		};
-}

package/src/remark-collect-images.ts

@@ -1,30 +0,0 @@
-import type { Image } from 'mdast';
-import { visit } from 'unist-util-visit';
-import type { MarkdownVFile } from './types';
-
-export function remarkCollectImages() {
-	return function (tree: any, vfile: MarkdownVFile) {
-		if (typeof vfile?.path !== 'string') return;
-
-		const imagePaths = new Set<string>();
-		visit(tree, 'image', (node: Image) => {
-			if (shouldOptimizeImage(node.url)) imagePaths.add(node.url);
-		});
-
-		vfile.data.imagePaths = imagePaths;
-	};
-}
-
-function shouldOptimizeImage(src: string) {
-	// Optimize anything that is NOT external or an absolute path to `public/`
-	return !isValidUrl(src) && !src.startsWith('/');
-}
-
-function isValidUrl(str: string): boolean {
-	try {
-		new URL(str);
-		return true;
-	} catch {
-		return false;
-	}
-}

package/src/remark-prism.ts

@@ -1,32 +0,0 @@
-import { runHighlighterWithAstro } from '@astrojs/prism/dist/highlighter';
-import { visit } from 'unist-util-visit';
-const noVisit = new Set(['root', 'html', 'text']);
-
-type MaybeString = string | null | undefined;
-
-/**  */
-function transformer(className: MaybeString) {
-	return function (tree: any) {
-		const visitor = (node: any) => {
-			let { lang, value } = node;
-			node.type = 'html';
-
-			let { html, classLanguage } = runHighlighterWithAstro(lang, value);
-			let classes = [classLanguage];
-			if (className) {
-				classes.push(className);
-			}
-			node.value = `<pre class="${classes.join(
-				' '
-			)}"><code is:raw class="${classLanguage}">${html}</code></pre>`;
-			return node;
-		};
-		return visit(tree, 'code', visitor);
-	};
-}
-
-function plugin(className: MaybeString) {
-	return transformer.bind(null, className);
-}
-
-export default plugin;

package/src/remark-scoped-styles.ts

@@ -1,18 +0,0 @@
-import { visit } from 'unist-util-visit';
-const noVisit = new Set(['root', 'html', 'text']);
-
-/**  */
-export default function scopedStyles(className: string) {
-	const visitor = (node: any) => {
-		if (noVisit.has(node.type)) return;
-
-		const { data } = node;
-		let currentClassName = data?.hProperties?.class ?? '';
-		node.data = node.data || {};
-		node.data.hProperties = node.data.hProperties || {};
-		node.data.hProperties.class = `${className} ${currentClassName}`.trim();
-
-		return node;
-	};
-	return () => (tree: any) => visit(tree, visitor);
-}

package/src/remark-shiki.ts

@@ -1,126 +0,0 @@
-import type * as shiki from 'shiki';
-import { getHighlighter } from 'shiki';
-import { visit } from 'unist-util-visit';
-import type { ShikiConfig } from './types.js';
-
-/**
- * getHighlighter() is the most expensive step of Shiki. Instead of calling it on every page,
- * cache it here as much as possible. Make sure that your highlighters can be cached, state-free.
- * We make this async, so that multiple calls to parse markdown still share the same highlighter.
- */
-const highlighterCacheAsync = new Map<string, Promise<shiki.Highlighter>>();
-
-// Map of old theme names to new names to preserve compatibility when we upgrade shiki
-const compatThemes: Record<string, string> = {
-	'material-darker': 'material-theme-darker',
-	'material-default': 'material-theme',
-	'material-lighter': 'material-theme-lighter',
-	'material-ocean': 'material-theme-ocean',
-	'material-palenight': 'material-theme-palenight',
-};
-
-const normalizeTheme = (theme: string | shiki.IShikiTheme) => {
-	if (typeof theme === 'string') {
-		return compatThemes[theme] || theme;
-	} else if (compatThemes[theme.name]) {
-		return { ...theme, name: compatThemes[theme.name] };
-	} else {
-		return theme;
-	}
-};
-
-const remarkShiki = async (
-	{ langs = [], theme = 'github-dark', wrap = false }: ShikiConfig,
-	scopedClassName?: string | null
-) => {
-	theme = normalizeTheme(theme);
-	const cacheID: string = typeof theme === 'string' ? theme : theme.name;
-	let highlighterAsync = highlighterCacheAsync.get(cacheID);
-	if (!highlighterAsync) {
-		highlighterAsync = getHighlighter({ theme }).then((hl) => {
-			hl.setColorReplacements({
-				'#000001': 'var(--astro-code-color-text)',
-				'#000002': 'var(--astro-code-color-background)',
-				'#000004': 'var(--astro-code-token-constant)',
-				'#000005': 'var(--astro-code-token-string)',
-				'#000006': 'var(--astro-code-token-comment)',
-				'#000007': 'var(--astro-code-token-keyword)',
-				'#000008': 'var(--astro-code-token-parameter)',
-				'#000009': 'var(--astro-code-token-function)',
-				'#000010': 'var(--astro-code-token-string-expression)',
-				'#000011': 'var(--astro-code-token-punctuation)',
-				'#000012': 'var(--astro-code-token-link)',
-			});
-			return hl;
-		});
-		highlighterCacheAsync.set(cacheID, highlighterAsync);
-	}
-	const highlighter = await highlighterAsync;
-
-	// NOTE: There may be a performance issue here for large sites that use `lang`.
-	// Since this will be called on every page load. Unclear how to fix this.
-	for (const lang of langs) {
-		await highlighter.loadLanguage(lang);
-	}
-
-	return () => (tree: any) => {
-		visit(tree, 'code', (node) => {
-			let lang: string;
-
-			if (typeof node.lang === 'string') {
-				const langExists = highlighter.getLoadedLanguages().includes(node.lang);
-				if (langExists) {
-					lang = node.lang;
-				} else {
-					// eslint-disable-next-line no-console
-					console.warn(`The language "${node.lang}" doesn't exist, falling back to plaintext.`);
-					lang = 'plaintext';
-				}
-			} else {
-				lang = 'plaintext';
-			}
-
-			let html = highlighter!.codeToHtml(node.value, { lang });
-
-			// Q: Couldn't these regexes match on a user's inputted code blocks?
-			// A: Nope! All rendered HTML is properly escaped.
-			// Ex. If a user typed `<span class="line"` into a code block,
-			// It would become this before hitting our regexes:
-			// &lt;span class=&quot;line&quot;
-
-			// Replace "shiki" class naming with "astro" and add "is:raw".
-			html = html.replace(
-				/<pre class="(.*?)shiki(.*?)"/,
-				`<pre is:raw class="$1astro-code$2${scopedClassName ? ' ' + scopedClassName : ''}"`
-			);
-			// Add "user-select: none;" for "+"/"-" diff symbols
-			if (node.lang === 'diff') {
-				html = html.replace(
-					/<span class="line"><span style="(.*?)">([\+|\-])/g,
-					'<span class="line"><span style="$1"><span style="user-select: none;">$2</span>'
-				);
-			}
-			// Handle code wrapping
-			// if wrap=null, do nothing.
-			if (wrap === false) {
-				html = html.replace(/style="(.*?)"/, 'style="$1; overflow-x: auto;"');
-			} else if (wrap === true) {
-				html = html.replace(
-					/style="(.*?)"/,
-					'style="$1; overflow-x: auto; white-space: pre-wrap; word-wrap: break-word;"'
-				);
-			}
-
-			// Apply scopedClassName to all nested lines
-			if (scopedClassName) {
-				html = html.replace(/\<span class="line"\>/g, `<span class="line ${scopedClassName}"`);
-			}
-
-			node.type = 'html';
-			node.value = html;
-			node.children = [];
-		});
-	};
-};
-
-export default remarkShiki;