@lobehub/ui 1.7.2 → 1.7.3

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 (9) hide show
  1. package/es/Markdown/index.js +3 -2
  2. package/es/Markdown/style.js +1 -1
  3. package/es/ThemeProvider/GlobalStyle.js +1 -1
  4. package/es/styles/theme/base.js +6 -6
  5. package/lib/Markdown/index.js +3 -2
  6. package/lib/Markdown/style.js +1 -0
  7. package/lib/ThemeProvider/GlobalStyle.js +5 -0
  8. package/lib/styles/theme/base.js +6 -6
  9. package/package.json +5 -3
package/es/Markdown/index.js CHANGED
@@ -1,10 +1,11 @@
1
1
  import { Divider, Typography } from 'antd';
2
+ import pangu from 'pangu';
2
3
  import { memo } from 'react';
3
4
  import ReactMarkdown from 'react-markdown';
4
5
  import remarkGfm from 'remark-gfm';
5
- import { useStyles } from "./style";
6
6
  import Code from "./Code";
7
7
  import CodeBlock from "./CodeBlock";
8
+ import { useStyles } from "./style";
8
9
  import { jsx as _jsx } from "react/jsx-runtime";
9
10
  var Markdown = /*#__PURE__*/memo(function (_ref) {
10
11
  var children = _ref.children,
@@ -23,7 +24,7 @@ var Markdown = /*#__PURE__*/memo(function (_ref) {
23
24
  className: cx(styles.container, className),
24
25
  components: components,
25
26
  remarkPlugins: [remarkGfm],
26
- children: children
27
+ children: pangu.spacing(children)
27
28
  })
28
29
  });
29
30
  });
package/es/Markdown/style.js CHANGED
@@ -6,7 +6,7 @@ export var useStyles = createStyles(function (_ref) {
6
6
  token = _ref.token,
7
7
  isDarkMode = _ref.isDarkMode;
8
8
  return {
9
- container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n color: ", ";\n\n p {\n margin: 20px auto;\n\n font-size: 14px;\n line-height: 2;\n color: ", ";\n word-wrap: break-word;\n }\n\n blockquote {\n margin: 16px 0;\n padding: 0 12px;\n p {\n font-style: italic;\n color: ", ";\n }\n }\n\n p:not(:last-child) {\n margin-bottom: 1em;\n }\n\n a {\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n }\n\n img {\n max-width: 100%;\n }\n\n > :not([data-code-type='highlighter']) code {\n padding: 2px 6px;\n color: ", ";\n background: ", ";\n border-radius: 4px;\n }\n\n table {\n border-spacing: 0;\n\n width: 100%;\n margin-block-start: 1em;\n margin-block-end: 1em;\n margin-inline-start: 0px;\n margin-inline-end: 0px;\n padding: 8px;\n\n border: 1px solid ", ";\n border-radius: ", "px;\n }\n\n th,\n td {\n padding-block-start: 10px;\n padding-block-end: 10px;\n padding-inline-start: 16px;\n padding-inline-end: 16px;\n }\n\n thead {\n tr {\n th {\n background: ", ";\n &:first-child {\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n }\n &:last-child {\n border-top-right-radius: ", "px;\n border-bottom-right-radius: ", "px;\n }\n }\n }\n }\n\n ul li {\n line-height: 1.8;\n }\n "])), isDarkMode ? token.colorTextSecondary : token.colorText, token.colorText, token.colorTextDescription, token.colorLink, token.colorLinkHover, token.colorLinkActive, isDarkMode ? token['cyan-7'] : token.colorPrimaryText, isDarkMode ? token['cyan-1'] : token.colorPrimaryBg, token.colorBorder, token.borderRadius, token.colorFillTertiary, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius),
9
+ container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n color: ", ";\n\n p {\n margin: 20px auto;\n\n font-size: 14px;\n line-height: 2;\n color: ", ";\n text-align: justify;\n word-wrap: break-word;\n }\n\n blockquote {\n margin: 16px 0;\n padding: 0 12px;\n p {\n font-style: italic;\n color: ", ";\n }\n }\n\n p:not(:last-child) {\n margin-bottom: 1em;\n }\n\n a {\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n }\n\n img {\n max-width: 100%;\n }\n\n > :not([data-code-type='highlighter']) code {\n padding: 2px 6px;\n color: ", ";\n background: ", ";\n border-radius: 4px;\n }\n\n table {\n border-spacing: 0;\n\n width: 100%;\n margin-block-start: 1em;\n margin-block-end: 1em;\n margin-inline-start: 0px;\n margin-inline-end: 0px;\n padding: 8px;\n\n border: 1px solid ", ";\n border-radius: ", "px;\n }\n\n th,\n td {\n padding-block-start: 10px;\n padding-block-end: 10px;\n padding-inline-start: 16px;\n padding-inline-end: 16px;\n }\n\n thead {\n tr {\n th {\n background: ", ";\n &:first-child {\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n }\n &:last-child {\n border-top-right-radius: ", "px;\n border-bottom-right-radius: ", "px;\n }\n }\n }\n }\n\n ul li {\n line-height: 1.8;\n }\n "])), isDarkMode ? token.colorTextSecondary : token.colorText, token.colorText, token.colorTextDescription, token.colorLink, token.colorLinkHover, token.colorLinkActive, isDarkMode ? token['cyan-7'] : token.colorPrimaryText, isDarkMode ? token['cyan-1'] : token.colorPrimaryBg, token.colorBorder, token.borderRadius, token.colorFillTertiary, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius),
10
10
  code: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 2px 4px;\n font-family: ", " !important;\n color: ", ";\n border-radius: 4px;\n "])), token.fontFamilyCode, isDarkMode ? token.cyan8 : token.pink7)
11
11
  };
12
12
  });
package/es/ThemeProvider/GlobalStyle.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
2
2
  var _templateObject;
3
3
  import { createGlobalStyle } from 'antd-style';
4
- var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n html,body {\n --font-settings: \"cv01\";\n --font-variations: \"opsz\" auto;\n\n overflow-x: hidden;\n\n margin: 0;\n padding: 0;\n\n font-family: ", ";\n font-size: ", "px;\n font-feature-settings: var(--font-settings);\n font-variation-settings: var(--font-variations);\n line-height: 1;\n color: ", ";\n text-size-adjust: none;\n text-rendering: optimizelegibility;\n vertical-align: baseline;\n\n color-scheme: dark;\n background-color: ", ";\n\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n\n * {\n box-sizing: border-box;\n vertical-align: baseline;\n }\n\n #root {\n\t min-height: 100vh;\n }\n\n ::-webkit-scrollbar {\n width: 0;\n height: 4px;\n background-color: transparent;\n\n &-thumb {\n background-color: ", ";\n border-radius: 4px;\n }\n\n &-corner {\n display: none;\n }\n }\n"])), function (_ref) {
4
+ var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n html,body {\n --font-settings: \"cv01\";\n --font-variations: \"opsz\" auto;\n\n overflow-x: hidden;\n\n margin: 0;\n padding: 0;\n\n font-family: ", ";\n font-size: ", "px;\n font-feature-settings: var(--font-settings);\n font-variation-settings: var(--font-variations);\n line-height: 1;\n color: ", ";\n text-size-adjust: none;\n text-rendering: optimizelegibility;\n vertical-align: baseline;\n\n color-scheme: dark;\n background-color: ", ";\n\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n\n * {\n box-sizing: border-box;\n vertical-align: baseline;\n }\n\n #root {\n\t min-height: 100vh;\n }\n\n ::-webkit-scrollbar {\n width: 0;\n height: 4px;\n background-color: transparent;\n\n &-thumb {\n background-color: ", ";\n border-radius: 4px;\n }\n\n &-corner {\n display: none;\n }\n }\n\n p {\n text-align: justify;\n word-wrap: break-word;\n }\n"])), function (_ref) {
5
5
  var theme = _ref.theme;
6
6
  return theme.fontFamily;
7
7
  }, function (_ref2) {
package/es/styles/theme/base.js CHANGED
@@ -1,7 +1,7 @@
1
- var fontEmoji = "\"\"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Segoe UI\", Apple Color Emoji\", \"Twemoji Mozilla\", \"Noto Color Emoji\", \"Android Emoji\"";
2
- var fontEn = "\"Segoe UI\", \"SF Pro Display\",-apple-system, BlinkMacSystemFont, Roboto, Oxygen, Ubuntu, Cantarell, \"Open Sans\", \"Helvetica Neue\", sans-serif";
3
- var fontCn = "\"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft Yahei UI\", \"Microsoft Yahei\", \"Source Han Sans CN\", sans-serif";
4
- var fontCode = "\"Hack Nerd Font Mono\", Hack, \"SFMono Regular\", Consolas, \"Liberation Mono\", Menlo, Courier, monospace";
1
+ var FONT_EMOJI = "\"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Apple Color Emoji\", \"Twemoji Mozilla\", \"Noto Color Emoji\", \"Android Emoji\"";
2
+ var FONT_EN = "\"Segoe UI\", \"SF Pro Display\",-apple-system, BlinkMacSystemFont, Roboto, Oxygen, Ubuntu, Cantarell, \"Open Sans\", \"Helvetica Neue\", sans-serif";
3
+ var FONT_CN = "\"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft Yahei UI\", \"Microsoft Yahei\", \"Source Han Sans CN\", sans-serif";
4
+ var FONT_CODE = "\"Hack Nerd Font Mono\", Hack, \"SFMono Regular\", Consolas, \"Liberation Mono\", Menlo, Courier, monospace";
5
5
  export var baseTheme = {
6
6
  token: {
7
7
  colorInfo: '#0070f3',
@@ -13,7 +13,7 @@ export var baseTheme = {
13
13
  borderRadiusSM: 3,
14
14
  borderRadiusLG: 8,
15
15
  controlHeight: 36,
16
- fontFamily: [fontEn, fontCn, fontEmoji].join(','),
17
- fontFamilyCode: fontCode
16
+ fontFamily: [FONT_EN, FONT_CN, FONT_EMOJI].join(','),
17
+ fontFamilyCode: FONT_CODE
18
18
  }
19
19
  };
package/lib/Markdown/index.js CHANGED
@@ -33,12 +33,13 @@ __export(Markdown_exports, {
33
33
  });
34
34
  module.exports = __toCommonJS(Markdown_exports);
35
35
  var import_antd = require("antd");
36
+ var import_pangu = __toESM(require("pangu"));
36
37
  var import_react = require("react");
37
38
  var import_react_markdown = __toESM(require("react-markdown"));
38
39
  var import_remark_gfm = __toESM(require("remark-gfm"));
39
- var import_style = require("./style");
40
40
  var import_Code = __toESM(require("./Code"));
41
41
  var import_CodeBlock = __toESM(require("./CodeBlock"));
42
+ var import_style = require("./style");
42
43
  var Markdown = (0, import_react.memo)(({ children, className }) => {
43
44
  const { styles, cx } = (0, import_style.useStyles)();
44
45
  const components = { pre: import_CodeBlock.default, code: import_Code.default, hr: import_antd.Divider, a: import_antd.Typography.Link };
@@ -49,7 +50,7 @@ var Markdown = (0, import_react.memo)(({ children, className }) => {
49
50
  components,
50
51
  remarkPlugins: [import_remark_gfm.default]
51
52
  },
52
- children
53
+ import_pangu.default.spacing(children)
53
54
  ));
54
55
  });
55
56
  var Markdown_default = Markdown;
package/lib/Markdown/style.js CHANGED
@@ -34,6 +34,7 @@ var useStyles = (0, import_antd_style.createStyles)(({ css, token, isDarkMode })
34
34
  font-size: 14px;
35
35
  line-height: 2;
36
36
  color: ${token.colorText};
37
+ text-align: justify;
37
38
  word-wrap: break-word;
38
39
  }
39
40
 
package/lib/ThemeProvider/GlobalStyle.js CHANGED
@@ -76,6 +76,11 @@ var GlobalStyle = import_antd_style.createGlobalStyle`
76
76
  display: none;
77
77
  }
78
78
  }
79
+
80
+ p {
81
+ text-align: justify;
82
+ word-wrap: break-word;
83
+ }
79
84
  `;
80
85
  var GlobalStyle_default = GlobalStyle;
81
86
  // Annotate the CommonJS export names for ESM import in node:
package/lib/styles/theme/base.js CHANGED
@@ -22,10 +22,10 @@ __export(base_exports, {
22
22
  baseTheme: () => baseTheme
23
23
  });
24
24
  module.exports = __toCommonJS(base_exports);
25
- var fontEmoji = `""Segoe UI Emoji", "Segoe UI Symbol", "Segoe UI", Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "Android Emoji"`;
26
- var fontEn = `"Segoe UI", "SF Pro Display",-apple-system, BlinkMacSystemFont, Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif`;
27
- var fontCn = `"PingFang SC", "Hiragino Sans GB", "Microsoft Yahei UI", "Microsoft Yahei", "Source Han Sans CN", sans-serif`;
28
- var fontCode = `"Hack Nerd Font Mono", Hack, "SFMono Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace`;
25
+ var FONT_EMOJI = `"Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "Android Emoji"`;
26
+ var FONT_EN = `"Segoe UI", "SF Pro Display",-apple-system, BlinkMacSystemFont, Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif`;
27
+ var FONT_CN = `"PingFang SC", "Hiragino Sans GB", "Microsoft Yahei UI", "Microsoft Yahei", "Source Han Sans CN", sans-serif`;
28
+ var FONT_CODE = `"Hack Nerd Font Mono", Hack, "SFMono Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace`;
29
29
  var baseTheme = {
30
30
  token: {
31
31
  colorInfo: "#0070f3",
@@ -37,8 +37,8 @@ var baseTheme = {
37
37
  borderRadiusSM: 3,
38
38
  borderRadiusLG: 8,
39
39
  controlHeight: 36,
40
- fontFamily: [fontEn, fontCn, fontEmoji].join(","),
41
- fontFamilyCode: fontCode
40
+ fontFamily: [FONT_EN, FONT_CN, FONT_EMOJI].join(","),
41
+ fontFamilyCode: FONT_CODE
42
42
  }
43
43
  };
44
44
  // Annotate the CommonJS export names for ESM import in node:
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/ui",
3
- "version": "1.7.2",
3
+ "version": "1.7.3",
4
4
  "description": "Lobe UI is an open-source UI component library for building chatbot web apps",
5
5
  "keywords": [
6
6
  "lobehub",
@@ -78,16 +78,17 @@
78
78
  "dayjs": "^1",
79
79
  "fast-deep-equal": "^3",
80
80
  "immer": "^10",
81
- "leva": "^0.9.34",
81
+ "leva": "^0.9",
82
82
  "lodash": "^4",
83
83
  "lucide-react": "latest",
84
+ "pangu": "^4",
84
85
  "polished": "^4",
85
86
  "prism-react-renderer": "^2",
86
87
  "re-resizable": "^6",
87
88
  "react-layout-kit": "^1",
88
89
  "react-markdown": "^8",
89
90
  "react-rnd": "^10",
90
- "remark-gfm": "^3.0.1",
91
+ "remark-gfm": "^3",
91
92
  "shiki-es": "^0.2",
92
93
  "styled-components": "^6.0.0-rc.1",
93
94
  "ts-md5": "^1",
@@ -101,6 +102,7 @@
101
102
  "@testing-library/react": "^14",
102
103
  "@types/chroma-js": "^2",
103
104
  "@types/lodash": "^4",
105
+ "@types/pangu": "^4",
104
106
  "@types/react": "^18",
105
107
  "@types/react-dom": "^18",
106
108
  "@umijs/lint": "^4",