@univerjs/docs-thread-comment-ui 0.5.5-nightly.202501210604 → 0.5.5-nightly.202501210849

package/lib/es/index.js

@@ -1,45 +1,46 @@
-var Re = Object.defineProperty;
-var ye = (e, t, r) => t in e ? Re(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r;
-var K = (e, t, r) => ye(e, typeof t != "symbol" ? t + "" : t, r);
-import { Inject as v, Disposable as B, CommandType as w, ICommandService as M, CustomDecorationType as X, sequenceExecute as se, UniverInstanceType as S, SHEET_EDITOR_UNITS as Te, useDependency as P, IUniverInstanceService as F, Injector as de, isInternalEditorID as ce, useObservable as G, UserManagerService as Ue, BuildTextUtils as Pe, DependentOn as Ee, Plugin as we, merge as Ne, IConfigService as Ae } from "@univerjs/core";
-import { IRenderManagerService as L, DocumentEditArea as te } from "@univerjs/engine-render";
-import { ThreadCommentPanelService as T, SetActiveCommentOperation as ae, ThreadCommentPanel as $e, UniverThreadCommentUIPlugin as Ve } from "@univerjs/thread-comment-ui";
-import { DocSelectionManagerService as H, DocSkeletonManagerService as je, RichTextEditingMutation as me, SetTextSelectionsOperation as Be, DocInterceptorService as Fe, DOC_INTERCEPTOR_POINT as Le } from "@univerjs/docs";
-import { addCustomDecorationBySelectionFactory as He, deleteCustomDecorationFactory as We, DocSelectionRenderService as qe, DocBackScrollRenderController as Je, DocRenderController as Ke } from "@univerjs/docs-ui";
-import { IThreadCommentDataSourceService as Ge, AddCommentMutation as Ze, getDT as ze, ThreadCommentModel as le } from "@univerjs/thread-comment";
-import { ISidebarService as W, MenuItemType as ue, getMenuHiddenObservable as fe, RibbonStartGroup as Ye, ContextMenuPosition as Qe, ContextMenuGroup as Xe, ComponentManager as ke, IMenuManagerService as et } from "@univerjs/ui";
-import { BehaviorSubject as tt, Observable as he, debounceTime as Ce, filter as nt } from "rxjs";
-import rt, { useMemo as Z, useState as it, useEffect as ot, forwardRef as _e, useRef as st, createElement as pe } from "react";
-const dt = "DOC_THREAD_COMMENT_UI_PLUGIN", I = "default_doc", ct = "docs-thread-comment-ui.config", ne = {};
-var at = Object.defineProperty, mt = Object.getOwnPropertyDescriptor, lt = (e, t, r, n) => {
-  for (var i = n > 1 ? void 0 : n ? mt(t, r) : t, o = e.length - 1, s; o >= 0; o--)
-    (s = e[o]) && (i = (n ? s(t, r, i) : s(i)) || i);
-  return n && i && at(t, r, i), i;
-}, re = (e, t) => (r, n) => t(r, n, e);
-let R = class extends B {
-  constructor(t, r) {
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value);
+import { Inject, Disposable, CommandType, ICommandService, CustomDecorationType, sequenceExecute, UniverInstanceType, SHEET_EDITOR_UNITS, useDependency, IUniverInstanceService, Injector, isInternalEditorID, useObservable, UserManagerService, BuildTextUtils, DependentOn, Plugin, merge, IConfigService } from "@univerjs/core";
+import { IRenderManagerService, DocumentEditArea } from "@univerjs/engine-render";
+import { ThreadCommentPanelService, SetActiveCommentOperation, ThreadCommentPanel, UniverThreadCommentUIPlugin } from "@univerjs/thread-comment-ui";
+import { DocSelectionManagerService, DocSkeletonManagerService, RichTextEditingMutation, SetTextSelectionsOperation, DocInterceptorService, DOC_INTERCEPTOR_POINT } from "@univerjs/docs";
+import { addCustomDecorationBySelectionFactory, deleteCustomDecorationFactory, DocSelectionRenderService, DocBackScrollRenderController, DocRenderController } from "@univerjs/docs-ui";
+import { IThreadCommentDataSourceService, AddCommentMutation, getDT, ThreadCommentModel } from "@univerjs/thread-comment";
+import { ISidebarService, MenuItemType, getMenuHiddenObservable, RibbonStartGroup, ContextMenuPosition, ContextMenuGroup, ComponentManager, IMenuManagerService } from "@univerjs/ui";
+import { BehaviorSubject, Observable, debounceTime, filter } from "rxjs";
+import require$$0, { useMemo, useState, useEffect, forwardRef, useRef, createElement } from "react";
+const PLUGIN_NAME = "DOC_THREAD_COMMENT_UI_PLUGIN", DEFAULT_DOC_SUBUNIT_ID = "default_doc", DOCS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY = "docs-thread-comment-ui.config", defaultPluginConfig = {};
+var __defProp$4 = Object.defineProperty, __getOwnPropDesc$4 = Object.getOwnPropertyDescriptor, __decorateClass$4 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$4(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+    (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
+  return kind && result && __defProp$4(target, key, result), result;
+}, "__decorateClass$4"), __decorateParam$4 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$4"), _a;
+let DocThreadCommentService = (_a = class extends Disposable {
+  constructor(_sidebarService, _threadCommentPanelService) {
     super();
-    K(this, "_addingComment$", new tt(void 0));
-    K(this, "addingComment$", this._addingComment$.asObservable());
-    this._sidebarService = t, this._threadCommentPanelService = r, this.disposeWithMe(() => {
+    __publicField(this, "_addingComment$", new BehaviorSubject(void 0));
+    __publicField(this, "addingComment$", this._addingComment$.asObservable());
+    this._sidebarService = _sidebarService, this._threadCommentPanelService = _threadCommentPanelService, this.disposeWithMe(() => {
       this._addingComment$.complete();
     });
   }
   get addingComment() {
     return this._addingComment$.getValue();
   }
-  startAdd(t) {
-    this._addingComment$.next(t);
+  startAdd(comment) {
+    this._addingComment$.next(comment);
   }
   endAdd() {
     this._addingComment$.next(void 0);
   }
-};
-R = lt([
-  re(0, W),
-  re(1, v(T))
-], R);
-var z = { exports: {} }, E = {};
+}, __name(_a, "DocThreadCommentService"), _a);
+DocThreadCommentService = __decorateClass$4([
+  __decorateParam$4(0, ISidebarService),
+  __decorateParam$4(1, Inject(ThreadCommentPanelService))
+], DocThreadCommentService);
+var jsxRuntime = { exports: {} }, reactJsxRuntime_production_min = {};
 /**
  * @license React
  * react-jsx-runtime.production.min.js
@@ -49,265 +50,269 @@ var z = { exports: {} }, E = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var ie;
-function ut() {
-  if (ie) return E;
-  ie = 1;
-  var e = rt, t = Symbol.for("react.element"), r = Symbol.for("react.fragment"), n = Object.prototype.hasOwnProperty, i = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, o = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function s(d, a, u) {
-    var c, f = {}, C = null, _ = null;
-    u !== void 0 && (C = "" + u), a.key !== void 0 && (C = "" + a.key), a.ref !== void 0 && (_ = a.ref);
-    for (c in a) n.call(a, c) && !o.hasOwnProperty(c) && (f[c] = a[c]);
-    if (d && d.defaultProps) for (c in a = d.defaultProps, a) f[c] === void 0 && (f[c] = a[c]);
-    return { $$typeof: t, type: d, key: C, ref: _, props: f, _owner: i.current };
+var hasRequiredReactJsxRuntime_production_min;
+function requireReactJsxRuntime_production_min() {
+  if (hasRequiredReactJsxRuntime_production_min) return reactJsxRuntime_production_min;
+  hasRequiredReactJsxRuntime_production_min = 1;
+  var f = require$$0, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function q(c, a, g) {
+    var b, d = {}, e = null, h = null;
+    g !== void 0 && (e = "" + g), a.key !== void 0 && (e = "" + a.key), a.ref !== void 0 && (h = a.ref);
+    for (b in a) m.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
+    if (c && c.defaultProps) for (b in a = c.defaultProps, a) d[b] === void 0 && (d[b] = a[b]);
+    return { $$typeof: k, type: c, key: e, ref: h, props: d, _owner: n.current };
   }
-  return E.Fragment = r, E.jsx = s, E.jsxs = s, E;
+  return __name(q, "q"), reactJsxRuntime_production_min.Fragment = l, reactJsxRuntime_production_min.jsx = q, reactJsxRuntime_production_min.jsxs = q, reactJsxRuntime_production_min;
 }
-var oe;
-function ft() {
-  return oe || (oe = 1, z.exports = ut()), z.exports;
+__name(requireReactJsxRuntime_production_min, "requireReactJsxRuntime_production_min");
+var hasRequiredJsxRuntime;
+function requireJsxRuntime() {
+  return hasRequiredJsxRuntime || (hasRequiredJsxRuntime = 1, jsxRuntime.exports = requireReactJsxRuntime_production_min()), jsxRuntime.exports;
 }
-var ht = ft();
-const ve = {
+__name(requireJsxRuntime, "requireJsxRuntime");
+var jsxRuntimeExports = requireJsxRuntime();
+const AddDocCommentComment = {
   id: "docs.command.add-comment",
-  type: w.COMMAND,
-  async handler(e, t) {
-    if (!t)
+  type: CommandType.COMMAND,
+  async handler(accessor, params) {
+    if (!params)
       return !1;
-    const { comment: r, unitId: n } = t, o = await e.get(Ge).addComment(r), s = e.get(M), d = He(
-      e,
+    const { comment: originComment, unitId } = params, comment = await accessor.get(IThreadCommentDataSourceService).addComment(originComment), commandService = accessor.get(ICommandService), doMutation = addCustomDecorationBySelectionFactory(
+      accessor,
       {
-        id: o.threadId,
-        type: X.COMMENT,
-        unitId: n
+        id: comment.threadId,
+        type: CustomDecorationType.COMMENT,
+        unitId
       }
     );
-    if (d) {
-      const a = {
-        id: Ze.id,
+    if (doMutation) {
+      const addComment = {
+        id: AddCommentMutation.id,
         params: {
-          unitId: n,
-          subUnitId: I,
-          comment: o
+          unitId,
+          subUnitId: DEFAULT_DOC_SUBUNIT_ID,
+          comment
         }
-      }, u = {
-        id: ae.id,
+      }, activeOperation = {
+        id: SetActiveCommentOperation.id,
         params: {
-          unitId: n,
-          subUnitId: I,
-          commentId: o.id
+          unitId,
+          subUnitId: DEFAULT_DOC_SUBUNIT_ID,
+          commentId: comment.id
         }
       };
-      return (await se([a, d, u], s)).result;
+      return (await sequenceExecute([addComment, doMutation, activeOperation], commandService)).result;
     }
     return !1;
   }
-}, ge = {
+}, DeleteDocCommentComment = {
   id: "docs.command.delete-comment",
-  type: w.COMMAND,
-  async handler(e, t) {
-    if (!t)
+  type: CommandType.COMMAND,
+  async handler(accessor, params) {
+    if (!params)
       return !1;
-    const { commentId: r, unitId: n } = t, i = e.get(M), o = We(e, {
-      id: r,
-      unitId: n
+    const { commentId, unitId } = params, commandService = accessor.get(ICommandService), doMutation = deleteCustomDecorationFactory(accessor, {
+      id: commentId,
+      unitId
     });
-    return o ? (await se([o], i)).result : !1;
+    return doMutation ? (await sequenceExecute([doMutation], commandService)).result : !1;
   }
-}, Ie = (e) => {
-  const t = e.get(L), r = e.get(H), n = t.getCurrent(), i = n == null ? void 0 : n.with(je).getSkeleton(), o = i == null ? void 0 : i.getViewModel().getEditArea();
-  if (o === te.FOOTER || o === te.HEADER)
+}, shouldDisableAddComment = /* @__PURE__ */ __name((accessor) => {
+  const renderManagerService = accessor.get(IRenderManagerService), docSelectionManagerService = accessor.get(DocSelectionManagerService), render2 = renderManagerService.getCurrent(), skeleton = render2 == null ? void 0 : render2.with(DocSkeletonManagerService).getSkeleton(), editArea = skeleton == null ? void 0 : skeleton.getViewModel().getEditArea();
+  if (editArea === DocumentEditArea.FOOTER || editArea === DocumentEditArea.HEADER)
     return !0;
-  const s = r.getActiveTextRange();
-  return !!(s == null || s.collapsed);
-};
-function Ct(e) {
+  const range = docSelectionManagerService.getActiveTextRange();
+  return !!(range == null || range.collapsed);
+}, "shouldDisableAddComment");
+function AddDocCommentMenuItemFactory(accessor) {
   return {
-    id: q.id,
-    type: ue.BUTTON,
+    id: StartAddCommentOperation.id,
+    type: MenuItemType.BUTTON,
     icon: "CommentSingle",
     title: "threadCommentUI.panel.addComment",
     tooltip: "threadCommentUI.panel.addComment",
-    hidden$: fe(e, S.UNIVER_DOC, void 0, Te),
-    disabled$: new he(function(t) {
-      const n = e.get(H).textSelection$.pipe(Ce(16)).subscribe(() => {
-        t.next(Ie(e));
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC, void 0, SHEET_EDITOR_UNITS),
+    disabled$: new Observable(function(subscribe) {
+      const observer = accessor.get(DocSelectionManagerService).textSelection$.pipe(debounceTime(16)).subscribe(() => {
+        subscribe.next(shouldDisableAddComment(accessor));
       });
       return () => {
-        n.unsubscribe();
+        observer.unsubscribe();
       };
     })
   };
 }
-function _t(e) {
+__name(AddDocCommentMenuItemFactory, "AddDocCommentMenuItemFactory");
+function ToolbarDocCommentMenuItemFactory(accessor) {
   return {
-    id: ee.id,
-    type: ue.BUTTON,
+    id: ToggleCommentPanelOperation.id,
+    type: MenuItemType.BUTTON,
     icon: "CommentSingle",
     title: "threadCommentUI.panel.addComment",
     tooltip: "threadCommentUI.panel.addComment",
-    hidden$: fe(e, S.UNIVER_DOC)
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
-const y = () => {
-  const e = P(F), t = P(de), r = Z(() => e.getCurrentTypeOfUnit$(S.UNIVER_DOC).pipe(nt((m) => !!m && !ce(m.getUnitId()))), [e]), n = G(r), i = Z(() => new he((m) => m.next(I)), []), o = P(H), s = Z(
-    () => o.textSelection$.pipe(Ce(16)),
-    [o.textSelection$]
+__name(ToolbarDocCommentMenuItemFactory, "ToolbarDocCommentMenuItemFactory");
+const DocThreadCommentPanel = /* @__PURE__ */ __name(() => {
+  const univerInstanceService = useDependency(IUniverInstanceService), injector = useDependency(Injector), doc$ = useMemo(() => univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_DOC).pipe(filter((doc2) => !!doc2 && !isInternalEditorID(doc2.getUnitId()))), [univerInstanceService]), doc = useObservable(doc$), subUnitId$ = useMemo(() => new Observable((sub) => sub.next(DEFAULT_DOC_SUBUNIT_ID)), []), docSelectionManagerService = useDependency(DocSelectionManagerService), selectionChange$ = useMemo(
+    () => docSelectionManagerService.textSelection$.pipe(debounceTime(16)),
+    [docSelectionManagerService.textSelection$]
   );
-  G(s);
-  const d = P(M), a = P(R), u = G(a.addingComment$), [c, f] = it([]);
-  if (ot(() => {
-    var b;
-    const m = /* @__PURE__ */ new Set(), l = n == null ? void 0 : n.getCustomDecorations();
-    f((b = l == null ? void 0 : l.map((h) => h.id).filter((h) => {
-      const O = m.has(h);
-      return m.add(h), !O;
-    })) != null ? b : []);
-    const g = d.onCommandExecuted((h) => {
-      var O;
-      if (h.id === me.id) {
-        const U = /* @__PURE__ */ new Set(), J = n == null ? void 0 : n.getCustomDecorations();
-        f((O = J == null ? void 0 : J.map((N) => N.id).filter((N) => {
-          const De = U.has(N);
-          return U.add(N), !De;
-        })) != null ? O : []);
+  useObservable(selectionChange$);
+  const commandService = useDependency(ICommandService), docCommentService = useDependency(DocThreadCommentService), tempComment = useObservable(docCommentService.addingComment$), [commentIds, setCommentIds] = useState([]);
+  if (useEffect(() => {
+    var _a6;
+    const set = /* @__PURE__ */ new Set(), customRanges = doc == null ? void 0 : doc.getCustomDecorations();
+    setCommentIds((_a6 = customRanges == null ? void 0 : customRanges.map((r) => r.id).filter((i) => {
+      const hasRepeat = set.has(i);
+      return set.add(i), !hasRepeat;
+    })) != null ? _a6 : []);
+    const dispose = commandService.onCommandExecuted((command) => {
+      var _a7;
+      if (command.id === RichTextEditingMutation.id) {
+        const set2 = /* @__PURE__ */ new Set(), customRanges2 = doc == null ? void 0 : doc.getCustomDecorations();
+        setCommentIds((_a7 = customRanges2 == null ? void 0 : customRanges2.map((r) => r.id).filter((i) => {
+          const hasRepeat = set2.has(i);
+          return set2.add(i), !hasRepeat;
+        })) != null ? _a7 : []);
       }
     });
     return () => {
-      g.dispose();
+      dispose.dispose();
     };
-  }, [d, n]), !n)
+  }, [commandService, doc]), !doc)
     return null;
-  const C = Ie(t), _ = n.getUnitId();
-  return /* @__PURE__ */ ht.jsx(
-    $e,
+  const isInValidSelection = shouldDisableAddComment(injector), unitId = doc.getUnitId();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    ThreadCommentPanel,
     {
-      unitId: _,
-      subUnitId$: i,
-      type: S.UNIVER_DOC,
-      onAdd: () => {
-        d.executeCommand(q.id);
-      },
-      getSubUnitName: () => "",
-      disableAdd: C,
-      tempComment: u,
-      onAddComment: (m) => {
-        if (!m.parentId) {
-          const l = {
-            unitId: _,
-            range: u,
-            comment: m
+      unitId,
+      subUnitId$,
+      type: UniverInstanceType.UNIVER_DOC,
+      onAdd: /* @__PURE__ */ __name(() => {
+        commandService.executeCommand(StartAddCommentOperation.id);
+      }, "onAdd"),
+      getSubUnitName: /* @__PURE__ */ __name(() => "", "getSubUnitName"),
+      disableAdd: isInValidSelection,
+      tempComment,
+      onAddComment: /* @__PURE__ */ __name((comment) => {
+        if (!comment.parentId) {
+          const params = {
+            unitId,
+            range: tempComment,
+            comment
           };
-          return d.executeCommand(ve.id, l), a.endAdd(), !1;
+          return commandService.executeCommand(AddDocCommentComment.id, params), docCommentService.endAdd(), !1;
         }
         return !0;
-      },
-      onDeleteComment: (m) => {
-        if (!m.parentId) {
-          const l = {
-            unitId: _,
-            commentId: m.id
+      }, "onAddComment"),
+      onDeleteComment: /* @__PURE__ */ __name((comment) => {
+        if (!comment.parentId) {
+          const params = {
+            unitId,
+            commentId: comment.id
           };
-          return d.executeCommand(ge.id, l), !1;
+          return commandService.executeCommand(DeleteDocCommentComment.id, params), !1;
         }
         return !0;
-      },
-      showComments: c
+      }, "onDeleteComment"),
+      showComments: commentIds
     }
   );
-};
-y.componentKey = "univer.doc.thread-comment-panel";
-const A = {
+}, "DocThreadCommentPanel");
+DocThreadCommentPanel.componentKey = "univer.doc.thread-comment-panel";
+const ShowCommentPanelOperation = {
   id: "docs.operation.show-comment-panel",
-  type: w.OPERATION,
-  handler(e, t) {
-    var i;
-    const r = e.get(T), n = e.get(W);
-    return (!r.panelVisible || ((i = n.options.children) == null ? void 0 : i.label) !== y.componentKey) && (n.open({
+  type: CommandType.OPERATION,
+  handler(accessor, params) {
+    var _a6;
+    const panelService = accessor.get(ThreadCommentPanelService), sidebarService = accessor.get(ISidebarService);
+    return (!panelService.panelVisible || ((_a6 = sidebarService.options.children) == null ? void 0 : _a6.label) !== DocThreadCommentPanel.componentKey) && (sidebarService.open({
       header: { title: "threadCommentUI.panel.title" },
-      children: { label: y.componentKey },
+      children: { label: DocThreadCommentPanel.componentKey },
       width: 320,
-      onClose: () => r.setPanelVisible(!1)
-    }), r.setPanelVisible(!0)), t && r.setActiveComment(t == null ? void 0 : t.activeComment), !0;
+      onClose: /* @__PURE__ */ __name(() => panelService.setPanelVisible(!1), "onClose")
+    }), panelService.setPanelVisible(!0)), params && panelService.setActiveComment(params == null ? void 0 : params.activeComment), !0;
   }
-}, ee = {
+}, ToggleCommentPanelOperation = {
   id: "docs.operation.toggle-comment-panel",
-  type: w.OPERATION,
-  handler(e) {
-    var n;
-    const t = e.get(T), r = e.get(W);
-    return !t.panelVisible || ((n = r.options.children) == null ? void 0 : n.label) !== y.componentKey ? (r.open({
+  type: CommandType.OPERATION,
+  handler(accessor) {
+    var _a6;
+    const panelService = accessor.get(ThreadCommentPanelService), sidebarService = accessor.get(ISidebarService);
+    return !panelService.panelVisible || ((_a6 = sidebarService.options.children) == null ? void 0 : _a6.label) !== DocThreadCommentPanel.componentKey ? (sidebarService.open({
       header: { title: "threadCommentUI.panel.title" },
-      children: { label: y.componentKey },
+      children: { label: DocThreadCommentPanel.componentKey },
       width: 320,
-      onClose: () => t.setPanelVisible(!1)
-    }), t.setPanelVisible(!0)) : (r.close(), t.setPanelVisible(!1), t.setActiveComment(null)), !0;
+      onClose: /* @__PURE__ */ __name(() => panelService.setPanelVisible(!1), "onClose")
+    }), panelService.setPanelVisible(!0)) : (sidebarService.close(), panelService.setPanelVisible(!1), panelService.setActiveComment(null)), !0;
   }
-}, q = {
+}, StartAddCommentOperation = {
   id: "docs.operation.start-add-comment",
-  type: w.OPERATION,
-  handler(e) {
-    var h, O, U;
-    const t = e.get(T), n = e.get(F).getCurrentUnitForType(S.UNIVER_DOC), i = e.get(H), o = e.get(L), s = e.get(Ue), d = e.get(R), a = e.get(M), u = e.get(W), c = i.getActiveTextRange();
-    if (!n || !c)
+  type: CommandType.OPERATION,
+  handler(accessor) {
+    var _a6, _b, _c;
+    const panelService = accessor.get(ThreadCommentPanelService), doc = accessor.get(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_DOC), docSelectionManagerService = accessor.get(DocSelectionManagerService), renderManagerService = accessor.get(IRenderManagerService), userManagerService = accessor.get(UserManagerService), docCommentService = accessor.get(DocThreadCommentService), commandService = accessor.get(ICommandService), sidebarService = accessor.get(ISidebarService), textRange = docSelectionManagerService.getActiveTextRange();
+    if (!doc || !textRange)
       return !1;
-    const f = (h = o.getRenderById(n.getUnitId())) == null ? void 0 : h.with(qe);
-    if (f == null || f.setReserveRangesStatus(!0), c.collapsed)
-      return t.panelVisible ? (t.setPanelVisible(!1), u.close()) : a.executeCommand(A.id), !0;
-    a.executeCommand(A.id);
-    const C = n.getUnitId(), _ = ((U = (O = n.getBody()) == null ? void 0 : O.dataStream) != null ? U : "").slice(c.startOffset, c.endOffset), m = Pe.transform.getPlainText(_), l = I, g = "", b = {
-      unitId: C,
-      subUnitId: l,
-      id: g,
-      ref: m,
-      dT: ze(),
-      personId: s.getCurrentUser().userID,
+    const docSelectionRenderManager = (_a6 = renderManagerService.getRenderById(doc.getUnitId())) == null ? void 0 : _a6.with(DocSelectionRenderService);
+    if (docSelectionRenderManager == null || docSelectionRenderManager.setReserveRangesStatus(!0), textRange.collapsed)
+      return panelService.panelVisible ? (panelService.setPanelVisible(!1), sidebarService.close()) : commandService.executeCommand(ShowCommentPanelOperation.id), !0;
+    commandService.executeCommand(ShowCommentPanelOperation.id);
+    const unitId = doc.getUnitId(), dataStream = ((_c = (_b = doc.getBody()) == null ? void 0 : _b.dataStream) != null ? _c : "").slice(textRange.startOffset, textRange.endOffset), text = BuildTextUtils.transform.getPlainText(dataStream), subUnitId = DEFAULT_DOC_SUBUNIT_ID, commentId = "", comment = {
+      unitId,
+      subUnitId,
+      id: commentId,
+      ref: text,
+      dT: getDT(),
+      personId: userManagerService.getCurrentUser().userID,
       text: {
         dataStream: `\r
 `
       },
-      startOffset: c.startOffset,
-      endOffset: c.endOffset,
+      startOffset: textRange.startOffset,
+      endOffset: textRange.endOffset,
       collapsed: !0,
-      threadId: g
+      threadId: commentId
     };
-    return f == null || f.blur(), d.startAdd(b), t.setActiveComment({
-      unitId: C,
-      subUnitId: l,
-      commentId: g
+    return docSelectionRenderManager == null || docSelectionRenderManager.blur(), docCommentService.startAdd(comment), panelService.setActiveComment({
+      unitId,
+      subUnitId,
+      commentId
     }), !0;
   }
 };
-var pt = Object.defineProperty, vt = Object.getOwnPropertyDescriptor, gt = (e, t, r, n) => {
-  for (var i = n > 1 ? void 0 : n ? vt(t, r) : t, o = e.length - 1, s; o >= 0; o--)
-    (s = e[o]) && (i = (n ? s(t, r, i) : s(i)) || i);
-  return n && i && pt(t, r, i), i;
-}, x = (e, t) => (r, n) => t(r, n, e);
-let $ = class extends B {
-  constructor(e, t, r, n, i, o) {
-    super(), this._threadCommentPanelService = e, this._univerInstanceService = t, this._commandService = r, this._docThreadCommentService = n, this._renderManagerService = i, this._threadCommentModel = o, this._initSelectionChange(), this._initActiveCommandChange();
+var __defProp$3 = Object.defineProperty, __getOwnPropDesc$3 = Object.getOwnPropertyDescriptor, __decorateClass$3 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$3(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+    (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
+  return kind && result && __defProp$3(target, key, result), result;
+}, "__decorateClass$3"), __decorateParam$3 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$3"), _a2;
+let DocThreadCommentSelectionController = (_a2 = class extends Disposable {
+  constructor(_threadCommentPanelService, _univerInstanceService, _commandService, _docThreadCommentService, _renderManagerService, _threadCommentModel) {
+    super(), this._threadCommentPanelService = _threadCommentPanelService, this._univerInstanceService = _univerInstanceService, this._commandService = _commandService, this._docThreadCommentService = _docThreadCommentService, this._renderManagerService = _renderManagerService, this._threadCommentModel = _threadCommentModel, this._initSelectionChange(), this._initActiveCommandChange();
   }
   _initSelectionChange() {
-    let e;
+    let lastSelection;
     this.disposeWithMe(
-      this._commandService.onCommandExecuted((t) => {
-        var r, n, i, o;
-        if (t.id === Be.id) {
-          const s = t.params, { unitId: d, ranges: a } = s;
-          if (ce(d)) return;
-          const u = this._univerInstanceService.getUnit(d, S.UNIVER_DOC), c = a[0];
-          if ((e == null ? void 0 : e.startOffset) === (c == null ? void 0 : c.startOffset) && (e == null ? void 0 : e.endOffset) === (c == null ? void 0 : c.endOffset))
+      this._commandService.onCommandExecuted((commandInfo) => {
+        var _a6, _b, _c, _d;
+        if (commandInfo.id === SetTextSelectionsOperation.id) {
+          const params = commandInfo.params, { unitId, ranges } = params;
+          if (isInternalEditorID(unitId)) return;
+          const doc = this._univerInstanceService.getUnit(unitId, UniverInstanceType.UNIVER_DOC), primary = ranges[0];
+          if ((lastSelection == null ? void 0 : lastSelection.startOffset) === (primary == null ? void 0 : primary.startOffset) && (lastSelection == null ? void 0 : lastSelection.endOffset) === (primary == null ? void 0 : primary.endOffset))
             return;
-          if (e = c, c && u) {
-            const { startOffset: f, endOffset: C, collapsed: _ } = c;
-            let m;
-            if (_ ? m = (n = (r = u.getBody()) == null ? void 0 : r.customDecorations) == null ? void 0 : n.find((l) => l.startIndex <= f && l.endIndex >= C - 1) : m = (o = (i = u.getBody()) == null ? void 0 : i.customDecorations) == null ? void 0 : o.find((l) => l.startIndex <= f && l.endIndex >= C - 1), m) {
-              const l = this._threadCommentModel.getComment(d, I, m.id);
-              l && !l.resolved && this._commandService.executeCommand(A.id, {
+          if (lastSelection = primary, primary && doc) {
+            const { startOffset, endOffset, collapsed } = primary;
+            let customRange;
+            if (collapsed ? customRange = (_b = (_a6 = doc.getBody()) == null ? void 0 : _a6.customDecorations) == null ? void 0 : _b.find((value) => value.startIndex <= startOffset && value.endIndex >= endOffset - 1) : customRange = (_d = (_c = doc.getBody()) == null ? void 0 : _c.customDecorations) == null ? void 0 : _d.find((value) => value.startIndex <= startOffset && value.endIndex >= endOffset - 1), customRange) {
+              const comment = this._threadCommentModel.getComment(unitId, DEFAULT_DOC_SUBUNIT_ID, customRange.id);
+              comment && !comment.resolved && this._commandService.executeCommand(ShowCommentPanelOperation.id, {
                 activeComment: {
-                  unitId: d,
-                  subUnitId: I,
-                  commentId: m.id
+                  unitId,
+                  subUnitId: DEFAULT_DOC_SUBUNIT_ID,
+                  commentId: customRange.id
                 }
               });
               return;
@@ -315,260 +320,264 @@ let $ = class extends B {
           }
           if (!this._threadCommentPanelService.activeCommentId)
             return;
-          this._commandService.executeCommand(ae.id);
+          this._commandService.executeCommand(SetActiveCommentOperation.id);
         }
       })
     );
   }
   _initActiveCommandChange() {
-    this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe((e) => {
-      var t, r, n, i;
-      if (e) {
-        const o = this._univerInstanceService.getUnit(e.unitId);
-        if (o) {
-          const s = (t = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : t.with(Je), d = (n = (r = o.getBody()) == null ? void 0 : r.customDecorations) == null ? void 0 : n.find((a) => a.id === e.commentId);
-          d && s && s.scrollToRange({
-            startOffset: d.startIndex,
-            endOffset: d.endIndex,
+    this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe((activeComment) => {
+      var _a6, _b, _c, _d;
+      if (activeComment) {
+        const doc = this._univerInstanceService.getUnit(activeComment.unitId);
+        if (doc) {
+          const backScrollController = (_a6 = this._renderManagerService.getRenderById(activeComment.unitId)) == null ? void 0 : _a6.with(DocBackScrollRenderController), customRange = (_c = (_b = doc.getBody()) == null ? void 0 : _b.customDecorations) == null ? void 0 : _c.find((range) => range.id === activeComment.commentId);
+          customRange && backScrollController && backScrollController.scrollToRange({
+            startOffset: customRange.startIndex,
+            endOffset: customRange.endIndex,
             collapsed: !1
           });
         }
       }
-      (!e || e.commentId !== ((i = this._docThreadCommentService.addingComment) == null ? void 0 : i.id)) && this._docThreadCommentService.endAdd();
+      (!activeComment || activeComment.commentId !== ((_d = this._docThreadCommentService.addingComment) == null ? void 0 : _d.id)) && this._docThreadCommentService.endAdd();
     }));
   }
-};
-$ = gt([
-  x(0, v(T)),
-  x(1, F),
-  x(2, M),
-  x(3, v(R)),
-  x(4, L),
-  x(5, v(le))
-], $);
-var p = function() {
-  return p = Object.assign || function(e) {
-    for (var t, r = 1, n = arguments.length; r < n; r++) {
-      t = arguments[r];
-      for (var i in t) Object.prototype.hasOwnProperty.call(t, i) && (e[i] = t[i]);
+}, __name(_a2, "DocThreadCommentSelectionController"), _a2);
+DocThreadCommentSelectionController = __decorateClass$3([
+  __decorateParam$3(0, Inject(ThreadCommentPanelService)),
+  __decorateParam$3(1, IUniverInstanceService),
+  __decorateParam$3(2, ICommandService),
+  __decorateParam$3(3, Inject(DocThreadCommentService)),
+  __decorateParam$3(4, IRenderManagerService),
+  __decorateParam$3(5, Inject(ThreadCommentModel))
+], DocThreadCommentSelectionController);
+var __assign = function() {
+  return __assign = Object.assign || function(t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && (t[p] = s[p]);
     }
-    return e;
-  }, p.apply(this, arguments);
-}, It = function(e, t) {
-  var r = {};
-  for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && t.indexOf(n) < 0 && (r[n] = e[n]);
-  if (e != null && typeof Object.getOwnPropertySymbols == "function")
-    for (var i = 0, n = Object.getOwnPropertySymbols(e); i < n.length; i++)
-      t.indexOf(n[i]) < 0 && Object.prototype.propertyIsEnumerable.call(e, n[i]) && (r[n[i]] = e[n[i]]);
-  return r;
-}, Se = _e(function(e, t) {
-  var r = e.icon, n = e.id, i = e.className, o = e.extend, s = It(e, ["icon", "id", "className", "extend"]), d = "univerjs-icon univerjs-icon-".concat(n, " ").concat(i || "").trim(), a = st("_".concat(Mt()));
-  return Oe(r, "".concat(n), { defIds: r.defIds, idSuffix: a.current }, p({ ref: t, className: d }, s), o);
+    return t;
+  }, __assign.apply(this, arguments);
+}, __rest = function(s, e) {
+  var t = {};
+  for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0 && (t[p] = s[p]);
+  if (s != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++)
+      e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]) && (t[p[i]] = s[p[i]]);
+  return t;
+}, IconBase = forwardRef(function(props, ref) {
+  var icon = props.icon, id = props.id, className = props.className, extend = props.extend, restProps = __rest(props, ["icon", "id", "className", "extend"]), cls = "univerjs-icon univerjs-icon-".concat(id, " ").concat(className || "").trim(), idSuffix = useRef("_".concat(generateShortUuid()));
+  return render(icon, "".concat(id), { defIds: icon.defIds, idSuffix: idSuffix.current }, __assign({ ref, className: cls }, restProps), extend);
 });
-function Oe(e, t, r, n, i) {
-  return pe(e.tag, p(p({ key: t }, St(e, r, i)), n), (Ot(e, r).children || []).map(function(o, s) {
-    return Oe(o, "".concat(t, "-").concat(e.tag, "-").concat(s), r, void 0, i);
+function render(node, id, runtimeProps, rootProps, extend) {
+  return createElement(node.tag, __assign(__assign({ key: id }, replaceRuntimeIdsAndExtInAttrs(node, runtimeProps, extend)), rootProps), (replaceRuntimeIdsInDefs(node, runtimeProps).children || []).map(function(child, index) {
+    return render(child, "".concat(id, "-").concat(node.tag, "-").concat(index), runtimeProps, void 0, extend);
   }));
 }
-function St(e, t, r) {
-  var n = p({}, e.attrs);
-  r != null && r.colorChannel1 && n.fill === "colorChannel1" && (n.fill = r.colorChannel1);
-  var i = t.defIds;
-  return !i || i.length === 0 || (e.tag === "use" && n["xlink:href"] && (n["xlink:href"] = n["xlink:href"] + t.idSuffix), Object.entries(n).forEach(function(o) {
-    var s = o[0], d = o[1];
-    typeof d == "string" && (n[s] = d.replace(/url\(#(.*)\)/, "url(#$1".concat(t.idSuffix, ")")));
-  })), n;
+__name(render, "render");
+function replaceRuntimeIdsAndExtInAttrs(node, runtimeProps, extend) {
+  var attrs = __assign({}, node.attrs);
+  extend != null && extend.colorChannel1 && attrs.fill === "colorChannel1" && (attrs.fill = extend.colorChannel1);
+  var defIds = runtimeProps.defIds;
+  return !defIds || defIds.length === 0 || (node.tag === "use" && attrs["xlink:href"] && (attrs["xlink:href"] = attrs["xlink:href"] + runtimeProps.idSuffix), Object.entries(attrs).forEach(function(_a6) {
+    var key = _a6[0], value = _a6[1];
+    typeof value == "string" && (attrs[key] = value.replace(/url\(#(.*)\)/, "url(#$1".concat(runtimeProps.idSuffix, ")")));
+  })), attrs;
 }
-function Ot(e, t) {
-  var r, n = t.defIds;
-  return !n || n.length === 0 ? e : e.tag === "defs" && (!((r = e.children) === null || r === void 0) && r.length) ? p(p({}, e), { children: e.children.map(function(i) {
-    return typeof i.attrs.id == "string" && n && n.indexOf(i.attrs.id) > -1 ? p(p({}, i), { attrs: p(p({}, i.attrs), { id: i.attrs.id + t.idSuffix }) }) : i;
-  }) }) : e;
+__name(replaceRuntimeIdsAndExtInAttrs, "replaceRuntimeIdsAndExtInAttrs");
+function replaceRuntimeIdsInDefs(node, runtimeProps) {
+  var _a6, defIds = runtimeProps.defIds;
+  return !defIds || defIds.length === 0 ? node : node.tag === "defs" && (!((_a6 = node.children) === null || _a6 === void 0) && _a6.length) ? __assign(__assign({}, node), { children: node.children.map(function(child) {
+    return typeof child.attrs.id == "string" && defIds && defIds.indexOf(child.attrs.id) > -1 ? __assign(__assign({}, child), { attrs: __assign(__assign({}, child.attrs), { id: child.attrs.id + runtimeProps.idSuffix }) }) : child;
+  }) }) : node;
 }
-function Mt() {
+__name(replaceRuntimeIdsInDefs, "replaceRuntimeIdsInDefs");
+function generateShortUuid() {
   return Math.random().toString(36).substring(2, 8);
 }
-Se.displayName = "UniverIcon";
-var bt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 17 17", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M5.83725 6.78345C6.22188 6.78345 6.53368 7.10742 6.53368 7.50706V8.41159C6.53368 8.81123 6.22188 9.13521 5.83725 9.13521C5.45263 9.13521 5.14082 8.81123 5.14082 8.41159V7.50706C5.14082 7.10742 5.45263 6.78345 5.83725 6.78345ZM8.73904 6.78345C9.12366 6.78345 9.43546 7.10742 9.43546 7.50706V8.41159C9.43546 8.81123 9.12366 9.13521 8.73904 9.13521C8.35441 9.13521 8.04261 8.81123 8.04261 8.41159V7.50706C8.04261 7.10742 8.35441 6.78345 8.73904 6.78345ZM11.6408 6.78345C12.0254 6.78345 12.3372 7.10742 12.3372 7.50706V8.41159C12.3372 8.81123 12.0254 9.13521 11.6408 9.13521C11.2562 9.13521 10.9444 8.81123 10.9444 8.41159V7.50706C10.9444 7.10742 11.2562 6.78345 11.6408 6.78345Z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M5.83725 6.78345C6.22188 6.78345 6.53368 7.10742 6.53368 7.50706V8.41159C6.53368 8.81123 6.22188 9.13521 5.83725 9.13521 5.45263 9.13521 5.14082 8.81123 5.14082 8.41159V7.50706C5.14082 7.10742 5.45263 6.78345 5.83725 6.78345zM8.73904 6.78345C9.12366 6.78345 9.43546 7.10742 9.43546 7.50706V8.41159C9.43546 8.81123 9.12366 9.13521 8.73904 9.13521 8.35441 9.13521 8.04261 8.81123 8.04261 8.41159V7.50706C8.04261 7.10742 8.35441 6.78345 8.73904 6.78345zM11.6408 6.78345C12.0254 6.78345 12.3372 7.10742 12.3372 7.50706V8.41159C12.3372 8.81123 12.0254 9.13521 11.6408 9.13521 11.2562 9.13521 10.9444 8.81123 10.9444 8.41159V7.50706C10.9444 7.10742 11.2562 6.78345 11.6408 6.78345z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M1.84351 3.41861C1.84351 3.01861 2.15531 2.69434 2.53993 2.69434H14.9381C15.3228 2.69434 15.6346 3.01861 15.6346 3.41861V12.4611C15.6346 12.8612 15.3228 13.1854 14.9381 13.1854H8.82117L6.06643 14.6179C5.85054 14.7301 5.59416 14.7181 5.38884 14.5862C5.18352 14.4542 5.05855 14.2211 5.05855 13.9701V13.1854H2.53993C2.15531 13.1854 1.84351 12.8612 1.84351 12.4611L1.84351 3.41861ZM6.45141 12.7982L8.34531 12.0135C8.44201 11.9632 8.54864 11.9371 8.65676 11.9371H14.2417C14.3522 11.9371 14.4417 11.8475 14.4417 11.7371V4.14271C14.4417 4.03225 14.3522 3.94271 14.2417 3.94271H3.23636C3.12591 3.94271 3.03636 4.03225 3.03636 4.14271L3.03636 11.7371C3.03636 11.8475 3.12591 11.9371 3.23636 11.9371L5.75498 11.9371C6.1396 11.9371 6.45141 12.0611 6.45141 12.4611V12.7982Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, Me = _e(function(e, t) {
-  return pe(Se, Object.assign({}, e, {
+__name(generateShortUuid, "generateShortUuid");
+IconBase.displayName = "UniverIcon";
+var element = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 17 17", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M5.83725 6.78345C6.22188 6.78345 6.53368 7.10742 6.53368 7.50706V8.41159C6.53368 8.81123 6.22188 9.13521 5.83725 9.13521C5.45263 9.13521 5.14082 8.81123 5.14082 8.41159V7.50706C5.14082 7.10742 5.45263 6.78345 5.83725 6.78345ZM8.73904 6.78345C9.12366 6.78345 9.43546 7.10742 9.43546 7.50706V8.41159C9.43546 8.81123 9.12366 9.13521 8.73904 9.13521C8.35441 9.13521 8.04261 8.81123 8.04261 8.41159V7.50706C8.04261 7.10742 8.35441 6.78345 8.73904 6.78345ZM11.6408 6.78345C12.0254 6.78345 12.3372 7.10742 12.3372 7.50706V8.41159C12.3372 8.81123 12.0254 9.13521 11.6408 9.13521C11.2562 9.13521 10.9444 8.81123 10.9444 8.41159V7.50706C10.9444 7.10742 11.2562 6.78345 11.6408 6.78345Z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M5.83725 6.78345C6.22188 6.78345 6.53368 7.10742 6.53368 7.50706V8.41159C6.53368 8.81123 6.22188 9.13521 5.83725 9.13521 5.45263 9.13521 5.14082 8.81123 5.14082 8.41159V7.50706C5.14082 7.10742 5.45263 6.78345 5.83725 6.78345zM8.73904 6.78345C9.12366 6.78345 9.43546 7.10742 9.43546 7.50706V8.41159C9.43546 8.81123 9.12366 9.13521 8.73904 9.13521 8.35441 9.13521 8.04261 8.81123 8.04261 8.41159V7.50706C8.04261 7.10742 8.35441 6.78345 8.73904 6.78345zM11.6408 6.78345C12.0254 6.78345 12.3372 7.10742 12.3372 7.50706V8.41159C12.3372 8.81123 12.0254 9.13521 11.6408 9.13521 11.2562 9.13521 10.9444 8.81123 10.9444 8.41159V7.50706C10.9444 7.10742 11.2562 6.78345 11.6408 6.78345z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M1.84351 3.41861C1.84351 3.01861 2.15531 2.69434 2.53993 2.69434H14.9381C15.3228 2.69434 15.6346 3.01861 15.6346 3.41861V12.4611C15.6346 12.8612 15.3228 13.1854 14.9381 13.1854H8.82117L6.06643 14.6179C5.85054 14.7301 5.59416 14.7181 5.38884 14.5862C5.18352 14.4542 5.05855 14.2211 5.05855 13.9701V13.1854H2.53993C2.15531 13.1854 1.84351 12.8612 1.84351 12.4611L1.84351 3.41861ZM6.45141 12.7982L8.34531 12.0135C8.44201 11.9632 8.54864 11.9371 8.65676 11.9371H14.2417C14.3522 11.9371 14.4417 11.8475 14.4417 11.7371V4.14271C14.4417 4.03225 14.3522 3.94271 14.2417 3.94271H3.23636C3.12591 3.94271 3.03636 4.03225 3.03636 4.14271L3.03636 11.7371C3.03636 11.8475 3.12591 11.9371 3.23636 11.9371L5.75498 11.9371C6.1396 11.9371 6.45141 12.0611 6.45141 12.4611V12.7982Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, CommentSingle = forwardRef(function(props, ref) {
+  return createElement(IconBase, Object.assign({}, props, {
     id: "comment-single",
-    ref: t,
-    icon: bt
+    ref,
+    icon: element
   }));
 });
-Me.displayName = "CommentSingle";
-const xt = {
-  [Ye.OTHERS]: {
-    [ee.id]: {
+CommentSingle.displayName = "CommentSingle";
+const menuSchema = {
+  [RibbonStartGroup.OTHERS]: {
+    [ToggleCommentPanelOperation.id]: {
       order: 1,
-      menuItemFactory: _t
+      menuItemFactory: ToolbarDocCommentMenuItemFactory
     }
   },
-  [Qe.MAIN_AREA]: {
-    [Xe.DATA]: {
-      [q.id]: {
+  [ContextMenuPosition.MAIN_AREA]: {
+    [ContextMenuGroup.DATA]: {
+      [StartAddCommentOperation.id]: {
         order: 1,
-        menuItemFactory: Ct
+        menuItemFactory: AddDocCommentMenuItemFactory
       }
     }
   }
 };
-var Dt = Object.defineProperty, Rt = Object.getOwnPropertyDescriptor, yt = (e, t, r, n) => {
-  for (var i = n > 1 ? void 0 : n ? Rt(t, r) : t, o = e.length - 1, s; o >= 0; o--)
-    (s = e[o]) && (i = (n ? s(t, r, i) : s(i)) || i);
-  return n && i && Dt(t, r, i), i;
-}, Y = (e, t) => (r, n) => t(r, n, e);
-let V = class extends B {
-  constructor(e, t, r) {
-    super(), this._commandService = e, this._menuManagerService = t, this._componentManager = r, this._initCommands(), this._initMenus(), this._initComponents();
+var __defProp$2 = Object.defineProperty, __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor, __decorateClass$2 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+    (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
+  return kind && result && __defProp$2(target, key, result), result;
+}, "__decorateClass$2"), __decorateParam$2 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$2"), _a3;
+let DocThreadCommentUIController = (_a3 = class extends Disposable {
+  constructor(_commandService, _menuManagerService, _componentManager) {
+    super(), this._commandService = _commandService, this._menuManagerService = _menuManagerService, this._componentManager = _componentManager, this._initCommands(), this._initMenus(), this._initComponents();
   }
   _initCommands() {
     [
-      ve,
-      ge,
-      A,
-      q,
-      ee
-    ].forEach((e) => {
-      this.disposeWithMe(this._commandService.registerCommand(e));
+      AddDocCommentComment,
+      DeleteDocCommentComment,
+      ShowCommentPanelOperation,
+      StartAddCommentOperation,
+      ToggleCommentPanelOperation
+    ].forEach((command) => {
+      this.disposeWithMe(this._commandService.registerCommand(command));
     });
   }
   _initMenus() {
-    this._menuManagerService.mergeMenu(xt);
+    this._menuManagerService.mergeMenu(menuSchema);
   }
   _initComponents() {
-    [y].forEach((e) => {
-      this.disposeWithMe(this._componentManager.register(e.componentKey, e));
-    }), this.disposeWithMe(this._componentManager.register("CommentSingle", Me));
+    [DocThreadCommentPanel].forEach((comp) => {
+      this.disposeWithMe(this._componentManager.register(comp.componentKey, comp));
+    }), this.disposeWithMe(this._componentManager.register("CommentSingle", CommentSingle));
   }
-};
-V = yt([
-  Y(0, M),
-  Y(1, et),
-  Y(2, v(ke))
-], V);
-var Tt = Object.defineProperty, Ut = Object.getOwnPropertyDescriptor, Pt = (e, t, r, n) => {
-  for (var i = n > 1 ? void 0 : n ? Ut(t, r) : t, o = e.length - 1, s; o >= 0; o--)
-    (s = e[o]) && (i = (n ? s(t, r, i) : s(i)) || i);
-  return n && i && Tt(t, r, i), i;
-}, D = (e, t) => (r, n) => t(r, n, e);
-let k = class extends B {
-  constructor(e, t, r, n, i, o, s) {
-    super(), this._context = e, this._docInterceptorService = t, this._threadCommentPanelService = r, this._docRenderController = n, this._univerInstanceService = i, this._threadCommentModel = o, this._commandService = s, this._interceptorViewModel(), this._initReRender(), this._initSyncComments();
+}, __name(_a3, "DocThreadCommentUIController"), _a3);
+DocThreadCommentUIController = __decorateClass$2([
+  __decorateParam$2(0, ICommandService),
+  __decorateParam$2(1, IMenuManagerService),
+  __decorateParam$2(2, Inject(ComponentManager))
+], DocThreadCommentUIController);
+var __defProp$1 = Object.defineProperty, __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor, __decorateClass$1 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$1(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+    (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
+  return kind && result && __defProp$1(target, key, result), result;
+}, "__decorateClass$1"), __decorateParam$1 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$1"), _a4;
+let DocThreadCommentRenderController = (_a4 = class extends Disposable {
+  constructor(_context, _docInterceptorService, _threadCommentPanelService, _docRenderController, _univerInstanceService, _threadCommentModel, _commandService) {
+    super(), this._context = _context, this._docInterceptorService = _docInterceptorService, this._threadCommentPanelService = _threadCommentPanelService, this._docRenderController = _docRenderController, this._univerInstanceService = _univerInstanceService, this._threadCommentModel = _threadCommentModel, this._commandService = _commandService, this._interceptorViewModel(), this._initReRender(), this._initSyncComments();
   }
   _initReRender() {
-    this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe((e) => {
-      var r;
-      if (e) {
-        this._docRenderController.reRender(e.unitId);
+    this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe((activeComment) => {
+      var _a6;
+      if (activeComment) {
+        this._docRenderController.reRender(activeComment.unitId);
         return;
       }
-      const t = (r = this._univerInstanceService.getCurrentUnitForType(S.UNIVER_DOC)) == null ? void 0 : r.getUnitId();
-      t && this._docRenderController.reRender(t);
-    })), this.disposeWithMe(this._threadCommentModel.commentUpdate$.subscribe((e) => {
-      e.type === "resolve" && this._docRenderController.reRender(e.unitId);
+      const unitId = (_a6 = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC)) == null ? void 0 : _a6.getUnitId();
+      unitId && this._docRenderController.reRender(unitId);
+    })), this.disposeWithMe(this._threadCommentModel.commentUpdate$.subscribe((update) => {
+      update.type === "resolve" && this._docRenderController.reRender(update.unitId);
     }));
   }
   _interceptorViewModel() {
-    this._docInterceptorService.intercept(Le.CUSTOM_DECORATION, {
-      handler: (e, t, r) => {
-        if (!e)
-          return r(e);
-        const { unitId: n, index: i, customDecorations: o } = t, s = this._threadCommentPanelService.activeCommentId, { commentId: d, unitId: a } = s || {}, u = o.find((_) => _.id === d), c = this._threadCommentModel.getComment(n, I, e.id);
-        if (!c)
-          return r({
-            ...e,
+    this._docInterceptorService.intercept(DOC_INTERCEPTOR_POINT.CUSTOM_DECORATION, {
+      handler: /* @__PURE__ */ __name((data, pos, next) => {
+        if (!data)
+          return next(data);
+        const { unitId, index, customDecorations } = pos, activeComment = this._threadCommentPanelService.activeCommentId, { commentId, unitId: commentUnitID } = activeComment || {}, activeCustomDecoration = customDecorations.find((i) => i.id === commentId), comment = this._threadCommentModel.getComment(unitId, DEFAULT_DOC_SUBUNIT_ID, data.id);
+        if (!comment)
+          return next({
+            ...data,
             show: !1
           });
-        const f = u && i >= u.startIndex && i <= u.endIndex, C = a === n && e.id === d;
-        return r({
-          ...e,
-          active: C || f,
-          show: !c.resolved
+        const isActiveIndex = activeCustomDecoration && index >= activeCustomDecoration.startIndex && index <= activeCustomDecoration.endIndex, isActive = commentUnitID === unitId && data.id === commentId;
+        return next({
+          ...data,
+          active: isActive || isActiveIndex,
+          show: !comment.resolved
         });
-      }
+      }, "handler")
     });
   }
   _initSyncComments() {
-    var i, o, s;
-    const e = this._context.unit.getUnitId(), t = I, r = (s = (o = (i = this._context.unit.getBody()) == null ? void 0 : i.customDecorations) == null ? void 0 : o.filter((d) => d.type === X.COMMENT).map((d) => d.id)) != null ? s : [];
-    r.forEach((d) => {
-      this._threadCommentModel.getComment(e, t, d) || this._threadCommentModel.addComment(e, t, { id: d, threadId: d, ref: "", dT: "", personId: "", text: { dataStream: "" }, unitId: e, subUnitId: t });
-    }), r.length && this._threadCommentModel.syncThreadComments(this._context.unit.getUnitId(), I, r);
-    let n = r.sort();
-    this.disposeWithMe(this._commandService.onCommandExecuted((d) => {
-      var a, u, c;
-      if (d.id === me.id) {
-        if (d.params.unitId !== this._context.unit.getUnitId())
+    var _a6, _b, _c;
+    const unitId = this._context.unit.getUnitId(), subUnitId = DEFAULT_DOC_SUBUNIT_ID, threadIds = (_c = (_b = (_a6 = this._context.unit.getBody()) == null ? void 0 : _a6.customDecorations) == null ? void 0 : _b.filter((i) => i.type === CustomDecorationType.COMMENT).map((i) => i.id)) != null ? _c : [];
+    threadIds.forEach((id) => {
+      this._threadCommentModel.getComment(unitId, subUnitId, id) || this._threadCommentModel.addComment(unitId, subUnitId, { id, threadId: id, ref: "", dT: "", personId: "", text: { dataStream: "" }, unitId, subUnitId });
+    }), threadIds.length && this._threadCommentModel.syncThreadComments(this._context.unit.getUnitId(), DEFAULT_DOC_SUBUNIT_ID, threadIds);
+    let prevThreadIds = threadIds.sort();
+    this.disposeWithMe(this._commandService.onCommandExecuted((commandInfo) => {
+      var _a7, _b2, _c2;
+      if (commandInfo.id === RichTextEditingMutation.id) {
+        if (commandInfo.params.unitId !== this._context.unit.getUnitId())
           return;
-        const C = (c = (u = (a = this._context.unit.getBody()) == null ? void 0 : a.customDecorations) == null ? void 0 : u.filter((m) => m.type === X.COMMENT).map((m) => m.id)) != null ? c : [], _ = C.sort();
-        if (JSON.stringify(n) !== JSON.stringify(_)) {
-          const m = new Set(n), l = new Set(_), g = /* @__PURE__ */ new Set(), b = /* @__PURE__ */ new Set();
-          C.forEach((h) => {
-            m.has(h) || g.add(h);
-          }), n.forEach((h) => {
-            l.has(h) || b.add(h);
-          }), n = _, g.forEach((h) => {
-            this._threadCommentModel.getComment(e, t, h) || this._threadCommentModel.addComment(e, t, { id: h, threadId: h, ref: "", dT: "", personId: "", text: { dataStream: "" }, unitId: e, subUnitId: t });
-          }), this._threadCommentModel.syncThreadComments(e, t, [...g]);
+        const currentThreadIds = (_c2 = (_b2 = (_a7 = this._context.unit.getBody()) == null ? void 0 : _a7.customDecorations) == null ? void 0 : _b2.filter((i) => i.type === CustomDecorationType.COMMENT).map((i) => i.id)) != null ? _c2 : [], currentThreadIdsSorted = currentThreadIds.sort();
+        if (JSON.stringify(prevThreadIds) !== JSON.stringify(currentThreadIdsSorted)) {
+          const preIds = new Set(prevThreadIds), currentIds = new Set(currentThreadIdsSorted), addIds = /* @__PURE__ */ new Set(), deleteIds = /* @__PURE__ */ new Set();
+          currentThreadIds.forEach((id) => {
+            preIds.has(id) || addIds.add(id);
+          }), prevThreadIds.forEach((id) => {
+            currentIds.has(id) || deleteIds.add(id);
+          }), prevThreadIds = currentThreadIdsSorted, addIds.forEach((id) => {
+            this._threadCommentModel.getComment(unitId, subUnitId, id) || this._threadCommentModel.addComment(unitId, subUnitId, { id, threadId: id, ref: "", dT: "", personId: "", text: { dataStream: "" }, unitId, subUnitId });
+          }), this._threadCommentModel.syncThreadComments(unitId, subUnitId, [...addIds]);
         }
       }
     }));
   }
-};
-k = Pt([
-  D(1, v(Fe)),
-  D(2, v(T)),
-  D(3, v(Ke)),
-  D(4, F),
-  D(5, v(le)),
-  D(6, M)
-], k);
-var be = Object.defineProperty, Et = Object.getOwnPropertyDescriptor, wt = (e, t, r) => t in e ? be(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, Nt = (e, t, r, n) => {
-  for (var i = n > 1 ? void 0 : n ? Et(t, r) : t, o = e.length - 1, s; o >= 0; o--)
-    (s = e[o]) && (i = (n ? s(t, r, i) : s(i)) || i);
-  return n && i && be(t, r, i), i;
-}, Q = (e, t) => (r, n) => t(r, n, e), xe = (e, t, r) => wt(e, typeof t != "symbol" ? t + "" : t, r);
-let j = class extends we {
-  constructor(e = ne, t, r, n) {
-    super(), this._config = e, this._injector = t, this._renderManagerSrv = r, this._configService = n;
-    const { menu: i, ...o } = Ne(
+}, __name(_a4, "DocThreadCommentRenderController"), _a4);
+DocThreadCommentRenderController = __decorateClass$1([
+  __decorateParam$1(1, Inject(DocInterceptorService)),
+  __decorateParam$1(2, Inject(ThreadCommentPanelService)),
+  __decorateParam$1(3, Inject(DocRenderController)),
+  __decorateParam$1(4, IUniverInstanceService),
+  __decorateParam$1(5, Inject(ThreadCommentModel)),
+  __decorateParam$1(6, ICommandService)
+], DocThreadCommentRenderController);
+var __defProp2 = Object.defineProperty, __getOwnPropDesc = Object.getOwnPropertyDescriptor, __defNormalProp2 = /* @__PURE__ */ __name((obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, "__defNormalProp"), __decorateClass = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+    (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
+  return kind && result && __defProp2(target, key, result), result;
+}, "__decorateClass"), __decorateParam = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam"), __publicField2 = /* @__PURE__ */ __name((obj, key, value) => __defNormalProp2(obj, typeof key != "symbol" ? key + "" : key, value), "__publicField"), _a5;
+let UniverDocsThreadCommentUIPlugin = (_a5 = class extends Plugin {
+  constructor(_config = defaultPluginConfig, _injector, _renderManagerSrv, _configService) {
+    super(), this._config = _config, this._injector = _injector, this._renderManagerSrv = _renderManagerSrv, this._configService = _configService;
+    const { menu, ...rest } = merge(
       {},
-      ne,
+      defaultPluginConfig,
       this._config
     );
-    i && this._configService.setConfig("menu", i, { merge: !0 }), this._configService.setConfig(ct, o);
+    menu && this._configService.setConfig("menu", menu, { merge: !0 }), this._configService.setConfig(DOCS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY, rest);
   }
   onStarting() {
     [
-      [V],
-      [$],
-      [R]
-    ].forEach((e) => {
-      this._injector.add(e);
+      [DocThreadCommentUIController],
+      [DocThreadCommentSelectionController],
+      [DocThreadCommentService]
+    ].forEach((dep) => {
+      this._injector.add(dep);
     });
   }
   onRendered() {
-    this._initRenderModule(), this._injector.get($), this._injector.get(V);
+    this._initRenderModule(), this._injector.get(DocThreadCommentSelectionController), this._injector.get(DocThreadCommentUIController);
   }
   _initRenderModule() {
-    [k].forEach((e) => {
-      this._renderManagerSrv.registerRenderModule(S.UNIVER_DOC, e);
+    [DocThreadCommentRenderController].forEach((dep) => {
+      this._renderManagerSrv.registerRenderModule(UniverInstanceType.UNIVER_DOC, dep);
     });
   }
-};
-xe(j, "pluginName", dt);
-xe(j, "type", S.UNIVER_DOC);
-j = Nt([
-  Ee(Ve),
-  Q(1, v(de)),
-  Q(2, L),
-  Q(3, Ae)
-], j);
+}, __name(_a5, "UniverDocsThreadCommentUIPlugin"), _a5);
+__publicField2(UniverDocsThreadCommentUIPlugin, "pluginName", PLUGIN_NAME);
+__publicField2(UniverDocsThreadCommentUIPlugin, "type", UniverInstanceType.UNIVER_DOC);
+UniverDocsThreadCommentUIPlugin = __decorateClass([
+  DependentOn(UniverThreadCommentUIPlugin),
+  __decorateParam(1, Inject(Injector)),
+  __decorateParam(2, IRenderManagerService),
+  __decorateParam(3, IConfigService)
+], UniverDocsThreadCommentUIPlugin);
 export {
-  ve as AddDocCommentComment,
-  ge as DeleteDocCommentComment,
-  A as ShowCommentPanelOperation,
-  q as StartAddCommentOperation,
-  j as UniverDocsThreadCommentUIPlugin
+  AddDocCommentComment,
+  DeleteDocCommentComment,
+  ShowCommentPanelOperation,
+  StartAddCommentOperation,
+  UniverDocsThreadCommentUIPlugin
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@univerjs/docs-thread-comment-ui",
-  "version": "0.5.5-nightly.202501210604",
+  "version": "0.5.5-nightly.202501210849",
   "private": false,
   "description": "Univer thread comment plugin",
   "author": "DreamNum <developer@univer.ai>",
@@ -49,13 +49,13 @@
   "dependencies": {
     "@univerjs/icons": "^0.2.12",
     "clsx": "^2.1.1",
-    "@univerjs/core": "0.5.5-nightly.202501210604",
-    "@univerjs/docs": "0.5.5-nightly.202501210604",
-    "@univerjs/thread-comment": "0.5.5-nightly.202501210604",
-    "@univerjs/docs-ui": "0.5.5-nightly.202501210604",
-    "@univerjs/engine-render": "0.5.5-nightly.202501210604",
-    "@univerjs/thread-comment-ui": "0.5.5-nightly.202501210604",
-    "@univerjs/ui": "0.5.5-nightly.202501210604"
+    "@univerjs/core": "0.5.5-nightly.202501210849",
+    "@univerjs/docs": "0.5.5-nightly.202501210849",
+    "@univerjs/docs-ui": "0.5.5-nightly.202501210849",
+    "@univerjs/engine-render": "0.5.5-nightly.202501210849",
+    "@univerjs/thread-comment": "0.5.5-nightly.202501210849",
+    "@univerjs/ui": "0.5.5-nightly.202501210849",
+    "@univerjs/thread-comment-ui": "0.5.5-nightly.202501210849"
   },
   "devDependencies": {
     "postcss": "^8.4.49",