@milkdown/vue 6.4.0 → 6.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/Editor.d.ts CHANGED
@@ -1,7 +1,6 @@
1
- import { ComponentInternalInstance, DefineComponent, InjectionKey } from 'vue';
1
+ import { DefineComponent, InjectionKey } from 'vue';
2
2
  import { EditorRef } from './EditorComponent';
3
3
  import { EditorInfo, EditorInfoCtx } from './types';
4
- export declare const getRootInstance: () => ComponentInternalInstance | null;
5
4
  export declare const editorInfoCtxKey: InjectionKey<EditorInfoCtx>;
6
5
  export declare const VueEditor: DefineComponent<{
7
6
  editor: EditorInfo;
@@ -1 +1 @@
1
- {"version":3,"file":"Editor.d.ts","sourceRoot":"","sources":["../src/Editor.tsx"],"names":[],"mappings":"AACA,OAAO,EACH,yBAAyB,EACzB,eAAe,EAKf,YAAY,EAMf,MAAM,KAAK,CAAC;AAEb,OAAO,EAAmB,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AASpD,eAAO,MAAM,eAAe,wCAE3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,YAAY,CAAC,aAAa,CAAY,CAAC;AA4BtE,eAAO,MAAM,SAAS;YAA6B,UAAU;;;YAAV,UAAU;;OA0D3D,CAAC"}
1
+ {"version":3,"file":"Editor.d.ts","sourceRoot":"","sources":["../src/Editor.tsx"],"names":[],"mappings":"AACA,OAAO,EAEH,eAAe,EAKf,YAAY,EAOf,MAAM,KAAK,CAAC;AAEb,OAAO,EAAmB,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAIpD,eAAO,MAAM,gBAAgB,EAAE,YAAY,CAAC,aAAa,CAAY,CAAC;AA4BtE,eAAO,MAAM,SAAS;YAA6B,UAAU;;;YAAV,UAAU;;OA4D3D,CAAC"}
@@ -1,15 +1,16 @@
1
1
  import { Ctx } from '@milkdown/core';
2
2
  import { Mark, Node } from '@milkdown/prose/model';
3
3
  import type { Decoration, DecorationSource, EditorView, MarkViewConstructor, NodeView, NodeViewConstructor } from '@milkdown/prose/view';
4
- import { DefineComponent } from 'vue';
4
+ import { ComponentInternalInstance, DefineComponent, Ref } from 'vue';
5
5
  export declare type RenderOptions = Partial<{
6
6
  as: string;
7
7
  update?: (node: Node, decorations: readonly Decoration[], innerDecorations: DecorationSource) => boolean;
8
8
  } & Pick<NodeView, 'ignoreMutation' | 'deselectNode' | 'selectNode' | 'destroy'>>;
9
- export declare const createVueView: (addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void) => (component: DefineComponent, options?: RenderOptions) => (ctx: Ctx) => NodeViewConstructor | MarkViewConstructor;
9
+ export declare const createVueView: (rootInstance: Ref<null | ComponentInternalInstance>, addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void) => (component: DefineComponent, options?: RenderOptions) => (ctx: Ctx) => NodeViewConstructor | MarkViewConstructor;
10
10
  export declare class VueNodeView implements NodeView {
11
11
  private ctx;
12
12
  private component;
13
+ private rootInstance;
13
14
  private addPortal;
14
15
  private removePortalByKey;
15
16
  private options;
@@ -20,7 +21,7 @@ export declare class VueNodeView implements NodeView {
20
21
  get isInlineOrMark(): boolean;
21
22
  private node;
22
23
  private decorations;
23
- constructor(ctx: Ctx, component: DefineComponent, addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void, options: RenderOptions, node: Node | Mark, view: EditorView, getPos: boolean | (() => number), decorations: readonly Decoration[]);
24
+ constructor(ctx: Ctx, component: DefineComponent, rootInstance: Ref<null | ComponentInternalInstance>, addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void, options: RenderOptions, node: Node | Mark, view: EditorView, getPos: boolean | (() => number), decorations: readonly Decoration[]);
24
25
  get dom(): HTMLElement;
25
26
  get contentDOM(): HTMLElement | undefined;
26
27
  getPortal: () => DefineComponent;
@@ -1 +1 @@
1
- {"version":3,"file":"VueNodeView.d.ts","sourceRoot":"","sources":["../src/VueNodeView.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,KAAK,EACR,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,mBAAmB,EACnB,QAAQ,EACR,mBAAmB,EACtB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAE,eAAe,EAAmD,MAAM,KAAK,CAAC;AAOvF,oBAAY,aAAa,GAAG,OAAO,CAC/B;IACI,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,UAAU,EAAE,EAAE,gBAAgB,EAAE,gBAAgB,KAAK,OAAO,CAAC;CAC5G,GAAG,IAAI,CAAC,QAAQ,EAAE,gBAAgB,GAAG,cAAc,GAAG,YAAY,GAAG,SAAS,CAAC,CACnF,CAAC;AAEF,eAAO,MAAM,aAAa,uBACD,eAAe,OAAO,MAAM,KAAK,IAAI,2BAA2B,MAAM,KAAK,IAAI,iBAErF,eAAe,YACjB,aAAa,WAChB,GAAG,KAAK,mBAAmB,GAAG,mBAGmE,CAAC;AAEhH,qBAAa,WAAY,YAAW,QAAQ;IAYpC,OAAO,CAAC,GAAG;IACX,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,iBAAiB;IACzB,OAAO,CAAC,OAAO;IAEf,OAAO,CAAC,IAAI;IACZ,OAAO,CAAC,MAAM;IAlBlB,WAAW,EAAE,WAAW,CAAC;IACzB,GAAG,EAAE,MAAM,CAAC;IAEZ,IAAI,cAAc,YAEjB;IAED,OAAO,CAAC,IAAI,CAAmB;IAC/B,OAAO,CAAC,WAAW,CAA6B;gBAGpC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,SAAS,EAAE,CAAC,MAAM,EAAE,eAAe,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,EACzD,iBAAiB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,EACxC,OAAO,EAAE,aAAa,EAC9B,IAAI,EAAE,IAAI,GAAG,IAAI,EACT,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,OAAO,GAAG,CAAC,MAAM,MAAM,CAAC,EACxC,WAAW,EAAE,SAAS,UAAU,EAAE;IAUtC,IAAI,GAAG,gBAEN;IAED,IAAI,UAAU,4BAMb;IAED,SAAS,QAAO,eAAe,CA0B7B;IAEF,YAAY;IAWZ,OAAO;IAMP,cAAc,CAAC,QAAQ,EAAE,cAAc;IA6BvC,MAAM,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,UAAU,EAAE,EAAE,gBAAgB,EAAE,gBAAgB;IA0BzF,UAAU,2BAA4B;IAEtC,YAAY,2BAA8B;CAC7C"}
1
+ {"version":3,"file":"VueNodeView.d.ts","sourceRoot":"","sources":["../src/VueNodeView.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,KAAK,EACR,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,mBAAmB,EACnB,QAAQ,EACR,mBAAmB,EACtB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAE,yBAAyB,EAAE,eAAe,EAA+B,GAAG,EAAiB,MAAM,KAAK,CAAC;AAMlH,oBAAY,aAAa,GAAG,OAAO,CAC/B;IACI,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,UAAU,EAAE,EAAE,gBAAgB,EAAE,gBAAgB,KAAK,OAAO,CAAC;CAC5G,GAAG,IAAI,CAAC,QAAQ,EAAE,gBAAgB,GAAG,cAAc,GAAG,YAAY,GAAG,SAAS,CAAC,CACnF,CAAC;AAEF,eAAO,MAAM,aAAa,iBAEJ,IAAI,IAAI,GAAG,yBAAyB,CAAC,sBAC/B,eAAe,OAAO,MAAM,KAAK,IAAI,2BAChC,MAAM,KAAK,IAAI,iBAG7B,eAAe,YACjB,aAAa,WAChB,GAAG,KAAK,mBAAmB,GAAG,mBAcnC,CAAC;AAEV,qBAAa,WAAY,YAAW,QAAQ;IAYpC,OAAO,CAAC,GAAG;IACX,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,YAAY;IACpB,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,iBAAiB;IACzB,OAAO,CAAC,OAAO;IAEf,OAAO,CAAC,IAAI;IACZ,OAAO,CAAC,MAAM;IAnBlB,WAAW,EAAE,WAAW,CAAC;IACzB,GAAG,EAAE,MAAM,CAAC;IAEZ,IAAI,cAAc,YAEjB;IAED,OAAO,CAAC,IAAI,CAAmB;IAC/B,OAAO,CAAC,WAAW,CAA6B;gBAGpC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,YAAY,EAAE,GAAG,CAAC,IAAI,GAAG,yBAAyB,CAAC,EACnD,SAAS,EAAE,CAAC,MAAM,EAAE,eAAe,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,EACzD,iBAAiB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,EACxC,OAAO,EAAE,aAAa,EAC9B,IAAI,EAAE,IAAI,GAAG,IAAI,EACT,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,OAAO,GAAG,CAAC,MAAM,MAAM,CAAC,EACxC,WAAW,EAAE,SAAS,UAAU,EAAE;IAUtC,IAAI,GAAG,gBAEN;IAED,IAAI,UAAU,4BAMb;IAED,SAAS,QAAO,eAAe,CA0B7B;IAEF,YAAY;IAWZ,OAAO;IAMP,cAAc,CAAC,QAAQ,EAAE,cAAc;IA6BvC,MAAM,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,UAAU,EAAE,EAAE,gBAAgB,EAAE,gBAAgB;IA0BzF,UAAU,2BAA4B;IAEtC,YAAY,2BAA8B;CAC7C"}
package/lib/index.es.js CHANGED
@@ -1,92 +1,92 @@
1
- var N = Object.defineProperty;
2
- var S = (o, e, t) => e in o ? N(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
3
- var v = (o, e, t) => (S(o, typeof e != "symbol" ? e + "" : e, t), t);
4
- import { inject as g, ref as u, onMounted as j, onUnmounted as C, defineComponent as p, createVNode as c, provide as w, h as K, markRaw as k, Teleport as U, shallowReactive as B, getCurrentInstance as A, onBeforeMount as L, effect as _, isVNode as q } from "vue";
1
+ var R = Object.defineProperty;
2
+ var S = (o, e, t) => e in o ? R(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
3
+ var g = (o, e, t) => (S(o, typeof e != "symbol" ? e + "" : e, t), t);
4
+ import { inject as y, ref as u, onMounted as j, onUnmounted as C, defineComponent as v, createVNode as l, provide as k, h as K, markRaw as M, Teleport as U, shallowReactive as B, getCurrentInstance as A, onBeforeMount as L, effect as _, isVNode as q } from "vue";
5
5
  import { editorViewCtx as G, rootCtx as T } from "@milkdown/core";
6
6
  import { vueRendererCallOutOfScope as z } from "@milkdown/exception";
7
7
  import { Mark as F, Node as I } from "@milkdown/prose/model";
8
8
  import { customAlphabet as H } from "nanoid";
9
9
  const E = Symbol(), J = (o) => {
10
- const e = g(E, () => {
10
+ const e = y(E, () => {
11
11
  throw z();
12
- }), { dom: t, loading: i, editor: a } = g(O, {}), s = u(!1);
12
+ }), { dom: t, loading: n, editor: s } = y(O, {}), a = u(!1);
13
13
  j(() => {
14
14
  if (!t.value)
15
15
  return;
16
16
  const r = o(t.value, e);
17
- !r || s.value || (i.value = !0, s.value = !0, r.create().then((n) => {
18
- a.value = n;
17
+ !r || a.value || (n.value = !0, a.value = !0, r.create().then((i) => {
18
+ s.value = i;
19
19
  }).finally(() => {
20
- i.value = !1, s.value = !1;
21
- }).catch((n) => console.error(n)));
20
+ n.value = !1, a.value = !1;
21
+ }).catch((i) => console.error(i)));
22
22
  }), C(() => {
23
- var d, f, h;
24
- const r = (d = a.value) == null ? void 0 : d.action((l) => l.get(G)), n = (f = a.value) == null ? void 0 : f.action((l) => l.get(T));
25
- (h = n == null ? void 0 : n.firstChild) == null || h.remove(), r == null || r.destroy();
23
+ var d, c, m;
24
+ const r = (d = s.value) == null ? void 0 : d.action((f) => f.get(G)), i = (c = s.value) == null ? void 0 : c.action((f) => f.get(T));
25
+ (m = i == null ? void 0 : i.firstChild) == null || m.remove(), r == null || r.destroy();
26
26
  });
27
- }, V = p({
27
+ }, V = v({
28
28
  name: "milkdown-dom-root",
29
29
  setup: (o, {
30
30
  slots: e
31
31
  }) => {
32
32
  J(o.editor);
33
- const t = g(O, {});
33
+ const t = y(O, {});
34
34
  return o.editorRef && (o.editorRef.get = () => t.editor.value, o.editorRef.dom = () => t.dom.value), () => {
35
- var i;
36
- return c("div", {
35
+ var n;
36
+ return l("div", {
37
37
  ref: t.dom
38
- }, [(i = e.default) == null ? void 0 : i.call(e)]);
38
+ }, [(n = e.default) == null ? void 0 : n.call(e)]);
39
39
  };
40
40
  }
41
41
  });
42
42
  V.props = ["editor", "editorRef"];
43
- const b = Symbol(), de = () => g(b), x = p({
43
+ const b = Symbol(), ae = () => y(b), x = v({
44
44
  name: "milkdown-node-container",
45
45
  setup: ({
46
46
  node: o,
47
47
  view: e,
48
48
  getPos: t,
49
- decorations: i,
50
- ctx: a,
51
- as: s
52
- }, r) => (w(b, {
53
- ctx: a,
49
+ decorations: n,
50
+ ctx: s,
51
+ as: a
52
+ }, r) => (k(b, {
53
+ ctx: s,
54
54
  node: o,
55
55
  view: e,
56
56
  getPos: t,
57
- decorations: i
57
+ decorations: n
58
58
  }), () => {
59
- var n, d;
60
- return K(s, {
59
+ var i, d;
60
+ return K(a, {
61
61
  "data-view-container": !0
62
- }, (d = (n = r.slots).default) == null ? void 0 : d.call(n));
62
+ }, (d = (i = r.slots).default) == null ? void 0 : d.call(i));
63
63
  })
64
64
  });
65
65
  x.props = ["ctx", "editor", "node", "view", "getPos", "decorations", "as"];
66
- const R = p({
66
+ const N = v({
67
67
  name: "milkdown-content",
68
68
  setup: ({
69
69
  isInline: o
70
- }) => () => o ? c("span", {
70
+ }) => () => o ? l("span", {
71
71
  "data-view-content": !0
72
- }, null) : c("div", {
72
+ }, null) : l("div", {
73
73
  "data-view-content": !0
74
74
  }, null)
75
75
  });
76
- R.props = ["isInline"];
77
- const Q = H("abcedfghicklmn", 10), W = (o, e) => (t, i = {}) => (a) => (s, r, n, d) => new X(a, t, o, e, i, s, r, n, d);
76
+ N.props = ["isInline"];
77
+ const Q = H("abcedfghicklmn", 10), W = (o, e, t) => (n, s = {}) => (a) => (r, i, d, c) => new X(a, n, o, e, t, s, r, i, d, c);
78
78
  var P, D;
79
79
  class X {
80
- constructor(e, t, i, a, s, r, n, d, f) {
81
- v(this, "getPortal", () => {
80
+ constructor(e, t, n, s, a, r, i, d, c, m) {
81
+ g(this, "getPortal", () => {
82
82
  const e = this.component, t = this.options.as ? this.options.as : this.isInlineOrMark ? "span" : "div";
83
- return k(p({
83
+ return M(v({
84
84
  name: "milkdown-portal",
85
- setup: () => () => c(U, {
85
+ setup: () => () => l(U, {
86
86
  key: this.key,
87
87
  to: this.teleportDOM
88
88
  }, {
89
- default: () => [c(x, {
89
+ default: () => [l(x, {
90
90
  as: t,
91
91
  ctx: this.ctx,
92
92
  node: this.node,
@@ -94,8 +94,8 @@ class X {
94
94
  getPos: this.getPos,
95
95
  decorations: this.decorations
96
96
  }, {
97
- default: () => [c(e, null, {
98
- default: () => [c(R, {
97
+ default: () => [l(e, null, {
98
+ default: () => [l(N, {
99
99
  isInline: this.isInlineOrMark
100
100
  }, null)]
101
101
  })]
@@ -103,11 +103,11 @@ class X {
103
103
  })
104
104
  }));
105
105
  });
106
- v(this, "selectNode", (P = this.options) == null ? void 0 : P.selectNode);
107
- v(this, "deselectNode", (D = this.options) == null ? void 0 : D.deselectNode);
108
- this.ctx = e, this.component = t, this.addPortal = i, this.removePortalByKey = a, this.options = s, this.view = n, this.getPos = d, this.key = Q(), this.node = u(r), this.decorations = u(f);
109
- const h = s.as ? s.as : this.isInlineOrMark ? "span" : "div";
110
- this.teleportDOM = document.createElement(h), this.renderPortal();
106
+ g(this, "selectNode", (P = this.options) == null ? void 0 : P.selectNode);
107
+ g(this, "deselectNode", (D = this.options) == null ? void 0 : D.deselectNode);
108
+ this.ctx = e, this.component = t, this.rootInstance = n, this.addPortal = s, this.removePortalByKey = a, this.options = r, this.view = d, this.getPos = c, this.key = Q(), this.node = u(i), this.decorations = u(m);
109
+ const f = r.as ? r.as : this.isInlineOrMark ? "span" : "div";
110
+ this.teleportDOM = document.createElement(f), this.renderPortal();
111
111
  }
112
112
  get isInlineOrMark() {
113
113
  return this.node.value instanceof F || this.node.value.isInline;
@@ -124,7 +124,7 @@ class X {
124
124
  return;
125
125
  const e = this.getPortal();
126
126
  this.addPortal(e, this.key);
127
- const t = Z();
127
+ const t = this.rootInstance.value;
128
128
  t && t.update();
129
129
  }
130
130
  destroy() {
@@ -134,11 +134,11 @@ class X {
134
134
  ignoreMutation(e) {
135
135
  return this.options.ignoreMutation ? this.options.ignoreMutation(e) : !this.dom || !this.contentDOM || this.node instanceof I && (this.node.isLeaf || this.node.isAtom) ? !0 : !(e.type === "selection" || this.contentDOM === this.dom || this.contentDOM.contains(e.target));
136
136
  }
137
- update(e, t, i) {
137
+ update(e, t, n) {
138
138
  return (() => {
139
- var r, n;
139
+ var r, i;
140
140
  if (this.options.update) {
141
- const d = (n = (r = this.options).update) == null ? void 0 : n.call(r, e, t, i);
141
+ const d = (i = (r = this.options).update) == null ? void 0 : i.call(r, e, t, n);
142
142
  if (d != null)
143
143
  return d;
144
144
  }
@@ -149,9 +149,7 @@ class X {
149
149
  function Y(o) {
150
150
  return typeof o == "function" || Object.prototype.toString.call(o) === "[object Object]" && !q(o);
151
151
  }
152
- const M = {
153
- instance: null
154
- }, Z = () => M.instance, O = Symbol(), $ = `
152
+ const O = Symbol(), Z = `
155
153
  @milkdown/vue:
156
154
  Passing ref to VueEditor will soon be deprecated, please use:
157
155
 
@@ -165,77 +163,76 @@ effect(() => {
165
163
  })
166
164
 
167
165
  <VueEditor editor={editor} />
168
- `, ee = `
166
+ `, $ = `
169
167
  @milkdown/vue:
170
168
  Passing editor directly to VueEditor will soon be deprecated, please use:
171
169
 
172
170
  const { editor } = useEditor(/* creator */);
173
171
 
174
172
  <VueEditor editor={editor} />
175
- `, te = p({
173
+ `, ee = v({
176
174
  name: "milkdown-vue-root",
177
175
  setup: (o) => {
178
- const e = B([]), t = A();
176
+ const e = B([]), t = A(), n = u(null);
179
177
  L(() => {
180
- M.instance = t.ctx._;
178
+ n.value = t.ctx._;
181
179
  }), C(() => {
182
- M.instance = null;
180
+ n.value = null;
183
181
  });
184
- const i = k((l, m) => {
185
- e.push([m, l]);
186
- }), a = k((l) => {
187
- const m = e.findIndex((y) => y[0] === l);
188
- e.splice(m, 1);
189
- }), s = W(i, a);
190
- w(E, s);
191
- const r = Object.hasOwnProperty.call(o.editor, "getInstance"), {
192
- getEditorCallback: n,
193
- dom: d,
194
- editor: f,
195
- loading: h
196
- } = r ? o.editor.editor : o.editor;
182
+ const s = M((h, p) => {
183
+ e.push([p, h]);
184
+ }), a = M((h) => {
185
+ const p = e.findIndex((w) => w[0] === h);
186
+ e.splice(p, 1);
187
+ }), r = W(n, s, a);
188
+ k(E, r);
189
+ const i = Object.hasOwnProperty.call(o.editor, "getInstance"), {
190
+ getEditorCallback: d,
191
+ dom: c,
192
+ editor: m,
193
+ loading: f
194
+ } = i ? o.editor.editor : o.editor;
197
195
  return _(() => {
198
- r && console.warn(ee), o.editorRef && console.warn($);
199
- }), w(O, {
200
- dom: d,
201
- editor: f,
202
- loading: h
196
+ i && console.warn($), o.editorRef && console.warn(Z);
197
+ }), k(O, {
198
+ dom: c,
199
+ editor: m,
200
+ loading: f
203
201
  }), () => {
204
- const l = e.map(([m, y]) => c(y, {
205
- key: m
202
+ const h = e.map(([p, w]) => l(w, {
203
+ key: p
206
204
  }, null));
207
- return c(V, {
205
+ return l(V, {
208
206
  editorRef: o.editorRef,
209
- editor: n.value
210
- }, Y(l) ? l : {
211
- default: () => [l]
207
+ editor: d.value
208
+ }, Y(h) ? h : {
209
+ default: () => [h]
212
210
  });
213
211
  };
214
212
  }
215
213
  });
216
- te.props = ["editor", "editorRef"];
217
- const le = (o) => {
218
- const e = u(null), t = u(), i = u(!0), a = u((...s) => o(...s));
214
+ ee.props = ["editor", "editorRef"];
215
+ const de = (o) => {
216
+ const e = u(null), t = u(), n = u(!0), s = u((...a) => o(...a));
219
217
  return {
220
- loading: i,
218
+ loading: n,
221
219
  getInstance: () => t.value,
222
220
  getDom: () => e.value,
223
221
  editor: {
224
- getEditorCallback: a,
222
+ getEditorCallback: s,
225
223
  dom: e,
226
224
  editor: t,
227
- loading: i
225
+ loading: n
228
226
  }
229
227
  };
230
228
  };
231
229
  export {
232
- R as Content,
233
- te as VueEditor,
230
+ N as Content,
231
+ ee as VueEditor,
234
232
  x as VueNodeContainer,
235
233
  O as editorInfoCtxKey,
236
- Z as getRootInstance,
237
234
  b as nodeMetadata,
238
- le as useEditor,
239
- de as useNodeCtx
235
+ de as useEditor,
236
+ ae as useNodeCtx
240
237
  };
241
238
  //# sourceMappingURL=index.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.es.js","sources":["../src/useGetEditor.ts","../src/EditorComponent.tsx","../src/VueNode.tsx","../src/VueNodeView.tsx","../src/Editor.tsx","../src/useEditor.ts"],"sourcesContent":["/* Copyright 2021, Milkdown by Mirone. */\nimport { Ctx, editorViewCtx, rootCtx } from '@milkdown/core';\nimport { vueRendererCallOutOfScope } from '@milkdown/exception';\nimport { MarkViewConstructor, NodeViewConstructor } from '@milkdown/prose/view';\nimport { DefineComponent, inject, InjectionKey, onMounted, onUnmounted, ref } from 'vue';\n\nimport { editorInfoCtxKey } from '.';\nimport { EditorInfoCtx, GetEditor, RenderOptions, RenderVue } from './types';\n\nexport const rendererKey: InjectionKey<\n (component: DefineComponent, options?: RenderOptions) => (ctx: Ctx) => NodeViewConstructor | MarkViewConstructor\n> = Symbol();\n\nexport const useGetEditor = (getEditor: GetEditor) => {\n const renderVue = inject<RenderVue>(rendererKey, () => {\n throw vueRendererCallOutOfScope();\n });\n const { dom, loading, editor: editorRef } = inject(editorInfoCtxKey, {} as EditorInfoCtx);\n const lock = ref(false);\n\n onMounted(() => {\n if (!dom.value) return;\n\n const editor = getEditor(dom.value, renderVue);\n if (!editor) return;\n\n if (lock.value) return;\n\n loading.value = true;\n lock.value = true;\n\n editor\n .create()\n .then((editor) => {\n editorRef.value = editor;\n return;\n })\n .finally(() => {\n loading.value = false;\n lock.value = false;\n })\n .catch((e) => console.error(e));\n });\n onUnmounted(() => {\n const view = editorRef.value?.action((ctx) => ctx.get(editorViewCtx));\n const root = editorRef.value?.action((ctx) => ctx.get(rootCtx)) as HTMLElement;\n\n root?.firstChild?.remove();\n view?.destroy();\n });\n};\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Editor } from '@milkdown/core';\nimport { defineComponent, h, inject } from 'vue';\n\nimport { editorInfoCtxKey } from './Editor';\nimport { EditorInfoCtx, GetEditor } from './types';\nimport { useGetEditor } from './useGetEditor';\n\nexport const EditorComponent = defineComponent<{ editor: GetEditor; editorRef?: EditorRef }>({\n name: 'milkdown-dom-root',\n setup: (props, { slots }) => {\n useGetEditor(props.editor);\n const ctx = inject(editorInfoCtxKey, {} as EditorInfoCtx);\n\n if (props.editorRef) {\n props.editorRef.get = () => ctx.editor.value;\n props.editorRef.dom = () => ctx.dom.value;\n }\n\n return () => <div ref={ctx.dom}>{slots['default']?.()}</div>;\n },\n});\nEditorComponent['props'] = ['editor', 'editorRef'];\n\nexport type EditorRef = { get: () => Editor | undefined; dom: () => HTMLDivElement | null };\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Ctx } from '@milkdown/core';\nimport { Mark, Node } from '@milkdown/prose/model';\nimport { Decoration, EditorView } from '@milkdown/prose/view';\nimport { defineComponent, h, inject, InjectionKey, provide, Ref } from 'vue';\n\nexport type NodeContext<T extends Node | Mark = Node | Mark> = {\n ctx: Ctx;\n node: Ref<T>;\n view: EditorView;\n getPos: T extends Mark ? boolean : T extends Node ? () => number : boolean | (() => number);\n decorations: Ref<readonly Decoration[]>;\n};\n\nexport const nodeMetadata: InjectionKey<NodeContext> = Symbol();\n\nexport type UseNodeCtx = <T extends Node | Mark = Node | Mark>() => NodeContext<T>;\nexport const useNodeCtx: UseNodeCtx = () => inject(nodeMetadata) as NodeContext<never>;\n\nexport const VueNodeContainer = defineComponent<NodeContext & { as: string }>({\n name: 'milkdown-node-container',\n setup: ({ node, view, getPos, decorations, ctx, as }, context) => {\n provide(nodeMetadata, {\n ctx,\n node,\n view,\n getPos,\n decorations,\n });\n return () => h(as, { 'data-view-container': true }, context.slots['default']?.());\n },\n});\nVueNodeContainer['props'] = ['ctx', 'editor', 'node', 'view', 'getPos', 'decorations', 'as'];\n\nexport const Content = defineComponent<{ isInline?: boolean }>({\n name: 'milkdown-content',\n setup: ({ isInline }) => {\n return () => (isInline ? <span data-view-content /> : <div data-view-content />);\n },\n});\nContent['props'] = ['isInline'];\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Ctx } from '@milkdown/core';\nimport { Mark, Node } from '@milkdown/prose/model';\nimport type {\n Decoration,\n DecorationSource,\n EditorView,\n MarkViewConstructor,\n NodeView,\n NodeViewConstructor,\n} from '@milkdown/prose/view';\nimport { customAlphabet } from 'nanoid';\nimport { DefineComponent, defineComponent, h, markRaw, Ref, ref, Teleport } from 'vue';\n\nimport { getRootInstance } from '.';\nimport { Content, VueNodeContainer } from './VueNode';\n\nconst nanoid = customAlphabet('abcedfghicklmn', 10);\n\nexport type RenderOptions = Partial<\n {\n as: string;\n update?: (node: Node, decorations: readonly Decoration[], innerDecorations: DecorationSource) => boolean;\n } & Pick<NodeView, 'ignoreMutation' | 'deselectNode' | 'selectNode' | 'destroy'>\n>;\n\nexport const createVueView =\n (addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void) =>\n (\n component: DefineComponent,\n options: RenderOptions = {},\n ): ((ctx: Ctx) => NodeViewConstructor | MarkViewConstructor) =>\n (ctx) =>\n (node, view, getPos, decorations) =>\n new VueNodeView(ctx, component, addPortal, removePortalByKey, options, node, view, getPos, decorations);\n\nexport class VueNodeView implements NodeView {\n teleportDOM: HTMLElement;\n key: string;\n\n get isInlineOrMark() {\n return this.node.value instanceof Mark || this.node.value.isInline;\n }\n\n private node: Ref<Node | Mark>;\n private decorations: Ref<readonly Decoration[]>;\n\n constructor(\n private ctx: Ctx,\n private component: DefineComponent,\n private addPortal: (portal: DefineComponent, key: string) => void,\n private removePortalByKey: (key: string) => void,\n private options: RenderOptions,\n node: Node | Mark,\n private view: EditorView,\n private getPos: boolean | (() => number),\n decorations: readonly Decoration[],\n ) {\n this.key = nanoid();\n this.node = ref(node);\n this.decorations = ref(decorations);\n const elementName = options.as ? options.as : this.isInlineOrMark ? 'span' : 'div';\n this.teleportDOM = document.createElement(elementName);\n this.renderPortal();\n }\n\n get dom() {\n return (this.teleportDOM.firstElementChild || this.teleportDOM) as HTMLElement;\n }\n\n get contentDOM() {\n if (this.node instanceof Node && this.node.isLeaf) {\n return undefined;\n }\n\n return this.teleportDOM.querySelector<HTMLElement>('[data-view-content]') || this.dom;\n }\n\n getPortal = (): DefineComponent => {\n const CustomComponent = this.component;\n const elementName = this.options.as ? this.options.as : this.isInlineOrMark ? 'span' : 'div';\n return markRaw(\n defineComponent({\n name: 'milkdown-portal',\n setup: () => {\n return () => (\n <Teleport key={this.key} to={this.teleportDOM}>\n <VueNodeContainer\n as={elementName}\n ctx={this.ctx}\n node={this.node}\n view={this.view}\n getPos={this.getPos}\n decorations={this.decorations}\n >\n <CustomComponent>\n <Content isInline={this.isInlineOrMark} />\n </CustomComponent>\n </VueNodeContainer>\n </Teleport>\n );\n },\n }) as DefineComponent,\n );\n };\n\n renderPortal() {\n if (!this.teleportDOM) return;\n\n const Portal = this.getPortal();\n this.addPortal(Portal, this.key);\n const instance = getRootInstance();\n if (instance) {\n instance.update();\n }\n }\n\n destroy() {\n this.options.destroy?.();\n this.teleportDOM.remove();\n this.removePortalByKey(this.key);\n }\n\n ignoreMutation(mutation: MutationRecord) {\n if (this.options.ignoreMutation) {\n return this.options.ignoreMutation(mutation);\n }\n if (!this.dom || !this.contentDOM) {\n return true;\n }\n\n if (this.node instanceof Node) {\n if (this.node.isLeaf || this.node.isAtom) {\n return true;\n }\n }\n\n if ((mutation as unknown as { type: string }).type === 'selection') {\n return false;\n }\n\n if (this.contentDOM === this.dom) {\n return false;\n }\n\n if (this.contentDOM.contains(mutation.target)) {\n return false;\n }\n\n return true;\n }\n\n update(node: Node, decorations: readonly Decoration[], innerDecorations: DecorationSource) {\n const innerUpdate = () => {\n if (this.options.update) {\n const result = this.options.update?.(node, decorations, innerDecorations);\n if (result != null) {\n return result;\n }\n }\n if (this.node.value.type !== node.type) {\n return false;\n }\n\n if (node === this.node.value && this.decorations.value === decorations) {\n return true;\n }\n\n this.node.value = node;\n this.decorations.value = decorations;\n return true;\n };\n\n const shouldUpdate = innerUpdate();\n\n return shouldUpdate;\n }\n\n selectNode = this.options?.selectNode;\n\n deselectNode = this.options?.deselectNode;\n}\n","/* Copyright 2021, Milkdown by Mirone. */\nimport {\n ComponentInternalInstance,\n DefineComponent,\n defineComponent,\n effect,\n getCurrentInstance,\n h,\n InjectionKey,\n markRaw,\n onBeforeMount,\n onUnmounted,\n provide,\n shallowReactive,\n} from 'vue';\n\nimport { EditorComponent, EditorRef } from './EditorComponent';\nimport { EditorInfo, EditorInfoCtx } from './types';\nimport { rendererKey } from './useGetEditor';\nimport { createVueView } from './VueNodeView';\n\nconst rootInstance: {\n instance: null | ComponentInternalInstance;\n} = {\n instance: null,\n};\nexport const getRootInstance = () => {\n return rootInstance.instance;\n};\n\nexport const editorInfoCtxKey: InjectionKey<EditorInfoCtx> = Symbol();\n\nconst refDeprecatedInfo = `\n@milkdown/vue:\nPassing ref to VueEditor will soon be deprecated, please use:\n\nconst { editor, getInstance, getDom, loading } = useEditor(/* creator */);\n\neffect(() => {\n if (!loading) {\n const editor = getInstance();\n const rootDOM = getDom();\n }\n})\n\n<VueEditor editor={editor} />\n`;\n\nconst compositionDeprecatedInfo = `\n@milkdown/vue:\nPassing editor directly to VueEditor will soon be deprecated, please use:\n\nconst { editor } = useEditor(/* creator */);\n\n<VueEditor editor={editor} />\n`;\n\ntype PortalPair = [key: string, component: DefineComponent];\nexport const VueEditor = defineComponent<{ editor: EditorInfo; editorRef?: EditorRef }>({\n name: 'milkdown-vue-root',\n setup: (props) => {\n const portals = shallowReactive<PortalPair[]>([]);\n\n const instance = getCurrentInstance();\n\n onBeforeMount(() => {\n rootInstance.instance = (instance as ComponentInternalInstance & { ctx: { _: ComponentInternalInstance } })\n .ctx._ as ComponentInternalInstance;\n });\n\n onUnmounted(() => {\n rootInstance.instance = null;\n });\n\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\n provide(rendererKey, renderVue);\n\n const usingDeprecatedCompositionAPI = Object.hasOwnProperty.call(props.editor, 'getInstance');\n\n const { getEditorCallback, dom, editor, loading } = usingDeprecatedCompositionAPI\n ? // @ts-expect-error deprecated old composition API\n (props.editor.editor as EditorInfo)\n : props.editor;\n\n effect(() => {\n if (usingDeprecatedCompositionAPI) {\n console.warn(compositionDeprecatedInfo);\n }\n if (props.editorRef) {\n console.warn(refDeprecatedInfo);\n }\n });\n\n provide(editorInfoCtxKey, {\n dom,\n editor,\n loading,\n });\n\n return () => {\n const portalElements = portals.map(([id, P]) => <P key={id} />);\n return (\n <EditorComponent editorRef={props.editorRef} editor={getEditorCallback.value}>\n {portalElements}\n </EditorComponent>\n );\n };\n },\n});\nVueEditor['props'] = ['editor', 'editorRef'];\n","/* Copyright 2021, Milkdown by Mirone. */\n\nimport { Editor } from '@milkdown/core';\nimport { ref } from 'vue';\n\nimport { GetEditor, UseEditorReturn } from './types';\n\nexport const useEditor = (getEditor: GetEditor): UseEditorReturn => {\n const dom = ref<HTMLDivElement | null>(null);\n const editor = ref<Editor>();\n const loading = ref(true);\n const getEditorCallback = ref<GetEditor>((...args) => getEditor(...args));\n\n return {\n loading,\n getInstance: () => editor.value,\n getDom: () => dom.value,\n editor: {\n getEditorCallback,\n dom,\n editor,\n loading,\n },\n };\n};\n"],"names":["EditorComponent","defineComponent","name","setup","props","slots","useGetEditor","editor","ctx","inject","editorInfoCtxKey","editorRef","get","value","dom","_createVNode","nodeMetadata","Symbol","useNodeCtx","VueNodeContainer","node","view","getPos","decorations","as","context","provide","h","Content","isInline","nanoid","customAlphabet","createVueView","addPortal","removePortalByKey","component","options","VueNodeView","constructor","getPortal","CustomComponent","elementName","isInlineOrMark","markRaw","key","teleportDOM","selectNode","deselectNode","ref","document","createElement","renderPortal","Mark","firstElementChild","contentDOM","Node","isLeaf","querySelector","Portal","instance","getRootInstance","update","destroy","remove","ignoreMutation","mutation","isAtom","type","contains","target","innerDecorations","innerUpdate","result","rootInstance","refDeprecatedInfo","compositionDeprecatedInfo","VueEditor","portals","shallowReactive","getCurrentInstance","onBeforeMount","_","onUnmounted","push","index","findIndex","p","splice","renderVue","rendererKey","usingDeprecatedCompositionAPI","Object","hasOwnProperty","call","getEditorCallback","loading","effect","console","warn","portalElements","map","id","P"],"mappings":"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"}
1
+ {"version":3,"file":"index.es.js","sources":["../src/useGetEditor.ts","../src/EditorComponent.tsx","../src/VueNode.tsx","../src/VueNodeView.tsx","../src/Editor.tsx","../src/useEditor.ts"],"sourcesContent":["/* Copyright 2021, Milkdown by Mirone. */\nimport { Ctx, editorViewCtx, rootCtx } from '@milkdown/core';\nimport { vueRendererCallOutOfScope } from '@milkdown/exception';\nimport { MarkViewConstructor, NodeViewConstructor } from '@milkdown/prose/view';\nimport { DefineComponent, inject, InjectionKey, onMounted, onUnmounted, ref } from 'vue';\n\nimport { editorInfoCtxKey } from '.';\nimport { EditorInfoCtx, GetEditor, RenderOptions, RenderVue } from './types';\n\nexport const rendererKey: InjectionKey<\n (component: DefineComponent, options?: RenderOptions) => (ctx: Ctx) => NodeViewConstructor | MarkViewConstructor\n> = Symbol();\n\nexport const useGetEditor = (getEditor: GetEditor) => {\n const renderVue = inject<RenderVue>(rendererKey, () => {\n throw vueRendererCallOutOfScope();\n });\n const { dom, loading, editor: editorRef } = inject(editorInfoCtxKey, {} as EditorInfoCtx);\n const lock = ref(false);\n\n onMounted(() => {\n if (!dom.value) return;\n\n const editor = getEditor(dom.value, renderVue);\n if (!editor) return;\n\n if (lock.value) return;\n\n loading.value = true;\n lock.value = true;\n\n editor\n .create()\n .then((editor) => {\n editorRef.value = editor;\n return;\n })\n .finally(() => {\n loading.value = false;\n lock.value = false;\n })\n .catch((e) => console.error(e));\n });\n onUnmounted(() => {\n const view = editorRef.value?.action((ctx) => ctx.get(editorViewCtx));\n const root = editorRef.value?.action((ctx) => ctx.get(rootCtx)) as HTMLElement;\n\n root?.firstChild?.remove();\n view?.destroy();\n });\n};\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Editor } from '@milkdown/core';\nimport { defineComponent, h, inject } from 'vue';\n\nimport { editorInfoCtxKey } from './Editor';\nimport { EditorInfoCtx, GetEditor } from './types';\nimport { useGetEditor } from './useGetEditor';\n\nexport const EditorComponent = defineComponent<{ editor: GetEditor; editorRef?: EditorRef }>({\n name: 'milkdown-dom-root',\n setup: (props, { slots }) => {\n useGetEditor(props.editor);\n const ctx = inject(editorInfoCtxKey, {} as EditorInfoCtx);\n\n if (props.editorRef) {\n props.editorRef.get = () => ctx.editor.value;\n props.editorRef.dom = () => ctx.dom.value;\n }\n\n return () => <div ref={ctx.dom}>{slots['default']?.()}</div>;\n },\n});\nEditorComponent['props'] = ['editor', 'editorRef'];\n\nexport type EditorRef = { get: () => Editor | undefined; dom: () => HTMLDivElement | null };\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Ctx } from '@milkdown/core';\nimport { Mark, Node } from '@milkdown/prose/model';\nimport { Decoration, EditorView } from '@milkdown/prose/view';\nimport { defineComponent, h, inject, InjectionKey, provide, Ref } from 'vue';\n\nexport type NodeContext<T extends Node | Mark = Node | Mark> = {\n ctx: Ctx;\n node: Ref<T>;\n view: EditorView;\n getPos: T extends Mark ? boolean : T extends Node ? () => number : boolean | (() => number);\n decorations: Ref<readonly Decoration[]>;\n};\n\nexport const nodeMetadata: InjectionKey<NodeContext> = Symbol();\n\nexport type UseNodeCtx = <T extends Node | Mark = Node | Mark>() => NodeContext<T>;\nexport const useNodeCtx: UseNodeCtx = () => inject(nodeMetadata) as NodeContext<never>;\n\nexport const VueNodeContainer = defineComponent<NodeContext & { as: string }>({\n name: 'milkdown-node-container',\n setup: ({ node, view, getPos, decorations, ctx, as }, context) => {\n provide(nodeMetadata, {\n ctx,\n node,\n view,\n getPos,\n decorations,\n });\n return () => h(as, { 'data-view-container': true }, context.slots['default']?.());\n },\n});\nVueNodeContainer['props'] = ['ctx', 'editor', 'node', 'view', 'getPos', 'decorations', 'as'];\n\nexport const Content = defineComponent<{ isInline?: boolean }>({\n name: 'milkdown-content',\n setup: ({ isInline }) => {\n return () => (isInline ? <span data-view-content /> : <div data-view-content />);\n },\n});\nContent['props'] = ['isInline'];\n","/* Copyright 2021, Milkdown by Mirone. */\nimport { Ctx } from '@milkdown/core';\nimport { Mark, Node } from '@milkdown/prose/model';\nimport type {\n Decoration,\n DecorationSource,\n EditorView,\n MarkViewConstructor,\n NodeView,\n NodeViewConstructor,\n} from '@milkdown/prose/view';\nimport { customAlphabet } from 'nanoid';\nimport { ComponentInternalInstance, DefineComponent, defineComponent, h, markRaw, Ref, ref, Teleport } from 'vue';\n\nimport { Content, VueNodeContainer } from './VueNode';\n\nconst nanoid = customAlphabet('abcedfghicklmn', 10);\n\nexport type RenderOptions = Partial<\n {\n as: string;\n update?: (node: Node, decorations: readonly Decoration[], innerDecorations: DecorationSource) => boolean;\n } & Pick<NodeView, 'ignoreMutation' | 'deselectNode' | 'selectNode' | 'destroy'>\n>;\n\nexport const createVueView =\n (\n rootInstance: Ref<null | ComponentInternalInstance>,\n addPortal: (portal: DefineComponent, key: string) => void,\n removePortalByKey: (key: string) => void,\n ) =>\n (\n component: DefineComponent,\n options: RenderOptions = {},\n ): ((ctx: Ctx) => NodeViewConstructor | MarkViewConstructor) =>\n (ctx) =>\n (node, view, getPos, decorations) =>\n new VueNodeView(\n ctx,\n component,\n rootInstance,\n addPortal,\n removePortalByKey,\n options,\n node,\n view,\n getPos,\n decorations,\n );\n\nexport class VueNodeView implements NodeView {\n teleportDOM: HTMLElement;\n key: string;\n\n get isInlineOrMark() {\n return this.node.value instanceof Mark || this.node.value.isInline;\n }\n\n private node: Ref<Node | Mark>;\n private decorations: Ref<readonly Decoration[]>;\n\n constructor(\n private ctx: Ctx,\n private component: DefineComponent,\n private rootInstance: Ref<null | ComponentInternalInstance>,\n private addPortal: (portal: DefineComponent, key: string) => void,\n private removePortalByKey: (key: string) => void,\n private options: RenderOptions,\n node: Node | Mark,\n private view: EditorView,\n private getPos: boolean | (() => number),\n decorations: readonly Decoration[],\n ) {\n this.key = nanoid();\n this.node = ref(node);\n this.decorations = ref(decorations);\n const elementName = options.as ? options.as : this.isInlineOrMark ? 'span' : 'div';\n this.teleportDOM = document.createElement(elementName);\n this.renderPortal();\n }\n\n get dom() {\n return (this.teleportDOM.firstElementChild || this.teleportDOM) as HTMLElement;\n }\n\n get contentDOM() {\n if (this.node instanceof Node && this.node.isLeaf) {\n return undefined;\n }\n\n return this.teleportDOM.querySelector<HTMLElement>('[data-view-content]') || this.dom;\n }\n\n getPortal = (): DefineComponent => {\n const CustomComponent = this.component;\n const elementName = this.options.as ? this.options.as : this.isInlineOrMark ? 'span' : 'div';\n return markRaw(\n defineComponent({\n name: 'milkdown-portal',\n setup: () => {\n return () => (\n <Teleport key={this.key} to={this.teleportDOM}>\n <VueNodeContainer\n as={elementName}\n ctx={this.ctx}\n node={this.node}\n view={this.view}\n getPos={this.getPos}\n decorations={this.decorations}\n >\n <CustomComponent>\n <Content isInline={this.isInlineOrMark} />\n </CustomComponent>\n </VueNodeContainer>\n </Teleport>\n );\n },\n }) as DefineComponent,\n );\n };\n\n renderPortal() {\n if (!this.teleportDOM) return;\n\n const Portal = this.getPortal();\n this.addPortal(Portal, this.key);\n const instance = this.rootInstance.value;\n if (instance) {\n instance.update();\n }\n }\n\n destroy() {\n this.options.destroy?.();\n this.teleportDOM.remove();\n this.removePortalByKey(this.key);\n }\n\n ignoreMutation(mutation: MutationRecord) {\n if (this.options.ignoreMutation) {\n return this.options.ignoreMutation(mutation);\n }\n if (!this.dom || !this.contentDOM) {\n return true;\n }\n\n if (this.node instanceof Node) {\n if (this.node.isLeaf || this.node.isAtom) {\n return true;\n }\n }\n\n if ((mutation as unknown as { type: string }).type === 'selection') {\n return false;\n }\n\n if (this.contentDOM === this.dom) {\n return false;\n }\n\n if (this.contentDOM.contains(mutation.target)) {\n return false;\n }\n\n return true;\n }\n\n update(node: Node, decorations: readonly Decoration[], innerDecorations: DecorationSource) {\n const innerUpdate = () => {\n if (this.options.update) {\n const result = this.options.update?.(node, decorations, innerDecorations);\n if (result != null) {\n return result;\n }\n }\n if (this.node.value.type !== node.type) {\n return false;\n }\n\n if (node === this.node.value && this.decorations.value === decorations) {\n return true;\n }\n\n this.node.value = node;\n this.decorations.value = decorations;\n return true;\n };\n\n const shouldUpdate = innerUpdate();\n\n return shouldUpdate;\n }\n\n selectNode = this.options?.selectNode;\n\n deselectNode = this.options?.deselectNode;\n}\n","/* Copyright 2021, Milkdown by Mirone. */\nimport {\n ComponentInternalInstance,\n DefineComponent,\n defineComponent,\n effect,\n getCurrentInstance,\n h,\n InjectionKey,\n markRaw,\n onBeforeMount,\n onUnmounted,\n provide,\n ref,\n shallowReactive,\n} from 'vue';\n\nimport { EditorComponent, EditorRef } from './EditorComponent';\nimport { EditorInfo, EditorInfoCtx } from './types';\nimport { rendererKey } from './useGetEditor';\nimport { createVueView } from './VueNodeView';\n\nexport const editorInfoCtxKey: InjectionKey<EditorInfoCtx> = Symbol();\n\nconst refDeprecatedInfo = `\n@milkdown/vue:\nPassing ref to VueEditor will soon be deprecated, please use:\n\nconst { editor, getInstance, getDom, loading } = useEditor(/* creator */);\n\neffect(() => {\n if (!loading) {\n const editor = getInstance();\n const rootDOM = getDom();\n }\n})\n\n<VueEditor editor={editor} />\n`;\n\nconst compositionDeprecatedInfo = `\n@milkdown/vue:\nPassing editor directly to VueEditor will soon be deprecated, please use:\n\nconst { editor } = useEditor(/* creator */);\n\n<VueEditor editor={editor} />\n`;\n\ntype PortalPair = [key: string, component: DefineComponent];\nexport const VueEditor = defineComponent<{ editor: EditorInfo; editorRef?: EditorRef }>({\n name: 'milkdown-vue-root',\n setup: (props) => {\n const portals = shallowReactive<PortalPair[]>([]);\n\n const instance = getCurrentInstance();\n\n const rootInstance = ref<null | ComponentInternalInstance>(null);\n\n onBeforeMount(() => {\n rootInstance.value = (instance as ComponentInternalInstance & { ctx: { _: ComponentInternalInstance } }).ctx\n ._ as ComponentInternalInstance;\n });\n\n onUnmounted(() => {\n rootInstance.value = null;\n });\n\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(rootInstance, addPortal, removePortalByKey);\n\n provide(rendererKey, renderVue);\n\n const usingDeprecatedCompositionAPI = Object.hasOwnProperty.call(props.editor, 'getInstance');\n\n const { getEditorCallback, dom, editor, loading } = usingDeprecatedCompositionAPI\n ? // @ts-expect-error deprecated old composition API\n (props.editor.editor as EditorInfo)\n : props.editor;\n\n effect(() => {\n if (usingDeprecatedCompositionAPI) {\n console.warn(compositionDeprecatedInfo);\n }\n if (props.editorRef) {\n console.warn(refDeprecatedInfo);\n }\n });\n\n provide(editorInfoCtxKey, {\n dom,\n editor,\n loading,\n });\n\n return () => {\n const portalElements = portals.map(([id, P]) => <P key={id} />);\n return (\n <EditorComponent editorRef={props.editorRef} editor={getEditorCallback.value}>\n {portalElements}\n </EditorComponent>\n );\n };\n },\n});\nVueEditor['props'] = ['editor', 'editorRef'];\n","/* Copyright 2021, Milkdown by Mirone. */\n\nimport { Editor } from '@milkdown/core';\nimport { ref } from 'vue';\n\nimport { GetEditor, UseEditorReturn } from './types';\n\nexport const useEditor = (getEditor: GetEditor): UseEditorReturn => {\n const dom = ref<HTMLDivElement | null>(null);\n const editor = ref<Editor>();\n const loading = ref(true);\n const getEditorCallback = ref<GetEditor>((...args) => getEditor(...args));\n\n return {\n loading,\n getInstance: () => editor.value,\n getDom: () => dom.value,\n editor: {\n getEditorCallback,\n dom,\n editor,\n loading,\n },\n };\n};\n"],"names":["EditorComponent","defineComponent","name","setup","props","slots","useGetEditor","editor","ctx","inject","editorInfoCtxKey","editorRef","get","value","dom","_createVNode","nodeMetadata","Symbol","useNodeCtx","VueNodeContainer","node","view","getPos","decorations","as","context","provide","h","Content","isInline","nanoid","customAlphabet","createVueView","rootInstance","addPortal","removePortalByKey","component","options","VueNodeView","constructor","getPortal","CustomComponent","elementName","isInlineOrMark","markRaw","key","teleportDOM","selectNode","deselectNode","ref","document","createElement","renderPortal","Mark","firstElementChild","contentDOM","Node","isLeaf","querySelector","Portal","instance","update","destroy","remove","ignoreMutation","mutation","isAtom","type","contains","target","innerDecorations","innerUpdate","result","refDeprecatedInfo","compositionDeprecatedInfo","VueEditor","portals","shallowReactive","getCurrentInstance","onBeforeMount","_","onUnmounted","push","index","findIndex","p","splice","renderVue","rendererKey","usingDeprecatedCompositionAPI","Object","hasOwnProperty","call","getEditorCallback","loading","effect","console","warn","portalElements","map","id","P"],"mappings":";;;;;;;;AASO,MAAM,IAET,OAAO,GAEE,IAAe,CAAC,MAAyB;AAC5C,QAAA,IAAY,EAAkB,GAAa,MAAM;AACnD,UAAM,EAA0B;AAAA,EAAA,CACnC,GACK,EAAE,QAAK,YAAS,QAAQ,MAAc,EAAO,GAAkB,CAAA,CAAmB,GAClF,IAAO,EAAI,EAAK;AAEtB,IAAU,MAAM;AACZ,QAAI,CAAC,EAAI;AAAO;AAEhB,UAAM,IAAS,EAAU,EAAI,OAAO,CAAS;AAC7C,IAAI,CAAC,KAED,EAAK,SAET,GAAQ,QAAQ,IAChB,EAAK,QAAQ,IAEb,EACK,OAAO,EACP,KAAK,CAAC,MAAW;AACd,QAAU,QAAQ;AAAA,IAClB,CACH,EACA,QAAQ,MAAM;AACX,QAAQ,QAAQ,IAChB,EAAK,QAAQ;AAAA,IAAA,CAChB,EACA,MAAM,CAAC,MAAM,QAAQ,MAAM,CAAC,CAAC;AAAA,EAAA,CACrC,GACD,EAAY,MAAM;;AACR,UAAA,IAAO,OAAU,UAAV,kBAAiB,OAAO,CAAC,MAAQ,EAAI,IAAI,CAAa,IAC7D,IAAO,OAAU,UAAV,kBAAiB,OAAO,CAAC,MAAQ,EAAI,IAAI,CAAO;AAE7D,gCAAM,eAAN,UAAkB,UAClB,eAAM;AAAA,EAAQ,CACjB;AACL,GC1CaA,IAAkBC,EAA8D;AAAA,EACzFC,MAAM;AAAA,EACNC,OAAO,CAACC,GAAO;AAAA,IAAEC;AAAAA,QAAY;AACzBC,MAAaF,EAAMG,MAAP;AACZ,UAAMC,IAAMC,EAAOC,GAAkB,CAAnB,CAAA;AAElB,WAAIN,EAAMO,aACNP,GAAMO,UAAUC,MAAM,MAAMJ,EAAID,OAAOM,OACvCT,EAAMO,UAAUG,MAAM,MAAMN,EAAIM,IAAID,QAGjC,MAAA;;AAAAE,eAAA,OAAA;AAAA,QAAA,KAAgBP,EAAIM;AAAAA,MAApB,GAAA,CAA0BT,OAAM,YAANA,yBAA1B,CAAP;AAAA;AAAA,EACH;AAZwF,CAA/C;AAc9CL,EAAgB,QAAW,CAAC,UAAU,WAAX;ACRdgB,MAAAA,IAA0CC,OAAhD,GAGMC,KAAyB,MAAMT,EAAOO,CAAD,GAErCG,IAAmBlB,EAA8C;AAAA,EAC1EC,MAAM;AAAA,EACNC,OAAO,CAAC;AAAA,IAAEiB;AAAAA,IAAMC;AAAAA,IAAMC;AAAAA,IAAQC;AAAAA,IAAaf;AAAAA,IAAKgB;AAAAA,KAAMC,MAClDC,GAAQV,GAAc;AAAA,IAClBR;AAAAA,IACAY;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EALkB,CAAf,GAOA,MAAA;;AAAMI,aAAEH,GAAI;AAAA,MAAE,uBAAuB;AAAA,IAA9B,GAAsCC,YAAQpB,OAAM,YAAdoB,yBAAtC;AAAA;AAVwD,CAA/B;AAa/CN,EAAiB,QAAW,CAAC,OAAO,UAAU,QAAQ,QAAQ,UAAU,eAAe,IAA3D;AAEfS,MAAAA,IAAU3B,EAAwC;AAAA,EAC3DC,MAAM;AAAA,EACNC,OAAO,CAAC;AAAA,IAAE0B;AAAAA,QACC,MAAOA,IAAQd,EAAA,QAAA;AAAA,IAAA,qBAAA;AAAA,EAAA,GAAA,IAAA,IAAAA,EAAA,OAAA;AAAA,IAAA,qBAAA;AAAA,EAAtB,GAAA,IAAA;AAHuD,CAAzB;AAMtCa,EAAQ,QAAW,CAAC,UAAD;ACxBnB,MAAME,IAASC,EAAe,kBAAkB,EAAnB,GAShBC,IACT,CACIC,GACAC,GACAC,MAEJ,CACIC,GACAC,IAAyB,CAF7B,MAIC7B,OACD,CAACY,GAAMC,GAAMC,GAAQC,MACjB,IAAIe,EACA9B,GACA4B,GACAH,GACAC,GACAC,GACAE,GACAjB,GACAC,GACAC,GACAC,CAVJ;;AAaD,MAAMe,EAAgC;AAAA,EAWzCC,YACY/B,GACA4B,GACAH,GACAC,GACAC,GACAE,GACRjB,GACQC,GACAC,GACRC,GACF;AAqBFiB,yBAAY,MAAuB;AAC/B,YAAMC,IAAkB,KAAKL,WACvBM,IAAc,KAAKL,QAAQb,KAAK,KAAKa,QAAQb,KAAK,KAAKmB,iBAAiB,SAAS;AACvF,aAAOC,EACH3C,EAAgB;AAAA,QACZC,MAAM;AAAA,QACNC,OAAO,MACI,MAAAY,EAAA,GAAA;AAAA,UAAA,KACY,KAAK8B;AAAAA,UADjB,IAC0B,KAAKC;AAAAA,QAD/B,GAAA;AAAA,UAAA,SAAA,MAAA,CAAA/B,EAAA,GAAA;AAAA,YAAA,IAGS2B;AAAAA,YAHT,KAIU,KAAKlC;AAAAA,YAJf,MAKW,KAAKY;AAAAA,YALhB,MAMW,KAAKC;AAAAA,YANhB,QAOa,KAAKC;AAAAA,YAPlB,aAQkB,KAAKC;AAAAA,UARvB,GAAA;AAAA,YAAA,SAAA,MAAA,CAAAR,EAAA,GAAA,MAAA;AAAA,cAAA,SAAA,MAAA,CAAAA,EAAA,GAAA;AAAA,gBAAA,UAW4B,KAAK4B;AAAAA,cAXjC,GAAA,IAAA,CAAA;AAAA,YAAA,CAAA,CAAA;AAAA,UAAA,CAAA,CAAA;AAAA,SAAP;AAAA,MAHO,CAAA,CADL;AAAA;AAiGlBI,0BAAa,UAAKV,YAAL,kBAAcU;AAE3BC,4BAAe,UAAKX,YAAL,kBAAcW;AA3H3B,SAVUxC,MAAAA,GAUV,KATU4B,YAAAA,GASV,KARUH,eAAAA,GAQV,KAPUC,YAAAA,GAOV,KANUC,oBAAAA,GAMV,KALUE,UAAAA,GAKV,KAHUhB,OAAAA,GAGV,KAFUC,SAAAA,GAGR,KAAKuB,MAAMf,KACX,KAAKV,OAAO6B,EAAI7B,CAAD,GACf,KAAKG,cAAc0B,EAAI1B,CAAD;AACtB,UAAMmB,IAAcL,EAAQb,KAAKa,EAAQb,KAAK,KAAKmB,iBAAiB,SAAS;AAC7E,SAAKG,cAAcI,SAASC,cAAcT,CAAvB,GACnB,KAAKU,aAAL;AAAA,EACH;AAAA,EAzBiB,IAAdT,iBAAiB;AACjB,WAAO,KAAKvB,KAAKP,iBAAiBwC,KAAQ,KAAKjC,KAAKP,MAAMgB;AAAAA,EAC7D;AAAA,EAyBM,IAAHf,MAAM;AACN,WAAQ,KAAKgC,YAAYQ,qBAAqB,KAAKR;AAAAA,EACtD;AAAA,EAEa,IAAVS,aAAa;AACb,QAAI,OAAKnC,gBAAgBoC,KAAQ,KAAKpC,KAAKqC;AAI3C,aAAO,KAAKX,YAAYY,cAA2B,qBAA5C,KAAsE,KAAK5C;AAAAA,EACrF;AAAA,EA8BDsC,eAAe;AACX,QAAI,CAAC,KAAKN;AAAa;AAEvB,UAAMa,IAAS,KAAKnB;AACpB,SAAKN,UAAUyB,GAAQ,KAAKd,GAA5B;AACA,UAAMe,IAAW,KAAK3B,aAAapB;AACnC,IAAI+C,KACAA,EAASC,OAAT;AAAA,EAEP;AAAA,EAEDC,UAAU;;AACN,mBAAKzB,SAAQyB,YAAb,mBACA,KAAKhB,YAAYiB,UACjB,KAAK5B,kBAAkB,KAAKU,GAA5B;AAAA,EACH;AAAA,EAEDmB,eAAeC,GAA0B;AACrC,WAAI,KAAK5B,QAAQ2B,iBACN,KAAK3B,QAAQ2B,eAAeC,CAA5B,IAEP,CAAC,KAAKnD,OAAO,CAAC,KAAKyC,cAInB,KAAKnC,gBAAgBoC,KACjB,MAAKpC,KAAKqC,UAAU,KAAKrC,KAAK8C,UACvB,KAIVD,IAAyCE,SAAS,eAInD,KAAKZ,eAAe,KAAKzC,OAIzB,KAAKyC,WAAWa,SAASH,EAASI,MAAlC;AAAA,EAKP;AAAA,EAEDR,OAAOzC,GAAYG,GAAoC+C,GAAoC;AAuBvF,WAFqBC,AApBD,OAAM;;AACtB,UAAI,KAAKlC,QAAQwB,QAAQ;AACrB,cAAMW,IAAS,eAAKnC,SAAQwB,WAAb,0BAAsBzC,GAAMG,GAAa+C;AACxD,YAAIE,KAAU;AACV,iBAAOA;AAAAA,MAEd;AACD,aAAI,KAAKpD,KAAKP,MAAMsD,SAAS/C,EAAK+C,OACvB,KAGP/C,OAAS,KAAKA,KAAKP,SAAS,KAAKU,YAAYV,UAAUU,KAI3D,MAAKH,KAAKP,QAAQO,GAClB,KAAKG,YAAYV,QAAQU,IAClB;AAAA;EAMd;AA7IwC;;;;AC5BhCb,MAAAA,IAAgDO,OAAtD,GAEDwD,IAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAgBrBC,IAA6B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUtBC,KAAY1E,EAA+D;AAAA,EACpFC,MAAM;AAAA,EACNC,OAAQC,OAAU;AACd,UAAMwE,IAAUC,EAA8B,CAAA,CAAf,GAEzBjB,IAAWkB,KAEX7C,IAAegB,EAAsC,IAAnC;AAExB8B,MAAc,MAAM;AAChB9C,QAAapB,QAAS+C,EAAmFpD,IACpGwE;AAAAA,IACR,CAHY,GAKbC,EAAY,MAAM;AACdhD,QAAapB,QAAQ;AAAA,IACxB,CAFU;AAIX,UAAMqB,IAAYU,EAAQ,CAACR,GAA4BS,MAAgB;AACnE+B,QAAQM,KAAK,CAACrC,GAAKT,CAAN,CAAb;AAAA,IACH,CAFwB,GAGnBD,IAAoBS,EAASC,OAAgB;AAC/C,YAAMsC,IAAQP,EAAQQ,UAAWC,OAAMA,EAAE,OAAOxC,CAAlC;AACd+B,QAAQU,OAAOH,GAAO,CAAtB;AAAA,IACH,CAHgC,GAI3BI,IAAYvD,EAAcC,GAAcC,GAAWC,CAA1B;AAE/BT,MAAQ8D,GAAaD,CAAd;AAEP,UAAME,IAAgCC,OAAOC,eAAeC,KAAKxF,EAAMG,QAAQ,aAAzC,GAEhC;AAAA,MAAEsF;AAAAA,MAAmB/E;AAAAA,MAAKP;AAAAA,MAAQuF;AAAAA,QAAYL,IAE7CrF,EAAMG,OAAOA,SACdH,EAAMG;AAEZwF,aAAO,MAAM;AACT,MAAIN,KACAO,QAAQC,KAAKvB,CAAb,GAEAtE,EAAMO,aACNqF,QAAQC,KAAKxB,CAAb;AAAA,IAEP,CAPK,GASN/C,EAAQhB,GAAkB;AAAA,MACtBI;AAAAA,MACAP;AAAAA,MACAuF;AAAAA,IAHsB,CAAnB,GAMA,MAAM;AACT,YAAMI,IAAiBtB,EAAQuB,IAAI,CAAC,CAACC,GAAIC,OAANtF,EAAA,GAAA;AAAA,QAAA,KAAqBqF;AAAAA,MAArB,GAAA,IAAA,CAAZ;AACvB,aAAArF,EAAA,GAAA;AAAA,QAAA,WACgCX,EAAMO;AAAAA,QADtC,QACyDkF,EAAkBhF;AAAAA,SAClEqF,EAAAA,CAFT,IAESA,IAFT;AAAA,QAAA,SAAA,MAAA,CAESA,CAFT;AAAA,MAAA,CAAA;AAAA;EAMP;AA3DmF,CAAhD;AA6DxCvB,GAAU,QAAW,CAAC,UAAU,WAAX;ACxGR,MAAA,KAAY,CAAC,MAA0C;AAC1D,QAAA,IAAM,EAA2B,IAAI,GACrC,IAAS,KACT,IAAU,EAAI,EAAI,GAClB,IAAoB,EAAe,IAAI,MAAS,EAAU,GAAG,CAAI,CAAC;AAEjE,SAAA;AAAA,IACH;AAAA,IACA,aAAa,MAAM,EAAO;AAAA,IAC1B,QAAQ,MAAM,EAAI;AAAA,IAClB,QAAQ;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACJ;AAAA,EAAA;AAER;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@milkdown/vue",
3
- "version": "6.4.0",
3
+ "version": "6.4.1",
4
4
  "type": "module",
5
5
  "main": "./lib/index.es.js",
6
6
  "types": "./lib/index.d.ts",
@@ -16,8 +16,8 @@
16
16
  "vue"
17
17
  ],
18
18
  "dependencies": {
19
- "@milkdown/utils": "6.4.0",
20
- "@milkdown/exception": "6.4.0",
19
+ "@milkdown/utils": "6.4.1",
20
+ "@milkdown/exception": "6.4.1",
21
21
  "nanoid": "^4.0.0",
22
22
  "tslib": "^2.4.0"
23
23
  },
@@ -27,8 +27,8 @@
27
27
  "vue": "^3.0.0"
28
28
  },
29
29
  "devDependencies": {
30
- "@milkdown/core": "6.4.0",
31
- "@milkdown/prose": "6.4.0",
30
+ "@milkdown/core": "6.4.1",
31
+ "@milkdown/prose": "6.4.1",
32
32
  "vue": "^3.2.38"
33
33
  },
34
34
  "nx": {
package/src/Editor.tsx CHANGED
@@ -11,6 +11,7 @@ import {
11
11
  onBeforeMount,
12
12
  onUnmounted,
13
13
  provide,
14
+ ref,
14
15
  shallowReactive,
15
16
  } from 'vue';
16
17
 
@@ -19,15 +20,6 @@ import { EditorInfo, EditorInfoCtx } from './types';
19
20
  import { rendererKey } from './useGetEditor';
20
21
  import { createVueView } from './VueNodeView';
21
22
 
22
- const rootInstance: {
23
- instance: null | ComponentInternalInstance;
24
- } = {
25
- instance: null,
26
- };
27
- export const getRootInstance = () => {
28
- return rootInstance.instance;
29
- };
30
-
31
23
  export const editorInfoCtxKey: InjectionKey<EditorInfoCtx> = Symbol();
32
24
 
33
25
  const refDeprecatedInfo = `
@@ -63,13 +55,15 @@ export const VueEditor = defineComponent<{ editor: EditorInfo; editorRef?: Edito
63
55
 
64
56
  const instance = getCurrentInstance();
65
57
 
58
+ const rootInstance = ref<null | ComponentInternalInstance>(null);
59
+
66
60
  onBeforeMount(() => {
67
- rootInstance.instance = (instance as ComponentInternalInstance & { ctx: { _: ComponentInternalInstance } })
68
- .ctx._ as ComponentInternalInstance;
61
+ rootInstance.value = (instance as ComponentInternalInstance & { ctx: { _: ComponentInternalInstance } }).ctx
62
+ ._ as ComponentInternalInstance;
69
63
  });
70
64
 
71
65
  onUnmounted(() => {
72
- rootInstance.instance = null;
66
+ rootInstance.value = null;
73
67
  });
74
68
 
75
69
  const addPortal = markRaw((component: DefineComponent, key: string) => {
@@ -79,7 +73,7 @@ export const VueEditor = defineComponent<{ editor: EditorInfo; editorRef?: Edito
79
73
  const index = portals.findIndex((p) => p[0] === key);
80
74
  portals.splice(index, 1);
81
75
  });
82
- const renderVue = createVueView(addPortal, removePortalByKey);
76
+ const renderVue = createVueView(rootInstance, addPortal, removePortalByKey);
83
77
 
84
78
  provide(rendererKey, renderVue);
85
79
 
@@ -10,9 +10,8 @@ import type {
10
10
  NodeViewConstructor,
11
11
  } from '@milkdown/prose/view';
12
12
  import { customAlphabet } from 'nanoid';
13
- import { DefineComponent, defineComponent, h, markRaw, Ref, ref, Teleport } from 'vue';
13
+ import { ComponentInternalInstance, DefineComponent, defineComponent, h, markRaw, Ref, ref, Teleport } from 'vue';
14
14
 
15
- import { getRootInstance } from '.';
16
15
  import { Content, VueNodeContainer } from './VueNode';
17
16
 
18
17
  const nanoid = customAlphabet('abcedfghicklmn', 10);
@@ -25,14 +24,29 @@ export type RenderOptions = Partial<
25
24
  >;
26
25
 
27
26
  export const createVueView =
28
- (addPortal: (portal: DefineComponent, key: string) => void, removePortalByKey: (key: string) => void) =>
27
+ (
28
+ rootInstance: Ref<null | ComponentInternalInstance>,
29
+ addPortal: (portal: DefineComponent, key: string) => void,
30
+ removePortalByKey: (key: string) => void,
31
+ ) =>
29
32
  (
30
33
  component: DefineComponent,
31
34
  options: RenderOptions = {},
32
35
  ): ((ctx: Ctx) => NodeViewConstructor | MarkViewConstructor) =>
33
36
  (ctx) =>
34
37
  (node, view, getPos, decorations) =>
35
- new VueNodeView(ctx, component, addPortal, removePortalByKey, options, node, view, getPos, decorations);
38
+ new VueNodeView(
39
+ ctx,
40
+ component,
41
+ rootInstance,
42
+ addPortal,
43
+ removePortalByKey,
44
+ options,
45
+ node,
46
+ view,
47
+ getPos,
48
+ decorations,
49
+ );
36
50
 
37
51
  export class VueNodeView implements NodeView {
38
52
  teleportDOM: HTMLElement;
@@ -48,6 +62,7 @@ export class VueNodeView implements NodeView {
48
62
  constructor(
49
63
  private ctx: Ctx,
50
64
  private component: DefineComponent,
65
+ private rootInstance: Ref<null | ComponentInternalInstance>,
51
66
  private addPortal: (portal: DefineComponent, key: string) => void,
52
67
  private removePortalByKey: (key: string) => void,
53
68
  private options: RenderOptions,
@@ -109,7 +124,7 @@ export class VueNodeView implements NodeView {
109
124
 
110
125
  const Portal = this.getPortal();
111
126
  this.addPortal(Portal, this.key);
112
- const instance = getRootInstance();
127
+ const instance = this.rootInstance.value;
113
128
  if (instance) {
114
129
  instance.update();
115
130
  }