@ne1410s/address 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 ne1410s
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,66 @@
+# @ne1410s/address
+
+## An address lookup utility.
+
+```html
+<ne14-address reveal="Hey!">
+  <p>Hello world</p>
+</ne14-address>
+```
+
+- **Use:** `<script src="PATH_TO_UMD_SCRIPT"></script>`
+- **Extend:** _npm i -S @ne1410s/address_
+
+### Attributes
+
+```html
+<ne14-address corner="3" reveal="Definition here">YO' STUFF</ne14-address>
+```
+
+- **corner**: If specified, the reveal text is positioned in a corner of the screen:
+  - 1: Top-left, 2: Top-right, 3: Bottom-right, 4: Bottom-left
+- **reveal**: The definition text that gets shown on hover
+
+### Events
+
+```javascript
+const address = document.querySelector('ne14-address');
+
+address.addEventListener('...', () => {
+  console.log('Event fired!');
+});
+```
+
+- _There are no bespoke events raised in the internal workings of this element_
+
+### Methods
+
+- _There are no bespoke methods exposed in this element_
+
+### Properties
+
+- `set` **corner** (number): Sets the attribute with the corresponding value
+- `set` **reveal** (string): Sets the attribute with the corresponding value
+
+### CSS Variables
+
+Some degree of custom styling can be provided, by way of css variables:
+
+```css
+ne14-address {
+  --src-border: 1px solid green;
+  --reveal-trg-bg: rebeccapurple;
+}
+```
+
+- **`--src-border-radius`** _Source item border radius. Defaults to: `3px`_
+- **`--src-border`** _Source item border. Defaults to: `1px solid black`_
+- **`--src-bg`** _Source item background. Defaults to: `inherit`_
+- **`--src-fg`** _Source item foreground. Defaults to: `inherit`_
+- **`--trg-border-radius`** _Target item border radius. Defaults to: `3px`_
+- **`--reveal-src-border`** _Source item border (in reveal mode). Defaults to: `--src-border`_
+- **`--reveal-src-bg`** _Source item background (in reveal mode). Defaults to: `inherit`_
+- **`--reveal-src-fg`** _Source item foreground (in reveal mode). Defaults to: `inherit`_
+- **`--reveal-trg-border`** _Target item border (in reveal mode). Defaults to: `1px solid black`_
+- **`--reveal-trg-bg`** _Target item background (in reveal mode). Defaults to: `white`_
+- **`--reveal-trg-fg`** _Target item foreground (in reveal mode). Defaults to: `inherit`_

package/dist/address-lookup/address-lookup.d.ts

@@ -0,0 +1,10 @@
+import { CustomElementBase } from '@ne1410s/cust-elems';
+export declare class AddressLookup extends CustomElementBase {
+    private static readonly Css;
+    private static readonly Html;
+    private addressCompleter;
+    constructor();
+    initialise(): void;
+    private onPlaceChanged;
+    private getMatchingFieldId;
+}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+import { AddressLookup } from './address-lookup/address-lookup';
+export { AddressLookup };

package/dist/ne14_address.cjs.min.js

@@ -0,0 +1,78 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var custElems = require('@ne1410s/cust-elems');
+
+var markupUrl = "data:text/html;base64,PHNwYW4gY2xhc3M9InJvb3QiPg0KICA8Zm9ybSBhY3Rpb249IiIgbWV0aG9kPSJnZXQiIGF1dG9jb21wbGV0ZT0ib2ZmIj4NCiAgICA8bGFiZWwgY2xhc3M9InN1cGVyLXNsaW0tZmllbGQtbGVmdCI+DQogICAgICA8c3BhbiBjbGFzcz0iZm9ybS1sYWJlbCI+Tm8uKjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0iaG91c2UtbnVtYmVyIiBuYW1lPSJob3VzZS1udW1iZXIiIHJlcXVpcmVkIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZpZWxkLXJpZ2h0Ij4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5TdHJlZXQqPC9zcGFuPg0KICAgICAgPGlucHV0DQogICAgICAgIGlkPSJzdHJlZXQiDQogICAgICAgIG5hbWU9InN0cmVldCINCiAgICAgICAgcmVxdWlyZWQNCiAgICAgICAgYXV0b2NvbXBsZXRlPSJvZmYiDQogICAgICAgIHBsYWNlaG9sZGVyPSJUeXBlIHlvdXIgYWRkcmVzcy4uLiINCiAgICAgIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZ1bGwtZmllbGQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPkFkZHJlc3MgTGluZSAyPC9zcGFuPg0KICAgICAgPGlucHV0IGlkPSJhZGRyZXNzMiIgbmFtZT0iYWRkcmVzczIiIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZ1bGwtZmllbGQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPlRvd24gLyBDaXR5Kjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0idG93biIgbmFtZT0idG93biIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxsYWJlbCBjbGFzcz0ic2xpbS1maWVsZC1sZWZ0Ij4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5Db3VudHkqPC9zcGFuPg0KICAgICAgPGlucHV0IGlkPSJjb3VudHkiIG5hbWU9ImNvdW50eSIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxsYWJlbCBjbGFzcz0iZmllbGQtcmlnaHQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPlBvc3Rjb2RlKjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0icG9zdGNvZGUiIG5hbWU9InBvc3Rjb2RlIiByZXF1aXJlZCAvPg0KICAgIDwvbGFiZWw+DQogICAgPGxhYmVsIGNsYXNzPSJmdWxsLWZpZWxkIj4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5Db3VudHJ5Kjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0iY291bnRyeSIgbmFtZT0iY291bnRyeSIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxidXR0b24gdHlwZT0iYnV0dG9uIiBjbGFzcz0ibXktYnV0dG9uIj5TYXZlIGFkZHJlc3M8L2J1dHRvbj4NCiAgICA8aW5wdXQgdHlwZT0icmVzZXQiIHZhbHVlPSJDbGVhciBmb3JtIiAvPg0KICA8L2Zvcm0+DQo8L3NwYW4+DQo=";
+
+var stylesUrl = "data:text/css;base64,";
+
+class AddressLookup extends custElems.CustomElementBase {
+    constructor() {
+        super(AddressLookup.Css, AddressLookup.Html);
+    }
+    initialise() {
+        const searchBox = this.root.querySelector('#street');
+        this.addressCompleter = new google.maps.places.Autocomplete(searchBox, {
+            componentRestrictions: { country: ['uk'] },
+            fields: ['address_components'],
+            types: ['address'],
+        });
+        this.addressCompleter.addListener('place_changed', this.onPlaceChanged);
+    }
+    onPlaceChanged() {
+        const place = this.addressCompleter.getPlace();
+        for (const component of place.address_components) {
+            const inputFieldId = this.getMatchingFieldId(component.types[0]);
+            if (inputFieldId) {
+                const input = document.querySelector(inputFieldId);
+                input.value = component.long_name;
+            }
+        }
+    }
+    getMatchingFieldId(componentType) {
+        switch (componentType) {
+            case 'street_number':
+                return '#house-number';
+            case 'route':
+                return '#street';
+            case 'postal_code':
+                return '#postcode';
+            case 'locality':
+                return '#town';
+            case 'postal_town':
+                return '#town';
+            case 'administrative_area_level_2':
+                return '#county';
+            case 'country':
+                return '#country';
+            default:
+                return '';
+        }
+    }
+}
+AddressLookup.Css = custElems.reduceCss(custElems.decode(stylesUrl));
+AddressLookup.Html = custElems.reduceHtml(custElems.decode(markupUrl));
+
+// If custom elements is supported
+if ('customElements' in window) {
+    // If not already defined
+    if (!window.customElements.get('ne14-address')) {
+        window.customElements.define('ne14-address', AddressLookup);
+        const apiKey = 'AIzaSyDcwGyRxRbcNGWOFQVT87A1mkxEOfm8t0w';
+        const callback = 'apiCallback'; // `ne_address.${AddressLookup.name}.${AddressLookup.Cb.name}`;
+        const mapsScriptUrl = `https://maps.googleapis.com/maps/api/js?key=${apiKey}&callback=${callback}&libraries=places&v=weekly`;
+        const mapsScript = document.createElement('script');
+        mapsScript.setAttribute('async', '');
+        mapsScript.setAttribute('src', mapsScriptUrl);
+        window[callback] = () => {
+            Array.from(document.querySelectorAll('ne14-address')).forEach((el) => {
+                el.initialise();
+            });
+        };
+        window.addEventListener('load', () => document.body.appendChild(mapsScript));
+    }
+}
+
+exports.AddressLookup = AddressLookup;

package/dist/ne14_address.esm.min.js

@@ -0,0 +1,74 @@
+import { reduceCss, decode, reduceHtml, CustomElementBase } from '@ne1410s/cust-elems';
+
+var markupUrl = "data:text/html;base64,PHNwYW4gY2xhc3M9InJvb3QiPg0KICA8Zm9ybSBhY3Rpb249IiIgbWV0aG9kPSJnZXQiIGF1dG9jb21wbGV0ZT0ib2ZmIj4NCiAgICA8bGFiZWwgY2xhc3M9InN1cGVyLXNsaW0tZmllbGQtbGVmdCI+DQogICAgICA8c3BhbiBjbGFzcz0iZm9ybS1sYWJlbCI+Tm8uKjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0iaG91c2UtbnVtYmVyIiBuYW1lPSJob3VzZS1udW1iZXIiIHJlcXVpcmVkIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZpZWxkLXJpZ2h0Ij4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5TdHJlZXQqPC9zcGFuPg0KICAgICAgPGlucHV0DQogICAgICAgIGlkPSJzdHJlZXQiDQogICAgICAgIG5hbWU9InN0cmVldCINCiAgICAgICAgcmVxdWlyZWQNCiAgICAgICAgYXV0b2NvbXBsZXRlPSJvZmYiDQogICAgICAgIHBsYWNlaG9sZGVyPSJUeXBlIHlvdXIgYWRkcmVzcy4uLiINCiAgICAgIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZ1bGwtZmllbGQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPkFkZHJlc3MgTGluZSAyPC9zcGFuPg0KICAgICAgPGlucHV0IGlkPSJhZGRyZXNzMiIgbmFtZT0iYWRkcmVzczIiIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZ1bGwtZmllbGQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPlRvd24gLyBDaXR5Kjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0idG93biIgbmFtZT0idG93biIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxsYWJlbCBjbGFzcz0ic2xpbS1maWVsZC1sZWZ0Ij4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5Db3VudHkqPC9zcGFuPg0KICAgICAgPGlucHV0IGlkPSJjb3VudHkiIG5hbWU9ImNvdW50eSIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxsYWJlbCBjbGFzcz0iZmllbGQtcmlnaHQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPlBvc3Rjb2RlKjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0icG9zdGNvZGUiIG5hbWU9InBvc3Rjb2RlIiByZXF1aXJlZCAvPg0KICAgIDwvbGFiZWw+DQogICAgPGxhYmVsIGNsYXNzPSJmdWxsLWZpZWxkIj4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5Db3VudHJ5Kjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0iY291bnRyeSIgbmFtZT0iY291bnRyeSIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxidXR0b24gdHlwZT0iYnV0dG9uIiBjbGFzcz0ibXktYnV0dG9uIj5TYXZlIGFkZHJlc3M8L2J1dHRvbj4NCiAgICA8aW5wdXQgdHlwZT0icmVzZXQiIHZhbHVlPSJDbGVhciBmb3JtIiAvPg0KICA8L2Zvcm0+DQo8L3NwYW4+DQo=";
+
+var stylesUrl = "data:text/css;base64,";
+
+class AddressLookup extends CustomElementBase {
+    constructor() {
+        super(AddressLookup.Css, AddressLookup.Html);
+    }
+    initialise() {
+        const searchBox = this.root.querySelector('#street');
+        this.addressCompleter = new google.maps.places.Autocomplete(searchBox, {
+            componentRestrictions: { country: ['uk'] },
+            fields: ['address_components'],
+            types: ['address'],
+        });
+        this.addressCompleter.addListener('place_changed', this.onPlaceChanged);
+    }
+    onPlaceChanged() {
+        const place = this.addressCompleter.getPlace();
+        for (const component of place.address_components) {
+            const inputFieldId = this.getMatchingFieldId(component.types[0]);
+            if (inputFieldId) {
+                const input = document.querySelector(inputFieldId);
+                input.value = component.long_name;
+            }
+        }
+    }
+    getMatchingFieldId(componentType) {
+        switch (componentType) {
+            case 'street_number':
+                return '#house-number';
+            case 'route':
+                return '#street';
+            case 'postal_code':
+                return '#postcode';
+            case 'locality':
+                return '#town';
+            case 'postal_town':
+                return '#town';
+            case 'administrative_area_level_2':
+                return '#county';
+            case 'country':
+                return '#country';
+            default:
+                return '';
+        }
+    }
+}
+AddressLookup.Css = reduceCss(decode(stylesUrl));
+AddressLookup.Html = reduceHtml(decode(markupUrl));
+
+// If custom elements is supported
+if ('customElements' in window) {
+    // If not already defined
+    if (!window.customElements.get('ne14-address')) {
+        window.customElements.define('ne14-address', AddressLookup);
+        const apiKey = 'AIzaSyDcwGyRxRbcNGWOFQVT87A1mkxEOfm8t0w';
+        const callback = 'apiCallback'; // `ne_address.${AddressLookup.name}.${AddressLookup.Cb.name}`;
+        const mapsScriptUrl = `https://maps.googleapis.com/maps/api/js?key=${apiKey}&callback=${callback}&libraries=places&v=weekly`;
+        const mapsScript = document.createElement('script');
+        mapsScript.setAttribute('async', '');
+        mapsScript.setAttribute('src', mapsScriptUrl);
+        window[callback] = () => {
+            Array.from(document.querySelectorAll('ne14-address')).forEach((el) => {
+                el.initialise();
+            });
+        };
+        window.addEventListener('load', () => document.body.appendChild(mapsScript));
+    }
+}
+
+export { AddressLookup };

package/dist/ne14_address.umd.min.js

@@ -0,0 +1,107 @@
+(function (global, factory) {
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
+    typeof define === 'function' && define.amd ? define(['exports'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ne_address = {}));
+})(this, (function (exports) { 'use strict';
+
+    class CustomElementBase extends HTMLElement {
+        constructor(css, html, mode = 'closed') {
+            super();
+            this.root = this.attachShadow({ mode });
+            this.root.innerHTML = html;
+            const style = document.createElement('style');
+            style.textContent = css;
+            this.root.appendChild(style);
+        }
+    }
+
+    function decode(b64) {
+        const bIndex = (b64 + '').indexOf('base64,');
+        return bIndex === -1 ? b64 : window.atob(b64.substring(bIndex + 7));
+    }
+    function reduceCss(cssIn) {
+        return cssIn
+            .replace(/\s+/g, ' ')
+            .replace(/([,{}:;])\s/g, '$1')
+            .replace(/\s([{])/g, '$1');
+    }
+    function reduceHtml(htmlIn) {
+        return htmlIn.replace(/\s+/g, ' ').replace(/(^|>)\s+(<|$)/g, '$1$2');
+    }
+
+    var markupUrl = "data:text/html;base64,PHNwYW4gY2xhc3M9InJvb3QiPg0KICA8Zm9ybSBhY3Rpb249IiIgbWV0aG9kPSJnZXQiIGF1dG9jb21wbGV0ZT0ib2ZmIj4NCiAgICA8bGFiZWwgY2xhc3M9InN1cGVyLXNsaW0tZmllbGQtbGVmdCI+DQogICAgICA8c3BhbiBjbGFzcz0iZm9ybS1sYWJlbCI+Tm8uKjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0iaG91c2UtbnVtYmVyIiBuYW1lPSJob3VzZS1udW1iZXIiIHJlcXVpcmVkIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZpZWxkLXJpZ2h0Ij4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5TdHJlZXQqPC9zcGFuPg0KICAgICAgPGlucHV0DQogICAgICAgIGlkPSJzdHJlZXQiDQogICAgICAgIG5hbWU9InN0cmVldCINCiAgICAgICAgcmVxdWlyZWQNCiAgICAgICAgYXV0b2NvbXBsZXRlPSJvZmYiDQogICAgICAgIHBsYWNlaG9sZGVyPSJUeXBlIHlvdXIgYWRkcmVzcy4uLiINCiAgICAgIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZ1bGwtZmllbGQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPkFkZHJlc3MgTGluZSAyPC9zcGFuPg0KICAgICAgPGlucHV0IGlkPSJhZGRyZXNzMiIgbmFtZT0iYWRkcmVzczIiIC8+DQogICAgPC9sYWJlbD4NCiAgICA8bGFiZWwgY2xhc3M9ImZ1bGwtZmllbGQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPlRvd24gLyBDaXR5Kjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0idG93biIgbmFtZT0idG93biIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxsYWJlbCBjbGFzcz0ic2xpbS1maWVsZC1sZWZ0Ij4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5Db3VudHkqPC9zcGFuPg0KICAgICAgPGlucHV0IGlkPSJjb3VudHkiIG5hbWU9ImNvdW50eSIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxsYWJlbCBjbGFzcz0iZmllbGQtcmlnaHQiPg0KICAgICAgPHNwYW4gY2xhc3M9ImZvcm0tbGFiZWwiPlBvc3Rjb2RlKjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0icG9zdGNvZGUiIG5hbWU9InBvc3Rjb2RlIiByZXF1aXJlZCAvPg0KICAgIDwvbGFiZWw+DQogICAgPGxhYmVsIGNsYXNzPSJmdWxsLWZpZWxkIj4NCiAgICAgIDxzcGFuIGNsYXNzPSJmb3JtLWxhYmVsIj5Db3VudHJ5Kjwvc3Bhbj4NCiAgICAgIDxpbnB1dCBpZD0iY291bnRyeSIgbmFtZT0iY291bnRyeSIgcmVxdWlyZWQgLz4NCiAgICA8L2xhYmVsPg0KICAgIDxidXR0b24gdHlwZT0iYnV0dG9uIiBjbGFzcz0ibXktYnV0dG9uIj5TYXZlIGFkZHJlc3M8L2J1dHRvbj4NCiAgICA8aW5wdXQgdHlwZT0icmVzZXQiIHZhbHVlPSJDbGVhciBmb3JtIiAvPg0KICA8L2Zvcm0+DQo8L3NwYW4+DQo=";
+
+    var stylesUrl = "data:text/css;base64,";
+
+    class AddressLookup extends CustomElementBase {
+        constructor() {
+            super(AddressLookup.Css, AddressLookup.Html);
+        }
+        initialise() {
+            const searchBox = this.root.querySelector('#street');
+            this.addressCompleter = new google.maps.places.Autocomplete(searchBox, {
+                componentRestrictions: { country: ['uk'] },
+                fields: ['address_components'],
+                types: ['address'],
+            });
+            this.addressCompleter.addListener('place_changed', this.onPlaceChanged);
+        }
+        onPlaceChanged() {
+            const place = this.addressCompleter.getPlace();
+            for (const component of place.address_components) {
+                const inputFieldId = this.getMatchingFieldId(component.types[0]);
+                if (inputFieldId) {
+                    const input = document.querySelector(inputFieldId);
+                    input.value = component.long_name;
+                }
+            }
+        }
+        getMatchingFieldId(componentType) {
+            switch (componentType) {
+                case 'street_number':
+                    return '#house-number';
+                case 'route':
+                    return '#street';
+                case 'postal_code':
+                    return '#postcode';
+                case 'locality':
+                    return '#town';
+                case 'postal_town':
+                    return '#town';
+                case 'administrative_area_level_2':
+                    return '#county';
+                case 'country':
+                    return '#country';
+                default:
+                    return '';
+            }
+        }
+    }
+    AddressLookup.Css = reduceCss(decode(stylesUrl));
+    AddressLookup.Html = reduceHtml(decode(markupUrl));
+
+    // If custom elements is supported
+    if ('customElements' in window) {
+        // If not already defined
+        if (!window.customElements.get('ne14-address')) {
+            window.customElements.define('ne14-address', AddressLookup);
+            const apiKey = 'AIzaSyDcwGyRxRbcNGWOFQVT87A1mkxEOfm8t0w';
+            const callback = 'apiCallback'; // `ne_address.${AddressLookup.name}.${AddressLookup.Cb.name}`;
+            const mapsScriptUrl = `https://maps.googleapis.com/maps/api/js?key=${apiKey}&callback=${callback}&libraries=places&v=weekly`;
+            const mapsScript = document.createElement('script');
+            mapsScript.setAttribute('async', '');
+            mapsScript.setAttribute('src', mapsScriptUrl);
+            window[callback] = () => {
+                Array.from(document.querySelectorAll('ne14-address')).forEach((el) => {
+                    el.initialise();
+                });
+            };
+            window.addEventListener('load', () => document.body.appendChild(mapsScript));
+        }
+    }
+
+    exports.AddressLookup = AddressLookup;
+
+    Object.defineProperty(exports, '__esModule', { value: true });
+
+}));

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "@ne1410s/address",
+  "version": "0.0.1",
+  "description": "An address lookup tool.",
+  "main": "dist/ne14_address.cjs.min.js",
+  "module": "dist/ne14_address.esm.min.js",
+  "browser": "dist/ne14_address.umd.min.js",
+  "displayName": "ne_address",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "npx rollup -c rollup.browser.config.js -m -w",
+    "clean": "npx rimraf dist",
+    "is-pretty": "npx prettier --list-different . --ignore-path .gitignore",
+    "prettify": "npx prettier --write . --ignore-path .gitignore",
+    "build": "npm run clean && npx rollup -c",
+    "test": "npm run is-pretty",
+    "publish-local": "npm run test && npm run build && npm pack",
+    "publish-patch": "npm run test && npm run build && npm version patch && npm publish --access public",
+    "publish-minor": "npm run test && npm run build && npm version minor && npm publish --access public",
+    "publish-major": "npm run test && npm run build && npm version major && npm publish --access public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ne1410s/elem.address.git"
+  },
+  "keywords": [
+    "ES",
+    "address",
+    "lookup"
+  ],
+  "author": "ne1410s <pgj646@gmail.com> (http://ne1410s.co.uk)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/ne1410s/elem.address/issues"
+  },
+  "homepage": "https://github.com/ne1410s/elem.address#readme",
+  "devDependencies": {
+    "@rollup/plugin-commonjs": "^22.0.2",
+    "@rollup/plugin-json": "^4.1.0",
+    "@rollup/plugin-node-resolve": "^13.3.0",
+    "@rollup/plugin-url": "^7.0.0",
+    "@types/google.maps": "^3.49.2",
+    "prettier": "^2.7.1",
+    "rimraf": "^3.0.1",
+    "rollup": "^2.78.0",
+    "rollup-plugin-typescript2": "^0.32.1",
+    "typescript": "^4.7.4"
+  },
+  "dependencies": {
+    "@ne1410s/cust-elems": "^0.3.0"
+  }
+}