@wrdagency/blockout 1.0.11 → 1.0.13

package/dist/components/controls/markdown-control/editor.js

@@ -1,35 +1,35 @@
-import { jsx as L, jsxs as ge } from "react/jsx-runtime";
+import { jsx as C, jsxs as ge } from "react/jsx-runtime";
 import { cn as ye } from "../../../utils/css.js";
-import { r as T, w as ve, c as we, d as be, a as W, h as S, b as F, p as Me, E as Ie, l as ke, e as Ee, f as Le } from "../../../toolbar-CCiZ_PIy.js";
-import { $ as X, d as Pe, T as Y, a as ee, s as Ce, g as Oe, b as j, P as z, h as te, i as Te, j as Se, k as _e, l as Ae, m as De, M as je, n as Ne, o as ne, q as G, r as xe, I as Ue, S as Fe, t as Be, E as qe, u as ze, v as $e, w as He } from "../../../index-EPj3dCzl.js";
-import { l as Ke, c as Re, g as We, w as Ge } from "../../../commands-IQnqt4xL.js";
+import { r as T, w as ve, c as we, d as be, a as W, h as S, b as F, p as Ie, E as Me, l as ke, e as Ee, f as Ce } from "../../../toolbar-CCiZ_PIy.js";
+import { $ as X, d as Le, T as Y, a as ee, s as Pe, g as Oe, b as N, P as z, h as te, i as Te, j as Se, k as _e, l as Ae, m as De, M as Ne, n as je, o as ne, q as G, r as xe, I as Ue, S as Fe, t as Be, E as qe, e as ze, u as $e, v as He, w as Ke } from "../../../index-EPj3dCzl.js";
+import { l as Re, c as We, g as Ge, w as Ve } from "../../../commands-IQnqt4xL.js";
 import '../../../assets/prosemirror.css';/* empty css                            */
-import { d as Ve, M as Je, a as Ze, b as Qe } from "../../../index-CwFPDtaz.js";
-import { P as Xe } from "../../../base-jB1DIMnz.js";
-import "react";
-import { useMentionsPlugin as Ye } from "./slash/mentions.js";
-var et = Object.defineProperty, V = Object.getOwnPropertySymbols, tt = Object.prototype.hasOwnProperty, nt = Object.prototype.propertyIsEnumerable, J = (n, e, t) => e in n ? et(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, rt = (n, e) => {
+import { d as Je, M as Ze, a as Qe, u as Xe, b as Ye } from "../../../index-CwFPDtaz.js";
+import { P as et } from "../../../base-jB1DIMnz.js";
+import { useEffect as tt } from "react";
+import { useMentionsPlugin as nt } from "./slash/mentions.js";
+var rt = Object.defineProperty, V = Object.getOwnPropertySymbols, st = Object.prototype.hasOwnProperty, it = Object.prototype.propertyIsEnumerable, J = (n, e, t) => e in n ? rt(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, ot = (n, e) => {
   for (var t in e || (e = {}))
-    tt.call(e, t) && J(n, t, e[t]);
+    st.call(e, t) && J(n, t, e[t]);
   if (V)
     for (var t of V(e))
-      nt.call(e, t) && J(n, t, e[t]);
+      it.call(e, t) && J(n, t, e[t]);
   return n;
 };
 function re(n, e) {
   return Object.assign(n, {
-    meta: rt({
+    meta: ot({
       package: "@milkdown/components"
     }, e)
   }), n;
 }
-const st = {
+const at = {
   renderLabel: ({ label: n, listType: e, checked: t }) => t == null ? e === "bullet" ? "⦿" : n : t ? "☑" : "□"
-}, N = X(
-  st,
+}, j = X(
+  at,
   "listItemBlockConfigCtx"
 );
-re(N, {
+re(j, {
   displayName: "Config<list-item-block>",
   group: "ListItemBlock"
 });
@@ -39,7 +39,7 @@ function se({ icon: n, class: e, onClick: t }) {
     {
       class: F("milkdown-icon", e),
       onPointerdown: t,
-      innerHTML: n ? Me.sanitize(n.trim()) : void 0
+      innerHTML: n ? Ie.sanitize(n.trim()) : void 0
     }
   );
 }
@@ -57,7 +57,7 @@ se.props = {
     required: !1
   }
 };
-const it = be({
+const lt = be({
   props: {
     label: {
       type: Object,
@@ -100,13 +100,13 @@ const it = be({
     readonly: r,
     setAttr: i,
     onMount: o,
-    selected: a
+    selected: l
   }) {
-    const l = (u) => {
-      u != null && u instanceof Element && o(u);
-    }, c = (u) => {
-      u.stopPropagation(), u.preventDefault(), e.value != null && i("checked", !e.value);
-    }, f = W(() => s.renderLabel({
+    const a = (c) => {
+      c != null && c instanceof Element && o(c);
+    }, u = (c) => {
+      c.stopPropagation(), c.preventDefault(), e.value != null && i("checked", !e.value);
+    }, d = W(() => s.renderLabel({
       label: n.value,
       listType: t.value,
       checked: e.value,
@@ -117,14 +117,14 @@ const it = be({
       {
         class: F(
           "list-item",
-          a.value && "ProseMirror-selectednode"
+          l.value && "ProseMirror-selectednode"
         )
       },
       /* @__PURE__ */ S(
         "div",
         {
           class: "label-wrapper",
-          onPointerdown: c,
+          onPointerdown: u,
           contenteditable: !1
         },
         /* @__PURE__ */ S(
@@ -135,39 +135,39 @@ const it = be({
               r.value && "readonly",
               p.value
             ),
-            icon: f.value
+            icon: d.value
           }
         )
       ),
-      /* @__PURE__ */ S("div", { class: "children", ref: l })
+      /* @__PURE__ */ S("div", { class: "children", ref: a })
     );
   }
-}), ie = Pe(
-  Ke.node,
+}), ie = Le(
+  Re.node,
   (n) => (e, t, s) => {
     const r = document.createElement("div");
     r.className = "milkdown-list-item-block";
     const i = document.createElement("div");
     i.setAttribute("data-content-dom", "true"), i.classList.add("content-dom");
-    const o = T(e.attrs.label), a = T(e.attrs.checked), l = T(e.attrs.listType), c = T(!t.editable), f = n.get(N.key), p = T(!1), u = (d, E) => {
+    const o = T(e.attrs.label), l = T(e.attrs.checked), a = T(e.attrs.listType), u = T(!t.editable), d = n.get(j.key), p = T(!1), c = (f, E) => {
       if (!t.editable) return;
       const w = s();
-      w != null && (t.hasFocus() || t.focus(), t.dispatch(t.state.tr.setNodeAttribute(w, d, E)));
+      w != null && (t.hasFocus() || t.focus(), t.dispatch(t.state.tr.setNodeAttribute(w, f, E)));
     }, h = ve(() => {
       p.value ? r.classList.add("selected") : r.classList.remove("selected");
     });
     let g = 0;
-    const b = we(it, {
+    const b = we(lt, {
       label: o,
-      checked: a,
-      listType: l,
-      readonly: c,
-      config: f,
+      checked: l,
+      listType: a,
+      readonly: u,
+      config: d,
       selected: p,
-      setAttr: u,
-      onMount: (d) => {
+      setAttr: c,
+      onMount: (f) => {
         const { anchor: E, head: w } = t.state.selection;
-        d.appendChild(i);
+        f.appendChild(i);
         const _ = t.state.doc.resolve(E), he = t.state.doc.resolve(w);
         g = requestAnimationFrame(() => {
           if (cancelAnimationFrame(g), !_.doc.eq(t.state.doc)) return;
@@ -177,16 +177,16 @@ const it = be({
       }
     });
     b.mount(r);
-    const O = (d) => {
-      l.value = d.attrs.listType, o.value = d.attrs.label, a.value = d.attrs.checked, c.value = !t.editable;
+    const O = (f) => {
+      a.value = f.attrs.listType, o.value = f.attrs.label, l.value = f.attrs.checked, u.value = !t.editable;
     };
     O(e);
     let k = e;
     return {
       dom: r,
       contentDOM: i,
-      update: (d) => d.type !== e.type ? !1 : (d.sameMarkup(k) && d.content.eq(k.content) || (k = d, O(d)), !0),
-      ignoreMutation: (d) => !r || !i ? !0 : d.type === "selection" ? !1 : i === d.target && d.type === "attributes" ? !0 : !i.contains(d.target),
+      update: (f) => f.type !== e.type ? !1 : (f.sameMarkup(k) && f.content.eq(k.content) || (k = f, O(f)), !0),
+      ignoreMutation: (f) => !r || !i ? !0 : f.type === "selection" ? !1 : i === f.target && f.type === "attributes" ? !0 : !i.contains(f.target),
       selectNode: () => {
         p.value = !0;
       },
@@ -203,8 +203,8 @@ re(ie, {
   displayName: "NodeView<list-item-block>",
   group: "ListItemBlock"
 });
-const ot = [
-  N,
+const pt = [
+  j,
   ie
 ];
 function B(n) {
@@ -214,7 +214,7 @@ function B(n) {
   const e = n.content;
   return e ? B(e) : n.type === "text";
 }
-function at(n, e) {
+function ct(n, e) {
   return Object.assign(n, {
     meta: {
       package: "@milkdown/plugin-clipboard",
@@ -223,51 +223,51 @@ function at(n, e) {
   }), n;
 }
 const oe = ee((n) => {
-  const e = n.get(Ce);
+  const e = n.get(Pe);
   n.update(Oe, (r) => ({
     ...r,
     editable: r.editable ?? (() => !0)
   }));
-  const t = new j("MILKDOWN_CLIPBOARD");
+  const t = new N("MILKDOWN_CLIPBOARD");
   return new z({
     key: t,
     props: {
       handlePaste: (r, i) => {
         var O, k;
-        const o = n.get(Te), a = (k = (O = r.props).editable) == null ? void 0 : k.call(O, r.state), { clipboardData: l } = i;
-        if (!a || !l || r.state.selection.$from.node().type.spec.code) return !1;
-        const f = l.getData("text/plain"), p = l.getData("vscode-editor-data");
+        const o = n.get(Te), l = (k = (O = r.props).editable) == null ? void 0 : k.call(O, r.state), { clipboardData: a } = i;
+        if (!l || !a || r.state.selection.$from.node().type.spec.code) return !1;
+        const d = a.getData("text/plain"), p = a.getData("vscode-editor-data");
         if (p) {
-          const d = JSON.parse(p), E = d == null ? void 0 : d.mode;
-          if (f && E) {
+          const f = JSON.parse(p), E = f == null ? void 0 : f.mode;
+          if (d && E) {
             const { tr: w } = r.state, _ = Se("code_block", e);
             return w.replaceSelectionWith(_.create({ language: E })).setSelection(
               Y.near(
                 w.doc.resolve(Math.max(0, w.selection.from - 2))
               )
-            ).insertText(f.replace(/\r\n?/g, `
+            ).insertText(d.replace(/\r\n?/g, `
 `)), r.dispatch(w), !0;
           }
         }
-        const u = l.getData("text/html");
-        if (u.length === 0 && f.length === 0) return !1;
+        const c = a.getData("text/html");
+        if (c.length === 0 && d.length === 0) return !1;
         const h = _e.fromSchema(e);
         let g;
-        if (u.length === 0) {
-          const d = o(f);
-          if (!d || typeof d == "string") return !1;
+        if (c.length === 0) {
+          const f = o(d);
+          if (!f || typeof f == "string") return !1;
           g = Ae.fromSchema(e).serializeFragment(
-            d.content
+            f.content
           );
         } else {
-          const d = document.createElement("template");
-          d.innerHTML = u, g = d.content.cloneNode(!0), d.remove();
+          const f = document.createElement("template");
+          f.innerHTML = c, g = f.content.cloneNode(!0), f.remove();
         }
-        const C = h.parseSlice(g), b = De(C);
+        const P = h.parseSlice(g), b = De(P);
         if (b)
           return r.dispatch(r.state.tr.replaceSelectionWith(b, !0)), !0;
         try {
-          return r.dispatch(r.state.tr.replaceSelection(C)), !0;
+          return r.dispatch(r.state.tr.replaceSelection(P)), !0;
         } catch {
           return !1;
         }
@@ -282,13 +282,13 @@ const oe = ee((n) => {
 
 `
           );
-        const a = e.topNodeType.createAndFill(void 0, r.content);
-        return a ? i(a) : "";
+        const l = e.topNodeType.createAndFill(void 0, r.content);
+        return l ? i(l) : "";
       }
     }
   });
 });
-at(oe, { displayName: "Prose<clipboard>" });
+ct(oe, { displayName: "Prose<clipboard>" });
 var D = 200, m = function() {
 };
 m.prototype.append = function(e) {
@@ -298,7 +298,7 @@ m.prototype.prepend = function(e) {
   return e.length ? m.from(e).append(this) : this;
 };
 m.prototype.appendInner = function(e) {
-  return new lt(this, e);
+  return new ut(this, e);
 };
 m.prototype.slice = function(e, t) {
   return e === void 0 && (e = 0), t === void 0 && (t = this.length), e >= t ? m.empty : this.sliceInner(Math.max(0, e), Math.min(this.length, t));
@@ -332,13 +332,13 @@ var ae = /* @__PURE__ */ function(n) {
     return r == 0 && i == this.length ? this : new e(this.values.slice(r, i));
   }, e.prototype.getInner = function(r) {
     return this.values[r];
-  }, e.prototype.forEachInner = function(r, i, o, a) {
-    for (var l = i; l < o; l++)
-      if (r(this.values[l], a + l) === !1)
+  }, e.prototype.forEachInner = function(r, i, o, l) {
+    for (var a = i; a < o; a++)
+      if (r(this.values[a], l + a) === !1)
         return !1;
-  }, e.prototype.forEachInvertedInner = function(r, i, o, a) {
-    for (var l = i - 1; l >= o; l--)
-      if (r(this.values[l], a + l) === !1)
+  }, e.prototype.forEachInvertedInner = function(r, i, o, l) {
+    for (var a = i - 1; a >= o; a--)
+      if (r(this.values[a], l + a) === !1)
         return !1;
   }, e.prototype.leafAppend = function(r) {
     if (this.length + r.length <= D)
@@ -353,7 +353,7 @@ var ae = /* @__PURE__ */ function(n) {
   }, Object.defineProperties(e.prototype, t), e;
 }(m);
 m.empty = new ae([]);
-var lt = /* @__PURE__ */ function(n) {
+var ut = /* @__PURE__ */ function(n) {
   function e(t, s) {
     n.call(this), this.left = t, this.right = s, this.length = t.length + s.length, this.depth = Math.max(t.depth, s.depth) + 1;
   }
@@ -362,12 +362,12 @@ var lt = /* @__PURE__ */ function(n) {
   }, e.prototype.getInner = function(s) {
     return s < this.left.length ? this.left.get(s) : this.right.get(s - this.left.length);
   }, e.prototype.forEachInner = function(s, r, i, o) {
-    var a = this.left.length;
-    if (r < a && this.left.forEachInner(s, r, Math.min(i, a), o) === !1 || i > a && this.right.forEachInner(s, Math.max(r - a, 0), Math.min(this.length, i) - a, o + a) === !1)
+    var l = this.left.length;
+    if (r < l && this.left.forEachInner(s, r, Math.min(i, l), o) === !1 || i > l && this.right.forEachInner(s, Math.max(r - l, 0), Math.min(this.length, i) - l, o + l) === !1)
       return !1;
   }, e.prototype.forEachInvertedInner = function(s, r, i, o) {
-    var a = this.left.length;
-    if (r > a && this.right.forEachInvertedInner(s, r - a, Math.max(i, a) - a, o + a) === !1 || i < a && this.left.forEachInvertedInner(s, Math.min(r, a), i, o) === !1)
+    var l = this.left.length;
+    if (r > l && this.right.forEachInvertedInner(s, r - l, Math.max(i, l) - l, o + l) === !1 || i < l && this.left.forEachInvertedInner(s, Math.min(r, l), i, o) === !1)
       return !1;
   }, e.prototype.sliceInner = function(s, r) {
     if (s == 0 && r == this.length)
@@ -386,7 +386,7 @@ var lt = /* @__PURE__ */ function(n) {
     return this.left.depth >= Math.max(this.right.depth, s.depth) + 1 ? new e(this.left, new e(this.right, s)) : new e(this, s);
   }, e;
 }(m);
-const pt = 500;
+const dt = 500;
 class y {
   constructor(e, t) {
     this.items = e, this.eventCount = t;
@@ -404,34 +404,34 @@ class y {
       }
     let r, i;
     t && (r = this.remapping(s, this.items.length), i = r.maps.length);
-    let o = e.tr, a, l, c = [], f = [];
-    return this.items.forEach((p, u) => {
+    let o = e.tr, l, a, u = [], d = [];
+    return this.items.forEach((p, c) => {
       if (!p.step) {
-        r || (r = this.remapping(s, u + 1), i = r.maps.length), i--, f.push(p);
+        r || (r = this.remapping(s, c + 1), i = r.maps.length), i--, d.push(p);
         return;
       }
       if (r) {
-        f.push(new v(p.map));
+        d.push(new v(p.map));
         let h = p.step.map(r.slice(i)), g;
-        h && o.maybeStep(h).doc && (g = o.mapping.maps[o.mapping.maps.length - 1], c.push(new v(g, void 0, void 0, c.length + f.length))), i--, g && r.appendMap(g, i);
+        h && o.maybeStep(h).doc && (g = o.mapping.maps[o.mapping.maps.length - 1], u.push(new v(g, void 0, void 0, u.length + d.length))), i--, g && r.appendMap(g, i);
       } else
         o.maybeStep(p.step);
       if (p.selection)
-        return a = r ? p.selection.map(r.slice(i)) : p.selection, l = new y(this.items.slice(0, s).append(f.reverse().concat(c)), this.eventCount - 1), !1;
-    }, this.items.length, 0), { remaining: l, transform: o, selection: a };
+        return l = r ? p.selection.map(r.slice(i)) : p.selection, a = new y(this.items.slice(0, s).append(d.reverse().concat(u)), this.eventCount - 1), !1;
+    }, this.items.length, 0), { remaining: a, transform: o, selection: l };
   }
   // Create a new branch with the given transform added.
   addTransform(e, t, s, r) {
-    let i = [], o = this.eventCount, a = this.items, l = !r && a.length ? a.get(a.length - 1) : null;
-    for (let f = 0; f < e.steps.length; f++) {
-      let p = e.steps[f].invert(e.docs[f]), u = new v(e.mapping.maps[f], p, t), h;
-      (h = l && l.merge(u)) && (u = h, f ? i.pop() : a = a.slice(0, a.length - 1)), i.push(u), t && (o++, t = void 0), r || (l = u);
+    let i = [], o = this.eventCount, l = this.items, a = !r && l.length ? l.get(l.length - 1) : null;
+    for (let d = 0; d < e.steps.length; d++) {
+      let p = e.steps[d].invert(e.docs[d]), c = new v(e.mapping.maps[d], p, t), h;
+      (h = a && a.merge(c)) && (c = h, d ? i.pop() : l = l.slice(0, l.length - 1)), i.push(c), t && (o++, t = void 0), r || (a = c);
     }
-    let c = o - s.depth;
-    return c > ct && (a = ut(a, c), o -= c), new y(a.append(i), o);
+    let u = o - s.depth;
+    return u > ht && (l = ft(l, u), o -= u), new y(l.append(i), o);
   }
   remapping(e, t) {
-    let s = new je();
+    let s = new Ne();
     return this.items.forEach((r, i) => {
       let o = r.mirrorOffset != null && i - r.mirrorOffset >= e ? s.maps.length - r.mirrorOffset : void 0;
       s.appendMap(r.map, o);
@@ -447,28 +447,28 @@ class y {
   rebased(e, t) {
     if (!this.eventCount)
       return this;
-    let s = [], r = Math.max(0, this.items.length - t), i = e.mapping, o = e.steps.length, a = this.eventCount;
-    this.items.forEach((u) => {
-      u.selection && a--;
+    let s = [], r = Math.max(0, this.items.length - t), i = e.mapping, o = e.steps.length, l = this.eventCount;
+    this.items.forEach((c) => {
+      c.selection && l--;
     }, r);
-    let l = t;
-    this.items.forEach((u) => {
-      let h = i.getMirror(--l);
+    let a = t;
+    this.items.forEach((c) => {
+      let h = i.getMirror(--a);
       if (h == null)
         return;
       o = Math.min(o, h);
       let g = i.maps[h];
-      if (u.step) {
-        let C = e.steps[h].invert(e.docs[h]), b = u.selection && u.selection.map(i.slice(l + 1, h));
-        b && a++, s.push(new v(g, C, b));
+      if (c.step) {
+        let P = e.steps[h].invert(e.docs[h]), b = c.selection && c.selection.map(i.slice(a + 1, h));
+        b && l++, s.push(new v(g, P, b));
       } else
         s.push(new v(g));
     }, r);
-    let c = [];
-    for (let u = t; u < o; u++)
-      c.push(new v(i.maps[u]));
-    let f = this.items.slice(0, r).append(c).append(s), p = new y(f, a);
-    return p.emptyItemCount() > pt && (p = p.compress(this.items.length - s.length)), p;
+    let u = [];
+    for (let c = t; c < o; c++)
+      u.push(new v(i.maps[c]));
+    let d = this.items.slice(0, r).append(u).append(s), p = new y(d, l);
+    return p.emptyItemCount() > dt && (p = p.compress(this.items.length - s.length)), p;
   }
   emptyItemCount() {
     let e = 0;
@@ -484,23 +484,23 @@ class y {
   // order to associate old items with rebased steps.
   compress(e = this.items.length) {
     let t = this.remapping(0, e), s = t.maps.length, r = [], i = 0;
-    return this.items.forEach((o, a) => {
-      if (a >= e)
+    return this.items.forEach((o, l) => {
+      if (l >= e)
         r.push(o), o.selection && i++;
       else if (o.step) {
-        let l = o.step.map(t.slice(s)), c = l && l.getMap();
-        if (s--, c && t.appendMap(c, s), l) {
-          let f = o.selection && o.selection.map(t.slice(s));
-          f && i++;
-          let p = new v(c.invert(), l, f), u, h = r.length - 1;
-          (u = r.length && r[h].merge(p)) ? r[h] = u : r.push(p);
+        let a = o.step.map(t.slice(s)), u = a && a.getMap();
+        if (s--, u && t.appendMap(u, s), a) {
+          let d = o.selection && o.selection.map(t.slice(s));
+          d && i++;
+          let p = new v(u.invert(), a, d), c, h = r.length - 1;
+          (c = r.length && r[h].merge(p)) ? r[h] = c : r.push(p);
         }
       } else o.map && s--;
     }, this.items.length, 0), new y(m.from(r.reverse()), i);
   }
 }
 y.empty = new y(m.empty, 0);
-function ut(n, e) {
+function ft(n, e) {
   let t;
   return n.forEach((s, r) => {
     if (s.selection && e-- == 0)
@@ -519,28 +519,28 @@ class v {
     }
   }
 }
-class M {
+class I {
   constructor(e, t, s, r, i) {
     this.done = e, this.undone = t, this.prevRanges = s, this.prevTime = r, this.prevComposition = i;
   }
 }
-const ct = 20;
-function dt(n, e, t, s) {
-  let r = t.getMeta(I), i;
+const ht = 20;
+function mt(n, e, t, s) {
+  let r = t.getMeta(M), i;
   if (r)
     return r.historyState;
-  t.getMeta(mt) && (n = new M(n.done, n.undone, null, 0, -1));
+  t.getMeta(vt) && (n = new I(n.done, n.undone, null, 0, -1));
   let o = t.getMeta("appendedTransaction");
   if (t.steps.length == 0)
     return n;
-  if (o && o.getMeta(I))
-    return o.getMeta(I).redo ? new M(n.done.addTransform(t, void 0, s, A(e)), n.undone, Z(t.mapping.maps), n.prevTime, n.prevComposition) : new M(n.done, n.undone.addTransform(t, void 0, s, A(e)), null, n.prevTime, n.prevComposition);
+  if (o && o.getMeta(M))
+    return o.getMeta(M).redo ? new I(n.done.addTransform(t, void 0, s, A(e)), n.undone, Z(t.mapping.maps), n.prevTime, n.prevComposition) : new I(n.done, n.undone.addTransform(t, void 0, s, A(e)), null, n.prevTime, n.prevComposition);
   if (t.getMeta("addToHistory") !== !1 && !(o && o.getMeta("addToHistory") === !1)) {
-    let a = t.getMeta("composition"), l = n.prevTime == 0 || !o && n.prevComposition != a && (n.prevTime < (t.time || 0) - s.newGroupDelay || !ft(t, n.prevRanges)), c = o ? x(n.prevRanges, t.mapping) : Z(t.mapping.maps);
-    return new M(n.done.addTransform(t, l ? e.selection.getBookmark() : void 0, s, A(e)), y.empty, c, t.time, a ?? n.prevComposition);
-  } else return (i = t.getMeta("rebased")) ? new M(n.done.rebased(t, i), n.undone.rebased(t, i), x(n.prevRanges, t.mapping), n.prevTime, n.prevComposition) : new M(n.done.addMaps(t.mapping.maps), n.undone.addMaps(t.mapping.maps), x(n.prevRanges, t.mapping), n.prevTime, n.prevComposition);
+    let l = t.getMeta("composition"), a = n.prevTime == 0 || !o && n.prevComposition != l && (n.prevTime < (t.time || 0) - s.newGroupDelay || !gt(t, n.prevRanges)), u = o ? x(n.prevRanges, t.mapping) : Z(t.mapping.maps);
+    return new I(n.done.addTransform(t, a ? e.selection.getBookmark() : void 0, s, A(e)), y.empty, u, t.time, l ?? n.prevComposition);
+  } else return (i = t.getMeta("rebased")) ? new I(n.done.rebased(t, i), n.undone.rebased(t, i), x(n.prevRanges, t.mapping), n.prevTime, n.prevComposition) : new I(n.done.addMaps(t.mapping.maps), n.undone.addMaps(t.mapping.maps), x(n.prevRanges, t.mapping), n.prevTime, n.prevComposition);
 }
-function ft(n, e) {
+function gt(n, e) {
   if (!e)
     return !1;
   if (!n.docChanged)
@@ -567,12 +567,12 @@ function x(n, e) {
   }
   return t;
 }
-function ht(n, e, t) {
-  let s = A(e), r = I.get(e).spec.config, i = (t ? n.undone : n.done).popEvent(e, s);
+function yt(n, e, t) {
+  let s = A(e), r = M.get(e).spec.config, i = (t ? n.undone : n.done).popEvent(e, s);
   if (!i)
     return null;
-  let o = i.selection.resolve(i.transform.doc), a = (t ? n.done : n.undone).addTransform(i.transform, e.selection.getBookmark(), r, s), l = new M(t ? a : i.remaining, t ? i.remaining : a, null, 0, -1);
-  return i.transform.setSelection(o).setMeta(I, { redo: t, historyState: l });
+  let o = i.selection.resolve(i.transform.doc), l = (t ? n.done : n.undone).addTransform(i.transform, e.selection.getBookmark(), r, s), a = new I(t ? l : i.remaining, t ? i.remaining : l, null, 0, -1);
+  return i.transform.setSelection(o).setMeta(M, { redo: t, historyState: a });
 }
 let U = !1, Q = null;
 function A(n) {
@@ -587,26 +587,26 @@ function A(n) {
   }
   return U;
 }
-const I = new j("history"), mt = new j("closeHistory");
-function gt(n = {}) {
+const M = new N("history"), vt = new N("closeHistory");
+function wt(n = {}) {
   return n = {
     depth: n.depth || 100,
     newGroupDelay: n.newGroupDelay || 500
   }, new z({
-    key: I,
+    key: M,
     state: {
       init() {
-        return new M(y.empty, y.empty, null, 0, -1);
+        return new I(y.empty, y.empty, null, 0, -1);
       },
       apply(e, t, s) {
-        return dt(t, s, e, n);
+        return mt(t, s, e, n);
       }
     },
     config: n,
     props: {
       handleDOMEvents: {
         beforeinput(e, t) {
-          let s = t.inputType, r = s == "historyUndo" ? pe : s == "historyRedo" ? ue : null;
+          let s = t.inputType, r = s == "historyUndo" ? pe : s == "historyRedo" ? ce : null;
           return !r || !e.editable ? !1 : (t.preventDefault(), r(e.state, e.dispatch));
         }
       }
@@ -615,18 +615,18 @@ function gt(n = {}) {
 }
 function le(n, e) {
   return (t, s) => {
-    let r = I.getState(t);
+    let r = M.getState(t);
     if (!r || (n ? r.undone : r.done).eventCount == 0)
       return !1;
     if (s) {
-      let i = ht(r, t, n);
+      let i = yt(r, t, n);
       i && s(e ? i.scrollIntoView() : i);
     }
     return !0;
   };
 }
-const pe = le(!1, !0), ue = le(!0, !0);
-function P(n, e) {
+const pe = le(!1, !0), ce = le(!0, !0);
+function L(n, e) {
   return Object.assign(n, {
     meta: {
       package: "@milkdown/plugin-history",
@@ -635,24 +635,24 @@ function P(n, e) {
   }), n;
 }
 const $ = ne("Undo", () => () => pe);
-P($, {
+L($, {
   displayName: "Command<undo>"
 });
-const H = ne("Redo", () => () => ue);
-P(H, {
+const H = ne("Redo", () => () => ce);
+L(H, {
   displayName: "Command<redo>"
 });
 const K = X({}, "historyProviderConfig");
-P(K, {
+L(K, {
   displayName: "Ctx<historyProviderConfig>"
 });
-const ce = ee(
-  (n) => gt(n.get(K.key))
+const ue = ee(
+  (n) => wt(n.get(K.key))
 );
-P(ce, {
+L(ue, {
   displayName: "Ctx<historyProviderPlugin>"
 });
-const R = Ne("historyKeymap", {
+const R = je("historyKeymap", {
   Undo: {
     shortcuts: "Mod-z",
     command: (n) => {
@@ -668,15 +668,15 @@ const R = Ne("historyKeymap", {
     }
   }
 });
-P(R.ctx, {
+L(R.ctx, {
   displayName: "KeymapCtx<history>"
 });
-P(R.shortcuts, {
+L(R.shortcuts, {
   displayName: "Keymap<history>"
 });
-const yt = [
+const bt = [
   K,
-  ce,
+  ue,
   R,
   $,
   H
@@ -728,78 +728,90 @@ class de {
 const q = xe(
   new de(),
   "listener"
-), vt = new j("MILKDOWN_LISTENER"), fe = (n) => (n.inject(q, new de()), async () => {
+), It = new N("MILKDOWN_LISTENER"), fe = (n) => (n.inject(q, new de()), async () => {
   await n.wait(Ue);
   const e = n.get(q), { listeners: t } = e;
-  t.beforeMount.forEach((l) => l(n)), await n.wait(Fe);
+  t.beforeMount.forEach((a) => a(n)), await n.wait(Fe);
   const s = n.get(te);
   let r = null, i = null, o = null;
-  const a = new z({
-    key: vt,
+  const l = new z({
+    key: It,
     view: () => ({
       destroy: () => {
-        t.destroy.forEach((l) => l(n));
+        t.destroy.forEach((a) => a(n));
       }
     }),
     props: {
       handleDOMEvents: {
-        focus: () => (t.focus.forEach((l) => l(n)), !1),
-        blur: () => (t.blur.forEach((l) => l(n)), !1)
+        focus: () => (t.focus.forEach((a) => a(n)), !1),
+        blur: () => (t.blur.forEach((a) => a(n)), !1)
       }
     },
     state: {
-      init: (l, c) => {
-        r = c.doc, i = s(c.doc);
+      init: (a, u) => {
+        r = u.doc, i = s(u.doc);
       },
-      apply: (l) => {
-        const c = l.selection;
-        return (!o && c || o && !c.eq(o)) && (t.selectionUpdated.forEach((p) => {
-          p(n, c, o);
-        }), o = c), !(l.docChanged || l.storedMarksSet) || l.getMeta("addToHistory") === !1 ? void 0 : Ve(() => {
-          const { doc: p } = l;
-          if (t.updated.length > 0 && r && !r.eq(p) && t.updated.forEach((u) => {
-            u(n, p, r);
+      apply: (a) => {
+        const u = a.selection;
+        return (!o && u || o && !u.eq(o)) && (t.selectionUpdated.forEach((p) => {
+          p(n, u, o);
+        }), o = u), !(a.docChanged || a.storedMarksSet) || a.getMeta("addToHistory") === !1 ? void 0 : Je(() => {
+          const { doc: p } = a;
+          if (t.updated.length > 0 && r && !r.eq(p) && t.updated.forEach((c) => {
+            c(n, p, r);
           }), t.markdownUpdated.length > 0 && r && !r.eq(p)) {
-            const u = s(p);
+            const c = s(p);
             t.markdownUpdated.forEach((h) => {
-              h(n, u, i);
-            }), i = u;
+              h(n, c, i);
+            }), i = c;
           }
           r = p;
         }, 200)();
       }
     }
   });
-  n.update(Be, (l) => l.concat(a)), await n.wait(qe), t.mounted.forEach((l) => l(n));
+  n.update(Be, (a) => a.concat(l)), await n.wait(qe), t.mounted.forEach((a) => a(n));
 });
 fe.meta = {
   package: "@milkdown/plugin-listener",
   displayName: "Listener"
 };
-const wt = ({
+const Mt = ({
   className: n,
   value: e,
   onChangeValue: t,
   children: s,
-  toolbar: r = "top"
+  toolbar: r = "top",
+  milkdownRef: i
 }) => {
-  const i = Ye();
-  return Ze(
-    (o) => ze.make().config((a) => {
-      a.set($e, o), a.set(He, e || ""), a.get(q).markdownUpdated((c, f) => {
-        t == null || t(f);
-      }), a.set(N.key, {
+  const o = nt();
+  Qe(
+    (d) => $e.make().config((p) => {
+      p.set(He, d), p.set(Ke, e || ""), p.get(q).markdownUpdated((h, g) => {
+        t == null || t(g);
+      }), p.set(j.key, {
         renderLabel: () => ""
-      }), a.update(ke.key, (c) => ({
-        ...c,
+      }), p.update(ke.key, (h) => ({
+        ...h,
         linkIcon: "",
         editButton: "",
         removeButton: "",
         confirmButton: "",
         inputPlaceholder: "Enter a URL..."
-      })), i.config(a);
-    }).use(fe).use(Re).use(We).use(oe).use(yt).use(ot).use(Ge).config(Ee).use(Le).use(i.plugin)
-  ), /* @__PURE__ */ ge(
+      })), o.config(p);
+    }).use(fe).use(We).use(Ge).use(oe).use(bt).use(pt).use(Ve).config(Ee).use(Ce).use(o.plugin)
+  );
+  const [l, a] = Xe();
+  tt(() => {
+    i && (i.current = a());
+  }, [l, a]);
+  const u = () => {
+    var d;
+    (d = a()) == null || d.action((p) => {
+      p.get(ze).focus();
+    });
+  };
+  return /* @__PURE__ */ ge(
     "div",
     {
       className: ye(
@@ -808,12 +820,19 @@ const wt = ({
         n
       ),
       children: [
-        r && /* @__PURE__ */ L(Ie, { className: "component-markdown-editor__toolbar", children: s }),
-        /* @__PURE__ */ L("div", { className: "component-markdown-editor__content", children: /* @__PURE__ */ L(Qe, {}) })
+        r && /* @__PURE__ */ C(Me, { className: "component-markdown-editor__toolbar", children: s }),
+        /* @__PURE__ */ C(
+          "div",
+          {
+            className: "component-markdown-editor__content",
+            onClick: u,
+            children: /* @__PURE__ */ C(Ye, {})
+          }
+        )
       ]
     }
   );
-}, St = (n) => /* @__PURE__ */ L(Je, { children: /* @__PURE__ */ L(Xe, { children: /* @__PURE__ */ L(wt, { ...n }) }) });
+}, Dt = (n) => /* @__PURE__ */ C(Ze, { children: /* @__PURE__ */ C(et, { children: /* @__PURE__ */ C(Mt, { ...n }) }) });
 export {
-  St as MarkdownEditor
+  Dt as MarkdownEditor
 };