@lobehub/ui 1.23.0 → 1.23.1
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.
- package/es/Layout/index.d.ts +15 -0
- package/es/Layout/index.js +81 -0
- package/es/Layout/style.d.ts +11 -0
- package/es/Layout/style.js +19 -0
- package/es/Markdown/index.js +3 -2
- package/es/SearchBar/style.js +1 -1
- package/es/Snippet/style.js +1 -1
- package/es/StroyBook/style.js +1 -1
- package/es/ThemeProvider/GlobalStyle.js +1 -7
- package/es/ThemeProvider/index.js +18 -10
- package/es/index.d.ts +1 -0
- package/es/index.js +1 -0
- package/es/styles/algorithms/generateCustomStylish.js +4 -2
- package/es/types/customStylish.d.ts +2 -0
- package/package.json +2 -2
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export interface LayoutProps {
|
|
3
|
+
asideWidth?: number;
|
|
4
|
+
children?: ReactNode;
|
|
5
|
+
content?: ReactNode;
|
|
6
|
+
footer?: ReactNode;
|
|
7
|
+
header?: ReactNode;
|
|
8
|
+
headerHeight?: number;
|
|
9
|
+
helmet?: ReactNode;
|
|
10
|
+
sidebar?: ReactNode;
|
|
11
|
+
toc?: ReactNode;
|
|
12
|
+
tocWidth?: number;
|
|
13
|
+
}
|
|
14
|
+
declare const Layout: import("react").NamedExoticComponent<LayoutProps>;
|
|
15
|
+
export default Layout;
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
import { useResponsive } from 'antd-style';
|
|
3
|
+
import { memo, useEffect, useState } from 'react';
|
|
4
|
+
import { DraggablePanel } from "./..";
|
|
5
|
+
import { useStyles } from "./style";
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
8
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
9
|
+
var Layout = /*#__PURE__*/memo(function (_ref) {
|
|
10
|
+
var helmet = _ref.helmet,
|
|
11
|
+
_ref$headerHeight = _ref.headerHeight,
|
|
12
|
+
headerHeight = _ref$headerHeight === void 0 ? 64 : _ref$headerHeight,
|
|
13
|
+
header = _ref.header,
|
|
14
|
+
footer = _ref.footer,
|
|
15
|
+
sidebar = _ref.sidebar,
|
|
16
|
+
asideWidth = _ref.asideWidth,
|
|
17
|
+
toc = _ref.toc,
|
|
18
|
+
children = _ref.children,
|
|
19
|
+
tocWidth = _ref.tocWidth;
|
|
20
|
+
var _useStyles = useStyles(headerHeight),
|
|
21
|
+
styles = _useStyles.styles;
|
|
22
|
+
var _useResponsive = useResponsive(),
|
|
23
|
+
mobile = _useResponsive.mobile,
|
|
24
|
+
laptop = _useResponsive.laptop;
|
|
25
|
+
var _useState = useState(true),
|
|
26
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
27
|
+
expand = _useState2[0],
|
|
28
|
+
setExpand = _useState2[1];
|
|
29
|
+
useEffect(function () {
|
|
30
|
+
setExpand(Boolean(laptop));
|
|
31
|
+
}, [laptop]);
|
|
32
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
33
|
+
children: [helmet, header && /*#__PURE__*/_jsxs("header", {
|
|
34
|
+
className: styles.header,
|
|
35
|
+
style: {
|
|
36
|
+
height: headerHeight
|
|
37
|
+
},
|
|
38
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
39
|
+
className: styles.glass
|
|
40
|
+
}), header, mobile && toc && /*#__PURE__*/_jsx("nav", {
|
|
41
|
+
className: styles.toc,
|
|
42
|
+
children: toc
|
|
43
|
+
})]
|
|
44
|
+
}), /*#__PURE__*/_jsxs("main", {
|
|
45
|
+
className: styles.main,
|
|
46
|
+
children: [!mobile && !sidebar && /*#__PURE__*/_jsx("nav", {
|
|
47
|
+
style: {
|
|
48
|
+
width: tocWidth
|
|
49
|
+
}
|
|
50
|
+
}), !mobile && sidebar && /*#__PURE__*/_jsx("aside", {
|
|
51
|
+
className: styles.aside,
|
|
52
|
+
style: {
|
|
53
|
+
top: headerHeight
|
|
54
|
+
},
|
|
55
|
+
children: /*#__PURE__*/_jsx(DraggablePanel, {
|
|
56
|
+
expand: expand,
|
|
57
|
+
maxWidth: asideWidth,
|
|
58
|
+
onExpandChange: setExpand,
|
|
59
|
+
placement: "left",
|
|
60
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
61
|
+
className: styles.asideInner,
|
|
62
|
+
children: sidebar
|
|
63
|
+
})
|
|
64
|
+
})
|
|
65
|
+
}), /*#__PURE__*/_jsx("section", {
|
|
66
|
+
className: styles.content,
|
|
67
|
+
children: children
|
|
68
|
+
}), !mobile && toc && /*#__PURE__*/_jsx("nav", {
|
|
69
|
+
className: styles.toc,
|
|
70
|
+
style: {
|
|
71
|
+
width: tocWidth
|
|
72
|
+
},
|
|
73
|
+
children: toc
|
|
74
|
+
})]
|
|
75
|
+
}), footer && /*#__PURE__*/_jsx("footer", {
|
|
76
|
+
className: styles.footer,
|
|
77
|
+
children: footer
|
|
78
|
+
})]
|
|
79
|
+
});
|
|
80
|
+
});
|
|
81
|
+
export default Layout;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare const useStyles: (props?: number | undefined) => import("antd-style").ReturnStyles<{
|
|
2
|
+
app: import("antd-style").SerializedStyles;
|
|
3
|
+
header: import("antd-style").SerializedStyles;
|
|
4
|
+
glass: import("antd-style").SerializedStyles;
|
|
5
|
+
main: import("antd-style").SerializedStyles;
|
|
6
|
+
content: import("antd-style").SerializedStyles;
|
|
7
|
+
footer: import("antd-style").SerializedStyles;
|
|
8
|
+
aside: import("antd-style").SerializedStyles;
|
|
9
|
+
asideInner: import("antd-style").SerializedStyles;
|
|
10
|
+
toc: import("antd-style").SerializedStyles;
|
|
11
|
+
}>;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
3
|
+
import { createStyles } from 'antd-style';
|
|
4
|
+
export var useStyles = createStyles(function (_ref, headerHeight) {
|
|
5
|
+
var css = _ref.css,
|
|
6
|
+
stylish = _ref.stylish;
|
|
7
|
+
var baseGlass = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n pointer-events: none;\n content: '';\n user-select: none;\n\n position: absolute;\n z-index: -1;\n inset: -1px 0 -50%;\n "])));
|
|
8
|
+
return {
|
|
9
|
+
app: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n overflow-x: hidden;\n overflow-y: auto;\n height: 100vh;\n "]))),
|
|
10
|
+
header: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: sticky;\n z-index: 999;\n top: 0;\n max-width: 100%;\n "]))),
|
|
11
|
+
glass: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n z-index: 0;\n\n &::before {\n ", ";\n ", ";\n mask-image: linear-gradient(to bottom, black ", "px, transparent);\n }\n\n &::after {\n ", ";\n }\n "])), stylish.blur, baseGlass, headerHeight, baseGlass),
|
|
12
|
+
main: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n position: relative;\n display: flex;\n align-items: stretch;\n max-width: 100vw;\n "]))),
|
|
13
|
+
content: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n position: relative;\n flex: 1;\n max-width: 100%;\n "]))),
|
|
14
|
+
footer: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n position: relative;\n max-width: 100%;\n "]))),
|
|
15
|
+
aside: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n position: sticky;\n z-index: 2;\n height: 100%;\n "]))),
|
|
16
|
+
asideInner: css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n overflow-x: hidden;\n overflow-y: auto;\n width: 100%;\n height: calc(100vh - 64px);\n "]))),
|
|
17
|
+
toc: css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral([""])))
|
|
18
|
+
};
|
|
19
|
+
});
|
package/es/Markdown/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Divider, Typography } from 'antd';
|
|
1
|
+
import { Collapse, Divider, Typography } from 'antd';
|
|
2
2
|
import pangu from 'pangu';
|
|
3
3
|
import { memo } from 'react';
|
|
4
4
|
import ReactMarkdown from 'react-markdown';
|
|
@@ -17,7 +17,8 @@ var Markdown = /*#__PURE__*/memo(function (_ref) {
|
|
|
17
17
|
pre: CodeBlock,
|
|
18
18
|
code: Code,
|
|
19
19
|
hr: Divider,
|
|
20
|
-
a: Typography.Link
|
|
20
|
+
a: Typography.Link,
|
|
21
|
+
details: Collapse
|
|
21
22
|
};
|
|
22
23
|
return /*#__PURE__*/_jsx(Typography, {
|
|
23
24
|
children: /*#__PURE__*/_jsx(ReactMarkdown, {
|
package/es/SearchBar/style.js
CHANGED
|
@@ -7,7 +7,7 @@ export var useStyles = createStyles(function (_ref) {
|
|
|
7
7
|
return {
|
|
8
8
|
search: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n max-width: 100%;\n "]))),
|
|
9
9
|
input: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: relative;\n padding: 0 8px 0 12px;\n "]))),
|
|
10
|
-
tag: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n pointer-events: none;\n\n position: absolute;\n z-index: 5;\n top: 50%;\n right: 0;\n transform: translateY(-50%);\n "]))),
|
|
10
|
+
tag: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n pointer-events: none;\n\n position: absolute;\n z-index: 5;\n top: 50%;\n right: 0;\n transform: translateY(-50%);\n\n background: ", ";\n "])), token.colorBgContainer),
|
|
11
11
|
icon: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n color: ", ";\n "])), token.colorTextPlaceholder)
|
|
12
12
|
};
|
|
13
13
|
});
|
package/es/Snippet/style.js
CHANGED
|
@@ -6,5 +6,5 @@ export var useStyles = createStyles(function (_ref, type) {
|
|
|
6
6
|
cx = _ref.cx,
|
|
7
7
|
token = _ref.token;
|
|
8
8
|
var typeStylish = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: ", ";\n border: 1px solid ", ";\n "])), type === 'block' ? token.colorFillTertiary : 'transparent', type === 'block' ? 'transparent' : token.colorBorder);
|
|
9
|
-
return cx(typeStylish, css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: relative;\n\n display: flex;\n gap: 8px;\n align-items: center;\n\n max-width: 100%;\n height: 36px;\n padding: 0 8px 0 12px;\n\n border-radius: ", "px;\n\n transition: background-color 100ms ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n .ant-highlighter-shiki {\n overflow: auto;\n flex: 1;\n }\n\n .prism-code {\n background: none !important;\n }\n\n pre {\n margin: 0 !important;\n
|
|
9
|
+
return cx(typeStylish, css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: relative;\n\n display: flex;\n gap: 8px;\n align-items: center;\n\n max-width: 100%;\n height: 36px;\n padding: 0 8px 0 12px;\n\n border-radius: ", "px;\n\n transition: background-color 100ms ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n .ant-highlighter-shiki {\n overflow: auto;\n flex: 1;\n }\n\n .prism-code {\n background: none !important;\n }\n\n pre {\n margin: 0 !important;\n line-height: 1;\n background: none !important;\n }\n\n code[class*='language-'] {\n background: none !important;\n }\n "])), token.borderRadius, token.motionEaseOut, token.colorFillTertiary));
|
|
10
10
|
});
|
package/es/StroyBook/style.js
CHANGED
|
@@ -9,7 +9,7 @@ export var useStyles = createStyles(function (_ref, _ref2) {
|
|
|
9
9
|
return {
|
|
10
10
|
editor: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n align-items: stretch;\n justify-content: stretch;\n\n width: inherit;\n min-height: inherit;\n ", "\n "])), mobile && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n flex-direction: column;\n "])))),
|
|
11
11
|
left: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n overflow: auto;\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n\n ", "\n "])), !noPadding && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n padding: 40px 24px;\n "])))),
|
|
12
|
-
right: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n background: ", ";\n "])), token.colorBgLayout),
|
|
12
|
+
right: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n background: ", ";\n\n .draggable-panel-fixed {\n width: 100% !important;\n }\n "])), token.colorBgLayout),
|
|
13
13
|
leva: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n --leva-sizes-controlWidth: 66%;\n --leva-colors-elevation1: ", ";\n --leva-colors-elevation2: transparent;\n --leva-colors-elevation3: ", ";\n --leva-colors-accent1: ", ";\n --leva-colors-accent2: ", ";\n --leva-colors-accent3: ", ";\n --leva-colors-highlight1: ", ";\n --leva-colors-highlight2: ", ";\n --leva-colors-highlight3: ", ";\n --leva-colors-vivid1: ", ";\n --leva-shadows-level1: unset;\n --leva-shadows-level2: unset;\n --leva-fonts-mono: ", ";\n\n overflow: auto;\n width: 100%;\n height: 100%;\n padding: 6px 0;\n\n > div {\n background: transparent;\n\n > div {\n background: transparent;\n }\n }\n\n input:checked + label > svg {\n stroke: ", ";\n }\n\n button {\n --leva-colors-accent2: ", ";\n }\n "])), token.colorFillSecondary, token.colorFillSecondary, token.colorPrimary, token.colorPrimaryHover, token.colorPrimaryActive, token.colorTextTertiary, token.colorTextSecondary, token.colorText, token.colorWarning, token.fontFamilyCode, token.colorBgLayout, token.colorFillSecondary)
|
|
14
14
|
};
|
|
15
15
|
});
|
|
@@ -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\", \"tnum\", \"kern\";\n --font-variations: \"opsz\" auto, tabular-nums;\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
|
|
4
|
+
var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n html,body {\n --font-settings: \"cv01\", \"tnum\", \"kern\";\n --font-variations: \"opsz\" auto, tabular-nums;\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 body {\n overflow-x: hidden;\n overflow-y: auto;\n height: 100vh;\n }\n\n\n * {\n\t box-sizing: border-box;\n\t vertical-align: baseline;\n }\n\n ::selection {\n color: #000;\n background: ", ";\n }\n\n\n #root {\n\t min-height: 100vh;\n }\n\n p {\n text-align: justify;\n word-wrap: break-word;\n }\n\n code {\n\t font-family: ", " !important;\n\n\t * {\n\t\t font-family: inherit !important;\n\t }\n }\n"])), function (_ref) {
|
|
5
5
|
var theme = _ref.theme;
|
|
6
6
|
return theme.fontFamily;
|
|
7
7
|
}, function (_ref2) {
|
|
@@ -18,12 +18,6 @@ var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _tagge
|
|
|
18
18
|
return theme.yellow9;
|
|
19
19
|
}, function (_ref6) {
|
|
20
20
|
var theme = _ref6.theme;
|
|
21
|
-
return theme.motionEaseOut;
|
|
22
|
-
}, function (_ref7) {
|
|
23
|
-
var theme = _ref7.theme;
|
|
24
21
|
return theme.fontFamilyCode;
|
|
25
|
-
}, function (_ref8) {
|
|
26
|
-
var theme = _ref8.theme;
|
|
27
|
-
return theme.colorFill;
|
|
28
22
|
});
|
|
29
23
|
export default GlobalStyle;
|
|
@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
|
2
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
4
|
import { App } from 'antd';
|
|
5
|
-
import { ThemeProvider as AntdThemeProvider, StyleProvider, setupStyled } from 'antd-style';
|
|
5
|
+
import { ThemeProvider as AntdThemeProvider, StyleProvider, createStyles, setupStyled } from 'antd-style';
|
|
6
6
|
import { memo } from 'react';
|
|
7
7
|
// @ts-ignore
|
|
8
8
|
import ReactFontLoader from 'react-font-loader';
|
|
@@ -11,20 +11,27 @@ import { lobeCustomStylish, lobeCustomToken, lobeTheme } from "../styles";
|
|
|
11
11
|
import GlobalStyle from "./GlobalStyle";
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
13
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
-
var
|
|
15
|
-
var
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
14
|
+
var useStyled = createStyles(function (_ref) {
|
|
15
|
+
var stylish = _ref.stylish,
|
|
16
|
+
responsive = _ref.responsive;
|
|
17
|
+
return responsive.mobile ? stylish.noScrollbar : "";
|
|
18
|
+
});
|
|
19
|
+
var ThemeProvider = /*#__PURE__*/memo(function (_ref2) {
|
|
20
|
+
var children = _ref2.children,
|
|
21
|
+
themeMode = _ref2.themeMode,
|
|
22
|
+
_ref2$customStylish = _ref2.customStylish,
|
|
23
|
+
_customStylish = _ref2$customStylish === void 0 ? function () {
|
|
19
24
|
return {};
|
|
20
|
-
} :
|
|
21
|
-
|
|
22
|
-
_customToken =
|
|
25
|
+
} : _ref2$customStylish,
|
|
26
|
+
_ref2$customToken = _ref2.customToken,
|
|
27
|
+
_customToken = _ref2$customToken === void 0 ? function () {
|
|
23
28
|
return {};
|
|
24
|
-
} :
|
|
29
|
+
} : _ref2$customToken;
|
|
25
30
|
setupStyled({
|
|
26
31
|
ThemeContext: ThemeContext
|
|
27
32
|
});
|
|
33
|
+
var _useStyled = useStyled(),
|
|
34
|
+
styles = _useStyled.styles;
|
|
28
35
|
return /*#__PURE__*/_jsx(StyleProvider, {
|
|
29
36
|
speedy: process.env.NODE_ENV === 'production',
|
|
30
37
|
children: /*#__PURE__*/_jsxs(AntdThemeProvider, {
|
|
@@ -41,6 +48,7 @@ var ThemeProvider = /*#__PURE__*/memo(function (_ref) {
|
|
|
41
48
|
}), /*#__PURE__*/_jsx(ReactFontLoader, {
|
|
42
49
|
url: "https://raw.githubusercontent.com/IKKI2000/harmonyos-fonts/main/css/harmonyos_sans_sc.css"
|
|
43
50
|
}), /*#__PURE__*/_jsx(GlobalStyle, {}), /*#__PURE__*/_jsx(App, {
|
|
51
|
+
className: styles,
|
|
44
52
|
style: {
|
|
45
53
|
minHeight: 'inherit',
|
|
46
54
|
width: 'inherit'
|
package/es/index.d.ts
CHANGED
|
@@ -15,6 +15,7 @@ export { default as EditableText, type EditableTextProps } from './EditableText'
|
|
|
15
15
|
export { default as Highlighter, type HighlighterProps, SyntaxHighlighter, type SyntaxHighlighterProps, } from './Highlighter';
|
|
16
16
|
export { default as Icon, type IconProps, type IconSize } from './Icon';
|
|
17
17
|
export { Input, type InputProps, TextArea, type TextAreaProps } from './Input';
|
|
18
|
+
export { default as Layout, type LayoutProps } from './Layout';
|
|
18
19
|
export { default as List } from './List';
|
|
19
20
|
export { default as Logo, type LogoProps } from './Logo';
|
|
20
21
|
export { default as Markdown, type MarkdownProps } from './Markdown';
|
package/es/index.js
CHANGED
|
@@ -14,6 +14,7 @@ export { default as EditableText } from "./EditableText";
|
|
|
14
14
|
export { default as Highlighter, SyntaxHighlighter } from "./Highlighter";
|
|
15
15
|
export { default as Icon } from "./Icon";
|
|
16
16
|
export { Input, TextArea } from "./Input";
|
|
17
|
+
export { default as Layout } from "./Layout";
|
|
17
18
|
export { default as List } from "./List";
|
|
18
19
|
export { default as Logo } from "./Logo";
|
|
19
20
|
export { default as Markdown } from "./Markdown";
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
-
var _templateObject, _templateObject2;
|
|
2
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
3
3
|
export var generateCustomStylish = function generateCustomStylish(_ref) {
|
|
4
4
|
var css = _ref.css,
|
|
5
5
|
token = _ref.token,
|
|
6
6
|
isDarkMode = _ref.isDarkMode;
|
|
7
7
|
return {
|
|
8
8
|
blur: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n backdrop-filter: saturate(180%) blur(10px);\n "]))),
|
|
9
|
-
|
|
9
|
+
noScrollbar: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ::-webkit-scrollbar {\n display: none;\n width: 0;\n height: 0;\n background-color: transparent;\n }\n "]))),
|
|
10
|
+
bottomScrollbar: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n ::-webkit-scrollbar {\n width: 0;\n height: 4px;\n background-color: transparent;\n\n &-thumb {\n background-color: ", ";\n border-radius: 4px;\n transition: background-color 500ms ", ";\n }\n\n &-corner {\n display: none;\n width: 0;\n height: 0;\n }\n }\n "])), token.colorFill, token.motionEaseOut),
|
|
11
|
+
markdown: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n color: ", ";\n\n h1,\n h2,\n h3,\n h4,\n h5 {\n font-weight: 600;\n }\n\n p {\n margin-block-start: 0;\n margin-block-end: 0;\n\n font-size: 14px;\n line-height: 1.8;\n color: ", ";\n text-align: justify;\n word-wrap: break-word;\n\n + * {\n margin-block-end: 0.5em;\n }\n }\n\n blockquote {\n margin: 16px 0;\n padding: 0 12px;\n\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 pre {\n border: none;\n border-radius: ", "px;\n }\n\n > :not([data-code-type='highlighter']) code {\n padding: 2px 6px;\n\n font-size: ", "px;\n color: ", ";\n\n background: ", ";\n border: 1px solid ", ";\n border-radius: ", "px;\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: 0;\n margin-inline-end: 0;\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\n &:first-child {\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n }\n\n &:last-child {\n border-top-right-radius: ", "px;\n border-bottom-right-radius: ", "px;\n }\n }\n }\n }\n\n li {\n line-height: 1.8;\n\n &::marker {\n color: ", ";\n }\n }\n\n details {\n margin-bottom: 1em;\n padding: 12px 16px;\n\n background: ", ";\n border: 1px solid ", ";\n border-radius: ", "px;\n\n transition: all 400ms ", ";\n }\n\n details[open] {\n summary {\n padding-bottom: 12px;\n border-bottom: 1px solid ", ";\n }\n }\n "])), isDarkMode ? token.colorTextSecondary : token.colorText, token.colorText, token.colorTextDescription, token.colorLink, token.colorLinkHover, token.colorLinkActive, token.borderRadius, token.fontSizeSM, isDarkMode ? token.cyan9A : token.cyan10A, isDarkMode ? token.cyan1A : token.cyan3A, isDarkMode ? token.cyan1A : token.cyan4A, token.borderRadiusSM, token.colorBorderSecondary, token.borderRadius, token.colorFillTertiary, token.borderRadius, token.borderRadius, token.borderRadius, token.borderRadius, isDarkMode ? token.cyan9A : token.cyan10A, token.colorFillTertiary, token.colorBorderSecondary, token.borderRadiusLG, token.motionEaseOut, token.colorBorder)
|
|
10
12
|
};
|
|
11
13
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lobehub/ui",
|
|
3
|
-
"version": "1.23.
|
|
3
|
+
"version": "1.23.1",
|
|
4
4
|
"description": "Lobe UI is an open-source UI component library for building chatbot web apps",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"lobehub",
|
|
@@ -110,7 +110,7 @@
|
|
|
110
110
|
"@types/pangu": "^4",
|
|
111
111
|
"@types/react": "^18",
|
|
112
112
|
"@types/react-dom": "^18",
|
|
113
|
-
"@vitest/coverage-
|
|
113
|
+
"@vitest/coverage-v8": "latest",
|
|
114
114
|
"antd": "^5",
|
|
115
115
|
"antd-style": "^3",
|
|
116
116
|
"commitlint": "^17",
|