@topthink/chat 1.0.1 → 1.0.3

package/es/index.js

@@ -1,4 +1,4 @@
-import*as e from"react";import{useCallback as t,useState as r,useEffect as o,useImperativeHandle as n,createContext as i,useContext as s,memo as a,useRef as l,Fragment as c}from"react";import{useImmer as d,request as h,isRequestError as m,styled as p,Clipboard as g,css as u,formatSize as f,Tooltip as b,useAsync as v,isImageUrl as x,getAbsoluteUrl as y}from"@topthink/components";import{jsxs as w,jsx as k,Fragment as j}from"react/jsx-runtime";import N from"yet-another-react-lightbox";import z from"yet-another-react-lightbox/plugins/counter";import M from"yet-another-react-lightbox/plugins/download";import C from"yet-another-react-lightbox/plugins/zoom";import"yet-another-react-lightbox/styles.css";import"yet-another-react-lightbox/plugins/counter.css";import E from"react-markdown";import"katex/dist/katex.min.css";import q from"remark-math";import $ from"remark-breaks";import O from"remark-gfm";import P from"rehype-katex";import F from"rehype-highlight";import{Spinner as T}from"react-bootstrap";import*as _ from"path";import D from"path";import R from"react-textarea-autosize";function S(e){let{url:i,transformRequest:s,onboarding:a,onSuccess:l,ref:c,...p}=e;const g=t((function(){let e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];const t=[];if(a){let e=a.questions.filter((e=>!!e.trim()));if(e.length>3){const t=[...e];let r=e.length-3;for(;r--;){let e=Math.floor(Math.random()*t.length);t.splice(e,1)}e=t}t.push({chunks:[{content:[a.prologue,...e.map((e=>`[${e}](#!question)`))].join("\n"),tools:[]}]})}return p.messages&&e?t.concat(p.messages):t}),[a,p.messages]),[u,f]=d(g),[b,v]=r(!1),[x,y]=r(p.conversation);o((()=>{x||f(g(!1))}),[x]);const w=t((async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];if(e||t.length>0){v(!0),f((r=>{r.push({query:e,files:t,chunks:[],loading:!0})}));let r=0,o="";try{await h({method:"post",url:i,data:{query:e,files:t,conversation:x},transformRequest:s,onDownloadProgress:e=>{const t=e.target,{responseText:n}=t;for(;r<e.loaded;){const e=n.substring(r,++r);if(o+=e,"\n"===e){const e=o.match(/^data:(?<data>.*)/);if(e){const t=e.groups.data.trim();if("[DONE]"!=t)try{const e=JSON.parse(t);e.conversation?y(e.conversation):f((t=>{const r=t[t.length-1];if(r.chunks)if(e.chunks){const t=e.chunks.index;if(r.chunks[t]||(r.chunks[t]={content:"",tools:[]}),e.chunks.error)r.chunks[t].error=e.chunks.error;else if(e.chunks.tools){const o=e.chunks.tools.index;"response"in e.chunks.tools?(r.chunks[t].tools[o].response=e.chunks.tools.response,r.chunks[t].tools[o].error=e.chunks.tools.error):"content"in e.chunks.tools?r.chunks[t].tools[o].content=e.chunks.tools.content:r.chunks[t].tools[o]={name:e.chunks.tools.name,title:e.chunks.tools.title,arguments:e.chunks.tools.arguments}}else e.chunks.content&&(r.chunks[t].content+=e.chunks.content)}else e.stats&&(r.stats=e.stats)}))}catch(e){console.error(e)}else f((e=>{e[e.length-1].loading=!1}))}o=""}}}})}catch(e){let t="未知错误";m(e)&&(t=401==e.response?.status?"未授权或授权已过期，请刷新页面后重试":"string"==typeof e.errors?e.errors:Object.values(e.errors).join("\n")),f((e=>{const r=e[e.length-1];r.chunks&&(0===r.chunks.length?r.chunks=[{content:`[${t}]`,tools:[]}]:r.chunks[r.chunks.length-1].content=`[${t}]`),r.loading=!1}))}v(!1),l?.()}}),[s,x]),k=t((()=>{b||(y(void 0),f(g(!1)))}),[b,g]);return n(c,(()=>({reset:k,send:w}))),{messages:u,loading:b,send:w,reset:k}}const A=i({images:new Map,current:0,setCurrent:()=>null,setShow:()=>null,registerImage:()=>()=>null});function B(e){let{children:o}=e;const[n,i]=r((()=>new Map)),[s,a]=r(),[l,c]=r(!1),d=t(((e,t)=>(i((r=>new Map(r).set(e,t))),()=>{i((t=>{const r=new Map(t);return r.delete(e)?r:t}))})),[]),h=Array.from(n.keys()),m=h.indexOf(s),p=h.map((e=>({src:n.get(e)})));return w(A.Provider,{value:{images:n,current:s,setCurrent:a,setShow:c,registerImage:d},children:[o,k(N,{styles:{container:{backgroundColor:"rgba(0, 0, 0, .7)"}},plugins:[z,M,C],open:l,index:m,close:()=>c(!1),slides:p,render:{buttonPrev:p.length<=1?()=>null:void 0,buttonNext:p.length<=1?()=>null:void 0},controller:{closeOnBackdropClick:!0}})]})}let I=0;function U(e){const{registerImage:t,setShow:n,setCurrent:i}=s(A),[a]=r((()=>(I+=1,I)));return o((()=>{if(e.src)return t(a,e.src)}),[]),k("img",{...e,onClick:()=>{i(a),n(!0)}})}const L=a((e=>{let{content:t,components:r}=e;return k(X,{remarkPlugins:[[q,{singleDollarTextMath:!1}],O,$],rehypePlugins:[P,[F,{detect:!1,ignoreMissing:!0}]],components:{pre:e=>{let{children:t}=e;const r=l(null);return w(K,{ref:r,children:[k(H,{tooltip:!1,content:()=>{const e=r.current?.getElementsByTagName("code");return e?.[0]?.innerText||""}}),t]})},a:e=>{let{node:t,href:r,...o}=e;const n=r?.startsWith("http")?"_blank":"_self";return k("a",{...o,href:r,target:n})},img:e=>{let{node:t,...r}=e;return k(U,{...r})},...r},children:t})})),H=p(g)`
+import*as e from"react";import{useCallback as r,useState as t,useEffect as o,useImperativeHandle as n,memo as i,useRef as s,Fragment as a}from"react";import{useImmer as l,request as c,isRequestError as d,Lightbox as m,styled as h,Clipboard as p,css as u,formatSize as g,Tooltip as f,useAsync as b,isImageUrl as v,getAbsoluteUrl as x}from"@topthink/components";import{jsx as y,jsxs as k,Fragment as w}from"react/jsx-runtime";import j from"react-markdown";import"katex/dist/katex.min.css";import N from"remark-math";import z from"remark-breaks";import M from"remark-gfm";import E from"rehype-katex";import $ from"rehype-highlight";import{Spinner as q}from"react-bootstrap";import*as C from"path";import F from"path";import P from"react-textarea-autosize";function R(e){let{url:i,transformRequest:s,onboarding:a,onSuccess:m,ref:h,...p}=e;const u=r((function(){let e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];const r=[];if(a){let e=a.questions.filter((e=>!!e.trim()));if(e.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}r.push({chunks:[{content:[a.prologue,...e.map((e=>`[${e}](#!question)`))].join("\n"),tools:[]}]})}return p.conversation&&e?r.concat(p.conversation.messages):r}),[a,p.conversation]),[g,f]=l(u),[b,v]=t(!1),[x,y]=t(p.conversation?.id);o((()=>{x||f(u(!1))}),[x]);const k=r((async function(e){let r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];if(e||r.length>0){v(!0),f((t=>{t.push({query:e,files:r,chunks:[],loading:!0})}));let t=0,o="";try{await c({method:"post",url:i,data:{query:e,files:r,conversation:x},transformRequest:s,onDownloadProgress:e=>{const r=e.target,{responseText:n}=r;for(;t<e.loaded;){const e=n.substring(t,++t);if(o+=e,"\n"===e){const e=o.match(/^data:(?<data>.*)/);if(e){const r=e.groups.data.trim();if("[DONE]"!=r)try{const e=JSON.parse(r);e.conversation?y(e.conversation):f((r=>{const t=r[r.length-1];if(t.chunks)if(e.chunks){const r=e.chunks.index;if(t.chunks[r]||(t.chunks[r]={content:"",tools:[]}),e.chunks.error)t.chunks[r].error=e.chunks.error;else if(e.chunks.tools){const o=e.chunks.tools.index;"response"in e.chunks.tools?(t.chunks[r].tools[o].response=e.chunks.tools.response,t.chunks[r].tools[o].error=e.chunks.tools.error):"content"in e.chunks.tools?t.chunks[r].tools[o].content=e.chunks.tools.content:t.chunks[r].tools[o]={name:e.chunks.tools.name,title:e.chunks.tools.title,arguments:e.chunks.tools.arguments}}else e.chunks.content&&(t.chunks[r].content+=e.chunks.content)}else e.stats&&(t.stats=e.stats)}))}catch(e){console.error(e)}else f((e=>{e[e.length-1].loading=!1}))}o=""}}}})}catch(e){let r="未知错误";d(e)&&(r=401==e.response?.status?"未授权或授权已过期，请刷新页面后重试":"string"==typeof e.errors?e.errors:Object.values(e.errors).join("\n")),f((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}))}v(!1),m?.()}}),[s,x]),w=r((()=>{b||(y(void 0),f(u(!1)))}),[b,u]);return n(h,(()=>({reset:w,send:k}))),{messages:g,loading:b,send:k,reset:w}}const T=m.Image,_=i((e=>{let{content:r,components:t}=e;return y(A,{remarkPlugins:[[N,{singleDollarTextMath:!1}],M,z],rehypePlugins:[E,[$,{detect:!1,ignoreMissing:!0}]],components:{pre:e=>{let{children:r}=e;const t=s(null);return k(O,{ref:t,children:[y(D,{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 y("a",{...o,href:t,target:n})},img:e=>{let{node:r,...t}=e;return y(T,{...t})},...t},children:r})})),D=h(p)`
     position: absolute;
     right: 10px;
     top: 1em;
@@ -18,17 +18,17 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
     &:hover {
         opacity: 1;
     }
-`,K=p.pre`
+`,O=h.pre`
     position: relative;
 
     &:hover {
-        ${H} {
+        ${D} {
             pointer-events: all;
             transform: translateX(0px);
             opacity: 0.5;
         }
     }
-`,X=p(E)`
+`,A=h(j)`
     -ms-text-size-adjust: 100%;
     -webkit-text-size-adjust: 100%;
     line-height: 1.8;
@@ -299,7 +299,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
     .hljs-strong {
         font-weight: 700;
     }
-`;function J(e){return k(W,{children:k(U,{...e})})}const W=p.div`
+`,S=m.Image;function B(e){return y(U,{children:y(S,{...e})})}const U=h.div`
     margin-bottom: .5rem;
     margin-top: .5rem;
     border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
@@ -324,9 +324,9 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
         max-height: 100%;
         max-width: 100%;
     }
-`;function G(e){let{tool:t,showProcess:o}=e;const[n,i]=r(!1);let s=null;t.content&&("string"==typeof t.content?s=k(L,{content:t.content}):"image"===t.content.type&&(s=k(J,{src:t.content.image})));const a="response"in t;return w(c,{children:["all"==o&&k("div",{className:"mb-2",children:w("div",n&&a?{className:"shadow-sm rounded bg-white fs-7",children:[w("div",{onClick:()=>i(!1),role:"button",className:"d-flex align-items-center p-1 px-2 gap-2",children:[t.error?k("i",{className:"bi bi-x-circle-fill text-danger"}):k("i",{className:"bi bi-check-circle-fill text-success"}),k("span",{className:"text-muted",children:"已使用"}),k("span",{children:t.title}),k("i",{className:"bi bi-caret-up-fill text-muted"})]}),w("div",{className:"border-top p-2 d-flex flex-column gap-2",children:[w("div",{className:"border rounded bg-light",children:[k("div",{className:"d-flex align-items-center p-1 px-2 fs-7 gap-2",children:k("span",{className:"text-muted",children:"参数"})}),k("div",{className:"border-top p-2 overflow-hidden",children:t.arguments})]}),w("div",{className:"border rounded bg-light",children:[k("div",{className:"d-flex align-items-center p-1 px-2 fs-7 gap-2",children:k("span",{className:"text-muted",children:"响应"})}),k(Q,{className:"border-top p-2 overflow-hidden",children:t.response||"None"})]})]})]}:{onClick:()=>i(a),role:"button",className:"d-inline-flex align-items-center shadow-sm rounded bg-white p-1 px-2 fs-7 gap-2",children:[a?t.error?k("i",{className:"bi bi-x-circle-fill text-danger"}):k("i",{className:"bi bi-check-circle-fill text-success"}):k(T,{animation:"border",variant:"primary",size:"sm"}),k("span",{className:"text-muted",children:a?"已使用":"正在使用"}),k("span",{children:t.title}),a&&k("i",{className:"bi bi-caret-down-fill text-muted"})]})}),s]})}const Q=p.div`
+`;function I(e){let{tool:r,showProcess:o}=e;const[n,i]=t(!1);let s=null;r.content&&("string"==typeof r.content?s=y(_,{content:r.content}):"image"===r.content.type&&(s=y(B,{src:r.content.image})));const l="response"in r;return k(a,{children:["all"==o&&y("div",{className:"mb-2",children:k("div",n&&l?{className:"shadow-sm rounded bg-white fs-7",children:[k("div",{onClick:()=>i(!1),role:"button",className:"d-flex align-items-center p-1 px-2 gap-2",children:[r.error?y("i",{className:"bi bi-x-circle-fill text-danger"}):y("i",{className:"bi bi-check-circle-fill text-success"}),y("span",{className:"text-muted",children:"已使用"}),y("span",{children:r.title}),y("i",{className:"bi bi-caret-up-fill text-muted"})]}),k("div",{className:"border-top p-2 d-flex flex-column gap-2",children:[k("div",{className:"border rounded bg-light",children:[y("div",{className:"d-flex align-items-center p-1 px-2 fs-7 gap-2",children:y("span",{className:"text-muted",children:"参数"})}),y("div",{className:"border-top p-2 overflow-hidden",children:r.arguments})]}),k("div",{className:"border rounded bg-light",children:[y("div",{className:"d-flex align-items-center p-1 px-2 fs-7 gap-2",children:y("span",{className:"text-muted",children:"响应"})}),y(L,{className:"border-top p-2 overflow-hidden",children:r.response||"None"})]})]})]}:{onClick:()=>i(l),role:"button",className:"d-inline-flex align-items-center shadow-sm rounded bg-white p-1 px-2 fs-7 gap-2",children:[l?r.error?y("i",{className:"bi bi-x-circle-fill text-danger"}):y("i",{className:"bi bi-check-circle-fill text-success"}):y(q,{animation:"border",variant:"primary",size:"sm"}),y("span",{className:"text-muted",children:l?"已使用":"正在使用"}),y("span",{children:r.title}),l&&y("i",{className:"bi bi-caret-down-fill text-muted"})]})}),s]})}const L=h.div`
     white-space: pre-wrap;
-`;var V,Y,Z;function ee(){return ee=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},ee.apply(this,arguments)}const te=t=>e.createElement("svg",ee({xmlns:"http://www.w3.org/2000/svg",width:30,height:14,fill:"#fff",viewBox:"0 0 120 30"},t),V||(V=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"}))),Y||(Y=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"}))),Z||(Z=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 re=function(e){let{ext:t}=e;const{result:r}=v((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(t,r){("function"==typeof queueMicrotask?queueMicrotask:setTimeout)(r.bind(null,new Error("Unknown variable dynamic import: "+e)))}))}}(`../../images/file/${e}.svg`)).default),[t]);return r?k("img",{width:30,height:30,src:r}):null};function oe(e){let{className:t,name:r,size:o,loading:n,error:i,onRemove:s}=e;const a=D.extname(r).substring(1),l=w(ae,{className:t,$error:!!i,children:[w(se,{children:[k(re,{ext:a}),n&&k(T,{variant:"primary"})]}),w(ie,{children:[k("h4",{children:r}),k("p",{children:f(o,1)})]}),s&&k(ne,{onClick:e=>{e.preventDefault(),s()},children:k("i",{className:"bi bi-trash3"})})]});return i?k(b,{placement:"top",tooltip:i,children:l}):l}const ne=p.div`
+`;var H,K,X;function J(){return J=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},J.apply(this,arguments)}const W=r=>e.createElement("svg",J({xmlns:"http://www.w3.org/2000/svg",width:20,height:10,fill:"#fff",viewBox:"0 0 120 30"},r),H||(H=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"}))),K||(K=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"}))),X||(X=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 G=function(e){let{ext:r}=e;const{result:t}=b((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?y("img",{width:30,height:30,src:t}):null};function Q(e){let{className:r,name:t,size:o,loading:n,error:i,onRemove:s}=e;const a=F.extname(t).substring(1),l=k(ee,{className:r,$error:!!i,children:[k(Z,{children:[y(G,{ext:a}),n&&y(q,{variant:"primary"})]}),k(Y,{children:[y("h4",{children:t}),y("p",{children:g(o,1)})]}),s&&y(V,{onClick:e=>{e.preventDefault(),s()},children:y("i",{className:"bi bi-trash3"})})]});return i?y(f,{placement:"top",tooltip:i,children:l}):l}const V=h.div`
     width: 1.75rem;
     height: 1.75rem;
     align-items: center;
@@ -341,7 +341,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
         color: var(--bs-danger);
         background-color: var(--bs-danger-bg-subtle);
     }
-`,ie=p.div`
+`,Y=h.div`
     flex: 1;
     overflow: hidden;
 
@@ -362,7 +362,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
         line-height: 20px;
         margin-bottom: 0;
     }
-`,se=p.div`
+`,Z=h.div`
     position: relative;
     width: 3rem;
     height: 3rem;
@@ -376,7 +376,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
         position: absolute;
     }
 
-`,ae=p.div`
+`,ee=h.div`
     display: flex;
     gap: .5rem;
     padding: .5rem;
@@ -392,7 +392,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
     ${e=>e.$error&&u`
         border-color: var(--bs-danger) !important;
     `}
-`,le=a((e=>{let{avatar:t,message:r,showProcess:o="none"}=e;const{query:n,files:i=[],chunks:s}=r;return w(j,{children:[(n||i.length>0)&&k(ue,{$reverse:!0,children:w(ge,{children:[n&&k(L,{content:n}),i.length>0&&i.map(((e,t)=>{let{name:r,size:o,path:n}=e;return x(n)?k(J,{src:y(`/uploads/${n}`)},t):k(ce,{children:k(oe,{name:r,size:o})},t)}))]})}),s&&w(ue,{children:[k(pe,{children:k("img",{src:t})}),w(ge,{children:[r.query&&k(he,{children:k(g,{placement:"top",content:s.reduce((function(e,t){return e+t.content+"\n"+t.tools.reduce(((e,t)=>t.content&&"string"==typeof t.content?e+t.content+"\n":e),"")}),""),as:de})}),k(me,{children:["stats","all"].includes(o)&&r.stats&&w(j,{children:[w("span",{children:["耗时 ",r.stats.latency/1e3," 秒"]}),w("span",{children:["花费 Token ",r.stats.usage]})]})}),s.length>0&&s.map(((e,t)=>w(c,{children:[e.content&&k(L,{content:e.content}),e.tools.map(((e,t)=>k(G,{tool:e,showProcess:o},t))),e.error&&k(L,{content:`[${e.error}]`})]},t))),r.loading&&k(te,{})]})]})]})})),ce=p.div`
+`,re=i((e=>{let{bot:r,user:t,message:o,showProcess:n="none"}=e;const{query:i,files:s=[],chunks:l}=o;return k(w,{children:[(i||s.length>0)&&k(le,{$reverse:!0,children:[t&&y(se,{children:y("img",{src:t.avatar})}),k(ae,{children:[i&&y(_,{content:i}),s.length>0&&s.map(((e,r)=>{let{name:t,size:o,path:n}=e;return v(n)?y(B,{src:x(`/uploads/${n}`)},r):y(te,{children:y(Q,{name:t,size:o})},r)}))]})]}),l&&k(le,{children:[y(se,{children:y("img",{src:r.avatar})}),k(ae,{children:[o.query&&y(ne,{children:y(p,{placement:"top",content:l.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),"")}),""),as:oe})}),y(ie,{children:["stats","all"].includes(n)&&o.stats&&k(w,{children:[k("span",{children:["耗时 ",o.stats.latency/1e3," 秒"]}),k("span",{children:["花费 Token ",o.stats.usage]})]})}),l.length>0&&l.map(((e,r)=>k(a,{children:[e.content&&y(_,{content:e.content}),e.tools.map(((e,r)=>y(I,{tool:e,showProcess:n},r))),e.error&&y(_,{content:`[${e.error}]`})]},r))),o.loading&&y(W,{})]})]})]})})),te=h.div`
     width: 100%;
     margin-bottom: .5rem;
     margin-top: .5rem;
@@ -404,7 +404,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
     &:last-child {
         margin-bottom: 0;
     }
-`,de=p.div`
+`,oe=h.div`
     align-items: center;
     justify-content: center;
     border-radius: .375rem;
@@ -428,7 +428,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
             background-color: var(--bs-gray-200);
         }
     }
-`,he=p.div`
+`,ne=h.div`
     position: absolute;
     top: -1.1rem;
     right: 0;
@@ -436,7 +436,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
     gap: .25rem;
     opacity: 0;
     z-index: 1;
-`,me=p.div`
+`,ie=h.div`
     position: absolute;
     bottom: -1.4rem;
     left: 0;
@@ -449,7 +449,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
     display: flex;
     opacity: 0;
     z-index: 1;
-`,pe=p.div`
+`,se=h.div`
     width: 35px;
     height: 35px;
     border-radius: 50%;
@@ -459,7 +459,7 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
         width: 100%;
         height: 100%;
     }
-`,ge=p.div`
+`,ae=h.div`
     padding: .875rem;
     background-color: rgb(243, 243, 243);
     border-radius: var(--bs-border-radius-lg);
@@ -479,18 +479,18 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
     }
 
     &:hover {
-        ${me}, ${he} {
+        ${ie}, ${ne} {
             opacity: 1;
         }
     }
-`,ue=p.div`
+`,le=h.div`
     display: flex;
     justify-content: flex-start;
     padding: 1rem 0 1rem 0;
     ${e=>e.$reverse&&u`
-        justify-content: flex-end;
+        flex-direction: row-reverse;
 
-        ${ge} {
+        ${ae} {
             background: rgba(var(--bs-primary-rgb), 0.1);
             margin-right: 10px;
             margin-left: 0;
@@ -505,45 +505,41 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
             }
         }
     `};
-`;var fe;function be(){return be=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},be.apply(this,arguments)}const ve=t=>e.createElement("svg",be({xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 1024 1024"},t),fe||(fe=e.createElement("path",{fill:"currentColor",d:"m85.333 896 896-384-896-384v298.667l640 85.333-640 85.333z"}))),xe=[".txt",".md",".pdf",".docx",".xlsx",".pptx",".png",".jpg"];function ye(e){let{chat:n,fileTypes:i,scrollRef:s,onMessages:a}=e;const c=l(null),p=l(null),[g,u]=r(""),[f,v]=d([]),x=i&&i.length>0?i:xe,{loading:y,messages:j,send:N}=S({...n,onSuccess(){requestAnimationFrame((()=>{c.current?.focus()})),n.onSuccess?.()}});o((()=>{a(j)}),[j]),o((()=>{const e=s.current;if(e&&N){const t=e=>{e.target instanceof HTMLAnchorElement&&"#!question"===e.target.hash&&(e.preventDefault(),N(e.target.text))};return e.addEventListener("click",t),()=>{e.removeEventListener("click",t)}}}),[s,N]);const z=t((e=>{let{target:t}=e;if(t.files){const e=Array.from(t.files).filter((e=>!!x.includes(_.extname(e.name))&&(!(e.size>20971520)&&e))).slice(0,6-f.length);v((t=>{t.push(...e.map((e=>({file:e}))))})),e.forEach((async e=>{try{const t=new FormData;t.set("file",e);const r=await h({method:"POST",url:`${n.url}/upload`,transformRequest:n.transformRequest,data:t});v((t=>{const o=t.find((t=>t.file===e));o&&(o.path=r.path)}))}catch(t){const r=m(t)?t.message:"unknown error";v((t=>{const o=t.find((t=>t.file===e));o&&(o.error=r)}))}}))}t.value=""}),[f,x]),M=f.flatMap((e=>{let{file:t,path:r}=e;return r?[{name:t.name,size:t.size,path:r}]:[]})),C=()=>{(g||M.length>0)&&(N(g,M),u(""),v([]))};return w(ze,{children:[f.length>0&&k(ke,{children:f.map(((e,t)=>{let{file:r,error:o,path:n}=e;const i=void 0===o&&void 0===n;return k(we,{name:r.name,size:r.size,error:o,loading:i,onRemove:()=>{v((e=>{const t=e.findIndex((e=>e.file===r));-1!==t&&e.splice(t,1)}))}},t)}))}),w(Ne,{children:[k(R,{disabled:y,ref:c,placeholder:"请输入你的问题, Enter+Shift换行, Enter发送",maxRows:5,value:g,onChange:e=>u(e.target.value),onKeyDown:e=>{"Enter"!==e.key||e.shiftKey||(e.preventDefault(),C())}}),i&&k(b,{tooltip:"可上传不超过6个小于20MB的文件",placement:"top",children:w(je,{disabled:f.length>=6,onClick:()=>p.current?.click(),children:[k("input",{onChange:z,multiple:!0,accept:x.join(","),ref:p,type:"file",hidden:!0}),k("i",{className:"bi bi-file-earmark-arrow-up"})]})}),k(je,{disabled:!g&&0===M.length,onClick:e=>{e.preventDefault(),C()},children:k(ve,{})})]})]})}const we=p(oe)`
+`,ce=[".txt",".md",".pdf",".docx",".xlsx",".pptx",".png",".jpg"];function de(e){let{chat:n,fileTypes:i,scrollRef:a,onMessages:m,minRows:h}=e;const p=s(null),u=s(null),[g,b]=t(""),[v,x]=l([]),[w,j]=t(!1),N=i&&i.length>0?i:ce,{loading:z,messages:M,send:E}=R({...n,onSuccess(){requestAnimationFrame((()=>{p.current?.focus()})),n.onSuccess?.()}});o((()=>{m(M)}),[M]),o((()=>{const e=a.current;if(e&&E){const r=e=>{e.target instanceof HTMLAnchorElement&&"#!question"===e.target.hash&&(e.preventDefault(),E(e.target.text))};return e.addEventListener("click",r),()=>{e.removeEventListener("click",r)}}}),[a,E]);const $=r((e=>{let{target:r}=e;if(r.files){const e=Array.from(r.files).filter((e=>!!N.includes(C.extname(e.name))&&(!(e.size>20971520)&&e))).slice(0,6-v.length);x((r=>{r.push(...e.map((e=>({file:e}))))})),e.forEach((async e=>{try{const r=new FormData;r.set("file",e);const t=await c({method:"POST",url:`${n.url}/upload`,transformRequest:n.transformRequest,data:r});x((r=>{const o=r.find((r=>r.file===e));o&&(o.path=t.path)}))}catch(r){const t=d(r)?r.message:"unknown error";x((r=>{const o=r.find((r=>r.file===e));o&&(o.error=t)}))}}))}r.value=""}),[v,N]),q=v.flatMap((e=>{let{file:r,path:t}=e;return t?[{name:r.name,size:r.size,path:t}]:[]})),F=()=>{(g||q.length>0)&&(E(g,q),b(""),x([]))};return k(ge,{$focused:w,children:[v.length>0&&y(he,{children:v.map(((e,r)=>{let{file:t,error:o,path:n}=e;const i=void 0===o&&void 0===n;return y(me,{name:t.name,size:t.size,error:o,loading:i,onRemove:()=>{x((e=>{const r=e.findIndex((e=>e.file===t));-1!==r&&e.splice(r,1)}))}},r)}))}),k(ue,{children:[y(P,{disabled:z,ref:p,placeholder:"请输入你的问题, Enter+Shift换行, Enter发送",minRows:h,maxRows:5,value:g,onChange:e=>b(e.target.value),onKeyDown:e=>{"Enter"!==e.key||e.shiftKey||(e.preventDefault(),F())},onFocus:()=>j(!0),onBlur:()=>j(!1)}),i&&y(f,{tooltip:"可上传不超过6个小于20MB的文件",placement:"top",children:k(pe,{disabled:v.length>=6,onClick:()=>u.current?.click(),children:[y("input",{onChange:$,multiple:!0,accept:N.join(","),ref:u,type:"file",hidden:!0}),y("i",{className:"bi bi-file-earmark-arrow-up"})]})}),y(pe,{className:"text-primary",disabled:!g&&0===q.length,onClick:e=>{e.preventDefault(),F()},children:y("i",{className:"bi bi-send-fill"})})]})]})}const me=h(Q)`
     width: calc((100% - .75rem) / 2);
-`,ke=p.div`
+`,he=h.div`
     display: flex;
     flex-wrap: wrap;
     padding: .75rem;
     gap: .75rem;
     border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
-`,je=p.button`
+`,pe=h.button`
     color: var(--bs-secondary);
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
-    width: 2rem;
-    height: 2rem;
+    width: 1.8rem;
+    height: 1.8rem;
     border-radius: .5rem;
     outline: none;
     border: none;
     background: transparent;
-    font-size: 1.25rem;
-
-    svg {
-        width: 1.25rem;
-        height: 1.25rem;
-    }
+    font-size: 1.1rem;
 
     &:disabled {
-        color: var(--bs-gray-400);
+        color: var(--bs-gray-400) !important;
     }
 
     &:hover&:not(:disabled) {
         background-color: var(--bs-gray-200);
     }
 
-`,Ne=p.div`
+`,ue=h.div`
     display: flex;
     padding: .5rem .5rem .5rem 1rem;
     gap: .25rem;
+    align-items: end;
 
     textarea {
         border: none;
@@ -556,21 +552,21 @@ import*as e from"react";import{useCallback as t,useState as r,useEffect as o,use
             color: rgba(54, 54, 54, .3);
         }
     }
-`,ze=p.div`
+`,ge=h.div`
     background: #FFF;
     margin: 0 1rem 1rem;
-    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
+    border: var(--bs-border-width) var(--bs-border-style) ${e=>e.$focused?"var(--bs-primary)":"var(--bs-border-color)"};
     border-radius: var(--bs-border-radius-lg);
     box-shadow: 0.125rem 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
-`;function Me(e){let{className:n,avatar:i,chat:s,showProcess:a,fileTypes:c,...d}=e;const[h,m]=r([]),p=l(null),g=t((()=>{const e=p.current;e&&requestAnimationFrame((()=>e.scrollTo(0,e.scrollHeight)))}),[]);return o((()=>{d.messages&&m(d.messages)}),[d.messages]),o((()=>{g()})),k(Ee,{className:n,children:w(B,{children:[k(Ce,{ref:p,children:h.map(((e,t)=>k(le,{message:e,showProcess:a,avatar:i},t)))}),s&&k(ye,{chat:s,onMessages:m,scrollRef:p,fileTypes:c})]})})}const Ce=p.div`
+`;function fe(e){let{className:n,bot:i,user:a,input:l,showProcess:c,...d}=e;const[h,p]=t(d.messages||[]),u=s(null),g=r((()=>{const e=u.current;e&&requestAnimationFrame((()=>e.scrollTo(0,e.scrollHeight)))}),[]);return o((()=>{g()})),y(ve,{className:n,children:k(m,{children:[y(be,{ref:u,children:h.map(((e,r)=>y(re,{message:e,showProcess:c,bot:i,user:a},r)))}),l&&y(de,{onMessages:p,scrollRef:u,...l})]})})}const be=h.div`
     display: flex;
     flex-direction: column;
     flex: 1;
     overflow-y: auto;
     padding: 0 1rem;
     margin-bottom: 1rem;
-`,Ee=p.div`
+`,ve=h.div`
     display: flex;
     flex-direction: column;
     height: 100%;
-`;export{Me as MessageBox,S as useChat};
+`;export{fe as MessageBox,R as useChat};

package/package.json

@@ -1,59 +1,59 @@
-{
-    "name": "@topthink/chat",
-    "version": "1.0.1",
-    "scripts": {
-        "prebuild": "rimraf es types",
-        "build": "rollup -c --environment NODE_ENV:production",
-        "build:dev": "rollup -c",
-        "watch": "rollup -c -w",
-        "prepack": "npm run build"
-    },
-    "module": "es/index.js",
-    "types": "types/index.d.ts",
-    "files": [
-        "es",
-        "types",
-        "scss"
-    ],
-    "dependencies": {
-        "@babel/runtime": "^7.11.2",
-        "@topthink/components": "^1.0.77",
-        "katex": "^0.16.9",
-        "react-markdown": "^8.0.7",
-        "react-textarea-autosize": "^8.5.3",
-        "rehype-highlight": "^6.0.0",
-        "rehype-katex": "^6.0.2",
-        "remark-breaks": "^3.0.2",
-        "remark-gfm": "^3.0.1",
-        "remark-math": "^5.1.1",
-        "yet-another-react-lightbox": "^3.17.5"
-    },
-    "peerDependencies": {
-        "lodash": "*",
-        "react": "^17||^18",
-        "react-bootstrap": "^2.1.2",
-        "react-dom": "^17||^18"
-    },
-    "devDependencies": {
-        "@babel/core": "^7.23.6",
-        "@babel/plugin-transform-runtime": "^7.23.6",
-        "@babel/preset-env": "^7.23.6",
-        "@rollup/plugin-babel": "^6.0.4",
-        "@rollup/plugin-commonjs": "^25.0.7",
-        "@rollup/plugin-dynamic-import-vars": "^2.1.2",
-        "@rollup/plugin-image": "^3.0.3",
-        "@rollup/plugin-node-resolve": "^15.2.3",
-        "@rollup/plugin-terser": "^0.4.4",
-        "@rollup/plugin-typescript": "^11.1.5",
-        "@svgr/rollup": "^8.1.0",
-        "@types/lodash": "^4.14.161",
-        "@types/node": "^18.11.18",
-        "@types/react": "^17.0.0",
-        "@types/react-dom": "^17.0.0",
-        "react-bootstrap": "^2.1.2",
-        "rollup": "^4.8.0",
-        "typescript": "^5.3.3"
-    },
-    "author": "yunwuxin <tzzhangyajun@qq.com> (https://github.com/yunwuxin)",
-    "license": "MIT"
-}
+{
+    "name": "@topthink/chat",
+    "version": "1.0.3",
+    "scripts": {
+        "prebuild": "rimraf es types",
+        "build": "rollup -c --environment NODE_ENV:production",
+        "build:dev": "rollup -c",
+        "watch": "rollup -c -w",
+        "prepack": "npm run build"
+    },
+    "module": "es/index.js",
+    "types": "types/index.d.ts",
+    "files": [
+        "es",
+        "types",
+        "scss"
+    ],
+    "dependencies": {
+        "@babel/runtime": "^7.11.2",
+        "@topthink/components": "^1.0.79",
+        "katex": "^0.16.9",
+        "react-markdown": "^8.0.7",
+        "react-textarea-autosize": "^8.5.3",
+        "rehype-highlight": "^6.0.0",
+        "rehype-katex": "^6.0.2",
+        "remark-breaks": "^3.0.2",
+        "remark-gfm": "^3.0.1",
+        "remark-math": "^5.1.1"
+    },
+    "peerDependencies": {
+        "lodash": "*",
+        "react": "^17||^18",
+        "react-bootstrap": "^2.1.2",
+        "react-dom": "^17||^18"
+    },
+    "devDependencies": {
+        "@babel/core": "^7.23.6",
+        "@babel/plugin-transform-runtime": "^7.23.6",
+        "@babel/preset-env": "^7.23.6",
+        "@rollup/plugin-babel": "^6.0.4",
+        "@rollup/plugin-commonjs": "^25.0.7",
+        "@rollup/plugin-dynamic-import-vars": "^2.1.2",
+        "@rollup/plugin-image": "^3.0.3",
+        "@rollup/plugin-node-resolve": "^15.2.3",
+        "@rollup/plugin-terser": "^0.4.4",
+        "@rollup/plugin-typescript": "^11.1.5",
+        "@svgr/rollup": "^8.1.0",
+        "@types/lodash": "^4.14.161",
+        "@types/node": "^18.11.18",
+        "@types/react": "^17.0.0",
+        "@types/react-dom": "^17.0.0",
+        "react-bootstrap": "^2.1.2",
+        "rollup": "^4.8.0",
+        "typescript": "^5.3.3"
+    },
+    "author": "yunwuxin <tzzhangyajun@qq.com> (https://github.com/yunwuxin)",
+    "license": "MIT",
+    "gitHead": "a300c1e72f86a009d8c0b662ab73458b69cac31a"
+}

package/types/components/message-box/index.d.ts

@@ -3,11 +3,21 @@ import { Message, ShowProcess } from '../../types';
 import { ChatOptions } from '../../hooks/use-chat';
 interface Props {
     className?: string;
-    avatar: string;
+    bot: {
+        name: string;
+        avatar: string;
+    };
+    user?: {
+        name: string;
+        avatar: string;
+    };
     messages?: Message[];
     showProcess?: ShowProcess;
-    chat?: ChatOptions;
-    fileTypes?: string[];
+    input?: {
+        fileTypes?: string[];
+        minRows?: number;
+        chat: ChatOptions;
+    };
 }
-export default function MessageBox({ className, avatar, chat, showProcess, fileTypes, ...props }: Props): JSX.Element;
+export default function MessageBox({ className, bot, user, input, showProcess, ...props }: Props): JSX.Element;
 export {};

package/types/components/message-box/input-box.d.ts

@@ -4,8 +4,9 @@ import { ChatOptions } from '../../hooks/use-chat';
 interface Props {
     chat: ChatOptions;
     fileTypes?: string[];
+    minRows?: number;
     scrollRef: MutableRefObject<HTMLDivElement | null>;
     onMessages: (messages: Message[]) => void;
 }
-export default function ({ chat, fileTypes, scrollRef, onMessages }: Props): JSX.Element;
+export default function ({ chat, fileTypes, scrollRef, onMessages, minRows }: Props): JSX.Element;
 export {};

package/types/components/message-box/message-item.d.ts

@@ -2,8 +2,15 @@
 import { Message, ShowProcess } from '../../types';
 interface Props {
     message: Message;
-    avatar: string;
+    bot: {
+        name: string;
+        avatar: string;
+    };
+    user?: {
+        name: string;
+        avatar: string;
+    };
     showProcess?: ShowProcess;
 }
-declare const MessageItem: import("react").MemoExoticComponent<({ avatar, message, showProcess }: Props) => JSX.Element>;
+declare const MessageItem: import("react").MemoExoticComponent<({ bot, user, message, showProcess }: Props) => JSX.Element>;
 export default MessageItem;

package/types/hooks/use-chat.d.ts

@@ -9,8 +9,10 @@ export interface ChatOptions {
         prologue: string;
         questions: string[];
     };
-    messages?: Message[];
-    conversation?: string;
+    conversation?: {
+        id: string;
+        messages: Message[];
+    };
     ref?: MutableRefObject<Chat | null>;
 }
 export default function useChat({ url, transformRequest, onboarding, onSuccess, ref, ...props }: ChatOptions): {

package/types/components/lightbox/Image.d.ts

@@ -1,2 +0,0 @@
-import { ImgHTMLAttributes } from 'react';
-export default function Image(props: ImgHTMLAttributes<HTMLImageElement>): JSX.Element;

package/types/components/lightbox/index.d.ts

@@ -1,16 +0,0 @@
-import { Dispatch, ReactNode, SetStateAction } from 'react';
-import 'yet-another-react-lightbox/styles.css';
-import 'yet-another-react-lightbox/plugins/counter.css';
-interface ImageContextType {
-    images: Map<number, string>;
-    current: number | undefined;
-    setCurrent: Dispatch<SetStateAction<number | undefined>>;
-    setShow: Dispatch<SetStateAction<boolean>>;
-    registerImage: (id: number, url: string) => () => void;
-}
-export declare const ImageContext: import("react").Context<ImageContextType>;
-interface Props {
-    children: ReactNode;
-}
-export default function Lightbox({ children }: Props): JSX.Element;
-export {};