Places (New) Autocomplete Svelte

A powerful and easy-to-use Svelte component for integrating the Google Maps Places (New) Autocomplete API into your SvelteKit applications. This component simplifies the process of adding location search functionality, allowing users to quickly find and select addresses with rich autocomplete suggestions.

powered by
powered by Google

Requirements

Google Maps API Key: Create an API key with the Places API (New) enabled. Refer to Use API Keys for detailed instructions.

Installation

Install the package using npm:

npm i places-autocomplete-svelte

Then, get your Google Maps API Key and start using the component in your Svelte code (see the Basic Usage guide for details).

Features

  • Seamless SvelteKit Integration: Effortlessly add location search to your SvelteKit projects.
  • Real-time Autocomplete: Provides instant address suggestions as the user types.
  • Comprehensive Address Data: Retrieve detailed address information, including street address, city, region, postal code, and country.
  • Country/Region Filtering: Refine search results by specifying countries or regions using the `requestParams` prop.
  • Customizable Appearance: Tailor the component's look and feel using your own CSS classes, overriding the default Tailwind CSS styles.
  • Flexible Data Retrieval: Control the retrieved address data using the `fetchFields` prop.
  • Accessible: Supports keyboard navigation for selecting suggestions.

JavaScript Integration

The PAC Service now offers a simple JavaScript integration. Add powerful address autocompletion to your website by including a single script tag and setting up a callback function to receive the results. For detailed integration instructions and to get started, please visit PAC Service website.

2025 Places Autocomplete Svelte.