@refinitiv-ui/efx-grid 6.0.16 → 6.0.18

package/lib/tr-grid-in-cell-editing/es6/InCellEditing.js

@@ -6,6 +6,7 @@ import { ElfUtil } from "../../tr-grid-util/es6/ElfUtil.js";
 import { isTouchDevice, injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
 import { ElfDate } from "../../tr-grid-util/es6/ElfDate.js";
 import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
+
 /** @typedef {Object} InCellEditingPlugin~Options
 * @description InCellEditingPlugin options that can be specified from `inCellEditing` property of the main grid's options
 * @property {boolean=} balloonMode=false Show editor in a balloon. This is useful when there is not much space in the cell
@@ -42,6 +43,7 @@ import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
 * @description Editor options specified through `inCellEditing` property on the column configuration object
 * @property {string=} type="text" Specify type of the editor. Available types are text, number, dropdown, date, checkbox, and combobox.
 * @property {Array=} entries=null Specify list of items available in the dropdown box
+* @property {Object=} attributes=null Specify attribute of input element
 */
 
 /** @typedef {Object} InCellEditingPlugin~ColumnOptions
@@ -145,7 +147,6 @@ import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
 * @param {InCellEditingPlugin~Options=} options
 * @extends {GridPlugin}
 */
-
 var InCellEditingPlugin = function InCellEditingPlugin(options) {
   var t = this;
   t._onDoubleClick = t._onDoubleClick.bind(t);
@@ -162,20 +163,18 @@ var InCellEditingPlugin = function InCellEditingPlugin(options) {
   t._onValueChanged = t._onValueChanged.bind(t);
   t._onAutoSuggestItemSelected = t._onAutoSuggestItemSelected.bind(t);
   t._hosts = [];
-
   if (options) {
     this.config({
       "inCellEditing": options
     });
   }
 };
-
 Ext.inherits(InCellEditingPlugin, GridPlugin);
+
 /** @type {Object}
 * @private
 * @static
 */
-
 InCellEditingPlugin._uiElementTypesMap = {
   "input": "input",
   "text": "input",
@@ -187,209 +186,197 @@ InCellEditingPlugin._uiElementTypesMap = {
   "boolean": "ef-checkbox",
   "combobox": "ef-combo-box"
 };
+
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._editableTitle = false;
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._editableContent = false;
+
 /** Position of text editor is active.
 * @type {Object}
 * @private
 */
-
 InCellEditingPlugin.prototype._activePos = null;
+
 /** Where the cell was user double-cliked.
 * @type {Object}
 * @private
 */
-
 InCellEditingPlugin.prototype._activeCell = null;
+
 /** row id that editor placed
 * @type {string}
 * @private
 */
-
 InCellEditingPlugin.prototype._activeRowId = "";
+
 /** Previous core grid object that editor open.
 * @type {Object}
 * @private
 */
-
 InCellEditingPlugin.prototype._lastActiveGrid = null;
+
 /** Previous content cell before user editited, use to rollback when user cancelled.
 * @type {*}
 * @private
 */
-
 InCellEditingPlugin.prototype._prevContent = null;
+
 /** @type {string}
 * @private
 */
-
 InCellEditingPlugin.prototype._initialText = "";
+
 /** @type {!InCellEditingPlugin~Cache}
 * @private
 */
-
 InCellEditingPlugin.prototype._headerInCellCache = null;
+
 /** @type {!InCellEditingPlugin~Cache}
 * @private
 */
-
 InCellEditingPlugin.prototype._activeInCellCache = null;
+
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._usingBalloon = false;
+
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._balloonMode = false;
+
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._dataBinding = true;
+
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._dblClick = true;
+
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._autoCommitText = false;
+
 /** @type {number}
 * @private
 */
-
 InCellEditingPlugin.prototype._touchTimerId = 0;
+
 /** @type {number}
 * @private
 */
-
 InCellEditingPlugin.prototype._longPressTime = 1000; // For touch screen
 
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._editing = false;
+
 /** Where other element stored.
 * @type {Element}
 * @private
 */
-
 InCellEditingPlugin.prototype._customElement = null;
+
 /** Popup element where custom element stored.
 * @type {Popup}
 * @private
 */
-
 InCellEditingPlugin.prototype._customElementPopup = null;
 /** @type {Number}
 * @private
 */
-
 InCellEditingPlugin.prototype._tabToMove = false;
 /** @type {string}
 * @private
 */
-
 InCellEditingPlugin.prototype._contentSource = "textContent";
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._inlineStyling = false;
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._disablingScroll = false;
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._uiBlocking = false;
 /** @type {Element}
 * @private
 */
-
 InCellEditingPlugin.prototype._autoSuggest = null;
 /** @type {string}
 * @private
 */
-
 InCellEditingPlugin.prototype._defaultTag = "input";
 /** status to show that row is closing
 * @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._rowClosing = false;
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin.prototype._closingOnScroll = true;
 /** @type {number}
 * @private
 */
-
 InCellEditingPlugin.prototype._editorTimerId = 0;
 /** @type {boolean}
 * @private
 */
-
 InCellEditingPlugin._scrolling = false;
+
 /** @type {number}
 * @private
 */
-
 InCellEditingPlugin.prototype._elfVersion = 0;
 /** @type {string}
 * @private
 */
-
 InCellEditingPlugin._primaryColor = "";
+
 /** @type {string}
 * @private
 */
-
 InCellEditingPlugin._styles = prettifyCss([":host .cell.editing input[type=text]", ["border-style: solid;"]]);
+
 /** @private
 */
-
 InCellEditingPlugin._onThemeLoaded = function () {
   var colors = ElfUtil.getColors();
   InCellEditingPlugin._primaryColor = colors.primary;
 };
+
 /** @private
 * @param {string} tag element tag
+* @param {Object=} attributes attribute of input element
 * @return {Element} input element
 */
-
-
-InCellEditingPlugin.prototype._createInputElement = function (tag) {
+InCellEditingPlugin.prototype._createInputElement = function (tag, attributes) {
   var t = this;
   var elem = document.createElement(tag);
-  var typeMap = InCellEditingPlugin._uiElementTypesMap; // Resolve elf theme style
-
+  for (var attribute in attributes) {
+    elem.setAttribute(attribute, attributes[attribute]);
+  }
+  var typeMap = InCellEditingPlugin._uiElementTypesMap;
+  // Resolve elf theme style
   elem.style.width = "100%";
   elem.style.height = "100%";
   elem.style.margin = "0";
   elem.style.borderColor = InCellEditingPlugin._primaryColor || "#ee7600";
   elem.style.maxHeight = "unset";
-
   if (tag === typeMap.checkbox) {
     elem.style.borderStyle = "solid";
     elem.style.borderWidth = "1px";
@@ -408,13 +395,10 @@ InCellEditingPlugin.prototype._createInputElement = function (tag) {
   } else if (tag === typeMap.input) {
     elem.setAttribute("type", "text");
   }
-
   if (this._autoSuggest) {
     this._autoSuggest.addEventListener("item-select", t._onAutoSuggestItemSelected);
-
     this._autoSuggest.addEventListener("wheel", t._stopPropagation, false);
   }
-
   elem.addEventListener("keydown", t._onTextKeyDown, false);
   elem.addEventListener("keyup", t._onTextKeyUp, false);
   elem.addEventListener("mousedown", t._stopPropagation, false);
@@ -425,43 +409,38 @@ InCellEditingPlugin.prototype._createInputElement = function (tag) {
   elem.addEventListener("paste", t._stopPropagation, false);
   return elem;
 };
+
 /** @private
 * @return {Element}
 */
-
-
 InCellEditingPlugin.prototype._createEditor = function () {
   var editor = document.createElement("div");
   editor.className = "cell editing";
   editor.style.position = "absolute";
   return editor;
 };
+
 /** @private
 * @param {Element} editor
 * @return {Popup} popup instance
 */
-
-
 InCellEditingPlugin.prototype._createBalloonPopup = function (editor) {
   var popup = new Popup(editor, {
     positioning: "over"
   });
   return popup;
 };
+
 /** @private
 * @param {Object} grid core grid object
 * @param {string} elemTag
+* @param {Object=} attributes of element
 * @return {object} inCellCache
 */
-
-
-InCellEditingPlugin.prototype._createInCellCache = function (grid, elemTag) {
+InCellEditingPlugin.prototype._createInCellCache = function (grid, elemTag, attributes) {
   var t = this;
-
   var editor = t._createEditor();
-
-  var inputElement = t._createInputElement(elemTag);
-
+  var inputElement = t._createInputElement(elemTag, attributes);
   var balloonPopup = new Popup(editor, {
     positioning: "over"
   });
@@ -473,114 +452,96 @@ InCellEditingPlugin.prototype._createInCellCache = function (grid, elemTag) {
     balloonPopup: balloonPopup
   };
 };
+
 /** @private
 * @param {Object} grid core grid object
 * @return {object} inCellCache
 */
-
-
 InCellEditingPlugin.prototype._createTitleEditor = function (grid) {
   var t = this;
-
   if (!t._headerInCellCache) {
     t._headerInCellCache = t._createInCellCache(grid, "input");
   }
-
   return t._headerInCellCache;
 };
+
 /** @private
 * @param {number} columnIndex
 * @param {Object} grid core grid object
 * @return {object} inCellCache
 */
-
-
 InCellEditingPlugin.prototype._createContentEditor = function (columnIndex, grid) {
   var t = this;
   var typeMap = InCellEditingPlugin._uiElementTypesMap;
-
   var columnData = t._getColumnData(columnIndex, grid);
-
   var inCellColumnConfig = columnData["inCellEditing"];
   var elemTag = typeMap[inCellColumnConfig && inCellColumnConfig.type] || t._defaultTag;
-
   if (!columnData["inCellCache"]) {
-    columnData["inCellCache"] = t._createInCellCache(grid, elemTag);
+    var attributes = inCellColumnConfig ? inCellColumnConfig.attributes : null;
+    columnData["inCellCache"] = t._createInCellCache(grid, elemTag, attributes);
   }
+  var inCellCache = columnData["inCellCache"];
 
-  var inCellCache = columnData["inCellCache"]; // Setup initial value for the editor
-
+  // Setup initial value for the editor
   if (elemTag === typeMap.select || elemTag === typeMap.combobox) {
     inCellCache["inputElement"].data = inCellColumnConfig && inCellColumnConfig.entries;
   }
-
   return inCellCache;
 };
 /** @override
 * @return {string}
 */
-
-
 InCellEditingPlugin.prototype.getName = function () {
   return "InCellEditingPlugin";
 };
+
 /** @private
 * @param {Event|Element} e
 */
-
-
 InCellEditingPlugin.prototype._onColumnAdded = function (e) {
   if (e.context && e.colIndex != null) {
     //	e.context is a columnOption;
     this._retrieveColumnOption(e.context, e.colIndex);
   }
 };
+
 /** Called by grid system when initial plugins.
 * @public
 * @param {Object} host core grid object
 * @param {Object} options
 */
-
-
 InCellEditingPlugin.prototype.initialize = function (host, options) {
   if (this._hosts.indexOf(host) >= 0) {
     return;
   }
-
   if (!this._hosts.length) {
     window.addEventListener("scroll", this._onScroll);
   }
-
   host.listen("columnAdded", this._onColumnAdded);
   host.getVScrollbar().listen("scroll", this._onScroll);
   host.getHScrollbar().listen("scroll", this._onScroll);
-
   if (this._dblClick) {
-    host.listen("dblclick", this._onDoubleClick); // Make a comparable functionality for touchscreen
+    host.listen("dblclick", this._onDoubleClick);
 
+    // Make a comparable functionality for touchscreen
     if (isTouchDevice()) {
       host.listen("touchstart", this._onTouchStart);
       host.listen("touchend", this._onTouchEnd);
       host.listen("touchcancel", this._onTouchEnd);
     }
   }
-
   this._hosts.push(host);
-
   if (ElfUtil.getElfVersion() < 4) {
     // ef-input available in elf version < 4
     InCellEditingPlugin._uiElementTypesMap["number"] = "ef-input";
   }
-
   if (ElfUtil.isHaloTheme()) {
     if (!host._inCellEditingStyles) {
       host._inCellEditingStyles = true;
       injectCss(InCellEditingPlugin._styles, host.getElement());
     }
   }
-
   this.config(options);
-
   if (!InCellEditingPlugin._primaryColor) {
     ElfUtil.getThemeColors().then(InCellEditingPlugin._onThemeLoaded)["catch"](InCellEditingPlugin._onThemeLoaded);
   }
@@ -591,8 +552,6 @@ InCellEditingPlugin.prototype.initialize = function (host, options) {
 * @param {*} optionVal
 * @return {*} The transformed value of the option
 */
-
-
 InCellEditingPlugin.prototype.beforeProcessOption = function (optionName, optionVal) {
   if (optionName == "cellEditing") {
     return null; // eslint-disable-line
@@ -603,36 +562,31 @@ InCellEditingPlugin.prototype.beforeProcessOption = function (optionName, option
 /** @private
 * @override
 */
-
-
 InCellEditingPlugin.prototype._afterInit = function () {
   this._elfVersion = ElfUtil.getElfVersion();
 };
+
 /** @public
 * @param {Object=} options
 */
-
-
 InCellEditingPlugin.prototype.config = function (options) {
   if (!options) {
     return;
   }
+  var t = this;
 
-  var t = this; // config column
-
+  // config column
   var columns = options["columns"];
-
   if (columns) {
     var len = columns.length;
-
     for (var c = 0; c < len; ++c) {
       t._retrieveColumnOption(columns[c], c);
     }
   }
-
   var pluginOption = options["inCellEditing"];
-  if (!pluginOption) return; // options
+  if (!pluginOption) return;
 
+  // options
   if (pluginOption["type"]) t._defaultTag = InCellEditingPlugin._uiElementTypesMap[pluginOption["type"]];
   if (pluginOption["balloonMode"]) t.enableBalloonMode(pluginOption["balloonMode"]);
   if (pluginOption["editableTitle"]) t.enableTitleEditing(pluginOption["editableTitle"]);
@@ -641,34 +595,27 @@ InCellEditingPlugin.prototype.config = function (options) {
   if (pluginOption["autoCommitText"]) t.enableAutoCommitText(pluginOption["autoCommitText"]);
   if (pluginOption["dataBinding"] != null) t.disableDataBinding(!pluginOption["dataBinding"]);
   if (pluginOption["contentSource"] != null) t._contentSource = pluginOption["contentSource"];
-
   if (pluginOption["popupElement"]) {
     t.setPopupElement(pluginOption["popupElement"]);
   }
-
   if (pluginOption["doubleClick"] != null) t.disableDblClick(!pluginOption["doubleClick"]);
-
   if (pluginOption["inlineStyling"]) {
     t._inlineStyling = true;
   }
-
   if (pluginOption["disablingScroll"]) {
     t._disablingScroll = true;
   }
-
   if (pluginOption["uiBlocking"]) {
     t._uiBlocking = true;
   }
-
   if (pluginOption["autoSuggest"]) {
     t._autoSuggest = pluginOption["autoSuggest"];
   }
-
   if (pluginOption["closingOnScroll"] == false) {
     t._closingOnScroll = false;
-  } // event callback
-
+  }
 
+  // event callback
   t.addListener(pluginOption, "preEditorOpening");
   t.addListener(pluginOption, "editorOpened");
   t.addListener(pluginOption, "beforeCommit");
@@ -677,51 +624,52 @@ InCellEditingPlugin.prototype.config = function (options) {
   t.addListener(pluginOption, "beforeRowCommit");
   t.addListener(pluginOption, "rowEditorClosed");
 };
+
 /** Get a current state of grid and extension config
  * @public
  * @param {Object=} out_obj
  * @returns {!Object}
  */
-
-
 InCellEditingPlugin.prototype.getConfigObject = function (out_obj) {
   var obj = out_obj || {};
   var columns = obj.columns;
-
   if (!columns) {
     columns = obj.columns = [];
   }
-
   var len = this.getColumnCount();
-
+  var val, opt;
   for (var i = 0; i < len; ++i) {
     var col = columns[i];
-
     if (!col) {
       col = columns[i] = {};
     }
-
-    var opt = this._getColumnData(i);
-
+    opt = this._getColumnData(i);
     if (!opt) {
       continue;
     }
-
     if (opt.editableContent != null) {
       col.editableContent = opt.editableContent;
     }
-
     if (opt.inCellEditing != null) {
-      col.inCellEditing = opt.inCellEditing;
+      col.inCellEditing = {};
+      val = opt.inCellEditing["type"];
+      if (val != null) {
+        col.inCellEditing["type"] = val;
+      }
+      val = opt.inCellEditing["entries"];
+      if (val != null) {
+        col.inCellEditing["entries"] = val;
+      }
+      val = opt.inCellEditing["attributes"];
+      if (val != null) {
+        col.inCellEditing["attributes"] = val;
+      }
     }
   }
-
   var extOptions = obj.inCellEditing;
-
   if (!extOptions) {
     extOptions = obj.inCellEditing = {};
   }
-
   extOptions.balloonMode = this._balloonMode;
   extOptions.editableTitle = this._editableTitle;
   extOptions.editableContent = this._editableContent;
@@ -735,19 +683,16 @@ InCellEditingPlugin.prototype.getConfigObject = function (out_obj) {
   extOptions.uiBlocking = this._uiBlocking;
   return obj;
 };
+
 /** @private
 * @param {Object} columnOption
 * @param {number} colIndex
 */
-
-
 InCellEditingPlugin.prototype._retrieveColumnOption = function (columnOption, colIndex) {
   var pluginOptions = columnOption["inCellEditing"];
   var editableContent = columnOption["editableContent"];
-
   if (pluginOptions != null || editableContent != null) {
     var colData = this._newColumnData(colIndex);
-
     if (pluginOptions != null) {
       colData["inCellEditing"] = pluginOptions;
       pluginOptions.entries = CoralItems.create(pluginOptions.entries); // Create entries for coral select and combobox
@@ -758,18 +703,14 @@ InCellEditingPlugin.prototype._retrieveColumnOption = function (columnOption, co
     }
   }
 };
-/** @override */
-
 
+/** @override */
 InCellEditingPlugin.prototype.unload = function (host) {
   var at = this._hosts.indexOf(host);
-
   if (at < 0) {
     return;
   }
-
   this._hosts.splice(at, 1);
-
   host.unlisten("columnAdded", this._onColumnAdded);
   host.getVScrollbar().unlisten("scroll", this._onScroll);
   host.getHScrollbar().unlisten("scroll", this._onScroll);
@@ -777,15 +718,14 @@ InCellEditingPlugin.prototype.unload = function (host) {
   host.unlisten("touchstart", this._onTouchStart);
   host.unlisten("touchend", this._onTouchEnd);
   host.unlisten("touchcancel", this._onTouchEnd);
-
   if (!this._hosts.length) {
     this._touchTimerId = 0;
     this._editorTimerId = 0;
     window.removeEventListener("scroll", this._onScroll);
   }
-
   this._dispose();
 };
+
 /** @public
 * @param {number} colIndex
 * @param {number} rowIndex
@@ -793,23 +733,17 @@ InCellEditingPlugin.prototype.unload = function (host) {
 * @param {Object=} grid core grid object
 * @fires InCellEditingPlugin#editorOpened
 */
-
-
 InCellEditingPlugin.prototype.openEditor = function (colIndex, rowIndex, sectionRef, grid) {
   if (!grid) {
     grid = this._hosts[0];
-
     if (!grid) {
       return;
     }
   }
-
   var sectionSettings = grid.getSectionSettings(sectionRef || "content");
   var activePos = this._activePos;
-
   if (activePos) {
     var sectionName = sectionSettings ? sectionSettings.getType() : "";
-
     if (activePos["colIndex"] === colIndex && activePos["rowIndex"] === rowIndex && activePos["sectionName"] === sectionName && activePos["grid"] === grid) {
       return; // The same cell is open twice
     }
@@ -819,7 +753,6 @@ InCellEditingPlugin.prototype.openEditor = function (colIndex, rowIndex, section
 
   var section = sectionSettings ? sectionSettings.getSection() : null;
   var cell = section ? section.getCell(colIndex, rowIndex) : null;
-
   if (!cell) {
     return; // Some input is invalid
   }
@@ -829,85 +762,76 @@ InCellEditingPlugin.prototype.openEditor = function (colIndex, rowIndex, section
 
   setTimeout(this._openEditor.bind(this, cell, grid), 100);
 };
+
 /** @public
 * @param {boolean=} opt_forceCommit
 * @fires InCellEditingPlugin#cancelled
 */
-
-
 InCellEditingPlugin.prototype.closeCellEditor = function (opt_forceCommit) {
   this._commitText(opt_forceCommit || this._autoCommitText);
 };
+
 /** @public
 * @param {boolean=} opt_enabled
 */
-
-
 InCellEditingPlugin.prototype.enableBalloonMode = function (opt_enabled) {
   this._balloonMode = opt_enabled !== false;
 };
+
 /** @public
 * @param {boolean=} opt_enabled
 */
-
-
 InCellEditingPlugin.prototype.enableTitleEditing = function (opt_enabled) {
   this._editableTitle = opt_enabled !== false;
 };
+
 /** Disable editing on all title sections
 * @public
 * @param {boolean=} opt_disabled
 */
-
-
 InCellEditingPlugin.prototype.disableTitleEditing = function (opt_disabled) {
   this._editableTitle = opt_disabled === false;
 };
+
 /** Disable editing on a per cell basis
 * @public
 * @param {Object} cell Grid cell object
 * @param {boolean=} opt_disabled
 */
-
-
 InCellEditingPlugin.prototype.disableCellEditing = function (cell, opt_disabled) {
   if (cell) {
     cell.enableClass("no-editing", opt_disabled !== false);
   }
 };
+
 /** @public
 * @param {boolean=} opt_disabled
 */
-
-
 InCellEditingPlugin.prototype.disableDataBinding = function (opt_disabled) {
   this._dataBinding = opt_disabled === false;
 };
+
 /** @public
 * @param {boolean=} opt_disabled
 */
-
-
 InCellEditingPlugin.prototype.disableDblClick = function (opt_disabled) {
   var dblClick = opt_disabled === false;
-
   if (this._dblClick !== dblClick) {
     this._dblClick = dblClick;
-
     for (var i = this._hosts.length; --i >= 0;) {
       this._listenForTriggering(this._hosts[i], dblClick);
     }
   }
 };
+
 /** Checking Editing is in process.
 * @public
 * @return {boolean}
 */
-
-
 InCellEditingPlugin.prototype.isEditing = function () {
   return this._editing;
 };
+
 /**
 * @public
 * @param {number=} columnIndex column index of editor, used in row editing mode
@@ -917,19 +841,14 @@ InCellEditingPlugin.prototype.isEditing = function () {
 * for row editing mode, specific column index and grid instance is need.
 * for cell editing mode. function not require param since only one editor can be opened at a time.
 */
-
-
 InCellEditingPlugin.prototype.getTextBox = function (columnIndex, grid) {
   if (this._activeRowId) {
     // for row editing mode
     // get rowEditor that's stored in column data
     grid = grid || this._hosts[0];
-
     if (grid) {
       var columnData = this._getColumnData(columnIndex, grid);
-
       var inCellCache = columnData["inCellCache"];
-
       if (inCellCache) {
         return inCellCache["inputElement"];
       }
@@ -938,17 +857,16 @@ InCellEditingPlugin.prototype.getTextBox = function (columnIndex, grid) {
     // for cell editing mode
     return this._activeInCellCache["inputElement"];
   }
-
   return null; // no editor open
 };
+
 /** @public
 * @return {string}
 */
-
-
 InCellEditingPlugin.prototype.getInitialText = function () {
   return this._initialText;
 };
+
 /** @private
 * @param {Object} dataSource DataView
 * @param {number} rowIndex
@@ -956,95 +874,78 @@ InCellEditingPlugin.prototype.getInitialText = function () {
 * @param {Element=} content element that get from cell.getContent
 * @return {*}
 */
-
-
 InCellEditingPlugin.prototype._getSourceContent = function (dataSource, rowIndex, field, content) {
   if (this._contentSource == "field") {
     return this._getData(dataSource, rowIndex, field);
   } else {
     var textNode, str;
-
     if (content) {
       var len = content.childNodes.length;
-
       for (var i = 0; i < len; ++i) {
         if (content.childNodes[i].nodeType === 3) {
           textNode = content.childNodes[i]; // To preserve current content structure
-
           break;
         }
       }
     }
-
     if (textNode) {
       str = textNode.textContent;
     } else if (content) {
       str = content.textContent;
     }
-
     return str;
   }
 };
+
 /**
 * @public
 * @param {string} rowId
 * @return {!number} row index will return -1 if not found
 */
-
-
 InCellEditingPlugin.prototype._getRowIndex = function (rowId) {
   if (rowId && this._lastActiveGrid) {
     var dv = this._lastActiveGrid.getDataSource();
-
     if (dv) return dv.getRowIndex(rowId);
   }
-
   return -1;
 };
+
 /**
 * @public
 * @param {number} rowIndex
 * @return {!string} return empty string if not found
 */
-
-
 InCellEditingPlugin.prototype._getRowId = function (rowIndex) {
   if (rowIndex != null && this._lastActiveGrid) {
     var dv = this._lastActiveGrid.getDataSource();
-
     if (dv) return dv.getRowId(rowIndex);
   }
-
   return "";
 };
+
 /** @public
 * @return {Object|null} core grid object
 */
-
-
 InCellEditingPlugin.prototype.getActiveGrid = function () {
   return this._activePos ? this._activePos["grid"] : null;
 };
+
 /** get active column index that editor had opended. Function can work only in cell editing mode.
 *  @public
 * @return {number} column index will return -1 if not found
 */
-
-
 InCellEditingPlugin.prototype.getActiveColIndex = function () {
   if (this._activePos) {
     var colIndex = this._activePos["colIndex"];
     if (colIndex != null) return colIndex;
   }
-
   return -1;
 };
+
 /** get active row index that editor had opended. Function Can work in both cell/row editing modes.
 * @public
 * @return {number} row index will return -1 if not found
 */
-
-
 InCellEditingPlugin.prototype.getActiveRowIndex = function () {
   if (this._activeRowId) {
     // row editing mode
@@ -1054,35 +955,30 @@ InCellEditingPlugin.prototype.getActiveRowIndex = function () {
     var rowIndex = this._activePos["rowIndex"];
     if (rowIndex != null) return rowIndex;
   }
-
   return -1;
 };
+
 /** @public
 * @return {Object}
 */
-
-
 InCellEditingPlugin.prototype.getInputElementPosition = function () {
   return this._activePos || null;
 };
+
 /** @public
 * @param {boolean=} opt_enable
 */
-
-
 InCellEditingPlugin.prototype.enableAutoCommitText = function (opt_enable) {
   this._autoCommitText = opt_enable !== false;
 };
+
 /** Check if the column can be edited by double click
 * @public
 * @param {number} colIndex
 * @return {boolean}
 */
-
-
 InCellEditingPlugin.prototype.isColumnEditable = function (colIndex) {
   var val = this._getColumnOption(colIndex, "editableContent");
-
   return val == null ? this._editableContent : val;
 };
 /** @private
@@ -1090,83 +986,68 @@ InCellEditingPlugin.prototype.isColumnEditable = function (colIndex) {
 * @param {Object=} opt_host core grid object
 * @fires InCellEditingPlugin#editorOpened
 */
-
-
 InCellEditingPlugin.prototype._onDoubleClick = function (e, opt_host) {
   var t = this;
   var host = opt_host || t.getRelativeGrid(e);
-
   if (t.isEditing() || !host) {
     return;
   }
-
   var arg = host.getRelativePosition(e);
   var sectionType = arg["sectionType"];
-
   if (sectionType === "content" && !t.isColumnEditable(arg["colIndex"])) {
     return;
   } else if (sectionType === "title" && !t._editableTitle) {
     return;
   } else if (sectionType === "header") {
     return;
-  } // Initialize internal states
-
+  }
 
+  // Initialize internal states
   if (e["preventDefault"]) {
     Dom.preventDefault(e);
   }
-
   t.openEditor(arg.colIndex, arg.rowIndex, arg.section, host);
 };
+
 /** @private
 * @param {Element} e
 * @param {Object} host core grid object
 * @param {Object=} arg
 */
-
-
 InCellEditingPlugin.prototype._openEditor = function (e, host, arg) {
   var t = this;
-
   if (!host.getElement() || this._hosts.indexOf(host) < 0) {
     // Check validity due to asyncronous call
     return;
   }
-
   if (!arg) {
     arg = host.getRelativePosition(e);
   }
-
   if (!arg["hit"]) {
     // The specified cell could be gone during the asyncronous process
     return;
   }
-
   t._dispatch("preEditorOpening", arg);
-
   if (arg["cancel"]) {
     return;
   }
-
   var colIndex = arg["colIndex"];
   var rowIndex = arg["rowIndex"];
   var section = arg["section"];
   var cell = section.getCell(colIndex, rowIndex);
   var rowSpan = 1;
   var stretchedCell = section.getStretchedCell(cell, rowIndex);
-
   if (stretchedCell) {
     cell = stretchedCell;
   } else {
     rowSpan = section.getCellRowSpan(colIndex, rowIndex);
   }
-
   if (!cell || cell.hasClass("no-editing")) {
     return;
-  } // Everything has been verified at this point. We can start the opening process.
-  // close row editor first
-
+  }
+  // Everything has been verified at this point. We can start the opening process.
 
+  // close row editor first
   t.closeRowEditor(false, host);
   section.addClass("edit-mode");
   t._lastActiveGrid = host;
@@ -1175,116 +1056,92 @@ InCellEditingPlugin.prototype._openEditor = function (e, host, arg) {
   arg["content"] = t._prevContent = cell.getContent();
   arg["field"] = t._getField(colIndex);
   var dataSource = arg["dataSource"];
-
   if (dataSource != null) {
     var rowId = arg["rowId"] = this._getRowId(arg["rowIndex"]);
-
     arg["groupHeader"] = dataSource.isSegmentSeparator(rowId) || dataSource.getGroupByRowId(rowId);
     arg["rowData"] = this._getRow(dataSource, rowId);
-  } // Initialize UIs
-
+  }
 
+  // Initialize UIs
   if (arg["sectionType"] === "title") {
     t._activeInCellCache = t._createTitleEditor(host);
   } else {
     t._activeInCellCache = t._createContentEditor(colIndex, host);
   }
-
   var inputElement = arg["inputElement"] = t._activeInCellCache["inputElement"];
   var editor = arg["editor"] = t._activeInCellCache["editor"];
   var balloonPopup = t._activeInCellCache["balloonPopup"];
   var sourceContent = arg ? t._getSourceContent(arg["dataSource"], arg["rowIndex"], arg["field"], arg["content"]) : "";
-
   if (rowIndex + 1 >= section.getRowCount()) {
     inputElement.classList.add("bottom");
   } else {
     inputElement.classList.remove("bottom");
-  } // Initialize Balloon
-
+  }
 
+  // Initialize Balloon
   t._usingBalloon = t._isBalloonMode(cell);
-
   if (t._usingBalloon) {
     editor.classList.add("balloon");
   } else {
     editor.classList.remove("balloon");
   }
-
   var editorStyle = editor.style;
-
   if (this._elfVersion || t._inlineStyling) {
     editorStyle.backgroundColor = section.getComputedStyle().backgroundColor;
   }
-
   var rowH = section.getRowHeight(rowIndex);
   var width = cell.getWidth();
-
   if (!host.isPinnedColumn(colIndex)) {
     var hScrollbar = host.getHScrollbar();
-
     if (hScrollbar.isActive()) {
       var paneSize = hScrollbar.getPaneSize();
-
       if (width > paneSize) {
         width = paneSize;
       }
     }
   }
-
   if (!t._usingBalloon || width > 208) {
     editorStyle.width = width + "px";
   } else {
     editorStyle.width = "";
   }
-
   if (rowSpan > 1) {
     editorStyle.height = cell.getHeight() + "px";
   } else {
     editorStyle.height = rowH + "px";
-  } // Attach our popup (balloon element)
-
+  }
 
+  // Attach our popup (balloon element)
   var parentElement = document.body;
-
   if (t._compositeGrid || t._realTimeGrid) {
     var activeGrid = t.getActiveGrid();
-
     if (activeGrid) {
       parentElement = activeGrid.getElement().parentElement;
     }
   }
-
   balloonPopup.enableUIBlocking(t._uiBlocking);
   balloonPopup.addEventListener("hidden", t._onPopupHide);
   balloonPopup.disableAutoHiding(false);
   balloonPopup.disableHideOnScroll(true);
   balloonPopup.attachTo(cell.getElement());
   balloonPopup.show(true, parentElement);
+  this._updateEditorPopup(t._activeInCellCache, cell, host);
 
-  this._updateEditorPopup(t._activeInCellCache, cell, host); // Attach user element
-
-
+  // Attach user element
   if (t._customElement) {
     t._customElementPopup.attachTo(editor);
-
     t._customElementPopup.show(true, parentElement);
-
     t._customElementPopup.disableAutoHiding(false);
-
     arg["popupElement"] = t._customElement;
-  } // WARNING: value-changed event from ELF v3 component may NOT be triggered due to their design flaw
-
+  }
 
+  // WARNING: value-changed event from ELF v3 component may NOT be triggered due to their design flaw
   t._setText(sourceContent, inputElement);
-
   arg["initialText"] = t._initialText = sourceContent;
-
   if (t._disablingScroll) {
     t._freezeScrolling(host, true);
   }
-
   arg["autoSuggest"] = t._autoSuggest;
-
   if (t._autoSuggest) {
     if (t._autoSuggest.attach === inputElement) {
       t._autoSuggest.attach = null; // WORKAROUND: reset attach for re-attach target
@@ -1294,87 +1151,73 @@ InCellEditingPlugin.prototype._openEditor = function (e, host, arg) {
       // if we appendChild all time when open editor, events won't work
       editor.appendChild(t._autoSuggest);
     }
-
     t._autoSuggest.attach = inputElement;
     t._autoSuggest.positionTarget = inputElement; // for re-position of autosuggest
-  } // Dispatch an event for user to setup stuff
-
+  }
 
+  // Dispatch an event for user to setup stuff
   t._dispatch("editorOpened", arg); // User may modify the editor
 
-
   inputElement.focus();
-
   if (typeof inputElement.select === "function") {
     inputElement.select();
   }
-
   arg["initialText"] = t._initialText = t.getText(); // After all modifications, cache the string for text change event
-
   t._editing = true; // Editing state cannot be false until a text has been committed or cancelled
 };
+
 /** Using to open row editor.
 * @public
 * @param {number} rowIndex
 * @param {Object=} grid core grid object
 */
-
-
 InCellEditingPlugin.prototype.openRowEditor = function (rowIndex, grid) {
   var t = this;
-  grid = grid || t._hosts[0]; // if open same row we will do nothing
-
+  grid = grid || t._hosts[0];
+  // if open same row we will do nothing
   if (t._getRowIndex(t._activeRowId) === rowIndex || !grid) {
     return;
-  } // close all open editor
-
+  }
 
+  // close all open editor
   t.closeRowEditor(false, grid);
-
   t._commitText(false);
-
   var firstInput, firstPopup;
   var section = grid.getSection("content");
   var dataSource = grid.getDataSource();
   var lastIndex = (section.getColumnCount() || 0) - 1;
   var isBottom = rowIndex + 1 >= section.getRowCount();
   var sectionBGColor = this._elfVersion || t._inlineStyling ? section.getComputedStyle().backgroundColor : null;
-  var rowH = section.getRowHeight(rowIndex); // if normally parent popup will be document.body
+  var rowH = section.getRowHeight(rowIndex);
 
-  var parentElement = document.body; // but if grid is _compositeGrid or _realTimeGrid then
-  // then we will use grid parent instead
+  // if normally parent popup will be document.body
+  var parentElement = document.body;
 
+  // but if grid is _compositeGrid or _realTimeGrid then
+  // then we will use grid parent instead
   if (t._compositeGrid || t._realTimeGrid) {
     parentElement = grid.getElement().parentElement;
-  } // loop for all column
-
+  }
 
+  // loop for all column
   for (var columnIndex = 0; columnIndex <= lastIndex; columnIndex++) {
     // ignore column that can't edit
     if (!t.isColumnEditable(columnIndex)) {
       continue;
     }
-
     var cell = section.getCell(columnIndex, rowIndex);
-
     if (!cell || cell.hasClass("no-editing")) {
       continue;
     } // all verify is done
-    // create editor, popup, inputElement
-
 
+    // create editor, popup, inputElement
     var inCellCache = t._createContentEditor(columnIndex, grid);
-
     var content = cell.getContent();
-
     var field = t._getField(columnIndex);
-
     var sourceContent = t._getSourceContent(dataSource, rowIndex, field, content);
-
     var inputElement = inCellCache["inputElement"];
     var editor = inCellCache["editor"];
     var balloonPopup = inCellCache["balloonPopup"];
-
     if (!firstInput) {
       firstInput = inputElement;
       firstPopup = balloonPopup;
@@ -1382,25 +1225,21 @@ InCellEditingPlugin.prototype.openRowEditor = function (rowIndex, grid) {
     } else {
       balloonPopup.enableUIBlocking(false);
     }
-
     t._setText(sourceContent, inputElement); // WARNING: value-changed event from ELF v3 component may be triggered due to their design flaw
 
-
     if (isBottom) {
       inputElement.classList.add("bottom");
     } else {
       inputElement.classList.remove("bottom");
     }
-
     var editorStyle = editor.style;
-
     if (sectionBGColor) {
       editorStyle.backgroundColor = sectionBGColor;
     }
+    editorStyle.height = rowH + "px";
 
-    editorStyle.height = rowH + "px"; // this is different from single edit mode
+    // this is different from single edit mode
     // row edit mode not support balloon mode
-
     var width = section.getCellWidth(columnIndex, rowIndex);
     editorStyle.width = width + "px";
     editor.classList.remove("balloon");
@@ -1408,46 +1247,40 @@ InCellEditingPlugin.prototype.openRowEditor = function (rowIndex, grid) {
     balloonPopup.disableHideOnScroll(true);
     balloonPopup.attachTo(cell.getElement());
     balloonPopup.show(true, parentElement);
+    this._updateEditorPopup(inCellCache, cell, grid);
 
-    this._updateEditorPopup(inCellCache, cell, grid); // this._updateEditorLayout(inputElement); // Adjust sizes after append to the DOM
-
-  } // if firstInput not undefined that mean at lease one popup is open
-
+    // this._updateEditorLayout(inputElement); // Adjust sizes after append to the DOM
+  }
 
+  // if firstInput not undefined that mean at lease one popup is open
   if (firstInput) {
     firstPopup.addEventListener("hidden", t._onPopupHide);
     t._lastActiveGrid = grid;
     t._editing = true; // Editing state cannot be false until a text has been committed or cancelled
-
     t._activeRowId = this._getRowId(rowIndex);
     firstInput.focus();
     section.addClass("edit-mode");
-
     if (t._disablingScroll) {
       t._freezeScrolling(grid, true);
     }
   }
 };
+
 /** Using to close row editor.
 * @public
 * @param {boolean=} isCommit=true Default is true, to save change that user made to datasource
 * @fires InCellEditingPlugin#beforeRowCommit
 * @fires InCellEditingPlugin#rowEditorClosed
 */
-
-
 InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
   var t = this;
-  var grid = t._lastActiveGrid; // if no row active then do nothing
-
+  var grid = t._lastActiveGrid;
+  // if no row active then do nothing
   if (!t._activeRowId || !grid) {
     return;
   }
-
   var rowId = t._activeRowId;
-
   var rowIndex = t._getRowIndex(rowId);
-
   if (rowIndex <= -1) {
     isCommit = false; // rowIndex -1 mean row is not found or already disposed
   } else {
@@ -1458,31 +1291,29 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
   var columnLength = grid.getColumnCount();
   var fieldValue = {};
   var inCellCaches = [];
-  var inCellCache; // in this section we just prepare data
+  var inCellCache;
 
+  // in this section we just prepare data
   for (var columnIndex = 0; columnIndex < columnLength; columnIndex++) {
     var columnData = t._getColumnData(columnIndex, grid);
+    inCellCache = columnData && columnData["inCellCache"];
 
-    inCellCache = columnData && columnData["inCellCache"]; // if not have inCellCache then this column not have editor
-
+    // if not have inCellCache then this column not have editor
     if (!inCellCache) {
       continue;
     }
-
     inCellCache.columnIndex = columnIndex;
     inCellCaches.push(inCellCache);
-
     if (isCommit) {
       var field = t._getField(columnIndex);
-
       inCellCache.field = field;
       fieldValue[field] = this._getValue(inCellCache["inputElement"]);
     }
   }
-
   var length = inCellCaches.length;
-  var i, e; // dispatch event beforeRowCommit
+  var i, e;
 
+  // dispatch event beforeRowCommit
   if (isCommit) {
     if (t.hasListener("beforeRowCommit")) {
       e = {
@@ -1492,37 +1323,31 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
         cancel: false,
         rowId: t._activeRowId
       };
-
-      t._dispatch("beforeRowCommit", e); // e.cancel = true mean user want to cancel closeRowEditor operation
-
-
+      t._dispatch("beforeRowCommit", e);
+      // e.cancel = true mean user want to cancel closeRowEditor operation
       isCommit = !e.cancel;
     }
-
     if (isCommit) {
       var dataSource = grid.getDataSource();
-
       for (i = 0; i < length; i++) {
         inCellCache = inCellCaches[i];
-        var value = fieldValue[inCellCache.field]; // set data to datasource
-
+        var value = fieldValue[inCellCache.field];
+        // set data to datasource
         if (dataSource) {
           // only use value from fieldValue
           // because fieldValue maybe mutate from beforeRowCommit event
           t._setData(dataSource, rowIndex, inCellCache.field, value);
-        } // set value to ui if content is a build in text
-
+        }
 
+        // set value to ui if content is a build in text
         var cell = section.getCell(inCellCache.columnIndex, rowIndex);
         var content = cell.getContent();
-
         if (content && content.classList.contains("text")) {
           cell.setContent(value);
         }
       }
     }
   }
-
   if (t.hasListener("rowEditorClosed")) {
     e = {
       grid: grid,
@@ -1530,27 +1355,25 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
       fieldValue: fieldValue,
       committed: isCommit
     };
-
     t._dispatch("rowEditorClosed", e);
-  } // hide editor by remove popup from dom
-
+  }
 
+  // hide editor by remove popup from dom
   for (i = 0; i < length; i++) {
     var popup = inCellCaches[i].balloonPopup;
     popup.removeEventListener("hidden", t._onPopupHide); // remove event every popup to make sure nothing left
-
     popup.hide();
   }
+  t._freezeScrolling(grid, false);
 
-  t._freezeScrolling(grid, false); // reset status and resource
-
-
+  // reset status and resource
   section.removeClass("edit-mode");
   t._editing = false;
   t._activeRowId = "";
   t._lastActiveGrid = null;
   grid.focus();
 };
+
 /** open row editor if no any row editor opened, and close row editor if it already opened
 * @public
 * @param {number} rowIndex
@@ -1559,8 +1382,6 @@ InCellEditingPlugin.prototype.closeRowEditor = function (isCommit) {
 * @fires InCellEditingPlugin#beforeRowCommit
 * @fires InCellEditingPlugin#rowEditorClosed
 */
-
-
 InCellEditingPlugin.prototype.toggleRowEditor = function (rowIndex, isCommit, grid) {
   if (this._getRowIndex(this._activeRowId) === rowIndex) {
     this.closeRowEditor(isCommit, grid);
@@ -1571,165 +1392,135 @@ InCellEditingPlugin.prototype.toggleRowEditor = function (rowIndex, isCommit, gr
     this.openRowEditor(rowIndex, grid);
   }
 };
+
 /** handle grid scrolling not window scroll
 * @private
 * @param {Object} e
 */
-
-
 InCellEditingPlugin.prototype._onScroll = function (e) {
   this._scrolling = true;
-
   if (!this._closingOnScroll && this._editing) {
     if (this._activeInCellCache) {
       var popup = this._activeInCellCache.balloonPopup;
       popup.hide();
     } else if (this._activeRowId) {
       var grid = this.getActiveGrid() || this._lastActiveGrid;
-
       var section = grid.getSection("content");
       var lastIndex = (section.getColumnCount() || 0) - 1;
-
       for (var columnIndex = 0; columnIndex <= lastIndex; columnIndex++) {
         var columnData = this._getColumnData(columnIndex, grid);
-
         var inCellCache = columnData["inCellCache"];
-
         if (!inCellCache) {
           continue;
         }
-
         var popupCache = inCellCache["balloonPopup"];
-
         if (popupCache) {
           popupCache.hide();
         }
       }
     }
   }
-
   this._onPopupHide();
-
   this._scrolling = false;
 };
+
 /** handle popup hidden event
 * @private
 * @param {Object} e
 */
-
-
 InCellEditingPlugin.prototype._onPopupHide = function (e) {
   if (!this._closingOnScroll) {
     if (this._scrolling) {
       this.requestShowEditorPopup();
       return;
     }
-  } // in cell editing mode, when popup hide for any reason
+  }
+  // in cell editing mode, when popup hide for any reason
   // cell editing will be close and make a commit. (depend on _autoCommitText flag)
   // WARNING: when user scroll outside grid. it will call _onPopupHide as well
+  this._commitText(this._autoCommitText);
 
-
-  this._commitText(this._autoCommitText); // for row editing mode if editor hide by any reason
+  // for row editing mode if editor hide by any reason
   // we will call close closeRowEditor to reset all internal flag status
   // row editing mode not care about _autoCommitText. (for the time being)
-
-
   this.closeRowEditor(false);
 };
+
 /** @private
 * @param {Object} event
 */
-
-
 InCellEditingPlugin.prototype._onAutoSuggestItemSelected = function (event) {
   if (event.detail.target) {
     var method = event.detail.method;
     var value = event.detail.target.value;
-
     if (method === 'enter' || method === 'click') {
       if (value) {
         this.setText(value);
-
         this._commitText(true);
       }
     }
   }
 };
+
 /** @private
 * @param {Object} e
 */
-
-
 InCellEditingPlugin.prototype._onValueChanged = function (e) {
   if (this._activeRowId) {
     return;
   } // do nothing in rowEditMode
 
-
   this._commitText(true);
 };
+
 /** @private
 * @param {Object} e
 */
-
-
 InCellEditingPlugin.prototype._onTextKeyDown = function (e) {
   e.stopPropagation();
-
   if (this._activeRowId) {
     return;
   } // do nothing in rowEditMode
-  // KeyCodes.ESC = 27
-
 
+  // KeyCodes.ESC = 27
   if (e.keyCode === 27) {
     this._commitText(this._autoCommitText);
-  } // KeyCodes.TAB = 9
-
-
+  }
+  // KeyCodes.TAB = 9
   if (e.keyCode === 9) {
     // For check press tab key when user tab on auto suggest list
     // When user tab on auto suggest, the focus should be in input and data doesn't commit
     if (this._autoSuggest && this._autoSuggest.suggestions.length > 0) {
       this._activeInCellCache.inputElement.focus();
     }
-
     e.preventDefault(); // stop losing focus
   }
 };
+
 /** @private
 * @param {Object} e
 */
-
-
 InCellEditingPlugin.prototype._onTextKeyUp = function (e) {
   e.stopPropagation();
-
   if (this._activeRowId) {
     return;
   } // do nothing in rowEditMode
 
-
   if (this.hasListener("keyUp")) {
     this._activePos["text"] = this._activePos["enteredText"] = this._activeInCellCache["inputElement"].value;
-
     this._dispatch("keyUp", this._activePos);
-  } // KeyCodes.ENTER = 13 && KeyCodes.TAB = 9
-
+  }
 
+  // KeyCodes.ENTER = 13 && KeyCodes.TAB = 9
   var tabKey = e.keyCode === 9;
-
   if (tabKey || e.keyCode === 13) {
     var text = this.getText();
     var cellInfo = this._activePos;
-
     if (this._initialText !== text) {
       e.preventDefault(); // TODO: Check if this is needed
       // Clear auto suggest and doesn't commit when user tab on auto suggest item
-
       if (this._autoSuggest && this._autoSuggest.suggestions.length > 0) {
         this._activeInCellCache.inputElement.focus();
-
         this._autoSuggest.suggestions = [];
         return; // when use tabToMove with auto suggest, it shouldn't be effect when doesn't commit text
       } else {
@@ -1738,16 +1529,12 @@ InCellEditingPlugin.prototype._onTextKeyUp = function (e) {
     } else {
       this._commitText(false);
     }
-
     if (tabKey && this._tabToMove && !e.altKey && !e.ctrlKey) {
       var host = cellInfo ? cellInfo["grid"] : null;
-
       if (host && host["getCellInfo"]) {
         var dv = host.getDataSource();
-
         while (cellInfo) {
           cellInfo = e.shiftKey ? host.getPrevCell(cellInfo) : host.getNextCell(cellInfo);
-
           if (cellInfo && cellInfo["cell"]) {
             if (dv.getRowDataAt(cellInfo["rowIndex"])) {
               // Check group header row
@@ -1768,48 +1555,39 @@ InCellEditingPlugin.prototype._onTextKeyUp = function (e) {
 * @private
 * @param {boolean} committed
 */
-
-
 InCellEditingPlugin.prototype._commitText = function (committed) {
   var t = this;
   var arg = t._activePos;
-
   if (!t.isEditing() || !arg) {
     return;
   }
-
   arg["section"].removeClass("edit-mode");
   t._editing = false;
   var enteredValue = arg["text"] = this.getValue();
   var groupHeader = arg["groupHeader"] || false;
-
   if (committed) {
     if (t.hasListener("beforeCommit")) {
       t._dispatch("beforeCommit", arg);
-
       committed = !arg["cancel"];
       enteredValue = arg["text"];
     }
-
     if (committed && t._dataBinding && !groupHeader) {
       var sectionSettings = arg["sectionSettings"];
-      var sectionType = sectionSettings.getType(); // case edit content
-
+      var sectionType = sectionSettings.getType();
+      // case edit content
       if ("content" === sectionType) {
         var dv = sectionSettings.getDataSource();
-
         if (dv) {
           t._setData(dv, arg["rowIndex"], arg["field"], enteredValue);
-
           if (t._prevContent && t._prevContent.classList.contains("text")) {
             // Bind data only if previous content is a build in text
             t._activeCell.setContent(enteredValue);
           }
         }
-      } // case edit title
+      }
+      // case edit title
       else if ("title" === sectionType) {
         var _grid = this._compositeGrid || this._realTimeGrid || null;
-
         if (_grid) {
           _grid.setColumnName(arg["colIndex"], enteredValue);
         }
@@ -1818,57 +1596,48 @@ InCellEditingPlugin.prototype._commitText = function (committed) {
       }
     }
   }
-
   if (t.hasListener("editorClosed")) {
     arg["canceled"] = arg["cancelled"] = !committed;
     arg["committed"] = committed;
-
     t._dispatch("editorClosed", arg);
   }
-
   if (t._activeInCellCache && t._activeInCellCache.balloonPopup) {
     t._activeInCellCache.balloonPopup.removeEventListener("hidden", t._onPopupHide);
-
     t._activeInCellCache.balloonPopup.hide();
   }
-
   Dom.removeParent(t._customElement);
-
   t._freezeScrolling(arg["grid"], false);
-
   arg["grid"].focus();
   t._activePos = t._activeCell = t._prevContent = t._lastActiveGrid = t._activeInCellCache = null;
 };
+
 /** @private
 * @param {Event} e
 */
-
-
 InCellEditingPlugin.prototype._stopPropagation = function (e) {
   e.stopPropagation();
 };
+
 /** Using for Check balloon mode is turn on/off.
 * @private
 * @param {Object} cell Grid cell object
 * @return {boolean}
 */
-
-
 InCellEditingPlugin.prototype._isBalloonMode = function (cell) {
   var cellElem = cell.getElement();
   var compStyles = cellElem ? window.getComputedStyle(cellElem) : {};
   return this._balloonMode || compStyles.display === "none" || compStyles.visibility === "hidden";
 };
+
 /** @private
 * @param {Object} host core grid object
 * @param {boolean} bool
 */
-
-
 InCellEditingPlugin.prototype._listenForTriggering = function (host, bool) {
   if (bool) {
-    host.listen("dblclick", this._onDoubleClick); // Make a comparable functionality for touchscreen
+    host.listen("dblclick", this._onDoubleClick);
 
+    // Make a comparable functionality for touchscreen
     if (isTouchDevice()) {
       host.listen("touchstart", this._onTouchStart);
       host.listen("touchend", this._onTouchEnd);
@@ -1881,102 +1650,85 @@ InCellEditingPlugin.prototype._listenForTriggering = function (host, bool) {
     host.unlisten("touchcancel", this._onTouchEnd);
   }
 };
+
 /** Use only On-Touch-Start event on mobile devices.
 * @private
 * @param {Object} e
 */
-
-
 InCellEditingPlugin.prototype._onTouchStart = function (e) {
   this._resetTouchTimer();
-
   this._touchTimerId = setTimeout(this._onTouchTimer, this._longPressTime);
 };
+
 /** Use only press time on mobile devices.
 * @private
 * @param {Object} e
 */
-
-
 InCellEditingPlugin.prototype._onTouchTimer = function (e) {
   this._touchTimerId = 0;
 };
+
 /** Use only On-Touch-End event on mobile devices.
 * @private
 * @param {Event} e
 */
-
-
 InCellEditingPlugin.prototype._onTouchEnd = function (e) {
   if (!this._resetTouchTimer()) {
     this._onDoubleClick(e); // Trigger cell editor
-
   }
 };
+
 /** Use only to reset timer on mobile devices.
 * @private
 * @return {boolean}
 */
-
-
 InCellEditingPlugin.prototype._resetTouchTimer = function () {
   if (this._touchTimerId) {
     clearTimeout(this._touchTimerId);
     this._touchTimerId = 0;
     return true;
   }
-
   return false;
 };
+
 /** Set other elements to using like popup when editing cell.
 * @public
 * @param {Element} elm
 */
-
-
 InCellEditingPlugin.prototype.setPopupElement = function (elm) {
   var balloonPopup = this._activeInCellCache && this._activeInCellCache["balloonPopup"];
-
   if (this._customElement) {
     balloonPopup && balloonPopup.removeFocusElement(this._customElement);
-
     this._customElementPopup.dispose();
-
     this._customElementPopup = null;
   }
-
   this._customElement = elm;
-
   if (this._customElement) {
     this._customElementPopup = new Popup(this._customElement);
     balloonPopup && balloonPopup.addFocusElement(this._customElement);
   }
 };
+
 /** Set content to the editor but do not commit anything to internal storage.
 * @public
 * @param {*} content
 */
-
-
 InCellEditingPlugin.prototype.setText = function (content) {
   // TODO: since we have inputElement per each column
   // we should receive column index to set value in specific column
   this._activeInCellCache && this._setText(content, this._activeInCellCache["inputElement"]);
 };
+
 /** @private
 * @param {*} content
 * @param {Element} inputElement editor element
 */
-
-
 InCellEditingPlugin.prototype._setText = function (content, inputElement) {
   inputElement._origValue = content;
   var inputTag = inputElement.tagName.toLowerCase();
   var typeMap = InCellEditingPlugin._uiElementTypesMap;
-
   if (inputTag === typeMap.checkbox) {
     var checked = content ? !(content === "f" || content === "false") : false;
-
     if (checked) {
       inputElement.setAttribute("checked", "true");
     } else {
@@ -1996,7 +1748,6 @@ InCellEditingPlugin.prototype._setText = function (content, inputElement) {
     ElfDate.setDate(inputElement, content);
   } else {
     var txt = "";
-
     if (content != null) {
       if (typeof content === "string") {
         txt = content;
@@ -2005,32 +1756,28 @@ InCellEditingPlugin.prototype._setText = function (content, inputElement) {
         txt = content + "";
       }
     }
-
     inputElement.value = txt;
   }
 };
+
 /** Get current text from the editor
 * @public
 * @return {string}
 * @see {@link InCellEditingPlugin#getValue}
 */
-
-
 InCellEditingPlugin.prototype.getText = function () {
   // TODO: since we have inputElement per each column
   // we should receive column index to return text of inputElement in specific column
   if (this._activeInCellCache) return this._getText(this._activeInCellCache["inputElement"]);else return "";
 };
+
 /** @private
 * @param {Element} inputElement editor element
 * @return {string}
 */
-
-
 InCellEditingPlugin.prototype._getText = function (inputElement) {
   var inputTag = inputElement.tagName.toLowerCase();
   var typeMap = InCellEditingPlugin._uiElementTypesMap;
-
   if (inputTag === typeMap.checkbox) {
     return inputElement.checked + "";
   } else if (inputTag === typeMap.combobox) {
@@ -2040,31 +1787,27 @@ InCellEditingPlugin.prototype._getText = function (inputElement) {
   } else if (inputTag === typeMap.date) {
     return inputElement.value + "";
   }
-
   return inputElement.value;
 };
+
 /** Convert current text from the editor to value corresponding to the type of the editor
 * @public
 * @return {*} Returned type is based on the type of the editor
 * @see {@link InCellEditingPlugin#getText}
 */
-
-
 InCellEditingPlugin.prototype.getValue = function () {
   // TODO: since we have inputElement per each column
   // we should receive column index to return value of inputElement in specific column
   return this._activeInCellCache ? this._getValue(this._activeInCellCache["inputElement"]) : null;
 };
+
 /** @private
 * @param {Element} inputElement editor element
 * @return {*} Returned type is based on the type of the editor
 */
-
-
 InCellEditingPlugin.prototype._getValue = function (inputElement) {
   var inputTag = inputElement.tagName.toLowerCase();
   var typeMap = InCellEditingPlugin._uiElementTypesMap;
-
   if (inputTag === typeMap.checkbox) {
     return inputElement.checked ? true : false;
   } else if (inputTag === typeMap.date) {
@@ -2073,23 +1816,20 @@ InCellEditingPlugin.prototype._getValue = function (inputElement) {
   ) {
     return +inputElement.value;
   }
-
   return this._getText(inputElement);
 };
+
 /** Use to clear text in text editor.
 * @public
 */
-
-
 InCellEditingPlugin.prototype.clearText = function () {
   this.setText("");
 };
+
 /** Use to append text in text editor. WARNING: Only works with the text type editor
 * @public
 * @param {string} word
 */
-
-
 InCellEditingPlugin.prototype.appendText = function (word) {
   // TODO: since we have inputElement per each column
   // we should receive column index to return append text in specific column
@@ -2097,58 +1837,52 @@ InCellEditingPlugin.prototype.appendText = function (word) {
     this._activeInCellCache["inputElement"].value += word;
   }
 };
+
 /** Commit text will set text and commit to cell.
 * @public
 * @param {string=} word
 */
-
-
 InCellEditingPlugin.prototype.commitText = function (word) {
   if (word) {
     this.setText(word);
   }
-
   this._commitText(true);
 };
+
 /** Get Balloon Popup Element to access any API provided.
 * @public
 * @return {Popup|null}
 */
-
-
 InCellEditingPlugin.prototype.getBalloonPopup = function () {
   // TODO: since we have balloonPopup per each column
   // we should receive column index to return balloonPopup in specific column
   return this._activeInCellCache ? this._activeInCellCache["balloonPopup"] : null;
 };
+
 /** Get ef-autosuggest or atlas-autosuggest
 * @public
 * @return {Element}
 */
-
-
 InCellEditingPlugin.prototype.getAutoSuggest = function () {
   return this._autoSuggest;
 };
+
 /**
 * @public
 * @param {boolean=} disabled
 * @return {boolean} previous disablingScroll status
 */
-
-
 InCellEditingPlugin.prototype.setDisablingScroll = function (disabled) {
   var prev = disabled;
   this._disablingScroll = disabled;
   return prev;
 };
+
 /** stop scrolling to move to prevent editor close
 * @private
 * @param {Object} grid grid instance
 * @param {boolean=} frozen
 */
-
-
 InCellEditingPlugin.prototype._freezeScrolling = function (grid, frozen) {
   if (!grid) return;
   var vs = grid.getVScrollbar();
@@ -2156,76 +1890,58 @@ InCellEditingPlugin.prototype._freezeScrolling = function (grid, frozen) {
   vs && vs.freezeScrolling(frozen);
   hs && hs.freezeScrolling(frozen);
 };
+
 /** Set a timer to call onUpdateEditorPopup only once to avoid performance issue
 * @public
 */
-
-
 InCellEditingPlugin.prototype.requestShowEditorPopup = function () {
   if (!this._editorTimerId) {
     this._editorTimerId = setTimeout(this._onUpdateEditorPopup.bind(this), 100);
   }
 };
-/** @private */
-
 
+/** @private */
 InCellEditingPlugin.prototype._onUpdateEditorPopup = function () {
   this._editorTimerId = 0;
-
   var grid = this.getActiveGrid() || this._lastActiveGrid;
-
   if (!grid) {
     return;
   }
-
   var parentElement = document.body;
-
   if (this._compositeGrid || this._realTimeGrid) {
     parentElement = grid.getElement().parentElement;
   }
-
   if (this._activeInCellCache) {
     var activePos = this._activePos;
-
     if (activePos) {
       var section = grid.getSection(activePos["sectionType"]);
       var cell = section.getCell(activePos["colIndex"], activePos["rowIndex"]);
-
       if (cell) {
         var popup = this._activeInCellCache["balloonPopup"];
         popup.attachTo(cell.getElement());
         popup.show(true, parentElement);
-
         this._updateEditorPopup(this._activeInCellCache, cell, grid);
       }
     }
   } else if (this._activeRowId) {
     var sectionContent = grid.getSection("content");
-
     var rowIndex = this._getRowIndex(this._activeRowId);
-
     if (sectionContent.isRowVisible(rowIndex)) {
       var lastIndex = (sectionContent.getColumnCount() || 0) - 1;
-
       for (var columnIndex = 0; columnIndex <= lastIndex; columnIndex++) {
         var columnData = this._getColumnData(columnIndex, grid);
-
         var inCellCache = columnData["inCellCache"];
         var cellContent = sectionContent.getCell(columnIndex, rowIndex);
-
         if (!inCellCache || !cellContent) {
           continue;
         }
-
         var popupCache = inCellCache["balloonPopup"];
         popupCache.attachTo(cellContent.getElement());
         popupCache.show(true, parentElement);
-
         this._updateEditorPopup(inCellCache, cellContent, grid);
       }
     }
   }
-
   grid.focus();
 };
 /** Update editor popup position and styles
@@ -2234,8 +1950,6 @@ InCellEditingPlugin.prototype._onUpdateEditorPopup = function () {
 * @param {Object} cell
 * @param {Object} grid grid instance
 */
-
-
 InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell, grid) {
   var popup = contentEditor["balloonPopup"];
   var editor = contentEditor["editor"];
@@ -2254,10 +1968,8 @@ InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell
   var displayStyle = "inline-block";
   var marginLeft = 0;
   var marginTop = 0;
-
   if (colRect.leftPinnedIndex != -1) {
     var diff = 0;
-
     if (grid.getVScrollbar().isActive()) {
       diff -= 8; // If column is left pinned, scrollbar width need to be subtracted
     }
@@ -2266,7 +1978,6 @@ InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell
     offsetWidth += diff;
     offsetLeft += diff;
   }
-
   if (editor.classList.contains("balloon") && !this._activeRowId) {
     popupElem.style.display = "";
     editor.style.width = "";
@@ -2276,45 +1987,39 @@ InCellEditingPlugin.prototype._updateEditorPopup = function (contentEditor, cell
     marginTop = -4;
     newWidth = popup.getElement().offsetWidth;
   }
-
   if (!pos["hit"]) {
     displayStyle = "none";
   } else {
     var acquiredWidth = pos["x"] + newWidth;
-    var acquiredHeight = pos["y"] - offsetTop + newHeight; // Left overflow
+    var acquiredHeight = pos["y"] - offsetTop + newHeight;
 
+    // Left overflow
     if (pos["x"] < offsetLeft) {
       newWidth = newWidth - (offsetLeft - pos["x"]);
       marginLeft = marginLeft + Math.abs(pos["x"] - offsetLeft);
-    } // Right overflow
-
-
+    }
+    // Right overflow
     if (acquiredWidth > offsetWidth) {
       newWidth = newWidth - (acquiredWidth - offsetWidth);
-    } // Top overflow
-
-
+    }
+    // Top overflow
     if (pos["y"] < offsetTop) {
       newHeight = newHeight + pos["y"] - offsetTop;
       marginTop = marginTop + Math.abs(pos["y"] - offsetTop);
-    } // Bottom overflow
-
-
+    }
+    // Bottom overflow
     if (acquiredHeight > offsetHeight) {
       newHeight = newHeight - (acquiredHeight - offsetHeight);
     }
-
     if (newWidth < 48 && newWidth != width || newHeight < 16 && newHeight != height) {
       displayStyle = "none";
     }
   }
-
   popupElem.style.display = displayStyle;
   editor.style.width = newWidth ? newWidth + "px" : "";
   editor.style.height = newHeight ? newHeight + "px" : "";
   editor.style.marginLeft = marginLeft ? marginLeft + "px" : 0;
   editor.style.marginTop = marginTop ? marginTop + "px" : 0;
 };
-
 export default InCellEditingPlugin;
 export { InCellEditingPlugin, InCellEditingPlugin as InCellEditing, InCellEditingPlugin as InCellEditingExtension };