@yuntijs/ui 1.1.0 → 1.2.0-beta.1

package/es/Mentions/utils.js

@@ -1,5 +1,7 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { $isTextNode, createCommand } from 'lexical';
+import { $createParagraphNode, $getRoot, $isTextNode, createCommand } from 'lexical';
+import { $convertToMentionNodes } from "./plugins/mention-converter";
 export var INSERT_MENTION_COMMAND = createCommand('INSERT_MENTION_COMMAND');
 export var DELETE_MENTION_COMMAND = createCommand('DELETE_MENTION_COMMAND');
 export var CLEAR_HIDE_MENU_TIMEOUT = createCommand('CLEAR_HIDE_MENU_TIMEOUT');
@@ -63,33 +65,12 @@ export var decoratorTransform = function decoratorTransform(node, getMatch, crea
     }
   }
 };
-export function textToEditorState(text) {
-  var paragraph = text.split('\n');
-  return JSON.stringify({
-    root: {
-      children: paragraph.map(function (p) {
-        return {
-          children: [{
-            detail: 0,
-            format: 0,
-            mode: 'normal',
-            style: '',
-            text: p,
-            type: 'custom-text',
-            version: 1
-          }],
-          direction: 'ltr',
-          format: '',
-          indent: 0,
-          type: 'paragraph',
-          version: 1
-        };
-      }),
-      direction: 'ltr',
-      format: '',
-      indent: 0,
-      type: 'root',
-      version: 1
-    }
-  });
+export function textToEditorState(initialValue, triggers) {
+  return function () {
+    var root = $getRoot();
+    root.clear();
+    var paragraph = $createParagraphNode();
+    paragraph.append.apply(paragraph, _toConsumableArray($convertToMentionNodes(initialValue, triggers)));
+    root.append(paragraph);
+  };
 }

package/es/MonacoEditor/MonacoEditor2.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import type { EditorProps } from '@monaco-editor/react';
+import type { Variant } from 'antd/es/config-provider';
+export interface EditorProps2 extends EditorProps {
+    onBlur?: (input: string, event: any) => void;
+    placeholder?: string;
+    variant?: Variant;
+    enableOutline?: boolean;
+    version?: string;
+}
+export declare const MonacoEditor2: React.FC<EditorProps2>;

package/es/MonacoEditor/MonacoEditor2.js

@@ -0,0 +1,103 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["language", "theme", "placeholder", "variant", "onBlur", "enableOutline", "className", "version", "options", "onMount"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import Editor, { loader } from '@monaco-editor/react';
+import { Spin } from 'antd';
+import { useEffect, useRef, useState } from 'react';
+import { useCdnFn } from "../ConfigProvider";
+import { useStyles } from "./base/style";
+import { jsx as _jsx } from "react/jsx-runtime";
+export var MonacoEditor2 = function MonacoEditor2(_ref) {
+  var _options$minimap;
+  var language = _ref.language,
+    theme = _ref.theme,
+    placeholder = _ref.placeholder,
+    variant = _ref.variant,
+    onBlur = _ref.onBlur,
+    enableOutline = _ref.enableOutline,
+    className = _ref.className,
+    _ref$version = _ref.version,
+    version = _ref$version === void 0 ? '0.52.2' : _ref$version,
+    _ref$options = _ref.options,
+    options = _ref$options === void 0 ? {} : _ref$options,
+    onMount = _ref.onMount,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isFocus = _useState2[0],
+    setIsFocus = _useState2[1];
+  var editorRef = useRef(null);
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isMounted = _useState4[0],
+    setIsMounted = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    configed = _useState6[0],
+    setConfiged = _useState6[1];
+  var _useStyles = useStyles({
+      minimapEnabled: options === null || options === void 0 || (_options$minimap = options.minimap) === null || _options$minimap === void 0 ? void 0 : _options$minimap.enabled,
+      variant: variant
+    }),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  var classnames = cx(styles.base, className, {
+    've-focused': isFocus,
+    've-outline': enableOutline
+  });
+  var genCdnUrl = useCdnFn();
+  useEffect(function () {
+    loader.config({
+      paths: {
+        vs: genCdnUrl({
+          path: 'min/vs',
+          pkg: 'monaco-editor',
+          version: version
+        })
+      }
+    });
+    setConfiged(true);
+  }, [genCdnUrl, version]);
+  var handleEditorDidMount = function handleEditorDidMount(editor, monaco) {
+    editorRef.current = editor;
+    editor.onDidFocusEditorText(function () {
+      setIsFocus(true);
+    });
+    editor.onDidBlurEditorText(function (event) {
+      var _editorRef$current;
+      setIsFocus(false);
+      var value = (_editorRef$current = editorRef.current) === null || _editorRef$current === void 0 || (_editorRef$current = _editorRef$current.getModel()) === null || _editorRef$current === void 0 ? void 0 : _editorRef$current.getValue();
+      onBlur === null || onBlur === void 0 || onBlur(value !== null && value !== void 0 ? value : '', event);
+    });
+    monaco.editor.setTheme('default-theme'); // Fix: sometimes not load the default theme
+    onMount === null || onMount === void 0 || onMount(editor, monaco);
+    setIsMounted(true);
+  };
+  return /*#__PURE__*/_jsx(Spin, {
+    spinning: !configed,
+    children: configed ? /*#__PURE__*/_jsx(Editor, _objectSpread({
+      className: classnames,
+      language: language || 'text',
+      onMount: handleEditorDidMount,
+      options: _objectSpread({
+        domReadOnly: true,
+        quickSuggestions: false,
+        minimap: {
+          enabled: false
+        },
+        lineNumbersMinChars: 1,
+        // would change line num width
+        wordWrap: 'on',
+        // auto line wrap
+        unicodeHighlight: {
+          ambiguousCharacters: false
+        },
+        placeholder: placeholder
+      }, options),
+      theme: isMounted ? theme : 'default-theme' // sometimes not load the default theme
+    }, props)) : null
+  });
+};

package/es/MonacoEditor/base/helper.js

@@ -159,6 +159,10 @@ export var useEditor = function useEditor(type, props) {
       if (!containerRef.current) {
         return;
       }
+      if (editorRef.current) {
+        editorRef.current.dispose();
+        decomposeRef.current = false;
+      }
       var editor;
       if (typeRef.current === 'single') {
         var _ref, _valueRef$current;
@@ -201,7 +205,7 @@ export var useEditor = function useEditor(type, props) {
         setLoading(false);
       }
     });
-  }, []);
+  }, [placeholder]);
   useEffect(function () {
     var _monacoRef$current;
     if (!isEditorReady) {

package/es/MonacoEditor/base/style.js

@@ -34,7 +34,7 @@ export var useStyles = createStyles(function (_ref, _ref2) {
     }
   };
   return {
-    base: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        position: relative;\n\n        box-sizing: content-box;\n        min-height: 100px;\n\n        background-color: ", ";\n        border: 1px solid ", ";\n        border-radius: ", "px;\n        &:hover {\n          border-color: ", ";\n          ", "\n        }\n\n        &.ve-focused {\n          ", "\n          ", "\n        }\n\n        &.ve-outline {\n          border: 1px solid var(--color-field-border, rgba(31, 56, 88, 0.05)) !important;\n        }\n\n        & > .react-monaco-editor-container {\n          width: 100%;\n          height: 100%;\n          min-height: 100px;\n          background: transparent;\n\n          ", "\n\n          .monaco-editor,\n          .monaco-editor-background,\n          .monaco-editor .inputarea.ime-input,\n          .monaco-editor .margin {\n            ", "\n          }\n\n          & > .monaco-editor {\n            border-radius: ", "px;\n            outline: none;\n            .overflow-guard,\n            .margin {\n              border-top-left-radius: ", "px;\n              border-bottom-left-radius: ", "px;\n            }\n            .monaco-scrollable-element {\n              border-top-right-radius: ", "px;\n              border-bottom-right-radius: ", "px;\n            }\n          }\n          .monaco-diff-editor {\n            border-radius: ", "px;\n            & > .original > .monaco-editor {\n              border-top-left-radius: ", "px;\n              border-bottom-left-radius: ", "px;\n              .overflow-guard,\n              .margin {\n                border-top-left-radius: ", "px;\n                border-bottom-left-radius: ", "px;\n              }\n            }\n            .diffViewport {\n              border-top-right-radius: ", "px;\n              border-bottom-right-radius: ", "px;\n            }\n          }\n        }\n\n        .syntaxTips {\n          position: absolute;\n          bottom: 0;\n          left: 0;\n\n          box-sizing: border-box;\n          width: 100%;\n          max-height: 0;\n          margin: 0;\n          padding: 10px 30px;\n\n          color: ", ";\n\n          background: ", ";\n\n          transition: 0.2s ease max-height;\n        }\n\n        .syntaxTips:hover {\n          overflow: auto;\n          max-height: 50%;\n        }\n\n        .syntaxTips .infoIcon {\n          position: absolute;\n          top: 2px;\n          right: 5px;\n          transform: rotateY(180deg);\n\n          width: 20px;\n          height: 16px;\n        }\n      "])), getBgColor(), variant === 'outlined' ? token.colorBorder : 'transparent', token.borderRadius, variant === 'outlined' ? token.colorPrimaryHover : 'transparent', variant === 'filled' && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n            background-color: ", ";\n          "])), token.colorFillSecondary), variant === 'filled' && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n            background-color: ", ";\n          "])), token.colorBgBase), variant !== 'borderless' && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n            border-color: ", ";\n          "])), token.colorPrimaryActive), isFullScreen && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n            position: fixed;\n            z-index: 9998;\n            inset: 0;\n\n            width: auto !important;\n            height: auto !important;\n          "]))), !isFullScreen && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n              background-color: transparent;\n            "]))), token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius - 1, token.borderRadius - 1, token.colorErrorText, token.colorErrorBg),
+    base: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        position: relative;\n\n        box-sizing: content-box;\n        min-height: 100px;\n\n        background-color: ", ";\n        border: 1px solid ", ";\n        border-radius: ", "px;\n        &:hover {\n          border-color: ", ";\n          ", "\n        }\n\n        &.ve-focused {\n          ", "\n          ", "\n        }\n\n        &.ve-outline {\n          border: 1px solid var(--color-field-border, rgba(31, 56, 88, 0.05)) !important;\n        }\n\n        & > .react-monaco-editor-container {\n          width: 100%;\n          height: 100%;\n          min-height: 100px;\n          background: transparent;\n\n          ", "\n\n          .monaco-editor,\n          .monaco-editor-background,\n          .monaco-editor .inputarea.ime-input,\n          .monaco-editor .margin {\n            ", "\n          }\n\n          & > .monaco-editor {\n            border-radius: ", "px;\n            outline: none;\n            .overflow-guard,\n            .margin {\n              border-top-left-radius: ", "px;\n              border-bottom-left-radius: ", "px;\n            }\n            .monaco-scrollable-element {\n              border-top-right-radius: ", "px;\n              border-bottom-right-radius: ", "px;\n            }\n          }\n          .monaco-diff-editor {\n            border-radius: ", "px;\n            & > .gutter {\n              outline: none;\n            }\n            & > .original > .monaco-editor {\n              border-top-left-radius: ", "px;\n              border-bottom-left-radius: ", "px;\n              outline: none;\n              .overflow-guard,\n              .margin {\n                border-top-left-radius: ", "px;\n                border-bottom-left-radius: ", "px;\n              }\n            }\n            & > .modified > .monaco-editor {\n              outline: none;\n            }\n            .diffViewport {\n              border-top-right-radius: ", "px;\n              border-bottom-right-radius: ", "px;\n              outline: none;\n            }\n          }\n        }\n\n        .syntaxTips {\n          position: absolute;\n          bottom: 0;\n          left: 0;\n\n          box-sizing: border-box;\n          width: 100%;\n          max-height: 0;\n          margin: 0;\n          padding: 10px 30px;\n\n          color: ", ";\n\n          background: ", ";\n\n          transition: 0.2s ease max-height;\n        }\n\n        .syntaxTips:hover {\n          overflow: auto;\n          max-height: 50%;\n        }\n\n        .syntaxTips .infoIcon {\n          position: absolute;\n          top: 2px;\n          right: 5px;\n          transform: rotateY(180deg);\n\n          width: 20px;\n          height: 16px;\n        }\n      "])), getBgColor(), variant === 'outlined' ? token.colorBorder : 'transparent', token.borderRadius, variant === 'outlined' ? token.colorPrimaryHover : 'transparent', variant === 'filled' && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n            background-color: ", ";\n          "])), token.colorFillSecondary), variant === 'filled' && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n            background-color: ", ";\n          "])), token.colorBgBase), variant !== 'borderless' && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n            border-color: ", ";\n          "])), token.colorPrimaryActive), isFullScreen && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n            position: fixed;\n            z-index: 9998;\n            inset: 0;\n\n            width: auto !important;\n            height: auto !important;\n          "]))), !isFullScreen && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n              background-color: transparent;\n            "]))), token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius - 1, token.borderRadius - 1, token.colorErrorText, token.colorErrorBg),
     fullScreenBtn: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n        &.", "-btn {\n          position: absolute;\n          top: 20px;\n          color: ", ";\n          transition: none;\n          ", "\n        }\n      "])), prefixCls, token.colorTextSecondary, isFullScreen ? css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n                z-index: 9999;\n                right: ", "px;\n              "])), diff ? 64 : 138) : css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n                right: ", "px;\n              "])), minimapEnabled || diff ? 64 : 20)),
     loading: css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n        position: absolute;\n        inset: 0;\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n\n        font-size: ", "px;\n        color: ", ";\n\n        background-color: transparent;\n\n        &::after {\n          content: '';\n          width: 16px;\n          /* display: inline; */\n          animation: ", " steps(3) 1s infinite;\n        }\n      "])), token.fontSizeSM, token.colorTextTertiary, dots)
   };

package/es/SelectCard/index.js

@@ -107,7 +107,7 @@ export var SelectCard = /*#__PURE__*/React.forwardRef(function (props, ref) {
       }), o.label && !selected && /*#__PURE__*/_jsx(Text, {
         ellipsis: true,
         children: o.label
-      }), !isImg && o.description && /*#__PURE__*/_jsx(Paragraph, {
+      }), o.description && /*#__PURE__*/_jsx(Paragraph, {
         ellipsis: {
           rows: 2
         },

package/es/hooks/useHighlight.d.ts

@@ -1,5 +1,3 @@
 export declare const FALLBACK_LANG = "txt";
-export declare const useHighlight: (text: string, lang: string, isDarkMode: boolean) => import("swr/dist/_internal").SWRResponse<string, any, {
-    revalidateOnFocus: false;
-}>;
+export declare const useHighlight: (text: string, lang: string, enableTransformer?: boolean) => import("swr/dist/_internal").SWRResponse<string, any, any>;
 export { languageMap } from './languageMap';

package/es/hooks/useHighlight.js

@@ -1,82 +1,80 @@
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { transformerNotationDiff, transformerNotationErrorLevel, transformerNotationFocus, transformerNotationHighlight, transformerNotationWordHighlight } from '@shikijs/transformers';
-import { createHighlighter } from 'shiki';
+import { useTheme, useThemeMode } from 'antd-style';
+import { useMemo } from 'react';
+import { codeToHtml } from 'shiki';
 import useSWR from 'swr';
-import { themeConfig } from "../Highlighter/theme";
+import { Md5 } from 'ts-md5';
 import { languageMap } from "./languageMap";
 export var FALLBACK_LANG = 'txt';
-var FALLBACK_LANGS = [FALLBACK_LANG];
-var cacheHighlighter;
-var initHighlighter = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(lang) {
-    var highlighter, language;
+
+// @Todo: use worker to improve performance
+export var useHighlight = function useHighlight(text, lang, enableTransformer) {
+  var _useThemeMode = useThemeMode(),
+    isDarkMode = _useThemeMode.isDarkMode;
+  var language = lang.toLowerCase();
+  var matchedLanguage = useMemo(function () {
+    return languageMap.includes(language) ? language : FALLBACK_LANG;
+  }, [language]);
+  var theme = useTheme();
+  var transformers = useMemo(function () {
+    if (!enableTransformer) return;
+    return [transformerNotationDiff(), transformerNotationHighlight(), transformerNotationWordHighlight(), transformerNotationFocus(), transformerNotationErrorLevel()];
+  }, [enableTransformer]);
+  var key = useMemo(function () {
+    return Md5.hashStr(text);
+  }, [text]);
+  var shikiTheme = useMemo(function () {
+    if (language === 'md') {
+      return isDarkMode ? 'catppuccin-mocha' : 'catppuccin-latte';
+    }
+    return isDarkMode ? 'slack-dark' : 'slack-ochin';
+  }, [isDarkMode, language]);
+  return useSWR([matchedLanguage, isDarkMode ? 'd' : 'l', key].join('-'), /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          highlighter = cacheHighlighter;
-          language = lang.toLowerCase();
-          if (!(highlighter && FALLBACK_LANGS.includes(language))) {
-            _context.next = 4;
-            break;
-          }
-          return _context.abrupt("return", highlighter);
+          _context.prev = 0;
+          return _context.abrupt("return", codeToHtml(text, {
+            colorReplacements: {
+              'slack-dark': {
+                '#4ec9b0': theme.yellow,
+                '#569cd6': theme.colorError,
+                '#6a9955': theme.gray,
+                '#9cdcfe': theme.colorText,
+                '#b5cea8': theme.purple10,
+                '#c586c0': theme.colorInfo,
+                '#ce9178': theme.colorSuccess,
+                '#dcdcaa': theme.colorWarning,
+                '#e6e6e6': theme.colorText
+              },
+              'slack-ochin': {
+                '#002339': theme.colorText,
+                '#0991b6': theme.colorError,
+                '#174781': theme.purple10,
+                '#2f86d2': theme.colorText,
+                '#357b42': theme.gray,
+                '#7b30d0': theme.colorInfo,
+                '#7eb233': theme.colorWarningTextActive,
+                '#a44185': theme.colorSuccess,
+                '#dc3eb7': theme.yellow11
+              }
+            },
+            lang: matchedLanguage,
+            theme: shikiTheme,
+            transformers: transformers
+          }));
         case 4:
-          if (languageMap.includes(language) && !FALLBACK_LANGS.includes(language)) {
-            FALLBACK_LANGS.push(language);
-          }
-          _context.next = 7;
-          return createHighlighter({
-            langs: FALLBACK_LANGS,
-            themes: [themeConfig(true), themeConfig(false), 'catppuccin-latte', 'catppuccin-mocha']
-          });
-        case 7:
-          highlighter = _context.sent;
-          cacheHighlighter = highlighter;
-          return _context.abrupt("return", highlighter);
-        case 10:
+          _context.prev = 4;
+          _context.t0 = _context["catch"](0);
+          console.warn('shiki Highlight error:', _context.t0);
+          return _context.abrupt("return", text);
+        case 8:
         case "end":
           return _context.stop();
       }
-    }, _callee);
-  }));
-  return function initHighlighter(_x) {
-    return _ref.apply(this, arguments);
-  };
-}();
-export var useHighlight = function useHighlight(text, lang, isDarkMode) {
-  return useSWR([lang === null || lang === void 0 ? void 0 : lang.toLowerCase(), isDarkMode ? 'dark' : 'light', text].join('-'), /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-    var language, theme, highlighter, html;
-    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) switch (_context2.prev = _context2.next) {
-        case 0:
-          _context2.prev = 0;
-          language = lang.toLowerCase();
-          theme = isDarkMode ? 'dark' : 'light';
-          if (language === 'md') {
-            theme = isDarkMode ? 'catppuccin-mocha' : 'catppuccin-latte';
-          }
-          _context2.next = 6;
-          return initHighlighter(language);
-        case 6:
-          highlighter = _context2.sent;
-          html = highlighter === null || highlighter === void 0 ? void 0 : highlighter.codeToHtml(text, {
-            lang: languageMap.includes(language) ? language : FALLBACK_LANG,
-            theme: theme,
-            transformers: [transformerNotationDiff(), transformerNotationHighlight(), transformerNotationWordHighlight(), transformerNotationFocus(), transformerNotationErrorLevel()]
-          });
-          return _context2.abrupt("return", html);
-        case 11:
-          _context2.prev = 11;
-          _context2.t0 = _context2["catch"](0);
-          return _context2.abrupt("return", '');
-        case 14:
-        case "end":
-          return _context2.stop();
-      }
-    }, _callee2, null, [[0, 11]]);
-  })), {
-    revalidateOnFocus: false
-  });
+    }, _callee, null, [[0, 4]]);
+  })));
 };
 export { languageMap } from "./languageMap";

package/es/index.d.ts

@@ -7,6 +7,7 @@ export * from './Logo';
 export * from './LogViewer';
 export * from './Mentions';
 export * from './MonacoEditor';
+export * from './MonacoEditor/MonacoEditor2';
 export * from './Page';
 export * from './ProCard';
 export * from './SelectCard';

package/es/index.js

@@ -7,6 +7,7 @@ export * from "./Logo";
 export * from "./LogViewer";
 export * from "./Mentions";
 export * from "./MonacoEditor";
+export * from "./MonacoEditor/MonacoEditor2";
 export * from "./Page";
 export * from "./ProCard";
 export * from "./SelectCard";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuntijs/ui",
-  "version": "1.1.0",
+  "version": "1.2.0-beta.1",
   "description": "☁️ Yunti UI - an open-source UI component library for building Cloud Native web apps",
   "keywords": [
     "yuntijs",
@@ -80,7 +80,6 @@
     ]
   },
   "dependencies": {
-    "@alilc/lowcode-plugin-base-monaco-editor": "^1.1.2",
     "@ant-design/icons": "^5",
     "@babel/runtime": "^7",
     "@lexical/react": "^0.23.1",
@@ -90,8 +89,9 @@
     "@lobehub/tts": "^1.25.1",
     "@lobehub/ui": "^1.164.2",
     "@melloware/react-logviewer": "^5.2.0",
-    "@monaco-editor/loader": "^1.4.0",
-    "@shikijs/transformers": "^1.10.3",
+    "@monaco-editor/loader": "^1.5.0",
+    "@monaco-editor/react": "^4.7.0",
+    "@shikijs/transformers": "^3.2.1",
     "leva": "^0",
     "lexical": "^0.23.1",
     "lodash-es": "^4",
@@ -102,8 +102,9 @@
     "react-error-boundary": "^4",
     "react-layout-kit": "^1",
     "react18-json-view": "^0.2.8",
-    "shiki": "^1.10.3",
+    "shiki": "^3.2.1",
     "swr": "^2.2.5",
+    "ts-md5": "^1.3.1",
     "url-join": "^5.0.0",
     "use-merge-value": "^1.2.0"
   },