@xiping/react-components 1.0.5 → 1.0.7
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/dist/cjs/components/message/Message.d.ts +28 -0
- package/dist/cjs/components/message/Message.js +1 -0
- package/dist/cjs/components/message/index.d.ts +1 -0
- package/dist/cjs/index.d.ts +1 -0
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/react-components.css +1 -1
- package/dist/es/components/message/Message.d.ts +28 -0
- package/dist/es/components/message/Message.js +80 -0
- package/dist/es/components/message/index.d.ts +1 -0
- package/dist/es/index.d.ts +1 -0
- package/dist/es/index.js +8 -6
- package/dist/es/react-components.css +1 -1
- package/package.json +15 -15
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface MessageProps {
|
|
3
|
+
id: string;
|
|
4
|
+
content: string;
|
|
5
|
+
sender: "user" | "assistant";
|
|
6
|
+
timestamp: Date;
|
|
7
|
+
isThinking?: boolean;
|
|
8
|
+
isLoading?: boolean;
|
|
9
|
+
className?: string;
|
|
10
|
+
style?: React.CSSProperties;
|
|
11
|
+
showTimestamp?: boolean;
|
|
12
|
+
avatarUser?: React.ReactNode;
|
|
13
|
+
avatarAssistant?: React.ReactNode;
|
|
14
|
+
thinkingText?: string;
|
|
15
|
+
customThinkingComponent?: React.ReactNode;
|
|
16
|
+
customUserMessageComponent?: React.ReactNode;
|
|
17
|
+
customAssistantMessageComponent?: React.ReactNode;
|
|
18
|
+
parseContent?: boolean;
|
|
19
|
+
parsedContent?: string;
|
|
20
|
+
thinkContent?: string;
|
|
21
|
+
knowledgeSources?: Array<{
|
|
22
|
+
title: string;
|
|
23
|
+
description?: string;
|
|
24
|
+
url?: string;
|
|
25
|
+
}>;
|
|
26
|
+
}
|
|
27
|
+
export declare const Message: React.FC<MessageProps>;
|
|
28
|
+
export default Message;
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { jsxs as a, jsx as e, Fragment as v } from "react/jsx-runtime";
|
|
2
|
+
/* empty css */
|
|
3
|
+
const q = ({
|
|
4
|
+
id: f,
|
|
5
|
+
content: t,
|
|
6
|
+
sender: n,
|
|
7
|
+
timestamp: l,
|
|
8
|
+
isThinking: d = !1,
|
|
9
|
+
isLoading: p = !1,
|
|
10
|
+
className: k = "",
|
|
11
|
+
style: x = {},
|
|
12
|
+
showTimestamp: c = !0,
|
|
13
|
+
avatarUser: w,
|
|
14
|
+
avatarAssistant: j,
|
|
15
|
+
thinkingText: I = "思考中...",
|
|
16
|
+
customThinkingComponent: m,
|
|
17
|
+
customUserMessageComponent: g,
|
|
18
|
+
customAssistantMessageComponent: h,
|
|
19
|
+
parseContent: L = !1,
|
|
20
|
+
parsedContent: $,
|
|
21
|
+
thinkContent: b,
|
|
22
|
+
knowledgeSources: r
|
|
23
|
+
}) => {
|
|
24
|
+
console.log(f, "id");
|
|
25
|
+
const o = (s) => s.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }), u = () => m || /* @__PURE__ */ a("div", { className: "message-thinking", children: [
|
|
26
|
+
/* @__PURE__ */ a("div", { className: "message-thinking-dots", children: [
|
|
27
|
+
/* @__PURE__ */ e("span", {}),
|
|
28
|
+
/* @__PURE__ */ e("span", {}),
|
|
29
|
+
/* @__PURE__ */ e("span", {})
|
|
30
|
+
] }),
|
|
31
|
+
/* @__PURE__ */ e("span", { className: "message-thinking-text", children: I })
|
|
32
|
+
] }), C = () => /* @__PURE__ */ e("div", { className: "message-loading", children: /* @__PURE__ */ e("div", { className: "message-loading-spinner" }) }), N = () => !r || r.length === 0 ? null : /* @__PURE__ */ a("div", { className: "message-knowledge-sources", children: [
|
|
33
|
+
/* @__PURE__ */ e("div", { className: "message-knowledge-sources-header", children: "知识来源:" }),
|
|
34
|
+
/* @__PURE__ */ e("ul", { className: "message-knowledge-sources-list", children: r.map((s, i) => /* @__PURE__ */ a("li", { className: "message-knowledge-source-item", children: [
|
|
35
|
+
s.url ? /* @__PURE__ */ e("a", { href: s.url, target: "_blank", rel: "noopener noreferrer", children: s.title }) : /* @__PURE__ */ e("span", { children: s.title }),
|
|
36
|
+
s.description && /* @__PURE__ */ e("div", { className: "message-knowledge-source-description", children: s.description })
|
|
37
|
+
] }, i)) })
|
|
38
|
+
] }), F = () => {
|
|
39
|
+
if (p)
|
|
40
|
+
return C();
|
|
41
|
+
if (n === "user" && g)
|
|
42
|
+
return g;
|
|
43
|
+
if (n === "assistant" && h)
|
|
44
|
+
return h;
|
|
45
|
+
if (L && n === "assistant") {
|
|
46
|
+
const s = $ || t, i = b;
|
|
47
|
+
return /* @__PURE__ */ a(v, { children: [
|
|
48
|
+
d && u(),
|
|
49
|
+
s && /* @__PURE__ */ e("div", { className: "message-text", children: s }),
|
|
50
|
+
i && /* @__PURE__ */ a("div", { className: "message-think", children: [
|
|
51
|
+
/* @__PURE__ */ e("div", { className: "message-think-header", children: "思考过程:" }),
|
|
52
|
+
/* @__PURE__ */ e("div", { className: "message-think-content", children: i })
|
|
53
|
+
] }),
|
|
54
|
+
N(),
|
|
55
|
+
c && /* @__PURE__ */ e("div", { className: "message-timestamp", children: o(l) })
|
|
56
|
+
] });
|
|
57
|
+
}
|
|
58
|
+
return /* @__PURE__ */ a(v, { children: [
|
|
59
|
+
/* @__PURE__ */ e("div", { className: "message-text", children: t }),
|
|
60
|
+
d && u(),
|
|
61
|
+
N(),
|
|
62
|
+
c && /* @__PURE__ */ e("div", { className: "message-timestamp", children: o(l) })
|
|
63
|
+
] });
|
|
64
|
+
};
|
|
65
|
+
return /* @__PURE__ */ a(
|
|
66
|
+
"div",
|
|
67
|
+
{
|
|
68
|
+
className: `message ${n === "user" ? "user" : "assistant"} ${k}`,
|
|
69
|
+
style: x,
|
|
70
|
+
children: [
|
|
71
|
+
/* @__PURE__ */ e("div", { className: "message-avatar", children: n === "user" ? w : j }),
|
|
72
|
+
/* @__PURE__ */ e("div", { className: "message-content", children: F() })
|
|
73
|
+
]
|
|
74
|
+
}
|
|
75
|
+
);
|
|
76
|
+
};
|
|
77
|
+
export {
|
|
78
|
+
q as Message,
|
|
79
|
+
q as default
|
|
80
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Message.tsx';
|
package/dist/es/index.d.ts
CHANGED
package/dist/es/index.js
CHANGED
|
@@ -1,24 +1,26 @@
|
|
|
1
1
|
/* empty css */
|
|
2
|
-
import { Button as
|
|
2
|
+
import { Button as t } from "./components/button/Button.js";
|
|
3
3
|
import { TxtReader as p } from "./components/txt-reader/TxtReader.js";
|
|
4
4
|
import { HyperText as a } from "./components/hyper-text/index.js";
|
|
5
5
|
import { TypingAnimation as n } from "./components/typing-animation/index.js";
|
|
6
6
|
import { default as d } from "./components/pinch-content/PinchContent.js";
|
|
7
|
-
import { default as
|
|
8
|
-
import { ShimmerButton as
|
|
7
|
+
import { default as c } from "./components/image-viewer/ImageViewer.js";
|
|
8
|
+
import { ShimmerButton as T } from "./components/shimmer-button/ShimmerButton.js";
|
|
9
9
|
import { default as k } from "./components/image-compare/ImageCompare.js";
|
|
10
10
|
import { TextAnimate as I } from "./components/text-animate/TextAnimate.js";
|
|
11
11
|
import { Dock as y, DockIcon as A, dockVariants as B } from "./components/dock/Duck.js";
|
|
12
12
|
import { TxtEditor as D } from "./components/txt-editor/TxtEditor.js";
|
|
13
|
+
import { Message as w } from "./components/message/Message.js";
|
|
13
14
|
export {
|
|
14
|
-
|
|
15
|
+
t as Button,
|
|
15
16
|
y as Dock,
|
|
16
17
|
A as DockIcon,
|
|
17
18
|
a as HyperText,
|
|
18
19
|
k as ImageCompare,
|
|
19
|
-
|
|
20
|
+
c as ImageViewer,
|
|
21
|
+
w as Message,
|
|
20
22
|
d as PinchContent,
|
|
21
|
-
|
|
23
|
+
T as ShimmerButton,
|
|
22
24
|
I as TextAnimate,
|
|
23
25
|
D as TxtEditor,
|
|
24
26
|
p as TxtReader,
|