Merge pull request #916 from nlopin/fix-toolbar-options

fix: toolbar shows all the options

stories/ControlledSelectedOptions/index.js

@@ -0,0 +1,31 @@
+/* @flow */
+
+import React, { useState } from 'react';
+import { Editor } from '../../src';
+
+const ControlledSelectedOptions = () => {
+    const [state, setState] = useState();
+
+    return (<div className="rdw-storybook-root">
+        <h3>Editor with only selected toolbar options.</h3>
+        <Editor
+            editorState={state}
+            onEditorStateChange={e => setState(e)}
+            toolbar={{
+                blockType: {
+                    inDropdown: true,
+                    options: ['Normal', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6'],
+                },
+                inline: {
+                    options: ['bold', 'italic'],
+                },
+                list: {
+                    options: ['unordered', 'ordered'],
+                },
+                options: ['blockType', 'inline', 'list'],
+            }}
+        />
+    </div>)
+};
+
+export default ControlledSelectedOptions;

stories/index.js

@@ -13,6 +13,7 @@ import ImageUpload from './ImageUpload';
 import Embeddable from "./Embeddable";
 import ImageDataURI from './ImageDataURI';
 import SelectedOptions from './SelectedOptions';
+import ControlledSelectedOptions from './ControlledSelectedOptions';
 import FloatingToolbar from './FloatingToolbar';
 import CustomToolbar from './CustomToolbar';
 import ConvertToHTML from './ConvertToHTML';
@@ -34,7 +35,8 @@ storiesOf('ToolbarHidden', module).add('story', () => <ToolbarHidden />);
 storiesOf('FocusBlurCallbacks', module).add('story', () => <FocusBlurCallbacks />);
 storiesOf('HashTag', module).add('story', () => <HashTag />);
 storiesOf('Mention', module).add('story', () => <Mention />);
-storiesOf('SelectedOptions', module).add('story', () => <SelectedOptions />);
+storiesOf('SelectedOptions', module).add('uncontrolled', () => <SelectedOptions />)
+    .add('controlled', () => <ControlledSelectedOptions />);
 storiesOf('CustomToolbar', module).add('story', () => <CustomToolbar />);
 storiesOf('FloatingToolbar', module).add('story', () => <FloatingToolbar />);
 storiesOf('ImageUpload and Alt attribute', module).add('story', () => <ImageUpload />);