@progress/kendo-react-charts 7.1.0-develop.1 → 7.1.0-develop.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -71,7 +71,7 @@ export interface BaseChartProps {
71
71
  */
72
72
  pannable?: boolean | DragAction;
73
73
  /**
74
- * Specifies if the Chart can be zoomed ([see example]({% slug panzoom_chart_charts %})).
74
+ * Specifies if the Chart can be zoomed ([see example]({% slug panzoom_chart_charts %})). Currently is only applicable to linear types, where the range on the X axis can be changed based on the zoom level.
75
75
  */
76
76
  zoomable?: boolean | Zoomable;
77
77
  /**
package/README.md CHANGED
@@ -17,6 +17,7 @@ The React Chart, part of KendoReact, renders a wide range of high-quality data v
17
17
  What's in this package (ToC):
18
18
 
19
19
  * [React Chart component](#react-chart-component)
20
+ * [React Sankey component](#react-sankey-component)
20
21
  * [React Sparkline component](#react-sparkline-component)
21
22
  * [React StockChart component](#react-stockchart-component)
22
23
  * [React Charts Components Library Features](#react-charts-library-shared-features)
@@ -44,6 +45,10 @@ What's in this package (ToC):
44
45
  * [React Scatter Chart](https://www.telerik.com/kendo-react-ui/components/charts/series-types/scatter/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-charts)
45
46
  * [React Waterfall Chart](https://www.telerik.com/kendo-react-ui/components/charts/series-types/waterfall/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-charts)
46
47
 
48
+ ## React Sankey Component
49
+
50
+ [The KendoReact Sankey component](https://www.telerik.com/kendo-react-ui/components/charts/sankey/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-charts) is a highly customizable React component for visualizing the Sankey Diagram (also known as Sankey Chart) that is used for many use cases such as visualizing website traffic or budget analysis.
51
+
47
52
  ## React Sparkline Component
48
53
 
49
54
  [The KendoReact Sparkline component](https://www.telerik.com/kendo-react-ui/components/charts/sparkline/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-charts) is a light-weight chart that focuses on rendering the values in a very compact way. These graphs are ideal when developers need to show trends and want to focus more on value movements. Generally, Stockcharts include extensive touch support and a navigator pane for easy browsing of extended time periods.
@@ -86,6 +91,7 @@ For any issues you might encounter while working with the KendoReact Charts, use
86
91
  High-level component overview pages
87
92
 
88
93
  * [React Charts Component](https://www.telerik.com/kendo-react-ui/charts)
94
+ * [React Sankey Component](https://www.telerik.com/kendo-react-ui/sankey)
89
95
  * [React Heatmap Chart Component](https://www.telerik.com/kendo-react-ui/heatmap)
90
96
  * [React Sparkline Component](https://www.telerik.com/kendo-react-ui/sparkline)
91
97
 
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the package root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- (function(n,I){typeof exports=="object"&&typeof module!="undefined"?I(exports,require("react"),require("prop-types"),require("@progress/kendo-react-intl"),require("@progress/kendo-charts"),require("@progress/kendo-react-common"),require("@progress/kendo-react-popup"),require("@progress/kendo-react-layout"),require("@progress/kendo-svg-icons")):typeof define=="function"&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-intl","@progress/kendo-charts","@progress/kendo-react-common","@progress/kendo-react-popup","@progress/kendo-react-layout","@progress/kendo-svg-icons"],I):(n=typeof globalThis!="undefined"?globalThis:n||self,I(n.KendoReactCharts={},n.React,n.PropTypes,n.KendoReactIntl,n.KendoCharts,n.KendoReactCommon,n.KendoReactPopup,n.KendoReactLayout,n.KendoSvgIcons))})(this,function(n,I,p,N,C,f,Xe,Ye,ze){"use strict";"use client";function qe(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const s in t)if(s!=="default"){const r=Object.getOwnPropertyDescriptor(t,s);Object.defineProperty(e,s,r.get?r:{enumerable:!0,get:()=>t[s]})}}return e.default=t,Object.freeze(e)}const a=qe(I);function X(t,e){let s=t;for(;s&&s!==e;)s=s.parentNode;return!!s}function E(t,e,s,r){const i=t[e];if(i&&Array.isArray(i)){for(let o of i)if(!o.type||o.type!==r)return new Error(`${s} children should be Array of type ${r.displayName}.`)}return null}const Y=t=>t===void 0?!1:!t,We=t=>({x:{location:t.pageX},y:{location:t.pageY}}),$e=(t,e)=>{const s=t.pointers,r=s[0],i=r.pageX,o=r.pageY;let h=0;if(s.length>1){const c=s[0],u=s[1];h=Math.sqrt(Math.pow(c.pageX-u.pageX,2)+Math.pow(c.pageY-u.pageY,2))}return{distance:h,event:t.srcEvent,preventDefault:function(){t.preventDefault()},target:t.target,touches:s.map(We),type:t.type,x:{delta:e?i-e.x.location:0,initialDelta:t.deltaX,location:i,startLocation:i-t.deltaX},y:{delta:e?o-e.y.location:0,initialDelta:t.deltaY,location:o,startLocation:o-t.deltaY}}};function Ze(t,e){for(let s=0;s<t.length;s++)if(e[t[s]])return!0;return!1}const z=[{end:"panend",move:"panmove",start:"panstart"},{gesturechange:"pinchmove",gestureend:"pinchend",gesturestart:"pinchstart"},{press:"press"},{tap:"tap"}];class Ge{constructor(e,s){this.hammerInstance=e,this.eventHandlers={},this.tap=this.tap.bind(this),this.press=this.press.bind(this),this.panstart=this.panstart.bind(this),this.panmove=this.panmove.bind(this),this.panend=this.panend.bind(this),this.pinchstart=this.pinchstart.bind(this),this.pinchmove=this.pinchmove.bind(this),this.pinchend=this.pinchend.bind(this),s&&this.bind(s)}tap(e){this.trigger("tap",e)}press(e){this.trigger("press",e)}panstart(e){delete this.previous,this.previous=this.trigger("start",e)}panmove(e){this.previous=this.trigger("move",e)}panend(e){this.trigger("end",e),delete this.previous}pinchstart(e){this.trigger("gesturestart",e)}pinchmove(e){this.trigger("gesturechange",e)}pinchend(e){this.trigger("gestureend",e)}trigger(e,s){const r=$e(s,this.previous);return this.eventHandlers[e]&&this.eventHandlers[e](r),r}bind(e={}){this.unbind(),this.eventHandlers=e;for(let s=0;s<z.length;s++){const r=z[s],i=Object.keys(r);if(Ze(i,e))for(let o=0;o<i.length;o++){const h=r[i[o]];this.hammerInstance.on(h,this[h])}}}unbind(){this.hammerInstance&&this.hammerInstance.off(),this.eventHandlers={}}destroy(){this.hammerInstance&&(this.hammerInstance.destroy(),delete this.hammerInstance),delete this.eventHandlers}toggleDrag(e){this.toggle("pan",e)}toggleZoom(e){this.toggle("pinch",e)}toggle(e,s){this.hammerInstance&&this.hammerInstance.get(e).set({enable:s})}}const Je="Hammerjs is not loaded.Solution: http://www.telerik.com/kendo-react-ui/components/charts/troubleshooting/#toc-installation";class Qe{static create(e,s){if(typeof window!="undefined"){const r=window.Hammer;if(!r){process.env.NODE_ENV!=="production"&&console.warn(Je);return}const i=new r(e,{recognizers:[[r.Tap],[r.Pan],[r.Pinch],[r.Press,{time:0}]]});return new Ge(i,s)}}}class g{constructor(e){this.target=e}}class q extends g{constructor(e,s){super(s),this.axis=e.axis,this.dataItem=e.dataItem,this.index=e.index,this.text=e.text,this.value=e.value}}class y extends g{constructor(){super(...arguments),this.prevented=!1}preventDefault(){this.prevented=!0}isDefaultPrevented(){return this.prevented}}class W extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class $ extends g{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class Z extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class T extends g{constructor(e,s){super(s),this.value=e.value,this.point=e.point,this.series=e.series,this.currentState=e.currentState,this.nextState=e.nextState}}class G extends y{constructor(e,s){super(s),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}}class J extends y{constructor(e,s){super(s),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}}class et extends y{constructor(e,s){super(s),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}}class Q extends g{constructor(e,s){super(s),this.from=e.from,this.to=e.to}}class ee extends g{constructor(e,s){super(s),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}}class te extends g{constructor(e,s){super(s),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}}class se extends g{constructor(e,s){super(s),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}}class re extends g{constructor(e,s){super(s),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}}class ae extends g{constructor(e,s){super(s)}}class ne extends y{constructor(e,s){super(s),this.axis=e.axis,this.from=e.from,this.to=e.to}}class ie extends g{constructor(e,s){super(s),this.axis=e.axis,this.from=e.from,this.to=e.to}}class oe extends y{constructor(e,s){super(s),this.axis=e.axis,this.from=e.from,this.to=e.to}}class le extends g{constructor(e,s){super(s),this.category=e.category,this.dataItem=e.dataItem,this.nativeEvent=e.originalEvent,this.percentage=e.percentage,this.point=e.point,this.series=e.series,this.stackValue=e.stackValue,this.value=e.value}}class ce extends y{constructor(e,s){super(s),this.category=e.category,this.categoryPoints=e.categoryPoints,this.dataItem=e.dataItem,this.nativeEvent=e.originalEvent,this.percentage=e.percentage,this.point=e.point,this.series=e.series,this.stackValue=e.stackValue,this.value=e.value}}class he extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.delta=e.delta,this.nativeEvent=e.originalEvent}}class ue extends g{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class de extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}const pe={axisLabelClick:q,drag:W,dragEnd:$,dragStart:Z,drilldownEvent:T,legendItemHover:G,legendItemClick:J,legendItemLeave:et,navigatorFilter:Q,noteClick:ee,noteHover:te,plotAreaClick:se,plotAreaHover:re,render:ae,select:ne,selectEnd:ie,selectStart:oe,seriesClick:le,seriesHover:ce,zoom:he,zoomEnd:ue,zoomStart:de};function tt(t,e,s){if(pe[t])return new pe[t](e,s)}class st{constructor(e,s){this.sender=e,this.syntheticEvent=s}}function me(t,e){return new st(t,e)}const A=t=>`${t.fontWeight} ${t.fontSize} ${t.fontFamily}`,ve=t=>window.getComputedStyle(t).backgroundColor,rt=t=>t.toLowerCase().charCodeAt(0)-"a".charCodeAt(0),at=t=>{const e=t.match(/series-([a-z])$/);if(e!==null)return rt(e[1]);const s=t.split("--series-")[1];return parseInt(s,10)-1},nt=30,it=`
5
+ (function(a,I){typeof exports=="object"&&typeof module!="undefined"?I(exports,require("react"),require("prop-types"),require("@progress/kendo-react-intl"),require("@progress/kendo-charts"),require("@progress/kendo-react-common"),require("@progress/kendo-react-popup"),require("@progress/kendo-react-layout"),require("@progress/kendo-svg-icons")):typeof define=="function"&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-intl","@progress/kendo-charts","@progress/kendo-react-common","@progress/kendo-react-popup","@progress/kendo-react-layout","@progress/kendo-svg-icons"],I):(a=typeof globalThis!="undefined"?globalThis:a||self,I(a.KendoReactCharts={},a.React,a.PropTypes,a.KendoReactIntl,a.KendoCharts,a.KendoReactCommon,a.KendoReactPopup,a.KendoReactLayout,a.KendoSvgIcons))})(this,function(a,I,l,_,f,C,Ge,Je,Qe){"use strict";"use client";function et(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const s in t)if(s!=="default"){const r=Object.getOwnPropertyDescriptor(t,s);Object.defineProperty(e,s,r.get?r:{enumerable:!0,get:()=>t[s]})}}return e.default=t,Object.freeze(e)}const n=et(I);function X(t,e){let s=t;for(;s&&s!==e;)s=s.parentNode;return!!s}function E(t,e,s,r){const i=t[e];if(i&&Array.isArray(i)){for(let o of i)if(!o.type||o.type!==r)return new Error(`${s} children should be Array of type ${r.displayName}.`)}return null}const Y=t=>t===void 0?!1:!t,tt=t=>({x:{location:t.pageX},y:{location:t.pageY}}),st=(t,e)=>{const s=t.pointers,r=s[0],i=r.pageX,o=r.pageY;let h=0;if(s.length>1){const u=s[0],d=s[1];h=Math.sqrt(Math.pow(u.pageX-d.pageX,2)+Math.pow(u.pageY-d.pageY,2))}return{distance:h,event:t.srcEvent,preventDefault:function(){t.preventDefault()},target:t.target,touches:s.map(tt),type:t.type,x:{delta:e?i-e.x.location:0,initialDelta:t.deltaX,location:i,startLocation:i-t.deltaX},y:{delta:e?o-e.y.location:0,initialDelta:t.deltaY,location:o,startLocation:o-t.deltaY}}};function rt(t,e){for(let s=0;s<t.length;s++)if(e[t[s]])return!0;return!1}const z=[{end:"panend",move:"panmove",start:"panstart"},{gesturechange:"pinchmove",gestureend:"pinchend",gesturestart:"pinchstart"},{press:"press"},{tap:"tap"}];class nt{constructor(e,s){this.hammerInstance=e,this.eventHandlers={},this.tap=this.tap.bind(this),this.press=this.press.bind(this),this.panstart=this.panstart.bind(this),this.panmove=this.panmove.bind(this),this.panend=this.panend.bind(this),this.pinchstart=this.pinchstart.bind(this),this.pinchmove=this.pinchmove.bind(this),this.pinchend=this.pinchend.bind(this),s&&this.bind(s)}tap(e){this.trigger("tap",e)}press(e){this.trigger("press",e)}panstart(e){delete this.previous,this.previous=this.trigger("start",e)}panmove(e){this.previous=this.trigger("move",e)}panend(e){this.trigger("end",e),delete this.previous}pinchstart(e){this.trigger("gesturestart",e)}pinchmove(e){this.trigger("gesturechange",e)}pinchend(e){this.trigger("gestureend",e)}trigger(e,s){const r=st(s,this.previous);return this.eventHandlers[e]&&this.eventHandlers[e](r),r}bind(e={}){this.unbind(),this.eventHandlers=e;for(let s=0;s<z.length;s++){const r=z[s],i=Object.keys(r);if(rt(i,e))for(let o=0;o<i.length;o++){const h=r[i[o]];this.hammerInstance.on(h,this[h])}}}unbind(){this.hammerInstance&&this.hammerInstance.off(),this.eventHandlers={}}destroy(){this.hammerInstance&&(this.hammerInstance.destroy(),delete this.hammerInstance),delete this.eventHandlers}toggleDrag(e){this.toggle("pan",e)}toggleZoom(e){this.toggle("pinch",e)}toggle(e,s){this.hammerInstance&&this.hammerInstance.get(e).set({enable:s})}}const at="Hammerjs is not loaded.Solution: http://www.telerik.com/kendo-react-ui/components/charts/troubleshooting/#toc-installation";class it{static create(e,s){if(typeof window!="undefined"){const r=window.Hammer;if(!r){process.env.NODE_ENV!=="production"&&console.warn(at);return}const i=new r(e,{recognizers:[[r.Tap],[r.Pan],[r.Pinch],[r.Press,{time:0}]]});return new nt(i,s)}}}class g{constructor(e){this.target=e}}class W extends g{constructor(e,s){super(s),this.axis=e.axis,this.dataItem=e.dataItem,this.index=e.index,this.text=e.text,this.value=e.value}}class y extends g{constructor(){super(...arguments),this.prevented=!1}preventDefault(){this.prevented=!0}isDefaultPrevented(){return this.prevented}}class Z extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class G extends g{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class J extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class N extends g{constructor(e,s){super(s),this.value=e.value,this.point=e.point,this.series=e.series,this.currentState=e.currentState,this.nextState=e.nextState}}class Q extends y{constructor(e,s){super(s),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}}class ee extends y{constructor(e,s){super(s),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}}class ot extends y{constructor(e,s){super(s),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}}class te extends g{constructor(e,s){super(s),this.from=e.from,this.to=e.to}}class se extends g{constructor(e,s){super(s),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}}class re extends g{constructor(e,s){super(s),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}}class ne extends g{constructor(e,s){super(s),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}}class ae extends g{constructor(e,s){super(s),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}}class ie extends g{constructor(e,s){super(s)}}class oe extends y{constructor(e,s){super(s),this.axis=e.axis,this.from=e.from,this.to=e.to}}class le extends g{constructor(e,s){super(s),this.axis=e.axis,this.from=e.from,this.to=e.to}}class ce extends y{constructor(e,s){super(s),this.axis=e.axis,this.from=e.from,this.to=e.to}}class he extends g{constructor(e,s){super(s),this.category=e.category,this.dataItem=e.dataItem,this.nativeEvent=e.originalEvent,this.percentage=e.percentage,this.point=e.point,this.series=e.series,this.stackValue=e.stackValue,this.value=e.value}}class ue extends y{constructor(e,s){super(s),this.category=e.category,this.categoryPoints=e.categoryPoints,this.dataItem=e.dataItem,this.nativeEvent=e.originalEvent,this.percentage=e.percentage,this.point=e.point,this.series=e.series,this.stackValue=e.stackValue,this.value=e.value}}class de extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.delta=e.delta,this.nativeEvent=e.originalEvent}}class me extends g{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}class pe extends y{constructor(e,s){super(s),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}}const ve={axisLabelClick:W,drag:Z,dragEnd:G,dragStart:J,drilldownEvent:N,legendItemHover:Q,legendItemClick:ee,legendItemLeave:ot,navigatorFilter:te,noteClick:se,noteHover:re,plotAreaClick:ne,plotAreaHover:ae,render:ie,select:oe,selectEnd:le,selectStart:ce,seriesClick:he,seriesHover:ue,zoom:de,zoomEnd:me,zoomStart:pe};function lt(t,e,s){if(ve[t])return new ve[t](e,s)}class ct{constructor(e,s){this.sender=e,this.syntheticEvent=s}}function fe(t,e){return new ct(t,e)}const A=t=>`${t.fontWeight} ${t.fontSize} ${t.fontFamily}`,Ce=t=>window.getComputedStyle(t).backgroundColor,ht=t=>t.toLowerCase().charCodeAt(0)-"a".charCodeAt(0),ut=t=>{const e=t.match(/series-([a-z])$/);if(e!==null)return ht(e[1]);const s=t.split("--series-")[1];return parseInt(s,10)-1},dt=30,mt=`
6
6
  <div class="k-var--primary"></div>
7
7
  <div class="k-var--base"></div>
8
8
  <div class="k-var--background"></div>
@@ -42,7 +42,24 @@
42
42
  <div class="k-var--series-d"></div>
43
43
  <div class="k-var--series-e"></div>
44
44
  <div class="k-var--series-f"></div>
45
- `;for(let e=0;e<nt;e++)t+=`
45
+ `;for(let e=0;e<dt;e++)t+=`
46
46
  <div class="k-var--series-${e+1}"></div>`;return t})()}
47
47
  </div>
48
- `;class ot{constructor(e){this.store=e}setStyle(e,s){this.store.dispatch({type:"set",payload:{field:e,value:s}})}setColors(){this.mapColor("axisDefaults.crosshair.color","chart-crosshair-background"),this.mapColor("axisDefaults.labels.color","normal-text-color"),this.mapColor("axisDefaults.line.color","chart-major-lines"),this.mapColor("axisDefaults.majorGridLines.color","chart-major-lines"),this.mapColor("axisDefaults.minorGridLines.color","chart-minor-lines"),this.mapColor("axisDefaults.notes.icon.background","chart-notes-background"),this.mapColor("axisDefaults.notes.icon.border.color","chart-notes-border"),this.mapColor("axisDefaults.notes.line.color","chart-notes-lines"),this.mapColor("axisDefaults.title.color","normal-text-color"),this.mapColor("chartArea.background","background"),this.mapColor("legend.inactiveItems.labels.color","chart-inactive"),this.mapColor("legend.inactiveItems.markers.color","chart-inactive"),this.mapColor("legend.labels.color","normal-text-color"),this.mapColor("seriesDefaults.boxPlot.downColor","chart-major-lines"),this.mapColor("seriesDefaults.boxPlot.mean.color","base"),this.mapColor("seriesDefaults.boxPlot.median.color","base"),this.mapColor("seriesDefaults.boxPlot.whiskers.color","primary"),this.mapColor("seriesDefaults.bullet.target.color","normal-text-color"),this.mapColor("seriesDefaults.candlestick.downColor","normal-text-color"),this.mapColor("seriesDefaults.candlestick.line.color","normal-text-color"),this.mapColor("seriesDefaults.errorBars.color","chart-error-bars-background"),this.mapColor("seriesDefaults.horizontalWaterfall.line.color","chart-major-lines"),this.mapColor("seriesDefaults.icon.border.color","chart-major-lines"),this.mapColor("seriesDefaults.labels.background","background"),this.mapColor("seriesDefaults.labels.color","normal-text-color"),this.mapColor("seriesDefaults.notes.icon.background","chart-notes-background"),this.mapColor("seriesDefaults.notes.icon.border.color","chart-notes-border"),this.mapColor("seriesDefaults.notes.line.color","chart-notes-lines"),this.mapColor("seriesDefaults.verticalBoxPlot.downColor","chart-major-lines"),this.mapColor("seriesDefaults.verticalBoxPlot.mean.color","base"),this.mapColor("seriesDefaults.verticalBoxPlot.median.color","base"),this.mapColor("seriesDefaults.verticalBoxPlot.whiskers.color","primary"),this.mapColor("seriesDefaults.verticalBullet.target.color","normal-text-color"),this.mapColor("seriesDefaults.waterfall.line.color","chart-major-lines"),this.mapColor("title.color","normal-text-color"),this.mapColor("subtitle.color","normal-text-color");const e=parseFloat(this.queryStyle("chart-area-opacity").opacity);isNaN(e)||(this.setStyle("seriesDefaults.area.opacity",e),this.setStyle("seriesDefaults.radarArea.opacity",e),this.setStyle("seriesDefaults.verticalArea.opacity",e),this.setStyle("seriesDefaults.labels.opacity",e)),this.setInactiveOpacity(["area","verticalArea"],"chart-area-inactive-opacity"),this.setInactiveOpacity(["line","verticalLine"],"chart-line-inactive-opacity")}setFonts(){const e=A(this.queryStyle("chart-font")),s=A(this.queryStyle("chart-title-font")),r=A(this.queryStyle("chart-pane-title-font")),i=A(this.queryStyle("chart-label-font"));this.setStyle("axisDefaults.labels.font",i),this.setStyle("axisDefaults.notes.label.font",e),this.setStyle("axisDefaults.title.font",e),this.setStyle("legend.labels.font",e),this.setStyle("seriesDefaults.labels.font",i),this.setStyle("seriesDefaults.notes.label.font",e),this.setStyle("title.font",s),this.setStyle("subtitle.font",r),this.setStyle("paneDefaults.title.font",r)}setSeriesColors(){const e=this.element,s=[].slice.call(e.querySelectorAll(".k-var--series div")),r=ve(e.querySelector(".k-var--series-unset")),i=s.reduce((o,h)=>{const c=at(h.className),u=ve(h);return u!==r&&(o[c]=u),o},[]);this.setStyle("seriesColors",i)}mapColor(e,s){this.setStyle(e,this.queryStyle(s).backgroundColor)}queryStyle(e){const s=this.element;return window.getComputedStyle(s.querySelector(`.k-var--${e}`))}setInactiveOpacity(e,s){const r=parseFloat(this.queryStyle(s).opacity);!isNaN(r)&&r<1&&e.forEach(i=>this.setStyle(`seriesDefaults.${i}.highlight.inactiveOpacity`,r))}}const lt=(t,e,s)=>{const r=new ot(t);if(typeof s=="undefined"){t.dispatch({type:"push",payload:C.chartBaseTheme()});return}const i=r.element=s.createElement("div");i.style.display="none",i.innerHTML=it,s.body.appendChild(i);try{t.dispatch({type:"push",payload:C.chartBaseTheme()}),r.setColors(),r.setFonts(),r.setSeriesColors()}finally{s.body.removeChild(r.element),delete r.element,e()}},ct=1e3/60,_=t=>{let e,s,r=[];const i=()=>e,o=c=>{e=t(e,c),f.canUseDOM&&(window.clearTimeout(s),s=window.setTimeout(()=>r.forEach(u=>u()),ct))},h=c=>(r.push(c),()=>r=r.filter(u=>u!==c));return o({}),{getState:i,dispatch:o,subscribe:h}},Ce=(t,e)=>e.chartCollectionIdxKey?k.collectionConfigurationItem(t,e):e.chartKey?k.configurationItem(t,e):{},ht=(t,e)=>{if(e.type)switch(e.type){case"set":return k.themeItem(t,e);case"push":return Object.assign(t,e.payload);default:return t}else return{}},ut=(t,e)=>{if(e.type)switch(e.type){case"add":return[...t,e.payload];case"remove":return t.filter(s=>s!==e.payload);default:return t}else return[]},k={configurationItem(t,e){return Object.assign(t,{[e.chartKey]:e.payload})},collectionConfigurationItem(t,e){let s=!1;const[r,i]=e.chartCollectionIdxKey.split("_"),o=t[r].map((h,c)=>parseInt(i,10)===c?(s=!0,e.payload):h);return s===!1&&o.splice(parseInt(i,10),0,e.payload),Object.assign(t,{[r]:o})},themeItem(t,e){let s={},r=Object.assign(s,t);const{field:i,value:o}=e.payload,h=i.split(".");let c=h.shift();for(;h.length>0;)s=s[c]=s[c]||{},c=h.shift();return s[c]=o,r}};class O{constructor(e,s){this.value=e.value,this.category=e.category,this.categoryIndex=e.categoryIx,this.series=e.series,this.dataItem=e.dataItem,this.percentage=e.percentage,this.runningTotal=e.runningTotal,this.total=e.total,this.low=e.low,this.high=e.high,this.xLow=e.xLow,this.xHigh=e.xHigh,this.yLow=e.yLow,this.yHigh=e.yHigh,this.point=e,this.format=((e.options||{}).tooltip||{}).format||s}get formattedValue(){return this.format?this.point.formatValue(this.format):String(this.value)}}const dt="k-chart-shared-tooltip-marker",ge=t=>{const{categoryText:e,colorMarker:s,colspan:r,nameColumn:i,points:o}=t,h=(c,u)=>a.createElement("tr",{key:u},s&&a.createElement("td",null,a.createElement("span",{className:dt,style:{backgroundColor:c.series.color}})),i&&a.createElement("td",null,c.series.name),a.createElement("td",{dangerouslySetInnerHTML:{__html:c.formattedValue}}));return a.createElement("table",null,a.createElement("thead",null,a.createElement("tr",null,a.createElement("th",{colSpan:r},e))),a.createElement("tbody",null,o.map(h)))},b=a.createContext(null);b.displayName="ChartContext";const pt={horizontal:"fit",vertical:"fit"},mt="k-chart-tooltip",vt="k-chart-tooltip-wrapper";class D extends a.Component{constructor(e,s){super(e,s),this.context=null,this.element=null,this.onChartMouseLeave=r=>{const{syntheticEvent:i}=r;return!!X(i.relatedTarget,this.element)},this.onMouseLeave=r=>{const i=me(this,r);this.context.childrenObserver.trigger("onMouseLeave",i)&&r.preventDefault()},this.popupRef=r=>{this.element=r;const i=r&&r.closest(".k-animation-container");i&&(i.style.transition="initial")},this.chartObserver=new C.InstanceObserver(this,{onMouseLeave:"onChartMouseLeave"}),s.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupShown:e,popupAlign:s,popupOffset:r,popupStyles:i,popupContent:o,className:h}=this.props,c=[mt,h].join(" ").trim();return a.createElement(Xe.Popup,{animate:!1,popupAlign:s,offset:r,show:e,collision:pt,className:vt},a.createElement("div",{className:c,style:i,onMouseLeave:this.onMouseLeave,ref:this.popupRef},o()))}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}}D.contextType=b;const Ct="k-chart-shared-tooltip",gt="k-chart-tooltip-inverse";class L extends a.Component{constructor(){super(...arguments),this.context=null,this.state={popupShown:!1},this.chartObserver=null}componentDidMount(){this.chartObserver=new C.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"}),this.context.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContext:e,shared:s,className:r,...i}=this.state,o=this.state.popupShown?()=>{const c=this.findRenderFunction();if(s)return c!==null?c(e):a.createElement(ge,{...e});{const u=e.point,d=this.findRenderFunctionByIndex(u.series.index);return d!==null?d(e):c!==null?c(e):a.createElement("span",{dangerouslySetInnerHTML:{__html:e.point.formattedValue}})}}:Function.prototype,h=f.classNames({[Ct]:s,[gt]:!!r});return a.createElement(D,{...i,popupContent:o,className:h})}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:s,style:r,shared:i,className:o,crosshair:h}=e;let c;h||(i?c=this.createSharedTooltipContext(e):c=this.createTooltipContext(e),this.setState({popupShown:!0,popupAlign:s.align,popupOffset:s.point,popupContext:c,popupStyles:r,className:o,shared:i}))}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}createSharedTooltipContext(e){const{points:s,categoryText:r}=e,i=s.filter(c=>typeof c.series.name!="undefined").length>0,o=e.series.length>1;let h=1;return i&&h++,o&&h++,{categoryText:r,colorMarker:o,colspan:h,nameColumn:i,points:e.points.map(c=>new O(c,e.format))}}createTooltipContext(e){const{point:s,format:r}=e;return{point:new O(s,r)}}findRenderFunctionByIndex(e){const s=this.context.optionsStore.getState().series;return s!==void 0&&Array.isArray(s)&&s[e]!==void 0&&s[e].hasOwnProperty("tooltip")&&s[e].tooltip.hasOwnProperty("render")?s[e].tooltip.render:null}findRenderFunction(){const e=this.context.optionsStore.getState().tooltip;return e!==void 0&&e.hasOwnProperty("render")?e.render:null}}L.contextType=b;const fe=t=>t.children;fe.displayName="Container";const ft="k-chart-crosshair-tooltip",yt="k-chart-tooltip-inverse";class K extends a.Component{constructor(e,s){super(e,s),this.context=null,this.state={popupShown:!1},this.chartObserver=new C.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"}),s.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContend:e,className:s,...r}=this.state,i=this.state.popupShown?()=>e:Function.prototype,o=f.classNames({[ft]:!0,[yt]:!!s});return a.createElement(D,{...r,popupContent:i,className:o})}componentWillUnmount(){var e;(e=this.context)==null||e.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:s,style:r,className:i,crosshair:o,axisName:h,axisIndex:c,value:u}=e,{name:d,index:v}=this.props;o&&h===d&&c===v&&this.setState({popupShown:!0,popupAlign:s.align,popupOffset:s.point,popupContend:u,popupStyles:r,className:i})}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}}K.contextType=b;const ye=["categoryAxis","valueAxis","xAxis","yAxis"];function bt(t){const e={};for(let s=0;s<ye.length;s++){const r=St(t,ye[s]);for(let i=0;i<r.length;i++){const o=r[i];e[o.name+o.index]=o}}return e}function St(t,e){const s=[];if(t[e]){const r=[].concat(t[e]);for(let i=0;i<r.length;i++){const o=(r[i].crosshair||{}).tooltip;o&&o.visible&&s.push({index:i,name:e})}}return s}class P extends a.Component{constructor(){super(...arguments),this.context=null,this.state={tooltips:{}},this.storeUnsubscriber=Function.prototype,this.subscriber=()=>{var e;this.setState({tooltips:bt((e=this.context)==null?void 0:e.optionsStore.getState())})}}componentDidMount(){this.storeUnsubscriber=this.context.optionsStore.subscribe(this.subscriber)}render(){const{tooltips:e}=this.state,s=Object.keys(e).map(r=>a.createElement(K,{...e[r],key:r}));return a.createElement(fe,null,s)}componentWillUnmount(){this.storeUnsubscriber()}}P.contextType=b;const be={name:"@progress/kendo-react-charts",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};class x extends a.Component{constructor(e){super(e),this.chartInstance=null,this.surface=null,this._element=null,this.optionsStore={},this.optionsUnsubscriber=Function.prototype,this.themeStore={},this.themeUnsubscriber=Function.prototype,this.observersStore={},this.suppressTransitions=!1,this.showLicenseWatermark=!1,this.onRender=s=>{this.chartInstance!==null&&(this.surface=s.sender.surface,this.trigger("render",s))},this.onDrilldown=s=>{var h;const{series:r}=this.optionsStore.getState(),i=r.find(c=>c.name===s.series.name);if(!i.drilldownSeriesFactory)return!0;const o="onDrilldown";if(this.props.hasOwnProperty(o)){const c={seriesName:i.name,drilldownValue:s.value},u=[...((h=this.props.drilldownState)==null?void 0:h.steps)||[],c],d=this.props.getTarget(),v={...s,currentState:this.props.drilldownState,nextState:{steps:u}},m=new T(v,d);this.props[o].call(void 0,m)}return!0},this.onLegendItemClick=s=>{if(this.chartInstance!==null)if(this.props.onLegendItemClick)this.trigger("legendItemClick",s);else{const{series:r}=this.optionsStore.getState();if(!r)return;let i={};const{seriesIndex:o,pointIndex:h}=s,c=r[o];if(h===void 0)i=Object.assign({},c,{visible:Y(c.visible)});else{const u=c.pointVisibility=c.pointVisibility||[];u[h]=Y(u[h]),i=Object.assign({},c)}this.optionsStore.dispatch({chartCollectionIdxKey:`series_${o}`,payload:i}),this.suppressTransitions=!0}},this.onWindowResize=()=>{this.chartInstance!==null&&this.chartInstance.resize()},this.onChartMouseLeave=s=>{const r=me(this,s);this.triggerDomEvent("onMouseLeave",r)?s.preventDefault():this.chartInstance!==null&&this.chartInstance.hideElements()},this.onChildMouseLeave=s=>{const{syntheticEvent:r}=s;return this.chartInstance&&!X(r.relatedTarget,this.element)&&this.chartInstance.hideElements(),!1},f.validatePackage(be),this.showLicenseWatermark=f.shouldShowValidationUI(be),this.optionsStore=_(Ce),this.observersStore=_(ut),this.childrenObserver=new C.InstanceObserver(this,{onMouseLeave:"onChildMouseLeave"}),this.state={optionsStore:this.optionsStore,observersStore:this.observersStore,childrenObserver:this.childrenObserver,drilldownState:{steps:[]}},this.themeStore=_(ht),this.chartObserver=new C.InstanceObserver(this,{render:"onRender",legendItemClick:"onLegendItemClick",drilldown:"onDrilldown"})}get element(){return this._element}static getDerivedStateFromProps(e,s){return{...s,drilldownState:e.drilldownState||[]}}componentDidMount(){var s;const e=((s=this._element)==null?void 0:s.ownerDocument)||document;lt(this.themeStore,this.instantiateCoreChart.bind(this),e),this.optionsUnsubscriber=this.optionsStore.subscribe(this.refresh.bind(this)),this.themeUnsubscriber=this.themeStore.subscribe(this.refresh.bind(this)),window.addEventListener("resize",this.onWindowResize)}componentWillUnmount(){this.optionsUnsubscriber(),this.themeUnsubscriber(),this.chartInstance!==null&&(this.chartInstance.destroy(),this.chartInstance=null),window.removeEventListener("resize",this.onWindowResize)}componentDidUpdate(e){const{dir:s,children:r,...i}=this.props;if(this.chartInstance!==null){const o=N.provideIntlService(this),h=this.chartInstance.chartService,c=o.locale!==h._intlService.locale,u=Object.entries(e).filter(d=>d[0]!=="dir"&&d[0]!=="children").some(d=>{const[v,m]=d;return!(i.hasOwnProperty(v)&&i[v]===m)});c&&(this.chartInstance.chartService._intlService=o,this.chartInstance.chartService.format._intlService=o,u||this.chartInstance.noTransitionsRedraw()),u&&this.refresh(),e.dir!==s&&this.chartInstance.setDirection(this.getDirection(s))}}render(){const{style:e={},className:s,wrapper:r,children:i}=this.props,o=Object.assign({},e,{position:"relative"}),h=a.createElement(r,{className:s,style:o,key:"chartElement"},a.createElement("div",{onMouseLeave:this.onChartMouseLeave,ref:c=>this._element=c,className:"k-chart-surface"},i),a.createElement(a.Fragment,null,this.showLicenseWatermark&&a.createElement(f.WatermarkOverlay,null)));return a.createElement(b.Provider,{value:this.state},a.createElement(L,{key:"seriesTooltip"}),a.createElement(P,{key:"crosshairTooltips"}),h)}getDirection(e){return(e!==void 0?e:(()=>f.canUseDOM&&window.getComputedStyle(this.element).direction)()||"ltr")==="rtl"}getChartOptions(){const{renderAs:e,pannable:s,zoomable:r,paneDefaults:i,panes:o,transitions:h,seriesColors:c,seriesDefaults:u,axisDefaults:d,deriveOptionsFromParent:v}=this.props;let m={};return e!==void 0&&(m.renderAs=e),s!==void 0&&(m.pannable=s),r!==void 0&&(m.zoomable=r),i!==void 0&&(m.paneDefaults=i),o!==void 0&&(m.panes=o),h!==void 0&&(m.transitions=h),c!==void 0&&(m.seriesColors=c),u!==void 0&&(m.seriesDefaults=u),d!==void 0&&(m.axisDefaults=d),m=Object.assign(m,this.optionsStore.getState()),v&&(m=v(m)),m}refresh(){if(this.chartInstance!==null){const e=this.themeStore.getState(),s=this.getChartOptions(),r=s.transitions;this.suppressTransitions&&(s.transitions=!1),this.props.onRefresh?this.props.onRefresh.call(void 0,s,e,this.chartInstance):this.chartInstance.setOptions(s,e),this.suppressTransitions&&(s.transitions=r,this.suppressTransitions=!1)}}instantiateCoreChart(){const{dir:e,chartConstructor:s}=this.props,r=this.getChartOptions();this.chartInstance=new s(this.element,r,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:N.provideIntlService(this),observer:this.chartObserver,sender:this})}trigger(e,s){const r=this.props.getTarget(),i=tt(e,s,r),o="on"+e.charAt(0).toUpperCase()+e.slice(1),h=this.observersStore.getState();let c=!1;for(let u=0;u<h.length;u++)h[u].trigger(e,s)&&(c=!0);return c===!1&&i&&this.props.hasOwnProperty(o)?(this.props[o].call(void 0,i),i.isDefaultPrevented&&i.isDefaultPrevented()):c}requiresHandlers(e){for(let s=0;s<e.length;s++){const r=e[s],i="on"+r.charAt(0).toUpperCase()+r.slice(1);if(this.props.hasOwnProperty(i))return!0}return!1}triggerDomEvent(e,s){const r=this.observersStore.getState();let i=!1;for(let o=0;o<r.length;o++)r[o].trigger(e,s)&&(i=!0);return i}}x.propTypes={dir:p.string,renderAs:p.oneOf(["svg","canvas"])},x.defaultProps={renderAs:"svg"},N.registerForIntl(x),C.DomEventsBuilder.register(Qe);class R extends a.Component{constructor(e,s){super(e,s),this.context=null,this.state={donutCenterStyles:null},this.chartObserver=new C.InstanceObserver(this,{render:"onRender"}),s.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{render:e}=this.props,{donutCenterStyles:s}=this.state;let r=null;return e&&s&&(r=a.createElement("div",{className:"k-chart-donut-center",style:s},a.createElement(e,null))),r}onRender(e){var v;const s=(v=this.context)==null?void 0:v.optionsStore.getState().series,r=Array.isArray(s)?s[0]:null,i=e.sender._plotArea.charts;if(!r||r.type!=="donut"||i[0].points.length===0)return;const o=i[0].points[0].sector,h=o.innerRadius,c=o.center.y-h,u=o.center.x-h,d=h*2;this.setState({donutCenterStyles:{height:d,left:u,top:c,width:d}})}}R.contextType=b;class Et extends a.Component{constructor(){super(...arguments),this._baseChart=null,this.getTarget=()=>this}get chartInstance(){return this._baseChart!==null?this._baseChart.chartInstance:null}get surface(){return this._baseChart!==null?this._baseChart.surface:null}get element(){return this._baseChart!==null?this._baseChart.element:null}render(){const{donutCenterRender:e,children:s,className:r,...i}=this.props;return a.createElement(x,{...i,ref:o=>this._baseChart=o,chartConstructor:C.Chart,getTarget:this.getTarget,wrapper:"div",className:f.classNames("k-chart k-widget",r)},s,a.createElement(R,{render:e}))}}class xt extends a.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const{type:s,data:r}=this.props,i=Object.assign({},e,{type:s,data:r});return C.Sparkline.normalizeOptions(i)},this.getTarget=()=>this}get chartInstance(){return this._baseChart!==null?this._baseChart.chartInstance:null}get surface(){return this._baseChart!==null?this._baseChart.surface:null}get element(){return this._baseChart!==null?this._baseChart.element:null}render(){const{children:e,type:s,className:r,...i}=this.props;return a.createElement(x,{...i,ref:o=>this._baseChart=o,chartConstructor:C.Sparkline,getTarget:this.getTarget,wrapper:"span",deriveOptionsFromParent:this.deriveOptionsFromParent,className:f.classNames("k-sparkline k-widget",r)},e)}}const It={autoBindElements:!0,liveDrag:!1,partialRedraw:!0};class At extends a.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const s=Object.assign({},e.navigator||{},It);return Object.assign({},e,{navigator:s})},this.onRefresh=(e,s,r)=>{this.props.partialRedraw?(r.applyOptions(e),r.bindCategories(),r.navigator.redrawSlaves()):r.setOptions(e,s)},this.getTarget=()=>this}get chartInstance(){return this._baseChart!==null?this._baseChart.chartInstance:null}get surface(){return this._baseChart!==null?this._baseChart.surface:null}get element(){return this._baseChart!==null?this._baseChart.element:null}render(){const{children:e,className:s,...r}=this.props;return a.createElement(x,{...r,ref:i=>this._baseChart=i,chartConstructor:C.StockChart,getTarget:this.getTarget,wrapper:"div",deriveOptionsFromParent:this.deriveOptionsFromParent,onRefresh:this.onRefresh,className:f.classNames("k-stockchart k-widget",s)},e)}}class S extends a.Component{constructor(e,s){super(e,s),this.optionsStore=s.optionsStore}renderChildren(e,s){const{children:r}=e.props,{_chartKey:i,_parentStore:o}=this.props,h={...e.props,_chartCollectionIdxKey:`${i}_${s}`,_parentStore:o};return a.cloneElement(e,h,r)}render(){const{_chartKey:e,_parentStore:s,children:r}=this.props;return(s||this.optionsStore).dispatch({chartKey:e,payload:[]}),a.Children.map(r,(o,h)=>a.isValidElement(o)?this.renderChildren(o,h):o)}}S.contextType=b;class l extends a.Component{constructor(e,s){super(e,s),this.optionsStore=s.optionsStore,this.childStore=_(Ce)}render(){const{children:e}=this.props;return e!==void 0?a.Children.map(e,s=>a.isValidElement(s)?this.renderChildren(s):s):null}componentDidMount(){this.dispatch()}componentDidUpdate(){this.dispatch()}dispatch(){const{_chartKey:e,_chartCollectionIdxKey:s,_parentStore:r,children:i,...o}=this.props;(r||this.optionsStore).dispatch({chartKey:e,chartCollectionIdxKey:s,payload:Object.assign({},o,this.childStore.getState())})}renderChildren(e){const{children:s}=e.props,r={...e.props,_parentStore:this.childStore};return a.cloneElement(e,r,s)}}l.contextType=b;class Se{constructor(e){this.currentState=e.currentState,this.nextState=e.nextState}}const w=a.forwardRef((t,e)=>{const s=a.useRef(null),r=a.useRef(null);a.useImperativeHandle(s,()=>({element:r.current,props:t})),a.useImperativeHandle(e,()=>s.current);let o=[{id:"0",...t.rootItem||{text:"Home",icon:a.createElement(f.SvgIcon,{icon:ze.homeIcon,style:{marginInlineEnd:"4px"}})}}];t.drilldownState&&(o=[...o,...t.drilldownState.steps.map((u,d)=>({id:(d+1).toString(),text:u.drilldownValue}))]);const h={...t,data:o},c=u=>{var v;const d="onDrilldownStateChange";if(t.hasOwnProperty(d)){const m=o.findIndex(Ns=>Ns.id===u.id),Ds={steps:(((v=t.drilldownState)==null?void 0:v.steps)||[]).slice(0,m)},ws=new Se({currentState:t.drilldownState,nextState:Ds});t[d].call(void 0,ws)}};return a.createElement("div",null,a.createElement(Ye.Breadcrumb,{...h,onItemSelect:c}))}),_t={id:p.string,style:p.object,className:p.string,breadcrumbOrderedList:p.elementType,breadcrumbListItem:p.elementType,breadcrumbDelimiter:p.elementType,breadcrumbLink:p.elementType,dir:p.oneOf(["ltr","rtl"]),disabled:p.bool,valueField:p.string,textField:p.string,iconField:p.string,iconClassField:p.string,onItemSelect:p.func,ariaLabel:p.string,onDrilldownStateChange:p.func,drilldownState:p.shape({steps:p.array}),rootItem:p.object},Dt={valueField:"id",textField:"text",iconField:"icon",iconClassField:"iconClass",data:[]};w.displayName="KendoReactChartBreadcrumb",w.propTypes=_t,w.defaultProps=Dt;const wt=t=>a.createElement(l,{...t,_chartKey:"chartArea"}),Nt=t=>a.createElement(l,{...t,_chartKey:"axisDefaults"}),F=t=>a.createElement(l,{...t});F.displayName="ChartCategoryAxisItem";const Ee=t=>a.createElement(S,{...t,_chartKey:"categoryAxis"});Ee.propTypes={children:function(t,e,s){return E(t,e,s,F)}};const Tt=t=>a.createElement(l,{visible:!0,...t,_chartKey:"legend"}),kt=t=>a.createElement(l,{visible:!0,position:"bottom",...t,_chartKey:"navigator"}),M=t=>a.createElement(l,{...t});M.displayName="ChartPane";const xe=t=>a.createElement(l,{...t,_chartKey:"paneDefaults"});xe.displayName="ChartPaneDefaults";const Ie=t=>a.createElement(S,{...t,_chartKey:"panes"});Ie.propTypes={children:function(t,e,s){return E(t,e,s,M)}};const Ot=t=>a.createElement(l,{...t,_chartKey:"plotArea"}),H=t=>{let e=r=>a.createElement(a.Fragment,null);t.drilldownSeriesFactory&&(e=t.drilldownSeriesFactory);const s=r=>{var i,o;return r&&((o=(i=r.drilldownState)==null?void 0:i.steps)==null?void 0:o.find(({seriesName:h})=>h===t.name))};return a.createElement(b.Consumer,null,r=>s(r)?a.createElement(e,{_chartCollectionIdxKey:t._chartCollectionIdxKey,drilldownValue:s(r).drilldownValue}):a.createElement(l,{...t}))};H.displayName="ChartSeriesItem";const Ae=t=>a.createElement(S,{...t,_chartKey:"series"});Ae.propTypes={children:function(t,e,s){return E(t,e,s,H)}};const Lt=t=>a.createElement(l,{...t,_chartKey:"seriesDefaults"}),Kt=t=>a.createElement(l,{...t,_chartKey:"subtitle"}),Pt=t=>a.createElement(l,{...t,_chartKey:"title"}),Rt=t=>a.createElement(l,{visible:!0,...t,_chartKey:"tooltip"}),V=t=>a.createElement(l,{...t});V.displayName="ChartValueAxisItem";const _e=t=>a.createElement(S,{...t,_chartKey:"valueAxis"});_e.propTypes={children:function(t,e,s){return E(t,e,s,V)}};const j=t=>a.createElement(l,{...t});j.displayName="ChartXAxisItem";const De=t=>a.createElement(S,{...t,_chartKey:"xAxis"});De.prototype={children:function(t,e,s){return E(t,e,s,j)}};const B=t=>a.createElement(l,{...t});B.displayName="ChartYAxisItem";const we=t=>a.createElement(S,{...t,_chartKey:"yAxis"});we.propTypes={children:function(t,e,s){return E(t,e,s,B)}};const Ft=t=>a.createElement(l,{...t,_chartKey:"zoomable"}),Ne=t=>a.createElement(l,{...t,_chartKey:"title"});Ne.displayName="ChartAxisDefaultsTitle";const Te=t=>a.createElement(l,{...t,_chartKey:"labels"});Te.displayName="ChartAxisDefaultsLabels";const ke=t=>a.createElement(l,{visible:!0,...t,_chartKey:"crosshair"});ke.displayName="ChartAxisDefaultsCrosshair";const Oe=t=>a.createElement(l,{visible:!0,...t,_chartKey:"tooltip"});Oe.displayName="ChartAxisDefaultsCrosshairTooltip";const Mt=t=>a.createElement(l,{visible:!0,...t,_chartKey:"crosshair"}),Ht=t=>a.createElement(l,{visible:!0,...t,_chartKey:"tooltip"}),Le=t=>a.createElement(l,{...t,_chartKey:"title"});Le.displayName="ChartCategoryAxisTitle";const Vt=t=>a.createElement(l,{visible:!0,...t,_chartKey:"labels"}),jt=t=>a.createElement(l,{...t,_chartKey:"notes"}),Bt=t=>a.createElement(l,{...t,_chartKey:"icon"}),Ut=t=>a.createElement(l,{...t,_chartKey:"label"}),Xt=t=>a.createElement(l,{visible:!0,...t,_chartKey:"rangeLabels"}),Ke=t=>a.createElement(l,{...t,_chartKey:"title"});Ke.displayName="ChartPaneDefaultsTitle";const Pe=t=>a.createElement(l,{...t,_chartKey:"item"});Pe.displayName="ChartLegendItem";const Re=t=>a.createElement(l,{...t,_chartKey:"title"});Re.displayName="ChartLegendTitle";const Fe=t=>a.createElement(l,{...t,_chartKey:"inactiveItems"});Fe.displayName="ChartLegendInactiveItems";const Yt=t=>a.createElement(l,{...t,_chartKey:"tooltip"}),zt=t=>a.createElement(l,{...t,_chartKey:"outliers"}),qt=t=>a.createElement(l,{...t,_chartKey:"notes"}),Wt=t=>a.createElement(l,{...t,_chartKey:"markers"}),$t=t=>a.createElement(l,{visible:!0,...t,_chartKey:"labels"}),Zt=t=>a.createElement(l,{...t,_chartKey:"highlight"}),Gt=t=>a.createElement(l,{...t,_chartKey:"extremes"}),Jt=t=>a.createElement(l,{...t,_chartKey:"errorBars"}),Qt=t=>a.createElement(l,{...t,_chartKey:"from"}),es=t=>a.createElement(l,{...t,_chartKey:"to"}),ts=t=>a.createElement(l,{...t,_chartKey:"label"}),ss=t=>a.createElement(l,{...t,_chartKey:"icon"}),rs=t=>a.createElement(l,{visible:!0,...t,_chartKey:"crosshair"}),as=t=>a.createElement(l,{visible:!0,...t,_chartKey:"tooltip"}),ns=t=>a.createElement(l,{visible:!0,...t,_chartKey:"labels"}),is=t=>a.createElement(l,{...t,_chartKey:"notes"}),os=t=>a.createElement(l,{...t,_chartKey:"icon"}),ls=t=>a.createElement(l,{...t,_chartKey:"label"}),Me=t=>a.createElement(l,{...t,_chartKey:"title"});Me.displayName="ChartValueAxisTitle";const cs=t=>a.createElement(l,{visible:!0,...t,_chartKey:"crosshair"}),hs=t=>a.createElement(l,{visible:!0,...t,_chartKey:"tooltip"}),us=t=>a.createElement(l,{visible:!0,...t,_chartKey:"labels"}),ds=t=>a.createElement(l,{...t,_chartKey:"notes"}),ps=t=>a.createElement(l,{...t,_chartKey:"icon"}),ms=t=>a.createElement(l,{...t,_chartKey:"label"}),He=t=>a.createElement(l,{...t,_chartKey:"title"});He.displayName="ChartXAxisTitle";const vs=t=>a.createElement(l,{visible:!0,...t,_chartKey:"crosshair"}),Cs=t=>a.createElement(l,{visible:!0,...t,_chartKey:"tooltip"}),gs=t=>a.createElement(l,{visible:!0,...t,_chartKey:"labels"}),fs=t=>a.createElement(l,{...t,_chartKey:"notes"}),ys=t=>a.createElement(l,{...t,_chartKey:"icon"}),bs=t=>a.createElement(l,{...t,_chartKey:"label"}),Ve=t=>a.createElement(l,{...t,_chartKey:"title"});Ve.displayName="ChartYAxisTitle";const je=t=>a.createElement(l,{...t,_chartKey:"categoryAxis"});je.displayName="ChartNavigatorCategoryAxis";const Ss=t=>a.createElement(l,{...t,_chartKey:"hint"}),Be=t=>a.createElement(l,{...t,_chartKey:"pane"});Be.displayName="ChartNavigatorPane";const Es=t=>a.createElement(l,{...t,_chartKey:"select"}),U=t=>a.createElement(l,{...t});U.displayName="ChartNavigatorSeriesItem";const Ue=t=>a.createElement(S,{...t,_chartKey:"series"});Ue.propTypes={children:function(t,e,s){return E(t,e,s,U)}};const xs=(t,e)=>{if(t&&t.chartInstance!==null)return t.chartInstance.findAxisByName(e)},Is=(t,e)=>{if(t&&t.chartInstance!==null)return t.chartInstance.findPaneByIndex(e)},As=(t,e)=>{if(t&&t.chartInstance!==null)return t.chartInstance.findPaneByName(e)},_s=(t,e={})=>{if(t&&t.chartInstance!==null)return t.chartInstance.exportVisual(e)};n.AxisLabelClickEvent=q,n.Chart=Et,n.ChartArea=wt,n.ChartAxisDefaults=Nt,n.ChartAxisDefaultsCrosshair=ke,n.ChartAxisDefaultsCrosshairTooltip=Oe,n.ChartAxisDefaultsLabels=Te,n.ChartAxisDefaultsTitle=Ne,n.ChartBreadcrumb=w,n.ChartCategoryAxis=Ee,n.ChartCategoryAxisCrosshair=Mt,n.ChartCategoryAxisCrosshairTooltip=Ht,n.ChartCategoryAxisItem=F,n.ChartCategoryAxisLabels=Vt,n.ChartCategoryAxisNotes=jt,n.ChartCategoryAxisNotesIcon=Bt,n.ChartCategoryAxisNotesLabel=Ut,n.ChartCategoryAxisRangeLabels=Xt,n.ChartCategoryAxisTitle=Le,n.ChartLegend=Tt,n.ChartLegendInactiveItems=Fe,n.ChartLegendItem=Pe,n.ChartLegendTitle=Re,n.ChartNavigator=kt,n.ChartNavigatorCategoryAxis=je,n.ChartNavigatorHint=Ss,n.ChartNavigatorPane=Be,n.ChartNavigatorSelect=Es,n.ChartNavigatorSeries=Ue,n.ChartNavigatorSeriesItem=U,n.ChartPane=M,n.ChartPaneDefaults=xe,n.ChartPaneDefaultsTitle=Ke,n.ChartPanes=Ie,n.ChartPlotArea=Ot,n.ChartSeries=Ae,n.ChartSeriesDefaults=Lt,n.ChartSeriesErrorBars=Jt,n.ChartSeriesExtremes=Gt,n.ChartSeriesHighlight=Zt,n.ChartSeriesItem=H,n.ChartSeriesItemOutliers=zt,n.ChartSeriesItemTooltip=Yt,n.ChartSeriesLabels=$t,n.ChartSeriesLabelsFrom=Qt,n.ChartSeriesLabelsTo=es,n.ChartSeriesMarkers=Wt,n.ChartSeriesNotes=qt,n.ChartSeriesNotesIcon=ss,n.ChartSeriesNotesLabel=ts,n.ChartSubtitle=Kt,n.ChartTitle=Pt,n.ChartTooltip=Rt,n.ChartValueAxis=_e,n.ChartValueAxisCrosshair=rs,n.ChartValueAxisCrosshairTooltip=as,n.ChartValueAxisItem=V,n.ChartValueAxisLabels=ns,n.ChartValueAxisNotes=is,n.ChartValueAxisNotesIcon=os,n.ChartValueAxisNotesLabel=ls,n.ChartValueAxisTitle=Me,n.ChartXAxis=De,n.ChartXAxisCrosshair=cs,n.ChartXAxisCrosshairTooltip=hs,n.ChartXAxisItem=j,n.ChartXAxisLabels=us,n.ChartXAxisNotes=ds,n.ChartXAxisNotesIcon=ps,n.ChartXAxisNotesLabel=ms,n.ChartXAxisTitle=He,n.ChartYAxis=we,n.ChartYAxisCrosshair=vs,n.ChartYAxisCrosshairTooltip=Cs,n.ChartYAxisItem=B,n.ChartYAxisLabels=gs,n.ChartYAxisNotes=fs,n.ChartYAxisNotesIcon=ys,n.ChartYAxisNotesLabel=bs,n.ChartYAxisTitle=Ve,n.ChartZoomable=Ft,n.CollectionConfigurationComponent=S,n.ConfigurationComponent=l,n.CrosshairTooltip=K,n.CrosshairTooltipContainer=P,n.DonutCenter=R,n.DragEndEvent=$,n.DragEvent=W,n.DragStartEvent=Z,n.DrilldownEvent=T,n.DrilldownStateChangeEvent=Se,n.LegendItemClickEvent=J,n.LegendItemHoverEvent=G,n.NavigatorFilterEvent=Q,n.NoteClickEvent=ee,n.NoteHoverEvent=te,n.PlotAreaClickEvent=se,n.PlotAreaHoverEvent=re,n.RenderEvent=ae,n.SelectEndEvent=ie,n.SelectEvent=ne,n.SelectStartEvent=oe,n.SeriesClickEvent=le,n.SeriesHoverEvent=ce,n.SeriesTooltip=L,n.SharedTooltipContent=ge,n.Sparkline=xt,n.StockChart=At,n.TooltipPoint=O,n.TooltipPopup=D,n.ZoomEndEvent=ue,n.ZoomEvent=he,n.ZoomStartEvent=de,n.exportVisual=_s,n.findAxisByName=xs,n.findPaneByIndex=Is,n.findPaneByName=As,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
48
+ `;let pt=class{constructor(e){this.store=e}setStyle(e,s){this.store.dispatch({type:"set",payload:{field:e,value:s}})}setColors(){this.mapColor("axisDefaults.crosshair.color","chart-crosshair-background"),this.mapColor("axisDefaults.labels.color","normal-text-color"),this.mapColor("axisDefaults.line.color","chart-major-lines"),this.mapColor("axisDefaults.majorGridLines.color","chart-major-lines"),this.mapColor("axisDefaults.minorGridLines.color","chart-minor-lines"),this.mapColor("axisDefaults.notes.icon.background","chart-notes-background"),this.mapColor("axisDefaults.notes.icon.border.color","chart-notes-border"),this.mapColor("axisDefaults.notes.line.color","chart-notes-lines"),this.mapColor("axisDefaults.title.color","normal-text-color"),this.mapColor("chartArea.background","background"),this.mapColor("legend.inactiveItems.labels.color","chart-inactive"),this.mapColor("legend.inactiveItems.markers.color","chart-inactive"),this.mapColor("legend.labels.color","normal-text-color"),this.mapColor("seriesDefaults.boxPlot.downColor","chart-major-lines"),this.mapColor("seriesDefaults.boxPlot.mean.color","base"),this.mapColor("seriesDefaults.boxPlot.median.color","base"),this.mapColor("seriesDefaults.boxPlot.whiskers.color","primary"),this.mapColor("seriesDefaults.bullet.target.color","normal-text-color"),this.mapColor("seriesDefaults.candlestick.downColor","normal-text-color"),this.mapColor("seriesDefaults.candlestick.line.color","normal-text-color"),this.mapColor("seriesDefaults.errorBars.color","chart-error-bars-background"),this.mapColor("seriesDefaults.horizontalWaterfall.line.color","chart-major-lines"),this.mapColor("seriesDefaults.icon.border.color","chart-major-lines"),this.mapColor("seriesDefaults.labels.background","background"),this.mapColor("seriesDefaults.labels.color","normal-text-color"),this.mapColor("seriesDefaults.notes.icon.background","chart-notes-background"),this.mapColor("seriesDefaults.notes.icon.border.color","chart-notes-border"),this.mapColor("seriesDefaults.notes.line.color","chart-notes-lines"),this.mapColor("seriesDefaults.verticalBoxPlot.downColor","chart-major-lines"),this.mapColor("seriesDefaults.verticalBoxPlot.mean.color","base"),this.mapColor("seriesDefaults.verticalBoxPlot.median.color","base"),this.mapColor("seriesDefaults.verticalBoxPlot.whiskers.color","primary"),this.mapColor("seriesDefaults.verticalBullet.target.color","normal-text-color"),this.mapColor("seriesDefaults.waterfall.line.color","chart-major-lines"),this.mapColor("title.color","normal-text-color"),this.mapColor("subtitle.color","normal-text-color");const e=parseFloat(this.queryStyle("chart-area-opacity").opacity);isNaN(e)||(this.setStyle("seriesDefaults.area.opacity",e),this.setStyle("seriesDefaults.radarArea.opacity",e),this.setStyle("seriesDefaults.verticalArea.opacity",e),this.setStyle("seriesDefaults.labels.opacity",e)),this.setInactiveOpacity(["area","verticalArea"],"chart-area-inactive-opacity"),this.setInactiveOpacity(["line","verticalLine"],"chart-line-inactive-opacity")}setFonts(){const e=A(this.queryStyle("chart-font")),s=A(this.queryStyle("chart-title-font")),r=A(this.queryStyle("chart-pane-title-font")),i=A(this.queryStyle("chart-label-font"));this.setStyle("axisDefaults.labels.font",i),this.setStyle("axisDefaults.notes.label.font",e),this.setStyle("axisDefaults.title.font",e),this.setStyle("legend.labels.font",e),this.setStyle("seriesDefaults.labels.font",i),this.setStyle("seriesDefaults.notes.label.font",e),this.setStyle("title.font",s),this.setStyle("subtitle.font",r),this.setStyle("paneDefaults.title.font",r)}setSeriesColors(){const e=this.element,s=[].slice.call(e.querySelectorAll(".k-var--series div")),r=Ce(e.querySelector(".k-var--series-unset")),i=s.reduce((o,h)=>{const u=ut(h.className),d=Ce(h);return d!==r&&(o[u]=d),o},[]);this.setStyle("seriesColors",i)}mapColor(e,s){this.setStyle(e,this.queryStyle(s).backgroundColor)}queryStyle(e){const s=this.element;return window.getComputedStyle(s.querySelector(`.k-var--${e}`))}setInactiveOpacity(e,s){const r=parseFloat(this.queryStyle(s).opacity);!isNaN(r)&&r<1&&e.forEach(i=>this.setStyle(`seriesDefaults.${i}.highlight.inactiveOpacity`,r))}};const vt=(t,e,s)=>{const r=new pt(t);if(typeof s=="undefined"){t.dispatch({type:"push",payload:f.chartBaseTheme()});return}const i=r.element=s.createElement("div");i.style.display="none",i.innerHTML=mt,s.body.appendChild(i);try{t.dispatch({type:"push",payload:f.chartBaseTheme()}),r.setColors(),r.setFonts(),r.setSeriesColors()}finally{s.body.removeChild(r.element),delete r.element,e()}},ft=1e3/60,k=t=>{let e,s,r=[];const i=()=>e,o=u=>{e=t(e,u),C.canUseDOM&&(window.clearTimeout(s),s=window.setTimeout(()=>r.forEach(d=>d()),ft))},h=u=>(r.push(u),()=>r=r.filter(d=>d!==u));return o({}),{getState:i,dispatch:o,subscribe:h}},ge=(t,e)=>e.chartCollectionIdxKey?L.collectionConfigurationItem(t,e):e.chartKey?L.configurationItem(t,e):{},Ct=(t,e)=>{if(e.type)switch(e.type){case"set":return L.themeItem(t,e);case"push":return Object.assign(t,e.payload);default:return t}else return{}},gt=(t,e)=>{if(e.type)switch(e.type){case"add":return[...t,e.payload];case"remove":return t.filter(s=>s!==e.payload);default:return t}else return[]},L={configurationItem(t,e){return Object.assign(t,{[e.chartKey]:e.payload})},collectionConfigurationItem(t,e){let s=!1;const[r,i]=e.chartCollectionIdxKey.split("_"),o=t[r].map((h,u)=>parseInt(i,10)===u?(s=!0,e.payload):h);return s===!1&&o.splice(parseInt(i,10),0,e.payload),Object.assign(t,{[r]:o})},themeItem(t,e){let s={},r=Object.assign(s,t);const{field:i,value:o}=e.payload,h=i.split(".");let u=h.shift();for(;h.length>0;)s=s[u]=s[u]||{},u=h.shift();return s[u]=o,r}};class O{constructor(e,s){this.value=e.value,this.category=e.category,this.categoryIndex=e.categoryIx,this.series=e.series,this.dataItem=e.dataItem,this.percentage=e.percentage,this.runningTotal=e.runningTotal,this.total=e.total,this.low=e.low,this.high=e.high,this.xLow=e.xLow,this.xHigh=e.xHigh,this.yLow=e.yLow,this.yHigh=e.yHigh,this.point=e,this.format=((e.options||{}).tooltip||{}).format||s}get formattedValue(){return this.format?this.point.formatValue(this.format):String(this.value)}}const yt="k-chart-shared-tooltip-marker",ye=t=>{const{categoryText:e,colorMarker:s,colspan:r,nameColumn:i,points:o}=t,h=(u,d)=>n.createElement("tr",{key:d},s&&n.createElement("td",null,n.createElement("span",{className:yt,style:{backgroundColor:u.series.color}})),i&&n.createElement("td",null,u.series.name),n.createElement("td",{dangerouslySetInnerHTML:{__html:u.formattedValue}}));return n.createElement("table",null,n.createElement("thead",null,n.createElement("tr",null,n.createElement("th",{colSpan:r},e))),n.createElement("tbody",null,o.map(h)))},b=n.createContext(null);b.displayName="ChartContext";const bt={horizontal:"fit",vertical:"fit"},St="k-chart-tooltip",Et="k-chart-tooltip-wrapper";class w extends n.Component{constructor(e,s){super(e,s),this.context=null,this.element=null,this.onChartMouseLeave=r=>{const{syntheticEvent:i}=r;return!!X(i.relatedTarget,this.element)},this.onMouseLeave=r=>{const i=fe(this,r);this.context.childrenObserver.trigger("onMouseLeave",i)&&r.preventDefault()},this.popupRef=r=>{this.element=r;const i=r&&r.closest(".k-animation-container");i&&(i.style.transition="initial")},this.chartObserver=new f.InstanceObserver(this,{onMouseLeave:"onChartMouseLeave"}),s.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupShown:e,popupAlign:s,popupOffset:r,popupStyles:i,popupContent:o,className:h}=this.props,u=[St,h].join(" ").trim();return n.createElement(Ge.Popup,{animate:!1,popupAlign:s,offset:r,show:e,collision:bt,className:Et},n.createElement("div",{className:u,style:i,onMouseLeave:this.onMouseLeave,ref:this.popupRef},o()))}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}}w.contextType=b;const xt="k-chart-shared-tooltip",It="k-chart-tooltip-inverse";class K extends n.Component{constructor(){super(...arguments),this.context=null,this.state={popupShown:!1},this.chartObserver=null}componentDidMount(){this.chartObserver=new f.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"}),this.context.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContext:e,shared:s,className:r,...i}=this.state,o=this.state.popupShown?()=>{const u=this.findRenderFunction();if(s)return u!==null?u(e):n.createElement(ye,{...e});{const d=e.point,m=this.findRenderFunctionByIndex(d.series.index);return m!==null?m(e):u!==null?u(e):n.createElement("span",{dangerouslySetInnerHTML:{__html:e.point.formattedValue}})}}:Function.prototype,h=C.classNames({[xt]:s,[It]:!!r});return n.createElement(w,{...i,popupContent:o,className:h})}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:s,style:r,shared:i,className:o,crosshair:h}=e;let u;h||(i?u=this.createSharedTooltipContext(e):u=this.createTooltipContext(e),this.setState({popupShown:!0,popupAlign:s.align,popupOffset:s.point,popupContext:u,popupStyles:r,className:o,shared:i}))}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}createSharedTooltipContext(e){const{points:s,categoryText:r}=e,i=s.filter(u=>typeof u.series.name!="undefined").length>0,o=e.series.length>1;let h=1;return i&&h++,o&&h++,{categoryText:r,colorMarker:o,colspan:h,nameColumn:i,points:e.points.map(u=>new O(u,e.format))}}createTooltipContext(e){const{point:s,format:r}=e;return{point:new O(s,r)}}findRenderFunctionByIndex(e){const s=this.context.optionsStore.getState().series;return s!==void 0&&Array.isArray(s)&&s[e]!==void 0&&s[e].hasOwnProperty("tooltip")&&s[e].tooltip.hasOwnProperty("render")?s[e].tooltip.render:null}findRenderFunction(){const e=this.context.optionsStore.getState().tooltip;return e!==void 0&&e.hasOwnProperty("render")?e.render:null}}K.contextType=b;const be=t=>t.children;be.displayName="Container";const At="k-chart-crosshair-tooltip",kt="k-chart-tooltip-inverse";class T extends n.Component{constructor(e,s){super(e,s),this.context=null,this.state={popupShown:!1},this.chartObserver=new f.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"}),s.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContend:e,className:s,...r}=this.state,i=this.state.popupShown?()=>e:Function.prototype,o=C.classNames({[At]:!0,[kt]:!!s});return n.createElement(w,{...r,popupContent:i,className:o})}componentWillUnmount(){var e;(e=this.context)==null||e.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:s,style:r,className:i,crosshair:o,axisName:h,axisIndex:u,value:d}=e,{name:m,index:v}=this.props;o&&h===m&&u===v&&this.setState({popupShown:!0,popupAlign:s.align,popupOffset:s.point,popupContend:d,popupStyles:r,className:i})}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}}T.contextType=b;const Se=["categoryAxis","valueAxis","xAxis","yAxis"];function wt(t){const e={};for(let s=0;s<Se.length;s++){const r=Dt(t,Se[s]);for(let i=0;i<r.length;i++){const o=r[i];e[o.name+o.index]=o}}return e}function Dt(t,e){const s=[];if(t[e]){const r=[].concat(t[e]);for(let i=0;i<r.length;i++){const o=(r[i].crosshair||{}).tooltip;o&&o.visible&&s.push({index:i,name:e})}}return s}class R extends n.Component{constructor(){super(...arguments),this.context=null,this.state={tooltips:{}},this.storeUnsubscriber=Function.prototype,this.subscriber=()=>{var e;this.setState({tooltips:wt((e=this.context)==null?void 0:e.optionsStore.getState())})}}componentDidMount(){this.storeUnsubscriber=this.context.optionsStore.subscribe(this.subscriber)}render(){const{tooltips:e}=this.state,s=Object.keys(e).map(r=>n.createElement(T,{...e[r],key:r}));return n.createElement(be,null,s)}componentWillUnmount(){this.storeUnsubscriber()}}R.contextType=b;const F={name:"@progress/kendo-react-charts",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};class x extends n.Component{constructor(e){super(e),this.chartInstance=null,this.surface=null,this._element=null,this.optionsStore={},this.optionsUnsubscriber=Function.prototype,this.themeStore={},this.themeUnsubscriber=Function.prototype,this.observersStore={},this.suppressTransitions=!1,this.showLicenseWatermark=!1,this.onRender=s=>{this.chartInstance!==null&&(this.surface=s.sender.surface,this.trigger("render",s))},this.onDrilldown=s=>{var h;const{series:r}=this.optionsStore.getState(),i=r.find(u=>u.name===s.series.name);if(!i.drilldownSeriesFactory)return!0;const o="onDrilldown";if(this.props.hasOwnProperty(o)){const u={seriesName:i.name,drilldownValue:s.value},d=[...((h=this.props.drilldownState)==null?void 0:h.steps)||[],u],m=this.props.getTarget(),v={...s,currentState:this.props.drilldownState,nextState:{steps:d}},p=new N(v,m);this.props[o].call(void 0,p)}return!0},this.onLegendItemClick=s=>{if(this.chartInstance!==null)if(this.props.onLegendItemClick)this.trigger("legendItemClick",s);else{const{series:r}=this.optionsStore.getState();if(!r)return;let i={};const{seriesIndex:o,pointIndex:h}=s,u=r[o];if(h===void 0)i=Object.assign({},u,{visible:Y(u.visible)});else{const d=u.pointVisibility=u.pointVisibility||[];d[h]=Y(d[h]),i=Object.assign({},u)}this.optionsStore.dispatch({chartCollectionIdxKey:`series_${o}`,payload:i}),this.suppressTransitions=!0}},this.onWindowResize=()=>{this.chartInstance!==null&&this.chartInstance.resize()},this.onChartMouseLeave=s=>{const r=fe(this,s);this.triggerDomEvent("onMouseLeave",r)?s.preventDefault():this.chartInstance!==null&&this.chartInstance.hideElements()},this.onChildMouseLeave=s=>{const{syntheticEvent:r}=s;return this.chartInstance&&!X(r.relatedTarget,this.element)&&this.chartInstance.hideElements(),!1},C.validatePackage(F),this.showLicenseWatermark=C.shouldShowValidationUI(F),this.optionsStore=k(ge),this.observersStore=k(gt),this.childrenObserver=new f.InstanceObserver(this,{onMouseLeave:"onChildMouseLeave"}),this.state={optionsStore:this.optionsStore,observersStore:this.observersStore,childrenObserver:this.childrenObserver,drilldownState:{steps:[]}},this.themeStore=k(Ct),this.chartObserver=new f.InstanceObserver(this,{render:"onRender",legendItemClick:"onLegendItemClick",drilldown:"onDrilldown"})}get element(){return this._element}static getDerivedStateFromProps(e,s){return{...s,drilldownState:e.drilldownState||[]}}componentDidMount(){var s;const e=((s=this._element)==null?void 0:s.ownerDocument)||document;vt(this.themeStore,this.instantiateCoreChart.bind(this),e),this.optionsUnsubscriber=this.optionsStore.subscribe(this.refresh.bind(this)),this.themeUnsubscriber=this.themeStore.subscribe(this.refresh.bind(this)),window.addEventListener("resize",this.onWindowResize)}componentWillUnmount(){this.optionsUnsubscriber(),this.themeUnsubscriber(),this.chartInstance!==null&&(this.chartInstance.destroy(),this.chartInstance=null),window.removeEventListener("resize",this.onWindowResize)}componentDidUpdate(e){const{dir:s,children:r,...i}=this.props;if(this.chartInstance!==null){const o=_.provideIntlService(this),h=this.chartInstance.chartService,u=o.locale!==h._intlService.locale,d=Object.entries(e).filter(m=>m[0]!=="dir"&&m[0]!=="children").some(m=>{const[v,p]=m;return!(i.hasOwnProperty(v)&&i[v]===p)});u&&(this.chartInstance.chartService._intlService=o,this.chartInstance.chartService.format._intlService=o,d||this.chartInstance.noTransitionsRedraw()),d&&this.refresh(),e.dir!==s&&this.chartInstance.setDirection(this.getDirection(s))}}render(){const{style:e={},className:s,wrapper:r,children:i}=this.props,o=Object.assign({},e,{position:"relative"}),h=n.createElement(r,{className:s,style:o,key:"chartElement"},n.createElement("div",{onMouseLeave:this.onChartMouseLeave,ref:u=>this._element=u,className:"k-chart-surface"},i),n.createElement(n.Fragment,null,this.showLicenseWatermark&&n.createElement(C.WatermarkOverlay,null)));return n.createElement(b.Provider,{value:this.state},n.createElement(K,{key:"seriesTooltip"}),n.createElement(R,{key:"crosshairTooltips"}),h)}getDirection(e){return(e!==void 0?e:(()=>C.canUseDOM&&window.getComputedStyle(this.element).direction)()||"ltr")==="rtl"}getChartOptions(){const{renderAs:e,pannable:s,zoomable:r,paneDefaults:i,panes:o,transitions:h,seriesColors:u,seriesDefaults:d,axisDefaults:m,deriveOptionsFromParent:v}=this.props;let p={};return e!==void 0&&(p.renderAs=e),s!==void 0&&(p.pannable=s),r!==void 0&&(p.zoomable=r),i!==void 0&&(p.paneDefaults=i),o!==void 0&&(p.panes=o),h!==void 0&&(p.transitions=h),u!==void 0&&(p.seriesColors=u),d!==void 0&&(p.seriesDefaults=d),m!==void 0&&(p.axisDefaults=m),p=Object.assign(p,this.optionsStore.getState()),v&&(p=v(p)),p}refresh(){if(this.chartInstance!==null){const e=this.themeStore.getState(),s=this.getChartOptions(),r=s.transitions;this.suppressTransitions&&(s.transitions=!1),this.props.onRefresh?this.props.onRefresh.call(void 0,s,e,this.chartInstance):this.chartInstance.setOptions(s,e),this.suppressTransitions&&(s.transitions=r,this.suppressTransitions=!1)}}instantiateCoreChart(){const{dir:e,chartConstructor:s}=this.props,r=this.getChartOptions();this.chartInstance=new s(this.element,r,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:_.provideIntlService(this),observer:this.chartObserver,sender:this})}trigger(e,s){const r=this.props.getTarget(),i=lt(e,s,r),o="on"+e.charAt(0).toUpperCase()+e.slice(1),h=this.observersStore.getState();let u=!1;for(let d=0;d<h.length;d++)h[d].trigger(e,s)&&(u=!0);return u===!1&&i&&this.props.hasOwnProperty(o)?(this.props[o].call(void 0,i),i.isDefaultPrevented&&i.isDefaultPrevented()):u}requiresHandlers(e){for(let s=0;s<e.length;s++){const r=e[s],i="on"+r.charAt(0).toUpperCase()+r.slice(1);if(this.props.hasOwnProperty(i))return!0}return!1}triggerDomEvent(e,s){const r=this.observersStore.getState();let i=!1;for(let o=0;o<r.length;o++)r[o].trigger(e,s)&&(i=!0);return i}}x.propTypes={dir:l.string,renderAs:l.oneOf(["svg","canvas"])},x.defaultProps={renderAs:"svg"},_.registerForIntl(x),f.DomEventsBuilder.register(it);class H extends n.Component{constructor(e,s){super(e,s),this.context=null,this.state={donutCenterStyles:null},this.chartObserver=new f.InstanceObserver(this,{render:"onRender"}),s.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{render:e}=this.props,{donutCenterStyles:s}=this.state;let r=null;return e&&s&&(r=n.createElement("div",{className:"k-chart-donut-center",style:s},n.createElement(e,null))),r}onRender(e){var v;const s=(v=this.context)==null?void 0:v.optionsStore.getState().series,r=Array.isArray(s)?s[0]:null,i=e.sender._plotArea.charts;if(!r||r.type!=="donut"||i[0].points.length===0)return;const o=i[0].points[0].sector,h=o.innerRadius,u=o.center.y-h,d=o.center.x-h,m=h*2;this.setState({donutCenterStyles:{height:m,left:d,top:u,width:m}})}}H.contextType=b;class _t extends n.Component{constructor(){super(...arguments),this._baseChart=null,this.getTarget=()=>this}get chartInstance(){return this._baseChart!==null?this._baseChart.chartInstance:null}get surface(){return this._baseChart!==null?this._baseChart.surface:null}get element(){return this._baseChart!==null?this._baseChart.element:null}render(){const{donutCenterRender:e,children:s,className:r,...i}=this.props;return n.createElement(x,{...i,ref:o=>this._baseChart=o,chartConstructor:f.Chart,getTarget:this.getTarget,wrapper:"div",className:C.classNames("k-chart k-widget",r)},s,n.createElement(H,{render:e}))}}class Nt extends n.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const{type:s,data:r}=this.props,i=Object.assign({},e,{type:s,data:r});return f.Sparkline.normalizeOptions(i)},this.getTarget=()=>this}get chartInstance(){return this._baseChart!==null?this._baseChart.chartInstance:null}get surface(){return this._baseChart!==null?this._baseChart.surface:null}get element(){return this._baseChart!==null?this._baseChart.element:null}render(){const{children:e,type:s,className:r,...i}=this.props;return n.createElement(x,{...i,ref:o=>this._baseChart=o,chartConstructor:f.Sparkline,getTarget:this.getTarget,wrapper:"span",deriveOptionsFromParent:this.deriveOptionsFromParent,className:C.classNames("k-sparkline k-widget",r)},e)}}const Lt={autoBindElements:!0,liveDrag:!1,partialRedraw:!0};class Ot extends n.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const s=Object.assign({},e.navigator||{},Lt);return Object.assign({},e,{navigator:s})},this.onRefresh=(e,s,r)=>{this.props.partialRedraw?(r.applyOptions(e),r.bindCategories(),r.navigator.redrawSlaves()):r.setOptions(e,s)},this.getTarget=()=>this}get chartInstance(){return this._baseChart!==null?this._baseChart.chartInstance:null}get surface(){return this._baseChart!==null?this._baseChart.surface:null}get element(){return this._baseChart!==null?this._baseChart.element:null}render(){const{children:e,className:s,...r}=this.props;return n.createElement(x,{...r,ref:i=>this._baseChart=i,chartConstructor:f.StockChart,getTarget:this.getTarget,wrapper:"div",deriveOptionsFromParent:this.deriveOptionsFromParent,onRefresh:this.onRefresh,className:C.classNames("k-stockchart k-widget",s)},e)}}class S extends n.Component{constructor(e,s){super(e,s),this.optionsStore=s.optionsStore}renderChildren(e,s){const{children:r}=e.props,{_chartKey:i,_parentStore:o}=this.props,h={...e.props,_chartCollectionIdxKey:`${i}_${s}`,_parentStore:o};return n.cloneElement(e,h,r)}render(){const{_chartKey:e,_parentStore:s,children:r}=this.props;return(s||this.optionsStore).dispatch({chartKey:e,payload:[]}),n.Children.map(r,(o,h)=>n.isValidElement(o)?this.renderChildren(o,h):o)}}S.contextType=b;class c extends n.Component{constructor(e,s){super(e,s),this.optionsStore=s.optionsStore,this.childStore=k(ge)}render(){const{children:e}=this.props;return e!==void 0?n.Children.map(e,s=>n.isValidElement(s)?this.renderChildren(s):s):null}componentDidMount(){this.dispatch()}componentDidUpdate(){this.dispatch()}dispatch(){const{_chartKey:e,_chartCollectionIdxKey:s,_parentStore:r,children:i,...o}=this.props;(r||this.optionsStore).dispatch({chartKey:e,chartCollectionIdxKey:s,payload:Object.assign({},o,this.childStore.getState())})}renderChildren(e){const{children:s}=e.props,r={...e.props,_parentStore:this.childStore};return n.cloneElement(e,r,s)}}c.contextType=b;class Ee{constructor(e){this.currentState=e.currentState,this.nextState=e.nextState}}const D=n.forwardRef((t,e)=>{const s=n.useRef(null),r=n.useRef(null);n.useImperativeHandle(s,()=>({element:r.current,props:t})),n.useImperativeHandle(e,()=>s.current);let o=[{id:"0",...t.rootItem||{text:"Home",icon:n.createElement(C.SvgIcon,{icon:Qe.homeIcon,style:{marginInlineEnd:"4px"}})}}];t.drilldownState&&(o=[...o,...t.drilldownState.steps.map((d,m)=>({id:(m+1).toString(),text:d.drilldownValue}))]);const h={...t,data:o},u=d=>{var v;const m="onDrilldownStateChange";if(t.hasOwnProperty(m)){const p=o.findIndex(Zs=>Zs.id===d.id),zs={steps:(((v=t.drilldownState)==null?void 0:v.steps)||[]).slice(0,p)},Ws=new Ee({currentState:t.drilldownState,nextState:zs});t[m].call(void 0,Ws)}};return n.createElement("div",null,n.createElement(Je.Breadcrumb,{...h,onItemSelect:u}))}),Kt={id:l.string,style:l.object,className:l.string,breadcrumbOrderedList:l.elementType,breadcrumbListItem:l.elementType,breadcrumbDelimiter:l.elementType,breadcrumbLink:l.elementType,dir:l.oneOf(["ltr","rtl"]),disabled:l.bool,valueField:l.string,textField:l.string,iconField:l.string,iconClassField:l.string,onItemSelect:l.func,ariaLabel:l.string,onDrilldownStateChange:l.func,drilldownState:l.shape({steps:l.array}),rootItem:l.object},Tt={valueField:"id",textField:"text",iconField:"icon",iconClassField:"iconClass",data:[]};D.displayName="KendoReactChartBreadcrumb",D.propTypes=Kt,D.defaultProps=Tt;const Rt=t=>n.createElement(c,{...t,_chartKey:"chartArea"}),Ft=t=>n.createElement(c,{...t,_chartKey:"axisDefaults"}),M=t=>n.createElement(c,{...t});M.displayName="ChartCategoryAxisItem";const xe=t=>n.createElement(S,{...t,_chartKey:"categoryAxis"});xe.propTypes={children:function(t,e,s){return E(t,e,s,M)}};const Ht=t=>n.createElement(c,{visible:!0,...t,_chartKey:"legend"}),Mt=t=>n.createElement(c,{visible:!0,position:"bottom",...t,_chartKey:"navigator"}),V=t=>n.createElement(c,{...t});V.displayName="ChartPane";const Ie=t=>n.createElement(c,{...t,_chartKey:"paneDefaults"});Ie.displayName="ChartPaneDefaults";const Ae=t=>n.createElement(S,{...t,_chartKey:"panes"});Ae.propTypes={children:function(t,e,s){return E(t,e,s,V)}};const Vt=t=>n.createElement(c,{...t,_chartKey:"plotArea"}),P=t=>{let e=r=>n.createElement(n.Fragment,null);t.drilldownSeriesFactory&&(e=t.drilldownSeriesFactory);const s=r=>{var i,o;return r&&((o=(i=r.drilldownState)==null?void 0:i.steps)==null?void 0:o.find(({seriesName:h})=>h===t.name))};return n.createElement(b.Consumer,null,r=>s(r)?n.createElement(e,{_chartCollectionIdxKey:t._chartCollectionIdxKey,drilldownValue:s(r).drilldownValue}):n.createElement(c,{...t}))};P.displayName="ChartSeriesItem";const ke=t=>n.createElement(S,{...t,_chartKey:"series"});ke.propTypes={children:function(t,e,s){return E(t,e,s,P)}};const Pt=t=>n.createElement(c,{...t,_chartKey:"seriesDefaults"}),jt=t=>n.createElement(c,{...t,_chartKey:"subtitle"}),qt=t=>n.createElement(c,{...t,_chartKey:"title"}),Bt=t=>n.createElement(c,{visible:!0,...t,_chartKey:"tooltip"}),j=t=>n.createElement(c,{...t});j.displayName="ChartValueAxisItem";const we=t=>n.createElement(S,{...t,_chartKey:"valueAxis"});we.propTypes={children:function(t,e,s){return E(t,e,s,j)}};const q=t=>n.createElement(c,{...t});q.displayName="ChartXAxisItem";const De=t=>n.createElement(S,{...t,_chartKey:"xAxis"});De.prototype={children:function(t,e,s){return E(t,e,s,q)}};const B=t=>n.createElement(c,{...t});B.displayName="ChartYAxisItem";const _e=t=>n.createElement(S,{...t,_chartKey:"yAxis"});_e.propTypes={children:function(t,e,s){return E(t,e,s,B)}};const $t=t=>n.createElement(c,{...t,_chartKey:"zoomable"}),Ne=t=>n.createElement(c,{...t,_chartKey:"title"});Ne.displayName="ChartAxisDefaultsTitle";const Le=t=>n.createElement(c,{...t,_chartKey:"labels"});Le.displayName="ChartAxisDefaultsLabels";const Oe=t=>n.createElement(c,{visible:!0,...t,_chartKey:"crosshair"});Oe.displayName="ChartAxisDefaultsCrosshair";const Ke=t=>n.createElement(c,{visible:!0,...t,_chartKey:"tooltip"});Ke.displayName="ChartAxisDefaultsCrosshairTooltip";const Ut=t=>n.createElement(c,{visible:!0,...t,_chartKey:"crosshair"}),Xt=t=>n.createElement(c,{visible:!0,...t,_chartKey:"tooltip"}),Te=t=>n.createElement(c,{...t,_chartKey:"title"});Te.displayName="ChartCategoryAxisTitle";const Yt=t=>n.createElement(c,{visible:!0,...t,_chartKey:"labels"}),zt=t=>n.createElement(c,{...t,_chartKey:"notes"}),Wt=t=>n.createElement(c,{...t,_chartKey:"icon"}),Zt=t=>n.createElement(c,{...t,_chartKey:"label"}),Gt=t=>n.createElement(c,{visible:!0,...t,_chartKey:"rangeLabels"}),Re=t=>n.createElement(c,{...t,_chartKey:"title"});Re.displayName="ChartPaneDefaultsTitle";const Fe=t=>n.createElement(c,{...t,_chartKey:"item"});Fe.displayName="ChartLegendItem";const He=t=>n.createElement(c,{...t,_chartKey:"title"});He.displayName="ChartLegendTitle";const Me=t=>n.createElement(c,{...t,_chartKey:"inactiveItems"});Me.displayName="ChartLegendInactiveItems";const Jt=t=>n.createElement(c,{...t,_chartKey:"tooltip"}),Qt=t=>n.createElement(c,{...t,_chartKey:"outliers"}),es=t=>n.createElement(c,{...t,_chartKey:"notes"}),ts=t=>n.createElement(c,{...t,_chartKey:"markers"}),ss=t=>n.createElement(c,{visible:!0,...t,_chartKey:"labels"}),rs=t=>n.createElement(c,{...t,_chartKey:"highlight"}),ns=t=>n.createElement(c,{...t,_chartKey:"extremes"}),as=t=>n.createElement(c,{...t,_chartKey:"errorBars"}),is=t=>n.createElement(c,{...t,_chartKey:"from"}),os=t=>n.createElement(c,{...t,_chartKey:"to"}),ls=t=>n.createElement(c,{...t,_chartKey:"label"}),cs=t=>n.createElement(c,{...t,_chartKey:"icon"}),hs=t=>n.createElement(c,{visible:!0,...t,_chartKey:"crosshair"}),us=t=>n.createElement(c,{visible:!0,...t,_chartKey:"tooltip"}),ds=t=>n.createElement(c,{visible:!0,...t,_chartKey:"labels"}),ms=t=>n.createElement(c,{...t,_chartKey:"notes"}),ps=t=>n.createElement(c,{...t,_chartKey:"icon"}),vs=t=>n.createElement(c,{...t,_chartKey:"label"}),Ve=t=>n.createElement(c,{...t,_chartKey:"title"});Ve.displayName="ChartValueAxisTitle";const fs=t=>n.createElement(c,{visible:!0,...t,_chartKey:"crosshair"}),Cs=t=>n.createElement(c,{visible:!0,...t,_chartKey:"tooltip"}),gs=t=>n.createElement(c,{visible:!0,...t,_chartKey:"labels"}),ys=t=>n.createElement(c,{...t,_chartKey:"notes"}),bs=t=>n.createElement(c,{...t,_chartKey:"icon"}),Ss=t=>n.createElement(c,{...t,_chartKey:"label"}),Pe=t=>n.createElement(c,{...t,_chartKey:"title"});Pe.displayName="ChartXAxisTitle";const Es=t=>n.createElement(c,{visible:!0,...t,_chartKey:"crosshair"}),xs=t=>n.createElement(c,{visible:!0,...t,_chartKey:"tooltip"}),Is=t=>n.createElement(c,{visible:!0,...t,_chartKey:"labels"}),As=t=>n.createElement(c,{...t,_chartKey:"notes"}),ks=t=>n.createElement(c,{...t,_chartKey:"icon"}),ws=t=>n.createElement(c,{...t,_chartKey:"label"}),je=t=>n.createElement(c,{...t,_chartKey:"title"});je.displayName="ChartYAxisTitle";const qe=t=>n.createElement(c,{...t,_chartKey:"categoryAxis"});qe.displayName="ChartNavigatorCategoryAxis";const Ds=t=>n.createElement(c,{...t,_chartKey:"hint"}),Be=t=>n.createElement(c,{...t,_chartKey:"pane"});Be.displayName="ChartNavigatorPane";const _s=t=>n.createElement(c,{...t,_chartKey:"select"}),$=t=>n.createElement(c,{...t});$.displayName="ChartNavigatorSeriesItem";const $e=t=>n.createElement(S,{...t,_chartKey:"series"});$e.propTypes={children:function(t,e,s){return E(t,e,s,$)}};const Ns=(t,e)=>{if(t&&t.chartInstance!==null)return t.chartInstance.findAxisByName(e)},Ls=(t,e)=>{if(t&&t.chartInstance!==null)return t.chartInstance.findPaneByIndex(e)},Os=(t,e)=>{if(t&&t.chartInstance!==null)return t.chartInstance.findPaneByName(e)},Ks=(t,e={})=>{if(t&&t.chartInstance!==null)return t.chartInstance.exportVisual(e)},Ts=t=>`${t.fontWeight} ${t.fontSize} ${t.fontFamily}`,Ue=t=>window.getComputedStyle(t).backgroundColor,Rs=t=>t.toLowerCase().charCodeAt(0)-"a".charCodeAt(0),Fs=t=>{const e=t.match(/series-([a-z])$/);if(e!==null)return Rs(e[1]);const s=t.split("--series-")[1];return parseInt(s,10)-1},Hs=30,Ms=`
49
+ <div class="k-var--normal-text-color"></div>
50
+ <div class="k-widget k-chart">
51
+ <div class="k-var--chart-font"></div>
52
+ </div>
53
+ <div class="k-var--series-unset"></div>
54
+ <div class="k-var--series">
55
+ ${(()=>{let t=`
56
+ <div class="k-var--series-a"></div>
57
+ <div class="k-var--series-b"></div>
58
+ <div class="k-var--series-c"></div>
59
+ <div class="k-var--series-d"></div>
60
+ <div class="k-var--series-e"></div>
61
+ <div class="k-var--series-f"></div>
62
+ `;for(let e=0;e<Hs;e++)t+=`
63
+ <div class="k-var--series-${e+1}"></div>`;return t})()}
64
+ </div>
65
+ `;class Vs{constructor(e){this.store=e}setStyle(e,s){const r=e.split(".");let i=this.store;r.forEach((h,u,d)=>{u<d.length-1&&(i=i[h]=i[h]||{})});const o=r.pop();o&&(i[o]=s)}setColors(){this.mapColor("labels.color","normal-text-color")}setFonts(){const e=Ts(this.queryStyle("chart-font"));this.setStyle("labels.font",e)}setSeriesColors(){const e=this.element;if(!e)return;const s=[].slice.call(e.querySelectorAll(".k-var--series div")),r=Ue(e.querySelector(".k-var--series-unset")),i=s.reduce((o,h)=>{const u=Fs(h.className),d=Ue(h);return d!==r&&(o[u]=d),o},[]);this.setStyle("nodesColors",i)}mapColor(e,s){this.setStyle(e,this.queryStyle(s).backgroundColor)}queryStyle(e){const s=this.element;return window.getComputedStyle(s.querySelector(`.k-var--${e}`))}}const Ps=(t,e)=>{const s={links:{color:"#757575"},nodesColors:[]},r=new Vs(s),i=r.element=t.createElement("div");i.style.display="none",i.innerHTML=Ms,t.body.appendChild(i);try{r.setColors(),r.setFonts(),r.setSeriesColors()}finally{t.body.removeChild(r.element),r.element=null,e(s)}},Xe=l.exact({left:l.number,top:l.number}),Ye={left:l.number,right:l.number},js={...Ye,top:l.number,bottom:l.number},ze={visible:l.bool,font:l.string,color:l.string,opacity:l.number,align:l.oneOf(["left","right","center"]),position:l.oneOf(["inside","before","after"]),padding:l.oneOfType([l.number,l.exact(js)]),margin:l.exact(Ye),border:l.exact({width:l.number,color:l.string,opacity:l.number,dashType:l.string}),offset:Xe},We={color:l.string,opacity:l.number,offset:Xe,padding:l.number,width:l.number},Ze={colorType:l.oneOf(["static","source","target"]),color:l.string,opacity:l.number,highlight:l.exact({opacity:l.number,inactiveOpacity:l.number})},qs=l.exact({text:l.string,...ze}),Bs=l.exact({id:l.oneOfType([l.string,l.number]).isRequired,label:qs.isRequired,...We}),$s=l.exact({sourceId:l.oneOfType([l.string,l.number]).isRequired,targetId:l.oneOfType([l.string,l.number]).isRequired,value:l.number.isRequired,...Ze}),Us={data:l.exact({nodes:l.arrayOf(Bs.isRequired).isRequired,links:l.arrayOf($s.isRequired).isRequired}).isRequired,links:l.exact(Ze),nodes:l.exact(We),labels:l.exact(ze),className:l.string,style:l.object,onNodeEnter:l.func,onNodeLeave:l.func,onLinkEnter:l.func,onLinkLeave:l.func},Xs=["nodeEnter","nodeLeave","linkEnter","linkLeave"],Ys=(t,e)=>{t&&(t.unbind(),Xs.forEach(s=>{e[s]&&t.bind(s,e[s])}))},U=n.forwardRef((t,e)=>{C.validatePackage(F);const s=n.useRef(null),r=n.useRef(null),i=n.useRef(null),{data:o,links:h,nodes:u,labels:d}=t;n.useEffect(()=>(r.current?r.current.setOptions({data:o,links:h,nodes:u,labels:d}):C.canUseDOM&&s.current&&Ps(s.current.ownerDocument,v=>{r.current=new f.Sankey(s.current,{data:o,links:h,nodes:u,labels:d},v)}),()=>{r.current&&(r.current.destroy(),r.current=null)}),[o,h,u,d]),n.useImperativeHandle(i,()=>({get element(){return s.current},props:t}),[]),n.useImperativeHandle(e,()=>i.current);const m=n.useCallback(v=>v&&(p=>{Object.defineProperty(p,"target",{get:()=>i.current}),p.nativeEvent=p.originalEvent||null,v.call(void 0,p)}),[]);return n.useEffect(()=>{Ys(r.current,{nodeEnter:m(t.onNodeEnter),nodeLeave:m(t.onNodeLeave),linkEnter:m(t.onLinkEnter),linkLeave:m(t.onLinkLeave)})},[t.onNodeEnter,t.onNodeLeave,t.onLinkEnter,t.onLinkLeave]),n.createElement("div",{ref:s,className:t.className,style:t.style})});U.propTypes=Us,U.displayName="KendoReactSankey",a.AxisLabelClickEvent=W,a.Chart=_t,a.ChartArea=Rt,a.ChartAxisDefaults=Ft,a.ChartAxisDefaultsCrosshair=Oe,a.ChartAxisDefaultsCrosshairTooltip=Ke,a.ChartAxisDefaultsLabels=Le,a.ChartAxisDefaultsTitle=Ne,a.ChartBreadcrumb=D,a.ChartCategoryAxis=xe,a.ChartCategoryAxisCrosshair=Ut,a.ChartCategoryAxisCrosshairTooltip=Xt,a.ChartCategoryAxisItem=M,a.ChartCategoryAxisLabels=Yt,a.ChartCategoryAxisNotes=zt,a.ChartCategoryAxisNotesIcon=Wt,a.ChartCategoryAxisNotesLabel=Zt,a.ChartCategoryAxisRangeLabels=Gt,a.ChartCategoryAxisTitle=Te,a.ChartLegend=Ht,a.ChartLegendInactiveItems=Me,a.ChartLegendItem=Fe,a.ChartLegendTitle=He,a.ChartNavigator=Mt,a.ChartNavigatorCategoryAxis=qe,a.ChartNavigatorHint=Ds,a.ChartNavigatorPane=Be,a.ChartNavigatorSelect=_s,a.ChartNavigatorSeries=$e,a.ChartNavigatorSeriesItem=$,a.ChartPane=V,a.ChartPaneDefaults=Ie,a.ChartPaneDefaultsTitle=Re,a.ChartPanes=Ae,a.ChartPlotArea=Vt,a.ChartSeries=ke,a.ChartSeriesDefaults=Pt,a.ChartSeriesErrorBars=as,a.ChartSeriesExtremes=ns,a.ChartSeriesHighlight=rs,a.ChartSeriesItem=P,a.ChartSeriesItemOutliers=Qt,a.ChartSeriesItemTooltip=Jt,a.ChartSeriesLabels=ss,a.ChartSeriesLabelsFrom=is,a.ChartSeriesLabelsTo=os,a.ChartSeriesMarkers=ts,a.ChartSeriesNotes=es,a.ChartSeriesNotesIcon=cs,a.ChartSeriesNotesLabel=ls,a.ChartSubtitle=jt,a.ChartTitle=qt,a.ChartTooltip=Bt,a.ChartValueAxis=we,a.ChartValueAxisCrosshair=hs,a.ChartValueAxisCrosshairTooltip=us,a.ChartValueAxisItem=j,a.ChartValueAxisLabels=ds,a.ChartValueAxisNotes=ms,a.ChartValueAxisNotesIcon=ps,a.ChartValueAxisNotesLabel=vs,a.ChartValueAxisTitle=Ve,a.ChartXAxis=De,a.ChartXAxisCrosshair=fs,a.ChartXAxisCrosshairTooltip=Cs,a.ChartXAxisItem=q,a.ChartXAxisLabels=gs,a.ChartXAxisNotes=ys,a.ChartXAxisNotesIcon=bs,a.ChartXAxisNotesLabel=Ss,a.ChartXAxisTitle=Pe,a.ChartYAxis=_e,a.ChartYAxisCrosshair=Es,a.ChartYAxisCrosshairTooltip=xs,a.ChartYAxisItem=B,a.ChartYAxisLabels=Is,a.ChartYAxisNotes=As,a.ChartYAxisNotesIcon=ks,a.ChartYAxisNotesLabel=ws,a.ChartYAxisTitle=je,a.ChartZoomable=$t,a.CollectionConfigurationComponent=S,a.ConfigurationComponent=c,a.CrosshairTooltip=T,a.CrosshairTooltipContainer=R,a.DonutCenter=H,a.DragEndEvent=G,a.DragEvent=Z,a.DragStartEvent=J,a.DrilldownEvent=N,a.DrilldownStateChangeEvent=Ee,a.LegendItemClickEvent=ee,a.LegendItemHoverEvent=Q,a.NavigatorFilterEvent=te,a.NoteClickEvent=se,a.NoteHoverEvent=re,a.PlotAreaClickEvent=ne,a.PlotAreaHoverEvent=ae,a.RenderEvent=ie,a.Sankey=U,a.SelectEndEvent=le,a.SelectEvent=oe,a.SelectStartEvent=ce,a.SeriesClickEvent=he,a.SeriesHoverEvent=ue,a.SeriesTooltip=K,a.SharedTooltipContent=ye,a.Sparkline=Nt,a.StockChart=Ot,a.TooltipPoint=O,a.TooltipPopup=w,a.ZoomEndEvent=me,a.ZoomEvent=de,a.ZoomStartEvent=pe,a.exportVisual=Ks,a.findAxisByName=Ns,a.findPaneByIndex=Ls,a.findPaneByName=Os,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})});
@@ -5,6 +5,46 @@
5
5
  /**
6
6
  * The series type.
7
7
  *
8
+ * The supported values are:
9
+ * - `"area"`&mdash;Displays the data as continuous lines that show trends over time, evenly distributed along the category field.
10
+ * - `"bar"`&mdash;Displays the data as sets of horizontal bars that show the relationship between individual items and the whole category.
11
+ * - `"boxPlot"`&mdash;Displays the data as a box-and-whisker diagram, which shows the distribution of values in a series.
12
+ * - `"bubble"`&mdash;Displays the data as bubbles, where each bubble represents a value from the series data.
13
+ * - `"bullet"`&mdash;Displays the data as vertical bars that show the performance measure, and markers that show the comparative measure.
14
+ * - `"candlestick"`&mdash;Displays the data as candlesticks, which show the open, close, high, and low values of a series.
15
+ * - `"column"`&mdash;Displays the data as sets of vertical bars that show the relationship between individual items and the whole category.
16
+ * - `"donut"`&mdash;Displays the data as a series of rings that are sliced depending on the value.
17
+ * - `"exponentialTrendline"`&mdash;Displays an exponential [trendline]({% slug trendlines_chart_charts %}#toc-exponential-trendline) for the specified parent series.
18
+ * - `"funnel"`&mdash;Displays the data as a funnel, which is useful for sales data visualization.
19
+ * - `"heatmap"`&mdash;Displays the data as a heatmap, which is useful for comparing values in a matrix.
20
+ * - `"horizontalWaterfall"`&mdash;Displays the data as a horizontal waterfall chart, which is useful for comparing positive and negative values over a period.
21
+ * - `"line"`&mdash;Displays the data as continuous lines that connect data points evenly distributed along the category field.
22
+ * - `"linearTrendline"`&mdash;Displays a linear [trendline]({% slug trendlines_chart_charts %}#toc-linear-trendline) for the specified parent series.
23
+ * - `"logarithmicTrendline"`&mdash;Displays a logarithmic [trendline]({% slug trendlines_chart_charts %}#toc-logarithmic-trendline) for the specified parent series.
24
+ * - `"movingAverageTrendline"`&mdash;Displays a moving average [trendline]({% slug trendlines_chart_charts %}#toc-moving-average-trendline) for the specified parent series.
25
+ * - `"ohlc"`&mdash;Displays the data as OHLC (open-high-low-close) bars, which show the open, high, low, and close values of a series.
26
+ * - `"pie"`&mdash;Displays the data as a series of pie slices, which show the contribution of each value to a total.
27
+ * - `"polarArea"`&mdash;Displays the data as a series of polar area segments, which show the contribution of each value to a total.
28
+ * - `"polarLine"`&mdash;Displays the data as continuous lines that connect data points evenly distributed along the category field.
29
+ * - `"polarScatter"`&mdash;Displays the data as points distributed in a polar coordinate system.
30
+ * - `"polynomialTrendline"`&mdash;Displays a polynomial [trendline]({% slug trendlines_chart_charts %}#toc-polynomial-trendline) for the specified parent series.
31
+ * - `"powerTrendline"`&mdash;Displays a power [trendline]({% slug trendlines_chart_charts %}#toc-power-trendline) for the specified parent series.
32
+ * - `"pyramid"`&mdash;Displays the data as a pyramid divided in segments proportional to each value.
33
+ * - `"radarArea"`&mdash;Displays the data as a series of radar area segments, which show the contribution of each value to a total.
34
+ * - `"radarColumn"`&mdash;Displays the data as sets of vertical bars that show the relationship between individual items and the whole category.
35
+ * - `"radarLine"`&mdash;Displays the data as continuous lines that connect data points evenly distributed along the category field.
36
+ * - `"rangeArea"`&mdash;Displays the data as a series of range area segments, which show the contribution of each value to a total.
37
+ * - `"rangeBar"`&mdash;Displays the data as sets of horizontal bars that show the relationship between individual items and the whole category.
38
+ * - `"rangeColumn"`&mdash;Displays the data as sets of vertical bars that show the relationship between individual items and the whole category.
39
+ * - `"scatter"`&mdash;Displays the data as points that show the relationship between two variables.
40
+ * - `"scatterLine"`&mdash;Displays the data as continuous lines that connect data points evenly distributed along the category field.
41
+ * - `"verticalArea"`&mdash;Displays the data as continuous lines that show trends over time, evenly distributed along the category field.
42
+ * - `"verticalBoxPlot"`&mdash;Displays the data as a box-and-whisker diagram, which shows the distribution of values in a series.
43
+ * - `"verticalBullet"`&mdash;Displays the data as vertical bars that show the performance measure, and markers that show the comparative measure.
44
+ * - `"verticalLine"`&mdash;Displays the data as continuous lines that connect data points evenly distributed along the category field.
45
+ * - `"verticalRangeArea"`&mdash;Displays the data as a series of range area segments, which show the contribution of each value to a total.
46
+ * - `"waterfall"`&mdash;Displays the data as a waterfall chart, which is useful for comparing positive and negative values over a period.
47
+ *
8
48
  * @example
9
49
  * ```jsx
10
50
  * import {
@@ -30,4 +70,4 @@
30
70
  * );
31
71
  * ```
32
72
  */
33
- export type SeriesType = 'area' | 'bar' | 'boxPlot' | 'bubble' | 'bullet' | 'candlestick' | 'column' | 'donut' | 'funnel' | 'pyramid' | 'heatmap' | 'horizontalWaterfall' | 'line' | 'linearTrendline' | 'movingAverageTrendline' | 'ohlc' | 'pie' | 'polarArea' | 'polarLine' | 'polarScatter' | 'radarArea' | 'radarColumn' | 'radarLine' | 'rangeArea' | 'rangeBar' | 'rangeColumn' | 'scatter' | 'scatterLine' | 'verticalArea' | 'verticalBoxPlot' | 'verticalBullet' | 'verticalLine' | 'verticalRangeArea' | 'waterfall';
73
+ export type SeriesType = 'area' | 'bar' | 'boxPlot' | 'bubble' | 'bullet' | 'candlestick' | 'column' | 'donut' | 'exponentialTrendline' | 'funnel' | 'pyramid' | 'heatmap' | 'horizontalWaterfall' | 'line' | 'linearTrendline' | 'logarithmicTrendline' | 'movingAverageTrendline' | 'ohlc' | 'pie' | 'polarArea' | 'polarLine' | 'polarScatter' | 'polynomialTrendline' | 'powerTrendline' | 'radarArea' | 'radarColumn' | 'radarLine' | 'rangeArea' | 'rangeBar' | 'rangeColumn' | 'scatter' | 'scatterLine' | 'verticalArea' | 'verticalBoxPlot' | 'verticalBullet' | 'verticalLine' | 'verticalRangeArea' | 'waterfall';
package/index.d.ts CHANGED
@@ -30,4 +30,5 @@ export * from './common/property-types';
30
30
  export * from './common/events';
31
31
  export * from './common/charts';
32
32
  export * from './methods/';
33
+ export * from './sankey';
33
34
  export { Chart, ChartProps, Sparkline, SparklineProps, StockChart, StockChartProps, CategoryBaseUnit, BaseUnit, AxisLabelVisualArgs, LineStyle, ValueAxisTitle, SeriesLabels, CollectionConfigurationComponent, ConfigurationComponent, DonutCenter, TooltipPoint, SeriesTooltip, CrosshairTooltip, CrosshairTooltipProps, TooltipPopup, TooltipPopupProps, SharedTooltipContent, CrosshairTooltipContainer, ChartBreadcrumb, ChartBreadcrumbProps };