monaco-languageclient-examples 2025.8.3 → 2025.8.4

package/src/appPlayground/config.ts

@@ -10,6 +10,7 @@ import { InMemoryFileSystemProvider, registerFileSystemOverlay, type IFileWriteO
 import getKeybindingsServiceOverride from '@codingame/monaco-vscode-keybindings-service-override';
 import getLifecycleServiceOverride from '@codingame/monaco-vscode-lifecycle-service-override';
 import getLocalizationServiceOverride from '@codingame/monaco-vscode-localization-service-override';
+import getOutlineServiceOverride from '@codingame/monaco-vscode-outline-service-override';
 import getRemoteAgentServiceOverride from '@codingame/monaco-vscode-remote-agent-service-override';
 import getSearchServiceOverride from '@codingame/monaco-vscode-search-service-override';
 import getSecretStorageServiceOverride from '@codingame/monaco-vscode-secret-storage-service-override';
@@ -17,7 +18,6 @@ import getStorageServiceOverride from '@codingame/monaco-vscode-storage-service-
 import getBannerServiceOverride from '@codingame/monaco-vscode-view-banner-service-override';
 import getStatusBarServiceOverride from '@codingame/monaco-vscode-view-status-bar-service-override';
 import getTitleBarServiceOverride from '@codingame/monaco-vscode-view-title-bar-service-override';
-import getOutlineServiceOverride from '@codingame/monaco-vscode-outline-service-override';
 import * as vscode from 'vscode';
 
 // this is required syntax highlighting
@@ -27,16 +27,17 @@ import '@codingame/monaco-vscode-typescript-language-features-default-extension'
 
 import '../../resources/vsix/open-collaboration-tools.vsix';
 
-import type { WrapperConfig } from 'monaco-editor-wrapper';
-import { defaultHtmlAugmentationInstructions, defaultViewsInit } from 'monaco-editor-wrapper/vscode/services';
-import { configureDefaultWorkerFactory } from 'monaco-editor-wrapper/workers/workerLoaders';
-import { createDefaultLocaleConfiguration } from 'monaco-languageclient/vscode/services';
+import { defaultHtmlAugmentationInstructions, defaultViewsInit, type MonacoVscodeApiConfig } from 'monaco-languageclient/vscodeApiWrapper';
+import type { EditorAppConfig } from 'monaco-languageclient/editorApp';
+import { createDefaultLocaleConfiguration } from 'monaco-languageclient/vscodeApiLocales';
+import { configureDefaultWorkerFactory } from 'monaco-languageclient/workerFactory';
 import helloTsCode from '../../resources/appPlayground/hello.ts?raw';
 import testerTsCode from '../../resources/appPlayground/tester.ts?raw';
 import { createDefaultWorkspaceContent } from '../common/client/utils.js';
 
 export type ConfigResult = {
-    wrapperConfig: WrapperConfig
+    vscodeApiConfig: MonacoVscodeApiConfig;
+    editorAppConfig: EditorAppConfig
     workspaceFileUri: vscode.Uri;
     helloTsUri: vscode.Uri;
     testerTsUri: vscode.Uri;
@@ -45,69 +46,65 @@ export type ConfigResult = {
 export const configure = async (htmlContainer?: HTMLElement): Promise<ConfigResult> => {
     const workspaceFileUri = vscode.Uri.file('/workspace.code-workspace');
 
-    const wrapperConfig: WrapperConfig = {
+    const vscodeApiConfig: MonacoVscodeApiConfig = {
         $type: 'extended',
-        id: 'AAP',
         logLevel: LogLevel.Debug,
         htmlContainer,
-        vscodeApiConfig: {
-            serviceOverrides: {
-                ...getKeybindingsServiceOverride(),
-                ...getLifecycleServiceOverride(),
-                ...getLocalizationServiceOverride(createDefaultLocaleConfiguration()),
-                ...getBannerServiceOverride(),
-                ...getStatusBarServiceOverride(),
-                ...getTitleBarServiceOverride(),
-                ...getExplorerServiceOverride(),
-                ...getRemoteAgentServiceOverride(),
-                ...getEnvironmentServiceOverride(),
-                ...getSecretStorageServiceOverride(),
-                ...getStorageServiceOverride(),
-                ...getSearchServiceOverride(),
-                ...getOutlineServiceOverride()
-            },
-            enableExtHostWorker: true,
-            viewsConfig: {
-                viewServiceType: 'ViewsService',
-                htmlAugmentationInstructions: defaultHtmlAugmentationInstructions,
-                viewsInitFunc: defaultViewsInit
+        serviceOverrides: {
+            ...getKeybindingsServiceOverride(),
+            ...getLifecycleServiceOverride(),
+            ...getLocalizationServiceOverride(createDefaultLocaleConfiguration()),
+            ...getBannerServiceOverride(),
+            ...getStatusBarServiceOverride(),
+            ...getTitleBarServiceOverride(),
+            ...getExplorerServiceOverride(),
+            ...getRemoteAgentServiceOverride(),
+            ...getEnvironmentServiceOverride(),
+            ...getSecretStorageServiceOverride(),
+            ...getStorageServiceOverride(),
+            ...getSearchServiceOverride(),
+            ...getOutlineServiceOverride()
+        },
+        viewsConfig: {
+            viewServiceType: 'ViewsService',
+            htmlAugmentationInstructions: defaultHtmlAugmentationInstructions,
+            viewsInitFunc: defaultViewsInit
+        },
+        workspaceConfig: {
+            enableWorkspaceTrust: true,
+            windowIndicator: {
+                label: 'mlc-app-playground',
+                tooltip: '',
+                command: ''
             },
-            workspaceConfig: {
-                enableWorkspaceTrust: true,
-                windowIndicator: {
-                    label: 'mlc-app-playground',
-                    tooltip: '',
-                    command: ''
-                },
-                workspaceProvider: {
-                    trusted: true,
-                    async open() {
-                        window.open(window.location.href);
-                        return true;
-                    },
-                    workspace: {
-                        workspaceUri: workspaceFileUri
-                    }
+            workspaceProvider: {
+                trusted: true,
+                async open() {
+                    window.open(window.location.href);
+                    return true;
                 },
-                configurationDefaults: {
-                    'window.title': 'mlc-app-playground${separator}${dirty}${activeEditorShort}'
-                },
-                productConfiguration: {
-                    nameShort: 'mlc-app-playground',
-                    nameLong: 'mlc-app-playground'
+                workspace: {
+                    workspaceUri: workspaceFileUri
                 }
             },
-            userConfiguration: {
-                json: JSON.stringify({
-                    'workbench.colorTheme': 'Default Dark Modern',
-                    'editor.wordBasedSuggestions': 'off',
-                    'typescript.tsserver.web.projectWideIntellisense.enabled': true,
-                    'typescript.tsserver.web.projectWideIntellisense.suppressSemanticErrors': false,
-                    'editor.guides.bracketPairsHorizontal': true,
-                    'oct.serverUrl': 'https://api.open-collab.tools/',
-                    'editor.experimental.asyncTokenization': false
-                })
+            configurationDefaults: {
+                'window.title': 'mlc-app-playground${separator}${dirty}${activeEditorShort}'
             },
+            productConfiguration: {
+                nameShort: 'mlc-app-playground',
+                nameLong: 'mlc-app-playground'
+            }
+        },
+        userConfiguration: {
+            json: JSON.stringify({
+                'workbench.colorTheme': 'Default Dark Modern',
+                'editor.wordBasedSuggestions': 'off',
+                'typescript.tsserver.web.projectWideIntellisense.enabled': true,
+                'typescript.tsserver.web.projectWideIntellisense.suppressSemanticErrors': false,
+                'editor.guides.bracketPairsHorizontal': true,
+                'oct.serverUrl': 'https://api.open-collab.tools/',
+                'editor.experimental.asyncTokenization': false
+            })
         },
         extensions: [{
             config: {
@@ -119,9 +116,15 @@ export const configure = async (htmlContainer?: HTMLElement): Promise<ConfigResu
                 }
             }
         }],
-        editorAppConfig: {
-            monacoWorkerFactory: configureDefaultWorkerFactory
-        }
+        advanced: {
+            enableExtHostWorker: true,
+        },
+        monacoWorkerFactory: configureDefaultWorkerFactory
+    };
+
+    const editorAppConfig: EditorAppConfig = {
+        $type: vscodeApiConfig.$type,
+        id: 'AAP',
     };
 
     const workspaceUri = vscode.Uri.file('/workspace');
@@ -143,7 +146,8 @@ export const configure = async (htmlContainer?: HTMLElement): Promise<ConfigResu
     registerFileSystemOverlay(1, fileSystemProvider);
 
     return {
-        wrapperConfig,
+        vscodeApiConfig,
+        editorAppConfig,
         workspaceFileUri,
         helloTsUri,
         testerTsUri

package/src/appPlayground/launcher.ts

@@ -3,7 +3,8 @@
  * Licensed under the MIT License. See LICENSE in the package root for license information.
  * ------------------------------------------------------------------------------------------ */
 
-import { initLocaleLoader } from 'monaco-editor-wrapper/vscode/locale';
+import { initLocaleLoader } from 'monaco-languageclient/vscodeApiLocales';
+
 await initLocaleLoader();
 
 const { runApplicationPlayground } = await import('./main.js');

package/src/appPlayground/main.ts

@@ -3,16 +3,19 @@
  * Licensed under the MIT License. See LICENSE in the package root for license information.
  * ------------------------------------------------------------------------------------------ */
 
-import { MonacoEditorLanguageClientWrapper } from 'monaco-editor-wrapper';
 import { configure } from './config.js';
 import { configurePostStart } from './common.js';
 import { disableElement } from '../common/client/utils.js';
-
-const wrapper = new MonacoEditorLanguageClientWrapper();
+import { MonacoVscodeApiWrapper } from 'monaco-languageclient/vscodeApiWrapper';
 
 export const runApplicationPlayground = async () => {
     disableElement('button-start', true);
+
     const configResult = await configure(document.body);
-    await wrapper.init(configResult.wrapperConfig);
-    await configurePostStart(wrapper, configResult);
+
+    // perform global init
+    const apiWrapper = new MonacoVscodeApiWrapper(configResult.vscodeApiConfig);
+    await apiWrapper.init();
+
+    await configurePostStart(apiWrapper, configResult);
 };

package/src/appPlayground/reactLauncher.ts

@@ -3,7 +3,8 @@
  * Licensed under the MIT License. See LICENSE in the package root for license information.
  * ------------------------------------------------------------------------------------------ */
 
-import { initLocaleLoader } from 'monaco-editor-wrapper/vscode/locale';
+import { initLocaleLoader } from 'monaco-languageclient/vscodeApiLocales';
+
 await initLocaleLoader();
 
 const { runApplicationPlaygroundReact } = await import('./reactMain.js');

package/src/appPlayground/reactMain.tsx

@@ -5,7 +5,6 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom/client';
-import { MonacoEditorLanguageClientWrapper } from 'monaco-editor-wrapper';
 import { MonacoEditorReactComp } from '@typefox/monaco-editor-react';
 import { configure } from './config.js';
 import { configurePostStart } from './common.js';
@@ -18,9 +17,10 @@ export const runApplicationPlaygroundReact = async () => {
         return (
             <div style={{ 'backgroundColor': '#1f1f1f' }}>
                 <MonacoEditorReactComp
-                    wrapperConfig={configResult.wrapperConfig}
-                    onLoad={async (wrapper: MonacoEditorLanguageClientWrapper) => {
-                        await configurePostStart(wrapper, configResult);
+                    vscodeApiConfig={configResult.vscodeApiConfig}
+                    editorAppConfig={configResult.editorAppConfig}
+                    onVscodeApiInitDone={async (apiWrapper) => {
+                        await configurePostStart(apiWrapper, configResult);
                     }}
                     onError={(e) => {
                         console.error(e);

package/src/bare/client.ts

@@ -3,22 +3,22 @@
  * Licensed under the MIT License. See License.txt in the project root for license information.
  * ------------------------------------------------------------------------------------------ */
 
+import { LogLevel } from '@codingame/monaco-vscode-api';
 import * as monaco from '@codingame/monaco-vscode-editor-api';
-import { initServices } from 'monaco-languageclient/vscode/services';
 import getTextmateServiceOverride from '@codingame/monaco-vscode-textmate-service-override';
 import getThemeServiceOverride from '@codingame/monaco-vscode-theme-service-override';
-import { LogLevel } from '@codingame/monaco-vscode-api';
+import { MonacoVscodeApiWrapper, type MonacoVscodeApiConfig } from 'monaco-languageclient/vscodeApiWrapper';
 // monaco-editor does not supply json highlighting with the json worker,
 // that's why we use the textmate extension from VSCode
 import '@codingame/monaco-vscode-json-default-extension';
-import { ConsoleLogger } from 'monaco-languageclient/tools';
-import { configureDefaultWorkerFactory } from 'monaco-editor-wrapper/workers/workerLoaders';
-import { LanguageClientWrapper, type LanguageClientConfig } from 'monaco-editor-wrapper';
+import { configureDefaultWorkerFactory } from 'monaco-languageclient/workerFactory';
+import { LanguageClientWrapper, type LanguageClientConfig } from 'monaco-languageclient/lcwrapper';
 
 export const runClient = async () => {
-    const logger = new ConsoleLogger(LogLevel.Debug);
     const htmlContainer = document.getElementById('monaco-editor-root')!;
-    await initServices({
+    const vscodeApiConfig: MonacoVscodeApiConfig = {
+        $type: 'classic',
+        logLevel: LogLevel.Debug,
         serviceOverrides: {
             ...getTextmateServiceOverride(),
             ...getThemeServiceOverride()
@@ -28,9 +28,11 @@ export const runClient = async () => {
                 'editor.experimental.asyncTokenization': true
             })
         },
-    }, {
-        logger
-    });
+        monacoWorkerFactory: configureDefaultWorkerFactory
+    };
+
+    const apiWrapper = new MonacoVscodeApiWrapper(vscodeApiConfig);
+    await apiWrapper.init();
 
     // register the JSON language with Monaco
     monaco.languages.register({
@@ -40,8 +42,6 @@ export const runClient = async () => {
         mimetypes: ['application/json']
     });
 
-    configureDefaultWorkerFactory(logger);
-
     // create monaco editor
     monaco.editor.create(htmlContainer, {
         value: `{
@@ -64,10 +64,9 @@ export const runClient = async () => {
             }
         }
     };
-    const languageClientWrapper = new LanguageClientWrapper({
+    const languageClientWrapper = new LanguageClientWrapper(
         languageClientConfig,
-        logger
-    });
-
+        apiWrapper.getLogger()
+    );
     await languageClientWrapper.start();
 };

package/src/browser/main.ts

@@ -11,8 +11,9 @@ import { getLanguageService, TextDocument } from 'vscode-json-languageservice';
 import { createConverter as createCodeConverter } from 'vscode-languageclient/lib/common/codeConverter.js';
 import { createConverter as createProtocolConverter } from 'vscode-languageclient/lib/common/protocolConverter.js';
 import { LogLevel } from '@codingame/monaco-vscode-api';
-import { MonacoEditorLanguageClientWrapper, type WrapperConfig } from 'monaco-editor-wrapper';
-import { configureDefaultWorkerFactory } from 'monaco-editor-wrapper/workers/workerLoaders';
+import { EditorApp, type EditorAppConfig } from 'monaco-languageclient/editorApp';
+import { configureDefaultWorkerFactory } from 'monaco-languageclient/workerFactory';
+import { MonacoVscodeApiWrapper, type MonacoVscodeApiConfig } from 'monaco-languageclient/vscodeApiWrapper';
 
 export const runBrowserEditor = async () => {
     const codeConverter = createCodeConverter();
@@ -27,35 +28,36 @@ export const runBrowserEditor = async () => {
 }`;
     const codeUri = '/workspace/model.json';
 
-    const wrapper = new MonacoEditorLanguageClientWrapper();
-    const jsonClientUserConfig: WrapperConfig = {
+    const vscodeApiConfig: MonacoVscodeApiConfig = {
         $type: 'extended',
         htmlContainer,
         logLevel: LogLevel.Debug,
-        vscodeApiConfig: {
-            serviceOverrides: {
-                ...getKeybindingsServiceOverride(),
-            },
-            userConfiguration: {
-                json: JSON.stringify({
-                    'workbench.colorTheme': 'Default Dark Modern',
-                    'editor.guides.bracketPairsHorizontal': 'active',
-                    'editor.lightbulb.enabled': 'On',
-                    'editor.experimental.asyncTokenization': true
-                })
-            }
+        serviceOverrides: {
+            ...getKeybindingsServiceOverride(),
+        },
+        userConfiguration: {
+            json: JSON.stringify({
+                'workbench.colorTheme': 'Default Dark Modern',
+                'editor.guides.bracketPairsHorizontal': 'active',
+                'editor.lightbulb.enabled': 'On',
+                'editor.experimental.asyncTokenization': true
+            })
         },
-        editorAppConfig: {
-            codeResources: {
-                modified: {
-                    text: code,
-                    uri: codeUri
-                }
-            },
-            monacoWorkerFactory: configureDefaultWorkerFactory
+        monacoWorkerFactory: configureDefaultWorkerFactory
+    };
+    const editorAppConfig: EditorAppConfig = {
+        $type: vscodeApiConfig.$type,
+        codeResources: {
+            modified: {
+                text: code,
+                uri: codeUri
+            }
         }
     };
-    await wrapper.init(jsonClientUserConfig);
+    const apiWrapper = new MonacoVscodeApiWrapper(vscodeApiConfig);
+    await apiWrapper.init();
+
+    const editorApp = new EditorApp(editorAppConfig);
 
     vscode.workspace.onDidOpenTextDocument((_event) => {
         mainVscodeDocument = _event;
@@ -155,9 +157,9 @@ export const runBrowserEditor = async () => {
         diagnosticCollection.clear();
     };
 
-    await wrapper.start();
+    await editorApp.start(htmlContainer);
 
-    wrapper.getTextModels()?.modified?.onDidChangeContent(() => {
+    editorApp.getTextModels().modified?.onDidChangeContent(() => {
         validate();
     });
 };

package/src/clangd/client/config.ts

@@ -3,113 +3,91 @@
  * Licensed under the MIT License. See LICENSE in the package root for license information.
  * ------------------------------------------------------------------------------------------ */
 
-import { Uri } from 'vscode';
+import { LogLevel } from '@codingame/monaco-vscode-api';
+import getEnvironmentServiceOverride from '@codingame/monaco-vscode-environment-service-override';
+import getExplorerServiceOverride from '@codingame/monaco-vscode-explorer-service-override';
 import getKeybindingsServiceOverride from '@codingame/monaco-vscode-keybindings-service-override';
 import getLifecycleServiceOverride from '@codingame/monaco-vscode-lifecycle-service-override';
+import getRemoteAgentServiceOverride from '@codingame/monaco-vscode-remote-agent-service-override';
+import getSecretStorageServiceOverride from '@codingame/monaco-vscode-secret-storage-service-override';
 import getBannerServiceOverride from '@codingame/monaco-vscode-view-banner-service-override';
 import getStatusBarServiceOverride from '@codingame/monaco-vscode-view-status-bar-service-override';
 import getTitleBarServiceOverride from '@codingame/monaco-vscode-view-title-bar-service-override';
-import getExplorerServiceOverride from '@codingame/monaco-vscode-explorer-service-override';
-import getRemoteAgentServiceOverride from '@codingame/monaco-vscode-remote-agent-service-override';
-import getEnvironmentServiceOverride from '@codingame/monaco-vscode-environment-service-override';
-import getSecretStorageServiceOverride from '@codingame/monaco-vscode-secret-storage-service-override';
-import { LogLevel } from '@codingame/monaco-vscode-api';
-import type { WrapperConfig } from 'monaco-editor-wrapper';
-import { configureDefaultWorkerFactory } from 'monaco-editor-wrapper/workers/workerLoaders';
-import { defaultHtmlAugmentationInstructions, defaultViewsInit } from 'monaco-editor-wrapper/vscode/services';
+import type { EditorAppConfig } from 'monaco-languageclient/editorApp';
+import type { LanguageClientConfig } from 'monaco-languageclient/lcwrapper';
+import { defaultHtmlAugmentationInstructions, defaultViewsInit, type MonacoVscodeApiConfig } from 'monaco-languageclient/vscodeApiWrapper';
+import { configureDefaultWorkerFactory } from 'monaco-languageclient/workerFactory';
+import { Uri } from 'vscode';
 import { ClangdWorkerHandler } from './workerHandler.js';
 
-export const createWrapperConfig = async (config: {
+export type ClangdAppConfig = {
+    languageClientConfig: LanguageClientConfig;
+    vscodeApiConfig: MonacoVscodeApiConfig;
+    editorAppConfig: EditorAppConfig;
+}
+
+export const createClangdAppConfig = async (config: {
     htmlContainer: HTMLElement,
     workspaceUri: Uri,
     workspaceFileUri: Uri,
     clangdWorkerHandler: ClangdWorkerHandler,
     lsMessageLocalPort: MessagePort
-}): Promise<WrapperConfig> => {
-    return {
+}): Promise<ClangdAppConfig> => {
+    const vscodeApiConfig: MonacoVscodeApiConfig = {
         $type: 'extended',
         htmlContainer: config.htmlContainer,
         logLevel: LogLevel.Debug,
-        languageClientConfigs: {
-            configs: {
-                LANGUAGE_ID: {
-                    name: 'Clangd WASM Language Server',
-                    connection: {
-                        options: {
-                            $type: 'WorkerDirect',
-                            worker: await config.clangdWorkerHandler.createWorker(),
-                            messagePort: config.lsMessageLocalPort
-                        }
-                    },
-                    restartOptions: {
-                        retries: 5,
-                        timeout: 1000,
-                        keepWorker: true
-                    },
-                    clientOptions: {
-                        documentSelector: ['cpp'],
-                        workspaceFolder: {
-                            index: 0,
-                            name: 'workspace',
-                            uri: config.workspaceUri
-                        }
-                    }
-                }
-            }
+        serviceOverrides: {
+            ...getKeybindingsServiceOverride(),
+            ...getLifecycleServiceOverride(),
+            ...getBannerServiceOverride(),
+            ...getStatusBarServiceOverride(),
+            ...getTitleBarServiceOverride(),
+            ...getExplorerServiceOverride(),
+            ...getRemoteAgentServiceOverride(),
+            ...getEnvironmentServiceOverride(),
+            ...getSecretStorageServiceOverride()
         },
-        vscodeApiConfig: {
-            serviceOverrides: {
-                ...getKeybindingsServiceOverride(),
-                ...getLifecycleServiceOverride(),
-                ...getBannerServiceOverride(),
-                ...getStatusBarServiceOverride(),
-                ...getTitleBarServiceOverride(),
-                ...getExplorerServiceOverride(),
-                ...getRemoteAgentServiceOverride(),
-                ...getEnvironmentServiceOverride(),
-                ...getSecretStorageServiceOverride()
-            },
-            viewsConfig: {
-                viewServiceType: 'ViewsService',
-                htmlAugmentationInstructions: defaultHtmlAugmentationInstructions,
-                viewsInitFunc: defaultViewsInit
+        viewsConfig: {
+            viewServiceType: 'ViewsService',
+            htmlAugmentationInstructions: defaultHtmlAugmentationInstructions,
+            viewsInitFunc: defaultViewsInit
+        },
+        workspaceConfig: {
+            enableWorkspaceTrust: true,
+            windowIndicator: {
+                label: 'mlc-clangd-example',
+                tooltip: '',
+                command: ''
             },
-            workspaceConfig: {
-                enableWorkspaceTrust: true,
-                windowIndicator: {
-                    label: 'mlc-clangd-example',
-                    tooltip: '',
-                    command: ''
-                },
-                workspaceProvider: {
-                    trusted: true,
-                    async open() {
-                        window.open(window.location.href);
-                        return true;
-                    },
-                    workspace: {
-                        workspaceUri: config.workspaceFileUri
-                    },
+            workspaceProvider: {
+                trusted: true,
+                async open() {
+                    window.open(window.location.href);
+                    return true;
                 },
-                configurationDefaults: {
-                    'window.title': 'mlc-clangd-exampled${separator}${dirty}${activeEditorShort}'
+                workspace: {
+                    workspaceUri: config.workspaceFileUri
                 },
-                productConfiguration: {
-                    nameShort: 'mlc-clangd-example',
-                    nameLong: 'mlc-clangd-example'
-                }
             },
-            userConfiguration: {
-                json: JSON.stringify({
-                    'workbench.colorTheme': 'Default Dark Modern',
-                    'editor.wordBasedSuggestions': 'off',
-                    'editor.guides.bracketPairsHorizontal': true,
-                    'editor.inlayHints.enabled': 'offUnlessPressed',
-                    'editor.quickSuggestionsDelay': 200,
-                    'editor.experimental.asyncTokenization': false
-                })
+            configurationDefaults: {
+                'window.title': 'mlc-clangd-exampled${separator}${dirty}${activeEditorShort}'
+            },
+            productConfiguration: {
+                nameShort: 'mlc-clangd-example',
+                nameLong: 'mlc-clangd-example'
             }
         },
+        userConfiguration: {
+            json: JSON.stringify({
+                'workbench.colorTheme': 'Default Dark Modern',
+                'editor.wordBasedSuggestions': 'off',
+                'editor.guides.bracketPairsHorizontal': true,
+                'editor.inlayHints.enabled': 'offUnlessPressed',
+                'editor.quickSuggestionsDelay': 200,
+                'editor.experimental.asyncTokenization': false
+            })
+        },
         extensions: [{
             config: {
                 name: 'mlc-clangd-example',
@@ -120,8 +98,40 @@ export const createWrapperConfig = async (config: {
                 }
             }
         }],
-        editorAppConfig: {
-            monacoWorkerFactory: configureDefaultWorkerFactory
+        monacoWorkerFactory: configureDefaultWorkerFactory
+    };
+
+    const languageClientConfig: LanguageClientConfig = {
+        name: 'Clangd WASM Language Server',
+        connection: {
+            options: {
+                $type: 'WorkerDirect',
+                worker: await config.clangdWorkerHandler.createWorker(),
+                messagePort: config.lsMessageLocalPort
+            }
+        },
+        restartOptions: {
+            retries: 5,
+            timeout: 1000,
+            keepWorker: true
+        },
+        clientOptions: {
+            documentSelector: ['cpp'],
+            workspaceFolder: {
+                index: 0,
+                name: 'workspace',
+                uri: config.workspaceUri
+            }
         }
     };
+
+    const editorAppConfig: EditorAppConfig = {
+        $type: vscodeApiConfig.$type
+    };
+
+    return {
+        vscodeApiConfig,
+        languageClientConfig,
+        editorAppConfig
+    };
 };