/*!
 * Copyright (c) what3words http://what3words.com
 */
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
import { D as DEFAULTS, R as RETRIES, M as MAP_SCRIPT_ID, c as MIN_GRID_ZOOM_LEVEL, d as MARKER_SRC, T as TOP_LEFT, e as SELECTED_ZOOM_LEVEL, W as W3W_REGEX, f as SEARCH_CONTROL_SELECTOR, C as CURRENT_LOCATION_CONTROL_SELECTOR, g as MAP_TYPE_CONTROL_SELECTOR, Z as ZOOM_CONTROL_SELECTOR, h as MAP_SELECTOR, A as AUTOSUGGEST_SELECTOR, b as SELECTORS } from './constants.js';
import { s as sdk, d as distExports, w as what3wordsClients } from './sdk.js';
import { v as version } from './package.js';

// do not edit .js files directly - edit src/index.jst



var fastDeepEqual = function equal(a, b) {
  if (a === b) return true;

  if (a && b && typeof a == 'object' && typeof b == 'object') {
    if (a.constructor !== b.constructor) return false;

    var length, i, keys;
    if (Array.isArray(a)) {
      length = a.length;
      if (length != b.length) return false;
      for (i = length; i-- !== 0;)
        if (!equal(a[i], b[i])) return false;
      return true;
    }



    if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
    if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
    if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();

    keys = Object.keys(a);
    length = keys.length;
    if (length !== Object.keys(b).length) return false;

    for (i = length; i-- !== 0;)
      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;

    for (i = length; i-- !== 0;) {
      var key = keys[i];

      if (!equal(a[key], b[key])) return false;
    }

    return true;
  }

  // true if both NaN, false otherwise
  return a!==a && b!==b;
};

/**
 * Copyright 2019 Google LLC. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at.
 *
 *      Http://www.apache.org/licenses/LICENSE-2.0.
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
const DEFAULT_ID = "__googleMapsScriptId";
/**
 * The status of the [[Loader]].
 */
var LoaderStatus;
(function (LoaderStatus) {
    LoaderStatus[LoaderStatus["INITIALIZED"] = 0] = "INITIALIZED";
    LoaderStatus[LoaderStatus["LOADING"] = 1] = "LOADING";
    LoaderStatus[LoaderStatus["SUCCESS"] = 2] = "SUCCESS";
    LoaderStatus[LoaderStatus["FAILURE"] = 3] = "FAILURE";
})(LoaderStatus || (LoaderStatus = {}));
/**
 * [[Loader]] makes it easier to add Google Maps JavaScript API to your application
 * dynamically using
 * [Promises](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise).
 * It works by dynamically creating and appending a script node to the the
 * document head and wrapping the callback function so as to return a promise.
 *
 * ```
 * const loader = new Loader({
 *   apiKey: "",
 *   version: "weekly",
 *   libraries: ["places"]
 * });
 *
 * loader.load().then((google) => {
 *   const map = new google.maps.Map(...)
 * })
 * ```
 */
class Loader {
    /**
     * Creates an instance of Loader using [[LoaderOptions]]. No defaults are set
     * using this library, instead the defaults are set by the Google Maps
     * JavaScript API server.
     *
     * ```
     * const loader = Loader({apiKey, version: 'weekly', libraries: ['places']});
     * ```
     */
    constructor({ apiKey, authReferrerPolicy, channel, client, id = DEFAULT_ID, language, libraries = [], mapIds, nonce, region, retries = 3, url = "https://maps.googleapis.com/maps/api/js", version, }) {
        this.CALLBACK = "__googleMapsCallback";
        this.callbacks = [];
        this.done = false;
        this.loading = false;
        this.errors = [];
        this.apiKey = apiKey;
        this.authReferrerPolicy = authReferrerPolicy;
        this.channel = channel;
        this.client = client;
        this.id = id || DEFAULT_ID; // Do not allow empty string
        this.language = language;
        this.libraries = libraries;
        this.mapIds = mapIds;
        this.nonce = nonce;
        this.region = region;
        this.retries = retries;
        this.url = url;
        this.version = version;
        if (Loader.instance) {
            if (!fastDeepEqual(this.options, Loader.instance.options)) {
                throw new Error(`Loader must not be called again with different options. ${JSON.stringify(this.options)} !== ${JSON.stringify(Loader.instance.options)}`);
            }
            return Loader.instance;
        }
        Loader.instance = this;
    }
    get options() {
        return {
            version: this.version,
            apiKey: this.apiKey,
            channel: this.channel,
            client: this.client,
            id: this.id,
            libraries: this.libraries,
            language: this.language,
            region: this.region,
            mapIds: this.mapIds,
            nonce: this.nonce,
            url: this.url,
            authReferrerPolicy: this.authReferrerPolicy,
        };
    }
    get status() {
        if (this.errors.length) {
            return LoaderStatus.FAILURE;
        }
        if (this.done) {
            return LoaderStatus.SUCCESS;
        }
        if (this.loading) {
            return LoaderStatus.LOADING;
        }
        return LoaderStatus.INITIALIZED;
    }
    get failed() {
        return this.done && !this.loading && this.errors.length >= this.retries + 1;
    }
    /**
     * CreateUrl returns the Google Maps JavaScript API script url given the [[LoaderOptions]].
     *
     * @ignore
     */
    createUrl() {
        let url = this.url;
        url += `?callback=${this.CALLBACK}`;
        if (this.apiKey) {
            url += `&key=${this.apiKey}`;
        }
        if (this.channel) {
            url += `&channel=${this.channel}`;
        }
        if (this.client) {
            url += `&client=${this.client}`;
        }
        if (this.libraries.length > 0) {
            url += `&libraries=${this.libraries.join(",")}`;
        }
        if (this.language) {
            url += `&language=${this.language}`;
        }
        if (this.region) {
            url += `&region=${this.region}`;
        }
        if (this.version) {
            url += `&v=${this.version}`;
        }
        if (this.mapIds) {
            url += `&map_ids=${this.mapIds.join(",")}`;
        }
        if (this.authReferrerPolicy) {
            url += `&auth_referrer_policy=${this.authReferrerPolicy}`;
        }
        return url;
    }
    deleteScript() {
        const script = document.getElementById(this.id);
        if (script) {
            script.remove();
        }
    }
    /**
     * Load the Google Maps JavaScript API script and return a Promise.
     */
    load() {
        return this.loadPromise();
    }
    /**
     * Load the Google Maps JavaScript API script and return a Promise.
     *
     * @ignore
     */
    loadPromise() {
        return new Promise((resolve, reject) => {
            this.loadCallback((err) => {
                if (!err) {
                    resolve(window.google);
                }
                else {
                    reject(err.error);
                }
            });
        });
    }
    /**
     * Load the Google Maps JavaScript API script with a callback.
     */
    loadCallback(fn) {
        this.callbacks.push(fn);
        this.execute();
    }
    /**
     * Set the script on document.
     */
    setScript() {
        if (document.getElementById(this.id)) {
            // TODO wrap onerror callback for cases where the script was loaded elsewhere
            this.callback();
            return;
        }
        const url = this.createUrl();
        const script = document.createElement("script");
        script.id = this.id;
        script.type = "text/javascript";
        script.src = url;
        script.onerror = this.loadErrorCallback.bind(this);
        script.defer = true;
        script.async = true;
        if (this.nonce) {
            script.nonce = this.nonce;
        }
        document.head.appendChild(script);
    }
    /**
     * Reset the loader state.
     */
    reset() {
        this.deleteScript();
        this.done = false;
        this.loading = false;
        this.errors = [];
        this.onerrorEvent = null;
    }
    resetIfRetryingFailed() {
        if (this.failed) {
            this.reset();
        }
    }
    loadErrorCallback(e) {
        this.errors.push(e);
        if (this.errors.length <= this.retries) {
            const delay = this.errors.length * Math.pow(2, this.errors.length);
            console.log(`Failed to load Google Maps script, retrying in ${delay} ms.`);
            setTimeout(() => {
                this.deleteScript();
                this.setScript();
            }, delay);
        }
        else {
            this.onerrorEvent = e;
            this.callback();
        }
    }
    setCallback() {
        window.__googleMapsCallback = this.callback.bind(this);
    }
    callback() {
        this.done = true;
        this.loading = false;
        this.callbacks.forEach((cb) => {
            cb(this.onerrorEvent);
        });
        this.callbacks = [];
    }
    execute() {
        this.resetIfRetryingFailed();
        if (this.done) {
            this.callback();
        }
        else {
            // short circuit and warn if google.maps is already loaded
            if (window.google && window.google.maps && window.google.maps.version) {
                console.warn("Google Maps already loaded outside @googlemaps/js-api-loader." +
                    "This may result in undesirable behavior as options and script parameters may not match.");
                this.callback();
                return;
            }
            if (this.loading) ;
            else {
                this.loading = true;
                this.setCallback();
                this.setScript();
            }
        }
    }
}

class MapProvider {
}

/* eslint-disable @typescript-eslint/no-explicit-any */
const DEFAULT_LIBS = ["places"];
class GoogleMaps extends MapProvider {
    constructor() {
        super(...arguments);
        this.loader = DEFAULTS.null;
        this.grid = [];
        this.map = DEFAULTS.null;
        this.eventListeners = {};
    }
    init(map, opts, onInit) {
        const { libraries = DEFAULT_LIBS } = opts;
        this.loader = new Loader({
            id: MAP_SCRIPT_ID,
            apiKey: opts.api_key,
            version: opts.version,
            libraries: libraries.includes("places")
                ? libraries
                : [...libraries, "places"],
            language: opts.language,
            region: opts.region,
            retries: RETRIES,
        });
        this.loader
            .load()
            .then((google) => {
            this.map = new google.maps.Map(map, {
                center: opts.center,
                tilt: opts.tilt,
                disableDefaultUI: opts.disable_default_ui,
                zoom: opts.zoom,
                zoomControl: opts.zoom_control,
                zoomControlOptions: {
                    position: this.isMapControlPosition(opts.zoom_control_position)
                        ? opts.zoom_control_position
                        : undefined,
                },
                mapTypeId: opts.map_type_id,
                mapTypeControl: opts.map_type_control,
                mapTypeControlOptions: {
                    position: this.isMapControlPosition(opts.map_type_control_position)
                        ? opts.map_type_control_position
                        : undefined,
                },
                scaleControl: opts.scale_control,
                streetViewControl: opts.street_view_control,
                streetViewControlOptions: {
                    position: this.isMapControlPosition(opts.street_view_control_position)
                        ? opts.street_view_control_position
                        : undefined,
                },
                rotateControl: opts.rotate_control,
                rotateControlOptions: {
                    position: this.isMapControlPosition(opts.rotate_control_position)
                        ? opts.rotate_control_position
                        : undefined,
                },
                fullscreenControl: opts.fullscreen_control,
                fullscreenControlOptions: {
                    position: this.isMapControlPosition(opts.fullscreen_control_position)
                        ? opts.fullscreen_control_position
                        : undefined,
                },
            });
            this.autocomplete = new google.maps.places.AutocompleteService();
            this.places = new google.maps.places.PlacesService(this.map);
            if (onInit)
                onInit();
        })
            .catch((_error) => ({}));
    }
    addEventListener(event, listener, opts) {
        var _a, _b;
        if (!this.map)
            return;
        (_a = this.eventListeners[event]) === null || _a === void 0 ? void 0 : _a.remove();
        const isAttachedOnce = (_b = opts === null || opts === void 0 ? void 0 : opts.once) !== null && _b !== void 0 ? _b : false;
        const callback = event === "click"
            ? (e) => { var _a; return listener((_a = e === null || e === void 0 ? void 0 : e.latLng) === null || _a === void 0 ? void 0 : _a.toJSON()); }
            : listener;
        let eventListener;
        if (isAttachedOnce)
            eventListener = google.maps.event.addListenerOnce(this.map, this.toEvent(event), callback);
        else
            eventListener = google.maps.event.addListener(this.map, event, callback);
        this.eventListeners[event] = eventListener;
    }
    removeEventListener(event) {
        var _a;
        (_a = this.eventListeners[event]) === null || _a === void 0 ? void 0 : _a.remove();
    }
    removeAllEventListeners() {
        Object.entries(this.eventListeners).forEach(([, listener]) => listener.remove());
    }
    destroy() {
        var _a;
        (_a = this.loader) === null || _a === void 0 ? void 0 : _a.deleteScript();
        this.removeAllEventListeners();
    }
    plotGrid(grid, onClick) {
        this.grid = grid.lines.map((line, index) => {
            var _a;
            const map_type_id = (_a = this.map) === null || _a === void 0 ? void 0 : _a.getMapTypeId();
            const strokeColor = this.getGridStrokeColor(map_type_id);
            const strokeOpacity = this.getGridStrokeOpacity(map_type_id);
            const gridline = new google.maps.Polyline({
                path: [line.start, line.end],
                geodesic: false,
                strokeWeight: 1,
                strokeOpacity,
                strokeColor,
            });
            this.eventListeners[`grid-${index}`] = gridline.addListener("click", async (e) => {
                var _a;
                const coordinates = (_a = e === null || e === void 0 ? void 0 : e.latLng) === null || _a === void 0 ? void 0 : _a.toJSON();
                const zoom = this.zoom;
                this.panTo(coordinates);
                if (zoom && zoom < MIN_GRID_ZOOM_LEVEL) {
                    this.zoom = this.selected_zoom;
                }
                if (onClick && coordinates)
                    onClick(coordinates);
            });
            gridline.setMap(this.map);
            return gridline;
        });
    }
    clearGrid() {
        this.grid.forEach((polyline) => {
            if (!polyline)
                return;
            polyline.setVisible(false);
            polyline.setMap(null);
        });
        this.grid = [];
    }
    plotSquare(square) {
        if (this.square)
            this.square.setMap(null);
        this.square = this.createSquare(square);
        this.square.setMap(this.map);
    }
    plotMarker(address, callback, markerIcon = MARKER_SRC) {
        var _a;
        if (this.marker) {
            this.marker.setMap(null);
            (_a = this.eventListeners.drag) === null || _a === void 0 ? void 0 : _a.remove();
        }
        this.marker = new google.maps.Marker({
            icon: markerIcon,
            map: this.map,
            optimized: true,
            position: address.coordinates,
            title: address.words,
            clickable: true,
            draggable: true,
        });
        this.eventListeners.drag = this.marker.addListener("dragend", this.onChangePosition(callback).bind(this));
    }
    get center() {
        var _a;
        if (!this.map)
            return;
        return (_a = this.map.getCenter()) === null || _a === void 0 ? void 0 : _a.toJSON();
    }
    set center(coordinate) {
        if (!this.map)
            return;
        this.map.setCenter(coordinate);
    }
    get zoom() {
        if (!this.map)
            return;
        return this.map.getZoom();
    }
    set zoom(zoom) {
        if (!this.map)
            return;
        this.map.setZoom(zoom);
    }
    /**
     * Retrieves bounds from map instance if present and returns w3w boundingBox object; otherwise returns the set default.
     * @returns Bounds a w3w bounding box object
     */
    get bounds() {
        return this.convertToW3wBounds(this.mapBounds);
    }
    /**
     * Retrieves bounds from map instance if present; otherwise returns the set default.
     * See https://developers.google.com/maps/documentation/javascript/reference/coordinates#LatLngBoundsLiteral
     * @returns mapBounds a LatLngBoundsLiteral object
     */
    get mapBounds() {
        var _a;
        if (!this.map)
            return DEFAULTS.bounds;
        const mapBounds = JSON.parse(JSON.stringify((_a = this.map.getBounds()) !== null && _a !== void 0 ? _a : DEFAULTS.bounds));
        return mapBounds;
    }
    set viewType(type) {
        if (!this.map)
            return;
        this.map.setMapTypeId(type);
    }
    set options(options) {
        if (!this.map)
            return;
        this.map.setOptions(options);
    }
    set mapTypeControlPosition(position) {
        if (!this.map || !this.isMapControlPosition(position))
            return;
        this.map.setOptions({
            mapTypeControlOptions: {
                position,
            },
        });
    }
    set zoomControlPosition(position) {
        if (!this.map || !this.isMapControlPosition(position))
            return;
        this.map.setOptions({
            zoomControlOptions: {
                position,
            },
        });
    }
    set fullscreenControlPosition(position) {
        if (!this.map || !this.isMapControlPosition(position))
            return;
        this.map.setOptions({
            fullscreenControlOptions: {
                position,
            },
        });
    }
    set streetViewControlPosition(position) {
        if (!this.map || !this.isMapControlPosition(position))
            return;
        this.map.setOptions({
            streetViewControlOptions: {
                position,
            },
        });
    }
    set rotateControlPosition(position) {
        if (!this.map || !this.isMapControlPosition(position))
            return;
        this.map.setOptions({
            rotateControlOptions: {
                position,
            },
        });
    }
    set mapTypeId(id) {
        if (!this.map)
            return;
        this.map.setMapTypeId(id);
    }
    panTo(coordinate) {
        if (!this.map || !coordinate)
            return;
        this.map.panTo(coordinate);
    }
    setMapControlPosition(control, position) {
        if (!this.map || !this.isMapControlPosition(position))
            return;
        this.map.controls[position] = new google.maps.MVCArray([
            ...this.map.controls[position].getArray(),
            control,
        ]); // BUG: type coersion shouldn't be necessary
    }
    getPlacesSuggestions(input, origin, language) {
        return new Promise((res, rej) => {
            var _a;
            const query = {
                input,
                language,
                origin: origin !== null && origin !== void 0 ? origin : undefined,
            };
            (_a = this.autocomplete) === null || _a === void 0 ? void 0 : _a.getPlacePredictions(query, (places, status) => {
                if (status !== google.maps.places.PlacesServiceStatus.OK) {
                    rej(status);
                }
                if (!places)
                    return;
                res(places.map((place) => ({
                    id: place.place_id,
                    description: place.description,
                    value: place.description,
                    distance: { value: place.distance_meters, units: "m" },
                })));
            });
        });
    }
    getCoordinatesFromPlace(id) {
        return new Promise((res, rej) => {
            var _a;
            (_a = this.places) === null || _a === void 0 ? void 0 : _a.getDetails({ placeId: id }, (address, status) => {
                var _a, _b;
                if (status !== google.maps.places.PlacesServiceStatus.OK) {
                    rej(status);
                }
                if (!address)
                    res(null);
                res((_b = (_a = address.geometry.location) === null || _a === void 0 ? void 0 : _a.toJSON()) !== null && _b !== void 0 ? _b : null);
            });
        });
    }
    addControl(control, position) {
        if (!this.map || !this.isMapControlPosition(position))
            return;
        this.map.controls[position] = new google.maps.MVCArray([
            ...this.map.controls[position].getArray(),
            control,
        ]); // BUG: type coersion shouldn't be necessary
    }
    createSquare(square) {
        return new google.maps.Rectangle({
            bounds: new google.maps.LatLngBounds(square.southwest, square.northeast),
            strokeWeight: 1,
            fillColor: "#0A3049",
            strokeColor: "#0A3049",
            strokePosition: google.maps.StrokePosition.INSIDE,
        });
    }
    getGridStrokeColor(map_type_id) {
        switch (map_type_id) {
            case google.maps.MapTypeId.SATELLITE:
            case google.maps.MapTypeId.HYBRID:
                return "#FFFFFF";
            case google.maps.MapTypeId.ROADMAP:
            case google.maps.MapTypeId.TERRAIN:
            default:
                return "#0A3049";
        }
    }
    getGridStrokeOpacity(map_type_id) {
        switch (map_type_id) {
            case google.maps.MapTypeId.SATELLITE:
            case google.maps.MapTypeId.HYBRID:
                return 0.3;
            case google.maps.MapTypeId.ROADMAP:
            case google.maps.MapTypeId.TERRAIN:
            default:
                return 0.1;
        }
    }
    isMapControlPosition(position) {
        if (!position)
            return false;
        return Object.values(google.maps.ControlPosition).includes(position);
    }
    onChangePosition(callback) {
        return async (e) => {
            var _a;
            const coordinates = (_a = e.latLng) === null || _a === void 0 ? void 0 : _a.toJSON();
            const zoom = this.zoom;
            if (zoom && zoom < MIN_GRID_ZOOM_LEVEL) {
                this.panTo(coordinates);
                this.zoom = this.selected_zoom;
            }
            if (callback && coordinates)
                callback(coordinates);
        };
    }
    toEvent(event) {
        switch (event) {
            case "loaded":
                return "tilesloaded";
            case "maptype_changed":
                return "maptypeid_changed";
            default:
                return event;
        }
    }
    /**
     * @param gmapsBounds a gmaps literal bounds object
     */
    convertToW3wBounds({ south, west, north, east, }) {
        return {
            southwest: { lat: south, lng: west },
            northeast: { lat: north, lng: east },
        };
    }
    /**
     * @param w3wBounds a w3w bounding box object
     */
    convertToBounds({ southwest, northeast, }) {
        const { lat: south, lng: west } = southwest;
        const { lat: north, lng: east } = northeast;
        return { south, west, north, east };
    }
}

const what3wordsMapCss = "what3words-map{display:block}";

const What3wordsMap$1 = /*@__PURE__*/ proxyCustomElement(class What3wordsMap extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.selected_square = createEvent(this, "selected_square", 7);
        this.coordinates_changed = createEvent(this, "coordinates_changed", 7);
        this.__load = createEvent(this, "__load", 7);
        this.__error = createEvent(this, "__error", 7);
        var _a;
        this.api_key = DEFAULTS.emptyString;
        this.headers = DEFAULTS.headers;
        this.base_url = (_a = sdk.api.clients.gridSection["_config"].host) !== null && _a !== void 0 ? _a : DEFAULTS.base_url;
        this.api_version = distExports.ApiVersion.Version3;
        /**
         * The three word address to load after initial map render. If empty, map will remain at the provided/default lat, lng values
         */
        this.words = DEFAULTS.emptyString;
        this.map_provider = "google";
        this.map_api_key = DEFAULTS.emptyString;
        this.version = "weekly";
        this.libraries = [];
        /**
         * Passed to the maps provider sdk. Also used as the default w3w language.
         * Cross-compatible language support is not guaranteed between the map provider and w3w sdks.
         * w3w language default behavior can be overridden by setting the what3words-autosuggest language prop to a supported language.
         * See https://developers.google.com/maps/faq#languagesupport
         * See https://developer.what3words.com/public-api/docs#available-languages
         */
        this.language = "en";
        this.region = "GB";
        /**
         * Latitude value used on initial map render. Defaults to What3Words HQ latitude.
         */
        this.lat = DEFAULTS.center.lat;
        /**
         * Longitude value used on initial map render. Defaults to What3Words HQ longitude.
         */
        this.lng = DEFAULTS.center.lng;
        this.tilt = 0;
        this.zoom = 8;
        this.zoom_control_position = 0;
        this.map_type_control_position = 0;
        this.street_view_control_position = 0;
        this.rotate_control_position = 0;
        this.fullscreen_control_position = 0;
        this.search_control_position = TOP_LEFT;
        this.current_location_control_position = 0;
        this.selected_zoom = SELECTED_ZOOM_LEVEL;
        this.marker_icon = MARKER_SRC;
        this.searchControlSlot = DEFAULTS.null;
        this.currentLocationControlSlot = DEFAULTS.null;
        this.zoomControlSlot = DEFAULTS.null;
        this.mapTypeControlSlot = DEFAULTS.null;
        this.mapLoaded = false;
        this.input = DEFAULTS.null;
        this.autosuggest = DEFAULTS.null;
        this.placesSuggestions = [];
        this.apiRequestTimeout = DEFAULTS.null;
        this.watch_id = DEFAULTS.null;
        this.provider = DEFAULTS.null;
        this.current_location_coordinates = DEFAULTS.null;
        this.w3wLanguage = this.language;
        this.clients = {};
    }
    async setApiKey(key) {
        Object.values(this.clients).forEach((client) => client.apiKey(key));
    }
    async setBaseUrl(host) {
        Object.values(this.clients).forEach((client) => client.config({ host }));
    }
    async setHeaders(value) {
        const componentHeaders = this.getComponentHeaders();
        const injectedHeaders = (typeof value === "string" ? JSON.parse(value) : value);
        Object.values(this.clients).forEach((client) => client.config({
            headers: Object.assign(Object.assign({}, injectedHeaders), componentHeaders),
        }));
    }
    async setApiVersion(api_version) {
        Object.values(this.clients).forEach((client) => client.config({ apiVersion: api_version }));
    }
    async setWords(words) {
        var _a;
        if (!W3W_REGEX.test(words) || !this.provider)
            return;
        (_a = this.clients.convertToCoordinates) === null || _a === void 0 ? void 0 : _a.run({ words }).then((response) => {
            if (!this.provider)
                return;
            const { square, coordinates } = response;
            this.provider.plotSquare(square);
            this.provider.plotMarker(response, (coordinates) => this.coordinates_changed.emit(coordinates), this.marker_icon);
            this.provider.panTo(coordinates);
            const { zoom } = this.provider;
            if (zoom && zoom < this.selected_zoom)
                this.provider.zoom = this.selected_zoom;
            this.setInputValue(words);
        }).catch((error) => {
            // TODO: Clean up error type checking
            if (Object.prototype.hasOwnProperty.call(error, "message")) {
                this.__error.emit(error);
                console.error(error.message);
            }
            else if (Object.prototype.hasOwnProperty.call(error, "details")) {
                // manual type coercion based off @what3words/api/dist/lib/transport/error.d.ts
                const transportError = error;
                this.__error.emit(new ErrorEvent(transportError.details.message));
                console.error(transportError.details.message);
            }
        });
    }
    async clearGrid() {
        if (!this.provider)
            return;
        this.provider.clearGrid();
    }
    async getLat() {
        var _a;
        if (!this.provider)
            return 0;
        return (_a = this.provider.center) === null || _a === void 0 ? void 0 : _a.lat;
    }
    async setCoordinates(newCoordinateValue, _oldCoordinateValue, propName) {
        if (!this.provider)
            return;
        const newCoordinates = {
            lat: this.lat,
            lng: this.lng,
            [propName]: newCoordinateValue,
        };
        const validatedCoordinates = this.validateCoordinates(newCoordinates);
        this.lng = validatedCoordinates.lng;
        this.lat = validatedCoordinates.lat;
        this.provider.center = validatedCoordinates;
    }
    async getLng() {
        var _a;
        if (!this.provider)
            return 0;
        return (_a = this.provider.center) === null || _a === void 0 ? void 0 : _a.lng;
    }
    async setZoom(zoom) {
        if (!this.provider)
            return;
        this.provider.zoom = zoom;
    }
    async getZoom() {
        if (!this.provider)
            return 0;
        return this.provider.zoom;
    }
    async getBounds() {
        if (!this.provider)
            return DEFAULTS.bounds;
        return this.provider.mapBounds;
    }
    async panTo(coordinates) {
        if (!this.provider)
            return;
        this.provider.panTo(coordinates);
    }
    async setMapTypeId(map_type_id) {
        if (!this.provider)
            return;
        this.provider.mapTypeId = map_type_id;
    }
    setMapControlPosition(control, position) {
        if (!this.provider)
            return;
        this.provider.setMapControlPosition(control, position);
    }
    setSearchControlPosition(position) {
        this.searchControlSlot = this.el.querySelector(SEARCH_CONTROL_SELECTOR);
        if (this.searchControlSlot) {
            this.setMapControlPosition(this.searchControlSlot, position);
        }
    }
    setCurrentLocationControlPosition(position) {
        this.currentLocationControlSlot = this.el.querySelector(CURRENT_LOCATION_CONTROL_SELECTOR);
        if (this.currentLocationControlSlot) {
            this.setMapControlPosition(this.currentLocationControlSlot, position);
        }
    }
    setMapTypeControlPosition(position) {
        if (!this.provider)
            return;
        this.provider.mapTypeControlPosition = position;
        this.mapTypeControlSlot = this.el.querySelector(MAP_TYPE_CONTROL_SELECTOR);
        if (this.mapTypeControlSlot) {
            this.setMapControlPosition(this.mapTypeControlSlot, position);
        }
    }
    setZoomControlPosition(position) {
        if (!this.provider)
            return;
        this.provider.zoomControlPosition = position;
        this.zoomControlSlot = this.el.querySelector(ZOOM_CONTROL_SELECTOR);
        if (this.zoomControlSlot) {
            this.setMapControlPosition(this.zoomControlSlot, position);
        }
    }
    setFullscreenControlPosition(position) {
        if (!this.provider)
            return;
        this.provider.fullscreenControlPosition = position;
    }
    setStreetViewControlPosition(position) {
        if (!this.provider)
            return;
        this.provider.streetViewControlPosition = position;
    }
    setRotateControlPosition(position) {
        if (!this.provider)
            return;
        this.provider.rotateControlPosition = position;
    }
    handlePlacesSuggestions(suggestions) {
        if (this.autosuggest)
            this.autosuggest.options = suggestions;
    }
    validateCoordinates(coordinates) {
        // NOTE: the Google Maps SDK will clamp lat/lng values
        // See https://developers.google.com/maps/documentation/javascript/reference/coordinates#LatLng
        if (isNaN(coordinates.lat) ||
            isNaN(coordinates.lng) ||
            coordinates.lng === 0 ||
            coordinates.lat === 0) {
            return Object.assign(Object.assign({}, coordinates), { lat: DEFAULTS.center.lat, lng: DEFAULTS.center.lng });
        }
        return coordinates;
    }
    async onLoad() {
        const { words } = this;
        const isBrowser = typeof window !== "undefined";
        const searchControl = this.el.querySelector(SEARCH_CONTROL_SELECTOR);
        if (isBrowser && this.watch_location) {
            await this.watchPosition();
        }
        else if (isBrowser && this.current_location) {
            this.getCurrentPosition();
        }
        if (words) {
            await this.setWords(words);
        }
        if (searchControl && this.provider) {
            this.provider.addControl(searchControl, this.search_control_position);
        }
    }
    async onSelectedCoordinates({ detail: { lat, lng }, }) {
        var _a;
        return (_a = this.clients.convertTo3wa) === null || _a === void 0 ? void 0 : _a.run({
            coordinates: { lat, lng },
            language: this.w3wLanguage,
        }).then((response) => {
            var _a, _b, _c;
            if (!this.provider)
                return;
            const { square, words } = response;
            this.setInputValue(words);
            // revert w3w language to map language (default) to maintain user language setting
            // e.g. sets to response.language during input change (`onSelectedSuggestion`)
            if (![(_a = this.autosuggest) === null || _a === void 0 ? void 0 : _a.language, this.language].includes(this.w3wLanguage)) {
                this.w3wLanguage = (_c = (_b = this.autosuggest) === null || _b === void 0 ? void 0 : _b.language) !== null && _c !== void 0 ? _c : this.language;
            }
            this.provider.plotSquare(square);
            this.provider.plotMarker(response, (coordinates) => this.coordinates_changed.emit(coordinates), this.marker_icon);
            this.selected_square.emit(response);
        }).catch((error) => {
            // TODO: Clean up error type checking
            if (Object.prototype.hasOwnProperty.call(error, "message")) {
                this.__error.emit(error);
                console.error(error.message);
            }
            else if (Object.prototype.hasOwnProperty.call(error, "details")) {
                // manual type coercion based off @what3words/api/dist/lib/transport/error.d.ts
                const transportError = error;
                this.__error.emit(new ErrorEvent(transportError.details.message));
                console.error(transportError.details.message);
            }
        });
    }
    initProvider(opts = {}) {
        if (!this.provider)
            return;
        const _opts = Object.assign({ version: this.version, api_key: this.map_api_key, libraries: this.libraries, language: this.language, region: this.region, center: { lat: this.lat, lng: this.lng }, tilt: this.tilt, disable_default_ui: this.disable_default_ui, zoom: this.zoom, zoom_control: this.zoom_control, zoom_control_position: this.zoom_control_position, map_type_id: this.map_type_id, map_type_control: this.map_type_control, map_type_control_position: this.map_type_control_position, scale_control: this.scale_control, street_view_control: this.street_view_control, street_view_control_position: this.street_view_control_position, rotate_control: this.rotate_control, rotate_control_position: this.rotate_control_position, fullscreen_control: this.fullscreen_control, fullscreen_control_position: this.fullscreen_control_position }, opts);
        const mapDiv = this.el.querySelector(MAP_SELECTOR);
        if (!mapDiv) {
            // TODO: Add error logging
            return;
        }
        this.provider.init(mapDiv, _opts);
    }
    watchMapVersion(version) {
        this.initProvider({ version });
    }
    watchMapApiKey(api_key) {
        this.initProvider({ api_key });
    }
    watchMapLibraries(libraries) {
        this.initProvider({ libraries });
    }
    watchMapLanguage(language) {
        this.initProvider({ language });
    }
    watchMapRegion(region) {
        this.initProvider({ region });
    }
    setMapLoaded(loaded) {
        this.mapLoaded = loaded;
    }
    async onCurrentPositionSuccess(position) {
        const { coords: { latitude: lat, longitude: lng }, } = position;
        if (!this.provider)
            return;
        const center = this.provider.center;
        const hasLocationChanged = (center === null || center === void 0 ? void 0 : center.lat) !== lat || center.lng !== lng;
        if (hasLocationChanged) {
            this.provider.panTo({ lat, lng });
            this.provider.zoom = this.selected_zoom;
            this.coordinates_changed.emit({ lat, lng });
            this.current_location_coordinates = { lat, lng };
        }
    }
    onCurrentPositionFailure(error) {
        this.__error.emit(new ErrorEvent(error.message));
    }
    async watchPosition() {
        this.watch_id = window.navigator.geolocation.watchPosition((position) => {
            this.onCurrentPositionSuccess(position).catch((_error) => {
                // TODO: Add error logging
            });
        }, (error) => {
            this.onCurrentPositionFailure(error);
        });
    }
    clearWatchPosition() {
        if (this.watch_id) {
            window.navigator.geolocation.clearWatch(this.watch_id);
        }
    }
    getCurrentPosition() {
        window.navigator.geolocation.getCurrentPosition((position) => {
            this.onCurrentPositionSuccess(position).catch((_error) => {
                // TODO: Add error logging
            });
        }, (error) => {
            this.onCurrentPositionFailure(error);
        });
    }
    addMapEventListeners() {
        if (!this.provider)
            return;
        this.provider.addEventListener("maptype_changed", this.plotGrid.bind(this));
        this.provider.addEventListener("zoom_changed", this.plotGrid.bind(this));
        this.provider.addEventListener("bounds_changed", this.plotGrid.bind(this));
        this.provider.addEventListener("click", this.onChangePosition.bind(this));
    }
    setupAutosuggest() {
        var _a;
        if (!this.autosuggest)
            return;
        // Set w3wLanguage to autosuggest language or default both to map language
        if (this.autosuggest.hasAttribute("language")) {
            this.w3wLanguage =
                (_a = this.autosuggest.getAttribute("language")) !== null && _a !== void 0 ? _a : this.w3wLanguage; // coalescing operator used to coerce string type
        }
        else {
            this.w3wLanguage = this.language;
            this.autosuggest.setAttribute("language", this.language);
        }
        // Setup autosuggest api_key if not set
        if (!this.autosuggest.hasAttribute("api_key")) {
            this.autosuggest.setAttribute("api_key", this.api_key);
        }
        this.autosuggest.strict = false;
    }
    addAutosuggestEventListeners() {
        if (!this.autosuggest)
            return;
        this.autosuggest.addEventListener("__focus", this.onControlFocus.bind(this));
        this.autosuggest.addEventListener("value_valid", this.onValueValid.bind(this));
        this.autosuggest.addEventListener("value_invalid", this.onValueInvalid.bind(this));
        this.autosuggest.addEventListener("selected_suggestion", this.onSelectedSuggestion.bind(this));
        this.autosuggest.addEventListener("selected_custom_option", this.onCustomSelect.bind(this));
    }
    removeAutosuggestEventListeners() {
        if (!this.autosuggest)
            return;
        this.autosuggest.removeEventListener("__focus", this.onControlFocus.bind(this));
        this.autosuggest.removeEventListener("value_valid", this.onValueValid.bind(this));
        this.autosuggest.removeEventListener("value_invalid", this.onValueInvalid.bind(this));
        this.autosuggest.removeEventListener("selected_suggestion", this.onSelectedSuggestion.bind(this));
        this.autosuggest.removeEventListener("selected_custom_option", this.onCustomSelect.bind(this));
    }
    removeMapEventListeners() {
        if (!this.provider)
            return;
        this.provider.removeAllEventListeners();
    }
    addCurrentLocationEventListeners() {
        if (!this.currentLocationControlSlot)
            return;
        this.currentLocationControlSlot.addEventListener("click", () => {
            this.getCurrentPosition();
        });
    }
    removeCurrentLocationEventListeners() {
        this.currentLocationControlSlot = this.el.querySelector(CURRENT_LOCATION_CONTROL_SELECTOR);
        if (!this.currentLocationControlSlot)
            return;
        this.currentLocationControlSlot.removeEventListener("click", () => {
            this.getCurrentPosition();
        });
    }
    plotGrid() {
        if (!this.provider)
            return;
        const zoom = this.provider.zoom;
        const boundingBox = this.provider.bounds;
        const gridSectionOpt = {
            boundingBox,
        };
        if (this.apiRequestTimeout)
            clearTimeout(this.apiRequestTimeout);
        if (zoom && zoom < MIN_GRID_ZOOM_LEVEL) {
            this.clearGrid().catch(() => {
                // TODO: Add error logging
            });
        }
        this.apiRequestTimeout = setTimeout(() => {
            var _a;
            (_a = this.clients.gridSection) === null || _a === void 0 ? void 0 : _a.run(gridSectionOpt).then((grid) => {
                if (!this.provider)
                    return;
                this.provider.clearGrid();
                this.provider.plotGrid(grid, (coordinates) => {
                    this.coordinates_changed.emit(coordinates);
                });
            }).catch((_error) => {
                // TODO: Add error logging
            });
        }, 100);
    }
    onChangePosition(coordinates) {
        if (!this.provider)
            return;
        const zoom = this.provider.zoom;
        if (zoom && zoom < MIN_GRID_ZOOM_LEVEL) {
            this.provider.zoom = this.selected_zoom;
        }
        this.provider.panTo(coordinates);
        this.coordinates_changed.emit(coordinates);
    }
    onSelectedSuggestion(event) {
        var _a;
        const { detail: { suggestion: { words }, }, } = event;
        // convert coordinates to 3wa
        (_a = this.clients.convertToCoordinates) === null || _a === void 0 ? void 0 : _a.run({
            words,
        }).then(async (response) => {
            // pan to the selected coordinates and zoom to selected zoom if changed
            await this.panTo(response.coordinates);
            const zoom = await this.getZoom();
            if (this.reset_zoom_on_select && zoom !== this.selected_zoom) {
                // check and reset zoom level to default (selected_zoom)
                // NOTE: larger zoom value = higher resolution / zoom in
                await this.setZoom(this.selected_zoom);
            }
            // store detected language if changed
            if (response.language !== this.w3wLanguage) {
                this.w3wLanguage = response.language;
            }
            this.coordinates_changed.emit(response.coordinates);
        }).catch((error) => {
            // TODO: Clean up error type checking
            if (Object.prototype.hasOwnProperty.call(error, "message")) {
                this.__error.emit(error);
                console.error(error.message);
            }
            else if (Object.prototype.hasOwnProperty.call(error, "details")) {
                // manual type coercion based off @what3words/api/dist/lib/transport/error.d.ts
                const transportError = error;
                this.__error.emit(new ErrorEvent(transportError.details.message));
                console.error(transportError.details.message);
            }
        });
    }
    onCustomSelect(event) {
        if (!this.provider)
            return;
        const { id } = event.detail;
        this.provider
            .getCoordinatesFromPlace(id)
            .then((coordinates) => {
            if (!coordinates)
                return;
            if (!this.provider)
                return;
            const zoom = this.provider.zoom;
            if (zoom !== this.selected_zoom)
                this.zoom = this.selected_zoom;
            this.provider.panTo(coordinates);
            this.coordinates_changed.emit(coordinates);
        })
            .catch((error) => {
            this.__error.emit(new ErrorEvent("ServiceError", {
                message: DEFAULTS.serviceErrorMessage,
                error,
            }));
            return;
        });
    }
    onControlFocus() {
        if (this.input && /^(\/\/\/)?$/i.test(this.input.value)) {
            this.input.value = "";
        }
    }
    onValueValid() {
        if (this.apiRequestTimeout)
            clearTimeout(this.apiRequestTimeout);
        this.placesSuggestions = [];
    }
    onValueInvalid(e) {
        var _a;
        const { detail: { value }, } = e;
        if (this.apiRequestTimeout)
            clearTimeout(this.apiRequestTimeout);
        if (value.length > 3) {
            this.apiRequestTimeout = setTimeout(() => {
                var _a;
                if (!this.provider)
                    return;
                this.provider
                    .getPlacesSuggestions(value, (_a = this.current_location_coordinates) !== null && _a !== void 0 ? _a : undefined, this.language)
                    .then((placesSuggestions) => {
                    this.placesSuggestions = placesSuggestions;
                })
                    .catch((error) => {
                    this.__error.emit(new ErrorEvent("ServiceError", {
                        error,
                        message: DEFAULTS.serviceErrorMessage,
                    }));
                });
            }, (_a = this.autosuggest) === null || _a === void 0 ? void 0 : _a.typeahead_delay);
        }
    }
    setInputValue(words) {
        if (this.input) {
            this.input.value = "///" + words;
        }
    }
    createProvider() {
        const { map_provider } = this;
        switch (map_provider) {
            case "google":
            default:
                return new GoogleMaps();
        }
    }
    onProviderInit() {
        if (!this.provider)
            return;
        const { el } = this;
        this.searchControlSlot = el.querySelector(SEARCH_CONTROL_SELECTOR);
        this.currentLocationControlSlot = el.querySelector(CURRENT_LOCATION_CONTROL_SELECTOR);
        this.mapTypeControlSlot = el.querySelector(MAP_TYPE_CONTROL_SELECTOR);
        this.zoomControlSlot = el.querySelector(ZOOM_CONTROL_SELECTOR);
        this.autosuggest = this.searchControlSlot
            ? this.searchControlSlot.querySelector(AUTOSUGGEST_SELECTOR)
            : null;
        this.input = this.autosuggest
            ? this.autosuggest.querySelector(SELECTORS.input)
            : null;
        this.setMapLoaded(true);
        this.addMapEventListeners();
        this.addCurrentLocationEventListeners();
        this.provider.addControl(this.searchControlSlot, this.search_control_position);
        this.provider.addControl(this.currentLocationControlSlot, this.current_location_control_position);
        this.provider.addControl(this.mapTypeControlSlot, this.map_type_control_position);
        this.provider.addControl(this.zoomControlSlot, this.zoom_control_position);
        this.setupAutosuggest();
        this.addAutosuggestEventListeners();
        this.provider.addEventListener("loaded", this.__load.emit.bind(this), {
            once: true,
        });
    }
    getComponentHeaders() {
        const { current_location, disable_default_ui, map_type_control, map_type_id, street_view_control, watch_location, } = this;
        const component_session_id = window.what3words_session_id;
        const meta = JSON.stringify({
            current_location,
            component_session_id,
            disable_default_ui,
            map_type_control,
            map_type_id,
            origin: window.location.origin,
            street_view_control,
            watch_location,
        });
        return {
            "X-W3W-AS-Component": `what3words-Map-JS/${version} (${meta})`,
        };
    }
    connectedCallback() {
        const { el, lat, lng } = this;
        // Prop validations
        const coordinates = this.validateCoordinates({ lat, lng });
        this.lat = coordinates.lat;
        this.lng = coordinates.lng;
        // Initialise provider
        const mapDiv = el.querySelector(MAP_SELECTOR);
        this.searchControlSlot = el.querySelector(SEARCH_CONTROL_SELECTOR);
        this.provider = this.createProvider();
        if (this.mapLoaded)
            this.provider.destroy(); // Do not re-initialise if map already loaded, just re-attach listeners, controls etc.
        if (!mapDiv)
            return;
        this.provider.init(mapDiv, {
            version: this.version,
            api_key: this.map_api_key,
            libraries: this.libraries,
            language: this.language,
            region: this.region,
            center: { lat: this.lat, lng: this.lng },
            tilt: this.tilt,
            disable_default_ui: this.disable_default_ui,
            zoom: this.zoom,
            zoom_control: this.zoom_control,
            zoom_control_position: this.zoom_control_position,
            map_type_id: this.map_type_id,
            map_type_control: this.map_type_control,
            map_type_control_position: this.map_type_control_position,
            scale_control: this.scale_control,
            street_view_control: this.street_view_control,
            street_view_control_position: this.street_view_control_position,
            rotate_control: this.rotate_control,
            rotate_control_position: this.rotate_control_position,
            fullscreen_control: this.fullscreen_control,
            fullscreen_control_position: this.fullscreen_control_position,
        }, this.onProviderInit.bind(this));
        // Configure service clients
        const componentHeaders = this.getComponentHeaders();
        const headers = Object.assign(Object.assign({}, componentHeaders), (typeof this.headers === "string"
            ? JSON.parse(this.headers)
            : this.headers));
        const config = {
            apiVersion: this.api_version,
            headers,
            host: this.base_url,
        };
        const transport = distExports.fetchTransport();
        this.clients = {
            convertToCoordinates: what3wordsClients.convertToCoordinates(this.api_key, config, transport),
            convertTo3wa: what3wordsClients.convertTo3wa(this.api_key, config, transport),
            gridSection: what3wordsClients.gridSection(this.api_key, config, transport),
        };
    }
    disconnectedCallback() {
        var _a;
        this.removeAutosuggestEventListeners();
        this.removeMapEventListeners();
        this.removeCurrentLocationEventListeners();
        this.clearWatchPosition();
        (_a = this.provider) === null || _a === void 0 ? void 0 : _a.destroy();
    }
    render() {
        const controlsWrapperStyle = {
            visibility: this.mapLoaded ? "visible" : "hidden",
        };
        const controlsWrapperAttributes = {
            "aria-hidden": this.mapLoaded ? "false" : "true",
            style: controlsWrapperStyle,
        };
        return (h(Host, { key: '762c2fce04720bd0c394570f7a660a43c4abb400' }, h("slot", { key: '2f00c593b35d5c476737cf269a7d9659d17d9bd2', name: "map" }), h("div", Object.assign({ key: '7b40ab724034f61140673873a0aff3bede52702c', id: "controls-wrapper", "data-testid": "controls-wrapper" }, controlsWrapperAttributes), h("slot", { key: '6bf48944766b0f97992b59f40dc41f35e2b27889', name: "search-control" }), h("slot", { key: 'a03e186f7bba3c6616ee9b9ad518ff65a734cdd6', name: "map-type-control" }), h("slot", { key: '04cf2c2471d5b9d1a1de5bd31f1ed8a50c8b77a1', name: "zoom-control" }), h("slot", { key: 'b39844002c09cf20bd5bb484687f949642b21eae', name: "current-location-control" }))));
    }
    get el() { return this; }
    static get watchers() { return {
        "api_key": ["setApiKey"],
        "base_url": ["setBaseUrl"],
        "headers": ["setHeaders"],
        "api_version": ["setApiVersion"],
        "words": ["setWords"],
        "lng": ["setCoordinates"],
        "lat": ["setCoordinates"],
        "zoom": ["setZoom"],
        "map_type_id": ["setMapTypeId"],
        "search_control_position": ["setSearchControlPosition"],
        "current_location_control_position": ["setCurrentLocationControlPosition"],
        "map_type_control_position": ["setMapTypeControlPosition"],
        "zoom_control_position": ["setZoomControlPosition"],
        "fullscreen_control_position": ["setFullscreenControlPosition"],
        "street_view_control_position": ["setStreetViewControlPosition"],
        "rotate_control_position": ["setRotateControlPosition"],
        "placesSuggestions": ["handlePlacesSuggestions"],
        "version": ["watchMapVersion"],
        "map_api_key": ["watchMapApiKey"],
        "libraries": ["watchMapLibraries"],
        "language": ["watchMapLanguage"],
        "region": ["watchMapRegion"]
    }; }
    static get style() { return what3wordsMapCss; }
}, [4, "what3words-map", {
        "api_key": [1],
        "headers": [1],
        "base_url": [1],
        "api_version": [1],
        "words": [1],
        "map_provider": [1],
        "map_api_key": [1],
        "version": [1],
        "libraries": [16],
        "language": [1],
        "region": [1],
        "lat": [1026],
        "lng": [1026],
        "tilt": [2],
        "disable_default_ui": [4],
        "zoom": [2],
        "zoom_control": [4],
        "zoom_control_position": [2],
        "map_type_id": [1],
        "map_type_control": [4],
        "map_type_control_position": [2],
        "scale_control": [4],
        "street_view_control": [4],
        "street_view_control_position": [2],
        "rotate_control": [4],
        "rotate_control_position": [2],
        "fullscreen_control": [4],
        "fullscreen_control_position": [2],
        "search_control_position": [2],
        "current_location_control_position": [2],
        "selected_zoom": [2],
        "current_location": [4],
        "watch_location": [4],
        "marker_icon": [1],
        "reset_zoom_on_select": [4],
        "searchControlSlot": [32],
        "currentLocationControlSlot": [32],
        "zoomControlSlot": [32],
        "mapTypeControlSlot": [32],
        "mapLoaded": [32],
        "input": [32],
        "autosuggest": [32],
        "placesSuggestions": [32],
        "apiRequestTimeout": [32],
        "watch_id": [32],
        "provider": [32],
        "current_location_coordinates": [32],
        "w3wLanguage": [32],
        "clients": [32],
        "setApiKey": [64],
        "setBaseUrl": [64],
        "setHeaders": [64],
        "setApiVersion": [64],
        "setWords": [64],
        "clearGrid": [64],
        "getLat": [64],
        "setCoordinates": [64],
        "getLng": [64],
        "setZoom": [64],
        "getZoom": [64],
        "getBounds": [64],
        "panTo": [64],
        "setMapTypeId": [64]
    }, [[0, "__load", "onLoad"], [3, "coordinates_changed", "onSelectedCoordinates"]], {
        "api_key": ["setApiKey"],
        "base_url": ["setBaseUrl"],
        "headers": ["setHeaders"],
        "api_version": ["setApiVersion"],
        "words": ["setWords"],
        "lng": ["setCoordinates"],
        "lat": ["setCoordinates"],
        "zoom": ["setZoom"],
        "map_type_id": ["setMapTypeId"],
        "search_control_position": ["setSearchControlPosition"],
        "current_location_control_position": ["setCurrentLocationControlPosition"],
        "map_type_control_position": ["setMapTypeControlPosition"],
        "zoom_control_position": ["setZoomControlPosition"],
        "fullscreen_control_position": ["setFullscreenControlPosition"],
        "street_view_control_position": ["setStreetViewControlPosition"],
        "rotate_control_position": ["setRotateControlPosition"],
        "placesSuggestions": ["handlePlacesSuggestions"],
        "version": ["watchMapVersion"],
        "map_api_key": ["watchMapApiKey"],
        "libraries": ["watchMapLibraries"],
        "language": ["watchMapLanguage"],
        "region": ["watchMapRegion"]
    }]);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["what3words-map"];
    components.forEach(tagName => { switch (tagName) {
        case "what3words-map":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, What3wordsMap$1);
            }
            break;
    } });
}
defineCustomElement$1();

const What3wordsMap = What3wordsMap$1;
const defineCustomElement = defineCustomElement$1;

export { What3wordsMap, defineCustomElement };
