Refactor SearchBar into a component

app/components/SearchBar.jsx

@@ -0,0 +1,61 @@
+import React from 'react'
+
+import mui from 'material-ui'
+import getMuiTheme from 'material-ui/lib/styles/getMuiTheme'
+
+import Search from 'material-ui/lib/svg-icons/action/search'
+
+import Item from 'Item'
+
+const {
+    TextField,
+    Styles,
+    Paper
+} = mui
+
+const colors = Styles.Colors
+
+const DefaultRawTheme = Styles.LightRawTheme
+
+export default class SearchBar extends React.Component {
+
+    constructor(props){
+        super(props)
+        this.state = {}
+    }
+
+    static get childContextTypes(){
+        return {muiTheme: React.PropTypes.object}
+    }
+
+    getChildContext() {
+        return {
+            muiTheme: this.context.muiTheme || getMuiTheme(DefaultRawTheme)
+        }
+    }
+
+    blank(){
+    
+    }
+
+    render(){
+        return (
+            <Paper id={this.props.id} className={this.props.className+ " noselect"} zDepth={0}>
+                <Item
+                    id="search-bar"
+                    active={false}
+                    selected={false}
+                    leftIcon={<Search color={colors.grey600}/>}
+                    rightIconButton={this.props.rightIconButton}>
+                    <TextField
+                        hintText={this.props.hintText || ""}
+                        style={{width: this.props.innerTextFieldWidth || 210}}
+                        onKeyDown={this.props.onKeyDown || this.blank}
+                        onEnterKeyDown={this.props.onEnterKeyDown || this.blank}
+                    />
+                </Item>
+            </Paper>
+        )
+    }
+}
+