@lobehub/ui 1.133.4 → 1.133.6

package/es/Highlighter/FullFeatured.d.ts

@@ -1,10 +1,13 @@
-/// <reference types="react" />
+import { ReactNode } from 'react';
 import { DivProps } from "../types";
 export interface HighlighterProps extends DivProps {
+    allowChangeLanguage?: boolean;
     /**
      * @description The code content to be highlighted
      */
     children: string;
+    fileName?: string;
+    icon?: ReactNode;
     /**
      * @description The language of the code content
      */

package/es/Highlighter/FullFeatured.js

@@ -1,7 +1,7 @@
 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 = ["children", "language", "className", "style"];
+var _excluded = ["children", "language", "className", "style", "allowChangeLanguage", "fileName", "icon"];
 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 { Select } from 'antd';
@@ -27,6 +27,10 @@ export var Highlighter = /*#__PURE__*/memo(function (_ref) {
     language = _ref$language === void 0 ? 'markdown' : _ref$language,
     className = _ref.className,
     style = _ref.style,
+    _ref$allowChangeLangu = _ref.allowChangeLanguage,
+    allowChangeLanguage = _ref$allowChangeLangu === void 0 ? true : _ref$allowChangeLangu,
+    fileName = _ref.fileName,
+    icon = _ref.icon,
     rest = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(true),
     _useState2 = _slicedToArray(_useState, 2),
@@ -60,7 +64,7 @@ export var Highlighter = /*#__PURE__*/memo(function (_ref) {
           fontSize: 14,
           strokeWidth: 3
         }
-      }), /*#__PURE__*/_jsx(Select, {
+      }), allowChangeLanguage && !fileName ? /*#__PURE__*/_jsx(Select, {
         className: styles.select,
         onSelect: setLang,
         options: options,
@@ -68,6 +72,14 @@ export var Highlighter = /*#__PURE__*/memo(function (_ref) {
         suffixIcon: false,
         value: lang.toLowerCase(),
         variant: 'borderless'
+      }) : /*#__PURE__*/_jsxs(Flexbox, {
+        align: 'center',
+        className: styles.select,
+        gap: 2,
+        horizontal: true,
+        children: [icon, /*#__PURE__*/_jsx("span", {
+          children: fileName || lang
+        })]
       }), /*#__PURE__*/_jsx(CopyButton, {
         content: children,
         placement: "left",

package/es/Highlighter/index.d.ts

@@ -1,7 +1,8 @@
-/// <reference types="react" />
+import { ReactNode } from 'react';
 import { type CopyButtonProps } from "../CopyButton";
 import { DivProps } from "../types";
 export interface HighlighterProps extends DivProps {
+    allowChangeLanguage?: boolean;
     /**
      * @description The code content to be highlighted
      */
@@ -12,7 +13,9 @@ export interface HighlighterProps extends DivProps {
      * @default true
      */
     copyable?: boolean;
+    fileName?: string;
     fullFeatured?: boolean;
+    icon?: ReactNode;
     /**
      * @description The language of the code content
      */

package/es/Highlighter/index.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["fullFeatured", "copyButtonSize", "children", "language", "className", "style", "copyable", "showLanguage", "type", "spotlight"];
+var _excluded = ["fullFeatured", "copyButtonSize", "children", "language", "className", "style", "copyable", "showLanguage", "type", "spotlight", "allowChangeLanguage", "fileName", "icon"];
 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 { memo } from 'react';
@@ -27,13 +27,20 @@ export var Highlighter = /*#__PURE__*/memo(function (_ref) {
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'block' : _ref$type,
     spotlight = _ref.spotlight,
+    _ref$allowChangeLangu = _ref.allowChangeLanguage,
+    allowChangeLanguage = _ref$allowChangeLangu === void 0 ? true : _ref$allowChangeLangu,
+    fileName = _ref.fileName,
+    icon = _ref.icon,
     rest = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles(type),
     styles = _useStyles.styles,
     cx = _useStyles.cx;
   var container = cx(styles.container, className);
   if (fullFeatured) return /*#__PURE__*/_jsx(FullFeatured, _objectSpread(_objectSpread({
+    allowChangeLanguage: allowChangeLanguage,
     className: className,
+    fileName: fileName,
+    icon: icon,
     language: language,
     style: style
   }, rest), {}, {

package/es/Highlighter/style.js

@@ -16,6 +16,6 @@ export var useStyles = createStyles(function (_ref, type) {
     container: cx(prefix, type !== 'pure' && typeStylish, css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n          position: relative;\n          overflow: auto;\n          border-radius: ", "px;\n          transition: background-color 100ms ", ";\n\n          &:hover {\n            .", " {\n              opacity: 1;\n            }\n\n            .", " {\n              opacity: 1;\n            }\n          }\n\n          .prism-code {\n            background: none !important;\n          }\n\n          pre {\n            margin: 0 !important;\n            padding: ", " !important;\n            background: none !important;\n          }\n\n          code {\n            background: transparent !important;\n          }\n        "])), token.borderRadius, token.motionEaseOut, buttonHoverCls, langHoverCls, type === 'pure' ? 0 : "16px 24px")),
     header: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        padding-block: 4px;\n        padding-inline: 8px;\n        background: ", ";\n      "])), token.colorFillQuaternary),
     lang: cx(langHoverCls, stylish.blur, css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n          position: absolute;\n          z-index: 2;\n          inset-block-end: 8px;\n          inset-inline-end: 0;\n\n          font-family: ", ";\n          color: ", ";\n\n          opacity: 0;\n\n          transition: opacity 0.1s;\n        "])), token.fontFamilyCode, token.colorTextSecondary)),
-    select: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        user-select: none;\n        color: ", ";\n        .", "-select-selection-item {\n          min-width: 100px;\n          padding-inline-end: 0 !important;\n          color: ", ";\n          text-align: center;\n        }\n      "])), token.colorTextDescription, prefixCls, token.colorTextDescription)
+    select: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        user-select: none;\n        font-size: 14px;\n        color: ", ";\n        .", "-select-selection-item {\n          min-width: 100px;\n          padding-inline-end: 0 !important;\n          color: ", ";\n          text-align: center;\n        }\n      "])), token.colorTextDescription, prefixCls, token.colorTextDescription)
   };
 });

package/es/Markdown/markdown.style.js

@@ -15,20 +15,20 @@ export var useStyles = createStyles(function (_ref, _ref2) {
     _ref2$lineHeight = _ref2.lineHeight,
     lineHeight = _ref2$lineHeight === void 0 ? 1.8 : _ref2$lineHeight;
   return {
-    __root: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        --lobe-markdown-font-size: ", "px;\n        --lobe-markdown-header-multiple: ", ";\n        --lobe-markdown-margin-multiple: ", ";\n        --lobe-markdown-line-height: ", ";\n        --lobe-markdown-border-radius: ", ";\n        --lobe-markdown-border-color: ", ";\n\n        position: relative;\n\n        width: 100%;\n\n        font-size: var(--lobe-markdown-font-size);\n        line-height: var(--lobe-markdown-line-height);\n        word-break: break-word;\n      "])), fontSize, headerMultiple, marginMultiple, lineHeight, token.borderRadiusLG, isDarkMode ? token.colorBorderSecondary : rgba(token.colorBorderSecondary, 0.5)),
+    __root: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        --lobe-markdown-font-size: ", "px;\n        --lobe-markdown-header-multiple: ", ";\n        --lobe-markdown-margin-multiple: ", ";\n        --lobe-markdown-line-height: ", ";\n        --lobe-markdown-border-radius: ", ";\n        --lobe-markdown-border-color: ", ";\n\n        position: relative;\n\n        width: 100%;\n\n        font-size: var(--lobe-markdown-font-size);\n        line-height: var(--lobe-markdown-line-height);\n        word-break: auto-phrase;\n      "])), fontSize, headerMultiple, marginMultiple, lineHeight, token.borderRadiusLG, isDarkMode ? token.colorBorderSecondary : rgba(token.colorBorderSecondary, 0.5)),
     a: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        a {\n          color: ", ";\n\n          &:hover {\n            color: ", ";\n          }\n        }\n      "])), token.colorInfoText, token.colorInfoHover),
     blockquote: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        blockquote {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n          margin-inline: 0;\n          padding-block: 0;\n          padding-inline: 1em;\n\n          color: ", ";\n\n          border-inline-start: solid 4px ", ";\n        }\n      "])), token.colorTextSecondary, token.colorBorder),
-    code: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        code:not(:has(span)) {\n          display: inline-block;\n\n          margin-inline: 0.25em;\n          padding-block: 0.2em;\n          padding-inline: 0.4em;\n\n          font-family: ", ";\n          font-size: 0.875em;\n          line-height: 1;\n          word-break: break-word;\n\n          background: ", ";\n          border: 1px solid var(--lobe-markdown-border-color);\n          border-radius: 0.25em;\n        }\n      "])), token.fontFamilyCode, token.colorFillSecondary),
+    code: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        code:not(:has(span)) {\n          display: inline;\n\n          margin-inline: 0.25em;\n          padding-block: 0.2em;\n          padding-inline: 0.4em;\n\n          font-family: ", ";\n          font-size: 0.875em;\n          line-height: 1;\n          word-break: auto-phrase;\n\n          background: ", ";\n          border: 1px solid var(--lobe-markdown-border-color);\n          border-radius: 0.25em;\n        }\n      "])), token.fontFamilyCode, token.colorFillSecondary),
     details: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n        details {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n          padding-block: 0.75em;\n          padding-inline: 1em;\n\n          background: ", ";\n          border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n          box-shadow: inset 0 0 0 1px var(--lobe-markdown-border-color);\n\n          summary {\n            cursor: pointer;\n            display: flex;\n            align-items: center;\n            list-style: none;\n\n            &::before {\n              content: '';\n\n              position: absolute;\n              inset-inline-end: 1.25em;\n              transform: rotateZ(-45deg);\n\n              display: block;\n\n              width: 0.4em;\n              height: 0.4em;\n\n              font-family: ", ";\n\n              border-block-end: 1.5px solid ", ";\n              border-inline-end: 1.5px solid ", ";\n\n              transition: transform 200ms ", ";\n            }\n          }\n\n          &[open] {\n            summary {\n              padding-block-end: 0.75em;\n              border-block-end: 1px dashed ", ";\n\n              &::before {\n                transform: rotateZ(45deg);\n              }\n            }\n          }\n        }\n      "])), token.colorFillTertiary, token.fontFamily, token.colorTextSecondary, token.colorTextSecondary, token.motionEaseOut, token.colorBorder),
     header: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        h1,\n        h2,\n        h3,\n        h4,\n        h5 {\n          margin-block: max(\n            calc(\n              var(--lobe-markdown-header-multiple) * var(--lobe-markdown-margin-multiple) * 0.4em\n            ),\n            var(--lobe-markdown-font-size)\n          );\n          font-weight: 600;\n        }\n\n        h1 {\n          font-size: calc(\n            var(--lobe-markdown-font-size) * (1 + 1.5 * var(--lobe-markdown-header-multiple))\n          );\n        }\n\n        h2 {\n          font-size: calc(\n            var(--lobe-markdown-font-size) * (1 + var(--lobe-markdown-header-multiple))\n          );\n        }\n\n        h3 {\n          font-size: calc(\n            var(--lobe-markdown-font-size) * (1 + 0.5 * var(--lobe-markdown-header-multiple))\n          );\n        }\n\n        h4 {\n          font-size: calc(\n            var(--lobe-markdown-font-size) * (1 + 0.25 * var(--lobe-markdown-header-multiple))\n          );\n        }\n\n        h5 {\n          font-size: calc(var(--lobe-markdown-font-size) * 1);\n        }\n      "]))),
     hr: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n        hr {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1.5em);\n\n          border-color: ", ";\n          border-style: dashed;\n          border-width: 1px;\n          border-block-start: none;\n          border-inline-start: none;\n          border-inline-end: none;\n        }\n      "])), token.colorBorderSecondary),
     img: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n        img {\n          max-width: 100%;\n        }\n\n        > img,\n        > p > img {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n          border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n          box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n        }\n      "]))),
-    kbd: css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n        kbd {\n          cursor: default;\n          user-select: none;\n\n          transform: translateY(-0.2em);\n\n          display: inline-block;\n\n          min-width: 1em;\n          margin-inline: 0.25em;\n          padding-block: 0.2em;\n          padding-inline: 0.4em;\n\n          font-family: ", ";\n          font-size: 0.875em;\n          font-weight: 500;\n          line-height: 1;\n          color: ", ";\n          text-align: center;\n\n          background: ", ";\n          border: 1px solid ", ";\n          border-radius: 0.25em;\n          box-shadow: 0 2px 0 1px ", ";\n\n          &:hover {\n            transform: translateY(0);\n            box-shadow: none;\n          }\n        }\n      "])), token.fontFamily, token.colorBgLayout, isDarkMode ? token.colorText : '#333', isDarkMode ? token.colorTextSecondary : '#000', isDarkMode ? token.colorTextSecondary : '#000'),
+    kbd: css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n        kbd {\n          cursor: default;\n\n          display: inline-block;\n\n          min-width: 1em;\n          margin-inline: 0.25em;\n          padding-block: 0.2em;\n          padding-inline: 0.4em;\n\n          font-family: ", ";\n          font-size: 0.875em;\n          font-weight: 500;\n          line-height: 1;\n          text-align: center;\n\n          background: ", ";\n          border: 1px solid ", ";\n          border-radius: 0.25em;\n        }\n      "])), token.fontFamily, token.colorBgLayout, token.colorBorderSecondary),
     list: css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n        li {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.33em);\n        }\n\n        ul,\n        ol {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n          margin-inline-start: 1em;\n          padding-inline-start: 0;\n          list-style-position: outside;\n\n          ul,\n          ol {\n            margin-block: 0;\n          }\n\n          li {\n            margin-inline-start: 1em;\n          }\n        }\n\n        ol {\n          list-style: auto;\n        }\n\n        ul {\n          list-style-type: none;\n\n          li {\n            &::before {\n              content: '-';\n              display: inline-block;\n              margin-inline: -1em 0.5em;\n              opacity: 0.5;\n            }\n          }\n        }\n      "]))),
     p: css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n        p {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n          line-height: var(--lobe-markdown-line-height);\n          letter-spacing: 0.02em;\n        }\n      "]))),
     pre: css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n        pre,\n        [data-code-type='highlighter'] {\n          border: none;\n\n          > code {\n            padding: 0 !important;\n\n            font-family: ", ";\n            font-size: 0.875em;\n            line-height: 1.6;\n\n            border: none !important;\n          }\n        }\n      "])), token.fontFamilyCode),
     strong: css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n        strong {\n          font-weight: 600;\n        }\n      "]))),
-    table: css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n        table {\n          overflow: hidden;\n          display: table;\n          border-spacing: 0;\n          border-collapse: collapse;\n\n          box-sizing: border-box;\n          width: 100%;\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n\n          text-align: start;\n          overflow-wrap: break-word;\n\n          background: ", ";\n          border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n          box-shadow: inset 0 0 0 1px var(--lobe-markdown-border-color);\n\n          thead {\n            background: ", ";\n          }\n\n          tr {\n            box-shadow: inset 0 1px 0 var(--lobe-markdown-border-color);\n          }\n\n          th,\n          td {\n            padding-block: 0.75em;\n            padding-inline: 1em;\n            text-align: start;\n            vertical-align: top;\n          }\n        }\n      "])), token.colorFillQuaternary, token.colorFillQuaternary),
+    table: css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n        table {\n          overflow: auto hidden;\n          display: block;\n          border-spacing: 0;\n          border-collapse: collapse;\n\n          box-sizing: border-box;\n          width: 100%;\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n\n          text-align: start;\n          overflow-wrap: break-word;\n\n          background: ", ";\n          border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n          box-shadow: inset 0 0 0 1px var(--lobe-markdown-border-color);\n\n          thead {\n            background: ", ";\n          }\n\n          tr {\n            box-shadow: inset 0 1px 0 var(--lobe-markdown-border-color);\n          }\n\n          th,\n          td {\n            padding-block: 0.75em;\n            padding-inline: 1em;\n            text-align: start;\n            vertical-align: top;\n          }\n        }\n      "])), token.colorFillQuaternary, token.colorFillQuaternary),
     video: css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n        > video,\n        > p > video {\n          margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n          border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n          box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n        }\n\n        video {\n          max-width: 100%;\n        }\n      "])))
   };
 });

package/es/index.d.ts

@@ -57,6 +57,7 @@ export { default as LogoThree, type LogoThreeProps } from './LogoThree';
 export { default as LogoSpline, type LogoSplineProps } from './LogoThree/LogoSpline';
 export { default as Markdown, type MarkdownProps } from './Markdown';
 export { Typography, type TypographyProps } from './Markdown/Typography';
+export { mdxComponents, Pre, PreSingleLine } from './mdx';
 export { default as MessageInput, type MessageInputProps } from './MessageInput';
 export { default as MessageModal, type MessageModalProps } from './MessageModal';
 export { default as MobileNavBar, type MobileNavBarProps } from './MobileNavBar';

package/es/index.js

@@ -56,6 +56,7 @@ export { default as LogoThree } from "./LogoThree";
 export { default as LogoSpline } from "./LogoThree/LogoSpline";
 export { default as Markdown } from "./Markdown";
 export { Typography } from "./Markdown/Typography";
+export { mdxComponents, Pre, PreSingleLine } from "./mdx";
 export { default as MessageInput } from "./MessageInput";
 export { default as MessageModal } from "./MessageModal";
 export { default as MobileNavBar } from "./MobileNavBar";

package/es/mdx/Callout.js

@@ -1,18 +1,17 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3;
-import { Icon } from "./..";
 import { createStyles } from 'antd-style';
-import { isString } from 'lodash-es';
 import { Info, Lightbulb, MessageSquareWarning, OctagonAlert, TriangleAlert } from 'lucide-react';
 import { rgba } from 'polished';
 import { Flexbox } from 'react-layout-kit';
+import Icon from "../Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var useStyles = createStyles(function (_ref) {
   var css = _ref.css;
   return {
     container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      --lobe-markdown-margin-multiple: 1;\n\n      overflow: hidden;\n      gap: 0.75em;\n\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      padding-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      padding-inline: 1em;\n\n      border: 1px solid transparent;\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n    "]))),
-    content: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * -1em);\n\n      p {\n        color: inherit !important;\n      }\n    "]))),
+    content: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * -1em);\n\n      > div {\n        margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      }\n\n      p {\n        color: inherit !important;\n      }\n    "]))),
     underlineAnchor: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      a {\n        text-decoration: underline;\n      }\n    "])))
   };
 });
@@ -49,10 +48,6 @@ var Callout = function Callout(_ref2) {
   var selectedType = (typeConfig === null || typeConfig === void 0 ? void 0 : typeConfig[type]) || typeConfig.info;
   var icon = selectedType.icon,
     color = selectedType.color;
-  var content = children;
-  if (isString(children) || isString(children === null || children === void 0 ? void 0 : children[0])) content = /*#__PURE__*/_jsx("p", {
-    children: children
-  });
   return /*#__PURE__*/_jsxs(Flexbox, {
     align: 'flex-start',
     className: styles.container,
@@ -72,7 +67,9 @@ var Callout = function Callout(_ref2) {
       }
     }), /*#__PURE__*/_jsx("div", {
       className: cx(styles.content, type === 'info' && styles.underlineAnchor),
-      children: content
+      children: /*#__PURE__*/_jsx("div", {
+        children: children
+      })
     })]
   });
 };

package/es/mdx/Cards.d.ts

@@ -1,6 +1,6 @@
 import { FC, PropsWithChildren } from 'react';
 import { type FlexboxProps } from 'react-layout-kit';
-import { type IconProps } from '../Icon';
+import { type IconProps } from "../Icon";
 export interface CardProps extends Omit<FlexboxProps, 'children'> {
     desc?: string;
     href?: string;

package/es/mdx/FileTree.d.ts

@@ -1,5 +1,5 @@
 import { FC, ReactNode } from 'react';
-import { type IconProps } from '../Icon';
+import { type IconProps } from "../Icon";
 export interface _FileTreeProps {
     children: ReactNode;
 }

package/es/mdx/Pre.d.ts

@@ -1,8 +1,11 @@
-import { CSSProperties, FC } from 'react';
+import { CSSProperties, FC, ReactNode } from 'react';
 export interface PreProps {
+    allowChangeLanguage?: boolean;
     children: string;
     className?: string;
+    fileName?: string;
     fullFeatured?: boolean;
+    icon?: ReactNode;
     lang: string;
     style?: CSSProperties;
 }

package/es/mdx/Pre.js

@@ -8,27 +8,33 @@ import { jsx as _jsx } from "react/jsx-runtime";
 var useStyles = createStyles(function (_ref) {
   var css = _ref.css;
   return {
-    container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    overflow: hidden;\n    margin-block: 1em;\n    border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n    box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n  "]))),
+    container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    overflow: hidden;\n    margin-block: 1em;\n    border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n    box-shadow: inset 0 0 0 1px var(--lobe-markdown-border-color);\n  "]))),
     highlight: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    pre {\n      overflow-x: hidden !important;\n      padding: 1em !important;\n    }\n  "])))
   };
 });
 export var Pre = function Pre(_ref2) {
   var fullFeatured = _ref2.fullFeatured,
+    fileName = _ref2.fileName,
+    allowChangeLanguage = _ref2.allowChangeLanguage,
     _ref2$lang = _ref2.lang,
     lang = _ref2$lang === void 0 ? FALLBACK_LANG : _ref2$lang,
     children = _ref2.children,
     className = _ref2.className,
-    style = _ref2.style;
+    style = _ref2.style,
+    icon = _ref2.icon;
   var _useStyles = useStyles(),
     styles = _useStyles.styles,
     cx = _useStyles.cx;
   return /*#__PURE__*/_jsx(Highlighter, {
+    allowChangeLanguage: allowChangeLanguage,
     className: cx(styles.container, styles.highlight, className),
     copyButtonSize: {
       blockSize: 28,
       fontSize: 16
     },
+    fileName: fileName,
     fullFeatured: fullFeatured,
+    icon: icon,
     language: lang,
     style: style,
     type: "block",

package/es/mdx/Tabs.js

@@ -2,7 +2,6 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3;
 import { createStyles } from 'antd-style';
-import { isString } from 'lodash-es';
 import { useState } from 'react';
 import { Flexbox } from 'react-layout-kit';
 import TabsNav from "../TabsNav";
@@ -13,7 +12,7 @@ var useStyles = createStyles(function (_ref) {
     token = _ref.token,
     prefixCls = _ref.prefixCls;
   return {
-    body: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      padding-inline: 1em;\n    "]))),
+    body: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      padding-inline: 1em;\n\n      > div {\n        margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      }\n    "]))),
     container: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      --lobe-markdown-margin-multiple: 1;\n\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      background: ", ";\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n    "])), token.colorFillQuaternary),
     header: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      border-block-end: 1px solid var(--lobe-markdown-border-color);\n      .", "-tabs-tab-btn {\n        font-size: var(--lobe-markdown-font-size);\n        line-height: var(--lobe-markdown-line-height);\n      }\n    "])), prefixCls)
   };
@@ -22,13 +21,11 @@ var _TabItem = function _TabItem(_ref2) {
   var children = _ref2.children;
   var _useStyles = useStyles(),
     styles = _useStyles.styles;
-  var content = children;
-  if (isString(children) || isString(children === null || children === void 0 ? void 0 : children[0])) content = /*#__PURE__*/_jsx("p", {
-    children: children
-  });
   return /*#__PURE__*/_jsx("div", {
     className: styles.body,
-    children: content
+    children: /*#__PURE__*/_jsx("div", {
+      children: children
+    })
   });
 };
 var _Tabs = function _Tabs(_ref3) {

package/es/mdx/mdxComponents.d.ts

@@ -1,3 +1,13 @@
-import { FC } from 'react';
-declare const mdxComponents: Record<string, FC<any>>;
+/// <reference types="react" />
+declare const mdxComponents: {
+    Callout: import("react").FC<import("./Callout").CalloutProps>;
+    Cards: import("./Cards").CardsProps;
+    FileTree: import("./FileTree").FileTreeProps;
+    Image: import("react").FC<import("./Image").ImageProps>;
+    Steps: import("react").FC<{
+        children?: import("react").ReactNode;
+    }>;
+    Tabs: import("./Tabs").TabsProps;
+    Video: import("react").FC<import("./Video").VideoProps>;
+};
 export default mdxComponents;

package/package.json

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