zp-bee
Version:
zp-bee,是一款基于 Dumi,由 React + TypeScript 开发的组件库 🎉。
279 lines (248 loc) • 8.52 kB
JavaScript
import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
import React, { useMemo, useEffect, useRef } from 'react';
import uniqueId from 'lodash/uniqueId';
import { parseFormConfigs, configToItemStore, createUnionValidate, createUnionValidator, createAutoHandle, parseAddFormConfigs } from './utils';
import AutoWired from './AutoWired';
import Form from './Form';
import Item from './Item';
export function useUpdateEffectByCount(effect, deps) {
var num = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
var count = useRef(0);
return useEffect(function () {
if (count.current < num) {
count.current += 1;
} else return effect();
}, deps);
}
export function useUpdateEffect(effect, deps) {
return useUpdateEffectByCount(effect, deps, 1);
}
export function useStore(
/**
* 表单配置
*/
formConfigs, depsOrOptions, deps) {
var options = Array.isArray(depsOrOptions) ? undefined : depsOrOptions;
var realDeps = Array.isArray(depsOrOptions) ? depsOrOptions : deps;
var _useMemo = useMemo(function () {
return parseFormConfigs(formConfigs);
}, []),
formStore = _useMemo.formStore;
useUpdateEffect(function () {
for (var key in formStore.itemStores) {
if (Reflect.has(formStore.itemStores, key)) {
if (!formConfigs[key]) {
// 依赖更新后处理 删除不需要的 subStore
formStore.removeItemStore(formStore.itemStores[key]);
} else {
// 依赖更新后处理修改 subStore,幂等
formStore.itemStores[key].setProps(formConfigs[key]);
}
}
} // 依赖更新后处理 新增的 subStore
for (var _key in formConfigs) {
if (Reflect.has(formConfigs, _key)) {
if (!formStore.itemStores[_key]) {
var componentStore = configToItemStore(Object.assign({
key: _key,
formStore: formStore
}, formConfigs[_key]));
formStore.addItemStore(componentStore);
}
}
}
}, realDeps);
useAutoLink(formStore, options, realDeps);
return formStore;
}
/**
* 在现有的FormStore响应时的增加ItemStore
* @param formStore
* @param formConfigs
* @param deps
* @param options
*/
export function useAddItemStore(formStore,
/**
* 表单配置
*/
formConfigs) {
var deps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
var
/**
* 可选配置,目前支持交联验证,交联handle
*/
options = arguments.length > 3 ? arguments[3] : undefined;
useEffect(function () {
var componentStores = parseAddFormConfigs(formStore, formConfigs);
return function () {
Object.values(componentStores).forEach(function (subStore) {
formStore.removeItemStore(subStore);
});
};
}, deps);
useAutoLink(formStore, options, deps);
}
export function useAutoLink(formStore, options) {
var deps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
var autoValidatorMap = useMemo(function () {
if (options && options.autoValidate) {
if (Array.isArray(options.autoValidate)) {
return _toConsumableArray(Array(options.autoValidate.length)).map(function (_, i) {
return {
key: uniqueId("".concat(options.autoValidate[i].primaryKey, "-")),
primaryKey: options.autoValidate[i].primaryKey
};
});
} else {
return [{
key: uniqueId("".concat(options.autoValidate.primaryKey, "-")),
primaryKey: options.autoValidate.primaryKey
}];
}
}
return [];
}, deps);
useEffect(function () {
var unListen = []; // 处理 autoValidator 注册
if (options && options.autoValidate) {
if (Array.isArray(options.autoValidate)) {
var i = 0;
var _iterator = _createForOfIteratorHelper(options.autoValidate),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var autoValidator = _step.value;
var listen = createUnionValidate(autoValidator, formStore, autoValidatorMap[i].key);
unListen.push(listen);
i += 1;
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
} else {
var _listen = createUnionValidate(options.autoValidate, formStore, autoValidatorMap[0].key);
unListen.push(_listen);
}
} // 处理 autoHandle 注册
if (options && options.autoHandle) {
if (Array.isArray(options.autoHandle)) {
var _iterator2 = _createForOfIteratorHelper(options.autoHandle),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var autoHandle = _step2.value;
var _listen2 = createAutoHandle(autoHandle, formStore);
unListen.push(_listen2);
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
} else {
var _listen3 = createAutoHandle(options.autoHandle, formStore);
unListen.push(_listen3);
}
}
return function () {
var _iterator3 = _createForOfIteratorHelper(unListen),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var _listen4 = _step3.value;
_listen4();
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
};
}, deps);
useEffect(function () {
// 处理 autoValidator,创建store内的validator方便主动调用
if (options && options.autoValidate) {
if (Array.isArray(options.autoValidate)) {
var i = 0;
var _iterator4 = _createForOfIteratorHelper(options.autoValidate),
_step4;
try {
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
var autoValidator = _step4.value;
var target = formStore.unionValidatorDict[autoValidator.primaryKey];
if (Array.isArray(target)) {
target.push(createUnionValidator(autoValidator, formStore, autoValidatorMap[i].key));
} else {
// eslint-disable-next-line no-param-reassign
formStore.unionValidatorDict[autoValidator.primaryKey] = [createUnionValidator(autoValidator, formStore, autoValidatorMap[i].key)];
}
i += 1;
}
} catch (err) {
_iterator4.e(err);
} finally {
_iterator4.f();
}
} else {
// eslint-disable-next-line no-param-reassign
formStore.unionValidatorDict[options.autoValidate.primaryKey] = [createUnionValidator(options.autoValidate, formStore, autoValidatorMap[0].key)];
}
} // 生命周期结束删除unionValidator及其验证结果,但是不验证新的validator
return function () {
// eslint-disable-next-line no-param-reassign
formStore.unionValidatorDict = {};
autoValidatorMap.forEach(function (autoValidatorMap) {
var componentStore = formStore.itemStores[autoValidatorMap.primaryKey];
if (componentStore) {
componentStore.delUnionErr([autoValidatorMap.key]);
}
});
};
}, deps);
}
/**
* 只是为了方便类型验证
* @param store store
*/
export function useAutoWired(store) {
return useMemo(function () {
var AutoWiredHelp = AutoWired;
return function (props) {
return /*#__PURE__*/React.createElement(AutoWiredHelp, Object.assign({
store: store
}, props));
};
}, [store]);
}
/**
* 只是为了方便类型验证, 利用store校验id是否匹配,达到类型安全的目的
* @param store store
*/
export function useForm(store) {
return useMemo(function () {
var FormHelp = function FormHelp(props) {
return /*#__PURE__*/React.createElement(Form, Object.assign({
store: store
}, props));
};
var ItemHelp = function ItemHelp(props) {
return /*#__PURE__*/React.createElement(Item, Object.assign({
store: store
}, props));
};
var AutoWiredHelp = function AutoWiredHelp(props) {
return /*#__PURE__*/React.createElement(AutoWired, Object.assign({
store: store
}, props));
};
return {
Form: FormHelp,
Item: ItemHelp,
AutoWired: AutoWiredHelp
};
}, [store]);
}