@univerjs/thread-comment-ui 0.2.4-alpha.0 → 0.2.5

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/umd/index.js CHANGED
@@ -1,3 +1,3 @@
1
- (function(d,U){typeof exports=="object"&&typeof module<"u"?U(exports,require("dayjs"),require("@univerjs/thread-comment"),require("@univerjs/core"),require("@univerjs/ui"),require("rxjs"),require("react"),require("@univerjs/design"),require("clsx"),require("@univerjs/engine-render"),require("@univerjs/docs")):typeof define=="function"&&define.amd?define(["exports","dayjs","@univerjs/thread-comment","@univerjs/core","@univerjs/ui","rxjs","react","@univerjs/design","clsx","@univerjs/engine-render","@univerjs/docs"],U):(d=typeof globalThis<"u"?globalThis:d||self,U(d.UniverThreadCommentUi={},d.dayjs,d.UniverThreadComment,d.UniverCore,d.UniverUi,d.rxjs,d.React,d.UniverDesign,d.clsx,d.UniverEngineRender,d.UniverDocs))})(this,function(d,U,T,a,L,me,i,x,Ne,Oe,De){"use strict";var mt=Object.defineProperty;var st=(d,U,T)=>U in d?mt(d,U,{enumerable:!0,configurable:!0,writable:!0,value:T}):d[U]=T;var A=(d,U,T)=>st(d,typeof U!="symbol"?U+"":U,T);function de(){return U().format("YYYY/MM/DD HH:mm")}const ce="thread-comment-panel",we="THREAD_COMMENT_UI_PLUGIN";var He=Object.defineProperty,je=Object.getOwnPropertyDescriptor,$e=(n,e,t,r)=>{for(var o=r>1?void 0:r?je(e,t):e,m=n.length-1,c;m>=0;m--)(c=n[m])&&(o=(r?c(e,t,o):c(o))||o);return r&&o&&He(e,t,o),o},ue=(n,e)=>(t,r)=>e(t,r,n);d.ThreadCommentPanelService=class extends a.Disposable{constructor(t,r){super();A(this,"_panelVisible",!1);A(this,"_panelVisible$",new me.BehaviorSubject(!1));A(this,"_activeCommentId");A(this,"_activeCommentId$",new me.BehaviorSubject(void 0));A(this,"panelVisible$",this._panelVisible$.asObservable());A(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$(a.UniverInstanceType.UNIVER_SHEET).pipe(me.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)}},d.ThreadCommentPanelService=$e([ue(0,a.Inject(L.ISidebarService)),ue(1,a.IUniverInstanceService)],d.ThreadCommentPanelService);const he={id:"thread-comment-ui.operation.toggle-panel",type:a.CommandType.OPERATION,handler(n){const e=n.get(L.ISidebarService),t=n.get(d.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}},k={id:"thread-comment-ui.operation.set-active-comment",type:a.CommandType.OPERATION,handler(n,e){return n.get(d.ThreadCommentPanelService).setActiveComment(e),!0}};var Ae=Object.defineProperty,Le=Object.getOwnPropertyDescriptor,ke=(n,e,t,r)=>{for(var o=r>1?void 0:r?Le(e,t):e,m=n.length-1,c;m>=0;m--)(c=n[m])&&(o=(r?c(e,t,o):c(o))||o);return r&&o&&Ae(e,t,o),o},Ve=(n,e)=>(t,r)=>e(t,r,n);let R=class extends a.Disposable{constructor(n){super(),this._localeService=n}};R=ke([a.OnLifecycle(a.LifecycleStages.Starting,R),Ve(0,a.Inject(a.LocaleService))],R);class Be{constructor(){A(this,"dataSource");A(this,"renderSuggestion");A(this,"trigger","@")}async getMentions(e,t,r){return this.dataSource?this.dataSource.getMentions(e,t,r):[]}}const se=a.createIdentifier("thread-comment.mention-data.service");var ve=Object.defineProperty,Fe=Object.getOwnPropertyDescriptor,We=(n,e,t)=>e in n?ve(n,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[e]=t,qe=(n,e,t,r)=>{for(var o=r>1?void 0:r?Fe(e,t):e,m=n.length-1,c;m>=0;m--)(c=n[m])&&(o=(r?c(e,t,o):c(o))||o);return r&&o&&ve(e,t,o),o},Ce=(n,e)=>(t,r)=>e(t,r,n),fe=(n,e,t)=>We(n,typeof e!="symbol"?e+"":e,t);d.UniverThreadCommentUIPlugin=class extends a.Plugin{constructor(e,t,r){super(),this._config=e,this._injector=t,this._commandService=r}onStarting(e){var t;a.mergeOverrideWithDependencies([[R],[d.ThreadCommentPanelService],[se,{useClass:Be}]],(t=this._config)==null?void 0:t.overrides).forEach(r=>{e.add(r)}),[he,k].forEach(r=>{this._commandService.registerCommand(r)})}},fe(d.UniverThreadCommentUIPlugin,"pluginName",we),fe(d.UniverThreadCommentUIPlugin,"type",a.UniverInstanceType.UNIVER_UNKNOWN),d.UniverThreadCommentUIPlugin=qe([a.DependentOn(T.UniverThreadCommentPlugin),Ce(1,a.Inject(a.Injector)),Ce(2,a.ICommandService)],d.UniverThreadCommentUIPlugin);var M=function(){return M=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},M.apply(this,arguments)},ze=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},W=i.forwardRef(function(n,e){var t=n.icon,r=n.id,o=n.className,m=n.extend,c=ze(n,["icon","id","className","extend"]),v="univerjs-icon univerjs-icon-".concat(r," ").concat(o||"").trim(),p=i.useRef("_".concat(Ge()));return ge(t,"".concat(r),{defIds:t.defIds,idSuffix:p.current},M({ref:e,className:v},c),m)});function ge(n,e,t,r,o){return i.createElement(n.tag,M(M({key:e},Ze(n,t,o)),r),(Ye(n,t).children||[]).map(function(m,c){return ge(m,"".concat(e,"-").concat(n.tag,"-").concat(c),t,void 0,o)}))}function Ze(n,e,t){var r=M({},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 c=m[0],v=m[1];typeof v=="string"&&(r[c]=v.replace(/url\(#(.*)\)/,"url(#$1".concat(e.idSuffix,")")))})),r}function Ye(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)?M(M({},n),{children:n.children.map(function(o){return typeof o.attrs.id=="string"&&r&&r.indexOf(o.attrs.id)>-1?M(M({},o),{attrs:M(M({},o.attrs),{id:o.attrs.id+e.idSuffix})}):o})}):n}function Ge(){return Math.random().toString(36).substring(2,8)}W.displayName="UniverIcon";var Ke={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"}}]},pe=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"delete-single",ref:e,icon:Ke}))});pe.displayName="DeleteSingle";var Je={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"}}]},Ie=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"increase-single",ref:e,icon:Je}))});Ie.displayName="IncreaseSingle";var Qe={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"}}]},Se=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"more-horizontal-single",ref:e,icon:Qe}))});Se.displayName="MoreHorizontalSingle";var Xe={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}}]},ye=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"reply-to-comment-single",ref:e,icon:Xe}))});ye.displayName="ReplyToCommentSingle";var Re={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"}}]},Ee=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"resolved-single",ref:e,icon:Re}))});Ee.displayName="ResolvedSingle";var et={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=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"solve-single",ref:e,icon:et}))});be.displayName="SolveSingle";const ee={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"},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(""),Te=n=>{const{dataStream:e,customRanges:t}=n,r=e.length-2,o=[];let m=0;return t==null||t.forEach(c=>{m<c.startIndex&&o.push({type:"text",content:e.slice(m,c.startIndex)}),o.push({type:"mention",content:{label:e.slice(c.startIndex,c.endIndex).slice(1,-1),id:c.rangeId}}),m=c.endIndex}),o.push({type:"text",content:e.slice(m,r)}),o},_e=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:a.CustomRangeType.MENTION,startIndex:o,endIndex:m});break}}}),e+=`
2
- \r`,{textRuns:[],paragraphs:[{startIndex:e.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:e.length-1}],dataStream:e,customRanges:t}},rt=n=>({display:n.label,id:`${n.id}`,raw:n}),it=(n,e,t,r,o)=>{var c,v;const m=(c=n.raw)==null?void 0:c.icon;return i.createElement("div",{className:ee.threadCommentEditorSuggestion},m?i.createElement("img",{className:ee.threadCommentEditorSuggestionIcon,src:m}):null,i.createElement("div",null,(v=n.display)!=null?v:n.id))},Pe=i.forwardRef((n,e)=>{var f;const{comment:t,onSave:r,id:o,onCancel:m,autoFocus:c,unitId:v,subUnitId:p}=n,_=a.useDependency(se),w=a.useDependency(a.ICommandService),N=a.useDependency(a.LocaleService),[y,C]=i.useState({...t}),[I,E]=i.useState(!1),O=i.useRef(null),b=a.useDependency(Oe.ITextSelectionRenderManager),V=a.useDependency(De.TextSelectionManagerService);return i.useImperativeHandle(e,()=>({reply(g){var u;C({...t,text:g,attachments:[]}),(u=O.current)==null||u.inputElement.focus()}})),i.createElement("div",{className:ee.threadCommentEditor,onClick:g=>g.preventDefault()},i.createElement(x.Mentions,{ref:O,autoFocus:c,style:{width:"100%"},placeholder:N.t("threadCommentUI.editor.placeholder"),value:y!=null&&y.text?nt(Te(y.text)):"",onChange:g=>{g.target.value||C({...t,text:void 0}),C==null||C({...t,text:_e(tt(g.target.value))})},onFocus:()=>{const g=V.getActiveRange();g&&g.collapsed&&b.removeAllTextRanges(),b.blur(),E(!0)}},i.createElement(x.Mention,{key:_.trigger,trigger:_.trigger,data:(g,u)=>_.getMentions(g,v,p).then(s=>s.map(rt)).then(u),displayTransform:(g,u)=>`@${u} `,renderSuggestion:(f=_.renderSuggestion)!=null?f:it})),I?i.createElement("div",{className:ee.threadCommentEditorButtons},i.createElement(x.Button,{style:{marginRight:12},onClick:()=>{m==null||m(),E(!1),C({text:void 0}),w.executeCommand(k.id)}},N.t("threadCommentUI.editor.cancel")),i.createElement(x.Button,{type:"primary",disabled:!y.text,onClick:()=>{y.text&&(r==null||r({...y,text:y.text}),E(!1),C({text:void 0}))}},N.t(o?"threadCommentUI.editor.save":"threadCommentUI.editor.reply"))):null)}),h={threadComment:"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"},Ue="__mock__",ot=n=>{const{item:e,unitId:t,subUnitId:r,editing:o,onEditingChange:m,onReply:c,resolved:v,isRoot:p,onClose:_,onDeleteComment:w}=n,N=a.useDependency(a.ICommandService),y=a.useDependency(a.LocaleService),C=a.useDependency(a.UserManagerService),I=C.getUser(e.personId),E=L.useObservable(C.currentUser$),O=(E==null?void 0:E.userID)===e.personId,b=e.id===Ue,[V,f]=i.useState(!1),g=()=>{(w==null?void 0:w(e))!==!1&&(N.executeCommand(p?T.DeleteCommentTreeCommand.id:T.DeleteCommentCommand.id,{unitId:t,subUnitId:r,commentId:e.id}),p&&(_==null||_()))};return i.createElement("div",{className:h.threadCommentItem,onMouseLeave:()=>f(!1),onMouseEnter:()=>f(!0)},i.createElement("img",{className:h.threadCommentItemHead,src:I==null?void 0:I.avatar}),i.createElement("div",{className:h.threadCommentItemTitle},i.createElement("div",{className:h.threadCommentUsername},(I==null?void 0:I.name)||" "),i.createElement("div",null,b||v?null:V?i.createElement("div",{className:h.threadCommentIcon,onClick:()=>c(I)},i.createElement(ye,null)):null,O&&!b&&!v?i.createElement(x.Dropdown,{overlay:i.createElement(x.Menu,null,i.createElement(x.MenuItem,{key:"edit",onClick:()=>m==null?void 0:m(!0)},y.t("threadCommentUI.item.edit")),i.createElement(x.MenuItem,{key:"delete",onClick:g},y.t("threadCommentUI.item.delete")))},i.createElement("div",{className:h.threadCommentIcon},i.createElement(Se,null))):null)),i.createElement("div",{className:h.threadCommentItemTime},e.dT),o?i.createElement(Pe,{id:e.id,comment:e,onCancel:()=>m==null?void 0:m(!1),autoFocus:!0,unitId:t,subUnitId:r,onSave:({text:u,attachments:s})=>{m==null||m(!1),N.executeCommand(T.UpdateCommentCommand.id,{unitId:t,subUnitId:r,payload:{commentId:e.id,text:u,attachments:s}})}}):i.createElement("div",{className:h.threadCommentItemContent},Te(e.text).map((u,s)=>{switch(u.type){case"mention":return i.createElement("a",{className:h.threadCommentItemAt,key:s},"@",u.content.label," ");default:return u.content}})))},xe=n=>{var J,z,re;const{id:e,unitId:t,subUnitId:r,refStr:o,showEdit:m=!0,onClick:c,showHighlight:v,onClose:p,getSubUnitName:_,prefix:w,autoFocus:N,onMouseEnter:y,onMouseLeave:C,onAddComment:I,onDeleteComment:E,onResolve:O}=n,b=a.useDependency(T.ThreadCommentModel),[V,f]=i.useState(!1),[g,u]=i.useState("");L.useObservable(b.commentMap$);const s=e?b.getCommentWithChildren(t,r,e):null,B=a.useDependency(a.ICommandService),le=a.useDependency(a.UserManagerService),S=s==null?void 0:s.root.resolved,D=L.useObservable(le.currentUser$),Y=i.useRef(null),te=[...s?[s.root]:[{id:Ue,text:{dataStream:`
3
- \r`},personId:(J=D==null?void 0:D.userID)!=null?J:"",ref:o!=null?o:"",dT:"",unitId:t,subUnitId:r,threadId:""}],...(z=s==null?void 0:s.children)!=null?z:[]],G=P=>{P.stopPropagation(),S?B.executeCommand(k.id,{unitId:t,subUnitId:r,commentId:e}):B.executeCommand(k.id),B.executeCommand(T.ResolveCommentCommand.id,{unitId:t,subUnitId:r,commentId:e,resolved:!S}),O==null||O(!S)},ne=P=>{P.stopPropagation(),B.executeCommand(k.id),!(s!=null&&s.root&&(E==null?void 0:E(s.root))===!1)&&(B.executeCommand(T.DeleteCommentTreeCommand.id,{unitId:t,subUnitId:r,commentId:e}),p==null||p())};i.useEffect(()=>C==null?void 0:C(),[]);const H=_((re=s==null?void 0:s.root.subUnitId)!=null?re:r),K=m&&!g&&!S,F=`${o||(s==null?void 0:s.root.ref)||""}${H?" · ":""}${H}`;return i.createElement("div",{className:Ne(h.threadComment,{[h.threadCommentActive]:!S&&(v||V||w==="cell")}),onClick:c,id:`${w}-${t}-${r}-${e}`,onMouseEnter:()=>{y==null||y(),f(!0)},onMouseLeave:()=>{C==null||C(),f(!1)}},!S&&v?i.createElement("div",{className:h.threadCommentHighlight}):null,i.createElement("div",{className:h.threadCommentTitle},i.createElement("div",{className:h.threadCommentTitlePosition},i.createElement("div",{className:h.threadCommentTitleHighlight}),i.createElement("div",{className:h.threadCommentTitlePositionText},F)),s?i.createElement("div",{className:h.threadCommentIconContainer},i.createElement("div",{onClick:G,className:h.threadCommentIcon,style:{color:S?"rgb(var(--green-500))":""}},S?i.createElement(Ee,null):i.createElement(be,null)),(D==null?void 0:D.userID)===s.root.personId?i.createElement("div",{className:h.threadCommentIcon,onClick:ne},i.createElement(pe,null)):null):null),i.createElement("div",{className:h.threadCommentContent},te.map(P=>i.createElement(ot,{onClose:p,unitId:t,subUnitId:r,item:P,key:P.id,isRoot:P.id===(s==null?void 0:s.root.id),editing:g===P.id,resolved:s==null?void 0:s.root.resolved,onEditingChange:j=>{u(j?P.id:"")},onReply:j=>{j&&requestAnimationFrame(()=>{var q;(q=Y.current)==null||q.reply(_e([{type:"mention",content:{id:j.userID,label:j.name}}]))})},onAddComment:I,onDeleteComment:E}))),K?i.createElement("div",null,i.createElement(Pe,{key:`${N}`,ref:Y,unitId:t,subUnitId:r,onSave:({text:P,attachments:j})=>{const q={text:P,attachments:j,dT:de(),id:a.Tools.generateRandomId(),ref:o,personId:D==null?void 0:D.userID,parentId:s==null?void 0:s.root.id,unitId:t,subUnitId:r,threadId:s==null?void 0:s.root.threadId};(I==null?void 0:I(q))!==!1&&B.executeCommand(T.AddCommentCommand.id,{unitId:t,subUnitId:r,comment:q})},autoFocus:N||!s,onCancel:()=>{s||p==null||p()}})):null)},Z={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"},at=n=>{const{unitId:e,subUnitId$:t,type:r,onAdd:o,getSubUnitName:m,onResolve:c,sortComments:v,onItemLeave:p,onItemEnter:_,disableAdd:w,tempComment:N,onAddComment:y,onDeleteComment:C,showComments:I}=n,[E,O]=i.useState("all"),[b,V]=i.useState("all"),f=a.useDependency(a.LocaleService),g=a.useDependency(a.UserManagerService),u=a.useDependency(T.ThreadCommentModel),[s,B]=i.useState(()=>u.getUnit(e)),le=a.useDependency(d.ThreadCommentPanelService),S=L.useObservable(le.activeCommentId$),D=L.useObservable(u.commentUpdate$),Y=a.useDependency(a.ICommandService),te=L.useObservable(t),G=i.useRef(!0),ne="panel",H=L.useObservable(g.currentUser$),K=i.useMemo(()=>{var oe,X;const l=(E==="all"?s.map($=>$[1]).flat():(X=(oe=s.find($=>$[0]===te))==null?void 0:oe[1])!=null?X:[]).filter($=>!$.parentId),Q=v!=null?v:$=>$,ie=l;if(I){const $=new Map;return ie.forEach(ae=>{$.set(ae.id,ae)}),[...I,""].map(ae=>$.get(ae)).filter(Boolean)}else return Q(ie)},[I,E,s,v,te]),F=i.useMemo(()=>[...K.filter(l=>!l.resolved),...K.filter(l=>l.resolved)],[K]),J=i.useMemo(()=>b==="resolved"?F.filter(l=>l.resolved):b==="unsolved"?F.filter(l=>!l.resolved):b==="concern_me"&&H!=null&&H.userID?F.map(l=>u.getCommentWithChildren(l.unitId,l.subUnitId,l.id)).map(l=>l!=null&&l.relativeUsers.has(H.userID)?l.root:null).filter(Boolean):F,[F,H==null?void 0:H.userID,b,u]),z=N?[N,...J]:J,re=z.filter(l=>!l.resolved),P=z.filter(l=>l.resolved),j=b!=="all"||E!=="all",q=()=>{V("all"),O("all")};i.useEffect(()=>{e&&B(u.getUnit(e))},[e,u,D]),i.useEffect(()=>{var X;if(!S)return;if(!G.current){G.current=!0;return}const{unitId:l,subUnitId:Q,commentId:ie}=S,oe=`${ne}-${l}-${Q}-${ie}`;(X=document.getElementById(oe))==null||X.scrollIntoView({block:"center"})},[S]);const Me=l=>i.createElement(xe,{prefix:ne,getSubUnitName:m,key:l.id,id:l.id,unitId:l.unitId,subUnitId:l.subUnitId,refStr:l.ref,type:r,showEdit:(S==null?void 0:S.commentId)===l.id,showHighlight:(S==null?void 0:S.commentId)===l.id,onClick:()=>{G.current=!1,l.resolved?Y.executeCommand(k.id):Y.executeCommand(k.id,{unitId:l.unitId,subUnitId:l.subUnitId,commentId:l.id,temp:!1})},onMouseEnter:()=>_==null?void 0:_(l),onMouseLeave:()=>p==null?void 0:p(l),onAddComment:y,onDeleteComment:C,onResolve:Q=>c==null?void 0:c(l.id,Q)});return i.createElement("div",{className:Z.threadCommentPanel},i.createElement("div",{className:Z.threadCommentPanelForms},r===a.UniverInstanceType.UNIVER_SHEET?i.createElement(x.Select,{borderless:!0,value:E,onChange:l=>O(l),options:[{value:"current",label:f.t("threadCommentUI.filter.sheet.current")},{value:"all",label:f.t("threadCommentUI.filter.sheet.all")}]}):null,i.createElement(x.Select,{borderless:!0,value:b,onChange:l=>V(l),options:[{value:"all",label:f.t("threadCommentUI.filter.status.all")},{value:"resolved",label:f.t("threadCommentUI.filter.status.resolved")},{value:"unsolved",label:f.t("threadCommentUI.filter.status.unsolved")},{value:"concern_me",label:f.t("threadCommentUI.filter.status.concernMe")}]})),re.map(Me),P.length?i.createElement("div",{className:Z.threadCommentPanelSolved},"已解决"):null,P.map(Me),z.length?null:i.createElement("div",{className:Z.threadCommentPanelEmpty},j?f.t("threadCommentUI.panel.filterEmpty"):f.t("threadCommentUI.panel.empty"),j?i.createElement(x.Button,{onClick:q,type:"link"},f.t("threadCommentUI.panel.reset")):i.createElement(x.Button,{id:"thread-comment-add",className:Z.threadCommentPanelAdd,type:"primary",onClick:o,disabled:w},i.createElement(Ie,null),f.t("threadCommentUI.panel.addComment"))))};d.IThreadCommentMentionDataService=se,d.SetActiveCommentOperation=k,d.THREAD_COMMENT_PANEL=ce,d.ThreadCommentPanel=at,d.ThreadCommentTree=xe,d.ToggleSheetCommentPanelOperation=he,d.getDT=de,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});
1
+ (function(d,x){typeof exports=="object"&&typeof module<"u"?x(exports,require("dayjs"),require("@univerjs/thread-comment"),require("@univerjs/core"),require("@univerjs/ui"),require("rxjs"),require("react"),require("@univerjs/design"),require("clsx"),require("@univerjs/engine-render"),require("@univerjs/docs")):typeof define=="function"&&define.amd?define(["exports","dayjs","@univerjs/thread-comment","@univerjs/core","@univerjs/ui","rxjs","react","@univerjs/design","clsx","@univerjs/engine-render","@univerjs/docs"],x):(d=typeof globalThis<"u"?globalThis:d||self,x(d.UniverThreadCommentUi={},d.dayjs,d.UniverThreadComment,d.UniverCore,d.UniverUi,d.rxjs,d.React,d.UniverDesign,d.clsx,d.UniverEngineRender,d.UniverDocs))})(this,function(d,x,T,m,k,ae,i,_,Me,Ne,De){"use strict";var nt=Object.defineProperty;var rt=(d,x,T)=>x in d?nt(d,x,{enumerable:!0,configurable:!0,writable:!0,value:T}):d[x]=T;var A=(d,x,T)=>rt(d,typeof x!="symbol"?x+"":x,T);function le(){return x().format("YYYY/MM/DD HH:mm")}const de="thread-comment-panel",Oe="THREAD_COMMENT_UI_PLUGIN";var we=Object.defineProperty,He=Object.getOwnPropertyDescriptor,je=(n,e,t,r)=>{for(var o=r>1?void 0:r?He(e,t):e,l=n.length-1,c;l>=0;l--)(c=n[l])&&(o=(r?c(e,t,o):c(o))||o);return r&&o&&we(e,t,o),o},ce=(n,e)=>(t,r)=>e(t,r,n);d.ThreadCommentPanelService=class extends m.Disposable{constructor(t,r){super();A(this,"_panelVisible",!1);A(this,"_panelVisible$",new ae.BehaviorSubject(!1));A(this,"_activeCommentId");A(this,"_activeCommentId$",new ae.BehaviorSubject(void 0));A(this,"panelVisible$",this._panelVisible$.asObservable());A(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$(m.UniverInstanceType.UNIVER_SHEET).pipe(ae.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)}},d.ThreadCommentPanelService=je([ce(0,m.Inject(k.ISidebarService)),ce(1,m.IUniverInstanceService)],d.ThreadCommentPanelService);const ue={id:"thread-comment-ui.operation.toggle-panel",type:m.CommandType.OPERATION,handler(n){const e=n.get(k.ISidebarService),t=n.get(d.ThreadCommentPanelService);return t.panelVisible?(e.close(),t.setPanelVisible(!1)):(e.open({header:{title:"threadCommentUI.panel.title"},children:{label:de},width:320}),t.setPanelVisible(!0)),!0}},L={id:"thread-comment-ui.operation.set-active-comment",type:m.CommandType.OPERATION,handler(n,e){return n.get(d.ThreadCommentPanelService).setActiveComment(e),!0}};class $e{constructor(){A(this,"dataSource");A(this,"renderSuggestion");A(this,"trigger","@")}async getMentions(e,t,r){return this.dataSource?this.dataSource.getMentions(e,t,r):[]}}const me=m.createIdentifier("thread-comment.mention-data.service");var he=Object.defineProperty,Ae=Object.getOwnPropertyDescriptor,ke=(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,l=n.length-1,c;l>=0;l--)(c=n[l])&&(o=(r?c(e,t,o):c(o))||o);return r&&o&&he(e,t,o),o},Ce=(n,e)=>(t,r)=>e(t,r,n),ve=(n,e,t)=>ke(n,typeof e!="symbol"?e+"":e,t);d.UniverThreadCommentUIPlugin=class extends m.Plugin{constructor(e,t,r){super(),this._config=e,this._injector=t,this._commandService=r}onStarting(e){var t;m.mergeOverrideWithDependencies([[d.ThreadCommentPanelService],[me,{useClass:$e}]],(t=this._config)==null?void 0:t.overrides).forEach(r=>{e.add(r)}),[ue,L].forEach(r=>{this._commandService.registerCommand(r)})}},ve(d.UniverThreadCommentUIPlugin,"pluginName",Oe),ve(d.UniverThreadCommentUIPlugin,"type",m.UniverInstanceType.UNIVER_UNKNOWN),d.UniverThreadCommentUIPlugin=Le([m.DependentOn(T.UniverThreadCommentPlugin),Ce(1,m.Inject(m.Injector)),Ce(2,m.ICommandService)],d.UniverThreadCommentUIPlugin);var M=function(){return M=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},M.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},W=i.forwardRef(function(n,e){var t=n.icon,r=n.id,o=n.className,l=n.extend,c=Ve(n,["icon","id","className","extend"]),C="univerjs-icon univerjs-icon-".concat(r," ").concat(o||"").trim(),p=i.useRef("_".concat(We()));return fe(t,"".concat(r),{defIds:t.defIds,idSuffix:p.current},M({ref:e,className:C},c),l)});function fe(n,e,t,r,o){return i.createElement(n.tag,M(M({key:e},Be(n,t,o)),r),(Fe(n,t).children||[]).map(function(l,c){return fe(l,"".concat(e,"-").concat(n.tag,"-").concat(c),t,void 0,o)}))}function Be(n,e,t){var r=M({},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(l){var c=l[0],C=l[1];typeof C=="string"&&(r[c]=C.replace(/url\(#(.*)\)/,"url(#$1".concat(e.idSuffix,")")))})),r}function Fe(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)?M(M({},n),{children:n.children.map(function(o){return typeof o.attrs.id=="string"&&r&&r.indexOf(o.attrs.id)>-1?M(M({},o),{attrs:M(M({},o.attrs),{id:o.attrs.id+e.idSuffix})}):o})}):n}function We(){return Math.random().toString(36).substring(2,8)}W.displayName="UniverIcon";var qe={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"}}]},ge=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"delete-single",ref:e,icon:qe}))});ge.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"}}]},pe=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"increase-single",ref:e,icon:ze}))});pe.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"}}]},Ie=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"more-horizontal-single",ref:e,icon:Ze}))});Ie.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}}]},Se=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"reply-to-comment-single",ref:e,icon:Ye}))});Se.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"}}]},Ee=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"resolved-single",ref:e,icon:Ge}))});Ee.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}}]},ye=i.forwardRef(function(n,e){return i.createElement(W,Object.assign({},n,{id:"solve-single",ref:e,icon:Ke}))});ye.displayName="SolveSingle";const R={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"},Je=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},Qe=n=>n.map(e=>{switch(e.type){case"mention":return`@[${e.content.label}](${e.content.id})`;default:return e.content}}).join(""),be=n=>{const{dataStream:e,customRanges:t}=n,r=e.length-2,o=[];let l=0;return t==null||t.forEach(c=>{l<c.startIndex&&o.push({type:"text",content:e.slice(l,c.startIndex)}),o.push({type:"mention",content:{label:e.slice(c.startIndex,c.endIndex).slice(1,-1),id:c.rangeId}}),l=c.endIndex}),o.push({type:"text",content:e.slice(l,r)}),o},Te=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 l=e.length;t.push({rangeId:r.content.id,rangeType:m.CustomRangeType.MENTION,startIndex:o,endIndex:l});break}}}),e+=`
2
+ \r`,{textRuns:[],paragraphs:[{startIndex:e.length-2,paragraphStyle:{}}],sectionBreaks:[{startIndex:e.length-1}],dataStream:e,customRanges:t}},Xe=n=>({display:n.label,id:`${n.id}`,raw:n}),Re=(n,e,t,r,o)=>{var c,C;const l=(c=n.raw)==null?void 0:c.icon;return i.createElement("div",{className:R.threadCommentEditorSuggestion},l?i.createElement("img",{className:R.threadCommentEditorSuggestionIcon,src:l}):null,i.createElement("div",null,(C=n.display)!=null?C:n.id))},Ue=i.forwardRef((n,e)=>{var f;const{comment:t,onSave:r,id:o,onCancel:l,autoFocus:c,unitId:C,subUnitId:p}=n,U=m.useDependency(me),w=m.useDependency(m.ICommandService),N=m.useDependency(m.LocaleService),[E,v]=i.useState({...t}),[I,y]=i.useState(!1),D=i.useRef(null),b=m.useDependency(Ne.ITextSelectionRenderManager),V=m.useDependency(De.TextSelectionManagerService);return i.useImperativeHandle(e,()=>({reply(g){var u;v({...t,text:g,attachments:[]}),(u=D.current)==null||u.inputElement.focus()}})),i.createElement("div",{className:R.threadCommentEditor,onClick:g=>g.preventDefault()},i.createElement(_.Mentions,{ref:D,autoFocus:c,style:{width:"100%"},placeholder:N.t("threadCommentUI.editor.placeholder"),value:E!=null&&E.text?Qe(be(E.text)):"",onChange:g=>{g.target.value||v({...t,text:void 0}),v==null||v({...t,text:Te(Je(g.target.value))})},onFocus:()=>{const g=V.getActiveRange();g&&g.collapsed&&b.removeAllTextRanges(),b.blur(),y(!0)}},i.createElement(_.Mention,{key:U.trigger,trigger:U.trigger,data:(g,u)=>U.getMentions(g,C,p).then(a=>a.map(Xe)).then(u),displayTransform:(g,u)=>`@${u} `,renderSuggestion:(f=U.renderSuggestion)!=null?f:Re})),I?i.createElement("div",{className:R.threadCommentEditorButtons},i.createElement(_.Button,{style:{marginRight:12},onClick:()=>{l==null||l(),y(!1),v({text:void 0}),w.executeCommand(L.id)}},N.t("threadCommentUI.editor.cancel")),i.createElement(_.Button,{type:"primary",disabled:!E.text,onClick:()=>{E.text&&(r==null||r({...E,text:E.text}),y(!1),v({text:void 0}))}},N.t(o?"threadCommentUI.editor.save":"threadCommentUI.editor.reply"))):null)}),h={threadComment:"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"},Pe="__mock__",et=n=>{const{item:e,unitId:t,subUnitId:r,editing:o,onEditingChange:l,onReply:c,resolved:C,isRoot:p,onClose:U,onDeleteComment:w}=n,N=m.useDependency(m.ICommandService),E=m.useDependency(m.LocaleService),v=m.useDependency(m.UserManagerService),I=v.getUser(e.personId),y=k.useObservable(v.currentUser$),D=(y==null?void 0:y.userID)===e.personId,b=e.id===Pe,[V,f]=i.useState(!1),g=()=>{(w==null?void 0:w(e))!==!1&&(N.executeCommand(p?T.DeleteCommentTreeCommand.id:T.DeleteCommentCommand.id,{unitId:t,subUnitId:r,commentId:e.id}),p&&(U==null||U()))};return i.createElement("div",{className:h.threadCommentItem,onMouseLeave:()=>f(!1),onMouseEnter:()=>f(!0)},i.createElement("img",{className:h.threadCommentItemHead,src:I==null?void 0:I.avatar}),i.createElement("div",{className:h.threadCommentItemTitle},i.createElement("div",{className:h.threadCommentUsername},(I==null?void 0:I.name)||" "),i.createElement("div",null,b||C?null:V?i.createElement("div",{className:h.threadCommentIcon,onClick:()=>c(I)},i.createElement(Se,null)):null,D&&!b&&!C?i.createElement(_.Dropdown,{overlay:i.createElement(_.Menu,null,i.createElement(_.MenuItem,{key:"edit",onClick:()=>l==null?void 0:l(!0)},E.t("threadCommentUI.item.edit")),i.createElement(_.MenuItem,{key:"delete",onClick:g},E.t("threadCommentUI.item.delete")))},i.createElement("div",{className:h.threadCommentIcon},i.createElement(Ie,null))):null)),i.createElement("div",{className:h.threadCommentItemTime},e.dT),o?i.createElement(Ue,{id:e.id,comment:e,onCancel:()=>l==null?void 0:l(!1),autoFocus:!0,unitId:t,subUnitId:r,onSave:({text:u,attachments:a})=>{l==null||l(!1),N.executeCommand(T.UpdateCommentCommand.id,{unitId:t,subUnitId:r,payload:{commentId:e.id,text:u,attachments:a}})}}):i.createElement("div",{className:h.threadCommentItemContent},be(e.text).map((u,a)=>{switch(u.type){case"mention":return i.createElement("a",{className:h.threadCommentItemAt,key:a},"@",u.content.label," ");default:return u.content}})))},xe=n=>{var J,z,ne;const{id:e,unitId:t,subUnitId:r,refStr:o,showEdit:l=!0,onClick:c,showHighlight:C,onClose:p,getSubUnitName:U,prefix:w,autoFocus:N,onMouseEnter:E,onMouseLeave:v,onAddComment:I,onDeleteComment:y,onResolve:D}=n,b=m.useDependency(T.ThreadCommentModel),[V,f]=i.useState(!1),[g,u]=i.useState("");k.useObservable(b.commentMap$);const a=e?b.getCommentWithChildren(t,r,e):null,B=m.useDependency(m.ICommandService),se=m.useDependency(m.UserManagerService),S=a==null?void 0:a.root.resolved,O=k.useObservable(se.currentUser$),Y=i.useRef(null),ee=[...a?[a.root]:[{id:Pe,text:{dataStream:`
3
+ \r`},personId:(J=O==null?void 0:O.userID)!=null?J:"",ref:o!=null?o:"",dT:"",unitId:t,subUnitId:r,threadId:""}],...(z=a==null?void 0:a.children)!=null?z:[]],G=P=>{P.stopPropagation(),S?B.executeCommand(L.id,{unitId:t,subUnitId:r,commentId:e}):B.executeCommand(L.id),B.executeCommand(T.ResolveCommentCommand.id,{unitId:t,subUnitId:r,commentId:e,resolved:!S}),D==null||D(!S)},te=P=>{P.stopPropagation(),B.executeCommand(L.id),!(a!=null&&a.root&&(y==null?void 0:y(a.root))===!1)&&(B.executeCommand(T.DeleteCommentTreeCommand.id,{unitId:t,subUnitId:r,commentId:e}),p==null||p())};i.useEffect(()=>v==null?void 0:v(),[]);const H=U((ne=a==null?void 0:a.root.subUnitId)!=null?ne:r),K=l&&!g&&!S,F=`${o||(a==null?void 0:a.root.ref)||""}${H?" · ":""}${H}`;return i.createElement("div",{className:Me(h.threadComment,{[h.threadCommentActive]:!S&&(C||V||w==="cell")}),onClick:c,id:`${w}-${t}-${r}-${e}`,onMouseEnter:()=>{E==null||E(),f(!0)},onMouseLeave:()=>{v==null||v(),f(!1)}},!S&&C?i.createElement("div",{className:h.threadCommentHighlight}):null,i.createElement("div",{className:h.threadCommentTitle},i.createElement("div",{className:h.threadCommentTitlePosition},i.createElement("div",{className:h.threadCommentTitleHighlight}),i.createElement("div",{className:h.threadCommentTitlePositionText},F)),a?i.createElement("div",{className:h.threadCommentIconContainer},i.createElement("div",{onClick:G,className:h.threadCommentIcon,style:{color:S?"rgb(var(--green-500))":""}},S?i.createElement(Ee,null):i.createElement(ye,null)),(O==null?void 0:O.userID)===a.root.personId?i.createElement("div",{className:h.threadCommentIcon,onClick:te},i.createElement(ge,null)):null):null),i.createElement("div",{className:h.threadCommentContent},ee.map(P=>i.createElement(et,{onClose:p,unitId:t,subUnitId:r,item:P,key:P.id,isRoot:P.id===(a==null?void 0:a.root.id),editing:g===P.id,resolved:a==null?void 0:a.root.resolved,onEditingChange:j=>{u(j?P.id:"")},onReply:j=>{j&&requestAnimationFrame(()=>{var q;(q=Y.current)==null||q.reply(Te([{type:"mention",content:{id:j.userID,label:j.name}}]))})},onAddComment:I,onDeleteComment:y}))),K?i.createElement("div",null,i.createElement(Ue,{key:`${N}`,ref:Y,unitId:t,subUnitId:r,onSave:({text:P,attachments:j})=>{const q={text:P,attachments:j,dT:le(),id:m.Tools.generateRandomId(),ref:o,personId:O==null?void 0:O.userID,parentId:a==null?void 0:a.root.id,unitId:t,subUnitId:r,threadId:a==null?void 0:a.root.threadId};(I==null?void 0:I(q))!==!1&&B.executeCommand(T.AddCommentCommand.id,{unitId:t,subUnitId:r,comment:q})},autoFocus:N||!a,onCancel:()=>{a||p==null||p()}})):null)},Z={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"},tt=n=>{const{unitId:e,subUnitId$:t,type:r,onAdd:o,getSubUnitName:l,onResolve:c,sortComments:C,onItemLeave:p,onItemEnter:U,disableAdd:w,tempComment:N,onAddComment:E,onDeleteComment:v,showComments:I}=n,[y,D]=i.useState("all"),[b,V]=i.useState("all"),f=m.useDependency(m.LocaleService),g=m.useDependency(m.UserManagerService),u=m.useDependency(T.ThreadCommentModel),[a,B]=i.useState(()=>u.getUnit(e)),se=m.useDependency(d.ThreadCommentPanelService),S=k.useObservable(se.activeCommentId$),O=k.useObservable(u.commentUpdate$),Y=m.useDependency(m.ICommandService),ee=k.useObservable(t),G=i.useRef(!0),te="panel",H=k.useObservable(g.currentUser$),K=i.useMemo(()=>{var ie,X;const s=(y==="all"?a.map($=>$[1]).flat():(X=(ie=a.find($=>$[0]===ee))==null?void 0:ie[1])!=null?X:[]).filter($=>!$.parentId),Q=C!=null?C:$=>$,re=s;if(I){const $=new Map;return re.forEach(oe=>{$.set(oe.id,oe)}),[...I,""].map(oe=>$.get(oe)).filter(Boolean)}else return Q(re)},[I,y,a,C,ee]),F=i.useMemo(()=>[...K.filter(s=>!s.resolved),...K.filter(s=>s.resolved)],[K]),J=i.useMemo(()=>b==="resolved"?F.filter(s=>s.resolved):b==="unsolved"?F.filter(s=>!s.resolved):b==="concern_me"&&H!=null&&H.userID?F.map(s=>u.getCommentWithChildren(s.unitId,s.subUnitId,s.id)).map(s=>s!=null&&s.relativeUsers.has(H.userID)?s.root:null).filter(Boolean):F,[F,H==null?void 0:H.userID,b,u]),z=N?[N,...J]:J,ne=z.filter(s=>!s.resolved),P=z.filter(s=>s.resolved),j=b!=="all"||y!=="all",q=()=>{V("all"),D("all")};i.useEffect(()=>{e&&B(u.getUnit(e))},[e,u,O]),i.useEffect(()=>{var X;if(!S)return;if(!G.current){G.current=!0;return}const{unitId:s,subUnitId:Q,commentId:re}=S,ie=`${te}-${s}-${Q}-${re}`;(X=document.getElementById(ie))==null||X.scrollIntoView({block:"center"})},[S]);const _e=s=>i.createElement(xe,{prefix:te,getSubUnitName:l,key:s.id,id:s.id,unitId:s.unitId,subUnitId:s.subUnitId,refStr:s.ref,type:r,showEdit:(S==null?void 0:S.commentId)===s.id,showHighlight:(S==null?void 0:S.commentId)===s.id,onClick:()=>{G.current=!1,s.resolved?Y.executeCommand(L.id):Y.executeCommand(L.id,{unitId:s.unitId,subUnitId:s.subUnitId,commentId:s.id,temp:!1})},onMouseEnter:()=>U==null?void 0:U(s),onMouseLeave:()=>p==null?void 0:p(s),onAddComment:E,onDeleteComment:v,onResolve:Q=>c==null?void 0:c(s.id,Q)});return i.createElement("div",{className:Z.threadCommentPanel},i.createElement("div",{className:Z.threadCommentPanelForms},r===m.UniverInstanceType.UNIVER_SHEET?i.createElement(_.Select,{borderless:!0,value:y,onChange:s=>D(s),options:[{value:"current",label:f.t("threadCommentUI.filter.sheet.current")},{value:"all",label:f.t("threadCommentUI.filter.sheet.all")}]}):null,i.createElement(_.Select,{borderless:!0,value:b,onChange:s=>V(s),options:[{value:"all",label:f.t("threadCommentUI.filter.status.all")},{value:"resolved",label:f.t("threadCommentUI.filter.status.resolved")},{value:"unsolved",label:f.t("threadCommentUI.filter.status.unsolved")},{value:"concern_me",label:f.t("threadCommentUI.filter.status.concernMe")}]})),ne.map(_e),P.length?i.createElement("div",{className:Z.threadCommentPanelSolved},"已解决"):null,P.map(_e),z.length?null:i.createElement("div",{className:Z.threadCommentPanelEmpty},j?f.t("threadCommentUI.panel.filterEmpty"):f.t("threadCommentUI.panel.empty"),j?i.createElement(_.Button,{onClick:q,type:"link"},f.t("threadCommentUI.panel.reset")):i.createElement(_.Button,{id:"thread-comment-add",className:Z.threadCommentPanelAdd,type:"primary",onClick:o,disabled:w},i.createElement(pe,null),f.t("threadCommentUI.panel.addComment"))))};d.IThreadCommentMentionDataService=me,d.SetActiveCommentOperation=L,d.THREAD_COMMENT_PANEL=de,d.ThreadCommentPanel=tt,d.ThreadCommentTree=xe,d.ToggleSheetCommentPanelOperation=ue,d.getDT=le,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@univerjs/thread-comment-ui",
3
- "version": "0.2.4-alpha.0",
3
+ "version": "0.2.5",
4
4
  "private": false,
5
5
  "description": "Univer common thread comment UI plugin",
6
6
  "author": "DreamNum <developer@univer.ai>",
@@ -52,15 +52,15 @@
52
52
  "dayjs": ">=1.11.0",
53
53
  "react": "^16.9.0 || ^17.0.0 || ^18.0.0",
54
54
  "rxjs": ">=7.0.0",
55
- "@univerjs/design": "0.2.4-alpha.0",
56
- "@univerjs/core": "0.2.4-alpha.0",
57
- "@univerjs/docs": "0.2.4-alpha.0",
58
- "@univerjs/engine-render": "0.2.4-alpha.0",
59
- "@univerjs/thread-comment": "0.2.4-alpha.0",
60
- "@univerjs/ui": "0.2.4-alpha.0"
55
+ "@univerjs/core": "0.2.5",
56
+ "@univerjs/design": "0.2.5",
57
+ "@univerjs/thread-comment": "0.2.5",
58
+ "@univerjs/engine-render": "0.2.5",
59
+ "@univerjs/docs": "0.2.5",
60
+ "@univerjs/ui": "0.2.5"
61
61
  },
62
62
  "dependencies": {
63
- "@univerjs/icons": "^0.1.64",
63
+ "@univerjs/icons": "^0.1.65",
64
64
  "@univerjs/protocol": "0.1.38-alpha.23"
65
65
  },
66
66
  "devDependencies": {
@@ -72,13 +72,13 @@
72
72
  "typescript": "^5.5.3",
73
73
  "vite": "^5.3.4",
74
74
  "vitest": "^2.0.3",
75
- "@univerjs/design": "0.2.4-alpha.0",
76
- "@univerjs/core": "0.2.4-alpha.0",
77
- "@univerjs/docs": "0.2.4-alpha.0",
78
- "@univerjs/engine-render": "0.2.4-alpha.0",
79
- "@univerjs/shared": "0.2.4-alpha.0",
80
- "@univerjs/thread-comment": "0.2.4-alpha.0",
81
- "@univerjs/ui": "0.2.4-alpha.0"
75
+ "@univerjs/design": "0.2.5",
76
+ "@univerjs/core": "0.2.5",
77
+ "@univerjs/engine-render": "0.2.5",
78
+ "@univerjs/docs": "0.2.5",
79
+ "@univerjs/shared": "0.2.5",
80
+ "@univerjs/thread-comment": "0.2.5",
81
+ "@univerjs/ui": "0.2.5"
82
82
  },
83
83
  "univerSpace": {
84
84
  ".": {
@@ -1,6 +0,0 @@
1
- import { Disposable, LocaleService } from '@univerjs/core';
2
-
3
- export declare class ThreadCommentUIController extends Disposable {
4
- private readonly _localeService;
5
- constructor(_localeService: LocaleService);
6
- }