vuepress-plugin-md-enhance
Version:
Markdown enhancement plugin for vuepress
8 lines (7 loc) • 1.33 kB
JavaScript
import{useDarkMode as p,decodeData as _,LoadingIcon as m}from"@vuepress/helper/client";import{watchImmediate as g}from"@vueuse/core";import{defineComponent as h,shallowRef as l,ref as v,computed as y,h as n,onMounted as j,onUnmounted as w}from"vue";import"../styles/chartjs.scss";const S=(e,t)=>t==="json"?JSON.parse(e):new Function(`let config,__chart_js_config__;
{
${e}
__chart_js_config__=config;
}
return __chart_js_config__;`)();var C=h({name:"ChartJS",props:{config:{type:String,required:!0},id:{type:String,required:!0},title:String,type:{type:String,default:"json"}},setup(e){const t=p(),s=l(),i=l(),r=v(!0),c=y(()=>_(e.config));let o;const d=async()=>{const[{default:a}]=await Promise.all([import("chart.js/auto")]);a.defaults.borderColor=t.value?"#ccc":"#36A2EB",a.defaults.color=t.value?"#fff":"#000",a.defaults.maintainAspectRatio=!1;const u=S(c.value,e.type),f=i.value.getContext("2d");o?.destroy(),o=new a(f,u),r.value=!1};return j(()=>{g(t,()=>d(),{flush:"post"})}),w(()=>{o?.destroy(),o=null}),()=>[e.title?n("div",{class:"chartjs-title"},decodeURIComponent(e.title)):null,r.value?n(m,{class:"chartjs-loading",height:192}):null,n("div",{ref:s,class:"chartjs-wrapper",id:e.id,style:{display:r.value?"none":"block"}},n("canvas",{ref:i,height:400}))]}});export{C as default};
//# sourceMappingURL=ChartJS.js.map