@univerjs/sheets-note-ui 0.20.1 → 0.21.0-insiders.20260424-262d69f

package/lib/cjs/index.js

@@ -1 +1,789 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@univerjs/core`),t=require(`@univerjs/engine-render`),n=require(`@univerjs/sheets`),r=require(`@univerjs/sheets-note`),i=require(`rxjs`),a=require(`@univerjs/sheets-ui`),o=require(`rxjs/operators`),s=require(`@univerjs/ui`),c=require(`@univerjs/icons`),l=require(`@univerjs/design`),u=require(`react`),d=require(`react/jsx-runtime`);function f(e,t){return function(n,r){t(n,r,e)}}function p(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 m=class extends e.Disposable{constructor(e,t,n,r){super(),this._sheetInterceptorService=e,this._sheetsNoteModel=t,this._renderManagerService=n,this._univerInstanceService=r,this._initViewModelIntercept(),this._initSkeletonChange()}_initViewModelIntercept(){this.disposeWithMe(this._sheetInterceptorService.intercept(n.INTERCEPTOR_POINT.CELL_CONTENT,{effect:e.InterceptorEffectEnum.Style,handler:(e,t,n)=>{let{row:r,col:i,unitId:a,subUnitId:o}=t;return this._sheetsNoteModel.getNote(a,o,{row:r,col: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._sheetsNoteModel.change$.pipe((0,i.debounceTime)(16)).subscribe(()=>{t()}))}};m=p([f(0,(0,e.Inject)(n.SheetInterceptorService)),f(1,(0,e.Inject)(r.SheetsNoteModel)),f(2,t.IRenderManagerService),f(3,e.IUniverInstanceService)],m);const h=`SHEET_NOTE_COMPONENT`;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}let b=class extends e.Disposable{get activePopup(){return this._activePopup}constructor(e,t){super(),this._zenZoneService=e,this._cellPopupManagerService=t,y(this,`_lastPopup`,null),y(this,`_activePopup`,void 0),y(this,`_activePopup$`,new i.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({unitId:o,subUnitId:s,row:i,col:a},{componentKey:h,onClickOutside:()=>{this.hidePopup()},direction:`horizontal`,extraProps:{location:t},priority:3});if(!c)throw Error(`[SheetsNotePopupService]: cannot show popup!`);let l=new e.DisposableCollection;l.add(c),l.add({dispose:()=>{n==null||n()}}),this._lastPopup=l}hidePopup(e){this._activePopup&&(!e&&!this._activePopup.temp||(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))}};b=p([f(0,s.IZenZoneService),f(1,(0,e.Inject)(a.CellPopupManagerService))],b);let x=class extends e.Disposable{constructor(e,t,n,r,i,a){super(),this._sheetsNotePopupService=e,this._sheetsNoteModel=t,this._sheetSelectionService=n,this._editorBridgeService=r,this._renderManagerService=i,this._hoverManagerService=a,y(this,`_isSwitchingSheet`,!1),this._initSelectionUpdateListener(),this._initEditorBridge(),this._initHoverEvent(),this._initDeleteNoteListener()}_handleSelectionChange(t,n,r){var i,o,s;let c=(i=t[0])==null?void 0:i.range,l=this._renderManagerService.getRenderById(n),u=l==null||(o=l.with(a.SheetSkeletonManagerService).getSkeletonParam(r))==null?void 0:o.skeleton;if(!u||!c)return;let d=u.getCellWithCoordByIndex(c.startRow,c.startColumn);if((((s=c.rangeType)==null?e.RANGE_TYPE.NORMAL:s)!==e.RANGE_TYPE.NORMAL||c.endColumn-c.startColumn>0||c.endRow-c.startRow>0)&&!((d.isMerged||d.isMergedMainCell)&&e.Rectangle.equals(d.mergeInfo,c))){this._sheetsNotePopupService.hidePopup();return}let f=d.actualRow,p=d.actualColumn,m=this._sheetsNoteModel.getNote(n,r,{row:f,col:p});m!=null&&m.show||(m?this._sheetsNotePopupService.showPopup({unitId:n,subUnitId:r,noteId:m.id,row:f,col:p}):this._sheetsNotePopupService.hidePopup(!0))}_initSelectionUpdateListener(){this.disposeWithMe(this._sheetSelectionService.selectionMoveEnd$.subscribe(e=>{if(this._isSwitchingSheet)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._sheetsNotePopupService.hidePopup(!0)}))}_initHoverEvent(){this.disposeWithMe(this._hoverManagerService.currentCell$.pipe((0,o.debounceTime)(100)).subscribe(e=>{var t;if(!(e!=null&&e.location))return;let{unitId:n,subUnitId:r,row:i,col:o}=e.location,s=this._renderManagerService.getRenderById(n),c=s==null||(t=s.with(a.SheetSkeletonManagerService).getSkeletonParam(r))==null?void 0:t.skeleton,l=i,u=o,d=this._sheetsNoteModel.getNote(n,r,{row:l,col:u});if(!d&&c){let{startRow:e,endRow:t,startColumn:a,endColumn:s}=c.getCellWithCoordByIndex(i,o).mergeInfo;if(e!==t||a!==s){let i=this._sheetsNoteModel.getSheetNotes(n,r);if(i){for(let[n,r]of i)if(r.row>=e&&r.row<=t&&r.col>=a&&r.col<=s){d=r,l=r.row,u=r.col;break}}}}d!=null&&d.show||(d?this._sheetsNotePopupService.showPopup({unitId:n,subUnitId:r,noteId:d.id,row:l,col:u,temp:!0}):this._sheetsNotePopupService.hidePopup())}))}_initDeleteNoteListener(){this.disposeWithMe(this._sheetsNoteModel.change$.subscribe(e=>{if(!this._sheetsNotePopupService.activePopup)return;let{unitId:t,subUnitId:n,noteId:r,row:i,col:a}=this._sheetsNotePopupService.activePopup,{oldNote:o,newNote:s}=e;s===null&&e.unitId===t&&e.subUnitId===n&&(o!=null&&o.id&&o.id===r||(o==null?void 0:o.row)===i&&o.col===a)&&this._sheetsNotePopupService.hidePopup(!0)}))}};x=p([f(0,(0,e.Inject)(b)),f(1,(0,e.Inject)(r.SheetsNoteModel)),f(2,(0,e.Inject)(n.SheetsSelectionsService)),f(3,a.IEditorBridgeService),f(4,t.IRenderManagerService),f(5,(0,e.Inject)(a.HoverManagerService))],x);var S=`@univerjs/sheets-note-ui`,C=`0.20.1`;const w=`sheets-note-ui.config`;Symbol(w);const T={};let E=class extends e.Disposable{constructor(t,n,r,i){super(),this._sheetsNoteModel=t,this._univerInstanceService=n,this._cellPopupManagerService=r,this._sheetsNotePopupService=i,y(this,`_noteMatrix`,new e.ObjectMatrix),this._initNoteChangeListener()}_showPopup(e,t,n,r){return this._sheetsNotePopupService.hidePopup(!0),this._cellPopupManagerService.showPopup({unitId:e,subUnitId:t,row:n,col:r},{componentKey:h,direction:`horizontal`,extraProps:{location:{unitId:e,subUnitId:t,row:n,col:r}},priority:3})}dispose(){super.dispose(),this._noteMatrix.forValue((e,t,n)=>{n.dispose()})}_initSheet(t,n){var r;this._noteMatrix.forValue((e,t,n)=>{n.dispose()}),this._noteMatrix=new e.ObjectMatrix;let i=(e,t,n,r,i)=>{let a=this._noteMatrix,o=a.getValue(n,r);if(i!=null&&i.show){if(!o){let i=this._showPopup(e,t,n,r);i&&a.setValue(n,r,i)}}else o&&(o.dispose(),a.realDeleteValue(n,r))};return(r=this._sheetsNoteModel.getSheetNotes(t,n))==null||r.forEach(e=>{i(t,n,e.row,e.col,e)}),this._sheetsNoteModel.change$.subscribe(e=>{if(!(e.unitId!==t||e.subUnitId!==n))switch(e.type){case`ref`:{let{unitId:t,subUnitId:n,oldNote:r,newNote:i}=e;if(!i.show)return;let a=this._noteMatrix,{row:o,col:s}=r,{row:c,col:l}=i,u=a.getValue(o,s);u&&(u.dispose(),a.realDeleteValue(o,s));let d=this._showPopup(t,n,c,l);d&&a.setValue(c,l,d);break}case`update`:{let{unitId:t,subUnitId:n,oldNote:r,newNote:a}=e;i(t,n,a?a.row:r.row,a?a.col:r.col,a);break}default:break}})}_initNoteChangeListener(){this.disposeWithMe(this._univerInstanceService.getCurrentTypeOfUnit$(e.UniverInstanceType.UNIVER_SHEET).pipe((0,i.switchMap)(e=>{var t;return(t=e==null?void 0:e.activeSheet$)==null?(0,i.of)(null):t})).subscribe(t=>{if(t){let e=this._initSheet(t.getUnitId(),t.getSheetId());return()=>{e.unsubscribe()}}else this._noteMatrix.forValue((e,t,n)=>{n.dispose()}),this._noteMatrix=new e.ObjectMatrix}))}};E=p([f(0,(0,e.Inject)(r.SheetsNoteModel)),f(1,(0,e.Inject)(e.IUniverInstanceService)),f(2,(0,e.Inject)(a.CellPopupManagerService)),f(3,(0,e.Inject)(b))],E);const D={id:`sheet.operation.add-note-popup`,type:e.CommandType.OPERATION,handler:async(t,r)=>{var i;let a=t.get(n.SheetsSelectionsService),o=t.get(b),s=t.get(e.IUniverInstanceService).getCurrentUnitForType(e.UniverInstanceType.UNIVER_SHEET);if(!s)return!1;let c=s.getActiveSheet(),l=a.getCurrentLastSelection();if(!(l!=null&&l.primary))return!1;let{primary:u}=l;return o.showPopup({unitId:s.getUnitId(),subUnitId:c.getSheetId(),row:u.actualRow,col:u.actualColumn,temp:!1,trigger:(i=r==null?void 0:r.trigger)==null?`add-note`:i}),!0}};function O(t){let a=t.get(n.SheetsSelectionsService),o=t.get(e.IUniverInstanceService);return a.selectionMoveEnd$.pipe((0,i.map)(()=>{let e=a.getCurrentLastSelection();if(!(e!=null&&e.primary))return!1;let i=(0,n.getSheetCommandTarget)(o);if(!i)return!1;let{actualColumn:s,actualRow:c}=e.primary;return!!t.get(r.SheetsNoteModel).getNote(i.unitId,i.subUnitId,{row:c,col:s})}))}function k(t){return{id:D.id,type:s.MenuItemType.BUTTON,title:`rightClick.addNote`,icon:`AddNoteIcon`,hidden$:(0,i.combineLatest)([(0,s.getMenuHiddenObservable)(t,e.UniverInstanceType.UNIVER_SHEET),O(t)]).pipe((0,i.map)(([e,t])=>e||t)),disabled$:(0,a.getCurrentRangeDisable$)(t,{workbookTypes:[n.WorkbookEditablePermission],worksheetTypes:[n.WorksheetEditPermission]}),commandId:D.id}}function A(e){return{id:r.SheetDeleteNoteCommand.id,type:s.MenuItemType.BUTTON,title:`rightClick.deleteNote`,icon:`DeleteNoteIcon`,hidden$:O(e).pipe((0,i.map)(e=>!e)),disabled$:(0,a.getCurrentRangeDisable$)(e,{workbookTypes:[n.WorkbookEditablePermission],worksheetTypes:[n.WorksheetEditPermission]})}}function j(e){return{id:r.SheetToggleNotePopupCommand.id,type:s.MenuItemType.BUTTON,title:`rightClick.toggleNote`,icon:`HideNoteIcon`,hidden$:O(e).pipe((0,i.map)(e=>!e))}}const M={[s.ContextMenuPosition.MAIN_AREA]:{[s.ContextMenuGroup.OTHERS]:{order:0,[D.id]:{order:0,menuItemFactory:k},[r.SheetDeleteNoteCommand.id]:{order:0,menuItemFactory:A},[r.SheetToggleNotePopupCommand.id]:{order:0,menuItemFactory:j}}}},N=n=>{var i;let{popup:a}=n,o=(0,s.useDependency)(r.SheetsNoteModel),c=(0,s.useDependency)(e.LocaleService),f=(0,s.useDependency)(t.IRenderManagerService),p=(0,s.useDependency)(b),m=(0,s.useConfigValue)(w),h=(i=a.extraProps)==null?void 0:i.location;if(!h)return console.error(`Popup extraProps or location is undefined.`),null;let g=(0,u.useRef)(null),_=f.getRenderById(h.unitId),[v,y]=(0,u.useState)(null);(0,u.useEffect)(()=>{var t,n,r,i,a,s;let{unitId:c,subUnitId:l,row:u,col:d}=h,f=o.getNote(c,l,{row:u,col:d}),p=(t=(n=f==null?void 0:f.width)==null?m==null||(r=m.defaultNoteSize)==null?void 0:r.width:n)==null?160:t,_=(i=(a=f==null?void 0:f.height)==null?m==null||(s=m.defaultNoteSize)==null?void 0:s.height:a)==null?72:i;if(f)y(f);else{let t={id:(0,e.generateRandomId)(6),width:p,height:_,note:``};y(t),S(t)}g.current&&(g.current.style.width=`${p}px`,g.current.style.height=`${_}px`)},[h,g]),(0,u.useEffect)(()=>{if(!h||h.temp||!h.trigger||!g.current)return;let e=requestAnimationFrame(()=>{var e;(e=g.current)==null||e.focus()});return()=>cancelAnimationFrame(e)},[h]);let x=(0,s.useDependency)(e.ICommandService),S=(0,s.useDebounceFn)(e=>{if(!h)return;let{unitId:t,subUnitId:n,row:i,col:a}=h;if(!x.syncExecuteCommand(r.SheetUpdateNoteCommand.id,{unitId:t,sheetId:n,row:i,col:a,note:e})){let r=o.getNote(t,n,{noteId:e.id,row:i,col:a});r?y(r):p.hidePopup(!0)}}),C=(0,u.useCallback)(e=>{if(!v||e===v.note)return;let t={...v,note:e};y(t),S(t)},[v]),T=(0,u.useCallback)((e,t)=>{if(!v||e===v.width&&t===v.height)return;let n={...v,width:e,height:t};y(n),S(n)},[v]);return(0,d.jsx)(l.Textarea,{ref:g,"data-u-comp":`note-textarea`,className:(0,l.clsx)(`univer-ml-px univer-min-h-1 univer-min-w-1 univer-bg-white !univer-text-sm univer-shadow dark:!univer-bg-gray-800`),value:v==null?void 0:v.note,placeholder:c.t(`note.placeholder`),onResize:T,onValueChange:C,onWheel:e=>{document.activeElement!==g.current&&_.engine.getCanvasElement().dispatchEvent(new WheelEvent(e.type,e.nativeEvent))}})};let P=class extends e.Disposable{constructor(e,t,n){super(),this._componentManager=e,this._menuManagerService=t,this._commandService=n,this._initComponents(),this._initMenu(),this._initCommands()}_initComponents(){[[h,N],[`AddNoteIcon`,c.AddNoteIcon],[`DeleteNoteIcon`,c.DeleteNoteIcon],[`HideNoteIcon`,c.HideNoteIcon]].forEach(([e,t])=>{this.disposeWithMe(this._componentManager.register(e,t))})}_initMenu(){this._menuManagerService.mergeMenu(M)}_initCommands(){this._commandService.registerCommand(D)}};P=p([f(0,(0,e.Inject)(s.ComponentManager)),f(1,(0,e.Inject)(s.IMenuManagerService)),f(2,e.ICommandService)],P);let F=class extends e.Plugin{constructor(t=T,n,r){super(),this._config=t,this._injector=n,this._configService=r;let{menu:i,...a}=(0,e.merge)({},T,this._config);i&&this._configService.setConfig(`menu`,i,{merge:!0}),this._configService.setConfig(w,a)}onStarting(){[[b],[m],[x],[P],[E]].forEach(e=>{this._injector.add(e)})}onReady(){(0,e.touchDependencies)(this._injector,[[P],[m]])}onRendered(){(0,e.touchDependencies)(this._injector,[[x],[E]])}};y(F,`pluginName`,`SHEET_NOTE_UI_PLUGIN`),y(F,`packageName`,S),y(F,`version`,C),y(F,`type`,e.UniverInstanceType.UNIVER_SHEET),F=p([(0,e.DependentOn)(r.UniverSheetsNotePlugin),f(1,(0,e.Inject)(e.Injector)),f(2,e.IConfigService)],F),Object.defineProperty(exports,`SheetsCellContentController`,{enumerable:!0,get:function(){return m}}),exports.SheetsNote=N,Object.defineProperty(exports,`SheetsNotePopupController`,{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,`SheetsNotePopupService`,{enumerable:!0,get:function(){return b}}),Object.defineProperty(exports,`UniverSheetsNoteUIPlugin`,{enumerable:!0,get:function(){return F}});
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+let _univerjs_core = require("@univerjs/core");
+let _univerjs_engine_render = require("@univerjs/engine-render");
+let _univerjs_sheets = require("@univerjs/sheets");
+let _univerjs_sheets_note = require("@univerjs/sheets-note");
+let rxjs = require("rxjs");
+let _univerjs_sheets_ui = require("@univerjs/sheets-ui");
+let rxjs_operators = require("rxjs/operators");
+let _univerjs_ui = require("@univerjs/ui");
+let _univerjs_icons = require("@univerjs/icons");
+let _univerjs_design = require("@univerjs/design");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#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/controllers/sheets-cell-content.controller.ts
+let SheetsCellContentController = class SheetsCellContentController extends _univerjs_core.Disposable {
+	constructor(_sheetInterceptorService, _sheetsNoteModel, _renderManagerService, _univerInstanceService) {
+		super();
+		this._sheetInterceptorService = _sheetInterceptorService;
+		this._sheetsNoteModel = _sheetsNoteModel;
+		this._renderManagerService = _renderManagerService;
+		this._univerInstanceService = _univerInstanceService;
+		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._sheetsNoteModel.getNote(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._sheetsNoteModel.change$.pipe((0, rxjs.debounceTime)(16)).subscribe(() => {
+			markSkeletonDirty();
+		}));
+	}
+};
+SheetsCellContentController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetInterceptorService)),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_sheets_note.SheetsNoteModel)),
+	__decorateParam(2, _univerjs_engine_render.IRenderManagerService),
+	__decorateParam(3, _univerjs_core.IUniverInstanceService)
+], SheetsCellContentController);
+
+//#endregion
+//#region src/views/config.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 SHEET_NOTE_COMPONENT = "SHEET_NOTE_COMPONENT";
+
+//#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 src/services/sheets-note-popup.service.ts
+let SheetsNotePopupService = class SheetsNotePopupService extends _univerjs_core.Disposable {
+	get activePopup() {
+		return this._activePopup;
+	}
+	constructor(_zenZoneService, _cellPopupManagerService) {
+		super();
+		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({
+			unitId,
+			subUnitId,
+			row,
+			col
+		}, {
+			componentKey: SHEET_NOTE_COMPONENT,
+			onClickOutside: () => {
+				this.hidePopup();
+			},
+			direction: "horizontal",
+			extraProps: { location },
+			priority: 3
+		});
+		if (!popupDisposable) throw new Error("[SheetsNotePopupService]: 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(force) {
+		if (!this._activePopup) return;
+		if (!force && !this._activePopup.temp) 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);
+	}
+};
+SheetsNotePopupService = __decorate([__decorateParam(0, _univerjs_ui.IZenZoneService), __decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_sheets_ui.CellPopupManagerService))], SheetsNotePopupService);
+
+//#endregion
+//#region src/controllers/sheets-note-popup.controller.ts
+let SheetsNotePopupController = class SheetsNotePopupController extends _univerjs_core.Disposable {
+	constructor(_sheetsNotePopupService, _sheetsNoteModel, _sheetSelectionService, _editorBridgeService, _renderManagerService, _hoverManagerService) {
+		super();
+		this._sheetsNotePopupService = _sheetsNotePopupService;
+		this._sheetsNoteModel = _sheetsNoteModel;
+		this._sheetSelectionService = _sheetSelectionService;
+		this._editorBridgeService = _editorBridgeService;
+		this._renderManagerService = _renderManagerService;
+		this._hoverManagerService = _hoverManagerService;
+		_defineProperty(this, "_isSwitchingSheet", false);
+		this._initSelectionUpdateListener();
+		this._initEditorBridge();
+		this._initHoverEvent();
+		this._initDeleteNoteListener();
+	}
+	_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))) {
+			this._sheetsNotePopupService.hidePopup();
+			return;
+		}
+		const row = actualCell.actualRow;
+		const col = actualCell.actualColumn;
+		const note = this._sheetsNoteModel.getNote(unitId, subUnitId, {
+			row,
+			col
+		});
+		if (note === null || note === void 0 ? void 0 : note.show) return;
+		if (note) this._sheetsNotePopupService.showPopup({
+			unitId,
+			subUnitId,
+			noteId: note.id,
+			row,
+			col
+		});
+		else this._sheetsNotePopupService.hidePopup(true);
+	}
+	_initSelectionUpdateListener() {
+		this.disposeWithMe(this._sheetSelectionService.selectionMoveEnd$.subscribe((selections) => {
+			if (this._isSwitchingSheet) 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._sheetsNotePopupService.hidePopup(true);
+		}));
+	}
+	_initHoverEvent() {
+		this.disposeWithMe(this._hoverManagerService.currentCell$.pipe((0, rxjs_operators.debounceTime)(100)).subscribe((cell) => {
+			var _render$with$getSkele2;
+			if (!(cell === null || cell === void 0 ? void 0 : cell.location)) return;
+			const { unitId, subUnitId, row, col } = cell.location;
+			const render = this._renderManagerService.getRenderById(unitId);
+			const skeleton = render === null || render === void 0 || (_render$with$getSkele2 = render.with(_univerjs_sheets_ui.SheetSkeletonManagerService).getSkeletonParam(subUnitId)) === null || _render$with$getSkele2 === void 0 ? void 0 : _render$with$getSkele2.skeleton;
+			let targetRow = row;
+			let targetCol = col;
+			let note = this._sheetsNoteModel.getNote(unitId, subUnitId, {
+				row: targetRow,
+				col: targetCol
+			});
+			if (!note && skeleton) {
+				const { startRow, endRow, startColumn, endColumn } = skeleton.getCellWithCoordByIndex(row, col).mergeInfo;
+				if (startRow !== endRow || startColumn !== endColumn) {
+					const sheetNotes = this._sheetsNoteModel.getSheetNotes(unitId, subUnitId);
+					if (sheetNotes) {
+						for (const [_id, _note] of sheetNotes) if (_note.row >= startRow && _note.row <= endRow && _note.col >= startColumn && _note.col <= endColumn) {
+							note = _note;
+							targetRow = _note.row;
+							targetCol = _note.col;
+							break;
+						}
+					}
+				}
+			}
+			if (note === null || note === void 0 ? void 0 : note.show) return;
+			if (note) this._sheetsNotePopupService.showPopup({
+				unitId,
+				subUnitId,
+				noteId: note.id,
+				row: targetRow,
+				col: targetCol,
+				temp: true
+			});
+			else this._sheetsNotePopupService.hidePopup();
+		}));
+	}
+	_initDeleteNoteListener() {
+		this.disposeWithMe(this._sheetsNoteModel.change$.subscribe((change) => {
+			if (!this._sheetsNotePopupService.activePopup) return;
+			const { unitId, subUnitId, noteId, row, col } = this._sheetsNotePopupService.activePopup;
+			const { oldNote, newNote } = change;
+			if (newNote === null && change.unitId === unitId && change.subUnitId === subUnitId && ((oldNote === null || oldNote === void 0 ? void 0 : oldNote.id) && oldNote.id === noteId || (oldNote === null || oldNote === void 0 ? void 0 : oldNote.row) === row && oldNote.col === col)) this._sheetsNotePopupService.hidePopup(true);
+		}));
+	}
+};
+SheetsNotePopupController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(SheetsNotePopupService)),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_sheets_note.SheetsNoteModel)),
+	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetsSelectionsService)),
+	__decorateParam(3, _univerjs_sheets_ui.IEditorBridgeService),
+	__decorateParam(4, _univerjs_engine_render.IRenderManagerService),
+	__decorateParam(5, (0, _univerjs_core.Inject)(_univerjs_sheets_ui.HoverManagerService))
+], SheetsNotePopupController);
+
+//#endregion
+//#region package.json
+var name = "@univerjs/sheets-note-ui";
+var version = "0.21.0-insiders.20260424-262d69f";
+
+//#endregion
+//#region src/config/config.ts
+const SHEETS_NOTE_UI_PLUGIN_CONFIG_KEY = "sheets-note-ui.config";
+const configSymbol = Symbol(SHEETS_NOTE_UI_PLUGIN_CONFIG_KEY);
+const defaultPluginConfig = {};
+
+//#endregion
+//#region src/controllers/sheets-note-attachment.controller.ts
+let SheetsNoteAttachmentController = class SheetsNoteAttachmentController extends _univerjs_core.Disposable {
+	constructor(_sheetsNoteModel, _univerInstanceService, _cellPopupManagerService, _sheetsNotePopupService) {
+		super();
+		this._sheetsNoteModel = _sheetsNoteModel;
+		this._univerInstanceService = _univerInstanceService;
+		this._cellPopupManagerService = _cellPopupManagerService;
+		this._sheetsNotePopupService = _sheetsNotePopupService;
+		_defineProperty(this, "_noteMatrix", new _univerjs_core.ObjectMatrix());
+		this._initNoteChangeListener();
+	}
+	_showPopup(unitId, sheetId, row, col) {
+		this._sheetsNotePopupService.hidePopup(true);
+		return this._cellPopupManagerService.showPopup({
+			unitId,
+			subUnitId: sheetId,
+			row,
+			col
+		}, {
+			componentKey: SHEET_NOTE_COMPONENT,
+			direction: "horizontal",
+			extraProps: { location: {
+				unitId,
+				subUnitId: sheetId,
+				row,
+				col
+			} },
+			priority: 3
+		});
+	}
+	dispose() {
+		super.dispose();
+		this._noteMatrix.forValue((_, __, disposable) => {
+			disposable.dispose();
+		});
+	}
+	_initSheet(targetUnitId, targetSheetId) {
+		var _this$_sheetsNoteMode;
+		this._noteMatrix.forValue((_, __, disposable) => {
+			disposable.dispose();
+		});
+		this._noteMatrix = new _univerjs_core.ObjectMatrix();
+		const handleNote = (unitId, sheetId, row, col, note) => {
+			const matrix = this._noteMatrix;
+			const disposable = matrix.getValue(row, col);
+			if (note === null || note === void 0 ? void 0 : note.show) {
+				if (!disposable) {
+					const newDisposable = this._showPopup(unitId, sheetId, row, col);
+					if (newDisposable) matrix.setValue(row, col, newDisposable);
+				}
+			} else if (disposable) {
+				disposable.dispose();
+				matrix.realDeleteValue(row, col);
+			}
+		};
+		(_this$_sheetsNoteMode = this._sheetsNoteModel.getSheetNotes(targetUnitId, targetSheetId)) === null || _this$_sheetsNoteMode === void 0 || _this$_sheetsNoteMode.forEach((note) => {
+			handleNote(targetUnitId, targetSheetId, note.row, note.col, note);
+		});
+		return this._sheetsNoteModel.change$.subscribe((change) => {
+			if (change.unitId !== targetUnitId || change.subUnitId !== targetSheetId) return;
+			switch (change.type) {
+				case "ref": {
+					const { unitId, subUnitId, oldNote, newNote } = change;
+					if (!newNote.show) return;
+					const matrix = this._noteMatrix;
+					const { row: oldRow, col: oldCol } = oldNote;
+					const { row: newRow, col: newCol } = newNote;
+					const disposable = matrix.getValue(oldRow, oldCol);
+					if (disposable) {
+						disposable.dispose();
+						matrix.realDeleteValue(oldRow, oldCol);
+					}
+					const newDisposable = this._showPopup(unitId, subUnitId, newRow, newCol);
+					if (newDisposable) matrix.setValue(newRow, newCol, newDisposable);
+					break;
+				}
+				case "update": {
+					const { unitId, subUnitId, oldNote, newNote } = change;
+					handleNote(unitId, subUnitId, newNote ? newNote.row : oldNote.row, newNote ? newNote.col : oldNote.col, newNote);
+					break;
+				}
+				default: break;
+			}
+		});
+	}
+	_initNoteChangeListener() {
+		this.disposeWithMe(this._univerInstanceService.getCurrentTypeOfUnit$(_univerjs_core.UniverInstanceType.UNIVER_SHEET).pipe((0, rxjs.switchMap)((workbook) => {
+			var _workbook$activeSheet;
+			return (_workbook$activeSheet = workbook === null || workbook === void 0 ? void 0 : workbook.activeSheet$) !== null && _workbook$activeSheet !== void 0 ? _workbook$activeSheet : (0, rxjs.of)(null);
+		})).subscribe((sheet) => {
+			if (sheet) {
+				const disposable = this._initSheet(sheet.getUnitId(), sheet.getSheetId());
+				return () => {
+					disposable.unsubscribe();
+				};
+			} else {
+				this._noteMatrix.forValue((_, __, disposable) => {
+					disposable.dispose();
+				});
+				this._noteMatrix = new _univerjs_core.ObjectMatrix();
+			}
+		}));
+	}
+};
+SheetsNoteAttachmentController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_sheets_note.SheetsNoteModel)),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_core.IUniverInstanceService)),
+	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_sheets_ui.CellPopupManagerService)),
+	__decorateParam(3, (0, _univerjs_core.Inject)(SheetsNotePopupService))
+], SheetsNoteAttachmentController);
+
+//#endregion
+//#region src/commands/operations/add-note-popup.operation.ts
+const AddNotePopupOperation = {
+	id: "sheet.operation.add-note-popup",
+	type: _univerjs_core.CommandType.OPERATION,
+	handler: async (accessor, params) => {
+		var _params$trigger;
+		const selectionService = accessor.get(_univerjs_sheets.SheetsSelectionsService);
+		const notePopupService = accessor.get(SheetsNotePopupService);
+		const workbook = accessor.get(_univerjs_core.IUniverInstanceService).getCurrentUnitForType(_univerjs_core.UniverInstanceType.UNIVER_SHEET);
+		if (!workbook) return false;
+		const worksheet = workbook.getActiveSheet();
+		const lastSelection = selectionService.getCurrentLastSelection();
+		if (!(lastSelection === null || lastSelection === void 0 ? void 0 : lastSelection.primary)) return false;
+		const { primary } = lastSelection;
+		notePopupService.showPopup({
+			unitId: workbook.getUnitId(),
+			subUnitId: worksheet.getSheetId(),
+			row: primary.actualRow,
+			col: primary.actualColumn,
+			temp: false,
+			trigger: (_params$trigger = params === null || params === void 0 ? void 0 : params.trigger) !== null && _params$trigger !== void 0 ? _params$trigger : "add-note"
+		});
+		return true;
+	}
+};
+
+//#endregion
+//#region src/menu/note.menu.ts
+function getHasNote$(accessor) {
+	const sheetsSelectionsService = accessor.get(_univerjs_sheets.SheetsSelectionsService);
+	const univerInstanceService = accessor.get(_univerjs_core.IUniverInstanceService);
+	return sheetsSelectionsService.selectionMoveEnd$.pipe((0, rxjs.map)(() => {
+		const selection = sheetsSelectionsService.getCurrentLastSelection();
+		if (!(selection === null || selection === void 0 ? void 0 : selection.primary)) return false;
+		const target = (0, _univerjs_sheets.getSheetCommandTarget)(univerInstanceService);
+		if (!target) return false;
+		const { actualColumn, actualRow } = selection.primary;
+		const noteModel = accessor.get(_univerjs_sheets_note.SheetsNoteModel);
+		return Boolean(noteModel.getNote(target.unitId, target.subUnitId, {
+			row: actualRow,
+			col: actualColumn
+		}));
+	}));
+}
+function sheetNoteContextMenuFactory(accessor) {
+	return {
+		id: AddNotePopupOperation.id,
+		type: _univerjs_ui.MenuItemType.BUTTON,
+		title: "rightClick.addNote",
+		icon: "AddNoteIcon",
+		hidden$: (0, rxjs.combineLatest)([(0, _univerjs_ui.getMenuHiddenObservable)(accessor, _univerjs_core.UniverInstanceType.UNIVER_SHEET), getHasNote$(accessor)]).pipe((0, rxjs.map)(([hidden, hasNote]) => hidden || hasNote)),
+		disabled$: (0, _univerjs_sheets_ui.getCurrentRangeDisable$)(accessor, {
+			workbookTypes: [_univerjs_sheets.WorkbookEditablePermission],
+			worksheetTypes: [_univerjs_sheets.WorksheetEditPermission]
+		}),
+		commandId: AddNotePopupOperation.id
+	};
+}
+function sheetDeleteNoteMenuFactory(accessor) {
+	return {
+		id: _univerjs_sheets_note.SheetDeleteNoteCommand.id,
+		type: _univerjs_ui.MenuItemType.BUTTON,
+		title: "rightClick.deleteNote",
+		icon: "DeleteNoteIcon",
+		hidden$: getHasNote$(accessor).pipe((0, rxjs.map)((hasNote) => !hasNote)),
+		disabled$: (0, _univerjs_sheets_ui.getCurrentRangeDisable$)(accessor, {
+			workbookTypes: [_univerjs_sheets.WorkbookEditablePermission],
+			worksheetTypes: [_univerjs_sheets.WorksheetEditPermission]
+		})
+	};
+}
+function sheetNoteToggleMenuFactory(accessor) {
+	return {
+		id: _univerjs_sheets_note.SheetToggleNotePopupCommand.id,
+		type: _univerjs_ui.MenuItemType.BUTTON,
+		title: "rightClick.toggleNote",
+		icon: "HideNoteIcon",
+		hidden$: getHasNote$(accessor).pipe((0, rxjs.map)((hasNote) => !hasNote))
+	};
+}
+
+//#endregion
+//#region src/menu/schema.ts
+const menuSchema = { [_univerjs_ui.ContextMenuPosition.MAIN_AREA]: { [_univerjs_ui.ContextMenuGroup.OTHERS]: {
+	order: 0,
+	[AddNotePopupOperation.id]: {
+		order: 0,
+		menuItemFactory: sheetNoteContextMenuFactory
+	},
+	[_univerjs_sheets_note.SheetDeleteNoteCommand.id]: {
+		order: 0,
+		menuItemFactory: sheetDeleteNoteMenuFactory
+	},
+	[_univerjs_sheets_note.SheetToggleNotePopupCommand.id]: {
+		order: 0,
+		menuItemFactory: sheetNoteToggleMenuFactory
+	}
+} } };
+
+//#endregion
+//#region src/views/note.tsx
+const SheetsNote = (props) => {
+	var _popup$extraProps;
+	const { popup } = props;
+	const noteModel = (0, _univerjs_ui.useDependency)(_univerjs_sheets_note.SheetsNoteModel);
+	const localeService = (0, _univerjs_ui.useDependency)(_univerjs_core.LocaleService);
+	const renderManagerService = (0, _univerjs_ui.useDependency)(_univerjs_engine_render.IRenderManagerService);
+	const notePopupService = (0, _univerjs_ui.useDependency)(SheetsNotePopupService);
+	const config = (0, _univerjs_ui.useConfigValue)(SHEETS_NOTE_UI_PLUGIN_CONFIG_KEY);
+	const activePopup = (_popup$extraProps = popup.extraProps) === null || _popup$extraProps === void 0 ? void 0 : _popup$extraProps.location;
+	if (!activePopup) {
+		console.error("Popup extraProps or location is undefined.");
+		return null;
+	}
+	const textareaRef = (0, react.useRef)(null);
+	const currentRender = renderManagerService.getRenderById(activePopup.unitId);
+	const [note, setNote] = (0, react.useState)(null);
+	(0, react.useEffect)(() => {
+		var _ref, _note$width, _config$defaultNoteSi, _ref2, _note$height, _config$defaultNoteSi2;
+		const { unitId, subUnitId, row, col } = activePopup;
+		const note = noteModel.getNote(unitId, subUnitId, {
+			row,
+			col
+		});
+		const width = (_ref = (_note$width = note === null || note === void 0 ? void 0 : note.width) !== null && _note$width !== void 0 ? _note$width : config === null || config === void 0 || (_config$defaultNoteSi = config.defaultNoteSize) === null || _config$defaultNoteSi === void 0 ? void 0 : _config$defaultNoteSi.width) !== null && _ref !== void 0 ? _ref : 160;
+		const height = (_ref2 = (_note$height = note === null || note === void 0 ? void 0 : note.height) !== null && _note$height !== void 0 ? _note$height : config === null || config === void 0 || (_config$defaultNoteSi2 = config.defaultNoteSize) === null || _config$defaultNoteSi2 === void 0 ? void 0 : _config$defaultNoteSi2.height) !== null && _ref2 !== void 0 ? _ref2 : 72;
+		if (!note) {
+			const initNote = {
+				id: (0, _univerjs_core.generateRandomId)(6),
+				width,
+				height,
+				note: ""
+			};
+			setNote(initNote);
+			updateNote(initNote);
+		} else setNote(note);
+		if (textareaRef.current) {
+			textareaRef.current.style.width = `${width}px`;
+			textareaRef.current.style.height = `${height}px`;
+		}
+	}, [activePopup, textareaRef]);
+	(0, react.useEffect)(() => {
+		if (!activePopup || activePopup.temp || !activePopup.trigger) return;
+		if (!textareaRef.current) return;
+		const focusId = requestAnimationFrame(() => {
+			var _textareaRef$current;
+			(_textareaRef$current = textareaRef.current) === null || _textareaRef$current === void 0 || _textareaRef$current.focus();
+		});
+		return () => cancelAnimationFrame(focusId);
+	}, [activePopup]);
+	const commandService = (0, _univerjs_ui.useDependency)(_univerjs_core.ICommandService);
+	const updateNote = (0, _univerjs_ui.useDebounceFn)((newNote) => {
+		if (!activePopup) return;
+		const { unitId, subUnitId, row, col } = activePopup;
+		if (!commandService.syncExecuteCommand(_univerjs_sheets_note.SheetUpdateNoteCommand.id, {
+			unitId,
+			sheetId: subUnitId,
+			row,
+			col,
+			note: newNote
+		})) {
+			const oldNote = noteModel.getNote(unitId, subUnitId, {
+				noteId: newNote.id,
+				row,
+				col
+			});
+			if (oldNote) setNote(oldNote);
+			else notePopupService.hidePopup(true);
+		}
+	});
+	const handleNoteChange = (0, react.useCallback)((value) => {
+		if (!note) return;
+		if (value === note.note) return;
+		const newNote = {
+			...note,
+			note: value
+		};
+		setNote(newNote);
+		updateNote(newNote);
+	}, [note]);
+	const handleResize = (0, react.useCallback)((width, height) => {
+		if (!note) return;
+		if (width === note.width && height === note.height) return;
+		const newNote = {
+			...note,
+			width,
+			height
+		};
+		setNote(newNote);
+		updateNote(newNote);
+	}, [note]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_design.Textarea, {
+		ref: textareaRef,
+		"data-u-comp": "note-textarea",
+		className: (0, _univerjs_design.clsx)("univer-ml-px univer-min-h-1 univer-min-w-1 univer-bg-white !univer-text-sm univer-shadow dark:!univer-bg-gray-800"),
+		value: note === null || note === void 0 ? void 0 : note.note,
+		placeholder: localeService.t("note.placeholder"),
+		onResize: handleResize,
+		onValueChange: handleNoteChange,
+		onWheel: (e) => {
+			if (document.activeElement !== textareaRef.current) currentRender.engine.getCanvasElement().dispatchEvent(new WheelEvent(e.type, e.nativeEvent));
+		}
+	});
+};
+
+//#endregion
+//#region src/controllers/sheets-note-ui.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 SheetsNoteUIController = class SheetsNoteUIController extends _univerjs_core.Disposable {
+	constructor(_componentManager, _menuManagerService, _commandService) {
+		super();
+		this._componentManager = _componentManager;
+		this._menuManagerService = _menuManagerService;
+		this._commandService = _commandService;
+		this._initComponents();
+		this._initMenu();
+		this._initCommands();
+	}
+	_initComponents() {
+		[
+			[SHEET_NOTE_COMPONENT, SheetsNote],
+			["AddNoteIcon", _univerjs_icons.AddNoteIcon],
+			["DeleteNoteIcon", _univerjs_icons.DeleteNoteIcon],
+			["HideNoteIcon", _univerjs_icons.HideNoteIcon]
+		].forEach(([key, comp]) => {
+			this.disposeWithMe(this._componentManager.register(key, comp));
+		});
+	}
+	_initMenu() {
+		this._menuManagerService.mergeMenu(menuSchema);
+	}
+	_initCommands() {
+		this._commandService.registerCommand(AddNotePopupOperation);
+	}
+};
+SheetsNoteUIController = __decorate([
+	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_ui.ComponentManager)),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_ui.IMenuManagerService)),
+	__decorateParam(2, _univerjs_core.ICommandService)
+], SheetsNoteUIController);
+
+//#endregion
+//#region src/plugin.ts
+let UniverSheetsNoteUIPlugin = class UniverSheetsNoteUIPlugin extends _univerjs_core.Plugin {
+	constructor(_config = defaultPluginConfig, _injector, _configService) {
+		super();
+		this._config = _config;
+		this._injector = _injector;
+		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_NOTE_UI_PLUGIN_CONFIG_KEY, rest);
+	}
+	onStarting() {
+		[
+			[SheetsNotePopupService],
+			[SheetsCellContentController],
+			[SheetsNotePopupController],
+			[SheetsNoteUIController],
+			[SheetsNoteAttachmentController]
+		].forEach((dependency) => {
+			this._injector.add(dependency);
+		});
+	}
+	onReady() {
+		(0, _univerjs_core.touchDependencies)(this._injector, [[SheetsNoteUIController], [SheetsCellContentController]]);
+	}
+	onRendered() {
+		(0, _univerjs_core.touchDependencies)(this._injector, [[SheetsNotePopupController], [SheetsNoteAttachmentController]]);
+	}
+};
+_defineProperty(UniverSheetsNoteUIPlugin, "pluginName", "SHEET_NOTE_UI_PLUGIN");
+_defineProperty(UniverSheetsNoteUIPlugin, "packageName", name);
+_defineProperty(UniverSheetsNoteUIPlugin, "version", version);
+_defineProperty(UniverSheetsNoteUIPlugin, "type", _univerjs_core.UniverInstanceType.UNIVER_SHEET);
+UniverSheetsNoteUIPlugin = __decorate([
+	(0, _univerjs_core.DependentOn)(_univerjs_sheets_note.UniverSheetsNotePlugin),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_core.Injector)),
+	__decorateParam(2, _univerjs_core.IConfigService)
+], UniverSheetsNoteUIPlugin);
+
+//#endregion
+Object.defineProperty(exports, 'SheetsCellContentController', {
+  enumerable: true,
+  get: function () {
+    return SheetsCellContentController;
+  }
+});
+exports.SheetsNote = SheetsNote;
+Object.defineProperty(exports, 'SheetsNotePopupController', {
+  enumerable: true,
+  get: function () {
+    return SheetsNotePopupController;
+  }
+});
+Object.defineProperty(exports, 'SheetsNotePopupService', {
+  enumerable: true,
+  get: function () {
+    return SheetsNotePopupService;
+  }
+});
+Object.defineProperty(exports, 'UniverSheetsNoteUIPlugin', {
+  enumerable: true,
+  get: function () {
+    return UniverSheetsNoteUIPlugin;
+  }
+});