react-validation-provider - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

example/src/index.js

 import React from 'react';
 import ReactDOM from 'react-dom';
-import App from './App';
+
 import './index.css';
+import { setDefaultScopeOptions } from '../../src';
 
+setDefaultScopeOptions({ manual: true });
+
+import App from './App';
+
 ReactDOM.render(
@@ -7,0 +12,0 @@ <App />,

example/src/MyForm.js

 import React from 'react';
 import './MyForm.css';
-import { customScope } from './scopes';
+import { scope } from '../../src';
 import TextInput from './components/TextInput';
@@ -10,3 +10,3 @@ import SelectBox from './components/SelectBox';
 
-@customScope
+@scope()
 export default class MyForm extends React.Component {
@@ -13,0 +13,0 @@

lib/index.js

@@ -6,3 +6,3 @@ 'use strict';
 });
-exports.trigger = exports.scope = exports.validate = undefined;
+exports.setDefaultScopeOptions = exports.setDefaultValidateOptions = exports.trigger = exports.scope = exports.validate = undefined;
 
@@ -25,2 +25,4 @@ var _validate = require('./validate');
 exports.scope = _scope2.default;
-exports.trigger = _trigger2.default;
+exports.trigger = _trigger2.default;
+exports.setDefaultValidateOptions = _validate.setDefaultValidateOptions;
+exports.setDefaultScopeOptions = _scope.setDefaultScopeOptions;

lib/scope.js

@@ -6,2 +6,3 @@ 'use strict';
 });
+exports.setDefaultScopeOptions = undefined;
 
@@ -51,3 +52,4 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
-            _this.enabled = !options.manual;
+            _this.options = Object.assign({}, defaultOptions, options);
+            _this.enabled = !_this.options.manual;
             _this.isValid = true;
@@ -133,3 +135,3 @@
 
-                if (!this.isValid && options.scroll) {
+                if (!this.isValid && this.options.scroll) {
                     var component = this.components[0];
@@ -139,5 +141,5 @@ var element = _reactDom2.default.findDOMNode(component);
                     (0, _scrollToElement2.default)(element, {
-                        offset: options.scrollOffset,
-                        ease: options.scrollEffect,
-                        duration: options.scrollDuration
+                        offset: this.options.scrollOffset,
+                        ease: this.options.scrollEffect,
+                        duration: this.options.scrollDuration
                     });
@@ -167,10 +169,12 @@ }
 
+var setDefaultScopeOptions = exports.setDefaultScopeOptions = function setDefaultScopeOptions(options) {
+    defaultOptions = Object.assign({}, defaultOptions, options);
+};
+
 exports.default = function () {
     var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
 
-    var mergedOptions = Object.assign({}, defaultOptions, options);
-
     return function (WrappedComponent) {
-        return scope(WrappedComponent, mergedOptions);
+        return scope(WrappedComponent, options);
     };
 };

lib/validate.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -6,10 +6,14 @@ Object.defineProperty(exports, "__esModule", {
 });
-exports.evaluate = undefined;
+exports.setDefaultValidateOptions = undefined;
 
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-var _react = require("react");
+var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
+var _layout = require('./layout');
+
+var _layout2 = _interopRequireDefault(_layout);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,6 +34,8 @@
 var defaultOptions = {
-    custom: false
+    custom: false,
+    propertyName: "value",
+    layout: _layout2.default
 };
 
-var evaluate = exports.evaluate = function evaluate(WrappedComponent, options) {
+var evaluate = function evaluate(WrappedComponent, options) {
     var _class, _temp;
@@ -45,2 +51,4 @@
 
+            _this.options = Object.assign({}, defaultOptions, options);
+
             _this.state = {
@@ -59,10 +67,10 @@ valid: true,
         _createClass(ValidationComponent, [{
-            key: "componentWillReceiveProps",
+            key: 'componentWillReceiveProps',
             value: function componentWillReceiveProps(nextProps) {
                 if (this.props.value !== nextProps.value && (!this.context.validation || this.context.validation.isEnabled())) {
-                    this.validate(nextProps.value);
+                    this.validate(nextProps[this.options.propertyName]);
                 }
             }
         }, {
-            key: "componentDidMount",
+            key: 'componentDidMount',
             value: function componentDidMount() {
@@ -74,7 +82,7 @@ if (this.context.validation) {
                 if (!this.context.validation || this.context.validation.isEnabled()) {
-                    this.validate(this.props.value);
+                    this.validate(this.props[this.options.propertyName]);
                 }
             }
         }, {
-            key: "componentWillUnmount",
+            key: 'componentWillUnmount',
             value: function componentWillUnmount() {
@@ -86,8 +94,8 @@ if (this.context.validation) {
         }, {
-            key: "checkValid",
+            key: 'checkValid',
             value: function checkValid() {
-                this.validate(this.props.value);
+                this.validate(this.props[this.options.propertyName]);
             }
         }, {
-            key: "validate",
+            key: 'validate',
             value: function validate(value) {
@@ -145,3 +153,3 @@ var _this2 = this;
         }, {
-            key: "render",
+            key: 'render',
             value: function render() {
@@ -151,21 +159,16 @@ var _props = this.props;
 
-                var componentProps = _objectWithoutProperties(_props, ["rules"]);
+                var componentProps = _objectWithoutProperties(_props, ['rules']);
 
                 var validation = { rules: rules, valid: this.state.valid, pending: this.state.pending, errorMessage: this.state.errorMessage };
 
-                if (options.custom) {
+                if (this.options.custom) {
                     return _react2.default.createElement(WrappedComponent, { componentProps: componentProps, validation: validation });
                 }
 
-                var error = !this.state.valid ? _react2.default.createElement(
-                    "div",
-                    { className: "form-element-error" },
-                    this.state.errorMessage
-                ) : _react2.default.createElement("div", null);
+                var Layout = this.options.layout;
 
                 return _react2.default.createElement(
-                    "div",
-                    null,
-                    _react2.default.createElement(WrappedComponent, componentProps),
-                    error
+                    Layout,
+                    validation,
+                    _react2.default.createElement(WrappedComponent, componentProps)
                 );
@@ -184,11 +187,12 @@ }
 
+var setDefaultValidateOptions = exports.setDefaultValidateOptions = function setDefaultValidateOptions(options) {
+    defaultOptions = Object.assign({}, defaultOptions, options);
+};
+
 exports.default = function () {
     var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
 
-
-    var margedOptions = Object.assign({}, defaultOptions, options);
-
     return function (WrappedComponent) {
-        return evaluate(WrappedComponent, margedOptions);
+        return evaluate(WrappedComponent, options);
     };
 };

package.json

 {
   "name": "react-validation-provider",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "React validation component",
@@ -5,0 +5,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

40576

increased by8.46%

Lines of code

749

increased by6.09%

No dependency changes