We want you to create a react app that has an input. As a user types characters into the input, below the input display the matches to select. A match should occor when a user types characters that match with the beginning of the characters of a word in the word list. Don't worry about fuzzy search.
Feel free to ask any questions about the task and use your resources, there is no penalty for Googling.
-
When a user types characters in the input it should compare the user's typed characters to an array of values and display the values that are potential matches.
-
When there user has not typed any characters in the input, there should be no matches displaying below the input.
-
When there are characters that match words in the matches array, a user should be able to click the displayed word to fill in the input value.
Example static words (some words should have the same starting characters):
['Hollow Knight', 'Celeste', 'Castle Crashers', 'Killer Queen', 'Undertale', 'Cuphead']
Bonus 1: When a word is not found in the array, display a button to add the new word to the array used for searching matches.
Bonus 2: Allow a user to tab through matches and hit return/enter key to select those matches and update the input value.