{"id":13401112,"url":"https://github.com/reactjs/react-autocomplete","last_synced_at":"2025-12-12T04:17:34.568Z","repository":{"id":39988267,"uuid":"20636942","full_name":"reactjs/react-autocomplete","owner":"reactjs","description":"WAI-ARIA compliant React autocomplete (combobox) component","archived":true,"fork":false,"pushed_at":"2019-06-06T17:14:08.000Z","size":3655,"stargazers_count":2161,"open_issues_count":91,"forks_count":528,"subscribers_count":43,"default_branch":"master","last_synced_at":"2024-05-21T04:15:49.301Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/reactjs.png","metadata":{"files":{"readme":"README-template.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-06-09T06:38:01.000Z","updated_at":"2024-05-07T07:47:28.000Z","dependencies_parsed_at":"2022-06-25T23:07:53.077Z","dependency_job_id":null,"html_url":"https://github.com/reactjs/react-autocomplete","commit_stats":null,"previous_names":["rackt/react-autocomplete"],"tags_count":43,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/reactjs%2Freact-autocomplete","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/reactjs%2Freact-autocomplete/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/reactjs%2Freact-autocomplete/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/reactjs%2Freact-autocomplete/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/reactjs","download_url":"https://codeload.github.com/reactjs/react-autocomplete/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234681178,"owners_count":18870892,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-30T19:00:58.813Z","updated_at":"2025-09-30T05:31:15.534Z","avatar_url":"https://github.com/reactjs.png","language":"JavaScript","funding_links":[],"categories":["Uncategorized","JavaScript"],"sub_categories":["Uncategorized"],"readme":"# React Autocomplete [![Travis build status](https://travis-ci.org/reactjs/react-autocomplete.svg?branch=master)](https://travis-ci.org/reactjs/react-autocomplete/)\n\nAccessible, extensible, Autocomplete for React.js.\n\n```jsx\n\u003cAutocomplete\n  getItemValue={(item) =\u003e item.label}\n  items={[\n    { label: 'apple' },\n    { label: 'banana' },\n    { label: 'pear' }\n  ]}\n  renderItem={(item, isHighlighted) =\u003e\n    \u003cdiv style={{ background: isHighlighted ? 'lightgray' : 'white' }}\u003e\n      {item.label}\n    \u003c/div\u003e\n  }\n  value={value}\n  onChange={(e) =\u003e value = e.target.value}\n  onSelect={(val) =\u003e value = val}\n/\u003e\n```\n\nCheck out [more examples](https://reactcommunity.org/react-autocomplete/) and get stuck right in with the [online editor](http://jsbin.com/mipesawapi/edit?js,output).\n\n## Install\n\n### npm\n\n```bash\nnpm install --save react-autocomplete\n```\n\n### yarn\n\n```bash\nyarn add react-autocomplete\n```\n\n### AMD/UMD\n\n* Development: [https://unpkg.com/react-autocomplete@${VERSION}/dist/react-autocomplete.js](https://unpkg.com/react-autocomplete@${VERSION}/dist/react-autocomplete.js)\n* Production: [https://unpkg.com/react-autocomplete@${VERSION}/dist/react-autocomplete.min.js](https://unpkg.com/react-autocomplete@${VERSION}/dist/react-autocomplete.min.js)\n\n## API\n\n### Props\n\n${API_DOC}\n### Imperative API\n\nIn addition to the props there is an API available on the mounted element which is similar to that of `HTMLInputElement`. In other words: you can access most of the common `\u003cinput\u003e` methods directly on an `Autocomplete` instance. An example:\n\n```jsx\nclass MyComponent extends Component {\n  componentDidMount() {\n    // Focus the input and select \"world\"\n    this.input.focus()\n    this.input.setSelectionRange(6, 11)\n  }\n  render() {\n    return (\n      \u003cAutocomplete\n        ref={el =\u003e this.input = el}\n        value=\"hello world\"\n        ...\n      /\u003e\n    )\n  }\n}\n```\n\n# Development\nYou can start a local development environment with `npm start`. This command starts a static file server on [localhost:8080](http://localhost:8080) which serves the examples in `examples/`. Hot-reload mechanisms are in place which means you don't have to refresh the page or restart the build for changes to take effect.\n\n## Tests!\n\nRun them:\n`npm test`\n\nWrite them:\n`lib/__tests__/Autocomplete-test.js`\n\nCheck your work:\n`npm run coverage`\n\n## Scripts\nRun with `npm run \u003cscript\u003e`.\n\n### gh-pages\nBuilds the examples and assembles a commit which is pushed to `origin/gh-pages`, then cleans up your working directory. Note: This script will `git checkout master` before building.\n\n### release\nTakes the same argument as `npm publish`, i.e. `[major|minor|patch|x.x.x]`, then tags a new version, publishes, and pushes the version commit and tag to `origin/master`. Usage: `npm run release -- [major|minor|patch|x.x.x]`. Remember to update the CHANGELOG before releasing!\n\n### build\nRuns the build scripts detailed below.\n\n### build:component\nTranspiles the source in `lib/` and outputs it to `build/`, as well as creating a UMD bundle in `dist/`.\n\n### build:examples\nCreates bundles for each of the examples, which is used for pushing to `origin/gh-pages`.\n\n### test\nRuns the test scripts detailed below.\n\n### test:lint\nRuns `eslint` on the source.\n\n### test:jest\nRuns the unit tests with `jest`.\n\n### coverage\nRuns the unit tests and creates a code coverage report.\n\n### start\nBuilds all the examples and starts a static file server on [localhost:8080](http://localhost:8080). Any changes made to `lib/Autocomplete.js` and the examples are automatically compiled and transmitted to the browser, i.e. there's no need to refresh the page or restart the build during development. This script is the perfect companion when making changes to this repo, since you can use the examples as a test-bed for development.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freactjs%2Freact-autocomplete","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Freactjs%2Freact-autocomplete","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freactjs%2Freact-autocomplete/lists"}