Merge branch 'better_filtering' of github.com:HubSpot/react-typeahead…

… into hubspot

README.md

@@ -343,7 +343,7 @@ A function to filter the provided `options` based on the current input value. Fo
 
 If provided as a string, it will interpret it as a field name and use that field from each option object.
 
-#### props.filterOptions
+#### props.searchOptions
 
 Type: `Function`
 
@@ -358,7 +358,7 @@ Make sure to use the `displayOption`, `inputDisplayOption`, and `formInputOption
 
 Type: `String` or `Function`
 
-A function that maps the internal state of the visible options into the value stored in the text value field of the input when an option is selected.
+A function that maps the internal state of the visible options into the value stored in the text value field of the visible input when an option is selected.
 
 Receives `(option)`.
 
@@ -370,7 +370,7 @@ If no value is set, the input will be set using `displayOption` when an option i
 
 Type: `String` or `Function`
 
-A function to map an option onto a string to include in HTML forms (see `props.name`). Receives `(option)` as arguments. Must return a string.
+A function to map an option onto a string to include in HTML forms as a hidden field (see `props.name`). Receives `(option)` as arguments. Must return a string.
 
 If specified as a string, it will interpret it as a field name and use that field from each option object.
 

src/typeahead/index.js

@@ -35,7 +35,7 @@ var Typeahead = React.createClass({
       React.PropTypes.string,
       React.PropTypes.func
     ]),
-    filterOptions: React.PropTypes.func,
+    searchOptions: React.PropTypes.func,
     displayOption: React.PropTypes.oneOfType([
       React.PropTypes.string,
       React.PropTypes.func
@@ -75,7 +75,7 @@ var Typeahead = React.createClass({
       onFocus: function(event) {},
       onBlur: function(event) {},
       filterOption: null,
-      filterOptions: null,
+      searchOptions: null,
       inputDisplayOption: null,
       defaultClassNames: true,
       customListComponent: TypeaheadSelector,
@@ -107,8 +107,8 @@ var Typeahead = React.createClass({
   getOptionsForValue: function(value, options) {
     if (this._shouldSkipSearch(value)) { return []; }
 
-    var filterOptions = this._generateFilterFunction();
-    var result = filterOptions(value, options);
+    var searchOptions = this._generateSearchFunction();
+    var result = searchOptions(value, options);
     if (this.props.maxVisible) {
       result = result.slice(0, this.props.maxVisible);
     }
@@ -357,14 +357,14 @@ var Typeahead = React.createClass({
     );
   },
 
-  _generateFilterFunction: function() {
-    var filterOptionsProp = this.props.filterOptions;
+  _generateSearchFunction: function() {
+    var searchOptionsProp = this.props.searchOptions;
     var filterOptionProp = this.props.filterOption;
-    if (typeof filterOptionsProp === 'function') {
+    if (typeof searchOptionsProp === 'function') {
       if (filterOptionProp !== null) {
-        console.warn('filterOptions prop is being used, filterOption prop will be ignored');
+        console.warn('searchOptions prop is being used, filterOption prop will be ignored');
       }
-      return filterOptionsProp;
+      return searchOptionsProp;
     } else if (typeof filterOptionProp === 'function') {
       return function(value, options) {
         return options.filter(function(o) { return filterOptionProp(value, o); });

test/typeahead-test.js

@@ -196,15 +196,15 @@ describe('Typeahead Component', function() {
       });
     });
 
-    context('filterOptions', function() {
+    context('searchOptions', function() {
       it('maps correctly when specified with map function', function() {
         var createObject = function(o) {
           return { len: o.length, orig: o };
         };
 
         var component = TestUtils.renderIntoDocument(<Typeahead
           options={ BEATLES }
-          filterOptions={ function(inp, opts) { return opts.map(createObject); } }
+          searchOptions={ function(inp, opts) { return opts.map(createObject); } }
           displayOption={ function(o, i) { return 'Score: ' + o.len + ' ' + o.orig; } }
           inputDisplayOption={ function(o, i) { return o.orig; } }
         />);
@@ -220,7 +220,7 @@ describe('Typeahead Component', function() {
 
         var component = TestUtils.renderIntoDocument(<Typeahead
           options={ BEATLES }
-          filterOptions={ function(inp, opts) { return opts.map(function(o) { return o; }).sort().map(createObject); } }
+          searchOptions={ function(inp, opts) { return opts.map(function(o) { return o; }).sort().map(createObject); } }
           displayOption={ function(o, i) { return 'Score: ' + o.len + ' ' + o.orig; } }
           inputDisplayOption={ function(o, i) { return o.orig; } }
         />);
@@ -238,7 +238,7 @@ describe('Typeahead Component', function() {
 
         var component = TestUtils.renderIntoDocument(<Typeahead
           options={ BEATLES }
-          filterOptions={ function(inp, opts) { return opts.map(function(o) { return o; }).sort().map(createObject); } }
+          searchOptions={ function(inp, opts) { return opts.map(function(o) { return o; }).sort().map(createObject); } }
           displayOption={ function(o, i) { return 'Score: ' + o.len + ' ' + o.orig; } }
           inputDisplayOption={ function(o, i) { return o.orig; } }
         />);