Add rudimentary boolean field

src/fields/boolean.jsx

@@ -0,0 +1,27 @@
+import React from 'react'
+import inputStyle from './input.js'
+
+class BooleanField extends React.Component {
+  static propTypes = {
+    onChange: React.PropTypes.func.isRequired,
+    name: React.PropTypes.string.isRequired,
+    value: React.PropTypes.bool,
+    doc: React.PropTypes.string,
+  }
+
+  render() {
+    return <div style={inputStyle.property}>
+      <label style={inputStyle.label}>{this.props.name}</label>
+      <input
+        type="checkbox"
+        style={inputStyle.checkbox}
+        value={this.props.value}
+        onChange={e => {this.props.onChange(!this.props.value)}}
+        checked={this.props.value}
+      >
+      </input>
+    </div>
+  }
+}
+
+export default BooleanField

src/fields/spec.jsx

@@ -5,6 +5,7 @@ import color from 'color'
 import GlSpec from 'mapbox-gl-style-spec/reference/latest.min.js'
 import NumberField from './number'
 import EnumField from './enum'
+import BooleanField from './boolean'
 import ColorField from './color'
 import StringField from './string'
 import inputStyle from './input.js'
@@ -30,6 +31,7 @@ class ZoomSpecField extends React.Component {
       React.PropTypes.object,
       React.PropTypes.string,
       React.PropTypes.number,
+      React.PropTypes.bool,
     ]),
   }
 
@@ -122,6 +124,14 @@ class SpecField extends React.Component {
           doc={this.props.fieldSpec.doc}
         />
       )
+      case 'boolean': return (
+        <BooleanField
+          onChange={this.onValueChanged.bind(this, this.props.fieldName)}
+          value={this.props.value}
+          name={label}
+          doc={this.props.fieldSpec.doc}
+        />
+      )
       default: return null
     }
   }