Emit dark mode event via addons channel

[pveyes]

This way we can integrate storybook dark mode with custom theme provider by creating custom decorator. We can do this by adding callback after setState in https://github.com/hipstersmoothie/storybook-dark-mode/blob/master/src/Tool.tsx#L37 by calling channel.emit('DARK_MODE', isDark)

I can create the PR if you want

Example usage

const channel = addons.getChannel();

function ThemeWrapper(props) {
  const [dark, setDark] = useState(false);
  useEffect(() => {
    channel.on('DARK_MODE', setDark)
  });

 return (
    <ThemeProvider value={isDark ? darkTheme : defaultTheme}>
      {props.children}
    </ThemeProvider>
  );
}

addDecorator(renderStory => <ThemeWrapper>{renderStory()}</ThemeWrapper>)

[hipstersmoothie]

Make a PR 😄 So this is for rendering your story in dark mode as well? Interesting use case. I like it! Make sure to add some docs to the Readme too

[hipstersmoothie]

Would it make sense to also expose the ThemeWrapper decorator too? Or maybe this is too dependent upon what styles framework they use. Docs might be sufficient then

[pveyes]

@hipstersmoothie in our case we have custom ThemeProvider because we don't use emotion. I think it's safer not to include the decorator because usually custom theme is too coupled with the framework that the users use

PR ready. Not sure how to test this in the PR but I already have a fork that works