@olapat/react-useform
Version:
react hook useform controller
146 lines (145 loc) • 5.08 kB
JavaScript
;
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = require("react");
var useCheckValidate_1 = __importDefault(require("../useForm/useCheckValidate"));
function reducerValues(state, action) {
switch (action.type) {
case 'ADD': {
var newState = __spreadArray(__spreadArray([], state, true), [action.payload], false);
return newState;
}
case 'ADD_MANY': {
var newState = __spreadArray(__spreadArray([], state, true), action.payload, true);
return newState;
}
case 'CHANGE': {
var newState = __spreadArray([], state, true);
newState.splice(action.payload.ix, 1, action.payload.value);
return newState;
}
case 'REMOVE': {
var newState = __spreadArray([], state, true);
newState.splice(action.payload.ix, 1);
return newState;
}
case 'SET':
return action.payload;
case 'SET_RULES_ITEM': {
var newState = __spreadArray([], state, true);
var prevState = newState[action.payload.ix];
var keys = Object.keys(action.payload.rules);
var newErrors_1 = {};
keys.forEach(function (key) {
newErrors_1[key] = undefined;
});
newState.splice(action.payload.ix, 1, __assign(__assign({}, prevState), { rules: __assign(__assign({}, prevState.rules), action.payload.rules), errors: __assign(__assign({}, prevState.errors), newErrors_1) }));
return newState;
}
case 'RESET':
return [];
default:
return state;
}
}
var useList = function (props) {
var initialValues = props.initialValues;
var _a = (0, react_1.useReducer)(reducerValues, initialValues || []), values = _a[0], dispatchValues = _a[1];
var checkValidate = (0, useCheckValidate_1.default)();
var addListItem = (0, react_1.useCallback)(function (init) {
dispatchValues({
type: 'ADD',
payload: init
});
}, []);
var changeListItem = (0, react_1.useCallback)(function (ix, value) {
dispatchValues({
type: 'CHANGE',
payload: {
ix: ix,
value: value
}
});
}, []);
var removeListItem = (0, react_1.useCallback)(function (ix) {
dispatchValues({
type: 'REMOVE',
payload: {
ix: ix
}
});
}, []);
var validateListItem = (0, react_1.useCallback)(function () {
var isValid = true;
var valuesFlat = values.map(function (item) {
var errors = checkValidate(item.values, item.rules);
if (Object.keys(errors).length) {
isValid = false;
}
return __assign(__assign({}, item), { errors: errors });
});
dispatchValues({
type: 'SET',
payload: valuesFlat
});
return isValid;
}, [values, checkValidate]);
var addManyListItem = (0, react_1.useCallback)(function (num, init) {
var arrayNumber = [];
for (var index = 1; index <= Number(num); index++) {
arrayNumber.push(init);
}
dispatchValues({
type: 'ADD_MANY',
payload: arrayNumber
});
}, []);
var setList = (0, react_1.useCallback)(function (arrayList) {
dispatchValues({
type: 'SET',
payload: arrayList
});
}, []);
var setRulesItem = (0, react_1.useCallback)(function (ix, rules) {
dispatchValues({
type: 'SET_RULES_ITEM',
payload: {
ix: ix,
rules: rules
}
});
}, []);
return {
values: values,
addListItem: addListItem,
changeListItem: changeListItem,
removeListItem: removeListItem,
validateListItem: validateListItem,
addManyListItem: addManyListItem,
setList: setList,
setRulesItem: setRulesItem
};
};
exports.default = useList;