@univerjs/thread-comment-ui 0.2.5 → 0.2.7
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 +3 -3
- package/lib/es/index.js +549 -542
- package/lib/types/plugin.d.ts +1 -1
- package/lib/umd/index.js +3 -3
- package/package.json +20 -20
package/lib/cjs/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
"use strict";var Me=Object.defineProperty;var Ue=(n,e,t)=>e in n?Me(n,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[e]=t;var w=(n,e,t)=>Ue(n,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Pe=require("dayjs"),$=require("@univerjs/thread-comment"),l=require("@univerjs/core"),H=require("@univerjs/ui"),oe=require("rxjs"),a=require("react"),M=require("@univerjs/design"),Ne=require("clsx"),Oe=require("@univerjs/engine-render"),De=require("@univerjs/docs");function de(){return Pe().format("YYYY/MM/DD HH:mm")}const ce="thread-comment-panel",Re="THREAD_COMMENT_UI_PLUGIN";var we=Object.defineProperty,$e=Object.getOwnPropertyDescriptor,He=(n,e,t,r)=>{for(var o=r>1?void 0:r?$e(e,t):e,m=n.length-1,d;m>=0;m--)(d=n[m])&&(o=(r?d(e,t,o):d(o))||o);return r&&o&&we(e,t,o),o},le=(n,e)=>(t,r)=>e(t,r,n);exports.ThreadCommentPanelService=class extends l.Disposable{constructor(t,r){super();w(this,"_panelVisible",!1);w(this,"_panelVisible$",new oe.BehaviorSubject(!1));w(this,"_activeCommentId");w(this,"_activeCommentId$",new oe.BehaviorSubject(void 0));w(this,"panelVisible$",this._panelVisible$.asObservable());w(this,"activeCommentId$",this._activeCommentId$.asObservable());this._sidebarService=t,this._univerInstanceService=r,this._init(),this.disposeWithMe(()=>{this._activeCommentId$.complete(),this._panelVisible$.complete()})}_init(){this.disposeWithMe(this._sidebarService.sidebarOptions$.subscribe(t=>{t.visible||this.setPanelVisible(!1)})),this.disposeWithMe(this._univerInstanceService.getCurrentTypeOfUnit$(l.UniverInstanceType.UNIVER_SHEET).pipe(oe.filter(t=>!t)).subscribe(()=>{this._sidebarService.close()}))}get panelVisible(){return this._panelVisible}get activeCommentId(){return this._activeCommentId}setPanelVisible(t){this._panelVisible=t,this._panelVisible$.next(t)}setActiveComment(t){this._activeCommentId=t,this._activeCommentId$.next(t)}};exports.ThreadCommentPanelService=He([le(0,l.Inject(H.ISidebarService)),le(1,l.IUniverInstanceService)],exports.ThreadCommentPanelService);const ue={id:"thread-comment-ui.operation.toggle-panel",type:l.CommandType.OPERATION,handler(n){const e=n.get(H.ISidebarService),t=n.get(exports.ThreadCommentPanelService);return t.panelVisible?(e.close(),t.setPanelVisible(!1)):(e.open({header:{title:"threadCommentUI.panel.title"},children:{label:ce},width:320}),t.setPanelVisible(!0)),!0}},L={id:"thread-comment-ui.operation.set-active-comment",type:l.CommandType.OPERATION,handler(n,e){return n.get(exports.ThreadCommentPanelService).setActiveComment(e),!0}};class ke{constructor(){w(this,"dataSource");w(this,"renderSuggestion");w(this,"trigger","@")}async getMentions(e,t,r){return this.dataSource?this.dataSource.getMentions(e,t,r):[]}}const ie=l.createIdentifier("thread-comment.mention-data.service");var he=Object.defineProperty,Ae=Object.getOwnPropertyDescriptor,je=(n,e,t)=>e in n?he(n,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[e]=t,Le=(n,e,t,r)=>{for(var o=r>1?void 0:r?Ae(e,t):e,m=n.length-1,d;m>=0;m--)(d=n[m])&&(o=(r?d(e,t,o):d(o))||o);return r&&o&&he(e,t,o),o},me=(n,e)=>(t,r)=>e(t,r,n),ve=(n,e,t)=>je(n,typeof e!="symbol"?e+"":e,t);exports.UniverThreadCommentUIPlugin=class extends l.Plugin{constructor(e,t,r){super(),this._config=e,this._injector=t,this._commandService=r}onStarting(e){var t;l.mergeOverrideWithDependencies([[exports.ThreadCommentPanelService],[ie,{useClass:ke}]],(t=this._config)==null?void 0:t.overrides).forEach(r=>{e.add(r)}),[ue,L].forEach(r=>{this._commandService.registerCommand(r)})}};ve(exports.UniverThreadCommentUIPlugin,"pluginName",Re);ve(exports.UniverThreadCommentUIPlugin,"type",l.UniverInstanceType.UNIVER_UNKNOWN);exports.UniverThreadCommentUIPlugin=Le([l.DependentOn($.UniverThreadCommentPlugin),me(1,l.Inject(l.Injector)),me(2,l.ICommandService)],exports.UniverThreadCommentUIPlugin);var _=function(){return _=Object.assign||function(n){for(var e,t=1,r=arguments.length;t<r;t++){e=arguments[t];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o])}return n},_.apply(this,arguments)},Ve=function(n,e){var t={};for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&e.indexOf(r)<0&&(t[r]=n[r]);if(n!=null&&typeof Object.getOwnPropertySymbols=="function")for(var o=0,r=Object.getOwnPropertySymbols(n);o<r.length;o++)e.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(n,r[o])&&(t[r[o]]=n[r[o]]);return t},B=a.forwardRef(function(n,e){var t=n.icon,r=n.id,o=n.className,m=n.extend,d=Ve(n,["icon","id","className","extend"]),u="univerjs-icon univerjs-icon-".concat(r," ").concat(o||"").trim(),g=a.useRef("_".concat(qe()));return Ce(t,"".concat(r),{defIds:t.defIds,idSuffix:g.current},_({ref:e,className:u},d),m)});function Ce(n,e,t,r,o){return a.createElement(n.tag,_(_({key:e},Be(n,t,o)),r),(We(n,t).children||[]).map(function(m,d){return Ce(m,"".concat(e,"-").concat(n.tag,"-").concat(d),t,void 0,o)}))}function Be(n,e,t){var r=_({},n.attrs);t!=null&&t.colorChannel1&&r.fill==="colorChannel1"&&(r.fill=t.colorChannel1);var o=e.defIds;return!o||o.length===0||(n.tag==="use"&&r["xlink:href"]&&(r["xlink:href"]=r["xlink:href"]+e.idSuffix),Object.entries(r).forEach(function(m){var d=m[0],u=m[1];typeof u=="string"&&(r[d]=u.replace(/url\(#(.*)\)/,"url(#$1".concat(e.idSuffix,")")))})),r}function We(n,e){var t,r=e.defIds;return!r||r.length===0?n:n.tag==="defs"&&(!((t=n.children)===null||t===void 0)&&t.length)?_(_({},n),{children:n.children.map(function(o){return typeof o.attrs.id=="string"&&r&&r.indexOf(o.attrs.id)>-1?_(_({},o),{attrs:_(_({},o.attrs),{id:o.attrs.id+e.idSuffix})}):o})}):n}function qe(){return Math.random().toString(36).substring(2,8)}B.displayName="UniverIcon";var Fe={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M5.3313 1.4667C5.3313 1.13533 5.59993.866699 5.9313.866699H10.069C10.4004.866699 10.669 1.13533 10.669 1.4667 10.669 1.79807 10.4004 2.0667 10.069 2.0667H5.9313C5.59993 2.0667 5.3313 1.79807 5.3313 1.4667zM1.09985 3.64443C1.09985 3.31306 1.36848 3.04443 1.69985 3.04443H14.2999C14.6312 3.04443 14.8999 3.31306 14.8999 3.64443 14.8999 3.9758 14.6312 4.24443 14.2999 4.24443H1.69985C1.36848 4.24443 1.09985 3.9758 1.09985 3.64443zM6.12398 8.30171C6.35829 8.0674 6.73819 8.0674 6.97251 8.30171L8.00007 9.32928 9.02764 8.30171C9.26195 8.0674 9.64185 8.0674 9.87617 8.30171 10.1105 8.53603 10.1105 8.91593 9.87617 9.15024L8.8486 10.1778 9.87617 11.2054C10.1105 11.4397 10.1105 11.8196 9.87617 12.0539 9.64185 12.2882 9.26195 12.2882 9.02764 12.0539L8.00007 11.0263 6.97251 12.0539C6.73819 12.2882 6.35829 12.2882 6.12398 12.0539 5.88966 11.8196 5.88966 11.4397 6.12398 11.2054L7.15154 10.1778 6.12398 9.15024C5.88966 8.91593 5.88966 8.53603 6.12398 8.30171z"}},{tag:"path",attrs:{fill:"currentColor",d:"M4.75332 5.22217C3.86966 5.22217 3.15332 5.93851 3.15332 6.82217V12.5331C3.15332 13.9691 4.31738 15.1332 5.75332 15.1332H10.2465C11.6825 15.1332 12.8465 13.9691 12.8465 12.5331V6.82217C12.8465 5.93851 12.1302 5.22217 11.2465 5.22217H4.75332ZM4.35332 6.82217C4.35332 6.60125 4.53241 6.42217 4.75332 6.42217H11.2465C11.4674 6.42217 11.6465 6.60125 11.6465 6.82217V12.5331C11.6465 13.3063 11.0197 13.9332 10.2465 13.9332H5.75332C4.98012 13.9332 4.35332 13.3063 4.35332 12.5331V6.82217Z",fillRule:"evenodd",clipRule:"evenodd"}}]},fe=a.forwardRef(function(n,e){return a.createElement(B,Object.assign({},n,{id:"delete-single",ref:e,icon:Fe}))});fe.displayName="DeleteSingle";var ze={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M8.6 1.99991C8.60001 1.66854 8.33138 1.39991 8.00001 1.3999C7.66864 1.3999 7.40001 1.66853 7.4 1.9999L7.39996 7.3999H1.9999C1.66853 7.3999 1.3999 7.66853 1.3999 7.9999C1.3999 8.33127 1.66853 8.5999 1.9999 8.5999H7.39995L7.3999 13.9999C7.3999 14.3313 7.66853 14.5999 7.9999 14.5999C8.33127 14.5999 8.5999 14.3313 8.5999 13.9999L8.59995 8.5999H13.9999C14.3313 8.5999 14.5999 8.33127 14.5999 7.9999C14.5999 7.66853 14.3313 7.3999 13.9999 7.3999H8.59996L8.6 1.99991Z"}}]},ge=a.forwardRef(function(n,e){return a.createElement(B,Object.assign({},n,{id:"increase-single",ref:e,icon:ze}))});ge.displayName="IncreaseSingle";var Ze={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M3 9C3.55228 9 4 8.55228 4 8 4 7.44772 3.55228 7 3 7 2.44772 7 2 7.44772 2 8 2 8.55228 2.44772 9 3 9zM8 9C8.55228 9 9 8.55228 9 8 9 7.44772 8.55228 7 8 7 7.44772 7 7 7.44772 7 8 7 8.55228 7.44772 9 8 9zM13 9C13.5523 9 14 8.55228 14 8 14 7.44772 13.5523 7 13 7 12.4477 7 12 7.44772 12 8 12 8.55228 12.4477 9 13 9z"}}]},pe=a.forwardRef(function(n,e){return a.createElement(B,Object.assign({},n,{id:"more-horizontal-single",ref:e,icon:Ze}))});pe.displayName="MoreHorizontalSingle";var Ye={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{stroke:"currentColor",d:"M7.48389 10.3267V12.1905C7.48389 12.7428 7.9316 13.1905 8.48389 13.1905H11.2216L12.2955 14.2644L13.3695 13.1905H14.1593C14.7116 13.1905 15.1593 12.7428 15.1593 12.1905V8.46289C15.1593 7.91061 14.7116 7.46289 14.1593 7.46289H12.2955",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.2}},{tag:"path",attrs:{stroke:"currentColor",d:"M0.840332 3.73535C0.840332 2.63078 1.73576 1.73535 2.84033 1.73535H10.2955C11.4001 1.73535 12.2955 2.63078 12.2955 3.73535V8.32676C12.2955 9.43132 11.4001 10.3268 10.2955 10.3268H5.6014L4.1695 11.7587L3.05978 10.3268H2.84033C1.73576 10.3268 0.840332 9.43133 0.840332 8.32676V3.73535Z",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.2}},{tag:"path",attrs:{stroke:"currentColor",d:"M6.41016 6.1311H6.76813M8.91626 6.1311H9.27424M3.90454 6.1311H4.26252",strokeLinecap:"round",strokeWidth:1.2}}]},Ie=a.forwardRef(function(n,e){return a.createElement(B,Object.assign({},n,{id:"reply-to-comment-single",ref:e,icon:Ye}))});Ie.displayName="ReplyToCommentSingle";var Ge={tag:"svg",attrs:{fill:"none",viewBox:"0 0 17 17",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M8.6106 15.4036C12.4766 15.4036 15.6106 12.2696 15.6106 8.40356C15.6106 4.53757 12.4766 1.40356 8.6106 1.40356C4.7446 1.40356 1.6106 4.53757 1.6106 8.40356C1.6106 12.2696 4.7446 15.4036 8.6106 15.4036ZM12.3351 6.82773C12.5694 6.59342 12.5694 6.21352 12.3351 5.9792C12.1007 5.74489 11.7208 5.74489 11.4865 5.9792L7.91079 9.55494L6.33506 7.9792C6.10074 7.74489 5.72084 7.74489 5.48653 7.9792C5.25221 8.21352 5.25221 8.59342 5.48653 8.82773L7.48653 10.8277C7.72084 11.062 8.10074 11.062 8.33506 10.8277L12.3351 6.82773Z",fillRule:"evenodd",clipRule:"evenodd"}}]},Se=a.forwardRef(function(n,e){return a.createElement(B,Object.assign({},n,{id:"resolved-single",ref:e,icon:Ge}))});Se.displayName="ResolvedSingle";var Ke={tag:"svg",attrs:{fill:"none",viewBox:"0 0 17 17",width:"1em",height:"1em"},children:[{tag:"circle",attrs:{cx:8.73,cy:8.4,r:6.4,stroke:"currentColor",strokeWidth:1.2}},{tag:"path",attrs:{stroke:"currentColor",d:"M6.02637 8.40356L8.02637 10.4036L12.0264 6.40356",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.2}}]},be=a.forwardRef(function(n,e){return a.createElement(B,Object.assign({},n,{id:"solve-single",ref:e,icon:Ke}))});be.displayName="SolveSingle";const Je="univer-thread-comment-editor-buttons",Qe="univer-thread-comment-editor-suggestion",Xe="univer-thread-comment-editor-suggestionActive",et="univer-thread-comment-editor-suggestion-icon",re={threadCommentEditorButtons:Je,threadCommentEditorSuggestion:Qe,threadCommentEditorSuggestionActive:Xe,threadCommentEditorSuggestionIcon:et},tt=n=>{const e=/@\[(.*?)\]\((.*?)\)|(\w+)/g;let t,r=0;const o=[];for(;(t=e.exec(n))!==null;)t.index>r&&o.push({type:"text",content:n.substring(r,t.index)}),t[1]&&t[2]?o.push({type:"mention",content:{label:t[1],id:t[2]}}):t[3]&&o.push({type:"text",content:t[3]}),r=e.lastIndex;return r<n.length&&o.push({type:"text",content:n.substring(r)}),o},nt=n=>n.map(e=>{switch(e.type){case"mention":return`@[${e.content.label}](${e.content.id})`;default:return e.content}}).join(""),Ee=n=>{const{dataStream:e,customRanges:t}=n,r=e.length-2,o=[];let m=0;return t==null||t.forEach(d=>{m<d.startIndex&&o.push({type:"text",content:e.slice(m,d.startIndex)}),o.push({type:"mention",content:{label:e.slice(d.startIndex,d.endIndex).slice(1,-1),id:d.rangeId}}),m=d.endIndex}),o.push({type:"text",content:e.slice(m,r)}),o},ye=n=>{let e="";const t=[];return n.forEach(r=>{switch(r.type){case"text":e+=r.content;break;case"mention":{const o=e.length;e+=`${r.content.label}`;const m=e.length;t.push({rangeId:r.content.id,rangeType:l.CustomRangeType.MENTION,startIndex:o,endIndex:m});break}}}),e+=`
|
|
2
|
-
\r`,{textRuns:[],paragraphs:[{startIndex:
|
|
3
|
-
\r`},personId:(Z=P==null?void 0:P.userID)!=null?Z:"",ref:o!=null?o:"",dT:"",unitId:t,subUnitId:r,threadId:""}],...(W=i==null?void 0:i.children)!=null?W:[]],F=T=>{T.stopPropagation(),I?A.executeCommand(L.id,{unitId:t,subUnitId:r,commentId:e}):A.executeCommand(L.id),A.executeCommand($.ResolveCommentCommand.id,{unitId:t,subUnitId:r,commentId:e,resolved:!I}),U==null||U(!I)},Q=T=>{T.stopPropagation(),A.executeCommand(L.id),!(i!=null&&i.root&&(b==null?void 0:b(i.root))===!1)&&(A.executeCommand($.DeleteCommentTreeCommand.id,{unitId:t,subUnitId:r,commentId:e}),g==null||g())};a.useEffect(()=>v==null?void 0:v(),[]);const O=y((X=i==null?void 0:i.root.subUnitId)!=null?X:r),z=m&&!f&&!I,j=`${o||(i==null?void 0:i.root.ref)||""}${O?" · ":""}${O}`;return a.createElement("div",{className:Ne(h.threadComment,{[h.threadCommentActive]:!I&&(u||k||N==="cell")}),onClick:d,id:`${N}-${t}-${r}-${e}`,onMouseEnter:()=>{S==null||S(),C(!0)},onMouseLeave:()=>{v==null||v(),C(!1)}},!I&&u?a.createElement("div",{className:h.threadCommentHighlight}):null,a.createElement("div",{className:h.threadCommentTitle},a.createElement("div",{className:h.threadCommentTitlePosition},a.createElement("div",{className:h.threadCommentTitleHighlight}),a.createElement("div",{className:h.threadCommentTitlePositionText},j)),i?a.createElement("div",{className:h.threadCommentIconContainer},a.createElement("div",{onClick:F,className:h.threadCommentIcon,style:{color:I?"rgb(var(--green-500))":""}},I?a.createElement(Se,null):a.createElement(be,null)),(P==null?void 0:P.userID)===i.root.personId?a.createElement("div",{className:h.threadCommentIcon,onClick:Q},a.createElement(fe,null)):null):null),a.createElement("div",{className:h.threadCommentContent},J.map(T=>a.createElement(Tt,{onClose:g,unitId:t,subUnitId:r,item:T,key:T.id,isRoot:T.id===(i==null?void 0:i.root.id),editing:f===T.id,resolved:i==null?void 0:i.root.resolved,onEditingChange:D=>{c(D?T.id:"")},onReply:D=>{D&&requestAnimationFrame(()=>{var V;(V=q.current)==null||V.reply(ye([{type:"mention",content:{id:D.userID,label:D.name}}]))})},onAddComment:p,onDeleteComment:b}))),z?a.createElement("div",null,a.createElement(Te,{key:`${x}`,ref:q,unitId:t,subUnitId:r,onSave:({text:T,attachments:D})=>{const V={text:T,attachments:D,dT:de(),id:l.Tools.generateRandomId(),ref:o,personId:P==null?void 0:P.userID,parentId:i==null?void 0:i.root.id,unitId:t,subUnitId:r,threadId:i==null?void 0:i.root.threadId};(p==null?void 0:p(V))!==!1&&A.executeCommand($.AddCommentCommand.id,{unitId:t,subUnitId:r,comment:V})},autoFocus:x||!i,onCancel:()=>{i||g==null||g()}})):null)},xt="univer-thread-comment-panel",_t="univer-thread-comment",Mt="univer-thread-comment-panel-forms",Ut="univer-select",Pt="univer-thread-comment-panel-empty",Nt="univer-thread-comment-panel-add",Ot="univer-thread-comment-panel-solved",K={threadCommentPanel:xt,threadComment:_t,threadCommentPanelForms:Mt,select:Ut,threadCommentPanelEmpty:Pt,threadCommentPanelAdd:Nt,threadCommentPanelSolved:Ot},Dt=n=>{const{unitId:e,subUnitId$:t,type:r,onAdd:o,getSubUnitName:m,onResolve:d,sortComments:u,onItemLeave:g,onItemEnter:y,disableAdd:N,tempComment:x,onAddComment:S,onDeleteComment:v,showComments:p}=n,[b,U]=a.useState("all"),[E,k]=a.useState("all"),C=l.useDependency(l.LocaleService),f=l.useDependency(l.UserManagerService),c=l.useDependency($.ThreadCommentModel),[i,A]=a.useState(()=>c.getUnit(e)),ae=l.useDependency(exports.ThreadCommentPanelService),I=H.useObservable(ae.activeCommentId$),P=H.useObservable(c.commentUpdate$),q=l.useDependency(l.ICommandService),J=H.useObservable(t),F=a.useRef(!0),Q="panel",O=H.useObservable(f.currentUser$),z=a.useMemo(()=>{var te,G;const s=(b==="all"?i.map(R=>R[1]).flat():(G=(te=i.find(R=>R[0]===J))==null?void 0:te[1])!=null?G:[]).filter(R=>!R.parentId),Y=u!=null?u:R=>R,ee=s;if(p){const R=new Map;return ee.forEach(ne=>{R.set(ne.id,ne)}),[...p,""].map(ne=>R.get(ne)).filter(Boolean)}else return Y(ee)},[p,b,i,u,J]),j=a.useMemo(()=>[...z.filter(s=>!s.resolved),...z.filter(s=>s.resolved)],[z]),Z=a.useMemo(()=>E==="resolved"?j.filter(s=>s.resolved):E==="unsolved"?j.filter(s=>!s.resolved):E==="concern_me"&&O!=null&&O.userID?j.map(s=>c.getCommentWithChildren(s.unitId,s.subUnitId,s.id)).map(s=>s!=null&&s.relativeUsers.has(O.userID)?s.root:null).filter(Boolean):j,[j,O==null?void 0:O.userID,E,c]),W=x?[x,...Z]:Z,X=W.filter(s=>!s.resolved),T=W.filter(s=>s.resolved),D=E!=="all"||b!=="all",V=()=>{k("all"),U("all")};a.useEffect(()=>{e&&A(c.getUnit(e))},[e,c,P]),a.useEffect(()=>{var G;if(!I)return;if(!F.current){F.current=!0;return}const{unitId:s,subUnitId:Y,commentId:ee}=I,te=`${Q}-${s}-${Y}-${ee}`;(G=document.getElementById(te))==null||G.scrollIntoView({block:"center"})},[I]);const se=s=>a.createElement(_e,{prefix:Q,getSubUnitName:m,key:s.id,id:s.id,unitId:s.unitId,subUnitId:s.subUnitId,refStr:s.ref,type:r,showEdit:(I==null?void 0:I.commentId)===s.id,showHighlight:(I==null?void 0:I.commentId)===s.id,onClick:()=>{F.current=!1,s.resolved?q.executeCommand(L.id):q.executeCommand(L.id,{unitId:s.unitId,subUnitId:s.subUnitId,commentId:s.id,temp:!1})},onMouseEnter:()=>y==null?void 0:y(s),onMouseLeave:()=>g==null?void 0:g(s),onAddComment:S,onDeleteComment:v,onResolve:Y=>d==null?void 0:d(s.id,Y)});return a.createElement("div",{className:K.threadCommentPanel},a.createElement("div",{className:K.threadCommentPanelForms},r===l.UniverInstanceType.UNIVER_SHEET?a.createElement(M.Select,{borderless:!0,value:b,onChange:s=>U(s),options:[{value:"current",label:C.t("threadCommentUI.filter.sheet.current")},{value:"all",label:C.t("threadCommentUI.filter.sheet.all")}]}):null,a.createElement(M.Select,{borderless:!0,value:E,onChange:s=>k(s),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")}]})),X.map(se),T.length?a.createElement("div",{className:K.threadCommentPanelSolved},"已解决"):null,T.map(se),W.length?null:a.createElement("div",{className:K.threadCommentPanelEmpty},D?C.t("threadCommentUI.panel.filterEmpty"):C.t("threadCommentUI.panel.empty"),D?a.createElement(M.Button,{onClick:V,type:"link"},C.t("threadCommentUI.panel.reset")):a.createElement(M.Button,{id:"thread-comment-add",className:K.threadCommentPanelAdd,type:"primary",onClick:o,disabled:N},a.createElement(ge,null),C.t("threadCommentUI.panel.addComment"))))};exports.IThreadCommentMentionDataService=ie;exports.SetActiveCommentOperation=L;exports.THREAD_COMMENT_PANEL=ce;exports.ThreadCommentPanel=Dt;exports.ThreadCommentTree=_e;exports.ToggleSheetCommentPanelOperation=ue;exports.getDT=de;
|
|
1
|
+
"use strict";var __defProp=Object.defineProperty;var __defNormalProp=(obj,key,value)=>key in obj?__defProp(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value;var __name=(target,value)=>__defProp(target,"name",{value,configurable:!0});var __publicField=(obj,key,value)=>__defNormalProp(obj,typeof key!="symbol"?key+"":key,value);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const dayjs=require("dayjs"),threadComment$2=require("@univerjs/thread-comment"),core=require("@univerjs/core"),ui=require("@univerjs/ui"),rxjs=require("rxjs"),React=require("react"),design=require("@univerjs/design"),cs=require("clsx"),engineRender=require("@univerjs/engine-render"),docs=require("@univerjs/docs");function getDT(){return dayjs().format("YYYY/MM/DD HH:mm")}__name(getDT,"getDT");const THREAD_COMMENT_PANEL="thread-comment-panel",PLUGIN_NAME="THREAD_COMMENT_UI_PLUGIN";var __defProp$1=Object.defineProperty,__getOwnPropDesc$1=Object.getOwnPropertyDescriptor,__decorateClass$1=__name((decorators,target,key,kind)=>{for(var result=kind>1?void 0:kind?__getOwnPropDesc$1(target,key):target,i=decorators.length-1,decorator;i>=0;i--)(decorator=decorators[i])&&(result=(kind?decorator(target,key,result):decorator(result))||result);return kind&&result&&__defProp$1(target,key,result),result},"__decorateClass$1"),__decorateParam$1=__name((index,decorator)=>(target,key)=>decorator(target,key,index),"__decorateParam$1"),_a;exports.ThreadCommentPanelService=(_a=class extends core.Disposable{constructor(_sidebarService,_univerInstanceService){super();__publicField(this,"_panelVisible",!1);__publicField(this,"_panelVisible$",new rxjs.BehaviorSubject(!1));__publicField(this,"_activeCommentId");__publicField(this,"_activeCommentId$",new rxjs.BehaviorSubject(void 0));__publicField(this,"panelVisible$",this._panelVisible$.asObservable());__publicField(this,"activeCommentId$",this._activeCommentId$.asObservable());this._sidebarService=_sidebarService,this._univerInstanceService=_univerInstanceService,this._init(),this.disposeWithMe(()=>{this._activeCommentId$.complete(),this._panelVisible$.complete()})}_init(){this.disposeWithMe(this._sidebarService.sidebarOptions$.subscribe(opt=>{opt.visible||this.setPanelVisible(!1)})),this.disposeWithMe(this._univerInstanceService.getCurrentTypeOfUnit$(core.UniverInstanceType.UNIVER_SHEET).pipe(rxjs.filter(sheet=>!sheet)).subscribe(()=>{this._sidebarService.close()}))}get panelVisible(){return this._panelVisible}get activeCommentId(){return this._activeCommentId}setPanelVisible(visible){this._panelVisible=visible,this._panelVisible$.next(visible)}setActiveComment(commentInfo){this._activeCommentId=commentInfo,this._activeCommentId$.next(commentInfo)}},__name(_a,"ThreadCommentPanelService"),_a);exports.ThreadCommentPanelService=__decorateClass$1([__decorateParam$1(0,core.Inject(ui.ISidebarService)),__decorateParam$1(1,core.IUniverInstanceService)],exports.ThreadCommentPanelService);const ToggleSheetCommentPanelOperation={id:"thread-comment-ui.operation.toggle-panel",type:core.CommandType.OPERATION,handler(accessor){const sidebarService=accessor.get(ui.ISidebarService),panelService=accessor.get(exports.ThreadCommentPanelService);return panelService.panelVisible?(sidebarService.close(),panelService.setPanelVisible(!1)):(sidebarService.open({header:{title:"threadCommentUI.panel.title"},children:{label:THREAD_COMMENT_PANEL},width:320}),panelService.setPanelVisible(!0)),!0}},SetActiveCommentOperation={id:"thread-comment-ui.operation.set-active-comment",type:core.CommandType.OPERATION,handler(accessor,params){return accessor.get(exports.ThreadCommentPanelService).setActiveComment(params),!0}},_ThreadCommentMentionDataService=class _ThreadCommentMentionDataService{constructor(){__publicField(this,"dataSource");__publicField(this,"renderSuggestion");__publicField(this,"trigger","@")}async getMentions(search,unitId,subUnitId){return this.dataSource?this.dataSource.getMentions(search,unitId,subUnitId):[]}};__name(_ThreadCommentMentionDataService,"ThreadCommentMentionDataService");let ThreadCommentMentionDataService=_ThreadCommentMentionDataService;const IThreadCommentMentionDataService=core.createIdentifier("thread-comment.mention-data.service");var __defProp2=Object.defineProperty,__getOwnPropDesc=Object.getOwnPropertyDescriptor,__defNormalProp2=__name((obj,key,value)=>key in obj?__defProp2(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value,"__defNormalProp"),__decorateClass=__name((decorators,target,key,kind)=>{for(var result=kind>1?void 0:kind?__getOwnPropDesc(target,key):target,i=decorators.length-1,decorator;i>=0;i--)(decorator=decorators[i])&&(result=(kind?decorator(target,key,result):decorator(result))||result);return kind&&result&&__defProp2(target,key,result),result},"__decorateClass"),__decorateParam=__name((index,decorator)=>(target,key)=>decorator(target,key,index),"__decorateParam"),__publicField2=__name((obj,key,value)=>__defNormalProp2(obj,typeof key!="symbol"?key+"":key,value),"__publicField"),_a2;exports.UniverThreadCommentUIPlugin=(_a2=class extends core.Plugin{constructor(_config,_injector,_commandService){super(),this._config=_config,this._injector=_injector,this._commandService=_commandService}onStarting(){var _a3;core.mergeOverrideWithDependencies([[exports.ThreadCommentPanelService],[IThreadCommentMentionDataService,{useClass:ThreadCommentMentionDataService}]],(_a3=this._config)==null?void 0:_a3.overrides).forEach(dep=>{this._injector.add(dep)}),[ToggleSheetCommentPanelOperation,SetActiveCommentOperation].forEach(command=>{this._commandService.registerCommand(command)})}},__name(_a2,"UniverThreadCommentUIPlugin"),_a2);__publicField2(exports.UniverThreadCommentUIPlugin,"pluginName",PLUGIN_NAME);__publicField2(exports.UniverThreadCommentUIPlugin,"type",core.UniverInstanceType.UNIVER_UNKNOWN);exports.UniverThreadCommentUIPlugin=__decorateClass([core.DependentOn(threadComment$2.UniverThreadCommentPlugin),__decorateParam(1,core.Inject(core.Injector)),__decorateParam(2,core.ICommandService)],exports.UniverThreadCommentUIPlugin);var __assign=function(){return __assign=Object.assign||function(t){for(var s,i=1,n=arguments.length;i<n;i++){s=arguments[i];for(var p in s)Object.prototype.hasOwnProperty.call(s,p)&&(t[p]=s[p])}return t},__assign.apply(this,arguments)},__rest=function(s,e){var t={};for(var p in s)Object.prototype.hasOwnProperty.call(s,p)&&e.indexOf(p)<0&&(t[p]=s[p]);if(s!=null&&typeof Object.getOwnPropertySymbols=="function")for(var i=0,p=Object.getOwnPropertySymbols(s);i<p.length;i++)e.indexOf(p[i])<0&&Object.prototype.propertyIsEnumerable.call(s,p[i])&&(t[p[i]]=s[p[i]]);return t},IconBase=React.forwardRef(function(props,ref){var icon=props.icon,id=props.id,className=props.className,extend=props.extend,restProps=__rest(props,["icon","id","className","extend"]),cls="univerjs-icon univerjs-icon-".concat(id," ").concat(className||"").trim(),idSuffix=React.useRef("_".concat(generateShortUuid()));return render(icon,"".concat(id),{defIds:icon.defIds,idSuffix:idSuffix.current},__assign({ref,className:cls},restProps),extend)});function render(node,id,runtimeProps,rootProps,extend){return React.createElement(node.tag,__assign(__assign({key:id},replaceRuntimeIdsAndExtInAttrs(node,runtimeProps,extend)),rootProps),(replaceRuntimeIdsInDefs(node,runtimeProps).children||[]).map(function(child,index){return render(child,"".concat(id,"-").concat(node.tag,"-").concat(index),runtimeProps,void 0,extend)}))}__name(render,"render");function replaceRuntimeIdsAndExtInAttrs(node,runtimeProps,extend){var attrs=__assign({},node.attrs);extend!=null&&extend.colorChannel1&&attrs.fill==="colorChannel1"&&(attrs.fill=extend.colorChannel1);var defIds=runtimeProps.defIds;return!defIds||defIds.length===0||(node.tag==="use"&&attrs["xlink:href"]&&(attrs["xlink:href"]=attrs["xlink:href"]+runtimeProps.idSuffix),Object.entries(attrs).forEach(function(_a3){var key=_a3[0],value=_a3[1];typeof value=="string"&&(attrs[key]=value.replace(/url\(#(.*)\)/,"url(#$1".concat(runtimeProps.idSuffix,")")))})),attrs}__name(replaceRuntimeIdsAndExtInAttrs,"replaceRuntimeIdsAndExtInAttrs");function replaceRuntimeIdsInDefs(node,runtimeProps){var _a3,defIds=runtimeProps.defIds;return!defIds||defIds.length===0?node:node.tag==="defs"&&(!((_a3=node.children)===null||_a3===void 0)&&_a3.length)?__assign(__assign({},node),{children:node.children.map(function(child){return typeof child.attrs.id=="string"&&defIds&&defIds.indexOf(child.attrs.id)>-1?__assign(__assign({},child),{attrs:__assign(__assign({},child.attrs),{id:child.attrs.id+runtimeProps.idSuffix})}):child})}):node}__name(replaceRuntimeIdsInDefs,"replaceRuntimeIdsInDefs");function generateShortUuid(){return Math.random().toString(36).substring(2,8)}__name(generateShortUuid,"generateShortUuid");IconBase.displayName="UniverIcon";var element$5={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M5.3313 1.4667C5.3313 1.13533 5.59993.866699 5.9313.866699H10.069C10.4004.866699 10.669 1.13533 10.669 1.4667 10.669 1.79807 10.4004 2.0667 10.069 2.0667H5.9313C5.59993 2.0667 5.3313 1.79807 5.3313 1.4667zM1.09985 3.64443C1.09985 3.31306 1.36848 3.04443 1.69985 3.04443H14.2999C14.6312 3.04443 14.8999 3.31306 14.8999 3.64443 14.8999 3.9758 14.6312 4.24443 14.2999 4.24443H1.69985C1.36848 4.24443 1.09985 3.9758 1.09985 3.64443zM6.12398 8.30171C6.35829 8.0674 6.73819 8.0674 6.97251 8.30171L8.00007 9.32928 9.02764 8.30171C9.26195 8.0674 9.64185 8.0674 9.87617 8.30171 10.1105 8.53603 10.1105 8.91593 9.87617 9.15024L8.8486 10.1778 9.87617 11.2054C10.1105 11.4397 10.1105 11.8196 9.87617 12.0539 9.64185 12.2882 9.26195 12.2882 9.02764 12.0539L8.00007 11.0263 6.97251 12.0539C6.73819 12.2882 6.35829 12.2882 6.12398 12.0539 5.88966 11.8196 5.88966 11.4397 6.12398 11.2054L7.15154 10.1778 6.12398 9.15024C5.88966 8.91593 5.88966 8.53603 6.12398 8.30171z"}},{tag:"path",attrs:{fill:"currentColor",d:"M4.75332 5.22217C3.86966 5.22217 3.15332 5.93851 3.15332 6.82217V12.5331C3.15332 13.9691 4.31738 15.1332 5.75332 15.1332H10.2465C11.6825 15.1332 12.8465 13.9691 12.8465 12.5331V6.82217C12.8465 5.93851 12.1302 5.22217 11.2465 5.22217H4.75332ZM4.35332 6.82217C4.35332 6.60125 4.53241 6.42217 4.75332 6.42217H11.2465C11.4674 6.42217 11.6465 6.60125 11.6465 6.82217V12.5331C11.6465 13.3063 11.0197 13.9332 10.2465 13.9332H5.75332C4.98012 13.9332 4.35332 13.3063 4.35332 12.5331V6.82217Z",fillRule:"evenodd",clipRule:"evenodd"}}]},DeleteSingle=React.forwardRef(function(props,ref){return React.createElement(IconBase,Object.assign({},props,{id:"delete-single",ref,icon:element$5}))});DeleteSingle.displayName="DeleteSingle";var element$4={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M8.6 1.99991C8.60001 1.66854 8.33138 1.39991 8.00001 1.3999C7.66864 1.3999 7.40001 1.66853 7.4 1.9999L7.39996 7.3999H1.9999C1.66853 7.3999 1.3999 7.66853 1.3999 7.9999C1.3999 8.33127 1.66853 8.5999 1.9999 8.5999H7.39995L7.3999 13.9999C7.3999 14.3313 7.66853 14.5999 7.9999 14.5999C8.33127 14.5999 8.5999 14.3313 8.5999 13.9999L8.59995 8.5999H13.9999C14.3313 8.5999 14.5999 8.33127 14.5999 7.9999C14.5999 7.66853 14.3313 7.3999 13.9999 7.3999H8.59996L8.6 1.99991Z"}}]},IncreaseSingle=React.forwardRef(function(props,ref){return React.createElement(IconBase,Object.assign({},props,{id:"increase-single",ref,icon:element$4}))});IncreaseSingle.displayName="IncreaseSingle";var element$3={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M3 9C3.55228 9 4 8.55228 4 8 4 7.44772 3.55228 7 3 7 2.44772 7 2 7.44772 2 8 2 8.55228 2.44772 9 3 9zM8 9C8.55228 9 9 8.55228 9 8 9 7.44772 8.55228 7 8 7 7.44772 7 7 7.44772 7 8 7 8.55228 7.44772 9 8 9zM13 9C13.5523 9 14 8.55228 14 8 14 7.44772 13.5523 7 13 7 12.4477 7 12 7.44772 12 8 12 8.55228 12.4477 9 13 9z"}}]},MoreHorizontalSingle=React.forwardRef(function(props,ref){return React.createElement(IconBase,Object.assign({},props,{id:"more-horizontal-single",ref,icon:element$3}))});MoreHorizontalSingle.displayName="MoreHorizontalSingle";var element$2={tag:"svg",attrs:{fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{stroke:"currentColor",d:"M7.48389 10.3267V12.1905C7.48389 12.7428 7.9316 13.1905 8.48389 13.1905H11.2216L12.2955 14.2644L13.3695 13.1905H14.1593C14.7116 13.1905 15.1593 12.7428 15.1593 12.1905V8.46289C15.1593 7.91061 14.7116 7.46289 14.1593 7.46289H12.2955",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.2}},{tag:"path",attrs:{stroke:"currentColor",d:"M0.840332 3.73535C0.840332 2.63078 1.73576 1.73535 2.84033 1.73535H10.2955C11.4001 1.73535 12.2955 2.63078 12.2955 3.73535V8.32676C12.2955 9.43132 11.4001 10.3268 10.2955 10.3268H5.6014L4.1695 11.7587L3.05978 10.3268H2.84033C1.73576 10.3268 0.840332 9.43133 0.840332 8.32676V3.73535Z",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.2}},{tag:"path",attrs:{stroke:"currentColor",d:"M6.41016 6.1311H6.76813M8.91626 6.1311H9.27424M3.90454 6.1311H4.26252",strokeLinecap:"round",strokeWidth:1.2}}]},ReplyToCommentSingle=React.forwardRef(function(props,ref){return React.createElement(IconBase,Object.assign({},props,{id:"reply-to-comment-single",ref,icon:element$2}))});ReplyToCommentSingle.displayName="ReplyToCommentSingle";var element$1={tag:"svg",attrs:{fill:"none",viewBox:"0 0 17 17",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M8.6106 15.4036C12.4766 15.4036 15.6106 12.2696 15.6106 8.40356C15.6106 4.53757 12.4766 1.40356 8.6106 1.40356C4.7446 1.40356 1.6106 4.53757 1.6106 8.40356C1.6106 12.2696 4.7446 15.4036 8.6106 15.4036ZM12.3351 6.82773C12.5694 6.59342 12.5694 6.21352 12.3351 5.9792C12.1007 5.74489 11.7208 5.74489 11.4865 5.9792L7.91079 9.55494L6.33506 7.9792C6.10074 7.74489 5.72084 7.74489 5.48653 7.9792C5.25221 8.21352 5.25221 8.59342 5.48653 8.82773L7.48653 10.8277C7.72084 11.062 8.10074 11.062 8.33506 10.8277L12.3351 6.82773Z",fillRule:"evenodd",clipRule:"evenodd"}}]},ResolvedSingle=React.forwardRef(function(props,ref){return React.createElement(IconBase,Object.assign({},props,{id:"resolved-single",ref,icon:element$1}))});ResolvedSingle.displayName="ResolvedSingle";var element={tag:"svg",attrs:{fill:"none",viewBox:"0 0 17 17",width:"1em",height:"1em"},children:[{tag:"circle",attrs:{cx:8.73,cy:8.4,r:6.4,stroke:"currentColor",strokeWidth:1.2}},{tag:"path",attrs:{stroke:"currentColor",d:"M6.02637 8.40356L8.02637 10.4036L12.0264 6.40356",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.2}}]},SolveSingle=React.forwardRef(function(props,ref){return React.createElement(IconBase,Object.assign({},props,{id:"solve-single",ref,icon:element}))});SolveSingle.displayName="SolveSingle";const threadCommentEditorButtons="univer-thread-comment-editor-buttons",threadCommentEditorSuggestion="univer-thread-comment-editor-suggestion",threadCommentEditorSuggestionActive="univer-thread-comment-editor-suggestionActive",threadCommentEditorSuggestionIcon="univer-thread-comment-editor-suggestion-icon",styles$2={threadCommentEditorButtons,threadCommentEditorSuggestion,threadCommentEditorSuggestionActive,threadCommentEditorSuggestionIcon},parseMentions=__name(text=>{const regex=/@\[(.*?)\]\((.*?)\)|(\w+)/g;let match,lastIndex=0;const result=[];for(;(match=regex.exec(text))!==null;)match.index>lastIndex&&result.push({type:"text",content:text.substring(lastIndex,match.index)}),match[1]&&match[2]?result.push({type:"mention",content:{label:match[1],id:match[2]}}):match[3]&&result.push({type:"text",content:match[3]}),lastIndex=regex.lastIndex;return lastIndex<text.length&&result.push({type:"text",content:text.substring(lastIndex)}),result},"parseMentions"),transformTextNode2Text=__name(nodes=>nodes.map(item=>{switch(item.type){case"mention":return`@[${item.content.label}](${item.content.id})`;default:return item.content}}).join(""),"transformTextNode2Text"),transformDocument2TextNodes=__name(doc=>{const{dataStream,customRanges}=doc,end=dataStream.length-2,textNodes=[];let lastIndex=0;return customRanges==null||customRanges.forEach(range=>{lastIndex<range.startIndex&&textNodes.push({type:"text",content:dataStream.slice(lastIndex,range.startIndex)}),textNodes.push({type:"mention",content:{label:dataStream.slice(range.startIndex,range.endIndex).slice(1,-1),id:range.rangeId}}),lastIndex=range.endIndex}),textNodes.push({type:"text",content:dataStream.slice(lastIndex,end)}),textNodes},"transformDocument2TextNodes"),transformTextNodes2Document=__name(nodes=>{let str="";const customRanges=[];return nodes.forEach(node=>{switch(node.type){case"text":str+=node.content;break;case"mention":{const start=str.length;str+=`${node.content.label}`;const end=str.length;customRanges.push({rangeId:node.content.id,rangeType:core.CustomRangeType.MENTION,startIndex:start,endIndex:end});break}}}),str+=`
|
|
2
|
+
\r`,{textRuns:[],paragraphs:[{startIndex:str.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:str.length-1}],dataStream:str,customRanges}},"transformTextNodes2Document"),transformMention=__name(mention=>({display:mention.label,id:`${mention.id}`,raw:mention}),"transformMention"),defaultRenderSuggestion=__name((mention,search,highlightedDisplay,index,focused)=>{var _a3,_b;const icon=(_a3=mention.raw)==null?void 0:_a3.icon;return React.createElement("div",{className:styles$2.threadCommentEditorSuggestion},icon?React.createElement("img",{className:styles$2.threadCommentEditorSuggestionIcon,src:icon}):null,React.createElement("div",null,(_b=mention.display)!=null?_b:mention.id))},"defaultRenderSuggestion"),ThreadCommentEditor=React.forwardRef((props,ref)=>{var _a3;const{comment,onSave,id,onCancel,autoFocus,unitId,subUnitId}=props,mentionDataService=core.useDependency(IThreadCommentMentionDataService),commandService=core.useDependency(core.ICommandService),localeService=core.useDependency(core.LocaleService),[localComment,setLocalComment]=React.useState({...comment}),[editing,setEditing]=React.useState(!1),inputRef=React.useRef(null),textSelectionRenderManager=core.useDependency(engineRender.ITextSelectionRenderManager),textSelectionManagerService=core.useDependency(docs.TextSelectionManagerService);return React.useImperativeHandle(ref,()=>({reply(text){var _a4;setLocalComment({...comment,text,attachments:[]}),(_a4=inputRef.current)==null||_a4.inputElement.focus()}})),React.createElement("div",{className:styles$2.threadCommentEditor,onClick:__name(e=>e.preventDefault(),"onClick")},React.createElement(design.Mentions,{ref:inputRef,autoFocus,style:{width:"100%"},placeholder:localeService.t("threadCommentUI.editor.placeholder"),value:localComment!=null&&localComment.text?transformTextNode2Text(transformDocument2TextNodes(localComment.text)):"",onChange:__name(e=>{e.target.value||setLocalComment({...comment,text:void 0}),setLocalComment==null||setLocalComment({...comment,text:transformTextNodes2Document(parseMentions(e.target.value))})},"onChange"),onFocus:__name(()=>{const activeRange=textSelectionManagerService.getActiveTextRangeWithStyle();activeRange&&activeRange.collapsed&&textSelectionRenderManager.removeAllRanges(),textSelectionRenderManager.blur(),setEditing(!0)},"onFocus")},React.createElement(design.Mention,{key:mentionDataService.trigger,trigger:mentionDataService.trigger,data:__name((query,callback)=>mentionDataService.getMentions(query,unitId,subUnitId).then(res=>res.map(transformMention)).then(callback),"data"),displayTransform:__name((id2,label)=>`@${label} `,"displayTransform"),renderSuggestion:(_a3=mentionDataService.renderSuggestion)!=null?_a3:defaultRenderSuggestion})),editing?React.createElement("div",{className:styles$2.threadCommentEditorButtons},React.createElement(design.Button,{style:{marginRight:12},onClick:__name(()=>{onCancel==null||onCancel(),setEditing(!1),setLocalComment({text:void 0}),commandService.executeCommand(SetActiveCommentOperation.id)},"onClick")},localeService.t("threadCommentUI.editor.cancel")),React.createElement(design.Button,{type:"primary",disabled:!localComment.text,onClick:__name(()=>{localComment.text&&(onSave==null||onSave({...localComment,text:localComment.text}),setEditing(!1),setLocalComment({text:void 0}))},"onClick")},localeService.t(id?"threadCommentUI.editor.save":"threadCommentUI.editor.reply"))):null)}),threadComment$1="univer-thread-comment",threadCommentActive="univer-thread-comment-active",threadCommentContent="univer-thread-comment-content",threadCommentHighlight="univer-thread-comment-highlight",threadCommentIconContainer="univer-thread-comment-icon-container",threadCommentIcon="univer-thread-comment-icon",threadCommentTitle="univer-thread-comment-title",threadCommentTitlePosition="univer-thread-comment-title-position",threadCommentTitleHighlight="univer-thread-comment-title-highlight",threadCommentTitlePositionText="univer-thread-comment-title-position-text",threadCommentUsername="univer-thread-comment-username",threadCommentItem="univer-thread-comment-item",threadCommentItemHead="univer-thread-comment-item-head",threadCommentItemTitle="univer-thread-comment-item-title",threadCommentItemTitlePosition="univer-thread-comment-item-title-position",threadCommentItemTitleHighlight="univer-thread-comment-item-title-highlight",threadCommentItemTime="univer-thread-comment-item-time",threadCommentItemContent="univer-thread-comment-item-content",threadCommentItemAt="univer-thread-comment-item-at",styles$1={threadComment:threadComment$1,threadCommentActive,threadCommentContent,threadCommentHighlight,threadCommentIconContainer,threadCommentIcon,threadCommentTitle,threadCommentTitlePosition,threadCommentTitleHighlight,threadCommentTitlePositionText,threadCommentUsername,threadCommentItem,threadCommentItemHead,threadCommentItemTitle,threadCommentItemTitlePosition,threadCommentItemTitleHighlight,threadCommentItemTime,threadCommentItemContent,threadCommentItemAt},MOCK_ID="__mock__",ThreadCommentItem=__name(props=>{const{item,unitId,subUnitId,editing,onEditingChange,onReply,resolved,isRoot,onClose,onDeleteComment}=props,commandService=core.useDependency(core.ICommandService),localeService=core.useDependency(core.LocaleService),userManagerService=core.useDependency(core.UserManagerService),user=userManagerService.getUser(item.personId),currentUser=ui.useObservable(userManagerService.currentUser$),isCommentBySelf=(currentUser==null?void 0:currentUser.userID)===item.personId,isMock=item.id===MOCK_ID,[showReply,setShowReply]=React.useState(!1),handleDeleteItem=__name(()=>{(onDeleteComment==null?void 0:onDeleteComment(item))!==!1&&(commandService.executeCommand(isRoot?threadComment$2.DeleteCommentTreeCommand.id:threadComment$2.DeleteCommentCommand.id,{unitId,subUnitId,commentId:item.id}),isRoot&&(onClose==null||onClose()))},"handleDeleteItem");return React.createElement("div",{className:styles$1.threadCommentItem,onMouseLeave:__name(()=>setShowReply(!1),"onMouseLeave"),onMouseEnter:__name(()=>setShowReply(!0),"onMouseEnter")},React.createElement("img",{className:styles$1.threadCommentItemHead,src:user==null?void 0:user.avatar}),React.createElement("div",{className:styles$1.threadCommentItemTitle},React.createElement("div",{className:styles$1.threadCommentUsername},(user==null?void 0:user.name)||" "),React.createElement("div",null,isMock||resolved?null:showReply?React.createElement("div",{className:styles$1.threadCommentIcon,onClick:__name(()=>onReply(user),"onClick")},React.createElement(ReplyToCommentSingle,null)):null,isCommentBySelf&&!isMock&&!resolved?React.createElement(design.Dropdown,{overlay:React.createElement(design.Menu,null,React.createElement(design.MenuItem,{key:"edit",onClick:__name(()=>onEditingChange==null?void 0:onEditingChange(!0),"onClick")},localeService.t("threadCommentUI.item.edit")),React.createElement(design.MenuItem,{key:"delete",onClick:handleDeleteItem},localeService.t("threadCommentUI.item.delete")))},React.createElement("div",{className:styles$1.threadCommentIcon},React.createElement(MoreHorizontalSingle,null))):null)),React.createElement("div",{className:styles$1.threadCommentItemTime},item.dT),editing?React.createElement(ThreadCommentEditor,{id:item.id,comment:item,onCancel:__name(()=>onEditingChange==null?void 0:onEditingChange(!1),"onCancel"),autoFocus:!0,unitId,subUnitId,onSave:__name(({text,attachments})=>{onEditingChange==null||onEditingChange(!1),commandService.executeCommand(threadComment$2.UpdateCommentCommand.id,{unitId,subUnitId,payload:{commentId:item.id,text,attachments}})},"onSave")}):React.createElement("div",{className:styles$1.threadCommentItemContent},transformDocument2TextNodes(item.text).map((item2,i)=>{switch(item2.type){case"mention":return React.createElement("a",{className:styles$1.threadCommentItemAt,key:i},"@",item2.content.label," ");default:return item2.content}})))},"ThreadCommentItem"),ThreadCommentTree=__name(props=>{var _a3,_b,_c;const{id,unitId,subUnitId,refStr,showEdit=!0,onClick,showHighlight,onClose,getSubUnitName,prefix,autoFocus,onMouseEnter,onMouseLeave,onAddComment,onDeleteComment,onResolve}=props,threadCommentModel=core.useDependency(threadComment$2.ThreadCommentModel),[isHover,setIsHover]=React.useState(!1),[editingId,setEditingId]=React.useState("");ui.useObservable(threadCommentModel.commentMap$);const comments=id?threadCommentModel.getCommentWithChildren(unitId,subUnitId,id):null,commandService=core.useDependency(core.ICommandService),userManagerService=core.useDependency(core.UserManagerService),resolved=comments==null?void 0:comments.root.resolved,currentUser=ui.useObservable(userManagerService.currentUser$),editorRef=React.useRef(null),renderComments=[...comments?[comments.root]:[{id:MOCK_ID,text:{dataStream:`
|
|
3
|
+
\r`},personId:(_a3=currentUser==null?void 0:currentUser.userID)!=null?_a3:"",ref:refStr!=null?refStr:"",dT:"",unitId,subUnitId,threadId:""}],...(_b=comments==null?void 0:comments.children)!=null?_b:[]],handleResolve=__name(e=>{e.stopPropagation(),resolved?commandService.executeCommand(SetActiveCommentOperation.id,{unitId,subUnitId,commentId:id}):commandService.executeCommand(SetActiveCommentOperation.id),commandService.executeCommand(threadComment$2.ResolveCommentCommand.id,{unitId,subUnitId,commentId:id,resolved:!resolved}),onResolve==null||onResolve(!resolved)},"handleResolve"),handleDeleteRoot=__name(e=>{e.stopPropagation(),commandService.executeCommand(SetActiveCommentOperation.id),!(comments!=null&&comments.root&&(onDeleteComment==null?void 0:onDeleteComment(comments.root))===!1)&&(commandService.executeCommand(threadComment$2.DeleteCommentTreeCommand.id,{unitId,subUnitId,commentId:id}),onClose==null||onClose())},"handleDeleteRoot");React.useEffect(()=>onMouseLeave==null?void 0:onMouseLeave(),[]);const subUnitName=getSubUnitName((_c=comments==null?void 0:comments.root.subUnitId)!=null?_c:subUnitId),editorVisible=showEdit&&!editingId&&!resolved,title=`${refStr||(comments==null?void 0:comments.root.ref)||""}${subUnitName?" · ":""}${subUnitName}`;return React.createElement("div",{className:cs(styles$1.threadComment,{[styles$1.threadCommentActive]:!resolved&&(showHighlight||isHover||prefix==="cell")}),onClick,id:`${prefix}-${unitId}-${subUnitId}-${id}`,onMouseEnter:__name(()=>{onMouseEnter==null||onMouseEnter(),setIsHover(!0)},"onMouseEnter"),onMouseLeave:__name(()=>{onMouseLeave==null||onMouseLeave(),setIsHover(!1)},"onMouseLeave")},!resolved&&showHighlight?React.createElement("div",{className:styles$1.threadCommentHighlight}):null,React.createElement("div",{className:styles$1.threadCommentTitle},React.createElement("div",{className:styles$1.threadCommentTitlePosition},React.createElement("div",{className:styles$1.threadCommentTitleHighlight}),React.createElement("div",{className:styles$1.threadCommentTitlePositionText},title)),comments?React.createElement("div",{className:styles$1.threadCommentIconContainer},React.createElement("div",{onClick:handleResolve,className:styles$1.threadCommentIcon,style:{color:resolved?"rgb(var(--green-500))":""}},resolved?React.createElement(ResolvedSingle,null):React.createElement(SolveSingle,null)),(currentUser==null?void 0:currentUser.userID)===comments.root.personId?React.createElement("div",{className:styles$1.threadCommentIcon,onClick:handleDeleteRoot},React.createElement(DeleteSingle,null)):null):null),React.createElement("div",{className:styles$1.threadCommentContent},renderComments.map(item=>React.createElement(ThreadCommentItem,{onClose,unitId,subUnitId,item,key:item.id,isRoot:item.id===(comments==null?void 0:comments.root.id),editing:editingId===item.id,resolved:comments==null?void 0:comments.root.resolved,onEditingChange:__name(editing=>{setEditingId(editing?item.id:"")},"onEditingChange"),onReply:__name(user=>{user&&requestAnimationFrame(()=>{var _a4;(_a4=editorRef.current)==null||_a4.reply(transformTextNodes2Document([{type:"mention",content:{id:user.userID,label:user.name}}]))})},"onReply"),onAddComment,onDeleteComment}))),editorVisible?React.createElement("div",null,React.createElement(ThreadCommentEditor,{key:`${autoFocus}`,ref:editorRef,unitId,subUnitId,onSave:__name(({text,attachments})=>{const comment={text,attachments,dT:getDT(),id:core.Tools.generateRandomId(),ref:refStr,personId:currentUser==null?void 0:currentUser.userID,parentId:comments==null?void 0:comments.root.id,unitId,subUnitId,threadId:comments==null?void 0:comments.root.threadId};(onAddComment==null?void 0:onAddComment(comment))!==!1&&commandService.executeCommand(threadComment$2.AddCommentCommand.id,{unitId,subUnitId,comment})},"onSave"),autoFocus:autoFocus||!comments,onCancel:__name(()=>{comments||onClose==null||onClose()},"onCancel")})):null)},"ThreadCommentTree"),threadCommentPanel="univer-thread-comment-panel",threadComment="univer-thread-comment",threadCommentPanelForms="univer-thread-comment-panel-forms",select="univer-select",threadCommentPanelEmpty="univer-thread-comment-panel-empty",threadCommentPanelAdd="univer-thread-comment-panel-add",threadCommentPanelSolved="univer-thread-comment-panel-solved",styles={threadCommentPanel,threadComment,threadCommentPanelForms,select,threadCommentPanelEmpty,threadCommentPanelAdd,threadCommentPanelSolved},ThreadCommentPanel=__name(props=>{const{unitId,subUnitId$,type,onAdd,getSubUnitName,onResolve,sortComments,onItemLeave,onItemEnter,disableAdd,tempComment,onAddComment,onDeleteComment,showComments}=props,[unit,setUnit]=React.useState("all"),[status,setStatus]=React.useState("all"),localeService=core.useDependency(core.LocaleService),userService=core.useDependency(core.UserManagerService),threadCommentModel=core.useDependency(threadComment$2.ThreadCommentModel),[unitComments,setUnitComments]=React.useState(()=>threadCommentModel.getUnit(unitId)),panelService=core.useDependency(exports.ThreadCommentPanelService),activeCommentId=ui.useObservable(panelService.activeCommentId$),update=ui.useObservable(threadCommentModel.commentUpdate$),commandService=core.useDependency(core.ICommandService),subUnitId=ui.useObservable(subUnitId$),shouldScroll=React.useRef(!0),prefix="panel",currentUser=ui.useObservable(userService.currentUser$),comments=React.useMemo(()=>{var _a3,_b;const allComments=(unit==="all"?unitComments.map(i=>i[1]).flat():(_b=(_a3=unitComments.find(i=>i[0]===subUnitId))==null?void 0:_a3[1])!=null?_b:[]).filter(i=>!i.parentId),sort=sortComments!=null?sortComments:a=>a,res=allComments;if(showComments){const map=new Map;return res.forEach(comment=>{map.set(comment.id,comment)}),[...showComments,""].map(id=>map.get(id)).filter(Boolean)}else return sort(res)},[showComments,unit,unitComments,sortComments,subUnitId]),commentsSorted=React.useMemo(()=>[...comments.filter(comment=>!comment.resolved),...comments.filter(comment=>comment.resolved)],[comments]),statuedComments=React.useMemo(()=>status==="resolved"?commentsSorted.filter(comment=>comment.resolved):status==="unsolved"?commentsSorted.filter(comment=>!comment.resolved):status==="concern_me"&¤tUser!=null&¤tUser.userID?commentsSorted.map(comment=>threadCommentModel.getCommentWithChildren(comment.unitId,comment.subUnitId,comment.id)).map(comment=>comment!=null&&comment.relativeUsers.has(currentUser.userID)?comment.root:null).filter(Boolean):commentsSorted,[commentsSorted,currentUser==null?void 0:currentUser.userID,status,threadCommentModel]),renderComments=tempComment?[tempComment,...statuedComments]:statuedComments,unSolvedComments=renderComments.filter(comment=>!comment.resolved),solvedComments=renderComments.filter(comment=>comment.resolved),isFiltering=status!=="all"||unit!=="all",onReset=__name(()=>{setStatus("all"),setUnit("all")},"onReset");React.useEffect(()=>{unitId&&setUnitComments(threadCommentModel.getUnit(unitId))},[unitId,threadCommentModel,update]),React.useEffect(()=>{var _a3;if(!activeCommentId)return;if(!shouldScroll.current){shouldScroll.current=!0;return}const{unitId:unitId2,subUnitId:subUnitId2,commentId}=activeCommentId,id=`${prefix}-${unitId2}-${subUnitId2}-${commentId}`;(_a3=document.getElementById(id))==null||_a3.scrollIntoView({block:"center"})},[activeCommentId]);const renderComment=__name(comment=>React.createElement(ThreadCommentTree,{prefix,getSubUnitName,key:comment.id,id:comment.id,unitId:comment.unitId,subUnitId:comment.subUnitId,refStr:comment.ref,type,showEdit:(activeCommentId==null?void 0:activeCommentId.commentId)===comment.id,showHighlight:(activeCommentId==null?void 0:activeCommentId.commentId)===comment.id,onClick:__name(()=>{shouldScroll.current=!1,comment.resolved?commandService.executeCommand(SetActiveCommentOperation.id):commandService.executeCommand(SetActiveCommentOperation.id,{unitId:comment.unitId,subUnitId:comment.subUnitId,commentId:comment.id,temp:!1})},"onClick"),onMouseEnter:__name(()=>onItemEnter==null?void 0:onItemEnter(comment),"onMouseEnter"),onMouseLeave:__name(()=>onItemLeave==null?void 0:onItemLeave(comment),"onMouseLeave"),onAddComment,onDeleteComment,onResolve:__name(resolved=>onResolve==null?void 0:onResolve(comment.id,resolved),"onResolve")}),"renderComment");return React.createElement("div",{className:styles.threadCommentPanel},React.createElement("div",{className:styles.threadCommentPanelForms},type===core.UniverInstanceType.UNIVER_SHEET?React.createElement(design.Select,{borderless:!0,value:unit,onChange:__name(e=>setUnit(e),"onChange"),options:[{value:"current",label:localeService.t("threadCommentUI.filter.sheet.current")},{value:"all",label:localeService.t("threadCommentUI.filter.sheet.all")}]}):null,React.createElement(design.Select,{borderless:!0,value:status,onChange:__name(e=>setStatus(e),"onChange"),options:[{value:"all",label:localeService.t("threadCommentUI.filter.status.all")},{value:"resolved",label:localeService.t("threadCommentUI.filter.status.resolved")},{value:"unsolved",label:localeService.t("threadCommentUI.filter.status.unsolved")},{value:"concern_me",label:localeService.t("threadCommentUI.filter.status.concernMe")}]})),unSolvedComments.map(renderComment),solvedComments.length?React.createElement("div",{className:styles.threadCommentPanelSolved},"已解决"):null,solvedComments.map(renderComment),renderComments.length?null:React.createElement("div",{className:styles.threadCommentPanelEmpty},isFiltering?localeService.t("threadCommentUI.panel.filterEmpty"):localeService.t("threadCommentUI.panel.empty"),isFiltering?React.createElement(design.Button,{onClick:onReset,type:"link"},localeService.t("threadCommentUI.panel.reset")):React.createElement(design.Button,{id:"thread-comment-add",className:styles.threadCommentPanelAdd,type:"primary",onClick:onAdd,disabled:disableAdd},React.createElement(IncreaseSingle,null),localeService.t("threadCommentUI.panel.addComment"))))},"ThreadCommentPanel");exports.IThreadCommentMentionDataService=IThreadCommentMentionDataService;exports.SetActiveCommentOperation=SetActiveCommentOperation;exports.THREAD_COMMENT_PANEL=THREAD_COMMENT_PANEL;exports.ThreadCommentPanel=ThreadCommentPanel;exports.ThreadCommentTree=ThreadCommentTree;exports.ToggleSheetCommentPanelOperation=ToggleSheetCommentPanelOperation;exports.getDT=getDT;
|