@univerjs/thread-comment-ui 0.22.0 → 0.22.1

package/lib/cjs/index.js

@@ -125,7 +125,7 @@ const SetActiveCommentOperation = {
 //#endregion
 //#region package.json
 var name = "@univerjs/thread-comment-ui";
-var version = "0.22.0";
+var version = "0.22.1";
 
 //#endregion
 //#region src/config/config.ts
@@ -405,7 +405,7 @@ const ThreadCommentItem = (props) => {
 					className: "univer-text-sm univer-font-medium univer-leading-5",
 					children: (user === null || user === void 0 ? void 0 : user.name) || " "
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [isMock || resolved ? null : showReply && user ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50",
+					className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800",
 					onClick: () => onReply(user),
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_icons.ReplyToCommentIcon, {})
 				}) : null, isCommentBySelf && !isMock && !resolved ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_design.Dropdown, {
@@ -425,7 +425,7 @@ const ThreadCommentItem = (props) => {
 						})
 					}),
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50",
+						className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800",
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_icons.MoreHorizontalIcon, {})
 					})
 				}) : null] })]

package/lib/es/index.js

@@ -124,7 +124,7 @@ const SetActiveCommentOperation = {
 //#endregion
 //#region package.json
 var name = "@univerjs/thread-comment-ui";
-var version = "0.22.0";
+var version = "0.22.1";
 
 //#endregion
 //#region src/config/config.ts
@@ -404,7 +404,7 @@ const ThreadCommentItem = (props) => {
 					className: "univer-text-sm univer-font-medium univer-leading-5",
 					children: (user === null || user === void 0 ? void 0 : user.name) || " "
 				}), /* @__PURE__ */ jsxs("div", { children: [isMock || resolved ? null : showReply && user ? /* @__PURE__ */ jsx("div", {
-					className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50",
+					className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800",
 					onClick: () => onReply(user),
 					children: /* @__PURE__ */ jsx(ReplyToCommentIcon, {})
 				}) : null, isCommentBySelf && !isMock && !resolved ? /* @__PURE__ */ jsx(Dropdown, {
@@ -424,7 +424,7 @@ const ThreadCommentItem = (props) => {
 						})
 					}),
 					children: /* @__PURE__ */ jsx("div", {
-						className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50",
+						className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800",
 						children: /* @__PURE__ */ jsx(MoreHorizontalIcon, {})
 					})
 				}) : null] })]

package/lib/index.js

@@ -124,7 +124,7 @@ const SetActiveCommentOperation = {
 //#endregion
 //#region package.json
 var name = "@univerjs/thread-comment-ui";
-var version = "0.22.0";
+var version = "0.22.1";
 
 //#endregion
 //#region src/config/config.ts
@@ -404,7 +404,7 @@ const ThreadCommentItem = (props) => {
 					className: "univer-text-sm univer-font-medium univer-leading-5",
 					children: (user === null || user === void 0 ? void 0 : user.name) || " "
 				}), /* @__PURE__ */ jsxs("div", { children: [isMock || resolved ? null : showReply && user ? /* @__PURE__ */ jsx("div", {
-					className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50",
+					className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800",
 					onClick: () => onReply(user),
 					children: /* @__PURE__ */ jsx(ReplyToCommentIcon, {})
 				}) : null, isCommentBySelf && !isMock && !resolved ? /* @__PURE__ */ jsx(Dropdown, {
@@ -424,7 +424,7 @@ const ThreadCommentItem = (props) => {
 						})
 					}),
 					children: /* @__PURE__ */ jsx("div", {
-						className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50",
+						className: "univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800",
 						children: /* @__PURE__ */ jsx(MoreHorizontalIcon, {})
 					})
 				}) : null] })]

package/lib/umd/index.js

@@ -1,4 +1,4 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`@univerjs/core`),require(`@univerjs/ui`),require(`rxjs`),require(`@univerjs/thread-comment`),require(`@univerjs/design`),require(`react`),require(`@univerjs/docs-ui`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`@univerjs/core`,`@univerjs/ui`,`rxjs`,`@univerjs/thread-comment`,`@univerjs/design`,`react`,`@univerjs/docs-ui`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.UniverThreadCommentUi={},e.UniverCore,e.UniverUi,e.rxjs,e.UniverThreadComment,e.UniverDesign,e.React,e.UniverDocsUi,e.React))})(this,function(e,t,n,r,i,a,o,s,c){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});function l(e){"@babel/helpers - typeof";return l=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},l(e)}function u(e,t){if(l(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(l(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function d(e){var t=u(e,`string`);return l(t)==`symbol`?t:t+``}function f(e,t,n){return(t=d(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function p(e,t){return function(n,r){t(n,r,e)}}function m(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}let h=class extends t.Disposable{constructor(e,t){super(),this._sidebarService=e,this._univerInstanceService=t,f(this,`_panelVisible`,!1),f(this,`_panelVisible$`,new r.BehaviorSubject(!1)),f(this,`_activeCommentId`,void 0),f(this,`_activeCommentId$`,new r.BehaviorSubject(void 0)),f(this,`panelVisible$`,this._panelVisible$.asObservable()),f(this,`activeCommentId$`,this._activeCommentId$.asObservable()),this._init(),this.disposeWithMe(()=>{this._activeCommentId$.complete(),this._panelVisible$.complete()})}_init(){this.disposeWithMe(this._sidebarService.sidebarOptions$.subscribe(e=>{e.visible||this.setPanelVisible(!1)})),this.disposeWithMe(this._univerInstanceService.getCurrentTypeOfUnit$(t.UniverInstanceType.UNIVER_SHEET).pipe((0,r.filter)(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)}};h=m([p(0,(0,t.Inject)(n.ISidebarService)),p(1,t.IUniverInstanceService)],h);let g={id:`thread-comment-ui.operation.set-active-comment`,type:t.CommandType.OPERATION,handler(e,t){return e.get(h).setActiveComment(t),!0}};var _=`@univerjs/thread-comment-ui`,v=`0.22.0`;let y=`thread-comment-ui.config`;Symbol(y);let b={},x=class extends t.Plugin{constructor(e=b,n,r,i){super(),this._config=e,this._injector=n,this._commandService=r,this._configService=i;let{menu:a,...o}=(0,t.merge)({},b,this._config);a&&this._configService.setConfig(`menu`,a,{merge:!0}),this._configService.setConfig(y,o)}onStarting(){var e;(0,t.mergeOverrideWithDependencies)([[h]],(e=this._config)==null?void 0:e.overrides).forEach(e=>{this._injector.add(e)}),[g].forEach(e=>{this._commandService.registerCommand(e)})}};f(x,`pluginName`,`UNIVER_THREAD_COMMENT_UI_PLUGIN`),f(x,`packageName`,_),f(x,`version`,v),f(x,`type`,t.UniverInstanceType.UNIVER_UNKNOWN),x=m([(0,t.DependentOn)(i.UniverThreadCommentPlugin),p(1,(0,t.Inject)(t.Injector)),p(2,t.ICommandService),p(3,t.IConfigService)],x);function S({ref:e,...t}){let{icon:n,id:r,className:i,extend:a,...s}=t,c=`univerjs-icon univerjs-icon-${r} ${i||``}`.trim(),l=(0,o.useRef)(`_${E()}`);return C(n,`${r}`,{defIds:n.defIds,idSuffix:l.current},{ref:e,className:c,...s},a)}function C(e,t,n,r,i){return(0,o.createElement)(e.tag,{key:t,...w(e,n,i),...r},(T(e,n).children||[]).map((r,a)=>C(r,`${t}-${e.tag}-${a}`,n,void 0,i)))}function w(e,t,n){let r={...e.attrs};n!=null&&n.colorChannel1&&r.fill===`colorChannel1`&&(r.fill=n.colorChannel1),e.tag===`mask`&&r.id&&(r.id+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{e===`mask`&&typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))});let{defIds:i}=t;return!i||i.length===0?r:(e.tag===`use`&&r[`xlink:href`]&&(r[`xlink:href`]+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))}),r)}function T(e,t){var n;let{defIds:r}=t;return!r||r.length===0?e:e.tag===`defs`&&(n=e.children)!=null&&n.length?{...e,children:e.children.map(e=>typeof e.attrs.id==`string`&&r&&r.includes(e.attrs.id)?{...e,attrs:{...e.attrs,id:e.attrs.id+t.idSuffix}}:e)}:e}function E(){return Math.random().toString(36).substring(2,8)}S.displayName=`UniverIcon`;let D={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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 0.866699 5.9313 0.866699H10.069C10.4004 0.866699 10.669 1.13533 10.669 1.4667C10.669 1.79807 10.4004 2.0667 10.069 2.0667H5.9313C5.59993 2.0667 5.3313 1.79807 5.3313 1.4667Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M1.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.64443C14.8999 3.9758 14.6312 4.24443 14.2999 4.24443H1.69985C1.36848 4.24443 1.09985 3.9758 1.09985 3.64443Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M6.12398 8.30171C6.35829 8.0674 6.73819 8.0674 6.97251 8.30171L8.00007 9.32928L9.02764 8.30171C9.26195 8.0674 9.64185 8.0674 9.87617 8.30171C10.1105 8.53603 10.1105 8.91593 9.87617 9.15024L8.8486 10.1778L9.87617 11.2054C10.1105 11.4397 10.1105 11.8196 9.87617 12.0539C9.64185 12.2882 9.26195 12.2882 9.02764 12.0539L8.00007 11.0263L6.97251 12.0539C6.73819 12.2882 6.35829 12.2882 6.12398 12.0539C5.88966 11.8196 5.88966 11.4397 6.12398 11.2054L7.15154 10.1778L6.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`}}]},O=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`delete-icon`,ref:t,icon:D}))});O.displayName=`DeleteIcon`;let k={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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`}}]},A=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`increase-icon`,ref:t,icon:k}))});A.displayName=`IncreaseIcon`;let j={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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 8C4 7.44772 3.55228 7 3 7C2.44772 7 2 7.44772 2 8C2 8.55228 2.44772 9 3 9Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M8 9C8.55228 9 9 8.55228 9 8C9 7.44772 8.55228 7 8 7C7.44772 7 7 7.44772 7 8C7 8.55228 7.44772 9 8 9Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M13 9C13.5523 9 14 8.55228 14 8C14 7.44772 13.5523 7 13 7C12.4477 7 12 7.44772 12 8C12 8.55228 12.4477 9 13 9Z`}}]},M=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`more-horizontal-icon`,ref:t,icon:j}))});M.displayName=`MoreHorizontalIcon`;let N={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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.76813`,strokeLinecap:`round`,strokeWidth:1.2}},{tag:`path`,attrs:{stroke:`currentColor`,d:`M8.91626 6.1311H9.27424`,strokeLinecap:`round`,strokeWidth:1.2}},{tag:`path`,attrs:{stroke:`currentColor`,d:`M3.90454 6.1311H4.26252`,strokeLinecap:`round`,strokeWidth:1.2}}]},P=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`reply-to-comment-icon`,ref:t,icon:N}))});P.displayName=`ReplyToCommentIcon`;let F={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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`}}]},I=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`resolved-icon`,ref:t,icon:F}))});I.displayName=`ResolvedIcon`;let L={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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}}]},R=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`solve-icon`,ref:t,icon:L}))});R.displayName=`SolveIcon`;function z(e){return{id:`d`,body:e,documentStyle:{}}}let B=(0,o.forwardRef)((e,r)=>{var i;let{comment:l,onSave:u,id:d,onCancel:f,autoFocus:p,unitId:m,type:h,editorId:_}=e,v=(0,n.useDependency)(t.ICommandService),y=(0,n.useDependency)(t.LocaleService),[b,x]=(0,o.useState)(!1),S=(0,n.useDependency)(s.IEditorService),C=(0,o.useRef)(null),w=h===t.UniverInstanceType.UNIVER_DOC?t.DOCS_NORMAL_EDITOR_UNIT_ID_KEY:m,[T,E]=(0,o.useState)(()=>{var e,n;return t.BuildTextUtils.transform.getPlainText((e=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e)});(0,o.useEffect)(()=>{var e,n,r;E(t.BuildTextUtils.transform.getPlainText((e=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e));let i=(r=C.current)==null?void 0:r.selectionChange$.subscribe(()=>{var e,n;E(t.BuildTextUtils.transform.getPlainText((e=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e))});return()=>i==null?void 0:i.unsubscribe()},[(i=C.current)==null?void 0:i.selectionChange$]);let D=(0,o.useMemo)(()=>({keyCodes:[{keyCode:n.KeyCode.ENTER}],handler:e=>{e===n.KeyCode.ENTER&&v.executeCommand(s.BreakLineCommand.id)}}),[v]);return(0,o.useImperativeHandle)(r,()=>({reply(e){var t,n;if(!C.current)return;S.focus((t=C.current.getEditorId())==null?``:t);let r=z(e);(n=C.current)==null||n.setDocumentData(r,[{startOffset:r.body.dataStream.length-2,endOffset:r.body.dataStream.length-2,collapsed:!0}])}})),(0,c.jsxs)(`div`,{onClick:e=>e.preventDefault(),children:[(0,c.jsx)(s.RichTextEditor,{className:`univer-w-full`,editorRef:C,editorId:_,autoFocus:p,keyboardEventConfig:D,placeholder:y.t(`threadCommentUI.editor.placeholder`),initialValue:(l==null?void 0:l.text)&&z(l.text),onFocusChange:e=>e&&x(e),isSingle:!1,maxHeight:64,onClickOutside:()=>{setTimeout(()=>{S.focus(w)},30)}}),b?(0,c.jsxs)(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-end univer-gap-2`,children:[(0,c.jsx)(a.Button,{onClick:()=>{var e;f==null||f(),x(!1),(e=C.current)==null||e.replaceText(``,!0),v.executeCommand(g.id)},children:y.t(`threadCommentUI.editor.cancel`)}),(0,c.jsx)(a.Button,{variant:`primary`,disabled:!T,onClick:()=>{if(C.current){let e=t.Tools.deepClone(C.current.getDocumentData().body);x(!1),u==null||u({...l,text:e}),C.current.replaceText(``),setTimeout(()=>{var e,t;(e=C.current)==null||e.setSelectionRanges([]),(t=C.current)==null||t.blur()},10)}},children:y.t(d?`threadCommentUI.editor.save`:`threadCommentUI.editor.reply`)})]}):null]})}),V=e=>{let{dataStream:t,customRanges:n}=e,r=t.endsWith(`\r
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`@univerjs/core`),require(`@univerjs/ui`),require(`rxjs`),require(`@univerjs/thread-comment`),require(`@univerjs/design`),require(`react`),require(`@univerjs/docs-ui`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`@univerjs/core`,`@univerjs/ui`,`rxjs`,`@univerjs/thread-comment`,`@univerjs/design`,`react`,`@univerjs/docs-ui`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.UniverThreadCommentUi={},e.UniverCore,e.UniverUi,e.rxjs,e.UniverThreadComment,e.UniverDesign,e.React,e.UniverDocsUi,e.React))})(this,function(e,t,n,r,i,a,o,s,c){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});function l(e){"@babel/helpers - typeof";return l=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},l(e)}function u(e,t){if(l(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(l(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function d(e){var t=u(e,`string`);return l(t)==`symbol`?t:t+``}function f(e,t,n){return(t=d(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function p(e,t){return function(n,r){t(n,r,e)}}function m(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}let h=class extends t.Disposable{constructor(e,t){super(),this._sidebarService=e,this._univerInstanceService=t,f(this,`_panelVisible`,!1),f(this,`_panelVisible$`,new r.BehaviorSubject(!1)),f(this,`_activeCommentId`,void 0),f(this,`_activeCommentId$`,new r.BehaviorSubject(void 0)),f(this,`panelVisible$`,this._panelVisible$.asObservable()),f(this,`activeCommentId$`,this._activeCommentId$.asObservable()),this._init(),this.disposeWithMe(()=>{this._activeCommentId$.complete(),this._panelVisible$.complete()})}_init(){this.disposeWithMe(this._sidebarService.sidebarOptions$.subscribe(e=>{e.visible||this.setPanelVisible(!1)})),this.disposeWithMe(this._univerInstanceService.getCurrentTypeOfUnit$(t.UniverInstanceType.UNIVER_SHEET).pipe((0,r.filter)(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)}};h=m([p(0,(0,t.Inject)(n.ISidebarService)),p(1,t.IUniverInstanceService)],h);let g={id:`thread-comment-ui.operation.set-active-comment`,type:t.CommandType.OPERATION,handler(e,t){return e.get(h).setActiveComment(t),!0}};var _=`@univerjs/thread-comment-ui`,v=`0.22.1`;let y=`thread-comment-ui.config`;Symbol(y);let b={},x=class extends t.Plugin{constructor(e=b,n,r,i){super(),this._config=e,this._injector=n,this._commandService=r,this._configService=i;let{menu:a,...o}=(0,t.merge)({},b,this._config);a&&this._configService.setConfig(`menu`,a,{merge:!0}),this._configService.setConfig(y,o)}onStarting(){var e;(0,t.mergeOverrideWithDependencies)([[h]],(e=this._config)==null?void 0:e.overrides).forEach(e=>{this._injector.add(e)}),[g].forEach(e=>{this._commandService.registerCommand(e)})}};f(x,`pluginName`,`UNIVER_THREAD_COMMENT_UI_PLUGIN`),f(x,`packageName`,_),f(x,`version`,v),f(x,`type`,t.UniverInstanceType.UNIVER_UNKNOWN),x=m([(0,t.DependentOn)(i.UniverThreadCommentPlugin),p(1,(0,t.Inject)(t.Injector)),p(2,t.ICommandService),p(3,t.IConfigService)],x);function S({ref:e,...t}){let{icon:n,id:r,className:i,extend:a,...s}=t,c=`univerjs-icon univerjs-icon-${r} ${i||``}`.trim(),l=(0,o.useRef)(`_${E()}`);return C(n,`${r}`,{defIds:n.defIds,idSuffix:l.current},{ref:e,className:c,...s},a)}function C(e,t,n,r,i){return(0,o.createElement)(e.tag,{key:t,...w(e,n,i),...r},(T(e,n).children||[]).map((r,a)=>C(r,`${t}-${e.tag}-${a}`,n,void 0,i)))}function w(e,t,n){let r={...e.attrs};n!=null&&n.colorChannel1&&r.fill===`colorChannel1`&&(r.fill=n.colorChannel1),e.tag===`mask`&&r.id&&(r.id+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{e===`mask`&&typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))});let{defIds:i}=t;return!i||i.length===0?r:(e.tag===`use`&&r[`xlink:href`]&&(r[`xlink:href`]+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))}),r)}function T(e,t){var n;let{defIds:r}=t;return!r||r.length===0?e:e.tag===`defs`&&(n=e.children)!=null&&n.length?{...e,children:e.children.map(e=>typeof e.attrs.id==`string`&&r&&r.includes(e.attrs.id)?{...e,attrs:{...e.attrs,id:e.attrs.id+t.idSuffix}}:e)}:e}function E(){return Math.random().toString(36).substring(2,8)}S.displayName=`UniverIcon`;let D={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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 0.866699 5.9313 0.866699H10.069C10.4004 0.866699 10.669 1.13533 10.669 1.4667C10.669 1.79807 10.4004 2.0667 10.069 2.0667H5.9313C5.59993 2.0667 5.3313 1.79807 5.3313 1.4667Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M1.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.64443C14.8999 3.9758 14.6312 4.24443 14.2999 4.24443H1.69985C1.36848 4.24443 1.09985 3.9758 1.09985 3.64443Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M6.12398 8.30171C6.35829 8.0674 6.73819 8.0674 6.97251 8.30171L8.00007 9.32928L9.02764 8.30171C9.26195 8.0674 9.64185 8.0674 9.87617 8.30171C10.1105 8.53603 10.1105 8.91593 9.87617 9.15024L8.8486 10.1778L9.87617 11.2054C10.1105 11.4397 10.1105 11.8196 9.87617 12.0539C9.64185 12.2882 9.26195 12.2882 9.02764 12.0539L8.00007 11.0263L6.97251 12.0539C6.73819 12.2882 6.35829 12.2882 6.12398 12.0539C5.88966 11.8196 5.88966 11.4397 6.12398 11.2054L7.15154 10.1778L6.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`}}]},O=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`delete-icon`,ref:t,icon:D}))});O.displayName=`DeleteIcon`;let k={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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`}}]},A=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`increase-icon`,ref:t,icon:k}))});A.displayName=`IncreaseIcon`;let j={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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 8C4 7.44772 3.55228 7 3 7C2.44772 7 2 7.44772 2 8C2 8.55228 2.44772 9 3 9Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M8 9C8.55228 9 9 8.55228 9 8C9 7.44772 8.55228 7 8 7C7.44772 7 7 7.44772 7 8C7 8.55228 7.44772 9 8 9Z`}},{tag:`path`,attrs:{fill:`currentColor`,d:`M13 9C13.5523 9 14 8.55228 14 8C14 7.44772 13.5523 7 13 7C12.4477 7 12 7.44772 12 8C12 8.55228 12.4477 9 13 9Z`}}]},M=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`more-horizontal-icon`,ref:t,icon:j}))});M.displayName=`MoreHorizontalIcon`;let N={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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.76813`,strokeLinecap:`round`,strokeWidth:1.2}},{tag:`path`,attrs:{stroke:`currentColor`,d:`M8.91626 6.1311H9.27424`,strokeLinecap:`round`,strokeWidth:1.2}},{tag:`path`,attrs:{stroke:`currentColor`,d:`M3.90454 6.1311H4.26252`,strokeLinecap:`round`,strokeWidth:1.2}}]},P=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`reply-to-comment-icon`,ref:t,icon:N}))});P.displayName=`ReplyToCommentIcon`;let F={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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`}}]},I=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`resolved-icon`,ref:t,icon:F}))});I.displayName=`ResolvedIcon`;let L={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,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}}]},R=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(S,Object.assign({},e,{id:`solve-icon`,ref:t,icon:L}))});R.displayName=`SolveIcon`;function z(e){return{id:`d`,body:e,documentStyle:{}}}let B=(0,o.forwardRef)((e,r)=>{var i;let{comment:l,onSave:u,id:d,onCancel:f,autoFocus:p,unitId:m,type:h,editorId:_}=e,v=(0,n.useDependency)(t.ICommandService),y=(0,n.useDependency)(t.LocaleService),[b,x]=(0,o.useState)(!1),S=(0,n.useDependency)(s.IEditorService),C=(0,o.useRef)(null),w=h===t.UniverInstanceType.UNIVER_DOC?t.DOCS_NORMAL_EDITOR_UNIT_ID_KEY:m,[T,E]=(0,o.useState)(()=>{var e,n;return t.BuildTextUtils.transform.getPlainText((e=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e)});(0,o.useEffect)(()=>{var e,n,r;E(t.BuildTextUtils.transform.getPlainText((e=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e));let i=(r=C.current)==null?void 0:r.selectionChange$.subscribe(()=>{var e,n;E(t.BuildTextUtils.transform.getPlainText((e=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e))});return()=>i==null?void 0:i.unsubscribe()},[(i=C.current)==null?void 0:i.selectionChange$]);let D=(0,o.useMemo)(()=>({keyCodes:[{keyCode:n.KeyCode.ENTER}],handler:e=>{e===n.KeyCode.ENTER&&v.executeCommand(s.BreakLineCommand.id)}}),[v]);return(0,o.useImperativeHandle)(r,()=>({reply(e){var t,n;if(!C.current)return;S.focus((t=C.current.getEditorId())==null?``:t);let r=z(e);(n=C.current)==null||n.setDocumentData(r,[{startOffset:r.body.dataStream.length-2,endOffset:r.body.dataStream.length-2,collapsed:!0}])}})),(0,c.jsxs)(`div`,{onClick:e=>e.preventDefault(),children:[(0,c.jsx)(s.RichTextEditor,{className:`univer-w-full`,editorRef:C,editorId:_,autoFocus:p,keyboardEventConfig:D,placeholder:y.t(`threadCommentUI.editor.placeholder`),initialValue:(l==null?void 0:l.text)&&z(l.text),onFocusChange:e=>e&&x(e),isSingle:!1,maxHeight:64,onClickOutside:()=>{setTimeout(()=>{S.focus(w)},30)}}),b?(0,c.jsxs)(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-end univer-gap-2`,children:[(0,c.jsx)(a.Button,{onClick:()=>{var e;f==null||f(),x(!1),(e=C.current)==null||e.replaceText(``,!0),v.executeCommand(g.id)},children:y.t(`threadCommentUI.editor.cancel`)}),(0,c.jsx)(a.Button,{variant:`primary`,disabled:!T,onClick:()=>{if(C.current){let e=t.Tools.deepClone(C.current.getDocumentData().body);x(!1),u==null||u({...l,text:e}),C.current.replaceText(``),setTimeout(()=>{var e,t;(e=C.current)==null||e.setSelectionRanges([]),(t=C.current)==null||t.blur()},10)}},children:y.t(d?`threadCommentUI.editor.save`:`threadCommentUI.editor.reply`)})]}):null]})}),V=e=>{let{dataStream:t,customRanges:n}=e,r=t.endsWith(`\r
 `)?t.length-2:t.length,i=[],a=0;return n==null||n.forEach(e=>{a<e.startIndex&&i.push({type:`text`,content:t.slice(a,e.startIndex)}),i.push({type:`mention`,content:{label:t.slice(e.startIndex,e.endIndex+1),id:e.rangeId}}),a=e.endIndex+1}),i.push({type:`text`,content:t.slice(a,r)}),i},H=e=>{if(!e)return[];let{paragraphs:n=[]}=e;return n.map((r,i)=>V((0,t.getBodySlice)(e,i===0?0:n[i-1].startIndex+1,r.startIndex)))},U=e=>{let n=``,r=[];return e.forEach(e=>{switch(e.type){case`text`:n+=e.content;break;case`mention`:{let i=n.length;n+=e.content.label;let a=n.length-1;r.push({rangeId:e.content.id,rangeType:t.CustomRangeType.MENTION,startIndex:i,endIndex:a,properties:{},wholeEntity:!0});break}default:break}}),n+=`\r
-`,{textRuns:[],paragraphs:[{startIndex:n.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:n.length-1}],dataStream:n,customRanges:r}},W=function(e){return e.CELL=`CELL`,e.PANEL=`PANEL`,e}({}),G=`__mock__`,K=e=>{let{item:r,unitId:s,subUnitId:l,editing:u,onEditingChange:d,onReply:f,resolved:p,isRoot:m,onClose:h,onDeleteComment:g,type:_,threadCommentEditorId:v}=e,y=(0,n.useDependency)(t.ICommandService),b=(0,n.useDependency)(t.LocaleService),x=(0,n.useDependency)(t.UserManagerService),S=x.getUser(r.personId),C=(0,n.useObservable)(x.currentUser$),w=(C==null?void 0:C.userID)===r.personId,T=r.id===G,[E,D]=(0,o.useState)(!1),O=(0,n.useConfigValue)(n.UI_PLUGIN_CONFIG_KEY),k=O==null?void 0:O.avatarFallback;return(0,c.jsxs)(`div`,{className:`univer-relative univer-mb-3 univer-pl-[30px]`,onMouseLeave:()=>D(!1),onMouseEnter:()=>D(!0),children:[(0,c.jsx)(`div`,{className:`univer-absolute univer-left-0 univer-top-0 univer-size-6 univer-rounded-full univer-bg-cover univer-bg-center univer-bg-no-repeat`,style:{backgroundImage:`url(${(S==null?void 0:S.avatar)||k})`}}),S?(0,c.jsxs)(`div`,{className:`univer-mb-1 univer-flex univer-h-6 univer-items-center univer-justify-between`,children:[(0,c.jsx)(`div`,{className:`univer-text-sm univer-font-medium univer-leading-5`,children:(S==null?void 0:S.name)||` `}),(0,c.jsxs)(`div`,{children:[T||p?null:E&&S?(0,c.jsx)(`div`,{className:`univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50`,onClick:()=>f(S),children:(0,c.jsx)(P,{})}):null,w&&!T&&!p?(0,c.jsx)(a.Dropdown,{overlay:(0,c.jsx)(`div`,{className:`univer-rounded-lg`,children:(0,c.jsxs)(`ul`,{className:`univer-m-0 univer-box-border univer-grid univer-list-none univer-p-1.5 univer-text-sm [&_a]:univer-block [&_a]:univer-cursor-pointer [&_a]:univer-rounded [&_a]:univer-px-2 [&_a]:univer-py-1.5 [&_a]:univer-transition-colors`,children:[(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>d==null?void 0:d(!0),children:b.t(`threadCommentUI.item.edit`)})}),(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(g==null?void 0:g(r))!==!1&&(y.executeCommand(m?i.DeleteCommentTreeCommand.id:i.DeleteCommentCommand.id,{unitId:s,subUnitId:l,commentId:r.id}),m&&(h==null||h()))},children:b.t(`threadCommentUI.item.delete`)})})]})}),children:(0,c.jsx)(`div`,{className:`univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50`,children:(0,c.jsx)(M,{})})}):null]})]}):null,(0,c.jsx)(`time`,{className:`univer-mb-1 univer-text-xs/normal univer-text-gray-600 dark:!univer-text-gray-200`,children:r.dT}),u?(0,c.jsx)(B,{type:_,id:r.id,comment:r,onCancel:()=>d==null?void 0:d(!1),autoFocus:!0,unitId:s,subUnitId:l,editorId:v,onSave:({text:e,attachments:t})=>{d==null||d(!1),y.executeCommand(i.UpdateCommentCommand.id,{unitId:s,subUnitId:l,payload:{commentId:r.id,text:e,attachments:t}})}}):(0,c.jsx)(`div`,{className:`univer-text-sm univer-text-gray-900 dark:!univer-text-white`,children:H(r.text).map((e,t)=>(0,c.jsx)(`div`,{className:`univer-break-words`,children:e.map((e,t)=>{switch(e.type){case`mention`:return(0,c.jsxs)(`a`,{className:`univer-text-primary-600`,children:[e.content.label,` `]},t);default:return e.content}})},t))})]})},q=e=>{var s,l,u;let{id:d,unitId:f,subUnitId:p,refStr:m,showEdit:h=!0,onClick:_,showHighlight:v,onClose:y,getSubUnitName:b,location:x,autoFocus:S,onMouseEnter:C,onMouseLeave:w,onAddComment:T,onDeleteComment:E,onResolve:D,type:k,style:A,full:j}=e,M=(0,n.useDependency)(i.ThreadCommentModel),[N,P]=(0,o.useState)(!1),[F,L]=(0,o.useState)(``);(0,n.useObservable)((0,o.useMemo)(()=>M.commentUpdate$.pipe((0,r.debounceTime)(16)),[M]));let z=d?M.getCommentWithChildren(f,p,d):null,V=(0,n.useDependency)(t.ICommandService),H=(0,n.useDependency)(t.UserManagerService),W=z==null?void 0:z.root.resolved,q=(0,n.useObservable)(H.currentUser$),J=(0,o.useRef)(null),Y=[...z?[z.root]:[{id:G,text:{dataStream:`
+`,{textRuns:[],paragraphs:[{startIndex:n.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:n.length-1}],dataStream:n,customRanges:r}},W=function(e){return e.CELL=`CELL`,e.PANEL=`PANEL`,e}({}),G=`__mock__`,K=e=>{let{item:r,unitId:s,subUnitId:l,editing:u,onEditingChange:d,onReply:f,resolved:p,isRoot:m,onClose:h,onDeleteComment:g,type:_,threadCommentEditorId:v}=e,y=(0,n.useDependency)(t.ICommandService),b=(0,n.useDependency)(t.LocaleService),x=(0,n.useDependency)(t.UserManagerService),S=x.getUser(r.personId),C=(0,n.useObservable)(x.currentUser$),w=(C==null?void 0:C.userID)===r.personId,T=r.id===G,[E,D]=(0,o.useState)(!1),O=(0,n.useConfigValue)(n.UI_PLUGIN_CONFIG_KEY),k=O==null?void 0:O.avatarFallback;return(0,c.jsxs)(`div`,{className:`univer-relative univer-mb-3 univer-pl-[30px]`,onMouseLeave:()=>D(!1),onMouseEnter:()=>D(!0),children:[(0,c.jsx)(`div`,{className:`univer-absolute univer-left-0 univer-top-0 univer-size-6 univer-rounded-full univer-bg-cover univer-bg-center univer-bg-no-repeat`,style:{backgroundImage:`url(${(S==null?void 0:S.avatar)||k})`}}),S?(0,c.jsxs)(`div`,{className:`univer-mb-1 univer-flex univer-h-6 univer-items-center univer-justify-between`,children:[(0,c.jsx)(`div`,{className:`univer-text-sm univer-font-medium univer-leading-5`,children:(S==null?void 0:S.name)||` `}),(0,c.jsxs)(`div`,{children:[T||p?null:E&&S?(0,c.jsx)(`div`,{className:`univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800`,onClick:()=>f(S),children:(0,c.jsx)(P,{})}):null,w&&!T&&!p?(0,c.jsx)(a.Dropdown,{overlay:(0,c.jsx)(`div`,{className:`univer-rounded-lg`,children:(0,c.jsxs)(`ul`,{className:`univer-m-0 univer-box-border univer-grid univer-list-none univer-p-1.5 univer-text-sm [&_a]:univer-block [&_a]:univer-cursor-pointer [&_a]:univer-rounded [&_a]:univer-px-2 [&_a]:univer-py-1.5 [&_a]:univer-transition-colors`,children:[(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>d==null?void 0:d(!0),children:b.t(`threadCommentUI.item.edit`)})}),(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(g==null?void 0:g(r))!==!1&&(y.executeCommand(m?i.DeleteCommentTreeCommand.id:i.DeleteCommentCommand.id,{unitId:s,subUnitId:l,commentId:r.id}),m&&(h==null||h()))},children:b.t(`threadCommentUI.item.delete`)})})]})}),children:(0,c.jsx)(`div`,{className:`univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-sm univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800`,children:(0,c.jsx)(M,{})})}):null]})]}):null,(0,c.jsx)(`time`,{className:`univer-mb-1 univer-text-xs/normal univer-text-gray-600 dark:!univer-text-gray-200`,children:r.dT}),u?(0,c.jsx)(B,{type:_,id:r.id,comment:r,onCancel:()=>d==null?void 0:d(!1),autoFocus:!0,unitId:s,subUnitId:l,editorId:v,onSave:({text:e,attachments:t})=>{d==null||d(!1),y.executeCommand(i.UpdateCommentCommand.id,{unitId:s,subUnitId:l,payload:{commentId:r.id,text:e,attachments:t}})}}):(0,c.jsx)(`div`,{className:`univer-text-sm univer-text-gray-900 dark:!univer-text-white`,children:H(r.text).map((e,t)=>(0,c.jsx)(`div`,{className:`univer-break-words`,children:e.map((e,t)=>{switch(e.type){case`mention`:return(0,c.jsxs)(`a`,{className:`univer-text-primary-600`,children:[e.content.label,` `]},t);default:return e.content}})},t))})]})},q=e=>{var s,l,u;let{id:d,unitId:f,subUnitId:p,refStr:m,showEdit:h=!0,onClick:_,showHighlight:v,onClose:y,getSubUnitName:b,location:x,autoFocus:S,onMouseEnter:C,onMouseLeave:w,onAddComment:T,onDeleteComment:E,onResolve:D,type:k,style:A,full:j}=e,M=(0,n.useDependency)(i.ThreadCommentModel),[N,P]=(0,o.useState)(!1),[F,L]=(0,o.useState)(``);(0,n.useObservable)((0,o.useMemo)(()=>M.commentUpdate$.pipe((0,r.debounceTime)(16)),[M]));let z=d?M.getCommentWithChildren(f,p,d):null,V=(0,n.useDependency)(t.ICommandService),H=(0,n.useDependency)(t.UserManagerService),W=z==null?void 0:z.root.resolved,q=(0,n.useObservable)(H.currentUser$),J=(0,o.useRef)(null),Y=[...z?[z.root]:[{id:G,text:{dataStream:`
 \r`},personId:(s=q==null?void 0:q.userID)==null?``:s,ref:m==null?``:m,dT:``,unitId:f,subUnitId:p,threadId:``}],...(l=z==null?void 0:z.children)==null?[]:l],X=(0,o.useRef)(null),ee=e=>{e.stopPropagation(),W?V.executeCommand(g.id,{unitId:f,subUnitId:p,commentId:d}):V.executeCommand(g.id),V.executeCommand(i.ResolveCommentCommand.id,{unitId:f,subUnitId:p,commentId:d,resolved:!W}),D==null||D(!W)},te=e=>{e.stopPropagation(),V.executeCommand(g.id),!(z!=null&&z.root&&(E==null?void 0:E(z.root))===!1)&&(V.executeCommand(i.DeleteCommentTreeCommand.id,{unitId:f,subUnitId:p,commentId:d}),y==null||y())};(0,o.useEffect)(()=>w==null?void 0:w(),[]);let Z=b((u=z==null?void 0:z.root.subUnitId)==null?p:u),ne=h&&!F&&!W,Q=`${m||(z==null?void 0:z.root.ref)||``}${Z?` · `:``}${Z}`,$=`${t.DOCS_COMMENT_EDITOR_UNIT_ID_KEY}_${x}`;return(0,c.jsxs)(`div`,{id:`${x}-${f}-${p}-${d}`,className:(0,a.clsx)(`univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4 dark:!univer-bg-gray-900 dark:!univer-text-white`,a.borderClassName,{"univer-w-[278px]":!j,"univer-w-full":j,"univer-shadow":!W&&(v||N||x===`CELL`)}),style:A,onClick:_,onMouseEnter:()=>{C==null||C(),P(!0)},onMouseLeave:()=>{w==null||w(),P(!1)},children:[!W&&v&&(0,c.jsx)(`div`,{className:`univer-absolute univer-left-0 univer-right-0 univer-top-0 univer-h-1.5 univer-rounded-t-md univer-bg-yellow-400`}),(0,c.jsxs)(`div`,{className:`univer-mb-4 univer-flex univer-flex-row univer-items-center univer-justify-between univer-text-sm univer-leading-5`,children:[(0,c.jsxs)(`div`,{className:`univer-flex univer-flex-1 univer-flex-row univer-items-center univer-overflow-hidden`,children:[(0,c.jsx)(`div`,{className:`univer-mr-2 univer-h-3.5 univer-w-[3px] univer-flex-shrink-0 univer-flex-grow-0 univer-rounded-sm univer-bg-yellow-500`}),(0,c.jsx)(a.Tooltip,{showIfEllipsis:!0,title:Q,children:(0,c.jsx)(`span`,{className:`univer-flex-1 univer-truncate`,children:Q})})]}),!!z&&(0,c.jsxs)(`div`,{className:`univer-flex univer-flex-shrink-0 univer-flex-grow-0 univer-flex-row`,children:[(0,c.jsx)(`div`,{className:(0,a.clsx)(`univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800`,{"univer-text-green-500":W}),onClick:ee,children:W?(0,c.jsx)(I,{}):(0,c.jsx)(R,{})}),(q==null?void 0:q.userID)===z.root.personId?(0,c.jsx)(`div`,{className:`univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-800`,onClick:te,children:(0,c.jsx)(O,{})}):null]})]}),(0,c.jsx)(`div`,{ref:X,className:(0,a.clsx)(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,a.scrollbarClassName),children:Y.map(e=>(0,c.jsx)(K,{unitId:f,subUnitId:p,item:e,isRoot:e.id===(z==null?void 0:z.root.id),editing:F===e.id,resolved:z==null?void 0:z.root.resolved,type:k,threadCommentEditorId:$,onClose:y,onEditingChange:t=>{L(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=J.current)==null||t.reply(U([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:T,onDeleteComment:E},e.id))}),ne&&(0,c.jsx)(`div`,{children:(0,c.jsx)(B,{ref:J,type:k,unitId:f,subUnitId:p,editorId:$,onSave:async({text:e,attachments:n})=>{var r,a;let o={text:e,attachments:n,dT:(0,i.getDT)(),id:(0,t.generateRandomId)(),ref:m,personId:(r=q==null?void 0:q.userID)==null?``:r,parentId:z==null?void 0:z.root.id,unitId:f,subUnitId:p,threadId:(a=z==null?void 0:z.root.threadId)==null?``:a};(T==null?void 0:T(o))!==!1&&(await V.executeCommand(i.AddCommentCommand.id,{unitId:f,subUnitId:p,comment:o}),X.current&&(X.current.scrollTop=X.current.scrollHeight))},autoFocus:S||!z,onCancel:()=>{z||y==null||y()}},`${S}`)})]})};e.SetActiveCommentOperation=g,e.ThreadCommentPanel=e=>{let{unitId:r,subUnitId$:s,type:l,onAdd:u,getSubUnitName:d,onResolve:f,sortComments:p,onItemLeave:m,onItemEnter:_,disableAdd:v,tempComment:y,onAddComment:b,onDeleteComment:x,showComments:S}=e,[C,w]=(0,o.useState)(`all`),[T,E]=(0,o.useState)(`all`),D=(0,n.useDependency)(t.LocaleService),O=(0,n.useDependency)(t.UserManagerService),k=(0,n.useDependency)(i.ThreadCommentModel),[j,M]=(0,o.useState)(()=>k.getUnit(r)),N=(0,n.useObservable)((0,n.useDependency)(h).activeCommentId$),P=(0,n.useObservable)(k.commentUpdate$),F=(0,n.useDependency)(t.ICommandService),I=(0,n.useObservable)(s),L=(0,o.useRef)(!0),R=`PANEL`,z=(0,n.useObservable)(O.currentUser$),B=(0,o.useMemo)(()=>{var e;let t=C===`all`?j:(e=j.filter(e=>e.subUnitId===I))==null?[]:e,n=p==null?(e=>e):p,r=t.map(e=>{var t;return{...e.root,children:(t=e.children)==null?[]:t,users:e.relativeUsers}});if(S){let e=new Map;return r.forEach(t=>{e.set(t.id,t)}),[...S,``].map(t=>e.get(t)).filter(Boolean)}else return n(r)},[S,C,j,p,I]),V=(0,o.useMemo)(()=>[...B.filter(e=>!e.resolved),...B.filter(e=>e.resolved)],[B]),H=(0,o.useMemo)(()=>T===`resolved`?V.filter(e=>e.resolved):T===`unsolved`?V.filter(e=>!e.resolved):T===`concern_me`&&z!=null&&z.userID?V.filter(e=>e==null?void 0:e.users.has(z.userID)):V,[V,z==null?void 0:z.userID,T]),U=y?[y,...H]:H,W=U.filter(e=>!e.resolved),G=U.filter(e=>e.resolved),K=T!==`all`||C!==`all`,J=()=>{E(`all`),w(`all`)};(0,o.useEffect)(()=>{r&&M(k.getUnit(r))},[r,k,P]),(0,o.useEffect)(()=>{var e;if(!N)return;if(!L.current){L.current=!0;return}let{unitId:t,subUnitId:n,commentId:r}=N,i=`${R}-${t}-${n}-${r}`;(e=document.getElementById(i))==null||e.scrollIntoView({block:`center`})},[N]);let Y=e=>(0,c.jsx)(q,{location:R,getSubUnitName:d,id:e.id,unitId:e.unitId,subUnitId:e.subUnitId,refStr:e.ref,type:l,showEdit:(N==null?void 0:N.commentId)===e.id,showHighlight:(N==null?void 0:N.commentId)===e.id,onClick:()=>{L.current=!1,e.resolved?F.executeCommand(g.id):F.executeCommand(g.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>_==null?void 0:_(e),onMouseLeave:()=>m==null?void 0:m(e),onAddComment:b,onDeleteComment:x,onResolve:t=>f==null?void 0:f(e.id,t)},e.id);return(0,c.jsxs)(`div`,{className:`univer-flex univer-min-h-full univer-flex-col univer-pb-3`,children:[(0,c.jsxs)(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-between`,children:[l===t.UniverInstanceType.UNIVER_SHEET?(0,c.jsx)(a.Select,{borderless:!0,value:C,options:[{value:`current`,label:D.t(`threadCommentUI.filter.sheet.current`)},{value:`all`,label:D.t(`threadCommentUI.filter.sheet.all`)}],onChange:w}):null,(0,c.jsx)(a.Select,{borderless:!0,value:T,options:[{value:`all`,label:D.t(`threadCommentUI.filter.status.all`)},{value:`resolved`,label:D.t(`threadCommentUI.filter.status.resolved`)},{value:`unsolved`,label:D.t(`threadCommentUI.filter.status.unsolved`)},{value:`concern_me`,label:D.t(`threadCommentUI.filter.status.concernMe`)}],onChange:E})]}),U.length===0?(0,c.jsxs)(`div`,{className:`univer-flex univer-flex-1 univer-flex-col univer-items-center univer-justify-center univer-text-sm univer-text-gray-600 dark:!univer-text-gray-200`,children:[D.t(`threadCommentUI.panel.empty`),K?(0,c.jsx)(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:(0,c.jsx)(a.Button,{onClick:J,children:D.t(`threadCommentUI.panel.reset`)})}):v?null:(0,c.jsx)(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:(0,c.jsxs)(a.Button,{onClick:u,children:[(0,c.jsx)(A,{className:`univer-mr-1.5`}),D.t(`threadCommentUI.panel.addComment`)]})})]}):(0,c.jsxs)(`div`,{className:`univer-mt-3 univer-flex univer-flex-col univer-gap-3`,children:[W.map(Y),G.length>0&&(0,c.jsx)(`div`,{className:`univer-text-xs`,children:D.t(`threadCommentUI.panel.solved`)}),G.map(Y)]})]})},Object.defineProperty(e,`ThreadCommentPanelService`,{enumerable:!0,get:function(){return h}}),e.ThreadCommentTree=q,e.ThreadCommentTreeLocation=W,Object.defineProperty(e,`UniverThreadCommentUIPlugin`,{enumerable:!0,get:function(){return x}})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@univerjs/thread-comment-ui",
-  "version": "0.22.0",
+  "version": "0.22.1",
   "private": false,
   "description": "Shared thread comment UI components and services for Univer.",
   "author": "DreamNum Co., Ltd. <developer@univer.ai>",
@@ -59,11 +59,11 @@
   },
   "dependencies": {
     "@univerjs/icons": "^1.1.1",
-    "@univerjs/core": "0.22.0",
-    "@univerjs/design": "0.22.0",
-    "@univerjs/docs-ui": "0.22.0",
-    "@univerjs/thread-comment": "0.22.0",
-    "@univerjs/ui": "0.22.0"
+    "@univerjs/core": "0.22.1",
+    "@univerjs/design": "0.22.1",
+    "@univerjs/docs-ui": "0.22.1",
+    "@univerjs/thread-comment": "0.22.1",
+    "@univerjs/ui": "0.22.1"
   },
   "devDependencies": {
     "postcss": "^8.5.14",
@@ -72,7 +72,7 @@
     "tailwindcss": "3.4.18",
     "typescript": "^6.0.3",
     "vitest": "^4.1.5",
-    "@univerjs-infra/shared": "0.22.0"
+    "@univerjs-infra/shared": "0.22.1"
   },
   "scripts": {
     "test": "vitest run",