From bf2424523f6da62020f79681e670a4f9c2f0a531 Mon Sep 17 00:00:00 2001
From: jaywcjlove <398188662@qq.com>
Date: Sat, 26 Aug 2023 01:20:38 +0800
Subject: [PATCH] feat(theme): add `basic` theme.
---
.github/workflows/ci.yml | 466 +---------------------------
themes/all/README.md | 11 +
themes/all/package.json | 1 +
themes/basic/README.md | 106 +++++++
themes/basic/dark.d.ts | 6 +
themes/basic/light.d.ts | 6 +
themes/basic/package.json | 59 ++++
themes/basic/src/dark.ts | 123 ++++++++
themes/basic/src/index.ts | 2 +
themes/basic/src/light.ts | 122 ++++++++
themes/basic/tsconfig.json | 9 +
www/package.json | 1 +
www/src/pages/theme/themes/Datas.ts | 3 +
www/src/router.tsx | 26 ++
14 files changed, 482 insertions(+), 459 deletions(-)
create mode 100644 themes/basic/README.md
create mode 100644 themes/basic/dark.d.ts
create mode 100644 themes/basic/light.d.ts
create mode 100644 themes/basic/package.json
create mode 100644 themes/basic/src/dark.ts
create mode 100644 themes/basic/src/index.ts
create mode 100644 themes/basic/src/light.ts
create mode 100644 themes/basic/tsconfig.json
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index e310743d1..a39abe20c 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -158,6 +158,13 @@ jobs:
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+ - name: 📦 @uiw/codemirror-theme-basic publish to NPM
+ run: npm publish --access public
+ working-directory: ./themes/basic/
+ continue-on-error: true
+ env:
+ NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+
- name: 📦 @uiw/codemirror-theme-bbedit publish to NPM
run: npm publish --access public
working-directory: ./themes/bbedit/
@@ -342,462 +349,3 @@ jobs:
outputs:
successful: ${{steps.create_tag.outputs.successful }}
-
- # github-package:
- # runs-on: ubuntu-latest
- # needs: build-deploy
- # steps:
- # - uses: actions/checkout@v3
- # - uses: actions/setup-node@v3
- # with:
- # node-version: 16
- # registry-url: https://npm.pkg.github.com
- # scope: '@uiwjs'
-
- # - run: npm install
- # - run: npm run build
-
- # - name: "Modify @uiw/react-codemirror => @uiwjs/react-codemirror"
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: core/package.json
- # rename: "@uiwjs/react-codemirror"
-
- # - run: npm publish
- # name: 📦 @uiwjs/react-codemirror publish to NPM
- # working-directory: core
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: "Modify react-codemirror-merge => @uiwjs/react-codemirror-merge"
- # uses: jaywcjlove/github-action-package@main
- # continue-on-error: true
- # with:
- # path: merge/package.json
- # rename: "@uiwjs/react-codemirror-merge"
-
- # - run: npm publish
- # name: 📦 @uiwjs/react-codemirror-merge publish to NPM
- # working-directory: merge
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-themes => @uiwjs/codemirror-themes
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/theme/package.json
- # rename: "@uiwjs/codemirror-themes"
-
- # - run: npm publish
- # working-directory: themes/theme
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-abcdef => @uiwjs/codemirror-theme-abcdef
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/abcdef/package.json
- # rename: "@uiwjs/codemirror-theme-abcdef"
-
- # - run: npm publish
- # working-directory: themes/abcdef
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-themes-all => @uiwjs/codemirror-themes-all
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/all/package.json
- # rename: "@uiwjs/codemirror-themes-all"
-
- # - run: npm publish
- # working-directory: themes/all
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-androidstudio => @uiwjs/codemirror-theme-androidstudio
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/androidstudio/package.json
- # rename: "@uiwjs/codemirror-theme-androidstudio"
-
- # - run: npm publish
- # working-directory: themes/androidstudio
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-atomone => @uiwjs/codemirror-theme-atomone
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/atomone/package.json
- # rename: "@uiwjs/codemirror-theme-atomone"
-
- # - run: npm publish
- # working-directory: themes/atomone
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-aura => @uiwjs/codemirror-theme-aura
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/aura/package.json
- # rename: "@uiwjs/codemirror-theme-aura"
-
- # - run: npm publish
- # working-directory: themes/aura
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-bbedit => @uiwjs/codemirror-theme-bbedit
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/bbedit/package.json
- # rename: "@uiwjs/codemirror-theme-bbedit"
-
- # - run: npm publish
- # working-directory: themes/bbedit
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-okaidia => @uiwjs/codemirror-theme-okaidia
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/okaidia/package.json
- # rename: "@uiwjs/codemirror-theme-okaidia"
-
- # - run: npm publish
- # working-directory: themes/okaidia
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-solarized => @uiwjs/codemirror-theme-solarized
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/solarized/package.json
- # rename: "@uiwjs/codemirror-theme-solarized"
-
- # - run: npm publish
- # working-directory: themes/solarized
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-dracula => @uiwjs/codemirror-theme-dracula
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/dracula/package.json
- # rename: "@uiwjs/codemirror-theme-dracula"
-
- # - run: npm publish
- # working-directory: themes/dracula
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-theme-duotone => @uiwjs/codemirror-theme-duotone
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/duotone/package.json
- # rename: "@uiwjs/codemirror-theme-duotone"
-
- # - run: npm publish
- # working-directory: themes/duotone
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-eclipse => @uiwjs/codemirror-theme-eclipse
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/eclipse/package.json
- # rename: "@uiwjs/codemirror-theme-eclipse"
-
- # - run: npm publish
- # working-directory: themes/eclipse
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-github => @uiwjs/codemirror-theme-github
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/github/package.json
- # rename: "@uiwjs/codemirror-theme-github"
-
- # - run: npm publish
- # working-directory: themes/github
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-gruvbox-dark => @uiwjs/codemirror-theme-gruvbox-dark
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/gruvbox/package.json
- # rename: '@uiwjs/codemirror-theme-gruvbox-dark'
-
- # - run: npm publish
- # working-directory: themes/gruvbox
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-material => @uiwjs/codemirror-theme-material
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/material/package.json
- # rename: '@uiwjs/codemirror-theme-material'
-
- # - run: npm publish
- # working-directory: themes/material
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-noctis-lilac => @uiwjs/codemirror-theme-noctis-lilac
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/noctis-lilac/package.json
- # rename: '@uiwjs/codemirror-theme-noctis-lilac'
-
- # - run: npm publish
- # working-directory: themes/noctis-lilac
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-nord => @uiwjs/codemirror-theme-nord
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/nord/package.json
- # rename: '@uiwjs/codemirror-theme-nord'
-
- # - run: npm publish
- # working-directory: themes/nord
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-darcula => @uiwjs/codemirror-theme-darcula
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/darcula/package.json
- # rename: "@uiwjs/codemirror-theme-darcula"
-
- # - run: npm publish
- # working-directory: themes/darcula
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-bespin => @uiwjs/codemirror-theme-bespin
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/bespin/package.json
- # rename: "@uiwjs/codemirror-theme-bespin"
-
- # - run: npm publish
- # working-directory: themes/bespin
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-sublime => @uiwjs/codemirror-theme-sublime
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/sublime/package.json
- # rename: "@uiwjs/codemirror-theme-sublime"
-
- # - run: npm publish
- # working-directory: themes/sublime
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-tokyo-night => @uiwjs/codemirror-theme-tokyo-night
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/tokyo-night/package.json
- # rename: "@uiwjs/codemirror-theme-tokyo-night"
-
- # - run: npm publish
- # working-directory: themes/tokyo-night
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-tokyo-night-storm => @uiwjs/codemirror-theme-tokyo-night-storm
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/tokyo-night-storm/package.json
- # rename: "@uiwjs/codemirror-theme-tokyo-night-storm"
-
- # - run: npm publish
- # working-directory: themes/tokyo-night-storm
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-tokyo-night-day => @uiwjs/codemirror-theme-tokyo-night-day
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/tokyo-night-day/package.json
- # rename: "@uiwjs/codemirror-theme-tokyo-night-day"
-
- # - run: npm publish
- # working-directory: themes/tokyo-night-day
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-vscode => @uiwjs/codemirror-theme-vscode
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/vscode/package.json
- # rename: "@uiwjs/codemirror-theme-vscode"
-
- # - run: npm publish
- # working-directory: themes/vscode
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-theme-xcode => @uiwjs/codemirror-theme-xcode
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: themes/xcode/package.json
- # rename: "@uiwjs/codemirror-theme-xcode"
-
- # - run: npm publish
- # working-directory: themes/xcode
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-events => @uiwjs/codemirror-extensions-events
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/events/package.json
- # rename: "@uiwjs/codemirror-extensions-events"
-
- # - run: npm publish
- # working-directory: extensions/events
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-basic-setup => @uiwjs/codemirror-extensions-basic-setup
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/basic-setup/package.json
- # rename: "@uiwjs/codemirror-extensions-basic-setup"
-
- # - run: npm publish
- # working-directory: extensions/basic-setup
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-classname => @uiwjs/codemirror-extensions-classname
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/classname/package.json
- # rename: "@uiwjs/codemirror-extensions-classname"
-
- # - run: npm publish
- # working-directory: extensions/classname
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-color => @uiwjs/codemirror-extensions-color
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/color/package.json
- # rename: "@uiwjs/codemirror-extensions-color"
-
- # - run: npm publish
- # working-directory: extensions/color
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-line-numbers-relative => @uiwjs/codemirror-extensions-line-numbers-relative
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/line-numbers-relative/package.json
- # rename: "@uiwjs/codemirror-extensions-line-numbers-relative"
-
- # - run: npm publish
- # working-directory: extensions/line-numbers-relative
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-hyper-link => @uiwjs/codemirror-extensions-hyper-link
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/hyper-link/package.json
- # rename: "@uiwjs/codemirror-extensions-hyper-link"
-
- # - run: npm publish
- # working-directory: extensions/hyper-link
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-langs => @uiwjs/codemirror-extensions-langs
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/langs/package.json
- # rename: "@uiwjs/codemirror-extensions-langs"
-
- # - run: npm publish
- # working-directory: extensions/langs
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
- # - name: Modify @uiw/codemirror-extensions-mentions => @uiwjs/codemirror-extensions-mentions
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/mentions/package.json
- # rename: "@uiwjs/codemirror-extensions-mentions"
-
- # - run: npm publish
- # working-directory: extensions/mentions
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
-
-
- # - name: Modify @uiw/codemirror-extensions-zebra-stripes => @uiwjs/codemirror-extensions-zebra-stripes
- # uses: jaywcjlove/github-action-package@main
- # with:
- # path: extensions/zebra-stripes/package.json
- # rename: "@uiwjs/codemirror-extensions-zebra-stripes"
-
- # - run: npm publish
- # working-directory: extensions/zebra-stripes
- # continue-on-error: true
- # env:
- # NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
\ No newline at end of file
diff --git a/themes/all/README.md b/themes/all/README.md
index 0643dc555..8c6229af4 100644
--- a/themes/all/README.md
+++ b/themes/all/README.md
@@ -63,6 +63,7 @@ export * from '@uiw/codemirror-theme-abcdef';
export * from '@uiw/codemirror-theme-androidstudio';
export * from '@uiw/codemirror-theme-atomone';
export * from '@uiw/codemirror-theme-aura';
+export * from '@uiw/codemirror-theme-basic';
export * from '@uiw/codemirror-theme-bbedit';
export * from '@uiw/codemirror-theme-bespin';
export * from '@uiw/codemirror-theme-darcula';
@@ -110,6 +111,16 @@ export * from '@uiw/codemirror-theme-xcode';
+**basic**
+
+
+
+
+
+
+
+
+
**bbedit**
diff --git a/themes/all/package.json b/themes/all/package.json
index 4460e7018..1ea8858f0 100644
--- a/themes/all/package.json
+++ b/themes/all/package.json
@@ -25,6 +25,7 @@
"@uiw/codemirror-theme-androidstudio": "4.21.9",
"@uiw/codemirror-theme-atomone": "4.21.9",
"@uiw/codemirror-theme-aura": "4.21.9",
+ "@uiw/codemirror-theme-basic": "4.21.9",
"@uiw/codemirror-theme-bbedit": "4.21.9",
"@uiw/codemirror-theme-bespin": "4.21.9",
"@uiw/codemirror-theme-darcula": "4.21.9",
diff --git a/themes/basic/README.md b/themes/basic/README.md
new file mode 100644
index 000000000..709e51d4e
--- /dev/null
+++ b/themes/basic/README.md
@@ -0,0 +1,106 @@
+
+
+# Basic Theme (dark/light)
+
+
+
+[![npm version](https://img.shields.io/npm/v/@uiw/codemirror-theme-basic.svg)](https://www.npmjs.com/package/@uiw/codemirror-theme-basic)
+
+
+
+
+
+
+
+
+
+## Install
+
+```bash
+npm install @uiw/codemirror-theme-basic --save
+```
+
+```jsx
+import { basicLight, basicLightInit, basicDark, basicDarkInit } from '@uiw/codemirror-theme-basic';
+// Or
+import { basicDark, basicDarkInit } from '@uiw/codemirror-theme-basic/dark';
+import { basicLight, basicLightInit } from '@uiw/codemirror-theme-basic/light';
+
+
+
+```
+
+## API
+
+```tsx
+import { CreateThemeOptions } from '@uiw/codemirror-themes';
+export declare const defaultSettingsBasicLight: CreateThemeOptions['settings'];
+export declare const basicLightInit: (options?: Partial) => import('@codemirror/state').Extension;
+export declare const basicLight: import('@codemirror/state').Extension;
+export declare const defaultSettingsBasicDark: CreateThemeOptions['settings'];
+export declare const basicDarkInit: (options?: Partial) => import('@codemirror/state').Extension;
+export declare const basicDark: import('@codemirror/state').Extension;
+```
+
+## Usage
+
+```jsx
+import CodeMirror from '@uiw/react-codemirror';
+import { basicLight, basicDark } from '@uiw/codemirror-theme-basic';
+import { javascript } from '@codemirror/lang-javascript';
+
+function App() {
+ return (
+ {
+ console.log('value:', value);
+ }}
+ />
+ );
+}
+export default App;
+```
+
+```js
+import { EditorView } from '@codemirror/view';
+import { EditorState } from '@codemirror/state';
+import { javascript } from '@codemirror/lang-javascript';
+import { basicLight, basicDark } from '@uiw/codemirror-theme-basic';
+
+const state = EditorState.create({
+ doc: 'my source code',
+ extensions: [basicDark, javascript({ jsx: true })],
+});
+
+const view = new EditorView({
+ parent: document.querySelector('#editor'),
+ state,
+});
+```
+
+## Contributors
+
+As always, thanks to our amazing contributors!
+
+
+
+
+
+Made with [github-action-contributors](https://github.com/jaywcjlove/github-action-contributors).
+
+## License
+
+Licensed under the MIT License.
+
+by Bram de Haan, adapted from DuoTone themes by Simurai (http://simurai.com/projects/2016/01/01/duotone-themes)
diff --git a/themes/basic/dark.d.ts b/themes/basic/dark.d.ts
new file mode 100644
index 000000000..a2c2b0607
--- /dev/null
+++ b/themes/basic/dark.d.ts
@@ -0,0 +1,6 @@
+declare module '@uiw/codemirror-theme-basic/dark' {
+ import { CreateThemeOptions } from '@uiw/codemirror-themes';
+ export const defaultSettingsBasicDark: CreateThemeOptions['settings'];
+ export const basicDarkInit: (options?: Partial) => import('@codemirror/state').Extension;
+ export const basicDark: import('@codemirror/state').Extension;
+}
diff --git a/themes/basic/light.d.ts b/themes/basic/light.d.ts
new file mode 100644
index 000000000..3a5832abc
--- /dev/null
+++ b/themes/basic/light.d.ts
@@ -0,0 +1,6 @@
+declare module '@uiw/codemirror-theme-basic/light' {
+ import { CreateThemeOptions } from '@uiw/codemirror-themes';
+ export const defaultSettingsBasicLight: CreateThemeOptions['settings'];
+ export const basicLightInit: (options?: Partial) => import('@codemirror/state').Extension;
+ export const basicLight: import('@codemirror/state').Extension;
+}
diff --git a/themes/basic/package.json b/themes/basic/package.json
new file mode 100644
index 000000000..3d2362b3b
--- /dev/null
+++ b/themes/basic/package.json
@@ -0,0 +1,59 @@
+{
+ "name": "@uiw/codemirror-theme-basic",
+ "version": "4.21.9",
+ "description": "Theme basic for CodeMirror.",
+ "homepage": "https://uiwjs.github.io/react-codemirror/#/theme/data/basic/light",
+ "author": "kenny wong ",
+ "license": "MIT",
+ "main": "./cjs/index.js",
+ "module": "./esm/index.js",
+ "exports": {
+ "./README.md": "./README.md",
+ ".": {
+ "import": "./esm/index.js",
+ "types": "./cjs/index.d.ts",
+ "require": "./cjs/index.js"
+ },
+ "./light": {
+ "import": "./esm/light.js",
+ "types": "./cjs/light.d.ts",
+ "require": "./cjs/light.js"
+ },
+ "./dark": {
+ "import": "./esm/dark.js",
+ "types": "./cjs/dark.d.ts",
+ "require": "./cjs/dark.js"
+ }
+ },
+ "scripts": {
+ "watch": "tsbb watch src/*.ts --use-babel",
+ "build": "tsbb build src/*.ts --use-babel"
+ },
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/uiwjs/react-codemirror.git"
+ },
+ "files": [
+ "src",
+ "esm",
+ "cjs"
+ ],
+ "dependencies": {
+ "@uiw/codemirror-themes": "4.21.9"
+ },
+ "keywords": [
+ "codemirror",
+ "codemirror6",
+ "theme",
+ "basic",
+ "syntax",
+ "ide",
+ "code"
+ ],
+ "jest": {
+ "coverageReporters": [
+ "lcov",
+ "json-summary"
+ ]
+ }
+}
diff --git a/themes/basic/src/dark.ts b/themes/basic/src/dark.ts
new file mode 100644
index 000000000..e736824ea
--- /dev/null
+++ b/themes/basic/src/dark.ts
@@ -0,0 +1,123 @@
+import { tags as t } from '@lezer/highlight';
+import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
+
+export const defaultSettingsBasicDark: CreateThemeOptions['settings'] = {
+ background: '#2E3235',
+ foreground: '#DDDDDD',
+ caret: '#DDDDDD',
+ selection: '#202325',
+ selectionMatch: '#B9D2FF30',
+ gutterBackground: '#292d30',
+ gutterForeground: '#808080',
+ gutterBorder: '1px solid #ffffff10',
+ lineHighlight: '#B9D2FF30',
+};
+
+export const basicDarkInit = (options?: Partial) => {
+ const { theme = 'dark', settings = {}, styles = [] } = options || {};
+ return createTheme({
+ theme: theme,
+ settings: {
+ ...defaultSettingsBasicDark,
+ ...settings,
+ },
+ styles: [
+ { tag: t.keyword, color: '#fda331' },
+ {
+ tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
+ color: '#b5bd68',
+ },
+ { tag: [t.variableName], color: '#6fb3d2' },
+ { tag: [t.function(t.variableName)], color: '#fda331' },
+ { tag: [t.labelName], color: '#fc6d24' },
+ {
+ tag: [t.color, t.constant(t.name), t.standard(t.name)],
+ color: '#fda331',
+ },
+ { tag: [t.definition(t.name), t.separator], color: '#cc99cc' },
+ { tag: [t.brace], color: '#cc99cc' },
+ {
+ tag: [t.annotation],
+ color: '#fc6d24',
+ },
+ {
+ tag: [t.number, t.changed, t.annotation, t.modifier, t.self, t.namespace],
+ color: '#fda331',
+ },
+ {
+ tag: [t.typeName, t.className],
+ color: '#6fb3d2',
+ },
+ {
+ tag: [t.operator, t.operatorKeyword],
+ color: '#cc99cc',
+ },
+ {
+ tag: [t.tagName],
+ color: '#fda331',
+ },
+ {
+ tag: [t.squareBracket],
+ color: '#cc99cc',
+ },
+ {
+ tag: [t.angleBracket],
+ color: '#cc99cc',
+ },
+ {
+ tag: [t.attributeName],
+ color: '#6fb3d2',
+ },
+ {
+ tag: [t.regexp],
+ color: '#fda331',
+ },
+ {
+ tag: [t.quote],
+ color: '#DDDDDD',
+ },
+ { tag: [t.string], color: '#b5bd68' },
+ {
+ tag: t.link,
+ color: '#6987AF',
+ textDecoration: 'underline',
+ textUnderlinePosition: 'under',
+ },
+ {
+ tag: [t.url, t.escape, t.special(t.string)],
+ color: '#8abeb7',
+ },
+ { tag: [t.meta], color: '#A54543' },
+ { tag: [t.comment], color: '#808080', fontStyle: 'italic' },
+ { tag: t.monospace, color: '#DDDDDD' },
+ { tag: t.strong, fontWeight: 'bold', color: '#fda331' },
+ { tag: t.emphasis, fontStyle: 'italic', color: '#6fb3d2' },
+ { tag: t.strikethrough, textDecoration: 'line-through' },
+ { tag: t.heading, fontWeight: 'bold', color: '#DDDDDD' },
+ { tag: t.special(t.heading1), fontWeight: 'bold', color: '#DDDDDD' },
+ { tag: t.heading1, fontWeight: 'bold', color: '#DDDDDD' },
+ {
+ tag: [t.heading2, t.heading3, t.heading4],
+ fontWeight: 'bold',
+ color: '#DDDDDD',
+ },
+ {
+ tag: [t.heading5, t.heading6],
+ color: '#DDDDDD',
+ },
+ { tag: [t.atom, t.bool, t.special(t.variableName)], color: '#8abeb7' },
+ {
+ tag: [t.processingInstruction, t.inserted],
+ color: '#8abeb7',
+ },
+ {
+ tag: [t.contentSeparator],
+ color: '#6fb3d2',
+ },
+ { tag: t.invalid, color: '#B9D2FF', borderBottom: `1px dotted ${'#fc6d24'}` },
+ ...styles,
+ ],
+ });
+};
+
+export const basicDark = basicDarkInit();
diff --git a/themes/basic/src/index.ts b/themes/basic/src/index.ts
new file mode 100644
index 000000000..4100599d4
--- /dev/null
+++ b/themes/basic/src/index.ts
@@ -0,0 +1,2 @@
+export * from './dark';
+export * from './light';
diff --git a/themes/basic/src/light.ts b/themes/basic/src/light.ts
new file mode 100644
index 000000000..89c27fc3b
--- /dev/null
+++ b/themes/basic/src/light.ts
@@ -0,0 +1,122 @@
+import { tags as t } from '@lezer/highlight';
+import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
+
+export const defaultSettingsBasicLight: CreateThemeOptions['settings'] = {
+ background: '#ffffff',
+ foreground: '#2e3440',
+ caret: '#3b4252',
+ selection: '#eceff4',
+ selectionMatch: '#e5e9f0',
+ gutterBackground: '#eceff4',
+ gutterForeground: '#2e3440',
+ gutterBorder: 'none',
+ lineHighlight: '#eceff4',
+};
+
+export const basicLightInit = (options?: Partial) => {
+ const { theme = 'light', settings = {}, styles = [] } = options || {};
+ return createTheme({
+ theme: theme,
+ settings: {
+ ...defaultSettingsBasicLight,
+ ...settings,
+ },
+ styles: [
+ { tag: t.keyword, color: '#5e81ac' },
+ {
+ tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
+ color: '#d08770',
+ },
+ { tag: [t.variableName], color: '#d08770' },
+ { tag: [t.function(t.variableName)], color: '#5e81ac' },
+ { tag: [t.labelName], color: '#81a1c1' },
+ {
+ tag: [t.color, t.constant(t.name), t.standard(t.name)],
+ color: '#5e81ac',
+ },
+ { tag: [t.definition(t.name), t.separator], color: '#a3be8c' },
+ { tag: [t.brace], color: '#8fbcbb' },
+ {
+ tag: [t.annotation],
+ color: '#d30102',
+ },
+ {
+ tag: [t.number, t.changed, t.annotation, t.modifier, t.self, t.namespace],
+ color: '#88c0d0',
+ },
+ {
+ tag: [t.typeName, t.className],
+ color: '#ebcb8b',
+ },
+ {
+ tag: [t.operator, t.operatorKeyword],
+ color: '#a3be8c',
+ },
+ {
+ tag: [t.tagName],
+ color: '#b48ead',
+ },
+ {
+ tag: [t.squareBracket],
+ color: '#bf616a',
+ },
+ {
+ tag: [t.angleBracket],
+ color: '#d08770',
+ },
+ {
+ tag: [t.attributeName],
+ color: '#ebcb8b',
+ },
+ {
+ tag: [t.regexp],
+ color: '#5e81ac',
+ },
+ {
+ tag: [t.quote],
+ color: '#3b4252',
+ },
+ { tag: [t.string], color: '#d08770' },
+ {
+ tag: t.link,
+ color: '#8fbcbb',
+ textDecoration: 'underline',
+ textUnderlinePosition: 'under',
+ },
+ {
+ tag: [t.url, t.escape, t.special(t.string)],
+ color: '#d08770',
+ },
+ { tag: [t.meta], color: '#88c0d0' },
+ { tag: [t.comment], color: '#434c5e', fontStyle: 'italic' },
+ { tag: t.strong, fontWeight: 'bold', color: '#5e81ac' },
+ { tag: t.emphasis, fontStyle: 'italic', color: '#5e81ac' },
+ { tag: t.strikethrough, textDecoration: 'line-through' },
+ { tag: t.heading, fontWeight: 'bold', color: '#5e81ac' },
+ { tag: t.special(t.heading1), fontWeight: 'bold', color: '#5e81ac' },
+ { tag: t.heading1, fontWeight: 'bold', color: '#5e81ac' },
+ {
+ tag: [t.heading2, t.heading3, t.heading4],
+ fontWeight: 'bold',
+ color: '#5e81ac',
+ },
+ {
+ tag: [t.heading5, t.heading6],
+ color: '#5e81ac',
+ },
+ { tag: [t.atom, t.bool, t.special(t.variableName)], color: '#d08770' },
+ {
+ tag: [t.processingInstruction, t.inserted],
+ color: '#8fbcbb',
+ },
+ {
+ tag: [t.contentSeparator],
+ color: '#ebcb8b',
+ },
+ { tag: t.invalid, color: '#434c5e', borderBottom: '1px dotted #d30102' },
+ ...styles,
+ ],
+ });
+};
+
+export const basicLight = basicLightInit();
diff --git a/themes/basic/tsconfig.json b/themes/basic/tsconfig.json
new file mode 100644
index 000000000..d72ec3d49
--- /dev/null
+++ b/themes/basic/tsconfig.json
@@ -0,0 +1,9 @@
+{
+ "extends": "../../tsconfig",
+ "include": ["src"],
+ "compilerOptions": {
+ "outDir": "./cjs",
+ "baseUrl": ".",
+ "noEmit": false
+ }
+}
diff --git a/www/package.json b/www/package.json
index 1a05ddac6..acccb96b3 100644
--- a/www/package.json
+++ b/www/package.json
@@ -48,6 +48,7 @@
"@uiw/codemirror-theme-androidstudio": "4.21.9",
"@uiw/codemirror-theme-atomone": "4.21.9",
"@uiw/codemirror-theme-aura": "4.21.9",
+ "@uiw/codemirror-theme-basic": "4.21.9",
"@uiw/codemirror-theme-bbedit": "4.21.9",
"@uiw/codemirror-theme-bespin": "4.21.9",
"@uiw/codemirror-theme-darcula": "4.21.9",
diff --git a/www/src/pages/theme/themes/Datas.ts b/www/src/pages/theme/themes/Datas.ts
index 78febb5ac..bb1426420 100644
--- a/www/src/pages/theme/themes/Datas.ts
+++ b/www/src/pages/theme/themes/Datas.ts
@@ -2,6 +2,7 @@ import { abcdef } from '@uiw/codemirror-theme-abcdef';
import { androidstudio } from '@uiw/codemirror-theme-androidstudio';
import { atomone } from '@uiw/codemirror-theme-atomone';
import { aura } from '@uiw/codemirror-theme-aura';
+import { basicLight, basicDark } from '@uiw/codemirror-theme-basic';
import { bbedit } from '@uiw/codemirror-theme-bbedit';
import { dracula } from '@uiw/codemirror-theme-dracula';
import { darcula } from '@uiw/codemirror-theme-darcula';
@@ -27,6 +28,8 @@ export const themeData = {
androidstudio,
atomone,
aura,
+ basicLight,
+ basicDark,
bbedit,
bespin,
darcula,
diff --git a/www/src/router.tsx b/www/src/router.tsx
index f921cb8b4..fc4d94602 100644
--- a/www/src/router.tsx
+++ b/www/src/router.tsx
@@ -237,6 +237,32 @@ export const routes: MenuRouteObject[] = [
/>
),
},
+ {
+ path: 'data/basic',
+ element: ,
+ },
+ {
+ path: 'data/basic/light',
+ label: 'Basic Light',
+ element: (
+ import('@uiw/codemirror-theme-basic/README.md')}
+ />
+ ),
+ },
+ {
+ path: 'data/basic/dark',
+ label: 'Basic Dark',
+ element: (
+ import('@uiw/codemirror-theme-basic/README.md')}
+ />
+ ),
+ },
{
path: 'data/bespin',
label: 'bespin',