@altiore/form
Version:
Form helper for building powerful forms
105 lines (104 loc) • 5.37 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useList = void 0;
var react_1 = require("react");
var isEqual_1 = __importDefault(require("lodash/isEqual"));
var utils_1 = require("./utils");
var DEF_GET_VALUE = function () {
return console.info('Получение переменной внутри валидации массива не реализовано');
};
var useList = function (name, validators, fieldMeta, setFormContextItems) {
var fieldName = (0, react_1.useMemo)(function () {
var _a;
return (_a = fieldMeta === null || fieldMeta === void 0 ? void 0 : fieldMeta.name) !== null && _a !== void 0 ? _a : name;
}, [name, fieldMeta === null || fieldMeta === void 0 ? void 0 : fieldMeta.name]);
var _a = (0, react_1.useState)([]), localItems = _a[0], setLocalItems = _a[1];
var items = (0, react_1.useMemo)(function () {
if (fieldMeta === null || fieldMeta === void 0 ? void 0 : fieldMeta.items) {
return fieldMeta.items;
}
return localItems;
}, [fieldMeta === null || fieldMeta === void 0 ? void 0 : fieldMeta.items, localItems, name]);
var _b = (0, react_1.useState)(), errors = _b[0], setErrors = _b[1];
var getErrors = (0, react_1.useCallback)(function (curItems) {
var hasValidation = Boolean(validators === null || validators === void 0 ? void 0 : validators.length);
var errorList = [];
if (hasValidation) {
validators.forEach(function (validateOne) {
// TODO: вместо того, чтоб передавать в эту функцию для валидации items,
// возможно, целесообразнее найти все значения массива
var result = validateOne(curItems, name, DEF_GET_VALUE);
if (result) {
errorList.push(result);
}
});
}
return errorList;
}, [validators, name]);
var setItems = (0, react_1.useCallback)(function (set, defaultValue) {
if (setFormContextItems) {
setFormContextItems(fieldName, set, getErrors, defaultValue);
}
else {
setLocalItems(function (curItems) {
var newItems = set(curItems);
setErrors(function (s) {
var errors = getErrors(newItems);
if ((0, isEqual_1.default)(s, errors)) {
return s;
}
return errors;
});
return newItems;
});
}
}, [fieldName, getErrors, setFormContextItems, setLocalItems]);
var addHandler = (0, react_1.useCallback)(function (defaultFieldStateOrEvent, index, offset) {
if (!defaultFieldStateOrEvent) {
return;
}
// проверяем, не является ли defaultFieldStateOrEvent синтетическим объектом события
if (typeof defaultFieldStateOrEvent.persist === 'function') {
setItems(function (s) { return (0, utils_1.add)(s, fieldName, index, offset); }, {});
}
else {
// в случае, если defaultFieldStateOrEvent не синтетическое событие, -
// это дефолтное значение и остальные 2 параметра тоже имеют смысл
setItems(function (s) { return (0, utils_1.add)(s, fieldName, index, offset); }, defaultFieldStateOrEvent);
}
}, [fieldName, setItems]);
var removeHandler = (0, react_1.useCallback)(function (index) {
setItems(function (s) { return (0, utils_1.remove)(s, fieldName, index); });
}, [fieldName, setItems]);
var mapHandler = (0, react_1.useCallback)(function (callback) {
return (0, utils_1.map)(addHandler, removeHandler, items, fieldName, callback);
}, [addHandler, removeHandler, fieldName, items]);
var simplifiedAddHandler = (0, react_1.useCallback)(function (defaultFieldStateOrEvent) {
addHandler(defaultFieldStateOrEvent);
}, [addHandler]);
return (0, react_1.useMemo)(function () {
return [
{
add: simplifiedAddHandler,
map: mapHandler,
// TODO: этот обработчик функционирует непрозрачно для пользователя. Нужно упростить
// апишку, чтоб индексом был фактический отрендереный индекс элемента,
// сейчас в качестве индекса мы принимаем номерное значение элемента в массиве
remove: removeHandler,
},
(fieldMeta === null || fieldMeta === void 0 ? void 0 : fieldMeta.errors) || errors,
];
}, [
addHandler,
errors,
fieldMeta === null || fieldMeta === void 0 ? void 0 : fieldMeta.errors,
fieldName,
items,
mapHandler,
removeHandler,
]);
};
exports.useList = useList;