easy-react-form - npm Package Compare versions

Comparing version 1.0.17 to 1.0.18

commonjs/form.js

@@ -413,3 +413,7 @@ 'use strict';
 					{ value: this.state },
-					children
+					typeof children === 'function' ? _react2.default.createElement(
+						Children,
+						{ values: this.values() },
+						children
+					) : children
 				)
@@ -431,3 +435,4 @@ );
 	onError: _propTypes2.default.func.isRequired,
-	plugins: _propTypes2.default.arrayOf(_propTypes2.default.func).isRequired
+	plugins: _propTypes2.default.arrayOf(_propTypes2.default.func).isRequired,
+	children: _propTypes2.default.oneOfType([_propTypes2.default.func, _propTypes2.default.node]).isRequired
 }, _class.defaultProps = {
@@ -467,2 +472,7 @@ autoFocus: false,
 		_this4.setState(_this4.state, callback);
+		var children = _this4.props.children;
+
+		if (typeof children === 'function') {
+			_this4.forceUpdate();
+		}
 		// const { onStateChange } = this.props
@@ -668,3 +678,37 @@ // if (onStateChange) {
 
+var Children = function (_React$Component) {
+	_inherits(Children, _React$Component);
 
+	function Children() {
+		_classCallCheck(this, Children);
+
+		return _possibleConstructorReturn(this, (Children.__proto__ || Object.getPrototypeOf(Children)).apply(this, arguments));
+	}
+
+	_createClass(Children, [{
+		key: 'componentDidMount',
+		value: function componentDidMount() {
+			this._isMounted = true;
+		}
+	}, {
+		key: 'render',
+		value: function render() {
+			var _props3 = this.props,
+			    values = _props3.values,
+			    children = _props3.children;
+
+			return children({
+				values: this._isMounted ? values : undefined
+			});
+		}
+	}]);
+
+	return Children;
+}(_react2.default.Component);
+
+Children.propTypes = {
+	values: _propTypes2.default.object.isRequired,
+	children: _propTypes2.default.func.isRequired
+};
+
 function generateInitialFormState() {
@@ -671,0 +715,0 @@ var initialValues = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

commonjs/list.js

@@ -130,10 +130,2 @@ 'use strict';
 
-	this.onReset = function () {
-		var items = _this3.getInitialItems();
-		_this3.setState({
-			items: items,
-			itemsCounter: items.length
-		});
-	};
-
 	this.add = function () {
@@ -140,0 +132,0 @@ var context = _this3.props.context;

commonjs/plugins/ListPlugin.utility.js

@@ -24,2 +24,3 @@ 'use strict';
 function convertListValues(values) {
+	// `values` are converted to `actualValues`.
 	var actualValues = {};
@@ -66,2 +67,7 @@ var listNames = [];
 	// When an item is removed indexes are not shifted.
+	// Example:
+	// "list:0:value": "a"
+	// "list:2:value": "c"
+	// Result:
+	// "list": [{ value: "a" }, { value: "c" }]
 	for (var _iterator2 = listNames, _isArray2 = Array.isArray(_iterator2), _i2 = 0, _iterator2 = _isArray2 ? _iterator2 : _iterator2[Symbol.iterator]();;) {
@@ -68,0 +74,0 @@ var _ref2;

modules/form.js

@@ -413,3 +413,7 @@ 'use strict';
 					{ value: this.state },
-					children
+					typeof children === 'function' ? _react2.default.createElement(
+						Children,
+						{ values: this.values() },
+						children
+					) : children
 				)
@@ -431,3 +435,4 @@ );
 	onError: _propTypes2.default.func.isRequired,
-	plugins: _propTypes2.default.arrayOf(_propTypes2.default.func).isRequired
+	plugins: _propTypes2.default.arrayOf(_propTypes2.default.func).isRequired,
+	children: _propTypes2.default.oneOfType([_propTypes2.default.func, _propTypes2.default.node]).isRequired
 }, _class.defaultProps = {
@@ -467,2 +472,7 @@ autoFocus: false,
 		_this4.setState(_this4.state, callback);
+		var children = _this4.props.children;
+
+		if (typeof children === 'function') {
+			_this4.forceUpdate();
+		}
 		// const { onStateChange } = this.props
@@ -668,3 +678,37 @@ // if (onStateChange) {
 
+var Children = function (_React$Component) {
+	_inherits(Children, _React$Component);
 
+	function Children() {
+		_classCallCheck(this, Children);
+
+		return _possibleConstructorReturn(this, (Children.__proto__ || Object.getPrototypeOf(Children)).apply(this, arguments));
+	}
+
+	_createClass(Children, [{
+		key: 'componentDidMount',
+		value: function componentDidMount() {
+			this._isMounted = true;
+		}
+	}, {
+		key: 'render',
+		value: function render() {
+			var _props3 = this.props,
+			    values = _props3.values,
+			    children = _props3.children;
+
+			return children({
+				values: this._isMounted ? values : undefined
+			});
+		}
+	}]);
+
+	return Children;
+}(_react2.default.Component);
+
+Children.propTypes = {
+	values: _propTypes2.default.object.isRequired,
+	children: _propTypes2.default.func.isRequired
+};
+
 function generateInitialFormState() {
@@ -671,0 +715,0 @@ var initialValues = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

modules/list.js

@@ -130,10 +130,2 @@ 'use strict';
 
-	this.onReset = function () {
-		var items = _this3.getInitialItems();
-		_this3.setState({
-			items: items,
-			itemsCounter: items.length
-		});
-	};
-
 	this.add = function () {
@@ -140,0 +132,0 @@ var context = _this3.props.context;

modules/plugins/ListPlugin.utility.js

@@ -24,2 +24,3 @@ 'use strict';
 function convertListValues(values) {
+	// `values` are converted to `actualValues`.
 	var actualValues = {};
@@ -66,2 +67,7 @@ var listNames = [];
 	// When an item is removed indexes are not shifted.
+	// Example:
+	// "list:0:value": "a"
+	// "list:2:value": "c"
+	// Result:
+	// "list": [{ value: "a" }, { value: "c" }]
 	for (var _iterator2 = listNames, _isArray2 = Array.isArray(_iterator2), _i2 = 0, _iterator2 = _isArray2 ? _iterator2 : _iterator2[Symbol.iterator]();;) {
@@ -68,0 +74,0 @@ var _ref2;

package.json

 {
   "name": "easy-react-form",
-  "version": "1.0.17",
+  "version": "1.0.18",
   "description": "Simple, fast and easy-to-use React Form.",
@@ -5,0 +5,0 @@ "main": "index.commonjs.js",

README.md

@@ -152,2 +152,6 @@ # easy-react-form
 
+The `<Form/>` can also accept `children` being a `function(parameters)` returning a `React.Element` that will be called on any form value change, so it can be used in cases when re-rendering the whole `<Form/>` is required on any form value change. Available `parameters`:
+
+* `values : Object` — Form values. Is `undefined` until the form is initialized (mounted) (`<Field/>` `value`s are `undefined` until those `<Feild/>`s are mounted).
+
 ### Field
@@ -354,2 +358,6 @@
 
+Nested `<List/>`s are not supported.
+
+<!-- For setting `<List/>` value manually use `.setList(name, value)` method of a `Form` instance (analogous to `.set(name, value)`). -->
+
 <!-- ## Contributing
@@ -356,0 +364,0 @@

No alert changes

Improved metrics

Total package byte prevSize

257706

2.33%

Lines of code

2853

2.59%

Number of lines in readme file

399

2.05%

No dependency changes