From 517cf8cbf478cc0bee34723635927d1f589fd197 Mon Sep 17 00:00:00 2001
From: Jeppe Reinhold <jeppereinhold@gmail.com>
Date: Thu, 19 Oct 2017 22:18:29 +0200
Subject: [PATCH] added guide to move panel to right side

---
 README.md | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/README.md b/README.md
index 17185f9..ec48db1 100644
--- a/README.md
+++ b/README.md
@@ -80,3 +80,39 @@ storiesOf('App')
     <App />
   ))
 ```
+
+## Show Figma design in right panel
+
+If you find that the Figma panel at the bottom is not big enough to fit your designs, it is possible to move the panel to the right of the window instead, where it is possible to give it more space. This requires the [@storybook/addons-options](https://github.com/storybooks/storybook/tree/master/addons/options) addon. Note however that it is only possible to do this for **all** stories at once, and will move all addon panels to the right. A simple setup is shown here.
+
+Install the addon
+
+```sh
+npm install --save-dev @storybook/addon-options
+```
+
+Register the options addon in your `addons.js`
+
+```jsx
+// in .storybook/addons.js
+import '@storybook/addon-actions/register'
+import 'storybook-addon-figma/register'
+// register the options addon
+import '@storybook/addon-options/register';
+```
+
+Import and use the `setOptions` function in your `config.js` file
+
+```jsx
+// in .storybook/config.js
+import * as storybook from '@storybook/react';
+// import the options function
+import { setOptions } from '@storybook/addon-options';
+
+// set option to show panel in right side
+setOptions({
+  downPanelInRight: true,
+});
+
+storybook.configure(() => require('./stories'), module);
+```