handsontable 0.0.0-next-9ec04ce-20221121

package/plugins/nestedHeaders/stateManager/sourceSettings.mjs

@@ -0,0 +1,245 @@
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.array.index-of.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.object.get-own-property-descriptor.js";
+import "core-js/modules/web.dom-collections.for-each.js";
+import "core-js/modules/es.object.get-own-property-descriptors.js";
+var _excluded = ["row", "col"];
+import "core-js/modules/es.array.iterator.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/es.weak-map.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
+function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
+function _classPrivateFieldGet(receiver, privateMap) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get"); return _classApplyDescriptorGet(receiver, descriptor); }
+function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
+function _classPrivateFieldSet(receiver, privateMap, value) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "set"); _classApplyDescriptorSet(receiver, descriptor, value); return value; }
+function _classExtractFieldDescriptor(receiver, privateMap, action) { if (!privateMap.has(receiver)) { throw new TypeError("attempted to " + action + " private field on non-instance"); } return privateMap.get(receiver); }
+function _classApplyDescriptorSet(receiver, descriptor, value) { if (descriptor.set) { descriptor.set.call(receiver, value); } else { if (!descriptor.writable) { throw new TypeError("attempted to set read only private field"); } descriptor.value = value; } }
+import { extend, isObject } from "../../../helpers/object.mjs";
+import { arrayEach } from "../../../helpers/array.mjs";
+import { normalizeSettings } from "./settingsNormalizer.mjs";
+/**
+ * List of properties which are configurable. That properties can be changed using public API.
+ *
+ * @type {string[]}
+ */
+export var HEADER_CONFIGURABLE_PROPS = ['label', 'collapsible'];
+
+/**
+ * The class manages and normalizes settings passed by the developer
+ * into the nested headers plugin. The SourceSettings class is a
+ * source of truth for tree builder (HeaderTree) module.
+ *
+ * @private
+ * @class SourceSettings
+ */
+var _data = /*#__PURE__*/new WeakMap();
+var _dataLength = /*#__PURE__*/new WeakMap();
+var _columnsLimit = /*#__PURE__*/new WeakMap();
+var SourceSettings = /*#__PURE__*/function () {
+  function SourceSettings() {
+    _classCallCheck(this, SourceSettings);
+    _classPrivateFieldInitSpec(this, _data, {
+      writable: true,
+      value: []
+    });
+    _classPrivateFieldInitSpec(this, _dataLength, {
+      writable: true,
+      value: 0
+    });
+    _classPrivateFieldInitSpec(this, _columnsLimit, {
+      writable: true,
+      value: Infinity
+    });
+  }
+  _createClass(SourceSettings, [{
+    key: "setColumnsLimit",
+    value:
+    /**
+     * Sets columns limit to the source settings will be trimmed. All headers which
+     * overlap the column limit will be reduced to keep the structure solid.
+     *
+     * @param {number} columnsCount The number of columns to limit to.
+     */
+    function setColumnsLimit(columnsCount) {
+      _classPrivateFieldSet(this, _columnsLimit, columnsCount);
+    }
+
+    /**
+     * Sets a new nested header configuration.
+     *
+     * @param {Array[]} [nestedHeadersSettings=[]] The user-defined nested headers settings.
+     */
+  }, {
+    key: "setData",
+    value: function setData() {
+      var nestedHeadersSettings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      _classPrivateFieldSet(this, _data, normalizeSettings(nestedHeadersSettings, _classPrivateFieldGet(this, _columnsLimit)));
+      _classPrivateFieldSet(this, _dataLength, _classPrivateFieldGet(this, _data).length);
+    }
+
+    /**
+     * Gets normalized source settings.
+     *
+     * @returns {Array[]}
+     */
+  }, {
+    key: "getData",
+    value: function getData() {
+      return _classPrivateFieldGet(this, _data);
+    }
+
+    /**
+     * Merges settings with current source settings.
+     *
+     * @param {object[]} additionalSettings An array of objects with `row`, `col` and additional
+     *                                      properties to merge with current source settings.
+     */
+  }, {
+    key: "mergeWith",
+    value: function mergeWith(additionalSettings) {
+      var _this = this;
+      arrayEach(additionalSettings, function (_ref) {
+        var row = _ref.row,
+          col = _ref.col,
+          rest = _objectWithoutProperties(_ref, _excluded);
+        var headerSettings = _this.getHeaderSettings(row, col);
+        if (headerSettings !== null) {
+          extend(headerSettings, rest, HEADER_CONFIGURABLE_PROPS);
+        }
+      });
+    }
+
+    /**
+     * Maps the current state with a callback. For each source settings the callback function
+     * is called. If the function returns value that value is merged with the source settings.
+     *
+     * @param {Function} callback A function that is called for every header settings.
+     *                            Each time the callback is called, the returned value extends
+     *                            header settings.
+     */
+  }, {
+    key: "map",
+    value: function map(callback) {
+      arrayEach(_classPrivateFieldGet(this, _data), function (header) {
+        arrayEach(header, function (headerSettings) {
+          var propsToExtend = callback(_objectSpread({}, headerSettings));
+          if (isObject(propsToExtend)) {
+            extend(headerSettings, propsToExtend, HEADER_CONFIGURABLE_PROPS);
+          }
+        });
+      });
+    }
+
+    /**
+     * Gets source column header settings for a specified header. The returned
+     * object contains information about the header label, its colspan length,
+     * or if it is hidden in the header renderers.
+     *
+     * @param {number} headerLevel Header level (0 = most distant to the table).
+     * @param {number} columnIndex A visual column index.
+     * @returns {object|null}
+     */
+  }, {
+    key: "getHeaderSettings",
+    value: function getHeaderSettings(headerLevel, columnIndex) {
+      var _headersSettings$colu;
+      if (headerLevel >= _classPrivateFieldGet(this, _dataLength) || headerLevel < 0) {
+        return null;
+      }
+      var headersSettings = _classPrivateFieldGet(this, _data)[headerLevel];
+      if (columnIndex >= headersSettings.length) {
+        return null;
+      }
+      return (_headersSettings$colu = headersSettings[columnIndex]) !== null && _headersSettings$colu !== void 0 ? _headersSettings$colu : null;
+    }
+
+    /**
+     * Gets source of column headers settings for specified headers. If the retrieved column
+     * settings overlap the range "box" determined by "columnIndex" and "columnsLength"
+     * the exception will be thrown.
+     *
+     * @param {number} headerLevel Header level (0 = most distant to the table).
+     * @param {number} columnIndex A visual column index from which the settings will be extracted.
+     * @param {number} [columnsLength=1] The number of columns involved in the extraction of settings.
+     * @returns {object}
+     */
+  }, {
+    key: "getHeadersSettings",
+    value: function getHeadersSettings(headerLevel, columnIndex) {
+      var columnsLength = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+      var headersSettingsChunks = [];
+      if (headerLevel >= _classPrivateFieldGet(this, _dataLength) || headerLevel < 0) {
+        return headersSettingsChunks;
+      }
+      var headersSettings = _classPrivateFieldGet(this, _data)[headerLevel];
+      var currentLength = 0;
+      for (var i = columnIndex; i < headersSettings.length; i++) {
+        var headerSettings = headersSettings[i];
+        if (headerSettings.isPlaceholder) {
+          throw new Error('The first column settings cannot overlap the other header layers');
+        }
+        currentLength += headerSettings.colspan;
+        headersSettingsChunks.push(headerSettings);
+        if (headerSettings.colspan > 1) {
+          i += headerSettings.colspan - 1;
+        }
+
+        // We met the current sum of the child colspans
+        if (currentLength === columnsLength) {
+          break;
+        }
+        // We exceeds the current sum of the child colspans, the last columns colspan overlaps the "columnsLength" length.
+        if (currentLength > columnsLength) {
+          throw new Error('The last column settings cannot overlap the other header layers');
+        }
+      }
+      return headersSettingsChunks;
+    }
+
+    /**
+     * Gets a total number of headers levels.
+     *
+     * @returns {number}
+     */
+  }, {
+    key: "getLayersCount",
+    value: function getLayersCount() {
+      return _classPrivateFieldGet(this, _dataLength);
+    }
+
+    /**
+     * Gets a total number of columns count.
+     *
+     * @returns {number}
+     */
+  }, {
+    key: "getColumnsCount",
+    value: function getColumnsCount() {
+      return _classPrivateFieldGet(this, _dataLength) > 0 ? _classPrivateFieldGet(this, _data)[0].length : 0;
+    }
+
+    /**
+     * Clears the data.
+     */
+  }, {
+    key: "clear",
+    value: function clear() {
+      _classPrivateFieldSet(this, _data, []);
+      _classPrivateFieldSet(this, _dataLength, 0);
+    }
+  }]);
+  return SourceSettings;
+}();
+export { SourceSettings as default };

package/plugins/nestedHeaders/stateManager/utils.js

@@ -0,0 +1,75 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createDefaultHeaderSettings = createDefaultHeaderSettings;
+exports.createPlaceholderHeaderSettings = createPlaceholderHeaderSettings;
+/**
+ * @typedef {object} DefaultHeaderSettings
+ * @property {string} label The name/label of the column header.
+ * @property {number} colspan Current calculated colspan value of the rendered column header element.
+ * @property {number} origColspan Original colspan value, set once while parsing user-defined nested header settings.
+ * @property {boolean} collapsible The flag determines whether the node is collapsible (can be collapsed/expanded).
+ * @property {number[]} crossHiddenColumns The list of visual column indexes which indicates that the specified columns within
+ *                                         the header settings are hidden.
+ * @property {boolean} isCollapsed The flag determines whether the node is collapsed.
+ * @property {boolean} isHidden The flag determines whether the column header at specified index is hidden. If true
+ *                              the TH element will be rendered as hidden (display: none).
+ * @property {boolean} isRoot The flag which determines whether the column header settings is actually not renderable. That kind
+ *                            of objects are generated after colspaned header to fill an array to correct size.
+ *                            For example for header with colspan = 8 the 7 blank objects are generated to fill the array settings
+ *                            to length = 8.
+ * @property {boolean} isPlaceholder The flag determines whether the column header at the specified index is non-renderable.
+ */
+
+/**
+ * Creates the header settings object with default values.
+ *
+ * @param {DefaultHeaderSettings} initialValues The initial values for the header settings object.
+ * @returns {DefaultHeaderSettings}
+ */
+function createDefaultHeaderSettings() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? '' : _ref$label,
+    _ref$colspan = _ref.colspan,
+    colspan = _ref$colspan === void 0 ? 1 : _ref$colspan,
+    _ref$origColspan = _ref.origColspan,
+    origColspan = _ref$origColspan === void 0 ? 1 : _ref$origColspan,
+    _ref$collapsible = _ref.collapsible,
+    collapsible = _ref$collapsible === void 0 ? false : _ref$collapsible,
+    _ref$crossHiddenColum = _ref.crossHiddenColumns,
+    crossHiddenColumns = _ref$crossHiddenColum === void 0 ? [] : _ref$crossHiddenColum,
+    _ref$isCollapsed = _ref.isCollapsed,
+    isCollapsed = _ref$isCollapsed === void 0 ? false : _ref$isCollapsed,
+    _ref$isHidden = _ref.isHidden,
+    isHidden = _ref$isHidden === void 0 ? false : _ref$isHidden,
+    _ref$isRoot = _ref.isRoot,
+    isRoot = _ref$isRoot === void 0 ? false : _ref$isRoot,
+    _ref$isPlaceholder = _ref.isPlaceholder,
+    isPlaceholder = _ref$isPlaceholder === void 0 ? false : _ref$isPlaceholder;
+  return {
+    label: label,
+    colspan: colspan,
+    origColspan: origColspan,
+    collapsible: collapsible,
+    isCollapsed: isCollapsed,
+    crossHiddenColumns: crossHiddenColumns,
+    isHidden: isHidden,
+    isRoot: isRoot,
+    isPlaceholder: isPlaceholder
+  };
+}
+
+/**
+ * Creates the placeholder header settings object. Those settings tell the header renderers
+ * that this TH element should not be rendered (the node will be overlapped by the previously
+ * created node with colspan bigger than 1).
+ *
+ * @returns {object}
+ */
+function createPlaceholderHeaderSettings() {
+  return {
+    label: '',
+    isPlaceholder: true
+  };
+}

package/plugins/nestedHeaders/stateManager/utils.mjs

@@ -0,0 +1,70 @@
+/**
+ * @typedef {object} DefaultHeaderSettings
+ * @property {string} label The name/label of the column header.
+ * @property {number} colspan Current calculated colspan value of the rendered column header element.
+ * @property {number} origColspan Original colspan value, set once while parsing user-defined nested header settings.
+ * @property {boolean} collapsible The flag determines whether the node is collapsible (can be collapsed/expanded).
+ * @property {number[]} crossHiddenColumns The list of visual column indexes which indicates that the specified columns within
+ *                                         the header settings are hidden.
+ * @property {boolean} isCollapsed The flag determines whether the node is collapsed.
+ * @property {boolean} isHidden The flag determines whether the column header at specified index is hidden. If true
+ *                              the TH element will be rendered as hidden (display: none).
+ * @property {boolean} isRoot The flag which determines whether the column header settings is actually not renderable. That kind
+ *                            of objects are generated after colspaned header to fill an array to correct size.
+ *                            For example for header with colspan = 8 the 7 blank objects are generated to fill the array settings
+ *                            to length = 8.
+ * @property {boolean} isPlaceholder The flag determines whether the column header at the specified index is non-renderable.
+ */
+
+/**
+ * Creates the header settings object with default values.
+ *
+ * @param {DefaultHeaderSettings} initialValues The initial values for the header settings object.
+ * @returns {DefaultHeaderSettings}
+ */
+export function createDefaultHeaderSettings() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? '' : _ref$label,
+    _ref$colspan = _ref.colspan,
+    colspan = _ref$colspan === void 0 ? 1 : _ref$colspan,
+    _ref$origColspan = _ref.origColspan,
+    origColspan = _ref$origColspan === void 0 ? 1 : _ref$origColspan,
+    _ref$collapsible = _ref.collapsible,
+    collapsible = _ref$collapsible === void 0 ? false : _ref$collapsible,
+    _ref$crossHiddenColum = _ref.crossHiddenColumns,
+    crossHiddenColumns = _ref$crossHiddenColum === void 0 ? [] : _ref$crossHiddenColum,
+    _ref$isCollapsed = _ref.isCollapsed,
+    isCollapsed = _ref$isCollapsed === void 0 ? false : _ref$isCollapsed,
+    _ref$isHidden = _ref.isHidden,
+    isHidden = _ref$isHidden === void 0 ? false : _ref$isHidden,
+    _ref$isRoot = _ref.isRoot,
+    isRoot = _ref$isRoot === void 0 ? false : _ref$isRoot,
+    _ref$isPlaceholder = _ref.isPlaceholder,
+    isPlaceholder = _ref$isPlaceholder === void 0 ? false : _ref$isPlaceholder;
+  return {
+    label: label,
+    colspan: colspan,
+    origColspan: origColspan,
+    collapsible: collapsible,
+    isCollapsed: isCollapsed,
+    crossHiddenColumns: crossHiddenColumns,
+    isHidden: isHidden,
+    isRoot: isRoot,
+    isPlaceholder: isPlaceholder
+  };
+}
+
+/**
+ * Creates the placeholder header settings object. Those settings tell the header renderers
+ * that this TH element should not be rendered (the node will be overlapped by the previously
+ * created node with colspan bigger than 1).
+ *
+ * @returns {object}
+ */
+export function createPlaceholderHeaderSettings() {
+  return {
+    label: '',
+    isPlaceholder: true
+  };
+}

package/plugins/nestedHeaders/utils/ghostTable.js

@@ -0,0 +1,167 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _element = require("../../../helpers/dom/element");
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+/**
+ * The class generates the nested headers structure in the DOM and reads the column width for
+ * each column. The hierarchy is built only for visible, non-hidden columns. Each time the
+ * column is shown or hidden, the structure is rebuilt, and the width of the columns in the
+ * map updated.
+ *
+ * @private
+ */
+var GhostTable = /*#__PURE__*/function () {
+  /**
+   * Reference to the Handsontable instance.
+   *
+   * @private
+   * @type {Handsontable}
+   */
+
+  /**
+   * The function for retrieving the nested headers settings.
+   *
+   * @private
+   * @type {Function}
+   */
+
+  /**
+   * The value that holds information about the number of the nested header layers (header rows).
+   *
+   * @private
+   * @type {number}
+   */
+
+  /**
+   * Temporary element created to get minimal headers widths.
+   *
+   * @private
+   * @type {*}
+   */
+
+  /**
+   * PhysicalIndexToValueMap to keep and track of the columns' widths.
+   *
+   * @private
+   * @type {PhysicalIndexToValueMap}
+   */
+
+  function GhostTable(hot, nestedHeaderSettingsGetter) {
+    _classCallCheck(this, GhostTable);
+    _defineProperty(this, "hot", void 0);
+    _defineProperty(this, "nestedHeaderSettingsGetter", void 0);
+    _defineProperty(this, "layersCount", 0);
+    _defineProperty(this, "container", void 0);
+    _defineProperty(this, "widthsMap", void 0);
+    this.hot = hot;
+    this.nestedHeaderSettingsGetter = nestedHeaderSettingsGetter;
+    this.widthsMap = this.hot.columnIndexMapper.createAndRegisterIndexMap('nestedHeaders.widthsMap', 'physicalIndexToValue');
+  }
+
+  /**
+   * Sets the number of nested headers layers count.
+   *
+   * @param {number} layersCount Total number of headers levels.
+   * @returns {GhostTable}
+   */
+  _createClass(GhostTable, [{
+    key: "setLayersCount",
+    value: function setLayersCount(layersCount) {
+      this.layersCount = layersCount;
+      return this;
+    }
+
+    /**
+     * Gets the column width based on the visual column index.
+     *
+     * @param {number} visualColumn Visual column index.
+     * @returns {number|null}
+     */
+  }, {
+    key: "getWidth",
+    value: function getWidth(visualColumn) {
+      return this.widthsMap.getValueAtIndex(this.hot.toPhysicalColumn(visualColumn));
+    }
+
+    /**
+     * Build cache of the headers widths.
+     */
+  }, {
+    key: "buildWidthsMap",
+    value: function buildWidthsMap() {
+      this.container = this.hot.rootDocument.createElement('div');
+      this.container.classList.add('handsontable', 'htGhostTable', 'htAutoSize');
+      this._buildGhostTable(this.container);
+      this.hot.rootDocument.body.appendChild(this.container);
+      var columns = this.container.querySelectorAll('tr:last-of-type th');
+      var maxColumns = columns.length;
+      this.widthsMap.clear();
+      for (var column = 0; column < maxColumns; column++) {
+        var visualColumnsIndex = this.hot.columnIndexMapper.getVisualFromRenderableIndex(column);
+        var physicalColumnIndex = this.hot.toPhysicalColumn(visualColumnsIndex);
+        this.widthsMap.setValueAtIndex(physicalColumnIndex, columns[column].offsetWidth);
+      }
+      this.container.parentNode.removeChild(this.container);
+      this.container = null;
+    }
+
+    /**
+     * Build temporary table for getting minimal columns widths.
+     *
+     * @private
+     * @param {HTMLElement} container The element where the DOM nodes are injected.
+     */
+  }, {
+    key: "_buildGhostTable",
+    value: function _buildGhostTable(container) {
+      var _this$hot = this.hot,
+        rootDocument = _this$hot.rootDocument,
+        columnIndexMapper = _this$hot.columnIndexMapper;
+      var fragment = rootDocument.createDocumentFragment();
+      var table = rootDocument.createElement('table');
+      var isDropdownEnabled = !!this.hot.getSettings().dropdownMenu;
+      var maxRenderedCols = columnIndexMapper.getRenderableIndexesLength();
+      for (var row = 0; row < this.layersCount; row++) {
+        var tr = rootDocument.createElement('tr');
+        for (var col = 0; col < maxRenderedCols; col++) {
+          var visualColumnsIndex = columnIndexMapper.getVisualFromRenderableIndex(col);
+          if (visualColumnsIndex === null) {
+            visualColumnsIndex = col;
+          }
+          var th = rootDocument.createElement('th');
+          var headerSettings = this.nestedHeaderSettingsGetter(row, visualColumnsIndex);
+          if (headerSettings && (!headerSettings.isPlaceholder || headerSettings.isHidden)) {
+            var label = headerSettings.label;
+            if (isDropdownEnabled) {
+              label += '<button class="changeType"></button>';
+            }
+            (0, _element.fastInnerHTML)(th, label);
+            th.colSpan = headerSettings.colspan;
+            tr.appendChild(th);
+          }
+        }
+        table.appendChild(tr);
+      }
+      fragment.appendChild(table);
+      container.appendChild(fragment);
+    }
+
+    /**
+     * Clear the widths cache.
+     */
+  }, {
+    key: "clear",
+    value: function clear() {
+      this.widthsMap.clear();
+      this.container = null;
+    }
+  }]);
+  return GhostTable;
+}();
+var _default = GhostTable;
+exports.default = _default;