Added first rough idea.

Author: rmariuzzo

.babelrc

@@ -0,0 +1,12 @@
+{
+  "env": {
+    "test": {
+      "presets": ["es2015"],
+      "plugins": ["syntax-object-rest-spread", "transform-object-rest-spread"]
+    },
+    "production": {
+      "presets": ["es2015-rollup"],
+      "plugins": ["syntax-object-rest-spread", "transform-object-rest-spread"]
+    }
+  }
+}

dist/react-input-handler.esm.js

@@ -0,0 +1,32 @@
+{
+  "name": "react-input-handler",
+  "version": "0.0.1",
+  "description": "Utility function to handle input changes in React.",
+  "main": "dist/react-input-handler.js",
+  "module": "dist/react-input-handler.esm.js",
+  "browser": "dist/react-input-handler.umd.js",
+  "repository": "git@github.com:rmariuzzo/react-input-handler.git",
+  "author": "Rubens Mariuzzo <rubens@mariuzzo.com>",
+  "license": "MIT",
+  "files": [
+    "LICENSE",
+    "dist",
+    "README.md",
+    "yarn.lock"
+  ],
+  "devDependencies": {
+    "babel-core": "^6.26.0",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-es2015-rollup": "^3.0.0",
+    "cross-env": "^5.1.1",
+    "rollup": "^0.51.5",
+    "rollup-plugin-babel": "^3.0.2",
+    "rollup-plugin-filesize": "^1.4.2",
+    "rollup-plugin-uglify": "^2.0.1",
+    "uglify-es": "^3.1.9"
+  },
+  "scripts": {
+    "build": "cross-env NODE_ENV=production rollup -c"
+  }
+}

dist/react-input-handler.esm.js.map

@@ -0,0 +1,39 @@
+import babel from 'rollup-plugin-babel'
+import uglify from 'rollup-plugin-uglify'
+import filesize from 'rollup-plugin-filesize'
+import { minify } from 'uglify-es'
+import pkg from './package.json';
+
+export default [
+
+  // browser-friendly UMD build
+  {
+    input: 'src/ReactInputHandler.js',
+    output: {
+      file: pkg.browser,
+      format: 'umd',
+      sourcemap: true,
+    },
+    name: 'ReactInputHandler',
+    plugins: [
+      babel(),
+      uglify({}, minify),
+      filesize(),
+    ]
+  },
+
+  // CommonJS (for Node) and ES module (for bundlers) build.
+  {
+    input: 'src/ReactInputHandler.js',
+    external: ['ms'],
+    output: [
+      { file: pkg.main, format: 'cjs', sourcemap: true },
+      { file: pkg.module, format: 'es', sourcemap: true },
+    ],
+    plugins: [
+      babel(),
+      uglify({}, minify),
+      filesize(),
+    ]
+  }
+];

dist/react-input-handler.js

@@ -0,0 +1,42 @@
+'use strict'
+
+export default handler
+
+function handler(event) {
+
+  if (!event) {
+    throw new Error('event must be defined')
+  }
+
+  if (typeof event !== 'object') {
+    throw new Error('event must be an object')
+  }
+
+  if (typeof this.setState !== 'function') {
+    throw new Error('react-input-handler must be bound to the component instance')
+  }
+
+  const target = event.target
+  const name = target.name
+
+  if (!name) {
+    throw new Error('all input must have a name prop')
+  }
+
+  this.setState({
+    [name]: getValue(target)
+  })
+
+}
+
+function getValue(element) {
+  switch(element.type) {
+    case 'checkbox':
+      return element.checked
+    case 'select-multiple':
+      return [ ...element.querySelectorAll(':checked') ]
+        .map((checked) => checked.value)
+    default:
+      return element.value
+  }
+}