extract widthhandler as prop

components/Carbon.js

@@ -11,7 +11,6 @@ hljs.registerLanguage('javascript', javascript)
 
 import { Spinner } from './Spinner'
 import WindowControls from './WindowControls'
-import WidthHandler from './WidthHandler'
 
 import {
   COLORS,
@@ -224,14 +223,7 @@ class Carbon extends React.PureComponent {
                 <div className="alpha eliminateOnRender" />
                 <div className="bg" />
               </div>
-
+              {this.props.widthHandler}
-              {/* TODO pass in this child as a prop to Carbon */}
-              <WidthHandler
-                innerRef={this.props.innerRef}
-                onChange={this.props.updateWidth}
-                onConfirm={this.props.confirmWidth}
-                paddingHorizontal={config.paddingHorizontal}
-              />
             </div>
           )}
         </div>

components/Editor.js

@@ -17,6 +17,7 @@ import ShareMenu from './ShareMenu'
 import CopyMenu from './CopyMenu'
 import Themes from './Themes'
 import FontFace from './FontFace'
+import WidthHandler from './WidthHandler'
 import LanguageIcon from './svg/Language'
 import {
   LANGUAGES,
@@ -399,12 +400,18 @@ class Editor extends React.Component {
                 ref={this.carbonNode}
                 config={this.state}
                 onChange={this.updateCode}
-                updateWidth={this.updateWidth}
-                confirmWidth={this.confirmWidth}
                 loading={this.state.loading}
                 theme={theme}
                 titleBar={titleBar}
                 onTitleBarChange={this.updateTitleBar}
+                widthHandler={
+                  <WidthHandler
+                    innerRef={this.carbonNode}
+                    onChange={this.updateWidth}
+                    onConfirm={this.confirmWidth}
+                    paddingHorizontal={config.paddingHorizontal}
+                  />
+                }
               >
                 {code != null ? code : DEFAULT_CODE}
               </Carbon>