# Customized Autocomplete

This package can be used in your react applications for autocomplete search

This package uses standard mui autocomplete of react.

## Installation

You can use standart npm package installation

```bash
npm i customized-autocomplete
```

## Usage

```react
import CustomizedAutocomplete from 'customized-autocomplete';

//...

  render() {
    return (
	  
      <React.Fragment>
		//your other html here
        <CustomizedAutocomplete
          //..........
        />
		//your other html here
      </React.Fragment>
    );
  }
}


```
## Parameters

| Parameter                        			 |Required| Default Value        | Description                |
| -----------                      			 | ------ | --------------       | -----------                |
|  selectedValue                             | true   | -                    | selection value of the autocomplete |
|  handleChange                              | true   | -                    | when selection is made this function is triggered. Ex. Format : (event, selection) => { console.log(event,selection); } |
|  selectionType                             | false  | "api"                | define whether data is supplied statically or from an api method. can be either "api" or "static" |
|  optionApiMethod                           | vary   | -                    | when selectionType is "api" this method must be supplied from an api method. return type is list of {value,label} pair. |
|  optionData                                | vary   | -                    | when selectionType is "static" this parameter must be supplied as list of {value,label} pair |
|  onBlur                                    | false  | null                 | will be triggered after onBlur event Ex. Usage : (fieldName,e) => {console.log(fieldName,i)}|
|  error                                     | false  | null                 | can be used as validation for autocomplete. do not supply if validation is not needed |
|  touched                                   | false  | null                 | can be used as validation for autocomplete. do not supply if validation is not needed |
|  fieldName                                 | true   | -                    | name of the value will be set from parent component |
|  noOptionsText                             | true   | -                    | text will appear when no options are available |
|  inputLabel                                | true   | -                    | input label appear in top of the component |
|  setStopBlocking                           | false  | null                 | define whehter ui blocking will be applied when searching |
|  loadOptionsAfterSelection                 | false  | false                | define whehter options will be reloaded after a selection is made |
|  clearOnNull                               | false  | false                | define whehter input should be cleared when selection value is set to null by parent component |
|  inputName                               | false  | "secim"                | the name of the text input inside the autocomplete |
## License
[MIT](https //choosealicense.com/licenses/mit/)