diff --git a/src/components/FieldBoolean/FieldBoolean.example.js b/src/components/FieldBoolean/FieldBoolean.example.js
index fd7ccc91..818161b8 100644
--- a/src/components/FieldBoolean/FieldBoolean.example.js
+++ b/src/components/FieldBoolean/FieldBoolean.example.js
@@ -1,42 +1,50 @@
import React from 'react';
-import { reduxForm, propTypes as formPropTypes } from 'redux-form';
+import { Form as FinalForm, FormSpy } from 'react-final-form';
import * as validators from '../../util/validators';
import { Button } from '../../components';
import FieldBoolean from './FieldBoolean';
const formName = 'Styleguide.FieldBoolean.Form';
-const FormComponent = props => {
- const { form, handleSubmit, invalid, pristine, submitting } = props;
- const required = validators.requiredBoolean('This field is required');
- const submitDisabled = invalid || pristine || submitting;
- return (
-
- );
-};
-
-FormComponent.propTypes = formPropTypes;
-
-const Form = reduxForm({
- form: formName,
-})(FormComponent);
+const FormComponent = props => (
+ {
+ const { form, handleSubmit, onChange, invalid, pristine, submitting } = props;
+ const required = validators.requiredBoolean('This field is required');
+ const submitDisabled = invalid || pristine || submitting;
+ return (
+
+ );
+ }}
+ />
+);
export const YesNo = {
- component: Form,
+ component: FormComponent,
props: {
- onChange(values) {
- console.log('onChange:', values);
+ onChange: formState => {
+ if (Object.keys(formState.values).length > 0) {
+ console.log('form values changed to:', formState.values);
+ }
},
onSubmit(values) {
console.log('onSubmit:', values);
diff --git a/src/components/FieldBoolean/FieldBoolean.js b/src/components/FieldBoolean/FieldBoolean.js
index 63340ac5..3f19edcc 100644
--- a/src/components/FieldBoolean/FieldBoolean.js
+++ b/src/components/FieldBoolean/FieldBoolean.js
@@ -1,6 +1,6 @@
import React from 'react';
import { injectIntl, intlShape } from 'react-intl';
-import { SelectField } from '../../components';
+import { FieldSelect } from '../../components';
const FieldBoolean = props => {
const { placeholder, intl, ...rest } = props;
@@ -30,11 +30,11 @@ const FieldBoolean = props => {
},
};
return (
-
+
-
+
);
};