igniteui-webcomponents-layouts 5.0.3-beta.0 → 5.1.0

package/bundles/igniteui-webcomponents-layouts.umd.js

@@ -9544,7 +9544,7 @@
             var d = this.j.getSubRenderer(c);
             b.provideContainer(d);
             var e = this.j.getExternal(b, this.j.rootWrapper, this.j.getExternal(this.a, null, null));
-            this.a.c0(b);
+            this.a.c2(b);
             var f = Math.round(a.rootWrapper.width());
             var g = Math.round(a.rootWrapper.height());
             this.j.rootWrapper.setStyleProperty("position", "relative");
@@ -9566,7 +9566,7 @@
                 a = this.g;
             }
             this.ab = new igniteuiWebcomponentsCore.Size(1, a, b);
-            this.a.c3(this.ab);
+            this.a.c5(this.ab);
         };
         ToolbarView.prototype.aa = function () {
             var a = this.j;
@@ -9575,8 +9575,8 @@
             }
             var b = a.rootWrapper;
             if (null != b) {
-                igniteuiWebcomponentsCore.NativeUI.q(b, this.a.ej);
-                igniteuiWebcomponentsCore.NativeUI.m(b, this.a.d4);
+                igniteuiWebcomponentsCore.NativeUI.q(b, this.a.en);
+                igniteuiWebcomponentsCore.NativeUI.m(b, this.a.d8);
             }
         };
         ToolbarView.prototype.d = function () {
@@ -11863,6 +11863,19 @@
             a.bk = igniteuiWebcomponentsCore.runOn(this, this.fk);
             c.h = 1;
             c.f = 1;
+            c.bp = this.d4;
+            c.bo = this.dz;
+            c.bl = this.cb;
+            c.bm = this.cc;
+            c.bn = this.cd;
+            c.bk = this.ca;
+            c.a9 = this.gw;
+            c.bi = this.c;
+            c.ba = this.gx;
+            c.bj = this.d;
+            c.ac = this.b9;
+            c.ae = igniteuiWebcomponentsCore.DeviceUtils.g(this.bx);
+            c.y = igniteuiWebcomponentsCore.DeviceUtils.g(this.bw);
             d.bj = false;
             d.h = this.au() ? 2 : 1;
             d.f = 0;
@@ -11991,6 +12004,18 @@
             if (!igniteuiWebcomponentsCore.isNaN_(a.b9)) {
                 this.b9 = a.b9;
             }
+            if (!igniteuiWebcomponentsCore.isNaN_(a.cd)) {
+                this.cd = a.cd;
+            }
+            if (!igniteuiWebcomponentsCore.isNaN_(a.ca)) {
+                this.ca = a.ca;
+            }
+            if (!igniteuiWebcomponentsCore.isNaN_(a.cb)) {
+                this.cb = a.cb;
+            }
+            if (!igniteuiWebcomponentsCore.isNaN_(a.cc)) {
+                this.cc = a.cc;
+            }
             if (!igniteuiWebcomponentsCore.isNaN_(a.cg)) {
                 this.cg = a.cg;
             }
@@ -13163,24 +13188,24 @@
             _this.he = null;
             _this.hb = null;
             _this.ha = null;
-            _this.h7 = -1;
             _this.h8 = -1;
+            _this.h9 = -1;
             _this.hl = false;
             _this.hi = false;
             _this.hh = false;
             _this.hm = false;
             _this.hk = false;
-            _this.h9 = -1;
-            _this.h6 = 500;
+            _this.ia = -1;
+            _this.h7 = 500;
             _this.hn = false;
-            _this.hv = NaN;
-            _this.hr = NaN;
-            _this.hx = NaN;
-            _this.ht = NaN;
             _this.hw = NaN;
             _this.hs = NaN;
+            _this.hy = NaN;
             _this.hu = NaN;
-            _this.hq = NaN;
+            _this.hx = NaN;
+            _this.ht = NaN;
+            _this.hv = NaN;
+            _this.hr = NaN;
             _this.hc = null;
             _this.hd = null;
             _this.ho = false;
@@ -13202,147 +13227,147 @@
             enumerable: false,
             configurable: true
         });
-        ToolActionIconButton.prototype.get_hp = function () {
+        ToolActionIconButton.prototype.get_hq = function () {
             return this.hb != null;
         };
-        Object.defineProperty(ToolActionIconButton.prototype, "hp", {
+        Object.defineProperty(ToolActionIconButton.prototype, "hq", {
             get: function () {
-                return this.get_hp();
+                return this.get_hq();
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "ib", {
+        Object.defineProperty(ToolActionIconButton.prototype, "ic", {
             get: function () {
-                return this.h9;
+                return this.ia;
             },
             set: function (a) {
-                this.h9 = a;
+                this.ia = a;
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "ia", {
+        Object.defineProperty(ToolActionIconButton.prototype, "ib", {
             get: function () {
-                return this.h6;
+                return this.h7;
             },
             set: function (a) {
-                var b = this.h6;
-                this.h6 = a;
-                if (b != this.h6) {
+                var b = this.h7;
+                this.h7 = a;
+                if (b != this.h7) {
                     this.ft("ActualTooltipDelay", b, a);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "h3", {
+        Object.defineProperty(ToolActionIconButton.prototype, "h4", {
             get: function () {
-                return this.hv;
+                return this.hw;
             },
             set: function (a) {
-                var b = this.hv;
-                this.hv = a;
-                if (b != this.hv) {
-                    this.ft("ContentPaddingLeft", b, this.hv);
+                var b = this.hw;
+                this.hw = a;
+                if (b != this.hw) {
+                    this.ft("ContentPaddingLeft", b, this.hw);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "hz", {
+        Object.defineProperty(ToolActionIconButton.prototype, "h0", {
             get: function () {
-                return this.hr;
+                return this.hs;
             },
             set: function (a) {
-                var b = this.hr;
-                this.hr = a;
-                if (b != this.hr) {
-                    this.ft("ActualContentPaddingLeft", b, this.hr);
+                var b = this.hs;
+                this.hs = a;
+                if (b != this.hs) {
+                    this.ft("ActualContentPaddingLeft", b, this.hs);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "h5", {
+        Object.defineProperty(ToolActionIconButton.prototype, "h6", {
             get: function () {
-                return this.hx;
+                return this.hy;
             },
             set: function (a) {
-                var b = this.hx;
-                this.hx = a;
-                if (b != this.hx) {
-                    this.ft("ContentPaddingTop", b, this.hx);
+                var b = this.hy;
+                this.hy = a;
+                if (b != this.hy) {
+                    this.ft("ContentPaddingTop", b, this.hy);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "h1", {
+        Object.defineProperty(ToolActionIconButton.prototype, "h2", {
             get: function () {
-                return this.ht;
+                return this.hu;
             },
             set: function (a) {
-                var b = this.ht;
-                this.ht = a;
-                if (b != this.ht) {
-                    this.ft("ActualContentPaddingTop", b, this.ht);
+                var b = this.hu;
+                this.hu = a;
+                if (b != this.hu) {
+                    this.ft("ActualContentPaddingTop", b, this.hu);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "h4", {
+        Object.defineProperty(ToolActionIconButton.prototype, "h5", {
             get: function () {
-                return this.hw;
+                return this.hx;
             },
             set: function (a) {
-                var b = this.hw;
-                this.hw = a;
-                if (b != this.hw) {
-                    this.ft("ContentPaddingRight", b, this.hw);
+                var b = this.hx;
+                this.hx = a;
+                if (b != this.hx) {
+                    this.ft("ContentPaddingRight", b, this.hx);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "h0", {
+        Object.defineProperty(ToolActionIconButton.prototype, "h1", {
             get: function () {
-                return this.hs;
+                return this.ht;
             },
             set: function (a) {
-                var b = this.hs;
-                this.hs = a;
-                if (b != this.hs) {
-                    this.ft("ActualContentPaddingRight", b, this.hs);
+                var b = this.ht;
+                this.ht = a;
+                if (b != this.ht) {
+                    this.ft("ActualContentPaddingRight", b, this.ht);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "h2", {
+        Object.defineProperty(ToolActionIconButton.prototype, "h3", {
             get: function () {
-                return this.hu;
+                return this.hv;
             },
             set: function (a) {
-                var b = this.hu;
-                this.hu = a;
-                if (b != this.hu) {
-                    this.ft("ContentPaddingBottom", b, this.hu);
+                var b = this.hv;
+                this.hv = a;
+                if (b != this.hv) {
+                    this.ft("ContentPaddingBottom", b, this.hv);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconButton.prototype, "hy", {
+        Object.defineProperty(ToolActionIconButton.prototype, "hz", {
             get: function () {
-                return this.hq;
+                return this.hr;
             },
             set: function (a) {
-                var b = this.hq;
-                this.hq = a;
-                if (b != this.hq) {
-                    this.ft("ActualContentPaddingBottom", b, this.hq);
+                var b = this.hr;
+                this.hr = a;
+                if (b != this.hr) {
+                    this.ft("ActualContentPaddingBottom", b, this.hr);
                 }
             },
             enumerable: false,
@@ -13350,8 +13375,8 @@
         });
         ToolActionIconButton.prototype.e3 = function () {
             _super.prototype.e3.call(this);
-            igniteuiWebcomponentsCore.NativeUIWindow.i(15, igniteuiWebcomponentsCore.runOn(this, this.i6));
-            igniteuiWebcomponentsCore.NativeUIWindow.i(9, igniteuiWebcomponentsCore.runOn(this, this.i5));
+            igniteuiWebcomponentsCore.NativeUIWindow.i(15, igniteuiWebcomponentsCore.runOn(this, this.i7));
+            igniteuiWebcomponentsCore.NativeUIWindow.i(9, igniteuiWebcomponentsCore.runOn(this, this.i6));
             this.hh = false;
         };
         ToolActionIconButton.prototype.m = function (a) {
@@ -13363,12 +13388,12 @@
         };
         ToolActionIconButton.prototype.b3 = function (a, b) {
             var c = 0;
-            if (!igniteuiWebcomponentsCore.isNaN_(this.hz)) {
-                c = c + this.hz;
-            }
             if (!igniteuiWebcomponentsCore.isNaN_(this.h0)) {
                 c = c + this.h0;
             }
+            if (!igniteuiWebcomponentsCore.isNaN_(this.h1)) {
+                c = c + this.h1;
+            }
             return igniteuiWebcomponentsCore.DeviceUtils.g(36) + c;
         };
         ToolActionIconButton.prototype.b5 = function (a, b) {
@@ -13382,7 +13407,7 @@
         ToolActionIconButton.prototype.e4 = function (a) {
             _super.prototype.e4.call(this, a);
         };
-        ToolActionIconButton.prototype.i8 = function (a, b, c, d, e) {
+        ToolActionIconButton.prototype.i9 = function (a, b, c, d, e) {
             var f = c.bm;
             if (e) {
                 b.b4(2);
@@ -13400,7 +13425,7 @@
             b.bt = 1;
             b.bu = false;
             b.bg = new igniteuiWebcomponentsCore.Thickness(1, this.bz, this.b1, this.b0, this.by);
-            c.bz = new igniteuiWebcomponentsCore.Thickness(1, this.hz, this.h1, this.h0, this.hy);
+            c.bz = new igniteuiWebcomponentsCore.Thickness(1, this.h0, this.h2, this.h1, this.hz);
             f.bp = this.d4;
             f.bo = this.dz;
             f.bl = this.cb;
@@ -13415,10 +13440,10 @@
             f.ae = igniteuiWebcomponentsCore.DeviceUtils.g(this.bx);
             f.y = igniteuiWebcomponentsCore.DeviceUtils.g(this.bw);
             c.c = this.s;
-            c.bk = igniteuiWebcomponentsCore.runOn(this, this.iv);
-            c.q = igniteuiWebcomponentsCore.runOn(this, this.ix);
-            c.s = igniteuiWebcomponentsCore.runOn(this, this.iy);
-            c.o = igniteuiWebcomponentsCore.runOn(this, this.iw);
+            c.bk = igniteuiWebcomponentsCore.runOn(this, this.iw);
+            c.q = igniteuiWebcomponentsCore.runOn(this, this.iy);
+            c.s = igniteuiWebcomponentsCore.runOn(this, this.iz);
+            c.o = igniteuiWebcomponentsCore.runOn(this, this.ix);
             if (this.hc != c) {
                 if (this.hc != null) {
                     this.hc.bk = null;
@@ -13432,7 +13457,7 @@
                 this.hd = f;
             }
         };
-        ToolActionIconButton.prototype.i9 = function (a, b) {
+        ToolActionIconButton.prototype.ja = function (a, b) {
             if (this.he != b) {
                 if (this.he != null) {
                     this.he.q = null;
@@ -13453,16 +13478,16 @@
                     a.bl(this.he);
                 }
                 if (!this.hh) {
-                    igniteuiWebcomponentsCore.NativeUIWindow.h(15, igniteuiWebcomponentsCore.runOn(this, this.i6), this.p.s.p);
-                    igniteuiWebcomponentsCore.NativeUIWindow.h(9, igniteuiWebcomponentsCore.runOn(this, this.i5), this.p.s.p);
+                    igniteuiWebcomponentsCore.NativeUIWindow.h(15, igniteuiWebcomponentsCore.runOn(this, this.i7), this.p.s.p);
+                    igniteuiWebcomponentsCore.NativeUIWindow.h(9, igniteuiWebcomponentsCore.runOn(this, this.i6), this.p.s.p);
                     this.hh = true;
                 }
             }
-            this.he.q = igniteuiWebcomponentsCore.runOn(this, this.i3);
-            this.he.s = igniteuiWebcomponentsCore.runOn(this, this.i4);
-            this.he.n = igniteuiWebcomponentsCore.runOn(this, this.i1);
-            this.he.o = igniteuiWebcomponentsCore.runOn(this, this.i2);
-            this.he.bs = igniteuiWebcomponentsCore.runOn(this, this.i0);
+            this.he.q = igniteuiWebcomponentsCore.runOn(this, this.i4);
+            this.he.s = igniteuiWebcomponentsCore.runOn(this, this.i5);
+            this.he.n = igniteuiWebcomponentsCore.runOn(this, this.i2);
+            this.he.o = igniteuiWebcomponentsCore.runOn(this, this.i3);
+            this.he.bs = igniteuiWebcomponentsCore.runOn(this, this.i1);
             if (this.he.bk == 0) {
                 this.hm = false;
             }
@@ -13473,18 +13498,18 @@
                 this.he.u = false;
             }
         };
-        ToolActionIconButton.prototype.ip = function () {
-            this.iq(this.hk, this.hl);
+        ToolActionIconButton.prototype.iq = function () {
+            this.ir(this.hk, this.hl);
             this.hm = true;
         };
-        ToolActionIconButton.prototype.iq = function (a, b) {
+        ToolActionIconButton.prototype.ir = function (a, b) {
             var _this = this;
             if (this.he.bk == 0) {
                 this.hb = new TooltipTextPresenter(this.p.s.x());
                 this.hb.t(function () {
                     _this.he.bl(_this.hb.e);
                     if (a) {
-                        _this.f.executeDelayed(function () { return _this.i7(b); }, 100);
+                        _this.f.executeDelayed(function () { return _this.i8(b); }, 100);
                     }
                 });
             }
@@ -13497,11 +13522,11 @@
             this.hb.p = this.ez;
             this.he.cc = this.hb.y;
         };
-        ToolActionIconButton.prototype.is = function () {
+        ToolActionIconButton.prototype.it = function () {
         };
-        ToolActionIconButton.prototype.ir = function () {
+        ToolActionIconButton.prototype.is = function () {
         };
-        ToolActionIconButton.prototype.it = function () {
+        ToolActionIconButton.prototype.iu = function () {
             if (this.hb != null) {
                 this.he.cc = this.p.g6;
                 this.hb.y = this.p.g6;
@@ -13510,22 +13535,22 @@
                 this.he.b6 = igniteuiWebcomponentsCore.truncate(this.p.br);
             }
         };
-        ToolActionIconButton.prototype.ja = function () {
+        ToolActionIconButton.prototype.jb = function () {
             if (this.hb != null) {
                 return this.hb.aa();
             }
             return igniteuiWebcomponentsCore.Size.empty;
         };
-        ToolActionIconButton.prototype.i6 = function (a) {
+        ToolActionIconButton.prototype.i7 = function (a) {
             if (this.hc != null) {
                 var b = this.hc.bc();
                 this.he.b9(b);
             }
         };
-        ToolActionIconButton.prototype.i5 = function (a) {
+        ToolActionIconButton.prototype.i6 = function (a) {
             var b = a;
             if (this.hn && !this.he.t(b.a) && !this.hc.t(b.a)) {
-                this.io();
+                this.ip();
             }
         };
         ToolActionIconButton.prototype.fx = function (a, b, c) {
@@ -13537,8 +13562,8 @@
             if (d.bq == null || d.ao == null || igniteuiWebcomponentsCore.EnumUtil.getEnumValue(igniteuiWebcomponentsCore.ToolActionType_$type, d.ao) != this.u || a.bk == 0) {
                 this.ho = true;
                 igniteuiWebcomponentsCore.NativeUIComponent.au(this.p.s.x(), [10, 12], [this.ag(10), this.ag(12)], function (e) {
-                    _this.i8(d, a, e[0], c, true);
-                    _this.i9(a, e[1]);
+                    _this.i9(d, a, e[0], c, true);
+                    _this.ja(a, e[1]);
                     _this.ho = false;
                 });
                 d.ao = igniteuiWebcomponentsCore.enumGetBox(igniteuiWebcomponentsCore.ToolActionType_$type, this.u);
@@ -13546,8 +13571,8 @@
             else {
                 var e = a.bj(0);
                 var f = a.bj(1);
-                this.i8(d, a, e, c, false);
-                this.i9(a, f);
+                this.i9(d, a, e, c, false);
+                this.ja(a, f);
             }
         };
         ToolActionIconButton.prototype.ga = function () {
@@ -13565,11 +13590,15 @@
                     this.b0 = !igniteuiWebcomponentsCore.isNaN_(this.ch) ? this.ch : igniteuiWebcomponentsCore.DeviceUtils.g(4);
                     break;
             }
-            this.ia = this.ib != -1 ? this.ib : this.p.b6;
-            this.hz = !igniteuiWebcomponentsCore.isNaN_(this.h3) ? this.h3 : NaN;
+            this.ib = this.ic != -1 ? this.ic : this.p.b6;
             this.h0 = !igniteuiWebcomponentsCore.isNaN_(this.h4) ? this.h4 : NaN;
             this.h1 = !igniteuiWebcomponentsCore.isNaN_(this.h5) ? this.h5 : NaN;
-            this.hy = !igniteuiWebcomponentsCore.isNaN_(this.h2) ? this.h2 : NaN;
+            this.h2 = !igniteuiWebcomponentsCore.isNaN_(this.h6) ? this.h6 : NaN;
+            this.hz = !igniteuiWebcomponentsCore.isNaN_(this.h3) ? this.h3 : NaN;
+            var a = igniteuiWebcomponentsCore.DeviceUtils.g(36);
+            var b = Math.floor(a / 1.414);
+            this.bx = !igniteuiWebcomponentsCore.isNaN_(this.ce) ? this.ce : b;
+            this.bw = !igniteuiWebcomponentsCore.isNaN_(this.b8) ? this.b8 : b;
             if (this.hc != null) {
                 this.hc.c = this.s;
                 if (igniteuiWebcomponentsCore.typeCast(igniteuiWebcomponentsCore.NativeUIIconButton.$, this.hc) !== null) {
@@ -13583,7 +13612,7 @@
                 this.hd.bi = this.c;
                 this.hd.bj = this.d;
             }
-            this.it();
+            this.iu();
         };
         ToolActionIconButton.prototype.fr = function () {
             if (this.hd != null) {
@@ -13593,33 +13622,33 @@
         };
         ToolActionIconButton.prototype.fy = function () {
             if (this.actions.count > 0) {
-                if (this.he == null || !this.hp) {
+                if (this.he == null || !this.hq) {
                     this.hk = true;
                 }
                 else {
-                    this.i7();
+                    this.i8();
                     this.hl = true;
                 }
             }
         };
         ToolActionIconButton.prototype.e5 = function () {
             if (this.actions.count > 0) {
-                if (this.he == null || !this.hp) {
+                if (this.he == null || !this.hq) {
                     this.hk = false;
                 }
                 else {
-                    this.io();
+                    this.ip();
                 }
             }
         };
-        ToolActionIconButton.prototype.i7 = function (a) {
+        ToolActionIconButton.prototype.i8 = function (a) {
             if (a === void 0) {
                 a = false;
             }
             if (!this.hm) {
                 this.hk = true;
                 this.hl = a;
-                this.ip();
+                this.iq();
                 return;
             }
             if (!this.hn) {
@@ -13633,7 +13662,7 @@
                 c.left = b.left + (window.scrollX);
                 if (this.p.r == 1) {
                     var d = igniteuiWebcomponentsCore.NativeUIWindow.d(this.p.s.p);
-                    var e = this.ja();
+                    var e = this.jb();
                     e.height += this.he.b4;
                     if (b.bottom + e.height > d) {
                         if (b.top - e.height < 0) {
@@ -13649,7 +13678,7 @@
                 }
                 else {
                     var f = igniteuiWebcomponentsCore.NativeUIWindow.f(this.p.s.p);
-                    var g = this.ja();
+                    var g = this.jb();
                     g.width += this.he.b4;
                     if (b.right + g.width > f) {
                         if (b.left - g.width < 0) {
@@ -13664,12 +13693,12 @@
                     }
                 }
                 this.hn = true;
-                this.is();
+                this.it();
             }
             this.hl = a;
             this.hk = false;
         };
-        ToolActionIconButton.prototype.io = function () {
+        ToolActionIconButton.prototype.ip = function () {
             var _this = this;
             if (this.hn) {
                 if (!this.hg) {
@@ -13681,84 +13710,87 @@
                 }
             }
         };
-        ToolActionIconButton.prototype.iz = function () {
-            this.i7();
+        ToolActionIconButton.prototype.i0 = function () {
+            this.i8();
+            this.h9 = -1;
+        };
+        ToolActionIconButton.prototype.iv = function () {
+            this.ip();
             this.h8 = -1;
         };
-        ToolActionIconButton.prototype.iu = function () {
-            this.io();
-            this.h7 = -1;
+        ToolActionIconButton.prototype.hp = function () {
+            return !igniteuiWebcomponentsCore.stringIsNullOrEmpty(this.ez);
         };
-        ToolActionIconButton.prototype.ix = function (a, b) {
+        ToolActionIconButton.prototype.iy = function (a, b) {
             this.hi = true;
-            if (this.h7 != -1) {
-                this.ha.g(this.h7);
-                this.h7 = -1;
+            if (this.h8 != -1) {
+                this.ha.g(this.h8);
+                this.h8 = -1;
             }
             if (!this.hn) {
-                if ((this.actions.count > 0 && !this.p.al) || (this.actions.count == 0 && igniteuiWebcomponentsCore.stringIsNullOrEmpty(this.ez))) {
+                if (!this.p.al || !this.hp()) {
                     return;
                 }
-                this.h8 = this.ha.f(igniteuiWebcomponentsCore.runOn(this, this.iz), this.ia);
+                this.h9 = this.ha.f(igniteuiWebcomponentsCore.runOn(this, this.i0), this.ib);
             }
         };
-        ToolActionIconButton.prototype.iy = function (a, b) {
-            if (this.h8 != -1) {
-                this.ha.g(this.h8);
-                this.h8 = -1;
+        ToolActionIconButton.prototype.iz = function (a, b) {
+            if (this.h9 != -1) {
+                this.ha.g(this.h9);
+                this.h9 = -1;
             }
             if (this.hn && !this.hl) {
-                this.h7 = this.ha.f(igniteuiWebcomponentsCore.runOn(this, this.iu), 50);
+                this.h8 = this.ha.f(igniteuiWebcomponentsCore.runOn(this, this.iv), 50);
             }
             this.hi = false;
         };
-        ToolActionIconButton.prototype.iv = function (a, b) {
+        ToolActionIconButton.prototype.iw = function (a, b) {
             if (this.actions.count > 0) {
                 if (!this.hn) {
-                    if (this.h8 != -1) {
-                        this.ha.g(this.h8);
-                        this.h8 = -1;
+                    if (this.h9 != -1) {
+                        this.ha.g(this.h9);
+                        this.h9 = -1;
                     }
-                    this.i7(true);
+                    this.i8(true);
                 }
                 else {
-                    this.io();
+                    this.ip();
                 }
             }
             else {
                 this.fu(this.m(true), this);
             }
         };
-        ToolActionIconButton.prototype.i3 = function (a, b) {
+        ToolActionIconButton.prototype.i4 = function (a, b) {
             this.hj = true;
-            if (this.h7 != -1) {
-                this.ha.g(this.h7);
-                this.h7 = -1;
+            if (this.h8 != -1) {
+                this.ha.g(this.h8);
+                this.h8 = -1;
             }
         };
-        ToolActionIconButton.prototype.i4 = function (a, b) {
+        ToolActionIconButton.prototype.i5 = function (a, b) {
             if (!this.hl) {
-                this.h7 = this.ha.f(igniteuiWebcomponentsCore.runOn(this, this.iu), 50);
+                this.h8 = this.ha.f(igniteuiWebcomponentsCore.runOn(this, this.iv), 50);
             }
             this.hj = false;
         };
-        ToolActionIconButton.prototype.i1 = function (a, b) {
+        ToolActionIconButton.prototype.i2 = function (a, b) {
             this.hl = true;
         };
-        ToolActionIconButton.prototype.i2 = function (a, b) {
+        ToolActionIconButton.prototype.i3 = function (a, b) {
             if (!this.he.t(b.a) && !this.hc.t(b.a)) {
-                this.io();
+                this.ip();
             }
         };
-        ToolActionIconButton.prototype.i0 = function (a, b) {
+        ToolActionIconButton.prototype.i1 = function (a, b) {
             this.hn = false;
             this.hg = false;
-            this.ir();
+            this.is();
         };
-        ToolActionIconButton.prototype.iw = function (a, b) {
+        ToolActionIconButton.prototype.ix = function (a, b) {
             if (this.hn) {
                 if (!this.he.t(b.a) && !this.hc.t(b.a)) {
-                    this.io();
+                    this.ip();
                 }
             }
         };
@@ -13785,7 +13817,7 @@
                     }
                     break;
                 case "TooltipDelay":
-                    this.ia = this.ib != -1 ? this.ib : this.p.b6;
+                    this.ib = this.ic != -1 ? this.ic : this.p.b6;
                     break;
                 case "ActualIconWidth":
                 case "ActualIconHeight":
@@ -13799,7 +13831,7 @@
         ToolActionIconButton.prototype.ff = function () {
             _super.prototype.ff.call(this);
             var a = this.t;
-            this.ib = a.tooltipDelay;
+            this.ic = a.tooltipDelay;
             if (a.isMenuOpenOnStart) {
                 this.fy();
             }
@@ -13982,86 +14014,86 @@
         tslib.__extends(ToolActionIconMenu, _super);
         function ToolActionIconMenu() {
             var _this = _super.call(this) || this;
-            _this.jj = igniteuiWebcomponentsCore.DeviceUtils.g(24);
-            _this.ji = igniteuiWebcomponentsCore.DeviceUtils.g(15);
-            _this.jh = 0;
-            _this.jb = null;
-            _this.jd = false;
+            _this.jk = igniteuiWebcomponentsCore.DeviceUtils.g(24);
+            _this.jj = igniteuiWebcomponentsCore.DeviceUtils.g(15);
+            _this.ji = 0;
             _this.jc = null;
+            _this.je = false;
+            _this.jd = null;
+            _this.jt = null;
             _this.js = null;
-            _this.jr = null;
-            _this.je = true;
-            _this.jf = false;
+            _this.jf = true;
+            _this.jg = false;
             if (igniteuiWebcomponentsCore.SvgIconRegistry.instance.getSvgPathString("IG_Default", "igDropDownArrow") == null) {
-                igniteuiWebcomponentsCore.SvgIconRegistry.instance.addSvgPathString("IG_Default", "igDropDownArrow", ToolActionIconMenu.jl);
+                igniteuiWebcomponentsCore.SvgIconRegistry.instance.addSvgPathString("IG_Default", "igDropDownArrow", ToolActionIconMenu.jm);
             }
-            _this.jh = _this.jj - _this.ji;
+            _this.ji = _this.jk - _this.jj;
             return _this;
         }
         ToolActionIconMenu.prototype.get_u = function () {
             return 8;
         };
-        Object.defineProperty(ToolActionIconMenu.prototype, "ju", {
+        Object.defineProperty(ToolActionIconMenu.prototype, "jv", {
             get: function () {
-                return this.js;
+                return this.jt;
             },
             set: function (a) {
-                var b = this.js;
-                this.js = a;
-                if (b != this.js) {
-                    this.ft("ArrowStroke", b, this.js);
+                var b = this.jt;
+                this.jt = a;
+                if (b != this.jt) {
+                    this.ft("ArrowStroke", b, this.jt);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconMenu.prototype, "jt", {
+        Object.defineProperty(ToolActionIconMenu.prototype, "ju", {
             get: function () {
-                return this.jr;
+                return this.js;
             },
             set: function (a) {
-                var b = this.jr;
-                this.jr = a;
-                if (b != this.jr) {
-                    this.ft("ActualIconStroke", b, this.jr);
+                var b = this.js;
+                this.js = a;
+                if (b != this.js) {
+                    this.ft("ActualIconStroke", b, this.js);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(ToolActionIconMenu.prototype, "jg", {
+        Object.defineProperty(ToolActionIconMenu.prototype, "jh", {
             get: function () {
-                return this.je;
+                return this.jf;
             },
             set: function (a) {
-                var b = this.je;
-                this.je = a;
-                if (b != this.je) {
-                    this.ft("ShowArrowIcon", b, this.je);
+                var b = this.jf;
+                this.jf = a;
+                if (b != this.jf) {
+                    this.ft("ShowArrowIcon", b, this.jf);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        ToolActionIconMenu.prototype.get_hp = function () {
-            return this.jb != null;
+        ToolActionIconMenu.prototype.get_hq = function () {
+            return this.jc != null;
         };
-        ToolActionIconMenu.prototype.iq = function (a, b) {
+        ToolActionIconMenu.prototype.ir = function (a, b) {
             var _this = this;
-            this.jd = false;
+            this.je = false;
             if (this.hf.bk > 0) {
                 while (this.hf.bk > 0) {
                     this.hf.bo(0);
                 }
             }
-            if (this.jb != null) {
-                this.jb.t = null;
+            if (this.jc != null) {
+                this.jc.t = null;
             }
-            this.jb = new ToolPanelsPresenter(this.p.s.x(), this.f);
-            this.jb.o = this.s;
-            this.jb.ak(function () {
-                _this.jb.ag(_this, function (c) {
-                    _this.jb.al(c);
+            this.jc = new ToolPanelsPresenter(this.p.s.x(), this.f);
+            this.jc.o = this.s;
+            this.jc.ak(function () {
+                _this.jc.ag(_this, function (c) {
+                    _this.jc.al(c);
                     if (_this.actions.count > 0 && _this.actions._inner[0].gs != null && !igniteuiWebcomponentsCore.BrushUtilCore.a(_this.actions._inner[0].gs)) {
                         _this.hf.cc = _this.actions._inner[0].gs;
                     }
@@ -14069,33 +14101,33 @@
                         _this.hf.cc = _this.p.g3;
                     }
                     if (a) {
-                        _this.f.executeDelayed(function () { return _this.i7(b); }, 100);
+                        _this.f.executeDelayed(function () { return _this.i8(b); }, 100);
                     }
                 });
-                _this.jb.s.a5 = new igniteuiWebcomponentsCore.CornerRadius(0, 8);
-                _this.jb.s.a6 = _this.p.g3;
-                _this.hf.bl(_this.jb.s);
+                _this.jc.s.a5 = new igniteuiWebcomponentsCore.CornerRadius(0, 8);
+                _this.jc.s.a6 = _this.p.g3;
+                _this.hf.bl(_this.jc.s);
             });
-            this.jb.t = igniteuiWebcomponentsCore.runOn(this, this.jo);
+            this.jc.t = igniteuiWebcomponentsCore.runOn(this, this.jp);
         };
         ToolActionIconMenu.prototype.fm = function () {
             _super.prototype.fm.call(this);
-            this.jd = true;
+            this.je = true;
         };
-        ToolActionIconMenu.prototype.is = function () {
-            if (this.jb != null) {
-                this.jb.ao();
+        ToolActionIconMenu.prototype.it = function () {
+            if (this.jc != null) {
+                this.jc.ao();
             }
         };
-        ToolActionIconMenu.prototype.ir = function () {
-            if (this.jb != null) {
-                this.jb.ay();
+        ToolActionIconMenu.prototype.is = function () {
+            if (this.jc != null) {
+                this.jc.ay();
                 this.hf.b8();
             }
         };
-        ToolActionIconMenu.prototype.it = function () {
-            if (this.jb != null) {
-                this.jb.az(this.s, this.p);
+        ToolActionIconMenu.prototype.iu = function () {
+            if (this.jc != null) {
+                this.jc.az(this.s, this.p);
                 if (this.actions.count > 0 && this.actions._inner[0].gs != null && !igniteuiWebcomponentsCore.BrushUtilCore.a(this.actions._inner[0].gs)) {
                     this.hf.cc = this.actions._inner[0].gs;
                 }
@@ -14108,67 +14140,71 @@
         };
         ToolActionIconMenu.prototype.ga = function () {
             _super.prototype.ga.call(this);
-            this.jt = this.ju != null ? this.ju : this.p.g1;
-            var a = this.jg ? igniteuiWebcomponentsCore.DeviceUtils.g(8) : 0;
-            var b = this.jg ? igniteuiWebcomponentsCore.DeviceUtils.g(4) : 0;
-            var c = this.jg ? igniteuiWebcomponentsCore.DeviceUtils.g(5) : 0;
-            var d = this.jg ? igniteuiWebcomponentsCore.DeviceUtils.g(5) : 0;
+            this.ju = this.jv != null ? this.jv : this.p.g1;
+            var a = this.jh ? igniteuiWebcomponentsCore.DeviceUtils.g(8) : 0;
+            var b = this.jh ? igniteuiWebcomponentsCore.DeviceUtils.g(4) : 0;
+            var c = this.jh ? igniteuiWebcomponentsCore.DeviceUtils.g(5) : 0;
+            var d = this.jh ? igniteuiWebcomponentsCore.DeviceUtils.g(5) : 0;
             switch (this.s) {
                 case 6:
                 case 5:
                 case 4:
                 case 3:
-                    this.hz = !igniteuiWebcomponentsCore.isNaN_(this.h3) ? this.h3 : a;
-                    this.h0 = !igniteuiWebcomponentsCore.isNaN_(this.h4) ? this.h4 : b;
-                    this.h1 = !igniteuiWebcomponentsCore.isNaN_(this.h5) ? this.h5 : c;
-                    this.hy = !igniteuiWebcomponentsCore.isNaN_(this.h2) ? this.h2 : d;
+                    this.h0 = !igniteuiWebcomponentsCore.isNaN_(this.h4) ? this.h4 : a;
+                    this.h1 = !igniteuiWebcomponentsCore.isNaN_(this.h5) ? this.h5 : b;
+                    this.h2 = !igniteuiWebcomponentsCore.isNaN_(this.h6) ? this.h6 : c;
+                    this.hz = !igniteuiWebcomponentsCore.isNaN_(this.h3) ? this.h3 : d;
                     break;
                 default:
-                    this.hz = !igniteuiWebcomponentsCore.isNaN_(this.h3) ? this.h3 : 0;
                     this.h0 = !igniteuiWebcomponentsCore.isNaN_(this.h4) ? this.h4 : 0;
                     this.h1 = !igniteuiWebcomponentsCore.isNaN_(this.h5) ? this.h5 : 0;
-                    this.hy = !igniteuiWebcomponentsCore.isNaN_(this.h2) ? this.h2 : 0;
+                    this.h2 = !igniteuiWebcomponentsCore.isNaN_(this.h6) ? this.h6 : 0;
+                    this.hz = !igniteuiWebcomponentsCore.isNaN_(this.h3) ? this.h3 : 0;
                     break;
             }
-            if (this.jc != null) {
-                this.jc.ba = this.jt;
+            var e = igniteuiWebcomponentsCore.DeviceUtils.g(36) - this.ji;
+            var f = Math.floor(e / 1.414);
+            this.bx = !igniteuiWebcomponentsCore.isNaN_(this.ce) ? this.ce : f;
+            this.bw = !igniteuiWebcomponentsCore.isNaN_(this.b8) ? this.b8 : f;
+            if (this.jd != null) {
+                this.jd.ba = this.ju;
             }
         };
-        ToolActionIconMenu.prototype.ja = function () {
-            if (this.jd) {
-                this.ip();
+        ToolActionIconMenu.prototype.jb = function () {
+            if (this.je) {
+                this.iq();
             }
-            return this.jb.a4();
+            return this.jc.a4();
         };
-        ToolActionIconMenu.prototype.i7 = function (a) {
+        ToolActionIconMenu.prototype.i8 = function (a) {
             if (a === void 0) {
                 a = false;
             }
-            if (this.jb != null) {
-                this.jb.ay();
+            if (this.jc != null) {
+                this.jc.ay();
             }
-            _super.prototype.i7.call(this, a);
+            _super.prototype.i8.call(this, a);
         };
         ToolActionIconMenu.prototype.b3 = function (a, b) {
-            if (!this.jg) {
+            if (!this.jh) {
                 return _super.prototype.b3.call(this, a, b);
             }
             var c = 0;
-            if (!igniteuiWebcomponentsCore.isNaN_(this.hz)) {
-                c = c + this.hz;
-            }
             if (!igniteuiWebcomponentsCore.isNaN_(this.h0)) {
                 c = c + this.h0;
             }
-            return Math.max(igniteuiWebcomponentsCore.DeviceUtils.g(36), this.bx + this.jh + c);
+            if (!igniteuiWebcomponentsCore.isNaN_(this.h1)) {
+                c = c + this.h1;
+            }
+            return Math.max(igniteuiWebcomponentsCore.DeviceUtils.g(36), this.bx + this.ji + c);
         };
-        ToolActionIconMenu.prototype.jq = function (a, b, c, d, e, f, g) {
+        ToolActionIconMenu.prototype.jr = function (a, b, c, d, e, f, g) {
             if (g) {
                 a.b4(2);
                 a.b4(1);
                 if (a.bk == 0) {
                     c.bz(0, 1, igniteuiWebcomponentsCore.DeviceUtils.g(this.bx));
-                    c.bz(1, 1, this.jh);
+                    c.bz(1, 1, this.ji);
                     c.bl(d);
                     c.bl(e);
                     c.b6(d, 0);
@@ -14178,22 +14214,22 @@
                 }
                 a.b7(b, 0);
                 a.b6(b, 0);
-                c.bg = new igniteuiWebcomponentsCore.Thickness(1, this.hz, this.h1, this.h0, this.hy);
+                c.bg = new igniteuiWebcomponentsCore.Thickness(1, this.h0, this.h2, this.h1, this.hz);
                 b.bn = 2;
                 b.bl = 4;
                 b.bs = true;
                 b.f = 1;
-                var h = this.bx + this.hz + this.h0;
-                if (this.jg) {
-                    h = h + this.jj - this.ji;
+                var h = this.bx + this.h0 + this.h1;
+                if (this.jh) {
+                    h = h + this.jk - this.jj;
                 }
                 b.bv = h;
                 b.bx = new igniteuiWebcomponentsCore.CornerRadius(0, 18);
                 d.h = 1;
-                e.ae = this.jj;
-                e.y = this.jj;
+                e.ae = this.jk;
+                e.y = this.jk;
                 e.h = 1;
-                e.bf = new igniteuiWebcomponentsCore.Thickness(1, -this.ji, 0, 0, 0);
+                e.bf = new igniteuiWebcomponentsCore.Thickness(1, -this.jj, 0, 0, 0);
                 e.bp = "igDropDownArrow";
                 e.bo = "IG_Default";
                 e.a9 = igniteuiWebcomponentsCore.BrushUtil.h(0, 0, 0, 0);
@@ -14211,12 +14247,12 @@
             d.ba = this.gx;
             d.ae = this.bx;
             d.y = this.bw;
-            e.ba = this.jt;
+            e.ba = this.ju;
             b.c = this.s;
-            b.bk = igniteuiWebcomponentsCore.runOn(this, this.iv);
-            b.q = igniteuiWebcomponentsCore.runOn(this, this.ix);
-            b.s = igniteuiWebcomponentsCore.runOn(this, this.iy);
-            b.o = igniteuiWebcomponentsCore.runOn(this, this.iw);
+            b.bk = igniteuiWebcomponentsCore.runOn(this, this.iw);
+            b.q = igniteuiWebcomponentsCore.runOn(this, this.iy);
+            b.s = igniteuiWebcomponentsCore.runOn(this, this.iz);
+            b.o = igniteuiWebcomponentsCore.runOn(this, this.ix);
             if (this.hc != b) {
                 if (this.hc != null) {
                     this.hc.bk = null;
@@ -14229,25 +14265,25 @@
             if (this.hd != d) {
                 this.hd = d;
             }
-            if (this.jc != e) {
-                this.jc = e;
+            if (this.jd != e) {
+                this.jd = e;
             }
-            this.jp();
+            this.jq();
         };
         ToolActionIconMenu.prototype.fx = function (a, b, c) {
             var _this = this;
-            if (this.jf) {
+            if (this.jg) {
                 return;
             }
             var d = b.b;
             if (d.bq == null || d.ao == null || igniteuiWebcomponentsCore.EnumUtil.getEnumValue(igniteuiWebcomponentsCore.ToolActionType_$type, d.ao) != this.u || a.bk == 0) {
                 var e = [1, 7, 11, 11, 12];
                 var f = [this.ag(1), this.ag(7), this.ag(11), this.ag(11), this.ag(12)];
-                this.jf = true;
+                this.jg = true;
                 igniteuiWebcomponentsCore.NativeUIComponent.au(this.p.s.x(), e, f, function (g) {
-                    _this.jq(a, g[0], g[1], g[2], g[3], c, true);
-                    _this.i9(a, g[4]);
-                    _this.jf = false;
+                    _this.jr(a, g[0], g[1], g[2], g[3], c, true);
+                    _this.ja(a, g[4]);
+                    _this.jg = false;
                 });
                 d.ao = igniteuiWebcomponentsCore.enumGetBox(igniteuiWebcomponentsCore.ToolActionType_$type, this.u);
             }
@@ -14257,11 +14293,11 @@
                 var i = h.bj(0);
                 var j = h.bj(1);
                 var k = a.bj(1);
-                this.jq(a, g, h, i, j, c, false);
-                this.i9(a, k);
+                this.jr(a, g, h, i, j, c, false);
+                this.ja(a, k);
             }
         };
-        ToolActionIconMenu.prototype.jo = function (a) {
+        ToolActionIconMenu.prototype.jp = function (a) {
             this.f3(a.a);
             if (a.b) {
                 this.e5();
@@ -14271,40 +14307,40 @@
             _super.prototype.f0.call(this, a, b, c);
             switch (a) {
                 case "ShowArrowIcon":
-                    this.jp();
+                    this.jq();
                     break;
             }
         };
-        ToolActionIconMenu.prototype.jp = function () {
-            if (this.hc == null || this.hd == null || this.jc == null) {
+        ToolActionIconMenu.prototype.jq = function () {
+            if (this.hc == null || this.hd == null || this.jd == null) {
                 return;
             }
-            if (this.jg) {
+            if (this.jh) {
                 var a = this.hc.bm;
                 if (a.bv == 2) {
                     a.b8(0, 1, igniteuiWebcomponentsCore.DeviceUtils.g(this.bx));
-                    a.b8(1, 1, this.jh);
+                    a.b8(1, 1, this.ji);
                 }
                 else {
                     a.bz(0, 1, igniteuiWebcomponentsCore.DeviceUtils.g(this.bx));
-                    a.bz(1, 1, this.jh);
+                    a.bz(1, 1, this.ji);
                 }
                 a.b6(this.hd, 0);
-                a.b6(this.jc, 1);
-                this.jc.bh = 0;
+                a.b6(this.jd, 1);
+                this.jd.bh = 0;
             }
             else {
                 var b = this.hc.bm;
                 b.b8(1, 1, igniteuiWebcomponentsCore.DeviceUtils.g(0));
-                this.jc.bh = 1;
+                this.jd.bh = 1;
             }
         };
         ToolActionIconMenu.prototype.e2 = function (a, b) {
             _super.prototype.e2.call(this, a, b);
             switch (b) {
                 case "Visibility":
-                    if (this.jb != null) {
-                        this.jb.ax();
+                    if (this.jc != null) {
+                        this.jc.ax();
                     }
                     break;
             }
@@ -14313,17 +14349,17 @@
             _super.prototype.fz.call(this, a);
             if (a.u == 8) {
                 var b = a;
-                if (this.jg != b.jg) {
-                    this.jg = b.jg;
+                if (this.jh != b.jh) {
+                    this.jh = b.jh;
                 }
-                if (this.ju != b.ju) {
-                    this.ju = b.ju;
+                if (this.jv != b.jv) {
+                    this.jv = b.jv;
                 }
             }
         };
         ToolActionIconMenu.prototype.g = function () {
             if (this.hf.b2) {
-                return this.jb.k().a;
+                return this.jc.k().a;
             }
             return null;
         };
@@ -14339,13 +14375,16 @@
             if (this.hd != null) {
                 a.b = this.hd.af();
             }
-            if (this.jc != null) {
-                a.j = this.jc.af();
+            if (this.jd != null) {
+                a.j = this.jd.af();
             }
             return a;
         };
+        ToolActionIconMenu.prototype.hp = function () {
+            return this.actions.count > 0;
+        };
         ToolActionIconMenu.$t = igniteuiWebcomponentsCore.markType(ToolActionIconMenu, 'ToolActionIconMenu', ToolActionIconButton.$);
-        ToolActionIconMenu.jl = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n" + "<path d=\"M20 11.1205L16.2166 14.8795L12.4575 11.1205\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n" + "</svg>\r\n";
+        ToolActionIconMenu.jm = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n" + "<path d=\"M20 11.1205L16.2166 14.8795L12.4575 11.1205\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n" + "</svg>\r\n";
         return ToolActionIconMenu;
     }(ToolActionIconButton));
     /**
@@ -14808,20 +14847,20 @@
             _this.j = Toolbar.k;
             _this.s = null;
             _this.bb = Toolbar.bc;
-            _this.dj = null;
-            _this.dx = null;
             _this.dn = null;
-            _this.dw = null;
-            _this.ds = null;
-            _this.dz = null;
-            _this.dm = null;
-            _this.dq = null;
             _this.d1 = null;
+            _this.ds = null;
             _this.d0 = null;
+            _this.dw = null;
+            _this.d3 = null;
+            _this.dr = null;
+            _this.du = null;
+            _this.d5 = null;
+            _this.d4 = null;
             _this.at = NaN;
             _this.au = NaN;
-            _this.dt = null;
-            _this.du = null;
+            _this.dx = null;
+            _this.dy = null;
             _this.t = null;
             _this.u = null;
             _this.aq = NaN;
@@ -14835,15 +14874,15 @@
             _this.ad = true;
             _this.ak = NaN;
             _this.aj = NaN;
-            _this.dr = null;
             _this.dv = null;
-            _this.d2 = null;
-            _this.dk = null;
-            _this.d3 = null;
-            _this.dl = null;
-            _this.a8 = -1;
-            _this.dy = null;
+            _this.dz = null;
+            _this.d6 = null;
             _this.dp = null;
+            _this.d7 = null;
+            _this.dq = null;
+            _this.a8 = -1;
+            _this.d2 = null;
+            _this.dt = null;
             _this.a7 = -1;
             _this._userSetWidth = false;
             _this._userSetHeight = false;
@@ -14853,11 +14892,11 @@
             _this.b = null;
             _this.onCommand = null;
             var a = _this.actions;
-            a.collectionChanged = igniteuiWebcomponentsCore.delegateCombine(a.collectionChanged, igniteuiWebcomponentsCore.runOn(_this, _this.cs));
+            a.collectionChanged = igniteuiWebcomponentsCore.delegateCombine(a.collectionChanged, igniteuiWebcomponentsCore.runOn(_this, _this.cu));
             var b = _this.actualActions;
-            b.collectionChanged = igniteuiWebcomponentsCore.delegateCombine(b.collectionChanged, igniteuiWebcomponentsCore.runOn(_this, _this.cu));
+            b.collectionChanged = igniteuiWebcomponentsCore.delegateCombine(b.collectionChanged, igniteuiWebcomponentsCore.runOn(_this, _this.cw));
             var c = _this.actualActions;
-            c.collectionResetting = igniteuiWebcomponentsCore.delegateCombine(c.collectionResetting, igniteuiWebcomponentsCore.runOn(_this, _this.cv));
+            c.collectionResetting = igniteuiWebcomponentsCore.delegateCombine(c.collectionResetting, igniteuiWebcomponentsCore.runOn(_this, _this.cx));
             igniteuiWebcomponentsCore.NativeUIInputsFactory.n();
             igniteuiWebcomponentsInputs.NativeUIXInputsFactory.j();
             var d = new ToolbarView();
@@ -14877,16 +14916,16 @@
             enumerable: false,
             configurable: true
         });
-        Toolbar.prototype.c0 = function (a) {
+        Toolbar.prototype.c2 = function (a) {
             this.p = a;
             this.p.ca = this;
             this.p.u = this.q == 0 ? 1 : this.q;
             var b = this.p;
-            b.onCommand = igniteuiWebcomponentsCore.delegateCombine(b.onCommand, igniteuiWebcomponentsCore.runOn(this, this.cr));
+            b.onCommand = igniteuiWebcomponentsCore.delegateCombine(b.onCommand, igniteuiWebcomponentsCore.runOn(this, this.ct));
             this.p.n = new ToolPanelContext();
-            this.dg();
+            this.dk();
         };
-        Toolbar.prototype.cr = function (a, b) {
+        Toolbar.prototype.ct = function (a, b) {
             var c = false;
             if (this.s != null) {
                 if (this.s.onToolCommandExecuting(b.a) == 2) {
@@ -14898,17 +14937,17 @@
                 this.onCommand(this, b);
             }
         };
-        Toolbar.prototype.c7 = function (a) {
+        Toolbar.prototype.c9 = function (a) {
             if (this.onCommand != null) {
                 this.onCommand(this, this.n);
                 this.n = null;
             }
         };
-        Toolbar.prototype.c5 = function () {
+        Toolbar.prototype.c7 = function () {
             var a = this.target;
-            this.c6(a, a);
+            this.c8(a, a);
         };
-        Toolbar.prototype.c3 = function (a) {
+        Toolbar.prototype.c5 = function (a) {
             this.p.notifySizeChanged();
         };
         Object.defineProperty(Toolbar.prototype, "r", {
@@ -14919,7 +14958,7 @@
                 var b = this.q;
                 this.q = a;
                 if (b != this.q) {
-                    this.c4("BaseTheme", igniteuiWebcomponentsCore.enumGetBox(igniteuiWebcomponentsCore.BaseControlTheme_$type, b), igniteuiWebcomponentsCore.enumGetBox(igniteuiWebcomponentsCore.BaseControlTheme_$type, a));
+                    this.c6("BaseTheme", igniteuiWebcomponentsCore.enumGetBox(igniteuiWebcomponentsCore.BaseControlTheme_$type, b), igniteuiWebcomponentsCore.enumGetBox(igniteuiWebcomponentsCore.BaseControlTheme_$type, a));
                 }
             },
             enumerable: false,
@@ -14933,7 +14972,7 @@
                 var b = this.f;
                 this.f = a;
                 if (b != this.f) {
-                    this.c4("AutoGeneratedActions", b, this.f);
+                    this.c6("AutoGeneratedActions", b, this.f);
                 }
             },
             enumerable: false,
@@ -14947,7 +14986,7 @@
                 var b = this.d;
                 this.d = a;
                 if (b != this.d) {
-                    this.c4("Actions", b, this.d);
+                    this.c6("Actions", b, this.d);
                 }
             },
             enumerable: false,
@@ -14961,7 +15000,7 @@
                 var b = this.e;
                 this.e = a;
                 if (b != this.e) {
-                    this.c4("ActualActions", b, this.e);
+                    this.c6("ActualActions", b, this.e);
                 }
             },
             enumerable: false,
@@ -14975,7 +15014,7 @@
                 var b = this.j;
                 this.j = a;
                 if (b != this.j) {
-                    this.c4("Orientation", igniteuiWebcomponentsCore.enumGetBox(ToolbarOrientation_$type, b), igniteuiWebcomponentsCore.enumGetBox(ToolbarOrientation_$type, a));
+                    this.c6("Orientation", igniteuiWebcomponentsCore.enumGetBox(ToolbarOrientation_$type, b), igniteuiWebcomponentsCore.enumGetBox(ToolbarOrientation_$type, a));
                 }
             },
             enumerable: false,
@@ -14989,147 +15028,147 @@
                 var b = this.bb;
                 this.bb = a;
                 if (b != this.bb) {
-                    this.c4("Target", b, a);
+                    this.c6("Target", b, a);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "d4", {
+        Object.defineProperty(Toolbar.prototype, "d8", {
             get: function () {
-                return this.dj;
+                return this.dn;
             },
             set: function (a) {
-                var b = this.dj;
-                this.dj = a;
-                if (b != this.dj) {
-                    this.c4("BackgroundColor", b, a);
+                var b = this.dn;
+                this.dn = a;
+                if (b != this.dn) {
+                    this.c6("BackgroundColor", b, a);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "eh", {
+        Object.defineProperty(Toolbar.prototype, "el", {
             get: function () {
-                return this.dx;
+                return this.d1;
             },
             set: function (a) {
-                var b = this.dx;
-                this.dx = a;
-                if (b != this.dx) {
-                    this.c4("SubmenuBackgroundColor", b, this.dx);
+                var b = this.d1;
+                this.d1 = a;
+                if (b != this.d1) {
+                    this.c6("SubmenuBackgroundColor", b, this.d1);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "d8", {
+        Object.defineProperty(Toolbar.prototype, "ec", {
             get: function () {
-                return this.dn;
+                return this.ds;
             },
             set: function (a) {
-                var b = this.dn;
-                this.dn = a;
-                if (b != this.dn) {
-                    this.c4("GroupHeaderBackgroundColorPropertyName", b, this.dn);
+                var b = this.ds;
+                this.ds = a;
+                if (b != this.ds) {
+                    this.c6("GroupHeaderBackgroundColorPropertyName", b, this.ds);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "eg", {
+        Object.defineProperty(Toolbar.prototype, "ek", {
             get: function () {
-                return this.dw;
+                return this.d0;
             },
             set: function (a) {
-                var b = this.dw;
-                this.dw = a;
-                if (b != this.dw) {
-                    this.c4("SeparatorBackgroundColor", b, this.dw);
+                var b = this.d0;
+                this.d0 = a;
+                if (b != this.d0) {
+                    this.c6("SeparatorBackgroundColor", b, this.d0);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ec", {
+        Object.defineProperty(Toolbar.prototype, "eg", {
             get: function () {
-                return this.ds;
+                return this.dw;
             },
             set: function (a) {
-                var b = this.ds;
-                this.ds = a;
-                if (b != this.ds) {
-                    this.c4("HoverBackgroundColor", b, this.ds);
+                var b = this.dw;
+                this.dw = a;
+                if (b != this.dw) {
+                    this.c6("HoverBackgroundColor", b, this.dw);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ej", {
+        Object.defineProperty(Toolbar.prototype, "en", {
             get: function () {
-                return this.dz;
+                return this.d3;
             },
             set: function (a) {
-                var b = this.dz;
-                this.dz = a;
-                if (b != this.dz) {
-                    this.c4("TextColor", b, this.dz);
+                var b = this.d3;
+                this.d3 = a;
+                if (b != this.d3) {
+                    this.c6("TextColor", b, this.d3);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "d7", {
+        Object.defineProperty(Toolbar.prototype, "eb", {
             get: function () {
-                return this.dm;
+                return this.dr;
             },
             set: function (a) {
-                var b = this.dm;
-                this.dm = a;
-                if (b != this.dm) {
-                    this.c4("DisabledTextColor", b, this.dm);
+                var b = this.dr;
+                this.dr = a;
+                if (b != this.dr) {
+                    this.c6("DisabledTextColor", b, this.dr);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ea", {
+        Object.defineProperty(Toolbar.prototype, "ee", {
             get: function () {
-                return this.dq;
+                return this.du;
             },
             set: function (a) {
-                var b = this.dq;
-                this.dq = a;
-                if (b != this.dq) {
-                    this.c4("GroupHeaderTextColor", b, this.dq);
+                var b = this.du;
+                this.du = a;
+                if (b != this.du) {
+                    this.c6("GroupHeaderTextColor", b, this.du);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "el", {
+        Object.defineProperty(Toolbar.prototype, "ep", {
             get: function () {
-                return this.d1;
+                return this.d5;
             },
             set: function (a) {
-                var b = this.d1;
-                this.d1 = a;
-                if (b != this.d1) {
-                    this.c4("ToolTipTextColor", b, this.d1);
+                var b = this.d5;
+                this.d5 = a;
+                if (b != this.d5) {
+                    this.c6("ToolTipTextColor", b, this.d5);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ek", {
+        Object.defineProperty(Toolbar.prototype, "eo", {
             get: function () {
-                return this.d0;
+                return this.d4;
             },
             set: function (a) {
-                var b = this.d0;
-                this.d0 = a;
-                if (b != this.d0) {
-                    this.c4("ToolTipBackgroundColor", b, this.d0);
+                var b = this.d4;
+                this.d4 = a;
+                if (b != this.d4) {
+                    this.c6("ToolTipBackgroundColor", b, this.d4);
                 }
             },
             enumerable: false,
@@ -15143,7 +15182,7 @@
                 var b = this.at;
                 this.at = a;
                 if (b != this.at) {
-                    this.c4("ToolTipCornerRadius", b, this.at);
+                    this.c6("ToolTipCornerRadius", b, this.at);
                 }
             },
             enumerable: false,
@@ -15157,35 +15196,35 @@
                 var b = this.au;
                 this.au = a;
                 if (b != this.au) {
-                    this.c4("ToolTipElevation", b, this.au);
+                    this.c6("ToolTipElevation", b, this.au);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ed", {
+        Object.defineProperty(Toolbar.prototype, "eh", {
             get: function () {
-                return this.dt;
+                return this.dx;
             },
             set: function (a) {
-                var b = this.dt;
-                this.dt = a;
-                if (b != this.dt) {
-                    this.c4("IconFill", b, this.dt);
+                var b = this.dx;
+                this.dx = a;
+                if (b != this.dx) {
+                    this.c6("IconFill", b, this.dx);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ee", {
+        Object.defineProperty(Toolbar.prototype, "ei", {
             get: function () {
-                return this.du;
+                return this.dy;
             },
             set: function (a) {
-                var b = this.du;
-                this.du = a;
-                if (b != this.du) {
-                    this.c4("IconStroke", b, this.du);
+                var b = this.dy;
+                this.dy = a;
+                if (b != this.dy) {
+                    this.c6("IconStroke", b, this.dy);
                 }
             },
             enumerable: false,
@@ -15199,7 +15238,7 @@
                 var b = this.t;
                 this.t = a;
                 if (b != this.t) {
-                    this.c4("CellTextStyle", b, this.t);
+                    this.c6("CellTextStyle", b, this.t);
                 }
             },
             enumerable: false,
@@ -15213,7 +15252,7 @@
                 var b = this.u;
                 this.u = a;
                 if (b != this.u) {
-                    this.c4("SubtitleTextStyle", b, this.u);
+                    this.c6("SubtitleTextStyle", b, this.u);
                 }
             },
             enumerable: false,
@@ -15233,7 +15272,7 @@
                 var b = this.aq;
                 this.aq = a;
                 if (b != this.aq) {
-                    this.c4("SeparatorVerticalPaddingLeft", b, this.aq);
+                    this.c6("SeparatorVerticalPaddingLeft", b, this.aq);
                 }
             },
             enumerable: false,
@@ -15247,7 +15286,7 @@
                 var b = this.ar;
                 this.ar = a;
                 if (b != this.ar) {
-                    this.c4("SeparatorVerticalPaddingRight", b, this.ar);
+                    this.c6("SeparatorVerticalPaddingRight", b, this.ar);
                 }
             },
             enumerable: false,
@@ -15261,7 +15300,7 @@
                 var b = this.as;
                 this.as = a;
                 if (b != this.as) {
-                    this.c4("SeparatorVerticalPaddingTop", b, this.as);
+                    this.c6("SeparatorVerticalPaddingTop", b, this.as);
                 }
             },
             enumerable: false,
@@ -15275,7 +15314,7 @@
                 var b = this.ap;
                 this.ap = a;
                 if (b != this.ap) {
-                    this.c4("SeparatorVerticalPaddingBottom", b, this.ap);
+                    this.c6("SeparatorVerticalPaddingBottom", b, this.ap);
                 }
             },
             enumerable: false,
@@ -15289,7 +15328,7 @@
                 var b = this.am;
                 this.am = a;
                 if (b != this.am) {
-                    this.c4("SeparatorHorizontalPaddingLeft", b, this.am);
+                    this.c6("SeparatorHorizontalPaddingLeft", b, this.am);
                 }
             },
             enumerable: false,
@@ -15303,7 +15342,7 @@
                 var b = this.an;
                 this.an = a;
                 if (b != this.an) {
-                    this.c4("SeparatorHorizontalPaddingRight", b, this.an);
+                    this.c6("SeparatorHorizontalPaddingRight", b, this.an);
                 }
             },
             enumerable: false,
@@ -15317,7 +15356,7 @@
                 var b = this.ao;
                 this.ao = a;
                 if (b != this.ao) {
-                    this.c4("SeparatorHorizontalPaddingTop", b, this.ao);
+                    this.c6("SeparatorHorizontalPaddingTop", b, this.ao);
                 }
             },
             enumerable: false,
@@ -15331,7 +15370,7 @@
                 var b = this.al;
                 this.al = a;
                 if (b != this.al) {
-                    this.c4("SeparatorHorizontalPaddingBottom", b, this.al);
+                    this.c6("SeparatorHorizontalPaddingBottom", b, this.al);
                 }
             },
             enumerable: false,
@@ -15345,7 +15384,7 @@
                 var b = this.ad;
                 this.ad = a;
                 if (b != this.ad) {
-                    this.c4("ShowOnHover", b, this.ad);
+                    this.c6("ShowOnHover", b, this.ad);
                 }
             },
             enumerable: false,
@@ -15359,7 +15398,7 @@
                 var b = this.ak;
                 this.ak = a;
                 if (b != this.ak) {
-                    this.c4("HighlightWidth", b, this.ak);
+                    this.c6("HighlightWidth", b, this.ak);
                 }
             },
             enumerable: false,
@@ -15373,91 +15412,91 @@
                 var b = this.aj;
                 this.aj = a;
                 if (b != this.aj) {
-                    this.c4("HighlightRadius", b, this.aj);
+                    this.c6("HighlightRadius", b, this.aj);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "eb", {
+        Object.defineProperty(Toolbar.prototype, "ef", {
             get: function () {
-                return this.dr;
+                return this.dv;
             },
             set: function (a) {
-                var b = this.dr;
-                this.dr = a;
-                if (b != this.dr) {
-                    this.c4("HighlightColor", b, this.dr);
+                var b = this.dv;
+                this.dv = a;
+                if (b != this.dv) {
+                    this.c6("HighlightColor", b, this.dv);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ef", {
+        Object.defineProperty(Toolbar.prototype, "ej", {
             get: function () {
-                return this.dv;
+                return this.dz;
             },
             set: function (a) {
-                var b = this.dv;
-                this.dv = a;
-                if (b != this.dv) {
-                    this.c4("MenuArrowStroke", b, this.dv);
+                var b = this.dz;
+                this.dz = a;
+                if (b != this.dz) {
+                    this.c6("MenuArrowStroke", b, this.dz);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "em", {
+        Object.defineProperty(Toolbar.prototype, "eq", {
             get: function () {
-                return this.d2;
+                return this.d6;
             },
             set: function (a) {
-                var b = this.d2;
-                this.d2 = a;
-                if (b != this.d2) {
-                    this.c4("UncheckedBackgroundColor", b, this.d2);
+                var b = this.d6;
+                this.d6 = a;
+                if (b != this.d6) {
+                    this.c6("UncheckedBackgroundColor", b, this.d6);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "d5", {
+        Object.defineProperty(Toolbar.prototype, "d9", {
             get: function () {
-                return this.dk;
+                return this.dp;
             },
             set: function (a) {
-                var b = this.dk;
-                this.dk = a;
-                if (b != this.dk) {
-                    this.c4("CheckedBackgroundColor", b, this.dk);
+                var b = this.dp;
+                this.dp = a;
+                if (b != this.dp) {
+                    this.c6("CheckedBackgroundColor", b, this.dp);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "en", {
+        Object.defineProperty(Toolbar.prototype, "er", {
             get: function () {
-                return this.d3;
+                return this.d7;
             },
             set: function (a) {
-                var b = this.d3;
-                this.d3 = a;
-                if (b != this.d3) {
-                    this.c4("UncheckedBorderColor", b, this.d3);
+                var b = this.d7;
+                this.d7 = a;
+                if (b != this.d7) {
+                    this.c6("UncheckedBorderColor", b, this.d7);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "d6", {
+        Object.defineProperty(Toolbar.prototype, "ea", {
             get: function () {
-                return this.dl;
+                return this.dq;
             },
             set: function (a) {
-                var b = this.dl;
-                this.dl = a;
-                if (b != this.dl) {
-                    this.c4("CheckedBorderColor", b, this.dl);
+                var b = this.dq;
+                this.dq = a;
+                if (b != this.dq) {
+                    this.c6("CheckedBorderColor", b, this.dq);
                 }
             },
             enumerable: false,
@@ -15476,29 +15515,29 @@
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "ei", {
+        Object.defineProperty(Toolbar.prototype, "em", {
             get: function () {
-                return this.dy;
+                return this.d2;
             },
             set: function (a) {
-                var b = this.dy;
-                this.dy = a;
-                if (b != this.dy) {
-                    this.c4("SubtitleTextColor", b, this.dy);
+                var b = this.d2;
+                this.d2 = a;
+                if (b != this.d2) {
+                    this.c6("SubtitleTextColor", b, this.d2);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Toolbar.prototype, "d9", {
+        Object.defineProperty(Toolbar.prototype, "ed", {
             get: function () {
-                return this.dp;
+                return this.dt;
             },
             set: function (a) {
-                var b = this.dp;
-                this.dp = a;
-                if (b != this.dp) {
-                    this.c4("GroupHeaderSubtitleTextColor", b, this.dp);
+                var b = this.dt;
+                this.dt = a;
+                if (b != this.dt) {
+                    this.c6("GroupHeaderSubtitleTextColor", b, this.dt);
                 }
             },
             enumerable: false,
@@ -15512,7 +15551,7 @@
                 var b = this.a7;
                 this.a7 = a;
                 if (b != this.a7) {
-                    this.c4("DropdownDelay", b, this.a7);
+                    this.c6("DropdownDelay", b, this.a7);
                 }
             },
             enumerable: false,
@@ -15538,7 +15577,7 @@
             enumerable: false,
             configurable: true
         });
-        Toolbar.prototype.cs = function (a, b) {
+        Toolbar.prototype.cu = function (a, b) {
             var e_4, _a, e_5, _b;
             if (b.oldItems != null) {
                 try {
@@ -15546,7 +15585,7 @@
                         var c = _d.value;
                         if (igniteuiWebcomponentsCore.typeCast(igniteuiWebcomponentsCore.INotifyPropertyChanged_$type, c) !== null) {
                             var d = c;
-                            d.propertyChanged = igniteuiWebcomponentsCore.delegateRemove(d.propertyChanged, igniteuiWebcomponentsCore.runOn(this, this.ct));
+                            d.propertyChanged = igniteuiWebcomponentsCore.delegateRemove(d.propertyChanged, igniteuiWebcomponentsCore.runOn(this, this.cv));
                         }
                     }
                 }
@@ -15570,7 +15609,7 @@
                         var e = _f.value;
                         if (igniteuiWebcomponentsCore.typeCast(igniteuiWebcomponentsCore.INotifyPropertyChanged_$type, e) !== null) {
                             var f = e;
-                            f.propertyChanged = igniteuiWebcomponentsCore.delegateCombine(f.propertyChanged, igniteuiWebcomponentsCore.runOn(this, this.ct));
+                            f.propertyChanged = igniteuiWebcomponentsCore.delegateCombine(f.propertyChanged, igniteuiWebcomponentsCore.runOn(this, this.cv));
                         }
                     }
                 }
@@ -15588,21 +15627,21 @@
                     }
                 }
             }
-            this.c2();
+            this.c4();
         };
-        Toolbar.prototype.cu = function (a, b) {
-            this.di();
+        Toolbar.prototype.cw = function (a, b) {
+            this.dm();
         };
-        Toolbar.prototype.cv = function (a, b) {
+        Toolbar.prototype.cx = function (a, b) {
             for (var c = 0; c < this.actualActions.count; c++) {
                 if (igniteuiWebcomponentsCore.typeCast(igniteuiWebcomponentsCore.INotifyPropertyChanged_$type, this.actualActions._inner[c]) !== null) {
                     var d = this.actualActions._inner[c];
-                    d.propertyChanged = igniteuiWebcomponentsCore.delegateRemove(d.propertyChanged, igniteuiWebcomponentsCore.runOn(this, this.ct));
+                    d.propertyChanged = igniteuiWebcomponentsCore.delegateRemove(d.propertyChanged, igniteuiWebcomponentsCore.runOn(this, this.cv));
                 }
                 this.actualActions._inner[c].f = null;
             }
         };
-        Toolbar.prototype.di = function () {
+        Toolbar.prototype.dm = function () {
             var a = this.r == 0 ? 1 : this.r;
             if (this.p != null) {
                 this.p.u = a;
@@ -15611,34 +15650,34 @@
                 this.actualActions._inner[b].s = a;
             }
         };
-        Toolbar.prototype.ct = function (a, b) {
+        Toolbar.prototype.cv = function (a, b) {
         };
-        Toolbar.prototype.c2 = function () {
-            this.da();
+        Toolbar.prototype.c4 = function () {
+            this.dc();
         };
-        Toolbar.prototype.da = function () {
+        Toolbar.prototype.dc = function () {
             if (this.ab) {
                 return;
             }
             if (this.c != null) {
                 this.ab = true;
-                this.c.enqueueAction(igniteuiWebcomponentsCore.runOn(this, this.cy));
+                this.c.enqueueAction(igniteuiWebcomponentsCore.runOn(this, this.c0));
             }
             else {
                 this.ac = true;
             }
         };
-        Toolbar.prototype.cy = function () {
+        Toolbar.prototype.c0 = function () {
             if (!this.ab) {
                 return;
             }
             this.ab = false;
-            this.db();
+            this.dd();
             if (this.p.actions != this.actualActions) {
                 this.p.actions = this.actualActions;
             }
         };
-        Toolbar.prototype.db = function () {
+        Toolbar.prototype.dd = function () {
             var _this = this;
             this.actualActions.clear();
             for (var a = 0; a < this.autoGeneratedActions.count; a++) {
@@ -15782,9 +15821,9 @@
                 p3: d
             };
         };
-        Toolbar.prototype.cz = function () {
+        Toolbar.prototype.c1 = function () {
             if (this.ab) {
-                this.cy();
+                this.c0();
             }
         };
         Toolbar.prototype.notifySizeChanged = function () {
@@ -15799,19 +15838,19 @@
                 this.v.w(this.m.j);
             }
         };
-        Toolbar.prototype.c4 = function (a, b, c) {
+        Toolbar.prototype.c6 = function (a, b, c) {
             if (this.propertyChanged != null) {
                 this.propertyChanged(this, new igniteuiWebcomponentsCore.PropertyChangedEventArgs(a));
             }
-            this.c8(a, b, c);
+            this.da(a, b, c);
         };
-        Toolbar.prototype.c8 = function (a, b, c) {
+        Toolbar.prototype.da = function (a, b, c) {
             switch (a) {
                 case "CellTextStyle":
                     if (this.v != null && this.m.j != null) {
                         this.v.w(this.m.j);
                     }
-                    this.dg();
+                    this.dk();
                     break;
                 case "BackgroundColor":
                 case "TextColor":
@@ -15840,42 +15879,42 @@
                 case "GroupHeaderSubtitleTextColor":
                 case "SubtitleTextStyle":
                 case "DropdownDelay":
-                    this.dg();
+                    this.dk();
                     break;
                 case "Target":
                     var d = c;
                     var e = b;
-                    this.c6(e, d);
+                    this.c8(e, d);
                     break;
                 case "BaseTheme":
-                    this.di();
+                    this.dm();
                     break;
                 case "ExecutionContext":
                     if (this.c != null && this.ac) {
-                        this.da();
+                        this.dc();
                         this.ac = false;
                     }
                     break;
             }
         };
-        Toolbar.prototype.dg = function () {
+        Toolbar.prototype.dk = function () {
             if (this.p != null) {
                 this.p.al = this.ag;
-                this.p.ha = this.d4;
-                this.p.hq = this.ej;
-                this.p.hd = this.d7;
-                this.p.ho = this.eh;
-                this.p.he = this.d8;
-                this.p.hh = this.ea;
-                this.p.hn = this.eg;
-                this.p.hj = this.ec;
+                this.p.ha = this.d8;
+                this.p.hq = this.en;
+                this.p.hd = this.eb;
+                this.p.ho = this.el;
+                this.p.he = this.ec;
+                this.p.hh = this.ee;
+                this.p.hn = this.ek;
+                this.p.hj = this.eg;
                 this.p.r = this.l;
-                this.p.hs = this.el;
-                this.p.hr = this.ek;
+                this.p.hs = this.ep;
+                this.p.hr = this.eo;
                 this.p.b2 = this.a5;
                 this.p.b3 = this.a6;
-                this.p.hk = this.ed;
-                this.p.hl = this.ee;
+                this.p.hk = this.eh;
+                this.p.hl = this.ei;
                 this.p.ab = this.v;
                 this.p.ad = this.x;
                 this.p.bv = this.ay;
@@ -15886,30 +15925,30 @@
                 this.p.b0 = this.a3;
                 this.p.b1 = this.a4;
                 this.p.by = this.a1;
-                this.p.hi = this.eb;
+                this.p.hi = this.ef;
                 this.p.bs = this.av;
                 this.p.bt = this.aw;
-                this.p.hm = this.ef;
-                this.p.ht = this.em;
-                this.p.hu = this.en;
-                this.p.hb = this.d5;
-                this.p.hc = this.d6;
-                this.p.hp = this.ei;
-                this.p.hg = this.d9;
+                this.p.hm = this.ej;
+                this.p.ht = this.eq;
+                this.p.hu = this.er;
+                this.p.hb = this.d9;
+                this.p.hc = this.ea;
+                this.p.hp = this.em;
+                this.p.hg = this.ed;
                 this.p.b7 = this.a9;
                 if (this.a8 != -1) {
                     this.p.b8 = this.a8;
                 }
             }
         };
-        Toolbar.prototype.eo = function () {
+        Toolbar.prototype.es = function () {
             if (this.p != null) {
                 return this.p.hv();
             }
             return igniteuiWebcomponentsCore.Size.empty;
         };
-        Toolbar.prototype.c6 = function (a, b) {
-            this.cw();
+        Toolbar.prototype.c8 = function (a, b) {
+            this.cy();
             this.s = b;
             if (a != null) {
                 a.commandCompleted = null;
@@ -15917,17 +15956,17 @@
                     this.autoGeneratedActions.clear();
                 }
                 a.removeCommandStateChangedListener(this);
-                this.da();
+                this.dc();
             }
             if (b != null) {
-                b.commandCompleted = igniteuiWebcomponentsCore.runOn(this, this.c7);
-                b.invalidateActions = igniteuiWebcomponentsCore.runOn(this, this.c5);
-                this.dh();
+                b.commandCompleted = igniteuiWebcomponentsCore.runOn(this, this.c9);
+                b.invalidateActions = igniteuiWebcomponentsCore.runOn(this, this.c7);
+                this.dl();
                 b.addCommandStateChangedListener(this);
-                this.da();
+                this.dc();
             }
         };
-        Toolbar.prototype.dh = function () {
+        Toolbar.prototype.dl = function () {
             var a = this.s.getDesiredToolbarActions();
             if (a == null) {
                 this.autoGeneratedActions.clear();
@@ -15963,13 +16002,13 @@
                 var b = this.b;
                 this.b = a;
                 if (b != this.b) {
-                    this.c4("ExecutionContext", b, this.b);
+                    this.c6("ExecutionContext", b, this.b);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Toolbar.prototype.cw = function () {
+        Toolbar.prototype.cy = function () {
             if (this.p != null) {
                 this.p.er();
             }
@@ -16003,7 +16042,7 @@
                 }
             }
         };
-        Toolbar.prototype.dc = function (a, b) {
+        Toolbar.prototype.de = function (a, b) {
             for (var c = 0; c < a.count; c++) {
                 var d = a._inner[c];
                 if (d.d4 == b) {
@@ -16011,25 +16050,39 @@
                     d.d4 = b;
                 }
                 if (d.actions != null && d.actions.count > 0) {
-                    this.dc(d.actions, b);
+                    this.de(d.actions, b);
                 }
             }
         };
-        Toolbar.prototype.dd = function (a, b, c) {
+        Toolbar.prototype.dg = function (a, b, c) {
             igniteuiWebcomponentsCore.SvgIconRegistry.instance.addSvgPathString(a, b, c);
-            this.dc(this.actualActions, b);
+            this.de(this.actualActions, b);
         };
-        Toolbar.prototype.bt = function (a, b) {
+        Toolbar.prototype.bv = function (a, b) {
             return igniteuiWebcomponentsCore.SvgIconRegistry.instance.getSvgPathString(a, b);
         };
-        Toolbar.prototype.de = function (a, b, c) {
+        Toolbar.prototype.di = function (a, b, c) {
             igniteuiWebcomponentsCore.SvgIconRegistry.instance.addSvgPathsString(a, b, c);
-            this.dc(this.actualActions, b);
+            this.de(this.actualActions, b);
         };
         Toolbar.prototype.a = function (a, b) {
             return igniteuiWebcomponentsCore.SvgIconRegistry.instance.getSvgPathsString(a, b);
         };
-        Toolbar.prototype.df = function (a, b) {
+        Toolbar.prototype.df = function (a, b, c) {
+            igniteuiWebcomponentsCore.SvgIconRegistry.instance.addDataURLString(a, b, c);
+            this.de(this.actualActions, b);
+        };
+        Toolbar.prototype.bu = function (a, b) {
+            return igniteuiWebcomponentsCore.SvgIconRegistry.instance.getDataURLString(a, b);
+        };
+        Toolbar.prototype.dh = function (a, b, c) {
+            igniteuiWebcomponentsCore.SvgIconRegistry.instance.addIconSource(a, b, c);
+            this.de(this.actualActions, b);
+        };
+        Toolbar.prototype.bf = function (a, b) {
+            return igniteuiWebcomponentsCore.SvgIconRegistry.instance.getIconSource(a, b);
+        };
+        Toolbar.prototype.dj = function (a, b) {
             if (igniteuiWebcomponentsCore.stringIsNullOrEmpty(a)) {
                 return;
             }
@@ -16047,7 +16100,7 @@
             }
             return this.p.b9();
         };
-        Toolbar.prototype.bs = function () {
+        Toolbar.prototype.bt = function () {
             var a = this.bd();
             return a.serialize();
         };
@@ -21803,11 +21856,11 @@
              * Gets or sets the color to use for the background of the component.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.d4);
+                return igniteuiWebcomponentsCore.brushToString(this.i.d8);
             },
             set: function (v) {
-                this.i.d4 = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("backgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.d4));
+                this.i.d8 = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("backgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.d8));
             },
             enumerable: false,
             configurable: true
@@ -21817,11 +21870,11 @@
              * Gets or sets the background color for submenus.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.eh);
+                return igniteuiWebcomponentsCore.brushToString(this.i.el);
             },
             set: function (v) {
-                this.i.eh = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("submenuBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.eh));
+                this.i.el = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("submenuBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.el));
             },
             enumerable: false,
             configurable: true
@@ -21831,11 +21884,11 @@
              * Gets or sets the group header background color.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.d8);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ec);
             },
             set: function (v) {
-                this.i.d8 = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("groupHeaderBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.d8));
+                this.i.ec = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("groupHeaderBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.ec));
             },
             enumerable: false,
             configurable: true
@@ -21845,11 +21898,11 @@
              * Gets or sets the separator background color.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.eg);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ek);
             },
             set: function (v) {
-                this.i.eg = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("separatorBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.eg));
+                this.i.ek = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("separatorBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.ek));
             },
             enumerable: false,
             configurable: true
@@ -21859,11 +21912,11 @@
              * Gets or sets the hover background color.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ec);
+                return igniteuiWebcomponentsCore.brushToString(this.i.eg);
             },
             set: function (v) {
-                this.i.ec = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("hoverBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.ec));
+                this.i.eg = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("hoverBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.eg));
             },
             enumerable: false,
             configurable: true
@@ -21873,11 +21926,11 @@
              * Gets or sets the color to use for the text of the component.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ej);
+                return igniteuiWebcomponentsCore.brushToString(this.i.en);
             },
             set: function (v) {
-                this.i.ej = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("textColor", igniteuiWebcomponentsCore.brushToString(this.i.ej));
+                this.i.en = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("textColor", igniteuiWebcomponentsCore.brushToString(this.i.en));
             },
             enumerable: false,
             configurable: true
@@ -21887,11 +21940,11 @@
              * Gets or sets the color to use for the text in disabled tool actions.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.d7);
+                return igniteuiWebcomponentsCore.brushToString(this.i.eb);
             },
             set: function (v) {
-                this.i.d7 = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("disabledTextColor", igniteuiWebcomponentsCore.brushToString(this.i.d7));
+                this.i.eb = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("disabledTextColor", igniteuiWebcomponentsCore.brushToString(this.i.eb));
             },
             enumerable: false,
             configurable: true
@@ -21901,11 +21954,11 @@
              * Gets or sets the text color for group header tool actions.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ea);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ee);
             },
             set: function (v) {
-                this.i.ea = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("groupHeaderTextColor", igniteuiWebcomponentsCore.brushToString(this.i.ea));
+                this.i.ee = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("groupHeaderTextColor", igniteuiWebcomponentsCore.brushToString(this.i.ee));
             },
             enumerable: false,
             configurable: true
@@ -21915,11 +21968,11 @@
              * Gets or sets the tooltip text color.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.el);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ep);
             },
             set: function (v) {
-                this.i.el = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("toolTipTextColor", igniteuiWebcomponentsCore.brushToString(this.i.el));
+                this.i.ep = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("toolTipTextColor", igniteuiWebcomponentsCore.brushToString(this.i.ep));
             },
             enumerable: false,
             configurable: true
@@ -21929,11 +21982,11 @@
              * Gets or sets the tooltip background color.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ek);
+                return igniteuiWebcomponentsCore.brushToString(this.i.eo);
             },
             set: function (v) {
-                this.i.ek = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("toolTipBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.ek));
+                this.i.eo = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("toolTipBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.eo));
             },
             enumerable: false,
             configurable: true
@@ -21971,11 +22024,11 @@
              * Gets or sets the fill color of icons in the ToolPanel.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ed);
+                return igniteuiWebcomponentsCore.brushToString(this.i.eh);
             },
             set: function (v) {
-                this.i.ed = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("iconFill", igniteuiWebcomponentsCore.brushToString(this.i.ed));
+                this.i.eh = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("iconFill", igniteuiWebcomponentsCore.brushToString(this.i.eh));
             },
             enumerable: false,
             configurable: true
@@ -21985,11 +22038,11 @@
              * Gets or sets the stroke color of icons in the ToolPanel.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ee);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ei);
             },
             set: function (v) {
-                this.i.ee = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("iconStroke", igniteuiWebcomponentsCore.brushToString(this.i.ee));
+                this.i.ei = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("iconStroke", igniteuiWebcomponentsCore.brushToString(this.i.ei));
             },
             enumerable: false,
             configurable: true
@@ -22182,11 +22235,11 @@
         });
         Object.defineProperty(IgcToolbarComponent.prototype, "highlightColor", {
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.eb);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ef);
             },
             set: function (v) {
-                this.i.eb = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("highlightColor", igniteuiWebcomponentsCore.brushToString(this.i.eb));
+                this.i.ef = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("highlightColor", igniteuiWebcomponentsCore.brushToString(this.i.ef));
             },
             enumerable: false,
             configurable: true
@@ -22196,11 +22249,11 @@
              * Gets or sets the stroke color for all icon menu dropdown arrows.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ef);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ej);
             },
             set: function (v) {
-                this.i.ef = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("menuArrowStroke", igniteuiWebcomponentsCore.brushToString(this.i.ef));
+                this.i.ej = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("menuArrowStroke", igniteuiWebcomponentsCore.brushToString(this.i.ej));
             },
             enumerable: false,
             configurable: true
@@ -22210,11 +22263,11 @@
              * Gets or sets the background color of the radio when in the unchecked state.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.em);
+                return igniteuiWebcomponentsCore.brushToString(this.i.eq);
             },
             set: function (v) {
-                this.i.em = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("uncheckedBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.em));
+                this.i.eq = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("uncheckedBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.eq));
             },
             enumerable: false,
             configurable: true
@@ -22224,11 +22277,11 @@
              * Gets or sets the background color of the radio when in the checked state.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.d5);
+                return igniteuiWebcomponentsCore.brushToString(this.i.d9);
             },
             set: function (v) {
-                this.i.d5 = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("checkedBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.d5));
+                this.i.d9 = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("checkedBackgroundColor", igniteuiWebcomponentsCore.brushToString(this.i.d9));
             },
             enumerable: false,
             configurable: true
@@ -22238,11 +22291,11 @@
              * Gets or sets the border color of the radio when in the unchecked state.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.en);
+                return igniteuiWebcomponentsCore.brushToString(this.i.er);
             },
             set: function (v) {
-                this.i.en = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("uncheckedBorderColor", igniteuiWebcomponentsCore.brushToString(this.i.en));
+                this.i.er = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("uncheckedBorderColor", igniteuiWebcomponentsCore.brushToString(this.i.er));
             },
             enumerable: false,
             configurable: true
@@ -22252,11 +22305,11 @@
              * Gets or sets the border color of the radio when in the checked state.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.d6);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ea);
             },
             set: function (v) {
-                this.i.d6 = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("checkedBorderColor", igniteuiWebcomponentsCore.brushToString(this.i.d6));
+                this.i.ea = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("checkedBorderColor", igniteuiWebcomponentsCore.brushToString(this.i.ea));
             },
             enumerable: false,
             configurable: true
@@ -22280,11 +22333,11 @@
              * Gets or sets the text color for subtitles.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ei);
+                return igniteuiWebcomponentsCore.brushToString(this.i.em);
             },
             set: function (v) {
-                this.i.ei = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("subtitleTextColor", igniteuiWebcomponentsCore.brushToString(this.i.ei));
+                this.i.em = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("subtitleTextColor", igniteuiWebcomponentsCore.brushToString(this.i.em));
             },
             enumerable: false,
             configurable: true
@@ -22294,11 +22347,11 @@
              * Gets or sets the text color for group header subtitles.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.d9);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ed);
             },
             set: function (v) {
-                this.i.d9 = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("groupHeaderSubtitleTextColor", igniteuiWebcomponentsCore.brushToString(this.i.d9));
+                this.i.ed = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("groupHeaderSubtitleTextColor", igniteuiWebcomponentsCore.brushToString(this.i.ed));
             },
             enumerable: false,
             configurable: true
@@ -22396,7 +22449,7 @@
 
     */
         IgcToolbarComponent.prototype.getDesiredSize = function () {
-            var iv = this.i.eo();
+            var iv = this.i.es();
             return igniteuiWebcomponentsCore.fromSize(iv);
         };
         /**
@@ -22404,27 +22457,41 @@
         
         */
         IgcToolbarComponent.prototype.closeSubmenus = function () {
-            this.i.cw();
+            this.i.cy();
         };
         IgcToolbarComponent.prototype.onCommandStateChanged = function (id, type, value) {
             this.i.onCommandStateChanged(id, (type == null ? null : type), value);
         };
         IgcToolbarComponent.prototype.registerIconFromText = function (iconCollection, iconName, iconText) {
-            this.i.dd(iconCollection, iconName, iconText);
+            this.i.dg(iconCollection, iconName, iconText);
         };
         IgcToolbarComponent.prototype.getIconFromCache = function (iconCollection, iconName) {
-            var iv = this.i.bt(iconCollection, iconName);
+            var iv = this.i.bv(iconCollection, iconName);
             return (iv);
         };
         IgcToolbarComponent.prototype.registerMultiPathSVG = function (iconCollection, iconName, multiPathSVG) {
-            this.i.de(iconCollection, iconName, multiPathSVG);
+            this.i.di(iconCollection, iconName, multiPathSVG);
         };
         IgcToolbarComponent.prototype.getMultiPathSVGFromCache = function (iconCollection, iconName) {
             var iv = this.i.a(iconCollection, iconName);
             return (iv);
         };
+        IgcToolbarComponent.prototype.registerIconFromDataURL = function (iconCollection, iconName, dataURL) {
+            this.i.df(iconCollection, iconName, dataURL);
+        };
+        IgcToolbarComponent.prototype.getDataURLFromCache = function (iconCollection, iconName) {
+            var iv = this.i.bu(iconCollection, iconName);
+            return (iv);
+        };
+        IgcToolbarComponent.prototype.registerIconSource = function (iconCollection, iconName, source) {
+            this.i.dh(iconCollection, iconName, source);
+        };
+        IgcToolbarComponent.prototype.getIconSource = function (iconCollection, iconName) {
+            var iv = this.i.bf(iconCollection, iconName);
+            return (iv);
+        };
         IgcToolbarComponent.prototype.setContextItem = function (key, value) {
-            this.i.df(key, value);
+            this.i.dj(key, value);
         };
         IgcToolbarComponent.prototype.getContextItem = function (key) {
             var iv = this.i.be(key);
@@ -22443,7 +22510,7 @@
         
         */
         IgcToolbarComponent.prototype.exportSerializedVisualData = function () {
-            var iv = this.i.bs();
+            var iv = this.i.bt();
             return (iv);
         };
         Object.defineProperty(IgcToolbarComponent.prototype, "onCommand", {
@@ -23415,11 +23482,11 @@
              * Gets or sets how long it takes before the tooltip is displayed (in milliseconds).
             */
             get: function () {
-                return this.i.ib;
+                return this.i.ic;
             },
             set: function (v) {
-                this.i.ib = +v;
-                this._a("tooltipDelay", this.i.ib);
+                this.i.ic = +v;
+                this._a("tooltipDelay", this.i.ic);
             },
             enumerable: false,
             configurable: true
@@ -23429,99 +23496,99 @@
              * Gets the actual delay before the tooltip is displayed (in milliseconds).
             */
             get: function () {
-                return this.i.ia;
+                return this.i.ib;
             },
             set: function (v) {
-                this.i.ia = +v;
-                this._a("actualTooltipDelay", this.i.ia);
+                this.i.ib = +v;
+                this._a("actualTooltipDelay", this.i.ib);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "contentPaddingLeft", {
             get: function () {
-                return this.i.h3;
+                return this.i.h4;
             },
             set: function (v) {
-                this.i.h3 = +v;
-                this._a("contentPaddingLeft", this.i.h3);
+                this.i.h4 = +v;
+                this._a("contentPaddingLeft", this.i.h4);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "actualContentPaddingLeft", {
             get: function () {
-                return this.i.hz;
+                return this.i.h0;
             },
             set: function (v) {
-                this.i.hz = +v;
-                this._a("actualContentPaddingLeft", this.i.hz);
+                this.i.h0 = +v;
+                this._a("actualContentPaddingLeft", this.i.h0);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "contentPaddingTop", {
             get: function () {
-                return this.i.h5;
+                return this.i.h6;
             },
             set: function (v) {
-                this.i.h5 = +v;
-                this._a("contentPaddingTop", this.i.h5);
+                this.i.h6 = +v;
+                this._a("contentPaddingTop", this.i.h6);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "actualContentPaddingTop", {
             get: function () {
-                return this.i.h1;
+                return this.i.h2;
             },
             set: function (v) {
-                this.i.h1 = +v;
-                this._a("actualContentPaddingTop", this.i.h1);
+                this.i.h2 = +v;
+                this._a("actualContentPaddingTop", this.i.h2);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "contentPaddingRight", {
             get: function () {
-                return this.i.h4;
+                return this.i.h5;
             },
             set: function (v) {
-                this.i.h4 = +v;
-                this._a("contentPaddingRight", this.i.h4);
+                this.i.h5 = +v;
+                this._a("contentPaddingRight", this.i.h5);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "actualContentPaddingRight", {
             get: function () {
-                return this.i.h0;
+                return this.i.h1;
             },
             set: function (v) {
-                this.i.h0 = +v;
-                this._a("actualContentPaddingRight", this.i.h0);
+                this.i.h1 = +v;
+                this._a("actualContentPaddingRight", this.i.h1);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "contentPaddingBottom", {
             get: function () {
-                return this.i.h2;
+                return this.i.h3;
             },
             set: function (v) {
-                this.i.h2 = +v;
-                this._a("contentPaddingBottom", this.i.h2);
+                this.i.h3 = +v;
+                this._a("contentPaddingBottom", this.i.h3);
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(IgcToolActionIconButtonComponent.prototype, "actualContentPaddingBottom", {
             get: function () {
-                return this.i.hy;
+                return this.i.hz;
             },
             set: function (v) {
-                this.i.hy = +v;
-                this._a("actualContentPaddingBottom", this.i.hy);
+                this.i.hz = +v;
+                this._a("actualContentPaddingBottom", this.i.hz);
             },
             enumerable: false,
             configurable: true
@@ -23635,11 +23702,11 @@
              * Gets or sets the stroke color of the arrow icon.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.ju);
+                return igniteuiWebcomponentsCore.brushToString(this.i.jv);
             },
             set: function (v) {
-                this.i.ju = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("arrowStroke", igniteuiWebcomponentsCore.brushToString(this.i.ju));
+                this.i.jv = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("arrowStroke", igniteuiWebcomponentsCore.brushToString(this.i.jv));
             },
             enumerable: false,
             configurable: true
@@ -23649,11 +23716,11 @@
              * Gets the actual stroke color of the arrow icon.
             */
             get: function () {
-                return igniteuiWebcomponentsCore.brushToString(this.i.jt);
+                return igniteuiWebcomponentsCore.brushToString(this.i.ju);
             },
             set: function (v) {
-                this.i.jt = igniteuiWebcomponentsCore.stringToBrush(v);
-                this._a("actualArrowStroke", igniteuiWebcomponentsCore.brushToString(this.i.jt));
+                this.i.ju = igniteuiWebcomponentsCore.stringToBrush(v);
+                this._a("actualArrowStroke", igniteuiWebcomponentsCore.brushToString(this.i.ju));
             },
             enumerable: false,
             configurable: true
@@ -23663,11 +23730,11 @@
              * Gets or sets whether the arrow icon should be shown.
             */
             get: function () {
-                return this.i.jg;
+                return this.i.jh;
             },
             set: function (v) {
-                this.i.jg = igniteuiWebcomponentsCore.ensureBool(v);
-                this._a("showArrowIcon", this.i.jg);
+                this.i.jh = igniteuiWebcomponentsCore.ensureBool(v);
+                this._a("showArrowIcon", this.i.jh);
             },
             enumerable: false,
             configurable: true