@progress/kendo-vue-charts
Version:
9 lines (8 loc) • 7.01 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("vue"),g=require("@progress/kendo-vue-intl"),m=require("@progress/kendo-charts"),c=require("@progress/kendo-vue-common"),l=require("./utils/main.js"),b=require("./events/chart-event-builder.js"),S=require("./events/dom-event.js"),O=require("./theming/theme-service.js"),C=require("./store/store.js"),d=require("./store/reducer.js"),I=require("./tooltip/Series.js"),y=require("./tooltip/CrosshairContainer.js"),u=require("./package-metadata.js"),k=h.defineComponent({name:"KendoBaseChart",props:{deriveOptionsFromParent:{type:Function,default:void 0},chartConstructor:{type:[Object,Function],default:void 0},className:String,chartStyle:Object,wrapper:String,getTarget:{type:Function,default:void 0},dataItems:{type:Array,default:void 0},dir:String,renderAs:{type:String,default:void 0,validator:function(e){return["svg","canvas"].includes(e)}},pannable:{type:[Boolean,Object],default:void 0},zoomable:{type:[Boolean,Object],default:void 0},seriesColors:{type:Array,default:void 0},transitions:{type:Boolean,default:!0},paneDefaults:{type:Object,default:void 0},panes:{type:Array,default:void 0},seriesDefaults:{type:Object,default:void 0},axisDefaults:{type:Object,default:void 0},allListeners:{type:Object,default:void 0},onLegenditemclick:Function,onBasechartevent:Function,onRefresh:Function},inject:{kendoIntlService:{default:null}},provide(){return{optionsState:this.optionsState,dispatchOptions:this.dispatchOptions,observersState:this.observersState,dispatchObservers:this.dispatchObservers,childrenObserver:this.childrenObserver,chartRefresh:this.refresh}},created(){this.chartInstance=null,this.element=null,this.suppressTransitions=!1,c.validatePackage(u.packageMetadata),this.showLicenseWatermark=c.shouldShowValidationUI(u.packageMetadata),this.licenseMessage=c.getLicenseMessage(u.packageMetadata),this.themeStore=C.default(d.themeReducer),this.chartObserver=new m.InstanceObserver(this,{render:"onRender",legendItemClick:"onLegendItemClick"})},data(){return{optionsState:{},observersState:[],childrenObserver:new m.InstanceObserver(this,{onMouseLeave:"onChildMouseLeave"}),showLicenseWatermark:!1,licenseMessage:void 0}},mounted(){this.element=c.getRef(this,"element"),O.loadTheme(this.themeStore,this.instantiateCoreChart,this.element),window.addEventListener("resize",this.onWindowResize)},unmounted(){this.onDestroyed()},updated(){if(this.chartInstance!==null){const e=g.provideIntlService(this),t=this.chartInstance.chartService;e.locale!==t._intlService.locale&&(this.chartInstance.chartService._intlService=e,this.chartInstance.chartService.format._intlService=e,this.chartInstance.noTransitionsRedraw()),this.refresh()}},render(){const e=c.getDefaultSlots(this),{chartStyle:t={},className:s,wrapper:n}=this.$props,i=Object.assign({},t,{position:"relative"}),r=this.showLicenseWatermark?h.createVNode(c.WatermarkOverlay,{message:this.licenseMessage},null):null,o=function(){return h.createVNode("div",{onMouseleave:this.onChartMouseLeave,ref:c.setRef(this,"element"),class:"k-chart-surface"},[e,r])};return h.h(n,{style:i,class:s,key:"chartElement"},[h.h(I.SeriesTooltip,{key:"seriesTooltip"}),h.h(y.CrosshairContainer,{key:"crosshairTooltips",optionsState:{...this.optionsState}}),o.call(this)])},methods:{dispatchOptions(e){d.optionsReducer(this.optionsState,e)},dispatchObservers(e){this.observersState=d.observersReducer(this.observersState,e)},onDestroyed(){this.chartInstance!==null&&(this.chartInstance.destroy(),this.chartInstance=null),window.removeEventListener("resize",this.onWindowResize)},getDirection(e){return e!==void 0?e==="rtl":c.isRtl(this.element)},getChartOptions(){const{renderAs:e,pannable:t,zoomable:s,paneDefaults:n,panes:i,transitions:r,seriesColors:o,seriesDefaults:f,axisDefaults:p,deriveOptionsFromParent:v}=this.$props;let a={};return e!==void 0&&(a.renderAs=e),t!==void 0&&(a.pannable=t),s!==void 0&&(a.zoomable=s),n!==void 0&&(a.paneDefaults=n),i!==void 0&&(a.panes=i),r!==void 0&&(a.transitions=r),o!==void 0&&(a.seriesColors=o),f!==void 0&&(a.seriesDefaults=f),p!==void 0&&(a.axisDefaults=p),a=Object.assign(a,this.optionsState),v&&(a=v(a)),a},refresh(){if(this.chartInstance!==null){const e=this.themeStore.getState(),t=this.getChartOptions(),s=t.transitions;this.suppressTransitions&&(t.transitions=!1),c.hasListener.call(this,"refresh")?this.trigger("refresh",{chartOptions:t,themeOptions:e,chartInstance:this.chartInstance}):this.chartInstance.setOptions(t,e),this.suppressTransitions&&(t.transitions=s,this.suppressTransitions=!1)}},instantiateCoreChart(){const{dir:e,chartConstructor:t}=this.$props,s=this.getChartOptions();let n=null;this.element&&(n=this.element.lastElementChild,n&&this.element.removeChild(n)),this.chartInstance=new t(this.element,s,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:g.provideIntlService(this),observer:this.chartObserver,sender:this}),this.element&&n&&this.element.appendChild(n)},trigger(e,t){const s=this.$props.getTarget(),n=b.create(e,t,s),i=this.observersState;let r=!1;for(let o=0;o<i.length;o++)i[o].trigger(e,t)&&(r=!0);return r===!1&&n?(this.$emit("basechartevent",e.toLowerCase(),n),n.isDefaultPrevented&&n.isDefaultPrevented()):r},triggerDomEvent(e,t){const s=this.observersState;let n=!1;for(let i=0;i<s.length;i++)s[i].trigger(e,t)&&(n=!0);return n},onRender(e){this.chartInstance!==null&&(this.surface=e.sender.surface,this.trigger("render",e))},hasListener(e){return this.$props.allListeners?Object.keys(this.$props.allListeners).some(t=>t.toLowerCase().indexOf(e.toLowerCase())!==-1):!1},onLegendItemClick(e){if(this.chartInstance!==null)if(this.hasListener("legenditemclick"))this.$emit("legenditemclick",e);else{const{series:t}=this.optionsState;if(!t)return;let s={};const{seriesIndex:n,pointIndex:i}=e,r=t[n];if(i===void 0)s=Object.assign({},r,{visible:l.toggle(r.visible)});else{const o=r.pointVisibility=r.pointVisibility||[];o[i]=l.toggle(o[i]),s=Object.assign({},r)}this.dispatchOptions({chartCollectionIdxKey:`series_${n}`,payload:s}),this.suppressTransitions=!0,this.refresh()}},onWindowResize(){this.chartInstance!==null&&this.chartInstance.resize()},onChartMouseLeave(e){const t=S.toDomEvent(this,e);this.triggerDomEvent("onMouseLeave",t)?e.preventDefault():this.chartInstance!==null&&this.chartInstance.hideElements()},onChildMouseLeave(e){const{event:t}=e;return this.chartInstance&&!l.hasParent(t.relatedTarget,this.element)&&this.chartInstance.hideElements(),!1},requiresHandlers(e){for(let t=0;t<e.length;t++){const s=e[t];if(this.hasListener(s))return!0}return!1}}});exports.BaseChart=k;