@univerjs/thread-comment-ui 0.1.12

package/lib/es/index.js

@@ -0,0 +1,751 @@
+var Ue = Object.defineProperty;
+var Oe = (t, e, n) => e in t ? Ue(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var _ = (t, e, n) => (Oe(t, typeof e != "symbol" ? e + "" : e, n), n);
+import { UniverThreadCommentPlugin as Pe, ThreadCommentModel as ce, AddCommentCommand as He, UpdateCommentCommand as we, ResolveCommentCommand as De, DeleteCommentTreeCommand as ue, DeleteCommentCommand as Re } from "@univerjs/thread-comment";
+import { Disposable as he, UniverInstanceType as ve, IUniverInstanceService as ke, CommandType as Ce, OnLifecycle as Le, LifecycleStages as je, LocaleService as J, mergeOverrideWithDependencies as Ae, ICommandService as Q, CustomRangeType as Ve, UserManagerService as ee, Tools as Be } from "@univerjs/core";
+import { Inject as te, createIdentifier as ze, Injector as We } from "@wendellhu/redi";
+import { ISidebarService as fe, useObservable as j } from "@univerjs/ui";
+import { BehaviorSubject as re, filter as Fe } from "rxjs";
+import a, { forwardRef as H, useRef as X, createElement as k, useState as P, useImperativeHandle as Ze, useMemo as oe, useEffect as ae } from "react";
+import { useDependency as S } from "@wendellhu/redi/react-bindings";
+import { Mentions as Ye, Mention as Ke, Button as G, Dropdown as Ge, Menu as qe, MenuItem as ie, Select as le } from "@univerjs/design";
+import Je from "dayjs";
+import Qe from "clsx";
+const Xe = "thread-comment-panel", et = "thread-comment-ui-plugin";
+var tt = Object.defineProperty, nt = Object.getOwnPropertyDescriptor, rt = (t, e, n, r) => {
+  for (var o = r > 1 ? void 0 : r ? nt(e, n) : e, i = t.length - 1, s; i >= 0; i--)
+    (s = t[i]) && (o = (r ? s(e, n, o) : s(o)) || o);
+  return r && o && tt(e, n, o), o;
+}, se = (t, e) => (n, r) => e(n, r, t);
+let A = class extends he {
+  constructor(e, n) {
+    super();
+    _(this, "_panelVisible", !1);
+    _(this, "_panelVisible$", new re(!1));
+    _(this, "_activeCommentId");
+    _(this, "_activeCommentId$", new re(void 0));
+    _(this, "panelVisible$", this._panelVisible$.asObservable());
+    _(this, "activeCommentId$", this._activeCommentId$.asObservable());
+    this._sidebarService = e, this._univerInstanceService = n, this._init();
+  }
+  _init() {
+    this.disposeWithMe(
+      this._sidebarService.sidebarOptions$.subscribe((e) => {
+        e.visible || this.setPanelVisible(!1);
+      })
+    ), this.disposeWithMe(
+      this._univerInstanceService.getCurrentTypeOfUnit$(ve.UNIVER_SHEET).pipe(Fe((e) => !e)).subscribe(() => {
+        this._sidebarService.close();
+      })
+    );
+  }
+  get panelVisible() {
+    return this._panelVisible;
+  }
+  get activeCommentId() {
+    return this._activeCommentId;
+  }
+  setPanelVisible(e) {
+    this._panelVisible = e, this._panelVisible$.next(e);
+  }
+  setActiveComment(e) {
+    this._activeCommentId = e, this._activeCommentId$.next(e);
+  }
+};
+A = rt([
+  se(0, te(fe)),
+  se(1, ke)
+], A);
+const ot = {
+  id: "thread-comment-ui.operation.toggle-panel",
+  type: Ce.OPERATION,
+  handler(t) {
+    const e = t.get(fe), n = t.get(A);
+    return n.panelVisible ? (e.close(), n.setPanelVisible(!1)) : (e.open({
+      header: { title: "threadCommentUI.panel.title" },
+      children: { label: Xe },
+      width: 320
+    }), n.setPanelVisible(!0)), !0;
+  }
+}, ge = {
+  id: "thread-comment-ui.operation.set-active-comment",
+  type: Ce.OPERATION,
+  handler(t, e) {
+    return t.get(A).setActiveComment(e), !0;
+  }
+}, at = {
+  threadCommentUI: {
+    panel: {
+      title: "评论管理",
+      empty: "暂无评论",
+      filterEmpty: "没有匹配的结果",
+      reset: "重置",
+      addComment: "新建评论"
+    },
+    editor: {
+      placeholder: "回复",
+      reply: "回复",
+      cancel: "取消",
+      save: "保存"
+    },
+    item: {
+      edit: "编辑",
+      delete: "删除"
+    },
+    filter: {
+      sheet: {
+        all: "所有表格",
+        current: "当前表格"
+      },
+      status: {
+        all: "所有评论",
+        resolved: "已解决",
+        unsolved: "未解决",
+        concernMe: "与我有关"
+      }
+    }
+  }
+};
+var it = Object.defineProperty, lt = Object.getOwnPropertyDescriptor, st = (t, e, n, r) => {
+  for (var o = r > 1 ? void 0 : r ? lt(e, n) : e, i = t.length - 1, s; i >= 0; i--)
+    (s = t[i]) && (o = (r ? s(e, n, o) : s(o)) || o);
+  return r && o && it(e, n, o), o;
+}, mt = (t, e) => (n, r) => e(n, r, t);
+let K = class extends he {
+  constructor(t) {
+    super(), this._localeService = t, this._initLocales();
+  }
+  _initLocales() {
+    this._localeService.load({ zhCN: at });
+  }
+};
+K = st([
+  Le(je.Starting, K),
+  mt(0, te(J))
+], K);
+class dt {
+  constructor() {
+    _(this, "trigger", "@");
+  }
+  async getMentions(e) {
+    return [];
+  }
+}
+const pe = ze("thread-comment.mention-data.service");
+var ct = Object.defineProperty, ut = Object.getOwnPropertyDescriptor, ht = (t, e, n, r) => {
+  for (var o = r > 1 ? void 0 : r ? ut(e, n) : e, i = t.length - 1, s; i >= 0; i--)
+    (s = t[i]) && (o = (r ? s(e, n, o) : s(o)) || o);
+  return r && o && ct(e, n, o), o;
+}, me = (t, e) => (n, r) => e(n, r, t), Y;
+let de = (Y = class extends Pe {
+  constructor(e, n, r) {
+    super(
+      e,
+      n,
+      r
+    );
+    _(this, "_config1");
+    this._injector = n, this._commandService = r, this._config1 = e;
+  }
+  onStarting(e) {
+    super.onStarting(e), Ae([
+      [K],
+      [A],
+      [pe, { useClass: dt }]
+    ], this._config1.overrides).forEach((n) => {
+      e.add(n);
+    }), [ot, ge].forEach((n) => {
+      this._commandService.registerCommand(n);
+    });
+  }
+}, _(Y, "pluginName", et), _(Y, "type", ve.UNIVER_UNKNOWN), Y);
+de = ht([
+  me(1, te(We)),
+  me(2, Q)
+], de);
+var x = function() {
+  return x = Object.assign || function(t) {
+    for (var e, n = 1, r = arguments.length; n < r; n++) {
+      e = arguments[n];
+      for (var o in e)
+        Object.prototype.hasOwnProperty.call(e, o) && (t[o] = e[o]);
+    }
+    return t;
+  }, x.apply(this, arguments);
+}, vt = 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, r = Object.getOwnPropertySymbols(t); o < r.length; o++)
+      e.indexOf(r[o]) < 0 && Object.prototype.propertyIsEnumerable.call(t, r[o]) && (n[r[o]] = t[r[o]]);
+  return n;
+}, L = H(function(t, e) {
+  var n = t.icon, r = t.id, o = t.className, i = t.extend, s = vt(t, ["icon", "id", "className", "extend"]), c = "univerjs-icon univerjs-icon-".concat(r, " ").concat(o || "").trim(), d = X("_".concat(gt()));
+  return Ie(n, "".concat(r), { defIds: n.defIds, idSuffix: d.current }, x({ ref: e, className: c }, s), i);
+});
+function Ie(t, e, n, r, o) {
+  return k(t.tag, x(x({ key: e }, Ct(t, n, o)), r), (ft(t, n).children || []).map(function(i, s) {
+    return Ie(i, "".concat(e, "-").concat(t.tag, "-").concat(s), n, void 0, o);
+  }));
+}
+function Ct(t, e, n) {
+  var r = x({}, t.attrs);
+  n != null && n.colorChannel1 && r.fill === "colorChannel1" && (r.fill = n.colorChannel1);
+  var o = e.defIds;
+  return !o || o.length === 0 || (t.tag === "use" && r["xlink:href"] && (r["xlink:href"] = r["xlink:href"] + e.idSuffix), Object.entries(r).forEach(function(i) {
+    var s = i[0], c = i[1];
+    typeof c == "string" && (r[s] = c.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+  })), r;
+}
+function ft(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) ? x(x({}, t), { children: t.children.map(function(o) {
+    return typeof o.attrs.id == "string" && r && r.indexOf(o.attrs.id) > -1 ? x(x({}, o), { attrs: x(x({}, o.attrs), { id: o.attrs.id + e.idSuffix }) }) : o;
+  }) }) : t;
+}
+function gt() {
+  return Math.random().toString(36).substring(2, 8);
+}
+L.displayName = "UniverIcon";
+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" } }] }, ye = H(function(t, e) {
+  return k(L, Object.assign({}, t, {
+    id: "delete-single",
+    ref: e,
+    icon: pt
+  }));
+});
+ye.displayName = "DeleteSingle";
+const It = ye;
+var yt = { 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" } }] }, Se = H(function(t, e) {
+  return k(L, Object.assign({}, t, {
+    id: "increase-single",
+    ref: e,
+    icon: yt
+  }));
+});
+Se.displayName = "IncreaseSingle";
+const St = Se;
+var bt = { 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" } }] }, be = H(function(t, e) {
+  return k(L, Object.assign({}, t, {
+    id: "more-horizontal-single",
+    ref: e,
+    icon: bt
+  }));
+});
+be.displayName = "MoreHorizontalSingle";
+const Et = be;
+var xt = { 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 } }] }, Ee = H(function(t, e) {
+  return k(L, Object.assign({}, t, {
+    id: "reply-to-comment-single",
+    ref: e,
+    icon: xt
+  }));
+});
+Ee.displayName = "ReplyToCommentSingle";
+const _t = Ee;
+var Nt = { 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" } }] }, xe = H(function(t, e) {
+  return k(L, Object.assign({}, t, {
+    id: "resolved-single",
+    ref: e,
+    icon: Nt
+  }));
+});
+xe.displayName = "ResolvedSingle";
+const Tt = xe;
+var Mt = { 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 } }] }, _e = H(function(t, e) {
+  return k(L, Object.assign({}, t, {
+    id: "solve-single",
+    ref: e,
+    icon: Mt
+  }));
+});
+_e.displayName = "SolveSingle";
+const $t = _e, Ut = "univer-thread-comment-editor-buttons", Ot = "univer-thread-comment-editor-suggestion", Pt = "univer-thread-comment-editor-suggestionActive", Ht = "univer-thread-comment-editor-suggestion-icon", q = {
+  threadCommentEditorButtons: Ut,
+  threadCommentEditorSuggestion: Ot,
+  threadCommentEditorSuggestionActive: Pt,
+  threadCommentEditorSuggestionIcon: Ht
+}, wt = (t) => {
+  const e = /@\[(.*?)\]\((.*?)\)|(\w+)/g;
+  let n, r = 0;
+  const o = [];
+  for (; (n = e.exec(t)) !== null; )
+    n.index > r && o.push({
+      type: "text",
+      content: t.substring(r, n.index)
+    }), n[1] && n[2] ? o.push({
+      type: "mention",
+      content: {
+        label: n[1],
+        id: n[2]
+      }
+    }) : n[3] && o.push({
+      type: "text",
+      content: n[3]
+    }), r = e.lastIndex;
+  return r < t.length && o.push({
+    type: "text",
+    content: t.substring(r)
+  }), o;
+}, Dt = (t) => t.map((e) => {
+  switch (e.type) {
+    case "mention":
+      return `@[${e.content.label}](${e.content.id})`;
+    default:
+      return e.content;
+  }
+}).join(""), Ne = (t) => {
+  const { dataStream: e, customRanges: n } = t, r = e.length - 2, o = [];
+  let i = 0;
+  return n == null || n.forEach((s) => {
+    i < s.startIndex && o.push({
+      type: "text",
+      content: e.slice(i, s.startIndex)
+    }), o.push({
+      type: "mention",
+      content: {
+        label: e.slice(s.startIndex, s.endIndex).slice(1, -1),
+        id: s.rangeId
+      }
+    }), i = s.endIndex;
+  }), o.push({
+    type: "text",
+    content: e.slice(i, r)
+  }), o;
+}, Te = (t) => {
+  let e = "";
+  const n = [];
+  return t.forEach((r) => {
+    switch (r.type) {
+      case "text":
+        e += r.content;
+        break;
+      case "mention": {
+        const o = e.length;
+        e += `${r.content.label}`;
+        const i = e.length;
+        n.push({
+          rangeId: r.content.id,
+          rangeType: Ve.MENTION,
+          startIndex: o,
+          endIndex: i
+        });
+        break;
+      }
+    }
+  }), e += `
+\r`, {
+    textRuns: [],
+    paragraphs: [
+      {
+        startIndex: e.length - 2,
+        paragraphStyle: {}
+      }
+    ],
+    sectionBreaks: [
+      {
+        startIndex: e.length - 1
+      }
+    ],
+    dataStream: e,
+    customRanges: n
+  };
+}, Rt = (t) => ({
+  display: t.label,
+  id: `${t.id}`,
+  raw: t
+}), kt = (t, e, n, r, o) => {
+  var s, c;
+  const i = (s = t.raw) == null ? void 0 : s.icon;
+  return /* @__PURE__ */ a.createElement("div", { className: q.threadCommentEditorSuggestion }, i ? /* @__PURE__ */ a.createElement("img", { className: q.threadCommentEditorSuggestionIcon, src: i }) : null, /* @__PURE__ */ a.createElement("div", null, (c = t.display) != null ? c : t.id));
+}, Me = H((t, e) => {
+  var u;
+  const { comment: n, onSave: r, id: o, onCancel: i, autoFocus: s } = t, c = S(pe), d = S(J), [f, g] = P({ ...n }), [N, p] = P(!1), I = X(null);
+  return Ze(e, () => ({
+    reply(y) {
+      var h;
+      g({
+        ...n,
+        text: y,
+        attachments: []
+      }), (h = I.current) == null || h.inputElement.focus();
+    }
+  })), /* @__PURE__ */ a.createElement("div", { className: q.threadCommentEditor, onClick: (y) => y.preventDefault() }, /* @__PURE__ */ a.createElement(
+    Ye,
+    {
+      ref: I,
+      autoFocus: s,
+      style: { width: "100%" },
+      placeholder: d.t("threadCommentUI.editor.placeholder"),
+      value: f != null && f.text ? Dt(Ne(f.text)) : "",
+      onChange: (y) => {
+        y.target.value || g({ ...n, text: void 0 }), g == null || g({ ...n, text: Te(wt(y.target.value)) });
+      },
+      onFocus: () => {
+        p(!0);
+      }
+    },
+    /* @__PURE__ */ a.createElement(
+      Ke,
+      {
+        key: c.trigger,
+        trigger: c.trigger,
+        data: (y, h) => c.getMentions(y).then((T) => T.map(Rt)).then(h),
+        displayTransform: (y, h) => `@${h} `,
+        renderSuggestion: (u = c.renderSuggestion) != null ? u : kt
+      }
+    )
+  ), N ? /* @__PURE__ */ a.createElement("div", { className: q.threadCommentEditorButtons }, /* @__PURE__ */ a.createElement(
+    G,
+    {
+      style: { marginRight: 12 },
+      onClick: () => {
+        i == null || i(), p(!1), g({ text: void 0 });
+      }
+    },
+    d.t("threadCommentUI.editor.cancel")
+  ), /* @__PURE__ */ a.createElement(
+    G,
+    {
+      type: "primary",
+      disabled: !f.text,
+      onClick: () => {
+        f.text && (r == null || r({
+          ...f,
+          text: f.text
+        }), p(!1), g({ text: void 0 }));
+      }
+    },
+    d.t(o ? "threadCommentUI.editor.save" : "threadCommentUI.editor.reply")
+  )) : null);
+}), Lt = "univer-thread-comment", jt = "univer-thread-comment-active", At = "univer-thread-comment-content", Vt = "univer-thread-comment-highlight", Bt = "univer-thread-comment-icon-container", zt = "univer-thread-comment-icon", Wt = "univer-thread-comment-title", Ft = "univer-thread-comment-title-position", Zt = "univer-thread-comment-title-highlight", Yt = "univer-thread-comment-username", Kt = "univer-thread-comment-item", Gt = "univer-thread-comment-item-head", qt = "univer-thread-comment-item-title", Jt = "univer-thread-comment-item-title-position", Qt = "univer-thread-comment-item-title-highlight", Xt = "univer-thread-comment-item-time", en = "univer-thread-comment-item-content", tn = "univer-thread-comment-item-at", C = {
+  threadComment: Lt,
+  threadCommentActive: jt,
+  threadCommentContent: At,
+  threadCommentHighlight: Vt,
+  threadCommentIconContainer: Bt,
+  threadCommentIcon: zt,
+  threadCommentTitle: Wt,
+  threadCommentTitlePosition: Ft,
+  threadCommentTitleHighlight: Zt,
+  threadCommentUsername: Yt,
+  threadCommentItem: Kt,
+  threadCommentItemHead: Gt,
+  threadCommentItemTitle: qt,
+  threadCommentItemTitlePosition: Jt,
+  threadCommentItemTitleHighlight: Qt,
+  threadCommentItemTime: Xt,
+  threadCommentItemContent: en,
+  threadCommentItemAt: tn
+}, $e = "__mock__", nn = (t) => {
+  const { item: e, unitId: n, subUnitId: r, editing: o, onEditingChange: i, onReply: s, resolved: c, isRoot: d, onClose: f } = t, g = S(Q), N = S(J), p = S(ee), I = p.getUser(e.personId), u = j(p.currentUser$), y = (u == null ? void 0 : u.userID) === e.personId, h = e.id === $e, [T, w] = P(!1), m = () => {
+    g.executeCommand(
+      d ? ue.id : Re.id,
+      {
+        unitId: n,
+        subUnitId: r,
+        commentId: e.id
+      }
+    ), d && (f == null || f());
+  };
+  return /* @__PURE__ */ a.createElement("div", { className: C.threadCommentItem, onMouseLeave: () => w(!1), onMouseEnter: () => w(!0) }, /* @__PURE__ */ a.createElement("img", { className: C.threadCommentItemHead, src: I == null ? void 0 : I.avatar }), /* @__PURE__ */ a.createElement("div", { className: C.threadCommentItemTitle }, /* @__PURE__ */ a.createElement("div", { className: C.threadCommentUsername }, (I == null ? void 0 : I.name) || " "), /* @__PURE__ */ a.createElement("div", null, h || c ? null : T ? /* @__PURE__ */ a.createElement("div", { className: C.threadCommentIcon, onClick: () => s(I) }, /* @__PURE__ */ a.createElement(_t, null)) : null, y && !h && !c ? /* @__PURE__ */ a.createElement(
+    Ge,
+    {
+      overlay: /* @__PURE__ */ a.createElement(qe, null, /* @__PURE__ */ a.createElement(ie, { key: "edit", onClick: () => i == null ? void 0 : i(!0) }, N.t("threadCommentUI.item.edit")), /* @__PURE__ */ a.createElement(ie, { key: "delete", onClick: m }, N.t("threadCommentUI.item.delete")))
+    },
+    /* @__PURE__ */ a.createElement("div", { className: C.threadCommentIcon }, /* @__PURE__ */ a.createElement(Et, null))
+  ) : null)), /* @__PURE__ */ a.createElement("div", { className: C.threadCommentItemTime }, e.dT), o ? /* @__PURE__ */ a.createElement(
+    Me,
+    {
+      id: e.id,
+      comment: e,
+      onCancel: () => i == null ? void 0 : i(!1),
+      autoFocus: !0,
+      onSave: ({ text: v, attachments: D }) => {
+        i == null || i(!1), g.executeCommand(
+          we.id,
+          {
+            unitId: n,
+            subUnitId: r,
+            payload: {
+              commentId: e.id,
+              text: v,
+              attachments: D
+            }
+          }
+        );
+      }
+    }
+  ) : /* @__PURE__ */ a.createElement("div", { className: C.threadCommentItemContent }, Ne(e.text).map((v, D) => {
+    switch (v.type) {
+      case "mention":
+        return /* @__PURE__ */ a.createElement("a", { className: C.threadCommentItemAt, key: D }, "@", v.content.label, " ");
+      default:
+        return v.content;
+    }
+  })));
+}, rn = (t) => {
+  var R, B, F;
+  const {
+    id: e,
+    unitId: n,
+    subUnitId: r,
+    refStr: o,
+    showEdit: i = !0,
+    onClick: s,
+    showHighlight: c,
+    onClose: d,
+    getSubUnitName: f,
+    prefix: g,
+    autoFocus: N,
+    onMouseEnter: p,
+    onMouseLeave: I
+  } = t, u = S(ce), [y, h] = P(!1), [T, w] = P("");
+  j(u.commentMap$);
+  const m = e ? u.getCommentWithChildren(n, r, e) : null, v = S(Q), D = S(ee), U = m == null ? void 0 : m.root.resolved, b = j(D.currentUser$), M = X(null), V = [
+    ...m ? [m.root] : (
+      // mock empty comment
+      [{
+        id: $e,
+        text: {
+          dataStream: `
+\r`
+        },
+        personId: (R = b == null ? void 0 : b.userID) != null ? R : "",
+        ref: o != null ? o : "",
+        dT: "",
+        unitId: n,
+        subUnitId: r
+      }]
+    ),
+    ...(B = m == null ? void 0 : m.children) != null ? B : []
+  ], W = () => {
+    v.executeCommand(De.id, {
+      unitId: n,
+      subUnitId: r,
+      commentId: e,
+      resolved: !U
+    }), d == null || d();
+  }, O = () => {
+    v.executeCommand(
+      ue.id,
+      {
+        unitId: n,
+        subUnitId: r,
+        commentId: e
+      }
+    ), d == null || d();
+  };
+  return /* @__PURE__ */ a.createElement(
+    "div",
+    {
+      className: Qe(C.threadComment, {
+        [C.threadCommentActive]: !U && (c || y || g === "cell")
+      }),
+      onClick: s,
+      id: `${g}-${n}-${r}-${e}`,
+      onMouseEnter: () => {
+        p == null || p(), h(!0);
+      },
+      onMouseLeave: () => {
+        I == null || I(), h(!1);
+      }
+    },
+    !U && c ? /* @__PURE__ */ a.createElement("div", { className: C.threadCommentHighlight }) : null,
+    /* @__PURE__ */ a.createElement("div", { className: C.threadCommentTitle }, /* @__PURE__ */ a.createElement("div", { className: C.threadCommentTitlePosition }, /* @__PURE__ */ a.createElement("div", { className: C.threadCommentTitleHighlight }), o || (m == null ? void 0 : m.root.ref), " · ", f((F = m == null ? void 0 : m.root.subUnitId) != null ? F : r)), m ? /* @__PURE__ */ a.createElement("div", { className: C.threadCommentIconContainer }, /* @__PURE__ */ a.createElement(
+      "div",
+      {
+        onClick: W,
+        className: C.threadCommentIcon,
+        style: { color: U ? "rgb(var(--green-500))" : "" }
+      },
+      U ? /* @__PURE__ */ a.createElement(Tt, null) : /* @__PURE__ */ a.createElement($t, null)
+    ), (b == null ? void 0 : b.userID) === m.root.personId ? /* @__PURE__ */ a.createElement("div", { className: C.threadCommentIcon, onClick: O }, /* @__PURE__ */ a.createElement(It, null)) : null) : null),
+    /* @__PURE__ */ a.createElement("div", { className: C.threadCommentContent }, V.map(
+      (l) => /* @__PURE__ */ a.createElement(
+        nn,
+        {
+          onClose: d,
+          unitId: n,
+          subUnitId: r,
+          item: l,
+          key: l.id,
+          isRoot: l.id === (m == null ? void 0 : m.root.id),
+          editing: T === l.id,
+          resolved: m == null ? void 0 : m.root.resolved,
+          onEditingChange: (E) => {
+            w(E ? l.id : "");
+          },
+          onReply: (E) => {
+            var $;
+            E && (($ = M.current) == null || $.reply(Te([{
+              type: "mention",
+              content: {
+                id: E.userID,
+                label: E.name
+              }
+            }])));
+          }
+        }
+      )
+    )),
+    i && !T && !U ? /* @__PURE__ */ a.createElement("div", null, /* @__PURE__ */ a.createElement(
+      Me,
+      {
+        key: `${N}`,
+        ref: M,
+        onSave: ({ text: l, attachments: E }) => {
+          v.executeCommand(
+            He.id,
+            {
+              unitId: n,
+              subUnitId: r,
+              comment: {
+                text: l,
+                attachments: E,
+                dT: Je().format("YYYY/MM/DD HH:mm"),
+                id: Be.generateRandomId(),
+                ref: o,
+                personId: b == null ? void 0 : b.userID,
+                parentId: m == null ? void 0 : m.root.id,
+                unitId: n,
+                subUnitId: r
+              }
+            }
+          );
+        },
+        autoFocus: N || !m,
+        onCancel: () => {
+          m || d == null || d();
+        }
+      }
+    )) : null
+  );
+}, on = "univer-thread-comment-panel", an = "univer-thread-comment", ln = "univer-thread-comment-panel-forms", sn = "univer-select", mn = "univer-thread-comment-panel-empty", dn = "univer-thread-comment-panel-add", Z = {
+  threadCommentPanel: on,
+  threadComment: an,
+  threadCommentPanelForms: ln,
+  select: sn,
+  threadCommentPanelEmpty: mn,
+  threadCommentPanelAdd: dn
+}, bn = (t) => {
+  const { unitId: e, subUnitId$: n, type: r, onAdd: o, getSubUnitName: i, onResolve: s, sortComments: c, onItemLeave: d, onItemEnter: f } = t, [g, N] = P("all"), [p, I] = P("all"), u = S(J), y = S(ee), h = S(ce), [T, w] = P(() => h.getUnit(e)), m = S(A), v = j(m.activeCommentId$), D = j(h.commentUpdate$), U = S(Q), b = j(n), M = y.getCurrentUser(), V = X(!0), W = "panel", O = oe(() => {
+    var l, E;
+    if (g === "all") {
+      const $ = T.map((z) => z[1]).flat().filter((z) => !z.parentId);
+      return c ? c($) : $;
+    } else
+      return (E = (l = T.find(($) => $[0] === b)) == null ? void 0 : l[1]) != null ? E : [];
+  }, [g, T, b, c]), R = oe(() => p === "resolved" ? O.filter((l) => l.resolved) : p === "unsolved" ? O.filter((l) => !l.resolved) : p === "concern_me" && M != null && M.userID ? O.map((l) => h.getCommentWithChildren(l.unitId, l.subUnitId, l.id)).map((l) => l != null && l.relativeUsers.has(M.userID) ? l.root : null).filter(Boolean) : O, [O, M == null ? void 0 : M.userID, p, h]), B = p !== "all" || g !== "all", F = () => {
+    I("all"), N("all");
+  };
+  return ae(() => {
+    e && w(
+      h.getUnit(e)
+    );
+  }, [e, h, D]), ae(() => {
+    var ne;
+    if (!v)
+      return;
+    if (!V.current) {
+      V.current = !0;
+      return;
+    }
+    const { unitId: l, subUnitId: E, commentId: $ } = v, z = `${W}-${l}-${E}-${$}`;
+    (ne = document.getElementById(z)) == null || ne.scrollIntoView({ block: "center" });
+  }, [v]), /* @__PURE__ */ a.createElement("div", { className: Z.threadCommentPanel }, /* @__PURE__ */ a.createElement("div", { className: Z.threadCommentPanelForms }, /* @__PURE__ */ a.createElement(
+    le,
+    {
+      borderless: !0,
+      value: g,
+      onChange: (l) => N(l),
+      options: [
+        {
+          value: "current",
+          label: u.t("threadCommentUI.filter.sheet.current")
+        },
+        {
+          value: "all",
+          label: u.t("threadCommentUI.filter.sheet.all")
+        }
+      ]
+    }
+  ), /* @__PURE__ */ a.createElement(
+    le,
+    {
+      borderless: !0,
+      value: p,
+      onChange: (l) => I(l),
+      options: [
+        {
+          value: "all",
+          label: u.t("threadCommentUI.filter.status.all")
+        },
+        {
+          value: "resolved",
+          label: u.t("threadCommentUI.filter.status.resolved")
+        },
+        {
+          value: "unsolved",
+          label: u.t("threadCommentUI.filter.status.unsolved")
+        },
+        {
+          value: "concern_me",
+          label: u.t("threadCommentUI.filter.status.concernMe")
+        }
+      ]
+    }
+  )), R == null ? void 0 : R.map((l) => /* @__PURE__ */ a.createElement(
+    rn,
+    {
+      prefix: W,
+      getSubUnitName: i,
+      key: l.id,
+      id: l.id,
+      unitId: l.unitId,
+      subUnitId: l.subUnitId,
+      type: r,
+      showEdit: (v == null ? void 0 : v.commentId) === l.id,
+      showHighlight: (v == null ? void 0 : v.commentId) === l.id,
+      onClick: () => {
+        V.current = !1, U.executeCommand(ge.id, {
+          unitId: l.unitId,
+          subUnitId: l.subUnitId,
+          commentId: l.id,
+          temp: !0
+        });
+      },
+      onClose: () => s == null ? void 0 : s(l.id),
+      onMouseEnter: () => f == null ? void 0 : f(l),
+      onMouseLeave: () => d == null ? void 0 : d(l)
+    }
+  )), R.length ? null : /* @__PURE__ */ a.createElement("div", { className: Z.threadCommentPanelEmpty }, B ? u.t("threadCommentUI.panel.filterEmpty") : u.t("threadCommentUI.panel.empty"), B ? /* @__PURE__ */ a.createElement(
+    G,
+    {
+      onClick: F,
+      type: "link"
+    },
+    u.t("threadCommentUI.panel.reset")
+  ) : /* @__PURE__ */ a.createElement(
+    G,
+    {
+      id: "thread-comment-add",
+      className: Z.threadCommentPanelAdd,
+      type: "primary",
+      onClick: o
+    },
+    /* @__PURE__ */ a.createElement(St, null),
+    u.t("threadCommentUI.panel.addComment")
+  )));
+};
+export {
+  pe as IThreadCommentMentionDataService,
+  ge as SetActiveCommentOperation,
+  Xe as THREAD_COMMENT_PANEL,
+  bn as ThreadCommentPanel,
+  A as ThreadCommentPanelService,
+  rn as ThreadCommentTree,
+  ot as ToggleSheetCommentPanelOperation,
+  de as UniverThreadCommentUIPlugin
+};