@haklex/rich-ext-chat 0.4.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.
- package/dist/ChatEditDecorator.d.ts +11 -0
- package/dist/ChatEditDecorator.d.ts.map +1 -0
- package/dist/ChatEditRenderer.d.ts +16 -0
- package/dist/ChatEditRenderer.d.ts.map +1 -0
- package/dist/ChatEditorModal.d.ts +18 -0
- package/dist/ChatEditorModal.d.ts.map +1 -0
- package/dist/ChatNode-D4OK247K.js +341 -0
- package/dist/ChatRenderer.d.ts +4 -0
- package/dist/ChatRenderer.d.ts.map +1 -0
- package/dist/index.d.ts +12 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.mjs +421 -0
- package/dist/nodes/ChatEditNode.d.ts +19 -0
- package/dist/nodes/ChatEditNode.d.ts.map +1 -0
- package/dist/nodes/ChatNode.d.ts +32 -0
- package/dist/nodes/ChatNode.d.ts.map +1 -0
- package/dist/nodes/index.d.ts +7 -0
- package/dist/nodes/index.d.ts.map +1 -0
- package/dist/rich-ext-chat.css +2 -0
- package/dist/static.d.ts +7 -0
- package/dist/static.d.ts.map +1 -0
- package/dist/static.mjs +5 -0
- package/dist/styles.css.d.ts +63 -0
- package/dist/styles.css.d.ts.map +1 -0
- package/dist/types.d.ts +11 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/utils.d.ts +5 -0
- package/dist/utils.d.ts.map +1 -0
- package/dist/variant-reducer.d.ts +3 -0
- package/dist/variant-reducer.d.ts.map +1 -0
- package/package.json +62 -0
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { NodeKey } from 'lexical';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
import { ChatMessage, ChatParticipant, ChatVariant } from './types';
|
|
4
|
+
export interface ChatEditDecoratorProps {
|
|
5
|
+
messages: ChatMessage[];
|
|
6
|
+
nodeKey: NodeKey;
|
|
7
|
+
participants: ChatParticipant[];
|
|
8
|
+
variant: ChatVariant;
|
|
9
|
+
}
|
|
10
|
+
export declare const ChatEditDecorator: FC<ChatEditDecoratorProps>;
|
|
11
|
+
//# sourceMappingURL=ChatEditDecorator.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatEditDecorator.d.ts","sourceRoot":"","sources":["../src/ChatEditDecorator.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAEvC,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAKhC,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEzE,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,eAAe,EAAE,CAAC;IAChC,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAuDxD,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChatMessage, ChatParticipant, ChatVariant } from './types';
|
|
3
|
+
export interface ChatEditRendererProps {
|
|
4
|
+
messages: ChatMessage[];
|
|
5
|
+
onCancel?: () => void;
|
|
6
|
+
onChange?: (next: {
|
|
7
|
+
variant: ChatVariant;
|
|
8
|
+
participants: ChatParticipant[];
|
|
9
|
+
messages: ChatMessage[];
|
|
10
|
+
}) => void;
|
|
11
|
+
participants: ChatParticipant[];
|
|
12
|
+
registerOpenTrigger?: (open: () => void) => void;
|
|
13
|
+
variant: ChatVariant;
|
|
14
|
+
}
|
|
15
|
+
export declare const ChatEditRenderer: FC<ChatEditRendererProps>;
|
|
16
|
+
//# sourceMappingURL=ChatEditRenderer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatEditRenderer.d.ts","sourceRoot":"","sources":["../src/ChatEditRenderer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAYhC,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEzE,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAChB,OAAO,EAAE,WAAW,CAAC;QACrB,YAAY,EAAE,eAAe,EAAE,CAAC;QAChC,QAAQ,EAAE,WAAW,EAAE,CAAC;KACzB,KAAK,IAAI,CAAC;IACX,YAAY,EAAE,eAAe,EAAE,CAAC;IAChC,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IACjD,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAgDtD,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChatMessage, ChatParticipant, ChatVariant } from './types';
|
|
3
|
+
export interface ChatEditorModalProps {
|
|
4
|
+
dismiss: () => void;
|
|
5
|
+
initial: {
|
|
6
|
+
variant: ChatVariant;
|
|
7
|
+
participants: ChatParticipant[];
|
|
8
|
+
messages: ChatMessage[];
|
|
9
|
+
};
|
|
10
|
+
onCancel?: () => void;
|
|
11
|
+
onCommit?: (next: {
|
|
12
|
+
variant: ChatVariant;
|
|
13
|
+
participants: ChatParticipant[];
|
|
14
|
+
messages: ChatMessage[];
|
|
15
|
+
}) => void;
|
|
16
|
+
}
|
|
17
|
+
export declare const ChatEditorModal: FC<ChatEditorModalProps>;
|
|
18
|
+
//# sourceMappingURL=ChatEditorModal.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatEditorModal.d.ts","sourceRoot":"","sources":["../src/ChatEditorModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAe,EAAE,EAAE,MAAM,OAAO,CAAC;AAI7C,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAIzE,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC;QAAC,YAAY,EAAE,eAAe,EAAE,CAAC;QAAC,QAAQ,EAAE,WAAW,EAAE,CAAA;KAAE,CAAC;IAC5F,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAChB,OAAO,EAAE,WAAW,CAAC;QACrB,YAAY,EAAE,eAAe,EAAE,CAAC;QAChC,QAAQ,EAAE,WAAW,EAAE,CAAC;KACzB,KAAK,IAAI,CAAC;CACZ;AAWD,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CA4LpD,CAAC"}
|
|
@@ -0,0 +1,341 @@
|
|
|
1
|
+
import { DecoratorNode } from "lexical";
|
|
2
|
+
import { customAlphabet } from "nanoid";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
import { code } from "@streamdown/code";
|
|
5
|
+
import { Streamdown } from "streamdown";
|
|
6
|
+
import { createRendererDecoration } from "@haklex/rich-editor/renderers";
|
|
7
|
+
//#region src/styles.css.ts
|
|
8
|
+
var container = "_7z1aq60";
|
|
9
|
+
var row = "_7z1aq61";
|
|
10
|
+
var rowRight = "_7z1aq62";
|
|
11
|
+
var avatar = "_7z1aq63";
|
|
12
|
+
var avatarSmall = "_7z1aq64";
|
|
13
|
+
var avatarDark = "_7z1aq65";
|
|
14
|
+
var avatarImg = "_7z1aq66";
|
|
15
|
+
var bubble = "_7z1aq67";
|
|
16
|
+
var bubbleRightTail = "_7z1aq68";
|
|
17
|
+
var bubbleLeftTail = "_7z1aq69";
|
|
18
|
+
var agent = "_7z1aq6a";
|
|
19
|
+
var agentHeader = "_7z1aq6b";
|
|
20
|
+
var agentHeaderName = "_7z1aq6c";
|
|
21
|
+
var article = "_7z1aq6d";
|
|
22
|
+
var authorCluster = "_7z1aq6e";
|
|
23
|
+
var authorClusterRight = "_7z1aq6f";
|
|
24
|
+
var authorLabel = "_7z1aq6g";
|
|
25
|
+
var empty = "_7z1aq6h";
|
|
26
|
+
var editContainer = "_7z1aq6i";
|
|
27
|
+
var editOverlay = "_7z1aq6j";
|
|
28
|
+
var editLabel = "_7z1aq6k";
|
|
29
|
+
var editorDialogPopup = "_7z1aq6l";
|
|
30
|
+
var semanticClassNames = {
|
|
31
|
+
container: "rich-chat-container",
|
|
32
|
+
row: "rich-chat-row",
|
|
33
|
+
bubble: "rich-chat-bubble",
|
|
34
|
+
article: "rich-chat-article",
|
|
35
|
+
avatar: "rich-chat-avatar",
|
|
36
|
+
author: "rich-chat-author",
|
|
37
|
+
empty: "rich-chat-empty",
|
|
38
|
+
editContainer: "rich-chat-edit-container",
|
|
39
|
+
editOverlay: "rich-chat-edit-overlay",
|
|
40
|
+
editLabel: "rich-chat-edit-label"
|
|
41
|
+
};
|
|
42
|
+
var modal = "_7z1aq6m";
|
|
43
|
+
var modalHeader = "_7z1aq6n";
|
|
44
|
+
var modalBody = "_7z1aq6o";
|
|
45
|
+
var rail = "_7z1aq6p";
|
|
46
|
+
var pane = "_7z1aq6q";
|
|
47
|
+
var sectionLabel = "_7z1aq6r";
|
|
48
|
+
var variantStack = "_7z1aq6s";
|
|
49
|
+
var variantPill = "_7z1aq6t";
|
|
50
|
+
var variantPillActive = "_7z1aq6u";
|
|
51
|
+
var variantPillName = "_7z1aq6v";
|
|
52
|
+
var variantPillHint = "_7z1aq6w";
|
|
53
|
+
var participantCard = "_7z1aq6x";
|
|
54
|
+
var participantRow = "_7z1aq6y";
|
|
55
|
+
var participantPill = "_7z1aq6z";
|
|
56
|
+
var participantPillUser = "_7z1aq610";
|
|
57
|
+
var participantLabel = "_7z1aq611";
|
|
58
|
+
var participantInput = "_7z1aq612";
|
|
59
|
+
var messageCard = "_7z1aq613";
|
|
60
|
+
var messageHead = "_7z1aq614";
|
|
61
|
+
var messageSelect = "_7z1aq615";
|
|
62
|
+
var messageActions = "_7z1aq616";
|
|
63
|
+
var messageTextarea = "_7z1aq617";
|
|
64
|
+
var addMessage = "_7z1aq618";
|
|
65
|
+
var addMessageButton = "_7z1aq619";
|
|
66
|
+
var modalFooter = "_7z1aq61a";
|
|
67
|
+
var button = "_7z1aq61b";
|
|
68
|
+
var buttonPrimary = "_7z1aq61c";
|
|
69
|
+
var buttonGhost = "_7z1aq61d";
|
|
70
|
+
//#endregion
|
|
71
|
+
//#region src/utils.ts
|
|
72
|
+
var idAlphabet = "abcdefghijklmnopqrstuvwxyz0123456789";
|
|
73
|
+
var makeParticipantId = customAlphabet(idAlphabet, 6);
|
|
74
|
+
var makeMessageId = customAlphabet(idAlphabet, 8);
|
|
75
|
+
function createParticipantId() {
|
|
76
|
+
return `p_${makeParticipantId()}`;
|
|
77
|
+
}
|
|
78
|
+
function createMessageId() {
|
|
79
|
+
return `m_${makeMessageId()}`;
|
|
80
|
+
}
|
|
81
|
+
function createDefaultParticipants(variant) {
|
|
82
|
+
if (variant === "user-agent") return [{
|
|
83
|
+
id: createParticipantId(),
|
|
84
|
+
kind: "user"
|
|
85
|
+
}, {
|
|
86
|
+
id: createParticipantId(),
|
|
87
|
+
kind: "agent"
|
|
88
|
+
}];
|
|
89
|
+
return [{
|
|
90
|
+
id: createParticipantId(),
|
|
91
|
+
kind: "user"
|
|
92
|
+
}, {
|
|
93
|
+
id: createParticipantId(),
|
|
94
|
+
kind: "user"
|
|
95
|
+
}];
|
|
96
|
+
}
|
|
97
|
+
//#endregion
|
|
98
|
+
//#region src/ChatRenderer.tsx
|
|
99
|
+
var streamdownPlugins = { code };
|
|
100
|
+
var UNKNOWN = {
|
|
101
|
+
id: "__unknown__",
|
|
102
|
+
kind: "user",
|
|
103
|
+
name: "Unknown"
|
|
104
|
+
};
|
|
105
|
+
function defaultName(kind) {
|
|
106
|
+
return kind === "agent" ? "Assistant" : "User";
|
|
107
|
+
}
|
|
108
|
+
function resolveParticipant(participants, participantId) {
|
|
109
|
+
return participants.find((p) => p.id === participantId) ?? UNKNOWN;
|
|
110
|
+
}
|
|
111
|
+
var Avatar = ({ participant, dark, small }) => {
|
|
112
|
+
const className = [
|
|
113
|
+
avatar,
|
|
114
|
+
small ? avatarSmall : "",
|
|
115
|
+
dark ? avatarDark : "",
|
|
116
|
+
semanticClassNames.avatar
|
|
117
|
+
].filter(Boolean).join(" ");
|
|
118
|
+
if (participant.avatar) return /* @__PURE__ */ jsx("span", {
|
|
119
|
+
className,
|
|
120
|
+
children: /* @__PURE__ */ jsx("img", {
|
|
121
|
+
alt: "",
|
|
122
|
+
className: avatarImg,
|
|
123
|
+
src: participant.avatar
|
|
124
|
+
})
|
|
125
|
+
});
|
|
126
|
+
return /* @__PURE__ */ jsx("span", {
|
|
127
|
+
className,
|
|
128
|
+
children: (participant.name ?? defaultName(participant.kind)).trim().charAt(0).toUpperCase() || "?"
|
|
129
|
+
});
|
|
130
|
+
};
|
|
131
|
+
var Markdown = ({ content }) => /* @__PURE__ */ jsx(Streamdown, {
|
|
132
|
+
plugins: streamdownPlugins,
|
|
133
|
+
children: content
|
|
134
|
+
});
|
|
135
|
+
var UserAgentRow = ({ message, participants }) => {
|
|
136
|
+
const participant = resolveParticipant(participants, message.participantId);
|
|
137
|
+
const isUser = participant.kind !== "agent";
|
|
138
|
+
const displayName = participant.name ?? defaultName(participant.kind);
|
|
139
|
+
if (isUser) return /* @__PURE__ */ jsxs("div", {
|
|
140
|
+
className: `${row} ${rowRight} ${semanticClassNames.row}`,
|
|
141
|
+
children: [/* @__PURE__ */ jsx("div", {
|
|
142
|
+
className: `${bubble} ${bubbleRightTail} ${semanticClassNames.bubble}`,
|
|
143
|
+
children: /* @__PURE__ */ jsx(Markdown, { content: message.content })
|
|
144
|
+
}), /* @__PURE__ */ jsx(Avatar, { participant })]
|
|
145
|
+
});
|
|
146
|
+
return /* @__PURE__ */ jsx("div", {
|
|
147
|
+
className: `${row} ${semanticClassNames.row}`,
|
|
148
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
149
|
+
className: agent,
|
|
150
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
151
|
+
className: agentHeader,
|
|
152
|
+
children: [/* @__PURE__ */ jsx(Avatar, {
|
|
153
|
+
dark: true,
|
|
154
|
+
small: true,
|
|
155
|
+
participant
|
|
156
|
+
}), /* @__PURE__ */ jsx("span", {
|
|
157
|
+
className: agentHeaderName,
|
|
158
|
+
children: displayName
|
|
159
|
+
})]
|
|
160
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
161
|
+
className: `${article} ${semanticClassNames.article}`,
|
|
162
|
+
children: /* @__PURE__ */ jsx(Markdown, { content: message.content })
|
|
163
|
+
})]
|
|
164
|
+
})
|
|
165
|
+
});
|
|
166
|
+
};
|
|
167
|
+
var UserUserRow = ({ message, participants, isRight }) => {
|
|
168
|
+
const participant = resolveParticipant(participants, message.participantId);
|
|
169
|
+
const displayName = participant.name ?? defaultName(participant.kind);
|
|
170
|
+
const tailClass = isRight ? bubbleRightTail : bubbleLeftTail;
|
|
171
|
+
const cluster = /* @__PURE__ */ jsxs("div", {
|
|
172
|
+
className: `${authorCluster}${isRight ? ` ${authorClusterRight}` : ""}`,
|
|
173
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
174
|
+
className: `${authorLabel} ${semanticClassNames.author}`,
|
|
175
|
+
children: displayName
|
|
176
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
177
|
+
className: `${bubble} ${tailClass} ${semanticClassNames.bubble}`,
|
|
178
|
+
children: /* @__PURE__ */ jsx(Markdown, { content: message.content })
|
|
179
|
+
})]
|
|
180
|
+
});
|
|
181
|
+
if (isRight) return /* @__PURE__ */ jsxs("div", {
|
|
182
|
+
className: `${row} ${rowRight} ${semanticClassNames.row}`,
|
|
183
|
+
children: [cluster, /* @__PURE__ */ jsx(Avatar, { participant })]
|
|
184
|
+
});
|
|
185
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
186
|
+
className: `${row} ${semanticClassNames.row}`,
|
|
187
|
+
children: [/* @__PURE__ */ jsx(Avatar, { participant }), cluster]
|
|
188
|
+
});
|
|
189
|
+
};
|
|
190
|
+
function isRightSide(variant, message, participants) {
|
|
191
|
+
if (variant !== "user-user") return false;
|
|
192
|
+
return participants.findIndex((p) => p.id === message.participantId) === 1;
|
|
193
|
+
}
|
|
194
|
+
var ChatRenderer = ({ variant, participants, messages }) => {
|
|
195
|
+
if (messages.length === 0) return /* @__PURE__ */ jsx("div", {
|
|
196
|
+
className: `${container} ${semanticClassNames.container}`,
|
|
197
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
198
|
+
className: `${empty} ${semanticClassNames.empty}`,
|
|
199
|
+
children: "Empty chat"
|
|
200
|
+
})
|
|
201
|
+
});
|
|
202
|
+
return /* @__PURE__ */ jsx("div", {
|
|
203
|
+
className: `${container} ${semanticClassNames.container}`,
|
|
204
|
+
children: messages.map((message) => {
|
|
205
|
+
if (variant === "user-agent") return /* @__PURE__ */ jsx(UserAgentRow, {
|
|
206
|
+
message,
|
|
207
|
+
participants
|
|
208
|
+
}, message.id);
|
|
209
|
+
return /* @__PURE__ */ jsx(UserUserRow, {
|
|
210
|
+
isRight: isRightSide(variant, message, participants),
|
|
211
|
+
message,
|
|
212
|
+
participants
|
|
213
|
+
}, message.id);
|
|
214
|
+
})
|
|
215
|
+
});
|
|
216
|
+
};
|
|
217
|
+
//#endregion
|
|
218
|
+
//#region \0@oxc-project+runtime@0.127.0/helpers/typeof.js
|
|
219
|
+
function _typeof(o) {
|
|
220
|
+
"@babel/helpers - typeof";
|
|
221
|
+
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
|
|
222
|
+
return typeof o;
|
|
223
|
+
} : function(o) {
|
|
224
|
+
return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
|
|
225
|
+
}, _typeof(o);
|
|
226
|
+
}
|
|
227
|
+
//#endregion
|
|
228
|
+
//#region \0@oxc-project+runtime@0.127.0/helpers/toPrimitive.js
|
|
229
|
+
function toPrimitive(t, r) {
|
|
230
|
+
if ("object" != _typeof(t) || !t) return t;
|
|
231
|
+
var e = t[Symbol.toPrimitive];
|
|
232
|
+
if (void 0 !== e) {
|
|
233
|
+
var i = e.call(t, r || "default");
|
|
234
|
+
if ("object" != _typeof(i)) return i;
|
|
235
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
236
|
+
}
|
|
237
|
+
return ("string" === r ? String : Number)(t);
|
|
238
|
+
}
|
|
239
|
+
//#endregion
|
|
240
|
+
//#region \0@oxc-project+runtime@0.127.0/helpers/toPropertyKey.js
|
|
241
|
+
function toPropertyKey(t) {
|
|
242
|
+
var i = toPrimitive(t, "string");
|
|
243
|
+
return "symbol" == _typeof(i) ? i : i + "";
|
|
244
|
+
}
|
|
245
|
+
//#endregion
|
|
246
|
+
//#region \0@oxc-project+runtime@0.127.0/helpers/defineProperty.js
|
|
247
|
+
function _defineProperty(e, r, t) {
|
|
248
|
+
return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
249
|
+
value: t,
|
|
250
|
+
enumerable: !0,
|
|
251
|
+
configurable: !0,
|
|
252
|
+
writable: !0
|
|
253
|
+
}) : e[r] = t, e;
|
|
254
|
+
}
|
|
255
|
+
//#endregion
|
|
256
|
+
//#region src/nodes/ChatNode.ts
|
|
257
|
+
var ChatNode = class ChatNode extends DecoratorNode {
|
|
258
|
+
static getType() {
|
|
259
|
+
return "chat";
|
|
260
|
+
}
|
|
261
|
+
static clone(node) {
|
|
262
|
+
return new ChatNode({
|
|
263
|
+
variant: node.__variant,
|
|
264
|
+
participants: node.__participants,
|
|
265
|
+
messages: node.__messages
|
|
266
|
+
}, node.__key);
|
|
267
|
+
}
|
|
268
|
+
constructor(payload, key) {
|
|
269
|
+
super(key);
|
|
270
|
+
_defineProperty(this, "__variant", void 0);
|
|
271
|
+
_defineProperty(this, "__participants", void 0);
|
|
272
|
+
_defineProperty(this, "__messages", void 0);
|
|
273
|
+
this.__variant = payload.variant;
|
|
274
|
+
this.__participants = payload.participants && payload.participants.length > 0 ? payload.participants : createDefaultParticipants(payload.variant);
|
|
275
|
+
this.__messages = payload.messages ?? [];
|
|
276
|
+
}
|
|
277
|
+
createDOM(_config) {
|
|
278
|
+
const div = document.createElement("div");
|
|
279
|
+
div.className = "rich-chat-wrapper";
|
|
280
|
+
return div;
|
|
281
|
+
}
|
|
282
|
+
updateDOM() {
|
|
283
|
+
return false;
|
|
284
|
+
}
|
|
285
|
+
isInline() {
|
|
286
|
+
return false;
|
|
287
|
+
}
|
|
288
|
+
getVariant() {
|
|
289
|
+
return this.getLatest().__variant;
|
|
290
|
+
}
|
|
291
|
+
setVariant(variant) {
|
|
292
|
+
const writable = this.getWritable();
|
|
293
|
+
writable.__variant = variant;
|
|
294
|
+
}
|
|
295
|
+
getParticipants() {
|
|
296
|
+
return this.getLatest().__participants;
|
|
297
|
+
}
|
|
298
|
+
setParticipants(participants) {
|
|
299
|
+
const writable = this.getWritable();
|
|
300
|
+
writable.__participants = participants;
|
|
301
|
+
}
|
|
302
|
+
getMessages() {
|
|
303
|
+
return this.getLatest().__messages;
|
|
304
|
+
}
|
|
305
|
+
setMessages(messages) {
|
|
306
|
+
const writable = this.getWritable();
|
|
307
|
+
writable.__messages = messages;
|
|
308
|
+
}
|
|
309
|
+
static importJSON(serializedNode) {
|
|
310
|
+
return new ChatNode({
|
|
311
|
+
variant: serializedNode.variant,
|
|
312
|
+
participants: serializedNode.participants,
|
|
313
|
+
messages: serializedNode.messages
|
|
314
|
+
});
|
|
315
|
+
}
|
|
316
|
+
exportJSON() {
|
|
317
|
+
return {
|
|
318
|
+
...super.exportJSON(),
|
|
319
|
+
type: "chat",
|
|
320
|
+
variant: this.__variant,
|
|
321
|
+
participants: this.__participants,
|
|
322
|
+
messages: this.__messages,
|
|
323
|
+
version: 1
|
|
324
|
+
};
|
|
325
|
+
}
|
|
326
|
+
decorate(_editor, _config) {
|
|
327
|
+
return createRendererDecoration("Chat", ChatRenderer, {
|
|
328
|
+
variant: this.__variant,
|
|
329
|
+
participants: this.__participants,
|
|
330
|
+
messages: this.__messages
|
|
331
|
+
});
|
|
332
|
+
}
|
|
333
|
+
};
|
|
334
|
+
function $createChatNode(payload) {
|
|
335
|
+
return new ChatNode(payload);
|
|
336
|
+
}
|
|
337
|
+
function $isChatNode(node) {
|
|
338
|
+
return node instanceof ChatNode;
|
|
339
|
+
}
|
|
340
|
+
//#endregion
|
|
341
|
+
export { participantPillUser as A, modalFooter as C, participantInput as D, participantCard as E, variantPill as F, variantPillActive as I, variantPillHint as L, rail as M, sectionLabel as N, participantLabel as O, semanticClassNames as P, variantPillName as R, modalBody as S, pane as T, messageCard as _, ChatRenderer as a, messageTextarea as b, addMessageButton as c, buttonPrimary as d, editContainer as f, messageActions as g, editorDialogPopup as h, _defineProperty as i, participantRow as j, participantPill as k, button as l, editOverlay as m, $isChatNode as n, createMessageId as o, editLabel as p, ChatNode as r, addMessage as s, $createChatNode as t, buttonGhost as u, messageHead as v, modalHeader as w, modal as x, messageSelect as y, variantStack as z };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatRenderer.d.ts","sourceRoot":"","sources":["../src/ChatRenderer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAgB,MAAM,OAAO,CAAC;AAI9C,OAAO,KAAK,EAIV,iBAAiB,EAElB,MAAM,SAAS,CAAC;AAqIjB,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CA8B9C,CAAC"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export type { ChatEditDecoratorProps } from './ChatEditDecorator';
|
|
2
|
+
export { ChatEditDecorator } from './ChatEditDecorator';
|
|
3
|
+
export type { ChatEditorModalProps } from './ChatEditorModal';
|
|
4
|
+
export { ChatEditorModal } from './ChatEditorModal';
|
|
5
|
+
export type { ChatEditRendererProps } from './ChatEditRenderer';
|
|
6
|
+
export { ChatEditRenderer } from './ChatEditRenderer';
|
|
7
|
+
export { ChatRenderer } from './ChatRenderer';
|
|
8
|
+
export { chatEditNodes, chatNodes } from './nodes';
|
|
9
|
+
export { $createChatEditNode, $isChatEditNode, ChatEditNode } from './nodes/ChatEditNode';
|
|
10
|
+
export { $createChatNode, $isChatNode, ChatNode } from './nodes/ChatNode';
|
|
11
|
+
export type { ChatMessage, ChatParticipant, ChatParticipantKind, ChatRendererProps, ChatVariant, SerializedChatNode, } from './types';
|
|
12
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AAEtB,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACnD,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC1F,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC1E,YAAY,EACV,WAAW,EACX,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,WAAW,EACX,kBAAkB,GACnB,MAAM,SAAS,CAAC"}
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,421 @@
|
|
|
1
|
+
import { A as participantPillUser, C as modalFooter, D as participantInput, E as participantCard, F as variantPill, I as variantPillActive, L as variantPillHint, M as rail, N as sectionLabel, O as participantLabel, P as semanticClassNames, R as variantPillName, S as modalBody, T as pane, _ as messageCard, a as ChatRenderer, b as messageTextarea, c as addMessageButton, d as buttonPrimary, f as editContainer, g as messageActions, h as editorDialogPopup, i as _defineProperty, j as participantRow, k as participantPill, l as button, m as editOverlay, n as $isChatNode, o as createMessageId, p as editLabel, r as ChatNode, s as addMessage, t as $createChatNode, u as buttonGhost, v as messageHead, w as modalHeader, x as modal, y as messageSelect, z as variantStack } from "./ChatNode-D4OK247K.js";
|
|
2
|
+
import { createContext, createElement, useCallback, useContext, useEffect, useRef, useState } from "react";
|
|
3
|
+
import { $getNodeByKey, $insertNodes } from "lexical";
|
|
4
|
+
import { useColorScheme } from "@haklex/rich-editor";
|
|
5
|
+
import { presentDialog } from "@haklex/rich-editor-ui";
|
|
6
|
+
import { usePortalTheme } from "@haklex/rich-style-token";
|
|
7
|
+
import { ArrowDown, ArrowUp, MessageSquare, Pencil, Trash2 } from "lucide-react";
|
|
8
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
|
+
//#region ../../node_modules/.pnpm/@lexical+react@0.44.0_react-dom@19.2.5_react@19.2.5__react@19.2.5_yjs@13.6.29/node_modules/@lexical/react/LexicalComposerContext.prod.mjs
|
|
10
|
+
/**
|
|
11
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
12
|
+
*
|
|
13
|
+
* This source code is licensed under the MIT license found in the
|
|
14
|
+
* LICENSE file in the root directory of this source tree.
|
|
15
|
+
*
|
|
16
|
+
*/
|
|
17
|
+
var r = createContext(null);
|
|
18
|
+
function o() {
|
|
19
|
+
const n = useContext(r);
|
|
20
|
+
return n ?? function(n, ...e) {
|
|
21
|
+
const r = new URL("https://lexical.dev/docs/error"), t = new URLSearchParams();
|
|
22
|
+
t.append("code", n);
|
|
23
|
+
for (const n of e) t.append("v", n);
|
|
24
|
+
throw r.search = t.toString(), Error(`Minified Lexical error #${n}; visit ${r.toString()} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`);
|
|
25
|
+
}(8), n;
|
|
26
|
+
}
|
|
27
|
+
//#endregion
|
|
28
|
+
//#region src/variant-reducer.ts
|
|
29
|
+
function switchVariant(next, participants) {
|
|
30
|
+
return participants.map((p, idx) => {
|
|
31
|
+
if (idx !== 1) return p;
|
|
32
|
+
if (next === "user-user") return {
|
|
33
|
+
...p,
|
|
34
|
+
kind: "user"
|
|
35
|
+
};
|
|
36
|
+
return {
|
|
37
|
+
...p,
|
|
38
|
+
kind: "agent"
|
|
39
|
+
};
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
//#endregion
|
|
43
|
+
//#region src/ChatEditorModal.tsx
|
|
44
|
+
var VARIANT_LABELS = {
|
|
45
|
+
"user-agent": {
|
|
46
|
+
name: "user · agent",
|
|
47
|
+
hint: "Bubble + article"
|
|
48
|
+
},
|
|
49
|
+
"user-user": {
|
|
50
|
+
name: "user · user",
|
|
51
|
+
hint: "Both bubbles"
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
function defaultName(p) {
|
|
55
|
+
return p.name ?? (p.kind === "agent" ? "Assistant" : "User");
|
|
56
|
+
}
|
|
57
|
+
var ChatEditorModal = ({ initial, dismiss, onCommit, onCancel }) => {
|
|
58
|
+
const [variant, setVariant] = useState(initial.variant);
|
|
59
|
+
const [participants, setParticipants] = useState(initial.participants);
|
|
60
|
+
const [messages, setMessages] = useState(initial.messages);
|
|
61
|
+
const handleVariantChange = useCallback((next) => {
|
|
62
|
+
setVariant(next);
|
|
63
|
+
setParticipants((current) => switchVariant(next, current));
|
|
64
|
+
}, []);
|
|
65
|
+
const updateParticipant = useCallback((id, patch) => {
|
|
66
|
+
setParticipants((prev) => prev.map((p) => p.id === id ? {
|
|
67
|
+
...p,
|
|
68
|
+
...patch
|
|
69
|
+
} : p));
|
|
70
|
+
}, []);
|
|
71
|
+
const addMessage$1 = useCallback(() => {
|
|
72
|
+
setMessages((prev) => {
|
|
73
|
+
const recent = prev.at(-1);
|
|
74
|
+
const fallback = participants[0]?.id ?? "";
|
|
75
|
+
const participantId = recent ? recent.participantId : fallback;
|
|
76
|
+
return [...prev, {
|
|
77
|
+
id: createMessageId(),
|
|
78
|
+
participantId,
|
|
79
|
+
content: ""
|
|
80
|
+
}];
|
|
81
|
+
});
|
|
82
|
+
}, [participants]);
|
|
83
|
+
const updateMessage = useCallback((id, patch) => {
|
|
84
|
+
setMessages((prev) => prev.map((m) => m.id === id ? {
|
|
85
|
+
...m,
|
|
86
|
+
...patch
|
|
87
|
+
} : m));
|
|
88
|
+
}, []);
|
|
89
|
+
const moveMessage = useCallback((id, direction) => {
|
|
90
|
+
setMessages((prev) => {
|
|
91
|
+
const idx = prev.findIndex((m) => m.id === id);
|
|
92
|
+
if (idx < 0) return prev;
|
|
93
|
+
const target = idx + direction;
|
|
94
|
+
if (target < 0 || target >= prev.length) return prev;
|
|
95
|
+
const next = [...prev];
|
|
96
|
+
[next[idx], next[target]] = [next[target], next[idx]];
|
|
97
|
+
return next;
|
|
98
|
+
});
|
|
99
|
+
}, []);
|
|
100
|
+
const deleteMessage = useCallback((id) => {
|
|
101
|
+
setMessages((prev) => prev.filter((m) => m.id !== id));
|
|
102
|
+
}, []);
|
|
103
|
+
const handleDone = useCallback(() => {
|
|
104
|
+
onCommit?.({
|
|
105
|
+
variant,
|
|
106
|
+
participants,
|
|
107
|
+
messages
|
|
108
|
+
});
|
|
109
|
+
dismiss();
|
|
110
|
+
}, [
|
|
111
|
+
onCommit,
|
|
112
|
+
variant,
|
|
113
|
+
participants,
|
|
114
|
+
messages,
|
|
115
|
+
dismiss
|
|
116
|
+
]);
|
|
117
|
+
const handleCancel = useCallback(() => {
|
|
118
|
+
onCancel?.();
|
|
119
|
+
dismiss();
|
|
120
|
+
}, [onCancel, dismiss]);
|
|
121
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
122
|
+
className: modal,
|
|
123
|
+
children: [
|
|
124
|
+
/* @__PURE__ */ jsx("div", {
|
|
125
|
+
className: modalHeader,
|
|
126
|
+
children: "Edit chat"
|
|
127
|
+
}),
|
|
128
|
+
/* @__PURE__ */ jsxs("div", {
|
|
129
|
+
className: modalBody,
|
|
130
|
+
children: [/* @__PURE__ */ jsxs("aside", {
|
|
131
|
+
className: rail,
|
|
132
|
+
children: [
|
|
133
|
+
/* @__PURE__ */ jsx("div", {
|
|
134
|
+
className: sectionLabel,
|
|
135
|
+
children: "Variant"
|
|
136
|
+
}),
|
|
137
|
+
/* @__PURE__ */ jsx("div", {
|
|
138
|
+
className: variantStack,
|
|
139
|
+
children: Object.keys(VARIANT_LABELS).map((key) => /* @__PURE__ */ jsxs("button", {
|
|
140
|
+
className: `${variantPill} ${variant === key ? variantPillActive : ""}`,
|
|
141
|
+
type: "button",
|
|
142
|
+
onClick: () => handleVariantChange(key),
|
|
143
|
+
children: [/* @__PURE__ */ jsx("div", {
|
|
144
|
+
className: variantPillName,
|
|
145
|
+
children: VARIANT_LABELS[key].name
|
|
146
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
147
|
+
className: variantPillHint,
|
|
148
|
+
children: VARIANT_LABELS[key].hint
|
|
149
|
+
})]
|
|
150
|
+
}, key))
|
|
151
|
+
}),
|
|
152
|
+
/* @__PURE__ */ jsx("div", {
|
|
153
|
+
className: sectionLabel,
|
|
154
|
+
children: "Participants"
|
|
155
|
+
}),
|
|
156
|
+
participants.map((p) => /* @__PURE__ */ jsxs("div", {
|
|
157
|
+
className: participantCard,
|
|
158
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
159
|
+
className: participantRow,
|
|
160
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
161
|
+
className: `${participantPill} ${p.kind === "user" ? participantPillUser : ""}`,
|
|
162
|
+
children: p.kind
|
|
163
|
+
}), /* @__PURE__ */ jsx("input", {
|
|
164
|
+
className: participantInput,
|
|
165
|
+
placeholder: "Display name",
|
|
166
|
+
type: "text",
|
|
167
|
+
value: p.name ?? "",
|
|
168
|
+
onChange: (e) => updateParticipant(p.id, { name: e.target.value || void 0 })
|
|
169
|
+
})]
|
|
170
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
171
|
+
className: participantRow,
|
|
172
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
173
|
+
className: participantLabel,
|
|
174
|
+
children: "Avatar"
|
|
175
|
+
}), /* @__PURE__ */ jsx("input", {
|
|
176
|
+
className: participantInput,
|
|
177
|
+
placeholder: "URL (optional)",
|
|
178
|
+
type: "text",
|
|
179
|
+
value: p.avatar ?? "",
|
|
180
|
+
onChange: (e) => updateParticipant(p.id, { avatar: e.target.value || void 0 })
|
|
181
|
+
})]
|
|
182
|
+
})]
|
|
183
|
+
}, p.id))
|
|
184
|
+
]
|
|
185
|
+
}), /* @__PURE__ */ jsxs("main", {
|
|
186
|
+
className: pane,
|
|
187
|
+
children: [
|
|
188
|
+
/* @__PURE__ */ jsxs("div", {
|
|
189
|
+
className: sectionLabel,
|
|
190
|
+
children: ["Messages — ", messages.length]
|
|
191
|
+
}),
|
|
192
|
+
messages.map((m) => /* @__PURE__ */ jsxs("div", {
|
|
193
|
+
className: messageCard,
|
|
194
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
195
|
+
className: messageHead,
|
|
196
|
+
children: [/* @__PURE__ */ jsx("select", {
|
|
197
|
+
className: messageSelect,
|
|
198
|
+
value: m.participantId,
|
|
199
|
+
onChange: (e) => updateMessage(m.id, { participantId: e.target.value }),
|
|
200
|
+
children: participants.map((p) => /* @__PURE__ */ jsxs("option", {
|
|
201
|
+
value: p.id,
|
|
202
|
+
children: [
|
|
203
|
+
defaultName(p),
|
|
204
|
+
" (",
|
|
205
|
+
p.kind,
|
|
206
|
+
")"
|
|
207
|
+
]
|
|
208
|
+
}, p.id))
|
|
209
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
210
|
+
className: messageActions,
|
|
211
|
+
children: [
|
|
212
|
+
/* @__PURE__ */ jsx("button", {
|
|
213
|
+
"aria-label": "Move up",
|
|
214
|
+
className: `${button} ${buttonGhost}`,
|
|
215
|
+
type: "button",
|
|
216
|
+
onClick: () => moveMessage(m.id, -1),
|
|
217
|
+
children: /* @__PURE__ */ jsx(ArrowUp, { size: 12 })
|
|
218
|
+
}),
|
|
219
|
+
/* @__PURE__ */ jsx("button", {
|
|
220
|
+
"aria-label": "Move down",
|
|
221
|
+
className: `${button} ${buttonGhost}`,
|
|
222
|
+
type: "button",
|
|
223
|
+
onClick: () => moveMessage(m.id, 1),
|
|
224
|
+
children: /* @__PURE__ */ jsx(ArrowDown, { size: 12 })
|
|
225
|
+
}),
|
|
226
|
+
/* @__PURE__ */ jsx("button", {
|
|
227
|
+
"aria-label": "Delete",
|
|
228
|
+
className: `${button} ${buttonGhost}`,
|
|
229
|
+
type: "button",
|
|
230
|
+
onClick: () => deleteMessage(m.id),
|
|
231
|
+
children: /* @__PURE__ */ jsx(Trash2, { size: 12 })
|
|
232
|
+
})
|
|
233
|
+
]
|
|
234
|
+
})]
|
|
235
|
+
}), /* @__PURE__ */ jsx("textarea", {
|
|
236
|
+
className: messageTextarea,
|
|
237
|
+
value: m.content,
|
|
238
|
+
onChange: (e) => updateMessage(m.id, { content: e.target.value })
|
|
239
|
+
})]
|
|
240
|
+
}, m.id)),
|
|
241
|
+
/* @__PURE__ */ jsx("div", {
|
|
242
|
+
className: addMessage,
|
|
243
|
+
children: /* @__PURE__ */ jsx("button", {
|
|
244
|
+
className: addMessageButton,
|
|
245
|
+
type: "button",
|
|
246
|
+
onClick: addMessage$1,
|
|
247
|
+
children: "+ Add message"
|
|
248
|
+
})
|
|
249
|
+
})
|
|
250
|
+
]
|
|
251
|
+
})]
|
|
252
|
+
}),
|
|
253
|
+
/* @__PURE__ */ jsxs("div", {
|
|
254
|
+
className: modalFooter,
|
|
255
|
+
children: [/* @__PURE__ */ jsx("button", {
|
|
256
|
+
className: button,
|
|
257
|
+
type: "button",
|
|
258
|
+
onClick: handleCancel,
|
|
259
|
+
children: "Cancel"
|
|
260
|
+
}), /* @__PURE__ */ jsx("button", {
|
|
261
|
+
className: `${button} ${buttonPrimary}`,
|
|
262
|
+
type: "button",
|
|
263
|
+
onClick: handleDone,
|
|
264
|
+
children: "Done"
|
|
265
|
+
})]
|
|
266
|
+
})
|
|
267
|
+
]
|
|
268
|
+
});
|
|
269
|
+
};
|
|
270
|
+
//#endregion
|
|
271
|
+
//#region src/ChatEditRenderer.tsx
|
|
272
|
+
var ChatEditRenderer = ({ variant, participants, messages, onChange, onCancel, registerOpenTrigger }) => {
|
|
273
|
+
const { className: portalClassName } = usePortalTheme();
|
|
274
|
+
const colorScheme = useColorScheme();
|
|
275
|
+
const openEditor = useCallback(() => {
|
|
276
|
+
presentDialog({
|
|
277
|
+
content: ({ dismiss }) => /* @__PURE__ */ jsx(ChatEditorModal, {
|
|
278
|
+
dismiss,
|
|
279
|
+
initial: {
|
|
280
|
+
variant,
|
|
281
|
+
participants,
|
|
282
|
+
messages
|
|
283
|
+
},
|
|
284
|
+
onCancel,
|
|
285
|
+
onCommit: onChange
|
|
286
|
+
}),
|
|
287
|
+
className: editorDialogPopup,
|
|
288
|
+
portalClassName,
|
|
289
|
+
theme: colorScheme,
|
|
290
|
+
showCloseButton: false,
|
|
291
|
+
clickOutsideToDismiss: false
|
|
292
|
+
});
|
|
293
|
+
}, [
|
|
294
|
+
variant,
|
|
295
|
+
participants,
|
|
296
|
+
messages,
|
|
297
|
+
onChange,
|
|
298
|
+
onCancel,
|
|
299
|
+
portalClassName,
|
|
300
|
+
colorScheme
|
|
301
|
+
]);
|
|
302
|
+
useEffect(() => {
|
|
303
|
+
registerOpenTrigger?.(openEditor);
|
|
304
|
+
}, [openEditor, registerOpenTrigger]);
|
|
305
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
306
|
+
className: `${editContainer} ${semanticClassNames.editContainer}`,
|
|
307
|
+
children: [/* @__PURE__ */ jsx(ChatRenderer, {
|
|
308
|
+
messages,
|
|
309
|
+
participants,
|
|
310
|
+
variant
|
|
311
|
+
}), /* @__PURE__ */ jsx("button", {
|
|
312
|
+
"aria-label": "Edit chat",
|
|
313
|
+
className: `${editOverlay} ${semanticClassNames.editOverlay}`,
|
|
314
|
+
type: "button",
|
|
315
|
+
onClick: openEditor,
|
|
316
|
+
children: /* @__PURE__ */ jsxs("span", {
|
|
317
|
+
className: `${editLabel} ${semanticClassNames.editLabel}`,
|
|
318
|
+
children: [/* @__PURE__ */ jsx(Pencil, { size: 14 }), " Edit"]
|
|
319
|
+
})
|
|
320
|
+
})]
|
|
321
|
+
});
|
|
322
|
+
};
|
|
323
|
+
//#endregion
|
|
324
|
+
//#region src/ChatEditDecorator.tsx
|
|
325
|
+
var ChatEditDecorator = ({ nodeKey, variant, participants, messages }) => {
|
|
326
|
+
const [editor] = o();
|
|
327
|
+
const hasOpenedRef = useRef(false);
|
|
328
|
+
const openTriggerRef = useRef(null);
|
|
329
|
+
const messagesLengthRef = useRef(messages.length);
|
|
330
|
+
const onChange = useCallback((next) => {
|
|
331
|
+
editor.update(() => {
|
|
332
|
+
const node = $getNodeByKey(nodeKey);
|
|
333
|
+
if ($isChatNode(node)) {
|
|
334
|
+
node.setVariant(next.variant);
|
|
335
|
+
node.setParticipants(next.participants);
|
|
336
|
+
node.setMessages(next.messages);
|
|
337
|
+
}
|
|
338
|
+
});
|
|
339
|
+
}, [editor, nodeKey]);
|
|
340
|
+
const onCancel = useCallback(() => {
|
|
341
|
+
editor.update(() => {
|
|
342
|
+
const node = $getNodeByKey(nodeKey);
|
|
343
|
+
if ($isChatNode(node) && node.getMessages().length === 0) node.remove();
|
|
344
|
+
});
|
|
345
|
+
}, [editor, nodeKey]);
|
|
346
|
+
useEffect(() => {
|
|
347
|
+
if (hasOpenedRef.current) return;
|
|
348
|
+
if (messagesLengthRef.current > 0) return;
|
|
349
|
+
const trigger = openTriggerRef.current;
|
|
350
|
+
if (!trigger) return;
|
|
351
|
+
hasOpenedRef.current = true;
|
|
352
|
+
trigger();
|
|
353
|
+
}, []);
|
|
354
|
+
return /* @__PURE__ */ jsx(ChatEditRenderer, {
|
|
355
|
+
messages,
|
|
356
|
+
participants,
|
|
357
|
+
variant,
|
|
358
|
+
registerOpenTrigger: (open) => {
|
|
359
|
+
openTriggerRef.current = open;
|
|
360
|
+
},
|
|
361
|
+
onCancel,
|
|
362
|
+
onChange
|
|
363
|
+
});
|
|
364
|
+
};
|
|
365
|
+
//#endregion
|
|
366
|
+
//#region src/nodes/ChatEditNode.ts
|
|
367
|
+
var ChatEditNode = class ChatEditNode extends ChatNode {
|
|
368
|
+
static clone(node) {
|
|
369
|
+
return new ChatEditNode({
|
|
370
|
+
variant: node.__variant,
|
|
371
|
+
participants: node.__participants,
|
|
372
|
+
messages: node.__messages
|
|
373
|
+
}, node.__key);
|
|
374
|
+
}
|
|
375
|
+
static importJSON(serializedNode) {
|
|
376
|
+
return new ChatEditNode({
|
|
377
|
+
variant: serializedNode.variant,
|
|
378
|
+
participants: serializedNode.participants,
|
|
379
|
+
messages: serializedNode.messages
|
|
380
|
+
});
|
|
381
|
+
}
|
|
382
|
+
decorate(_editor, _config) {
|
|
383
|
+
return createElement(ChatEditDecorator, {
|
|
384
|
+
nodeKey: this.__key,
|
|
385
|
+
variant: this.__variant,
|
|
386
|
+
participants: this.__participants,
|
|
387
|
+
messages: this.__messages
|
|
388
|
+
});
|
|
389
|
+
}
|
|
390
|
+
};
|
|
391
|
+
_defineProperty(ChatEditNode, "commandItems", [{
|
|
392
|
+
title: "Chat",
|
|
393
|
+
icon: createElement(MessageSquare, { size: 20 }),
|
|
394
|
+
description: "Embed a conversation snapshot",
|
|
395
|
+
keywords: [
|
|
396
|
+
"chat",
|
|
397
|
+
"conversation",
|
|
398
|
+
"dialog",
|
|
399
|
+
"agent"
|
|
400
|
+
],
|
|
401
|
+
section: "MEDIA",
|
|
402
|
+
placement: ["slash", "toolbar"],
|
|
403
|
+
group: "insert",
|
|
404
|
+
onSelect: (editor) => {
|
|
405
|
+
editor.update(() => {
|
|
406
|
+
$insertNodes([$createChatEditNode({ variant: "user-agent" })]);
|
|
407
|
+
});
|
|
408
|
+
}
|
|
409
|
+
}]);
|
|
410
|
+
function $createChatEditNode(payload) {
|
|
411
|
+
return new ChatEditNode(payload);
|
|
412
|
+
}
|
|
413
|
+
function $isChatEditNode(node) {
|
|
414
|
+
return node instanceof ChatEditNode;
|
|
415
|
+
}
|
|
416
|
+
//#endregion
|
|
417
|
+
//#region src/nodes/index.ts
|
|
418
|
+
var chatNodes = [ChatNode];
|
|
419
|
+
var chatEditNodes = [ChatEditNode];
|
|
420
|
+
//#endregion
|
|
421
|
+
export { $createChatEditNode, $createChatNode, $isChatEditNode, $isChatNode, ChatEditDecorator, ChatEditNode, ChatEditRenderer, ChatEditorModal, ChatNode, ChatRenderer, chatEditNodes, chatNodes };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { CommandItemConfig } from '@haklex/rich-editor/commands';
|
|
2
|
+
import { EditorConfig, LexicalEditor, LexicalNode } from 'lexical';
|
|
3
|
+
import { ReactElement } from 'react';
|
|
4
|
+
import { ChatMessage, ChatParticipant, ChatVariant, SerializedChatNode } from '../types';
|
|
5
|
+
import { ChatNode } from './ChatNode';
|
|
6
|
+
export interface ChatEditNodePayload {
|
|
7
|
+
messages?: ChatMessage[];
|
|
8
|
+
participants?: ChatParticipant[];
|
|
9
|
+
variant: ChatVariant;
|
|
10
|
+
}
|
|
11
|
+
export declare class ChatEditNode extends ChatNode {
|
|
12
|
+
static commandItems: CommandItemConfig[];
|
|
13
|
+
static clone(node: ChatEditNode): ChatEditNode;
|
|
14
|
+
static importJSON(serializedNode: SerializedChatNode): ChatEditNode;
|
|
15
|
+
decorate(_editor: LexicalEditor, _config: EditorConfig): ReactElement;
|
|
16
|
+
}
|
|
17
|
+
export declare function $createChatEditNode(payload: ChatEditNodePayload): ChatEditNode;
|
|
18
|
+
export declare function $isChatEditNode(node: LexicalNode | null | undefined): node is ChatEditNode;
|
|
19
|
+
//# sourceMappingURL=ChatEditNode.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatEditNode.d.ts","sourceRoot":"","sources":["../../src/nodes/ChatEditNode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACtE,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAC9F,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,YAAY,CAAC,EAAE,eAAe,EAAE,CAAC;IACjC,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,qBAAa,YAAa,SAAQ,QAAQ;IACxC,MAAM,CAAC,YAAY,EAAE,iBAAiB,EAAE,CAetC;IAEF,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,YAAY,GAAG,YAAY;IAW9C,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,kBAAkB,GAAG,YAAY;IAQnE,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;CAQtE;AAED,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,mBAAmB,GAAG,YAAY,CAE9E;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,YAAY,CAE1F"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { EditorConfig, LexicalEditor, LexicalNode, NodeKey, DecoratorNode } from 'lexical';
|
|
2
|
+
import { ReactElement } from 'react';
|
|
3
|
+
import { ChatMessage, ChatParticipant, ChatVariant, SerializedChatNode } from '../types';
|
|
4
|
+
export type { SerializedChatNode } from '../types';
|
|
5
|
+
export interface ChatNodePayload {
|
|
6
|
+
messages?: ChatMessage[];
|
|
7
|
+
participants?: ChatParticipant[];
|
|
8
|
+
variant: ChatVariant;
|
|
9
|
+
}
|
|
10
|
+
export declare class ChatNode extends DecoratorNode<ReactElement> {
|
|
11
|
+
__variant: ChatVariant;
|
|
12
|
+
__participants: ChatParticipant[];
|
|
13
|
+
__messages: ChatMessage[];
|
|
14
|
+
static getType(): string;
|
|
15
|
+
static clone(node: ChatNode): ChatNode;
|
|
16
|
+
constructor(payload: ChatNodePayload, key?: NodeKey);
|
|
17
|
+
createDOM(_config: EditorConfig): HTMLElement;
|
|
18
|
+
updateDOM(): boolean;
|
|
19
|
+
isInline(): boolean;
|
|
20
|
+
getVariant(): ChatVariant;
|
|
21
|
+
setVariant(variant: ChatVariant): void;
|
|
22
|
+
getParticipants(): ChatParticipant[];
|
|
23
|
+
setParticipants(participants: ChatParticipant[]): void;
|
|
24
|
+
getMessages(): ChatMessage[];
|
|
25
|
+
setMessages(messages: ChatMessage[]): void;
|
|
26
|
+
static importJSON(serializedNode: SerializedChatNode): ChatNode;
|
|
27
|
+
exportJSON(): SerializedChatNode;
|
|
28
|
+
decorate(_editor: LexicalEditor, _config: EditorConfig): ReactElement;
|
|
29
|
+
}
|
|
30
|
+
export declare function $createChatNode(payload: ChatNodePayload): ChatNode;
|
|
31
|
+
export declare function $isChatNode(node: LexicalNode | null | undefined): node is ChatNode;
|
|
32
|
+
//# sourceMappingURL=ChatNode.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatNode.d.ts","sourceRoot":"","sources":["../../src/nodes/ChatNode.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AACjF,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAG9F,YAAY,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAEnD,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,YAAY,CAAC,EAAE,eAAe,EAAE,CAAC;IACjC,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,qBAAa,QAAS,SAAQ,aAAa,CAAC,YAAY,CAAC;IACvD,SAAS,EAAE,WAAW,CAAC;IACvB,cAAc,EAAE,eAAe,EAAE,CAAC;IAClC,UAAU,EAAE,WAAW,EAAE,CAAC;IAE1B,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,QAAQ,GAAG,QAAQ;gBAW1B,OAAO,EAAE,eAAe,EAAE,GAAG,CAAC,EAAE,OAAO;IAUnD,SAAS,CAAC,OAAO,EAAE,YAAY,GAAG,WAAW;IAM7C,SAAS,IAAI,OAAO;IAIpB,QAAQ,IAAI,OAAO;IAInB,UAAU,IAAI,WAAW;IAIzB,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAKtC,eAAe,IAAI,eAAe,EAAE;IAIpC,eAAe,CAAC,YAAY,EAAE,eAAe,EAAE,GAAG,IAAI;IAKtD,WAAW,IAAI,WAAW,EAAE;IAI5B,WAAW,CAAC,QAAQ,EAAE,WAAW,EAAE,GAAG,IAAI;IAK1C,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,kBAAkB,GAAG,QAAQ;IAQ/D,UAAU,IAAI,kBAAkB;IAWhC,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;CAOtE;AAED,wBAAgB,eAAe,CAAC,OAAO,EAAE,eAAe,GAAG,QAAQ,CAElE;AAED,wBAAgB,WAAW,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,QAAQ,CAElF"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { ChatEditNode } from './ChatEditNode';
|
|
2
|
+
import { ChatNode } from './ChatNode';
|
|
3
|
+
export { ChatEditNode } from './ChatEditNode';
|
|
4
|
+
export { ChatNode } from './ChatNode';
|
|
5
|
+
export declare const chatNodes: (typeof ChatNode)[];
|
|
6
|
+
export declare const chatEditNodes: (typeof ChatEditNode)[];
|
|
7
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/nodes/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,eAAO,MAAM,SAAS,qBAAa,CAAC;AACpC,eAAO,MAAM,aAAa,yBAAiB,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
._7z1aq60{flex-direction:column;gap:20px;padding:12px 0;display:flex}._7z1aq61{align-items:flex-start;gap:10px;display:flex}._7z1aq62{justify-content:flex-end}._7z1aq63{background:var(--rc-bg-tertiary);border:1px solid var(--rc-border);width:28px;height:28px;color:var(--rc-text-tertiary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;font-weight:600;display:flex;overflow:hidden}._7z1aq64{width:24px;height:24px;font-size:11px}._7z1aq65{background:var(--rc-text);color:var(--rc-bg);border-color:var(--rc-text)}._7z1aq66{object-fit:cover;width:100%;height:100%}._7z1aq67{background:var(--rc-bg-tertiary);max-width:70%;color:var(--rc-text);padding:10px 14px;font-size:15px;line-height:1.6}._7z1aq68{border-radius:14px 14px 4px}._7z1aq69{border-radius:14px 14px 14px 4px}._7z1aq6a{flex-direction:column;flex:1;min-width:0;display:flex}._7z1aq6b{align-items:center;gap:8px;margin-bottom:8px;display:flex}._7z1aq6c{color:var(--rc-text);font-size:13px;font-weight:500}._7z1aq6d{color:inherit;font-size:15px;line-height:1.7}._7z1aq6e{flex-direction:column;min-width:0;max-width:70%;display:flex}._7z1aq6f{align-items:flex-end}._7z1aq6g{color:var(--rc-text-tertiary);margin-bottom:4px;padding:0 4px;font-size:12px;font-weight:500}._7z1aq6h{color:var(--rc-text-tertiary);padding:8px 0;font-size:13px;font-style:italic}._7z1aq6i{position:relative}._7z1aq6j{background:var(--rc-bg);border:1px solid var(--rc-border);color:var(--rc-text);opacity:0;cursor:pointer;border-radius:6px;align-items:center;gap:4px;padding:4px 10px;font-size:12px;font-weight:500;transition:opacity .12s;display:inline-flex;position:absolute;top:8px;right:8px}._7z1aq6i:hover ._7z1aq6j{opacity:1}._7z1aq6k{align-items:center;gap:4px;display:inline-flex}._7z1aq6l{width:920px;max-width:95vw}._7z1aq6m{background:var(--rc-bg);color:var(--rc-text);border-radius:14px;flex-direction:column;width:920px;max-width:95vw;display:flex;overflow:hidden}._7z1aq6n{border-bottom:1px solid var(--rc-border);color:var(--rc-text);padding:14px 22px;font-size:14px;font-weight:600}._7z1aq6o{height:540px;display:flex}._7z1aq6p{border-right:1px solid var(--rc-border);background:var(--rc-bg-secondary);flex-shrink:0;width:280px;padding:18px 18px 14px;overflow-y:auto}._7z1aq6q{flex:1;min-width:0;padding:14px 22px 18px;overflow-y:auto}._7z1aq6r{text-transform:uppercase;letter-spacing:.08em;color:var(--rc-text-tertiary);margin-bottom:8px;font-size:11px;font-weight:500}._7z1aq6r:not(:first-child){margin-top:22px}._7z1aq6s{flex-direction:column;gap:6px;display:flex}._7z1aq6t{border:1px solid var(--rc-border);cursor:pointer;background:var(--rc-bg);color:var(--rc-text);text-align:left;border-radius:8px;padding:9px 11px}._7z1aq6u{border-color:var(--rc-text)}._7z1aq6v{font-size:13px;font-weight:600}._7z1aq6w{color:var(--rc-text-tertiary);font-size:11px}._7z1aq6x{border:1px solid var(--rc-border);background:var(--rc-bg);border-radius:8px;margin-bottom:8px;padding:9px 10px}._7z1aq6y{align-items:center;gap:6px;margin-bottom:5px;display:flex}._7z1aq6z{text-transform:uppercase;letter-spacing:.08em;background:var(--rc-text);color:var(--rc-bg);border-radius:4px;padding:2px 6px;font-size:9.5px;font-weight:600}._7z1aq610{background:var(--rc-text-tertiary)}._7z1aq611{color:var(--rc-text-tertiary);width:42px;font-size:10.5px}._7z1aq612{border:1px solid var(--rc-border);background:var(--rc-bg);color:var(--rc-text);border-radius:5px;outline:none;flex:1;width:0;padding:4px 7px;font-size:12.5px}._7z1aq612:focus{border-color:color-mix(in srgb, var(--rc-text) 40%, transparent)}._7z1aq613{border:1px solid var(--rc-border);background:var(--rc-bg);border-radius:10px;margin-bottom:10px;overflow:hidden}._7z1aq614{background:var(--rc-bg-secondary);border-bottom:1px solid var(--rc-border);justify-content:space-between;align-items:center;padding:7px 12px;display:flex}._7z1aq615{background:var(--rc-bg);color:var(--rc-text);border:1px solid var(--rc-border);border-radius:5px;padding:3px 6px;font-size:12px}._7z1aq616{gap:2px;display:flex}._7z1aq617{width:100%;color:var(--rc-text);background:var(--rc-bg);resize:vertical;box-sizing:border-box;border:0;outline:none;min-height:70px;padding:10px 12px;font-family:-apple-system,JetBrains Mono,monospace;font-size:13px;line-height:1.55}._7z1aq618{justify-content:center;margin:10px 0 4px;display:flex}._7z1aq619{border:1px dashed var(--rc-border);color:var(--rc-text-tertiary);cursor:pointer;background:0 0;border-radius:6px;padding:6px 14px;font-size:13px}._7z1aq619:hover{color:var(--rc-text);border-color:color-mix(in srgb, var(--rc-text) 40%, transparent)}._7z1aq61a{border-top:1px solid var(--rc-border);background:var(--rc-bg-secondary);justify-content:flex-end;gap:8px;padding:12px 22px;display:flex}._7z1aq61b{border:1px solid var(--rc-border);background:var(--rc-bg);color:var(--rc-text);cursor:pointer;border-radius:6px;padding:6px 12px;font-size:13px}._7z1aq61c{background:var(--rc-text);color:var(--rc-bg);border-color:var(--rc-text)}._7z1aq61d{color:var(--rc-text-tertiary);background:0 0;border-color:#0000}._7z1aq61d:hover{color:var(--rc-text);background:color-mix(in srgb, var(--rc-text) 8%, transparent)}@media (max-width:600px){._7z1aq67,._7z1aq6e{max-width:85%}}
|
|
2
|
+
/*$vite$:1*/
|
package/dist/static.d.ts
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Klass, LexicalNode } from 'lexical';
|
|
2
|
+
export { ChatRenderer } from './ChatRenderer';
|
|
3
|
+
export type { SerializedChatNode } from './nodes/ChatNode';
|
|
4
|
+
export { $createChatNode, $isChatNode, ChatNode } from './nodes/ChatNode';
|
|
5
|
+
export type { ChatMessage, ChatParticipant, ChatParticipantKind, ChatRendererProps, ChatVariant, } from './types';
|
|
6
|
+
export declare const chatNodes: Array<Klass<LexicalNode>>;
|
|
7
|
+
//# sourceMappingURL=static.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"static.d.ts","sourceRoot":"","sources":["../src/static.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAIlD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC1E,YAAY,EACV,WAAW,EACX,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,WAAW,GACZ,MAAM,SAAS,CAAC;AAEjB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,CAAc,CAAC"}
|
package/dist/static.mjs
ADDED
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
export declare const container: string;
|
|
2
|
+
export declare const row: string;
|
|
3
|
+
export declare const rowRight: string;
|
|
4
|
+
export declare const avatar: string;
|
|
5
|
+
export declare const avatarSmall: string;
|
|
6
|
+
export declare const avatarDark: string;
|
|
7
|
+
export declare const avatarImg: string;
|
|
8
|
+
export declare const bubble: string;
|
|
9
|
+
export declare const bubbleRightTail: string;
|
|
10
|
+
export declare const bubbleLeftTail: string;
|
|
11
|
+
export declare const agent: string;
|
|
12
|
+
export declare const agentHeader: string;
|
|
13
|
+
export declare const agentHeaderName: string;
|
|
14
|
+
export declare const article: string;
|
|
15
|
+
export declare const authorCluster: string;
|
|
16
|
+
export declare const authorClusterRight: string;
|
|
17
|
+
export declare const authorLabel: string;
|
|
18
|
+
export declare const empty: string;
|
|
19
|
+
export declare const editContainer: string;
|
|
20
|
+
export declare const editOverlay: string;
|
|
21
|
+
export declare const editLabel: string;
|
|
22
|
+
export declare const editorDialogPopup: string;
|
|
23
|
+
export declare const semanticClassNames: {
|
|
24
|
+
readonly container: "rich-chat-container";
|
|
25
|
+
readonly row: "rich-chat-row";
|
|
26
|
+
readonly bubble: "rich-chat-bubble";
|
|
27
|
+
readonly article: "rich-chat-article";
|
|
28
|
+
readonly avatar: "rich-chat-avatar";
|
|
29
|
+
readonly author: "rich-chat-author";
|
|
30
|
+
readonly empty: "rich-chat-empty";
|
|
31
|
+
readonly editContainer: "rich-chat-edit-container";
|
|
32
|
+
readonly editOverlay: "rich-chat-edit-overlay";
|
|
33
|
+
readonly editLabel: "rich-chat-edit-label";
|
|
34
|
+
};
|
|
35
|
+
export declare const modal: string;
|
|
36
|
+
export declare const modalHeader: string;
|
|
37
|
+
export declare const modalBody: string;
|
|
38
|
+
export declare const rail: string;
|
|
39
|
+
export declare const pane: string;
|
|
40
|
+
export declare const sectionLabel: string;
|
|
41
|
+
export declare const variantStack: string;
|
|
42
|
+
export declare const variantPill: string;
|
|
43
|
+
export declare const variantPillActive: string;
|
|
44
|
+
export declare const variantPillName: string;
|
|
45
|
+
export declare const variantPillHint: string;
|
|
46
|
+
export declare const participantCard: string;
|
|
47
|
+
export declare const participantRow: string;
|
|
48
|
+
export declare const participantPill: string;
|
|
49
|
+
export declare const participantPillUser: string;
|
|
50
|
+
export declare const participantLabel: string;
|
|
51
|
+
export declare const participantInput: string;
|
|
52
|
+
export declare const messageCard: string;
|
|
53
|
+
export declare const messageHead: string;
|
|
54
|
+
export declare const messageSelect: string;
|
|
55
|
+
export declare const messageActions: string;
|
|
56
|
+
export declare const messageTextarea: string;
|
|
57
|
+
export declare const addMessage: string;
|
|
58
|
+
export declare const addMessageButton: string;
|
|
59
|
+
export declare const modalFooter: string;
|
|
60
|
+
export declare const button: string;
|
|
61
|
+
export declare const buttonPrimary: string;
|
|
62
|
+
export declare const buttonGhost: string;
|
|
63
|
+
//# sourceMappingURL=styles.css.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../src/styles.css.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS,QAKpB,CAAC;AAEH,eAAO,MAAM,GAAG,QAId,CAAC;AAEH,eAAO,MAAM,QAAQ,QAEnB,CAAC;AAEH,eAAO,MAAM,MAAM,QAcjB,CAAC;AAEH,eAAO,MAAM,WAAW,QAItB,CAAC;AAEH,eAAO,MAAM,UAAU,QAIrB,CAAC;AAEH,eAAO,MAAM,SAAS,QAIpB,CAAC;AAEH,eAAO,MAAM,MAAM,QAUjB,CAAC;AAEH,eAAO,MAAM,eAAe,QAE1B,CAAC;AAEH,eAAO,MAAM,cAAc,QAEzB,CAAC;AAEH,eAAO,MAAM,KAAK,QAKhB,CAAC;AAEH,eAAO,MAAM,WAAW,QAKtB,CAAC;AAEH,eAAO,MAAM,eAAe,QAI1B,CAAC;AAEH,eAAO,MAAM,OAAO,QAIlB,CAAC;AAEH,eAAO,MAAM,aAAa,QAQxB,CAAC;AAEH,eAAO,MAAM,kBAAkB,QAE7B,CAAC;AAEH,eAAO,MAAM,WAAW,QAMtB,CAAC;AAEH,eAAO,MAAM,KAAK,QAKhB,CAAC;AAEH,eAAO,MAAM,aAAa,QAExB,CAAC;AAEH,eAAO,MAAM,WAAW,QAoBtB,CAAC;AAEH,eAAO,MAAM,SAAS,QAIpB,CAAC;AAEH,eAAO,MAAM,iBAAiB,QAG5B,CAAC;AAEH,eAAO,MAAM,kBAAkB;;;;;;;;;;;CAWrB,CAAC;AAEX,eAAO,MAAM,KAAK,QAShB,CAAC;AAEH,eAAO,MAAM,WAAW,QAMtB,CAAC;AAEH,eAAO,MAAM,SAAS,QAGpB,CAAC;AAEH,eAAO,MAAM,IAAI,QAOf,CAAC;AAEH,eAAO,MAAM,IAAI,QAKf,CAAC;AAEH,eAAO,MAAM,YAAY,QAQvB,CAAC;AAEH,eAAO,MAAM,YAAY,QAA8D,CAAC;AACxF,eAAO,MAAM,WAAW,QAQtB,CAAC;AACH,eAAO,MAAM,iBAAiB,QAA0C,CAAC;AAEzE,eAAO,MAAM,eAAe,QAG1B,CAAC;AACH,eAAO,MAAM,eAAe,QAG1B,CAAC;AAEH,eAAO,MAAM,eAAe,QAM1B,CAAC;AACH,eAAO,MAAM,cAAc,QAKzB,CAAC;AACH,eAAO,MAAM,eAAe,QAS1B,CAAC;AACH,eAAO,MAAM,mBAAmB,QAE9B,CAAC;AACH,eAAO,MAAM,gBAAgB,QAI3B,CAAC;AACH,eAAO,MAAM,gBAAgB,QAe3B,CAAC;AAEH,eAAO,MAAM,WAAW,QAMtB,CAAC;AACH,eAAO,MAAM,WAAW,QAOtB,CAAC;AACH,eAAO,MAAM,aAAa,QAOxB,CAAC;AACH,eAAO,MAAM,cAAc,QAAqC,CAAC;AACjE,eAAO,MAAM,eAAe,QAa1B,CAAC;AAEH,eAAO,MAAM,UAAU,QAIrB,CAAC;AACH,eAAO,MAAM,gBAAgB,QAc3B,CAAC;AAEH,eAAO,MAAM,WAAW,QAOtB,CAAC;AACH,eAAO,MAAM,MAAM,QAQjB,CAAC;AACH,eAAO,MAAM,aAAa,QAIxB,CAAC;AACH,eAAO,MAAM,WAAW,QAUtB,CAAC"}
|
package/dist/types.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ChatMessage, ChatParticipant, ChatParticipantKind, ChatRendererProps, ChatVariant } from '@haklex/rich-editor/renderers';
|
|
2
|
+
import { SerializedLexicalNode } from 'lexical';
|
|
3
|
+
export type { ChatMessage, ChatParticipant, ChatParticipantKind, ChatRendererProps, ChatVariant };
|
|
4
|
+
export interface SerializedChatNode extends SerializedLexicalNode {
|
|
5
|
+
messages: ChatMessage[];
|
|
6
|
+
participants: ChatParticipant[];
|
|
7
|
+
type: 'chat';
|
|
8
|
+
variant: ChatVariant;
|
|
9
|
+
version: 1;
|
|
10
|
+
}
|
|
11
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EACX,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,WAAW,EACZ,MAAM,+BAA+B,CAAC;AACvC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAErD,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,WAAW,EAAE,CAAC;AAElG,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB;IAC/D,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,YAAY,EAAE,eAAe,EAAE,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,CAAC,CAAC;CACZ"}
|
package/dist/utils.d.ts
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { ChatParticipant, ChatVariant } from './types';
|
|
2
|
+
export declare function createParticipantId(): string;
|
|
3
|
+
export declare function createMessageId(): string;
|
|
4
|
+
export declare function createDefaultParticipants(variant: ChatVariant): ChatParticipant[];
|
|
5
|
+
//# sourceMappingURL=utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAM5D,wBAAgB,mBAAmB,IAAI,MAAM,CAE5C;AAED,wBAAgB,eAAe,IAAI,MAAM,CAExC;AAED,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,WAAW,GAAG,eAAe,EAAE,CAWjF"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"variant-reducer.d.ts","sourceRoot":"","sources":["../src/variant-reducer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE5D,wBAAgB,aAAa,CAC3B,IAAI,EAAE,WAAW,EACjB,YAAY,EAAE,eAAe,EAAE,GAC9B,eAAe,EAAE,CAMnB"}
|
package/package.json
ADDED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@haklex/rich-ext-chat",
|
|
3
|
+
"version": "0.4.0",
|
|
4
|
+
"description": "Static chat-snapshot node for the haklex rich editor",
|
|
5
|
+
"repository": {
|
|
6
|
+
"type": "git",
|
|
7
|
+
"url": "https://github.com/Innei/haklex.git",
|
|
8
|
+
"directory": "packages/rich-ext-chat"
|
|
9
|
+
},
|
|
10
|
+
"license": "MIT",
|
|
11
|
+
"type": "module",
|
|
12
|
+
"exports": {
|
|
13
|
+
".": {
|
|
14
|
+
"import": "./dist/index.mjs",
|
|
15
|
+
"types": "./dist/index.d.ts"
|
|
16
|
+
},
|
|
17
|
+
"./static": {
|
|
18
|
+
"import": "./dist/static.mjs",
|
|
19
|
+
"types": "./dist/static.d.ts"
|
|
20
|
+
},
|
|
21
|
+
"./style.css": "./dist/rich-ext-chat.css"
|
|
22
|
+
},
|
|
23
|
+
"main": "./dist/index.mjs",
|
|
24
|
+
"files": [
|
|
25
|
+
"dist"
|
|
26
|
+
],
|
|
27
|
+
"dependencies": {
|
|
28
|
+
"@streamdown/code": "^1.1.1",
|
|
29
|
+
"nanoid": "^5.1.9",
|
|
30
|
+
"streamdown": "^2.5.0"
|
|
31
|
+
},
|
|
32
|
+
"devDependencies": {
|
|
33
|
+
"@lexical/react": "^0.44.0",
|
|
34
|
+
"@types/react": "^19.2.14",
|
|
35
|
+
"@types/react-dom": "^19.2.3",
|
|
36
|
+
"@vanilla-extract/css": "^1.20.1",
|
|
37
|
+
"@vanilla-extract/vite-plugin": "^5.2.2",
|
|
38
|
+
"lexical": "^0.44.0",
|
|
39
|
+
"react": "19.2.5",
|
|
40
|
+
"react-dom": "19.2.5",
|
|
41
|
+
"typescript": "^5.9.3",
|
|
42
|
+
"vite": "^8.0.10",
|
|
43
|
+
"vite-plugin-dts": "^4.5.4",
|
|
44
|
+
"@haklex/rich-editor": "0.4.0"
|
|
45
|
+
},
|
|
46
|
+
"peerDependencies": {
|
|
47
|
+
"@haklex/rich-editor": ">=0.3.0",
|
|
48
|
+
"@haklex/rich-editor-ui": ">=0.3.0",
|
|
49
|
+
"@haklex/rich-style-token": ">=0.3.0",
|
|
50
|
+
"lexical": "^0.44.0",
|
|
51
|
+
"lucide-react": "^1.0.0",
|
|
52
|
+
"react": ">=19"
|
|
53
|
+
},
|
|
54
|
+
"publishConfig": {
|
|
55
|
+
"access": "public"
|
|
56
|
+
},
|
|
57
|
+
"scripts": {
|
|
58
|
+
"build": "vite build",
|
|
59
|
+
"dev:build": "vite build --watch"
|
|
60
|
+
},
|
|
61
|
+
"types": "./dist/index.d.ts"
|
|
62
|
+
}
|