@astrojs/mdx 1.0.0-beta.2 → 1.0.0

package/dist/rehype-optimize-static.js

@@ -0,0 +1,62 @@
+import { visit } from "estree-util-visit";
+import { toHtml } from "hast-util-to-html";
+const exportConstComponentsRe = /export\s+const\s+components\s*=/;
+function rehypeOptimizeStatic(options) {
+  return (tree) => {
+    const customComponentNames = new Set(options?.customComponentNames);
+    for (const child of tree.children) {
+      if (child.type === "mdxjsEsm" && exportConstComponentsRe.test(child.value)) {
+        const objectPropertyNodes = child.data.estree.body[0]?.declarations?.[0]?.init?.properties;
+        if (objectPropertyNodes) {
+          for (const objectPropertyNode of objectPropertyNodes) {
+            const componentName = objectPropertyNode.key?.name ?? objectPropertyNode.key?.value;
+            if (componentName) {
+              customComponentNames.add(componentName);
+            }
+          }
+        }
+      }
+    }
+    const allPossibleElements = /* @__PURE__ */ new Set();
+    const elementStack = [];
+    visit(tree, {
+      enter(node) {
+        const isCustomComponent = node.tagName && customComponentNames.has(node.tagName);
+        if (node.type.startsWith("mdx") || isCustomComponent) {
+          for (const el of elementStack) {
+            allPossibleElements.delete(el);
+          }
+          elementStack.length = 0;
+        }
+        if (node.type === "element" || node.type === "mdxJsxFlowElement") {
+          elementStack.push(node);
+          allPossibleElements.add(node);
+        }
+      },
+      leave(node, _, __, parents) {
+        if (node.type === "element" || node.type === "mdxJsxFlowElement") {
+          elementStack.pop();
+          const parent = parents[parents.length - 1];
+          if (allPossibleElements.has(parent)) {
+            allPossibleElements.delete(node);
+          }
+        }
+      }
+    });
+    for (const el of allPossibleElements) {
+      if (el.type === "mdxJsxFlowElement") {
+        el.attributes.push({
+          type: "mdxJsxAttribute",
+          name: "set:html",
+          value: toHtml(el.children)
+        });
+      } else {
+        el.properties["set:html"] = toHtml(el.children);
+      }
+      el.children = [];
+    }
+  };
+}
+export {
+  rehypeOptimizeStatic
+};

package/dist/remark-images-to-component.d.ts

@@ -0,0 +1,2 @@
+import type { MarkdownVFile } from '@astrojs/markdown-remark';
+export declare function remarkImageToComponent(): (tree: any, file: MarkdownVFile) => void;

package/dist/remark-images-to-component.js

@@ -0,0 +1,83 @@
+import { visit } from "unist-util-visit";
+import { jsToTreeNode } from "./utils.js";
+function remarkImageToComponent() {
+  return function(tree, file) {
+    if (!file.data.imagePaths)
+      return;
+    const importsStatements = [];
+    const importedImages = /* @__PURE__ */ new Map();
+    visit(tree, "image", (node, index, parent) => {
+      if (file.data.imagePaths?.has(node.url)) {
+        let importName = importedImages.get(node.url);
+        if (!importName) {
+          importName = `__${importedImages.size}_${node.url.replace(/\W/g, "_")}__`;
+          importsStatements.push({
+            type: "mdxjsEsm",
+            value: "",
+            data: {
+              estree: {
+                type: "Program",
+                sourceType: "module",
+                body: [
+                  {
+                    type: "ImportDeclaration",
+                    source: { type: "Literal", value: node.url, raw: JSON.stringify(node.url) },
+                    specifiers: [
+                      {
+                        type: "ImportDefaultSpecifier",
+                        local: { type: "Identifier", name: importName }
+                      }
+                    ]
+                  }
+                ]
+              }
+            }
+          });
+          importedImages.set(node.url, importName);
+        }
+        const componentElement = {
+          name: "__AstroImage__",
+          type: "mdxJsxFlowElement",
+          attributes: [
+            {
+              name: "src",
+              type: "mdxJsxAttribute",
+              value: {
+                type: "mdxJsxAttributeValueExpression",
+                value: importName,
+                data: {
+                  estree: {
+                    type: "Program",
+                    sourceType: "module",
+                    comments: [],
+                    body: [
+                      {
+                        type: "ExpressionStatement",
+                        expression: { type: "Identifier", name: importName }
+                      }
+                    ]
+                  }
+                }
+              }
+            },
+            { name: "alt", type: "mdxJsxAttribute", value: node.alt || "" }
+          ],
+          children: []
+        };
+        if (node.title) {
+          componentElement.attributes.push({
+            type: "mdxJsxAttribute",
+            name: "title",
+            value: node.title
+          });
+        }
+        parent.children.splice(index, 1, componentElement);
+      }
+    });
+    tree.children.unshift(...importsStatements);
+    tree.children.unshift(jsToTreeNode(`import { Image as __AstroImage__ } from "astro:assets";`));
+  };
+}
+export {
+  remarkImageToComponent
+};

package/dist/utils.d.ts

@@ -1,3 +1,4 @@
+import type { PluggableList } from '@mdx-js/mdx/lib/core.js';
 import type { Options as AcornOpts } from 'acorn';
 import type { AstroConfig } from 'astro';
 import matter from 'gray-matter';
@@ -14,5 +15,5 @@ export declare function getFileInfo(id: string, config: AstroConfig): FileInfo;
  */
 export declare function parseFrontmatter(code: string, id: string): matter.GrayMatterFile<string>;
 export declare function jsToTreeNode(jsString: string, acornOpts?: AcornOpts): MdxjsEsm;
-export declare function isRelativePath(path: string): boolean;
+export declare function ignoreStringPlugins(plugins: any[]): PluggableList;
 export {};

package/dist/utils.js

@@ -1,5 +1,6 @@
 import { parse } from "acorn";
 import matter from "gray-matter";
+import { bold, yellow } from "kleur/colors";
 function appendForwardSlash(path) {
   return path.endsWith("/") ? path : path + "/";
 }
@@ -17,7 +18,7 @@ function getFileInfo(id, config) {
   const isPage = fileId.includes("/pages/");
   if (isPage) {
     fileUrl = fileId.replace(/^.*?\/pages\//, sitePathname).replace(/(\/index)?\.mdx$/, "");
-  } else if (url && url.pathname.startsWith(config.root.pathname)) {
+  } else if (url?.pathname.startsWith(config.root.pathname)) {
     fileUrl = url.pathname.slice(config.root.pathname.length);
   } else {
     fileUrl = fileId;
@@ -59,23 +60,30 @@ function jsToTreeNode(jsString, acornOpts = {
     }
   };
 }
-function isRelativePath(path) {
-  return startsWithDotDotSlash(path) || startsWithDotSlash(path);
-}
-function startsWithDotDotSlash(path) {
-  const c1 = path[0];
-  const c2 = path[1];
-  const c3 = path[2];
-  return c1 === "." && c2 === "." && c3 === "/";
-}
-function startsWithDotSlash(path) {
-  const c1 = path[0];
-  const c2 = path[1];
-  return c1 === "." && c2 === "/";
+function ignoreStringPlugins(plugins) {
+  let validPlugins = [];
+  let hasInvalidPlugin = false;
+  for (const plugin of plugins) {
+    if (typeof plugin === "string") {
+      console.warn(yellow(`[MDX] ${bold(plugin)} not applied.`));
+      hasInvalidPlugin = true;
+    } else if (Array.isArray(plugin) && typeof plugin[0] === "string") {
+      console.warn(yellow(`[MDX] ${bold(plugin[0])} not applied.`));
+      hasInvalidPlugin = true;
+    } else {
+      validPlugins.push(plugin);
+    }
+  }
+  if (hasInvalidPlugin) {
+    console.warn(
+      `To inherit Markdown plugins in MDX, please use explicit imports in your config instead of "strings." See Markdown docs: https://docs.astro.build/en/guides/markdown-content/#markdown-plugins`
+    );
+  }
+  return validPlugins;
 }
 export {
   getFileInfo,
-  isRelativePath,
+  ignoreStringPlugins,
   jsToTreeNode,
   parseFrontmatter
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@astrojs/mdx",
-  "description": "Use MDX within Astro",
-  "version": "1.0.0-beta.2",
+  "description": "Add support for MDX pages in your Astro site",
+  "version": "1.0.0",
   "type": "module",
   "types": "./dist/index.d.ts",
   "author": "withastro",
@@ -22,49 +22,58 @@
     ".": "./dist/index.js",
     "./package.json": "./package.json"
   },
+  "files": [
+    "dist",
+    "template"
+  ],
   "dependencies": {
-    "@astrojs/markdown-remark": "^2.0.0-beta.2",
-    "@astrojs/prism": "^2.0.0-beta.0",
-    "@mdx-js/mdx": "^2.1.2",
-    "@mdx-js/rollup": "^2.1.1",
-    "acorn": "^8.8.0",
-    "es-module-lexer": "^0.10.5",
-    "estree-util-visit": "^1.2.0",
-    "github-slugger": "^1.4.0",
+    "@mdx-js/mdx": "^2.3.0",
+    "acorn": "^8.10.0",
+    "es-module-lexer": "^1.3.0",
+    "estree-util-visit": "^1.2.1",
+    "github-slugger": "^2.0.0",
     "gray-matter": "^4.0.3",
+    "hast-util-to-html": "^8.0.4",
     "kleur": "^4.1.4",
     "rehype-raw": "^6.1.1",
     "remark-frontmatter": "^4.0.1",
     "remark-gfm": "^3.0.1",
     "remark-smartypants": "^2.0.0",
-    "shiki": "^0.11.1",
-    "unist-util-visit": "^4.1.0",
-    "vfile": "^5.3.2"
+    "shiki": "^0.14.3",
+    "source-map": "^0.7.4",
+    "unist-util-visit": "^4.1.2",
+    "vfile": "^5.3.7",
+    "@astrojs/markdown-remark": "3.0.0",
+    "@astrojs/prism": "3.0.0"
+  },
+  "peerDependencies": {
+    "astro": "^3.0.0"
   },
   "devDependencies": {
-    "@types/chai": "^4.3.1",
-    "@types/estree": "^1.0.0",
-    "@types/github-slugger": "^1.3.0",
-    "@types/mdast": "^3.0.10",
-    "@types/mocha": "^9.1.1",
+    "@types/chai": "^4.3.5",
+    "@types/estree": "^1.0.1",
+    "@types/mdast": "^3.0.12",
+    "@types/mocha": "^10.0.1",
     "@types/yargs-parser": "^21.0.0",
-    "astro": "2.0.0-beta.2",
-    "astro-scripts": "0.0.10-beta.0",
-    "chai": "^4.3.6",
-    "cheerio": "^1.0.0-rc.11",
-    "linkedom": "^0.14.12",
-    "mdast-util-mdx": "^2.0.0",
-    "mdast-util-to-string": "^3.1.0",
-    "mocha": "^9.2.2",
+    "chai": "^4.3.7",
+    "cheerio": "1.0.0-rc.12",
+    "linkedom": "^0.15.1",
+    "mdast-util-mdx": "^2.0.1",
+    "mdast-util-to-string": "^3.2.0",
+    "mocha": "^10.2.0",
     "reading-time": "^1.5.0",
-    "rehype-pretty-code": "^0.4.0",
+    "rehype-mathjax": "^4.0.3",
+    "rehype-pretty-code": "^0.10.0",
+    "remark-math": "^5.1.1",
     "remark-rehype": "^10.1.0",
-    "remark-shiki-twoslash": "^3.1.0",
+    "remark-shiki-twoslash": "^3.1.3",
     "remark-toc": "^8.0.1",
-    "vite": "^4.0.3"
+    "vite": "^4.4.9",
+    "astro": "3.0.0",
+    "astro-scripts": "0.0.14"
   },
   "engines": {
-    "node": ">=16.12.0"
+    "node": ">=18.14.1"
   },
   "scripts": {
     "build": "astro-scripts build \"src/**/*.ts\" && tsc",

package/template/content-module-types.d.ts

@@ -0,0 +1,9 @@
+declare module 'astro:content' {
+	interface Render {
+		'.mdx': Promise<{
+			Content: import('astro').MarkdownInstance<{}>['Content'];
+			headings: import('astro').MarkdownHeading[];
+			remarkPluginFrontmatter: Record<string, any>;
+		}>;
+	}
+}

package/.turbo/turbo-build.log

@@ -1,5 +0,0 @@
-@astrojs/mdx:build: cache hit, replaying output e3662492a73790a4
-@astrojs/mdx:build: 
-@astrojs/mdx:build: > @astrojs/mdx@1.0.0-beta.2 build /home/runner/work/astro/astro/packages/integrations/mdx
-@astrojs/mdx:build: > astro-scripts build "src/**/*.ts" && tsc
-@astrojs/mdx:build: