places-autocomplete-svelte 2.2.6 → 2.2.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/dist/PlaceAutocomplete.svelte +9 -2
- package/package.json +12 -12
package/README.md
CHANGED
|
@@ -38,7 +38,7 @@ See a live demo of the component in action: [Basic Example](https://places-autoc
|
|
|
38
38
|
[Customise request parameters](https://places-autocomplete-demo.pages.dev/examples/customise-request-parameters) - construct a `requestParams` object and control various aspects of the search, including language, region, and more.
|
|
39
39
|
|
|
40
40
|
|
|
41
|
-
<video src="https://github.com/user-attachments/assets/
|
|
41
|
+
<video src="https://github.com/user-attachments/assets/b424b267-da1b-40d8-bf78-abf5d4353081" width="660" height="764" controls autoplay loop muted>
|
|
42
42
|
</video>
|
|
43
43
|
|
|
44
44
|
|
|
@@ -101,7 +101,7 @@ const requestParams: Partial<RequestParams> = $state({
|
|
|
101
101
|
});
|
|
102
102
|
|
|
103
103
|
// Control which data fields are fetched for Place Details (affects cost!)
|
|
104
|
-
const fetchFields: string[] = $state(['formattedAddress', 'addressComponents', '
|
|
104
|
+
const fetchFields: string[] = $state(['formattedAddress', 'addressComponents', 'displayName']);
|
|
105
105
|
|
|
106
106
|
// Control component appearance and behavior
|
|
107
107
|
const options: Partial<ComponentOptions> = $state({
|
|
@@ -17,7 +17,6 @@
|
|
|
17
17
|
* @see https://developers.google.com/maps/documentation/javascript/usage-and-billing#location-placedetails
|
|
18
18
|
*/
|
|
19
19
|
PUBLIC_GOOGLE_MAPS_API_KEY,
|
|
20
|
-
//fetchFields = $bindable(['formattedAddress', 'addressComponents']),
|
|
21
20
|
fetchFields,
|
|
22
21
|
options,
|
|
23
22
|
onResponse = $bindable((response: PlaceResult) => {}),
|
|
@@ -274,9 +273,17 @@
|
|
|
274
273
|
resetKbdClasses();
|
|
275
274
|
}, 300);
|
|
276
275
|
}
|
|
276
|
+
|
|
277
|
+
// Handle click outside the input
|
|
278
|
+
// to reset the search input and results
|
|
279
|
+
function handleClickOutside(event: MouseEvent) {
|
|
280
|
+
if (inputRef && !inputRef.contains(event.target as Node)) {
|
|
281
|
+
reset();
|
|
282
|
+
}
|
|
283
|
+
}
|
|
277
284
|
</script>
|
|
278
285
|
|
|
279
|
-
<svelte:window onkeydown={onKeyDown} />
|
|
286
|
+
<svelte:window onkeydown={onKeyDown} onclick={handleClickOutside}/>
|
|
280
287
|
|
|
281
288
|
<section class={options.classes?.section}>
|
|
282
289
|
{#if options?.label ?? ''}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "places-autocomplete-svelte",
|
|
3
3
|
"license": "MIT",
|
|
4
|
-
"version": "2.2.
|
|
4
|
+
"version": "2.2.8",
|
|
5
5
|
"description": "A flexible and customizable Svelte component leveraging the Google Maps Places (New) Autocomplete API to provide a user-friendly way to search for and retrieve detailed address information within your SvelteKit applications.",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"svelte",
|
|
@@ -73,30 +73,30 @@
|
|
|
73
73
|
},
|
|
74
74
|
"devDependencies": {
|
|
75
75
|
"@sveltejs/adapter-auto": "^6.0.0",
|
|
76
|
-
"@sveltejs/adapter-cloudflare": "^7.0.
|
|
77
|
-
"@sveltejs/kit": "^2.20.
|
|
78
|
-
"@sveltejs/package": "^2.3.
|
|
76
|
+
"@sveltejs/adapter-cloudflare": "^7.0.2",
|
|
77
|
+
"@sveltejs/kit": "^2.20.8",
|
|
78
|
+
"@sveltejs/package": "^2.3.11",
|
|
79
79
|
"@sveltejs/vite-plugin-svelte": "^5.0.3",
|
|
80
|
-
"@tailwindcss/postcss": "^4.1.
|
|
80
|
+
"@tailwindcss/postcss": "^4.1.5",
|
|
81
81
|
"@tailwindcss/typography": "^0.5.16",
|
|
82
|
-
"@tailwindcss/vite": "^4.1.
|
|
82
|
+
"@tailwindcss/vite": "^4.1.5",
|
|
83
83
|
"@types/eslint": "^9.6.1",
|
|
84
84
|
"autoprefixer": "^10.4.21",
|
|
85
|
-
"eslint": "^9.
|
|
85
|
+
"eslint": "^9.25.1",
|
|
86
86
|
"eslint-config-prettier": "^10.1.2",
|
|
87
87
|
"eslint-plugin-svelte": "^3.5.1",
|
|
88
88
|
"globals": "^16.0.0",
|
|
89
89
|
"postcss": "^8.5.3",
|
|
90
90
|
"prettier": "^3.5.3",
|
|
91
91
|
"prettier-plugin-svelte": "^3.3.3",
|
|
92
|
-
"publint": "^0.3.
|
|
93
|
-
"svelte": "^5.
|
|
92
|
+
"publint": "^0.3.12",
|
|
93
|
+
"svelte": "^5.28.2",
|
|
94
94
|
"svelte-check": "^4.1.6",
|
|
95
|
-
"tailwindcss": "^4.1.
|
|
95
|
+
"tailwindcss": "^4.1.5",
|
|
96
96
|
"tslib": "^2.8.1",
|
|
97
97
|
"typescript": "^5.8.3",
|
|
98
|
-
"typescript-eslint": "^8.
|
|
99
|
-
"vite": "^6.
|
|
98
|
+
"typescript-eslint": "^8.31.1",
|
|
99
|
+
"vite": "^6.3.4"
|
|
100
100
|
},
|
|
101
101
|
"svelte": "./dist/index.js",
|
|
102
102
|
"types": "./dist/PlaceAutocomplete.svelte.d.ts",
|