azure-maps-control 2.2.4 → 2.2.5

package/dist/atlas-core-snr.js

@@ -43619,7 +43619,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    return Url;
 	}());
 
-	var version = "2.2.4";
+	var version = "2.2.5";
 
 	/**
 	 * A helper class that provides methods for getting various forms of the map controls current version.
@@ -53440,6 +53440,72 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 
 	var cloneDeepWith_1 = cloneDeepWith;
 
+	/**
+	 * A hidden HTML element that is used to provide accessibility to shapes such as bubble.
+	 */
+	var AccessibleIndicator = /** @class */ (function () {
+	    /**
+	     * Constructs an AccessibleIndicator object by initializing a hidden `div` element.
+	     * @internal
+	     */
+	    function AccessibleIndicator(options) {
+	        var _this = this;
+	        /**
+	         * Attaches the indicator to the HTML document in a hidden style.
+	         * @param map The map.
+	         */
+	        this.attach = function (map) {
+	            // If attaching to a different map, remove popup on current map
+	            if (_this.map !== map) {
+	                // If map was defined the indicator was attached to another map.
+	                if (_this.map) {
+	                    _this.detachFromCurrentMap();
+	                }
+	                _this.map = map;
+	                _this.map.indicators._getCollectionDiv().appendChild(_this.element);
+	                _this.map.indicators.add(_this);
+	            }
+	        };
+	        /**
+	         * Removes the indicator from the map and the HTML document.
+	        */
+	        this.remove = function () {
+	            _this.detachFromCurrentMap();
+	            _this.element.remove();
+	        };
+	        /**
+	         * Get the DOM element of the indicator.
+	         * @returns The DOM element of the indicator.
+	         */
+	        this.getElement = function () {
+	            return _this.element;
+	        };
+	        this.detachFromCurrentMap = function () {
+	            if (_this.map) {
+	                _this.map.indicators.remove(_this);
+	                delete _this.map;
+	            }
+	        };
+	        this.element = document.createElement("div");
+	        // Set tabindex to 0 to make the element focusable.
+	        this.element.setAttribute("tabindex", "0");
+	        // Set the role to option, and it's container to listbox so the reader will read the listbox as a list.
+	        // For example, NVDA will read "data point, {posinset} of {setsize}" when the indicator is focused.
+	        this.element.setAttribute("role", "option");
+	        if (options === null || options === void 0 ? void 0 : options.setSize)
+	            this.element.setAttribute("aria-setsize", options.setSize.toString());
+	        if (options === null || options === void 0 ? void 0 : options.positionInSet)
+	            this.element.setAttribute("aria-posinset", options.positionInSet.toString());
+	        this.element.setAttribute("aria-label", "data point");
+	        this.element.classList.add(AccessibleIndicator.Css.hidden);
+	    }
+	    // CSS class names.
+	    AccessibleIndicator.Css = {
+	        hidden: "hidden-accessible-element"
+	    };
+	    return AccessibleIndicator;
+	}());
+
 	var __extends$k = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
@@ -54298,7 +54364,9 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    // and can be used to determine which events are ours vs Mapbox's.
 	    Layer.LayerEvents = {
 	        layeradded: undefined,
-	        layerremoved: undefined
+	        layerremoved: undefined,
+	        focusin: undefined,
+	        focusout: undefined,
 	    };
 	    return Layer;
 	}(EventEmitter));
@@ -54453,6 +54521,14 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	         * @default 8
 	         */
 	        _this.radius = 8;
+	        /**
+	         * @internal
+	         * Specifies whether to create focusable indicators for the bubbles.
+	         *
+	         * Note: We treat this as an internal option for now because we hadn't fully decided the default styling for the indicators.
+	         * Once we decide, we will make this a public option or remove it.
+	         */
+	        _this.createIndicators = false;
 	        return _this;
 	    }
 	    return BubbleLayerOptions;
@@ -54473,6 +54549,58 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
 	    };
 	})();
+	var __awaiter$1 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+	    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+	    return new (P || (P = Promise))(function (resolve, reject) {
+	        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+	        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+	        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+	        step((generator = generator.apply(thisArg, _arguments || [])).next());
+	    });
+	};
+	var __generator$1 = (window && window.__generator) || function (thisArg, body) {
+	    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+	    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+	    function verb(n) { return function (v) { return step([n, v]); }; }
+	    function step(op) {
+	        if (f) throw new TypeError("Generator is already executing.");
+	        while (_) try {
+	            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+	            if (y = 0, t) op = [op[0] & 2, t.value];
+	            switch (op[0]) {
+	                case 0: case 1: t = op; break;
+	                case 4: _.label++; return { value: op[1], done: false };
+	                case 5: _.label++; y = op[1]; op = [0]; continue;
+	                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+	                default:
+	                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+	                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+	                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+	                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+	                    if (t[2]) _.ops.pop();
+	                    _.trys.pop(); continue;
+	            }
+	            op = body.call(thisArg, _);
+	        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+	        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+	    }
+	};
+	var __read$3 = (window && window.__read) || function (o, n) {
+	    var m = typeof Symbol === "function" && o[Symbol.iterator];
+	    if (!m) return o;
+	    var i = m.call(o), r, ar = [], e;
+	    try {
+	        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+	    }
+	    catch (error) { e = { error: error }; }
+	    finally {
+	        try {
+	            if (r && !r.done && (m = i["return"])) m.call(i);
+	        }
+	        finally { if (e) throw e.error; }
+	    }
+	    return ar;
+	};
 	/**
 	 * Renders Point objects as scalable circles (bubbles).
 	 */
@@ -54486,6 +54614,72 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	     */
 	    function BubbleLayer(source, id, options) {
 	        var _this = _super.call(this, id) || this;
+	        _this.accessibleIndicator = [];
+	        _this.setAccessibleIndicator = function () { return __awaiter$1(_this, void 0, void 0, function () {
+	            var features, createIndicator, insertHiddenBefore, attach;
+	            var _this = this;
+	            return __generator$1(this, function (_a) {
+	                this.accessibleIndicator.forEach(function (indicator) { return indicator.remove(); });
+	                this.accessibleIndicator = [];
+	                features = this.map.layers.getRenderedShapes(this.map.getCamera().bounds, this);
+	                createIndicator = function (features, idx) {
+	                    var bubbleFeature = features[idx];
+	                    var indicator = new AccessibleIndicator({ positionInSet: idx + 1, setSize: features.length });
+	                    var element = indicator.getElement();
+	                    var _a = __read$3(_this.map.positionsToPixels([bubbleFeature.data.geometry.coordinates]), 1), pixel = _a[0];
+	                    element.addEventListener('focusin', function (event) {
+	                        _this.accessibleIndicator.filter(function (p) { return p !== indicator; }).forEach(function (popup) { return popup.remove(); });
+	                        // insert previous and next popups
+	                        if (idx - 1 >= 0) {
+	                            insertHiddenBefore(indicator, createIndicator(features, idx - 1));
+	                        }
+	                        if (idx + 1 < features.length) {
+	                            attach(createIndicator(features, idx + 1));
+	                        }
+	                        _this.map._getMap().setPaintProperty(_this.id, 'circle-stroke-color', ['case', ['==', ['get', '_azureMapsShapeId'], bubbleFeature.data.id], '#000000', _this.options.strokeColor]);
+	                        var focusEvent = {
+	                            target: element,
+	                            type: 'focusin',
+	                            map: _this.map,
+	                            shape: bubbleFeature,
+	                            originalEvent: event,
+	                            pixel: pixel
+	                        };
+	                        _this._invokeEvent('focusin', focusEvent);
+	                    });
+	                    element.addEventListener('focusout', function (event) {
+	                        _this.map._getMap().setPaintProperty(_this.id, 'circle-stroke-color', ['case', ['==', ['get', '_azureMapsShapeId'], bubbleFeature.data.id], _this.options.strokeColor, _this.options.strokeColor]);
+	                        var focusEvent = {
+	                            target: element,
+	                            type: 'focusout',
+	                            map: _this.map,
+	                            shape: bubbleFeature,
+	                            originalEvent: event,
+	                            pixel: pixel
+	                        };
+	                        _this._invokeEvent('focusout', focusEvent);
+	                    });
+	                    _this.accessibleIndicator.push(indicator);
+	                    return indicator;
+	                };
+	                insertHiddenBefore = function (base, toInsert) {
+	                    toInsert.attach(_this.map);
+	                    var elementToSwapIn = toInsert.getElement();
+	                    var baseElement = base.getElement();
+	                    baseElement.parentElement.insertBefore(elementToSwapIn, baseElement);
+	                };
+	                attach = function (popup) {
+	                    popup.attach(_this.map);
+	                };
+	                if (features.length > 0) {
+	                    attach(createIndicator(features, 0));
+	                }
+	                if (features.length > 1) {
+	                    attach(createIndicator(features, features.length - 1));
+	                }
+	                return [2 /*return*/];
+	            });
+	        }); };
 	        _this.options = new BubbleLayerOptions().merge(cloneDeepWith_1(options, BubbleLayerOptions._cloneCustomizer));
 	        _this.options.source = source || _this.options.source;
 	        return _this;
@@ -54533,6 +54727,20 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        }
 	        this.options = newOptions;
 	    };
+	    BubbleLayer.prototype.onAdd = function (map) {
+	        _super.prototype.onAdd.call(this, map);
+	        if (this.options.createIndicators) {
+	            map.events.addOnce('idle', this.setAccessibleIndicator);
+	            map.events.add('moveend', this.setAccessibleIndicator);
+	        }
+	    };
+	    BubbleLayer.prototype.onRemove = function () {
+	        _super.prototype.onRemove.call(this);
+	        if (this.options.createIndicators) {
+	            this.map.events.remove('idle', this.setAccessibleIndicator);
+	            this.map.events.remove('moveend', this.setAccessibleIndicator);
+	        }
+	    };
 	    /**
 	     * @internal
 	     */
@@ -55651,7 +55859,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 	};
-	var __read$3 = (window && window.__read) || function (o, n) {
+	var __read$4 = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -55742,7 +55950,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            finally { if (e_1) throw e_1.error; }
 	        }
 	        // Then execute the standard merge behavior.
-	        var merged = _super.prototype.merge.apply(this, __spreadArray([], __read$3(valueList)));
+	        var merged = _super.prototype.merge.apply(this, __spreadArray([], __read$4(valueList)));
 	        if (isNewColorSet) {
 	            merged.fillPattern = undefined;
 	        }
@@ -57073,7 +57281,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
 	    };
 	})();
-	var __read$4 = (window && window.__read) || function (o, n) {
+	var __read$5 = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -57185,7 +57393,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	         */
 	        _this._onDown = function (event) {
 	            _this.map.popups._addDraggedPopup(_this);
-	            var _a = __read$4(_this.map.positionsToPixels([_this.options.position]), 1), anchorPixel = _a[0];
+	            var _a = __read$5(_this.map.positionsToPixels([_this.options.position]), 1), anchorPixel = _a[0];
 	            if (event.type === "mousedown") {
 	                event = event;
 	                _this.dragOffset = [
@@ -57349,7 +57557,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            pixel[0] + this.dragOffset[0],
 	            pixel[1] + this.dragOffset[1]
 	        ];
-	        var _a = __read$4(this.map.pixelsToPositions([anchorPixel]), 1), anchorPos = _a[0];
+	        var _a = __read$5(this.map.pixelsToPositions([anchorPixel]), 1), anchorPos = _a[0];
 	        this.options.position = anchorPos;
 	        this.marker.setLngLat(this.options.position);
 	        this._invokeEvent("drag", { type: "drag", target: this });
@@ -57503,7 +57711,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            posY = pt.y;
 	        }
 	        else {
-	            var _a = __read$4(map.positionsToPixels([options.position]), 1), _b = __read$4(_a[0], 2), x = _b[0], y = _b[1];
+	            var _a = __read$5(map.positionsToPixels([options.position]), 1), _b = __read$5(_a[0], 2), x = _b[0], y = _b[1];
 	            posX = x;
 	            posY = y;
 	        }
@@ -58420,7 +58628,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
 	    };
 	})();
-	var __read$5 = (window && window.__read) || function (o, n) {
+	var __read$6 = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -58573,7 +58781,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        for (var _i = 0; _i < arguments.length; _i++) {
 	            valueList[_i] = arguments[_i];
 	        }
-	        var merged = _super.prototype.merge.apply(this, __spreadArray$1([], __read$5(valueList)));
+	        var merged = _super.prototype.merge.apply(this, __spreadArray$1([], __read$6(valueList)));
 	        if (merged.authType === exports.AuthenticationType.subscriptionKey) {
 	            merged.authContext = merged.aadAppId = merged.getToken = undefined;
 	        }
@@ -59272,7 +59480,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    return __assign$4.apply(this, arguments);
 	};
 
-	var __awaiter$1 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+	var __awaiter$2 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
 	    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
 	    return new (P || (P = Promise))(function (resolve, reject) {
 	        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -59281,7 +59489,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        step((generator = generator.apply(thisArg, _arguments || [])).next());
 	    });
 	};
-	var __generator$1 = (window && window.__generator) || function (thisArg, body) {
+	var __generator$2 = (window && window.__generator) || function (thisArg, body) {
 	    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
 	    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
 	    function verb(n) { return function (v) { return step([n, v]); }; }
@@ -59308,7 +59516,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
 	    }
 	};
-	var __read$6 = (window && window.__read) || function (o, n) {
+	var __read$7 = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -59465,14 +59673,17 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            var trafficOptions = _this.map.getTraffic();
 	            if (trafficOptions.flow !== "none") {
 	                var trafficFlowComponent = _this.map.layers.getLayerById("traffic_" + trafficOptions.flow);
+	                if (!trafficFlowComponent && ['absolute', 'relative-delay'].includes(trafficOptions.flow)) {
+	                    // Fallback to relative if deprecated flow type is used
+	                    trafficFlowComponent = _this.map.layers.getLayerById("traffic_relative");
+	                }
 	                if (trafficFlowComponent) {
-	                    _this.lastFlowMode = trafficOptions.flow;
+	                    _this.lastFlowMode = trafficFlowComponent.getId().replace("traffic_", "");
 	                    trafficFlowComponent._updateLayoutProperty("visibility", "visible", "none");
 	                }
 	            }
 	        };
 	        this.removeFromMap = function () {
-	            var trafficOptions = _this.map.getTraffic();
 	            if (_this.lastFlowMode != "none") {
 	                var trafficFlowComponent = _this.map.layers.getLayerById("traffic_" + _this.lastFlowMode);
 	                if (trafficFlowComponent) {
@@ -60206,7 +60417,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 	};
-	var __read$7 = (window && window.__read) || function (o, n) {
+	var __read$8 = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -60404,7 +60615,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        var callbacks = new Dictionary(this.mapCallbackHandler.getEventCallbacks(eventType, layer));
 	        if (callbacks) {
 	            callbacks.forEach(function (_a, callback) {
-	                var _b = __read$7(_a, 2), _ = _b[0], once = _b[1];
+	                var _b = __read$8(_a, 2), _ = _b[0], once = _b[1];
 	                // Invoking a listener this way circumvents the fire once logic in the modified callback.
 	                // So we check if the callback was added as a fire once and if so remove it here.
 	                if (once) {
@@ -60512,7 +60723,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            eventDict.forEach(function (callbackDict, eventType) {
 	                callbackDict.forEach(function (_a) {
 	                    var e_6, _b;
-	                    var _c = __read$7(_a, 1), modifiedCallback = _c[0];
+	                    var _c = __read$8(_a, 1), modifiedCallback = _c[0];
 	                    try {
 	                        for (var _d = __values$a(layer._getLayerIds()), _e = _d.next(); !_e.done; _e = _d.next()) {
 	                            var mbLayerId = _e.value;
@@ -60545,7 +60756,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            eventDict.forEach(function (callbackDict, eventType) {
 	                callbackDict.forEach(function (_a) {
 	                    var e_7, _b;
-	                    var _c = __read$7(_a, 1), modifiedCallback = _c[0];
+	                    var _c = __read$8(_a, 1), modifiedCallback = _c[0];
 	                    try {
 	                        for (var _d = __values$a(layer._getLayerIds()), _e = _d.next(); !_e.done; _e = _d.next()) {
 	                            var mbLayerId = _e.value;
@@ -60944,7 +61155,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 	};
-	var __read$8 = (window && window.__read) || function (o, n) {
+	var __read$9 = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -61396,7 +61607,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	                // 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$3([], __read$8(this_1.layerIndex[index]._getLayerIds()
+	                    layerIds.push.apply(layerIds, __spreadArray$3([], __read$9(this_1.layerIndex[index]._getLayerIds()
 	                        .filter(function (id) { return !!_this.map._getMap().getLayer(id); }))));
 	                }
 	                else {
@@ -62139,7 +62350,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 	};
-	var __read$9 = (window && window.__read) || function (o, n) {
+	var __read$a = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -62230,7 +62441,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            }
 	            finally { if (e_1) throw e_1.error; }
 	        }
-	        return _super.prototype.merge.apply(this, __spreadArray$4([], __read$9(valuesList)));
+	        return _super.prototype.merge.apply(this, __spreadArray$4([], __read$a(valuesList)));
 	    };
 	    return CameraBoundsOptions;
 	}(Options));
@@ -62703,7 +62914,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 	};
-	var __read$a = (window && window.__read) || function (o, n) {
+	var __read$b = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -62878,7 +63089,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            finally { if (e_1) throw e_1.error; }
 	        }
 	        // Then execute the standard merge behavior.
-	        return _super.prototype.merge.apply(this, __spreadArray$5([], __read$a(valueList)));
+	        return _super.prototype.merge.apply(this, __spreadArray$5([], __read$b(valueList)));
 	    };
 	    return StyleOptions;
 	}(Options));
@@ -62920,7 +63131,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 	};
-	var __read$b = (window && window.__read) || function (o, n) {
+	var __read$c = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -63171,10 +63382,10 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        // 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$6(__spreadArray$6([], __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$c(flattened)), __read$c(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$6([], __read$b(valueList)));
+	        var merged = _super.prototype.merge.apply(this, __spreadArray$6([], __read$c(valueList)));
 	        if (merged.authOptions.authType !== exports.AuthenticationType.subscriptionKey) {
 	            merged["subscription-key"] = merged.subscriptionKey = undefined;
 	        }
@@ -63186,7 +63397,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        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$6(__spreadArray$6([], __read$b(currentTransforms || [])), __read$b(transformersToMerge.filter(function (toMerge) { return !currentTransforms.includes(toMerge); })));
+	        this._transformers = __spreadArray$6(__spreadArray$6([], __read$c(currentTransforms || [])), __read$c(transformersToMerge.filter(function (toMerge) { return !currentTransforms.includes(toMerge); })));
 	        if (this.transformRequest && !this._transformers.includes(this.transformRequest)) {
 	            this._transformers.push(this.transformRequest);
 	        }
@@ -63382,7 +63593,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    return __assign$8.apply(this, arguments);
 	};
-	var __awaiter$2 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+	var __awaiter$3 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
 	    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
 	    return new (P || (P = Promise))(function (resolve, reject) {
 	        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -63391,7 +63602,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        step((generator = generator.apply(thisArg, _arguments || [])).next());
 	    });
 	};
-	var __generator$2 = (window && window.__generator) || function (thisArg, body) {
+	var __generator$3 = (window && window.__generator) || function (thisArg, body) {
 	    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
 	    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
 	    function verb(n) { return function (v) { return step([n, v]); }; }
@@ -63418,7 +63629,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
 	    }
 	};
-	var __read$c = (window && window.__read) || function (o, n) {
+	var __read$d = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -63485,9 +63696,9 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            _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 _b = __read$d(_a, 2), groupName = _b[0], layers = _b[1];
 	                var isInInitialLayerGroup = validInitLayerGroups.includes(groupName);
-	                return __spreadArray$7(__spreadArray$7([], __read$c(deferred)), __read$c(layers.filter(function (layer) {
+	                return __spreadArray$7(__spreadArray$7([], __read$d(deferred)), __read$d(layers.filter(function (layer) {
 	                    var _a;
 	                    // Exclude custom layers
 	                    if (layer.type === 'custom')
@@ -63568,9 +63779,9 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	                    || definitions.configurations[0];
 	            }
 	        };
-	        this._lookUpAsync = function (options) { return __awaiter$2(_this, void 0, void 0, function () {
+	        this._lookUpAsync = function (options) { return __awaiter$3(_this, void 0, void 0, function () {
 	            var definitions, result;
-	            return __generator$2(this, function (_a) {
+	            return __generator$3(this, function (_a) {
 	                switch (_a.label) {
 	                    case 0: return [4 /*yield*/, this.definitions()];
 	                    case 1:
@@ -63756,8 +63967,8 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        return style.theme.toLowerCase();
 	    };
 	    StyleManager.prototype.getThemeAsync = function (styleOptions) {
-	        return __awaiter$2(this, void 0, void 0, function () {
-	            return __generator$2(this, function (_a) {
+	        return __awaiter$3(this, void 0, void 0, function () {
+	            return __generator$3(this, function (_a) {
 	                switch (_a.label) {
 	                    case 0: return [4 /*yield*/, this._lookUpAsync(styleOptions)];
 	                    case 1: return [2 /*return*/, (_a.sent()).theme];
@@ -63847,9 +64058,11 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	                    setLayerVisibility(nextLayer, styleOptions.showBuildingModels ? 'visible' : 'none');
 	                }
 	                // Set visibility of traffic layers depending on traffic settings.
-	                if (trafficOptions.flow !== 'none' &&
-	                    layerGroup === "traffic_" + trafficOptions.flow &&
-	                    nextLayer.type == 'line') {
+	                if (trafficOptions.flow !== 'none' && nextLayer.type == 'line' &&
+	                    (layerGroup === "traffic_" + trafficOptions.flow ||
+	                        // Check if deprecated flow types are used and the layer is a bing-traffic layer.
+	                        // Needed for backwards compatibility in Bing styles to support deprecated flow types.
+	                        (['absolute', 'relative-delay'].includes(trafficOptions.flow) && nextLayer['source'] === "bing-traffic"))) {
 	                    setLayerVisibility(nextLayer, 'visible');
 	                }
 	                // Set visibility of labels
@@ -63878,7 +64091,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        // A FundamentalMapLayer (grouped layer) representation of the next style must be built.
 	        var previousLayers = this.map.layers.getLayers();
 	        var nextLayers = Object.entries(layerGroupLayers).map(function (_a) {
-	            var _b = __read$c(_a, 2), layerGroupName = _b[0], layerGroupMapboxLayers = _b[1];
+	            var _b = __read$d(_a, 2), layerGroupName = _b[0], layerGroupMapboxLayers = _b[1];
 	            return _this._buildFundamentalLayerFrom(layerGroupMapboxLayers, layerGroupName);
 	        });
 	        // Update FundamentalMapLayers in LayerManager
@@ -63977,10 +64190,10 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    StyleManager.prototype._request = function (domain, path, resourceType, customQueryParams) {
 	        var _a, _b;
 	        if (customQueryParams === void 0) { customQueryParams = {}; }
-	        return __awaiter$2(this, void 0, void 0, function () {
+	        return __awaiter$3(this, void 0, void 0, function () {
 	            var requestParams, fetchOptions;
 	            var _c;
-	            return __generator$2(this, function (_d) {
+	            return __generator$3(this, function (_d) {
 	                switch (_d.label) {
 	                    case 0:
 	                        requestParams = {
@@ -64043,6 +64256,123 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	 */
 	var isHMREnabled = function () { return 'ENVIRONMENT' in window && !!window['ENVIRONMENT']['hmr']; };
 
+	var __values$j = (window && window.__values) || function(o) {
+	    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+	    if (m) return m.call(o);
+	    if (o && typeof o.length === "number") return {
+	        next: function () {
+	            if (o && i >= o.length) o = void 0;
+	            return { value: o && o[i++], done: !o };
+	        }
+	    };
+	    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+	};
+	/**
+	 * @internal
+	 * A manager for the map control's hidden indicators.
+	 * Exposed through the `indicators` property of the `atlas.Map` class.
+	 * Cannot be instantiated by the user.
+	 */
+	var AccessibleIndicatorManager = /** @class */ (function () {
+	    /**
+	     * Constructs the indicator manager to be exposed only through the `indicators` property of the `Map` class.
+	     * @param map The map whose indicators are being managed by this.
+	     * @internal
+	     */
+	    function AccessibleIndicatorManager(map) {
+	        this.map = map;
+	        this.indicators = new Set();
+	    }
+	    /**
+	     * Adds an indicator to the map
+	     * @param indicator The indicator(s) to add.
+	     */
+	    AccessibleIndicatorManager.prototype.add = function (indicator) {
+	        var e_1, _a;
+	        indicator = Array.isArray(indicator) ? indicator : [indicator];
+	        try {
+	            for (var indicator_1 = __values$j(indicator), indicator_1_1 = indicator_1.next(); !indicator_1_1.done; indicator_1_1 = indicator_1.next()) {
+	                var i = indicator_1_1.value;
+	                if (!this.indicators.has(i)) {
+	                    this.indicators.add(i);
+	                    i.attach(this.map);
+	                }
+	            }
+	        }
+	        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+	        finally {
+	            try {
+	                if (indicator_1_1 && !indicator_1_1.done && (_a = indicator_1.return)) _a.call(indicator_1);
+	            }
+	            finally { if (e_1) throw e_1.error; }
+	        }
+	    };
+	    /**
+	     * Removes all indicators from the map.
+	     */
+	    AccessibleIndicatorManager.prototype.clear = function () {
+	        var _this = this;
+	        this.indicators.forEach(function (indicator) {
+	            _this.indicators.delete(indicator);
+	            indicator.remove();
+	        });
+	    };
+	    /**
+	     * Removes an indicator from the map
+	     * @param indicator The indicator(s) to remove.
+	     */
+	    AccessibleIndicatorManager.prototype.remove = function (indicator) {
+	        var e_2, _a;
+	        indicator = Array.isArray(indicator) ? indicator : [indicator];
+	        try {
+	            for (var indicator_2 = __values$j(indicator), indicator_2_1 = indicator_2.next(); !indicator_2_1.done; indicator_2_1 = indicator_2.next()) {
+	                var i = indicator_2_1.value;
+	                if (this.indicators.has(i)) {
+	                    this.indicators.delete(i);
+	                    i.remove();
+	                }
+	            }
+	        }
+	        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+	        finally {
+	            try {
+	                if (indicator_2_1 && !indicator_2_1.done && (_a = indicator_2.return)) _a.call(indicator_2);
+	            }
+	            finally { if (e_2) throw e_2.error; }
+	        }
+	    };
+	    /**
+	     * Returns the indicators currently attached to the map.
+	     */
+	    AccessibleIndicatorManager.prototype.getIndicators = function () {
+	        return Array.from(this.indicators);
+	    };
+	    /**
+	     * Returns the div element that should contain all the indicator containers.
+	     * Creates it if it doesn't already exist.
+	     * @internal
+	     */
+	    AccessibleIndicatorManager.prototype._getCollectionDiv = function () {
+	        var collection = this.map.getMapContainer()
+	            .querySelector("." + AccessibleIndicatorManager.Css.collection);
+	        if (!collection) {
+	            // If the collection div doesn't exist create it.
+	            collection = document.createElement("div");
+	            collection.setAttribute("aria-label", "map data");
+	            // Set the container role to listbox, and the descents' role to option, so the reader will read the listbox as a list.
+	            // For example, NVDA will read "data point, 1 of 1" when the indicator is focused.
+	            collection.setAttribute("role", "listbox");
+	            collection.classList.add(AccessibleIndicatorManager.Css.collection);
+	            this.map.getMapContainer().appendChild(collection);
+	        }
+	        return collection;
+	    };
+	    AccessibleIndicatorManager.Css = {
+	        collection: "accessible-indicator-collection-container"
+	    };
+	    return AccessibleIndicatorManager;
+	}());
+
 	var __extends$18 = (window && window.__extends) || (function () {
 	    var extendStatics = function (d, b) {
 	        extendStatics = Object.setPrototypeOf ||
@@ -64069,7 +64399,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    };
 	    return __assign$9.apply(this, arguments);
 	};
-	var __awaiter$3 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+	var __awaiter$4 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
 	    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
 	    return new (P || (P = Promise))(function (resolve, reject) {
 	        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -64078,7 +64408,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        step((generator = generator.apply(thisArg, _arguments || [])).next());
 	    });
 	};
-	var __generator$3 = (window && window.__generator) || function (thisArg, body) {
+	var __generator$4 = (window && window.__generator) || function (thisArg, body) {
 	    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
 	    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
 	    function verb(n) { return function (v) { return step([n, v]); }; }
@@ -64105,7 +64435,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
 	    }
 	};
-	var __read$d = (window && window.__read) || function (o, n) {
+	var __read$e = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -64126,7 +64456,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        to[j] = from[i];
 	    return to;
 	};
-	var __values$j = (window && window.__values) || function(o) {
+	var __values$k = (window && window.__values) || function(o) {
 	    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
 	    if (m) return m.call(o);
 	    if (o && typeof o.length === "number") return {
@@ -64232,6 +64562,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            _this.markers = new HtmlMarkerManager(_this);
 	            _this.sources = new SourceManager(_this);
 	            _this.popups = new PopupManager(_this);
+	            _this.indicators = new AccessibleIndicatorManager(_this);
 	            // Add CSS classes and set attributes for DOM elements.
 	            _this.map.getContainer().classList.add(Map.Css.container);
 	            _this.map.getCanvasContainer().classList.add(Map.Css.canvasContainer);
@@ -64274,7 +64605,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            _this.localizedStringsPromise = Localizer.getStrings(_this.styleOptions.language);
 	            var stylesInit = _this.styles.initStyleset();
 	            Promise.all([authManInit, stylesInit]).then(function (_a) {
-	                var _b = __read$d(_a, 2), _ = _b[0], definitions = _b[1];
+	                var _b = __read$e(_a, 2), _ = _b[0], definitions = _b[1];
 	                // Check that the map hasn't been removed for any reason.
 	                // If so no need to finish styling the map.
 	                if (_this.removed) {
@@ -64373,6 +64704,11 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        else {
 	            this.accessibleMapDelegate.removeFromMap();
 	        }
+	        if (this.styles.serviceOptions.mapConfiguration !== this.serviceOptions.mapConfiguration) {
+	            this.styles.initPromise = null;
+	            this.styles.serviceOptions.mapConfiguration = this.serviceOptions.mapConfiguration;
+	            this.setStyle({});
+	        }
 	    };
 	    /**
 	     * Adds request transformer
@@ -64922,7 +65258,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            urls = layer.getOptions().subdomains || [];
 	        }
 	        // Add the tile urls to the layer, but don't update the map yet.
-	        urls.push.apply(urls, __spreadArray$8([], __read$d(tileSources)));
+	        urls.push.apply(urls, __spreadArray$8([], __read$e(tileSources)));
 	        layer._setOptionsNoUpdate({
 	            subdomains: urls
 	        });
@@ -64944,7 +65280,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    Map.prototype.removeLayers = function (layerNames) {
 	        var e_1, _a;
 	        try {
-	            for (var layerNames_1 = __values$j(layerNames), layerNames_1_1 = layerNames_1.next(); !layerNames_1_1.done; layerNames_1_1 = layerNames_1.next()) {
+	            for (var layerNames_1 = __values$k(layerNames), layerNames_1_1 = layerNames_1.next(); !layerNames_1_1.done; layerNames_1_1 = layerNames_1.next()) {
 	                var layerName = layerNames_1_1.value;
 	                // Previously calling removeLayers for layers that didn't exist in the map just did nothing.
 	                // Now, LayerManager will throw an error, so we need to check if the layer exists before calling remove.
@@ -65086,6 +65422,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        this.layers.clear();
 	        this.sources.clear();
 	        this.markers.clear();
+	        this.indicators.clear();
 	    };
 	    /**
 	     * Clean up the map's resources. Map will not function correctly after calling this method.
@@ -65138,7 +65475,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        var e_2, _a;
 	        var positions = [];
 	        try {
-	            for (var pixels_1 = __values$j(pixels), pixels_1_1 = pixels_1.next(); !pixels_1_1.done; pixels_1_1 = pixels_1.next()) {
+	            for (var pixels_1 = __values$k(pixels), pixels_1_1 = pixels_1.next(); !pixels_1_1.done; pixels_1_1 = pixels_1.next()) {
 	                var pixel = pixels_1_1.value;
 	                var lngLat = this.map.unproject(pixel);
 	                positions.push(new Position(lngLat.lng, lngLat.lat));
@@ -65161,7 +65498,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	        var e_3, _a;
 	        var pixels = [];
 	        try {
-	            for (var positions_1 = __values$j(positions), positions_1_1 = positions_1.next(); !positions_1_1.done; positions_1_1 = positions_1.next()) {
+	            for (var positions_1 = __values$k(positions), positions_1_1 = positions_1.next(); !positions_1_1.done; positions_1_1 = positions_1.next()) {
 	                var position = positions_1_1.value;
 	                var point = this.map.project(position);
 	                pixels.push(new Pixel(point.x, point.y));
@@ -65209,8 +65546,8 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	     */
 	    Map.prototype._rebuildStyle = function (diff) {
 	        if (diff === void 0) { diff = true; }
-	        return __awaiter$3(this, void 0, void 0, function () {
-	            return __generator$3(this, function (_a) {
+	        return __awaiter$4(this, void 0, void 0, function () {
+	            return __generator$4(this, function (_a) {
 	                this.styles.setStyle(this.styleOptions, diff);
 	                this.imageSprite._restoreImages();
 	                return [2 /*return*/];
@@ -65426,7 +65763,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	    return Map;
 	}(EventEmitter));
 
-	var __read$e = (window && window.__read) || function (o, n) {
+	var __read$f = (window && window.__read) || function (o, n) {
 	    var m = typeof Symbol === "function" && o[Symbol.iterator];
 	    if (!m) return o;
 	    var i = m.call(o), r, ar = [], e;
@@ -65588,7 +65925,7 @@ EFFET JURIDIQUE. Le présent contrat décrit certains droits juridiques. Vous po
 	            lineLength = 50;
 	        }
 	        var lines = c.split(/<(tr|div|br|li|h[0-9]|p>)/);
-	        longestStringLength = Math.max.apply(Math, __spreadArray$9([], __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$f((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;