@topthink/chat 1.0.22 → 1.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/es/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import*as e from"react";import{useCallback as r,useState as t,useImperativeHandle as o,memo as n,useMemo as i,useRef as a,createContext as s,useContext as l,Fragment as c,useEffect as
|
|
1
|
+
import*as e from"react";import{useCallback as r,useState as t,useImperativeHandle as o,memo as n,useMemo as i,useRef as a,createContext as s,useContext as l,Fragment as c,forwardRef as d,useEffect as m}from"react";import{useImmer as h,request as p,isRequestError as u,Lightbox as g,styled as f,Clipboard as b,css as v,formatSize as x,Tooltip as y,useAsync as k,isImageUrl as w}from"@topthink/components";import{jsx as j,jsxs as N,Fragment as z}from"react/jsx-runtime";import $ from"react-markdown";import"katex/dist/katex.min.css";import M from"remark-math";import C from"remark-breaks";import E from"remark-gfm";import q from"rehype-katex";import F from"rehype-highlight";import{Spinner as R}from"react-bootstrap";import*as _ from"path";import L from"path";import O from"react-textarea-autosize";import T from"use-resize-observer";function D(e){if((e=e.filter((e=>!!e.trim()))).length>3){const r=[...e];let t=e.length-3;for(;t--;){let e=Math.floor(Math.random()*r.length);r.splice(e,1)}e=r}return e}function A(e){return e.map((e=>({id:e.id,query:e.query,files:e.files||void 0,chunks:e.chunks.map((e=>{let{content:r="",error:t,tools:o=[]}=e;return{content:r,error:t,tools:o}})),annotation:e.annotation,stats:{usage:e.usage,latency:e.latency}})))}function P(e){let{url:n,onboarding:i,onSuccess:a,ref:s,transformRequest:l,...c}=e;const d=r((e=>{const r=[];if(i&&!1!==i.enable&&i.prologue){const e=D(i.questions);r.push({chunks:[{content:[i.prologue,...e.map((e=>`[${e}](#!question)`))].join("\n"),tools:[]}]})}return e?r.concat(A(e.messages||[])):r}),[i]),[m,g]=h((()=>d(c.conversation))),[f,b]=t(!1),[v,x]=t(c.conversation?.id),y=r((async function(e){let r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];if(e||r.length>0){b(!0),g((t=>{t.push({query:e,files:r,chunks:[],loading:!0})}));try{let t={method:"post",url:n,data:{query:e,files:r,conversation:v},onMessage:e=>{if(e.data)if("[DONE]"!=e.data)try{const r=JSON.parse(e.data);r.conversation?x(r.conversation):g((e=>{const t=e[e.length-1];if(t.chunks)if(r.chunks){const e=r.chunks.index;if(t.chunks[e]||(t.chunks[e]={content:"",tools:[]}),r.chunks.error)t.chunks[e].error=r.chunks.error;else if(r.chunks.tools){const o=r.chunks.tools.index;"response"in r.chunks.tools?(t.chunks[e].tools[o].response=r.chunks.tools.response,t.chunks[e].tools[o].error=r.chunks.tools.error,t.chunks[e].tools[o].content=r.chunks.tools.content):t.chunks[e].tools[o]={name:r.chunks.tools.name,title:r.chunks.tools.title,arguments:r.chunks.tools.arguments}}else r.chunks.content&&(t.chunks[e].content+=r.chunks.content)}else r.stats&&(t.stats=r.stats)}))}catch(e){console.error(e)}else g((e=>{e[e.length-1].loading=!1}))}};l&&(t=l("chat",t)),await p(t)}catch(e){let r="未知错误";u(e)&&(r=401==e.response?.status?"未授权或授权已过期,请刷新页面后重试":"string"==typeof e.errors?e.errors:Object.values(e.errors).join("\n")),g((e=>{const t=e[e.length-1];t.chunks&&(0===t.chunks.length?t.chunks=[{content:`[${r}]`,tools:[]}]:t.chunks[t.chunks.length-1].content=`[${r}]`),t.loading=!1}))}b(!1),a?.()}}),[l,v]),k=r((e=>{f||(x(e?.id),g(d(e)))}),[f,d]);return o(s,(()=>({reset:k,send:y}))),{messages:m,loading:f,send:y,reset:k}}const S=g.Image,B={pre:e=>{let{children:r}=e;const t=a(null);return N(X,{ref:t,children:[j(K,{tooltip:!1,content:()=>{const e=t.current?.getElementsByTagName("code");return e?.[0]?.innerText||""}}),r]})},a:e=>{let{node:r,href:t,...o}=e;const n=t?.startsWith("http")?"_blank":"_self";return j("a",{...o,href:t,target:n})},img:e=>{let{node:r,...t}=e;return j(S,{...t})}},I=[[M,{singleDollarTextMath:!1}],E,C],U=[q,[F,{detect:!1,ignoreMissing:!0}]],H=n((e=>{let{content:r,components:t}=e;return r=r.replace(/\\\(\s(.+?)\s\\\)/g,"$$$$ $1 $$$$"),j(J,{remarkPlugins:I,rehypePlugins:U,components:i((()=>({...B,...t})),[t]),children:r})})),K=f(b)`
|
|
2
2
|
position: absolute;
|
|
3
3
|
right: 10px;
|
|
4
4
|
top: 1em;
|
|
@@ -18,17 +18,17 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
18
18
|
&:hover {
|
|
19
19
|
opacity: 1;
|
|
20
20
|
}
|
|
21
|
-
`,
|
|
21
|
+
`,X=f.pre`
|
|
22
22
|
position: relative;
|
|
23
23
|
|
|
24
24
|
&:hover {
|
|
25
|
-
${
|
|
25
|
+
${K} {
|
|
26
26
|
pointer-events: all;
|
|
27
27
|
transform: translateX(0px);
|
|
28
28
|
opacity: 0.5;
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
|
-
`,
|
|
31
|
+
`,J=f($)`
|
|
32
32
|
-ms-text-size-adjust: 100%;
|
|
33
33
|
-webkit-text-size-adjust: 100%;
|
|
34
34
|
line-height: 1.8;
|
|
@@ -298,7 +298,7 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
298
298
|
.hljs-strong {
|
|
299
299
|
font-weight: 700;
|
|
300
300
|
}
|
|
301
|
-
`,
|
|
301
|
+
`,W=s(null);function G(){const e=l(W);if(!e)throw new Error("useContext must be used within a Provider");return e}function Q(e){let{children:r,...t}=e;return j(W.Provider,{value:t,children:r})}const V=g.Image;function Y(e){let{src:r,...t}=e;const{imageResolver:o}=G();return o&&r&&(r=o(r)),j(Z,{children:j(V,{src:r,...t})})}const Z=f.div`
|
|
302
302
|
margin-bottom: .5rem;
|
|
303
303
|
margin-top: .5rem;
|
|
304
304
|
border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
|
|
@@ -323,9 +323,9 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
323
323
|
max-height: 100%;
|
|
324
324
|
max-width: 100%;
|
|
325
325
|
}
|
|
326
|
-
`;function
|
|
326
|
+
`;function ee(e){let{tool:r}=e;const[o,n]=t(!1),{logLevel:i="none"}=G();let a=null;r.content&&("string"==typeof r.content?a=j(H,{content:r.content}):"image"===r.content.type&&(a=j(Y,{src:r.content.image})));const s="response"in r;return N(c,{children:["stats"==i&&j("div",{className:"mb-2",children:N("div",{role:"button",className:"d-inline-flex align-items-center shadow-sm rounded bg-white p-1 px-2 fs-7 gap-2",children:[s?r.error?j("i",{className:"bi bi-x-circle-fill text-danger"}):j("i",{className:"bi bi-check-circle-fill text-success"}):j(R,{animation:"border",variant:"primary",size:"sm"}),j("span",{className:"text-muted",children:s?"已使用":"正在使用"}),j("span",{children:r.title})]})}),"all"==i&&j("div",{className:"mb-2",children:N("div",o&&s?{className:"shadow-sm rounded bg-white fs-7",children:[N("div",{onClick:()=>n(!1),role:"button",className:"d-flex align-items-center p-1 px-2 gap-2",children:[r.error?j("i",{className:"bi bi-x-circle-fill text-danger"}):j("i",{className:"bi bi-check-circle-fill text-success"}),j("span",{className:"text-muted",children:"已使用"}),j("span",{children:r.title}),j("i",{className:"bi bi-caret-up-fill text-muted"})]}),N("div",{className:"border-top p-2 d-flex flex-column gap-2",children:[N("div",{className:"border rounded bg-light",children:[j("div",{className:"d-flex align-items-center p-1 px-2 fs-7 gap-2",children:j("span",{className:"text-muted",children:"参数"})}),j("div",{className:"border-top p-2 overflow-hidden",children:r.arguments})]}),N("div",{className:"border rounded bg-light",children:[j("div",{className:"d-flex align-items-center p-1 px-2 fs-7 gap-2",children:j("span",{className:"text-muted",children:"响应"})}),j(re,{className:"border-top p-2 overflow-hidden",children:r.response||"None"})]})]})]}:{onClick:()=>n(s),role:"button",className:"d-inline-flex align-items-center shadow-sm rounded bg-white p-1 px-2 fs-7 gap-2",children:[s?r.error?j("i",{className:"bi bi-x-circle-fill text-danger"}):j("i",{className:"bi bi-check-circle-fill text-success"}):j(R,{animation:"border",variant:"primary",size:"sm"}),j("span",{className:"text-muted",children:s?"已使用":"正在使用"}),j("span",{children:r.title}),s&&j("i",{className:"bi bi-caret-down-fill text-muted"})]})}),a]})}const re=f.div`
|
|
327
327
|
white-space: pre-wrap;
|
|
328
|
-
`;var
|
|
328
|
+
`;var te,oe,ne;function ie(){return ie=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e},ie.apply(this,arguments)}const ae=r=>e.createElement("svg",ie({xmlns:"http://www.w3.org/2000/svg",width:20,height:10,fill:"#fff",viewBox:"0 0 120 30"},r),te||(te=e.createElement("circle",{cx:15,cy:15,r:15,fill:"#3c60ff"},e.createElement("animate",{attributeName:"r",begin:"0s",calcMode:"linear",dur:"0.8s",from:15,repeatCount:"indefinite",to:15,values:"15;9;15"}),e.createElement("animate",{attributeName:"fill-opacity",begin:"0s",calcMode:"linear",dur:"0.8s",from:1,repeatCount:"indefinite",to:1,values:"1;.5;1"}))),oe||(oe=e.createElement("circle",{cx:60,cy:15,r:9,fill:"#3c60ff",fillOpacity:.3},e.createElement("animate",{attributeName:"r",begin:"0s",calcMode:"linear",dur:"0.8s",from:9,repeatCount:"indefinite",to:9,values:"9;15;9"}),e.createElement("animate",{attributeName:"fill-opacity",begin:"0s",calcMode:"linear",dur:"0.8s",from:.5,repeatCount:"indefinite",to:.5,values:".5;1;.5"}))),ne||(ne=e.createElement("circle",{cx:105,cy:15,r:15,fill:"#3c60ff"},e.createElement("animate",{attributeName:"r",begin:"0s",calcMode:"linear",dur:"0.8s",from:15,repeatCount:"indefinite",to:15,values:"15;9;15"}),e.createElement("animate",{attributeName:"fill-opacity",begin:"0s",calcMode:"linear",dur:"0.8s",from:1,repeatCount:"indefinite",to:1,values:"1;.5;1"}))));const se=function(e){let{ext:r}=e;const{result:t}=k((async e=>(await function(e){switch(e){case"../../images/file/docx.svg":return import("./docx-nWXnlyT_.js");case"../../images/file/jpg.svg":return import("./jpg-6tBxSzWk.js");case"../../images/file/md.svg":return import("./md-GZ3HJPcw.js");case"../../images/file/pdf.svg":return import("./pdf-pVX1_E6T.js");case"../../images/file/png.svg":return import("./png-u0o1NMqQ.js");case"../../images/file/pptx.svg":return import("./pptx-Hprz0cON.js");case"../../images/file/txt.svg":return import("./txt-eHeCpvNO.js");case"../../images/file/xlsx.svg":return import("./xlsx-uOft-SV2.js");default:return new Promise((function(r,t){("function"==typeof queueMicrotask?queueMicrotask:setTimeout)(t.bind(null,new Error("Unknown variable dynamic import: "+e)))}))}}(`../../images/file/${e}.svg`)).default),[r]);return t?j("img",{width:30,height:30,src:t}):null};function le(e){let{className:r,name:t,size:o,loading:n,error:i,onRemove:a}=e;const s=L.extname(t).substring(1),l=N(he,{className:r,$error:!!i,children:[N(me,{children:[j(se,{ext:s}),n&&j(R,{variant:"primary"})]}),N(de,{children:[j("h4",{children:t}),j("p",{children:x(o,1)})]}),a&&j(ce,{onClick:e=>{e.preventDefault(),a()},children:j("i",{className:"bi bi-trash3"})})]});return i?j(y,{placement:"top",tooltip:i,children:l}):l}const ce=f.div`
|
|
329
329
|
width: 1.75rem;
|
|
330
330
|
height: 1.75rem;
|
|
331
331
|
align-items: center;
|
|
@@ -340,7 +340,7 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
340
340
|
color: var(--bs-danger);
|
|
341
341
|
background-color: var(--bs-danger-bg-subtle);
|
|
342
342
|
}
|
|
343
|
-
`,
|
|
343
|
+
`,de=f.div`
|
|
344
344
|
flex: 1;
|
|
345
345
|
overflow: hidden;
|
|
346
346
|
|
|
@@ -361,7 +361,7 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
361
361
|
line-height: 20px;
|
|
362
362
|
margin-bottom: 0;
|
|
363
363
|
}
|
|
364
|
-
`,
|
|
364
|
+
`,me=f.div`
|
|
365
365
|
position: relative;
|
|
366
366
|
width: 3rem;
|
|
367
367
|
height: 3rem;
|
|
@@ -375,7 +375,7 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
375
375
|
position: absolute;
|
|
376
376
|
}
|
|
377
377
|
|
|
378
|
-
`,
|
|
378
|
+
`,he=f.div`
|
|
379
379
|
display: flex;
|
|
380
380
|
gap: .5rem;
|
|
381
381
|
padding: .5rem;
|
|
@@ -388,22 +388,10 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
388
388
|
border-color: var(--bs-primary);
|
|
389
389
|
}
|
|
390
390
|
|
|
391
|
-
${e=>e.$error&&
|
|
391
|
+
${e=>e.$error&&v`
|
|
392
392
|
border-color: var(--bs-danger) !important;
|
|
393
393
|
`}
|
|
394
|
-
|
|
395
|
-
width: 100%;
|
|
396
|
-
margin-bottom: .5rem;
|
|
397
|
-
margin-top: .5rem;
|
|
398
|
-
|
|
399
|
-
&:first-child {
|
|
400
|
-
margin-top: 0;
|
|
401
|
-
}
|
|
402
|
-
|
|
403
|
-
&:last-child {
|
|
404
|
-
margin-bottom: 0;
|
|
405
|
-
}
|
|
406
|
-
`,ue=g.div`
|
|
394
|
+
`;var pe=d((function(e,r){let{children:t,tooltip:o,onClick:n,...i}=e;const a=j(ue,{ref:r,onClick:n,...i,children:t});return o?j(y,{tooltip:o,placement:"top",children:a}):a}));const ue=f.div`
|
|
407
395
|
align-items: center;
|
|
408
396
|
justify-content: center;
|
|
409
397
|
border-radius: .375rem;
|
|
@@ -427,15 +415,32 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
427
415
|
background-color: var(--bs-gray-200);
|
|
428
416
|
}
|
|
429
417
|
}
|
|
430
|
-
`,ge=
|
|
418
|
+
`,ge=n((e=>{let{message:r,actions:t,updater:o}=e;const{query:n,files:a=[],chunks:s,annotation:l}=r,{user:d,bot:m,logLevel:h="none"}=G(),p=i((()=>s?s.reduce((function(e,r){return e+r.content+"\n"+r.tools.reduce(((e,r)=>r.content&&"string"==typeof r.content?e+r.content+"\n":e),"")}),""):""),[s]);return N(z,{children:[(n||a.length>0)&&N(we,{$reverse:!0,children:[d&&j(ye,{children:j("img",{src:d.avatar})}),N(ke,{children:[n&&j(H,{content:n}),a.length>0&&a.map(((e,r)=>{let{name:t,size:o,path:n}=e;return w(n)?j(Y,{src:`/uploads/${n}`},r):j(be,{children:j(le,{name:t,size:o})},r)}))]})]}),s&&N(we,{children:[j(ye,{children:j("img",{src:m.avatar})}),N(ke,{children:[(n||a.length>0)&&N(ve,{children:[j(b,{placement:"top",content:p,as:pe,tooltip:!0}),t?.({Component:pe,message:r,content:p,setMessage:o})]}),j(xe,{children:["stats","all"].includes(h)&&r.stats&&N(z,{children:[N("span",{children:["耗时 ",r.stats.latency/1e3," 秒"]}),N("span",{children:["花费 Token ",r.stats.usage]})]})}),j(fe,{$deleted:!!l,children:s.length>0&&s.map(((e,r)=>N(c,{children:[e.content&&j(H,{content:e.content}),e.tools.map(((e,r)=>j(ee,{tool:e},r))),e.error&&j(H,{content:`[${e.error}]`})]},r)))}),l&&N("div",{children:[N("div",{className:"d-flex align-items-center",children:[j("span",{className:"fs-7 text-secondary me-2",children:"标注的答案"}),j("hr",{className:"flex-fill"})]}),j(H,{content:l.answer})]}),r.loading&&j(ae,{})]})]})]})})),fe=f.div`
|
|
419
|
+
${e=>e.$deleted&&v`
|
|
420
|
+
text-decoration-line: line-through;
|
|
421
|
+
color: var(--bs-secondary);
|
|
422
|
+
`}
|
|
423
|
+
`,be=f.div`
|
|
424
|
+
width: 100%;
|
|
425
|
+
margin-bottom: .5rem;
|
|
426
|
+
margin-top: .5rem;
|
|
427
|
+
|
|
428
|
+
&:first-child {
|
|
429
|
+
margin-top: 0;
|
|
430
|
+
}
|
|
431
|
+
|
|
432
|
+
&:last-child {
|
|
433
|
+
margin-bottom: 0;
|
|
434
|
+
}
|
|
435
|
+
`,ve=f.div`
|
|
431
436
|
position: absolute;
|
|
432
437
|
top: -1.1rem;
|
|
433
438
|
right: 0;
|
|
434
439
|
display: flex;
|
|
435
|
-
gap: .
|
|
440
|
+
gap: .5rem;
|
|
436
441
|
opacity: 0;
|
|
437
442
|
z-index: 1;
|
|
438
|
-
`,
|
|
443
|
+
`,xe=f.div`
|
|
439
444
|
position: absolute;
|
|
440
445
|
bottom: -1.4rem;
|
|
441
446
|
left: 0;
|
|
@@ -448,7 +453,7 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
448
453
|
display: flex;
|
|
449
454
|
opacity: 0;
|
|
450
455
|
z-index: 1;
|
|
451
|
-
`,
|
|
456
|
+
`,ye=f.div`
|
|
452
457
|
width: 35px;
|
|
453
458
|
height: 35px;
|
|
454
459
|
border-radius: 50%;
|
|
@@ -458,7 +463,7 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
458
463
|
width: 100%;
|
|
459
464
|
height: 100%;
|
|
460
465
|
}
|
|
461
|
-
`,
|
|
466
|
+
`,ke=f.div`
|
|
462
467
|
padding: .875rem;
|
|
463
468
|
background-color: rgb(243, 243, 243);
|
|
464
469
|
border-radius: var(--bs-border-radius-lg);
|
|
@@ -478,18 +483,18 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
478
483
|
}
|
|
479
484
|
|
|
480
485
|
&:hover {
|
|
481
|
-
${
|
|
486
|
+
${xe}, ${ve} {
|
|
482
487
|
opacity: 1;
|
|
483
488
|
}
|
|
484
489
|
}
|
|
485
|
-
`,
|
|
490
|
+
`,we=f.div`
|
|
486
491
|
display: flex;
|
|
487
492
|
justify-content: flex-start;
|
|
488
493
|
padding: 1rem 0 1rem 0;
|
|
489
|
-
${e=>e.$reverse&&
|
|
494
|
+
${e=>e.$reverse&&v`
|
|
490
495
|
flex-direction: row-reverse;
|
|
491
496
|
|
|
492
|
-
${
|
|
497
|
+
${ke} {
|
|
493
498
|
background: rgba(var(--bs-primary-rgb), 0.1);
|
|
494
499
|
margin-right: 10px;
|
|
495
500
|
margin-left: 0;
|
|
@@ -504,15 +509,15 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
504
509
|
}
|
|
505
510
|
}
|
|
506
511
|
`};
|
|
507
|
-
`,
|
|
512
|
+
`,je=[".txt",".md",".pdf",".docx",".xlsx",".pptx",".png",".jpg"];function Ne(e){let{chat:o,fileTypes:n,scrollRef:i,onMessages:s,minRows:l,toolbar:c,disabled:d,onLoading:g}=e;const f=a(null),b=a(null),[v,x]=t(""),[k,w]=h([]),[z,$]=t(!1),M=n&&n.length>0?n:je,{loading:C,messages:E,send:q}=P({...o,onSuccess(){requestAnimationFrame((()=>{f.current?.focus()})),o.onSuccess?.()}});m((()=>{s(E)}),[E]),m((()=>{g?.(C)}),[C]),m((()=>{!n&&k.length>0&&w([])}),[n]),m((()=>{const e=i.current;if(e&&q){const r=e=>{e.target instanceof HTMLAnchorElement&&"#!question"===e.target.hash&&(e.preventDefault(),q(e.target.text))};return e.addEventListener("click",r),()=>{e.removeEventListener("click",r)}}}),[i,q]);const F=r((e=>{let{target:r}=e;if(r.files){const e=Array.from(r.files).filter((e=>!!M.includes(_.extname(e.name))&&(!(e.size>20971520)&&e))).slice(0,6-k.length);w((r=>{r.push(...e.map((e=>({file:e}))))})),e.forEach((async e=>{try{const r=new FormData;r.set("file",e);let t={method:"POST",url:`${o.url}/upload`,data:r};o.transformRequest&&(t=o.transformRequest("upload",t));const n=await p(t);w((r=>{const t=r.find((r=>r.file===e));t&&(t.path=n.path)}))}catch(r){const t=u(r)?r.message:"unknown error";w((r=>{const o=r.find((r=>r.file===e));o&&(o.error=t)}))}}))}r.value=""}),[k,M]),R=k.flatMap((e=>{let{file:r,path:t}=e;return t?[{name:r.name,size:r.size,path:t}]:[]})),L=()=>{(v||R.length>0)&&(q(v,R),x(""),w([]))};return N(qe,{children:[c,N(Ee,{$focused:z&&!C,children:[k.length>0&&j($e,{children:k.map(((e,r)=>{let{file:t,error:o,path:n}=e;const i=void 0===o&&void 0===n;return j(ze,{name:t.name,size:t.size,error:o,loading:i,onRemove:()=>{w((e=>{const r=e.findIndex((e=>e.file===t));-1!==r&&e.splice(r,1)}))}},r)}))}),N(Ce,{children:[j(O,{disabled:C||d,ref:f,placeholder:"请输入你的问题, Enter+Shift换行, Enter发送",minRows:l,maxRows:5,value:v,onChange:e=>x(e.target.value),onKeyDown:e=>{"Enter"!==e.key||e.shiftKey||(e.preventDefault(),L())},onFocus:()=>$(!0),onBlur:()=>$(!1)}),n&&j(y,{tooltip:"可上传不超过6个小于20MB的文件",placement:"top",children:N(Me,{disabled:k.length>=6,onClick:()=>b.current?.click(),children:[j("input",{onChange:F,multiple:!0,accept:M.join(","),ref:b,type:"file",hidden:!0}),j("i",{className:"bi bi-file-earmark-arrow-up"})]})}),j(Me,{className:"text-primary",disabled:!v&&0===R.length,onClick:e=>{e.preventDefault(),L()},children:j("i",{className:"bi bi-send-fill"})})]})]})]})}const ze=f(le)`
|
|
508
513
|
width: calc((100% - .75rem) / 2);
|
|
509
|
-
|
|
514
|
+
`,$e=f.div`
|
|
510
515
|
display: flex;
|
|
511
516
|
flex-wrap: wrap;
|
|
512
517
|
padding: .75rem;
|
|
513
518
|
gap: .75rem;
|
|
514
519
|
border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
|
|
515
|
-
`,
|
|
520
|
+
`,Me=f.button`
|
|
516
521
|
color: var(--bs-secondary);
|
|
517
522
|
cursor: pointer;
|
|
518
523
|
display: flex;
|
|
@@ -534,7 +539,7 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
534
539
|
background-color: var(--bs-gray-200);
|
|
535
540
|
}
|
|
536
541
|
|
|
537
|
-
`,
|
|
542
|
+
`,Ce=f.div`
|
|
538
543
|
display: flex;
|
|
539
544
|
padding: .5rem .5rem .5rem 1rem;
|
|
540
545
|
gap: .25rem;
|
|
@@ -551,26 +556,26 @@ import*as e from"react";import{useCallback as r,useState as t,useImperativeHandl
|
|
|
551
556
|
color: rgba(54, 54, 54, .3);
|
|
552
557
|
}
|
|
553
558
|
}
|
|
554
|
-
|
|
559
|
+
`,Ee=f.div`
|
|
555
560
|
background: #FFF;
|
|
556
561
|
border: var(--bs-border-width) var(--bs-border-style) ${e=>e.$focused?"var(--bs-primary)":"var(--bs-border-color)"};
|
|
557
562
|
border-radius: var(--bs-border-radius-lg);
|
|
558
563
|
box-shadow: 0.125rem 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
|
|
559
|
-
`,
|
|
564
|
+
`,qe=f.div`
|
|
560
565
|
margin: 0 1rem 1rem;
|
|
561
|
-
`;function
|
|
566
|
+
`;function Fe(e){let{className:o,bot:n,user:i,input:s,logLevel:l,imageResolver:c,placeholder:d,actions:p,...u}=e;const[f,b]=h((()=>A(u.messages||[]))),[v,x]=t(!1),y=a(!s),k=a(null),w=r((()=>{const e=k.current;e&&requestAnimationFrame((()=>{e.scrollTo({top:e.scrollHeight})}))}),[]),{ref:z,height:$}=T();return m((()=>{!v&&y.current||(v&&(y.current=!0),w())}),[$,v,y]),j(Q,{bot:n,user:i,logLevel:l,imageResolver:c,children:j(Le,{className:o,children:N(g,{children:[j(Re,{ref:k,children:N(_e,{ref:z,children:[0===f.length&&d,f.map(((e,r)=>j(ge,{actions:p,message:e,updater:r=>{b((t=>{const o=t.findIndex((r=>r.id===e.id));-1!==o&&r(t[o])}))}},r)))]})}),s&&j(Ne,{onMessages:b,scrollRef:k,onLoading:x,...s})]})})})}const Re=f.div`
|
|
562
567
|
display: flex;
|
|
563
568
|
flex-direction: column;
|
|
564
569
|
flex: 1;
|
|
565
570
|
overflow-y: auto;
|
|
566
571
|
padding: 0 1rem;
|
|
567
572
|
margin-bottom: .5rem;
|
|
568
|
-
`,
|
|
573
|
+
`,_e=f.div`
|
|
569
574
|
display: flex;
|
|
570
575
|
flex-direction: column;
|
|
571
576
|
flex: 1;
|
|
572
|
-
`,
|
|
577
|
+
`,Le=f.div`
|
|
573
578
|
display: flex;
|
|
574
579
|
flex-direction: column;
|
|
575
580
|
height: 100%;
|
|
576
|
-
`;export{
|
|
581
|
+
`;export{Fe as MessageBox,D as pickQuestions,P as useChat};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@topthink/chat",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.23",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"prebuild": "rimraf es types",
|
|
6
6
|
"build": "rollup -c --environment NODE_ENV:production",
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
],
|
|
18
18
|
"dependencies": {
|
|
19
19
|
"@babel/runtime": "^7.11.2",
|
|
20
|
-
"@topthink/components": "^1.0.
|
|
20
|
+
"@topthink/components": "^1.0.91",
|
|
21
21
|
"katex": "^0.16.9",
|
|
22
22
|
"react-markdown": "^8.0.7",
|
|
23
23
|
"react-textarea-autosize": "^8.5.3",
|
|
@@ -56,5 +56,5 @@
|
|
|
56
56
|
},
|
|
57
57
|
"author": "yunwuxin <tzzhangyajun@qq.com> (https://github.com/yunwuxin)",
|
|
58
58
|
"license": "MIT",
|
|
59
|
-
"gitHead": "
|
|
59
|
+
"gitHead": "1e89b5360826160f813f37a2184aa4a5c51fe51b"
|
|
60
60
|
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
interface Props {
|
|
3
|
+
children: ReactNode;
|
|
4
|
+
tooltip?: string;
|
|
5
|
+
onClick?: () => void;
|
|
6
|
+
}
|
|
7
|
+
declare const _default: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLDivElement>>;
|
|
8
|
+
export default _default;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
import { ConversationMessage, LogLevel } from '../../types';
|
|
3
3
|
import { ChatOptions } from '../../hooks/use-chat';
|
|
4
|
+
import { MessageActions } from './message-item';
|
|
4
5
|
interface Props {
|
|
5
6
|
className?: string;
|
|
6
7
|
bot: {
|
|
@@ -22,6 +23,7 @@ interface Props {
|
|
|
22
23
|
chat: ChatOptions;
|
|
23
24
|
toolbar?: ReactNode;
|
|
24
25
|
};
|
|
26
|
+
actions?: MessageActions;
|
|
25
27
|
}
|
|
26
|
-
export default function MessageBox({ className, bot, user, input, logLevel, imageResolver, placeholder, ...props }: Props): JSX.Element;
|
|
28
|
+
export default function MessageBox({ className, bot, user, input, logLevel, imageResolver, placeholder, actions, ...props }: Props): JSX.Element;
|
|
27
29
|
export {};
|
|
@@ -1,7 +1,16 @@
|
|
|
1
|
-
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
2
|
import { Message } from '../../types';
|
|
3
|
+
import Action from './action';
|
|
4
|
+
export type MessageActions = (props: {
|
|
5
|
+
Component: typeof Action;
|
|
6
|
+
message: Message;
|
|
7
|
+
content: string;
|
|
8
|
+
setMessage: (callback: (message: Message) => void) => void;
|
|
9
|
+
}) => ReactNode;
|
|
3
10
|
interface Props {
|
|
4
11
|
message: Message;
|
|
12
|
+
actions?: MessageActions;
|
|
13
|
+
updater: (callback: (message: Message) => void) => void;
|
|
5
14
|
}
|
|
6
|
-
declare const MessageItem: import("react").MemoExoticComponent<({ message }: Props) => JSX.Element>;
|
|
15
|
+
declare const MessageItem: import("react").MemoExoticComponent<({ message, actions, updater }: Props) => JSX.Element>;
|
|
7
16
|
export default MessageItem;
|
package/types/types.d.ts
CHANGED
|
@@ -15,6 +15,7 @@ export interface ToolMessage {
|
|
|
15
15
|
}
|
|
16
16
|
export type LogLevel = 'stats' | 'all' | 'none';
|
|
17
17
|
export interface Message {
|
|
18
|
+
id: string;
|
|
18
19
|
query?: string;
|
|
19
20
|
files?: {
|
|
20
21
|
path: string;
|
|
@@ -31,12 +32,18 @@ export interface Message {
|
|
|
31
32
|
latency: number;
|
|
32
33
|
};
|
|
33
34
|
loading?: boolean;
|
|
35
|
+
annotation?: {
|
|
36
|
+
id: string;
|
|
37
|
+
question: string;
|
|
38
|
+
answer: string;
|
|
39
|
+
};
|
|
34
40
|
}
|
|
35
41
|
export interface Conversation {
|
|
36
42
|
id: string;
|
|
37
43
|
messages?: ConversationMessage[];
|
|
38
44
|
}
|
|
39
45
|
export interface ConversationMessage {
|
|
46
|
+
id: string;
|
|
40
47
|
query: string;
|
|
41
48
|
files: [];
|
|
42
49
|
chunks: {
|
|
@@ -46,4 +53,9 @@ export interface ConversationMessage {
|
|
|
46
53
|
}[];
|
|
47
54
|
usage: number;
|
|
48
55
|
latency: number;
|
|
56
|
+
annotation?: {
|
|
57
|
+
id: string;
|
|
58
|
+
question: string;
|
|
59
|
+
answer: string;
|
|
60
|
+
};
|
|
49
61
|
}
|