@astrojs/markdoc 0.0.0-data-collections-20230418125011

package/dist/experimental-assets-config.js

@@ -0,0 +1,25 @@
+import Markdoc from "@markdoc/markdoc";
+import { Image } from "astro:assets";
+const experimentalAssetsConfig = {
+  nodes: {
+    image: {
+      attributes: {
+        ...Markdoc.nodes.image.attributes,
+        __optimizedSrc: { type: "Object" }
+      },
+      transform(node, config) {
+        const attributes = node.transformAttributes(config);
+        const children = node.transformChildren(config);
+        if (node.type === "image" && "__optimizedSrc" in node.attributes) {
+          const { __optimizedSrc, ...rest } = node.attributes;
+          return new Markdoc.Tag(Image, { ...rest, src: __optimizedSrc }, children);
+        } else {
+          return new Markdoc.Tag("img", attributes, children);
+        }
+      }
+    }
+  }
+};
+export {
+  experimentalAssetsConfig
+};

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+import type { AstroIntegration } from 'astro';
+export default function markdocIntegration(legacyConfig: any): AstroIntegration;

package/dist/index.js

@@ -0,0 +1,114 @@
+import Markdoc from "@markdoc/markdoc";
+import fs from "node:fs";
+import { fileURLToPath } from "node:url";
+import { isValidUrl, MarkdocError, parseFrontmatter, prependForwardSlash } from "./utils.js";
+import { emitESMImage } from "astro/assets";
+import { bold, red } from "kleur/colors";
+import { applyDefaultConfig } from "./default-config.js";
+import { loadMarkdocConfig } from "./load-config.js";
+function markdocIntegration(legacyConfig) {
+  if (legacyConfig) {
+    console.log(
+      `${red(
+        bold("[Markdoc]")
+      )} Passing Markdoc config from your \`astro.config\` is no longer supported. Configuration should be exported from a \`markdoc.config.mjs\` file. See the configuration docs for more: https://docs.astro.build/en/guides/integrations-guide/markdoc/#configuration`
+    );
+    process.exit(0);
+  }
+  return {
+    name: "@astrojs/markdoc",
+    hooks: {
+      "astro:config:setup": async (params) => {
+        const { config: astroConfig, addContentEntryType } = params;
+        const configLoadResult = await loadMarkdocConfig(astroConfig);
+        const userMarkdocConfig = (configLoadResult == null ? void 0 : configLoadResult.config) ?? {};
+        function getEntryInfo({ fileUrl, contents }) {
+          const parsed = parseFrontmatter(contents, fileURLToPath(fileUrl));
+          return {
+            data: parsed.data,
+            body: parsed.content,
+            slug: parsed.data.slug,
+            rawData: parsed.matter
+          };
+        }
+        addContentEntryType({
+          extensions: [".mdoc"],
+          getEntryInfo,
+          async getRenderModule({ entry, viteId }) {
+            const ast = Markdoc.parse(entry.body);
+            const pluginContext = this;
+            const markdocConfig = applyDefaultConfig(userMarkdocConfig, { entry });
+            const validationErrors = Markdoc.validate(ast, markdocConfig).filter((e) => {
+              return e.error.id !== "variable-undefined";
+            });
+            if (validationErrors.length) {
+              throw new MarkdocError({
+                message: [
+                  `**${String(entry.collection)} \u2192 ${String(entry.id)}** failed to validate:`,
+                  ...validationErrors.map((e) => e.error.id)
+                ].join("\n")
+              });
+            }
+            if (astroConfig.experimental.assets) {
+              await emitOptimizedImages(ast.children, {
+                astroConfig,
+                pluginContext,
+                filePath: entry._internal.filePath
+              });
+            }
+            const code = {
+              code: `import { jsx as h } from 'astro/jsx-runtime';
+import { applyDefaultConfig } from '@astrojs/markdoc/default-config';
+import { Renderer } from '@astrojs/markdoc/components';
+import * as entry from ${JSON.stringify(viteId + "?astroContentCollectionEntry")};${configLoadResult ? `
+import userConfig from ${JSON.stringify(configLoadResult.fileUrl.pathname)};` : ""}${astroConfig.experimental.assets ? `
+import { experimentalAssetsConfig } from '@astrojs/markdoc/experimental-assets-config';` : ""}
+const stringifiedAst = ${JSON.stringify(
+                /* Double stringify to encode *as* stringified JSON */
+                JSON.stringify(ast)
+              )};
+export async function Content (props) {
+	const config = applyDefaultConfig(${configLoadResult ? "{ ...userConfig, variables: { ...userConfig.variables, ...props } }" : "{ variables: props }"}, { entry });${astroConfig.experimental.assets ? `
+config.nodes = { ...experimentalAssetsConfig.nodes, ...config.nodes };` : ""}
+	return h(Renderer, { stringifiedAst, config }); };`
+            };
+            return code;
+          },
+          contentModuleTypes: await fs.promises.readFile(
+            new URL("../template/content-module-types.d.ts", import.meta.url),
+            "utf-8"
+          )
+        });
+      }
+    }
+  };
+}
+async function emitOptimizedImages(nodeChildren, ctx) {
+  for (const node of nodeChildren) {
+    if (node.type === "image" && typeof node.attributes.src === "string" && shouldOptimizeImage(node.attributes.src)) {
+      const resolved = await ctx.pluginContext.resolve(node.attributes.src, ctx.filePath);
+      if ((resolved == null ? void 0 : resolved.id) && fs.existsSync(new URL(prependForwardSlash(resolved.id), "file://"))) {
+        const src = await emitESMImage(
+          resolved.id,
+          ctx.pluginContext.meta.watchMode,
+          ctx.pluginContext.emitFile,
+          { config: ctx.astroConfig }
+        );
+        node.attributes.__optimizedSrc = src;
+      } else {
+        throw new MarkdocError({
+          message: `Could not resolve image ${JSON.stringify(
+            node.attributes.src
+          )} from ${JSON.stringify(ctx.filePath)}. Does the file exist?`
+        });
+      }
+    }
+    await emitOptimizedImages(node.children, ctx);
+  }
+}
+function shouldOptimizeImage(src) {
+  return !isValidUrl(src) && !src.startsWith("/");
+}
+export {
+  markdocIntegration as default
+};

package/dist/load-config.d.ts

@@ -0,0 +1,14 @@
+import type { AstroConfig } from 'astro';
+export declare function loadMarkdocConfig(astroConfig: Pick<AstroConfig, 'root'>): Promise<{
+    config: Readonly<Partial<{
+        nodes: Partial<Record<import("@markdoc/markdoc").NodeType, import("@markdoc/markdoc").Schema<Readonly<Partial<any>>, string>>>;
+        tags: Record<string, import("@markdoc/markdoc").Schema<Readonly<Partial<any>>, string>>;
+        variables: Record<string, any>;
+        functions: Record<string, import("@markdoc/markdoc").ConfigFunction>;
+        partials: Record<string, any>;
+        validation?: {
+            validateFunctions?: boolean | undefined;
+        } | undefined;
+    }>>;
+    fileUrl: URL;
+} | undefined>;

package/dist/load-config.js

@@ -0,0 +1,82 @@
+import { build as esbuild } from "esbuild";
+import * as fs from "node:fs";
+import { fileURLToPath } from "node:url";
+const SUPPORTED_MARKDOC_CONFIG_FILES = [
+  "markdoc.config.js",
+  "markdoc.config.mjs",
+  "markdoc.config.mts",
+  "markdoc.config.ts"
+];
+async function loadMarkdocConfig(astroConfig) {
+  let markdocConfigUrl;
+  for (const filename of SUPPORTED_MARKDOC_CONFIG_FILES) {
+    const filePath = new URL(filename, astroConfig.root);
+    if (!fs.existsSync(filePath))
+      continue;
+    markdocConfigUrl = filePath;
+    break;
+  }
+  if (!markdocConfigUrl)
+    return;
+  const { code, dependencies } = await bundleConfigFile({
+    markdocConfigUrl,
+    astroConfig
+  });
+  const config = await loadConfigFromBundledFile(astroConfig.root, code);
+  return {
+    config,
+    fileUrl: markdocConfigUrl
+  };
+}
+async function bundleConfigFile({
+  markdocConfigUrl,
+  astroConfig
+}) {
+  const result = await esbuild({
+    absWorkingDir: fileURLToPath(astroConfig.root),
+    entryPoints: [fileURLToPath(markdocConfigUrl)],
+    outfile: "out.js",
+    write: false,
+    target: ["node16"],
+    platform: "node",
+    packages: "external",
+    bundle: true,
+    format: "esm",
+    sourcemap: "inline",
+    metafile: true,
+    plugins: [
+      {
+        name: "stub-astro-imports",
+        setup(build) {
+          build.onResolve({ filter: /.*\.astro$/ }, () => {
+            return {
+              // Stub with an unused default export
+              path: "data:text/javascript,export default true",
+              external: true
+            };
+          });
+        }
+      }
+    ]
+  });
+  const { text } = result.outputFiles[0];
+  return {
+    code: text,
+    dependencies: result.metafile ? Object.keys(result.metafile.inputs) : []
+  };
+}
+async function loadConfigFromBundledFile(root, code) {
+  const tmpFileUrl = new URL(`markdoc.config.timestamp-${Date.now()}.mjs`, root);
+  fs.writeFileSync(tmpFileUrl, code);
+  try {
+    return (await import(tmpFileUrl.pathname)).default;
+  } finally {
+    try {
+      fs.unlinkSync(tmpFileUrl);
+    } catch {
+    }
+  }
+}
+export {
+  loadMarkdocConfig
+};

package/dist/utils.d.ts

@@ -0,0 +1,40 @@
+import matter from 'gray-matter';
+/**
+ * Match YAML exception handling from Astro core errors
+ * @see 'astro/src/core/errors.ts'
+ */
+export declare function parseFrontmatter(fileContents: string, filePath: string): matter.GrayMatterFile<string>;
+/**
+ * Matches AstroError object with types like error codes stubbed out
+ * @see 'astro/src/core/errors/errors.ts'
+ */
+export declare class MarkdocError extends Error {
+    errorCode: number;
+    loc: ErrorLocation | undefined;
+    title: string | undefined;
+    hint: string | undefined;
+    frame: string | undefined;
+    type: string;
+    constructor(props: ErrorProperties, ...params: any);
+}
+interface ErrorLocation {
+    file?: string;
+    line?: number;
+    column?: number;
+}
+interface ErrorProperties {
+    code?: number;
+    title?: string;
+    name?: string;
+    message?: string;
+    location?: ErrorLocation;
+    hint?: string;
+    stack?: string;
+    frame?: string;
+}
+/**
+ * @see 'astro/src/core/path.ts'
+ */
+export declare function prependForwardSlash(str: string): string;
+export declare function isValidUrl(str: string): boolean;
+export {};

package/dist/utils.js

@@ -0,0 +1,60 @@
+import matter from "gray-matter";
+function parseFrontmatter(fileContents, filePath) {
+  try {
+    matter.clearCache();
+    return matter(fileContents);
+  } catch (e) {
+    if (e.name === "YAMLException") {
+      const err = e;
+      err.id = filePath;
+      err.loc = { file: e.id, line: e.mark.line + 1, column: e.mark.column };
+      err.message = e.reason;
+      throw err;
+    } else {
+      throw e;
+    }
+  }
+}
+class MarkdocError extends Error {
+  constructor(props, ...params) {
+    super(...params);
+    this.type = "MarkdocError";
+    const {
+      // Use default code for unknown errors in Astro core
+      // We don't have a best practice for integration error codes yet
+      code = 99999,
+      name,
+      title = "MarkdocError",
+      message,
+      stack,
+      location,
+      hint,
+      frame
+    } = props;
+    this.errorCode = code;
+    this.title = title;
+    if (message)
+      this.message = message;
+    this.stack = stack ? stack : this.stack;
+    this.loc = location;
+    this.hint = hint;
+    this.frame = frame;
+  }
+}
+function prependForwardSlash(str) {
+  return str[0] === "/" ? str : "/" + str;
+}
+function isValidUrl(str) {
+  try {
+    new URL(str);
+    return true;
+  } catch {
+    return false;
+  }
+}
+export {
+  MarkdocError,
+  isValidUrl,
+  parseFrontmatter,
+  prependForwardSlash
+};

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "@astrojs/markdoc",
+  "description": "Add support for Markdoc pages in your Astro site",
+  "version": "0.0.0-data-collections-20230418125011",
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "author": "withastro",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/withastro/astro.git",
+    "directory": "packages/integrations/markdoc"
+  },
+  "keywords": [
+    "astro-integration",
+    "astro-component",
+    "markdoc"
+  ],
+  "bugs": "https://github.com/withastro/astro/issues",
+  "homepage": "https://docs.astro.build/en/guides/integrations-guide/markdoc/",
+  "exports": {
+    ".": "./dist/index.js",
+    "./components": "./components/index.ts",
+    "./default-config": "./dist/default-config.js",
+    "./config": "./dist/config.js",
+    "./experimental-assets-config": "./dist/experimental-assets-config.js",
+    "./package.json": "./package.json"
+  },
+  "dependencies": {
+    "@markdoc/markdoc": "^0.2.2",
+    "esbuild": "^0.17.12",
+    "gray-matter": "^4.0.3",
+    "kleur": "^4.1.5",
+    "zod": "^3.17.3"
+  },
+  "peerDependencies": {
+    "astro": "0.0.0-data-collections-20230418125011"
+  },
+  "devDependencies": {
+    "@types/chai": "^4.3.1",
+    "@types/html-escaper": "^3.0.0",
+    "@types/mocha": "^9.1.1",
+    "chai": "^4.3.6",
+    "devalue": "^4.2.0",
+    "linkedom": "^0.14.12",
+    "mocha": "^9.2.2",
+    "rollup": "^3.20.1",
+    "vite": "^4.0.3",
+    "astro": "0.0.0-data-collections-20230418125011",
+    "astro-scripts": "0.0.14"
+  },
+  "engines": {
+    "node": ">=16.12.0"
+  },
+  "scripts": {
+    "build": "astro-scripts build \"src/**/*.ts\" && tsc",
+    "build:ci": "astro-scripts build \"src/**/*.ts\"",
+    "dev": "astro-scripts dev \"src/**/*.ts\"",
+    "test": "mocha --exit --timeout 20000",
+    "test:match": "mocha --timeout 20000 -g"
+  }
+}

package/src/config.ts

@@ -0,0 +1,5 @@
+import type { ConfigType as MarkdocConfig } from '@markdoc/markdoc';
+
+export function defineMarkdocConfig(config: MarkdocConfig): MarkdocConfig {
+	return config;
+}

package/src/default-config.ts

@@ -0,0 +1,18 @@
+import type { ConfigType as MarkdocConfig } from '@markdoc/markdoc';
+import type { ContentEntryModule } from 'astro';
+
+export function applyDefaultConfig(
+	config: MarkdocConfig,
+	ctx: {
+		entry: ContentEntryModule;
+	}
+): MarkdocConfig {
+	return {
+		...config,
+		variables: {
+			entry: ctx.entry,
+			...config.variables,
+		},
+		// TODO: heading ID calculation, Shiki syntax highlighting
+	};
+}

package/src/experimental-assets-config.ts

@@ -0,0 +1,29 @@
+import type { Config as MarkdocConfig } from '@markdoc/markdoc';
+import Markdoc from '@markdoc/markdoc';
+//@ts-expect-error Cannot find module 'astro:assets' or its corresponding type declarations.
+import { Image } from 'astro:assets';
+
+// Separate module to only import `astro:assets` when
+// `experimental.assets` flag is set in a project.
+// TODO: merge with `./default-config.ts` when `experimental.assets` is baselined.
+export const experimentalAssetsConfig: MarkdocConfig = {
+	nodes: {
+		image: {
+			attributes: {
+				...Markdoc.nodes.image.attributes,
+				__optimizedSrc: { type: 'Object' },
+			},
+			transform(node, config) {
+				const attributes = node.transformAttributes(config);
+				const children = node.transformChildren(config);
+
+				if (node.type === 'image' && '__optimizedSrc' in node.attributes) {
+					const { __optimizedSrc, ...rest } = node.attributes;
+					return new Markdoc.Tag(Image, { ...rest, src: __optimizedSrc }, children);
+				} else {
+					return new Markdoc.Tag('img', attributes, children);
+				}
+			},
+		},
+	},
+};

package/src/index.ts

@@ -0,0 +1,164 @@
+import type { Node } from '@markdoc/markdoc';
+import Markdoc from '@markdoc/markdoc';
+import type { AstroConfig, AstroIntegration, ContentEntryType, HookParameters } from 'astro';
+import fs from 'node:fs';
+import { fileURLToPath } from 'node:url';
+import { isValidUrl, MarkdocError, parseFrontmatter, prependForwardSlash } from './utils.js';
+// @ts-expect-error Cannot find module 'astro/assets' or its corresponding type declarations.
+import { emitESMImage } from 'astro/assets';
+import { bold, red } from 'kleur/colors';
+import type * as rollup from 'rollup';
+import { applyDefaultConfig } from './default-config.js';
+import { loadMarkdocConfig } from './load-config.js';
+
+type SetupHookParams = HookParameters<'astro:config:setup'> & {
+	// `contentEntryType` is not a public API
+	// Add type defs here
+	addContentEntryType: (contentEntryType: ContentEntryType) => void;
+};
+
+export default function markdocIntegration(legacyConfig: any): AstroIntegration {
+	if (legacyConfig) {
+		// eslint-disable-next-line no-console
+		console.log(
+			`${red(
+				bold('[Markdoc]')
+			)} Passing Markdoc config from your \`astro.config\` is no longer supported. Configuration should be exported from a \`markdoc.config.mjs\` file. See the configuration docs for more: https://docs.astro.build/en/guides/integrations-guide/markdoc/#configuration`
+		);
+		process.exit(0);
+	}
+	return {
+		name: '@astrojs/markdoc',
+		hooks: {
+			'astro:config:setup': async (params) => {
+				const { config: astroConfig, addContentEntryType } = params as SetupHookParams;
+
+				const configLoadResult = await loadMarkdocConfig(astroConfig);
+				const userMarkdocConfig = configLoadResult?.config ?? {};
+
+				function getEntryInfo({ fileUrl, contents }: { fileUrl: URL; contents: string }) {
+					const parsed = parseFrontmatter(contents, fileURLToPath(fileUrl));
+					return {
+						data: parsed.data,
+						body: parsed.content,
+						slug: parsed.data.slug,
+						rawData: parsed.matter,
+					};
+				}
+				addContentEntryType({
+					extensions: ['.mdoc'],
+					getEntryInfo,
+					async getRenderModule({ entry, viteId }) {
+						const ast = Markdoc.parse(entry.body);
+						const pluginContext = this;
+						const markdocConfig = applyDefaultConfig(userMarkdocConfig, { entry });
+
+						const validationErrors = Markdoc.validate(ast, markdocConfig).filter((e) => {
+							// Ignore `variable-undefined` errors.
+							// Variables can be configured at runtime,
+							// so we cannot validate them at build time.
+							return e.error.id !== 'variable-undefined';
+						});
+						if (validationErrors.length) {
+							throw new MarkdocError({
+								message: [
+									`**${String(entry.collection)} → ${String(entry.id)}** failed to validate:`,
+									...validationErrors.map((e) => e.error.id),
+								].join('\n'),
+							});
+						}
+
+						if (astroConfig.experimental.assets) {
+							await emitOptimizedImages(ast.children, {
+								astroConfig,
+								pluginContext,
+								filePath: entry._internal.filePath,
+							});
+						}
+
+						const code = {
+							code: `import { jsx as h } from 'astro/jsx-runtime';
+import { applyDefaultConfig } from '@astrojs/markdoc/default-config';
+import { Renderer } from '@astrojs/markdoc/components';
+import * as entry from ${JSON.stringify(viteId + '?astroContentCollectionEntry')};${
+								configLoadResult
+									? `\nimport userConfig from ${JSON.stringify(configLoadResult.fileUrl.pathname)};`
+									: ''
+							}${
+								astroConfig.experimental.assets
+									? `\nimport { experimentalAssetsConfig } from '@astrojs/markdoc/experimental-assets-config';`
+									: ''
+							}
+const stringifiedAst = ${JSON.stringify(
+								/* Double stringify to encode *as* stringified JSON */ JSON.stringify(ast)
+							)};
+export async function Content (props) {
+	const config = applyDefaultConfig(${
+		configLoadResult
+			? '{ ...userConfig, variables: { ...userConfig.variables, ...props } }'
+			: '{ variables: props }'
+	}, { entry });${
+								astroConfig.experimental.assets
+									? `\nconfig.nodes = { ...experimentalAssetsConfig.nodes, ...config.nodes };`
+									: ''
+							}
+	return h(Renderer, { stringifiedAst, config }); };`,
+						};
+						return code;
+					},
+					contentModuleTypes: await fs.promises.readFile(
+						new URL('../template/content-module-types.d.ts', import.meta.url),
+						'utf-8'
+					),
+				});
+			},
+		},
+	};
+}
+
+/**
+ * Emits optimized images, and appends the generated `src` to each AST node
+ * via the `__optimizedSrc` attribute.
+ */
+async function emitOptimizedImages(
+	nodeChildren: Node[],
+	ctx: {
+		pluginContext: rollup.PluginContext;
+		filePath: string;
+		astroConfig: AstroConfig;
+	}
+) {
+	for (const node of nodeChildren) {
+		if (
+			node.type === 'image' &&
+			typeof node.attributes.src === 'string' &&
+			shouldOptimizeImage(node.attributes.src)
+		) {
+			// Attempt to resolve source with Vite.
+			// This handles relative paths and configured aliases
+			const resolved = await ctx.pluginContext.resolve(node.attributes.src, ctx.filePath);
+
+			if (resolved?.id && fs.existsSync(new URL(prependForwardSlash(resolved.id), 'file://'))) {
+				const src = await emitESMImage(
+					resolved.id,
+					ctx.pluginContext.meta.watchMode,
+					ctx.pluginContext.emitFile,
+					{ config: ctx.astroConfig }
+				);
+				node.attributes.__optimizedSrc = src;
+			} else {
+				throw new MarkdocError({
+					message: `Could not resolve image ${JSON.stringify(
+						node.attributes.src
+					)} from ${JSON.stringify(ctx.filePath)}. Does the file exist?`,
+				});
+			}
+		}
+		await emitOptimizedImages(node.children, ctx);
+	}
+}
+
+function shouldOptimizeImage(src: string) {
+	// Optimize anything that is NOT external or an absolute path to `public/`
+	return !isValidUrl(src) && !src.startsWith('/');
+}