@difizen/libro-code-cell 0.2.34 → 0.2.35-next.0

package/es/code-cell-view.d.ts

@@ -1,23 +1,18 @@
 /// <reference types="react" resolution-mode="require"/>
-import type { CodeEditorViewOptions, CodeEditorView } from '@difizen/libro-code-editor';
+import type { CodeEditorViewOptions } from '@difizen/libro-code-editor';
 import { CodeEditorManager } from '@difizen/libro-code-editor';
 import type { IOutput } from '@difizen/libro-common';
 import type { LibroCell, CellViewOptions } from '@difizen/libro-core';
-import { CellService, EditorStatus, LibroExecutableCellView, LibroOutputArea, LibroContextKey } from '@difizen/libro-core';
+import { CellService, EditorStatus, LibroEditableExecutableCellView, LibroOutputArea } from '@difizen/libro-core';
 import type { ViewSize } from '@difizen/mana-app';
-import { DisposableCollection } from '@difizen/mana-app';
 import { ViewManager, Deferred } from '@difizen/mana-app';
 import type { LibroCodeCellModel } from './code-cell-model.js';
 export declare const CellEditorMemo: import("react").NamedExoticComponent<{}>;
-export declare class LibroCodeCellView extends LibroExecutableCellView {
-    protected toDisposeOnEditor: DisposableCollection;
-    protected readonly libroContextKey: LibroContextKey;
+export declare class LibroCodeCellView extends LibroEditableExecutableCellView {
     view: import("react").ForwardRefExoticComponent<import("react").RefAttributes<HTMLDivElement>>;
     viewManager: ViewManager;
-    codeEditorManager: CodeEditorManager;
     model: LibroCodeCellModel;
     outputs: IOutput[];
-    editorView?: CodeEditorView;
     editorAreaHeight: number;
     noEditorAreaHeight: number;
     cellViewTopPos: number;
@@ -33,12 +28,6 @@ export declare class LibroCodeCellView extends LibroExecutableCellView {
     onViewMount(): void;
     setEditorHost(ref: React.RefObject<HTMLDivElement>): void;
     protected getEditorOption(): CodeEditorViewOptions;
-    protected createEditor(): Promise<void>;
-    protected afterEditorReady(): Promise<void>;
-    protected focusEditor(): void;
-    shouldEnterEditorMode(e: React.FocusEvent<HTMLElement>): boolean;
-    blur: () => void;
-    focus: (toEdit: boolean) => void;
     clearExecution: () => void;
 }
 //# sourceMappingURL=code-cell-view.d.ts.map

package/es/code-cell-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"code-cell-view.d.ts","sourceRoot":"","sources":["../src/code-cell-view.tsx"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACxF,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,KAAK,EAAa,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGhE,OAAO,KAAK,EAEV,SAAS,EACT,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,WAAW,EACX,YAAY,EACZ,uBAAuB,EACvB,eAAe,EAEf,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAQL,WAAW,EAIX,QAAQ,EACT,MAAM,mBAAmB,CAAC;AAG3B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AA2C/D,eAAO,MAAM,cAAc,0CAAmB,CAAC;AAmB/C,qBAEa,iBAAkB,SAAQ,uBAAuB;IAC5D,SAAS,CAAC,iBAAiB,uBAA8B;IAChC,SAAS,CAAC,QAAQ,CAAC,eAAe,EAAE,eAAe,CAAC;IACpE,IAAI,2FAA2B;IAExC,WAAW,EAAE,WAAW,CAAC;IAEzB,iBAAiB,EAAE,iBAAiB,CAAC;IAE7B,KAAK,EAAE,kBAAkB,CAAC;IAElC,OAAO,EAAE,OAAO,EAAE,CAAC;IAGnB,UAAU,CAAC,EAAE,cAAc,CAAC;IAG5B,gBAAgB,SAAK;IAGZ,kBAAkB,SAAK;IAGvB,cAAc,SAAK;IAGnB,YAAY,EAAE,YAAY,CAA0B;IAE7D,SAAS,CAAC,kBAAkB,4BAAmC;IAC/D,IAAI,eAAe,6BAElB;IAEQ,YAAY,uDAKnB;IAEO,YAAY,CAAC,IAAI,EAAE,QAAQ;IAMpC,oBAAoB;gBAqBE,OAAO,EAAE,eAAe,EACvB,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,EAClB,iBAAiB,EAAE,iBAAiB;IA6BxD,WAAW;IAQX,MAAM,IAAI,SAAS;IAQnB,WAAW;IAIpB,aAAa,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAKlD,SAAS,CAAC,eAAe,IAAI,qBAAqB;cAclC,YAAY;cA0BZ,gBAAgB;IAoBhC,SAAS,CAAC,WAAW;IAgBZ,qBAAqB,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC;IAMtD,IAAI,aAGX;IAEO,KAAK,WAAY,OAAO,UAS/B;IAEO,cAAc,aAGrB;CACH"}
+{"version":3,"file":"code-cell-view.d.ts","sourceRoot":"","sources":["../src/code-cell-view.tsx"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,KAAK,EAAa,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGhE,OAAO,KAAK,EAEV,SAAS,EACT,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,WAAW,EACX,YAAY,EACZ,+BAA+B,EAC/B,eAAe,EAEhB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAQL,WAAW,EAIX,QAAQ,EACT,MAAM,mBAAmB,CAAC;AAG3B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AA2C/D,eAAO,MAAM,cAAc,0CAAmB,CAAC;AAmB/C,qBAEa,iBAAkB,SAAQ,+BAA+B;IAC3D,IAAI,2FAA2B;IAExC,WAAW,EAAE,WAAW,CAAC;IAEjB,KAAK,EAAE,kBAAkB,CAAC;IAElC,OAAO,EAAE,OAAO,EAAE,CAAC;IAGnB,gBAAgB,SAAK;IAGZ,kBAAkB,SAAK;IAGvB,cAAc,SAAK;IAGnB,YAAY,EAAE,YAAY,CAA0B;IAE7D,SAAS,CAAC,kBAAkB,4BAAmC;IAC/D,IAAI,eAAe,6BAElB;IAEQ,YAAY,uDAKnB;IAEO,YAAY,CAAC,IAAI,EAAE,QAAQ;IAMpC,oBAAoB;gBAqBE,OAAO,EAAE,eAAe,EACvB,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,EAClB,iBAAiB,EAAE,iBAAiB;IA6BxD,WAAW;IAQX,MAAM,IAAI,SAAS;IAQnB,WAAW;IAIpB,aAAa,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;cAK/B,eAAe,IAAI,qBAAqB;IAclD,cAAc,aAGrB;CACH"}

package/es/code-cell-view.js

@@ -1,5 +1,5 @@
 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); }
-var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _class, _class2, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6;
+var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _class, _class2, _descriptor, _descriptor2, _descriptor3, _descriptor4;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -30,9 +30,7 @@ function _initializerWarningHelper(descriptor, context) { throw new Error('Decor
 import { CodeEditorManager } from '@difizen/libro-code-editor';
 import { CellUri } from '@difizen/libro-common';
 import { isOutput } from '@difizen/libro-common';
-import { CellService, EditorStatus, LibroExecutableCellView, LibroOutputArea, VirtualizedManagerHelper, LibroContextKey } from '@difizen/libro-core';
-import { Disposable } from '@difizen/mana-app';
-import { DisposableCollection } from '@difizen/mana-app';
+import { CellService, EditorStatus, LibroEditableExecutableCellView, LibroOutputArea, VirtualizedManagerHelper } from '@difizen/libro-core';
 import { getOrigin, inject, prop, transient, useInject, view, ViewInstance, ViewManager, ViewOption, ViewRender, watch, Deferred } from '@difizen/mana-app';
 import { useEffect, useRef, memo, forwardRef } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -86,25 +84,21 @@ var CodeEditorViewComponent = /*#__PURE__*/forwardRef(function CodeEditorViewCom
     children: /*#__PURE__*/_jsx(CellEditorMemo, {})
   });
 });
-export var LibroCodeCellView = (_dec = transient(), _dec2 = view('code-editor-cell-view'), _dec3 = inject(LibroContextKey), _dec4 = prop(), _dec5 = prop(), _dec6 = prop(), _dec7 = prop(), _dec8 = prop(), _dec(_class = _dec2(_class = (_class2 = /*#__PURE__*/function (_LibroExecutableCellV) {
-  _inherits(LibroCodeCellView, _LibroExecutableCellV);
+export var LibroCodeCellView = (_dec = transient(), _dec2 = view('code-editor-cell-view'), _dec3 = prop(), _dec4 = prop(), _dec5 = prop(), _dec6 = prop(), _dec(_class = _dec2(_class = (_class2 = /*#__PURE__*/function (_LibroEditableExecuta) {
+  _inherits(LibroCodeCellView, _LibroEditableExecuta);
   var _super = _createSuper(LibroCodeCellView);
   function LibroCodeCellView(options, cellService, viewManager, codeEditorManager) {
     var _options$cell;
     var _this;
     _classCallCheck(this, LibroCodeCellView);
     _this = _super.call(this, options, cellService);
-    _this.toDisposeOnEditor = new DisposableCollection();
-    _initializerDefineProperty(_this, "libroContextKey", _descriptor, _assertThisInitialized(_this));
     _this.view = CodeEditorViewComponent;
     _this.viewManager = void 0;
-    _this.codeEditorManager = void 0;
     _this.outputs = void 0;
-    _initializerDefineProperty(_this, "editorView", _descriptor2, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "editorAreaHeight", _descriptor3, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "noEditorAreaHeight", _descriptor4, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "cellViewTopPos", _descriptor5, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "editorStatus", _descriptor6, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "editorAreaHeight", _descriptor, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "noEditorAreaHeight", _descriptor2, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "cellViewTopPos", _descriptor3, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "editorStatus", _descriptor4, _assertThisInitialized(_this));
     _this.outputAreaDeferred = new Deferred();
     _this.renderEditor = function () {
       if (_this.editorView) {
@@ -114,22 +108,6 @@ export var LibroCodeCellView = (_dec = transient(), _dec2 = view('code-editor-ce
       }
       return null;
     };
-    _this.blur = function () {
-      var _this$editorView, _this$editorView2;
-      (_this$editorView = _this.editorView) === null || _this$editorView === void 0 || (_this$editorView = _this$editorView.editor) === null || _this$editorView === void 0 || _this$editorView.setOption('styleActiveLine', false);
-      (_this$editorView2 = _this.editorView) === null || _this$editorView2 === void 0 || (_this$editorView2 = _this$editorView2.editor) === null || _this$editorView2 === void 0 || _this$editorView2.setOption('highlightActiveLineGutter', false);
-    };
-    _this.focus = function (toEdit) {
-      if (toEdit) {
-        _this.focusEditor();
-      } else {
-        var _this$container, _this$container2;
-        if ((_this$container = _this.container) !== null && _this$container !== void 0 && (_this$container = _this$container.current) !== null && _this$container !== void 0 && (_this$container = _this$container.parentElement) !== null && _this$container !== void 0 && _this$container.contains(document.activeElement)) {
-          return;
-        }
-        (_this$container2 = _this.container) === null || _this$container2 === void 0 || (_this$container2 = _this$container2.current) === null || _this$container2 === void 0 || (_this$container2 = _this$container2.parentElement) === null || _this$container2 === void 0 || _this$container2.focus();
-      }
-    };
     _this.clearExecution = function () {
       _this.model.clearExecution();
       _this.outputArea.clear();
@@ -252,143 +230,30 @@ export var LibroCodeCellView = (_dec = transient(), _dec2 = view('code-editor-ce
       };
       return option;
     }
-  }, {
-    key: "createEditor",
-    value: function () {
-      var _createEditor = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-        var _this3 = this;
-        var option, editorView;
-        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              option = this.getEditorOption();
-              this.editorStatus = EditorStatus.LOADING;
-
-              // 防止虚拟滚动中编辑器被频繁创建
-              if (!this.editorView) {
-                _context2.next = 5;
-                break;
-              }
-              this.editorStatus = EditorStatus.LOADED;
-              return _context2.abrupt("return");
-            case 5:
-              _context2.next = 7;
-              return this.codeEditorManager.getOrCreateEditorView(option);
-            case 7:
-              editorView = _context2.sent;
-              this.editorView = editorView;
-              this.editorStatus = EditorStatus.LOADED;
-              editorView.onEditorStatusChange(function (e) {
-                if (e.status === 'ready') {
-                  _this3.editor = _this3.editorView.editor;
-                  _this3.afterEditorReady();
-                } else if (e.status === 'disposed') {
-                  _this3.toDisposeOnEditor.dispose();
-                }
-              });
-            case 11:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2, this);
-      }));
-      function createEditor() {
-        return _createEditor.apply(this, arguments);
-      }
-      return createEditor;
-    }()
-  }, {
-    key: "afterEditorReady",
-    value: function () {
-      var _afterEditorReady = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
-        var _this4 = this,
-          _this$editorView$onMo,
-          _this$editorView3,
-          _this$editor$onModelC,
-          _this$editor,
-          _this$editor$onModelC2;
-        return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-          while (1) switch (_context3.prev = _context3.next) {
-            case 0:
-              this.focusEditor();
-              this.toDisposeOnEditor.push(watch(this.parent.model, 'inputEditable', function () {
-                var _this4$editorView;
-                (_this4$editorView = _this4.editorView) === null || _this4$editorView === void 0 || (_this4$editorView = _this4$editorView.editor) === null || _this4$editorView === void 0 || _this4$editorView.setOption('readOnly', getOrigin(!_this4.parent.model.inputEditable));
-              }));
-              this.toDisposeOnEditor.push((_this$editorView$onMo = (_this$editorView3 = this.editorView) === null || _this$editorView3 === void 0 ? void 0 : _this$editorView3.onModalChange(function (val) {
-                return _this4.hasModal = val;
-              })) !== null && _this$editorView$onMo !== void 0 ? _this$editorView$onMo : Disposable.NONE);
-              this.toDisposeOnEditor.push((_this$editor$onModelC = (_this$editor = this.editor) === null || _this$editor === void 0 || (_this$editor$onModelC2 = _this$editor.onModelContentChanged) === null || _this$editor$onModelC2 === void 0 ? void 0 : _this$editor$onModelC2.call(_this$editor, function (e) {
-                _this4.parent.model.onCellContentChange({
-                  cell: _this4,
-                  changes: e
-                });
-              })) !== null && _this$editor$onModelC !== void 0 ? _this$editor$onModelC : Disposable.NONE);
-            case 4:
-            case "end":
-              return _context3.stop();
-          }
-        }, _callee3, this);
-      }));
-      function afterEditorReady() {
-        return _afterEditorReady.apply(this, arguments);
-      }
-      return afterEditorReady;
-    }()
-  }, {
-    key: "focusEditor",
-    value: function focusEditor() {
-      var _this$editorView4, _this$parent$model$ac;
-      //选中cell、编辑模式、非只读时才focus
-      if ((_this$editorView4 = this.editorView) !== null && _this$editorView4 !== void 0 && _this$editorView4.editor && this.editorView.editorStatus === 'ready' && ((_this$parent$model$ac = this.parent.model.active) === null || _this$parent$model$ac === void 0 ? void 0 : _this$parent$model$ac.id) === this.id && !this.parent.model.commandMode && this.libroContextKey.commandModeEnabled === true &&
-      // 排除弹窗等情况
-      this.parent.model.inputEditable) {
-        var _this$editorView5, _this$editorView6, _this$editorView7;
-        (_this$editorView5 = this.editorView) === null || _this$editorView5 === void 0 || _this$editorView5.editor.setOption('styleActiveLine', true);
-        (_this$editorView6 = this.editorView) === null || _this$editorView6 === void 0 || _this$editorView6.editor.setOption('highlightActiveLineGutter', true);
-        (_this$editorView7 = this.editorView) === null || _this$editorView7 === void 0 || _this$editorView7.editor.focus();
-      }
-    }
-  }, {
-    key: "shouldEnterEditorMode",
-    value: function shouldEnterEditorMode(e) {
-      var _getOrigin;
-      return (_getOrigin = getOrigin(this.editorView)) !== null && _getOrigin !== void 0 && (_getOrigin = _getOrigin.editor) !== null && _getOrigin !== void 0 && (_getOrigin = _getOrigin.host) !== null && _getOrigin !== void 0 && _getOrigin.contains(e.target) ? true : false;
-    }
   }]);
   return LibroCodeCellView;
-}(LibroExecutableCellView), (_descriptor = _applyDecoratedDescriptor(_class2.prototype, "libroContextKey", [_dec3], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: null
-}), _descriptor2 = _applyDecoratedDescriptor(_class2.prototype, "editorView", [_dec4], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: null
-}), _descriptor3 = _applyDecoratedDescriptor(_class2.prototype, "editorAreaHeight", [_dec5], {
+}(LibroEditableExecutableCellView), (_descriptor = _applyDecoratedDescriptor(_class2.prototype, "editorAreaHeight", [_dec3], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return 0;
   }
-}), _descriptor4 = _applyDecoratedDescriptor(_class2.prototype, "noEditorAreaHeight", [_dec6], {
+}), _descriptor2 = _applyDecoratedDescriptor(_class2.prototype, "noEditorAreaHeight", [_dec4], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return 0;
   }
-}), _descriptor5 = _applyDecoratedDescriptor(_class2.prototype, "cellViewTopPos", [_dec7], {
+}), _descriptor3 = _applyDecoratedDescriptor(_class2.prototype, "cellViewTopPos", [_dec5], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return 0;
   }
-}), _descriptor6 = _applyDecoratedDescriptor(_class2.prototype, "editorStatus", [_dec8], {
+}), _descriptor4 = _applyDecoratedDescriptor(_class2.prototype, "editorStatus", [_dec6], {
   configurable: true,
   enumerable: true,
   writable: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@difizen/libro-code-cell",
-  "version": "0.2.34",
+  "version": "0.2.35-next.0",
   "description": "",
   "keywords": [
     "libro",
@@ -32,9 +32,9 @@
     "src"
   ],
   "dependencies": {
-    "@difizen/libro-code-editor": "^0.2.34",
-    "@difizen/libro-common": "^0.2.34",
-    "@difizen/libro-core": "^0.2.34",
+    "@difizen/libro-code-editor": "^0.2.35-next.0",
+    "@difizen/libro-common": "^0.2.35-next.0",
+    "@difizen/libro-core": "^0.2.35-next.0",
     "@difizen/mana-app": "latest"
   },
   "peerDependencies": {

package/src/code-cell-view.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 /* eslint-disable @typescript-eslint/no-parameter-properties */
 /* eslint-disable @typescript-eslint/parameter-properties */
-import type { CodeEditorViewOptions, CodeEditorView } from '@difizen/libro-code-editor';
+import type { CodeEditorViewOptions } from '@difizen/libro-code-editor';
 import { CodeEditorManager } from '@difizen/libro-code-editor';
 import type { ICodeCell, IOutput } from '@difizen/libro-common';
 import { CellUri } from '@difizen/libro-common';
@@ -14,14 +14,11 @@ import type {
 import {
   CellService,
   EditorStatus,
-  LibroExecutableCellView,
+  LibroEditableExecutableCellView,
   LibroOutputArea,
   VirtualizedManagerHelper,
-  LibroContextKey,
 } from '@difizen/libro-core';
 import type { ViewSize } from '@difizen/mana-app';
-import { Disposable } from '@difizen/mana-app';
-import { DisposableCollection } from '@difizen/mana-app';
 import {
   getOrigin,
   inject,
@@ -102,22 +99,15 @@ const CodeEditorViewComponent = forwardRef<HTMLDivElement>(
 
 @transient()
 @view('code-editor-cell-view')
-export class LibroCodeCellView extends LibroExecutableCellView {
-  protected toDisposeOnEditor = new DisposableCollection();
-  @inject(LibroContextKey) protected readonly libroContextKey: LibroContextKey;
+export class LibroCodeCellView extends LibroEditableExecutableCellView {
   override view = CodeEditorViewComponent;
 
   viewManager: ViewManager;
 
-  codeEditorManager: CodeEditorManager;
-
   declare model: LibroCodeCellModel;
 
   outputs: IOutput[];
 
-  @prop()
-  editorView?: CodeEditorView;
-
   @prop()
   editorAreaHeight = 0;
 
@@ -226,7 +216,7 @@ export class LibroCodeCellView extends LibroExecutableCellView {
     this.codeEditorManager.setEditorHostRef(editorHostId, ref);
   }
 
-  protected getEditorOption(): CodeEditorViewOptions {
+  protected override getEditorOption(): CodeEditorViewOptions {
     const option: CodeEditorViewOptions = {
       uuid: CellUri.from(this.parent.model.id, this.model.id).toString(),
       editorHostId: this.parent.id + this.id,
@@ -240,90 +230,6 @@ export class LibroCodeCellView extends LibroExecutableCellView {
     return option;
   }
 
-  protected async createEditor() {
-    const option = this.getEditorOption();
-
-    this.editorStatus = EditorStatus.LOADING;
-
-    // 防止虚拟滚动中编辑器被频繁创建
-    if (this.editorView) {
-      this.editorStatus = EditorStatus.LOADED;
-      return;
-    }
-
-    const editorView = await this.codeEditorManager.getOrCreateEditorView(option);
-
-    this.editorView = editorView;
-    this.editorStatus = EditorStatus.LOADED;
-
-    editorView.onEditorStatusChange((e) => {
-      if (e.status === 'ready') {
-        this.editor = this.editorView!.editor;
-        this.afterEditorReady();
-      } else if (e.status === 'disposed') {
-        this.toDisposeOnEditor.dispose();
-      }
-    });
-  }
-
-  protected async afterEditorReady() {
-    this.focusEditor();
-    this.toDisposeOnEditor.push(
-      watch(this.parent.model, 'inputEditable', () => {
-        this.editorView?.editor?.setOption(
-          'readOnly',
-          getOrigin(!this.parent.model.inputEditable),
-        );
-      }),
-    );
-    this.toDisposeOnEditor.push(
-      this.editorView?.onModalChange((val) => (this.hasModal = val)) ?? Disposable.NONE,
-    );
-    this.toDisposeOnEditor.push(
-      this.editor?.onModelContentChanged?.((e) => {
-        this.parent.model.onCellContentChange({ cell: this, changes: e });
-      }) ?? Disposable.NONE,
-    );
-  }
-
-  protected focusEditor() {
-    //选中cell、编辑模式、非只读时才focus
-    if (
-      this.editorView?.editor &&
-      this.editorView.editorStatus === 'ready' &&
-      this.parent.model.active?.id === this.id &&
-      !this.parent.model.commandMode &&
-      this.libroContextKey.commandModeEnabled === true && // 排除弹窗等情况
-      this.parent.model.inputEditable
-    ) {
-      this.editorView?.editor.setOption('styleActiveLine', true);
-      this.editorView?.editor.setOption('highlightActiveLineGutter', true);
-      this.editorView?.editor.focus();
-    }
-  }
-
-  override shouldEnterEditorMode(e: React.FocusEvent<HTMLElement>) {
-    return getOrigin(this.editorView)?.editor?.host?.contains(e.target as HTMLElement)
-      ? true
-      : false;
-  }
-
-  override blur = () => {
-    this.editorView?.editor?.setOption('styleActiveLine', false);
-    this.editorView?.editor?.setOption('highlightActiveLineGutter', false);
-  };
-
-  override focus = (toEdit: boolean) => {
-    if (toEdit) {
-      this.focusEditor();
-    } else {
-      if (this.container?.current?.parentElement?.contains(document.activeElement)) {
-        return;
-      }
-      this.container?.current?.parentElement?.focus();
-    }
-  };
-
   override clearExecution = () => {
     this.model.clearExecution();
     this.outputArea.clear();