jarb-redux-form
Version:
Validating forms through JaRB.
143 lines (141 loc) • 6.58 kB
JavaScript
"use strict";
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
t[p[i]] = s[p[i]];
return t;
};
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
result["default"] = mod;
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importStar(require("react"));
const redux_form_1 = require("redux-form");
const config_1 = require("./config");
const utils_1 = require("./utils");
const validators = __importStar(require("./validators"));
const patterns = __importStar(require("./regex"));
/**
* JarbField wrappes redux-form's Field, and adds the auto validation
* from the ConstraintsStore. In fact it is a very thin wrapper around
* Field.
*
* It only demands one extra property called 'jarb' which is used
* to to configure the Field. The 'jarb' object needs two keys:
* the 'validator' and the 'label'.
*
* The 'validator' follows the following format: {Entity}.{Property}.
* For example if the validator property is 'SuperHero.name' this means that
* the Field will apply the constraints for the 'name' property of
* the 'SuperHero' entity.
*
* The 'label' is used to inform you which field was wrong, when errors occur.
* You will receive the 'label' when an error occurs to create a nice
* error message.
*
* @example
* ```JavaScript
* <JarbField
* name="Name"
* jarb={{ validator: 'SuperHero.name', label: "Name" }}
* component="input"
* type="text"
* />
* ```
*
* @export
* @param {Props.name} name The name of the field, must have the following format: {Entity}.{Property}
* @param {Props.jarb} object Object containing the 'label' and 'validator'.
* @returns
*/
class JarbField extends react_1.Component {
constructor() {
super(...arguments);
this.requiredValidator = null;
this.minimumLengthValidator = null;
this.maximumLengthValidator = null;
this.minValueValidator = null;
this.maxValueValidator = null;
this.patternValidator = null;
}
getEnhancedValidate() {
const { jarb, validate } = this.props;
const { label, validator } = jarb;
const config = config_1.getConfig();
const constraintsStore = config.constraintsStore();
const enhancedValidate = Array.isArray(validate) && validate ? [...validate] : [];
if (constraintsStore.constraints !== undefined) {
const fieldConstraints = utils_1.getFieldConstraintsFor(validator, constraintsStore.constraints);
if (fieldConstraints !== false) {
const field = utils_1.mostSpecificInputTypeFor(fieldConstraints.types);
if (fieldConstraints.required) {
if (this.requiredValidator === null) {
this.requiredValidator = validators.required(label);
}
enhancedValidate.push(this.requiredValidator);
}
if (field === 'text') {
if (fieldConstraints.minimumLength) {
if (this.minimumLengthValidator === null) {
this.minimumLengthValidator = validators.minimumLength(label, fieldConstraints.minimumLength);
}
enhancedValidate.push(this.minimumLengthValidator);
}
if (fieldConstraints.maximumLength) {
if (this.maximumLengthValidator === null) {
this.maximumLengthValidator = validators.maximumLength(label, fieldConstraints.maximumLength);
}
enhancedValidate.push(this.maximumLengthValidator);
}
}
if (fieldConstraints.min) {
if (this.minValueValidator === null) {
this.minValueValidator = validators.minValue(label, fieldConstraints.min);
}
enhancedValidate.push(this.minValueValidator);
}
if (fieldConstraints.max) {
if (this.maxValueValidator === null) {
this.maxValueValidator = validators.maxValue(label, fieldConstraints.max);
}
enhancedValidate.push(this.maxValueValidator);
}
if (field === 'number' &&
fieldConstraints.fractionLength &&
fieldConstraints.fractionLength > 0) {
if (this.patternValidator === null) {
const regex = patterns.fractionNumberRegex(fieldConstraints.fractionLength);
this.patternValidator = validators.pattern(label, regex);
}
enhancedValidate.push(this.patternValidator);
}
else if (field === 'number') {
if (this.patternValidator === null) {
this.patternValidator = validators.pattern(label, patterns.numberRegex);
}
enhancedValidate.push(this.patternValidator);
}
}
else {
console.warn(`jarb-redux-form: constraints for "${validator}" not found, but a JarbField was rendered, this should not occur, check your validator. See: https://github.com/42BV/jarb-redux-form/issues/4`);
}
}
else {
console.warn('jarb-redux-form: constraints are empty, but a JarbField was rendered, this should not occur, make sure the constraints are loaded before the form is displayed. See: https://github.com/42BV/jarb-redux-form/issues/3');
}
return enhancedValidate;
}
render() {
const _a = this.props, { name, validate } = _a, rest = __rest(_a, ["name", "validate"]);
const enhancedValidate = this.getEnhancedValidate();
return react_1.default.createElement(redux_form_1.Field, Object.assign({ name: name, validate: enhancedValidate }, rest));
}
}
exports.JarbField = JarbField;