diff --git a/README.md b/README.md
index e2c6d413..f50776f5 100644
--- a/README.md
+++ b/README.md
@@ -200,6 +200,30 @@ Default: `null`
You can pass a function that gets called instead of `onChange` function when user
hits the Enter key or clicks on an autocomplete item.
+#### options
+Type: `object`
+Required: `false`
+Default: `{}`
+
+You can fine-tune the settings passed to the AutocompleteService class with `options` prop.
+This prop accepts an object following the same format as [google.maps.places.AutocompletionRequest](https://developers.google.com/maps/documentation/javascript/reference#AutocompletionRequest)
+(except for `input`, which comes from the value of the input field).
+
+```js
+// these options will bias the autocomplete predictions toward Sydney, Australia with a radius of 2000 meters,
+// and limit the results to addresses only
+const options = {
+ location: new google.maps.LatLng(-34, 151),
+ radius: 2000,
+ types: ['address']
+}
+
+
+```
### `geocodeByAddress` API
diff --git a/src/PlacesAutocomplete.js b/src/PlacesAutocomplete.js
index d9225685..9b2d2195 100644
--- a/src/PlacesAutocomplete.js
+++ b/src/PlacesAutocomplete.js
@@ -153,7 +153,7 @@ class PlacesAutocomplete extends React.Component {
this.clearAutocomplete()
return;
}
- this.autocompleteService.getPlacePredictions({ input: event.target.value }, this.autocompleteCallback)
+ this.autocompleteService.getPlacePredictions({ ...this.props.options, input: event.target.value }, this.autocompleteCallback)
}
autocompleteItemStyle(active) {
@@ -247,6 +247,20 @@ PlacesAutocomplete.propTypes = {
autocompleteContainer: React.PropTypes.object,
autocompleteItem: React.PropTypes.object,
autocompleteItemActive: React.PropTypes.object
+ }),
+ options: React.PropTypes.shape({
+ bounds: React.PropTypes.object,
+ componentRestrictions: React.PropTypes.object,
+ location: React.PropTypes.object,
+ offset: React.PropTypes.oneOfType([
+ React.PropTypes.number,
+ React.PropTypes.string
+ ]),
+ radius: React.PropTypes.oneOfType([
+ React.PropTypes.number,
+ React.PropTypes.string
+ ]),
+ types: React.PropTypes.array
})
};
@@ -255,7 +269,8 @@ PlacesAutocomplete.defaultProps = {
hideLabel: false,
classNames: {},
autocompleteItem: ({ suggestion }) => (
{suggestion}
),
- styles: {}
+ styles: {},
+ options: {}
}
export default PlacesAutocomplete
diff --git a/src/tests/index.spec.js b/src/tests/index.spec.js
index 427b727d..973dfe59 100644
--- a/src/tests/index.spec.js
+++ b/src/tests/index.spec.js
@@ -180,7 +180,17 @@ describe('custom inline styles', () => {
const item = wrapper.find("#PlacesAutocomplete__autocomplete-container").childAt(0)
expect(item.props().style.color).to.equal('blue')
})
+})
+describe('AutocompletionRequest options', () => {
+ it('calls getPlacePredictions with the correct options', () => {
+ global.google.maps.places.AutocompleteService.prototype.getPlacePredictions = (request, callback) => {}
+ const spy = sinon.spy(global.google.maps.places.AutocompleteService.prototype, 'getPlacePredictions')
+ const options = { radius: 2000, types: ['address'] }
+ const wrapper = mount( {}} options={options} value='test'/>)
+ wrapper.find('.input-element').simulate('change', { target: { value: 'test' } })
+ expect(spy.calledWith({ ...options, input: 'test' })).to.be.true
+ })
})
// TODO: test geocodeByAddress function