azure-maps-control 3.0.0-preview.2 → 3.0.0-preview.4

package/dist/atlas-core-snr.js

@@ -77,8 +77,8 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	}
 
 	var azuremapsMaplibreGlDev = createCommonjsModule(function (module, exports) {
-	/* The Azure Maps fork of MapLibre GL JS is licensed under the 3-Clause BSD License. Full text of license: https://github.com/maplibre/maplibre-gl-js/blob/v3.0.0-pre.5/LICENSE.txt */
-	/* Built timestamp: Tue, 13 Dec 2022 16:04:08 GMT */
+	/* Build timestamp: Mon, 16 Jan 2023 10:42:24 GMT */
+	/* The Azure Maps fork of MapLibre GL JS is licensed under the 3-Clause BSD License. Full text of license: https://github.com/maplibre/maplibre-gl-js/blob/v3.0.0-pre.6/LICENSE.txt */
 	(function (global, factory) {
 	 module.exports = factory() ;
 	})(commonjsGlobal, (function () {
@@ -21405,6 +21405,11 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            }
 	            workerTile.vectorTile = response.vectorTile;
 	            workerTile.parse(response.vectorTile, this.layerIndex, this.availableImages, this.actor, (err, result) => {
+	                const reloadCallback = workerTile.reloadCallback;
+	                if (workerTile.reloadCallback) {
+	                    delete workerTile.reloadCallback;
+	                    workerTile.parse(workerTile.vectorTile, this.layerIndex, this.availableImages, this.actor, reloadCallback);
+	                }
 	                if (err || !result)
 	                    return callback(err);
 	                // Transferring a copy of rawTileData because the worker needs to retain its copy.
@@ -23878,7 +23883,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	var packageJSON = {
 	  "name": "azuremaps-maplibre-gl",
 	  "description": "BSD licensed community fork of mapbox-gl, a WebGL interactive maps library",
-	  "version": "3.0.0-pre.5",
+	  "version": "3.0.0-pre.6",
 	  "main": "dist/azuremaps-maplibre-gl.js",
 	  "style": "dist/azuremaps-maplibre-gl.css",
 	  "license": "BSD-3-Clause",
@@ -23968,7 +23973,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    "eslint-plugin-jest": "^27.1.6",
 	    "eslint-plugin-jsdoc": "^39.6.4",
 	    "eslint-plugin-react": "^7.31.11",
-	    "gl": "^6.0.1",
+	    "gl": "^6.0.2",
 	    "glob": "^8.0.3",
 	    "is-builtin-module": "^3.2.0",
 	    "jest": "^28.1.3",
@@ -46380,7 +46385,7 @@ uniform ${precision} ${type} u_${name};
 		msClientIdHeaderName: "x-ms-client-id",
 		msOriginHeaderName: "Ms-Am-Request-Origin",
 		msOriginHeaderValue: "MapControl",
-		resourceId: "https://atlas.microsoft.com/",
+		aadResourceId: "https://atlas.microsoft.com/.default",
 		sessionIdHeaderName: "Session-Id"
 	};
 
@@ -46558,7 +46563,7 @@ uniform ${precision} ${type} u_${name};
 	    return Url;
 	}());
 
-	var version = "3.0.0-preview.2";
+	var version = "3.0.0-preview.4";
 
 	/**
 	 * A helper class that provides methods for getting various forms of the map controls current version.
@@ -46599,27 +46604,6 @@ uniform ${precision} ${type} u_${name};
 	    var tooltipContent = document.createElement("span");
 	    tooltipContent.innerText = name;
 	    tooltipContent.classList.add('tooltiptext');
-	    // mimics default edge tooltip theming
-	    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
-	        tooltipContent.classList.add('dark');
-	    }
-	    var themeQuery = window.matchMedia('(prefers-color-scheme: dark)');
-	    var onThemeChange = function (e) {
-	        var isDark = e.matches;
-	        if (isDark && !tooltipContent.classList.contains('dark')) {
-	            tooltipContent.classList.add('dark');
-	        }
-	        else if (!isDark && tooltipContent.classList.contains('dark')) {
-	            tooltipContent.classList.remove('dark');
-	        }
-	    };
-	    // compensate for browsers where MediaQueryList is not derived from EventTarget (pre iOS13 Safari)
-	    if (typeof themeQuery.addEventListener === 'function') {
-	        themeQuery.addEventListener('change', function (e) { return onThemeChange(e); });
-	    }
-	    else if (typeof themeQuery.addListener === 'function') {
-	        themeQuery.addListener(function (e) { return onThemeChange(e); });
-	    }
 	    if (navigator.userAgent.indexOf('Edg') != -1) {
 	        tooltipContent.classList.add('edge');
 	    }
@@ -50789,6 +50773,10 @@ uniform ${precision} ${type} u_${name};
 	            }
 	        });
 	        container.addEventListener("focusout", function (event) {
+	            if (event.target === currStyleButton) {
+	                // on focusout from reveal button -> reset the tabIndex on the styleOpsGrid elements that could have been set to -1 on esc key press
+	                Array.from(styleOpsGrid.children).forEach(function (e) { return e.removeAttribute('tabIndex'); });
+	            }
 	            if (!(event.relatedTarget instanceof Node && container.contains(event.relatedTarget))) {
 	                _this.hasFocus = false;
 	                if (!_this.hasMouse) {
@@ -50803,6 +50791,7 @@ uniform ${precision} ${type} u_${name};
 	            if (event.keyCode === 27) {
 	                event.stopPropagation();
 	                currStyleButton.focus();
+	                Array.from(styleOpsGrid.children).forEach(function (e) { return e.setAttribute('tabIndex', "-1"); });
 	                if (container.classList.contains(StyleControl.Css.inUse)) {
 	                    container.classList.remove(StyleControl.Css.inUse);
 	                    styleOpsGrid.classList.add("hidden-accessible-element");
@@ -51068,8 +51057,8 @@ uniform ${precision} ${type} u_${name};
 	         * The type of traffic flow to display:
 	         * <p>"none" is to display no traffic flow data</p>
 	         * <p>"relative" is the speed of the road relative to free-flow</p>
-	         * <p>"absolute" is the absolute speed of the road</p>
-	         * <p>"relative-delay" displays relative speed only where they differ from free-flow;
+	         * <p>@deprecated "absolute" is the absolute speed of the road</p>
+	         * <p>@deprecated "relative-delay" displays relative speed only where they differ from free-flow;
 	         * false to stop displaying the traffic flow.</p>
 	         * default `"none"``
 	         * @default "none"
@@ -56469,6 +56458,23 @@ uniform ${precision} ${type} u_${name};
 	         * @default 0.375
 	         */
 	        _this.tolerance = 0.375;
+	        /**
+	         * Minimum number of points necessary to form a cluster if clustering is enabled.
+	         * @default 2
+	         */
+	        _this.clusterMinPoints = 2;
+	        /**
+	         * Whether to generate ids for the geojson features. When enabled, the feature.id property will be auto assigned based on its index in the features array, over-writing any previous values.
+	         */
+	        _this.generateId = false;
+	        /**
+	         * A property to use as a feature id (for feature state). Either a property name, or an object of the form {<sourceLayer>: <propertyName>}.
+	         */
+	        _this.promoteId = undefined;
+	        /**
+	         * An expression for filtering features prior to processing them for rendering.
+	         */
+	        _this.filter = undefined;
 	        return _this;
 	    }
 	    return DataSourceOptions;
@@ -56510,19 +56516,24 @@ uniform ${precision} ${type} u_${name};
 	     * Get reference to Mapbox Map
 	     * @internal
 	     */
-	    Source.prototype._setMap = function (map) {
+	    Source.prototype._setMap = function (map, shouldInvokeEvent) {
+	        if (shouldInvokeEvent === void 0) { shouldInvokeEvent = true; }
 	        if (map == null || map === undefined) {
 	            var temp = this.map;
 	            delete this.map;
-	            this._invokeEvent("sourceremoved", this);
-	            if (temp) {
-	                temp.events.invoke("sourceremoved", this);
+	            if (shouldInvokeEvent) {
+	                this._invokeEvent("sourceremoved", this);
+	                if (temp) {
+	                    temp.events.invoke("sourceremoved", this);
+	                }
 	            }
 	        }
 	        else {
 	            this.map = map;
-	            this._invokeEvent("sourceadded", this);
-	            this.map.events.invoke("sourceadded", this);
+	            if (shouldInvokeEvent) {
+	                this._invokeEvent("sourceadded", this);
+	                this.map.events.invoke("sourceadded", this);
+	            }
 	        }
 	    };
 	    return Source;
@@ -56836,13 +56847,38 @@ uniform ${precision} ${type} u_${name};
 	            tolerance: this.options.tolerance,
 	            lineMetrics: this.options.lineMetrics,
 	            clusterProperties: this.options.clusterProperties,
-	            buffer: this.options.buffer
+	            buffer: this.options.buffer,
+	            clusterMinPoints: this.options.clusterMinPoints,
+	            generateId: this.options.generateId,
+	            promoteId: this.options.promoteId,
+	            filter: this.options.filter
 	        };
 	        if (typeof this.options.clusterMaxZoom === "number") {
 	            geoJsonSource.clusterMaxZoom = this.options.clusterMaxZoom;
 	        }
 	        return geoJsonSource;
 	    };
+	    DataSource.prototype._isDeepEqual = function (other) {
+	        if (this.constructor !== other.constructor) {
+	            return false;
+	        }
+	        var source = this._buildSource();
+	        var otherSource = other._buildSource();
+	        return source.type === otherSource.type &&
+	            // no data comparison since it is costly and not needed. If geojson data is different, but other source properties are same, we treat it as an update.
+	            //source.data === otherSource.data &&
+	            source.maxzoom === otherSource.maxzoom &&
+	            source.cluster === otherSource.cluster &&
+	            source.clusterRadius === otherSource.clusterRadius &&
+	            source.tolerance === otherSource.tolerance &&
+	            source.lineMetrics === otherSource.lineMetrics &&
+	            JSON.stringify(source.clusterProperties) === JSON.stringify(otherSource.clusterProperties) &&
+	            source.buffer === otherSource.buffer &&
+	            source.clusterMinPoints === otherSource.clusterMinPoints &&
+	            source.generateId === otherSource.generateId &&
+	            source.promoteId === otherSource.promoteId &&
+	            source.filter === otherSource.filter;
+	    };
 	    /**
 	     * @internal
 	     */
@@ -57124,19 +57160,262 @@ uniform ${precision} ${type} u_${name};
 	        }
 	        return vectorSource;
 	    };
+	    /**
+	     * @internal
+	     */
+	    VectorTileSource.prototype._isDeepEqual = function (other) {
+	        if (this.constructor !== other.constructor) {
+	            return false;
+	        }
+	        var source = this._buildSource();
+	        var otherSource = other._buildSource();
+	        return source.type === otherSource.type &&
+	            source.url === otherSource.url &&
+	            ((source.tiles === undefined && otherSource.tiles === undefined) ||
+	                (source.tiles && otherSource.tiles && source.tiles.length === otherSource.tiles.length && source.tiles.every(function (value, idx) { return value === otherSource.tiles[idx]; }))) &&
+	            source.minzoom === otherSource.minzoom &&
+	            source.maxzoom === otherSource.maxzoom &&
+	            source.bounds === otherSource.bounds &&
+	            source.attribution === otherSource.attribution &&
+	            source.promoteId === otherSource.promoteId &&
+	            source.scheme === otherSource.scheme;
+	    };
 	    return VectorTileSource;
 	}(Source));
 
+	var __extends$p = (window && window.__extends) || (function () {
+	    var extendStatics = function (d, b) {
+	        extendStatics = Object.setPrototypeOf ||
+	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+	            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+	        return extendStatics(d, b);
+	    };
+	    return function (d, b) {
+	        if (typeof b !== "function" && b !== null)
+	            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+	        extendStatics(d, b);
+	        function __() { this.constructor = d; }
+	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+	    };
+	})();
+	/**
+	 * Used to represent the canvas source wrapper.
+	 * This is not meant to be exposed publicly yet
+	 * @private
+	 */
+	var CanvasSource = /** @class */ (function (_super) {
+	    __extends$p(CanvasSource, _super);
+	    /**
+	     * Constructs a source from the contents of a layer resource file.
+	     * @param id The source's id.
+	     * @param sourceDef Canvas source specification.
+	     * @param options Unused for now
+	     */
+	    function CanvasSource(id, sourceDef, options) {
+	        var _this = _super.call(this, id) || this;
+	        _this.source = sourceDef;
+	        return _this;
+	    }
+	    /**
+	     * @internal
+	     */
+	    CanvasSource.prototype._isDeepEqual = function (other) {
+	        if (this.constructor !== other.constructor) {
+	            return false;
+	        }
+	        var source = this.source;
+	        var otherSource = other.source;
+	        return source.type === otherSource.type
+	            && source.canvas === otherSource.canvas
+	            && JSON.stringify(source.coordinates) === JSON.stringify(otherSource.coordinates)
+	            && source.animate === otherSource.animate;
+	    };
+	    /**
+	     * @internal
+	     */
+	    CanvasSource.prototype._buildSource = function () {
+	        return this.source;
+	    };
+	    return CanvasSource;
+	}(Source));
+
+	var __extends$q = (window && window.__extends) || (function () {
+	    var extendStatics = function (d, b) {
+	        extendStatics = Object.setPrototypeOf ||
+	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+	            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+	        return extendStatics(d, b);
+	    };
+	    return function (d, b) {
+	        if (typeof b !== "function" && b !== null)
+	            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+	        extendStatics(d, b);
+	        function __() { this.constructor = d; }
+	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+	    };
+	})();
+	/**
+	 * Used to represent an unkown source wrapper.
+	 * This is not meant to be exposed publicly yet
+	 * @private
+	 */
+	var UnknownSource = /** @class */ (function (_super) {
+	    __extends$q(UnknownSource, _super);
+	    /**
+	     * Constructs a source from the contents of a layer resource file.
+	     * @param id The source's id.
+	     * @param sourceDef source specification.
+	     * @param options Unused for now
+	     */
+	    function UnknownSource(id, sourceDef, options) {
+	        var _this = _super.call(this, id) || this;
+	        _this.source = sourceDef;
+	        return _this;
+	    }
+	    /**
+	     * @internal
+	     */
+	    UnknownSource.prototype._isDeepEqual = function (other) {
+	        if (this.constructor !== other.constructor) {
+	            return false;
+	        }
+	        var source = this.source;
+	        var otherSource = other.source;
+	        return source.type === otherSource.type;
+	    };
+	    /**
+	     * @internal
+	     */
+	    UnknownSource.prototype._buildSource = function () {
+	        return this.source;
+	    };
+	    return UnknownSource;
+	}(Source));
+
+	var __extends$r = (window && window.__extends) || (function () {
+	    var extendStatics = function (d, b) {
+	        extendStatics = Object.setPrototypeOf ||
+	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+	            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+	        return extendStatics(d, b);
+	    };
+	    return function (d, b) {
+	        if (typeof b !== "function" && b !== null)
+	            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+	        extendStatics(d, b);
+	        function __() { this.constructor = d; }
+	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+	    };
+	})();
+	/**
+	 * Used to represent the image source wrapper.
+	 * This is not meant to be exposed publicly yet
+	 * @private
+	 */
+	var ImageSource = /** @class */ (function (_super) {
+	    __extends$r(ImageSource, _super);
+	    /**
+	     * Constructs a source from the contents of a layer resource file.
+	     * @param id The source's id.
+	     * @param sourceDef Image source specification.
+	     * @param options Unused for now
+	     */
+	    function ImageSource(id, sourceDef, options) {
+	        var _this = _super.call(this, id) || this;
+	        _this.source = sourceDef;
+	        return _this;
+	    }
+	    /**
+	     * @internal
+	     */
+	    ImageSource.prototype._isDeepEqual = function (other) {
+	        if (this.constructor !== other.constructor) {
+	            return false;
+	        }
+	        var source = this.source;
+	        var otherSource = other.source;
+	        return source.type === otherSource.type
+	            && JSON.stringify(source.coordinates) === JSON.stringify(otherSource.coordinates)
+	            && source.url === otherSource.url;
+	    };
+	    /**
+	     * @internal
+	     */
+	    ImageSource.prototype._buildSource = function () {
+	        return this.source;
+	    };
+	    return ImageSource;
+	}(Source));
+
+	var __extends$s = (window && window.__extends) || (function () {
+	    var extendStatics = function (d, b) {
+	        extendStatics = Object.setPrototypeOf ||
+	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+	            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+	        return extendStatics(d, b);
+	    };
+	    return function (d, b) {
+	        if (typeof b !== "function" && b !== null)
+	            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+	        extendStatics(d, b);
+	        function __() { this.constructor = d; }
+	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+	    };
+	})();
+	/**
+	 * Used to represent the video source wrapper.
+	 * This is not meant to be exposed publicly yet
+	 * @private
+	 */
+	var VideoSource = /** @class */ (function (_super) {
+	    __extends$s(VideoSource, _super);
+	    /**
+	     * Constructs a source from the contents of a layer resource file.
+	     * @param id The source's id.
+	     * @param sourceDef Video source specification.
+	     * @param options Unused for now
+	     */
+	    function VideoSource(id, sourceDef, options) {
+	        var _this = _super.call(this, id) || this;
+	        _this.source = sourceDef;
+	        return _this;
+	    }
+	    /**
+	     * @internal
+	     */
+	    VideoSource.prototype._isDeepEqual = function (other) {
+	        if (this.constructor !== other.constructor) {
+	            return false;
+	        }
+	        var source = this.source;
+	        var otherSource = other.source;
+	        return source.type === otherSource.type
+	            && JSON.stringify(source.coordinates) === JSON.stringify(otherSource.coordinates)
+	            && source.urls === otherSource.urls;
+	    };
+	    /**
+	     * @internal
+	     */
+	    VideoSource.prototype._buildSource = function () {
+	        return this.source;
+	    };
+	    return VideoSource;
+	}(Source));
+
 
 
 	var index$4 = /*#__PURE__*/Object.freeze({
 		__proto__: null,
 		Source: Source,
 		DataSource: DataSource,
-		VectorTileSource: VectorTileSource
+		VectorTileSource: VectorTileSource,
+		CanvasSource: CanvasSource,
+		ImageSource: ImageSource,
+		VideoSource: VideoSource,
+		UnknownSource: UnknownSource
 	});
 
-	var __extends$p = (window && window.__extends) || (function () {
+	var __extends$t = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57155,7 +57434,7 @@ uniform ${precision} ${type} u_${name};
 	 * Abstract class for other layer classes to extend.
 	 */
 	var Layer = /** @class */ (function (_super) {
-	    __extends$p(Layer, _super);
+	    __extends$t(Layer, _super);
 	    function Layer(id) {
 	        var _this = 
 	        // Assign an random id using a UUID if none was specified.
@@ -57260,7 +57539,7 @@ uniform ${precision} ${type} u_${name};
 	    return Layer;
 	}(EventEmitter));
 
-	var __extends$q = (window && window.__extends) || (function () {
+	var __extends$u = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57279,7 +57558,7 @@ uniform ${precision} ${type} u_${name};
 	 * A base class which all other layer options inherit from.
 	 */
 	var LayerOptions = /** @class */ (function (_super) {
-	    __extends$q(LayerOptions, _super);
+	    __extends$u(LayerOptions, _super);
 	    function LayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -57326,7 +57605,7 @@ uniform ${precision} ${type} u_${name};
 	    return LayerOptions;
 	}(Options));
 
-	var __extends$r = (window && window.__extends) || (function () {
+	var __extends$v = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57345,7 +57624,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering Point objects in a BubbleLayer.
 	 */
 	var BubbleLayerOptions = /** @class */ (function (_super) {
-	    __extends$r(BubbleLayerOptions, _super);
+	    __extends$v(BubbleLayerOptions, _super);
 	    function BubbleLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -57415,7 +57694,7 @@ uniform ${precision} ${type} u_${name};
 	    return BubbleLayerOptions;
 	}(LayerOptions));
 
-	var __extends$s = (window && window.__extends) || (function () {
+	var __extends$w = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57434,7 +57713,7 @@ uniform ${precision} ${type} u_${name};
 	 * Renders Point objects as scalable circles (bubbles).
 	 */
 	var BubbleLayer = /** @class */ (function (_super) {
-	    __extends$s(BubbleLayer, _super);
+	    __extends$w(BubbleLayer, _super);
 	    /**
 	     * Constructs a new BubbleLayer.
 	     * @param source The id or instance of a data source which the layer will render.
@@ -57544,7 +57823,7 @@ uniform ${precision} ${type} u_${name};
 	    return BubbleLayer;
 	}(Layer));
 
-	var __extends$t = (window && window.__extends) || (function () {
+	var __extends$x = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57563,7 +57842,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering Point objects in a HeatMapLayer.
 	 */
 	var HeatMapLayerOptions = /** @class */ (function (_super) {
-	    __extends$t(HeatMapLayerOptions, _super);
+	    __extends$x(HeatMapLayerOptions, _super);
 	    function HeatMapLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -57630,7 +57909,7 @@ uniform ${precision} ${type} u_${name};
 	    return HeatMapLayerOptions;
 	}(LayerOptions));
 
-	var __extends$u = (window && window.__extends) || (function () {
+	var __extends$y = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57649,7 +57928,7 @@ uniform ${precision} ${type} u_${name};
 	 * Represent the density of data using different colors (HeatMap).
 	 */
 	var HeatMapLayer = /** @class */ (function (_super) {
-	    __extends$u(HeatMapLayer, _super);
+	    __extends$y(HeatMapLayer, _super);
 	    /**
 	     * Constructs a new HeatMapLayer.
 	     * @param source The id or instance of a data source which the layer will render.
@@ -57753,7 +58032,7 @@ uniform ${precision} ${type} u_${name};
 	    return HeatMapLayer;
 	}(Layer));
 
-	var __extends$v = (window && window.__extends) || (function () {
+	var __extends$z = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57772,7 +58051,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering canvas, image, raster tile, and video layers
 	 */
 	var MediaLayerOptions = /** @class */ (function (_super) {
-	    __extends$v(MediaLayerOptions, _super);
+	    __extends$z(MediaLayerOptions, _super);
 	    function MediaLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -57824,7 +58103,7 @@ uniform ${precision} ${type} u_${name};
 	    return MediaLayerOptions;
 	}(LayerOptions));
 
-	var __extends$w = (window && window.__extends) || (function () {
+	var __extends$A = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57843,7 +58122,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering Point objects in a ImageLayer.
 	 */
 	var ImageLayerOptions = /** @class */ (function (_super) {
-	    __extends$w(ImageLayerOptions, _super);
+	    __extends$A(ImageLayerOptions, _super);
 	    function ImageLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -57873,7 +58152,7 @@ uniform ${precision} ${type} u_${name};
 	    return ImageLayerOptions;
 	}(MediaLayerOptions));
 
-	var __extends$x = (window && window.__extends) || (function () {
+	var __extends$B = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57893,7 +58172,7 @@ uniform ${precision} ${type} u_${name};
 	 * @internal
 	 */
 	var SourceBuildingLayer = /** @class */ (function (_super) {
-	    __extends$x(SourceBuildingLayer, _super);
+	    __extends$B(SourceBuildingLayer, _super);
 	    function SourceBuildingLayer() {
 	        return _super !== null && _super.apply(this, arguments) || this;
 	    }
@@ -57905,10 +58184,13 @@ uniform ${precision} ${type} u_${name};
 	        ids.add(this._getSourceId());
 	        return ids;
 	    };
+	    SourceBuildingLayer.prototype.onAdd = function (map) {
+	        _super.prototype.onAdd.call(this, map);
+	    };
 	    return SourceBuildingLayer;
 	}(Layer));
 
-	var __extends$y = (window && window.__extends) || (function () {
+	var __extends$C = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -57927,7 +58209,7 @@ uniform ${precision} ${type} u_${name};
 	 * Overlays an image on the map with each corner anchored to a coordinate on the map. Also known as a ground or image overlay.
 	 */
 	var ImageLayer = /** @class */ (function (_super) {
-	    __extends$y(ImageLayer, _super);
+	    __extends$C(ImageLayer, _super);
 	    /**
 	     * Constructs a new ImageLayer.
 	     * @param id The id of the layer. If not specified a random one will be generated.
@@ -58127,10 +58409,15 @@ uniform ${precision} ${type} u_${name};
 	            this.transform = Promise.resolve(new AffineTransform(corners, this.options.coordinates));
 	        }
 	    };
+	    ImageLayer.prototype._getSourceWrapper = function () {
+	        var sourceId = this._getSourceId();
+	        var source = this._buildSource();
+	        return new ImageSource(sourceId, source);
+	    };
 	    return ImageLayer;
 	}(SourceBuildingLayer));
 
-	var __extends$z = (window && window.__extends) || (function () {
+	var __extends$D = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58150,7 +58437,7 @@ uniform ${precision} ${type} u_${name};
 	 * LineString, MultiLineString, Polygon, and MultiPolygon objects in a line layer.
 	 */
 	var LineLayerOptions = /** @class */ (function (_super) {
-	    __extends$z(LineLayerOptions, _super);
+	    __extends$D(LineLayerOptions, _super);
 	    function LineLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -58250,7 +58537,7 @@ uniform ${precision} ${type} u_${name};
 	    return LineLayerOptions;
 	}(LayerOptions));
 
-	var __extends$A = (window && window.__extends) || (function () {
+	var __extends$E = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58281,7 +58568,7 @@ uniform ${precision} ${type} u_${name};
 	 * CirclePolygon, LineString, MultiLineString, Polygon, and MultiPolygon objects.
 	 */
 	var LineLayer = /** @class */ (function (_super) {
-	    __extends$A(LineLayer, _super);
+	    __extends$E(LineLayer, _super);
 	    /**
 	     * Constructs a new LineLayer.
 	     * @param source The id or instance of a data source which the layer will render.
@@ -58372,7 +58659,7 @@ uniform ${precision} ${type} u_${name};
 	    return LineLayer;
 	}(Layer));
 
-	var __extends$B = (window && window.__extends) || (function () {
+	var __extends$F = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58391,7 +58678,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering `Polygon` and `MultiPolygon` objects in a `PolygonExtrusionLayer`.
 	 */
 	var PolygonExtrusionLayerOptions = /** @class */ (function (_super) {
-	    __extends$B(PolygonExtrusionLayerOptions, _super);
+	    __extends$F(PolygonExtrusionLayerOptions, _super);
 	    function PolygonExtrusionLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -58464,7 +58751,7 @@ uniform ${precision} ${type} u_${name};
 	    return PolygonExtrusionLayerOptions;
 	}(LayerOptions));
 
-	var __extends$C = (window && window.__extends) || (function () {
+	var __extends$G = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58494,7 +58781,7 @@ uniform ${precision} ${type} u_${name};
 	 * Renders extruded filled `Polygon` and `MultiPolygon` objects on the map.
 	 */
 	var PolygonExtrusionLayer = /** @class */ (function (_super) {
-	    __extends$C(PolygonExtrusionLayer, _super);
+	    __extends$G(PolygonExtrusionLayer, _super);
 	    /**
 	     * Constructs a new PolygonExtrusionLayer.
 	     * @param source The id or instance of a data source which the layer will render.
@@ -58582,7 +58869,7 @@ uniform ${precision} ${type} u_${name};
 	    return PolygonExtrusionLayer;
 	}(Layer));
 
-	var __extends$D = (window && window.__extends) || (function () {
+	var __extends$H = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58633,7 +58920,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering Polygon and MultiPolygon objects in a PolygonLayer.
 	 */
 	var PolygonLayerOptions = /** @class */ (function (_super) {
-	    __extends$D(PolygonLayerOptions, _super);
+	    __extends$H(PolygonLayerOptions, _super);
 	    function PolygonLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -58711,7 +58998,7 @@ uniform ${precision} ${type} u_${name};
 	    return PolygonLayerOptions;
 	}(LayerOptions));
 
-	var __extends$E = (window && window.__extends) || (function () {
+	var __extends$I = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58730,7 +59017,7 @@ uniform ${precision} ${type} u_${name};
 	 * Renders filled Polygon and MultiPolygon objects on the map.
 	 */
 	var PolygonLayer = /** @class */ (function (_super) {
-	    __extends$E(PolygonLayer, _super);
+	    __extends$I(PolygonLayer, _super);
 	    /**
 	     * Constructs a new PolygonLayer.
 	     * @param source The id or instance of a data source which the layer will render.
@@ -58836,7 +59123,7 @@ uniform ${precision} ${type} u_${name};
 	    return PolygonLayer;
 	}(Layer));
 
-	var __extends$F = (window && window.__extends) || (function () {
+	var __extends$J = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58855,7 +59142,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used to customize the icons in a SymbolLayer
 	 */
 	var IconOptions = /** @class */ (function (_super) {
-	    __extends$F(IconOptions, _super);
+	    __extends$J(IconOptions, _super);
 	    function IconOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -58965,7 +59252,7 @@ uniform ${precision} ${type} u_${name};
 	    return IconOptions;
 	}(Options));
 
-	var __extends$G = (window && window.__extends) || (function () {
+	var __extends$K = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -58984,7 +59271,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used to customize the text in a SymbolLayer
 	 */
 	var TextOptions = /** @class */ (function (_super) {
-	    __extends$G(TextOptions, _super);
+	    __extends$K(TextOptions, _super);
 	    function TextOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -59138,7 +59425,7 @@ uniform ${precision} ${type} u_${name};
 	    return TextOptions;
 	}(Options));
 
-	var __extends$H = (window && window.__extends) || (function () {
+	var __extends$L = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -59157,7 +59444,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering geometries in a SymbolLayer.
 	 */
 	var SymbolLayerOptions = /** @class */ (function (_super) {
-	    __extends$H(SymbolLayerOptions, _super);
+	    __extends$L(SymbolLayerOptions, _super);
 	    function SymbolLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -59215,7 +59502,7 @@ uniform ${precision} ${type} u_${name};
 	    return SymbolLayerOptions;
 	}(LayerOptions));
 
-	var __extends$I = (window && window.__extends) || (function () {
+	var __extends$M = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -59246,7 +59533,7 @@ uniform ${precision} ${type} u_${name};
 	 * Symbols can also be created for line and polygon data as well.
 	 */
 	var SymbolLayer = /** @class */ (function (_super) {
-	    __extends$I(SymbolLayer, _super);
+	    __extends$M(SymbolLayer, _super);
 	    /**
 	     * Constructs a new SymbolLayer.
 	     * @param source The id or instance of a data source which the layer will render.
@@ -59388,7 +59675,124 @@ uniform ${precision} ${type} u_${name};
 	    return SymbolLayer;
 	}(Layer));
 
-	var __extends$J = (window && window.__extends) || (function () {
+	var __extends$N = (window && window.__extends) || (function () {
+	    var extendStatics = function (d, b) {
+	        extendStatics = Object.setPrototypeOf ||
+	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+	            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+	        return extendStatics(d, b);
+	    };
+	    return function (d, b) {
+	        if (typeof b !== "function" && b !== null)
+	            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+	        extendStatics(d, b);
+	        function __() { this.constructor = d; }
+	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+	    };
+	})();
+	var __assign$3 = (window && window.__assign) || function () {
+	    __assign$3 = Object.assign || function(t) {
+	        for (var s, i = 1, n = arguments.length; i < n; i++) {
+	            s = arguments[i];
+	            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+	                t[p] = s[p];
+	        }
+	        return t;
+	    };
+	    return __assign$3.apply(this, arguments);
+	};
+	/**
+	 * Used to represent the fundamental map source.
+	 * @private
+	 */
+	var FundamentalMapSource = /** @class */ (function (_super) {
+	    __extends$N(FundamentalMapSource, _super);
+	    /**
+	     * Constructs a source from the contents of a layer resource file.
+	     * @param id The source's id.
+	     * @param sourceDef The sources entry of the resource file.
+	     * @param options The query parameters to add to the urls listed in the resource file.
+	     */
+	    function FundamentalMapSource(id, sourceDef, options) {
+	        var _this = _super.call(this, id) || this;
+	        _this.source = _this._modifySource(sourceDef, options);
+	        return _this;
+	    }
+	    /**
+	     * @internal
+	     */
+	    FundamentalMapSource.prototype._buildSource = function () {
+	        return this.source;
+	    };
+	    /**
+	     * @internal
+	     */
+	    FundamentalMapSource.prototype._isDeepEqual = function (other) {
+	        if (this.constructor !== other.constructor) {
+	            return false;
+	        }
+	        var source = this.source;
+	        var otherSource = other.source;
+	        var baseEqual = source.type === otherSource.type &&
+	            source.url === otherSource.url
+	            && ((source.tiles === undefined && otherSource.tiles === undefined) ||
+	                (source.tiles && otherSource.tiles && source.tiles.length === otherSource.tiles.length && source.tiles.every(function (value, idx) { return value === otherSource.tiles[idx]; })))
+	            && source.minzoom === otherSource.minzoom
+	            && source.maxzoom === otherSource.maxzoom
+	            && source.bounds === otherSource.bounds
+	            && source.attribution === otherSource.attribution;
+	        var rasterEqual = source.type !== "raster" || (source.type === "raster"
+	            && source.type === otherSource.type
+	            && source.tileSize === otherSource.tileSize
+	            && source.scheme === otherSource.scheme);
+	        var rasterDemEqual = source.type !== "raster-dem" || (source.type === "raster-dem"
+	            && source.type === otherSource.type
+	            && source.tileSize === otherSource.tileSize
+	            && source.encoding === otherSource.encoding);
+	        var vectorEqual = source.type !== "vector" || (source.type === "vector"
+	            && source.type === otherSource.type
+	            && source.promoteId === otherSource.promoteId
+	            && source.scheme === otherSource.scheme);
+	        return baseEqual && rasterEqual && rasterDemEqual && vectorEqual;
+	    };
+	    /**
+	     * Updates the source info to convert the tiles to url strings.
+	     * @param sourceDef The original source info.
+	     * @param options The query parameters to add to the tile urls.
+	     */
+	    FundamentalMapSource.prototype._modifySource = function (sourceDef, options) {
+	        if (sourceDef.tiles) {
+	            var tileStrings = sourceDef.tiles.map(function (tile) {
+	                if (typeof tile === "string") {
+	                    return tile;
+	                }
+	                var tileUrl = new Url({
+	                    domain: constants.domainPlaceHolder,
+	                    path: tile.path,
+	                    queryParams: __assign$3(__assign$3({}, options), tile.queryParams)
+	                });
+	                return tileUrl.toString();
+	            });
+	            sourceDef.tiles = tileStrings;
+	        }
+	        else if (sourceDef.url) {
+	            sourceDef.url = (typeof sourceDef.url === "string") ?
+	                sourceDef.url :
+	                new Url({
+	                    domain: constants.domainPlaceHolder,
+	                    path: sourceDef.url.path,
+	                    queryParams: __assign$3(__assign$3({}, options), sourceDef.url.queryParams)
+	                }).toString();
+	        }
+	        else {
+	            throw new Error("Source definition must define a TileJSON 'url' or a 'tiles' array.");
+	        }
+	        return sourceDef;
+	    };
+	    return FundamentalMapSource;
+	}(Source));
+
+	var __extends$O = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -59407,7 +59811,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used when rendering raster tiled images in a TileLayer.
 	 */
 	var TileLayerOptions = /** @class */ (function (_super) {
-	    __extends$J(TileLayerOptions, _super);
+	    __extends$O(TileLayerOptions, _super);
 	    function TileLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -59463,7 +59867,7 @@ uniform ${precision} ${type} u_${name};
 	    return TileLayerOptions;
 	}(MediaLayerOptions));
 
-	var __extends$K = (window && window.__extends) || (function () {
+	var __extends$P = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -59478,8 +59882,8 @@ uniform ${precision} ${type} u_${name};
 	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
 	    };
 	})();
-	var __assign$3 = (window && window.__assign) || function () {
-	    __assign$3 = Object.assign || function(t) {
+	var __assign$4 = (window && window.__assign) || function () {
+	    __assign$4 = Object.assign || function(t) {
 	        for (var s, i = 1, n = arguments.length; i < n; i++) {
 	            s = arguments[i];
 	            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
@@ -59487,7 +59891,7 @@ uniform ${precision} ${type} u_${name};
 	        }
 	        return t;
 	    };
-	    return __assign$3.apply(this, arguments);
+	    return __assign$4.apply(this, arguments);
 	};
 	var __values$8 = (window && window.__values) || function(o) {
 	    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
@@ -59504,7 +59908,7 @@ uniform ${precision} ${type} u_${name};
 	 * Renders raster tiled images on top of the map tiles.
 	 */
 	var TileLayer = /** @class */ (function (_super) {
-	    __extends$K(TileLayer, _super);
+	    __extends$P(TileLayer, _super);
 	    /**
 	     * Constructs a new TileLayer.
 	     * @param options The options for the tile layer.
@@ -59566,7 +59970,7 @@ uniform ${precision} ${type} u_${name};
 	     * @internal
 	     */
 	    TileLayer.prototype._buildLayers = function () {
-	        var layer = __assign$3(__assign$3({ id: this.id, type: "raster", source: this._getSourceId(), layout: {
+	        var layer = __assign$4(__assign$4({ id: this.id, type: "raster", source: this._getSourceId(), layout: {
 	                visibility: this.options.visible ? "visible" : "none"
 	            }, paint: {
 	                "raster-contrast": this.options.contrast,
@@ -59635,7 +60039,7 @@ uniform ${precision} ${type} u_${name};
 	                };
 	            }
 	        }
-	        return __assign$3({ type: "raster", bounds: this.options.bounds, maxzoom: this.options.maxSourceZoom, minzoom: this.options.minSourceZoom, scheme: this.options.isTMS ? "tms" : "xyz", tileSize: this.options.tileSize }, (tiles && { tiles: tiles }));
+	        return __assign$4({ type: "raster", bounds: this.options.bounds, maxzoom: this.options.maxSourceZoom, minzoom: this.options.minSourceZoom, scheme: this.options.isTMS ? "tms" : "xyz", tileSize: this.options.tileSize }, (tiles && { tiles: tiles }));
 	    };
 	    /**
 	     * Gets the id of the source to be paired with this layer.
@@ -59644,10 +60048,20 @@ uniform ${precision} ${type} u_${name};
 	    TileLayer.prototype._getSourceId = function () {
 	        return this.getId() + "-RasterSource";
 	    };
+	    TileLayer.prototype._getSourceWrapper = function () {
+	        var sourceId = this._getSourceId();
+	        var source = this._buildSource();
+	        return new FundamentalMapSource(sourceId, {
+	            name: sourceId,
+	            tiles: source.tiles,
+	            type: source.type,
+	            url: source.url
+	        });
+	    };
 	    return TileLayer;
 	}(SourceBuildingLayer));
 
-	var __extends$L = (window && window.__extends) || (function () {
+	var __extends$Q = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -59666,7 +60080,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options used to render graphics in a WebGLLayer.
 	 */
 	var WebGLLayerOptions = /** @class */ (function (_super) {
-	    __extends$L(WebGLLayerOptions, _super);
+	    __extends$Q(WebGLLayerOptions, _super);
 	    function WebGLLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -59678,7 +60092,7 @@ uniform ${precision} ${type} u_${name};
 	    return WebGLLayerOptions;
 	}(LayerOptions));
 
-	var __extends$M = (window && window.__extends) || (function () {
+	var __extends$R = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -59697,7 +60111,7 @@ uniform ${precision} ${type} u_${name};
 	 * Enables custom rendering logic with access to the WebGL context of the map.
 	 */
 	var WebGLLayer = /** @class */ (function (_super) {
-	    __extends$M(WebGLLayer, _super);
+	    __extends$R(WebGLLayer, _super);
 	    /**
 	     * Constructs a new WebGLLayer.
 	     * @param id The id of the layer. If not specified a random one will be generated.
@@ -59927,7 +60341,7 @@ uniform ${precision} ${type} u_${name};
 
 	var isElement_1 = isElement;
 
-	var __extends$N = (window && window.__extends) || (function () {
+	var __extends$S = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -59946,7 +60360,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for a popup.
 	 */
 	var PopupOptions = /** @class */ (function (_super) {
-	    __extends$N(PopupOptions, _super);
+	    __extends$S(PopupOptions, _super);
 	    function PopupOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -60015,7 +60429,7 @@ uniform ${precision} ${type} u_${name};
 	    return PopupOptions;
 	}(Options));
 
-	var __extends$O = (window && window.__extends) || (function () {
+	var __extends$T = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -60050,7 +60464,7 @@ uniform ${precision} ${type} u_${name};
 	 * An information window anchored at a specified position on a map.
 	 */
 	var Popup = /** @class */ (function (_super) {
-	    __extends$O(Popup, _super);
+	    __extends$T(Popup, _super);
 	    /**
 	     * Constructs a Popup object and initializes it with the specified options.
 	     * @param options The options for the popup.
@@ -60521,7 +60935,7 @@ uniform ${precision} ${type} u_${name};
 	    return Popup;
 	}(EventEmitter));
 
-	var __extends$P = (window && window.__extends) || (function () {
+	var __extends$U = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -60540,7 +60954,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options for rendering an HtmlMarker object
 	 */
 	var HtmlMarkerOptions = /** @class */ (function (_super) {
-	    __extends$P(HtmlMarkerOptions, _super);
+	    __extends$U(HtmlMarkerOptions, _super);
 	    function HtmlMarkerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -60618,7 +61032,7 @@ uniform ${precision} ${type} u_${name};
 	    return HtmlMarkerOptions;
 	}(Options));
 
-	var __extends$Q = (window && window.__extends) || (function () {
+	var __extends$V = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -60637,7 +61051,7 @@ uniform ${precision} ${type} u_${name};
 	 * This class wraps an HTML element that can be displayed on the map.
 	 */
 	var HtmlMarker = /** @class */ (function (_super) {
-	    __extends$Q(HtmlMarker, _super);
+	    __extends$V(HtmlMarker, _super);
 	    /**
 	     * Constructs a new HtmlMarker.
 	     * @param options The options for the HtmlMarker.
@@ -60949,6 +61363,10 @@ uniform ${precision} ${type} u_${name};
 	            defaultRegion: {
 	                code: "NGT",
 	                strings: "en/resource.json"
+	            },
+	            latn: {
+	                code: "NGT-Latn",
+	                strings: "en/resource.json"
 	            }
 	        },
 	        ar: {
@@ -60995,6 +61413,18 @@ uniform ${precision} ${type} u_${name};
 	            us: {
 	                code: "en-US",
 	                strings: "en/resource.json"
+	            },
+	            au: {
+	                code: "en-AU",
+	                strings: "en/resource.json"
+	            },
+	            gb: {
+	                code: "en-GB",
+	                strings: "en/resource.json"
+	            },
+	            nz: {
+	                code: "en-NZ",
+	                strings: "en/resource.json"
 	            }
 	        },
 	        es: {
@@ -61120,14 +61550,31 @@ uniform ${precision} ${type} u_${name};
 	            }
 	        },
 	        zh: {
+	            // per https://microsoft.sharepoint.com/sites/globalreadiness/SitePages/Language-fallback.aspx
+	            // Chinese - Neutral (zh) fallbacks to en-US
 	            defaultRegion: {
-	                code: "zh-Hant",
-	                strings: "zh-tw/resource.json"
+	                code: "zh",
+	                strings: "en/resource.json"
+	            }
+	        },
+	        "zh-hans": {
+	            defaultRegion: {
+	                code: "zh-Hans",
+	                strings: "zh-cn/resource.json"
+	            },
+	            cn: {
+	                code: "zh-Hans-CN",
+	                strings: "zh-cn/resource.json"
 	            }
 	        },
 	        "zh-hant": {
+	            // per discussion with global readiness team, we were explicitly asked to not fallback zh-hant to zh-tw
 	            defaultRegion: {
 	                code: "zh-Hant",
+	                strings: "en/resource.json"
+	            },
+	            tw: {
+	                code: "zh-Hant-TW",
 	                strings: "zh-tw/resource.json"
 	            }
 	        }
@@ -61329,7 +61776,7 @@ uniform ${precision} ${type} u_${name};
 	    return UserAgent;
 	}());
 
-	var __extends$R = (window && window.__extends) || (function () {
+	var __extends$W = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -61374,7 +61821,7 @@ uniform ${precision} ${type} u_${name};
 	    /**
 	     * The AAD implicit grant mechanism. Recommended for pages protected by a sign-in.
 	     * By default the page will be redirected to the AAD login when the map control initializes.
-	     * Specify a logged-in `AuthenticationContext` in the `AuthenticationOptions`
+	     * Specify a logged-in `PublicClientApplication` in the `AuthenticationOptions`
 	     * for greater control over when/how the users signs in.
 	     * Literal value `"aad"`
 	     */
@@ -61395,7 +61842,7 @@ uniform ${precision} ${type} u_${name};
 	 * Options for specifying how the map control should authenticate with the Azure Maps services.
 	 */
 	var AuthenticationOptions = /** @class */ (function (_super) {
-	    __extends$R(AuthenticationOptions, _super);
+	    __extends$W(AuthenticationOptions, _super);
 	    function AuthenticationOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -61439,7 +61886,7 @@ uniform ${precision} ${type} u_${name};
 	         */
 	        _this.sasToken = undefined;
 	        /**
-	         * Optionally provide an existing `AuthenticationContext` from the ADAL.js library.
+	         * Optionally provide an existing `PublicClientApplication` from the MSAL.js library.
 	         * This authentication context will be used to acquire the AAD token.
 	         * Only used with the AAD authentication type.
 	         * This auth context must be configured to use the same AAD app ID as `this.aadAppId`.
@@ -61462,7 +61909,7 @@ uniform ${precision} ${type} u_${name};
 	     * @param aadAppId Azure AD App ID
 	     * @param aadTenant Azure AD Tenant Name
 	     * @param aadInstance An optional Azure AD Instance
-	     * @param authContext An optional `AuthenticationContext` from the ADAL.js library
+	     * @param authContext An optional `PublicClientApplication` from the MSAL.js library
 	     */
 	    AuthenticationOptions.prototype.setAadProperties = function (clientId, aadAppId, aadTenant, aadInstance, authContext) {
 	        this.authType = exports.AuthenticationType.aad;
@@ -61756,7 +62203,7 @@ uniform ${precision} ${type} u_${name};
 	/**
 	 * Specifies which set of geopolitically disputed borders and labels are displayed on the map. The View parameter (also referred to as “user region parameter”) is a 2-letter ISO-3166 Country Code that will show the correct maps for that country/region. Country/Regions that are not on the View list or if unspecified will default to the “Unified” View.
 	 * Please see the supported [Views]{@link https://aka.ms/AzureMapsLocalizationViews }.
-	 * It is your responsibility to determine the location of your users, and then set the View parameter correctly for that location. The View parameter in Azure Maps must be used in compliance with applicable laws, including those regarding mapping, of the country where maps, images and other data and third party content that You are authorized to access via Azure Maps is made available.
+	 * It is your responsibility to determine the location of your users, and then set the View parameter correctly for that location. The View parameter in Azure Maps must be used in compliance with applicable laws, including those regarding mapping, of the country/region where maps, images and other data and third party content that You are authorized to access via Azure Maps is made available.
 	 * @param view The new default view
 	 */
 	function setView(view) {
@@ -61996,7 +62443,7 @@ uniform ${precision} ${type} u_${name};
 	    return Media;
 	}());
 
-	var __extends$S = (window && window.__extends) || (function () {
+	var __extends$X = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -62015,7 +62462,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for a CopyrightControl object.
 	 */
 	var CopyrightControlOptions = /** @class */ (function (_super) {
-	    __extends$S(CopyrightControlOptions, _super);
+	    __extends$X(CopyrightControlOptions, _super);
 	    function CopyrightControlOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -62044,7 +62491,7 @@ uniform ${precision} ${type} u_${name};
 	    return CopyrightControlOptions;
 	}(Options));
 
-	var __extends$T = (window && window.__extends) || (function () {
+	var __extends$Y = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -62063,7 +62510,7 @@ uniform ${precision} ${type} u_${name};
 	 * @private
 	 */
 	var CopyrightControl = /** @class */ (function (_super) {
-	    __extends$T(CopyrightControl, _super);
+	    __extends$Y(CopyrightControl, _super);
 	    function CopyrightControl(options) {
 	        var _this = _super.call(this) || this;
 	        _this.textAttribution = function (options) {
@@ -62184,8 +62631,8 @@ uniform ${precision} ${type} u_${name};
 	    return CopyrightControl;
 	}(ControlBase));
 
-	var __assign$4 = (window && window.__assign) || function () {
-	    __assign$4 = Object.assign || function(t) {
+	var __assign$5 = (window && window.__assign) || function () {
+	    __assign$5 = Object.assign || function(t) {
 	        for (var s, i = 1, n = arguments.length; i < n; i++) {
 	            s = arguments[i];
 	            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
@@ -62193,7 +62640,7 @@ uniform ${precision} ${type} u_${name};
 	        }
 	        return t;
 	    };
-	    return __assign$4.apply(this, arguments);
+	    return __assign$5.apply(this, arguments);
 	};
 
 	var __awaiter$1 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
@@ -62248,6 +62695,11 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
+	var __spreadArray$2 = (window && window.__spreadArray) || function (to, from) {
+	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
+	        to[j] = from[i];
+	    return to;
+	};
 
 	/**
 	 * @private
@@ -62411,7 +62863,7 @@ uniform ${precision} ${type} u_${name};
 	    return FlowServiceDelegate;
 	}());
 
-	var __extends$U = (window && window.__extends) || (function () {
+	var __extends$Z = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -62430,7 +62882,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for enabling/disabling user interaction with the map.
 	 */
 	var UserInteractionOptions = /** @class */ (function (_super) {
-	    __extends$U(UserInteractionOptions, _super);
+	    __extends$Z(UserInteractionOptions, _super);
 	    function UserInteractionOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -62821,8 +63273,8 @@ uniform ${precision} ${type} u_${name};
 	    return ControlManager;
 	}());
 
-	var __assign$5 = (window && window.__assign) || function () {
-	    __assign$5 = Object.assign || function(t) {
+	var __assign$6 = (window && window.__assign) || function () {
+	    __assign$6 = Object.assign || function(t) {
 	        for (var s, i = 1, n = arguments.length; i < n; i++) {
 	            s = arguments[i];
 	            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
@@ -62830,7 +63282,7 @@ uniform ${precision} ${type} u_${name};
 	        }
 	        return t;
 	    };
-	    return __assign$5.apply(this, arguments);
+	    return __assign$6.apply(this, arguments);
 	};
 	/**
 	 * @private
@@ -62874,7 +63326,7 @@ uniform ${precision} ${type} u_${name};
 	                case "sourcedata":
 	                case "styledata":
 	                    modifiedCallback = function (data) {
-	                        var mapEventData = __assign$5(__assign$5({ dataType: data.dataType }, (data.dataType === "source" && __assign$5(__assign$5(__assign$5({ isSourceLoaded: data.isSourceLoaded }, (data.sourceDataType && { sourceDataType: data.sourceDataType })), { source: _this.map.sources.getById(data.sourceId) }), (data.tile && {
+	                        var mapEventData = __assign$6(__assign$6({ dataType: data.dataType }, (data.dataType === "source" && __assign$6(__assign$6(__assign$6({ isSourceLoaded: data.isSourceLoaded }, (data.sourceDataType && { sourceDataType: data.sourceDataType })), { source: _this.map.sources.getById(data.sourceId) }), (data.tile && {
 	                            tile: {
 	                                id: {
 	                                    x: data.tile.tileID.canonical.x,
@@ -63759,7 +64211,7 @@ uniform ${precision} ${type} u_${name};
 	    return ImageSpriteManager;
 	}());
 
-	var __extends$V = (window && window.__extends) || (function () {
+	var __extends$_ = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -63791,7 +64243,7 @@ uniform ${precision} ${type} u_${name};
 	 * @private
 	 */
 	var FundamentalMapLayer = /** @class */ (function (_super) {
-	    __extends$V(FundamentalMapLayer, _super);
+	    __extends$_(FundamentalMapLayer, _super);
 	    /**
 	     * Constructs a base layer used to represent the base, transit, and labels layers.
 	     * @param mbLayers The stylesheet used to define the style sources and style layers.
@@ -63880,7 +64332,7 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
-	var __spreadArray$2 = (window && window.__spreadArray) || function (to, from) {
+	var __spreadArray$3 = (window && window.__spreadArray) || function (to, from) {
 	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
 	        to[j] = from[i];
 	    return to;
@@ -64018,6 +64470,8 @@ uniform ${precision} ${type} u_${name};
 	        // If adding a SourceBuildingLayer the source associated must also be added.
 	        if (layer instanceof SourceBuildingLayer) {
 	            this.map._getMap().addSource(layer._getSourceId(), layer._buildSource());
+	            // we also need the abstraction for those source building layers added to the map if it is not already there
+	            this.map.sources.setSourceState(layer._getSourceWrapper());
 	        }
 	        var mbBefore = this._getMapboxBefore(before);
 	        try {
@@ -64316,7 +64770,7 @@ uniform ${precision} ${type} u_${name};
 	                // If a specified layer hasn't been added to the map throw an error.
 	                var index = this_1.layerIndex.findIndex(function (l) { return l.getId() === layerId; });
 	                if (index > -1) {
-	                    layerIds.push.apply(layerIds, __spreadArray$2([], __read$8(this_1.layerIndex[index]._getLayerIds()
+	                    layerIds.push.apply(layerIds, __spreadArray$3([], __read$8(this_1.layerIndex[index]._getLayerIds()
 	                        .filter(function (id) { return !!_this.map._getMap().getLayer(id); }))));
 	                }
 	                else {
@@ -64386,6 +64840,9 @@ uniform ${precision} ${type} u_${name};
 	        if (userLayerIndex != -1) {
 	            this.userLayers.splice(userLayerIndex, 1);
 	        }
+	        if (layer instanceof SourceBuildingLayer) {
+	            this.map.sources.unsetSourceState(layer._getSourceId());
+	        }
 	        tempLayer.onRemove();
 	    };
 	    return LayerManager;
@@ -64556,92 +65013,6 @@ uniform ${precision} ${type} u_${name};
 	    return PopupManager;
 	}());
 
-	var __extends$W = (window && window.__extends) || (function () {
-	    var extendStatics = function (d, b) {
-	        extendStatics = Object.setPrototypeOf ||
-	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-	            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-	        return extendStatics(d, b);
-	    };
-	    return function (d, b) {
-	        if (typeof b !== "function" && b !== null)
-	            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-	        extendStatics(d, b);
-	        function __() { this.constructor = d; }
-	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-	    };
-	})();
-	var __assign$6 = (window && window.__assign) || function () {
-	    __assign$6 = Object.assign || function(t) {
-	        for (var s, i = 1, n = arguments.length; i < n; i++) {
-	            s = arguments[i];
-	            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-	                t[p] = s[p];
-	        }
-	        return t;
-	    };
-	    return __assign$6.apply(this, arguments);
-	};
-	/**
-	 * Used to represent the fundamental map source.
-	 * @private
-	 */
-	var FundamentalMapSource = /** @class */ (function (_super) {
-	    __extends$W(FundamentalMapSource, _super);
-	    /**
-	     * Constructs a source from the contents of a layer resource file.
-	     * @param id The source's id.
-	     * @param sourceDef The sources entry of the resource file.
-	     * @param options The query parameters to add to the urls listed in the resource file.
-	     */
-	    function FundamentalMapSource(id, sourceDef, options) {
-	        var _this = _super.call(this, id) || this;
-	        _this.source = _this._modifySource(sourceDef, options);
-	        return _this;
-	    }
-	    /**
-	     * @internal
-	     */
-	    FundamentalMapSource.prototype._buildSource = function () {
-	        return this.source;
-	    };
-	    /**
-	     * Updates the source info to convert the tiles to url strings.
-	     * @param sourceDef The original source info.
-	     * @param options The query parameters to add to the tile urls.
-	     */
-	    FundamentalMapSource.prototype._modifySource = function (sourceDef, options) {
-	        if (sourceDef.tiles) {
-	            var tileStrings = sourceDef.tiles.map(function (tile) {
-	                if (typeof tile === "string") {
-	                    return tile;
-	                }
-	                var tileUrl = new Url({
-	                    domain: constants.domainPlaceHolder,
-	                    path: tile.path,
-	                    queryParams: __assign$6(__assign$6({}, options), tile.queryParams)
-	                });
-	                return tileUrl.toString();
-	            });
-	            sourceDef.tiles = tileStrings;
-	        }
-	        else if (sourceDef.url) {
-	            sourceDef.url = (typeof sourceDef.url === "string") ?
-	                sourceDef.url :
-	                new Url({
-	                    domain: constants.domainPlaceHolder,
-	                    path: sourceDef.url.path,
-	                    queryParams: __assign$6(__assign$6({}, options), sourceDef.url.queryParams)
-	                }).toString();
-	        }
-	        else {
-	            throw new Error("Source definition must define a TileJSON 'url' or a 'tiles' array.");
-	        }
-	        return sourceDef;
-	    };
-	    return FundamentalMapSource;
-	}(Source));
-
 	var __values$f = (window && window.__values) || function(o) {
 	    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
 	    if (m) return m.call(o);
@@ -64814,6 +65185,23 @@ uniform ${precision} ${type} u_${name};
 	            this._removeSource(source, update);
 	        }
 	    };
+	    /**
+	     * @internal
+	     */
+	    SourceManager.prototype.setSourceState = function (newSource, shouldInvokeAddEvent) {
+	        if (shouldInvokeAddEvent === void 0) { shouldInvokeAddEvent = true; }
+	        this.sources.set(newSource.getId(), newSource);
+	        newSource._setMap(this.map, shouldInvokeAddEvent);
+	    };
+	    /**
+	     * @internal
+	     */
+	    SourceManager.prototype.unsetSourceState = function (id) {
+	        if (this.sources.has(id)) {
+	            this.sources.get(id)._setMap(null);
+	            this.sources.delete(id);
+	        }
+	    };
 	    SourceManager.prototype._removeSource = function (source, update) {
 	        var id = source instanceof Source ? source.getId() : source;
 	        if (this.sources.has(id)) {
@@ -64821,8 +65209,7 @@ uniform ${precision} ${type} u_${name};
 	                this.map._getMap().removeSource(id);
 	            }
 	            if (!this.map._getMap().getSource(id) || !update) {
-	                this.sources.get(id)._setMap(null);
-	                this.sources.delete(id);
+	                this.unsetSourceState(id);
 	            }
 	            else {
 	                throw new Error("One or more layers have a dependency on the source '" + id + "'");
@@ -64839,8 +65226,7 @@ uniform ${precision} ${type} u_${name};
 	                throw new Error("'" + source.getId() + "' is already added to the map");
 	            }
 	            else {
-	                this.sources.get(source.getId())._setMap(null);
-	                this.sources.delete(source.getId());
+	                this.unsetSourceState(source.getId());
 	            }
 	        }
 	        if (update) {
@@ -64852,8 +65238,7 @@ uniform ${precision} ${type} u_${name};
 	            }
 	            this.map._getMap().addSource(source.getId(), source._buildSource());
 	        }
-	        this.sources.set(source.getId(), source);
-	        source._setMap(this.map);
+	        this.setSourceState(source);
 	    };
 	    /**
 	     * Converts an array of features as returned by one of Mapbox's query*Features(...) function
@@ -64895,51 +65280,90 @@ uniform ${precision} ${type} u_${name};
 	    };
 	    /**
 	     * Sync SourceManager with mapbox sources.
+	     * This function is responsible for creating wrappers for mapbox sources
+	     * and setting the approperiate sourceManager state with them
 	     * @internal
 	     */
 	    SourceManager.prototype._syncSources = function (sources) {
 	        var _this = this;
-	        if (sources) {
-	            Object.keys(sources).forEach(function (sourceId) {
-	                if (!_this.sources.has(sourceId)) {
-	                    var sourceToAdd = sources[sourceId];
-	                    if (sourceToAdd.type === "vector") {
-	                        var newSource = new FundamentalMapSource(sourceId, {
-	                            name: sourceId,
-	                            tiles: sourceToAdd.tiles,
-	                            type: "vector",
-	                            url: sourceToAdd.url
-	                        });
-	                        _this.sources.set(sourceId, newSource);
-	                        newSource._setMap(_this.map);
-	                    }
-	                    else if (sourceToAdd.type === "raster") {
-	                        var newSource = new FundamentalMapSource(sourceId, {
-	                            name: sourceId,
-	                            tiles: sourceToAdd.tiles,
-	                            type: "raster",
-	                            url: sourceToAdd.url
-	                        });
-	                        _this.sources.set(sourceId, newSource);
-	                        newSource._setMap(_this.map);
-	                    }
-	                    else {
-	                        throw new Error("Unable to construct source with ID " + sourceId + ".");
+	        if (!sources) {
+	            console.warn('syncSources called with no style sources which is unexpected.');
+	            return;
+	        }
+	        // 1. add / update the source wrappers
+	        Object.keys(sources)
+	            .map(function (sourceId) {
+	            var sourceToAdd = sources[sourceId];
+	            var newSource;
+	            switch (sourceToAdd.type) {
+	                case 'vector':
+	                case 'raster':
+	                case 'raster-dem': {
+	                    newSource = new FundamentalMapSource(sourceId, {
+	                        name: sourceId,
+	                        tiles: sourceToAdd.tiles,
+	                        type: sourceToAdd.type,
+	                        url: sourceToAdd.url,
+	                        tileSize: 'tileSize' in sourceToAdd ? sourceToAdd.tileSize : undefined
+	                    });
+	                    break;
+	                }
+	                case 'canvas': {
+	                    newSource = new CanvasSource(sourceId, sourceToAdd);
+	                    break;
+	                }
+	                case 'geojson': {
+	                    var dataSource = new DataSource(sourceId, {
+	                        maxZoom: sourceToAdd.maxzoom,
+	                        cluster: sourceToAdd.cluster,
+	                        clusterRadius: sourceToAdd.clusterRadius,
+	                        tolerance: sourceToAdd.tolerance,
+	                        lineMetrics: sourceToAdd.lineMetrics,
+	                        clusterProperties: sourceToAdd.clusterProperties,
+	                        buffer: sourceToAdd.buffer,
+	                        clusterMinPoints: sourceToAdd.clusterMinPoints,
+	                        generateId: sourceToAdd.generateId,
+	                        promoteId: sourceToAdd.promoteId,
+	                        filter: sourceToAdd.filter,
+	                        // attribution?: sourceToAdd.attribution
+	                    });
+	                    if (typeof sourceToAdd.data !== 'string' && sourceToAdd.data !== undefined) {
+	                        dataSource._addNoUpdate(sourceToAdd.data);
 	                    }
+	                    newSource = dataSource;
+	                    break;
 	                }
-	            });
-	            Object.keys(this.sources).forEach(function (sourceId) {
-	                if (!sources.hasOwnProperty(sourceId)) {
-	                    _this.sources.get(sourceId)._setMap(null);
-	                    _this.sources.delete(sourceId);
+	                case 'image': {
+	                    newSource = new ImageSource(sourceId, sourceToAdd);
+	                    break;
 	                }
-	            });
-	        }
+	                case 'video': {
+	                    newSource = new VideoSource(sourceId, sourceToAdd);
+	                    break;
+	                }
+	                default: {
+	                    newSource = new UnknownSource(sourceId, sourceToAdd);
+	                }
+	            }
+	            return newSource;
+	        }).forEach(function (newSource) {
+	            // use deep equality of underlying maplibre sources to determine if the source has been updated or overriden on style update
+	            var existing = _this.sources.get(newSource.getId());
+	            var isUpdate = existing && newSource._isDeepEqual(existing);
+	            if (!isUpdate && existing) {
+	                _this.unsetSourceState(existing.getId());
+	            }
+	            _this.setSourceState(newSource, !isUpdate);
+	        });
+	        // 2. remove the source wrappers that are not in the style
+	        Array.from(this.sources.keys())
+	            .filter(function (sourceId) { return !(sourceId in sources); })
+	            .forEach(function (sourceId) { return _this.unsetSourceState(sourceId); });
 	    };
 	    return SourceManager;
 	}());
 
-	var __extends$X = (window && window.__extends) || (function () {
+	var __extends$$ = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -64958,7 +65382,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for animating changes to the map control's camera.
 	 */
 	var AnimationOptions = /** @class */ (function (_super) {
-	    __extends$X(AnimationOptions, _super);
+	    __extends$$(AnimationOptions, _super);
 	    function AnimationOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -64982,7 +65406,7 @@ uniform ${precision} ${type} u_${name};
 	    return AnimationOptions;
 	}(Options));
 
-	var __extends$Y = (window && window.__extends) || (function () {
+	var __extends$10 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65001,7 +65425,7 @@ uniform ${precision} ${type} u_${name};
 	 * Represent the amount of padding in pixels to add to the side of a BoundingBox when setting the camera of a map.
 	 */
 	var Padding = /** @class */ (function (_super) {
-	    __extends$Y(Padding, _super);
+	    __extends$10(Padding, _super);
 	    function Padding() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65033,7 +65457,7 @@ uniform ${precision} ${type} u_${name};
 	    return Padding;
 	}(Options));
 
-	var __extends$Z = (window && window.__extends) || (function () {
+	var __extends$11 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65075,7 +65499,7 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
-	var __spreadArray$3 = (window && window.__spreadArray) || function (to, from) {
+	var __spreadArray$4 = (window && window.__spreadArray) || function (to, from) {
 	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
 	        to[j] = from[i];
 	    return to;
@@ -65084,7 +65508,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for setting the bounds of the map control's camera.
 	 */
 	var CameraBoundsOptions = /** @class */ (function (_super) {
-	    __extends$Z(CameraBoundsOptions, _super);
+	    __extends$11(CameraBoundsOptions, _super);
 	    function CameraBoundsOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65150,12 +65574,12 @@ uniform ${precision} ${type} u_${name};
 	            }
 	            finally { if (e_1) throw e_1.error; }
 	        }
-	        return _super.prototype.merge.apply(this, __spreadArray$3([], __read$9(valuesList)));
+	        return _super.prototype.merge.apply(this, __spreadArray$4([], __read$9(valuesList)));
 	    };
 	    return CameraBoundsOptions;
 	}(Options));
 
-	var __extends$_ = (window && window.__extends) || (function () {
+	var __extends$12 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65174,7 +65598,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for setting the map control's camera.
 	 */
 	var CameraOptions = /** @class */ (function (_super) {
-	    __extends$_(CameraOptions, _super);
+	    __extends$12(CameraOptions, _super);
 	    function CameraOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65233,7 +65657,7 @@ uniform ${precision} ${type} u_${name};
 	    return CameraOptions;
 	}(Options));
 
-	var __extends$$ = (window && window.__extends) || (function () {
+	var __extends$13 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65252,7 +65676,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for a layer of the map.
 	 */
 	var LayerOptions$1 = /** @class */ (function (_super) {
-	    __extends$$(LayerOptions, _super);
+	    __extends$13(LayerOptions, _super);
 	    function LayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65285,7 +65709,7 @@ uniform ${precision} ${type} u_${name};
 	    return LayerOptions;
 	}(Options));
 
-	var __extends$10 = (window && window.__extends) || (function () {
+	var __extends$14 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65305,7 +65729,7 @@ uniform ${precision} ${type} u_${name};
 	 * @deprecated Use BubbleLayerOptions with atlas.layer.BubbleLayer instead.
 	 */
 	var CircleLayerOptions = /** @class */ (function (_super) {
-	    __extends$10(CircleLayerOptions, _super);
+	    __extends$14(CircleLayerOptions, _super);
 	    function CircleLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65337,7 +65761,7 @@ uniform ${precision} ${type} u_${name};
 	    return CircleLayerOptions;
 	}(LayerOptions$1));
 
-	var __extends$11 = (window && window.__extends) || (function () {
+	var __extends$15 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65357,7 +65781,7 @@ uniform ${precision} ${type} u_${name};
 	 * @deprecated Use LineLayerOptions with atlas.layer.LineLayer instead.
 	 */
 	var LinestringLayerOptions = /** @class */ (function (_super) {
-	    __extends$11(LinestringLayerOptions, _super);
+	    __extends$15(LinestringLayerOptions, _super);
 	    function LinestringLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65393,7 +65817,7 @@ uniform ${precision} ${type} u_${name};
 	    return LinestringLayerOptions;
 	}(LayerOptions$1));
 
-	var __extends$12 = (window && window.__extends) || (function () {
+	var __extends$16 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65413,7 +65837,7 @@ uniform ${precision} ${type} u_${name};
 	 * @deprecated Use SymbolLayerOptions with atlas.layer.SymbolLayer instead.
 	 */
 	var PinLayerOptions = /** @class */ (function (_super) {
-	    __extends$12(PinLayerOptions, _super);
+	    __extends$16(PinLayerOptions, _super);
 	    function PinLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65463,7 +65887,7 @@ uniform ${precision} ${type} u_${name};
 	    return PinLayerOptions;
 	}(LayerOptions$1));
 
-	var __extends$13 = (window && window.__extends) || (function () {
+	var __extends$17 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65483,7 +65907,7 @@ uniform ${precision} ${type} u_${name};
 	 * @deprecated Use new PolygonLayerOptions with atlas.layer.PolygonLayer instead.
 	 */
 	var PolygonLayerOptions$1 = /** @class */ (function (_super) {
-	    __extends$13(PolygonLayerOptions, _super);
+	    __extends$17(PolygonLayerOptions, _super);
 	    function PolygonLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65506,7 +65930,7 @@ uniform ${precision} ${type} u_${name};
 	    return PolygonLayerOptions;
 	}(LayerOptions$1));
 
-	var __extends$14 = (window && window.__extends) || (function () {
+	var __extends$18 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65526,7 +65950,7 @@ uniform ${precision} ${type} u_${name};
 	 * @deprecated Use TileLayerOptions with atlas.layer.TileLayer instead.
 	 */
 	var RasterLayerOptions = /** @class */ (function (_super) {
-	    __extends$14(RasterLayerOptions, _super);
+	    __extends$18(RasterLayerOptions, _super);
 	    function RasterLayerOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65538,7 +65962,7 @@ uniform ${precision} ${type} u_${name};
 	    return RasterLayerOptions;
 	}(LayerOptions$1));
 
-	var __extends$15 = (window && window.__extends) || (function () {
+	var __extends$19 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65557,7 +65981,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for the map's lighting.
 	 */
 	var LightOptions = /** @class */ (function (_super) {
-	    __extends$15(LightOptions, _super);
+	    __extends$19(LightOptions, _super);
 	    function LightOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65597,7 +66021,7 @@ uniform ${precision} ${type} u_${name};
 	    return LightOptions;
 	}(Options));
 
-	var __extends$16 = (window && window.__extends) || (function () {
+	var __extends$1a = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65639,7 +66063,7 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
-	var __spreadArray$4 = (window && window.__spreadArray) || function (to, from) {
+	var __spreadArray$5 = (window && window.__spreadArray) || function (to, from) {
 	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
 	        to[j] = from[i];
 	    return to;
@@ -65648,7 +66072,7 @@ uniform ${precision} ${type} u_${name};
 	 * The options for the map's style.
 	 */
 	var StyleOptions = /** @class */ (function (_super) {
-	    __extends$16(StyleOptions, _super);
+	    __extends$1a(StyleOptions, _super);
 	    function StyleOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -65705,6 +66129,7 @@ uniform ${precision} ${type} u_${name};
 	         * If false all buildings will be rendered as just their footprints.
 	         * Default `false`
 	         * @default false
+	         * @deprecated
 	         */
 	        _this.showBuildingModels = false;
 	        /**
@@ -65750,7 +66175,7 @@ uniform ${precision} ${type} u_${name};
 	        /**
 	         * Specifies which set of geopolitically disputed borders and labels are displayed on the map. The View parameter (also referred to as “user region parameter”) is a 2-letter ISO-3166 Country Code that will show the correct maps for that country/region. Country/Regions that are not on the View list or if unspecified will default to the “Unified” View.
 	         * Please see the supported [Views]{@link https://aka.ms/AzureMapsLocalizationViews}
-	         * It is your responsibility to determine the location of your users, and then set the View parameter correctly for that location. The View parameter in Azure Maps must be used in compliance with applicable laws, including those regarding mapping, of the country where maps, images and other data and third party content that You are authorized to access via Azure Maps is made available.
+	         * It is your responsibility to determine the location of your users, and then set the View parameter correctly for that location. The View parameter in Azure Maps must be used in compliance with applicable laws, including those regarding mapping, of the country/region where maps, images and other data and third party content that You are authorized to access via Azure Maps is made available.
 	         * default: `undefined`
 	         * @default undefined
 	         */
@@ -65798,12 +66223,12 @@ uniform ${precision} ${type} u_${name};
 	            finally { if (e_1) throw e_1.error; }
 	        }
 	        // Then execute the standard merge behavior.
-	        return _super.prototype.merge.apply(this, __spreadArray$4([], __read$a(valueList)));
+	        return _super.prototype.merge.apply(this, __spreadArray$5([], __read$a(valueList)));
 	    };
 	    return StyleOptions;
 	}(Options));
 
-	var __extends$17 = (window && window.__extends) || (function () {
+	var __extends$1b = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -65856,7 +66281,7 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
-	var __spreadArray$5 = (window && window.__spreadArray) || function (to, from) {
+	var __spreadArray$6 = (window && window.__spreadArray) || function (to, from) {
 	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
 	        to[j] = from[i];
 	    return to;
@@ -65873,7 +66298,7 @@ uniform ${precision} ${type} u_${name};
 	 * Global properties used in all atlas service requests.
 	 */
 	var ServiceOptions = /** @class */ (function (_super) {
-	    __extends$17(ServiceOptions, _super);
+	    __extends$1b(ServiceOptions, _super);
 	    function ServiceOptions() {
 	        var _this = _super !== null && _super.apply(this, arguments) || this;
 	        /**
@@ -66091,10 +66516,10 @@ uniform ${precision} ${type} u_${name};
 	        // won't change default behavior in Options as usually that's what desired
 	        // instead capture it here and reassign.
 	        var currentTransforms = this._transformers;
-	        var transformersToMerge = valueList ? valueList.filter(function (value) { return value !== undefined; }).reduce(function (flattened, value) { return __spreadArray$5(__spreadArray$5([], __read$b(flattened)), __read$b(value._transformers || [])); }, []) : [];
+	        var transformersToMerge = valueList ? valueList.filter(function (value) { return value !== undefined; }).reduce(function (flattened, value) { return __spreadArray$6(__spreadArray$6([], __read$b(flattened)), __read$b(value._transformers || [])); }, []) : [];
 	        // Then execute the standard merge behavior.
 	        // If subscription key auth method isn't being used then the subscription key property should be undefined.
-	        var merged = _super.prototype.merge.apply(this, __spreadArray$5([], __read$b(valueList)));
+	        var merged = _super.prototype.merge.apply(this, __spreadArray$6([], __read$b(valueList)));
 	        if (merged.authOptions.authType !== exports.AuthenticationType.subscriptionKey) {
 	            merged["subscription-key"] = merged.subscriptionKey = undefined;
 	        }
@@ -66106,7 +66531,7 @@ uniform ${precision} ${type} u_${name};
 	        if (merged.mapConfiguration && typeof merged.mapConfiguration !== 'string') {
 	            merged.mapConfiguration = __assign$7(__assign$7({}, merged.mapConfiguration), { defaultConfiguration: merged.mapConfiguration.defaultConfiguration || merged.mapConfiguration['defaultStyle'], configurations: merged.mapConfiguration.configurations || merged.mapConfiguration['styles'] });
 	        }
-	        this._transformers = __spreadArray$5(__spreadArray$5([], __read$b(currentTransforms || [])), __read$b(transformersToMerge.filter(function (toMerge) { return !currentTransforms.includes(toMerge); })));
+	        this._transformers = __spreadArray$6(__spreadArray$6([], __read$b(currentTransforms || [])), __read$b(transformersToMerge.filter(function (toMerge) { return !currentTransforms.includes(toMerge); })));
 	        if (this.transformRequest && !this._transformers.includes(this.transformRequest)) {
 	            this._transformers.push(this.transformRequest);
 	        }
@@ -66355,7 +66780,7 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
-	var __spreadArray$6 = (window && window.__spreadArray) || function (to, from) {
+	var __spreadArray$7 = (window && window.__spreadArray) || function (to, from) {
 	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
 	        to[j] = from[i];
 	    return to;
@@ -66382,6 +66807,13 @@ uniform ${precision} ${type} u_${name};
 	         * Preserve the map configuration that was used before the indoor map configuration was set
 	         */
 	        this.preservedPreindoorMapConfiguration = undefined;
+	        /**
+	         * The state of the progressive loading
+	         */
+	        this._progressiveLoadingState = {
+	            mapStyle: undefined,
+	            pendingVisibilityChange: undefined,
+	        };
 	        this._deferLayerGroupVisibilities = function (layerGroupLayers, initLayerGroups) {
 	            var validInitLayerGroups = initLayerGroups.filter(function (groupName) { return groupName in layerGroupLayers; });
 	            // If the initial layer groups are invalid, skip the progressive loading.
@@ -66389,11 +66821,19 @@ uniform ${precision} ${type} u_${name};
 	                return;
 	            var map = _this.map._getMap();
 	            var currentZoomLevel = map.getZoom();
-	            // Select the layers to be deferred
+	            var currentMapStyle = _this.map.getStyle().style;
+	            // Cancel and release previous pending callback, if any.
+	            if (_this._progressiveLoadingState.pendingVisibilityChange) {
+	                _this.map.events.remove('load', _this._progressiveLoadingState.pendingVisibilityChange);
+	                _this._progressiveLoadingState.pendingVisibilityChange = null;
+	            }
+	            // Keep the current map style for future comparison.
+	            _this._progressiveLoadingState.mapStyle = currentMapStyle;
+	            // Select deferrable layers
 	            var deferredLayers = Object.entries(layerGroupLayers).reduce(function (deferred, _a) {
 	                var _b = __read$c(_a, 2), groupName = _b[0], layers = _b[1];
 	                var isInInitialLayerGroup = validInitLayerGroups.includes(groupName);
-	                return __spreadArray$6(__spreadArray$6([], __read$c(deferred)), __read$c(layers.filter(function (layer) {
+	                return __spreadArray$7(__spreadArray$7([], __read$c(deferred)), __read$c(layers.filter(function (layer) {
 	                    var _a;
 	                    // Exclude custom layers
 	                    if (layer.type === 'custom')
@@ -66416,22 +66856,34 @@ uniform ${precision} ${type} u_${name};
 	                            return false;
 	                        }
 	                    }
-	                    // Defer visible layers only.
+	                    // Select visible layers only.
 	                    return ((_a = layer.layout) === null || _a === void 0 ? void 0 : _a.visibility) !== 'none';
 	                })));
 	            }, []);
-	            // Hide the deferred layers at initial load, therefore we can save the render time.
+	            // Hide the deferrable layers at initial load, therefore we can save the render time.
 	            deferredLayers.forEach(function (layer) {
+	                // Since this happens before sending style object into the map rendering,
+	                // we only need to update the style object, but not necessary to update maplibre's layout properties.
 	                layer.layout = layer.layout || {};
 	                layer.layout.visibility = 'none';
 	            });
-	            // Make the deferred layers visible once the map instance is fully loaded
-	            _this.map.events.addOnce('load', function () {
+	            // Make the deferred layers visible once the map instance is fully loaded.
+	            _this._progressiveLoadingState.pendingVisibilityChange = function () {
+	                // Release the callback.
+	                _this._progressiveLoadingState.pendingVisibilityChange = null;
+	                // Bail out the callback once map style has changed.
+	                var nextMapStyle = _this.map.getStyle().style;
+	                if (currentMapStyle !== nextMapStyle)
+	                    return;
+	                // Make deferred layers visible
 	                deferredLayers.forEach(function (layer) {
+	                    // This happens after the map rendering; Therefore, we need to update
+	                    // both the style object and the maplibre's layout properties.
 	                    layer.layout.visibility = 'visible';
 	                    map.setLayoutProperty(layer.id, 'visibility', 'visible');
 	                });
-	            });
+	            };
+	            _this.map.events.addOnce('load', _this._progressiveLoadingState.pendingVisibilityChange);
 	        };
 	        this._onStyleData = function () {
 	            _this._lookUpAsync(_this.map.getStyle()).then(function (style) {
@@ -66573,7 +67025,12 @@ uniform ${precision} ${type} u_${name};
 	                        domain: _this.serviceOptions.staticAssetsDomain,
 	                        path: constants.stylePath + "/" + constants.styleResourcePath + "/" + style.name,
 	                        queryParams: {
-	                            styleVersion: _this.serviceOptions.styleDefinitionsVersion,
+	                            // Use the style version from the API response if it's available,
+	                            // otherwise fallback to the version specified in the serviceOptions.
+	                            // This is needed for flight testing the 2023-01-01 style version.
+	                            styleVersion: definitions.version !== undefined && definitions.version !== null
+	                                ? definitions.version
+	                                : _this.serviceOptions.styleDefinitionsVersion
 	                            // thus far we don't need to differentiate based on parameter here, as stylePatch will be called on cached styles as well 
 	                            //language: styleOptions.language
 	                        },
@@ -66623,19 +67080,7 @@ uniform ${precision} ${type} u_${name};
 	        // should be modified before they are applied to the map.
 	        var styleOptions = this.map.getStyle();
 	        var trafficOptions = this.map.getTraffic();
-	        return __assign$8(__assign$8({}, nextStyle), { 
-	            // force a replacement of language placeholder in the tileset url to avoid resolution to a same cache with placeholders on language change
-	            sources: Object.entries(nextStyle.sources).reduce(function (newSources, _a) {
-	                var _b = __read$c(_a, 2), sourceKey = _b[0], source = _b[1];
-	                var newSource = __assign$8({}, source);
-	                if ('url' in newSource && typeof newSource.url === 'string') {
-	                    if (newSource.url.includes(constants.languagePlaceHolder)) {
-	                        newSource.url = newSource.url.replace(constants.languagePlaceHolder, styleOptions.language);
-	                    }
-	                }
-	                newSources[sourceKey] = newSource;
-	                return newSources;
-	            }, {}), layers: nextStyle.layers.map(function (layer) {
+	        return __assign$8(__assign$8({}, nextStyle), { layers: nextStyle.layers.map(function (layer) {
 	                var _a, _b, _c, _d, _e, _f;
 	                var nextLayer = __assign$8({}, layer);
 	                var layerGroup = LayerGroupComparator.getLayerGroup(nextLayer);
@@ -66721,7 +67166,22 @@ uniform ${precision} ${type} u_${name};
 	            this.map._getMap().setStyle(this.getStyle(styleOptions), {
 	                diff: diff,
 	                validate: this.serviceOptions.validateStyle,
-	                transformStyle: function (previousStyle, nextStyle) {
+	                transformStyle: function (previousStyle, style) {
+	                    var nextStyle = style;
+	                    var shouldProgressiveLoading = (styleOptions.progressiveLoading &&
+	                        // The feature only effective at the initial load.
+	                        !_this.map._isLoaded());
+	                    // Shallow-clone the style object and duplicate layer.layout properties to avoid side-effects.
+	                    if (shouldProgressiveLoading && Array.isArray(style === null || style === void 0 ? void 0 : style.layers)) {
+	                        nextStyle = __assign$8({}, style);
+	                        nextStyle.layers = nextStyle.layers.map(function (layer) {
+	                            var nextLayer = __assign$8({}, layer);
+	                            if (layer.layout) {
+	                                nextLayer.layout = __assign$8({}, layer.layout);
+	                            }
+	                            return nextLayer;
+	                        });
+	                    }
 	                    // 1. derive the base new style (without user layers)
 	                    var targetStyle = _this.deriveNewStyle(previousStyle, nextStyle);
 	                    // 2. derive layer groups for the new style
@@ -66734,12 +67194,9 @@ uniform ${precision} ${type} u_${name};
 	                        .reduce(function (layerGroupLayers, _a) {
 	                        var _b;
 	                        var nextLayer = _a.nextLayer, layerGroup = _a.layerGroup;
-	                        return (__assign$8(__assign$8({}, layerGroupLayers), (_b = {}, _b[layerGroup] = layerGroup in layerGroupLayers ? __spreadArray$6(__spreadArray$6([], __read$c(layerGroupLayers[layerGroup])), [nextLayer]) : [nextLayer], _b)));
+	                        return (__assign$8(__assign$8({}, layerGroupLayers), (_b = {}, _b[layerGroup] = layerGroup in layerGroupLayers ? __spreadArray$7(__spreadArray$7([], __read$c(layerGroupLayers[layerGroup])), [nextLayer]) : [nextLayer], _b)));
 	                    }, {});
 	                    // 3. side effect: progressively render map layers to the canvas to shorten the time to the first meaningful render.
-	                    var shouldProgressiveLoading = (styleOptions.progressiveLoading &&
-	                        // The feature only effective at the initial load.
-	                        !_this.map._isLoaded());
 	                    if (shouldProgressiveLoading) {
 	                        var initLayerGroups = styleOptions.progressiveLoadingInitialLayerGroups;
 	                        if (Array.isArray(initLayerGroups) && initLayerGroups.length > 0) {
@@ -66884,27 +67341,30 @@ uniform ${precision} ${type} u_${name};
 	     * Fetches a json resource at the specified domain and path.
 	     */
 	    StyleManager.prototype._request = function (domain, path, resourceType, customQueryParams) {
-	        var _a;
+	        var _a, _b;
 	        if (customQueryParams === void 0) { customQueryParams = {}; }
 	        return __awaiter$2(this, void 0, void 0, function () {
 	            var requestParams, fetchOptions;
-	            var _b;
-	            return __generator$2(this, function (_c) {
-	                switch (_c.label) {
+	            var _c;
+	            return __generator$2(this, function (_d) {
+	                switch (_d.label) {
 	                    case 0:
 	                        requestParams = {
 	                            url: new Url({
 	                                protocol: "https",
 	                                domain: domain,
 	                                path: path,
-	                                queryParams: __assign$8((_b = {}, _b[constants.apiVersionQueryParameter] = this.serviceOptions.styleAPIVersion, _b), customQueryParams)
+	                                queryParams: __assign$8((_c = {}, _c[constants.apiVersionQueryParameter] = this.serviceOptions.styleAPIVersion, 
+	                                // Generate a hash code to avoid cache conflict
+	                                // TODO: Remove this once style version 2023-01-01 is publicly available
+	                                _c.hash = StyleManager._hashCode((_a = this.map.authentication) === null || _a === void 0 ? void 0 : _a.getToken()), _c), customQueryParams)
 	                            }).toString()
 	                        };
 	                        if (typeof this.serviceOptions.transformRequest === "function" && resourceType) {
 	                            // If a transformRequest(...) was specified use it.
 	                            requestParams = this.serviceOptions.transformRequest(requestParams.url, resourceType);
 	                        }
-	                        (_a = this.map.authentication) === null || _a === void 0 ? void 0 : _a.signRequest(requestParams);
+	                        (_b = this.map.authentication) === null || _b === void 0 ? void 0 : _b.signRequest(requestParams);
 	                        fetchOptions = {
 	                            method: "GET",
 	                            mode: "cors",
@@ -66921,11 +67381,26 @@ uniform ${precision} ${type} u_${name};
 	                                    throw new Error("HTTP " + response.status + ": " + response.statusText + " ");
 	                                }
 	                            })];
-	                    case 1: return [2 /*return*/, _c.sent()];
+	                    case 1: return [2 /*return*/, _d.sent()];
 	                }
 	            });
 	        });
 	    };
+	    /**
+	     * A basic helper function to generate a hash from an input string.
+	     */
+	    StyleManager._hashCode = function (str) {
+	        if (str === void 0) { str = ""; }
+	        var chr, hash = 0;
+	        if (!str)
+	            return hash;
+	        for (var i = 0; i < str.length; i++) {
+	            chr = str.charCodeAt(i);
+	            hash = (hash << 5) - hash + chr;
+	            hash |= 0; // Convert to 32bit integer
+	        }
+	        return hash;
+	    };
 	    return StyleManager;
 	}());
 
@@ -66934,7 +67409,7 @@ uniform ${precision} ${type} u_${name};
 	 */
 	var isHMREnabled = function () { return 'ENVIRONMENT' in window && !!window['ENVIRONMENT']['hmr']; };
 
-	var __extends$18 = (window && window.__extends) || (function () {
+	var __extends$1c = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
 	            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -67012,7 +67487,7 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
-	var __spreadArray$7 = (window && window.__spreadArray) || function (to, from) {
+	var __spreadArray$8 = (window && window.__spreadArray) || function (to, from) {
 	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
 	        to[j] = from[i];
 	    return to;
@@ -67032,7 +67507,7 @@ uniform ${precision} ${type} u_${name};
 	 * The control for a visual and interactive web map.
 	 */
 	var Map$2 = /** @class */ (function (_super) {
-	    __extends$18(Map, _super);
+	    __extends$1c(Map, _super);
 	    /**
 	     * Displays a map in the specified container.
 	     * @param container The id of the element where the map should be displayed.
@@ -67196,7 +67671,9 @@ uniform ${precision} ${type} u_${name};
 	                _this.events.invoke("error", errorData);
 	            });
 	            // --> Set initial camera state of map
-	            _this.setCamera(__assign$9(__assign$9({}, options), { type: "jump", duration: 0 }));
+	            _this.setCamera(__assign$9(__assign$9({ 
+	                // Default minZoom to ensure the map doesn't zoom out to unsupported zoom levels.
+	                minZoom: 1 }, options), { type: "jump", duration: 0 }));
 	            _this.flowDelegate = new FlowServiceDelegate(_this);
 	            _this.accessibleMapDelegate = new AccessibleMapDelegate(_this);
 	            _this.userInteractionDelegate = new UserInteractionDelegate(_this, options);
@@ -67301,6 +67778,12 @@ uniform ${precision} ${type} u_${name};
 	                };
 	                throw new Error(JSON.stringify(errorDetails));
 	            }
+	            if ('pitch' in options) {
+	                mapboxCameraOptions.pitch = options.pitch;
+	            }
+	            if ('bearing' in options) {
+	                mapboxCameraOptions.bearing = options.bearing;
+	            }
 	            this.map.setMaxZoom(cameraBoundsOptions.maxZoom);
 	            this._invokeEvent("maxzoomchanged", this.map.getMaxZoom());
 	            maxBounds = this._generateSafeBounds(cameraBoundsOptions.maxBounds);
@@ -67419,12 +67902,16 @@ uniform ${precision} ${type} u_${name};
 	        if (newOptions.showTileBoundaries !== this.styleOptions.showTileBoundaries) {
 	            this.map.showTileBoundaries = newOptions.showTileBoundaries;
 	        }
+	        if (newOptions.showBuildingModels) {
+	            console.warn("showBuildingModels is deprecated.");
+	        }
 	        // Some delegates may rely on a styledata event to know when to check if the language changes.
 	        // If this function is restructured such that a styledata event won't always trigger
 	        // if the language is changed, then either those delegates need changed
 	        // or the styledata event manually invoked.
+	        var noDiffOnLanguageViewChange = diff && (this.styleOptions.language === newOptions.language && this.styleOptions.view === newOptions.view);
 	        this.styleOptions = newOptions;
-	        this._setStyleComponents(newOptions, diff);
+	        this._setStyleComponents(newOptions, noDiffOnLanguageViewChange);
 	    };
 	    /**
 	     * Returns the map control's current style settings.
@@ -67815,7 +68302,7 @@ uniform ${precision} ${type} u_${name};
 	            urls = layer.getOptions().subdomains || [];
 	        }
 	        // Add the tile urls to the layer, but don't update the map yet.
-	        urls.push.apply(urls, __spreadArray$7([], __read$d(tileSources)));
+	        urls.push.apply(urls, __spreadArray$8([], __read$d(tileSources)));
 	        layer._setOptionsNoUpdate({
 	            subdomains: urls
 	        });
@@ -67942,6 +68429,9 @@ uniform ${precision} ${type} u_${name};
 	            }
 	        }
 	        if (this.trafficOptions.flow && this.trafficOptions.flow !== "none") {
+	            if (["absolute", "relative-delay"].includes(this.trafficOptions.flow)) {
+	                console.warn("The 'absolute' and 'relative-delay' flow options are deprecated. Please use 'relative' instead.");
+	            }
 	            try {
 	                if (this.trafficOptions.flow !== previousFlowOption) {
 	                    this.flowDelegate.addToMap();
@@ -67984,9 +68474,13 @@ uniform ${precision} ${type} u_${name};
 	     * Clean up the map's resources. Map will not function correctly after calling this method.
 	     */
 	    Map.prototype.dispose = function () {
+	        var _a;
 	        this.clear();
 	        this.map.remove();
+	        (_a = this.authentication) === null || _a === void 0 ? void 0 : _a.dispose();
 	        this.removed = true;
+	        // Remove event listeners
+	        window.removeEventListener("resize", this._windowResizeCallback);
 	        while (this.getMapContainer().firstChild) {
 	            var currChild = this.getMapContainer().firstChild;
 	            this.getMapContainer().removeChild(currChild);
@@ -68331,7 +68825,7 @@ uniform ${precision} ${type} u_${name};
 	    }
 	    return ar;
 	};
-	var __spreadArray$8 = (window && window.__spreadArray) || function (to, from) {
+	var __spreadArray$9 = (window && window.__spreadArray) || function (to, from) {
 	    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
 	        to[j] = from[i];
 	    return to;
@@ -68477,7 +68971,7 @@ uniform ${precision} ${type} u_${name};
 	            lineLength = 50;
 	        }
 	        var lines = c.split(/<(tr|div|br|li|h[0-9]|p>)/);
-	        longestStringLength = Math.max.apply(Math, __spreadArray$8([], __read$e((lines.map(function (el) { return el.replace(/<[a-zA-Z0-9\s=\/]+>/g, "").length; }))))) - 1;
+	        longestStringLength = Math.max.apply(Math, __spreadArray$9([], __read$e((lines.map(function (el) { return el.replace(/<[a-zA-Z0-9\s=\/]+>/g, "").length; }))))) - 1;
 	        var w = Math.ceil(longestStringLength * 3.5);
 	        if (w < width) {
 	            width = w;