ps-toolkit-ui 0.0.213 → 0.0.217

package/src/assets/plugins/highcharts/code/es-modules/Extensions/Annotations/NavigationBindings.js

@@ -1,1212 +0,0 @@
-/* *
- *
- *  (c) 2009-2021 Highsoft, Black Label
- *
- *  License: www.highcharts.com/license
- *
- *  !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
-'use strict';
-import Annotation from './Annotations.js';
-import Chart from '../../Core/Chart/Chart.js';
-import ChartNavigationComposition from '../../Core/Chart/ChartNavigationComposition.js';
-import F from '../../Core/FormatUtilities.js';
-var format = F.format;
-import H from '../../Core/Globals.js';
-import D from '../../Core/DefaultOptions.js';
-var setOptions = D.setOptions;
-import U from '../../Core/Utilities.js';
-var addEvent = U.addEvent, attr = U.attr, fireEvent = U.fireEvent, isArray = U.isArray, isFunction = U.isFunction, isNumber = U.isNumber, isObject = U.isObject, merge = U.merge, objectEach = U.objectEach, pick = U.pick;
-/**
- * A config object for navigation bindings in annotations.
- *
- * @interface Highcharts.NavigationBindingsOptionsObject
- */ /**
-* ClassName of the element for a binding.
-* @name Highcharts.NavigationBindingsOptionsObject#className
-* @type {string|undefined}
-*/ /**
-* Last event to be fired after last step event.
-* @name Highcharts.NavigationBindingsOptionsObject#end
-* @type {Function|undefined}
-*/ /**
-* Initial event, fired on a button click.
-* @name Highcharts.NavigationBindingsOptionsObject#init
-* @type {Function|undefined}
-*/ /**
-* Event fired on first click on a chart.
-* @name Highcharts.NavigationBindingsOptionsObject#start
-* @type {Function|undefined}
-*/ /**
-* Last event to be fired after last step event. Array of step events to be
-* called sequentially after each user click.
-* @name Highcharts.NavigationBindingsOptionsObject#steps
-* @type {Array<Function>|undefined}
-*/
-var doc = H.doc, win = H.win, PREFIX = 'highcharts-';
-/* eslint-disable no-invalid-this, valid-jsdoc */
-/**
- * IE 9-11 polyfill for Element.closest():
- * @private
- */
-function closestPolyfill(el, s) {
-    var ElementProto = win.Element.prototype, elementMatches = ElementProto.matches ||
-        ElementProto.msMatchesSelector ||
-        ElementProto.webkitMatchesSelector, ret = null;
-    if (ElementProto.closest) {
-        ret = ElementProto.closest.call(el, s);
-    }
-    else {
-        do {
-            if (elementMatches.call(el, s)) {
-                return el;
-            }
-            el = el.parentElement || el.parentNode;
-        } while (el !== null && el.nodeType === 1);
-    }
-    return ret;
-}
-/**
- * @private
- * @interface bindingsUtils
- */
-var bindingsUtils = {
-    /**
-     * Get field type according to value
-     *
-     * @private
-     * @function Highcharts.NavigationBindingsUtilsObject.getFieldType
-     *
-     * @param {'boolean'|'number'|'string'} value
-     * Atomic type (one of: string, number, boolean)
-     *
-     * @return {'checkbox'|'number'|'text'}
-     * Field type (one of: text, number, checkbox)
-     */
-    getFieldType: function (value) {
-        return {
-            'string': 'text',
-            'number': 'number',
-            'boolean': 'checkbox'
-        }[typeof value];
-    },
-    /**
-     * Update size of background (rect) in some annotations: Measure, Simple
-     * Rect.
-     *
-     * @private
-     * @function Highcharts.NavigationBindingsUtilsObject.updateRectSize
-     *
-     * @param {Highcharts.PointerEventObject} event
-     * Normalized browser event
-     *
-     * @param {Highcharts.Annotation} annotation
-     * Annotation to be updated
-     */
-    updateRectSize: function (event, annotation) {
-        var chart = annotation.chart, options = annotation.options.typeOptions, xAxis = isNumber(options.xAxis) && chart.xAxis[options.xAxis], yAxis = isNumber(options.yAxis) && chart.yAxis[options.yAxis];
-        if (xAxis && yAxis) {
-            var x = xAxis.toValue(event[xAxis.horiz ? 'chartX' : 'chartY']), y = yAxis.toValue(event[yAxis.horiz ? 'chartX' : 'chartY']), width = x - options.point.x, height = options.point.y - y;
-            annotation.update({
-                typeOptions: {
-                    background: {
-                        width: chart.inverted ? height : width,
-                        height: chart.inverted ? width : height
-                    }
-                }
-            });
-        }
-    },
-    /**
-     * Returns the first xAxis or yAxis that was clicked with its value.
-     *
-     * @private
-     * @function Highcharts.NavigationBindingsUtilsObject#getAssignedAxis
-     *
-     * @param {Array<Highcharts.PointerAxisCoordinateObject>} coords
-     *        All the chart's x or y axes with a current pointer's axis value.
-     *
-     * @return {Highcharts.PointerAxisCoordinateObject}
-     *         Object with a first found axis and its value that pointer
-     *         is currently pointing.
-     */
-    getAssignedAxis: function (coords) {
-        return coords.filter(function (coord) {
-            var extremes = coord.axis.getExtremes(), axisMin = extremes.min, axisMax = extremes.max, 
-            // Correct axis edges when axis has series
-            // with pointRange (like column)
-            minPointOffset = pick(coord.axis.minPointOffset, 0);
-            return isNumber(axisMin) && isNumber(axisMax) &&
-                coord.value >= (axisMin - minPointOffset) &&
-                coord.value <= (axisMax + minPointOffset) &&
-                // don't count navigator axis
-                !coord.axis.options.isInternal;
-        })[0]; // If the axes overlap, return the first axis that was found.
-    }
-};
-/**
- * @private
- */
-var NavigationBindings = /** @class */ (function () {
-    /* *
-     *
-     *  Constructors
-     *
-     * */
-    function NavigationBindings(chart, options) {
-        this.boundClassNames = void 0;
-        this.selectedButton = void 0;
-        this.chart = chart;
-        this.options = options;
-        this.eventsToUnbind = [];
-        this.container = doc.getElementsByClassName(this.options.bindingsClassName || '');
-    }
-    // Private properties added by bindings:
-    // Active (selected) annotation that is editted through popup/forms
-    // activeAnnotation: Annotation
-    // Holder for current step, used on mouse move to update bound object
-    // mouseMoveEvent: function () {}
-    // Next event in `step` array to be called on chart's click
-    // nextEvent: function () {}
-    // Index in the `step` array of the current event
-    // stepIndex: 0
-    // Flag to determine if current binding has steps
-    // steps: true|false
-    // Bindings holder for all events
-    // selectedButton: {}
-    // Holder for user options, returned from `start` event, and passed on to
-    // `step`'s' and `end`.
-    // currentUserDetails: {}
-    /* *
-     *
-     *  Functions
-     *
-     * */
-    /**
-     * Initi all events conencted to NavigationBindings.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#initEvents
-     */
-    NavigationBindings.prototype.initEvents = function () {
-        var navigation = this, chart = navigation.chart, bindingsContainer = navigation.container, options = navigation.options;
-        // Shorthand object for getting events for buttons:
-        navigation.boundClassNames = {};
-        objectEach((options.bindings || {}), function (value) {
-            navigation.boundClassNames[value.className] = value;
-        });
-        // Handle multiple containers with the same class names:
-        [].forEach.call(bindingsContainer, function (subContainer) {
-            navigation.eventsToUnbind.push(addEvent(subContainer, 'click', function (event) {
-                var bindings = navigation.getButtonEvents(subContainer, event);
-                if (bindings &&
-                    bindings.button.className
-                        .indexOf('highcharts-disabled-btn') === -1) {
-                    navigation.bindingsButtonClick(bindings.button, bindings.events, event);
-                }
-            }));
-        });
-        objectEach(options.events || {}, function (callback, eventName) {
-            if (isFunction(callback)) {
-                navigation.eventsToUnbind.push(addEvent(navigation, eventName, callback, { passive: false }));
-            }
-        });
-        navigation.eventsToUnbind.push(addEvent(chart.container, 'click', function (e) {
-            if (!chart.cancelClick &&
-                chart.isInsidePlot(e.chartX - chart.plotLeft, e.chartY - chart.plotTop, {
-                    visiblePlotOnly: true
-                })) {
-                navigation.bindingsChartClick(this, e);
-            }
-        }));
-        navigation.eventsToUnbind.push(addEvent(chart.container, H.isTouchDevice ? 'touchmove' : 'mousemove', function (e) {
-            navigation.bindingsContainerMouseMove(this, e);
-        }, H.isTouchDevice ? { passive: false } : void 0));
-    };
-    /**
-     * Common chart.update() delegation, shared between bindings and exporting.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#initUpdate
-     */
-    NavigationBindings.prototype.initUpdate = function () {
-        var navigation = this;
-        ChartNavigationComposition
-            .compose(this.chart).navigation
-            .addUpdate(function (options) {
-            navigation.update(options);
-        });
-    };
-    /**
-     * Hook for click on a button, method selcts/unselects buttons,
-     * then calls `bindings.init` callback.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#bindingsButtonClick
-     *
-     * @param {Highcharts.HTMLDOMElement} [button]
-     *        Clicked button
-     *
-     * @param {Object} events
-     *        Events passed down from bindings (`init`, `start`, `step`, `end`)
-     *
-     * @param {Highcharts.PointerEventObject} clickEvent
-     *        Browser's click event
-     */
-    NavigationBindings.prototype.bindingsButtonClick = function (button, events, clickEvent) {
-        var navigation = this, chart = navigation.chart, svgContainer = chart.renderer.boxWrapper;
-        var shouldEventBeFired = true;
-        if (navigation.selectedButtonElement) {
-            if (navigation.selectedButtonElement.classList === button.classList) {
-                shouldEventBeFired = false;
-            }
-            fireEvent(navigation, 'deselectButton', { button: navigation.selectedButtonElement });
-            if (navigation.nextEvent) {
-                // Remove in-progress annotations adders:
-                if (navigation.currentUserDetails &&
-                    navigation.currentUserDetails.coll === 'annotations') {
-                    chart.removeAnnotation(navigation.currentUserDetails);
-                }
-                navigation.mouseMoveEvent = navigation.nextEvent = false;
-            }
-        }
-        if (shouldEventBeFired) {
-            navigation.selectedButton = events;
-            navigation.selectedButtonElement = button;
-            fireEvent(navigation, 'selectButton', { button: button });
-            // Call "init" event, for example to open modal window
-            if (events.init) {
-                events.init.call(navigation, button, clickEvent);
-            }
-            if (events.start || events.steps) {
-                chart.renderer.boxWrapper.addClass(PREFIX + 'draw-mode');
-            }
-        }
-        else {
-            chart.stockTools && chart.stockTools.toggleButtonAciveClass(button);
-            svgContainer.removeClass(PREFIX + 'draw-mode');
-            navigation.nextEvent = false;
-            navigation.mouseMoveEvent = false;
-            navigation.selectedButton = null;
-        }
-    };
-    /**
-     * Hook for click on a chart, first click on a chart calls `start` event,
-     * then on all subsequent clicks iterate over `steps` array.
-     * When finished, calls `end` event.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#bindingsChartClick
-     *
-     * @param {Highcharts.Chart} chart
-     *        Chart that click was performed on.
-     *
-     * @param {Highcharts.PointerEventObject} clickEvent
-     *        Browser's click event.
-     */
-    NavigationBindings.prototype.bindingsChartClick = function (chart, clickEvent) {
-        chart = this.chart;
-        var navigation = this, activeAnnotation = navigation.activeAnnotation, selectedButton = navigation.selectedButton, svgContainer = chart.renderer.boxWrapper;
-        if (activeAnnotation) {
-            // Click outside popups, should close them and deselect the
-            // annotation
-            if (!activeAnnotation.cancelClick && // #15729
-                !clickEvent.activeAnnotation &&
-                // Element could be removed in the child action, e.g. button
-                clickEvent.target.parentNode &&
-                // TO DO: Polyfill for IE11?
-                !closestPolyfill(clickEvent.target, '.' + PREFIX + 'popup')) {
-                fireEvent(navigation, 'closePopup');
-            }
-            else if (activeAnnotation.cancelClick) {
-                // Reset cancelClick after the other event handlers have run
-                setTimeout(function () {
-                    activeAnnotation.cancelClick = false;
-                }, 0);
-            }
-        }
-        if (!selectedButton || !selectedButton.start) {
-            return;
-        }
-        if (!navigation.nextEvent) {
-            // Call init method:
-            navigation.currentUserDetails = selectedButton.start.call(navigation, clickEvent);
-            // If steps exists (e.g. Annotations), bind them:
-            if (navigation.currentUserDetails && selectedButton.steps) {
-                navigation.stepIndex = 0;
-                navigation.steps = true;
-                navigation.mouseMoveEvent = navigation.nextEvent =
-                    selectedButton.steps[navigation.stepIndex];
-            }
-            else {
-                fireEvent(navigation, 'deselectButton', { button: navigation.selectedButtonElement });
-                svgContainer.removeClass(PREFIX + 'draw-mode');
-                navigation.steps = false;
-                navigation.selectedButton = null;
-                // First click is also the last one:
-                if (selectedButton.end) {
-                    selectedButton.end.call(navigation, clickEvent, navigation.currentUserDetails);
-                }
-            }
-        }
-        else {
-            navigation.nextEvent(clickEvent, navigation.currentUserDetails);
-            if (navigation.steps) {
-                navigation.stepIndex++;
-                if (selectedButton.steps[navigation.stepIndex]) {
-                    // If we have more steps, bind them one by one:
-                    navigation.mouseMoveEvent = navigation.nextEvent = selectedButton.steps[navigation.stepIndex];
-                }
-                else {
-                    fireEvent(navigation, 'deselectButton', { button: navigation.selectedButtonElement });
-                    svgContainer.removeClass(PREFIX + 'draw-mode');
-                    // That was the last step, call end():
-                    if (selectedButton.end) {
-                        selectedButton.end.call(navigation, clickEvent, navigation.currentUserDetails);
-                    }
-                    navigation.nextEvent = false;
-                    navigation.mouseMoveEvent = false;
-                    navigation.selectedButton = null;
-                }
-            }
-        }
-    };
-    /**
-     * Hook for mouse move on a chart's container. It calls current step.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#bindingsContainerMouseMove
-     *
-     * @param {Highcharts.HTMLDOMElement} container
-     *        Chart's container.
-     *
-     * @param {global.Event} moveEvent
-     *        Browser's move event.
-     */
-    NavigationBindings.prototype.bindingsContainerMouseMove = function (_container, moveEvent) {
-        if (this.mouseMoveEvent) {
-            this.mouseMoveEvent(moveEvent, this.currentUserDetails);
-        }
-    };
-    /**
-     * Translate fields (e.g. `params.period` or `marker.styles.color`) to
-     * Highcharts options object (e.g. `{ params: { period } }`).
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#fieldsToOptions<T>
-     *
-     * @param {Highcharts.Dictionary<string>} fields
-     *        Fields from popup form.
-     *
-     * @param {T} config
-     *        Default config to be modified.
-     *
-     * @return {T}
-     *         Modified config
-     */
-    NavigationBindings.prototype.fieldsToOptions = function (fields, config) {
-        objectEach(fields, function (value, field) {
-            var parsedValue = parseFloat(value), path = field.split('.'), parent = config, pathLength = path.length - 1;
-            // If it's a number (not "format" options), parse it:
-            if (isNumber(parsedValue) &&
-                !value.match(/px/g) &&
-                !field.match(/format/g)) {
-                value = parsedValue;
-            }
-            // Remove empty strings or values like 0
-            if (value !== '' && value !== 'undefined') {
-                path.forEach(function (name, index) {
-                    var nextName = pick(path[index + 1], '');
-                    if (pathLength === index) {
-                        // Last index, put value:
-                        parent[name] = value;
-                    }
-                    else if (!parent[name]) {
-                        // Create middle property:
-                        parent[name] = nextName.match(/\d/g) ? [] : {};
-                        parent = parent[name];
-                    }
-                    else {
-                        // Jump into next property
-                        parent = parent[name];
-                    }
-                });
-            }
-        });
-        return config;
-    };
-    /**
-     * Shorthand method to deselect an annotation.
-     *
-     * @function Highcharts.NavigationBindings#deselectAnnotation
-     */
-    NavigationBindings.prototype.deselectAnnotation = function () {
-        if (this.activeAnnotation) {
-            this.activeAnnotation.setControlPointsVisibility(false);
-            this.activeAnnotation = false;
-        }
-    };
-    /**
-     * Generates API config for popup in the same format as options for
-     * Annotation object.
-     *
-     * @function Highcharts.NavigationBindings#annotationToFields
-     *
-     * @param {Highcharts.Annotation} annotation
-     *        Annotations object
-     *
-     * @return {Highcharts.Dictionary<string>}
-     *         Annotation options to be displayed in popup box
-     */
-    NavigationBindings.prototype.annotationToFields = function (annotation) {
-        var options = annotation.options, editables = NavigationBindings.annotationsEditable, nestedEditables = editables.nestedOptions, getFieldType = this.utils.getFieldType, type = pick(options.type, options.shapes && options.shapes[0] &&
-            options.shapes[0].type, options.labels && options.labels[0] &&
-            options.labels[0].itemType, 'label'), nonEditables = NavigationBindings.annotationsNonEditable[options.langKey] || [], visualOptions = {
-            langKey: options.langKey,
-            type: type
-        };
-        /**
-         * Nested options traversing. Method goes down to the options and copies
-         * allowed options (with values) to new object, which is last parameter:
-         * "parent".
-         *
-         * @private
-         *
-         * @param {*} option
-         *        Atomic type or object/array
-         *
-         * @param {string} key
-         *        Option name, for example "visible" or "x", "y"
-         *
-         * @param {Object} parentEditables
-         *        Editables from NavigationBindings.annotationsEditable
-         *
-         * @param {Object} parent
-         *        Where new options will be assigned
-         */
-        function traverse(option, key, parentEditables, parent) {
-            var nextParent;
-            if (parentEditables &&
-                option &&
-                nonEditables.indexOf(key) === -1 &&
-                ((parentEditables.indexOf &&
-                    parentEditables.indexOf(key)) >= 0 ||
-                    parentEditables[key] || // nested array
-                    parentEditables === true // simple array
-                )) {
-                // Roots:
-                if (isArray(option)) {
-                    parent[key] = [];
-                    option.forEach(function (arrayOption, i) {
-                        if (!isObject(arrayOption)) {
-                            // Simple arrays, e.g. [String, Number, Boolean]
-                            traverse(arrayOption, 0, nestedEditables[key], parent[key]);
-                        }
-                        else {
-                            // Advanced arrays, e.g. [Object, Object]
-                            parent[key][i] = {};
-                            objectEach(arrayOption, function (nestedOption, nestedKey) {
-                                traverse(nestedOption, nestedKey, nestedEditables[key], parent[key][i]);
-                            });
-                        }
-                    });
-                }
-                else if (isObject(option)) {
-                    nextParent = {};
-                    if (isArray(parent)) {
-                        parent.push(nextParent);
-                        nextParent[key] = {};
-                        nextParent = nextParent[key];
-                    }
-                    else {
-                        parent[key] = nextParent;
-                    }
-                    objectEach(option, function (nestedOption, nestedKey) {
-                        traverse(nestedOption, nestedKey, key === 0 ?
-                            parentEditables :
-                            nestedEditables[key], nextParent);
-                    });
-                }
-                else {
-                    // Leaf:
-                    if (key === 'format') {
-                        parent[key] = [
-                            format(option, annotation.labels[0].points[0]).toString(),
-                            'text'
-                        ];
-                    }
-                    else if (isArray(parent)) {
-                        parent.push([option, getFieldType(option)]);
-                    }
-                    else {
-                        parent[key] = [option, getFieldType(option)];
-                    }
-                }
-            }
-        }
-        objectEach(options, function (option, key) {
-            if (key === 'typeOptions') {
-                visualOptions[key] = {};
-                objectEach(options[key], function (typeOption, typeKey) {
-                    traverse(typeOption, typeKey, nestedEditables, visualOptions[key], true);
-                });
-            }
-            else {
-                traverse(option, key, editables[type], visualOptions);
-            }
-        });
-        return visualOptions;
-    };
-    /**
-     * Get all class names for all parents in the element. Iterates until finds
-     * main container.
-     *
-     * @function Highcharts.NavigationBindings#getClickedClassNames
-     *
-     * @param {Highcharts.HTMLDOMElement} container
-     * Container that event is bound to.
-     *
-     * @param {global.Event} event
-     * Browser's event.
-     *
-     * @return {Array<Array<string, Highcharts.HTMLDOMElement>>}
-     * Array of class names with corresponding elements
-     */
-    NavigationBindings.prototype.getClickedClassNames = function (container, event) {
-        var element = event.target, classNames = [], elemClassName;
-        while (element) {
-            elemClassName = attr(element, 'class');
-            if (elemClassName) {
-                classNames = classNames.concat(elemClassName
-                    .split(' ')
-                    .map(function (name) {
-                    return [
-                        name,
-                        element
-                    ];
-                }));
-            }
-            element = element.parentNode;
-            if (element === container) {
-                return classNames;
-            }
-        }
-        return classNames;
-    };
-    /**
-     * Get events bound to a button. It's a custom event delegation to find all
-     * events connected to the element.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#getButtonEvents
-     *
-     * @param {Highcharts.HTMLDOMElement} container
-     *        Container that event is bound to.
-     *
-     * @param {global.Event} event
-     *        Browser's event.
-     *
-     * @return {Object}
-     *         Object with events (init, start, steps, and end)
-     */
-    NavigationBindings.prototype.getButtonEvents = function (container, event) {
-        var navigation = this, classNames = this.getClickedClassNames(container, event), bindings;
-        classNames.forEach(function (className) {
-            if (navigation.boundClassNames[className[0]] && !bindings) {
-                bindings = {
-                    events: navigation.boundClassNames[className[0]],
-                    button: className[1]
-                };
-            }
-        });
-        return bindings;
-    };
-    /**
-     * Bindings are just events, so the whole update process is simply
-     * removing old events and adding new ones.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#update
-     */
-    NavigationBindings.prototype.update = function (options) {
-        this.options = merge(true, this.options, options);
-        this.removeEvents();
-        this.initEvents();
-    };
-    /**
-     * Remove all events created in the navigation.
-     *
-     * @private
-     * @function Highcharts.NavigationBindings#removeEvents
-     */
-    NavigationBindings.prototype.removeEvents = function () {
-        this.eventsToUnbind.forEach(function (unbinder) {
-            unbinder();
-        });
-    };
-    NavigationBindings.prototype.destroy = function () {
-        this.removeEvents();
-    };
-    /* *
-     *
-     *  Static Properties
-     *
-     * */
-    // Define which options from annotations should show up in edit box:
-    NavigationBindings.annotationsEditable = {
-        // `typeOptions` are always available
-        // Nested and shared options:
-        nestedOptions: {
-            labelOptions: ['style', 'format', 'backgroundColor'],
-            labels: ['style'],
-            label: ['style'],
-            style: ['fontSize', 'color'],
-            background: ['fill', 'strokeWidth', 'stroke'],
-            innerBackground: ['fill', 'strokeWidth', 'stroke'],
-            outerBackground: ['fill', 'strokeWidth', 'stroke'],
-            shapeOptions: ['fill', 'strokeWidth', 'stroke'],
-            shapes: ['fill', 'strokeWidth', 'stroke'],
-            line: ['strokeWidth', 'stroke'],
-            backgroundColors: [true],
-            connector: ['fill', 'strokeWidth', 'stroke'],
-            crosshairX: ['strokeWidth', 'stroke'],
-            crosshairY: ['strokeWidth', 'stroke']
-        },
-        // Simple shapes:
-        circle: ['shapes'],
-        ellipse: ['shapes'],
-        verticalLine: [],
-        label: ['labelOptions'],
-        // Measure
-        measure: ['background', 'crosshairY', 'crosshairX'],
-        // Others:
-        fibonacci: [],
-        tunnel: ['background', 'line', 'height'],
-        pitchfork: ['innerBackground', 'outerBackground'],
-        rect: ['shapes'],
-        // Crooked lines, elliots, arrows etc:
-        crookedLine: [],
-        basicAnnotation: ['shapes', 'labelOptions']
-    };
-    // Define non editable fields per annotation, for example Rectangle inherits
-    // options from Measure, but crosshairs are not available
-    NavigationBindings.annotationsNonEditable = {
-        rectangle: ['crosshairX', 'crosshairY', 'labelOptions'],
-        ellipse: ['labelOptions'],
-        circle: ['labelOptions']
-    };
-    return NavigationBindings;
-}());
-/**
- * General utils for bindings
- *
- * @private
- * @name Highcharts.NavigationBindings.utils
- * @type {bindingsUtils}
- */
-NavigationBindings.prototype.utils = bindingsUtils;
-Chart.prototype.initNavigationBindings = function () {
-    var chart = this, options = chart.options;
-    if (options && options.navigation && options.navigation.bindings) {
-        chart.navigationBindings = new NavigationBindings(chart, options.navigation);
-        chart.navigationBindings.initEvents();
-        chart.navigationBindings.initUpdate();
-    }
-};
-addEvent(Chart, 'load', function () {
-    this.initNavigationBindings();
-});
-addEvent(Chart, 'destroy', function () {
-    if (this.navigationBindings) {
-        this.navigationBindings.destroy();
-    }
-});
-addEvent(NavigationBindings, 'deselectButton', function () {
-    this.selectedButtonElement = null;
-});
-addEvent(Annotation, 'remove', function () {
-    if (this.chart.navigationBindings) {
-        this.chart.navigationBindings.deselectAnnotation();
-    }
-});
-/**
- * Show edit-annotation form:
- * @private
- */
-function selectableAnnotation(annotationType) {
-    var originalClick = annotationType.prototype.defaultOptions.events &&
-        annotationType.prototype.defaultOptions.events.click;
-    /**
-     * @private
-     */
-    function selectAndShowPopup(eventArguments) {
-        var annotation = this, navigation = annotation.chart.navigationBindings, prevAnnotation = navigation.activeAnnotation;
-        if (originalClick) {
-            originalClick.call(annotation, eventArguments);
-        }
-        if (prevAnnotation !== annotation) {
-            // Select current:
-            navigation.deselectAnnotation();
-            navigation.activeAnnotation = annotation;
-            annotation.setControlPointsVisibility(true);
-            fireEvent(navigation, 'showPopup', {
-                annotation: annotation,
-                formType: 'annotation-toolbar',
-                options: navigation.annotationToFields(annotation),
-                onSubmit: function (data) {
-                    var config = {}, typeOptions;
-                    if (data.actionType === 'remove') {
-                        navigation.activeAnnotation = false;
-                        navigation.chart.removeAnnotation(annotation);
-                    }
-                    else {
-                        navigation.fieldsToOptions(data.fields, config);
-                        navigation.deselectAnnotation();
-                        typeOptions = config.typeOptions;
-                        if (annotation.options.type === 'measure') {
-                            // Manually disable crooshars according to
-                            // stroke width of the shape:
-                            typeOptions.crosshairY.enabled = (typeOptions.crosshairY
-                                .strokeWidth !== 0);
-                            typeOptions.crosshairX.enabled = (typeOptions.crosshairX
-                                .strokeWidth !== 0);
-                        }
-                        annotation.update(config);
-                    }
-                }
-            });
-        }
-        else {
-            // Deselect current:
-            fireEvent(navigation, 'closePopup');
-        }
-        // Let bubble event to chart.click:
-        eventArguments.activeAnnotation = true;
-    }
-    merge(true, annotationType.prototype.defaultOptions.events, {
-        click: selectAndShowPopup
-    });
-}
-if (H.Annotation) {
-    // Basic shapes:
-    selectableAnnotation(Annotation);
-    // Advanced annotations:
-    objectEach(Annotation.types, function (annotationType) {
-        selectableAnnotation(annotationType);
-    });
-}
-setOptions({
-    /**
-     * @optionparent lang
-     *
-     * @private
-     */
-    lang: {
-        /**
-         * Configure the Popup strings in the chart. Requires the
-         * `annotations.js` or `annotations-advanced.src.js` module to be
-         * loaded.
-         * @since   7.0.0
-         * @product highcharts highstock
-         */
-        navigation: {
-            /**
-             * Translations for all field names used in popup.
-             *
-             * @product highcharts highstock
-             */
-            popup: {
-                simpleShapes: 'Simple shapes',
-                lines: 'Lines',
-                circle: 'Circle',
-                ellipse: 'Ellipse',
-                rectangle: 'Rectangle',
-                label: 'Label',
-                shapeOptions: 'Shape options',
-                typeOptions: 'Details',
-                fill: 'Fill',
-                format: 'Text',
-                strokeWidth: 'Line width',
-                stroke: 'Line color',
-                title: 'Title',
-                name: 'Name',
-                labelOptions: 'Label options',
-                labels: 'Labels',
-                backgroundColor: 'Background color',
-                backgroundColors: 'Background colors',
-                borderColor: 'Border color',
-                borderRadius: 'Border radius',
-                borderWidth: 'Border width',
-                style: 'Style',
-                padding: 'Padding',
-                fontSize: 'Font size',
-                color: 'Color',
-                height: 'Height',
-                shapes: 'Shape options'
-            }
-        }
-    },
-    /**
-     * @optionparent navigation
-     * @product      highcharts highstock
-     *
-     * @private
-     */
-    navigation: {
-        /**
-         * A CSS class name where all bindings will be attached to. Multiple
-         * charts on the same page should have separate class names to prevent
-         * duplicating events.
-         *
-         * Default value of versions < 7.0.4 `highcharts-bindings-wrapper`
-         *
-         * @since     7.0.0
-         * @type      {string}
-         */
-        bindingsClassName: 'highcharts-bindings-container',
-        /**
-         * Bindings definitions for custom HTML buttons. Each binding implements
-         * simple event-driven interface:
-         *
-         * - `className`: classname used to bind event to
-         *
-         * - `init`: initial event, fired on button click
-         *
-         * - `start`: fired on first click on a chart
-         *
-         * - `steps`: array of sequential events fired one after another on each
-         *   of users clicks
-         *
-         * - `end`: last event to be called after last step event
-         *
-         * @type         {Highcharts.Dictionary<Highcharts.NavigationBindingsOptionsObject>|*}
-         *
-         * @sample {highstock} stock/stocktools/stocktools-thresholds
-         *               Custom bindings
-         * @sample {highcharts} highcharts/annotations/bindings/
-         *               Simple binding
-         * @sample {highcharts} highcharts/annotations/bindings-custom-annotation/
-         *               Custom annotation binding
-         *
-         * @since        7.0.0
-         * @requires     modules/annotations
-         * @product      highcharts highstock
-         */
-        bindings: {
-            /**
-             * A circle annotation bindings. Includes `start` and one event in
-             * `steps` array.
-             *
-             * @type    {Highcharts.NavigationBindingsOptionsObject}
-             * @default {"className": "highcharts-circle-annotation", "start": function() {}, "steps": [function() {}], "annotationsOptions": {}}
-             */
-            circleAnnotation: {
-                /** @ignore-option */
-                className: 'highcharts-circle-annotation',
-                /** @ignore-option */
-                start: function (e) {
-                    var coords = this.chart.pointer.getCoordinates(e), coordsX = this.utils.getAssignedAxis(coords.xAxis), coordsY = this.utils.getAssignedAxis(coords.yAxis), navigation = this.chart.options.navigation;
-                    // Exit if clicked out of axes area
-                    if (!coordsX || !coordsY) {
-                        return;
-                    }
-                    return this.chart.addAnnotation(merge({
-                        langKey: 'circle',
-                        type: 'basicAnnotation',
-                        shapes: [{
-                                type: 'circle',
-                                point: {
-                                    x: coordsX.value,
-                                    y: coordsY.value,
-                                    xAxis: coordsX.axis.options.index,
-                                    yAxis: coordsY.axis.options.index
-                                },
-                                r: 5
-                            }]
-                    }, navigation.annotationsOptions, navigation.bindings.circleAnnotation
-                        .annotationsOptions));
-                },
-                /** @ignore-option */
-                steps: [
-                    function (e, annotation) {
-                        var mockPointOpts = annotation.options.shapes[0]
-                            .point, distance;
-                        if (isNumber(mockPointOpts.xAxis) &&
-                            isNumber(mockPointOpts.yAxis)) {
-                            var inverted = this.chart.inverted, x = this.chart.xAxis[mockPointOpts.xAxis]
-                                .toPixels(mockPointOpts.x), y = this.chart.yAxis[mockPointOpts.yAxis]
-                                .toPixels(mockPointOpts.y);
-                            distance = Math.max(Math.sqrt(Math.pow(inverted ? y - e.chartX : x - e.chartX, 2) +
-                                Math.pow(inverted ? x - e.chartY : y - e.chartY, 2)), 5);
-                        }
-                        annotation.update({
-                            shapes: [{
-                                    r: distance
-                                }]
-                        });
-                    }
-                ]
-            },
-            ellipseAnnotation: {
-                className: 'highcharts-ellipse-annotation',
-                start: function (e) {
-                    var coords = this.chart.pointer.getCoordinates(e), coordsX = this.utils.getAssignedAxis(coords.xAxis), coordsY = this.utils.getAssignedAxis(coords.yAxis), navigation = this.chart.options.navigation;
-                    if (!coordsX || !coordsY) {
-                        return;
-                    }
-                    return this.chart.addAnnotation(merge({
-                        langKey: 'ellipse',
-                        type: 'basicAnnotation',
-                        shapes: [
-                            {
-                                type: 'ellipse',
-                                xAxis: coordsX.axis.options.index,
-                                yAxis: coordsY.axis.options.index,
-                                points: [{
-                                        x: coordsX.value,
-                                        y: coordsY.value
-                                    }, {
-                                        x: coordsX.value,
-                                        y: coordsY.value
-                                    }],
-                                ry: 1
-                            }
-                        ]
-                    }, navigation.annotationsOptions, navigation.bindings.ellipseAnnotation
-                        .annotationOptions));
-                },
-                steps: [
-                    function (e, annotation) {
-                        var target = annotation.shapes[0], position = target.getAbsolutePosition(target.points[1]);
-                        target.translatePoint(e.chartX - position.x, e.chartY - position.y, 1);
-                        target.redraw(false);
-                    },
-                    function (e, annotation) {
-                        var target = annotation.shapes[0], position = target.getAbsolutePosition(target.points[0]), position2 = target.getAbsolutePosition(target.points[1]), newR = target.getDistanceFromLine(position, position2, e.chartX, e.chartY), yAxis = target.getYAxis(), newRY = Math.abs(yAxis.toValue(0) - yAxis.toValue(newR));
-                        target.setYRadius(newRY);
-                        target.redraw(false);
-                    }
-                ]
-            },
-            /**
-             * A rectangle annotation bindings. Includes `start` and one event
-             * in `steps` array.
-             *
-             * @type    {Highcharts.NavigationBindingsOptionsObject}
-             * @default {"className": "highcharts-rectangle-annotation", "start": function() {}, "steps": [function() {}], "annotationsOptions": {}}
-             */
-            rectangleAnnotation: {
-                /** @ignore-option */
-                className: 'highcharts-rectangle-annotation',
-                /** @ignore-option */
-                start: function (e) {
-                    var coords = this.chart.pointer.getCoordinates(e), coordsX = this.utils.getAssignedAxis(coords.xAxis), coordsY = this.utils.getAssignedAxis(coords.yAxis);
-                    // Exit if clicked out of axes area
-                    if (!coordsX || !coordsY) {
-                        return;
-                    }
-                    var x = coordsX.value, y = coordsY.value, xAxis = coordsX.axis.options.index, yAxis = coordsY.axis.options.index, navigation = this.chart.options.navigation;
-                    return this.chart.addAnnotation(merge({
-                        langKey: 'rectangle',
-                        type: 'basicAnnotation',
-                        shapes: [{
-                                type: 'path',
-                                points: [
-                                    { xAxis: xAxis, yAxis: yAxis, x: x, y: y },
-                                    { xAxis: xAxis, yAxis: yAxis, x: x, y: y },
-                                    { xAxis: xAxis, yAxis: yAxis, x: x, y: y },
-                                    { xAxis: xAxis, yAxis: yAxis, x: x, y: y },
-                                    { command: 'Z' }
-                                ]
-                            }]
-                    }, navigation
-                        .annotationsOptions, navigation
-                        .bindings
-                        .rectangleAnnotation
-                        .annotationsOptions));
-                },
-                /** @ignore-option */
-                steps: [
-                    function (e, annotation) {
-                        var points = annotation.options.shapes[0].points, coords = this.chart.pointer.getCoordinates(e), coordsX = this.utils.getAssignedAxis(coords.xAxis), coordsY = this.utils.getAssignedAxis(coords.yAxis), x, y;
-                        if (coordsX && coordsY) {
-                            x = coordsX.value;
-                            y = coordsY.value;
-                            // Top right point
-                            points[1].x = x;
-                            // Bottom right point (cursor position)
-                            points[2].x = x;
-                            points[2].y = y;
-                            // Bottom left
-                            points[3].y = y;
-                            annotation.update({
-                                shapes: [{
-                                        points: points
-                                    }]
-                            });
-                        }
-                    }
-                ]
-            },
-            /**
-             * A label annotation bindings. Includes `start` event only.
-             *
-             * @type    {Highcharts.NavigationBindingsOptionsObject}
-             * @default {"className": "highcharts-label-annotation", "start": function() {}, "steps": [function() {}], "annotationsOptions": {}}
-             */
-            labelAnnotation: {
-                /** @ignore-option */
-                className: 'highcharts-label-annotation',
-                /** @ignore-option */
-                start: function (e) {
-                    var coords = this.chart.pointer.getCoordinates(e), coordsX = this.utils.getAssignedAxis(coords.xAxis), coordsY = this.utils.getAssignedAxis(coords.yAxis), navigation = this.chart.options.navigation;
-                    // Exit if clicked out of axes area
-                    if (!coordsX || !coordsY) {
-                        return;
-                    }
-                    return this.chart.addAnnotation(merge({
-                        langKey: 'label',
-                        type: 'basicAnnotation',
-                        labelOptions: {
-                            format: '{y:.2f}'
-                        },
-                        labels: [{
-                                point: {
-                                    xAxis: coordsX.axis.options.index,
-                                    yAxis: coordsY.axis.options.index,
-                                    x: coordsX.value,
-                                    y: coordsY.value
-                                },
-                                overflow: 'none',
-                                crop: true
-                            }]
-                    }, navigation
-                        .annotationsOptions, navigation
-                        .bindings
-                        .labelAnnotation
-                        .annotationsOptions));
-                }
-            }
-        },
-        /**
-         * Path where Highcharts will look for icons. Change this to use icons
-         * from a different server.
-         *
-         * @type      {string}
-         * @default   https://code.highcharts.com/9.3.3/gfx/stock-icons/
-         * @since     7.1.3
-         * @apioption navigation.iconsURL
-         */
-        /**
-         * A `showPopup` event. Fired when selecting for example an annotation.
-         *
-         * @type      {Function}
-         * @apioption navigation.events.showPopup
-         */
-        /**
-         * A `closePopup` event. Fired when Popup should be hidden, for example
-         * when clicking on an annotation again.
-         *
-         * @type      {Function}
-         * @apioption navigation.events.closePopup
-         */
-        /**
-         * Event fired on a button click.
-         *
-         * @type      {Function}
-         * @sample    highcharts/annotations/gui/
-         *            Change icon in a dropddown on event
-         * @sample    highcharts/annotations/gui-buttons/
-         *            Change button class on event
-         * @apioption navigation.events.selectButton
-         */
-        /**
-         * Event fired when button state should change, for example after
-         * adding an annotation.
-         *
-         * @type      {Function}
-         * @sample    highcharts/annotations/gui/
-         *            Change icon in a dropddown on event
-         * @sample    highcharts/annotations/gui-buttons/
-         *            Change button class on event
-         * @apioption navigation.events.deselectButton
-         */
-        /**
-         * Events to communicate between Stock Tools and custom GUI.
-         *
-         * @since        7.0.0
-         * @product      highcharts highstock
-         * @optionparent navigation.events
-         */
-        events: {},
-        /**
-         * Additional options to be merged into all annotations.
-         *
-         * @sample stock/stocktools/navigation-annotation-options
-         *         Set red color of all line annotations
-         *
-         * @type      {Highcharts.AnnotationsOptions}
-         * @extends   annotations
-         * @exclude   crookedLine, elliottWave, fibonacci, infinityLine,
-         *            measure, pitchfork, tunnel, verticalLine, basicAnnotation
-         * @requires     modules/annotations
-         * @apioption navigation.annotationsOptions
-         */
-        annotationsOptions: {
-            animation: {
-                defer: 0
-            }
-        }
-    }
-});
-addEvent(Chart, 'render', function () {
-    var chart = this, navigationBindings = chart.navigationBindings, disabledClassName = 'highcharts-disabled-btn';
-    if (chart && navigationBindings) {
-        // Check if the buttons should be enabled/disabled based on
-        // visible series.
-        var buttonsEnabled_1 = false;
-        chart.series.forEach(function (series) {
-            if (!series.options.isInternal && series.visible) {
-                buttonsEnabled_1 = true;
-            }
-        });
-        objectEach(navigationBindings.boundClassNames, function (value, key) {
-            if (chart.navigationBindings &&
-                chart.navigationBindings.container &&
-                chart.navigationBindings.container[0]) {
-                // Get the HTML element coresponding to the className taken
-                // from StockToolsBindings.
-                var buttonNode = chart.navigationBindings.container[0]
-                    .querySelectorAll('.' + key);
-                if (buttonNode) {
-                    for (var i = 0; i < buttonNode.length; i++) {
-                        var button = buttonNode[i], cls = button.className;
-                        if (value.noDataState === 'normal') {
-                            // If button has noDataState: 'normal', and has
-                            // disabledClassName, remove this className.
-                            if (cls.indexOf(disabledClassName) !== -1) {
-                                button.classList.remove(disabledClassName);
-                            }
-                        }
-                        else if (!buttonsEnabled_1) {
-                            if (cls.indexOf(disabledClassName) === -1) {
-                                button.className += ' ' + disabledClassName;
-                            }
-                        }
-                        else {
-                            // Enable all buttons by deleting the className.
-                            if (cls.indexOf(disabledClassName) !== -1) {
-                                button.classList.remove(disabledClassName);
-                            }
-                        }
-                    }
-                }
-            }
-        });
-    }
-});
-addEvent(NavigationBindings, 'closePopup', function () {
-    this.deselectAnnotation();
-});
-export default NavigationBindings;