@fe-free/core 1.4.13 → 1.4.15

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @fe-free/core
 
+## 1.4.15
+
+### Patch Changes
+
+- feat: editor
+  - @fe-free/tool@1.4.15
+
+## 1.4.14
+
+### Patch Changes
+
+- feat: editor
+  - @fe-free/tool@1.4.14
+
 ## 1.4.13
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/core",
-  "version": "1.4.13",
+  "version": "1.4.15",
   "description": "",
   "main": "./src/index.ts",
   "author": "",
@@ -22,6 +22,7 @@
     "@codemirror/language": "^6.10.3",
     "@codemirror/view": "^6.33.0",
     "@lezer/highlight": "^1.2.1",
+    "@uiw/codemirror-theme-basic": "^4.23.12",
     "@uiw/codemirror-themes": "^4.23.12",
     "@uiw/react-codemirror": "^4.23.12",
     "ace-builds": "^1.33.1",
@@ -35,7 +36,7 @@
     "react-syntax-highlighter": "^15.5.0",
     "vanilla-jsoneditor": "^0.23.1",
     "zustand": "^4.5.4",
-    "@fe-free/tool": "1.4.13"
+    "@fe-free/tool": "1.4.15"
   },
   "peerDependencies": {
     "@ant-design/pro-components": "^2.8.7",

package/src/editor/editor.stories.tsx

@@ -39,6 +39,14 @@ export const ReadOnly: Story = {
   render: (props) => <BasicDemo {...props} />,
 };
 
+export const Wrap: Story = {
+  args: {
+    value:
+      'hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!hello world!',
+  },
+  render: (props) => <BasicDemo {...props} />,
+};
+
 // 不可编辑模式
 export const Editable: Story = {
   args: {

package/src/editor/index.tsx

@@ -2,6 +2,8 @@ import { javascript } from '@codemirror/lang-javascript';
 import { json } from '@codemirror/lang-json';
 import { markdown } from '@codemirror/lang-markdown';
 import { python } from '@codemirror/lang-python';
+import { EditorView } from '@codemirror/view';
+import { basicDarkInit } from '@uiw/codemirror-theme-basic/dark';
 import type { ReactCodeMirrorProps } from '@uiw/react-codemirror';
 import CodeMirror from '@uiw/react-codemirror';
 import { useCallback, useMemo } from 'react';
@@ -23,6 +25,13 @@ interface EditorProps {
   extensions?: ReactCodeMirrorProps['extensions'];
 }
 
+const defaultTheme = basicDarkInit({
+  settings: {
+    caret: '#c6c6c6',
+    fontFamily: 'monospace',
+  },
+});
+
 function Editor(props: EditorProps) {
   const {
     language,
@@ -34,12 +43,12 @@ function Editor(props: EditorProps) {
     placeholder,
     height,
     width,
-    theme,
+    theme = defaultTheme,
     extensions: originExtensions,
   } = props;
 
   const extensions = useMemo(() => {
-    const result: ReactCodeMirrorProps['extensions'] = [];
+    const result: ReactCodeMirrorProps['extensions'] = [EditorView.lineWrapping];
 
     if (originExtensions) {
       result.push(...originExtensions);