[Feature] Target content when used as a global decorator

[awdyson]

Describe the bug

It'd be nice to have the option to strip Storybook's wrapper when used as a global decorator.
It does work well when invoked directly by each story.

Steps to reproduce the behavior

preview.ts:

import { addDecorator } from '@storybook/react';
import { jsxDecorator } from 'storybook-addon-jsx';

addDecorator(jsxDecorator);

MyComponent.stories.ts:

import { Meta } from '@storybook/react/types-6-0';
import React, { ReactElement } from 'react';

import { MyComponent, MyComponentProps } from '../../src/components';

const meta: Meta = {
  component: MyComponent,
  title: 'Components/MyComponent',
};

const Story = (args: MyComponentProps): ReactElement => <MyComponent {...args} />;

export { meta as default, Story };

addon-jsx output:

<ReadmeContent
  DocPreview={undefined}
  FooterPreview={undefined}
  HeaderPreview={undefined}
  StoryPreview={undefined}
  codeTheme="github"
  layout={[
    {
      content: <><MyComponent /></>,
      type: 'STORY'
    }
  ]}
  theme={{}}
  types={[
    'MD',
    'STORY',
    'STORY_SOURCE',
    'PROPS',
    'FOOTER_MD',
    'HEADER_MD'
  ]}
/>

[awdyson]

Partial solution:

const parameters = {
  jsx: {
    onBeforeRender: (domStr: string) => /content: <>(.*)<\/>/.exec(domStr)?.[1] || domStr,
  },
};

We lose some formatting still though 😞
ie, maxInlineAttributesLineLength isn't respected anymore.

[hipstersmoothie]

Where is ReadmeContent coming from?