[MDX] Fix remaining inconsistencies with Markdown (#4268)

* feat: add "file" and "url" to layout props

* feat: add rawContent and compiledContent errs

* fix: add "file" and "url" to frontmatter

* fix: add separate MDX instance type

* types: add MarkdownLayoutProps and MDXLayoutProps

* refactor: simplify MDXLayoutProps

* test: pass file and url to layout

* test: glob components with .default and Content

* feat: add <Content /> to MDX

* feat: declare MDX type module

* fix: [MD] move file and url to layout props only

* chore: changeset

* chore: bump MDX to "minor" with more details

* refactor: remove "file" + "url" top-level props (save for minor)

* revert: MDInstance type def updates (save for minor)

* fix: MDXInstance "default" + "content" types

* fix: bad test layout

* chore: remove getHeaders fro *.mdx

1 files changed, 54 insertions, 2 deletions

diff --git a/packages/integrations/mdx/test/mdx-component.test.js b/packages/integrations/mdx/test/mdx-component.test.js
index 1a610be05..84210b342 100644
--- a/packages/integrations/mdx/test/mdx-component.test.js
+++ b/packages/integrations/mdx/test/mdx-component.test.js
@@ -19,7 +19,7 @@ describe('MDX Component', () => {
 			await fixture.build();
 		});
 
-		it('works', async () => {
+		it('supports top-level imports', async () => {
 			const html = await fixture.readFile('/index.html');
 			const { document } = parseHTML(html);
 
@@ -29,6 +29,28 @@ describe('MDX Component', () => {
 			expect(h1.textContent).to.equal('Hello component!');
 			expect(foo.textContent).to.equal('bar');
 		});
+
+		it('supports glob imports - <Component.default />', async () => {
+			const html = await fixture.readFile('/glob/index.html');
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('[data-default-export] h1');
+			const foo = document.querySelector('[data-default-export] #foo');
+
+			expect(h1.textContent).to.equal('Hello component!');
+			expect(foo.textContent).to.equal('bar');
+		});
+
+		it('supports glob imports - <Content />', async () => {
+			const html = await fixture.readFile('/glob/index.html');
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('[data-content-export] h1');
+			const foo = document.querySelector('[data-content-export] #foo');
+
+			expect(h1.textContent).to.equal('Hello component!');
+			expect(foo.textContent).to.equal('bar');
+		});
 	});
 
 	describe('dev', () => {
@@ -42,7 +64,7 @@ describe('MDX Component', () => {
 			await devServer.stop();
 		});
 
-		it('works', async () => {
+		it('supports top-level imports', async () => {
 			const res = await fixture.fetch('/');
 
 			expect(res.status).to.equal(200);
@@ -56,5 +78,35 @@ describe('MDX Component', () => {
 			expect(h1.textContent).to.equal('Hello component!');
 			expect(foo.textContent).to.equal('bar');
 		});
+
+		it('supports glob imports - <Component.default />', async () => {
+			const res = await fixture.fetch('/glob');
+
+			expect(res.status).to.equal(200);
+
+			const html = await res.text();
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('[data-default-export] h1');
+			const foo = document.querySelector('[data-default-export] #foo');
+
+			expect(h1.textContent).to.equal('Hello component!');
+			expect(foo.textContent).to.equal('bar');
+		});
+
+		it('supports glob imports - <Content />', async () => {
+			const res = await fixture.fetch('/glob');
+
+			expect(res.status).to.equal(200);
+
+			const html = await res.text();
+			const { document } = parseHTML(html);
+
+			const h1 = document.querySelector('[data-content-export] h1');
+			const foo = document.querySelector('[data-content-export] #foo');
+
+			expect(h1.textContent).to.equal('Hello component!');
+			expect(foo.textContent).to.equal('bar');
+		});
 	});
 });