@nutui/nutui-react 3.0.17-beta.0 → 3.0.17-beta.2

package/dist/cjs/packages/form/style/index.js

@@ -0,0 +1,4 @@
+import '../../cellgroup/style';
+import '../../cell/style';
+import '../../formitem/style';
+import './form.scss';

package/dist/cjs/packages/form/style/style.css

@@ -0,0 +1,4 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */

package/dist/cjs/packages/form/style-jmapp/css.js

@@ -0,0 +1,4 @@
+import '../../cellgroup/style-jmapp/css';
+import '../../cell/style-jmapp/css';
+import '../../formitem/style-jmapp/css';
+import './style.css';

package/dist/cjs/packages/form/style-jmapp/form.scss

@@ -0,0 +1 @@
+

package/dist/cjs/packages/form/style-jmapp/index.js

@@ -0,0 +1,4 @@
+import '../../cellgroup/style-jmapp';
+import '../../cell/style-jmapp';
+import '../../formitem/style-jmapp';
+import './form.scss';

package/dist/cjs/packages/form/style-jmapp/style.css

@@ -0,0 +1,4 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */

package/dist/cjs/packages/form/style-jrkf/css.js

@@ -0,0 +1,4 @@
+import '../../cellgroup/style-jrkf/css';
+import '../../cell/style-jrkf/css';
+import '../../formitem/style-jrkf/css';
+import './style.css';

package/dist/cjs/packages/form/style-jrkf/form.scss

@@ -0,0 +1 @@
+

package/dist/cjs/packages/form/style-jrkf/index.js

@@ -0,0 +1,4 @@
+import '../../cellgroup/style-jrkf';
+import '../../cell/style-jrkf';
+import '../../formitem/style-jrkf';
+import './form.scss';

package/dist/cjs/packages/form/style-jrkf/style.css

@@ -0,0 +1,4 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */

package/dist/cjs/packages/form/useform.d.ts

@@ -0,0 +1,4 @@
+import { FormInstance, NamePath } from "../../types";
+export declare const SECRET = "NUT_FORM_INTERNAL";
+export declare const useForm: (form?: FormInstance) => [FormInstance];
+export declare const useWatch: (path: NamePath, form: FormInstance) => any;

package/dist/cjs/packages/form/useform.js

@@ -0,0 +1,424 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SECRET: function() {
+        return SECRET;
+    },
+    useForm: function() {
+        return useForm;
+    },
+    useWatch: function() {
+        return useWatch;
+    }
+});
+var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+var _async_to_generator = require("@swc/helpers/_/_async_to_generator");
+var _class_call_check = require("@swc/helpers/_/_class_call_check");
+var _create_class = require("@swc/helpers/_/_create_class");
+var _define_property = require("@swc/helpers/_/_define_property");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
+var _to_consumable_array = require("@swc/helpers/_/_to_consumable_array");
+var _ts_generator = require("@swc/helpers/_/_ts_generator");
+var _react = require("react");
+var _asyncvalidator = /*#__PURE__*/ _interop_require_default._(require("async-validator"));
+var _merge = require("../../utils/merge");
+var SECRET = 'NUT_FORM_INTERNAL';
+/**
+ * 用于存储表单的数据
+ */ var FormStore = /*#__PURE__*/ function() {
+    "use strict";
+    function FormStore() {
+        var _this = this;
+        var _this1 = this;
+        (0, _class_call_check._)(this, FormStore);
+        var _this2 = this;
+        // 初始化数据
+        (0, _define_property._)(this, "initialValues", {});
+        (0, _define_property._)(this, "updateList", []);
+        // 存放表单中所有的数据 eg. {password: "ddd",username: "123"}
+        (0, _define_property._)(this, "store", {});
+        // 所有的组件实例
+        (0, _define_property._)(this, "fieldEntities", []);
+        // 校验成功或失败的回调，onFinish、onFinishFailed
+        (0, _define_property._)(this, "callbacks", {});
+        (0, _define_property._)(this, "errors", {});
+        /**
+   * 注册组件实例
+   * @param field
+   */ (0, _define_property._)(this, "registerField", function(field) {
+            _this.fieldEntities.push(field);
+            return function() {
+                _this.fieldEntities = _this.fieldEntities.filter(function(item) {
+                    return item !== field;
+                });
+            };
+        });
+        /**
+   * 获取 formItem 的值
+   * @param name
+   */ (0, _define_property._)(this, "getFieldValue", function(name) {
+            var _this_store;
+            return (_this_store = _this.store) === null || _this_store === void 0 ? void 0 : _this_store[name];
+        });
+        /**
+   * 获取全部字段
+   */ (0, _define_property._)(this, "getFieldsValue", function(nameList) {
+            if (typeof nameList === 'boolean') {
+                return JSON.parse(JSON.stringify(_this.store));
+            }
+            var fieldsValue = {};
+            nameList.forEach(function(field) {
+                fieldsValue[field] = _this.getFieldValue(field);
+            });
+            return fieldsValue;
+        });
+        /**
+   * 设置 form 的初始值，之后在 reset 的时候使用
+   * @param values
+   * @param init
+   */ (0, _define_property._)(this, "setInitialValues", function(initialValues, init) {
+            _this.initialValues = initialValues || {};
+            if (init) {
+                var nextStore = (0, _merge.merge)(initialValues, _this.store);
+                _this.updateStore(nextStore);
+                _this.notifyWatch();
+            }
+        });
+        /**
+   * 存储组件数据
+   * @param newStore { [name]: newValue }
+   */ (0, _define_property._)(this, "setFieldsValue", function(newStore) {
+            var nextStore = (0, _merge.recursive)(true, _this.store, newStore);
+            _this.updateStore(nextStore);
+            _this.fieldEntities.forEach(function(entity) {
+                var name = entity.props.name;
+                Object.keys(newStore).forEach(function(key) {
+                    if (key === name) {
+                        entity.onStoreChange('update');
+                    }
+                });
+            });
+            _this.updateList.forEach(function(item) {
+                var shouldUpdate = item.condition;
+                if (typeof item.condition === 'function') {
+                    shouldUpdate = item.condition();
+                }
+                if (shouldUpdate) {
+                    item.entity.onStoreChange('update');
+                }
+            });
+            _this.notifyWatch();
+        });
+        (0, _define_property._)(this, "setFieldValue", function(name, value) {
+            var store = (0, _define_property._)({}, name, value);
+            _this.setFieldsValue(store);
+            _this.notifyWatch([
+                name
+            ]);
+        });
+        (0, _define_property._)(this, "setCallback", function(callback) {
+            _this.callbacks = (0, _object_spread._)({}, _this.callbacks, callback);
+        });
+        (0, _define_property._)(this, "validateEntities", /*#__PURE__*/ function() {
+            var _ref = (0, _async_to_generator._)(function(entity, errs) {
+                var _entity_props, name, _entity_props_rules, rules, descriptor, validator, _this_store, param, errors, _errs;
+                return (0, _ts_generator._)(this, function(_state) {
+                    switch(_state.label){
+                        case 0:
+                            _entity_props = entity.props, name = _entity_props.name, _entity_props_rules = _entity_props.rules, rules = _entity_props_rules === void 0 ? [] : _entity_props_rules;
+                            if (!name) {
+                                console.warn('Form field missing name property');
+                                return [
+                                    2
+                                ];
+                            }
+                            descriptor = {};
+                            if (rules.length) {
+                                // 多条校验规则
+                                if (rules.length > 1) {
+                                    descriptor[name] = [];
+                                    rules.forEach(function(v) {
+                                        descriptor[name].push(v);
+                                    });
+                                } else {
+                                    descriptor[name] = rules[0];
+                                }
+                            }
+                            validator = new _asyncvalidator.default(descriptor);
+                            _state.label = 1;
+                        case 1:
+                            _state.trys.push([
+                                1,
+                                3,
+                                4,
+                                5
+                            ]);
+                            return [
+                                4,
+                                validator.validate((0, _define_property._)({}, name, (_this_store = _this2.store) === null || _this_store === void 0 ? void 0 : _this_store[name]))
+                            ];
+                        case 2:
+                            _state.sent();
+                            return [
+                                3,
+                                5
+                            ];
+                        case 3:
+                            param = _state.sent();
+                            errors = param.errors;
+                            if (errors) {
+                                ;
+                                (_errs = errs).push.apply(_errs, (0, _to_consumable_array._)(errors));
+                                _this2.errors[name] = errors;
+                            }
+                            return [
+                                3,
+                                5
+                            ];
+                        case 4:
+                            if (!errs || errs.length === 0) {
+                                _this2.errors[name] = [];
+                            }
+                            return [
+                                7
+                            ];
+                        case 5:
+                            entity.onStoreChange('validate');
+                            return [
+                                2
+                            ];
+                    }
+                });
+            });
+            return function(entity, errs) {
+                return _ref.apply(this, arguments);
+            };
+        }());
+        (0, _define_property._)(this, "validateFields", /*#__PURE__*/ function() {
+            var _ref = (0, _async_to_generator._)(function(nameList) {
+                var filterEntities, errs;
+                return (0, _ts_generator._)(this, function(_state) {
+                    switch(_state.label){
+                        case 0:
+                            filterEntities = [];
+                            // this.errors.length = 0
+                            if (!nameList || nameList.length === 0) {
+                                filterEntities = _this2.fieldEntities;
+                            } else {
+                                filterEntities = _this2.fieldEntities.filter(function(param) {
+                                    var name = param.props.name;
+                                    return nameList.includes(name);
+                                });
+                            }
+                            errs = [];
+                            return [
+                                4,
+                                Promise.all(filterEntities.map(/*#__PURE__*/ function() {
+                                    var _ref = (0, _async_to_generator._)(function(entity) {
+                                        return (0, _ts_generator._)(this, function(_state) {
+                                            switch(_state.label){
+                                                case 0:
+                                                    return [
+                                                        4,
+                                                        _this2.validateEntities(entity, errs)
+                                                    ];
+                                                case 1:
+                                                    _state.sent();
+                                                    return [
+                                                        2
+                                                    ];
+                                            }
+                                        });
+                                    });
+                                    return function(entity) {
+                                        return _ref.apply(this, arguments);
+                                    };
+                                }()))
+                            ];
+                        case 1:
+                            _state.sent();
+                            return [
+                                2,
+                                errs
+                            ];
+                    }
+                });
+            });
+            return function(nameList) {
+                return _ref.apply(this, arguments);
+            };
+        }());
+        (0, _define_property._)(this, "submit", /*#__PURE__*/ (0, _async_to_generator._)(function() {
+            var errors, _this_callbacks_onFinish, _this_callbacks, _this_callbacks_onFinishFailed, _this_callbacks1;
+            return (0, _ts_generator._)(this, function(_state) {
+                switch(_state.label){
+                    case 0:
+                        return [
+                            4,
+                            _this2.validateFields()
+                        ];
+                    case 1:
+                        errors = _state.sent();
+                        if (errors.length === 0) {
+                            ;
+                            (_this_callbacks_onFinish = (_this_callbacks = _this2.callbacks).onFinish) === null || _this_callbacks_onFinish === void 0 ? void 0 : _this_callbacks_onFinish.call(_this_callbacks, _this2.store);
+                        } else if (errors.length > 0) {
+                            ;
+                            (_this_callbacks_onFinishFailed = (_this_callbacks1 = _this2.callbacks).onFinishFailed) === null || _this_callbacks_onFinishFailed === void 0 ? void 0 : _this_callbacks_onFinishFailed.call(_this_callbacks1, _this2.store, errors);
+                        }
+                        return [
+                            2
+                        ];
+                }
+            });
+        }));
+        (0, _define_property._)(this, "resetFields", function(namePaths) {
+            if (namePaths && namePaths.length) {
+                namePaths.forEach(function(path) {
+                    _this.errors[path] = null;
+                    _this.fieldEntities.forEach(function(entity) {
+                        var name = entity.props.name;
+                        if (name === path) {
+                            if (path in _this.initialValues) {
+                                _this.updateStore((0, _define_property._)({}, path, _this.initialValues[path]));
+                            } else {
+                                delete _this.store[path];
+                            }
+                            entity.onStoreChange('reset');
+                        }
+                    });
+                });
+            } else {
+                var nextStore = (0, _merge.merge)({}, _this.initialValues);
+                _this.updateStore(nextStore);
+                _this.fieldEntities.forEach(function(entity) {
+                    entity.onStoreChange('reset');
+                });
+            }
+        });
+        // 监听事件
+        (0, _define_property._)(this, "registerUpdate", function(field, shouldUpdate) {
+            _this.updateList.push({
+                entity: field,
+                condition: shouldUpdate
+            });
+            return function() {
+                _this.updateList = _this.updateList.filter(function(i) {
+                    return i.entity !== field;
+                });
+            };
+        });
+        (0, _define_property._)(this, "dispatch", function(param) {
+            var name = param.name;
+            _this.validateFields([
+                name
+            ]);
+        });
+        (0, _define_property._)(this, "getInternal", function(key) {
+            if (key === SECRET) {
+                return {
+                    registerField: _this.registerField,
+                    setCallback: _this.setCallback,
+                    setInitialValues: _this.setInitialValues,
+                    dispatch: _this.dispatch,
+                    store: _this.store,
+                    fieldEntities: _this.fieldEntities,
+                    registerUpdate: _this.registerUpdate,
+                    registerWatch: _this.registerWatch
+                };
+            }
+        });
+        (0, _define_property._)(this, "getForm", function() {
+            return {
+                getFieldValue: _this.getFieldValue,
+                getFieldsValue: _this.getFieldsValue,
+                setFieldsValue: _this.setFieldsValue,
+                setFieldValue: _this.setFieldValue,
+                resetFields: _this.resetFields,
+                validateFields: _this.validateFields,
+                submit: _this.submit,
+                errors: _this.errors,
+                getInternal: _this.getInternal
+            };
+        });
+        (0, _define_property._)(this, "watchList", []);
+        (0, _define_property._)(this, "registerWatch", function(callback) {
+            _this.watchList.push(callback);
+            return function() {
+                _this.watchList = _this.watchList.filter(function(fn) {
+                    return fn !== callback;
+                });
+            };
+        });
+        (0, _define_property._)(this, "notifyWatch", function() {
+            var namePath = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
+            if (_this1.watchList.length) {
+                var allValues;
+                if (!namePath || namePath.length === 0) {
+                    allValues = _this1.getFieldsValue(true);
+                } else {
+                    allValues = _this1.getFieldsValue(namePath);
+                }
+                _this1.watchList.forEach(function(callback) {
+                    callback(allValues, namePath);
+                });
+            }
+        });
+        this.callbacks = {
+            onFinish: function onFinish() {},
+            onFinishFailed: function onFinishFailed() {}
+        };
+    }
+    (0, _create_class._)(FormStore, [
+        {
+            key: "updateStore",
+            value: function updateStore(nextStore) {
+                this.store = nextStore;
+            }
+        }
+    ]);
+    return FormStore;
+}();
+var useForm = function useForm(form) {
+    var formRef = (0, _react.useRef)();
+    if (!formRef.current) {
+        if (form) {
+            formRef.current = form;
+        } else {
+            var formStore = new FormStore();
+            formRef.current = formStore.getForm();
+        }
+    }
+    return [
+        formRef.current
+    ];
+};
+var useWatch = function useWatch(path, form) {
+    var formInstance = form.getInternal(SECRET);
+    var _useState = (0, _sliced_to_array._)((0, _react.useState)(), 2), value = _useState[0], setValue = _useState[1];
+    (0, _react.useEffect)(function() {
+        var unsubscribe = formInstance.registerWatch(function(data, namePath) {
+            var value = data[path];
+            setValue(value);
+        });
+        var initialValue = form.getFieldsValue(true);
+        if (value !== initialValue[path]) {
+            setValue(initialValue[path]);
+        }
+        return function() {
+            return unsubscribe();
+        };
+    }, [
+        form
+    ]);
+    return value;
+};

package/dist/cjs/packages/formitem/formitem.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { Context } from '../form/context';
+import { WebFormItemProps } from "../../types";
+export declare class FormItem extends React.Component<Partial<WebFormItemProps>, {
+    resetCount: number;
+}> {
+    static defaultProps: WebFormItemProps;
+    static contextType: any;
+    context: React.ContextType<typeof Context>;
+    private cancelRegister;
+    private componentRef;
+    private eventOff;
+    constructor(props: WebFormItemProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    getControlled: (children: React.ReactElement) => any;
+    refresh: () => void;
+    onStoreChange: (type?: string) => void;
+    getClassNameWithDirection(className: string): string;
+    renderLayout: (childNode: React.ReactNode) => React.JSX.Element;
+    render(): React.JSX.Element;
+}