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

package/esm5/lib/igc-funnel-chart-component.js

@@ -12,6 +12,7 @@ import { FunnelSliceDisplay_$type } from './FunnelSliceDisplay';
 import { IgcFunnelSliceClickedEventArgs } from './igc-funnel-slice-clicked-event-args';
 import { IgcFunnelSliceEventArgs } from './igc-funnel-slice-event-args';
 import { Style } from "igniteui-webcomponents-core";
+import { HighlightedValueDisplayMode_$type } from "igniteui-webcomponents-core";
 var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
     __extends(IgcFunnelChartComponent, _super);
     function IgcFunnelChartComponent() {
@@ -252,10 +253,79 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
      * Gets or sets the value member path for the funnel chart.
     */
         get: function () {
-            return this.i.c9;
+            return this.i.dv;
         },
         set: function (v) {
-            this.i.c9 = v;
+            this.i.dv = v;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcFunnelChartComponent.prototype, "highlightedValueMemberPath", {
+        /**
+         * Gets or sets the highlighted value member path for the funnel chart.
+        */
+        get: function () {
+            return this.i.cr;
+        },
+        set: function (v) {
+            this.i.cr = v;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcFunnelChartComponent.prototype, "actualHighlightValueOpacity", {
+        /**
+         * Gets the actual opacity of the primary needle while highlighting
+        */
+        get: function () {
+            return this.i.bw;
+        },
+        set: function (v) {
+            this.i.bw = +v;
+            this._a("actualHighlightValueOpacity", this.i.bw);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcFunnelChartComponent.prototype, "highlightValueOpacity", {
+        /**
+         * Gets or sets the opacity while highlighting
+        */
+        get: function () {
+            return this.i.b0;
+        },
+        set: function (v) {
+            this.i.b0 = +v;
+            this._a("highlightValueOpacity", this.i.b0);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcFunnelChartComponent.prototype, "actualHighlightValueDisplayMode", {
+        /**
+         * Gets whether and how to display the highlighted value.
+        */
+        get: function () {
+            return this.i.a2;
+        },
+        set: function (v) {
+            this.i.a2 = ensureEnum(HighlightedValueDisplayMode_$type, v);
+            this._a("actualHighlightValueDisplayMode", enumToString(HighlightedValueDisplayMode_$type, this.i.a2));
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgcFunnelChartComponent.prototype, "highlightValueDisplayMode", {
+        /**
+         * Gets or sets whether and how to display the highlighted value.
+        */
+        get: function () {
+            return this.i.a3;
+        },
+        set: function (v) {
+            this.i.a3 = ensureEnum(HighlightedValueDisplayMode_$type, v);
+            this._a("highlightValueDisplayMode", enumToString(HighlightedValueDisplayMode_$type, this.i.a3));
         },
         enumerable: false,
         configurable: true
@@ -293,11 +363,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the percentage (from near 0 to 1) of space the bottom edge of the funnel should take.
         */
         get: function () {
-            return this.i.bo;
+            return this.i.by;
         },
         set: function (v) {
-            this.i.bo = +v;
-            this._a("bottomEdgeWidth", this.i.bo);
+            this.i.by = +v;
+            this._a("bottomEdgeWidth", this.i.by);
         },
         enumerable: false,
         configurable: true
@@ -307,10 +377,10 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the InnerLabel mapping property for the current series object.
         */
         get: function () {
-            return this.i.cd;
+            return this.i.cy;
         },
         set: function (v) {
-            this.i.cd = v;
+            this.i.cy = v;
         },
         enumerable: false,
         configurable: true
@@ -320,10 +390,10 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the OuterLabel mapping property for the current series object.
         */
         get: function () {
-            return this.i.co;
+            return this.i.c9;
         },
         set: function (v) {
-            this.i.co = v;
+            this.i.c9 = v;
         },
         enumerable: false,
         configurable: true
@@ -333,11 +403,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets whether the inner labels are visible.
         */
         get: function () {
-            return this.i.ez;
+            return this.i.ft;
         },
         set: function (v) {
-            this.i.ez = ensureEnum(Visibility_$type, v);
-            this._a("innerLabelVisibility", enumToString(Visibility_$type, this.i.ez));
+            this.i.ft = ensureEnum(Visibility_$type, v);
+            this._a("innerLabelVisibility", enumToString(Visibility_$type, this.i.ft));
         },
         enumerable: false,
         configurable: true
@@ -347,11 +417,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets whether the outer labels are visible.
         */
         get: function () {
-            return this.i.e0;
+            return this.i.fu;
         },
         set: function (v) {
-            this.i.e0 = ensureEnum(Visibility_$type, v);
-            this._a("outerLabelVisibility", enumToString(Visibility_$type, this.i.e0));
+            this.i.fu = ensureEnum(Visibility_$type, v);
+            this._a("outerLabelVisibility", enumToString(Visibility_$type, this.i.fu));
         },
         enumerable: false,
         configurable: true
@@ -389,10 +459,10 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the formatter function for inner labels. Function should return string and it takes 3 parameters: 1st-value of item to format, 2nd-index of item within data, 3rd-reference to the funnel chart.
         */
         get: function () {
-            return this.i.bw;
+            return this.i.b8;
         },
         set: function (v) {
-            this.i.bw = v;
+            this.i.b8 = v;
         },
         enumerable: false,
         configurable: true
@@ -402,10 +472,10 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the formatter function for outer labels. Function should return string and it takes 3 parameters: 1st-value of item to format, 2nd-index of item within data, 3rd-reference to the funnel chart.
         */
         get: function () {
-            return this.i.bx;
+            return this.i.b9;
         },
         set: function (v) {
-            this.i.bx = v;
+            this.i.b9 = v;
         },
         enumerable: false,
         configurable: true
@@ -415,11 +485,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets how long the animations should take to run.
         */
         get: function () {
-            return this.i.by;
+            return this.i.ca;
         },
         set: function (v) {
-            this.i.by = +v;
-            this._a("transitionDuration", this.i.by);
+            this.i.ca = +v;
+            this._a("transitionDuration", this.i.ca);
         },
         enumerable: false,
         configurable: true
@@ -429,11 +499,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets if the funnel should be rendered inverted.
         */
         get: function () {
-            return this.i.bd;
+            return this.i.bk;
         },
         set: function (v) {
-            this.i.bd = ensureBool(v);
-            this._a("isInverted", this.i.bd);
+            this.i.bk = ensureBool(v);
+            this._a("isInverted", this.i.bk);
         },
         enumerable: false,
         configurable: true
@@ -443,11 +513,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets whether to use a Bezier curve to define the funnel.
         */
         get: function () {
-            return this.i.be;
+            return this.i.bl;
         },
         set: function (v) {
-            this.i.be = ensureBool(v);
-            this._a("useBezierCurve", this.i.be);
+            this.i.bl = ensureBool(v);
+            this._a("useBezierCurve", this.i.bl);
         },
         enumerable: false,
         configurable: true
@@ -457,11 +527,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets whether to allow slices to be selected.
         */
         get: function () {
-            return this.i.a8;
+            return this.i.be;
         },
         set: function (v) {
-            this.i.a8 = ensureBool(v);
-            this._a("allowSliceSelection", this.i.a8);
+            this.i.be = ensureBool(v);
+            this._a("allowSliceSelection", this.i.be);
         },
         enumerable: false,
         configurable: true
@@ -471,11 +541,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets whether to use the unselected style on unselected slices.
         */
         get: function () {
-            return this.i.bg;
+            return this.i.bn;
         },
         set: function (v) {
-            this.i.bg = ensureBool(v);
-            this._a("useUnselectedStyle", this.i.bg);
+            this.i.bn = ensureBool(v);
+            this._a("useUnselectedStyle", this.i.bn);
         },
         enumerable: false,
         configurable: true
@@ -485,11 +555,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the fill brush.
         */
         get: function () {
-            return this.i.ex ? this.i.ex.fill : null;
+            return this.i.fr ? this.i.fr.fill : null;
         },
         set: function (v) {
             this.ensureSelectedSliceStyle();
-            this.i.ex.fill = v;
+            this.i.fr.fill = v;
         },
         enumerable: false,
         configurable: true
@@ -499,11 +569,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the stroke brush.
         */
         get: function () {
-            return this.i.ex ? this.i.ex.stroke : null;
+            return this.i.fr ? this.i.fr.stroke : null;
         },
         set: function (v) {
             this.ensureSelectedSliceStyle();
-            this.i.ex.stroke = v;
+            this.i.fr.stroke = v;
         },
         enumerable: false,
         configurable: true
@@ -513,12 +583,12 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the stroke thickness.
         */
         get: function () {
-            return this.i.ex ? this.i.ex.strokeThickness : NaN;
+            return this.i.fr ? this.i.fr.strokeThickness : NaN;
         },
         set: function (v) {
             this.ensureSelectedSliceStyle();
-            this.i.ex.strokeThickness = +v;
-            this._a("selectedSliceStrokeThickness", this.i.ex.strokeThickness);
+            this.i.fr.strokeThickness = +v;
+            this._a("selectedSliceStrokeThickness", this.i.fr.strokeThickness);
         },
         enumerable: false,
         configurable: true
@@ -528,32 +598,32 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the opacity.
         */
         get: function () {
-            return this.i.ex ? this.i.ex.opacity : NaN;
+            return this.i.fr ? this.i.fr.opacity : NaN;
         },
         set: function (v) {
             this.ensureSelectedSliceStyle();
-            this.i.ex.opacity = +v;
-            this._a("selectedSliceOpacity", this.i.ex.opacity);
+            this.i.fr.opacity = +v;
+            this._a("selectedSliceOpacity", this.i.fr.opacity);
         },
         enumerable: false,
         configurable: true
     });
     IgcFunnelChartComponent.prototype.ensureSelectedSliceStyle = function () {
-        if (this.i.ex) {
+        if (this.i.fr) {
             return;
         }
-        this.i.ex = new Style();
+        this.i.fr = new Style();
     };
     Object.defineProperty(IgcFunnelChartComponent.prototype, "unselectedSliceFill", {
         /**
          * Gets or sets the fill brush.
         */
         get: function () {
-            return this.i.ey ? this.i.ey.fill : null;
+            return this.i.fs ? this.i.fs.fill : null;
         },
         set: function (v) {
             this.ensureUnselectedSliceStyle();
-            this.i.ey.fill = v;
+            this.i.fs.fill = v;
         },
         enumerable: false,
         configurable: true
@@ -563,11 +633,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the stroke brush.
         */
         get: function () {
-            return this.i.ey ? this.i.ey.stroke : null;
+            return this.i.fs ? this.i.fs.stroke : null;
         },
         set: function (v) {
             this.ensureUnselectedSliceStyle();
-            this.i.ey.stroke = v;
+            this.i.fs.stroke = v;
         },
         enumerable: false,
         configurable: true
@@ -577,12 +647,12 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the stroke thickness.
         */
         get: function () {
-            return this.i.ey ? this.i.ey.strokeThickness : NaN;
+            return this.i.fs ? this.i.fs.strokeThickness : NaN;
         },
         set: function (v) {
             this.ensureUnselectedSliceStyle();
-            this.i.ey.strokeThickness = +v;
-            this._a("unselectedSliceStrokeThickness", this.i.ey.strokeThickness);
+            this.i.fs.strokeThickness = +v;
+            this._a("unselectedSliceStrokeThickness", this.i.fs.strokeThickness);
         },
         enumerable: false,
         configurable: true
@@ -592,21 +662,21 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the opacity.
         */
         get: function () {
-            return this.i.ey ? this.i.ey.opacity : NaN;
+            return this.i.fs ? this.i.fs.opacity : NaN;
         },
         set: function (v) {
             this.ensureUnselectedSliceStyle();
-            this.i.ey.opacity = +v;
-            this._a("unselectedSliceOpacity", this.i.ey.opacity);
+            this.i.fs.opacity = +v;
+            this._a("unselectedSliceOpacity", this.i.fs.opacity);
         },
         enumerable: false,
         configurable: true
     });
     IgcFunnelChartComponent.prototype.ensureUnselectedSliceStyle = function () {
-        if (this.i.ey) {
+        if (this.i.fs) {
             return;
         }
-        this.i.ey = new Style();
+        this.i.fs = new Style();
     };
     Object.defineProperty(IgcFunnelChartComponent.prototype, "legendItemBadgeTemplate", {
         /**
@@ -626,11 +696,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets whether to use the outer labels to identify the legend items.
         */
         get: function () {
-            return this.i.bf;
+            return this.i.bm;
         },
         set: function (v) {
-            this.i.bf = ensureBool(v);
-            this._a("useOuterLabelsForLegend", this.i.bf);
+            this.i.bm = ensureBool(v);
+            this._a("useOuterLabelsForLegend", this.i.bm);
         },
         enumerable: false,
         configurable: true
@@ -640,10 +710,10 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the text style for inner labels
         */
         get: function () {
-            return this.i.cz;
+            return this.i.dk;
         },
         set: function (v) {
-            this.i.cz = v;
+            this.i.dk = v;
         },
         enumerable: false,
         configurable: true
@@ -653,10 +723,10 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the text style for outer labels
         */
         get: function () {
-            return this.i.cr;
+            return this.i.dc;
         },
         set: function (v) {
-            this.i.cr = v;
+            this.i.dc = v;
         },
         enumerable: false,
         configurable: true
@@ -666,11 +736,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the thickness of outline around slices.
         */
         get: function () {
-            return this.i.bq;
+            return this.i.b1;
         },
         set: function (v) {
-            this.i.bq = +v;
-            this._a("outlineThickness", this.i.bq);
+            this.i.b1 = +v;
+            this._a("outlineThickness", this.i.b1);
         },
         enumerable: false,
         configurable: true
@@ -682,11 +752,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * to appear blurry.
         */
         get: function () {
-            return this.i.bs;
+            return this.i.b3;
         },
         set: function (v) {
-            this.i.bs = +v;
-            this._a("pixelScalingRatio", this.i.bs);
+            this.i.b3 = +v;
+            this._a("pixelScalingRatio", this.i.b3);
         },
         enumerable: false,
         configurable: true
@@ -696,11 +766,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the brush used for the outer labels.
         */
         get: function () {
-            return brushToString(this.i.et);
+            return brushToString(this.i.fn);
         },
         set: function (v) {
-            this.i.et = stringToBrush(v);
-            this._a("outerLabelTextColor", brushToString(this.i.et));
+            this.i.fn = stringToBrush(v);
+            this._a("outerLabelTextColor", brushToString(this.i.fn));
         },
         enumerable: false,
         configurable: true
@@ -710,11 +780,11 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
          * Gets or sets the brush used for the inner labels.
         */
         get: function () {
-            return brushToString(this.i.eu);
+            return brushToString(this.i.fo);
         },
         set: function (v) {
-            this.i.eu = stringToBrush(v);
-            this._a("textColor", brushToString(this.i.eu));
+            this.i.fo = stringToBrush(v);
+            this._a("textColor", brushToString(this.i.fo));
         },
         enumerable: false,
         configurable: true
@@ -791,7 +861,7 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
 
 */
     IgcFunnelChartComponent.prototype.flush = function () {
-        this.i.dd();
+        this.i.dz();
     };
     /**
      * Provides container for funnel chart
@@ -808,7 +878,7 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         this.i.notifyResized();
     };
     IgcFunnelChartComponent.prototype.notifySetItem = function (source_, index, oldItem, newItem) {
-        this.i.dm(source_, index, oldItem, newItem);
+        this.i.ea(source_, index, oldItem, newItem);
     };
     /**
      * Manually notifies the chart's data source that the data it has bound to has been cleared and needs to be re-examined.
@@ -816,27 +886,27 @@ var IgcFunnelChartComponent = /** @class */ /*@__PURE__*/ (function (_super) {
     
     */
     IgcFunnelChartComponent.prototype.notifyClearItems = function (source_) {
-        this.i.dh(source_);
+        this.i.d5(source_);
     };
     IgcFunnelChartComponent.prototype.notifyInsertItem = function (source_, index, newItem) {
-        this.i.dj(source_, index, newItem);
+        this.i.d7(source_, index, newItem);
     };
     IgcFunnelChartComponent.prototype.notifyRemoveItem = function (source_, index, oldItem) {
-        this.i.dk(source_, index, oldItem);
+        this.i.d8(source_, index, oldItem);
     };
     /**
      * Toggle selection of item at index.
     
     */
     IgcFunnelChartComponent.prototype.toggleSelection = function (index) {
-        this.i.dz(index);
+        this.i.em(index);
     };
     /**
      * Exports and serializes the chart visuals.
     
     */
     IgcFunnelChartComponent.prototype.exportSerializedVisualData = function () {
-        var iv = this.i.b7();
+        var iv = this.i.cl();
         return (iv);
     };
     Object.defineProperty(IgcFunnelChartComponent.prototype, "sliceClicked", {