You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

150 lines
6.0 KiB

"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var React = _interopRequireWildcard(require("react"));
var _useForm3 = _interopRequireDefault(require("./useForm"));
var _FieldContext = _interopRequireWildcard(require("./FieldContext"));
var _FormContext = _interopRequireDefault(require("./FormContext"));
var _valueUtil = require("./utils/valueUtil");
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) { (0, _defineProperty2.default)(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; }
var Form = function Form(_ref, ref) {
var name = _ref.name,
initialValues = _ref.initialValues,
fields = _ref.fields,
form = _ref.form,
preserve = _ref.preserve,
children = _ref.children,
_ref$component = _ref.component,
Component = _ref$component === void 0 ? 'form' : _ref$component,
validateMessages = _ref.validateMessages,
_ref$validateTrigger = _ref.validateTrigger,
validateTrigger = _ref$validateTrigger === void 0 ? 'onChange' : _ref$validateTrigger,
onValuesChange = _ref.onValuesChange,
_onFieldsChange = _ref.onFieldsChange,
_onFinish = _ref.onFinish,
onFinishFailed = _ref.onFinishFailed,
restProps = (0, _objectWithoutProperties2.default)(_ref, ["name", "initialValues", "fields", "form", "preserve", "children", "component", "validateMessages", "validateTrigger", "onValuesChange", "onFieldsChange", "onFinish", "onFinishFailed"]);
var formContext = React.useContext(_FormContext.default); // We customize handle event since Context will makes all the consumer re-render:
// https://reactjs.org/docs/context.html#contextprovider
var _useForm = (0, _useForm3.default)(form),
_useForm2 = (0, _slicedToArray2.default)(_useForm, 1),
formInstance = _useForm2[0];
var _formInstance$getInte = formInstance.getInternalHooks(_FieldContext.HOOK_MARK),
useSubscribe = _formInstance$getInte.useSubscribe,
setInitialValues = _formInstance$getInte.setInitialValues,
setCallbacks = _formInstance$getInte.setCallbacks,
setValidateMessages = _formInstance$getInte.setValidateMessages,
setPreserve = _formInstance$getInte.setPreserve; // Pass ref with form instance
React.useImperativeHandle(ref, function () {
return formInstance;
}); // Register form into Context
React.useEffect(function () {
formContext.registerForm(name, formInstance);
return function () {
formContext.unregisterForm(name);
};
}, [formContext, formInstance, name]); // Pass props to store
setValidateMessages(_objectSpread({}, formContext.validateMessages, {}, validateMessages));
setCallbacks({
onValuesChange: onValuesChange,
onFieldsChange: function onFieldsChange(changedFields) {
formContext.triggerFormChange(name, changedFields);
if (_onFieldsChange) {
for (var _len = arguments.length, rest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
rest[_key - 1] = arguments[_key];
}
_onFieldsChange.apply(void 0, [changedFields].concat(rest));
}
},
onFinish: function onFinish(values) {
formContext.triggerFormFinish(name, values);
if (_onFinish) {
_onFinish(values);
}
},
onFinishFailed: onFinishFailed
});
setPreserve(preserve); // Set initial value, init store value when first mount
var mountRef = React.useRef(null);
setInitialValues(initialValues, !mountRef.current);
if (!mountRef.current) {
mountRef.current = true;
} // Prepare children by `children` type
var childrenNode = children;
var childrenRenderProps = typeof children === 'function';
if (childrenRenderProps) {
var values = formInstance.getFieldsValue(true);
childrenNode = children(values, formInstance);
} // Not use subscribe when using render props
useSubscribe(!childrenRenderProps); // Listen if fields provided. We use ref to save prev data here to avoid additional render
var prevFieldsRef = React.useRef();
React.useEffect(function () {
if (!(0, _valueUtil.isSimilar)(prevFieldsRef.current || [], fields || [])) {
formInstance.setFields(fields || []);
}
prevFieldsRef.current = fields;
}, [fields, formInstance]);
var formContextValue = React.useMemo(function () {
return _objectSpread({}, formInstance, {
validateTrigger: validateTrigger
});
}, [formInstance, validateTrigger]);
var wrapperNode = React.createElement(_FieldContext.default.Provider, {
value: formContextValue
}, childrenNode);
if (Component === false) {
return wrapperNode;
}
return React.createElement(Component, Object.assign({}, restProps, {
onSubmit: function onSubmit(event) {
event.preventDefault();
event.stopPropagation();
formInstance.submit();
}
}), wrapperNode);
};
var _default = Form;
exports.default = _default;