initial commit

public/js_lib/Highcharts/code/es-modules/annotations/ControlPoint.js

@@ -0,0 +1,130 @@
+import H from './../parts/Globals.js';
+import './../parts/Utilities.js';
+import eventEmitterMixin from './eventEmitterMixin.js';
+
+/**
+ * A control point class which is a connection between controllable
+ * transform methods and a user actions.
+ *
+ * @constructor
+ * @mixes eventEmitterMixin
+ * @memberOf Annotation
+ *
+ * @param {Highcharts.Chart} chart a chart instance
+ * @param {Object} target a controllable instance which is a target for
+ *        a control point
+ * @param {Annotation.ControlPoint.Options} options an options object
+ * @param {number} [index]
+ **/
+function ControlPoint(chart, target, options, index) {
+    this.chart = chart;
+    this.target = target;
+    this.options = options;
+    this.index = H.pick(options.index, index);
+}
+
+/**
+ * @typedef {Object} Annotation.ControlPoint.Position
+ * @property {number} x
+ * @property {number} y
+ */
+
+/**
+ * @callback Annotation.ControlPoint.Positioner
+ * @param {Object} e event
+ * @param {Controllable} target
+ * @return {Annotation.ControlPoint.Position} position
+ */
+
+/**
+ * @typedef {Object} Annotation.ControlPoint.Options
+ * @property {string} symbol
+ * @property {number} width
+ * @property {number} height
+ * @property {Object} style
+ * @property {boolean} visible
+ * @property {Annotation.ControlPoint.Positioner} positioner
+ * @property {Object} events
+ */
+
+H.extend(
+    ControlPoint.prototype,
+    eventEmitterMixin
+);
+
+/**
+ * Set the visibility.
+ *
+ * @param {boolean} [visible]
+ **/
+ControlPoint.prototype.setVisibility = function (visible) {
+    this.graphic.attr('visibility', visible ? 'visible' : 'hidden');
+
+    this.options.visible = visible;
+};
+
+/**
+ * Render the control point.
+ */
+ControlPoint.prototype.render = function () {
+    var chart = this.chart,
+        options = this.options;
+
+    this.graphic = chart.renderer
+        .symbol(
+            options.symbol,
+            0,
+            0,
+            options.width,
+            options.height
+        )
+        .add(chart.controlPointsGroup)
+        .css(options.style);
+
+    this.setVisibility(options.visible);
+    this.addEvents();
+};
+
+/**
+ * Redraw the control point.
+ *
+ * @param {boolean} [animation]
+ */
+ControlPoint.prototype.redraw = function (animation) {
+    this.graphic[animation ? 'animate' : 'attr'](
+        this.options.positioner.call(this, this.target)
+    );
+};
+
+
+/**
+ * Destroy the control point.
+ */
+ControlPoint.prototype.destroy = function () {
+    eventEmitterMixin.destroy.call(this);
+
+    if (this.graphic) {
+        this.graphic = this.graphic.destroy();
+    }
+
+    this.chart = null;
+    this.target = null;
+    this.options = null;
+};
+
+/**
+ * Update the control point.
+ */
+ControlPoint.prototype.update = function (userOptions) {
+    var chart = this.chart,
+        target = this.target,
+        index = this.index,
+        options = H.merge(true, this.options, userOptions);
+
+    this.destroy();
+    this.constructor(chart, target, options, index);
+    this.render(chart.controlPointsGroup);
+    this.redraw();
+};
+
+export default ControlPoint;

public/js_lib/Highcharts/code/es-modules/annotations/MockPoint.js

@@ -0,0 +1,415 @@
+import H from '../parts/Globals.js';
+import '../parts/Axis.js';
+import '../parts/Series.js';
+
+/**
+ * A point-like object, a mock point or a point uses in series.
+ *
+ * @typedef {Highcharts.Point | Annotation.MockPoint} Annotation.PointLike
+ */
+
+/**
+ * A mock point configuration.
+ *
+ * @typedef {Object} Annotation.MockPoint.Options
+ * @property {number} x x value for the point in xAxis scale or pixels
+ * @property {number} y y value for the point in yAxis scale or pixels
+ * @property {string|number|Highcharts.Axis} [xAxis] xAxis instance, index or id
+ * @property {string|number|Highcharts.Axis} [yAxis] yAxis instance, index or id
+ */
+
+/**
+ * A trimmed point object which imitates {@link Highchart.Point} class.
+ * It is created when there is a need of pointing to some chart's position
+ * using axis values or pixel values
+ *
+ * @class
+ * @memberOf Annotation
+ *
+ * @param {Chart} chart a chart instance
+ * @param {Controllable} [target] a controllable instance
+ * @param {Annotation.MockPoint.Options} options an options object
+ */
+function MockPoint(chart, target, options) {
+    /**
+     * A mock series instance imitating a real series from a real point.
+     *
+     * @type {Object}
+     * @property {boolean} series.visible=true - whether a series is visible
+     * @property {Chart} series.chart - a chart instance
+     * @property {function} series.getPlotBox
+     */
+    this.series = {
+        visible: true,
+        chart: chart,
+        getPlotBox: H.Series.prototype.getPlotBox
+    };
+
+    /**
+     * @type {?Controllable}
+     */
+    this.target = target || null;
+
+    /**
+     * Options for the mock point.
+     *
+     * @type {Annotation.MockPoint.Options}
+     */
+    this.options = options;
+
+    /**
+     * If an xAxis is set it represents the point's value in terms of the xAxis.
+     *
+     * @name Annotation.MockPoint#x
+     * @type {?number}
+     */
+
+    /**
+     * If an yAxis is set it represents the point's value in terms of the yAxis.
+     *
+     * @name Annotation.MockPoint#y
+     * @type {?number}
+     */
+
+    /**
+     * It represents the point's pixel x coordinate relative to its plot box.
+     *
+     * @name Annotation.MockPoint#plotX
+     * @type {?number}
+     */
+
+    /**
+     * It represents the point's pixel y position relative to its plot box.
+     *
+     * @name Annotation.MockPoint#plotY
+     * @type {?number}
+     */
+
+    /**
+     * Whether the point is inside the plot box.
+     *
+     * @name Annotation.MockPoint#isInside
+     * @type {boolean}
+     */
+
+    this.applyOptions(this.getOptions());
+}
+
+/**
+ * Create a mock point from a real Highcharts point.
+ *
+ * @param {Point} point
+ *
+ * @return {Annotation.MockPoint} a mock point instance.
+ */
+MockPoint.fromPoint = function (point) {
+    return new MockPoint(point.series.chart, null, {
+        x: point.x,
+        y: point.y,
+        xAxis: point.series.xAxis,
+        yAxis: point.series.yAxis
+    });
+};
+
+/**
+ * @typedef Annotation.MockPoint.Position
+ * @property {number} x
+ * @property {number} y
+ */
+
+/**
+ * Get the pixel position from the point like object.
+ *
+ * @param {Annotation.PointLike} point
+ * @param {boolean} [paneCoordinates]
+ *        whether the pixel position should be relative
+ *
+ * @return {Annotation.MockPoint.Position} pixel position
+ */
+MockPoint.pointToPixels = function (point, paneCoordinates) {
+    var series = point.series,
+        chart = series.chart,
+        x = point.plotX,
+        y = point.plotY,
+        plotBox;
+
+    if (chart.inverted) {
+        if (point.mock) {
+            x = point.plotY;
+            y = point.plotX;
+        } else {
+            x = chart.plotWidth - point.plotY;
+            y = chart.plotHeight - point.plotX;
+        }
+    }
+
+    if (series && !paneCoordinates) {
+        plotBox = series.getPlotBox();
+        x += plotBox.translateX;
+        y += plotBox.translateY;
+    }
+
+    return {
+        x: x,
+        y: y
+    };
+};
+
+/**
+ * Get fresh mock point options from the point like object.
+ *
+ * @param {Annotation.PointLike} point
+ *
+ * @return {Annotation.MockPoint.Options} mock point's options
+ */
+MockPoint.pointToOptions = function (point) {
+    return {
+        x: point.x,
+        y: point.y,
+        xAxis: point.series.xAxis,
+        yAxis: point.series.yAxis
+    };
+};
+
+H.extend(MockPoint.prototype, /** @lends Annotation.MockPoint# */ {
+    /**
+     * A flag indicating that a point is not the real one.
+     *
+     * @type {boolean}
+     * @default true
+     */
+    mock: true,
+
+    /**
+     * Check if the point has dynamic options.
+     *
+     * @return {boolean} A positive flag if the point has dynamic options.
+     */
+    hasDynamicOptions: function () {
+        return typeof this.options === 'function';
+    },
+
+    /**
+     * Get the point's options.
+     *
+     * @return {Annotation.MockPoint.Options} the mock point's options.
+     */
+    getOptions: function () {
+        return this.hasDynamicOptions() ?
+            this.options(this.target) :
+            this.options;
+    },
+
+    /**
+     * Apply options for the point.
+     *
+     * @param {Annotation.MockPoint.Options} options
+     */
+    applyOptions: function (options) {
+        this.command = options.command;
+
+        this.setAxis(options, 'x');
+        this.setAxis(options, 'y');
+
+        this.refresh();
+    },
+
+    /**
+     * Set x or y axis.
+     *
+     * @param {Annotation.MockPoint.Options} options
+     * @param {string} xOrY 'x' or 'y' string literal
+     */
+    setAxis: function (options, xOrY) {
+        var axisName = xOrY + 'Axis',
+            axisOptions = options[axisName],
+            chart = this.series.chart;
+
+        this.series[axisName] =
+            axisOptions instanceof H.Axis ?
+                axisOptions :
+                H.defined(axisOptions) ?
+                    chart[axisName][axisOptions] || chart.get(axisOptions) :
+                    null;
+    },
+
+    /**
+     * Transform the mock point to an anchor
+     * (relative position on the chart).
+     *
+     * @return {Array<number>} A quadruple of numbers which denotes x, y,
+     * width and height of the box
+     **/
+    toAnchor: function () {
+        var anchor = [this.plotX, this.plotY, 0, 0];
+
+        if (this.series.chart.inverted) {
+            anchor[0] = this.plotY;
+            anchor[1] = this.plotX;
+        }
+
+        return anchor;
+    },
+
+    /**
+     * @typedef {Object} Annotation.MockPoint.LabelConfig
+     * @property {number|undefined} x x value translated to x axis scale
+     * @property {number|undefined} y y value translated to y axis scale
+     * @property {Annotation.MockPoint} point instance of the point
+     */
+
+    /**
+     * Returns a label config object -
+     * the same as Highcharts.Point.prototype.getLabelConfig
+     *
+     * @return {Annotation.MockPoint.LabelConfig} the point's label config
+     */
+    getLabelConfig: function () {
+        return {
+            x: this.x,
+            y: this.y,
+            point: this
+        };
+    },
+
+    /**
+     * Check if the point is inside its pane.
+     *
+     * @return {boolean} A flag indicating whether the point is inside the pane.
+     */
+    isInsidePane: function () {
+        var plotX = this.plotX,
+            plotY = this.plotY,
+            xAxis = this.series.xAxis,
+            yAxis = this.series.yAxis,
+            isInside = true;
+
+        if (xAxis) {
+            isInside = H.defined(plotX) && plotX >= 0 && plotX <= xAxis.len;
+        }
+
+        if (yAxis) {
+            isInside =
+                isInside &&
+                H.defined(plotY) &&
+                plotY >= 0 && plotY <= yAxis.len;
+        }
+
+        return isInside;
+    },
+
+    /**
+     * Refresh point values and coordinates based on its options.
+     */
+    refresh: function () {
+        var series = this.series,
+            xAxis = series.xAxis,
+            yAxis = series.yAxis,
+            options = this.getOptions();
+
+        if (xAxis) {
+            this.x = options.x;
+            this.plotX = xAxis.toPixels(options.x, true);
+        } else {
+            this.x = null;
+            this.plotX = options.x;
+        }
+
+        if (yAxis) {
+            this.y = options.y;
+            this.plotY = yAxis.toPixels(options.y, true);
+        } else {
+            this.y = null;
+            this.plotY = options.y;
+        }
+
+        this.isInside = this.isInsidePane();
+    },
+
+    /**
+     * Translate the point.
+     *
+     * @param {number} [cx] origin x transformation
+     * @param {number} [cy] origin y transformation
+     * @param {number} dx translation for x coordinate
+     * @param {number} dy translation for y coordinate
+     **/
+    translate: function (cx, cy, dx, dy) {
+        if (!this.hasDynamicOptions()) {
+            this.plotX += dx;
+            this.plotY += dy;
+
+            this.refreshOptions();
+        }
+    },
+
+    /**
+     * Scale the point.
+     *
+     * @param {number} cx origin x transformation
+     * @param {number} cy origin y transformation
+     * @param {number} sx scale factor x
+     * @param {number} sy scale factor y
+     */
+    scale: function (cx, cy, sx, sy) {
+        if (!this.hasDynamicOptions()) {
+            var x = this.plotX * sx,
+                y = this.plotY * sy,
+                tx = (1 - sx) * cx,
+                ty = (1 - sy) * cy;
+
+            this.plotX = tx + x;
+            this.plotY = ty + y;
+
+            this.refreshOptions();
+        }
+    },
+
+    /**
+     * Rotate the point.
+     *
+     * @param {number} cx origin x rotation
+     * @param {number} cy origin y rotation
+     * @param {number} radians
+     */
+    rotate: function (cx, cy, radians) {
+        if (!this.hasDynamicOptions()) {
+            var cos = Math.cos(radians),
+                sin = Math.sin(radians),
+                x = this.plotX,
+                y = this.plotY,
+                tx,
+                ty;
+
+            x -= cx;
+            y -= cy;
+
+            tx = x * cos - y * sin;
+            ty = x * sin + y * cos;
+
+            this.plotX = tx + cx;
+            this.plotY = ty + cy;
+
+            this.refreshOptions();
+        }
+    },
+
+    /**
+     * Refresh point options based on its plot coordinates.
+     */
+    refreshOptions: function () {
+        var series = this.series,
+            xAxis = series.xAxis,
+            yAxis = series.yAxis;
+
+        this.x = this.options.x = xAxis ?
+            this.options.x = xAxis.toValue(this.plotX, true) :
+            this.plotX;
+
+        this.y = this.options.y = yAxis ?
+            yAxis.toValue(this.plotY, true) :
+            this.plotY;
+    }
+});
+
+export default MockPoint;

public/js_lib/Highcharts/code/es-modules/annotations/controllable/ControllableCircle.js

@@ -0,0 +1,92 @@
+'use strict';
+import H from './../../parts/Globals.js';
+import './../../parts/Utilities.js';
+import controllableMixin from './controllableMixin.js';
+import ControllablePath from './ControllablePath.js';
+
+/**
+ * A controllable circle class.
+ *
+ * @constructor
+ * @mixes Annotation.controllableMixin
+ * @memberOf Annotation
+ *
+ * @param {Highcharts.Annotation} annotation an annotation instance
+ * @param {Object} options a shape's options
+ * @param {number} index of the circle
+ **/
+function ControllableCircle(annotation, options, index) {
+    this.init(annotation, options, index);
+    this.collection = 'shapes';
+}
+
+/**
+ * A map object which allows to map options attributes to element attributes.
+ */
+ControllableCircle.attrsMap = H.merge(ControllablePath.attrsMap, {
+    r: 'r'
+});
+
+H.merge(
+    true,
+    ControllableCircle.prototype,
+    controllableMixin, /** @lends Annotation.ControllableCircle# */ {
+        /**
+         * @type 'circle'
+         */
+        type: 'circle',
+
+        render: function (parent) {
+            var attrs = this.attrsFromOptions(this.options);
+
+            this.graphic = this.annotation.chart.renderer
+                .circle(0, -9e9, 0)
+                .attr(attrs)
+                .add(parent);
+
+            controllableMixin.render.call(this);
+        },
+
+        redraw: function (animation) {
+            var position = this.anchor(this.points[0]).absolutePosition;
+
+            if (position) {
+                this.graphic[animation ? 'animate' : 'attr']({
+                    x: position.x,
+                    y: position.y,
+                    r: this.options.r
+                });
+            } else {
+                this.graphic.attr({
+                    x: 0,
+                    y: -9e9
+                });
+            }
+
+            this.graphic.placed = Boolean(position);
+
+            controllableMixin.redraw.call(this, animation);
+        },
+
+        translate: function (dx, dy) {
+            var annotationOptions = this.annotation.userOptions,
+                shapeOptions = annotationOptions[this.collection][this.index];
+
+            this.translatePoint(dx, dy, 0);
+
+            // Options stored in chart:
+            shapeOptions.point = this.options.point;
+        },
+
+        /**
+         * Set the radius.
+         *
+         * @param {number} r a radius to be set
+         */
+        setRadius: function (r) {
+            this.options.r = r;
+        }
+    }
+);
+
+export default ControllableCircle;

public/js_lib/Highcharts/code/es-modules/annotations/controllable/ControllableImage.js

@@ -0,0 +1,101 @@
+'use strict';
+import H from './../../parts/Globals.js';
+import './../../parts/Utilities.js';
+import controllableMixin from './controllableMixin.js';
+import ControllableLabel from './ControllableLabel.js';
+
+/**
+ * A controllable image class.
+ *
+ * @class
+ * @mixes Annotation.controllableMixin
+ * @memberOf Annotation
+ *
+ * @param {Highcharts.Annotation} annotation - an annotation instance
+ * @param {Object} options a controllable's options
+ * @param {number} index of the image
+ **/
+function ControllableImage(annotation, options, index) {
+    this.init(annotation, options, index);
+    this.collection = 'shapes';
+}
+
+/**
+ * @typedef {Object} Annotation.ControllableImage.AttrsMap
+ * @property {string} width=width
+ * @property {string} height=height
+ * @property {string} zIndex=zIndex
+ */
+
+/**
+ * A map object which allows to map options attributes to element attributes
+ *
+ * @type {Annotation.ControllableImage.AttrsMap}
+ */
+ControllableImage.attrsMap = {
+    width: 'width',
+    height: 'height',
+    zIndex: 'zIndex'
+};
+
+H.merge(
+    true,
+    ControllableImage.prototype,
+    controllableMixin, /** @lends Annotation.ControllableImage# */ {
+        /**
+         * @type 'image'
+         */
+        type: 'image',
+
+        render: function (parent) {
+            var attrs = this.attrsFromOptions(this.options),
+                options = this.options;
+
+            this.graphic = this.annotation.chart.renderer
+                .image(options.src, 0, -9e9, options.width, options.height)
+                .attr(attrs)
+                .add(parent);
+
+            this.graphic.width = options.width;
+            this.graphic.height = options.height;
+
+            controllableMixin.render.call(this);
+        },
+
+        redraw: function (animation) {
+            var anchor = this.anchor(this.points[0]),
+                position = ControllableLabel.prototype.position.call(
+                    this,
+                    anchor
+                );
+
+            if (position) {
+                this.graphic[animation ? 'animate' : 'attr']({
+                    x: position.x,
+                    y: position.y
+                });
+            } else {
+                this.graphic.attr({
+                    x: 0,
+                    y: -9e9
+                });
+            }
+
+            this.graphic.placed = Boolean(position);
+
+            controllableMixin.redraw.call(this, animation);
+        },
+
+        translate: function (dx, dy) {
+            var annotationOptions = this.annotation.userOptions,
+                shapeOptions = annotationOptions[this.collection][this.index];
+
+            this.translatePoint(dx, dy, 0);
+
+            // Options stored in chart:
+            shapeOptions.point = this.options.point;
+        }
+    }
+);
+
+export default ControllableImage;

public/js_lib/Highcharts/code/es-modules/annotations/controllable/ControllableLabel.js

@@ -0,0 +1,452 @@
+'use strict';
+import H from './../../parts/Globals.js';
+import './../../parts/Utilities.js';
+import './../../parts/SvgRenderer.js';
+import controllableMixin from './controllableMixin.js';
+import MockPoint from './../MockPoint.js';
+
+/**
+ * A controllable label class.
+ *
+ * @class
+ * @mixes Annotation.controllableMixin
+ * @memberOf Annotation
+ *
+ * @param {Highcharts.Annotation} annotation an annotation instance
+ * @param {Object} options a label's options
+ * @param {number} index of the label
+ **/
+function ControllableLabel(annotation, options, index) {
+    this.init(annotation, options, index);
+    this.collection = 'labels';
+}
+
+/**
+ * Shapes which do not have background - the object is used for proper
+ * setting of the contrast color.
+ *
+ * @type {Array<String>}
+ */
+ControllableLabel.shapesWithoutBackground = ['connector'];
+
+/**
+ * Returns new aligned position based alignment options and box to align to.
+ * It is almost a one-to-one copy from SVGElement.prototype.align
+ * except it does not use and mutate an element
+ *
+ * @param {Object} alignOptions
+ * @param {Object} box
+ * @return {Annotation.controllableMixin.Position} aligned position
+ */
+ControllableLabel.alignedPosition = function (alignOptions, box) {
+    var align = alignOptions.align,
+        vAlign = alignOptions.verticalAlign,
+        x = (box.x || 0) + (alignOptions.x || 0),
+        y = (box.y || 0) + (alignOptions.y || 0),
+
+        alignFactor,
+        vAlignFactor;
+
+    if (align === 'right') {
+        alignFactor = 1;
+    } else if (align === 'center') {
+        alignFactor = 2;
+    }
+    if (alignFactor) {
+        x += (box.width - (alignOptions.width || 0)) / alignFactor;
+    }
+
+    if (vAlign === 'bottom') {
+        vAlignFactor = 1;
+    } else if (vAlign === 'middle') {
+        vAlignFactor = 2;
+    }
+    if (vAlignFactor) {
+        y += (box.height - (alignOptions.height || 0)) / vAlignFactor;
+    }
+
+    return {
+        x: Math.round(x),
+        y: Math.round(y)
+    };
+};
+
+/**
+ * Returns new alignment options for a label if the label is outside the
+ * plot area. It is almost a one-to-one copy from
+ * Series.prototype.justifyDataLabel except it does not mutate the label and
+ * it works with absolute instead of relative position.
+ *
+ * @param {Object} label
+ * @param {Object} alignOptions
+ * @param {Object} alignAttr
+ * @return {Object} justified options
+ **/
+ControllableLabel.justifiedOptions = function (
+    chart,
+    label,
+    alignOptions,
+    alignAttr
+) {
+    var align = alignOptions.align,
+        verticalAlign = alignOptions.verticalAlign,
+        padding = label.box ? 0 : (label.padding || 0),
+        bBox = label.getBBox(),
+        off,
+
+        options = {
+            align: align,
+            verticalAlign: verticalAlign,
+            x: alignOptions.x,
+            y: alignOptions.y,
+            width: label.width,
+            height: label.height
+        },
+
+        x = alignAttr.x - chart.plotLeft,
+        y = alignAttr.y - chart.plotTop;
+
+    // Off left
+    off = x + padding;
+    if (off < 0) {
+        if (align === 'right') {
+            options.align = 'left';
+        } else {
+            options.x = -off;
+        }
+    }
+
+    // Off right
+    off = x + bBox.width - padding;
+    if (off > chart.plotWidth) {
+        if (align === 'left') {
+            options.align = 'right';
+        } else {
+            options.x = chart.plotWidth - off;
+        }
+    }
+
+    // Off top
+    off = y + padding;
+    if (off < 0) {
+        if (verticalAlign === 'bottom') {
+            options.verticalAlign = 'top';
+        } else {
+            options.y = -off;
+        }
+    }
+
+    // Off bottom
+    off = y + bBox.height - padding;
+    if (off > chart.plotHeight) {
+        if (verticalAlign === 'top') {
+            options.verticalAlign = 'bottom';
+        } else {
+            options.y = chart.plotHeight - off;
+        }
+    }
+
+    return options;
+};
+
+/**
+ * @typedef {Object} Annotation.ControllableLabel.AttrsMap
+ * @property {string} backgroundColor=fill
+ * @property {string} borderColor=stroke
+ * @property {string} borderWidth=stroke-width
+ * @property {string} zIndex=zIndex
+ * @property {string} borderRadius=r
+ * @property {string} padding=padding
+ */
+
+/**
+ * A map object which allows to map options attributes to element attributes
+ *
+ * @type {Annotation.ControllableLabel.AttrsMap}
+ */
+ControllableLabel.attrsMap = {
+    backgroundColor: 'fill',
+    borderColor: 'stroke',
+    borderWidth: 'stroke-width',
+    zIndex: 'zIndex',
+    borderRadius: 'r',
+    padding: 'padding'
+};
+
+H.merge(
+    true,
+    ControllableLabel.prototype,
+    controllableMixin, /** @lends Annotation.ControllableLabel# */ {
+        /**
+         * Translate the point of the label by deltaX and deltaY translations.
+         * The point is the label's anchor.
+         *
+         * @param {number} dx translation for x coordinate
+         * @param {number} dy translation for y coordinate
+         **/
+        translatePoint: function (dx, dy) {
+            controllableMixin.translatePoint.call(this, dx, dy, 0);
+        },
+
+        /**
+         * Translate x and y position relative to the label's anchor.
+         *
+         * @param {number} dx translation for x coordinate
+         * @param {number} dy translation for y coordinate
+         **/
+        translate: function (dx, dy) {
+            var annotationOptions = this.annotation.userOptions,
+                labelOptions = annotationOptions[this.collection][this.index];
+
+            // Local options:
+            this.options.x += dx;
+            this.options.y += dy;
+
+            // Options stored in chart:
+            labelOptions.x = this.options.x;
+            labelOptions.y = this.options.y;
+        },
+
+        render: function (parent) {
+            var options = this.options,
+                attrs = this.attrsFromOptions(options),
+                style = options.style;
+
+            this.graphic = this.annotation.chart.renderer
+                .label(
+                    '',
+                    0,
+                    -9e9,
+                    options.shape,
+                    null,
+                    null,
+                    options.useHTML,
+                    null,
+                    'annotation-label'
+                )
+                .attr(attrs)
+                .add(parent);
+
+            if (!this.annotation.chart.styledMode) {
+                if (style.color === 'contrast') {
+                    style.color = this.annotation.chart.renderer.getContrast(
+                        ControllableLabel.shapesWithoutBackground.indexOf(
+                            options.shape
+                        ) > -1 ? '#FFFFFF' : options.backgroundColor
+                    );
+                }
+                this.graphic
+                    .css(options.style)
+                    .shadow(options.shadow);
+            }
+
+            if (options.className) {
+                this.graphic.addClass(options.className);
+            }
+
+            this.graphic.labelrank = options.labelrank;
+
+            controllableMixin.render.call(this);
+        },
+
+        redraw: function (animation) {
+            var options = this.options,
+                text = this.text || options.format || options.text,
+                label = this.graphic,
+                point = this.points[0],
+                show = false,
+                anchor,
+                attrs;
+
+            label.attr({
+                text: text ?
+                    H.format(
+                        text,
+                        point.getLabelConfig(),
+                        this.annotation.chart.time
+                    ) :
+                    options.formatter.call(point, this)
+            });
+
+            anchor = this.anchor(point);
+            attrs = this.position(anchor);
+            show = attrs;
+
+            if (show) {
+                label.alignAttr = attrs;
+
+                attrs.anchorX = anchor.absolutePosition.x;
+                attrs.anchorY = anchor.absolutePosition.y;
+
+                label[animation ? 'animate' : 'attr'](attrs);
+            } else {
+                label.attr({
+                    x: 0,
+                    y: -9e9
+                });
+            }
+
+            label.placed = Boolean(show);
+
+            controllableMixin.redraw.call(this, animation);
+        },
+        /**
+         * All basic shapes don't support alignTo() method except label.
+         * For a controllable label, we need to subtract translation from
+         * options.
+         */
+        anchor: function () {
+            var anchor = controllableMixin.anchor.apply(this, arguments),
+                x = this.options.x || 0,
+                y = this.options.y || 0;
+
+            anchor.absolutePosition.x -= x;
+            anchor.absolutePosition.y -= y;
+
+            anchor.relativePosition.x -= x;
+            anchor.relativePosition.y -= y;
+
+            return anchor;
+        },
+
+        /**
+         * Returns the label position relative to its anchor.
+         *
+         * @param {Annotation.controllableMixin.Anchor} anchor
+         * @return {Annotation.controllableMixin.Position|null} position
+         */
+        position: function (anchor) {
+            var item = this.graphic,
+                chart = this.annotation.chart,
+                point = this.points[0],
+                itemOptions = this.options,
+                anchorAbsolutePosition = anchor.absolutePosition,
+                anchorRelativePosition = anchor.relativePosition,
+                itemPosition,
+                alignTo,
+                itemPosRelativeX,
+                itemPosRelativeY,
+
+                showItem =
+                    point.series.visible &&
+                    MockPoint.prototype.isInsidePane.call(point);
+
+            if (showItem) {
+
+                if (itemOptions.distance) {
+                    itemPosition = H.Tooltip.prototype.getPosition.call(
+                        {
+                            chart: chart,
+                            distance: H.pick(itemOptions.distance, 16)
+                        },
+                        item.width,
+                        item.height,
+                        {
+                            plotX: anchorRelativePosition.x,
+                            plotY: anchorRelativePosition.y,
+                            negative: point.negative,
+                            ttBelow: point.ttBelow,
+                            h: anchorRelativePosition.height ||
+                            anchorRelativePosition.width
+                        }
+                    );
+                } else if (itemOptions.positioner) {
+                    itemPosition = itemOptions.positioner.call(this);
+                } else {
+                    alignTo = {
+                        x: anchorAbsolutePosition.x,
+                        y: anchorAbsolutePosition.y,
+                        width: 0,
+                        height: 0
+                    };
+
+                    itemPosition = ControllableLabel.alignedPosition(
+                        H.extend(itemOptions, {
+                            width: item.width,
+                            height: item.height
+                        }),
+                        alignTo
+                    );
+
+                    if (this.options.overflow === 'justify') {
+                        itemPosition = ControllableLabel.alignedPosition(
+                            ControllableLabel.justifiedOptions(
+                                chart,
+                                item,
+                                itemOptions,
+                                itemPosition
+                            ),
+                            alignTo
+                        );
+                    }
+                }
+
+
+                if (itemOptions.crop) {
+                    itemPosRelativeX = itemPosition.x - chart.plotLeft;
+                    itemPosRelativeY = itemPosition.y - chart.plotTop;
+
+                    showItem =
+                        chart.isInsidePlot(
+                            itemPosRelativeX,
+                            itemPosRelativeY
+                        ) &&
+                        chart.isInsidePlot(
+                            itemPosRelativeX + item.width,
+                            itemPosRelativeY + item.height
+                        );
+                }
+            }
+
+            return showItem ? itemPosition : null;
+        }
+    }
+);
+
+/* ********************************************************************** */
+
+/**
+ * General symbol definition for labels with connector
+ */
+H.SVGRenderer.prototype.symbols.connector = function (x, y, w, h, options) {
+    var anchorX = options && options.anchorX,
+        anchorY = options && options.anchorY,
+        path,
+        yOffset,
+        lateral = w / 2;
+
+    if (H.isNumber(anchorX) && H.isNumber(anchorY)) {
+
+        path = ['M', anchorX, anchorY];
+
+        // Prefer 45 deg connectors
+        yOffset = y - anchorY;
+        if (yOffset < 0) {
+            yOffset = -h - yOffset;
+        }
+        if (yOffset < w) {
+            lateral = anchorX < x + (w / 2) ? yOffset : w - yOffset;
+        }
+
+        // Anchor below label
+        if (anchorY > y + h) {
+            path.push('L', x + lateral, y + h);
+
+            // Anchor above label
+        } else if (anchorY < y) {
+            path.push('L', x + lateral, y);
+
+            // Anchor left of label
+        } else if (anchorX < x) {
+            path.push('L', x, y + h / 2);
+
+            // Anchor right of label
+        } else if (anchorX > x + w) {
+            path.push('L', x + w, y + h / 2);
+        }
+    }
+
+    return path || [];
+};
+
+export default ControllableLabel;

public/js_lib/Highcharts/code/es-modules/annotations/controllable/ControllablePath.js

@@ -0,0 +1,175 @@
+'use strict';
+import H from './../../parts/Globals.js';
+import './../../parts/Utilities.js';
+import controllableMixin from './controllableMixin.js';
+import markerMixin from './markerMixin.js';
+
+// See TRACKER_FILL in highcharts.src.js
+var TRACKER_FILL = 'rgba(192,192,192,' + (H.svg ? 0.0001 : 0.002) + ')';
+
+/**
+ * A controllable path class.
+ *
+ * @class
+ * @mixes Annotation.controllableMixin
+ * @mixes Annotation.markerMixin
+ * @memberOf Annotation
+ *
+ * @param {Highcharts.Annotation}
+ * @param {Object} options a path's options object
+ * @param {number} index of the path
+ **/
+function ControllablePath(annotation, options, index) {
+    this.init(annotation, options, index);
+    this.collection = 'shapes';
+}
+
+/**
+ * @typedef {Object} Annotation.ControllablePath.AttrsMap
+ * @property {string} dashStyle=dashstyle
+ * @property {string} strokeWidth=stroke-width
+ * @property {string} stroke=stroke
+ * @property {string} fill=fill
+ * @property {string} zIndex=zIndex
+ */
+
+/**
+ * A map object which allows to map options attributes to element attributes
+ *
+ * @type {Annotation.ControllablePath.AttrsMap}
+ */
+ControllablePath.attrsMap = {
+    dashStyle: 'dashstyle',
+    strokeWidth: 'stroke-width',
+    stroke: 'stroke',
+    fill: 'fill',
+    zIndex: 'zIndex'
+};
+
+H.merge(
+    true,
+    ControllablePath.prototype,
+    controllableMixin, /** @lends Annotation.ControllablePath# */ {
+        /**
+         * @type 'path'
+         */
+        type: 'path',
+
+        setMarkers: markerMixin.setItemMarkers,
+
+        /**
+         * Map the controllable path to 'd' path attribute
+         *
+         * @return {Array<(string|number)>} a path's d attribute
+         */
+        toD: function () {
+            var d = this.options.d;
+
+            if (d) {
+                return typeof d === 'function' ?
+                    d.call(this) :
+                    d;
+            }
+
+            var points = this.points,
+                len = points.length,
+                showPath = len,
+                point = points[0],
+                position = showPath && this.anchor(point).absolutePosition,
+                pointIndex = 0,
+                dIndex = 2,
+                command;
+
+            d = position && ['M', position.x, position.y];
+
+            while (++pointIndex < len && showPath) {
+                point = points[pointIndex];
+                command = point.command || 'L';
+                position = this.anchor(point).absolutePosition;
+
+                if (command === 'Z') {
+                    d[++dIndex] = command;
+                } else {
+                    if (command !== points[pointIndex - 1].command) {
+                        d[++dIndex] = command;
+                    }
+
+                    d[++dIndex] = position.x;
+                    d[++dIndex] = position.y;
+                }
+
+                showPath = point.series.visible;
+            }
+
+            return showPath ?
+                this.chart.renderer.crispLine(d, this.graphic.strokeWidth()) :
+                null;
+        },
+
+        shouldBeDrawn: function () {
+            return controllableMixin.shouldBeDrawn.call(this) ||
+                Boolean(this.options.d);
+        },
+
+        render: function (parent) {
+            var options = this.options,
+                attrs = this.attrsFromOptions(options);
+
+            this.graphic = this.annotation.chart.renderer
+                .path(['M', 0, 0])
+                .attr(attrs)
+                .add(parent);
+
+            if (options.className) {
+                this.graphic.addClass(options.className);
+            }
+
+            this.tracker = this.annotation.chart.renderer
+                .path(['M', 0, 0])
+                .addClass('highcharts-tracker-line')
+                .attr({
+                    zIndex: 2
+                })
+                .add(parent);
+
+            if (!this.annotation.chart.styledMode) {
+                this.tracker.attr({
+                    'stroke-linejoin': 'round', // #1225
+                    stroke: TRACKER_FILL,
+                    fill: TRACKER_FILL,
+                    'stroke-width': this.graphic.strokeWidth() +
+                        options.snap * 2
+                });
+            }
+
+            controllableMixin.render.call(this);
+
+            H.extend(this.graphic, {
+                markerStartSetter: markerMixin.markerStartSetter,
+                markerEndSetter: markerMixin.markerEndSetter
+            });
+
+            this.setMarkers(this);
+        },
+
+        redraw: function (animation) {
+
+            var d = this.toD(),
+                action = animation ? 'animate' : 'attr';
+
+            if (d) {
+                this.graphic[action]({ d: d });
+                this.tracker[action]({ d: d });
+            } else {
+                this.graphic.attr({ d: 'M 0 ' + -9e9 });
+                this.tracker.attr({ d: 'M 0 ' + -9e9 });
+            }
+
+            this.graphic.placed = this.tracker.placed = Boolean(d);
+
+            controllableMixin.redraw.call(this, animation);
+        }
+    }
+);
+
+export default ControllablePath;

public/js_lib/Highcharts/code/es-modules/annotations/controllable/ControllableRect.js

@@ -0,0 +1,93 @@
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+import controllableMixin from './controllableMixin.js';
+import ControllablePath from './ControllablePath.js';
+
+/**
+ * A controllable rect class.
+ *
+ * @class
+ * @mixes Annotation.controllableMixin
+ * @memberOf Annotation
+ *
+ * @param {Highcharts.Annotation} annotation an annotation instance
+ * @param {Object} options a rect's options
+ * @param {number} index of the rectangle
+ **/
+function ControllableRect(annotation, options, index) {
+    this.init(annotation, options, index);
+    this.collection = 'shapes';
+}
+
+/**
+ * @typedef {Annotation.ControllablePath.AttrsMap}
+ *          Annotation.ControllableRect.AttrsMap
+ * @property {string} width=width
+ * @property {string} height=height
+ */
+
+/**
+ * A map object which allows to map options attributes to element attributes
+ *
+ * @type {Annotation.ControllableRect.AttrsMap}
+ */
+ControllableRect.attrsMap = H.merge(ControllablePath.attrsMap, {
+    width: 'width',
+    height: 'height'
+});
+
+H.merge(
+    true,
+    ControllableRect.prototype,
+    controllableMixin, /** @lends Annotation.ControllableRect# */ {
+        /**
+         * @type 'rect'
+         */
+        type: 'rect',
+
+        render: function (parent) {
+            var attrs = this.attrsFromOptions(this.options);
+
+            this.graphic = this.annotation.chart.renderer
+                .rect(0, -9e9, 0, 0)
+                .attr(attrs)
+                .add(parent);
+
+            controllableMixin.render.call(this);
+        },
+
+        redraw: function (animation) {
+            var position = this.anchor(this.points[0]).absolutePosition;
+
+            if (position) {
+                this.graphic[animation ? 'animate' : 'attr']({
+                    x: position.x,
+                    y: position.y,
+                    width: this.options.width,
+                    height: this.options.height
+                });
+            } else {
+                this.attr({
+                    x: 0,
+                    y: -9e9
+                });
+            }
+
+            this.graphic.placed = Boolean(position);
+
+            controllableMixin.redraw.call(this, animation);
+        },
+
+        translate: function (dx, dy) {
+            var annotationOptions = this.annotation.userOptions,
+                shapeOptions = annotationOptions[this.collection][this.index];
+
+            this.translatePoint(dx, dy, 0);
+
+            // Options stored in chart:
+            shapeOptions.point = this.options.point;
+        }
+    }
+);
+
+export default ControllableRect;

public/js_lib/Highcharts/code/es-modules/annotations/controllable/controllableMixin.js

@@ -0,0 +1,411 @@
+'use strict';
+import H from './../../parts/Globals.js';
+import './../../parts/Utilities.js';
+import './../../parts/Tooltip.js';
+import ControlPoint from './../ControlPoint.js';
+import MockPoint from './../MockPoint.js';
+
+/**
+ * It provides methods for handling points, control points
+ * and points transformations.
+ *
+ * @mixin
+ * @memberOf Annotation
+ */
+var controllableMixin = {
+    /**
+     * Init the controllable
+     *
+     * @param {Annotation} annotation - an annotation instance
+     * @param {Object} options - options specific for controllable
+     * @param {number} index - index of the controllable element
+     **/
+    init: function (annotation, options, index) {
+        this.annotation = annotation;
+        this.chart = annotation.chart;
+        this.options = options;
+        this.points = [];
+        this.controlPoints = [];
+        this.index = index;
+
+        this.linkPoints();
+        this.addControlPoints();
+    },
+
+    /**
+     * Redirect attr usage on the controllable graphic element.
+     **/
+    attr: function () {
+        this.graphic.attr.apply(this.graphic, arguments);
+    },
+
+
+    /**
+     * Get the controllable's points options.
+     *
+     * @return {Array<PointLikeOptions>} - an array of points' options.
+     *
+     */
+    getPointsOptions: function () {
+        var options = this.options;
+
+        return options.points || (options.point && H.splat(options.point));
+    },
+
+    /**
+     * Utility function for mapping item's options
+     * to element's attribute
+     *
+     * @param {Object} options
+     * @return {Object} mapped options
+     **/
+    attrsFromOptions: function (options) {
+        var map = this.constructor.attrsMap,
+            attrs = {},
+            key,
+            mappedKey,
+            styledMode = this.chart.styledMode;
+
+        for (key in options) {
+            mappedKey = map[key];
+
+            if (
+                mappedKey &&
+                (
+                    !styledMode ||
+                    ['fill', 'stroke', 'stroke-width']
+                        .indexOf(mappedKey) === -1
+                )
+            ) {
+                attrs[mappedKey] = options[key];
+            }
+        }
+
+        return attrs;
+    },
+
+    /**
+     * @typedef {Object} Annotation.controllableMixin.Position
+     * @property {number} x
+     * @property {number} y
+     */
+
+    /**
+     * An object which denotes an anchor position
+     *
+     * @typedef Annotation.controllableMixin.AnchorPosition
+     *          Annotation.controllableMixin.Position
+     * @property {number} height
+     * @property {number} width
+     */
+
+    /**
+     * An object which denots a controllable's anchor positions
+     * - relative and absolute.
+     *
+     * @typedef {Object} Annotation.controllableMixin.Anchor
+     * @property {Annotation.controllableMixin.AnchorPosition} relativePosition
+     * @property {Annotation.controllableMixin.AnchorPosition} absolutePosition
+     */
+
+    /**
+     * Returns object which denotes anchor position - relative and absolute.
+     *
+     * @param {Annotation.PointLike} point a point like object
+     * @return {Annotation.controllableMixin.Anchor} a controllable anchor
+     */
+    anchor: function (point) {
+        var plotBox = point.series.getPlotBox(),
+
+            box = point.mock ?
+                point.toAnchor() :
+                H.Tooltip.prototype.getAnchor.call({
+                    chart: point.series.chart
+                }, point),
+
+            anchor = {
+                x: box[0] + (this.options.x || 0),
+                y: box[1] + (this.options.y || 0),
+                height: box[2] || 0,
+                width: box[3] || 0
+            };
+
+        return {
+            relativePosition: anchor,
+            absolutePosition: H.merge(anchor, {
+                x: anchor.x + plotBox.translateX,
+                y: anchor.y + plotBox.translateY
+            })
+        };
+    },
+
+    /**
+     * Map point's options to a point-like object.
+     *
+     * @param {Annotation.MockPoint.Options} pointOptions point's options
+     * @param {Annotation.PointLike} point a point like instance
+     * @return {Annotation.PointLike|null} if the point is
+     *         found/set returns this point, otherwise null
+     */
+    point: function (pointOptions, point) {
+        if (pointOptions && pointOptions.series) {
+            return pointOptions;
+        }
+
+        if (!point || point.series === null) {
+            if (H.isObject(pointOptions)) {
+                point = new MockPoint(
+                    this.chart,
+                    this,
+                    pointOptions
+                );
+            } else if (H.isString(pointOptions)) {
+                point = this.chart.get(pointOptions) || null;
+            } else if (typeof pointOptions === 'function') {
+                var pointConfig = pointOptions.call(point, this);
+
+                point = pointConfig.series ?
+                    pointConfig :
+                    new MockPoint(
+                        this.chart,
+                        this,
+                        pointOptions
+                    );
+            }
+        }
+
+        return point;
+    },
+
+    /**
+     * Find point-like objects based on points options.
+     *
+     * @return {Array<Annotation.PointLike>} an array of point-like objects
+     */
+    linkPoints: function () {
+        var pointsOptions = this.getPointsOptions(),
+            points = this.points,
+            len = (pointsOptions && pointsOptions.length) || 0,
+            i,
+            point;
+
+        for (i = 0; i < len; i++) {
+            point = this.point(pointsOptions[i], points[i]);
+
+            if (!point) {
+                points.length = 0;
+
+                return;
+            }
+
+            if (point.mock) {
+                point.refresh();
+            }
+
+            points[i] = point;
+        }
+
+        return points;
+    },
+
+
+    /**
+     * Add control points to a controllable.
+     */
+    addControlPoints: function () {
+        var controlPointsOptions = this.options.controlPoints;
+
+        (controlPointsOptions || []).forEach(
+            function (controlPointOptions, i) {
+                var options = H.merge(
+                    this.options.controlPointOptions,
+                    controlPointOptions
+                );
+
+                if (!options.index) {
+                    options.index = i;
+                }
+
+                controlPointsOptions[i] = options;
+
+                this.controlPoints.push(
+                    new ControlPoint(this.chart, this, options)
+                );
+            },
+            this
+        );
+    },
+
+    /**
+     * Check if a controllable should be rendered/redrawn.
+     *
+     * @return {boolean} whether a controllable should be drawn.
+     */
+    shouldBeDrawn: function () {
+        return Boolean(this.points.length);
+    },
+
+    /**
+     * Render a controllable.
+     **/
+    render: function () {
+        this.controlPoints.forEach(function (controlPoint) {
+            controlPoint.render();
+        });
+    },
+
+    /**
+     * Redraw a controllable.
+     *
+     * @param {boolean} animation
+     **/
+    redraw: function (animation) {
+        this.controlPoints.forEach(function (controlPoint) {
+            controlPoint.redraw(animation);
+        });
+    },
+
+    /**
+     * Transform a controllable with a specific transformation.
+     *
+     * @param {string} transformation a transformation name
+     * @param {number} cx origin x transformation
+     * @param {number} cy origin y transformation
+     * @param {number} p1 param for the transformation
+     * @param {number} p2 param for the transformation
+     **/
+    transform: function (transformation, cx, cy, p1, p2) {
+        if (this.chart.inverted) {
+            var temp = cx;
+
+            cx = cy;
+            cy = temp;
+        }
+
+        this.points.forEach(function (point, i) {
+            this.transformPoint(transformation, cx, cy, p1, p2, i);
+        }, this);
+    },
+
+    /**
+     * Transform a point with a specific transformation
+     * If a transformed point is a real point it is replaced with
+     * the mock point.
+     *
+     * @param {string} transformation a transformation name
+     * @param {number} cx origin x transformation
+     * @param {number} cy origin y transformation
+     * @param {number} p1 param for the transformation
+     * @param {number} p2 param for the transformation
+     * @param {number} i index of the point
+     *
+     **/
+    transformPoint: function (transformation, cx, cy, p1, p2, i) {
+        var point = this.points[i];
+
+        if (!point.mock) {
+            point = this.points[i] = MockPoint.fromPoint(point);
+        }
+
+        point[transformation](cx, cy, p1, p2);
+    },
+
+    /**
+     * Translate a controllable.
+     *
+     * @param {number} dx translation for x coordinate
+     * @param {number} dy translation for y coordinate
+     **/
+    translate: function (dx, dy) {
+        this.transform('translate', null, null, dx, dy);
+    },
+
+    /**
+     * Translate a specific point within a controllable.
+     *
+     * @param {number} dx translation for x coordinate
+     * @param {number} dy translation for y coordinate
+     * @param {number} i index of the point
+     **/
+    translatePoint: function (dx, dy, i) {
+        this.transformPoint('translate', null, null, dx, dy, i);
+    },
+
+    /**
+     * Rotate a controllable.
+     *
+     * @param {number} cx origin x rotation
+     * @param {number} cy origin y rotation
+     * @param {number} radians
+     **/
+    rotate: function (cx, cy, radians) {
+        this.transform('rotate', cx, cy, radians);
+    },
+
+    /**
+     * Scale a controllable.
+     *
+     * @param {number} cx origin x rotation
+     * @param {number} cy origin y rotation
+     * @param {number} sx scale factor x
+     * @param {number} sy scale factor y
+     */
+    scale: function (cx, cy, sx, sy) {
+        this.transform('scale', cx, cy, sx, sy);
+    },
+
+    /**
+     * Set control points' visibility.
+     *
+     * @param {boolean} [visible]
+     */
+    setControlPointsVisibility: function (visible) {
+        this.controlPoints.forEach(function (controlPoint) {
+            controlPoint.setVisibility(visible);
+        });
+    },
+
+    /**
+     * Destroy a controllable.
+     */
+    destroy: function () {
+        if (this.graphic) {
+            this.graphic = this.graphic.destroy();
+        }
+
+        if (this.tracker) {
+            this.tracker = this.tracker.destroy();
+        }
+
+        this.controlPoints.forEach(function (controlPoint) {
+            controlPoint.destroy();
+        });
+
+        this.chart = null;
+        this.points = null;
+        this.controlPoints = null;
+        this.options = null;
+
+        if (this.annotation) {
+            this.annotation = null;
+        }
+    },
+
+    /**
+     * Update a controllable.
+     *
+     * @param {Object} newOptions
+     */
+    update: function (newOptions) {
+        var annotation = this.annotation,
+            options = H.merge(true, this.options, newOptions),
+            parentGroup = this.graphic.parentGroup;
+
+        this.destroy();
+        this.constructor(annotation, options);
+        this.render(parentGroup);
+        this.redraw();
+    }
+};
+
+export default controllableMixin;

public/js_lib/Highcharts/code/es-modules/annotations/controllable/markerMixin.js

@@ -0,0 +1,214 @@
+'use strict';
+import H from './../../parts/Globals.js';
+import './../../parts/Chart.js';
+import './../../parts/Utilities.js';
+import './../../parts/SvgRenderer.js';
+
+/**
+ * Options for configuring markers for annotations.
+ *
+ * An example of the arrow marker:
+ * <pre>
+ * {
+ *   arrow: {
+ *     id: 'arrow',
+ *     tagName: 'marker',
+ *     refY: 5,
+ *     refX: 5,
+ *     markerWidth: 10,
+ *     markerHeight: 10,
+ *     children: [{
+ *       tagName: 'path',
+ *       attrs: {
+ *         d: 'M 0 0 L 10 5 L 0 10 Z',
+ *         strokeWidth: 0
+ *       }
+ *     }]
+ *   }
+ * }
+ * </pre>
+ * @type {Object}
+ * @sample highcharts/annotations/custom-markers/
+ *         Define a custom marker for annotations
+ * @sample highcharts/css/annotations-markers/
+ *         Define markers in a styled mode
+ * @since 6.0.0
+ * @apioption defs
+ */
+var defaultMarkers = {
+    arrow: {
+        tagName: 'marker',
+        render: false,
+        id: 'arrow',
+        refY: 5,
+        refX: 9,
+        markerWidth: 10,
+        markerHeight: 10,
+        children: [{
+            tagName: 'path',
+            d: 'M 0 0 L 10 5 L 0 10 Z', // triangle (used as an arrow)
+            strokeWidth: 0
+        }]
+    },
+
+    'reverse-arrow': {
+        tagName: 'marker',
+        render: false,
+        id: 'reverse-arrow',
+        refY: 5,
+        refX: 1,
+        markerWidth: 10,
+        markerHeight: 10,
+        children: [{
+            tagName: 'path',
+            // reverse triangle (used as an arrow)
+            d: 'M 0 5 L 10 0 L 10 10 Z',
+            strokeWidth: 0
+        }]
+    }
+};
+
+H.SVGRenderer.prototype.addMarker = function (id, markerOptions) {
+    var options = { id: id };
+
+    var attrs = {
+        stroke: markerOptions.color || 'none',
+        fill: markerOptions.color || 'rgba(0, 0, 0, 0.75)'
+    };
+
+    options.children = markerOptions.children.map(function (child) {
+        return H.merge(attrs, child);
+    });
+
+    var marker = this.definition(H.merge(true, {
+        markerWidth: 20,
+        markerHeight: 20,
+        refX: 0,
+        refY: 0,
+        orient: 'auto'
+    }, markerOptions, options));
+
+    marker.id = id;
+
+    return marker;
+};
+
+var createMarkerSetter = function (markerType) {
+    return function (value) {
+        this.attr(markerType, 'url(#' + value + ')');
+    };
+};
+
+/**
+ * @mixin
+ */
+var markerMixin = {
+    markerEndSetter: createMarkerSetter('marker-end'),
+    markerStartSetter: createMarkerSetter('marker-start'),
+
+    /*
+     * Set markers.
+     *
+     * @param {Controllable} item
+     */
+    setItemMarkers: function (item) {
+        var itemOptions = item.options,
+            chart = item.chart,
+            defs = chart.options.defs,
+            fill = itemOptions.fill,
+            color = H.defined(fill) && fill !== 'none' ?
+                fill :
+                itemOptions.stroke,
+
+            setMarker = function (markerType) {
+                var markerId = itemOptions[markerType],
+                    def,
+                    predefinedMarker,
+                    key,
+                    marker;
+
+                if (markerId) {
+                    for (key in defs) {
+                        def = defs[key];
+
+                        if (
+                            markerId === def.id && def.tagName === 'marker'
+                        ) {
+                            predefinedMarker = def;
+                            break;
+                        }
+                    }
+
+                    if (predefinedMarker) {
+                        marker = item[markerType] = chart.renderer
+                            .addMarker(
+                                (itemOptions.id || H.uniqueKey()) + '-' +
+                                predefinedMarker.id,
+                                H.merge(predefinedMarker, { color: color })
+                            );
+
+                        item.attr(markerType, marker.attr('id'));
+                    }
+                }
+            };
+
+        ['markerStart', 'markerEnd'].forEach(setMarker);
+    }
+};
+
+// In a styled mode definition is implemented
+H.SVGRenderer.prototype.definition = function (def) {
+    var ren = this;
+
+    function recurse(config, parent) {
+        var ret;
+
+        H.splat(config).forEach(function (item) {
+            var node = ren.createElement(item.tagName),
+                attr = {};
+
+            // Set attributes
+            H.objectEach(item, function (val, key) {
+                if (
+                    key !== 'tagName' &&
+                    key !== 'children' &&
+                    key !== 'textContent'
+                ) {
+                    attr[key] = val;
+                }
+            });
+            node.attr(attr);
+
+            // Add to the tree
+            node.add(parent || ren.defs);
+
+            // Add text content
+            if (item.textContent) {
+                node.element.appendChild(
+                    H.doc.createTextNode(item.textContent)
+                );
+            }
+
+            // Recurse
+            recurse(item.children || [], node);
+
+            ret = node;
+        });
+
+        // Return last node added (on top level it's the only one)
+        return ret;
+    }
+    return recurse(def);
+};
+
+H.addEvent(H.Chart, 'afterGetContainer', function () {
+    this.options.defs = H.merge(defaultMarkers, this.options.defs || {});
+
+    H.objectEach(this.options.defs, function (def) {
+        if (def.tagName === 'marker' && def.render !== false) {
+            this.renderer.addMarker(def.id, def);
+        }
+    }, this);
+});
+
+export default markerMixin;

public/js_lib/Highcharts/code/es-modules/annotations/eventEmitterMixin.js

@@ -0,0 +1,271 @@
+import H from '../parts/Globals.js';
+import '../parts/Utilities.js';
+
+/**
+ * It provides methods for:
+ * - adding and handling DOM events and a drag event,
+ * - mapping a mouse move event to the distance between two following events.
+ *   The units of the distance are specific to a transformation,
+ *   e.g. for rotation they are radians, for scaling they are scale factors.
+ *
+ * @mixin
+ * @memberOf Annotation
+ */
+var eventEmitterMixin = {
+    /**
+     * Add emitter events.
+     */
+    addEvents: function () {
+        var emitter = this;
+
+        H.addEvent(
+            emitter.graphic.element,
+            'mousedown',
+            function (e) {
+                emitter.onMouseDown(e);
+            }
+        );
+
+        H.objectEach(emitter.options.events, function (event, type) {
+            var eventHandler = function (e) {
+                if (type !== 'click' || !emitter.cancelClick) {
+                    event.call(
+                        emitter,
+                        emitter.chart.pointer.normalize(e),
+                        emitter.target
+                    );
+                }
+            };
+
+            if (type !== 'drag') {
+                emitter.graphic.on(type, eventHandler);
+            } else {
+                H.addEvent(emitter, 'drag', eventHandler);
+            }
+        });
+
+        if (emitter.options.draggable) {
+            H.addEvent(emitter, 'drag', emitter.onDrag);
+
+            if (!emitter.graphic.renderer.styledMode) {
+                emitter.graphic.css({
+                    cursor: {
+                        x: 'ew-resize',
+                        y: 'ns-resize',
+                        xy: 'move'
+                    }[emitter.options.draggable]
+                });
+            }
+        }
+    },
+
+    /**
+     * Remove emitter document events.
+     */
+    removeDocEvents: function () {
+        if (this.removeDrag) {
+            this.removeDrag = this.removeDrag();
+        }
+
+        if (this.removeMouseUp) {
+            this.removeMouseUp = this.removeMouseUp();
+        }
+    },
+
+    /**
+     * Mouse down handler.
+     *
+     * @param {Object} e event
+     */
+    onMouseDown: function (e) {
+        var emitter = this,
+            pointer = emitter.chart.pointer,
+            prevChartX,
+            prevChartY;
+
+        // On right click, do nothing:
+        if (e.button === 2) {
+            return;
+        }
+
+        e.stopPropagation();
+
+        e = pointer.normalize(e);
+        prevChartX = e.chartX;
+        prevChartY = e.chartY;
+
+        emitter.cancelClick = false;
+
+        emitter.removeDrag = H.addEvent(
+            H.doc,
+            'mousemove',
+            function (e) {
+                emitter.hasDragged = true;
+
+                e = pointer.normalize(e);
+                e.prevChartX = prevChartX;
+                e.prevChartY = prevChartY;
+
+                H.fireEvent(emitter, 'drag', e);
+
+                prevChartX = e.chartX;
+                prevChartY = e.chartY;
+            }
+        );
+
+        emitter.removeMouseUp = H.addEvent(
+            H.doc,
+            'mouseup',
+            function (e) {
+                emitter.cancelClick = emitter.hasDragged;
+                emitter.hasDragged = false;
+
+                emitter.onMouseUp(e);
+            }
+        );
+    },
+
+    /**
+     * Mouse up handler.
+     *
+     * @param {Object} e event
+     */
+    onMouseUp: function () {
+        var chart = this.chart,
+            annotation = this.target || this,
+            annotationsOptions = chart.options.annotations,
+            index = chart.annotations.indexOf(annotation);
+
+        this.removeDocEvents();
+
+        annotationsOptions[index] = annotation.options;
+    },
+
+    /**
+     * Drag and drop event. All basic annotations should share this
+     * capability as well as the extended ones.
+     *
+     * @param {Object} e event
+     */
+    onDrag: function (e) {
+        if (
+            this.chart.isInsidePlot(
+                e.chartX - this.chart.plotLeft,
+                e.chartY - this.chart.plotTop
+            )
+        ) {
+            var translation = this.mouseMoveToTranslation(e);
+
+            if (this.options.draggable === 'x') {
+                translation.y = 0;
+            }
+
+            if (this.options.draggable === 'y') {
+                translation.x = 0;
+            }
+
+            if (this.points.length) {
+                this.translate(translation.x, translation.y);
+            } else {
+                this.shapes.forEach(function (shape) {
+                    shape.translate(translation.x, translation.y);
+                });
+                this.labels.forEach(function (label) {
+                    label.translate(translation.x, translation.y);
+                });
+            }
+
+            this.redraw(false);
+        }
+    },
+
+    /**
+     * Map mouse move event to the radians.
+     *
+     * @param {Object} e event
+     * @param {number} cx center x
+     * @param {number} cy center y
+     */
+    mouseMoveToRadians: function (e, cx, cy) {
+        var prevDy = e.prevChartY - cy,
+            prevDx = e.prevChartX - cx,
+            dy = e.chartY - cy,
+            dx = e.chartX - cx,
+            temp;
+
+        if (this.chart.inverted) {
+            temp = prevDx;
+            prevDx = prevDy;
+            prevDy = temp;
+
+            temp = dx;
+            dx = dy;
+            dy = temp;
+        }
+
+        return Math.atan2(dy, dx) - Math.atan2(prevDy, prevDx);
+    },
+
+    /**
+     * Map mouse move event to the distance between two following events.
+     *
+     * @param {Object} e event
+     */
+    mouseMoveToTranslation: function (e) {
+        var dx = e.chartX - e.prevChartX,
+            dy = e.chartY - e.prevChartY,
+            temp;
+
+        if (this.chart.inverted) {
+            temp = dy;
+            dy = dx;
+            dx = temp;
+        }
+
+        return {
+            x: dx,
+            y: dy
+        };
+    },
+
+    /**
+     * Map mouse move to the scale factors.
+     *
+     * @param {Object} e event
+     * @param {number} cx center x
+     * @param {number} cy center y
+     **/
+    mouseMoveToScale: function (e, cx, cy) {
+        var prevDx = e.prevChartX - cx,
+            prevDy = e.prevChartY - cy,
+            dx = e.chartX - cx,
+            dy = e.chartY - cy,
+            sx = (dx || 1) / (prevDx || 1),
+            sy = (dy || 1) / (prevDy || 1),
+            temp;
+
+        if (this.chart.inverted) {
+            temp = sy;
+            sy = sx;
+            sx = temp;
+        }
+
+        return {
+            x: sx,
+            y: sy
+        };
+    },
+
+    /**
+     * Destroy the event emitter.
+     */
+    destroy: function () {
+        this.removeDocEvents();
+
+        H.removeEvent(this);
+
+        this.hcEvents = null;
+    }
+};
+
+export default eventEmitterMixin;

public/js_lib/Highcharts/code/es-modules/annotations/types/CrookedLine.js

@@ -0,0 +1,191 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    MockPoint = Annotation.MockPoint,
+    ControlPoint = Annotation.ControlPoint;
+
+/**
+ * @class
+ * @extends Annotation
+ * @memberOf Annotation
+ */
+function CrookedLine() {
+    Annotation.apply(this, arguments);
+}
+
+H.extendAnnotation(
+    CrookedLine,
+    null,
+    /** @lends Annotation.CrookedLine# */
+    {
+        /**
+         * Overrides default setter to get axes from typeOptions.
+         */
+        setClipAxes: function () {
+            this.clipXAxis = this.chart.xAxis[this.options.typeOptions.xAxis];
+            this.clipYAxis = this.chart.yAxis[this.options.typeOptions.yAxis];
+        },
+        getPointsOptions: function () {
+            var typeOptions = this.options.typeOptions;
+
+            return typeOptions.points.map(function (pointOptions) {
+                pointOptions.xAxis = typeOptions.xAxis;
+                pointOptions.yAxis = typeOptions.yAxis;
+
+                return pointOptions;
+            });
+        },
+
+        getControlPointsOptions: function () {
+            return this.getPointsOptions();
+        },
+
+        addControlPoints: function () {
+            this.getControlPointsOptions().forEach(
+                function (pointOptions, i) {
+                    var controlPoint = new ControlPoint(
+                        this.chart,
+                        this,
+                        H.merge(
+                            this.options.controlPointOptions,
+                            pointOptions.controlPoint
+                        ),
+                        i
+                    );
+
+                    this.controlPoints.push(controlPoint);
+
+                    pointOptions.controlPoint = controlPoint.options;
+                },
+                this
+            );
+        },
+
+        addShapes: function () {
+            var typeOptions = this.options.typeOptions,
+                shape = this.initShape(
+                    H.merge(typeOptions.line, {
+                        type: 'path',
+                        points: this.points.map(function (point, i) {
+                            return function (target) {
+                                return target.annotation.points[i];
+                            };
+                        })
+                    }),
+                    false
+                );
+
+            typeOptions.line = shape.options;
+        }
+    },
+
+    /**
+     * A crooked line annotation.
+     *
+     * @excluding labels, shapes
+     * @sample highcharts/annotations-advanced/crooked-line/
+     *         Crooked line
+     * @product highstock
+     * @optionparent annotations.crookedLine
+     */
+    {
+        /**
+         * Additional options for an annotation with the type.
+         */
+        typeOptions: {
+            /**
+             * This number defines which xAxis the point is connected to.
+             * It refers to either the axis id or the index of the axis
+             * in the xAxis array.
+             */
+            xAxis: 0,
+            /**
+             * This number defines which yAxis the point is connected to.
+             * It refers to either the axis id or the index of the axis
+             * in the xAxis array.
+             */
+            yAxis: 0,
+
+            /**
+             * @type {Array<Object>}
+             * @apioption annotations.crookedLine.typeOptions.points
+             */
+
+            /**
+             * The x position of the point.
+             * @type {number}
+             * @apioption annotations.crookedLine.typeOptions.points.x
+             */
+
+            /**
+             * The y position of the point.
+             * @type {number}
+             * @apioption annotations.crookedLine.typeOptions.points.y
+             */
+
+            /**
+             * @type {number}
+             * @excluding positioner, events
+             * @apioption annotations.crookedLine.typeOptions.points.controlPoint
+             */
+
+            /**
+             * Line options.
+             *
+             * @type {Object}
+             * @excluding height, point, points, r, type, width
+             */
+            line: {
+                fill: 'none'
+            }
+        },
+
+        /**
+         * @excluding positioner, events
+         */
+        controlPointOptions: {
+            positioner: function (target) {
+                var graphic = this.graphic,
+                    xy = MockPoint.pointToPixels(target.points[this.index]);
+
+                return {
+                    x: xy.x - graphic.width / 2,
+                    y: xy.y - graphic.height / 2
+                };
+            },
+
+            events: {
+                drag: function (e, target) {
+                    if (
+                        target.chart.isInsidePlot(
+                            e.chartX - target.chart.plotLeft,
+                            e.chartY - target.chart.plotTop
+                        )
+                    ) {
+                        var translation = this.mouseMoveToTranslation(e);
+
+                        target.translatePoint(
+                            translation.x,
+                            translation.y,
+                            this.index
+                        );
+
+                        // Update options:
+                        target.options.typeOptions.points[this.index].x =
+                            target.points[this.index].x;
+                        target.options.typeOptions.points[this.index].y =
+                            target.points[this.index].y;
+
+                        target.redraw(false);
+                    }
+                }
+            }
+        }
+    }
+);
+
+Annotation.types.crookedLine = CrookedLine;
+
+export default CrookedLine;

public/js_lib/Highcharts/code/es-modules/annotations/types/ElliottWave.js

@@ -0,0 +1,76 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    CrookedLine = Annotation.types.crookedLine;
+
+/**
+ * @class
+ * @extends Annotation.CrookedLine
+ * @memberOf Annotation
+ */
+function ElliottWave() {
+    CrookedLine.apply(this, arguments);
+}
+
+H.extendAnnotation(ElliottWave, CrookedLine,
+    /** Annotation.CrookedLine# */
+    {
+        addLabels: function () {
+            this.getPointsOptions().forEach(function (point, i) {
+                var label = this.initLabel(H.merge(
+                    point.label, {
+                        text: this.options.typeOptions.labels[i],
+                        point: function (target) {
+                            return target.annotation.points[i];
+                        }
+                    }
+                ), false);
+
+                point.label = label.options;
+            }, this);
+        }
+    },
+
+    /**
+     * An elliott wave annotation.
+     *
+     * @extends annotations.crookedLine
+     * @sample highcharts/annotations-advanced/elliott-wave/
+     *         Elliott wave
+     * @product highstock
+     * @optionparent annotations.elliottWave
+     */
+    {
+        typeOptions: {
+            /**
+             * @type {Object}
+             * @extends annotations.crookedLine.labelOptions
+             * @apioption annotations.crookedLine.typeOptions.points.label
+             */
+
+            /**
+             * @ignore
+             */
+            labels: ['(0)', '(A)', '(B)', '(C)', '(D)', '(E)'],
+            line: {
+                strokeWidth: 1
+            }
+        },
+
+        labelOptions: {
+            align: 'center',
+            allowOverlap: true,
+            crop: true,
+            overflow: 'none',
+            type: 'rect',
+            backgroundColor: 'none',
+            borderWidth: 0,
+            y: -5
+        }
+    });
+
+Annotation.types.elliottWave = ElliottWave;
+
+export default ElliottWave;

public/js_lib/Highcharts/code/es-modules/annotations/types/Fibonacci.js

@@ -0,0 +1,247 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    MockPoint = Annotation.MockPoint,
+    Tunnel = Annotation.types.tunnel;
+
+var createPathDGenerator = function (retracementIndex, isBackground) {
+    return function () {
+        var annotation = this.annotation,
+            leftTop = this.anchor(
+                annotation.startRetracements[retracementIndex]
+            ).absolutePosition,
+            rightTop = this.anchor(
+                annotation.endRetracements[retracementIndex]
+            ).absolutePosition,
+            d = [
+                'M',
+                Math.round(leftTop.x),
+                Math.round(leftTop.y),
+                'L',
+                Math.round(rightTop.x),
+                Math.round(rightTop.y)
+            ],
+            rightBottom,
+            leftBottom;
+
+        if (isBackground) {
+            rightBottom = this.anchor(
+                annotation.endRetracements[retracementIndex - 1]
+            ).absolutePosition;
+
+            leftBottom = this.anchor(
+                annotation.startRetracements[retracementIndex - 1]
+            ).absolutePosition;
+
+            d.push(
+                'L',
+                Math.round(rightBottom.x),
+                Math.round(rightBottom.y),
+                'L',
+                Math.round(leftBottom.x),
+                Math.round(leftBottom.y)
+            );
+        }
+
+        return d;
+    };
+};
+
+/**
+ * @class
+ * @extends Annotation.Tunnel
+ * @memberOf Annotation
+ **/
+function Fibonacci() {
+    this.startRetracements = [];
+    this.endRetracements = [];
+
+    Tunnel.apply(this, arguments);
+}
+
+Fibonacci.levels = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1];
+
+H.extendAnnotation(Fibonacci, Tunnel,
+    /** @lends Annotation.Fibonacci# */
+    {
+        linkPoints: function () {
+            Tunnel.prototype.linkPoints.call(this);
+
+            this.linkRetracementsPoints();
+        },
+
+        linkRetracementsPoints: function () {
+            var points = this.points,
+                startDiff = points[0].y - points[3].y,
+                endDiff = points[1].y - points[2].y,
+                startX = points[0].x,
+                endX = points[1].x;
+
+            Fibonacci.levels.forEach(function (level, i) {
+                var startRetracement = points[0].y - startDiff * level,
+                    endRetracement = points[1].y - endDiff * level;
+
+                this.linkRetracementPoint(
+                    i,
+                    startX,
+                    startRetracement,
+                    this.startRetracements
+                );
+
+                this.linkRetracementPoint(
+                    i,
+                    endX,
+                    endRetracement,
+                    this.endRetracements
+                );
+            }, this);
+        },
+
+        linkRetracementPoint: function (
+            pointIndex,
+            x,
+            y,
+            retracements
+        ) {
+            var point = retracements[pointIndex],
+                typeOptions = this.options.typeOptions;
+
+            if (!point) {
+                retracements[pointIndex] = new MockPoint(
+                    this.chart,
+                    this,
+                    {
+                        x: x,
+                        y: y,
+                        xAxis: typeOptions.xAxis,
+                        yAxis: typeOptions.yAxis
+                    }
+                );
+            } else {
+                point.options.x = x;
+                point.options.y = y;
+
+                point.refresh();
+            }
+        },
+
+        addShapes: function () {
+            Fibonacci.levels.forEach(function (level, i) {
+                this.initShape({
+                    type: 'path',
+                    d: createPathDGenerator(i)
+                }, false);
+
+                if (i > 0) {
+                    this.initShape({
+                        type: 'path',
+                        fill: this.options.typeOptions.backgroundColors[i - 1],
+                        strokeWidth: 0,
+                        d: createPathDGenerator(i, true)
+                    });
+                }
+            }, this);
+        },
+
+        addLabels: function () {
+            Fibonacci.levels.forEach(function (level, i) {
+                var options = this.options.typeOptions,
+                    label = this.initLabel(
+                        H.merge(options.labels[i], {
+                            point: function (target) {
+                                var point = MockPoint.pointToOptions(
+                                    target.annotation.startRetracements[i]
+                                );
+
+                                return point;
+                            },
+                            text: level.toString()
+                        })
+                    );
+
+                options.labels[i] = label.options;
+            }, this);
+        }
+    },
+
+    /**
+     * A fibonacci annotation.
+     *
+     * @extends annotations.crookedLine
+     * @sample highcharts/annotations-advanced/fibonacci/
+     *         Fibonacci
+     *
+     * @product highstock
+     * @optionparent annotations.fibonacci
+     */
+    {
+        typeOptions: {
+            /**
+             * The height of the fibonacci in terms of yAxis.
+             */
+            height: 2,
+
+            /**
+             * An array of background colors:
+             * Default to:
+             * <pre>
+[
+  'rgba(130, 170, 255, 0.4)',
+  'rgba(139, 191, 216, 0.4)',
+  'rgba(150, 216, 192, 0.4)',
+  'rgba(156, 229, 161, 0.4)',
+  'rgba(162, 241, 130, 0.4)',
+  'rgba(169, 255, 101, 0.4)'
+]
+              </pre>
+             */
+            backgroundColors: [
+                'rgba(130, 170, 255, 0.4)',
+                'rgba(139, 191, 216, 0.4)',
+                'rgba(150, 216, 192, 0.4)',
+                'rgba(156, 229, 161, 0.4)',
+                'rgba(162, 241, 130, 0.4)',
+                'rgba(169, 255, 101, 0.4)'
+            ],
+
+            /**
+             * The color of line.
+             */
+            lineColor: 'grey',
+
+            /**
+             * An array of colors for the lines.
+             */
+            lineColors: [],
+
+            /**
+             * An array with options for the labels.
+             *
+             * @type {Array<Object>}
+             * @extends annotations.crookedLine.labelOptions
+             * @apioption annotations.fibonacci.typeOptions.labels
+             */
+            labels: []
+        },
+
+        labelOptions: {
+            allowOverlap: true,
+            align: 'right',
+            backgroundColor: 'none',
+            borderWidth: 0,
+            crop: false,
+            overflow: 'none',
+            shape: 'rect',
+            style: {
+                color: 'grey'
+            },
+            verticalAlign: 'middle',
+            y: 0
+        }
+    });
+
+Annotation.types.fibonacci = Fibonacci;
+
+export default Fibonacci;

public/js_lib/Highcharts/code/es-modules/annotations/types/InfinityLine.js

@@ -0,0 +1,185 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    MockPoint = Annotation.MockPoint,
+    CrookedLine = Annotation.types.crookedLine;
+
+/**
+ * @class
+ * @extends Annotation.CrookedLine
+ * @memberOf Annotation
+ */
+function InfinityLine() {
+    CrookedLine.apply(this, arguments);
+}
+
+InfinityLine.findEdgeCoordinate = function (
+    firstPoint,
+    secondPoint,
+    xOrY,
+    edgePointFirstCoordinate
+) {
+    var xOrYOpposite = xOrY === 'x' ? 'y' : 'x';
+
+    // solves equation for x or y
+    // y - y1 = (y2 - y1) / (x2 - x1) * (x - x1)
+    return (
+        (secondPoint[xOrY] - firstPoint[xOrY]) *
+        (edgePointFirstCoordinate - firstPoint[xOrYOpposite]) /
+        (secondPoint[xOrYOpposite] - firstPoint[xOrYOpposite]) +
+        firstPoint[xOrY]
+    );
+};
+
+InfinityLine.findEdgePoint = function (firstPoint, secondPoint) {
+    var xAxis = firstPoint.series.xAxis,
+        yAxis = secondPoint.series.yAxis,
+        firstPointPixels = MockPoint.pointToPixels(firstPoint),
+        secondPointPixels = MockPoint.pointToPixels(secondPoint),
+        deltaX = secondPointPixels.x - firstPointPixels.x,
+        deltaY = secondPointPixels.y - firstPointPixels.y,
+        xAxisMin = xAxis.left,
+        xAxisMax = xAxisMin + xAxis.width,
+        yAxisMin = yAxis.top,
+        yAxisMax = yAxisMin + yAxis.height,
+        xLimit = deltaX < 0 ? xAxisMin : xAxisMax,
+        yLimit = deltaY < 0 ? yAxisMin : yAxisMax,
+        edgePoint = {
+            x: deltaX === 0 ? firstPointPixels.x : xLimit,
+            y: deltaY === 0 ? firstPointPixels.y : yLimit
+        },
+        edgePointX,
+        edgePointY,
+        swap;
+
+    if (deltaX !== 0 && deltaY !== 0) {
+        edgePointY = InfinityLine.findEdgeCoordinate(
+            firstPointPixels,
+            secondPointPixels,
+            'y',
+            xLimit
+        );
+
+        edgePointX = InfinityLine.findEdgeCoordinate(
+            firstPointPixels,
+            secondPointPixels,
+            'x',
+            yLimit
+        );
+
+        if (edgePointY >= yAxisMin && edgePointY <= yAxisMax) {
+            edgePoint.x = xLimit;
+            edgePoint.y = edgePointY;
+        } else {
+            edgePoint.x = edgePointX;
+            edgePoint.y = yLimit;
+        }
+    }
+
+    edgePoint.x -= xAxisMin;
+    edgePoint.y -= yAxisMin;
+
+    if (firstPoint.series.chart.inverted) {
+        swap = edgePoint.x;
+        edgePoint.x = edgePoint.y;
+        edgePoint.y = swap;
+    }
+
+    return edgePoint;
+};
+
+var edgePoint = function (startIndex, endIndex) {
+    return function (target) {
+        var annotation = target.annotation,
+            points = annotation.points,
+            type = annotation.options.typeOptions.type;
+
+        if (type === 'horizontalLine') {
+            // Horizontal line has only one point,
+            // make a copy of it:
+            points = [
+                points[0],
+                new MockPoint(
+                    annotation.chart,
+                    points[0].target,
+                    {
+                        x: points[0].x + 1,
+                        y: points[0].y,
+                        xAxis: points[0].options.xAxis,
+                        yAxis: points[0].options.yAxis
+                    }
+                )
+            ];
+        } else if (type === 'verticalLine') {
+            // The same for verticalLine type:
+            points = [
+                points[0],
+                new MockPoint(
+                    annotation.chart,
+                    points[0].target,
+                    {
+                        x: points[0].x,
+                        y: points[0].y + 1,
+                        xAxis: points[0].options.xAxis,
+                        yAxis: points[0].options.yAxis
+                    }
+                )
+            ];
+        }
+
+        return InfinityLine.findEdgePoint(
+            points[startIndex],
+            points[endIndex]
+        );
+    };
+};
+
+InfinityLine.endEdgePoint = edgePoint(0, 1);
+InfinityLine.startEdgePoint = edgePoint(1, 0);
+
+H.extendAnnotation(
+    InfinityLine,
+    CrookedLine,
+    /** @lends Annotation.InfinityLine# */{
+        addShapes: function () {
+            var typeOptions = this.options.typeOptions,
+                points = [
+                    this.points[0],
+                    InfinityLine.endEdgePoint
+                ];
+
+            if (typeOptions.type.match(/Line/g)) {
+                points[0] = InfinityLine.startEdgePoint;
+            }
+
+            var line = this.initShape(
+                H.merge(typeOptions.line, {
+                    type: 'path',
+                    points: points
+                }),
+                false
+            );
+
+            typeOptions.line = line.options;
+        }
+
+    }
+);
+
+/**
+ * An infinity line annotation.
+ *
+ * @extends annotations.crookedLine
+ * @sample highcharts/annotations-advanced/infinity-line/
+ *         Infinity Line
+ *
+ * @product highstock
+ *
+ * @apioption annotations.infinityLine
+ */
+
+Annotation.types.infinityLine = InfinityLine;
+
+export default InfinityLine;

public/js_lib/Highcharts/code/es-modules/annotations/types/Measure.js

@@ -0,0 +1,928 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    ControlPoint = Annotation.ControlPoint,
+    merge = H.merge,
+    isNumber = H.isNumber;
+
+/**
+ * @class
+ * @extends Annotation
+ * @memberOf Annotation
+ */
+function Measure() {
+    Annotation.apply(this, arguments);
+}
+
+Annotation.types.measure = Measure;
+
+H.extendAnnotation(Measure, null,
+    /** @lends Annotation.Measure# */
+    {
+        /**
+         *
+         * Init annotation object.
+         *
+         */
+        init: function () {
+            Annotation.prototype.init.apply(this, arguments);
+
+            this.offsetX = 0;
+            this.offsetY = 0;
+            this.resizeX = 0;
+            this.resizeY = 0;
+
+            this.calculations.init.call(this);
+            this.addValues();
+            this.addShapes();
+        },
+
+        /**
+         * Overrides default setter to get axes from typeOptions.
+         */
+        setClipAxes: function () {
+            this.clipXAxis = this.chart.xAxis[this.options.typeOptions.xAxis];
+            this.clipYAxis = this.chart.yAxis[this.options.typeOptions.yAxis];
+        },
+
+        /**
+         * Get measure points configuration objects.
+         *
+         * @return {Array<Highcharts.MockPointOptions>}
+         */
+        pointsOptions: function () {
+            return this.options.options.points;
+        },
+
+        /**
+         * Get points configuration objects for shapes.
+         *
+         * @return {Array<Highcharts.MockPointOptions>}
+         */
+        shapePointsOptions: function () {
+
+            var options = this.options.typeOptions,
+                xAxis = options.xAxis,
+                yAxis = options.yAxis;
+
+            return [
+                {
+                    x: this.xAxisMin,
+                    y: this.yAxisMin,
+                    xAxis: xAxis,
+                    yAxis: yAxis
+                },
+                {
+                    x: this.xAxisMax,
+                    y: this.yAxisMin,
+                    xAxis: xAxis,
+                    yAxis: yAxis
+                },
+                {
+                    x: this.xAxisMax,
+                    y: this.yAxisMax,
+                    xAxis: xAxis,
+                    yAxis: yAxis
+                },
+                {
+                    x: this.xAxisMin,
+                    y: this.yAxisMax,
+                    xAxis: xAxis,
+                    yAxis: yAxis
+                }
+            ];
+        },
+
+        addControlPoints: function () {
+            var selectType = this.options.typeOptions.selectType,
+                controlPoint;
+
+            controlPoint = new ControlPoint(
+                this.chart,
+                this,
+                this.options.controlPointOptions,
+                0
+            );
+
+            this.controlPoints.push(controlPoint);
+
+            // add extra controlPoint for horizontal and vertical range
+            if (selectType !== 'xy') {
+                controlPoint = new ControlPoint(
+                    this.chart,
+                    this,
+                    this.options.controlPointOptions,
+                    1
+                );
+
+                this.controlPoints.push(controlPoint);
+            }
+        },
+        /**
+         * Add label with calculated values (min, max, average, bins).
+         *
+         * @param {Boolean} resize - the flag for resize shape
+         *
+         */
+        addValues: function (resize) {
+            var options = this.options.typeOptions,
+                formatter = options.label.formatter,
+                typeOptions = this.options.typeOptions,
+                chart = this.chart,
+                inverted = chart.options.chart.inverted,
+                xAxis = chart.xAxis[typeOptions.xAxis],
+                yAxis = chart.yAxis[typeOptions.yAxis];
+
+            // set xAxisMin, xAxisMax, yAxisMin, yAxisMax
+            this.calculations.recalculate.call(this, resize);
+
+            if (!options.label.enabled) {
+                return;
+            }
+
+            if (this.labels.length > 0) {
+                this.labels[0].text = (formatter && formatter.call(this)) ||
+                            this.calculations.defaultFormatter.call(this);
+
+            } else {
+                this.initLabel(H.extend({
+                    shape: 'rect',
+                    backgroundColor: 'none',
+                    color: 'black',
+                    borderWidth: 0,
+                    dashStyle: 'dash',
+                    overflow: 'none',
+                    align: 'left',
+                    vertical: 'top',
+                    crop: true,
+                    point: function (target) {
+                        var annotation = target.annotation,
+                            top = chart.plotTop,
+                            left = chart.plotLeft;
+
+                        return {
+                            x: (inverted ? top : 10) +
+                                xAxis.toPixels(annotation.xAxisMin, !inverted),
+                            y: (inverted ? -left + 10 : top) +
+                                yAxis.toPixels(annotation.yAxisMin)
+                        };
+                    },
+                    text: (formatter && formatter.call(this)) ||
+                        this.calculations.defaultFormatter.call(this)
+                }, options.label));
+            }
+        },
+        /**
+         * add shapes - crosshair, background (rect)
+         *
+         */
+        addShapes: function () {
+            this.addCrosshairs();
+            this.addBackground();
+        },
+
+        /**
+         * Add background shape.
+         */
+        addBackground: function () {
+            var shapePoints = this.shapePointsOptions();
+
+            if (shapePoints[0].x === undefined) {
+                return;
+            }
+
+            this.initShape(H.extend({
+                type: 'path',
+                points: this.shapePointsOptions()
+            }, this.options.typeOptions.background), false);
+        },
+
+        /**
+         * Add internal crosshair shapes (on top and bottom)
+         */
+        addCrosshairs: function () {
+            var chart = this.chart,
+                options = this.options.typeOptions,
+                point = this.options.typeOptions.point,
+                xAxis = chart.xAxis[options.xAxis],
+                yAxis = chart.yAxis[options.yAxis],
+                inverted = chart.options.chart.inverted,
+                xAxisMin = xAxis.toPixels(this.xAxisMin),
+                xAxisMax = xAxis.toPixels(this.xAxisMax),
+                yAxisMin = yAxis.toPixels(this.yAxisMin),
+                yAxisMax = yAxis.toPixels(this.yAxisMax),
+                defaultOptions = {
+                    point: point,
+                    type: 'path'
+                },
+                pathH = [],
+                pathV = [],
+                crosshairOptionsX, crosshairOptionsY;
+
+            if (inverted) {
+                xAxisMin = yAxis.toPixels(this.yAxisMin);
+                xAxisMax = yAxis.toPixels(this.yAxisMax);
+                yAxisMin = xAxis.toPixels(this.xAxisMin);
+                yAxisMax = xAxis.toPixels(this.xAxisMax);
+            }
+            // horizontal line
+            if (options.crosshairX.enabled) {
+                pathH = [
+                    'M',
+                    xAxisMin,
+                    yAxisMin + ((yAxisMax - yAxisMin) / 2),
+                    'L',
+                    xAxisMax,
+                    yAxisMin + ((yAxisMax - yAxisMin) / 2)
+                ];
+            }
+
+            // vertical line
+            if (options.crosshairY.enabled) {
+                pathV = [
+                    'M',
+                    xAxisMin + ((xAxisMax - xAxisMin) / 2),
+                    yAxisMin,
+                    'L',
+                    xAxisMin + ((xAxisMax - xAxisMin) / 2),
+                    yAxisMax
+                ];
+            }
+
+            // Update existed crosshair
+            if (this.shapes.length > 0) {
+
+                this.shapes[0].options.d = pathH;
+                this.shapes[1].options.d = pathV;
+
+            } else {
+
+                // Add new crosshairs
+                crosshairOptionsX = merge(defaultOptions, options.crosshairX);
+                crosshairOptionsY = merge(defaultOptions, options.crosshairY);
+
+                this.initShape(H.extend({
+                    d: pathH
+                }, crosshairOptionsX), false);
+
+                this.initShape(H.extend({
+                    d: pathV
+                }, crosshairOptionsY), false);
+
+            }
+        },
+
+        onDrag: function (e) {
+            var translation = this.mouseMoveToTranslation(e),
+                selectType = this.options.typeOptions.selectType,
+                x = selectType === 'y' ? 0 : translation.x,
+                y = selectType === 'x' ? 0 : translation.y;
+
+            this.translate(x, y);
+
+            this.offsetX += x;
+            this.offsetY += y;
+
+            // animation, resize, setStartPoints
+            this.redraw(false, false, true);
+        },
+
+        /**
+         * Translate start or end ("left" or "right") side of the measure.
+         * Update start points (startXMin, startXMax, startYMin, startYMax)
+         *
+         * @param {number} dx - the amount of x translation
+         * @param {number} dy - the amount of y translation
+         * @param {number} cpIndex - index of control point
+         * @param {number} selectType - x / y / xy
+         */
+        resize: function (dx, dy, cpIndex, selectType) {
+
+            // background shape
+            var bckShape = this.shapes[2];
+
+            if (selectType === 'x') {
+                if (cpIndex === 0) {
+                    bckShape.translatePoint(dx, 0, 0);
+                    bckShape.translatePoint(dx, dy, 3);
+                } else {
+                    bckShape.translatePoint(dx, 0, 1);
+                    bckShape.translatePoint(dx, dy, 2);
+                }
+            } else if (selectType === 'y') {
+                if (cpIndex === 0) {
+                    bckShape.translatePoint(0, dy, 0);
+                    bckShape.translatePoint(0, dy, 1);
+                } else {
+                    bckShape.translatePoint(0, dy, 2);
+                    bckShape.translatePoint(0, dy, 3);
+                }
+            } else {
+                bckShape.translatePoint(dx, 0, 1);
+                bckShape.translatePoint(dx, dy, 2);
+                bckShape.translatePoint(0, dy, 3);
+            }
+
+            this.calculations.updateStartPoints
+                .call(this, false, true, cpIndex, dx, dy);
+
+            this.options.typeOptions.background.height = Math.abs(
+                this.startYMax - this.startYMin
+            );
+
+            this.options.typeOptions.background.width = Math.abs(
+                this.startXMax - this.startXMin
+            );
+        },
+        /**
+         * Redraw event which render elements and update start points
+         * if needed
+         *
+         * @param {Boolean} animation
+         * @param {Boolean} resize - flag if resized
+         * @param {Boolean} setStartPoints - update position of start points
+         */
+        redraw: function (animation, resize, setStartPoints) {
+
+            this.linkPoints();
+
+            if (!this.graphic) {
+                this.render();
+            }
+
+            if (setStartPoints) {
+                this.calculations.updateStartPoints.call(this, true, false);
+            }
+
+            this.addValues(resize);
+            this.addCrosshairs();
+            this.redrawItems(this.shapes, animation);
+            this.redrawItems(this.labels, animation);
+
+            // redraw control point to run positioner
+            this.controlPoints.forEach(function (controlPoint) {
+                controlPoint.redraw();
+            });
+        },
+        translate: function (dx, dy) {
+            this.shapes.forEach(function (item) {
+                item.translate(dx, dy);
+            });
+
+            this.options.typeOptions.point.x = this.startXMin;
+            this.options.typeOptions.point.y = this.startYMin;
+        },
+        calculations: {
+            /*
+            * Set starting points
+            */
+            init: function () {
+                var options = this.options.typeOptions,
+                    chart = this.chart,
+                    getPointPos = this.calculations.getPointPos,
+                    inverted = chart.options.chart.inverted,
+                    xAxis = chart.xAxis[options.xAxis],
+                    yAxis = chart.yAxis[options.yAxis],
+                    bck = options.background,
+                    width = inverted ? bck.height : bck.width,
+                    height = inverted ? bck.width : bck.height,
+                    selectType = options.selectType,
+                    top = chart.plotTop,
+                    left = chart.plotLeft;
+
+                this.startXMin = options.point.x;
+                this.startYMin = options.point.y;
+
+                if (isNumber(width)) {
+                    this.startXMax = this.startXMin + width;
+                } else {
+                    this.startXMax = getPointPos(
+                        xAxis,
+                        this.startXMin,
+                        parseFloat(width)
+                    );
+                }
+
+                if (isNumber(height)) {
+                    this.startYMax = this.startYMin - height;
+                } else {
+                    this.startYMax = getPointPos(
+                        yAxis,
+                        this.startYMin,
+                        parseFloat(height)
+                    );
+                }
+
+                // x / y selection type
+                if (selectType === 'x') {
+                    this.startYMin = yAxis.toValue(top);
+                    this.startYMax = yAxis.toValue(top + chart.plotHeight);
+                } else if (selectType === 'y') {
+                    this.startXMin = xAxis.toValue(left);
+                    this.startXMax = xAxis.toValue(left + chart.plotWidth);
+                }
+
+            },
+            /*
+            * Set current xAxisMin, xAxisMax, yAxisMin, yAxisMax.
+            * Calculations of measure values (min, max, average, bins).
+            *
+            * @param {Boolean} resize - flag if shape is resized
+            */
+            recalculate: function (resize) {
+                var calc = this.calculations,
+                    options = this.options.typeOptions,
+                    xAxis = this.chart.xAxis[options.xAxis],
+                    yAxis = this.chart.yAxis[options.yAxis],
+                    getPointPos = this.calculations.getPointPos,
+                    offsetX = this.offsetX,
+                    offsetY = this.offsetY;
+
+                this.xAxisMin = getPointPos(xAxis, this.startXMin, offsetX);
+                this.xAxisMax = getPointPos(xAxis, this.startXMax, offsetX);
+                this.yAxisMin = getPointPos(yAxis, this.startYMin, offsetY);
+                this.yAxisMax = getPointPos(yAxis, this.startYMax, offsetY);
+
+                this.min = calc.min.call(this);
+                this.max = calc.max.call(this);
+                this.average = calc.average.call(this);
+                this.bins = calc.bins.call(this);
+
+                if (resize) {
+                    this.resize(0, 0);
+                }
+
+            },
+            /*
+            * Set current xAxisMin, xAxisMax, yAxisMin, yAxisMax.
+            * Calculations of measure values (min, max, average, bins).
+            *
+            * @param {Object} axis - x or y axis reference
+            * @param {Number} value - point's value (x or y)
+            * @param {Number} offset - amount of pixels
+            */
+            getPointPos: function (axis, value, offset) {
+                return axis.toValue(
+                    axis.toPixels(value) + offset
+                );
+            },
+            /*
+            * Update position of start points
+            * (startXMin, startXMax, startYMin, startYMax)
+            *
+            * @param {Boolean} redraw - flag if shape is redraw
+            * @param {Boolean} resize - flag if shape is resized
+            * @param {Boolean} cpIndex - index of controlPoint
+            */
+            updateStartPoints: function (redraw, resize, cpIndex, dx, dy) {
+                var options = this.options.typeOptions,
+                    selectType = options.selectType,
+                    xAxis = this.chart.xAxis[options.xAxis],
+                    yAxis = this.chart.yAxis[options.yAxis],
+                    getPointPos = this.calculations.getPointPos,
+                    startXMin = this.startXMin,
+                    startXMax = this.startXMax,
+                    startYMin = this.startYMin,
+                    startYMax = this.startYMax,
+                    offsetX = this.offsetX,
+                    offsetY = this.offsetY;
+
+                if (resize) {
+                    if (selectType === 'x') {
+                        if (cpIndex === 0) {
+                            this.startXMin = getPointPos(xAxis, startXMin, dx);
+                        } else {
+                            this.startXMax = getPointPos(xAxis, startXMax, dx);
+                        }
+                    } else if (selectType === 'y') {
+                        if (cpIndex === 0) {
+                            this.startYMin = getPointPos(yAxis, startYMin, dy);
+                        } else {
+                            this.startYMax = getPointPos(yAxis, startYMax, dy);
+                        }
+                    } else {
+                        this.startXMax = getPointPos(xAxis, startXMax, dx);
+                        this.startYMax = getPointPos(yAxis, startYMax, dy);
+                    }
+                }
+
+                if (redraw) {
+                    this.startXMin = getPointPos(xAxis, startXMin, offsetX);
+                    this.startXMax = getPointPos(xAxis, startXMax, offsetX);
+                    this.startYMin = getPointPos(yAxis, startYMin, offsetY);
+                    this.startYMax = getPointPos(yAxis, startYMax, offsetY);
+
+                    this.offsetX = 0;
+                    this.offsetY = 0;
+                }
+            },
+            /*
+            * Default formatter of label's content
+            */
+            defaultFormatter: function () {
+                return 'Min: ' + this.min +
+                    '<br>Max: ' + this.max +
+                    '<br>Average: ' + this.average +
+                    '<br>Bins: ' + this.bins;
+            },
+            /*
+            * Set values for xAxisMin, xAxisMax, yAxisMin, yAxisMax, also
+            * when chart is inverted
+            */
+            getExtremes: function (xAxisMin, xAxisMax, yAxisMin, yAxisMax) {
+                return {
+                    xAxisMin: Math.min(xAxisMax, xAxisMin),
+                    xAxisMax: Math.max(xAxisMax, xAxisMin),
+                    yAxisMin: Math.min(yAxisMax, yAxisMin),
+                    yAxisMax: Math.max(yAxisMax, yAxisMin)
+                };
+            },
+            /*
+            * Definitions of calculations (min, max, average, bins)
+            */
+            min: function () {
+                var min = Infinity,
+                    series = this.chart.series,
+                    ext = this.calculations.getExtremes(
+                        this.xAxisMin,
+                        this.xAxisMax,
+                        this.yAxisMin,
+                        this.yAxisMax
+                    ),
+                    isCalculated = false; // to avoid Infinity in formatter
+
+                series.forEach(function (serie) {
+                    if (
+                        serie.visible &&
+                        serie.options.id !== 'highcharts-navigator-series'
+                    ) {
+                        serie.points.forEach(function (point) {
+                            if (
+                                !point.isNull &&
+                                point.y < min &&
+                                point.x > ext.xAxisMin &&
+                                point.x <= ext.xAxisMax &&
+                                point.y > ext.yAxisMin &&
+                                point.y <= ext.yAxisMax
+                            ) {
+                                min = point.y;
+                                isCalculated = true;
+                            }
+                        });
+                    }
+                });
+
+                if (!isCalculated) {
+                    min = '';
+                }
+
+                return min;
+            },
+            max: function () {
+                var max = -Infinity,
+                    series = this.chart.series,
+                    ext = this.calculations.getExtremes(
+                        this.xAxisMin,
+                        this.xAxisMax,
+                        this.yAxisMin,
+                        this.yAxisMax
+                    ),
+                    isCalculated = false; // to avoid Infinity in formatter
+
+                series.forEach(function (serie) {
+                    if (
+                        serie.visible &&
+                        serie.options.id !== 'highcharts-navigator-series'
+                    ) {
+                        serie.points.forEach(function (point) {
+                            if (
+                                !point.isNull &&
+                                point.y > max &&
+                                point.x > ext.xAxisMin &&
+                                point.x <= ext.xAxisMax &&
+                                point.y > ext.yAxisMin &&
+                                point.y <= ext.yAxisMax
+                            ) {
+                                max = point.y;
+                                isCalculated = true;
+                            }
+                        });
+                    }
+                });
+
+                if (!isCalculated) {
+                    max = '';
+                }
+
+                return max;
+            },
+            average: function () {
+                var average = '';
+
+                if (this.max !== '' && this.min !== '') {
+                    average = (this.max + this.min) / 2;
+                }
+
+                return average;
+            },
+            bins: function () {
+                var bins = 0,
+                    series = this.chart.series,
+                    ext = this.calculations.getExtremes(
+                        this.xAxisMin,
+                        this.xAxisMax,
+                        this.yAxisMin,
+                        this.yAxisMax
+                    ),
+                    isCalculated = false; // to avoid Infinity in formatter
+
+                series.forEach(function (serie) {
+                    if (
+                        serie.visible &&
+                        serie.options.id !== 'highcharts-navigator-series'
+                    ) {
+                        serie.points.forEach(function (point) {
+                            if (
+                                !point.isNull &&
+                                point.x > ext.xAxisMin &&
+                                point.x <= ext.xAxisMax &&
+                                point.y > ext.yAxisMin &&
+                                point.y <= ext.yAxisMax
+                            ) {
+                                bins++;
+                                isCalculated = true;
+                            }
+                        });
+                    }
+                });
+
+                if (!isCalculated) {
+                    bins = '';
+                }
+
+                return bins;
+            }
+        }
+    },
+    /**
+     * A measure annotation.
+     *
+     * @extends annotations.crookedLine
+     * @excluding labels, labelOptions, shapes, shapeOptions
+     * @sample highcharts/annotations-advanced/measure/
+     *         Measure
+     * @product highstock
+     * @optionparent annotations.measure
+     */
+    {
+        typeOptions: {
+            /**
+             * Decides in what dimensions the user can resize by dragging the
+             * mouse. Can be one of x, y or xy.
+             */
+            selectType: 'xy',
+            /**
+             * This number defines which xAxis the point is connected to.
+             * It refers to either the axis id or the index of the axis
+             * in the xAxis array.
+             */
+            xAxis: 0,
+            /**
+             * This number defines which yAxis the point is connected to.
+             * It refers to either the axis id or the index of the axis
+             * in the yAxis array.
+             */
+            yAxis: 0,
+            background: {
+                /**
+                 * The color of the rectangle.
+                 */
+                fill: 'rgba(130, 170, 255, 0.4)',
+                /**
+                 * The width of border.
+                 */
+                strokeWidth: 0,
+                /**
+                 * The color of border.
+                 */
+                stroke: undefined
+            },
+            /**
+             * Configure a crosshair that is horizontally placed in middle of
+             * rectangle.
+             *
+             */
+            crosshairX: {
+                /**
+                 * Enable or disable the horizontal crosshair.
+                 *
+                 */
+                enabled: true,
+                /**
+                 * The Z index of the crosshair in annotation.
+                 */
+                zIndex: 6,
+                /**
+                 * The dash or dot style of the crosshair's line. For possible
+                 * values, see
+                 * [this demonstration](https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-dashstyle-all/).
+                 *
+                 * @type    {Highcharts.DashStyleType}
+                 * @default Dash
+                 */
+                dashStyle: 'Dash',
+                /**
+                 * The marker-end defines the arrowhead that will be drawn
+                 * at the final vertex of the given crosshair's path.
+                 *
+                 * @type       {string}
+                 * @default    arrow
+                 */
+                markerEnd: 'arrow'
+            },
+            /**
+             * Configure a crosshair that is vertically placed in middle of
+             * rectangle.
+             */
+            crosshairY: {
+                /**
+                 * Enable or disable the vertical crosshair.
+                 *
+                 */
+                enabled: true,
+                /**
+                 * The Z index of the crosshair in annotation.
+                 */
+                zIndex: 6,
+                /**
+                 * The dash or dot style of the crosshair's line. For possible
+                 * values, see [this demonstration](https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-dashstyle-all/).
+                 *
+                 * @type      {Highcharts.DashStyleType}
+                 * @default   Dash
+                 * @apioption annotations.measure.typeOptions.crosshairY.dashStyle
+                 *
+                 */
+                dashStyle: 'Dash',
+                /**
+                 * The marker-end defines the arrowhead that will be drawn
+                 * at the final vertex of the given crosshair's path.
+                 *
+                 * @type       {string}
+                 * @default    arrow
+                 * @validvalue ["none", "arrow"]
+                 *
+                 */
+                markerEnd: 'arrow'
+            },
+            label: {
+                /**
+                 * Enable or disable the label text (min, max, average,
+                 * bins values).
+                 *
+                 * Defaults to true.
+                 */
+                enabled: true,
+                /**
+                 * CSS styles for the measure label.
+                 *
+                 * @type    {Highcharts.CSSObject}
+                 * @default {"color": "#666666", "fontSize": "11px"}
+                 */
+                style: {
+                    fontSize: '11px',
+                    color: '#666666'
+                },
+                /**
+                 * Formatter function for the label text.
+                 *
+                 * Available data are:
+                 *
+                 * <table>
+                 *
+                 * <tbody>
+                 *
+                 * <tr>
+                 *
+                 * <td>`this.min`</td>
+                 *
+                 * <td>The mininimum value of the points in the selected
+                 * range.</td>
+                 *
+                 * </tr>
+                 *
+                 * <tr>
+                 *
+                 * <td>`this.max`</td>
+                 *
+                 * <td>The maximum value of the points in the selected
+                 * range.</td>
+                 *
+                 * </tr>
+                 *
+                 * <tr>
+                 *
+                 * <td>`this.average`</td>
+                 *
+                 * <td>The average value of the points in the selected
+                 * range.</td>
+                 *
+                 * </tr>
+                 *
+                 * <tr>
+                 *
+                 * <td>`this.bins`</td>
+                 *
+                 * <td>The amount of the points in the selected range.</td>
+                 *
+                 * </tr>
+                 *
+                 * </table>
+                 *
+                 * @type      {function}
+                 *
+                 */
+                formatter: undefined
+            }
+        },
+        controlPointOptions: {
+            positioner: function (target) {
+                var cpIndex = this.index,
+                    chart = target.chart,
+                    options = target.options,
+                    typeOptions = options.typeOptions,
+                    selectType = typeOptions.selectType,
+                    controlPointOptions = options.controlPointOptions,
+                    inverted = chart.options.chart.inverted,
+                    xAxis = chart.xAxis[typeOptions.xAxis],
+                    yAxis = chart.yAxis[typeOptions.yAxis],
+                    targetX = target.xAxisMax,
+                    targetY = target.yAxisMax,
+                    ext = target.calculations.getExtremes(
+                        target.xAxisMin,
+                        target.xAxisMax,
+                        target.yAxisMin,
+                        target.yAxisMax
+                    ),
+                    x, y;
+
+                if (selectType === 'x') {
+                    targetY = (ext.yAxisMax - ext.yAxisMin) / 2;
+
+                    // first control point
+                    if (cpIndex === 0) {
+                        targetX = target.xAxisMin;
+                    }
+                }
+
+                if (selectType === 'y') {
+                    targetX = ext.xAxisMin +
+                                        ((ext.xAxisMax - ext.xAxisMin) / 2);
+
+                    // first control point
+                    if (cpIndex === 0) {
+                        targetY = target.yAxisMin;
+                    }
+                }
+
+                if (inverted) {
+                    x = yAxis.toPixels(targetY);
+                    y = xAxis.toPixels(targetX);
+                } else {
+                    x = xAxis.toPixels(targetX);
+                    y = yAxis.toPixels(targetY);
+                }
+
+                return {
+                    x: x - (controlPointOptions.width / 2),
+                    y: y - (controlPointOptions.height / 2)
+                };
+            },
+            events: {
+                drag: function (e, target) {
+                    var translation = this.mouseMoveToTranslation(e),
+                        selectType = target.options.typeOptions.selectType,
+                        index = this.index,
+                        x = selectType === 'y' ? 0 : translation.x,
+                        y = selectType === 'x' ? 0 : translation.y;
+
+                    target.resize(
+                        x,
+                        y,
+                        index,
+                        selectType
+                    );
+
+                    target.resizeX += x;
+                    target.resizeY += y;
+                    target.redraw(false, true);
+                }
+            }
+        }
+    });
+
+Annotation.types.measure = Measure;
+
+export default Measure;

public/js_lib/Highcharts/code/es-modules/annotations/types/Pitchfork.js

@@ -0,0 +1,203 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    MockPoint = Annotation.MockPoint,
+    InfinityLine = Annotation.types.infinityLine;
+
+/**
+ * @class
+ * @extends Highcharts.InfinityLine
+ * @memberOf Highcharts
+ **/
+function Pitchfork() {
+    InfinityLine.apply(this, arguments);
+}
+
+Pitchfork.findEdgePoint = function (
+    point,
+    firstAnglePoint,
+    secondAnglePoint
+) {
+    var angle = Math.atan2(
+            secondAnglePoint.plotY - firstAnglePoint.plotY,
+            secondAnglePoint.plotX - firstAnglePoint.plotX
+        ),
+        distance = 1e7;
+
+    return {
+        x: point.plotX + distance * Math.cos(angle),
+        y: point.plotY + distance * Math.sin(angle)
+    };
+};
+
+Pitchfork.middleLineEdgePoint = function (target) {
+    var annotation = target.annotation,
+        points = annotation.points;
+
+    return InfinityLine.findEdgePoint(
+        points[0],
+        new MockPoint(
+            annotation.chart,
+            target,
+            annotation.midPointOptions()
+        )
+    );
+};
+
+var outerLineEdgePoint = function (firstPointIndex) {
+    return function (target) {
+        var annotation = target.annotation,
+            points = annotation.points;
+
+        return Pitchfork.findEdgePoint(
+            points[firstPointIndex],
+            points[0],
+            new MockPoint(
+                annotation.chart,
+                target,
+                annotation.midPointOptions()
+            )
+        );
+    };
+};
+
+Pitchfork.topLineEdgePoint = outerLineEdgePoint(1);
+Pitchfork.bottomLineEdgePoint = outerLineEdgePoint(0);
+
+H.extendAnnotation(Pitchfork, InfinityLine,
+    {
+        midPointOptions: function () {
+            var points = this.points;
+
+            return {
+                x: (points[1].x + points[2].x) / 2,
+                y: (points[1].y + points[2].y) / 2,
+                xAxis: points[0].series.xAxis,
+                yAxis: points[0].series.yAxis
+            };
+        },
+
+        addShapes: function () {
+            this.addLines();
+            this.addBackgrounds();
+        },
+
+        addLines: function () {
+            this.initShape({
+                type: 'path',
+                points: [
+                    this.points[0],
+                    Pitchfork.middleLineEdgePoint
+                ]
+            }, false);
+
+            this.initShape({
+                type: 'path',
+                points: [
+                    this.points[1],
+                    Pitchfork.topLineEdgePoint
+                ]
+            }, false);
+
+            this.initShape({
+                type: 'path',
+                points: [
+                    this.points[2],
+                    Pitchfork.bottomLineEdgePoint
+                ]
+            }, false);
+        },
+
+        addBackgrounds: function () {
+            var shapes = this.shapes,
+                typeOptions = this.options.typeOptions;
+
+            var innerBackground = this.initShape(
+                H.merge(typeOptions.innerBackground, {
+                    type: 'path',
+                    points: [
+                        function (target) {
+                            var annotation = target.annotation,
+                                points = annotation.points,
+                                midPointOptions = annotation.midPointOptions();
+
+                            return {
+                                x: (points[1].x + midPointOptions.x) / 2,
+                                y: (points[1].y + midPointOptions.y) / 2,
+                                xAxis: midPointOptions.xAxis,
+                                yAxis: midPointOptions.yAxis
+                            };
+                        },
+                        shapes[1].points[1],
+                        shapes[2].points[1],
+                        function (target) {
+                            var annotation = target.annotation,
+                                points = annotation.points,
+                                midPointOptions = annotation.midPointOptions();
+
+                            return {
+                                x: (midPointOptions.x + points[2].x) / 2,
+                                y: (midPointOptions.y + points[2].y) / 2,
+                                xAxis: midPointOptions.xAxis,
+                                yAxis: midPointOptions.yAxis
+                            };
+                        }
+                    ]
+                })
+            );
+
+            var outerBackground = this.initShape(
+                H.merge(typeOptions.outerBackground, {
+                    type: 'path',
+                    points: [
+                        this.points[1],
+                        shapes[1].points[1],
+                        shapes[2].points[1],
+                        this.points[2]
+                    ]
+                })
+            );
+
+            typeOptions.innerBackground = innerBackground.options;
+            typeOptions.outerBackground = outerBackground.options;
+        }
+    },
+    /**
+     * A pitchfork annotation.
+     *
+     * @extends annotations.infinityLine
+     * @sample highcharts/annotations-advanced/pitchfork/
+     *         Pitchfork
+     * @product highstock
+     * @optionparent annotations.pitchfork
+     */
+    {
+        typeOptions: {
+            /**
+             * Inner background options.
+             *
+             * @extends annotations.crookedLine.shapeOptions
+             * @excluding height, r, type, width
+             */
+            innerBackground: {
+                fill: 'rgba(130, 170, 255, 0.4)',
+                strokeWidth: 0
+            },
+            /**
+             * Outer background options.
+             *
+             * @extends annotations.crookedLine.shapeOptions
+             * @excluding height, r, type, width
+             */
+            outerBackground: {
+                fill: 'rgba(156, 229, 161, 0.4)',
+                strokeWidth: 0
+            }
+        }
+    });
+
+Annotation.types.pitchfork = Pitchfork;
+
+export default Pitchfork;

public/js_lib/Highcharts/code/es-modules/annotations/types/Tunnel.js

@@ -0,0 +1,242 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    CrookedLine = Annotation.types.crookedLine,
+    ControlPoint = Annotation.ControlPoint,
+    MockPoint = Annotation.MockPoint;
+
+function getSecondCoordinate(p1, p2, x) {
+    return (p2.y - p1.y) / (p2.x - p1.x) * (x - p1.x) + p1.y;
+}
+
+/**
+ * @class
+ * @extends Annotation.CrookedLine
+ * @memberOf Annotation
+ **/
+function Tunnel() {
+    CrookedLine.apply(this, arguments);
+}
+
+H.extendAnnotation(
+    Tunnel,
+    CrookedLine,
+    /** @lends Annotation.Tunnel# */
+    {
+        getPointsOptions: function () {
+            var pointsOptions =
+                CrookedLine.prototype.getPointsOptions.call(this);
+
+            pointsOptions[2] = this.heightPointOptions(pointsOptions[1]);
+            pointsOptions[3] = this.heightPointOptions(pointsOptions[0]);
+
+            return pointsOptions;
+        },
+
+        getControlPointsOptions: function () {
+            return this.getPointsOptions().slice(0, 2);
+        },
+
+        heightPointOptions: function (pointOptions) {
+            var heightPointOptions = H.merge(pointOptions);
+
+            heightPointOptions.y += this.options.typeOptions.height;
+
+            return heightPointOptions;
+        },
+
+        addControlPoints: function () {
+            CrookedLine.prototype.addControlPoints.call(this);
+
+            var options = this.options,
+                controlPoint = new ControlPoint(
+                    this.chart,
+                    this,
+                    H.merge(
+                        options.controlPointOptions,
+                        options.typeOptions.heightControlPoint
+                    ),
+                    2
+                );
+
+            this.controlPoints.push(controlPoint);
+
+            options.typeOptions.heightControlPoint = controlPoint.options;
+        },
+
+        addShapes: function () {
+            this.addLine();
+            this.addBackground();
+        },
+
+        addLine: function () {
+            var line = this.initShape(
+                H.merge(this.options.typeOptions.line, {
+                    type: 'path',
+                    points: [
+                        this.points[0],
+                        this.points[1],
+                        function (target) {
+                            var pointOptions = MockPoint.pointToOptions(
+                                target.annotation.points[2]
+                            );
+
+                            pointOptions.command = 'M';
+
+                            return pointOptions;
+                        },
+                        this.points[3]
+                    ]
+                }),
+                false
+            );
+
+            this.options.typeOptions.line = line.options;
+        },
+
+        addBackground: function () {
+            var background = this.initShape(H.merge(
+                this.options.typeOptions.background,
+                {
+                    type: 'path',
+                    points: this.points.slice()
+                }
+            ));
+
+            this.options.typeOptions.background = background.options;
+        },
+
+        /**
+         * Translate start or end ("left" or "right") side of the tunnel.
+         *
+         * @param {number} dx - the amount of x translation
+         * @param {number} dy - the amount of y translation
+         * @param {boolean} [end] - whether to translate start or end side
+         */
+        translateSide: function (dx, dy, end) {
+            var topIndex = Number(end),
+                bottomIndex = topIndex === 0 ? 3 : 2;
+
+            this.translatePoint(dx, dy, topIndex);
+            this.translatePoint(dx, dy, bottomIndex);
+        },
+
+        /**
+         * Translate height of the tunnel.
+         *
+         * @param {number} dh - the amount of height translation
+         */
+        translateHeight: function (dh) {
+            this.translatePoint(0, dh, 2);
+            this.translatePoint(0, dh, 3);
+
+            this.options.typeOptions.height =
+                this.points[3].y - this.points[0].y;
+        }
+    },
+
+    /**
+     * A tunnel annotation.
+     *
+     * @extends annotations.crookedLine
+     * @sample highcharts/annotations-advanced/tunnel/
+     *         Tunnel
+     * @product highstock
+     * @optionparent annotations.tunnel
+     */
+    {
+        typeOptions: {
+            xAxis: 0,
+            yAxis: 0,
+            /**
+             * Background options.
+             *
+             * @type {Object}
+             * @excluding height, point, points, r, type, width, markerEnd,
+             *            markerStart
+             */
+            background: {
+                fill: 'rgba(130, 170, 255, 0.4)',
+                strokeWidth: 0
+            },
+            line: {
+                strokeWidth: 1
+            },
+            /**
+             * The height of the annotation in terms of yAxis.
+             */
+            height: -2,
+
+
+            /**
+             * Options for the control point which controls
+             * the annotation's height.
+             *
+             * @extends annotations.crookedLine.controlPointOptions
+             * @excluding positioner, events
+             */
+            heightControlPoint: {
+                positioner: function (target) {
+                    var startXY = MockPoint.pointToPixels(target.points[2]),
+                        endXY = MockPoint.pointToPixels(target.points[3]),
+                        x = (startXY.x + endXY.x) / 2;
+
+                    return {
+                        x: x - this.graphic.width / 2,
+                        y: getSecondCoordinate(startXY, endXY, x) -
+                        this.graphic.height / 2
+                    };
+                },
+                events: {
+                    drag: function (e, target) {
+                        if (
+                            target.chart.isInsidePlot(
+                                e.chartX - target.chart.plotLeft,
+                                e.chartY - target.chart.plotTop
+                            )
+                        ) {
+                            target.translateHeight(
+                                this.mouseMoveToTranslation(e).y
+                            );
+
+                            target.redraw(false);
+                        }
+                    }
+                }
+            }
+        },
+
+        /**
+         * @extends annotations.crookedLine.controlPointOptions
+         * @excluding positioner, events
+         */
+        controlPointOptions: {
+            events: {
+                drag: function (e, target) {
+                    if (
+                        target.chart.isInsidePlot(
+                            e.chartX - target.chart.plotLeft,
+                            e.chartY - target.chart.plotTop
+                        )
+                    ) {
+                        var translation = this.mouseMoveToTranslation(e);
+
+                        target.translateSide(
+                            translation.x,
+                            translation.y,
+                            this.index
+                        );
+
+                        target.redraw(false);
+                    }
+                }
+            }
+        }
+    }
+);
+
+Annotation.types.tunnel = Tunnel;
+
+export default Tunnel;

public/js_lib/Highcharts/code/es-modules/annotations/types/VerticalLine.js

@@ -0,0 +1,157 @@
+'use strict';
+import H from '../../parts/Globals.js';
+import '../../parts/Utilities.js';
+
+var Annotation = H.Annotation,
+    MockPoint = Annotation.MockPoint;
+
+/**
+ * @class
+ * @extends Annotation
+ * @memberOf Highcharts
+ **/
+function VerticalLine() {
+    H.Annotation.apply(this, arguments);
+}
+
+VerticalLine.connectorFirstPoint = function (target) {
+    var annotation = target.annotation,
+        point = annotation.points[0],
+        xy = MockPoint.pointToPixels(point, true),
+        y = xy.y,
+        offset = annotation.options.typeOptions.label.offset;
+
+    if (annotation.chart.inverted) {
+        y = xy.x;
+    }
+
+    return {
+        x: point.x,
+        xAxis: point.series.xAxis,
+        y: y + offset
+    };
+};
+
+VerticalLine.connectorSecondPoint = function (target) {
+    var annotation = target.annotation,
+        typeOptions = annotation.options.typeOptions,
+        point = annotation.points[0],
+        yOffset = typeOptions.yOffset,
+        xy = MockPoint.pointToPixels(point, true),
+        y = xy[annotation.chart.inverted ? 'x' : 'y'];
+
+    if (typeOptions.label.offset < 0) {
+        yOffset *= -1;
+    }
+
+    return {
+        x: point.x,
+        xAxis: point.series.xAxis,
+        y: y + yOffset
+    };
+};
+
+H.extendAnnotation(VerticalLine, null,
+
+    /** @lends Annotation.VerticalLine# */
+    {
+        getPointsOptions: function () {
+            return [this.options.typeOptions.point];
+        },
+
+        addShapes: function () {
+            var typeOptions = this.options.typeOptions,
+                connector = this.initShape(
+                    H.merge(typeOptions.connector, {
+                        type: 'path',
+                        points: [
+                            VerticalLine.connectorFirstPoint,
+                            VerticalLine.connectorSecondPoint
+                        ]
+                    }),
+                    false
+                );
+
+            typeOptions.connector = connector.options;
+        },
+
+        addLabels: function () {
+            var typeOptions = this.options.typeOptions,
+                labelOptions = typeOptions.label,
+                x = 0,
+                y = labelOptions.offset,
+                verticalAlign = labelOptions.offset < 0 ? 'bottom' : 'top',
+                align = 'center';
+
+            if (this.chart.inverted) {
+                x = labelOptions.offset;
+                y = 0;
+                verticalAlign = 'middle';
+                align = labelOptions.offset < 0 ? 'right' : 'left';
+            }
+
+            var label = this.initLabel(
+                H.merge(labelOptions, {
+                    verticalAlign: verticalAlign,
+                    align: align,
+                    x: x,
+                    y: y
+                })
+            );
+
+            typeOptions.label = label.options;
+        }
+    },
+
+    /**
+     * A vertical line annotation.
+     *
+     * @extends annotations.crookedLine
+     * @excluding labels, shapes, controlPointOptions
+     * @sample highcharts/annotations-advanced/vertical-line/
+     *         Vertical line
+     * @product highstock
+     * @optionparent annotations.verticalLine
+     */
+    {
+        typeOptions: {
+            /**
+             * @ignore
+             */
+            yOffset: 10,
+
+            /**
+             * Label options.
+             *
+             * @extends annotations.crookedLine.labelOptions
+             */
+            label: {
+                offset: -40,
+                point: function (target) {
+                    return target.annotation.points[0];
+                },
+                allowOverlap: true,
+                backgroundColor: 'none',
+                borderWidth: 0,
+                crop: true,
+                overflow: 'none',
+                shape: 'rect',
+                text: '{y:.2f}'
+            },
+
+            /**
+             * Connector options.
+             *
+             * @extends annotations.crookedLine.shapeOptions
+             * @excluding height, r, type, width
+             */
+            connector: {
+                strokeWidth: 1,
+                markerEnd: 'arrow'
+            }
+        }
+    });
+
+Annotation.types.verticalLine = VerticalLine;
+
+export default VerticalLine;