From f016acb31ac01c14950855f66117be541c7980db Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 10 Mar 2020 00:45:52 +0800
Subject: [PATCH] MDX: Compile to updated source-loader format

---
 .../src/mdx/__testfixtures__/component-id.output.snapshot | 2 +-
 .../src/mdx/__testfixtures__/decorators.output.snapshot   | 2 +-
 .../__testfixtures__/non-story-exports.output.snapshot    | 4 ++--
 .../src/mdx/__testfixtures__/parameters.output.snapshot   | 4 ++--
 .../src/mdx/__testfixtures__/previews.output.snapshot     | 4 ++--
 .../__testfixtures__/story-def-text-only.output.snapshot  | 2 +-
 .../__testfixtures__/story-definitions.output.snapshot    | 8 ++++----
 .../__testfixtures__/story-function-var.output.snapshot   | 2 +-
 .../mdx/__testfixtures__/story-function.output.snapshot   | 6 ++++--
 .../src/mdx/__testfixtures__/story-object.output.snapshot | 6 ++++--
 addons/docs/src/mdx/mdx-compiler-plugin.js                | 6 +++---
 11 files changed, 25 insertions(+), 21 deletions(-)

diff --git a/addons/docs/src/mdx/__testfixtures__/component-id.output.snapshot b/addons/docs/src/mdx/__testfixtures__/component-id.output.snapshot
index bcddea3d8a4..d507743cb9f 100644
--- a/addons/docs/src/mdx/__testfixtures__/component-id.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/component-id.output.snapshot
@@ -35,7 +35,7 @@ MDXContent.isMDXComponent = true;
 export const componentNotes = () => <Button>Component notes</Button>;
 componentNotes.story = {};
 componentNotes.story.name = 'component notes';
-componentNotes.story.parameters = { mdxSource: '<Button>Component notes</Button>' };
+componentNotes.story.parameters = { storySource: { source: '<Button>Component notes</Button>' } };
 
 const componentMeta = { title: 'Button', id: 'button-id', includeStories: ['componentNotes'] };
 
diff --git a/addons/docs/src/mdx/__testfixtures__/decorators.output.snapshot b/addons/docs/src/mdx/__testfixtures__/decorators.output.snapshot
index efa5da26dcf..40ef429be95 100644
--- a/addons/docs/src/mdx/__testfixtures__/decorators.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/decorators.output.snapshot
@@ -54,7 +54,7 @@ MDXContent.isMDXComponent = true;
 export const one = () => <Button>One</Button>;
 one.story = {};
 one.story.name = 'one';
-one.story.parameters = { mdxSource: '<Button>One</Button>' };
+one.story.parameters = { storySource: { source: '<Button>One</Button>' } };
 one.story.decorators = [storyFn => <div className=\\"local\\">{storyFn()}</div>];
 
 const componentMeta = {
diff --git a/addons/docs/src/mdx/__testfixtures__/non-story-exports.output.snapshot b/addons/docs/src/mdx/__testfixtures__/non-story-exports.output.snapshot
index 73e2e57b826..22a60f4b746 100644
--- a/addons/docs/src/mdx/__testfixtures__/non-story-exports.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/non-story-exports.output.snapshot
@@ -42,12 +42,12 @@ MDXContent.isMDXComponent = true;
 export const one = () => <Button>One</Button>;
 one.story = {};
 one.story.name = 'one';
-one.story.parameters = { mdxSource: '<Button>One</Button>' };
+one.story.parameters = { storySource: { source: '<Button>One</Button>' } };
 
 export const helloStory = () => <Button>Hello button</Button>;
 helloStory.story = {};
 helloStory.story.name = 'hello story';
-helloStory.story.parameters = { mdxSource: '<Button>Hello button</Button>' };
+helloStory.story.parameters = { storySource: { source: '<Button>Hello button</Button>' } };
 
 const componentMeta = { title: 'Button', includeStories: ['one', 'helloStory'] };
 
diff --git a/addons/docs/src/mdx/__testfixtures__/parameters.output.snapshot b/addons/docs/src/mdx/__testfixtures__/parameters.output.snapshot
index 653874a3380..3ed110aadad 100644
--- a/addons/docs/src/mdx/__testfixtures__/parameters.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/parameters.output.snapshot
@@ -51,13 +51,13 @@ MDXContent.isMDXComponent = true;
 export const componentNotes = () => <Button>Component notes</Button>;
 componentNotes.story = {};
 componentNotes.story.name = 'component notes';
-componentNotes.story.parameters = { mdxSource: '<Button>Component notes</Button>' };
+componentNotes.story.parameters = { storySource: { source: '<Button>Component notes</Button>' } };
 
 export const storyNotes = () => <Button>Story notes</Button>;
 storyNotes.story = {};
 storyNotes.story.name = 'story notes';
 storyNotes.story.parameters = {
-  mdxSource: '<Button>Story notes</Button>',
+  storySource: { source: '<Button>Story notes</Button>' },
   ...{
     notes: 'story notes',
   },
diff --git a/addons/docs/src/mdx/__testfixtures__/previews.output.snapshot b/addons/docs/src/mdx/__testfixtures__/previews.output.snapshot
index 84c62354f84..08f6961acb3 100644
--- a/addons/docs/src/mdx/__testfixtures__/previews.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/previews.output.snapshot
@@ -55,12 +55,12 @@ MDXContent.isMDXComponent = true;
 export const helloButton = () => <Button>Hello button</Button>;
 helloButton.story = {};
 helloButton.story.name = 'hello button';
-helloButton.story.parameters = { mdxSource: '<Button>Hello button</Button>' };
+helloButton.story.parameters = { storySource: { source: '<Button>Hello button</Button>' } };
 
 export const two = () => <Button>Two</Button>;
 two.story = {};
 two.story.name = 'two';
-two.story.parameters = { mdxSource: '<Button>Two</Button>' };
+two.story.parameters = { storySource: { source: '<Button>Two</Button>' } };
 
 const componentMeta = {
   title: 'Button',
diff --git a/addons/docs/src/mdx/__testfixtures__/story-def-text-only.output.snapshot b/addons/docs/src/mdx/__testfixtures__/story-def-text-only.output.snapshot
index bf3119af433..aea65a426d9 100644
--- a/addons/docs/src/mdx/__testfixtures__/story-def-text-only.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/story-def-text-only.output.snapshot
@@ -35,7 +35,7 @@ MDXContent.isMDXComponent = true;
 export const text = () => 'Plain text';
 text.story = {};
 text.story.name = 'text';
-text.story.parameters = { mdxSource: \\"'Plain text'\\" };
+text.story.parameters = { storySource: { source: \\"'Plain text'\\" } };
 
 const componentMeta = { title: 'Text', includeStories: ['text'] };
 
diff --git a/addons/docs/src/mdx/__testfixtures__/story-definitions.output.snapshot b/addons/docs/src/mdx/__testfixtures__/story-definitions.output.snapshot
index fe961c6a0b7..5f8f3d422c6 100644
--- a/addons/docs/src/mdx/__testfixtures__/story-definitions.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/story-definitions.output.snapshot
@@ -45,22 +45,22 @@ MDXContent.isMDXComponent = true;
 export const one = () => <Button>One</Button>;
 one.story = {};
 one.story.name = 'one';
-one.story.parameters = { mdxSource: '<Button>One</Button>' };
+one.story.parameters = { storySource: { source: '<Button>One</Button>' } };
 
 export const helloStory = () => <Button>Hello button</Button>;
 helloStory.story = {};
 helloStory.story.name = 'hello story';
-helloStory.story.parameters = { mdxSource: '<Button>Hello button</Button>' };
+helloStory.story.parameters = { storySource: { source: '<Button>Hello button</Button>' } };
 
 export const wPunctuation = () => <Button>with punctuation</Button>;
 wPunctuation.story = {};
 wPunctuation.story.name = 'w/punctuation';
-wPunctuation.story.parameters = { mdxSource: '<Button>with punctuation</Button>' };
+wPunctuation.story.parameters = { storySource: { source: '<Button>with punctuation</Button>' } };
 
 export const _1FineDay = () => <Button>starts with number</Button>;
 _1FineDay.story = {};
 _1FineDay.story.name = '1 fine day';
-_1FineDay.story.parameters = { mdxSource: '<Button>starts with number</Button>' };
+_1FineDay.story.parameters = { storySource: { source: '<Button>starts with number</Button>' } };
 
 const componentMeta = {
   title: 'Button',
diff --git a/addons/docs/src/mdx/__testfixtures__/story-function-var.output.snapshot b/addons/docs/src/mdx/__testfixtures__/story-function-var.output.snapshot
index e8f34c252fb..f063e31dba8 100644
--- a/addons/docs/src/mdx/__testfixtures__/story-function-var.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/story-function-var.output.snapshot
@@ -39,7 +39,7 @@ MDXContent.isMDXComponent = true;
 export const basic = assertIsFn(basicFn);
 basic.story = {};
 basic.story.name = 'basic';
-basic.story.parameters = { mdxSource: 'basicFn' };
+basic.story.parameters = { storySource: { source: 'basicFn' } };
 
 const componentMeta = { title: 'story-function-var', includeStories: ['basic'] };
 
diff --git a/addons/docs/src/mdx/__testfixtures__/story-function.output.snapshot b/addons/docs/src/mdx/__testfixtures__/story-function.output.snapshot
index b07cfe9ba90..b2052dbd71d 100644
--- a/addons/docs/src/mdx/__testfixtures__/story-function.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/story-function.output.snapshot
@@ -42,8 +42,10 @@ export const functionStory = () => {
 functionStory.story = {};
 functionStory.story.name = 'function';
 functionStory.story.parameters = {
-  mdxSource:
-    \\"() => {\\\\n  const btn = document.createElement('button');\\\\n  btn.innerHTML = 'Hello Button';\\\\n  btn.addEventListener('click', action('Click'));\\\\n  return btn;\\\\n}\\",
+  storySource: {
+    source:
+      \\"() => {\\\\n  const btn = document.createElement('button');\\\\n  btn.innerHTML = 'Hello Button';\\\\n  btn.addEventListener('click', action('Click'));\\\\n  return btn;\\\\n}\\",
+  },
 };
 
 const componentMeta = { includeStories: ['functionStory'] };
diff --git a/addons/docs/src/mdx/__testfixtures__/story-object.output.snapshot b/addons/docs/src/mdx/__testfixtures__/story-object.output.snapshot
index 052034b5ef6..05b97a151ac 100644
--- a/addons/docs/src/mdx/__testfixtures__/story-object.output.snapshot
+++ b/addons/docs/src/mdx/__testfixtures__/story-object.output.snapshot
@@ -54,8 +54,10 @@ export const toStorybook = () => ({
 toStorybook.story = {};
 toStorybook.story.name = 'to storybook';
 toStorybook.story.parameters = {
-  mdxSource:
-    '{\\\\n  template: \`<storybook-welcome-component (showApp)=\\"showApp()\\"></storybook-welcome-component>\`,\\\\n  props: {\\\\n    showApp: linkTo(\\\\'Button\\\\')\\\\n  },\\\\n  moduleMetadata: {\\\\n    declarations: [Welcome]\\\\n  }\\\\n}',
+  storySource: {
+    source:
+      '{\\\\n  template: \`<storybook-welcome-component (showApp)=\\"showApp()\\"></storybook-welcome-component>\`,\\\\n  props: {\\\\n    showApp: linkTo(\\\\'Button\\\\')\\\\n  },\\\\n  moduleMetadata: {\\\\n    declarations: [Welcome]\\\\n  }\\\\n}',
+  },
 };
 
 const componentMeta = { title: 'MDX|Welcome', includeStories: ['toStorybook'] };
diff --git a/addons/docs/src/mdx/mdx-compiler-plugin.js b/addons/docs/src/mdx/mdx-compiler-plugin.js
index 2e66b82446f..ab237746a7c 100644
--- a/addons/docs/src/mdx/mdx-compiler-plugin.js
+++ b/addons/docs/src/mdx/mdx-compiler-plugin.js
@@ -94,12 +94,12 @@ function genStoryExport(ast, context) {
   let parameters = getAttr(ast.openingElement, 'parameters');
   parameters = parameters && parameters.expression;
   const source = jsStringEscape(storyCode);
+  const sourceParam = `storySource: { source: '${source}' }`;
   if (parameters) {
     const { code: params } = generate(parameters, {});
-    // FIXME: hack in the story's source as a parameter
-    statements.push(`${storyKey}.story.parameters = { mdxSource: '${source}', ...${params} };`);
+    statements.push(`${storyKey}.story.parameters = { ${sourceParam}, ...${params} };`);
   } else {
-    statements.push(`${storyKey}.story.parameters = { mdxSource: '${source}' };`);
+    statements.push(`${storyKey}.story.parameters = { ${sourceParam} };`);
   }
 
   let decorators = getAttr(ast.openingElement, 'decorators');