{"id":15484204,"url":"https://github.com/zokioki/places-autocomplete","last_synced_at":"2025-09-17T16:32:26.132Z","repository":{"id":59145178,"uuid":"535169661","full_name":"zokioki/places-autocomplete","owner":"zokioki","description":"An autocomplete component for the Mapbox Geocoding API.","archived":false,"fork":false,"pushed_at":"2023-01-26T10:23:45.000Z","size":49,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-01-01T05:16:37.342Z","etag":null,"topics":["autocomplete","dropdown","geocoding","mapbox","places","suggestions"],"latest_commit_sha":null,"homepage":"https://npmjs.com/package/places-autocomplete","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/zokioki.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-09-11T02:23:02.000Z","updated_at":"2024-10-31T06:38:21.000Z","dependencies_parsed_at":"2023-02-14T16:02:36.255Z","dependency_job_id":null,"html_url":"https://github.com/zokioki/places-autocomplete","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zokioki%2Fplaces-autocomplete","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zokioki%2Fplaces-autocomplete/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zokioki%2Fplaces-autocomplete/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zokioki%2Fplaces-autocomplete/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zokioki","download_url":"https://codeload.github.com/zokioki/places-autocomplete/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":233408223,"owners_count":18671812,"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":["autocomplete","dropdown","geocoding","mapbox","places","suggestions"],"created_at":"2024-10-02T05:23:25.534Z","updated_at":"2025-09-17T16:32:20.819Z","avatar_url":"https://github.com/zokioki.png","language":"JavaScript","readme":"## places-autocomplete\n\n[![npm](https://img.shields.io/npm/v/places-autocomplete)](https://www.npmjs.com/package/places-autocomplete)\n\nThis library provides an autocomplete component for the [Mapbox Geocoding API](https://docs.mapbox.com/api/search/geocoding/).\n\n### Getting Started\n\nInstall the package:\n\n```\nnpm install --save places-autocomplete\n```\n\nImport and initialize the autocomplete:\n\n```javascript\nimport mapboxgl from 'mapbox-gl';\nimport PlacesAutocomplete from 'places-autocomplete';\nimport 'places-autocomplete/index.css';\n\nmapboxgl.accessToken = 'pk.abcd1234...';\n\nconst mapboxglMap = new mapboxgl.Map({\n  container: document.getElementById('my-map-container'),\n  style: 'mapbox://styles/mapbox/streets-v12'\n});\n\nconst autocomplete = new PlacesAutocomplete({\n  mapboxToken: mapboxgl.accessToken,\n  mapInstance: mapboxglMap,\n  debounce: 300\n});\n\nconst inputEl = document.getElementById('my-input');\nautocomplete.attachTo(inputEl);\n```\n\nThe example above configures the autocomplete with a [mapbox-gl](https://github.com/mapbox/mapbox-gl-js) map instance, allowing the autocomplete to sync the map's position to the selected autocomplete result. You can view the [Mapbox GL JS docs](https://docs.mapbox.com/mapbox-gl-js) for more information on the `mapbox-gl` package.\n\n### Options\n\nThe autocomplete can be configured with the following options upon initialization:\n\n| Option                     | Description                                                                | Default          |\n| -------------------------- | -------------------------------------------------------------------------- | ---------------- |\n| `input`                    | An input DOM element to attach the autocomplete to.                        | -                |\n| `mapboxToken`              | The Mapbox access token used for the API requests (required).              | -                |\n| `mapInstance`              | A `mapboxgl.Map` instance, syncs map position to autocomplete.             | -                |\n| `className`                | Specifies the class name for the autocomplete suggestions container.       | -                |\n| `minLength`                | Minimum number of characters needed to trigger autocomplete.               | `2`              |\n| `debounce`                 | Time in milliseconds to delay the autocomplete between keystrokes.         | `200`            |\n| `preventSubmit`            | If true, prevents the input from submitting its form on Enter.             | `false`          |\n| `limit`                    | Number of results to return in the autocomplete.                           | `6`              |\n| `language`                 | Language of returned Mapbox autocomplete results.                          | browser language |\n| `proximity`                | Favor results that are closer to this location. Given as a string of two comma-separated coordinates (\"lon,lat\"). If a `mapInstance` is specified then the map's current center position will be used instead. | - |\n| `featureTypes`             | Filter results to include only a subset of the available feature types. Multiple types can be comma-separated. Options are: country, region, postcode, district, place, locality, neighborhood, address, and poi. | - |\n| `additionalResultsPrepend` | If true, prepends `additionalResults` entries to autocomplete suggestions. | `false`          |\n| `onClear`                  | Function called when input is cleared.                                     | -                |\n| `onSelect`                 | Function called when autocomplete item is selected (args: [item]).         | -                |\n| `additionalResults`        | Function called before updating autocomplete results, should return array of results (args: [query]). | - |\n| `customize`                | Function called before rendering autocomplete results (args: [input, inputRect, container, maxHeight]). | - |\n\n### License\n\nThe library is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzokioki%2Fplaces-autocomplete","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzokioki%2Fplaces-autocomplete","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzokioki%2Fplaces-autocomplete/lists"}