@univerjs/thread-comment-ui 0.6.1 → 0.6.2

package/lib/es/index.js

@@ -1,21 +1,21 @@
-var Be = Object.defineProperty;
-var We = (t, e, r) => e in t ? Be(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r;
-var B = (t, e, r) => We(t, typeof e != "symbol" ? e + "" : e, r);
-import { Inject as Ne, IUniverInstanceService as Fe, Disposable as ze, UniverInstanceType as he, CommandType as Ue, DependentOn as Ze, Injector as Ke, ICommandService as oe, IConfigService as Ge, Plugin as Ye, merge as qe, mergeOverrideWithDependencies as Je, LocaleService as fe, DOCS_NORMAL_EDITOR_UNIT_ID_KEY as Qe, BuildTextUtils as Ce, Tools as Xe, CustomRangeType as et, getBodySlice as tt, UserManagerService as pe, generateRandomId as nt } from "@univerjs/core";
-import { UniverThreadCommentPlugin as rt, ThreadCommentModel as Ee, getDT as ot, AddCommentCommand as it, ResolveCommentCommand as at, DeleteCommentTreeCommand as Oe, UpdateCommentCommand as st, DeleteCommentCommand as lt } from "@univerjs/thread-comment";
-import { ISidebarService as Pe, useDependency as T, KeyCode as ge, useObservable as W } from "@univerjs/ui";
-import { BehaviorSubject as Ie, filter as dt, debounceTime as ct } from "rxjs";
+var je = Object.defineProperty;
+var Ae = (t, e, n) => e in t ? je(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var B = (t, e, n) => Ae(t, typeof e != "symbol" ? e + "" : e, n);
+import { Inject as Te, IUniverInstanceService as Be, Disposable as We, UniverInstanceType as he, CommandType as Ne, DependentOn as Fe, Injector as ze, ICommandService as ie, IConfigService as Ze, Plugin as Ke, merge as Ge, mergeOverrideWithDependencies as Ye, LocaleService as fe, DOCS_NORMAL_EDITOR_UNIT_ID_KEY as qe, BuildTextUtils as Ce, Tools as Je, CustomRangeType as Qe, getBodySlice as Xe, UserManagerService as pe, generateRandomId as et } from "@univerjs/core";
+import { UniverThreadCommentPlugin as tt, ThreadCommentModel as Ue, getDT as nt, AddCommentCommand as rt, ResolveCommentCommand as it, DeleteCommentTreeCommand as Ee, UpdateCommentCommand as ot, DeleteCommentCommand as at } from "@univerjs/thread-comment";
+import { ISidebarService as Oe, useDependency as T, KeyCode as ge, useObservable as W } from "@univerjs/ui";
+import { BehaviorSubject as Ie, filter as st, debounceTime as lt } from "rxjs";
 import { jsxs as S, jsx as l } from "react/jsx-runtime";
-import { Button as ce, Tooltip as mt, DropdownLegacy as ut, Menu as ht, MenuItem as be, Select as Se } from "@univerjs/design";
-import { forwardRef as j, useRef as re, createElement as z, useState as V, useEffect as me, useMemo as ne, useImperativeHandle as Ct } from "react";
-import { IEditorService as vt, BreakLineCommand as ft, RichTextEditor as pt } from "@univerjs/docs-ui";
-var gt = Object.getOwnPropertyDescriptor, It = (t, e, r, n) => {
-  for (var o = n > 1 ? void 0 : n ? gt(e, r) : e, a = t.length - 1, d; a >= 0; a--)
-    (d = t[a]) && (o = d(o) || o);
-  return o;
-}, ye = (t, e) => (r, n) => e(r, n, t);
-let Y = class extends ze {
-  constructor(e, r) {
+import { Button as ce, clsx as dt, Tooltip as ct, Dropdown as mt, Select as be } from "@univerjs/design";
+import { forwardRef as j, useRef as re, createElement as z, useState as V, useEffect as me, useMemo as ne, useImperativeHandle as ut } from "react";
+import { IEditorService as ht, BreakLineCommand as Ct, RichTextEditor as vt } from "@univerjs/docs-ui";
+var ft = Object.getOwnPropertyDescriptor, pt = (t, e, n, r) => {
+  for (var i = r > 1 ? void 0 : r ? ft(e, n) : e, a = t.length - 1, d; a >= 0; a--)
+    (d = t[a]) && (i = d(i) || i);
+  return i;
+}, Se = (t, e) => (n, r) => e(n, r, t);
+let Y = class extends We {
+  constructor(e, n) {
     super();
     B(this, "_panelVisible", !1);
     B(this, "_panelVisible$", new Ie(!1));
@@ -23,7 +23,7 @@ let Y = class extends ze {
     B(this, "_activeCommentId$", new Ie(void 0));
     B(this, "panelVisible$", this._panelVisible$.asObservable());
     B(this, "activeCommentId$", this._activeCommentId$.asObservable());
-    this._sidebarService = e, this._univerInstanceService = r, this._init(), this.disposeWithMe(() => {
+    this._sidebarService = e, this._univerInstanceService = n, this._init(), this.disposeWithMe(() => {
       this._activeCommentId$.complete(), this._panelVisible$.complete();
     });
   }
@@ -33,7 +33,7 @@ let Y = class extends ze {
         e.visible || this.setPanelVisible(!1);
       })
     ), this.disposeWithMe(
-      this._univerInstanceService.getCurrentTypeOfUnit$(he.UNIVER_SHEET).pipe(dt((e) => !e)).subscribe(() => {
+      this._univerInstanceService.getCurrentTypeOfUnit$(he.UNIVER_SHEET).pipe(st((e) => !e)).subscribe(() => {
         this._sidebarService.close();
       })
     );
@@ -51,182 +51,169 @@ let Y = class extends ze {
     this._activeCommentId = e, this._activeCommentId$.next(e);
   }
 };
-Y = It([
-  ye(0, Ne(Pe)),
-  ye(1, Fe)
+Y = pt([
+  Se(0, Te(Oe)),
+  Se(1, Be)
 ], Y);
-const bt = "thread-comment-panel", St = "UNIVER_THREAD_COMMENT_UI_PLUGIN", yt = {
+const gt = "thread-comment-panel", It = "UNIVER_THREAD_COMMENT_UI_PLUGIN", bt = {
   id: "thread-comment-ui.operation.toggle-panel",
-  type: Ue.OPERATION,
+  type: Ne.OPERATION,
   handler(t) {
-    const e = t.get(Pe), r = t.get(Y);
-    return r.panelVisible ? (e.close(), r.setPanelVisible(!1)) : (e.open({
+    const e = t.get(Oe), n = t.get(Y);
+    return n.panelVisible ? (e.close(), n.setPanelVisible(!1)) : (e.open({
       header: { title: "threadCommentUI.panel.title" },
-      children: { label: bt },
+      children: { label: gt },
       width: 330
-    }), r.setPanelVisible(!0)), !0;
+    }), n.setPanelVisible(!0)), !0;
   }
 }, F = {
   id: "thread-comment-ui.operation.set-active-comment",
-  type: Ue.OPERATION,
+  type: Ne.OPERATION,
   handler(t, e) {
     return t.get(Y).setActiveComment(e), !0;
   }
-}, _t = "thread-comment-ui.config", _e = {};
-var xt = Object.defineProperty, Tt = Object.getOwnPropertyDescriptor, Nt = (t, e, r) => e in t ? xt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, Ut = (t, e, r, n) => {
-  for (var o = n > 1 ? void 0 : n ? Tt(e, r) : e, a = t.length - 1, d; a >= 0; a--)
-    (d = t[a]) && (o = d(o) || o);
-  return o;
-}, ve = (t, e) => (r, n) => e(r, n, t), Me = (t, e, r) => Nt(t, typeof e != "symbol" ? e + "" : e, r);
-let ue = class extends Ye {
-  constructor(t = _e, e, r, n) {
-    super(), this._config = t, this._injector = e, this._commandService = r, this._configService = n;
-    const { menu: o, ...a } = qe(
+}, St = "thread-comment-ui.config", ye = {};
+var yt = Object.defineProperty, _t = Object.getOwnPropertyDescriptor, xt = (t, e, n) => e in t ? yt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, Tt = (t, e, n, r) => {
+  for (var i = r > 1 ? void 0 : r ? _t(e, n) : e, a = t.length - 1, d; a >= 0; a--)
+    (d = t[a]) && (i = d(i) || i);
+  return i;
+}, ve = (t, e) => (n, r) => e(n, r, t), Pe = (t, e, n) => xt(t, typeof e != "symbol" ? e + "" : e, n);
+let ue = class extends Ke {
+  constructor(t = ye, e, n, r) {
+    super(), this._config = t, this._injector = e, this._commandService = n, this._configService = r;
+    const { menu: i, ...a } = Ge(
       {},
-      _e,
+      ye,
       this._config
     );
-    o && this._configService.setConfig("menu", o, { merge: !0 }), this._configService.setConfig(_t, a);
+    i && this._configService.setConfig("menu", i, { merge: !0 }), this._configService.setConfig(St, a);
   }
   onStarting() {
     var t;
-    Je([
+    Ye([
       [Y]
     ], (t = this._config) == null ? void 0 : t.overrides).forEach((e) => {
       this._injector.add(e);
-    }), [yt, F].forEach((e) => {
+    }), [bt, F].forEach((e) => {
       this._commandService.registerCommand(e);
     });
   }
 };
-Me(ue, "pluginName", St);
-Me(ue, "type", he.UNIVER_UNKNOWN);
-ue = Ut([
-  Ze(rt),
-  ve(1, Ne(Ke)),
-  ve(2, oe),
-  ve(3, Ge)
+Pe(ue, "pluginName", It);
+Pe(ue, "type", he.UNIVER_UNKNOWN);
+ue = Tt([
+  Fe(tt),
+  ve(1, Te(ze)),
+  ve(2, ie),
+  ve(3, Ze)
 ], ue);
-var D = function() {
-  return D = Object.assign || function(t) {
-    for (var e, r = 1, n = arguments.length; r < n; r++) {
-      e = arguments[r];
-      for (var o in e) Object.prototype.hasOwnProperty.call(e, o) && (t[o] = e[o]);
+var H = function() {
+  return H = Object.assign || function(t) {
+    for (var e, n = 1, r = arguments.length; n < r; n++) {
+      e = arguments[n];
+      for (var i in e) Object.prototype.hasOwnProperty.call(e, i) && (t[i] = e[i]);
     }
     return t;
-  }, D.apply(this, arguments);
-}, Et = function(t, e) {
-  var r = {};
-  for (var n in t) Object.prototype.hasOwnProperty.call(t, n) && e.indexOf(n) < 0 && (r[n] = t[n]);
+  }, H.apply(this, arguments);
+}, Nt = function(t, e) {
+  var n = {};
+  for (var r in t) Object.prototype.hasOwnProperty.call(t, r) && e.indexOf(r) < 0 && (n[r] = t[r]);
   if (t != null && typeof Object.getOwnPropertySymbols == "function")
-    for (var o = 0, n = Object.getOwnPropertySymbols(t); o < n.length; o++)
-      e.indexOf(n[o]) < 0 && Object.prototype.propertyIsEnumerable.call(t, n[o]) && (r[n[o]] = t[n[o]]);
-  return r;
+    for (var i = 0, r = Object.getOwnPropertySymbols(t); i < r.length; i++)
+      e.indexOf(r[i]) < 0 && Object.prototype.propertyIsEnumerable.call(t, r[i]) && (n[r[i]] = t[r[i]]);
+  return n;
 }, Z = j(function(t, e) {
-  var r = t.icon, n = t.id, o = t.className, a = t.extend, d = Et(t, ["icon", "id", "className", "extend"]), C = "univerjs-icon univerjs-icon-".concat(n, " ").concat(o || "").trim(), g = re("_".concat(Mt()));
-  return $e(r, "".concat(n), { defIds: r.defIds, idSuffix: g.current }, D({ ref: e, className: C }, d), a);
+  var n = t.icon, r = t.id, i = t.className, a = t.extend, d = Nt(t, ["icon", "id", "className", "extend"]), C = "univerjs-icon univerjs-icon-".concat(r, " ").concat(i || "").trim(), g = re("_".concat(Ot()));
+  return $e(n, "".concat(r), { defIds: n.defIds, idSuffix: g.current }, H({ ref: e, className: C }, d), a);
 });
-function $e(t, e, r, n, o) {
-  return z(t.tag, D(D({ key: e }, Ot(t, r, o)), n), (Pt(t, r).children || []).map(function(a, d) {
-    return $e(a, "".concat(e, "-").concat(t.tag, "-").concat(d), r, void 0, o);
+function $e(t, e, n, r, i) {
+  return z(t.tag, H(H({ key: e }, Ut(t, n, i)), r), (Et(t, n).children || []).map(function(a, d) {
+    return $e(a, "".concat(e, "-").concat(t.tag, "-").concat(d), n, void 0, i);
   }));
 }
-function Ot(t, e, r) {
-  var n = D({}, t.attrs);
-  r != null && r.colorChannel1 && n.fill === "colorChannel1" && (n.fill = r.colorChannel1), t.tag === "mask" && n.id && (n.id = n.id + e.idSuffix), Object.entries(n).forEach(function(a) {
+function Ut(t, e, n) {
+  var r = H({}, t.attrs);
+  n != null && n.colorChannel1 && r.fill === "colorChannel1" && (r.fill = n.colorChannel1), t.tag === "mask" && r.id && (r.id = r.id + e.idSuffix), Object.entries(r).forEach(function(a) {
     var d = a[0], C = a[1];
-    d === "mask" && typeof C == "string" && (n[d] = C.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+    d === "mask" && typeof C == "string" && (r[d] = C.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
   });
-  var o = e.defIds;
-  return !o || o.length === 0 || (t.tag === "use" && n["xlink:href"] && (n["xlink:href"] = n["xlink:href"] + e.idSuffix), Object.entries(n).forEach(function(a) {
+  var i = e.defIds;
+  return !i || i.length === 0 || (t.tag === "use" && r["xlink:href"] && (r["xlink:href"] = r["xlink:href"] + e.idSuffix), Object.entries(r).forEach(function(a) {
     var d = a[0], C = a[1];
-    typeof C == "string" && (n[d] = C.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
-  })), n;
+    typeof C == "string" && (r[d] = C.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+  })), r;
 }
-function Pt(t, e) {
-  var r, n = e.defIds;
-  return !n || n.length === 0 ? t : t.tag === "defs" && (!((r = t.children) === null || r === void 0) && r.length) ? D(D({}, t), { children: t.children.map(function(o) {
-    return typeof o.attrs.id == "string" && n && n.indexOf(o.attrs.id) > -1 ? D(D({}, o), { attrs: D(D({}, o.attrs), { id: o.attrs.id + e.idSuffix }) }) : o;
+function Et(t, e) {
+  var n, r = e.defIds;
+  return !r || r.length === 0 ? t : t.tag === "defs" && (!((n = t.children) === null || n === void 0) && n.length) ? H(H({}, t), { children: t.children.map(function(i) {
+    return typeof i.attrs.id == "string" && r && r.indexOf(i.attrs.id) > -1 ? H(H({}, i), { attrs: H(H({}, i.attrs), { id: i.attrs.id + e.idSuffix }) }) : i;
   }) }) : t;
 }
-function Mt() {
+function Ot() {
   return Math.random().toString(36).substring(2, 8);
 }
 Z.displayName = "UniverIcon";
-var $t = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M5.3313 1.4667C5.3313 1.13533 5.59993.866699 5.9313.866699H10.069C10.4004.866699 10.669 1.13533 10.669 1.4667 10.669 1.79807 10.4004 2.0667 10.069 2.0667H5.9313C5.59993 2.0667 5.3313 1.79807 5.3313 1.4667zM1.09985 3.64443C1.09985 3.31306 1.36848 3.04443 1.69985 3.04443H14.2999C14.6312 3.04443 14.8999 3.31306 14.8999 3.64443 14.8999 3.9758 14.6312 4.24443 14.2999 4.24443H1.69985C1.36848 4.24443 1.09985 3.9758 1.09985 3.64443zM6.12398 8.30171C6.35829 8.0674 6.73819 8.0674 6.97251 8.30171L8.00007 9.32928 9.02764 8.30171C9.26195 8.0674 9.64185 8.0674 9.87617 8.30171 10.1105 8.53603 10.1105 8.91593 9.87617 9.15024L8.8486 10.1778 9.87617 11.2054C10.1105 11.4397 10.1105 11.8196 9.87617 12.0539 9.64185 12.2882 9.26195 12.2882 9.02764 12.0539L8.00007 11.0263 6.97251 12.0539C6.73819 12.2882 6.35829 12.2882 6.12398 12.0539 5.88966 11.8196 5.88966 11.4397 6.12398 11.2054L7.15154 10.1778 6.12398 9.15024C5.88966 8.91593 5.88966 8.53603 6.12398 8.30171z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M4.75332 5.22217C3.86966 5.22217 3.15332 5.93851 3.15332 6.82217V12.5331C3.15332 13.9691 4.31738 15.1332 5.75332 15.1332H10.2465C11.6825 15.1332 12.8465 13.9691 12.8465 12.5331V6.82217C12.8465 5.93851 12.1302 5.22217 11.2465 5.22217H4.75332ZM4.35332 6.82217C4.35332 6.60125 4.53241 6.42217 4.75332 6.42217H11.2465C11.4674 6.42217 11.6465 6.60125 11.6465 6.82217V12.5331C11.6465 13.3063 11.0197 13.9332 10.2465 13.9332H5.75332C4.98012 13.9332 4.35332 13.3063 4.35332 12.5331V6.82217Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, De = j(function(t, e) {
+var Pt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M5.3313 1.4667C5.3313 1.13533 5.59993.866699 5.9313.866699H10.069C10.4004.866699 10.669 1.13533 10.669 1.4667 10.669 1.79807 10.4004 2.0667 10.069 2.0667H5.9313C5.59993 2.0667 5.3313 1.79807 5.3313 1.4667zM1.09985 3.64443C1.09985 3.31306 1.36848 3.04443 1.69985 3.04443H14.2999C14.6312 3.04443 14.8999 3.31306 14.8999 3.64443 14.8999 3.9758 14.6312 4.24443 14.2999 4.24443H1.69985C1.36848 4.24443 1.09985 3.9758 1.09985 3.64443zM6.12398 8.30171C6.35829 8.0674 6.73819 8.0674 6.97251 8.30171L8.00007 9.32928 9.02764 8.30171C9.26195 8.0674 9.64185 8.0674 9.87617 8.30171 10.1105 8.53603 10.1105 8.91593 9.87617 9.15024L8.8486 10.1778 9.87617 11.2054C10.1105 11.4397 10.1105 11.8196 9.87617 12.0539 9.64185 12.2882 9.26195 12.2882 9.02764 12.0539L8.00007 11.0263 6.97251 12.0539C6.73819 12.2882 6.35829 12.2882 6.12398 12.0539 5.88966 11.8196 5.88966 11.4397 6.12398 11.2054L7.15154 10.1778 6.12398 9.15024C5.88966 8.91593 5.88966 8.53603 6.12398 8.30171z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M4.75332 5.22217C3.86966 5.22217 3.15332 5.93851 3.15332 6.82217V12.5331C3.15332 13.9691 4.31738 15.1332 5.75332 15.1332H10.2465C11.6825 15.1332 12.8465 13.9691 12.8465 12.5331V6.82217C12.8465 5.93851 12.1302 5.22217 11.2465 5.22217H4.75332ZM4.35332 6.82217C4.35332 6.60125 4.53241 6.42217 4.75332 6.42217H11.2465C11.4674 6.42217 11.6465 6.60125 11.6465 6.82217V12.5331C11.6465 13.3063 11.0197 13.9332 10.2465 13.9332H5.75332C4.98012 13.9332 4.35332 13.3063 4.35332 12.5331V6.82217Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, De = j(function(t, e) {
   return z(Z, Object.assign({}, t, {
     id: "delete-single",
     ref: e,
-    icon: $t
+    icon: Pt
   }));
 });
 De.displayName = "DeleteSingle";
-var Dt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M8.6 1.99991C8.60001 1.66854 8.33138 1.39991 8.00001 1.3999C7.66864 1.3999 7.40001 1.66853 7.4 1.9999L7.39996 7.3999H1.9999C1.66853 7.3999 1.3999 7.66853 1.3999 7.9999C1.3999 8.33127 1.66853 8.5999 1.9999 8.5999H7.39995L7.3999 13.9999C7.3999 14.3313 7.66853 14.5999 7.9999 14.5999C8.33127 14.5999 8.5999 14.3313 8.5999 13.9999L8.59995 8.5999H13.9999C14.3313 8.5999 14.5999 8.33127 14.5999 7.9999C14.5999 7.66853 14.3313 7.3999 13.9999 7.3999H8.59996L8.6 1.99991Z" } }] }, He = j(function(t, e) {
+var $t = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M8.6 1.99991C8.60001 1.66854 8.33138 1.39991 8.00001 1.3999C7.66864 1.3999 7.40001 1.66853 7.4 1.9999L7.39996 7.3999H1.9999C1.66853 7.3999 1.3999 7.66853 1.3999 7.9999C1.3999 8.33127 1.66853 8.5999 1.9999 8.5999H7.39995L7.3999 13.9999C7.3999 14.3313 7.66853 14.5999 7.9999 14.5999C8.33127 14.5999 8.5999 14.3313 8.5999 13.9999L8.59995 8.5999H13.9999C14.3313 8.5999 14.5999 8.33127 14.5999 7.9999C14.5999 7.66853 14.3313 7.3999 13.9999 7.3999H8.59996L8.6 1.99991Z" } }] }, He = j(function(t, e) {
   return z(Z, Object.assign({}, t, {
     id: "increase-single",
     ref: e,
-    icon: Dt
+    icon: $t
   }));
 });
 He.displayName = "IncreaseSingle";
-var Ht = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M3 9C3.55228 9 4 8.55228 4 8 4 7.44772 3.55228 7 3 7 2.44772 7 2 7.44772 2 8 2 8.55228 2.44772 9 3 9zM8 9C8.55228 9 9 8.55228 9 8 9 7.44772 8.55228 7 8 7 7.44772 7 7 7.44772 7 8 7 8.55228 7.44772 9 8 9zM13 9C13.5523 9 14 8.55228 14 8 14 7.44772 13.5523 7 13 7 12.4477 7 12 7.44772 12 8 12 8.55228 12.4477 9 13 9z" } }] }, ke = j(function(t, e) {
+var Dt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M3 9C3.55228 9 4 8.55228 4 8 4 7.44772 3.55228 7 3 7 2.44772 7 2 7.44772 2 8 2 8.55228 2.44772 9 3 9zM8 9C8.55228 9 9 8.55228 9 8 9 7.44772 8.55228 7 8 7 7.44772 7 7 7.44772 7 8 7 8.55228 7.44772 9 8 9zM13 9C13.5523 9 14 8.55228 14 8 14 7.44772 13.5523 7 13 7 12.4477 7 12 7.44772 12 8 12 8.55228 12.4477 9 13 9z" } }] }, Me = j(function(t, e) {
   return z(Z, Object.assign({}, t, {
     id: "more-horizontal-single",
     ref: e,
-    icon: Ht
+    icon: Dt
   }));
 });
-ke.displayName = "MoreHorizontalSingle";
-var kt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { stroke: "currentColor", d: "M7.48389 10.3267V12.1905C7.48389 12.7428 7.9316 13.1905 8.48389 13.1905H11.2216L12.2955 14.2644L13.3695 13.1905H14.1593C14.7116 13.1905 15.1593 12.7428 15.1593 12.1905V8.46289C15.1593 7.91061 14.7116 7.46289 14.1593 7.46289H12.2955", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.2 } }, { tag: "path", attrs: { stroke: "currentColor", d: "M0.840332 3.73535C0.840332 2.63078 1.73576 1.73535 2.84033 1.73535H10.2955C11.4001 1.73535 12.2955 2.63078 12.2955 3.73535V8.32676C12.2955 9.43132 11.4001 10.3268 10.2955 10.3268H5.6014L4.1695 11.7587L3.05978 10.3268H2.84033C1.73576 10.3268 0.840332 9.43133 0.840332 8.32676V3.73535Z", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.2 } }, { tag: "path", attrs: { stroke: "currentColor", d: "M6.41016 6.1311H6.76813M8.91626 6.1311H9.27424M3.90454 6.1311H4.26252", strokeLinecap: "round", strokeWidth: 1.2 } }] }, Re = j(function(t, e) {
+Me.displayName = "MoreHorizontalSingle";
+var Ht = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { stroke: "currentColor", d: "M7.48389 10.3267V12.1905C7.48389 12.7428 7.9316 13.1905 8.48389 13.1905H11.2216L12.2955 14.2644L13.3695 13.1905H14.1593C14.7116 13.1905 15.1593 12.7428 15.1593 12.1905V8.46289C15.1593 7.91061 14.7116 7.46289 14.1593 7.46289H12.2955", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.2 } }, { tag: "path", attrs: { stroke: "currentColor", d: "M0.840332 3.73535C0.840332 2.63078 1.73576 1.73535 2.84033 1.73535H10.2955C11.4001 1.73535 12.2955 2.63078 12.2955 3.73535V8.32676C12.2955 9.43132 11.4001 10.3268 10.2955 10.3268H5.6014L4.1695 11.7587L3.05978 10.3268H2.84033C1.73576 10.3268 0.840332 9.43133 0.840332 8.32676V3.73535Z", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.2 } }, { tag: "path", attrs: { stroke: "currentColor", d: "M6.41016 6.1311H6.76813M8.91626 6.1311H9.27424M3.90454 6.1311H4.26252", strokeLinecap: "round", strokeWidth: 1.2 } }] }, ke = j(function(t, e) {
   return z(Z, Object.assign({}, t, {
     id: "reply-to-comment-single",
     ref: e,
-    icon: kt
+    icon: Ht
   }));
 });
-Re.displayName = "ReplyToCommentSingle";
-var Rt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 17 17", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M8.6106 15.4036C12.4766 15.4036 15.6106 12.2696 15.6106 8.40356C15.6106 4.53757 12.4766 1.40356 8.6106 1.40356C4.7446 1.40356 1.6106 4.53757 1.6106 8.40356C1.6106 12.2696 4.7446 15.4036 8.6106 15.4036ZM12.3351 6.82773C12.5694 6.59342 12.5694 6.21352 12.3351 5.9792C12.1007 5.74489 11.7208 5.74489 11.4865 5.9792L7.91079 9.55494L6.33506 7.9792C6.10074 7.74489 5.72084 7.74489 5.48653 7.9792C5.25221 8.21352 5.25221 8.59342 5.48653 8.82773L7.48653 10.8277C7.72084 11.062 8.10074 11.062 8.33506 10.8277L12.3351 6.82773Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, we = j(function(t, e) {
+ke.displayName = "ReplyToCommentSingle";
+var Mt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 17 17", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M8.6106 15.4036C12.4766 15.4036 15.6106 12.2696 15.6106 8.40356C15.6106 4.53757 12.4766 1.40356 8.6106 1.40356C4.7446 1.40356 1.6106 4.53757 1.6106 8.40356C1.6106 12.2696 4.7446 15.4036 8.6106 15.4036ZM12.3351 6.82773C12.5694 6.59342 12.5694 6.21352 12.3351 5.9792C12.1007 5.74489 11.7208 5.74489 11.4865 5.9792L7.91079 9.55494L6.33506 7.9792C6.10074 7.74489 5.72084 7.74489 5.48653 7.9792C5.25221 8.21352 5.25221 8.59342 5.48653 8.82773L7.48653 10.8277C7.72084 11.062 8.10074 11.062 8.33506 10.8277L12.3351 6.82773Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, Re = j(function(t, e) {
   return z(Z, Object.assign({}, t, {
     id: "resolved-single",
     ref: e,
-    icon: Rt
+    icon: Mt
   }));
 });
-we.displayName = "ResolvedSingle";
-var wt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 17 17", width: "1em", height: "1em" }, children: [{ tag: "circle", attrs: { cx: 8.73, cy: 8.4, r: 6.4, stroke: "currentColor", strokeWidth: 1.2 } }, { tag: "path", attrs: { stroke: "currentColor", d: "M6.02637 8.40356L8.02637 10.4036L12.0264 6.40356", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.2 } }] }, Le = j(function(t, e) {
+Re.displayName = "ResolvedSingle";
+var kt = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 17 17", width: "1em", height: "1em" }, children: [{ tag: "circle", attrs: { cx: 8.73, cy: 8.4, r: 6.4, stroke: "currentColor", strokeWidth: 1.2 } }, { tag: "path", attrs: { stroke: "currentColor", d: "M6.02637 8.40356L8.02637 10.4036L12.0264 6.40356", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.2 } }] }, we = j(function(t, e) {
   return z(Z, Object.assign({}, t, {
     id: "solve-single",
     ref: e,
-    icon: wt
+    icon: kt
   }));
 });
-Le.displayName = "SolveSingle";
-function Ve(t) {
-  var e, r, n = "";
-  if (typeof t == "string" || typeof t == "number") n += t;
-  else if (typeof t == "object") if (Array.isArray(t)) {
-    var o = t.length;
-    for (e = 0; e < o; e++) t[e] && (r = Ve(t[e])) && (n && (n += " "), n += r);
-  } else for (r in t) t[r] && (n && (n += " "), n += r);
-  return n;
-}
-function Lt() {
-  for (var t, e, r = 0, n = "", o = arguments.length; r < o; r++) (t = arguments[r]) && (e = Ve(t)) && (n && (n += " "), n += e);
-  return n;
-}
-const Vt = "univer-thread-comment-editor-buttons", xe = {
-  threadCommentEditorButtons: Vt
+we.displayName = "SolveSingle";
+const Rt = "univer-thread-comment-editor-buttons", _e = {
+  threadCommentEditorButtons: Rt
 };
-function Te(t) {
+function xe(t) {
   return {
     id: "d",
     body: t,
     documentStyle: {}
   };
 }
-const je = j((t, e) => {
+const Le = j((t, e) => {
   var R;
-  const { comment: r, onSave: n, id: o, onCancel: a, autoFocus: d, unitId: C, type: g } = t, N = T(oe), O = T(fe), [w, P] = V(!1), U = T(vt), m = re(null), f = g === he.UNIVER_SHEET ? Qe : C, [M, y] = V(() => {
+  const { comment: n, onSave: r, id: i, onCancel: a, autoFocus: d, unitId: C, type: g } = t, N = T(ie), O = T(fe), [w, P] = V(!1), U = T(ht), m = re(null), f = g === he.UNIVER_SHEET ? qe : C, [$, y] = V(() => {
     var c, u, p;
     return Ce.transform.getPlainText((p = (u = (c = m.current) == null ? void 0 : c.getDocumentData().body) == null ? void 0 : u.dataStream) != null ? p : "");
   });
@@ -239,25 +226,25 @@ const je = j((t, e) => {
     });
     return () => c == null ? void 0 : c.unsubscribe();
   }, [(R = m.current) == null ? void 0 : R.selectionChange$]);
-  const H = ne(() => ({
+  const M = ne(() => ({
     keyCodes: [{ keyCode: ge.ENTER }],
     handler: (c) => {
       c === ge.ENTER && N.executeCommand(
-        ft.id
+        Ct.id
       );
     }
   }), [N]);
-  Ct(e, () => ({
+  ut(e, () => ({
     reply(c) {
       var u, p;
-      (u = m.current) == null || u.focus(), (p = m.current) == null || p.setDocumentData(Te(c));
+      (u = m.current) == null || u.focus(), (p = m.current) == null || p.setDocumentData(xe(c));
     }
   }));
   const I = () => {
     if (m.current) {
-      const c = Xe.deepClone(m.current.getDocumentData().body);
-      P(!1), n == null || n({
-        ...r,
+      const c = Je.deepClone(m.current.getDocumentData().body);
+      P(!1), r == null || r({
+        ...n,
         text: c
       }), m.current.replaceText(""), setTimeout(() => {
         var u, p;
@@ -265,16 +252,16 @@ const je = j((t, e) => {
       }, 10);
     }
   };
-  return /* @__PURE__ */ S("div", { className: xe.threadCommentEditor, onClick: (c) => c.preventDefault(), children: [
+  return /* @__PURE__ */ S("div", { className: _e.threadCommentEditor, onClick: (c) => c.preventDefault(), children: [
     /* @__PURE__ */ l(
-      pt,
+      vt,
       {
-        ref: m,
+        editorRef: m,
         autoFocus: d,
         style: { width: "100%" },
-        keyboardEventConfig: H,
+        keyboardEventConfig: M,
         placeholder: O.t("threadCommentUI.editor.placeholder"),
-        initialValue: (r == null ? void 0 : r.text) && Te(r.text),
+        initialValue: (n == null ? void 0 : n.text) && xe(n.text),
         onFocusChange: (c) => c && P(c),
         isSingle: !1,
         maxHeight: 64,
@@ -285,7 +272,7 @@ const je = j((t, e) => {
         }
       }
     ),
-    w ? /* @__PURE__ */ S("div", { className: xe.threadCommentEditorButtons, children: [
+    w ? /* @__PURE__ */ S("div", { className: _e.threadCommentEditorButtons, children: [
       /* @__PURE__ */ l(
         ce,
         {
@@ -301,55 +288,55 @@ const je = j((t, e) => {
         ce,
         {
           type: "primary",
-          disabled: !M,
+          disabled: !$,
           onClick: I,
-          children: O.t(o ? "threadCommentUI.editor.save" : "threadCommentUI.editor.reply")
+          children: O.t(i ? "threadCommentUI.editor.save" : "threadCommentUI.editor.reply")
         }
       )
     ] }) : null
   ] });
-}), jt = (t) => {
-  const { dataStream: e, customRanges: r } = t, n = e.endsWith(`\r
-`) ? e.length - 2 : e.length, o = [];
+}), wt = (t) => {
+  const { dataStream: e, customRanges: n } = t, r = e.endsWith(`\r
+`) ? e.length - 2 : e.length, i = [];
   let a = 0;
-  return r == null || r.forEach((d) => {
-    a < d.startIndex && o.push({
+  return n == null || n.forEach((d) => {
+    a < d.startIndex && i.push({
       type: "text",
       content: e.slice(a, d.startIndex)
-    }), o.push({
+    }), i.push({
       type: "mention",
       content: {
         label: e.slice(d.startIndex, d.endIndex + 1),
         id: d.rangeId
       }
     }), a = d.endIndex + 1;
-  }), o.push({
+  }), i.push({
     type: "text",
-    content: e.slice(a, n)
-  }), o;
-}, At = (t) => {
+    content: e.slice(a, r)
+  }), i;
+}, Lt = (t) => {
   const { paragraphs: e = [] } = t;
-  let r = 0;
-  return e.map((n) => {
-    const o = tt(t, r, n.startIndex);
-    return r = n.startIndex + 1, jt(o);
+  let n = 0;
+  return e.map((r) => {
+    const i = Xe(t, n, r.startIndex);
+    return n = r.startIndex + 1, wt(i);
   });
-}, Bt = (t) => {
+}, Vt = (t) => {
   let e = "";
-  const r = [];
-  return t.forEach((n) => {
-    switch (n.type) {
+  const n = [];
+  return t.forEach((r) => {
+    switch (r.type) {
       case "text":
-        e += n.content;
+        e += r.content;
         break;
       case "mention": {
-        const o = e.length;
-        e += n.content.label;
+        const i = e.length;
+        e += r.content.label;
         const a = e.length - 1;
-        r.push({
-          rangeId: n.content.id,
-          rangeType: et.MENTION,
-          startIndex: o,
+        n.push({
+          rangeId: r.content.id,
+          rangeType: Qe.MENTION,
+          startIndex: i,
           endIndex: a,
           properties: {}
         });
@@ -371,33 +358,33 @@ const je = j((t, e) => {
       }
     ],
     dataStream: e,
-    customRanges: r
+    customRanges: n
   };
-}, Wt = "univer-thread-comment", Ft = "univer-thread-comment-active", zt = "univer-thread-comment-content", Zt = "univer-thread-comment-highlight", Kt = "univer-thread-comment-icon-container", Gt = "univer-thread-comment-icon", Yt = "univer-thread-comment-title", qt = "univer-thread-comment-title-position", Jt = "univer-thread-comment-title-highlight", Qt = "univer-thread-comment-title-position-text", Xt = "univer-thread-comment-username", en = "univer-thread-comment-item", tn = "univer-thread-comment-item-head", nn = "univer-thread-comment-item-title", rn = "univer-thread-comment-item-time", on = "univer-thread-comment-item-content", an = "univer-thread-comment-item-at", v = {
-  threadComment: Wt,
-  threadCommentActive: Ft,
-  threadCommentContent: zt,
-  threadCommentHighlight: Zt,
-  threadCommentIconContainer: Kt,
-  threadCommentIcon: Gt,
-  threadCommentTitle: Yt,
-  threadCommentTitlePosition: qt,
-  threadCommentTitleHighlight: Jt,
-  threadCommentTitlePositionText: Qt,
-  threadCommentUsername: Xt,
-  threadCommentItem: en,
-  threadCommentItemHead: tn,
-  threadCommentItemTitle: nn,
-  threadCommentItemTime: rn,
-  threadCommentItemContent: on,
-  threadCommentItemAt: an
-}, Ae = "__mock__", sn = (t) => {
-  const { item: e, unitId: r, subUnitId: n, editing: o, onEditingChange: a, onReply: d, resolved: C, isRoot: g, onClose: N, onDeleteComment: O, type: w } = t, P = T(oe), U = T(fe), m = T(pe), f = m.getUser(e.personId), M = W(m.currentUser$), y = (M == null ? void 0 : M.userID) === e.personId, H = e.id === Ae, [I, R] = V(!1), c = () => {
+}, jt = "univer-thread-comment", At = "univer-thread-comment-active", Bt = "univer-thread-comment-content", Wt = "univer-thread-comment-highlight", Ft = "univer-thread-comment-icon-container", zt = "univer-thread-comment-icon", Zt = "univer-thread-comment-title", Kt = "univer-thread-comment-title-position", Gt = "univer-thread-comment-title-highlight", Yt = "univer-thread-comment-title-position-text", qt = "univer-thread-comment-username", Jt = "univer-thread-comment-item", Qt = "univer-thread-comment-item-head", Xt = "univer-thread-comment-item-title", en = "univer-thread-comment-item-time", tn = "univer-thread-comment-item-content", nn = "univer-thread-comment-item-at", v = {
+  threadComment: jt,
+  threadCommentActive: At,
+  threadCommentContent: Bt,
+  threadCommentHighlight: Wt,
+  threadCommentIconContainer: Ft,
+  threadCommentIcon: zt,
+  threadCommentTitle: Zt,
+  threadCommentTitlePosition: Kt,
+  threadCommentTitleHighlight: Gt,
+  threadCommentTitlePositionText: Yt,
+  threadCommentUsername: qt,
+  threadCommentItem: Jt,
+  threadCommentItemHead: Qt,
+  threadCommentItemTitle: Xt,
+  threadCommentItemTime: en,
+  threadCommentItemContent: tn,
+  threadCommentItemAt: nn
+}, Ve = "__mock__", rn = (t) => {
+  const { item: e, unitId: n, subUnitId: r, editing: i, onEditingChange: a, onReply: d, resolved: C, isRoot: g, onClose: N, onDeleteComment: O, type: w } = t, P = T(ie), U = T(fe), m = T(pe), f = m.getUser(e.personId), $ = W(m.currentUser$), y = ($ == null ? void 0 : $.userID) === e.personId, M = e.id === Ve, [I, R] = V(!1), c = () => {
     (O == null ? void 0 : O(e)) !== !1 && (P.executeCommand(
-      g ? Oe.id : lt.id,
+      g ? Ee.id : at.id,
       {
-        unitId: r,
-        subUnitId: n,
+        unitId: n,
+        subUnitId: r,
         commentId: e.id
       }
     ), g && (N == null || N()));
@@ -407,36 +394,60 @@ const je = j((t, e) => {
     /* @__PURE__ */ S("div", { className: v.threadCommentItemTitle, children: [
       /* @__PURE__ */ l("div", { className: v.threadCommentUsername, children: (f == null ? void 0 : f.name) || " " }),
       /* @__PURE__ */ S("div", { children: [
-        H || C ? null : I ? /* @__PURE__ */ l("div", { className: v.threadCommentIcon, onClick: () => d(f), children: /* @__PURE__ */ l(Re, {}) }) : null,
-        y && !H && !C ? /* @__PURE__ */ l(
-          ut,
+        M || C ? null : I ? /* @__PURE__ */ l("div", { className: v.threadCommentIcon, onClick: () => d(f), children: /* @__PURE__ */ l(ke, {}) }) : null,
+        y && !M && !C ? /* @__PURE__ */ l(
+          mt,
           {
-            overlay: /* @__PURE__ */ S(ht, { children: [
-              /* @__PURE__ */ l(be, { onClick: () => a == null ? void 0 : a(!0), children: U.t("threadCommentUI.item.edit") }, "edit"),
-              /* @__PURE__ */ l(be, { onClick: c, children: U.t("threadCommentUI.item.delete") }, "delete")
-            ] }),
-            children: /* @__PURE__ */ l("div", { className: v.threadCommentIcon, children: /* @__PURE__ */ l(ke, {}) })
+            overlay: /* @__PURE__ */ l("div", { className: "univer-rounded-lg univer-p-4 univer-theme", children: /* @__PURE__ */ S(
+              "ul",
+              {
+                className: `
+                                              univer-m-0 univer-grid univer-list-none univer-gap-2 univer-p-0
+                                              univer-text-sm
+                                              [&_a]:univer-cursor-pointer [&_a]:univer-rounded [&_a]:univer-p-1
+                                            `,
+                children: [
+                  /* @__PURE__ */ l("li", { children: /* @__PURE__ */ l(
+                    "a",
+                    {
+                      className: "hover:univer-bg-gray-200",
+                      onClick: () => a == null ? void 0 : a(!0),
+                      children: U.t("threadCommentUI.item.edit")
+                    }
+                  ) }),
+                  /* @__PURE__ */ l("li", { children: /* @__PURE__ */ l(
+                    "a",
+                    {
+                      className: "hover:univer-bg-gray-200",
+                      onClick: c,
+                      children: U.t("threadCommentUI.item.delete")
+                    }
+                  ) })
+                ]
+              }
+            ) }),
+            children: /* @__PURE__ */ l("div", { className: v.threadCommentIcon, children: /* @__PURE__ */ l(Me, {}) })
           }
         ) : null
       ] })
     ] }),
     /* @__PURE__ */ l("div", { className: v.threadCommentItemTime, children: e.dT }),
-    o ? /* @__PURE__ */ l(
-      je,
+    i ? /* @__PURE__ */ l(
+      Le,
       {
         type: w,
         id: e.id,
         comment: e,
         onCancel: () => a == null ? void 0 : a(!1),
         autoFocus: !0,
-        unitId: r,
-        subUnitId: n,
+        unitId: n,
+        subUnitId: r,
         onSave: ({ text: u, attachments: p }) => {
           a == null || a(!1), P.executeCommand(
-            st.id,
+            ot.id,
             {
-              unitId: r,
-              subUnitId: n,
+              unitId: n,
+              subUnitId: r,
               payload: {
                 commentId: e.id,
                 text: u,
@@ -446,7 +457,7 @@ const je = j((t, e) => {
           );
         }
       }
-    ) : /* @__PURE__ */ l("div", { className: v.threadCommentItemContent, children: At(e.text).map((u, p) => /* @__PURE__ */ l("div", { children: u.map((s, h) => {
+    ) : /* @__PURE__ */ l("div", { className: v.threadCommentItemContent, children: Lt(e.text).map((u, p) => /* @__PURE__ */ l("div", { children: u.map((s, h) => {
       switch (s.type) {
         case "mention":
           return /* @__PURE__ */ S("a", { className: v.threadCommentItemAt, children: [
@@ -458,13 +469,13 @@ const je = j((t, e) => {
       }
     }) }, p)) })
   ] });
-}, ln = (t) => {
+}, on = (t) => {
   var X, ee, se;
   const {
     id: e,
-    unitId: r,
-    subUnitId: n,
-    refStr: o,
+    unitId: n,
+    subUnitId: r,
+    refStr: i,
     showEdit: a = !0,
     onClick: d,
     showHighlight: C,
@@ -476,59 +487,59 @@ const je = j((t, e) => {
     onMouseLeave: U,
     onAddComment: m,
     onDeleteComment: f,
-    onResolve: M,
+    onResolve: $,
     type: y
-  } = t, H = T(Ee), [I, R] = V(!1), [c, u] = V(""), p = ne(() => H.commentUpdate$.pipe(ct(16)), [H]);
+  } = t, M = T(Ue), [I, R] = V(!1), [c, u] = V(""), p = ne(() => M.commentUpdate$.pipe(lt(16)), [M]);
   W(p);
-  const s = e ? H.getCommentWithChildren(r, n, e) : null, h = T(oe), K = T(pe), _ = s == null ? void 0 : s.root.resolved, b = W(K.currentUser$), G = re(null), ie = [
+  const s = e ? M.getCommentWithChildren(n, r, e) : null, h = T(ie), K = T(pe), _ = s == null ? void 0 : s.root.resolved, b = W(K.currentUser$), G = re(null), oe = [
     ...s ? [s.root] : (
       // mock empty comment
       [{
-        id: Ae,
+        id: Ve,
         text: {
           dataStream: `
 \r`
         },
         personId: (X = b == null ? void 0 : b.userID) != null ? X : "",
-        ref: o != null ? o : "",
+        ref: i != null ? i : "",
         dT: "",
-        unitId: r,
-        subUnitId: n,
+        unitId: n,
+        subUnitId: r,
         threadId: ""
       }]
     ),
     ...(ee = s == null ? void 0 : s.children) != null ? ee : []
-  ], $ = re(null), q = (x) => {
+  ], D = re(null), q = (x) => {
     x.stopPropagation(), _ ? h.executeCommand(F.id, {
-      unitId: r,
-      subUnitId: n,
+      unitId: n,
+      subUnitId: r,
       commentId: e
-    }) : h.executeCommand(F.id), h.executeCommand(at.id, {
-      unitId: r,
-      subUnitId: n,
+    }) : h.executeCommand(F.id), h.executeCommand(it.id, {
+      unitId: n,
+      subUnitId: r,
       commentId: e,
       resolved: !_
-    }), M == null || M(!_);
+    }), $ == null || $(!_);
   }, L = (x) => {
     x.stopPropagation(), h.executeCommand(F.id), !(s != null && s.root && (f == null ? void 0 : f(s.root)) === !1) && (h.executeCommand(
-      Oe.id,
+      Ee.id,
       {
-        unitId: r,
-        subUnitId: n,
+        unitId: n,
+        subUnitId: r,
         commentId: e
       }
     ), g == null || g());
   };
   me(() => U == null ? void 0 : U(), []);
-  const J = N((se = s == null ? void 0 : s.root.subUnitId) != null ? se : n), Q = a && !c && !_, ae = `${o || (s == null ? void 0 : s.root.ref) || ""}${J ? " · " : ""}${J}`;
+  const J = N((se = s == null ? void 0 : s.root.subUnitId) != null ? se : r), Q = a && !c && !_, ae = `${i || (s == null ? void 0 : s.root.ref) || ""}${J ? " · " : ""}${J}`;
   return /* @__PURE__ */ S(
     "div",
     {
-      className: Lt(v.threadComment, {
+      className: dt(v.threadComment, {
         [v.threadCommentActive]: !_ && (C || I || O === "cell")
       }),
       onClick: d,
-      id: `${O}-${r}-${n}-${e}`,
+      id: `${O}-${n}-${r}-${e}`,
       onMouseEnter: () => {
         P == null || P(), R(!0);
       },
@@ -540,7 +551,7 @@ const je = j((t, e) => {
         /* @__PURE__ */ S("div", { className: v.threadCommentTitle, children: [
           /* @__PURE__ */ S("div", { className: v.threadCommentTitlePosition, children: [
             /* @__PURE__ */ l("div", { className: v.threadCommentTitleHighlight }),
-            /* @__PURE__ */ l(mt, { showIfEllipsis: !0, title: ae, children: /* @__PURE__ */ l("div", { className: v.threadCommentTitlePositionText, children: ae }) })
+            /* @__PURE__ */ l(ct, { showIfEllipsis: !0, title: ae, children: /* @__PURE__ */ l("div", { className: v.threadCommentTitlePositionText, children: ae }) })
           ] }),
           s ? /* @__PURE__ */ S("div", { className: v.threadCommentIconContainer, children: [
             /* @__PURE__ */ l(
@@ -549,35 +560,35 @@ const je = j((t, e) => {
                 onClick: q,
                 className: v.threadCommentIcon,
                 style: { color: _ ? "rgb(var(--green-500))" : "" },
-                children: _ ? /* @__PURE__ */ l(we, {}) : /* @__PURE__ */ l(Le, {})
+                children: _ ? /* @__PURE__ */ l(Re, {}) : /* @__PURE__ */ l(we, {})
               }
             ),
             (b == null ? void 0 : b.userID) === s.root.personId ? /* @__PURE__ */ l("div", { className: v.threadCommentIcon, onClick: L, children: /* @__PURE__ */ l(De, {}) }) : null
           ] }) : null
         ] }),
-        /* @__PURE__ */ l("div", { className: v.threadCommentContent, ref: $, children: ie.map(
+        /* @__PURE__ */ l("div", { className: v.threadCommentContent, ref: D, children: oe.map(
           (x) => /* @__PURE__ */ l(
-            sn,
+            rn,
             {
               onClose: g,
-              unitId: r,
-              subUnitId: n,
+              unitId: n,
+              subUnitId: r,
               item: x,
               isRoot: x.id === (s == null ? void 0 : s.root.id),
               editing: c === x.id,
               resolved: s == null ? void 0 : s.root.resolved,
               type: y,
-              onEditingChange: (i) => {
-                u(i ? x.id : "");
+              onEditingChange: (o) => {
+                u(o ? x.id : "");
               },
-              onReply: (i) => {
-                i && requestAnimationFrame(() => {
+              onReply: (o) => {
+                o && requestAnimationFrame(() => {
                   var k;
-                  (k = G.current) == null || k.reply(Bt([{
+                  (k = G.current) == null || k.reply(Vt([{
                     type: "mention",
                     content: {
-                      id: i.userID,
-                      label: i.name
+                      id: o.userID,
+                      label: o.name
                     }
                   }]));
                 });
@@ -589,33 +600,33 @@ const je = j((t, e) => {
           )
         ) }),
         Q ? /* @__PURE__ */ l("div", { children: /* @__PURE__ */ l(
-          je,
+          Le,
           {
             ref: G,
             type: y,
-            unitId: r,
-            subUnitId: n,
-            onSave: async ({ text: x, attachments: i }) => {
+            unitId: n,
+            subUnitId: r,
+            onSave: async ({ text: x, attachments: o }) => {
               const k = {
                 text: x,
-                attachments: i,
-                dT: ot(),
-                id: nt(),
-                ref: o,
+                attachments: o,
+                dT: nt(),
+                id: et(),
+                ref: i,
                 personId: b == null ? void 0 : b.userID,
                 parentId: s == null ? void 0 : s.root.id,
-                unitId: r,
-                subUnitId: n,
+                unitId: n,
+                subUnitId: r,
                 threadId: s == null ? void 0 : s.root.threadId
               };
               (m == null ? void 0 : m(k)) !== !1 && (await h.executeCommand(
-                it.id,
+                rt.id,
                 {
-                  unitId: r,
-                  subUnitId: n,
+                  unitId: n,
+                  subUnitId: r,
                   comment: k
                 }
-              ), $.current && ($.current.scrollTop = $.current.scrollHeight));
+              ), D.current && (D.current.scrollTop = D.current.scrollHeight));
             },
             autoFocus: w || !s,
             onCancel: () => {
@@ -627,18 +638,18 @@ const je = j((t, e) => {
       ]
     }
   );
-}, dn = "univer-thread-comment-panel", cn = "univer-thread-comment-panel-forms", mn = "univer-thread-comment-panel-empty", un = "univer-thread-comment-panel-add", hn = "univer-thread-comment-panel-solved", te = {
-  threadCommentPanel: dn,
-  threadCommentPanelForms: cn,
-  threadCommentPanelEmpty: mn,
-  threadCommentPanelAdd: un,
-  threadCommentPanelSolved: hn
-}, _n = (t) => {
+}, an = "univer-thread-comment-panel", sn = "univer-thread-comment-panel-forms", ln = "univer-thread-comment-panel-empty", dn = "univer-thread-comment-panel-add", cn = "univer-thread-comment-panel-solved", te = {
+  threadCommentPanel: an,
+  threadCommentPanelForms: sn,
+  threadCommentPanelEmpty: ln,
+  threadCommentPanelAdd: dn,
+  threadCommentPanelSolved: cn
+}, bn = (t) => {
   const {
     unitId: e,
-    subUnitId$: r,
-    type: n,
-    onAdd: o,
+    subUnitId$: n,
+    type: r,
+    onAdd: i,
     getSubUnitName: a,
     onResolve: d,
     sortComments: C,
@@ -649,9 +660,9 @@ const je = j((t, e) => {
     onAddComment: P,
     onDeleteComment: U,
     showComments: m
-  } = t, [f, M] = V("all"), [y, H] = V("all"), I = T(fe), R = T(pe), c = T(Ee), [u, p] = V(() => c.getUnit(e)), s = T(Y), h = W(s.activeCommentId$), K = W(c.commentUpdate$), _ = T(oe), b = W(r), G = re(!0), ie = "panel", $ = W(R.currentUser$), q = ne(() => {
+  } = t, [f, $] = V("all"), [y, M] = V("all"), I = T(fe), R = T(pe), c = T(Ue), [u, p] = V(() => c.getUnit(e)), s = T(Y), h = W(s.activeCommentId$), K = W(c.commentUpdate$), _ = T(ie), b = W(n), G = re(!0), oe = "panel", D = W(R.currentUser$), q = ne(() => {
     var de;
-    const i = f === "all" ? u : (de = u.filter((E) => E.subUnitId === b)) != null ? de : [], k = C != null ? C : (E) => E, le = i.map((E) => {
+    const o = f === "all" ? u : (de = u.filter((E) => E.subUnitId === b)) != null ? de : [], k = C != null ? C : (E) => E, le = o.map((E) => {
       var A;
       return { ...E.root, children: (A = E.children) != null ? A : [], users: E.relativeUsers };
     });
@@ -663,10 +674,10 @@ const je = j((t, e) => {
     } else
       return k(le);
   }, [m, f, u, C, b]), L = ne(() => [
-    ...q.filter((i) => !i.resolved),
-    ...q.filter((i) => i.resolved)
-  ], [q]), J = ne(() => y === "resolved" ? L.filter((i) => i.resolved) : y === "unsolved" ? L.filter((i) => !i.resolved) : y === "concern_me" && $ != null && $.userID ? L.filter((i) => i == null ? void 0 : i.users.has($.userID)) : L, [L, $ == null ? void 0 : $.userID, y]), Q = w ? [w, ...J] : J, ae = Q.filter((i) => !i.resolved), X = Q.filter((i) => i.resolved), ee = y !== "all" || f !== "all", se = () => {
-    H("all"), M("all");
+    ...q.filter((o) => !o.resolved),
+    ...q.filter((o) => o.resolved)
+  ], [q]), J = ne(() => y === "resolved" ? L.filter((o) => o.resolved) : y === "unsolved" ? L.filter((o) => !o.resolved) : y === "concern_me" && D != null && D.userID ? L.filter((o) => o == null ? void 0 : o.users.has(D.userID)) : L, [L, D == null ? void 0 : D.userID, y]), Q = w ? [w, ...J] : J, ae = Q.filter((o) => !o.resolved), X = Q.filter((o) => o.resolved), ee = y !== "all" || f !== "all", se = () => {
+    M("all"), $("all");
   };
   me(() => {
     e && p(
@@ -680,48 +691,48 @@ const je = j((t, e) => {
       G.current = !0;
       return;
     }
-    const { unitId: i, subUnitId: k, commentId: le } = h, de = `${ie}-${i}-${k}-${le}`;
+    const { unitId: o, subUnitId: k, commentId: le } = h, de = `${oe}-${o}-${k}-${le}`;
     (E = document.getElementById(de)) == null || E.scrollIntoView({ block: "center" });
   }, [h]);
-  const x = (i) => /* @__PURE__ */ l(
-    ln,
+  const x = (o) => /* @__PURE__ */ l(
+    on,
     {
-      prefix: ie,
+      prefix: oe,
       getSubUnitName: a,
-      id: i.id,
-      unitId: i.unitId,
-      subUnitId: i.subUnitId,
-      refStr: i.ref,
-      type: n,
-      showEdit: (h == null ? void 0 : h.commentId) === i.id,
-      showHighlight: (h == null ? void 0 : h.commentId) === i.id,
+      id: o.id,
+      unitId: o.unitId,
+      subUnitId: o.subUnitId,
+      refStr: o.ref,
+      type: r,
+      showEdit: (h == null ? void 0 : h.commentId) === o.id,
+      showHighlight: (h == null ? void 0 : h.commentId) === o.id,
       onClick: () => {
-        G.current = !1, i.resolved ? _.executeCommand(F.id) : _.executeCommand(
+        G.current = !1, o.resolved ? _.executeCommand(F.id) : _.executeCommand(
           F.id,
           {
-            unitId: i.unitId,
-            subUnitId: i.subUnitId,
-            commentId: i.id,
+            unitId: o.unitId,
+            subUnitId: o.subUnitId,
+            commentId: o.id,
             temp: !1
           }
         );
       },
-      onMouseEnter: () => N == null ? void 0 : N(i),
-      onMouseLeave: () => g == null ? void 0 : g(i),
+      onMouseEnter: () => N == null ? void 0 : N(o),
+      onMouseLeave: () => g == null ? void 0 : g(o),
       onAddComment: P,
       onDeleteComment: U,
-      onResolve: (k) => d == null ? void 0 : d(i.id, k)
+      onResolve: (k) => d == null ? void 0 : d(o.id, k)
     },
-    i.id
+    o.id
   );
   return /* @__PURE__ */ S("div", { className: te.threadCommentPanel, children: [
     /* @__PURE__ */ S("div", { className: te.threadCommentPanelForms, children: [
-      n === he.UNIVER_SHEET ? /* @__PURE__ */ l(
-        Se,
+      r === he.UNIVER_SHEET ? /* @__PURE__ */ l(
+        be,
         {
           borderless: !0,
           value: f,
-          onChange: (i) => M(i),
+          onChange: (o) => $(o),
           options: [
             {
               value: "current",
@@ -735,11 +746,11 @@ const je = j((t, e) => {
         }
       ) : null,
       /* @__PURE__ */ l(
-        Se,
+        be,
         {
           borderless: !0,
           value: y,
-          onChange: (i) => H(i),
+          onChange: (o) => M(o),
           options: [
             {
               value: "all",
@@ -779,7 +790,7 @@ const je = j((t, e) => {
           id: "thread-comment-add",
           className: te.threadCommentPanelAdd,
           type: "primary",
-          onClick: o,
+          onClick: i,
           disabled: O,
           children: [
             /* @__PURE__ */ l(He, {}),
@@ -792,10 +803,10 @@ const je = j((t, e) => {
 };
 export {
   F as SetActiveCommentOperation,
-  bt as THREAD_COMMENT_PANEL,
-  _n as ThreadCommentPanel,
+  gt as THREAD_COMMENT_PANEL,
+  bn as ThreadCommentPanel,
   Y as ThreadCommentPanelService,
-  ln as ThreadCommentTree,
-  yt as ToggleSheetCommentPanelOperation,
+  on as ThreadCommentTree,
+  bt as ToggleSheetCommentPanelOperation,
   ue as UniverThreadCommentUIPlugin
 };