Merge pull request #30287 from dandean/fix-signature-of-storybook-add

Fix the signature of @storybook/react .add() method

types/storybook__react/index.d.ts

@@ -1,7 +1,8 @@
-// Type definitions for @storybook/react 3.0
+// Type definitions for @storybook/react 4.0
 // Project: https://github.com/storybooks/storybook
 // Definitions by: Joscha Feth <https://github.com/joscha>
 //                 Anton Izmailov <https://github.com/wapgear>
+//                 Dan Dean <https://github.com/dandean>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 // TypeScript Version: 2.8
 
@@ -12,15 +13,21 @@ import * as React from 'react';
 export type Renderable = React.ComponentType | JSX.Element;
 export type RenderFunction = () => Renderable | Renderable[];
 
+export interface DecoratorParameters {
+    [key: string]: any;
+}
 export type StoryDecorator = (story: RenderFunction, context: { kind: string, story: string }) => Renderable | null;
 
 export interface Story {
     readonly kind: string;
-    add(storyName: string, callback: RenderFunction): this;
+    add(storyName: string, callback: RenderFunction, parameters?: DecoratorParameters): this;
     addDecorator(decorator: StoryDecorator): this;
+    addParameters(parameters: DecoratorParameters): this;
 }
 
 export function addDecorator(decorator: StoryDecorator): void;
+export function addParameters(parameters: DecoratorParameters): void;
+export function clearDecorators(): void;
 export function configure(fn: () => void, module: NodeModule): void;
 export function setAddon(addon: object): void;
 export function storiesOf(name: string, module: NodeModule): Story;

types/storybook__react/storybook__react-tests.tsx

@@ -1,7 +1,8 @@
 import * as React from 'react';
-import { storiesOf, setAddon, addDecorator, configure, getStorybook, RenderFunction, Story, forceReRender } from '@storybook/react';
+import { storiesOf, setAddon, addDecorator, addParameters, configure, getStorybook, RenderFunction, Story, forceReRender, DecoratorParameters, clearDecorators } from '@storybook/react';
 
 const Decorator = (story: RenderFunction) => <div>{story()}</div>;
+const parameters: DecoratorParameters = { parameter: 'foo' };
 
 forceReRender();
 
@@ -9,10 +10,13 @@ storiesOf('Welcome', module)
     // local addDecorator
     .addDecorator(Decorator)
     .add('to Storybook', () => <div/>)
-    .add('to Storybook as Array', () => [<div />, <div />]);
+    .add('to Storybook as Array', () => [<div />, <div />])
+    .add('and a story with additional parameters', () => <div/>, parameters);
 
 // global addDecorator
 addDecorator(Decorator);
+addParameters(parameters);
+clearDecorators();
 
 // setAddon
 interface AnyAddon {
@@ -30,6 +34,7 @@ storiesOf<AnyAddon>('withAnyAddon', module)
     .addWithSideEffect('more', () => <div/>)
     .add('another story', () => <div/>)
     .add('to Storybook as Array', () => [<div />, <div />])
+    .add('and a story with additional parameters', () => <div/>, parameters)
     .addWithSideEffect('even more', () => <div/>);
 
 // configure