From be2734f6693e95f67bbbdec816c69f7a39549e39 Mon Sep 17 00:00:00 2001 From: Tyson McCarney <48730964+J-T-McC@users.noreply.github.com> Date: Fri, 15 Oct 2021 19:46:31 -0700 Subject: [PATCH] New build (#15) --- dist/vue3-chartjs.es.js | 164 ++++++++++++++++++++++++++++++++++++++- dist/vue3-chartjs.umd.js | 2 +- 2 files changed, 164 insertions(+), 2 deletions(-) diff --git a/dist/vue3-chartjs.es.js b/dist/vue3-chartjs.es.js index deb781d..f8a7ad8 100644 --- a/dist/vue3-chartjs.es.js +++ b/dist/vue3-chartjs.es.js @@ -1 +1,163 @@ -var e=Object.defineProperty,t=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,a=Object.prototype.propertyIsEnumerable,n=(t,r,a)=>r in t?e(t,r,{enumerable:!0,configurable:!0,writable:!0,value:a}):t[r]=a,o=(e,o)=>{for(var p in o||(o={}))r.call(o,p)&&n(e,p,o[p]);if(t)for(var p of t(o))a.call(o,p)&&n(e,p,o[p]);return e};import{defineComponent as p,ref as s,onMounted as l,h as i}from"vue";import{Chart as u,ArcElement as d,LineElement as f,BarElement as c,PointElement as h,BarController as y,BubbleController as b,DoughnutController as g,LineController as v,PieController as m,PolarAreaController as P,RadarController as D,ScatterController as O,CategoryScale as j,LinearScale as U,LogarithmicScale as w,RadialLinearScale as R,TimeScale as S,TimeSeriesScale as z,Decimation as C,Filler as E,Legend as I,Title as J,Tooltip as L}from"chart.js";const _=["install","start","stop","beforeInit","afterInit","beforeUpdate","afterUpdate","beforeElementsUpdate","reset","beforeDatasetsUpdate","afterDatasetsUpdate","beforeDatasetUpdate","afterDatasetUpdate","beforeLayout","afterLayout","afterLayout","beforeRender","afterRender","resize","destroy","uninstall","afterTooltipDraw","beforeTooltipDraw"];u.register(d,f,c,h,y,b,g,v,m,P,D,O,j,U,w,R,S,z,C,E,I,J,L);const q=p({name:"Vue3ChartJs",props:{type:{type:String,required:!0},data:{type:Object,required:!0},options:{type:Object,default:()=>({})},plugins:{type:Array,default:()=>[]}},emits:_,setup(e,{emit:t}){const r=s(null),a={chart:null,plugins:[_.reduce(((e,a)=>{const n=function(e,t=null){return{type:e,chartRef:t,preventDefault(){this._defaultPrevented=!0},isDefaultPrevented(){return!this._defaultPrevented},_defaultPrevented:!1}}(a,r);return o(o({},e),function(e,t){return{[t.type]:()=>(e(t.type,t),t.isDefaultPrevented())}}(t,n))}),{id:"Vue3ChartJsEventHookPlugin"}),...e.plugins],props:o({},e)},n=()=>a.chart?a.chart.update():a.chart=new u(r.value.getContext("2d"),{type:a.props.type,data:a.props.data,options:a.props.options,plugins:a.plugins});return l((()=>n())),{chartJSState:a,chartRef:r,render:n,resize:()=>a.chart&&a.chart.resize(),update:(e=750)=>{a.chart.data=o(o({},a.chart.data),a.props.data),a.chart.options=o(o({},a.chart.options),a.props.options),a.chart.update(e)},destroy:()=>{a.chart&&(a.chart.destroy(),a.chart=null)}}},render:()=>i("canvas",{ref:"chartRef"})});q.registerGlobalPlugins=e=>{u.register(...e)},q.install=(e,t={})=>{var r;e.component(q.name,q),(null==(r=null==t?void 0:t.plugins)?void 0:r.length)&&q.registerGlobalPlugins(t.plugins)};export{q as default}; +var __defProp = Object.defineProperty; +var __getOwnPropSymbols = Object.getOwnPropertySymbols; +var __hasOwnProp = Object.prototype.hasOwnProperty; +var __propIsEnum = Object.prototype.propertyIsEnumerable; +var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; +var __spreadValues = (a, b) => { + for (var prop in b || (b = {})) + if (__hasOwnProp.call(b, prop)) + __defNormalProp(a, prop, b[prop]); + if (__getOwnPropSymbols) + for (var prop of __getOwnPropSymbols(b)) { + if (__propIsEnum.call(b, prop)) + __defNormalProp(a, prop, b[prop]); + } + return a; +}; +import { defineComponent, ref, onMounted, h } from "vue"; +import { Chart, ArcElement, LineElement, BarElement, PointElement, BarController, BubbleController, DoughnutController, LineController, PieController, PolarAreaController, RadarController, ScatterController, CategoryScale, LinearScale, LogarithmicScale, RadialLinearScale, TimeScale, TimeSeriesScale, Decimation, Filler, Legend, Title, Tooltip } from "chart.js"; +const chartJsEventNames = [ + "install", + "start", + "stop", + "beforeInit", + "afterInit", + "beforeUpdate", + "afterUpdate", + "beforeElementsUpdate", + "reset", + "beforeDatasetsUpdate", + "afterDatasetsUpdate", + "beforeDatasetUpdate", + "afterDatasetUpdate", + "beforeLayout", + "afterLayout", + "afterLayout", + "beforeRender", + "afterRender", + "resize", + "destroy", + "uninstall", + "afterTooltipDraw", + "beforeTooltipDraw" +]; +function generateEventObject(type, chartRef = null) { + return { + type, + chartRef, + preventDefault() { + this._defaultPrevented = true; + }, + isDefaultPrevented() { + return !this._defaultPrevented; + }, + _defaultPrevented: false + }; +} +function generateChartJsEventListener(emit, event) { + return { + [event.type]: () => { + emit(event.type, event); + return event.isDefaultPrevented(); + } + }; +} +Chart.register(ArcElement, LineElement, BarElement, PointElement, BarController, BubbleController, DoughnutController, LineController, PieController, PolarAreaController, RadarController, ScatterController, CategoryScale, LinearScale, LogarithmicScale, RadialLinearScale, TimeScale, TimeSeriesScale, Decimation, Filler, Legend, Title, Tooltip); +const Vue3ChartJs = defineComponent({ + name: "Vue3ChartJs", + props: { + type: { + type: String, + required: true + }, + height: { + type: Number, + required: false, + default: null + }, + width: { + type: Number, + required: false, + default: null + }, + data: { + type: Object, + required: true + }, + options: { + type: Object, + default: () => ({}) + }, + plugins: { + type: Array, + default: () => [] + } + }, + emits: chartJsEventNames, + setup(props, { emit }) { + const chartRef = ref(null); + const chartJsEventsPlugin = chartJsEventNames.reduce((reduced, eventType) => { + const event = generateEventObject(eventType, chartRef); + return __spreadValues(__spreadValues({}, reduced), generateChartJsEventListener(emit, event)); + }, { id: "Vue3ChartJsEventHookPlugin" }); + const chartJSState = { + chart: null, + plugins: [ + chartJsEventsPlugin, + ...props.plugins + ], + props: __spreadValues({}, props) + }; + const destroy = () => { + if (chartJSState.chart) { + chartJSState.chart.destroy(); + chartJSState.chart = null; + } + }; + const update = (animateSpeed = 750) => { + chartJSState.chart.data = __spreadValues(__spreadValues({}, chartJSState.chart.data), chartJSState.props.data); + chartJSState.chart.options = __spreadValues(__spreadValues({}, chartJSState.chart.options), chartJSState.props.options); + chartJSState.chart.update(animateSpeed); + }; + const resize = () => chartJSState.chart && chartJSState.chart.resize(); + const render = () => { + if (chartJSState.chart) { + return chartJSState.chart.update(); + } + return chartJSState.chart = new Chart(chartRef.value.getContext("2d"), { + type: chartJSState.props.type, + data: chartJSState.props.data, + options: chartJSState.props.options, + plugins: chartJSState.plugins + }); + }; + onMounted(() => render()); + return { + chartJSState, + chartRef, + render, + resize, + update, + destroy + }; + }, + render(props) { + return h("canvas", { + ref: "chartRef", + height: props.height, + width: props.width + }); + } +}); +const _sfc_main = Vue3ChartJs; +_sfc_main.registerGlobalPlugins = (plugins) => { + Chart.register(...plugins); +}; +_sfc_main.install = (app, options = {}) => { + var _a; + app.component(_sfc_main.name, _sfc_main); + if ((_a = options == null ? void 0 : options.plugins) == null ? void 0 : _a.length) { + _sfc_main.registerGlobalPlugins(options.plugins); + } +}; +export { _sfc_main as default }; diff --git a/dist/vue3-chartjs.umd.js b/dist/vue3-chartjs.umd.js index a5168e5..37a7968 100644 --- a/dist/vue3-chartjs.umd.js +++ b/dist/vue3-chartjs.umd.js @@ -1 +1 @@ -var __defProp=Object.defineProperty,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(e,t,r)=>t in e?__defProp(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,__spreadValues=(e,t)=>{for(var r in t||(t={}))__hasOwnProp.call(t,r)&&__defNormalProp(e,r,t[r]);if(__getOwnPropSymbols)for(var r of __getOwnPropSymbols(t))__propIsEnum.call(t,r)&&__defNormalProp(e,r,t[r]);return e};!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue"),require("chart.js")):"function"==typeof define&&define.amd?define(["vue","chart.js"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).Vue3ChartJs=t(e.Vue,e.Chart)}(this,(function(e,t){"use strict";const r=["install","start","stop","beforeInit","afterInit","beforeUpdate","afterUpdate","beforeElementsUpdate","reset","beforeDatasetsUpdate","afterDatasetsUpdate","beforeDatasetUpdate","afterDatasetUpdate","beforeLayout","afterLayout","afterLayout","beforeRender","afterRender","resize","destroy","uninstall","afterTooltipDraw","beforeTooltipDraw"];t.Chart.register(t.ArcElement,t.LineElement,t.BarElement,t.PointElement,t.BarController,t.BubbleController,t.DoughnutController,t.LineController,t.PieController,t.PolarAreaController,t.RadarController,t.ScatterController,t.CategoryScale,t.LinearScale,t.LogarithmicScale,t.RadialLinearScale,t.TimeScale,t.TimeSeriesScale,t.Decimation,t.Filler,t.Legend,t.Title,t.Tooltip);const a=e.defineComponent({name:"Vue3ChartJs",props:{type:{type:String,required:!0},data:{type:Object,required:!0},options:{type:Object,default:()=>({})},plugins:{type:Array,default:()=>[]}},emits:r,setup(a,{emit:o}){const n=e.ref(null),l={chart:null,plugins:[r.reduce(((e,t)=>{const r=function(e,t=null){return{type:e,chartRef:t,preventDefault(){this._defaultPrevented=!0},isDefaultPrevented(){return!this._defaultPrevented},_defaultPrevented:!1}}(t,n);return __spreadValues(__spreadValues({},e),function(e,t){return{[t.type]:()=>(e(t.type,t),t.isDefaultPrevented())}}(o,r))}),{id:"Vue3ChartJsEventHookPlugin"}),...a.plugins],props:__spreadValues({},a)},s=()=>l.chart?l.chart.update():l.chart=new t.Chart(n.value.getContext("2d"),{type:l.props.type,data:l.props.data,options:l.props.options,plugins:l.plugins});return e.onMounted((()=>s())),{chartJSState:l,chartRef:n,render:s,resize:()=>l.chart&&l.chart.resize(),update:(e=750)=>{l.chart.data=__spreadValues(__spreadValues({},l.chart.data),l.props.data),l.chart.options=__spreadValues(__spreadValues({},l.chart.options),l.props.options),l.chart.update(e)},destroy:()=>{l.chart&&(l.chart.destroy(),l.chart=null)}}},render:()=>e.h("canvas",{ref:"chartRef"})});return a.registerGlobalPlugins=e=>{t.Chart.register(...e)},a.install=(e,t={})=>{var r;e.component(a.name,a),(null==(r=null==t?void 0:t.plugins)?void 0:r.length)&&a.registerGlobalPlugins(t.plugins)},a})); +var D=Object.defineProperty;var p=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var f=(r,e,n)=>e in r?D(r,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):r[e]=n,i=(r,e)=>{for(var n in e||(e={}))S.call(e,n)&&f(r,n,e[n]);if(p)for(var n of p(e))v.call(e,n)&&f(r,n,e[n]);return r};(function(r,e){typeof exports=="object"&&typeof module!="undefined"?module.exports=e(require("vue"),require("chart.js")):typeof define=="function"&&define.amd?define(["vue","chart.js"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,r.Vue3ChartJs=e(r.Vue,r.Chart))})(this,function(r,e){"use strict";const n=["install","start","stop","beforeInit","afterInit","beforeUpdate","afterUpdate","beforeElementsUpdate","reset","beforeDatasetsUpdate","afterDatasetsUpdate","beforeDatasetUpdate","afterDatasetUpdate","beforeLayout","afterLayout","afterLayout","beforeRender","afterRender","resize","destroy","uninstall","afterTooltipDraw","beforeTooltipDraw"];function c(a,l=null){return{type:a,chartRef:l,preventDefault(){this._defaultPrevented=!0},isDefaultPrevented(){return!this._defaultPrevented},_defaultPrevented:!1}}function g(a,l){return{[l.type]:()=>(a(l.type,l),l.isDefaultPrevented())}}e.Chart.register(e.ArcElement,e.LineElement,e.BarElement,e.PointElement,e.BarController,e.BubbleController,e.DoughnutController,e.LineController,e.PieController,e.PolarAreaController,e.RadarController,e.ScatterController,e.CategoryScale,e.LinearScale,e.LogarithmicScale,e.RadialLinearScale,e.TimeScale,e.TimeSeriesScale,e.Decimation,e.Filler,e.Legend,e.Title,e.Tooltip);const o=r.defineComponent({name:"Vue3ChartJs",props:{type:{type:String,required:!0},height:{type:Number,required:!1,default:null},width:{type:Number,required:!1,default:null},data:{type:Object,required:!0},options:{type:Object,default:()=>({})},plugins:{type:Array,default:()=>[]}},emits:n,setup(a,{emit:l}){const u=r.ref(null),h=n.reduce((d,b)=>{const P=c(b,u);return i(i({},d),g(l,P))},{id:"Vue3ChartJsEventHookPlugin"}),t={chart:null,plugins:[h,...a.plugins],props:i({},a)},y=()=>{t.chart&&(t.chart.destroy(),t.chart=null)},m=(d=750)=>{t.chart.data=i(i({},t.chart.data),t.props.data),t.chart.options=i(i({},t.chart.options),t.props.options),t.chart.update(d)},C=()=>t.chart&&t.chart.resize(),s=()=>t.chart?t.chart.update():t.chart=new e.Chart(u.value.getContext("2d"),{type:t.props.type,data:t.props.data,options:t.props.options,plugins:t.plugins});return r.onMounted(()=>s()),{chartJSState:t,chartRef:u,render:s,resize:C,update:m,destroy:y}},render(a){return r.h("canvas",{ref:"chartRef",height:a.height,width:a.width})}});return o.registerGlobalPlugins=a=>{e.Chart.register(...a)},o.install=(a,l={})=>{var u;a.component(o.name,o),((u=l==null?void 0:l.plugins)==null?void 0:u.length)&&o.registerGlobalPlugins(l.plugins)},o});