@maif/react-forms 1.0.51 → 1.0.54

package/lib/esm/index.js

@@ -28515,7 +28515,6 @@ function CodeInput(_ref) {
   }, []);
   useEffect(function () {
     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,
@@ -28864,18 +28863,28 @@ var buildSubResolver = function buildSubResolver(props, key, dependencies, rawDa
           return s.condition === ref;
         }
       });
-      return option(filterSwitch).getOrElse(condiSchema["switch"].find(function (s) {
+      return option(filterSwitch).orElse(condiSchema["switch"].find(function (s) {
         return s["default"];
-      }));
-    }).getOrElse({}),
+      })).getOrElse({
+        schema: {},
+        flow: []
+      });
+    }).getOrElse({
+      schema: {},
+      flow: []
+    }),
         schema = _option$map$getOrElse.schema,
         flow = _option$map$getOrElse.flow;
 
-    var _subResolver2 = getShapeAndDependencies(flow || Object.keys(schema), schema, dependencies, rawData);
+    var realFlow = flow || Object.keys(schema);
 
-    return constraints.reduce(function (resolver, constraint) {
-      return jsonOrFunctionConstraint(constraint, resolver, key, dependencies);
-    }, yup.object().shape(_subResolver2.shape, dependencies));
+    if (realFlow.length) {
+      var _subResolver2 = getShapeAndDependencies(flow || Object.keys(schema), schema, dependencies, rawData);
+
+      return constraints.reduce(function (resolver, constraint) {
+        return jsonOrFunctionConstraint(constraint, resolver, key, dependencies);
+      }, yup.object().shape(_subResolver2.shape, dependencies));
+    }
   } else {
     return constraints.reduce(function (resolver, constraint) {
       return jsonOrFunctionConstraint(constraint, resolver, key, dependencies);
@@ -28929,6 +28938,10 @@ var CustomizableInput$1 = /*#__PURE__*/React.memo(function (props) {
 
   return props.children;
 }, function (prev, next) {
+  if (next.render || next.conditionalSchema) {
+    return false;
+  }
+
   return prev.field.value === next.field.value && next.errorDisplayed === prev.errorDisplayed;
 });
 var ControlledInput = function ControlledInput(_ref) {
@@ -29281,11 +29294,6 @@ var Form = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
     });
   };
 
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      expandedAll = _useState2[0],
-      setExpandedAll = _useState2[1];
-
   var defaultValues = getDefaultValues(formFlow, schema, value); //FIXME: get real schema through the switch
 
   var _resolver = function resolver(rawData) {
@@ -29305,10 +29313,10 @@ var Form = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
     mode: 'onChange'
   });
 
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      initialReseted = _useState4[0],
-      setReset = _useState4[1];
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      initialReseted = _useState2[0],
+      setReset = _useState2[1];
 
   useEffect(function () {
     _reset(cleanInputArray(value, defaultValues, flow, schema));
@@ -29319,9 +29327,9 @@ var Form = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
     initialReseted && trigger();
   }, [trigger, initialReseted]);
   var _handleSubmit = methods.handleSubmit,
-      _methods$formState = methods.formState,
-      errors = _methods$formState.errors,
-      dirtyFields = _methods$formState.dirtyFields,
+      _methods$formState = methods.formState;
+      _methods$formState.errors;
+      var dirtyFields = _methods$formState.dirtyFields,
       _reset = methods.reset,
       trigger = methods.trigger,
       getValues = methods.getValues,
@@ -29374,19 +29382,7 @@ var Form = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
       var clean = cleanOutputArray(data, schema);
       onSubmit(clean);
     }, onError)
-  }, /*#__PURE__*/React.createElement("div", {
-    className: classNames(classes.flex, classes.mt_20)
-  }, /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    className: classNames(classes.btn, classes.btn_sm),
-    style: {
-      marginLeft: 'auto'
-    },
-    onClick: function onClick(e) {
-      if (e) e.stopPropagation();
-      setExpandedAll(!expandedAll);
-    }
-  }, expandedAll ? 'Expand all' : 'Collapse all')), formFlow.map(function (entry, idx) {
+  }, formFlow.map(function (entry, idx) {
     var step = schema[entry];
 
     if (!step && typeof entry === 'string') {
@@ -29394,9 +29390,6 @@ var Form = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
       return null;
     }
 
-    _typeof$1(entry) === 'object' ? undefined : entry.split('.').reduce(function (object, key) {
-      return object && object[key];
-    }, errors);
     var visibleStep = option(step).map(function (s) {
       return s.visible;
     }).map(function (visible) {
@@ -29434,8 +29427,7 @@ var Form = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
       schema: schema,
       inputWrapper: inputWrapper,
       httpClient: maybeCustomHttpClient,
-      functionalProperty: functionalProperty,
-      expandedAll: expandedAll
+      functionalProperty: functionalProperty
     }));
   }), /*#__PURE__*/React.createElement(Footer, {
     render: footer,
@@ -29493,8 +29485,7 @@ var Step = function Step(_ref8) {
       index = _ref8.index,
       functionalProperty = _ref8.functionalProperty,
       parent = _ref8.parent,
-      onAfterChange = _ref8.onAfterChange,
-      expandedAll = _ref8.expandedAll;
+      onAfterChange = _ref8.onAfterChange;
   var classes = useCustomStyle();
 
   var _useFormContext2 = useFormContext(),
@@ -29559,7 +29550,6 @@ var Step = function Step(_ref8) {
         entry: en,
         step: stp,
         schema: schema,
-        expandedAll: expandedAll,
         inputWrapper: inputWrapper,
         httpClient: httpClient,
         defaultValue: stp === null || stp === void 0 ? void 0 : stp.defaultValue,
@@ -29637,8 +29627,7 @@ var Step = function Step(_ref8) {
           defaultValue: (_props$defaultValue = props.defaultValue) === null || _props$defaultValue === void 0 ? void 0 : _props$defaultValue.value,
           value: props.value,
           index: idx,
-          functionalProperty: functionalProperty,
-          expandedAll: expandedAll
+          functionalProperty: functionalProperty
         });
       }
     }));
@@ -29807,8 +29796,7 @@ var Step = function Step(_ref8) {
             value: getValues(entry) || defaultValue,
             index: index,
             functionalProperty: functionalProperty,
-            errorDisplayed: errorDisplayed,
-            expandedAll: expandedAll
+            errorDisplayed: errorDisplayed
           }));
 
         case format.code:
@@ -29876,15 +29864,15 @@ var Step = function Step(_ref8) {
           var FileInput = function FileInput(_ref10) {
             var onChange = _ref10.onChange;
 
-            var _useState5 = useState(false),
-                _useState6 = _slicedToArray(_useState5, 2),
-                uploading = _useState6[0],
-                setUploading = _useState6[1];
+            var _useState3 = useState(false),
+                _useState4 = _slicedToArray(_useState3, 2),
+                uploading = _useState4[0],
+                setUploading = _useState4[1];
 
-            var _useState7 = useState(undefined),
-                _useState8 = _slicedToArray(_useState7, 2),
-                input = _useState8[0],
-                setInput = _useState8[1];
+            var _useState5 = useState(undefined),
+                _useState6 = _slicedToArray(_useState5, 2),
+                input = _useState6[0],
+                setInput = _useState6[1];
 
             var setFiles = function setFiles(e) {
               var files = e.target.files;
@@ -30051,7 +30039,7 @@ var ArrayStep = function ArrayStep(_ref11) {
 };
 
 var NestedForm = function NestedForm(_ref12) {
-  var _classNames17;
+  var _step$conditionalSche, _classNames17;
 
   var schema = _ref12.schema,
       flow = _ref12.flow,
@@ -30062,25 +30050,20 @@ var NestedForm = function NestedForm(_ref12) {
       value = _ref12.value,
       step = _ref12.step,
       functionalProperty = _ref12.functionalProperty,
-      index = _ref12.index,
-      expandedAll = _ref12.expandedAll;
+      index = _ref12.index;
 
   var _useFormContext4 = useFormContext(),
       getValues = _useFormContext4.getValues,
       setValue = _useFormContext4.setValue,
       watch = _useFormContext4.watch;
-      _useFormContext4.trigger;
-      _useFormContext4.formState;
 
-  var _useState9 = useState(!!step.collapsed),
-      _useState10 = _slicedToArray(_useState9, 2),
-      collapsed = _useState10[0],
-      setCollapsed = _useState10[1];
+  var _useState7 = useState(!!step.collapsed),
+      _useState8 = _slicedToArray(_useState7, 2),
+      collapsed = _useState8[0],
+      setCollapsed = _useState8[1];
 
   var classes = useCustomStyle();
-  useEffect(function () {
-    if (!expandedAll || expandedAll && parent.split('.').length >= 2) setCollapsed(expandedAll);
-  }, [expandedAll]);
+  useWatch(step === null || step === void 0 ? void 0 : (_step$conditionalSche = step.conditionalSchema) === null || _step$conditionalSche === void 0 ? void 0 : _step$conditionalSche.ref);
   var schemaAndFlow = option(step.conditionalSchema).map(function (condiSchema) {
     var ref = option(condiSchema.ref).map(function (ref) {
       return getValues(ref);
@@ -30096,9 +30079,16 @@ var NestedForm = function NestedForm(_ref12) {
         return s.condition === ref;
       }
     });
-    return option(filterSwitch).getOrElse(condiSchema["switch"].find(function (s) {
+    var schemaAndFlow = option(filterSwitch).orElse(condiSchema["switch"].find(function (s) {
       return s["default"];
-    }));
+    })).getOrElse({
+      schema: {},
+      flow: []
+    });
+    return {
+      schema: schemaAndFlow.schema,
+      flow: schemaAndFlow.flow || Object.keys(schemaAndFlow.schema)
+    };
   }).getOrElse({
     schema: schema,
     flow: flow
@@ -30140,7 +30130,7 @@ var NestedForm = function NestedForm(_ref12) {
   }, []);
   var bordered = computedSandF.filter(function (x) {
     return x.visibleStep;
-  }).length > 1 && step.label !== null;
+  }).length >= 1 && step.label !== null;
   return /*#__PURE__*/React.createElement("div", {
     className: classNames((_classNames17 = {}, _defineProperty$1(_classNames17, classes.nestedform__border, bordered), _defineProperty$1(_classNames17, classes.border__error, !!errorDisplayed), _classNames17)),
     style: {
@@ -30199,8 +30189,7 @@ var NestedForm = function NestedForm(_ref12) {
       inputWrapper: inputWrapper,
       httpClient: maybeCustomHttpClient,
       defaultValue: value && value[entry],
-      functionalProperty: functionalProperty,
-      expandedAll: expandedAll
+      functionalProperty: functionalProperty
     }));
   }));
 };

package/lib/index.js

@@ -28549,7 +28549,6 @@ function CodeInput(_ref) {
   }, []);
   React.useEffect(function () {
     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,
@@ -28898,18 +28897,28 @@ var buildSubResolver = function buildSubResolver(props, key, dependencies, rawDa
           return s.condition === ref;
         }
       });
-      return option(filterSwitch).getOrElse(condiSchema["switch"].find(function (s) {
+      return option(filterSwitch).orElse(condiSchema["switch"].find(function (s) {
         return s["default"];
-      }));
-    }).getOrElse({}),
+      })).getOrElse({
+        schema: {},
+        flow: []
+      });
+    }).getOrElse({
+      schema: {},
+      flow: []
+    }),
         schema = _option$map$getOrElse.schema,
         flow = _option$map$getOrElse.flow;
 
-    var _subResolver2 = getShapeAndDependencies(flow || Object.keys(schema), schema, dependencies, rawData);
+    var realFlow = flow || Object.keys(schema);
 
-    return constraints.reduce(function (resolver, constraint) {
-      return jsonOrFunctionConstraint(constraint, resolver, key, dependencies);
-    }, yup__namespace.object().shape(_subResolver2.shape, dependencies));
+    if (realFlow.length) {
+      var _subResolver2 = getShapeAndDependencies(flow || Object.keys(schema), schema, dependencies, rawData);
+
+      return constraints.reduce(function (resolver, constraint) {
+        return jsonOrFunctionConstraint(constraint, resolver, key, dependencies);
+      }, yup__namespace.object().shape(_subResolver2.shape, dependencies));
+    }
   } else {
     return constraints.reduce(function (resolver, constraint) {
       return jsonOrFunctionConstraint(constraint, resolver, key, dependencies);
@@ -28963,6 +28972,10 @@ var CustomizableInput$1 = /*#__PURE__*/React__default["default"].memo(function (
 
   return props.children;
 }, function (prev, next) {
+  if (next.render || next.conditionalSchema) {
+    return false;
+  }
+
   return prev.field.value === next.field.value && next.errorDisplayed === prev.errorDisplayed;
 });
 var ControlledInput = function ControlledInput(_ref) {
@@ -29315,11 +29328,6 @@ var Form = /*#__PURE__*/React__default["default"].forwardRef(function (_ref7, re
     });
   };
 
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      expandedAll = _useState2[0],
-      setExpandedAll = _useState2[1];
-
   var defaultValues = getDefaultValues(formFlow, schema, value); //FIXME: get real schema through the switch
 
   var _resolver = function resolver(rawData) {
@@ -29339,10 +29347,10 @@ var Form = /*#__PURE__*/React__default["default"].forwardRef(function (_ref7, re
     mode: 'onChange'
   });
 
-  var _useState3 = React.useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      initialReseted = _useState4[0],
-      setReset = _useState4[1];
+  var _useState = React.useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      initialReseted = _useState2[0],
+      setReset = _useState2[1];
 
   React.useEffect(function () {
     _reset(cleanInputArray(value, defaultValues, flow, schema));
@@ -29353,9 +29361,9 @@ var Form = /*#__PURE__*/React__default["default"].forwardRef(function (_ref7, re
     initialReseted && trigger();
   }, [trigger, initialReseted]);
   var _handleSubmit = methods.handleSubmit,
-      _methods$formState = methods.formState,
-      errors = _methods$formState.errors,
-      dirtyFields = _methods$formState.dirtyFields,
+      _methods$formState = methods.formState;
+      _methods$formState.errors;
+      var dirtyFields = _methods$formState.dirtyFields,
       _reset = methods.reset,
       trigger = methods.trigger,
       getValues = methods.getValues,
@@ -29408,19 +29416,7 @@ var Form = /*#__PURE__*/React__default["default"].forwardRef(function (_ref7, re
       var clean = cleanOutputArray(data, schema);
       onSubmit(clean);
     }, onError)
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: classNames__default["default"](classes.flex, classes.mt_20)
-  }, /*#__PURE__*/React__default["default"].createElement("button", {
-    type: "button",
-    className: classNames__default["default"](classes.btn, classes.btn_sm),
-    style: {
-      marginLeft: 'auto'
-    },
-    onClick: function onClick(e) {
-      if (e) e.stopPropagation();
-      setExpandedAll(!expandedAll);
-    }
-  }, expandedAll ? 'Expand all' : 'Collapse all')), formFlow.map(function (entry, idx) {
+  }, formFlow.map(function (entry, idx) {
     var step = schema[entry];
 
     if (!step && typeof entry === 'string') {
@@ -29428,9 +29424,6 @@ var Form = /*#__PURE__*/React__default["default"].forwardRef(function (_ref7, re
       return null;
     }
 
-    _typeof$1(entry) === 'object' ? undefined : entry.split('.').reduce(function (object, key) {
-      return object && object[key];
-    }, errors);
     var visibleStep = option(step).map(function (s) {
       return s.visible;
     }).map(function (visible) {
@@ -29468,8 +29461,7 @@ var Form = /*#__PURE__*/React__default["default"].forwardRef(function (_ref7, re
       schema: schema,
       inputWrapper: inputWrapper,
       httpClient: maybeCustomHttpClient,
-      functionalProperty: functionalProperty,
-      expandedAll: expandedAll
+      functionalProperty: functionalProperty
     }));
   }), /*#__PURE__*/React__default["default"].createElement(Footer, {
     render: footer,
@@ -29527,8 +29519,7 @@ var Step = function Step(_ref8) {
       index = _ref8.index,
       functionalProperty = _ref8.functionalProperty,
       parent = _ref8.parent,
-      onAfterChange = _ref8.onAfterChange,
-      expandedAll = _ref8.expandedAll;
+      onAfterChange = _ref8.onAfterChange;
   var classes = useCustomStyle();
 
   var _useFormContext2 = reactHookForm.useFormContext(),
@@ -29593,7 +29584,6 @@ var Step = function Step(_ref8) {
         entry: en,
         step: stp,
         schema: schema,
-        expandedAll: expandedAll,
         inputWrapper: inputWrapper,
         httpClient: httpClient,
         defaultValue: stp === null || stp === void 0 ? void 0 : stp.defaultValue,
@@ -29671,8 +29661,7 @@ var Step = function Step(_ref8) {
           defaultValue: (_props$defaultValue = props.defaultValue) === null || _props$defaultValue === void 0 ? void 0 : _props$defaultValue.value,
           value: props.value,
           index: idx,
-          functionalProperty: functionalProperty,
-          expandedAll: expandedAll
+          functionalProperty: functionalProperty
         });
       }
     }));
@@ -29841,8 +29830,7 @@ var Step = function Step(_ref8) {
             value: getValues(entry) || defaultValue,
             index: index,
             functionalProperty: functionalProperty,
-            errorDisplayed: errorDisplayed,
-            expandedAll: expandedAll
+            errorDisplayed: errorDisplayed
           }));
 
         case format.code:
@@ -29910,15 +29898,15 @@ var Step = function Step(_ref8) {
           var FileInput = function FileInput(_ref10) {
             var onChange = _ref10.onChange;
 
-            var _useState5 = React.useState(false),
-                _useState6 = _slicedToArray(_useState5, 2),
-                uploading = _useState6[0],
-                setUploading = _useState6[1];
+            var _useState3 = React.useState(false),
+                _useState4 = _slicedToArray(_useState3, 2),
+                uploading = _useState4[0],
+                setUploading = _useState4[1];
 
-            var _useState7 = React.useState(undefined),
-                _useState8 = _slicedToArray(_useState7, 2),
-                input = _useState8[0],
-                setInput = _useState8[1];
+            var _useState5 = React.useState(undefined),
+                _useState6 = _slicedToArray(_useState5, 2),
+                input = _useState6[0],
+                setInput = _useState6[1];
 
             var setFiles = function setFiles(e) {
               var files = e.target.files;
@@ -30085,7 +30073,7 @@ var ArrayStep = function ArrayStep(_ref11) {
 };
 
 var NestedForm = function NestedForm(_ref12) {
-  var _classNames17;
+  var _step$conditionalSche, _classNames17;
 
   var schema = _ref12.schema,
       flow = _ref12.flow,
@@ -30096,25 +30084,20 @@ var NestedForm = function NestedForm(_ref12) {
       value = _ref12.value,
       step = _ref12.step,
       functionalProperty = _ref12.functionalProperty,
-      index = _ref12.index,
-      expandedAll = _ref12.expandedAll;
+      index = _ref12.index;
 
   var _useFormContext4 = reactHookForm.useFormContext(),
       getValues = _useFormContext4.getValues,
       setValue = _useFormContext4.setValue,
       watch = _useFormContext4.watch;
-      _useFormContext4.trigger;
-      _useFormContext4.formState;
 
-  var _useState9 = React.useState(!!step.collapsed),
-      _useState10 = _slicedToArray(_useState9, 2),
-      collapsed = _useState10[0],
-      setCollapsed = _useState10[1];
+  var _useState7 = React.useState(!!step.collapsed),
+      _useState8 = _slicedToArray(_useState7, 2),
+      collapsed = _useState8[0],
+      setCollapsed = _useState8[1];
 
   var classes = useCustomStyle();
-  React.useEffect(function () {
-    if (!expandedAll || expandedAll && parent.split('.').length >= 2) setCollapsed(expandedAll);
-  }, [expandedAll]);
+  reactHookForm.useWatch(step === null || step === void 0 ? void 0 : (_step$conditionalSche = step.conditionalSchema) === null || _step$conditionalSche === void 0 ? void 0 : _step$conditionalSche.ref);
   var schemaAndFlow = option(step.conditionalSchema).map(function (condiSchema) {
     var ref = option(condiSchema.ref).map(function (ref) {
       return getValues(ref);
@@ -30130,9 +30113,16 @@ var NestedForm = function NestedForm(_ref12) {
         return s.condition === ref;
       }
     });
-    return option(filterSwitch).getOrElse(condiSchema["switch"].find(function (s) {
+    var schemaAndFlow = option(filterSwitch).orElse(condiSchema["switch"].find(function (s) {
       return s["default"];
-    }));
+    })).getOrElse({
+      schema: {},
+      flow: []
+    });
+    return {
+      schema: schemaAndFlow.schema,
+      flow: schemaAndFlow.flow || Object.keys(schemaAndFlow.schema)
+    };
   }).getOrElse({
     schema: schema,
     flow: flow
@@ -30174,7 +30164,7 @@ var NestedForm = function NestedForm(_ref12) {
   }, []);
   var bordered = computedSandF.filter(function (x) {
     return x.visibleStep;
-  }).length > 1 && step.label !== null;
+  }).length >= 1 && step.label !== null;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"]((_classNames17 = {}, _defineProperty$1(_classNames17, classes.nestedform__border, bordered), _defineProperty$1(_classNames17, classes.border__error, !!errorDisplayed), _classNames17)),
     style: {
@@ -30233,8 +30223,7 @@ var NestedForm = function NestedForm(_ref12) {
       inputWrapper: inputWrapper,
       httpClient: maybeCustomHttpClient,
       defaultValue: value && value[entry],
-      functionalProperty: functionalProperty,
-      expandedAll: expandedAll
+      functionalProperty: functionalProperty
     }));
   }));
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maif/react-forms",
   "description": "Build react safe forms as fast as possible",
-  "version": "1.0.51",
+  "version": "1.0.54",
   "main": "lib/index.js",
   "module": "lib/esm/index.js",
   "types": "lib/index.js",
@@ -56,7 +56,7 @@
     ]
   },
   "peerDependencies": {
-    "react": "^17.0.2"
+    "react": "^17.0.2 || 18"
   },
   "devDependencies": {
     "@babel/cli": "^7.17.6",
@@ -98,7 +98,6 @@
     "@codemirror/theme-one-dark": "^0.19.1",
     "@fortawesome/fontawesome-free": "^5.15.3",
     "@hookform/resolvers": "2.4.0",
-    "@maif/react-forms": "^1.0.37-rc.1",
     "@popperjs/core": "^2.11.2",
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",