From ee923978611afef45b84d22c90a5038daecf9d81 Mon Sep 17 00:00:00 2001
From: SokichiFujita <sokichi.fujita@gmail.com>
Date: Wed, 21 Mar 2018 19:18:24 +0900
Subject: [PATCH] update props

---
 src/components/editor.jsx     | 29 ++++++++++++++++++++---------
 src/components/playground.jsx | 23 +++++++++++++++++++----
 2 files changed, 39 insertions(+), 13 deletions(-)

diff --git a/src/components/editor.jsx b/src/components/editor.jsx
index af28e5c..b463059 100644
--- a/src/components/editor.jsx
+++ b/src/components/editor.jsx
@@ -11,13 +11,17 @@ class Editor extends Component {
 
   static propTypes = {
     className: PropTypes.string,
-    codeText: PropTypes.string,
     external: PropTypes.bool,
-    onChange: PropTypes.func,
+    codeText: PropTypes.string,
+    theme: PropTypes.string,
+    lineNumbers: PropTypes.bool,
+    smartIndent: PropTypes.bool,
+    lineWrapping: PropTypes.bool,
+    tabSize: PropTypes.number,
     readOnly: PropTypes.bool,
+    onChange: PropTypes.func,
     selectedLines: PropTypes.array,
-    style: PropTypes.object,
-    theme: PropTypes.string
+    style: PropTypes.object
   };
 
   componentDidMount = () => {
@@ -42,18 +46,25 @@ class Editor extends Component {
     const {
       className,
       external,
-      style,
       codeText,
       theme,
-      readOnly
+      lineNumbers,
+      smartIndent,
+      lineWrapping,
+      onChange,
+      tabSize,
+      readOnly,
+      selectedLines,
+      style,
     } = this.props;
 
     const options = {
       mode: "jsx",
-      lineNumbers: false,
-      lineWrapping: true,
-      smartIndent: false,
       matchBrackets: true,
+      lineWrapping,
+      smartIndent,
+      lineNumbers,
+      tabSize,
       theme,
       readOnly
     };
diff --git a/src/components/playground.jsx b/src/components/playground.jsx
index 453afdb..f627034 100644
--- a/src/components/playground.jsx
+++ b/src/components/playground.jsx
@@ -14,7 +14,11 @@ class ReactPlayground extends Component {
     noRender: true,
     context: {},
     initiallyExpanded: false,
-    onChange: () => {}
+    onChange: () => {},
+    lineNumbers: false,
+    lineWrapping: true,
+    smartIndent: false,
+    tabSize: 4,
   };
 
   static propTypes = {
@@ -30,7 +34,11 @@ class ReactPlayground extends Component {
     context: PropTypes.object,
     initiallyExpanded: PropTypes.bool,
     previewComponent: PropTypes.node,
-    onChange: PropTypes.func
+    onChange: PropTypes.func,
+    lineNumbers: PropTypes.bool,
+    lineWrapping: PropTypes.bool,
+    smartIndent: PropTypes.bool,
+    tabSize: PropTypes.number
   };
 
   state = {
@@ -73,6 +81,10 @@ class ReactPlayground extends Component {
       propDescriptionMap,
       scope,
       selectedLines,
+      lineNumbers,
+      lineWrapping,
+      smartIndent,
+      tabSize,
       theme } = this.props;
 
     return (
@@ -91,8 +103,11 @@ class ReactPlayground extends Component {
             external={external}
             onChange={this._handleCodeChange}
             selectedLines={selectedLines}
-            theme={theme}
-          />
+            lineNumbers={lineNumbers}
+            lineWrapping={lineWrapping}
+            smartIndent={smartIndent}
+            tabSize={tabSize}
+            theme={theme} />
         </div>
         {
           collapsableCode ?