@astrojs/mdx 0.0.0-rc-20220721064837

package/.turbo/turbo-build.log

@@ -0,0 +1,5 @@
+@astrojs/mdx:build: cache hit, replaying output 3b9c619d3889cd87
+@astrojs/mdx:build: 
+@astrojs/mdx:build: > @astrojs/mdx@0.2.1 build /Users/fks/Code/astro/packages/integrations/mdx
+@astrojs/mdx:build: > astro-scripts build "src/**/*.ts" && tsc
+@astrojs/mdx:build: 

package/.turbo/turbo-test.log

@@ -0,0 +1 @@
+@astrojs/mdx:test: cache hit, replaying output 2250434e5c0f5a46

package/CHANGELOG.md

@@ -0,0 +1,49 @@
+# @astrojs/mdx
+
+## 0.0.0-rc-20220721064837
+
+### Minor Changes
+
+- [#3977](https://github.com/withastro/astro/pull/3977) [`19433eb4a`](https://github.com/withastro/astro/commit/19433eb4a4441522f68492ca914ad2ab4f061343) Thanks [@bholmesdev](https://github.com/bholmesdev)! - Add remarkPlugins and rehypePlugins to config, with the same default plugins as our standard Markdown parser
+
+* [#3995](https://github.com/withastro/astro/pull/3995) [`b2b367c96`](https://github.com/withastro/astro/commit/b2b367c969493aaf21c974064beb241d05228066) Thanks [@bholmesdev](https://github.com/bholmesdev)! - Support YAML frontmatter in MDX files
+
+### Patch Changes
+
+- [#3981](https://github.com/withastro/astro/pull/3981) [`61fec6304`](https://github.com/withastro/astro/commit/61fec63044e1585348e8405bee6fdf4dec635efa) Thanks [@bholmesdev](https://github.com/bholmesdev)! - Include page url in MDX glob result
+
+## 0.2.1
+
+### Patch Changes
+
+- [#3937](https://github.com/withastro/astro/pull/3937) [`31f9c0bf0`](https://github.com/withastro/astro/commit/31f9c0bf029ffa4b470e620f2c32e1370643e81e) Thanks [@delucis](https://github.com/delucis)! - Roll back supported Node engines
+
+## 0.2.0
+
+### Minor Changes
+
+- [#3914](https://github.com/withastro/astro/pull/3914) [`b48767985`](https://github.com/withastro/astro/commit/b48767985359bd359df8071324952ea5f2bc0d86) Thanks [@ran-dall](https://github.com/ran-dall)! - Rollback supported `node@16` version. Minimum versions are now `node@14.20.0` or `node@16.14.0`.
+
+## 0.1.1
+
+### Patch Changes
+
+- [#3885](https://github.com/withastro/astro/pull/3885) [`bf5d1cc1e`](https://github.com/withastro/astro/commit/bf5d1cc1e71da38a14658c615e9481f2145cc6e7) Thanks [@delucis](https://github.com/delucis)! - Integration README fixes
+
+## 0.1.0
+
+### Minor Changes
+
+- [#3871](https://github.com/withastro/astro/pull/3871) [`1cc5b7890`](https://github.com/withastro/astro/commit/1cc5b78905633608e5b07ad291f916f54e67feb1) Thanks [@natemoo-re](https://github.com/natemoo-re)! - Update supported `node` versions. Minimum versions are now `node@14.20.0` or `node@16.16.0`.
+
+## 0.0.3
+
+### Patch Changes
+
+- [#3854](https://github.com/withastro/astro/pull/3854) [`b012ee55`](https://github.com/withastro/astro/commit/b012ee55b107dea0730286263b27d83e530fad5d) Thanks [@bholmesdev](https://github.com/bholmesdev)! - [astro add] Support adapters and third party packages
+
+## 0.0.2
+
+### Patch Changes
+
+- [#3706](https://github.com/withastro/astro/pull/3706) [`032ad1c0`](https://github.com/withastro/astro/commit/032ad1c047a62dd663067cc562537d16f2872aa7) Thanks [@natemoo-re](https://github.com/natemoo-re)! - Initial release! 🎉

package/LICENSE

@@ -0,0 +1,61 @@
+MIT License
+
+Copyright (c) 2021 Fred K. Schott
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+
+"""
+This license applies to parts of the `packages/create-astro` and `packages/astro` subdirectories originating from the https://github.com/sveltejs/kit repository:
+
+Copyright (c) 2020 [these people](https://github.com/sveltejs/kit/graphs/contributors)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+"""
+
+
+"""
+This license applies to parts of the `packages/create-astro` and `packages/astro` subdirectories originating from the https://github.com/vitejs/vite repository:
+
+MIT License
+
+Copyright (c) 2019-present, Yuxi (Evan) You and Vite contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+"""

package/README.md

@@ -0,0 +1,249 @@
+# @astrojs/mdx 📝
+
+This **[Astro integration][astro-integration]** enables the usage of [MDX](https://mdxjs.com/) components and allows you to create pages as `.mdx` files.
+
+- <strong>[Why MDX?](#why-mdx)</strong>
+- <strong>[Installation](#installation)</strong>
+- <strong>[Usage](#usage)</strong>
+- <strong>[Configuration](#configuration)</strong>
+- <strong>[Examples](#examples)</strong>
+- <strong>[Troubleshooting](#troubleshooting)</strong>
+- <strong>[Contributing](#contributing)</strong>
+- <strong>[Changelog](#changelog)</strong>
+
+## Why MDX?
+
+MDX is the defacto solution for embedding components, such as interactive charts or alerts, within Markdown content. If you have existing content authored in MDX, this integration makes migrating to Astro a breeze.
+
+**Want to learn more about MDX before using this integration?**  
+Check out [“What is MDX?”](https://mdxjs.com/docs/what-is-mdx/), a deep-dive on the MDX format.
+
+## Installation
+
+<details>
+  <summary>Quick Install</summary>
+
+The `astro add` command-line tool automates the installation for you. Run one of the following commands in a new terminal window. (If you aren't sure which package manager you're using, run the first command.) Then, follow the prompts, and type "y" in the terminal (meaning "yes") for each one.
+
+  ```sh
+  # Using NPM
+  npx astro add mdx
+  # Using Yarn
+  yarn astro add mdx
+  # Using PNPM
+  pnpx astro add mdx
+  ```
+
+Then, restart the dev server by typing `CTRL-C` and then `npm run astro dev` in the terminal window that was running Astro.
+
+Because this command is new, it might not properly set things up. If that happens, [feel free to log an issue on our GitHub](https://github.com/withastro/astro/issues) and try the manual installation steps below.
+</details>
+
+<details>
+  <summary>Manual Install</summary>
+
+First, install the `@astrojs/mdx` package using your package manager. If you're using npm or aren't sure, run this in the terminal:
+
+  ```sh
+  npm install @astrojs/mdx
+  ```
+
+Then, apply this integration to your `astro.config.*` file using the `integrations` property:
+
+__`astro.config.mjs`__
+
+```js
+import { defineConfig } from 'astro/config';
+import mdx from '@astrojs/mdx';
+
+export default defineConfig({
+  // ...
+  integrations: [mdx()],
+});
+```
+
+Finally, restart the dev server.
+</details>
+
+## Usage
+
+To write your first MDX page in Astro, head to our [UI framework documentation][astro-ui-frameworks]. You'll explore:
+- 📦 how framework components are loaded,
+- 💧 client-side hydration options, and
+- 🪆 opportunities to mix and nest frameworks together
+
+[**Client Directives**](https://docs.astro.build/en/reference/directives-reference/#client-directives) are still required in `.mdx` files.
+
+> **Note**: `.mdx` files adhere to strict JSX syntax rather than Astro's HTML-like syntax.
+
+Also check our [Astro Integration Documentation][astro-integration] for more on integrations.
+
+### Variables
+
+MDX supports `export` statements to add variables to your templates. These variables are accessible both from the template itself _and_ as named properties when importing the template somewhere else.
+
+For instance, you can export a `title` field from an MDX page or component to use as a heading with `{JSX expressions}`:
+
+```mdx
+export const title = 'My first MDX post'
+
+# {title}
+```
+
+This `title` will be accessible from `import` and [glob](https://docs.astro.build/en/reference/api-reference/#astroglob) statements as well:
+
+```astro
+---
+// src/pages/index.astro
+const posts = await Astro.glob('./*.mdx');
+---
+
+{posts.map(post => <p>{post.title}</p>)}
+```
+
+See [the official "how MDX works" guide](https://mdxjs.com/docs/using-mdx/#how-mdx-works) for more on MDX variables.
+
+### Frontmatter
+
+Astro also supports YAML-based frontmatter out-of-the-box using the [remark-mdx-frontmatter](https://github.com/remcohaszing/remark-mdx-frontmatter) plugin. By default, all variables declared in a frontmatter fence (`---`) will be accessible via the `frontmatter` export. See the `frontmatterOptions` configuration to customize this behavior.
+
+For example, we can add a `title` and `publishDate` to an MDX page or component like so:
+
+```mdx
+---
+title: 'My first MDX post'
+publishDate: '21 September 2022'
+---
+
+# {frontmatter.title}
+```
+
+Now, this `title` and `publishDate` will be accessible from `import` and [glob](https://docs.astro.build/en/reference/api-reference/#astroglob) statements via the `frontmatter` property. This matches the behavior of [plain markdown in Astro](https://docs.astro.build/en/reference/api-reference/#markdown-files) as well!
+
+```astro
+---
+// src/pages/index.astro
+const posts = await Astro.glob('./*.mdx');
+---
+
+{posts.map(post => (
+  <Fragment>
+    <h2>{post.frontmatter.title}</h2>
+    <time>{post.frontmatter.publishDate}</time>
+  </Fragment>
+))}
+```
+
+## Configuration
+
+<details>
+  <summary><strong>remarkPlugins</strong></summary>
+
+**Default plugins:** [remark-gfm](https://github.com/remarkjs/remark-gfm), [remark-smartypants](https://github.com/silvenon/remark-smartypants)
+
+[Remark plugins](https://github.com/remarkjs/remark/blob/main/doc/plugins.md) allow you to extend your Markdown with new capabilities. This includes [auto-generating a table of contents](https://github.com/remarkjs/remark-toc), [applying accessible emoji labels](https://github.com/florianeckerstorfer/remark-a11y-emoji), and more. We encourage you to browse [awesome-remark](https://github.com/remarkjs/awesome-remark) for a full curated list!
+
+We apply [GitHub-flavored Markdown](https://github.com/remarkjs/remark-gfm) and [Smartypants](https://github.com/silvenon/remark-smartypants) by default. This brings some niceties like auto-generating clickable links from text (ex. `https://example.com`) and formatting quotes for readability. When applying your own plugins, you can choose to preserve or remove these defaults.
+
+To apply plugins _while preserving_ Astro's default plugins, use a nested `extends` object like so:
+
+```js
+// astro.config.mjs
+import remarkToc from 'remark-toc';
+
+export default {
+  integrations: [mdx({
+    // apply remark-toc alongside GitHub-flavored markdown and Smartypants
+    remarkPlugins: { extends: [remarkToc] },
+  })],
+}
+```
+
+To apply plugins _without_ Astro's defaults, you can apply a plain array:
+
+```js
+// astro.config.mjs
+import remarkToc from 'remark-toc';
+
+export default {
+  integrations: [mdx({
+    // apply remark-toc alone, removing other defaults
+    remarkPlugins: [remarkToc],
+  })],
+}
+```
+
+</details>
+
+<details>
+  <summary><strong>rehypePlugins</strong></summary>
+
+**Default plugins:** none
+
+[Rehype plugins](https://github.com/rehypejs/rehype/blob/main/doc/plugins.md) allow you to transform the HTML that your Markdown generates. We recommend checking the [Remark plugin](https://github.com/remarkjs/remark/blob/main/doc/plugins.md) catalog first _before_ considering rehype plugins, since most users want to transform their Markdown syntax instead. If HTML transforms are what you need, we encourage you to browse [awesome-rehype](https://github.com/rehypejs/awesome-rehype) for a full curated list of plugins!
+
+To apply rehype plugins, use the `rehypePlugins` configuration option like so:
+
+```js
+// astro.config.mjs
+import rehypeMinifyHtml from 'rehype-minify';
+
+export default {
+  integrations: [mdx({
+    rehypePlugins: [rehypeMinifyHtml],
+  })],
+}
+```
+</details>
+
+<details>
+  <summary><strong>frontmatterOptions</strong></summary>
+
+**Default:** `{ name: 'frontmatter' }`
+
+We use [remark-mdx-frontmatter](https://github.com/remcohaszing/remark-mdx-frontmatter) to parse YAML-based frontmatter in your MDX files. If you want to override our default configuration or extend remark-mdx-frontmatter (ex. to [apply a custom frontmatter parser](https://github.com/remcohaszing/remark-mdx-frontmatter#parsers)), you can supply a `frontmatterOptions` configuration.
+
+For example, say you want to access frontmatter as root-level variables without a nested `frontmatter` object. You can override the [`name` configuration option](https://github.com/remcohaszing/remark-mdx-frontmatter#name) like so:
+
+```js
+// astro.config.mjs
+export default {
+  integrations: [mdx({
+    frontmatterOptions: {
+      name: '',
+    }
+  })],
+}
+```
+
+```mdx
+---
+title: I'm just a variable now!
+---
+
+# {title}
+```
+
+See the [remark-mdx-frontmatter README](https://github.com/remcohaszing/remark-mdx-frontmatter#options) for a complete list of options.
+</details>
+
+## Examples
+
+- The [Astro MDX example](https://github.com/withastro/astro/tree/latest/examples/with-mdx) shows how to use MDX files in your Astro project.
+
+## Troubleshooting
+
+For help, check out the `#support-threads` channel on [Discord](https://astro.build/chat). Our friendly Support Squad members are here to help!
+
+You can also check our [Astro Integration Documentation][astro-integration] for more on integrations.
+
+## Contributing
+
+This package is maintained by Astro's Core team. You're welcome to submit an issue or PR!
+
+## Changelog
+
+See [CHANGELOG.md](CHANGELOG.md) for a history of changes to this integration.
+
+[astro-integration]: https://docs.astro.build/en/guides/integrations-guide/
+[astro-ui-frameworks]: https://docs.astro.build/en/core-concepts/framework-components/#using-framework-components

package/dist/index.d.ts

@@ -0,0 +1,18 @@
+import { Options as MdxRollupPluginOptions } from '@mdx-js/rollup';
+import type { AstroIntegration } from 'astro';
+import type { RemarkMdxFrontmatterOptions } from 'remark-mdx-frontmatter';
+declare type WithExtends<T> = T | {
+    extends: T;
+};
+declare type MdxOptions = {
+    remarkPlugins?: WithExtends<MdxRollupPluginOptions['remarkPlugins']>;
+    rehypePlugins?: WithExtends<MdxRollupPluginOptions['rehypePlugins']>;
+    /**
+     * Configure the remark-mdx-frontmatter plugin
+     * @see https://github.com/remcohaszing/remark-mdx-frontmatter#options for a full list of options
+     * @default {{ name: 'frontmatter' }}
+     */
+    frontmatterOptions?: RemarkMdxFrontmatterOptions;
+};
+export default function mdx(mdxOptions?: MdxOptions): AstroIntegration;
+export {};

package/dist/index.js

@@ -0,0 +1,73 @@
+import mdxPlugin from "@mdx-js/rollup";
+import { parse as parseESM } from "es-module-lexer";
+import remarkFrontmatter from "remark-frontmatter";
+import remarkGfm from "remark-gfm";
+import remarkMdxFrontmatter from "remark-mdx-frontmatter";
+import remarkSmartypants from "remark-smartypants";
+import { getFileInfo } from "./utils.js";
+const DEFAULT_REMARK_PLUGINS = [remarkGfm, remarkSmartypants];
+function handleExtends(config, defaults = []) {
+  if (Array.isArray(config))
+    return config;
+  return [...defaults, ...(config == null ? void 0 : config.extends) ?? []];
+}
+function mdx(mdxOptions = {}) {
+  return {
+    name: "@astrojs/mdx",
+    hooks: {
+      "astro:config:setup": ({ updateConfig, config, addPageExtension, command }) => {
+        addPageExtension(".mdx");
+        updateConfig({
+          vite: {
+            plugins: [
+              {
+                enforce: "pre",
+                ...mdxPlugin({
+                  remarkPlugins: [
+                    ...handleExtends(mdxOptions.remarkPlugins, DEFAULT_REMARK_PLUGINS),
+                    remarkFrontmatter,
+                    [
+                      remarkMdxFrontmatter,
+                      {
+                        name: "frontmatter",
+                        ...mdxOptions.frontmatterOptions
+                      }
+                    ]
+                  ],
+                  rehypePlugins: handleExtends(mdxOptions.rehypePlugins),
+                  jsx: true,
+                  jsxImportSource: "astro",
+                  format: "mdx",
+                  mdExtensions: []
+                })
+              },
+              {
+                name: "@astrojs/mdx",
+                transform(code, id) {
+                  if (!id.endsWith(".mdx"))
+                    return;
+                  const [, moduleExports] = parseESM(code);
+                  if (!moduleExports.includes("url")) {
+                    const { fileUrl } = getFileInfo(id, config);
+                    code += `
+export const url = ${JSON.stringify(fileUrl)};`;
+                  }
+                  if (command === "dev") {
+                    code += `
+if (import.meta.hot) {
+											import.meta.hot.decline();
+										}`;
+                  }
+                  return code;
+                }
+              }
+            ]
+          }
+        });
+      }
+    }
+  };
+}
+export {
+  mdx as default
+};

package/dist/utils.d.ts

@@ -0,0 +1,6 @@
+import type { AstroConfig } from 'astro';
+/** @see 'vite-plugin-utils' for source */
+export declare function getFileInfo(id: string, config: AstroConfig): {
+    fileId: string;
+    fileUrl: string | undefined;
+};

package/dist/utils.js

@@ -0,0 +1,15 @@
+function appendForwardSlash(path) {
+  return path.endsWith("/") ? path : path + "/";
+}
+function getFileInfo(id, config) {
+  const sitePathname = appendForwardSlash(config.site ? new URL(config.base, config.site).pathname : config.base);
+  const fileId = id.split("?")[0];
+  let fileUrl = fileId.includes("/pages/") ? fileId.replace(/^.*?\/pages\//, sitePathname).replace(/(\/index)?\.mdx$/, "") : void 0;
+  if (fileUrl && config.trailingSlash === "always") {
+    fileUrl = appendForwardSlash(fileUrl);
+  }
+  return { fileId, fileUrl };
+}
+export {
+  getFileInfo
+};

package/package.json

@@ -0,0 +1,54 @@
+{
+  "name": "@astrojs/mdx",
+  "description": "Use MDX within Astro",
+  "version": "0.0.0-rc-20220721064837",
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "author": "withastro",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/withastro/astro.git",
+    "directory": "packages/integrations/mdx"
+  },
+  "keywords": [
+    "astro-integration",
+    "astro-component",
+    "renderer",
+    "mdx"
+  ],
+  "bugs": "https://github.com/withastro/astro/issues",
+  "homepage": "https://docs.astro.build/en/guides/integrations-guide/mdx/",
+  "exports": {
+    ".": "./dist/index.js",
+    "./package.json": "./package.json"
+  },
+  "dependencies": {
+    "@mdx-js/rollup": "^2.1.1",
+    "es-module-lexer": "^0.10.5",
+    "remark-frontmatter": "^4.0.1",
+    "remark-gfm": "^3.0.1",
+    "remark-mdx-frontmatter": "^2.0.2",
+    "remark-smartypants": "^2.0.0"
+  },
+  "devDependencies": {
+    "@types/chai": "^4.3.1",
+    "@types/mocha": "^9.1.1",
+    "@types/yargs-parser": "^21.0.0",
+    "astro": "0.0.0-rc-20220721064837",
+    "astro-scripts": "0.0.6",
+    "chai": "^4.3.6",
+    "linkedom": "^0.14.12",
+    "mocha": "^9.2.2",
+    "remark-toc": "^8.0.1"
+  },
+  "engines": {
+    "node": "^14.18.0 || >=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"
+  }
+}

package/src/index.ts

@@ -0,0 +1,91 @@
+import mdxPlugin, { Options as MdxRollupPluginOptions } from '@mdx-js/rollup';
+import type { AstroIntegration } from 'astro';
+import { parse as parseESM } from 'es-module-lexer';
+import remarkFrontmatter from 'remark-frontmatter';
+import remarkGfm from 'remark-gfm';
+import type { RemarkMdxFrontmatterOptions } from 'remark-mdx-frontmatter';
+import remarkMdxFrontmatter from 'remark-mdx-frontmatter';
+import remarkSmartypants from 'remark-smartypants';
+import { getFileInfo } from './utils.js';
+
+type WithExtends<T> = T | { extends: T };
+
+type MdxOptions = {
+	remarkPlugins?: WithExtends<MdxRollupPluginOptions['remarkPlugins']>;
+	rehypePlugins?: WithExtends<MdxRollupPluginOptions['rehypePlugins']>;
+	/**
+	 * Configure the remark-mdx-frontmatter plugin
+	 * @see https://github.com/remcohaszing/remark-mdx-frontmatter#options for a full list of options
+	 * @default {{ name: 'frontmatter' }}
+	 */
+	frontmatterOptions?: RemarkMdxFrontmatterOptions;
+};
+
+const DEFAULT_REMARK_PLUGINS = [remarkGfm, remarkSmartypants];
+
+function handleExtends<T>(config: WithExtends<T[] | undefined>, defaults: T[] = []): T[] {
+	if (Array.isArray(config)) return config;
+
+	return [...defaults, ...(config?.extends ?? [])];
+}
+
+export default function mdx(mdxOptions: MdxOptions = {}): AstroIntegration {
+	return {
+		name: '@astrojs/mdx',
+		hooks: {
+			'astro:config:setup': ({ updateConfig, config, addPageExtension, command }: any) => {
+				addPageExtension('.mdx');
+				updateConfig({
+					vite: {
+						plugins: [
+							{
+								enforce: 'pre',
+								...mdxPlugin({
+									remarkPlugins: [
+										...handleExtends(mdxOptions.remarkPlugins, DEFAULT_REMARK_PLUGINS),
+										// Frontmatter plugins should always be applied!
+										// We can revisit this if a strong use case to *remove*
+										// YAML frontmatter via config is reported.
+										remarkFrontmatter,
+										[
+											remarkMdxFrontmatter,
+											{
+												name: 'frontmatter',
+												...mdxOptions.frontmatterOptions,
+											},
+										],
+									],
+									rehypePlugins: handleExtends(mdxOptions.rehypePlugins),
+									jsx: true,
+									jsxImportSource: 'astro',
+									// Note: disable `.md` support
+									format: 'mdx',
+									mdExtensions: [],
+								}),
+							},
+							{
+								name: '@astrojs/mdx',
+								transform(code: string, id: string) {
+									if (!id.endsWith('.mdx')) return;
+									const [, moduleExports] = parseESM(code);
+
+									if (!moduleExports.includes('url')) {
+										const { fileUrl } = getFileInfo(id, config);
+										code += `\nexport const url = ${JSON.stringify(fileUrl)};`;
+									}
+									if (command === 'dev') {
+										// TODO: decline HMR updates until we have a stable approach
+										code += `\nif (import.meta.hot) {
+											import.meta.hot.decline();
+										}`;
+									}
+									return code;
+								},
+							},
+						],
+					},
+				});
+			},
+		},
+	};
+}

package/src/utils.ts

@@ -0,0 +1,21 @@
+import type { AstroConfig } from 'astro';
+
+function appendForwardSlash(path: string) {
+	return path.endsWith('/') ? path : path + '/';
+}
+
+/** @see 'vite-plugin-utils' for source */
+export function getFileInfo(id: string, config: AstroConfig) {
+	const sitePathname = appendForwardSlash(
+		config.site ? new URL(config.base, config.site).pathname : config.base
+	);
+
+	const fileId = id.split('?')[0];
+	let fileUrl = fileId.includes('/pages/')
+		? fileId.replace(/^.*?\/pages\//, sitePathname).replace(/(\/index)?\.mdx$/, '')
+		: undefined;
+	if (fileUrl && config.trailingSlash === 'always') {
+		fileUrl = appendForwardSlash(fileUrl);
+	}
+	return { fileId, fileUrl };
+}

package/test/fixtures/mdx-component/src/components/Test.mdx

@@ -0,0 +1,3 @@
+# Hello component!
+
+<div id="foo">bar</div>

package/test/fixtures/mdx-component/src/pages/index.astro

@@ -0,0 +1,5 @@
+---
+import Test from '../components/Test.mdx';
+---
+
+<Test />

package/test/fixtures/mdx-custom-frontmatter-name/src/pages/glob.json.js

@@ -0,0 +1,9 @@
+export async function get() {
+	const mdxPages = await import.meta.glob('./*.mdx', { eager: true });
+
+	return {
+		body: JSON.stringify({
+			titles: Object.values(mdxPages ?? {}).map(v => v?.customFrontmatter?.title),
+		})
+	}
+}

package/test/fixtures/mdx-custom-frontmatter-name/src/pages/index.mdx

@@ -0,0 +1,6 @@
+---
+title: 'Using YAML frontmatter'
+illThrowIfIDontExist: "Oh no, that's scary!"
+---
+
+# {customFrontmatter.illThrowIfIDontExist}

package/test/fixtures/mdx-frontmatter/src/pages/glob.json.js

@@ -0,0 +1,9 @@
+export async function get() {
+	const mdxPages = await import.meta.glob('./*.mdx', { eager: true });
+
+	return {
+		body: JSON.stringify({
+			titles: Object.values(mdxPages ?? {}).map(v => v?.frontmatter?.title),
+		})
+	}
+}

package/test/fixtures/mdx-frontmatter/src/pages/index.mdx

@@ -0,0 +1,6 @@
+---
+title: 'Using YAML frontmatter'
+illThrowIfIDontExist: "Oh no, that's scary!"
+---
+
+# {frontmatter.illThrowIfIDontExist}

package/test/fixtures/mdx-page/src/pages/index.mdx

@@ -0,0 +1 @@
+# Hello page!

package/test/fixtures/mdx-remark-plugins/src/pages/with-gfm.mdx

@@ -0,0 +1,3 @@
+# GitHub-flavored Markdown test
+
+This should auto-gen a link: https://example.com

package/test/fixtures/mdx-remark-plugins/src/pages/with-toc.mdx

@@ -0,0 +1,19 @@
+# TOC test
+
+## Table of contents
+
+## Section 1
+
+Some text!
+
+### Subsection 1
+
+Some subsection test!
+
+### Subsection 2
+
+Oh cool, more text!
+
+## Section 2
+
+And section 2, with a hyperlink to check GFM is preserved: https://handle-me-gfm.com

package/test/fixtures/mdx-url-export/src/pages/pages.json.js

@@ -0,0 +1,9 @@
+export async function get() {
+	const mdxPages = await import.meta.glob('./*.mdx', { eager: true });
+
+	return {
+		body: JSON.stringify({
+			urls: Object.values(mdxPages ?? {}).map(v => v?.url),
+		})
+	}
+}

package/test/fixtures/mdx-url-export/src/pages/test-1.mdx

@@ -0,0 +1 @@
+# I'm a page with a url of "/test-1!"

package/test/fixtures/mdx-url-export/src/pages/test-2.mdx

@@ -0,0 +1 @@
+# I'm a page with a url of "/test-2!"

package/test/fixtures/mdx-url-export/src/pages/with-url-override.mdx

@@ -0,0 +1,3 @@
+export const url = '/AH!'
+
+# I'm a test with a url override!

package/test/mdx-component.test.js

@@ -0,0 +1,60 @@
+import mdx from '@astrojs/mdx';
+
+import { expect } from 'chai';
+import { parseHTML } from 'linkedom';
+import { loadFixture } from '../../../astro/test/test-utils.js';
+
+describe('MDX Component', () => {
+	let fixture;
+
+	before(async () => {
+		fixture = await loadFixture({
+			root: new URL('./fixtures/mdx-component/', import.meta.url),
+			integrations: [mdx()],
+		});
+	});
+
+	describe('build', () => {
+		before(async () => {
+			await fixture.build();
+		});
+
+		it('works', async () => {
+			const html = await fixture.readFile('/index.html');
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('h1');
+			const foo = document.querySelector('#foo');
+
+			expect(h1.textContent).to.equal('Hello component!');
+			expect(foo.textContent).to.equal('bar');
+		});
+	});
+
+	describe('dev', () => {
+		let devServer;
+
+		before(async () => {
+			devServer = await fixture.startDevServer();
+		});
+
+		after(async () => {
+			await devServer.stop();
+		});
+
+		it('works', async () => {
+			const res = await fixture.fetch('/');
+
+			expect(res.status).to.equal(200);
+
+			const html = await res.text();
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('h1');
+			const foo = document.querySelector('#foo');
+
+			expect(h1.textContent).to.equal('Hello component!');
+			expect(foo.textContent).to.equal('bar');
+		});
+	});
+});

package/test/mdx-frontmatter.js

@@ -0,0 +1,45 @@
+import mdx from '@astrojs/mdx';
+
+import { expect } from 'chai';
+import { loadFixture } from '../../../astro/test/test-utils.js';
+
+const FIXTURE_ROOT = new URL('./fixtures/mdx-frontmatter/', import.meta.url);
+
+describe('MDX frontmatter', () => {
+	it('builds when "frontmatter.property" is in JSX expression', async () => {
+		const fixture = await loadFixture({
+			root: FIXTURE_ROOT,
+			integrations: [mdx()],
+		});
+		await fixture.build();
+		expect(true).to.equal(true);
+	});
+
+	it('extracts frontmatter to "frontmatter" export', async () => {
+		const fixture = await loadFixture({
+			root: FIXTURE_ROOT,
+			integrations: [mdx()],
+		});
+		await fixture.build();
+
+		const { titles } = JSON.parse(await fixture.readFile('/glob.json'));
+		expect(titles).to.include('Using YAML frontmatter');
+	});
+
+	it('extracts frontmatter to "customFrontmatter" export when configured', async () => {
+		const fixture = await loadFixture({
+			root: new URL('./fixtures/mdx-custom-frontmatter-name/', import.meta.url),
+			integrations: [
+				mdx({
+					frontmatterOptions: {
+						name: 'customFrontmatter',
+					},
+				}),
+			],
+		});
+		await fixture.build();
+
+		const { titles } = JSON.parse(await fixture.readFile('/glob.json'));
+		expect(titles).to.include('Using YAML frontmatter');
+	});
+});

package/test/mdx-page.test.js

@@ -0,0 +1,56 @@
+import mdx from '@astrojs/mdx';
+
+import { expect } from 'chai';
+import { parseHTML } from 'linkedom';
+import { loadFixture } from '../../../astro/test/test-utils.js';
+
+describe('MDX Page', () => {
+	let fixture;
+
+	before(async () => {
+		fixture = await loadFixture({
+			root: new URL('./fixtures/mdx-page/', import.meta.url),
+			integrations: [mdx()],
+		});
+	});
+
+	describe('build', () => {
+		before(async () => {
+			await fixture.build();
+		});
+
+		it('works', async () => {
+			const html = await fixture.readFile('/index.html');
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('h1');
+
+			expect(h1.textContent).to.equal('Hello page!');
+		});
+	});
+
+	describe('dev', () => {
+		let devServer;
+
+		before(async () => {
+			devServer = await fixture.startDevServer();
+		});
+
+		after(async () => {
+			await devServer.stop();
+		});
+
+		it('works', async () => {
+			const res = await fixture.fetch('/');
+
+			expect(res.status).to.equal(200);
+
+			const html = await res.text();
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('h1');
+
+			expect(h1.textContent).to.equal('Hello page!');
+		});
+	});
+});

package/test/mdx-remark-plugins.test.js

@@ -0,0 +1,62 @@
+import mdx from '@astrojs/mdx';
+
+import { expect } from 'chai';
+import { parseHTML } from 'linkedom';
+import { loadFixture } from '../../../astro/test/test-utils.js';
+import remarkToc from 'remark-toc';
+
+const FIXTURE_ROOT = new URL('./fixtures/mdx-remark-plugins/', import.meta.url);
+
+describe('MDX remark plugins', () => {
+	it('supports custom remark plugins - TOC', async () => {
+		const fixture = await loadFixture({
+			root: FIXTURE_ROOT,
+			integrations: [
+				mdx({
+					remarkPlugins: [remarkToc],
+				}),
+			],
+		});
+		await fixture.build();
+
+		const html = await fixture.readFile('/with-toc/index.html');
+		const { document } = parseHTML(html);
+
+		const tocLink1 = document.querySelector('ul a[href="#section-1"]');
+		expect(tocLink1).to.not.be.null;
+	});
+
+	it('applies GitHub-flavored markdown by default', async () => {
+		const fixture = await loadFixture({
+			root: FIXTURE_ROOT,
+			integrations: [mdx()],
+		});
+		await fixture.build();
+
+		const html = await fixture.readFile('/with-gfm/index.html');
+		const { document } = parseHTML(html);
+
+		const autoGenLink = document.querySelector('a[href="https://example.com"]');
+		expect(autoGenLink).to.not.be.null;
+	});
+
+	it('preserves default GitHub-flavored markdown with "extends"', async () => {
+		const fixture = await loadFixture({
+			root: FIXTURE_ROOT,
+			integrations: [
+				mdx({
+					remarkPlugins: { extends: [remarkToc] },
+				}),
+			],
+		});
+		await fixture.build();
+
+		const html = await fixture.readFile('/with-toc/index.html');
+		const { document } = parseHTML(html);
+
+		const tocLink1 = document.querySelector('ul a[href="#section-1"]');
+		expect(tocLink1).to.not.be.null;
+		const autoGenLink = document.querySelector('a[href="https://handle-me-gfm.com"]');
+		expect(autoGenLink).to.not.be.null;
+	});
+});

package/test/mdx-url-export.js

@@ -0,0 +1,28 @@
+import mdx from '@astrojs/mdx';
+
+import { expect } from 'chai';
+import { loadFixture } from '../../../astro/test/test-utils.js';
+
+describe('MDX url export', () => {
+	let fixture;
+
+	before(async () => {
+		fixture = await loadFixture({
+			root: new URL('./fixtures/mdx-url-export/', import.meta.url),
+			integrations: [mdx()],
+		});
+
+		await fixture.build();
+	});
+
+	it('generates correct urls in glob result', async () => {
+		const { urls } = JSON.parse(await fixture.readFile('/pages.json'));
+		expect(urls).to.include('/test-1');
+		expect(urls).to.include('/test-2');
+	});
+
+	it('respects "export url" overrides in glob result', async () => {
+		const { urls } = JSON.parse(await fixture.readFile('/pages.json'));
+		expect(urls).to.include('/AH!');
+	});
+});

package/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "include": ["src"],
+  "compilerOptions": {
+    "allowJs": true,
+    "module": "ES2020",
+    "outDir": "./dist",
+    "target": "ES2020"
+  }
+}