@progress/kendo-react-charts 12.3.0-develop.5 → 12.3.0-develop.6

package/BaseChart.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react"),I=require("prop-types"),w=require("@progress/kendo-react-intl"),u=require("@progress/kendo-charts"),v=require("@progress/kendo-react-common"),m=require("./utils/index.js"),y=require("./events/chart-event-builder.js"),D=require("./events/dom-event.js"),S=require("./store/store.js"),b=require("./store/reducer.js"),E=require("./tooltip/Series.js"),k=require("./tooltip/CrosshairContainer.js"),P=require("./ChartContext.js"),O=require("./package-metadata.js"),T=require("./events/drilldown-event.js");function M(p){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(p){for(const e in p)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(p,e);Object.defineProperty(t,e,s.get?s:{enumerable:!0,get:()=>p[e]})}}return t.default=p,Object.freeze(t)}const l=M(C),g=class g extends l.Component{constructor(t){super(t),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=e=>{this.chartInstance!==null&&(this.surface=e.sender.surface,this.trigger("render",e))},this.onDrilldown=e=>{var i;const{series:s}=this.optionsStore.getState(),r=s.find(n=>n.name===e.series.name);if(r.drilldownSeriesFactory){const n="onDrilldown";if(this.props.hasOwnProperty(n)){const o={seriesName:r.name,drilldownValue:e.value},c=[...((i=this.props.drilldownState)==null?void 0:i.steps)||[],o],h=this.props.getTarget(),d={...e,currentState:this.props.drilldownState,nextState:{steps:c}},a=new T.DrilldownEvent(d,h);this.props[n].call(void 0,a)}}return!0},this.onLegendItemClick=e=>{if(this.chartInstance!==null)if(this.props.onLegendItemClick)this.trigger("legendItemClick",e);else{const{series:s}=this.optionsStore.getState();if(!s)return;let r={};const{seriesIndex:i,pointIndex:n}=e,o=s[i];if(n===void 0)r=Object.assign({},o,{visible:m.toggle(o.visible)});else{const c=o.pointVisibility=o.pointVisibility||[];c[n]=m.toggle(c[n]),r=Object.assign({},o)}this.optionsStore.dispatch({chartCollectionIdxKey:`series_${i}`,payload:r}),this.suppressTransitions=!0}},this.onWindowResize=()=>{this.chartInstance!==null&&this.chartInstance.resize()},this.onChartMouseLeave=e=>{const s=D.toDomEvent(this,e);this.triggerDomEvent("onMouseLeave",s)?e.preventDefault():this.chartInstance!==null&&this.chartInstance.hideElements()},this.onChildMouseLeave=e=>{const{syntheticEvent:s}=e;return this.chartInstance&&!m.hasParent(s.relatedTarget,this.element)&&this.chartInstance.hideElements(),!1},this.showLicenseWatermark=!v.validatePackage(O.packageMetadata,{component:"Chart"}),this.licenseMessage=v.getLicenseMessage(O.packageMetadata),this.optionsStore=S.createStore(b.optionsReducer),this.observersStore=S.createStore(b.observersReducer),this.childrenObserver=new u.InstanceObserver(this,{onMouseLeave:"onChildMouseLeave"}),this.state={optionsStore:this.optionsStore,observersStore:this.observersStore,childrenObserver:this.childrenObserver,drilldownState:{steps:[]}},this.themeStore=S.createStore(b.themeReducer),this.chartObserver=new u.InstanceObserver(this,{render:"onRender",legendItemClick:"onLegendItemClick",drilldown:"onDrilldown"})}get element(){return this._element}static getDerivedStateFromProps(t,e){return{...e,drilldownState:t.drilldownState||[]}}componentDidMount(){if(this._element){let t={};try{t=u.chartTheme(this._element)}catch{}const e=u.deepExtend(u.chartBaseTheme(),t);this.themeStore.dispatch({type:"push",payload:e}),this.instantiateCoreChart()}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(t){const{dir:e,children:s,...r}=this.props;if(this.chartInstance!==null){const i=w.provideIntlService(this),n=this.chartInstance.chartService,o=i.locale!==n._intlService.locale,c=Object.entries(t).filter(h=>h[0]!=="dir"&&h[0]!=="children").some(h=>{const[d,a]=h;return!(r.hasOwnProperty(d)&&r[d]===a)});o&&(this.chartInstance.chartService._intlService=i,this.chartInstance.chartService.format._intlService=i,c||this.chartInstance.noTransitionsRedraw()),c&&this.refresh(),t.dir!==e&&this.chartInstance.setDirection(this.getDirection(e))}}render(){const{style:t={},className:e,wrapper:s,children:r}=this.props,i=Object.assign({},t,{position:"relative"}),n=l.createElement(s,{className:e,style:i,key:"chartElement"},l.createElement("div",{onMouseLeave:this.onChartMouseLeave,ref:o=>{this._element=o},className:"k-chart-surface"},r),l.createElement(l.Fragment,null,this.showLicenseWatermark&&l.createElement(v.WatermarkOverlay,{message:this.licenseMessage})));return l.createElement(P.ChartContext.Provider,{value:this.state},l.createElement(E.SeriesTooltip,{key:"seriesTooltip"}),l.createElement(k.CrosshairTooltipContainer,{key:"crosshairTooltips"}),n)}getDirection(t){return(t!==void 0?t:v.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")==="rtl"}getChartOptions(){const{renderAs:t,pannable:e,zoomable:s,paneDefaults:r,panes:i,transitions:n,seriesColors:o,seriesDefaults:c,axisDefaults:h,deriveOptionsFromParent:d}=this.props;let a={};return t!==void 0&&(a.renderAs=t),e!==void 0&&(a.pannable=e),s!==void 0&&(a.zoomable=s),r!==void 0&&(a.paneDefaults=r),i!==void 0&&(a.panes=i),n!==void 0&&(a.transitions=n),o!==void 0&&(a.seriesColors=o),c!==void 0&&(a.seriesDefaults=c),h!==void 0&&(a.axisDefaults=h),a=Object.assign(a,this.optionsStore.getState()),d&&(a=d(a)),a}refresh(){if(this.chartInstance!==null){const t=this.themeStore.getState(),e=this.getChartOptions(),s=e.transitions;this.suppressTransitions&&(e.transitions=!1),this.props.onRefresh?this.props.onRefresh.call(void 0,e,t,this.chartInstance):this.chartInstance.setOptions(e,t),this.suppressTransitions&&(e.transitions=s,this.suppressTransitions=!1)}}instantiateCoreChart(){const{dir:t,chartConstructor:e}=this.props,s=this.getChartOptions();this.chartInstance=new e(this.element,s,this.themeStore.getState(),{rtl:this.getDirection(t),intlService:w.provideIntlService(this),observer:this.chartObserver,sender:this})}trigger(t,e){const s=this.props.getTarget(),r=y.create(t,e,s),i="on"+t.charAt(0).toUpperCase()+t.slice(1),n=this.observersStore.getState();let o=!1;for(let c=0;c<n.length;c++)n[c].trigger(t,e)&&(o=!0);return o===!1&&r&&this.props.hasOwnProperty(i)?(this.props[i].call(void 0,r),r.isDefaultPrevented&&r.isDefaultPrevented()):o}requiresHandlers(t){for(let e=0;e<t.length;e++){const s=t[e],r="on"+s.charAt(0).toUpperCase()+s.slice(1);if(this.props.hasOwnProperty(r))return!0}return!1}triggerDomEvent(t,e){const s=this.observersStore.getState();let r=!1;for(let i=0;i<s.length;i++)s[i].trigger(t,e)&&(r=!0);return r}};g.propTypes={dir:I.string,renderAs:I.oneOf(["svg","canvas"])},g.defaultProps={renderAs:"svg"};let f=g;w.registerForIntl(f);exports.BaseChart=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),I=require("prop-types"),C=require("@progress/kendo-react-intl"),v=require("@progress/kendo-charts"),f=require("@progress/kendo-react-common"),S=require("./utils/index.js"),D=require("./events/chart-event-builder.js"),T=require("./events/dom-event.js"),b=require("./store/store.js"),w=require("./store/reducer.js"),E=require("./tooltip/Series.js"),k=require("./tooltip/CrosshairContainer.js"),P=require("./ChartContext.js"),y=require("./package-metadata.js"),M=require("./events/drilldown-event.js");function q(u){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const e in u)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(u,e);Object.defineProperty(t,e,s.get?s:{enumerable:!0,get:()=>u[e]})}}return t.default=u,Object.freeze(t)}const l=q(O),g=class g extends l.Component{constructor(t){super(t),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=e=>{this.chartInstance!==null&&(this.surface=e.sender.surface,this.trigger("render",e))},this.onDrilldown=e=>{var i;const{series:s}=this.optionsStore.getState(),r=s.find(n=>n.name===e.series.name);if(r.drilldownSeriesFactory){const n="onDrilldown";if(this.props.hasOwnProperty(n)){const o={seriesName:r.name,drilldownValue:e.value},c=[...((i=this.props.drilldownState)==null?void 0:i.steps)||[],o],h=this.props.getTarget(),d={...e,currentState:this.props.drilldownState,nextState:{steps:c}},p=new M.DrilldownEvent(d,h);this.props[n].call(void 0,p)}}return!0},this.onLegendItemClick=e=>{if(this.chartInstance!==null)if(this.props.onLegendItemClick)this.trigger("legendItemClick",e);else{const{series:s}=this.optionsStore.getState();if(!s)return;let r={};const{seriesIndex:i,pointIndex:n}=e,o=s[i];if(n===void 0)r=Object.assign({},o,{visible:S.toggle(o.visible)});else{const c=o.pointVisibility=o.pointVisibility||[];c[n]=S.toggle(c[n]),r=Object.assign({},o)}this.optionsStore.dispatch({chartCollectionIdxKey:`series_${i}`,payload:r}),this.suppressTransitions=!0}},this.onWindowResize=()=>{this.chartInstance!==null&&this.chartInstance.resize()},this.onChartMouseLeave=e=>{const s=T.toDomEvent(this,e);this.triggerDomEvent("onMouseLeave",s)?e.preventDefault():this.chartInstance!==null&&this.chartInstance.hideElements()},this.onChildMouseLeave=e=>{const{syntheticEvent:s}=e;return this.chartInstance&&!S.hasParent(s.relatedTarget,this.element)&&this.chartInstance.hideElements(),!1},this.showLicenseWatermark=!f.validatePackage(y.packageMetadata,{component:"Chart"}),this.licenseMessage=f.getLicenseMessage(y.packageMetadata),this.optionsStore=b.createStore(w.optionsReducer),this.observersStore=b.createStore(w.observersReducer),this.childrenObserver=new v.InstanceObserver(this,{onMouseLeave:"onChildMouseLeave"}),this.state={optionsStore:this.optionsStore,observersStore:this.observersStore,childrenObserver:this.childrenObserver,drilldownState:{steps:[]}},this.themeStore=b.createStore(w.themeReducer),this.chartObserver=new v.InstanceObserver(this,{render:"onRender",legendItemClick:"onLegendItemClick",drilldown:"onDrilldown",styleChanged:"onStyleChanged"})}get element(){return this._element}static getDerivedStateFromProps(t,e){return{...e,drilldownState:t.drilldownState||[]}}componentDidMount(){this._element&&(this.readTheme(),this.instantiateCoreChart()),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(t){const{dir:e,children:s,...r}=this.props;if(this.chartInstance!==null){const i=C.provideIntlService(this),n=this.chartInstance.chartService,o=i.locale!==n._intlService.locale,c=Object.entries(t).filter(h=>h[0]!=="dir"&&h[0]!=="children").some(h=>{const[d,p]=h;return!(r.hasOwnProperty(d)&&r[d]===p)});o&&(this.chartInstance.chartService._intlService=i,this.chartInstance.chartService.format._intlService=i,c||this.chartInstance.noTransitionsRedraw()),c&&this.refresh(),t.dir!==e&&this.chartInstance.setDirection(this.getDirection(e))}}render(){const{style:t={},className:e,wrapper:s,children:r}=this.props,i=Object.assign({},t,{position:"relative"}),n=l.createElement(s,{className:e,style:i,key:"chartElement"},l.createElement("div",{onMouseLeave:this.onChartMouseLeave,ref:o=>{this._element=o},className:"k-chart-surface"},r),l.createElement(l.Fragment,null,this.showLicenseWatermark&&l.createElement(f.WatermarkOverlay,{message:this.licenseMessage})));return l.createElement(P.ChartContext.Provider,{value:this.state},l.createElement(E.SeriesTooltip,{key:"seriesTooltip"}),l.createElement(k.CrosshairTooltipContainer,{key:"crosshairTooltips"}),n)}getDirection(t){return(t!==void 0?t:f.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")==="rtl"}getChartOptions(){const{renderAs:t,pannable:e,zoomable:s,paneDefaults:r,panes:i,transitions:n,seriesColors:o,seriesDefaults:c,axisDefaults:h,observeStyles:d,deriveOptionsFromParent:p}=this.props;let a={};return t!==void 0&&(a.renderAs=t),e!==void 0&&(a.pannable=e),s!==void 0&&(a.zoomable=s),r!==void 0&&(a.paneDefaults=r),i!==void 0&&(a.panes=i),n!==void 0&&(a.transitions=n),o!==void 0&&(a.seriesColors=o),c!==void 0&&(a.seriesDefaults=c),h!==void 0&&(a.axisDefaults=h),a.observeStyles=d!==void 0?d:!0,a=Object.assign(a,this.optionsStore.getState()),p&&(a=p(a)),a}refresh(){if(this.chartInstance!==null){const t=this.themeStore.getState(),e=this.getChartOptions(),s=e.transitions;this.suppressTransitions&&(e.transitions=!1),this.props.onRefresh?this.props.onRefresh.call(void 0,e,t,this.chartInstance):this.chartInstance.setOptions(e,t),this.suppressTransitions&&(e.transitions=s,this.suppressTransitions=!1)}}instantiateCoreChart(){const{dir:t,chartConstructor:e}=this.props,s=this.getChartOptions();this.chartInstance=new e(this.element,s,this.themeStore.getState(),{rtl:this.getDirection(t),intlService:C.provideIntlService(this),observer:this.chartObserver,sender:this})}trigger(t,e){const s=this.props.getTarget(),r=D.create(t,e,s),i="on"+t.charAt(0).toUpperCase()+t.slice(1),n=this.observersStore.getState();let o=!1;for(let c=0;c<n.length;c++)n[c].trigger(t,e)&&(o=!0);return o===!1&&r&&this.props.hasOwnProperty(i)?(this.props[i].call(void 0,r),r.isDefaultPrevented&&r.isDefaultPrevented()):o}requiresHandlers(t){for(let e=0;e<t.length;e++){const s=t[e],r="on"+s.charAt(0).toUpperCase()+s.slice(1);if(this.props.hasOwnProperty(r))return!0}return!1}triggerDomEvent(t,e){const s=this.observersStore.getState();let r=!1;for(let i=0;i<s.length;i++)s[i].trigger(t,e)&&(r=!0);return r}onStyleChanged(){this.suppressTransitions=!0,this.readTheme()}readTheme(){if(this._element){const t=v.chartTheme(this._element),e=v.deepExtend({},v.chartBaseTheme(),t);this.themeStore.dispatch({type:"push",payload:e})}}};g.propTypes={dir:I.string,renderAs:I.oneOf(["svg","canvas"])},g.defaultProps={renderAs:"svg"};let m=g;C.registerForIntl(m);exports.BaseChart=m;

package/BaseChart.mjs

@@ -6,21 +6,21 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as l from "react";
-import u from "prop-types";
-import { provideIntlService as v, registerForIntl as w } from "@progress/kendo-react-intl";
-import { InstanceObserver as g, chartTheme as I, deepExtend as O, chartBaseTheme as C } from "@progress/kendo-charts";
-import { validatePackage as D, getLicenseMessage as y, WatermarkOverlay as E, canUseDOM as T } from "@progress/kendo-react-common";
-import { toggle as S, hasParent as P } from "./utils/index.mjs";
-import { create as L } from "./events/chart-event-builder.mjs";
-import { toDomEvent as k } from "./events/dom-event.mjs";
-import { createStore as m } from "./store/store.mjs";
-import { optionsReducer as x, observersReducer as M, themeReducer as R } from "./store/reducer.mjs";
-import { SeriesTooltip as U } from "./tooltip/Series.mjs";
-import { CrosshairTooltipContainer as W } from "./tooltip/CrosshairContainer.mjs";
-import { ChartContext as F } from "./ChartContext.mjs";
-import { packageMetadata as b } from "./package-metadata.mjs";
-import { DrilldownEvent as z } from "./events/drilldown-event.mjs";
-const d = class d extends l.Component {
+import v from "prop-types";
+import { provideIntlService as g, registerForIntl as I } from "@progress/kendo-react-intl";
+import { InstanceObserver as S, chartTheme as y, deepExtend as C, chartBaseTheme as O } from "@progress/kendo-charts";
+import { validatePackage as D, getLicenseMessage as T, WatermarkOverlay as E, canUseDOM as P } from "@progress/kendo-react-common";
+import { toggle as b, hasParent as L } from "./utils/index.mjs";
+import { create as k } from "./events/chart-event-builder.mjs";
+import { toDomEvent as x } from "./events/dom-event.mjs";
+import { createStore as f } from "./store/store.mjs";
+import { optionsReducer as M, observersReducer as R, themeReducer as U } from "./store/reducer.mjs";
+import { SeriesTooltip as W } from "./tooltip/Series.mjs";
+import { CrosshairTooltipContainer as F } from "./tooltip/CrosshairContainer.mjs";
+import { ChartContext as z } from "./ChartContext.mjs";
+import { packageMetadata as w } from "./package-metadata.mjs";
+import { DrilldownEvent as _ } from "./events/drilldown-event.mjs";
+const m = class m extends l.Component {
   constructor(t) {
     super(t), 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 = (e) => {
       this.chartInstance !== null && (this.surface = e.sender.surface, this.trigger("render", e));
@@ -34,8 +34,8 @@ const d = class d extends l.Component {
             ...e,
             currentState: this.props.drilldownState,
             nextState: { steps: h }
-          }, a = new z(p, c);
-          this.props[n].call(void 0, a);
+          }, d = new _(p, c);
+          this.props[n].call(void 0, d);
         }
       }
       return !0;
@@ -50,10 +50,10 @@ const d = class d extends l.Component {
           let r = {};
           const { seriesIndex: i, pointIndex: n } = e, o = s[i];
           if (n === void 0)
-            r = Object.assign({}, o, { visible: S(o.visible) });
+            r = Object.assign({}, o, { visible: b(o.visible) });
           else {
             const h = o.pointVisibility = o.pointVisibility || [];
-            h[n] = S(h[n]), r = Object.assign({}, o);
+            h[n] = b(h[n]), r = Object.assign({}, o);
           }
           this.optionsStore.dispatch({
             chartCollectionIdxKey: `series_${i}`,
@@ -63,20 +63,21 @@ const d = class d extends l.Component {
     }, this.onWindowResize = () => {
       this.chartInstance !== null && this.chartInstance.resize();
     }, this.onChartMouseLeave = (e) => {
-      const s = k(this, e);
+      const s = x(this, e);
       this.triggerDomEvent("onMouseLeave", s) ? e.preventDefault() : this.chartInstance !== null && this.chartInstance.hideElements();
     }, this.onChildMouseLeave = (e) => {
       const { syntheticEvent: s } = e;
-      return this.chartInstance && !P(s.relatedTarget, this.element) && this.chartInstance.hideElements(), !1;
-    }, this.showLicenseWatermark = !D(b, { component: "Chart" }), this.licenseMessage = y(b), this.optionsStore = m(x), this.observersStore = m(M), this.childrenObserver = new g(this, { onMouseLeave: "onChildMouseLeave" }), this.state = {
+      return this.chartInstance && !L(s.relatedTarget, this.element) && this.chartInstance.hideElements(), !1;
+    }, this.showLicenseWatermark = !D(w, { component: "Chart" }), this.licenseMessage = T(w), this.optionsStore = f(M), this.observersStore = f(R), this.childrenObserver = new S(this, { onMouseLeave: "onChildMouseLeave" }), this.state = {
       optionsStore: this.optionsStore,
       observersStore: this.observersStore,
       childrenObserver: this.childrenObserver,
       drilldownState: { steps: [] }
-    }, this.themeStore = m(R), this.chartObserver = new g(this, {
+    }, this.themeStore = f(U), this.chartObserver = new S(this, {
       render: "onRender",
       legendItemClick: "onLegendItemClick",
-      drilldown: "onDrilldown"
+      drilldown: "onDrilldown",
+      styleChanged: "onStyleChanged"
     });
   }
   /**
@@ -98,16 +99,7 @@ const d = class d extends l.Component {
    * @hidden
    */
   componentDidMount() {
-    if (this._element) {
-      let t = {};
-      try {
-        t = I(this._element);
-      } catch {
-      }
-      const e = O(C(), t);
-      this.themeStore.dispatch({ type: "push", payload: e }), this.instantiateCoreChart();
-    }
-    this.optionsUnsubscriber = this.optionsStore.subscribe(this.refresh.bind(this)), this.themeUnsubscriber = this.themeStore.subscribe(this.refresh.bind(this)), window.addEventListener("resize", this.onWindowResize);
+    this._element && (this.readTheme(), this.instantiateCoreChart()), this.optionsUnsubscriber = this.optionsStore.subscribe(this.refresh.bind(this)), this.themeUnsubscriber = this.themeStore.subscribe(this.refresh.bind(this)), window.addEventListener("resize", this.onWindowResize);
   }
   /**
    * @hidden
@@ -121,9 +113,9 @@ const d = class d extends l.Component {
   componentDidUpdate(t) {
     const { dir: e, children: s, ...r } = this.props;
     if (this.chartInstance !== null) {
-      const i = v(this), n = this.chartInstance.chartService, o = i.locale !== n._intlService.locale, h = Object.entries(t).filter((c) => c[0] !== "dir" && c[0] !== "children").some((c) => {
-        const [p, a] = c;
-        return !(r.hasOwnProperty(p) && r[p] === a);
+      const i = g(this), n = this.chartInstance.chartService, o = i.locale !== n._intlService.locale, h = Object.entries(t).filter((c) => c[0] !== "dir" && c[0] !== "children").some((c) => {
+        const [p, d] = c;
+        return !(r.hasOwnProperty(p) && r[p] === d);
       });
       o && (this.chartInstance.chartService._intlService = i, this.chartInstance.chartService.format._intlService = i, h || this.chartInstance.noTransitionsRedraw()), h && this.refresh(), t.dir !== e && this.chartInstance.setDirection(this.getDirection(e));
     }
@@ -152,13 +144,13 @@ const d = class d extends l.Component {
       ),
       /* @__PURE__ */ l.createElement(l.Fragment, null, this.showLicenseWatermark && /* @__PURE__ */ l.createElement(E, { message: this.licenseMessage }))
     );
-    return /* @__PURE__ */ l.createElement(F.Provider, { value: this.state }, /* @__PURE__ */ l.createElement(U, { key: "seriesTooltip" }), /* @__PURE__ */ l.createElement(W, { key: "crosshairTooltips" }), n);
+    return /* @__PURE__ */ l.createElement(z.Provider, { value: this.state }, /* @__PURE__ */ l.createElement(W, { key: "seriesTooltip" }), /* @__PURE__ */ l.createElement(F, { key: "crosshairTooltips" }), n);
   }
   /**
    * @hidden
    */
   getDirection(t) {
-    return (t !== void 0 ? t : T && window.getComputedStyle(this.element).direction || "ltr") === "rtl";
+    return (t !== void 0 ? t : P && window.getComputedStyle(this.element).direction || "ltr") === "rtl";
   }
   /**
    * @hidden
@@ -174,10 +166,11 @@ const d = class d extends l.Component {
       seriesColors: o,
       seriesDefaults: h,
       axisDefaults: c,
-      deriveOptionsFromParent: p
+      observeStyles: p,
+      deriveOptionsFromParent: d
     } = this.props;
     let a = {};
-    return t !== void 0 && (a.renderAs = t), e !== void 0 && (a.pannable = e), s !== void 0 && (a.zoomable = s), r !== void 0 && (a.paneDefaults = r), i !== void 0 && (a.panes = i), n !== void 0 && (a.transitions = n), o !== void 0 && (a.seriesColors = o), h !== void 0 && (a.seriesDefaults = h), c !== void 0 && (a.axisDefaults = c), a = Object.assign(a, this.optionsStore.getState()), p && (a = p(a)), a;
+    return t !== void 0 && (a.renderAs = t), e !== void 0 && (a.pannable = e), s !== void 0 && (a.zoomable = s), r !== void 0 && (a.paneDefaults = r), i !== void 0 && (a.panes = i), n !== void 0 && (a.transitions = n), o !== void 0 && (a.seriesColors = o), h !== void 0 && (a.seriesDefaults = h), c !== void 0 && (a.axisDefaults = c), a.observeStyles = p !== void 0 ? p : !0, a = Object.assign(a, this.optionsStore.getState()), d && (a = d(a)), a;
   }
   /**
    * @hidden
@@ -195,7 +188,7 @@ const d = class d extends l.Component {
     const { dir: t, chartConstructor: e } = this.props, s = this.getChartOptions();
     this.chartInstance = new e(this.element, s, this.themeStore.getState(), {
       rtl: this.getDirection(t),
-      intlService: v(this),
+      intlService: g(this),
       observer: this.chartObserver,
       sender: this
     });
@@ -205,7 +198,7 @@ const d = class d extends l.Component {
    * @hidden
    */
   trigger(t, e) {
-    const s = this.props.getTarget(), r = L(t, e, s), i = "on" + t.charAt(0).toUpperCase() + t.slice(1), n = this.observersStore.getState();
+    const s = this.props.getTarget(), r = k(t, e, s), i = "on" + t.charAt(0).toUpperCase() + t.slice(1), n = this.observersStore.getState();
     let o = !1;
     for (let h = 0; h < n.length; h++)
       n[h].trigger(t, e) && (o = !0);
@@ -234,15 +227,30 @@ const d = class d extends l.Component {
       s[i].trigger(t, e) && (r = !0);
     return r;
   }
+  /**
+   * @hidden
+   */
+  onStyleChanged() {
+    this.suppressTransitions = !0, this.readTheme();
+  }
+  /**
+   * @hidden
+   */
+  readTheme() {
+    if (this._element) {
+      const t = y(this._element), e = C({}, O(), t);
+      this.themeStore.dispatch({ type: "push", payload: e });
+    }
+  }
 };
-d.propTypes = {
-  dir: u.string,
-  renderAs: u.oneOf(["svg", "canvas"])
-}, d.defaultProps = {
+m.propTypes = {
+  dir: v.string,
+  renderAs: v.oneOf(["svg", "canvas"])
+}, m.defaultProps = {
   renderAs: "svg"
 };
-let f = d;
-w(f);
+let u = m;
+I(u);
 export {
-  f as BaseChart
+  u as BaseChart
 };

package/dist/cdn/js/kendo-react-charts.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(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"),require("react-dom")):"function"==typeof define&&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","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactCharts={},e.React,e.PropTypes,e.KendoReactIntl,e.KendoCharts,e.KendoReactCommon,e.KendoReactPopup,e.KendoReactLayout,e.KendoSvgIcons,e.ReactDOM)}(this,(function(e,t,r,s,n,a,i,o,l,c){"use strict";function h(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var p=h(t),d=h(c);function u(e,t){let r=e;for(;r&&r!==t;)r=r.parentNode;return!!r}function m(e,t,r,s){const n=e[t];if(n&&Array.isArray(n))for(const e of n)if(!e.type||e.type!==s)return new Error(`${r} children should be Array of type ${s.displayName}.`);return null}const y=e=>void 0!==e&&!e;let g=class{constructor(e){this.target=e}},v=class extends g{constructor(e,t){super(t),this.axis=e.axis,this.dataItem=e.dataItem,this.index=e.index,this.text=e.text,this.value=e.value}},C=class extends g{constructor(){super(...arguments),this.prevented=!1}preventDefault(){this.prevented=!0}isDefaultPrevented(){return this.prevented}},b=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},f=class extends g{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},x=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},E=class extends g{constructor(e,t){super(t),this.value=e.value,this.point=e.point,this.series=e.series,this.currentState=e.currentState,this.nextState=e.nextState}},S=class extends C{constructor(e,t){super(t),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}},I=class extends C{constructor(e,t){super(t),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}},N=class extends g{constructor(e,t){super(t),this.from=e.from,this.to=e.to}},_=class extends g{constructor(e,t){super(t),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}},k=class extends g{constructor(e,t){super(t),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}},T=class extends g{constructor(e,t){super(t),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}},w=class extends g{constructor(e,t){super(t),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}},K=class extends g{constructor(e,t){super(t)}},A=class extends C{constructor(e,t){super(t),this.axis=e.axis,this.from=e.from,this.to=e.to}},O=class extends g{constructor(e,t){super(t),this.axis=e.axis,this.from=e.from,this.to=e.to}},L=class extends C{constructor(e,t){super(t),this.axis=e.axis,this.from=e.from,this.to=e.to}},D=class extends g{constructor(e,t){super(t),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}},R=class extends C{constructor(e,t){super(t),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}},P=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.delta=e.delta,this.nativeEvent=e.originalEvent}},F=class extends g{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},V=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}};const M={axisLabelClick:v,drag:b,dragEnd:f,dragStart:x,drilldownEvent:E,legendItemHover:S,legendItemClick:I,legendItemLeave:class extends C{constructor(e,t){super(t),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}},navigatorFilter:N,noteClick:_,noteHover:k,plotAreaClick:T,plotAreaHover:w,render:K,select:A,selectEnd:O,selectStart:L,seriesClick:D,seriesHover:R,zoom:P,zoomEnd:F,zoomStart:V};let H=class{constructor(e,t){this.sender=e,this.syntheticEvent=t}};function j(e,t){return new H(e,t)}const U=e=>{let t,r,s=[];const n=n=>{t=e(t,n),a.canUseDOM&&(window.clearTimeout(r),r=window.setTimeout((()=>s.forEach((e=>e()))),16.666666666666668))};return n({}),{getState:()=>t,dispatch:n,subscribe:e=>(s.push(e),()=>s=s.filter((t=>t!==e)))}},z=(e,t)=>t.chartCollectionIdxKey?W.collectionConfigurationItem(e,t):t.chartKey?W.configurationItem(e,t):{},q=(e,t)=>{if(!t.type)return{};switch(t.type){case"set":return W.themeItem(e,t);case"push":return Object.assign(e,t.payload);default:return e}},B=(e,t)=>{if(!t.type)return[];switch(t.type){case"add":return[...e,t.payload];case"remove":return e.filter((e=>e!==t.payload));default:return e}},W={configurationItem:(e,t)=>Object.assign(e,{[t.chartKey]:t.payload}),collectionConfigurationItem(e,t){let r=!1;const[s,n]=t.chartCollectionIdxKey.split("_"),a=e[s].map(((e,s)=>parseInt(n,10)===s?(r=!0,t.payload):e));return!1===r&&a.splice(parseInt(n,10),0,t.payload),Object.assign(e,{[s]:a})},themeItem(e,t){let r={};const s=Object.assign(r,e),{field:n,value:a}=t.payload,i=n.split(".");let o=i.shift();for(;i.length>0;)r=r[o]=r[o]||{},o=i.shift();return r[o]=a,s}};let X=class{constructor(e,t){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||t}get formattedValue(){return this.format?this.point.formatValue(this.format):String(this.value)}};const Y=e=>{const{categoryText:t,colorMarker:r,colspan:s,nameColumn:n,points:a}=e;return p.createElement("table",null,p.createElement("thead",null,p.createElement("tr",null,p.createElement("th",{colSpan:s},t))),p.createElement("tbody",null,a.map(((e,t)=>p.createElement("tr",{key:t},r&&p.createElement("td",null,p.createElement("span",{className:"k-chart-shared-tooltip-marker",style:{backgroundColor:e.series.color}})),n&&p.createElement("td",null,e.series.name),p.createElement("td",{dangerouslySetInnerHTML:{__html:e.formattedValue}}))))))},$=p.createContext(null);$.displayName="ChartContext";const Z={horizontal:"fit",vertical:"fit"},G="k-chart-tooltip",J=class extends p.Component{constructor(e){super(e),this.context=null,this.element=null,this.onChartMouseLeave=e=>{const{syntheticEvent:t}=e;return!!u(t.relatedTarget,this.element)},this.onMouseLeave=e=>{const t=j(this,e);this.context.childrenObserver.trigger("onMouseLeave",t)&&e.preventDefault()},this.popupRef=e=>{this.element=e;const t=e&&e.closest(".k-animation-container");t&&(t.style.transition="initial")},this.chartObserver=new n.InstanceObserver(this,{onMouseLeave:"onChartMouseLeave"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupShown:e,popupAlign:t,popupOffset:r,popupStyles:s,popupContent:n,className:a}=this.props,o=[G,a].join(" ").trim();return p.createElement(i.Popup,{animate:!1,popupAlign:t,offset:r,show:e,collision:Z,className:"k-chart-tooltip-wrapper"},p.createElement("div",{className:o,style:s,onMouseLeave:this.onMouseLeave,ref:this.popupRef},n()))}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}};J.contextType=$;let Q=J;const ee=class extends p.Component{constructor(){super(...arguments),this.context=null,this.state={popupShown:!1},this.chartObserver=null}componentDidMount(){this.chartObserver=new n.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"}),this.context.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContext:e,shared:t,className:r,...s}=this.state,n=this.state.popupShown?()=>{const r=this.findRenderFunction();if(t)return null!==r?r(e):p.createElement(Y,{...e});const s=e.point,n=this.findRenderFunctionByIndex(s.series.index);return null!==n?n(e):null!==r?r(e):p.createElement("span",{dangerouslySetInnerHTML:{__html:e.point.formattedValue}})}:Function.prototype,i=a.classNames({"k-chart-shared-tooltip":t,"k-chart-tooltip-inverse":!!r});return p.createElement(Q,{...s,popupContent:n,className:i})}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:t,style:r,shared:s,className:n,crosshair:a}=e;let i;a||(i=s?this.createSharedTooltipContext(e):this.createTooltipContext(e),this.setState({popupShown:!0,popupAlign:t.align,popupOffset:t.point,popupContext:i,popupStyles:r,className:n,shared:s}))}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}createSharedTooltipContext(e){const{points:t,categoryText:r}=e,s=t.filter((e=>void 0!==e.series.name)).length>0,n=e.series.length>1;let a=1;return s&&a++,n&&a++,{categoryText:r,colorMarker:n,colspan:a,nameColumn:s,points:e.points.map((t=>new X(t,e.format)))}}createTooltipContext(e){const{point:t,format:r}=e;return{point:new X(t,r)}}findRenderFunctionByIndex(e){const t=this.context.optionsStore.getState().series;return void 0!==t&&Array.isArray(t)&&void 0!==t[e]&&t[e].hasOwnProperty("tooltip")&&t[e].tooltip.hasOwnProperty("render")?t[e].tooltip.render:null}findRenderFunction(){const e=this.context.optionsStore.getState().tooltip;return void 0!==e&&e.hasOwnProperty("render")?e.render:null}};ee.contextType=$;let te=ee;const re=e=>e.children;re.displayName="Container";const se=class extends p.Component{constructor(e){super(e),this.context=null,this.state={popupShown:!1},this.chartObserver=new n.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContend:e,className:t,...r}=this.state,s=this.state.popupShown?()=>e:Function.prototype,n=a.classNames({"k-chart-crosshair-tooltip":!0,"k-chart-tooltip-inverse":!!t});return p.createElement(Q,{...r,popupContent:s,className:n})}componentWillUnmount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:t,style:r,className:s,crosshair:n,axisName:a,axisIndex:i,value:o}=e,{name:l,index:c}=this.props;n&&a===l&&i===c&&this.setState({popupShown:!0,popupAlign:t.align,popupOffset:t.point,popupContend:o,popupStyles:r,className:s})}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}};se.contextType=$;let ne=se;const ae=["categoryAxis","valueAxis","xAxis","yAxis"];function ie(e){const t={};for(let r=0;r<ae.length;r++){const s=oe(e,ae[r]);for(let e=0;e<s.length;e++){const r=s[e];t[r.name+r.index]=r}}return t}function oe(e,t){const r=[];if(e[t]){const s=[].concat(e[t]);for(let e=0;e<s.length;e++){const n=(s[e].crosshair||{}).tooltip;n&&n.visible&&r.push({index:e,name:t})}}return r}const le=class extends p.Component{constructor(){super(...arguments),this.context=null,this.state={tooltips:{}},this.storeUnsubscriber=Function.prototype,this.subscriber=()=>{var e;this.setState({tooltips:ie(null==(e=this.context)?void 0:e.optionsStore.getState())})}}componentDidMount(){this.storeUnsubscriber=this.context.optionsStore.subscribe(this.subscriber)}render(){const{tooltips:e}=this.state,t=Object.keys(e).map((t=>p.createElement(ne,{...e[t],key:t})));return p.createElement(re,null,t)}componentWillUnmount(){this.storeUnsubscriber()}};le.contextType=$;let ce=le;const he=Object.freeze({name:"@progress/kendo-react-charts",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"12.3.0-develop.5",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),pe=class extends p.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=e=>{null!==this.chartInstance&&(this.surface=e.sender.surface,this.trigger("render",e))},this.onDrilldown=e=>{var t;const{series:r}=this.optionsStore.getState(),s=r.find((t=>t.name===e.series.name));if(s.drilldownSeriesFactory){const r="onDrilldown";if(this.props.hasOwnProperty(r)){const n={seriesName:s.name,drilldownValue:e.value},a=[...(null==(t=this.props.drilldownState)?void 0:t.steps)||[],n],i=this.props.getTarget(),o={...e,currentState:this.props.drilldownState,nextState:{steps:a}},l=new E(o,i);this.props[r].call(void 0,l)}}return!0},this.onLegendItemClick=e=>{if(null!==this.chartInstance)if(this.props.onLegendItemClick)this.trigger("legendItemClick",e);else{const{series:t}=this.optionsStore.getState();if(!t)return;let r={};const{seriesIndex:s,pointIndex:n}=e,a=t[s];if(void 0===n)r=Object.assign({},a,{visible:y(a.visible)});else{const e=a.pointVisibility=a.pointVisibility||[];e[n]=y(e[n]),r=Object.assign({},a)}this.optionsStore.dispatch({chartCollectionIdxKey:`series_${s}`,payload:r}),this.suppressTransitions=!0}},this.onWindowResize=()=>{null!==this.chartInstance&&this.chartInstance.resize()},this.onChartMouseLeave=e=>{const t=j(this,e);this.triggerDomEvent("onMouseLeave",t)?e.preventDefault():null!==this.chartInstance&&this.chartInstance.hideElements()},this.onChildMouseLeave=e=>{const{syntheticEvent:t}=e;return this.chartInstance&&!u(t.relatedTarget,this.element)&&this.chartInstance.hideElements(),!1},this.showLicenseWatermark=!a.validatePackage(he,{component:"Chart"}),this.licenseMessage=a.getLicenseMessage(he),this.optionsStore=U(z),this.observersStore=U(B),this.childrenObserver=new n.InstanceObserver(this,{onMouseLeave:"onChildMouseLeave"}),this.state={optionsStore:this.optionsStore,observersStore:this.observersStore,childrenObserver:this.childrenObserver,drilldownState:{steps:[]}},this.themeStore=U(q),this.chartObserver=new n.InstanceObserver(this,{render:"onRender",legendItemClick:"onLegendItemClick",drilldown:"onDrilldown"})}get element(){return this._element}static getDerivedStateFromProps(e,t){return{...t,drilldownState:e.drilldownState||[]}}componentDidMount(){if(this._element){let e={};try{e=n.chartTheme(this._element)}catch{}const t=n.deepExtend(n.chartBaseTheme(),e);this.themeStore.dispatch({type:"push",payload:t}),this.instantiateCoreChart()}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(),null!==this.chartInstance&&(this.chartInstance.destroy(),this.chartInstance=null),window.removeEventListener("resize",this.onWindowResize)}componentDidUpdate(e){const{dir:t,children:r,...n}=this.props;if(null!==this.chartInstance){const r=s.provideIntlService(this),a=this.chartInstance.chartService,i=r.locale!==a._intlService.locale,o=Object.entries(e).filter((e=>"dir"!==e[0]&&"children"!==e[0])).some((e=>{const[t,r]=e;return!(n.hasOwnProperty(t)&&n[t]===r)}));i&&(this.chartInstance.chartService._intlService=r,this.chartInstance.chartService.format._intlService=r,o||this.chartInstance.noTransitionsRedraw()),o&&this.refresh(),e.dir!==t&&this.chartInstance.setDirection(this.getDirection(t))}}render(){const{style:e={},className:t,wrapper:r,children:s}=this.props,n=Object.assign({},e,{position:"relative"}),i=p.createElement(r,{className:t,style:n,key:"chartElement"},p.createElement("div",{onMouseLeave:this.onChartMouseLeave,ref:e=>{this._element=e},className:"k-chart-surface"},s),p.createElement(p.Fragment,null,this.showLicenseWatermark&&p.createElement(a.WatermarkOverlay,{message:this.licenseMessage})));return p.createElement($.Provider,{value:this.state},p.createElement(te,{key:"seriesTooltip"}),p.createElement(ce,{key:"crosshairTooltips"}),i)}getDirection(e){return"rtl"===(void 0!==e?e:a.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")}getChartOptions(){const{renderAs:e,pannable:t,zoomable:r,paneDefaults:s,panes:n,transitions:a,seriesColors:i,seriesDefaults:o,axisDefaults:l,deriveOptionsFromParent:c}=this.props;let h={};return void 0!==e&&(h.renderAs=e),void 0!==t&&(h.pannable=t),void 0!==r&&(h.zoomable=r),void 0!==s&&(h.paneDefaults=s),void 0!==n&&(h.panes=n),void 0!==a&&(h.transitions=a),void 0!==i&&(h.seriesColors=i),void 0!==o&&(h.seriesDefaults=o),void 0!==l&&(h.axisDefaults=l),h=Object.assign(h,this.optionsStore.getState()),c&&(h=c(h)),h}refresh(){if(null!==this.chartInstance){const e=this.themeStore.getState(),t=this.getChartOptions(),r=t.transitions;this.suppressTransitions&&(t.transitions=!1),this.props.onRefresh?this.props.onRefresh.call(void 0,t,e,this.chartInstance):this.chartInstance.setOptions(t,e),this.suppressTransitions&&(t.transitions=r,this.suppressTransitions=!1)}}instantiateCoreChart(){const{dir:e,chartConstructor:t}=this.props,r=this.getChartOptions();this.chartInstance=new t(this.element,r,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:s.provideIntlService(this),observer:this.chartObserver,sender:this})}trigger(e,t){const r=function(e,t,r){if(M[e])return new M[e](t,r)}(e,t,this.props.getTarget()),s="on"+e.charAt(0).toUpperCase()+e.slice(1),n=this.observersStore.getState();let a=!1;for(let r=0;r<n.length;r++)n[r].trigger(e,t)&&(a=!0);return!1===a&&r&&this.props.hasOwnProperty(s)?(this.props[s].call(void 0,r),r.isDefaultPrevented&&r.isDefaultPrevented()):a}requiresHandlers(e){for(let t=0;t<e.length;t++){const r=e[t],s="on"+r.charAt(0).toUpperCase()+r.slice(1);if(this.props.hasOwnProperty(s))return!0}return!1}triggerDomEvent(e,t){const r=this.observersStore.getState();let s=!1;for(let n=0;n<r.length;n++)r[n].trigger(e,t)&&(s=!0);return s}};pe.propTypes={dir:r.string,renderAs:r.oneOf(["svg","canvas"])},pe.defaultProps={renderAs:"svg"};let de=pe;s.registerForIntl(de);const ue=class extends p.Component{constructor(e){super(e),this.state={donutCenterStyles:null},this.chartObserver=new n.InstanceObserver(this,{render:"onRender"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{render:e}=this.props,{donutCenterStyles:t}=this.state;let r=null;return e&&t&&(r=p.createElement("div",{className:"k-chart-donut-center",style:t},p.createElement(e,null))),r}onRender(e){var t;const r=null==(t=this.context)?void 0:t.optionsStore.getState().series,s=Array.isArray(r)?r[0]:null,n=e.sender._plotArea.charts;if(!s||"donut"!==s.type||0===n[0].points.length)return;const a=n[0].points[0].sector,i=a.innerRadius,o=a.center.y-i,l=a.center.x-i,c=2*i;this.setState({donutCenterStyles:{height:c,left:l,top:o,width:c}})}};ue.contextType=$;let me=ue,ye=class extends p.Component{constructor(){super(...arguments),this._baseChart=null,this.getTarget=()=>this}get chartInstance(){return null!==this._baseChart?this._baseChart.chartInstance:null}get surface(){return null!==this._baseChart?this._baseChart.surface:null}get element(){return null!==this._baseChart?this._baseChart.element:null}render(){const{donutCenterRender:e,children:t,className:r,...s}=this.props;return p.createElement(de,{...s,ref:e=>{this._baseChart=e},chartConstructor:n.Chart,getTarget:this.getTarget,wrapper:"div",className:a.classNames("k-chart k-widget",r)},t,p.createElement(me,{render:e}))}},ge=class extends p.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const{type:t,data:r}=this.props,s=Object.assign({},e,{type:t,data:r});return n.Sparkline.normalizeOptions(s)},this.getTarget=()=>this}get chartInstance(){return null!==this._baseChart?this._baseChart.chartInstance:null}get surface(){return null!==this._baseChart?this._baseChart.surface:null}get element(){return null!==this._baseChart?this._baseChart.element:null}render(){const{children:e,type:t,className:r,...s}=this.props;return p.createElement(de,{...s,ref:e=>{this._baseChart=e},chartConstructor:n.Sparkline,getTarget:this.getTarget,wrapper:"span",deriveOptionsFromParent:this.deriveOptionsFromParent,className:a.classNames("k-sparkline k-widget",r)},e)}};const ve={autoBindElements:!0,liveDrag:!1,partialRedraw:!0};let Ce=class extends p.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const t=Object.assign({},e.navigator||{},ve);return Object.assign({},e,{navigator:t})},this.onRefresh=(e,t,r)=>{this.props.partialRedraw?(r.applyOptions(e),r.bindCategories(),r.navigator.redrawSlaves()):r.setOptions(e,t)},this.getTarget=()=>this}get chartInstance(){return null!==this._baseChart?this._baseChart.chartInstance:null}get surface(){return null!==this._baseChart?this._baseChart.surface:null}get element(){return null!==this._baseChart?this._baseChart.element:null}render(){const{children:e,className:t,...r}=this.props;return p.createElement(de,{...r,ref:e=>{this._baseChart=e},chartConstructor:n.StockChart,getTarget:this.getTarget,wrapper:"div",deriveOptionsFromParent:this.deriveOptionsFromParent,onRefresh:this.onRefresh,className:a.classNames("k-chart k-stockchart",t)},e)}};const be=class extends p.Component{get optionsStore(){var e;return null==(e=this.context)?void 0:e.optionsStore}renderChildren(e,t){const{children:r}=e.props,{_chartKey:s,_parentStore:n}=this.props,a={...e.props,_chartCollectionIdxKey:`${s}_${t}`,_parentStore:n};return p.cloneElement(e,a,r)}render(){const{_chartKey:e,_parentStore:t,children:r}=this.props;return(t||this.optionsStore).dispatch({chartKey:e,payload:[]}),p.Children.map(r,((e,t)=>p.isValidElement(e)?this.renderChildren(e,t):e))}};be.contextType=$;let fe=be;const xe=class extends p.Component{get optionsStore(){var e;return null==(e=this.context)?void 0:e.optionsStore}constructor(e){super(e),this.childStore=U(z)}render(){const{children:e}=this.props;return void 0!==e?p.Children.map(e,(e=>p.isValidElement(e)?this.renderChildren(e):e)):null}componentDidMount(){this.dispatch()}componentDidUpdate(){this.dispatch()}dispatch(){const{_chartKey:e,_chartCollectionIdxKey:t,_parentStore:r,children:s,...n}=this.props;(r||this.optionsStore).dispatch({chartKey:e,chartCollectionIdxKey:t,payload:Object.assign({},n,this.childStore.getState())})}renderChildren(e){const{children:t}=e.props,r={...e.props,_parentStore:this.childStore};return p.cloneElement(e,r,t)}};xe.contextType=$;let Ee=xe,Se=class{constructor(e){this.currentState=e.currentState,this.nextState=e.nextState}};const Ie=p.forwardRef(((e,t)=>{const r=p.useRef(null),s=p.useRef(null),n={valueField:_e.valueField,textField:_e.textField,iconField:_e.iconField,iconClassField:_e.iconClassField,...e};p.useImperativeHandle(r,(()=>({element:s.current,props:n}))),p.useImperativeHandle(t,(()=>r.current));let i=[{id:"0",...e.rootItem||{text:"Home",icon:p.createElement(a.SvgIcon,{icon:l.homeIcon,style:{marginInlineEnd:"4px"}})}}];e.drilldownState&&(i=[...i,...e.drilldownState.steps.map(((e,t)=>({id:(t+1).toString(),text:e.drilldownValue})))]);const c={...n,data:i};return p.createElement("div",null,p.createElement(o.Breadcrumb,{...c,onItemSelect:t=>{var r;const s="onDrilldownStateChange";if(e.hasOwnProperty(s)){const n=i.findIndex((e=>e.id===t.id)),a={steps:((null==(r=e.drilldownState)?void 0:r.steps)||[]).slice(0,n)},o=new Se({currentState:e.drilldownState,nextState:a});e[s].call(void 0,o)}}}))})),Ne={id:r.string,style:r.object,className:r.string,breadcrumbOrderedList:r.elementType,breadcrumbListItem:r.elementType,breadcrumbDelimiter:r.elementType,breadcrumbLink:r.elementType,dir:r.oneOf(["ltr","rtl"]),disabled:r.bool,valueField:r.string,textField:r.string,iconField:r.string,iconClassField:r.string,onItemSelect:r.func,ariaLabel:r.string,onDrilldownStateChange:r.func,drilldownState:r.shape({steps:r.array}),rootItem:r.object},_e={valueField:"id",textField:"text",iconField:"icon",iconClassField:"iconClass",data:[]};Ie.displayName="KendoReactChartBreadcrumb",Ie.propTypes=Ne;const ke="charts.nodata",Te={[ke]:"No data available."},we=e=>{const t=s.useLocalization();return p.createElement("div",{className:a.classNames("k-chart-overlay",e.className),style:{display:"none",...e.style}},p.createElement("div",{className:"k-no-data"},void 0===e.children?t.toLanguageString(ke,Te[ke]):e.children))};we.displayName="ChartNoDataOverlay";const Ke=e=>p.createElement(Ee,{...e,_chartKey:"title"});Ke.displayName="ChartAxisDefaultsTitle";const Ae=e=>p.createElement(Ee,{...e,_chartKey:"labels"});Ae.displayName="ChartAxisDefaultsLabels";const Oe=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"});Oe.displayName="ChartAxisDefaultsCrosshair";const Le=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"});Le.displayName="ChartAxisDefaultsCrosshairTooltip";const De=e=>p.createElement(Ee,{...e,_chartKey:"title"});De.displayName="ChartCategoryAxisTitle";const Re=e=>p.createElement(Ee,{...e,_chartKey:"title"});Re.displayName="ChartPaneDefaultsTitle";const Pe=e=>p.createElement(Ee,{...e,_chartKey:"item"});Pe.displayName="ChartLegendItem";const Fe=e=>p.createElement(Ee,{...e,_chartKey:"title"});Fe.displayName="ChartLegendTitle";const Ve=e=>p.createElement(Ee,{...e,_chartKey:"inactiveItems"});Ve.displayName="ChartLegendInactiveItems";const Me=e=>p.createElement(Ee,{...e,_chartKey:"title"});Me.displayName="ChartValueAxisTitle";const He=e=>p.createElement(Ee,{...e,_chartKey:"title"});He.displayName="ChartXAxisTitle";const je=e=>p.createElement(Ee,{...e,_chartKey:"title"});je.displayName="ChartYAxisTitle";const Ue=e=>p.createElement(Ee,{...e,_chartKey:"title"});Ue.displayName="ChartNavigatorPaneTitle";const ze=e=>p.createElement(Ee,{...e,_chartKey:"categoryAxis"});ze.displayName="ChartNavigatorCategoryAxis";const qe=e=>p.createElement(Ee,{...e,_chartKey:"pane"});qe.displayName="ChartNavigatorPane";const Be=e=>p.createElement(Ee,{...e});Be.displayName="ChartNavigatorSeriesItem";const We=e=>p.createElement(fe,{...e,_chartKey:"series"});We.propTypes={children:function(e,t,r){return m(e,t,r,Be)}};const Xe=e=>p.createElement(Ee,{...e,_chartKey:"chartArea"});Xe.displayName="ChartArea";const Ye=e=>p.createElement(Ee,{...e});Ye.displayName="ChartCategoryAxisItem";const $e=e=>p.createElement(fe,{...e,_chartKey:"categoryAxis"});$e.propTypes={children:function(e,t,r){return m(e,t,r,Ye)}},$e.displayName="ChartCategoryAxis";const Ze=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"legend"});Ze.displayName="ChartLegend";const Ge=e=>p.createElement(Ee,{visible:!0,position:"bottom",...e,_chartKey:"navigator"});Ge.displayName="ChartNavigator";const Je=e=>p.createElement(Ee,{...e});Je.displayName="ChartPane";const Qe=e=>p.createElement(Ee,{...e,_chartKey:"paneDefaults"});Qe.displayName="ChartPaneDefaults";const et=e=>p.createElement(fe,{...e,_chartKey:"panes"});et.propTypes={children:function(e,t,r){return m(e,t,r,Je)}};const tt=e=>{let t=e=>p.createElement(p.Fragment,null);e.drilldownSeriesFactory&&(t=e.drilldownSeriesFactory);const r=t=>{var r,s;return t&&(null==(s=null==(r=t.drilldownState)?void 0:r.steps)?void 0:s.find((({seriesName:t})=>t===e.name)))};return p.createElement($.Consumer,null,(s=>r(s)?p.createElement(t,{_chartCollectionIdxKey:e._chartCollectionIdxKey,drilldownValue:r(s).drilldownValue}):p.createElement(Ee,{...e})))};tt.displayName="ChartSeriesItem";const rt=e=>p.createElement(fe,{...e,_chartKey:"series"});rt.propTypes={children:function(e,t,r){return m(e,t,r,tt)}},rt.displayName="ChartSeries";const st=e=>p.createElement(Ee,{...e,_chartKey:"subtitle"});st.displayName="ChartSubtitle";const nt=e=>p.createElement(Ee,{...e,_chartKey:"title"});nt.displayName="ChartTitle";const at=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"});at.displayName="ChartTooltip";const it=e=>p.createElement(Ee,{...e});it.displayName="ChartValueAxisItem";const ot=e=>p.createElement(fe,{...e,_chartKey:"valueAxis"});ot.propTypes={children:function(e,t,r){return m(e,t,r,it)}},ot.displayName="ChartValueAxis";const lt=e=>p.createElement(Ee,{...e});lt.displayName="ChartXAxisItem";const ct=e=>p.createElement(fe,{...e,_chartKey:"xAxis"});ct.prototype={children:function(e,t,r){return m(e,t,r,lt)}},ct.displayName="ChartXAxis";const ht=e=>p.createElement(Ee,{...e});ht.displayName="ChartYAxisItem";const pt=e=>p.createElement(fe,{...e,_chartKey:"yAxis"});pt.propTypes={children:function(e,t,r){return m(e,t,r,ht)}},pt.displayName="ChartYAxis";const dt=r.exact({left:r.number,top:r.number}),ut={left:r.number,right:r.number},mt={...ut,top:r.number,bottom:r.number},yt=r.oneOfType([r.number,r.exact(mt)]),gt=yt,vt=r.exact({width:r.number,color:r.string,opacity:r.number,dashType:r.string}),Ct={visible:r.bool,font:r.string,color:r.string,opacity:r.number,align:r.oneOf(["left","right","center"]),position:r.oneOf(["inside","before","after"]),padding:gt,margin:r.exact(ut),border:vt,offset:dt},bt={color:r.string,opacity:r.number,offset:dt,padding:r.number,width:r.number,focusHighlight:r.exact({border:vt})},ft={colorType:r.oneOf(["static","source","target"]),color:r.string,opacity:r.number,highlight:r.exact({opacity:r.number,inactiveOpacity:r.number}),focusHighlight:r.exact({border:vt})},xt=r.exact({text:r.string,...Ct}),Et=r.exact({id:r.oneOfType([r.string,r.number]).isRequired,label:xt.isRequired,...bt}),St=r.exact({sourceId:r.oneOfType([r.string,r.number]).isRequired,targetId:r.oneOfType([r.string,r.number]).isRequired,value:r.number.isRequired,...ft}),It={data:r.exact({nodes:r.arrayOf(Et.isRequired).isRequired,links:r.arrayOf(St.isRequired).isRequired}).isRequired,links:r.exact(ft),nodes:r.exact(bt),labels:r.exact(Ct),legend:r.exact({align:r.oneOf(["start","center","end"]),background:r.string,border:vt,height:r.number,labels:r.object,margin:yt,offsetX:r.number,offsetY:r.number,orientation:r.oneOf(["vertical","horizontal"]),padding:gt,position:r.oneOf(["top","bottom","left","right","custom"]),reverse:r.bool,visible:r.bool,width:r.number,item:r.object,title:r.object}),title:r.exact({align:r.oneOf(["center","left","right"]),background:r.string,border:vt,color:r.string,font:r.string,margin:yt,padding:gt,position:r.oneOf(["top","bottom"]),text:r.string,visible:r.bool}),tooltip:r.exact({visible:r.bool,appendTo:r.any,offset:r.number,followPointer:r.bool,delay:r.number,linkComponent:r.any,nodeComponent:r.any}),className:r.string,style:r.object,dir:r.string,disableAutoLayout:r.bool,disableKeyboardNavigation:r.bool,onNodeEnter:r.func,onNodeLeave:r.func,onLinkEnter:r.func,onLinkLeave:r.func,onNodeClick:r.func,onLinkClick:r.func},Nt="sankey.tooltipUnitFormat",_t={[Nt]:"({0} units)"},kt=e=>{const{appendTo:t,Content:r,dir:s,offset:n,event:{tooltipData:a,dataItem:i,nodeValue:o}}=e,l=p.useRef(null);p.useEffect((()=>{const e=l.current;if(!a||!e)return;const t=e.offsetWidth,r=e.offsetHeight,s={...a.popupOffset},i=a.popupAlign;s.left+="left"===i.horizontal?n:-1*n,"right"===i.horizontal&&(s.left-=t),"bottom"===i.vertical?s.top-=r+n:s.top+=n,e.style.left=`${s.left}px`,e.style.top=`${s.top}px`,e.style.visibility=""}),[a,n]);const c=p.createElement("div",{ref:l,style:{visibility:"hidden"},dir:s,className:"k-tooltip k-sankey-tooltip k-chart-tooltip k-chart-shared-tooltip"},p.createElement("div",{className:"k-tooltip-content"},p.createElement(r,{dir:s,dataItem:i,nodeValue:o})));return t?d.createPortal(c,t):c},Tt={display:"flex",alignItems:"center"},wt=e=>p.createElement("div",{style:{width:15,height:15,backgroundColor:e.color,display:"inline-flex",marginLeft:3}}),Kt=e=>p.createElement("span",{style:{margin:"0 3px"}},e.children),At=e=>s.useInternationalization().format(s.useLocalization().toLanguageString(Nt,_t[Nt]),[e||0]),Ot=e=>{const{color:t,label:r}=e.dataItem;return p.createElement("div",{style:Tt,className:"k-tooltip-content"},p.createElement(wt,{color:t}),p.createElement(Kt,null,r.text),p.createElement(Kt,null,At(e.nodeValue)))},Lt=e=>{const{source:t,target:r,value:s}=e.dataItem,n="rtl"===e.dir?l.arrowLeftIcon:l.arrowRightIcon;return p.createElement("div",{style:Tt},p.createElement(wt,{color:t.color}),p.createElement(Kt,null,t.label.text),p.createElement(a.IconWrap,{icon:n,name:n.name}),p.createElement(wt,{color:r.color}),p.createElement(Kt,null,r.label.text),p.createElement(Kt,null,At(s)))},Dt=12,Rt={offset:Dt,visible:!0},Pt=["nodeEnter","nodeLeave","linkEnter","linkLeave","nodeClick","linkClick"],Ft=p.forwardRef(((e,t)=>{const r=!a.validatePackage(he,{component:"Sankey"}),s=a.getLicenseMessage(he),i=p.useRef(null),o=p.useRef(null),l=a.useRtl(i,e.dir,[e.dir,i.current]),c=p.useRef(null),h=a.useDocument(i),{data:d,links:u,nodes:m,labels:y,title:g,legend:v,tooltip:C=Rt,disableAutoLayout:b,disableKeyboardNavigation:f}=e,x=p.useRef(void 0);x.current=e;const[E,S]=p.useState(null),I=p.useCallback((e=>{const{visible:t,appendTo:r=h().body,offset:s=Dt,nodeComponent:n=Ot,linkComponent:a=Lt}={...Rt,...C};if(t){const t={appendTo:r,event:e,offset:s,dir:l,Content:"node"===e.targetType?n:a};S(t)}}),[C,l,h]),N=p.useCallback((()=>{S(null)}),[]),_=p.useCallback(((e,t)=>{const r=x.current[e];if(r){const e={...t,nativeEvent:t.originalEvent,target:c.current};r.call(void 0,e)}}),[]);return p.useEffect((()=>{const e={data:d,links:u,nodes:m,labels:y,title:g,legend:v,disableAutoLayout:b,disableKeyboardNavigation:f,rtl:"rtl"===l,tooltip:{...Rt,...C}};if(o.current)o.current.setOptions(e);else if(a.canUseDOM&&i.current){const t=n.sankeyTheme(i.current);o.current=new n.Sankey(i.current,e,t),((e,t)=>{e&&(e.unbind(),Pt.forEach((r=>{t[r]&&e.bind(r,t[r])})))})(o.current,{nodeEnter:e=>{_("onNodeEnter",e)},nodeLeave:e=>{_("onNodeLeave",e)},linkEnter:e=>{_("onLinkEnter",e)},linkLeave:e=>{_("onLinkLeave",e)},nodeClick:e=>{_("onNodeClick",e)},linkClick:e=>{_("onLinkClick",e)}}),o.current.bind("tooltipShow",I),o.current.bind("tooltipHide",N)}return()=>{o.current&&(o.current.destroy(),o.current=null)}}),[d,u,m,y,g,v,b,f,l,C,N,I,_]),p.useImperativeHandle(c,(()=>({get element(){return i.current},exportVisual:e=>o.current.exportVisual(e),props:e})),[]),p.useImperativeHandle(t,(()=>c.current)),p.createElement(p.Fragment,null,p.createElement("div",{ref:i,className:e.className,style:e.style,dir:l}),E&&p.createElement(kt,{...E}),r&&p.createElement(a.WatermarkOverlay,{message:s}))}));Ft.propTypes=It,Ft.displayName="KendoReactSankey";const Vt=n.createSankeyData;e.AxisLabelClickEvent=v,e.Chart=ye,e.ChartArea=Xe,e.ChartAxisDefaults=e=>p.createElement(Ee,{...e,_chartKey:"axisDefaults"}),e.ChartAxisDefaultsCrosshair=Oe,e.ChartAxisDefaultsCrosshairTooltip=Le,e.ChartAxisDefaultsLabels=Ae,e.ChartAxisDefaultsTitle=Ke,e.ChartBreadcrumb=Ie,e.ChartCategoryAxis=$e,e.ChartCategoryAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartCategoryAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartCategoryAxisItem=Ye,e.ChartCategoryAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartCategoryAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartCategoryAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartCategoryAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartCategoryAxisRangeLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"rangeLabels"}),e.ChartCategoryAxisTitle=De,e.ChartLegend=Ze,e.ChartLegendInactiveItems=Ve,e.ChartLegendItem=Pe,e.ChartLegendTitle=Fe,e.ChartNavigator=Ge,e.ChartNavigatorCategoryAxis=ze,e.ChartNavigatorHint=e=>p.createElement(Ee,{...e,_chartKey:"hint"}),e.ChartNavigatorPane=qe,e.ChartNavigatorPaneTitle=Ue,e.ChartNavigatorSelect=e=>p.createElement(Ee,{...e,_chartKey:"select"}),e.ChartNavigatorSeries=We,e.ChartNavigatorSeriesErrorBars=e=>p.createElement(Ee,{...e,_chartKey:"errorBars"}),e.ChartNavigatorSeriesExtremes=e=>p.createElement(Ee,{...e,_chartKey:"extremes"}),e.ChartNavigatorSeriesHighlight=e=>p.createElement(Ee,{...e,_chartKey:"highlight"}),e.ChartNavigatorSeriesItem=Be,e.ChartNavigatorSeriesItemOutliers=e=>p.createElement(Ee,{...e,_chartKey:"outliers"}),e.ChartNavigatorSeriesItemTooltip=e=>p.createElement(Ee,{...e,_chartKey:"tooltip"}),e.ChartNavigatorSeriesLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartNavigatorSeriesLabelsFrom=e=>p.createElement(Ee,{...e,_chartKey:"from"}),e.ChartNavigatorSeriesLabelsTo=e=>p.createElement(Ee,{...e,_chartKey:"to"}),e.ChartNavigatorSeriesMarkers=e=>p.createElement(Ee,{...e,_chartKey:"markers"}),e.ChartNavigatorSeriesNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartNavigatorSeriesNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartNavigatorSeriesNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartNoDataOverlay=we,e.ChartPane=Je,e.ChartPaneDefaults=Qe,e.ChartPaneDefaultsTitle=Re,e.ChartPanes=et,e.ChartPlotArea=e=>p.createElement(Ee,{...e,_chartKey:"plotArea"}),e.ChartSeries=rt,e.ChartSeriesDefaults=e=>p.createElement(Ee,{...e,_chartKey:"seriesDefaults"}),e.ChartSeriesErrorBars=e=>p.createElement(Ee,{...e,_chartKey:"errorBars"}),e.ChartSeriesExtremes=e=>p.createElement(Ee,{...e,_chartKey:"extremes"}),e.ChartSeriesHighlight=e=>p.createElement(Ee,{...e,_chartKey:"highlight"}),e.ChartSeriesItem=tt,e.ChartSeriesItemOutliers=e=>p.createElement(Ee,{...e,_chartKey:"outliers"}),e.ChartSeriesItemTooltip=e=>p.createElement(Ee,{...e,_chartKey:"tooltip"}),e.ChartSeriesLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartSeriesLabelsFrom=e=>p.createElement(Ee,{...e,_chartKey:"from"}),e.ChartSeriesLabelsTo=e=>p.createElement(Ee,{...e,_chartKey:"to"}),e.ChartSeriesMarkers=e=>p.createElement(Ee,{...e,_chartKey:"markers"}),e.ChartSeriesNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartSeriesNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartSeriesNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartSubtitle=st,e.ChartTitle=nt,e.ChartTooltip=at,e.ChartValueAxis=ot,e.ChartValueAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartValueAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartValueAxisItem=it,e.ChartValueAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartValueAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartValueAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartValueAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartValueAxisTitle=Me,e.ChartXAxis=ct,e.ChartXAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartXAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartXAxisItem=lt,e.ChartXAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartXAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartXAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartXAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartXAxisTitle=He,e.ChartYAxis=pt,e.ChartYAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartYAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartYAxisItem=ht,e.ChartYAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartYAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartYAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartYAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartYAxisTitle=je,e.ChartZoomable=e=>p.createElement(Ee,{...e,_chartKey:"zoomable"}),e.CollectionConfigurationComponent=fe,e.ConfigurationComponent=Ee,e.CrosshairTooltip=ne,e.CrosshairTooltipContainer=ce,e.DonutCenter=me,e.DragEndEvent=f,e.DragEvent=b,e.DragStartEvent=x,e.DrilldownEvent=E,e.DrilldownStateChangeEvent=Se,e.LegendItemClickEvent=I,e.LegendItemHoverEvent=S,e.NavigatorFilterEvent=N,e.NoteClickEvent=_,e.NoteHoverEvent=k,e.PlotAreaClickEvent=T,e.PlotAreaHoverEvent=w,e.RenderEvent=K,e.Sankey=Ft,e.SelectEndEvent=O,e.SelectEvent=A,e.SelectStartEvent=L,e.SeriesClickEvent=D,e.SeriesHoverEvent=R,e.SeriesTooltip=te,e.SharedTooltipContent=Y,e.Sparkline=ge,e.StockChart=Ce,e.TooltipPoint=X,e.TooltipPopup=Q,e.ZoomEndEvent=F,e.ZoomEvent=P,e.ZoomStartEvent=V,e.createSankeyData=Vt,e.exportVisual=(e,t={})=>{if(e&&null!==e.chartInstance)return e.chartInstance.exportVisual(t)},e.findAxisByName=(e,t)=>{if(e&&null!==e.chartInstance)return e.chartInstance.findAxisByName(t)},e.findPaneByIndex=(e,t)=>{if(e&&null!==e.chartInstance)return e.chartInstance.findPaneByIndex(t)},e.findPaneByName=(e,t)=>{if(e&&null!==e.chartInstance)return e.chartInstance.findPaneByName(t)}}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(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"),require("react-dom")):"function"==typeof define&&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","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactCharts={},e.React,e.PropTypes,e.KendoReactIntl,e.KendoCharts,e.KendoReactCommon,e.KendoReactPopup,e.KendoReactLayout,e.KendoSvgIcons,e.ReactDOM)}(this,(function(e,t,r,s,n,a,i,o,l,c){"use strict";function h(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var p=h(t),d=h(c);function u(e,t){let r=e;for(;r&&r!==t;)r=r.parentNode;return!!r}function m(e,t,r,s){const n=e[t];if(n&&Array.isArray(n))for(const e of n)if(!e.type||e.type!==s)return new Error(`${r} children should be Array of type ${s.displayName}.`);return null}const y=e=>void 0!==e&&!e;let g=class{constructor(e){this.target=e}},v=class extends g{constructor(e,t){super(t),this.axis=e.axis,this.dataItem=e.dataItem,this.index=e.index,this.text=e.text,this.value=e.value}},C=class extends g{constructor(){super(...arguments),this.prevented=!1}preventDefault(){this.prevented=!0}isDefaultPrevented(){return this.prevented}},b=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},f=class extends g{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},x=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},E=class extends g{constructor(e,t){super(t),this.value=e.value,this.point=e.point,this.series=e.series,this.currentState=e.currentState,this.nextState=e.nextState}},S=class extends C{constructor(e,t){super(t),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}},I=class extends C{constructor(e,t){super(t),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}},N=class extends g{constructor(e,t){super(t),this.from=e.from,this.to=e.to}},_=class extends g{constructor(e,t){super(t),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}},k=class extends g{constructor(e,t){super(t),this.category=e.category,this.dataItem=e.dataItem,this.series=e.series,this.value=e.value,this.visual=e.visual}},T=class extends g{constructor(e,t){super(t),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}},w=class extends g{constructor(e,t){super(t),this.category=e.category,this.nativeEvent=e.originalEvent,this.value=e.value,this.x=e.x,this.y=e.y}},K=class extends g{constructor(e,t){super(t)}},A=class extends C{constructor(e,t){super(t),this.axis=e.axis,this.from=e.from,this.to=e.to}},O=class extends g{constructor(e,t){super(t),this.axis=e.axis,this.from=e.from,this.to=e.to}},L=class extends C{constructor(e,t){super(t),this.axis=e.axis,this.from=e.from,this.to=e.to}},D=class extends g{constructor(e,t){super(t),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}},R=class extends C{constructor(e,t){super(t),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}},P=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.delta=e.delta,this.nativeEvent=e.originalEvent}},F=class extends g{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}},V=class extends C{constructor(e,t){super(t),this.axisRanges=e.axisRanges,this.nativeEvent=e.originalEvent}};const M={axisLabelClick:v,drag:b,dragEnd:f,dragStart:x,drilldownEvent:E,legendItemHover:S,legendItemClick:I,legendItemLeave:class extends C{constructor(e,t){super(t),this.series=e.series,this.seriesIndex=e.seriesIndex,this.pointIndex=e.pointIndex,this.text=e.text}preventDefault(){super.preventDefault()}},navigatorFilter:N,noteClick:_,noteHover:k,plotAreaClick:T,plotAreaHover:w,render:K,select:A,selectEnd:O,selectStart:L,seriesClick:D,seriesHover:R,zoom:P,zoomEnd:F,zoomStart:V};let H=class{constructor(e,t){this.sender=e,this.syntheticEvent=t}};function j(e,t){return new H(e,t)}const U=e=>{let t,r,s=[];const n=n=>{t=e(t,n),a.canUseDOM&&(window.clearTimeout(r),r=window.setTimeout((()=>s.forEach((e=>e()))),16.666666666666668))};return n({}),{getState:()=>t,dispatch:n,subscribe:e=>(s.push(e),()=>s=s.filter((t=>t!==e)))}},z=(e,t)=>t.chartCollectionIdxKey?W.collectionConfigurationItem(e,t):t.chartKey?W.configurationItem(e,t):{},q=(e,t)=>{if(!t.type)return{};switch(t.type){case"set":return W.themeItem(e,t);case"push":return Object.assign(e,t.payload);default:return e}},B=(e,t)=>{if(!t.type)return[];switch(t.type){case"add":return[...e,t.payload];case"remove":return e.filter((e=>e!==t.payload));default:return e}},W={configurationItem:(e,t)=>Object.assign(e,{[t.chartKey]:t.payload}),collectionConfigurationItem(e,t){let r=!1;const[s,n]=t.chartCollectionIdxKey.split("_"),a=e[s].map(((e,s)=>parseInt(n,10)===s?(r=!0,t.payload):e));return!1===r&&a.splice(parseInt(n,10),0,t.payload),Object.assign(e,{[s]:a})},themeItem(e,t){let r={};const s=Object.assign(r,e),{field:n,value:a}=t.payload,i=n.split(".");let o=i.shift();for(;i.length>0;)r=r[o]=r[o]||{},o=i.shift();return r[o]=a,s}};let X=class{constructor(e,t){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||t}get formattedValue(){return this.format?this.point.formatValue(this.format):String(this.value)}};const Y=e=>{const{categoryText:t,colorMarker:r,colspan:s,nameColumn:n,points:a}=e;return p.createElement("table",null,p.createElement("thead",null,p.createElement("tr",null,p.createElement("th",{colSpan:s},t))),p.createElement("tbody",null,a.map(((e,t)=>p.createElement("tr",{key:t},r&&p.createElement("td",null,p.createElement("span",{className:"k-chart-shared-tooltip-marker",style:{backgroundColor:e.series.color}})),n&&p.createElement("td",null,e.series.name),p.createElement("td",{dangerouslySetInnerHTML:{__html:e.formattedValue}}))))))},$=p.createContext(null);$.displayName="ChartContext";const Z={horizontal:"fit",vertical:"fit"},G="k-chart-tooltip",J=class extends p.Component{constructor(e){super(e),this.context=null,this.element=null,this.onChartMouseLeave=e=>{const{syntheticEvent:t}=e;return!!u(t.relatedTarget,this.element)},this.onMouseLeave=e=>{const t=j(this,e);this.context.childrenObserver.trigger("onMouseLeave",t)&&e.preventDefault()},this.popupRef=e=>{this.element=e;const t=e&&e.closest(".k-animation-container");t&&(t.style.transition="initial")},this.chartObserver=new n.InstanceObserver(this,{onMouseLeave:"onChartMouseLeave"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupShown:e,popupAlign:t,popupOffset:r,popupStyles:s,popupContent:n,className:a}=this.props,o=[G,a].join(" ").trim();return p.createElement(i.Popup,{animate:!1,popupAlign:t,offset:r,show:e,collision:Z,className:"k-chart-tooltip-wrapper"},p.createElement("div",{className:o,style:s,onMouseLeave:this.onMouseLeave,ref:this.popupRef},n()))}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}};J.contextType=$;let Q=J;const ee=class extends p.Component{constructor(){super(...arguments),this.context=null,this.state={popupShown:!1},this.chartObserver=null}componentDidMount(){this.chartObserver=new n.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"}),this.context.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContext:e,shared:t,className:r,...s}=this.state,n=this.state.popupShown?()=>{const r=this.findRenderFunction();if(t)return null!==r?r(e):p.createElement(Y,{...e});const s=e.point,n=this.findRenderFunctionByIndex(s.series.index);return null!==n?n(e):null!==r?r(e):p.createElement("span",{dangerouslySetInnerHTML:{__html:e.point.formattedValue}})}:Function.prototype,i=a.classNames({"k-chart-shared-tooltip":t,"k-chart-tooltip-inverse":!!r});return p.createElement(Q,{...s,popupContent:n,className:i})}componentWillUnmount(){this.context.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:t,style:r,shared:s,className:n,crosshair:a}=e;let i;a||(i=s?this.createSharedTooltipContext(e):this.createTooltipContext(e),this.setState({popupShown:!0,popupAlign:t.align,popupOffset:t.point,popupContext:i,popupStyles:r,className:n,shared:s}))}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}createSharedTooltipContext(e){const{points:t,categoryText:r}=e,s=t.filter((e=>void 0!==e.series.name)).length>0,n=e.series.length>1;let a=1;return s&&a++,n&&a++,{categoryText:r,colorMarker:n,colspan:a,nameColumn:s,points:e.points.map((t=>new X(t,e.format)))}}createTooltipContext(e){const{point:t,format:r}=e;return{point:new X(t,r)}}findRenderFunctionByIndex(e){const t=this.context.optionsStore.getState().series;return void 0!==t&&Array.isArray(t)&&void 0!==t[e]&&t[e].hasOwnProperty("tooltip")&&t[e].tooltip.hasOwnProperty("render")?t[e].tooltip.render:null}findRenderFunction(){const e=this.context.optionsStore.getState().tooltip;return void 0!==e&&e.hasOwnProperty("render")?e.render:null}};ee.contextType=$;let te=ee;const re=e=>e.children;re.displayName="Container";const se=class extends p.Component{constructor(e){super(e),this.context=null,this.state={popupShown:!1},this.chartObserver=new n.InstanceObserver(this,{showTooltip:"onShowTooltip",hideTooltip:"onHideTooltip"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{popupContend:e,className:t,...r}=this.state,s=this.state.popupShown?()=>e:Function.prototype,n=a.classNames({"k-chart-crosshair-tooltip":!0,"k-chart-tooltip-inverse":!!t});return p.createElement(Q,{...r,popupContent:s,className:n})}componentWillUnmount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"remove",payload:this.chartObserver})}onShowTooltip(e){const{anchor:t,style:r,className:s,crosshair:n,axisName:a,axisIndex:i,value:o}=e,{name:l,index:c}=this.props;n&&a===l&&i===c&&this.setState({popupShown:!0,popupAlign:t.align,popupOffset:t.point,popupContend:o,popupStyles:r,className:s})}onHideTooltip(){this.setState({popupShown:!1,popupStyles:{},className:void 0})}};se.contextType=$;let ne=se;const ae=["categoryAxis","valueAxis","xAxis","yAxis"];function ie(e){const t={};for(let r=0;r<ae.length;r++){const s=oe(e,ae[r]);for(let e=0;e<s.length;e++){const r=s[e];t[r.name+r.index]=r}}return t}function oe(e,t){const r=[];if(e[t]){const s=[].concat(e[t]);for(let e=0;e<s.length;e++){const n=(s[e].crosshair||{}).tooltip;n&&n.visible&&r.push({index:e,name:t})}}return r}const le=class extends p.Component{constructor(){super(...arguments),this.context=null,this.state={tooltips:{}},this.storeUnsubscriber=Function.prototype,this.subscriber=()=>{var e;this.setState({tooltips:ie(null==(e=this.context)?void 0:e.optionsStore.getState())})}}componentDidMount(){this.storeUnsubscriber=this.context.optionsStore.subscribe(this.subscriber)}render(){const{tooltips:e}=this.state,t=Object.keys(e).map((t=>p.createElement(ne,{...e[t],key:t})));return p.createElement(re,null,t)}componentWillUnmount(){this.storeUnsubscriber()}};le.contextType=$;let ce=le;const he=Object.freeze({name:"@progress/kendo-react-charts",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"12.3.0-develop.6",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),pe=class extends p.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=e=>{null!==this.chartInstance&&(this.surface=e.sender.surface,this.trigger("render",e))},this.onDrilldown=e=>{var t;const{series:r}=this.optionsStore.getState(),s=r.find((t=>t.name===e.series.name));if(s.drilldownSeriesFactory){const r="onDrilldown";if(this.props.hasOwnProperty(r)){const n={seriesName:s.name,drilldownValue:e.value},a=[...(null==(t=this.props.drilldownState)?void 0:t.steps)||[],n],i=this.props.getTarget(),o={...e,currentState:this.props.drilldownState,nextState:{steps:a}},l=new E(o,i);this.props[r].call(void 0,l)}}return!0},this.onLegendItemClick=e=>{if(null!==this.chartInstance)if(this.props.onLegendItemClick)this.trigger("legendItemClick",e);else{const{series:t}=this.optionsStore.getState();if(!t)return;let r={};const{seriesIndex:s,pointIndex:n}=e,a=t[s];if(void 0===n)r=Object.assign({},a,{visible:y(a.visible)});else{const e=a.pointVisibility=a.pointVisibility||[];e[n]=y(e[n]),r=Object.assign({},a)}this.optionsStore.dispatch({chartCollectionIdxKey:`series_${s}`,payload:r}),this.suppressTransitions=!0}},this.onWindowResize=()=>{null!==this.chartInstance&&this.chartInstance.resize()},this.onChartMouseLeave=e=>{const t=j(this,e);this.triggerDomEvent("onMouseLeave",t)?e.preventDefault():null!==this.chartInstance&&this.chartInstance.hideElements()},this.onChildMouseLeave=e=>{const{syntheticEvent:t}=e;return this.chartInstance&&!u(t.relatedTarget,this.element)&&this.chartInstance.hideElements(),!1},this.showLicenseWatermark=!a.validatePackage(he,{component:"Chart"}),this.licenseMessage=a.getLicenseMessage(he),this.optionsStore=U(z),this.observersStore=U(B),this.childrenObserver=new n.InstanceObserver(this,{onMouseLeave:"onChildMouseLeave"}),this.state={optionsStore:this.optionsStore,observersStore:this.observersStore,childrenObserver:this.childrenObserver,drilldownState:{steps:[]}},this.themeStore=U(q),this.chartObserver=new n.InstanceObserver(this,{render:"onRender",legendItemClick:"onLegendItemClick",drilldown:"onDrilldown",styleChanged:"onStyleChanged"})}get element(){return this._element}static getDerivedStateFromProps(e,t){return{...t,drilldownState:e.drilldownState||[]}}componentDidMount(){this._element&&(this.readTheme(),this.instantiateCoreChart()),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(),null!==this.chartInstance&&(this.chartInstance.destroy(),this.chartInstance=null),window.removeEventListener("resize",this.onWindowResize)}componentDidUpdate(e){const{dir:t,children:r,...n}=this.props;if(null!==this.chartInstance){const r=s.provideIntlService(this),a=this.chartInstance.chartService,i=r.locale!==a._intlService.locale,o=Object.entries(e).filter((e=>"dir"!==e[0]&&"children"!==e[0])).some((e=>{const[t,r]=e;return!(n.hasOwnProperty(t)&&n[t]===r)}));i&&(this.chartInstance.chartService._intlService=r,this.chartInstance.chartService.format._intlService=r,o||this.chartInstance.noTransitionsRedraw()),o&&this.refresh(),e.dir!==t&&this.chartInstance.setDirection(this.getDirection(t))}}render(){const{style:e={},className:t,wrapper:r,children:s}=this.props,n=Object.assign({},e,{position:"relative"}),i=p.createElement(r,{className:t,style:n,key:"chartElement"},p.createElement("div",{onMouseLeave:this.onChartMouseLeave,ref:e=>{this._element=e},className:"k-chart-surface"},s),p.createElement(p.Fragment,null,this.showLicenseWatermark&&p.createElement(a.WatermarkOverlay,{message:this.licenseMessage})));return p.createElement($.Provider,{value:this.state},p.createElement(te,{key:"seriesTooltip"}),p.createElement(ce,{key:"crosshairTooltips"}),i)}getDirection(e){return"rtl"===(void 0!==e?e:a.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")}getChartOptions(){const{renderAs:e,pannable:t,zoomable:r,paneDefaults:s,panes:n,transitions:a,seriesColors:i,seriesDefaults:o,axisDefaults:l,observeStyles:c,deriveOptionsFromParent:h}=this.props;let p={};return void 0!==e&&(p.renderAs=e),void 0!==t&&(p.pannable=t),void 0!==r&&(p.zoomable=r),void 0!==s&&(p.paneDefaults=s),void 0!==n&&(p.panes=n),void 0!==a&&(p.transitions=a),void 0!==i&&(p.seriesColors=i),void 0!==o&&(p.seriesDefaults=o),void 0!==l&&(p.axisDefaults=l),p.observeStyles=void 0===c||c,p=Object.assign(p,this.optionsStore.getState()),h&&(p=h(p)),p}refresh(){if(null!==this.chartInstance){const e=this.themeStore.getState(),t=this.getChartOptions(),r=t.transitions;this.suppressTransitions&&(t.transitions=!1),this.props.onRefresh?this.props.onRefresh.call(void 0,t,e,this.chartInstance):this.chartInstance.setOptions(t,e),this.suppressTransitions&&(t.transitions=r,this.suppressTransitions=!1)}}instantiateCoreChart(){const{dir:e,chartConstructor:t}=this.props,r=this.getChartOptions();this.chartInstance=new t(this.element,r,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:s.provideIntlService(this),observer:this.chartObserver,sender:this})}trigger(e,t){const r=function(e,t,r){if(M[e])return new M[e](t,r)}(e,t,this.props.getTarget()),s="on"+e.charAt(0).toUpperCase()+e.slice(1),n=this.observersStore.getState();let a=!1;for(let r=0;r<n.length;r++)n[r].trigger(e,t)&&(a=!0);return!1===a&&r&&this.props.hasOwnProperty(s)?(this.props[s].call(void 0,r),r.isDefaultPrevented&&r.isDefaultPrevented()):a}requiresHandlers(e){for(let t=0;t<e.length;t++){const r=e[t],s="on"+r.charAt(0).toUpperCase()+r.slice(1);if(this.props.hasOwnProperty(s))return!0}return!1}triggerDomEvent(e,t){const r=this.observersStore.getState();let s=!1;for(let n=0;n<r.length;n++)r[n].trigger(e,t)&&(s=!0);return s}onStyleChanged(){this.suppressTransitions=!0,this.readTheme()}readTheme(){if(this._element){const e=n.chartTheme(this._element),t=n.deepExtend({},n.chartBaseTheme(),e);this.themeStore.dispatch({type:"push",payload:t})}}};pe.propTypes={dir:r.string,renderAs:r.oneOf(["svg","canvas"])},pe.defaultProps={renderAs:"svg"};let de=pe;s.registerForIntl(de);const ue=class extends p.Component{constructor(e){super(e),this.state={donutCenterStyles:null},this.chartObserver=new n.InstanceObserver(this,{render:"onRender"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.chartObserver})}render(){const{render:e}=this.props,{donutCenterStyles:t}=this.state;let r=null;return e&&t&&(r=p.createElement("div",{className:"k-chart-donut-center",style:t},p.createElement(e,null))),r}onRender(e){var t;const r=null==(t=this.context)?void 0:t.optionsStore.getState().series,s=Array.isArray(r)?r[0]:null,n=e.sender._plotArea.charts;if(!s||"donut"!==s.type||0===n[0].points.length)return;const a=n[0].points[0].sector,i=a.innerRadius,o=a.center.y-i,l=a.center.x-i,c=2*i;this.setState({donutCenterStyles:{height:c,left:l,top:o,width:c}})}};ue.contextType=$;let me=ue,ye=class extends p.Component{constructor(){super(...arguments),this._baseChart=null,this.getTarget=()=>this}get chartInstance(){return null!==this._baseChart?this._baseChart.chartInstance:null}get surface(){return null!==this._baseChart?this._baseChart.surface:null}get element(){return null!==this._baseChart?this._baseChart.element:null}render(){const{donutCenterRender:e,children:t,className:r,...s}=this.props;return p.createElement(de,{...s,ref:e=>{this._baseChart=e},chartConstructor:n.Chart,getTarget:this.getTarget,wrapper:"div",className:a.classNames("k-chart k-widget",r)},t,p.createElement(me,{render:e}))}},ge=class extends p.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const{type:t,data:r}=this.props,s=Object.assign({},e,{type:t,data:r});return n.Sparkline.normalizeOptions(s)},this.getTarget=()=>this}get chartInstance(){return null!==this._baseChart?this._baseChart.chartInstance:null}get surface(){return null!==this._baseChart?this._baseChart.surface:null}get element(){return null!==this._baseChart?this._baseChart.element:null}render(){const{children:e,type:t,className:r,...s}=this.props;return p.createElement(de,{...s,ref:e=>{this._baseChart=e},chartConstructor:n.Sparkline,getTarget:this.getTarget,wrapper:"span",deriveOptionsFromParent:this.deriveOptionsFromParent,className:a.classNames("k-sparkline k-widget",r)},e)}};const ve={autoBindElements:!0,liveDrag:!1,partialRedraw:!0};let Ce=class extends p.Component{constructor(){super(...arguments),this._baseChart=null,this.deriveOptionsFromParent=e=>{const t=Object.assign({},e.navigator||{},ve);return Object.assign({},e,{navigator:t})},this.onRefresh=(e,t,r)=>{this.props.partialRedraw?(r.applyOptions(e),r.bindCategories(),r.navigator.redrawSlaves()):r.setOptions(e,t)},this.getTarget=()=>this}get chartInstance(){return null!==this._baseChart?this._baseChart.chartInstance:null}get surface(){return null!==this._baseChart?this._baseChart.surface:null}get element(){return null!==this._baseChart?this._baseChart.element:null}render(){const{children:e,className:t,...r}=this.props;return p.createElement(de,{...r,ref:e=>{this._baseChart=e},chartConstructor:n.StockChart,getTarget:this.getTarget,wrapper:"div",deriveOptionsFromParent:this.deriveOptionsFromParent,onRefresh:this.onRefresh,className:a.classNames("k-chart k-stockchart",t)},e)}};const be=class extends p.Component{get optionsStore(){var e;return null==(e=this.context)?void 0:e.optionsStore}renderChildren(e,t){const{children:r}=e.props,{_chartKey:s,_parentStore:n}=this.props,a={...e.props,_chartCollectionIdxKey:`${s}_${t}`,_parentStore:n};return p.cloneElement(e,a,r)}render(){const{_chartKey:e,_parentStore:t,children:r}=this.props;return(t||this.optionsStore).dispatch({chartKey:e,payload:[]}),p.Children.map(r,((e,t)=>p.isValidElement(e)?this.renderChildren(e,t):e))}};be.contextType=$;let fe=be;const xe=class extends p.Component{get optionsStore(){var e;return null==(e=this.context)?void 0:e.optionsStore}constructor(e){super(e),this.childStore=U(z)}render(){const{children:e}=this.props;return void 0!==e?p.Children.map(e,(e=>p.isValidElement(e)?this.renderChildren(e):e)):null}componentDidMount(){this.dispatch()}componentDidUpdate(){this.dispatch()}dispatch(){const{_chartKey:e,_chartCollectionIdxKey:t,_parentStore:r,children:s,...n}=this.props;(r||this.optionsStore).dispatch({chartKey:e,chartCollectionIdxKey:t,payload:Object.assign({},n,this.childStore.getState())})}renderChildren(e){const{children:t}=e.props,r={...e.props,_parentStore:this.childStore};return p.cloneElement(e,r,t)}};xe.contextType=$;let Ee=xe,Se=class{constructor(e){this.currentState=e.currentState,this.nextState=e.nextState}};const Ie=p.forwardRef(((e,t)=>{const r=p.useRef(null),s=p.useRef(null),n={valueField:_e.valueField,textField:_e.textField,iconField:_e.iconField,iconClassField:_e.iconClassField,...e};p.useImperativeHandle(r,(()=>({element:s.current,props:n}))),p.useImperativeHandle(t,(()=>r.current));let i=[{id:"0",...e.rootItem||{text:"Home",icon:p.createElement(a.SvgIcon,{icon:l.homeIcon,style:{marginInlineEnd:"4px"}})}}];e.drilldownState&&(i=[...i,...e.drilldownState.steps.map(((e,t)=>({id:(t+1).toString(),text:e.drilldownValue})))]);const c={...n,data:i};return p.createElement("div",null,p.createElement(o.Breadcrumb,{...c,onItemSelect:t=>{var r;const s="onDrilldownStateChange";if(e.hasOwnProperty(s)){const n=i.findIndex((e=>e.id===t.id)),a={steps:((null==(r=e.drilldownState)?void 0:r.steps)||[]).slice(0,n)},o=new Se({currentState:e.drilldownState,nextState:a});e[s].call(void 0,o)}}}))})),Ne={id:r.string,style:r.object,className:r.string,breadcrumbOrderedList:r.elementType,breadcrumbListItem:r.elementType,breadcrumbDelimiter:r.elementType,breadcrumbLink:r.elementType,dir:r.oneOf(["ltr","rtl"]),disabled:r.bool,valueField:r.string,textField:r.string,iconField:r.string,iconClassField:r.string,onItemSelect:r.func,ariaLabel:r.string,onDrilldownStateChange:r.func,drilldownState:r.shape({steps:r.array}),rootItem:r.object},_e={valueField:"id",textField:"text",iconField:"icon",iconClassField:"iconClass",data:[]};Ie.displayName="KendoReactChartBreadcrumb",Ie.propTypes=Ne;const ke="charts.nodata",Te={[ke]:"No data available."},we=e=>{const t=s.useLocalization();return p.createElement("div",{className:a.classNames("k-chart-overlay",e.className),style:{display:"none",...e.style}},p.createElement("div",{className:"k-no-data"},void 0===e.children?t.toLanguageString(ke,Te[ke]):e.children))};we.displayName="ChartNoDataOverlay";const Ke=e=>p.createElement(Ee,{...e,_chartKey:"title"});Ke.displayName="ChartAxisDefaultsTitle";const Ae=e=>p.createElement(Ee,{...e,_chartKey:"labels"});Ae.displayName="ChartAxisDefaultsLabels";const Oe=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"});Oe.displayName="ChartAxisDefaultsCrosshair";const Le=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"});Le.displayName="ChartAxisDefaultsCrosshairTooltip";const De=e=>p.createElement(Ee,{...e,_chartKey:"title"});De.displayName="ChartCategoryAxisTitle";const Re=e=>p.createElement(Ee,{...e,_chartKey:"title"});Re.displayName="ChartPaneDefaultsTitle";const Pe=e=>p.createElement(Ee,{...e,_chartKey:"item"});Pe.displayName="ChartLegendItem";const Fe=e=>p.createElement(Ee,{...e,_chartKey:"title"});Fe.displayName="ChartLegendTitle";const Ve=e=>p.createElement(Ee,{...e,_chartKey:"inactiveItems"});Ve.displayName="ChartLegendInactiveItems";const Me=e=>p.createElement(Ee,{...e,_chartKey:"title"});Me.displayName="ChartValueAxisTitle";const He=e=>p.createElement(Ee,{...e,_chartKey:"title"});He.displayName="ChartXAxisTitle";const je=e=>p.createElement(Ee,{...e,_chartKey:"title"});je.displayName="ChartYAxisTitle";const Ue=e=>p.createElement(Ee,{...e,_chartKey:"title"});Ue.displayName="ChartNavigatorPaneTitle";const ze=e=>p.createElement(Ee,{...e,_chartKey:"categoryAxis"});ze.displayName="ChartNavigatorCategoryAxis";const qe=e=>p.createElement(Ee,{...e,_chartKey:"pane"});qe.displayName="ChartNavigatorPane";const Be=e=>p.createElement(Ee,{...e});Be.displayName="ChartNavigatorSeriesItem";const We=e=>p.createElement(fe,{...e,_chartKey:"series"});We.propTypes={children:function(e,t,r){return m(e,t,r,Be)}};const Xe=e=>p.createElement(Ee,{...e,_chartKey:"chartArea"});Xe.displayName="ChartArea";const Ye=e=>p.createElement(Ee,{...e});Ye.displayName="ChartCategoryAxisItem";const $e=e=>p.createElement(fe,{...e,_chartKey:"categoryAxis"});$e.propTypes={children:function(e,t,r){return m(e,t,r,Ye)}},$e.displayName="ChartCategoryAxis";const Ze=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"legend"});Ze.displayName="ChartLegend";const Ge=e=>p.createElement(Ee,{visible:!0,position:"bottom",...e,_chartKey:"navigator"});Ge.displayName="ChartNavigator";const Je=e=>p.createElement(Ee,{...e});Je.displayName="ChartPane";const Qe=e=>p.createElement(Ee,{...e,_chartKey:"paneDefaults"});Qe.displayName="ChartPaneDefaults";const et=e=>p.createElement(fe,{...e,_chartKey:"panes"});et.propTypes={children:function(e,t,r){return m(e,t,r,Je)}};const tt=e=>{let t=e=>p.createElement(p.Fragment,null);e.drilldownSeriesFactory&&(t=e.drilldownSeriesFactory);const r=t=>{var r,s;return t&&(null==(s=null==(r=t.drilldownState)?void 0:r.steps)?void 0:s.find((({seriesName:t})=>t===e.name)))};return p.createElement($.Consumer,null,(s=>r(s)?p.createElement(t,{_chartCollectionIdxKey:e._chartCollectionIdxKey,drilldownValue:r(s).drilldownValue}):p.createElement(Ee,{...e})))};tt.displayName="ChartSeriesItem";const rt=e=>p.createElement(fe,{...e,_chartKey:"series"});rt.propTypes={children:function(e,t,r){return m(e,t,r,tt)}},rt.displayName="ChartSeries";const st=e=>p.createElement(Ee,{...e,_chartKey:"subtitle"});st.displayName="ChartSubtitle";const nt=e=>p.createElement(Ee,{...e,_chartKey:"title"});nt.displayName="ChartTitle";const at=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"});at.displayName="ChartTooltip";const it=e=>p.createElement(Ee,{...e});it.displayName="ChartValueAxisItem";const ot=e=>p.createElement(fe,{...e,_chartKey:"valueAxis"});ot.propTypes={children:function(e,t,r){return m(e,t,r,it)}},ot.displayName="ChartValueAxis";const lt=e=>p.createElement(Ee,{...e});lt.displayName="ChartXAxisItem";const ct=e=>p.createElement(fe,{...e,_chartKey:"xAxis"});ct.prototype={children:function(e,t,r){return m(e,t,r,lt)}},ct.displayName="ChartXAxis";const ht=e=>p.createElement(Ee,{...e});ht.displayName="ChartYAxisItem";const pt=e=>p.createElement(fe,{...e,_chartKey:"yAxis"});pt.propTypes={children:function(e,t,r){return m(e,t,r,ht)}},pt.displayName="ChartYAxis";const dt=r.exact({left:r.number,top:r.number}),ut={left:r.number,right:r.number},mt={...ut,top:r.number,bottom:r.number},yt=r.oneOfType([r.number,r.exact(mt)]),gt=yt,vt=r.exact({width:r.number,color:r.string,opacity:r.number,dashType:r.string}),Ct={visible:r.bool,font:r.string,color:r.string,opacity:r.number,align:r.oneOf(["left","right","center"]),position:r.oneOf(["inside","before","after"]),padding:gt,margin:r.exact(ut),border:vt,offset:dt},bt={color:r.string,opacity:r.number,offset:dt,padding:r.number,width:r.number,focusHighlight:r.exact({border:vt})},ft={colorType:r.oneOf(["static","source","target"]),color:r.string,opacity:r.number,highlight:r.exact({opacity:r.number,inactiveOpacity:r.number}),focusHighlight:r.exact({border:vt})},xt=r.exact({text:r.string,...Ct}),Et=r.exact({id:r.oneOfType([r.string,r.number]).isRequired,label:xt.isRequired,...bt}),St=r.exact({sourceId:r.oneOfType([r.string,r.number]).isRequired,targetId:r.oneOfType([r.string,r.number]).isRequired,value:r.number.isRequired,...ft}),It={data:r.exact({nodes:r.arrayOf(Et.isRequired).isRequired,links:r.arrayOf(St.isRequired).isRequired}).isRequired,links:r.exact(ft),nodes:r.exact(bt),labels:r.exact(Ct),legend:r.exact({align:r.oneOf(["start","center","end"]),background:r.string,border:vt,height:r.number,labels:r.object,margin:yt,offsetX:r.number,offsetY:r.number,orientation:r.oneOf(["vertical","horizontal"]),padding:gt,position:r.oneOf(["top","bottom","left","right","custom"]),reverse:r.bool,visible:r.bool,width:r.number,item:r.object,title:r.object}),title:r.exact({align:r.oneOf(["center","left","right"]),background:r.string,border:vt,color:r.string,font:r.string,margin:yt,padding:gt,position:r.oneOf(["top","bottom"]),text:r.string,visible:r.bool}),tooltip:r.exact({visible:r.bool,appendTo:r.any,offset:r.number,followPointer:r.bool,delay:r.number,linkComponent:r.any,nodeComponent:r.any}),className:r.string,style:r.object,dir:r.string,disableAutoLayout:r.bool,disableKeyboardNavigation:r.bool,onNodeEnter:r.func,onNodeLeave:r.func,onLinkEnter:r.func,onLinkLeave:r.func,onNodeClick:r.func,onLinkClick:r.func},Nt="sankey.tooltipUnitFormat",_t={[Nt]:"({0} units)"},kt=e=>{const{appendTo:t,Content:r,dir:s,offset:n,event:{tooltipData:a,dataItem:i,nodeValue:o}}=e,l=p.useRef(null);p.useEffect((()=>{const e=l.current;if(!a||!e)return;const t=e.offsetWidth,r=e.offsetHeight,s={...a.popupOffset},i=a.popupAlign;s.left+="left"===i.horizontal?n:-1*n,"right"===i.horizontal&&(s.left-=t),"bottom"===i.vertical?s.top-=r+n:s.top+=n,e.style.left=`${s.left}px`,e.style.top=`${s.top}px`,e.style.visibility=""}),[a,n]);const c=p.createElement("div",{ref:l,style:{visibility:"hidden"},dir:s,className:"k-tooltip k-sankey-tooltip k-chart-tooltip k-chart-shared-tooltip"},p.createElement("div",{className:"k-tooltip-content"},p.createElement(r,{dir:s,dataItem:i,nodeValue:o})));return t?d.createPortal(c,t):c},Tt={display:"flex",alignItems:"center"},wt=e=>p.createElement("div",{style:{width:15,height:15,backgroundColor:e.color,display:"inline-flex",marginLeft:3}}),Kt=e=>p.createElement("span",{style:{margin:"0 3px"}},e.children),At=e=>s.useInternationalization().format(s.useLocalization().toLanguageString(Nt,_t[Nt]),[e||0]),Ot=e=>{const{color:t,label:r}=e.dataItem;return p.createElement("div",{style:Tt,className:"k-tooltip-content"},p.createElement(wt,{color:t}),p.createElement(Kt,null,r.text),p.createElement(Kt,null,At(e.nodeValue)))},Lt=e=>{const{source:t,target:r,value:s}=e.dataItem,n="rtl"===e.dir?l.arrowLeftIcon:l.arrowRightIcon;return p.createElement("div",{style:Tt},p.createElement(wt,{color:t.color}),p.createElement(Kt,null,t.label.text),p.createElement(a.IconWrap,{icon:n,name:n.name}),p.createElement(wt,{color:r.color}),p.createElement(Kt,null,r.label.text),p.createElement(Kt,null,At(s)))},Dt=12,Rt={offset:Dt,visible:!0},Pt=["nodeEnter","nodeLeave","linkEnter","linkLeave","nodeClick","linkClick"],Ft=p.forwardRef(((e,t)=>{const r=!a.validatePackage(he,{component:"Sankey"}),s=a.getLicenseMessage(he),i=p.useRef(null),o=p.useRef(null),l=a.useRtl(i,e.dir,[e.dir,i.current]),c=p.useRef(null),h=a.useDocument(i),{data:d,links:u,nodes:m,labels:y,title:g,legend:v,tooltip:C=Rt,disableAutoLayout:b,disableKeyboardNavigation:f}=e,x=p.useRef(void 0);x.current=e;const[E,S]=p.useState(null),I=p.useCallback((e=>{const{visible:t,appendTo:r=h().body,offset:s=Dt,nodeComponent:n=Ot,linkComponent:a=Lt}={...Rt,...C};if(t){const t={appendTo:r,event:e,offset:s,dir:l,Content:"node"===e.targetType?n:a};S(t)}}),[C,l,h]),N=p.useCallback((()=>{S(null)}),[]),_=p.useCallback(((e,t)=>{const r=x.current[e];if(r){const e={...t,nativeEvent:t.originalEvent,target:c.current};r.call(void 0,e)}}),[]);return p.useEffect((()=>{const e={data:d,links:u,nodes:m,labels:y,title:g,legend:v,disableAutoLayout:b,disableKeyboardNavigation:f,rtl:"rtl"===l,tooltip:{...Rt,...C}};if(o.current)o.current.setOptions(e);else if(a.canUseDOM&&i.current){const t=n.sankeyTheme(i.current);o.current=new n.Sankey(i.current,e,t),((e,t)=>{e&&(e.unbind(),Pt.forEach((r=>{t[r]&&e.bind(r,t[r])})))})(o.current,{nodeEnter:e=>{_("onNodeEnter",e)},nodeLeave:e=>{_("onNodeLeave",e)},linkEnter:e=>{_("onLinkEnter",e)},linkLeave:e=>{_("onLinkLeave",e)},nodeClick:e=>{_("onNodeClick",e)},linkClick:e=>{_("onLinkClick",e)}}),o.current.bind("tooltipShow",I),o.current.bind("tooltipHide",N)}return()=>{o.current&&(o.current.destroy(),o.current=null)}}),[d,u,m,y,g,v,b,f,l,C,N,I,_]),p.useImperativeHandle(c,(()=>({get element(){return i.current},exportVisual:e=>o.current.exportVisual(e),props:e})),[]),p.useImperativeHandle(t,(()=>c.current)),p.createElement(p.Fragment,null,p.createElement("div",{ref:i,className:e.className,style:e.style,dir:l}),E&&p.createElement(kt,{...E}),r&&p.createElement(a.WatermarkOverlay,{message:s}))}));Ft.propTypes=It,Ft.displayName="KendoReactSankey";const Vt=n.createSankeyData;e.AxisLabelClickEvent=v,e.Chart=ye,e.ChartArea=Xe,e.ChartAxisDefaults=e=>p.createElement(Ee,{...e,_chartKey:"axisDefaults"}),e.ChartAxisDefaultsCrosshair=Oe,e.ChartAxisDefaultsCrosshairTooltip=Le,e.ChartAxisDefaultsLabels=Ae,e.ChartAxisDefaultsTitle=Ke,e.ChartBreadcrumb=Ie,e.ChartCategoryAxis=$e,e.ChartCategoryAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartCategoryAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartCategoryAxisItem=Ye,e.ChartCategoryAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartCategoryAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartCategoryAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartCategoryAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartCategoryAxisRangeLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"rangeLabels"}),e.ChartCategoryAxisTitle=De,e.ChartLegend=Ze,e.ChartLegendInactiveItems=Ve,e.ChartLegendItem=Pe,e.ChartLegendTitle=Fe,e.ChartNavigator=Ge,e.ChartNavigatorCategoryAxis=ze,e.ChartNavigatorHint=e=>p.createElement(Ee,{...e,_chartKey:"hint"}),e.ChartNavigatorPane=qe,e.ChartNavigatorPaneTitle=Ue,e.ChartNavigatorSelect=e=>p.createElement(Ee,{...e,_chartKey:"select"}),e.ChartNavigatorSeries=We,e.ChartNavigatorSeriesErrorBars=e=>p.createElement(Ee,{...e,_chartKey:"errorBars"}),e.ChartNavigatorSeriesExtremes=e=>p.createElement(Ee,{...e,_chartKey:"extremes"}),e.ChartNavigatorSeriesHighlight=e=>p.createElement(Ee,{...e,_chartKey:"highlight"}),e.ChartNavigatorSeriesItem=Be,e.ChartNavigatorSeriesItemOutliers=e=>p.createElement(Ee,{...e,_chartKey:"outliers"}),e.ChartNavigatorSeriesItemTooltip=e=>p.createElement(Ee,{...e,_chartKey:"tooltip"}),e.ChartNavigatorSeriesLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartNavigatorSeriesLabelsFrom=e=>p.createElement(Ee,{...e,_chartKey:"from"}),e.ChartNavigatorSeriesLabelsTo=e=>p.createElement(Ee,{...e,_chartKey:"to"}),e.ChartNavigatorSeriesMarkers=e=>p.createElement(Ee,{...e,_chartKey:"markers"}),e.ChartNavigatorSeriesNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartNavigatorSeriesNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartNavigatorSeriesNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartNoDataOverlay=we,e.ChartPane=Je,e.ChartPaneDefaults=Qe,e.ChartPaneDefaultsTitle=Re,e.ChartPanes=et,e.ChartPlotArea=e=>p.createElement(Ee,{...e,_chartKey:"plotArea"}),e.ChartSeries=rt,e.ChartSeriesDefaults=e=>p.createElement(Ee,{...e,_chartKey:"seriesDefaults"}),e.ChartSeriesErrorBars=e=>p.createElement(Ee,{...e,_chartKey:"errorBars"}),e.ChartSeriesExtremes=e=>p.createElement(Ee,{...e,_chartKey:"extremes"}),e.ChartSeriesHighlight=e=>p.createElement(Ee,{...e,_chartKey:"highlight"}),e.ChartSeriesItem=tt,e.ChartSeriesItemOutliers=e=>p.createElement(Ee,{...e,_chartKey:"outliers"}),e.ChartSeriesItemTooltip=e=>p.createElement(Ee,{...e,_chartKey:"tooltip"}),e.ChartSeriesLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartSeriesLabelsFrom=e=>p.createElement(Ee,{...e,_chartKey:"from"}),e.ChartSeriesLabelsTo=e=>p.createElement(Ee,{...e,_chartKey:"to"}),e.ChartSeriesMarkers=e=>p.createElement(Ee,{...e,_chartKey:"markers"}),e.ChartSeriesNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartSeriesNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartSeriesNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartSubtitle=st,e.ChartTitle=nt,e.ChartTooltip=at,e.ChartValueAxis=ot,e.ChartValueAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartValueAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartValueAxisItem=it,e.ChartValueAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartValueAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartValueAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartValueAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartValueAxisTitle=Me,e.ChartXAxis=ct,e.ChartXAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartXAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartXAxisItem=lt,e.ChartXAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartXAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartXAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartXAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartXAxisTitle=He,e.ChartYAxis=pt,e.ChartYAxisCrosshair=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"crosshair"}),e.ChartYAxisCrosshairTooltip=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"tooltip"}),e.ChartYAxisItem=ht,e.ChartYAxisLabels=e=>p.createElement(Ee,{visible:!0,...e,_chartKey:"labels"}),e.ChartYAxisNotes=e=>p.createElement(Ee,{...e,_chartKey:"notes"}),e.ChartYAxisNotesIcon=e=>p.createElement(Ee,{...e,_chartKey:"icon"}),e.ChartYAxisNotesLabel=e=>p.createElement(Ee,{...e,_chartKey:"label"}),e.ChartYAxisTitle=je,e.ChartZoomable=e=>p.createElement(Ee,{...e,_chartKey:"zoomable"}),e.CollectionConfigurationComponent=fe,e.ConfigurationComponent=Ee,e.CrosshairTooltip=ne,e.CrosshairTooltipContainer=ce,e.DonutCenter=me,e.DragEndEvent=f,e.DragEvent=b,e.DragStartEvent=x,e.DrilldownEvent=E,e.DrilldownStateChangeEvent=Se,e.LegendItemClickEvent=I,e.LegendItemHoverEvent=S,e.NavigatorFilterEvent=N,e.NoteClickEvent=_,e.NoteHoverEvent=k,e.PlotAreaClickEvent=T,e.PlotAreaHoverEvent=w,e.RenderEvent=K,e.Sankey=Ft,e.SelectEndEvent=O,e.SelectEvent=A,e.SelectStartEvent=L,e.SeriesClickEvent=D,e.SeriesHoverEvent=R,e.SeriesTooltip=te,e.SharedTooltipContent=Y,e.Sparkline=ge,e.StockChart=Ce,e.TooltipPoint=X,e.TooltipPopup=Q,e.ZoomEndEvent=F,e.ZoomEvent=P,e.ZoomStartEvent=V,e.createSankeyData=Vt,e.exportVisual=(e,t={})=>{if(e&&null!==e.chartInstance)return e.chartInstance.exportVisual(t)},e.findAxisByName=(e,t)=>{if(e&&null!==e.chartInstance)return e.chartInstance.findAxisByName(t)},e.findPaneByIndex=(e,t)=>{if(e&&null!==e.chartInstance)return e.chartInstance.findPaneByIndex(t)},e.findPaneByName=(e,t)=>{if(e&&null!==e.chartInstance)return e.chartInstance.findPaneByName(t)}}));

package/index.d.mts

@@ -641,6 +641,11 @@ declare interface BaseChartProps {
      * This option allows to override the default axis options.
      */
     axisDefaults?: AxisDefaults;
+    /**
+     * @hidden
+     * Defines whether the Chart automatically repaints when its styles are modified through CSS variables.
+     */
+    observeStyles?: boolean;
     /**
      * Fires when the user clicks an axis label.
      */

package/index.d.ts

@@ -641,6 +641,11 @@ declare interface BaseChartProps {
      * This option allows to override the default axis options.
      */
     axisDefaults?: AxisDefaults;
+    /**
+     * @hidden
+     * Defines whether the Chart automatically repaints when its styles are modified through CSS variables.
+     */
+    observeStyles?: boolean;
     /**
      * Fires when the user clicks an axis label.
      */

package/package-metadata.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-charts",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1762332856,version:"12.3.0-develop.5",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-charts",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1762344407,version:"12.3.0-develop.6",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;

package/package-metadata.mjs

@@ -10,8 +10,8 @@ const e = Object.freeze({
   productName: "KendoReact",
   productCode: "KENDOUIREACT",
   productCodes: ["KENDOUIREACT"],
-  publishDate: 1762332856,
-  version: "12.3.0-develop.5",
+  publishDate: 1762344407,
+  version: "12.3.0-develop.6",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
 });
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-charts",
-  "version": "12.3.0-develop.5",
+  "version": "12.3.0-develop.6",
   "description": "React Chart renders a wide range of high-quality data visualizations. KendoReact Charts package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -27,10 +27,10 @@
   "peerDependencies": {
     "@progress/kendo-drawing": "^1.21.2",
     "@progress/kendo-licensing": "^1.7.0",
-    "@progress/kendo-react-common": "12.3.0-develop.5",
-    "@progress/kendo-react-intl": "12.3.0-develop.5",
-    "@progress/kendo-react-layout": "12.3.0-develop.5",
-    "@progress/kendo-react-popup": "12.3.0-develop.5",
+    "@progress/kendo-react-common": "12.3.0-develop.6",
+    "@progress/kendo-react-intl": "12.3.0-develop.6",
+    "@progress/kendo-react-layout": "12.3.0-develop.6",
+    "@progress/kendo-react-popup": "12.3.0-develop.6",
     "@progress/kendo-svg-icons": "^4.0.0",
     "react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
     "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
@@ -79,7 +79,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1762332856,
+      "publishDate": 1762344407,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },