igniteui-webcomponents-charts 4.7.2 → 4.8.1-alpha.0

package/esm5/lib/igc-treemap-component.js

@@ -22,6 +22,7 @@ import { VerticalAlignment_$type } from "igniteui-webcomponents-core";
 import { TreemapLabelHorizontalFitMode_$type } from './TreemapLabelHorizontalFitMode';
 import { TreemapLabelVerticalFitMode_$type } from './TreemapLabelVerticalFitMode';
 import { TreemapHighlightingMode_$type } from './TreemapHighlightingMode';
+import { TreemapHighlightedValueDisplayMode_$type } from './TreemapHighlightedValueDisplayMode';
 import { IgcHTMLElement } from "igniteui-webcomponents-core";
 var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
     __extends(IgcTreemapComponent, _super);
@@ -319,10 +320,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
      * Gets or sets path to use to get the values from the items.
     */
         get: function () {
-            return this.i.g3;
+            return this.i.hx;
         },
         set: function (v) {
-            this.i.g3 = v;
+            this.i.hx = v;
         },
         enumerable: false,
         configurable: true
@@ -332,10 +333,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the root title to use for breadcrumbs.
         */
         get: function () {
-            return this.i.gt;
+            return this.i.hn;
         },
         set: function (v) {
-            this.i.gt = v;
+            this.i.hn = v;
         },
         enumerable: false,
         configurable: true
@@ -345,10 +346,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the root title to use for breadcrumbs.
         */
         get: function () {
-            return this.i.ev;
+            return this.i.fh;
         },
         set: function (v) {
-            this.i.ev = v;
+            this.i.fh = v;
         },
         enumerable: false,
         configurable: true
@@ -358,10 +359,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the path to use to get the Parent of the items.
         */
         get: function () {
-            return this.i.gh;
+            return this.i.hb;
         },
         set: function (v) {
-            this.i.gh = v;
+            this.i.hb = v;
         },
         enumerable: false,
         configurable: true
@@ -371,10 +372,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the path to use to get the Label of the items.
         */
         get: function () {
-            return this.i.fz;
+            return this.i.gt;
         },
         set: function (v) {
-            this.i.fz = v;
+            this.i.gt = v;
         },
         enumerable: false,
         configurable: true
@@ -384,10 +385,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the path to use to get the custom value of the items.
         */
         get: function () {
-            return this.i.ey;
+            return this.i.fk;
         },
         set: function (v) {
-            this.i.ey = v;
+            this.i.fk = v;
         },
         enumerable: false,
         configurable: true
@@ -397,10 +398,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the path to use to get the id of the items.
         */
         get: function () {
-            return this.i.fp;
+            return this.i.gj;
         },
         set: function (v) {
-            this.i.fp = v;
+            this.i.gj = v;
         },
         enumerable: false,
         configurable: true
@@ -418,6 +419,60 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(IgcTreemapComponent.prototype, "highlightedDataSource", {
+        /**
+         * Gets or sets the data to highlight.
+        */
+        get: function () {
+            return this.i.highlightedDataSource;
+        },
+        set: function (v) {
+            this.i.highlightedDataSource = v;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcTreemapComponent.prototype, "highlightedValueMemberPath", {
+        /**
+         * Gets or sets the highlighted value mapping property.
+        */
+        get: function () {
+            return this.i.gb;
+        },
+        set: function (v) {
+            this.i.gb = v;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcTreemapComponent.prototype, "highlightedValueOpacity", {
+        /**
+         * Gets or sets the opacity applied to the node underneath the highlighted value.
+        */
+        get: function () {
+            return this.i.dt;
+        },
+        set: function (v) {
+            this.i.dt = +v;
+            this._a("highlightedValueOpacity", this.i.dt);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcTreemapComponent.prototype, "highlightedValuesDisplayMode", {
+        /**
+         * Gets or sets the display mode for highlighted values.
+        */
+        get: function () {
+            return this.i.l;
+        },
+        set: function (v) {
+            this.i.l = ensureEnum(TreemapHighlightedValueDisplayMode_$type, v);
+            this._a("highlightedValuesDisplayMode", enumToString(TreemapHighlightedValueDisplayMode_$type, this.i.l));
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(IgcTreemapComponent.prototype, "fillBrushes", {
         /**
          * Gets or sets brushes to use for the fill scale.
@@ -451,11 +506,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets whether the fill scale is logarithmic.
         */
         get: function () {
-            return this.i.bq;
+            return this.i.bx;
         },
         set: function (v) {
-            this.i.bq = ensureBool(v);
-            this._a("isFillScaleLogarithmic", this.i.bq);
+            this.i.bx = ensureBool(v);
+            this._a("isFillScaleLogarithmic", this.i.bx);
         },
         enumerable: false,
         configurable: true
@@ -465,11 +520,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the logarithm base to use if the fill scale is logarithmic.
         */
         get: function () {
-            return this.i.ee;
+            return this.i.ez;
         },
         set: function (v) {
-            this.i.ee = +v;
-            this._a("fillScaleLogarithmBase", this.i.ee);
+            this.i.ez = +v;
+            this._a("fillScaleLogarithmBase", this.i.ez);
         },
         enumerable: false,
         configurable: true
@@ -479,11 +534,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the minimum value to use for the fill scale.
         */
         get: function () {
-            return this.i.c6;
+            return this.i.dl;
         },
         set: function (v) {
-            this.i.c6 = +v;
-            this._a("fillScaleMinimumValue", this.i.c6);
+            this.i.dl = +v;
+            this._a("fillScaleMinimumValue", this.i.dl);
         },
         enumerable: false,
         configurable: true
@@ -493,11 +548,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the maximum value to use for the fill scale.
         */
         get: function () {
-            return this.i.c5;
+            return this.i.dk;
         },
         set: function (v) {
-            this.i.c5 = +v;
-            this._a("fillScaleMaximumValue", this.i.c5);
+            this.i.dk = +v;
+            this._a("fillScaleMaximumValue", this.i.dk);
         },
         enumerable: false,
         configurable: true
@@ -507,11 +562,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the vertical fit mode to use for the node labels.
         */
         get: function () {
-            return this.i.p;
+            return this.i.r;
         },
         set: function (v) {
-            this.i.p = ensureEnum(TreemapLabelVerticalFitMode_$type, v);
-            this._a("labelVerticalFitMode", enumToString(TreemapLabelVerticalFitMode_$type, this.i.p));
+            this.i.r = ensureEnum(TreemapLabelVerticalFitMode_$type, v);
+            this._a("labelVerticalFitMode", enumToString(TreemapLabelVerticalFitMode_$type, this.i.r));
         },
         enumerable: false,
         configurable: true
@@ -521,11 +576,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the horizontal fit mode to use for the node labels.
         */
         get: function () {
-            return this.i.m;
+            return this.i.o;
         },
         set: function (v) {
-            this.i.m = ensureEnum(TreemapLabelHorizontalFitMode_$type, v);
-            this._a("labelHorizontalFitMode", enumToString(TreemapLabelHorizontalFitMode_$type, this.i.m));
+            this.i.o = ensureEnum(TreemapLabelHorizontalFitMode_$type, v);
+            this._a("labelHorizontalFitMode", enumToString(TreemapLabelHorizontalFitMode_$type, this.i.o));
         },
         enumerable: false,
         configurable: true
@@ -535,11 +590,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the background to use for the overlay header when it is hovered.
         */
         get: function () {
-            return brushToString(this.i.i2);
+            return brushToString(this.i.jx);
         },
         set: function (v) {
-            this.i.i2 = stringToBrush(v);
-            this._a("overlayHeaderHoverBackground", brushToString(this.i.i2));
+            this.i.jx = stringToBrush(v);
+            this._a("overlayHeaderHoverBackground", brushToString(this.i.jx));
         },
         enumerable: false,
         configurable: true
@@ -549,11 +604,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the background to use for the header when it is hovered.
         */
         get: function () {
-            return brushToString(this.i.iw);
+            return brushToString(this.i.jr);
         },
         set: function (v) {
-            this.i.iw = stringToBrush(v);
-            this._a("headerHoverBackground", brushToString(this.i.iw));
+            this.i.jr = stringToBrush(v);
+            this._a("headerHoverBackground", brushToString(this.i.jr));
         },
         enumerable: false,
         configurable: true
@@ -563,11 +618,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the background to use for the header.
         */
         get: function () {
-            return brushToString(this.i.iu);
+            return brushToString(this.i.jp);
         },
         set: function (v) {
-            this.i.iu = stringToBrush(v);
-            this._a("headerBackground", brushToString(this.i.iu));
+            this.i.jp = stringToBrush(v);
+            this._a("headerBackground", brushToString(this.i.jp));
         },
         enumerable: false,
         configurable: true
@@ -577,11 +632,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the background to use for the overlay header.
         */
         get: function () {
-            return brushToString(this.i.i1);
+            return brushToString(this.i.jw);
         },
         set: function (v) {
-            this.i.i1 = stringToBrush(v);
-            this._a("overlayHeaderBackground", brushToString(this.i.i1));
+            this.i.jw = stringToBrush(v);
+            this._a("overlayHeaderBackground", brushToString(this.i.jw));
         },
         enumerable: false,
         configurable: true
@@ -591,11 +646,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the text color to use for the header.
         */
         get: function () {
-            return brushToString(this.i.iz);
+            return brushToString(this.i.ju);
         },
         set: function (v) {
-            this.i.iz = stringToBrush(v);
-            this._a("headerTextColor", brushToString(this.i.iz));
+            this.i.ju = stringToBrush(v);
+            this._a("headerTextColor", brushToString(this.i.ju));
         },
         enumerable: false,
         configurable: true
@@ -605,11 +660,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the dark text color to use for the header.
         */
         get: function () {
-            return brushToString(this.i.iv);
+            return brushToString(this.i.jq);
         },
         set: function (v) {
-            this.i.iv = stringToBrush(v);
-            this._a("headerDarkTextColor", brushToString(this.i.iv));
+            this.i.jq = stringToBrush(v);
+            this._a("headerDarkTextColor", brushToString(this.i.jq));
         },
         enumerable: false,
         configurable: true
@@ -619,11 +674,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the text color to use for the nodes.
         */
         get: function () {
-            return brushToString(this.i.jc);
+            return brushToString(this.i.j7);
         },
         set: function (v) {
-            this.i.jc = stringToBrush(v);
-            this._a("textColor", brushToString(this.i.jc));
+            this.i.j7 = stringToBrush(v);
+            this._a("textColor", brushToString(this.i.j7));
         },
         enumerable: false,
         configurable: true
@@ -633,11 +688,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the dark text color to use for the nodes.
         */
         get: function () {
-            return brushToString(this.i.it);
+            return brushToString(this.i.jo);
         },
         set: function (v) {
-            this.i.it = stringToBrush(v);
-            this._a("darkTextColor", brushToString(this.i.it));
+            this.i.jo = stringToBrush(v);
+            this._a("darkTextColor", brushToString(this.i.jo));
         },
         enumerable: false,
         configurable: true
@@ -647,11 +702,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the text color to use for the header.
         */
         get: function () {
-            return brushToString(this.i.iy);
+            return brushToString(this.i.jt);
         },
         set: function (v) {
-            this.i.iy = stringToBrush(v);
-            this._a("headerHoverTextColor", brushToString(this.i.iy));
+            this.i.jt = stringToBrush(v);
+            this._a("headerHoverTextColor", brushToString(this.i.jt));
         },
         enumerable: false,
         configurable: true
@@ -661,11 +716,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the dark text color to use for the header when hovered.
         */
         get: function () {
-            return brushToString(this.i.ix);
+            return brushToString(this.i.js);
         },
         set: function (v) {
-            this.i.ix = stringToBrush(v);
-            this._a("headerHoverDarkTextColor", brushToString(this.i.ix));
+            this.i.js = stringToBrush(v);
+            this._a("headerHoverDarkTextColor", brushToString(this.i.js));
         },
         enumerable: false,
         configurable: true
@@ -675,16 +730,16 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the font to use for content nodes
         */
         get: function () {
-            if (this.i.a4 == null) {
+            if (this.i.a8 == null) {
                 return null;
             }
-            return this.i.a4.fontString;
+            return this.i.a8.fontString;
         },
         set: function (v) {
             var fi = new FontInfo();
             fi.fontString = v;
-            this.i.a4 = fi;
-            this._a("textStyle", this.i.a4 != null ? this.i.a4.fontString : "");
+            this.i.a8 = fi;
+            this._a("textStyle", this.i.a8 != null ? this.i.a8.fontString : "");
         },
         enumerable: false,
         configurable: true
@@ -694,16 +749,16 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the font to use for header nodes
         */
         get: function () {
-            if (this.i.a2 == null) {
+            if (this.i.a6 == null) {
                 return null;
             }
-            return this.i.a2.fontString;
+            return this.i.a6.fontString;
         },
         set: function (v) {
             var fi = new FontInfo();
             fi.fontString = v;
-            this.i.a2 = fi;
-            this._a("headerTextStyle", this.i.a2 != null ? this.i.a2.fontString : "");
+            this.i.a6 = fi;
+            this._a("headerTextStyle", this.i.a6 != null ? this.i.a6.fontString : "");
         },
         enumerable: false,
         configurable: true
@@ -727,11 +782,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the left margin to use for the header.
         */
         get: function () {
-            return this.i.da;
+            return this.i.dq;
         },
         set: function (v) {
-            this.i.da = +v;
-            this._a("headerLabelLeftMargin", this.i.da);
+            this.i.dq = +v;
+            this._a("headerLabelLeftMargin", this.i.dq);
         },
         enumerable: false,
         configurable: true
@@ -741,11 +796,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the top margin to use for the header.
         */
         get: function () {
-            return this.i.dc;
+            return this.i.ds;
         },
         set: function (v) {
-            this.i.dc = +v;
-            this._a("headerLabelTopMargin", this.i.dc);
+            this.i.ds = +v;
+            this._a("headerLabelTopMargin", this.i.ds);
         },
         enumerable: false,
         configurable: true
@@ -755,11 +810,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the right margin to use for the header.
         */
         get: function () {
-            return this.i.db;
+            return this.i.dr;
         },
         set: function (v) {
-            this.i.db = +v;
-            this._a("headerLabelRightMargin", this.i.db);
+            this.i.dr = +v;
+            this._a("headerLabelRightMargin", this.i.dr);
         },
         enumerable: false,
         configurable: true
@@ -769,11 +824,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the bottom margin to use for the header.
         */
         get: function () {
-            return this.i.c9;
+            return this.i.dp;
         },
         set: function (v) {
-            this.i.c9 = +v;
-            this._a("headerLabelBottomMargin", this.i.c9);
+            this.i.dp = +v;
+            this._a("headerLabelBottomMargin", this.i.dp);
         },
         enumerable: false,
         configurable: true
@@ -783,11 +838,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the left margin to use for the overlay header.
         */
         get: function () {
-            return this.i.dl;
+            return this.i.d3;
         },
         set: function (v) {
-            this.i.dl = +v;
-            this._a("overlayHeaderLabelLeftMargin", this.i.dl);
+            this.i.d3 = +v;
+            this._a("overlayHeaderLabelLeftMargin", this.i.d3);
         },
         enumerable: false,
         configurable: true
@@ -797,11 +852,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the top margin to use for the overlay header.
         */
         get: function () {
-            return this.i.dn;
+            return this.i.d5;
         },
         set: function (v) {
-            this.i.dn = +v;
-            this._a("overlayHeaderLabelTopMargin", this.i.dn);
+            this.i.d5 = +v;
+            this._a("overlayHeaderLabelTopMargin", this.i.d5);
         },
         enumerable: false,
         configurable: true
@@ -811,11 +866,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the right margin to use for the overlay header.
         */
         get: function () {
-            return this.i.dm;
+            return this.i.d4;
         },
         set: function (v) {
-            this.i.dm = +v;
-            this._a("overlayHeaderLabelRightMargin", this.i.dm);
+            this.i.d4 = +v;
+            this._a("overlayHeaderLabelRightMargin", this.i.d4);
         },
         enumerable: false,
         configurable: true
@@ -825,11 +880,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the bottom margin to use for the overlay header.
         */
         get: function () {
-            return this.i.dk;
+            return this.i.d2;
         },
         set: function (v) {
-            this.i.dk = +v;
-            this._a("overlayHeaderLabelBottomMargin", this.i.dk);
+            this.i.d2 = +v;
+            this._a("overlayHeaderLabelBottomMargin", this.i.d2);
         },
         enumerable: false,
         configurable: true
@@ -839,11 +894,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the left margin to use for the labels.
         */
         get: function () {
-            return this.i.df;
+            return this.i.dx;
         },
         set: function (v) {
-            this.i.df = +v;
-            this._a("labelLeftMargin", this.i.df);
+            this.i.dx = +v;
+            this._a("labelLeftMargin", this.i.dx);
         },
         enumerable: false,
         configurable: true
@@ -853,11 +908,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the top margin to use for the labels.
         */
         get: function () {
-            return this.i.dh;
+            return this.i.dz;
         },
         set: function (v) {
-            this.i.dh = +v;
-            this._a("labelTopMargin", this.i.dh);
+            this.i.dz = +v;
+            this._a("labelTopMargin", this.i.dz);
         },
         enumerable: false,
         configurable: true
@@ -867,11 +922,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the right margin to use for the labels.
         */
         get: function () {
-            return this.i.dg;
+            return this.i.dy;
         },
         set: function (v) {
-            this.i.dg = +v;
-            this._a("labelRightMargin", this.i.dg);
+            this.i.dy = +v;
+            this._a("labelRightMargin", this.i.dy);
         },
         enumerable: false,
         configurable: true
@@ -881,11 +936,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the bottom margin to use for the labels.
         */
         get: function () {
-            return this.i.de;
+            return this.i.dw;
         },
         set: function (v) {
-            this.i.de = +v;
-            this._a("labelBottomMargin", this.i.de);
+            this.i.dw = +v;
+            this._a("labelBottomMargin", this.i.dw);
         },
         enumerable: false,
         configurable: true
@@ -895,11 +950,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the left margin to use for the parent nodes.
         */
         get: function () {
-            return this.i.dr;
+            return this.i.d8;
         },
         set: function (v) {
-            this.i.dr = +v;
-            this._a("parentNodeLeftMargin", this.i.dr);
+            this.i.d8 = +v;
+            this._a("parentNodeLeftMargin", this.i.d8);
         },
         enumerable: false,
         configurable: true
@@ -909,11 +964,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the top margin to use for the parent nodes.
         */
         get: function () {
-            return this.i.dv;
+            return this.i.ec;
         },
         set: function (v) {
-            this.i.dv = +v;
-            this._a("parentNodeTopMargin", this.i.dv);
+            this.i.ec = +v;
+            this._a("parentNodeTopMargin", this.i.ec);
         },
         enumerable: false,
         configurable: true
@@ -923,11 +978,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the right margin to use for the parent nodes.
         */
         get: function () {
-            return this.i.dt;
+            return this.i.ea;
         },
         set: function (v) {
-            this.i.dt = +v;
-            this._a("parentNodeRightMargin", this.i.dt);
+            this.i.ea = +v;
+            this._a("parentNodeRightMargin", this.i.ea);
         },
         enumerable: false,
         configurable: true
@@ -937,11 +992,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the bottom margin to use for the parent nodes.
         */
         get: function () {
-            return this.i.dp;
+            return this.i.d6;
         },
         set: function (v) {
-            this.i.dp = +v;
-            this._a("parentNodeBottomMargin", this.i.dp);
+            this.i.d6 = +v;
+            this._a("parentNodeBottomMargin", this.i.d6);
         },
         enumerable: false,
         configurable: true
@@ -951,11 +1006,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the left padding to use for the parent nodes.
         */
         get: function () {
-            return this.i.ds;
+            return this.i.d9;
         },
         set: function (v) {
-            this.i.ds = +v;
-            this._a("parentNodeLeftPadding", this.i.ds);
+            this.i.d9 = +v;
+            this._a("parentNodeLeftPadding", this.i.d9);
         },
         enumerable: false,
         configurable: true
@@ -965,11 +1020,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the top padding to use for the parent nodes.
         */
         get: function () {
-            return this.i.dw;
+            return this.i.ed;
         },
         set: function (v) {
-            this.i.dw = +v;
-            this._a("parentNodeTopPadding", this.i.dw);
+            this.i.ed = +v;
+            this._a("parentNodeTopPadding", this.i.ed);
         },
         enumerable: false,
         configurable: true
@@ -979,11 +1034,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the right padding to use for the parent nodes.
         */
         get: function () {
-            return this.i.du;
+            return this.i.eb;
         },
         set: function (v) {
-            this.i.du = +v;
-            this._a("parentNodeRightPadding", this.i.du);
+            this.i.eb = +v;
+            this._a("parentNodeRightPadding", this.i.eb);
         },
         enumerable: false,
         configurable: true
@@ -993,11 +1048,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the bottom padding to use for the parent nodes.
         */
         get: function () {
-            return this.i.dq;
+            return this.i.d7;
         },
         set: function (v) {
-            this.i.dq = +v;
-            this._a("parentNodeBottomPadding", this.i.dq);
+            this.i.d7 = +v;
+            this._a("parentNodeBottomPadding", this.i.d7);
         },
         enumerable: false,
         configurable: true
@@ -1007,11 +1062,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the horizontal alignment to use for the node labels.
         */
         get: function () {
-            return this.i.id;
+            return this.i.ja;
         },
         set: function (v) {
-            this.i.id = ensureEnum(HorizontalAlignment_$type, v);
-            this._a("labelHorizontalAlignment", enumToString(HorizontalAlignment_$type, this.i.id));
+            this.i.ja = ensureEnum(HorizontalAlignment_$type, v);
+            this._a("labelHorizontalAlignment", enumToString(HorizontalAlignment_$type, this.i.ja));
         },
         enumerable: false,
         configurable: true
@@ -1021,11 +1076,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the vertical alignment to use for the node labels.
         */
         get: function () {
-            return this.i.ji;
+            return this.i.kd;
         },
         set: function (v) {
-            this.i.ji = ensureEnum(VerticalAlignment_$type, v);
-            this._a("labelVerticalAlignment", enumToString(VerticalAlignment_$type, this.i.ji));
+            this.i.kd = ensureEnum(VerticalAlignment_$type, v);
+            this._a("labelVerticalAlignment", enumToString(VerticalAlignment_$type, this.i.kd));
         },
         enumerable: false,
         configurable: true
@@ -1035,11 +1090,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the height to use for the header.
         */
         get: function () {
-            return this.i.c8;
+            return this.i.dn;
         },
         set: function (v) {
-            this.i.c8 = +v;
-            this._a("headerHeight", this.i.c8);
+            this.i.dn = +v;
+            this._a("headerHeight", this.i.dn);
         },
         enumerable: false,
         configurable: true
@@ -1049,11 +1104,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the outline to use for the nodes.
         */
         get: function () {
-            return brushToString(this.i.i0);
+            return brushToString(this.i.jv);
         },
         set: function (v) {
-            this.i.i0 = stringToBrush(v);
-            this._a("outline", brushToString(this.i.i0));
+            this.i.jv = stringToBrush(v);
+            this._a("outline", brushToString(this.i.jv));
         },
         enumerable: false,
         configurable: true
@@ -1063,11 +1118,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the stroke thickness to use for the node outline.
         */
         get: function () {
-            return this.i.d8;
+            return this.i.es;
         },
         set: function (v) {
-            this.i.d8 = +v;
-            this._a("strokeThickness", this.i.d8);
+            this.i.es = +v;
+            this._a("strokeThickness", this.i.es);
         },
         enumerable: false,
         configurable: true
@@ -1077,11 +1132,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the opacity to use for the nodes.
         */
         get: function () {
-            return this.i.dj;
+            return this.i.d1;
         },
         set: function (v) {
-            this.i.dj = +v;
-            this._a("nodeOpacity", this.i.dj);
+            this.i.d1 = +v;
+            this._a("nodeOpacity", this.i.d1);
         },
         enumerable: false,
         configurable: true
@@ -1091,11 +1146,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the orientation to use for the stripped and slice and dice layout types.
         */
         get: function () {
-            return this.i.aj;
+            return this.i.al;
         },
         set: function (v) {
-            this.i.aj = ensureEnum(TreemapOrientation_$type, v);
-            this._a("layoutOrientation", enumToString(TreemapOrientation_$type, this.i.aj));
+            this.i.al = ensureEnum(TreemapOrientation_$type, v);
+            this._a("layoutOrientation", enumToString(TreemapOrientation_$type, this.i.al));
         },
         enumerable: false,
         configurable: true
@@ -1105,11 +1160,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the type of layout to use for the nodes.
         */
         get: function () {
-            return this.i.s;
+            return this.i.u;
         },
         set: function (v) {
-            this.i.s = ensureEnum(TreemapLayoutType_$type, v);
-            this._a("layoutType", enumToString(TreemapLayoutType_$type, this.i.s));
+            this.i.u = ensureEnum(TreemapLayoutType_$type, v);
+            this._a("layoutType", enumToString(TreemapLayoutType_$type, this.i.u));
         },
         enumerable: false,
         configurable: true
@@ -1119,11 +1174,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the minimum size (width or height) to display a node.
         */
         get: function () {
-            return this.i.di;
+            return this.i.d0;
         },
         set: function (v) {
-            this.i.di = +v;
-            this._a("minimumDisplaySize", this.i.di);
+            this.i.d0 = +v;
+            this._a("minimumDisplaySize", this.i.d0);
         },
         enumerable: false,
         configurable: true
@@ -1133,11 +1188,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the number of milliseconds over which changes to the gauge should be animated.
         */
         get: function () {
-            return this.i.ei;
+            return this.i.e3;
         },
         set: function (v) {
-            this.i.ei = +v;
-            this._a("transitionDuration", this.i.ei);
+            this.i.e3 = +v;
+            this._a("transitionDuration", this.i.e3);
         },
         enumerable: false,
         configurable: true
@@ -1149,22 +1204,22 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * to appear blurry.
         */
         get: function () {
-            return this.i.dx;
+            return this.i.ee;
         },
         set: function (v) {
-            this.i.dx = +v;
-            this._a("pixelScalingRatio", this.i.dx);
+            this.i.ee = +v;
+            this._a("pixelScalingRatio", this.i.ee);
         },
         enumerable: false,
         configurable: true
     });
     Object.defineProperty(IgcTreemapComponent.prototype, "actualPixelScalingRatio", {
         get: function () {
-            return this.i.c1;
+            return this.i.dg;
         },
         set: function (v) {
-            this.i.c1 = +v;
-            this._a("actualPixelScalingRatio", this.i.c1);
+            this.i.dg = +v;
+            this._a("actualPixelScalingRatio", this.i.dg);
         },
         enumerable: false,
         configurable: true
@@ -1176,11 +1231,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * to appear blurry.
         */
         get: function () {
-            return this.i.dd;
+            return this.i.dv;
         },
         set: function (v) {
-            this.i.dd = +v;
-            this._a("interactionPixelScalingRatio", this.i.dd);
+            this.i.dv = +v;
+            this._a("interactionPixelScalingRatio", this.i.dv);
         },
         enumerable: false,
         configurable: true
@@ -1192,11 +1247,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * to appear blurry.
         */
         get: function () {
-            return this.i.c0;
+            return this.i.df;
         },
         set: function (v) {
-            this.i.c0 = +v;
-            this._a("actualInteractionPixelScalingRatio", this.i.c0);
+            this.i.df = +v;
+            this._a("actualInteractionPixelScalingRatio", this.i.df);
         },
         enumerable: false,
         configurable: true
@@ -1206,11 +1261,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the number of milliseconds over which the highlighting effect will render.
         */
         get: function () {
-            return this.i.eg;
+            return this.i.e1;
         },
         set: function (v) {
-            this.i.eg = +v;
-            this._a("highlightingTransitionDuration", this.i.eg);
+            this.i.e1 = +v;
+            this._a("highlightingTransitionDuration", this.i.e1);
         },
         enumerable: false,
         configurable: true
@@ -1220,11 +1275,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the highlighting mode to use.
         */
         get: function () {
-            return this.i.au;
+            return this.i.aw;
         },
         set: function (v) {
-            this.i.au = ensureEnum(TreemapHighlightingMode_$type, v);
-            this._a("highlightingMode", enumToString(TreemapHighlightingMode_$type, this.i.au));
+            this.i.aw = ensureEnum(TreemapHighlightingMode_$type, v);
+            this._a("highlightingMode", enumToString(TreemapHighlightingMode_$type, this.i.aw));
         },
         enumerable: false,
         configurable: true
@@ -1234,18 +1289,32 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets the actual highlighting mode used.
         */
         get: function () {
-            return this.i.as;
+            return this.i.au;
+        },
+        set: function (v) {
+            this.i.au = ensureEnum(TreemapHighlightingMode_$type, v);
+            this._a("actualHighlightingMode", enumToString(TreemapHighlightingMode_$type, this.i.au));
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcTreemapComponent.prototype, "highlightingFadeOpacity", {
+        /**
+         * Gets or sets the opacity to use for nodes that are not highlighted when HighlightingMode is set to FadeOthers.
+        */
+        get: function () {
+            return this.i.du;
         },
         set: function (v) {
-            this.i.as = ensureEnum(TreemapHighlightingMode_$type, v);
-            this._a("actualHighlightingMode", enumToString(TreemapHighlightingMode_$type, this.i.as));
+            this.i.du = +v;
+            this._a("highlightingFadeOpacity", this.i.du);
         },
         enumerable: false,
         configurable: true
     });
     Object.defineProperty(IgcTreemapComponent.prototype, "animating", {
         get: function () {
-            return this.i.bm;
+            return this.i.bs;
         },
         enumerable: false,
         configurable: true
@@ -1255,10 +1324,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the item to drill to in the treemap.
         */
         get: function () {
-            return this.i.ek;
+            return this.i.e5;
         },
         set: function (v) {
-            this.i.ek = v;
+            this.i.e5 = v;
         },
         enumerable: false,
         configurable: true
@@ -1339,11 +1408,11 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
     
     */
     IgcTreemapComponent.prototype.exportSerializedVisualData = function () {
-        var iv = this.i.e1();
+        var iv = this.i.fn();
         return (iv);
     };
     IgcTreemapComponent.prototype.markDirty = function () {
-        this.i.hh();
+        this.i.ic();
     };
     IgcTreemapComponent.prototype.onDetachedFromUI = function () {
         this.i.onDetachedFromUI();
@@ -1352,10 +1421,10 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         this.i.onAttachedToUI();
     };
     IgcTreemapComponent.prototype.flush = function () {
-        this.i.he();
+        this.i.h9();
     };
     IgcTreemapComponent.prototype.notifySetItem = function (source_, index, oldItem, newItem) {
-        this.i.hm(source_, index, oldItem, newItem);
+        this.i.ii(source_, index, oldItem, newItem);
     };
     /**
      * Manually notifies the treemap's data source that the data it has bound to has been cleared and needs to be re-examined.
@@ -1364,16 +1433,16 @@ var IgcTreemapComponent = /** @class */ /*@__PURE__*/ (function (_super) {
     * @param source_  * The data source.
     */
     IgcTreemapComponent.prototype.notifyClearItems = function (source_) {
-        this.i.hj(source_);
+        this.i.ie(source_);
     };
     IgcTreemapComponent.prototype.notifyInsertItem = function (source_, index, newItem) {
-        this.i.hk(source_, index, newItem);
+        this.i.ig(source_, index, newItem);
     };
     IgcTreemapComponent.prototype.notifyRemoveItem = function (source_, index, oldItem) {
-        this.i.hl(source_, index, oldItem);
+        this.i.ih(source_, index, oldItem);
     };
     IgcTreemapComponent.prototype.simulateHover = function (point) {
-        this.i.h5(toPoint(point));
+        this.i.i2(toPoint(point));
     };
     Object.defineProperty(IgcTreemapComponent.prototype, "nodeStyling", {
         /**