migrate custom themes awa from @uiw/codemirror-themes

packages/codemirror/codemirror.mjs

@@ -20,7 +20,7 @@ import { isTooltipEnabled } from './tooltip.mjs';
 import { flash, isFlashEnabled } from './flash.mjs';
 import { highlightMiniLocations, isPatternHighlightingEnabled, updateMiniLocations } from './highlight.mjs';
 import { keybindings } from './keybindings.mjs';
-import { initTheme, activateTheme, theme } from './themes-vanilla.mjs';
+import { initTheme, activateTheme, theme } from './themes.mjs';
 import { sliderPlugin, updateSliderWidgets } from './slider.mjs';
 import { widgetPlugin, updateWidgets } from './widget.mjs';
 import { persistentAtom } from '@nanostores/persistent';

packages/codemirror/index.mjs

@@ -2,5 +2,5 @@ export * from './codemirror.mjs';
 export * from './highlight.mjs';
 export * from './flash.mjs';
 export * from './slider.mjs';
-export * from './themes-vanilla.mjs';
+export * from './themes.mjs';
 export * from './widget.mjs';

packages/codemirror/themes.mjs

@@ -1,4 +1,4 @@
-import {
+/* import {
   abcdef,
   androidstudio,
   atomone,
@@ -28,9 +28,9 @@ import {
   solarizedLight,
   tokyoNightDay,
   xcodeLight,
-} from '@uiw/codemirror-themes-all';
+} from '@uiw/codemirror-themes-all'; */
 
-import strudelTheme from './themes/strudel-theme';
+import strudelTheme, { settings as strudelThemeSettings } from './themes/strudel-theme';
 import bluescreen, { settings as bluescreenSettings } from './themes/bluescreen';
 import blackscreen, { settings as blackscreenSettings } from './themes/blackscreen';
 import whitescreen, { settings as whitescreenSettings } from './themes/whitescreen';
@@ -47,7 +47,7 @@ export const themes = {
   teletext,
   algoboy,
   terminal,
-  abcdef,
+  /* abcdef,
   androidstudio,
   atomone,
   aura,
@@ -75,33 +75,20 @@ export const themes = {
   noctisLilac,
   solarizedLight,
   tokyoNightDay,
-  xcodeLight,
+  xcodeLight, */
 };
 
 // lineBackground is background with 50% opacity, to make sure the selection below is visible
 
 export const settings = {
-  strudelTheme: {
-    background: '#222',
-    lineBackground: '#22222299',
-    foreground: '#fff',
-    // foreground: '#75baff',
-    caret: '#ffcc00',
-    selection: 'rgba(128, 203, 196, 0.5)',
-    selectionMatch: '#036dd626',
-    // lineHighlight: '#8a91991a', // original
-    lineHighlight: '#00000050',
-    gutterBackground: 'transparent',
-    // gutterForeground: '#8a919966',
-    gutterForeground: '#8a919966',
-  },
+  strudelTheme: strudelThemeSettings,
   bluescreen: bluescreenSettings,
   blackscreen: blackscreenSettings,
   whitescreen: whitescreenSettings,
   teletext: teletextSettings,
   algoboy: algoboySettings,
   terminal: terminalSettings,
-  abcdef: {
+  /* abcdef: {
     background: '#0f0f0f',
     lineBackground: '#0f0f0f99',
     foreground: '#defdef',
@@ -434,7 +421,7 @@ export const settings = {
     selection: '#727377',
     selectionMatch: '#727377',
     lineHighlight: '#2F3239',
-  },
+  }, */
 };
 
 function getColors(str) {

packages/codemirror/themes/algoboy.mjs

@@ -1,5 +1,5 @@
 import { tags as t } from '@lezer/highlight';
-import { createTheme } from '@uiw/codemirror-themes';
+import { createTheme } from './theme-helper.mjs';
 export const settings = {
   background: '#9bbc0f',
   foreground: '#0f380f', // whats that?

packages/codemirror/themes/blackscreen.mjs

@@ -1,5 +1,5 @@
 import { tags as t } from '@lezer/highlight';
-import { createTheme } from '@uiw/codemirror-themes';
+import { createTheme } from './theme-helper.mjs';
 export const settings = {
   background: 'black',
   foreground: 'white', // whats that?

packages/codemirror/themes/bluescreen.mjs

@@ -1,5 +1,5 @@
 import { tags as t } from '@lezer/highlight';
-import { createTheme } from '@uiw/codemirror-themes';
+import { createTheme } from './theme-helper.mjs';
 export const settings = {
   background: '#051DB5',
   lineBackground: '#051DB550',

packages/codemirror/themes/strudel-theme.mjs

@@ -1,19 +1,24 @@
 import { tags as t } from '@lezer/highlight';
-import { createTheme } from '@uiw/codemirror-themes';
+import { createTheme } from './theme-helper.mjs';
+
+export const settings = {
+  background: '#222',
+  lineBackground: '#22222299',
+  foreground: '#fff',
+  // foreground: '#75baff',
+  caret: '#ffcc00',
+  selection: 'rgba(128, 203, 196, 0.5)',
+  selectionMatch: '#036dd626',
+  // lineHighlight: '#8a91991a', // original
+  lineHighlight: '#00000050',
+  gutterBackground: 'transparent',
+  // gutterForeground: '#8a919966',
+  gutterForeground: '#8a919966',
+};
+
 export default createTheme({
   theme: 'dark',
-  settings: {
-    background: '#222',
-    foreground: '#75baff', // whats that?
-    caret: '#ffcc00',
-    selection: 'rgba(128, 203, 196, 0.5)',
-    selectionMatch: '#036dd626',
-    // lineHighlight: '#8a91991a', // original
-    lineHighlight: '#00000050',
-    gutterBackground: 'transparent',
-    // gutterForeground: '#8a919966',
-    gutterForeground: '#8a919966',
-  },
+  settings,
   styles: [
     { tag: t.labelName, color: '#89ddff' },
     { tag: t.keyword, color: '#c792ea' },

packages/codemirror/themes/teletext.mjs

@@ -1,5 +1,5 @@
 import { tags as t } from '@lezer/highlight';
-import { createTheme } from '@uiw/codemirror-themes';
+import { createTheme } from './theme-helper.mjs';
 
 let colorA = '#6edee4';
 //let colorB = 'magenta';

packages/codemirror/themes/terminal.mjs

@@ -1,5 +1,5 @@
 import { tags as t } from '@lezer/highlight';
-import { createTheme } from '@uiw/codemirror-themes';
+import { createTheme } from './theme-helper.mjs';
 export const settings = {
   background: 'black',
   foreground: '#41FF00', // whats that?