Storybook

Setup Files

preview.js

https://storybook.js.org/docs/react/builders/builder-api#handle-previewjs-exports

Control how the story renders in the UI

  • Controls how story renders in UI
  • Decorators
    • decorators named export
    • Unsure how addDecorator() function relates to the export

preview-head.html

https://storybook.js.org/docs/react/configure/story-rendering

  • Add to preview iframe’s head, like stylesheets and fonts

preview-body.html

https://storybook.js.org/docs/react/configure/story-rendering

  • Add to preview iframe’s body, like content root tags
  • Suggests that changes to base font size needs to happen in body, not head

manager-head.html

https://storybook.js.org/docs/react/configure/theming#css-escape-hatches

  • For styling Storybook’s UI
  • Apparently this was needed to style documentation presented in Storybook that included code snippets

Delay

rest.get('someUrl', (_req, res, ctx) =>
  res(
    ctx.delay(3000),
    ctx.json({some: 'response'}),
  ),
)