From 36fe72f1562ff24fba6e74fa92c43853a429c8a9 Mon Sep 17 00:00:00 2001 From: "bai.zixv" Date: Thu, 11 Jul 2024 19:37:22 +0800 Subject: [PATCH] feat: codemirror, add theme (#1311) Reviewed-on: https://git.daoyoucloud.com:8443/daoyoucloud/tachybase/pulls/1311 --- packages/core/components/package.json | 1 + .../core/components/src/code-mirror/index.tsx | 2 ++ pnpm-lock.yaml | 25 +++++++++++++++++++ 3 files changed, 28 insertions(+) diff --git a/packages/core/components/package.json b/packages/core/components/package.json index 022be8d3f..63276e9ba 100644 --- a/packages/core/components/package.json +++ b/packages/core/components/package.json @@ -21,6 +21,7 @@ "@formily/reactive-react": "2.3.1", "@formily/shared": "2.3.1", "@formily/validator": "2.3.1", + "@uiw/codemirror-theme-vscode": "^4.23.0", "@uiw/react-codemirror": "^4.22.2", "antd": "5.19.1", "classnames": "^2.5.1", diff --git a/packages/core/components/src/code-mirror/index.tsx b/packages/core/components/src/code-mirror/index.tsx index 73e1f582d..9b4a362b8 100644 --- a/packages/core/components/src/code-mirror/index.tsx +++ b/packages/core/components/src/code-mirror/index.tsx @@ -3,6 +3,7 @@ import { connect } from '@tachybase/schema'; import { autocompletion } from '@codemirror/autocomplete'; import { javascript } from '@codemirror/lang-javascript'; +import { vscodeDark } from '@uiw/codemirror-theme-vscode'; import CM from '@uiw/react-codemirror'; // 定义全局对象和子对象的补全项 @@ -90,6 +91,7 @@ export const CodeMirror = connect(({ value, onChange, ...otherProps }) => { }), ]} height="300px" + theme={vscodeDark} > ); }); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a28ac10fb..1f9bdbd12 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -687,6 +687,9 @@ importers: '@formily/validator': specifier: 2.3.1 version: 2.3.1 + '@uiw/codemirror-theme-vscode': + specifier: ^4.23.0 + version: 4.23.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.28.4) '@uiw/react-codemirror': specifier: ^4.22.2 version: 4.22.2(@babel/runtime@7.24.7)(@codemirror/autocomplete@6.16.3)(@codemirror/language@6.10.2)(@codemirror/lint@6.8.1)(@codemirror/search@6.5.6)(@codemirror/state@6.4.1)(@codemirror/theme-one-dark@6.1.2)(@codemirror/view@6.28.4)(codemirror@6.0.1)(react-dom@18.3.1)(react@18.3.1) @@ -13046,6 +13049,28 @@ packages: '@codemirror/view': 6.28.4 dev: false + /@uiw/codemirror-theme-vscode@4.23.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.28.4): + resolution: {integrity: sha512-zl1FD7U1b58tqlF216jYv2okvVkTe+FP1ztqO/DF129bcH99QjszkakshyfxQEvvF4ys3zyzqZ7vU3VYBir8tg==} + dependencies: + '@uiw/codemirror-themes': 4.23.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.28.4) + transitivePeerDependencies: + - '@codemirror/language' + - '@codemirror/state' + - '@codemirror/view' + dev: false + + /@uiw/codemirror-themes@4.23.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.28.4): + resolution: {integrity: sha512-9fiji9xooZyBQozR1i6iTr56YP7j/Dr/VgsNWbqf5Szv+g+4WM1iZuiDGwNXmFMWX8gbkDzp6ASE21VCPSofWw==} + peerDependencies: + '@codemirror/language': '>=6.0.0' + '@codemirror/state': '>=6.0.0' + '@codemirror/view': '>=6.0.0' + dependencies: + '@codemirror/language': 6.10.2 + '@codemirror/state': 6.4.1 + '@codemirror/view': 6.28.4 + dev: false + /@uiw/react-codemirror@4.22.2(@babel/runtime@7.24.7)(@codemirror/autocomplete@6.16.3)(@codemirror/language@6.10.2)(@codemirror/lint@6.8.1)(@codemirror/search@6.5.6)(@codemirror/state@6.4.1)(@codemirror/theme-one-dark@6.1.2)(@codemirror/view@6.28.4)(codemirror@6.0.1)(react-dom@18.3.1)(react@18.3.1): resolution: {integrity: sha512-okCSl+WJG63gRx8Fdz7v0C6RakBQnbb3pHhuzIgDB+fwhipgFodSnu2n9oOsQesJ5YQ7mSOcKMgX0JEsu4nnfQ==} peerDependencies: