# react-bootstrap-typeahead > React typeahead with Bootstrap styling Latest version **6.4.1** (published 2025-03-19) · MIT license · 0 weekly downloads ## Install ```sh npm install react-bootstrap-typeahead pnpm add react-bootstrap-typeahead yarn add react-bootstrap-typeahead bun add react-bootstrap-typeahead ``` ## Health **Score 50/100 (C)** — status: stable. Positive: has types; esm support; no vulnerabilities; high quality score. Warnings: low downloads. Negative: stale. ## Facts | | | |---|---| | Version | 6.4.1 | | Published | 2025-03-19 | | First published | 2016-01-25 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Node | >=18.0.0 | | Dependencies | 11 | | Unpacked size | 830.2 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 1006 | | Author | ericgio | | Maintainers | ericgio | | Keywords | auto complete, auto suggest, auto-complete, auto-suggest, autocomplete, autosuggest, bootstrap, bootstrap tokenizer, bootstrap typeahead, bootstrap-tokenizer, bootstrap-typeahead, react, react autocomplete, react autosuggest, react tokenizer, react typeahead, react-autocomplete, react-autosuggest, react-bootstrap, react-bootstrap-tokenizer, react-bootstrap-typeahead, react-tokenizer, react-typeahead, tokenizer, typeahead | ## Links - npm: https://www.npmjs.com/package/react-bootstrap-typeahead - Repository: https://github.com/ericgio/react-bootstrap-typeahead - Homepage: http://ericgio.github.io/react-bootstrap-typeahead/ - Issues: https://github.com/ericgio/react-bootstrap-typeahead/issues - npm.io page: https://npm.io/package/react-bootstrap-typeahead ## Dependencies (11) - [warning](https://npm.io/package/warning.md) ^4.0.1 - [invariant](https://npm.io/package/invariant.md) ^2.2.1 - [classnames](https://npm.io/package/classnames.md) ^2.2.0 - [prop-types](https://npm.io/package/prop-types.md) ^15.5.8 - [@restart/ui](https://npm.io/package/@restart/ui.md) ^1.9.4 - [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.14.6 - [@restart/hooks](https://npm.io/package/@restart/hooks.md) ^0.4.0 - [fast-deep-equal](https://npm.io/package/fast-deep-equal.md) ^3.1.1 - [lodash.debounce](https://npm.io/package/lodash.debounce.md) ^4.0.8 - [@floating-ui/react-dom](https://npm.io/package/@floating-ui/react-dom.md) ^2.1.2 - [scroll-into-view-if-needed](https://npm.io/package/scroll-into-view-if-needed.md) ^3.1.0 ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 6.4.1 (latest) — 2025-03-19 - 7.0.0-rc.5 — 2025-02-22 - 7.0.0-rc.4 — 2025-02-05 - 7.0.0-rc.3 — 2025-02-04 - 7.0.0-rc.2 — 2025-02-02 - 7.0.0-rc.1 — 2025-01-30 - 6.4.0 — 2025-01-29 - 6.3.4 — 2024-11-30 - 6.3.3 — 2024-11-28 - 6.3.2 — 2023-10-31 - 6.3.1 — 2023-10-21 - 6.3.0 — 2023-10-20 - 6.2.3 — 2023-06-11 - 6.2.2 — 2023-05-18 - 6.2.1 — 2023-05-18 - … 167 more at https://npm.io/package/react-bootstrap-typeahead/versions ## README # React Bootstrap Typeahead A [React](https://reactjs.org/)-based typeahead that relies on [Bootstrap](https://getbootstrap.com/) for styling and was originally inspired by Twitter's [typeahead.js](https://github.com/twitter/typeahead.js). It supports both single- and multi-selection and is compliant with [WAI-ARIA authoring practices](https://www.w3.org/TR/wai-aria-practices-1.1/#combobox). Try the [live examples](http://ericgio.github.io/react-bootstrap-typeahead/). [![npm version](https://img.shields.io/npm/v/react-bootstrap-typeahead.svg?style=flat-square)](https://www.npmjs.com/package/react-bootstrap-typeahead) [![npm downloads](https://img.shields.io/npm/dm/react-bootstrap-typeahead.svg?style=flat-square)](https://www.npmjs.com/package/react-bootstrap-typeahead) [![CI](https://github.com/ericgio/react-bootstrap-typeahead/actions/workflows/ci.yml/badge.svg)](https://github.com/ericgio/react-bootstrap-typeahead/actions/workflows/ci.yml) [![Codecov](https://img.shields.io/codecov/c/github/ericgio/react-bootstrap-typeahead?label=Codecov&logo=codecov&style=flat-square)](https://app.codecov.io/gh/ericgio/react-bootstrap-typeahead/) [![MIT License](https://flat.badgen.net/github/license/ericgio/react-bootstrap-typeahead)](LICENSE.md) Please note that documentation and examples apply to the most recent release and may no longer be applicable if you're using an outdated version. ## Installation ``` npm install --save react-bootstrap-typeahead ``` or ``` yarn add react-bootstrap-typeahead ``` Include the module in your project: ```jsx import { Typeahead } from 'react-bootstrap-typeahead'; // ES2015 var Typeahead = require('react-bootstrap-typeahead').Typeahead; // CommonJS ``` #### UMD Build Development and production builds are included in the NPM package. Alternatively, you can get them from [CDNJS](https://cdnjs.com/libraries/react-bootstrap-typeahead) or [unpkg](https://unpkg.com/react-bootstrap-typeahead/). ## Documentation - [Basic Usage](docs/Usage.md) - [Data](docs/Data.md) - [Filtering](docs/Filtering.md) - [Rendering](docs/Rendering.md) - [Public Methods](docs/Methods.md) - [API & Props](docs/API.md) - [Upgrade Guide](docs/Upgrading.md) ## CSS While the component relies primarily on Bootstrap, some additional styling is needed. You should include the provided CSS file in your project: ```js // Import as a module in your JS import 'react-bootstrap-typeahead/css/Typeahead.css'; ``` or ```html ``` ### Bootstrap 5 In an effort to support Bootstrap 5, this package also contains a CSS file named `Typeahead.bs5.css` that should be included alongside the base CSS file above. ## Examples Try the [live examples](http://ericgio.github.io/react-bootstrap-typeahead/), which also include code samples. If you'd like to modify the examples, clone the repository and run `npm install` and `npm start` to build the example file. You can then open the HTML file locally in your browser. You can also try out the following sandbox examples: - [Windowing with large data sets](https://codesandbox.io/p/sandbox/stoic-river-4q1yjrzrn0) - [Asynchronous pagination](https://codesandbox.io/p/sandbox/heuristic-pateu-zfjwjq) - [Combobox](https://codesandbox.io/p/sandbox/friendly-bose-kkmyd) - [Validation and feedback](https://codesandbox.io/p/sandbox/amazing-mendeleev-4w01px4z6x) - [Custom loader & clear button](https://codesandbox.io/p/sandbox/practical-jang-gn3kn) - [Multi-select with reorderable drag & drop tokens](https://codesandbox.io/p/sandbox/misty-water-u43sf) - [Keep the menu open during multi-selection](https://codesandbox.io/p/sandbox/eloquent-germain-nr2y4) - [Single-select with floating label (BS5)](https://codesandbox.io/p/sandbox/upbeat-paper-8c2j6b) If you have an example use case that would be useful to others, please create a sandbox and submit a pull request to add it to the list! ## Browser Support Recent versions of the following browsers are supported: - Chrome - Firefox - Edge - Safari Special thanks to [BrowserStack](https://www.browserstack.com) for providing cross-browser testing support. [![http://i.imgur.com/9aLP6Fx.png?1](http://i.imgur.com/9aLP6Fx.png?1)](https://www.browserstack.com) ## License [MIT](https://github.com/ericgio/react-bootstrap-typeahead/blob/master/LICENSE.md) --- _Source: https://npm.io/package/react-bootstrap-typeahead · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._