@bothub-chat/ui 2.39.0 → 2.39.1

package/dist/components/index.d.ts

@@ -64,3 +64,7 @@ export * from './date-badge';
 export * from './slider';
 export * from './scrollable-tabs';
 export * from './badge-select-dropdown';
+export * from './theme-cards';
+export * from './theme-schemes';
+export * from './theme-preview';
+export * from './color-picker';

package/dist/components/input-message/index.js

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