@opensumi/ide-core-browser 2.27.2 → 2.27.3-next-1706077936.0

package/lib/utils/electron.d.ts

@@ -1,5 +1,5 @@
+import { NetSocketConnection } from '@opensumi/ide-connection/lib/common/connection';
 import { IElectronMainApi } from '@opensumi/ide-core-common/lib/electron';
-import type { MessageConnection } from '@opensumi/vscode-jsonrpc';
 export interface IElectronIpcRenderer {
     on(channel: string, listener: (event: any, ...args: any[]) => void): any;
     once(channel: string, listener: (event: any, ...args: any[]) => void): any;
@@ -8,12 +8,17 @@ export interface IElectronIpcRenderer {
     send(channel: string, ...args: any[]): void;
 }
 export declare function createElectronMainApi(name: string, enableCaptured?: boolean): IElectronMainApi<any>;
+export interface IElectronEnvMetadata {
+    windowClientId: string;
+    [key: string]: any;
+}
 export declare const electronEnv: {
     currentWindowId: number;
     currentWebContentsId: number;
     ipcRenderer: IElectronIpcRenderer;
     webviewPreload: string;
     plainWebviewPreload: string;
+    metadata: IElectronEnvMetadata;
     [key: string]: any;
 };
 export interface IElectronNativeDialogService {
@@ -21,5 +26,6 @@ export interface IElectronNativeDialogService {
     showSaveDialog(options: Electron.SaveDialogOptions): Promise<string | undefined>;
 }
 export declare const IElectronNativeDialogService: unique symbol;
-export declare function createElectronClientConnection(connectPath?: string): MessageConnection;
+export declare function createNetSocketConnection(connectPath?: string): NetSocketConnection;
+export declare function fromWindowClientId(suffix: string): string;
 //# sourceMappingURL=electron.d.ts.map

package/lib/utils/electron.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"electron.d.ts","sourceRoot":"","sources":["../../src/utils/electron.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAIlE,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,OAAE;IACpE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,OAAE;IACtE,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,OAAE;IAChF,kBAAkB,CAAC,OAAO,CAAC,EAAE,MAAM,OAAE;IACrC,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;CAC7C;AAyBD,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,MAAM,EAAE,cAAc,CAAC,EAAE,OAAO,GAAG,gBAAgB,CAAC,GAAG,CAAC,CAuDnG;AAED,eAAO,MAAM,WAAW,EAAE;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,WAAW,EAAE,oBAAoB,CAAC;IAClC,cAAc,EAAE,MAAM,CAAC;IACvB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACI,CAAC;AAM1B,MAAM,WAAW,4BAA4B;IAC3C,cAAc,CAAC,OAAO,EAAE,QAAQ,CAAC,iBAAiB,GAAG,OAAO,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,CAAC;IAEnF,cAAc,CAAC,OAAO,EAAE,QAAQ,CAAC,iBAAiB,GAAG,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CAClF;AAED,eAAO,MAAM,4BAA4B,eAAyC,CAAC;AAEnF,wBAAgB,8BAA8B,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,iBAAiB,CAStF"}
+{"version":3,"file":"electron.d.ts","sourceRoot":"","sources":["../../src/utils/electron.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gDAAgD,CAAC;AAErF,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,OAAE;IACpE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,OAAE;IACtE,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,OAAE;IAChF,kBAAkB,CAAC,OAAO,CAAC,EAAE,MAAM,OAAE;IACrC,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;CAC7C;AAyBD,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,MAAM,EAAE,cAAc,CAAC,EAAE,OAAO,GAAG,gBAAgB,CAAC,GAAG,CAAC,CAuDnG;AAED,MAAM,WAAW,oBAAoB;IACnC,cAAc,EAAE,MAAM,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,EAAE;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,WAAW,EAAE,oBAAoB,CAAC;IAClC,cAAc,EAAE,MAAM,CAAC;IACvB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACI,CAAC;AAM1B,MAAM,WAAW,4BAA4B;IAC3C,cAAc,CAAC,OAAO,EAAE,QAAQ,CAAC,iBAAiB,GAAG,OAAO,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,CAAC;IACnF,cAAc,CAAC,OAAO,EAAE,QAAQ,CAAC,iBAAiB,GAAG,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CAClF;AAED,eAAO,MAAM,4BAA4B,eAAyC,CAAC;AAEnF,wBAAgB,yBAAyB,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAQnF;AAED,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,MAAM,UAEhD"}

package/lib/utils/electron.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createElectronClientConnection = exports.IElectronNativeDialogService = exports.electronEnv = exports.createElectronMainApi = void 0;
+exports.fromWindowClientId = exports.createNetSocketConnection = exports.IElectronNativeDialogService = exports.electronEnv = exports.createElectronMainApi = void 0;
+const connection_1 = require("@opensumi/ide-connection/lib/common/connection");
 const ide_core_common_1 = require("@opensumi/ide-core-common");
 const getCapturer = () => {
     var _a;
@@ -76,7 +77,7 @@ if (typeof ElectronIpcRenderer !== 'undefined') {
     exports.electronEnv.ipcRenderer = ElectronIpcRenderer;
 }
 exports.IElectronNativeDialogService = Symbol('IElectronNativeDialogService');
-function createElectronClientConnection(connectPath) {
+function createNetSocketConnection(connectPath) {
     let socket;
     if (connectPath) {
         socket = exports.electronEnv.createNetConnection(connectPath);
@@ -84,8 +85,11 @@ function createElectronClientConnection(connectPath) {
     else {
         socket = exports.electronEnv.createRPCNetConnection();
     }
-    const { createSocketConnection } = require('@opensumi/ide-connection/lib/node/connect');
-    return createSocketConnection(socket);
+    return new connection_1.NetSocketConnection(socket);
 }
-exports.createElectronClientConnection = createElectronClientConnection;
+exports.createNetSocketConnection = createNetSocketConnection;
+function fromWindowClientId(suffix) {
+    return `${suffix}-${exports.electronEnv.metadata.windowClientId}`;
+}
+exports.fromWindowClientId = fromWindowClientId;
 //# sourceMappingURL=electron.js.map

package/lib/utils/electron.js.map

@@ -1 +1 @@
-{"version":3,"file":"electron.js","sourceRoot":"","sources":["../../src/utils/electron.ts"],"names":[],"mappings":";;;AAAA,+DAAmE;AAsBnE,MAAM,WAAW,GAAG,GAAG,EAAE;;IACvB,IAAI,MAAA,MAAM,CAAC,iCAAiC,0CAAE,UAAU,EAAE;QACxD,OAAO,MAAM,CAAC,iCAAiC,CAAC,UAAU,CAAC;KAC5D;IACD,OAAO;AACT,CAAC,CAAC;AAEF,MAAM,OAAO,GAAG,CAAC,OAAmB,EAAE,EAAE;IACtC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,IAAI,IAAA,2BAAS,EAAC,QAAQ,CAAC,EAAE;QACvB,kCAAkC;QAClC,QAAQ,CAAC,OAAO,CAAC,CAAC;KACnB;AACH,CAAC,CAAC;AAEF,SAAgB,qBAAqB,CAAC,IAAY,EAAE,cAAwB;IAC1E,IAAI,EAAE,GAAG,CAAC,CAAC;IACX,OAAO,IAAI,KAAK,CACd;QACE,EAAE,EAAE,CAAC,KAAa,EAAE,QAA2B,EAAe,EAAE;YAC9D,MAAM,eAAe,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE;gBAChD,IAAI,SAAS,KAAK,KAAK,EAAE;oBACvB,cAAc,IAAI,OAAO,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;oBACjF,OAAO,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;iBAC1B;YACH,CAAC,CAAC;YACF,mBAAmB,CAAC,EAAE,CAAC,QAAQ,GAAG,IAAI,EAAE,eAAe,CAAC,CAAC;YACzD,OAAO;gBACL,OAAO,EAAE,GAAG,EAAE;oBACZ,mBAAmB,CAAC,cAAc,CAAC,QAAQ,GAAG,IAAI,EAAE,eAAe,CAAC,CAAC;gBACvE,CAAC;aACF,CAAC;QACJ,CAAC;KACF,EACD;QACE,GAAG,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE;YACtB,IAAI,MAAM,KAAK,IAAI,EAAE;gBACnB,OAAO,MAAM,CAAC,MAAM,CAAC,CAAC;aACvB;iBAAM;gBACL,OAAO,KAAK,EAAE,GAAG,IAAS,EAAE,EAAE,CAC5B,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;oBAC9B,MAAM,SAAS,GAAG,EAAE,EAAE,CAAC;oBACvB,mBAAmB,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,CAAC;oBACxE,cAAc,IAAI,OAAO,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;oBACvG,MAAM,QAAQ,GAAG,CAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE;wBAC5C,IAAI,EAAE,KAAK,SAAS,EAAE;4BACpB,mBAAmB,CAAC,cAAc,CAAC,WAAW,GAAG,IAAI,EAAE,QAAQ,CAAC,CAAC;4BACjE,IAAI,KAAK,EAAE;gCACT,MAAM,CAAC,GAAG,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;gCACnC,CAAC,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;gCACtB,MAAM,CAAC,CAAC,CAAC,CAAC;6BACX;iCAAM;gCACL,OAAO,CAAC,MAAM,CAAC,CAAC;6BACjB;4BACD,cAAc;gCACZ,OAAO,CAAC;oCACN,IAAI,EAAE,UAAU;oCAChB,OAAO,EAAE,IAAI;oCACb,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC;oCACtB,SAAS;oCACT,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC;iCACtB,CAAC,CAAC;yBACN;oBACH,CAAC,CAAC;oBACF,mBAAmB,CAAC,EAAE,CAAC,WAAW,GAAG,IAAI,EAAE,QAAQ,CAAC,CAAC;gBACvD,CAAC,CAAC,CAAC;aACN;QACH,CAAC;KACF,CACF,CAAC;AACJ,CAAC;AAvDD,sDAuDC;AAEY,QAAA,WAAW,GAOnB,MAAc,IAAI,EAAE,CAAC;AAE1B,IAAI,OAAO,mBAAmB,KAAK,WAAW,EAAE;IAC9C,mBAAW,CAAC,WAAW,GAAG,mBAAmB,CAAC;CAC/C;AAQY,QAAA,4BAA4B,GAAG,MAAM,CAAC,8BAA8B,CAAC,CAAC;AAEnF,SAAgB,8BAA8B,CAAC,WAAoB;IACjE,IAAI,MAAM,CAAC;IACX,IAAI,WAAW,EAAE;QACf,MAAM,GAAG,mBAAW,CAAC,mBAAmB,CAAC,WAAW,CAAC,CAAC;KACvD;SAAM;QACL,MAAM,GAAG,mBAAW,CAAC,sBAAsB,EAAE,CAAC;KAC/C;IACD,MAAM,EAAE,sBAAsB,EAAE,GAAG,OAAO,CAAC,2CAA2C,CAAC,CAAC;IACxF,OAAO,sBAAsB,CAAC,MAAM,CAAC,CAAC;AACxC,CAAC;AATD,wEASC"}
+{"version":3,"file":"electron.js","sourceRoot":"","sources":["../../src/utils/electron.ts"],"names":[],"mappings":";;;AAAA,+EAAqF;AACrF,+DAAmE;AAqBnE,MAAM,WAAW,GAAG,GAAG,EAAE;;IACvB,IAAI,MAAA,MAAM,CAAC,iCAAiC,0CAAE,UAAU,EAAE;QACxD,OAAO,MAAM,CAAC,iCAAiC,CAAC,UAAU,CAAC;KAC5D;IACD,OAAO;AACT,CAAC,CAAC;AAEF,MAAM,OAAO,GAAG,CAAC,OAAmB,EAAE,EAAE;IACtC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,IAAI,IAAA,2BAAS,EAAC,QAAQ,CAAC,EAAE;QACvB,kCAAkC;QAClC,QAAQ,CAAC,OAAO,CAAC,CAAC;KACnB;AACH,CAAC,CAAC;AAEF,SAAgB,qBAAqB,CAAC,IAAY,EAAE,cAAwB;IAC1E,IAAI,EAAE,GAAG,CAAC,CAAC;IACX,OAAO,IAAI,KAAK,CACd;QACE,EAAE,EAAE,CAAC,KAAa,EAAE,QAA2B,EAAe,EAAE;YAC9D,MAAM,eAAe,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE;gBAChD,IAAI,SAAS,KAAK,KAAK,EAAE;oBACvB,cAAc,IAAI,OAAO,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;oBACjF,OAAO,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;iBAC1B;YACH,CAAC,CAAC;YACF,mBAAmB,CAAC,EAAE,CAAC,QAAQ,GAAG,IAAI,EAAE,eAAe,CAAC,CAAC;YACzD,OAAO;gBACL,OAAO,EAAE,GAAG,EAAE;oBACZ,mBAAmB,CAAC,cAAc,CAAC,QAAQ,GAAG,IAAI,EAAE,eAAe,CAAC,CAAC;gBACvE,CAAC;aACF,CAAC;QACJ,CAAC;KACF,EACD;QACE,GAAG,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE;YACtB,IAAI,MAAM,KAAK,IAAI,EAAE;gBACnB,OAAO,MAAM,CAAC,MAAM,CAAC,CAAC;aACvB;iBAAM;gBACL,OAAO,KAAK,EAAE,GAAG,IAAS,EAAE,EAAE,CAC5B,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;oBAC9B,MAAM,SAAS,GAAG,EAAE,EAAE,CAAC;oBACvB,mBAAmB,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,CAAC;oBACxE,cAAc,IAAI,OAAO,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;oBACvG,MAAM,QAAQ,GAAG,CAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE;wBAC5C,IAAI,EAAE,KAAK,SAAS,EAAE;4BACpB,mBAAmB,CAAC,cAAc,CAAC,WAAW,GAAG,IAAI,EAAE,QAAQ,CAAC,CAAC;4BACjE,IAAI,KAAK,EAAE;gCACT,MAAM,CAAC,GAAG,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;gCACnC,CAAC,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;gCACtB,MAAM,CAAC,CAAC,CAAC,CAAC;6BACX;iCAAM;gCACL,OAAO,CAAC,MAAM,CAAC,CAAC;6BACjB;4BACD,cAAc;gCACZ,OAAO,CAAC;oCACN,IAAI,EAAE,UAAU;oCAChB,OAAO,EAAE,IAAI;oCACb,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC;oCACtB,SAAS;oCACT,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC;iCACtB,CAAC,CAAC;yBACN;oBACH,CAAC,CAAC;oBACF,mBAAmB,CAAC,EAAE,CAAC,WAAW,GAAG,IAAI,EAAE,QAAQ,CAAC,CAAC;gBACvD,CAAC,CAAC,CAAC;aACN;QACH,CAAC;KACF,CACF,CAAC;AACJ,CAAC;AAvDD,sDAuDC;AAOY,QAAA,WAAW,GAQnB,MAAc,IAAI,EAAE,CAAC;AAE1B,IAAI,OAAO,mBAAmB,KAAK,WAAW,EAAE;IAC9C,mBAAW,CAAC,WAAW,GAAG,mBAAmB,CAAC;CAC/C;AAOY,QAAA,4BAA4B,GAAG,MAAM,CAAC,8BAA8B,CAAC,CAAC;AAEnF,SAAgB,yBAAyB,CAAC,WAAoB;IAC5D,IAAI,MAAM,CAAC;IACX,IAAI,WAAW,EAAE;QACf,MAAM,GAAG,mBAAW,CAAC,mBAAmB,CAAC,WAAW,CAAC,CAAC;KACvD;SAAM;QACL,MAAM,GAAG,mBAAW,CAAC,sBAAsB,EAAE,CAAC;KAC/C;IACD,OAAO,IAAI,gCAAmB,CAAC,MAAM,CAAC,CAAC;AACzC,CAAC;AARD,8DAQC;AAED,SAAgB,kBAAkB,CAAC,MAAc;IAC/C,OAAO,GAAG,MAAM,IAAI,mBAAW,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC;AAC5D,CAAC;AAFD,gDAEC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opensumi/ide-core-browser",
-  "version": "2.27.2",
+  "version": "2.27.3-next-1706077936.0",
   "description": "@opensumi/ide-core-browser",
   "files": [
     "lib",
@@ -18,9 +18,9 @@
     "build": "tsc --build ../../configs/ts/references/tsconfig.core-browser.json"
   },
   "dependencies": {
-    "@opensumi/ide-components": "2.27.2",
-    "@opensumi/ide-connection": "2.27.2",
-    "@opensumi/ide-core-common": "2.27.2",
+    "@opensumi/ide-components": "2.27.3-next-1706077936.0",
+    "@opensumi/ide-connection": "2.27.3-next-1706077936.0",
+    "@opensumi/ide-core-common": "2.27.3-next-1706077936.0",
     "@opensumi/vscode-debugprotocol": "1.49.0-beta.1",
     "@vscode/codicons": "0.0.27",
     "ajv": "^6.10.0",
@@ -29,11 +29,12 @@
     "fuzzy": "^0.1.3",
     "jsonc-parser": "^2.1.0",
     "keycode": "^2.2.0",
-    "lodash": "^4.17.15",
+    "lodash": "^4.17.21",
     "mobx": "^5.9.4",
     "mobx-react-lite": "^1.3.1",
     "onigasm": "2.2.2",
     "rc-menu": "^9.3.2",
+    "react": "^18.0.0",
     "react-autosize-textarea": "^7.0.0",
     "react-ctxmenu-trigger": "^1.0.0",
     "react-custom-scrollbars": "^4.2.1",
@@ -45,10 +46,10 @@
     "vscode-textmate": "7.0.1"
   },
   "devDependencies": {
-    "react": "^16.8.6"
+    "react": "^18.0.0"
   },
   "peerDependencies": {
-    "react": ">=16.8.6"
+    "react": ">=18.0.0"
   },
-  "gitHead": "4e91cc8361995d7de03b5d67f346c5ad74fa0efb"
+  "gitHead": "aee2428fd9fc6117cf124170e2c0eda48a7b62ca"
 }

package/src/bootstrap/app.ts

@@ -6,7 +6,7 @@ import '@opensumi/monaco-editor-core/esm/vs/editor/editor.main';
 import ResizeObserver from 'resize-observer-polyfill';
 
 import { Injector } from '@opensumi/di';
-import { RPCMessageConnection } from '@opensumi/ide-connection';
+import { WSChannel } from '@opensumi/ide-connection';
 import { WSChannelHandler } from '@opensumi/ide-connection/lib/browser';
 import {
   CommandRegistry,
@@ -45,7 +45,6 @@ import {
 } from '@opensumi/ide-core-common/lib/const/application';
 import { IElectronMainLifeCycleService } from '@opensumi/ide-core-common/lib/electron';
 
-import { createElectronClientConnection } from '..';
 import { ClientAppStateService } from '../application';
 import { BrowserModule, IClientApp } from '../browser-module';
 import { ClientAppContribution } from '../common';
@@ -71,7 +70,7 @@ import { electronEnv } from '../utils';
 
 import { IClientAppOpts, IconInfo, IconMap, IPreferences, LayoutConfig, ModuleConstructor } from './app.interface';
 import { renderClientApp, IAppRenderer } from './app.view';
-import { createClientConnection2, bindConnectionService } from './connection';
+import { createClientConnection4Web, createClientConnection4Electron, bindConnectionService } from './connection';
 import { injectInnerProviders } from './inner-providers';
 import { injectElectronInnerProviders } from './inner-providers-electron';
 
@@ -208,35 +207,33 @@ export class ClientApp implements IClientApp, IDisposable {
   public async start(
     container: HTMLElement | IAppRenderer,
     type?: 'electron' | 'web',
-    connection?: RPCMessageConnection,
+    channel?: WSChannel,
   ): Promise<void> {
     const reporterService: IReporterService = this.injector.get(IReporterService);
     const measureReporter = reporterService.time(REPORT_NAME.MEASURE);
 
     this.lifeCycleService.phase = LifeCyclePhase.Prepare;
 
-    if (connection) {
-      await bindConnectionService(this.injector, this.modules, connection);
-    } else {
-      if (type === 'electron') {
-        await bindConnectionService(this.injector, this.modules, createElectronClientConnection());
-      } else if (type === 'web') {
-        await createClientConnection2(
-          this.injector,
-          this.modules,
-          this.connectionPath,
-          () => {
-            this.onReconnectContributions();
-          },
-          this.connectionProtocols,
-          this.config.clientId,
-        );
-
-        this.logger = this.getLogger();
-        // Replace Logger
-        this.injector.get(WSChannelHandler).replaceLogger(this.logger);
-      }
+    if (channel) {
+      await bindConnectionService(this.injector, this.modules, channel);
+    } else if (type === 'electron') {
+      await createClientConnection4Electron(this.injector, this.modules, this.config.clientId);
+    } else if (type === 'web') {
+      await createClientConnection4Web(
+        this.injector,
+        this.modules,
+        this.connectionPath,
+        () => {
+          this.onReconnectContributions();
+        },
+        this.connectionProtocols,
+        this.config.clientId,
+      );
+      this.logger = this.getLogger();
+      // Replace Logger
+      this.injector.get(WSChannelHandler).replaceLogger(this.logger);
     }
+
     measureReporter.timeEnd('ClientApp.createConnection');
 
     this.logger = this.getLogger();
@@ -402,7 +399,6 @@ export class ClientApp implements IClientApp, IDisposable {
     const eventBus = this.injector.get(IEventBus);
     eventBus.fire(new RenderedEvent());
   }
-
   protected async measure<T>(name: string, fn: () => MaybePromise<T>): Promise<T> {
     const reporterService: IReporterService = this.injector.get(IReporterService);
     const measureReporter = reporterService.time(REPORT_NAME.MEASURE);

package/src/bootstrap/app.view.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import ReactDom from 'react-dom';
+import ReactDom from 'react-dom/client';
 
 import { ComponentContextProvider, IIconResourceOptions } from '@opensumi/ide-components';
 import { getDebugLogger, IEventBus, URI, localize } from '@opensumi/ide-core-common';
@@ -14,7 +14,8 @@ import { getIcon } from '../style/icon/icon';
 
 export interface AppProps {
   app: IClientApp;
-  main: React.ComponentType;
+  main: React.ComponentType<{ callback?: () => void }>;
+  callback?: () => void;
   overlays?: React.ComponentType[];
 }
 
@@ -26,6 +27,7 @@ export function App(props: AppProps) {
     (uri: string, options: IIconResourceOptions) => labelService.getIcon(URI.parse(uri), options),
     [],
   );
+
   React.useEffect(() => {
     let lastFrame: number | null;
     const handle = () => {
@@ -47,26 +49,21 @@ export function App(props: AppProps) {
   return (
     <ComponentContextProvider value={{ getIcon, localize, getResourceIcon }}>
       <ConfigProvider value={props.app.config}>
-        {<props.main />}
+        {<props.main callback={props.callback} />}
         {props.overlays && props.overlays.map((Component, index) => <Component key={index} />)}
       </ConfigProvider>
     </ComponentContextProvider>
   );
 }
 
-export type IAppRenderer = (app: React.ReactElement) => Promise<void>;
+export type IAppRenderer = (app: (props: any) => JSX.Element) => void;
 
 const defaultAppRender =
-  (dom: HTMLElement, onDidRendered?: () => void): IAppRenderer =>
-  (app) =>
-    new Promise((resolve) => {
-      ReactDom.render(app, dom, () => {
-        if (onDidRendered && typeof onDidRendered === 'function') {
-          onDidRendered();
-        }
-        resolve();
-      });
-    });
+  (dom: HTMLElement): IAppRenderer =>
+  (IDEApp: (props: any) => JSX.Element) => {
+    const root = ReactDom.createRoot(dom);
+    root.render(<IDEApp />);
+  };
 
 export function renderClientApp(app: IClientApp, container: HTMLElement | IAppRenderer) {
   const Layout = app.config.layoutComponent || DefaultLayout;
@@ -80,9 +77,9 @@ export function renderClientApp(app: IClientApp, container: HTMLElement | IAppRe
       return module.component;
     });
 
-  const IdeApp = <App app={app} main={Layout} overlays={overlayComponents} />;
+  const IdeApp = (props) => <App {...props} app={app} main={Layout} overlays={overlayComponents} />;
 
-  const render = typeof container === 'function' ? container : defaultAppRender(container, app.config.didRendered);
+  const render = typeof container === 'function' ? container : defaultAppRender(container);
 
   return render(IdeApp);
 }

package/src/bootstrap/connection.ts

@@ -1,7 +1,8 @@
 import { Injector, Provider } from '@opensumi/di';
-import { RPCServiceCenter, initRPCService, RPCMessageConnection } from '@opensumi/ide-connection';
+import { RPCServiceCenter, WSChannel, initRPCService } from '@opensumi/ide-connection';
 import { WSChannelHandler } from '@opensumi/ide-connection/lib/browser';
-import { createWebSocketConnection } from '@opensumi/ide-connection/lib/common/message';
+import { NetSocketConnection } from '@opensumi/ide-connection/lib/common/connection';
+import { ReconnectingWebSocketConnection } from '@opensumi/ide-connection/lib/common/connection/drivers/reconnecting-websocket';
 import {
   getDebugLogger,
   IReporterService,
@@ -15,63 +16,104 @@ import {
 import { BackService } from '@opensumi/ide-core-common/lib/module';
 
 import { ClientAppStateService } from '../application';
+import { createNetSocketConnection, fromWindowClientId } from '../utils';
 
 import { ModuleConstructor } from './app.interface';
 
 const initialLogger = getDebugLogger();
 
-export async function createClientConnection2(
+export async function createClientConnection4Web(
   injector: Injector,
   modules: ModuleConstructor[],
   wsPath: UrlProvider,
   onReconnect: () => void,
   protocols?: string[],
   clientId?: string,
+) {
+  return createConnectionService(
+    injector,
+    modules,
+    onReconnect,
+    ReconnectingWebSocketConnection.forURL(wsPath, protocols),
+    clientId,
+  );
+}
+
+export async function createClientConnection4Electron(
+  injector: Injector,
+  modules: ModuleConstructor[],
+  clientId?: string,
+) {
+  const connection = createNetSocketConnection();
+  const channel = WSChannel.forClient(connection, {
+    id: clientId || fromWindowClientId('RPCService'),
+    logger: console,
+  });
+  return bindConnectionService(injector, modules, channel);
+}
+
+export async function createConnectionService(
+  injector: Injector,
+  modules: ModuleConstructor[],
+  onReconnect: () => void,
+  connection: ReconnectingWebSocketConnection | NetSocketConnection,
+  clientId?: string,
 ) {
   const reporterService: IReporterService = injector.get(IReporterService);
   const eventBus = injector.get(IEventBus);
   const stateService = injector.get(ClientAppStateService);
 
-  const wsChannelHandler = new WSChannelHandler(wsPath, initialLogger, protocols, clientId);
-  wsChannelHandler.setReporter(reporterService);
-  wsChannelHandler.connection.addEventListener('open', async () => {
-    await stateService.reachedState('core_module_initialized');
-    eventBus.fire(new BrowserConnectionOpenEvent());
-  });
+  const channelHandler = new WSChannelHandler(connection, initialLogger, clientId);
+  channelHandler.setReporter(reporterService);
+
+  const onOpen = () => {
+    stateService.reachedState('core_module_initialized').then(() => {
+      eventBus.fire(new BrowserConnectionOpenEvent());
+    });
+  };
+
+  if (channelHandler.connection.isOpen()) {
+    onOpen();
+  } else {
+    const dispose = channelHandler.connection.onOpen(() => {
+      onOpen();
+      dispose.dispose();
+    });
+  }
 
-  wsChannelHandler.connection.addEventListener('close', async () => {
-    await stateService.reachedState('core_module_initialized');
-    eventBus.fire(new BrowserConnectionCloseEvent());
+  channelHandler.connection.onceClose(() => {
+    stateService.reachedState('core_module_initialized').then(() => {
+      eventBus.fire(new BrowserConnectionCloseEvent());
+    });
   });
 
-  wsChannelHandler.connection.addEventListener('error', async (e) => {
-    await stateService.reachedState('core_module_initialized');
-    eventBus.fire(new BrowserConnectionErrorEvent(e));
+  channelHandler.connection.onError((e) => {
+    stateService.reachedState('core_module_initialized').then(() => {
+      eventBus.fire(new BrowserConnectionErrorEvent(e));
+    });
   });
 
-  await wsChannelHandler.initHandler();
+  await channelHandler.initHandler();
 
   injector.addProviders({
     token: WSChannelHandler,
-    useValue: wsChannelHandler,
+    useValue: channelHandler,
   });
+
   // 重连不会执行后面的逻辑
-  const channel = await wsChannelHandler.openChannel('RPCService');
-  channel.onReOpen(() => onReconnect());
+  const channel = await channelHandler.openChannel('RPCService');
+  channel.onReopen(() => onReconnect());
 
-  bindConnectionService(injector, modules, createWebSocketConnection(channel));
+  bindConnectionService(injector, modules, channel);
 }
 
-export async function bindConnectionService(
-  injector: Injector,
-  modules: ModuleConstructor[],
-  connection: RPCMessageConnection,
-) {
+export async function bindConnectionService(injector: Injector, modules: ModuleConstructor[], channel: WSChannel) {
   const clientCenter = new RPCServiceCenter();
-  clientCenter.setConnection(connection);
+  const dispose = clientCenter.setChannel(channel);
 
-  connection.onClose(() => {
-    clientCenter.removeConnection(connection);
+  const toRemove = channel.onClose(() => {
+    dispose.dispose();
+    toRemove();
   });
 
   const { getRPCService } = initRPCService(clientCenter);
@@ -85,6 +127,9 @@ export async function bindConnectionService(
     if (moduleInstance.backServices) {
       for (const backService of moduleInstance.backServices) {
         backServiceArr.push(backService);
+        if (backService.protocol) {
+          clientCenter.loadProtocol(backService.protocol);
+        }
       }
     }
   }

package/src/common/common.module.ts

@@ -1,4 +1,5 @@
 import { Injectable, Provider } from '@opensumi/di';
+import { CommonServerProtocol } from '@opensumi/ide-connection/lib/common/protocols/common-server';
 import { CommonServerPath, CryptoServicePath, KeytarServicePath } from '@opensumi/ide-core-common';
 
 import { AuthenticationContribution } from '../authentication/authentication.contribution';
@@ -29,6 +30,7 @@ export class ClientCommonModule extends BrowserModule {
   backServices = [
     {
       servicePath: CommonServerPath,
+      protocol: CommonServerProtocol,
     },
     {
       servicePath: KeytarServicePath,

package/src/components/layout/box-panel.tsx

@@ -1,6 +1,9 @@
 import clsx from 'classnames';
 import React from 'react';
 
+import { useInjectable } from '../../react-hooks';
+import { AppConfig } from '../../react-providers';
+
 import { Layout } from './layout';
 import styles from './styles.module.less';
 
@@ -56,9 +59,15 @@ export const BoxPanel: React.FC<{
 }> = ({ className, children = [], direction = 'left-to-right', ...restProps }) => {
   // convert children to list
   const arrayChildren = React.Children.toArray(children) as ChildComponent[];
+  const appConfig = useInjectable<AppConfig>(AppConfig);
 
   return (
     <div
+      ref={() => {
+        if (appConfig.didRendered) {
+          appConfig.didRendered();
+        }
+      }}
       {...restProps}
       className={clsx(styles['box-panel'], className)}
       style={{ flexDirection: Layout.getFlexDirection(direction), zIndex: restProps['z-index'] }}

package/src/components/layout/split-panel.tsx

@@ -112,7 +112,6 @@ export const SplitPanel: React.FC<SplitPanelProps> = ({
     () => childList.reduce((accumulator, item) => accumulator + getProp(item, 'flex', 1), 0),
     [childList],
   );
-
   const resizeDelegates = React.useRef<IResizeHandleDelegate[]>([]);
   const eventBus = useInjectable<IEventBus>(IEventBus);
   const rootRef = React.useRef<HTMLElement>();

package/src/components/portal/index.tsx

@@ -5,6 +5,7 @@ import { usePortal } from '../../react-hooks';
 
 const Portal: React.FC<{
   id: string;
+  children: React.ReactChild;
 }> = ({ id, children }) => {
   const target = usePortal(id);
   return ReactDOM.createPortal(children, target);

package/src/markdown/index.tsx

@@ -5,7 +5,11 @@ import { createMarkedRenderer, toMarkdownHtml as toHtml, IMarkedOptions } from '
 
 import { IOpenerService } from '../opener';
 
-export const toMarkdown = (message: string | React.ReactNode, opener?: IOpenerService, options?: IMarkedOptions): React.ReactNode =>
+export const toMarkdown = (
+  message: string | React.ReactNode,
+  opener?: IOpenerService,
+  options?: IMarkedOptions,
+): React.ReactNode =>
   typeof message === 'string' ? (
     <RenderWrapper opener={opener} html={toMarkdownHtml(message, options)}></RenderWrapper>
   ) : (

package/src/progress/progress-indicator.ts

@@ -45,7 +45,7 @@ export class ProgressIndicator implements IProgressIndicator {
     this.doDone(false);
   }
 
-  private scheduled: NodeJS.Timer;
+  private scheduled: NodeJS.Timeout;
   private showOnceScheduler(delay?: number) {
     if (typeof delay === 'number') {
       clearTimeout(this.scheduled);

package/src/react-providers/slot.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { PropsWithChildren } from 'react';
 
 import { Button } from '@opensumi/ide-components';
 import { getDebugLogger, localize } from '@opensumi/ide-core-common';
@@ -59,7 +59,7 @@ export function getTabbarCtxKey(location: string): TabbarContextKeys {
   return standardTabbarCtxKeys[location] || 'activeExtendViewlet';
 }
 
-export class ErrorBoundary extends React.Component {
+export class ErrorBoundary extends React.Component<PropsWithChildren<any>> {
   state = { error: null, errorInfo: null };
 
   componentDidCatch(error, errorInfo) {
@@ -96,7 +96,12 @@ export class ErrorBoundary extends React.Component {
 
 export const allSlot: { slot: string; dom: HTMLElement }[] = [];
 
-export const SlotDecorator: React.FC<{ slot: string; backgroundColor?: string }> = ({ slot, ...props }) => {
+export const SlotDecorator: React.FC<{
+  slot: string;
+  color?: string;
+  children: React.ReactChild;
+  backgroundColor?: string;
+}> = ({ slot, ...props }) => {
   const ref = React.useRef<HTMLElement | null>();
   React.useEffect(() => {
     if (ref.current) {

package/src/toolbar/components/button.tsx

@@ -1,6 +1,7 @@
 import classnames from 'classnames';
-import React from 'react';
+import React, { PropsWithChildren } from 'react';
 import ReactDOM from 'react-dom';
+import ReactDOMClient from 'react-dom/client';
 
 import { Injectable, Autowired } from '@opensumi/di';
 import { Button } from '@opensumi/ide-components';
@@ -218,7 +219,7 @@ export class ToolbarActionBtnClickEvent extends BasicEvent<{
 
 const popOverMap = new Map<string, Promise<HTMLDivElement>>();
 
-const PopOverComponentWrapper: React.FC<{ delegate: IToolbarActionBtnDelegate }> = (props) => {
+const PopOverComponentWrapper: React.FC<PropsWithChildren<{ delegate: IToolbarActionBtnDelegate }>> = (props) => {
   const [context, setContext] = React.useState();
 
   React.useEffect(() => {
@@ -338,17 +339,14 @@ class ToolbarBtnDelegate implements IToolbarActionBtnDelegate {
       this._popOverElement = new Promise((resolve) => {
         const div = document.createElement('div');
         const C = this.popoverComponent!;
-        ReactDOM.render(
+        ReactDOMClient.createRoot(div).render(
           <ConfigProvider value={this.context}>
             <PopOverComponentWrapper delegate={this}>
               <C />
             </PopOverComponentWrapper>
           </ConfigProvider>,
-          div,
-          () => {
-            resolve(div);
-          },
         );
+        resolve(div);
       });
       popOverMap.set(this.actionId, this._popOverElement);
     }

package/src/toolbar/toolbar.tsx

@@ -1,7 +1,7 @@
 import classnames from 'classnames';
 import throttle from 'lodash/throttle';
 import React from 'react';
-import ReactDOM from 'react-dom';
+import ReactDOM from 'react-dom/client';
 
 import { IEventBus, Disposable, Emitter } from '@opensumi/ide-core-common';
 
@@ -638,7 +638,7 @@ class ToolbarActionRenderer {
             element.classList.add(...this.resolvedToolbarAction.extraClassNames);
           }
           let setInDropDown: (inDropDown: boolean) => void | undefined;
-          ReactDOM.render(
+          ReactDOM.createRoot(element).render(
             <ToolbarActionRenderWrapper
               initialInDropDown={inDropDown}
               action={this.toolbarAction}
@@ -651,23 +651,20 @@ class ToolbarActionRenderer {
               }}
               location={location}
             />,
-            element,
-            () => {
-              if (canceled) {
-                reject('canceled render toolbar');
-              } else {
-                this.reactElement = {
-                  element,
-                  setInDropDown: (inDropdown: boolean) => {
-                    if (setInDropDown) {
-                      setInDropDown(inDropdown);
-                    }
-                  },
-                };
-                resolve(element);
-              }
-            },
           );
+          if (canceled) {
+            reject('canceled render toolbar');
+          } else {
+            this.reactElement = {
+              element,
+              setInDropDown: (inDropdown: boolean) => {
+                if (setInDropDown) {
+                  setInDropDown(inDropdown);
+                }
+              },
+            };
+            resolve(element);
+          }
         }
       }).then((resolved) => {
         this.renderPromise.resolved = resolved;