update code

Author: xlorne

apps/app-pc/package.json

@@ -12,15 +12,10 @@
     "@coding-script/script-engine": "workspace:*",
     "antd": "^6.2.1",
     "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "@codemirror/commands": "^6.10.2",
-    "@codemirror/lang-java": "^6.0.2",
-    "@codemirror/language": "^6.12.2",
-    "@codemirror/state": "^6.5.4",
-    "@codemirror/theme-one-dark": "^6.1.3",
-    "@codemirror/view": "^6.39.16"
+    "react-dom": "^18.3.1"
   },
   "devDependencies": {
+    "@coding-script/script-engine": "workspace:*",
     "@rsbuild/core": "^1.7.1",
     "@rsbuild/plugin-react": "^1.4.2",
     "@types/react": "^18.3.18",

apps/app-pc/src/pages/home.tsx

@@ -1,13 +1,13 @@
-import { GroovyCodeEditor } from "@coding-script/script-engine";
+import { ScriptCodeEditor } from "@coding-script/script-engine";
 
 const HomePage = () => {
 
     return (
         <div>
             <h1>Home Page</h1>
-            <GroovyCodeEditor
+            <ScriptCodeEditor
                 value={`println("Hello, World!")`}
-                onChange={(value) => {
+                onChange={(value: string) => {
                     console.log("Code changed:", value);
                 }}
             />

packages/script-engine/package.json

@@ -34,10 +34,16 @@
   },
   "dependencies": {
     "@reduxjs/toolkit": "^2.11.2",
+    "@codemirror/commands": "^6.10.2",
+    "@codemirror/lang-java": "^6.0.2",
+    "@codemirror/language": "^6.12.2",
+    "@codemirror/state": "^6.5.4",
+    "@codemirror/theme-one-dark": "^6.1.3",
+    "@codemirror/view": "^6.39.16",
     "react-redux": "^9.2.0"
   },
   "peerDependencies": {
     "react": ">=18",
     "react-dom": ">=18"
   }
-}
+}

packages/script-engine/src/script-code.tsx

@@ -26,19 +26,8 @@ import {
 import {java} from '@codemirror/lang-java';
 import {oneDark} from '@codemirror/theme-one-dark';
 import {tags} from '@lezer/highlight';
+import { ScriptCodeEditorProps } from './types';
 
-interface GroovyCodeEditorProps {
-    value?: string;
-    readonly?: boolean;
-    onChange?: (value: string) => void;
-    placeholder?: string;
-    theme?: 'dark' | 'light';
-    options?: {
-        fontSize?: number;
-        minHeight?: number;
-        maxHeight?: number;
-    };
-}
 
 const darkHighlightStyle = HighlightStyle.define([
     {tag: tags.keyword, color: '#c678dd'},
@@ -57,7 +46,7 @@ const darkHighlightStyle = HighlightStyle.define([
     {tag: tags.annotation, color: '#d19a66'},
 ]);
 
-export const GroovyCodeEditor: React.FC<GroovyCodeEditorProps> = (props) => {
+export const ScriptCodeEditor: React.FC<ScriptCodeEditorProps> = (props) => {
     const {
         value,
         readonly = false,

packages/script-engine/src/types/index.ts

@@ -0,0 +1,21 @@
+export interface ScriptCodeEditorProps {
+    // 代码内容
+    value?: string;
+    // 是否只读
+    readonly?: boolean;
+    // 代码变化回调
+    onChange?: (value: string) => void;
+    // 占位符
+    placeholder?: string;
+    // 主题
+    theme?: 'dark' | 'light';
+    // 其他选项
+    options?: {
+        // 字体大小
+        fontSize?: number;
+        // 最小高度
+        minHeight?: number;
+        // 最大高度
+        maxHeight?: number;
+    };
+}