@bothub-chat/ui 2.27.2 → 2.27.3-develop-9c0f569c-518b-485e-b511-4e17887f9c4f
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as e,__awaiter as t}from"tslib";import{jsx as n,jsxs as r,Fragment as
|
|
1
|
+
import{__rest as e,__awaiter as t}from"tslib";import{jsx as n,jsxs as r,Fragment as i}from"react/jsx-runtime";import{useRef as l,useState as o,useCallback as a,useEffect as c,useLayoutEffect as s}from"react";import{useTransition as d}from"@react-spring/web";import{useOnClickOutside as u}from"../../utils/useOnClickOutside.js";import{InputMessageStyled as p,InputMessageContent as m,InputMessageUploadFile as v,InputMessageUploadFileInput as f,InputMessageUploadFileButton as h,InputMessageMain as g,InputMessageVoiceRecord as y,InputMessageVoiceRecordDot as b,InputMessageVoiceRecordTimeText as x,InputMessageFiles as j,InputMessageFile as D,InputMessageTextArea as $,InputMessageToggleSendStyled as w,InputMessageToggleSendButton as A,InputMessageToggleSendModalStyled as C,InputMessageToggleSendModalOption as k,InputMessageSendButton as F,InputMessageSendIcon as E,InputMessageVoiceIcon as T}from"./styled.js";import{ChipImage as P}from"../chip/styled.js";import"react-dom";import"../portal/styled.js";import"../tooltip/styled.js";import"../tooltip/arrow/styled.js";import"../../theme/index.js";import"../tooltip/context.js";import{PdfIcon as S}from"../../icons/pdf/index.js";import{TxtIcon as K}from"../../icons/txt/index.js";import{WordIcon as L}from"../../icons/word/index.js";import{XlsIcon as O}from"../../icons/xls/index.js";import{IconProvider as U}from"../icon/context.js";import"../icon/styled.js";import{getPreviewUrlForFile as V,formatUploadFiles as B,formatSeconds as H}from"./utils.js";import{AttachFileIcon as I}from"../../icons/attach-file/index.js";import{getSupportedAudioMimeType as N}from"../../utils/getSupportedAudioMimeType.js";import{useTheme as M}from"../../theme/hook.js";const R=R=>{var{className:z,placeholder:G,message:W,files:_,disabled:q=!1,sendDisabled:J=!1,textAreaDisabled:Q=!1,useAlternativeKeyDefaultValue:X=!1,defaultKeySendText:Y,alternativeKeySendText:Z,uploadFileLimit:ee=5,hideUploadFile:te=!1,uploadFileDisabled:ne=!1,uploadFileAccept:re,autoFocus:ie=!0,voice:le=!1,onSetAlternativeKeyValue:oe,onChange:ae,onFilesChange:ce,onTextAreaChange:se,onSend:de,onFocus:ue,onBlur:pe,onVoice:me,emitError:ve,rightActions:fe}=R,he=e(R,["className","placeholder","message","files","disabled","sendDisabled","textAreaDisabled","useAlternativeKeyDefaultValue","defaultKeySendText","alternativeKeySendText","uploadFileLimit","hideUploadFile","uploadFileDisabled","uploadFileAccept","autoFocus","voice","onSetAlternativeKeyValue","onChange","onFilesChange","onTextAreaChange","onSend","onFocus","onBlur","onVoice","emitError","rightActions"]);const ge=M(),ye=l(null),[be,xe]=o("calc(var(--bothub-scale, 1) * 18px)"),[je,De]="string"==typeof W?[W,ae]:o(""),[$e,we]=Array.isArray(_)?[_,ce]:o([]),[Ae,Ce]=o(!q&&ie),[ke,Fe]=o(!1),[Ee,Te]=o(!1),[Pe,Se]=o(null),Ke=l(null),Le=l(null),Oe=l([]),Ue=l(null),Ve=l(!1),Be=l(null),[He,Ie]=o(X),[Ne,Me]=o(!1),Re=a((()=>{Ie(!1),null==oe||oe(!1),Me(!1)}),[]),ze=a((()=>{Ie(!0),null==oe||oe(!0),Me(!1)}),[]),Ge=a((e=>{Ce(!0),null==ue||ue(e)}),[ue]),We=a((e=>{Ce(!1),null==pe||pe(e)}),[pe]),_e=a((e=>{null==De||De(e.target.value),null==se||se(e)}),[De,se]),qe=a((e=>{const t=ye.current;null!==t&&(t.style.height="calc(var(--bothub-scale, 1) * 18px)",t.style.height=`${e.currentTarget.scrollHeight}px`,t.focus(),xe(`${e.currentTarget.scrollHeight}px`))}),[]),Je=a((e=>t(void 0,void 0,void 0,(function*(){var t;if(!e.length)return;const n=[],r=[],i=yield Promise.all(null==e?void 0:e.map(V));for(const[l,o]of e.entries()){null===(t=null==re?void 0:re.includes(o.type))||void 0===t||t?n.push({previewUrl:i[l],name:o.name,native:o}):r.push(o)}r.length>0&&(null==ve||ve({name:"WRONG_FILES",payload:r})),(null==n?void 0:n.length)>0&&(null==we||we([...$e,...n].slice(0,ee)))}))),[re,ve,ee,$e]),Qe=a((e=>t(void 0,void 0,void 0,(function*(){!ne&&e.clipboardData.files.length>0&&(e.preventDefault(),yield Je([...e.clipboardData.files]))}))),[Je,ne]),Xe=a((e=>t(void 0,void 0,void 0,(function*(){if(!we||!e.target.files)return;const t=yield B([...$e.map((({native:e})=>e)),...e.target.files]);we(t.slice(0,ee))}))),[$e,we,ee]),Ye=a((e=>{null==we||we($e.filter((({name:t})=>t!==e.name)))}),[we,$e]),Ze=a((e=>{e.stopPropagation(),null==de||de(je,$e),xe("calc(var(--bothub-scale, 1) * 18px)")}),[je,$e,de,De,we]),et=a((e=>{e.stopPropagation();const t=He?"enter":"ctrl/shift+enter";let n="";if("Enter"===e.key&&(e.shiftKey||e.ctrlKey))n="ctrl/shift+enter";else{if("Enter"!==e.key)return;n="enter"}if(Ae&&"Enter"===e.key){if(n===t&&e.ctrlKey){e.preventDefault();const t=ye.current;if(!t)return;const n=t.value,l=t.selectionStart,o=n.slice(0,l),a=n.slice(l);null==De||De(`${o}\n${a}`),r=t,i=l+1,setTimeout((()=>{r.selectionStart=i,r.selectionEnd=i}),1)}t!==n&&""!==n&&(e.preventDefault(),null==de||de(je,$e),xe("calc(var(--bothub-scale, 1) * 18px)"))}var r,i}),[Ae,je,$e,de,De,we]),tt=a((()=>{var e;null===(e=ye.current)||void 0===e||e.focus()}),[]),nt=a((e=>{e.stopPropagation()}),[]),rt=a((e=>{e.preventDefault(),e.stopPropagation()}),[]),it=a((e=>t(void 0,void 0,void 0,(function*(){if(Ee)return;Ve.current=!0,e.stopPropagation();const t=yield navigator.mediaDevices.getUserMedia({audio:!0}),n=new MediaRecorder(t,{mimeType:N()});Ve.current&&(n.start(1e3),Ke.current=n,Le.current=t,Ue.current=window.setInterval((()=>{Se((e=>(null!=e?e:0)+.1))}),100),Te(!0),Se(0))}))),[Ve.current,Oe.current,Ee]),lt=a((()=>{const e=Ke.current,t=Le.current,n=Ue.current;if(Ee&&e&&t&&n){e.stop();for(const e of t.getTracks())e.stop();window.clearInterval(n)}}),[Ee,Ke.current,Le.current,Ue.current]),ot=a((()=>t(void 0,void 0,void 0,(function*(){Ve.current=!1,Ee&<()}))),[Ee,lt]);c((()=>{const e=ye.current,t=document.activeElement===e;e&&ie?e.focus():t||Ce(!1)}),[q]),c((()=>{const e=ye.current;if(null!==e)return e.addEventListener("keydown",et),()=>{e.removeEventListener("keydown",et)}}),[et]),c((()=>{we&&_&&we(_)}),[_]),"undefined"!=typeof window&&s((()=>{const e=ye.current;null!==e&&(e.style.height=`${e.scrollHeight}px`,e.scrollTop=e.scrollHeight,ie&&e.focus())}),[je,ie]),c((()=>{const e=Ke.current,n=e=>{e.data.size>0&&Oe.current.push(e.data)},r=()=>t(void 0,void 0,void 0,(function*(){const e=new Blob(Oe.current,{type:N()});yield null==me?void 0:me(e),Ke.current=null,Le.current=null,Oe.current=[],Ue.current=null,Te(!1),Se(null)}));return e&&(e.addEventListener("dataavailable",n),e.addEventListener("stop",r)),()=>{e&&(e.removeEventListener("dataavailable",n),e.removeEventListener("stop",r)),lt()}}),[Ke.current]),u(Be,(()=>{Me(!1)}));const at=d(Ne,{from:{opacity:0,y:10},enter:{opacity:1,y:0},leave:{opacity:0,y:10},config:{duration:150,ease:"easeOut"}});return n(p,{$active:Ae,$dragActive:ke,$disabled:q,$textAreaDisabled:Q,$voiceRecording:Ee,className:z,onClick:tt,onDragEnter:()=>Fe(!0),onDragLeave:()=>Fe(!1),onDragOver:e=>(e.stopPropagation(),e.preventDefault(),!1),onDrop:e=>t(void 0,void 0,void 0,(function*(){if(e.dataTransfer.files.length>0)return e.stopPropagation(),e.preventDefault(),yield Je([...e.dataTransfer.files]),Fe(!1),!1})),children:r(m,{children:[!te&&!Ee&&r(v,{onClick:nt,children:[n(f,{type:"file",accept:re,multiple:!0,disabled:$e.length>=ee||q||ne,onChange:Xe},$e.length),n(h,{disabled:$e.length>=ee||q||ne})]}),r(g,{children:[Ee&&null!==Pe&&r(y,{children:[n(b,{}),n(x,{children:H(Pe)})]}),!Ee&&r(i,{children:[$e.length>0&&n(j,{children:$e.map((e=>{let t;return t=e.previewUrl&&(e.name.match(/.png$/i)||e.name.match(/.jpg$/i)||e.name.match(/.jpeg$/i))?n(P,{src:e.previewUrl}):e.name.match(/.txt$/i)?n(K,{}):e.name.match(/.docx$/i)?n(L,{}):e.name.match(/.xlsx$/i)?n(O,{}):e.name.match(/.pdf$/i)?n(S,{}):n(I,{}),t=n(U,{size:18,children:t}),n(D,{start:t,onDelete:Ye.bind(null,e),children:e.name.length>20?`...${e.name.slice(-20)}`:e.name},e.name)}))}),(!Q||Q&&G&&$e.length!==ee||Q&&je)&&n($,Object.assign({$disabled:q},he,{ref:ye,value:je,placeholder:G,disabled:q||Q,style:Object.assign(Object.assign({},he.style),{height:be}),onFocus:Ge,onBlur:We,onChange:_e,onInput:qe,onPaste:Qe}))]})]}),!!Y&&!!Z&&r(w,{ref:Be,children:[n(A,{onClick:e=>{e.stopPropagation(),Me(!Ne)},disabled:q}),at(((e,t)=>t&&r(C,{style:e,children:[n(k,{active:!He,onClick:Re,children:Y}),n(k,{active:He,onClick:ze,children:Z})]},"alternative-key-modal")))]}),fe,!le||je||$e.length>0?n(F,{disabled:q||J,onClick:Ze,children:n(E,{})}):n(F,Object.assign({},Ee&&{color:ge.colors.critic},{disabled:q||J,onPointerDown:it,onPointerUp:ot,onPointerCancel:ot,onClick:rt,children:n(Ee?E:T,{})}))]})})};export{R as InputMessage};
|