Storybook Backgrounds Addon for React Native
Storybook Backgrounds Addon for React Native can be used to change background colors of your stories right from the device.
Installation
yarn add -D @storybook/addon-ondevice-backgrounds @storybook/addons
Configuration
Then, add following content to .storybook/main.js
:
module.exports = {
addons: ['@storybook/addon-ondevice-backgrounds'],
};
Usage
See the example of using the Backgrounds Addon with Component Story Format. You can also run the react-native app to see it in action.
The web Backgrounds Addon documentation may also be useful, but the examples there have not been tested with Storybook for React Native.
v6.0.1-beta.11
What's Changed
- fix: default the list item active color if theme value is undefined by @jgornick in https://github.com/storybookjs/react-native/pull/404
- feat: react native server v6 (experimental) by @dannyhw in https://github.com/storybookjs/react-native/pull/393
- feat: re-add knobs to provide compatibility for easier migration by @dannyhw in https://github.com/storybookjs/react-native/pull/406
Breaking:
- storybook dependencies must now be 6.5.14 and above since new fixes were included in this version that are required for this to work
- backgrounds are now using the new config format to match the web (see below)
parameters: {
backgrounds: {
default: 'warm',
values: [
{ name: 'warm', value: 'hotpink' },
{ name: 'cool', value: 'deepskyblue' },
],
},
},
Full Changelog: https://github.com/storybookjs/react-native/compare/v6.0.1-beta.10...v6.0.1-beta.11