@easyv/biz-components 0.0.56 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/_virtual/index.es2.js +2 -2
- package/dist/_virtual/index.es3.js +2 -2
- package/dist/_virtual/index.es4.js +2 -2
- package/dist/components/easyv-monaco-editor/easyv-monaco-editor.d.ts +3 -2
- package/dist/components/easyv-monaco-editor/easyv-monaco-editor.es.js +66 -13
- package/dist/components/easyv-monaco-editor/easyv-monaco-editor.es.js.map +1 -1
- package/dist/components/easyv-monaco-editor/types.d.ts +17 -8
- package/dist/node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.es.js +1 -1
- package/dist/node_modules/.pnpm/co-web-worker@1.0.1/node_modules/co-web-worker/index.es.js +1 -1
- package/dist/node_modules/.pnpm/prop-types@15.8.1/node_modules/prop-types/index.es.js +1 -1
- package/dist/stats.html +1 -1
- package/package.json +1 -1
|
@@ -1,3 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { EasyvMonacoEditorProps, EasyvMonacoEditorRef } from './types';
|
|
2
3
|
|
|
3
|
-
export declare
|
|
4
|
+
export declare const EasyvMonacoEditor: React.ForwardRefExoticComponent<EasyvMonacoEditorProps & React.RefAttributes<EasyvMonacoEditorRef>>;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.es.js";
|
|
2
|
-
import { useRef } from "react";
|
|
2
|
+
import { forwardRef, useRef, useState, useImperativeHandle } from "react";
|
|
3
3
|
import useLatest from "../../node_modules/.pnpm/ahooks@3.8.5_react@18.2.0/node_modules/ahooks/es/useLatest/index.es.js";
|
|
4
4
|
import useMemoizedFn from "../../node_modules/.pnpm/ahooks@3.8.5_react@18.2.0/node_modules/ahooks/es/useMemoizedFn/index.es.js";
|
|
5
5
|
import classNames from "../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.es.js";
|
|
6
6
|
import { useInitialized } from "../../hooks/use-initialized.es.js";
|
|
7
7
|
import { useWatchValue } from "../../hooks/use-watch-value/use-watch-value.es.js";
|
|
8
|
-
function
|
|
8
|
+
function EasyvMonacoEditorCpn(props, ref) {
|
|
9
9
|
const {
|
|
10
10
|
className,
|
|
11
11
|
style,
|
|
@@ -16,20 +16,40 @@ function EasyvMonacoEditor(props) {
|
|
|
16
16
|
monaco,
|
|
17
17
|
onChange: propsOnChange,
|
|
18
18
|
onCodeMark: propsOnCodeMark,
|
|
19
|
+
onFocus: propsOnFocus,
|
|
19
20
|
onBlur: propsOnBlur,
|
|
21
|
+
formatOnBlur,
|
|
20
22
|
ignoreErrorCodes,
|
|
21
23
|
initJSCompilerOptions,
|
|
22
24
|
constructionOptions,
|
|
23
25
|
customTheme,
|
|
24
|
-
onEditorMounted: propsOnEditorMounted
|
|
26
|
+
onEditorMounted: propsOnEditorMounted,
|
|
27
|
+
onError
|
|
25
28
|
} = props;
|
|
26
29
|
const editorRef = useRef(null);
|
|
27
30
|
const editorInstanceRef = useRef();
|
|
28
31
|
const globalDataLibRef = useRef();
|
|
32
|
+
const [isFocus, setIsFocus] = useState(false);
|
|
29
33
|
const onChangeRef = useLatest(propsOnChange);
|
|
30
34
|
const onCodeMarkRef = useLatest(propsOnCodeMark);
|
|
35
|
+
const onFocusRef = useLatest(propsOnFocus);
|
|
31
36
|
const onBlurRef = useLatest(propsOnBlur);
|
|
32
37
|
const onEditorMountedRef = useLatest(propsOnEditorMounted);
|
|
38
|
+
const formatFn = async () => {
|
|
39
|
+
var _a, _b, _c;
|
|
40
|
+
try {
|
|
41
|
+
await ((_b = (_a = editorInstanceRef.current) == null ? void 0 : _a.getAction("editor.action.formatDocument")) == null ? void 0 : _b.run());
|
|
42
|
+
return (_c = editorInstanceRef.current) == null ? void 0 : _c.getValue();
|
|
43
|
+
} catch (error) {
|
|
44
|
+
onError == null ? void 0 : onError(error);
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
useImperativeHandle(ref, () => {
|
|
48
|
+
return {
|
|
49
|
+
editor: editorInstanceRef.current,
|
|
50
|
+
format: formatFn
|
|
51
|
+
};
|
|
52
|
+
});
|
|
33
53
|
const initFn = useMemoizedFn(() => {
|
|
34
54
|
var _a;
|
|
35
55
|
monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
|
|
@@ -93,14 +113,26 @@ function EasyvMonacoEditor(props) {
|
|
|
93
113
|
(_a2 = onCodeMarkRef.current) == null ? void 0 : _a2.call(onCodeMarkRef, markers);
|
|
94
114
|
});
|
|
95
115
|
}
|
|
96
|
-
const
|
|
116
|
+
const focusDisposable = editorInstanceRef.current.onDidFocusEditorText(() => {
|
|
97
117
|
var _a2;
|
|
98
|
-
|
|
99
|
-
(_a2 =
|
|
118
|
+
setIsFocus(true);
|
|
119
|
+
(_a2 = onFocusRef.current) == null ? void 0 : _a2.call(onFocusRef);
|
|
120
|
+
});
|
|
121
|
+
const blurDisposable = editorInstanceRef.current.onDidBlurEditorText(async () => {
|
|
122
|
+
var _a2, _b;
|
|
123
|
+
setIsFocus(false);
|
|
124
|
+
if (formatOnBlur) {
|
|
125
|
+
const currentValue = await formatFn();
|
|
126
|
+
(_a2 = onBlurRef.current) == null ? void 0 : _a2.call(onBlurRef, currentValue || "");
|
|
127
|
+
} else {
|
|
128
|
+
const currentValue = editorInstanceRef.current.getValue();
|
|
129
|
+
(_b = onBlurRef.current) == null ? void 0 : _b.call(onBlurRef, currentValue);
|
|
130
|
+
}
|
|
100
131
|
});
|
|
101
132
|
return () => {
|
|
102
133
|
var _a2;
|
|
103
|
-
|
|
134
|
+
focusDisposable.dispose();
|
|
135
|
+
blurDisposable.dispose();
|
|
104
136
|
(_a2 = editorInstanceRef.current) == null ? void 0 : _a2.dispose();
|
|
105
137
|
};
|
|
106
138
|
});
|
|
@@ -128,13 +160,21 @@ function EasyvMonacoEditor(props) {
|
|
|
128
160
|
}
|
|
129
161
|
});
|
|
130
162
|
useWatchValue({
|
|
131
|
-
value: monacoEditorOptions,
|
|
163
|
+
value: { monacoEditorOptions, isFocus },
|
|
132
164
|
callback: () => {
|
|
133
165
|
var _a;
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
166
|
+
(_a = editorInstanceRef.current) == null ? void 0 : _a.updateOptions({
|
|
167
|
+
wordWrap: "on",
|
|
168
|
+
/** 让下面不显示空白区域 */
|
|
169
|
+
scrollBeyondLastLine: false,
|
|
170
|
+
tabSize: 2,
|
|
171
|
+
...monacoEditorOptions,
|
|
172
|
+
scrollbar: {
|
|
173
|
+
// 默认让聚焦时,内部滚动,失焦时不滚动
|
|
174
|
+
handleMouseWheel: isFocus ? true : false,
|
|
175
|
+
...monacoEditorOptions == null ? void 0 : monacoEditorOptions.scrollbar
|
|
176
|
+
}
|
|
177
|
+
});
|
|
138
178
|
},
|
|
139
179
|
options: { immediate: true }
|
|
140
180
|
});
|
|
@@ -167,8 +207,21 @@ function EasyvMonacoEditor(props) {
|
|
|
167
207
|
immediate: true
|
|
168
208
|
}
|
|
169
209
|
});
|
|
170
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
210
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
211
|
+
"div",
|
|
212
|
+
{
|
|
213
|
+
ref: editorRef,
|
|
214
|
+
className: classNames("biz-min-h-[200px]", className),
|
|
215
|
+
style: {
|
|
216
|
+
border: "1px solid #393b4a",
|
|
217
|
+
width: "100%",
|
|
218
|
+
height: "100%",
|
|
219
|
+
...style
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
);
|
|
171
223
|
}
|
|
224
|
+
const EasyvMonacoEditor = forwardRef(EasyvMonacoEditorCpn);
|
|
172
225
|
export {
|
|
173
226
|
EasyvMonacoEditor
|
|
174
227
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"easyv-monaco-editor.es.js","sources":["../../../src/components/easyv-monaco-editor/easyv-monaco-editor.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { useLatest, useMemoizedFn } from 'ahooks';\nimport classNames from 'classnames';\nimport type * as monacoType from 'monaco-editor/esm/vs/editor/editor.api';\nimport { useInitialized, useWatchValue } from '@/hooks';\nimport { EasyvMonacoEditorProps } from './types';\n\nexport function EasyvMonacoEditor(props: EasyvMonacoEditorProps) {\n const {\n className,\n style,\n languageMode,\n code,\n monacoEditorOptions,\n globalVarType = '',\n monaco,\n onChange: propsOnChange,\n onCodeMark: propsOnCodeMark,\n onBlur: propsOnBlur,\n ignoreErrorCodes,\n initJSCompilerOptions,\n constructionOptions,\n customTheme,\n onEditorMounted: propsOnEditorMounted,\n } = props;\n const editorRef = useRef<HTMLDivElement | null>(null);\n const editorInstanceRef = useRef<monacoType.editor.IStandaloneCodeEditor>();\n const globalDataLibRef = useRef<monacoType.IDisposable>();\n\n const onChangeRef = useLatest(propsOnChange);\n const onCodeMarkRef = useLatest(propsOnCodeMark);\n const onBlurRef = useLatest(propsOnBlur);\n const onEditorMountedRef = useLatest(propsOnEditorMounted);\n\n const initFn = useMemoizedFn(() => {\n // 配置 JavaScript 语言服务\n monaco.languages.typescript.javascriptDefaults.setCompilerOptions({\n target: monaco.languages.typescript.ScriptTarget.ESNext,\n allowNonTsExtensions: true,\n allowJs: true,\n checkJs: true, // 关键:启用 JS 校验\n noLib: false,\n lib: ['esnext', 'dom'], // dom 会带上浏览器里可使用的方法 如 console, window\n typeRoots: ['node_modules/@types'],\n ...initJSCompilerOptions,\n });\n\n monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({\n noSemanticValidation: false, // 启用语义校验\n noSyntaxValidation: false, // 启用语法校验\n diagnosticCodesToIgnore: ignoreErrorCodes ?? [], // 忽略特定错误\n });\n\n if (editorRef.current) {\n editorInstanceRef.current = monaco.editor.create(editorRef.current, {\n value: code,\n language: languageMode,\n theme: 'vs-dark',\n automaticLayout: true,\n minimap: {\n enabled: false,\n },\n // 启用智能提示的关键设置\n suggest: {\n showKeywords: true, // 关键字建议\n showSnippets: true, // 代码片段建议\n },\n quickSuggestions: true, // 在输入时自动显示建议列表\n suggestOnTriggerCharacters: true, // 当输入触发字符(如点号.)时自动显示建议\n hover: { enabled: true }, // 必须启用 hover\n renderValidationDecorations: 'on', // 确保错误渲染开启\n ...constructionOptions,\n });\n if (!editorInstanceRef.current) {\n return;\n }\n onEditorMountedRef.current?.(editorInstanceRef.current);\n editorInstanceRef.current.onDidChangeModelContent(() => {\n const currentValue = editorInstanceRef.current!.getValue();\n // 更新状态\n onChangeRef.current?.(currentValue);\n });\n\n // 监听诊断变化\n monaco.editor.onDidChangeMarkers(() => {\n const markers = monaco.editor.getModelMarkers({});\n onCodeMarkRef.current?.(markers);\n });\n }\n // 添加失焦事件监听\n const disposable = editorInstanceRef.current!.onDidBlurEditorText(() => {\n const currentValue = editorInstanceRef.current!.getValue();\n onBlurRef.current?.(currentValue);\n });\n return () => {\n disposable.dispose();\n editorInstanceRef.current?.dispose();\n };\n });\n\n useInitialized(initFn);\n\n useWatchValue({\n value: code,\n callback: () => {\n if (editorInstanceRef.current) {\n // 获取当前编辑器的值\n const currentValue = editorInstanceRef.current.getValue();\n // 如果状态中的value和编辑器的当前值不同,则更新编辑器\n if (currentValue !== code) {\n editorInstanceRef.current.setValue(code);\n }\n }\n },\n });\n\n useWatchValue({\n value: languageMode,\n callback(newLanguage) {\n const model = editorInstanceRef.current?.getModel();\n if (!model) {\n return;\n }\n monaco.editor.setModelLanguage(model, newLanguage);\n },\n });\n\n useWatchValue({\n value: monacoEditorOptions,\n callback: () => {\n if (!monacoEditorOptions) {\n return;\n }\n editorInstanceRef.current?.updateOptions(monacoEditorOptions);\n },\n options: { immediate: true },\n });\n\n useWatchValue({\n value: globalVarType,\n callback() {\n if (globalDataLibRef.current) {\n globalDataLibRef.current.dispose();\n }\n globalDataLibRef.current = monaco.languages.typescript.javascriptDefaults.addExtraLib(\n globalVarType,\n 'global-data.d.ts',\n );\n },\n options: {\n immediate: true,\n },\n });\n\n useWatchValue({\n value: customTheme,\n callback() {\n if (!customTheme) {\n return;\n }\n const themeName = 'customTheme';\n monaco.editor.defineTheme(themeName, customTheme);\n monaco.editor.setTheme(themeName);\n },\n options: {\n immediate: true,\n },\n });\n\n return (\n <div ref={editorRef} className={classNames('biz-min-h-[200px]', className)} style={style} />\n );\n}\n"],"names":["_a","jsx"],"mappings":";;;;;;;AAOO,SAAS,kBAAkB,OAA+B;AACzD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB;AAAA,IACA,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,EAAA,IACf;AACE,QAAA,YAAY,OAA8B,IAAI;AACpD,QAAM,oBAAoB,OAAgD;AAC1E,QAAM,mBAAmB,OAA+B;AAElD,QAAA,cAAc,UAAU,aAAa;AACrC,QAAA,gBAAgB,UAAU,eAAe;AACzC,QAAA,YAAY,UAAU,WAAW;AACjC,QAAA,qBAAqB,UAAU,oBAAoB;AAEnD,QAAA,SAAS,cAAc,MAAM;;AAE1B,WAAA,UAAU,WAAW,mBAAmB,mBAAmB;AAAA,MAChE,QAAQ,OAAO,UAAU,WAAW,aAAa;AAAA,MACjD,sBAAsB;AAAA,MACtB,SAAS;AAAA,MACT,SAAS;AAAA;AAAA,MACT,OAAO;AAAA,MACP,KAAK,CAAC,UAAU,KAAK;AAAA;AAAA,MACrB,WAAW,CAAC,qBAAqB;AAAA,MACjC,GAAG;AAAA,IAAA,CACJ;AAEM,WAAA,UAAU,WAAW,mBAAmB,sBAAsB;AAAA,MACnE,sBAAsB;AAAA;AAAA,MACtB,oBAAoB;AAAA;AAAA,MACpB,yBAAyB,oBAAoB,CAAA;AAAA;AAAA,IAAC,CAC/C;AAED,QAAI,UAAU,SAAS;AACrB,wBAAkB,UAAU,OAAO,OAAO,OAAO,UAAU,SAAS;AAAA,QAClE,OAAO;AAAA,QACP,UAAU;AAAA,QACV,OAAO;AAAA,QACP,iBAAiB;AAAA,QACjB,SAAS;AAAA,UACP,SAAS;AAAA,QACX;AAAA;AAAA,QAEA,SAAS;AAAA,UACP,cAAc;AAAA;AAAA,UACd,cAAc;AAAA;AAAA,QAChB;AAAA,QACA,kBAAkB;AAAA;AAAA,QAClB,4BAA4B;AAAA;AAAA,QAC5B,OAAO,EAAE,SAAS,KAAK;AAAA;AAAA,QACvB,6BAA6B;AAAA;AAAA,QAC7B,GAAG;AAAA,MAAA,CACJ;AACG,UAAA,CAAC,kBAAkB,SAAS;AAC9B;AAAA,MAAA;AAEiB,+BAAA,YAAA,4CAAU,kBAAkB;AAC7B,wBAAA,QAAQ,wBAAwB,MAAM;;AAChD,cAAA,eAAe,kBAAkB,QAAS,SAAS;AAEzD,SAAAA,MAAA,YAAY,YAAZ,gBAAAA,IAAA,kBAAsB;AAAA,MAAY,CACnC;AAGM,aAAA,OAAO,mBAAmB,MAAM;;AACrC,cAAM,UAAU,OAAO,OAAO,gBAAgB,CAAA,CAAE;AAChD,SAAAA,MAAA,cAAc,YAAd,gBAAAA,IAAA,oBAAwB;AAAA,MAAO,CAChC;AAAA,IAAA;AAGH,UAAM,aAAa,kBAAkB,QAAS,oBAAoB,MAAM;;AAChE,YAAA,eAAe,kBAAkB,QAAS,SAAS;AACzD,OAAAA,MAAA,UAAU,YAAV,gBAAAA,IAAA,gBAAoB;AAAA,IAAY,CACjC;AACD,WAAO,MAAM;;AACX,iBAAW,QAAQ;AACnB,OAAAA,MAAA,kBAAkB,YAAlB,gBAAAA,IAA2B;AAAA,IAC7B;AAAA,EAAA,CACD;AAED,iBAAe,MAAM;AAEP,gBAAA;AAAA,IACZ,OAAO;AAAA,IACP,UAAU,MAAM;AACd,UAAI,kBAAkB,SAAS;AAEvB,cAAA,eAAe,kBAAkB,QAAQ,SAAS;AAExD,YAAI,iBAAiB,MAAM;AACP,4BAAA,QAAQ,SAAS,IAAI;AAAA,QAAA;AAAA,MACzC;AAAA,IACF;AAAA,EACF,CACD;AAEa,gBAAA;AAAA,IACZ,OAAO;AAAA,IACP,SAAS,aAAa;;AACd,YAAA,SAAQ,uBAAkB,YAAlB,mBAA2B;AACzC,UAAI,CAAC,OAAO;AACV;AAAA,MAAA;AAEK,aAAA,OAAO,iBAAiB,OAAO,WAAW;AAAA,IAAA;AAAA,EACnD,CACD;AAEa,gBAAA;AAAA,IACZ,OAAO;AAAA,IACP,UAAU,MAAM;;AACd,UAAI,CAAC,qBAAqB;AACxB;AAAA,MAAA;AAEgB,8BAAA,YAAA,mBAAS,cAAc;AAAA,IAC3C;AAAA,IACA,SAAS,EAAE,WAAW,KAAK;AAAA,EAAA,CAC5B;AAEa,gBAAA;AAAA,IACZ,OAAO;AAAA,IACP,WAAW;AACT,UAAI,iBAAiB,SAAS;AAC5B,yBAAiB,QAAQ,QAAQ;AAAA,MAAA;AAEnC,uBAAiB,UAAU,OAAO,UAAU,WAAW,mBAAmB;AAAA,QACxE;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,IACA,SAAS;AAAA,MACP,WAAW;AAAA,IAAA;AAAA,EACb,CACD;AAEa,gBAAA;AAAA,IACZ,OAAO;AAAA,IACP,WAAW;AACT,UAAI,CAAC,aAAa;AAChB;AAAA,MAAA;AAEF,YAAM,YAAY;AACX,aAAA,OAAO,YAAY,WAAW,WAAW;AACzC,aAAA,OAAO,SAAS,SAAS;AAAA,IAClC;AAAA,IACA,SAAS;AAAA,MACP,WAAW;AAAA,IAAA;AAAA,EACb,CACD;AAGC,SAAAC,sCAAC,SAAI,KAAK,WAAW,WAAW,WAAW,qBAAqB,SAAS,GAAG,MAAc,CAAA;AAE9F;"}
|
|
1
|
+
{"version":3,"file":"easyv-monaco-editor.es.js","sources":["../../../src/components/easyv-monaco-editor/easyv-monaco-editor.tsx"],"sourcesContent":["import React, { forwardRef, Ref, useImperativeHandle, useRef, useState } from 'react';\nimport { useLatest, useMemoizedFn } from 'ahooks';\nimport classNames from 'classnames';\nimport type * as monacoType from 'monaco-editor/esm/vs/editor/editor.api';\nimport { useInitialized, useWatchValue } from '@/hooks';\nimport { EasyvMonacoEditorProps, EasyvMonacoEditorRef } from './types';\n\nfunction EasyvMonacoEditorCpn(props: EasyvMonacoEditorProps, ref: Ref<EasyvMonacoEditorRef>) {\n const {\n className,\n style,\n languageMode,\n code,\n monacoEditorOptions,\n globalVarType = '',\n monaco,\n onChange: propsOnChange,\n onCodeMark: propsOnCodeMark,\n onFocus: propsOnFocus,\n onBlur: propsOnBlur,\n formatOnBlur,\n ignoreErrorCodes,\n initJSCompilerOptions,\n constructionOptions,\n customTheme,\n onEditorMounted: propsOnEditorMounted,\n onError,\n } = props;\n const editorRef = useRef<HTMLDivElement | null>(null);\n const editorInstanceRef = useRef<monacoType.editor.IStandaloneCodeEditor>();\n const globalDataLibRef = useRef<monacoType.IDisposable>();\n const [isFocus, setIsFocus] = useState(false);\n\n const onChangeRef = useLatest(propsOnChange);\n const onCodeMarkRef = useLatest(propsOnCodeMark);\n const onFocusRef = useLatest(propsOnFocus);\n const onBlurRef = useLatest(propsOnBlur);\n const onEditorMountedRef = useLatest(propsOnEditorMounted);\n\n const formatFn = async () => {\n try {\n await editorInstanceRef.current?.getAction('editor.action.formatDocument')?.run();\n return editorInstanceRef.current?.getValue();\n } catch (error) {\n onError?.(error as Error);\n }\n };\n\n useImperativeHandle(ref, () => {\n return {\n editor: editorInstanceRef.current,\n format: formatFn,\n };\n });\n\n const initFn = useMemoizedFn(() => {\n // 配置 JavaScript 语言服务\n monaco.languages.typescript.javascriptDefaults.setCompilerOptions({\n target: monaco.languages.typescript.ScriptTarget.ESNext,\n allowNonTsExtensions: true,\n allowJs: true,\n checkJs: true, // 关键:启用 JS 校验\n noLib: false,\n lib: ['esnext', 'dom'], // dom 会带上浏览器里可使用的方法 如 console, window\n typeRoots: ['node_modules/@types'],\n ...initJSCompilerOptions,\n });\n\n monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({\n noSemanticValidation: false, // 启用语义校验\n noSyntaxValidation: false, // 启用语法校验\n diagnosticCodesToIgnore: ignoreErrorCodes ?? [], // 忽略特定错误\n });\n\n if (editorRef.current) {\n editorInstanceRef.current = monaco.editor.create(editorRef.current, {\n value: code,\n language: languageMode,\n theme: 'vs-dark',\n automaticLayout: true,\n minimap: {\n enabled: false,\n },\n // 启用智能提示的关键设置\n suggest: {\n showKeywords: true, // 关键字建议\n showSnippets: true, // 代码片段建议\n },\n quickSuggestions: true, // 在输入时自动显示建议列表\n suggestOnTriggerCharacters: true, // 当输入触发字符(如点号.)时自动显示建议\n hover: { enabled: true }, // 必须启用 hover\n renderValidationDecorations: 'on', // 确保错误渲染开启\n ...constructionOptions,\n });\n if (!editorInstanceRef.current) {\n return;\n }\n onEditorMountedRef.current?.(editorInstanceRef.current);\n editorInstanceRef.current.onDidChangeModelContent(() => {\n const currentValue = editorInstanceRef.current!.getValue();\n // 更新状态\n onChangeRef.current?.(currentValue);\n });\n\n // 监听诊断变化\n monaco.editor.onDidChangeMarkers(() => {\n const markers = monaco.editor.getModelMarkers({});\n onCodeMarkRef.current?.(markers);\n });\n }\n // 添加聚焦焦事件监听\n const focusDisposable = editorInstanceRef.current!.onDidFocusEditorText(() => {\n setIsFocus(true);\n onFocusRef.current?.();\n });\n // 添加失焦事件监听\n const blurDisposable = editorInstanceRef.current!.onDidBlurEditorText(async () => {\n setIsFocus(false);\n if (formatOnBlur) {\n const currentValue = await formatFn();\n onBlurRef.current?.(currentValue || '');\n } else {\n const currentValue = editorInstanceRef.current!.getValue();\n onBlurRef.current?.(currentValue);\n }\n });\n return () => {\n focusDisposable.dispose();\n blurDisposable.dispose();\n editorInstanceRef.current?.dispose();\n };\n });\n\n useInitialized(initFn);\n\n useWatchValue({\n value: code,\n callback: () => {\n if (editorInstanceRef.current) {\n // 获取当前编辑器的值\n const currentValue = editorInstanceRef.current.getValue();\n // 如果状态中的value和编辑器的当前值不同,则更新编辑器\n if (currentValue !== code) {\n editorInstanceRef.current.setValue(code);\n }\n }\n },\n });\n\n useWatchValue({\n value: languageMode,\n callback(newLanguage) {\n const model = editorInstanceRef.current?.getModel();\n if (!model) {\n return;\n }\n monaco.editor.setModelLanguage(model, newLanguage);\n },\n });\n\n useWatchValue({\n value: { monacoEditorOptions, isFocus },\n callback: () => {\n editorInstanceRef.current?.updateOptions({\n wordWrap: 'on',\n /** 让下面不显示空白区域 */\n scrollBeyondLastLine: false,\n tabSize: 2,\n ...monacoEditorOptions,\n scrollbar: {\n // 默认让聚焦时,内部滚动,失焦时不滚动\n handleMouseWheel: isFocus ? true : false,\n ...monacoEditorOptions?.scrollbar,\n },\n });\n },\n options: { immediate: true },\n });\n\n useWatchValue({\n value: globalVarType,\n callback() {\n if (globalDataLibRef.current) {\n globalDataLibRef.current.dispose();\n }\n globalDataLibRef.current = monaco.languages.typescript.javascriptDefaults.addExtraLib(\n globalVarType,\n 'global-data.d.ts',\n );\n },\n options: {\n immediate: true,\n },\n });\n\n useWatchValue({\n value: customTheme,\n callback() {\n if (!customTheme) {\n return;\n }\n const themeName = 'customTheme';\n monaco.editor.defineTheme(themeName, customTheme);\n monaco.editor.setTheme(themeName);\n },\n options: {\n immediate: true,\n },\n });\n\n return (\n <div\n ref={editorRef}\n className={classNames('biz-min-h-[200px]', className)}\n style={{\n border: '1px solid #393b4a',\n width: '100%',\n height: '100%',\n ...style,\n }}\n />\n );\n}\n\nexport const EasyvMonacoEditor = forwardRef(EasyvMonacoEditorCpn);\n"],"names":["_a","jsx"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type * as
|
|
1
|
+
import type * as monacoType from 'monaco-editor/esm/vs/editor/editor.api';
|
|
2
2
|
export interface EasyvMonacoEditorProps {
|
|
3
3
|
className?: string;
|
|
4
4
|
style?: React.CSSProperties;
|
|
@@ -66,17 +66,26 @@ export interface EasyvMonacoEditorProps {
|
|
|
66
66
|
],
|
|
67
67
|
```
|
|
68
68
|
*/
|
|
69
|
-
monaco: typeof
|
|
69
|
+
monaco: typeof monacoType;
|
|
70
70
|
/** monaco 对代码检查时的错误或者警告等等。 */
|
|
71
|
-
onCodeMark?: (errors:
|
|
71
|
+
onCodeMark?: (errors: monacoType.editor.IMarker[]) => void;
|
|
72
|
+
onFocus?: () => void;
|
|
72
73
|
onBlur?: (code: string) => void;
|
|
74
|
+
/** 是否在失焦时格式化代码 */
|
|
75
|
+
formatOnBlur?: boolean;
|
|
73
76
|
/** 校验时,要忽略的错误码。 只在初始化生效 */
|
|
74
77
|
ignoreErrorCodes?: number[];
|
|
75
78
|
/** 初始化时,对 ts/js 语言的编译选项,具体选项可查看类型 */
|
|
76
|
-
initJSCompilerOptions?:
|
|
79
|
+
initJSCompilerOptions?: monacoType.languages.typescript.CompilerOptions;
|
|
77
80
|
/** 新建 monaco-editor 时,传入的配置选项,具体选项可查看类型, 大部分的配置 可以通过传递 monacoEditorOptions 来更新 */
|
|
78
|
-
constructionOptions?: Parameters<typeof
|
|
79
|
-
monacoEditorOptions?:
|
|
80
|
-
customTheme?:
|
|
81
|
-
onEditorMounted?: (editor:
|
|
81
|
+
constructionOptions?: Parameters<typeof monacoType.editor.create>[1];
|
|
82
|
+
monacoEditorOptions?: monacoType.editor.IEditorOptions & monacoType.editor.IGlobalEditorOptions;
|
|
83
|
+
customTheme?: monacoType.editor.IStandaloneThemeData;
|
|
84
|
+
onEditorMounted?: (editor: monacoType.editor.IStandaloneCodeEditor) => void;
|
|
85
|
+
onError?: (error: Error) => void;
|
|
82
86
|
}
|
|
87
|
+
export type MonacoEditorInstance = monacoType.editor.IStandaloneCodeEditor | undefined;
|
|
88
|
+
export type EasyvMonacoEditorRef = {
|
|
89
|
+
editor?: MonacoEditorInstance;
|
|
90
|
+
format: () => Promise<string | undefined>;
|
|
91
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { getDefaultExportFromCjs } from "../../../../../_virtual/_commonjsHelpers.es.js";
|
|
2
|
-
import { __module as classnames$1 } from "../../../../../_virtual/index.
|
|
2
|
+
import { __module as classnames$1 } from "../../../../../_virtual/index.es3.js";
|
|
3
3
|
/*!
|
|
4
4
|
Copyright (c) 2018 Jed Watson.
|
|
5
5
|
Licensed under the MIT License (MIT), see
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { getDefaultExportFromCjs } from "../../../../../_virtual/_commonjsHelpers.es.js";
|
|
2
|
-
import { __module as coWebWorker } from "../../../../../_virtual/index.
|
|
2
|
+
import { __module as coWebWorker } from "../../../../../_virtual/index.es4.js";
|
|
3
3
|
class CrossOriginWorker extends Worker {
|
|
4
4
|
constructor(scriptUrl) {
|
|
5
5
|
const b = new Blob([`importScripts('${new URL(scriptUrl).toString()}')`], { type: "application/javascript" });
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { getDefaultExportFromCjs } from "../../../../../_virtual/_commonjsHelpers.es.js";
|
|
2
|
-
import { __module as propTypes } from "../../../../../_virtual/index.
|
|
2
|
+
import { __module as propTypes } from "../../../../../_virtual/index.es2.js";
|
|
3
3
|
import { __require as requireReactIs } from "../../../react-is@16.13.1/node_modules/react-is/index.es.js";
|
|
4
4
|
import { __require as requireFactoryWithTypeCheckers } from "./factoryWithTypeCheckers.es.js";
|
|
5
5
|
import { __require as requireFactoryWithThrowingShims } from "./factoryWithThrowingShims.es.js";
|