2019-02-14 16:27:33 +01:00

1.8 KiB

Storybook Addon On Device Knobs

Storybook Addon On Device Knobs allow you to edit React props dynamically using the Storybook UI. You can also use Knobs as a dynamic variable inside stories in Storybook.

Framework Support

This is how Knobs look like:

Storybook Knobs Demo

This addon is a wrapper for addon @storybook/addon-knobs. Refer to its documentation to understand how to use knobs

Getting Started

First of all, you need to install knobs into your project.

yarn add @storybook/addon-ondevice-knobs --dev

Then create a file called rn-addons.js in your storybook config.

import '@storybook/addon-ondevice-knobs/register';

Then import rn-addons.js next to your getStorybookUI call.

import './rn-addons';

Now, write your stories with knobs.

Refer to @storybook/addon-knobs to learn how to write stories.

Note: you'll still have to install @storybook/addon-knobs as well and import withKnobs and all knob types (e.g. select, text etc) from that module.