diff --git a/README.md b/README.md index ca77dfa..6b56a26 100644 --- a/README.md +++ b/README.md @@ -29,12 +29,13 @@ export default { The addon can be configured via the `playroom` [parameter](https://storybook.js.org/docs/react/writing-stories/parameters). The following options are available: -| Option | Type | Description | Default | -| :------------------------------- | :-------- | :--------------------------------------- | :---------------------- | -| `url` | `string` | the Playroom URL | `http://localhost:9000` | -| `code` | `string` | code to be used instead of story source | | -| `disable` | `boolean` | whether to disable the addon | `false` | -| `reactElementToJSXStringOptions` | `object` | [react-element-to-jsx-string options][1] | `{ sortProps: false }` | +| Option | Type | Description | Default | +| :------------------------------- | :-------- | :--------------------------------------------------- | :---------------------- | +| `url` | `string` | the Playroom URL | `http://localhost:9000` | +| `code` | `string` | code to be used instead of story source | | +| `disable` | `boolean` | whether to disable the addon | `false` | +| `includeDecorators` | `boolean` | whether to include global decorators in stories code | `false` | +| `reactElementToJSXStringOptions` | `object` | [react-element-to-jsx-string options][1] | `{ sortProps: false }` | To configure for all stories, set the `playroom` parameter in [`.storybook/preview.js`](https://storybook.js.org/docs/react/configure/overview#configure-story-rendering): diff --git a/src/utils.tsx b/src/utils.tsx index 277fa85..2d96db8 100644 --- a/src/utils.tsx +++ b/src/utils.tsx @@ -4,6 +4,7 @@ type Options = { url?: string code?: string disable?: boolean + includeDecorators?: boolean reactElementToJSXStringOptions?: ReactElementToJSXStringOptions } @@ -11,10 +12,12 @@ export const getOptions = ({ url = 'http://localhost:9000', code = '', disable = false, + includeDecorators = false, reactElementToJSXStringOptions = { sortProps: false }, }: Options = {}): Required => ({ url, code, disable, + includeDecorators, reactElementToJSXStringOptions, }) diff --git a/src/withGlobals.ts b/src/withGlobals.ts index 006c5f8..e0d4f3f 100644 --- a/src/withGlobals.ts +++ b/src/withGlobals.ts @@ -15,13 +15,17 @@ export const withGlobals = ( StoryFn: StoryFunction, context: StoryContext, ) => { - const { parameters } = context + const { parameters, undecoratedStoryFn } = context const playroomConfig = parameters[PARAM_KEY] - const { url, code, reactElementToJSXStringOptions } = + const { url, code, includeDecorators, reactElementToJSXStringOptions } = getOptions(playroomConfig) const story = StoryFn() as ReactElement + const storyCode = includeDecorators + ? story + : (undecoratedStoryFn(context) as ReactElement) + const jsxString = - code || reactElementToJSXString(story, reactElementToJSXStringOptions) + code || reactElementToJSXString(storyCode, reactElementToJSXStringOptions) const codeUrl = url && createUrl({ baseUrl: url, code: jsxString }) const emit = useChannel({})