highcharts 8.1.0 → 8.2.2

package/es-modules/{parts → Extensions}/RangeSelector.js

@@ -8,7 +8,14 @@
  *
  * */
 'use strict';
-import H from './Globals.js';
+import Axis from '../Core/Axis/Axis.js';
+import Chart from '../Core/Chart/Chart.js';
+import H from '../Core/Globals.js';
+import O from '../Core/Options.js';
+var defaultOptions = O.defaultOptions;
+import SVGElement from '../Core/Renderer/SVG/SVGElement.js';
+import U from '../Core/Utilities.js';
+var addEvent = U.addEvent, createElement = U.createElement, css = U.css, defined = U.defined, destroyObjectProperties = U.destroyObjectProperties, discardElement = U.discardElement, extend = U.extend, fireEvent = U.fireEvent, isNumber = U.isNumber, merge = U.merge, objectEach = U.objectEach, pick = U.pick, pInt = U.pInt, splat = U.splat;
 /**
  * Define the time span for the button
  *
@@ -37,11 +44,6 @@ import H from './Globals.js';
  * @return {number}
  *         Parsed JavaScript time value.
  */
-import U from './Utilities.js';
-var addEvent = U.addEvent, createElement = U.createElement, css = U.css, defined = U.defined, destroyObjectProperties = U.destroyObjectProperties, discardElement = U.discardElement, extend = U.extend, fireEvent = U.fireEvent, isNumber = U.isNumber, merge = U.merge, objectEach = U.objectEach, pick = U.pick, pInt = U.pInt, splat = U.splat;
-import './Axis.js';
-import './Chart.js';
-var Axis = H.Axis, Chart = H.Chart, defaultOptions = H.defaultOptions;
 /* ************************************************************************** *
  * Start Range Selector code                                                  *
  * ************************************************************************** */
@@ -348,6 +350,8 @@ extend(defaultOptions, {
         /**
          * A custom callback function to parse values entered in the input boxes
          * and return a valid JavaScript time as milliseconds since 1970.
+         * The first argument passed is a value to parse,
+         * second is a boolean indicating use of the UTC time.
          *
          * @sample {highstock} stock/rangeselector/input-format/
          *         Milliseconds in the range selector
@@ -522,11 +526,20 @@ defaultOptions.lang = merge(defaultOptions.lang,
  * @name Highcharts.RangeSelector
  * @param {Highcharts.Chart} chart
  */
-function RangeSelector(chart) {
-    // Run RangeSelector
-    this.init(chart);
-}
-RangeSelector.prototype = {
+var RangeSelector = /** @class */ (function () {
+    function RangeSelector(chart) {
+        /* *
+         *
+         * Properties
+         *
+         * */
+        this.buttons = void 0;
+        this.buttonOptions = RangeSelector.prototype.defaultButtons;
+        this.options = void 0;
+        this.chart = chart;
+        // Run RangeSelector
+        this.init(chart);
+    }
     /**
      * The method to run when one of the buttons in the range selectors is
      * clicked
@@ -538,7 +551,7 @@ RangeSelector.prototype = {
      * @param {boolean} [redraw]
      * @return {void}
      */
-    clickButton: function (i, redraw) {
+    RangeSelector.prototype.clickButton = function (i, redraw) {
         var rangeSelector = this, chart = rangeSelector.chart, rangeOptions = rangeSelector.buttonOptions[i], baseAxis = chart.xAxis[0], unionExtremes = (chart.scroller && chart.scroller.getUnionExtremes()) || baseAxis || {}, dataMin = unionExtremes.dataMin, dataMax = unionExtremes.dataMax, newMin, newMax = baseAxis && Math.round(Math.min(baseAxis.max, pick(dataMax, baseAxis.max))), // #1568
         type = rangeOptions.type, baseXAxisOptions, range = rangeOptions._range, rangeMin, minSetting, rangeSetting, ctx, ytdExtremes, dataGrouping = rangeOptions.dataGrouping;
         // chart has no data, base series is removed
@@ -615,8 +628,12 @@ RangeSelector.prototype = {
             newMin = dataMin;
             newMax = dataMax;
         }
-        newMin += rangeOptions._offsetMin;
-        newMax += rangeOptions._offsetMax;
+        if (defined(newMin)) {
+            newMin += rangeOptions._offsetMin;
+        }
+        if (defined(newMax)) {
+            newMax += rangeOptions._offsetMax;
+        }
         rangeSelector.setSelected(i);
         // Update the chart
         if (!baseAxis) {
@@ -640,7 +657,7 @@ RangeSelector.prototype = {
                 rangeSelectorButton: rangeOptions
             });
         }
-    },
+    };
     /**
      * Set the selected option. This method only sets the internal flag, it
      * doesn't update the buttons or the actual zoomed range.
@@ -650,35 +667,9 @@ RangeSelector.prototype = {
      * @param {number} [selected]
      * @return {void}
      */
-    setSelected: function (selected) {
+    RangeSelector.prototype.setSelected = function (selected) {
         this.selected = this.options.selected = selected;
-    },
-    /**
-     * The default buttons for pre-selecting time frames
-     */
-    defaultButtons: [{
-            type: 'month',
-            count: 1,
-            text: '1m'
-        }, {
-            type: 'month',
-            count: 3,
-            text: '3m'
-        }, {
-            type: 'month',
-            count: 6,
-            text: '6m'
-        }, {
-            type: 'ytd',
-            text: 'YTD'
-        }, {
-            type: 'year',
-            count: 1,
-            text: '1y'
-        }, {
-            type: 'all',
-            text: 'All'
-        }],
+    };
     /**
      * Initialize the range selector
      *
@@ -687,9 +678,8 @@ RangeSelector.prototype = {
      * @param {Highcharts.Chart} chart
      * @return {void}
      */
-    init: function (chart) {
-        var rangeSelector = this, options = chart.options.rangeSelector, buttonOptions = options.buttons ||
-            [].concat(rangeSelector.defaultButtons), selectedOption = options.selected, blurInputs = function () {
+    RangeSelector.prototype.init = function (chart) {
+        var rangeSelector = this, options = chart.options.rangeSelector, buttonOptions = options.buttons || rangeSelector.defaultButtons.slice(), selectedOption = options.selected, blurInputs = function () {
             var minInput = rangeSelector.minInput, maxInput = rangeSelector.maxInput;
             // #3274 in some case blur is not defined
             if (minInput && minInput.blur) {
@@ -728,7 +718,7 @@ RangeSelector.prototype = {
                 });
             }
         });
-    },
+    };
     /**
      * Dynamically update the range selector buttons after a new range has been
      * set
@@ -737,7 +727,7 @@ RangeSelector.prototype = {
      * @function Highcharts.RangeSelector#updateButtonStates
      * @return {void}
      */
-    updateButtonStates: function () {
+    RangeSelector.prototype.updateButtonStates = function () {
         var rangeSelector = this, chart = this.chart, baseAxis = chart.xAxis[0], actualRange = Math.round(baseAxis.max - baseAxis.min), hasNoData = !baseAxis.hasVisibleSeries, day = 24 * 36e5, // A single day in milliseconds
         unionExtremes = (chart.scroller &&
             chart.scroller.getUnionExtremes()) || baseAxis, dataMin = unionExtremes.dataMin, dataMax = unionExtremes.dataMax, ytdExtremes = rangeSelector.getYTDExtremes(dataMax, dataMin, chart.time.useUTC), ytdMin = ytdExtremes.min, ytdMax = ytdExtremes.max, selected = rangeSelector.selected, selectedExists = isNumber(selected), allButtonsEnabled = rangeSelector.options.allButtonsEnabled, buttons = rangeSelector.buttons;
@@ -802,7 +792,7 @@ RangeSelector.prototype = {
                 }
             }
         });
-    },
+    };
     /**
      * Compute and cache the range for an individual button
      *
@@ -811,7 +801,7 @@ RangeSelector.prototype = {
      * @param {Highcharts.RangeSelectorButtonsOptions} rangeOptions
      * @return {void}
      */
-    computeButtonRange: function (rangeOptions) {
+    RangeSelector.prototype.computeButtonRange = function (rangeOptions) {
         var type = rangeOptions.type, count = rangeOptions.count || 1, 
         // these time intervals have a fixed number of milliseconds, as
         // opposed to month, ytd and year
@@ -837,7 +827,7 @@ RangeSelector.prototype = {
         rangeOptions._offsetMax = pick(rangeOptions.offsetMax, 0);
         rangeOptions._range +=
             rangeOptions._offsetMax - rangeOptions._offsetMin;
-    },
+    };
     /**
      * Set the internal and displayed value of a HTML input for the dates
      *
@@ -847,7 +837,7 @@ RangeSelector.prototype = {
      * @param {number} [inputTime]
      * @return {void}
      */
-    setInputValue: function (name, inputTime) {
+    RangeSelector.prototype.setInputValue = function (name, inputTime) {
         var options = this.chart.options.rangeSelector, time = this.chart.time, input = this[name + 'Input'];
         if (defined(inputTime)) {
             input.previousValue = input.HCTime;
@@ -857,14 +847,14 @@ RangeSelector.prototype = {
         this[name + 'DateBox'].attr({
             text: time.dateFormat(options.inputDateFormat || '%b %e, %Y', input.HCTime)
         });
-    },
+    };
     /**
      * @private
      * @function Highcharts.RangeSelector#showInput
      * @param {string} name
      * @return {void}
      */
-    showInput: function (name) {
+    RangeSelector.prototype.showInput = function (name) {
         var inputGroup = this.inputGroup, dateBox = this[name + 'DateBox'];
         css(this[name + 'Input'], {
             left: (inputGroup.translateX + dateBox.x) + 'px',
@@ -873,21 +863,35 @@ RangeSelector.prototype = {
             height: (dateBox.height - 2) + 'px',
             border: '2px solid silver'
         });
-    },
+    };
     /**
      * @private
      * @function Highcharts.RangeSelector#hideInput
      * @param {string} name
      * @return {void}
      */
-    hideInput: function (name) {
+    RangeSelector.prototype.hideInput = function (name) {
         css(this[name + 'Input'], {
             border: 0,
             width: '1px',
             height: '1px'
         });
         this.setInputValue(name);
-    },
+    };
+    /**
+     * @private
+     * @function Highcharts.RangeSelector#defaultInputDateParser
+     */
+    RangeSelector.prototype.defaultInputDateParser = function (inputDate, useUTC) {
+        var date = new Date();
+        if (H.isSafari) {
+            return Date.parse(inputDate.split(' ').join('T'));
+        }
+        if (useUTC) {
+            return Date.parse(inputDate + 'Z');
+        }
+        return Date.parse(inputDate) - date.getTimezoneOffset() * 60 * 1000;
+    };
     /**
      * Draw either the 'from' or the 'to' HTML input box of the range selector
      *
@@ -896,15 +900,16 @@ RangeSelector.prototype = {
      * @param {string} name
      * @return {void}
      */
-    drawInput: function (name) {
-        var rangeSelector = this, chart = rangeSelector.chart, chartStyle = chart.renderer.style || {}, renderer = chart.renderer, options = chart.options.rangeSelector, lang = defaultOptions.lang, div = rangeSelector.div, isMin = name === 'min', input, label, dateBox, inputGroup = this.inputGroup;
+    RangeSelector.prototype.drawInput = function (name) {
+        var rangeSelector = this, chart = rangeSelector.chart, chartStyle = chart.renderer.style || {}, renderer = chart.renderer, options = chart.options.rangeSelector, lang = defaultOptions.lang, div = rangeSelector.div, isMin = name === 'min', input, label, dateBox, inputGroup = this.inputGroup, defaultInputDateParser = this.defaultInputDateParser;
         /**
          * @private
          */
         function updateExtremes() {
-            var inputValue = input.value, value = (options.inputDateParser || Date.parse)(inputValue), chartAxis = chart.xAxis[0], dataAxis = chart.scroller && chart.scroller.xAxis ?
+            var inputValue = input.value, value, chartAxis = chart.xAxis[0], dataAxis = chart.scroller && chart.scroller.xAxis ?
                 chart.scroller.xAxis :
                 chartAxis, dataMin = dataAxis.dataMin, dataMax = dataAxis.dataMax;
+            value = (options.inputDateParser || defaultInputDateParser)(inputValue, chart.time.useUTC);
             if (value !== input.previousValue) {
                 input.previousValue = value;
                 // If the value isn't parsed directly to a value by the
@@ -1030,7 +1035,7 @@ RangeSelector.prototype = {
                 updateExtremes();
             }
         };
-    },
+    };
     /**
      * Get the position of the range selector buttons and inputs. This can be
      * overridden from outside for custom positioning.
@@ -1040,7 +1045,7 @@ RangeSelector.prototype = {
      *
      * @return {Highcharts.Dictionary<number>}
      */
-    getPosition: function () {
+    RangeSelector.prototype.getPosition = function () {
         var chart = this.chart, options = chart.options.rangeSelector, top = options.verticalAlign === 'top' ?
             chart.plotTop - chart.axisOffset[0] :
             0; // set offset only for varticalAlign top
@@ -1048,7 +1053,7 @@ RangeSelector.prototype = {
             buttonTop: top + options.buttonPosition.y,
             inputTop: top + options.inputPosition.y - 10
         };
-    },
+    };
     /**
      * Get the extremes of YTD. Will choose dataMax if its value is lower than
      * the current timestamp. Will choose dataMin if its value is higher than
@@ -1064,7 +1069,7 @@ RangeSelector.prototype = {
      * @return {*}
      *         Returns min and max for the YTD
      */
-    getYTDExtremes: function (dataMax, dataMin, useUTC) {
+    RangeSelector.prototype.getYTDExtremes = function (dataMax, dataMin, useUTC) {
         var time = this.chart.time, min, now = new time.Date(dataMax), year = time.get('FullYear', now), startOfYear = useUTC ?
             time.Date.UTC(year, 0, 1) : // eslint-disable-line new-cap
             +new time.Date(year, 0, 1);
@@ -1074,7 +1079,7 @@ RangeSelector.prototype = {
             max: Math.min(dataMax || now, now),
             min: min
         };
-    },
+    };
     /**
      * Render the range selector including the buttons and the inputs. The first
      * time render is called, the elements are created and positioned. On
@@ -1088,7 +1093,7 @@ RangeSelector.prototype = {
      *        X axis maximum
      * @return {void}
      */
-    render: function (min, max) {
+    RangeSelector.prototype.render = function (min, max) {
         var rangeSelector = this, chart = rangeSelector.chart, renderer = chart.renderer, container = chart.container, chartOptions = chart.options, navButtonOptions = (chartOptions.exporting &&
             chartOptions.exporting.enabled !== false &&
             chartOptions.navigation &&
@@ -1319,7 +1324,7 @@ RangeSelector.prototype = {
                 rangeSelector.group.translateY + 'px';
         }
         rangeSelector.rendered = true;
-    },
+    };
     /**
      * Extracts height of range selector
      *
@@ -1328,7 +1333,7 @@ RangeSelector.prototype = {
      * @return {number}
      *         Returns rangeSelector height
      */
-    getHeight: function () {
+    RangeSelector.prototype.getHeight = function () {
         var rangeSelector = this, options = rangeSelector.options, rangeSelectorGroup = rangeSelector.group, inputPosition = options.inputPosition, buttonPosition = options.buttonPosition, yPosition = options.y, buttonPositionY = buttonPosition.y, inputPositionY = inputPosition.y, rangeSelectorHeight = 0, minPosition;
         if (options.height) {
             return options.height;
@@ -1344,7 +1349,7 @@ RangeSelector.prototype = {
             rangeSelectorHeight += Math.abs(minPosition);
         }
         return rangeSelectorHeight;
-    },
+    };
     /**
      * Detect collision with title or subtitle
      *
@@ -1356,10 +1361,10 @@ RangeSelector.prototype = {
      * @return {boolean}
      *         Returns collision status
      */
-    titleCollision: function (chart) {
+    RangeSelector.prototype.titleCollision = function (chart) {
         return !(chart.options.title.text ||
             chart.options.subtitle.text);
-    },
+    };
     /**
      * Update the range selector with new options
      *
@@ -1368,20 +1373,20 @@ RangeSelector.prototype = {
      * @param {Highcharts.RangeSelectorOptions} options
      * @return {void}
      */
-    update: function (options) {
+    RangeSelector.prototype.update = function (options) {
         var chart = this.chart;
         merge(true, chart.options.rangeSelector, options);
         this.destroy();
         this.init(chart);
         chart.rangeSelector.render();
-    },
+    };
     /**
      * Destroys allocated elements.
      *
      * @private
      * @function Highcharts.RangeSelector#destroy
      */
-    destroy: function () {
+    RangeSelector.prototype.destroy = function () {
         var rSelector = this, minInput = rSelector.minInput, maxInput = rSelector.maxInput;
         rSelector.unMouseDown();
         rSelector.unResize();
@@ -1397,21 +1402,48 @@ RangeSelector.prototype = {
         // Destroy HTML and SVG elements
         objectEach(rSelector, function (val, key) {
             if (val && key !== 'chart') {
-                if (val.destroy) {
+                if (val instanceof SVGElement) {
                     // SVGElement
                     val.destroy();
                 }
-                else if (val.nodeType) {
+                else if (val instanceof window.HTMLElement) {
                     // HTML element
-                    discardElement(this[key]);
+                    discardElement(val);
                 }
             }
             if (val !== RangeSelector.prototype[key]) {
                 rSelector[key] = null;
             }
         }, this);
-    }
-};
+    };
+    return RangeSelector;
+}());
+/**
+ * The default buttons for pre-selecting time frames
+ */
+RangeSelector.prototype.defaultButtons = [{
+        type: 'month',
+        count: 1,
+        text: '1m'
+    }, {
+        type: 'month',
+        count: 3,
+        text: '3m'
+    }, {
+        type: 'month',
+        count: 6,
+        text: '6m'
+    }, {
+        type: 'ytd',
+        text: 'YTD'
+    }, {
+        type: 'year',
+        count: 1,
+        text: '1y'
+    }, {
+        type: 'all',
+        text: 'All'
+    }];
 /**
  * Get the axis min value based on the range option and the current max. For
  * stock charts this is extended via the {@link RangeSelector} so that if the
@@ -1595,3 +1627,4 @@ if (!H.RangeSelector) {
     });
     H.RangeSelector = RangeSelector;
 }
+export default H.RangeSelector;

package/es-modules/{parts → Extensions}/ScrollablePlotArea.js

@@ -17,10 +17,12 @@ WIP on vertical scrollable plot area (#9378). To do:
 - API and demos
  */
 'use strict';
-import H from './Globals.js';
-import U from './Utilities.js';
-var addEvent = U.addEvent, createElement = U.createElement, pick = U.pick, stop = U.stop;
-var Chart = H.Chart;
+import A from '../Core/Animation/AnimationUtilities.js';
+var stop = A.stop;
+import Chart from '../Core/Chart/Chart.js';
+import H from '../Core/Globals.js';
+import U from '../Core/Utilities.js';
+var addEvent = U.addEvent, createElement = U.createElement, pick = U.pick;
 /**
  * Options for a scrollable plot area. This feature provides a minimum size for
  * the plot area of the chart. If the size gets smaller than this, typically
@@ -183,10 +185,17 @@ Chart.prototype.setUpScrolling = function () {
     if (this.scrollablePixelsY) {
         attribs.overflowY = 'auto';
     }
+    // Insert a container with position relative
+    // that scrolling and fixed container renders to (#10555)
+    this.scrollingParent = createElement('div', {
+        className: 'highcharts-scrolling-parent'
+    }, {
+        position: 'relative'
+    }, this.renderTo);
     // Add the necessary divs to provide scrolling
     this.scrollingContainer = createElement('div', {
         'className': 'highcharts-scrolling'
-    }, attribs, this.renderTo);
+    }, attribs, this.scrollingParent);
     // On scroll, reset the chart position because it applies to the scrolled
     // container
     addEvent(this.scrollingContainer, 'scroll', function () {
@@ -250,7 +259,7 @@ Chart.prototype.moveFixedElements = function () {
  * @return {void}
  */
 Chart.prototype.applyFixed = function () {
-    var _a;
+    var _a, _b;
     var fixedRenderer, scrollableWidth, scrollableHeight, firstTime = !this.fixedDiv, scrollableOptions = this.options.chart.scrollablePlotArea;
     // First render
     if (firstTime) {
@@ -260,11 +269,12 @@ Chart.prototype.applyFixed = function () {
             position: 'absolute',
             overflow: 'hidden',
             pointerEvents: 'none',
-            zIndex: 2
+            zIndex: 2,
+            top: 0
         }, null, true);
-        this.renderTo.insertBefore(this.fixedDiv, this.renderTo.firstChild);
+        (_a = this.scrollingContainer) === null || _a === void 0 ? void 0 : _a.parentNode.insertBefore(this.fixedDiv, this.scrollingContainer);
         this.renderTo.style.overflow = 'visible';
-        this.fixedRenderer = fixedRenderer = new H.Renderer(this.fixedDiv, this.chartWidth, this.chartHeight, (_a = this.options.chart) === null || _a === void 0 ? void 0 : _a.style);
+        this.fixedRenderer = fixedRenderer = new H.Renderer(this.fixedDiv, this.chartWidth, this.chartHeight, (_b = this.options.chart) === null || _b === void 0 ? void 0 : _b.style);
         // Mask
         this.scrollableMask = fixedRenderer
             .path()

package/es-modules/{modules/series-label.src.js → Extensions/SeriesLabel.js}

@@ -7,8 +7,13 @@
  *  !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  *
  * */
-'use strict';
-import H from '../parts/Globals.js';
+import A from '../Core/Animation/AnimationUtilities.js';
+var animObject = A.animObject;
+import Chart from '../Core/Chart/Chart.js';
+import H from '../Core/Globals.js';
+import SVGRenderer from '../Core/Renderer/SVG/SVGRenderer.js';
+import U from '../Core/Utilities.js';
+var addEvent = U.addEvent, extend = U.extend, fireEvent = U.fireEvent, format = U.format, isNumber = U.isNumber, pick = U.pick, setOptions = U.setOptions, syncTimeout = U.syncTimeout;
 /**
  * Containing the position of a box that should be avoided by labels.
  *
@@ -39,12 +44,10 @@ import H from '../parts/Globals.js';
  * https://jsfiddle.net/highcharts/264Nm/
  * https://jsfiddle.net/highcharts/y5A37/
  */
-import U from '../parts/Utilities.js';
-var addEvent = U.addEvent, animObject = U.animObject, extend = U.extend, fireEvent = U.fireEvent, format = U.format, isNumber = U.isNumber, pick = U.pick, syncTimeout = U.syncTimeout;
-import '../parts/Chart.js';
-import '../parts/Series.js';
-var labelDistance = 3, Series = H.Series, SVGRenderer = H.SVGRenderer, Chart = H.Chart;
-H.setOptions({
+''; // detach doclets above
+import '../Series/LineSeries.js';
+var labelDistance = 3, Series = H.Series;
+setOptions({
     /**
      * @optionparent plotOptions
      *
@@ -529,7 +532,7 @@ Chart.prototype.drawSeriesLabels = function () {
                     .label(labelText, 0, -9999, 'connector')
                     .addClass('highcharts-series-label ' +
                     'highcharts-series-label-' + series.index + ' ' +
-                    (series.options.className || '') +
+                    (series.options.className || '') + ' ' +
                     colorClass);
                 if (!chart.renderer.styledMode) {
                     label.css(extend({
@@ -634,7 +637,8 @@ Chart.prototype.drawSeriesLabels = function () {
                     bottom: best.y + bBox.height
                 });
                 // Move it if needed
-                var dist = Math.sqrt(Math.pow(Math.abs(best.x - label.x), 2), Math.pow(Math.abs(best.y - label.y), 2));
+                var dist = Math.sqrt(Math.pow(Math.abs(best.x - (label.x || 0)), 2) +
+                    Math.pow(Math.abs(best.y - (label.y || 0)), 2));
                 if (dist && series.labelBySeries) {
                     // Move fast and fade in - pure animation movement is
                     // distractive...