Adde clearedValue override from field.

Author: Hyperkid123

packages/pf4-component-mapper/src/tests/field-array/__snapshots__/field-array.test.js.snap

@@ -24,7 +24,6 @@ exports[`FieldArray should render array field correctly 1`] = `
     buttonClassName=""
     buttonsLabels={Object {}}
     clearOnUnmount={false}
-    clearedValue="foo"
     disableSubmit={Array []}
     formFieldsMapper={
       Object {
@@ -136,7 +135,7 @@ exports[`FieldArray should render array field correctly 1`] = `
                     "blur": [Function],
                     "change": [Function],
                     "clearOnUnmount": false,
-                    "clearedValue": "foo",
+                    "clearedValue": undefined,
                     "concat": [Function],
                     "destroyOnUnregister": false,
                     "focus": [Function],
@@ -198,7 +197,7 @@ exports[`FieldArray should render array field correctly 1`] = `
                       "blur": [Function],
                       "change": [Function],
                       "clearOnUnmount": false,
-                      "clearedValue": "foo",
+                      "clearedValue": undefined,
                       "concat": [Function],
                       "destroyOnUnregister": false,
                       "focus": [Function],
@@ -254,7 +253,7 @@ exports[`FieldArray should render array field correctly 1`] = `
                         "blur": [Function],
                         "change": [Function],
                         "clearOnUnmount": false,
-                        "clearedValue": "foo",
+                        "clearedValue": undefined,
                         "concat": [Function],
                         "destroyOnUnregister": false,
                         "focus": [Function],
@@ -311,7 +310,7 @@ exports[`FieldArray should render array field correctly 1`] = `
                           "blur": [Function],
                           "change": [Function],
                           "clearOnUnmount": false,
-                          "clearedValue": "foo",
+                          "clearedValue": undefined,
                           "concat": [Function],
                           "destroyOnUnregister": false,
                           "focus": [Function],
@@ -405,7 +404,7 @@ exports[`FieldArray should render array field correctly 1`] = `
                             "blur": [Function],
                             "change": [Function],
                             "clearOnUnmount": false,
-                            "clearedValue": "foo",
+                            "clearedValue": undefined,
                             "concat": [Function],
                             "destroyOnUnregister": false,
                             "focus": [Function],

packages/react-form-renderer/demo/index.js

@@ -25,7 +25,8 @@ const App = () => (
     <div style={{ padding: 20 }}>
         <FormRenderer
             initialValues={{
-                text_box_1: 'hue'
+                text_box_1: 'hue',
+                text_box_3: 'initial'
             }}
             clearedValue={'bla'}
             layoutMapper={layoutMapper}

packages/react-form-renderer/demo/sandbox.js

@@ -36,6 +36,7 @@ const output = {
       label: 'Text Box 3',
       isRequired: true,
       component: components.TEXT_FIELD,
+      clearedValue: 'override',
       validate: [
         { type: validators.MIN_LENGTH, treshold: 12, message: 'bar' },
       ],

packages/react-form-renderer/src/form-renderer/field-provider.js

@@ -21,9 +21,11 @@ class FieldProvider extends Component{
 
   render(){
     const { clearOnUnmount, component, render, dataType, children, ...props } = this.props;
+    const fieldClearedValue = props.hasOwnProperty('clearedValue') ? props.clearedValue : props.formOptions.clearedValue;
+    const { clearedValue, ...fieldProps } = props;
     if (component) {
       const FieldComponent = component;
-      return <Field { ...props } render={ ({ input: { onChange, ...input }, ...fieldsProps }) => (
+      return <Field { ...fieldProps } render={ ({ input: { onChange, ...input }, ...fieldsProps }) => (
         <FieldComponent
           { ...fieldsProps }
           input={{
@@ -33,7 +35,7 @@ class FieldProvider extends Component{
                 ...fieldsProps.meta,
                 dataType,
                 onChange,
-                clearedValue: this.props.formOptions.clearedValue,
+                clearedValue: fieldClearedValue,
               }, ...args);
             },
           }}
@@ -42,7 +44,7 @@ class FieldProvider extends Component{
     }
 
     if (render) {
-      return <Field { ...props } render={ ({ input: { onChange, ...input }, ...fieldsProps }) => render({
+      return <Field { ...fieldProps } render={ ({ input: { onChange, ...input }, ...fieldsProps }) => render({
         ...fieldsProps,
         input: {
           ...input,
@@ -51,15 +53,15 @@ class FieldProvider extends Component{
               ...fieldsProps.meta,
               dataType,
               onChange,
-              clearedValue: this.props.formOptions.clearedValue,
+              clearedValue: fieldClearedValue,
             }, ...args),
         },
       }) } />;
     }
 
     const ChildComponent = children;
     return (
-      <Field { ...props }>
+      <Field { ...fieldProps }>
         { ({ input: { onChange, ...input }, ...fieldsProps }) =>
           Children.only(
             <ChildComponent
@@ -69,7 +71,7 @@ class FieldProvider extends Component{
                   ...fieldsProps.meta,
                   dataType,
                   onChange,
-                  clearedValue: this.props.formOptions.clearedValue,
+                  clearedValue: fieldClearedValue,
                 }, ...args)  }}
             />
           ) }

packages/react-form-renderer/src/tests/form-renderer/enhanced-on-change.test.js

@@ -34,7 +34,7 @@ describe('#enhancedOnChange', () => {
     expect(enhancedOnChange({ dataType: 'integer', onChange: value => value, clearedValue }, value)).toEqual([ 1, 2, 3 ]);
   });
 
-  describe('#setting delete value', () => {
+  describe('#setting cleared value', () => {
     it('should not set any delete value after sending empty value', () => {
       const value = undefined;
       expect(enhancedOnChange({ onChange: value => value, clearedValue }, value)).toEqual(undefined);