From 3e2ca6f11045f1dd2947d05e190ef308c17dcb5c Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 20:00:10 +0200
Subject: [PATCH 1/8] On option selected clear the input filed value

Basic Typeahead ** Customized to my usage **

On option selected clear the input filed value

Edit: _onOptionSelected function
---
 src/typeahead/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/typeahead/index.js b/src/typeahead/index.js
index 7e231041..88a5f503 100644
--- a/src/typeahead/index.js
+++ b/src/typeahead/index.js
@@ -202,7 +202,7 @@ var Typeahead = createReactClass({
     nEntry.value = optionString;
     this.setState({searchResults: this.getOptionsForValue(optionString, this.props.options),
                    selection: formInputOptionString,
-                   entryValue: optionString,
+                   entryValue: '',
                    showResults: false});
     return this.props.onOptionSelected(option, event);
   },

From afa22c303b4b4ab26b676173f655a8011de5f910 Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 22:32:31 +0200
Subject: [PATCH 2/8] Tables for Typeahead and Tokenizer props'

---
 README.md | 205 +++++++++++++++---------------------------------------
 1 file changed, 56 insertions(+), 149 deletions(-)

diff --git a/README.md b/README.md
index 733abc66..6e031a38 100644
--- a/README.md
+++ b/README.md
@@ -55,124 +55,89 @@ Type: React Component
 
 Basic typeahead input and results list.
 
-#### props.options
-
-Type: `Array`
+Typeahead(props) | Description
+------------ | -------------
+#### props.options | Type: `Array`
 Default: []
 
 An array supplied to the filtering function. Can be a list of strings or a list of arbitrary objects. In the latter case, `filterOption` and `displayOption` should be provided.
 
-#### props.defaultValue
-
-Type: `String`
+#### props.defaultValue | Type: `String`
 
 A default value used when the component has no value. If it matches any options a option list will show.
 
-#### props.value
-
-Type: `String`
+#### props.value | Type: `String`
 
 Specify a value for the text input.
 
-#### props.maxVisible
-
-Type: `Number`
+#### props.maxVisible | Type: `Number`
 
 Limit the number of options rendered in the results list.
 
-#### props.resultsTruncatedMessage
-
-Type: `String`
+#### props.resultsTruncatedMessage | Type: `String`
 
 If `maxVisible` is set, display this custom message at the bottom of the list of results when the result are truncated.
 
-#### props.customClasses
-
-Type: `Object`
+#### props.customClasses | Type: `Object`
 Allowed Keys: `input`, `results`, `listItem`, `listAnchor`, `hover`, `typeahead`, `resultsTruncated`
 
 An object containing custom class names for child elements. Useful for
 integrating with 3rd party UI kits.
 
-#### props.placeholder
-
+#### props.placeholder | 
 Type: `String`
 
 Placeholder text for the typeahead input.
 
-#### props.disabled
-
-Type: `Boolean`
+#### props.disabled | Type: `Boolean`
 
 Set to `true` to add disable attribute in the `<input>` or `<textarea>` element
 
-#### props.textarea
-
-Type: `Boolean`
+#### props.textarea | Type: `Boolean`
 
 Set to `true` to use a `<textarea>` element rather than an `<input>` element
 
-#### props.inputProps
-
-Type: `Object`
+#### props.inputProps | Type: `Object`
 
 Props to pass directly to the `<input>` element.
 
-#### props.onKeyDown
-
-Type: `Function`
+#### props.onKeyDown | Type: `Function`
 
 Event handler for the `keyDown` event on the typeahead input.
 
-#### props.onKeyPress
-
-Type: `Function`
+#### props.onKeyPress | Type: `Function`
 
 Event handler for the `keyPress` event on the typeahead input.
 
-#### props.onKeyUp
-
-Type: `Function`
+#### props.onKeyUp | Type: `Function`
 
 Event handler for the `keyUp` event on the typeahead input.
 
-#### props.onBlur
-
-Type: `Function`
+#### props.onBlur | Type: `Function`
 
 Event handler for the `blur` event on the typeahead input.
 
-#### props.onFocus
-
-Type: `Function`
+#### props.onFocus | Type: `Function`
 
 Event handler for the `focus` event on the typeahead input.
 
-#### props.onOptionSelected
-
-Type: `Function`
+#### props.onOptionSelected | Type: `Function`
 
 Event handler triggered whenever a user picks an option.
 
-#### props.filterOption
-
-Type: `String` or `Function`
+#### props.filterOption | Type: `String` or `Function`
 
 A function to filter the provided `options` based on the current input value. For each option, receives `(inputValue, option)`. If not supplied, defaults to [fuzzy string matching](https://github.com/mattyork/fuzzy).
 
 If provided as a string, it will interpret it as a field name and fuzzy filter on that field of each option object.
 
-#### props.displayOption
-
-Type: `String` or `Function`
+#### props.displayOption | Type: `String` or `Function`
 
 A function to map an option onto a string for display in the list. Receives `(option, index)` where index is relative to the results list, not all the options. Must return a string.
 
 If provided as a string, it will interpret it as a field name and use that field from each option object.
 
-#### props.formInputOption
-
-Type: `String` or `Function`
+#### props.formInputOption | 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.
 
@@ -182,16 +147,12 @@ If not specified, it will fall back onto the semantics described in `props.displ
 
 This option is ignored if you don't specify the `name` prop. It is required if you both specify the `name` prop and are using non-string options. It is optional otherwise.
 
-#### props.defaultClassNames
-
-Type: `boolean`
+#### props.defaultClassNames | Type: `boolean`
 Default: true
 
 If false, the default classNames are removed from the typeahead.
 
-#### props.customListComponent
-
-Type: `React Component`
+#### props.customListComponent | Type: `React Component`
 
 A React Component that renders the list of typeahead results. This replaces the default list of results.
 
@@ -209,24 +170,18 @@ This component receives the following props :
 - `props.selectionIndex`
   - The index of the highlighted option for rendering
 
-#### props.showOptionsWhenEmpty
-
-Type: `boolean`
+#### props.showOptionsWhenEmpty | Type: `boolean`
 Default: false
 
 If true, options will still be rendered when there is no value.
 
-#### props.allowCustomValues
-
-Type: `boolean`
+#### props.allowCustomValues | Type: `boolean`
 
 If true, custom tags can be added without a matching typeahead selection
 
-### Typeahead ([Exposed Component Functions][reactecf])
-
-#### typeahead.focus
+#### typeahead.focus | Focuses the typeahead input.
 
-Focuses the typeahead input.
+### Typeahead | ([Exposed Component Functions][reactecf])
 
 ---
 
@@ -236,126 +191,90 @@ Type: React Component
 
 Typeahead component that allows for multiple options to be selected.
 
-#### props.options
-
-Type: `Array`
+Tokenizer(props) | Description
+------------ | -------------
+#### props.options | Type: `Array`
 Default: []
 
 An array supplied to the filter function.
 
-#### props.maxVisible
-
-Type: `Number`
+#### props.maxVisible | Type: `Number`
 
 Limit the number of options rendered in the results list.
 
-#### props.resultsTruncatedMessage
-
-Type: `String`
+#### props.resultsTruncatedMessage | Type: `String`
 
 If `maxVisible` is set, display this custom message at the bottom of the list of results when the result are truncated.
 
-#### props.name
-
-Type: `String`
+#### props.name | Type: `String`
 
 The name for HTML forms to be used for submitting the tokens' values array.
 
-#### props.customClasses
-
-Type: `Object`
+#### props.customClasses | Type: `Object`
 Allowed Keys: `input`, `results`, `listItem`, `listAnchor`, `hover`, `typeahead`, `resultsTruncated`, `token`
 
 An object containing custom class names for child elements. Useful for
 integrating with 3rd party UI kits.
 
-#### props.placeholder
-
-Type: `String`
+#### props.placeholder | Type: `String`
 
 Placeholder text for the typeahead input.
 
-#### props.disabled
-
-Type: `Boolean`
+#### props.disabled | Type: `Boolean`
 
 Set to `true` to add disable attribute in the `<input>` or `<textarea>` element
 
-#### props.inputProps
-
-Type: `Object`
+#### props.inputProps | Type: `Object`
 
 Props to pass directly to the `<input>` element.
 
-#### props.onKeyDown
-
-Type: `Function`
+#### props.onKeyDown | Type: `Function`
 
 Event handler for the `keyDown` event on the typeahead input.
 
-#### props.onKeyPress
-
-Type: `Function`
+#### props.onKeyPress | Type: `Function`
 
 Event handler for the `keyPress` event on the typeahead input.
 
-#### props.onKeyUp
-
-Type: `Function`
+#### props.onKeyUp | Type: `Function`
 
 Event handler for the `keyUp` event on the typeahead input.
 
-#### props.onBlur
-
-Type: `Function`
+#### props.onBlur | Type: `Function`
 
 Event handler for the `blur` event on the typeahead input.
 
-#### props.onFocus
-
-Type: `Function`
+#### props.onFocus | Type: `Function`
 
 Event handler for the `focus` event on the typeahead input.
 
-#### props.defaultSelected
-
-Type: `Array`
+#### props.defaultSelected | Type: `Array`
 
 A set of values of tokens to be loaded on first render.
 
-#### props.onTokenRemove
-
-Type: `Function`
+#### props.onTokenRemove | Type: `Function`
 Params: `(removedToken)`
 
 Event handler triggered whenever a token is removed.
 
-#### props.onTokenAdd
-
-Type: `Function`
+#### props.onTokenAdd | Type: `Function`
 Params: `(addedToken)`
 
 Event handler triggered whenever a token is added.
 
-#### props.displayOption
-
-Type: `String` or `Function`
+#### props.displayOption | Type: `String` or `Function`
 
 A function to map an option onto a string for display in the list. Receives `(option, index)` where index is relative to the results list, not all the options. Can either return a string or a React component.
 
 If provided as a string, it will interpret it as a field name and use that field from each option object.
 
-#### props.filterOption
-
-Type: `String` or `Function`
+#### props.filterOption | Type: `String` or `Function`
 
 A function to filter the provided `options` based on the current input value. For each option, receives `(inputValue, option)`. If not supplied, defaults to [fuzzy string matching](https://github.com/mattyork/fuzzy).
 
 If provided as a string, it will interpret it as a field name and use that field from each option object.
 
-#### props.searchOptions
-
-Type: `Function`
+#### props.searchOptions | Type: `Function`
 
 A function to filter, map, and/or sort the provided `options` based on the current input value.
 Receives `(inputValue, options)`.
@@ -364,9 +283,7 @@ If not supplied, defaults to [fuzzy string matching](https://github.com/mattyork
 Note: the function can be used to store other information besides the string in the internal state of the component.
 Make sure to use the `displayOption`, `inputDisplayOption`, and `formInputOption` props to extract/generate the correct format of data that each expects if you do this.
 
-#### props.inputDisplayOption
-
-Type: `String` or `Function`
+#### props.inputDisplayOption | 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 visible input when an option is selected.
 
@@ -376,9 +293,7 @@ If provided as a string, it will interpret it as a field name and use that field
 
 If no value is set, the input will be set using `displayOption` when an option is selected.
 
-#### props.formInputOption
-
-Type: `String` or `Function`
+#### props.formInputOption | Type: `String` or `Function`
 
 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.
 
@@ -386,32 +301,24 @@ If specified as a string, it will interpret it as a field name and use that fiel
 
 If not specified, it will fall back onto the semantics described in `props.displayOption`.
 
-#### props.defaultClassNames
-
-Type: `boolean`
+#### props.defaultClassNames | Type: `boolean`
 Default: true
 
 If false, the default classNames are removed from the tokenizer and the typeahead.
 
-#### props.showOptionsWhenEmpty
-
-Type: `boolean`
+#### props.showOptionsWhenEmpty | Type: `boolean`
 Default: false
 
 If true, options will still be rendered when there is no value.
 
-### Tokenizer ([Exposed Component Functions][reactecf])
-
-#### tokenizer.focus
-
-Focuses the tokenizer input.
+#### tokenizer.focus | Focuses the tokenizer input.
 
-#### tokenizer.getSelectedTokens
-
-Type: `Function`
+#### tokenizer.getSelectedTokens | Type: `Function`
 
 A function to return the currently selected tokens.
 
+### Tokenizer ([Exposed Component Functions][reactecf])
+
 ## Developing
 
 ### Setting Up

From 5f20fa3771454992d543a5e76f7128bebfd58fbf Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 22:41:46 +0200
Subject: [PATCH 3/8] testing table edits

---
 README.md | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 6e031a38..6d968129 100644
--- a/README.md
+++ b/README.md
@@ -57,22 +57,23 @@ Basic typeahead input and results list.
 
 Typeahead(props) | Description
 ------------ | -------------
+|
 #### props.options | Type: `Array`
 Default: []
 
-An array supplied to the filtering function. Can be a list of strings or a list of arbitrary objects. In the latter case, `filterOption` and `displayOption` should be provided.
-
+An array supplied to the filtering function. Can be a list of strings or a list of arbitrary objects. In the latter case, `filterOption` and `displayOption` should be provided.|
+|
 #### props.defaultValue | Type: `String`
 
-A default value used when the component has no value. If it matches any options a option list will show.
-
+A default value used when the component has no value. If it matches any options a option list will show.|
+|
 #### props.value | Type: `String`
 
-Specify a value for the text input.
-
+Specify a value for the text input.|
+|
 #### props.maxVisible | Type: `Number`
 
-Limit the number of options rendered in the results list.
+Limit the number of options rendered in the results list.|
 
 #### props.resultsTruncatedMessage | Type: `String`
 

From 8d58cda72265f38df5a936e46920211848eebafe Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 22:46:38 +0200
Subject: [PATCH 4/8] test table2

---
 README.md | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index 6d968129..53d69d8e 100644
--- a/README.md
+++ b/README.md
@@ -57,12 +57,12 @@ Basic typeahead input and results list.
 
 Typeahead(props) | Description
 ------------ | -------------
-|
-#### props.options | Type: `Array`
-Default: []
 
-An array supplied to the filtering function. Can be a list of strings or a list of arbitrary objects. In the latter case, `filterOption` and `displayOption` should be provided.|
-|
+| = #### props.options | Type: `Array` =
+== Default: [] ==
+===An array supplied to the filtering function. Can be a list of strings or a list of arbitrary objects.===
+====In the latter case,`filterOption` and `displayOption` should be provided.====|
+
 #### props.defaultValue | Type: `String`
 
 A default value used when the component has no value. If it matches any options a option list will show.|

From adc7a9c3ea4e566f2910959d2c24d7170b4cb149 Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 23:01:33 +0200
Subject: [PATCH 5/8] typeahead brief table

---
 README.md | 219 +++++++++++++++++++++++++++---------------------------
 1 file changed, 110 insertions(+), 109 deletions(-)

diff --git a/README.md b/README.md
index 53d69d8e..2cc6e7a3 100644
--- a/README.md
+++ b/README.md
@@ -55,132 +55,133 @@ Type: React Component
 
 Basic typeahead input and results list.
 
-Typeahead(props) | Description
------------- | -------------
-
-| = #### props.options | Type: `Array` =
-== Default: [] ==
-===An array supplied to the filtering function. Can be a list of strings or a list of arbitrary objects.===
-====In the latter case,`filterOption` and `displayOption` should be provided.====|
-
-#### props.defaultValue | Type: `String`
+Typeahead(props) | Type
+------------ | ------------
+| props.options  | Type: `Array` |
+| Type: `Array` | Type: `String` |
+| props.value | Type: `String` |
+| props.maxVisible | Type: `Number`|
+| props.resultsTruncatedMessage | Type: `Number`|
+| props.resultsTruncatedMessage  | Type: `String`|
+
+#### props.options 
+Type: `Array` 
+Default: []
+An array supplied to the filtering function. Can be a list of strings or a list of arbitrary objects.
+in the latter case,`filterOption` and `displayOption` should be provided.
 
+#### props.defaultValue  
+Type: `String`
 A default value used when the component has no value. If it matches any options a option list will show.|
-|
-#### props.value | Type: `String`
 
-Specify a value for the text input.|
-|
-#### props.maxVisible | Type: `Number`
+#### props.value 
+Type: `String`
+Specify a value for the text input.
 
+#### props.maxVisible 
+Type: `Number`
 Limit the number of options rendered in the results list.|
 
-#### props.resultsTruncatedMessage | Type: `String`
-
+#### props.resultsTruncatedMessage 
+Type: `String`
 If `maxVisible` is set, display this custom message at the bottom of the list of results when the result are truncated.
 
-#### props.customClasses | Type: `Object`
+#### props.customClasses 
+Type: `Object`
 Allowed Keys: `input`, `results`, `listItem`, `listAnchor`, `hover`, `typeahead`, `resultsTruncated`
-
 An object containing custom class names for child elements. Useful for
 integrating with 3rd party UI kits.
 
-#### props.placeholder | 
+#### props.placeholder 
 Type: `String`
-
 Placeholder text for the typeahead input.
 
-#### props.disabled | Type: `Boolean`
-
+#### props.disabled 
+Type: `Boolean`
 Set to `true` to add disable attribute in the `<input>` or `<textarea>` element
 
-#### props.textarea | Type: `Boolean`
-
+#### props.textarea 
+Type: `Boolean`
 Set to `true` to use a `<textarea>` element rather than an `<input>` element
 
-#### props.inputProps | Type: `Object`
-
+#### props.inputProps 
+Type: `Object`
 Props to pass directly to the `<input>` element.
 
-#### props.onKeyDown | Type: `Function`
-
+#### props.onKeyDown 
+Type: `Function`
 Event handler for the `keyDown` event on the typeahead input.
 
-#### props.onKeyPress | Type: `Function`
-
+#### props.onKeyPress 
+Type: `Function`
 Event handler for the `keyPress` event on the typeahead input.
 
-#### props.onKeyUp | Type: `Function`
-
+#### props.onKeyUp 
+Type: `Function`
 Event handler for the `keyUp` event on the typeahead input.
 
-#### props.onBlur | Type: `Function`
-
+#### props.onBlur 
+Type: `Function`
 Event handler for the `blur` event on the typeahead input.
 
-#### props.onFocus | Type: `Function`
-
+#### props.onFocus 
+Type: `Function`
 Event handler for the `focus` event on the typeahead input.
 
-#### props.onOptionSelected | Type: `Function`
-
+#### props.onOptionSelected 
+Type: `Function`
 Event handler triggered whenever a user picks an option.
 
-#### props.filterOption | Type: `String` or `Function`
-
+#### props.filterOption 
+Type: `String` or `Function`
 A function to filter the provided `options` based on the current input value. For each option, receives `(inputValue, option)`. If not supplied, defaults to [fuzzy string matching](https://github.com/mattyork/fuzzy).
-
 If provided as a string, it will interpret it as a field name and fuzzy filter on that field of each option object.
 
-#### props.displayOption | Type: `String` or `Function`
-
+#### props.displayOption 
+Type: `String` or `Function`
 A function to map an option onto a string for display in the list. Receives `(option, index)` where index is relative to the results list, not all the options. Must return a string.
-
 If provided as a string, it will interpret it as a field name and use that field from each option object.
 
-#### props.formInputOption | Type: `String` or `Function`
+#### props.formInputOption 
 
+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.
 
 If specified as a string, it will interpret it as a field name and use that field from each option object.
-
 If not specified, it will fall back onto the semantics described in `props.displayOption`.
 
 This option is ignored if you don't specify the `name` prop. It is required if you both specify the `name` prop and are using non-string options. It is optional otherwise.
 
-#### props.defaultClassNames | Type: `boolean`
+#### props.defaultClassNames 
+Type: `boolean`
 Default: true
-
 If false, the default classNames are removed from the typeahead.
 
-#### props.customListComponent | Type: `React Component`
-
+#### props.customListComponent 
+Type: `React Component`
 A React Component that renders the list of typeahead results. This replaces the default list of results.
-
 This component receives the following props :
 
 ##### Passed through
-
 - `props.displayOptions`
 - `props.customClasses`
 - `props.onOptionSelected`
-
 ##### Created or modified
 - `props.options`
   - This is the Typeahead's `props.options` filtered and limited to `Typeahead.props.maxVisible`.
 - `props.selectionIndex`
   - The index of the highlighted option for rendering
-
-#### props.showOptionsWhenEmpty | Type: `boolean`
+  
+#### props.showOptionsWhenEmpty 
+Type: `boolean`
 Default: false
-
 If true, options will still be rendered when there is no value.
 
-#### props.allowCustomValues | Type: `boolean`
-
+#### props.allowCustomValues 
+Type: `boolean`
 If true, custom tags can be added without a matching typeahead selection
-
-#### typeahead.focus | Focuses the typeahead input.
+#### typeahead.focus 
+Focuses the typeahead input.
 
 ### Typeahead | ([Exposed Component Functions][reactecf])
 
@@ -194,68 +195,70 @@ Typeahead component that allows for multiple options to be selected.
 
 Tokenizer(props) | Description
 ------------ | -------------
-#### props.options | Type: `Array`
-Default: []
 
+#### props.options 
+Type: `Array`
+Default: []
 An array supplied to the filter function.
 
-#### props.maxVisible | Type: `Number`
-
+#### props.maxVisible 
+Type: `Number`
 Limit the number of options rendered in the results list.
 
-#### props.resultsTruncatedMessage | Type: `String`
-
+#### props.resultsTruncatedMessage 
+Type: `String`
 If `maxVisible` is set, display this custom message at the bottom of the list of results when the result are truncated.
 
-#### props.name | Type: `String`
-
+#### props.name  
+Type: `String`
 The name for HTML forms to be used for submitting the tokens' values array.
 
-#### props.customClasses | Type: `Object`
+#### props.customClasses 
+Type: `Object`
 Allowed Keys: `input`, `results`, `listItem`, `listAnchor`, `hover`, `typeahead`, `resultsTruncated`, `token`
 
 An object containing custom class names for child elements. Useful for
 integrating with 3rd party UI kits.
 
-#### props.placeholder | Type: `String`
-
+#### props.placeholder 
+Type: `String`
 Placeholder text for the typeahead input.
 
-#### props.disabled | Type: `Boolean`
-
+#### props.disabled 
+Type: `Boolean`
 Set to `true` to add disable attribute in the `<input>` or `<textarea>` element
 
-#### props.inputProps | Type: `Object`
-
+#### props.inputProps 
+Type: `Object`
 Props to pass directly to the `<input>` element.
 
-#### props.onKeyDown | Type: `Function`
-
+#### props.onKeyDown 
+Type: `Function`
 Event handler for the `keyDown` event on the typeahead input.
 
-#### props.onKeyPress | Type: `Function`
-
+#### props.onKeyPress
+Type: `Function`
 Event handler for the `keyPress` event on the typeahead input.
 
-#### props.onKeyUp | Type: `Function`
-
+#### props.onKeyUp 
+Type: `Function`
 Event handler for the `keyUp` event on the typeahead input.
 
-#### props.onBlur | Type: `Function`
-
+#### props.onBlur 
+Type: `Function`
 Event handler for the `blur` event on the typeahead input.
 
-#### props.onFocus | Type: `Function`
-
+#### props.onFocus 
+Type: `Function`
 Event handler for the `focus` event on the typeahead input.
 
-#### props.defaultSelected | Type: `Array`
-
+#### props.defaultSelected 
+Type: `Array`
 A set of values of tokens to be loaded on first render.
 
-#### props.onTokenRemove | Type: `Function`
+#### props.onTokenRemove 
+Type: `Function`
 Params: `(removedToken)`
-
 Event handler triggered whenever a token is removed.
 
 #### props.onTokenAdd | Type: `Function`
@@ -263,20 +266,20 @@ Params: `(addedToken)`
 
 Event handler triggered whenever a token is added.
 
-#### props.displayOption | Type: `String` or `Function`
-
+#### props.displayOption 
+Type: `String` or `Function`
 A function to map an option onto a string for display in the list. Receives `(option, index)` where index is relative to the results list, not all the options. Can either return a string or a React component.
 
 If provided as a string, it will interpret it as a field name and use that field from each option object.
 
-#### props.filterOption | Type: `String` or `Function`
-
+#### props.filterOption 
+Type: `String` or `Function`
 A function to filter the provided `options` based on the current input value. For each option, receives `(inputValue, option)`. If not supplied, defaults to [fuzzy string matching](https://github.com/mattyork/fuzzy).
 
 If provided as a string, it will interpret it as a field name and use that field from each option object.
 
-#### props.searchOptions | Type: `Function`
-
+#### props.searchOptions 
+Type: `Function`
 A function to filter, map, and/or sort the provided `options` based on the current input value.
 Receives `(inputValue, options)`.
 If not supplied, defaults to [fuzzy string matching](https://github.com/mattyork/fuzzy).
@@ -284,38 +287,36 @@ If not supplied, defaults to [fuzzy string matching](https://github.com/mattyork
 Note: the function can be used to store other information besides the string in the internal state of the component.
 Make sure to use the `displayOption`, `inputDisplayOption`, and `formInputOption` props to extract/generate the correct format of data that each expects if you do this.
 
-#### props.inputDisplayOption | Type: `String` or `Function`
-
+#### props.inputDisplayOption 
+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 visible input when an option is selected.
-
 Receives `(option)`.
 
 If provided as a string, it will interpret it as a field name and use that field from each option object.
-
 If no value is set, the input will be set using `displayOption` when an option is selected.
 
-#### props.formInputOption | Type: `String` or `Function`
-
+#### props.formInputOption 
+Type: `String` or `Function`
 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.
-
 If not specified, it will fall back onto the semantics described in `props.displayOption`.
 
-#### props.defaultClassNames | Type: `boolean`
+#### props.defaultClassNames 
+Type: `boolean`
 Default: true
-
 If false, the default classNames are removed from the tokenizer and the typeahead.
 
-#### props.showOptionsWhenEmpty | Type: `boolean`
+#### props.showOptionsWhenEmpty 
+Type: `boolean`
 Default: false
-
 If true, options will still be rendered when there is no value.
 
-#### tokenizer.focus | Focuses the tokenizer input.
-
-#### tokenizer.getSelectedTokens | Type: `Function`
+#### tokenizer.focus 
+Focuses the tokenizer input.
 
+#### tokenizer.getSelectedTokens 
+Type: `Function`
 A function to return the currently selected tokens.
 
 ### Tokenizer ([Exposed Component Functions][reactecf])

From 72a0a79f722010c97c0899abe0299ccf5da94f17 Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 23:15:02 +0200
Subject: [PATCH 6/8] typeahead props table is done

---
 README.md | 31 +++++++++++++++++++++++++------
 1 file changed, 25 insertions(+), 6 deletions(-)

diff --git a/README.md b/README.md
index 2cc6e7a3..036ef383 100644
--- a/README.md
+++ b/README.md
@@ -57,12 +57,31 @@ Basic typeahead input and results list.
 
 Typeahead(props) | Type
 ------------ | ------------
-| props.options  | Type: `Array` |
-| Type: `Array` | Type: `String` |
-| props.value | Type: `String` |
-| props.maxVisible | Type: `Number`|
-| props.resultsTruncatedMessage | Type: `Number`|
-| props.resultsTruncatedMessage  | Type: `String`|
+| options  | Type: Array |
+| defaultValue  | Type: String |
+| value | Type: String |
+| maxVisible | Type: Number|
+| resultsTruncatedMessage | Type: Number|
+| resultsTruncatedMessage  | Type: String|
+| customClasse | Type: Object |
+| placeholder | Type : String |
+| disabled | Type: Boolean |
+| textarea | Type: Boolean |
+| inputProps | Type: Object|
+| onKeyDown | Type: Function|
+| onKeyPress | Type: Function |
+| onKeyUp | Type: Function|
+| onBlur|Type: Function |
+| onFocus | Type: Function|
+| onOptionSelected | Type: Function|
+| filterOption | Type: String or Function |
+| displayOption | Type: String or Function |
+| formInputOption | Type: String or Function |
+| defaultClassNames | Type: Boolean |
+| customListComponent | Type: React Component |
+| showOptionsWhenEmpty | Type: Boolean |
+| allowCustomValues  | Type: Boolean |
+
 
 #### props.options 
 Type: `Array` 

From ef8ae8537eaa9d00095b70e71139ca6ed7d55ec6 Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 23:31:03 +0200
Subject: [PATCH 7/8] brief props table added to Typeahead & Tokenizer

---
 README.md | 75 ++++++++++++++++++++++++++++++++++++-------------------
 1 file changed, 49 insertions(+), 26 deletions(-)

diff --git a/README.md b/README.md
index 036ef383..4c255a7b 100644
--- a/README.md
+++ b/README.md
@@ -57,30 +57,29 @@ Basic typeahead input and results list.
 
 Typeahead(props) | Type
 ------------ | ------------
-| options  | Type: Array |
-| defaultValue  | Type: String |
-| value | Type: String |
-| maxVisible | Type: Number|
-| resultsTruncatedMessage | Type: Number|
-| resultsTruncatedMessage  | Type: String|
-| customClasse | Type: Object |
-| placeholder | Type : String |
-| disabled | Type: Boolean |
-| textarea | Type: Boolean |
-| inputProps | Type: Object|
-| onKeyDown | Type: Function|
-| onKeyPress | Type: Function |
-| onKeyUp | Type: Function|
-| onBlur|Type: Function |
-| onFocus | Type: Function|
-| onOptionSelected | Type: Function|
-| filterOption | Type: String or Function |
-| displayOption | Type: String or Function |
-| formInputOption | Type: String or Function |
-| defaultClassNames | Type: Boolean |
-| customListComponent | Type: React Component |
-| showOptionsWhenEmpty | Type: Boolean |
-| allowCustomValues  | Type: Boolean |
+| options  |  Array |
+| defaultValue  |String |
+| value |  String |
+| maxVisible |  Number|
+| resultsTruncatedMessage  |  String|
+| customClasse |  Object |
+| placeholder |  String |
+| disabled |  Boolean |
+| textarea |  Boolean |
+| inputProps | Object|
+| onKeyDown |  Function|
+| onKeyPress | Function |
+| onKeyUp |  Function|
+| onBlur| Function |
+| onFocus |  Function|
+| onOptionSelected |  Function|
+| filterOption |  String or Function |
+| displayOption |  String or Function |
+| formInputOption |  String or Function |
+| defaultClassNames | Boolean |
+| customListComponent | React Component |
+| showOptionsWhenEmpty | Boolean |
+| allowCustomValues  | Boolean |
 
 
 #### props.options 
@@ -212,8 +211,32 @@ Type: React Component
 
 Typeahead component that allows for multiple options to be selected.
 
-Tokenizer(props) | Description
------------- | -------------
+Typeahead(props) | Type
+------------ | ------------
+| options  |  Array |
+| maxVisible | Number |
+| resultsTruncatedMessage  |  String|
+| name | String|
+| customClasse |  Object |
+| placeholder |  String |
+| disabled |  Boolean |
+| inputProps | Object|
+| onKeyDown |  Function|
+| onKeyPress | Function |
+| onKeyUp |  Function|
+| onBlur| Function |
+| onFocus |  Function|
+| defaultSelected | Array |
+| onTokenRemove | Function |
+| onTokenAdd | Function |
+| displayOption | String or Function |
+| filterOption | String or Function |
+| searchOptions | Function |
+| inputDisplayOption | String or Function |
+| formInputOption | String or Function |
+| defaultClassNames | Boolean |
+| showOptionsWhenEmpty | Boolean |
+| getSelectedTokens | Function |
 
 #### props.options 
 Type: `Array`

From ebcda225434f893e3792f4cbcbb42bdc86069b48 Mon Sep 17 00:00:00 2001
From: okasha93 <okasha.fci@gmail.com>
Date: Wed, 25 Apr 2018 23:32:38 +0200
Subject: [PATCH 8/8] Small Edit

---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 4c255a7b..07a429da 100644
--- a/README.md
+++ b/README.md
@@ -55,7 +55,7 @@ Type: React Component
 
 Basic typeahead input and results list.
 
-Typeahead(props) | Type
+Typeahead (props) | Type
 ------------ | ------------
 | options  |  Array |
 | defaultValue  |String |
@@ -211,7 +211,7 @@ Type: React Component
 
 Typeahead component that allows for multiple options to be selected.
 
-Typeahead(props) | Type
+Typeahead (props) | Type
 ------------ | ------------
 | options  |  Array |
 | maxVisible | Number |