index.js 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832
  1. var qe = Object.defineProperty;
  2. var Ze = (t, e, n) => e in t ? qe(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
  3. var V = (t, e, n) => Ze(t, typeof e != "symbol" ? e + "" : e, n);
  4. import { Inject as Ue, Disposable as Je, UniverInstanceType as he, IUniverInstanceService as Ke, CommandType as Pe, DependentOn as Ge, Injector as Ye, Plugin as Qe, merge as Xe, mergeOverrideWithDependencies as et, ICommandService as oe, IConfigService as tt, useDependency as U, LocaleService as pe, DOCS_NORMAL_EDITOR_UNIT_ID_KEY as nt, BuildTextUtils as Ce, Tools as rt, CustomRangeType as ot, getBodySlice as it, UserManagerService as ge, generateRandomId as at } from "@univerjs/core";
  5. import { UniverThreadCommentPlugin as st, ThreadCommentModel as Oe, getDT as dt, AddCommentCommand as lt, UpdateCommentCommand as mt, ResolveCommentCommand as ct, DeleteCommentTreeCommand as Re, DeleteCommentCommand as ut } from "@univerjs/thread-comment";
  6. import { ISidebarService as $e, KeyCode as Ie, useObservable as B } from "@univerjs/ui";
  7. import { BehaviorSubject as xe, filter as ht, debounceTime as Ct } from "rxjs";
  8. import ft, { forwardRef as L, useRef as re, createElement as W, useState as k, useEffect as me, useMemo as ne, useImperativeHandle as vt } from "react";
  9. import { Button as ce, Tooltip as pt, DropdownLegacy as gt, Menu as It, MenuItem as be, Select as _e } from "@univerjs/design";
  10. import { IEditorService as xt, BreakLineCommand as bt, RichTextEditor as _t } from "@univerjs/docs-ui";
  11. var St = Object.defineProperty, yt = Object.getOwnPropertyDescriptor, Tt = (t, e, n, r) => {
  12. for (var o = r > 1 ? void 0 : r ? yt(e, n) : e, s = t.length - 1, l; s >= 0; s--)
  13. (l = t[s]) && (o = (r ? l(e, n, o) : l(o)) || o);
  14. return r && o && St(e, n, o), o;
  15. }, Se = (t, e) => (n, r) => e(n, r, t);
  16. let J = class extends Je {
  17. constructor(e, n) {
  18. super();
  19. V(this, "_panelVisible", !1);
  20. V(this, "_panelVisible$", new xe(!1));
  21. V(this, "_activeCommentId");
  22. V(this, "_activeCommentId$", new xe(void 0));
  23. V(this, "panelVisible$", this._panelVisible$.asObservable());
  24. V(this, "activeCommentId$", this._activeCommentId$.asObservable());
  25. this._sidebarService = e, this._univerInstanceService = n, this._init(), this.disposeWithMe(() => {
  26. this._activeCommentId$.complete(), this._panelVisible$.complete();
  27. });
  28. }
  29. _init() {
  30. this.disposeWithMe(
  31. this._sidebarService.sidebarOptions$.subscribe((e) => {
  32. e.visible || this.setPanelVisible(!1);
  33. })
  34. ), this.disposeWithMe(
  35. this._univerInstanceService.getCurrentTypeOfUnit$(he.UNIVER_SHEET).pipe(ht((e) => !e)).subscribe(() => {
  36. this._sidebarService.close();
  37. })
  38. );
  39. }
  40. get panelVisible() {
  41. return this._panelVisible;
  42. }
  43. get activeCommentId() {
  44. return this._activeCommentId;
  45. }
  46. setPanelVisible(e) {
  47. this._panelVisible = e, this._panelVisible$.next(e);
  48. }
  49. setActiveComment(e) {
  50. this._activeCommentId = e, this._activeCommentId$.next(e);
  51. }
  52. };
  53. J = Tt([
  54. Se(0, Ue($e)),
  55. Se(1, Ke)
  56. ], J);
  57. const jt = "thread-comment-panel", Nt = "UNIVER_THREAD_COMMENT_UI_PLUGIN", Et = {
  58. id: "thread-comment-ui.operation.toggle-panel",
  59. type: Pe.OPERATION,
  60. handler(t) {
  61. const e = t.get($e), n = t.get(J);
  62. return n.panelVisible ? (e.close(), n.setPanelVisible(!1)) : (e.open({
  63. header: { title: "threadCommentUI.panel.title" },
  64. children: { label: jt },
  65. width: 330
  66. }), n.setPanelVisible(!0)), !0;
  67. }
  68. }, F = {
  69. id: "thread-comment-ui.operation.set-active-comment",
  70. type: Pe.OPERATION,
  71. handler(t, e) {
  72. return t.get(J).setActiveComment(e), !0;
  73. }
  74. }, Ut = "thread-comment-ui.config", ye = {};
  75. var De = Object.defineProperty, Pt = Object.getOwnPropertyDescriptor, Ot = (t, e, n) => e in t ? De(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, Rt = (t, e, n, r) => {
  76. for (var o = r > 1 ? void 0 : r ? Pt(e, n) : e, s = t.length - 1, l; s >= 0; s--)
  77. (l = t[s]) && (o = (r ? l(e, n, o) : l(o)) || o);
  78. return r && o && De(e, n, o), o;
  79. }, fe = (t, e) => (n, r) => e(n, r, t), He = (t, e, n) => Ot(t, typeof e != "symbol" ? e + "" : e, n);
  80. let ue = class extends Qe {
  81. constructor(t = ye, e, n, r) {
  82. super(), this._config = t, this._injector = e, this._commandService = n, this._configService = r;
  83. const { menu: o, ...s } = Xe(
  84. {},
  85. ye,
  86. this._config
  87. );
  88. o && this._configService.setConfig("menu", o, { merge: !0 }), this._configService.setConfig(Ut, s);
  89. }
  90. onStarting() {
  91. var t;
  92. et([
  93. [J]
  94. ], (t = this._config) == null ? void 0 : t.overrides).forEach((e) => {
  95. this._injector.add(e);
  96. }), [Et, F].forEach((e) => {
  97. this._commandService.registerCommand(e);
  98. });
  99. }
  100. };
  101. He(ue, "pluginName", Nt);
  102. He(ue, "type", he.UNIVER_UNKNOWN);
  103. ue = Rt([
  104. Ge(st),
  105. fe(1, Ue(Ye)),
  106. fe(2, oe),
  107. fe(3, tt)
  108. ], ue);
  109. var ve = { exports: {} }, ee = {};
  110. /**
  111. * @license React
  112. * react-jsx-runtime.production.min.js
  113. *
  114. * Copyright (c) Facebook, Inc. and its affiliates.
  115. *
  116. * This source code is licensed under the MIT license found in the
  117. * LICENSE file in the root directory of this source tree.
  118. */
  119. var Te;
  120. function $t() {
  121. if (Te) return ee;
  122. Te = 1;
  123. var t = ft, e = Symbol.for("react.element"), n = Symbol.for("react.fragment"), r = Object.prototype.hasOwnProperty, o = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, s = { key: !0, ref: !0, __self: !0, __source: !0 };
  124. function l(h, c, x) {
  125. var C, T = {}, b = null, _ = null;
  126. x !== void 0 && (b = "" + x), c.key !== void 0 && (b = "" + c.key), c.ref !== void 0 && (_ = c.ref);
  127. for (C in c) r.call(c, C) && !s.hasOwnProperty(C) && (T[C] = c[C]);
  128. if (h && h.defaultProps) for (C in c = h.defaultProps, c) T[C] === void 0 && (T[C] = c[C]);
  129. return { $$typeof: e, type: h, key: b, ref: _, props: T, _owner: o.current };
  130. }
  131. return ee.Fragment = n, ee.jsx = l, ee.jsxs = l, ee;
  132. }
  133. var je;
  134. function Dt() {
  135. return je || (je = 1, ve.exports = $t()), ve.exports;
  136. }
  137. var i = Dt(), $ = function() {
  138. return $ = Object.assign || function(t) {
  139. for (var e, n = 1, r = arguments.length; n < r; n++) {
  140. e = arguments[n];
  141. for (var o in e) Object.prototype.hasOwnProperty.call(e, o) && (t[o] = e[o]);
  142. }
  143. return t;
  144. }, $.apply(this, arguments);
  145. }, Ht = function(t, e) {
  146. var n = {};
  147. for (var r in t) Object.prototype.hasOwnProperty.call(t, r) && e.indexOf(r) < 0 && (n[r] = t[r]);
  148. if (t != null && typeof Object.getOwnPropertySymbols == "function")
  149. for (var o = 0, r = Object.getOwnPropertySymbols(t); o < r.length; o++)
  150. e.indexOf(r[o]) < 0 && Object.prototype.propertyIsEnumerable.call(t, r[o]) && (n[r[o]] = t[r[o]]);
  151. return n;
  152. }, z = L(function(t, e) {
  153. var n = t.icon, r = t.id, o = t.className, s = t.extend, l = Ht(t, ["icon", "id", "className", "extend"]), h = "univerjs-icon univerjs-icon-".concat(r, " ").concat(o || "").trim(), c = re("_".concat(kt()));
  154. return Me(n, "".concat(r), { defIds: n.defIds, idSuffix: c.current }, $({ ref: e, className: h }, l), s);
  155. });
  156. function Me(t, e, n, r, o) {
  157. return W(t.tag, $($({ key: e }, Mt(t, n, o)), r), (wt(t, n).children || []).map(function(s, l) {
  158. return Me(s, "".concat(e, "-").concat(t.tag, "-").concat(l), n, void 0, o);
  159. }));
  160. }
  161. function Mt(t, e, n) {
  162. var r = $({}, t.attrs);
  163. n != null && n.colorChannel1 && r.fill === "colorChannel1" && (r.fill = n.colorChannel1);
  164. var o = e.defIds;
  165. return !o || o.length === 0 || (t.tag === "use" && r["xlink:href"] && (r["xlink:href"] = r["xlink:href"] + e.idSuffix), Object.entries(r).forEach(function(s) {
  166. var l = s[0], h = s[1];
  167. typeof h == "string" && (r[l] = h.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
  168. })), r;
  169. }
  170. function wt(t, e) {
  171. var n, r = e.defIds;
  172. return !r || r.length === 0 ? t : t.tag === "defs" && (!((n = t.children) === null || n === void 0) && n.length) ? $($({}, t), { children: t.children.map(function(o) {
  173. return typeof o.attrs.id == "string" && r && r.indexOf(o.attrs.id) > -1 ? $($({}, o), { attrs: $($({}, o.attrs), { id: o.attrs.id + e.idSuffix }) }) : o;
  174. }) }) : t;
  175. }
  176. function kt() {
  177. return Math.random().toString(36).substring(2, 8);
  178. }
  179. z.displayName = "UniverIcon";
  180. var Lt = { 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" } }] }, we = L(function(t, e) {
  181. return W(z, Object.assign({}, t, {
  182. id: "delete-single",
  183. ref: e,
  184. icon: Lt
  185. }));
  186. });
  187. we.displayName = "DeleteSingle";
  188. var At = { 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" } }] }, ke = L(function(t, e) {
  189. return W(z, Object.assign({}, t, {
  190. id: "increase-single",
  191. ref: e,
  192. icon: At
  193. }));
  194. });
  195. ke.displayName = "IncreaseSingle";
  196. var Vt = { 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" } }] }, Le = L(function(t, e) {
  197. return W(z, Object.assign({}, t, {
  198. id: "more-horizontal-single",
  199. ref: e,
  200. icon: Vt
  201. }));
  202. });
  203. Le.displayName = "MoreHorizontalSingle";
  204. var Bt = { 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 } }] }, Ae = L(function(t, e) {
  205. return W(z, Object.assign({}, t, {
  206. id: "reply-to-comment-single",
  207. ref: e,
  208. icon: Bt
  209. }));
  210. });
  211. Ae.displayName = "ReplyToCommentSingle";
  212. var Ft = { 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" } }] }, Ve = L(function(t, e) {
  213. return W(z, Object.assign({}, t, {
  214. id: "resolved-single",
  215. ref: e,
  216. icon: Ft
  217. }));
  218. });
  219. Ve.displayName = "ResolvedSingle";
  220. 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 } }] }, Be = L(function(t, e) {
  221. return W(z, Object.assign({}, t, {
  222. id: "solve-single",
  223. ref: e,
  224. icon: Wt
  225. }));
  226. });
  227. Be.displayName = "SolveSingle";
  228. function Fe(t) {
  229. var e, n, r = "";
  230. if (typeof t == "string" || typeof t == "number") r += t;
  231. else if (typeof t == "object") if (Array.isArray(t)) {
  232. var o = t.length;
  233. for (e = 0; e < o; e++) t[e] && (n = Fe(t[e])) && (r && (r += " "), r += n);
  234. } else for (n in t) t[n] && (r && (r += " "), r += n);
  235. return r;
  236. }
  237. function zt() {
  238. for (var t, e, n = 0, r = "", o = arguments.length; n < o; n++) (t = arguments[n]) && (e = Fe(t)) && (r && (r += " "), r += e);
  239. return r;
  240. }
  241. const qt = "univer-thread-comment-editor-buttons", Zt = "univer-thread-comment-editor-suggestion", Jt = "univer-thread-comment-editor-suggestionActive", Kt = "univer-thread-comment-editor-suggestion-icon", Ne = {
  242. threadCommentEditorButtons: qt,
  243. threadCommentEditorSuggestion: Zt,
  244. threadCommentEditorSuggestionActive: Jt,
  245. threadCommentEditorSuggestionIcon: Kt
  246. };
  247. function Ee(t) {
  248. return {
  249. id: "d",
  250. body: t,
  251. documentStyle: {}
  252. };
  253. }
  254. const We = L((t, e) => {
  255. var M;
  256. const { comment: n, onSave: r, id: o, onCancel: s, autoFocus: l, unitId: h, type: c } = t, x = U(oe), C = U(pe), [T, b] = k(!1), _ = U(xt), u = re(null), g = c === he.UNIVER_SHEET ? nt : h, [O, j] = k(() => {
  257. var m, f, I;
  258. return Ce.transform.getPlainText((I = (f = (m = u.current) == null ? void 0 : m.getDocumentData().body) == null ? void 0 : f.dataStream) != null ? I : "");
  259. });
  260. me(() => {
  261. var f, I, d, v;
  262. j(Ce.transform.getPlainText((d = (I = (f = u.current) == null ? void 0 : f.getDocumentData().body) == null ? void 0 : I.dataStream) != null ? d : ""));
  263. const m = (v = u.current) == null ? void 0 : v.selectionChange$.subscribe(() => {
  264. var q, N, y;
  265. j(Ce.transform.getPlainText((y = (N = (q = u.current) == null ? void 0 : q.getDocumentData().body) == null ? void 0 : N.dataStream) != null ? y : ""));
  266. });
  267. return () => m == null ? void 0 : m.unsubscribe();
  268. }, [(M = u.current) == null ? void 0 : M.selectionChange$]);
  269. const D = ne(() => ({
  270. keyCodes: [{ keyCode: Ie.ENTER }],
  271. handler: (m) => {
  272. m === Ie.ENTER && x.executeCommand(
  273. bt.id
  274. );
  275. }
  276. }), [x]);
  277. vt(e, () => ({
  278. reply(m) {
  279. var f, I;
  280. (f = u.current) == null || f.focus(), (I = u.current) == null || I.setDocumentData(Ee(m));
  281. }
  282. }));
  283. const S = () => {
  284. if (u.current) {
  285. const m = rt.deepClone(u.current.getDocumentData().body);
  286. b(!1), r == null || r({
  287. ...n,
  288. text: m
  289. }), u.current.replaceText(""), setTimeout(() => {
  290. var f, I;
  291. (f = u.current) == null || f.setSelectionRanges([]), (I = u.current) == null || I.blur();
  292. }, 10);
  293. }
  294. };
  295. return /* @__PURE__ */ i.jsxs("div", { className: Ne.threadCommentEditor, onClick: (m) => m.preventDefault(), children: [
  296. /* @__PURE__ */ i.jsx(
  297. _t,
  298. {
  299. ref: u,
  300. autoFocus: l,
  301. style: { width: "100%" },
  302. keyboardEventConfig: D,
  303. placeholder: C.t("threadCommentUI.editor.placeholder"),
  304. initialValue: (n == null ? void 0 : n.text) && Ee(n.text),
  305. onFocusChange: (m) => m && b(m),
  306. isSingle: !1,
  307. maxHeight: 64,
  308. onClickOutside: () => {
  309. setTimeout(() => {
  310. _.focus(g);
  311. }, 30);
  312. }
  313. }
  314. ),
  315. T ? /* @__PURE__ */ i.jsxs("div", { className: Ne.threadCommentEditorButtons, children: [
  316. /* @__PURE__ */ i.jsx(
  317. ce,
  318. {
  319. style: { marginRight: 12 },
  320. onClick: () => {
  321. var m;
  322. s == null || s(), b(!1), (m = u.current) == null || m.replaceText("", !0), x.executeCommand(F.id);
  323. },
  324. children: C.t("threadCommentUI.editor.cancel")
  325. }
  326. ),
  327. /* @__PURE__ */ i.jsx(
  328. ce,
  329. {
  330. type: "primary",
  331. disabled: !O,
  332. onClick: S,
  333. children: C.t(o ? "threadCommentUI.editor.save" : "threadCommentUI.editor.reply")
  334. }
  335. )
  336. ] }) : null
  337. ] });
  338. }), Gt = (t) => {
  339. const { dataStream: e, customRanges: n } = t, r = e.endsWith(`\r
  340. `) ? e.length - 2 : e.length, o = [];
  341. let s = 0;
  342. return n == null || n.forEach((l) => {
  343. s < l.startIndex && o.push({
  344. type: "text",
  345. content: e.slice(s, l.startIndex)
  346. }), o.push({
  347. type: "mention",
  348. content: {
  349. label: e.slice(l.startIndex, l.endIndex + 1),
  350. id: l.rangeId
  351. }
  352. }), s = l.endIndex + 1;
  353. }), o.push({
  354. type: "text",
  355. content: e.slice(s, r)
  356. }), o;
  357. }, Yt = (t) => {
  358. const { paragraphs: e = [] } = t;
  359. let n = 0;
  360. return e.map((r) => {
  361. const o = it(t, n, r.startIndex);
  362. return n = r.startIndex + 1, Gt(o);
  363. });
  364. }, Qt = (t) => {
  365. let e = "";
  366. const n = [];
  367. return t.forEach((r) => {
  368. switch (r.type) {
  369. case "text":
  370. e += r.content;
  371. break;
  372. case "mention": {
  373. const o = e.length;
  374. e += r.content.label;
  375. const s = e.length - 1;
  376. n.push({
  377. rangeId: r.content.id,
  378. rangeType: ot.MENTION,
  379. startIndex: o,
  380. endIndex: s,
  381. properties: {}
  382. });
  383. break;
  384. }
  385. }
  386. }), e += `
  387. \r`, {
  388. textRuns: [],
  389. paragraphs: [
  390. {
  391. startIndex: e.length - 2,
  392. paragraphStyle: {}
  393. }
  394. ],
  395. sectionBreaks: [
  396. {
  397. startIndex: e.length - 1
  398. }
  399. ],
  400. dataStream: e,
  401. customRanges: n
  402. };
  403. }, Xt = "univer-thread-comment", en = "univer-thread-comment-active", tn = "univer-thread-comment-content", nn = "univer-thread-comment-highlight", rn = "univer-thread-comment-icon-container", on = "univer-thread-comment-icon", an = "univer-thread-comment-title", sn = "univer-thread-comment-title-position", dn = "univer-thread-comment-title-highlight", ln = "univer-thread-comment-title-position-text", mn = "univer-thread-comment-username", cn = "univer-thread-comment-item", un = "univer-thread-comment-item-head", hn = "univer-thread-comment-item-title", Cn = "univer-thread-comment-item-title-position", fn = "univer-thread-comment-item-title-highlight", vn = "univer-thread-comment-item-time", pn = "univer-thread-comment-item-content", gn = "univer-thread-comment-item-at", p = {
  404. threadComment: Xt,
  405. threadCommentActive: en,
  406. threadCommentContent: tn,
  407. threadCommentHighlight: nn,
  408. threadCommentIconContainer: rn,
  409. threadCommentIcon: on,
  410. threadCommentTitle: an,
  411. threadCommentTitlePosition: sn,
  412. threadCommentTitleHighlight: dn,
  413. threadCommentTitlePositionText: ln,
  414. threadCommentUsername: mn,
  415. threadCommentItem: cn,
  416. threadCommentItemHead: un,
  417. threadCommentItemTitle: hn,
  418. threadCommentItemTitlePosition: Cn,
  419. threadCommentItemTitleHighlight: fn,
  420. threadCommentItemTime: vn,
  421. threadCommentItemContent: pn,
  422. threadCommentItemAt: gn
  423. }, ze = "__mock__", In = (t) => {
  424. const { item: e, unitId: n, subUnitId: r, editing: o, onEditingChange: s, onReply: l, resolved: h, isRoot: c, onClose: x, onDeleteComment: C, type: T } = t, b = U(oe), _ = U(pe), u = U(ge), g = u.getUser(e.personId), O = B(u.currentUser$), j = (O == null ? void 0 : O.userID) === e.personId, D = e.id === ze, [S, M] = k(!1), m = () => {
  425. (C == null ? void 0 : C(e)) !== !1 && (b.executeCommand(
  426. c ? Re.id : ut.id,
  427. {
  428. unitId: n,
  429. subUnitId: r,
  430. commentId: e.id
  431. }
  432. ), c && (x == null || x()));
  433. };
  434. return /* @__PURE__ */ i.jsxs("div", { className: p.threadCommentItem, onMouseLeave: () => M(!1), onMouseEnter: () => M(!0), children: [
  435. /* @__PURE__ */ i.jsx("img", { className: p.threadCommentItemHead, src: g == null ? void 0 : g.avatar }),
  436. /* @__PURE__ */ i.jsxs("div", { className: p.threadCommentItemTitle, children: [
  437. /* @__PURE__ */ i.jsx("div", { className: p.threadCommentUsername, children: (g == null ? void 0 : g.name) || " " }),
  438. /* @__PURE__ */ i.jsxs("div", { children: [
  439. D || h ? null : S ? /* @__PURE__ */ i.jsx("div", { className: p.threadCommentIcon, onClick: () => l(g), children: /* @__PURE__ */ i.jsx(Ae, {}) }) : null,
  440. j && !D && !h ? /* @__PURE__ */ i.jsx(
  441. gt,
  442. {
  443. overlay: /* @__PURE__ */ i.jsxs(It, { children: [
  444. /* @__PURE__ */ i.jsx(be, { onClick: () => s == null ? void 0 : s(!0), children: _.t("threadCommentUI.item.edit") }, "edit"),
  445. /* @__PURE__ */ i.jsx(be, { onClick: m, children: _.t("threadCommentUI.item.delete") }, "delete")
  446. ] }),
  447. children: /* @__PURE__ */ i.jsx("div", { className: p.threadCommentIcon, children: /* @__PURE__ */ i.jsx(Le, {}) })
  448. }
  449. ) : null
  450. ] })
  451. ] }),
  452. /* @__PURE__ */ i.jsx("div", { className: p.threadCommentItemTime, children: e.dT }),
  453. o ? /* @__PURE__ */ i.jsx(
  454. We,
  455. {
  456. type: T,
  457. id: e.id,
  458. comment: e,
  459. onCancel: () => s == null ? void 0 : s(!1),
  460. autoFocus: !0,
  461. unitId: n,
  462. subUnitId: r,
  463. onSave: ({ text: f, attachments: I }) => {
  464. s == null || s(!1), b.executeCommand(
  465. mt.id,
  466. {
  467. unitId: n,
  468. subUnitId: r,
  469. payload: {
  470. commentId: e.id,
  471. text: f,
  472. attachments: I
  473. }
  474. }
  475. );
  476. }
  477. }
  478. ) : /* @__PURE__ */ i.jsx("div", { className: p.threadCommentItemContent, children: Yt(e.text).map((f, I) => /* @__PURE__ */ i.jsx("div", { children: f.map((d, v) => {
  479. switch (d.type) {
  480. case "mention":
  481. return /* @__PURE__ */ i.jsxs("a", { className: p.threadCommentItemAt, children: [
  482. d.content.label,
  483. " "
  484. ] }, v);
  485. default:
  486. return d.content;
  487. }
  488. }) }, I)) })
  489. ] });
  490. }, xn = (t) => {
  491. var Q, X, se;
  492. const {
  493. id: e,
  494. unitId: n,
  495. subUnitId: r,
  496. refStr: o,
  497. showEdit: s = !0,
  498. onClick: l,
  499. showHighlight: h,
  500. onClose: c,
  501. getSubUnitName: x,
  502. prefix: C,
  503. autoFocus: T,
  504. onMouseEnter: b,
  505. onMouseLeave: _,
  506. onAddComment: u,
  507. onDeleteComment: g,
  508. onResolve: O,
  509. type: j
  510. } = t, D = U(Oe), [S, M] = k(!1), [m, f] = k(""), I = ne(() => D.commentUpdate$.pipe(Ct(16)), [D]);
  511. B(I);
  512. const d = e ? D.getCommentWithChildren(n, r, e) : null, v = U(oe), q = U(ge), N = d == null ? void 0 : d.root.resolved, y = B(q.currentUser$), Z = re(null), ie = [
  513. ...d ? [d.root] : (
  514. // mock empty comment
  515. [{
  516. id: ze,
  517. text: {
  518. dataStream: `
  519. \r`
  520. },
  521. personId: (Q = y == null ? void 0 : y.userID) != null ? Q : "",
  522. ref: o != null ? o : "",
  523. dT: "",
  524. unitId: n,
  525. subUnitId: r,
  526. threadId: ""
  527. }]
  528. ),
  529. ...(X = d == null ? void 0 : d.children) != null ? X : []
  530. ], R = re(null), K = (E) => {
  531. E.stopPropagation(), N ? v.executeCommand(F.id, {
  532. unitId: n,
  533. subUnitId: r,
  534. commentId: e
  535. }) : v.executeCommand(F.id), v.executeCommand(ct.id, {
  536. unitId: n,
  537. subUnitId: r,
  538. commentId: e,
  539. resolved: !N
  540. }), O == null || O(!N);
  541. }, w = (E) => {
  542. E.stopPropagation(), v.executeCommand(F.id), !(d != null && d.root && (g == null ? void 0 : g(d.root)) === !1) && (v.executeCommand(
  543. Re.id,
  544. {
  545. unitId: n,
  546. subUnitId: r,
  547. commentId: e
  548. }
  549. ), c == null || c());
  550. };
  551. me(() => _ == null ? void 0 : _(), []);
  552. const G = x((se = d == null ? void 0 : d.root.subUnitId) != null ? se : r), Y = s && !m && !N, ae = `${o || (d == null ? void 0 : d.root.ref) || ""}${G ? " · " : ""}${G}`;
  553. return /* @__PURE__ */ i.jsxs(
  554. "div",
  555. {
  556. className: zt(p.threadComment, {
  557. [p.threadCommentActive]: !N && (h || S || C === "cell")
  558. }),
  559. onClick: l,
  560. id: `${C}-${n}-${r}-${e}`,
  561. onMouseEnter: () => {
  562. b == null || b(), M(!0);
  563. },
  564. onMouseLeave: () => {
  565. _ == null || _(), M(!1);
  566. },
  567. children: [
  568. !N && h ? /* @__PURE__ */ i.jsx("div", { className: p.threadCommentHighlight }) : null,
  569. /* @__PURE__ */ i.jsxs("div", { className: p.threadCommentTitle, children: [
  570. /* @__PURE__ */ i.jsxs("div", { className: p.threadCommentTitlePosition, children: [
  571. /* @__PURE__ */ i.jsx("div", { className: p.threadCommentTitleHighlight }),
  572. /* @__PURE__ */ i.jsx(pt, { showIfEllipsis: !0, title: ae, children: /* @__PURE__ */ i.jsx("div", { className: p.threadCommentTitlePositionText, children: ae }) })
  573. ] }),
  574. d ? /* @__PURE__ */ i.jsxs("div", { className: p.threadCommentIconContainer, children: [
  575. /* @__PURE__ */ i.jsx(
  576. "div",
  577. {
  578. onClick: K,
  579. className: p.threadCommentIcon,
  580. style: { color: N ? "rgb(var(--green-500))" : "" },
  581. children: N ? /* @__PURE__ */ i.jsx(Ve, {}) : /* @__PURE__ */ i.jsx(Be, {})
  582. }
  583. ),
  584. (y == null ? void 0 : y.userID) === d.root.personId ? /* @__PURE__ */ i.jsx("div", { className: p.threadCommentIcon, onClick: w, children: /* @__PURE__ */ i.jsx(we, {}) }) : null
  585. ] }) : null
  586. ] }),
  587. /* @__PURE__ */ i.jsx("div", { className: p.threadCommentContent, ref: R, children: ie.map(
  588. (E) => /* @__PURE__ */ i.jsx(
  589. In,
  590. {
  591. onClose: c,
  592. unitId: n,
  593. subUnitId: r,
  594. item: E,
  595. isRoot: E.id === (d == null ? void 0 : d.root.id),
  596. editing: m === E.id,
  597. resolved: d == null ? void 0 : d.root.resolved,
  598. type: j,
  599. onEditingChange: (a) => {
  600. f(a ? E.id : "");
  601. },
  602. onReply: (a) => {
  603. a && requestAnimationFrame(() => {
  604. var H;
  605. (H = Z.current) == null || H.reply(Qt([{
  606. type: "mention",
  607. content: {
  608. id: a.userID,
  609. label: a.name
  610. }
  611. }]));
  612. });
  613. },
  614. onAddComment: u,
  615. onDeleteComment: g
  616. },
  617. E.id
  618. )
  619. ) }),
  620. Y ? /* @__PURE__ */ i.jsx("div", { children: /* @__PURE__ */ i.jsx(
  621. We,
  622. {
  623. ref: Z,
  624. type: j,
  625. unitId: n,
  626. subUnitId: r,
  627. onSave: async ({ text: E, attachments: a }) => {
  628. const H = {
  629. text: E,
  630. attachments: a,
  631. dT: dt(),
  632. id: at(),
  633. ref: o,
  634. personId: y == null ? void 0 : y.userID,
  635. parentId: d == null ? void 0 : d.root.id,
  636. unitId: n,
  637. subUnitId: r,
  638. threadId: d == null ? void 0 : d.root.threadId
  639. };
  640. (u == null ? void 0 : u(H)) !== !1 && (await v.executeCommand(
  641. lt.id,
  642. {
  643. unitId: n,
  644. subUnitId: r,
  645. comment: H
  646. }
  647. ), R.current && (R.current.scrollTop = R.current.scrollHeight));
  648. },
  649. autoFocus: T || !d,
  650. onCancel: () => {
  651. d || c == null || c();
  652. }
  653. },
  654. `${T}`
  655. ) }) : null
  656. ]
  657. }
  658. );
  659. }, bn = "univer-thread-comment-panel", _n = "univer-thread-comment", Sn = "univer-thread-comment-panel-forms", yn = "univer-select", Tn = "univer-thread-comment-panel-empty", jn = "univer-thread-comment-panel-add", Nn = "univer-thread-comment-panel-solved", te = {
  660. threadCommentPanel: bn,
  661. threadComment: _n,
  662. threadCommentPanelForms: Sn,
  663. select: yn,
  664. threadCommentPanelEmpty: Tn,
  665. threadCommentPanelAdd: jn,
  666. threadCommentPanelSolved: Nn
  667. }, Mn = (t) => {
  668. const {
  669. unitId: e,
  670. subUnitId$: n,
  671. type: r,
  672. onAdd: o,
  673. getSubUnitName: s,
  674. onResolve: l,
  675. sortComments: h,
  676. onItemLeave: c,
  677. onItemEnter: x,
  678. disableAdd: C,
  679. tempComment: T,
  680. onAddComment: b,
  681. onDeleteComment: _,
  682. showComments: u
  683. } = t, [g, O] = k("all"), [j, D] = k("all"), S = U(pe), M = U(ge), m = U(Oe), [f, I] = k(() => m.getUnit(e)), d = U(J), v = B(d.activeCommentId$), q = B(m.commentUpdate$), N = U(oe), y = B(n), Z = re(!0), ie = "panel", R = B(M.currentUser$), K = ne(() => {
  684. var le;
  685. const a = g === "all" ? f : (le = f.filter((P) => P.subUnitId === y)) != null ? le : [], H = h != null ? h : (P) => P, de = a.map((P) => {
  686. var A;
  687. return { ...P.root, children: (A = P.children) != null ? A : [], users: P.relativeUsers };
  688. });
  689. if (u) {
  690. const P = /* @__PURE__ */ new Map();
  691. return de.forEach((A) => {
  692. P.set(A.id, A);
  693. }), [...u, ""].map((A) => P.get(A)).filter(Boolean);
  694. } else
  695. return H(de);
  696. }, [u, g, f, h, y]), w = ne(() => [
  697. ...K.filter((a) => !a.resolved),
  698. ...K.filter((a) => a.resolved)
  699. ], [K]), G = ne(() => j === "resolved" ? w.filter((a) => a.resolved) : j === "unsolved" ? w.filter((a) => !a.resolved) : j === "concern_me" && R != null && R.userID ? w.filter((a) => a == null ? void 0 : a.users.has(R.userID)) : w, [w, R == null ? void 0 : R.userID, j]), Y = T ? [T, ...G] : G, ae = Y.filter((a) => !a.resolved), Q = Y.filter((a) => a.resolved), X = j !== "all" || g !== "all", se = () => {
  700. D("all"), O("all");
  701. };
  702. me(() => {
  703. e && I(
  704. m.getUnit(e)
  705. );
  706. }, [e, m, q]), me(() => {
  707. var P;
  708. if (!v)
  709. return;
  710. if (!Z.current) {
  711. Z.current = !0;
  712. return;
  713. }
  714. const { unitId: a, subUnitId: H, commentId: de } = v, le = `${ie}-${a}-${H}-${de}`;
  715. (P = document.getElementById(le)) == null || P.scrollIntoView({ block: "center" });
  716. }, [v]);
  717. const E = (a) => /* @__PURE__ */ i.jsx(
  718. xn,
  719. {
  720. prefix: ie,
  721. getSubUnitName: s,
  722. id: a.id,
  723. unitId: a.unitId,
  724. subUnitId: a.subUnitId,
  725. refStr: a.ref,
  726. type: r,
  727. showEdit: (v == null ? void 0 : v.commentId) === a.id,
  728. showHighlight: (v == null ? void 0 : v.commentId) === a.id,
  729. onClick: () => {
  730. Z.current = !1, a.resolved ? N.executeCommand(F.id) : N.executeCommand(
  731. F.id,
  732. {
  733. unitId: a.unitId,
  734. subUnitId: a.subUnitId,
  735. commentId: a.id,
  736. temp: !1
  737. }
  738. );
  739. },
  740. onMouseEnter: () => x == null ? void 0 : x(a),
  741. onMouseLeave: () => c == null ? void 0 : c(a),
  742. onAddComment: b,
  743. onDeleteComment: _,
  744. onResolve: (H) => l == null ? void 0 : l(a.id, H)
  745. },
  746. a.id
  747. );
  748. return /* @__PURE__ */ i.jsxs("div", { className: te.threadCommentPanel, children: [
  749. /* @__PURE__ */ i.jsxs("div", { className: te.threadCommentPanelForms, children: [
  750. r === he.UNIVER_SHEET ? /* @__PURE__ */ i.jsx(
  751. _e,
  752. {
  753. borderless: !0,
  754. value: g,
  755. onChange: (a) => O(a),
  756. options: [
  757. {
  758. value: "current",
  759. label: S.t("threadCommentUI.filter.sheet.current")
  760. },
  761. {
  762. value: "all",
  763. label: S.t("threadCommentUI.filter.sheet.all")
  764. }
  765. ]
  766. }
  767. ) : null,
  768. /* @__PURE__ */ i.jsx(
  769. _e,
  770. {
  771. borderless: !0,
  772. value: j,
  773. onChange: (a) => D(a),
  774. options: [
  775. {
  776. value: "all",
  777. label: S.t("threadCommentUI.filter.status.all")
  778. },
  779. {
  780. value: "resolved",
  781. label: S.t("threadCommentUI.filter.status.resolved")
  782. },
  783. {
  784. value: "unsolved",
  785. label: S.t("threadCommentUI.filter.status.unsolved")
  786. },
  787. {
  788. value: "concern_me",
  789. label: S.t("threadCommentUI.filter.status.concernMe")
  790. }
  791. ]
  792. }
  793. )
  794. ] }),
  795. ae.map(E),
  796. Q.length ? /* @__PURE__ */ i.jsx("div", { className: te.threadCommentPanelSolved, children: "已解决" }) : null,
  797. Q.map(E),
  798. Y.length ? null : /* @__PURE__ */ i.jsxs("div", { className: te.threadCommentPanelEmpty, children: [
  799. X ? S.t("threadCommentUI.panel.filterEmpty") : S.t("threadCommentUI.panel.empty"),
  800. X ? /* @__PURE__ */ i.jsx(
  801. ce,
  802. {
  803. onClick: se,
  804. type: "link",
  805. children: S.t("threadCommentUI.panel.reset")
  806. }
  807. ) : /* @__PURE__ */ i.jsxs(
  808. ce,
  809. {
  810. id: "thread-comment-add",
  811. className: te.threadCommentPanelAdd,
  812. type: "primary",
  813. onClick: o,
  814. disabled: C,
  815. children: [
  816. /* @__PURE__ */ i.jsx(ke, {}),
  817. S.t("threadCommentUI.panel.addComment")
  818. ]
  819. }
  820. )
  821. ] })
  822. ] });
  823. };
  824. export {
  825. F as SetActiveCommentOperation,
  826. jt as THREAD_COMMENT_PANEL,
  827. Mn as ThreadCommentPanel,
  828. J as ThreadCommentPanelService,
  829. xn as ThreadCommentTree,
  830. Et as ToggleSheetCommentPanelOperation,
  831. ue as UniverThreadCommentUIPlugin
  832. };