Socket
Socket
Sign inDemoInstall

@altiore/form

Package Overview
Dependencies
6
Maintainers
1
Versions
180
Alerts
File Explorer

Advanced tools

npm Scripts

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 4.3.1 to 4.3.2

1

dist/@common/types.d.ts

@@ -80,3 +80,2 @@ import { ButtonHTMLAttributes, MouseEventHandler, MutableRefObject } from 'react';

registerField: RegisterField;
setField?: (fieldName: string, value: any) => void | Promise<void>;
setItems: (fieldName: string, setItems: (i: number[]) => number[], getErrors: (i: number[]) => string[], defValue?: any) => void;

@@ -83,0 +82,0 @@ onSubmit: (evt?: any) => void;

2

dist/create-field/named-field/named-field.js

@@ -53,3 +53,3 @@ var __assign = (this && this.__assign) || function () {

}
return (React.createElement(ValidatedField, __assign({}, rest, { defaultValue: defaultValue, defaultValueJustAdded: defaultValueJustAdded, validators: validators, componentProps: componentProps, formRef: formState === null || formState === void 0 ? void 0 : formState.formRef, setField: formState === null || formState === void 0 ? void 0 : formState.setField, fieldMeta: field, name: name, fieldType: (_b = field === null || field === void 0 ? void 0 : field.fieldType) !== null && _b !== void 0 ? _b : fieldType })));
return (React.createElement(ValidatedField, __assign({}, rest, { defaultValue: defaultValue, defaultValueJustAdded: defaultValueJustAdded, validators: validators, componentProps: componentProps, formRef: formState === null || formState === void 0 ? void 0 : formState.formRef, fieldMeta: field, name: name, fieldType: (_b = field === null || field === void 0 ? void 0 : field.fieldType) !== null && _b !== void 0 ? _b : fieldType })));
};

2

dist/create-field/named-field/validated-field/hooks/use-validate-input.d.ts

@@ -8,3 +8,3 @@ import { MutableRefObject } from 'react';

};
export declare const useValidateInput: <T extends HTMLElement = HTMLInputElement>(customRef: MutableRefObject<T>, validators: Array<ValidateFunc>, formRef?: MutableRefObject<HTMLFormElement>, field?: FieldMeta, fieldType?: FieldType, nameFromProp?: string, setField?: (fieldName: string, value: any) => void | Promise<void>) => ValidateInputRes;
export declare const useValidateInput: <T extends HTMLElement = HTMLInputElement>(customRef: MutableRefObject<T>, validators: Array<ValidateFunc>, formRef?: MutableRefObject<HTMLFormElement>, field?: FieldMeta, fieldType?: FieldType, nameFromProp?: string) => ValidateInputRes;
export {};

10

dist/create-field/named-field/validated-field/hooks/use-validate-input.js

@@ -8,3 +8,3 @@ import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';

var DEF_ERRORS = [];
export var useValidateInput = function (customRef, validators, formRef, field, fieldType, nameFromProp, setField) {
export var useValidateInput = function (customRef, validators, formRef, field, fieldType, nameFromProp) {
var _a, _b, _c;

@@ -84,9 +84,6 @@ var _d = useState(false), mounted = _d[0], setMounted = _d[1];

var hasValidation = Boolean((validators === null || validators === void 0 ? void 0 : validators.length) && e.target);
var value = getValueByTypeAndTarget(fieldType, e.target);
if (setField) {
setField(name, value);
}
if (hasValidation) {
var value_1 = getValueByTypeAndTarget(fieldType, e.target);
validators.forEach(function (validate) {
var result = validate(value, name, getFormValueByName);
var result = validate(value_1, name, getFormValueByName);
if (result) {

@@ -104,3 +101,2 @@ errors.push(result);

name,
setField,
validators,

@@ -107,0 +103,0 @@ ]);

3

dist/create-field/named-field/validated-field/validated-field.d.ts

@@ -12,6 +12,5 @@ import { MutableRefObject } from 'react';

name: string;
setField?: (fieldName: string, value: any) => void | Promise<void>;
validators: Array<ValidateFunc>;
};
export declare const ValidatedField: <FieldCustomProps extends Record<string, any>, Input extends HTMLElement = HTMLInputElement>({ component, componentProps, defaultValue, defaultValueJustAdded, fieldMeta, fieldType, formRef, name, setField, validators, }: IProps<FieldCustomProps, Input>) => JSX.Element;
export declare const ValidatedField: <FieldCustomProps extends Record<string, any>, Input extends HTMLElement = HTMLInputElement>({ component, componentProps, defaultValue, defaultValueJustAdded, fieldMeta, fieldType, formRef, name, validators, }: IProps<FieldCustomProps, Input>) => JSX.Element;
export {};

6

dist/create-field/named-field/validated-field/validated-field.js

@@ -19,5 +19,5 @@ var __assign = (this && this.__assign) || function () {

export var ValidatedField = function (_a) {
var component = _a.component, componentProps = _a.componentProps, defaultValue = _a.defaultValue, defaultValueJustAdded = _a.defaultValueJustAdded, fieldMeta = _a.fieldMeta, fieldType = _a.fieldType, formRef = _a.formRef, name = _a.name, setField = _a.setField, validators = _a.validators;
var component = _a.component, componentProps = _a.componentProps, defaultValue = _a.defaultValue, defaultValueJustAdded = _a.defaultValueJustAdded, fieldMeta = _a.fieldMeta, fieldType = _a.fieldType, formRef = _a.formRef, name = _a.name, validators = _a.validators;
var inputRef = useRef();
var _b = useValidateInput(inputRef, validators, formRef, fieldMeta, fieldType, name, setField), errors = _b.errors, setErrors = _b.setErrors, warnings = _b.warnings;
var _b = useValidateInput(inputRef, validators, formRef, fieldMeta, fieldType, name), errors = _b.errors, setErrors = _b.setErrors, warnings = _b.warnings;
useEffect(function () {

@@ -66,5 +66,5 @@ var forbiddenProps = intersection(Object.keys(componentProps), Object.values(IgnoredProp));

defaultValueJustAdded,
errors,
fieldMeta,
fieldType,
errors,
inputRef,

@@ -71,0 +71,0 @@ name,

2

dist/form/form.d.ts

@@ -6,2 +6,2 @@ /// <reference types="react" />

*/
export declare const Form: <Values extends Record<string, any> = Record<string, any>>({ children, defaultValues, html5Validation, onSubmit, setState, ...props }: FormProps<Values>) => JSX.Element;
export declare const Form: <Values extends Record<string, any> = Record<string, any>>({ children, defaultValues, html5Validation, onSubmit, ...props }: FormProps<Values>) => JSX.Element;

127

dist/form/form.js

@@ -33,3 +33,2 @@ var __assign = (this && this.__assign) || function () {

import React, { useCallback, useRef, useState } from 'react';
import cloneDeep from 'lodash/cloneDeep';
import get from 'lodash/get';

@@ -42,10 +41,5 @@ import isEqual from 'lodash/isEqual';

import { FieldType, } from '../@common/types';
import { getValueByNodeName, parseValueByType } from '../@common/utils';
import { toFlatErrors } from './form.utils';
import { getValueByNodeName } from '../@common/utils';
import { getArrayValue, getFormValues, toFlatErrors } from './form.utils';
var getItemsFromDefVal = function (_, i) { return i; };
var getArrayValue = function (fieldName, values, items) {
return items.map(function (index) {
return get(values, fieldName)[index];
});
};
/**

@@ -55,3 +49,3 @@ * Форма - элемент взаимодействия пользователя с сайтом или приложением

export var Form = function (_a) {
var children = _a.children, defaultValues = _a.defaultValues, html5Validation = _a.html5Validation, onSubmit = _a.onSubmit, setState = _a.setState, props = __rest(_a, ["children", "defaultValues", "html5Validation", "onSubmit", "setState"]);
var children = _a.children, defaultValues = _a.defaultValues, html5Validation = _a.html5Validation, onSubmit = _a.onSubmit, props = __rest(_a, ["children", "defaultValues", "html5Validation", "onSubmit"]);
var formRef = useRef(null);

@@ -108,68 +102,2 @@ var _b = useState({}), fields = _b[0], setFields = _b[1];

}, [setErrors]);
var setField = useCallback(function (fieldName, value) {
if (setState) {
setFields(function (fields) {
var _a;
var newFields = fields;
if (value === undefined) {
newFields = __assign(__assign({}, fields), (_a = {}, _a[fieldName] = undefined, _a));
delete newFields[fieldName];
}
setTimeout(function () {
setState(function (s) {
var fieldNameArr = fieldName.split('.');
var preparedFieldName = '';
var firstParentName = '';
var secondParentName = '';
fieldNameArr.forEach(function (fieldPiece) {
if (preparedFieldName === '') {
preparedFieldName = fieldPiece;
}
else {
var fieldInfo = newFields === null || newFields === void 0 ? void 0 : newFields[preparedFieldName];
secondParentName = firstParentName;
firstParentName = preparedFieldName;
if ((fieldInfo === null || fieldInfo === void 0 ? void 0 : fieldInfo.fieldType) === FieldType.ARRAY) {
var index = (value === undefined
? fieldInfo.itemsPrev
: fieldInfo.items).findIndex(function (el) { return el === parseInt(fieldPiece, 10); });
if (index !== -1) {
preparedFieldName += "." + index;
}
else {
throw new Error('Не удалось найти элемент в массиве');
}
}
else {
preparedFieldName += "." + fieldPiece;
}
}
});
var firstParent = firstParentName
? get(s, firstParentName)
: undefined;
if (firstParent && fieldNameArr[fieldNameArr.length - 1]) {
firstParent[fieldNameArr[fieldNameArr.length - 1]] = value;
}
var secondParent = secondParentName
? get(s, secondParentName)
: undefined;
var newState = set(s ? cloneDeep(s) : {}, preparedFieldName, value);
if (value === undefined) {
if (typeof firstParent === 'object' &&
Object.values(firstParent).every(function (el) { return el === undefined; }) &&
(secondParent === null || secondParent === void 0 ? void 0 : secondParent.length)) {
newState = set(newState, secondParentName, secondParent.filter(function (el) {
return el !== undefined &&
!Object.values(el).every(function (el) { return el === undefined; });
}));
}
}
return newState;
});
}, 0);
return newFields;
});
}
}, [setFields, setState]);
var setItems = useCallback(function (fieldName, setItemsArg, getErrors, defaultValue) {

@@ -189,2 +117,7 @@ setFields(function (s) {

var defaultValue = (_b = get(defaultValues, fieldName)) !== null && _b !== void 0 ? _b : fieldDefaultValue;
var items = fieldType === FieldType.ARRAY
? Array.isArray(defaultValue)
? defaultValue.map(getItemsFromDefVal)
: []
: undefined;
return __assign(__assign({}, s), (_a = {}, _a[fieldName] = {

@@ -198,7 +131,4 @@ defaultValue: defaultValue,

isUntouched: true,
items: fieldType === FieldType.ARRAY
? Array.isArray(defaultValue)
? defaultValue.map(getItemsFromDefVal)
: []
: undefined,
items: items,
itemsPrev: items,
name: fieldName,

@@ -212,5 +142,10 @@ setErrors: setErrors.bind({}, fieldName),

return function () {
setField(fieldName);
setFields(function (s) {
var _a;
var newState = __assign(__assign({}, s), (_a = {}, _a[fieldName] = undefined, _a));
delete newState[fieldName];
return newState;
});
};
}, [defaultValues, setField, setFields]);
}, [defaultValues, setFields]);
var getFormValueByName = useCallback(function (name) {

@@ -223,3 +158,2 @@ if (!formRef) {

var handleSubmit = useCallback(function (formEventOrCustomHandler) {
var _a;
var evt = 'not a submit event';

@@ -231,27 +165,3 @@ if (formEventOrCustomHandler === null || formEventOrCustomHandler === void 0 ? void 0 : formEventOrCustomHandler.preventDefault) {

// 1. Преобразовываем данные в правильный формат
var formData = new window.FormData((_a = formRef.current) !== null && _a !== void 0 ? _a : undefined);
var values = {};
formData.forEach(function (value, name) {
var _a;
// Мы не можем проверить ошибки валидации внутри этого цикла, т.к. данные еще не
// полностью сформированы (особенно для массивов)
var fieldType = (_a = fields[name]) === null || _a === void 0 ? void 0 : _a.fieldType;
// находим функцию для преобразования данных к правильному формату,
// если такая есть
var prepareValue = parseValueByType.get(fieldType);
var prevValue = get(values, name);
if (prevValue) {
// если предыдущее значение существует, значит это массив
var newValue = Array.isArray(prevValue)
? __spreadArray(__spreadArray([], prevValue, true), [value], false) : [prevValue, value];
// если функция преобразования данных к правильному формату есть -
// применяем ее
set(values, name, prepareValue ? prepareValue(newValue) : newValue);
}
else {
// если функция преобразования данных к правильному формату есть -
// применяем ее
set(values, name, prepareValue ? prepareValue(value) : value);
}
});
var values = getFormValues(formRef.current, fields);
// 2. Проверка данных на соответствие правилам валидации

@@ -327,5 +237,4 @@ var isFormInvalid = false;

registerField: registerField,
setField: setField,
setItems: setItems,
} }, children)));
};

3

dist/form/form.utils.d.ts

@@ -0,1 +1,4 @@

import { FieldMeta } from '../@common/types';
export declare const getArrayValue: (fieldName: string, values: Record<string, any>, items: number[]) => any[];
export declare const toFlatErrors: (errors: Record<string, any>, setErrors: (fieldName: string, errors: string[]) => void, prefix?: string) => void;
export declare const getFormValues: (formRefCurrent: HTMLFormElement | undefined, fields: Record<string, FieldMeta>) => any;

45

dist/form/form.utils.js

@@ -0,1 +1,18 @@

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));
};
import get from 'lodash/get';
import set from 'lodash/set';
import { parseValueByType } from '../@common/utils';
export var getArrayValue = function (fieldName, values, items) {
return items.map(function (index) {
return get(values, fieldName)[index];
});
};
export var toFlatErrors = function (errors, setErrors, prefix) {

@@ -15,1 +32,29 @@ if (prefix === void 0) { prefix = ''; }

};
export var getFormValues = function (formRefCurrent, fields) {
var formData = new window.FormData(formRefCurrent !== null && formRefCurrent !== void 0 ? formRefCurrent : undefined);
var values = {};
formData.forEach(function (value, name) {
var _a;
// Мы не можем проверить ошибки валидации внутри этого цикла, т.к. данные еще не
// полностью сформированы (особенно для массивов)
var fieldType = (_a = fields[name]) === null || _a === void 0 ? void 0 : _a.fieldType;
// находим функцию для преобразования данных к правильному формату,
// если такая есть
var prepareValue = parseValueByType.get(fieldType);
var prevValue = get(values, name);
if (prevValue) {
// если предыдущее значение существует, значит это массив
var newValue = Array.isArray(prevValue)
? __spreadArray(__spreadArray([], prevValue, true), [value], false) : [prevValue, value];
// если функция преобразования данных к правильному формату есть -
// применяем ее
set(values, name, prepareValue ? prepareValue(newValue) : newValue);
}
else {
// если функция преобразования данных к правильному формату есть -
// применяем ее
set(values, name, prepareValue ? prepareValue(value) : value);
}
});
return values;
};

2

package.json
{
"name": "@altiore/form",
"version": "4.3.1",
"version": "4.3.2",
"description": "Form helper for building powerful forms",

@@ -5,0 +5,0 @@ "main": "dist/index.js",

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc