@coxy/react-validator 1.3.4 → 2.0.0

package/src/validator-wrapper.tsx

@@ -0,0 +1,58 @@
+/* eslint react/sort-comp: [0], camelcase: [0] */
+import { Component, ReactNode, RefObject } from 'react'
+
+import { Context } from './context'
+import { Validator } from './validator'
+
+interface ComponentProps {
+  children?: ReactNode
+  stopAtFirstError?: boolean
+  ref?: RefObject<any>
+}
+
+export class ValidatorWrapper extends Component<ComponentProps> {
+  fields = [];
+
+  constructor (props, ctx) {
+    super(props, ctx)
+    this.registerField = this.registerField.bind(this)
+    this.unregisterField = this.unregisterField.bind(this)
+  }
+
+  componentWillUnmount () {
+    this.fields = []
+  }
+
+  registerField (field) {
+    if (field && !this.fields.includes(field)) {
+      this.fields.push(field)
+    }
+  }
+
+  unregisterField (field) {
+    const index = this.fields.indexOf(field)
+    if (index > -1) this.fields.splice(index, 1)
+  }
+
+  getField (id) {
+    return this.fields.find((field) => field.props.id === id) || null
+  }
+
+  validate () {
+    const validator = new Validator({ stopAtFirstError: this.props.stopAtFirstError })
+    this.fields.forEach((comp) => {
+      validator.addField(comp.props)
+    })
+    return validator.validate()
+  }
+
+  render () {
+    return (
+      <Context.Provider
+        value={{ registerField: this.registerField, unregisterField: this.unregisterField }}
+      >
+        {this.props.children}
+      </Context.Provider>
+    )
+  }
+}

package/src/validator.test.tsx

@@ -0,0 +1,30 @@
+import { rules } from './rules'
+import { Validator } from './validator'
+
+it('check normal create validator', () => {
+  const validator = new Validator()
+  expect(typeof validator).toBe('object')
+  expect(typeof validator.validate).toBe('function')
+})
+
+it('check normal add and remove fields', () => {
+  const validator = new Validator({ stopAtFirstError: true })
+  const fieldPassword = validator.addField({
+    rules: rules.password,
+    value: '',
+    id: 'for-remove'
+  })
+
+  expect(typeof fieldPassword).toBe('object')
+
+  const fieldSearchPassword = validator.getField('for-remove')
+
+  expect(typeof fieldSearchPassword).toBe('object')
+  expect(typeof fieldSearchPassword.validate).toBe('function')
+  expect(fieldPassword.id === fieldSearchPassword.id).toBe(true)
+
+  let newFieldSearchPassword = validator.getField('for-remove')
+  validator.removeField(newFieldSearchPassword)
+  newFieldSearchPassword = validator.getField('for-remove')
+  expect(newFieldSearchPassword === null).toBe(true)
+})

package/src/validator.ts

@@ -0,0 +1,105 @@
+import { Validity, Value } from './validator-field'
+import { ValidatorRules } from './rules'
+
+export interface FieldParams {
+  value: Value
+  rules: ValidatorRules,
+  required?: boolean
+  id?: string | number
+}
+
+export class Field {
+  private rules: ValidatorRules;
+  private required: boolean;
+  private value: Value;
+  public id: string | number;
+  constructor ({
+    rules,
+    required,
+    value,
+    id
+  }: FieldParams) {
+    this.rules = rules
+    this.required = required
+    this.value = value
+    this.id = id
+  }
+
+  validate (): Validity {
+    let isValid = true
+    let message = ''
+    const {
+      rules,
+      value,
+      required,
+      id
+    } = this
+
+    const isEmptyValue = !value && parseFloat(value) !== 0
+
+    if (!rules.length || (isEmptyValue && required === false)) {
+      return { isValid, message, id }
+    }
+    rules.forEach((instance) => {
+      if (isValid) {
+        isValid = instance.rule(value)
+        if (!isValid) {
+          if (typeof instance.message === 'function') {
+            message = instance.message(value)
+          } else {
+            message = instance.message
+          }
+        }
+      }
+    })
+    return { isValid, message, id }
+  }
+}
+
+export interface ValidatorParams {
+  stopAtFirstError: boolean
+}
+
+export class Validator {
+  private fields: Field[];
+  private params: ValidatorParams;
+
+  constructor (params?: ValidatorParams) {
+    this.params = params || null
+    this.fields = []
+  }
+
+  addField (params: FieldParams): Field {
+    const field = new Field(params)
+    this.fields.push(field)
+    return field
+  }
+
+  removeField (field: Field): void {
+    const index = this.fields.indexOf(field)
+    if (index > -1) this.fields.splice(index, 1)
+  }
+
+  getField (id: Field['id']): Field {
+    return this.fields.find((field) => field.id === id) || null
+  }
+
+  validate (): Validity {
+    let prevResult
+    const statuses = this.fields.map((field) => {
+      if (this.params?.stopAtFirstError && prevResult && prevResult.isValid === false) {
+        return null
+      }
+      prevResult = field.validate()
+      return prevResult
+    })
+
+    const errors = statuses.filter((inst) => inst && inst.isValid === false)
+
+    if (errors.length) {
+      const { isValid, message } = errors[0]
+      return { isValid, message, errors }
+    }
+    return { isValid: true, message: '' }
+  }
+}

package/tsconfig.build.json

@@ -0,0 +1,12 @@
+{
+  "extends": "./tsconfig.json",
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist",
+    "src/**/*.test.tsx",
+    "src/**/*.test.ts"
+  ]
+}

package/tsconfig.json

@@ -0,0 +1,39 @@
+{
+  "compilerOptions": {
+    "esModuleInterop": true,
+    "declaration": true,
+    "module": "CommonJS",
+    "removeComments": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "target": "es2017",
+    "sourceMap": false,
+    "composite": true,
+    "incremental": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": false,
+    "resolveJsonModule": true,
+    "outDir": "./dist",
+    "rootDir": "src",
+    "baseUrl": "./src",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": false,
+    "isolatedModules": true,
+    "moduleResolution": "node",
+    "jsx": "preserve"
+  },
+  "include": [
+    "src",
+    "src/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist"
+  ]
+}

package/.babelrc.js

@@ -1,14 +0,0 @@
-module.exports = {
-  "presets": [
-    "@babel/preset-env",
-    "@babel/preset-react"
-  ],
-  "plugins": [
-    "@babel/proposal-class-properties"
-  ],
-  "env": {
-    "production": {
-      "plugins": ["transform-react-remove-prop-types"]
-    }
-  }
-}

package/build/index.js

@@ -1 +0,0 @@
-(()=>{"use strict";var e={n:t=>{var r=t&&t.__esModule?()=>t.default:()=>t;return e.d(r,{a:r}),r},d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Validator:()=>f,ValidatorField:()=>R,default:()=>B,rules:()=>C,useValidator:()=>x});const r=require("react");var n=e.n(r);const i=require("prop-types");var o=e.n(i);const u=n().createContext("@coxy/Validator");function l(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function a(e,t,r){return t&&s(e.prototype,t),r&&s(e,r),e}var c=function(){function e(t){var r=t.rules,n=t.required,i=t.value,o=t.id;l(this,e),this.rules=r,this.required=n,this.value=i,this.id=o}return a(e,[{key:"validate",value:function(){var e=!0,t="",r=this.rules,n=this.value,i=this.required,o=this.id,u=!n&&0!==parseFloat(n);return!r.length||u&&!1===i||r.forEach((function(r){e&&((e=r.rule(n))||"function"==typeof(t=r.message)&&(t=t(n)))})),{isValid:e,message:t,id:o}}}]),e}(),f=function(){function e(t){l(this,e),this.params=t||{},this.fields=[]}return a(e,[{key:"addField",value:function(e){var t=new c(e);return this.fields.push(t),t}},{key:"removeField",value:function(e){var t=this.fields.indexOf(e);t>-1&&this.fields.splice(t,1)}},{key:"getField",value:function(e){return this.fields.find((function(t){return t.id===e}))||null}},{key:"validate",value:function(){var e,t=this,r=this.fields.map((function(r){return t.params.stopAtFirstError&&e&&!1===e.isValid?null:e=r.validate()})).filter((function(e){return e&&!1===e.isValid}));if(r.length){var n=r[0];return{isValid:n.isValid,message:n.message,errors:r}}return{isValid:!0,message:""}}}]),e}();function p(e){return(p="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function d(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function y(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function h(e,t){return(h=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function v(e,t){return!t||"object"!==p(t)&&"function"!=typeof t?b(e):t}function b(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function m(e){return(m=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function g(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}var O=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&h(e,t)}(s,e);var t,r,i,o,l=(i=s,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=m(i);if(o){var r=m(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return v(this,e)});function s(){var e;d(this,s);for(var t=arguments.length,r=new Array(t),n=0;n<t;n++)r[n]=arguments[n];return g(b(e=l.call.apply(l,[this].concat(r))),"fields",[]),e.registerField=e.registerField.bind(b(e)),e.unregisterField=e.unregisterField.bind(b(e)),e}return t=s,(r=[{key:"componentWillUnmount",value:function(){this.fields=[]}},{key:"registerField",value:function(e){e&&!this.fields.includes(e)&&this.fields.push(e)}},{key:"unregisterField",value:function(e){var t=this.fields.indexOf(e);t>-1&&this.fields.splice(t,1)}},{key:"getField",value:function(e){return this.fields.find((function(t){return t.props.id===e}))||null}},{key:"validate",value:function(){var e=new f({stopAtFirstError:this.props.stopAtFirstError});return this.fields.forEach((function(t){e.addField(t.props)})),e.validate()}},{key:"render",value:function(){return n().createElement(u.Provider,{value:{registerField:this.registerField,unregisterField:this.unregisterField}},this.props.children)}}])&&y(t.prototype,r),s}(r.Component);O.propTypes={children:o().node.isRequired,stopAtFirstError:o().bool},O.defaultProps={stopAtFirstError:!1};const w=O;function F(e){return(F="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function j(){return(j=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function P(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function S(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function E(e,t){return(E=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function _(e,t){return!t||"object"!==F(t)&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}function k(e){return(k=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}var q=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&E(e,t)}(u,e);var t,r,n,i,o=(n=u,i=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=k(n);if(i){var r=k(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return _(this,e)});function u(){return P(this,u),o.apply(this,arguments)}return t=u,(r=[{key:"componentWillUnmount",value:function(){this.props.unregisterField(this)}},{key:"componentDidMount",value:function(){this.props.registerField(this)}},{key:"validate",value:function(){return new c({rules:this.props.rules,required:this.props.required,value:this.props.value,id:this.props.id}).validate()}},{key:"render",value:function(){var e=this.props,t=e.children,r=e.value,n=this.validate();return"function"==typeof t?t(n,r):t}}])&&S(t.prototype,r),u}(r.Component);function R(e){return n().createElement(u.Consumer,null,(function(t){return n().createElement(q,j({},e,{registerField:t.registerField,unregisterField:t.unregisterField}))}))}q.propTypes={registerField:o().func.isRequired,unregisterField:o().func.isRequired,children:o().oneOfType([o().node,o().func]),rules:o().arrayOf(o().shape({message:o().oneOfType([o().string,o().func]),rule:o().func})),id:o().string,required:o().bool,value:o().any},q.defaultProps={rules:[],children:null,required:!0,value:void 0,id:""};var V=["isValid"];function T(e,t){if(null==e)return{};var r,n,i=function(e,t){if(null==e)return{};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}function x(e,t){var r=new f;r.addField({value:e,rules:t});var n=r.validate();return[n.isValid,T(n,V)]}var A=/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;const C={notEmpty:[{rule:function(e){return""!==e&&e.length>0},message:"Value is required"}],bool:[{rule:function(e){return!!e},message:"Value is required"}],password:[{rule:function(e){return e.length>0},message:"Password field cannot be empty"},{rule:function(e){return e.length>5},message:"Password field can not be less than 6 characters"}],email:[{rule:function(e){return!!e&&""!==e&&0!==e.length},message:"Email is required"},{rule:function(e){return A.test(String(e).toLowerCase())},message:"Email is invalid"}],min:function(e){return[{rule:function(t){return parseFloat(t)>e},message:"The value must be greater than ".concat(e)}]},max:function(e){return[{rule:function(t){return parseFloat(t)<e},message:"The value must be smaller ".concat(e)}]},length:function(e,t){return[{rule:function(t){return String(t).length>=e},message:"No less than ".concat(e," symbols")},{rule:function(e){return void 0===t||String(e).length<=t},message:"No more than ".concat(t," symbols")}]}},B=w;module.exports=t})();

package/jest.config.js

@@ -1,5 +0,0 @@
-module.exports = {
-  collectCoverage: true,
-  coverageDirectory: './coverage/',
-  displayName: '@coxy',
-};

package/src/context.js

@@ -1,3 +0,0 @@
-import React from 'react';
-
-export default React.createContext('@coxy/Validator');

package/src/context.test.js

@@ -1,13 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-/* eslint-env jest */
-
-import context from './context';
-
-it('renders with or without a name', () => {
-  expect(typeof context).toBe('object');
-  expect(typeof context.Consumer).toBe('object');
-  expect(typeof context.Provider).toBe('object');
-});

package/src/index.js

@@ -1,13 +0,0 @@
-import ValidatorWrapper from './validator-wrapper';
-import ValidatorField from './validator-field';
-import useValidator from './use-validator';
-import Validator from './validator';
-import rules from './rules';
-
-export default ValidatorWrapper;
-export {
-  ValidatorField,
-  useValidator,
-  Validator,
-  rules,
-};

package/src/index.test.js

@@ -1,13 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-/* eslint-env jest */
-
-import ValidatorWrapper, { ValidatorField, rules } from './index';
-
-it('renders with or without a name', () => {
-  expect(typeof ValidatorWrapper).toBe('function');
-  expect(typeof ValidatorField).toBe('function');
-  expect(typeof rules).toBe('object');
-});

package/src/rules.test.js

@@ -1,134 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-/* eslint-env jest */
-
-import rules from './rules';
-
-it('check rule email', () => {
-  expect(rules.email.length).toBe(2);
-
-  let result = null;
-  // email.length > 0
-  result = rules.email[0].rule('test');
-  expect(result).toBe(true);
-
-  // email check regexp
-  result = rules.email[1].rule('test');
-  expect(result).toBe(false);
-
-  // email check regexp
-  result = rules.email[1].rule('test@gmail.com');
-  expect(result).toBe(true);
-});
-
-it('check rule password', () => {
-  expect(rules.password.length).toBe(2);
-
-  let result = null;
-  // password.length > 0
-  result = rules.password[0].rule('test');
-  expect(result).toBe(true);
-
-  // password.length > 5
-  result = rules.password[1].rule('test');
-  expect(result).toBe(false);
-});
-
-it('check rule bool', () => {
-  expect(rules.bool.length).toBe(1);
-
-  let result = null;
-  result = rules.bool[0].rule(true);
-  expect(result).toBe(true);
-});
-
-it('check rule notEmpty', () => {
-  expect(rules.notEmpty.length).toBe(1);
-
-  let result = null;
-  result = rules.notEmpty[0].rule('');
-  expect(result).toBe(false);
-
-  result = rules.notEmpty[0].rule('test');
-  expect(result).toBe(true);
-});
-
-it('check rule min', () => {
-  expect(rules.min(1).length).toBe(1);
-  expect(typeof rules.min).toBe('function');
-
-  let result = null;
-  result = rules.min(10)[0].rule('');
-  expect(result).toBe(false);
-
-  result = rules.min(9)[0].rule('testtesttest');
-  expect(result).toBe(false);
-
-  result = rules.min(9)[0].rule('11');
-  expect(result).toBe(true);
-
-  result = rules.min(9)[0].rule(10);
-  expect(result).toBe(true);
-
-  result = rules.min(9)[0].rule('8');
-  expect(result).toBe(false);
-
-  result = rules.min(9)[0].rule(7);
-  expect(result).toBe(false);
-
-  result = rules.min(-1)[0].rule('');
-  expect(result).toBe(false);
-});
-
-it('check rule max', () => {
-  let result = null;
-  result = rules.max(10)[0].rule('');
-  expect(result).toBe(false);
-
-  result = rules.max(9)[0].rule('testtesttest');
-  expect(result).toBe(false);
-
-  result = rules.max(9)[0].rule('11');
-  expect(result).toBe(false);
-
-  result = rules.max(9)[0].rule(10);
-  expect(result).toBe(false);
-
-  result = rules.max(9)[0].rule('5');
-  expect(result).toBe(true);
-
-  result = rules.max(9)[0].rule(5);
-  expect(result).toBe(true);
-
-  result = rules.max(-1)[0].rule('');
-  expect(result).toBe(false);
-});
-
-it('check rule length', () => {
-  let result = null;
-  result = rules.length(1)[0].rule('');
-  expect(result).toBe(false);
-
-  result = rules.length(1)[0].rule('1');
-  expect(result).toBe(true);
-
-  result = rules.length(1, 10)[0].rule('testtesttest');
-  expect(result).toBe(true);
-
-  result = rules.length(1, 10)[1].rule('testtesttest');
-  expect(result).toBe(false);
-
-  result = rules.length(1, 10)[0].rule('lol');
-  expect(result).toBe(true);
-
-  result = rules.length(1, 10)[1].rule('lol');
-  expect(result).toBe(true);
-
-  result = rules.length(1)[1].rule('test undefined 2 param');
-  expect(result).toBe(true);
-
-  result = rules.length(10)[0].rule('tes');
-  expect(result).toBe(false);
-});

package/src/use-validator.js

@@ -1,8 +0,0 @@
-import Validator from './validator';
-
-export default function useValidate(value, rules) {
-  const validator = new Validator();
-  validator.addField({ value, rules });
-  const { isValid, ...validateObject } = validator.validate();
-  return [isValid, validateObject];
-}

package/src/use-validator.test.js

@@ -1,56 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-/* eslint-env jest */
-/* eslint react/jsx-filename-extension: [0] */
-
-import React from 'react';
-import { render, unmountComponentAtNode } from 'react-dom';
-import { act } from 'react-dom/test-utils';
-
-import rules from './rules';
-import useValidate from './use-validator';
-
-let container = null;
-beforeEach(() => {
-  container = document.createElement('div');
-  document.body.appendChild(container);
-});
-
-afterEach(() => {
-  unmountComponentAtNode(container);
-  container.remove();
-  container = null;
-});
-
-jest.useFakeTimers();
-
-it('check state change and hide field', () => {
-  function Comp() {
-    const [value, setValue] = React.useState(false);
-    const [isValid] = useValidate(value, rules.bool);
-    console.log(isValid);
-
-    React.useEffect(() => {
-      setTimeout(() => {
-        act(() => {
-          setValue(true);
-        });
-      }, 100);
-    }, []);
-
-    return (
-      <div>{isValid ? 'true' : 'false'}</div>
-    );
-  }
-  act(() => {
-    render(<Comp />, container);
-  });
-
-  expect(container.textContent).toBe('false');
-
-  jest.runAllTimers();
-
-  expect(container.textContent).toBe('true');
-});

package/src/validator-field.jsx

@@ -1,72 +0,0 @@
-/* eslint react/jsx-props-no-spreading: [0], react/sort-comp: [0], camelcase: [0] */
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import Context from './context';
-import { Field } from './validator';
-
-class ValidationFieldWrapper extends Component {
-  componentWillUnmount() {
-    this.props.unregisterField(this);
-  }
-
-  componentDidMount() {
-    this.props.registerField(this);
-  }
-
-  validate() {
-    const field = new Field({
-      rules: this.props.rules,
-      required: this.props.required,
-      value: this.props.value,
-      id: this.props.id,
-    });
-    return field.validate();
-  }
-
-  render() {
-    const { children, value } = this.props;
-    const validity = this.validate();
-    return (typeof children === 'function' ? children(validity, value) : children);
-  }
-}
-
-export default function ValidationField(props) {
-  return (
-    <Context.Consumer>
-      {(data) => (
-        <ValidationFieldWrapper
-          {...props}
-          registerField={data.registerField}
-          unregisterField={data.unregisterField}
-        />
-      )}
-    </Context.Consumer>
-  );
-}
-
-ValidationFieldWrapper.propTypes = {
-  // from context
-  registerField: PropTypes.func.isRequired,
-  unregisterField: PropTypes.func.isRequired,
-
-  children: PropTypes.oneOfType([
-    PropTypes.node,
-    PropTypes.func,
-  ]),
-  rules: PropTypes.arrayOf(PropTypes.shape({
-    message: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
-    rule: PropTypes.func,
-  })),
-
-  id: PropTypes.string,
-  required: PropTypes.bool,
-  value: PropTypes.any, // eslint-disable-line
-};
-
-ValidationFieldWrapper.defaultProps = {
-  rules: [],
-  children: null,
-  required: true,
-  value: undefined,
-  id: '',
-};