Replaced bable-preset-es2015 with babel-preset-env

Added transform-object-entries hile building the lib/SuperSelectField.js
Added default route to demos

lib/SuperSelectField.js

@@ -4,6 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
+var _entries = require('babel-runtime/core-js/object/entries');
+
+var _entries2 = _interopRequireDefault(_entries);
+
 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; };
 
 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; }; }();
@@ -63,7 +67,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 // Utilities
 function areEqual(val1, val2) {
   if (!val1 || !val2 || (typeof val1 === 'undefined' ? 'undefined' : _typeof(val1)) !== (typeof val2 === 'undefined' ? 'undefined' : _typeof(val2))) return false;else if (typeof val1 === 'string' || typeof val1 === 'number' || typeof val1 === 'boolean') return val1 === val2;else if ((typeof val1 === 'undefined' ? 'undefined' : _typeof(val1)) === 'object') {
-    return Object.keys(val1).length === Object.keys(val2).length && Object.entries(val2).every(function (_ref) {
+    return Object.keys(val1).length === Object.keys(val2).length && (0, _entries2.default)(val2).every(function (_ref) {
       var _ref2 = _slicedToArray(_ref, 2),
           key2 = _ref2[0],
           value2 = _ref2[1];

package.json

@@ -19,8 +19,10 @@
     "react-infinite-any-height": "^1.0.4"
   },
   "devDependencies": {
-    "babel-preset-es2015": "^6.24.0",
-    "babel-preset-stage-2": "^6.22.0",
+    "babel-plugin-transform-class-properties": "^6.23.0",
+    "babel-plugin-transform-object-entries": "^1.0.0",
+    "babel-plugin-transform-object-rest-spread": "^6.23.0",
+    "babel-preset-env": "^1.2.1",
     "enzyme": "^2.7.1",
     "flag-icon-css": "^2.8.0",
     "gh-pages": "^0.12.0",
@@ -40,9 +42,23 @@
     "react-tap-event-plugin": "^1.x || ^2.x"
   },
   "babel": {
+    "plugins": [
+      "transform-class-properties",
+      "transform-object-rest-spread",
+      "transform-object-entries"
+    ],
     "presets": [
-      "es2015",
-      "stage-2",
+      [
+        "env",
+        {
+          "targets": {
+            "browsers": [
+              "last 2 versions",
+              "safari >= 7"
+            ]
+          }
+        }
+      ],
       "react"
     ]
   },

src/App.js

@@ -23,11 +23,11 @@ export default () => (
 
     <section className='App-content'>
       <Switch>
-        <Route exact path='/' render={() => <Home />} />
-        <Route path='/example1' render={() => <CodeExample1 />} />
-        <Route path='/example2' render={() => <CodeExample2 />} />
-        <Route path='/example3' render={() => <CodeExample3 />} />
-        <Route path='/example4' render={() => <CodeExample4 />} />
+        <Route path='/example1' component={CodeExample1} />
+        <Route path='/example2' component={CodeExample2} />
+        <Route path='/example3' component={CodeExample3} />
+        <Route path='/example4' component={CodeExample4} />
+        <Route component={Home} />
       </Switch>
     </section>
 

src/CodeExample3.js

@@ -34,7 +34,23 @@ const displayState = state => state.length
   ? [...state].map(({ value, label }) => label || value).join(', ')
   : 'empty state'
 
-const dataSource = ['Raphaël', 'Jessica', 'Naomie', 'Oliver', 'Wynona', 'Ben', 'Vincent', 'Clémentine', 'Angélique', 'Julien', 'Steve', 'Yoan', 'Nathalie', 'Marie', 'Renée']
+const dataSource = [
+  {id: 0, name: 'Raphaël'},
+  {id: 1, name: 'Jessica'},
+  {id: 2, name: 'Naomie'},
+  {id: 3, name: 'Oliver'},
+  {id: 4, name: 'Wynona'},
+  {id: 5, name: 'Ben'},
+  {id: 6, name: 'Vincent'},
+  {id: 7, name: 'Clémentine'},
+  {id: 8, name: 'Angélique'},
+  {id: 9, name: 'Julien'},
+  {id: 10, name: 'Steve'},
+  {id: 11, name: 'Yoan'},
+  {id: 12, name: 'Nathalie'},
+  {id: 13, name: 'Marie'},
+  {id: 14, name: 'Renée'}
+]
 
 class CodeExample extends Component {
   state = {
@@ -95,7 +111,9 @@ class CodeExample extends Component {
       )
     })
 
-    const dataSourceNodes = dataSource.map((data, index) => <div key={index} value={data}>{data}</div>)
+    const dataSourceNodes = dataSource.map(({id, name}, index) => (
+      <div key={index} value={id} label={name}>{name}</div>
+    ))
 
     return <section style={containerStyle}>