React Batch Autocomplete Lib
React component for easily use React Batch Autocomplete
Getting started
Install the latest version:
npm install --save @batchservice/react-batch-autocomplete-lib
or
yarn add @batchservice/react-batch-autocomplete-lib
Use the component!
import React from 'react';
import { ReactBatchAutocomplete } from '@batchservice/react-batch-autocomplete-lib';
const Component = () => (
// Recent search data should be in below format
const recentSearch = [
{"name": '8300 Apple'},
{"name": 'Apple St'},
{"name": '89001 Alamo'},
{"name": '58651 Rhame'}
]
const handleError = (e) => {
// Handle error as you want
console.log('Error while searching: ',e);
}
const suggestionList = (data) => {
// Suggestion list data
console.log('Suggetion List: ', data);
}
const onSelect = (data) => {
// Do Your Execution with data
console.log('Seleted item: ', data)
}
return(
<div>
<ReactBatchAutocomplete
placeholder="Enter your address"
notFoundText="Not found data"
debounce = "700"
apiKey="BATCH_API_KEY"
domainServer="BATCH_DOMAIN_SERVER"
recentSearch ={recentSearch}
handleError={(e) => handleError(e)}
suggestionList={(data) => suggestionList(data)}
onSelect={(data) => onSelect(data)}
displayData="name"
showNotFound={true}
take={5}
filterType={['address', 'formatted-street', 'zip']}
/>
</div>
);
);
export default Component;
- Here recentSearch is fully optional.
- Here displayData is fully optional.Acceptable value for it are
name
,city
,address
,state
,zip
. Defulat Value isname
. - Here showNotFound is fully optional. It accepts
true
/false
. - Here take is fully optional. Default value is 5.
- Here filterType is optional, In filterType you can pass this below option only :
['address', 'formatted-street', 'zip', 'building', 'city', 'locality', 'county', 'state']
A logger accepts the following parameters:
React Version | Package Version | Description |
---|---|---|
React <=17 | 1.0.9 |
This version will run if react version is below 18. |
Reacr >=18 | 2.0.0 |
This version will run if react version is above 18. |