highcharts 10.0.0 → 10.1.0

package/modules/accessibility.src.js

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v10.0.0 (2022-03-07)
+ * @license Highcharts JS v10.1.0 (2022-04-29)
  *
  * Accessibility module
  *
@@ -52,7 +52,8 @@
          *
          * */
         var format = F.format;
-        var pick = U.pick;
+        var getNestedProperty = U.getNestedProperty,
+            pick = U.pick;
         /* *
          *
          *  Composition
@@ -111,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 ?
@@ -126,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]);
@@ -149,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];
@@ -768,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;
@@ -800,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,
@@ -1463,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
@@ -1681,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) {
@@ -1737,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);
@@ -2185,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);
@@ -2383,23 +2399,27 @@
                 }
             };
             /**
+             * 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-" + regionKey + "-" + 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');
                 }
             };
             /**
@@ -2620,7 +2640,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');
                 }
@@ -4152,14 +4175,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
@@ -4440,15 +4470,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.
@@ -4476,14 +4512,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
@@ -4501,7 +4542,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
@@ -4534,7 +4578,7 @@
                     describeSeriesElement(series, seriesEl);
                 }
                 else {
-                    seriesEl.setAttribute('aria-label', '');
+                    seriesEl.removeAttribute('aria-label');
                 }
             }
         }
@@ -8822,8 +8866,7 @@
                             }]
                     ],
                     init: function () {
-                        highlightFirstValidPointInChart(chart);
-                        return this.response.success;
+                        return keyboardNavigation.onHandlerInit(this);
                     },
                     validate: function () {
                         return !!getFirstValidPointInChart(chart);
@@ -8845,6 +8888,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
@@ -8874,7 +8936,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);
                 }
@@ -8885,7 +8948,9 @@
                 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.
@@ -10206,7 +10271,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
                      */
@@ -10320,12 +10395,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.
@@ -10427,6 +10533,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
@@ -10439,7 +10547,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
@@ -10683,7 +10802,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
                         }
                     },
                     /**
@@ -11017,7 +11145,7 @@
                      * @since 8.0.0
                      */
                     screenReaderSection: {
-                        beforeRegionLabel: 'Chart screen reader information, {chartTitle}.',
+                        beforeRegionLabel: '',
                         afterRegionLabel: '',
                         /**
                          * Language options for annotation descriptions.
@@ -11183,12 +11311,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.
@@ -11219,34 +11347,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

package/modules/annotations-advanced.js

@@ -1,5 +1,5 @@
 /*
- Highcharts JS v10.0.0 (2022-03-07)
+ Highcharts JS v10.1.0 (2022-04-29)
 
  Annotations module
 
@@ -14,8 +14,8 @@ this.removeDrag());this.removeMouseUp&&(this.removeMouseUp=this.removeMouseUp())
 l(g.doc,g.isTouchDevice?"touchend":"mouseup",function(d){var a=m(b.target&&b.target.annotation,b.target);a&&(a.cancelClick=b.hasDragged);b.cancelClick=b.hasDragged;b.hasDragged=!1;b.chart.hasDraggedAnnotation=!1;k(m(a,b),"afterUpdate");b.onMouseUp(d)},g.isTouchDevice?{passive:!1}:void 0)}},onMouseUp:function(a){var b=this.chart;a=this.target||this;var d=b.options.annotations;b=b.annotations.indexOf(a);this.removeDocEvents();d[b]=a.options},onDrag:function(a){if(this.chart.isInsidePlot(a.chartX-this.chart.plotLeft,
 a.chartY-this.chart.plotTop,{visiblePlotOnly:!0})){var b=this.mouseMoveToTranslation(a);"x"===this.options.draggable&&(b.y=0);"y"===this.options.draggable&&(b.x=0);this.points.length?this.translate(b.x,b.y):(this.shapes.forEach(function(d){d.translate(b.x,b.y)}),this.labels.forEach(function(d){d.translate(b.x,b.y)}));this.redraw(!1)}},mouseMoveToRadians:function(a,b,d){var f=a.prevChartY-d,h=a.prevChartX-b;d=a.chartY-d;a=a.chartX-b;this.chart.inverted&&(b=h,h=f,f=b,b=a,a=d,d=b);return Math.atan2(d,
 a)-Math.atan2(f,h)},mouseMoveToTranslation:function(a){var b=a.chartX-a.prevChartX;a=a.chartY-a.prevChartY;if(this.chart.inverted){var d=a;a=b;b=d}return{x:b,y:a}},mouseMoveToScale:function(a,b,d){b=(a.chartX-b||1)/(a.prevChartX-b||1);a=(a.chartY-d||1)/(a.prevChartY-d||1);this.chart.inverted&&(d=a,a=b,b=d);return{x:b,y:a}},destroy:function(){this.removeDocEvents();e(this);this.hcEvents=null}}});v(c,"Extensions/Annotations/ControlPoint.js",[c["Core/Utilities.js"],c["Extensions/Annotations/Mixins/EventEmitterMixin.js"]],
-function(g,c){var l=g.merge,k=g.pick;return function(){function g(g,e,a,b){this.addEvents=c.addEvents;this.graphic=void 0;this.mouseMoveToRadians=c.mouseMoveToRadians;this.mouseMoveToScale=c.mouseMoveToScale;this.mouseMoveToTranslation=c.mouseMoveToTranslation;this.onDrag=c.onDrag;this.onMouseDown=c.onMouseDown;this.onMouseUp=c.onMouseUp;this.removeDocEvents=c.removeDocEvents;this.nonDOMEvents=["drag"];this.chart=g;this.target=e;this.options=a;this.index=k(a.index,b)}g.prototype.setVisibility=function(g){this.graphic.attr("visibility",
-g?"visible":"hidden");this.options.visible=g};g.prototype.render=function(){var g=this.chart,e=this.options;this.graphic=g.renderer.symbol(e.symbol,0,0,e.width,e.height).add(g.controlPointsGroup).css(e.style);this.setVisibility(e.visible);this.addEvents()};g.prototype.redraw=function(g){this.graphic[g?"animate":"attr"](this.options.positioner.call(this,this.target))};g.prototype.destroy=function(){c.destroy.call(this);this.graphic&&(this.graphic=this.graphic.destroy());this.options=this.target=this.chart=
+function(g,c){var l=g.merge,k=g.pick;return function(){function g(g,e,a,b){this.addEvents=c.addEvents;this.graphic=void 0;this.mouseMoveToRadians=c.mouseMoveToRadians;this.mouseMoveToScale=c.mouseMoveToScale;this.mouseMoveToTranslation=c.mouseMoveToTranslation;this.onDrag=c.onDrag;this.onMouseDown=c.onMouseDown;this.onMouseUp=c.onMouseUp;this.removeDocEvents=c.removeDocEvents;this.nonDOMEvents=["drag"];this.chart=g;this.target=e;this.options=a;this.index=k(a.index,b)}g.prototype.setVisibility=function(g){this.graphic[g?
+"show":"hide"]();this.options.visible=g};g.prototype.render=function(){var g=this.chart,e=this.options;this.graphic=g.renderer.symbol(e.symbol,0,0,e.width,e.height).add(g.controlPointsGroup).css(e.style);this.setVisibility(e.visible);this.addEvents()};g.prototype.redraw=function(g){this.graphic[g?"animate":"attr"](this.options.positioner.call(this,this.target))};g.prototype.destroy=function(){c.destroy.call(this);this.graphic&&(this.graphic=this.graphic.destroy());this.options=this.target=this.chart=
 null};g.prototype.update=function(g){var e=this.chart,a=this.target,b=this.index;g=l(!0,this.options,g);this.destroy();this.constructor(e,a,g,b);this.render(e.controlPointsGroup);this.redraw()};return g}()});v(c,"Extensions/Annotations/MockPoint.js",[c["Core/Series/Series.js"],c["Core/Utilities.js"],c["Core/Axis/Axis.js"]],function(g,c,n){var l=c.defined,r=c.fireEvent;return function(){function c(e,a,b){this.y=this.x=this.ttBelow=this.plotY=this.plotX=this.negative=this.isInside=void 0;this.mock=
 !0;this.series={visible:!0,chart:e,getPlotBox:g.prototype.getPlotBox};this.target=a||null;this.options=b;this.applyOptions(this.getOptions())}c.fromPoint=function(e){return new c(e.series.chart,null,{x:e.x,y:e.y,xAxis:e.series.xAxis,yAxis:e.series.yAxis})};c.pointToPixels=function(e,a){var b=e.series,d=b.chart,f=e.plotX,h=e.plotY;d.inverted&&(e.mock?(f=e.plotY,h=e.plotX):(f=d.plotWidth-e.plotY,h=d.plotHeight-e.plotX));b&&!a&&(e=b.getPlotBox(),f+=e.translateX,h+=e.translateY);return{x:f,y:h}};c.pointToOptions=
 function(e){return{x:e.x,y:e.y,xAxis:e.series.xAxis,yAxis:e.series.yAxis}};c.prototype.hasDynamicOptions=function(){return"function"===typeof this.options};c.prototype.getOptions=function(){return this.hasDynamicOptions()?this.options(this.target):this.options};c.prototype.applyOptions=function(e){this.command=e.command;this.setAxis(e,"x");this.setAxis(e,"y");this.refresh()};c.prototype.setAxis=function(e,a){a+="Axis";e=e[a];var b=this.series.chart;this.series[a]=e instanceof n?e:l(e)?b[a][e]||b.get(e):
@@ -65,8 +65,8 @@ b);this.userOptions=b;b=this.getLabelsAndShapesOptions(this.options,b);this.opti
 b)}):a[f])});return d};h.prototype.addShapes=function(){(this.options.shapes||[]).forEach(function(a,b){a=this.initShape(a,b);x(!0,this.options.shapes[b],a.options)},this)};h.prototype.addLabels=function(){(this.options.labels||[]).forEach(function(a,b){a=this.initLabel(a,b);x(!0,this.options.labels[b],a.options)},this)};h.prototype.addClipPaths=function(){this.setClipAxes();this.clipXAxis&&this.clipYAxis&&this.options.crop&&(this.clipRect=this.chart.renderer.clipRect(this.getClipBox()))};h.prototype.setClipAxes=
 function(){var a=this.chart.xAxis,b=this.chart.yAxis,d=(this.options.labels||[]).concat(this.options.shapes||[]).reduce(function(d,f){f=f&&(f.point||f.points&&f.points[0]);return[a[f&&f.xAxis]||d[0],b[f&&f.yAxis]||d[1]]},[]);this.clipXAxis=d[0];this.clipYAxis=d[1]};h.prototype.getClipBox=function(){if(this.clipXAxis&&this.clipYAxis)return{x:this.clipXAxis.left,y:this.clipYAxis.top,width:this.clipXAxis.width,height:this.clipYAxis.height}};h.prototype.setLabelCollector=function(){var a=this;a.labelCollector=
 function(){return a.labels.reduce(function(a,b){b.options.allowOverlap||a.push(b.graphic);return a},[])};a.chart.labelCollectors.push(a.labelCollector)};h.prototype.setOptions=function(a){this.options=x(this.defaultOptions,a)};h.prototype.redraw=function(a){this.linkPoints();this.graphic||this.render();this.clipRect&&this.clipRect.animate(this.getClipBox());this.redrawItems(this.shapes,a);this.redrawItems(this.labels,a);n.redraw.call(this,a)};h.prototype.redrawItems=function(a,b){for(var d=a.length;d--;)this.redrawItem(a[d],
-b)};h.prototype.renderItems=function(a){for(var b=a.length;b--;)this.renderItem(a[b])};h.prototype.render=function(){var a=this.chart.renderer;this.graphic=a.g("annotation").attr({opacity:0,zIndex:this.options.zIndex,visibility:this.options.visible?"visible":"hidden"}).add();this.shapesGroup=a.g("annotation-shapes").add(this.graphic);this.options.crop&&this.shapesGroup.clip(this.chart.plotBoxClip);this.labelsGroup=a.g("annotation-labels").attr({translateX:0,translateY:0}).add(this.graphic);this.addClipPaths();
-this.clipRect&&this.graphic.clip(this.clipRect);this.renderItems(this.shapes);this.renderItems(this.labels);this.addEvents();n.render.call(this)};h.prototype.setVisibility=function(a){var b=this.options,d=this.chart.navigationBindings;a=t(a,!b.visible);this.graphic.attr("visibility",a?"visible":"hidden");a||(this.setControlPointsVisibility(!1),d.activeAnnotation===this&&d.popup&&"annotation-toolbar"===d.popup.formType&&w(d,"closePopup"));b.visible=a};h.prototype.setControlPointsVisibility=function(a){var b=
+b)};h.prototype.renderItems=function(a){for(var b=a.length;b--;)this.renderItem(a[b])};h.prototype.render=function(){var a=this.chart.renderer;this.graphic=a.g("annotation").attr({opacity:0,zIndex:this.options.zIndex,visibility:this.options.visible?"inherit":"hidden"}).add();this.shapesGroup=a.g("annotation-shapes").add(this.graphic);this.options.crop&&this.shapesGroup.clip(this.chart.plotBoxClip);this.labelsGroup=a.g("annotation-labels").attr({translateX:0,translateY:0}).add(this.graphic);this.addClipPaths();
+this.clipRect&&this.graphic.clip(this.clipRect);this.renderItems(this.shapes);this.renderItems(this.labels);this.addEvents();n.render.call(this)};h.prototype.setVisibility=function(a){var b=this.options,d=this.chart.navigationBindings;a=t(a,!b.visible);this.graphic.attr("visibility",a?"inherit":"hidden");a||(this.setControlPointsVisibility(!1),d.activeAnnotation===this&&d.popup&&"annotation-toolbar"===d.popup.formType&&w(d,"closePopup"));b.visible=a};h.prototype.setControlPointsVisibility=function(a){var b=
 function(b){b.setControlPointsVisibility(a)};n.setControlPointsVisibility.call(this,a);this.shapes.forEach(b);this.labels.forEach(b)};h.prototype.destroy=function(){var a=this.chart,b=function(a){a.destroy()};this.labels.forEach(b);this.shapes.forEach(b);this.clipYAxis=this.clipXAxis=null;y(a.labelCollectors,this.labelCollector);f.destroy.call(this);n.destroy.call(this);z(this,a)};h.prototype.remove=function(){return this.chart.removeAnnotation(this)};h.prototype.update=function(a,b){var d=this.chart,
 f=this.getLabelsAndShapesOptions(this.userOptions,a),h=d.annotations.indexOf(this);a=x(!0,this.userOptions,a);a.labels=f.labels;a.shapes=f.shapes;this.destroy();this.constructor(d,a);d.options.annotations[h]=a;this.isUpdating=!0;t(b,!0)&&d.redraw();w(this,"afterUpdate");this.isUpdating=!1};h.prototype.initShape=function(a,b){a=x(this.options.shapeOptions,{controlPointOptions:this.options.controlPointOptions},a);b=new h.shapesMap[a.type](this,a,b);b.itemType="shape";this.shapes.push(b);return b};h.prototype.initLabel=
 function(a,d){a=x(this.options.labelOptions,{controlPointOptions:this.options.controlPointOptions},a);d=new b(this,a,d);d.itemType="label";this.labels.push(d);return d};h.prototype.redrawItem=function(a,b){a.linkPoints();a.shouldBeDrawn()?(a.graphic||this.renderItem(a),a.redraw(t(b,!0)&&a.graphic.placed),a.points.length&&this.adjustVisibility(a)):this.destroyItem(a)};h.prototype.adjustVisibility=function(a){var b=!1,d=a.graphic;a.points.forEach(function(a){!1!==a.series.visible&&!1!==a.visible&&(b=
@@ -196,6 +196,6 @@ a,g,b,b.linkedParent&&b.linkedParent.options.id);h.volumeSeriesID&&this.indicato
 n,c)}else"params.volumeSeriesID"===m||p(c)||l.call(f,m,d,e,{value:c,type:"text"})})},getAmount:function(){var a=0;this.series.forEach(function(b){var c=b.options;(b.params||c&&c.params)&&a++});return a}},tabs:{init:function(a){var b=this.tabs,c=this.indicators.getAmount.call(a);a&&(a=b.addMenuItem.call(this,"add"),b.addMenuItem.call(this,"edit",c),b.addContentItem.call(this,"add"),b.addContentItem.call(this,"edit"),b.switchTabs.call(this,c),b.selectTab.call(this,a,0))},addMenuItem:function(a,b){var c=
 this.popup.container,d="highcharts-tab-item",g=this.lang;0===b&&(d+=" highcharts-tab-disabled");b=f("span",{className:d},void 0,c);b.appendChild(e.createTextNode(g[a+"Button"]||a));b.setAttribute("highcharts-data-tab-type",a);return b},addContentItem:function(){return f("div",{className:"highcharts-tab-item-content highcharts-no-mousewheel"},void 0,this.popup.container)},switchTabs:function(a){var b=this,c;this.popup.container.querySelectorAll(".highcharts-tab-item").forEach(function(e,f){c=e.getAttribute("highcharts-data-tab-type");
 "edit"===c&&0===a||["click","touchstart"].forEach(function(a){d(e,a,function(){b.tabs.deselectAll.call(b);b.tabs.selectTab.call(b,this,f)})})})},selectTab:function(a,b){var c=this.popup.container.querySelectorAll(".highcharts-tab-item-content");a.className+=" highcharts-tab-item-active";c[b].className+=" highcharts-tab-item-show"},deselectAll:function(){var a=this.popup.container,b=a.querySelectorAll(".highcharts-tab-item");a=a.querySelectorAll(".highcharts-tab-item-content");var c;for(c=0;c<b.length;c++)b[c].classList.remove("highcharts-tab-item-active"),
-a[c].classList.remove("highcharts-tab-item-show")}}};d(n,"showPopup",function(a){this.popup||(this.popup=new l.Popup(this.chart.container,this.chart.options.navigation.iconsURL||this.chart.options.stockTools&&this.chart.options.stockTools.gui.iconsURL||"https://code.highcharts.com/10.0.0/gfx/stock-icons/",this.chart));this.popup.showForm(a.formType,this.chart,a.options,a.onSubmit)});d(n,"closePopup",function(){this.popup&&this.popup.closePopup()});return l.Popup});v(c,"masters/modules/annotations-advanced.src.js",
+a[c].classList.remove("highcharts-tab-item-show")}}};d(n,"showPopup",function(a){this.popup||(this.popup=new l.Popup(this.chart.container,this.chart.options.navigation.iconsURL||this.chart.options.stockTools&&this.chart.options.stockTools.gui.iconsURL||"https://code.highcharts.com/10.1.0/gfx/stock-icons/",this.chart));this.popup.showForm(a.formType,this.chart,a.options,a.onSubmit)});d(n,"closePopup",function(){this.popup&&this.popup.closePopup()});return l.Popup});v(c,"masters/modules/annotations-advanced.src.js",
 [],function(){})});
 //# sourceMappingURL=annotations-advanced.js.map