@easyv/biz-components 0.0.55 → 1.0.0

package/dist/components/easyv-monaco-editor/easyv-monaco-editor.d.ts

@@ -1,3 +1,4 @@
-import { EasyvMonacoEditorProps } from './types';
+import { default as React } from 'react';
+import { EasyvMonacoEditorProps, EasyvMonacoEditorRef } from './types';
 
-export declare function EasyvMonacoEditor(props: EasyvMonacoEditorProps): JSX.Element;
+export declare const EasyvMonacoEditor: React.ForwardRefExoticComponent<EasyvMonacoEditorProps & React.RefAttributes<EasyvMonacoEditorRef>>;

package/dist/components/easyv-monaco-editor/easyv-monaco-editor.es.js

@@ -1,10 +1,11 @@
 import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.es.js";
-import { useRef } from "react";
+import { forwardRef, useRef, useState, useImperativeHandle } from "react";
+import useLatest from "../../node_modules/.pnpm/ahooks@3.8.5_react@18.2.0/node_modules/ahooks/es/useLatest/index.es.js";
 import useMemoizedFn from "../../node_modules/.pnpm/ahooks@3.8.5_react@18.2.0/node_modules/ahooks/es/useMemoizedFn/index.es.js";
 import classNames from "../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.es.js";
 import { useInitialized } from "../../hooks/use-initialized.es.js";
 import { useWatchValue } from "../../hooks/use-watch-value/use-watch-value.es.js";
-function EasyvMonacoEditor(props) {
+function EasyvMonacoEditorCpn(props, ref) {
   const {
     className,
     style,
@@ -13,18 +14,44 @@ function EasyvMonacoEditor(props) {
     monacoEditorOptions,
     globalVarType = "",
     monaco,
-    onChange,
-    onCodeMark,
-    onBlur,
+    onChange: propsOnChange,
+    onCodeMark: propsOnCodeMark,
+    onFocus: propsOnFocus,
+    onBlur: propsOnBlur,
+    formatOnBlur,
     ignoreErrorCodes,
     initJSCompilerOptions,
     constructionOptions,
-    customTheme
+    customTheme,
+    onEditorMounted: propsOnEditorMounted,
+    onError
   } = props;
   const editorRef = useRef(null);
   const editorInstanceRef = useRef();
   const globalDataLibRef = useRef();
+  const [isFocus, setIsFocus] = useState(false);
+  const onChangeRef = useLatest(propsOnChange);
+  const onCodeMarkRef = useLatest(propsOnCodeMark);
+  const onFocusRef = useLatest(propsOnFocus);
+  const onBlurRef = useLatest(propsOnBlur);
+  const onEditorMountedRef = useLatest(propsOnEditorMounted);
+  const formatFn = async () => {
+    var _a, _b, _c;
+    try {
+      await ((_b = (_a = editorInstanceRef.current) == null ? void 0 : _a.getAction("editor.action.formatDocument")) == null ? void 0 : _b.run());
+      return (_c = editorInstanceRef.current) == null ? void 0 : _c.getValue();
+    } catch (error) {
+      onError == null ? void 0 : onError(error);
+    }
+  };
+  useImperativeHandle(ref, () => {
+    return {
+      editor: editorInstanceRef.current,
+      format: formatFn
+    };
+  });
   const initFn = useMemoizedFn(() => {
+    var _a;
     monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
       target: monaco.languages.typescript.ScriptTarget.ESNext,
       allowNonTsExtensions: true,
@@ -74,23 +101,39 @@ function EasyvMonacoEditor(props) {
       if (!editorInstanceRef.current) {
         return;
       }
+      (_a = onEditorMountedRef.current) == null ? void 0 : _a.call(onEditorMountedRef, editorInstanceRef.current);
       editorInstanceRef.current.onDidChangeModelContent(() => {
+        var _a2;
         const currentValue = editorInstanceRef.current.getValue();
-        onChange == null ? void 0 : onChange(currentValue);
+        (_a2 = onChangeRef.current) == null ? void 0 : _a2.call(onChangeRef, currentValue);
       });
       monaco.editor.onDidChangeMarkers(() => {
+        var _a2;
         const markers = monaco.editor.getModelMarkers({});
-        onCodeMark == null ? void 0 : onCodeMark(markers);
+        (_a2 = onCodeMarkRef.current) == null ? void 0 : _a2.call(onCodeMarkRef, markers);
       });
     }
-    const disposable = editorInstanceRef.current.onDidBlurEditorText(() => {
-      const currentValue = editorInstanceRef.current.getValue();
-      onBlur == null ? void 0 : onBlur(currentValue);
+    const focusDisposable = editorInstanceRef.current.onDidFocusEditorText(() => {
+      var _a2;
+      setIsFocus(true);
+      (_a2 = onFocusRef.current) == null ? void 0 : _a2.call(onFocusRef);
+    });
+    const blurDisposable = editorInstanceRef.current.onDidBlurEditorText(async () => {
+      var _a2, _b;
+      setIsFocus(false);
+      if (formatOnBlur) {
+        const currentValue = await formatFn();
+        (_a2 = onBlurRef.current) == null ? void 0 : _a2.call(onBlurRef, currentValue || "");
+      } else {
+        const currentValue = editorInstanceRef.current.getValue();
+        (_b = onBlurRef.current) == null ? void 0 : _b.call(onBlurRef, currentValue);
+      }
     });
     return () => {
-      var _a;
-      disposable.dispose();
-      (_a = editorInstanceRef.current) == null ? void 0 : _a.dispose();
+      var _a2;
+      focusDisposable.dispose();
+      blurDisposable.dispose();
+      (_a2 = editorInstanceRef.current) == null ? void 0 : _a2.dispose();
     };
   });
   useInitialized(initFn);
@@ -117,13 +160,21 @@ function EasyvMonacoEditor(props) {
     }
   });
   useWatchValue({
-    value: monacoEditorOptions,
+    value: { monacoEditorOptions, isFocus },
     callback: () => {
       var _a;
-      if (!monacoEditorOptions) {
-        return;
-      }
-      (_a = editorInstanceRef.current) == null ? void 0 : _a.updateOptions(monacoEditorOptions);
+      (_a = editorInstanceRef.current) == null ? void 0 : _a.updateOptions({
+        wordWrap: "on",
+        /** 让下面不显示空白区域 */
+        scrollBeyondLastLine: false,
+        tabSize: 2,
+        ...monacoEditorOptions,
+        scrollbar: {
+          // 默认让聚焦时，内部滚动，失焦时不滚动
+          handleMouseWheel: isFocus ? true : false,
+          ...monacoEditorOptions == null ? void 0 : monacoEditorOptions.scrollbar
+        }
+      });
     },
     options: { immediate: true }
   });
@@ -156,8 +207,21 @@ function EasyvMonacoEditor(props) {
       immediate: true
     }
   });
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: editorRef, className: classNames("biz-min-h-[200px]", className), style });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      ref: editorRef,
+      className: classNames("biz-min-h-[200px]", className),
+      style: {
+        border: "1px solid #393b4a",
+        width: "100%",
+        height: "100%",
+        ...style
+      }
+    }
+  );
 }
+const EasyvMonacoEditor = forwardRef(EasyvMonacoEditorCpn);
 export {
   EasyvMonacoEditor
 };

package/dist/components/easyv-monaco-editor/easyv-monaco-editor.es.js.map

@@ -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 { 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,\n    onCodeMark,\n    onBlur,\n    ignoreErrorCodes,\n    initJSCompilerOptions,\n    constructionOptions,\n    customTheme,\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 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      editorInstanceRef.current.onDidChangeModelContent(() => {\n        const currentValue = editorInstanceRef.current!.getValue();\n        // 更新状态\n        onChange?.(currentValue);\n      });\n\n      // 监听诊断变化\n      monaco.editor.onDidChangeMarkers(() => {\n        const markers = monaco.editor.getModelMarkers({});\n        onCodeMark?.(markers);\n      });\n    }\n    // 添加失焦事件监听\n    const disposable = editorInstanceRef.current!.onDidBlurEditorText(() => {\n      const currentValue = editorInstanceRef.current!.getValue();\n      onBlur?.(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":["jsx"],"mappings":"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"}
+{"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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"}

package/dist/components/easyv-monaco-editor/types.d.ts

@@ -1,4 +1,4 @@
-import type * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
+import type * as monacoType from 'monaco-editor/esm/vs/editor/editor.api';
 export interface EasyvMonacoEditorProps {
     className?: string;
     style?: React.CSSProperties;
@@ -66,16 +66,26 @@ export interface EasyvMonacoEditorProps {
       ],
       ```
      */
-    monaco: typeof monaco;
+    monaco: typeof monacoType;
     /** monaco 对代码检查时的错误或者警告等等。 */
-    onCodeMark?: (errors: monaco.editor.IMarker[]) => void;
+    onCodeMark?: (errors: monacoType.editor.IMarker[]) => void;
+    onFocus?: () => void;
     onBlur?: (code: string) => void;
+    /** 是否在失焦时格式化代码 */
+    formatOnBlur?: boolean;
     /** 校验时，要忽略的错误码。 只在初始化生效 */
     ignoreErrorCodes?: number[];
     /** 初始化时，对 ts/js 语言的编译选项，具体选项可查看类型 */
-    initJSCompilerOptions?: monaco.languages.typescript.CompilerOptions;
+    initJSCompilerOptions?: monacoType.languages.typescript.CompilerOptions;
     /** 新建 monaco-editor 时，传入的配置选项，具体选项可查看类型, 大部分的配置 可以通过传递 monacoEditorOptions 来更新 */
-    constructionOptions?: Parameters<typeof monaco.editor.create>[1];
-    monacoEditorOptions?: monaco.editor.IEditorOptions & monaco.editor.IGlobalEditorOptions;
-    customTheme?: monaco.editor.IStandaloneThemeData;
+    constructionOptions?: Parameters<typeof monacoType.editor.create>[1];
+    monacoEditorOptions?: monacoType.editor.IEditorOptions & monacoType.editor.IGlobalEditorOptions;
+    customTheme?: monacoType.editor.IStandaloneThemeData;
+    onEditorMounted?: (editor: monacoType.editor.IStandaloneCodeEditor) => void;
+    onError?: (error: Error) => void;
 }
+export type MonacoEditorInstance = monacoType.editor.IStandaloneCodeEditor | undefined;
+export type EasyvMonacoEditorRef = {
+    editor?: MonacoEditorInstance;
+    format: () => Promise<string | undefined>;
+};

package/dist/node_modules/.pnpm/ahooks@3.8.5_react@18.2.0/node_modules/ahooks/es/useLatest/index.es.js

@@ -0,0 +1,10 @@
+import { useRef } from "react";
+function useLatest(value) {
+  var ref = useRef(value);
+  ref.current = value;
+  return ref;
+}
+export {
+  useLatest as default
+};
+//# sourceMappingURL=index.es.js.map

package/dist/node_modules/.pnpm/ahooks@3.8.5_react@18.2.0/node_modules/ahooks/es/useLatest/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../../../../../../../../node_modules/.pnpm/ahooks@3.8.5_react@18.2.0/node_modules/ahooks/es/useLatest/index.js"],"sourcesContent":["import { useRef } from 'react';\nfunction useLatest(value) {\n  var ref = useRef(value);\n  ref.current = value;\n  return ref;\n}\nexport default useLatest;"],"names":[],"mappings":";AACA,SAAS,UAAU,OAAO;AACxB,MAAI,MAAM,OAAO,KAAK;AACtB,MAAI,UAAU;AACd,SAAO;AACT;","x_google_ignoreList":[0]}