How to use addon-docs like addon-notes?

[iwan-uschka]

Or in other words: how can addon-docs be used for showing story specific notes as we were able to do so with addon-notes?

I already use addon-docs for displaying component's JSDoc. It works great!

I need to display additional notes for each story, like a little how-to or guide on what exactly is being addressed in that story.

As i can see on https://github.com/storybookjs/storybook, addon-docs is the addon to

Add high quality documentation to your components

and addon-notes to

Annotate Storybook stories with notes

=> component level vs. story level

So unfortunately i don't have any clue how to deal with

If you're using info/notes, we highly recommend you to migrate to docs instead, and here is a guide to help you.

[fabiradi]

If you use MDX to write stories, it will get closer to what you might want to achieve. While there is no dedicated field for notes, MDX is way more flexible. You could combine multiple stories, code samples, and lots of describing text, which was not really possible with addon-notes. However, it is different and it takes some time to get used to. Maybe that helps...

[shilman]

If you follow this recipe, you can associate an MDX file with a story: https://github.com/storybookjs/storybook/blob/next/addons/docs/docs/recipes.md#csf-stories-with-arbitrary-mdx

If you only put markdown in the story, you can approximately achieve the Notes behavior.

@jonniebigodes we should get this into the official documentation

[iwan-uschka]

Sorry for getting back to this one that late. MDX is no option, we're using TSX files consequently.

Following the migration notes at https://github.com/storybookjs/storybook/blob/next/addons/docs/docs/recipes.md#migrating-from-notesinfo-addons results in the component description being replaced with the notes. We want(ed) to show notes additionally in an extra tab.