@lobehub/ui 2.10.1 → 2.10.3

package/es/Markdown/Markdown.js

@@ -1,7 +1,8 @@
 'use client';
 
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["ref", "children", "className", "style", "fullFeaturedCodeBlock", "onDoubleClick", "animated", "enableLatex", "enableMermaid", "enableImageGallery", "enableCustomFootnotes", "componentProps", "allowHtml", "fontSize", "headerMultiple", "marginMultiple", "showFootnotes", "variant", "reactMarkdownProps", "lineHeight", "rehypePlugins", "remarkPlugins", "remarkPluginsAhead", "components", "customRender", "citations"];
+var _excluded = ["ref", "children", "className", "style", "fullFeaturedCodeBlock", "onDoubleClick", "animated", "enableLatex", "enableMermaid", "enableImageGallery", "enableCustomFootnotes", "enableGithubAlert", "enableStream", "componentProps", "allowHtml", "fontSize", "headerMultiple", "marginMultiple", "showFootnotes", "variant", "reactMarkdownProps", "lineHeight", "rehypePlugins", "remarkPlugins", "remarkPluginsAhead", "components", "customRender", "citations"],
+  _excluded2 = ["children"];
 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; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -16,7 +17,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { cva } from 'class-variance-authority';
-import { memo, useEffect, useMemo, useState } from 'react';
+import { memo, useCallback, useEffect, useMemo, useState } from 'react';
 import { PreviewGroup } from "../Image";
 import { MarkdownProvider } from "./components/MarkdownProvider";
 import { MarkdownRender, StreamdownRender } from "./SyntaxMarkdown";
@@ -25,18 +26,19 @@ import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 var Markdown = /*#__PURE__*/memo(function (_ref) {
   var ref = _ref.ref,
-    children = _ref.children,
+    _ref$children = _ref.children,
+    children = _ref$children === void 0 ? '' : _ref$children,
     className = _ref.className,
     style = _ref.style,
     fullFeaturedCodeBlock = _ref.fullFeaturedCodeBlock,
     onDoubleClick = _ref.onDoubleClick,
     animated = _ref.animated,
-    _ref$enableLatex = _ref.enableLatex,
-    enableLatex = _ref$enableLatex === void 0 ? true : _ref$enableLatex,
-    _ref$enableMermaid = _ref.enableMermaid,
-    enableMermaid = _ref$enableMermaid === void 0 ? true : _ref$enableMermaid,
+    eLatex = _ref.enableLatex,
+    eMermaid = _ref.enableMermaid,
     enableImageGallery = _ref.enableImageGallery,
     enableCustomFootnotes = _ref.enableCustomFootnotes,
+    eGithubAlert = _ref.enableGithubAlert,
+    eStream = _ref.enableStream,
     componentProps = _ref.componentProps,
     allowHtml = _ref.allowHtml,
     _ref$fontSize = _ref.fontSize,
@@ -61,11 +63,14 @@ var Markdown = /*#__PURE__*/memo(function (_ref) {
   var _useStyles = useStyles(),
     cx = _useStyles.cx,
     styles = _useStyles.styles;
-  // Add state to track delayed animated value
   var _useState = useState(animated),
     _useState2 = _slicedToArray(_useState, 2),
     delayedAnimated = _useState2[0],
     setDelayedAnimated = _useState2[1];
+  var enableLatex = Boolean(typeof eLatex === 'boolean' && eLatex) || children.includes('$');
+  var enableMermaid = Boolean(typeof eMermaid === 'boolean' && eMermaid) || children.includes('```mermaid');
+  var enableGithubAlert = Boolean(typeof eGithubAlert === 'boolean' && eGithubAlert) || children.includes('> [!');
+  var enableStream = Boolean(typeof eStream === 'boolean' && eStream) || delayedAnimated || !children.includes('[^');
 
   // Watch for changes in animated prop
   useEffect(function () {
@@ -109,7 +114,15 @@ var Markdown = /*#__PURE__*/memo(function (_ref) {
       /* eslint-enable sort-keys-fix/sort-keys-fix */
     });
   }, [styles]);
-  var DefaultRender = animated ? StreamdownRender : MarkdownRender;
+  var DefaultRender = useCallback(function (_ref2) {
+    var children = _ref2.children,
+      reactMarkdownProps = _objectWithoutProperties(_ref2, _excluded2);
+    return enableStream ? /*#__PURE__*/_jsx(StreamdownRender, _objectSpread(_objectSpread({}, reactMarkdownProps), {}, {
+      children: children
+    })) : /*#__PURE__*/_jsx(MarkdownRender, _objectSpread(_objectSpread({}, reactMarkdownProps), {}, {
+      children: children
+    }));
+  }, [enableStream]);
   var defaultDOM = /*#__PURE__*/_jsx(DefaultRender, _objectSpread(_objectSpread({}, reactMarkdownProps), {}, {
     children: children
   }));
@@ -138,6 +151,7 @@ var Markdown = /*#__PURE__*/memo(function (_ref) {
           componentProps: componentProps,
           components: components,
           enableCustomFootnotes: enableCustomFootnotes,
+          enableGithubAlert: enableGithubAlert,
           enableLatex: enableLatex,
           enableMermaid: enableMermaid,
           fullFeaturedCodeBlock: fullFeaturedCodeBlock,
@@ -148,7 +162,7 @@ var Markdown = /*#__PURE__*/memo(function (_ref) {
           variant: variant
         },
         children: customRender ? customRender(defaultDOM, {
-          text: children || ''
+          text: children
         }) : defaultDOM
       })
     }))

package/es/Markdown/SyntaxMarkdown/StreamdownRender.js

@@ -15,6 +15,7 @@ import { memo, useId, useMemo } from 'react';
 import { MarkdownHooks } from 'react-markdown';
 import { useMarkdownComponents, useMarkdownContent, useMarkdownRehypePlugins, useMarkdownRemarkPlugins } from "../../hooks/useMarkdown";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
 var parseMarkdownIntoBlocks = function parseMarkdownIntoBlocks(markdown) {
   var tokens = marked.lexer(markdown);
   return tokens.map(function (token) {
@@ -44,13 +45,12 @@ export var StreamdownRender = /*#__PURE__*/memo(function (_ref2) {
   }, [escapedContent]);
   return /*#__PURE__*/_jsx("div", {
     children: blocks.map(function (block, index) {
-      return /*#__PURE__*/_jsx(StreamdownBlock, _objectSpread(_objectSpread({
+      return /*#__PURE__*/_createElement(StreamdownBlock, _objectSpread(_objectSpread({}, rest), {}, {
         components: components,
+        key: "".concat(generatedId, "-block_").concat(index),
         rehypePlugins: rehypePluginsList,
         remarkPlugins: remarkPluginsList
-      }, rest), {}, {
-        children: block
-      }), "".concat(generatedId, "-block_").concat(index));
+      }), block);
     })
   });
 }, function (prevProps, nextProps) {

package/es/Markdown/type.d.ts

@@ -30,8 +30,10 @@ export interface SyntaxMarkdownProps {
     };
     components?: Components & Record<string, FC>;
     enableCustomFootnotes?: boolean;
+    enableGithubAlert?: boolean;
     enableLatex?: boolean;
     enableMermaid?: boolean;
+    enableStream?: boolean;
     fullFeaturedCodeBlock?: boolean;
     reactMarkdownProps?: Omit<Readonly<ReactMarkdownOptions>, 'components' | 'rehypePlugins' | 'remarkPlugins'>;
     rehypePlugins?: Pluggable[];

package/es/hooks/useMarkdown/useMarkdownRehypePlugins.js

@@ -19,14 +19,15 @@ export var useMarkdownRehypePlugins = function useMarkdownRehypePlugins() {
     animated = _useMarkdownContext.animated,
     enableLatex = _useMarkdownContext.enableLatex,
     enableCustomFootnotes = _useMarkdownContext.enableCustomFootnotes,
+    enableGithubAlert = _useMarkdownContext.enableGithubAlert,
     allowHtml = _useMarkdownContext.allowHtml,
     _useMarkdownContext$r = _useMarkdownContext.rehypePlugins,
     rehypePlugins = _useMarkdownContext$r === void 0 ? [] : _useMarkdownContext$r,
     _useMarkdownContext$r2 = _useMarkdownContext.rehypePluginsAhead,
     rehypePluginsAhead = _useMarkdownContext$r2 === void 0 ? [] : _useMarkdownContext$r2;
   var memoPlugins = useMemo(function () {
-    return [rehypeGithubAlerts, allowHtml && rehypeRaw, enableLatex && rehypeKatex, enableLatex && rehypeKatexDir, enableCustomFootnotes && rehypeFootnoteLinks, animated && animatedPlugin].filter(Boolean);
-  }, [animated, enableLatex, enableCustomFootnotes, allowHtml]);
+    return [allowHtml && rehypeRaw, enableGithubAlert && rehypeGithubAlerts, enableLatex && rehypeKatex, enableLatex && rehypeKatexDir, enableCustomFootnotes && rehypeFootnoteLinks, animated && animatedPlugin].filter(Boolean);
+  }, [animated, enableLatex, enableGithubAlert, enableCustomFootnotes, allowHtml]);
   return useMemo(function () {
     return [].concat(_toConsumableArray(rehypePluginsAhead), _toConsumableArray(memoPlugins), _toConsumableArray(rehypePlugins));
   }, [rehypePlugins, memoPlugins, rehypePluginsAhead]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "2.10.1",
+  "version": "2.10.3",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",