@maif/react-forms 1.0.38 → 1.0.41

package/lib/esm/index.js

@@ -22,7 +22,8 @@ var type = {
   bool: 'bool',
   date: 'date',
   object: 'object',
-  file: 'file'
+  file: 'file',
+  json: 'json'
 };
 
 var format = {
@@ -219,9 +220,9 @@ var _oneOf = function oneOf(arrayOfValues) {
 var _blacklist = function blacklist(arrayOfValues) {
   var message = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "This value can't include the following values ".concat(arrayOfValues.join(', '));
   return function (r) {
-    return r.test('blacklist' + Date.now(), message, function (value) {
+    return r.test('blacklist', message, function (value) {
       return !arrayOfValues.some(function (f) {
-        return value.includes(f);
+        return (value || '').includes(f);
       });
     });
   };
@@ -451,6 +452,10 @@ function _extends() {
   return _extends.apply(this, arguments);
 }
 
+function _readOnlyError(name) {
+  throw new TypeError("\"" + name + "\" is read-only");
+}
+
 function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest();
 }
@@ -642,6 +647,9 @@ var style = (_style = {
   d_none: {
     display: "none"
   },
+  flexWrap: {
+    flexWrap: 'wrap'
+  },
   flex: {
     display: "flex"
   },
@@ -1068,7 +1076,7 @@ var SelectInput = /*#__PURE__*/React.forwardRef(function (props, _) {
         display: 'flex'
       }
     }, values.map(function (v, idx) {
-      var active = props.isMulti ? value.includes(v) : v.value === value.value;
+      var active = !!value && (props.isMulti ? value.includes(v) : v.value === value.value);
       return /*#__PURE__*/React.createElement("button", {
         key: idx,
         type: "button",
@@ -28452,7 +28460,7 @@ function Editor(parent, mode, onChange, value) {
         }
       } catch (_) {}
     }), EditorView.editable.of(!readOnly)]),
-    doc: !value ? '' : _typeof(value) === 'object' ? value.value : value
+    doc: value === null || value === undefined ? '' : _typeof(value) === 'object' ? value.value : value
   });
   return new EditorView({
     state: state,
@@ -28499,13 +28507,16 @@ function CodeInput(_ref) {
     setEditor(e);
   }, []);
   useEffect(function () {
-    if (editor && (_typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value) !== editor.state.doc.toString()) editor.dispatch({
-      changes: {
-        from: 0,
-        to: editor.state.doc.length,
-        insert: value === null ? '' : _typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value
-      }
-    });
+    if (editor && (_typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value) !== editor.state.doc.toString()) {
+      console.log("set value", value, value === null || value === undefined ? '' : _typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value, editor.state.doc.toString());
+      editor.dispatch({
+        changes: {
+          from: 0,
+          to: editor.state.doc.length,
+          insert: value === null || value === undefined ? '' : _typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value
+        }
+      });
+    }
   }, [value]);
   return /*#__PURE__*/React.createElement("div", {
     ref: ref
@@ -28535,7 +28546,7 @@ var MarkdownInput = function MarkdownInput(props) {
     if (preview) {
       showPreview();
     }
-  }, [preview]);
+  }, [preview, props.value]);
   var commands = [{
     name: 'Add header',
     icon: 'heading',
@@ -28728,7 +28739,7 @@ var MarkdownInput = function MarkdownInput(props) {
       return setPreview(true);
     }
   }, "Preview"))), /*#__PURE__*/React.createElement("div", {
-    className: classNames(classes.flex)
+    className: classNames(classes.flex, classes.flexWrap)
   }, injectButtons())), !preview && /*#__PURE__*/React.createElement(CodeInput, _extends({}, props, {
     setRef: function setRef(e) {
       return ref.current = e;
@@ -28796,6 +28807,8 @@ var resolvers = (_resolvers = {}, _defineProperty$1(_resolvers, type.string, fun
   return yup.date().nullable().optional().typeError(typeErrorMessage || 'Value must be a date');
 }), _defineProperty$1(_resolvers, type.file, function () {
   return yup.mixed();
+}), _defineProperty$1(_resolvers, type.json, function () {
+  return yup.mixed();
 }), _resolvers);
 var buildSubResolver = function buildSubResolver(props, key, dependencies, rawData) {
   var _props$constraints = props.constraints,
@@ -28901,7 +28914,6 @@ var getShapeAndDependencies = function getShapeAndDependencies(flow, schema) {
 };
 
 var CustomizableInput$1 = /*#__PURE__*/React.memo(function (props) {
-  // console.log("CUSTOMIZABLE_INPUT" + props.field.name)
   if (props.render) {
     return props.render(_objectSpread2$1(_objectSpread2$1({}, props.field), {}, {
       error: props.error
@@ -28910,14 +28922,15 @@ var CustomizableInput$1 = /*#__PURE__*/React.memo(function (props) {
 
   return props.children;
 }, function (prev, next) {
-  return prev.field.value === next.field.value;
+  return prev.field.value === next.field.value && next.errorDisplayed === prev.errorDisplayed;
 });
 var ControlledInput = function ControlledInput(_ref) {
   var defaultValue = _ref.defaultValue,
       step = _ref.step,
       entry = _ref.entry,
       children = _ref.children,
-      component = _ref.component;
+      component = _ref.component,
+      errorDisplayed = _ref.errorDisplayed;
 
   var _useController = useController({
     defaultValue: defaultValue || null,
@@ -28958,8 +28971,7 @@ var ControlledInput = function ControlledInput(_ref) {
         } else {
           return e;
         }
-      }(); // field.onChange(!e ? null : e.target ? e.target.value || null : e)
-
+      }();
 
       field.onChange(value);
       option(step.onChange).map(function (onChange) {
@@ -28985,7 +28997,8 @@ var ControlledInput = function ControlledInput(_ref) {
       },
       rawValues: getValues()
     }, field),
-    error: error
+    error: error,
+    errorDisplayed: errorDisplayed
   }, component ? component(field, props) : /*#__PURE__*/React.cloneElement(children, _objectSpread2$1({}, props)));
 };
 
@@ -29087,7 +29100,7 @@ var defaultVal = function defaultVal(value, array, defaultValue) {
 };
 
 var getDefaultValues = function getDefaultValues(flow, schema, value) {
-  return flow.reduce(function (acc, key) {
+  return (flow || []).reduce(function (acc, key) {
     if (_typeof$1(key) === 'object') {
       return _objectSpread2$1(_objectSpread2$1({}, acc), getDefaultValues(key.flow, schema, value));
     }
@@ -29165,7 +29178,17 @@ var cleanOutputArray = function cleanOutputArray(obj, subSchema) {
 
       return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, cleanOutputArray(v, ((_subSchema$key3 = subSchema[key]) === null || _subSchema$key3 === void 0 ? void 0 : _subSchema$key3.schema) || {})));
     } else {
-      return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, v));
+      var _subSchema$key4;
+
+      if (((_subSchema$key4 = subSchema[key]) === null || _subSchema$key4 === void 0 ? void 0 : _subSchema$key4.type) === 'json') {
+        try {
+          return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, JSON.parse(v)));
+        } catch (err) {
+          return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, v));
+        }
+      } else {
+        return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, v));
+      }
     }
   }, {});
 };
@@ -29592,7 +29615,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement("textarea", {
             type: "text",
             className: classNames(classes.input, _defineProperty$1({}, classes.input__invalid, errorDisplayed))
@@ -29604,7 +29628,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement(Component, {
             className: classNames(_defineProperty$1({}, classes.input__invalid, errorDisplayed))
           }));
@@ -29613,7 +29638,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement(MarkdownInput, {
             className: classNames(_defineProperty$1({}, classes.input__invalid, errorDisplayed))
           }));
@@ -29624,7 +29650,8 @@ var Step = function Step(_ref9) {
             return /*#__PURE__*/React.createElement(ControlledInput, {
               defaultValue: defaultValue,
               step: step,
-              entry: entry
+              entry: entry,
+              errorDisplayed: errorDisplayed
             }, /*#__PURE__*/React.createElement(SelectInput, {
               className: classNames(classes.flex_grow_1, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
               disabled: functionalProperty(entry, step.disabled),
@@ -29633,7 +29660,6 @@ var Step = function Step(_ref9) {
               isMulti: step.isMulti,
               createOption: step.createOption,
               transformer: step.transformer,
-              optionsFrom: step.optionsFrom,
               buttons: step.format === format.buttonsSelect
             }));
           }
@@ -29642,7 +29668,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement("input", {
             type: step.format || 'text',
             className: classNames(classes.input, _defineProperty$1({}, classes.input__invalid, errorDisplayed))
@@ -29656,7 +29683,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement(SelectInput, {
             className: classNames(classes.content, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
             possibleValues: step.options,
@@ -29665,7 +29693,6 @@ var Step = function Step(_ref9) {
             createOption: step.createOption,
             onCreateOption: step.onCreateOption,
             transformer: step.transformer,
-            optionsFrom: step.optionsFrom,
             buttons: step.format === format.buttonsSelect
           }));
 
@@ -29673,7 +29700,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement("input", {
             type: step.format || 'number',
             className: classNames(classes.input, _defineProperty$1({}, classes.input__invalid, errorDisplayed))
@@ -29684,7 +29712,8 @@ var Step = function Step(_ref9) {
       return /*#__PURE__*/React.createElement(ControlledInput, {
         defaultValue: defaultValue,
         step: step,
-        entry: entry
+        entry: entry,
+        errorDisplayed: errorDisplayed
       }, /*#__PURE__*/React.createElement(BooleanInput, {
         className: classNames(_defineProperty$1({}, classes.input__invalid, errorDisplayed))
       }));
@@ -29696,7 +29725,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement(SelectInput, {
             className: classNames(classes.flex_grow_1, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
             possibleValues: step.options,
@@ -29705,7 +29735,6 @@ var Step = function Step(_ref9) {
             createOption: step.createOption,
             onCreateOption: step.onCreateOption,
             transformer: step.transformer,
-            optionsFrom: step.optionsFrom,
             buttons: step.format === format.buttonsSelect
           }));
 
@@ -29747,10 +29776,12 @@ var Step = function Step(_ref9) {
             defaultValue: defaultValue,
             step: step,
             entry: entry,
+            errorDisplayed: errorDisplayed,
             component: function component(field, props) {
               return /*#__PURE__*/React.createElement(CodeInput, _extends({}, props, {
                 className: classNames(_defineProperty$1({}, classes.input__invalid, error)),
                 onChange: function onChange(e) {
+                  _readOnlyError("errorDisplayed");
                   var v;
 
                   try {
@@ -29777,7 +29808,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement(ObjectInput, {
             className: classNames(_defineProperty$1({}, classes.input__invalid, errorDisplayed)),
             possibleValues: step.options
@@ -29788,7 +29820,8 @@ var Step = function Step(_ref9) {
       return /*#__PURE__*/React.createElement(ControlledInput, {
         defaultValue: defaultValue,
         step: step,
-        entry: entry
+        entry: entry,
+        errorDisplayed: errorDisplayed
       }, /*#__PURE__*/React.createElement(DatePicker, {
         className: classNames(classes.datepicker, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
         formatStyle: "large"
@@ -29853,11 +29886,35 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React.createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React.createElement(FileInput, null));
         }
       });
 
+    case type.json:
+      return /*#__PURE__*/React.createElement(ControlledInput, {
+        defaultValue: defaultValue,
+        step: step,
+        entry: entry,
+        component: function component(field, props) {
+          return /*#__PURE__*/React.createElement(CodeInput, _extends({}, props, {
+            className: classNames(_defineProperty$1({}, classes.input__invalid, error)),
+            onChange: function onChange(v) {
+              field.onChange(v);
+              option(step.onChange).map(function (onChange) {
+                return onChange({
+                  rawValues: getValues(),
+                  value: v,
+                  setValue: _setValue
+                });
+              });
+            },
+            value: field.value
+          }));
+        }
+      });
+
     default:
       return null;
   }
@@ -29935,10 +29992,11 @@ var ArrayStep = function ArrayStep(_ref12) {
     type: "button",
     className: classNames(classes.btn, classes.btn_blue, classes.btn_sm, classes.mt_5, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
     onClick: function onClick() {
+      var newValue = cleanInputArray({}, getValues(entry), step.flow, step.schema);
       append({
-        value: step.addableDefaultValue || defaultVal(null)
-      });
-      trigger(entry);
+        value: step.addableDefaultValue || (newValue ? newValue : defaultVal())
+      }); // trigger(entry);
+
       option(step.onChange).map(function (onChange) {
         return onChange({
           rawValues: getValues(),
@@ -29954,7 +30012,7 @@ var ArrayStep = function ArrayStep(_ref12) {
 };
 
 var NestedForm = function NestedForm(_ref13) {
-  var _classNames16;
+  var _classNames17;
 
   var schema = _ref13.schema,
       flow = _ref13.flow,
@@ -30046,7 +30104,7 @@ var NestedForm = function NestedForm(_ref13) {
     return x.visibleStep;
   }).length > 1 && step.label !== null;
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames((_classNames16 = {}, _defineProperty$1(_classNames16, classes.nestedform__border, bordered), _defineProperty$1(_classNames16, classes.border__error, !!errorDisplayed), _classNames16)),
+    className: classNames((_classNames17 = {}, _defineProperty$1(_classNames17, classes.nestedform__border, bordered), _defineProperty$1(_classNames17, classes.border__error, !!errorDisplayed), _classNames17)),
     style: {
       position: 'relative'
     }

package/lib/index.js

@@ -56,7 +56,8 @@ var type = {
   bool: 'bool',
   date: 'date',
   object: 'object',
-  file: 'file'
+  file: 'file',
+  json: 'json'
 };
 
 var format = {
@@ -253,9 +254,9 @@ var _oneOf = function oneOf(arrayOfValues) {
 var _blacklist = function blacklist(arrayOfValues) {
   var message = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "This value can't include the following values ".concat(arrayOfValues.join(', '));
   return function (r) {
-    return r.test('blacklist' + Date.now(), message, function (value) {
+    return r.test('blacklist', message, function (value) {
       return !arrayOfValues.some(function (f) {
-        return value.includes(f);
+        return (value || '').includes(f);
       });
     });
   };
@@ -485,6 +486,10 @@ function _extends() {
   return _extends.apply(this, arguments);
 }
 
+function _readOnlyError(name) {
+  throw new TypeError("\"" + name + "\" is read-only");
+}
+
 function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest();
 }
@@ -676,6 +681,9 @@ var style = (_style = {
   d_none: {
     display: "none"
   },
+  flexWrap: {
+    flexWrap: 'wrap'
+  },
   flex: {
     display: "flex"
   },
@@ -1102,7 +1110,7 @@ var SelectInput = /*#__PURE__*/React__default["default"].forwardRef(function (pr
         display: 'flex'
       }
     }, values.map(function (v, idx) {
-      var active = props.isMulti ? value.includes(v) : v.value === value.value;
+      var active = !!value && (props.isMulti ? value.includes(v) : v.value === value.value);
       return /*#__PURE__*/React__default["default"].createElement("button", {
         key: idx,
         type: "button",
@@ -28486,7 +28494,7 @@ function Editor(parent, mode, onChange, value) {
         }
       } catch (_) {}
     }), EditorView.editable.of(!readOnly)]),
-    doc: !value ? '' : _typeof(value) === 'object' ? value.value : value
+    doc: value === null || value === undefined ? '' : _typeof(value) === 'object' ? value.value : value
   });
   return new EditorView({
     state: state,
@@ -28533,13 +28541,16 @@ function CodeInput(_ref) {
     setEditor(e);
   }, []);
   React.useEffect(function () {
-    if (editor && (_typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value) !== editor.state.doc.toString()) editor.dispatch({
-      changes: {
-        from: 0,
-        to: editor.state.doc.length,
-        insert: value === null ? '' : _typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value
-      }
-    });
+    if (editor && (_typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value) !== editor.state.doc.toString()) {
+      console.log("set value", value, value === null || value === undefined ? '' : _typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value, editor.state.doc.toString());
+      editor.dispatch({
+        changes: {
+          from: 0,
+          to: editor.state.doc.length,
+          insert: value === null || value === undefined ? '' : _typeof$1(value) === 'object' ? JSON.stringify(value, null, 2) : value
+        }
+      });
+    }
   }, [value]);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     ref: ref
@@ -28569,7 +28580,7 @@ var MarkdownInput = function MarkdownInput(props) {
     if (preview) {
       showPreview();
     }
-  }, [preview]);
+  }, [preview, props.value]);
   var commands = [{
     name: 'Add header',
     icon: 'heading',
@@ -28762,7 +28773,7 @@ var MarkdownInput = function MarkdownInput(props) {
       return setPreview(true);
     }
   }, "Preview"))), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: classNames__default["default"](classes.flex)
+    className: classNames__default["default"](classes.flex, classes.flexWrap)
   }, injectButtons())), !preview && /*#__PURE__*/React__default["default"].createElement(CodeInput, _extends({}, props, {
     setRef: function setRef(e) {
       return ref.current = e;
@@ -28830,6 +28841,8 @@ var resolvers = (_resolvers = {}, _defineProperty$1(_resolvers, type.string, fun
   return yup__namespace.date().nullable().optional().typeError(typeErrorMessage || 'Value must be a date');
 }), _defineProperty$1(_resolvers, type.file, function () {
   return yup__namespace.mixed();
+}), _defineProperty$1(_resolvers, type.json, function () {
+  return yup__namespace.mixed();
 }), _resolvers);
 var buildSubResolver = function buildSubResolver(props, key, dependencies, rawData) {
   var _props$constraints = props.constraints,
@@ -28935,7 +28948,6 @@ var getShapeAndDependencies = function getShapeAndDependencies(flow, schema) {
 };
 
 var CustomizableInput$1 = /*#__PURE__*/React__default["default"].memo(function (props) {
-  // console.log("CUSTOMIZABLE_INPUT" + props.field.name)
   if (props.render) {
     return props.render(_objectSpread2$1(_objectSpread2$1({}, props.field), {}, {
       error: props.error
@@ -28944,14 +28956,15 @@ var CustomizableInput$1 = /*#__PURE__*/React__default["default"].memo(function (
 
   return props.children;
 }, function (prev, next) {
-  return prev.field.value === next.field.value;
+  return prev.field.value === next.field.value && next.errorDisplayed === prev.errorDisplayed;
 });
 var ControlledInput = function ControlledInput(_ref) {
   var defaultValue = _ref.defaultValue,
       step = _ref.step,
       entry = _ref.entry,
       children = _ref.children,
-      component = _ref.component;
+      component = _ref.component,
+      errorDisplayed = _ref.errorDisplayed;
 
   var _useController = reactHookForm.useController({
     defaultValue: defaultValue || null,
@@ -28992,8 +29005,7 @@ var ControlledInput = function ControlledInput(_ref) {
         } else {
           return e;
         }
-      }(); // field.onChange(!e ? null : e.target ? e.target.value || null : e)
-
+      }();
 
       field.onChange(value);
       option(step.onChange).map(function (onChange) {
@@ -29019,7 +29031,8 @@ var ControlledInput = function ControlledInput(_ref) {
       },
       rawValues: getValues()
     }, field),
-    error: error
+    error: error,
+    errorDisplayed: errorDisplayed
   }, component ? component(field, props) : /*#__PURE__*/React__default["default"].cloneElement(children, _objectSpread2$1({}, props)));
 };
 
@@ -29121,7 +29134,7 @@ var defaultVal = function defaultVal(value, array, defaultValue) {
 };
 
 var getDefaultValues = function getDefaultValues(flow, schema, value) {
-  return flow.reduce(function (acc, key) {
+  return (flow || []).reduce(function (acc, key) {
     if (_typeof$1(key) === 'object') {
       return _objectSpread2$1(_objectSpread2$1({}, acc), getDefaultValues(key.flow, schema, value));
     }
@@ -29199,7 +29212,17 @@ var cleanOutputArray = function cleanOutputArray(obj, subSchema) {
 
       return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, cleanOutputArray(v, ((_subSchema$key3 = subSchema[key]) === null || _subSchema$key3 === void 0 ? void 0 : _subSchema$key3.schema) || {})));
     } else {
-      return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, v));
+      var _subSchema$key4;
+
+      if (((_subSchema$key4 = subSchema[key]) === null || _subSchema$key4 === void 0 ? void 0 : _subSchema$key4.type) === 'json') {
+        try {
+          return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, JSON.parse(v)));
+        } catch (err) {
+          return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, v));
+        }
+      } else {
+        return _objectSpread2$1(_objectSpread2$1({}, acc), {}, _defineProperty$1({}, key, v));
+      }
     }
   }, {});
 };
@@ -29626,7 +29649,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement("textarea", {
             type: "text",
             className: classNames__default["default"](classes.input, _defineProperty$1({}, classes.input__invalid, errorDisplayed))
@@ -29638,7 +29662,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement(Component, {
             className: classNames__default["default"](_defineProperty$1({}, classes.input__invalid, errorDisplayed))
           }));
@@ -29647,7 +29672,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement(MarkdownInput, {
             className: classNames__default["default"](_defineProperty$1({}, classes.input__invalid, errorDisplayed))
           }));
@@ -29658,7 +29684,8 @@ var Step = function Step(_ref9) {
             return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
               defaultValue: defaultValue,
               step: step,
-              entry: entry
+              entry: entry,
+              errorDisplayed: errorDisplayed
             }, /*#__PURE__*/React__default["default"].createElement(SelectInput, {
               className: classNames__default["default"](classes.flex_grow_1, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
               disabled: functionalProperty(entry, step.disabled),
@@ -29667,7 +29694,6 @@ var Step = function Step(_ref9) {
               isMulti: step.isMulti,
               createOption: step.createOption,
               transformer: step.transformer,
-              optionsFrom: step.optionsFrom,
               buttons: step.format === format.buttonsSelect
             }));
           }
@@ -29676,7 +29702,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement("input", {
             type: step.format || 'text',
             className: classNames__default["default"](classes.input, _defineProperty$1({}, classes.input__invalid, errorDisplayed))
@@ -29690,7 +29717,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement(SelectInput, {
             className: classNames__default["default"](classes.content, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
             possibleValues: step.options,
@@ -29699,7 +29727,6 @@ var Step = function Step(_ref9) {
             createOption: step.createOption,
             onCreateOption: step.onCreateOption,
             transformer: step.transformer,
-            optionsFrom: step.optionsFrom,
             buttons: step.format === format.buttonsSelect
           }));
 
@@ -29707,7 +29734,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement("input", {
             type: step.format || 'number',
             className: classNames__default["default"](classes.input, _defineProperty$1({}, classes.input__invalid, errorDisplayed))
@@ -29718,7 +29746,8 @@ var Step = function Step(_ref9) {
       return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
         defaultValue: defaultValue,
         step: step,
-        entry: entry
+        entry: entry,
+        errorDisplayed: errorDisplayed
       }, /*#__PURE__*/React__default["default"].createElement(BooleanInput, {
         className: classNames__default["default"](_defineProperty$1({}, classes.input__invalid, errorDisplayed))
       }));
@@ -29730,7 +29759,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement(SelectInput, {
             className: classNames__default["default"](classes.flex_grow_1, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
             possibleValues: step.options,
@@ -29739,7 +29769,6 @@ var Step = function Step(_ref9) {
             createOption: step.createOption,
             onCreateOption: step.onCreateOption,
             transformer: step.transformer,
-            optionsFrom: step.optionsFrom,
             buttons: step.format === format.buttonsSelect
           }));
 
@@ -29781,10 +29810,12 @@ var Step = function Step(_ref9) {
             defaultValue: defaultValue,
             step: step,
             entry: entry,
+            errorDisplayed: errorDisplayed,
             component: function component(field, props) {
               return /*#__PURE__*/React__default["default"].createElement(CodeInput, _extends({}, props, {
                 className: classNames__default["default"](_defineProperty$1({}, classes.input__invalid, error)),
                 onChange: function onChange(e) {
+                  _readOnlyError("errorDisplayed");
                   var v;
 
                   try {
@@ -29811,7 +29842,8 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement(ObjectInput, {
             className: classNames__default["default"](_defineProperty$1({}, classes.input__invalid, errorDisplayed)),
             possibleValues: step.options
@@ -29822,7 +29854,8 @@ var Step = function Step(_ref9) {
       return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
         defaultValue: defaultValue,
         step: step,
-        entry: entry
+        entry: entry,
+        errorDisplayed: errorDisplayed
       }, /*#__PURE__*/React__default["default"].createElement(reactRainbowComponents.DatePicker, {
         className: classNames__default["default"](classes.datepicker, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
         formatStyle: "large"
@@ -29887,11 +29920,35 @@ var Step = function Step(_ref9) {
           return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
             defaultValue: defaultValue,
             step: step,
-            entry: entry
+            entry: entry,
+            errorDisplayed: errorDisplayed
           }, /*#__PURE__*/React__default["default"].createElement(FileInput, null));
         }
       });
 
+    case type.json:
+      return /*#__PURE__*/React__default["default"].createElement(ControlledInput, {
+        defaultValue: defaultValue,
+        step: step,
+        entry: entry,
+        component: function component(field, props) {
+          return /*#__PURE__*/React__default["default"].createElement(CodeInput, _extends({}, props, {
+            className: classNames__default["default"](_defineProperty$1({}, classes.input__invalid, error)),
+            onChange: function onChange(v) {
+              field.onChange(v);
+              option(step.onChange).map(function (onChange) {
+                return onChange({
+                  rawValues: getValues(),
+                  value: v,
+                  setValue: _setValue
+                });
+              });
+            },
+            value: field.value
+          }));
+        }
+      });
+
     default:
       return null;
   }
@@ -29969,10 +30026,11 @@ var ArrayStep = function ArrayStep(_ref12) {
     type: "button",
     className: classNames__default["default"](classes.btn, classes.btn_blue, classes.btn_sm, classes.mt_5, _defineProperty$1({}, classes.input__invalid, errorDisplayed)),
     onClick: function onClick() {
+      var newValue = cleanInputArray({}, getValues(entry), step.flow, step.schema);
       append({
-        value: step.addableDefaultValue || defaultVal(null)
-      });
-      trigger(entry);
+        value: step.addableDefaultValue || (newValue ? newValue : defaultVal())
+      }); // trigger(entry);
+
       option(step.onChange).map(function (onChange) {
         return onChange({
           rawValues: getValues(),
@@ -29988,7 +30046,7 @@ var ArrayStep = function ArrayStep(_ref12) {
 };
 
 var NestedForm = function NestedForm(_ref13) {
-  var _classNames16;
+  var _classNames17;
 
   var schema = _ref13.schema,
       flow = _ref13.flow,
@@ -30080,7 +30138,7 @@ var NestedForm = function NestedForm(_ref13) {
     return x.visibleStep;
   }).length > 1 && step.label !== null;
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: classNames__default["default"]((_classNames16 = {}, _defineProperty$1(_classNames16, classes.nestedform__border, bordered), _defineProperty$1(_classNames16, classes.border__error, !!errorDisplayed), _classNames16)),
+    className: classNames__default["default"]((_classNames17 = {}, _defineProperty$1(_classNames17, classes.nestedform__border, bordered), _defineProperty$1(_classNames17, classes.border__error, !!errorDisplayed), _classNames17)),
     style: {
       position: 'relative'
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maif/react-forms",
   "description": "Build react safe forms as fast as possible",
-  "version": "1.0.38",
+  "version": "1.0.41",
   "main": "lib/index.js",
   "module": "lib/esm/index.js",
   "types": "lib/index.js",