@difizen/libro-cofine-editor-core 0.1.2

package/src/editor-handler-registry.ts

@@ -0,0 +1,47 @@
+import { EditorHandlerContribution } from '@difizen/libro-cofine-editor-contribution';
+import type { Contribution } from '@difizen/mana-app';
+import { contrib, singleton } from '@difizen/mana-app';
+import * as monaco from '@difizen/monaco-editor-core';
+
+@singleton()
+export class EditorHanlerRegistry {
+  contributions: EditorHandlerContribution[];
+  effected: EditorHandlerContribution[] = [];
+  provider: Contribution.Provider<EditorHandlerContribution>;
+  constructor(
+    @contrib(EditorHandlerContribution)
+    provider: Contribution.Provider<EditorHandlerContribution>,
+  ) {
+    this.provider = provider;
+    this.contributions = provider.getContributions();
+  }
+
+  handleAfter(
+    languege: string,
+    editor: monaco.editor.IStandaloneCodeEditor | monaco.editor.IStandaloneDiffEditor,
+  ): void {
+    this.effected.forEach((contribution) => contribution.dispose());
+    this.effected = [];
+    this.contributions = this.provider.getContributions({ cache: false });
+    const canHanleList = this.contributions.filter((handler) =>
+      handler.canHandle(languege),
+    );
+    canHanleList.forEach((contribution) => {
+      contribution.afterCreate(editor, monaco);
+      this.effected.push(contribution);
+    });
+  }
+
+  handleBefore(languege: string): void {
+    this.contributions = this.provider.getContributions({ cache: false });
+    this.effected.forEach((contribution) => contribution.dispose());
+    this.effected = [];
+    const canHanleList = this.contributions.filter((handler) =>
+      handler.canHandle(languege),
+    );
+    canHanleList.forEach((contribution) => {
+      contribution.beforeCreate(monaco);
+      this.effected.push(contribution);
+    });
+  }
+}

package/src/editor-provider.ts

@@ -0,0 +1,29 @@
+import type monaco from '@difizen/monaco-editor-core';
+
+import type { E2Editor } from './e2-editor.js';
+
+export const EditorProvider = Symbol('EditorProvider');
+export type Options = monaco.editor.IStandaloneEditorConstructionOptions &
+  monaco.editor.IDiffEditorConstructionOptions & {
+    modified?: string;
+    original?: string;
+  } & {
+    uri?: monaco.Uri;
+  };
+
+export interface EditorProvider {
+  create: (
+    node: HTMLElement,
+    options: Options,
+    callback?: LazyCallbackType,
+  ) => E2Editor<monaco.editor.IStandaloneCodeEditor>;
+  createDiff: (
+    node: HTMLElement,
+    options: Options,
+    callback?: LazyCallbackType,
+  ) => E2Editor<monaco.editor.IStandaloneDiffEditor>;
+}
+
+export type LazyCallbackType = (
+  editor: monaco.editor.IStandaloneCodeEditor | monaco.editor.IStandaloneDiffEditor,
+) => void;

package/src/editor.worker.ts

@@ -0,0 +1,25 @@
+import { SimpleWorkerServer } from '@difizen/monaco-editor-core/esm/vs/base/common/worker/simpleWorker.js';
+import { EditorSimpleWorker } from '@difizen/monaco-editor-core/esm/vs/editor/common/services/editorSimpleWorker.js';
+
+let initialized = false;
+export function initialize(foreignModule: any) {
+  if (initialized) {
+    return;
+  }
+  initialized = true;
+  const simpleWorker = new SimpleWorkerServer(
+    (msg: string) => {
+      globalThis.postMessage(msg);
+    },
+    (host: string) => new EditorSimpleWorker(host, foreignModule),
+  );
+  globalThis.onmessage = (e) => {
+    simpleWorker.onmessage(e.data);
+  };
+}
+globalThis.onmessage = (e) => {
+  // Ignore first message in this case and initialize if not yet initialized
+  if (!initialized) {
+    initialize(null);
+  }
+};

package/src/global.d.ts

@@ -0,0 +1,7 @@
+declare module '@difizen/monaco-editor-core/esm/vs/base/common/worker/simpleWorker.js';
+declare module '@difizen/monaco-editor-core/esm/vs/editor/common/services/editorSimpleWorker.js';
+declare module '*.json';
+interface Window {
+  _Monaco: any;
+  MonacoEnvironment: any;
+}

package/src/index.spec.ts

@@ -0,0 +1,8 @@
+import 'reflect-metadata';
+import assert from 'assert';
+
+describe('libro-cofine-editor-core', () => {
+  it('#import', () => {
+    assert(true);
+  });
+});

package/src/index.ts

@@ -0,0 +1,46 @@
+import type monaco from '@difizen/monaco-editor-core';
+
+import type { E2Editor } from './e2-editor.js';
+import { EditorProvider } from './editor-provider.js';
+import { MonacoEnvironment } from './monaco-environment.js';
+
+export {
+  EditorHandlerContribution,
+  LanguageOptionsRegistry,
+  LanguageWorkerContribution,
+  LanguageWorkerRegistry,
+} from '@difizen/libro-cofine-editor-contribution';
+export type { E2Editor } from './e2-editor.js';
+export { EditorHanlerRegistry } from './editor-handler-registry.js';
+export { EditorProvider } from './editor-provider.js';
+export { InitializeContribution } from './initialize-provider.js';
+export { MonacoEnvironment } from './monaco-environment.js';
+export { MonacoLoaderConfig } from './monaco-loader.js';
+export {
+  SnippetSuggestContribution,
+  SnippetSuggestRegistry,
+} from './snippets-suggest-registry.js';
+export {
+  MixedThemeRegistry,
+  ThemeContribution,
+  ThemeRegistry,
+} from './theme-registry.js';
+export type {
+  MixedTheme,
+  ITextmateThemeSetting,
+  IRawThemeSetting,
+  IRawTheme,
+} from './theme-registry.js';
+export class Editor {
+  editor: E2Editor<monaco.editor.IStandaloneCodeEditor>;
+  codeEditor: monaco.editor.IStandaloneCodeEditor;
+  constructor(
+    node: HTMLElement,
+    options: monaco.editor.IStandaloneEditorConstructionOptions = {},
+  ) {
+    const editorProvider =
+      MonacoEnvironment.container.get<EditorProvider>(EditorProvider);
+    this.editor = editorProvider.create(node, options);
+    this.codeEditor = this.editor.codeEditor;
+  }
+}

package/src/initialize-provider.ts

@@ -0,0 +1,54 @@
+import type { Contribution } from '@difizen/mana-app';
+import {
+  contrib,
+  DefaultContributionProvider,
+  singleton,
+  Syringe,
+} from '@difizen/mana-app';
+import type monaco from '@difizen/monaco-editor-core';
+
+export const InitializeContribution = Syringe.defineToken('InitializeContribution');
+export interface InitializeContribution {
+  initialized?: boolean;
+  onInitialize?: (coreMonaco: typeof monaco) => void | Promise<void>;
+  awaysInitialized?: boolean;
+}
+@singleton()
+export class InitializeProvider {
+  provider: Contribution.Provider<InitializeContribution>;
+  constructor(
+    @contrib(InitializeContribution)
+    provider: Contribution.Provider<InitializeContribution>,
+  ) {
+    this.provider = provider;
+  }
+
+  async initialize(coreMonaco: typeof monaco): Promise<void> {
+    const contributions = this.provider.getContributions({ cache: false });
+    for (const contribution of contributions) {
+      if (contribution.onInitialize) {
+        try {
+          if (!contribution.initialized) {
+            const inited = contribution.onInitialize(coreMonaco);
+            if (inited) {
+              // eslint-disable-next-line no-await-in-loop
+              await inited;
+            }
+            if (!contribution.awaysInitialized) {
+              contribution.initialized = true;
+            }
+          }
+        } catch (error) {
+          // noop
+        }
+      }
+    }
+  }
+}
+
+export class InitializeContributionProvider extends DefaultContributionProvider<InitializeContribution> {
+  override getContributions() {
+    this.services = undefined;
+    return super.getContributions();
+  }
+}

package/src/mana-export.ts

@@ -0,0 +1,8 @@
+import type { Container } from '@difizen/mana-app';
+
+import { MonacoEnvironment } from './monaco-environment.js';
+
+export default async (container: Container): Promise<void> => {
+  MonacoEnvironment.setContainer(container);
+  await MonacoEnvironment.init();
+};

package/src/monaco-compability.esm.ts

@@ -0,0 +1,4 @@
+import * as monaco from '@difizen/monaco-editor-core';
+
+export default monaco;
+export const { Emitter, MarkerSeverity, Range, Uri, editor, languages } = monaco || {};

package/src/monaco-environment.ts

@@ -0,0 +1,115 @@
+import {
+  LanguageWorkerRegistry,
+  LazyLoaderRegistry,
+} from '@difizen/libro-cofine-editor-contribution';
+import type { Syringe } from '@difizen/mana-app';
+import { Deferred } from '@difizen/mana-app';
+import { GlobalContainer } from '@difizen/mana-app';
+import * as monaco from '@difizen/monaco-editor-core';
+
+import { InitializeProvider } from './initialize-provider.js';
+import {
+  DefaultLoaderConfig,
+  MonacoLoader,
+  MonacoLoaderConfig,
+} from './monaco-loader.js';
+import BaseModule from './monaco-module.js';
+
+export const MonacoEnvironmentBound = 'MonacoEnvironmentBound';
+
+export type ModuleLoader = (container: Syringe.Container) => void;
+type InitType = {
+  lazy: boolean;
+  cdnUrl?: string;
+};
+export class MonacoEnvironment {
+  static container: Syringe.Container;
+  static loaders: ModuleLoader[] = [];
+  static preLoaders: ModuleLoader[] = [];
+  static monaco: typeof monaco;
+  protected static loader?: MonacoLoader;
+  protected static moduleLoadStart = false;
+  protected static moduleInitDeferred: Deferred<void> = new Deferred<void>();
+  protected static baseModule?: Syringe.Module;
+  static lazy = false;
+
+  static setContainer = (container: Syringe.Container) => {
+    MonacoEnvironment.container = container;
+    if (!container.isBound(MonacoEnvironmentBound)) {
+      container.register(MonacoEnvironmentBound, { useValue: true });
+      MonacoEnvironment.container.register(MonacoLoaderConfig, {
+        useValue: DefaultLoaderConfig,
+      });
+      container.register(MonacoLoader);
+    }
+  };
+  static async load(cdnUrl?: string) {
+    if (!MonacoEnvironment.container) {
+      MonacoEnvironment.setContainer(GlobalContainer);
+    }
+    if (!MonacoEnvironment.loader) {
+      MonacoEnvironment.loader = MonacoEnvironment.container.get(MonacoLoader);
+    }
+    await MonacoEnvironment.loader.load(cdnUrl);
+  }
+  static async init(
+    { lazy, cdnUrl }: InitType | undefined = { lazy: false, cdnUrl: '' },
+  ): Promise<void> {
+    if (!MonacoEnvironment.monaco) {
+      await MonacoEnvironment.load(cdnUrl!);
+    }
+    window.MonacoEnvironment = {
+      getWorkerUrl: (moduleId: string, label: string) => {
+        const workerRegistry = MonacoEnvironment.container.get(LanguageWorkerRegistry);
+        return workerRegistry.getLanguageWorker(label, moduleId);
+      },
+    };
+    try {
+      if (!MonacoEnvironment.baseModule) {
+        MonacoEnvironment.baseModule = BaseModule;
+        MonacoEnvironment.container.load(MonacoEnvironment.baseModule);
+      }
+      MonacoEnvironment.lazy = lazy;
+      if (!lazy) {
+        await MonacoEnvironment.initModule();
+      } else {
+        for (const loader of MonacoEnvironment.preLoaders) {
+          await loader(MonacoEnvironment.container);
+        }
+        const initialize = MonacoEnvironment.container.get(InitializeProvider);
+        await initialize.initialize(monaco);
+      }
+    } catch (ex) {
+      console.error(ex);
+    }
+  }
+
+  static async initModule() {
+    if (!MonacoEnvironment.loaders.length) {
+      return;
+    }
+    for (const loader of MonacoEnvironment.loaders) {
+      await loader(MonacoEnvironment.container);
+    }
+    MonacoEnvironment.loaders = [];
+    try {
+      const initialize = MonacoEnvironment.container.get(InitializeProvider);
+      await initialize.initialize(monaco);
+      if (MonacoEnvironment.lazy) {
+        const layzInit = MonacoEnvironment.container.get(LazyLoaderRegistry);
+        await layzInit.handleLazyLoder();
+      }
+    } catch (e) {
+      console.error(e);
+    }
+  }
+
+  static async loadModule(loader: ModuleLoader) {
+    MonacoEnvironment.loaders.push(loader);
+  }
+
+  // 提前加载（懒加载模式下需要提前加载的模块）
+  static async preLoadModule(loader: ModuleLoader) {
+    MonacoEnvironment.preLoaders.push(loader);
+  }
+}

package/src/monaco-loader.ts

@@ -0,0 +1,100 @@
+import { inject, singleton } from '@difizen/mana-app';
+import * as monaco from '@difizen/monaco-editor-core';
+
+export const MonacoLoaderConfig = Symbol('MonacoLoaderConfig');
+export interface MonacoLoaderConfig {
+  requireConfig: {
+    paths: {
+      vs: string;
+      [key: string]: string;
+    };
+  };
+}
+
+export const DefaultLoaderConfig: MonacoLoaderConfig = {
+  requireConfig: {
+    paths: {
+      vs: 'https://unpkg.com/@difizen/monaco-editor-core@0.39.4/min/vs/',
+    },
+  },
+};
+
+@singleton()
+export class MonacoLoader {
+  loaded = false;
+  protected start = false;
+  protected vsRequire: any;
+  protected readonly config;
+  constructor(@inject(MonacoLoaderConfig) config: MonacoLoaderConfig) {
+    this.config = config;
+  }
+  cdnUrl = '';
+
+  async load(cdnUrl?: string) {
+    if (cdnUrl) {
+      this.cdnUrl = cdnUrl;
+    }
+    if (!this.start) {
+      this.start = true;
+      await this.doLoad();
+    }
+  }
+  protected async doLoad(): Promise<void> {
+    if (!this.loaded) {
+      await this.initMonaco();
+    }
+  }
+  // 初始化，将monaco挂在到window上
+  initMonaco() {
+    return new Promise((resolve, reject) => {
+      if (this.cdnUrl) {
+        const beforeExist = document.getElementById('e2-monaco-id');
+        if (beforeExist) {
+          if (window._Monaco) {
+            const global: any = window;
+            global.monaco = window._Monaco;
+            this.loaded = true;
+            resolve(true);
+            return;
+          }
+          beforeExist.onload = () => {
+            const global: any = window;
+            global.monaco = window._Monaco;
+            this.loaded = true;
+            resolve(true);
+          };
+          return;
+        }
+        const script = document.createElement('script');
+        script.id = 'e2-monaco-id';
+        script.src = this.cdnUrl;
+        // script.src =
+        document.head.appendChild(script);
+        script.onload = () => {
+          const global: any = window;
+          global.monaco = window._Monaco;
+          this.loaded = true;
+          resolve(true);
+        };
+        script.onerror = () => {
+          document.head.removeChild(script);
+          // 如果第一次失败的话，就再次加载monaco
+          const script2 = document.createElement('script');
+          script2.src = this.cdnUrl;
+          document.head.appendChild(script2);
+          script2.onload = () => {
+            const global: any = window;
+            global.monaco = window._Monaco;
+            this.loaded = true;
+            resolve(true);
+          };
+        };
+      } else {
+        const global: any = window;
+        global.monaco = monaco;
+        this.loaded = true;
+        resolve(true);
+      }
+    });
+  }
+}

package/src/monaco-module.ts

@@ -0,0 +1,101 @@
+import {
+  EditorHandlerContribution,
+  EditorOptionsRegistry,
+  LanguageOptionsRegistry,
+  LanguageWorkerContribution,
+  LanguageWorkerRegistry,
+  LazyLoaderRegistry,
+  LazyLoaderRegistryContribution,
+} from '@difizen/libro-cofine-editor-contribution';
+import { Contribution, Module, Syringe } from '@difizen/mana-app';
+
+import 'reflect-metadata';
+import { DefaultWorkerContribution } from './default-worker-contribution.js';
+import {
+  E2Editor,
+  EditorNode,
+  IsDiff,
+  LazyCallback,
+  MonacoOptions,
+} from './e2-editor.js';
+import { EditorHanlerRegistry } from './editor-handler-registry.js';
+import type { Options } from './editor-provider.js';
+import { EditorProvider } from './editor-provider.js';
+import {
+  InitializeContribution,
+  InitializeContributionProvider,
+  InitializeProvider,
+} from './initialize-provider.js';
+import {
+  SnippetSuggestContribution,
+  SnippetSuggestRegistry,
+} from './snippets-suggest-registry.js';
+import {
+  MixedThemeRegistry,
+  ThemeContribution,
+  ThemeRegistry,
+} from './theme-registry.js';
+
+export const MonacoModule = Module()
+  .register(
+    {
+      token: { token: Contribution.Provider, named: InitializeContribution },
+      useDynamic: (ctx) =>
+        new InitializeContributionProvider(InitializeContribution, ctx.container),
+      lifecycle: Syringe.Lifecycle.singleton,
+    },
+    InitializeProvider,
+    LanguageWorkerRegistry,
+    LanguageOptionsRegistry,
+    EditorOptionsRegistry,
+    DefaultWorkerContribution,
+    SnippetSuggestRegistry,
+    LazyLoaderRegistry,
+    {
+      token: MixedThemeRegistry,
+      useValue: {},
+    },
+    ThemeRegistry,
+    {
+      token: EditorProvider,
+      lifecycle: Syringe.Lifecycle.singleton,
+      useDynamic: (ctx) => {
+        return {
+          create: (node: HTMLElement, options: Options, lazyCallback?: () => void) => {
+            const child = ctx.container.createChild();
+            child.register(EditorNode, { useValue: node });
+            child.register(MonacoOptions, { useValue: options });
+            child.register(LazyCallback, { useValue: lazyCallback });
+            child.register({ token: IsDiff, useValue: false });
+            child.register(EditorHanlerRegistry);
+            child.register(E2Editor);
+            return child.get(E2Editor);
+          },
+          createDiff: (
+            node: HTMLElement,
+            options: Options,
+            lazyCallback?: () => void,
+          ) => {
+            const child = ctx.container.createChild();
+            child.register(EditorNode, { useValue: node });
+            child.register(MonacoOptions, { useValue: options });
+            child.register(LazyCallback, { useValue: lazyCallback });
+            child.register({ token: IsDiff, useValue: true });
+            child.register(EditorHanlerRegistry);
+            child.register(E2Editor);
+            return child.get(E2Editor);
+          },
+        };
+      },
+    },
+  )
+  // 语言 worker 扩展点
+  .contribution(
+    LanguageWorkerContribution,
+    EditorHandlerContribution,
+    ThemeContribution,
+    SnippetSuggestContribution,
+    LazyLoaderRegistryContribution,
+  );
+
+export default MonacoModule;

package/src/snippets-suggest-registry.ts

@@ -0,0 +1,101 @@
+import type { Contribution } from '@difizen/mana-app';
+import { contrib, singleton, Syringe } from '@difizen/mana-app';
+import * as monaco from '@difizen/monaco-editor-core';
+
+import { InitializeContribution } from './initialize-provider.js';
+
+export interface SnippetLoadOptions {
+  language?: string | string[];
+  source: string;
+}
+
+export type JsonSerializedSnippets = Record<string, JsonSerializedSnippet>;
+export interface JsonSerializedSnippet {
+  body: string[];
+  scope: string;
+  prefix: string;
+  description: string;
+}
+
+export interface SnippetSuggestContribution {
+  registerSnippetSuggest: (registry: SnippetSuggestRegistry) => void;
+  _initRegisterSnippetSuggest?: boolean;
+}
+
+export const SnippetSuggestContribution = Syringe.defineToken(
+  'SnippetSuggestContribution',
+);
+
+@singleton({ contrib: InitializeContribution })
+export class SnippetSuggestRegistry implements InitializeContribution {
+  registerCompletion = false;
+  awaysInitialized = true;
+  onInitialize() {
+    this.snippetsSuggestContrbutions
+      .getContributions({ cache: false })
+      .forEach((contribution) => {
+        if (contribution._initRegisterSnippetSuggest) {
+          return;
+        }
+        contribution.registerSnippetSuggest(this);
+        contribution._initRegisterSnippetSuggest = true;
+      });
+  }
+  protected languageSnippets: Record<string, JsonSerializedSnippet[]> = {};
+
+  snippetsSuggestContrbutions: Contribution.Provider<SnippetSuggestContribution>;
+  constructor(
+    @contrib(SnippetSuggestContribution)
+    snippetsSuggestContrbutions: Contribution.Provider<SnippetSuggestContribution>,
+  ) {
+    this.snippetsSuggestContrbutions = snippetsSuggestContrbutions;
+  }
+
+  async provideCompletionItems(
+    model: monaco.editor.ITextModel,
+  ): Promise<monaco.languages.CompletionList | undefined> {
+    const _language = model.getLanguageId();
+    const _snippets: JsonSerializedSnippet[] = this.languageSnippets[_language] || [];
+    const suggestions = _snippets.map((it) => {
+      return {
+        label: it.prefix,
+        insertText: it.body.join('\n'),
+        documentation: it.description,
+        detail: 'snippet',
+        insertTextRules: 4,
+        kind: 27,
+        range: undefined as unknown as monaco.IRange,
+      };
+    });
+    return { suggestions };
+  }
+
+  fromJSON(
+    snippets: JsonSerializedSnippets | undefined,
+    { language }: SnippetLoadOptions,
+  ) {
+    if (!language || !language?.length || !snippets) {
+      return;
+    }
+    const _languages = typeof language === 'string' ? [language] : language;
+    _languages.forEach((it) => {
+      if (!this.languageSnippets[it]) {
+        this.languageSnippets[it] = [];
+      }
+      this.languageSnippets[it].push(
+        ...(Object.values(snippets) as JsonSerializedSnippet[]),
+      );
+    });
+    // 采集数据
+    if (this.registerCompletion) {
+      return;
+    }
+    this.registerCompletion = true;
+    monaco.languages.registerCompletionItemProvider(
+      { pattern: '**' },
+      {
+        provideCompletionItems: this.provideCompletionItems.bind(this),
+      },
+    );
+  }
+}