@univerjs/thread-comment-ui 0.18.0 → 0.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/index.js +4 -55
- package/lib/es/index.js +4 -55
- package/lib/index.js +4 -55
- package/lib/types/commands/operations/comment.operations.d.ts +0 -1
- package/lib/types/index.d.ts +2 -3
- package/lib/types/types/const.d.ts +0 -2
- package/lib/types/views/thread-comment-editor/index.d.ts +1 -0
- package/lib/types/views/thread-comment-tree/index.d.ts +6 -1
- package/lib/umd/index.js +4 -55
- package/package.json +9 -9
package/lib/cjs/index.js
CHANGED
|
@@ -1,55 +1,4 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@univerjs/core`),t=require(`@univerjs/ui`),n=require(`rxjs`),r=require(`@univerjs/thread-comment`),i=require(`@univerjs/design`),a=require(`@univerjs/icons`),o=require(`react`),s=require(`@univerjs/docs-ui`),c=require(`react/jsx-runtime`);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 e.Disposable{constructor(e,t){super(),this._sidebarService=e,this._univerInstanceService=t,f(this,`_panelVisible`,!1),f(this,`_panelVisible$`,new n.BehaviorSubject(!1)),f(this,`_activeCommentId`,void 0),f(this,`_activeCommentId$`,new n.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$(e.UniverInstanceType.UNIVER_SHEET).pipe((0,n.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,e.Inject)(t.ISidebarService)),p(1,e.IUniverInstanceService)],h);const g
|
|
2
|
-
`)?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},
|
|
3
|
-
`,{textRuns:[],paragraphs:[{startIndex:n.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:n.length-1}],dataStream:n,customRanges:r}}
|
|
4
|
-
|
|
5
|
-
univer-bg-center univer-bg-no-repeat
|
|
6
|
-
`,style:{backgroundImage:`url(${(S==null?void 0:S.avatar)||M})`}}),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:[E||m?null:O&&S?(0,c.jsx)(`div`,{className:`
|
|
7
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
8
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
9
|
-
univer-text-base
|
|
10
|
-
hover:univer-bg-gray-50
|
|
11
|
-
`,onClick:()=>p(S),children:(0,c.jsx)(a.ReplyToCommentIcon,{})}):null,w&&!E&&!m?(0,c.jsx)(i.Dropdown,{overlay:(0,c.jsx)(`div`,{className:`univer-rounded-lg`,children:(0,c.jsxs)(`ul`,{className:`
|
|
12
|
-
univer-m-0 univer-box-border univer-grid univer-list-none
|
|
13
|
-
univer-p-1.5 univer-text-sm
|
|
14
|
-
[&_a]:univer-block [&_a]:univer-cursor-pointer
|
|
15
|
-
[&_a]:univer-rounded [&_a]:univer-px-2 [&_a]:univer-py-1.5
|
|
16
|
-
[&_a]:univer-transition-colors
|
|
17
|
-
`,children:[(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>f==null?void 0:f(!0),children:b.t(`threadCommentUI.item.edit`)})}),(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(_==null?void 0:_(s))!==!1&&(y.executeCommand(h?r.DeleteCommentTreeCommand.id:r.DeleteCommentCommand.id,{unitId:l,subUnitId:u,commentId:s.id}),h&&(g==null||g()))},children:b.t(`threadCommentUI.item.delete`)})})]})}),children:(0,c.jsx)(`div`,{className:`
|
|
18
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
19
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
20
|
-
univer-text-base
|
|
21
|
-
hover:univer-bg-gray-50
|
|
22
|
-
`,children:(0,c.jsx)(a.MoreHorizontalIcon,{})})}):null]})]}):null,(0,c.jsx)(`time`,{className:`
|
|
23
|
-
univer-mb-1 univer-text-xs/normal univer-text-gray-600
|
|
24
|
-
dark:!univer-text-gray-200
|
|
25
|
-
`,children:s.dT}),d?(0,c.jsx)(T,{type:v,id:s.id,comment:s,onCancel:()=>f==null?void 0:f(!1),autoFocus:!0,unitId:l,subUnitId:u,onSave:({text:e,attachments:t})=>{f==null||f(!1),y.executeCommand(r.UpdateCommentCommand.id,{unitId:l,subUnitId:u,payload:{commentId:s.id,text:e,attachments:t}})}}):(0,c.jsx)(`div`,{className:`
|
|
26
|
-
univer-text-sm univer-text-gray-900
|
|
27
|
-
dark:!univer-text-white
|
|
28
|
-
`,children:D(s.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))})]})},j=s=>{var l,u,d;let{id:f,unitId:p,subUnitId:m,refStr:h,showEdit:g=!0,onClick:_,showHighlight:y,onClose:b,getSubUnitName:x,prefix:S,autoFocus:C,onMouseEnter:w,onMouseLeave:E,onAddComment:D,onDeleteComment:j,onResolve:M,type:N,style:P,full:F}=s,I=(0,t.useDependency)(r.ThreadCommentModel),[L,R]=(0,o.useState)(!1),[z,B]=(0,o.useState)(``);(0,t.useObservable)((0,o.useMemo)(()=>I.commentUpdate$.pipe((0,n.debounceTime)(16)),[I]));let V=f?I.getCommentWithChildren(p,m,f):null,H=(0,t.useDependency)(e.ICommandService),U=(0,t.useDependency)(e.UserManagerService),W=V==null?void 0:V.root.resolved,G=(0,t.useObservable)(U.currentUser$),K=(0,o.useRef)(null),q=[...V?[V.root]:[{id:k,text:{dataStream:`
|
|
29
|
-
\r`},personId:(l=G==null?void 0:G.userID)==null?``:l,ref:h==null?``:h,dT:``,unitId:p,subUnitId:m,threadId:``}],...(u=V==null?void 0:V.children)==null?[]:u],J=(0,o.useRef)(null),Y=e=>{e.stopPropagation(),W?H.executeCommand(v.id,{unitId:p,subUnitId:m,commentId:f}):H.executeCommand(v.id),H.executeCommand(r.ResolveCommentCommand.id,{unitId:p,subUnitId:m,commentId:f,resolved:!W}),M==null||M(!W)},X=e=>{e.stopPropagation(),H.executeCommand(v.id),!(V!=null&&V.root&&(j==null?void 0:j(V.root))===!1)&&(H.executeCommand(r.DeleteCommentTreeCommand.id,{unitId:p,subUnitId:m,commentId:f}),b==null||b())};(0,o.useEffect)(()=>E==null?void 0:E(),[]);let Z=x((d=V==null?void 0:V.root.subUnitId)==null?m:d),Q=g&&!z&&!W,$=`${h||(V==null?void 0:V.root.ref)||``}${Z?` · `:``}${Z}`;return(0,c.jsxs)(`div`,{id:`${S}-${p}-${m}-${f}`,className:(0,i.clsx)(`
|
|
30
|
-
univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4
|
|
31
|
-
dark:!univer-bg-gray-900 dark:!univer-text-white
|
|
32
|
-
`,i.borderClassName,{"univer-w-[278px]":!F,"univer-w-full":F,"univer-shadow":!W&&(y||L||S===`cell`)}),style:P,onClick:_,onMouseEnter:()=>{w==null||w(),R(!0)},onMouseLeave:()=>{E==null||E(),R(!1)},children:[!W&&y&&(0,c.jsx)(`div`,{className:`
|
|
33
|
-
univer-absolute univer-left-0 univer-right-0 univer-top-0 univer-h-1.5 univer-rounded-t-md
|
|
34
|
-
univer-bg-yellow-400
|
|
35
|
-
`}),(0,c.jsxs)(`div`,{className:`
|
|
36
|
-
univer-mb-4 univer-flex univer-flex-row univer-items-center univer-justify-between univer-text-sm
|
|
37
|
-
univer-leading-5
|
|
38
|
-
`,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:`
|
|
39
|
-
univer-mr-2 univer-h-3.5 univer-w-[3px] univer-flex-shrink-0 univer-flex-grow-0
|
|
40
|
-
univer-rounded-sm univer-bg-yellow-500
|
|
41
|
-
`}),(0,c.jsx)(i.Tooltip,{showIfEllipsis:!0,title:$,children:(0,c.jsx)(`span`,{className:`univer-flex-1 univer-truncate`,children:$})})]}),!!V&&(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,i.clsx)(`
|
|
42
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center
|
|
43
|
-
univer-justify-center univer-rounded-[3px] univer-text-base
|
|
44
|
-
hover:univer-bg-gray-50
|
|
45
|
-
dark:hover:!univer-bg-gray-800
|
|
46
|
-
`,{"univer-text-green-500":W}),onClick:Y,children:W?(0,c.jsx)(a.ResolvedIcon,{}):(0,c.jsx)(a.SolveIcon,{})}),(G==null?void 0:G.userID)===V.root.personId?(0,c.jsx)(`div`,{className:`
|
|
47
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
48
|
-
univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base
|
|
49
|
-
hover:univer-bg-gray-50
|
|
50
|
-
dark:hover:!univer-bg-gray-800
|
|
51
|
-
`,onClick:X,children:(0,c.jsx)(a.DeleteIcon,{})}):null]})]}),(0,c.jsx)(`div`,{ref:J,className:(0,i.clsx)(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,i.scrollbarClassName),children:q.map(e=>(0,c.jsx)(A,{unitId:p,subUnitId:m,item:e,isRoot:e.id===(V==null?void 0:V.root.id),editing:z===e.id,resolved:V==null?void 0:V.root.resolved,type:N,onClose:b,onEditingChange:t=>{B(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=K.current)==null||t.reply(O([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:D,onDeleteComment:j},e.id))}),Q&&(0,c.jsx)(`div`,{children:(0,c.jsx)(T,{ref:K,type:N,unitId:p,subUnitId:m,onSave:async({text:t,attachments:n})=>{if(!(G!=null&&G.userID)||!(V!=null&&V.root))throw Error(`[ThreadCommentTree] No current user or root comment found`);let i={text:t,attachments:n,dT:(0,r.getDT)(),id:(0,e.generateRandomId)(),ref:h,personId:G==null?void 0:G.userID,parentId:V==null?void 0:V.root.id,unitId:p,subUnitId:m,threadId:V==null?void 0:V.root.threadId};(D==null?void 0:D(i))!==!1&&(await H.executeCommand(r.AddCommentCommand.id,{unitId:p,subUnitId:m,comment:i}),J.current&&(J.current.scrollTop=J.current.scrollHeight))},autoFocus:C||!V,onCancel:()=>{V||b==null||b()}},`${C}`)})]})},M=n=>{let{unitId:s,subUnitId$:l,type:u,onAdd:d,getSubUnitName:f,onResolve:p,sortComments:m,onItemLeave:g,onItemEnter:_,disableAdd:y,tempComment:b,onAddComment:x,onDeleteComment:S,showComments:C}=n,[w,T]=(0,o.useState)(`all`),[E,D]=(0,o.useState)(`all`),O=(0,t.useDependency)(e.LocaleService),k=(0,t.useDependency)(e.UserManagerService),A=(0,t.useDependency)(r.ThreadCommentModel),[M,N]=(0,o.useState)(()=>A.getUnit(s)),P=(0,t.useObservable)((0,t.useDependency)(h).activeCommentId$),F=(0,t.useObservable)(A.commentUpdate$),I=(0,t.useDependency)(e.ICommandService),L=(0,t.useObservable)(l),R=(0,o.useRef)(!0),z=`panel`,B=(0,t.useObservable)(k.currentUser$),V=(0,o.useMemo)(()=>{var e;let t=w===`all`?M:(e=M.filter(e=>e.subUnitId===L))==null?[]:e,n=m==null?(e=>e):m,r=t.map(e=>{var t;return{...e.root,children:(t=e.children)==null?[]:t,users:e.relativeUsers}});if(C){let e=new Map;return r.forEach(t=>{e.set(t.id,t)}),[...C,``].map(t=>e.get(t)).filter(Boolean)}else return n(r)},[C,w,M,m,L]),H=(0,o.useMemo)(()=>[...V.filter(e=>!e.resolved),...V.filter(e=>e.resolved)],[V]),U=(0,o.useMemo)(()=>E===`resolved`?H.filter(e=>e.resolved):E===`unsolved`?H.filter(e=>!e.resolved):E===`concern_me`&&B!=null&&B.userID?H.filter(e=>e==null?void 0:e.users.has(B.userID)):H,[H,B==null?void 0:B.userID,E]),W=b?[b,...U]:U,G=W.filter(e=>!e.resolved),K=W.filter(e=>e.resolved),q=E!==`all`||w!==`all`,J=()=>{D(`all`),T(`all`)};(0,o.useEffect)(()=>{s&&N(A.getUnit(s))},[s,A,F]),(0,o.useEffect)(()=>{var e;if(!P)return;if(!R.current){R.current=!0;return}let{unitId:t,subUnitId:n,commentId:r}=P,i=`${z}-${t}-${n}-${r}`;(e=document.getElementById(i))==null||e.scrollIntoView({block:`center`})},[P]);let Y=e=>(0,c.jsx)(j,{prefix:z,getSubUnitName:f,id:e.id,unitId:e.unitId,subUnitId:e.subUnitId,refStr:e.ref,type:u,showEdit:(P==null?void 0:P.commentId)===e.id,showHighlight:(P==null?void 0:P.commentId)===e.id,onClick:()=>{R.current=!1,e.resolved?I.executeCommand(v.id):I.executeCommand(v.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>_==null?void 0:_(e),onMouseLeave:()=>g==null?void 0:g(e),onAddComment:x,onDeleteComment:S,onResolve:t=>p==null?void 0:p(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:[u===e.UniverInstanceType.UNIVER_SHEET?(0,c.jsx)(i.Select,{borderless:!0,value:w,options:[{value:`current`,label:O.t(`threadCommentUI.filter.sheet.current`)},{value:`all`,label:O.t(`threadCommentUI.filter.sheet.all`)}],onChange:T}):null,(0,c.jsx)(i.Select,{borderless:!0,value:E,options:[{value:`all`,label:O.t(`threadCommentUI.filter.status.all`)},{value:`resolved`,label:O.t(`threadCommentUI.filter.status.resolved`)},{value:`unsolved`,label:O.t(`threadCommentUI.filter.status.unsolved`)},{value:`concern_me`,label:O.t(`threadCommentUI.filter.status.concernMe`)}],onChange:D})]}),W.length===0?(0,c.jsxs)(`div`,{className:`
|
|
52
|
-
univer-flex univer-flex-1 univer-flex-col univer-items-center univer-justify-center
|
|
53
|
-
univer-text-sm univer-text-gray-600
|
|
54
|
-
dark:!univer-text-gray-200
|
|
55
|
-
`,children:[O.t(`threadCommentUI.panel.empty`),q?(0,c.jsx)(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:(0,c.jsx)(i.Button,{onClick:J,children:O.t(`threadCommentUI.panel.reset`)})}):y?null:(0,c.jsx)(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:(0,c.jsxs)(i.Button,{onClick:d,children:[(0,c.jsx)(a.IncreaseIcon,{className:`univer-mr-1.5`}),O.t(`threadCommentUI.panel.addComment`)]})})]}):(0,c.jsxs)(`div`,{className:`univer-mt-3 univer-flex univer-flex-col univer-gap-3`,children:[G.map(Y),K.length>0&&(0,c.jsx)(`div`,{className:`univer-text-xs`,children:O.t(`threadCommentUI.panel.solved`)}),K.map(Y)]})]})};exports.SetActiveCommentOperation=v,exports.THREAD_COMMENT_PANEL=g,exports.ThreadCommentPanel=M,Object.defineProperty(exports,`ThreadCommentPanelService`,{enumerable:!0,get:function(){return h}}),exports.ThreadCommentTree=j,exports.ToggleSheetCommentPanelOperation=_,Object.defineProperty(exports,`UniverThreadCommentUIPlugin`,{enumerable:!0,get:function(){return C}});
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@univerjs/core`),t=require(`@univerjs/ui`),n=require(`rxjs`),r=require(`@univerjs/thread-comment`),i=require(`@univerjs/design`),a=require(`@univerjs/icons`),o=require(`react`),s=require(`@univerjs/docs-ui`),c=require(`react/jsx-runtime`);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 e.Disposable{constructor(e,t){super(),this._sidebarService=e,this._univerInstanceService=t,f(this,`_panelVisible`,!1),f(this,`_panelVisible$`,new n.BehaviorSubject(!1)),f(this,`_activeCommentId`,void 0),f(this,`_activeCommentId$`,new n.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$(e.UniverInstanceType.UNIVER_SHEET).pipe((0,n.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,e.Inject)(t.ISidebarService)),p(1,e.IUniverInstanceService)],h);const g={id:`thread-comment-ui.operation.set-active-comment`,type:e.CommandType.OPERATION,handler(e,t){return e.get(h).setActiveComment(t),!0}};var _=`@univerjs/thread-comment-ui`,v=`0.19.0`;const y=`thread-comment-ui.config`;Symbol(y);const b={};let x=class extends e.Plugin{constructor(t=b,n,r,i){super(),this._config=t,this._injector=n,this._commandService=r,this._configService=i;let{menu:a,...o}=(0,e.merge)({},b,this._config);a&&this._configService.setConfig(`menu`,a,{merge:!0}),this._configService.setConfig(y,o)}onStarting(){var t;(0,e.mergeOverrideWithDependencies)([[h]],(t=this._config)==null?void 0:t.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`,e.UniverInstanceType.UNIVER_UNKNOWN),x=m([(0,e.DependentOn)(r.UniverThreadCommentPlugin),p(1,(0,e.Inject)(e.Injector)),p(2,e.ICommandService),p(3,e.IConfigService)],x);function S(e){return{id:`d`,body:e,documentStyle:{}}}const C=(0,o.forwardRef)((n,r)=>{var a;let{comment:l,onSave:u,id:d,onCancel:f,autoFocus:p,unitId:m,type:h,editorId:_}=n,v=(0,t.useDependency)(e.ICommandService),y=(0,t.useDependency)(e.LocaleService),[b,x]=(0,o.useState)(!1),C=(0,t.useDependency)(s.IEditorService),w=(0,o.useRef)(null),T=h===e.UniverInstanceType.UNIVER_DOC?e.DOCS_NORMAL_EDITOR_UNIT_ID_KEY:m,[E,D]=(0,o.useState)(()=>{var t,n;return e.BuildTextUtils.transform.getPlainText((t=(n=w.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t)});(0,o.useEffect)(()=>{var t,n,r;D(e.BuildTextUtils.transform.getPlainText((t=(n=w.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t));let i=(r=w.current)==null?void 0:r.selectionChange$.subscribe(()=>{var t,n;D(e.BuildTextUtils.transform.getPlainText((t=(n=w.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t))});return()=>i==null?void 0:i.unsubscribe()},[(a=w.current)==null?void 0:a.selectionChange$]);let O=(0,o.useMemo)(()=>({keyCodes:[{keyCode:t.KeyCode.ENTER}],handler:e=>{e===t.KeyCode.ENTER&&v.executeCommand(s.BreakLineCommand.id)}}),[v]);return(0,o.useImperativeHandle)(r,()=>({reply(e){var t,n;if(!w.current)return;C.focus((t=w.current.getEditorId())==null?``:t);let r=S(e);(n=w.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:w,editorId:_,autoFocus:p,keyboardEventConfig:O,placeholder:y.t(`threadCommentUI.editor.placeholder`),initialValue:(l==null?void 0:l.text)&&S(l.text),onFocusChange:e=>e&&x(e),isSingle:!1,maxHeight:64,onClickOutside:()=>{setTimeout(()=>{C.focus(T)},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)(i.Button,{onClick:()=>{var e;f==null||f(),x(!1),(e=w.current)==null||e.replaceText(``,!0),v.executeCommand(g.id)},children:y.t(`threadCommentUI.editor.cancel`)}),(0,c.jsx)(i.Button,{variant:`primary`,disabled:!E,onClick:()=>{if(w.current){let t=e.Tools.deepClone(w.current.getDocumentData().body);x(!1),u==null||u({...l,text:t}),w.current.replaceText(``),setTimeout(()=>{var e,t;(e=w.current)==null||e.setSelectionRanges([]),(t=w.current)==null||t.blur()},10)}},children:y.t(d?`threadCommentUI.editor.save`:`threadCommentUI.editor.reply`)})]}):null]})}),w=e=>{let{dataStream:t,customRanges:n}=e,r=t.endsWith(`\r
|
|
2
|
+
`)?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},T=t=>{if(!t)return[];let{paragraphs:n=[]}=t;return n.map((r,i)=>w((0,e.getBodySlice)(t,i===0?0:n[i-1].startIndex+1,r.startIndex)))},E=t=>{let n=``,r=[];return t.forEach(t=>{switch(t.type){case`text`:n+=t.content;break;case`mention`:{let i=n.length;n+=t.content.label;let a=n.length-1;r.push({rangeId:t.content.id,rangeType:e.CustomRangeType.MENTION,startIndex:i,endIndex:a,properties:{},wholeEntity:!0});break}default:break}}),n+=`\r
|
|
3
|
+
`,{textRuns:[],paragraphs:[{startIndex:n.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:n.length-1}],dataStream:n,customRanges:r}};let D=function(e){return e.CELL=`CELL`,e.PANEL=`PANEL`,e}({});const O=`__mock__`,k=n=>{let{item:s,unitId:l,subUnitId:u,editing:d,onEditingChange:f,onReply:p,resolved:m,isRoot:h,onClose:g,onDeleteComment:_,type:v,threadCommentEditorId:y}=n,b=(0,t.useDependency)(e.ICommandService),x=(0,t.useDependency)(e.LocaleService),S=(0,t.useDependency)(e.UserManagerService),w=S.getUser(s.personId),E=(0,t.useObservable)(S.currentUser$),D=(E==null?void 0:E.userID)===s.personId,k=s.id===O,[A,j]=(0,o.useState)(!1),M=(0,t.useConfigValue)(t.UI_PLUGIN_CONFIG_KEY),N=M==null?void 0:M.avatarFallback;return(0,c.jsxs)(`div`,{className:`univer-relative univer-mb-3 univer-pl-[30px]`,onMouseLeave:()=>j(!1),onMouseEnter:()=>j(!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(${(w==null?void 0:w.avatar)||N})`}}),w?(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:(w==null?void 0:w.name)||` `}),(0,c.jsxs)(`div`,{children:[k||m?null:A&&w?(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:()=>p(w),children:(0,c.jsx)(a.ReplyToCommentIcon,{})}):null,D&&!k&&!m?(0,c.jsx)(i.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:()=>f==null?void 0:f(!0),children:x.t(`threadCommentUI.item.edit`)})}),(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(_==null?void 0:_(s))!==!1&&(b.executeCommand(h?r.DeleteCommentTreeCommand.id:r.DeleteCommentCommand.id,{unitId:l,subUnitId:u,commentId:s.id}),h&&(g==null||g()))},children:x.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)(a.MoreHorizontalIcon,{})})}):null]})]}):null,(0,c.jsx)(`time`,{className:`univer-mb-1 univer-text-xs/normal univer-text-gray-600 dark:!univer-text-gray-200`,children:s.dT}),d?(0,c.jsx)(C,{type:v,id:s.id,comment:s,onCancel:()=>f==null?void 0:f(!1),autoFocus:!0,unitId:l,subUnitId:u,editorId:y,onSave:({text:e,attachments:t})=>{f==null||f(!1),b.executeCommand(r.UpdateCommentCommand.id,{unitId:l,subUnitId:u,payload:{commentId:s.id,text:e,attachments:t}})}}):(0,c.jsx)(`div`,{className:`univer-text-sm univer-text-gray-900 dark:!univer-text-white`,children:T(s.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))})]})},A=s=>{var l,u,d;let{id:f,unitId:p,subUnitId:m,refStr:h,showEdit:_=!0,onClick:v,showHighlight:y,onClose:b,getSubUnitName:x,location:S,autoFocus:w,onMouseEnter:T,onMouseLeave:A,onAddComment:j,onDeleteComment:M,onResolve:N,type:P,style:F,full:I}=s,L=(0,t.useDependency)(r.ThreadCommentModel),[R,z]=(0,o.useState)(!1),[B,V]=(0,o.useState)(``);(0,t.useObservable)((0,o.useMemo)(()=>L.commentUpdate$.pipe((0,n.debounceTime)(16)),[L]));let H=f?L.getCommentWithChildren(p,m,f):null,U=(0,t.useDependency)(e.ICommandService),W=(0,t.useDependency)(e.UserManagerService),G=H==null?void 0:H.root.resolved,K=(0,t.useObservable)(W.currentUser$),q=(0,o.useRef)(null),J=[...H?[H.root]:[{id:O,text:{dataStream:`
|
|
4
|
+
\r`},personId:(l=K==null?void 0:K.userID)==null?``:l,ref:h==null?``:h,dT:``,unitId:p,subUnitId:m,threadId:``}],...(u=H==null?void 0:H.children)==null?[]:u],Y=(0,o.useRef)(null),X=e=>{e.stopPropagation(),G?U.executeCommand(g.id,{unitId:p,subUnitId:m,commentId:f}):U.executeCommand(g.id),U.executeCommand(r.ResolveCommentCommand.id,{unitId:p,subUnitId:m,commentId:f,resolved:!G}),N==null||N(!G)},ee=e=>{e.stopPropagation(),U.executeCommand(g.id),!(H!=null&&H.root&&(M==null?void 0:M(H.root))===!1)&&(U.executeCommand(r.DeleteCommentTreeCommand.id,{unitId:p,subUnitId:m,commentId:f}),b==null||b())};(0,o.useEffect)(()=>A==null?void 0:A(),[]);let Z=x((d=H==null?void 0:H.root.subUnitId)==null?m:d),te=_&&!B&&!G,Q=`${h||(H==null?void 0:H.root.ref)||``}${Z?` · `:``}${Z}`,$=`${e.DOCS_COMMENT_EDITOR_UNIT_ID_KEY}_${S}`;return(0,c.jsxs)(`div`,{id:`${S}-${p}-${m}-${f}`,className:(0,i.clsx)(`univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4 dark:!univer-bg-gray-900 dark:!univer-text-white`,i.borderClassName,{"univer-w-[278px]":!I,"univer-w-full":I,"univer-shadow":!G&&(y||R||S===D.CELL)}),style:F,onClick:v,onMouseEnter:()=>{T==null||T(),z(!0)},onMouseLeave:()=>{A==null||A(),z(!1)},children:[!G&&y&&(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)(i.Tooltip,{showIfEllipsis:!0,title:Q,children:(0,c.jsx)(`span`,{className:`univer-flex-1 univer-truncate`,children:Q})})]}),!!H&&(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,i.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":G}),onClick:X,children:G?(0,c.jsx)(a.ResolvedIcon,{}):(0,c.jsx)(a.SolveIcon,{})}),(K==null?void 0:K.userID)===H.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:ee,children:(0,c.jsx)(a.DeleteIcon,{})}):null]})]}),(0,c.jsx)(`div`,{ref:Y,className:(0,i.clsx)(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,i.scrollbarClassName),children:J.map(e=>(0,c.jsx)(k,{unitId:p,subUnitId:m,item:e,isRoot:e.id===(H==null?void 0:H.root.id),editing:B===e.id,resolved:H==null?void 0:H.root.resolved,type:P,threadCommentEditorId:$,onClose:b,onEditingChange:t=>{V(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=q.current)==null||t.reply(E([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:j,onDeleteComment:M},e.id))}),te&&(0,c.jsx)(`div`,{children:(0,c.jsx)(C,{ref:q,type:P,unitId:p,subUnitId:m,editorId:$,onSave:async({text:t,attachments:n})=>{var i,a;let o={text:t,attachments:n,dT:(0,r.getDT)(),id:(0,e.generateRandomId)(),ref:h,personId:(i=K==null?void 0:K.userID)==null?``:i,parentId:H==null?void 0:H.root.id,unitId:p,subUnitId:m,threadId:(a=H==null?void 0:H.root.threadId)==null?``:a};(j==null?void 0:j(o))!==!1&&(await U.executeCommand(r.AddCommentCommand.id,{unitId:p,subUnitId:m,comment:o}),Y.current&&(Y.current.scrollTop=Y.current.scrollHeight))},autoFocus:w||!H,onCancel:()=>{H||b==null||b()}},`${w}`)})]})},j=n=>{let{unitId:s,subUnitId$:l,type:u,onAdd:d,getSubUnitName:f,onResolve:p,sortComments:m,onItemLeave:_,onItemEnter:v,disableAdd:y,tempComment:b,onAddComment:x,onDeleteComment:S,showComments:C}=n,[w,T]=(0,o.useState)(`all`),[E,O]=(0,o.useState)(`all`),k=(0,t.useDependency)(e.LocaleService),j=(0,t.useDependency)(e.UserManagerService),M=(0,t.useDependency)(r.ThreadCommentModel),[N,P]=(0,o.useState)(()=>M.getUnit(s)),F=(0,t.useObservable)((0,t.useDependency)(h).activeCommentId$),I=(0,t.useObservable)(M.commentUpdate$),L=(0,t.useDependency)(e.ICommandService),R=(0,t.useObservable)(l),z=(0,o.useRef)(!0),B=D.PANEL,V=(0,t.useObservable)(j.currentUser$),H=(0,o.useMemo)(()=>{var e;let t=w===`all`?N:(e=N.filter(e=>e.subUnitId===R))==null?[]:e,n=m==null?(e=>e):m,r=t.map(e=>{var t;return{...e.root,children:(t=e.children)==null?[]:t,users:e.relativeUsers}});if(C){let e=new Map;return r.forEach(t=>{e.set(t.id,t)}),[...C,``].map(t=>e.get(t)).filter(Boolean)}else return n(r)},[C,w,N,m,R]),U=(0,o.useMemo)(()=>[...H.filter(e=>!e.resolved),...H.filter(e=>e.resolved)],[H]),W=(0,o.useMemo)(()=>E===`resolved`?U.filter(e=>e.resolved):E===`unsolved`?U.filter(e=>!e.resolved):E===`concern_me`&&V!=null&&V.userID?U.filter(e=>e==null?void 0:e.users.has(V.userID)):U,[U,V==null?void 0:V.userID,E]),G=b?[b,...W]:W,K=G.filter(e=>!e.resolved),q=G.filter(e=>e.resolved),J=E!==`all`||w!==`all`,Y=()=>{O(`all`),T(`all`)};(0,o.useEffect)(()=>{s&&P(M.getUnit(s))},[s,M,I]),(0,o.useEffect)(()=>{var e;if(!F)return;if(!z.current){z.current=!0;return}let{unitId:t,subUnitId:n,commentId:r}=F,i=`${B}-${t}-${n}-${r}`;(e=document.getElementById(i))==null||e.scrollIntoView({block:`center`})},[F]);let X=e=>(0,c.jsx)(A,{location:B,getSubUnitName:f,id:e.id,unitId:e.unitId,subUnitId:e.subUnitId,refStr:e.ref,type:u,showEdit:(F==null?void 0:F.commentId)===e.id,showHighlight:(F==null?void 0:F.commentId)===e.id,onClick:()=>{z.current=!1,e.resolved?L.executeCommand(g.id):L.executeCommand(g.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>v==null?void 0:v(e),onMouseLeave:()=>_==null?void 0:_(e),onAddComment:x,onDeleteComment:S,onResolve:t=>p==null?void 0:p(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:[u===e.UniverInstanceType.UNIVER_SHEET?(0,c.jsx)(i.Select,{borderless:!0,value:w,options:[{value:`current`,label:k.t(`threadCommentUI.filter.sheet.current`)},{value:`all`,label:k.t(`threadCommentUI.filter.sheet.all`)}],onChange:T}):null,(0,c.jsx)(i.Select,{borderless:!0,value:E,options:[{value:`all`,label:k.t(`threadCommentUI.filter.status.all`)},{value:`resolved`,label:k.t(`threadCommentUI.filter.status.resolved`)},{value:`unsolved`,label:k.t(`threadCommentUI.filter.status.unsolved`)},{value:`concern_me`,label:k.t(`threadCommentUI.filter.status.concernMe`)}],onChange:O})]}),G.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:[k.t(`threadCommentUI.panel.empty`),J?(0,c.jsx)(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:(0,c.jsx)(i.Button,{onClick:Y,children:k.t(`threadCommentUI.panel.reset`)})}):y?null:(0,c.jsx)(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:(0,c.jsxs)(i.Button,{onClick:d,children:[(0,c.jsx)(a.IncreaseIcon,{className:`univer-mr-1.5`}),k.t(`threadCommentUI.panel.addComment`)]})})]}):(0,c.jsxs)(`div`,{className:`univer-mt-3 univer-flex univer-flex-col univer-gap-3`,children:[K.map(X),q.length>0&&(0,c.jsx)(`div`,{className:`univer-text-xs`,children:k.t(`threadCommentUI.panel.solved`)}),q.map(X)]})]})};exports.SetActiveCommentOperation=g,exports.ThreadCommentPanel=j,Object.defineProperty(exports,`ThreadCommentPanelService`,{enumerable:!0,get:function(){return h}}),exports.ThreadCommentTree=A,exports.ThreadCommentTreeLocation=D,Object.defineProperty(exports,`UniverThreadCommentUIPlugin`,{enumerable:!0,get:function(){return x}});
|
package/lib/es/index.js
CHANGED
|
@@ -1,55 +1,4 @@
|
|
|
1
|
-
import{BuildTextUtils as e,CommandType as t,CustomRangeType as n,DOCS_COMMENT_EDITOR_UNIT_ID_KEY as r,DOCS_NORMAL_EDITOR_UNIT_ID_KEY as i,DependentOn as a,Disposable as o,ICommandService as s,IConfigService as c,IUniverInstanceService as l,Inject as u,Injector as d,LocaleService as f,Plugin as p,Tools as m,UniverInstanceType as h,UserManagerService as g,generateRandomId as _,getBodySlice as v,merge as y,mergeOverrideWithDependencies as b}from"@univerjs/core";import{ISidebarService as x,KeyCode as S,UI_PLUGIN_CONFIG_KEY as C,useConfigValue as w,useDependency as T,useObservable as E}from"@univerjs/ui";import{BehaviorSubject as D,debounceTime as O,filter as k}from"rxjs";import{AddCommentCommand as A,DeleteCommentCommand as
|
|
2
|
-
`)?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},
|
|
3
|
-
`,{textRuns:[],paragraphs:[{startIndex:t.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:t.length-1}],dataStream:t,customRanges:r}}
|
|
4
|
-
|
|
5
|
-
univer-bg-center univer-bg-no-repeat
|
|
6
|
-
`,style:{backgroundImage:`url(${(v==null?void 0:v.avatar)||k})`}}),v?q(`div`,{className:`univer-mb-1 univer-flex univer-h-6 univer-items-center univer-justify-between`,children:[K(`div`,{className:`univer-text-sm univer-font-medium univer-leading-5`,children:(v==null?void 0:v.name)||` `}),q(`div`,{children:[x||c?null:S&&v?K(`div`,{className:`
|
|
7
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
8
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
9
|
-
univer-text-base
|
|
10
|
-
hover:univer-bg-gray-50
|
|
11
|
-
`,onClick:()=>o(v),children:K(V,{})}):null,b&&!x&&!c?K(I,{overlay:K(`div`,{className:`univer-rounded-lg`,children:q(`ul`,{className:`
|
|
12
|
-
univer-m-0 univer-box-border univer-grid univer-list-none
|
|
13
|
-
univer-p-1.5 univer-text-sm
|
|
14
|
-
[&_a]:univer-block [&_a]:univer-cursor-pointer
|
|
15
|
-
[&_a]:univer-rounded [&_a]:univer-px-2 [&_a]:univer-py-1.5
|
|
16
|
-
[&_a]:univer-transition-colors
|
|
17
|
-
`,children:[K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>a==null?void 0:a(!0),children:h.t(`threadCommentUI.item.edit`)})}),K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(d==null?void 0:d(t))!==!1&&(m.executeCommand(l?j.id:ee.id,{unitId:n,subUnitId:r,commentId:t.id}),l&&(u==null||u()))},children:h.t(`threadCommentUI.item.delete`)})})]})}),children:K(`div`,{className:`
|
|
18
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
19
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
20
|
-
univer-text-base
|
|
21
|
-
hover:univer-bg-gray-50
|
|
22
|
-
`,children:K(B,{})})}):null]})]}):null,K(`time`,{className:`
|
|
23
|
-
univer-mb-1 univer-text-xs/normal univer-text-gray-600
|
|
24
|
-
dark:!univer-text-gray-200
|
|
25
|
-
`,children:t.dT}),i?K(we,{type:p,id:t.id,comment:t,onCancel:()=>a==null?void 0:a(!1),autoFocus:!0,unitId:n,subUnitId:r,onSave:({text:e,attachments:i})=>{a==null||a(!1),m.executeCommand(N.id,{unitId:n,subUnitId:r,payload:{commentId:t.id,text:e,attachments:i}})}}):K(`div`,{className:`
|
|
26
|
-
univer-text-sm univer-text-gray-900
|
|
27
|
-
dark:!univer-text-white
|
|
28
|
-
`,children:Ee(t.text).map((e,t)=>K(`div`,{className:`univer-break-words`,children:e.map((e,t)=>{switch(e.type){case`mention`:return q(`a`,{className:`univer-text-primary-600`,children:[e.content.label,` `]},t);default:return e.content}})},t))})]})},Ae=e=>{var t,n,r;let{id:i,unitId:a,subUnitId:o,refStr:c,showEdit:l=!0,onClick:u,showHighlight:d,onClose:f,getSubUnitName:p,prefix:m,autoFocus:h,onMouseEnter:v,onMouseLeave:y,onAddComment:b,onDeleteComment:x,onResolve:S,type:C,style:w,full:D}=e,k=T(ne),[ee,M]=W(!1),[N,F]=W(``);E(U(()=>k.commentUpdate$.pipe(O(16)),[k]));let I=i?k.getCommentWithChildren(a,o,i):null,L=T(s),oe=T(g),B=I==null?void 0:I.root.resolved,V=E(oe.currentUser$),le=de(null),ue=[...I?[I.root]:[{id:Oe,text:{dataStream:`
|
|
29
|
-
\r`},personId:(t=V==null?void 0:V.userID)==null?``:t,ref:c==null?``:c,dT:``,unitId:a,subUnitId:o,threadId:``}],...(n=I==null?void 0:I.children)==null?[]:n],G=de(null),fe=e=>{e.stopPropagation(),B?L.executeCommand(Q.id,{unitId:a,subUnitId:o,commentId:i}):L.executeCommand(Q.id),L.executeCommand(te.id,{unitId:a,subUnitId:o,commentId:i,resolved:!B}),S==null||S(!B)},pe=e=>{e.stopPropagation(),L.executeCommand(Q.id),!(I!=null&&I.root&&(x==null?void 0:x(I.root))===!1)&&(L.executeCommand(j.id,{unitId:a,subUnitId:o,commentId:i}),f==null||f())};H(()=>y==null?void 0:y(),[]);let J=p((r=I==null?void 0:I.root.subUnitId)==null?o:r),me=l&&!N&&!B,he=`${c||(I==null?void 0:I.root.ref)||``}${J?` · `:``}${J}`;return q(`div`,{id:`${m}-${a}-${o}-${i}`,className:z(`
|
|
30
|
-
univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4
|
|
31
|
-
dark:!univer-bg-gray-900 dark:!univer-text-white
|
|
32
|
-
`,re,{"univer-w-[278px]":!D,"univer-w-full":D,"univer-shadow":!B&&(d||ee||m===`cell`)}),style:w,onClick:u,onMouseEnter:()=>{v==null||v(),M(!0)},onMouseLeave:()=>{y==null||y(),M(!1)},children:[!B&&d&&K(`div`,{className:`
|
|
33
|
-
univer-absolute univer-left-0 univer-right-0 univer-top-0 univer-h-1.5 univer-rounded-t-md
|
|
34
|
-
univer-bg-yellow-400
|
|
35
|
-
`}),q(`div`,{className:`
|
|
36
|
-
univer-mb-4 univer-flex univer-flex-row univer-items-center univer-justify-between univer-text-sm
|
|
37
|
-
univer-leading-5
|
|
38
|
-
`,children:[q(`div`,{className:`univer-flex univer-flex-1 univer-flex-row univer-items-center univer-overflow-hidden`,children:[K(`div`,{className:`
|
|
39
|
-
univer-mr-2 univer-h-3.5 univer-w-[3px] univer-flex-shrink-0 univer-flex-grow-0
|
|
40
|
-
univer-rounded-sm univer-bg-yellow-500
|
|
41
|
-
`}),K(R,{showIfEllipsis:!0,title:he,children:K(`span`,{className:`univer-flex-1 univer-truncate`,children:he})})]}),!!I&&q(`div`,{className:`univer-flex univer-flex-shrink-0 univer-flex-grow-0 univer-flex-row`,children:[K(`div`,{className:z(`
|
|
42
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center
|
|
43
|
-
univer-justify-center univer-rounded-[3px] univer-text-base
|
|
44
|
-
hover:univer-bg-gray-50
|
|
45
|
-
dark:hover:!univer-bg-gray-800
|
|
46
|
-
`,{"univer-text-green-500":B}),onClick:fe,children:K(B?se:ce,{})}),(V==null?void 0:V.userID)===I.root.personId?K(`div`,{className:`
|
|
47
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
48
|
-
univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base
|
|
49
|
-
hover:univer-bg-gray-50
|
|
50
|
-
dark:hover:!univer-bg-gray-800
|
|
51
|
-
`,onClick:pe,children:K(ae,{})}):null]})]}),K(`div`,{ref:G,className:z(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,ie),children:ue.map(e=>K(ke,{unitId:a,subUnitId:o,item:e,isRoot:e.id===(I==null?void 0:I.root.id),editing:N===e.id,resolved:I==null?void 0:I.root.resolved,type:C,onClose:f,onEditingChange:t=>{F(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=le.current)==null||t.reply(De([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:b,onDeleteComment:x},e.id))}),me&&K(`div`,{children:K(we,{ref:le,type:C,unitId:a,subUnitId:o,onSave:async({text:e,attachments:t})=>{if(!(V!=null&&V.userID)||!(I!=null&&I.root))throw Error(`[ThreadCommentTree] No current user or root comment found`);let n={text:e,attachments:t,dT:P(),id:_(),ref:c,personId:V==null?void 0:V.userID,parentId:I==null?void 0:I.root.id,unitId:a,subUnitId:o,threadId:I==null?void 0:I.root.threadId};(b==null?void 0:b(n))!==!1&&(await L.executeCommand(A.id,{unitId:a,subUnitId:o,comment:n}),G.current&&(G.current.scrollTop=G.current.scrollHeight))},autoFocus:h||!I,onCancel:()=>{I||f==null||f()}},`${h}`)})]})},je=e=>{let{unitId:t,subUnitId$:n,type:r,onAdd:i,getSubUnitName:a,onResolve:o,sortComments:c,onItemLeave:l,onItemEnter:u,disableAdd:d,tempComment:p,onAddComment:m,onDeleteComment:_,showComments:v}=e,[y,b]=W(`all`),[x,S]=W(`all`),C=T(f),w=T(g),D=T(ne),[O,k]=W(()=>D.getUnit(t)),A=E(T(Z).activeCommentId$),ee=E(D.commentUpdate$),j=T(s),te=E(n),M=de(!0),N=`panel`,P=E(w.currentUser$),I=U(()=>{var e;let t=y===`all`?O:(e=O.filter(e=>e.subUnitId===te))==null?[]:e,n=c==null?(e=>e):c,r=t.map(e=>{var t;return{...e.root,children:(t=e.children)==null?[]:t,users:e.relativeUsers}});if(v){let e=new Map;return r.forEach(t=>{e.set(t.id,t)}),[...v,``].map(t=>e.get(t)).filter(Boolean)}else return n(r)},[v,y,O,c,te]),R=U(()=>[...I.filter(e=>!e.resolved),...I.filter(e=>e.resolved)],[I]),re=U(()=>x===`resolved`?R.filter(e=>e.resolved):x===`unsolved`?R.filter(e=>!e.resolved):x===`concern_me`&&P!=null&&P.userID?R.filter(e=>e==null?void 0:e.users.has(P.userID)):R,[R,P==null?void 0:P.userID,x]),z=p?[p,...re]:re,ie=z.filter(e=>!e.resolved),ae=z.filter(e=>e.resolved),B=x!==`all`||y!==`all`,V=()=>{S(`all`),b(`all`)};H(()=>{t&&k(D.getUnit(t))},[t,D,ee]),H(()=>{var e;if(!A)return;if(!M.current){M.current=!0;return}let{unitId:t,subUnitId:n,commentId:r}=A,i=`${N}-${t}-${n}-${r}`;(e=document.getElementById(i))==null||e.scrollIntoView({block:`center`})},[A]);let se=e=>K(Ae,{prefix:N,getSubUnitName:a,id:e.id,unitId:e.unitId,subUnitId:e.subUnitId,refStr:e.ref,type:r,showEdit:(A==null?void 0:A.commentId)===e.id,showHighlight:(A==null?void 0:A.commentId)===e.id,onClick:()=>{M.current=!1,e.resolved?j.executeCommand(Q.id):j.executeCommand(Q.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>u==null?void 0:u(e),onMouseLeave:()=>l==null?void 0:l(e),onAddComment:m,onDeleteComment:_,onResolve:t=>o==null?void 0:o(e.id,t)},e.id);return q(`div`,{className:`univer-flex univer-min-h-full univer-flex-col univer-pb-3`,children:[q(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-between`,children:[r===h.UNIVER_SHEET?K(L,{borderless:!0,value:y,options:[{value:`current`,label:C.t(`threadCommentUI.filter.sheet.current`)},{value:`all`,label:C.t(`threadCommentUI.filter.sheet.all`)}],onChange:b}):null,K(L,{borderless:!0,value:x,options:[{value:`all`,label:C.t(`threadCommentUI.filter.status.all`)},{value:`resolved`,label:C.t(`threadCommentUI.filter.status.resolved`)},{value:`unsolved`,label:C.t(`threadCommentUI.filter.status.unsolved`)},{value:`concern_me`,label:C.t(`threadCommentUI.filter.status.concernMe`)}],onChange:S})]}),z.length===0?q(`div`,{className:`
|
|
52
|
-
univer-flex univer-flex-1 univer-flex-col univer-items-center univer-justify-center
|
|
53
|
-
univer-text-sm univer-text-gray-600
|
|
54
|
-
dark:!univer-text-gray-200
|
|
55
|
-
`,children:[C.t(`threadCommentUI.panel.empty`),B?K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:K(F,{onClick:V,children:C.t(`threadCommentUI.panel.reset`)})}):d?null:K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:q(F,{onClick:i,children:[K(oe,{className:`univer-mr-1.5`}),C.t(`threadCommentUI.panel.addComment`)]})})]}):q(`div`,{className:`univer-mt-3 univer-flex univer-flex-col univer-gap-3`,children:[ie.map(se),ae.length>0&&K(`div`,{className:`univer-text-xs`,children:C.t(`threadCommentUI.panel.solved`)}),ae.map(se)]})]})};export{Q as SetActiveCommentOperation,_e as THREAD_COMMENT_PANEL,je as ThreadCommentPanel,Z as ThreadCommentPanelService,Ae as ThreadCommentTree,ve as ToggleSheetCommentPanelOperation,$ as UniverThreadCommentUIPlugin};
|
|
1
|
+
import{BuildTextUtils as e,CommandType as t,CustomRangeType as n,DOCS_COMMENT_EDITOR_UNIT_ID_KEY as r,DOCS_NORMAL_EDITOR_UNIT_ID_KEY as i,DependentOn as a,Disposable as o,ICommandService as s,IConfigService as c,IUniverInstanceService as l,Inject as u,Injector as d,LocaleService as f,Plugin as p,Tools as m,UniverInstanceType as h,UserManagerService as g,generateRandomId as _,getBodySlice as v,merge as y,mergeOverrideWithDependencies as b}from"@univerjs/core";import{ISidebarService as x,KeyCode as S,UI_PLUGIN_CONFIG_KEY as C,useConfigValue as w,useDependency as T,useObservable as E}from"@univerjs/ui";import{BehaviorSubject as D,debounceTime as O,filter as k}from"rxjs";import{AddCommentCommand as A,DeleteCommentCommand as j,DeleteCommentTreeCommand as ee,ResolveCommentCommand as te,ThreadCommentModel as ne,UniverThreadCommentPlugin as M,UpdateCommentCommand as N,getDT as P}from"@univerjs/thread-comment";import{Button as F,Dropdown as I,Select as L,Tooltip as R,borderClassName as re,clsx as z,scrollbarClassName as ie}from"@univerjs/design";import{DeleteIcon as ae,IncreaseIcon as B,MoreHorizontalIcon as oe,ReplyToCommentIcon as V,ResolvedIcon as se,SolveIcon as ce}from"@univerjs/icons";import{forwardRef as H,useEffect as le,useImperativeHandle as ue,useMemo as U,useRef as de,useState as W}from"react";import{BreakLineCommand as fe,IEditorService as G,RichTextEditor as pe}from"@univerjs/docs-ui";import{jsx as K,jsxs as q}from"react/jsx-runtime";function J(e){"@babel/helpers - typeof";return J=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},J(e)}function me(e,t){if(J(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(J(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function he(e){var t=me(e,`string`);return J(t)==`symbol`?t:t+``}function Y(e,t,n){return(t=he(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function X(e,t){return function(n,r){t(n,r,e)}}function ge(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 Z=class extends o{constructor(e,t){super(),this._sidebarService=e,this._univerInstanceService=t,Y(this,`_panelVisible`,!1),Y(this,`_panelVisible$`,new D(!1)),Y(this,`_activeCommentId`,void 0),Y(this,`_activeCommentId$`,new D(void 0)),Y(this,`panelVisible$`,this._panelVisible$.asObservable()),Y(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$(h.UNIVER_SHEET).pipe(k(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)}};Z=ge([X(0,u(x)),X(1,l)],Z);const Q={id:`thread-comment-ui.operation.set-active-comment`,type:t.OPERATION,handler(e,t){return e.get(Z).setActiveComment(t),!0}};var _e=`@univerjs/thread-comment-ui`,ve=`0.19.0`;const ye=`thread-comment-ui.config`;Symbol(ye);const be={};let $=class extends p{constructor(e=be,t,n,r){super(),this._config=e,this._injector=t,this._commandService=n,this._configService=r;let{menu:i,...a}=y({},be,this._config);i&&this._configService.setConfig(`menu`,i,{merge:!0}),this._configService.setConfig(ye,a)}onStarting(){var e;b([[Z]],(e=this._config)==null?void 0:e.overrides).forEach(e=>{this._injector.add(e)}),[Q].forEach(e=>{this._commandService.registerCommand(e)})}};Y($,`pluginName`,`UNIVER_THREAD_COMMENT_UI_PLUGIN`),Y($,`packageName`,_e),Y($,`version`,ve),Y($,`type`,h.UNIVER_UNKNOWN),$=ge([a(M),X(1,u(d)),X(2,s),X(3,c)],$);function xe(e){return{id:`d`,body:e,documentStyle:{}}}const Se=H((t,n)=>{var r;let{comment:a,onSave:o,id:c,onCancel:l,autoFocus:u,unitId:d,type:p,editorId:g}=t,_=T(s),v=T(f),[y,b]=W(!1),x=T(G),C=de(null),w=p===h.UNIVER_DOC?i:d,[E,D]=W(()=>{var t,n;return e.transform.getPlainText((t=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t)});le(()=>{var t,n,r;D(e.transform.getPlainText((t=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t));let i=(r=C.current)==null?void 0:r.selectionChange$.subscribe(()=>{var t,n;D(e.transform.getPlainText((t=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t))});return()=>i==null?void 0:i.unsubscribe()},[(r=C.current)==null?void 0:r.selectionChange$]);let O=U(()=>({keyCodes:[{keyCode:S.ENTER}],handler:e=>{e===S.ENTER&&_.executeCommand(fe.id)}}),[_]);return ue(n,()=>({reply(e){var t,n;if(!C.current)return;x.focus((t=C.current.getEditorId())==null?``:t);let r=xe(e);(n=C.current)==null||n.setDocumentData(r,[{startOffset:r.body.dataStream.length-2,endOffset:r.body.dataStream.length-2,collapsed:!0}])}})),q(`div`,{onClick:e=>e.preventDefault(),children:[K(pe,{className:`univer-w-full`,editorRef:C,editorId:g,autoFocus:u,keyboardEventConfig:O,placeholder:v.t(`threadCommentUI.editor.placeholder`),initialValue:(a==null?void 0:a.text)&&xe(a.text),onFocusChange:e=>e&&b(e),isSingle:!1,maxHeight:64,onClickOutside:()=>{setTimeout(()=>{x.focus(w)},30)}}),y?q(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-end univer-gap-2`,children:[K(F,{onClick:()=>{var e;l==null||l(),b(!1),(e=C.current)==null||e.replaceText(``,!0),_.executeCommand(Q.id)},children:v.t(`threadCommentUI.editor.cancel`)}),K(F,{variant:`primary`,disabled:!E,onClick:()=>{if(C.current){let e=m.deepClone(C.current.getDocumentData().body);b(!1),o==null||o({...a,text:e}),C.current.replaceText(``),setTimeout(()=>{var e,t;(e=C.current)==null||e.setSelectionRanges([]),(t=C.current)==null||t.blur()},10)}},children:v.t(c?`threadCommentUI.editor.save`:`threadCommentUI.editor.reply`)})]}):null]})}),Ce=e=>{let{dataStream:t,customRanges:n}=e,r=t.endsWith(`\r
|
|
2
|
+
`)?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},we=e=>{if(!e)return[];let{paragraphs:t=[]}=e;return t.map((n,r)=>Ce(v(e,r===0?0:t[r-1].startIndex+1,n.startIndex)))},Te=e=>{let t=``,r=[];return e.forEach(e=>{switch(e.type){case`text`:t+=e.content;break;case`mention`:{let i=t.length;t+=e.content.label;let a=t.length-1;r.push({rangeId:e.content.id,rangeType:n.MENTION,startIndex:i,endIndex:a,properties:{},wholeEntity:!0});break}default:break}}),t+=`\r
|
|
3
|
+
`,{textRuns:[],paragraphs:[{startIndex:t.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:t.length-1}],dataStream:t,customRanges:r}};let Ee=function(e){return e.CELL=`CELL`,e.PANEL=`PANEL`,e}({});const De=`__mock__`,Oe=e=>{let{item:t,unitId:n,subUnitId:r,editing:i,onEditingChange:a,onReply:o,resolved:c,isRoot:l,onClose:u,onDeleteComment:d,type:p,threadCommentEditorId:m}=e,h=T(s),_=T(f),v=T(g),y=v.getUser(t.personId),b=E(v.currentUser$),x=(b==null?void 0:b.userID)===t.personId,S=t.id===De,[D,O]=W(!1),k=w(C),A=k==null?void 0:k.avatarFallback;return q(`div`,{className:`univer-relative univer-mb-3 univer-pl-[30px]`,onMouseLeave:()=>O(!1),onMouseEnter:()=>O(!0),children:[K(`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(${(y==null?void 0:y.avatar)||A})`}}),y?q(`div`,{className:`univer-mb-1 univer-flex univer-h-6 univer-items-center univer-justify-between`,children:[K(`div`,{className:`univer-text-sm univer-font-medium univer-leading-5`,children:(y==null?void 0:y.name)||` `}),q(`div`,{children:[S||c?null:D&&y?K(`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:()=>o(y),children:K(V,{})}):null,x&&!S&&!c?K(I,{overlay:K(`div`,{className:`univer-rounded-lg`,children:q(`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:[K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>a==null?void 0:a(!0),children:_.t(`threadCommentUI.item.edit`)})}),K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(d==null?void 0:d(t))!==!1&&(h.executeCommand(l?ee.id:j.id,{unitId:n,subUnitId:r,commentId:t.id}),l&&(u==null||u()))},children:_.t(`threadCommentUI.item.delete`)})})]})}),children:K(`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:K(oe,{})})}):null]})]}):null,K(`time`,{className:`univer-mb-1 univer-text-xs/normal univer-text-gray-600 dark:!univer-text-gray-200`,children:t.dT}),i?K(Se,{type:p,id:t.id,comment:t,onCancel:()=>a==null?void 0:a(!1),autoFocus:!0,unitId:n,subUnitId:r,editorId:m,onSave:({text:e,attachments:i})=>{a==null||a(!1),h.executeCommand(N.id,{unitId:n,subUnitId:r,payload:{commentId:t.id,text:e,attachments:i}})}}):K(`div`,{className:`univer-text-sm univer-text-gray-900 dark:!univer-text-white`,children:we(t.text).map((e,t)=>K(`div`,{className:`univer-break-words`,children:e.map((e,t)=>{switch(e.type){case`mention`:return q(`a`,{className:`univer-text-primary-600`,children:[e.content.label,` `]},t);default:return e.content}})},t))})]})},ke=e=>{var t,n,i;let{id:a,unitId:o,subUnitId:c,refStr:l,showEdit:u=!0,onClick:d,showHighlight:f,onClose:p,getSubUnitName:m,location:h,autoFocus:v,onMouseEnter:y,onMouseLeave:b,onAddComment:x,onDeleteComment:S,onResolve:C,type:w,style:D,full:k}=e,j=T(ne),[M,N]=W(!1),[F,I]=W(``);E(U(()=>j.commentUpdate$.pipe(O(16)),[j]));let L=a?j.getCommentWithChildren(o,c,a):null,B=T(s),oe=T(g),V=L==null?void 0:L.root.resolved,H=E(oe.currentUser$),ue=de(null),fe=[...L?[L.root]:[{id:De,text:{dataStream:`
|
|
4
|
+
\r`},personId:(t=H==null?void 0:H.userID)==null?``:t,ref:l==null?``:l,dT:``,unitId:o,subUnitId:c,threadId:``}],...(n=L==null?void 0:L.children)==null?[]:n],G=de(null),pe=e=>{e.stopPropagation(),V?B.executeCommand(Q.id,{unitId:o,subUnitId:c,commentId:a}):B.executeCommand(Q.id),B.executeCommand(te.id,{unitId:o,subUnitId:c,commentId:a,resolved:!V}),C==null||C(!V)},J=e=>{e.stopPropagation(),B.executeCommand(Q.id),!(L!=null&&L.root&&(S==null?void 0:S(L.root))===!1)&&(B.executeCommand(ee.id,{unitId:o,subUnitId:c,commentId:a}),p==null||p())};le(()=>b==null?void 0:b(),[]);let me=m((i=L==null?void 0:L.root.subUnitId)==null?c:i),he=u&&!F&&!V,Y=`${l||(L==null?void 0:L.root.ref)||``}${me?` · `:``}${me}`,X=`${r}_${h}`;return q(`div`,{id:`${h}-${o}-${c}-${a}`,className:z(`univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4 dark:!univer-bg-gray-900 dark:!univer-text-white`,re,{"univer-w-[278px]":!k,"univer-w-full":k,"univer-shadow":!V&&(f||M||h===Ee.CELL)}),style:D,onClick:d,onMouseEnter:()=>{y==null||y(),N(!0)},onMouseLeave:()=>{b==null||b(),N(!1)},children:[!V&&f&&K(`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`}),q(`div`,{className:`univer-mb-4 univer-flex univer-flex-row univer-items-center univer-justify-between univer-text-sm univer-leading-5`,children:[q(`div`,{className:`univer-flex univer-flex-1 univer-flex-row univer-items-center univer-overflow-hidden`,children:[K(`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`}),K(R,{showIfEllipsis:!0,title:Y,children:K(`span`,{className:`univer-flex-1 univer-truncate`,children:Y})})]}),!!L&&q(`div`,{className:`univer-flex univer-flex-shrink-0 univer-flex-grow-0 univer-flex-row`,children:[K(`div`,{className:z(`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":V}),onClick:pe,children:K(V?se:ce,{})}),(H==null?void 0:H.userID)===L.root.personId?K(`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:J,children:K(ae,{})}):null]})]}),K(`div`,{ref:G,className:z(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,ie),children:fe.map(e=>K(Oe,{unitId:o,subUnitId:c,item:e,isRoot:e.id===(L==null?void 0:L.root.id),editing:F===e.id,resolved:L==null?void 0:L.root.resolved,type:w,threadCommentEditorId:X,onClose:p,onEditingChange:t=>{I(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=ue.current)==null||t.reply(Te([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:x,onDeleteComment:S},e.id))}),he&&K(`div`,{children:K(Se,{ref:ue,type:w,unitId:o,subUnitId:c,editorId:X,onSave:async({text:e,attachments:t})=>{var n,r;let i={text:e,attachments:t,dT:P(),id:_(),ref:l,personId:(n=H==null?void 0:H.userID)==null?``:n,parentId:L==null?void 0:L.root.id,unitId:o,subUnitId:c,threadId:(r=L==null?void 0:L.root.threadId)==null?``:r};(x==null?void 0:x(i))!==!1&&(await B.executeCommand(A.id,{unitId:o,subUnitId:c,comment:i}),G.current&&(G.current.scrollTop=G.current.scrollHeight))},autoFocus:v||!L,onCancel:()=>{L||p==null||p()}},`${v}`)})]})},Ae=e=>{let{unitId:t,subUnitId$:n,type:r,onAdd:i,getSubUnitName:a,onResolve:o,sortComments:c,onItemLeave:l,onItemEnter:u,disableAdd:d,tempComment:p,onAddComment:m,onDeleteComment:_,showComments:v}=e,[y,b]=W(`all`),[x,S]=W(`all`),C=T(f),w=T(g),D=T(ne),[O,k]=W(()=>D.getUnit(t)),A=E(T(Z).activeCommentId$),j=E(D.commentUpdate$),ee=T(s),te=E(n),M=de(!0),N=Ee.PANEL,P=E(w.currentUser$),I=U(()=>{var e;let t=y===`all`?O:(e=O.filter(e=>e.subUnitId===te))==null?[]:e,n=c==null?(e=>e):c,r=t.map(e=>{var t;return{...e.root,children:(t=e.children)==null?[]:t,users:e.relativeUsers}});if(v){let e=new Map;return r.forEach(t=>{e.set(t.id,t)}),[...v,``].map(t=>e.get(t)).filter(Boolean)}else return n(r)},[v,y,O,c,te]),R=U(()=>[...I.filter(e=>!e.resolved),...I.filter(e=>e.resolved)],[I]),re=U(()=>x===`resolved`?R.filter(e=>e.resolved):x===`unsolved`?R.filter(e=>!e.resolved):x===`concern_me`&&P!=null&&P.userID?R.filter(e=>e==null?void 0:e.users.has(P.userID)):R,[R,P==null?void 0:P.userID,x]),z=p?[p,...re]:re,ie=z.filter(e=>!e.resolved),ae=z.filter(e=>e.resolved),oe=x!==`all`||y!==`all`,V=()=>{S(`all`),b(`all`)};le(()=>{t&&k(D.getUnit(t))},[t,D,j]),le(()=>{var e;if(!A)return;if(!M.current){M.current=!0;return}let{unitId:t,subUnitId:n,commentId:r}=A,i=`${N}-${t}-${n}-${r}`;(e=document.getElementById(i))==null||e.scrollIntoView({block:`center`})},[A]);let se=e=>K(ke,{location:N,getSubUnitName:a,id:e.id,unitId:e.unitId,subUnitId:e.subUnitId,refStr:e.ref,type:r,showEdit:(A==null?void 0:A.commentId)===e.id,showHighlight:(A==null?void 0:A.commentId)===e.id,onClick:()=>{M.current=!1,e.resolved?ee.executeCommand(Q.id):ee.executeCommand(Q.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>u==null?void 0:u(e),onMouseLeave:()=>l==null?void 0:l(e),onAddComment:m,onDeleteComment:_,onResolve:t=>o==null?void 0:o(e.id,t)},e.id);return q(`div`,{className:`univer-flex univer-min-h-full univer-flex-col univer-pb-3`,children:[q(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-between`,children:[r===h.UNIVER_SHEET?K(L,{borderless:!0,value:y,options:[{value:`current`,label:C.t(`threadCommentUI.filter.sheet.current`)},{value:`all`,label:C.t(`threadCommentUI.filter.sheet.all`)}],onChange:b}):null,K(L,{borderless:!0,value:x,options:[{value:`all`,label:C.t(`threadCommentUI.filter.status.all`)},{value:`resolved`,label:C.t(`threadCommentUI.filter.status.resolved`)},{value:`unsolved`,label:C.t(`threadCommentUI.filter.status.unsolved`)},{value:`concern_me`,label:C.t(`threadCommentUI.filter.status.concernMe`)}],onChange:S})]}),z.length===0?q(`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:[C.t(`threadCommentUI.panel.empty`),oe?K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:K(F,{onClick:V,children:C.t(`threadCommentUI.panel.reset`)})}):d?null:K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:q(F,{onClick:i,children:[K(B,{className:`univer-mr-1.5`}),C.t(`threadCommentUI.panel.addComment`)]})})]}):q(`div`,{className:`univer-mt-3 univer-flex univer-flex-col univer-gap-3`,children:[ie.map(se),ae.length>0&&K(`div`,{className:`univer-text-xs`,children:C.t(`threadCommentUI.panel.solved`)}),ae.map(se)]})]})};export{Q as SetActiveCommentOperation,Ae as ThreadCommentPanel,Z as ThreadCommentPanelService,ke as ThreadCommentTree,Ee as ThreadCommentTreeLocation,$ as UniverThreadCommentUIPlugin};
|
package/lib/index.js
CHANGED
|
@@ -1,55 +1,4 @@
|
|
|
1
|
-
import{BuildTextUtils as e,CommandType as t,CustomRangeType as n,DOCS_COMMENT_EDITOR_UNIT_ID_KEY as r,DOCS_NORMAL_EDITOR_UNIT_ID_KEY as i,DependentOn as a,Disposable as o,ICommandService as s,IConfigService as c,IUniverInstanceService as l,Inject as u,Injector as d,LocaleService as f,Plugin as p,Tools as m,UniverInstanceType as h,UserManagerService as g,generateRandomId as _,getBodySlice as v,merge as y,mergeOverrideWithDependencies as b}from"@univerjs/core";import{ISidebarService as x,KeyCode as S,UI_PLUGIN_CONFIG_KEY as C,useConfigValue as w,useDependency as T,useObservable as E}from"@univerjs/ui";import{BehaviorSubject as D,debounceTime as O,filter as k}from"rxjs";import{AddCommentCommand as A,DeleteCommentCommand as
|
|
2
|
-
`)?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},
|
|
3
|
-
`,{textRuns:[],paragraphs:[{startIndex:t.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:t.length-1}],dataStream:t,customRanges:r}}
|
|
4
|
-
|
|
5
|
-
univer-bg-center univer-bg-no-repeat
|
|
6
|
-
`,style:{backgroundImage:`url(${(v==null?void 0:v.avatar)||k})`}}),v?q(`div`,{className:`univer-mb-1 univer-flex univer-h-6 univer-items-center univer-justify-between`,children:[K(`div`,{className:`univer-text-sm univer-font-medium univer-leading-5`,children:(v==null?void 0:v.name)||` `}),q(`div`,{children:[x||c?null:S&&v?K(`div`,{className:`
|
|
7
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
8
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
9
|
-
univer-text-base
|
|
10
|
-
hover:univer-bg-gray-50
|
|
11
|
-
`,onClick:()=>o(v),children:K(V,{})}):null,b&&!x&&!c?K(I,{overlay:K(`div`,{className:`univer-rounded-lg`,children:q(`ul`,{className:`
|
|
12
|
-
univer-m-0 univer-box-border univer-grid univer-list-none
|
|
13
|
-
univer-p-1.5 univer-text-sm
|
|
14
|
-
[&_a]:univer-block [&_a]:univer-cursor-pointer
|
|
15
|
-
[&_a]:univer-rounded [&_a]:univer-px-2 [&_a]:univer-py-1.5
|
|
16
|
-
[&_a]:univer-transition-colors
|
|
17
|
-
`,children:[K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>a==null?void 0:a(!0),children:h.t(`threadCommentUI.item.edit`)})}),K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(d==null?void 0:d(t))!==!1&&(m.executeCommand(l?j.id:ee.id,{unitId:n,subUnitId:r,commentId:t.id}),l&&(u==null||u()))},children:h.t(`threadCommentUI.item.delete`)})})]})}),children:K(`div`,{className:`
|
|
18
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
19
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
20
|
-
univer-text-base
|
|
21
|
-
hover:univer-bg-gray-50
|
|
22
|
-
`,children:K(B,{})})}):null]})]}):null,K(`time`,{className:`
|
|
23
|
-
univer-mb-1 univer-text-xs/normal univer-text-gray-600
|
|
24
|
-
dark:!univer-text-gray-200
|
|
25
|
-
`,children:t.dT}),i?K(we,{type:p,id:t.id,comment:t,onCancel:()=>a==null?void 0:a(!1),autoFocus:!0,unitId:n,subUnitId:r,onSave:({text:e,attachments:i})=>{a==null||a(!1),m.executeCommand(N.id,{unitId:n,subUnitId:r,payload:{commentId:t.id,text:e,attachments:i}})}}):K(`div`,{className:`
|
|
26
|
-
univer-text-sm univer-text-gray-900
|
|
27
|
-
dark:!univer-text-white
|
|
28
|
-
`,children:Ee(t.text).map((e,t)=>K(`div`,{className:`univer-break-words`,children:e.map((e,t)=>{switch(e.type){case`mention`:return q(`a`,{className:`univer-text-primary-600`,children:[e.content.label,` `]},t);default:return e.content}})},t))})]})},Ae=e=>{var t,n,r;let{id:i,unitId:a,subUnitId:o,refStr:c,showEdit:l=!0,onClick:u,showHighlight:d,onClose:f,getSubUnitName:p,prefix:m,autoFocus:h,onMouseEnter:v,onMouseLeave:y,onAddComment:b,onDeleteComment:x,onResolve:S,type:C,style:w,full:D}=e,k=T(ne),[ee,M]=W(!1),[N,F]=W(``);E(U(()=>k.commentUpdate$.pipe(O(16)),[k]));let I=i?k.getCommentWithChildren(a,o,i):null,L=T(s),oe=T(g),B=I==null?void 0:I.root.resolved,V=E(oe.currentUser$),le=de(null),ue=[...I?[I.root]:[{id:Oe,text:{dataStream:`
|
|
29
|
-
\r`},personId:(t=V==null?void 0:V.userID)==null?``:t,ref:c==null?``:c,dT:``,unitId:a,subUnitId:o,threadId:``}],...(n=I==null?void 0:I.children)==null?[]:n],G=de(null),fe=e=>{e.stopPropagation(),B?L.executeCommand(Q.id,{unitId:a,subUnitId:o,commentId:i}):L.executeCommand(Q.id),L.executeCommand(te.id,{unitId:a,subUnitId:o,commentId:i,resolved:!B}),S==null||S(!B)},pe=e=>{e.stopPropagation(),L.executeCommand(Q.id),!(I!=null&&I.root&&(x==null?void 0:x(I.root))===!1)&&(L.executeCommand(j.id,{unitId:a,subUnitId:o,commentId:i}),f==null||f())};H(()=>y==null?void 0:y(),[]);let J=p((r=I==null?void 0:I.root.subUnitId)==null?o:r),me=l&&!N&&!B,he=`${c||(I==null?void 0:I.root.ref)||``}${J?` · `:``}${J}`;return q(`div`,{id:`${m}-${a}-${o}-${i}`,className:z(`
|
|
30
|
-
univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4
|
|
31
|
-
dark:!univer-bg-gray-900 dark:!univer-text-white
|
|
32
|
-
`,re,{"univer-w-[278px]":!D,"univer-w-full":D,"univer-shadow":!B&&(d||ee||m===`cell`)}),style:w,onClick:u,onMouseEnter:()=>{v==null||v(),M(!0)},onMouseLeave:()=>{y==null||y(),M(!1)},children:[!B&&d&&K(`div`,{className:`
|
|
33
|
-
univer-absolute univer-left-0 univer-right-0 univer-top-0 univer-h-1.5 univer-rounded-t-md
|
|
34
|
-
univer-bg-yellow-400
|
|
35
|
-
`}),q(`div`,{className:`
|
|
36
|
-
univer-mb-4 univer-flex univer-flex-row univer-items-center univer-justify-between univer-text-sm
|
|
37
|
-
univer-leading-5
|
|
38
|
-
`,children:[q(`div`,{className:`univer-flex univer-flex-1 univer-flex-row univer-items-center univer-overflow-hidden`,children:[K(`div`,{className:`
|
|
39
|
-
univer-mr-2 univer-h-3.5 univer-w-[3px] univer-flex-shrink-0 univer-flex-grow-0
|
|
40
|
-
univer-rounded-sm univer-bg-yellow-500
|
|
41
|
-
`}),K(R,{showIfEllipsis:!0,title:he,children:K(`span`,{className:`univer-flex-1 univer-truncate`,children:he})})]}),!!I&&q(`div`,{className:`univer-flex univer-flex-shrink-0 univer-flex-grow-0 univer-flex-row`,children:[K(`div`,{className:z(`
|
|
42
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center
|
|
43
|
-
univer-justify-center univer-rounded-[3px] univer-text-base
|
|
44
|
-
hover:univer-bg-gray-50
|
|
45
|
-
dark:hover:!univer-bg-gray-800
|
|
46
|
-
`,{"univer-text-green-500":B}),onClick:fe,children:K(B?se:ce,{})}),(V==null?void 0:V.userID)===I.root.personId?K(`div`,{className:`
|
|
47
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
48
|
-
univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base
|
|
49
|
-
hover:univer-bg-gray-50
|
|
50
|
-
dark:hover:!univer-bg-gray-800
|
|
51
|
-
`,onClick:pe,children:K(ae,{})}):null]})]}),K(`div`,{ref:G,className:z(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,ie),children:ue.map(e=>K(ke,{unitId:a,subUnitId:o,item:e,isRoot:e.id===(I==null?void 0:I.root.id),editing:N===e.id,resolved:I==null?void 0:I.root.resolved,type:C,onClose:f,onEditingChange:t=>{F(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=le.current)==null||t.reply(De([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:b,onDeleteComment:x},e.id))}),me&&K(`div`,{children:K(we,{ref:le,type:C,unitId:a,subUnitId:o,onSave:async({text:e,attachments:t})=>{if(!(V!=null&&V.userID)||!(I!=null&&I.root))throw Error(`[ThreadCommentTree] No current user or root comment found`);let n={text:e,attachments:t,dT:P(),id:_(),ref:c,personId:V==null?void 0:V.userID,parentId:I==null?void 0:I.root.id,unitId:a,subUnitId:o,threadId:I==null?void 0:I.root.threadId};(b==null?void 0:b(n))!==!1&&(await L.executeCommand(A.id,{unitId:a,subUnitId:o,comment:n}),G.current&&(G.current.scrollTop=G.current.scrollHeight))},autoFocus:h||!I,onCancel:()=>{I||f==null||f()}},`${h}`)})]})},je=e=>{let{unitId:t,subUnitId$:n,type:r,onAdd:i,getSubUnitName:a,onResolve:o,sortComments:c,onItemLeave:l,onItemEnter:u,disableAdd:d,tempComment:p,onAddComment:m,onDeleteComment:_,showComments:v}=e,[y,b]=W(`all`),[x,S]=W(`all`),C=T(f),w=T(g),D=T(ne),[O,k]=W(()=>D.getUnit(t)),A=E(T(Z).activeCommentId$),ee=E(D.commentUpdate$),j=T(s),te=E(n),M=de(!0),N=`panel`,P=E(w.currentUser$),I=U(()=>{var e;let t=y===`all`?O:(e=O.filter(e=>e.subUnitId===te))==null?[]:e,n=c==null?(e=>e):c,r=t.map(e=>{var t;return{...e.root,children:(t=e.children)==null?[]:t,users:e.relativeUsers}});if(v){let e=new Map;return r.forEach(t=>{e.set(t.id,t)}),[...v,``].map(t=>e.get(t)).filter(Boolean)}else return n(r)},[v,y,O,c,te]),R=U(()=>[...I.filter(e=>!e.resolved),...I.filter(e=>e.resolved)],[I]),re=U(()=>x===`resolved`?R.filter(e=>e.resolved):x===`unsolved`?R.filter(e=>!e.resolved):x===`concern_me`&&P!=null&&P.userID?R.filter(e=>e==null?void 0:e.users.has(P.userID)):R,[R,P==null?void 0:P.userID,x]),z=p?[p,...re]:re,ie=z.filter(e=>!e.resolved),ae=z.filter(e=>e.resolved),B=x!==`all`||y!==`all`,V=()=>{S(`all`),b(`all`)};H(()=>{t&&k(D.getUnit(t))},[t,D,ee]),H(()=>{var e;if(!A)return;if(!M.current){M.current=!0;return}let{unitId:t,subUnitId:n,commentId:r}=A,i=`${N}-${t}-${n}-${r}`;(e=document.getElementById(i))==null||e.scrollIntoView({block:`center`})},[A]);let se=e=>K(Ae,{prefix:N,getSubUnitName:a,id:e.id,unitId:e.unitId,subUnitId:e.subUnitId,refStr:e.ref,type:r,showEdit:(A==null?void 0:A.commentId)===e.id,showHighlight:(A==null?void 0:A.commentId)===e.id,onClick:()=>{M.current=!1,e.resolved?j.executeCommand(Q.id):j.executeCommand(Q.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>u==null?void 0:u(e),onMouseLeave:()=>l==null?void 0:l(e),onAddComment:m,onDeleteComment:_,onResolve:t=>o==null?void 0:o(e.id,t)},e.id);return q(`div`,{className:`univer-flex univer-min-h-full univer-flex-col univer-pb-3`,children:[q(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-between`,children:[r===h.UNIVER_SHEET?K(L,{borderless:!0,value:y,options:[{value:`current`,label:C.t(`threadCommentUI.filter.sheet.current`)},{value:`all`,label:C.t(`threadCommentUI.filter.sheet.all`)}],onChange:b}):null,K(L,{borderless:!0,value:x,options:[{value:`all`,label:C.t(`threadCommentUI.filter.status.all`)},{value:`resolved`,label:C.t(`threadCommentUI.filter.status.resolved`)},{value:`unsolved`,label:C.t(`threadCommentUI.filter.status.unsolved`)},{value:`concern_me`,label:C.t(`threadCommentUI.filter.status.concernMe`)}],onChange:S})]}),z.length===0?q(`div`,{className:`
|
|
52
|
-
univer-flex univer-flex-1 univer-flex-col univer-items-center univer-justify-center
|
|
53
|
-
univer-text-sm univer-text-gray-600
|
|
54
|
-
dark:!univer-text-gray-200
|
|
55
|
-
`,children:[C.t(`threadCommentUI.panel.empty`),B?K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:K(F,{onClick:V,children:C.t(`threadCommentUI.panel.reset`)})}):d?null:K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:q(F,{onClick:i,children:[K(oe,{className:`univer-mr-1.5`}),C.t(`threadCommentUI.panel.addComment`)]})})]}):q(`div`,{className:`univer-mt-3 univer-flex univer-flex-col univer-gap-3`,children:[ie.map(se),ae.length>0&&K(`div`,{className:`univer-text-xs`,children:C.t(`threadCommentUI.panel.solved`)}),ae.map(se)]})]})};export{Q as SetActiveCommentOperation,_e as THREAD_COMMENT_PANEL,je as ThreadCommentPanel,Z as ThreadCommentPanelService,Ae as ThreadCommentTree,ve as ToggleSheetCommentPanelOperation,$ as UniverThreadCommentUIPlugin};
|
|
1
|
+
import{BuildTextUtils as e,CommandType as t,CustomRangeType as n,DOCS_COMMENT_EDITOR_UNIT_ID_KEY as r,DOCS_NORMAL_EDITOR_UNIT_ID_KEY as i,DependentOn as a,Disposable as o,ICommandService as s,IConfigService as c,IUniverInstanceService as l,Inject as u,Injector as d,LocaleService as f,Plugin as p,Tools as m,UniverInstanceType as h,UserManagerService as g,generateRandomId as _,getBodySlice as v,merge as y,mergeOverrideWithDependencies as b}from"@univerjs/core";import{ISidebarService as x,KeyCode as S,UI_PLUGIN_CONFIG_KEY as C,useConfigValue as w,useDependency as T,useObservable as E}from"@univerjs/ui";import{BehaviorSubject as D,debounceTime as O,filter as k}from"rxjs";import{AddCommentCommand as A,DeleteCommentCommand as j,DeleteCommentTreeCommand as ee,ResolveCommentCommand as te,ThreadCommentModel as ne,UniverThreadCommentPlugin as M,UpdateCommentCommand as N,getDT as P}from"@univerjs/thread-comment";import{Button as F,Dropdown as I,Select as L,Tooltip as R,borderClassName as re,clsx as z,scrollbarClassName as ie}from"@univerjs/design";import{DeleteIcon as ae,IncreaseIcon as B,MoreHorizontalIcon as oe,ReplyToCommentIcon as V,ResolvedIcon as se,SolveIcon as ce}from"@univerjs/icons";import{forwardRef as H,useEffect as le,useImperativeHandle as ue,useMemo as U,useRef as de,useState as W}from"react";import{BreakLineCommand as fe,IEditorService as G,RichTextEditor as pe}from"@univerjs/docs-ui";import{jsx as K,jsxs as q}from"react/jsx-runtime";function J(e){"@babel/helpers - typeof";return J=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},J(e)}function me(e,t){if(J(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(J(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function he(e){var t=me(e,`string`);return J(t)==`symbol`?t:t+``}function Y(e,t,n){return(t=he(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function X(e,t){return function(n,r){t(n,r,e)}}function ge(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 Z=class extends o{constructor(e,t){super(),this._sidebarService=e,this._univerInstanceService=t,Y(this,`_panelVisible`,!1),Y(this,`_panelVisible$`,new D(!1)),Y(this,`_activeCommentId`,void 0),Y(this,`_activeCommentId$`,new D(void 0)),Y(this,`panelVisible$`,this._panelVisible$.asObservable()),Y(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$(h.UNIVER_SHEET).pipe(k(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)}};Z=ge([X(0,u(x)),X(1,l)],Z);const Q={id:`thread-comment-ui.operation.set-active-comment`,type:t.OPERATION,handler(e,t){return e.get(Z).setActiveComment(t),!0}};var _e=`@univerjs/thread-comment-ui`,ve=`0.19.0`;const ye=`thread-comment-ui.config`;Symbol(ye);const be={};let $=class extends p{constructor(e=be,t,n,r){super(),this._config=e,this._injector=t,this._commandService=n,this._configService=r;let{menu:i,...a}=y({},be,this._config);i&&this._configService.setConfig(`menu`,i,{merge:!0}),this._configService.setConfig(ye,a)}onStarting(){var e;b([[Z]],(e=this._config)==null?void 0:e.overrides).forEach(e=>{this._injector.add(e)}),[Q].forEach(e=>{this._commandService.registerCommand(e)})}};Y($,`pluginName`,`UNIVER_THREAD_COMMENT_UI_PLUGIN`),Y($,`packageName`,_e),Y($,`version`,ve),Y($,`type`,h.UNIVER_UNKNOWN),$=ge([a(M),X(1,u(d)),X(2,s),X(3,c)],$);function xe(e){return{id:`d`,body:e,documentStyle:{}}}const Se=H((t,n)=>{var r;let{comment:a,onSave:o,id:c,onCancel:l,autoFocus:u,unitId:d,type:p,editorId:g}=t,_=T(s),v=T(f),[y,b]=W(!1),x=T(G),C=de(null),w=p===h.UNIVER_DOC?i:d,[E,D]=W(()=>{var t,n;return e.transform.getPlainText((t=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t)});le(()=>{var t,n,r;D(e.transform.getPlainText((t=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t));let i=(r=C.current)==null?void 0:r.selectionChange$.subscribe(()=>{var t,n;D(e.transform.getPlainText((t=(n=C.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:t))});return()=>i==null?void 0:i.unsubscribe()},[(r=C.current)==null?void 0:r.selectionChange$]);let O=U(()=>({keyCodes:[{keyCode:S.ENTER}],handler:e=>{e===S.ENTER&&_.executeCommand(fe.id)}}),[_]);return ue(n,()=>({reply(e){var t,n;if(!C.current)return;x.focus((t=C.current.getEditorId())==null?``:t);let r=xe(e);(n=C.current)==null||n.setDocumentData(r,[{startOffset:r.body.dataStream.length-2,endOffset:r.body.dataStream.length-2,collapsed:!0}])}})),q(`div`,{onClick:e=>e.preventDefault(),children:[K(pe,{className:`univer-w-full`,editorRef:C,editorId:g,autoFocus:u,keyboardEventConfig:O,placeholder:v.t(`threadCommentUI.editor.placeholder`),initialValue:(a==null?void 0:a.text)&&xe(a.text),onFocusChange:e=>e&&b(e),isSingle:!1,maxHeight:64,onClickOutside:()=>{setTimeout(()=>{x.focus(w)},30)}}),y?q(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-end univer-gap-2`,children:[K(F,{onClick:()=>{var e;l==null||l(),b(!1),(e=C.current)==null||e.replaceText(``,!0),_.executeCommand(Q.id)},children:v.t(`threadCommentUI.editor.cancel`)}),K(F,{variant:`primary`,disabled:!E,onClick:()=>{if(C.current){let e=m.deepClone(C.current.getDocumentData().body);b(!1),o==null||o({...a,text:e}),C.current.replaceText(``),setTimeout(()=>{var e,t;(e=C.current)==null||e.setSelectionRanges([]),(t=C.current)==null||t.blur()},10)}},children:v.t(c?`threadCommentUI.editor.save`:`threadCommentUI.editor.reply`)})]}):null]})}),Ce=e=>{let{dataStream:t,customRanges:n}=e,r=t.endsWith(`\r
|
|
2
|
+
`)?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},we=e=>{if(!e)return[];let{paragraphs:t=[]}=e;return t.map((n,r)=>Ce(v(e,r===0?0:t[r-1].startIndex+1,n.startIndex)))},Te=e=>{let t=``,r=[];return e.forEach(e=>{switch(e.type){case`text`:t+=e.content;break;case`mention`:{let i=t.length;t+=e.content.label;let a=t.length-1;r.push({rangeId:e.content.id,rangeType:n.MENTION,startIndex:i,endIndex:a,properties:{},wholeEntity:!0});break}default:break}}),t+=`\r
|
|
3
|
+
`,{textRuns:[],paragraphs:[{startIndex:t.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:t.length-1}],dataStream:t,customRanges:r}};let Ee=function(e){return e.CELL=`CELL`,e.PANEL=`PANEL`,e}({});const De=`__mock__`,Oe=e=>{let{item:t,unitId:n,subUnitId:r,editing:i,onEditingChange:a,onReply:o,resolved:c,isRoot:l,onClose:u,onDeleteComment:d,type:p,threadCommentEditorId:m}=e,h=T(s),_=T(f),v=T(g),y=v.getUser(t.personId),b=E(v.currentUser$),x=(b==null?void 0:b.userID)===t.personId,S=t.id===De,[D,O]=W(!1),k=w(C),A=k==null?void 0:k.avatarFallback;return q(`div`,{className:`univer-relative univer-mb-3 univer-pl-[30px]`,onMouseLeave:()=>O(!1),onMouseEnter:()=>O(!0),children:[K(`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(${(y==null?void 0:y.avatar)||A})`}}),y?q(`div`,{className:`univer-mb-1 univer-flex univer-h-6 univer-items-center univer-justify-between`,children:[K(`div`,{className:`univer-text-sm univer-font-medium univer-leading-5`,children:(y==null?void 0:y.name)||` `}),q(`div`,{children:[S||c?null:D&&y?K(`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:()=>o(y),children:K(V,{})}):null,x&&!S&&!c?K(I,{overlay:K(`div`,{className:`univer-rounded-lg`,children:q(`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:[K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>a==null?void 0:a(!0),children:_.t(`threadCommentUI.item.edit`)})}),K(`li`,{children:K(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>{(d==null?void 0:d(t))!==!1&&(h.executeCommand(l?ee.id:j.id,{unitId:n,subUnitId:r,commentId:t.id}),l&&(u==null||u()))},children:_.t(`threadCommentUI.item.delete`)})})]})}),children:K(`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:K(oe,{})})}):null]})]}):null,K(`time`,{className:`univer-mb-1 univer-text-xs/normal univer-text-gray-600 dark:!univer-text-gray-200`,children:t.dT}),i?K(Se,{type:p,id:t.id,comment:t,onCancel:()=>a==null?void 0:a(!1),autoFocus:!0,unitId:n,subUnitId:r,editorId:m,onSave:({text:e,attachments:i})=>{a==null||a(!1),h.executeCommand(N.id,{unitId:n,subUnitId:r,payload:{commentId:t.id,text:e,attachments:i}})}}):K(`div`,{className:`univer-text-sm univer-text-gray-900 dark:!univer-text-white`,children:we(t.text).map((e,t)=>K(`div`,{className:`univer-break-words`,children:e.map((e,t)=>{switch(e.type){case`mention`:return q(`a`,{className:`univer-text-primary-600`,children:[e.content.label,` `]},t);default:return e.content}})},t))})]})},ke=e=>{var t,n,i;let{id:a,unitId:o,subUnitId:c,refStr:l,showEdit:u=!0,onClick:d,showHighlight:f,onClose:p,getSubUnitName:m,location:h,autoFocus:v,onMouseEnter:y,onMouseLeave:b,onAddComment:x,onDeleteComment:S,onResolve:C,type:w,style:D,full:k}=e,j=T(ne),[M,N]=W(!1),[F,I]=W(``);E(U(()=>j.commentUpdate$.pipe(O(16)),[j]));let L=a?j.getCommentWithChildren(o,c,a):null,B=T(s),oe=T(g),V=L==null?void 0:L.root.resolved,H=E(oe.currentUser$),ue=de(null),fe=[...L?[L.root]:[{id:De,text:{dataStream:`
|
|
4
|
+
\r`},personId:(t=H==null?void 0:H.userID)==null?``:t,ref:l==null?``:l,dT:``,unitId:o,subUnitId:c,threadId:``}],...(n=L==null?void 0:L.children)==null?[]:n],G=de(null),pe=e=>{e.stopPropagation(),V?B.executeCommand(Q.id,{unitId:o,subUnitId:c,commentId:a}):B.executeCommand(Q.id),B.executeCommand(te.id,{unitId:o,subUnitId:c,commentId:a,resolved:!V}),C==null||C(!V)},J=e=>{e.stopPropagation(),B.executeCommand(Q.id),!(L!=null&&L.root&&(S==null?void 0:S(L.root))===!1)&&(B.executeCommand(ee.id,{unitId:o,subUnitId:c,commentId:a}),p==null||p())};le(()=>b==null?void 0:b(),[]);let me=m((i=L==null?void 0:L.root.subUnitId)==null?c:i),he=u&&!F&&!V,Y=`${l||(L==null?void 0:L.root.ref)||``}${me?` · `:``}${me}`,X=`${r}_${h}`;return q(`div`,{id:`${h}-${o}-${c}-${a}`,className:z(`univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4 dark:!univer-bg-gray-900 dark:!univer-text-white`,re,{"univer-w-[278px]":!k,"univer-w-full":k,"univer-shadow":!V&&(f||M||h===Ee.CELL)}),style:D,onClick:d,onMouseEnter:()=>{y==null||y(),N(!0)},onMouseLeave:()=>{b==null||b(),N(!1)},children:[!V&&f&&K(`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`}),q(`div`,{className:`univer-mb-4 univer-flex univer-flex-row univer-items-center univer-justify-between univer-text-sm univer-leading-5`,children:[q(`div`,{className:`univer-flex univer-flex-1 univer-flex-row univer-items-center univer-overflow-hidden`,children:[K(`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`}),K(R,{showIfEllipsis:!0,title:Y,children:K(`span`,{className:`univer-flex-1 univer-truncate`,children:Y})})]}),!!L&&q(`div`,{className:`univer-flex univer-flex-shrink-0 univer-flex-grow-0 univer-flex-row`,children:[K(`div`,{className:z(`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":V}),onClick:pe,children:K(V?se:ce,{})}),(H==null?void 0:H.userID)===L.root.personId?K(`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:J,children:K(ae,{})}):null]})]}),K(`div`,{ref:G,className:z(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,ie),children:fe.map(e=>K(Oe,{unitId:o,subUnitId:c,item:e,isRoot:e.id===(L==null?void 0:L.root.id),editing:F===e.id,resolved:L==null?void 0:L.root.resolved,type:w,threadCommentEditorId:X,onClose:p,onEditingChange:t=>{I(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=ue.current)==null||t.reply(Te([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:x,onDeleteComment:S},e.id))}),he&&K(`div`,{children:K(Se,{ref:ue,type:w,unitId:o,subUnitId:c,editorId:X,onSave:async({text:e,attachments:t})=>{var n,r;let i={text:e,attachments:t,dT:P(),id:_(),ref:l,personId:(n=H==null?void 0:H.userID)==null?``:n,parentId:L==null?void 0:L.root.id,unitId:o,subUnitId:c,threadId:(r=L==null?void 0:L.root.threadId)==null?``:r};(x==null?void 0:x(i))!==!1&&(await B.executeCommand(A.id,{unitId:o,subUnitId:c,comment:i}),G.current&&(G.current.scrollTop=G.current.scrollHeight))},autoFocus:v||!L,onCancel:()=>{L||p==null||p()}},`${v}`)})]})},Ae=e=>{let{unitId:t,subUnitId$:n,type:r,onAdd:i,getSubUnitName:a,onResolve:o,sortComments:c,onItemLeave:l,onItemEnter:u,disableAdd:d,tempComment:p,onAddComment:m,onDeleteComment:_,showComments:v}=e,[y,b]=W(`all`),[x,S]=W(`all`),C=T(f),w=T(g),D=T(ne),[O,k]=W(()=>D.getUnit(t)),A=E(T(Z).activeCommentId$),j=E(D.commentUpdate$),ee=T(s),te=E(n),M=de(!0),N=Ee.PANEL,P=E(w.currentUser$),I=U(()=>{var e;let t=y===`all`?O:(e=O.filter(e=>e.subUnitId===te))==null?[]:e,n=c==null?(e=>e):c,r=t.map(e=>{var t;return{...e.root,children:(t=e.children)==null?[]:t,users:e.relativeUsers}});if(v){let e=new Map;return r.forEach(t=>{e.set(t.id,t)}),[...v,``].map(t=>e.get(t)).filter(Boolean)}else return n(r)},[v,y,O,c,te]),R=U(()=>[...I.filter(e=>!e.resolved),...I.filter(e=>e.resolved)],[I]),re=U(()=>x===`resolved`?R.filter(e=>e.resolved):x===`unsolved`?R.filter(e=>!e.resolved):x===`concern_me`&&P!=null&&P.userID?R.filter(e=>e==null?void 0:e.users.has(P.userID)):R,[R,P==null?void 0:P.userID,x]),z=p?[p,...re]:re,ie=z.filter(e=>!e.resolved),ae=z.filter(e=>e.resolved),oe=x!==`all`||y!==`all`,V=()=>{S(`all`),b(`all`)};le(()=>{t&&k(D.getUnit(t))},[t,D,j]),le(()=>{var e;if(!A)return;if(!M.current){M.current=!0;return}let{unitId:t,subUnitId:n,commentId:r}=A,i=`${N}-${t}-${n}-${r}`;(e=document.getElementById(i))==null||e.scrollIntoView({block:`center`})},[A]);let se=e=>K(ke,{location:N,getSubUnitName:a,id:e.id,unitId:e.unitId,subUnitId:e.subUnitId,refStr:e.ref,type:r,showEdit:(A==null?void 0:A.commentId)===e.id,showHighlight:(A==null?void 0:A.commentId)===e.id,onClick:()=>{M.current=!1,e.resolved?ee.executeCommand(Q.id):ee.executeCommand(Q.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>u==null?void 0:u(e),onMouseLeave:()=>l==null?void 0:l(e),onAddComment:m,onDeleteComment:_,onResolve:t=>o==null?void 0:o(e.id,t)},e.id);return q(`div`,{className:`univer-flex univer-min-h-full univer-flex-col univer-pb-3`,children:[q(`div`,{className:`univer-mt-3 univer-flex univer-flex-row univer-justify-between`,children:[r===h.UNIVER_SHEET?K(L,{borderless:!0,value:y,options:[{value:`current`,label:C.t(`threadCommentUI.filter.sheet.current`)},{value:`all`,label:C.t(`threadCommentUI.filter.sheet.all`)}],onChange:b}):null,K(L,{borderless:!0,value:x,options:[{value:`all`,label:C.t(`threadCommentUI.filter.status.all`)},{value:`resolved`,label:C.t(`threadCommentUI.filter.status.resolved`)},{value:`unsolved`,label:C.t(`threadCommentUI.filter.status.unsolved`)},{value:`concern_me`,label:C.t(`threadCommentUI.filter.status.concernMe`)}],onChange:S})]}),z.length===0?q(`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:[C.t(`threadCommentUI.panel.empty`),oe?K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:K(F,{onClick:V,children:C.t(`threadCommentUI.panel.reset`)})}):d?null:K(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:q(F,{onClick:i,children:[K(B,{className:`univer-mr-1.5`}),C.t(`threadCommentUI.panel.addComment`)]})})]}):q(`div`,{className:`univer-mt-3 univer-flex univer-flex-col univer-gap-3`,children:[ie.map(se),ae.length>0&&K(`div`,{className:`univer-text-xs`,children:C.t(`threadCommentUI.panel.solved`)}),ae.map(se)]})]})};export{Q as SetActiveCommentOperation,Ae as ThreadCommentPanel,Z as ThreadCommentPanelService,ke as ThreadCommentTree,Ee as ThreadCommentTreeLocation,$ as UniverThreadCommentUIPlugin};
|
package/lib/types/index.d.ts
CHANGED
|
@@ -14,12 +14,11 @@
|
|
|
14
14
|
* limitations under the License.
|
|
15
15
|
*/
|
|
16
16
|
import './global.css';
|
|
17
|
-
export { type ISetActiveCommentOperationParams, SetActiveCommentOperation
|
|
17
|
+
export { type ISetActiveCommentOperationParams, SetActiveCommentOperation } from './commands/operations/comment.operations';
|
|
18
18
|
export type { IUniverThreadCommentUIConfig } from './config/config';
|
|
19
19
|
export { UniverThreadCommentUIPlugin } from './plugin';
|
|
20
20
|
export { type ActiveCommentInfo, ThreadCommentPanelService } from './services/thread-comment-panel.service';
|
|
21
|
-
export { THREAD_COMMENT_PANEL } from './types/const';
|
|
22
21
|
export { ThreadCommentPanel } from './views/thread-comment-panel';
|
|
23
22
|
export type { IThreadCommentPanelProps } from './views/thread-comment-panel';
|
|
24
|
-
export { ThreadCommentTree } from './views/thread-comment-tree';
|
|
23
|
+
export { ThreadCommentTree, ThreadCommentTreeLocation } from './views/thread-comment-tree';
|
|
25
24
|
export type { IThreadCommentTreeProps } from './views/thread-comment-tree';
|
|
@@ -13,6 +13,4 @@
|
|
|
13
13
|
* See the License for the specific language governing permissions and
|
|
14
14
|
* limitations under the License.
|
|
15
15
|
*/
|
|
16
|
-
export declare const THREAD_COMMENT_POPUP = "thread-comment-popup";
|
|
17
|
-
export declare const THREAD_COMMENT_PANEL = "thread-comment-panel";
|
|
18
16
|
export declare const PLUGIN_NAME = "UNIVER_THREAD_COMMENT_UI_PLUGIN";
|
|
@@ -15,6 +15,10 @@
|
|
|
15
15
|
*/
|
|
16
16
|
import type { IUser, UniverInstanceType } from '@univerjs/core';
|
|
17
17
|
import type { IThreadComment } from '@univerjs/thread-comment';
|
|
18
|
+
export declare enum ThreadCommentTreeLocation {
|
|
19
|
+
CELL = "CELL",
|
|
20
|
+
PANEL = "PANEL"
|
|
21
|
+
}
|
|
18
22
|
export interface IThreadCommentTreeProps {
|
|
19
23
|
full?: boolean;
|
|
20
24
|
id?: string;
|
|
@@ -27,7 +31,7 @@ export interface IThreadCommentTreeProps {
|
|
|
27
31
|
showHighlight?: boolean;
|
|
28
32
|
onClose?: () => void;
|
|
29
33
|
getSubUnitName: (subUnitId: string) => string;
|
|
30
|
-
|
|
34
|
+
location: ThreadCommentTreeLocation;
|
|
31
35
|
autoFocus?: boolean;
|
|
32
36
|
onMouseEnter?: () => void;
|
|
33
37
|
onMouseLeave?: () => void;
|
|
@@ -50,5 +54,6 @@ export interface IThreadCommentItemProps {
|
|
|
50
54
|
onAddComment?: (comment: IThreadComment) => boolean;
|
|
51
55
|
onDeleteComment?: (comment: IThreadComment) => boolean;
|
|
52
56
|
type: UniverInstanceType;
|
|
57
|
+
threadCommentEditorId: string;
|
|
53
58
|
}
|
|
54
59
|
export declare const ThreadCommentTree: (props: IThreadCommentTreeProps) => import("react/jsx-runtime").JSX.Element;
|
package/lib/umd/index.js
CHANGED
|
@@ -1,55 +1,4 @@
|
|
|
1
|
-
(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=`thread-comment-panel`,_={id:`thread-comment-ui.operation.toggle-panel`,type:t.CommandType.OPERATION,handler(e){let t=e.get(n.ISidebarService),r=e.get(h);return r.panelVisible?(t.close(),r.setPanelVisible(!1)):(t.open({header:{title:`threadCommentUI.panel.title`},children:{label:g},width:360}),r.setPanelVisible(!0)),!0}},v={id:`thread-comment-ui.operation.set-active-comment`,type:t.CommandType.OPERATION,handler(e,t){return e.get(h).setActiveComment(t),!0}};var y=`@univerjs/thread-comment-ui`,b=`0.18.0`;let x=`thread-comment-ui.config`;Symbol(x);let S={},C=class extends t.Plugin{constructor(e=S,n,r,i){super(),this._config=e,this._injector=n,this._commandService=r,this._configService=i;let{menu:a,...o}=(0,t.merge)({},S,this._config);a&&this._configService.setConfig(`menu`,a,{merge:!0}),this._configService.setConfig(x,o)}onStarting(){var e;(0,t.mergeOverrideWithDependencies)([[h]],(e=this._config)==null?void 0:e.overrides).forEach(e=>{this._injector.add(e)}),[_,v].forEach(e=>{this._commandService.registerCommand(e)})}};f(C,`pluginName`,`UNIVER_THREAD_COMMENT_UI_PLUGIN`),f(C,`packageName`,y),f(C,`version`,b),f(C,`type`,t.UniverInstanceType.UNIVER_UNKNOWN),C=m([(0,t.DependentOn)(i.UniverThreadCommentPlugin),p(1,(0,t.Inject)(t.Injector)),p(2,t.ICommandService),p(3,t.IConfigService)],C);function w({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)(`_${O()}`);return T(n,`${r}`,{defIds:n.defIds,idSuffix:l.current},{ref:e,className:c,...s},a)}function T(e,t,n,r,i){return(0,o.createElement)(e.tag,{key:t,...E(e,n,i),...r},(D(e,n).children||[]).map((r,a)=>T(r,`${t}-${e.tag}-${a}`,n,void 0,i)))}function E(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 D(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 O(){return Math.random().toString(36).substring(2,8)}w.displayName=`UniverIcon`;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:`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`}}]},A=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(w,Object.assign({},e,{id:`delete-icon`,ref:t,icon:k}))});A.displayName=`DeleteIcon`;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:`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`}}]},M=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(w,Object.assign({},e,{id:`increase-icon`,ref:t,icon:j}))});M.displayName=`IncreaseIcon`;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:{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`}}]},P=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(w,Object.assign({},e,{id:`more-horizontal-icon`,ref:t,icon:N}))});P.displayName=`MoreHorizontalIcon`;let F={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}}]},I=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(w,Object.assign({},e,{id:`reply-to-comment-icon`,ref:t,icon:F}))});I.displayName=`ReplyToCommentIcon`;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:`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`}}]},R=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(w,Object.assign({},e,{id:`resolved-icon`,ref:t,icon:L}))});R.displayName=`ResolvedIcon`;let z={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}}]},B=(0,o.forwardRef)(function(e,t){return(0,o.createElement)(w,Object.assign({},e,{id:`solve-icon`,ref:t,icon:z}))});B.displayName=`SolveIcon`;function V(e){return{id:`d`,body:e,documentStyle:{}}}let H=(0,o.forwardRef)((e,r)=>{var i;let{comment:l,onSave:u,id:d,onCancel:f,autoFocus:p,unitId:m,type:h}=e,g=(0,n.useDependency)(t.ICommandService),_=(0,n.useDependency)(t.LocaleService),[y,b]=(0,o.useState)(!1),x=(0,n.useDependency)(s.IEditorService),S=(0,o.useRef)(null),C=h===t.UniverInstanceType.UNIVER_DOC?t.DOCS_NORMAL_EDITOR_UNIT_ID_KEY:m,[w,T]=(0,o.useState)(()=>{var e,n;return t.BuildTextUtils.transform.getPlainText((e=(n=S.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e)});(0,o.useEffect)(()=>{var e,n,r;T(t.BuildTextUtils.transform.getPlainText((e=(n=S.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e));let i=(r=S.current)==null?void 0:r.selectionChange$.subscribe(()=>{var e,n;T(t.BuildTextUtils.transform.getPlainText((e=(n=S.current)==null||(n=n.getDocumentData().body)==null?void 0:n.dataStream)==null?``:e))});return()=>i==null?void 0:i.unsubscribe()},[(i=S.current)==null?void 0:i.selectionChange$]);let E=(0,o.useMemo)(()=>({keyCodes:[{keyCode:n.KeyCode.ENTER}],handler:e=>{e===n.KeyCode.ENTER&&g.executeCommand(s.BreakLineCommand.id)}}),[g]);return(0,o.useImperativeHandle)(r,()=>({reply(e){var t,n;if(!S.current)return;x.focus((t=S.current.getEditorId())==null?``:t);let r=V(e);(n=S.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:S,editorId:t.DOCS_COMMENT_EDITOR_UNIT_ID_KEY,autoFocus:p,keyboardEventConfig:E,placeholder:_.t(`threadCommentUI.editor.placeholder`),initialValue:(l==null?void 0:l.text)&&V(l.text),onFocusChange:e=>e&&b(e),isSingle:!1,maxHeight:64,onClickOutside:()=>{setTimeout(()=>{x.focus(C)},30)}}),y?(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(),b(!1),(e=S.current)==null||e.replaceText(``,!0),g.executeCommand(v.id)},children:_.t(`threadCommentUI.editor.cancel`)}),(0,c.jsx)(a.Button,{variant:`primary`,disabled:!w,onClick:()=>{if(S.current){let e=t.Tools.deepClone(S.current.getDocumentData().body);b(!1),u==null||u({...l,text:e}),S.current.replaceText(``),setTimeout(()=>{var e,t;(e=S.current)==null||e.setSelectionRanges([]),(t=S.current)==null||t.blur()},10)}},children:_.t(d?`threadCommentUI.editor.save`:`threadCommentUI.editor.reply`)})]}):null]})}),U=e=>{let{dataStream:t,customRanges:n}=e,r=t.endsWith(`\r
|
|
2
|
-
`)?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},
|
|
3
|
-
`,{textRuns:[],paragraphs:[{startIndex:n.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:n.length-1}],dataStream:n,customRanges:r}},
|
|
4
|
-
|
|
5
|
-
univer-bg-center univer-bg-no-repeat
|
|
6
|
-
`,style:{backgroundImage:`url(${(x==null?void 0:x.avatar)||O})`}}),x?(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:(x==null?void 0:x.name)||` `}),(0,c.jsxs)(`div`,{children:[w||p?null:T&&x?(0,c.jsx)(`div`,{className:`
|
|
7
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
8
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
9
|
-
univer-text-base
|
|
10
|
-
hover:univer-bg-gray-50
|
|
11
|
-
`,onClick:()=>f(x),children:(0,c.jsx)(I,{})}):null,C&&!w&&!p?(0,c.jsx)(a.Dropdown,{overlay:(0,c.jsx)(`div`,{className:`univer-rounded-lg`,children:(0,c.jsxs)(`ul`,{className:`
|
|
12
|
-
univer-m-0 univer-box-border univer-grid univer-list-none
|
|
13
|
-
univer-p-1.5 univer-text-sm
|
|
14
|
-
[&_a]:univer-block [&_a]:univer-cursor-pointer
|
|
15
|
-
[&_a]:univer-rounded [&_a]:univer-px-2 [&_a]:univer-py-1.5
|
|
16
|
-
[&_a]:univer-transition-colors
|
|
17
|
-
`,children:[(0,c.jsx)(`li`,{children:(0,c.jsx)(`a`,{className:`hover:univer-bg-gray-200`,onClick:()=>d==null?void 0:d(!0),children:y.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&&(v.executeCommand(m?i.DeleteCommentTreeCommand.id:i.DeleteCommentCommand.id,{unitId:s,subUnitId:l,commentId:r.id}),m&&(h==null||h()))},children:y.t(`threadCommentUI.item.delete`)})})]})}),children:(0,c.jsx)(`div`,{className:`
|
|
18
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
19
|
-
univer-items-center univer-justify-center univer-rounded-sm
|
|
20
|
-
univer-text-base
|
|
21
|
-
hover:univer-bg-gray-50
|
|
22
|
-
`,children:(0,c.jsx)(P,{})})}):null]})]}):null,(0,c.jsx)(`time`,{className:`
|
|
23
|
-
univer-mb-1 univer-text-xs/normal univer-text-gray-600
|
|
24
|
-
dark:!univer-text-gray-200
|
|
25
|
-
`,children:r.dT}),u?(0,c.jsx)(H,{type:_,id:r.id,comment:r,onCancel:()=>d==null?void 0:d(!1),autoFocus:!0,unitId:s,subUnitId:l,onSave:({text:e,attachments:t})=>{d==null||d(!1),v.executeCommand(i.UpdateCommentCommand.id,{unitId:s,subUnitId:l,payload:{commentId:r.id,text:e,attachments:t}})}}):(0,c.jsx)(`div`,{className:`
|
|
26
|
-
univer-text-sm univer-text-gray-900
|
|
27
|
-
dark:!univer-text-white
|
|
28
|
-
`,children:W(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))})]})},J=e=>{var s,l,u;let{id:d,unitId:f,subUnitId:p,refStr:m,showEdit:h=!0,onClick:g,showHighlight:_,onClose:y,getSubUnitName:b,prefix:x,autoFocus:S,onMouseEnter:C,onMouseLeave:w,onAddComment:T,onDeleteComment:E,onResolve:D,type:O,style:k,full:j}=e,M=(0,n.useDependency)(i.ThreadCommentModel),[N,P]=(0,o.useState)(!1),[F,I]=(0,o.useState)(``);(0,n.useObservable)((0,o.useMemo)(()=>M.commentUpdate$.pipe((0,r.debounceTime)(16)),[M]));let L=d?M.getCommentWithChildren(f,p,d):null,z=(0,n.useDependency)(t.ICommandService),V=(0,n.useDependency)(t.UserManagerService),U=L==null?void 0:L.root.resolved,W=(0,n.useObservable)(V.currentUser$),J=(0,o.useRef)(null),Y=[...L?[L.root]:[{id:K,text:{dataStream:`
|
|
29
|
-
\r`},personId:(s=W==null?void 0:W.userID)==null?``:s,ref:m==null?``:m,dT:``,unitId:f,subUnitId:p,threadId:``}],...(l=L==null?void 0:L.children)==null?[]:l],X=(0,o.useRef)(null),Z=e=>{e.stopPropagation(),U?z.executeCommand(v.id,{unitId:f,subUnitId:p,commentId:d}):z.executeCommand(v.id),z.executeCommand(i.ResolveCommentCommand.id,{unitId:f,subUnitId:p,commentId:d,resolved:!U}),D==null||D(!U)},ee=e=>{e.stopPropagation(),z.executeCommand(v.id),!(L!=null&&L.root&&(E==null?void 0:E(L.root))===!1)&&(z.executeCommand(i.DeleteCommentTreeCommand.id,{unitId:f,subUnitId:p,commentId:d}),y==null||y())};(0,o.useEffect)(()=>w==null?void 0:w(),[]);let Q=b((u=L==null?void 0:L.root.subUnitId)==null?p:u),te=h&&!F&&!U,$=`${m||(L==null?void 0:L.root.ref)||``}${Q?` · `:``}${Q}`;return(0,c.jsxs)(`div`,{id:`${x}-${f}-${p}-${d}`,className:(0,a.clsx)(`
|
|
30
|
-
univer-relative univer-box-border univer-rounded-md univer-bg-white univer-p-4
|
|
31
|
-
dark:!univer-bg-gray-900 dark:!univer-text-white
|
|
32
|
-
`,a.borderClassName,{"univer-w-[278px]":!j,"univer-w-full":j,"univer-shadow":!U&&(_||N||x===`cell`)}),style:k,onClick:g,onMouseEnter:()=>{C==null||C(),P(!0)},onMouseLeave:()=>{w==null||w(),P(!1)},children:[!U&&_&&(0,c.jsx)(`div`,{className:`
|
|
33
|
-
univer-absolute univer-left-0 univer-right-0 univer-top-0 univer-h-1.5 univer-rounded-t-md
|
|
34
|
-
univer-bg-yellow-400
|
|
35
|
-
`}),(0,c.jsxs)(`div`,{className:`
|
|
36
|
-
univer-mb-4 univer-flex univer-flex-row univer-items-center univer-justify-between univer-text-sm
|
|
37
|
-
univer-leading-5
|
|
38
|
-
`,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:`
|
|
39
|
-
univer-mr-2 univer-h-3.5 univer-w-[3px] univer-flex-shrink-0 univer-flex-grow-0
|
|
40
|
-
univer-rounded-sm univer-bg-yellow-500
|
|
41
|
-
`}),(0,c.jsx)(a.Tooltip,{showIfEllipsis:!0,title:$,children:(0,c.jsx)(`span`,{className:`univer-flex-1 univer-truncate`,children:$})})]}),!!L&&(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)(`
|
|
42
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer univer-items-center
|
|
43
|
-
univer-justify-center univer-rounded-[3px] univer-text-base
|
|
44
|
-
hover:univer-bg-gray-50
|
|
45
|
-
dark:hover:!univer-bg-gray-800
|
|
46
|
-
`,{"univer-text-green-500":U}),onClick:Z,children:U?(0,c.jsx)(R,{}):(0,c.jsx)(B,{})}),(W==null?void 0:W.userID)===L.root.personId?(0,c.jsx)(`div`,{className:`
|
|
47
|
-
univer-ml-1 univer-inline-flex univer-size-6 univer-cursor-pointer
|
|
48
|
-
univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base
|
|
49
|
-
hover:univer-bg-gray-50
|
|
50
|
-
dark:hover:!univer-bg-gray-800
|
|
51
|
-
`,onClick:ee,children:(0,c.jsx)(A,{})}):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)(q,{unitId:f,subUnitId:p,item:e,isRoot:e.id===(L==null?void 0:L.root.id),editing:F===e.id,resolved:L==null?void 0:L.root.resolved,type:O,onClose:y,onEditingChange:t=>{I(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=J.current)==null||t.reply(G([{type:`mention`,content:{id:e.userID,label:`@${e.name}`}},{type:`text`,content:` `}]))})},onAddComment:T,onDeleteComment:E},e.id))}),te&&(0,c.jsx)(`div`,{children:(0,c.jsx)(H,{ref:J,type:O,unitId:f,subUnitId:p,onSave:async({text:e,attachments:n})=>{if(!(W!=null&&W.userID)||!(L!=null&&L.root))throw Error(`[ThreadCommentTree] No current user or root comment found`);let r={text:e,attachments:n,dT:(0,i.getDT)(),id:(0,t.generateRandomId)(),ref:m,personId:W==null?void 0:W.userID,parentId:L==null?void 0:L.root.id,unitId:f,subUnitId:p,threadId:L==null?void 0:L.root.threadId};(T==null?void 0:T(r))!==!1&&(await z.executeCommand(i.AddCommentCommand.id,{unitId:f,subUnitId:p,comment:r}),X.current&&(X.current.scrollTop=X.current.scrollHeight))},autoFocus:S||!L,onCancel:()=>{L||y==null||y()}},`${S}`)})]})};e.SetActiveCommentOperation=v,e.THREAD_COMMENT_PANEL=g,e.ThreadCommentPanel=e=>{let{unitId:r,subUnitId$:s,type:l,onAdd:u,getSubUnitName:d,onResolve:f,sortComments:p,onItemLeave:m,onItemEnter:g,disableAdd:_,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),[A,j]=(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`?A:(e=A.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,A,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`,q=()=>{E(`all`),w(`all`)};(0,o.useEffect)(()=>{r&&j(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)(J,{prefix: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(v.id):F.executeCommand(v.id,{unitId:e.unitId,subUnitId:e.subUnitId,commentId:e.id,temp:!1})},onMouseEnter:()=>g==null?void 0:g(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:`
|
|
52
|
-
univer-flex univer-flex-1 univer-flex-col univer-items-center univer-justify-center
|
|
53
|
-
univer-text-sm univer-text-gray-600
|
|
54
|
-
dark:!univer-text-gray-200
|
|
55
|
-
`,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:q,children:D.t(`threadCommentUI.panel.reset`)})}):_?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)(M,{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=J,e.ToggleSheetCommentPanelOperation=_,Object.defineProperty(e,`UniverThreadCommentUIPlugin`,{enumerable:!0,get:function(){return C}})});
|
|
1
|
+
(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.19.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
|
|
2
|
+
`)?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
|
|
3
|
+
`,{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),q=z==null?void 0:z.root.resolved,J=(0,n.useObservable)(H.currentUser$),Y=(0,o.useRef)(null),X=[...z?[z.root]:[{id:G,text:{dataStream:`
|
|
4
|
+
\r`},personId:(s=J==null?void 0:J.userID)==null?``:s,ref:m==null?``:m,dT:``,unitId:f,subUnitId:p,threadId:``}],...(l=z==null?void 0:z.children)==null?[]:l],Z=(0,o.useRef)(null),ee=e=>{e.stopPropagation(),q?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:!q}),D==null||D(!q)},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 Q=b((u=z==null?void 0:z.root.subUnitId)==null?p:u),ne=h&&!F&&!q,$=`${m||(z==null?void 0:z.root.ref)||``}${Q?` · `:``}${Q}`,re=`${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":!q&&(v||N||x===W.CELL)}),style:A,onClick:_,onMouseEnter:()=>{C==null||C(),P(!0)},onMouseLeave:()=>{w==null||w(),P(!1)},children:[!q&&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:$,children:(0,c.jsx)(`span`,{className:`univer-flex-1 univer-truncate`,children:$})})]}),!!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":q}),onClick:ee,children:q?(0,c.jsx)(I,{}):(0,c.jsx)(R,{})}),(J==null?void 0:J.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:Z,className:(0,a.clsx)(`univer-max-h-80 univer-overflow-y-auto univer-overflow-x-hidden`,a.scrollbarClassName),children:X.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:re,onClose:y,onEditingChange:t=>{L(t?e.id:``)},onReply:e=>{e&&requestAnimationFrame(()=>{var t;(t=Y.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:Y,type:k,unitId:f,subUnitId:p,editorId:re,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=J==null?void 0:J.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}),Z.current&&(Z.current.scrollTop=Z.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=W.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,G=U.filter(e=>!e.resolved),K=U.filter(e=>e.resolved),J=T!==`all`||C!==`all`,Y=()=>{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 X=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`),J?(0,c.jsx)(`div`,{className:`univer-mt-2 univer-flex univer-flex-row`,children:(0,c.jsx)(a.Button,{onClick:Y,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:[G.map(X),K.length>0&&(0,c.jsx)(`div`,{className:`univer-text-xs`,children:D.t(`threadCommentUI.panel.solved`)}),K.map(X)]})]})},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
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@univerjs/thread-comment-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.19.0",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Univer common thread comment UI plugin",
|
|
6
6
|
"author": "DreamNum <developer@univer.ai>",
|
|
@@ -53,20 +53,20 @@
|
|
|
53
53
|
},
|
|
54
54
|
"dependencies": {
|
|
55
55
|
"@univerjs/icons": "^1.1.1",
|
|
56
|
-
"@univerjs/core": "0.
|
|
57
|
-
"@univerjs/design": "0.
|
|
58
|
-
"@univerjs/docs-ui": "0.
|
|
59
|
-
"@univerjs/thread-comment": "0.
|
|
60
|
-
"@univerjs/ui": "0.
|
|
56
|
+
"@univerjs/core": "0.19.0",
|
|
57
|
+
"@univerjs/design": "0.19.0",
|
|
58
|
+
"@univerjs/docs-ui": "0.19.0",
|
|
59
|
+
"@univerjs/thread-comment": "0.19.0",
|
|
60
|
+
"@univerjs/ui": "0.19.0"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
63
|
"postcss": "^8.5.8",
|
|
64
64
|
"react": "18.3.1",
|
|
65
65
|
"rxjs": "^7.8.2",
|
|
66
66
|
"tailwindcss": "3.4.18",
|
|
67
|
-
"typescript": "^
|
|
68
|
-
"vitest": "^4.1.
|
|
69
|
-
"@univerjs-infra/shared": "0.
|
|
67
|
+
"typescript": "^6.0.2",
|
|
68
|
+
"vitest": "^4.1.1",
|
|
69
|
+
"@univerjs-infra/shared": "0.19.0"
|
|
70
70
|
},
|
|
71
71
|
"scripts": {
|
|
72
72
|
"test": "vitest run",
|