react-easy-password-validation
Version:
React component for validation input password via specified rules set
32 lines • 2.08 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var PasswordValidator = function (_a) {
var ruleSet = _a.ruleSet, passwordValue = _a.passwordValue, passedRuleClassName = _a.passedRuleClassName, failedRuleClassName = _a.failedRuleClassName, passIcon = _a.passIcon, failIcon = _a.failIcon, attributes = tslib_1.__rest(_a, ["ruleSet", "passwordValue", "passedRuleClassName", "failedRuleClassName", "passIcon", "failIcon"]);
var _b = (0, react_1.useState)(''), password = _b[0], setPassword = _b[1];
var _c = (0, react_1.useState)([]), rules = _c[0], setRules = _c[1];
(0, react_1.useEffect)(function () {
setPassword(passwordValue);
}, [passwordValue]);
(0, react_1.useEffect)(function () {
var cloneArr = tslib_1.__spreadArray([], ruleSet.map(function (item) {
return tslib_1.__assign(tslib_1.__assign({}, item), { isPassed: item.isPassed || false, regex: typeof item.regex === 'string' ? new RegExp(item.regex) : item.regex });
}), true);
cloneArr.forEach(function (rule) {
if (rule.regex.test(password))
rule.isPassed = true;
else
rule.isPassed = false;
});
setRules(cloneArr);
}, [password, ruleSet]);
return (react_1.default.createElement("div", tslib_1.__assign({}, attributes),
react_1.default.createElement("ul", null, rules.map(function (rule, index) { return (react_1.default.createElement("li", { key: index, className: "".concat(!rule.isPassed ? failedRuleClassName || 'text-danger' : passedRuleClassName || 'text-success') },
(passIcon || failIcon) && react_1.default.createElement("i", null, !rule.isPassed ? (failIcon ? failIcon : '') : passIcon ? passIcon : ''),
react_1.default.createElement("span", { className: 'ms-2' },
" ",
rule.message))); }))));
};
exports.default = PasswordValidator;
//# sourceMappingURL=PasswordValidator.js.map