text: var __extends = (this && this.__extends) || (function () {
      var extendStatics = function (d, b) {
          extendStatics = Object.setPrototypeOf ||
              ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
              function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
          return extendStatics(d, b);
      }
      return function (d, b) {
          extendStatics(d, b);
          function __() { this.constructor = d; }
          d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
      };
  })();
  import { remove, createElement, closest, formatUnit, Browser } from '@syncfusion/ej2-base';
  import { isNullOrUndefined } from '@syncfusion/ej2-base';
  import { DataManager } from '@syncfusion/ej2-data';
  import { dataReady, modelChanged, refreshVirtualBlock, contentReady } from '../base/constant';
  import * as events from '../base/constant';
  import { RenderType } from '../base/enum';
  import { ContentRender } from './content-renderer';
  import { HeaderRender } from './header-renderer';
  import { InterSectionObserver } from '../services/intersection-observer';
  import { VirtualRowModelGenerator } from '../services/virtual-row-model-generator';
  import { isGroupAdaptive } from '../base/util';
  import { setStyleAttribute } from '@syncfusion/ej2-base';
  /**
   * VirtualContentRenderer
  
   */
  var VirtualContentRenderer = /** @class */ (function (_super) {
      __extends(VirtualContentRenderer, _super);
      function VirtualContentRenderer(parent, locator) {
          var _this = _super.call(this, parent, locator) || this;
          _this.prevHeight = 0;
          _this.currentInfo = {};
          _this.preventEvent = false;
          _this.actions = ['filtering', 'searching', 'grouping', 'ungrouping'];
          _this.offsets = {};
          _this.tmpOffsets = {};
          _this.virtualEle = new VirtualElementHandler();
          _this.offsetKeys = [];
          _this.isFocused = false;
          _this.isSelection = false;
          _this.isBottom = false;
          _this.locator = locator;
          _this.eventListener('on');
          _this.parent.on(events.columnVisibilityChanged, _this.setVisible, _this);
          _this.vgenerator = _this.generator;
          return _this;
      }
      VirtualContentRenderer.prototype.renderTable = function () {
          this.header = this.locator.getService('rendererFactory').getRenderer(RenderType.Header);
          _super.prototype.renderTable.call(this);
          this.virtualEle.table = this.getTable();
          this.virtualEle.content = this.content = this.getPanel().firstChild;
          this.virtualEle.renderWrapper(this.parent.height);
          this.virtualEle.renderPlaceHolder();
          this.virtualEle.wrapper.style.position = 'absolute';
          var debounceEvent = (this.parent.dataSource instanceof DataManager && !this.parent.dataSource.dataSource.offline);
          var opt = {
              container: this.content, pageHeight: this.getBlockHeight() * 2, debounceEvent: debounceEvent,
              axes: this.parent.enableColumnVirtualization ? ['X', 'Y'] : ['Y']
          };
          this.observer = new InterSectionObserver(this.virtualEle.wrapper, opt);
      };
      VirtualContentRenderer.prototype.renderEmpty = function (tbody) {
          this.getTable().appendChild(tbody);
          this.virtualEle.adjustTable(0, 0);
      };
      VirtualContentRenderer.prototype.scrollListener = function (scrollArgs) {
          if (this.parent.enablePersistence) {
              this.parent.scrollPosition = scrollArgs.offset;
          }
          if (this.preventEvent || this.parent.isDestroyed) {
              this.preventEvent = false;
              return;
          }
          if (isNullOrUndefined(document.activeElement)) {
              this.isFocused = false;
          }
          else {
              this.isFocused = this.content === closest(document.activeElement, '.e-content') || this.content === document.activeElement;
          }
          var info = scrollArgs.sentinel;
          var viewInfo = this.currentInfo = this.getInfoFromView(scrollArgs.direction, info, scrollArgs.offset);
          if (isGroupAdaptive(this.parent)) {
              if ((info.axis === 'Y' && this.prevInfo.blockIndexes.toString() === viewInfo.blockIndexes.toString())
                  && scrollArgs.direction === 'up' && viewInfo.blockIndexes[viewInfo.blockIndexes.length - 1] !== 2) {
                  return;
              }
              else {
                  viewInfo.event = 'refresh-virtual-block';
                  if (!isNullOrUndefined(viewInfo.offsets)) {
                      viewInfo.offsets.top = this.content.scrollTop;
                  }
                  this.parent.notify(viewInfo.event, { requestType: 'virtualscroll', virtualInfo: viewInfo, focusElement: scrollArgs.focusElement });
                  return;
              }
          }
          if (this.prevInfo && ((info.axis === 'Y' && this.prevInfo.blockIndexes.toString() === viewInfo.blockIndexes.toString())
              || (info.axis === 'X' && this.prevInfo.columnIndexes.toString() === viewInfo.columnIndexes.toString()))) {
              if (Browser.isIE) {
                  this.parent.hideSpinner();
              }
              return;
          }
          this.parent.setColumnIndexesInView(this.parent.enableColumnVirtualization ? viewInfo.columnIndexes : []);
          this.parent.pageSettings.currentPage = viewInfo.loadNext && !viewInfo.loadSelf ? viewInfo.nextInfo.page : viewInfo.page;
          this.parent.notify(viewInfo.event, { requestType: 'virtualscroll', virtualInfo: viewInfo, focusElement: scrollArgs.focusElement });
      };
      VirtualContentRenderer.prototype.block = function (blk) {
          return this.vgenerator.isBlockAvailable(blk);
      };
      VirtualContentRenderer.prototype.getInfoFromView = function (direction, info, e) {
          var tempBlocks = [];
          var infoType = { direction: direction, sentinelInfo: info, offsets: e };
          var vHeight = this.parent.height.toString().indexOf('%') < 0 ? this.content.getBoundingClientRect().height :
              this.parent.element.getBoundingClientRect().height;
          infoType.page = this.getPageFromTop(e.top + vHeight, infoType);
          infoType.blockIndexes = tempBlocks = this.vgenerator.getBlockIndexes(infoType.page);
          infoType.loadSelf = !this.vgenerator.isBlockAvailable(tempBlocks[infoType.block]);
          var blocks = this.ensureBlocks(infoType);
          infoType.blockIndexes = blocks;
          infoType.loadNext = !blocks.filter(function (val) { return tempBlocks.indexOf(val) === -1; })
              .every(this.block.bind(this));
          infoType.event = (infoType.loadNext || infoType.loadSelf) ? modelChanged : refreshVirtualBlock;
          infoType.nextInfo = infoType.loadNext ? { page: Math.max(1, infoType.page + (direction === 'down' ? 1 : -1)) } : {};
          infoType.columnIndexes = info.axis === 'X' ? this.vgenerator.getColumnIndexes() : this.parent.getColumnIndexesInView();
          if (this.parent.enableColumnVirtualization && info.axis === 'X') {
              infoType.event = refreshVirtualBlock;
          }
          return infoType;
      };
      VirtualContentRenderer.prototype.ensureBlocks = function (info) {
          var _this = this;
          var index = info.blockIndexes[info.block];
          var mIdx;
          var old = index;
          var max = Math.max;
          var indexes = info.direction === 'down' ? [max(index, 1), ++index, ++index] : [max(index - 1, 1), index, index + 1];
          indexes = indexes.filter(function (val, ind) { return indexes.indexOf(val) === ind; });
          if (this.prevInfo.blockIndexes.toString() === indexes.toString()) {
              return indexes;
          }
          if (info.loadSelf || (info.direction === 'down' && this.isEndBlock(old))) {
              indexes = this.vgenerator.getBlockIndexes(info.page);
          }
          indexes.some(function (val, ind) {
              var result = val === (isGroupAdaptive(_this.parent) ? _this.getGroupedTotalBlocks() : _this.getTotalBlocks());
              if (result) {
                  mIdx = ind;
              }
              return result;
          });
          if (mIdx !== undefined) {
              indexes = indexes.slice(0, mIdx + 1);
              if (info.block === 0 && indexes.length === 1 && this.vgenerator.isBlockAvailable(indexes[0] - 1)) {
                  indexes = [indexes[0] - 1, indexes[0]];
              }
          }
          return indexes;
      };
      VirtualContentRenderer.prototype.appendContent = function (target, newChild, e) {
          // currentInfo value will be used if there are multiple dom updates happened due to mousewheel
          var info = e.virtualInfo.sentinelInfo && e.virtualInfo.sentinelInfo.axis === 'Y' && this.currentInfo.page &&
              this.currentInfo.page !== e.virtualInfo.page ? this.currentInfo : e.virtualInfo;
          this.prevInfo = this.prevInfo || e.virtualInfo;
          var cBlock = (info.columnIndexes[0]) - 1;
          var cOffset = this.getColumnOffset(cBlock);
          var width;
          var blocks = info.blockIndexes;
          if (this.parent.groupSettings.columns.length) {
              this.refreshOffsets();
          }
          if (this.parent.height === '100%') {
              this.parent.element.style.height = '100%';
          }
          var vHeight = this.parent.height.toString().indexOf('%') < 0 ? this.content.getBoundingClientRect().height :
              this.parent.element.getBoundingClientRect().height;
          var translate = this.getTranslateY(this.content.scrollTop, vHeight, info);
          this.virtualEle.adjustTable(cOffset, translate);
          if (this.parent.enableColumnVirtualization) {
              this.header.virtualEle.adjustTable(cOffset, 0);
          }
          if (this.parent.enableColumnVirtualization) {
              var cIndex = info.columnIndexes;
              width = this.getColumnOffset(cIndex[cIndex.length - 1]) - this.getColumnOffset(cIndex[0] - 1) + '';
              this.header.virtualEle.setWrapperWidth(width);
          }
          this.virtualEle.setWrapperWidth(width, Browser.isIE || Browser.info.name === 'edge');
          if (!isNullOrUndefined(target.parentNode)) {
              remove(target);
          }
          var tbody = this.parent.element.querySelector('.e-content').querySelector('tbody');
          if (tbody) {
              remove(tbody);
              target = null;
          }
          target = this.parent.createElement('tbody');
          target.appendChild(newChild);
          this.getTable().appendChild(target);
          if (this.parent.groupSettings.columns.length) {
              if (!isGroupAdaptive(this.parent) && info.direction === 'up') {
                  var blk = this.offsets[this.getTotalBlocks()] - this.prevHeight;
                  this.preventEvent = true;
                  var sTop = this.content.scrollTop;
                  this.content.scrollTop = sTop + blk;
              }
              this.setVirtualHeight();
              this.observer.setPageHeight(this.getOffset(blocks[blocks.length - 1]) - this.getOffset(blocks[0] - 1));
          }
          this.prevInfo = info;
          if (this.isFocused) {
              this.content.focus();
          }
          var lastPage = Math.ceil(this.getTotalBlocks() / 2);
          if (this.isBottom) {
              this.isBottom = false;
              this.parent.getContent().firstElementChild.scrollTop = this.offsets[this.offsetKeys.length - 1];
          }
          if ((this.parent.pageSettings.currentPage === lastPage) && blocks.length === 1) {
              this.isBottom = true;
              this.parent.getContent().firstElementChild.scrollTop = this.offsets[this.offsetKeys.length - 2];
          }
      };
      VirtualContentRenderer.prototype.onDataReady = function (e) {
          if (!isNullOrUndefined(e.count)) {
              this.count = e.count;
              this.maxPage = Math.ceil(e.count / this.parent.pageSettings.pageSize);
          }
          this.vgenerator.checkAndResetCache(e.requestType);
          if (['refresh', 'filtering', 'searching', 'grouping', 'ungrouping', 'reorder', undefined]
              .some(function (value) { return e.requestType === value; })) {
              this.refreshOffsets();
          }
          this.setVirtualHeight();
          this.resetScrollPosition(e.requestType);
      };
      VirtualContentRenderer.prototype.setVirtualHeight = function () {
          var width = this.parent.enableColumnVirtualization ?
              this.getColumnOffset(this.parent.columns.length + this.parent.groupSettings.columns.length - 1) + 'px' : '100%';
          this.virtualEle.setVirtualHeight(this.offsets[isGroupAdaptive(this.parent) ? this.getGroupedTotalBlocks() : this.getTotalBlocks()], width);
          if (this.parent.enableColumnVirtualization) {
              this.header.virtualEle.setVirtualHeight(1, width);
          }
      };
      VirtualContentRenderer.prototype.getPageFromTop = function (sTop, info) {
          var _this = this;
          var total = (isGroupAdaptive(this.parent)) ? this.getGroupedTotalBlocks() : this.getTotalBlocks();
          var page = 0;
          var extra = this.offsets[total] - this.prevHeight;
          this.offsetKeys.some(function (offset) {
              var iOffset = Number(offset);
              var border = sTop <= _this.offsets[offset] || (iOffset === total && sTop > _this.offsets[offset]);
              if (border) {
                  info.block = iOffset % 2 === 0 ? 1 : 0;
                  page = Math.max(1, Math.min(_this.vgenerator.getPage(iOffset), _this.maxPage));
              }
              return border;
          });
          return page;
      };
      VirtualContentRenderer.prototype.getTranslateY = function (sTop, cHeight, info, isOnenter) {
          if (info === undefined) {
              info = { page: this.getPageFromTop(sTop + cHeight, {}) };
              info.blockIndexes = this.vgenerator.getBlockIndexes(info.page);
          }
          var block = (info.blockIndexes[0] || 1) - 1;
          var translate = this.getOffset(block);
          var endTranslate = this.getOffset(info.blockIndexes[info.blockIndexes.length - 1]);
          if (isOnenter) {
              info = this.prevInfo;
          }
          var result = translate > sTop ?
              this.getOffset(block - 1) : endTranslate < (sTop + cHeight) ? this.getOffset(block + 1) : translate;
          var blockHeight = this.offsets[info.blockIndexes[info.blockIndexes.length - 1]] -
              this.tmpOffsets[info.blockIndexes[0]];
          if (result + blockHeight > this.offsets[isGroupAdaptive(this.parent) ? this.getGroupedTotalBlocks() : this.getTotalBlocks()]) {
              result -= (result + blockHeight) - this.offsets[this.getTotalBlocks()];
          }
          return result;
      };
      VirtualContentRenderer.prototype.getOffset = function (block) {
          return Math.min(this.offsets[block] | 0, this.offsets[this.maxBlock] | 0);
      };
      VirtualContentRenderer.prototype.onEntered = function () {
          var _this = this;
          return function (element, current, direction, e, isWheel, check) {
              if (Browser.isIE && !isWheel && check && !_this.preventEvent) {
                  _this.parent.showSpinner();
              }
              var xAxis = current.axis === 'X';
              var top = _this.prevInfo.offsets ? _this.prevInfo.offsets.top : null;
              var height = _this.content.getBoundingClientRect().height;
              var x = _this.getColumnOffset(xAxis ? _this.vgenerator.getColumnIndexes()[0] - 1 : _this.prevInfo.columnIndexes[0] - 1);
              var y = _this.getTranslateY(e.top, height, xAxis && top === e.top ? _this.prevInfo : undefined, true);
              _this.virtualEle.adjustTable(x, Math.min(y, _this.offsets[_this.maxBlock]));
              if (_this.parent.enableColumnVirtualization) {
                  _this.header.virtualEle.adjustTable(x, 0);
              }
          };
      };
      VirtualContentRenderer.prototype.dataBound = function () {
          if (this.isSelection) {
              this.isSelection = false;
              this.parent.selectRow(this.selectedRowIndex);
          }
      };
      VirtualContentRenderer.prototype.eventListener = function (action) {
          var _this = this;
          this.parent[action](dataReady, this.onDataReady, this);
          this.parent.addEventListener(events.dataBound, this.dataBound.bind(this));
          this.parent[action](refreshVirtualBlock, this.refreshContentRows, this);
          this.parent[action](events.selectVirtualRow, this.selectVirtualRow, this);
          this.actions.forEach(function (event) { return _this.parent[action](event + "-begin", _this.onActionBegin, _this); });
          var fn = function () {
              _this.observer.observe(function (scrollArgs) { return _this.scrollListener(scrollArgs); }, _this.onEntered());
              var gObj = _this.parent;
              if (gObj.enablePersistence && gObj.scrollPosition) {
                  _this.content.scrollTop = gObj.scrollPosition.top;
                  var scrollValues = { direction: 'down', sentinel: _this.observer.sentinelInfo.down,
                      offset: gObj.scrollPosition, focusElement: gObj.element };
                  _this.scrollListener(scrollValues);
                  if (gObj.enableColumnVirtualization) {
                      _this.content.scrollLeft = gObj.scrollPosition.left;
                  }
              }
              _this.parent.off(contentReady, fn);
          };
          this.parent.on(contentReady, fn, this);
      };
      VirtualContentRenderer.prototype.getBlockSize = function () {
          return this.parent.pageSettings.pageSize >> 1;
      };
      VirtualContentRenderer.prototype.getBlockHeight = function () {
          return this.getBlockSize() * this.parent.getRowHeight();
      };
      VirtualContentRenderer.prototype.isEndBlock = function (index) {
          var totalBlocks = this.getTotalBlocks();
          return index >= totalBlocks || index === totalBlocks - 1;
      };
      VirtualContentRenderer.prototype.getGroupedTotalBlocks = function () {
          var rows = this.parent.vcRows;
          return Math.floor((rows.length / this.getBlockSize()) < 1 ? 1 : rows.length / this.getBlockSize());
      };
      VirtualContentRenderer.prototype.getTotalBlocks = function () {
          return Math.ceil(this.count / this.getBlockSize());
      };
      VirtualContentRenderer.prototype.getColumnOffset = function (block) {
          return this.vgenerator.cOffsets[block] | 0;
      };
      VirtualContentRenderer.prototype.getModelGenerator = function () {
          return new VirtualRowModelGenerator(this.parent);
      };
      VirtualContentRenderer.prototype.resetScrollPosition = function (action) {
          if (this.actions.some(function (value) { return value === action; })) {
              this.preventEvent = this.content.scrollTop !== 0;
              this.content.scrollTop = 0;
          }
      };
      VirtualContentRenderer.prototype.onActionBegin = function (e) {
          //Update property silently..
          this.parent.setProperties({ pageSettings: { currentPage: 1 } }, true);
      };
      VirtualContentRenderer.prototype.getRows = function () {
          return this.vgenerator.getRows();
      };
      VirtualContentRenderer.prototype.getRowByIndex = function (index) {
          if (isGroupAdaptive(this.parent)) {
              return this.parent.getDataRows()[index];
          }
          var prev = this.prevInfo.blockIndexes;
          var startIdx = (prev[0] - 1) * this.getBlockSize();
          return this.parent.getDataRows()[index - startIdx];
      };
      VirtualContentRenderer.prototype.getVirtualRowIndex = function (index) {
          var prev = this.prevInfo.blockIndexes;
          var startIdx = (prev[0] - 1) * this.getBlockSize();
          return startIdx + index;
      };
      VirtualContentRenderer.prototype.refreshOffsets = function () {
          var _this = this;
          var gObj = this.parent;
          var row = 0;
          var bSize = this.getBlockSize();
          var total = isGroupAdaptive(this.parent) ? this.getGroupedTotalBlocks() : this.getTotalBlocks();
          this.prevHeight = this.offsets[total];
          this.maxBlock = total % 2 === 0 ? total - 2 : total - 1;
          this.offsets = {};
          //Row offset update
          Array.apply(null, Array(total)).map(function () { return ++row; })
              .forEach(function (block) {
              var tmp = (_this.vgenerator.cache[block] || []).length;
              var rem = !isGroupAdaptive(_this.parent) ? _this.count % bSize : (gObj.vcRows.length % bSize);
              var size = !isGroupAdaptive(_this.parent) && block in _this.vgenerator.cache ?
                  tmp * _this.parent.getRowHeight() : rem && block === total ? rem * _this.parent.getRowHeight() : _this.getBlockHeight();
              // let size: number = this.parent.groupSettings.columns.length && block in this.vgenerator.cache ?
              // tmp * getRowHeight() : this.getBlockHeight();
              _this.offsets[block] = (_this.offsets[block - 1] | 0) + size;
              _this.tmpOffsets[block] = _this.offsets[block - 1] | 0;
          });
          this.offsetKeys = Object.keys(this.offsets);
          if (isGroupAdaptive(this.parent)) {
              this.parent.vGroupOffsets = this.offsets;
          }
          //Column offset update
          if (this.parent.enableColumnVirtualization) {
              this.vgenerator.refreshColOffsets();
          }
      };
      VirtualContentRenderer.prototype.refreshVirtualElement = function () {
          this.vgenerator.refreshColOffsets();
          this.setVirtualHeight();
      };
      VirtualContentRenderer.prototype.setVisible = function (columns) {
          var gObj = this.parent;
          var rows = [];
          rows = this.getRows();
          var testRow;
          rows.some(function (r) { if (r.isDataRow) {
              testRow = r;
          } return r.isDataRow; });
          var needFullRefresh = true;
          if (!gObj.groupSettings.columns.length && testRow) {
              needFullRefresh = false;
          }
          var tr = gObj.getDataRows();
          for (var c = 0, clen = columns.length; c < clen; c++) {
              var column = columns[c];
              var idx = gObj.getNormalizedColumnIndex(column.uid);
              var displayVal = column.visible === true ? '' : 'none';
              if (idx !== -1 && testRow && idx < testRow.cells.length) {
                  setStyleAttribute(this.getColGroup().childNodes[idx], { 'display': displayVal });
              }
              if (!needFullRefresh) {
                  var width = void 0;
                  if (column.visible) {
                      width = this.virtualEle.wrapper.offsetWidth + parseInt(column.width.toString(), 10);
                  }
                  else {
                      width = this.virtualEle.wrapper.offsetWidth - parseInt(column.width.toString(), 10);
                  }
                  if (width > gObj.width) {
                      this.setDisplayNone(tr, idx, displayVal, rows);
                      this.virtualEle.setWrapperWidth(width + '');
                      this.vgenerator.refreshColOffsets();
                      this.refreshVirtualElement();
                  }
                  else {
                      this.refreshContentRows({ requestType: 'refresh' });
                  }
              }
              if (!this.parent.invokedFromMedia && column.hideAtMedia) {
                  this.parent.updateMediaColumns(column);
              }
              this.parent.invokedFromMedia = false;
          }
          if (needFullRefresh) {
              this.refreshContentRows({ requestType: 'refresh' });
          }
          else {
              this.parent.notify(events.partialRefresh, { rows: rows, args: { isFrozen: false, rows: rows } });
          }
      };
      VirtualContentRenderer.prototype.selectVirtualRow = function (args) {
          this.isSelection = true;
          this.selectedRowIndex = args.selectedIndex;
          var page = Math.ceil((args.selectedIndex + 1) / this.parent.pageSettings.pageSize);
          var blockIndexes = this.vgenerator.getBlockIndexes(page);
          var scrollTop = this.offsets[blockIndexes[0] - 1];
          this.parent.getContent().firstElementChild.scrollTop = scrollTop;
      };
      return VirtualContentRenderer;
  }(ContentRender));
  export { VirtualContentRenderer };
  /**
  
   */
  var VirtualHeaderRenderer = /** @class */ (function (_super) {
      __extends(VirtualHeaderRenderer, _super);
      function VirtualHeaderRenderer(parent, locator) {
          var _this = _super.call(this, parent, locator) || this;
          _this.virtualEle = new VirtualElementHandler();
          _this.gen = new VirtualRowModelGenerator(_this.parent);
          _this.parent.on(events.columnVisibilityChanged, _this.setVisible, _this);
          _this.parent.on(refreshVirtualBlock, function (e) { return e.virtualInfo.sentinelInfo.axis === 'X' ? _this.refreshUI() : null; }, _this);
          return _this;
      }
      VirtualHeaderRenderer.prototype.renderTable = function () {
          this.gen.refreshColOffsets();
          this.parent.setColumnIndexesInView(this.gen.getColumnIndexes(this.getPanel().firstChild));
          _super.prototype.renderTable.call(this);
          this.virtualEle.table = this.getTable();
          this.virtualEle.content = this.getPanel().firstChild;
          this.virtualEle.content.style.position = 'relative';
          this.virtualEle.renderWrapper();
          this.virtualEle.renderPlaceHolder('absolute');
      };
      VirtualHeaderRenderer.prototype.appendContent = function (table) {
          this.virtualEle.wrapper.appendChild(table);
      };
      VirtualHeaderRenderer.prototype.refreshUI = function () {
          this.gen.refreshColOffsets();
          this.parent.setColumnIndexesInView(this.gen.getColumnIndexes(this.getPanel().firstChild));
          _super.prototype.refreshUI.call(this);
      };
      VirtualHeaderRenderer.prototype.setVisible = function (columns) {
          var gObj = this.parent;
          var displayVal;
          var idx;
          for (var c = 0, clen = columns.length; c < clen; c++) {
              var column = columns[c];
              idx = gObj.getNormalizedColumnIndex(column.uid);
              displayVal = column.visible ? '' : 'none';
              setStyleAttribute(this.getColGroup().children[idx], { 'display': displayVal });
              if (gObj.enableColumnVirtualization && !gObj.groupSettings.columns.length) {
                  var tablewidth = void 0;
                  if (column.visible) {
                      tablewidth = this.virtualEle.wrapper.offsetWidth + parseInt(column.width.toString(), 10);
                  }
                  else {
                      tablewidth = this.virtualEle.wrapper.offsetWidth - parseInt(column.width.toString(), 10);
                  }
                  if (tablewidth > gObj.width) {
                      this.setDisplayNone(column, displayVal);
                      this.virtualEle.setWrapperWidth(tablewidth + '');
                      this.gen.refreshColOffsets();
                  }
                  else {
                      this.refreshUI();
                  }
              }
              else {
                  this.refreshUI();
              }
          }
      };
      VirtualHeaderRenderer.prototype.setDisplayNone = function (col, displayVal) {
          for (var _i = 0, _a = [].slice.apply(this.getTable().querySelectorAll('th.e-headercell')); _i < _a.length; _i++) {
              var ele = _a[_i];
              if (ele.querySelector('[e-mappinguid]') &&
                  ele.querySelector('[e-mappinguid]').getAttribute('e-mappinguid') === col.uid) {
                  setStyleAttribute(ele, { 'display': displayVal });
                  break;
              }
          }
      };
      return VirtualHeaderRenderer;
  }(HeaderRender));
  export { VirtualHeaderRenderer };
  /**
  
   */
  var VirtualElementHandler = /** @class */ (function () {
      function VirtualElementHandler() {
      }
      VirtualElementHandler.prototype.renderWrapper = function (height) {
          this.wrapper = createElement('div', { className: 'e-virtualtable', styles: "min-height:" + formatUnit(height) });
          this.wrapper.appendChild(this.table);
          this.content.appendChild(this.wrapper);
      };
      VirtualElementHandler.prototype.renderPlaceHolder = function (position) {
          if (position === void 0) { position = 'relative'; }
          this.placeholder = createElement('div', { className: 'e-virtualtrack', styles: "position:" + position });
          this.content.appendChild(this.placeholder);
      };
      VirtualElementHandler.prototype.adjustTable = function (xValue, yValue) {
          this.wrapper.style.transform = "translate(" + xValue + "px, " + yValue + "px)";
      };
      VirtualElementHandler.prototype.setWrapperWidth = function (width, full) {
          this.wrapper.style.width = width ? width + "px" : full ? '100%' : '';
      };
      VirtualElementHandler.prototype.setVirtualHeight = function (height, width) {
          this.placeholder.style.height = height + "px";
          this.placeholder.style.width = width;
      };
      return VirtualElementHandler;
  }());
  export { VirtualElementHandler };
  