Merge pull request #39 from silinternational/develop

Release 1.2.3

.prettierignore

@@ -0,0 +1,5 @@
+# Ignore artifacts:
+dist
+
+# Ignore build dependencies
+node_modules

.prettierrc

@@ -0,0 +1,10 @@
+{
+  "printWidth": 120,
+  "semi": false,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "useTabs": false,
+
+  "svelteAllowShorthand": true,
+  "svelteIndentScriptAndStyle": false
+}

Makefile

@@ -11,3 +11,6 @@ test: build
 clean:
 	npm prune
 	npm run clean
+
+format:
+	npm run format

README.md

@@ -91,3 +91,7 @@ The tests are defined in `test/tests.js`. See that file for examples.
 ## Install with [npm](https://www.npmjs.com/package/@silintl/svelte-google-places-autocomplete)
 
     $ npm install @silintl/svelte-google-places-autocomplete
+
+## Contributing
+
+Please use the included prettier config for formatting. You can also run `make format` to format all files with prettier.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@silintl/svelte-google-places-autocomplete",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "description": "A minimal port of the [Google Places Autocomplete API](https://developers.google.com/maps/documentation/javascript/places-autocomplete) as a Svelte component.",
   "repository": {
     "type": "git",
@@ -11,6 +11,11 @@
   },
   "homepage": "https://github.com/silinternational/svelte-google-places-autocomplete#readme",
   "svelte": "src/index.js",
+  "exports": {
+    ".": {
+      "svelte": "src/index.js"
+    }
+  },
   "module": "dist/index.mjs",
   "main": "dist/index.js",
   "scripts": {
@@ -19,11 +24,14 @@
     "build": "rollup -c",
     "prepublishOnly": "npm run build",
     "sirvTest": "sirv test --port 8086 --single --dev",
-    "test": "run-p autobuild autobuildTest sirvTest"
+    "test": "run-p autobuild autobuildTest sirvTest",
+    "format": "prettier --write ./src/*.{js,svelte}"
   },
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^6.0.0",
     "npm-run-all": "^4.1.5",
+    "prettier": "^2",
+    "prettier-plugin-svelte": "^2",
     "rollup": "^1.32.1",
     "rollup-plugin-livereload": "^1.3.0",
     "rollup-plugin-svelte": "^6.1.1",

src/GooglePlacesAutocomplete.svelte

@@ -6,8 +6,8 @@ export let apiKey
 export let options = undefined
 export let placeholder = undefined
 export let value = ''
-export let required = false;
-export let pattern = '';
+export let required = false
+export let pattern = undefined
 
 const dispatch = createEventDispatcher()
 
@@ -17,22 +17,22 @@ $: selectedLocationName = value || ''
 onMount(() => {
   loadGooglePlacesLibrary(apiKey, () => {
     const autocomplete = new google.maps.places.Autocomplete(inputField, options)
-    
+
     autocomplete.addListener('place_changed', () => {
       const place = autocomplete.getPlace()
-      
+
       // There are circumstances where the place_changed event fires, but we
       // were NOT given location data. I only want to propagate the event if we
       // truly received location data from Google.
       // See the `Type something, no suggestions, hit Enter` test case.
       if (hasLocationData(place)) {
         setSelectedLocation({
           place: place,
-          text: inputField.value
+          text: inputField.value,
         })
       }
     })
-    
+
     dispatch('ready')
   })
 })
@@ -55,7 +55,7 @@ function onChange() {
 
 function onKeyDown(event) {
   const suggestionsAreVisible = document.getElementsByClassName('pac-item').length
-  
+
   if (event.key === 'Enter' || event.key === 'Tab') {
     if (suggestionsAreVisible) {
       const isSuggestionSelected = document.getElementsByClassName('pac-item-selected').length
@@ -68,7 +68,7 @@ function onKeyDown(event) {
   } else if (event.key === 'Escape') {
     setTimeout(emptyLocationField, 10)
   }
-  
+
   if (suggestionsAreVisible) {
     if (event.key === 'Enter') {
       /* When suggestions are visible, don't let an 'Enter' submit a form (since
@@ -82,10 +82,7 @@ function onKeyDown(event) {
 function selectFirstSuggestion() {
   // Simulate the 'down arrow' key in order to select the first suggestion:
   // https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events
-  const simulatedEvent = new KeyboardEvent(
-    'keydown',
-    { key: 'ArrowDown', code: 'ArrowDown', keyCode: 40 }
-  )
+  const simulatedEvent = new KeyboardEvent('keydown', { key: 'ArrowDown', code: 'ArrowDown', keyCode: 40 })
   inputField.dispatchEvent(simulatedEvent)
 }
 
@@ -99,5 +96,13 @@ function doesNotMatchSelectedLocation(value) {
 }
 </script>
 
-<input bind:this={inputField} class={$$props.class} on:change={onChange}
-       on:keydown={onKeyDown} {placeholder} {value} {required} {pattern}/>
+<input
+  bind:this={inputField}
+  class={$$props.class}
+  on:change={onChange}
+  on:keydown={onKeyDown}
+  {placeholder}
+  {value}
+  {required}
+  {pattern}
+/>

src/index.js

@@ -1 +1 @@
-export { default as default } from './GooglePlacesAutocomplete.svelte';
+export { default as default } from './GooglePlacesAutocomplete.svelte'

src/loader.js

@@ -31,20 +31,22 @@ export function loadGooglePlacesLibrary(apiKey, callback) {
     callback()
     return
   }
-  
+
   callback && callbacks.push(callback)
-  
+
   if (isLoadingLibrary) {
     return
   }
-  
+
   isLoadingLibrary = true
-  
+
   const element = document.createElement('script')
   element.async = true
   element.defer = true
   element.onload = onLibraryLoaded
-  element.src = `https://maps.googleapis.com/maps/api/js?key=${encodeURIComponent(apiKey)}&libraries=places&callback=Function.prototype`
+  element.src = `https://maps.googleapis.com/maps/api/js?key=${encodeURIComponent(
+    apiKey
+  )}&libraries=places&callback=Function.prototype`
   element.type = 'text/javascript'
 
   document.head.appendChild(element)
@@ -53,7 +55,7 @@ export function loadGooglePlacesLibrary(apiKey, callback) {
 function onLibraryLoaded() {
   isLoadingLibrary = false
   let callback
-  while (callback = callbacks.pop()) {
+  while ((callback = callbacks.pop())) {
     callback()
   }
 }

test/tests.js

@@ -7,7 +7,7 @@ import { get, writable } from 'svelte/store'
 export default writable([
   {
     name: `Type something, see suggestions, click on one`,
-    setup: async () => await type('new').then(waitForSuggestions),
+    setup: async () => await type('new york').then(waitForSuggestions),
     go: () => showText('Please click on the first suggestion', 'command'),
     expected: 'New York, NY, USA',
   },
@@ -19,7 +19,7 @@ export default writable([
   },
   {
     name: `Type something, see suggestions, don't select any, hit Tab`,
-    setup: async () => await type('new').then(waitForSuggestions),
+    setup: async () => await type('new york').then(waitForSuggestions),
     go: () => hitKey('Tab', 0, 9),
     expected: 'New York, NY, USA',
   },
@@ -30,19 +30,17 @@ export default writable([
       await waitForSuggestions()
       return hitKey('Enter', 0, 13)
     },
-
     // Since this test shouldn't trigger a place_changed event, explicitly check the results.
     go: () => hitKey('Tab', 0, 9).then(checkTestResultAfterAMoment),
     expected: 'Atlanta, GA, USA',
   },
   {
     name: `Type something, see suggestions, don't select any, hit Enter, hit Enter`,
     setup: async () => {
-      await type('new')
+      await type('new york')
       await waitForSuggestions()
       return hitKey('Enter', 0, 13)
     },
-
     // Since this test shouldn't trigger a place_changed event, explicitly check the results.
     go: () => hitKey('Enter', 0, 13).then(checkTestResultAfterAMoment),
     expected: 'New York, NY, USA',
@@ -64,7 +62,7 @@ export default writable([
     name: `Type something, see suggestions, don't select any, hit Enter, ` +
           `type something else, see no suggestions, hit Enter`,
     setup: async () => {
-      await type('new')
+      await type('new york')
       await waitForSuggestions()
       await hitKey('Enter', 0, 13)
       await type('zzzzzzzz')
@@ -86,7 +84,7 @@ export default writable([
   {
     name: `Type something, see suggestions, select one via Arrow keys, hit Tab`,
     setup: async () => {
-      await type('new')
+      await type('new york')
       await waitForSuggestions()
       return hitKey('ArrowDown', 0, 40)
     },
@@ -114,7 +112,6 @@ export default writable([
   {
     name: `Pass in a value`,
     setup: async () => passInValue('Atlanta, GA, USA'),
-
     // Since this test shouldn't trigger a place_changed event, explicitly check the results.
     go: () => checkTestResultAfterAMoment(),
     expected: 'Atlanta, GA, USA',