full site update

This commit is contained in:
2025-07-24 18:46:24 +02:00
parent bfe2b90d8d
commit 37a6e0ab31
6912 changed files with 540482 additions and 361712 deletions

View File

@@ -1,6 +0,0 @@
import type { VFileData as Data, VFile } from 'vfile';
import type { MarkdownAstroData } from './types.js';
export declare class InvalidAstroDataError extends TypeError {
}
export declare function safelyGetAstroData(vfileData: Data): MarkdownAstroData | InvalidAstroDataError;
export declare function setVfileFrontmatter(vfile: VFile, frontmatter: Record<string, any>): void;

View File

@@ -1,31 +0,0 @@
function isValidAstroData(obj) {
if (typeof obj === "object" && obj !== null && obj.hasOwnProperty("frontmatter")) {
const { frontmatter } = obj;
try {
JSON.stringify(frontmatter);
} catch {
return false;
}
return typeof frontmatter === "object" && frontmatter !== null;
}
return false;
}
class InvalidAstroDataError extends TypeError {
}
function safelyGetAstroData(vfileData) {
const { astro } = vfileData;
if (!astro || !isValidAstroData(astro)) {
return new InvalidAstroDataError();
}
return astro;
}
function setVfileFrontmatter(vfile, frontmatter) {
vfile.data ??= {};
vfile.data.astro ??= {};
vfile.data.astro.frontmatter = frontmatter;
}
export {
InvalidAstroDataError,
safelyGetAstroData,
setVfileFrontmatter
};

View File

@@ -0,0 +1,20 @@
export declare function isFrontmatterValid(frontmatter: Record<string, any>): boolean;
export declare function extractFrontmatter(code: string): string | undefined;
export interface ParseFrontmatterOptions {
/**
* How the frontmatter should be handled in the returned `content` string.
* - `preserve`: Keep the frontmatter.
* - `remove`: Remove the frontmatter.
* - `empty-with-spaces`: Replace the frontmatter with empty spaces. (preserves sourcemap line/col/offset)
* - `empty-with-lines`: Replace the frontmatter with empty line breaks. (preserves sourcemap line/col)
*
* @default 'remove'
*/
frontmatter: 'preserve' | 'remove' | 'empty-with-spaces' | 'empty-with-lines';
}
export interface ParseFrontmatterResult {
frontmatter: Record<string, any>;
rawFrontmatter: string;
content: string;
}
export declare function parseFrontmatter(code: string, options?: ParseFrontmatterOptions): ParseFrontmatterResult;

View File

@@ -0,0 +1,58 @@
import yaml from "js-yaml";
import * as toml from "smol-toml";
function isFrontmatterValid(frontmatter) {
try {
JSON.stringify(frontmatter);
} catch {
return false;
}
return typeof frontmatter === "object" && frontmatter !== null;
}
const frontmatterRE = /(?:^\uFEFF?|^\s*\n)(?:---|\+\+\+)([\s\S]*?\n)(?:---|\+\+\+)/;
const frontmatterTypeRE = /(?:^\uFEFF?|^\s*\n)(---|\+\+\+)/;
function extractFrontmatter(code) {
return frontmatterRE.exec(code)?.[1];
}
function getFrontmatterParser(code) {
return frontmatterTypeRE.exec(code)?.[1] === "+++" ? ["+++", toml.parse] : ["---", yaml.load];
}
function parseFrontmatter(code, options) {
const rawFrontmatter = extractFrontmatter(code);
if (rawFrontmatter == null) {
return { frontmatter: {}, rawFrontmatter: "", content: code };
}
const [delims, parser] = getFrontmatterParser(code);
const parsed = parser(rawFrontmatter);
const frontmatter = parsed && typeof parsed === "object" ? parsed : {};
let content;
switch (options?.frontmatter ?? "remove") {
case "preserve":
content = code;
break;
case "remove":
content = code.replace(`${delims}${rawFrontmatter}${delims}`, "");
break;
case "empty-with-spaces":
content = code.replace(
`${delims}${rawFrontmatter}${delims}`,
` ${rawFrontmatter.replace(/[^\r\n]/g, " ")} `
);
break;
case "empty-with-lines":
content = code.replace(
`${delims}${rawFrontmatter}${delims}`,
rawFrontmatter.replace(/[^\r\n]/g, "")
);
break;
}
return {
frontmatter,
rawFrontmatter,
content
};
}
export {
extractFrontmatter,
isFrontmatterValid,
parseFrontmatter
};

View File

@@ -1,7 +1,8 @@
import type { Root } from 'hast';
type Highlighter = (code: string, language: string, options?: {
meta?: string;
}) => Promise<string>;
}) => Promise<Root | string>;
export declare const defaultExcludeLanguages: string[];
/**
* A hast utility to syntax highlight code blocks with a given syntax highlighter.
*
@@ -11,5 +12,5 @@ type Highlighter = (code: string, language: string, options?: {
* A function which receives the code and language, and returns the HTML of a syntax
* highlighted `<pre>` element.
*/
export declare function highlightCodeBlocks(tree: Root, highlighter: Highlighter): Promise<void>;
export declare function highlightCodeBlocks(tree: Root, highlighter: Highlighter, excludeLanguages?: string[]): Promise<void>;
export {};

View File

@@ -3,7 +3,8 @@ import { toText } from "hast-util-to-text";
import { removePosition } from "unist-util-remove-position";
import { visitParents } from "unist-util-visit-parents";
const languagePattern = /\blanguage-(\S+)\b/;
async function highlightCodeBlocks(tree, highlighter) {
const defaultExcludeLanguages = ["math"];
async function highlightCodeBlocks(tree, highlighter, excludeLanguages = []) {
const nodes = [];
visitParents(tree, { type: "element", tagName: "code" }, (node, ancestors) => {
const parent = ancestors.at(-1);
@@ -28,12 +29,13 @@ async function highlightCodeBlocks(tree, highlighter) {
}
}
}
if (languageMatch?.[1] === "math") {
const language = languageMatch?.[1] || "plaintext";
if (excludeLanguages.includes(language) || defaultExcludeLanguages.includes(language)) {
return;
}
nodes.push({
node,
language: languageMatch?.[1] || "plaintext",
language,
parent,
grandParent: ancestors.at(-2)
});
@@ -41,13 +43,19 @@ async function highlightCodeBlocks(tree, highlighter) {
for (const { node, language, grandParent, parent } of nodes) {
const meta = node.data?.meta ?? node.properties.metastring ?? void 0;
const code = toText(node, { whitespace: "pre" });
const html = await highlighter(code, language, { meta });
const replacement = fromHtml(html, { fragment: true }).children[0];
removePosition(replacement);
const result = await highlighter(code, language, { meta });
let replacement;
if (typeof result === "string") {
replacement = fromHtml(result, { fragment: true }).children[0];
removePosition(replacement);
} else {
replacement = result.children[0];
}
const index = grandParent.children.indexOf(parent);
grandParent.children[index] = replacement;
}
}
export {
defaultExcludeLanguages,
highlightCodeBlocks
};

View File

@@ -4,13 +4,19 @@ import { resolve as importMetaResolve } from "import-meta-resolve";
let cwdUrlStr;
async function importPlugin(p) {
try {
const importResult2 = await import(p);
const importResult2 = await import(
/* @vite-ignore */
p
);
return importResult2.default;
} catch {
}
cwdUrlStr ??= pathToFileURL(path.join(process.cwd(), "package.json")).toString();
const resolved = importMetaResolve(p, cwdUrlStr);
const importResult = await import(resolved);
const importResult = await import(
/* @vite-ignore */
resolved
);
return importResult.default;
}
export {

View File

@@ -1,13 +1,14 @@
import type { AstroMarkdownOptions, MarkdownProcessor } from './types.js';
export { InvalidAstroDataError, setVfileFrontmatter } from './frontmatter-injection.js';
import type { AstroMarkdownOptions, AstroMarkdownProcessorOptions, MarkdownProcessor, SyntaxHighlightConfig } from './types.js';
export { extractFrontmatter, isFrontmatterValid, type ParseFrontmatterOptions, type ParseFrontmatterResult, parseFrontmatter, } from './frontmatter.js';
export { rehypeHeadingIds } from './rehype-collect-headings.js';
export { remarkCollectImages } from './remark-collect-images.js';
export { rehypePrism } from './rehype-prism.js';
export { rehypeShiki } from './rehype-shiki.js';
export { createShikiHighlighter, type ShikiHighlighter } from './shiki.js';
export { remarkCollectImages } from './remark-collect-images.js';
export { type CreateShikiHighlighterOptions, createShikiHighlighter, type ShikiHighlighter, type ShikiHighlighterHighlightOptions, } from './shiki.js';
export * from './types.js';
export declare const syntaxHighlightDefaults: Required<SyntaxHighlightConfig>;
export declare const markdownConfigDefaults: Required<AstroMarkdownOptions>;
/**
* Create a markdown preprocessor to render multiple markdown files
*/
export declare function createMarkdownProcessor(opts?: AstroMarkdownOptions): Promise<MarkdownProcessor>;
export declare function createMarkdownProcessor(opts?: AstroMarkdownProcessorOptions): Promise<MarkdownProcessor>;

View File

@@ -1,13 +1,3 @@
import {
InvalidAstroDataError,
safelyGetAstroData,
setVfileFrontmatter
} from "./frontmatter-injection.js";
import { loadPlugins } from "./load-plugins.js";
import { rehypeHeadingIds } from "./rehype-collect-headings.js";
import { rehypePrism } from "./rehype-prism.js";
import { rehypeShiki } from "./rehype-shiki.js";
import { remarkCollectImages } from "./remark-collect-images.js";
import rehypeRaw from "rehype-raw";
import rehypeStringify from "rehype-stringify";
import remarkGfm from "remark-gfm";
@@ -16,16 +6,32 @@ import remarkRehype from "remark-rehype";
import remarkSmartypants from "remark-smartypants";
import { unified } from "unified";
import { VFile } from "vfile";
import { defaultExcludeLanguages } from "./highlight.js";
import { loadPlugins } from "./load-plugins.js";
import { rehypeHeadingIds } from "./rehype-collect-headings.js";
import { rehypeImages } from "./rehype-images.js";
import { InvalidAstroDataError as InvalidAstroDataError2, setVfileFrontmatter as setVfileFrontmatter2 } from "./frontmatter-injection.js";
import { rehypePrism } from "./rehype-prism.js";
import { rehypeShiki } from "./rehype-shiki.js";
import { remarkCollectImages } from "./remark-collect-images.js";
import {
extractFrontmatter,
isFrontmatterValid,
parseFrontmatter
} from "./frontmatter.js";
import { rehypeHeadingIds as rehypeHeadingIds2 } from "./rehype-collect-headings.js";
import { remarkCollectImages as remarkCollectImages2 } from "./remark-collect-images.js";
import { rehypePrism as rehypePrism2 } from "./rehype-prism.js";
import { rehypeShiki as rehypeShiki2 } from "./rehype-shiki.js";
import { createShikiHighlighter } from "./shiki.js";
import { remarkCollectImages as remarkCollectImages2 } from "./remark-collect-images.js";
import {
createShikiHighlighter
} from "./shiki.js";
export * from "./types.js";
const syntaxHighlightDefaults = {
type: "shiki",
excludeLangs: defaultExcludeLanguages
};
const markdownConfigDefaults = {
syntaxHighlight: "shiki",
syntaxHighlight: syntaxHighlightDefaults,
shikiConfig: {
langs: [],
theme: "github-dark",
@@ -49,7 +55,8 @@ async function createMarkdownProcessor(opts) {
rehypePlugins = markdownConfigDefaults.rehypePlugins,
remarkRehype: remarkRehypeOptions = markdownConfigDefaults.remarkRehype,
gfm = markdownConfigDefaults.gfm,
smartypants = markdownConfigDefaults.smartypants
smartypants = markdownConfigDefaults.smartypants,
experimentalHeadingIdCompat = false
} = opts ?? {};
const loadedRemarkPlugins = await Promise.all(loadPlugins(remarkPlugins));
const loadedRehypePlugins = await Promise.all(loadPlugins(rehypePlugins));
@@ -66,47 +73,53 @@ async function createMarkdownProcessor(opts) {
parser.use(plugin, pluginOpts);
}
if (!isPerformanceBenchmark) {
parser.use(remarkCollectImages);
parser.use(remarkCollectImages, opts?.image);
}
parser.use(remarkRehype, {
allowDangerousHtml: true,
passThrough: [],
...remarkRehypeOptions
});
if (!isPerformanceBenchmark) {
if (syntaxHighlight === "shiki") {
parser.use(rehypeShiki, shikiConfig);
} else if (syntaxHighlight === "prism") {
parser.use(rehypePrism);
if (syntaxHighlight && !isPerformanceBenchmark) {
const syntaxHighlightType = typeof syntaxHighlight === "string" ? syntaxHighlight : syntaxHighlight?.type;
const excludeLangs = typeof syntaxHighlight === "object" ? syntaxHighlight?.excludeLangs : void 0;
if (syntaxHighlightType === "shiki") {
parser.use(rehypeShiki, shikiConfig, excludeLangs);
} else if (syntaxHighlightType === "prism") {
parser.use(rehypePrism, excludeLangs);
}
}
for (const [plugin, pluginOpts] of loadedRehypePlugins) {
parser.use(plugin, pluginOpts);
}
parser.use(rehypeImages());
parser.use(rehypeImages);
if (!isPerformanceBenchmark) {
parser.use(rehypeHeadingIds);
parser.use(rehypeHeadingIds, { experimentalHeadingIdCompat });
}
parser.use(rehypeRaw).use(rehypeStringify, { allowDangerousHtml: true });
return {
async render(content, renderOpts) {
const vfile = new VFile({ value: content, path: renderOpts?.fileURL });
setVfileFrontmatter(vfile, renderOpts?.frontmatter ?? {});
const vfile = new VFile({
value: content,
path: renderOpts?.fileURL,
data: {
astro: {
frontmatter: renderOpts?.frontmatter ?? {}
}
}
});
const result = await parser.process(vfile).catch((err) => {
err = prefixError(err, `Failed to parse Markdown file "${vfile.path}"`);
console.error(err);
throw err;
});
const astroData = safelyGetAstroData(result.data);
if (astroData instanceof InvalidAstroDataError) {
throw astroData;
}
return {
code: String(result.value),
metadata: {
headings: result.data.__astroHeadings ?? [],
imagePaths: result.data.imagePaths ?? /* @__PURE__ */ new Set(),
frontmatter: astroData.frontmatter ?? {}
headings: result.data.astro?.headings ?? [],
localImagePaths: result.data.astro?.localImagePaths ?? [],
remoteImagePaths: result.data.astro?.remoteImagePaths ?? [],
frontmatter: result.data.astro?.frontmatter ?? {}
}
};
}
@@ -130,13 +143,15 @@ ${err.message}`;
return wrappedError;
}
export {
InvalidAstroDataError2 as InvalidAstroDataError,
createMarkdownProcessor,
createShikiHighlighter,
extractFrontmatter,
isFrontmatterValid,
markdownConfigDefaults,
parseFrontmatter,
rehypeHeadingIds2 as rehypeHeadingIds,
rehypePrism2 as rehypePrism,
rehypeShiki2 as rehypeShiki,
remarkCollectImages2 as remarkCollectImages,
setVfileFrontmatter2 as setVfileFrontmatter
syntaxHighlightDefaults
};

View File

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

View File

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

View File

@@ -1,2 +1,11 @@
import type { RehypePlugin } from './types.js';
export declare function rehypeHeadingIds(): ReturnType<RehypePlugin>;
/**
* Rehype plugin that adds `id` attributes to headings based on their text content.
*
* @param options Optional configuration object for the plugin.
*
* @see https://docs.astro.build/en/guides/markdown-content/#heading-ids-and-plugins
*/
export declare function rehypeHeadingIds({ experimentalHeadingIdCompat, }?: {
experimentalHeadingIdCompat?: boolean;
}): ReturnType<RehypePlugin>;

View File

@@ -1,14 +1,15 @@
import Slugger from "github-slugger";
import { visit } from "unist-util-visit";
import { InvalidAstroDataError, safelyGetAstroData } from "./frontmatter-injection.js";
const rawNodeTypes = /* @__PURE__ */ new Set(["text", "raw", "mdxTextExpression"]);
const codeTagNames = /* @__PURE__ */ new Set(["code", "pre"]);
function rehypeHeadingIds() {
function rehypeHeadingIds({
experimentalHeadingIdCompat
} = {}) {
return function(tree, file) {
const headings = [];
const frontmatter = file.data.astro?.frontmatter;
const slugger = new Slugger();
const isMDX = isMDXFile(file);
const astroData = safelyGetAstroData(file.data);
visit(tree, (node) => {
if (node.type !== "element") return;
const { tagName } = node;
@@ -29,10 +30,13 @@ function rehypeHeadingIds() {
if (rawNodeTypes.has(child.type)) {
if (isMDX || codeTagNames.has(parent.tagName)) {
let value = child.value;
if (isMdxTextExpression(child) && !(astroData instanceof InvalidAstroDataError)) {
if (isMdxTextExpression(child) && frontmatter) {
const frontmatterPath = getMdxFrontmatterVariablePath(child);
if (Array.isArray(frontmatterPath) && frontmatterPath.length > 0) {
const frontmatterValue = getMdxFrontmatterVariableValue(astroData, frontmatterPath);
const frontmatterValue = getMdxFrontmatterVariableValue(
frontmatter,
frontmatterPath
);
if (typeof frontmatterValue === "string") {
value = frontmatterValue;
}
@@ -47,12 +51,15 @@ function rehypeHeadingIds() {
node.properties = node.properties || {};
if (typeof node.properties.id !== "string") {
let slug = slugger.slug(text);
if (slug.endsWith("-")) slug = slug.slice(0, -1);
if (!experimentalHeadingIdCompat) {
if (slug.endsWith("-")) slug = slug.slice(0, -1);
}
node.properties.id = slug;
}
headings.push({ depth, slug: node.properties.id, text });
});
file.data.__astroHeadings = headings;
file.data.astro ??= {};
file.data.astro.headings = headings;
};
}
function isMDXFile(file) {
@@ -74,8 +81,8 @@ function getMdxFrontmatterVariablePath(node) {
if (expression.type !== "Identifier" || expression.name !== "frontmatter") return new Error();
return expressionPath.reverse();
}
function getMdxFrontmatterVariableValue(astroData, path) {
let value = astroData.frontmatter;
function getMdxFrontmatterVariableValue(frontmatter, path) {
let value = frontmatter;
for (const key of path) {
if (!value[key]) return void 0;
value = value[key];

View File

@@ -1,2 +1,3 @@
import type { MarkdownVFile } from './types.js';
export declare function rehypeImages(): () => (tree: any, file: MarkdownVFile) => void;
import type { Root } from 'hast';
import type { VFile } from 'vfile';
export declare function rehypeImages(): (tree: Root, file: VFile) => void;

View File

@@ -1,22 +1,30 @@
import { visit } from "unist-util-visit";
function rehypeImages() {
return () => function(tree, file) {
return function(tree, file) {
if (!file.data.astro?.localImagePaths?.length && !file.data.astro?.remoteImagePaths?.length) {
return;
}
const imageOccurrenceMap = /* @__PURE__ */ new Map();
visit(tree, (node) => {
if (node.type !== "element") return;
visit(tree, "element", (node) => {
if (node.tagName !== "img") return;
if (node.properties?.src) {
node.properties.src = decodeURI(node.properties.src);
if (file.data.imagePaths?.has(node.properties.src)) {
const { ...props } = node.properties;
const index = imageOccurrenceMap.get(node.properties.src) || 0;
imageOccurrenceMap.set(node.properties.src, index + 1);
node.properties["__ASTRO_IMAGE_"] = JSON.stringify({ ...props, index });
Object.keys(props).forEach((prop) => {
delete node.properties[prop];
});
}
if (typeof node.properties?.src !== "string") return;
const src = decodeURI(node.properties.src);
let newProperties;
if (file.data.astro?.localImagePaths?.includes(src)) {
newProperties = { ...node.properties, src };
} else if (file.data.astro?.remoteImagePaths?.includes(src)) {
newProperties = {
// By default, markdown images won't have width and height set. However, just in case another user plugin does set these, we should respect them.
inferSize: "width" in node.properties && "height" in node.properties ? void 0 : true,
...node.properties,
src
};
} else {
return;
}
const index = imageOccurrenceMap.get(node.properties.src) || 0;
imageOccurrenceMap.set(node.properties.src, index + 1);
node.properties = { __ASTRO_IMAGE_: JSON.stringify({ ...newProperties, index }) };
});
};
}

View File

@@ -1,3 +1,3 @@
import type { Root } from 'hast';
import type { Plugin } from 'unified';
export declare const rehypePrism: Plugin<[], Root>;
export declare const rehypePrism: Plugin<[string[]?], Root>;

View File

@@ -1,13 +1,17 @@
import { runHighlighterWithAstro } from "@astrojs/prism/dist/highlighter";
import { highlightCodeBlocks } from "./highlight.js";
const rehypePrism = () => {
const rehypePrism = (excludeLangs) => {
return async (tree) => {
await highlightCodeBlocks(tree, (code, language) => {
let { html, classLanguage } = runHighlighterWithAstro(language, code);
return Promise.resolve(
`<pre class="${classLanguage}" data-language="${language}"><code is:raw class="${classLanguage}">${html}</code></pre>`
);
});
await highlightCodeBlocks(
tree,
(code, language) => {
let { html, classLanguage } = runHighlighterWithAstro(language, code);
return Promise.resolve(
`<pre class="${classLanguage}" data-language="${language}"><code is:raw class="${classLanguage}">${html}</code></pre>`
);
},
excludeLangs
);
};
};
export {

View File

@@ -1,4 +1,4 @@
import type { Root } from 'hast';
import type { Plugin } from 'unified';
import type { ShikiConfig } from './types.js';
export declare const rehypeShiki: Plugin<[ShikiConfig?], Root>;
export declare const rehypeShiki: Plugin<[ShikiConfig, string[]?], Root>;

View File

@@ -1,11 +1,27 @@
import { highlightCodeBlocks } from "./highlight.js";
import { createShikiHighlighter } from "./shiki.js";
const rehypeShiki = (config) => {
const rehypeShiki = (config, excludeLangs) => {
let highlighterAsync;
return async (tree) => {
highlighterAsync ??= createShikiHighlighter(config);
highlighterAsync ??= createShikiHighlighter({
langs: config?.langs,
theme: config?.theme,
themes: config?.themes,
langAlias: config?.langAlias
});
const highlighter = await highlighterAsync;
await highlightCodeBlocks(tree, highlighter.highlight);
await highlightCodeBlocks(
tree,
(code, language, options) => {
return highlighter.codeToHast(code, language, {
meta: options?.meta,
wrap: config?.wrap,
defaultColor: config?.defaultColor,
transformers: config?.transformers
});
},
excludeLangs
);
};
};
export {

View File

@@ -1,2 +1,4 @@
import type { MarkdownVFile } from './types.js';
export declare function remarkCollectImages(): (tree: any, vfile: MarkdownVFile) => void;
import type { Root } from 'mdast';
import type { VFile } from 'vfile';
import type { AstroMarkdownProcessorOptions } from './types.js';
export declare function remarkCollectImages(opts: AstroMarkdownProcessorOptions['image']): (tree: Root, vfile: VFile) => void;

View File

@@ -1,36 +1,38 @@
import { isRemoteAllowed } from "@astrojs/internal-helpers/remote";
import { definitions } from "mdast-util-definitions";
import { visit } from "unist-util-visit";
function remarkCollectImages() {
function remarkCollectImages(opts) {
const domains = opts?.domains ?? [];
const remotePatterns = opts?.remotePatterns ?? [];
return function(tree, vfile) {
if (typeof vfile?.path !== "string") return;
const definition = definitions(tree);
const imagePaths = /* @__PURE__ */ new Set();
visit(tree, ["image", "imageReference"], (node) => {
const localImagePaths = /* @__PURE__ */ new Set();
const remoteImagePaths = /* @__PURE__ */ new Set();
visit(tree, (node) => {
let url;
if (node.type === "image") {
if (shouldOptimizeImage(node.url)) imagePaths.add(decodeURI(node.url));
}
if (node.type === "imageReference") {
url = decodeURI(node.url);
} else if (node.type === "imageReference") {
const imageDefinition = definition(node.identifier);
if (imageDefinition) {
if (shouldOptimizeImage(imageDefinition.url))
imagePaths.add(decodeURI(imageDefinition.url));
url = decodeURI(imageDefinition.url);
}
}
if (!url) return;
if (URL.canParse(url)) {
if (isRemoteAllowed(url, { domains, remotePatterns })) {
remoteImagePaths.add(url);
}
} else if (!url.startsWith("/")) {
localImagePaths.add(url);
}
});
vfile.data.imagePaths = imagePaths;
vfile.data.astro ??= {};
vfile.data.astro.localImagePaths = Array.from(localImagePaths);
vfile.data.astro.remoteImagePaths = Array.from(remoteImagePaths);
};
}
function shouldOptimizeImage(src) {
return !isValidUrl(src) && !src.startsWith("/");
}
function isValidUrl(str) {
try {
new URL(str);
return true;
} catch {
return false;
}
}
export {
remarkCollectImages
};

View File

@@ -1,12 +1,43 @@
import type { ShikiConfig } from './types.js';
import type { Root } from 'hast';
import { type HighlighterCoreOptions, type LanguageRegistration, type ShikiTransformer, type ThemeRegistration, type ThemeRegistrationRaw } from 'shiki';
import type { ThemePresets } from './types.js';
export interface ShikiHighlighter {
highlight(code: string, lang?: string, options?: {
inline?: boolean;
attributes?: Record<string, string>;
/**
* Raw `meta` information to be used by Shiki transformers
*/
meta?: string;
}): Promise<string>;
codeToHast(code: string, lang?: string, options?: ShikiHighlighterHighlightOptions): Promise<Root>;
codeToHtml(code: string, lang?: string, options?: ShikiHighlighterHighlightOptions): Promise<string>;
}
export declare function createShikiHighlighter({ langs, theme, themes, defaultColor, wrap, transformers, langAlias, }?: ShikiConfig): Promise<ShikiHighlighter>;
export interface CreateShikiHighlighterOptions {
langs?: LanguageRegistration[];
theme?: ThemePresets | ThemeRegistration | ThemeRegistrationRaw;
themes?: Record<string, ThemePresets | ThemeRegistration | ThemeRegistrationRaw>;
langAlias?: HighlighterCoreOptions['langAlias'];
}
export interface ShikiHighlighterHighlightOptions {
/**
* Generate inline code element only, without the pre element wrapper.
*/
inline?: boolean;
/**
* Enable word wrapping.
* - true: enabled.
* - false: disabled.
* - null: All overflow styling removed. Code will overflow the element by default.
*/
wrap?: boolean | null;
/**
* Chooses a theme from the "themes" option that you've defined as the default styling theme.
*/
defaultColor?: 'light' | 'dark' | string | false;
/**
* Shiki transformers to customize the generated HTML by manipulating the hast tree.
*/
transformers?: ShikiTransformer[];
/**
* Additional attributes to be added to the root code block element.
*/
attributes?: Record<string, string>;
/**
* Raw `meta` information to be used by Shiki transformers.
*/
meta?: string;
}
export declare function createShikiHighlighter({ langs, theme, themes, langAlias, }?: CreateShikiHighlighterOptions): Promise<ShikiHighlighter>;

View File

@@ -1,130 +1,109 @@
import {
createCssVariablesTheme,
getHighlighter,
createHighlighter,
isSpecialLang
} from "shiki";
import { visit } from "unist-util-visit";
const ASTRO_COLOR_REPLACEMENTS = {
"--astro-code-foreground": "--astro-code-color-text",
"--astro-code-background": "--astro-code-color-background"
};
const COLOR_REPLACEMENT_REGEX = new RegExp(
`${Object.keys(ASTRO_COLOR_REPLACEMENTS).join("|")}`,
"g"
);
let _cssVariablesTheme;
const cssVariablesTheme = () => _cssVariablesTheme ?? (_cssVariablesTheme = createCssVariablesTheme({ variablePrefix: "--astro-code-" }));
const cssVariablesTheme = () => _cssVariablesTheme ?? (_cssVariablesTheme = createCssVariablesTheme({
variablePrefix: "--astro-code-"
}));
async function createShikiHighlighter({
langs = [],
theme = "github-dark",
themes = {},
defaultColor,
wrap = false,
transformers = [],
langAlias = {}
} = {}) {
theme = theme === "css-variables" ? cssVariablesTheme() : theme;
const highlighter = await getHighlighter({
const highlighter = await createHighlighter({
langs: ["plaintext", ...langs],
langAlias,
themes: Object.values(themes).length ? Object.values(themes) : [theme]
});
return {
async highlight(code, lang = "plaintext", options) {
const resolvedLang = langAlias[lang] ?? lang;
const loadedLanguages = highlighter.getLoadedLanguages();
if (!isSpecialLang(lang) && !loadedLanguages.includes(resolvedLang)) {
try {
await highlighter.loadLanguage(resolvedLang);
} catch (_err) {
const langStr = lang === resolvedLang ? `"${lang}"` : `"${lang}" (aliased to "${resolvedLang}")`;
console.warn(
`[Shiki] The language ${langStr} doesn't exist, falling back to "plaintext".`
);
lang = "plaintext";
}
async function highlight(code, lang = "plaintext", options, to) {
const resolvedLang = langAlias[lang] ?? lang;
const loadedLanguages = highlighter.getLoadedLanguages();
if (!isSpecialLang(lang) && !loadedLanguages.includes(resolvedLang)) {
try {
await highlighter.loadLanguage(resolvedLang);
} catch (_err) {
const langStr = lang === resolvedLang ? `"${lang}"` : `"${lang}" (aliased to "${resolvedLang}")`;
console.warn(`[Shiki] The language ${langStr} doesn't exist, falling back to "plaintext".`);
lang = "plaintext";
}
const themeOptions = Object.values(themes).length ? { themes } : { theme };
const inline = options?.inline ?? false;
return highlighter.codeToHtml(code, {
...themeOptions,
defaultColor,
lang,
// NOTE: while we can spread `options.attributes` here so that Shiki can auto-serialize this as rendered
// attributes on the top-level tag, it's not clear whether it is fine to pass all attributes as meta, as
// they're technically not meta, nor parsed from Shiki's `parseMetaString` API.
meta: options?.meta ? { __raw: options?.meta } : void 0,
transformers: [
{
pre(node) {
if (inline) {
node.tagName = "code";
}
const {
class: attributesClass,
style: attributesStyle,
...rest
} = options?.attributes ?? {};
Object.assign(node.properties, rest);
const classValue = (normalizePropAsString(node.properties.class) ?? "") + (attributesClass ? ` ${attributesClass}` : "");
const styleValue = (normalizePropAsString(node.properties.style) ?? "") + (attributesStyle ? `; ${attributesStyle}` : "");
node.properties.class = classValue.replace(/shiki/g, "astro-code");
node.properties.dataLanguage = lang;
if (wrap === false) {
node.properties.style = styleValue + "; overflow-x: auto;";
} else if (wrap === true) {
node.properties.style = styleValue + "; overflow-x: auto; white-space: pre-wrap; word-wrap: break-word;";
}
},
line(node) {
if (resolvedLang === "diff") {
const innerSpanNode = node.children[0];
const innerSpanTextNode = innerSpanNode?.type === "element" && innerSpanNode.children?.[0];
if (innerSpanTextNode && innerSpanTextNode.type === "text") {
const start = innerSpanTextNode.value[0];
if (start === "+" || start === "-") {
innerSpanTextNode.value = innerSpanTextNode.value.slice(1);
innerSpanNode.children.unshift({
type: "element",
tagName: "span",
properties: { style: "user-select: none;" },
children: [{ type: "text", value: start }]
});
}
}
code = code.replace(/(?:\r\n|\r|\n)$/, "");
const themeOptions = Object.values(themes).length ? { themes } : { theme };
const inline = options?.inline ?? false;
return highlighter[to === "html" ? "codeToHtml" : "codeToHast"](code, {
...themeOptions,
defaultColor: options.defaultColor,
lang,
// NOTE: while we can spread `options.attributes` here so that Shiki can auto-serialize this as rendered
// attributes on the top-level tag, it's not clear whether it is fine to pass all attributes as meta, as
// they're technically not meta, nor parsed from Shiki's `parseMetaString` API.
meta: options?.meta ? { __raw: options?.meta } : void 0,
transformers: [
{
pre(node) {
if (inline) {
node.tagName = "code";
}
const {
class: attributesClass,
style: attributesStyle,
...rest
} = options?.attributes ?? {};
Object.assign(node.properties, rest);
const classValue = (normalizePropAsString(node.properties.class) ?? "") + (attributesClass ? ` ${attributesClass}` : "");
const styleValue = (normalizePropAsString(node.properties.style) ?? "") + (attributesStyle ? `; ${attributesStyle}` : "");
node.properties.class = classValue.replace(/shiki/g, "astro-code");
node.properties.dataLanguage = lang;
if (options.wrap === false || options.wrap === void 0) {
node.properties.style = styleValue + "; overflow-x: auto;";
} else if (options.wrap === true) {
node.properties.style = styleValue + "; overflow-x: auto; white-space: pre-wrap; word-wrap: break-word;";
}
},
line(node) {
if (resolvedLang === "diff") {
const innerSpanNode = node.children[0];
const innerSpanTextNode = innerSpanNode?.type === "element" && innerSpanNode.children?.[0];
if (innerSpanTextNode && innerSpanTextNode.type === "text") {
const start = innerSpanTextNode.value[0];
if (start === "+" || start === "-") {
innerSpanTextNode.value = innerSpanTextNode.value.slice(1);
innerSpanNode.children.unshift({
type: "element",
tagName: "span",
properties: { style: "user-select: none;" },
children: [{ type: "text", value: start }]
});
}
}
},
code(node) {
if (inline) {
return node.children[0];
}
},
root(node) {
if (Object.values(themes).length) {
return;
}
const themeName = typeof theme === "string" ? theme : theme.name;
if (themeName === "css-variables") {
visit(node, "element", (child) => {
if (child.properties?.style) {
child.properties.style = replaceCssVariables(child.properties.style);
}
});
}
}
},
...transformers
]
});
code(node) {
if (inline) {
return node.children[0];
}
}
},
...options.transformers ?? []
]
});
}
return {
codeToHast(code, lang, options = {}) {
return highlight(code, lang, options, "hast");
},
codeToHtml(code, lang, options = {}) {
return highlight(code, lang, options, "html");
}
};
}
function normalizePropAsString(value) {
return Array.isArray(value) ? value.join(" ") : value;
}
function replaceCssVariables(str) {
return str.replace(COLOR_REPLACEMENT_REGEX, (match) => ASTRO_COLOR_REPLACEMENTS[match] || match);
}
export {
createShikiHighlighter
};

View File

@@ -1,30 +1,39 @@
import type { RemotePattern } from '@astrojs/internal-helpers/remote';
import type * as hast from 'hast';
import type * as mdast from 'mdast';
import type { Options as RemarkRehypeOptions } from 'remark-rehype';
import type { BuiltinTheme, HighlighterCoreOptions, LanguageRegistration, ShikiTransformer, ThemeRegistration, ThemeRegistrationRaw } from 'shiki';
import type { BuiltinTheme } from 'shiki';
import type * as unified from 'unified';
import type { DataMap, VFile } from 'vfile';
import type { CreateShikiHighlighterOptions, ShikiHighlighterHighlightOptions } from './shiki.js';
export type { Node } from 'unist';
export type MarkdownAstroData = {
frontmatter: Record<string, any>;
};
declare module 'vfile' {
interface DataMap {
astro: {
headings?: MarkdownHeading[];
localImagePaths?: string[];
remoteImagePaths?: string[];
frontmatter?: Record<string, any>;
};
}
}
export type RemarkPlugin<PluginParameters extends any[] = any[]> = unified.Plugin<PluginParameters, mdast.Root>;
export type RemarkPlugins = (string | [string, any] | RemarkPlugin | [RemarkPlugin, any])[];
export type RehypePlugin<PluginParameters extends any[] = any[]> = unified.Plugin<PluginParameters, hast.Root>;
export type RehypePlugins = (string | [string, any] | RehypePlugin | [RehypePlugin, any])[];
export type RemarkRehype = RemarkRehypeOptions;
export type ThemePresets = BuiltinTheme | 'css-variables';
export interface ShikiConfig {
langs?: LanguageRegistration[];
langAlias?: HighlighterCoreOptions['langAlias'];
theme?: ThemePresets | ThemeRegistration | ThemeRegistrationRaw;
themes?: Record<string, ThemePresets | ThemeRegistration | ThemeRegistrationRaw>;
defaultColor?: 'light' | 'dark' | string | false;
wrap?: boolean | null;
transformers?: ShikiTransformer[];
export type SyntaxHighlightConfigType = 'shiki' | 'prism';
export interface SyntaxHighlightConfig {
type: SyntaxHighlightConfigType;
excludeLangs?: string[];
}
export interface ShikiConfig extends Pick<CreateShikiHighlighterOptions, 'langs' | 'theme' | 'themes' | 'langAlias'>, Pick<ShikiHighlighterHighlightOptions, 'defaultColor' | 'wrap' | 'transformers'> {
}
/**
* Configuration options that end up in the markdown section of AstroConfig
*/
export interface AstroMarkdownOptions {
syntaxHighlight?: 'shiki' | 'prism' | false;
syntaxHighlight?: SyntaxHighlightConfig | SyntaxHighlightConfigType | false;
shikiConfig?: ShikiConfig;
remarkPlugins?: RemarkPlugins;
rehypePlugins?: RehypePlugins;
@@ -32,6 +41,16 @@ export interface AstroMarkdownOptions {
gfm?: boolean;
smartypants?: boolean;
}
/**
* Extra configuration options from other parts of AstroConfig that get injected into this plugin
*/
export interface AstroMarkdownProcessorOptions extends AstroMarkdownOptions {
image?: {
domains?: string[];
remotePatterns?: RemotePattern[];
};
experimentalHeadingIdCompat?: boolean;
}
export interface MarkdownProcessor {
render: (content: string, opts?: MarkdownProcessorRenderOptions) => Promise<MarkdownProcessorRenderResult>;
}
@@ -43,7 +62,8 @@ export interface MarkdownProcessorRenderResult {
code: string;
metadata: {
headings: MarkdownHeading[];
imagePaths: Set<string>;
localImagePaths: string[];
remoteImagePaths: string[];
frontmatter: Record<string, any>;
};
}
@@ -52,9 +72,3 @@ export interface MarkdownHeading {
slug: string;
text: string;
}
export interface MarkdownVFile extends VFile {
data: Record<string, unknown> & Partial<DataMap> & {
__astroHeadings?: MarkdownHeading[];
imagePaths?: Set<string>;
};
}