highcharts 9.3.3 → 10.2.0

package/modules/accessibility.src.js

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v9.3.3 (2022-02-01)
+ * @license Highcharts JS v10.2.0 (2022-07-05)
  *
  * Accessibility module
  *
@@ -8,7 +8,6 @@
  *
  * License: www.highcharts.com/license
  */
-'use strict';
 (function (factory) {
     if (typeof module === 'object' && module.exports) {
         factory['default'] = factory;
@@ -23,10 +22,20 @@
         factory(typeof Highcharts !== 'undefined' ? Highcharts : undefined);
     }
 }(function (Highcharts) {
+    'use strict';
     var _modules = Highcharts ? Highcharts._modules : {};
     function _registerModule(obj, path, args, fn) {
         if (!obj.hasOwnProperty(path)) {
             obj[path] = fn.apply(null, args);
+
+            if (typeof CustomEvent === 'function') {
+                window.dispatchEvent(
+                    new CustomEvent(
+                        'HighchartsModuleLoaded',
+                        { detail: { path: path, module: obj[path] }
+                    })
+                );
+            }
         }
     }
     _registerModule(_modules, 'Accessibility/A11yI18n.js', [_modules['Core/FormatUtilities.js'], _modules['Core/Utilities.js']], function (F, U) {
@@ -43,7 +52,8 @@
          *
          * */
         var format = F.format;
-        var pick = U.pick;
+        var getNestedProperty = U.getNestedProperty,
+            pick = U.pick;
         /* *
          *
          *  Composition
@@ -102,7 +112,7 @@
                     var lenArg = Number(eachArguments[1]),
                         len = void 0;
                     result = '';
-                    arr = ctx[eachArguments[0]];
+                    arr = getNestedProperty(eachArguments[0], ctx);
                     if (arr) {
                         lenArg = isNaN(lenArg) ? arr.length : lenArg;
                         len = lenArg < 0 ?
@@ -117,7 +127,7 @@
                 }
                 // Dealing with a plural-function?
                 if (pluralStart > -1) {
-                    var pluralEnd = (statement.slice(pluralStart).indexOf(')') + pluralStart), pluralStatement = statement.substring(pluralStart + 8, pluralEnd), pluralArguments = pluralStatement.split(','), num = Number(ctx[pluralArguments[0]]);
+                    var pluralEnd = (statement.slice(pluralStart).indexOf(')') + pluralStart), pluralStatement = statement.substring(pluralStart + 8, pluralEnd), pluralArguments = pluralStatement.split(','), num = Number(getNestedProperty(pluralArguments[0], ctx));
                     switch (num) {
                         case 0:
                             result = pick(pluralArguments[4], pluralArguments[1]);
@@ -140,7 +150,7 @@
                         ix = Number(statement.substring(indexStart + 1,
                         indexEnd));
                     var val = void 0;
-                    arr = ctx[arrayName];
+                    arr = getNestedProperty(arrayName, ctx);
                     if (!isNaN(ix) && arr) {
                         if (ix < 0) {
                             val = arr[arr.length + ix];
@@ -675,7 +685,7 @@
         function fireEventOnWrappedOrUnwrappedElement(el, eventObject) {
             var type = eventObject.type;
             var hcEvents = el.hcEvents;
-            if (doc.createEvent &&
+            if ((doc.createEvent) &&
                 (el.dispatchEvent || el.fireEvent)) {
                 if (el.dispatchEvent) {
                     el.dispatchEvent(eventObject);
@@ -759,9 +769,11 @@
          */
         function getAxisTimeLengthDesc(axis) {
             var chart = axis.chart,
-                range = {};
+                range = {},
+                min = axis.dataMin || axis.min || 0,
+                max = axis.dataMax || axis.max || 0;
             var rangeUnit = 'Seconds';
-            range.Seconds = ((axis.max || 0) - (axis.min || 0)) / 1000;
+            range.Seconds = (max - min) / 1000;
             range.Minutes = range.Seconds / 60;
             range.Hours = range.Minutes / 60;
             range.Days = range.Hours / 24;
@@ -791,9 +803,15 @@
                     options.accessibility &&
                     options.accessibility.screenReaderSection.axisRangeDateFormat ||
                     ''),
-                format = function (axisKey) {
-                    return axis.dateTime ? chart.time.dateFormat(dateRangeFormat,
-                axis[axisKey]) : axis[axisKey];
+                extremes = {
+                    min: axis.dataMin || axis.min || 0,
+                    max: axis.dataMax || axis.max || 0
+                },
+                format = function (key) {
+                    return axis.dateTime ?
+                        chart.time.dateFormat(dateRangeFormat,
+                extremes[key]) :
+                        extremes[key].toString();
             };
             return chart.langFormat('accessibility.axis.rangeFromTo', {
                 chart: chart,
@@ -1454,20 +1472,19 @@
                 }
             };
             /**
+             * Set attributes on the chart container element.
              * @private
              */
             ContainerComponent.prototype.setRenderToAttrs = function () {
-                var chart = this.chart;
-                if (chart.options.accessibility.landmarkVerbosity !== 'disabled') {
-                    chart.renderTo.setAttribute('role', 'region');
-                }
-                else {
-                    chart.renderTo.removeAttribute('role');
+                var chart = this.chart, shouldHaveLandmark = chart.options.accessibility
+                        .landmarkVerbosity !== 'disabled', containerLabel = chart.langFormat('accessibility.chartContainerLabel', {
+                        title: getChartTitle(chart),
+                        chart: chart
+                    });
+                if (containerLabel) {
+                    chart.renderTo.setAttribute('role', shouldHaveLandmark ? 'region' : 'group');
+                    chart.renderTo.setAttribute('aria-label', containerLabel);
                 }
-                chart.renderTo.setAttribute('aria-label', chart.langFormat('accessibility.chartContainerLabel', {
-                    title: getChartTitle(chart),
-                    chart: chart
-                }));
             };
             /**
              * @private
@@ -1672,15 +1689,21 @@
                 }
                 // Add the border rect
                 var bb = this.getBBox(),
-                    pad = pick(margin, 3);
+                    pad = pick(margin, 3),
+                    parent = this.parentGroup,
+                    scaleX = this.scaleX || parent && parent.scaleX,
+                    scaleY = this.scaleY || parent && parent.scaleY,
+                    oneDefined = scaleX ? !scaleY : scaleY,
+                    scaleBoth = oneDefined ? Math.abs(scaleX || scaleY || 1) :
+                        (Math.abs(scaleX || 1) + Math.abs(scaleY || 1)) / 2;
                 bb.x += this.translateX ? this.translateX : 0;
                 bb.y += this.translateY ? this.translateY : 0;
                 var borderPosX = bb.x - pad,
                     borderPosY = bb.y - pad,
                     borderWidth = bb.width + 2 * pad,
                     borderHeight = bb.height + 2 * pad;
-                // For text elements, apply x and y offset, #11397.
                 /**
+                 * For text elements, apply x and y offset, #11397.
                  * @private
                  */
                 function getTextAnchorCorrection(text) {
@@ -1728,16 +1751,16 @@
                         }
                     }
                 }
-                this.focusBorder = this.renderer.rect(borderPosX, borderPosY, borderWidth, borderHeight, parseInt((attribs && attribs.r || 0).toString(), 10))
+                this.focusBorder = this.renderer.rect(borderPosX, borderPosY, borderWidth, borderHeight, parseInt((attribs && attribs.r || 0).toString(), 10) / scaleBoth)
                     .addClass('highcharts-focus-border')
                     .attr({
                     zIndex: 99
                 })
-                    .add(this.parentGroup);
+                    .add(parent);
                 if (!this.renderer.styledMode) {
                     this.focusBorder.attr({
                         stroke: attribs && attribs.stroke,
-                        'stroke-width': attribs && attribs.strokeWidth
+                        'stroke-width': (attribs && attribs.strokeWidth || 0) / scaleBoth
                     });
                 }
                 avgElementAddUpdateFocusBorderHooks(this, margin, attribs);
@@ -2032,7 +2055,7 @@
             var labels = getChartAnnotationLabels(chart);
             return labels.map(function (label) {
                 var desc = escapeStringForHTML(stripHTMLTagsFromString(getAnnotationLabelDescription(label)));
-                return desc ? "<li>" + desc + "</li>" : '';
+                return desc ? "<li>".concat(desc, "</li>") : '';
             });
         }
         /**
@@ -2048,7 +2071,7 @@
                 return '';
             }
             var annotationItems = getAnnotationListItems(chart);
-            return "<ul style=\"list-style-type: none\">" + annotationItems.join(' ') + "</ul>";
+            return "<ul style=\"list-style-type: none\">".concat(annotationItems.join(' '), "</ul>");
         }
         /**
          * Return the texts for the annotation(s) connected to a point, or empty array
@@ -2065,7 +2088,7 @@
             if (!pointLabels.length) {
                 return [];
             }
-            return pointLabels.map(function (label) { return "" + getLabelText(label); });
+            return pointLabels.map(function (label) { return "".concat(getLabelText(label)); });
         }
         /* *
          *
@@ -2176,11 +2199,13 @@
         function getTypeDescription(chart, types) {
             var firstType = types[0],
                 firstSeries = chart.series && chart.series[0] || {},
+                mapTitle = chart.mapView && chart.mapView.geoMap &&
+                    chart.mapView.geoMap.title,
                 formatContext = {
                     numSeries: chart.series.length,
                     numPoints: firstSeries.points && firstSeries.points.length,
                     chart: chart,
-                    mapTitle: firstSeries.mapTitle
+                    mapTitle: mapTitle
                 };
             if (!firstType) {
                 return getTypeDescForEmptyChart(chart, formatContext);
@@ -2370,27 +2395,28 @@
                     if (sectionDiv.parentNode) {
                         sectionDiv.parentNode.removeChild(sectionDiv);
                     }
-                    delete region.element;
+                    region.element = null;
                 }
             };
             /**
+             * Apply a11y attributes to a screen reader info section
              * @private
              * @param {Highcharts.HTMLDOMElement} sectionDiv The section element
              * @param {string} regionKey Name/key of the region we are setting attrs for
              */
             InfoRegionsComponent.prototype.setScreenReaderSectionAttribs = function (sectionDiv, regionKey) {
-                var labelLangKey = ('accessibility.screenReaderSection.' + regionKey + 'RegionLabel'), chart = this.chart, labelText = chart.langFormat(labelLangKey, { chart: chart, chartTitle: getChartTitle(chart) }), sectionId = 'highcharts-screen-reader-region-' + regionKey + '-' +
-                        chart.index;
+                var chart = this.chart, labelText = chart.langFormat('accessibility.screenReaderSection.' + regionKey +
+                        'RegionLabel', { chart: chart, chartTitle: getChartTitle(chart) }), sectionId = "highcharts-screen-reader-region-".concat(regionKey, "-").concat(chart.index);
                 attr(sectionDiv, {
                     id: sectionId,
-                    'aria-label': labelText
+                    'aria-label': labelText || void 0
                 });
                 // Sections are wrapped to be positioned relatively to chart in case
                 // elements inside are tabbed to.
                 sectionDiv.style.position = 'relative';
-                if (chart.options.accessibility.landmarkVerbosity === 'all' &&
-                    labelText) {
-                    sectionDiv.setAttribute('role', 'region');
+                if (labelText) {
+                    sectionDiv.setAttribute('role', chart.options.accessibility.landmarkVerbosity === 'all' ?
+                        'region' : 'group');
                 }
             };
             /**
@@ -2611,7 +2637,10 @@
                     return axes.length > 1 || axes[0] &&
                         pick(axes[0].options.accessibility &&
                             axes[0].options.accessibility.enabled, defaultCondition);
-                }, hasNoMap = !!chart.types && chart.types.indexOf('map') < 0, hasCartesian = !!chart.hasCartesianSeries, showXAxes = shouldDescribeColl('xAxis', !chart.angular && hasCartesian && hasNoMap), showYAxes = shouldDescribeColl('yAxis', hasCartesian && hasNoMap), desc = {};
+                }, hasNoMap = !!chart.types &&
+                    chart.types.indexOf('map') < 0 &&
+                    chart.types.indexOf('treemap') < 0 &&
+                    chart.types.indexOf('tilemap') < 0, hasCartesian = !!chart.hasCartesianSeries, showXAxes = shouldDescribeColl('xAxis', !chart.angular && hasCartesian && hasNoMap), showYAxes = shouldDescribeColl('yAxis', hasCartesian && hasNoMap), desc = {};
                 if (showXAxes) {
                     desc.xAxis = this.getAxisDescriptionText('xAxis');
                 }
@@ -2758,7 +2787,6 @@
                 if (menu) {
                     menu.setAttribute('aria-hidden', 'true');
                 }
-                this.isExportMenuShown = false;
                 this.setExportButtonExpandedState('false');
             };
             /**
@@ -2771,7 +2799,6 @@
                     this.addAccessibleContextMenuAttribs();
                     unhideChartElementFromAT(chart, menu);
                 }
-                this.isExportMenuShown = true;
                 this.setExportButtonExpandedState('true');
             };
             /**
@@ -2817,7 +2844,8 @@
                             chart: chart,
                             chartTitle: getChartTitle(chart)
                         }),
-                        'aria-expanded': false
+                        'aria-expanded': false,
+                        title: chart.options.lang.contextButtonTitle || null
                     });
                 }
             };
@@ -2971,7 +2999,7 @@
                 var chart = this.chart;
                 var curHighlightedItem = chart.exportDivElements[chart.highlightedExportItemIx];
                 var exportButtonElement = getExportMenuButtonElement(chart).element;
-                if (this.isExportMenuShown) {
+                if (chart.openMenu) {
                     this.fakeClickEvent(curHighlightedItem);
                 }
                 else {
@@ -3041,7 +3069,7 @@
             function chartHideExportMenu() {
                 var chart = this,
                     exportList = chart.exportDivElements;
-                if (exportList && chart.exportContextMenu) {
+                if (exportList && chart.exportContextMenu && chart.openMenu) {
                     // Reset hover states etc.
                     exportList.forEach(function (el) {
                         if (el &&
@@ -3239,6 +3267,65 @@
                     this.removeExitAnchor();
                 }
             };
+            /**
+             * We use an exit anchor to move focus out of chart whenever we want, by
+             * setting focus to this div and not preventing the default tab action. We
+             * also use this when users come back into the chart by tabbing back, in
+             * order to navigate from the end of the chart.
+             * @private
+             */
+            KeyboardNavigation.prototype.updateExitAnchor = function () {
+                var endMarkerId = "highcharts-end-of-chart-marker-".concat(this.chart.index),
+                    endMarker = getElement(endMarkerId);
+                this.removeExitAnchor();
+                if (endMarker) {
+                    this.makeElementAnExitAnchor(endMarker);
+                    this.exitAnchor = endMarker;
+                }
+                else {
+                    this.createExitAnchor();
+                }
+            };
+            /**
+             * Move to prev/next module.
+             * @private
+             * @param {number} direction
+             * Direction to move. +1 for next, -1 for prev.
+             * @return {boolean}
+             * True if there was a valid module in direction.
+             */
+            KeyboardNavigation.prototype.move = function (direction) {
+                var curModule = this.modules && this.modules[this.currentModuleIx];
+                if (curModule && curModule.terminate) {
+                    curModule.terminate(direction);
+                }
+                // Remove existing focus border if any
+                if (this.chart.focusElement) {
+                    this.chart.focusElement.removeFocusBorder();
+                }
+                this.currentModuleIx += direction;
+                var newModule = this.modules && this.modules[this.currentModuleIx];
+                if (newModule) {
+                    if (newModule.validate && !newModule.validate()) {
+                        return this.move(direction); // Invalid module, recurse
+                    }
+                    if (newModule.init) {
+                        newModule.init(direction); // Valid module, init it
+                        return true;
+                    }
+                }
+                // No module
+                this.currentModuleIx = 0; // Reset counter
+                // Set focus to chart or exit anchor depending on direction
+                this.exiting = true;
+                if (direction > 0) {
+                    this.exitAnchor && this.exitAnchor.focus();
+                }
+                else {
+                    this.tabindexContainer.focus();
+                }
+                return false;
+            };
             /**
              * Function to run on container focus
              * @private
@@ -3252,30 +3339,37 @@
                 if (!this.exiting &&
                     !this.tabbingInBackwards &&
                     !this.isClickingChart &&
-                    !focusComesFromChart &&
-                    this.modules[0]) {
-                    this.modules[0].init(1);
+                    !focusComesFromChart) {
+                    var ix = this.getFirstValidModuleIx();
+                    if (ix !== null) {
+                        this.currentModuleIx = ix;
+                        this.modules[ix].init(1);
+                    }
                 }
                 this.exiting = false;
             };
             /**
-             * Reset chart navigation state if we click outside the chart and it's
-             * not already reset.
+             * Reset chart navigation state if we mouse click and it's not already
+             * reset. Reset fully if outside the chart, otherwise just hide focus
+             * indicator.
              * @private
              */
             KeyboardNavigation.prototype.onMouseUp = function () {
                 delete this.isClickingChart;
-                if (!this.keyboardReset && !this.pointerIsOverChart) {
-                    var chart = this.chart,
-                        curMod = this.modules &&
-                            this.modules[this.currentModuleIx || 0];
-                    if (curMod && curMod.terminate) {
-                        curMod.terminate();
+                if (!this.keyboardReset) {
+                    var chart = this.chart;
+                    if (!this.pointerIsOverChart) {
+                        var curMod = this.modules &&
+                                this.modules[this.currentModuleIx || 0];
+                        if (curMod && curMod.terminate) {
+                            curMod.terminate();
+                        }
+                        this.currentModuleIx = 0;
                     }
                     if (chart.focusElement) {
                         chart.focusElement.removeFocusBorder();
+                        delete chart.focusElement;
                     }
-                    this.currentModuleIx = 0;
                     this.keyboardReset = true;
                 }
             };
@@ -3302,10 +3396,10 @@
                         preventDefault = true;
                     }
                     else if (response === curNavModule.response.prev) {
-                        preventDefault = this.prev();
+                        preventDefault = this.move(-1);
                     }
                     else if (response === curNavModule.response.next) {
-                        preventDefault = this.next();
+                        preventDefault = this.move(1);
                     }
                     if (preventDefault) {
                         e.preventDefault();
@@ -3313,79 +3407,6 @@
                     }
                 }
             };
-            /**
-             * Go to previous module.
-             * @private
-             */
-            KeyboardNavigation.prototype.prev = function () {
-                return this.move(-1);
-            };
-            /**
-             * Go to next module.
-             * @private
-             */
-            KeyboardNavigation.prototype.next = function () {
-                return this.move(1);
-            };
-            /**
-             * Move to prev/next module.
-             * @private
-             * @param {number} direction
-             * Direction to move. +1 for next, -1 for prev.
-             * @return {boolean}
-             * True if there was a valid module in direction.
-             */
-            KeyboardNavigation.prototype.move = function (direction) {
-                var curModule = this.modules && this.modules[this.currentModuleIx];
-                if (curModule && curModule.terminate) {
-                    curModule.terminate(direction);
-                }
-                // Remove existing focus border if any
-                if (this.chart.focusElement) {
-                    this.chart.focusElement.removeFocusBorder();
-                }
-                this.currentModuleIx += direction;
-                var newModule = this.modules && this.modules[this.currentModuleIx];
-                if (newModule) {
-                    if (newModule.validate && !newModule.validate()) {
-                        return this.move(direction); // Invalid module, recurse
-                    }
-                    if (newModule.init) {
-                        newModule.init(direction); // Valid module, init it
-                        return true;
-                    }
-                }
-                // No module
-                this.currentModuleIx = 0; // Reset counter
-                // Set focus to chart or exit anchor depending on direction
-                this.exiting = true;
-                if (direction > 0) {
-                    this.exitAnchor.focus();
-                }
-                else {
-                    this.tabindexContainer.focus();
-                }
-                return false;
-            };
-            /**
-             * We use an exit anchor to move focus out of chart whenever we want, by
-             * setting focus to this div and not preventing the default tab action. We
-             * also use this when users come back into the chart by tabbing back, in
-             * order to navigate from the end of the chart.
-             * @private
-             */
-            KeyboardNavigation.prototype.updateExitAnchor = function () {
-                var endMarkerId = ('highcharts-end-of-chart-marker-' + this.chart.index),
-                    endMarker = getElement(endMarkerId);
-                this.removeExitAnchor();
-                if (endMarker) {
-                    this.makeElementAnExitAnchor(endMarker);
-                    this.exitAnchor = endMarker;
-                }
-                else {
-                    this.createExitAnchor();
-                }
-            };
             /**
              * Chart container should have tabindex if navigation is enabled.
              * @private
@@ -3414,6 +3435,18 @@
                 }
             };
             /**
+             * Add new exit anchor to the chart.
+             * @private
+             */
+            KeyboardNavigation.prototype.createExitAnchor = function () {
+                var chart = this.chart,
+                    exitAnchor = this.exitAnchor = doc.createElement('div');
+                chart.renderTo.appendChild(exitAnchor);
+                this.makeElementAnExitAnchor(exitAnchor);
+            };
+            /**
+             * Add attributes and events to an element to make it function as an
+             * exit anchor.
              * @private
              */
             KeyboardNavigation.prototype.makeElementAnExitAnchor = function (el) {
@@ -3425,27 +3458,17 @@
                 this.addExitAnchorEventsToEl(el);
             };
             /**
-             * Add new exit anchor to the chart.
-             *
-             * @private
-             */
-            KeyboardNavigation.prototype.createExitAnchor = function () {
-                var chart = this.chart,
-                    exitAnchor = this.exitAnchor = doc.createElement('div');
-                chart.renderTo.appendChild(exitAnchor);
-                this.makeElementAnExitAnchor(exitAnchor);
-            };
-            /**
+             * Destroy the exit anchor and remove from DOM.
              * @private
              */
             KeyboardNavigation.prototype.removeExitAnchor = function () {
                 if (this.exitAnchor && this.exitAnchor.parentNode) {
-                    this.exitAnchor.parentNode
-                        .removeChild(this.exitAnchor);
+                    this.exitAnchor.parentNode.removeChild(this.exitAnchor);
                     delete this.exitAnchor;
                 }
             };
             /**
+             * Add focus handler to exit anchor element.
              * @private
              */
             KeyboardNavigation.prototype.addExitAnchorEventsToEl = function (element) {
@@ -3456,6 +3479,9 @@
                         focusComesFromChart = (e.relatedTarget &&
                             chart.container.contains(e.relatedTarget)),
                         comingInBackwards = !(focusComesFromChart || keyboardNavigation.exiting);
+                    if (chart.focusElement) {
+                        delete chart.focusElement;
+                    }
                     if (comingInBackwards) {
                         // Focus the container instead
                         keyboardNavigation.tabbingInBackwards = true;
@@ -3473,7 +3499,7 @@
                             if (curModule &&
                                 curModule.validate && !curModule.validate()) {
                                 // Invalid. Try moving backwards to find next valid.
-                                keyboardNavigation.prev();
+                                keyboardNavigation.move(-1);
                             }
                             else if (curModule) {
                                 // We have a valid module, init it
@@ -3487,6 +3513,21 @@
                     }
                 });
             };
+            /**
+             * Get the ix of the first module that either does not require validation or
+             * validates positively.
+             * @private
+             */
+            KeyboardNavigation.prototype.getFirstValidModuleIx = function () {
+                var len = this.modules.length;
+                for (var i = 0; i < len; ++i) {
+                    var mod = this.modules[i];
+                    if (!mod.validate || mod.validate()) {
+                        return i;
+                    }
+                }
+                return null;
+            };
             /**
              * Remove all traces of keyboard navigation.
              * @private
@@ -3522,6 +3563,7 @@
              * */
             /* eslint-disable valid-jsdoc */
             /**
+             * Composition function.
              * @private
              */
             function compose(ChartClass) {
@@ -3605,6 +3647,7 @@
             };
         })();
         var animObject = A.animObject;
+        var doc = H.doc;
         var addEvent = U.addEvent,
             fireEvent = U.fireEvent,
             isNumber = U.isNumber,
@@ -3619,7 +3662,6 @@
          *  Functions
          *
          * */
-        /* eslint-disable valid-jsdoc */
         /**
          * @private
          */
@@ -3640,6 +3682,19 @@
                 !(chart.colorAxis && chart.colorAxis.length) &&
                 legendA11yOptions.enabled !== false);
         }
+        /**
+         * @private
+         */
+        function setLegendItemHoverState(hoverActive, legendItem) {
+            legendItem.setState(hoverActive ? 'hover' : '', true);
+            ['legendGroup', 'legendItem', 'legendSymbol'].forEach(function (i) {
+                var obj = legendItem[i];
+                var el = obj && obj.element || obj;
+                if (el) {
+                    fireEvent(el, hoverActive ? 'mouseover' : 'mouseout');
+                }
+            });
+        }
         /* *
          *
          *  Class
@@ -3663,6 +3718,7 @@
                 var _this = _super !== null && _super.apply(this,
                     arguments) || this;
                 _this.highlightedLegendItemIx = NaN;
+                _this.proxyGroup = null;
                 return _this;
             }
             /* *
@@ -3670,7 +3726,6 @@
              *  Functions
              *
              * */
-            /* eslint-disable valid-jsdoc */
             /**
              * Init the component
              * @private
@@ -3788,12 +3843,19 @@
              * @private
              */
             LegendComponent.prototype.recreateProxies = function () {
+                var focusedElement = doc.activeElement;
+                var proxyGroup = this.proxyGroup;
+                var shouldRestoreFocus = focusedElement && proxyGroup &&
+                        proxyGroup.contains(focusedElement);
                 this.removeProxies();
                 if (shouldDoLegendA11y(this.chart)) {
                     this.addLegendProxyGroup();
                     this.proxyLegendItems();
                     this.updateLegendItemProxyVisibility();
                     this.updateLegendTitle();
+                    if (shouldRestoreFocus) {
+                        this.chart.highlightLegendItem(this.highlightedLegendItemIx);
+                    }
                     return true;
                 }
                 return false;
@@ -3829,7 +3891,7 @@
                 var a11yOptions = this.chart.options.accessibility;
                 var groupRole = a11yOptions.landmarkVerbosity === 'all' ?
                         'region' : null;
-                this.proxyProvider.addGroup('legend', 'ul', {
+                this.proxyGroup = this.proxyProvider.addGroup('legend', 'ul', {
                     // Filled by updateLegendTitle, to keep up to date without
                     // recreating group
                     'aria-label': '_placeholder_',
@@ -3913,21 +3975,19 @@
                     validate: function () {
                         return component.shouldHaveLegendNavigation();
                     },
-                    init: function (direction) {
-                        return component.onKbdNavigationInit(direction);
+                    init: function () {
+                        chart.highlightLegendItem(0);
+                        component.highlightedLegendItemIx = 0;
                     },
                     terminate: function () {
                         component.highlightedLegendItemIx = -1;
-                        chart.legend.allItems.forEach(function (item) { return item.setState('', true); });
+                        chart.legend.allItems.forEach(function (item) { return setLegendItemHoverState(false, item); });
                     }
                 });
             };
             /**
+             * Arrow key navigation
              * @private
-             * @param {Highcharts.KeyboardNavigationHandler} keyboardNavigationHandler
-             * @param {number} keyCode
-             * @return {number}
-             * Response code
              */
             LegendComponent.prototype.onKbdArrowKey = function (keyboardNavigationHandler, keyCode) {
                 var keys = this.keyCodes,
@@ -3946,8 +4006,7 @@
                     keyboardNavigationHandler.init(direction);
                     return response.success;
                 }
-                // No wrap, move
-                return response[direction > 0 ? 'next' : 'prev'];
+                return response.success;
             };
             /**
              * @private
@@ -3977,17 +4036,6 @@
                     legendA11yOptions.keyboardNavigation &&
                     legendA11yOptions.keyboardNavigation.enabled);
             };
-            /**
-             * @private
-             * @param {number} direction
-             */
-            LegendComponent.prototype.onKbdNavigationInit = function (direction) {
-                var chart = this.chart,
-                    lastIx = chart.legend.allItems.length - 1,
-                    ixToHighlight = direction > 0 ? 0 : lastIx;
-                chart.highlightLegendItem(ixToHighlight);
-                this.highlightedLegendItemIx = ixToHighlight;
-            };
             return LegendComponent;
         }(AccessibilityComponent));
         /* *
@@ -4024,7 +4072,7 @@
                 var itemToHighlight = items[ix];
                 if (itemToHighlight) {
                     if (isNumber(oldIx) && items[oldIx]) {
-                        fireEvent(items[oldIx].legendGroup.element, 'mouseout');
+                        setLegendItemHoverState(false, items[oldIx]);
                     }
                     scrollLegendToItem(this.legend, ix);
                     var legendItemProp = itemToHighlight.legendItem;
@@ -4033,9 +4081,7 @@
                     if (legendItemProp && legendItemProp.element && proxyBtn) {
                         this.setFocusToElement(legendItemProp, proxyBtn);
                     }
-                    if (itemToHighlight.legendGroup) {
-                        fireEvent(itemToHighlight.legendGroup.element, 'mouseover');
-                    }
+                    setLegendItemHoverState(true, itemToHighlight);
                     return true;
                 }
                 return false;
@@ -4124,14 +4170,21 @@
             }) || null;
         }
         /**
+         * Whether or not we should add a dummy point element in
+         * order to describe a point that has no graphic.
          * @private
          */
         function shouldAddDummyPoint(point) {
             // Note: Sunburst series use isNull for hidden points on drilldown.
             // Ignore these.
-            var isSunburst = point.series && point.series.is('sunburst'),
-                isNull = point.isNull;
-            return isNull && !isSunburst;
+            var series = point.series,
+                chart = series && series.chart,
+                isSunburst = series && series.is('sunburst'),
+                isNull = point.isNull,
+                shouldDescribeNull = chart &&
+                    chart
+                        .options.accessibility.point.describeNull;
+            return isNull && !isSunburst && shouldDescribeNull;
         }
         /**
          * @private
@@ -4379,9 +4432,9 @@
          * @private
          */
         function defaultPointDescriptionFormatter(point) {
-            var series = point.series, chart = series.chart, valText = getPointValueDescription(point), description = point.options && point.options.accessibility &&
-                    point.options.accessibility.description, userDescText = description ? ' ' + description : '', seriesNameText = chart.series.length > 1 && series.name ?
-                    ' ' + series.name + '.' : '', annotationsDesc = getPointAnnotationDescription(point), pointAnnotationsText = annotationsDesc ? ' ' + annotationsDesc : '';
+            var series = point.series, shouldExposeSeriesName = series.chart.series.length > 1 ||
+                    series.options.name, valText = getPointValueDescription(point), description = point.options && point.options.accessibility &&
+                    point.options.accessibility.description, userDescText = description ? ' ' + description : '', seriesNameText = shouldExposeSeriesName ? ' ' + series.name + '.' : '', annotationsDesc = getPointAnnotationDescription(point), pointAnnotationsText = annotationsDesc ? ' ' + annotationsDesc : '';
             point.accessibility = point.accessibility || {};
             point.accessibility.valueDescription = valText;
             return valText + userDescText + seriesNameText + pointAnnotationsText;
@@ -4412,15 +4465,21 @@
          */
         function describePointsInSeries(series) {
             var setScreenReaderProps = shouldSetScreenReaderPropsOnPoints(series),
-                setKeyboardProps = shouldSetKeyboardNavPropsOnPoints(series);
+                setKeyboardProps = shouldSetKeyboardNavPropsOnPoints(series),
+                shouldDescribeNullPoints = series.chart.options.accessibility
+                    .point.describeNull;
             if (setScreenReaderProps || setKeyboardProps) {
                 series.points.forEach(function (point) {
                     var pointEl = point.graphic && point.graphic.element ||
-                            shouldAddDummyPoint(point) && addDummyPointElement(point);
-                    var pointA11yDisabled = (point.options &&
+                            shouldAddDummyPoint(point) && addDummyPointElement(point),
+                        pointA11yDisabled = (point.options &&
                             point.options.accessibility &&
                             point.options.accessibility.enabled === false);
                     if (pointEl) {
+                        if (point.isNull && !shouldDescribeNullPoints) {
+                            pointEl.setAttribute('aria-hidden', true);
+                            return;
+                        }
                         // We always set tabindex, as long as we are setting props.
                         // When setting tabindex, also remove default outline to
                         // avoid ugly border on click.
@@ -4448,14 +4507,19 @@
                 description = getSeriesDescriptionText(series),
                 shouldDescribeAxis = function (coll) {
                     return chart[coll] && chart[coll].length > 1 && series[coll];
-            }, xAxisInfo = getSeriesAxisDescriptionText(series, 'xAxis'), yAxisInfo = getSeriesAxisDescriptionText(series, 'yAxis'), summaryContext = {
-                name: series.name || '',
-                ix: series.index + 1,
-                numSeries: chart.series && chart.series.length,
-                numPoints: series.points && series.points.length,
-                series: series
-            }, combinationSuffix = chartTypes.length > 1 ? 'Combination' : '', summary = chart.langFormat('accessibility.series.summary.' + series.type + combinationSuffix, summaryContext) || chart.langFormat('accessibility.series.summary.default' + combinationSuffix, summaryContext);
-            return summary + (description ? ' ' + description : '') + (shouldDescribeAxis('yAxis') ? ' ' + yAxisInfo : '') + (shouldDescribeAxis('xAxis') ? ' ' + xAxisInfo : '');
+            }, seriesNumber = series.index + 1, xAxisInfo = getSeriesAxisDescriptionText(series, 'xAxis'), yAxisInfo = getSeriesAxisDescriptionText(series, 'yAxis'), summaryContext = {
+                seriesNumber: seriesNumber,
+                series: series,
+                chart: chart
+            }, combinationSuffix = chartTypes.length > 1 ? 'Combination' : '', summary = chart.langFormat('accessibility.series.summary.' + series.type + combinationSuffix, summaryContext) || chart.langFormat('accessibility.series.summary.default' + combinationSuffix, summaryContext), axisDescription = (shouldDescribeAxis('yAxis') ? ' ' + yAxisInfo + '.' : '') + (shouldDescribeAxis('xAxis') ? ' ' + xAxisInfo + '.' : ''), formatStr = chart.options.accessibility.series.descriptionFormat || '';
+            return format(formatStr, {
+                seriesDescription: summary,
+                authorDescription: (description ? ' ' + description : ''),
+                axisDescription: axisDescription,
+                series: series,
+                chart: chart,
+                seriesNumber: seriesNumber
+            }, void 0);
         }
         /**
          * Set a11y props on a series element
@@ -4473,7 +4537,10 @@
             }
             else if (landmarkVerbosity === 'all') {
                 seriesElement.setAttribute('role', 'region');
-            } /* else do not add role */
+            }
+            else {
+                seriesElement.setAttribute('role', 'group');
+            }
             seriesElement.setAttribute('tabindex', '-1');
             if (!series.chart.styledMode) {
                 // Don't show browser outline on click, despite tabindex
@@ -4506,7 +4573,7 @@
                     describeSeriesElement(series, seriesEl);
                 }
                 else {
-                    seriesEl.setAttribute('aria-label', '');
+                    seriesEl.removeAttribute('aria-label');
                 }
             }
         }
@@ -4641,7 +4708,7 @@
                 var announcer = this,
                     chart = this.chart,
                     e = this.eventProvider;
-                e.addEvent(chart, 'afterDrilldown', function () {
+                e.addEvent(chart, 'afterApplyDrilldown', function () {
                     announcer.lastAnnouncementTime = 0;
                 });
                 e.addEvent(chart, 'afterAddSeries', function (e) {
@@ -4951,9 +5018,15 @@
             ProxyElement.prototype.updateTarget = function (target, attributes) {
                 this.target = target;
                 this.updateCSSClassName();
+                var attrs = attributes || {};
+                Object.keys(attrs).forEach(function (a) {
+                    if (attrs[a] === null) {
+                        delete attrs[a];
+                    }
+                });
                 attr(this.buttonElement, merge({
                     'aria-label': this.getTargetAttr(target.click, 'aria-label')
-                }, attributes));
+                }, attrs));
                 this.eventProvider.removeAddedEvents();
                 this.addProxyEventsToButton(this.buttonElement, target.click);
                 this.refreshPosition();
@@ -5051,12 +5124,14 @@
                 var chartDiv = this.chart.renderTo;
                 if (chartDiv && posElement && posElement.getBoundingClientRect) {
                     var rectEl = posElement.getBoundingClientRect(),
-                        rectDiv = chartDiv.getBoundingClientRect();
+                        chartPos = this.chart.pointer.getChartPosition();
                     return {
-                        x: rectEl.left - rectDiv.left,
-                        y: rectEl.top - rectDiv.top,
-                        width: rectEl.right - rectEl.left,
-                        height: rectEl.bottom - rectEl.top
+                        x: (rectEl.left - chartPos.left) / chartPos.scaleX,
+                        y: (rectEl.top - chartPos.top) / chartPos.scaleY,
+                        width: rectEl.right / chartPos.scaleX -
+                            rectEl.left / chartPos.scaleX,
+                        height: rectEl.bottom / chartPos.scaleY -
+                            rectEl.top / chartPos.scaleY
                     };
                 }
                 return { x: 0, y: 0, width: 1, height: 1 };
@@ -5153,10 +5228,13 @@
             /**
              * Create a group that will contain proxy elements. The group order is
              * automatically updated according to the last group order keys.
+             *
+             * Returns the added group.
              */
             ProxyProvider.prototype.addGroup = function (groupKey, groupType, attributes) {
-                if (this.groups[groupKey]) {
-                    return;
+                var existingGroup = this.groups[groupKey];
+                if (existingGroup) {
+                    return existingGroup.groupElement;
                 }
                 var proxyContainer = this.domElementProvider.createElement(groupType);
                 // If we want to add a role to the group, and still use e.g.
@@ -5185,6 +5263,7 @@
                 // won't have to reorder the whole set of groups.
                 this.afterChartProxyPosContainer.appendChild(groupElement);
                 this.updateGroupOrder(this.groupOrder);
+                return groupElement;
             };
             /**
              * Update HTML attributes of a group.
@@ -5368,6 +5447,10 @@
              */
             ProxyProvider.prototype.updatePosContainerPositions = function () {
                 var chart = this.chart;
+                // If exporting, don't add these containers to the DOM.
+                if (chart.renderer.forExport) {
+                    return;
+                }
                 var rendererSVGEl = chart.renderer.box;
                 chart.container.insertBefore(this.afterChartProxyPosContainer, rendererSVGEl.nextSibling);
                 chart.container.insertBefore(this.beforeChartProxyPosContainer, rendererSVGEl);
@@ -5874,7 +5957,7 @@
                  */
                 inputStyle: {
                     /** @ignore */
-                    color: "#335cad" /* highlightColor80 */,
+                    color: "#335cad" /* Palette.highlightColor80 */,
                     /** @ignore */
                     cursor: 'pointer'
                 },
@@ -5891,7 +5974,7 @@
                  */
                 labelStyle: {
                     /** @ignore */
-                    color: "#666666" /* neutralColor60 */
+                    color: "#666666" /* Palette.neutralColor60 */
                 }
             }
         });
@@ -5995,7 +6078,8 @@
                     rangeSetting,
                     ctx,
                     ytdExtremes,
-                    dataGrouping = rangeOptions.dataGrouping;
+                    dataGrouping = rangeOptions.dataGrouping,
+                    addOffsetMin = true;
                 // chart has no data, base series is removed
                 if (dataMin === null || dataMax === null) {
                     return;
@@ -6028,12 +6112,16 @@
                         if (isNumber(ctx.newMax)) {
                             newMax = ctx.newMax;
                         }
+                        // #15799: offsetMin is added in minFromRange so that it works
+                        // with pre-selected buttons as well
+                        addOffsetMin = false;
                     }
                     // Fixed times like minutes, hours, days
                 }
                 else if (range) {
                     newMin = Math.max(newMax - range, dataMin);
                     newMax = Math.min(newMin + range, dataMax);
+                    addOffsetMin = false;
                 }
                 else if (type === 'ytd') {
                     // On user clicks on the buttons, or a delayed action running from
@@ -6044,14 +6132,17 @@
                         // event (below). When the series are initialized, but before
                         // the chart is rendered, we have access to the xData array
                         // (#942).
-                        if (typeof dataMax === 'undefined') {
+                        if (typeof dataMax === 'undefined' ||
+                            typeof dataMin === 'undefined') {
                             dataMin = Number.MAX_VALUE;
                             dataMax = Number.MIN_VALUE;
                             chart.series.forEach(function (series) {
                                 // reassign it to the last item
                                 var xData = series.xData;
-                                dataMin = Math.min(xData[0], dataMin);
-                                dataMax = Math.max(xData[xData.length - 1], dataMax);
+                                if (xData) {
+                                    dataMin = Math.min(xData[0], dataMin);
+                                    dataMax = Math.max(xData[xData.length - 1], dataMax);
+                                }
                             });
                             redraw = false;
                         }
@@ -6071,16 +6162,15 @@
                     // If the navigator exist and the axis range is declared reset that
                     // range and from now on only use the range set by a user, #14742.
                     if (chart.navigator && chart.navigator.baseSeries[0]) {
-                        chart.navigator.baseSeries[0].xAxis.options
-                            .range = void 0;
+                        chart.navigator.baseSeries[0].xAxis.options.range = void 0;
                     }
                     newMin = dataMin;
                     newMax = dataMax;
                 }
-                if (defined(newMin)) {
+                if (addOffsetMin && rangeOptions._offsetMin && defined(newMin)) {
                     newMin += rangeOptions._offsetMin;
                 }
-                if (defined(newMax)) {
+                if (rangeOptions._offsetMax && defined(newMax)) {
                     newMax += rangeOptions._offsetMax;
                 }
                 if (this.dropdown) {
@@ -6137,10 +6227,10 @@
                         var minInput = rangeSelector.minInput,
                     maxInput = rangeSelector.maxInput;
                     // #3274 in some case blur is not defined
-                    if (minInput && minInput.blur) {
+                    if (minInput && (minInput.blur)) {
                         fireEvent(minInput, 'blur');
                     }
-                    if (maxInput && maxInput.blur) {
+                    if (maxInput && (maxInput.blur)) {
                         fireEvent(maxInput, 'blur');
                     }
                 };
@@ -6459,7 +6549,7 @@
                 }
                 else if (H.isSafari && !hasTimezone(input)) {
                     var offset = new Date(input).getTimezoneOffset() / 60;
-                    input += offset <= 0 ? "+" + pad(-offset) + ":00" : "-" + pad(offset) + ":00";
+                    input += offset <= 0 ? "+".concat(pad(-offset), ":00") : "-".concat(pad(offset), ":00");
                 }
                 var date = Date.parse(input);
                 // If the value isn't parsed directly to a value by the
@@ -6581,7 +6671,7 @@
                     // Styles
                     label.css(merge(chartStyle, options.labelStyle));
                     dateBox.css(merge({
-                        color: "#333333" /* neutralColor80 */
+                        color: "#333333" /* Palette.neutralColor80 */
                     }, chartStyle, options.inputStyle));
                     css(input, extend({
                         position: 'absolute',
@@ -7219,7 +7309,7 @@
                 var userButtonTheme = (chart.userOptions.rangeSelector &&
                         chart.userOptions.rangeSelector.buttonTheme) || {};
                 var getAttribs = function (text) { return ({
-                        text: text ? text + " \u25BE" : '▾',
+                        text: text ? "" + text + " \u25BE" : '▾',
                         width: 'auto',
                         paddingLeft: pick(options.buttonTheme.paddingLeft,
                     userButtonTheme.padding, 8),
@@ -7548,8 +7638,8 @@
                 min = max - rangeOptions;
                 range = rangeOptions;
             }
-            else {
-                min = max + getTrueRange(max, -rangeOptions.count);
+            else if (rangeOptions) {
+                min = max + getTrueRange(max, -(rangeOptions.count || 1));
                 // Let the fixedRange reflect initial settings (#5930)
                 if (this.chart) {
                     this.chart.fixedRange = max - min;
@@ -7564,11 +7654,16 @@
                 if (typeof range === 'undefined') { // #4501
                     range = getTrueRange(min, rangeOptions.count);
                 }
-                this.newMax = Math.min(min + range, this.dataMax);
+                this.newMax = Math.min(min + range, pick(this.dataMax, Number.MAX_VALUE));
             }
             if (!isNumber(max)) {
                 min = void 0;
             }
+            else if (!isNumber(rangeOptions) &&
+                rangeOptions &&
+                rangeOptions._offsetMin) {
+                min += rangeOptions._offsetMin;
+            }
             return min;
         };
         if (!H.RangeSelector) {
@@ -7981,7 +8076,7 @@
                     if (chart.accessibility) {
                         chart.accessibility.keyboardNavigation.tabindexContainer
                             .focus();
-                        chart.accessibility.keyboardNavigation[direction < 0 ? 'prev' : 'next']();
+                        chart.accessibility.keyboardNavigation.move(direction);
                     }
                 }
                 else if (rangeSel) {
@@ -8072,7 +8167,7 @@
                             e.stopPropagation();
                             if (a11y) {
                                 a11y.keyboardNavigation.tabindexContainer.focus();
-                                a11y.keyboardNavigation[e.shiftKey ? 'prev' : 'next']();
+                                a11y.keyboardNavigation.move(e.shiftKey ? -1 : 1);
                             }
                         }
                     });
@@ -8430,6 +8525,7 @@
                 else if (series.a11yMarkersForced) {
                     delete series.a11yMarkersForced;
                     unforceSeriesMarkerOptions(series);
+                    delete series.resetA11yMarkerOptions;
                 }
             }
             /**
@@ -8457,20 +8553,20 @@
                 });
             }
             /**
+             * Reset markers to normal
              * @private
              */
             function unforceSeriesMarkerOptions(series) {
                 var resetMarkerOptions = series.resetA11yMarkerOptions;
                 if (resetMarkerOptions) {
-                    merge(true, series.options, {
+                    var originalOpactiy = resetMarkerOptions.states &&
+                            resetMarkerOptions.states.normal &&
+                            resetMarkerOptions.states.normal.opacity;
+                    series.update({
                         marker: {
                             enabled: resetMarkerOptions.enabled,
                             states: {
-                                normal: {
-                                    opacity: resetMarkerOptions.states &&
-                                        resetMarkerOptions.states.normal &&
-                                        resetMarkerOptions.states.normal.opacity
-                                }
+                                normal: { opacity: originalOpactiy }
                             }
                         }
                     });
@@ -8570,6 +8666,37 @@
                 pointA11yDisabled ||
                 isSkipSeries(point.series);
         }
+        /**
+         * Get the first point that is not a skip point in this series.
+         * @private
+         */
+        function getFirstValidPointInSeries(series) {
+            var points = series.points || [],
+                len = points.length;
+            for (var i = 0; i < len; ++i) {
+                if (!isSkipPoint(points[i])) {
+                    return points[i];
+                }
+            }
+            return null;
+        }
+        /**
+         * Get the first point that is not a skip point in this chart.
+         * @private
+         */
+        function getFirstValidPointInChart(chart) {
+            var series = chart.series || [],
+                len = series.length;
+            for (var i = 0; i < len; ++i) {
+                if (!isSkipSeries(series[i])) {
+                    var point = getFirstValidPointInSeries(series[i]);
+                    if (point) {
+                        return point;
+                    }
+                }
+            }
+            return null;
+        }
         /**
          * @private
          */
@@ -8582,7 +8709,7 @@
                 // Highlight first valid point in the series will also
                 // look backwards. It always starts from currently
                 // highlighted point.
-                res = chart.series[i].highlightFirstValidPoint();
+                res = chart.series[i].highlightNextValidPoint();
                 if (res) {
                     break;
                 }
@@ -8590,24 +8717,24 @@
             return res;
         }
         /**
+         * After drilling down/up, we need to set focus to the first point for
+         * screen readers and keyboard nav.
          * @private
          */
         function updateChartFocusAfterDrilling(chart) {
-            highlightFirstValidPointInChart(chart);
-            if (chart.focusElement) {
-                chart.focusElement.removeFocusBorder();
+            var point = getFirstValidPointInChart(chart);
+            if (point) {
+                point.highlight(false); // Do not visually highlight
             }
         }
         /**
+         * Highlight the first point in chart that is not a skip point
          * @private
          */
         function highlightFirstValidPointInChart(chart) {
-            var res = false;
             delete chart.highlightedPoint;
-            res = chart.series.reduce(function (acc, cur) {
-                return acc || cur.highlightFirstValidPoint();
-            }, false);
-            return res;
+            var point = getFirstValidPointInChart(chart);
+            return point ? point.highlight() : false;
         }
         /* *
          *
@@ -8645,7 +8772,7 @@
                 e.addEvent(Series, 'destroy', function () {
                     return keyboardNavigation.onSeriesDestroy(this);
                 });
-                e.addEvent(chart, 'afterDrilldown', function () {
+                e.addEvent(chart, 'afterApplyDrilldown', function () {
                     updateChartFocusAfterDrilling(this);
                 });
                 e.addEvent(chart, 'drilldown', function (e) {
@@ -8685,11 +8812,11 @@
                 });
             };
             /**
+             * After drillup we want to find the point that was drilled down to and
+             * highlight it.
              * @private
              */
             SeriesKeyboardNavigation.prototype.onDrillupAll = function () {
-                // After drillup we want to find the point that was drilled down to and
-                // highlight it.
                 var last = this.lastDrilledDownPoint,
                     chart = this.chart,
                     series = last && getSeriesFromName(chart,
@@ -8698,15 +8825,13 @@
                 if (last && series && defined(last.x) && defined(last.y)) {
                     point = getPointFromXY(series, last.x, last.y);
                 }
+                point = point || getFirstValidPointInChart(chart);
                 // Container focus can be lost on drillup due to deleted elements.
                 if (chart.container) {
                     chart.container.focus();
                 }
                 if (point && point.highlight) {
-                    point.highlight();
-                }
-                if (chart.focusElement) {
-                    chart.focusElement.removeFocusBorder();
+                    point.highlight(false); // Do not visually highlight
                 }
             };
             /**
@@ -8719,13 +8844,16 @@
                     inverted = chart.inverted;
                 return new KeyboardNavigationHandler(chart, {
                     keyCodeMap: [
-                        [inverted ? [keys.up, keys.down] : [keys.left, keys.right], function (keyCode) {
+                        [inverted ? [keys.up, keys.down] : [keys.left, keys.right],
+                            function (keyCode) {
                                 return keyboardNavigation.onKbdSideways(this, keyCode);
                             }],
-                        [inverted ? [keys.left, keys.right] : [keys.up, keys.down], function (keyCode) {
+                        [inverted ? [keys.left, keys.right] : [keys.up, keys.down],
+                            function (keyCode) {
                                 return keyboardNavigation.onKbdVertical(this, keyCode);
                             }],
-                        [[keys.enter, keys.space], function (keyCode, event) {
+                        [[keys.enter, keys.space],
+                            function (keyCode, event) {
                                 var point = chart.highlightedPoint;
                                 if (point) {
                                     event.point = point;
@@ -8734,22 +8862,27 @@
                                 }
                                 return this.response.success;
                             }],
-                        [[keys.home], function () {
+                        [[keys.home],
+                            function () {
                                 highlightFirstValidPointInChart(chart);
                                 return this.response.success;
                             }],
-                        [[keys.end], function () {
+                        [[keys.end],
+                            function () {
                                 highlightLastValidPointInChart(chart);
                                 return this.response.success;
                             }],
-                        [[keys.pageDown, keys.pageUp], function (keyCode) {
+                        [[keys.pageDown, keys.pageUp],
+                            function (keyCode) {
                                 chart.highlightAdjacentSeries(keyCode === keys.pageDown);
                                 return this.response.success;
                             }]
                     ],
                     init: function () {
-                        highlightFirstValidPointInChart(chart);
-                        return this.response.success;
+                        return keyboardNavigation.onHandlerInit(this);
+                    },
+                    validate: function () {
+                        return !!getFirstValidPointInChart(chart);
                     },
                     terminate: function () {
                         return keyboardNavigation.onHandlerTerminate();
@@ -8768,6 +8901,25 @@
                     isNext = keyCode === keys.right || keyCode === keys.down;
                 return this.attemptHighlightAdjacentPoint(handler, isNext);
             };
+            /**
+             * When keyboard navigation inits.
+             * @private
+             * @param {Highcharts.KeyboardNavigationHandler} handler The handler object
+             * @return {number}
+             * response
+             */
+            SeriesKeyboardNavigation.prototype.onHandlerInit = function (handler) {
+                var chart = this.chart,
+                    kbdNavOptions = chart.options.accessibility.keyboardNavigation;
+                if (kbdNavOptions.seriesNavigation.rememberPointFocus &&
+                    chart.highlightedPoint) {
+                    chart.highlightedPoint.highlight();
+                }
+                else {
+                    highlightFirstValidPointInChart(chart);
+                }
+                return handler.response.success;
+            };
             /**
              * @private
              * @param {Highcharts.KeyboardNavigationHandler} handler
@@ -8797,7 +8949,8 @@
              * @private
              */
             SeriesKeyboardNavigation.prototype.onHandlerTerminate = function () {
-                var chart = this.chart;
+                var chart = this.chart,
+                    kbdNavOptions = chart.options.accessibility.keyboardNavigation;
                 if (chart.tooltip) {
                     chart.tooltip.hide(0);
                 }
@@ -8808,15 +8961,13 @@
                 if (chart.highlightedPoint && chart.highlightedPoint.onMouseOut) {
                     chart.highlightedPoint.onMouseOut();
                 }
-                delete chart.highlightedPoint;
+                if (!kbdNavOptions.seriesNavigation.rememberPointFocus) {
+                    delete chart.highlightedPoint;
+                }
             };
             /**
              * Function that attempts to highlight next/prev point. Handles wrap around.
              * @private
-             * @param {Highcharts.KeyboardNavigationHandler} handler
-             * @param {boolean} directionIsNext
-             * @return {number}
-             * response
              */
             SeriesKeyboardNavigation.prototype.attemptHighlightAdjacentPoint = function (handler, directionIsNext) {
                 var chart = this.chart,
@@ -8824,8 +8975,10 @@
                         .wrapAround,
                     highlightSuccessful = chart.highlightAdjacentPoint(directionIsNext);
                 if (!highlightSuccessful) {
-                    if (wrapAround) {
-                        return handler.init(directionIsNext ? 1 : -1);
+                    if (wrapAround && (directionIsNext ?
+                        highlightFirstValidPointInChart(chart) :
+                        highlightLastValidPointInChart(chart))) {
+                        return handler.response.success;
                     }
                     return handler.response[directionIsNext ? 'next' : 'prev'];
                 }
@@ -9032,7 +9185,7 @@
                 // Highlight the new point or any first valid point back or forwards
                 // from it
                 newPoint.highlight();
-                return newPoint.series.highlightFirstValidPoint();
+                return newPoint.series.highlightNextValidPoint();
             }
             /**
              * @private
@@ -9069,7 +9222,7 @@
                             seriesTypes[type].prototype.keyboardMoveVertical = false;
                         }
                     });
-                    seriesProto.highlightFirstValidPoint = (seriesHighlightFirstValidPoint);
+                    seriesProto.highlightNextValidPoint = (seriesHighlightNextValidPoint);
                 }
             }
             SeriesKeyboardNavigation.compose = compose;
@@ -9107,7 +9260,7 @@
                 return defined(minIx) ? series.points[minIx] : void 0;
             }
             /**
-             * Highlights a point (show tooltip and display hover state).
+             * Highlights a point (show tooltip, display hover state, focus element).
              *
              * @private
              * @function Highcharts.Point#highlight
@@ -9115,9 +9268,10 @@
              * @return {Highcharts.Point}
              *         This highlighted point.
              */
-            function pointHighlight() {
+            function pointHighlight(highlightVisually) {
+                if (highlightVisually === void 0) { highlightVisually = true; }
                 var chart = this.series.chart;
-                if (!this.isNull) {
+                if (!this.isNull && highlightVisually) {
                     this.onMouseOver(); // Show the hover marker and tooltip
                 }
                 else {
@@ -9132,6 +9286,9 @@
                 // change z-index and mess up the element.
                 if (this.graphic) {
                     chart.setFocusToElement(this.graphic);
+                    if (!highlightVisually && chart.focusElement) {
+                        chart.focusElement.removeFocusBorder();
+                    }
                 }
                 chart.highlightedPoint = this;
                 return this;
@@ -9142,9 +9299,9 @@
              * point in the series, use that as starting point.
              *
              * @private
-             * @function Highcharts.Series#highlightFirstValidPoint
+             * @function Highcharts.Series#highlightNextValidPoint
              */
-            function seriesHighlightFirstValidPoint() {
+            function seriesHighlightNextValidPoint() {
                 var curPoint = this.chart.highlightedPoint,
                     start = (curPoint && curPoint.series) === this ?
                         getPointIndex(curPoint) :
@@ -9231,7 +9388,6 @@
              * @private
              */
             SeriesComponent.compose = function (ChartClass, PointClass, SeriesClass) {
-                // Handle forcing markers
                 NewDataAnnouncer.compose(SeriesClass);
                 ForcedMarkers.compose(SeriesClass);
                 SeriesKeyboardNavigation.compose(ChartClass, PointClass, SeriesClass);
@@ -9320,7 +9476,7 @@
 
         return SeriesComponent;
     });
-    _registerModule(_modules, 'Accessibility/Components/ZoomComponent.js', [_modules['Accessibility/AccessibilityComponent.js'], _modules['Accessibility/Utils/ChartUtilities.js'], _modules['Core/Globals.js'], _modules['Accessibility/KeyboardNavigationHandler.js'], _modules['Core/Utilities.js']], function (AccessibilityComponent, ChartUtilities, H, KeyboardNavigationHandler, U) {
+    _registerModule(_modules, 'Accessibility/Components/ZoomComponent.js', [_modules['Accessibility/AccessibilityComponent.js'], _modules['Accessibility/Utils/ChartUtilities.js'], _modules['Accessibility/KeyboardNavigationHandler.js'], _modules['Core/Utilities.js']], function (AccessibilityComponent, CU, KeyboardNavigationHandler, U) {
         /* *
          *
          *  (c) 2009-2021 Øystein Moseng
@@ -9348,24 +9504,43 @@
                 d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
             };
         })();
-        var unhideChartElementFromAT = ChartUtilities.unhideChartElementFromAT;
-        var noop = H.noop;
+        var unhideChartElementFromAT = CU.unhideChartElementFromAT;
         var attr = U.attr,
-            extend = U.extend,
             pick = U.pick;
         /* *
          *
          *  Functions
          *
          * */
-        /* eslint-disable valid-jsdoc */
+        /**
+         * Pan along axis in a direction (1 or -1), optionally with a defined
+         * granularity (number of steps it takes to walk across current view)
+         * @private
+         */
+        function axisPanStep(axis, direction, granularity) {
+            var gran = granularity || 3;
+            var extremes = axis.getExtremes();
+            var step = (extremes.max - extremes.min) / gran * direction;
+            var newMax = extremes.max + step;
+            var newMin = extremes.min + step;
+            var size = newMax - newMin;
+            if (direction < 0 && newMin < extremes.dataMin) {
+                newMin = extremes.dataMin;
+                newMax = newMin + size;
+            }
+            else if (direction > 0 && newMax > extremes.dataMax) {
+                newMax = extremes.dataMax;
+                newMin = newMax - size;
+            }
+            axis.setExtremes(newMin, newMax);
+        }
         /**
          * @private
          */
         function chartHasMapZoom(chart) {
-            return !!(chart.mapZoom &&
-                chart.mapNavButtons &&
-                chart.mapNavButtons.length);
+            return !!((chart.mapZoom) &&
+                chart.mapNavigation &&
+                chart.mapNavigation.navButtons.length);
         }
         /* *
          *
@@ -9405,7 +9580,7 @@
                     chart = this.chart;
                 this.proxyProvider.addGroup('zoom', 'div');
                 [
-                    'afterShowResetZoom', 'afterDrilldown', 'drillupall'
+                    'afterShowResetZoom', 'afterApplyDrilldown', 'drillupall'
                 ].forEach(function (eventType) {
                     component.addEvent(chart, eventType, function () {
                         component.updateProxyOverlays();
@@ -9419,8 +9594,8 @@
                 var chart = this.chart,
                     component = this;
                 // Make map zoom buttons accessible
-                if (chart.mapNavButtons) {
-                    chart.mapNavButtons.forEach(function (button, i) {
+                if (chart.mapNavigation) {
+                    chart.mapNavigation.navButtons.forEach(function (button, i) {
                         unhideChartElementFromAT(chart, button.element);
                         component.setMapNavButtonAttrs(button.element, 'accessibility.zoom.mapZoom' + (i ? 'Out' : 'In'));
                     });
@@ -9457,10 +9632,13 @@
                 if (chart.resetZoomButton) {
                     this.createZoomProxyButton(chart.resetZoomButton, 'resetZoomProxyButton', chart.langFormat('accessibility.zoom.resetZoomButton', { chart: chart }));
                 }
-                if (chart.drillUpButton) {
+                if (chart.drillUpButton &&
+                    chart.breadcrumbs &&
+                    chart.breadcrumbs.list) {
+                    var lastBreadcrumb = chart.breadcrumbs.list[chart.breadcrumbs.list.length - 1];
                     this.createZoomProxyButton(chart.drillUpButton, 'drillUpProxyButton', chart.langFormat('accessibility.drillUpButton', {
                         chart: chart,
-                        buttonText: chart.getDrilldownBackText()
+                        buttonText: chart.breadcrumbs.getButtonText(lastBreadcrumb)
                     }));
                 }
             };
@@ -9528,7 +9706,7 @@
                         'yAxis' : 'xAxis',
                     stepDirection = (keyCode === keys.left || keyCode === keys.up) ?
                         -1 : 1;
-                this.chart[panAxis][0].panStep(stepDirection);
+                axisPanStep(this.chart[panAxis][0], stepDirection);
                 return keyboardNavigationHandler.response.success;
             };
             /**
@@ -9544,14 +9722,14 @@
                 var isMoveOutOfRange = isBackwards && !this.focusedMapNavButtonIx ||
                         !isBackwards && this.focusedMapNavButtonIx;
                 // Deselect old
-                chart.mapNavButtons[this.focusedMapNavButtonIx].setState(0);
+                chart.mapNavigation.navButtons[this.focusedMapNavButtonIx].setState(0);
                 if (isMoveOutOfRange) {
                     chart.mapZoom(); // Reset zoom
                     return response[isBackwards ? 'prev' : 'next'];
                 }
                 // Select other button
                 this.focusedMapNavButtonIx += isBackwards ? -1 : 1;
-                var button = chart.mapNavButtons[this.focusedMapNavButtonIx];
+                var button = chart.mapNavigation.navButtons[this.focusedMapNavButtonIx];
                 chart.setFocusToElement(button.box, button.element);
                 button.setState(2);
                 return response.success;
@@ -9572,8 +9750,8 @@
              */
             ZoomComponent.prototype.onMapNavInit = function (direction) {
                 var chart = this.chart,
-                    zoomIn = chart.mapNavButtons[0],
-                    zoomOut = chart.mapNavButtons[1],
+                    zoomIn = chart.mapNavigation.navButtons[0],
+                    zoomOut = chart.mapNavigation.navButtons[1],
                     initialButton = direction > 0 ? zoomIn : zoomOut;
                 chart.setFocusToElement(initialButton.box, initialButton.element);
                 initialButton.setState(2);
@@ -9642,67 +9820,6 @@
             };
             return ZoomComponent;
         }(AccessibilityComponent));
-        /* *
-         *
-         *  Class Namespace
-         *
-         * */
-        (function (ZoomComponent) {
-            /* *
-             *
-             *  Declarations
-             *
-             * */
-            /* *
-             *
-             *  Constants
-             *
-             * */
-            ZoomComponent.composedClasses = [];
-            /* *
-             *
-             *  Functions
-             *
-             * */
-            /**
-             * @private
-             */
-            function compose(AxisClass) {
-                if (ZoomComponent.composedClasses.indexOf(AxisClass) === -1) {
-                    ZoomComponent.composedClasses.push(AxisClass);
-                    var axisProto = AxisClass.prototype;
-                    axisProto.panStep = axisPanStep;
-                }
-            }
-            ZoomComponent.compose = compose;
-            /**
-             * Pan along axis in a direction (1 or -1), optionally with a defined
-             * granularity (number of steps it takes to walk across current view)
-             *
-             * @private
-             * @function Highcharts.Axis#panStep
-             *
-             * @param {number} direction
-             * @param {number} [granularity]
-             */
-            function axisPanStep(direction, granularity) {
-                var gran = granularity || 3;
-                var extremes = this.getExtremes();
-                var step = (extremes.max - extremes.min) / gran * direction;
-                var newMax = extremes.max + step;
-                var newMin = extremes.min + step;
-                var size = newMax - newMin;
-                if (direction < 0 && newMin < extremes.dataMin) {
-                    newMin = extremes.dataMin;
-                    newMax = newMin + size;
-                }
-                else if (direction > 0 && newMax > extremes.dataMax) {
-                    newMax = extremes.dataMax;
-                    newMin = newMax - size;
-                }
-                this.setExtremes(newMin, newMax);
-            }
-        })(ZoomComponent || (ZoomComponent = {}));
         /* *
          *
          *  Default Export
@@ -9749,15 +9866,15 @@
                 var testDiv = doc.createElement('div');
                 var imageSrc = 'data:image/gif;base64,' +
                         'R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==';
-                testDiv.style.backgroundImage = "url(" + imageSrc + ")"; // #13071
+                testDiv.style.backgroundImage = "url(".concat(imageSrc, ")"); // #13071
                 doc.body.appendChild(testDiv);
                 var bi = (testDiv.currentStyle ||
                         win.getComputedStyle(testDiv)).backgroundImage;
                 doc.body.removeChild(testDiv);
                 return bi === 'none';
             }
-            // Not used for other browsers
-            return false;
+            // Other browsers use the forced-colors standard
+            return win.matchMedia && win.matchMedia('(forced-colors: active)').matches;
         }
         /**
          * Force high contrast theme for the chart. The default theme is defined in
@@ -10033,7 +10150,7 @@
 
         return theme;
     });
-    _registerModule(_modules, 'Accessibility/Options/Options.js', [], function () {
+    _registerModule(_modules, 'Accessibility/Options/A11yDefaults.js', [], function () {
         /* *
          *
          *  (c) 2009-2021 Øystein Moseng
@@ -10045,6 +10162,11 @@
          *  !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
          *
          * */
+        /* *
+         *
+         *  API Options
+         *
+         * */
         /**
          * Formatter callback for the accessibility announcement.
          *
@@ -10125,7 +10247,17 @@
                  */
                 accessibility: {
                     /**
-                     * Enable accessibility functionality for the chart.
+                     * Enable accessibility functionality for the chart. For more
+                     * information on how to include these features, and why this is
+                     * recommended, see [Highcharts Accessibility](https://www.highcharts.com/docs/accessibility/accessibility-module).
+                     *
+                     * Highcharts will by default emit a warning to the console if
+                     * the [accessibility module](https://code.highcharts.com/modules/accessibility.js)
+                     * is not loaded. Setting this option to `false` will override
+                     * and silence the warning.
+                     *
+                     * Once the module is loaded, setting this option to `false`
+                     * will disable the module for this chart.
                      *
                      * @since 5.0.0
                      */
@@ -10239,12 +10371,43 @@
                          * of the series for a screen reader user. If `false` is returned,
                          * the default formatter will be used for that series.
                          *
+                         * @see [series.descriptionFormat](#accessibility.series.descriptionFormat)
                          * @see [series.description](#plotOptions.series.description)
                          *
                          * @type      {Highcharts.ScreenReaderFormatterCallbackFunction<Highcharts.Series>}
                          * @since 8.0.0
                          * @apioption accessibility.series.descriptionFormatter
                          */
+                        /**
+                         * Format to use for describing the data series group to assistive
+                         * technology - including screen readers.
+                         *
+                         * The series context and its subproperties are available under the
+                         * variable `{series}`, for example `{series.name}` for the series
+                         * name, and `{series.points.length}` for the number of data points.
+                         *
+                         * The chart context and its subproperties are available under the
+                         * variable `{chart}`, for example `{chart.series.length}` for the
+                         * number of series in the chart.
+                         *
+                         * `{seriesDescription}` refers to the automatic description of the
+                         * series type and number of points added by Highcharts by default.
+                         * `{authorDescription}` refers to the description added in
+                         * [series.description](#plotOptions.series.description) if one is
+                         * present. `{axisDescription}` refers to the description added if
+                         * the chart has multiple X or Y axes.
+                         *
+                         * Note that if [series.descriptionFormatter](#accessibility.series.descriptionFormatter)
+                         * is declared it will take precedence, and this option will be
+                         * overridden.
+                         *
+                         * @sample highcharts/accessibility/advanced-accessible
+                         *  Accessible low-medium-high chart
+                         *
+                         * @type      {string}
+                         * @since 10.1.0
+                         */
+                        descriptionFormat: '{seriesDescription}{authorDescription}{axisDescription}',
                         /**
                          * Whether or not to add series descriptions to charts with a single
                          * series.
@@ -10346,6 +10509,8 @@
                          * to assistive technology - including screen readers.
                          * The point context is available as `{point}`.
                          *
+                         * Other available context variables include `{index}`, `{value}`, and `{xDescription}`.
+                         *
                          * Additionally, the series name, annotation info, and
                          * description added in `point.accessibility.description`
                          * is added by default if relevant. To override this, use the
@@ -10358,7 +10523,18 @@
                          * @type      {string}
                          * @since 8.0.1
                          */
-                        valueDescriptionFormat: '{index}. {xDescription}{separator}{value}.'
+                        valueDescriptionFormat: '{xDescription}{separator}{value}.',
+                        /**
+                         * Whether or not to describe points with the value `null` to
+                         * assistive technology, such as screen readers.
+                         *
+                         * @sample {highmaps} maps/demo/all-areas-as-null
+                         *         Accessible map with null points
+                         *
+                         * @type      {boolean}
+                         * @since 10.1.0
+                         */
+                        describeNull: true
                     },
                     /**
                      * Amount of landmarks/regions to create for screen reader users. More
@@ -10527,7 +10703,7 @@
                              */
                             style: {
                                 /** @internal */
-                                color: "#335cad" /* highlightColor80 */,
+                                color: "#335cad" /* Palette.highlightColor80 */,
                                 /** @internal */
                                 lineWidth: 2,
                                 /** @internal */
@@ -10602,7 +10778,16 @@
                              * @type  {boolean|number}
                              * @since 8.0.0
                              */
-                            pointNavigationEnabledThreshold: false
+                            pointNavigationEnabledThreshold: false,
+                            /**
+                             * Remember which point was focused even after navigating away
+                             * from the series, so that when navigating back to the series
+                             * you start at the last focused point.
+                             *
+                             * @type  {boolean}
+                             * @since 10.1.0
+                             */
+                            rememberPointFocus: false
                         }
                     },
                     /**
@@ -10866,7 +11051,7 @@
 
         return Options;
     });
-    _registerModule(_modules, 'Accessibility/Options/LangOptions.js', [], function () {
+    _registerModule(_modules, 'Accessibility/Options/LangDefaults.js', [], function () {
         /* *
          *
          *  (c) 2009-2021 Øystein Moseng
@@ -10878,6 +11063,11 @@
          *  !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
          *
          * */
+        /* *
+         *
+         *  API Options
+         *
+         * */
         var langOptions = {
                 /**
                  * Configure the accessibility strings in the chart. Requires the
@@ -10936,7 +11126,7 @@
                      * @since 8.0.0
                      */
                     screenReaderSection: {
-                        beforeRegionLabel: 'Chart screen reader information, {chartTitle}.',
+                        beforeRegionLabel: '',
                         afterRegionLabel: '',
                         /**
                          * Language options for annotation descriptions.
@@ -11102,12 +11292,12 @@
                         xAxisDescriptionPlural: 'The chart has {numAxes} X axes displaying {#each(names, -1) }and {names[-1]}.',
                         yAxisDescriptionSingular: 'The chart has 1 Y axis displaying {names[0]}. {ranges[0]}',
                         yAxisDescriptionPlural: 'The chart has {numAxes} Y axes displaying {#each(names, -1) }and {names[-1]}.',
-                        timeRangeDays: 'Range: {range} days.',
-                        timeRangeHours: 'Range: {range} hours.',
-                        timeRangeMinutes: 'Range: {range} minutes.',
-                        timeRangeSeconds: 'Range: {range} seconds.',
-                        rangeFromTo: 'Range: {rangeFrom} to {rangeTo}.',
-                        rangeCategories: 'Range: {numCategories} categories.'
+                        timeRangeDays: 'Data range: {range} days.',
+                        timeRangeHours: 'Data range: {range} hours.',
+                        timeRangeMinutes: 'Data range: {range} minutes.',
+                        timeRangeSeconds: 'Data range: {range} seconds.',
+                        rangeFromTo: 'Data ranges from {rangeFrom} to {rangeTo}.',
+                        rangeCategories: 'Data range: {numCategories} categories.'
                     },
                     /**
                      * Exporting menu format strings for accessibility module.
@@ -11138,34 +11328,39 @@
                          * If a definition does not exist for the specific series type
                          * and mode, the 'default' lang definitions are used.
                          *
+                         * Chart and its subproperties can be accessed with the `{chart}` variable.
+                         * The series and its subproperties can be accessed with the `{series}` variable.
+                         *
+                         * The series index (starting from 1) can be accessed with the `{seriesNumber}` variable.
+                         *
                          * @since 6.0.6
                          */
                         summary: {
                             /* eslint-disable max-len */
-                            'default': '{name}, series {ix} of {numSeries} with {numPoints} data {#plural(numPoints, points, point)}.',
-                            defaultCombination: '{name}, series {ix} of {numSeries} with {numPoints} data {#plural(numPoints, points, point)}.',
-                            line: '{name}, line {ix} of {numSeries} with {numPoints} data {#plural(numPoints, points, point)}.',
-                            lineCombination: '{name}, series {ix} of {numSeries}. Line with {numPoints} data {#plural(numPoints, points, point)}.',
-                            spline: '{name}, line {ix} of {numSeries} with {numPoints} data {#plural(numPoints, points, point)}.',
-                            splineCombination: '{name}, series {ix} of {numSeries}. Line with {numPoints} data {#plural(numPoints, points, point)}.',
-                            column: '{name}, bar series {ix} of {numSeries} with {numPoints} {#plural(numPoints, bars, bar)}.',
-                            columnCombination: '{name}, series {ix} of {numSeries}. Bar series with {numPoints} {#plural(numPoints, bars, bar)}.',
-                            bar: '{name}, bar series {ix} of {numSeries} with {numPoints} {#plural(numPoints, bars, bar)}.',
-                            barCombination: '{name}, series {ix} of {numSeries}. Bar series with {numPoints} {#plural(numPoints, bars, bar)}.',
-                            pie: '{name}, pie {ix} of {numSeries} with {numPoints} {#plural(numPoints, slices, slice)}.',
-                            pieCombination: '{name}, series {ix} of {numSeries}. Pie with {numPoints} {#plural(numPoints, slices, slice)}.',
-                            scatter: '{name}, scatter plot {ix} of {numSeries} with {numPoints} {#plural(numPoints, points, point)}.',
-                            scatterCombination: '{name}, series {ix} of {numSeries}, scatter plot with {numPoints} {#plural(numPoints, points, point)}.',
-                            boxplot: '{name}, boxplot {ix} of {numSeries} with {numPoints} {#plural(numPoints, boxes, box)}.',
-                            boxplotCombination: '{name}, series {ix} of {numSeries}. Boxplot with {numPoints} {#plural(numPoints, boxes, box)}.',
-                            bubble: '{name}, bubble series {ix} of {numSeries} with {numPoints} {#plural(numPoints, bubbles, bubble)}.',
-                            bubbleCombination: '{name}, series {ix} of {numSeries}. Bubble series with {numPoints} {#plural(numPoints, bubbles, bubble)}.',
-                            map: '{name}, map {ix} of {numSeries} with {numPoints} {#plural(numPoints, areas, area)}.',
-                            mapCombination: '{name}, series {ix} of {numSeries}. Map with {numPoints} {#plural(numPoints, areas, area)}.',
-                            mapline: '{name}, line {ix} of {numSeries} with {numPoints} data {#plural(numPoints, points, point)}.',
-                            maplineCombination: '{name}, series {ix} of {numSeries}. Line with {numPoints} data {#plural(numPoints, points, point)}.',
-                            mapbubble: '{name}, bubble series {ix} of {numSeries} with {numPoints} {#plural(numPoints, bubbles, bubble)}.',
-                            mapbubbleCombination: '{name}, series {ix} of {numSeries}. Bubble series with {numPoints} {#plural(numPoints, bubbles, bubble)}.'
+                            'default': '{series.name}, series {seriesNumber} of {chart.series.length} with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            defaultCombination: '{series.name}, series {seriesNumber} of {chart.series.length} with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            line: '{series.name}, line {seriesNumber} of {chart.series.length} with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            lineCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Line with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            spline: '{series.name}, line {seriesNumber} of {chart.series.length} with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            splineCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Line with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            column: '{series.name}, bar series {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, bars, bar)}.',
+                            columnCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Bar series with {series.points.length} {#plural(series.points.length, bars, bar)}.',
+                            bar: '{series.name}, bar series {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, bars, bar)}.',
+                            barCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Bar series with {series.points.length} {#plural(series.points.length, bars, bar)}.',
+                            pie: '{series.name}, pie {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, slices, slice)}.',
+                            pieCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Pie with {series.points.length} {#plural(series.points.length, slices, slice)}.',
+                            scatter: '{series.name}, scatter plot {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, points, point)}.',
+                            scatterCombination: '{series.name}, series {seriesNumber} of {chart.series.length}, scatter plot with {series.points.length} {#plural(series.points.length, points, point)}.',
+                            boxplot: '{series.name}, boxplot {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, boxes, box)}.',
+                            boxplotCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Boxplot with {series.points.length} {#plural(series.points.length, boxes, box)}.',
+                            bubble: '{series.name}, bubble series {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, bubbles, bubble)}.',
+                            bubbleCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Bubble series with {series.points.length} {#plural(series.points.length, bubbles, bubble)}.',
+                            map: '{series.name}, map {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, areas, area)}.',
+                            mapCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Map with {series.points.length} {#plural(series.points.length, areas, area)}.',
+                            mapline: '{series.name}, line {seriesNumber} of {chart.series.length} with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            maplineCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Line with {series.points.length} data {#plural(series.points.length, points, point)}.',
+                            mapbubble: '{series.name}, bubble series {seriesNumber} of {chart.series.length} with {series.points.length} {#plural(series.points.length, bubbles, bubble)}.',
+                            mapbubbleCombination: '{series.name}, series {seriesNumber} of {chart.series.length}. Bubble series with {series.points.length} {#plural(series.points.length, bubbles, bubble)}.'
                         },
                         /**
                          * User supplied description text. This is added in the point
@@ -11204,6 +11399,11 @@
                     }
                 }
             };
+        /* *
+         *
+         *  Default Export
+         *
+         * */
 
         return langOptions;
     });
@@ -11271,6 +11471,11 @@
         /* eslint-enable max-len */
         var error = U.error,
             pick = U.pick;
+        /* *
+         *
+         *  Functions
+         *
+         * */
         /* eslint-disable valid-jsdoc */
         /**
          * Set a new option on a root prop, where the option is defined as an array of
@@ -11330,7 +11535,7 @@
                 var _a;
                 if (chartOptions[prop]) {
                     a11yOptions[prop] = chartOptions[prop];
-                    error(32, false, chart, (_a = {}, _a["chart." + prop] = "use accessibility." + prop, _a));
+                    error(32, false, chart, (_a = {}, _a["chart.".concat(prop)] = "use accessibility.".concat(prop), _a));
                 }
             });
         }
@@ -11387,7 +11592,7 @@
                         oldOption === 'skipKeyboardNavigation' ?
                             !optionVal : optionVal);
                         error(32, false, chart, (_a = {},
-                            _a["series." + oldOption] = ('series.' +
+                            _a["series.".concat(oldOption)] = ('series.' +
                                 oldToNewSeriesOptions[oldOption].join('.')),
                             _a));
                     }
@@ -11462,10 +11667,15 @@
             copyDeprecatedKeyboardNavigationOptions(chart);
             copyDeprecatedLangOptions(chart);
         }
+        /* *
+         *
+         *  Default Export
+         *
+         * */
 
         return copyDeprecatedOptions;
     });
-    _registerModule(_modules, 'Accessibility/Accessibility.js', [_modules['Core/DefaultOptions.js'], _modules['Core/Globals.js'], _modules['Core/Utilities.js'], _modules['Accessibility/A11yI18n.js'], _modules['Accessibility/Components/ContainerComponent.js'], _modules['Accessibility/FocusBorder.js'], _modules['Accessibility/Components/InfoRegionsComponent.js'], _modules['Accessibility/KeyboardNavigation.js'], _modules['Accessibility/Components/LegendComponent.js'], _modules['Accessibility/Components/MenuComponent.js'], _modules['Accessibility/Components/SeriesComponent/NewDataAnnouncer.js'], _modules['Accessibility/ProxyProvider.js'], _modules['Accessibility/Components/RangeSelectorComponent.js'], _modules['Accessibility/Components/SeriesComponent/SeriesComponent.js'], _modules['Accessibility/Components/ZoomComponent.js'], _modules['Accessibility/HighContrastMode.js'], _modules['Accessibility/HighContrastTheme.js'], _modules['Accessibility/Options/Options.js'], _modules['Accessibility/Options/LangOptions.js'], _modules['Accessibility/Options/DeprecatedOptions.js']], function (D, H, U, A11yI18n, ContainerComponent, FocusBorder, InfoRegionsComponent, KeyboardNavigation, LegendComponent, MenuComponent, NewDataAnnouncer, ProxyProvider, RangeSelectorComponent, SeriesComponent, ZoomComponent, whcm, highContrastTheme, defaultOptionsA11Y, defaultLangOptions, copyDeprecatedOptions) {
+    _registerModule(_modules, 'Accessibility/Accessibility.js', [_modules['Core/DefaultOptions.js'], _modules['Core/Globals.js'], _modules['Core/Utilities.js'], _modules['Accessibility/A11yI18n.js'], _modules['Accessibility/Components/ContainerComponent.js'], _modules['Accessibility/FocusBorder.js'], _modules['Accessibility/Components/InfoRegionsComponent.js'], _modules['Accessibility/KeyboardNavigation.js'], _modules['Accessibility/Components/LegendComponent.js'], _modules['Accessibility/Components/MenuComponent.js'], _modules['Accessibility/Components/SeriesComponent/NewDataAnnouncer.js'], _modules['Accessibility/ProxyProvider.js'], _modules['Accessibility/Components/RangeSelectorComponent.js'], _modules['Accessibility/Components/SeriesComponent/SeriesComponent.js'], _modules['Accessibility/Components/ZoomComponent.js'], _modules['Accessibility/HighContrastMode.js'], _modules['Accessibility/HighContrastTheme.js'], _modules['Accessibility/Options/A11yDefaults.js'], _modules['Accessibility/Options/LangDefaults.js'], _modules['Accessibility/Options/DeprecatedOptions.js']], function (D, H, U, A11yI18n, ContainerComponent, FocusBorder, InfoRegionsComponent, KeyboardNavigation, LegendComponent, MenuComponent, NewDataAnnouncer, ProxyProvider, RangeSelectorComponent, SeriesComponent, ZoomComponent, whcm, highContrastTheme, defaultOptionsA11Y, defaultLangOptions, copyDeprecatedOptions) {
         /* *
          *
          *  (c) 2009-2021 Øystein Moseng
@@ -11776,7 +11986,6 @@
                 LegendComponent.compose(ChartClass, LegendClass);
                 MenuComponent.compose(ChartClass);
                 SeriesComponent.compose(ChartClass, PointClass, SeriesClass);
-                ZoomComponent.compose(AxisClass);
                 // RangeSelector
                 A11yI18n.compose(ChartClass);
                 FocusBorder.compose(ChartClass, SVGElementClass);
@@ -11797,7 +12006,7 @@
                         });
                     });
                     // Direct updates (events happen after render)
-                    ['afterDrilldown', 'drillupall'].forEach(function (event) {
+                    ['afterApplyDrilldown', 'drillupall'].forEach(function (event) {
                         addEvent(ChartClass, event, function chartOnAfterDrilldown() {
                             var a11y = this.accessibility;
                             if (a11y && !a11y.zombie) {