From bd862fa9cc528105bb48cde6f1329802dfe21675 Mon Sep 17 00:00:00 2001
From: Vladimir Borisov <borisov1024@gmail.com>
Date: Tue, 17 Sep 2019 09:56:41 +0300
Subject: [PATCH] Example usage of the coor picker

---
 storybook/stories/ColorPicker/ColorPicker.js | 21 +++++++++++++-------
 1 file changed, 14 insertions(+), 7 deletions(-)

diff --git a/storybook/stories/ColorPicker/ColorPicker.js b/storybook/stories/ColorPicker/ColorPicker.js
index b86938fd4..68057edb8 100644
--- a/storybook/stories/ColorPicker/ColorPicker.js
+++ b/storybook/stories/ColorPicker/ColorPicker.js
@@ -3,10 +3,17 @@ const { storiesOf } = require('@storybook/react');
 const { ColorPicker } = require('stremio/common');
 const styles = require('./styles');
 
-storiesOf('ColorPicker', module).add('ColorPicker', () => (
-    <ColorPicker
-        className={styles['color-picker-container']}
-        value={'#000000'}
-        onChange={(color) => { console.log(color) }}
-    />
-));
+const ColorPickerExampleusage = () => {
+    const [color, setColor] = React.useState('rgba(166, 196, 213, 0.97)');
+    return (
+        <div style={{ color: 'var(--color-surfacelighter)', padding: '1em' }}>
+            <ColorPicker
+                className={styles['color-picker-container']}
+                value={color}
+                onChange={(color) => { setColor(color) }}
+            />
+            <div style={{ marginTop: '1em' }}>Current color is {color}</div>
+        </div>
+    );
+}
+storiesOf('ColorPicker', module).add('ColorPicker', () => <ColorPickerExampleusage />);