igniteui-angular-data-grids 20.1.0-beta.0 → 20.2.0-beta.0

package/esm5/lib/GridCellBase.js

@@ -30,45 +30,46 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         _this.a = null;
         _this.e = null;
         _this.c = null;
-        _this.ai = null;
-        _this.al = null;
+        _this.ak = null;
+        _this.an = null;
         _this.w = false;
-        _this.am = null;
+        _this.ao = null;
         _this.j = null;
+        _this.a2 = 0;
+        _this.az = 24;
+        _this.a1 = 0;
         _this.a0 = 0;
-        _this.ax = 24;
-        _this.az = 0;
-        _this.ay = 0;
-        _this.a3 = 0;
+        _this.a5 = 0;
         _this.t = false;
         _this.u = false;
         _this.v = true;
-        _this.ao = null;
-        _this.bn = null;
-        _this.dl = null;
+        _this.aq = null;
+        _this.bp = null;
+        _this.dp = null;
         _this.m = null;
         _this.x = false;
-        _this.bm = null;
-        _this.bl = null;
-        _this.dk = null;
-        _this.dj = null;
-        _this.dq = Rect.empty;
-        _this.aj = null;
-        _this.an = null;
+        _this.bo = null;
+        _this.bn = null;
+        _this.dn = null;
+        _this.dm = null;
+        _this.dt = Rect.empty;
+        _this.al = null;
+        _this.ap = null;
         _this.l = null;
+        _this.ai = 5;
         _this.r = false;
-        _this.a5 = 0;
         _this.a7 = 0;
+        _this.a9 = 0;
+        _this.a8 = 0;
         _this.a6 = 0;
-        _this.a4 = 0;
-        _this.as = 0;
         _this.au = 0;
+        _this.aw = 0;
+        _this.av = 0;
         _this.at = 0;
-        _this.ar = 0;
-        _this.di = null;
-        _this.a1 = 0;
-        _this.ba = 0;
-        _this.a2 = 0;
+        _this.dl = null;
+        _this.a3 = 0;
+        _this.bc = 0;
+        _this.a4 = 0;
         _this.k = null;
         _this.g = 0;
         _this.i = 0;
@@ -76,37 +77,37 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         _this.ag = 0;
         _this.h = 1;
         _this.y = false;
-        _this.bj = 0;
-        _this.bk = 0;
-        _this.aq = 0;
-        _this.a9 = -1;
-        _this.av = 0;
+        _this.bl = 0;
+        _this.bm = 0;
+        _this.as = 0;
+        _this.bb = -1;
+        _this.ax = 0;
         _this.s = false;
-        _this.ai = a;
-        _this.al = _this.ai.createElement("div");
-        _this.al.setAttribute("tabindex", "-1");
-        _this.al.setRawStyleProperty("position", "absolute");
-        _this.al.setRawStyleProperty("overflow", "hidden");
-        _this.al.setRawStyleProperty("box-sizing", "border-box");
-        _this.al.setRawStyleProperty("outline", "none");
+        _this.ak = a;
+        _this.an = _this.ak.createElement("div");
+        _this.an.setAttribute("tabindex", "-1");
+        _this.an.setRawStyleProperty("position", "absolute");
+        _this.an.setRawStyleProperty("overflow", "hidden");
+        _this.an.setRawStyleProperty("box-sizing", "border-box");
+        _this.an.setRawStyleProperty("outline", "none");
         var b = (window.navigator.msPointerEnabled && window.MSGesture !== undefined);
         var c = (window.PointerEvent !== undefined);
         var d = (window.TouchEvent);
         if ((b || c)) {
-            _this.al.listen("pointerdown", runOn(_this, _this.cm));
-            _this.al.listen("pointerup", runOn(_this, _this.cq));
-            _this.al.listen("pointermove", runOn(_this, _this.cp));
-            _this.al.listen("pointerleave", runOn(_this, _this.co));
-            _this.al.listen("pointerenter", runOn(_this, _this.cn));
+            _this.an.listen("pointerdown", runOn(_this, _this.cp));
+            _this.an.listen("pointerup", runOn(_this, _this.ct));
+            _this.an.listen("pointermove", runOn(_this, _this.cs));
+            _this.an.listen("pointerleave", runOn(_this, _this.cr));
+            _this.an.listen("pointerenter", runOn(_this, _this.cq));
         }
         else {
-            _this.al.listen("mousedown", runOn(_this, _this.b8));
-            _this.al.listen("mouseup", runOn(_this, _this.cc));
-            _this.al.listen("mousemove", runOn(_this, _this.cb));
-            _this.al.listen("mouseleave", runOn(_this, _this.ca));
-            _this.al.listen("touchstart", runOn(_this, _this.da));
-            _this.al.listen("touchend", runOn(_this, _this.dc));
-            _this.al.listen("touchmove", runOn(_this, _this.db));
+            _this.an.listen("mousedown", runOn(_this, _this.cb));
+            _this.an.listen("mouseup", runOn(_this, _this.cf));
+            _this.an.listen("mousemove", runOn(_this, _this.ce));
+            _this.an.listen("mouseleave", runOn(_this, _this.cd));
+            _this.an.listen("touchstart", runOn(_this, _this.dd));
+            _this.an.listen("touchend", runOn(_this, _this.df));
+            _this.an.listen("touchmove", runOn(_this, _this.de));
         }
         return _this;
     }
@@ -131,16 +132,16 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "ak", {
+    Object.defineProperty(GridCellBase.prototype, "am", {
         get: function () {
-            return this.ai;
+            return this.ak;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "ap", {
+    Object.defineProperty(GridCellBase.prototype, "ar", {
         get: function () {
-            return this.al;
+            return this.an;
         },
         enumerable: false,
         configurable: true
@@ -153,42 +154,42 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             var b = this.w;
             this.w = a;
             if (b != this.w) {
-                this.ch("IsRemoved", b, this.w);
+                this.ck("IsRemoved", b, this.w);
             }
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "bd", {
+    Object.defineProperty(GridCellBase.prototype, "bf", {
         get: function () {
-            return this.a0;
+            return this.a2;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "bb", {
+    Object.defineProperty(GridCellBase.prototype, "bd", {
         get: function () {
-            return this.ay;
+            return this.a0;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "bc", {
+    Object.defineProperty(GridCellBase.prototype, "be", {
         get: function () {
-            return this.az;
+            return this.a1;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "bg", {
+    Object.defineProperty(GridCellBase.prototype, "bi", {
         get: function () {
-            return this.a3;
+            return this.a5;
         },
         set: function (a) {
-            var b = this.a3;
-            this.a3 = a;
-            if (b != this.a3) {
-                this.ch("Indent", b, this.a3);
+            var b = this.a5;
+            this.a5 = a;
+            if (b != this.a5) {
+                this.ck("Indent", b, this.a5);
             }
         },
         enumerable: false,
@@ -202,7 +203,7 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             var b = this.t;
             this.t = a;
             if (b != this.t) {
-                this.ch("IsCollapsable", b, this.t);
+                this.ck("IsCollapsable", b, this.t);
             }
         },
         enumerable: false,
@@ -216,7 +217,7 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             var b = this.u;
             this.u = a;
             if (b != this.u) {
-                this.ch("IsExpanded", b, this.u);
+                this.ck("IsExpanded", b, this.u);
             }
         },
         enumerable: false,
@@ -230,35 +231,35 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             var b = this.v;
             this.v = a;
             if (b != this.v) {
-                this.ch("IsHitTestVisible", b, this.v);
+                this.ck("IsHitTestVisible", b, this.v);
             }
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "b0", {
+    Object.defineProperty(GridCellBase.prototype, "b3", {
         get: function () {
-            return this.bn;
+            return this.bp;
         },
         set: function (a) {
-            var b = this.bn;
-            this.bn = a;
-            if (b != this.bn) {
-                this.ch("SuffixText", b, this.bn);
+            var b = this.bp;
+            this.bp = a;
+            if (b != this.bp) {
+                this.ck("SuffixText", b, this.bp);
             }
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "dp", {
+    Object.defineProperty(GridCellBase.prototype, "ds", {
         get: function () {
-            return this.dl;
+            return this.dp;
         },
         set: function (a) {
-            var b = this.dl;
-            this.dl = a;
-            if (b != this.dl) {
-                this.ch("SuffixTextColor", b, this.dl);
+            var b = this.dp;
+            this.dp = a;
+            if (b != this.dp) {
+                this.ck("SuffixTextColor", b, this.dp);
             }
         },
         enumerable: false,
@@ -272,165 +273,165 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             var b = this.m;
             this.m = a;
             if (b != this.m) {
-                this.ch("SuffixTextFont", b, this.m);
+                this.ck("SuffixTextFont", b, this.m);
             }
         },
         enumerable: false,
         configurable: true
     });
-    GridCellBase.prototype.ci = function () {
-        if (this.bn != null) {
-            if (this.ao == null) {
-                this.ao = this.ai.createElement("span");
-                this.ao.setRawStyleProperty("display", "inline-block");
-                this.ao.setRawStyleProperty("overflow", "hidden");
-                this.ao.setRawStyleProperty("white-space", "nowrap");
-                this.ao.setRawStyleProperty("margin-left", "5px");
+    GridCellBase.prototype.cl = function () {
+        if (this.bp != null) {
+            if (this.aq == null) {
+                this.aq = this.ak.createElement("span");
+                this.aq.setRawStyleProperty("display", "inline-block");
+                this.aq.setRawStyleProperty("overflow", "hidden");
+                this.aq.setRawStyleProperty("white-space", "nowrap");
+                this.aq.setRawStyleProperty("margin-left", this.aj + "px");
             }
-            this.ck();
+            this.cn();
             if (!this.x) {
-                this.ap.setRawStyleProperty("display", "grid");
-                this.ap.setRawStyleProperty("grid-template-columns", "1fr min-content");
-                this.ap.append(this.ao);
+                this.ar.setRawStyleProperty("display", "grid");
+                this.ar.setRawStyleProperty("grid-template-columns", "1fr min-content");
+                this.ar.append(this.aq);
                 this.x = true;
             }
         }
         else {
             if (this.x) {
-                this.ap.setRawStyleProperty("display", "unset");
-                this.ap.setRawStyleProperty("grid-template-columns", "unset");
-                this.ap.removeChild(this.ao);
+                this.ar.setRawStyleProperty("display", "unset");
+                this.ar.setRawStyleProperty("grid-template-columns", "unset");
+                this.ar.removeChild(this.aq);
                 this.x = false;
             }
         }
     };
-    Object.defineProperty(GridCellBase.prototype, "bw", {
+    Object.defineProperty(GridCellBase.prototype, "by", {
         get: function () {
-            return this.bm;
+            return this.bo;
         },
         set: function (a) {
-            var b = this.bm;
-            this.bm = a;
-            if (b != this.bm) {
-                this.ch("SuffixIconName", b, this.bm);
+            var b = this.bo;
+            this.bo = a;
+            if (b != this.bo) {
+                this.ck("SuffixIconName", b, this.bo);
             }
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "bt", {
+    Object.defineProperty(GridCellBase.prototype, "bv", {
         get: function () {
-            return this.bl;
+            return this.bn;
         },
         set: function (a) {
-            var b = this.bl;
-            this.bl = a;
-            if (b != this.bl) {
-                this.ch("SuffixIconCollectionName", b, this.bl);
+            var b = this.bn;
+            this.bn = a;
+            if (b != this.bn) {
+                this.ck("SuffixIconCollectionName", b, this.bn);
             }
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "dn", {
+    Object.defineProperty(GridCellBase.prototype, "dr", {
         get: function () {
-            return this.dk;
+            return this.dn;
         },
         set: function (a) {
-            var b = this.dk;
-            this.dk = a;
-            if (b != this.dk) {
-                this.ch("SuffixIconStroke", b, this.dk);
+            var b = this.dn;
+            this.dn = a;
+            if (b != this.dn) {
+                this.ck("SuffixIconStroke", b, this.dn);
             }
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "dm", {
+    Object.defineProperty(GridCellBase.prototype, "dq", {
         get: function () {
-            return this.dj;
+            return this.dm;
         },
         set: function (a) {
-            var b = this.dj;
-            this.dj = a;
-            if (b != this.dj) {
-                this.ch("SuffixIconFill", b, this.dj);
+            var b = this.dm;
+            this.dm = a;
+            if (b != this.dm) {
+                this.ck("SuffixIconFill", b, this.dm);
             }
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "dr", {
+    Object.defineProperty(GridCellBase.prototype, "du", {
         get: function () {
-            return this.dq;
+            return this.dt;
         },
         set: function (a) {
-            var b = this.dq;
-            this.dq = a;
-            if (Rect.l_op_Inequality(b, this.dq)) {
-                this.ch("SuffixIconViewBox", b, this.dq);
+            var b = this.dt;
+            this.dt = a;
+            if (Rect.l_op_Inequality(b, this.dt)) {
+                this.ck("SuffixIconViewBox", b, this.dt);
             }
         },
         enumerable: false,
         configurable: true
     });
-    GridCellBase.prototype.cj = function () {
-        if (this.bm != null && this.bl != null) {
+    GridCellBase.prototype.cm = function () {
+        if (this.bo != null && this.bn != null) {
             if (this.l == null) {
-                this.an = this.ai.createElement("div");
-                this.aj = this.ai.getSubRenderer(this.an);
+                this.ap = this.ak.createElement("div");
+                this.al = this.ak.getSubRenderer(this.ap);
                 this.l = new XIcon();
-                this.l.provideContainer(this.aj);
-                this.an.setRawStyleProperty("display", "inline-block");
-                this.an.setRawStyleProperty("overflow", "hidden");
-                this.an.setRawStyleProperty("margin-left", "5px");
+                this.l.provideContainer(this.al);
+                this.ap.setRawStyleProperty("display", "inline-block");
+                this.ap.setRawStyleProperty("overflow", "hidden");
+                this.ap.setRawStyleProperty("margin-left", this.aj + "px");
             }
-            this.ck();
+            this.cn();
             if (!this.x) {
-                this.ap.setRawStyleProperty("display", "grid");
-                this.ap.setRawStyleProperty("grid-template-columns", "1fr min-content");
-                this.ap.append(this.an);
+                this.ar.setRawStyleProperty("display", "grid");
+                this.ar.setRawStyleProperty("grid-template-columns", "1fr min-content");
+                this.ar.append(this.ap);
                 this.x = true;
             }
         }
         else {
             if (this.x) {
-                this.ap.setRawStyleProperty("display", "unset");
-                this.ap.setRawStyleProperty("grid-template-columns", "unset");
-                this.ap.removeChild(this.an);
+                this.ar.setRawStyleProperty("display", "unset");
+                this.ar.setRawStyleProperty("grid-template-columns", "unset");
+                this.ar.removeChild(this.ap);
                 this.x = false;
             }
         }
     };
-    GridCellBase.prototype.ck = function () {
-        if (this.ao != null) {
-            this.c5(this.ao, this.bn);
-            this.c6(this.ao, this.dp);
-            this.cx(this.ao, this.n);
-            this.c7(this.ao, this.h);
+    GridCellBase.prototype.cn = function () {
+        if (this.aq != null) {
+            this.c8(this.aq, this.bp);
+            this.c9(this.aq, this.ds);
+            this.c0(this.aq, this.n);
+            this.da(this.aq, this.h);
         }
         if (this.l != null) {
-            this.l.ea = this.dn;
-            this.l.fill = this.dm;
-            if (!this.dr.isEmpty && !isNaN_(this.dr.left) && !isNaN_(this.dr.top) && !isNaN_(this.dr.width) && !isNaN_(this.dr.height)) {
-                this.l.a6 = this.dr.left;
-                this.l.a7 = this.dr.top;
-                this.l.a8 = this.dr.width;
-                this.l.a5 = this.dr.height;
+            this.l.ea = this.dr;
+            this.l.fill = this.dq;
+            if (!this.du.isEmpty && !isNaN_(this.du.left) && !isNaN_(this.du.top) && !isNaN_(this.du.width) && !isNaN_(this.du.height)) {
+                this.l.a6 = this.du.left;
+                this.l.a7 = this.du.top;
+                this.l.a8 = this.du.width;
+                this.l.a5 = this.du.height;
             }
-            this.c4(this.an, this.dn);
-            this.cw(this.an, this.dm);
-            this.c7(this.an, this.h);
-            this.c0(this.l, this.bt, this.bw);
+            this.c7(this.ap, this.dr);
+            this.cz(this.ap, this.dq);
+            this.da(this.ap, this.h);
+            this.c3(this.l, this.bv, this.by);
         }
     };
-    GridCellBase.prototype.c0 = function (a, b, c) {
+    GridCellBase.prototype.c3 = function (a, b, c) {
         a.svg = null;
         a.svgPath = null;
         a.b = null;
         a.b0 = null;
         a.bh = null;
-        var d = SvgIconRegistry.instance.getSvgPathString(this.bl, this.bm);
+        var d = SvgIconRegistry.instance.getSvgPathString(this.bn, this.bo);
         if (d != null) {
             if (stringStartsWith(d, "<svg")) {
                 a.svg = d;
@@ -440,52 +441,66 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             }
             return;
         }
-        var e = SvgIconRegistry.instance.getSvgPathsString(this.bl, this.bm);
+        var e = SvgIconRegistry.instance.getSvgPathsString(this.bn, this.bo);
         if (e != null) {
             a.b = e;
             return;
         }
-        var f = SvgIconRegistry.instance.getDataURLString(this.bl, this.bm);
+        var f = SvgIconRegistry.instance.getDataURLString(this.bn, this.bo);
         if (f != null) {
             a.b0 = f;
             return;
         }
-        var g = SvgIconRegistry.instance.getIconSource(this.bl, this.bm);
+        var g = SvgIconRegistry.instance.getIconSource(this.bn, this.bo);
         if (g != null) {
             a.bh = g;
         }
     };
-    GridCellBase.prototype.b7 = function () {
-        this.az = 10;
-        this.ay = this.bg * 24;
-        this.a0 = 24;
-        if (this.am == null) {
-            this.am = this.ai.createElement("div");
-            this.am.setRawStyleProperty("display", "inline-block");
-            this.am.setRawStyleProperty("vertical-align", "middle");
-            this.am.setRawStyleProperty("width", this.a0 + "px");
-            this.am.setRawStyleProperty("height", this.a0 + "px");
-            this.am.setRawStyleProperty("cursor", "pointer");
-            this.am.setRawStyleProperty("position", "absolute");
-            this.am.setRawXPosition(this.a5 + this.ay);
-            this.am.setRawYPosition(intDivide(this.a1, 2) - intDivide(this.ax, 2));
+    Object.defineProperty(GridCellBase.prototype, "aj", {
+        get: function () {
+            return this.ai;
+        },
+        set: function (a) {
+            var b = this.ai;
+            this.ai = a;
+            if (b != this.ai) {
+                this.ck("SuffixMargin", b, this.ai);
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    GridCellBase.prototype.ca = function () {
+        this.a1 = 10;
+        this.a0 = this.bi * 24;
+        this.a2 = 24;
+        if (this.ao == null) {
+            this.ao = this.ak.createElement("div");
+            this.ao.setRawStyleProperty("display", "inline-block");
+            this.ao.setRawStyleProperty("vertical-align", "middle");
+            this.ao.setRawStyleProperty("width", this.a2 + "px");
+            this.ao.setRawStyleProperty("height", this.a2 + "px");
+            this.ao.setRawStyleProperty("cursor", "pointer");
+            this.ao.setRawStyleProperty("position", "absolute");
+            this.ao.setRawXPosition(this.a7 + this.a0);
+            this.ao.setRawYPosition(intDivide(this.a3, 2) - intDivide(this.az, 2));
         }
         if (this.j == null) {
-            var a = this.ai.getSubRenderer(this.am);
+            var a = this.ak.getSubRenderer(this.ao);
             this.j = new GridExpansionIndicator();
             this.j.ab(a);
             this.j.y(24, 24);
         }
-        if (this.am.parent() == null) {
-            this.al.append(this.am);
+        if (this.ao.parent() == null) {
+            this.an.append(this.ao);
         }
     };
-    GridCellBase.prototype.cr = function () {
-        this.a0 = 0;
-        this.az = 0;
-        if (this.am != null) {
-            if (this.am.parent() != null) {
-                this.am.remove();
+    GridCellBase.prototype.cu = function () {
+        this.a2 = 0;
+        this.a1 = 0;
+        if (this.ao != null) {
+            if (this.ao.parent() != null) {
+                this.ao.remove();
             }
         }
     };
@@ -509,32 +524,32 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    GridCellBase.prototype.c3 = function (a, b, c, d) {
-        this.a5 = a;
-        this.a7 = b;
-        this.a6 = c;
-        this.a4 = d;
-        this.al.setRawStyleProperty("padding-left", a.toString() + "px");
-        this.al.setRawStyleProperty("padding-top", b.toString() + "px");
-        this.al.setRawStyleProperty("padding-right", c.toString() + "px");
-        this.al.setRawStyleProperty("padding-bottom", d.toString() + "px");
+    GridCellBase.prototype.c6 = function (a, b, c, d) {
+        this.a7 = a;
+        this.a9 = b;
+        this.a8 = c;
+        this.a6 = d;
+        this.an.setRawStyleProperty("padding-left", a.toString() + "px");
+        this.an.setRawStyleProperty("padding-top", b.toString() + "px");
+        this.an.setRawStyleProperty("padding-right", c.toString() + "px");
+        this.an.setRawStyleProperty("padding-bottom", d.toString() + "px");
     };
-    GridCellBase.prototype.cu = function (a, b, c, d, e) {
-        this.as = b;
-        this.au = c;
-        this.at = d;
-        this.ar = e;
-        this.di = a;
+    GridCellBase.prototype.cx = function (a, b, c, d, e) {
+        this.au = b;
+        this.aw = c;
+        this.av = d;
+        this.at = e;
+        this.dl = a;
         if (a == null) {
-            this.al.setRawStyleProperty("border", "");
+            this.an.setRawStyleProperty("border", "");
         }
         else {
-            this.al.setRawStyleProperty("border-color", a._fill);
-            this.al.setRawStyleProperty("border-left-width", b.toString() + "px");
-            this.al.setRawStyleProperty("border-top-width", c.toString() + "px");
-            this.al.setRawStyleProperty("border-right-width", d.toString() + "px");
-            this.al.setRawStyleProperty("border-bottom-width", e.toString() + "px");
-            this.al.setRawStyleProperty("border-style", "solid");
+            this.an.setRawStyleProperty("border-color", a._fill);
+            this.an.setRawStyleProperty("border-left-width", b.toString() + "px");
+            this.an.setRawStyleProperty("border-top-width", c.toString() + "px");
+            this.an.setRawStyleProperty("border-right-width", d.toString() + "px");
+            this.an.setRawStyleProperty("border-bottom-width", e.toString() + "px");
+            this.an.setRawStyleProperty("border-style", "solid");
         }
     };
     GridCellBase.prototype.get_ac = function () {
@@ -547,96 +562,96 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "be", {
+    Object.defineProperty(GridCellBase.prototype, "bg", {
         get: function () {
-            return this.a1;
+            return this.a3;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "bh", {
+    Object.defineProperty(GridCellBase.prototype, "bj", {
         get: function () {
-            return this.ba;
+            return this.bc;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(GridCellBase.prototype, "bf", {
+    Object.defineProperty(GridCellBase.prototype, "bh", {
         get: function () {
-            return this.a2;
+            return this.a4;
         },
         enumerable: false,
         configurable: true
     });
-    GridCellBase.prototype.cy = function (a, b) {
-        if (this.a1 != a || this.a2 != b) {
-            var c = this.a1;
-            this.a1 = a;
-            this.a2 = b;
-            var d = Math.max(0, this.a1 - this.a2);
-            this.al.setRawStyleProperty("height", a.toString() + "px");
-            if (this.am != null) {
-                this.am.setRawYPosition(intDivide(this.a1, 2) - intDivide(this.a0, 2));
+    GridCellBase.prototype.c1 = function (a, b) {
+        if (this.a3 != a || this.a4 != b) {
+            var c = this.a3;
+            this.a3 = a;
+            this.a4 = b;
+            var d = Math.max(0, this.a3 - this.a4);
+            this.an.setRawStyleProperty("height", a.toString() + "px");
+            if (this.ao != null) {
+                this.ao.setRawYPosition(intDivide(this.a3, 2) - intDivide(this.a2, 2));
             }
-            this.c9(this.ba, this.a1, this.ba, c);
+            this.dc(this.bc, this.a3, this.bc, c);
         }
     };
-    GridCellBase.prototype.c8 = function (a, b) {
-        if (this.ba != a) {
-            var c = this.ba;
-            this.ba = a;
-            this.al.setRawStyleProperty("width", a.toString() + "px");
-            this.c9(this.ba, this.a1, c, this.a1);
+    GridCellBase.prototype.db = function (a, b) {
+        if (this.bc != a) {
+            var c = this.bc;
+            this.bc = a;
+            this.an.setRawStyleProperty("width", a.toString() + "px");
+            this.dc(this.bc, this.a3, c, this.a3);
         }
     };
-    GridCellBase.prototype.c9 = function (a, b, c, d) {
+    GridCellBase.prototype.dc = function (a, b, c, d) {
     };
-    GridCellBase.prototype.b5 = function () {
+    GridCellBase.prototype.b8 = function () {
         if (!this.ae) {
             return;
         }
         this.r = true;
-        this.k = new PlaceholderView(this.ai);
+        this.k = new PlaceholderView(this.ak);
         this.g = 0;
         this.i = 1;
         this.k.l = Color.u(120, 120, 120, 120);
         this.k.i = 0;
-        this.al.append(this.k.g);
+        this.an.append(this.k.g);
     };
-    GridCellBase.prototype.ct = function (a) {
-        this.al.setRawStyleProperty("background-color", a.colorString);
+    GridCellBase.prototype.cw = function (a) {
+        this.an.setRawStyleProperty("background-color", a.colorString);
     };
-    GridCellBase.prototype.c2 = function (a) {
-        this.al.setRawStyleProperty("opacity", a.toString());
+    GridCellBase.prototype.c5 = function (a) {
+        this.an.setRawStyleProperty("opacity", a.toString());
     };
-    GridCellBase.prototype.cx = function (a, b) {
+    GridCellBase.prototype.c0 = function (a, b) {
         if (b == null) {
-            b = FontUtil.getDefaultFont(this.ak);
+            b = FontUtil.getDefaultFont(this.am);
         }
         a.setRawStyleProperty("font", b.fontString);
     };
-    GridCellBase.prototype.c6 = function (a, b) {
+    GridCellBase.prototype.c9 = function (a, b) {
         var c = Color.u(0, 0, 0, 0);
         if (b != null) {
             c = b.color;
         }
         a.setRawStyleProperty("color", c.colorString);
     };
-    GridCellBase.prototype.c4 = function (a, b) {
+    GridCellBase.prototype.c7 = function (a, b) {
         var c = Color.u(0, 0, 0, 0);
         if (b != null) {
             c = b.color;
         }
         a.setRawStyleProperty("stroke", c.colorString);
     };
-    GridCellBase.prototype.cw = function (a, b) {
+    GridCellBase.prototype.cz = function (a, b) {
         var c = Color.u(0, 0, 0, 0);
         if (b != null) {
             c = b.color;
         }
         a.setRawStyleProperty("fill", c.colorString);
     };
-    GridCellBase.prototype.c5 = function (a, b) {
+    GridCellBase.prototype.c8 = function (a, b) {
         if (a != null) {
             a.setRawText(b);
         }
@@ -645,19 +660,19 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         if (TestRandomness.instance.testRandomnessSource != null) {
             return TestRandomness.instance.testRandomnessSource;
         }
-        return new DefaultRandomnessSource(1, GridCellBase.bi);
+        return new DefaultRandomnessSource(1, GridCellBase.bk);
     };
     GridCellBase.prototype.p = function () {
         var a = this.q();
         return a.getGenerator("PlaceholderWidths");
     };
-    GridCellBase.prototype.dh = function (a) {
+    GridCellBase.prototype.dk = function (a) {
         if (!this.ae) {
             return;
         }
         this.k.i = (a * 0.20000000298023224);
     };
-    GridCellBase.prototype.df = function (a, b, c, d) {
+    GridCellBase.prototype.di = function (a, b, c, d) {
         if (this.k != null) {
             var e = this.ah;
             var f = this.ag;
@@ -677,15 +692,15 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             this.k.g.setRawYPosition(b);
         }
     };
-    GridCellBase.prototype.cf = function (a, b, c) {
+    GridCellBase.prototype.ci = function (a, b, c) {
     };
-    GridCellBase.prototype.cl = function (a) {
+    GridCellBase.prototype.co = function (a) {
         this.h = a;
-        if (this.ao != null) {
-            this.c7(this.ao, a);
+        if (this.aq != null) {
+            this.da(this.aq, a);
         }
     };
-    GridCellBase.prototype.dg = function (a) {
+    GridCellBase.prototype.dj = function (a) {
         if (!this.ae) {
             return;
         }
@@ -697,8 +712,8 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             this.ag = b;
             this.k.d = (b);
         }
-        var c = a.h2 * 0.2;
-        var d = a.f6 * 0.6;
+        var c = a.h5 * 0.2;
+        var d = a.f8 * 0.6;
         if (this.ah >= c && this.ah <= d && !this.y) {
             return;
         }
@@ -711,9 +726,9 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             this.ah = e;
             this.k.e = e;
         }
-        this.df(this.a5 + this.ay + this.a0, this.a7, this.ba - (this.a5 + this.a6), this.a1 - (this.a7 + this.a4));
+        this.di(this.a7 + this.a0 + this.a2, this.a9, this.bc - (this.a7 + this.a8), this.a3 - (this.a9 + this.a6));
     };
-    GridCellBase.prototype.dd = function (a, b) {
+    GridCellBase.prototype.dg = function (a, b) {
         if (!this.ae) {
             return;
         }
@@ -721,7 +736,7 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         this.i = b;
         this.y = true;
     };
-    GridCellBase.prototype.de = function (a) {
+    GridCellBase.prototype.dh = function (a) {
         if (!this.ae) {
             return;
         }
@@ -729,32 +744,32 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             this.k.l = a.color;
         }
     };
-    GridCellBase.prototype.cs = function (a) {
+    GridCellBase.prototype.cv = function (a) {
         this.a = a;
     };
-    GridCellBase.prototype.c1 = function (a) {
+    GridCellBase.prototype.c4 = function (a) {
         this.e = a;
     };
-    GridCellBase.prototype.cv = function (a) {
+    GridCellBase.prototype.cy = function (a) {
         this.c = a;
     };
-    GridCellBase.prototype.cz = function (a, b) {
+    GridCellBase.prototype.c2 = function (a, b) {
         switch (b) {
             case 0:
-                this.ap.setRawStyleProperty("text-align", "left");
+                this.ar.setRawStyleProperty("text-align", "left");
                 break;
             case 1:
-                this.ap.setRawStyleProperty("text-align", "center");
+                this.ar.setRawStyleProperty("text-align", "center");
                 break;
             case 2:
-                this.ap.setRawStyleProperty("text-align", "right");
+                this.ar.setRawStyleProperty("text-align", "right");
                 break;
             case 3:
-                this.ap.setRawStyleProperty("text-align", "center");
+                this.ar.setRawStyleProperty("text-align", "center");
                 break;
         }
     };
-    GridCellBase.prototype.c7 = function (a, b) {
+    GridCellBase.prototype.da = function (a, b) {
         switch (b) {
             case 0:
                 a.setRawStyleProperty("vertical-align", "top");
@@ -777,67 +792,67 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
     GridCellBase.prototype.af = function (a) {
         return a.isClickActionDesired;
     };
-    GridCellBase.prototype.b8 = function (a) {
+    GridCellBase.prototype.cb = function (a) {
         this.onContactStarted(a, false);
     };
-    GridCellBase.prototype.cc = function (a) {
+    GridCellBase.prototype.cf = function (a) {
         this.onContactCompleted(a, false);
     };
-    GridCellBase.prototype.cb = function (a) {
+    GridCellBase.prototype.ce = function (a) {
         this.onContactMoved(a, false);
     };
-    GridCellBase.prototype.ca = function (a) {
-        this.ce(a, false);
+    GridCellBase.prototype.cd = function (a) {
+        this.ch(a, false);
     };
-    GridCellBase.prototype.b9 = function (a) {
-        this.cd(a, false);
+    GridCellBase.prototype.cc = function (a) {
+        this.cg(a, false);
     };
-    GridCellBase.prototype.cm = function (e_) {
+    GridCellBase.prototype.cp = function (e_) {
         var a = (e_.originalEvent.pointerType);
         if (a == "touch") {
-            this.da(e_);
+            this.dd(e_);
         }
         else {
-            this.b8(e_);
+            this.cb(e_);
         }
     };
-    GridCellBase.prototype.cp = function (e_) {
+    GridCellBase.prototype.cs = function (e_) {
         var a = (e_.originalEvent.pointerType);
         if (a == "touch") {
-            this.db(e_);
+            this.de(e_);
         }
         else {
-            this.cb(e_);
+            this.ce(e_);
         }
     };
-    GridCellBase.prototype.cq = function (e_) {
+    GridCellBase.prototype.ct = function (e_) {
         var a = (e_.originalEvent.pointerType);
         if (a == "touch") {
-            this.dc(e_);
+            this.df(e_);
         }
         else {
-            this.cc(e_);
+            this.cf(e_);
         }
     };
-    GridCellBase.prototype.co = function (e_) {
+    GridCellBase.prototype.cr = function (e_) {
         var a = (e_.originalEvent.pointerType);
         if (a != "touch") {
-            this.ca(e_);
+            this.cd(e_);
         }
     };
-    GridCellBase.prototype.cn = function (e_) {
+    GridCellBase.prototype.cq = function (e_) {
         var a = (e_.originalEvent.pointerType);
         if (a != "touch") {
-            this.b9(e_);
+            this.cc(e_);
         }
     };
-    GridCellBase.prototype.da = function (a) {
+    GridCellBase.prototype.dd = function (a) {
         this.onContactStarted(a, true);
     };
-    GridCellBase.prototype.db = function (a) {
+    GridCellBase.prototype.de = function (a) {
         this.onContactMoved(a, true);
     };
-    GridCellBase.prototype.dc = function (a) {
+    GridCellBase.prototype.df = function (a) {
         this.onContactCompleted(a, true);
     };
     GridCellBase.prototype.onContactStarted = function (e_, a) {
@@ -852,13 +867,13 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         }
         else {
             if (this.a != null && this.af(this.a)) {
-                this.bj = e_.pageX;
-                this.bk = e_.pageY;
-                if (this.a9 != e_.which) {
-                    this.av = 0;
+                this.bl = e_.pageX;
+                this.bm = e_.pageY;
+                if (this.bb != e_.which) {
+                    this.ax = 0;
                 }
-                this.a9 = e_.which;
-                this.a.mouseDownCell(this.bj, this.bk);
+                this.bb = e_.which;
+                this.a.mouseDownCell(this.bl, this.bm);
             }
         }
     };
@@ -869,7 +884,7 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             if (this.af(this.a)) {
                 if (this.a.isMouseDown) {
                     if (b) {
-                        if (PointUtil.equals(this.a.mousePosition, null) || Math.abs(c - this.a.mousePosition.x) > GridCellBase.a8 || Math.abs(d - this.a.mousePosition.y) > GridCellBase.a8) {
+                        if (PointUtil.equals(this.a.mousePosition, null) || Math.abs(c - this.a.mousePosition.x) > GridCellBase.ba || Math.abs(d - this.a.mousePosition.y) > GridCellBase.ba) {
                             this.a.mouseUpCell(c, d);
                         }
                         else {
@@ -880,8 +895,8 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
                         if (PointUtil.equals(this.a.mousePosition, null)) {
                             this.a.mouseUpCell(c, d);
                         }
-                        else if (this.a9 == 1) {
-                            if (Math.abs(c - this.a.mousePosition.x) > GridCellBase.aw || Math.abs(d - this.a.mousePosition.y) > GridCellBase.aw) {
+                        else if (this.bb == 1) {
+                            if (Math.abs(c - this.a.mousePosition.x) > GridCellBase.ay || Math.abs(d - this.a.mousePosition.y) > GridCellBase.ay) {
                                 this.a.isControlPressed = a.ctrlKey;
                                 this.a.dragStarted();
                             }
@@ -896,8 +911,8 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
     };
     GridCellBase.prototype.onContactCompleted = function (e_, a) {
         var _this = this;
-        this.av++;
-        window.setTimeout(function () { return _this.av = 0; }, 250);
+        this.ax++;
+        window.setTimeout(function () { return _this.ax = 0; }, 250);
         var b = false;
         if (this.aa) {
             var indicator_ = this.j.q();
@@ -910,14 +925,14 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             if (this.a != null && this.af(this.a)) {
                 var c = e_.pageX;
                 var d = e_.pageY;
-                if (PointUtil.equals(this.a.mousePosition, null) || Math.abs(c - this.a.mousePosition.x) > GridCellBase.a8 || Math.abs(d - this.a.mousePosition.y) > GridCellBase.a8 || this.a.isDrag) {
+                if (PointUtil.equals(this.a.mousePosition, null) || Math.abs(c - this.a.mousePosition.x) > GridCellBase.ba || Math.abs(d - this.a.mousePosition.y) > GridCellBase.ba || this.a.isDrag) {
                     this.a.mouseUpCell(c, d);
                 }
                 if (this.a.isCellDown()) {
                     this.a.isControlPressed = e_.ctrlKey;
                     this.a.isShiftPressed = e_.shiftKey;
-                    if (this.av > 1) {
-                        switch (this.a9) {
+                    if (this.ax > 1) {
+                        switch (this.bb) {
                             case 1:
                                 this.a.doubleClicked(0);
                                 break;
@@ -954,7 +969,7 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
         }
         this.s = false;
     };
-    GridCellBase.prototype.ce = function (a, b) {
+    GridCellBase.prototype.ch = function (a, b) {
         if (this.a != null) {
             if (this.af(this.a)) {
                 if (this.a.isMouseDown) {
@@ -971,7 +986,7 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
             }
         }
     };
-    GridCellBase.prototype.cd = function (a, b) {
+    GridCellBase.prototype.cg = function (a, b) {
         if (this.a != null && this.a.isEnterActionDesired) {
             var c = a.pageX;
             var d = a.pageY;
@@ -980,22 +995,22 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
     };
     GridCellBase.prototype.onDoubleClick = function (a) {
     };
-    GridCellBase.prototype.ch = function (a, b, c) {
+    GridCellBase.prototype.ck = function (a, b, c) {
         switch (a) {
             case "Indent":
-                this.ay = this.bg * 24;
-                this.az = this.bg > 0 ? 10 : 0;
-                if (this.am != null) {
-                    this.am.setRawXPosition(this.a5 + this.ay);
-                    this.am.setRawYPosition(intDivide(this.a1, 2) - intDivide(this.ax, 2));
+                this.a0 = this.bi * 24;
+                this.a1 = this.bi > 0 ? 10 : 0;
+                if (this.ao != null) {
+                    this.ao.setRawXPosition(this.a7 + this.a0);
+                    this.ao.setRawYPosition(intDivide(this.a3, 2) - intDivide(this.az, 2));
                 }
                 break;
             case "IsCollapsable":
                 if (this.aa) {
-                    this.b7();
+                    this.ca();
                 }
                 else {
-                    this.cr();
+                    this.cu();
                 }
                 break;
             case "IsExpanded":
@@ -1004,32 +1019,40 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
                 }
                 break;
             case "IsHitTestVisible":
-                this.ap.setRawStyleProperty("pointer-events", this.ad ? "auto" : "none");
+                this.ar.setRawStyleProperty("pointer-events", this.ad ? "auto" : "none");
                 break;
             case "SuffixText":
-                this.ci();
+                this.cl();
                 break;
             case "SuffixIconName":
             case "SuffixIconCollectionName":
-                this.cj();
+                this.cm();
                 break;
             case "SuffixTextColor":
             case "SuffixTextFont":
             case "SuffixIconStroke":
             case "SuffixIconFill":
             case "SuffixIconViewBox":
-                this.ck();
+                this.cn();
+                break;
+            case "SuffixMargin":
+                if (this.ap != null) {
+                    this.ap.setRawStyleProperty("margin-left", this.aj + "px");
+                }
+                if (this.aq != null) {
+                    this.aq.setRawStyleProperty("margin-left", this.aj + "px");
+                }
                 break;
         }
     };
-    GridCellBase.prototype.cg = function () {
+    GridCellBase.prototype.cj = function () {
     };
-    GridCellBase.prototype.b6 = function () {
-        this.al.focus(true);
+    GridCellBase.prototype.b9 = function () {
+        this.an.focus(true);
     };
-    GridCellBase.prototype.b4 = function () {
+    GridCellBase.prototype.b7 = function () {
         if (this.a != null) {
-            var a = this.al.clone();
+            var a = this.an.clone();
             this.a.passCellClone(a);
         }
     };
@@ -1037,9 +1060,9 @@ var GridCellBase = /** @class */ /*@__PURE__*/ (function (_super) {
     };
     GridCellBase.$t = markType(GridCellBase, 'GridCellBase', Base.$, [INativeCell_$type]);
     GridCellBase.o = null;
-    GridCellBase.bi = new Random(0);
-    GridCellBase.a8 = 10;
-    GridCellBase.aw = 3;
+    GridCellBase.bk = new Random(0);
+    GridCellBase.ba = 10;
+    GridCellBase.ay = 3;
     return GridCellBase;
 }(Base));
 export { GridCellBase };