Allows material BoolFields to be checkboxes or toggles

API.md

@@ -138,6 +138,13 @@ import BaseField from 'uniforms/BaseField';
 import BoolField from 'uniforms-unstyled/BoolField'; // Choose your theme package.
 
 <BoolField
+    //Field appearance.  Set to "toggle" to appear as a Material Toggle or to
+    // "checkbox" (or leave it undefined) to use a Checkbox appearance
+    // Available in:
+    //   material
+    appearance="toggle"   //Renders a material-ui Toggle
+    appearance="checkbox" //Renders a material-ui Checkbox
+
     // Field feedback state.
     //   *Some description would be great, huh?*
     // Available in:

packages/uniforms-material/src/BoolField.js

@@ -1,9 +1,11 @@
 import Checkbox       from 'material-ui/Checkbox';
 import React          from 'react';
+import Toggle         from 'material-ui/Toggle';
 import connectField   from 'uniforms/connectField';
 import filterDOMProps from 'uniforms/filterDOMProps';
 
 const Bool = ({
+    appearance = 'checkbox',
     disabled,
     id,
     inputRef,
@@ -13,16 +15,26 @@ const Bool = ({
     value,
     ...props
 }) =>
-    <Checkbox
-        checked={!!value}
-        disabled={disabled}
-        id={id}
-        label={label}
-        name={name}
-        onCheck={(event, value) => disabled || onChange(value)}
-        ref={inputRef}
-        {...filterDOMProps(props)}
-    />
-;
+    appearance === 'toggle' ? (
+        <Toggle
+            toggled={!!value}
+            disabled={disabled}
+            id={id}
+            label={label}
+            name={name}
+            onToggle={(event, value) => disabled || onChange(value)}
+            ref={inputRef}{...filterDOMProps(props)}
+        />
+    ) : (
+        <Checkbox
+            checked={!!value}
+            disabled={disabled}
+            id={id}
+            label={label}
+            name={name}
+            onCheck={(event, value) => disabled || onChange(value)}
+            ref={inputRef}{...filterDOMProps(props)}
+        />
+    );
 
 export default connectField(Bool);

packages/uniforms-material/test/combined.js

@@ -13,6 +13,7 @@ import MaterialRadioGroup  from 'material-ui/RadioButton/RadioButtonGroup';
 import MaterialSelectField from 'material-ui/SelectField';
 import MaterialTextField   from 'material-ui/TextField';
 import MaterialTimePicker  from 'material-ui/TimePicker';
+import MaterialToggle      from 'material-ui/Toggle';
 import getMuiTheme         from 'material-ui/styles/getMuiTheme';
 import lightBaseTheme      from 'material-ui/styles/baseThemes/lightBaseTheme';
 
@@ -57,7 +58,7 @@ describe('Everything', () => {
     const transform     = x => x;
     const checkboxes    = true;
     const allowedValues = ['1', '2', '3'];
-    const base = {label, required};
+    const base          = {label, required};
 
     const schema = {
         'x00':     {...base, __type__: Number},
@@ -92,7 +93,8 @@ describe('Everything', () => {
         'x31':     {...base, __type__: String, allowedValues, checkboxes, component: SelectField},
         'x32':     {...base, __type__: String, component: HiddenField},
         'x33':     {...base, __type__: String, component: HiddenField, value: undefined},
-        'x34':     {...base, __type__: Number, step: 4}
+        'x34':     {...base, __type__: Number, step: 4},
+        'x35':     {...base, __type__: Boolean, appearance: 'toggle'}
     };
 
     const bridgeName = name => name.replace(/\.\d+/g, '.$');
@@ -448,6 +450,19 @@ describe('Everything', () => {
         expect(onSubmit.lastCall.calledWithMatch({x32: 'x32'})).to.be.ok;
     });
 
+    it('works (BoolField, isToggle)', async () => {
+        const find = () => wrapper.find(MaterialToggle).filterWhere(x => x.props().name === 'x35');
+
+        expect(find().props()).to.have.property('toggled', false);
+        expect(find().props().onToggle({}, true)).to.equal(undefined);
+        expect(find().props()).to.have.property('toggled', true);
+
+        await new Promise(resolve => setTimeout(resolve, 5));
+
+        expect(onChange.lastCall.calledWith('x35', true)).to.be.ok;
+        expect(onSubmit.lastCall.calledWithMatch({x35: true})).to.be.ok;
+    });
+
     it('works (ListField, custom children)', async function _ () {
         this.timeout(30000);