LayerEditor keeps layer as own state

src/map.jsx

@@ -4,14 +4,29 @@ import ReactMapboxGl, { ZoomControl } from "react-mapbox-gl"
 import theme from './theme.js'
 
 export class Map extends React.Component {
+	static propTypes = {
+    styleManager: React.PropTypes.object.isRequired
+  }
+
 	constructor(props) {
-			super(props)
+		super(props)
+		this.map = null
+	}
+
+	onStyleChange(change) {
+		this.map[change.command].apply(this.map, change.args);
+	}
+
+	onMapLoaded(map) {
+		this.map = map;
+		this.props.styleManager.onStyleChange(this.onStyleChange.bind(this))
 	}
 
 	render() {
-		if (this.props.mapStyle) {
+		if (this.props.styleManager.mapStyle) {
 			return <ReactMapboxGl
-					style={this.props.mapStyle}
+					onStyleLoad={this.onMapLoaded.bind(this)}
+					style={this.props.styleManager.mapStyle}
 					accessToken="pk.eyJ1IjoibW9yZ2Vua2FmZmVlIiwiYSI6IjIzcmN0NlkifQ.0LRTNgCc-envt9d5MzR75w">
 					<ZoomControl/>
 			</ReactMapboxGl>
@@ -19,4 +34,3 @@ export class Map extends React.Component {
 		return <div style={{backgroundColor: theme.colors.black}}/>
 	}
 }
-