@opensumi/ide-theme 2.21.13 → 2.22.0

package/src/common/default-themes.ts

@@ -0,0 +1,273 @@
+/* ---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+// Some code copied and modified from https://github.com/microsoft/vscode/blob/1.44.0/src/vs/editor/standalone/common/themes.ts
+
+import {
+  editorActiveIndentGuides,
+  editorIndentGuides,
+  editorBackground,
+  editorForeground,
+  editorInactiveSelection,
+  editorSelectionHighlight,
+} from './color-registry';
+import { IStandaloneThemeData } from './theme.service';
+// tslint:disable:variable-name
+/* -------------------------------- Begin vs theme -------------------------------- */
+export const vs: IStandaloneThemeData = {
+  base: 'vs',
+  inherit: false,
+  rules: [
+    { token: '', foreground: '000000', background: 'fffffe' },
+    { token: 'invalid', foreground: 'cd3131' },
+    { token: 'emphasis', fontStyle: 'italic' },
+    { token: 'strong', fontStyle: 'bold' },
+
+    { token: 'variable', foreground: '001188' },
+    { token: 'variable.predefined', foreground: '4864AA' },
+    { token: 'constant', foreground: 'dd0000' },
+    { token: 'comment', foreground: '008000' },
+    { token: 'number', foreground: '09885A' },
+    { token: 'number.hex', foreground: '3030c0' },
+    { token: 'regexp', foreground: '800000' },
+    { token: 'annotation', foreground: '808080' },
+    { token: 'type', foreground: '008080' },
+
+    { token: 'delimiter', foreground: '000000' },
+    { token: 'delimiter.html', foreground: '383838' },
+    { token: 'delimiter.xml', foreground: '0000FF' },
+
+    { token: 'tag', foreground: '800000' },
+    { token: 'tag.id.pug', foreground: '4F76AC' },
+    { token: 'tag.class.pug', foreground: '4F76AC' },
+    { token: 'meta.scss', foreground: '800000' },
+    { token: 'metatag', foreground: 'e00000' },
+    { token: 'metatag.content.html', foreground: 'FF0000' },
+    { token: 'metatag.html', foreground: '808080' },
+    { token: 'metatag.xml', foreground: '808080' },
+    { token: 'metatag.php', fontStyle: 'bold' },
+
+    { token: 'key', foreground: '863B00' },
+    { token: 'string.key.json', foreground: 'A31515' },
+    { token: 'string.value.json', foreground: '0451A5' },
+
+    { token: 'attribute.name', foreground: 'FF0000' },
+    { token: 'attribute.value', foreground: '0451A5' },
+    { token: 'attribute.value.number', foreground: '09885A' },
+    { token: 'attribute.value.unit', foreground: '09885A' },
+    { token: 'attribute.value.html', foreground: '0000FF' },
+    { token: 'attribute.value.xml', foreground: '0000FF' },
+
+    { token: 'string', foreground: 'A31515' },
+    { token: 'string.html', foreground: '0000FF' },
+    { token: 'string.sql', foreground: 'FF0000' },
+    { token: 'string.yaml', foreground: '0451A5' },
+
+    { token: 'keyword', foreground: '0000FF' },
+    { token: 'keyword.json', foreground: '0451A5' },
+    { token: 'keyword.flow', foreground: 'AF00DB' },
+    { token: 'keyword.flow.scss', foreground: '0000FF' },
+
+    { token: 'operator.scss', foreground: '666666' },
+    { token: 'operator.sql', foreground: '778899' },
+    { token: 'operator.swift', foreground: '666666' },
+    { token: 'predefined.sql', foreground: 'FF00FF' },
+  ],
+  colors: {
+    [editorBackground]: '#FFFFFE',
+    [editorForeground]: '#000000',
+    [editorInactiveSelection]: '#E5EBF1',
+    [editorIndentGuides]: '#D3D3D3',
+    [editorActiveIndentGuides]: '#939393',
+    [editorSelectionHighlight]: '#ADD6FF4D',
+  },
+};
+/* -------------------------------- End vs theme -------------------------------- */
+
+/* -------------------------------- Begin vs-dark theme -------------------------------- */
+export const vs_dark: IStandaloneThemeData = {
+  base: 'vs-dark',
+  inherit: false,
+  rules: [
+    { token: '', foreground: 'D4D4D4', background: '1E1E1E' },
+    { token: 'invalid', foreground: 'f44747' },
+    { token: 'emphasis', fontStyle: 'italic' },
+    { token: 'strong', fontStyle: 'bold' },
+
+    { token: 'variable', foreground: '74B0DF' },
+    { token: 'variable.predefined', foreground: '4864AA' },
+    { token: 'variable.parameter', foreground: '9CDCFE' },
+    { token: 'constant', foreground: '569CD6' },
+    { token: 'comment', foreground: '608B4E' },
+    { token: 'number', foreground: 'B5CEA8' },
+    { token: 'number.hex', foreground: '5BB498' },
+    { token: 'regexp', foreground: 'B46695' },
+    { token: 'annotation', foreground: 'cc6666' },
+    { token: 'type', foreground: '3DC9B0' },
+
+    { token: 'delimiter', foreground: 'DCDCDC' },
+    { token: 'delimiter.html', foreground: '808080' },
+    { token: 'delimiter.xml', foreground: '808080' },
+
+    { token: 'tag', foreground: '569CD6' },
+    { token: 'tag.id.pug', foreground: '4F76AC' },
+    { token: 'tag.class.pug', foreground: '4F76AC' },
+    { token: 'meta.scss', foreground: 'A79873' },
+    { token: 'meta.tag', foreground: 'CE9178' },
+    { token: 'metatag', foreground: 'DD6A6F' },
+    { token: 'metatag.content.html', foreground: '9CDCFE' },
+    { token: 'metatag.html', foreground: '569CD6' },
+    { token: 'metatag.xml', foreground: '569CD6' },
+    { token: 'metatag.php', fontStyle: 'bold' },
+
+    { token: 'key', foreground: '9CDCFE' },
+    { token: 'string.key.json', foreground: '9CDCFE' },
+    { token: 'string.value.json', foreground: 'CE9178' },
+
+    { token: 'attribute.name', foreground: '9CDCFE' },
+    { token: 'attribute.value', foreground: 'CE9178' },
+    { token: 'attribute.value.number.css', foreground: 'B5CEA8' },
+    { token: 'attribute.value.unit.css', foreground: 'B5CEA8' },
+    { token: 'attribute.value.hex.css', foreground: 'D4D4D4' },
+
+    { token: 'string', foreground: 'CE9178' },
+    { token: 'string.sql', foreground: 'FF0000' },
+
+    { token: 'keyword', foreground: '569CD6' },
+    { token: 'keyword.flow', foreground: 'C586C0' },
+    { token: 'keyword.json', foreground: 'CE9178' },
+    { token: 'keyword.flow.scss', foreground: '569CD6' },
+
+    { token: 'operator.scss', foreground: '909090' },
+    { token: 'operator.sql', foreground: '778899' },
+    { token: 'operator.swift', foreground: '909090' },
+    { token: 'predefined.sql', foreground: 'FF00FF' },
+  ],
+  colors: {
+    [editorBackground]: '#1E1E1E',
+    [editorForeground]: '#D4D4D4',
+    [editorInactiveSelection]: '#3A3D41',
+    [editorIndentGuides]: '#404040',
+    [editorActiveIndentGuides]: '#707070',
+    [editorSelectionHighlight]: '#ADD6FF26',
+  },
+};
+/* -------------------------------- End vs-dark theme -------------------------------- */
+
+/* -------------------------------- Begin hc-black theme -------------------------------- */
+export const hc_black: IStandaloneThemeData = {
+  base: 'hc-black',
+  inherit: false,
+  rules: [
+    { token: '', foreground: 'FFFFFF', background: '000000' },
+    { token: 'invalid', foreground: 'f44747' },
+    { token: 'emphasis', fontStyle: 'italic' },
+    { token: 'strong', fontStyle: 'bold' },
+
+    { token: 'variable', foreground: '1AEBFF' },
+    { token: 'variable.parameter', foreground: '9CDCFE' },
+    { token: 'constant', foreground: '569CD6' },
+    { token: 'comment', foreground: '608B4E' },
+    { token: 'number', foreground: 'FFFFFF' },
+    { token: 'regexp', foreground: 'C0C0C0' },
+    { token: 'annotation', foreground: '569CD6' },
+    { token: 'type', foreground: '3DC9B0' },
+
+    { token: 'delimiter', foreground: 'FFFF00' },
+    { token: 'delimiter.html', foreground: 'FFFF00' },
+
+    { token: 'tag', foreground: '569CD6' },
+    { token: 'tag.id.pug', foreground: '4F76AC' },
+    { token: 'tag.class.pug', foreground: '4F76AC' },
+    { token: 'meta', foreground: 'D4D4D4' },
+    { token: 'meta.tag', foreground: 'CE9178' },
+    { token: 'metatag', foreground: '569CD6' },
+    { token: 'metatag.content.html', foreground: '1AEBFF' },
+    { token: 'metatag.html', foreground: '569CD6' },
+    { token: 'metatag.xml', foreground: '569CD6' },
+    { token: 'metatag.php', fontStyle: 'bold' },
+
+    { token: 'key', foreground: '9CDCFE' },
+    { token: 'string.key', foreground: '9CDCFE' },
+    { token: 'string.value', foreground: 'CE9178' },
+
+    { token: 'attribute.name', foreground: '569CD6' },
+    { token: 'attribute.value', foreground: '3FF23F' },
+
+    { token: 'string', foreground: 'CE9178' },
+    { token: 'string.sql', foreground: 'FF0000' },
+
+    { token: 'keyword', foreground: '569CD6' },
+    { token: 'keyword.flow', foreground: 'C586C0' },
+
+    { token: 'operator.sql', foreground: '778899' },
+    { token: 'operator.swift', foreground: '909090' },
+    { token: 'predefined.sql', foreground: 'FF00FF' },
+  ],
+  colors: {
+    [editorBackground]: '#000000',
+    [editorForeground]: '#FFFFFF',
+    [editorIndentGuides]: '#FFFFFF',
+    [editorActiveIndentGuides]: '#FFFFFF',
+  },
+};
+/* -------------------------------- End hc-black theme -------------------------------- */
+/* -------------------------------- Begin hc-light theme -------------------------------- */
+export const hc_light: IStandaloneThemeData = {
+  base: 'hc-light',
+  inherit: false,
+  rules: [
+    { token: '', foreground: '292929', background: 'FFFFFF' },
+    { token: 'invalid', foreground: 'B5200D' },
+    { token: 'emphasis', fontStyle: 'italic' },
+    { token: 'strong', fontStyle: 'bold' },
+
+    { token: 'variable', foreground: '264F70' },
+    { token: 'variable.predefined', foreground: '4864AA' },
+    { token: 'constant', foreground: 'dd0000' },
+    { token: 'comment', foreground: '008000' },
+    { token: 'number', foreground: '098658' },
+    { token: 'number.hex', foreground: '3030c0' },
+    { token: 'regexp', foreground: '800000' },
+    { token: 'annotation', foreground: '808080' },
+    { token: 'type', foreground: '008080' },
+
+    { token: 'delimiter', foreground: '000000' },
+    { token: 'delimiter.html', foreground: '383838' },
+
+    { token: 'tag', foreground: '800000' },
+    { token: 'tag.id.pug', foreground: '4F76AC' },
+    { token: 'tag.class.pug', foreground: '4F76AC' },
+    { token: 'meta.scss', foreground: '800000' },
+    { token: 'metatag', foreground: 'e00000' },
+    { token: 'metatag.content.html', foreground: 'B5200D' },
+    { token: 'metatag.html', foreground: '808080' },
+    { token: 'metatag.xml', foreground: '808080' },
+    { token: 'metatag.php', fontStyle: 'bold' },
+
+    { token: 'key', foreground: '863B00' },
+    { token: 'string.key.json', foreground: 'A31515' },
+    { token: 'string.value.json', foreground: '0451A5' },
+
+    { token: 'attribute.name', foreground: '264F78' },
+    { token: 'attribute.value', foreground: '0451A5' },
+
+    { token: 'string', foreground: 'A31515' },
+    { token: 'string.sql', foreground: 'B5200D' },
+
+    { token: 'keyword', foreground: '0000FF' },
+    { token: 'keyword.flow', foreground: 'AF00DB' },
+
+    { token: 'operator.sql', foreground: '778899' },
+    { token: 'operator.swift', foreground: '666666' },
+    { token: 'predefined.sql', foreground: 'C700C7' },
+  ],
+  colors: {
+    [editorBackground]: '#FFFFFF',
+    [editorForeground]: '#292929',
+    [editorIndentGuides]: '#292929',
+    [editorActiveIndentGuides]: '#292929',
+  },
+};
+/* -------------------------------- End hc-light theme -------------------------------- */

package/src/common/event.ts

@@ -0,0 +1,9 @@
+import { BasicEvent } from '@opensumi/ide-core-common';
+
+import { ITheme } from './theme.service';
+
+export class ThemeChangedEvent extends BasicEvent<IThemeChangedEventPayload> {}
+
+export interface IThemeChangedEventPayload {
+  theme: ITheme;
+}

package/src/common/index.ts

@@ -0,0 +1,8 @@
+export * from './color';
+export * from './color-registry';
+export * from './default-themes';
+export * from './event';
+export * from './plistParser';
+export * from './style';
+export * from './theme.service';
+export * from './themeCompatibility';

package/src/common/mocks/theme.service.ts

@@ -0,0 +1,55 @@
+import { Injectable } from '@opensumi/di';
+import { Emitter, Event, URI, IThemeColor, Deferred } from '@opensumi/ide-core-common';
+
+import { ThemeContribution, ExtColorContribution, IThemeService, ITheme } from '../theme.service';
+
+@Injectable()
+export class MockThemeService implements IThemeService {
+  colorThemeLoaded: Deferred<void>;
+
+  public currentThemeId = 'dark';
+
+  private _onThemeChange = new Emitter<ITheme>();
+
+  get onThemeChange(): Event<ITheme> {
+    return this._onThemeChange.event;
+  }
+
+  registerThemes(themeContributions: ThemeContribution[], extPath: URI) {
+    return {
+      dispose: () => {},
+    };
+  }
+  async applyTheme(id: string) {
+    this.colorThemeLoaded.resolve();
+    throw new Error('Method not implemented.');
+  }
+
+  getAvailableThemeInfos() {
+    return [];
+  }
+
+  async getCurrentTheme() {
+    return {} as ITheme;
+  }
+
+  getCurrentThemeSync() {
+    return {} as ITheme;
+  }
+
+  getColor(id: string | IThemeColor | undefined) {
+    return '';
+  }
+
+  getColorVar(id: string | IThemeColor | undefined) {
+    return '';
+  }
+
+  registerColor(contribution: ExtColorContribution) {
+    throw new Error('Method not implemented.');
+  }
+
+  getColorClassNameByColorToken(colorId: string | IThemeColor): string {
+    throw new Error('Method not implemented.');
+  }
+}