highcharts 9.3.1 → 10.0.0

package/es-modules/Accessibility/Components/SeriesComponent/SeriesKeyboardNavigation.js

@@ -34,12 +34,10 @@ var getPointFromXY = ChartUtilities.getPointFromXY, getSeriesFromName = ChartUti
  *
  * @private
  * @function getPointIndex
- *
  * @param {Highcharts.AccessibilityPoint} point
- *        The point to find index of.
- *
+ * The point to find index of.
  * @return {number|undefined}
- *         The index in the series.points array of the point.
+ * The index in the series.points array of the point.
  */
 function getPointIndex(point) {
     var index = point.index, points = point.series.points;
@@ -57,13 +55,7 @@ function getPointIndex(point) {
 }
 /**
  * Determine if series navigation should be skipped
- *
  * @private
- * @function isSkipSeries
- *
- * @param {Highcharts.Series} series
- *
- * @return {boolean|number|undefined}
  */
 function isSkipSeries(series) {
     var a11yOptions = series.chart.options.accessibility, seriesNavOptions = a11yOptions.keyboardNavigation.seriesNavigation, seriesA11yOptions = series.options.accessibility || {}, seriesKbdNavOptions = seriesA11yOptions.keyboardNavigation;
@@ -79,13 +71,7 @@ function isSkipSeries(series) {
 }
 /**
  * Determine if navigation for a point should be skipped
- *
  * @private
- * @function isSkipPoint
- *
- * @param {Highcharts.Point} point
- *
- * @return {boolean|number|undefined}
  */
 function isSkipPoint(point) {
     var a11yOptions = point.series.chart.options.accessibility;
@@ -98,6 +84,35 @@ function isSkipPoint(point) {
         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
  */
@@ -109,7 +124,7 @@ function highlightLastValidPointInChart(chart) {
         // 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;
         }
@@ -117,22 +132,24 @@ function highlightLastValidPointInChart(chart) {
     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;
 }
 /* *
  *
@@ -168,7 +185,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         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) {
@@ -194,7 +211,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
             // If then navigating with virtual cursor, it is possible to leave
             // keyboard nav module state on the data points and still activate
             // proxy buttons.
-            var focusedElClassName = focusedElement && focusedElement.getAttribute('class');
+            var focusedElClassName = (focusedElement && focusedElement.getAttribute('class'));
             var isProxyFocused = focusedElClassName &&
                 focusedElClassName.indexOf('highcharts-a11y-proxy-button') > -1;
             if (chart.highlightedPoint === point &&
@@ -207,29 +224,27 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         });
     };
     /**
+     * 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, last.seriesName);
         var point;
         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
         }
     };
     /**
-     * @return {Highcharts.KeyboardNavigationHandler}
+     * @private
      */
     SeriesKeyboardNavigation.prototype.getKeyboardNavigationHandler = function () {
         var keyboardNavigation = this, keys = this.keyCodes, chart = this.chart, inverted = chart.inverted;
@@ -267,6 +282,9 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
                 highlightFirstValidPointInChart(chart);
                 return this.response.success;
             },
+            validate: function () {
+                return !!getFirstValidPointInChart(chart);
+            },
             terminate: function () {
                 return keyboardNavigation.onHandlerTerminate();
             }
@@ -313,7 +331,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         if (chart.tooltip) {
             chart.tooltip.hide(0);
         }
-        var hoverSeries = chart.highlightedPoint && chart.highlightedPoint.series;
+        var hoverSeries = (chart.highlightedPoint && chart.highlightedPoint.series);
         if (hoverSeries && hoverSeries.onMouseOut) {
             hoverSeries.onMouseOut();
         }
@@ -325,17 +343,15 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
     /**
      * 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, wrapAround = chart.options.accessibility.keyboardNavigation
             .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'];
         }
@@ -398,7 +414,9 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
      * to highlight in chosen direction).
      */
     function chartHighlightAdjacentPoint(next) {
-        var chart = this, series = chart.series, curPoint = chart.highlightedPoint, curPointIndex = curPoint && getPointIndex(curPoint) || 0, curPoints = curPoint && curPoint.series.points || [], lastSeries = chart.series && chart.series[chart.series.length - 1], lastPoint = lastSeries && lastSeries.points && lastSeries.points[lastSeries.points.length - 1];
+        var chart = this, series = chart.series, curPoint = chart.highlightedPoint, curPointIndex = curPoint && getPointIndex(curPoint) || 0, curPoints = curPoint && curPoint.series.points || [], lastSeries = chart.series && chart.series[chart.series.length - 1], lastPoint = lastSeries &&
+            lastSeries.points &&
+            lastSeries.points[lastSeries.points.length - 1];
         var newSeries, newPoint;
         // If no points, return false
         if (!series[0] || !series[0].points) {
@@ -410,8 +428,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
             newPoint = next ? series[0].points[0] : lastPoint;
         }
         else {
-            // We have a highlighted point.
-            // Grab next/prev point & series
+            // We have a highlighted point. Grab next/prev point & series.
             newSeries = series[curPoint.series.index + (next ? 1 : -1)];
             newPoint = curPoints[curPointIndex + (next ? 1 : -1)];
             if (!newPoint && newSeries) {
@@ -469,7 +486,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
                 if (series.yAxis && series.yAxis.reversed) {
                     yDistance *= -1;
                 }
-                if (yDistance <= 0 && down || yDistance >= 0 && !down || // Chk dir
+                if (yDistance <= 0 && down || yDistance >= 0 && !down ||
                     distance < 5 || // Points in same spot => infinite loop
                     isSkipPoint(point)) {
                     return;
@@ -495,10 +512,11 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         if (!chart.highlightedPoint) {
             newSeries = down ? (chart.series && chart.series[0]) : lastSeries;
             newPoint = down ?
-                (newSeries && newSeries.points && newSeries.points[0]) : lastPoint;
+                (newSeries && newSeries.points && newSeries.points[0]) :
+                lastPoint;
             return newPoint ? newPoint.highlight() : false;
         }
-        newSeries = chart.series[curPoint.series.index + (down ? -1 : 1)];
+        newSeries = (chart.series[curPoint.series.index + (down ? -1 : 1)]);
         if (!newSeries) {
             return false;
         }
@@ -512,7 +530,8 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         if (isSkipSeries(newSeries)) {
             // Skip the series
             newPoint.highlight();
-            adjacentNewPoint = chart.highlightAdjacentSeries(down); // Try recurse
+            // Try recurse
+            adjacentNewPoint = chart.highlightAdjacentSeries(down);
             if (!adjacentNewPoint) {
                 // Recurse failed
                 curPoint.highlight();
@@ -524,7 +543,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         // 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
@@ -534,7 +553,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
             composedClasses.push(ChartClass);
             var chartProto = ChartClass.prototype;
             chartProto.highlightAdjacentPoint = chartHighlightAdjacentPoint;
-            chartProto.highlightAdjacentPointVertical = chartHighlightAdjacentPointVertical;
+            chartProto.highlightAdjacentPointVertical = (chartHighlightAdjacentPointVertical);
             chartProto.highlightAdjacentSeries = chartHighlightAdjacentSeries;
         }
         if (composedClasses.indexOf(PointClass) === -1) {
@@ -561,7 +580,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
                     seriesTypes[type].prototype.keyboardMoveVertical = false;
                 }
             });
-            seriesProto.highlightFirstValidPoint = seriesHighlightFirstValidPoint;
+            seriesProto.highlightNextValidPoint = (seriesHighlightNextValidPoint);
         }
     }
     SeriesKeyboardNavigation.compose = compose;
@@ -595,7 +614,7 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         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
@@ -603,9 +622,10 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
      * @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 {
@@ -620,6 +640,9 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
         // 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;
@@ -630,11 +653,9 @@ var SeriesKeyboardNavigation = /** @class */ (function () {
      * point in the series, use that as starting point.
      *
      * @private
-     * @function Highcharts.Series#highlightFirstValidPoint
-     *
-     * @return {boolean|Highcharts.Point}
+     * @function Highcharts.Series#highlightNextValidPoint
      */
-    function seriesHighlightFirstValidPoint() {
+    function seriesHighlightNextValidPoint() {
         var curPoint = this.chart.highlightedPoint, start = (curPoint && curPoint.series) === this ?
             getPointIndex(curPoint) :
             0, points = this.points, len = points.length;