@syncfusion/ej2-grids 18.3.48 → 18.3.50-85492

package/dist/es6/ej2-grids.es5.js

@@ -1,4 +1,4 @@
-import { Browser, ChildProperty, Collection, Complex, Component, Draggable, Droppable, Event, EventHandler, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Observer, Property, addClass, append, attributes, blazorTemplates, classList, closest, compile, createElement, debounce, detach, extend, formatUnit, getEnumValue, getValue, isBlazor, isNullOrUndefined, isObject, isUndefined, matches, merge, print, remove, removeClass, resetBlazorTemplate, setCulture, setStyleAttribute, setValue, updateBlazorTemplate } from '@syncfusion/ej2-base';
+import { Browser, ChildProperty, Collection, Complex, Component, Draggable, Droppable, Event, EventHandler, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Observer, Property, addClass, append, attributes, blazorTemplates, classList, closest, compile, createElement, debounce, detach, extend, formatUnit, getEnumValue, getValue, isBlazor, isNullOrUndefined, isObject, isUndefined, matches, merge, print, remove, removeClass, resetBlazorTemplate, select, selectAll, setCulture, setStyleAttribute, setValue, updateBlazorTemplate } from '@syncfusion/ej2-base';
 import { DataManager, DataUtil, Deferred, Predicate, Query, UrlAdaptor } from '@syncfusion/ej2-data';
 import { Dialog, Tooltip, calculatePosition, calculateRelativeBasedPosition, createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';
 import { Button, CheckBox, RadioButton, Switch, createCheckBox } from '@syncfusion/ej2-buttons';
@@ -13,7 +13,7 @@ import { PdfBitmap, PdfBorders, PdfColor, PdfCompositeField, PdfDocument, PdfFon
  * ValueFormatter class to globalize the value.
  * @hidden
  */
-var ValueFormatter = /** @__PURE__ @class */ (function () {
+var ValueFormatter = /** @class */ (function () {
     function ValueFormatter(cultureName) {
         this.intl = new Internationalization();
         if (!isNullOrUndefined(cultureName)) {
@@ -67,16 +67,16 @@ var ValueFormatter = /** @__PURE__ @class */ (function () {
     return ValueFormatter;
 }());
 
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Represents Grid `Column` model class.
  */
-var Column = /** @__PURE__ @class */ (function () {
+var Column = /** @class */ (function () {
     function Column(options) {
         var _this = this;
         /**
@@ -330,7 +330,7 @@ var Column = /** @__PURE__ @class */ (function () {
 /**
  * Define options for custom command buttons.
  */
-var CommandColumnModel = /** @__PURE__ @class */ (function () {
+var CommandColumnModel = /** @class */ (function () {
     function CommandColumnModel() {
     }
     __decorate([
@@ -891,7 +891,7 @@ var AggregateTemplateType;
  * Grid data module is used to generate query and data source.
  * @hidden
  */
-var Data = /** @__PURE__ @class */ (function () {
+var Data = /** @class */ (function () {
     /**
      * Constructor for data module.
      * @hidden
@@ -1482,7 +1482,7 @@ var Data = /** @__PURE__ @class */ (function () {
  * Row
  * @hidden
  */
-var Row = /** @__PURE__ @class */ (function () {
+var Row = /** @class */ (function () {
     function Row(options, parent) {
         merge(this, options);
         this.parent = parent;
@@ -1532,7 +1532,7 @@ var Row = /** @__PURE__ @class */ (function () {
  * Cell
  * @hidden
  */
-var Cell = /** @__PURE__ @class */ (function () {
+var Cell = /** @class */ (function () {
     function Cell(options) {
         this.isSpanned = false;
         this.isRowSpanned = false;
@@ -1550,7 +1550,7 @@ var Cell = /** @__PURE__ @class */ (function () {
  * `CellMergeRender` module.
  * @hidden
  */
-var CellMergeRender = /** @__PURE__ @class */ (function () {
+var CellMergeRender = /** @class */ (function () {
     function CellMergeRender(serviceLocator, parent) {
         this.serviceLocator = serviceLocator;
         this.parent = parent;
@@ -1671,7 +1671,7 @@ var CellMergeRender = /** @__PURE__ @class */ (function () {
  * RowRenderer class which responsible for building row content.
  * @hidden
  */
-var RowRenderer = /** @__PURE__ @class */ (function () {
+var RowRenderer = /** @class */ (function () {
     function RowRenderer(serviceLocator, cellType, parent) {
         this.isSpan = false;
         this.cellType = cellType;
@@ -1865,7 +1865,7 @@ var RowRenderer = /** @__PURE__ @class */ (function () {
  * RowModelGenerator is used to generate grid data rows.
  * @hidden
  */
-var RowModelGenerator = /** @__PURE__ @class */ (function () {
+var RowModelGenerator = /** @class */ (function () {
     /**
      * Constructor for header renderer module
      */
@@ -1978,24 +1978,24 @@ var RowModelGenerator = /** @__PURE__ @class */ (function () {
     return RowModelGenerator;
 }());
 
-var __extends$2 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$2 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * Summary row model generator
  * @hidden
  */
-var SummaryModelGenerator = /** @__PURE__ @class */ (function () {
+var SummaryModelGenerator = /** @class */ (function () {
     /**
      * Constructor for Summary row model generator
      */
@@ -2145,7 +2145,7 @@ var SummaryModelGenerator = /** @__PURE__ @class */ (function () {
     };
     return SummaryModelGenerator;
 }());
-var GroupSummaryModelGenerator = /** @__PURE__ @class */ (function (_super) {
+var GroupSummaryModelGenerator = /** @class */ (function (_super) {
     __extends$2(GroupSummaryModelGenerator, _super);
     function GroupSummaryModelGenerator() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -2162,7 +2162,7 @@ var GroupSummaryModelGenerator = /** @__PURE__ @class */ (function (_super) {
     };
     return GroupSummaryModelGenerator;
 }(SummaryModelGenerator));
-var CaptionSummaryModelGenerator = /** @__PURE__ @class */ (function (_super) {
+var CaptionSummaryModelGenerator = /** @class */ (function (_super) {
     __extends$2(CaptionSummaryModelGenerator, _super);
     function CaptionSummaryModelGenerator() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -2186,24 +2186,24 @@ var CaptionSummaryModelGenerator = /** @__PURE__ @class */ (function (_super) {
     return CaptionSummaryModelGenerator;
 }(SummaryModelGenerator));
 
-var __extends$1 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$1 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * GroupModelGenerator is used to generate group caption rows and data rows.
  * @hidden
  */
-var GroupModelGenerator = /** @__PURE__ @class */ (function (_super) {
+var GroupModelGenerator = /** @class */ (function (_super) {
     __extends$1(GroupModelGenerator, _super);
     function GroupModelGenerator(parent) {
         var _this = _super.call(this, parent) || this;
@@ -2411,7 +2411,7 @@ var GroupModelGenerator = /** @__PURE__ @class */ (function (_super) {
  * Content module is used to render grid content
  * @hidden
  */
-var ContentRender = /** @__PURE__ @class */ (function () {
+var ContentRender = /** @class */ (function () {
     /**
      * Constructor for content renderer module
      */
@@ -3586,6 +3586,9 @@ var ContentRender = /** @__PURE__ @class */ (function () {
     ContentRender.prototype.refreshImmutableContent = function (index, tr, row) {
         row.isAltRow = this.parent.enableAltRow ? index % 2 !== 0 : false;
         row.isAltRow ? tr.classList.add('e-altrow') : tr.classList.remove('e-altrow');
+        row.index = index;
+        row.edit = undefined;
+        row.isDirty = false;
         tr.setAttribute('aria-rowindex', index.toString());
         this.updateCellIndex(tr, index);
     };
@@ -3601,7 +3604,7 @@ var ContentRender = /** @__PURE__ @class */ (function () {
  * Content module is used to render grid content
  * @hidden
  */
-var HeaderRender = /** @__PURE__ @class */ (function () {
+var HeaderRender = /** @class */ (function () {
     /**
      * Constructor for header renderer module
      */
@@ -4295,7 +4298,7 @@ var HeaderRender = /** @__PURE__ @class */ (function () {
  * CellRenderer class which responsible for building cell content.
  * @hidden
  */
-var CellRenderer = /** @__PURE__ @class */ (function () {
+var CellRenderer = /** @class */ (function () {
     function CellRenderer(parent, locator) {
         this.localizer = locator.getService('localization');
         this.formatter = locator.getService('valueFormatter');
@@ -4564,7 +4567,7 @@ var CellRenderer = /** @__PURE__ @class */ (function () {
  * AriaService
  * @hidden
  */
-var AriaService = /** @__PURE__ @class */ (function () {
+var AriaService = /** @class */ (function () {
     function AriaService() {
     }
     AriaService.prototype.setOptions = function (target, options) {
@@ -4619,24 +4622,24 @@ var config = {
     rowcount: 'aria-rowcount'
 };
 
-var __extends$3 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$3 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * HeaderCellRenderer class which responsible for building header cell content.
  * @hidden
  */
-var HeaderCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var HeaderCellRenderer = /** @class */ (function (_super) {
     __extends$3(HeaderCellRenderer, _super);
     function HeaderCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -4833,24 +4836,24 @@ var HeaderCellRenderer = /** @__PURE__ @class */ (function (_super) {
     return HeaderCellRenderer;
 }(CellRenderer));
 
-var __extends$4 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$4 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * StackedHeaderCellRenderer class which responsible for building stacked header cell content.
  * @hidden
  */
-var StackedHeaderCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var StackedHeaderCellRenderer = /** @class */ (function (_super) {
     __extends$4(StackedHeaderCellRenderer, _super);
     function StackedHeaderCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -4911,24 +4914,24 @@ var StackedHeaderCellRenderer = /** @__PURE__ @class */ (function (_super) {
     return StackedHeaderCellRenderer;
 }(CellRenderer));
 
-var __extends$5 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$5 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * IndentCellRenderer class which responsible for building group indent cell.
  * @hidden
  */
-var IndentCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var IndentCellRenderer = /** @class */ (function (_super) {
     __extends$5(IndentCellRenderer, _super);
     function IndentCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -4948,24 +4951,24 @@ var IndentCellRenderer = /** @__PURE__ @class */ (function (_super) {
     return IndentCellRenderer;
 }(CellRenderer));
 
-var __extends$6 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$6 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * GroupCaptionCellRenderer class which responsible for building group caption cell.
  * @hidden
  */
-var GroupCaptionCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var GroupCaptionCellRenderer = /** @class */ (function (_super) {
     __extends$6(GroupCaptionCellRenderer, _super);
     function GroupCaptionCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -5033,7 +5036,7 @@ var GroupCaptionCellRenderer = /** @__PURE__ @class */ (function (_super) {
  * GroupCaptionEmptyCellRenderer class which responsible for building group caption empty cell.
  * @hidden
  */
-var GroupCaptionEmptyCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var GroupCaptionEmptyCellRenderer = /** @class */ (function (_super) {
     __extends$6(GroupCaptionEmptyCellRenderer, _super);
     function GroupCaptionEmptyCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -5054,24 +5057,24 @@ var GroupCaptionEmptyCellRenderer = /** @__PURE__ @class */ (function (_super) {
     return GroupCaptionEmptyCellRenderer;
 }(CellRenderer));
 
-var __extends$7 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$7 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * ExpandCellRenderer class which responsible for building group expand cell.
  * @hidden
  */
-var ExpandCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var ExpandCellRenderer = /** @class */ (function (_super) {
     __extends$7(ExpandCellRenderer, _super);
     function ExpandCellRenderer() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -5098,24 +5101,24 @@ var ExpandCellRenderer = /** @__PURE__ @class */ (function (_super) {
     return ExpandCellRenderer;
 }(IndentCellRenderer));
 
-var __extends$8 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$8 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * HeaderIndentCellRenderer class which responsible for building header indent cell.
  * @hidden
  */
-var HeaderIndentCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var HeaderIndentCellRenderer = /** @class */ (function (_super) {
     __extends$8(HeaderIndentCellRenderer, _super);
     function HeaderIndentCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -5135,24 +5138,24 @@ var HeaderIndentCellRenderer = /** @__PURE__ @class */ (function (_super) {
     return HeaderIndentCellRenderer;
 }(CellRenderer));
 
-var __extends$9 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$9 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * DetailHeaderIndentCellRenderer class which responsible for building detail header indent cell.
  * @hidden
  */
-var DetailHeaderIndentCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var DetailHeaderIndentCellRenderer = /** @class */ (function (_super) {
     __extends$9(DetailHeaderIndentCellRenderer, _super);
     function DetailHeaderIndentCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -5172,24 +5175,24 @@ var DetailHeaderIndentCellRenderer = /** @__PURE__ @class */ (function (_super)
     return DetailHeaderIndentCellRenderer;
 }(CellRenderer));
 
-var __extends$10 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$10 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * ExpandCellRenderer class which responsible for building group expand cell.
  * @hidden
  */
-var DetailExpandCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var DetailExpandCellRenderer = /** @class */ (function (_super) {
     __extends$10(DetailExpandCellRenderer, _super);
     function DetailExpandCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -5217,24 +5220,24 @@ var DetailExpandCellRenderer = /** @__PURE__ @class */ (function (_super) {
     return DetailExpandCellRenderer;
 }(CellRenderer));
 
-var __extends$11 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$11 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * ExpandCellRenderer class which responsible for building group expand cell.
  * @hidden
  */
-var RowDragDropRenderer = /** @__PURE__ @class */ (function (_super) {
+var RowDragDropRenderer = /** @class */ (function (_super) {
     __extends$11(RowDragDropRenderer, _super);
     function RowDragDropRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -5261,24 +5264,24 @@ var RowDragDropRenderer = /** @__PURE__ @class */ (function (_super) {
     return RowDragDropRenderer;
 }(CellRenderer));
 
-var __extends$12 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$12 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * DetailHeaderIndentCellRenderer class which responsible for building detail header indent cell.
  * @hidden
  */
-var RowDragDropHeaderRenderer = /** @__PURE__ @class */ (function (_super) {
+var RowDragDropHeaderRenderer = /** @class */ (function (_super) {
     __extends$12(RowDragDropHeaderRenderer, _super);
     function RowDragDropHeaderRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -5302,7 +5305,7 @@ var RowDragDropHeaderRenderer = /** @__PURE__ @class */ (function (_super) {
  * Content module is used to render grid content
  * @hidden
  */
-var Render = /** @__PURE__ @class */ (function () {
+var Render = /** @class */ (function () {
     /**
      * Constructor for render module
      */
@@ -5997,7 +6000,7 @@ var Render = /** @__PURE__ @class */ (function () {
  * CellRendererFactory
  * @hidden
  */
-var CellRendererFactory = /** @__PURE__ @class */ (function () {
+var CellRendererFactory = /** @class */ (function () {
     function CellRendererFactory() {
         this.cellRenderMap = {};
     }
@@ -6023,7 +6026,7 @@ var CellRendererFactory = /** @__PURE__ @class */ (function () {
  * ServiceLocator
  * @hidden
  */
-var ServiceLocator = /** @__PURE__ @class */ (function () {
+var ServiceLocator = /** @class */ (function () {
     function ServiceLocator() {
         this.services = {};
     }
@@ -6045,7 +6048,7 @@ var ServiceLocator = /** @__PURE__ @class */ (function () {
  * RendererFactory
  * @hidden
  */
-var RendererFactory = /** @__PURE__ @class */ (function () {
+var RendererFactory = /** @class */ (function () {
     function RendererFactory() {
         this.rendererMap = {};
     }
@@ -6071,7 +6074,7 @@ var RendererFactory = /** @__PURE__ @class */ (function () {
  * ColumnWidthService
  * @hidden
  */
-var ColumnWidthService = /** @__PURE__ @class */ (function () {
+var ColumnWidthService = /** @class */ (function () {
     function ColumnWidthService(parent) {
         this.parent = parent;
     }
@@ -6360,24 +6363,24 @@ var ColumnWidthService = /** @__PURE__ @class */ (function () {
     return ColumnWidthService;
 }());
 
-var __extends$13 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$13 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * FocusStrategy class
  * @hidden
  */
-var FocusStrategy = /** @__PURE__ @class */ (function () {
+var FocusStrategy = /** @class */ (function () {
     function FocusStrategy(parent) {
         this.currentInfo = {};
         this.oneTime = true;
@@ -6587,7 +6590,7 @@ var FocusStrategy = /** @__PURE__ @class */ (function () {
         this.addFocus(this.getContent().getFocusInfo(), e);
     };
     FocusStrategy.prototype.removeFocus = function (e) {
-        if (!this.currentInfo.element) {
+        if (!this.currentInfo.element || !this.currentInfo.elementToFocus) {
             return;
         }
         removeClass([this.currentInfo.element, this.currentInfo.elementToFocus], ['e-focused', 'e-focus']);
@@ -6619,7 +6622,7 @@ var FocusStrategy = /** @__PURE__ @class */ (function () {
     FocusStrategy.prototype.addFocus = function (info, e) {
         this.currentInfo = info;
         this.currentInfo.outline = info.outline && !isNullOrUndefined(e);
-        if (!info.element) {
+        if (!info.element || !info.elementToFocus) {
             return;
         }
         var isFocused = info.elementToFocus.classList.contains('e-focus');
@@ -6876,7 +6879,7 @@ var FocusStrategy = /** @__PURE__ @class */ (function () {
  * Create matrix from row collection which act as mental model for cell navigation
  * @hidden
  */
-var Matrix = /** @__PURE__ @class */ (function () {
+var Matrix = /** @class */ (function () {
     function Matrix() {
         this.matrix = [];
         this.current = [];
@@ -6955,7 +6958,7 @@ var Matrix = /** @__PURE__ @class */ (function () {
 /**
  * @hidden
  */
-var ContentFocus = /** @__PURE__ @class */ (function () {
+var ContentFocus = /** @class */ (function () {
     function ContentFocus(parent) {
         var _this = this;
         this.matrix = new Matrix();
@@ -7040,6 +7043,7 @@ var ContentFocus = /** @__PURE__ @class */ (function () {
     };
     ContentFocus.prototype.onClick = function (e, force) {
         var target = e.target;
+        this.target = target;
         target = (target.classList.contains('e-rowcell') ? target : closest(target, 'td'));
         target = target ? target : closest(e.target, 'td.e-detailrowcollapse')
             || closest(e.target, 'td.e-detailrowexpand');
@@ -7073,7 +7077,9 @@ var ContentFocus = /** @__PURE__ @class */ (function () {
         return info;
     };
     ContentFocus.prototype.getFocusable = function (element) {
+        var _this = this;
         var query = 'button, [href], input:not([type="hidden"]), select, textarea, [tabindex]:not([tabindex="-1"])';
+        var isTemplate = !isNullOrUndefined(closest(element, '.e-templatecell'));
         if (this.parent.isEdit) {
             query = 'input:not([type="hidden"]), select:not([aria-hidden="true"]), textarea';
         }
@@ -7082,7 +7088,14 @@ var ContentFocus = /** @__PURE__ @class */ (function () {
          * if no child found then select the cell itself.
          * if Grid is in editable state, check for editable control inside child.
          */
-        return child.length ? child[0] : element;
+        if (isTemplate && child.length && child.length > 1) {
+            setTimeout(function () {
+                return _this.target;
+            }, 10);
+        }
+        else {
+            return child.length ? child[0] : element;
+        }
     };
     ContentFocus.prototype.selector = function (row, cell, isRowTemplate) {
         var types = [CellType.Expand, CellType.GroupCaption, CellType.CaptionSummary, CellType.GroupSummary];
@@ -7201,7 +7214,7 @@ var ContentFocus = /** @__PURE__ @class */ (function () {
 /**
  * @hidden
  */
-var HeaderFocus = /** @__PURE__ @class */ (function (_super) {
+var HeaderFocus = /** @class */ (function (_super) {
     __extends$13(HeaderFocus, _super);
     function HeaderFocus(parent) {
         return _super.call(this, parent) || this;
@@ -7321,7 +7334,7 @@ var HeaderFocus = /** @__PURE__ @class */ (function (_super) {
     };
     return HeaderFocus;
 }(ContentFocus));
-var FixedContentFocus = /** @__PURE__ @class */ (function (_super) {
+var FixedContentFocus = /** @class */ (function (_super) {
     __extends$13(FixedContentFocus, _super);
     function FixedContentFocus() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -7357,7 +7370,7 @@ var FixedContentFocus = /** @__PURE__ @class */ (function (_super) {
     };
     return FixedContentFocus;
 }(ContentFocus));
-var FixedHeaderFocus = /** @__PURE__ @class */ (function (_super) {
+var FixedHeaderFocus = /** @class */ (function (_super) {
     __extends$13(FixedHeaderFocus, _super);
     function FixedHeaderFocus() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -7392,7 +7405,7 @@ var FixedHeaderFocus = /** @__PURE__ @class */ (function (_super) {
     return FixedHeaderFocus;
 }(HeaderFocus));
 /** @hidden */
-var SearchBox = /** @__PURE__ @class */ (function () {
+var SearchBox = /** @class */ (function () {
     function SearchBox(searchBox) {
         this.searchBox = searchBox;
     }
@@ -7417,29 +7430,29 @@ var SearchBox = /** @__PURE__ @class */ (function () {
     return SearchBox;
 }());
 
-var __extends$14 = (undefined && undefined.__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 __());
-    };
-})();
-var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$14 = (undefined && undefined.__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 __());
+    };
+})();
+var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Configures the paging behavior of the Grid.
  */
-var PageSettings = /** @__PURE__ @class */ (function (_super) {
+var PageSettings = /** @class */ (function (_super) {
     __extends$14(PageSettings, _super);
     function PageSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -7468,29 +7481,29 @@ var PageSettings = /** @__PURE__ @class */ (function (_super) {
     return PageSettings;
 }(ChildProperty));
 
-var __extends$15 = (undefined && undefined.__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 __());
-    };
-})();
-var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$15 = (undefined && undefined.__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 __());
+    };
+})();
+var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Configures the column chooser behavior of the Grid.
  */
-var ColumnChooserSettings = /** @__PURE__ @class */ (function (_super) {
+var ColumnChooserSettings = /** @class */ (function (_super) {
     __extends$15(ColumnChooserSettings, _super);
     function ColumnChooserSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -7501,21 +7514,21 @@ var ColumnChooserSettings = /** @__PURE__ @class */ (function (_super) {
     return ColumnChooserSettings;
 }(ChildProperty));
 
-var __assign = (undefined && undefined.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 /**
  * The `Selection` module is used to handle cell and row selection.
  */
-var Selection = /** @__PURE__ @class */ (function () {
+var Selection = /** @class */ (function () {
     /**
      * Constructor for the Grid selection module
      * @hidden
@@ -9419,9 +9432,9 @@ var Selection = /** @__PURE__ @class */ (function () {
             if (rindex < this.parent.frozenRows) {
                 isFrozenRow = true;
             }
-            if (!parentsUntil(this.target, 'e-table').querySelector('#' + this.parent.element.id + '_autofill')) {
-                if (this.parent.element.querySelector('#' + this.parent.element.id + '_autofill')) {
-                    this.parent.element.querySelector('#' + this.parent.element.id + '_autofill').remove();
+            if (!select('#' + this.parent.element.id + '_autofill', parentsUntil(this.target, 'e-table'))) {
+                if (select('#' + this.parent.element.id + '_autofill', this.parent.element)) {
+                    select('#' + this.parent.element.id + '_autofill', this.parent.element).remove();
                 }
                 this.autofill = createElement('div', { className: 'e-autofill', id: this.parent.element.id + '_autofill' });
                 this.autofill.style.display = 'none';
@@ -10584,7 +10597,7 @@ var Selection = /** @__PURE__ @class */ (function () {
 /**
  * The `Search` module is used to handle search action.
  */
-var Search = /** @__PURE__ @class */ (function () {
+var Search = /** @class */ (function () {
     /**
      * Constructor for Grid search module.
      * @hidden
@@ -10702,7 +10715,7 @@ var Search = /** @__PURE__ @class */ (function () {
 /**
  * The `ShowHide` module is used to control column visibility.
  */
-var ShowHide = /** @__PURE__ @class */ (function () {
+var ShowHide = /** @class */ (function () {
     /**
      * Constructor for the show hide module.
      * @hidden
@@ -10817,7 +10830,7 @@ var ShowHide = /** @__PURE__ @class */ (function () {
 /**
  * The `Scroll` module is used to handle scrolling behaviour.
  */
-var Scroll = /** @__PURE__ @class */ (function () {
+var Scroll = /** @class */ (function () {
     /**
      * Constructor for the Grid scrolling.
      * @hidden
@@ -11211,29 +11224,29 @@ var Scroll = /** @__PURE__ @class */ (function () {
     return Scroll;
 }());
 
-var __extends$16 = (undefined && undefined.__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 __());
-    };
-})();
-var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$16 = (undefined && undefined.__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 __());
+    };
+})();
+var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Configures the Grid's aggregate column.
  */
-var AggregateColumn = /** @__PURE__ @class */ (function (_super) {
+var AggregateColumn = /** @class */ (function (_super) {
     __extends$16(AggregateColumn, _super);
     function AggregateColumn() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -11311,7 +11324,7 @@ var AggregateColumn = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the aggregate rows.
  */
-var AggregateRow = /** @__PURE__ @class */ (function (_super) {
+var AggregateRow = /** @class */ (function (_super) {
     __extends$16(AggregateRow, _super);
     function AggregateRow() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -11325,7 +11338,7 @@ var AggregateRow = /** @__PURE__ @class */ (function (_super) {
 /**
  * The `Clipboard` module is used to handle clipboard copy action.
  */
-var Clipboard = /** @__PURE__ @class */ (function () {
+var Clipboard = /** @class */ (function () {
     /**
      * Constructor for the Grid clipboard module
      * @hidden
@@ -11656,7 +11669,7 @@ var gridObserver = new Observer();
  * BlazorAction is used for performing Blazor related Grid Actions.
  * @hidden
  */
-var BlazorAction = /** @__PURE__ @class */ (function () {
+var BlazorAction = /** @class */ (function () {
     function BlazorAction(parent) {
         this.aria = new AriaService();
         this.actionArgs = {};
@@ -12030,29 +12043,29 @@ var BlazorAction = /** @__PURE__ @class */ (function () {
     return BlazorAction;
 }());
 
-var __extends = (undefined && undefined.__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 __());
-    };
-})();
-var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends = (undefined && undefined.__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 __());
+    };
+})();
+var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Represents the field name and direction of sort column.
  */
-var SortDescriptor = /** @__PURE__ @class */ (function (_super) {
+var SortDescriptor = /** @class */ (function (_super) {
     __extends(SortDescriptor, _super);
     function SortDescriptor() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12071,7 +12084,7 @@ var SortDescriptor = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the sorting behavior of Grid.
  */
-var SortSettings = /** @__PURE__ @class */ (function (_super) {
+var SortSettings = /** @class */ (function (_super) {
     __extends(SortSettings, _super);
     function SortSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12087,7 +12100,7 @@ var SortSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Represents the predicate for the filter column.
  */
-var Predicate$1 = /** @__PURE__ @class */ (function (_super) {
+var Predicate$1 = /** @class */ (function (_super) {
     __extends(Predicate$$1, _super);
     function Predicate$$1() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12133,7 +12146,7 @@ var Predicate$1 = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the infinite scroll behavior of Grid.
  */
-var InfiniteScrollSettings = /** @__PURE__ @class */ (function (_super) {
+var InfiniteScrollSettings = /** @class */ (function (_super) {
     __extends(InfiniteScrollSettings, _super);
     function InfiniteScrollSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12152,7 +12165,7 @@ var InfiniteScrollSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the filtering behavior of the Grid.
  */
-var FilterSettings = /** @__PURE__ @class */ (function (_super) {
+var FilterSettings = /** @class */ (function (_super) {
     __extends(FilterSettings, _super);
     function FilterSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12189,7 +12202,7 @@ var FilterSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the selection behavior of the Grid.
  */
-var SelectionSettings = /** @__PURE__ @class */ (function (_super) {
+var SelectionSettings = /** @class */ (function (_super) {
     __extends(SelectionSettings, _super);
     function SelectionSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12223,7 +12236,7 @@ var SelectionSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the search behavior of the Grid.
  */
-var SearchSettings = /** @__PURE__ @class */ (function (_super) {
+var SearchSettings = /** @class */ (function (_super) {
     __extends(SearchSettings, _super);
     function SearchSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12248,7 +12261,7 @@ var SearchSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the row drop settings of the Grid.
  */
-var RowDropSettings = /** @__PURE__ @class */ (function (_super) {
+var RowDropSettings = /** @class */ (function (_super) {
     __extends(RowDropSettings, _super);
     function RowDropSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12261,7 +12274,7 @@ var RowDropSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the text wrap settings of the Grid.
  */
-var TextWrapSettings = /** @__PURE__ @class */ (function (_super) {
+var TextWrapSettings = /** @class */ (function (_super) {
     __extends(TextWrapSettings, _super);
     function TextWrapSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12274,7 +12287,7 @@ var TextWrapSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the resize behavior of the Grid.
  */
-var ResizeSettings = /** @__PURE__ @class */ (function (_super) {
+var ResizeSettings = /** @class */ (function (_super) {
     __extends(ResizeSettings, _super);
     function ResizeSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12287,7 +12300,7 @@ var ResizeSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the group behavior of the Grid.
  */
-var GroupSettings = /** @__PURE__ @class */ (function (_super) {
+var GroupSettings = /** @class */ (function (_super) {
     __extends(GroupSettings, _super);
     function GroupSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12324,7 +12337,7 @@ var GroupSettings = /** @__PURE__ @class */ (function (_super) {
 /**
  * Configures the edit behavior of the Grid.
  */
-var EditSettings = /** @__PURE__ @class */ (function (_super) {
+var EditSettings = /** @class */ (function (_super) {
     __extends(EditSettings, _super);
     function EditSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -12380,7 +12393,7 @@ var EditSettings = /** @__PURE__ @class */ (function (_super) {
  * </script>
  * ```
  */
-var Grid = /** @__PURE__ @class */ (function (_super) {
+var Grid = /** @class */ (function (_super) {
     __extends(Grid, _super);
     /**
      * Constructor for creating the component
@@ -16563,7 +16576,7 @@ function getCloneProperties() {
  *
  * The `Print` module is used to handle print action.
  */
-var Print = /** @__PURE__ @class */ (function () {
+var Print = /** @class */ (function () {
     /**
      * Constructor for the Grid print module
      * @hidden
@@ -16733,13 +16746,13 @@ var Print = /** @__PURE__ @class */ (function () {
         if (!depth) {
             return;
         }
-        var groupCaption = element.querySelectorAll(id + "captioncell.e-groupcaption");
+        var groupCaption = selectAll(id + "captioncell.e-groupcaption", element);
         var colSpan = groupCaption[depth - 1].getAttribute('colspan');
         for (var i = 0; i < groupCaption.length; i++) {
             groupCaption[i].setAttribute('colspan', colSpan);
         }
-        var colGroups = element.querySelectorAll("colgroup" + id + "colGroup");
-        var contentColGroups = element.querySelector('.e-content').querySelectorAll('colgroup');
+        var colGroups = selectAll("colgroup" + id + "colGroup", element);
+        var contentColGroups = selectAll('.e-content colgroup', element);
         this.hideColGroup(colGroups, depth);
         this.hideColGroup(contentColGroups, depth);
     };
@@ -17265,9 +17278,9 @@ function isEditable(col, type, elem) {
 }
 /** @hidden */
 function isActionPrevent(inst) {
-    var dlg = inst.element.querySelector('#' + inst.element.id + 'EditConfirm');
+    var dlg = select('#' + inst.element.id + 'EditConfirm', inst.element);
     return inst.editSettings.mode === 'Batch' &&
-        (inst.element.querySelectorAll('.e-updatedtd').length) && inst.editSettings.showConfirmDialog &&
+        (selectAll('.e-updatedtd', inst.element).length) && inst.editSettings.showConfirmDialog &&
         (dlg ? dlg.classList.contains('e-popup-close') : true);
 }
 /** @hidden */
@@ -17848,7 +17861,7 @@ function setRowElements(gObj) {
  * @hidden
  * `CheckBoxFilterBase` module is used to handle filtering action.
  */
-var CheckBoxFilterBase = /** @__PURE__ @class */ (function () {
+var CheckBoxFilterBase = /** @class */ (function () {
     /**
      * Constructor for checkbox filtering module
      * @hidden
@@ -18537,9 +18550,9 @@ var CheckBoxFilterBase = /** @__PURE__ @class */ (function () {
             this.searchBoxClick(e);
         }
         if (elem) {
-            var selectAll = elem.querySelector('.e-selectall');
-            if (selectAll) {
-                this.updateAllCBoxes(!selectAll.classList.contains('e-check'));
+            var selectAll$$1 = elem.querySelector('.e-selectall');
+            if (selectAll$$1) {
+                this.updateAllCBoxes(!selectAll$$1.classList.contains('e-check'));
             }
             else {
                 toogleCheckbox(elem.parentElement);
@@ -18640,9 +18653,9 @@ var CheckBoxFilterBase = /** @__PURE__ @class */ (function () {
         if (data.length && !this.renderEmpty) {
             var selectAllValue = this.getLocalizedLabel('SelectAll');
             var checkBox = this.createCheckbox(selectAllValue, false, (_a = {}, _a[this.options.field] = selectAllValue, _a));
-            var selectAll = createCboxWithWrap(getUid('cbox'), checkBox, 'e-ftrchk');
-            selectAll.querySelector('.e-frame').classList.add('e-selectall');
-            cBoxes.appendChild(selectAll);
+            var selectAll$$1 = createCboxWithWrap(getUid('cbox'), checkBox, 'e-ftrchk');
+            selectAll$$1.querySelector('.e-frame').classList.add('e-selectall');
+            cBoxes.appendChild(selectAll$$1);
             var predicate = new Predicate('field', 'equal', this.options.field);
             if (this.options.foreignKeyValue) {
                 predicate = predicate.or('field', 'equal', this.options.foreignKeyValue);
@@ -18801,24 +18814,24 @@ var CheckBoxFilterBase = /** @__PURE__ @class */ (function () {
     return CheckBoxFilterBase;
 }());
 
-var __extends$17 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$17 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * @hidden
  * `ExcelFilter` module is used to handle filtering action.
  */
-var ExcelFilterBase = /** @__PURE__ @class */ (function (_super) {
+var ExcelFilterBase = /** @class */ (function (_super) {
     __extends$17(ExcelFilterBase, _super);
     /**
      * Constructor for excel filtering module
@@ -19588,7 +19601,7 @@ var ExcelFilterBase = /** @__PURE__ @class */ (function (_super) {
  *
  * The `Sort` module is used to handle sorting action.
  */
-var Sort = /** @__PURE__ @class */ (function () {
+var Sort = /** @class */ (function () {
     /**
      * Constructor for Grid sorting module
      * @hidden
@@ -20068,7 +20081,7 @@ var Sort = /** @__PURE__ @class */ (function () {
 /**
  * `NumericContainer` module handles rendering and refreshing numeric container.
  */
-var NumericContainer = /** @__PURE__ @class */ (function () {
+var NumericContainer = /** @class */ (function () {
     /**
      * Constructor for numericContainer module
      * @hidden
@@ -20358,7 +20371,7 @@ var NumericContainer = /** @__PURE__ @class */ (function () {
 /**
  * `PagerMessage` module is used to display pager information.
  */
-var PagerMessage = /** @__PURE__ @class */ (function () {
+var PagerMessage = /** @class */ (function () {
     /**
      * Constructor for externalMessage module
      * @hidden
@@ -20436,25 +20449,25 @@ var PagerMessage = /** @__PURE__ @class */ (function () {
     return PagerMessage;
 }());
 
-var __extends$18 = (undefined && undefined.__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 __());
-    };
-})();
-var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$18 = (undefined && undefined.__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 __());
+    };
+})();
+var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Represents the `Pager` component.
  * ```html
@@ -20467,7 +20480,7 @@ var __decorate$5 = (undefined && undefined.__decorate) || function (decorators,
  * </script>
  * ```
  */
-var Pager = /** @__PURE__ @class */ (function (_super) {
+var Pager = /** @class */ (function (_super) {
     __extends$18(Pager, _super);
     /**
      * Constructor for creating the component.
@@ -20934,7 +20947,7 @@ var Pager = /** @__PURE__ @class */ (function (_super) {
 /**
  * `PagerDropDown` module handles selected pageSize from DropDownList.
  */
-var PagerDropDown = /** @__PURE__ @class */ (function () {
+var PagerDropDown = /** @class */ (function () {
     /**
      * Constructor for pager module
      * @hidden
@@ -21029,7 +21042,7 @@ var PagerDropDown = /** @__PURE__ @class */ (function () {
     PagerDropDown.prototype.convertValue = function (pageSizeValue) {
         var item = pageSizeValue;
         for (var i = 0; i < item.length; i++) {
-            item[i] = typeof item[i] === 'number' ? item[i].toString() : item[i];
+            item[i] = parseInt(item[i], 10) ? item[i].toString() : this.pagerModule.getLocalizedLabel(item[i]);
         }
         return item;
     };
@@ -21063,7 +21076,7 @@ var PagerDropDown = /** @__PURE__ @class */ (function () {
 /**
  * `ExternalMessage` module is used to display user provided message.
  */
-var ExternalMessage = /** @__PURE__ @class */ (function () {
+var ExternalMessage = /** @class */ (function () {
     /**
      * Constructor for externalMessage module
      * @param  {Pager} pagerModule?
@@ -21130,7 +21143,7 @@ var ExternalMessage = /** @__PURE__ @class */ (function () {
 /**
  * The `Page` module is used to render pager and handle paging action.
  */
-var Page = /** @__PURE__ @class */ (function () {
+var Page = /** @class */ (function () {
     /**
      * Constructor for the Grid paging module
      * @hidden
@@ -21447,24 +21460,24 @@ var keyActions = {
     altPageDown: '.e-np'
 };
 
-var __extends$19 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$19 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * FilterCellRenderer class which responsible for building filter cell.
  * @hidden
  */
-var FilterCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var FilterCellRenderer = /** @class */ (function (_super) {
     __extends$19(FilterCellRenderer, _super);
     function FilterCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -21655,7 +21668,7 @@ var FilterCellRenderer = /** @__PURE__ @class */ (function (_super) {
  * `filter operators` render boolean column.
  * @hidden
  */
-var FlMenuOptrUI = /** @__PURE__ @class */ (function () {
+var FlMenuOptrUI = /** @class */ (function () {
     function FlMenuOptrUI(parent, customFltrOperators, serviceLocator, filterSettings) {
         this.parent = parent;
         this.serviceLocator = serviceLocator;
@@ -21727,7 +21740,7 @@ var FlMenuOptrUI = /** @__PURE__ @class */ (function () {
  * `string filterui` render string column.
  * @hidden
  */
-var StringFilterUI = /** @__PURE__ @class */ (function () {
+var StringFilterUI = /** @class */ (function () {
     function StringFilterUI(parent, serviceLocator, filterSettings) {
         this.parent = parent;
         this.serLocator = serviceLocator;
@@ -21807,7 +21820,7 @@ var StringFilterUI = /** @__PURE__ @class */ (function () {
  * `numberfilterui` render number column.
  * @hidden
  */
-var NumberFilterUI = /** @__PURE__ @class */ (function () {
+var NumberFilterUI = /** @class */ (function () {
     function NumberFilterUI(parent, serviceLocator, filterSettings) {
         this.filterSettings = filterSettings;
         this.parent = parent;
@@ -21842,7 +21855,7 @@ var NumberFilterUI = /** @__PURE__ @class */ (function () {
  * `boolfilterui` render boolean column.
  * @hidden
  */
-var BooleanFilterUI = /** @__PURE__ @class */ (function () {
+var BooleanFilterUI = /** @class */ (function () {
     function BooleanFilterUI(parent, serviceLocator, filterSettings) {
         this.parent = parent;
         this.serviceLocator = serviceLocator;
@@ -21892,7 +21905,7 @@ var BooleanFilterUI = /** @__PURE__ @class */ (function () {
  * `datefilterui` render date column.
  * @hidden
  */
-var DateFilterUI = /** @__PURE__ @class */ (function () {
+var DateFilterUI = /** @class */ (function () {
     function DateFilterUI(parent, serviceLocator, filterSettings) {
         this.parent = parent;
         this.locator = serviceLocator;
@@ -21948,7 +21961,7 @@ var DateFilterUI = /** @__PURE__ @class */ (function () {
  * `filter menu` render boolean column.
  * @hidden
  */
-var FilterMenuRenderer = /** @__PURE__ @class */ (function () {
+var FilterMenuRenderer = /** @class */ (function () {
     function FilterMenuRenderer(parent, filterSettings, serviceLocator, customFltrOperators, fltrObj) {
         this.isDialogOpen = false;
         this.colTypes = {
@@ -22217,7 +22230,7 @@ var FilterMenuRenderer = /** @__PURE__ @class */ (function () {
  * @hidden
  * `CheckBoxFilter` module is used to handle filtering action.
  */
-var CheckBoxFilter = /** @__PURE__ @class */ (function () {
+var CheckBoxFilter = /** @class */ (function () {
     /**
      * Constructor for checkbox filtering module
      * @hidden
@@ -22286,24 +22299,24 @@ var CheckBoxFilter = /** @__PURE__ @class */ (function () {
     return CheckBoxFilter;
 }());
 
-var __extends$20 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$20 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * @hidden
  * `ExcelFilter` module is used to handle filtering action.
  */
-var ExcelFilter = /** @__PURE__ @class */ (function (_super) {
+var ExcelFilter = /** @class */ (function (_super) {
     __extends$20(ExcelFilter, _super);
     /**
      * Constructor for excelbox filtering module
@@ -22358,7 +22371,7 @@ var ExcelFilter = /** @__PURE__ @class */ (function (_super) {
  *
  * The `Filter` module is used to handle filtering action.
  */
-var Filter = /** @__PURE__ @class */ (function () {
+var Filter = /** @class */ (function () {
     /**
      * Constructor for Grid filtering module
      * @hidden
@@ -23459,7 +23472,7 @@ var resizeClassList = {
  * @hidden
  * @private
  */
-var Resize = /** @__PURE__ @class */ (function () {
+var Resize = /** @class */ (function () {
     /**
      * Constructor for the Grid resize module
      * @hidden
@@ -24128,9 +24141,12 @@ var Resize = /** @__PURE__ @class */ (function () {
         };
     };
     Resize.prototype.doubleTapEvent = function (e) {
+        var _this = this;
         if (this.getUserAgent() && this.isDblClk) {
             if (!this.tapped) {
-                this.tapped = setTimeout(this.timeoutHandler(), 300);
+                this.tapped = setTimeout(function () {
+                    _this.tapped = null;
+                }, 300);
             }
             else {
                 clearTimeout(this.tapped);
@@ -24153,7 +24169,7 @@ var Resize = /** @__PURE__ @class */ (function () {
  *
  * The `Reorder` module is used for reordering columns.
  */
-var Reorder = /** @__PURE__ @class */ (function () {
+var Reorder = /** @class */ (function () {
     /**
      * Constructor for the Grid reorder module
      * @hidden
@@ -24687,7 +24703,7 @@ var Reorder = /** @__PURE__ @class */ (function () {
  * Reorder module is used to handle row reordering.
  * @hidden
  */
-var RowDD = /** @__PURE__ @class */ (function () {
+var RowDD = /** @class */ (function () {
     /**
      * Constructor for the Grid print module
      * @hidden
@@ -25340,7 +25356,7 @@ var RowDD = /** @__PURE__ @class */ (function () {
  *
  * The `Group` module is used to handle group action.
  */
-var Group = /** @__PURE__ @class */ (function () {
+var Group = /** @class */ (function () {
     /**
      * Constructor for Grid group module
      * @hidden
@@ -26419,7 +26435,7 @@ var Group = /** @__PURE__ @class */ (function () {
 /**
  * The `DetailRow` module is used to handle detail template and hierarchy Grid operations.
  */
-var DetailRow = /** @__PURE__ @class */ (function () {
+var DetailRow = /** @class */ (function () {
     /**
      * Constructor for the Grid detail template module
      * @hidden
@@ -26729,7 +26745,7 @@ var DetailRow = /** @__PURE__ @class */ (function () {
  * The `Toolbar` module is used to handle ToolBar actions.
  * @hidden
  */
-var Toolbar$1 = /** @__PURE__ @class */ (function () {
+var Toolbar$1 = /** @class */ (function () {
     function Toolbar$$1(parent, serviceLocator) {
         this.predefinedItems = {};
         this.items = ['Add', 'Edit', 'Update', 'Delete', 'Cancel', 'Print', 'Search',
@@ -26794,7 +26810,7 @@ var Toolbar$1 = /** @__PURE__ @class */ (function () {
         }
     };
     Toolbar$$1.prototype.bindSearchEvents = function () {
-        this.searchElement = this.element.querySelector('#' + this.gridID + '_searchbar');
+        this.searchElement = select('#' + this.gridID + '_searchbar', this.element);
         this.wireEvent();
         this.refreshToolbarItems();
         if (this.parent.searchSettings) {
@@ -26803,11 +26819,11 @@ var Toolbar$1 = /** @__PURE__ @class */ (function () {
     };
     Toolbar$$1.prototype.toolbarCreated = function () {
         if (this.element.querySelector('.e-search-wrapper')) {
-            this.element.querySelector('.e-search-wrapper').innerHTML = '<div class="e-input-group e-search" role="search">\
-        <input id="' + this.gridID + '_searchbar" class="e-input" name="input" type="search" \
-        placeholder= \"' + this.l10n.getConstant('Search') + '\"/>\
-        <span id="' + this.gridID + '_searchbutton" class="e-input-group-icon e-search-icon e-icons" \
-        tabindex="-1" title="' + this.l10n.getConstant('Search') + '" aria-label= "search"></span> \
+            this.element.querySelector('.e-search-wrapper').innerHTML = '<div class="e-input-group e-search" role="search">\
+        <input id="' + this.gridID + '_searchbar" class="e-input" name="input" type="search" \
+        placeholder= \"' + this.l10n.getConstant('Search') + '\"/>\
+        <span id="' + this.gridID + '_searchbutton" class="e-input-group-icon e-search-icon e-icons" \
+        tabindex="-1" title="' + this.l10n.getConstant('Search') + '" aria-label= "search"></span> \
         </div>';
         }
         this.bindSearchEvents();
@@ -26940,7 +26956,7 @@ var Toolbar$1 = /** @__PURE__ @class */ (function () {
     Toolbar$$1.prototype.enableItems = function (items, isEnable) {
         for (var _i = 0, items_2 = items; _i < items_2.length; _i++) {
             var item = items_2[_i];
-            var element = this.element.querySelector('#' + item);
+            var element = select('#' + item, this.element);
             if (element) {
                 this.toolbar.enableItems(element.parentElement, isEnable);
             }
@@ -27076,24 +27092,24 @@ var Toolbar$1 = /** @__PURE__ @class */ (function () {
     return Toolbar$$1;
 }());
 
-var __extends$21 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$21 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * Footer module is used to render grid content
  * @hidden
  */
-var FooterRenderer = /** @__PURE__ @class */ (function (_super) {
+var FooterRenderer = /** @class */ (function (_super) {
     __extends$21(FooterRenderer, _super);
     function FooterRenderer(gridModule, serviceLocator) {
         var _this = _super.call(this, gridModule, serviceLocator) || this;
@@ -27365,24 +27381,24 @@ var FooterRenderer = /** @__PURE__ @class */ (function (_super) {
     return FooterRenderer;
 }(ContentRender));
 
-var __extends$22 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$22 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * SummaryCellRenderer class which responsible for building summary cell content.
  * @hidden
  */
-var SummaryCellRenderer = /** @__PURE__ @class */ (function (_super) {
+var SummaryCellRenderer = /** @class */ (function (_super) {
     __extends$22(SummaryCellRenderer, _super);
     function SummaryCellRenderer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -27451,7 +27467,7 @@ var SummaryCellRenderer = /** @__PURE__ @class */ (function (_super) {
 /**
  * Summary Action controller.
  */
-var Aggregate = /** @__PURE__ @class */ (function () {
+var Aggregate = /** @class */ (function () {
     function Aggregate(parent, locator) {
         this.parent = parent;
         this.locator = locator;
@@ -27578,7 +27594,7 @@ function summaryIterator(aggregates, callback) {
  * InterSectionObserver - class watch whether it enters the viewport.
  * @hidden
  */
-var InterSectionObserver = /** @__PURE__ @class */ (function () {
+var InterSectionObserver = /** @class */ (function () {
     function InterSectionObserver(element, options) {
         var _this = this;
         this.fromWheel = false;
@@ -27672,7 +27688,7 @@ var InterSectionObserver = /** @__PURE__ @class */ (function () {
 /**
  * Content module is used to render grid content
  */
-var VirtualRowModelGenerator = /** @__PURE__ @class */ (function () {
+var VirtualRowModelGenerator = /** @class */ (function () {
     function VirtualRowModelGenerator(parent) {
         this.cOffsets = {};
         this.cache = {};
@@ -27935,24 +27951,24 @@ var VirtualRowModelGenerator = /** @__PURE__ @class */ (function () {
     return VirtualRowModelGenerator;
 }());
 
-var __extends$23 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$23 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * VirtualContentRenderer
  * @hidden
  */
-var VirtualContentRenderer = /** @__PURE__ @class */ (function (_super) {
+var VirtualContentRenderer = /** @class */ (function (_super) {
     __extends$23(VirtualContentRenderer, _super);
     function VirtualContentRenderer(parent, locator) {
         var _this = _super.call(this, parent, locator) || this;
@@ -28991,7 +29007,7 @@ var VirtualContentRenderer = /** @__PURE__ @class */ (function (_super) {
 /**
  * @hidden
  */
-var VirtualHeaderRenderer = /** @__PURE__ @class */ (function (_super) {
+var VirtualHeaderRenderer = /** @class */ (function (_super) {
     __extends$23(VirtualHeaderRenderer, _super);
     function VirtualHeaderRenderer(parent, locator) {
         var _this = _super.call(this, parent, locator) || this;
@@ -29117,7 +29133,7 @@ var VirtualHeaderRenderer = /** @__PURE__ @class */ (function (_super) {
 /**
  * @hidden
  */
-var VirtualElementHandler = /** @__PURE__ @class */ (function () {
+var VirtualElementHandler = /** @class */ (function () {
     function VirtualElementHandler() {
     }
     VirtualElementHandler.prototype.renderWrapper = function (height) {
@@ -29163,7 +29179,7 @@ var VirtualElementHandler = /** @__PURE__ @class */ (function () {
 /**
  * Virtual Scrolling class
  */
-var VirtualScroll = /** @__PURE__ @class */ (function () {
+var VirtualScroll = /** @class */ (function () {
     function VirtualScroll(parent, locator) {
         this.parent = parent;
         this.locator = locator;
@@ -29225,7 +29241,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
  * Edit render module is used to render grid edit row.
  * @hidden
  */
-var InlineEditRender = /** @__PURE__ @class */ (function () {
+var InlineEditRender = /** @class */ (function () {
     /**
      * Constructor for render module
      */
@@ -29519,7 +29535,7 @@ var InlineEditRender = /** @__PURE__ @class */ (function () {
  * Edit render module is used to render grid edit row.
  * @hidden
  */
-var BatchEditRender = /** @__PURE__ @class */ (function () {
+var BatchEditRender = /** @class */ (function () {
     /**
      * Constructor for render module
      */
@@ -29566,7 +29582,7 @@ var BatchEditRender = /** @__PURE__ @class */ (function () {
  * Edit render module is used to render grid edit row.
  * @hidden
  */
-var DialogEditRender = /** @__PURE__ @class */ (function () {
+var DialogEditRender = /** @class */ (function () {
     /**
      * Constructor for render module
      */
@@ -29732,7 +29748,7 @@ var DialogEditRender = /** @__PURE__ @class */ (function () {
  * Edit render module is used to render grid edit row.
  * @hidden
  */
-var EditRender = /** @__PURE__ @class */ (function () {
+var EditRender = /** @class */ (function () {
     /**
      * Constructor for render module
      */
@@ -29764,7 +29780,7 @@ var EditRender = /** @__PURE__ @class */ (function () {
         var fForm;
         var frzCols = gObj.getFrozenColumns();
         var form = gObj.editSettings.mode === 'Dialog' ?
-            document.querySelector('#' + gObj.element.id + '_dialogEdit_wrapper').querySelector('.e-gridform') :
+            select('#' + gObj.element.id + '_dialogEdit_wrapper .e-gridform', document) :
             gObj.element.querySelector('.e-gridform');
         if (frzCols && gObj.editSettings.mode === 'Normal') {
             var rowIndex = parseInt(args.row.getAttribute('aria-rowindex'), 10);
@@ -29955,7 +29971,7 @@ var EditRender = /** @__PURE__ @class */ (function () {
  * `BooleanEditCell` is used to handle boolean cell type editing.
  * @hidden
  */
-var BooleanEditCell = /** @__PURE__ @class */ (function () {
+var BooleanEditCell = /** @class */ (function () {
     function BooleanEditCell(parent) {
         this.activeClasses = ['e-selectionbackground', 'e-active'];
         this.parent = parent;
@@ -30033,7 +30049,7 @@ var BooleanEditCell = /** @__PURE__ @class */ (function () {
  * `DropDownEditCell` is used to handle dropdown cell type editing.
  * @hidden
  */
-var DropDownEditCell = /** @__PURE__ @class */ (function () {
+var DropDownEditCell = /** @class */ (function () {
     function DropDownEditCell(parent) {
         //constructor
         this.parent = parent;
@@ -30094,7 +30110,7 @@ var DropDownEditCell = /** @__PURE__ @class */ (function () {
     DropDownEditCell.prototype.dropDownOpen = function (args) {
         var dlgElement = parentsUntil(this.obj.element, 'e-dialog');
         if (this.parent.editSettings.mode === 'Dialog' && !isNullOrUndefined(dlgElement)) {
-            var dlgObj = document.querySelector('#' + dlgElement.id).ej2_instances[0];
+            var dlgObj = select('#' + dlgElement.id, document).ej2_instances[0];
             args.popup.element.style.zIndex = (dlgObj.zIndex + 1).toString();
         }
     };
@@ -30110,7 +30126,7 @@ var DropDownEditCell = /** @__PURE__ @class */ (function () {
  * `NumericEditCell` is used to handle numeric cell type editing.
  * @hidden
  */
-var NumericEditCell = /** @__PURE__ @class */ (function () {
+var NumericEditCell = /** @class */ (function () {
     function NumericEditCell(parent) {
         this.parent = parent;
     }
@@ -30163,7 +30179,7 @@ var NumericEditCell = /** @__PURE__ @class */ (function () {
  * `DefaultEditCell` is used to handle default cell type editing.
  * @hidden
  */
-var DefaultEditCell = /** @__PURE__ @class */ (function () {
+var DefaultEditCell = /** @class */ (function () {
     function DefaultEditCell(parent) {
         this.parent = parent;
     }
@@ -30203,7 +30219,7 @@ var DefaultEditCell = /** @__PURE__ @class */ (function () {
  * `NormalEdit` module is used to handle normal('inline, dialog, external') editing actions.
  * @hidden
  */
-var NormalEdit = /** @__PURE__ @class */ (function () {
+var NormalEdit = /** @class */ (function () {
     function NormalEdit(parent, serviceLocator, renderer) {
         this.args = {};
         this.currentVirtualData = {};
@@ -30396,7 +30412,7 @@ var NormalEdit = /** @__PURE__ @class */ (function () {
             previousData: this.previousData, selectedRow: gObj.selectedRowIndex, foreignKeyData: {}
         });
         var isDlg = gObj.editSettings.mode === 'Dialog';
-        var dlgWrapper = document.querySelector('#' + gObj.element.id + '_dialogEdit_wrapper');
+        var dlgWrapper = select('#' + gObj.element.id + '_dialogEdit_wrapper', document);
         var dlgForm = isDlg ? dlgWrapper.querySelector('.e-gridform') : gObj.element.querySelector('.e-gridform');
         var data = { virtualData: {}, isAdd: false };
         this.parent.notify(getVirtualData, data);
@@ -30832,24 +30848,24 @@ var NormalEdit = /** @__PURE__ @class */ (function () {
     return NormalEdit;
 }());
 
-var __extends$24 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$24 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * `InlineEdit` module is used to handle inline editing actions.
  * @hidden
  */
-var InlineEdit = /** @__PURE__ @class */ (function (_super) {
+var InlineEdit = /** @class */ (function (_super) {
     __extends$24(InlineEdit, _super);
     function InlineEdit(parent, serviceLocator, renderer) {
         var _this = _super.call(this, parent, serviceLocator) || this;
@@ -30883,7 +30899,7 @@ var InlineEdit = /** @__PURE__ @class */ (function (_super) {
  * `BatchEdit` module is used to handle batch editing actions.
  * @hidden
  */
-var BatchEdit = /** @__PURE__ @class */ (function () {
+var BatchEdit = /** @class */ (function () {
     function BatchEdit(parent, serviceLocator, renderer) {
         this.cellDetails = {};
         this.originalCell = {};
@@ -31735,7 +31751,7 @@ var BatchEdit = /** @__PURE__ @class */ (function () {
             }
             _this.renderer.update(cellEditArgs);
             _this.parent.notify(batchEditFormRendered, cellEditArgs);
-            _this.form = gObj.element.querySelector('#' + gObj.element.id + 'EditForm');
+            _this.form = select('#' + gObj.element.id + 'EditForm', gObj.element);
             gObj.editModule.applyFormValidation([col]);
             _this.parent.element.querySelector('.e-gridpopup').style.display = 'none';
         });
@@ -32079,24 +32095,24 @@ var BatchEdit = /** @__PURE__ @class */ (function () {
     return BatchEdit;
 }());
 
-var __extends$25 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$25 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * `DialogEdit` module is used to handle dialog editing actions.
  * @hidden
  */
-var DialogEdit = /** @__PURE__ @class */ (function (_super) {
+var DialogEdit = /** @class */ (function (_super) {
     __extends$25(DialogEdit, _super);
     function DialogEdit(parent, serviceLocator, renderer) {
         var _this = 
@@ -32136,7 +32152,7 @@ var DialogEdit = /** @__PURE__ @class */ (function (_super) {
  * `DatePickerEditCell` is used to handle datepicker cell type editing.
  * @hidden
  */
-var DatePickerEditCell = /** @__PURE__ @class */ (function () {
+var DatePickerEditCell = /** @class */ (function () {
     function DatePickerEditCell(parent) {
         this.parent = parent;
     }
@@ -32191,7 +32207,7 @@ function dateanddatetimerender(args, mode, rtl) {
  * `TemplateEditCell` is used to handle template cell.
  * @hidden
  */
-var TemplateEditCell = /** @__PURE__ @class */ (function () {
+var TemplateEditCell = /** @class */ (function () {
     function TemplateEditCell(parent) {
         this.parent = parent;
     }
@@ -32210,7 +32226,7 @@ var TemplateEditCell = /** @__PURE__ @class */ (function () {
 /**
  * The `Edit` module is used to handle editing actions.
  */
-var Edit = /** @__PURE__ @class */ (function () {
+var Edit = /** @class */ (function () {
     /**
      * Constructor for the Grid editing module
      * @hidden
@@ -32898,7 +32914,7 @@ var Edit = /** @__PURE__ @class */ (function () {
         var frzCols = gObj.getFrozenColumns();
         var form = this.parent.editSettings.mode !== 'Dialog' ?
             gObj.element.querySelector('.e-gridform') :
-            document.querySelector('#' + gObj.element.id + '_dialogEdit_wrapper').querySelector('.e-gridform');
+            select('#' + gObj.element.id + '_dialogEdit_wrapper .e-gridform', document);
         var mForm = gObj.element.querySelectorAll('.e-gridform')[1];
         var rules = {};
         var mRules = {};
@@ -32970,7 +32986,7 @@ var Edit = /** @__PURE__ @class */ (function () {
                 > (parseInt(closest(inputElement, '.e-row').getAttribute('aria-rowindex'), 10) || 0));
         }
         return this.parent.editSettings.mode !== 'Dialog' ? isFHdr ? this.parent.getHeaderTable() : this.parent.getContentTable() :
-            document.querySelector('#' + this.parent.element.id + '_dialogEdit_wrapper');
+            select('#' + this.parent.element.id + '_dialogEdit_wrapper', document);
     };
     Edit.prototype.validationComplete = function (args) {
         if (this.parent.isEdit) {
@@ -33026,7 +33042,7 @@ var Edit = /** @__PURE__ @class */ (function () {
         }
         var table = isInline ?
             (isFHdr ? this.parent.getHeaderTable() : this.parent.getContentTable()) :
-            document.querySelector('#' + this.parent.element.id + '_dialogEdit_wrapper').querySelector('.e-dlg-content');
+            select('#' + this.parent.element.id + '_dialogEdit_wrapper .e-dlg-content', document);
         var client = table.getBoundingClientRect();
         var left = isInline ?
             this.parent.element.getBoundingClientRect().left : client.left;
@@ -33140,7 +33156,7 @@ var Edit = /** @__PURE__ @class */ (function () {
 /**
  * The `ColumnChooser` module is used to show or hide columns dynamically.
  */
-var ColumnChooser = /** @__PURE__ @class */ (function () {
+var ColumnChooser = /** @class */ (function () {
     /**
      * Constructor for the Grid ColumnChooser module
      * @hidden
@@ -33520,8 +33536,8 @@ var ColumnChooser = /** @__PURE__ @class */ (function () {
         this.clearActions();
         this.parent.notify(columnChooserCancelBtnClick, { dialog: this.dlgObj });
     };
-    ColumnChooser.prototype.checkstatecolumn = function (isChecked, coluid, selectAll) {
-        if (selectAll === void 0) { selectAll = false; }
+    ColumnChooser.prototype.checkstatecolumn = function (isChecked, coluid, selectAll$$1) {
+        if (selectAll$$1 === void 0) { selectAll$$1 = false; }
         if (isChecked) {
             if (this.hideColumn.indexOf(coluid) !== -1) {
                 this.hideColumn.splice(this.hideColumn.indexOf(coluid), 1);
@@ -33538,7 +33554,7 @@ var ColumnChooser = /** @__PURE__ @class */ (function () {
                 this.hideColumn.push(coluid);
             }
         }
-        if (selectAll) {
+        if (selectAll$$1) {
             if (!isChecked) {
                 this.changedColumns.push(coluid);
             }
@@ -33619,8 +33635,8 @@ var ColumnChooser = /** @__PURE__ @class */ (function () {
         var checkstate;
         var elem = parentsUntil(e.target, 'e-checkbox-wrapper');
         if (elem) {
-            var selectAll = elem.querySelector('.e-selectall');
-            if (selectAll) {
+            var selectAll$$1 = elem.querySelector('.e-selectall');
+            if (selectAll$$1) {
                 this.updateSelectAll(!elem.querySelector('.e-check'));
             }
             else {
@@ -33718,12 +33734,12 @@ var ColumnChooser = /** @__PURE__ @class */ (function () {
         this.ulElement = this.parent.createElement('ul', { className: 'e-ccul-ele e-cc' });
         var selectAllValue = this.l10n.getConstant('SelectAll');
         var cclist = this.parent.createElement('li', { className: 'e-cclist e-cc e-cc-selectall' });
-        var selectAll = this.createCheckBox(selectAllValue, false, 'grid-selectAll');
+        var selectAll$$1 = this.createCheckBox(selectAllValue, false, 'grid-selectAll');
         if (gdCol.length) {
-            selectAll.querySelector('.e-checkbox-wrapper').firstElementChild.classList.add('e-selectall');
-            selectAll.querySelector('.e-frame').classList.add('e-selectall');
-            this.checkState(selectAll.querySelector('.e-icons'), true);
-            cclist.appendChild(selectAll);
+            selectAll$$1.querySelector('.e-checkbox-wrapper').firstElementChild.classList.add('e-selectall');
+            selectAll$$1.querySelector('.e-frame').classList.add('e-selectall');
+            this.checkState(selectAll$$1.querySelector('.e-icons'), true);
+            cclist.appendChild(selectAll$$1);
             this.ulElement.appendChild(cclist);
         }
         for (var i = 0; i < gdCol.length; i++) {
@@ -33848,7 +33864,7 @@ var ColumnChooser = /** @__PURE__ @class */ (function () {
  * @hidden
  * `ExportHelper` for `PdfExport` & `ExcelExport`
  */
-var ExportHelper = /** @__PURE__ @class */ (function () {
+var ExportHelper = /** @class */ (function () {
     function ExportHelper(parent) {
         this.hideColumnInclude = false;
         this.foreignKeyData = {};
@@ -34102,7 +34118,7 @@ var ExportHelper = /** @__PURE__ @class */ (function () {
  * @hidden
  * `ExportValueFormatter` for `PdfExport` & `ExcelExport`
  */
-var ExportValueFormatter = /** @__PURE__ @class */ (function () {
+var ExportValueFormatter = /** @class */ (function () {
     function ExportValueFormatter(culture) {
         this.valueFormatter = new ValueFormatter(culture);
         this.internationalization = new Internationalization(culture);
@@ -34183,7 +34199,7 @@ var ExportValueFormatter = /** @__PURE__ @class */ (function () {
  * @hidden
  * `ExcelExport` module is used to handle the Excel export action.
  */
-var ExcelExport = /** @__PURE__ @class */ (function () {
+var ExcelExport = /** @class */ (function () {
     /**
      * Constructor for the Grid Excel Export module.
      * @hidden
@@ -35141,7 +35157,7 @@ var ExcelExport = /** @__PURE__ @class */ (function () {
  * `PDF Export` module is used to handle the exportToPDF action.
  * @hidden
  */
-var PdfExport = /** @__PURE__ @class */ (function () {
+var PdfExport = /** @class */ (function () {
     /**
      * Constructor for the Grid PDF Export module
      * @hidden
@@ -36491,24 +36507,24 @@ var PdfExport = /** @__PURE__ @class */ (function () {
     return PdfExport;
 }());
 
-var __extends$26 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$26 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * `CommandColumn` used to render command column in grid
  * @hidden
  */
-var CommandColumnRenderer = /** @__PURE__ @class */ (function (_super) {
+var CommandColumnRenderer = /** @class */ (function (_super) {
     __extends$26(CommandColumnRenderer, _super);
     function CommandColumnRenderer(parent, locator) {
         var _this = _super.call(this, parent, locator) || this;
@@ -36591,7 +36607,7 @@ var CommandColumnRenderer = /** @__PURE__ @class */ (function (_super) {
  * `CommandColumn` used to handle the command column actions.
  * @hidden
  */
-var CommandColumn = /** @__PURE__ @class */ (function () {
+var CommandColumn = /** @class */ (function () {
     function CommandColumn(parent, locator) {
         this.parent = parent;
         this.locator = locator;
@@ -36751,7 +36767,7 @@ var menuClass = {
 /**
  * The `ContextMenu` module is used to handle context menu actions.
  */
-var ContextMenu$1 = /** @__PURE__ @class */ (function () {
+var ContextMenu$1 = /** @class */ (function () {
     function ContextMenu$$1(parent, serviceLocator) {
         this.defaultItems = {};
         this.disableItems = [];
@@ -37324,7 +37340,7 @@ var ContextMenu$1 = /** @__PURE__ @class */ (function () {
  * FreezeRowModelGenerator is used to generate grid data rows with freeze row and column.
  * @hidden
  */
-var FreezeRowModelGenerator = /** @__PURE__ @class */ (function () {
+var FreezeRowModelGenerator = /** @class */ (function () {
     function FreezeRowModelGenerator(parent) {
         this.isFrzLoad = 1;
         this.parent = parent;
@@ -37357,24 +37373,24 @@ var FreezeRowModelGenerator = /** @__PURE__ @class */ (function () {
     return FreezeRowModelGenerator;
 }());
 
-var __extends$27 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$27 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * Freeze module is used to render grid content with frozen rows and columns
  * @hidden
  */
-var FreezeContentRender = /** @__PURE__ @class */ (function (_super) {
+var FreezeContentRender = /** @class */ (function (_super) {
     __extends$27(FreezeContentRender, _super);
     function FreezeContentRender(parent, locator) {
         return _super.call(this, parent, locator) || this;
@@ -37446,7 +37462,7 @@ var FreezeContentRender = /** @__PURE__ @class */ (function (_super) {
     };
     return FreezeContentRender;
 }(ContentRender));
-var FreezeRender = /** @__PURE__ @class */ (function (_super) {
+var FreezeRender = /** @class */ (function (_super) {
     __extends$27(FreezeRender, _super);
     function FreezeRender(parent, locator) {
         var _this = _super.call(this, parent, locator) || this;
@@ -37762,24 +37778,24 @@ var FreezeRender = /** @__PURE__ @class */ (function (_super) {
     return FreezeRender;
 }(HeaderRender));
 
-var __extends$28 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$28 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * VirtualFreezeRenderer is used to render the virtual table within the frozen table
  * @hidden
  */
-var VirtualFreezeRenderer = /** @__PURE__ @class */ (function (_super) {
+var VirtualFreezeRenderer = /** @class */ (function (_super) {
     __extends$28(VirtualFreezeRenderer, _super);
     function VirtualFreezeRenderer(parent, locator) {
         var _this = _super.call(this, parent, locator) || this;
@@ -37931,7 +37947,7 @@ var VirtualFreezeRenderer = /** @__PURE__ @class */ (function (_super) {
     };
     return VirtualFreezeRenderer;
 }(FreezeContentRender));
-var VirtualFreezeHdrRenderer = /** @__PURE__ @class */ (function (_super) {
+var VirtualFreezeHdrRenderer = /** @class */ (function (_super) {
     __extends$28(VirtualFreezeHdrRenderer, _super);
     function VirtualFreezeHdrRenderer(parent, locator) {
         var _this = _super.call(this, parent, locator) || this;
@@ -37979,7 +37995,7 @@ var VirtualFreezeHdrRenderer = /** @__PURE__ @class */ (function (_super) {
  * `Freeze` module is used to handle Frozen rows and columns.
  * @hidden
  */
-var Freeze = /** @__PURE__ @class */ (function () {
+var Freeze = /** @class */ (function () {
     function Freeze(parent, locator) {
         this.parent = parent;
         this.locator = locator;
@@ -38022,7 +38038,7 @@ var Freeze = /** @__PURE__ @class */ (function () {
  * 'column menu module used to handle column menu actions'
  * @hidden
  */
-var ColumnMenu = /** @__PURE__ @class */ (function () {
+var ColumnMenu = /** @class */ (function () {
     function ColumnMenu(parent, serviceLocator) {
         this.defaultItems = {};
         this.localeText = this.setLocaleKey();
@@ -38584,23 +38600,23 @@ var ColumnMenu = /** @__PURE__ @class */ (function () {
     return ColumnMenu;
 }());
 
-var __extends$29 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$29 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * `ForeignKey` module is used to handle foreign key column's actions.
  */
-var ForeignKey = /** @__PURE__ @class */ (function (_super) {
+var ForeignKey = /** @class */ (function (_super) {
     __extends$29(ForeignKey, _super);
     function ForeignKey(parent, serviceLocator) {
         var _this = _super.call(this, parent, serviceLocator) || this;
@@ -38778,7 +38794,7 @@ var DOC_URL = 'https://ej2.syncfusion.com/documentation/';
 var WARNING = '[EJ2Grid.Warning]';
 var ERROR = '[EJ2Grid.Error]';
 var INFO = '[EJ2Grid.Info]';
-var Logger = /** @__PURE__ @class */ (function () {
+var Logger = /** @class */ (function () {
     function Logger(parent) {
         this.parent = parent;
         this.parent.on('initial-end', this.patchadaptor, this);
@@ -39174,7 +39190,7 @@ var ajaxErrorHandler = function (args, parent) {
  * Infinite Scrolling class
  * @hidden
  */
-var InfiniteScroll = /** @__PURE__ @class */ (function () {
+var InfiniteScroll = /** @class */ (function () {
     /**
      * Constructor for the Grid infinite scrolling.
      * @hidden
@@ -40054,24 +40070,24 @@ var InfiniteScroll = /** @__PURE__ @class */ (function () {
     return InfiniteScroll;
 }());
 
-var __extends$30 = (undefined && undefined.__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 __());
-    };
-})();
+var __extends$30 = (undefined && undefined.__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 __());
+    };
+})();
 /**
  * GroupLazyLoadRenderer is used to perform lazy load grouping
  * @hidden
  */
-var GroupLazyLoadRenderer = /** @__PURE__ @class */ (function (_super) {
+var GroupLazyLoadRenderer = /** @class */ (function (_super) {
     __extends$30(GroupLazyLoadRenderer, _super);
     function GroupLazyLoadRenderer(parent, locator) {
         var _this = _super.call(this, parent, locator) || this;
@@ -41200,7 +41216,7 @@ var GroupLazyLoadRenderer = /** @__PURE__ @class */ (function (_super) {
 /**
  * Group lazy load class
  */
-var LazyLoadGroup = /** @__PURE__ @class */ (function () {
+var LazyLoadGroup = /** @class */ (function () {
     /**
      * Constructor for Grid group lazy load module
      * @hidden
@@ -41265,7 +41281,7 @@ var LazyLoadGroup = /** @__PURE__ @class */ (function () {
  * `AutoCompleteEditCell` is used to handle autocomplete cell type editing.
  * @hidden
  */
-var AutoCompleteEditCell = /** @__PURE__ @class */ (function () {
+var AutoCompleteEditCell = /** @class */ (function () {
     function AutoCompleteEditCell(parent) {
         //constructor
         this.parentObj = parent;
@@ -41322,7 +41338,7 @@ var AutoCompleteEditCell = /** @__PURE__ @class */ (function () {
  * `ComboBoxEditCell` is used to handle ComboBoxEdit cell type editing.
  * @hidden
  */
-var ComboboxEditCell = /** @__PURE__ @class */ (function () {
+var ComboboxEditCell = /** @class */ (function () {
     function ComboboxEditCell(parentObject) {
         //constructor
         this.parent = parentObject;
@@ -41374,7 +41390,7 @@ var ComboboxEditCell = /** @__PURE__ @class */ (function () {
  * `MultiSelectEditCell` is used to handle multiselect dropdown cell type editing.
  * @hidden
  */
-var MultiSelectEditCell = /** @__PURE__ @class */ (function () {
+var MultiSelectEditCell = /** @class */ (function () {
     function MultiSelectEditCell(parentObj) {
         //constructor
         this.parent = parentObj;
@@ -41417,7 +41433,7 @@ var MultiSelectEditCell = /** @__PURE__ @class */ (function () {
  * `TimePickerEditCell` is used to handle Timepicker cell type editing.
  * @hidden
  */
-var TimePickerEditCell = /** @__PURE__ @class */ (function () {
+var TimePickerEditCell = /** @class */ (function () {
     function TimePickerEditCell(grid) {
         this.parent = grid;
     }
@@ -41459,7 +41475,7 @@ var TimePickerEditCell = /** @__PURE__ @class */ (function () {
  * `ToggleEditCell` is used to handle boolean cell type editing.
  * @hidden
  */
-var ToggleEditCell = /** @__PURE__ @class */ (function () {
+var ToggleEditCell = /** @class */ (function () {
     function ToggleEditCell(parentObject) {
         this.activeClasses = ['e-selectionbackground', 'e-active'];
         this.parent = parentObject;
@@ -41534,7 +41550,7 @@ var ToggleEditCell = /** @__PURE__ @class */ (function () {
  * `MaskedTextBoxCellEdit` is used to handle masked input cell type editing.
  * @hidden
  */
-var MaskedTextBoxCellEdit = /** @__PURE__ @class */ (function () {
+var MaskedTextBoxCellEdit = /** @class */ (function () {
     function MaskedTextBoxCellEdit(parentInstance) {
         //constructor
         this.parent = parentInstance;