igniteui-webcomponents-layouts 5.3.0 → 5.4.0

package/esm2015/lib/igc-tool-panel-component.js

@@ -235,21 +235,21 @@ export let IgcToolPanelComponent = /*@__PURE__*/ (() => {
      * Gets or sets if the tool actions should display their submenus on mouse hover.
     */
         get showOnHover() {
-            return this.i.a1;
+            return this.i.a5;
         }
         set showOnHover(v) {
-            this.i.a1 = ensureBool(v);
-            this._a("showOnHover", this.i.a1);
+            this.i.a5 = ensureBool(v);
+            this._a("showOnHover", this.i.a5);
         }
         /**
          * Gets or sets if the tool action icon buttons should display their tooltips on mouse hover.
         */
         get showTooltipOnHover() {
-            return this.i.a2;
+            return this.i.a6;
         }
         set showTooltipOnHover(v) {
-            this.i.a2 = ensureBool(v);
-            this._a("showTooltipOnHover", this.i.a2);
+            this.i.a6 = ensureBool(v);
+            this._a("showTooltipOnHover", this.i.a6);
         }
         /**
          * Gets or sets the amount of time to wait when clicking on the icon menu button while the dropdown is opening. If a click was
@@ -257,51 +257,66 @@ export let IgcToolPanelComponent = /*@__PURE__*/ (() => {
          * always keep the dropdown open during a hover open and will require an extra click to close.
         */
         get dropdownClickBuffer() {
-            return this.i.ct;
+            return this.i.cz;
         }
         set dropdownClickBuffer(v) {
-            this.i.ct = +v;
-            this._a("dropdownClickBuffer", this.i.ct);
+            this.i.cz = +v;
+            this._a("dropdownClickBuffer", this.i.cz);
         }
         /**
          * Prevents clicks on the tool actions from bubbling.
         */
         get stopPropagation() {
-            return this.i.a3;
+            return this.i.a7;
         }
         set stopPropagation(v) {
-            this.i.a3 = ensureBool(v);
-            this._a("stopPropagation", this.i.a3);
+            this.i.a7 = ensureBool(v);
+            this._a("stopPropagation", this.i.a7);
         }
         /**
          * Gets or sets the text style for the panel.
         */
         get cellTextStyle() {
-            if (this.i.am == null) {
+            if (this.i.ap == null) {
                 return null;
             }
-            return this.i.am.fontString;
+            return this.i.ap.fontString;
         }
         set cellTextStyle(v) {
             let fi = new FontInfo();
             fi.fontString = v;
-            this.i.am = fi;
-            this._a("cellTextStyle", this.i.am != null ? this.i.am.fontString : "");
+            this.i.ap = fi;
+            this._a("cellTextStyle", this.i.ap != null ? this.i.ap.fontString : "");
         }
         /**
          * Gets or sets the subtitle text style for the panel.
         */
         get subtitleTextStyle() {
-            if (this.i.ao == null) {
+            if (this.i.as == null) {
                 return null;
             }
-            return this.i.ao.fontString;
+            return this.i.as.fontString;
         }
         set subtitleTextStyle(v) {
             let fi = new FontInfo();
             fi.fontString = v;
-            this.i.ao = fi;
-            this._a("subtitleTextStyle", this.i.ao != null ? this.i.ao.fontString : "");
+            this.i.as = fi;
+            this._a("subtitleTextStyle", this.i.as != null ? this.i.as.fontString : "");
+        }
+        /**
+         * Gets or sets the text style.
+        */
+        get groupHeaderTextStyle() {
+            if (this.i.ar == null) {
+                return null;
+            }
+            return this.i.ar.fontString;
+        }
+        set groupHeaderTextStyle(v) {
+            let fi = new FontInfo();
+            fi.fontString = v;
+            this.i.ar = fi;
+            this._a("groupHeaderTextStyle", this.i.ar != null ? this.i.ar.fontString : "");
         }
         /**
          * Gets or sets the base built in theme to use for the checkbox.
@@ -337,441 +352,441 @@ export let IgcToolPanelComponent = /*@__PURE__*/ (() => {
          * Gets or sets the color to use for the background of the component.
         */
         get backgroundColor() {
-            return brushToString(this.i.i3);
+            return brushToString(this.i.jc);
         }
         set backgroundColor(v) {
-            this.i.i3 = stringToBrush(v);
-            this._a("backgroundColor", brushToString(this.i.i3));
+            this.i.jc = stringToBrush(v);
+            this._a("backgroundColor", brushToString(this.i.jc));
         }
         get actualBackgroundColor() {
-            return brushToString(this.i.ih);
+            return brushToString(this.i.ir);
         }
         set actualBackgroundColor(v) {
-            this.i.ih = stringToBrush(v);
-            this._a("actualBackgroundColor", brushToString(this.i.ih));
+            this.i.ir = stringToBrush(v);
+            this._a("actualBackgroundColor", brushToString(this.i.ir));
         }
         /**
          * Gets or sets the background color for submenus.
         */
         get submenuBackgroundColor() {
-            return brushToString(this.i.jj);
+            return brushToString(this.i.js);
         }
         set submenuBackgroundColor(v) {
-            this.i.jj = stringToBrush(v);
-            this._a("submenuBackgroundColor", brushToString(this.i.jj));
+            this.i.js = stringToBrush(v);
+            this._a("submenuBackgroundColor", brushToString(this.i.js));
         }
         get actualSubmenuBackgroundColor() {
-            return brushToString(this.i.iw);
+            return brushToString(this.i.i5);
         }
         set actualSubmenuBackgroundColor(v) {
-            this.i.iw = stringToBrush(v);
-            this._a("actualSubmenuBackgroundColor", brushToString(this.i.iw));
+            this.i.i5 = stringToBrush(v);
+            this._a("actualSubmenuBackgroundColor", brushToString(this.i.i5));
         }
         /**
          * Gets or sets the group header background color.
         */
         get groupHeaderBackgroundColor() {
-            return brushToString(this.i.i9);
+            return brushToString(this.i.ji);
         }
         set groupHeaderBackgroundColor(v) {
-            this.i.i9 = stringToBrush(v);
-            this._a("groupHeaderBackgroundColor", brushToString(this.i.i9));
+            this.i.ji = stringToBrush(v);
+            this._a("groupHeaderBackgroundColor", brushToString(this.i.ji));
         }
         get actualGroupHeaderBackgroundColor() {
-            return brushToString(this.i.il);
+            return brushToString(this.i.iv);
         }
         set actualGroupHeaderBackgroundColor(v) {
-            this.i.il = stringToBrush(v);
-            this._a("actualGroupHeaderBackgroundColor", brushToString(this.i.il));
+            this.i.iv = stringToBrush(v);
+            this._a("actualGroupHeaderBackgroundColor", brushToString(this.i.iv));
         }
         /**
          * Gets or sets the separator background color.
         */
         get separatorBackgroundColor() {
-            return brushToString(this.i.ji);
+            return brushToString(this.i.jr);
         }
         set separatorBackgroundColor(v) {
-            this.i.ji = stringToBrush(v);
-            this._a("separatorBackgroundColor", brushToString(this.i.ji));
+            this.i.jr = stringToBrush(v);
+            this._a("separatorBackgroundColor", brushToString(this.i.jr));
         }
         get actualSeparatorBackgroundColor() {
-            return brushToString(this.i.iv);
+            return brushToString(this.i.i4);
         }
         set actualSeparatorBackgroundColor(v) {
-            this.i.iv = stringToBrush(v);
-            this._a("actualSeparatorBackgroundColor", brushToString(this.i.iv));
+            this.i.i4 = stringToBrush(v);
+            this._a("actualSeparatorBackgroundColor", brushToString(this.i.i4));
         }
         /**
          * Gets or sets the group header separator background color.
         */
         get groupHeaderSeparatorBackgroundColor() {
-            return brushToString(this.i.ja);
+            return brushToString(this.i.jj);
         }
         set groupHeaderSeparatorBackgroundColor(v) {
-            this.i.ja = stringToBrush(v);
-            this._a("groupHeaderSeparatorBackgroundColor", brushToString(this.i.ja));
+            this.i.jj = stringToBrush(v);
+            this._a("groupHeaderSeparatorBackgroundColor", brushToString(this.i.jj));
         }
         get actualGroupHeaderSeparatorBackgroundColor() {
-            return brushToString(this.i.im);
+            return brushToString(this.i.iw);
         }
         set actualGroupHeaderSeparatorBackgroundColor(v) {
-            this.i.im = stringToBrush(v);
-            this._a("actualGroupHeaderSeparatorBackgroundColor", brushToString(this.i.im));
+            this.i.iw = stringToBrush(v);
+            this._a("actualGroupHeaderSeparatorBackgroundColor", brushToString(this.i.iw));
         }
         /**
          * Gets or sets the hover background color.
         */
         get hoverBackgroundColor() {
-            return brushToString(this.i.je);
+            return brushToString(this.i.jn);
         }
         set hoverBackgroundColor(v) {
-            this.i.je = stringToBrush(v);
-            this._a("hoverBackgroundColor", brushToString(this.i.je));
+            this.i.jn = stringToBrush(v);
+            this._a("hoverBackgroundColor", brushToString(this.i.jn));
         }
         get actualHoverBackgroundColor() {
-            return brushToString(this.i.ir);
+            return brushToString(this.i.i0);
         }
         set actualHoverBackgroundColor(v) {
-            this.i.ir = stringToBrush(v);
-            this._a("actualHoverBackgroundColor", brushToString(this.i.ir));
+            this.i.i0 = stringToBrush(v);
+            this._a("actualHoverBackgroundColor", brushToString(this.i.i0));
         }
         /**
          * Gets or sets the color to use for the text of the component.
         */
         get textColor() {
-            return brushToString(this.i.jl);
+            return brushToString(this.i.ju);
         }
         set textColor(v) {
-            this.i.jl = stringToBrush(v);
-            this._a("textColor", brushToString(this.i.jl));
+            this.i.ju = stringToBrush(v);
+            this._a("textColor", brushToString(this.i.ju));
         }
         get actualTextColor() {
-            return brushToString(this.i.iy);
+            return brushToString(this.i.i7);
         }
         set actualTextColor(v) {
-            this.i.iy = stringToBrush(v);
-            this._a("actualTextColor", brushToString(this.i.iy));
+            this.i.i7 = stringToBrush(v);
+            this._a("actualTextColor", brushToString(this.i.i7));
         }
         get actualSubtitleTextColor() {
-            return brushToString(this.i.ix);
+            return brushToString(this.i.i6);
         }
         set actualSubtitleTextColor(v) {
-            this.i.ix = stringToBrush(v);
-            this._a("actualSubtitleTextColor", brushToString(this.i.ix));
+            this.i.i6 = stringToBrush(v);
+            this._a("actualSubtitleTextColor", brushToString(this.i.i6));
         }
         /**
          * Gets or sets the color to use for the subtitle of the component.
         */
         get subtitleTextColor() {
-            return brushToString(this.i.jk);
+            return brushToString(this.i.jt);
         }
         set subtitleTextColor(v) {
-            this.i.jk = stringToBrush(v);
-            this._a("subtitleTextColor", brushToString(this.i.jk));
+            this.i.jt = stringToBrush(v);
+            this._a("subtitleTextColor", brushToString(this.i.jt));
         }
         /**
          * Gets or sets the color to use for the text in disabled tool actions.
         */
         get disabledTextColor() {
-            return brushToString(this.i.i6);
+            return brushToString(this.i.jf);
         }
         set disabledTextColor(v) {
-            this.i.i6 = stringToBrush(v);
-            this._a("disabledTextColor", brushToString(this.i.i6));
+            this.i.jf = stringToBrush(v);
+            this._a("disabledTextColor", brushToString(this.i.jf));
         }
         get actualDisabledTextColor() {
-            return brushToString(this.i.ik);
+            return brushToString(this.i.iu);
         }
         set actualDisabledTextColor(v) {
-            this.i.ik = stringToBrush(v);
-            this._a("actualDisabledTextColor", brushToString(this.i.ik));
+            this.i.iu = stringToBrush(v);
+            this._a("actualDisabledTextColor", brushToString(this.i.iu));
         }
         /**
          * Gets or sets the text color for group header tool actions.
         */
         get groupHeaderTextColor() {
-            return brushToString(this.i.jc);
+            return brushToString(this.i.jl);
         }
         set groupHeaderTextColor(v) {
-            this.i.jc = stringToBrush(v);
-            this._a("groupHeaderTextColor", brushToString(this.i.jc));
+            this.i.jl = stringToBrush(v);
+            this._a("groupHeaderTextColor", brushToString(this.i.jl));
         }
         get actualGroupHeaderTextColor() {
-            return brushToString(this.i.ip);
+            return brushToString(this.i.iy);
         }
         set actualGroupHeaderTextColor(v) {
-            this.i.ip = stringToBrush(v);
-            this._a("actualGroupHeaderTextColor", brushToString(this.i.ip));
+            this.i.iy = stringToBrush(v);
+            this._a("actualGroupHeaderTextColor", brushToString(this.i.iy));
         }
         /**
          * Gets or sets the text color for group header subtitle.
         */
         get groupHeaderSubtitleTextColor() {
-            return brushToString(this.i.jb);
+            return brushToString(this.i.jk);
         }
         set groupHeaderSubtitleTextColor(v) {
-            this.i.jb = stringToBrush(v);
-            this._a("groupHeaderSubtitleTextColor", brushToString(this.i.jb));
+            this.i.jk = stringToBrush(v);
+            this._a("groupHeaderSubtitleTextColor", brushToString(this.i.jk));
         }
         get actualGroupHeaderSubtitleTextColor() {
-            return brushToString(this.i.io);
+            return brushToString(this.i.ix);
         }
         set actualGroupHeaderSubtitleTextColor(v) {
-            this.i.io = stringToBrush(v);
-            this._a("actualGroupHeaderSubtitleTextColor", brushToString(this.i.io));
+            this.i.ix = stringToBrush(v);
+            this._a("actualGroupHeaderSubtitleTextColor", brushToString(this.i.ix));
         }
         /**
          * Gets or sets the tooltip text color.
         */
         get toolTipTextColor() {
-            return brushToString(this.i.jn);
+            return brushToString(this.i.jw);
         }
         set toolTipTextColor(v) {
-            this.i.jn = stringToBrush(v);
-            this._a("toolTipTextColor", brushToString(this.i.jn));
+            this.i.jw = stringToBrush(v);
+            this._a("toolTipTextColor", brushToString(this.i.jw));
         }
         get actualToolTipTextColor() {
-            return brushToString(this.i.i0);
+            return brushToString(this.i.i9);
         }
         set actualToolTipTextColor(v) {
-            this.i.i0 = stringToBrush(v);
-            this._a("actualToolTipTextColor", brushToString(this.i.i0));
+            this.i.i9 = stringToBrush(v);
+            this._a("actualToolTipTextColor", brushToString(this.i.i9));
         }
         /**
          * Gets or sets the tooltip background color.
         */
         get toolTipBackgroundColor() {
-            return brushToString(this.i.jm);
+            return brushToString(this.i.jv);
         }
         set toolTipBackgroundColor(v) {
-            this.i.jm = stringToBrush(v);
-            this._a("toolTipBackgroundColor", brushToString(this.i.jm));
+            this.i.jv = stringToBrush(v);
+            this._a("toolTipBackgroundColor", brushToString(this.i.jv));
         }
         /**
          * Gets the actual tooltip background color.
         */
         get actualToolTipBackgroundColor() {
-            return brushToString(this.i.iz);
+            return brushToString(this.i.i8);
         }
         set actualToolTipBackgroundColor(v) {
-            this.i.iz = stringToBrush(v);
-            this._a("actualToolTipBackgroundColor", brushToString(this.i.iz));
+            this.i.i8 = stringToBrush(v);
+            this._a("actualToolTipBackgroundColor", brushToString(this.i.i8));
         }
         /**
          * Gets or sets the tooltip corner radius.
         */
         get toolTipCornerRadius() {
-            return this.i.cm;
+            return this.i.cs;
         }
         set toolTipCornerRadius(v) {
-            this.i.cm = +v;
-            this._a("toolTipCornerRadius", this.i.cm);
+            this.i.cs = +v;
+            this._a("toolTipCornerRadius", this.i.cs);
         }
         /**
          * Gets the actual tooltip corner radius.
         */
         get actualToolTipCornerRadius() {
-            return this.i.b8;
+            return this.i.cd;
         }
         set actualToolTipCornerRadius(v) {
-            this.i.b8 = +v;
-            this._a("actualToolTipCornerRadius", this.i.b8);
+            this.i.cd = +v;
+            this._a("actualToolTipCornerRadius", this.i.cd);
         }
         /**
          * Gets or sets the shadow elevation for the tooltip.
         */
         get toolTipElevation() {
-            return this.i.cn;
+            return this.i.ct;
         }
         set toolTipElevation(v) {
-            this.i.cn = +v;
-            this._a("toolTipElevation", this.i.cn);
+            this.i.ct = +v;
+            this._a("toolTipElevation", this.i.ct);
         }
         /**
          * Gets the actual shadow elevation used by the tooltip.
         */
         get actualToolTipElevation() {
-            return this.i.b9;
+            return this.i.ce;
         }
         set actualToolTipElevation(v) {
-            this.i.b9 = +v;
-            this._a("actualToolTipElevation", this.i.b9);
+            this.i.ce = +v;
+            this._a("actualToolTipElevation", this.i.ce);
         }
         /**
          * Gets or sets the fill color of icons in the ToolPanel.
         */
         get iconFill() {
-            return brushToString(this.i.jf);
+            return brushToString(this.i.jo);
         }
         set iconFill(v) {
-            this.i.jf = stringToBrush(v);
-            this._a("iconFill", brushToString(this.i.jf));
+            this.i.jo = stringToBrush(v);
+            this._a("iconFill", brushToString(this.i.jo));
         }
         /**
          * Gets the actual icon fill color.
         */
         get actualIconFill() {
-            return brushToString(this.i.is);
+            return brushToString(this.i.i1);
         }
         set actualIconFill(v) {
-            this.i.is = stringToBrush(v);
-            this._a("actualIconFill", brushToString(this.i.is));
+            this.i.i1 = stringToBrush(v);
+            this._a("actualIconFill", brushToString(this.i.i1));
         }
         /**
          * Gets or sets the stroke color of icons in the ToolPanel.
         */
         get iconStroke() {
-            return brushToString(this.i.jg);
+            return brushToString(this.i.jp);
         }
         set iconStroke(v) {
-            this.i.jg = stringToBrush(v);
-            this._a("iconStroke", brushToString(this.i.jg));
+            this.i.jp = stringToBrush(v);
+            this._a("iconStroke", brushToString(this.i.jp));
         }
         /**
          * Gets the actual icon stroke color.
         */
         get actualIconStroke() {
-            return brushToString(this.i.it);
+            return brushToString(this.i.i2);
         }
         set actualIconStroke(v) {
-            this.i.it = stringToBrush(v);
-            this._a("actualIconStroke", brushToString(this.i.it));
+            this.i.i2 = stringToBrush(v);
+            this._a("actualIconStroke", brushToString(this.i.i2));
         }
         /**
          * Gets or sets the left padding for separators in the vertical orientation.
         */
         get separatorVerticalPaddingLeft() {
-            return this.i.cj;
+            return this.i.cp;
         }
         set separatorVerticalPaddingLeft(v) {
-            this.i.cj = +v;
-            this._a("separatorVerticalPaddingLeft", this.i.cj);
+            this.i.cp = +v;
+            this._a("separatorVerticalPaddingLeft", this.i.cp);
         }
         get actualSeparatorVerticalPaddingLeft() {
-            return this.i.b5;
+            return this.i.ca;
         }
         set actualSeparatorVerticalPaddingLeft(v) {
-            this.i.b5 = +v;
-            this._a("actualSeparatorVerticalPaddingLeft", this.i.b5);
+            this.i.ca = +v;
+            this._a("actualSeparatorVerticalPaddingLeft", this.i.ca);
         }
         /**
          * Gets or sets the right padding for separators in the vertical orientation.
         */
         get separatorVerticalPaddingRight() {
-            return this.i.ck;
+            return this.i.cq;
         }
         set separatorVerticalPaddingRight(v) {
-            this.i.ck = +v;
-            this._a("separatorVerticalPaddingRight", this.i.ck);
+            this.i.cq = +v;
+            this._a("separatorVerticalPaddingRight", this.i.cq);
         }
         get actualSeparatorVerticalPaddingRight() {
-            return this.i.b6;
+            return this.i.cb;
         }
         set actualSeparatorVerticalPaddingRight(v) {
-            this.i.b6 = +v;
-            this._a("actualSeparatorVerticalPaddingRight", this.i.b6);
+            this.i.cb = +v;
+            this._a("actualSeparatorVerticalPaddingRight", this.i.cb);
         }
         /**
          * Gets or sets the top padding for separators in the vertical orientation.
         */
         get separatorVerticalPaddingTop() {
-            return this.i.cl;
+            return this.i.cr;
         }
         set separatorVerticalPaddingTop(v) {
-            this.i.cl = +v;
-            this._a("separatorVerticalPaddingTop", this.i.cl);
+            this.i.cr = +v;
+            this._a("separatorVerticalPaddingTop", this.i.cr);
         }
         get actualSeparatorVerticalPaddingTop() {
-            return this.i.b7;
+            return this.i.cc;
         }
         set actualSeparatorVerticalPaddingTop(v) {
-            this.i.b7 = +v;
-            this._a("actualSeparatorVerticalPaddingTop", this.i.b7);
+            this.i.cc = +v;
+            this._a("actualSeparatorVerticalPaddingTop", this.i.cc);
         }
         /**
          * Gets or sets the bottom padding for separators in the vertical orientation.
         */
         get separatorVerticalPaddingBottom() {
-            return this.i.ci;
+            return this.i.co;
         }
         set separatorVerticalPaddingBottom(v) {
-            this.i.ci = +v;
-            this._a("separatorVerticalPaddingBottom", this.i.ci);
+            this.i.co = +v;
+            this._a("separatorVerticalPaddingBottom", this.i.co);
         }
         get actualSeparatorVerticalPaddingBottom() {
-            return this.i.b4;
+            return this.i.b9;
         }
         set actualSeparatorVerticalPaddingBottom(v) {
-            this.i.b4 = +v;
-            this._a("actualSeparatorVerticalPaddingBottom", this.i.b4);
+            this.i.b9 = +v;
+            this._a("actualSeparatorVerticalPaddingBottom", this.i.b9);
         }
         /**
          * Gets or sets the left padding for separators in the horizontal orientation.
         */
         get separatorHorizontalPaddingLeft() {
-            return this.i.cf;
+            return this.i.cl;
         }
         set separatorHorizontalPaddingLeft(v) {
-            this.i.cf = +v;
-            this._a("separatorHorizontalPaddingLeft", this.i.cf);
+            this.i.cl = +v;
+            this._a("separatorHorizontalPaddingLeft", this.i.cl);
         }
         get actualSeparatorHorizontalPaddingLeft() {
-            return this.i.b1;
+            return this.i.b6;
         }
         set actualSeparatorHorizontalPaddingLeft(v) {
-            this.i.b1 = +v;
-            this._a("actualSeparatorHorizontalPaddingLeft", this.i.b1);
+            this.i.b6 = +v;
+            this._a("actualSeparatorHorizontalPaddingLeft", this.i.b6);
         }
         /**
          * Gets or sets the right padding for separators in the horizontal orientation.
         */
         get separatorHorizontalPaddingRight() {
-            return this.i.cg;
+            return this.i.cm;
         }
         set separatorHorizontalPaddingRight(v) {
-            this.i.cg = +v;
-            this._a("separatorHorizontalPaddingRight", this.i.cg);
+            this.i.cm = +v;
+            this._a("separatorHorizontalPaddingRight", this.i.cm);
         }
         get actualSeparatorHorizontalPaddingRight() {
-            return this.i.b2;
+            return this.i.b7;
         }
         set actualSeparatorHorizontalPaddingRight(v) {
-            this.i.b2 = +v;
-            this._a("actualSeparatorHorizontalPaddingRight", this.i.b2);
+            this.i.b7 = +v;
+            this._a("actualSeparatorHorizontalPaddingRight", this.i.b7);
         }
         /**
          * Gets or sets the top padding for separators in the horizontal orientation.
         */
         get separatorHorizontalPaddingTop() {
-            return this.i.ch;
+            return this.i.cn;
         }
         set separatorHorizontalPaddingTop(v) {
-            this.i.ch = +v;
-            this._a("separatorHorizontalPaddingTop", this.i.ch);
+            this.i.cn = +v;
+            this._a("separatorHorizontalPaddingTop", this.i.cn);
         }
         get actualSeparatorHorizontalPaddingTop() {
-            return this.i.b3;
+            return this.i.b8;
         }
         set actualSeparatorHorizontalPaddingTop(v) {
-            this.i.b3 = +v;
-            this._a("actualSeparatorHorizontalPaddingTop", this.i.b3);
+            this.i.b8 = +v;
+            this._a("actualSeparatorHorizontalPaddingTop", this.i.b8);
         }
         /**
          * Gets or sets the bottom padding for separators in the horizontal orientation.
         */
         get separatorHorizontalPaddingBottom() {
-            return this.i.ce;
+            return this.i.ck;
         }
         set separatorHorizontalPaddingBottom(v) {
-            this.i.ce = +v;
-            this._a("separatorHorizontalPaddingBottom", this.i.ce);
+            this.i.ck = +v;
+            this._a("separatorHorizontalPaddingBottom", this.i.ck);
         }
         get actualSeparatorHorizontalPaddingBottom() {
-            return this.i.b0;
+            return this.i.b5;
         }
         set actualSeparatorHorizontalPaddingBottom(v) {
-            this.i.b0 = +v;
-            this._a("actualSeparatorHorizontalPaddingBottom", this.i.b0);
+            this.i.b5 = +v;
+            this._a("actualSeparatorHorizontalPaddingBottom", this.i.b5);
         }
         /**
          * Gets or sets the color to use for the background of the component.
@@ -787,179 +802,179 @@ export let IgcToolPanelComponent = /*@__PURE__*/ (() => {
          * Gets or sets the row height for the panel.
         */
         get rowHeight() {
-            return this.i.cx;
+            return this.i.c3;
         }
         set rowHeight(v) {
-            this.i.cx = +v;
-            this._a("rowHeight", this.i.cx);
+            this.i.c3 = +v;
+            this._a("rowHeight", this.i.c3);
         }
         /**
          * Gets the actual row height used by the panel.
         */
         get actualRowHeight() {
-            return this.i.bz;
+            return this.i.b4;
         }
         get highlightWidth() {
-            return this.i.cd;
+            return this.i.ci;
         }
         set highlightWidth(v) {
-            this.i.cd = +v;
-            this._a("highlightWidth", this.i.cd);
+            this.i.ci = +v;
+            this._a("highlightWidth", this.i.ci);
         }
         get actualHighlightWidth() {
-            return this.i.by;
+            return this.i.b3;
         }
         set actualHighlightWidth(v) {
-            this.i.by = +v;
-            this._a("actualHighlightWidth", this.i.by);
+            this.i.b3 = +v;
+            this._a("actualHighlightWidth", this.i.b3);
         }
         get highlightRadius() {
-            return this.i.cc;
+            return this.i.ch;
         }
         set highlightRadius(v) {
-            this.i.cc = +v;
-            this._a("highlightRadius", this.i.cc);
+            this.i.ch = +v;
+            this._a("highlightRadius", this.i.ch);
         }
         get actualHighlightRadius() {
-            return this.i.bx;
+            return this.i.b2;
         }
         set actualHighlightRadius(v) {
-            this.i.bx = +v;
-            this._a("actualHighlightRadius", this.i.bx);
+            this.i.b2 = +v;
+            this._a("actualHighlightRadius", this.i.b2);
         }
         get highlightColor() {
-            return brushToString(this.i.jd);
+            return brushToString(this.i.jm);
         }
         set highlightColor(v) {
-            this.i.jd = stringToBrush(v);
-            this._a("highlightColor", brushToString(this.i.jd));
+            this.i.jm = stringToBrush(v);
+            this._a("highlightColor", brushToString(this.i.jm));
         }
         get actualHighlightColor() {
-            return brushToString(this.i.iq);
+            return brushToString(this.i.iz);
         }
         set actualHighlightColor(v) {
-            this.i.iq = stringToBrush(v);
-            this._a("actualHighlightColor", brushToString(this.i.iq));
+            this.i.iz = stringToBrush(v);
+            this._a("actualHighlightColor", brushToString(this.i.iz));
         }
         /**
          * Gets or sets the stroke color for all icon menu dropdown arrows.
         */
         get menuArrowStroke() {
-            return brushToString(this.i.jh);
+            return brushToString(this.i.jq);
         }
         set menuArrowStroke(v) {
-            this.i.jh = stringToBrush(v);
-            this._a("menuArrowStroke", brushToString(this.i.jh));
+            this.i.jq = stringToBrush(v);
+            this._a("menuArrowStroke", brushToString(this.i.jq));
         }
         /**
          * Gets the actual stroke color for all icon menu dropdown arrows.
         */
         get actualMenuArrowStroke() {
-            return brushToString(this.i.iu);
+            return brushToString(this.i.i3);
         }
         set actualMenuArrowStroke(v) {
-            this.i.iu = stringToBrush(v);
-            this._a("actualMenuArrowStroke", brushToString(this.i.iu));
+            this.i.i3 = stringToBrush(v);
+            this._a("actualMenuArrowStroke", brushToString(this.i.i3));
         }
         /**
          * Gets or sets the background color of the radio when in the unchecked state.
         */
         get uncheckedBackgroundColor() {
-            return brushToString(this.i.jo);
+            return brushToString(this.i.jx);
         }
         set uncheckedBackgroundColor(v) {
-            this.i.jo = stringToBrush(v);
-            this._a("uncheckedBackgroundColor", brushToString(this.i.jo));
+            this.i.jx = stringToBrush(v);
+            this._a("uncheckedBackgroundColor", brushToString(this.i.jx));
         }
         /**
          * Gets the actual background color of the radio when in the unchecked state.
         */
         get actualUncheckedBackgroundColor() {
-            return brushToString(this.i.i1);
+            return brushToString(this.i.ja);
         }
         set actualUncheckedBackgroundColor(v) {
-            this.i.i1 = stringToBrush(v);
-            this._a("actualUncheckedBackgroundColor", brushToString(this.i.i1));
+            this.i.ja = stringToBrush(v);
+            this._a("actualUncheckedBackgroundColor", brushToString(this.i.ja));
         }
         /**
          * Gets or sets the background color of the radio when in the checked state.
         */
         get checkedBackgroundColor() {
-            return brushToString(this.i.i4);
+            return brushToString(this.i.jd);
         }
         set checkedBackgroundColor(v) {
-            this.i.i4 = stringToBrush(v);
-            this._a("checkedBackgroundColor", brushToString(this.i.i4));
+            this.i.jd = stringToBrush(v);
+            this._a("checkedBackgroundColor", brushToString(this.i.jd));
         }
         /**
          * Gets the actual background color of the radio when in the checked state.
         */
         get actualCheckedBackgroundColor() {
-            return brushToString(this.i.ii);
+            return brushToString(this.i.is);
         }
         set actualCheckedBackgroundColor(v) {
-            this.i.ii = stringToBrush(v);
-            this._a("actualCheckedBackgroundColor", brushToString(this.i.ii));
+            this.i.is = stringToBrush(v);
+            this._a("actualCheckedBackgroundColor", brushToString(this.i.is));
         }
         /**
          * Gets or sets the border color of the radio when in the unchecked state.
         */
         get uncheckedBorderColor() {
-            return brushToString(this.i.jp);
+            return brushToString(this.i.jy);
         }
         set uncheckedBorderColor(v) {
-            this.i.jp = stringToBrush(v);
-            this._a("uncheckedBorderColor", brushToString(this.i.jp));
+            this.i.jy = stringToBrush(v);
+            this._a("uncheckedBorderColor", brushToString(this.i.jy));
         }
         /**
          * Gets the actual border color of the radio when in the unchecked state.
         */
         get actualUncheckedBorderColor() {
-            return brushToString(this.i.i2);
+            return brushToString(this.i.jb);
         }
         set actualUncheckedBorderColor(v) {
-            this.i.i2 = stringToBrush(v);
-            this._a("actualUncheckedBorderColor", brushToString(this.i.i2));
+            this.i.jb = stringToBrush(v);
+            this._a("actualUncheckedBorderColor", brushToString(this.i.jb));
         }
         /**
          * Gets or sets the border color of the radio when in the checked state.
         */
         get checkedBorderColor() {
-            return brushToString(this.i.i5);
+            return brushToString(this.i.je);
         }
         set checkedBorderColor(v) {
-            this.i.i5 = stringToBrush(v);
-            this._a("checkedBorderColor", brushToString(this.i.i5));
+            this.i.je = stringToBrush(v);
+            this._a("checkedBorderColor", brushToString(this.i.je));
         }
         /**
          * Gets the actual border color of the radio when in the checked state.
         */
         get actualCheckedBorderColor() {
-            return brushToString(this.i.ij);
+            return brushToString(this.i.it);
         }
         set actualCheckedBorderColor(v) {
-            this.i.ij = stringToBrush(v);
-            this._a("actualCheckedBorderColor", brushToString(this.i.ij));
+            this.i.it = stringToBrush(v);
+            this._a("actualCheckedBorderColor", brushToString(this.i.it));
         }
         /**
          * Gets or sets the dropdown delay time in milliseconds.
         */
         get dropdownDelay() {
-            return this.i.cu;
+            return this.i.c0;
         }
         set dropdownDelay(v) {
-            this.i.cu = +v;
-            this._a("dropdownDelay", this.i.cu);
+            this.i.c0 = +v;
+            this._a("dropdownDelay", this.i.c0);
         }
         /**
          * Gets the actual dropdown delay.
         */
         get actualDropdownDelay() {
-            return this.i.cs;
+            return this.i.cy;
         }
         set actualDropdownDelay(v) {
-            this.i.cs = +v;
-            this._a("actualDropdownDelay", this.i.cs);
+            this.i.cy = +v;
+            this._a("actualDropdownDelay", this.i.cy);
         }
         /**
          * Gets or sets the style of scrollbar.
@@ -971,6 +986,16 @@ export let IgcToolPanelComponent = /*@__PURE__*/ (() => {
             this.i.x = ensureEnum(ScrollbarStyle_$type, v);
             this._a("scrollbarStyle", enumToString(ScrollbarStyle_$type, this.i.x));
         }
+        /**
+         * Gets or sets the spacing between items
+        */
+        get itemSpacing() {
+            return this.i.cj;
+        }
+        set itemSpacing(v) {
+            this.i.cj = +v;
+            this._a("itemSpacing", this.i.cj);
+        }
         /**
          * Gets or sets the mode used when displaying nested actions.
         */
@@ -982,7 +1007,7 @@ export let IgcToolPanelComponent = /*@__PURE__*/ (() => {
             this._a("nestedActionMode", enumToString(NestedActionMode_$type, this.i.g));
         }
         get isOpen() {
-            return this.i.a0;
+            return this.i.a4;
         }
         findByName(name) {
             if (this.findEphemera) {
@@ -1049,84 +1074,84 @@ export let IgcToolPanelComponent = /*@__PURE__*/ (() => {
             this._inStyling = false;
         }
         refresh() {
-            this.i.gi();
+            this.i.gr();
         }
         getDesiredSize() {
-            let iv = this.i.js();
+            let iv = this.i.j1();
             return fromSize(iv);
         }
         flushRefresh() {
-            this.i.fz();
+            this.i.f8();
         }
         /**
          * Forces any open sub menus to close.
         
         */
         closeSubmenus() {
-            this.i.fu();
+            this.i.f3();
         }
         exportVisualData() {
-            let iv = this.i.cy();
+            let iv = this.i.c4();
             return (iv);
         }
         exportSerializedVisualData() {
-            let iv = this.i.ei();
+            let iv = this.i.ep();
             return (iv);
         }
         setBrushContextItem(key, value) {
-            this.i.gr(key, stringToBrush(value));
+            this.i.g0(key, stringToBrush(value));
         }
         getBrushContextItem(key) {
-            let iv = this.i.i7(key);
+            let iv = this.i.jg(key);
             return brushToString(iv);
         }
         setBrushCollectionContextItem(key, value) {
-            this.i.gp(key, toBrushCollection(value));
+            this.i.gy(key, toBrushCollection(value));
         }
         getBrushCollectionContextItem(key) {
             let iv = this.i.a(key);
             return fromBrushCollection(iv);
         }
         setDoubleContextItem(key, value) {
-            this.i.gz(key, value);
+            this.i.g8(key, value);
         }
         getDoubleContextItem(key) {
-            let iv = this.i.ca(key);
+            let iv = this.i.cf(key);
             return (iv);
         }
         setIntContextItem(key, value) {
-            this.i.g1(key, value);
+            this.i.ha(key, value);
         }
         getIntContextItem(key) {
-            let iv = this.i.cv(key);
+            let iv = this.i.c1(key);
             return (iv);
         }
         setStringContextItem(key, value) {
-            this.i.g3(key, value);
+            this.i.hc(key, value);
         }
         getStringContextItem(key) {
-            let iv = this.i.ej(key);
+            let iv = this.i.eq(key);
             return (iv);
         }
         setBoolContextItem(key, value) {
-            this.i.gn(key, value);
+            this.i.gw(key, value);
         }
         getBoolContextItem(key) {
-            let iv = this.i.ax(key);
+            let iv = this.i.a1(key);
             return (iv);
         }
         setColorContextItem(key, value) {
-            this.i.gt(key, stringToColor(value));
+            this.i.g2(key, stringToColor(value));
         }
         getColorContextItem(key) {
-            let iv = this.i.jq(key);
+            let iv = this.i.jz(key);
             return colorToString(iv);
         }
         setDataContextItem(key, value) {
-            this.i.gx(key, value);
+            this.i.g6(key, value);
         }
         getDataContextItem(key) {
-            let iv = this.i.c1(key);
+            let iv = this.i.c7(key);
             return (iv);
         }
         get contentRefreshed() {