Update dependencies. Some minor changes.

.babelrc

@@ -0,0 +1,7 @@
+{
+  "presets": [
+    "react",
+    "es2015",
+    "stage-2"
+  ]
+}

.gitignore

@@ -1,4 +1,2 @@
-.DS_Store
-build
 node_modules
 lib

.npmignore

@@ -1,3 +1,8 @@
-build/
-bower.json
-Gulpfile.js
+.babelrc
+.editorconfig
+.travis.yml
+testrunner.js
+webpack.production.config.js
+examples/
+release/
+tests/

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2014 Gloppens EDB Lag
+Copyright (c) 2014-2016 Gloppens EDB Lag
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -6,8 +6,6 @@ A form input builder and validator for React JS
 | [How to use](#how-to-use) | [API](/API.md) | [Examples](/examples) |
 |---|---|---|
 
-### From version 0.12.0 Formsy only supports React 0.13.1 and up
-
 ## <a name="background">Background</a>
 I wrote an article on forms and validation with React JS, [Nailing that validation with React JS](http://christianalfoni.github.io/javascript/2014/10/22/nailing-that-validation-with-reactjs.html), the result of that was this extension.
 
@@ -48,29 +46,29 @@ Complete API reference is available [here](/API.md).
 
 #### Formsy gives you a form straight out of the box
 
-```javascript
-  /** @jsx React.DOM */
-  var Formsy = require('formsy-react');
-  var MyAppForm = React.createClass({
-    getInitialState: function () {
+```jsx
+  import Formsy from 'formsy-react';
+
+  const MyAppForm = React.createClass({
+    getInitialState() {
       return {
         canSubmit: false
       }
     },
-    enableButton: function () {
+    enableButton() {
       this.setState({
         canSubmit: true
       });
     },
-    disableButton: function () {
+    disableButton() {
       this.setState({
         canSubmit: false
       });
     },
-    submit: function (model) {
+    submit(model) {
       someDep.saveEmail(model.email);
     },
-    render: function () {
+    render() {
       return (
         <Formsy.Form onValidSubmit={this.submit} onValid={this.enableButton} onInvalid={this.disableButton}>
           <MyOwnInput name="email" validations="isEmail" validationError="This is not a valid email" required/>
@@ -84,31 +82,31 @@ Complete API reference is available [here](/API.md).
 This code results in a form with a submit button that will run the `submit` method when the submit button is clicked with a valid email. The submit button is disabled as long as the input is empty ([required](/API.md#required)) or the value is not an email ([isEmail](/API.md#validators)). On validation error it will show the message: "This is not a valid email".
 
 #### Building a form element (required)
-```javascript
-  /** @jsx React.DOM */
-  var Formsy = require('formsy-react');
-  var MyOwnInput = React.createClass({
+```jsx
+  import Formsy from 'formsy-react';
+
+  const MyOwnInput = React.createClass({
 
     // Add the Formsy Mixin
     mixins: [Formsy.Mixin],
 
     // setValue() will set the value of the component, which in
     // turn will validate it and the rest of the form
-    changeValue: function (event) {
+    changeValue(event) {
       this.setValue(event.currentTarget.value);
     },
-    render: function () {
 
+    render() {
       // Set a specific className based on the validation
       // state of this component. showRequired() is true
       // when the value is empty and the required prop is
       // passed to the input. showError() is true when the
       // value typed is invalid
-      var className = this.showRequired() ? 'required' : this.showError() ? 'error' : null;
+      const className = this.showRequired() ? 'required' : this.showError() ? 'error' : null;
 
       // An error message is returned ONLY if the component is invalid
       // or the server has returned an error message
-      var errorMessage = this.getErrorMessage();
+      const errorMessage = this.getErrorMessage();
 
       return (
         <div className={className}>
@@ -130,32 +128,9 @@ The form element component is what gives the form validation functionality to wh
 ## Contribute
 - Fork repo
 - `npm install`
-- `npm start` runs the development server on `localhost:8080`
+- `npm run examples` runs the development server on `localhost:8080`
 - `npm test` runs the tests
 
-License
--------
+## License
 
-formsy-react is licensed under the [MIT license](LICENSE).
-
-> The MIT License (MIT)
->
-> Copyright (c) 2015 Gloppens EDB Lag
->
-> Permission is hereby granted, free of charge, to any person obtaining a copy
-> of this software and associated documentation files (the "Software"), to deal
-> in the Software without restriction, including without limitation the rights
-> to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-> copies of the Software, and to permit persons to whom the Software is
-> furnished to do so, subject to the following conditions:
->
-> The above copyright notice and this permission notice shall be included in
-> all copies or substantial portions of the Software.
->
-> THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-> IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-> FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-> AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-> LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-> OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-> THE SOFTWARE.
+[MIT](/LICENSE)

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "formsy-react",
-  "version": "0.16.0",
+  "version": "0.18.0",
   "description": "A form input builder and validator for React JS",
   "repository": {
     "type": "git",
@@ -13,7 +13,7 @@
     "Gulpfile.js"
   ],
   "dependencies": {
-    "react": "^0.13.1"
+    "react": "^0.14.7 || ^15.0.0"
   },
   "keywords": [
     "react",

build/index.html

@@ -1,9 +0,0 @@
-<html>
-  <head>
-    <title>Formsy Test</title>
-  </head>
-  <body>
-  <div id="app"></div>
-    <script src="build.js"></script>
-  </body>
-</html>

build/test.js

@@ -1,55 +0,0 @@
-var React = require('react');
-var ReactDOM = require('react-dom');
-var Formsy = require('./../src/main.js');
-
-var Input = React.createClass({
-  onChange: function (event) {
-    this.props.setValue(event.currentTarget.value);
-  },
-  render: function () {
-    return (
-      <div>
-      {this.props.showRequired() ? 'required' : ''}
-      <input disabled={this.props.isFormDisabled()} value={this.props.getValue()} onChange={this.onChange}/>
-      </div>
-    );
-  }
-});
-
-Input = Formsy.HOC(Input);
-
-var SomeComp = React.createClass({
-  getInitialState: function () {
-    return  {
-      isRequired: false
-    };
-  },
-  toggleRequired: function () {
-    this.setState({
-      isRequired: !this.state.isRequired
-    });
-  },
-  render: function () {
-    return (
-      <div>
-        <Input name="foo[0]" value={''} validations="isEmail" validationError="No email" required={this.state.isRequired}/>
-        <button onClick={this.toggleRequired}>Test</button>
-      </div>
-    )
-  }
-});
-
-var FormApp = React.createClass({
-  onSubmit: function (model) {
-    console.log('model', model);
-  },
-  render: function () {
-    return (
-      <Formsy.Form ref="form" onSubmit={this.onSubmit}>
-        <SomeComp/>
-      </Formsy.Form>
-    );
-  }
-});
-
-ReactDOM.render(<FormApp />, document.getElementById('app'));

package.json

@@ -8,7 +8,6 @@
   },
   "main": "lib/main.js",
   "scripts": {
-    "start": "webpack-dev-server --content-base build",
     "deploy": "NODE_ENV=production webpack -p --config webpack.production.config.js",
     "test": "babel-node testrunner",
     "examples": "webpack-dev-server --config examples/webpack.config.js --content-base examples",
@@ -24,24 +23,25 @@
     "react-component"
   ],
   "dependencies": {
-    "form-data-to-object": "^0.1.0"
+    "form-data-to-object": "^0.2.0"
   },
   "devDependencies": {
-    "babel": "^5.6.4",
-    "babel-core": "^5.1.11",
-    "babel-loader": "^5.0.0",
+    "babel-cli": "^6.6.5",
+    "babel-loader": "^6.2.4",
+    "babel-preset-es2015": "^6.6.0",
+    "babel-preset-react": "^6.5.0",
+    "babel-preset-stage-2": "^6.5.0",
     "jsdom": "^6.5.1",
-    "lolex": "^1.3.2",
     "nodeunit": "^0.9.1",
-    "react": "^0.14.0-rc1",
-    "react-addons-pure-render-mixin": "^0.14.2",
-    "react-addons-test-utils": "^0.14.0-rc1",
-    "react-dom": "^0.14.0-rc1",
-    "sinon": "^1.17.1",
-    "webpack": "^1.7.3",
-    "webpack-dev-server": "^1.7.0"
+    "react": "^15.0.0",
+    "react-addons-pure-render-mixin": "^15.0.0",
+    "react-addons-test-utils": "^15.0.0",
+    "react-dom": "^15.0.0",
+    "sinon": "^1.17.3",
+    "webpack": "^1.12.14",
+    "webpack-dev-server": "^1.14.1"
   },
   "peerDependencies": {
-    "react": "^0.14.0"
+    "react": "^0.14.0 || ^15.0.0"
   }
 }

src/main.js

@@ -118,7 +118,7 @@ Formsy.Form = React.createClass({
     if (this.props.mapping) {
       return this.props.mapping(model)
     } else {
-      return formDataToObject(Object.keys(model).reduce((mappedModel, key) => {
+      return formDataToObject.toObj(Object.keys(model).reduce((mappedModel, key) => {
 
         var keyArray = key.split('.');
         var base = mappedModel;

tests/Rules-minLength-spec.js

@@ -42,6 +42,15 @@ export default {
 
     },
 
+    'should fail when a string\'s length is smaller': function (test) {
+
+      const form = TestUtils.renderIntoDocument(<TestForm rule="minLength:3" inputValue="my"/>);
+      const inputComponent = TestUtils.findRenderedComponentWithType(form, TestInput);
+      test.equal(inputComponent.isValid(), false);
+      test.done();
+
+    },
+
     'should pass with empty string': function (test) {
 
       const form = TestUtils.renderIntoDocument(<TestForm rule="minLength:3" inputValue=""/>);

tests/utils/TestInput.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import Formsy from './../..';
-import assign from 'react/lib/Object.assign';
 
 const defaultProps = {
   mixins: [Formsy.Mixin],
@@ -16,7 +15,7 @@ const defaultProps = {
 };
 
 export function InputFactory(props) {
-  return React.createClass(assign(defaultProps, props));
+  return React.createClass(Object.assign(defaultProps, props));
 }
 
 export default React.createClass(defaultProps);

webpack.config.js

@@ -1,21 +0,0 @@
-var path = require('path');
-
-module.exports = {
-
-  devtool: 'inline-source-map',
-
-  entry: path.resolve(__dirname, 'build', 'test.js'),
-
-  output: {
-    path: path.resolve(__dirname, 'build'),
-    filename: 'build.js'
-  },
-
-  module: {
-    loaders: [
-      { test: /\.js$/, exclude: /node_modules/, loader: 'babel' },
-      { test: /\.json$/, loader: 'json' }
-    ]
-  }
-
-};