@lobehub/ui 2.11.8 → 2.12.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.
Files changed (45) hide show
  1. package/es/ActionIcon/ActionIcon.js +4 -1
  2. package/es/Image/Image.js +2 -8
  3. package/es/Image/style.js +3 -3
  4. package/es/Markdown/Markdown.js +70 -77
  5. package/es/Markdown/Typography.js +4 -1
  6. package/es/{mdx/mdxComponents → Markdown/components}/Footnotes.d.ts +2 -2
  7. package/es/Markdown/components/Footnotes.js +120 -0
  8. package/es/Markdown/components/{SearchResultCard/index.js → SearchResultCards/SearchResultCard.js} +4 -2
  9. package/es/Markdown/components/SearchResultCards/index.js +7 -3
  10. package/es/Markdown/components/useDelayedAnimated.d.ts +1 -0
  11. package/es/Markdown/components/useDelayedAnimated.js +31 -0
  12. package/es/Markdown/markdown.style.js +12 -11
  13. package/es/Markdown/plugins/rehypeCustomFootnotes.d.ts +1 -0
  14. package/es/Markdown/plugins/{footnote.js → rehypeCustomFootnotes.js} +2 -34
  15. package/es/Markdown/plugins/rehypeStreamAnimated.d.ts +2 -0
  16. package/es/Markdown/plugins/{animated.js → rehypeStreamAnimated.js} +1 -1
  17. package/es/Markdown/plugins/remarkColor.d.ts +17 -0
  18. package/es/Markdown/plugins/remarkColor.js +188 -0
  19. package/es/Markdown/plugins/remarkCustomFootnotes.d.ts +6 -0
  20. package/es/Markdown/plugins/remarkCustomFootnotes.js +32 -0
  21. package/es/Markdown/plugins/remarkGfmPlus.d.ts +5 -0
  22. package/es/Markdown/plugins/remarkGfmPlus.js +140 -0
  23. package/es/Markdown/plugins/remarkVideo.d.ts +17 -0
  24. package/es/Markdown/plugins/remarkVideo.js +186 -0
  25. package/es/Markdown/style.d.ts +1 -0
  26. package/es/Markdown/style.js +5 -4
  27. package/es/Markdown/type.d.ts +1 -1
  28. package/es/Mermaid/SyntaxMermaid/index.js +4 -2
  29. package/es/Video/index.js +1 -1
  30. package/es/hooks/useMarkdown/useMarkdownComponents.js +65 -16
  31. package/es/hooks/useMarkdown/useMarkdownRehypePlugins.js +4 -4
  32. package/es/hooks/useMarkdown/useMarkdownRemarkPlugins.js +7 -3
  33. package/es/mdx/mdxComponents/Section.d.ts +0 -1
  34. package/es/mdx/mdxComponents/Section.js +1 -1
  35. package/package.json +2 -1
  36. package/es/Markdown/plugins/animated.d.ts +0 -2
  37. package/es/Markdown/plugins/footnote.d.ts +0 -2
  38. package/es/hooks/useMarkdown/fixMarkdownEmphasisSpacing.d.ts +0 -1
  39. package/es/hooks/useMarkdown/fixMarkdownEmphasisSpacing.js +0 -189
  40. package/es/mdx/mdxComponents/Footnotes.js +0 -44
  41. /package/es/Markdown/components/{SearchResultCard/index.d.ts → SearchResultCards/SearchResultCard.d.ts} +0 -0
  42. /package/es/Markdown/components/{SearchResultCard → SearchResultCards}/style.d.ts +0 -0
  43. /package/es/Markdown/components/{SearchResultCard → SearchResultCards}/style.js +0 -0
  44. /package/es/Markdown/plugins/{katexDir.d.ts → rehypeKatexDir.d.ts} +0 -0
  45. /package/es/Markdown/plugins/{katexDir.js → rehypeKatexDir.js} +0 -0
@@ -1,4 +1,4 @@
1
- var _templateObject, _templateObject2, _templateObject3;
1
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
2
2
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
3
3
  import { createStyles } from 'antd-style';
4
4
  export var useStyles = createStyles(function (_ref) {
@@ -7,8 +7,9 @@ export var useStyles = createStyles(function (_ref) {
7
7
  isDarkMode = _ref.isDarkMode;
8
8
  var cyanColor = isDarkMode ? token.cyan9A : token.cyan11A;
9
9
  return {
10
- chat: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n --lobe-markdown-border-radius: ", ";\n\n ol,\n ul {\n > li {\n &::marker {\n color: ", " !important;\n }\n\n > li {\n &::marker {\n color: ", " !important;\n }\n }\n }\n }\n\n ul {\n list-style: unset;\n\n > li {\n &::before {\n content: unset;\n display: unset;\n }\n }\n }\n "])), token.borderRadius, cyanColor, token.colorTextSecondary),
11
- latex: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n .katex-error {\n color: ", " !important;\n }\n\n .katex-html {\n overflow: auto hidden;\n padding: 3px;\n\n .base {\n margin-block: 0;\n margin-inline: auto;\n }\n\n .tag {\n position: relative !important;\n display: inline-block;\n padding-inline-start: 0.5rem;\n }\n }\n "])), token.colorTextDescription),
12
- root: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: relative;\n overflow: hidden;\n max-width: 100%;\n "])))
10
+ chat: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ol,\n ul {\n > li {\n &::marker {\n color: ", " !important;\n }\n\n > li {\n &::marker {\n color: ", " !important;\n }\n }\n }\n }\n\n ul {\n list-style: unset;\n\n > li {\n &::before {\n content: unset;\n display: unset;\n }\n }\n }\n "])), cyanColor, token.colorTextSecondary),
11
+ gfm: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n .markdown-alert {\n margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n padding-inline-start: 1em;\n border-inline-start: solid 4px ", ";\n\n > p {\n margin-block-start: 0 !important;\n }\n }\n\n .markdown-alert > :first-child {\n margin-block-start: 0;\n }\n\n .markdown-alert > :last-child {\n margin-block-end: 0;\n }\n\n .markdown-alert-note {\n border-inline-start-color: ", ";\n }\n\n .markdown-alert-tip {\n border-inline-start-color: ", ";\n }\n\n .markdown-alert-important {\n border-inline-start-color: ", ";\n }\n\n .markdown-alert-warning {\n border-inline-start-color: ", ";\n }\n\n .markdown-alert-caution {\n border-inline-start-color: ", ";\n }\n\n .markdown-alert-title {\n display: flex;\n align-items: center;\n margin-block-end: 0.5em !important;\n font-weight: 500;\n }\n\n .markdown-alert-note .markdown-alert-title {\n color: ", ";\n fill: ", ";\n }\n\n .markdown-alert-tip .markdown-alert-title {\n color: ", ";\n fill: ", ";\n }\n\n .markdown-alert-important .markdown-alert-title {\n color: ", ";\n fill: ", ";\n }\n\n .markdown-alert-warning .markdown-alert-title {\n color: ", ";\n fill: ", ";\n }\n\n .markdown-alert-caution .markdown-alert-title {\n color: ", ";\n fill: ", ";\n }\n\n /* Style the footnotes section. */\n\n .octicon {\n overflow: visible !important;\n display: inline-block;\n margin-inline-end: 0.5em;\n vertical-align: text-bottom;\n }\n\n .sr-only {\n position: absolute;\n\n overflow: hidden;\n\n width: 1px;\n height: 1px;\n padding: 0;\n border: 0;\n\n word-wrap: normal;\n\n clip: rect(0, 0, 0, 0);\n }\n\n sup:has(*[aria-describedby='footnote-label']) {\n margin-inline: 2px;\n vertical-align: super !important;\n\n [data-footnote-ref] {\n display: inline-block;\n\n width: 16px;\n height: 16px;\n border-radius: 4px;\n\n font-family: ", ";\n font-size: 10px;\n color: ", " !important;\n text-align: center;\n\n background: ", ";\n }\n }\n\n code.color-preview {\n position: relative;\n display: inline-flex !important;\n gap: 0.4em;\n\n &::after {\n content: '';\n\n width: 0.66em;\n height: 0.66em;\n border: 1px solid ", ";\n border-radius: 50%;\n\n background-color: attr(data-color);\n\n /* Fallback for browsers that don't support attr() in background */\n background-color: var(--color-preview-color, #000);\n }\n }\n "])), token.colorBorder, token.colorInfo, token.colorSuccess, token.purple, token.colorWarning, token.colorError, token.colorInfo, token.colorInfo, token.colorSuccess, token.colorSuccess, token.purple, token.purple, token.colorWarning, token.colorWarning, token.colorError, token.colorError, token.fontFamilyCode, token.colorTextSecondary, token.colorFillSecondary, token.colorFill),
12
+ latex: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n .katex-error {\n color: ", " !important;\n }\n\n .katex-html {\n overflow: auto hidden;\n padding: 3px;\n\n .base {\n margin-block: 0;\n margin-inline: auto;\n }\n\n .tag {\n position: relative !important;\n display: inline-block;\n padding-inline-start: 0.5rem;\n }\n }\n "])), token.colorTextDescription),
13
+ root: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: relative;\n overflow: hidden;\n max-width: 100%;\n "])))
13
14
  };
14
15
  });
@@ -9,6 +9,7 @@ import type { ImageProps, PreProps, VideoProps } from "../mdx";
9
9
  import type { AProps, DivProps } from "../types";
10
10
  import type { CitationItem } from "../types/citation";
11
11
  export interface TypographyProps extends DivProps {
12
+ borderRadius?: number;
12
13
  fontSize?: number;
13
14
  headerMultiple?: number;
14
15
  lineHeight?: number;
@@ -41,7 +42,6 @@ export interface SyntaxMarkdownProps {
41
42
  rehypePluginsAhead?: Pluggable[];
42
43
  remarkPlugins?: Pluggable[];
43
44
  remarkPluginsAhead?: Pluggable[];
44
- showFootnotes?: boolean;
45
45
  variant?: 'default' | 'chat';
46
46
  }
47
47
  export interface MarkdownProps extends SyntaxMarkdownProps, Omit<TypographyProps, 'children'> {
@@ -95,9 +95,11 @@ var SyntaxMermaid = /*#__PURE__*/memo(function (_ref) {
95
95
  borderRadius: 0,
96
96
  margin: 0,
97
97
  padding: variant === 'borderless' ? 0 : 16,
98
- position: 'relative'
98
+ position: 'relative',
99
+ width: '100%'
99
100
  },
100
- variant: 'borderless'
101
+ variant: 'borderless',
102
+ width: '100%'
101
103
  });
102
104
  }, function (prevProps, nextProps) {
103
105
  return prevProps.children === nextProps.children;
package/es/Video/index.js CHANGED
@@ -149,7 +149,7 @@ var Video = /*#__PURE__*/memo(function (_ref) {
149
149
  preload: preload,
150
150
  style: _objectSpread({
151
151
  height: 'auto',
152
- width: '100%'
152
+ maxWidth: '100%'
153
153
  }, customStyles === null || customStyles === void 0 ? void 0 : customStyles.video),
154
154
  width: width
155
155
  }, rest), {}, {
@@ -1,12 +1,21 @@
1
1
  'use client';
2
2
 
3
+ var _excluded = ["node"],
4
+ _excluded2 = ["node"],
5
+ _excluded3 = ["node"],
6
+ _excluded4 = ["node"],
7
+ _excluded5 = ["node"],
8
+ _excluded6 = ["node"];
3
9
  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); }
4
10
  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; }
5
11
  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; }
6
12
  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; }
7
13
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
8
14
  function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
15
+ 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; }
16
+ 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; }
9
17
  import { useCallback, useMemo } from 'react';
18
+ import Hotkey from "../../Hotkey";
10
19
  import { CodeBlock } from "../../Markdown/components/CodeBlock";
11
20
  import { useMarkdownContext } from "../../Markdown/components/MarkdownProvider";
12
21
  import Image from "../../mdx/mdxComponents/Image";
@@ -21,35 +30,62 @@ export var useMarkdownComponents = function useMarkdownComponents() {
21
30
  animated = _useMarkdownContext.animated,
22
31
  citations = _useMarkdownContext.citations,
23
32
  componentProps = _useMarkdownContext.componentProps,
24
- showFootnotes = _useMarkdownContext.showFootnotes,
25
33
  enableMermaid = _useMarkdownContext.enableMermaid,
26
34
  fullFeaturedCodeBlock = _useMarkdownContext.fullFeaturedCodeBlock;
27
- var memoA = useCallback(function (props) {
35
+ var memoA = useCallback(
36
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
37
+ function (_ref) {
38
+ var node = _ref.node,
39
+ props = _objectWithoutProperties(_ref, _excluded);
28
40
  return /*#__PURE__*/_jsx(Link, _objectSpread(_objectSpread({
29
41
  citations: citations
30
42
  }, props), componentProps === null || componentProps === void 0 ? void 0 : componentProps.a));
31
43
  }, [citations, componentProps === null || componentProps === void 0 ? void 0 : componentProps.a]);
32
- var memoImg = useCallback(function (props) {
44
+ var memoImg = useCallback(
45
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
46
+ function (_ref2) {
47
+ var node = _ref2.node,
48
+ props = _objectWithoutProperties(_ref2, _excluded2);
33
49
  return /*#__PURE__*/_jsx(Image, _objectSpread(_objectSpread({}, props), componentProps === null || componentProps === void 0 ? void 0 : componentProps.img));
34
50
  }, [componentProps === null || componentProps === void 0 ? void 0 : componentProps.img]);
35
- var memoVideo = useCallback(function (props) {
51
+ var memoVideo = useCallback(
52
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
53
+ function (_ref3) {
54
+ var node = _ref3.node,
55
+ props = _objectWithoutProperties(_ref3, _excluded3);
36
56
  return /*#__PURE__*/_jsx(Video, _objectSpread(_objectSpread({}, props), componentProps === null || componentProps === void 0 ? void 0 : componentProps.video));
37
57
  }, [componentProps === null || componentProps === void 0 ? void 0 : componentProps.video]);
38
- var memoSection = useCallback(function (props) {
39
- return /*#__PURE__*/_jsx(Section, _objectSpread({
40
- showFootnotes: showFootnotes
41
- }, props));
42
- }, [showFootnotes]);
58
+ var memoSection = useCallback(
59
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
60
+ function (_ref4) {
61
+ var node = _ref4.node,
62
+ props = _objectWithoutProperties(_ref4, _excluded4);
63
+ return /*#__PURE__*/_jsx(Section, _objectSpread({}, props));
64
+ }, []);
65
+ var memoKbd = useCallback(function (_ref5) {
66
+ var children = _ref5.children;
67
+ return /*#__PURE__*/_jsx(Hotkey, {
68
+ keys: children,
69
+ style: {
70
+ display: 'inline-flex'
71
+ }
72
+ });
73
+ }, []);
43
74
  var memoBr = useCallback(function () {
44
75
  return /*#__PURE__*/_jsx("br", {});
45
76
  }, []);
46
- var memeP = useCallback(function (_ref) {
77
+ var memeP = useCallback(function (_ref6) {
47
78
  var _children$props;
48
- var children = _ref.children,
49
- className = _ref.className;
50
- var hasImage = _typeof(children) === 'object' && (children === null || children === void 0 || (_children$props = children.props) === null || _children$props === void 0 || (_children$props = _children$props.node) === null || _children$props === void 0 ? void 0 : _children$props.tagName) === 'img';
51
- return hasImage ? children : /*#__PURE__*/_jsx("p", {
79
+ var style = _ref6.style,
80
+ children = _ref6.children,
81
+ className = _ref6.className;
82
+ var skipWrapperTags = ['img', 'video'];
83
+ if (_typeof(children) === 'object' && skipWrapperTags.includes(children === null || children === void 0 || (_children$props = children.props) === null || _children$props === void 0 || (_children$props = _children$props.node) === null || _children$props === void 0 ? void 0 : _children$props.tagName)) {
84
+ return children;
85
+ }
86
+ return /*#__PURE__*/_jsx("p", {
52
87
  className: className,
88
+ style: style,
53
89
  children: children
54
90
  });
55
91
  }, []);
@@ -76,24 +112,37 @@ export var useMarkdownComponents = function useMarkdownComponents() {
76
112
  }) : undefined
77
113
  };
78
114
  }, [highlightTheme, mermaidTheme]);
79
- var memoPre = useCallback(function (props) {
115
+ var memoPre = useCallback(
116
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
117
+ function (_ref7) {
118
+ var node = _ref7.node,
119
+ props = _objectWithoutProperties(_ref7, _excluded5);
80
120
  return /*#__PURE__*/_jsx(CodeBlock, _objectSpread(_objectSpread(_objectSpread({
81
121
  animated: animated,
82
122
  enableMermaid: enableMermaid,
83
123
  fullFeatured: fullFeaturedCodeBlock
84
124
  }, stableComponentProps), componentProps === null || componentProps === void 0 ? void 0 : componentProps.pre), props));
85
125
  }, [animated, enableMermaid, fullFeaturedCodeBlock, stableComponentProps, componentProps === null || componentProps === void 0 ? void 0 : componentProps.pre]);
126
+ var memoColorPreview = useCallback(
127
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
128
+ function (_ref8) {
129
+ var node = _ref8.node,
130
+ props = _objectWithoutProperties(_ref8, _excluded6);
131
+ return /*#__PURE__*/_jsx("code", _objectSpread({}, props));
132
+ }, []);
86
133
  var memoComponents = useMemo(function () {
87
134
  return {
88
135
  a: memoA,
89
136
  br: memoBr,
137
+ colorPreview: memoColorPreview,
90
138
  img: memoImg,
139
+ kbd: memoKbd,
91
140
  p: memeP,
92
141
  pre: memoPre,
93
142
  section: memoSection,
94
143
  video: memoVideo
95
144
  };
96
- }, [memoA, memoBr, memoImg, memoVideo, memoPre, memoSection, memeP]);
145
+ }, [memoA, memoBr, memoImg, memoVideo, memoPre, memoSection, memeP, memoColorPreview, memoKbd]);
97
146
  return useMemo(function () {
98
147
  return _objectSpread(_objectSpread({}, memoComponents), components);
99
148
  }, [memoComponents, components]);
@@ -11,9 +11,9 @@ import { rehypeGithubAlerts } from 'rehype-github-alerts';
11
11
  import rehypeKatex from 'rehype-katex';
12
12
  import rehypeRaw from 'rehype-raw';
13
13
  import { useMarkdownContext } from "../../Markdown/components/MarkdownProvider";
14
- import { animatedPlugin } from "../../Markdown/plugins/animated";
15
- import { rehypeFootnoteLinks } from "../../Markdown/plugins/footnote";
16
- import { rehypeKatexDir } from "../../Markdown/plugins/katexDir";
14
+ import { rehypeCustomFootnotes } from "../../Markdown/plugins/rehypeCustomFootnotes";
15
+ import { rehypeKatexDir } from "../../Markdown/plugins/rehypeKatexDir";
16
+ import { rehypeStreamAnimated } from "../../Markdown/plugins/rehypeStreamAnimated";
17
17
  export var useMarkdownRehypePlugins = function useMarkdownRehypePlugins() {
18
18
  var _useMarkdownContext = useMarkdownContext(),
19
19
  animated = _useMarkdownContext.animated,
@@ -26,7 +26,7 @@ export var useMarkdownRehypePlugins = function useMarkdownRehypePlugins() {
26
26
  _useMarkdownContext$r2 = _useMarkdownContext.rehypePluginsAhead,
27
27
  rehypePluginsAhead = _useMarkdownContext$r2 === void 0 ? [] : _useMarkdownContext$r2;
28
28
  var memoPlugins = useMemo(function () {
29
- return [allowHtml && rehypeRaw, enableGithubAlert && rehypeGithubAlerts, enableLatex && rehypeKatex, enableLatex && rehypeKatexDir, enableCustomFootnotes && rehypeFootnoteLinks, animated && animatedPlugin].filter(Boolean);
29
+ return [allowHtml && rehypeRaw, enableGithubAlert && rehypeGithubAlerts, enableLatex && rehypeKatex, enableLatex && rehypeKatexDir, enableCustomFootnotes && rehypeCustomFootnotes, animated && rehypeStreamAnimated].filter(Boolean);
30
30
  }, [animated, enableLatex, enableGithubAlert, enableCustomFootnotes, allowHtml]);
31
31
  return useMemo(function () {
32
32
  return [].concat(_toConsumableArray(rehypePluginsAhead), _toConsumableArray(memoPlugins), _toConsumableArray(rehypePlugins));
@@ -8,11 +8,15 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
8
8
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
9
9
  import { useMemo } from 'react';
10
10
  import remarkBreaks from 'remark-breaks';
11
+ import remarkCjkFriendly from 'remark-cjk-friendly';
11
12
  import remarkGfm from 'remark-gfm';
12
13
  import remarkMath from 'remark-math';
13
14
  import { useMarkdownContext } from "../../Markdown/components/MarkdownProvider";
14
- import { remarkCustomFootnotes } from "../../Markdown/plugins/footnote";
15
15
  import { remarkBr } from "../../Markdown/plugins/remarkBr";
16
+ import { remarkColor } from "../../Markdown/plugins/remarkColor";
17
+ import { remarkCustomFootnotes } from "../../Markdown/plugins/remarkCustomFootnotes";
18
+ import { remarkGfmPlus } from "../../Markdown/plugins/remarkGfmPlus";
19
+ import { remarkVideo } from "../../Markdown/plugins/remarkVideo";
16
20
  export var useMarkdownRemarkPlugins = function useMarkdownRemarkPlugins() {
17
21
  var _useMarkdownContext = useMarkdownContext(),
18
22
  enableLatex = _useMarkdownContext.enableLatex,
@@ -25,9 +29,9 @@ export var useMarkdownRemarkPlugins = function useMarkdownRemarkPlugins() {
25
29
  allowHtml = _useMarkdownContext.allowHtml;
26
30
  var isChatMode = variant === 'chat';
27
31
  var memoPlugins = useMemo(function () {
28
- return [!allowHtml && remarkBr, [remarkGfm, {
32
+ return [remarkCjkFriendly, [remarkGfm, {
29
33
  singleTilde: false
30
- }], enableLatex && remarkMath, enableCustomFootnotes && remarkCustomFootnotes, isChatMode && remarkBreaks].filter(Boolean);
34
+ }], !allowHtml && remarkBr, !allowHtml && remarkGfmPlus, !allowHtml && remarkVideo, remarkColor, enableLatex && remarkMath, enableCustomFootnotes && remarkCustomFootnotes, isChatMode && remarkBreaks].filter(Boolean);
31
35
  }, [allowHtml, isChatMode, enableLatex, enableCustomFootnotes]);
32
36
  return useMemo(function () {
33
37
  return [].concat(_toConsumableArray(remarkPluginsAhead), _toConsumableArray(memoPlugins), _toConsumableArray(remarkPlugins));
@@ -2,7 +2,6 @@ import type { FC, ReactNode } from 'react';
2
2
  interface SectionProps {
3
3
  'children': ReactNode;
4
4
  'data-footnotes'?: boolean;
5
- 'showFootnotes'?: boolean;
6
5
  }
7
6
  declare const Section: FC<SectionProps>;
8
7
  export default Section;
@@ -9,7 +9,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
9
9
  function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
10
10
  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; }
11
11
  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; }
12
- import Footnotes from "./Footnotes";
12
+ import Footnotes from "../../Markdown/components/Footnotes";
13
13
  import { jsx as _jsx } from "react/jsx-runtime";
14
14
  var Section = function Section(_ref) {
15
15
  var children = _ref.children,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/ui",
3
- "version": "2.11.8",
3
+ "version": "2.12.0",
4
4
  "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
5
5
  "keywords": [
6
6
  "lobehub",
@@ -96,6 +96,7 @@
96
96
  "rehype-katex": "^7.0.1",
97
97
  "rehype-raw": "^7.0.0",
98
98
  "remark-breaks": "^4.0.0",
99
+ "remark-cjk-friendly": "^1.2.1",
99
100
  "remark-gfm": "^4.0.1",
100
101
  "remark-github": "^12.0.0",
101
102
  "remark-math": "^6.0.0",
@@ -1,2 +0,0 @@
1
- import type { Root } from 'hast';
2
- export declare const animatedPlugin: () => (tree: Root) => void;
@@ -1,2 +0,0 @@
1
- export declare const remarkCustomFootnotes: () => (tree: any, file: any) => void;
2
- export declare const rehypeFootnoteLinks: () => (tree: any, file: any) => void;
@@ -1 +0,0 @@
1
- export declare function fixMarkdownEmphasisSpacing(text: string): string;
@@ -1,189 +0,0 @@
1
- function splitInlineCode(text) {
2
- var segments = [];
3
- var currentPos = 0;
4
-
5
- // 匹配行内代码,支持多个反引号
6
- var inlineCodeRegex = /(`+)([^`]*?)\1/g;
7
- var match;
8
- while ((match = inlineCodeRegex.exec(text)) !== null) {
9
- // 添加代码前的普通文本
10
- if (match.index > currentPos) {
11
- segments.push({
12
- content: text.slice(currentPos, match.index),
13
- isCode: false
14
- });
15
- }
16
-
17
- // 添加行内代码
18
- segments.push({
19
- content: match[0],
20
- isCode: true
21
- });
22
- currentPos = match.index + match[0].length;
23
- }
24
-
25
- // 添加最后剩余的普通文本
26
- if (currentPos < text.length) {
27
- segments.push({
28
- content: text.slice(currentPos),
29
- isCode: false
30
- });
31
- }
32
- return segments;
33
- }
34
- function applyEmphasisFixes(text) {
35
- var result = text;
36
-
37
- // Step 1: Remove trailing spaces inside emphasis markers
38
- var removeInternalSpaces = [
39
- // 处理 **bold** 格式(两个星号)- 只处理一个空格,确保内容不包含表格分隔符
40
- {
41
- pattern: /(\*\*)([^\n*|]+?)( )(\*\*)/g,
42
- replacement: '$1$2$4'
43
- },
44
- // 处理 __bold__ 格式(两个下划线)- 只处理一个空格,确保内容不包含表格分隔符
45
- {
46
- pattern: /(__)([^\n_|]+?)( )(__)/g,
47
- replacement: '$1$2$4'
48
- },
49
- // 处理 ~~strikethrough~~ 格式(删除线)- 只处理一个空格,确保内容不包含表格分隔符
50
- {
51
- pattern: /(~~)([^\n|~]+?)( )(~~)/g,
52
- replacement: '$1$2$4'
53
- },
54
- // 处理单个 * 格式 - 只处理一个空格,使用更精确的边界匹配,确保内容不包含表格分隔符
55
- {
56
- pattern: /(^|[^\w*])(\*(?!\*))([^\n*|]+?)( )(\*(?!\*))/g,
57
- replacement: '$1$2$3$5'
58
- },
59
- // 处理单个 _ 格式 - 只处理一个空格,使用更精确的边界匹配,确保内容不包含表格分隔符
60
- {
61
- pattern: /(^|\W)(_(?!_))([^\n_|]+?)( )(_(?!_))/g,
62
- replacement: '$1$2$3$5'
63
- }];
64
- result = removeInternalSpaces.reduce(function (text, _ref) {
65
- var pattern = _ref.pattern,
66
- replacement = _ref.replacement;
67
- return text.replace(pattern, replacement);
68
- }, result);
69
-
70
- // Step 2: Add space after closing emphasis markers when followed by symbols/punctuation/Chinese characters
71
- // Define emphasis patterns
72
- var emphasisPatterns = [
73
- // ** (bold) - exclude table separators from content
74
- {
75
- markerChar: '*',
76
- pattern: /(\*\*)([^\n*|]*?)(\*\*)(\S)/g
77
- },
78
- // __ (bold) - exclude table separators from content
79
- {
80
- markerChar: '_',
81
- pattern: /(__)([^\n_|]*?)(__)(\S)/g
82
- },
83
- // * (italic) - need to avoid matching **, exclude table separators from content
84
- {
85
- markerChar: '*',
86
- pattern: /(\*(?!\*))([^\n*|]*?)(\*(?!\*))(\S)/g
87
- },
88
- // _ (italic) - need to avoid matching __, exclude table separators from content
89
- {
90
- markerChar: '_',
91
- pattern: /(_(?!_))([^\n_|]*?)(_(?!_))(\S)/g
92
- },
93
- // ~~ (strikethrough) - exclude table separators from content
94
- {
95
- markerChar: '~',
96
- pattern: /(~~)([^\n|~]*?)(~~)(\S)/g
97
- }];
98
-
99
- // Apply space after closing markers for each emphasis type
100
- for (var _i = 0, _emphasisPatterns = emphasisPatterns; _i < _emphasisPatterns.length; _i++) {
101
- var pattern = _emphasisPatterns[_i].pattern;
102
- result = result.replaceAll(pattern, function (match, start, content, end, nextChar) {
103
- // Check if the content ends with a symbol/punctuation (like :, :, etc.)
104
- var lastChar = content.slice(-1);
105
- var isSymbolOrPunctuation = /[!"#$%&'()*+,./:;<=>?@[\\\]^_`{|}~、。《》【】!(),:;?{|}-]/.test(lastChar);
106
-
107
- // Don't add space if next character is a table separator or other markdown structural characters
108
- var isTableSeparator = nextChar === '|';
109
- var isMarkdownStructural = /[()[\]{}]/.test(nextChar);
110
-
111
- // If content ends with symbol/punctuation and next character is not whitespace, add space
112
- // But skip if it's a table separator or markdown structural character
113
- if (isSymbolOrPunctuation && nextChar && !/\s/.test(nextChar) && !isTableSeparator && !isMarkdownStructural) {
114
- return start + content + end + ' ' + nextChar;
115
- }
116
- return match;
117
- });
118
- }
119
- return result;
120
- }
121
- function splitMarkdownWithAllCodeTypes(text) {
122
- var segments = [];
123
- var lines = text.split('\n');
124
- var currentSegment = '';
125
- var isInCodeBlock = false;
126
- var codeBlockType = null; // 'fenced' | 'indented'
127
-
128
- for (var i = 0; i < lines.length; i++) {
129
- var line = lines[i];
130
-
131
- // 检查围栏代码块的开始/结束
132
- var fencedCodeMatch = line.match(/^(\s*)(```|~~~)/);
133
- if (fencedCodeMatch && !isInCodeBlock) {
134
- // 开始围栏代码块
135
- if (currentSegment) {
136
- segments.push({
137
- content: currentSegment,
138
- isCode: false
139
- });
140
- currentSegment = '';
141
- }
142
- isInCodeBlock = true;
143
- codeBlockType = 'fenced';
144
- currentSegment = line + (i < lines.length - 1 ? '\n' : '');
145
- } else if (fencedCodeMatch && isInCodeBlock && codeBlockType === 'fenced') {
146
- // 结束围栏代码块
147
- currentSegment += line + (i < lines.length - 1 ? '\n' : '');
148
- segments.push({
149
- content: currentSegment,
150
- isCode: true
151
- });
152
- currentSegment = '';
153
- isInCodeBlock = false;
154
- codeBlockType = null;
155
- } else if (isInCodeBlock) {
156
- // 在代码块内部
157
- currentSegment += line + (i < lines.length - 1 ? '\n' : '');
158
- } else {
159
- // 普通行,但需要检查行内代码
160
- currentSegment += line + (i < lines.length - 1 ? '\n' : '');
161
- }
162
- }
163
-
164
- // 处理最后的片段
165
- if (currentSegment) {
166
- segments.push({
167
- content: currentSegment,
168
- isCode: isInCodeBlock
169
- });
170
- }
171
-
172
- // 进一步处理行内代码
173
- return segments.flatMap(function (segment) {
174
- if (segment.isCode) {
175
- return [segment];
176
- }
177
- return splitInlineCode(segment.content);
178
- });
179
- }
180
- export function fixMarkdownEmphasisSpacing(text) {
181
- // 更完善的代码块识别,包括缩进代码块
182
- var segments = splitMarkdownWithAllCodeTypes(text);
183
- return segments.map(function (segment) {
184
- if (segment.isCode) {
185
- return segment.content;
186
- }
187
- return applyEmphasisFixes(segment.content);
188
- }).join('');
189
- }
@@ -1,44 +0,0 @@
1
- 'use client';
2
-
3
- var _excluded = ["children"];
4
- var _templateObject;
5
- 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; }
6
- 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; }
7
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
8
- import { createStyles } from 'antd-style';
9
- import { useMemo } from 'react';
10
- import SearchResultCards from "../../Markdown/components/SearchResultCards";
11
- import { jsx as _jsx } from "react/jsx-runtime";
12
- var useStyles = createStyles(function (_ref) {
13
- var css = _ref.css,
14
- token = _ref.token;
15
- return {
16
- fallback: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n padding-block: 1em;\n font-size: 0.875em;\n color: ", ";\n\n ol {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5em;\n\n margin: 0;\n padding: 0;\n\n list-style-type: none;\n }\n\n ol li {\n position: relative;\n\n overflow: hidden;\n display: flex;\n flex-direction: row;\n\n margin: 0 !important;\n padding-block: 0 !important;\n padding-inline: 0 0.4em !important;\n border: 1px solid ", ";\n border-radius: 0.25em;\n\n text-overflow: ellipsis;\n white-space: nowrap;\n\n &::before {\n content: counter(list-item);\n counter-increment: list-item;\n\n display: block;\n\n margin-inline-end: 0.4em;\n padding-inline: 0.6em;\n\n background: ", ";\n }\n\n p,\n a {\n overflow: hidden;\n\n margin: 0 !important;\n padding: 0 !important;\n\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n "])), token.colorTextSecondary, token.colorBorderSecondary, token.colorFillSecondary)
17
- };
18
- });
19
- var Footnotes = function Footnotes(_ref2) {
20
- var children = _ref2.children,
21
- rest = _objectWithoutProperties(_ref2, _excluded);
22
- var _useStyles = useStyles(),
23
- styles = _useStyles.styles,
24
- cx = _useStyles.cx;
25
- var links = useMemo(function () {
26
- try {
27
- return JSON.parse(rest['data-footnote-links'] || '');
28
- } catch (error) {
29
- console.error(error);
30
- console.log(rest);
31
- return [];
32
- }
33
- }, [rest['data-footnote-links']]);
34
- var isError = links.length === 0;
35
- return /*#__PURE__*/_jsx("section", {
36
- className: cx('footnotes', isError && styles.fallback),
37
- "data-footnotes": "true",
38
- children: isError ? children : /*#__PURE__*/_jsx(SearchResultCards, {
39
- dataSource: links
40
- })
41
- });
42
- };
43
- Footnotes.displayName = 'MdxFootnotes';
44
- export default Footnotes;