Merge a0ac2b5 into 64b07d7

examples/index.html

@@ -602,5 +602,23 @@ <h3>Translating texts</h3>
       })
     </script>
 
+    <script type="text/javascript">
+
+      function logChange(selector, message) {
+        var elements = document.querySelectorAll(selector);
+        function getListner(element) {
+          return function(e) { console.log(message + e.detail); }
+        }
+        for(var i = 0; i < elements.length; i++) {
+          elements[i].addEventListener('confirm', getListner(element));
+        }
+      }
+
+      logChange('.autocomplete-wrapper input', 'autocomplete wrapper changed to : ');
+      logChange('select', 'progressively enhanced select changed to : ');
+
+    </script>
+
+
   </body>
 </html>

package.json

@@ -82,6 +82,9 @@
     "webpack-sources": "^1.0.1"
   },
   "standard": {
-    "parser": "babel-eslint"
+    "parser": "babel-eslint",
+    "globals": [
+      "CustomEvent"
+    ]
   }
 }

src/autocomplete.js

@@ -95,6 +95,14 @@ export default class Autocomplete extends Component {
     this.getDirectInputChanges = this.getDirectInputChanges.bind(this)
   }
 
+  dispatchChange (value) {
+    var e = new CustomEvent('confirm', { detail: value })
+    if (this.base) {
+      this.base.querySelector('input').dispatchEvent(e)
+      if (this.props.selectElement) { this.props.selectElement.dispatchEvent(e) }
+    }
+  }
+
   componentDidMount () {
     this.pollInputElement()
   }
@@ -263,6 +271,7 @@ export default class Autocomplete extends Component {
     const selectedOption = this.state.options[index]
     const newQuery = this.templateInputValue(selectedOption)
     this.props.onConfirm(selectedOption)
+    this.dispatchChange(selectedOption)
     this.setState({
       focused: -1,
       menuOpen: false,