@milkdown/vue 5.2.0 → 5.2.1

package/lib/index.cjs.js

@@ -0,0 +1,3 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports[Symbol.toStringTag]="Module";var e=require("vue"),m=require("@milkdown/core"),u=require("@milkdown/prose"),C=require("nanoid");const R=n=>n.map(t=>t[0]).join(`
+`),h=e.defineComponent(n=>{const t=e.shallowRef([]),a=e.ref(""),i=e.shallowRef(()=>[]);return e.watch(()=>R(n.portals),o=>{if(o!==a.value){a.value=o;const r=n.portals.map(d=>d[1]);t.value=r}}),e.nextTick(()=>{i.value=()=>t.value.map(o=>e.createVNode(o,null,null))}),()=>e.createVNode(e.Fragment,null,[i.value()])});h.props=["portals"];const p=Symbol(),v=e.defineComponent(({node:n,view:t,getPos:a,decorations:i},o)=>(e.provide(p,{node:n,view:t,getPos:a,decorations:i}),()=>{var r,d,s;return e.createVNode(e.Fragment,null,[(s=(d=(r=o.slots).default)==null?void 0:d.call(r))!=null?s:[]])}));v.props=["editor","node","view","getPos","decorations"];const V=e.defineComponent(n=>{const t=e.ref(null);return e.watchEffect(()=>{!n.dom||!t.value||t.value.appendChild(n.dom)}),()=>e.createVNode("div",{ref:t},null)});V.props=["dom"];const g=C.customAlphabet("abcedfghicklmn",10),N=(n,t)=>a=>(i,o,r,d)=>new P(a,n,t,i,o,r,d);class P{constructor(t,a,i,o,r,d,s){this.component=t,this.addPortal=a,this.removePortalByKey=i,this.node=o,this.view=r,this.getPos=d,this.decorations=s,this.key=g();const l=document.createElement(o instanceof u.Mark?"span":"div");l.classList.add("dom-wrapper");const c=o instanceof u.Node&&o.isLeaf?void 0:document.createElement(o instanceof u.Mark?"span":"div");c&&(c.classList.add("content-dom"),l.appendChild(c)),this.dom=l,this.contentDOM=c,this.renderPortal()}renderPortal(){if(!this.dom)return;const t=this.component,a=e.defineComponent(()=>()=>e.createVNode(e.Teleport,{to:this.dom},{default:()=>[e.createVNode(v,{key:this.key,node:this.node,view:this.view,getPos:this.getPos,decorations:this.decorations},{default:()=>[e.createVNode(t,null,{default:()=>[e.createVNode(V,{dom:this.contentDOM},null)]})]})]}));this.addPortal(a,this.key)}destroy(){this.dom=void 0,this.contentDOM=void 0,this.removePortalByKey(this.key)}ignoreMutation(t){return this.contentDOM?!this.contentDOM.contains(t.target):!0}}const w=Symbol(),k=n=>{const t=e.ref(null),a=e.inject(w,()=>{throw new Error}),i=e.markRaw({});return e.onMounted(()=>{!t.value||n(t.value,a).create().then(o=>{i.editor=o}).catch(o=>console.error(o))}),e.onUnmounted(()=>{var d,s,l;const o=(d=i.editor)==null?void 0:d.action(c=>c.get(m.editorViewCtx)),r=(s=i.editor)==null?void 0:s.action(c=>c.get(m.rootCtx));(l=r==null?void 0:r.firstChild)==null||l.remove(),o==null||o.destroy()}),{divRef:t,editorRef:i}},f=e.defineComponent(n=>{const t=k(n.editor);return n.editorRef&&(n.editorRef.value={get:()=>t.editorRef.editor,dom:()=>t.divRef.value}),()=>e.createVNode("div",{ref:t.divRef},null)});f.props=["editor","editorRef"];const y=e.defineComponent(n=>{const t=e.shallowReactive([]),a=e.markRaw((r,d)=>{t.push([d,r])}),i=e.markRaw(r=>{const d=t.findIndex(s=>s[0]===r);t.splice(d,1)}),o=N(a,i);return e.provide(w,o),()=>e.createVNode(e.Fragment,null,[e.createVNode(h,{portals:t},null),e.createVNode(f,{editorRef:n.editorRef,editor:n.editor},null)])});y.props=["editor","editorRef"];const M=n=>(...t)=>n(...t);exports.EditorComponent=f;exports.VueEditor=y;exports.nodeMetadata=p;exports.useEditor=M;
+//# sourceMappingURL=index.cjs.js.map

package/lib/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../src/Portals.tsx","../src/VueNode.tsx","../src/VueNodeView.tsx","../src/Editor.tsx"],"sourcesContent":["/* Copyright 2021, Milkdown by Mirone. */\nimport { DefineComponent, defineComponent, Fragment, h, nextTick, ref, shallowRef, watch } from 'vue';\nexport type PortalPair = [key: string, component: DefineComponent];\n\nconst getId = (pairs: PortalPair[]) => pairs.map((p) => p[0]).join('\\n');\n\nexport const Portals = defineComponent((props: { portals: PortalPair[] }) => {\n    const portalComponents = shallowRef<Array<DefineComponent>>([]);\n    const prev = ref<string>('');\n    const renderList = shallowRef<() => JSX.Element[]>(() => []);\n\n    watch(\n        () => getId(props.portals),\n        (ids) => {\n            if (ids !== prev.value) {\n                prev.value = ids;\n                const next = props.portals.map((p) => p[1]);\n                portalComponents.value = next;\n            }\n        },\n    );\n\n    nextTick(() => {\n        renderList.value = () => portalComponents.value.map((P) => <P />);\n    });\n\n    return () => {\n        return <>{renderList.value()}</>;\n    };\n});\nPortals.props = ['portals'];\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Decoration, EditorView, Mark, Node } from '@milkdown/prose';\nimport { defineComponent, Fragment, h, InjectionKey, provide, ref, watchEffect } from 'vue';\n\nexport type NodeContext = {\n    node: Node | Mark;\n    view: EditorView;\n    getPos: boolean | (() => number);\n    decorations: Decoration[];\n};\n\nexport const nodeMetadata: InjectionKey<NodeContext> = Symbol();\n\nexport const VueNodeContainer = defineComponent(({ node, view, getPos, decorations }: NodeContext, context) => {\n    provide(nodeMetadata, {\n        node,\n        view,\n        getPos,\n        decorations,\n    });\n    return () => <>{context.slots.default?.() ?? []}</>;\n});\nVueNodeContainer.props = ['editor', 'node', 'view', 'getPos', 'decorations'];\n\nexport const Content = defineComponent((props: { dom?: HTMLElement }) => {\n    const containerRef = ref<HTMLDivElement | null>(null);\n    watchEffect(() => {\n        if (!props.dom || !containerRef.value) return;\n        containerRef.value.appendChild(props.dom);\n    });\n    return () => <div ref={containerRef} />;\n});\nContent.props = ['dom'];\n","/* Copyright 2021, Milkdown by Mirone. */\nimport type { Decoration, EditorView, NodeView, ViewFactory } from '@milkdown/prose';\nimport { Mark, Node } from '@milkdown/prose';\nimport { customAlphabet } from 'nanoid';\nimport { DefineComponent, defineComponent, h, Teleport } from 'vue';\n\nimport { Content, VueNodeContainer } from './VueNode';\n\nconst nanoid = customAlphabet('abcedfghicklmn', 10);\n\nexport const createVueView =\n    (addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void) =>\n    (component: DefineComponent): ViewFactory =>\n    (node, view, getPos, decorations) =>\n        new VueNodeView(component, addPortal, removePortalByKey, node, view, getPos, decorations);\n\nexport class VueNodeView implements NodeView {\n    dom: HTMLElement | undefined;\n    contentDOM: HTMLElement | undefined;\n    key: string;\n\n    constructor(\n        private component: DefineComponent,\n        private addPortal: (portal: DefineComponent, key: string) => void,\n        private removePortalByKey: (key: string) => void,\n        private node: Node | Mark,\n        private view: EditorView,\n        private getPos: boolean | (() => number),\n        private decorations: Decoration[],\n    ) {\n        this.key = nanoid();\n        const dom = document.createElement(node instanceof Mark ? 'span' : 'div');\n        dom.classList.add('dom-wrapper');\n\n        const contentDOM =\n            node instanceof Node && node.isLeaf\n                ? undefined\n                : document.createElement(node instanceof Mark ? 'span' : 'div');\n        if (contentDOM) {\n            contentDOM.classList.add('content-dom');\n            dom.appendChild(contentDOM);\n        }\n        this.dom = dom;\n        this.contentDOM = contentDOM;\n        this.renderPortal();\n    }\n\n    renderPortal() {\n        if (!this.dom) return;\n\n        const CustomComponent = this.component;\n        const Portal = defineComponent(() => {\n            return () => (\n                <Teleport to={this.dom}>\n                    <VueNodeContainer\n                        key={this.key}\n                        node={this.node}\n                        view={this.view}\n                        getPos={this.getPos}\n                        decorations={this.decorations}\n                    >\n                        <CustomComponent>\n                            <Content dom={this.contentDOM} />\n                        </CustomComponent>\n                    </VueNodeContainer>\n                </Teleport>\n            );\n        });\n        this.addPortal(Portal, this.key);\n    }\n\n    destroy() {\n        this.dom = undefined;\n        this.contentDOM = undefined;\n        this.removePortalByKey(this.key);\n    }\n\n    ignoreMutation(mutation: MutationRecord | { type: 'selection'; target: Element }) {\n        if (!this.contentDOM) {\n            return true;\n        }\n        return !this.contentDOM.contains(mutation.target);\n    }\n}\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Editor, editorViewCtx, rootCtx } from '@milkdown/core';\nimport { ViewFactory } from '@milkdown/prose';\nimport {\n    DefineComponent,\n    defineComponent,\n    Fragment,\n    h,\n    inject,\n    InjectionKey,\n    markRaw,\n    onMounted,\n    onUnmounted,\n    provide,\n    Ref,\n    ref,\n    shallowReactive,\n} from 'vue';\n\nimport { PortalPair, Portals } from './Portals';\nimport { createVueView } from './VueNodeView';\n\nconst rendererKey: InjectionKey<(component: DefineComponent) => ViewFactory> = Symbol();\n\ntype GetEditor = (container: HTMLDivElement, renderVue: (Component: DefineComponent) => ViewFactory) => Editor;\n\nconst useGetEditor = (getEditor: GetEditor) => {\n    const divRef = ref<HTMLDivElement | null>(null);\n    const renderVue = inject<(Component: DefineComponent) => ViewFactory>(rendererKey, () => {\n        throw new Error();\n    });\n    const editorRef = markRaw<{ editor?: Editor }>({});\n    onMounted(() => {\n        if (!divRef.value) return;\n\n        getEditor(divRef.value, renderVue)\n            .create()\n            .then((editor) => {\n                editorRef.editor = editor;\n                return;\n            })\n            .catch((e) => console.error(e));\n    });\n    onUnmounted(() => {\n        const view = editorRef.editor?.action((ctx) => ctx.get(editorViewCtx));\n        const root = editorRef.editor?.action((ctx) => ctx.get(rootCtx)) as HTMLElement;\n\n        root?.firstChild?.remove();\n        view?.destroy();\n    });\n\n    return { divRef, editorRef };\n};\n\nexport const EditorComponent = defineComponent((props: { editor: GetEditor; editorRef?: Ref<EditorRef> }) => {\n    const refs = useGetEditor(props.editor);\n    if (props.editorRef) {\n        props.editorRef.value = {\n            get: () => refs.editorRef.editor,\n            dom: () => refs.divRef.value,\n        };\n    }\n\n    return () => <div ref={refs.divRef} />;\n});\nEditorComponent.props = ['editor', 'editorRef'];\n\nexport type EditorRef = { get: () => Editor | undefined; dom: () => HTMLDivElement | null };\n\nexport const VueEditor = defineComponent((props: { editor: GetEditor; editorRef?: Ref<EditorRef> }) => {\n    const portals = shallowReactive<PortalPair[]>([]);\n    const addPortal = markRaw((component: DefineComponent, key: string) => {\n        portals.push([key, component]);\n    });\n    const removePortalByKey = markRaw((key: string) => {\n        const index = portals.findIndex((p) => p[0] === key);\n        portals.splice(index, 1);\n    });\n    const renderVue = createVueView(addPortal, removePortalByKey);\n    provide(rendererKey, renderVue);\n\n    return () => (\n        <>\n            <Portals portals={portals} />\n            <EditorComponent editorRef={props.editorRef} editor={props.editor} />\n        </>\n    );\n});\nVueEditor.props = ['editor', 'editorRef'];\n\nexport const useEditor = (getEditor: GetEditor) => {\n    return (...args: Parameters<GetEditor>) => getEditor(...args);\n};\n"],"names":["getId","pairs","map","p","join","Portals","defineComponent","props","portalComponents","shallowRef","prev","ref","renderList","watch","portals","ids","value","next","nextTick","P","nodeMetadata","Symbol","VueNodeContainer","node","view","getPos","decorations","context","provide","slots","default","Content","containerRef","watchEffect","dom","appendChild","nanoid","customAlphabet","createVueView","addPortal","removePortalByKey","component","VueNodeView","constructor","key","document","createElement","Mark","classList","add","contentDOM","Node","isLeaf","undefined","renderPortal","CustomComponent","Portal","destroy","ignoreMutation","mutation","contains","target","rendererKey","useGetEditor","getEditor","divRef","renderVue","inject","Error","editorRef","markRaw","onMounted","create","then","editor","catch","e","console","error","onUnmounted","action","ctx","get","editorViewCtx","root","rootCtx","firstChild","remove","EditorComponent","refs","VueEditor","shallowReactive","push","index","findIndex","splice","useEditor","args"],"mappings":"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"}

package/lib/index.es.js

@@ -0,0 +1,179 @@
+import { defineComponent, shallowRef, ref, watch, nextTick, createVNode, Fragment, provide, watchEffect, Teleport, shallowReactive, markRaw, inject, onMounted, onUnmounted } from "vue";
+import { editorViewCtx, rootCtx } from "@milkdown/core";
+import { Mark, Node } from "@milkdown/prose";
+import { customAlphabet } from "nanoid";
+const getId = (pairs) => pairs.map((p) => p[0]).join("\n");
+const Portals = defineComponent((props) => {
+  const portalComponents = shallowRef([]);
+  const prev = ref("");
+  const renderList = shallowRef(() => []);
+  watch(() => getId(props.portals), (ids) => {
+    if (ids !== prev.value) {
+      prev.value = ids;
+      const next = props.portals.map((p) => p[1]);
+      portalComponents.value = next;
+    }
+  });
+  nextTick(() => {
+    renderList.value = () => portalComponents.value.map((P) => createVNode(P, null, null));
+  });
+  return () => {
+    return createVNode(Fragment, null, [renderList.value()]);
+  };
+});
+Portals.props = ["portals"];
+const nodeMetadata = Symbol();
+const VueNodeContainer = defineComponent(({
+  node,
+  view,
+  getPos,
+  decorations
+}, context) => {
+  provide(nodeMetadata, {
+    node,
+    view,
+    getPos,
+    decorations
+  });
+  return () => {
+    var _a, _b, _c;
+    return createVNode(Fragment, null, [(_c = (_b = (_a = context.slots).default) == null ? void 0 : _b.call(_a)) != null ? _c : []]);
+  };
+});
+VueNodeContainer.props = ["editor", "node", "view", "getPos", "decorations"];
+const Content = defineComponent((props) => {
+  const containerRef = ref(null);
+  watchEffect(() => {
+    if (!props.dom || !containerRef.value)
+      return;
+    containerRef.value.appendChild(props.dom);
+  });
+  return () => createVNode("div", {
+    "ref": containerRef
+  }, null);
+});
+Content.props = ["dom"];
+const nanoid = customAlphabet("abcedfghicklmn", 10);
+const createVueView = (addPortal, removePortalByKey) => (component) => (node, view, getPos, decorations) => new VueNodeView(component, addPortal, removePortalByKey, node, view, getPos, decorations);
+class VueNodeView {
+  constructor(component, addPortal, removePortalByKey, node, view, getPos, decorations) {
+    this.component = component;
+    this.addPortal = addPortal;
+    this.removePortalByKey = removePortalByKey;
+    this.node = node;
+    this.view = view;
+    this.getPos = getPos;
+    this.decorations = decorations;
+    this.key = nanoid();
+    const dom = document.createElement(node instanceof Mark ? "span" : "div");
+    dom.classList.add("dom-wrapper");
+    const contentDOM = node instanceof Node && node.isLeaf ? void 0 : document.createElement(node instanceof Mark ? "span" : "div");
+    if (contentDOM) {
+      contentDOM.classList.add("content-dom");
+      dom.appendChild(contentDOM);
+    }
+    this.dom = dom;
+    this.contentDOM = contentDOM;
+    this.renderPortal();
+  }
+  renderPortal() {
+    if (!this.dom)
+      return;
+    const CustomComponent = this.component;
+    const Portal = defineComponent(() => {
+      return () => createVNode(Teleport, {
+        "to": this.dom
+      }, {
+        default: () => [createVNode(VueNodeContainer, {
+          "key": this.key,
+          "node": this.node,
+          "view": this.view,
+          "getPos": this.getPos,
+          "decorations": this.decorations
+        }, {
+          default: () => [createVNode(CustomComponent, null, {
+            default: () => [createVNode(Content, {
+              "dom": this.contentDOM
+            }, null)]
+          })]
+        })]
+      });
+    });
+    this.addPortal(Portal, this.key);
+  }
+  destroy() {
+    this.dom = void 0;
+    this.contentDOM = void 0;
+    this.removePortalByKey(this.key);
+  }
+  ignoreMutation(mutation) {
+    if (!this.contentDOM) {
+      return true;
+    }
+    return !this.contentDOM.contains(mutation.target);
+  }
+}
+const rendererKey = Symbol();
+const useGetEditor = (getEditor) => {
+  const divRef = ref(null);
+  const renderVue = inject(rendererKey, () => {
+    throw new Error();
+  });
+  const editorRef = markRaw({});
+  onMounted(() => {
+    if (!divRef.value)
+      return;
+    getEditor(divRef.value, renderVue).create().then((editor) => {
+      editorRef.editor = editor;
+      return;
+    }).catch((e) => console.error(e));
+  });
+  onUnmounted(() => {
+    var _a, _b, _c;
+    const view = (_a = editorRef.editor) == null ? void 0 : _a.action((ctx) => ctx.get(editorViewCtx));
+    const root = (_b = editorRef.editor) == null ? void 0 : _b.action((ctx) => ctx.get(rootCtx));
+    (_c = root == null ? void 0 : root.firstChild) == null ? void 0 : _c.remove();
+    view == null ? void 0 : view.destroy();
+  });
+  return {
+    divRef,
+    editorRef
+  };
+};
+const EditorComponent = defineComponent((props) => {
+  const refs = useGetEditor(props.editor);
+  if (props.editorRef) {
+    props.editorRef.value = {
+      get: () => refs.editorRef.editor,
+      dom: () => refs.divRef.value
+    };
+  }
+  return () => createVNode("div", {
+    "ref": refs.divRef
+  }, null);
+});
+EditorComponent.props = ["editor", "editorRef"];
+const VueEditor = defineComponent((props) => {
+  const portals = shallowReactive([]);
+  const addPortal = markRaw((component, key) => {
+    portals.push([key, component]);
+  });
+  const removePortalByKey = markRaw((key) => {
+    const index = portals.findIndex((p) => p[0] === key);
+    portals.splice(index, 1);
+  });
+  const renderVue = createVueView(addPortal, removePortalByKey);
+  provide(rendererKey, renderVue);
+  return () => createVNode(Fragment, null, [createVNode(Portals, {
+    "portals": portals
+  }, null), createVNode(EditorComponent, {
+    "editorRef": props.editorRef,
+    "editor": props.editor
+  }, null)]);
+});
+VueEditor.props = ["editor", "editorRef"];
+const useEditor = (getEditor) => {
+  return (...args) => getEditor(...args);
+};
+export { EditorComponent, VueEditor, nodeMetadata, useEditor };
+//# sourceMappingURL=index.es.js.map

package/lib/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../src/Portals.tsx","../src/VueNode.tsx","../src/VueNodeView.tsx","../src/Editor.tsx"],"sourcesContent":["/* Copyright 2021, Milkdown by Mirone. */\nimport { DefineComponent, defineComponent, Fragment, h, nextTick, ref, shallowRef, watch } from 'vue';\nexport type PortalPair = [key: string, component: DefineComponent];\n\nconst getId = (pairs: PortalPair[]) => pairs.map((p) => p[0]).join('\\n');\n\nexport const Portals = defineComponent((props: { portals: PortalPair[] }) => {\n    const portalComponents = shallowRef<Array<DefineComponent>>([]);\n    const prev = ref<string>('');\n    const renderList = shallowRef<() => JSX.Element[]>(() => []);\n\n    watch(\n        () => getId(props.portals),\n        (ids) => {\n            if (ids !== prev.value) {\n                prev.value = ids;\n                const next = props.portals.map((p) => p[1]);\n                portalComponents.value = next;\n            }\n        },\n    );\n\n    nextTick(() => {\n        renderList.value = () => portalComponents.value.map((P) => <P />);\n    });\n\n    return () => {\n        return <>{renderList.value()}</>;\n    };\n});\nPortals.props = ['portals'];\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Decoration, EditorView, Mark, Node } from '@milkdown/prose';\nimport { defineComponent, Fragment, h, InjectionKey, provide, ref, watchEffect } from 'vue';\n\nexport type NodeContext = {\n    node: Node | Mark;\n    view: EditorView;\n    getPos: boolean | (() => number);\n    decorations: Decoration[];\n};\n\nexport const nodeMetadata: InjectionKey<NodeContext> = Symbol();\n\nexport const VueNodeContainer = defineComponent(({ node, view, getPos, decorations }: NodeContext, context) => {\n    provide(nodeMetadata, {\n        node,\n        view,\n        getPos,\n        decorations,\n    });\n    return () => <>{context.slots.default?.() ?? []}</>;\n});\nVueNodeContainer.props = ['editor', 'node', 'view', 'getPos', 'decorations'];\n\nexport const Content = defineComponent((props: { dom?: HTMLElement }) => {\n    const containerRef = ref<HTMLDivElement | null>(null);\n    watchEffect(() => {\n        if (!props.dom || !containerRef.value) return;\n        containerRef.value.appendChild(props.dom);\n    });\n    return () => <div ref={containerRef} />;\n});\nContent.props = ['dom'];\n","/* Copyright 2021, Milkdown by Mirone. */\nimport type { Decoration, EditorView, NodeView, ViewFactory } from '@milkdown/prose';\nimport { Mark, Node } from '@milkdown/prose';\nimport { customAlphabet } from 'nanoid';\nimport { DefineComponent, defineComponent, h, Teleport } from 'vue';\n\nimport { Content, VueNodeContainer } from './VueNode';\n\nconst nanoid = customAlphabet('abcedfghicklmn', 10);\n\nexport const createVueView =\n    (addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void) =>\n    (component: DefineComponent): ViewFactory =>\n    (node, view, getPos, decorations) =>\n        new VueNodeView(component, addPortal, removePortalByKey, node, view, getPos, decorations);\n\nexport class VueNodeView implements NodeView {\n    dom: HTMLElement | undefined;\n    contentDOM: HTMLElement | undefined;\n    key: string;\n\n    constructor(\n        private component: DefineComponent,\n        private addPortal: (portal: DefineComponent, key: string) => void,\n        private removePortalByKey: (key: string) => void,\n        private node: Node | Mark,\n        private view: EditorView,\n        private getPos: boolean | (() => number),\n        private decorations: Decoration[],\n    ) {\n        this.key = nanoid();\n        const dom = document.createElement(node instanceof Mark ? 'span' : 'div');\n        dom.classList.add('dom-wrapper');\n\n        const contentDOM =\n            node instanceof Node && node.isLeaf\n                ? undefined\n                : document.createElement(node instanceof Mark ? 'span' : 'div');\n        if (contentDOM) {\n            contentDOM.classList.add('content-dom');\n            dom.appendChild(contentDOM);\n        }\n        this.dom = dom;\n        this.contentDOM = contentDOM;\n        this.renderPortal();\n    }\n\n    renderPortal() {\n        if (!this.dom) return;\n\n        const CustomComponent = this.component;\n        const Portal = defineComponent(() => {\n            return () => (\n                <Teleport to={this.dom}>\n                    <VueNodeContainer\n                        key={this.key}\n                        node={this.node}\n                        view={this.view}\n                        getPos={this.getPos}\n                        decorations={this.decorations}\n                    >\n                        <CustomComponent>\n                            <Content dom={this.contentDOM} />\n                        </CustomComponent>\n                    </VueNodeContainer>\n                </Teleport>\n            );\n        });\n        this.addPortal(Portal, this.key);\n    }\n\n    destroy() {\n        this.dom = undefined;\n        this.contentDOM = undefined;\n        this.removePortalByKey(this.key);\n    }\n\n    ignoreMutation(mutation: MutationRecord | { type: 'selection'; target: Element }) {\n        if (!this.contentDOM) {\n            return true;\n        }\n        return !this.contentDOM.contains(mutation.target);\n    }\n}\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Editor, editorViewCtx, rootCtx } from '@milkdown/core';\nimport { ViewFactory } from '@milkdown/prose';\nimport {\n    DefineComponent,\n    defineComponent,\n    Fragment,\n    h,\n    inject,\n    InjectionKey,\n    markRaw,\n    onMounted,\n    onUnmounted,\n    provide,\n    Ref,\n    ref,\n    shallowReactive,\n} from 'vue';\n\nimport { PortalPair, Portals } from './Portals';\nimport { createVueView } from './VueNodeView';\n\nconst rendererKey: InjectionKey<(component: DefineComponent) => ViewFactory> = Symbol();\n\ntype GetEditor = (container: HTMLDivElement, renderVue: (Component: DefineComponent) => ViewFactory) => Editor;\n\nconst useGetEditor = (getEditor: GetEditor) => {\n    const divRef = ref<HTMLDivElement | null>(null);\n    const renderVue = inject<(Component: DefineComponent) => ViewFactory>(rendererKey, () => {\n        throw new Error();\n    });\n    const editorRef = markRaw<{ editor?: Editor }>({});\n    onMounted(() => {\n        if (!divRef.value) return;\n\n        getEditor(divRef.value, renderVue)\n            .create()\n            .then((editor) => {\n                editorRef.editor = editor;\n                return;\n            })\n            .catch((e) => console.error(e));\n    });\n    onUnmounted(() => {\n        const view = editorRef.editor?.action((ctx) => ctx.get(editorViewCtx));\n        const root = editorRef.editor?.action((ctx) => ctx.get(rootCtx)) as HTMLElement;\n\n        root?.firstChild?.remove();\n        view?.destroy();\n    });\n\n    return { divRef, editorRef };\n};\n\nexport const EditorComponent = defineComponent((props: { editor: GetEditor; editorRef?: Ref<EditorRef> }) => {\n    const refs = useGetEditor(props.editor);\n    if (props.editorRef) {\n        props.editorRef.value = {\n            get: () => refs.editorRef.editor,\n            dom: () => refs.divRef.value,\n        };\n    }\n\n    return () => <div ref={refs.divRef} />;\n});\nEditorComponent.props = ['editor', 'editorRef'];\n\nexport type EditorRef = { get: () => Editor | undefined; dom: () => HTMLDivElement | null };\n\nexport const VueEditor = defineComponent((props: { editor: GetEditor; editorRef?: Ref<EditorRef> }) => {\n    const portals = shallowReactive<PortalPair[]>([]);\n    const addPortal = markRaw((component: DefineComponent, key: string) => {\n        portals.push([key, component]);\n    });\n    const removePortalByKey = markRaw((key: string) => {\n        const index = portals.findIndex((p) => p[0] === key);\n        portals.splice(index, 1);\n    });\n    const renderVue = createVueView(addPortal, removePortalByKey);\n    provide(rendererKey, renderVue);\n\n    return () => (\n        <>\n            <Portals portals={portals} />\n            <EditorComponent editorRef={props.editorRef} editor={props.editor} />\n        </>\n    );\n});\nVueEditor.props = ['editor', 'editorRef'];\n\nexport const useEditor = (getEditor: GetEditor) => {\n    return (...args: Parameters<GetEditor>) => getEditor(...args);\n};\n"],"names":["getId","pairs","map","p","join","Portals","defineComponent","props","portalComponents","shallowRef","prev","ref","renderList","watch","portals","ids","value","next","nextTick","P","nodeMetadata","Symbol","VueNodeContainer","node","view","getPos","decorations","context","provide","slots","default","Content","containerRef","watchEffect","dom","appendChild","nanoid","customAlphabet","createVueView","addPortal","removePortalByKey","component","VueNodeView","constructor","key","document","createElement","Mark","classList","add","contentDOM","Node","isLeaf","undefined","renderPortal","CustomComponent","Portal","destroy","ignoreMutation","mutation","contains","target","rendererKey","useGetEditor","getEditor","divRef","renderVue","inject","Error","editorRef","markRaw","onMounted","create","then","editor","catch","e","console","error","onUnmounted","action","ctx","get","editorViewCtx","root","rootCtx","firstChild","remove","EditorComponent","refs","VueEditor","shallowReactive","push","index","findIndex","splice","useEditor","args"],"mappings":"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"}

package/package.json

@@ -1,9 +1,15 @@
 {
   "name": "@milkdown/vue",
-  "version": "5.2.0",
-  "main": "lib/index.js",
-  "module": "lib/index.js",
-  "types": "lib/index.d.ts",
+  "version": "5.2.1",
+  "main": "./lib/index.cjs.js",
+  "module": "./lib/index.es.js",
+  "types": "./lib/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./lib/index.es.js",
+      "require": "./lib/index.cjs.js"
+    }
+  },
   "sideEffects": false,
   "license": "MIT",
   "files": [
@@ -16,7 +22,7 @@
     "vue"
   ],
   "dependencies": {
-    "@milkdown/utils": "5.2.0",
+    "@milkdown/utils": "5.2.1",
     "nanoid": "^3.1.25",
     "tslib": "^2.3.1"
   },
@@ -25,13 +31,17 @@
     "vue": "^3.0.0"
   },
   "devDependencies": {
+    "@milkdown/core": "5.2.1",
+    "@milkdown/prose": "5.2.1",
+    "@milkdown/preset-commonmark": "5.2.1",
+    "@milkdown/theme-nord": "5.2.1",
     "vue": "^3.0.0"
   },
   "scripts": {
     "start": "vite",
-    "watch": "tsc -w",
+    "watch": "vite build --watch",
     "test": "jest",
     "tsc": "tsc --noEmit",
-    "build": "tsc"
+    "build": "vite build && tsc --emitDeclarationOnly"
   }
 }

package/lib/Editor.js

@@ -1,63 +0,0 @@
-/* Copyright 2021, Milkdown by Mirone. */
-import { editorViewCtx, rootCtx } from '@milkdown/core';
-import { defineComponent, Fragment, h, inject, markRaw, onMounted, onUnmounted, provide, ref, shallowReactive, } from 'vue';
-import { Portals } from './Portals';
-import { createVueView } from './VueNodeView';
-const rendererKey = Symbol();
-const useGetEditor = (getEditor) => {
-    const divRef = ref(null);
-    const renderVue = inject(rendererKey, () => {
-        throw new Error();
-    });
-    const editorRef = markRaw({});
-    onMounted(() => {
-        if (!divRef.value)
-            return;
-        getEditor(divRef.value, renderVue)
-            .create()
-            .then((editor) => {
-            editorRef.editor = editor;
-            return;
-        })
-            .catch((e) => console.error(e));
-    });
-    onUnmounted(() => {
-        var _a, _b, _c;
-        const view = (_a = editorRef.editor) === null || _a === void 0 ? void 0 : _a.action((ctx) => ctx.get(editorViewCtx));
-        const root = (_b = editorRef.editor) === null || _b === void 0 ? void 0 : _b.action((ctx) => ctx.get(rootCtx));
-        (_c = root === null || root === void 0 ? void 0 : root.firstChild) === null || _c === void 0 ? void 0 : _c.remove();
-        view === null || view === void 0 ? void 0 : view.destroy();
-    });
-    return { divRef, editorRef };
-};
-export const EditorComponent = defineComponent((props) => {
-    const refs = useGetEditor(props.editor);
-    if (props.editorRef) {
-        props.editorRef.value = {
-            get: () => refs.editorRef.editor,
-            dom: () => refs.divRef.value,
-        };
-    }
-    return () => h("div", { ref: refs.divRef });
-});
-EditorComponent.props = ['editor', 'editorRef'];
-export const VueEditor = defineComponent((props) => {
-    const portals = shallowReactive([]);
-    const addPortal = markRaw((component, key) => {
-        portals.push([key, component]);
-    });
-    const removePortalByKey = markRaw((key) => {
-        const index = portals.findIndex((p) => p[0] === key);
-        portals.splice(index, 1);
-    });
-    const renderVue = createVueView(addPortal, removePortalByKey);
-    provide(rendererKey, renderVue);
-    return () => (h(Fragment, null,
-        h(Portals, { portals: portals }),
-        h(EditorComponent, { editorRef: props.editorRef, editor: props.editor })));
-});
-VueEditor.props = ['editor', 'editorRef'];
-export const useEditor = (getEditor) => {
-    return (...args) => getEditor(...args);
-};
-//# sourceMappingURL=Editor.js.map

package/lib/Editor.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Editor.js","sourceRoot":"","sources":["../src/Editor.tsx"],"names":[],"mappings":"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"}

package/lib/Portals.js

@@ -1,23 +0,0 @@
-/* Copyright 2021, Milkdown by Mirone. */
-import { defineComponent, Fragment, h, nextTick, ref, shallowRef, watch } from 'vue';
-const getId = (pairs) => pairs.map((p) => p[0]).join('\n');
-export const Portals = defineComponent((props) => {
-    const portalComponents = shallowRef([]);
-    const prev = ref('');
-    const renderList = shallowRef(() => []);
-    watch(() => getId(props.portals), (ids) => {
-        if (ids !== prev.value) {
-            prev.value = ids;
-            const next = props.portals.map((p) => p[1]);
-            portalComponents.value = next;
-        }
-    });
-    nextTick(() => {
-        renderList.value = () => portalComponents.value.map((P) => h(P, null));
-    });
-    return () => {
-        return h(Fragment, null, renderList.value());
-    };
-});
-Portals.props = ['portals'];
-//# sourceMappingURL=Portals.js.map

package/lib/Portals.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Portals.js","sourceRoot":"","sources":["../src/Portals.tsx"],"names":[],"mappings":"AAAA,yCAAyC;AACzC,OAAO,EAAmB,eAAe,EAAE,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC;AAGtG,MAAM,KAAK,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAEzE,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,CAAC,KAAgC,EAAE,EAAE;IACxE,MAAM,gBAAgB,GAAG,UAAU,CAAyB,EAAE,CAAC,CAAC;IAChE,MAAM,IAAI,GAAG,GAAG,CAAS,EAAE,CAAC,CAAC;IAC7B,MAAM,UAAU,GAAG,UAAU,CAAsB,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC;IAE7D,KAAK,CACD,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,EAC1B,CAAC,GAAG,EAAE,EAAE;QACJ,IAAI,GAAG,KAAK,IAAI,CAAC,KAAK,EAAE;YACpB,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC;YACjB,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC5C,gBAAgB,CAAC,KAAK,GAAG,IAAI,CAAC;SACjC;IACL,CAAC,CACJ,CAAC;IAEF,QAAQ,CAAC,GAAG,EAAE;QACV,UAAU,CAAC,KAAK,GAAG,GAAG,EAAE,CAAC,gBAAgB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,EAAC,CAAC,OAAG,CAAC,CAAC;IACtE,CAAC,CAAC,CAAC;IAEH,OAAO,GAAG,EAAE;QACR,OAAO,kBAAG,UAAU,CAAC,KAAK,EAAE,CAAI,CAAC;IACrC,CAAC,CAAC;AACN,CAAC,CAAC,CAAC;AACH,OAAO,CAAC,KAAK,GAAG,CAAC,SAAS,CAAC,CAAC"}

package/lib/VueNode.js

@@ -1,23 +0,0 @@
-import { defineComponent, Fragment, h, provide, ref, watchEffect } from 'vue';
-export const nodeMetadata = Symbol();
-export const VueNodeContainer = defineComponent(({ node, view, getPos, decorations }, context) => {
-    provide(nodeMetadata, {
-        node,
-        view,
-        getPos,
-        decorations,
-    });
-    return () => { var _a, _b, _c; return h(Fragment, null, (_c = (_b = (_a = context.slots).default) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : []); };
-});
-VueNodeContainer.props = ['editor', 'node', 'view', 'getPos', 'decorations'];
-export const Content = defineComponent((props) => {
-    const containerRef = ref(null);
-    watchEffect(() => {
-        if (!props.dom || !containerRef.value)
-            return;
-        containerRef.value.appendChild(props.dom);
-    });
-    return () => h("div", { ref: containerRef });
-});
-Content.props = ['dom'];
-//# sourceMappingURL=VueNode.js.map

package/lib/VueNode.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"VueNode.js","sourceRoot":"","sources":["../src/VueNode.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,CAAC,EAAgB,OAAO,EAAE,GAAG,EAAE,WAAW,EAAE,MAAM,KAAK,CAAC;AAS5F,MAAM,CAAC,MAAM,YAAY,GAA8B,MAAM,EAAE,CAAC;AAEhE,MAAM,CAAC,MAAM,gBAAgB,GAAG,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,EAAe,EAAE,OAAO,EAAE,EAAE;IAC1G,OAAO,CAAC,YAAY,EAAE;QAClB,IAAI;QACJ,IAAI;QACJ,MAAM;QACN,WAAW;KACd,CAAC,CAAC;IACH,OAAO,GAAG,EAAE,mBAAC,OAAA,kBAAG,MAAA,MAAA,MAAA,OAAO,CAAC,KAAK,EAAC,OAAO,kDAAI,mCAAI,EAAE,CAAI,CAAA,EAAA,CAAC;AACxD,CAAC,CAAC,CAAC;AACH,gBAAgB,CAAC,KAAK,GAAG,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,CAAC,CAAC;AAE7E,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,CAAC,KAA4B,EAAE,EAAE;IACpE,MAAM,YAAY,GAAG,GAAG,CAAwB,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK;YAAE,OAAO;QAC9C,YAAY,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC9C,CAAC,CAAC,CAAC;IACH,OAAO,GAAG,EAAE,CAAC,WAAK,GAAG,EAAE,YAAY,GAAI,CAAC;AAC5C,CAAC,CAAC,CAAC;AACH,OAAO,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC"}

package/lib/VueNodeView.js

@@ -1,54 +0,0 @@
-import { Mark, Node } from '@milkdown/prose';
-import { customAlphabet } from 'nanoid';
-import { defineComponent, h, Teleport } from 'vue';
-import { Content, VueNodeContainer } from './VueNode';
-const nanoid = customAlphabet('abcedfghicklmn', 10);
-export const createVueView = (addPortal, removePortalByKey) => (component) => (node, view, getPos, decorations) => new VueNodeView(component, addPortal, removePortalByKey, node, view, getPos, decorations);
-export class VueNodeView {
-    constructor(component, addPortal, removePortalByKey, node, view, getPos, decorations) {
-        this.component = component;
-        this.addPortal = addPortal;
-        this.removePortalByKey = removePortalByKey;
-        this.node = node;
-        this.view = view;
-        this.getPos = getPos;
-        this.decorations = decorations;
-        this.key = nanoid();
-        const dom = document.createElement(node instanceof Mark ? 'span' : 'div');
-        dom.classList.add('dom-wrapper');
-        const contentDOM = node instanceof Node && node.isLeaf
-            ? undefined
-            : document.createElement(node instanceof Mark ? 'span' : 'div');
-        if (contentDOM) {
-            contentDOM.classList.add('content-dom');
-            dom.appendChild(contentDOM);
-        }
-        this.dom = dom;
-        this.contentDOM = contentDOM;
-        this.renderPortal();
-    }
-    renderPortal() {
-        if (!this.dom)
-            return;
-        const CustomComponent = this.component;
-        const Portal = defineComponent(() => {
-            return () => (h(Teleport, { to: this.dom },
-                h(VueNodeContainer, { key: this.key, node: this.node, view: this.view, getPos: this.getPos, decorations: this.decorations },
-                    h(CustomComponent, null,
-                        h(Content, { dom: this.contentDOM })))));
-        });
-        this.addPortal(Portal, this.key);
-    }
-    destroy() {
-        this.dom = undefined;
-        this.contentDOM = undefined;
-        this.removePortalByKey(this.key);
-    }
-    ignoreMutation(mutation) {
-        if (!this.contentDOM) {
-            return true;
-        }
-        return !this.contentDOM.contains(mutation.target);
-    }
-}
-//# sourceMappingURL=VueNodeView.js.map

package/lib/VueNodeView.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"VueNodeView.js","sourceRoot":"","sources":["../src/VueNodeView.tsx"],"names":[],"mappings":"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"}

package/lib/index.js

@@ -1,4 +0,0 @@
-/* Copyright 2021, Milkdown by Mirone. */
-export * from './Editor';
-export { nodeMetadata } from './VueNode';
-//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,yCAAyC;AACzC,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC"}

package/lib/utils.js

@@ -1,3 +0,0 @@
-/* Copyright 2021, Milkdown by Mirone. */
-export {};
-//# sourceMappingURL=utils.js.map

package/lib/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA,yCAAyC"}