@progress/kendo-charts 1.30.0 → 1.31.0-dev.202308280454

package/dist/es/chart/base-theme.js

@@ -247,6 +247,8 @@ var funnelSeries = function () { return ({
     }
 }); };
 
+var pyramidSeries = funnelSeries;
+
 var heatmapSeries = function () { return ({
     labels: {
         color: '',
@@ -281,6 +283,7 @@ var seriesDefaults = function (options) { return ({
     pie: pieSeries(),
     donut: donutSeries(),
     funnel: funnelSeries(),
+    pyramid: pyramidSeries(),
     horizontalWaterfall: waterfallSeries(),
     line: lineSeries(),
     notes: notes(),

package/dist/es/chart/chart.js

@@ -28,7 +28,7 @@ import { addClass, Class, setDefaultOptions, deepExtend, defined, find, isObject
 import { dateComparer } from '../date-utils';
 
 import { DRAG_START, DRAG, DRAG_END, ZOOM_START, ZOOM, ZOOM_END, SELECT_START, SELECT, SELECT_END, PLOT_AREA_HOVER, PLOT_AREA_LEAVE,
-         RENDER, CATEGORY, PIE, DONUT, FUNNEL, COLUMN, MOUSEWHEEL, MOUSEWHEEL_DELAY, MOUSEWHEEL_ZOOM_RATE, SHOW_TOOLTIP, SERIES_HOVER,
+         RENDER, CATEGORY, PIE, DONUT, FUNNEL, PYRAMID, COLUMN, MOUSEWHEEL, MOUSEWHEEL_DELAY, MOUSEWHEEL_ZOOM_RATE, SHOW_TOOLTIP, SERIES_HOVER,
          SERIES_OVER, SERIES_LEAVE, SERIES_CLICK, DRILLDOWN } from './constants';
 
 import './animations';
@@ -202,7 +202,7 @@ var Chart = (function (Class) {
 
             if (firstSeries.type === DONUT) {
                 points = pointByCategoryName(plotArea.pointsBySeriesName(seriesName), categoryName);
-            } else if (firstSeries.type === PIE || firstSeries.type === FUNNEL) {
+            } else if (inArray(firstSeries.type, [ PIE, FUNNEL, PYRAMID ])) {
                 points = pointByCategoryName((plotArea.charts[0] || {}).points, categoryName);
             } else {
                 points = plotArea.pointsBySeriesName(seriesName);
@@ -638,6 +638,11 @@ var Chart = (function (Class) {
             this._plotAreaHovered = false;
             this.trigger(PLOT_AREA_LEAVE);
         }
+
+        if (this._hasInactiveOpacity() && this._activeChartInstance) {
+            this._applySeriesOpacity(this._activeChartInstance.children, null, true);
+            this._updateSeriesOpacity(null, true);
+        }
     };
 
     Chart.prototype._cancelDomEvents = function _cancelDomEvents () {
@@ -1574,7 +1579,7 @@ var Chart = (function (Class) {
         var currentSeries = (plotArea.srcSeries || plotArea.series)[seriesIndex];
         var items;
 
-        if (inArray(currentSeries.type, [ PIE, DONUT, FUNNEL ])) {
+        if (inArray(currentSeries.type, [ PIE, DONUT, FUNNEL, PYRAMID ])) {
             items = plotArea.findPoint(function(point) {
                 return point.series.index === seriesIndex && point.index === pointIndex;
             });

package/dist/es/chart/constants.js

@@ -34,6 +34,7 @@ var CANDLESTICK = "candlestick";
 var COLUMN = "column";
 var DONUT = "donut";
 var FUNNEL = "funnel";
+var PYRAMID = "pyramid";
 var HEATMAP = "heatmap";
 var HORIZONTAL_WATERFALL = "horizontalWaterfall";
 var LINE = "line";
@@ -108,7 +109,7 @@ export {
     X_ERROR_LOW_FIELD, X_ERROR_HIGH_FIELD,
     Y_ERROR_LOW_FIELD, Y_ERROR_HIGH_FIELD,
     LINE_MARKER_SIZE, INTERPOLATE, ZERO,
-    SMOOTH, STEP, CATEGORY, FUNNEL,
+    SMOOTH, STEP, CATEGORY, FUNNEL, PYRAMID,
     BAR, CANDLESTICK, PIE, COLUMN, AREA,
     VERTICAL_BULLET, BOX_PLOT, OHLC, WATERFALL, LINE,
     BULLET, VERTICAL_LINE, VERTICAL_AREA, RANGE_AREA, VERTICAL_RANGE_AREA,

package/dist/es/chart/funnel-chart/pyramid-chart.js

@@ -0,0 +1,20 @@
+import FunnelChart from './funnel-chart';
+
+var MAX_NECK_RATIO = 1e6;
+
+var PyramidChart = (function (FunnelChart) {
+    function PyramidChart(plotArea, options) {
+        options.dynamicSlope = false;
+        options.neckRatio = MAX_NECK_RATIO;
+
+        FunnelChart.call(this, plotArea, options);
+    }
+
+    if ( FunnelChart ) PyramidChart.__proto__ = FunnelChart;
+    PyramidChart.prototype = Object.create( FunnelChart && FunnelChart.prototype );
+    PyramidChart.prototype.constructor = PyramidChart;
+
+    return PyramidChart;
+}(FunnelChart));
+
+export default PyramidChart;

package/dist/es/chart/plotarea/funnel-plotarea.js

@@ -1,7 +1,11 @@
 import PlotAreaBase from './plotarea-base';
 import FunnelChart from '../funnel-chart/funnel-chart';
+import PyramidChart from '../funnel-chart/pyramid-chart';
 
 import { append } from '../../common';
+import { filterSeriesByType } from '../utils';
+
+import { FUNNEL, PYRAMID } from '../constants';
 
 var FunnelPlotArea = (function (PlotAreaBase) {
     function FunnelPlotArea () {
@@ -13,12 +17,17 @@ var FunnelPlotArea = (function (PlotAreaBase) {
     FunnelPlotArea.prototype.constructor = FunnelPlotArea;
 
     FunnelPlotArea.prototype.render = function render () {
-        this.createFunnelChart(this.series);
+        this.createChart(FunnelChart, filterSeriesByType(this.series, [ FUNNEL ]));
+        this.createChart(PyramidChart, filterSeriesByType(this.series, [ PYRAMID ]));
     };
 
-    FunnelPlotArea.prototype.createFunnelChart = function createFunnelChart (series) {
+    FunnelPlotArea.prototype.createChart = function createChart (chartType, series) {
         var firstSeries = series[0];
-        var funnelChart = new FunnelChart(this, {
+        if (!firstSeries) {
+            return;
+        }
+
+        var chart = new chartType(this, {
             series: series,
             legend: this.options.legend,
             neckRatio: firstSeries.neckRatio,
@@ -28,7 +37,7 @@ var FunnelPlotArea = (function (PlotAreaBase) {
             highlight: firstSeries.highlight
         });
 
-        this.appendChart(funnelChart);
+        this.appendChart(chart);
     };
 
     FunnelPlotArea.prototype.appendChart = function appendChart (chart, pane) {
@@ -39,4 +48,4 @@ var FunnelPlotArea = (function (PlotAreaBase) {
     return FunnelPlotArea;
 }(PlotAreaBase));
 
-export default FunnelPlotArea;
+export default FunnelPlotArea;

package/dist/es/chart/register-charts.js

@@ -10,7 +10,7 @@ import RadarPlotArea from './plotarea/radar-plotarea';
 import FunnelPlotArea from './plotarea/funnel-plotarea';
 import HeatmapPlotArea from './plotarea/heatmap-plotarea';
 
-import { COLUMN, DONUT, PIE, FUNNEL, BAR, LINE, VERTICAL_LINE, AREA, VERTICAL_AREA,
+import { COLUMN, DONUT, PIE, FUNNEL, PYRAMID, BAR, LINE, VERTICAL_LINE, AREA, VERTICAL_AREA,
     CANDLESTICK, OHLC, BULLET, VERTICAL_BULLET, BOX_PLOT, VERTICAL_BOX_PLOT, RANGE_COLUMN,
     RANGE_BAR, WATERFALL, HORIZONTAL_WATERFALL, SCATTER, SCATTER_LINE, BUBBLE,
     POLAR_AREA, POLAR_LINE, POLAR_SCATTER, RADAR_AREA, RADAR_COLUMN, RADAR_LINE, CATEGORY,
@@ -39,7 +39,7 @@ PlotAreaFactory.current.register(XYPlotArea, [
 
 PlotAreaFactory.current.register(PiePlotArea, [ PIE ]);
 PlotAreaFactory.current.register(DonutPlotArea, [ DONUT ]);
-PlotAreaFactory.current.register(FunnelPlotArea, [ FUNNEL ]);
+PlotAreaFactory.current.register(FunnelPlotArea, [ FUNNEL, PYRAMID ]);
 
 PlotAreaFactory.current.register(PolarPlotArea, [ POLAR_AREA, POLAR_LINE, POLAR_SCATTER ]);
 PlotAreaFactory.current.register(RadarPlotArea, [ RADAR_AREA, RADAR_COLUMN, RADAR_LINE ]);
@@ -65,7 +65,7 @@ SeriesBinder.current.register([ POLAR_AREA, POLAR_LINE, POLAR_SCATTER ], [ X, Y
 SeriesBinder.current.register([ RADAR_AREA, RADAR_COLUMN, RADAR_LINE ], [ VALUE ], [ COLOR, DRILLDOWN_FIELD ]);
 
 SeriesBinder.current.register(
-    [ FUNNEL ],
+    [ FUNNEL, PYRAMID ],
     [ VALUE ], [ CATEGORY, COLOR, "visibleInLegend", "visible", DRILLDOWN_FIELD ]
 );
 

package/dist/es/chart/selection.js

@@ -114,6 +114,7 @@ var Selection = (function (Class) {
             top: (selectionStyles.height - rightHandleHeight) / 2
         });
 
+        /* eslint no-self-assign: "off" */
         wrapper.style.cssText = wrapper.style.cssText;
     };
 
@@ -587,7 +588,7 @@ var Selection = (function (Class) {
                 limitValue(to + delta, range.from + 1, max),
                 min,
                 max
-             );
+            );
         }
 
         if (range.from !== oldRange.from || range.to !== oldRange.to) {

package/dist/es/common/render-icon.js

@@ -48,7 +48,7 @@ var HTMLFontIcon = (function (HTMLBaseIcon) {
     HTMLFontIcon.prototype.constructor = HTMLFontIcon;
 
     HTMLFontIcon.prototype.wrapper = function wrapper () {
-            // Find if there is an existing k-i- class appended to the element.
+        // Find if there is an existing k-i- class appended to the element.
         var currentIconClass = this.element.className.split(" ").find(function (x) { return x.startsWith(KI_PREFFIX); });
         var className = this.options.icon ? ("" + (this.options.icon.startsWith(KI_PREFFIX) ? "" : KI_PREFFIX) + (this.options.icon)) : "";
 

package/dist/es/sparkline/sparkline.js

@@ -1,6 +1,6 @@
 import { Chart } from '../chart';
 import { BAR, BULLET, PIE, COLUMN, VERTICAL_BULLET } from '../chart/constants';
-import{ addClass, deepExtend, elementSize, getSpacing, inArray, isArray, isNumber, setDefaultOptions } from '../common';
+import { addClass, deepExtend, elementSize, getSpacing, inArray, isArray, isNumber, setDefaultOptions } from '../common';
 import SharedTooltip from './shared-tooltip';
 
 var DEAULT_BAR_WIDTH = 150;

package/dist/es2015/chart/base-theme.js

@@ -247,6 +247,8 @@ const funnelSeries = () => ({
     }
 });
 
+const pyramidSeries = funnelSeries;
+
 const heatmapSeries = () => ({
     labels: {
         color: '',
@@ -281,6 +283,7 @@ const seriesDefaults = (options) => ({
     pie: pieSeries(),
     donut: donutSeries(),
     funnel: funnelSeries(),
+    pyramid: pyramidSeries(),
     horizontalWaterfall: waterfallSeries(),
     line: lineSeries(),
     notes: notes(),

package/dist/es2015/chart/chart.js

@@ -28,7 +28,7 @@ import { addClass, Class, setDefaultOptions, deepExtend, defined, find, isObject
 import { dateComparer } from '../date-utils';
 
 import { DRAG_START, DRAG, DRAG_END, ZOOM_START, ZOOM, ZOOM_END, SELECT_START, SELECT, SELECT_END, PLOT_AREA_HOVER, PLOT_AREA_LEAVE,
-         RENDER, CATEGORY, PIE, DONUT, FUNNEL, COLUMN, MOUSEWHEEL, MOUSEWHEEL_DELAY, MOUSEWHEEL_ZOOM_RATE, SHOW_TOOLTIP, SERIES_HOVER,
+         RENDER, CATEGORY, PIE, DONUT, FUNNEL, PYRAMID, COLUMN, MOUSEWHEEL, MOUSEWHEEL_DELAY, MOUSEWHEEL_ZOOM_RATE, SHOW_TOOLTIP, SERIES_HOVER,
          SERIES_OVER, SERIES_LEAVE, SERIES_CLICK, DRILLDOWN } from './constants';
 
 import './animations';
@@ -195,7 +195,7 @@ class Chart extends Class {
 
             if (firstSeries.type === DONUT) {
                 points = pointByCategoryName(plotArea.pointsBySeriesName(seriesName), categoryName);
-            } else if (firstSeries.type === PIE || firstSeries.type === FUNNEL) {
+            } else if (inArray(firstSeries.type, [ PIE, FUNNEL, PYRAMID ])) {
                 points = pointByCategoryName((plotArea.charts[0] || {}).points, categoryName);
             } else {
                 points = plotArea.pointsBySeriesName(seriesName);
@@ -625,6 +625,11 @@ class Chart extends Class {
             this._plotAreaHovered = false;
             this.trigger(PLOT_AREA_LEAVE);
         }
+
+        if (this._hasInactiveOpacity() && this._activeChartInstance) {
+            this._applySeriesOpacity(this._activeChartInstance.children, null, true);
+            this._updateSeriesOpacity(null, true);
+        }
     }
 
     _cancelDomEvents() {
@@ -1526,7 +1531,7 @@ class Chart extends Class {
         const currentSeries = (plotArea.srcSeries || plotArea.series)[seriesIndex];
         let items;
 
-        if (inArray(currentSeries.type, [ PIE, DONUT, FUNNEL ])) {
+        if (inArray(currentSeries.type, [ PIE, DONUT, FUNNEL, PYRAMID ])) {
             items = plotArea.findPoint(function(point) {
                 return point.series.index === seriesIndex && point.index === pointIndex;
             });

package/dist/es2015/chart/constants.js

@@ -34,6 +34,7 @@ const CANDLESTICK = "candlestick";
 const COLUMN = "column";
 const DONUT = "donut";
 const FUNNEL = "funnel";
+const PYRAMID = "pyramid";
 const HEATMAP = "heatmap";
 const HORIZONTAL_WATERFALL = "horizontalWaterfall";
 const LINE = "line";
@@ -108,7 +109,7 @@ export {
     X_ERROR_LOW_FIELD, X_ERROR_HIGH_FIELD,
     Y_ERROR_LOW_FIELD, Y_ERROR_HIGH_FIELD,
     LINE_MARKER_SIZE, INTERPOLATE, ZERO,
-    SMOOTH, STEP, CATEGORY, FUNNEL,
+    SMOOTH, STEP, CATEGORY, FUNNEL, PYRAMID,
     BAR, CANDLESTICK, PIE, COLUMN, AREA,
     VERTICAL_BULLET, BOX_PLOT, OHLC, WATERFALL, LINE,
     BULLET, VERTICAL_LINE, VERTICAL_AREA, RANGE_AREA, VERTICAL_RANGE_AREA,

package/dist/es2015/chart/funnel-chart/pyramid-chart.js

@@ -0,0 +1,14 @@
+import FunnelChart from './funnel-chart';
+
+const MAX_NECK_RATIO = 1e6;
+
+class PyramidChart extends FunnelChart {
+    constructor(plotArea, options) {
+        options.dynamicSlope = false;
+        options.neckRatio = MAX_NECK_RATIO;
+
+        super(plotArea, options);
+    }
+}
+
+export default PyramidChart;

package/dist/es2015/chart/plotarea/funnel-plotarea.js

@@ -1,16 +1,25 @@
 import PlotAreaBase from './plotarea-base';
 import FunnelChart from '../funnel-chart/funnel-chart';
+import PyramidChart from '../funnel-chart/pyramid-chart';
 
 import { append } from '../../common';
+import { filterSeriesByType } from '../utils';
+
+import { FUNNEL, PYRAMID } from '../constants';
 
 class FunnelPlotArea extends PlotAreaBase {
     render() {
-        this.createFunnelChart(this.series);
+        this.createChart(FunnelChart, filterSeriesByType(this.series, [ FUNNEL ]));
+        this.createChart(PyramidChart, filterSeriesByType(this.series, [ PYRAMID ]));
     }
 
-    createFunnelChart(series) {
+    createChart(chartType, series) {
         const firstSeries = series[0];
-        const funnelChart = new FunnelChart(this, {
+        if (!firstSeries) {
+            return;
+        }
+
+        const chart = new chartType(this, {
             series: series,
             legend: this.options.legend,
             neckRatio: firstSeries.neckRatio,
@@ -20,7 +29,7 @@ class FunnelPlotArea extends PlotAreaBase {
             highlight: firstSeries.highlight
         });
 
-        this.appendChart(funnelChart);
+        this.appendChart(chart);
     }
 
     appendChart(chart, pane) {
@@ -29,4 +38,4 @@ class FunnelPlotArea extends PlotAreaBase {
     }
 }
 
-export default FunnelPlotArea;
+export default FunnelPlotArea;

package/dist/es2015/chart/register-charts.js

@@ -10,7 +10,7 @@ import RadarPlotArea from './plotarea/radar-plotarea';
 import FunnelPlotArea from './plotarea/funnel-plotarea';
 import HeatmapPlotArea from './plotarea/heatmap-plotarea';
 
-import { COLUMN, DONUT, PIE, FUNNEL, BAR, LINE, VERTICAL_LINE, AREA, VERTICAL_AREA,
+import { COLUMN, DONUT, PIE, FUNNEL, PYRAMID, BAR, LINE, VERTICAL_LINE, AREA, VERTICAL_AREA,
     CANDLESTICK, OHLC, BULLET, VERTICAL_BULLET, BOX_PLOT, VERTICAL_BOX_PLOT, RANGE_COLUMN,
     RANGE_BAR, WATERFALL, HORIZONTAL_WATERFALL, SCATTER, SCATTER_LINE, BUBBLE,
     POLAR_AREA, POLAR_LINE, POLAR_SCATTER, RADAR_AREA, RADAR_COLUMN, RADAR_LINE, CATEGORY,
@@ -39,7 +39,7 @@ PlotAreaFactory.current.register(XYPlotArea, [
 
 PlotAreaFactory.current.register(PiePlotArea, [ PIE ]);
 PlotAreaFactory.current.register(DonutPlotArea, [ DONUT ]);
-PlotAreaFactory.current.register(FunnelPlotArea, [ FUNNEL ]);
+PlotAreaFactory.current.register(FunnelPlotArea, [ FUNNEL, PYRAMID ]);
 
 PlotAreaFactory.current.register(PolarPlotArea, [ POLAR_AREA, POLAR_LINE, POLAR_SCATTER ]);
 PlotAreaFactory.current.register(RadarPlotArea, [ RADAR_AREA, RADAR_COLUMN, RADAR_LINE ]);
@@ -65,7 +65,7 @@ SeriesBinder.current.register([ POLAR_AREA, POLAR_LINE, POLAR_SCATTER ], [ X, Y
 SeriesBinder.current.register([ RADAR_AREA, RADAR_COLUMN, RADAR_LINE ], [ VALUE ], [ COLOR, DRILLDOWN_FIELD ]);
 
 SeriesBinder.current.register(
-    [ FUNNEL ],
+    [ FUNNEL, PYRAMID ],
     [ VALUE ], [ CATEGORY, COLOR, "visibleInLegend", "visible", DRILLDOWN_FIELD ]
 );
 

package/dist/es2015/chart/selection.js

@@ -110,6 +110,7 @@ class Selection extends Class {
             top: (selectionStyles.height - rightHandleHeight) / 2
         });
 
+        /* eslint no-self-assign: "off" */
         wrapper.style.cssText = wrapper.style.cssText;
     }
 
@@ -565,7 +566,7 @@ class Selection extends Class {
                 limitValue(to + delta, range.from + 1, max),
                 min,
                 max
-             );
+            );
         }
 
         if (range.from !== oldRange.from || range.to !== oldRange.to) {

package/dist/es2015/common/render-icon.js

@@ -46,7 +46,7 @@ class HTMLFontIcon extends HTMLBaseIcon {
     }
 
     wrapper() {
-            // Find if there is an existing k-i- class appended to the element.
+        // Find if there is an existing k-i- class appended to the element.
         let currentIconClass = this.element.className.split(" ").find(x => x.startsWith(KI_PREFFIX));
         let className = this.options.icon ? `${this.options.icon.startsWith(KI_PREFFIX) ? "" : KI_PREFFIX}${this.options.icon}` : "";
 

package/dist/es2015/sparkline/sparkline.js

@@ -1,6 +1,6 @@
 import { Chart } from '../chart';
 import { BAR, BULLET, PIE, COLUMN, VERTICAL_BULLET } from '../chart/constants';
-import{ addClass, deepExtend, elementSize, getSpacing, inArray, isArray, isNumber, setDefaultOptions } from '../common';
+import { addClass, deepExtend, elementSize, getSpacing, inArray, isArray, isNumber, setDefaultOptions } from '../common';
 import SharedTooltip from './shared-tooltip';
 
 const DEAULT_BAR_WIDTH = 150;