nornj-react/lib/extension/mobx/mobxFormData.js

React bindings for NornJ template engine.

"use strict";

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useFormData = useFormData;

var _react = _interopRequireWildcard(require("react"));

var _nornj = _interopRequireWildcard(require("nornj"));

var _mobx = require("mobx");

var _asyncValidator = _interopRequireDefault(require("async-validator"));

var _extensionConfig = _interopRequireDefault(require("../../../mobx/formData/extensionConfig"));

var _moment = _interopRequireDefault(require("moment"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

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; }

function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }

function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }

function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }

function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var createFormData = function createFormData(options) {
  return {
    _njMobxFormData: true,
    fieldDatas: new Map(),
    _operate: function _operate(name, callback, callbackMulti, callbackMultiReturn) {
      if (typeof name === 'string') {
        return callback(name);
      } else {
        var names = Array.isArray(name) ? name : [];
        this.fieldDatas.forEach(function (fieldData, name) {
          (!names.length || names.indexOf(name) > -1) && (callbackMulti || callback)(name);
        });

        if (callbackMultiReturn) {
          return callbackMultiReturn(names);
        }
      }
    },
    _validate: function _validate(name) {
      var _this = this;

      var oFd = this.fieldDatas.get(name);
      var value = this[name];
      return new Promise(function (resolve, reject) {
        oFd.validatorSchema.validate(_defineProperty({}, name, value), {}, function (errors, fields) {
          if (errors) {
            var _errors$;

            _this.error(name, errors === null || errors === void 0 ? void 0 : (_errors$ = errors[0]) === null || _errors$ === void 0 ? void 0 : _errors$.message);

            reject({
              values: _defineProperty({}, name, value),
              errors: errors,
              fields: fields
            });
          } else {
            _this.clear(name, true);

            resolve(_defineProperty({}, name, value));
          }
        });
      });
    },
    validate: function validate(names) {
      var _this2 = this;

      var validators = [];
      return this._operate(names, function (name) {
        return _this2._validate(name);
      }, function (name) {
        return validators.push(_this2._validate(name));
      }, function () {
        return new Promise(function (resolve, reject) {
          Promise.all(validators).then(function (values) {
            return resolve(Object.assign.apply(Object, [{}].concat(_toConsumableArray(values))));
          })["catch"](function (errorInfo) {
            return reject(errorInfo);
          });
        });
      });
    },
    error: function error(name, help) {
      var oFd = this.fieldDatas.get(name);
      oFd.validateStatus = 'error';
      oFd.help = help;
    },
    _clear: function _clear(name, success) {
      var oFd = this.fieldDatas.get(name);
      oFd.validateStatus = success ? 'success' : null;
      oFd.help = null;
    },
    clear: function clear(names, success) {
      var _this3 = this;

      return this._operate(names, function (name) {
        return _this3._clear(name, success);
      });
    },
    _reset: function _reset(name) {
      this.clear(name);
      var oFd = this.fieldDatas.get(name);
      oFd.reset();
    },
    reset: function reset(names) {
      var _this4 = this;

      return this._operate(names, function (name) {
        return _this4._reset(name);
      });
    },
    add: function add(fieldData) {
      var _this5 = this;

      var name = fieldData.name,
          value = fieldData.value,
          _fieldData$trigger = fieldData.trigger,
          trigger = _fieldData$trigger === void 0 ? 'valueChange' : _fieldData$trigger,
          rules = fieldData.rules,
          ruleOptions = _objectWithoutProperties(fieldData, ["name", "value", "trigger", "rules"]);

      var fd = _objectSpread({
        name: name,
        value: value,
        trigger: trigger,
        rules: rules
      }, ruleOptions);

      var _rules = rules ? rules : [ruleOptions];

      fd.rules = _rules.map(function (rule, i) {
        var oRule = (0, _mobx.observable)(rule);
        (0, _mobx.observe)(oRule, function (change) {
          var schemaRules = fd.validatorSchema.rules[name];
          Object.assign(schemaRules[i], oRule);
        });
        return oRule;
      });

      fd.setDefaultRule = function (rule) {
        var schemaRules = fd.validatorSchema.rules[name];

        _rules.forEach(function (r, i) {
          if (r.type == null) {
            schemaRules[i].type = rule.type;
          }
        });
      };

      fd.validatorSchema = new _asyncValidator["default"](_defineProperty({}, name, _rules.map(function (_ref) {
        var _ref$type = _ref.type,
            type = _ref$type === void 0 ? 'string' : _ref$type,
            _ref$required = _ref.required,
            required = _ref$required === void 0 ? false : _ref$required,
            _transform = _ref.transform,
            others = _objectWithoutProperties(_ref, ["type", "required", "transform"]);

        return _objectSpread({
          type: type,
          required: required,
          transform: function transform(_value) {
            var _value2;

            switch (this.type) {
              case 'number':
              case 'integer':
              case 'float':
                _value = _nornj["default"].isString(_value) && ((_value2 = _value) === null || _value2 === void 0 ? void 0 : _value2.trim()) !== '' && !isNaN(_value) ? +_value : _value;
                break;

              case 'date':
                if (_moment["default"].isMoment(_value)) {
                  _value = _value.toDate();
                }

                break;
            }

            return _transform ? _transform(_value) : _value;
          }
        }, others);
      })));

      fd.reset = function () {
        if (this.value !== value) {
          this._resetting = true;
        }

        this.value = value;
      };

      var oFd = (0, _mobx.observable)(fd);
      this.fieldDatas.set(name, oFd);

      if (options === null || options === void 0 ? void 0 : options.validateMessages) {
        var validateMessages = options.validateMessages;
        fd.validatorSchema.messages(typeof validateMessages === 'function' ? validateMessages(oFd) : validateMessages);
      }

      !(0, _mobx.isComputedProp)(this, name) && (0, _mobx.extendObservable)(this, Object.defineProperty({}, name, {
        get: function get() {
          var _this$fieldDatas$get;

          return (_this$fieldDatas$get = this.fieldDatas.get(name)) === null || _this$fieldDatas$get === void 0 ? void 0 : _this$fieldDatas$get.value;
        },
        set: function set(value) {
          this.setValue(name, value);
        },
        enumerable: true,
        configurable: true
      }));

      if (trigger === 'valueChange') {
        oFd._reactionDispose = (0, _mobx.reaction)(function () {
          return Array.isArray(_this5[name]) ? _this5[name].map(function (item) {
            return item;
          }) : _this5[name];
        }, function () {
          if (!oFd._resetting) {
            _this5.validate(name)["catch"](_nornj["default"].noop);
          }

          oFd._resetting = false;
        });
      }
    },
    "delete": function _delete(name) {
      var oFd = this.fieldDatas.get(name);
      oFd === null || oFd === void 0 ? void 0 : oFd._reactionDispose();
      this.fieldDatas["delete"](name);
    },
    setValue: function setValue(name, value) {
      var _this6 = this;

      (0, _mobx.runInAction)(function () {
        if (typeof name === 'string') {
          var fieldData = _this6.fieldDatas.get(name);

          if (fieldData) {
            fieldData.value = value;
          }
        } else {
          _this6.fieldDatas.forEach(function (fieldData, fieldName) {
            if (fieldName in name) {
              fieldData.value = name[fieldName];
            }
          });
        }
      });
    },

    get formData() {
      return this;
    }

  };
};

function getChildrenWithoutFragment(children) {
  var actualChildren = [];
  children.forEach(function (child) {
    if (!(0, _react.isValidElement)(child) || child.type !== _react.Fragment) {
      if (Array.isArray(child)) {
        var _getChildrenWithoutFr;

        (_getChildrenWithoutFr = getChildrenWithoutFragment(child)) === null || _getChildrenWithoutFr === void 0 ? void 0 : _getChildrenWithoutFr.forEach(function (child) {
          return actualChildren.push(child);
        });
      } else {
        actualChildren.push(child);
      }
    } else {
      var _getChildrenWithoutFr2, _ref3;

      (_getChildrenWithoutFr2 = getChildrenWithoutFragment((_ref3 = child === null || child === void 0 ? void 0 : child.props) === null || _ref3 === void 0 ? void 0 : _ref3.children)) === null || _getChildrenWithoutFr2 === void 0 ? void 0 : _getChildrenWithoutFr2.forEach(function (child) {
        return actualChildren.push(child);
      });
    }
  });
  return actualChildren;
}

(0, _nornj.registerExtension)('mobxFormData', function (options) {
  var children = options.children;
  var props = options.props;

  var _children = children();

  if (!Array.isArray(_children)) {
    _children = [_children];
  }

  var formData = createFormData(props);
  getChildrenWithoutFragment(_children).forEach(function (fieldData) {
    fieldData && formData.add(fieldData);
  });
  return (props === null || props === void 0 ? void 0 : props.observable) ? (0, _mobx.observable)(formData) : formData;
}, _extensionConfig["default"].mobxFormData);
(0, _nornj.registerExtension)('mobxFieldData', function (options) {
  return options.props;
}, _extensionConfig["default"].mobxFieldData);
(0, _nornj.registerExtension)('mobxField', function (options) {
  var value = options.value,
      tagProps = options.tagProps;

  var _value = value();

  var prop = _value.prop,
      source = _value.source;
  var fieldNames = Array.isArray(prop) ? prop : [prop];
  var validateStatus = null;
  var help = [];
  fieldNames.forEach(function (fieldName) {
    var oFd = source.fieldDatas.get(fieldName);

    if (validateStatus == null && oFd.validateStatus != null) {
      validateStatus = oFd.validateStatus;
    }

    if (oFd.help != null) {
      help.push(_react["default"].createElement("div", {
        key: help.length
      }, oFd.help));
    }

    if (tagProps.required == null) {
      tagProps.required = oFd.rules.find(function (rule) {
        return rule.required;
      });
    }

    if (tagProps.label) {
      oFd.label = tagProps.label;
    } else if (oFd.label) {
      tagProps.label = oFd.label;
    }
  });
  tagProps.validateStatus = validateStatus;

  if (help.length) {
    tagProps.help = _react["default"].createElement(_react["default"].Fragment, null, help);
  }
}, _extensionConfig["default"].mobxField);

function useFormData(formDataElement) {
  var deps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
  return (0, _react.useMemo)(function () {
    return (0, _nornj.as)((0, _mobx.observable)(formDataElement()));
  }, deps);
}