react-autocomplete-input

Live demo: https://react-autocomplete-input.netlify.app/

• Input with autocomplete feature, built with react and styled-components;
• Build with combobox accessibility in mind;
• Has support of virtual list, so it can handle very long list of options;
• Bootsrapped with create-react-app, typescript and storybook.

Available Scripts

In the project directory, you can run:

yarn storybook

Starts storybook in the development mode with hot-reload.
Open http://localhost:6006 to view it in the browser.

yarn build-storybook

Builds storybook in production mode.
Static build is available inside /storybook-static directory.

Notes and limitations

• No UI library has been used on a purpose
• Whole UI is simplified on a purpose as well
• No support for custom render props (like in downshift)
• Dropdown is always displayed at the bottom of the input
  • Positioning library like popperjs can be used to display at top/bottom
  • Open/close animations for dropdown could be added as well
• Lots of properties are not implemented on purpose, like controlling menu state or rendering option item
• Not optimized for touch devices

---

This project was bootstrapped with Create React App and Storybook.