@altiore/form - npm Package Compare versions

Comparing version 4.1.4 to 4.2.1

dist/@common/types.d.ts

@@ -51,3 +51,5 @@ import { ButtonHTMLAttributes, MouseEventHandler, MutableRefObject } from 'react';
     ERROR = "error",
-    VALIDATORS = "validators"
+    VALIDATORS = "validators",
+    WARNING = "warning",
+    WARNINGS = "warnings"
 }
@@ -62,4 +64,5 @@ export declare enum IgnoredProp {
     [FieldMetaName.ERRORS]: string[];
+    [FieldMetaName.WARNINGS]: string[];
     [FieldMetaName.ITEMS]?: number[];
-    [FieldMetaName.SET_ERRORS]: (errors: string[], force?: boolean) => void;
+    [FieldMetaName.SET_ERRORS]: (errors: string[], force?: boolean, isWarnings?: boolean) => void;
     [FieldMetaName.FIELD_TYPE]?: FieldType;
@@ -69,2 +72,3 @@ [FieldMetaName.IS_UNTOUCHED]?: boolean;
     [FieldMetaName.ERROR]?: string;
+    [FieldMetaName.WARNING]?: string;
     [FieldMetaName.VALIDATORS]: Array<ValidateFunc>;
@@ -71,0 +75,0 @@ };

dist/@common/types.js

@@ -36,2 +36,4 @@ /**
     FieldMetaName["VALIDATORS"] = "validators";
+    FieldMetaName["WARNING"] = "warning";
+    FieldMetaName["WARNINGS"] = "warnings";
 })(FieldMetaName || (FieldMetaName = {}));
@@ -38,0 +40,0 @@ export var IgnoredProp;

dist/@common/utils.d.ts

@@ -10,2 +10,10 @@ import { MutableRefObject } from 'react';
 export declare const formatValueByType: Map<FieldType, (phoneNumberString: string) => string | null>;
+export declare const PassWarn: {
+    minLength: string;
+    lowerRequired: string;
+    digitRequired: string;
+    upperRequired: string;
+    specRequired: string;
+};
+export declare const warningsByType: Map<FieldType, (value: string) => string[]>;
 export declare const getValueByTypeAndTarget: (fieldType: FieldType, target: EventTarget | HTMLElement) => any;

dist/@common/utils.js

@@ -137,2 +137,35 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 export var formatValueByType = new Map([[FieldType.PHONE, formatPhone]]);
+export var PassWarn = {
+    minLength: 'Минимальная рекомендуемая длина пароля - 8 символов',
+    // eslint-disable-next-line sort-keys
+    lowerRequired: 'Добавьте хотя бы одну букву в нижнем регистре',
+    // eslint-disable-next-line sort-keys
+    digitRequired: 'Добавьте хотя бы одну цифру',
+    upperRequired: 'Добавьте хотя бы одну букву в верхнем регистре',
+    // eslint-disable-next-line sort-keys
+    specRequired: 'Добавьте хотя бы один спец. символ &,@,$,#...',
+};
+var warningPassword = function (value) {
+    if (!value) {
+        return Object.values(PassWarn);
+    }
+    var warnings = [];
+    if (value.length < 8) {
+        warnings.push(PassWarn.minLength);
+    }
+    if (!value.match(/[a-zА-Я]+/g)) {
+        warnings.push(PassWarn.lowerRequired);
+    }
+    if (!value.match(/[0-9]+/g)) {
+        warnings.push(PassWarn.digitRequired);
+    }
+    if (!value.match(/[A-ZА-Я]+/g)) {
+        warnings.push(PassWarn.upperRequired);
+    }
+    if (!value.match(/[!"№%:,.;()_+\[\]@#$^&*=±§<>]+/g)) {
+        warnings.push(PassWarn.specRequired);
+    }
+    return warnings;
+};
+export var warningsByType = new Map([[FieldType.PASSWORD, warningPassword]]);
 export var getValueByTypeAndTarget = function (fieldType, target) {
@@ -139,0 +172,0 @@ var _a;

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

@@ -6,4 +6,5 @@ import { MutableRefObject } from 'react';
     setErrors: (errors: string[]) => void;
+    warnings: string[];
 };
 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 {};

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

@@ -6,7 +6,7 @@ import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
 import { FieldType } from '../../../../@common/types';
-import { formatValueByType, getNodeByName, getValueByNodeName, getValueByTypeAndTarget, } from '../../../../@common/utils';
+import { formatValueByType, getNodeByName, getValueByNodeName, getValueByTypeAndTarget, warningsByType, } from '../../../../@common/utils';
 var DEF_ERRORS = [];
 export var useValidateInput = function (customRef, validators, formRef, field, fieldType, nameFromProp) {
-    var _a, _b;
-    var _c = useState(false), mounted = _c[0], setMounted = _c[1];
+    var _a, _b, _c;
+    var _d = useState(false), mounted = _d[0], setMounted = _d[1];
     useEffect(function () {
@@ -39,5 +39,6 @@ setMounted(true);
     }, [formRef]);
-    var _d = useState(DEF_ERRORS), errors = _d[0], setErrorsState = _d[1];
-    var setErrors = useCallback(function (errors, force) {
-        setErrorsState(function (s) {
+    var _e = useState(DEF_ERRORS), errors = _e[0], setErrorsState = _e[1];
+    var _f = useState(DEF_ERRORS), warnings = _f[0], setWarningsState = _f[1];
+    var setErrors = useCallback(function (errors, force, isWarnings) {
+        var handler = function (s) {
             if (isEqual(s, errors) && !force) {
@@ -53,11 +54,17 @@ return s;
             return errors;
-        });
-    }, [setErrorsState]);
-    var handleSetErrors = useCallback(function (errors, force) {
+        };
+        if (isWarnings) {
+            setWarningsState(handler);
+        }
+        else {
+            setErrorsState(handler);
+        }
+    }, [setErrorsState, setWarningsState]);
+    var handleSetErrors = useCallback(function (errors, force, isWarnings) {
         if (getMounted()) {
             if (field === null || field === void 0 ? void 0 : field.setErrors) {
-                field.setErrors(errors, force);
+                field.setErrors(errors, force, isWarnings);
             }
             else {
-                setErrors(errors, force);
+                setErrors(errors, force, isWarnings);
             }
@@ -99,3 +106,11 @@ }
         handleSetErrors([], true);
-    }, [handleSetErrors]);
+        if (warningsByType.has(fieldType)) {
+            handleSetErrors(warningsByType.get(fieldType)(null), true, true);
+        }
+    }, [handleSetErrors, fieldType]);
+    var checkWarnings = useCallback(function (evt) {
+        var getWarnings = warningsByType.get(fieldType);
+        var warnings = getWarnings(evt.target.value);
+        handleSetErrors(warnings, false, true);
+    }, [fieldType, handleSetErrors]);
     var formatValue = useCallback(function (evt) {
@@ -106,10 +121,33 @@ var formatter = formatValueByType.get(fieldType);
     useEffect(function () {
-        if (formatValueByType.has(fieldType)) {
-            var input = inputRef.current;
-            var hasEventHandler = Boolean(input);
+        var input = inputRef.current;
+        var hasEventHandler = Boolean(input);
+        if (hasEventHandler) {
+            if (warningsByType.has(fieldType)) {
+                input.addEventListener('keyup', checkWarnings);
+            }
+        }
+        return function () {
             if (hasEventHandler) {
+                if (warningsByType.has(fieldType)) {
+                    input.removeEventListener('keyup', checkWarnings);
+                }
+            }
+        };
+    }, [checkWarnings, inputRef, fieldType]);
+    useEffect(function () {
+        var input = inputRef.current;
+        var hasEventHandler = Boolean(input);
+        if (hasEventHandler) {
+            if (formatValueByType.has(fieldType)) {
                 input.addEventListener('keyup', formatValue);
             }
         }
-    }, [inputRef, fieldType]);
+        return function () {
+            if (hasEventHandler) {
+                if (formatValueByType.has(fieldType)) {
+                    input.removeEventListener('keyup', formatValue);
+                }
+            }
+        };
+    }, [inputRef, fieldType, formatValue]);
     useEffect(function () {
@@ -148,3 +186,4 @@ var _a;
         setErrors: (_b = field === null || field === void 0 ? void 0 : field.setErrors) !== null && _b !== void 0 ? _b : setErrors,
+        warnings: (_c = field === null || field === void 0 ? void 0 : field.warnings) !== null && _c !== void 0 ? _c : warnings,
     };
 };

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

@@ -21,3 +21,3 @@ var __assign = (this && this.__assign) || function () {
     var inputRef = useRef();
-    var _b = useValidateInput(inputRef, validators, formRef, fieldMeta, fieldType, name), errors = _b.errors, setErrors = _b.setErrors;
+    var _b = useValidateInput(inputRef, validators, formRef, fieldMeta, fieldType, name), errors = _b.errors, setErrors = _b.setErrors, warnings = _b.warnings;
     useEffect(function () {
@@ -59,4 +59,6 @@ var forbiddenProps = intersection(Object.keys(componentProps), Object.values(IgnoredProp));
             setErrors: setErrors,
+            warning: warnings === null || warnings === void 0 ? void 0 : warnings[0],
+            warnings: warnings,
         }, _a[IgnoredProp.INPUT_PROPS] = inputProps, _a)));
     }, [componentProps, fieldMeta, fieldType, errors, inputRef, name, setErrors]);
 };

dist/form/form.js

@@ -31,3 +31,3 @@ var __assign = (this && this.__assign) || function () {
 import { FormContext } from '../@common/form-context';
-import { FieldType } from '../@common/types';
+import { FieldType, } from '../@common/types';
 import { getNodeByName, getValueByNodeName, getValueByTypeAndTarget, parseValueByType, } from '../@common/utils';
@@ -66,3 +66,3 @@ import { toFlatErrors } from './form.utils';
     }, [setFields]);
-    var setErrors = useCallback(function (fieldName, errors, force) {
+    var setErrors = useCallback(function (fieldName, errors, force, isWarning) {
         setFields(function (s) {
@@ -74,3 +74,9 @@ var _a;
             }
-            var fieldData = __assign(__assign({}, s[fieldName]), { error: errors === null || errors === void 0 ? void 0 : errors[0], errors: errors, isInvalid: Boolean(errors === null || errors === void 0 ? void 0 : errors.length), isUntouched: false });
+            var fieldData;
+            if (isWarning) {
+                fieldData = __assign(__assign({}, s[fieldName]), { isUntouched: false, warning: errors === null || errors === void 0 ? void 0 : errors[0], warnings: errors });
+            }
+            else {
+                fieldData = __assign(__assign({}, s[fieldName]), { error: errors === null || errors === void 0 ? void 0 : errors[0], errors: errors, isInvalid: Boolean(errors === null || errors === void 0 ? void 0 : errors.length), isUntouched: false });
+            }
             // улучает производительность, избегая рендера, если ошибки не изменились
@@ -132,2 +138,4 @@ if (isEqual(s[fieldName], fieldData) && !force) {
                 validators: validators ? validators : [],
+                warning: undefined,
+                warnings: [],
             }, _a));
@@ -134,0 +142,0 @@ });

package.json

 {
 	"name": "@altiore/form",
-	"version": "4.1.4",
+	"version": "4.2.1",
 	"description": "Form helper for building powerful forms",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

113353

increased by3.63%

Lines of code

1854

increased by5.52%

No dependency changes