Storybook Knobs Addon for react-native
This addon is depcrecated in favour of controls, please only use it for transitioning to CSF, Args and Controls
See examples for migrating from Knobs to Controls in the web Controls Addon README.
Storybook Knobs Addon allows you to edit react props using the Storybook UI using variables inside stories in Storybook.
Framework Support
This is a wrapper for the addon @storybook/addon-knobs Refer to its documentation to understand how to use knobs
Installation
yarn add -D @storybook/addon-ondevice-knobs @storybook/addon-knobs @react-native-community/datetimepicker @react-native-community/slider
Configuration
Add following content to .storybook/main.js
:
module.exports = {
addons: ['@storybook/addon-ondevice-knobs'],
};
Make sure to use the withKnobs decorator when using knobs import { withKnobs } from '@storybook/addon-ondevice-knobs';
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