@maif/react-forms 1.0.12 → 1.0.16

package/lib/form.js

@@ -69,7 +69,7 @@ var usePrevious = function usePrevious(value) {
   var ref = (0, _react.useRef)(); // Store current value in ref
 
   (0, _react.useEffect)(function () {
-    ref.current = value;
+    ref.current = JSON.parse(JSON.stringify(value));
   }, [value]); // Only re-run if value changes
   // Return previous value (happens before update in useEffect above)
 
@@ -102,7 +102,7 @@ var BasicWrapper = function BasicWrapper(_ref) {
 
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "form-group mt-3"
-  }, /*#__PURE__*/_react["default"].createElement("label", {
+  }, label && /*#__PURE__*/_react["default"].createElement("label", {
     className: "form-label d-flex align-content-center",
     htmlFor: entry
   }, /*#__PURE__*/_react["default"].createElement("span", {
@@ -314,7 +314,9 @@ var Form = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
   }, [data]);
 
   if (options.watch) {
+    console.group('react-form watch');
     console.log(watch());
+    console.groupEnd();
   }
 
   (0, _react.useImperativeHandle)(ref, function () {
@@ -328,7 +330,7 @@ var Form = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
     };
   });
   return /*#__PURE__*/_react["default"].createElement(_reactHookForm.FormProvider, methods, /*#__PURE__*/_react["default"].createElement("form", {
-    className: className || classes.pr_15,
+    className: className || "".concat(classes.pr_15, " ").concat(classes.full_width),
     onSubmit: _handleSubmit(function (data) {
       var clean = cleanOutputArray(data);
       onSubmit(clean);
@@ -365,7 +367,7 @@ var Form = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
       key: "".concat(entry, "-").concat(idx),
       entry: entry,
       error: error,
-      label: (step === null || step === void 0 ? void 0 : step.label) || entry,
+      label: (step === null || step === void 0 ? void 0 : step.label) === null ? null : (step === null || step === void 0 ? void 0 : step.label) || entry,
       help: step === null || step === void 0 ? void 0 : step.help,
       render: inputWrapper
     }, /*#__PURE__*/_react["default"].createElement(Step, {
@@ -454,11 +456,33 @@ var Step = function Step(_ref4) {
       var err = _typeof(en) === 'object' ? undefined : en.split('.').reduce(function (object, key) {
         return object && object[key];
       }, errors);
+      var visibleStep = (0, _Option.option)(stp).map(function (s) {
+        return s.visible;
+      }).map(function (visible) {
+        switch (_typeof(visible)) {
+          case 'object':
+            var value = watch(visible.ref);
+            return (0, _Option.option)(visible.test).map(function (test) {
+              return test(value);
+            }).getOrElse(value);
+
+          case 'boolean':
+            return visible;
+
+          default:
+            return true;
+        }
+      }).getOrElse(true);
+
+      if (!visibleStep) {
+        return null;
+      }
+
       return /*#__PURE__*/_react["default"].createElement(BasicWrapper, {
         key: "collapse-".concat(en, "-").concat(entryIdx),
         entry: en,
         error: err,
-        label: (stp === null || stp === void 0 ? void 0 : stp.label) || en,
+        label: (stp === null || stp === void 0 ? void 0 : stp.label) === null ? null : (stp === null || stp === void 0 ? void 0 : stp.label) || en,
         help: stp === null || stp === void 0 ? void 0 : stp.help,
         render: inputWrapper
       }, /*#__PURE__*/_react["default"].createElement(Step, {
@@ -473,7 +497,9 @@ var Step = function Step(_ref4) {
         getValues: getValues,
         setValue: _setValue,
         watch: watch,
-        inputWrapper: inputWrapper
+        inputWrapper: inputWrapper,
+        httpClient: httpClient,
+        defaultValue: stp.defaultValue
       }));
     }));
   }
@@ -558,13 +584,13 @@ var Step = function Step(_ref4) {
                   rawValues: getValues()
                 }, field),
                 error: error
-              }, /*#__PURE__*/_react["default"].createElement(_index.CodeInput, _extends({}, step.props, {
+              }, /*#__PURE__*/_react["default"].createElement(_index.CodeInput, _extends({
                 className: (0, _classnames["default"])(_defineProperty({}, classes.input__invalid, error)),
                 readOnly: step.disabled ? 'readOnly' : null,
                 onChange: field.onChange,
                 value: field.value,
                 defaultValue: defaultValue
-              }, step)));
+              }, step.props)));
             }
           });
 
@@ -1063,7 +1089,7 @@ var NestedForm = function NestedForm(_ref16) {
       key: "".concat(entry, ".").concat(idx),
       entry: "".concat(parent, ".").concat(entry),
       error: realError,
-      label: step.label || entry,
+      label: (step === null || step === void 0 ? void 0 : step.label) === null ? null : (step === null || step === void 0 ? void 0 : step.label) || entry,
       help: step.help,
       render: inputWrapper
     }, /*#__PURE__*/_react["default"].createElement(Step, {

package/lib/inputs/CodeInput.js

@@ -33,6 +33,8 @@ var _excluded = ["onChange", "value", "className", "readOnly", "theme", "mode"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -49,7 +51,7 @@ var CodeInput = function CodeInput(_ref) {
       mode = _ref$mode === void 0 ? 'javascript' : _ref$mode,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  return /*#__PURE__*/_react["default"].createElement(_reactAce["default"], {
+  return /*#__PURE__*/_react["default"].createElement(_reactAce["default"], _extends({
     commands: _extBeautify["default"].commands,
     className: className,
     readOnly: readOnly,
@@ -79,7 +81,9 @@ var CodeInput = function CodeInput(_ref) {
     highlightActiveLine: true,
     enableBasicAutocompletion: true,
     enableLiveAutocompletion: true
-  });
+  }, props, {
+    ref: props.setRef
+  }));
 };
 
 exports.CodeInput = CodeInput;

package/lib/inputs/SelectInput.js

@@ -74,10 +74,10 @@ var valueToSelectOption = function valueToSelectOption(value) {
   return maybeValue.getOrElse({
     label: maybeValue.map(function (v) {
       return v.label;
-    }).getOrElse(value),
+    }).getOrElse((value === null || value === void 0 ? void 0 : value.label) || value),
     value: maybeValue.map(function (v) {
       return v.value;
-    }).getOrElse(value)
+    }).getOrElse((value === null || value === void 0 ? void 0 : value.value) || value)
   });
 };
 

package/lib/style.d.ts

@@ -123,6 +123,9 @@ export namespace style {
     namespace pr_15 {
         const paddingRight: number;
     }
+    namespace full_width {
+        const width: string;
+    }
     namespace d_none {
         const display: string;
     }
@@ -185,7 +188,8 @@ export namespace style {
         const borderColor: string;
     }
     namespace invalid_feedback {
-        export const width: string;
+        const width_1: string;
+        export { width_1 as width };
         const marginTop_4: string;
         export { marginTop_4 as marginTop };
         const fontSize_2: string;

package/lib/style.js

@@ -93,6 +93,9 @@ var style = (_style = {
   pr_15: {
     paddingRight: 15
   },
+  full_width: {
+    width: '100%'
+  },
   d_none: {
     display: "none"
   },

package/lib/styleContext.d.ts

@@ -1 +1 @@
-export function useCustomStyle(overrideStyle?: {}): import("jss").Classes<"code" | "flex" | "input" | "btn" | "btn_sm" | "btn_group" | "btn_red" | "btn_green" | "btn_blue" | "btn_grey" | "txt_red" | "ml_5" | "ml_10" | "mt_5" | "mt_10" | "mt_20" | "mb_5" | "p_15" | "pr_15" | "d_none" | "flexColumn" | "justifyContentBetween" | "jc_end" | "ac_center" | "ai_center" | "cursor_pointer" | "collapse" | "collapse_label" | "collapse_error" | "datepicker" | "input__boolean__on" | "input__boolean__off" | "input__invalid" | "invalid_feedback">;
+export function useCustomStyle(overrideStyle?: {}): import("jss").Classes<"code" | "flex" | "input" | "btn" | "btn_sm" | "btn_group" | "btn_red" | "btn_green" | "btn_blue" | "btn_grey" | "txt_red" | "ml_5" | "ml_10" | "mt_5" | "mt_10" | "mt_20" | "mb_5" | "p_15" | "pr_15" | "full_width" | "d_none" | "flexColumn" | "justifyContentBetween" | "jc_end" | "ac_center" | "ai_center" | "cursor_pointer" | "collapse" | "collapse_label" | "collapse_error" | "datepicker" | "input__boolean__on" | "input__boolean__off" | "input__invalid" | "invalid_feedback">;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maif/react-forms",
   "description": "Build react safe forms as fast as possible",
-  "version": "1.0.12",
+  "version": "1.0.16",
   "main": "lib/index.js",
   "author": "MAIF team",
   "keywords": [