@ai-group/chat-sdk 0.2.5 → 0.2.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (157) hide show
  1. package/README.md +93 -214
  2. package/dist/cjs/assets/arrow-down.png +0 -0
  3. package/dist/cjs/assets/arrow-up.png +0 -0
  4. package/dist/cjs/assets/chatKnowledge.png +0 -0
  5. package/dist/cjs/assets/completed-black.png +0 -0
  6. package/dist/cjs/assets/completed.png +0 -0
  7. package/dist/cjs/assets/document-black.png +0 -0
  8. package/dist/cjs/assets/document.png +0 -0
  9. package/dist/cjs/assets/document.svg +16 -0
  10. package/dist/cjs/assets/empty.png +0 -0
  11. package/dist/cjs/assets/group.png +0 -0
  12. package/dist/cjs/assets/qa-black.png +0 -0
  13. package/dist/cjs/assets/qa.png +0 -0
  14. package/dist/cjs/assets/skillNo-black.png +0 -0
  15. package/dist/cjs/assets/skillNo.png +0 -0
  16. package/dist/cjs/assets/tools-black.png +0 -0
  17. package/dist/cjs/assets/tools.png +0 -0
  18. package/dist/cjs/assets/user.png +0 -0
  19. package/dist/cjs/client/base.d.ts +9 -0
  20. package/dist/cjs/client/base.js +18 -0
  21. package/dist/cjs/client/base.js.map +7 -0
  22. package/dist/cjs/client/restClient.d.ts +0 -0
  23. package/dist/cjs/client/restClient.js +1 -0
  24. package/dist/cjs/client/restClient.js.map +7 -0
  25. package/dist/cjs/client/wsClient.d.ts +0 -0
  26. package/dist/cjs/client/wsClient.js +1 -0
  27. package/dist/cjs/client/wsClient.js.map +7 -0
  28. package/dist/cjs/components/XAiChatbot/XAiChatbot.stories.d.ts +10 -0
  29. package/dist/cjs/components/XAiChatbot/XAiChatbot.stories.js +484 -0
  30. package/dist/cjs/components/XAiChatbot/XAiChatbot.stories.js.map +7 -0
  31. package/dist/cjs/components/XAiChatbot/index.d.ts +12 -0
  32. package/dist/cjs/components/XAiChatbot/index.js +365 -0
  33. package/dist/cjs/components/XAiChatbot/index.js.map +7 -0
  34. package/dist/cjs/components/XAiChatbot/styles.d.ts +72 -0
  35. package/dist/cjs/components/XAiChatbot/styles.js +426 -0
  36. package/dist/cjs/components/XAiChatbot/styles.js.map +7 -0
  37. package/dist/cjs/components/XAiProvider/XAiProvider.stories.d.ts +7 -0
  38. package/dist/cjs/components/XAiProvider/XAiProvider.stories.js +127 -0
  39. package/dist/cjs/components/XAiProvider/XAiProvider.stories.js.map +7 -0
  40. package/dist/cjs/components/XAiProvider/index.d.ts +4 -0
  41. package/dist/cjs/components/XAiProvider/index.js +115 -0
  42. package/dist/cjs/components/XAiProvider/index.js.map +7 -0
  43. package/dist/cjs/components/XAiSDK.d.ts +10 -0
  44. package/dist/cjs/components/XAiSDK.js +53 -0
  45. package/dist/cjs/components/XAiSDK.js.map +7 -0
  46. package/dist/cjs/components/XAiWebSDKWrapper.d.ts +9 -0
  47. package/dist/cjs/components/XAiWebSDKWrapper.js +70 -0
  48. package/dist/cjs/components/XAiWebSDKWrapper.js.map +7 -0
  49. package/dist/cjs/context/AiProviderContext.d.ts +12 -0
  50. package/dist/cjs/context/AiProviderContext.js +74 -0
  51. package/dist/cjs/context/AiProviderContext.js.map +7 -0
  52. package/dist/cjs/context/ThemeContext.d.ts +20 -0
  53. package/dist/cjs/context/ThemeContext.js +37 -0
  54. package/dist/cjs/context/ThemeContext.js.map +7 -0
  55. package/dist/cjs/hooks/useAgentGenerator.d.ts +72 -0
  56. package/dist/cjs/hooks/useAgentGenerator.js +487 -0
  57. package/dist/cjs/hooks/useAgentGenerator.js.map +7 -0
  58. package/dist/cjs/hooks/useEventStreamRequest.d.ts +30 -0
  59. package/dist/cjs/hooks/useEventStreamRequest.js +188 -0
  60. package/dist/cjs/hooks/useEventStreamRequest.js.map +7 -0
  61. package/dist/cjs/hooks/useProviderContext.d.ts +33 -0
  62. package/dist/cjs/hooks/useProviderContext.js +105 -0
  63. package/dist/cjs/hooks/useProviderContext.js.map +7 -0
  64. package/dist/cjs/hooks/useXAiSDK.d.ts +14 -0
  65. package/dist/cjs/hooks/useXAiSDK.js +75 -0
  66. package/dist/cjs/hooks/useXAiSDK.js.map +7 -0
  67. package/dist/cjs/index.d.ts +9 -0
  68. package/dist/cjs/index.js +61 -0
  69. package/dist/cjs/index.js.map +7 -0
  70. package/dist/cjs/services/api.d.ts +69 -0
  71. package/dist/cjs/services/api.js +49 -0
  72. package/dist/cjs/services/api.js.map +7 -0
  73. package/dist/cjs/styles/common.d.ts +64 -0
  74. package/dist/cjs/styles/common.js +144 -0
  75. package/dist/cjs/styles/common.js.map +7 -0
  76. package/dist/cjs/styles/markdown.d.ts +3 -0
  77. package/dist/cjs/styles/markdown.js +193 -0
  78. package/dist/cjs/styles/markdown.js.map +7 -0
  79. package/dist/cjs/types/XAiChatbot.d.ts +159 -0
  80. package/dist/cjs/types/XAiChatbot.js +18 -0
  81. package/dist/cjs/types/XAiChatbot.js.map +7 -0
  82. package/dist/cjs/types/XAiMessage.d.ts +121 -0
  83. package/dist/cjs/types/XAiMessage.js +55 -0
  84. package/dist/cjs/types/XAiMessage.js.map +7 -0
  85. package/dist/cjs/types/XAiProvider.d.ts +46 -0
  86. package/dist/cjs/types/XAiProvider.js +50 -0
  87. package/dist/cjs/types/XAiProvider.js.map +7 -0
  88. package/dist/cjs/types/index.d.ts +3 -0
  89. package/dist/cjs/types/index.js +28 -0
  90. package/dist/cjs/types/index.js.map +7 -0
  91. package/dist/cjs/types/mdx.d.ts +18 -0
  92. package/dist/cjs/utils/chat.d.ts +34 -0
  93. package/dist/cjs/utils/chat.js +1 -0
  94. package/dist/cjs/utils/chat.js.map +7 -0
  95. package/dist/cjs/utils/index.d.ts +2 -0
  96. package/dist/cjs/utils/index.js +49 -0
  97. package/dist/cjs/utils/index.js.map +7 -0
  98. package/dist/cjs/utils/providerManager.d.ts +22 -0
  99. package/dist/cjs/utils/providerManager.js +73 -0
  100. package/dist/cjs/utils/providerManager.js.map +7 -0
  101. package/dist/cjs/utils/request.d.ts +78 -0
  102. package/dist/cjs/utils/request.example.d.ts +39 -0
  103. package/dist/cjs/utils/request.example.js +211 -0
  104. package/dist/cjs/utils/request.example.js.map +7 -0
  105. package/dist/cjs/utils/request.js +231 -0
  106. package/dist/cjs/utils/request.js.map +7 -0
  107. package/dist/cjs/utils/umdEntry.d.ts +14 -0
  108. package/dist/cjs/utils/umdEntry.js +97 -0
  109. package/dist/cjs/utils/umdEntry.js.map +7 -0
  110. package/dist/esm/assets/user.png +0 -0
  111. package/dist/esm/client/base.d.ts +9 -0
  112. package/dist/esm/client/restClient.d.ts +0 -0
  113. package/dist/esm/client/wsClient.d.ts +0 -0
  114. package/dist/esm/components/XAiChatbot/XAiChatbot.stories.d.ts +10 -0
  115. package/dist/esm/components/XAiChatbot/index.d.ts +12 -0
  116. package/dist/esm/components/XAiChatbot/index.js +17 -11
  117. package/dist/esm/components/XAiChatbot/index.js.map +1 -1
  118. package/dist/esm/components/XAiChatbot/styles.d.ts +72 -0
  119. package/dist/esm/components/XAiChatbot/styles.js +37 -38
  120. package/dist/esm/components/XAiChatbot/styles.js.map +1 -1
  121. package/dist/esm/components/XAiProvider/XAiProvider.stories.d.ts +7 -0
  122. package/dist/esm/components/XAiProvider/index.d.ts +4 -0
  123. package/dist/esm/components/XAiProvider/index.js +8 -1
  124. package/dist/esm/components/XAiProvider/index.js.map +1 -1
  125. package/dist/esm/components/XAiSDK.d.ts +10 -0
  126. package/dist/esm/components/XAiWebSDKWrapper.d.ts +9 -0
  127. package/dist/esm/components/XAiWebSDKWrapper.js +4 -1
  128. package/dist/esm/components/XAiWebSDKWrapper.js.map +1 -1
  129. package/dist/esm/context/AiProviderContext.d.ts +12 -0
  130. package/dist/esm/context/ThemeContext.d.ts +20 -0
  131. package/dist/esm/hooks/useAgentGenerator.d.ts +72 -0
  132. package/dist/esm/hooks/useAgentGenerator.js +113 -39
  133. package/dist/esm/hooks/useAgentGenerator.js.map +1 -1
  134. package/dist/esm/hooks/useEventStreamRequest.d.ts +30 -0
  135. package/dist/esm/hooks/useProviderContext.d.ts +33 -0
  136. package/dist/esm/hooks/useXAiSDK.d.ts +14 -0
  137. package/dist/esm/index.d.ts +9 -0
  138. package/dist/esm/services/api.d.ts +69 -0
  139. package/dist/esm/services/api.js.map +1 -1
  140. package/dist/esm/styles/common.d.ts +64 -0
  141. package/dist/esm/styles/markdown.d.ts +3 -0
  142. package/dist/esm/types/XAiChatbot.d.ts +159 -0
  143. package/dist/esm/types/XAiMessage.d.ts +121 -0
  144. package/dist/esm/types/XAiProvider.d.ts +46 -0
  145. package/dist/esm/types/XAiProvider.js +7 -0
  146. package/dist/esm/types/XAiProvider.js.map +1 -1
  147. package/dist/esm/types/index.d.ts +3 -0
  148. package/dist/esm/utils/chat.d.ts +34 -0
  149. package/dist/esm/utils/index.d.ts +2 -0
  150. package/dist/esm/utils/providerManager.d.ts +22 -0
  151. package/dist/esm/utils/request.d.ts +78 -0
  152. package/dist/esm/utils/request.example.d.ts +39 -0
  153. package/dist/esm/utils/umdEntry.d.ts +14 -0
  154. package/dist/esm/utils/umdEntry.js +22 -18
  155. package/dist/esm/utils/umdEntry.js.map +1 -1
  156. package/dist/umd/chat-sdk.min.js +1 -1
  157. package/package.json +1 -1
@@ -0,0 +1,426 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
20
+ // If the importer is in node compatibility mode or this is not an ESM
21
+ // file that has been converted to a CommonJS file using a Babel-
22
+ // compatible transform (i.e. "__esModule" has not been set), then set
23
+ // "default" to the CommonJS "module.exports" for node compatibility.
24
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
25
+ mod
26
+ ));
27
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
28
+
29
+ // src/components/XAiChatbot/styles.tsx
30
+ var styles_exports = {};
31
+ __export(styles_exports, {
32
+ GlobalStyle: () => GlobalStyle,
33
+ useStyles: () => useStyles
34
+ });
35
+ module.exports = __toCommonJS(styles_exports);
36
+ var import_react = __toESM(require("react"));
37
+ var import_css = require("@emotion/css");
38
+ var import_react2 = require("@emotion/react");
39
+ var import_common = require("../../styles/common");
40
+ var primaryBlue = "#0078FF";
41
+ var lightBlue = "#E6F0FF";
42
+ var darkGray = "#333";
43
+ var lightGray = "#888";
44
+ var borderGray = "#ddd";
45
+ var useStyles = (0, import_common.withBasicStyles)(() => ({
46
+ // 静态样式
47
+ wrapper: import_css.css`
48
+ display: flex;
49
+ flex-direction: column;
50
+ max-height: 812px;
51
+ min-height: 300px;
52
+ width: 100%;
53
+ height: 100%;
54
+ min-width: 375px;
55
+ background-color: #fff;
56
+ // border: 1px solid rgba(80,96,122,.15);
57
+ border-radius: 12px;
58
+ overflow: hidden;
59
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
60
+ Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
61
+ `,
62
+ navbar: import_css.css`
63
+ display: flex;
64
+ align-items: center;
65
+ justify-content: center;
66
+ padding: 12px 16px;
67
+ border-bottom: 1px solid ${borderGray};
68
+ background-color: #fff;
69
+ `,
70
+ userAvatar: import_css.css`
71
+ display: flex;
72
+ align-items: center;
73
+ justify-content: center;
74
+ height: 32px;
75
+ width: 32px;
76
+ border-radius: 50%;
77
+ object-fit: cover;
78
+ margin-right: 12px;
79
+ `,
80
+ avatar: import_css.css`
81
+ width: 40px;
82
+ height: 40px;
83
+ border-radius: 50%;
84
+ object-fit: cover;
85
+ margin-right: 12px;
86
+ border: 1px solid ${borderGray};
87
+ `,
88
+ title: import_css.css`
89
+ font-weight: 600;
90
+ font-size: 16px;
91
+ color: ${darkGray};
92
+ `,
93
+ subtitle: import_css.css`
94
+ font-size: 12px;
95
+ color: ${lightGray};
96
+ margin-top: 2px;
97
+ `,
98
+ messageContainer: import_css.css`
99
+ flex: 1;
100
+ overflow-y: auto;
101
+ padding: 16px;
102
+ background-color: #fff;
103
+ display: flex;
104
+ flex-direction: column;
105
+ gap: 10px;
106
+ min-height: 0;
107
+ position: relative;
108
+ `,
109
+ emptyWrapper: import_css.css`
110
+ height: 100%;
111
+ display: flex;
112
+ flex-direction: column;
113
+ align-items: center;
114
+ justify-content: center;
115
+ color: '#222';
116
+ userSelect: none;
117
+ `,
118
+ emptyImg: import_css.css`
119
+ width: 60px;
120
+ height: 60px;
121
+ margin-bottom: 16px;
122
+ `,
123
+ message: import_css.css`
124
+ max-width: 70%;
125
+ padding: 10px 14px;
126
+ border-radius: 20px;
127
+ background-color: ${lightBlue};
128
+ color: ${darkGray};
129
+ font-size: 14px;
130
+ line-height: 1.4;
131
+ word-break: break-word;
132
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
133
+ `,
134
+ messageRight: import_css.css`
135
+ align-self: flex-end;
136
+ background-color: ${primaryBlue};
137
+ color: white;
138
+ border-bottom-right-radius: 4px;
139
+ border-bottom-left-radius: 20px;
140
+ border-top-left-radius: 20px;
141
+ border-top-right-radius: 20px;
142
+ `,
143
+ quickReplies: import_css.css`
144
+ display: flex;
145
+ gap: 8px;
146
+ padding: 10px 16px;
147
+ border-top: 1px solid ${borderGray};
148
+ background-color: #fff;
149
+ overflow-x: auto;
150
+ `,
151
+ replyItem: import_css.css`
152
+ padding: 6px 12px;
153
+ font-size: 13px;
154
+ border: 1px solid ${primaryBlue};
155
+ border-radius: 20px;
156
+ background-color: #fff;
157
+ color: ${primaryBlue};
158
+ cursor: pointer;
159
+ white-space: nowrap;
160
+ user-select: none;
161
+ transition: all 0.2s ease;
162
+
163
+ &:hover {
164
+ background-color: ${primaryBlue};
165
+ color: #fff;
166
+ }
167
+ `,
168
+ highlight: import_css.css`
169
+ background-color: ${primaryBlue};
170
+ color: white;
171
+ border-color: ${primaryBlue};
172
+ `,
173
+ inputBar: import_css.css`
174
+ display: flex;
175
+ align-items: center;
176
+ padding: 10px 16px;
177
+ border-top: 1px solid ${borderGray};
178
+ background-color: #fff;
179
+ `,
180
+ input: import_css.css`
181
+ flex: 1;
182
+ padding: 8px 12px;
183
+ border: 1px solid ${borderGray};
184
+ border-radius: 20px;
185
+ font-size: 14px;
186
+ outline: none;
187
+
188
+ &:focus {
189
+ border-color: ${primaryBlue};
190
+ box-shadow: 0 0 3px ${primaryBlue};
191
+ }
192
+ `,
193
+ sendWrapper: import_css.css`
194
+ flex: 1;
195
+ border-radius: 26px;
196
+ `,
197
+ stopButton: import_css.css`
198
+ width: 23px !important;
199
+ height: 23px !important;
200
+ padding: 0 !important;
201
+ min-width: 23px !important;
202
+ min-height: 23px !important;
203
+ display: flex;
204
+ align-items: center;
205
+ justify-content: center;
206
+ `,
207
+ sendButton: import_css.css`
208
+ width: 23px !important;
209
+ height: 23px !important;
210
+ padding: 0 !important;
211
+ min-width: 23px !important;
212
+ min-height: 23px !important;
213
+ display: flex;
214
+ align-items: center;
215
+ justify-content: center;
216
+ background-color: ${primaryBlue};
217
+ border: none;
218
+ border-radius: 20px;
219
+ color: white;
220
+ font-weight: 600;
221
+ cursor: pointer;
222
+ transition: background-color 0.2s ease;
223
+ box-sizing: border-box;
224
+ &:hover {
225
+ background-color: #005ecb;
226
+ }
227
+ &:disabled {
228
+ background-color: ${lightBlue};
229
+ cursor: not-allowed;
230
+ }
231
+ `,
232
+ uploadBtn: import_css.css`
233
+ margin-left: 8px;
234
+ width: 32px;
235
+ height: 32px;
236
+ border-radius: 50%;
237
+ background-color: ${primaryBlue};
238
+ color: white;
239
+ font-weight: 700;
240
+ font-size: 22px;
241
+ line-height: 32px;
242
+ text-align: center;
243
+ cursor: pointer;
244
+ border: none;
245
+ user-select: none;
246
+ &:hover {
247
+ background-color: #005ecb;
248
+ }
249
+ `,
250
+ clearBtn: import_css.css`
251
+ display: flex;
252
+ align-items: center;
253
+ justify-content: center;
254
+ cursor: pointer;
255
+ border: 1px solid rgb(228, 231, 236);
256
+ border-radius: 12px;
257
+ width: 45px;
258
+ height: 45px;
259
+ box-sizing: border-box;
260
+ `,
261
+ chatFooter: import_css.css`
262
+ gap: 8px;
263
+ position: relatative;
264
+ z-index: 10;
265
+ padding: 0 20px 10px 20px;
266
+ `,
267
+ flexCenterGap2: import_css.css`
268
+ display: flex;
269
+ align-items: center;
270
+ gap: 8px;
271
+ `,
272
+ iconHuihuarenqun: import_css.css`
273
+ font-family: "iconfont";
274
+ font-size: 16px;
275
+ font-weight: 300;
276
+ padding: 3px;
277
+ border-radius: 6px;
278
+ color: #181B25;
279
+ cursor: pointer;
280
+ &:hover {
281
+ background: #E1E4EA;
282
+ color: #7F56D9;
283
+ }
284
+ `,
285
+ popoverFooter: import_css.css`
286
+ display: flex;
287
+ gap: 8px;
288
+ justify-content: end;
289
+ `,
290
+ divider: import_css.css`
291
+ width: 1px;
292
+ height: 15px;
293
+ margin-left: 3px;
294
+ margin-right: 3px;
295
+ background: #D0D5DD;
296
+ `,
297
+ flexCenterGap4: import_css.css`
298
+ display: flex;
299
+ align-items: center;
300
+ gap: 4px;
301
+ color: #7F56D9;
302
+ cursor: pointer;
303
+ &:hover {
304
+ opacity: 0.8;
305
+ }
306
+ `,
307
+ iconZengjiaDisabled: import_css.css`
308
+ font-family: "iconfont";
309
+ font-size: 25px;
310
+ font-weight: 300;
311
+ color: #D0D5DD;
312
+ cursor: not-allowed;
313
+ `,
314
+ iconZengjiaNormal: import_css.css`
315
+ font-family: "iconfont";
316
+ font-size: 25px;
317
+ font-weight: 300;
318
+ color: #98A2B3;
319
+ cursor: pointer;
320
+ &:hover {
321
+ color: #7F56D9;
322
+ }
323
+ `,
324
+ actionHeaderWrapper: import_css.css`
325
+ margin-bottom: 12px;
326
+ `,
327
+ actionHeaderItem: import_css.css`
328
+ display: flex;
329
+ align-items: center;
330
+ height: 40px;
331
+ box-sizing: border-box;
332
+ padding: 10px 16px;
333
+ margin-bottom: 8px;
334
+ background: #f7fafd;
335
+ cursor: pointer;
336
+ border-radius: 8px;
337
+ box-shadow: 0 1px 3px rgba(0,0,0,0.03);
338
+ `,
339
+ actionHeaderIcon: import_css.css`
340
+ height: 14px;
341
+ `,
342
+ actionHeaderText: import_css.css`
343
+ font-weight: 400;
344
+ font-size: 14px;
345
+ color: #3961F2;
346
+ margin-left: 10px;
347
+ margin-right: 6px;
348
+ `,
349
+ actionHeaderDetail: import_css.css`
350
+ background: #F3F5FA;
351
+ border-radius: 8px;
352
+ overflow: hidden;
353
+ `,
354
+ actionDetailTitle: import_css.css`
355
+ display: flex;
356
+ align-items: center;
357
+ padding: 0 16px;
358
+ box-sizing: border-box;
359
+ background: #EDEFF5;
360
+ height: 32px;
361
+ margin-bottom: 12px;
362
+ cursor: pointer;
363
+ `,
364
+ actionHeaderDetailItem: import_css.css`
365
+ display: flex;
366
+ align-items: center;
367
+ gap: 8px;
368
+ font-size: 14px;
369
+ padding: 0 16px;
370
+ margin-bottom: 12px;
371
+ color: #949494;
372
+ `,
373
+ actionHeaderCost: import_css.css`
374
+ margin-left: auto;
375
+ color: #888;
376
+ font-size: 12px;
377
+ min-width: 32px;
378
+ text-align: right;
379
+ `
380
+ }));
381
+ var GlobalStyle = () => /* @__PURE__ */ import_react.default.createElement(
382
+ import_react2.Global,
383
+ {
384
+ styles: import_react2.css`
385
+ .ant-bubble-footer {
386
+ display: flex;
387
+ align-items: center;
388
+ min-width: 0,
389
+ max-width: 600,
390
+ /* 你想覆盖的其他样式 */
391
+ }
392
+
393
+ .ant-avatar {
394
+ background-color: transparent;
395
+ }
396
+
397
+ .ant-sender-actions-list {
398
+ margin-left: -40px;
399
+ }
400
+
401
+ .ant-sender {
402
+ box-shadow: none !important;
403
+ }
404
+
405
+ .ant-prompts-item {
406
+ padding-block: 8px !important;
407
+ }
408
+
409
+ /* 用户消息气泡背景色 */
410
+ .ant-bubble .user-content {
411
+ background-color: #D8E0FD;
412
+ }
413
+
414
+ /* 助手消息气泡背景色 */
415
+ .ant-bubble .assistant-content {
416
+ background-color: #F3F5FA;
417
+ }
418
+ `
419
+ }
420
+ );
421
+ // Annotate the CommonJS export names for ESM import in node:
422
+ 0 && (module.exports = {
423
+ GlobalStyle,
424
+ useStyles
425
+ });
426
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/components/XAiChatbot/styles.tsx"],
4
+ "sourcesContent": ["import React from 'react';\nimport { css } from '@emotion/css';\nimport { css as globalCss, Global } from '@emotion/react';\nimport { withBasicStyles } from '@/styles/common';\n\nconst primaryBlue = '#0078FF'; // 主蓝色\nconst lightBlue = '#E6F0FF'; // 浅蓝色气泡背景\nconst darkGray = '#333'; // 深灰色文本\nconst lightGray = '#888'; // 浅灰文本\nconst borderGray = '#ddd'; // 边框灰色\n\nexport const useStyles = withBasicStyles(() => ({\n // 静态样式\n wrapper: css`\n display: flex;\n flex-direction: column;\n max-height: 812px;\n min-height: 300px;\n width: 100%;\n height: 100%;\n min-width: 375px;\n background-color: #fff;\n // border: 1px solid rgba(80,96,122,.15);\n border-radius: 12px;\n overflow: hidden;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,\n Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n `,\n\n navbar: css`\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 12px 16px;\n border-bottom: 1px solid ${borderGray};\n background-color: #fff;\n `,\n\n userAvatar: css`\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n width: 32px;\n border-radius: 50%;\n object-fit: cover;\n margin-right: 12px;\n `,\n\n avatar: css`\n width: 40px;\n height: 40px;\n border-radius: 50%;\n object-fit: cover;\n margin-right: 12px;\n border: 1px solid ${borderGray};\n `,\n\n title: css`\n font-weight: 600;\n font-size: 16px;\n color: ${darkGray};\n `,\n\n subtitle: css`\n font-size: 12px;\n color: ${lightGray};\n margin-top: 2px;\n `,\n\n messageContainer: css`\n flex: 1;\n overflow-y: auto;\n padding: 16px;\n background-color: #fff;\n display: flex;\n flex-direction: column;\n gap: 10px;\n min-height: 0;\n position: relative;\n `,\n\n emptyWrapper: css`\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n color: '#222';\n userSelect: none;\n `,\n\n emptyImg: css`\n width: 60px;\n height: 60px;\n margin-bottom: 16px;\n `,\n\n message: css`\n max-width: 70%;\n padding: 10px 14px;\n border-radius: 20px;\n background-color: ${lightBlue};\n color: ${darkGray};\n font-size: 14px;\n line-height: 1.4;\n word-break: break-word;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n `,\n\n messageRight: css`\n align-self: flex-end;\n background-color: ${primaryBlue};\n color: white;\n border-bottom-right-radius: 4px;\n border-bottom-left-radius: 20px;\n border-top-left-radius: 20px;\n border-top-right-radius: 20px;\n `,\n\n quickReplies: css`\n display: flex;\n gap: 8px;\n padding: 10px 16px;\n border-top: 1px solid ${borderGray};\n background-color: #fff;\n overflow-x: auto;\n `,\n\n replyItem: css`\n padding: 6px 12px;\n font-size: 13px;\n border: 1px solid ${primaryBlue};\n border-radius: 20px;\n background-color: #fff;\n color: ${primaryBlue};\n cursor: pointer;\n white-space: nowrap;\n user-select: none;\n transition: all 0.2s ease;\n \n &:hover {\n background-color: ${primaryBlue};\n color: #fff;\n }\n `,\n\n highlight: css`\n background-color: ${primaryBlue};\n color: white;\n border-color: ${primaryBlue};\n `,\n\n inputBar: css`\n display: flex;\n align-items: center;\n padding: 10px 16px;\n border-top: 1px solid ${borderGray};\n background-color: #fff;\n `,\n\n input: css`\n flex: 1;\n padding: 8px 12px;\n border: 1px solid ${borderGray};\n border-radius: 20px;\n font-size: 14px;\n outline: none;\n \n &:focus {\n border-color: ${primaryBlue};\n box-shadow: 0 0 3px ${primaryBlue};\n }\n `,\n\n sendWrapper: css`\n flex: 1;\n border-radius: 26px;\n `,\n\n stopButton: css`\n width: 23px !important;\n height: 23px !important;\n padding: 0 !important;\n min-width: 23px !important;\n min-height: 23px !important;\n display: flex;\n align-items: center;\n justify-content: center;\n `,\n\n sendButton: css`\n width: 23px !important;\n height: 23px !important;\n padding: 0 !important;\n min-width: 23px !important;\n min-height: 23px !important;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ${primaryBlue};\n border: none;\n border-radius: 20px;\n color: white;\n font-weight: 600;\n cursor: pointer;\n transition: background-color 0.2s ease;\n box-sizing: border-box;\n &:hover {\n background-color: #005ecb;\n }\n &:disabled {\n background-color: ${lightBlue};\n cursor: not-allowed;\n }\n `,\n\n uploadBtn: css`\n margin-left: 8px;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background-color: ${primaryBlue};\n color: white;\n font-weight: 700;\n font-size: 22px;\n line-height: 32px;\n text-align: center;\n cursor: pointer;\n border: none;\n user-select: none;\n &:hover {\n background-color: #005ecb;\n }\n `,\n\n clearBtn: css`\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: 1px solid rgb(228, 231, 236);\n border-radius: 12px;\n width: 45px;\n height: 45px;\n box-sizing: border-box;\n `,\n\n chatFooter: css`\n gap: 8px;\n position: relatative;\n z-index: 10;\n padding: 0 20px 10px 20px;\n `,\n\n flexCenterGap2: css`\n display: flex;\n align-items: center;\n gap: 8px;\n `,\n\n iconHuihuarenqun: css`\n font-family: \"iconfont\";\n font-size: 16px;\n font-weight: 300;\n padding: 3px;\n border-radius: 6px;\n color: #181B25;\n cursor: pointer;\n &:hover {\n background: #E1E4EA;\n color: #7F56D9;\n }\n `,\n\n popoverFooter: css`\n display: flex;\n gap: 8px;\n justify-content: end;\n `,\n\n divider: css`\n width: 1px;\n height: 15px;\n margin-left: 3px;\n margin-right: 3px;\n background: #D0D5DD;\n `,\n\n flexCenterGap4: css`\n display: flex;\n align-items: center;\n gap: 4px;\n color: #7F56D9;\n cursor: pointer;\n &:hover {\n opacity: 0.8;\n }\n `,\n\n iconZengjiaDisabled: css`\n font-family: \"iconfont\";\n font-size: 25px;\n font-weight: 300;\n color: #D0D5DD;\n cursor: not-allowed;\n `,\n\n iconZengjiaNormal: css`\n font-family: \"iconfont\";\n font-size: 25px;\n font-weight: 300;\n color: #98A2B3;\n cursor: pointer;\n &:hover {\n color: #7F56D9;\n }\n `,\n actionHeaderWrapper: css`\n margin-bottom: 12px;\n `,\n actionHeaderItem: css`\n display: flex;\n align-items: center;\n height: 40px;\n box-sizing: border-box;\n padding: 10px 16px;\n margin-bottom: 8px;\n background: #f7fafd;\n cursor: pointer;\n border-radius: 8px;\n box-shadow: 0 1px 3px rgba(0,0,0,0.03);\n `,\n actionHeaderIcon: css`\n height: 14px;\n `,\n actionHeaderText: css`\n font-weight: 400;\n font-size: 14px;\n color: #3961F2;\n margin-left: 10px;\n margin-right: 6px;\n `,\n actionHeaderDetail: css`\n background: #F3F5FA;\n border-radius: 8px;\n overflow: hidden;\n `,\n actionDetailTitle: css`\n display: flex;\n align-items: center;\n padding: 0 16px;\n box-sizing: border-box;\n background: #EDEFF5;\n height: 32px;\n margin-bottom: 12px;\n cursor: pointer;\n `,\n actionHeaderDetailItem: css`\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 14px;\n padding: 0 16px;\n margin-bottom: 12px;\n color: #949494;\n `,\n actionHeaderCost: css`\n margin-left: auto;\n color: #888;\n font-size: 12px;\n min-width: 32px;\n text-align: right;\n `,\n}));\n\nexport const GlobalStyle: React.FC = () => (\n <Global\n styles={globalCss`\n .ant-bubble-footer {\n display: flex;\n align-items: center;\n min-width: 0,\n max-width: 600,\n /* 你想覆盖的其他样式 */\n }\n\n .ant-avatar {\n background-color: transparent;\n }\n\n .ant-sender-actions-list {\n margin-left: -40px;\n }\n\n .ant-sender {\n box-shadow: none !important;\n }\n\n .ant-prompts-item {\n padding-block: 8px !important;\n }\n\n /* 用户消息气泡背景色 */\n .ant-bubble .user-content {\n background-color: #D8E0FD;\n }\n\n /* 助手消息气泡背景色 */\n .ant-bubble .assistant-content {\n background-color: #F3F5FA;\n }\n `}\n />\n);\n"],
5
+ "mappings": "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",
6
+ "names": ["import_react", "React", "globalCss"]
7
+ }
@@ -0,0 +1,7 @@
1
+ import type { Meta, StoryObj } from '@storybook/react-vite';
2
+ import XAiProvider from './index';
3
+ declare const meta: Meta<typeof XAiProvider>;
4
+ export default meta;
5
+ type Story = StoryObj<typeof meta>;
6
+ export declare const WithProvider: Story;
7
+ export declare const MultipleProviders: Story;
@@ -0,0 +1,127 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
20
+ // If the importer is in node compatibility mode or this is not an ESM
21
+ // file that has been converted to a CommonJS file using a Babel-
22
+ // compatible transform (i.e. "__esModule" has not been set), then set
23
+ // "default" to the CommonJS "module.exports" for node compatibility.
24
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
25
+ mod
26
+ ));
27
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
28
+
29
+ // src/components/XAiProvider/XAiProvider.stories.tsx
30
+ var XAiProvider_stories_exports = {};
31
+ __export(XAiProvider_stories_exports, {
32
+ MultipleProviders: () => MultipleProviders,
33
+ WithProvider: () => WithProvider,
34
+ default: () => XAiProvider_stories_default
35
+ });
36
+ module.exports = __toCommonJS(XAiProvider_stories_exports);
37
+ var import_react = __toESM(require("react"));
38
+ var import_index = __toESM(require("./index"));
39
+ var import_XAiChatbot = __toESM(require("../XAiChatbot"));
40
+ var meta = {
41
+ title: "AI组件/XAiProvider AI容器",
42
+ component: import_index.default,
43
+ parameters: {
44
+ layout: "centered",
45
+ docs: {
46
+ description: {
47
+ component: "AI 聊天机器人容器组件,提供全局上下文和消息管理功能。"
48
+ }
49
+ }
50
+ },
51
+ tags: ["autodocs"],
52
+ argTypes: {
53
+ url: {
54
+ control: "text",
55
+ description: "AI 服务地址"
56
+ },
57
+ token: {
58
+ control: "text",
59
+ description: "认证 token"
60
+ },
61
+ providerId: {
62
+ control: "text",
63
+ description: "Provider 唯一标识"
64
+ }
65
+ },
66
+ // 添加装饰器,确保组件有必要的上下文
67
+ decorators: [
68
+ (Story) => /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: "20px" } }, /* @__PURE__ */ import_react.default.createElement(Story, null))
69
+ ]
70
+ };
71
+ var XAiProvider_stories_default = meta;
72
+ var WithProvider = {
73
+ render: (args) => /* @__PURE__ */ import_react.default.createElement("div", { style: { width: "400px", height: "600px" } }, /* @__PURE__ */ import_react.default.createElement(import_index.default, { ...args }, /* @__PURE__ */ import_react.default.createElement(
74
+ import_XAiChatbot.default,
75
+ {
76
+ navbarShow: true,
77
+ navbar: {
78
+ title: "Provider 聊天机器人",
79
+ subtitle: "由 Provider 管理消息",
80
+ avatar: "https://via.placeholder.com/40"
81
+ }
82
+ }
83
+ ))),
84
+ args: {
85
+ url: "http://ai-platform.xline-dev.test.xinke.biz",
86
+ token: "eyJhbGciOiJIUzUxMiJ9.eyJqdGkiOiJjYWIxYjM3Ni03MmZjLTRkNWEtOTIzMC01N2U3NmZiMGI4NmQiLCJzdWIiOiJSZXgiLCJpc3MiOiJodHRwOi8vY2hhdC10ZXN0LnpheGxpbmUuY29tIiwiYXVkIjoiTWFpblN0YXRpb24iLCJpYXQiOjE3NTQzMTc1OTAsImV4cCI6MTc1NDkyMjM5MCwidHlwZSI6InJlZnJlc2giLCJjbGllbnRfaWQiOiJBcHAxOTUwMDIwNTk0NDUyNjYwMjI0Iiwic2NvcGUiOiJhbGwiLCJwbGF0Zm9ybV90eXBlIjoiTWFpblN0YXRpb24ifQ.crZFQRycuHHA1iIIFJ5ak9kS1-04Eqro-QWWG8HZj6Dz7DkLWYuQBPCrUlCtavGu0XW5tqHZ5WW4tdST06FvEA",
87
+ config: {
88
+ appNo: "App1952213101022154752",
89
+ pt: "MainStation",
90
+ tc: "ZABX"
91
+ },
92
+ providerId: "demo-provider"
93
+ }
94
+ };
95
+ var MultipleProviders = {
96
+ render: (args) => /* @__PURE__ */ import_react.default.createElement("div", { style: { display: "flex", gap: "20px" } }, /* @__PURE__ */ import_react.default.createElement("div", { style: { width: "400px", height: "600px" } }, /* @__PURE__ */ import_react.default.createElement(import_index.default, { ...args, providerId: "provider-1" }, /* @__PURE__ */ import_react.default.createElement(
97
+ import_XAiChatbot.default,
98
+ {
99
+ navbarShow: true,
100
+ navbar: {
101
+ title: "Provider 1",
102
+ subtitle: "第一个聊天机器人",
103
+ avatar: "https://via.placeholder.com/40"
104
+ }
105
+ }
106
+ ))), /* @__PURE__ */ import_react.default.createElement("div", { style: { width: "400px", height: "600px" } }, /* @__PURE__ */ import_react.default.createElement(import_index.default, { ...args, providerId: "provider-2" }, /* @__PURE__ */ import_react.default.createElement(
107
+ import_XAiChatbot.default,
108
+ {
109
+ navbarShow: true,
110
+ navbar: {
111
+ title: "Provider 2",
112
+ subtitle: "第二个聊天机器人",
113
+ avatar: "https://via.placeholder.com/40"
114
+ }
115
+ }
116
+ )))),
117
+ args: {
118
+ url: "https://api.example.com/ai",
119
+ token: "your-token-here"
120
+ }
121
+ };
122
+ // Annotate the CommonJS export names for ESM import in node:
123
+ 0 && (module.exports = {
124
+ MultipleProviders,
125
+ WithProvider
126
+ });
127
+ //# sourceMappingURL=XAiProvider.stories.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/components/XAiProvider/XAiProvider.stories.tsx"],
4
+ "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react-vite';\nimport React from 'react';\nimport XAiProvider from './index';\nimport XAiChatbot from '../XAiChatbot';\n\nconst meta: Meta<typeof XAiProvider> = {\n title: 'AI组件/XAiProvider AI容器',\n component: XAiProvider,\n parameters: {\n layout: 'centered',\n docs: {\n description: {\n component: 'AI 聊天机器人容器组件,提供全局上下文和消息管理功能。',\n },\n },\n },\n tags: ['autodocs'],\n argTypes: {\n url: {\n control: 'text',\n description: 'AI 服务地址',\n },\n token: {\n control: 'text',\n description: '认证 token',\n },\n providerId: {\n control: 'text',\n description: 'Provider 唯一标识',\n },\n },\n // 添加装饰器,确保组件有必要的上下文\n decorators: [\n (Story) => (\n <div style={{ padding: '20px' }}>\n <Story />\n </div>\n ),\n ],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\n// 使用 Provider 的 XAiChatbot\nexport const WithProvider: Story = {\n render: (args) => (\n <div style={{ width: '400px', height: '600px' }}>\n <XAiProvider {...args}>\n <XAiChatbot\n navbarShow\n navbar={{\n title: 'Provider 聊天机器人',\n subtitle: '由 Provider 管理消息',\n avatar: 'https://via.placeholder.com/40',\n }}\n />\n </XAiProvider>\n </div>\n ),\n args: {\n url: 'http://ai-platform.xline-dev.test.xinke.biz',\n token: 'eyJhbGciOiJIUzUxMiJ9.eyJqdGkiOiJjYWIxYjM3Ni03MmZjLTRkNWEtOTIzMC01N2U3NmZiMGI4NmQiLCJzdWIiOiJSZXgiLCJpc3MiOiJodHRwOi8vY2hhdC10ZXN0LnpheGxpbmUuY29tIiwiYXVkIjoiTWFpblN0YXRpb24iLCJpYXQiOjE3NTQzMTc1OTAsImV4cCI6MTc1NDkyMjM5MCwidHlwZSI6InJlZnJlc2giLCJjbGllbnRfaWQiOiJBcHAxOTUwMDIwNTk0NDUyNjYwMjI0Iiwic2NvcGUiOiJhbGwiLCJwbGF0Zm9ybV90eXBlIjoiTWFpblN0YXRpb24ifQ.crZFQRycuHHA1iIIFJ5ak9kS1-04Eqro-QWWG8HZj6Dz7DkLWYuQBPCrUlCtavGu0XW5tqHZ5WW4tdST06FvEA',\n config: {\n appNo: 'App1952213101022154752',\n pt: 'MainStation',\n tc: 'ZABX',\n },\n providerId: 'demo-provider',\n },\n};\n\n// 多个 Provider 示例\nexport const MultipleProviders: Story = {\n render: (args) => (\n <div style={{ display: 'flex', gap: '20px' }}>\n <div style={{ width: '400px', height: '600px' }}>\n <XAiProvider {...args} providerId=\"provider-1\">\n <XAiChatbot\n navbarShow\n navbar={{\n title: 'Provider 1',\n subtitle: '第一个聊天机器人',\n avatar: 'https://via.placeholder.com/40',\n }}\n />\n </XAiProvider>\n </div>\n\n <div style={{ width: '400px', height: '600px' }}>\n <XAiProvider {...args} providerId=\"provider-2\">\n <XAiChatbot\n navbarShow\n navbar={{\n title: 'Provider 2',\n subtitle: '第二个聊天机器人',\n avatar: 'https://via.placeholder.com/40',\n }}\n />\n </XAiProvider>\n </div>\n </div>\n ),\n args: {\n url: 'https://api.example.com/ai',\n token: 'your-token-here',\n },\n};\n\n// // 自定义消息处理示例\n// export const CustomMessageHandling: Story = {\n// render: (args) => (\n// <div style={{ width: '400px', height: '600px' }}>\n// <XAiProvider {...args}>\n// <XAiChatbot\n// navbarShow\n// navbar={{\n// title: '自定义处理',\n// subtitle: '自定义消息处理逻辑',\n// avatar: 'https://via.placeholder.com/40',\n// }}\n// messageActions={[\n// {\n// key: 'custom',\n// icon: <span>🔧</span>,\n// tooltip: '自定义操作',\n// },\n// ]}\n// onMessagesActionsCallback={(index, data) => {\n// console.log('自定义操作:', index, data);\n// }}\n// />\n// </XAiProvider>\n// </div>\n// ),\n// args: {\n// url: 'https://api.example.com/ai',\n// token: 'your-token-here',\n// providerId: 'custom-provider',\n// },\n// };\n\n// // 示例 1: 使用通用 Hook 的组件\n// const GenericComponent = React.memo<{ title: string }>(({ title }) => {\n// const { isInProvider, getProviderValue } = useProviderContext({\n// props: { title },\n// });\n\n// const providerMethods = useProviderMethods();\n\n// const handleCustomAction = () => {\n// if (isInProvider) {\n// providerMethods.sendMessage?.('自定义消息');\n// } else {\n// console.log('独立组件动作');\n// }\n// };\n\n// return (\n// <div style={{ padding: '20px', border: '1px solid #ccc', marginBottom: '10px' }}>\n// <h3>{title}</h3>\n// <p>是否在 Provider 中: {isInProvider ? '是' : '否'}</p>\n// <p>消息数量: {getProviderValue('messages')?.length || 0}</p>\n// <button onClick={handleCustomAction}>\n// {isInProvider ? '使用 Provider 方法' : '使用原有回调'}\n// </button>\n// </div>\n// );\n// });\n\n// // 示例 2: 自定义聊天组件\n// const CustomChatComponent = React.memo(() => {\n// const { isInProvider, getProviderValue } = useProviderContext({\n// props: {},\n// });\n\n// const providerMethods = useProviderMethods();\n\n// const messageCount = getProviderValue('messages')?.length || 0;\n// const theme = messageCount > 5 ? 'dark' : 'light';\n\n// return (\n// <div style={{\n// padding: '20px',\n// backgroundColor: theme === 'dark' ? '#333' : '#fff',\n// color: theme === 'dark' ? '#fff' : '#333',\n// border: '1px solid #ccc',\n// marginBottom: '10px',\n// }}\n// >\n// <h3>自定义聊天组件</h3>\n// <p>主题: {theme}</p>\n// <p>是否在 Provider 中: {isInProvider ? '是' : '否'}</p>\n// <button\n// onClick={() => providerMethods.sendMessage?.('Hello from custom component')}\n// disabled={!isInProvider}\n// >\n// 发送消息\n// </button>\n// </div>\n// );\n// });\n\n// // 展示 Hook 灵活性的示例\n// export const HookFlexibilityExample: Story = {\n// render: (args) => (\n// <div style={{ width: '600px', height: '800px' }}>\n// <XAiProvider {...args}>\n// <div style={{ padding: '20px' }}>\n// <h3>Hook 灵活性示例</h3>\n// <p>展示不同组件如何使用相同的 Hook</p>\n\n// {/* 不同的组件使用相同的 Hook */}\n// <div style={{ marginBottom: '20px' }}>\n// <GenericComponent title=\"组件 A\" />\n// <GenericComponent title=\"组件 B\" />\n// <CustomChatComponent />\n// </div>\n\n// {/* 聊天机器人 */}\n// <XAiChatbot\n// navbarShow\n// navbar={{\n// title: '灵活 Hook 示例',\n// subtitle: '所有组件共享 Provider 状态',\n// avatar: 'https://via.placeholder.com/40',\n// }}\n// />\n// </div>\n// </XAiProvider>\n// </div>\n// ),\n// args: {\n// url: 'https://api.example.com/ai',\n// token: 'your-token-here',\n// providerId: 'flexibility-example',\n// },\n// parameters: {\n// docs: {\n// description: {\n// story: '展示如何使用 useProviderContext 和 useProviderMethods Hook 来创建可复用的组件。',\n// },\n// },\n// },\n// };\n\n// // 展示独立组件 vs Provider 组件的对比\n// export const ComponentComparison: Story = {\n// render: (args) => (\n// <div style={{ display: 'flex', gap: '20px', padding: '20px' }}>\n// {/* 独立使用的组件 */}\n// <div style={{ width: '300px' }}>\n// <h4>独立组件</h4>\n// <GenericComponent title=\"独立组件\" />\n// <CustomChatComponent />\n// </div>\n\n// {/* 在 Provider 中的组件 */}\n// <div style={{ width: '300px' }}>\n// <h4>Provider 中的组件</h4>\n// <XAiProvider {...args}>\n// <GenericComponent title=\"Provider 组件\" />\n// <CustomChatComponent />\n// <XAiChatbot\n// navbarShow\n// navbar={{\n// title: '示例聊天机器人',\n// subtitle: '在 Provider 中',\n// avatar: 'https://via.placeholder.com/40',\n// }}\n// />\n// </XAiProvider>\n// </div>\n// </div>\n// ),\n// args: {\n// url: 'https://api.example.com/ai',\n// token: 'your-token-here',\n// providerId: 'comparison-example',\n// },\n// };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AAClB,mBAAwB;AACxB,wBAAuB;AAEvB,IAAM,OAAiC;AAAA,EACrC,OAAO;AAAA,EACP,WAAW,aAAAA;AAAA,EACX,YAAY;AAAA,IACV,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,aAAa;AAAA,QACX,WAAW;AAAA,MACb;AAAA,IACF;AAAA,EACF;AAAA,EACA,MAAM,CAAC,UAAU;AAAA,EACjB,UAAU;AAAA,IACR,KAAK;AAAA,MACH,SAAS;AAAA,MACT,aAAa;AAAA,IACf;AAAA,IACA,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IACf;AAAA,IACA,YAAY;AAAA,MACV,SAAS;AAAA,MACT,aAAa;AAAA,IACf;AAAA,EACF;AAAA;AAAA,EAEA,YAAY;AAAA,IACV,CAAC,UACC,6BAAAC,QAAA,cAAC,SAAI,OAAO,EAAE,SAAS,OAAO,KAC5B,6BAAAA,QAAA,cAAC,WAAM,CACT;AAAA,EAEJ;AACF;AAEA,IAAO,8BAAQ;AAIR,IAAM,eAAsB;AAAA,EACjC,QAAQ,CAAC,SACP,6BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,OAAO,SAAS,QAAQ,QAAQ,KAC5C,6BAAAA,QAAA,cAAC,aAAAD,SAAA,EAAa,GAAG,QACf,6BAAAC,QAAA;AAAA,IAAC,kBAAAC;AAAA,IAAA;AAAA,MACC,YAAU;AAAA,MACV,QAAQ;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,QACV,QAAQ;AAAA,MACV;AAAA;AAAA,EACF,CACF,CACF;AAAA,EAEF,MAAM;AAAA,IACJ,KAAK;AAAA,IACL,OAAO;AAAA,IACP,QAAQ;AAAA,MACN,OAAO;AAAA,MACP,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IACA,YAAY;AAAA,EACd;AACF;AAGO,IAAM,oBAA2B;AAAA,EACtC,QAAQ,CAAC,SACP,6BAAAD,QAAA,cAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,KAAK,OAAO,KACzC,6BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,OAAO,SAAS,QAAQ,QAAQ,KAC5C,6BAAAA,QAAA,cAAC,aAAAD,SAAA,EAAa,GAAG,MAAM,YAAW,gBAChC,6BAAAC,QAAA;AAAA,IAAC,kBAAAC;AAAA,IAAA;AAAA,MACC,YAAU;AAAA,MACV,QAAQ;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,QACV,QAAQ;AAAA,MACV;AAAA;AAAA,EACF,CACF,CACF,GAEA,6BAAAD,QAAA,cAAC,SAAI,OAAO,EAAE,OAAO,SAAS,QAAQ,QAAQ,KAC5C,6BAAAA,QAAA,cAAC,aAAAD,SAAA,EAAa,GAAG,MAAM,YAAW,gBAChC,6BAAAC,QAAA;AAAA,IAAC,kBAAAC;AAAA,IAAA;AAAA,MACC,YAAU;AAAA,MACV,QAAQ;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,QACV,QAAQ;AAAA,MACV;AAAA;AAAA,EACF,CACF,CACF,CACF;AAAA,EAEF,MAAM;AAAA,IACJ,KAAK;AAAA,IACL,OAAO;AAAA,EACT;AACF;",
6
+ "names": ["XAiProvider", "React", "XAiChatbot"]
7
+ }
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { XAiProviderProps } from "../../types/XAiProvider";
3
+ declare const XAiProvider: React.FC<XAiProviderProps>;
4
+ export default XAiProvider;