MDX: Compile to updated source-loader format

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'] };
 

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 = {

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'] };
 

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',
   },

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',

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'] };
 

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',

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'] };
 

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'] };

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'] };

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');