@opensumi/ide-editor 2.27.3-rc-1708399099.0 → 2.27.3-rc-1710489030.0

package/src/browser/index.ts

@@ -1,9 +1,9 @@
-import { Injectable, Provider, Autowired, Injector, INJECTOR_TOKEN } from '@opensumi/di';
+import { Autowired, INJECTOR_TOKEN, Injectable, Injector, Provider } from '@opensumi/di';
 import {
   BrowserModule,
-  Domain,
   ClientAppContribution,
   ContributionProvider,
+  Domain,
   PreferenceService,
   createPreferenceProxy,
 } from '@opensumi/ide-core-browser';
@@ -16,21 +16,22 @@ import {
 import { ITextmateTokenizer } from '@opensumi/ide-monaco/lib/browser/contrib/tokenizer';
 import { ITypeHierarchyService } from '@opensumi/ide-monaco/lib/browser/contrib/typeHierarchy';
 
-import { EditorCollectionService, WorkbenchEditorService, ResourceService, ILanguageService } from '../common';
+import { EditorCollectionService, ILanguageService, ResourceService, WorkbenchEditorService } from '../common';
 import { IDocPersistentCacheProvider } from '../common/doc-cache';
 
 import { BreadCrumbServiceImpl } from './breadcrumb';
 import { EditorComponentRegistryImpl } from './component';
 import { DefaultDiffEditorContribution } from './diff';
-import { CompareService, CompareEditorContribution } from './diff/compare';
+import { CompareEditorContribution, CompareService } from './diff/compare';
 import { EmptyDocCacheImpl } from './doc-cache';
 import { EditorDocumentModelContentRegistryImpl, EditorDocumentModelServiceImpl } from './doc-model/main';
 import { SaveParticipantsContribution } from './doc-model/saveParticipants';
 import { IEditorDocumentModelContentRegistry, IEditorDocumentModelService } from './doc-model/types';
 import { EditorCollectionServiceImpl } from './editor-collection.service';
 import { EditorElectronContribution } from './editor-electron.contribution';
-import { EditorContribution, EditorAutoSaveEditorContribution } from './editor.contribution';
+import { EditorAutoSaveEditorContribution, EditorContribution } from './editor.contribution';
 import { EditorDecorationCollectionService } from './editor.decoration.service';
+import { EditorTabService } from './editor.tab.service';
 import { EditorFeatureRegistryImpl } from './feature';
 import { FileSystemResourceContribution } from './fs-resource';
 import { LanguageStatusContribution } from './language/language-status.contribution';
@@ -42,8 +43,8 @@ import { MergeEditorContribution } from './merge-editor/merge-editor.contributio
 import {
   CallHierarchyContribution,
   CallHierarchyService,
-  TypeHierarchyService,
   TypeHierarchyContribution,
+  TypeHierarchyService,
 } from './monaco-contrib';
 import {
   MonacoActionRegistry,
@@ -55,21 +56,22 @@ import { EditorPreferenceContribution } from './preference/contribution';
 import { EditorPreferences, editorPreferenceSchema } from './preference/schema';
 import { ResourceServiceImpl } from './resource.service';
 import {
-  EditorComponentRegistry,
   BrowserEditorContribution,
-  IEditorDecorationCollectionService,
-  IEditorActionRegistry,
-  ICompareService,
+  EditorComponentRegistry,
   IBreadCrumbService,
+  ICompareService,
+  IEditorActionRegistry,
+  IEditorDecorationCollectionService,
   IEditorFeatureRegistry,
+  IEditorTabService,
   ILanguageStatusService,
 } from './types';
 import { WorkbenchEditorServiceImpl } from './workbench-editor.service';
-export * from './preference/schema';
-export * from './types';
-export * from './doc-model/types';
 export * from './doc-cache';
+export * from './doc-model/types';
 export * from './editor.less';
+export * from './preference/schema';
+export * from './types';
 export * from './view/editor.react';
 
 @Injectable()
@@ -163,6 +165,10 @@ export class EditorModule extends BrowserModule {
       token: ILanguageStatusService,
       useClass: LanguageStatusService,
     },
+    {
+      token: IEditorTabService,
+      useClass: EditorTabService,
+    },
     EditorPreferenceContribution,
     DefaultDiffEditorContribution,
     MergeEditorContribution,

package/src/browser/language/diagnostic-collection.ts

@@ -4,10 +4,10 @@ import IMonacoModel = monaco.editor.IModel;
 import IMonacoMarkerData = monaco.editor.IMarkerData;
 
 // eslint-disable-next-line import/order
-import { DisposableCollection, Disposable, IDisposable } from '@opensumi/ide-core-common';
+import { Disposable, DisposableCollection, IDisposable } from '@opensumi/ide-core-common';
 
 // eslint-disable-next-line import/order
-import { DiagnosticCollection, Diagnostic, asMonacoDiagnostics } from '../../common';
+import { Diagnostic, DiagnosticCollection, asMonacoDiagnostics } from '../../common';
 
 export class MonacoDiagnosticCollection implements DiagnosticCollection {
   protected readonly diagnostics = new Map<string, MonacoModelDiagnostics | undefined>();

package/src/browser/language/language-status.contribution.ts

@@ -3,13 +3,13 @@ import {
   ClientAppContribution,
   Domain,
   IStatusBarService,
-  localize,
   Severity,
   StatusBarAlignment,
   WithEventBus,
+  localize,
 } from '@opensumi/ide-core-browser';
 
-import { WorkbenchEditorService, IEditor, ILanguageStatusService, ILanguageStatus } from '../../common';
+import { IEditor, ILanguageStatus, ILanguageStatusService, WorkbenchEditorService } from '../../common';
 import { EditorDocumentModelOptionChangedEvent } from '../doc-model/types';
 
 @Domain(ClientAppContribution)

package/src/browser/language/language-status.service.ts

@@ -1,9 +1,9 @@
 import { Injectable } from '@opensumi/di';
-import { strings, Event, IDisposable } from '@opensumi/ide-core-common';
+import { Event, IDisposable, strings } from '@opensumi/ide-core-common';
 import { LanguageFeatureRegistry } from '@opensumi/monaco-editor-core/esm/vs/editor/common/languageFeatureRegistry';
 import { ITextModel } from '@opensumi/monaco-editor-core/esm/vs/editor/common/model';
 
-import { ILanguageStatusService, ILanguageStatus } from '../../common';
+import { ILanguageStatus, ILanguageStatusService } from '../../common';
 
 const { compare } = strings;
 

package/src/browser/language/language.service.ts

@@ -1,23 +1,23 @@
 import { Autowired, Injectable } from '@opensumi/di';
 import {
-  URI,
-  IDisposable,
   Disposable,
-  MarkerManager,
+  IDisposable,
   IMarkerData,
   IRelatedInformation,
+  MarkerManager,
   MarkerSeverity,
+  URI,
 } from '@opensumi/ide-core-common';
 import { ITextmateTokenizer, ITextmateTokenizerService } from '@opensumi/ide-monaco/lib/browser/contrib/tokenizer';
 import * as monaco from '@opensumi/monaco-editor-core/esm/vs/editor/editor.api';
 
 import {
-  DiagnosticSeverity,
-  DiagnosticRelatedInformation,
   Diagnostic,
+  DiagnosticRelatedInformation,
+  DiagnosticSeverity,
+  ILanguageService,
   Language,
   WorkspaceSymbolProvider,
-  ILanguageService,
 } from '../../common';
 
 import { MonacoDiagnosticCollection } from './diagnostic-collection';

package/src/browser/menu/breadcrumbs.menus.ts

@@ -1,9 +1,5 @@
-import { Injectable, Autowired } from '@opensumi/di';
-import {
-  AbstractContextMenuService,
-  ICtxMenuRenderer,
-  MenuId,
-} from '@opensumi/ide-core-browser/lib/menu/next';
+import { Autowired, Injectable } from '@opensumi/di';
+import { AbstractContextMenuService, ICtxMenuRenderer, MenuId } from '@opensumi/ide-core-browser/lib/menu/next';
 import { URI } from '@opensumi/ide-core-common';
 
 import { EditorGroup } from '../workbench-editor.service';

package/src/browser/menu/editor.context.ts

@@ -1,5 +1,5 @@
 import { Disposable, IContextKeyService } from '@opensumi/ide-core-browser';
-import { AbstractContextMenuService, MenuId, ICtxMenuRenderer } from '@opensumi/ide-core-browser/lib/menu/next';
+import { AbstractContextMenuService, ICtxMenuRenderer, MenuId } from '@opensumi/ide-core-browser/lib/menu/next';
 import { ICodeEditor } from '@opensumi/ide-monaco/lib/common/types';
 import * as dom from '@opensumi/monaco-editor-core/esm/vs/base/browser/dom';
 import { IAnchor } from '@opensumi/monaco-editor-core/esm/vs/base/browser/ui/contextview/contextview';

package/src/browser/menu/editor.menu.ts

@@ -1,6 +1,6 @@
-import { Injectable, Autowired } from '@opensumi/di';
-import { IDisposable, Disposable, IContextKeyService, ILogger } from '@opensumi/ide-core-browser';
-import { MenuId, AbstractContextMenuService, IContextMenu } from '@opensumi/ide-core-browser/lib/menu/next';
+import { Autowired, Injectable } from '@opensumi/di';
+import { Disposable, IContextKeyService, IDisposable, ILogger } from '@opensumi/ide-core-browser';
+import { AbstractContextMenuService, IContextMenu, MenuId } from '@opensumi/ide-core-browser/lib/menu/next';
 
 import { IEditorGroup } from '../../common';
 import { IEditorActionRegistry } from '../types';

package/src/browser/menu/open-type-menu.contribution.ts

@@ -1,12 +1,12 @@
 import { Autowired } from '@opensumi/di';
 import { getIcon } from '@opensumi/ide-core-browser';
 import {
+  IMenuItem,
   IMenuRegistry,
   ISubmenuItem,
-  MenuId,
-  MenuContribution,
-  IMenuItem,
   MenuCommandDesc,
+  MenuContribution,
+  MenuId,
 } from '@opensumi/ide-core-browser/lib/menu/next';
 import { Command, CommandContribution, CommandRegistry, Disposable, localize } from '@opensumi/ide-core-common';
 import { Domain } from '@opensumi/ide-core-common/lib/di-helper';

package/src/browser/menu/title-context.menu.ts

@@ -1,4 +1,4 @@
-import { Injectable, Autowired } from '@opensumi/di';
+import { Autowired, Injectable } from '@opensumi/di';
 import { IContextKeyService } from '@opensumi/ide-core-browser';
 import { ResourceContextKey } from '@opensumi/ide-core-browser/lib/contextkey/resource';
 import { AbstractContextMenuService, ICtxMenuRenderer, MenuId } from '@opensumi/ide-core-browser/lib/menu/next';

package/src/browser/merge-editor/MergeEditorFloatComponents.tsx

@@ -1,8 +1,14 @@
 import React, { useCallback } from 'react';
 
 import { Button } from '@opensumi/ide-components';
-import { CommandRegistry, CommandService, SCM_COMMANDS, URI, localize } from '@opensumi/ide-core-browser';
-import { useInjectable } from '@opensumi/ide-core-browser';
+import {
+  CommandRegistry,
+  CommandService,
+  SCM_COMMANDS,
+  URI,
+  localize,
+  useInjectable,
+} from '@opensumi/ide-core-browser';
 
 import styles from '../editor.module.less';
 import { ReactEditorComponent } from '../types';

package/src/browser/merge-editor/merge-editor.provider.ts

@@ -1,8 +1,8 @@
-import { Injectable, Autowired } from '@opensumi/di';
-import { URI, WithEventBus, MaybePromise, LabelService } from '@opensumi/ide-core-browser';
+import { Autowired, Injectable } from '@opensumi/di';
+import { LabelService, MaybePromise, URI, WithEventBus } from '@opensumi/ide-core-browser';
 import { MergeEditorService } from '@opensumi/ide-monaco/lib/browser/contrib/merge-editor/merge-editor.service';
 
-import { IResourceProvider, IResource } from '../../common';
+import { IResource, IResourceProvider } from '../../common';
 
 @Injectable()
 export class MergeEditorResourceProvider extends WithEventBus implements IResourceProvider {

package/src/browser/monaco-contrib/callHierarchy/callHierarchy.contribution.ts

@@ -1,11 +1,11 @@
 import { Autowired } from '@opensumi/di';
 import {
-  Domain,
   CommandContribution,
   CommandRegistry,
+  Domain,
   Event,
-  IContextKeyService,
   IContextKey,
+  IContextKeyService,
   Uri,
 } from '@opensumi/ide-core-browser';
 import { RawContextKey } from '@opensumi/ide-core-browser/lib/raw-context-key';

package/src/browser/monaco-contrib/callHierarchy/callHierarchy.service.ts

@@ -1,13 +1,13 @@
-import { Injectable, Autowired } from '@opensumi/di';
+import { Autowired, Injectable } from '@opensumi/di';
 import {
   CancellationToken,
   IDisposable,
   IPosition,
-  arrays,
   RefCountedDisposable,
-  onUnexpectedExternalError,
   URI,
   Uri,
+  arrays,
+  onUnexpectedExternalError,
 } from '@opensumi/ide-core-common';
 import {
   CallHierarchyItem,

package/src/browser/monaco-contrib/command/command.service.ts

@@ -1,29 +1,29 @@
-import { Injectable, Autowired } from '@opensumi/di';
+import { Autowired, Injectable } from '@opensumi/di';
 import {
   Command,
-  Emitter,
-  CommandRegistry,
   CommandHandler,
+  CommandRegistry,
+  CommandService,
+  EDITOR_COMMANDS,
+  Emitter,
   HANDLER_NOT_FOUND,
   ILogger,
-  EDITOR_COMMANDS,
-  CommandService,
   IReporterService,
+  MonacoOverrideServiceRegistry,
   REPORT_NAME,
   ServiceNames,
-  memoize,
   Uri,
-  MonacoOverrideServiceRegistry,
+  memoize,
 } from '@opensumi/ide-core-browser';
 import { DELEGATE_COMMANDS } from '@opensumi/ide-monaco';
 import {
-  CommandsRegistry as MonacoCommandsRegistry,
   EditorExtensionsRegistry,
   ICommandEvent,
   ICommandService,
   IMonacoActionRegistry,
   IMonacoCommandService,
   IMonacoCommandsRegistry,
+  CommandsRegistry as MonacoCommandsRegistry,
   MonacoEditorCommandHandler,
 } from '@opensumi/ide-monaco/lib/browser/contrib/command';
 import { URI } from '@opensumi/ide-monaco/lib/browser/monaco-api';
@@ -205,7 +205,7 @@ export class MonacoCommandRegistry implements IMonacoCommandsRegistry {
    * 获取当前活动的编辑器
    * 此处的活动编辑器和 workbenchEditorService.currentEditor 的概念不同，对于diffEditor，需要获取确实的那个editor而不是modifiedEditor
    */
-  protected getActiveCodeEditor(): ICodeEditor | undefined {
+  public getActiveCodeEditor(): ICodeEditor | undefined {
     // 先从 monaco 内部获取到当前 focus 的 editor
     const editor = this.codeEditorService?.getFocusedCodeEditor();
     if (editor) {
@@ -290,7 +290,7 @@ export class MonacoActionRegistry implements IMonacoActionRegistry {
 
   registerMonacoActions() {
     const editorActions = new Map(
-      this.monacoEditorRegistry.getEditorActions().map(({ id, label, alias }) => [
+      Array.from(this.monacoEditorRegistry.getEditorActions()).map(({ id, label, alias }) => [
         id,
         {
           label,

package/src/browser/monaco-contrib/tokenizer/textmate-registry.ts

@@ -14,12 +14,12 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
- // Some code copied and modified from https://github.com/eclipse-theia/theia/tree/v1.14.0/packages/monaco/src/browser/textmate/textmate-registry.ts
+// Some code copied and modified from https://github.com/eclipse-theia/theia/tree/v1.14.0/packages/monaco/src/browser/textmate/textmate-registry.ts
 
 import { IGrammarConfiguration } from 'vscode-textmate';
 
 import { Injectable } from '@opensumi/di';
-import { getDebugLogger, URI } from '@opensumi/ide-core-common';
+import { URI, getDebugLogger } from '@opensumi/ide-core-common';
 
 import { TokenizerOption } from './textmate-tokenizer';
 

package/src/browser/monaco-contrib/tokenizer/textmate-tokenizer.ts

@@ -1,4 +1,4 @@
-import { INITIAL, StackElement, IGrammar } from 'vscode-textmate';
+import { IGrammar, INITIAL, StackElement } from 'vscode-textmate';
 
 import { Disposable, Emitter, Event } from '@opensumi/ide-core-common/lib/utils';
 import {

package/src/browser/monaco-contrib/tokenizer/textmate.service.ts

@@ -1,26 +1,26 @@
-import { OnigScanner, loadWASM, OnigString } from 'vscode-oniguruma';
+import { OnigScanner, OnigString, loadWASM } from 'vscode-oniguruma';
 import {
-  Registry,
-  IRawGrammar,
-  IOnigLib,
-  parseRawGrammar,
   IEmbeddedLanguagesMap,
-  ITokenTypeMap,
   INITIAL,
+  IOnigLib,
+  IRawGrammar,
+  ITokenTypeMap,
+  Registry,
+  parseRawGrammar,
 } from 'vscode-textmate';
 
-import { Injectable, Autowired } from '@opensumi/di';
+import { Autowired, Injectable } from '@opensumi/di';
 import {
-  WithEventBus,
-  parseWithComments,
-  PreferenceService,
-  ILogger,
+  AppConfig,
   ExtensionActivateEvent,
-  getDebugLogger,
+  ILogger,
+  PreferenceService,
+  WithEventBus,
   electronEnv,
-  AppConfig,
+  getDebugLogger,
+  parseWithComments,
 } from '@opensumi/ide-core-browser';
-import { URI, Disposable, isObject } from '@opensumi/ide-core-common';
+import { Disposable, URI, isObject } from '@opensumi/ide-core-common';
 import { IFileServiceClient } from '@opensumi/ide-file-service/lib/common';
 import {
   GrammarsContribution,
@@ -40,17 +40,19 @@ import {
 import {
   CommentRule,
   IIndentationRule,
+  IRegExp,
   IndentAction,
   IndentationRuleDto,
-  IRegExp,
   LanguageConfigurationDto,
   LanguagesContribution,
 } from '@opensumi/ide-monaco/lib/common';
 import { IThemeData } from '@opensumi/ide-theme';
 import { ThemeChangedEvent } from '@opensumi/ide-theme/lib/common/event';
 import { asStringArray } from '@opensumi/ide-utils/lib/arrays';
-import { ILanguageExtensionPoint } from '@opensumi/monaco-editor-core/esm/vs/editor/common/languages/language';
-import { ILanguageService } from '@opensumi/monaco-editor-core/esm/vs/editor/common/languages/language';
+import {
+  ILanguageExtensionPoint,
+  ILanguageService,
+} from '@opensumi/monaco-editor-core/esm/vs/editor/common/languages/language';
 import { StandaloneServices } from '@opensumi/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
 
 import { IEditorDocumentModelService } from '../../doc-model/types';

package/src/browser/monaco-contrib/typeHierarchy/typeHierarchy.contribution.ts

@@ -1,18 +1,18 @@
 import { Autowired } from '@opensumi/di';
 import {
-  Domain,
   CommandContribution,
   CommandRegistry,
+  Domain,
   Event,
-  IContextKeyService,
   IContextKey,
+  IContextKeyService,
   Uri,
 } from '@opensumi/ide-core-browser';
 import { RawContextKey } from '@opensumi/ide-core-browser/lib/raw-context-key';
 import {
   ITypeHierarchyService,
-  TypeHierarchyProviderRegistry,
   TypeHierarchyItem,
+  TypeHierarchyProviderRegistry,
 } from '@opensumi/ide-monaco/lib/browser/contrib/typeHierarchy';
 import { Position } from '@opensumi/monaco-editor-core/esm/vs/editor/common/core/position';
 

package/src/browser/monaco-contrib/typeHierarchy/typeHierarchy.service.ts

@@ -1,17 +1,17 @@
-import { Injectable, Autowired } from '@opensumi/di';
+import { Autowired, Injectable } from '@opensumi/di';
 import {
   CancellationToken,
-  IPosition,
   IDisposable,
-  arrays,
+  IPosition,
   RefCountedDisposable,
-  onUnexpectedExternalError,
   URI,
   Uri,
+  arrays,
+  onUnexpectedExternalError,
 } from '@opensumi/ide-core-common';
 import {
-  TypeHierarchyItem,
   ITypeHierarchyService,
+  TypeHierarchyItem,
   TypeHierarchyProvider,
   TypeHierarchyProviderRegistry,
 } from '@opensumi/ide-monaco/lib/browser/contrib/typeHierarchy';

package/src/browser/navigation.view.tsx

@@ -1,22 +1,29 @@
 import cls from 'classnames';
-import { observable, makeObservable, action } from 'mobx';
+import { action, makeObservable, observable } from 'mobx';
 import { observer } from 'mobx-react-lite';
-import React, { useCallback, useEffect, useRef, memo } from 'react';
+import React, { memo, useCallback, useEffect, useRef } from 'react';
 
 import { Injectable } from '@opensumi/di';
-import { Icon } from '@opensumi/ide-components';
-import { Scrollbars } from '@opensumi/ide-components';
-import { useInjectable, DomListener, Disposable, useUpdateOnEvent } from '@opensumi/ide-core-browser';
-import { getIcon } from '@opensumi/ide-core-browser';
+import { Icon, Scrollbars } from '@opensumi/ide-components';
+import {
+  Disposable,
+  DomListener,
+  getIcon,
+  useDesignStyles,
+  useInjectable,
+  useUpdateOnEvent,
+} from '@opensumi/ide-core-browser';
 
 import { BreadCrumbsMenuService } from './menu/breadcrumbs.menus';
 import styles from './navigation.module.less';
-import { IBreadCrumbService, IBreadCrumbPart } from './types';
+import { IBreadCrumbPart, IBreadCrumbService } from './types';
 import { useUpdateOnGroupTabChange } from './view/react-hook';
 import { EditorGroup } from './workbench-editor.service';
 
 export const NavigationBar = ({ editorGroup }: { editorGroup: EditorGroup }) => {
-  const breadCrumbService = useInjectable(IBreadCrumbService) as IBreadCrumbService;
+  const breadCrumbService = useInjectable<IBreadCrumbService>(IBreadCrumbService);
+  const styles_navigation_container = useDesignStyles(styles.navigation_container);
+  const styles_navigation_icon = useDesignStyles(styles.navigation_icon);
 
   useUpdateOnGroupTabChange(editorGroup);
 
@@ -49,14 +56,14 @@ export const NavigationBar = ({ editorGroup }: { editorGroup: EditorGroup }) =>
   }
   return parts.length === 0 ? null : (
     <div
-      className={styles.navigation_container}
+      className={styles_navigation_container}
       onContextMenu={(event) => {
         event.preventDefault();
       }}
     >
       {parts.map((p, i) => (
         <React.Fragment key={i + '-crumb:' + p.name}>
-          {i > 0 && <Icon icon={'right'} size='small' className={styles.navigation_icon} />}
+          {i > 0 && <Icon icon={'right'} size='small' className={styles_navigation_icon} />}
           <NavigationItem part={p} editorGroup={editorGroup} />
         </React.Fragment>
       ))}
@@ -64,9 +71,10 @@ export const NavigationBar = ({ editorGroup }: { editorGroup: EditorGroup }) =>
   );
 };
 export const NavigationItem = memo(({ part, editorGroup }: { part: IBreadCrumbPart; editorGroup: EditorGroup }) => {
-  const viewService = useInjectable(NavigationBarViewService) as NavigationBarViewService;
-  const breadcrumbsMenuService = useInjectable(BreadCrumbsMenuService) as BreadCrumbsMenuService;
+  const viewService = useInjectable<NavigationBarViewService>(NavigationBarViewService);
+  const breadcrumbsMenuService = useInjectable<BreadCrumbsMenuService>(BreadCrumbsMenuService);
   const itemRef = useRef<HTMLSpanElement>();
+  const styles_navigation_part = useDesignStyles(styles['navigation-part']);
 
   const onClick = useCallback(async () => {
     if (part.getSiblings && itemRef.current) {
@@ -90,7 +98,7 @@ export const NavigationItem = memo(({ part, editorGroup }: { part: IBreadCrumbPa
         }
         event.preventDefault();
       }}
-      className={styles['navigation-part']}
+      className={styles_navigation_part}
       ref={itemRef as any}
     >
       {part.icon && <span className={part.icon}></span>}
@@ -109,7 +117,8 @@ export const NavigationMenu = observer(({ model }: { model: NavigationMenuModel
   }
 
   const scrollerContainer = useRef<HTMLDivElement | null>();
-
+  const styles_navigation_menu = useDesignStyles(styles.navigation_menu);
+  const styles_navigation_menu_item = useDesignStyles(styles.navigation_menu_item);
   const viewService = useInjectable(NavigationBarViewService) as NavigationBarViewService;
 
   const scrollToCurrent = useCallback(() => {
@@ -127,7 +136,7 @@ export const NavigationMenu = observer(({ model }: { model: NavigationMenuModel
 
   return (
     <div
-      className={styles.navigation_menu}
+      className={styles_navigation_menu}
       style={{
         left: model.x + 'px',
         top: top + 'px',
@@ -170,7 +179,7 @@ export const NavigationMenu = observer(({ model }: { model: NavigationMenuModel
             <div
               onClick={clickToNavigate || clickToGetChild}
               ref={(el) => (itemRef = el)}
-              className={cls(styles.navigation_menu_item, {
+              className={cls(styles_navigation_menu_item, {
                 [styles.navigation_menu_item_current]: i === model.initialIndex,
               })}
               key={'menu-' + p.name}

package/src/browser/preference/contribution.ts

@@ -1,4 +1,4 @@
-import { PreferenceContribution, Domain } from '@opensumi/ide-core-browser';
+import { Domain, PreferenceContribution } from '@opensumi/ide-core-browser';
 
 import { editorPreferenceSchema } from './schema';
 

package/src/browser/preference/converter.ts

@@ -1,4 +1,4 @@
-import { objects, Uri } from '@opensumi/ide-core-browser';
+import { Uri, objects } from '@opensumi/ide-core-browser';
 import * as monaco from '@opensumi/monaco-editor-core/esm/vs/editor/editor.api';
 import { IConfigurationService } from '@opensumi/monaco-editor-core/esm/vs/platform/configuration/common/configuration';
 
@@ -728,6 +728,25 @@ export const editorOptionsConverters: Map<KaitianPreferenceKey, NoConverter | IM
    * Controls whether characters are highlighted that can be confused with basic ASCII characters
    */
   ['editor.unicodeHighlight', { monaco: 'unicodeHighlight' }],
+
+  /**
+   * Suggest options.
+   */
+  [
+    'editor.inlineSuggest.showToolbar',
+    {
+      monaco: 'inlineSuggest',
+      convert: (value) => {
+        if (value) {
+          return {
+            showToolbar: value,
+          };
+        } else {
+          return undefined;
+        }
+      },
+    },
+  ],
 ]);
 
 export const textModelUpdateOptionsConverters: Map<KaitianPreferenceKey, NoConverter | IMonacoOptionsConverter> =