CsfFile: Extract basic parameters

lib/core-server/src/utils/stories-json.ts

@@ -2,13 +2,14 @@ import path from 'path';
 import fs from 'fs-extra';
 import glob from 'globby';
 import { logger } from '@storybook/node-logger';
-import { Options } from '@storybook/core-common';
+// import { Options } from '@storybook/core-common';
 import { readCsf } from '@storybook/csf-tools';
 
 interface ExtractedStory {
   id: string;
   kind: string;
   name: string;
+  parameters: Record<string, any>;
 }
 
 type ExtractedStories = Record<string, ExtractedStory>;

lib/csf-tools/src/CsfFile.ts

@@ -18,6 +18,7 @@ interface Meta {
 interface Story {
   id: string;
   name: string;
+  parameters: Record<string, any>;
 }
 
 const getMeta = (declaration: any): Meta => {
@@ -89,9 +90,16 @@ export class CsfFile {
                 isExportStory(decl.id.name, self._meta)
               ) {
                 const { name } = decl.id;
+                const parameters = {
+                  __id: toId(self._meta.title, name),
+                  // FiXME: Template.bind({});
+                  __isArgsStory:
+                    t.isArrowFunctionExpression(decl.init) && decl.init.params.length > 0,
+                };
                 self._stories[name] = {
-                  id: toId(self._meta.title, name),
+                  id: parameters.__id,
                   name,
+                  parameters,
                 };
               }
             });

lib/csf-tools/src/__testfixtures__/basic.snapshot

@@ -8,15 +8,27 @@ exports[`csf extract basic 1`] = `
   "stories": [
     {
       "id": "foo-bar--a",
-      "name": "A"
+      "name": "A",
+      "parameters": {
+        "__id": "foo-bar--a",
+        "__isArgsStory": false
+      }
     },
     {
       "id": "foo-bar--b",
-      "name": "Some story"
+      "name": "Some story",
+      "parameters": {
+        "__id": "foo-bar--b",
+        "__isArgsStory": true
+      }
     },
     {
       "id": "foo-bar--d",
-      "name": "D"
+      "name": "D",
+      "parameters": {
+        "__id": "foo-bar--d",
+        "__isArgsStory": false
+      }
     }
   ]
 }

lib/csf-tools/src/__testfixtures__/basic.stories.js

@@ -6,7 +6,7 @@ const Template = (args) => {};
 
 export const A = () => {};
 
-export const B = () => {};
+export const B = (args) => {};
 B.storyName = 'Some story';
 
 export const D = Template.bind({});

lib/csf-tools/src/__testfixtures__/exclude.snapshot

@@ -12,11 +12,19 @@ exports[`csf extract exclude 1`] = `
   "stories": [
     {
       "id": "foo-bar-baz--a",
-      "name": "A"
+      "name": "A",
+      "parameters": {
+        "__id": "foo-bar-baz--a",
+        "__isArgsStory": false
+      }
     },
     {
       "id": "foo-bar-baz--b",
-      "name": "Some story"
+      "name": "Some story",
+      "parameters": {
+        "__id": "foo-bar-baz--b",
+        "__isArgsStory": false
+      }
     }
   ]
 }

lib/csf-tools/src/__testfixtures__/include.snapshot

@@ -9,15 +9,27 @@ exports[`csf extract include 1`] = `
   "stories": [
     {
       "id": "foo-bar-baz--includea",
-      "name": "IncludeA"
+      "name": "IncludeA",
+      "parameters": {
+        "__id": "foo-bar-baz--includea",
+        "__isArgsStory": false
+      }
     },
     {
       "id": "foo-bar-baz--includeb",
-      "name": "Some story"
+      "name": "Some story",
+      "parameters": {
+        "__id": "foo-bar-baz--includeb",
+        "__isArgsStory": false
+      }
     },
     {
       "id": "foo-bar-baz--includec",
-      "name": "IncludeC"
+      "name": "IncludeC",
+      "parameters": {
+        "__id": "foo-bar-baz--includec",
+        "__isArgsStory": false
+      }
     }
   ]
 }

lib/csf-tools/src/__testfixtures__/typescript.snapshot

@@ -8,15 +8,27 @@ exports[`csf extract typescript 1`] = `
   "stories": [
     {
       "id": "foo-bar-baz--a",
-      "name": "A"
+      "name": "A",
+      "parameters": {
+        "__id": "foo-bar-baz--a",
+        "__isArgsStory": false
+      }
     },
     {
       "id": "foo-bar-baz--b",
-      "name": "Some story"
+      "name": "Some story",
+      "parameters": {
+        "__id": "foo-bar-baz--b",
+        "__isArgsStory": true
+      }
     },
     {
       "id": "foo-bar-baz--c",
-      "name": "C"
+      "name": "C",
+      "parameters": {
+        "__id": "foo-bar-baz--c",
+        "__isArgsStory": false
+      }
     }
   ]
 }

lib/csf-tools/src/__testfixtures__/typescript.stories.tsx

@@ -11,7 +11,7 @@ const Template: Story<PropTypes> = (args) => <>template</>;
 
 export const A: Story<PropTypes> = () => <>A</>;
 
-export const B = () => <>B</>;
+export const B = (args: any) => <>B</>;
 B.storyName = 'Some story';
 
 export const C = Template.bind({});