highcharts 10.0.0 → 10.2.1

package/es-modules/Extensions/{ExportData.js → ExportData/ExportData.js}

@@ -13,317 +13,138 @@
 // - Set up systematic tests for all series types, paired with tests of the data
 //   module importing the same data.
 'use strict';
-import Axis from '../Core/Axis/Axis.js';
-import Chart from '../Core/Chart/Chart.js';
-import AST from '../Core/Renderer/HTML/AST.js';
-import H from '../Core/Globals.js';
-var doc = H.doc, seriesTypes = H.seriesTypes, win = H.win;
-import D from '../Core/DefaultOptions.js';
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import AST from '../../Core/Renderer/HTML/AST.js';
+import ExportDataDefaults from './ExportDataDefaults.js';
+import H from '../../Core/Globals.js';
+var doc = H.doc, win = H.win;
+import D from '../../Core/DefaultOptions.js';
 var getOptions = D.getOptions, setOptions = D.setOptions;
-import U from '../Core/Utilities.js';
+import DownloadURL from '../DownloadURL.js';
+var downloadURL = DownloadURL.downloadURL;
+import SeriesRegistry from '../../Core/Series/SeriesRegistry.js';
+var SeriesClass = SeriesRegistry.series, _a = SeriesRegistry.seriesTypes, AreaRangeSeries = _a.arearange, GanttSeries = _a.gantt, MapSeries = _a.map, MapBubbleSeries = _a.mapbubble, TreemapSeries = _a.treemap;
+import U from '../../Core/Utilities.js';
 var addEvent = U.addEvent, defined = U.defined, extend = U.extend, find = U.find, fireEvent = U.fireEvent, isNumber = U.isNumber, pick = U.pick;
+/* *
+ *
+ *  Constants
+ *
+ * */
+var composedClasses = [];
+/* *
+ *
+ *  Functions
+ *
+ * */
 /**
- * Function callback to execute while data rows are processed for exporting.
- * This allows the modification of data rows before processed into the final
- * format.
+ * Generates a data URL of CSV for local download in the browser. This is the
+ * default action for a click on the 'Download CSV' button.
  *
- * @callback Highcharts.ExportDataCallbackFunction
- * @extends Highcharts.EventCallbackFunction<Highcharts.Chart>
+ * See {@link Highcharts.Chart#getCSV} to get the CSV data itself.
  *
- * @param {Highcharts.Chart} this
- * Chart context where the event occured.
+ * @function Highcharts.Chart#downloadCSV
  *
- * @param {Highcharts.ExportDataEventObject} event
- * Event object with data rows that can be modified.
+ * @requires modules/exporting
  */
+function chartDownloadCSV() {
+    var csv = this.getCSV(true);
+    downloadURL(getBlobFromContent(csv, 'text/csv') ||
+        'data:text/csv,\uFEFF' + encodeURIComponent(csv), this.getFilename() + '.csv');
+}
 /**
- * Contains information about the export data event.
+ * Generates a data URL of an XLS document for local download in the browser.
+ * This is the default action for a click on the 'Download XLS' button.
  *
- * @interface Highcharts.ExportDataEventObject
- */ /**
-* Contains the data rows for the current export task and can be modified.
-* @name Highcharts.ExportDataEventObject#dataRows
-* @type {Array<Array<string>>}
-*/
-import DownloadURL from '../Extensions/DownloadURL.js';
-var downloadURL = DownloadURL.downloadURL;
-setOptions({
-    /**
-     * Callback that fires while exporting data. This allows the modification of
-     * data rows before processed into the final format.
-     *
-     * @type      {Highcharts.ExportDataCallbackFunction}
-     * @context   Highcharts.Chart
-     * @requires  modules/export-data
-     * @apioption chart.events.exportData
-     */
-    /**
-     * When set to `false` will prevent the series data from being included in
-     * any form of data export.
-     *
-     * Since version 6.0.0 until 7.1.0 the option was existing undocumented
-     * as `includeInCSVExport`.
-     *
-     * @type      {boolean}
-     * @since     7.1.0
-     * @requires  modules/export-data
-     * @apioption plotOptions.series.includeInDataExport
-     */
-    /**
-     * @optionparent exporting
-     * @private
-     */
-    exporting: {
-        /**
-         * Caption for the data table. Same as chart title by default. Set to
-         * `false` to disable.
-         *
-         * @sample highcharts/export-data/multilevel-table
-         *         Multiple table headers
-         *
-         * @type      {boolean|string}
-         * @since     6.0.4
-         * @requires  modules/export-data
-         * @apioption exporting.tableCaption
-         */
-        /**
-         * Options for exporting data to CSV or ExCel, or displaying the data
-         * in a HTML table or a JavaScript structure.
-         *
-         * This module adds data export options to the export menu and provides
-         * functions like `Chart.getCSV`, `Chart.getTable`, `Chart.getDataRows`
-         * and `Chart.viewData`.
-         *
-         * The XLS converter is limited and only creates a HTML string that is
-         * passed for download, which works but creates a warning before
-         * opening. The workaround for this is to use a third party XLSX
-         * converter, as demonstrated in the sample below.
-         *
-         * @sample  highcharts/export-data/categorized/ Categorized data
-         * @sample  highcharts/export-data/stock-timeaxis/ Highcharts Stock time axis
-         * @sample  highcharts/export-data/xlsx/
-         *          Using a third party XLSX converter
-         *
-         * @since    6.0.0
-         * @requires modules/export-data
-         */
-        csv: {
-            /**
-             *
-             * Options for annotations in the export-data table.
-             *
-             * @since 8.2.0
-             * @requires modules/export-data
-             * @requires modules/annotations
-             *
-             *
-             */
-            annotations: {
-                /**
-                * The way to mark the separator for annotations
-                * combined in one export-data table cell.
-                *
-                * @since 8.2.0
-                * @requires modules/annotations
-                */
-                itemDelimiter: '; ',
-                /**
-                * When several labels are assigned to a specific point,
-                * they will be displayed in one field in the table.
-                *
-                * @sample highcharts/export-data/join-annotations/
-                *         Concatenate point annotations with itemDelimiter set.
-                *
-                * @since 8.2.0
-                * @requires modules/annotations
-                */
-                join: false
-            },
-            /**
-             * Formatter callback for the column headers. Parameters are:
-             * - `item` - The series or axis object)
-             * - `key` -  The point key, for example y or z
-             * - `keyLength` - The amount of value keys for this item, for
-             *   example a range series has the keys `low` and `high` so the
-             *   key length is 2.
-             *
-             * If [useMultiLevelHeaders](#exporting.useMultiLevelHeaders) is
-             * true, columnHeaderFormatter by default returns an object with
-             * columnTitle and topLevelColumnTitle for each key. Columns with
-             * the same topLevelColumnTitle have their titles merged into a
-             * single cell with colspan for table/Excel export.
-             *
-             * If `useMultiLevelHeaders` is false, or for CSV export, it returns
-             * the series name, followed by the key if there is more than one
-             * key.
-             *
-             * For the axis it returns the axis title or "Category" or
-             * "DateTime" by default.
-             *
-             * Return `false` to use Highcharts' proposed header.
-             *
-             * @sample highcharts/export-data/multilevel-table
-             *         Multiple table headers
-             *
-             * @type {Function|null}
-             */
-            columnHeaderFormatter: null,
-            /**
-             * Which date format to use for exported dates on a datetime X axis.
-             * See `Highcharts.dateFormat`.
-             */
-            dateFormat: '%Y-%m-%d %H:%M:%S',
-            /**
-             * Which decimal point to use for exported CSV. Defaults to the same
-             * as the browser locale, typically `.` (English) or `,` (German,
-             * French etc).
-             *
-             * @type  {string|null}
-             * @since 6.0.4
-             */
-            decimalPoint: null,
-            /**
-             * The item delimiter in the exported data. Use `;` for direct
-             * exporting to Excel. Defaults to a best guess based on the browser
-             * locale. If the locale _decimal point_ is `,`, the `itemDelimiter`
-             * defaults to `;`, otherwise the `itemDelimiter` defaults to `,`.
-             *
-             * @type {string|null}
-             */
-            itemDelimiter: null,
-            /**
-             * The line delimiter in the exported data, defaults to a newline.
-             */
-            lineDelimiter: '\n'
-        },
-        /**
-         * Show a HTML table below the chart with the chart's current data.
-         *
-         * @sample highcharts/export-data/showtable/
-         *         Show the table
-         * @sample highcharts/studies/exporting-table-html
-         *         Experiment with putting the table inside the subtitle to
-         *         allow exporting it.
-         *
-         * @since    6.0.0
-         * @requires modules/export-data
-         */
-        showTable: false,
-        /**
-         * Use multi level headers in data table. If [csv.columnHeaderFormatter
-         * ](#exporting.csv.columnHeaderFormatter) is defined, it has to return
-         * objects in order for multi level headers to work.
-         *
-         * @sample highcharts/export-data/multilevel-table
-         *         Multiple table headers
-         *
-         * @since    6.0.4
-         * @requires modules/export-data
-         */
-        useMultiLevelHeaders: true,
-        /**
-         * If using multi level table headers, use rowspans for headers that
-         * have only one level.
-         *
-         * @sample highcharts/export-data/multilevel-table
-         *         Multiple table headers
-         *
-         * @since    6.0.4
-         * @requires modules/export-data
-         */
-        useRowspanHeaders: true
-    },
-    /**
-     * @optionparent lang
-     *
-     * @private
-     */
-    lang: {
-        /**
-         * The text for the menu item.
-         *
-         * @since    6.0.0
-         * @requires modules/export-data
-         */
-        downloadCSV: 'Download CSV',
-        /**
-         * The text for the menu item.
-         *
-         * @since    6.0.0
-         * @requires modules/export-data
-         */
-        downloadXLS: 'Download XLS',
-        /**
-         * The text for exported table.
-         *
-         * @since 8.1.0
-         * @requires modules/export-data
-         */
-        exportData: {
-            /**
-             * The annotation column title.
-             */
-            annotationHeader: 'Annotations',
-            /**
-             * The category column title.
-             */
-            categoryHeader: 'Category',
-            /**
-             * The category column title when axis type set to "datetime".
-             */
-            categoryDatetimeHeader: 'DateTime'
-        },
-        /**
-         * The text for the menu item.
-         *
-         * @since    6.0.0
-         * @requires modules/export-data
-         */
-        viewData: 'View data table',
-        /**
-         * The text for the menu item.
-         *
-         * @since 8.2.0
-         * @requires modules/export-data
-         */
-        hideData: 'Hide data table'
-    }
-});
-/* eslint-disable no-invalid-this */
-// Add an event listener to handle the showTable option
-addEvent(Chart, 'render', function () {
-    if (this.options &&
-        this.options.exporting &&
-        this.options.exporting.showTable &&
-        !this.options.chart.forExport &&
-        !this.dataTableDiv) {
-        this.viewData();
-    }
-});
-/* eslint-enable no-invalid-this */
+ * See {@link Highcharts.Chart#getTable} to get the table data itself.
+ *
+ * @function Highcharts.Chart#downloadXLS
+ *
+ * @requires modules/exporting
+ */
+function chartDownloadXLS() {
+    var uri = 'data:application/vnd.ms-excel;base64,', template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" ' +
+        'xmlns:x="urn:schemas-microsoft-com:office:excel" ' +
+        'xmlns="http://www.w3.org/TR/REC-html40">' +
+        '<head><!--[if gte mso 9]><xml><x:ExcelWorkbook>' +
+        '<x:ExcelWorksheets><x:ExcelWorksheet>' +
+        '<x:Name>Ark1</x:Name>' +
+        '<x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions>' +
+        '</x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook>' +
+        '</xml><![endif]-->' +
+        '<style>td{border:none;font-family: Calibri, sans-serif;} ' +
+        '.number{mso-number-format:"0.00";} ' +
+        '.text{ mso-number-format:"\@";}</style>' +
+        '<meta name=ProgId content=Excel.Sheet>' +
+        '<meta charset=UTF-8>' +
+        '</head><body>' +
+        this.getTable(true) +
+        '</body></html>', base64 = function (s) {
+        return win.btoa(unescape(encodeURIComponent(s))); // #50
+    };
+    downloadURL(getBlobFromContent(template, 'application/vnd.ms-excel') ||
+        uri + base64(template), this.getFilename() + '.xls');
+}
 /**
- * Set up key-to-axis bindings. This is used when the Y axis is datetime or
- * categorized. For example in an arearange series, the low and high values
- * should be formatted according to the Y axis type, and in order to link them
- * we need this map.
+ * Export-data module required. Returns the current chart data as a CSV string.
  *
- * @private
- * @function Highcharts.Chart#setUpKeyToAxis
+ * @function Highcharts.Chart#getCSV
+ *
+ * @param {boolean} [useLocalDecimalPoint]
+ *        Whether to use the local decimal point as detected from the browser.
+ *        This makes it easier to export data to Excel in the same locale as the
+ *        user is.
+ *
+ * @return {string}
+ *         CSV representation of the data
  */
-Chart.prototype.setUpKeyToAxis = function () {
-    if (seriesTypes.arearange) {
-        seriesTypes.arearange.prototype.keyToAxis = {
-            low: 'y',
-            high: 'y'
-        };
-    }
-    if (seriesTypes.gantt) {
-        seriesTypes.gantt.prototype.keyToAxis = {
-            start: 'x',
-            end: 'x'
-        };
-    }
-};
+function chartGetCSV(useLocalDecimalPoint) {
+    var csv = '';
+    var rows = this.getDataRows(), csvOptions = this.options.exporting.csv, decimalPoint = pick(csvOptions.decimalPoint, csvOptions.itemDelimiter !== ',' && useLocalDecimalPoint ?
+        (1.1).toLocaleString()[1] :
+        '.'), 
+    // use ';' for direct to Excel
+    itemDelimiter = pick(csvOptions.itemDelimiter, decimalPoint === ',' ? ';' : ','), 
+    // '\n' isn't working with the js csv data extraction
+    lineDelimiter = csvOptions.lineDelimiter;
+    // Transform the rows to CSV
+    rows.forEach(function (row, i) {
+        var val = '', j = row.length;
+        while (j--) {
+            val = row[j];
+            if (typeof val === 'string') {
+                val = '"' + val + '"';
+            }
+            if (typeof val === 'number') {
+                if (decimalPoint !== '.') {
+                    val = val.toString().replace('.', decimalPoint);
+                }
+            }
+            row[j] = val;
+        }
+        // The first row is the header - it defines the number of columns.
+        // Empty columns between not-empty cells are covered in the getDataRows
+        // method.
+        // Now add empty values only to the end of the row so all rows have
+        // the same number of columns, #17186
+        row.length = rows.length ? rows[0].length : 0;
+        // Add the values
+        csv += row.join(itemDelimiter);
+        // Add the line delimiter
+        if (i < rows.length - 1) {
+            csv += lineDelimiter;
+        }
+    });
+    return csv;
+}
 /**
  * Export-data module required. Returns a two-dimensional array containing the
  * current chart data.
@@ -340,8 +161,8 @@ Chart.prototype.setUpKeyToAxis = function () {
  *
  * @emits Highcharts.Chart#event:exportData
  */
-Chart.prototype.getDataRows = function (multiLevelHeaders) {
-    var hasParallelCoords = this.hasParallelCoordinates, time = this.time, csvOptions = ((this.options.exporting && this.options.exporting.csv) || {}), xAxis, xAxes = this.xAxis, rows = {}, rowArr = [], dataRows, topLevelColumnTitles = [], columnTitles = [], columnTitleObj, i, x, xTitle, langOptions = this.options.lang, exportDataOptions = langOptions.exportData, categoryHeader = exportDataOptions.categoryHeader, categoryDatetimeHeader = exportDataOptions.categoryDatetimeHeader, 
+function chartGetDataRows(multiLevelHeaders) {
+    var hasParallelCoords = this.hasParallelCoordinates, time = this.time, csvOptions = ((this.options.exporting && this.options.exporting.csv) || {}), xAxes = this.xAxis, rows = {}, rowArr = [], topLevelColumnTitles = [], columnTitles = [], langOptions = this.options.lang, exportDataOptions = langOptions.exportData, categoryHeader = exportDataOptions.categoryHeader, categoryDatetimeHeader = exportDataOptions.categoryDatetimeHeader, 
     // Options
     columnHeaderFormatter = function (item, key, keyLength) {
         if (csvOptions.columnHeaderFormatter) {
@@ -353,7 +174,7 @@ Chart.prototype.getDataRows = function (multiLevelHeaders) {
         if (!item) {
             return categoryHeader;
         }
-        if (item instanceof Axis) {
+        if (!(item instanceof SeriesClass)) {
             return (item.options.title && item.options.title.text) ||
                 (item.dateTime ? categoryDatetimeHeader : categoryHeader);
         }
@@ -408,9 +229,8 @@ Chart.prototype.getDataRows = function (multiLevelHeaders) {
         }
         return series.pointArrayMap || ['y'];
     }, xAxisIndices = [];
-    // Loop the series and index values
-    i = 0;
-    this.setUpKeyToAxis();
+    var xAxis, dataRows, columnTitleObj, i = 0, // Loop the series and index values
+    x, xTitle;
     this.series.forEach(function (series) {
         var keys = series.options.keys, xAxis = series.xAxis, pointArrayMap = keys || getPointArray(series, xAxis), valueCount = pointArrayMap.length, xTaken = !series.requireSorting && {}, xAxisIndex = xAxes.indexOf(xAxis);
         var categoryAndDatetimeMap = getCategoryAndDateTimeMap(series, pointArrayMap), mockSeries, j;
@@ -447,16 +267,16 @@ Chart.prototype.getDataRows = function (multiLevelHeaders) {
             // Export directly from options.data because we need the uncropped
             // data (#7913), and we need to support Boost (#7026).
             series.options.data.forEach(function eachData(options, pIdx) {
-                var key, prop, val, name, point;
+                var mockPoint = { series: mockSeries };
+                var key, prop, val;
                 // In parallel coordinates chart, each data point is connected
                 // to a separate yAxis, conform this
                 if (hasParallelCoords) {
                     categoryAndDatetimeMap = getCategoryAndDateTimeMap(series, pointArrayMap, pIdx);
                 }
-                point = { series: mockSeries };
-                series.pointClass.prototype.applyOptions.apply(point, [options]);
-                key = point.x;
-                name = series.data[pIdx] && series.data[pIdx].name;
+                series.pointClass.prototype.applyOptions.apply(mockPoint, [options]);
+                key = mockPoint.x;
+                var name = series.data[pIdx] && series.data[pIdx].name;
                 j = 0;
                 // Pies, funnels, geo maps etc. use point name in X row
                 if (!xAxis ||
@@ -476,12 +296,12 @@ Chart.prototype.getDataRows = function (multiLevelHeaders) {
                     // Contain the X values from one or more X axes
                     rows[key].xValues = [];
                 }
-                rows[key].x = point.x;
+                rows[key].x = mockPoint.x;
                 rows[key].name = name;
-                rows[key].xValues[xAxisIndex] = point.x;
+                rows[key].xValues[xAxisIndex] = mockPoint.x;
                 while (j < valueCount) {
                     prop = pointArrayMap[j]; // y, z etc
-                    val = point[prop];
+                    val = mockPoint[prop];
                     rows[key][i + j] = pick(
                     // Y axis category if present
                     categoryAndDatetimeMap.categoryMap[prop][val], 
@@ -550,53 +370,7 @@ Chart.prototype.getDataRows = function (multiLevelHeaders) {
     dataRows = dataRows.concat(rowArr);
     fireEvent(this, 'exportData', { dataRows: dataRows });
     return dataRows;
-};
-/**
- * Export-data module required. Returns the current chart data as a CSV string.
- *
- * @function Highcharts.Chart#getCSV
- *
- * @param {boolean} [useLocalDecimalPoint]
- *        Whether to use the local decimal point as detected from the browser.
- *        This makes it easier to export data to Excel in the same locale as the
- *        user is.
- *
- * @return {string}
- *         CSV representation of the data
- */
-Chart.prototype.getCSV = function (useLocalDecimalPoint) {
-    var csv = '';
-    var rows = this.getDataRows(), csvOptions = this.options.exporting.csv, decimalPoint = pick(csvOptions.decimalPoint, csvOptions.itemDelimiter !== ',' && useLocalDecimalPoint ?
-        (1.1).toLocaleString()[1] :
-        '.'), 
-    // use ';' for direct to Excel
-    itemDelimiter = pick(csvOptions.itemDelimiter, decimalPoint === ',' ? ';' : ','), 
-    // '\n' isn't working with the js csv data extraction
-    lineDelimiter = csvOptions.lineDelimiter;
-    // Transform the rows to CSV
-    rows.forEach(function (row, i) {
-        var val = '', j = row.length;
-        while (j--) {
-            val = row[j];
-            if (typeof val === 'string') {
-                val = '"' + val + '"';
-            }
-            if (typeof val === 'number') {
-                if (decimalPoint !== '.') {
-                    val = val.toString().replace('.', decimalPoint);
-                }
-            }
-            row[j] = val;
-        }
-        // Add the values
-        csv += row.join(itemDelimiter);
-        // Add the line delimiter
-        if (i < rows.length - 1) {
-            csv += lineDelimiter;
-        }
-    });
-    return csv;
-};
+}
 /**
  * Export-data module required. Build a HTML table with the chart's current
  * data.
@@ -616,18 +390,19 @@ Chart.prototype.getCSV = function (useLocalDecimalPoint) {
  *
  * @emits Highcharts.Chart#event:afterGetTable
  */
-Chart.prototype.getTable = function (useLocalDecimalPoint) {
+function chartGetTable(useLocalDecimalPoint) {
     var serialize = function (node) {
         if (!node.tagName || node.tagName === '#text') {
             // Text node
             return node.textContent || '';
         }
         var attributes = node.attributes;
-        var html = "<" + node.tagName;
+        var html = "<".concat(node.tagName);
         if (attributes) {
-            Object.keys(attributes).forEach(function (key) {
+            Object.keys(attributes)
+                .forEach(function (key) {
                 var value = attributes[key];
-                html += " " + key + "=\"" + value + "\"";
+                html += " ".concat(key, "=\"").concat(value, "\"");
             });
         }
         html += '>';
@@ -635,12 +410,12 @@ Chart.prototype.getTable = function (useLocalDecimalPoint) {
         (node.children || []).forEach(function (child) {
             html += serialize(child);
         });
-        html += "</" + node.tagName + ">";
+        html += "</".concat(node.tagName, ">");
         return html;
     };
     var tree = this.getTableAST(useLocalDecimalPoint);
     return serialize(tree);
-};
+}
 /**
  * Get the AST of a HTML table representing the chart data.
  *
@@ -656,7 +431,7 @@ Chart.prototype.getTable = function (useLocalDecimalPoint) {
  * @return {Highcharts.ASTNode}
  *         The abstract syntax tree
  */
-Chart.prototype.getTableAST = function (useLocalDecimalPoint) {
+function chartGetTableAST(useLocalDecimalPoint) {
     var rowLength = 0;
     var treeChildren = [];
     var options = this.options, decimalPoint = useLocalDecimalPoint ? (1.1).toLocaleString()[1] : '.', useMultiLevelHeaders = pick(options.exporting.useMultiLevelHeaders, true), rows = this.getDataRows(useMultiLevelHeaders), topHeaders = useMultiLevelHeaders ? rows.shift() : null, subHeaders = rows.shift(), 
@@ -677,17 +452,17 @@ Chart.prototype.getTableAST = function (useLocalDecimalPoint) {
     }, 
     // Get table cell HTML from value
     getCellHTMLFromValue = function (tagName, classes, attributes, value) {
-        var textContent = pick(value, ''), className = 'text' + (classes ? ' ' + classes : '');
+        var textContent = pick(value, ''), className = 'highcharts-text' + (classes ? ' ' + classes : '');
         // Convert to string if number
         if (typeof textContent === 'number') {
             textContent = textContent.toString();
             if (decimalPoint === ',') {
                 textContent = textContent.replace('.', decimalPoint);
             }
-            className = 'number';
+            className = 'highcharts-number';
         }
         else if (!value) {
-            className = 'empty';
+            className = 'highcharts-empty';
         }
         attributes = extend({ 'class': className }, attributes);
         return {
@@ -813,113 +588,25 @@ Chart.prototype.getTableAST = function (useLocalDecimalPoint) {
     var e = {
         tree: {
             tagName: 'table',
-            id: "highcharts-data-table-" + this.index,
+            id: "highcharts-data-table-".concat(this.index),
             children: treeChildren
         }
     };
     fireEvent(this, 'aftergetTableAST', e);
     return e.tree;
-};
-/**
- * Get a blob object from content, if blob is supported
- *
- * @private
- * @param {string} content
- *        The content to create the blob from.
- * @param {string} type
- *        The type of the content.
- * @return {string|undefined}
- *         The blob object, or undefined if not supported.
- */
-function getBlobFromContent(content, type) {
-    var nav = win.navigator, webKit = (nav.userAgent.indexOf('WebKit') > -1 &&
-        nav.userAgent.indexOf('Chrome') < 0), domurl = win.URL || win.webkitURL || win;
-    try {
-        // MS specific
-        if ((nav.msSaveOrOpenBlob) && win.MSBlobBuilder) {
-            var blob = new win.MSBlobBuilder();
-            blob.append(content);
-            return blob.getBlob('image/svg+xml');
-        }
-        // Safari requires data URI since it doesn't allow navigation to blob
-        // URLs.
-        if (!webKit) {
-            return domurl.createObjectURL(new win.Blob(['\uFEFF' + content], // #7084
-            { type: type }));
-        }
-    }
-    catch (e) {
-        // Ignore
-    }
 }
-/* eslint-disable valid-jsdoc */
-/**
- * Generates a data URL of CSV for local download in the browser. This is the
- * default action for a click on the 'Download CSV' button.
- *
- * See {@link Highcharts.Chart#getCSV} to get the CSV data itself.
- *
- * @function Highcharts.Chart#downloadCSV
- *
- * @requires modules/exporting
- */
-Chart.prototype.downloadCSV = function () {
-    var csv = this.getCSV(true);
-    downloadURL(getBlobFromContent(csv, 'text/csv') ||
-        'data:text/csv,\uFEFF' + encodeURIComponent(csv), this.getFilename() + '.csv');
-};
-/**
- * Generates a data URL of an XLS document for local download in the browser.
- * This is the default action for a click on the 'Download XLS' button.
- *
- * See {@link Highcharts.Chart#getTable} to get the table data itself.
- *
- * @function Highcharts.Chart#downloadXLS
- *
- * @requires modules/exporting
- */
-Chart.prototype.downloadXLS = function () {
-    var uri = 'data:application/vnd.ms-excel;base64,', template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" ' +
-        'xmlns:x="urn:schemas-microsoft-com:office:excel" ' +
-        'xmlns="http://www.w3.org/TR/REC-html40">' +
-        '<head><!--[if gte mso 9]><xml><x:ExcelWorkbook>' +
-        '<x:ExcelWorksheets><x:ExcelWorksheet>' +
-        '<x:Name>Ark1</x:Name>' +
-        '<x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions>' +
-        '</x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook>' +
-        '</xml><![endif]-->' +
-        '<style>td{border:none;font-family: Calibri, sans-serif;} ' +
-        '.number{mso-number-format:"0.00";} ' +
-        '.text{ mso-number-format:"\@";}</style>' +
-        '<meta name=ProgId content=Excel.Sheet>' +
-        '<meta charset=UTF-8>' +
-        '</head><body>' +
-        this.getTable(true) +
-        '</body></html>', base64 = function (s) {
-        return win.btoa(unescape(encodeURIComponent(s))); // #50
-    };
-    downloadURL(getBlobFromContent(template, 'application/vnd.ms-excel') ||
-        uri + base64(template), this.getFilename() + '.xls');
-};
-/**
- * Export-data module required. View the data in a table below the chart.
- *
- * @function Highcharts.Chart#viewData
- *
- * @emits Highcharts.Chart#event:afterViewData
- */
-Chart.prototype.viewData = function () {
-    this.toggleDataTable(true);
-};
 /**
  * Export-data module required. Hide the data table when visible.
  *
  * @function Highcharts.Chart#hideData
  */
-Chart.prototype.hideData = function () {
+function chartHideData() {
     this.toggleDataTable(false);
-};
-Chart.prototype.toggleDataTable = function (show) {
+}
+/**
+ * @private
+ */
+function chartToggleDataTable(show) {
     show = pick(show, !this.isDataTableVisible);
     // Create the div
     if (show && !this.dataTableDiv) {
@@ -945,8 +632,8 @@ Chart.prototype.toggleDataTable = function (show) {
     var exportDivElements = this.exportDivElements, options = this.options.exporting, menuItems = options &&
         options.buttons &&
         options.buttons.contextButton.menuItems, lang = this.options.lang;
-    if (exportingOptions &&
-        exportingOptions.menuItemDefinitions &&
+    if (options &&
+        options.menuItemDefinitions &&
         lang &&
         lang.viewData &&
         lang.hideData &&
@@ -957,41 +644,214 @@ Chart.prototype.toggleDataTable = function (show) {
             AST.setElementHTML(exportDivElement, this.isDataTableVisible ? lang.hideData : lang.viewData);
         }
     }
-};
-// Add "Download CSV" to the exporting menu.
-var exportingOptions = getOptions().exporting;
-if (exportingOptions) {
-    extend(exportingOptions.menuItemDefinitions, {
-        downloadCSV: {
-            textKey: 'downloadCSV',
-            onclick: function () {
-                this.downloadCSV();
-            }
-        },
-        downloadXLS: {
-            textKey: 'downloadXLS',
-            onclick: function () {
-                this.downloadXLS();
-            }
-        },
-        viewData: {
-            textKey: 'viewData',
-            onclick: function () {
-                this.toggleDataTable();
+}
+/**
+ * Export-data module required. View the data in a table below the chart.
+ *
+ * @function Highcharts.Chart#viewData
+ *
+ * @emits Highcharts.Chart#event:afterViewData
+ */
+function chartViewData() {
+    this.toggleDataTable(true);
+}
+/**
+ * @private
+ */
+function compose(ChartClass) {
+    if (composedClasses.indexOf(ChartClass) === -1) {
+        composedClasses.push(ChartClass);
+        // Add an event listener to handle the showTable option
+        addEvent(ChartClass, 'afterViewData', onChartAfterViewData);
+        addEvent(ChartClass, 'render', onChartRenderer);
+        var chartProto = ChartClass.prototype;
+        chartProto.downloadCSV = chartDownloadCSV;
+        chartProto.downloadXLS = chartDownloadXLS;
+        chartProto.getCSV = chartGetCSV;
+        chartProto.getDataRows = chartGetDataRows;
+        chartProto.getTable = chartGetTable;
+        chartProto.getTableAST = chartGetTableAST;
+        chartProto.hideData = chartHideData;
+        chartProto.toggleDataTable = chartToggleDataTable;
+        chartProto.viewData = chartViewData;
+    }
+    if (composedClasses.indexOf(setOptions) === -1) {
+        composedClasses.push(setOptions);
+        var exportingOptions = getOptions().exporting;
+        // Add "Download CSV" to the exporting menu.
+        // @todo consider move to defaults
+        if (exportingOptions) {
+            extend(exportingOptions.menuItemDefinitions, {
+                downloadCSV: {
+                    textKey: 'downloadCSV',
+                    onclick: function () {
+                        this.downloadCSV();
+                    }
+                },
+                downloadXLS: {
+                    textKey: 'downloadXLS',
+                    onclick: function () {
+                        this.downloadXLS();
+                    }
+                },
+                viewData: {
+                    textKey: 'viewData',
+                    onclick: function () {
+                        this.toggleDataTable();
+                    }
+                }
+            });
+            if (exportingOptions.buttons &&
+                exportingOptions.buttons.contextButton.menuItems) {
+                exportingOptions.buttons.contextButton.menuItems.push('separator', 'downloadCSV', 'downloadXLS', 'viewData');
             }
         }
-    });
-    if (exportingOptions.buttons) {
-        exportingOptions.buttons.contextButton.menuItems.push('separator', 'downloadCSV', 'downloadXLS', 'viewData');
+        setOptions(ExportDataDefaults);
+    }
+    if (AreaRangeSeries && composedClasses.indexOf(AreaRangeSeries) === -1) {
+        composedClasses.push(AreaRangeSeries);
+        AreaRangeSeries.prototype.keyToAxis = {
+            low: 'y',
+            high: 'y'
+        };
+    }
+    if (GanttSeries && composedClasses.indexOf(GanttSeries) === -1) {
+        composedClasses.push(GanttSeries);
+        GanttSeries.prototype.keyToAxis = {
+            start: 'x',
+            end: 'x'
+        };
+    }
+    if (MapSeries && composedClasses.indexOf(MapSeries) === -1) {
+        composedClasses.push(MapSeries);
+        MapSeries.prototype.exportKey = 'name';
+    }
+    if (MapBubbleSeries && composedClasses.indexOf(MapBubbleSeries) === -1) {
+        composedClasses.push(MapBubbleSeries);
+        MapBubbleSeries.prototype.exportKey = 'name';
+    }
+    if (TreemapSeries && composedClasses.indexOf(TreemapSeries) === -1) {
+        composedClasses.push(TreemapSeries);
+        TreemapSeries.prototype.exportKey = 'name';
     }
 }
-// Series specific
-if (seriesTypes.map) {
-    seriesTypes.map.prototype.exportKey = 'name';
+/**
+ * Get a blob object from content, if blob is supported
+ *
+ * @private
+ * @param {string} content
+ *        The content to create the blob from.
+ * @param {string} type
+ *        The type of the content.
+ * @return {string|undefined}
+ *         The blob object, or undefined if not supported.
+ */
+function getBlobFromContent(content, type) {
+    var nav = win.navigator, webKit = (nav.userAgent.indexOf('WebKit') > -1 &&
+        nav.userAgent.indexOf('Chrome') < 0), domurl = win.URL || win.webkitURL || win;
+    try {
+        // MS specific
+        if ((nav.msSaveOrOpenBlob) && win.MSBlobBuilder) {
+            var blob = new win.MSBlobBuilder();
+            blob.append(content);
+            return blob.getBlob('image/svg+xml');
+        }
+        // Safari requires data URI since it doesn't allow navigation to blob
+        // URLs.
+        if (!webKit) {
+            return domurl.createObjectURL(new win.Blob(['\uFEFF' + content], // #7084
+            { type: type }));
+        }
+    }
+    catch (e) {
+        // Ignore
+    }
 }
-if (seriesTypes.mapbubble) {
-    seriesTypes.mapbubble.prototype.exportKey = 'name';
+/**
+ * @private
+ */
+function onChartAfterViewData() {
+    var chart = this, dataTableDiv = chart.dataTableDiv, row = document.querySelectorAll('thead')[0].querySelectorAll('tr')[0], getCellValue = function (tr, index) {
+        return tr.children[index].textContent;
+    }, comparer = function (index, ascending) {
+        return function (a, b) {
+            var sort = function (v1, v2) { return (v1 !== '' && v2 !== '' && !isNaN(v1) && !isNaN(v2) ?
+                v1 - v2 :
+                v1.toString().localeCompare(v2)); };
+            return sort(getCellValue(ascending ? a : b, index), getCellValue(ascending ? b : a, index));
+        };
+    };
+    if (dataTableDiv) {
+        row.childNodes.forEach(function (th) {
+            var table = th.closest('table');
+            th.addEventListener('click', function () {
+                var rows = __spreadArray([], dataTableDiv.querySelectorAll('tr:not(thead tr)'), true), headers = __spreadArray([], th.parentNode.children, true);
+                rows.sort(comparer(headers.indexOf(th), chart.ascendingOrderInTable =
+                    !chart.ascendingOrderInTable)).forEach(function (tr) {
+                    table.appendChild(tr);
+                });
+                headers.forEach(function (th) {
+                    ['highcharts-sort-ascending', 'highcharts-sort-descending']
+                        .forEach(function (className) {
+                        if (th.classList.contains(className)) {
+                            th.classList.remove(className);
+                        }
+                    });
+                });
+                th.classList.add(chart.ascendingOrderInTable ?
+                    'highcharts-sort-ascending' :
+                    'highcharts-sort-descending');
+            });
+        });
+    }
 }
-if (seriesTypes.treemap) {
-    seriesTypes.treemap.prototype.exportKey = 'name';
+/**
+ * Handle the showTable option
+ * @private
+ */
+function onChartRenderer() {
+    if (this.options &&
+        this.options.exporting &&
+        this.options.exporting.showTable &&
+        !this.options.chart.forExport) {
+        this.viewData();
+    }
 }
+/* *
+ *
+ *  Default Export
+ *
+ * */
+var ExportData = {
+    compose: compose
+};
+export default ExportData;
+/* *
+ *
+ *  API Declarations
+ *
+ * */
+/**
+ * Function callback to execute while data rows are processed for exporting.
+ * This allows the modification of data rows before processed into the final
+ * format.
+ *
+ * @callback Highcharts.ExportDataCallbackFunction
+ * @extends Highcharts.EventCallbackFunction<Highcharts.Chart>
+ *
+ * @param {Highcharts.Chart} this
+ * Chart context where the event occured.
+ *
+ * @param {Highcharts.ExportDataEventObject} event
+ * Event object with data rows that can be modified.
+ */
+/**
+ * Contains information about the export data event.
+ *
+ * @interface Highcharts.ExportDataEventObject
+ */ /**
+* Contains the data rows for the current export task and can be modified.
+* @name Highcharts.ExportDataEventObject#dataRows
+* @type {Array<Array<string>>}
+*/
+(''); // keeps doclets above in JS file