import{useEventListener as f,useDebounceFn as v}from"@vueuse/core";import{defineComponent as g,ref as y,shallowRef as p,onMounted as M,onUnmounted as h,h as o}from"vue";import{atou as k,LoadingIcon as w}from"vuepress-shared/client";import"../styles/markmap.scss";var b=g({name:"MarkMap",props:{id:{type:String,required:!0},content:{type:String,required:!0}},setup(a){const n=y(!0),i=p(),s=p();let m;return f("resize",v(()=>{m.fit()},100)),M(()=>{Promise.all([import("markmap-lib"),import("markmap-toolbar"),import("markmap-view"),new Promise(r=>setTimeout(r,MARKDOWN_ENHANCE_DELAY))]).then(async([{Transformer:r},{Toolbar:l},{Markmap:u}])=>{const d=new r,{root:c}=d.transform(k(a.content)),t=u.create(s.value),{el:e}=l.create(t);t.setData(c),await t.fit(),e.style.position="absolute",e.style.bottom="0.5rem",e.style.right="0.5rem",i.value.append(e),n.value=!1})}),h(()=>{m.destroy()}),()=>o("div",{class:"markmap-wrapper",ref:i},[o("svg",{ref:s,class:"markmap-svg",id:a.id}),n.value?o(w,{class:"markmap-loading",height:360}):null])}});export{b as default};
//# sourceMappingURL=MarkMap.js.map
