@univerjs/docs-quick-insert-ui 0.6.9-nightly.202504091607 → 0.6.10-alpha.0

package/lib/index.js

@@ -1,25 +1,25 @@
-var Re = Object.defineProperty;
-var ke = (t, e, i) => e in t ? Re(t, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[e] = i;
-var _ = (t, e, i) => ke(t, typeof e != "symbol" ? e + "" : e, i);
-import { CommandType as b, ICommandService as D, RANGE_DIRECTION as De, LocaleService as X, generateRandomId as Ne, DisposableCollection as Ee, toDisposable as $e, Direction as T, Inject as g, IUniverInstanceService as pe, Disposable as Y, UniverInstanceType as ee, DeleteDirection as Te, DependentOn as Ue, Injector as Qe, Plugin as He } from "@univerjs/core";
-import { UniverDocsDrawingPlugin as Ke } from "@univerjs/docs-drawing";
-import { InsertDocImageCommand as je, UniverDocsDrawingUIPlugin as Ae } from "@univerjs/docs-drawing-ui";
-import { UniverDrawingPlugin as Le } from "@univerjs/drawing";
-import { UniverDrawingUIPlugin as We } from "@univerjs/drawing-ui";
-import { useDependency as y, KeyCode as O, ComponentManager as fe, IShortcutService as he, useObservable as B, UniverUIPlugin as qe } from "@univerjs/ui";
-import { DocSelectionManagerService as me, DocSkeletonManagerService as ze, RichTextEditingMutation as Be } from "@univerjs/docs";
-import { CutContentCommand as Ve, DocCanvasPopManagerService as Fe, OrderListCommand as Ge, BulletListCommand as Ze, HorizontalLineCommand as Je, DocCreateTableOperation as Xe, InsertCommand as Ye, IMEInputCommand as et, DeleteCommand as tt, MoveCursorOperation as nt, DeleteLeftCommand as it } from "@univerjs/docs-ui";
-import { IRenderManagerService as rt } from "@univerjs/engine-render";
-import { map as ot, distinctUntilChanged as st, tap as N, combineLatest as ct, BehaviorSubject as V, of as at } from "rxjs";
-import { jsx as f, jsxs as ce } from "react/jsx-runtime";
-import { clsx as ae, Menu as dt, MenuItemGroup as ut, MenuItem as lt, Tooltip as pt } from "@univerjs/design";
-import { useMemo as de, useState as ue, useRef as $, useEffect as E, forwardRef as te, createElement as ne } from "react";
-const ve = {
+var He = Object.defineProperty;
+var Ke = (t, e, i) => e in t ? He(t, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[e] = i;
+var g = (t, e, i) => Ke(t, typeof e != "symbol" ? e + "" : e, i);
+import { CommandType as w, ICommandService as T, RANGE_DIRECTION as je, LocaleService as ue, generateRandomId as Le, DisposableCollection as Ae, toDisposable as Be, Direction as A, Inject as f, IUniverInstanceService as pe, Disposable as Z, UniverInstanceType as Q, DeleteDirection as We, DependentOn as Ve, Injector as qe, Plugin as ze } from "@univerjs/core";
+import { UniverDocsDrawingPlugin as Fe } from "@univerjs/docs-drawing";
+import { InsertDocImageCommand as Ge, UniverDocsDrawingUIPlugin as Ze } from "@univerjs/docs-drawing-ui";
+import { UniverDrawingPlugin as Je } from "@univerjs/drawing";
+import { UniverDrawingUIPlugin as Xe } from "@univerjs/drawing-ui";
+import { IRenderManagerService as le } from "@univerjs/engine-render";
+import { useDependency as S, KeyCode as M, ComponentManager as Ie, IShortcutService as Se, useObservable as R, UniverUIPlugin as Ye } from "@univerjs/ui";
+import { CutContentCommand as et, DocCanvasPopManagerService as Pe, DocEventManagerService as he, OrderListCommand as tt, BulletListCommand as nt, HorizontalLineCommand as it, DocCreateTableOperation as rt, InsertCommand as st, IMEInputCommand as ot, DeleteCommand as ct, MoveCursorOperation as at, DeleteLeftCommand as dt } from "@univerjs/docs-ui";
+import { map as ut, distinctUntilChanged as pt, tap as K, combineLatest as ye, BehaviorSubject as ne, of as lt } from "rxjs";
+import { DocSelectionManagerService as Oe, DocSkeletonManagerService as ht, RichTextEditingMutation as ft } from "@univerjs/docs";
+import { jsx as h, jsxs as ve } from "react/jsx-runtime";
+import { clsx as me, Menu as vt, MenuItemGroup as mt, MenuItem as gt, Tooltip as _t } from "@univerjs/design";
+import { useMemo as se, useState as ge, useRef as L, useEffect as j, forwardRef as J, createElement as X } from "react";
+const Me = {
   id: "doc.command.delete-search-key",
-  type: b.COMMAND,
+  type: w.COMMAND,
   handler: (t, e) => {
-    const i = t.get(D), { start: n, end: r } = e;
-    return i.syncExecuteCommand(Ve.id, {
+    const i = t.get(T), { start: n, end: r } = e;
+    return i.syncExecuteCommand(et.id, {
       segmentId: "",
       textRanges: [{
         startOffset: n,
@@ -30,176 +30,189 @@ const ve = {
         startOffset: n,
         endOffset: r,
         collapsed: !1,
-        direction: De.FORWARD
+        direction: je.FORWARD
       }]
     });
   }
-}, ft = "docs.quick.insert.keyword-input-placeholder", U = () => {
-  const t = y(X);
-  return /* @__PURE__ */ f("div", { className: "univer-translate-y-1.5 univer-text-sm univer-text-gray-500", children: t.t("docQuickInsert.keywordInputPlaceholder") });
+}, Ct = "docs.quick.insert.keyword-input-placeholder", B = () => {
+  const t = S(ue);
+  return /* @__PURE__ */ h("div", { className: "univer-translate-y-1.5 univer-text-sm univer-text-gray-500", children: t.t("docQuickInsert.keywordInputPlaceholder") });
 };
-U.componentKey = ft;
-const ht = "docs.quick.insert.placeholder", Q = () => {
-  const t = y(X);
-  return /* @__PURE__ */ f(
+B.componentKey = Ct;
+const xe = {
+  type: w.OPERATION,
+  id: "doc.operation.show-quick-insert-popup",
+  handler(t, e) {
+    const i = t.get(C);
+    return e ? (i.showPopup(e), !0) : !1;
+  }
+}, U = {
+  type: w.OPERATION,
+  id: "doc.operation.close-quick-insert-popup",
+  handler(t) {
+    return t.get(C).closePopup(), !0;
+  }
+}, It = "docs.quick.insert.placeholder", W = () => {
+  const t = S(ue);
+  return /* @__PURE__ */ h(
     "div",
     {
       className: `
               univer-flex univer-h-full univer-items-center univer-justify-center univer-rounded-lg univer-bg-white
               univer-px-12 univer-py-6 univer-text-gray-400
             `,
-      children: /* @__PURE__ */ f("span", { children: t.t("docQuickInsert.placeholder") })
+      children: /* @__PURE__ */ h("span", { children: t.t("docQuickInsert.placeholder") })
     }
   );
 };
-Q.componentKey = ht;
-function G(t, e) {
+W.componentKey = It;
+function oe(t, e) {
   return t.map((i) => ({ ...i })).filter((i) => {
     if ("children" in i)
-      return i.children = G(i.children, e), i.children.length > 0;
+      return i.children = oe(i.children, e), i.children.length > 0;
     const n = i.keywords;
     return n ? n.some((r) => r.includes(e)) : i.title.toLowerCase().includes(e);
   });
 }
-function ge(t, e) {
+function be(t, e) {
   return t.map((i) => {
     const n = { ...i };
-    return "children" in n && (n.children = ge(n.children, e)), n.title = e.t(n.title), "keywords" in n && (n.keywords = n.keywords.concat(n.title).map((r) => r.toLowerCase())), n;
+    return "children" in n && (n.children = be(n.children, e)), n.title = e.t(n.title), "keywords" in n && (n.keywords = n.keywords.concat(n.title).map((r) => r.toLowerCase())), n;
   });
 }
-const mt = [O.ARROW_UP, O.ARROW_DOWN, O.ENTER], H = () => {
-  const t = y(X), e = y(C), i = y(fe), n = y(he), r = y(D), s = de(() => Ne(), []), [a, d] = ue(0), o = $(null), c = $(0);
-  c.current = 0;
-  const u = B(e.filterKeyword$, ""), p = B(e.editPopup$), x = B(p == null ? void 0 : p.popup.menus$, []), L = de(() => ge(x, t), [x]), [W, Me] = ue(() => G(L, u.toLowerCase()));
-  E(() => {
-    const h = requestIdleCallback(() => {
-      Me(G(L, u.toLowerCase()));
+const St = [M.ARROW_UP, M.ARROW_DOWN, M.ENTER], V = () => {
+  const t = S(ue), e = S(C), i = S(Ie), n = S(Se), r = S(T), s = se(() => Le(), []), [c, u] = ge(0), o = L(null), a = L(0);
+  a.current = 0;
+  const d = R(e.filterKeyword$, ""), p = R(e.editPopup$), I = R(p == null ? void 0 : p.popup.menus$, []), P = se(() => be(I, t), [I]), [H, k] = ge(() => oe(P, d.toLowerCase()));
+  j(() => {
+    const v = requestIdleCallback(() => {
+      k(oe(P, d.toLowerCase()));
     });
     return () => {
-      cancelIdleCallback(h);
+      cancelIdleCallback(v);
     };
-  }, [L, u]);
-  const re = (h) => {
-    e.emitMenuSelected(h), r.executeCommand(k.id);
+  }, [P, d]);
+  const ee = (v) => {
+    e.emitMenuSelected(v), r.executeCommand(U.id);
   };
-  E(() => {
-    const h = new Ee();
-    n.getAllShortcuts().filter((l) => l.binding && mt.includes(l.binding)).forEach((l) => {
-      const S = l.preconditions;
-      l.preconditions = () => !1, h.add($e(() => {
-        l.preconditions = S;
+  j(() => {
+    const v = new Ae();
+    n.getAllShortcuts().filter((l) => l.binding && St.includes(l.binding)).forEach((l) => {
+      const O = l.preconditions;
+      l.preconditions = () => !1, v.add(Be(() => {
+        l.preconditions = O;
       }));
     });
-    const I = {
+    const y = {
       id: `quick.insert.popup.enter.${s}`,
-      type: b.OPERATION,
+      type: w.OPERATION,
       handler: () => {
         const l = o.current;
-        l && re(l);
+        l && ee(l);
       }
-    }, M = {
+    }, $ = {
       id: `quick.insert.popup.move.cursor.up.${s}`,
-      type: b.OPERATION,
+      type: w.OPERATION,
       handler: () => {
-        d((l) => {
-          const S = l - 1;
-          return S >= 0 ? S : c.current - 1;
+        u((l) => {
+          const O = l - 1;
+          return O >= 0 ? O : a.current - 1;
         });
       }
-    }, P = {
+    }, b = {
       id: `quick.insert.popup.move.cursor.down.${s}`,
-      type: b.OPERATION,
+      type: w.OPERATION,
       handler: () => {
-        d((l) => {
-          const S = l + 1;
-          return S <= c.current - 1 ? S : 0;
+        u((l) => {
+          const O = l + 1;
+          return O <= a.current - 1 ? O : 0;
         });
       }
     };
-    return h.add(r.registerCommand(M)), h.add(r.registerCommand(P)), h.add(r.registerCommand(I)), h.add(n.registerShortcut({
+    return v.add(r.registerCommand($)), v.add(r.registerCommand(b)), v.add(r.registerCommand(y)), v.add(n.registerShortcut({
       priority: 1e3,
-      id: M.id,
-      binding: O.ARROW_UP,
+      id: $.id,
+      binding: M.ARROW_UP,
       preconditions: () => !0,
       staticParameters: {
-        direction: T.UP
+        direction: A.UP
       }
-    })), h.add(n.registerShortcut({
+    })), v.add(n.registerShortcut({
       priority: 1e3,
-      id: P.id,
-      binding: O.ARROW_DOWN,
+      id: b.id,
+      binding: M.ARROW_DOWN,
       preconditions: () => !0,
       staticParameters: {
-        direction: T.DOWN
+        direction: A.DOWN
       }
-    })), h.add(n.registerShortcut({
+    })), v.add(n.registerShortcut({
       priority: 1e3,
-      id: I.id,
-      binding: O.ENTER,
+      id: y.id,
+      binding: M.ENTER,
       preconditions: () => !0
     })), () => {
-      h.dispose();
+      v.dispose();
     };
-  }, []), E(() => {
-    d(0);
-  }, [W]);
-  const q = $(/* @__PURE__ */ new Map());
-  E(() => () => {
-    q.current.clear();
+  }, []), j(() => {
+    u(0);
+  }, [H]);
+  const x = L(/* @__PURE__ */ new Map());
+  j(() => () => {
+    x.current.clear();
   }, []);
-  function oe(h) {
-    return h.map((m) => {
-      const z = m.icon, I = z ? i.get(z) : null;
+  function D(v) {
+    return v.map((m) => {
+      const te = m.icon, y = te ? i.get(te) : null;
       if ("children" in m)
-        return /* @__PURE__ */ f(
-          ut,
+        return /* @__PURE__ */ h(
+          mt,
           {
-            title: /* @__PURE__ */ ce(
+            title: /* @__PURE__ */ ve(
               "div",
               {
                 className: `
                                   univer-mb-2 univer-flex univer-items-center univer-text-xs univer-text-gray-400
                                 `,
                 children: [
-                  I && /* @__PURE__ */ f("span", { className: "univer-mr-2 univer-inline-flex univer-text-base", children: /* @__PURE__ */ f(I, {}) }),
-                  /* @__PURE__ */ f("span", { children: m.title })
+                  y && /* @__PURE__ */ h("span", { className: "univer-mr-2 univer-inline-flex univer-text-base", children: /* @__PURE__ */ h(y, {}) }),
+                  /* @__PURE__ */ h("span", { children: m.title })
                 ]
               }
             ),
-            children: oe(m.children)
+            children: D(m.children)
           },
           m.id
         );
-      const M = c.current, P = a === M;
-      if (P) {
+      const $ = a.current, b = c === $;
+      if (b) {
         o.current = m;
-        const l = q.current.get(m.id);
+        const l = x.current.get(m.id);
         l == null || l.scrollIntoView({
           block: "nearest"
         });
       }
-      return c.current++, /* @__PURE__ */ f(
-        lt,
+      return a.current++, /* @__PURE__ */ h(
+        gt,
         {
           ref: (l) => {
-            l && q.current.set(m.id, l);
+            l && x.current.set(m.id, l);
           },
-          onMouseEnter: () => d(M),
-          onMouseLeave: () => d(Number.NaN),
-          className: ae("univer-w-[calc(220px-var(--padding-base)*2)] univer-text-sm", {
-            "hover:univer-bg-transparent": !P,
-            "univer-bg-gray-100": P
+          onMouseEnter: () => u($),
+          onMouseLeave: () => u(Number.NaN),
+          className: me("univer-w-[calc(220px-var(--padding-base)*2)] univer-text-sm", {
+            "hover:univer-bg-transparent": !b,
+            "univer-bg-gray-100": b
           }),
           onClick: () => {
-            re(m);
+            ee(m);
           },
-          children: /* @__PURE__ */ ce(
+          children: /* @__PURE__ */ ve(
             "div",
             {
               className: "univer-flex univer-w-full univer-items-center univer-px-1",
               children: [
-                I && /* @__PURE__ */ f("span", { className: "univer-mr-2 univer-inline-flex univer-text-base", children: /* @__PURE__ */ f(I, {}) }),
-                /* @__PURE__ */ f(pt, { showIfEllipsis: !0, title: m.title, placement: "right", children: /* @__PURE__ */ f("span", { className: "univer-truncate", children: m.title }) })
+                y && /* @__PURE__ */ h("span", { className: "univer-mr-2 univer-inline-flex univer-text-base", children: /* @__PURE__ */ h(y, {}) }),
+                /* @__PURE__ */ h(_t, { showIfEllipsis: !0, title: m.title, placement: "right", children: /* @__PURE__ */ h("span", { className: "univer-truncate", children: m.title }) })
               ]
             }
           )
@@ -208,77 +221,60 @@ const mt = [O.ARROW_UP, O.ARROW_DOWN, O.ENTER], H = () => {
       );
     });
   }
-  const we = W.length > 0, se = (p == null ? void 0 : p.popup.Placeholder) || i.get(Q.componentKey);
-  return /* @__PURE__ */ f(
-    "div",
-    {
-      className: ae(`
-              univer-rounded-lg univer-border univer-border-solid univer-border-gray-100 univer-bg-white
-              univer-shadow-[0_0_10px_0_rgba(0,0,0,0.1)]
-            `),
-      children: we ? /* @__PURE__ */ f(
-        "div",
-        {
-          className: `
-                          univer-max-h-[360px] univer-w-[220px] univer-overflow-y-auto univer-overflow-x-hidden
-                        `,
-          children: /* @__PURE__ */ f(dt, { children: oe(W) })
-        }
-      ) : se && /* @__PURE__ */ f(se, {})
-    }
-  );
+  const Qe = H.length > 0, fe = (p == null ? void 0 : p.popup.Placeholder) || i.get(W.componentKey);
+  return /* @__PURE__ */ h("div", { className: me("univer-mt-2"), children: Qe ? /* @__PURE__ */ h(vt, { wrapperClass: "univer-max-h-[360px] univer-w-[220px]", children: D(H) }) : fe && /* @__PURE__ */ h(fe, {}) });
 };
-H.componentKey = "docs.quick.insert.popup";
-var vt = Object.getOwnPropertyDescriptor, gt = (t, e, i, n) => {
-  for (var r = n > 1 ? void 0 : n ? vt(e, i) : e, s = t.length - 1, a; s >= 0; s--)
-    (a = t[s]) && (r = a(r) || r);
+V.componentKey = "docs.quick.insert.popup";
+var Pt = Object.getOwnPropertyDescriptor, yt = (t, e, i, n) => {
+  for (var r = n > 1 ? void 0 : n ? Pt(e, i) : e, s = t.length - 1, c; s >= 0; s--)
+    (c = t[s]) && (r = c(r) || r);
   return r;
-}, w = (t, e) => (i, n) => e(i, n, t);
-const le = {
+}, N = (t, e) => (i, n) => e(i, n, t);
+const _e = {
   dispose: () => {
   }
 };
-let C = class extends Y {
+let C = class extends Z {
   constructor(e, i, n, r, s) {
     super();
-    _(this, "_popups", /* @__PURE__ */ new Set());
-    _(this, "_editPopup$", new V(void 0));
-    _(this, "editPopup$", this._editPopup$.asObservable());
-    _(this, "_isComposing$", new V(!1));
-    _(this, "isComposing$", this._isComposing$.asObservable());
-    _(this, "_inputOffset$", new V({ start: 0, end: 0 }));
-    _(this, "inputOffset$", this._inputOffset$.asObservable());
-    _(this, "filterKeyword$");
-    _(this, "_menuSelectedCallbacks", /* @__PURE__ */ new Set());
-    _(this, "_inputPlaceholderRenderRoot", null);
+    g(this, "_popups", /* @__PURE__ */ new Set());
+    g(this, "_editPopup$", new ne(void 0));
+    g(this, "editPopup$", this._editPopup$.asObservable());
+    g(this, "_isComposing$", new ne(!1));
+    g(this, "isComposing$", this._isComposing$.asObservable());
+    g(this, "_inputOffset$", new ne({ start: 0, end: 0 }));
+    g(this, "inputOffset$", this._inputOffset$.asObservable());
+    g(this, "filterKeyword$");
+    g(this, "_menuSelectedCallbacks", /* @__PURE__ */ new Set());
+    g(this, "_inputPlaceholderRenderRoot", null);
     this._docCanvasPopupManagerService = e, this._univerInstanceService = i, this._commandService = n, this._renderManagerService = r, this._docSelectionManagerService = s, this.disposeWithMe(this._editPopup$);
-    const a = (o, c) => {
-      var u, p;
-      return (p = (u = this._univerInstanceService.getCurrentUnitOfType(ee.UNIVER_DOC)) == null ? void 0 : u.getBody()) == null ? void 0 : p.dataStream.slice(o, c);
+    const c = (o, a) => {
+      var d, p;
+      return (p = (d = this._univerInstanceService.getCurrentUnitOfType(Q.UNIVER_DOC)) == null ? void 0 : d.getBody()) == null ? void 0 : p.dataStream.slice(o, a);
     };
-    let d = "";
+    let u = "";
     this.filterKeyword$ = this._inputOffset$.pipe(
-      ot((o) => {
-        var u;
-        const c = a(o.start, o.end);
-        return (u = c == null ? void 0 : c.slice(1)) != null ? u : "";
+      ut((o) => {
+        var d;
+        const a = c(o.start, o.end);
+        return (d = a == null ? void 0 : a.slice(1)) != null ? d : "";
       }),
-      st(),
-      N((o) => {
-        d = o;
+      pt(),
+      K((o) => {
+        u = o;
       })
-    ), this.disposeWithMe(ct([
-      this.filterKeyword$.pipe(N((o) => {
-        var c, u, p;
-        o.length > 0 ? (u = (c = this._inputPlaceholderRenderRoot) == null ? void 0 : c.unmount) == null || u.dispose() : (p = this._inputPlaceholderRenderRoot) == null || p.mount();
+    ), this.disposeWithMe(ye([
+      this.filterKeyword$.pipe(K((o) => {
+        var a, d, p;
+        o.length > 0 ? (d = (a = this._inputPlaceholderRenderRoot) == null ? void 0 : a.unmount) == null || d.dispose() : (p = this._inputPlaceholderRenderRoot) == null || p.mount();
       })),
-      this.isComposing$.pipe(N((o) => {
-        var c, u, p;
-        o ? (u = (c = this._inputPlaceholderRenderRoot) == null ? void 0 : c.unmount) == null || u.dispose() : d.length <= 0 && ((p = this._inputPlaceholderRenderRoot) == null || p.mount());
+      this.isComposing$.pipe(K((o) => {
+        var a, d, p;
+        o ? (d = (a = this._inputPlaceholderRenderRoot) == null ? void 0 : a.unmount) == null || d.dispose() : u.length <= 0 && ((p = this._inputPlaceholderRenderRoot) == null || p.mount());
       })),
-      this.editPopup$.pipe(N((o) => {
-        var c, u;
-        o || ((u = (c = this._inputPlaceholderRenderRoot) == null ? void 0 : c.unmount) == null || u.dispose(), this._inputPlaceholderRenderRoot = null);
+      this.editPopup$.pipe(K((o) => {
+        var a, d;
+        o || ((d = (a = this._inputPlaceholderRenderRoot) == null ? void 0 : a.unmount) == null || d.dispose(), this._inputPlaceholderRenderRoot = null);
       }))
     ]).subscribe());
   }
@@ -297,6 +293,10 @@ let C = class extends Y {
   setInputOffset(e) {
     this._inputOffset$.next(e);
   }
+  getDocEventManagerService(e) {
+    var i;
+    return (i = this._renderManagerService.getRenderById(e)) == null ? void 0 : i.with(he);
+  }
   resolvePopup(e) {
     return Array.from(this._popups).find((i) => i.keyword === e);
   }
@@ -322,32 +322,40 @@ let C = class extends Y {
     };
   }
   showPopup(e) {
+    var a, d, p;
     const { popup: i, index: n, unitId: r } = e;
-    this.closePopup(), this._inputPlaceholderRenderRoot = this._createInputPlaceholderRenderRoot(() => {
-      var x;
-      const a = (x = this._renderManagerService.getRenderById(r)) == null ? void 0 : x.with(ze), d = this._docSelectionManagerService.getActiveTextRange();
-      if (!a || !d)
-        return le;
-      const c = a.getSkeleton().findNodeByCharIndex(d.startOffset, d.segmentId, d.segmentPage);
-      if (!((c == null ? void 0 : c.content) === "\r"))
-        return le;
-      const p = this._docCanvasPopupManagerService.attachPopupToRange(
+    this.closePopup();
+    const s = this._univerInstanceService.getUnit(r), c = (d = (a = s == null ? void 0 : s.getBody()) == null ? void 0 : a.paragraphs) == null ? void 0 : d.find((I) => I.startIndex > n);
+    if (!c)
+      return;
+    const u = (p = this.getDocEventManagerService(r)) == null ? void 0 : p.paragraphBounds.get(c.startIndex);
+    if (!u)
+      return;
+    this._inputPlaceholderRenderRoot = this._createInputPlaceholderRenderRoot(() => {
+      var D;
+      const I = (D = this._renderManagerService.getRenderById(r)) == null ? void 0 : D.with(ht), P = this._docSelectionManagerService.getActiveTextRange();
+      if (!I || !P)
+        return _e;
+      const k = I.getSkeleton().findNodeByCharIndex(P.startOffset, P.segmentId, P.segmentPage);
+      if (!((k == null ? void 0 : k.content) === "\r"))
+        return _e;
+      const x = this._docCanvasPopupManagerService.attachPopupToRange(
         { startOffset: n + 1, endOffset: n + 1, collapsed: !1 },
         {
-          componentKey: U.componentKey,
+          componentKey: B.componentKey,
           onClickOutside: () => {
-            p.dispose();
+            x.dispose();
           },
           direction: "horizontal"
         },
         r
       );
-      return p;
+      return x;
     }), this._inputPlaceholderRenderRoot.mount();
-    const s = this._docCanvasPopupManagerService.attachPopupToRange(
-      { startOffset: n, endOffset: n, collapsed: !0 },
+    const o = this._docCanvasPopupManagerService.attachPopupToRect(
+      u.firstLine,
       {
-        componentKey: H.componentKey,
+        componentKey: V.componentKey,
         onClickOutside: () => {
           this.closePopup();
         },
@@ -355,7 +363,7 @@ let C = class extends Y {
       },
       r
     );
-    this._editPopup$.next({ disposable: s, popup: i, anchor: n, unitId: r });
+    this._editPopup$.next({ disposable: o, popup: i, anchor: n, unitId: r });
   }
   closePopup() {
     this.editPopup && (this.editPopup.disposable.dispose(), this._editPopup$.next(null));
@@ -367,7 +375,7 @@ let C = class extends Y {
   }
   emitMenuSelected(e) {
     const { start: i, end: n } = this.inputOffset;
-    this._commandService.syncExecuteCommand(ve.id, {
+    this._commandService.syncExecuteCommand(Me.id, {
       start: i,
       end: n
     }), setTimeout(() => {
@@ -375,86 +383,217 @@ let C = class extends Y {
     }, 0);
   }
 };
-C = gt([
-  w(0, g(Fe)),
-  w(1, g(pe)),
-  w(2, g(D)),
-  w(3, g(rt)),
-  w(4, g(me))
+C = yt([
+  N(0, f(Pe)),
+  N(1, f(pe)),
+  N(2, f(T)),
+  N(3, f(le)),
+  N(4, f(Oe))
 ], C);
-const _e = {
-  type: b.OPERATION,
-  id: "doc.operation.show-quick-insert-popup",
-  handler(t, e) {
-    const i = t.get(C);
-    return e ? (i.showPopup(e), !0) : !1;
+var _ = function() {
+  return _ = Object.assign || function(t) {
+    for (var e, i = 1, n = arguments.length; i < n; i++) {
+      e = arguments[i];
+      for (var r in e) Object.prototype.hasOwnProperty.call(e, r) && (t[r] = e[r]);
+    }
+    return t;
+  }, _.apply(this, arguments);
+}, Ot = function(t, e) {
+  var i = {};
+  for (var n in t) Object.prototype.hasOwnProperty.call(t, n) && e.indexOf(n) < 0 && (i[n] = t[n]);
+  if (t != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var r = 0, n = Object.getOwnPropertySymbols(t); r < n.length; r++)
+      e.indexOf(n[r]) < 0 && Object.prototype.propertyIsEnumerable.call(t, n[r]) && (i[n[r]] = t[n[r]]);
+  return i;
+}, Y = J(function(t, e) {
+  var i = t.icon, n = t.id, r = t.className, s = t.extend, c = Ot(t, ["icon", "id", "className", "extend"]), u = "univerjs-icon univerjs-icon-".concat(n, " ").concat(r || "").trim(), o = L("_".concat(bt()));
+  return we(i, "".concat(n), { defIds: i.defIds, idSuffix: o.current }, _({ ref: e, className: u }, c), s);
+});
+function we(t, e, i, n, r) {
+  return X(t.tag, _(_({ key: e }, Mt(t, i, r)), n), (xt(t, i).children || []).map(function(s, c) {
+    return we(s, "".concat(e, "-").concat(t.tag, "-").concat(c), i, void 0, r);
+  }));
+}
+function Mt(t, e, i) {
+  var n = _({}, t.attrs);
+  i != null && i.colorChannel1 && n.fill === "colorChannel1" && (n.fill = i.colorChannel1), t.tag === "mask" && n.id && (n.id = n.id + e.idSuffix), Object.entries(n).forEach(function(s) {
+    var c = s[0], u = s[1];
+    c === "mask" && typeof u == "string" && (n[c] = u.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+  });
+  var r = e.defIds;
+  return !r || r.length === 0 || (t.tag === "use" && n["xlink:href"] && (n["xlink:href"] = n["xlink:href"] + e.idSuffix), Object.entries(n).forEach(function(s) {
+    var c = s[0], u = s[1];
+    typeof u == "string" && (n[c] = u.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+  })), n;
+}
+function xt(t, e) {
+  var i, n = e.defIds;
+  return !n || n.length === 0 ? t : t.tag === "defs" && (!((i = t.children) === null || i === void 0) && i.length) ? _(_({}, t), { children: t.children.map(function(r) {
+    return typeof r.attrs.id == "string" && n && n.indexOf(r.attrs.id) > -1 ? _(_({}, r), { attrs: _(_({}, r.attrs), { id: r.attrs.id + e.idSuffix }) }) : r;
+  }) }) : t;
+}
+function bt() {
+  return Math.random().toString(36).substring(2, 8);
+}
+Y.displayName = "UniverIcon";
+var wt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.01953 3.13985C1.01953 2.77258 1.31726 2.47485 1.68453 2.47485H2.73713C3.1044 2.47485 3.40213 2.77258 3.40213 3.13985 3.40213 3.50712 3.1044 3.80485 2.73713 3.80485H1.68453C1.31726 3.80485 1.01953 3.50712 1.01953 3.13985zM4.17734 3.13985C4.17734 2.77258 4.47507 2.47485 4.84234 2.47485H6.94754C7.31481 2.47485 7.61254 2.77258 7.61254 3.13985 7.61254 3.50712 7.31481 3.80485 6.94754 3.80485H4.84234C4.47507 3.80485 4.17734 3.50712 4.17734 3.13985zM8.38775 3.13985C8.38775 2.77258 8.68548 2.47485 9.05275 2.47485H11.158C11.5252 2.47485 11.823 2.77258 11.823 3.13985 11.823 3.50712 11.5252 3.80485 11.158 3.80485H9.05275C8.68548 3.80485 8.38775 3.50712 8.38775 3.13985zM12.5982 3.13985C12.5982 2.77258 12.8959 2.47485 13.2632 2.47485H14.3158C14.683 2.47485 14.9808 2.77258 14.9808 3.13985 14.9808 3.50712 14.683 3.80485 14.3158 3.80485H13.2632C12.8959 3.80485 12.5982 3.50712 12.5982 3.13985zM1.01953 7.99972C1.01953 7.63245 1.31726 7.33472 1.68453 7.33472H14.3158C14.683 7.33472 14.9808 7.63245 14.9808 7.99972 14.9808 8.36699 14.683 8.66472 14.3158 8.66472H1.68453C1.31726 8.66472 1.01953 8.36699 1.01953 7.99972zM1.68453 12.1951C1.31726 12.1951 1.01953 12.4928 1.01953 12.8601 1.01953 13.2273 1.31726 13.5251 1.68453 13.5251H2.73713C3.1044 13.5251 3.40213 13.2273 3.40213 12.8601 3.40213 12.4928 3.1044 12.1951 2.73713 12.1951H1.68453zM4.84234 12.1951C4.47507 12.1951 4.17734 12.4928 4.17734 12.8601 4.17734 13.2273 4.47507 13.5251 4.84234 13.5251H6.94754C7.31481 13.5251 7.61254 13.2273 7.61254 12.8601 7.61254 12.4928 7.31481 12.1951 6.94754 12.1951H4.84234zM9.05275 12.1951C8.68548 12.1951 8.38775 12.4928 8.38775 12.8601 8.38775 13.2273 8.68548 13.5251 9.05275 13.5251H11.158C11.5252 13.5251 11.823 13.2273 11.823 12.8601 11.823 12.4928 11.5252 12.1951 11.158 12.1951H9.05275zM13.2632 12.1951C12.8959 12.1951 12.5982 12.4928 12.5982 12.8601 12.5982 13.2273 12.8959 13.5251 13.2632 13.5251H14.3158C14.683 13.5251 14.9808 13.2273 14.9808 12.8601 14.9808 12.4928 14.683 12.1951 14.3158 12.1951H13.2632z" } }] }, ce = J(function(t, e) {
+  return X(Y, Object.assign({}, t, {
+    id: "divider-single",
+    ref: e,
+    icon: wt
+  }));
+});
+ce.displayName = "DividerSingle";
+var Rt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M8.00033 2.66699C8.36852 2.66699 8.66699 2.96547 8.66699 3.33366V7.33366H12.667C13.0352 7.33366 13.3337 7.63214 13.3337 8.00033C13.3337 8.36852 13.0352 8.66699 12.667 8.66699H8.66699V12.667C8.66699 13.0352 8.36852 13.3337 8.00033 13.3337C7.63214 13.3337 7.33366 13.0352 7.33366 12.667V8.66699H3.33366C2.96547 8.66699 2.66699 8.36852 2.66699 8.00033C2.66699 7.63214 2.96547 7.33366 3.33366 7.33366H7.33366V3.33366C7.33366 2.96547 7.63214 2.66699 8.00033 2.66699Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, Re = J(function(t, e) {
+  return X(Y, Object.assign({}, t, {
+    id: "plus-single",
+    ref: e,
+    icon: Rt
+  }));
+});
+Re.displayName = "PlusSingle";
+var kt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M2.66695 1.33496C2.29968 1.33496 2.00195 1.63269 2.00195 1.99996V3.64439C2.00195 4.01166 2.29968 4.30939 2.66695 4.30939C3.03422 4.30939 3.33195 4.01166 3.33195 3.64439V2.66496H7.33521V13.335H5.3337C4.96643 13.335 4.6687 13.6327 4.6687 14C4.6687 14.3672 4.96643 14.665 5.3337 14.665H10.667C11.0343 14.665 11.332 14.3672 11.332 14C11.332 13.6327 11.0343 13.335 10.667 13.335H8.66521V2.66496H12.6686V3.64439C12.6686 4.01166 12.9664 4.30939 13.3336 4.30939C13.7009 4.30939 13.9986 4.01166 13.9986 3.64439V1.99996C13.9986 1.63269 13.7009 1.33496 13.3336 1.33496H2.66695Z" } }] }, ae = J(function(t, e) {
+  return X(Y, Object.assign({}, t, {
+    id: "text-single",
+    ref: e,
+    icon: kt
+  }));
+});
+ae.displayName = "TextSingle";
+const q = ({
+  className: t = ""
+}) => {
+  const e = S(C), i = S(pe), n = S(le), r = R(se(() => i.getCurrentTypeOfUnit$(Q.UNIVER_DOC), [i])), s = r && n.getRenderById(r.getUnitId()), c = s == null ? void 0 : s.with(he), u = R(c == null ? void 0 : c.hoverParagraph$), o = R(c == null ? void 0 : c.hoverParagraphLeft$), a = () => {
+    var I;
+    const d = u != null ? u : o;
+    if (!d)
+      return;
+    const p = e.resolvePopup("/");
+    p && e.showPopup({
+      popup: p,
+      index: d.startIndex - 1,
+      unitId: (I = r == null ? void 0 : r.getUnitId()) != null ? I : ""
+    });
+  };
+  return /* @__PURE__ */ h(
+    "div",
+    {
+      className: `
+              univer-mr-1 univer-flex univer-cursor-pointer univer-items-center univer-gap-2.5 univer-rounded-full
+              univer-border univer-border-gray-200 univer-bg-white univer-p-1.5 univer-shadow-sm
+              hover:univer-bg-gray-100
+              ${t}
+            `,
+      onClick: a,
+      role: "button",
+      tabIndex: 0,
+      children: /* @__PURE__ */ h(Re, { className: "univer-text-gray-800" })
+    }
+  );
+};
+q.componentKey = "doc.quick-insert.button";
+var Dt = Object.getOwnPropertyDescriptor, $t = (t, e, i, n) => {
+  for (var r = n > 1 ? void 0 : n ? Dt(e, i) : e, s = t.length - 1, c; s >= 0; s--)
+    (c = t[s]) && (r = c(r) || r);
+  return r;
+}, ie = (t, e) => (i, n) => e(i, n, t);
+let de = class extends Z {
+  constructor(e, i, n, r) {
+    super();
+    g(this, "_popup", null);
+    this._context = e, this._docEventManagerService = i, this._docQuickInsertPopupService = n, this._docCanvasPopManagerService = r, this._init();
   }
-}, k = {
-  type: b.OPERATION,
-  id: "doc.operation.close-quick-insert-popup",
-  handler(t) {
-    return t.get(C).closePopup(), !0;
+  _init() {
+    this.disposeWithMe(ye([this._docEventManagerService.hoverParagraphLeft$, this._docEventManagerService.hoverParagraph$]).subscribe(([e, i]) => {
+      var r;
+      const n = e != null ? e : i;
+      if (!n) {
+        this._hideMenu(!0);
+        return;
+      }
+      if (n.paragraphStart === n.paragraphEnd && n.startIndex !== ((r = this._popup) == null ? void 0 : r.startIndex)) {
+        this._hideMenu(!0);
+        const s = this._docCanvasPopManagerService.attachPopupToRect(n.firstLine, {
+          componentKey: q.componentKey,
+          direction: "left-center"
+        }, this._context.unit.getUnitId());
+        this._popup = {
+          startIndex: n.startIndex,
+          disposable: s
+        };
+      } else
+        this._hideMenu(!0);
+    }));
+  }
+  _hideMenu(e) {
+    this._popup && (e || this._popup.disposable.canDispose()) && (this._popup.disposable.dispose(), this._popup = null);
   }
-}, Ce = {
+};
+de = $t([
+  ie(1, f(he)),
+  ie(2, f(C)),
+  ie(3, f(Pe))
+], de);
+const ke = {
   id: "quick-insert.text.menu",
   title: "docQuickInsert.menu.text",
   icon: "TextSingle",
   keywords: ["text"]
-}, Ie = {
-  id: Ge.id,
+}, De = {
+  id: tt.id,
   title: "docQuickInsert.menu.numberedList",
   icon: "OrderSingle",
   keywords: ["numbered", "list", "ordered"]
-}, Se = {
-  id: Ze.id,
+}, $e = {
+  id: nt.id,
   title: "docQuickInsert.menu.bulletedList",
   icon: "UnorderSingle",
   keywords: ["bulleted", "list", "unordered"]
-}, ye = {
-  id: Je.id,
+}, Ne = {
+  id: it.id,
   title: "docQuickInsert.menu.divider",
   icon: "DividerSingle",
   keywords: ["divider", "line", "separate"]
-}, Oe = {
-  id: Xe.id,
+}, Ee = {
+  id: rt.id,
   title: "docQuickInsert.menu.table",
   icon: "GridSingle",
   keywords: ["table", "grid", "spreadsheet"]
-}, Pe = {
-  id: je.id,
+}, Ue = {
+  id: Ge.id,
   title: "docQuickInsert.menu.image",
   icon: "addition-and-subtraction-single",
   keywords: ["image", "picture", "photo"]
-}, _t = [
+}, Nt = [
   {
     title: "docQuickInsert.group.basics",
     id: "quick.insert.group.basic",
     children: [
-      Ce,
-      Ie,
-      Se,
-      ye,
-      Oe,
-      Pe
+      ke,
+      De,
+      $e,
+      Ne,
+      Ee,
+      Ue
     ]
   }
-], Ct = /* @__PURE__ */ new Set([
-  Ie.id,
-  Se.id,
-  ye.id,
-  Oe.id,
-  Pe.id
+], Et = /* @__PURE__ */ new Set([
+  De.id,
+  $e.id,
+  Ne.id,
+  Ee.id,
+  Ue.id
 ]);
-var It = Object.getOwnPropertyDescriptor, St = (t, e, i, n) => {
-  for (var r = n > 1 ? void 0 : n ? It(e, i) : e, s = t.length - 1, a; s >= 0; s--)
-    (a = t[s]) && (r = a(r) || r);
+var Ut = Object.getOwnPropertyDescriptor, Tt = (t, e, i, n) => {
+  for (var r = n > 1 ? void 0 : n ? Ut(e, i) : e, s = t.length - 1, c; s >= 0; s--)
+    (c = t[s]) && (r = c(r) || r);
   return r;
-}, R = (t, e) => (i, n) => e(i, n, t);
-let K = class extends Y {
+}, E = (t, e) => (i, n) => e(i, n, t);
+let z = class extends Z {
   constructor(t, e, i, n, r) {
     super(), this._commandService = t, this._textSelectionManagerService = e, this._docQuickInsertPopupService = i, this._shortcutService = n, this._univerInstanceService = r, this.disposeWithMe(this._shortcutService.registerShortcut({
-      id: k.id,
-      binding: O.ESC,
+      id: U.id,
+      binding: M.ESC,
       preconditions: () => !!this._docQuickInsertPopupService.editPopup,
       priority: 1e3
     })), this._initTrigger(), this._initMenuHandler();
@@ -464,10 +603,10 @@ let K = class extends Y {
     this.disposeWithMe(
       // eslint-disable-next-line complexity, max-lines-per-function
       this._commandService.onCommandExecuted((t) => {
-        var s, a, d;
-        const { _docQuickInsertPopupService: e, _textSelectionManagerService: i, _commandService: n } = this, r = this._univerInstanceService.getCurrentUnitOfType(ee.UNIVER_DOC);
+        var s, c, u;
+        const { _docQuickInsertPopupService: e, _textSelectionManagerService: i, _commandService: n } = this, r = this._univerInstanceService.getCurrentUnitOfType(Q.UNIVER_DOC);
         if (!(r != null && r.getDisabled())) {
-          if (t.id === Ye.id) {
+          if (t.id === st.id) {
             const o = t.params;
             if (e.editPopup) {
               e.setInputOffset({
@@ -476,47 +615,47 @@ let K = class extends Y {
               });
               return;
             }
-            const c = i.getActiveTextRange();
-            if (!c)
+            const a = i.getActiveTextRange();
+            if (!a)
               return;
-            const u = e.resolvePopup(o.body.dataStream);
-            if (!u || !(u.preconditions ? u.preconditions(o) : !0))
+            const d = e.resolvePopup(o.body.dataStream);
+            if (!d || !(d.preconditions ? d.preconditions(o) : !0))
               return;
-            e.setInputOffset({ start: c.startOffset - 1, end: c.startOffset }), setTimeout(() => {
-              n.executeCommand(_e.id, {
-                index: c.startOffset - 1,
+            e.setInputOffset({ start: a.startOffset - 1, end: a.startOffset }), setTimeout(() => {
+              n.executeCommand(xe.id, {
+                index: a.startOffset - 1,
                 unitId: o.unitId,
-                popup: u
+                popup: d
               });
             }, 100);
           }
-          if (t.id === et.id) {
+          if (t.id === ot.id) {
             const o = t.params;
             !e.isComposing && o.isCompositionStart && e.setIsComposing(!0), e.isComposing && o.isCompositionEnd && e.setIsComposing(!1);
           }
-          if (t.id === Be.id) {
+          if (t.id === ft.id) {
             const o = t.params;
             if (o.isCompositionEnd) {
-              const c = (a = (s = o.textRanges) == null ? void 0 : s[0]) == null ? void 0 : a.endOffset;
-              c && e.setInputOffset({ start: e.inputOffset.start, end: c });
+              const a = (c = (s = o.textRanges) == null ? void 0 : s[0]) == null ? void 0 : c.endOffset;
+              a && e.setInputOffset({ start: e.inputOffset.start, end: a });
             }
           }
-          if (t.id === tt.id) {
+          if (t.id === ct.id) {
             const o = t.params;
-            if (e.editPopup && o.direction === Te.LEFT) {
-              const c = (d = o.len) != null ? d : 0;
-              e.setInputOffset({ start: e.inputOffset.start, end: o.range.endOffset - c });
+            if (e.editPopup && o.direction === We.LEFT) {
+              const a = (u = o.len) != null ? u : 0;
+              e.setInputOffset({ start: e.inputOffset.start, end: o.range.endOffset - a });
             }
           }
-          if (t.id === nt.id) {
+          if (t.id === at.id) {
             const o = t.params;
-            (o.direction === T.LEFT || o.direction === T.RIGHT) && e.editPopup && n.executeCommand(k.id);
+            (o.direction === A.LEFT || o.direction === A.RIGHT) && e.editPopup && n.executeCommand(U.id);
           }
-          if (t.id === it.id) {
+          if (t.id === dt.id) {
             const o = i.getActiveTextRange();
             if (!e.editPopup || !o)
               return;
-            o.endOffset <= e.editPopup.anchor && n.executeCommand(k.id);
+            o.endOffset <= e.editPopup.anchor && n.executeCommand(U.id);
           }
         }
       })
@@ -524,110 +663,49 @@ let K = class extends Y {
   }
   _initMenuHandler() {
     this.disposeWithMe(this._docQuickInsertPopupService.onMenuSelected((t) => {
-      t.id !== Ce.id && Ct.has(t.id) && this._commandService.executeCommand(t.id);
+      t.id !== ke.id && Et.has(t.id) && this._commandService.executeCommand(t.id);
     }));
   }
 };
-K = St([
-  R(0, D),
-  R(1, g(me)),
-  R(2, g(C)),
-  R(3, g(he)),
-  R(4, g(pe))
-], K);
-var v = function() {
-  return v = Object.assign || function(t) {
-    for (var e, i = 1, n = arguments.length; i < n; i++) {
-      e = arguments[i];
-      for (var r in e) Object.prototype.hasOwnProperty.call(e, r) && (t[r] = e[r]);
-    }
-    return t;
-  }, v.apply(this, arguments);
-}, yt = function(t, e) {
-  var i = {};
-  for (var n in t) Object.prototype.hasOwnProperty.call(t, n) && e.indexOf(n) < 0 && (i[n] = t[n]);
-  if (t != null && typeof Object.getOwnPropertySymbols == "function")
-    for (var r = 0, n = Object.getOwnPropertySymbols(t); r < n.length; r++)
-      e.indexOf(n[r]) < 0 && Object.prototype.propertyIsEnumerable.call(t, n[r]) && (i[n[r]] = t[n[r]]);
-  return i;
-}, ie = te(function(t, e) {
-  var i = t.icon, n = t.id, r = t.className, s = t.extend, a = yt(t, ["icon", "id", "className", "extend"]), d = "univerjs-icon univerjs-icon-".concat(n, " ").concat(r || "").trim(), o = $("_".concat(bt()));
-  return be(i, "".concat(n), { defIds: i.defIds, idSuffix: o.current }, v({ ref: e, className: d }, a), s);
-});
-function be(t, e, i, n, r) {
-  return ne(t.tag, v(v({ key: e }, Ot(t, i, r)), n), (Pt(t, i).children || []).map(function(s, a) {
-    return be(s, "".concat(e, "-").concat(t.tag, "-").concat(a), i, void 0, r);
-  }));
-}
-function Ot(t, e, i) {
-  var n = v({}, t.attrs);
-  i != null && i.colorChannel1 && n.fill === "colorChannel1" && (n.fill = i.colorChannel1), t.tag === "mask" && n.id && (n.id = n.id + e.idSuffix), Object.entries(n).forEach(function(s) {
-    var a = s[0], d = s[1];
-    a === "mask" && typeof d == "string" && (n[a] = d.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
-  });
-  var r = e.defIds;
-  return !r || r.length === 0 || (t.tag === "use" && n["xlink:href"] && (n["xlink:href"] = n["xlink:href"] + e.idSuffix), Object.entries(n).forEach(function(s) {
-    var a = s[0], d = s[1];
-    typeof d == "string" && (n[a] = d.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
-  })), n;
-}
-function Pt(t, e) {
-  var i, n = e.defIds;
-  return !n || n.length === 0 ? t : t.tag === "defs" && (!((i = t.children) === null || i === void 0) && i.length) ? v(v({}, t), { children: t.children.map(function(r) {
-    return typeof r.attrs.id == "string" && n && n.indexOf(r.attrs.id) > -1 ? v(v({}, r), { attrs: v(v({}, r.attrs), { id: r.attrs.id + e.idSuffix }) }) : r;
-  }) }) : t;
-}
-function bt() {
-  return Math.random().toString(36).substring(2, 8);
-}
-ie.displayName = "UniverIcon";
-var xt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.01953 3.13985C1.01953 2.77258 1.31726 2.47485 1.68453 2.47485H2.73713C3.1044 2.47485 3.40213 2.77258 3.40213 3.13985 3.40213 3.50712 3.1044 3.80485 2.73713 3.80485H1.68453C1.31726 3.80485 1.01953 3.50712 1.01953 3.13985zM4.17734 3.13985C4.17734 2.77258 4.47507 2.47485 4.84234 2.47485H6.94754C7.31481 2.47485 7.61254 2.77258 7.61254 3.13985 7.61254 3.50712 7.31481 3.80485 6.94754 3.80485H4.84234C4.47507 3.80485 4.17734 3.50712 4.17734 3.13985zM8.38775 3.13985C8.38775 2.77258 8.68548 2.47485 9.05275 2.47485H11.158C11.5252 2.47485 11.823 2.77258 11.823 3.13985 11.823 3.50712 11.5252 3.80485 11.158 3.80485H9.05275C8.68548 3.80485 8.38775 3.50712 8.38775 3.13985zM12.5982 3.13985C12.5982 2.77258 12.8959 2.47485 13.2632 2.47485H14.3158C14.683 2.47485 14.9808 2.77258 14.9808 3.13985 14.9808 3.50712 14.683 3.80485 14.3158 3.80485H13.2632C12.8959 3.80485 12.5982 3.50712 12.5982 3.13985zM1.01953 7.99972C1.01953 7.63245 1.31726 7.33472 1.68453 7.33472H14.3158C14.683 7.33472 14.9808 7.63245 14.9808 7.99972 14.9808 8.36699 14.683 8.66472 14.3158 8.66472H1.68453C1.31726 8.66472 1.01953 8.36699 1.01953 7.99972zM1.68453 12.1951C1.31726 12.1951 1.01953 12.4928 1.01953 12.8601 1.01953 13.2273 1.31726 13.5251 1.68453 13.5251H2.73713C3.1044 13.5251 3.40213 13.2273 3.40213 12.8601 3.40213 12.4928 3.1044 12.1951 2.73713 12.1951H1.68453zM4.84234 12.1951C4.47507 12.1951 4.17734 12.4928 4.17734 12.8601 4.17734 13.2273 4.47507 13.5251 4.84234 13.5251H6.94754C7.31481 13.5251 7.61254 13.2273 7.61254 12.8601 7.61254 12.4928 7.31481 12.1951 6.94754 12.1951H4.84234zM9.05275 12.1951C8.68548 12.1951 8.38775 12.4928 8.38775 12.8601 8.38775 13.2273 8.68548 13.5251 9.05275 13.5251H11.158C11.5252 13.5251 11.823 13.2273 11.823 12.8601 11.823 12.4928 11.5252 12.1951 11.158 12.1951H9.05275zM13.2632 12.1951C12.8959 12.1951 12.5982 12.4928 12.5982 12.8601 12.5982 13.2273 12.8959 13.5251 13.2632 13.5251H14.3158C14.683 13.5251 14.9808 13.2273 14.9808 12.8601 14.9808 12.4928 14.683 12.1951 14.3158 12.1951H13.2632z" } }] }, Z = te(function(t, e) {
-  return ne(ie, Object.assign({}, t, {
-    id: "divider-single",
-    ref: e,
-    icon: xt
-  }));
-});
-Z.displayName = "DividerSingle";
-var Mt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M2.66695 1.33496C2.29968 1.33496 2.00195 1.63269 2.00195 1.99996V3.64439C2.00195 4.01166 2.29968 4.30939 2.66695 4.30939C3.03422 4.30939 3.33195 4.01166 3.33195 3.64439V2.66496H7.33521V13.335H5.3337C4.96643 13.335 4.6687 13.6327 4.6687 14C4.6687 14.3672 4.96643 14.665 5.3337 14.665H10.667C11.0343 14.665 11.332 14.3672 11.332 14C11.332 13.6327 11.0343 13.335 10.667 13.335H8.66521V2.66496H12.6686V3.64439C12.6686 4.01166 12.9664 4.30939 13.3336 4.30939C13.7009 4.30939 13.9986 4.01166 13.9986 3.64439V1.99996C13.9986 1.63269 13.7009 1.33496 13.3336 1.33496H2.66695Z" } }] }, J = te(function(t, e) {
-  return ne(ie, Object.assign({}, t, {
-    id: "text-single",
-    ref: e,
-    icon: Mt
-  }));
-});
-J.displayName = "TextSingle";
-var wt = Object.getOwnPropertyDescriptor, Rt = (t, e, i, n) => {
-  for (var r = n > 1 ? void 0 : n ? wt(e, i) : e, s = t.length - 1, a; s >= 0; s--)
-    (a = t[s]) && (r = a(r) || r);
+z = Tt([
+  E(0, T),
+  E(1, f(Oe)),
+  E(2, f(C)),
+  E(3, f(Se)),
+  E(4, f(pe))
+], z);
+var Qt = Object.getOwnPropertyDescriptor, Ht = (t, e, i, n) => {
+  for (var r = n > 1 ? void 0 : n ? Qt(e, i) : e, s = t.length - 1, c; s >= 0; s--)
+    (c = t[s]) && (r = c(r) || r);
   return r;
-}, F = (t, e) => (i, n) => e(i, n, t);
-let j = class extends Y {
+}, re = (t, e) => (i, n) => e(i, n, t);
+let F = class extends Z {
   constructor(t, e, i) {
     super(), this._commandService = t, this._docQuickInsertPopupService = e, this._componentManager = i, this._initCommands(), this._initComponents(), this._initMenus();
   }
   _initCommands() {
     [
-      ve,
-      _e,
-      k
+      Me,
+      xe,
+      U
     ].forEach((t) => {
       this.disposeWithMe(this._commandService.registerCommand(t));
     });
   }
   _initComponents() {
     [
-      [H.componentKey, H],
-      [U.componentKey, U],
-      [Q.componentKey, Q],
-      [Z.displayName, Z],
-      [J.displayName, J]
+      [V.componentKey, V],
+      [B.componentKey, B],
+      [W.componentKey, W],
+      [ce.displayName, ce],
+      [ae.displayName, ae],
+      [q.componentKey, q]
     ].forEach(([e, i]) => {
       e && this.disposeWithMe(this._componentManager.register(e, i));
     }), [
       {
         keyword: "/",
-        menus$: at(_t),
+        menus$: lt(Nt),
         // only show when the cursor is at the beginning of a line
         preconditions: (e) => {
           var i;
@@ -641,43 +719,48 @@ let j = class extends Y {
   _initMenus() {
   }
 };
-j = Rt([
-  F(0, D),
-  F(1, g(C)),
-  F(2, g(fe))
-], j);
-var kt = Object.defineProperty, Dt = Object.getOwnPropertyDescriptor, Nt = (t, e, i) => e in t ? kt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[e] = i, Et = (t, e, i, n) => {
-  for (var r = n > 1 ? void 0 : n ? Dt(e, i) : e, s = t.length - 1, a; s >= 0; s--)
-    (a = t[s]) && (r = a(r) || r);
+F = Ht([
+  re(0, T),
+  re(1, f(C)),
+  re(2, f(Ie))
+], F);
+var Kt = Object.defineProperty, jt = Object.getOwnPropertyDescriptor, Lt = (t, e, i) => e in t ? Kt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[e] = i, At = (t, e, i, n) => {
+  for (var r = n > 1 ? void 0 : n ? jt(e, i) : e, s = t.length - 1, c; s >= 0; s--)
+    (c = t[s]) && (r = c(r) || r);
   return r;
-}, $t = (t, e) => (i, n) => e(i, n, t), xe = (t, e, i) => Nt(t, typeof e != "symbol" ? e + "" : e, i);
-const Tt = "DOC_QUICK_INSERT_UI_PLUGIN";
-let A = class extends He {
-  constructor(t) {
-    super(), this._injector = t;
+}, Ce = (t, e) => (i, n) => e(i, n, t), Te = (t, e, i) => Lt(t, typeof e != "symbol" ? e + "" : e, i);
+const Bt = "DOC_QUICK_INSERT_UI_PLUGIN";
+let G = class extends ze {
+  constructor(t, e) {
+    super(), this._injector = t, this._renderManagerSrv = e;
   }
   onStarting() {
     [
-      [j],
-      [K],
+      [F],
+      [z],
       [C]
-    ].forEach((e) => this._injector.add(e)), this._injector.get(j);
+    ].forEach((e) => this._injector.add(e)), this._injector.get(F);
   }
   onRendered() {
-    this._injector.get(K), this._injector.get(C);
+    this._injector.get(z), this._injector.get(C), [
+      [de]
+    ].forEach((t) => {
+      this._renderManagerSrv.registerRenderModule(Q.UNIVER_DOC, t);
+    });
   }
 };
-xe(A, "type", ee.UNIVER_DOC);
-xe(A, "pluginName", Tt);
-A = Et([
-  Ue(We, Le, Ae, Ke, qe),
-  $t(0, g(Qe))
-], A);
+Te(G, "type", Q.UNIVER_DOC);
+Te(G, "pluginName", Bt);
+G = At([
+  Ve(Xe, Je, Ze, Fe, Ye),
+  Ce(0, f(qe)),
+  Ce(1, f(le))
+], G);
 export {
   C as DocQuickInsertPopupService,
-  K as DocQuickInsertTriggerController,
-  j as DocQuickInsertUIController,
-  ft as KeywordInputPlaceholderComponentKey,
-  ht as QuickInsertPlaceholderComponentKey,
-  A as UniverDocsQuickInsertUIPlugin
+  z as DocQuickInsertTriggerController,
+  F as DocQuickInsertUIController,
+  Ct as KeywordInputPlaceholderComponentKey,
+  It as QuickInsertPlaceholderComponentKey,
+  G as UniverDocsQuickInsertUIPlugin
 };