I've implemented some stories in MDX with no format. I'm using @storybook/react version ^6.3.12. Here's a brief example:
## Examples
### Dark Background
The same styling works on light or dark background.
*Due to a storybook bug, you cannot see dark-background stories in the Docs
page. Use the Canvas page instead.*
<Canvas>
<Story
name="Dark Background"
parameters={{
backgrounds: {default: 'dark'}
}}
args={{}}
>
{args => (
<Selector assets={[...fixtures, ...fixtures]} />
)}
</Story>
</Canvas>
### Few Assets
With only a few assets, the slider works the same way but without moving the
thumbnails.
<Canvas>
<Story name="Few assets" args={{}}>
{args => (
<Selector assets={[fixtures[0], fixtures[1]]} />
)}
</Story>
</Canvas>
Due to problems with MDX, I'm switching to CSF. Here's a brief example (the second example from above).
export const FewAssets = (args) => (
<Selector assets={[fixtures[0], fixtures[1]]} />
);
FewAssets.args = {...};
// and so on with parameters or whatever.
I've read the docs many times now. I can't quite seem to figure out how to add copy to the page in CSF:
### Few Assets
With only a few assets, the slider works the same way but without moving the
thumbnails.
I thought of just adding it into the story definition, but then the docs page shows all that markup when you look at the code sample.
Am I missing something obvious?