@univerjs/sheets-thread-comment-ui 0.20.1 → 0.21.0

package/lib/cjs/index.js

@@ -1 +1,1099 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@univerjs/core`),t=require(`@univerjs/sheets`),n=require(`@univerjs/sheets-thread-comment`),r=require(`@univerjs/thread-comment-ui`),i=require(`@univerjs/ui`),a=require(`@univerjs/sheets-ui`),o=require(`rxjs`),s=require(`@univerjs/engine-render`),c=require(`@univerjs/engine-formula`),l=require(`@univerjs/thread-comment`),u=require(`@univerjs/icons`),d=require(`react/jsx-runtime`),f=require(`react`);const p=`univer.sheet.thread-comment-modal`,m=`univer.sheet.thread-comment-panel`,h=`SHEET_THREAD_COMMENT_UI_PLUGIN`;function g(e){"@babel/helpers - typeof";return g=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},g(e)}function _(e,t){if(g(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(g(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function v(e){var t=_(e,`string`);return g(t)==`symbol`?t:t+``}function y(e,t,n){return(t=v(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function b(e,t){return function(n,r){t(n,r,e)}}function x(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}let S=class extends e.Disposable{get activePopup(){return this._activePopup}constructor(e,t,n){super(),this._canvasPopupManagerService=e,this._zenZoneService=t,this._cellPopupManagerService=n,y(this,`_lastPopup`,null),y(this,`_activePopup`,void 0),y(this,`_activePopup$`,new o.BehaviorSubject(null)),y(this,`activePopup$`,this._activePopup$.asObservable()),this._initZenVisible(),this.disposeWithMe(()=>{this._activePopup$.complete()})}_initZenVisible(){this.disposeWithMe(this._zenZoneService.visible$.subscribe(e=>{e&&this.hidePopup()}))}dispose(){super.dispose(),this.hidePopup()}showPopup(t,n){var r;let{row:i,col:a,unitId:o,subUnitId:s}=t;if(this._activePopup&&i===this._activePopup.row&&a===this._activePopup.col&&o===this._activePopup.unitId&&s===((r=this.activePopup)==null?void 0:r.subUnitId)){this._activePopup=t,this._activePopup$.next(t);return}if(this._lastPopup&&this._lastPopup.dispose(),this._zenZoneService.visible)return;this._activePopup=t,this._activePopup$.next(t);let c=this._cellPopupManagerService.showPopup({row:i,col:a,unitId:o,subUnitId:s},{componentKey:p,onClickOutside:()=>{this.hidePopup()},direction:`horizontal`,excludeOutside:[...Array.from(document.querySelectorAll(`.univer-thread-comment`)),document.getElementById(`thread-comment-add`)].filter(Boolean),priority:2});if(!c)throw Error(`[SheetsThreadCommentPopupService]: cannot show popup!`);let l=new e.DisposableCollection;l.add(c),l.add({dispose:()=>{n==null||n()}}),this._lastPopup=l}hidePopup(){this._activePopup&&(this._lastPopup&&this._lastPopup.dispose(),this._lastPopup=null,this._activePopup=null,this._activePopup$.next(null))}persistPopup(){!this._activePopup||!this._activePopup.temp||(this._activePopup={...this._activePopup,temp:!1},this._activePopup$.next(this._activePopup))}};S=x([b(0,(0,e.Inject)(a.SheetCanvasPopManagerService)),b(1,i.IZenZoneService),b(2,(0,e.Inject)(a.CellPopupManagerService))],S);const C={type:e.CommandType.OPERATION,id:`sheet.operation.show-comment-modal`,handler(i){var a;let o=i.get(t.SheetsSelectionsService),s=i.get(e.IUniverInstanceService),c=i.get(S),l=i.get(r.ThreadCommentPanelService),u=(a=o.getCurrentLastSelection())==null?void 0:a.primary,d=i.get(n.SheetsThreadCommentModel);if(!u)return!1;let f=(0,t.getSheetCommandTarget)(s);if(!f)return!1;let{workbook:p,worksheet:m,unitId:h,subUnitId:g}=f,_={workbook:p,worksheet:m,unitId:h,subUnitId:g,row:u.startRow,col:u.startColumn};c.showPopup(_);let v=d.getByLocation(h,g,u.startRow,u.startColumn);return v&&l.setActiveComment({unitId:h,subUnitId:g,commentId:v,trigger:`context-menu`}),!0}},w={id:`sheet.operation.toggle-comment-panel`,type:e.CommandType.OPERATION,handler(e){let t=e.get(i.ISidebarService),n=e.get(r.ThreadCommentPanelService);return n.panelVisible?(t.close(),n.setPanelVisible(!1)):(t.open({header:{title:`threadCommentUI.panel.title`},children:{label:m},width:360}),n.setPanelVisible(!0)),!0}};var T=`@univerjs/sheets-thread-comment-ui`,E=`0.20.1`;const D=`sheets-thread-comment.config`;Symbol(D);const O={};let k=class extends e.Disposable{constructor(e,t,n,r){super(),this._sheetInterceptorService=e,this._sheetsThreadCommentModel=t,this._univerInstanceService=n,this._renderManagerService=r,this._initViewModelIntercept(),this._initSkeletonChange()}_initViewModelIntercept(){this.disposeWithMe(this._sheetInterceptorService.intercept(t.INTERCEPTOR_POINT.CELL_CONTENT,{effect:e.InterceptorEffectEnum.Style,handler:(e,t,n)=>{let{row:r,col:i,unitId:a,subUnitId:o}=t;return this._sheetsThreadCommentModel.showCommentMarker(a,o,r,i)?((!e||e===t.rawData)&&(e={...t.rawData}),e.markers={...e==null?void 0:e.markers,tr:{color:`#FFBD37`,size:6}},n(e)):n(e)},priority:100}))}_initSkeletonChange(){let t=()=>{var t;let n=this._univerInstanceService.getCurrentUnitForType(e.UniverInstanceType.UNIVER_SHEET);if(!n)return;let r=n.getUnitId(),i=this._renderManagerService.getRenderById(r);i==null||(t=i.mainComponent)==null||t.makeForceDirty()};this.disposeWithMe(this._sheetsThreadCommentModel.commentUpdate$.pipe((0,o.debounceTime)(16)).subscribe(()=>{t()}))}};k=x([b(0,(0,e.Inject)(t.SheetInterceptorService)),b(1,(0,e.Inject)(n.SheetsThreadCommentModel)),b(2,e.IUniverInstanceService),b(3,s.IRenderManagerService)],k);const A=(e,t,n)=>{let r=(0,c.singleReferenceToGrid)(e),i=n.row-t.row,a=n.column-t.column;return(0,c.serializeRange)({startColumn:r.column+a,startRow:r.row+i,endColumn:r.column+a,endRow:r.row+i})};let j=class extends e.Disposable{constructor(e,t,n){super(),this._sheetClipboardService=e,this._sheetsThreadCommentModel=t,this._threadCommentDataSourceService=n,y(this,`_copyInfo`,void 0),this._initClipboardHook()}_initClipboardHook(){this.disposeWithMe(this._sheetClipboardService.addClipboardHook({id:h,onBeforeCopy:(e,t,n)=>{this._copyInfo={unitId:e,subUnitId:t,range:n}},onPasteCells:(t,n,r,i)=>{let{unitId:o,subUnitId:s,range:c}=n,u={row:c.rows[0],column:c.cols[0]};if(i.copyType===a.COPY_TYPE.CUT&&this._copyInfo){let{range:t,unitId:n,subUnitId:r}=this._copyInfo,i={row:t.startRow,column:t.startColumn};if(!(o===n&&s===r)){let a=[];e.Range.foreach(t,(e,t)=>{let i=this._sheetsThreadCommentModel.getAllByLocation(n,r,e,t);this._threadCommentDataSourceService.syncUpdateMutationToColla?i.forEach(e=>{a.push(e)}):i.forEach(({children:e,...t})=>{t.parentId||a.push(t)})});let c=[],d=[],f=[],p=[],m=e=>{c.unshift({id:l.DeleteCommentMutation.id,params:{unitId:n,subUnitId:r,commentId:e.id}}),f.push({id:l.AddCommentMutation.id,params:{unitId:o,subUnitId:s,comment:{...e,ref:A(e.ref,i,u),unitId:o,subUnitId:s},sync:!0}}),d.push({id:l.AddCommentMutation.id,params:{unitId:n,subUnitId:r,comment:e,sync:!0}}),p.unshift({id:l.DeleteCommentMutation.id,params:{unitId:o,subUnitId:s,commentId:e.id}})};return a.forEach(e=>{m(e)}),{redos:[...c,...f],undos:[...p,...d]}}}return{redos:[],undos:[]}}}))}};j=x([b(0,(0,e.Inject)(a.ISheetClipboardService)),b(1,(0,e.Inject)(n.SheetsThreadCommentModel)),b(2,l.IThreadCommentDataSourceService)],j);let M=class extends e.Disposable{constructor(e,t,n,r){super(),this._hoverManagerService=e,this._sheetsThreadCommentPopupService=t,this._sheetsThreadCommentModel=n,this._sheetPermissionCheckController=r,this._initHoverEvent()}_initHoverEvent(){this.disposeWithMe(this._hoverManagerService.currentCell$.pipe((0,o.debounceTime)(100)).subscribe(e=>{let n=this._sheetsThreadCommentPopupService.activePopup;if(e&&(n&&n.temp||!n)){let{location:r}=e,{unitId:i,subUnitId:a,row:o,col:s}=r,c=this._sheetsThreadCommentModel.getByLocation(i,a,o,s);if(c){if(!this._sheetPermissionCheckController.permissionCheckWithRanges({workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission],rangeTypes:[t.RangeProtectionPermissionViewPoint]},[{startRow:o,startColumn:s,endRow:o,endColumn:s}],i,a))return;let e=this._sheetsThreadCommentModel.getComment(i,a,c);e&&!e.resolved&&this._sheetsThreadCommentPopupService.showPopup({unitId:i,subUnitId:a,row:o,col:s,commentId:c,temp:!0})}else n&&this._sheetsThreadCommentPopupService.hidePopup()}}))}};M=x([b(0,(0,e.Inject)(a.HoverManagerService)),b(1,(0,e.Inject)(S)),b(2,(0,e.Inject)(n.SheetsThreadCommentModel)),b(3,(0,e.Inject)(t.SheetPermissionCheckController))],M);let N=class extends e.Disposable{constructor(e,t,n,r){super(),this._localeService=e,this._commandService=t,this._sheetPermissionCheckController=n,this._sheetsThreadCommentModel=r,this._commandExecutedListener()}_commandExecutedListener(){this.disposeWithMe(this._commandService.beforeCommandExecuted(e=>{let{id:n}=e;if(n===C.id||n===w.id)this._sheetPermissionCheckController.permissionCheckWithoutRange({workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission]})||this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t(`permission.dialog.commentErr`));else if(n===l.AddCommentCommand.id){let{unitId:n,subUnitId:r,comment:i}=e.params,{row:a,column:o}=(0,c.singleReferenceToGrid)(i.ref);this._sheetPermissionCheckController.permissionCheckWithRanges({workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission],rangeTypes:[t.RangeProtectionPermissionViewPoint]},[{startRow:a,startColumn:o,endRow:a,endColumn:o}],n,r)||this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t(`permission.dialog.commentErr`))}else if(n===l.UpdateCommentCommand.id){let{unitId:n,subUnitId:r,payload:i}=e.params,{commentId:a}=i,o=this._sheetsThreadCommentModel.getComment(n,r,a);if(o){let{row:e,column:i}=(0,c.singleReferenceToGrid)(o.ref);this._sheetPermissionCheckController.permissionCheckWithRanges({workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission],rangeTypes:[t.RangeProtectionPermissionViewPoint]},[{startRow:e,startColumn:i,endRow:e,endColumn:i}],n,r)||this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t(`permission.dialog.commentErr`))}}else if(n===l.ResolveCommentCommand.id||n===l.DeleteCommentCommand.id||n===l.DeleteCommentTreeCommand.id){let{unitId:n,subUnitId:r,commentId:i}=e.params,a=this._sheetsThreadCommentModel.getComment(n,r,i);if(a){let{row:e,column:i}=(0,c.singleReferenceToGrid)(a.ref);this._sheetPermissionCheckController.permissionCheckWithRanges({workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission],rangeTypes:[t.RangeProtectionPermissionViewPoint]},[{startRow:e,startColumn:i,endRow:e,endColumn:i}],n,r)||this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t(`permission.dialog.commentErr`))}}}))}};N=x([b(0,(0,e.Inject)(e.LocaleService)),b(1,e.ICommandService),b(2,(0,e.Inject)(t.SheetPermissionCheckController)),b(3,(0,e.Inject)(n.SheetsThreadCommentModel))],N);let P=class extends e.Disposable{constructor(e,t,n,r,i,a,o,s,c,l){super(),this._commandService=e,this._sheetsThreadCommentPopupService=t,this._sheetsThreadCommentModel=n,this._threadCommentPanelService=r,this._univerInstanceService=i,this._sheetPermissionCheckController=a,this._markSelectionService=o,this._sheetSelectionService=s,this._editorBridgeService=c,this._renderManagerService=l,y(this,`_isSwitchToCommenting`,!1),y(this,`_selectionShapeInfo`,null),this._initCommandListener(),this._initPanelListener(),this._initMarkSelection(),this._initSelectionUpdateListener(),this._initEditorBridge()}_handleSelectionChange(t,n,i){var o,s,c;let l=(o=t[0])==null?void 0:o.range,u=this._renderManagerService.getRenderById(n),d=u==null||(s=u.with(a.SheetSkeletonManagerService).getSkeletonParam(i))==null?void 0:s.skeleton;if(!d||!l)return;let f=d.getCellWithCoordByIndex(l.startRow,l.startColumn);if((((c=l.rangeType)==null?e.RANGE_TYPE.NORMAL:c)!==e.RANGE_TYPE.NORMAL||l.endColumn-l.startColumn>0||l.endRow-l.startRow>0)&&!((f.isMerged||f.isMergedMainCell)&&e.Rectangle.equals(f.mergeInfo,l))){this._threadCommentPanelService.activeCommentId&&this._commandService.executeCommand(r.SetActiveCommentOperation.id);return}let p=f.actualRow,m=f.actualColumn;if(!this._sheetsThreadCommentModel.showCommentMarker(n,i,p,m)){this._threadCommentPanelService.activeCommentId&&this._commandService.executeCommand(r.SetActiveCommentOperation.id);return}let h=this._sheetsThreadCommentModel.getByLocation(n,i,p,m);h&&this._commandService.executeCommand(r.SetActiveCommentOperation.id,{unitId:n,subUnitId:i,commentId:h})}_initSelectionUpdateListener(){this.disposeWithMe(this._sheetSelectionService.selectionMoveEnd$.subscribe(e=>{if(this._isSwitchToCommenting)return;let t=this._sheetSelectionService.currentSelectionParam;t&&this._handleSelectionChange(e,t.unitId,t.sheetId)}))}_initEditorBridge(){this.disposeWithMe(this._editorBridgeService.visible$.subscribe(e=>{e.visible&&this._sheetsThreadCommentPopupService.hidePopup()}))}_initCommandListener(){this._commandService.onCommandExecuted(e=>{if(e.id===l.DeleteCommentMutation.id){let t=e.params,n=this._sheetsThreadCommentPopupService.activePopup;if(!n)return;let{unitId:r,subUnitId:i,commentId:a}=n;t.unitId===r&&t.subUnitId===i&&t.commentId===a&&this._sheetsThreadCommentPopupService.hidePopup()}})}_initPanelListener(){this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe(async n=>{if(n){var r;let{unitId:i,subUnitId:o,commentId:s,trigger:l}=n,u=this._sheetsThreadCommentModel.getComment(i,o,s);if(!u||u.resolved)return;let d=this._univerInstanceService.getCurrentUnitForType(e.UniverInstanceType.UNIVER_SHEET);if(!d||d.getUnitId()!==i)return;this._isSwitchToCommenting=!0,((r=d.getActiveSheet())==null?void 0:r.getSheetId())!==o&&await this._commandService.executeCommand(t.SetWorksheetActiveOperation.id,{unitId:i,subUnitId:o}),this._isSwitchToCommenting=!1;let f=(0,c.singleReferenceToGrid)(u.ref),{row:p,column:m}=f;if(!this._sheetPermissionCheckController.permissionCheckWithRanges({workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission],rangeTypes:[t.RangeProtectionPermissionViewPoint]},[{startRow:p,startColumn:m,endRow:p,endColumn:m}],i,o)||(await this._commandService.executeCommand(a.ScrollToRangeOperation.id,{range:{startRow:Math.max(f.row-1,0),endRow:f.row+1,startColumn:Math.max(f.column-1,0),endColumn:f.column+1}}),this._editorBridgeService.isVisible().visible))return;this._sheetsThreadCommentPopupService.showPopup({unitId:i,subUnitId:o,row:f.row,col:f.column,commentId:u.id,trigger:l})}else this._sheetsThreadCommentPopupService.hidePopup()}))}_initMarkSelection(){this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.pipe((0,o.debounceTime)(100)).subscribe(t=>{var n,r;if(!t){this._selectionShapeInfo&&(this._markSelectionService.removeShape(this._selectionShapeInfo.shapeId),this._selectionShapeInfo=null);return}let{unitId:i,subUnitId:a,commentId:o}=t;this._selectionShapeInfo&&(this._markSelectionService.removeShape(this._selectionShapeInfo.shapeId),this._selectionShapeInfo=null);let s=this._sheetsThreadCommentModel.getComment(i,a,o);if(!s)return;let{row:l,column:u}=(0,c.singleReferenceToGrid)(s.ref);if(Number.isNaN(l)||Number.isNaN(u))return null;let d=(n=this._univerInstanceService.getCurrentUnitForType(e.UniverInstanceType.UNIVER_SHEET))==null?void 0:n.getSheetBySheetId(a),f=(r=d==null?void 0:d.getMergedCell(l,u))==null?{startColumn:u,endColumn:u,startRow:l,endRow:l}:r,p=this._markSelectionService.addShape({range:f,style:{fill:`rgba(255, 189, 55, 0.35)`,strokeWidth:1,stroke:`#FFBD37`,widgets:{}},primary:null},[],-1);p&&(this._selectionShapeInfo={...t,shapeId:p})}))}};P=x([b(0,e.ICommandService),b(1,(0,e.Inject)(S)),b(2,(0,e.Inject)(n.SheetsThreadCommentModel)),b(3,(0,e.Inject)(r.ThreadCommentPanelService)),b(4,e.IUniverInstanceService),b(5,(0,e.Inject)(t.SheetPermissionCheckController)),b(6,a.IMarkSelectionService),b(7,(0,e.Inject)(t.SheetsSelectionsService)),b(8,a.IEditorBridgeService),b(9,s.IRenderManagerService)],P);const F=n=>({id:C.id,type:i.MenuItemType.BUTTON,icon:`CommentIcon`,title:`sheetThreadComment.menu.addComment`,hidden$:(0,i.getMenuHiddenObservable)(n,e.UniverInstanceType.UNIVER_SHEET),disabled$:(0,a.getCurrentRangeDisable$)(n,{workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission],rangeTypes:[t.RangeProtectionPermissionViewPoint]})}),I=n=>({id:w.id,type:i.MenuItemType.BUTTON,icon:`CommentIcon`,tooltip:`sheetThreadComment.menu.commentManagement`,disabled$:(0,a.getCurrentRangeDisable$)(n,{workbookTypes:[t.WorkbookCommentPermission],worksheetTypes:[t.WorksheetViewPermission],rangeTypes:[t.RangeProtectionPermissionViewPoint]}),hidden$:(0,i.getMenuHiddenObservable)(n,e.UniverInstanceType.UNIVER_SHEET)}),L={id:C.id,binding:i.KeyCode.M|i.MetaKeys.CTRL_COMMAND|i.MetaKeys.ALT,preconditions:a.whenSheetEditorFocused},R={[i.RibbonInsertGroup.MEDIA]:{[w.id]:{order:2,menuItemFactory:I}},[i.ContextMenuPosition.MAIN_AREA]:{[i.ContextMenuGroup.OTHERS]:{[C.id]:{order:0,menuItemFactory:F}}}},z=()=>{let t=(0,i.useDependency)(e.IUniverInstanceService),a=(0,i.useDependency)(S),o=(0,i.useObservable)(a.activePopup$),s=(0,i.useDependency)(n.SheetsThreadCommentModel);if((0,i.useObservable)(s.commentUpdate$),!o)return null;let{row:c,col:l,unitId:u,subUnitId:f,trigger:p}=o,m=s.getByLocation(u,f,c,l),h=`${e.Tools.chatAtABC(l)}${c+1}`;return(0,d.jsx)(r.ThreadCommentTree,{onClick:()=>{a.persistPopup()},location:r.ThreadCommentTreeLocation.CELL,id:m,unitId:u,subUnitId:f,type:e.UniverInstanceType.UNIVER_SHEET,refStr:h,onClose:()=>{a.hidePopup()},getSubUnitName:n=>{var r,i;return(r=(i=t.getCurrentUnitForType(e.UniverInstanceType.UNIVER_SHEET))==null||(i=i.getSheetBySheetId(n))==null?void 0:i.getName())==null?``:r},autoFocus:p===`context-menu`})},B=()=>{var t;let n=(0,i.useDependency)(a.IMarkSelectionService),s=(0,i.useDependency)(e.IUniverInstanceService),l=(0,i.useDependency)(S),u=s.getCurrentUnitForType(e.UniverInstanceType.UNIVER_SHEET),p=u.getUnitId(),m=(0,i.useDependency)(e.ICommandService),h=(0,f.useMemo)(()=>u.activeSheet$.pipe((0,o.map)(e=>e==null?void 0:e.getSheetId())),[u.activeSheet$]),g=(0,i.useObservable)(h,(t=u.getActiveSheet())==null?void 0:t.getSheetId()),_=(0,f.useRef)(null),v=(0,i.useDependency)(r.ThreadCommentPanelService),y=(0,i.useObservable)(v.activeCommentId$),b=(0,i.useObservable)(v.panelVisible$,v.panelVisible),x=(0,f.useCallback)(e=>{let t=u.getSheets(),n={};t.forEach((e,t)=>{n[e.getSheetId()]=t});let r=e=>e.map(e=>{var t;let r=(0,c.singleReferenceToGrid)(e.ref),i=[(t=n[e.subUnitId])==null?0:t,r.row,r.column];return{...e,p:i}}).sort((e,t)=>e.p[0]===t.p[0]?e.p[1]===t.p[1]?e.p[2]-t.p[2]:e.p[1]-t.p[1]:e.p[0]-t.p[0]);return[...r(e.filter(e=>!e.resolved)),...r(e.filter(e=>e.resolved))]},[u]),w=(0,f.useCallback)(e=>{if(e.unitId===p&&e.subUnitId===g&&!e.resolved){var t;let{row:r,column:i}=(0,c.singleReferenceToGrid)(e.ref),a=u.getSheetBySheetId(e.subUnitId),o=(t=a==null?void 0:a.getMergedCell(r,i))==null?{startColumn:i,endColumn:i,startRow:r,endRow:r}:t;if(!Number.isNaN(r)&&!Number.isNaN(i))return n.addShape({range:o,style:{fill:`rgb(255, 189, 55, 0.35)`,strokeWidth:1,stroke:`#FFBD37`,widgets:{}},primary:null})}return null},[n,g,p]),T=e=>{var t,n;return(t=(n=u.getSheetBySheetId(e))==null?void 0:n.getName())==null?``:t},E=()=>{m.executeCommand(C.id)},D=e=>{y&&y.unitId===e.unitId&&y.subUnitId===e.subUnitId&&y.commentId===e.id||(_.current&&(n.removeShape(_.current),_.current=null),_.current=w(e))},O=()=>{_.current&&(n.removeShape(_.current),_.current=null)};return(0,f.useEffect)(()=>{!b&&_.current&&n.removeShape(_.current)},[n,b]),(0,d.jsx)(r.ThreadCommentPanel,{unitId:p,subUnitId$:h,type:e.UniverInstanceType.UNIVER_SHEET,onAdd:E,getSubUnitName:T,onResolve:(e,t)=>{t&&l.hidePopup()},sortComments:x,onItemEnter:D,onItemLeave:O,onDeleteComment:()=>(O(),!0)})};let V=class extends e.Disposable{constructor(e,t,n){super(),this._menuManagerService=e,this._componentManager=t,this._shortcutService=n,this._initMenu(),this._initShortcut(),this._initComponent()}_initShortcut(){this._shortcutService.registerShortcut(L)}_initMenu(){this._menuManagerService.mergeMenu(R)}_initComponent(){[[p,z],[m,B],[`CommentIcon`,u.CommentIcon]].forEach(([e,t])=>{this.disposeWithMe(this._componentManager.register(e,t))})}};V=x([b(0,i.IMenuManagerService),b(1,(0,e.Inject)(i.ComponentManager)),b(2,i.IShortcutService)],V);let H=class extends e.Plugin{constructor(t=O,n,r,i){super(),this._config=t,this._injector=n,this._commandService=r,this._configService=i;let{menu:a,...o}=(0,e.merge)({},O,this._config);a&&this._configService.setConfig(`menu`,a,{merge:!0}),this._configService.setConfig(D,o)}onStarting(){[[V],[k],[j],[M],[P],[S],[N]].forEach(e=>{this._injector.add(e)}),[C,w].forEach(e=>{this._commandService.registerCommand(e)}),this._injector.get(V)}onReady(){this._injector.get(k)}onRendered(){this._injector.get(j),this._injector.get(M),this._injector.get(P),this._injector.get(N)}};y(H,`pluginName`,h),y(H,`packageName`,T),y(H,`version`,E),y(H,`type`,e.UniverInstanceType.UNIVER_SHEET),H=x([(0,e.DependentOn)(r.UniverThreadCommentUIPlugin,n.UniverSheetsThreadCommentPlugin),b(1,(0,e.Inject)(e.Injector)),b(2,(0,e.Inject)(e.ICommandService)),b(3,e.IConfigService)],H),Object.defineProperty(exports,`AddCommentCommand`,{enumerable:!0,get:function(){return l.AddCommentCommand}}),Object.defineProperty(exports,`DeleteCommentCommand`,{enumerable:!0,get:function(){return l.DeleteCommentCommand}}),Object.defineProperty(exports,`DeleteCommentTreeCommand`,{enumerable:!0,get:function(){return l.DeleteCommentTreeCommand}}),Object.defineProperty(exports,`IThreadCommentDataSourceService`,{enumerable:!0,get:function(){return l.IThreadCommentDataSourceService}}),Object.defineProperty(exports,`ResolveCommentCommand`,{enumerable:!0,get:function(){return l.ResolveCommentCommand}}),Object.defineProperty(exports,`SheetsThreadCommentPopupService`,{enumerable:!0,get:function(){return S}}),exports.ShowAddSheetCommentModalOperation=C,exports.ToggleSheetCommentPanelOperation=w,Object.defineProperty(exports,`UniverSheetsThreadCommentUIPlugin`,{enumerable:!0,get:function(){return H}}),Object.defineProperty(exports,`UniverThreadCommentUIPlugin`,{enumerable:!0,get:function(){return r.UniverThreadCommentUIPlugin}}),Object.defineProperty(exports,`UpdateCommentCommand`,{enumerable:!0,get:function(){return l.UpdateCommentCommand}});
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+let _univerjs_core = require("@univerjs/core");
+let _univerjs_sheets = require("@univerjs/sheets");
+let _univerjs_sheets_thread_comment = require("@univerjs/sheets-thread-comment");
+let _univerjs_thread_comment_ui = require("@univerjs/thread-comment-ui");
+let _univerjs_ui = require("@univerjs/ui");
+let _univerjs_sheets_ui = require("@univerjs/sheets-ui");
+let rxjs = require("rxjs");
+let _univerjs_engine_render = require("@univerjs/engine-render");
+let _univerjs_engine_formula = require("@univerjs/engine-formula");
+let _univerjs_thread_comment = require("@univerjs/thread-comment");
+let _univerjs_icons = require("@univerjs/icons");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+
+//#region src/types/const.ts
+/**
+* Copyright 2023-present DreamNum Co., Ltd.
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+const SHEETS_THREAD_COMMENT_MODAL = "univer.sheet.thread-comment-modal";
+const SHEETS_THREAD_COMMENT_PANEL = "univer.sheet.thread-comment-panel";
+const PLUGIN_NAME = "SHEET_THREAD_COMMENT_UI_PLUGIN";
+
+//#endregion
+//#region \0@oxc-project+runtime@0.124.0/helpers/typeof.js
+function _typeof(o) {
+	"@babel/helpers - typeof";
+	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
+		return typeof o;
+	} : function(o) {
+		return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
+	}, _typeof(o);
+}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.124.0/helpers/toPrimitive.js
+function toPrimitive(t, r) {
+	if ("object" != _typeof(t) || !t) return t;
+	var e = t[Symbol.toPrimitive];
+	if (void 0 !== e) {
+		var i = e.call(t, r || "default");
+		if ("object" != _typeof(i)) return i;
+		throw new TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return ("string" === r ? String : Number)(t);
+}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.124.0/helpers/toPropertyKey.js
+function toPropertyKey(t) {
+	var i = toPrimitive(t, "string");
+	return "symbol" == _typeof(i) ? i : i + "";
+}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.124.0/helpers/defineProperty.js
+function _defineProperty(e, r, t) {
+	return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+		value: t,
+		enumerable: !0,
+		configurable: !0,
+		writable: !0
+	}) : e[r] = t, e;
+}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.124.0/helpers/decorateParam.js
+function __decorateParam(paramIndex, decorator) {
+	return function(target, key) {
+		decorator(target, key, paramIndex);
+	};
+}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.124.0/helpers/decorate.js
+function __decorate(decorators, target, key, desc) {
+	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+	else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+	return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+//#endregion
+//#region src/services/sheets-thread-comment-popup.service.ts
+let SheetsThreadCommentPopupService = class SheetsThreadCommentPopupService extends _univerjs_core.Disposable {
+	get activePopup() {
+		return this._activePopup;
+	}
+	constructor(_canvasPopupManagerService, _zenZoneService, _cellPopupManagerService) {
+		super();
+		this._canvasPopupManagerService = _canvasPopupManagerService;
+		this._zenZoneService = _zenZoneService;
+		this._cellPopupManagerService = _cellPopupManagerService;
+		_defineProperty(this, "_lastPopup", null);
+		_defineProperty(this, "_activePopup", void 0);
+		_defineProperty(this, "_activePopup$", new rxjs.BehaviorSubject(null));
+		_defineProperty(this, "activePopup$", this._activePopup$.asObservable());
+		this._initZenVisible();
+		this.disposeWithMe(() => {
+			this._activePopup$.complete();
+		});
+	}
+	_initZenVisible() {
+		this.disposeWithMe(this._zenZoneService.visible$.subscribe((visible) => {
+			if (visible) this.hidePopup();
+		}));
+	}
+	dispose() {
+		super.dispose();
+		this.hidePopup();
+	}
+	showPopup(location, onHide) {
+		var _this$activePopup;
+		const { row, col, unitId, subUnitId } = location;
+		if (this._activePopup && row === this._activePopup.row && col === this._activePopup.col && unitId === this._activePopup.unitId && subUnitId === ((_this$activePopup = this.activePopup) === null || _this$activePopup === void 0 ? void 0 : _this$activePopup.subUnitId)) {
+			this._activePopup = location;
+			this._activePopup$.next(location);
+			return;
+		}
+		if (this._lastPopup) this._lastPopup.dispose();
+		if (this._zenZoneService.visible) return;
+		this._activePopup = location;
+		this._activePopup$.next(location);
+		const popupDisposable = this._cellPopupManagerService.showPopup({
+			row,
+			col,
+			unitId,
+			subUnitId
+		}, {
+			componentKey: SHEETS_THREAD_COMMENT_MODAL,
+			onClickOutside: () => {
+				this.hidePopup();
+			},
+			direction: "horizontal",
+			excludeOutside: [...Array.from(document.querySelectorAll(".univer-thread-comment")), document.getElementById("thread-comment-add")].filter(Boolean),
+			priority: 2
+		});
+		if (!popupDisposable) throw new Error("[SheetsThreadCommentPopupService]: cannot show popup!");
+		const disposableCollection = new _univerjs_core.DisposableCollection();
+		disposableCollection.add(popupDisposable);
+		disposableCollection.add({ dispose: () => {
+			onHide === null || onHide === void 0 || onHide();
+		} });
+		this._lastPopup = disposableCollection;
+	}
+	hidePopup() {
+		if (!this._activePopup) return;
+		if (this._lastPopup) this._lastPopup.dispose();
+		this._lastPopup = null;
+		this._activePopup = null;
+		this._activePopup$.next(null);
+	}
+	persistPopup() {
+		if (!this._activePopup || !this._activePopup.temp) return;
+		this._activePopup = {
+			...this._activePopup,
+			temp: false
+		};
+		this._activePopup$.next(this._activePopup);
+	}
+};
+SheetsThreadCommentPopupService = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_sheets_ui.SheetCanvasPopManagerService)),
+	__decorateParam(1, _univerjs_ui.IZenZoneService),
+	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_sheets_ui.CellPopupManagerService))
+], SheetsThreadCommentPopupService);
+
+//#endregion
+//#region src/commands/operations/comment.operation.ts
+const ShowAddSheetCommentModalOperation = {
+	type: _univerjs_core.CommandType.OPERATION,
+	id: "sheet.operation.show-comment-modal",
+	handler(accessor) {
+		var _selectionManagerServ;
+		const selectionManagerService = accessor.get(_univerjs_sheets.SheetsSelectionsService);
+		const univerInstanceService = accessor.get(_univerjs_core.IUniverInstanceService);
+		const sheetsThreadCommentPopupService = accessor.get(SheetsThreadCommentPopupService);
+		const threadCommentPanelService = accessor.get(_univerjs_thread_comment_ui.ThreadCommentPanelService);
+		const activeCell = (_selectionManagerServ = selectionManagerService.getCurrentLastSelection()) === null || _selectionManagerServ === void 0 ? void 0 : _selectionManagerServ.primary;
+		const model = accessor.get(_univerjs_sheets_thread_comment.SheetsThreadCommentModel);
+		if (!activeCell) return false;
+		const result = (0, _univerjs_sheets.getSheetCommandTarget)(univerInstanceService);
+		if (!result) return false;
+		const { workbook, worksheet, unitId, subUnitId } = result;
+		const location = {
+			workbook,
+			worksheet,
+			unitId,
+			subUnitId,
+			row: activeCell.startRow,
+			col: activeCell.startColumn
+		};
+		sheetsThreadCommentPopupService.showPopup(location);
+		const rootId = model.getByLocation(unitId, subUnitId, activeCell.startRow, activeCell.startColumn);
+		if (rootId) threadCommentPanelService.setActiveComment({
+			unitId,
+			subUnitId,
+			commentId: rootId,
+			trigger: "context-menu"
+		});
+		return true;
+	}
+};
+const ToggleSheetCommentPanelOperation = {
+	id: "sheet.operation.toggle-comment-panel",
+	type: _univerjs_core.CommandType.OPERATION,
+	handler(accessor) {
+		const sidebarService = accessor.get(_univerjs_ui.ISidebarService);
+		const panelService = accessor.get(_univerjs_thread_comment_ui.ThreadCommentPanelService);
+		if (panelService.panelVisible) {
+			sidebarService.close();
+			panelService.setPanelVisible(false);
+		} else {
+			sidebarService.open({
+				header: { title: "threadCommentUI.panel.title" },
+				children: { label: SHEETS_THREAD_COMMENT_PANEL },
+				width: 360
+			});
+			panelService.setPanelVisible(true);
+		}
+		return true;
+	}
+};
+
+//#endregion
+//#region package.json
+var name = "@univerjs/sheets-thread-comment-ui";
+var version = "0.21.0";
+
+//#endregion
+//#region src/config/config.ts
+const SHEETS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY = "sheets-thread-comment.config";
+const configSymbol = Symbol(SHEETS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY);
+const defaultPluginConfig = {};
+
+//#endregion
+//#region src/controllers/render-controllers/render.controller.ts
+let SheetsThreadCommentRenderController = class SheetsThreadCommentRenderController extends _univerjs_core.Disposable {
+	constructor(_sheetInterceptorService, _sheetsThreadCommentModel, _univerInstanceService, _renderManagerService) {
+		super();
+		this._sheetInterceptorService = _sheetInterceptorService;
+		this._sheetsThreadCommentModel = _sheetsThreadCommentModel;
+		this._univerInstanceService = _univerInstanceService;
+		this._renderManagerService = _renderManagerService;
+		this._initViewModelIntercept();
+		this._initSkeletonChange();
+	}
+	_initViewModelIntercept() {
+		this.disposeWithMe(this._sheetInterceptorService.intercept(_univerjs_sheets.INTERCEPTOR_POINT.CELL_CONTENT, {
+			effect: _univerjs_core.InterceptorEffectEnum.Style,
+			handler: (cell, pos, next) => {
+				const { row, col, unitId, subUnitId } = pos;
+				if (this._sheetsThreadCommentModel.showCommentMarker(unitId, subUnitId, row, col)) {
+					if (!cell || cell === pos.rawData) cell = { ...pos.rawData };
+					cell.markers = {
+						...cell === null || cell === void 0 ? void 0 : cell.markers,
+						tr: {
+							color: "#FFBD37",
+							size: 6
+						}
+					};
+					return next(cell);
+				}
+				return next(cell);
+			},
+			priority: 100
+		}));
+	}
+	_initSkeletonChange() {
+		const markSkeletonDirty = () => {
+			var _currentRender$mainCo;
+			const workbook = this._univerInstanceService.getCurrentUnitForType(_univerjs_core.UniverInstanceType.UNIVER_SHEET);
+			if (!workbook) return;
+			const unitId = workbook.getUnitId();
+			const currentRender = this._renderManagerService.getRenderById(unitId);
+			currentRender === null || currentRender === void 0 || (_currentRender$mainCo = currentRender.mainComponent) === null || _currentRender$mainCo === void 0 || _currentRender$mainCo.makeForceDirty();
+		};
+		this.disposeWithMe(this._sheetsThreadCommentModel.commentUpdate$.pipe((0, rxjs.debounceTime)(16)).subscribe(() => {
+			markSkeletonDirty();
+		}));
+	}
+};
+SheetsThreadCommentRenderController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetInterceptorService)),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_sheets_thread_comment.SheetsThreadCommentModel)),
+	__decorateParam(2, _univerjs_core.IUniverInstanceService),
+	__decorateParam(3, _univerjs_engine_render.IRenderManagerService)
+], SheetsThreadCommentRenderController);
+
+//#endregion
+//#region src/controllers/sheets-thread-comment-copy-paste.controller.ts
+const transformRef = (ref, source, target) => {
+	const refObj = (0, _univerjs_engine_formula.singleReferenceToGrid)(ref);
+	const offsetRow = target.row - source.row;
+	const offsetCol = target.column - source.column;
+	return (0, _univerjs_engine_formula.serializeRange)({
+		startColumn: refObj.column + offsetCol,
+		startRow: refObj.row + offsetRow,
+		endColumn: refObj.column + offsetCol,
+		endRow: refObj.row + offsetRow
+	});
+};
+let SheetsThreadCommentCopyPasteController = class SheetsThreadCommentCopyPasteController extends _univerjs_core.Disposable {
+	constructor(_sheetClipboardService, _sheetsThreadCommentModel, _threadCommentDataSourceService) {
+		super();
+		this._sheetClipboardService = _sheetClipboardService;
+		this._sheetsThreadCommentModel = _sheetsThreadCommentModel;
+		this._threadCommentDataSourceService = _threadCommentDataSourceService;
+		_defineProperty(this, "_copyInfo", void 0);
+		this._initClipboardHook();
+	}
+	_initClipboardHook() {
+		this.disposeWithMe(this._sheetClipboardService.addClipboardHook({
+			id: PLUGIN_NAME,
+			onBeforeCopy: (unitId, subUnitId, range) => {
+				this._copyInfo = {
+					unitId,
+					subUnitId,
+					range
+				};
+			},
+			onPasteCells: (_pasteFrom, pasteTo, _data, payload) => {
+				const { unitId: targetUnitId, subUnitId: targetSubUnitId, range } = pasteTo;
+				const targetPos = {
+					row: range.rows[0],
+					column: range.cols[0]
+				};
+				if (payload.copyType === _univerjs_sheets_ui.COPY_TYPE.CUT && this._copyInfo) {
+					const { range, unitId: sourceUnitId, subUnitId: sourceSubUnitId } = this._copyInfo;
+					const sourcePos = {
+						row: range.startRow,
+						column: range.startColumn
+					};
+					if (!(targetUnitId === sourceUnitId && targetSubUnitId === sourceSubUnitId)) {
+						const roots = [];
+						_univerjs_core.Range.foreach(range, (row, col) => {
+							const comments = this._sheetsThreadCommentModel.getAllByLocation(sourceUnitId, sourceSubUnitId, row, col);
+							if (this._threadCommentDataSourceService.syncUpdateMutationToColla) comments.forEach((comment) => {
+								roots.push(comment);
+							});
+							else comments.forEach(({ children, ...comment }) => {
+								if (!comment.parentId) roots.push(comment);
+							});
+						});
+						const sourceRedos = [];
+						const sourceUndos = [];
+						const targetRedos = [];
+						const targetUndos = [];
+						const handleCommentItem = (item) => {
+							sourceRedos.unshift({
+								id: _univerjs_thread_comment.DeleteCommentMutation.id,
+								params: {
+									unitId: sourceUnitId,
+									subUnitId: sourceSubUnitId,
+									commentId: item.id
+								}
+							});
+							targetRedos.push({
+								id: _univerjs_thread_comment.AddCommentMutation.id,
+								params: {
+									unitId: targetUnitId,
+									subUnitId: targetSubUnitId,
+									comment: {
+										...item,
+										ref: transformRef(item.ref, sourcePos, targetPos),
+										unitId: targetUnitId,
+										subUnitId: targetSubUnitId
+									},
+									sync: true
+								}
+							});
+							sourceUndos.push({
+								id: _univerjs_thread_comment.AddCommentMutation.id,
+								params: {
+									unitId: sourceUnitId,
+									subUnitId: sourceSubUnitId,
+									comment: item,
+									sync: true
+								}
+							});
+							targetUndos.unshift({
+								id: _univerjs_thread_comment.DeleteCommentMutation.id,
+								params: {
+									unitId: targetUnitId,
+									subUnitId: targetSubUnitId,
+									commentId: item.id
+								}
+							});
+						};
+						roots.forEach((root) => {
+							handleCommentItem(root);
+						});
+						return {
+							redos: [...sourceRedos, ...targetRedos],
+							undos: [...targetUndos, ...sourceUndos]
+						};
+					}
+				}
+				return {
+					redos: [],
+					undos: []
+				};
+			}
+		}));
+	}
+};
+SheetsThreadCommentCopyPasteController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_sheets_ui.ISheetClipboardService)),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_sheets_thread_comment.SheetsThreadCommentModel)),
+	__decorateParam(2, _univerjs_thread_comment.IThreadCommentDataSourceService)
+], SheetsThreadCommentCopyPasteController);
+
+//#endregion
+//#region src/controllers/sheets-thread-comment-hover.controller.ts
+/**
+* Copyright 2023-present DreamNum Co., Ltd.
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+let SheetsThreadCommentHoverController = class SheetsThreadCommentHoverController extends _univerjs_core.Disposable {
+	constructor(_hoverManagerService, _sheetsThreadCommentPopupService, _sheetsThreadCommentModel, _sheetPermissionCheckController) {
+		super();
+		this._hoverManagerService = _hoverManagerService;
+		this._sheetsThreadCommentPopupService = _sheetsThreadCommentPopupService;
+		this._sheetsThreadCommentModel = _sheetsThreadCommentModel;
+		this._sheetPermissionCheckController = _sheetPermissionCheckController;
+		this._initHoverEvent();
+	}
+	_initHoverEvent() {
+		this.disposeWithMe(this._hoverManagerService.currentCell$.pipe((0, rxjs.debounceTime)(100)).subscribe((cell) => {
+			const currentPopup = this._sheetsThreadCommentPopupService.activePopup;
+			if (cell && (currentPopup && currentPopup.temp || !currentPopup)) {
+				const { location } = cell;
+				const { unitId, subUnitId, row, col } = location;
+				const commentId = this._sheetsThreadCommentModel.getByLocation(unitId, subUnitId, row, col);
+				if (commentId) {
+					if (!this._sheetPermissionCheckController.permissionCheckWithRanges({
+						workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+						worksheetTypes: [_univerjs_sheets.WorksheetViewPermission],
+						rangeTypes: [_univerjs_sheets.RangeProtectionPermissionViewPoint]
+					}, [{
+						startRow: row,
+						startColumn: col,
+						endRow: row,
+						endColumn: col
+					}], unitId, subUnitId)) return;
+					const comment = this._sheetsThreadCommentModel.getComment(unitId, subUnitId, commentId);
+					if (comment && !comment.resolved) this._sheetsThreadCommentPopupService.showPopup({
+						unitId,
+						subUnitId,
+						row,
+						col,
+						commentId,
+						temp: true
+					});
+				} else if (currentPopup) this._sheetsThreadCommentPopupService.hidePopup();
+			}
+		}));
+	}
+};
+SheetsThreadCommentHoverController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_sheets_ui.HoverManagerService)),
+	__decorateParam(1, (0, _univerjs_core.Inject)(SheetsThreadCommentPopupService)),
+	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_sheets_thread_comment.SheetsThreadCommentModel)),
+	__decorateParam(3, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetPermissionCheckController))
+], SheetsThreadCommentHoverController);
+
+//#endregion
+//#region src/controllers/sheets-thread-comment-permission.controller.ts
+let SheetsThreadCommentPermissionController = class SheetsThreadCommentPermissionController extends _univerjs_core.Disposable {
+	constructor(_localeService, _commandService, _sheetPermissionCheckController, _sheetsThreadCommentModel) {
+		super();
+		this._localeService = _localeService;
+		this._commandService = _commandService;
+		this._sheetPermissionCheckController = _sheetPermissionCheckController;
+		this._sheetsThreadCommentModel = _sheetsThreadCommentModel;
+		this._commandExecutedListener();
+	}
+	_commandExecutedListener() {
+		this.disposeWithMe(this._commandService.beforeCommandExecuted((command) => {
+			const { id } = command;
+			if (id === ShowAddSheetCommentModalOperation.id || id === ToggleSheetCommentPanelOperation.id) {
+				if (!this._sheetPermissionCheckController.permissionCheckWithoutRange({
+					workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+					worksheetTypes: [_univerjs_sheets.WorksheetViewPermission]
+				})) this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t("permission.dialog.commentErr"));
+			} else if (id === _univerjs_thread_comment.AddCommentCommand.id) {
+				const { unitId, subUnitId, comment } = command.params;
+				const { row, column } = (0, _univerjs_engine_formula.singleReferenceToGrid)(comment.ref);
+				if (!this._sheetPermissionCheckController.permissionCheckWithRanges({
+					workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+					worksheetTypes: [_univerjs_sheets.WorksheetViewPermission],
+					rangeTypes: [_univerjs_sheets.RangeProtectionPermissionViewPoint]
+				}, [{
+					startRow: row,
+					startColumn: column,
+					endRow: row,
+					endColumn: column
+				}], unitId, subUnitId)) this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t("permission.dialog.commentErr"));
+			} else if (id === _univerjs_thread_comment.UpdateCommentCommand.id) {
+				const { unitId, subUnitId, payload } = command.params;
+				const { commentId } = payload;
+				const comment = this._sheetsThreadCommentModel.getComment(unitId, subUnitId, commentId);
+				if (comment) {
+					const { row, column } = (0, _univerjs_engine_formula.singleReferenceToGrid)(comment.ref);
+					if (!this._sheetPermissionCheckController.permissionCheckWithRanges({
+						workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+						worksheetTypes: [_univerjs_sheets.WorksheetViewPermission],
+						rangeTypes: [_univerjs_sheets.RangeProtectionPermissionViewPoint]
+					}, [{
+						startRow: row,
+						startColumn: column,
+						endRow: row,
+						endColumn: column
+					}], unitId, subUnitId)) this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t("permission.dialog.commentErr"));
+				}
+			} else if (id === _univerjs_thread_comment.ResolveCommentCommand.id || id === _univerjs_thread_comment.DeleteCommentCommand.id || id === _univerjs_thread_comment.DeleteCommentTreeCommand.id) {
+				const { unitId, subUnitId, commentId } = command.params;
+				const comment = this._sheetsThreadCommentModel.getComment(unitId, subUnitId, commentId);
+				if (comment) {
+					const { row, column } = (0, _univerjs_engine_formula.singleReferenceToGrid)(comment.ref);
+					if (!this._sheetPermissionCheckController.permissionCheckWithRanges({
+						workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+						worksheetTypes: [_univerjs_sheets.WorksheetViewPermission],
+						rangeTypes: [_univerjs_sheets.RangeProtectionPermissionViewPoint]
+					}, [{
+						startRow: row,
+						startColumn: column,
+						endRow: row,
+						endColumn: column
+					}], unitId, subUnitId)) this._sheetPermissionCheckController.blockExecuteWithoutPermission(this._localeService.t("permission.dialog.commentErr"));
+				}
+			}
+		}));
+	}
+};
+SheetsThreadCommentPermissionController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_core.LocaleService)),
+	__decorateParam(1, _univerjs_core.ICommandService),
+	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetPermissionCheckController)),
+	__decorateParam(3, (0, _univerjs_core.Inject)(_univerjs_sheets_thread_comment.SheetsThreadCommentModel))
+], SheetsThreadCommentPermissionController);
+
+//#endregion
+//#region src/controllers/sheets-thread-comment-popup.controller.ts
+let SheetsThreadCommentPopupController = class SheetsThreadCommentPopupController extends _univerjs_core.Disposable {
+	constructor(_commandService, _sheetsThreadCommentPopupService, _sheetsThreadCommentModel, _threadCommentPanelService, _univerInstanceService, _sheetPermissionCheckController, _markSelectionService, _sheetSelectionService, _editorBridgeService, _renderManagerService) {
+		super();
+		this._commandService = _commandService;
+		this._sheetsThreadCommentPopupService = _sheetsThreadCommentPopupService;
+		this._sheetsThreadCommentModel = _sheetsThreadCommentModel;
+		this._threadCommentPanelService = _threadCommentPanelService;
+		this._univerInstanceService = _univerInstanceService;
+		this._sheetPermissionCheckController = _sheetPermissionCheckController;
+		this._markSelectionService = _markSelectionService;
+		this._sheetSelectionService = _sheetSelectionService;
+		this._editorBridgeService = _editorBridgeService;
+		this._renderManagerService = _renderManagerService;
+		_defineProperty(this, "_isSwitchToCommenting", false);
+		_defineProperty(this, "_selectionShapeInfo", null);
+		this._initCommandListener();
+		this._initPanelListener();
+		this._initMarkSelection();
+		this._initSelectionUpdateListener();
+		this._initEditorBridge();
+	}
+	_handleSelectionChange(selections, unitId, subUnitId) {
+		var _selections$, _render$with$getSkele, _range$rangeType;
+		const range = (_selections$ = selections[0]) === null || _selections$ === void 0 ? void 0 : _selections$.range;
+		const render = this._renderManagerService.getRenderById(unitId);
+		const skeleton = render === null || render === void 0 || (_render$with$getSkele = render.with(_univerjs_sheets_ui.SheetSkeletonManagerService).getSkeletonParam(subUnitId)) === null || _render$with$getSkele === void 0 ? void 0 : _render$with$getSkele.skeleton;
+		if (!skeleton) return;
+		if (!range) return;
+		const actualCell = skeleton.getCellWithCoordByIndex(range.startRow, range.startColumn);
+		if ((((_range$rangeType = range.rangeType) !== null && _range$rangeType !== void 0 ? _range$rangeType : _univerjs_core.RANGE_TYPE.NORMAL) !== _univerjs_core.RANGE_TYPE.NORMAL || range.endColumn - range.startColumn > 0 || range.endRow - range.startRow > 0) && !((actualCell.isMerged || actualCell.isMergedMainCell) && _univerjs_core.Rectangle.equals(actualCell.mergeInfo, range))) {
+			if (this._threadCommentPanelService.activeCommentId) this._commandService.executeCommand(_univerjs_thread_comment_ui.SetActiveCommentOperation.id);
+			return;
+		}
+		const row = actualCell.actualRow;
+		const col = actualCell.actualColumn;
+		if (!this._sheetsThreadCommentModel.showCommentMarker(unitId, subUnitId, row, col)) {
+			if (this._threadCommentPanelService.activeCommentId) this._commandService.executeCommand(_univerjs_thread_comment_ui.SetActiveCommentOperation.id);
+			return;
+		}
+		const commentId = this._sheetsThreadCommentModel.getByLocation(unitId, subUnitId, row, col);
+		if (commentId) this._commandService.executeCommand(_univerjs_thread_comment_ui.SetActiveCommentOperation.id, {
+			unitId,
+			subUnitId,
+			commentId
+		});
+	}
+	_initSelectionUpdateListener() {
+		this.disposeWithMe(this._sheetSelectionService.selectionMoveEnd$.subscribe((selections) => {
+			if (this._isSwitchToCommenting) return;
+			const current = this._sheetSelectionService.currentSelectionParam;
+			if (!current) return;
+			this._handleSelectionChange(selections, current.unitId, current.sheetId);
+		}));
+	}
+	_initEditorBridge() {
+		this.disposeWithMe(this._editorBridgeService.visible$.subscribe((visible) => {
+			if (visible.visible) this._sheetsThreadCommentPopupService.hidePopup();
+		}));
+	}
+	_initCommandListener() {
+		this._commandService.onCommandExecuted((commandInfo) => {
+			if (commandInfo.id === _univerjs_thread_comment.DeleteCommentMutation.id) {
+				const params = commandInfo.params;
+				const active = this._sheetsThreadCommentPopupService.activePopup;
+				if (!active) return;
+				const { unitId, subUnitId, commentId } = active;
+				if (params.unitId === unitId && params.subUnitId === subUnitId && params.commentId === commentId) this._sheetsThreadCommentPopupService.hidePopup();
+			}
+		});
+	}
+	_initPanelListener() {
+		this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe(async (commentInfo) => {
+			if (commentInfo) {
+				var _currentUnit$getActiv;
+				const { unitId, subUnitId, commentId, trigger } = commentInfo;
+				const comment = this._sheetsThreadCommentModel.getComment(unitId, subUnitId, commentId);
+				if (!comment || comment.resolved) return;
+				const currentUnit = this._univerInstanceService.getCurrentUnitForType(_univerjs_core.UniverInstanceType.UNIVER_SHEET);
+				if (!currentUnit) return;
+				if (currentUnit.getUnitId() !== unitId) return;
+				this._isSwitchToCommenting = true;
+				if (((_currentUnit$getActiv = currentUnit.getActiveSheet()) === null || _currentUnit$getActiv === void 0 ? void 0 : _currentUnit$getActiv.getSheetId()) !== subUnitId) await this._commandService.executeCommand(_univerjs_sheets.SetWorksheetActiveOperation.id, {
+					unitId,
+					subUnitId
+				});
+				this._isSwitchToCommenting = false;
+				const location = (0, _univerjs_engine_formula.singleReferenceToGrid)(comment.ref);
+				const { row, column: col } = location;
+				if (!this._sheetPermissionCheckController.permissionCheckWithRanges({
+					workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+					worksheetTypes: [_univerjs_sheets.WorksheetViewPermission],
+					rangeTypes: [_univerjs_sheets.RangeProtectionPermissionViewPoint]
+				}, [{
+					startRow: row,
+					startColumn: col,
+					endRow: row,
+					endColumn: col
+				}], unitId, subUnitId)) return;
+				const GAP = 1;
+				await this._commandService.executeCommand(_univerjs_sheets_ui.ScrollToRangeOperation.id, { range: {
+					startRow: Math.max(location.row - GAP, 0),
+					endRow: location.row + GAP,
+					startColumn: Math.max(location.column - GAP, 0),
+					endColumn: location.column + GAP
+				} });
+				if (this._editorBridgeService.isVisible().visible) return;
+				this._sheetsThreadCommentPopupService.showPopup({
+					unitId,
+					subUnitId,
+					row: location.row,
+					col: location.column,
+					commentId: comment.id,
+					trigger
+				});
+			} else this._sheetsThreadCommentPopupService.hidePopup();
+		}));
+	}
+	_initMarkSelection() {
+		this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.pipe((0, rxjs.debounceTime)(100)).subscribe((activeComment) => {
+			var _this$_univerInstance, _worksheet$getMergedC;
+			if (!activeComment) {
+				if (this._selectionShapeInfo) {
+					this._markSelectionService.removeShape(this._selectionShapeInfo.shapeId);
+					this._selectionShapeInfo = null;
+				}
+				return;
+			}
+			const { unitId, subUnitId, commentId } = activeComment;
+			if (this._selectionShapeInfo) {
+				this._markSelectionService.removeShape(this._selectionShapeInfo.shapeId);
+				this._selectionShapeInfo = null;
+			}
+			const comment = this._sheetsThreadCommentModel.getComment(unitId, subUnitId, commentId);
+			if (!comment) return;
+			const { row, column } = (0, _univerjs_engine_formula.singleReferenceToGrid)(comment.ref);
+			if (Number.isNaN(row) || Number.isNaN(column)) return null;
+			const worksheet = (_this$_univerInstance = this._univerInstanceService.getCurrentUnitForType(_univerjs_core.UniverInstanceType.UNIVER_SHEET)) === null || _this$_univerInstance === void 0 ? void 0 : _this$_univerInstance.getSheetBySheetId(subUnitId);
+			const mergeInfo = (_worksheet$getMergedC = worksheet === null || worksheet === void 0 ? void 0 : worksheet.getMergedCell(row, column)) !== null && _worksheet$getMergedC !== void 0 ? _worksheet$getMergedC : {
+				startColumn: column,
+				endColumn: column,
+				startRow: row,
+				endRow: row
+			};
+			const shapeId = this._markSelectionService.addShape({
+				range: mergeInfo,
+				style: {
+					fill: "rgba(255, 189, 55, 0.35)",
+					strokeWidth: 1,
+					stroke: "#FFBD37",
+					widgets: {}
+				},
+				primary: null
+			}, [], -1);
+			if (!shapeId) return;
+			this._selectionShapeInfo = {
+				...activeComment,
+				shapeId
+			};
+		}));
+	}
+};
+SheetsThreadCommentPopupController = __decorate([
+	__decorateParam(0, _univerjs_core.ICommandService),
+	__decorateParam(1, (0, _univerjs_core.Inject)(SheetsThreadCommentPopupService)),
+	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_sheets_thread_comment.SheetsThreadCommentModel)),
+	__decorateParam(3, (0, _univerjs_core.Inject)(_univerjs_thread_comment_ui.ThreadCommentPanelService)),
+	__decorateParam(4, _univerjs_core.IUniverInstanceService),
+	__decorateParam(5, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetPermissionCheckController)),
+	__decorateParam(6, _univerjs_sheets_ui.IMarkSelectionService),
+	__decorateParam(7, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetsSelectionsService)),
+	__decorateParam(8, _univerjs_sheets_ui.IEditorBridgeService),
+	__decorateParam(9, _univerjs_engine_render.IRenderManagerService)
+], SheetsThreadCommentPopupController);
+
+//#endregion
+//#region src/menu/menu.ts
+const threadCommentMenuFactory = (accessor) => {
+	return {
+		id: ShowAddSheetCommentModalOperation.id,
+		type: _univerjs_ui.MenuItemType.BUTTON,
+		icon: "CommentIcon",
+		title: "sheetThreadComment.menu.addComment",
+		hidden$: (0, _univerjs_ui.getMenuHiddenObservable)(accessor, _univerjs_core.UniverInstanceType.UNIVER_SHEET),
+		disabled$: (0, _univerjs_sheets_ui.getCurrentRangeDisable$)(accessor, {
+			workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+			worksheetTypes: [_univerjs_sheets.WorksheetViewPermission],
+			rangeTypes: [_univerjs_sheets.RangeProtectionPermissionViewPoint]
+		})
+	};
+};
+const threadPanelMenuFactory = (accessor) => {
+	return {
+		id: ToggleSheetCommentPanelOperation.id,
+		type: _univerjs_ui.MenuItemType.BUTTON,
+		icon: "CommentIcon",
+		tooltip: "sheetThreadComment.menu.commentManagement",
+		disabled$: (0, _univerjs_sheets_ui.getCurrentRangeDisable$)(accessor, {
+			workbookTypes: [_univerjs_sheets.WorkbookCommentPermission],
+			worksheetTypes: [_univerjs_sheets.WorksheetViewPermission],
+			rangeTypes: [_univerjs_sheets.RangeProtectionPermissionViewPoint]
+		}),
+		hidden$: (0, _univerjs_ui.getMenuHiddenObservable)(accessor, _univerjs_core.UniverInstanceType.UNIVER_SHEET)
+	};
+};
+const AddCommentShortcut = {
+	id: ShowAddSheetCommentModalOperation.id,
+	binding: _univerjs_ui.KeyCode.M | _univerjs_ui.MetaKeys.CTRL_COMMAND | _univerjs_ui.MetaKeys.ALT,
+	preconditions: _univerjs_sheets_ui.whenSheetEditorFocused
+};
+
+//#endregion
+//#region src/menu/schema.ts
+const menuSchema = {
+	[_univerjs_ui.RibbonInsertGroup.MEDIA]: { [ToggleSheetCommentPanelOperation.id]: {
+		order: 2,
+		menuItemFactory: threadPanelMenuFactory
+	} },
+	[_univerjs_ui.ContextMenuPosition.MAIN_AREA]: { [_univerjs_ui.ContextMenuGroup.OTHERS]: { [ShowAddSheetCommentModalOperation.id]: {
+		order: 0,
+		menuItemFactory: threadCommentMenuFactory
+	} } }
+};
+
+//#endregion
+//#region src/views/sheets-thread-comment-cell/index.tsx
+const SheetsThreadCommentCell = () => {
+	const univerInstanceService = (0, _univerjs_ui.useDependency)(_univerjs_core.IUniverInstanceService);
+	const sheetsThreadCommentPopupService = (0, _univerjs_ui.useDependency)(SheetsThreadCommentPopupService);
+	const activePopup = (0, _univerjs_ui.useObservable)(sheetsThreadCommentPopupService.activePopup$);
+	const sheetThreadCommentModel = (0, _univerjs_ui.useDependency)(_univerjs_sheets_thread_comment.SheetsThreadCommentModel);
+	(0, _univerjs_ui.useObservable)(sheetThreadCommentModel.commentUpdate$);
+	if (!activePopup) return null;
+	const { row, col, unitId, subUnitId, trigger } = activePopup;
+	const rootId = sheetThreadCommentModel.getByLocation(unitId, subUnitId, row, col);
+	const ref = `${_univerjs_core.Tools.chatAtABC(col)}${row + 1}`;
+	const onClose = () => {
+		sheetsThreadCommentPopupService.hidePopup();
+	};
+	const getSubUnitName = (id) => {
+		var _univerInstanceServic, _univerInstanceServic2;
+		return (_univerInstanceServic = (_univerInstanceServic2 = univerInstanceService.getCurrentUnitForType(_univerjs_core.UniverInstanceType.UNIVER_SHEET)) === null || _univerInstanceServic2 === void 0 || (_univerInstanceServic2 = _univerInstanceServic2.getSheetBySheetId(id)) === null || _univerInstanceServic2 === void 0 ? void 0 : _univerInstanceServic2.getName()) !== null && _univerInstanceServic !== void 0 ? _univerInstanceServic : "";
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_thread_comment_ui.ThreadCommentTree, {
+		onClick: () => {
+			sheetsThreadCommentPopupService.persistPopup();
+		},
+		location: _univerjs_thread_comment_ui.ThreadCommentTreeLocation.CELL,
+		id: rootId,
+		unitId,
+		subUnitId,
+		type: _univerjs_core.UniverInstanceType.UNIVER_SHEET,
+		refStr: ref,
+		onClose,
+		getSubUnitName,
+		autoFocus: trigger === "context-menu"
+	});
+};
+
+//#endregion
+//#region src/views/sheets-thread-comment-panel/index.tsx
+const SheetsThreadCommentPanel = () => {
+	var _workbook$getActiveSh;
+	const markSelectionService = (0, _univerjs_ui.useDependency)(_univerjs_sheets_ui.IMarkSelectionService);
+	const univerInstanceService = (0, _univerjs_ui.useDependency)(_univerjs_core.IUniverInstanceService);
+	const sheetsThreadCommentPopupService = (0, _univerjs_ui.useDependency)(SheetsThreadCommentPopupService);
+	const workbook = univerInstanceService.getCurrentUnitForType(_univerjs_core.UniverInstanceType.UNIVER_SHEET);
+	const unitId = workbook.getUnitId();
+	const commandService = (0, _univerjs_ui.useDependency)(_univerjs_core.ICommandService);
+	const subUnitId$ = (0, react.useMemo)(() => workbook.activeSheet$.pipe((0, rxjs.map)((i) => i === null || i === void 0 ? void 0 : i.getSheetId())), [workbook.activeSheet$]);
+	const subUnitId = (0, _univerjs_ui.useObservable)(subUnitId$, (_workbook$getActiveSh = workbook.getActiveSheet()) === null || _workbook$getActiveSh === void 0 ? void 0 : _workbook$getActiveSh.getSheetId());
+	const hoverShapeId = (0, react.useRef)(null);
+	const panelService = (0, _univerjs_ui.useDependency)(_univerjs_thread_comment_ui.ThreadCommentPanelService);
+	const activeCommentId = (0, _univerjs_ui.useObservable)(panelService.activeCommentId$);
+	const panelVisible = (0, _univerjs_ui.useObservable)(panelService.panelVisible$, panelService.panelVisible);
+	const sortComments = (0, react.useCallback)((comments) => {
+		const worksheets = workbook.getSheets();
+		const sheetIndex = {};
+		worksheets.forEach((sheet, i) => {
+			sheetIndex[sheet.getSheetId()] = i;
+		});
+		const sort = (comments) => {
+			return comments.map((comment) => {
+				var _sheetIndex$comment$s;
+				const ref = (0, _univerjs_engine_formula.singleReferenceToGrid)(comment.ref);
+				const p = [
+					(_sheetIndex$comment$s = sheetIndex[comment.subUnitId]) !== null && _sheetIndex$comment$s !== void 0 ? _sheetIndex$comment$s : 0,
+					ref.row,
+					ref.column
+				];
+				return {
+					...comment,
+					p
+				};
+			}).sort((pre, aft) => {
+				if (pre.p[0] === aft.p[0]) {
+					if (pre.p[1] === aft.p[1]) return pre.p[2] - aft.p[2];
+					return pre.p[1] - aft.p[1];
+				}
+				return pre.p[0] - aft.p[0];
+			});
+		};
+		return [...sort(comments.filter((comment) => !comment.resolved)), ...sort(comments.filter((comment) => comment.resolved))];
+	}, [workbook]);
+	const showShape = (0, react.useCallback)((comment) => {
+		if (comment.unitId === unitId && comment.subUnitId === subUnitId && !comment.resolved) {
+			var _worksheet$getMergedC;
+			const { row, column } = (0, _univerjs_engine_formula.singleReferenceToGrid)(comment.ref);
+			const worksheet = workbook.getSheetBySheetId(comment.subUnitId);
+			const mergeInfo = (_worksheet$getMergedC = worksheet === null || worksheet === void 0 ? void 0 : worksheet.getMergedCell(row, column)) !== null && _worksheet$getMergedC !== void 0 ? _worksheet$getMergedC : {
+				startColumn: column,
+				endColumn: column,
+				startRow: row,
+				endRow: row
+			};
+			if (!Number.isNaN(row) && !Number.isNaN(column)) return markSelectionService.addShape({
+				range: mergeInfo,
+				style: {
+					fill: "rgb(255, 189, 55, 0.35)",
+					strokeWidth: 1,
+					stroke: "#FFBD37",
+					widgets: {}
+				},
+				primary: null
+			});
+		}
+		return null;
+	}, [
+		markSelectionService,
+		subUnitId,
+		unitId
+	]);
+	const getSubUnitName = (id) => {
+		var _workbook$getSheetByS, _workbook$getSheetByS2;
+		return (_workbook$getSheetByS = (_workbook$getSheetByS2 = workbook.getSheetBySheetId(id)) === null || _workbook$getSheetByS2 === void 0 ? void 0 : _workbook$getSheetByS2.getName()) !== null && _workbook$getSheetByS !== void 0 ? _workbook$getSheetByS : "";
+	};
+	const handleAdd = () => {
+		commandService.executeCommand(ShowAddSheetCommentModalOperation.id);
+	};
+	const handleHover = (comment) => {
+		if (activeCommentId && activeCommentId.unitId === comment.unitId && activeCommentId.subUnitId === comment.subUnitId && activeCommentId.commentId === comment.id) return;
+		if (hoverShapeId.current) {
+			markSelectionService.removeShape(hoverShapeId.current);
+			hoverShapeId.current = null;
+		}
+		hoverShapeId.current = showShape(comment);
+	};
+	const handleLeave = () => {
+		if (hoverShapeId.current) {
+			markSelectionService.removeShape(hoverShapeId.current);
+			hoverShapeId.current = null;
+		}
+	};
+	const handleResolve = (id, resolved) => {
+		if (resolved) sheetsThreadCommentPopupService.hidePopup();
+	};
+	(0, react.useEffect)(() => {
+		if (!panelVisible && hoverShapeId.current) markSelectionService.removeShape(hoverShapeId.current);
+	}, [markSelectionService, panelVisible]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_thread_comment_ui.ThreadCommentPanel, {
+		unitId,
+		subUnitId$,
+		type: _univerjs_core.UniverInstanceType.UNIVER_SHEET,
+		onAdd: handleAdd,
+		getSubUnitName,
+		onResolve: handleResolve,
+		sortComments,
+		onItemEnter: handleHover,
+		onItemLeave: handleLeave,
+		onDeleteComment: () => {
+			handleLeave();
+			return true;
+		}
+	});
+};
+
+//#endregion
+//#region src/controllers/sheets-thread-comment.controller.ts
+/**
+* Copyright 2023-present DreamNum Co., Ltd.
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+let SheetsThreadCommentController = class SheetsThreadCommentController extends _univerjs_core.Disposable {
+	constructor(_menuManagerService, _componentManager, _shortcutService) {
+		super();
+		this._menuManagerService = _menuManagerService;
+		this._componentManager = _componentManager;
+		this._shortcutService = _shortcutService;
+		this._initMenu();
+		this._initShortcut();
+		this._initComponent();
+	}
+	_initShortcut() {
+		this._shortcutService.registerShortcut(AddCommentShortcut);
+	}
+	_initMenu() {
+		this._menuManagerService.mergeMenu(menuSchema);
+	}
+	_initComponent() {
+		[
+			[SHEETS_THREAD_COMMENT_MODAL, SheetsThreadCommentCell],
+			[SHEETS_THREAD_COMMENT_PANEL, SheetsThreadCommentPanel],
+			["CommentIcon", _univerjs_icons.CommentIcon]
+		].forEach(([key, comp]) => {
+			this.disposeWithMe(this._componentManager.register(key, comp));
+		});
+	}
+};
+SheetsThreadCommentController = __decorate([
+	__decorateParam(0, _univerjs_ui.IMenuManagerService),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_ui.ComponentManager)),
+	__decorateParam(2, _univerjs_ui.IShortcutService)
+], SheetsThreadCommentController);
+
+//#endregion
+//#region src/plugin.ts
+let UniverSheetsThreadCommentUIPlugin = class UniverSheetsThreadCommentUIPlugin extends _univerjs_core.Plugin {
+	constructor(_config = defaultPluginConfig, _injector, _commandService, _configService) {
+		super();
+		this._config = _config;
+		this._injector = _injector;
+		this._commandService = _commandService;
+		this._configService = _configService;
+		const { menu, ...rest } = (0, _univerjs_core.merge)({}, defaultPluginConfig, this._config);
+		if (menu) this._configService.setConfig("menu", menu, { merge: true });
+		this._configService.setConfig(SHEETS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY, rest);
+	}
+	onStarting() {
+		[
+			[SheetsThreadCommentController],
+			[SheetsThreadCommentRenderController],
+			[SheetsThreadCommentCopyPasteController],
+			[SheetsThreadCommentHoverController],
+			[SheetsThreadCommentPopupController],
+			[SheetsThreadCommentPopupService],
+			[SheetsThreadCommentPermissionController]
+		].forEach((dep) => {
+			this._injector.add(dep);
+		});
+		[ShowAddSheetCommentModalOperation, ToggleSheetCommentPanelOperation].forEach((command) => {
+			this._commandService.registerCommand(command);
+		});
+		this._injector.get(SheetsThreadCommentController);
+	}
+	onReady() {
+		this._injector.get(SheetsThreadCommentRenderController);
+	}
+	onRendered() {
+		this._injector.get(SheetsThreadCommentCopyPasteController);
+		this._injector.get(SheetsThreadCommentHoverController);
+		this._injector.get(SheetsThreadCommentPopupController);
+		this._injector.get(SheetsThreadCommentPermissionController);
+	}
+};
+_defineProperty(UniverSheetsThreadCommentUIPlugin, "pluginName", PLUGIN_NAME);
+_defineProperty(UniverSheetsThreadCommentUIPlugin, "packageName", name);
+_defineProperty(UniverSheetsThreadCommentUIPlugin, "version", version);
+_defineProperty(UniverSheetsThreadCommentUIPlugin, "type", _univerjs_core.UniverInstanceType.UNIVER_SHEET);
+UniverSheetsThreadCommentUIPlugin = __decorate([
+	(0, _univerjs_core.DependentOn)(_univerjs_thread_comment_ui.UniverThreadCommentUIPlugin, _univerjs_sheets_thread_comment.UniverSheetsThreadCommentPlugin),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_core.Injector)),
+	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_core.ICommandService)),
+	__decorateParam(3, _univerjs_core.IConfigService)
+], UniverSheetsThreadCommentUIPlugin);
+
+//#endregion
+Object.defineProperty(exports, 'AddCommentCommand', {
+  enumerable: true,
+  get: function () {
+    return _univerjs_thread_comment.AddCommentCommand;
+  }
+});
+Object.defineProperty(exports, 'DeleteCommentCommand', {
+  enumerable: true,
+  get: function () {
+    return _univerjs_thread_comment.DeleteCommentCommand;
+  }
+});
+Object.defineProperty(exports, 'DeleteCommentTreeCommand', {
+  enumerable: true,
+  get: function () {
+    return _univerjs_thread_comment.DeleteCommentTreeCommand;
+  }
+});
+Object.defineProperty(exports, 'IThreadCommentDataSourceService', {
+  enumerable: true,
+  get: function () {
+    return _univerjs_thread_comment.IThreadCommentDataSourceService;
+  }
+});
+Object.defineProperty(exports, 'ResolveCommentCommand', {
+  enumerable: true,
+  get: function () {
+    return _univerjs_thread_comment.ResolveCommentCommand;
+  }
+});
+Object.defineProperty(exports, 'SheetsThreadCommentPopupService', {
+  enumerable: true,
+  get: function () {
+    return SheetsThreadCommentPopupService;
+  }
+});
+exports.ShowAddSheetCommentModalOperation = ShowAddSheetCommentModalOperation;
+exports.ToggleSheetCommentPanelOperation = ToggleSheetCommentPanelOperation;
+Object.defineProperty(exports, 'UniverSheetsThreadCommentUIPlugin', {
+  enumerable: true,
+  get: function () {
+    return UniverSheetsThreadCommentUIPlugin;
+  }
+});
+Object.defineProperty(exports, 'UniverThreadCommentUIPlugin', {
+  enumerable: true,
+  get: function () {
+    return _univerjs_thread_comment_ui.UniverThreadCommentUIPlugin;
+  }
+});
+Object.defineProperty(exports, 'UpdateCommentCommand', {
+  enumerable: true,
+  get: function () {
+    return _univerjs_thread_comment.UpdateCommentCommand;
+  }
+});