softchatjs-react
Version:
Install the softchat-js SDKs
2 lines • 2.79 kB
JavaScript
import y from"emoji-picker-react";import C from"./emoji.module.module.css";import{CiFaceSmile as b}from"react-icons/ci";import{BsReply as x}from"react-icons/bs";import{AiOutlineDelete as j}from"react-icons/ai";import{createContext as f,useContext as S}from"react";import{createContext as v,useContext as D,useState as A}from"react";import{jsx as w}from"react/jsx-runtime";var k=v({activeConversation:null,setActiveConversation:()=>{},conversations:[],setConversations:()=>{},showImageModal:[],setShowImageModal:()=>{},connectionStatus:{isConnected:!1,fetchingConversations:!1,connecting:!1},setConnectionStatus:()=>{}});var g={background:{primary:"#1b1d21",secondary:"#202326",disabled:"#E0E0E0"},text:{primary:"white",secondary:"#4A4A4A",disabled:"#9E9E9E"},action:{primary:"#007AFF",secondary:"#5AA3FF"},chatBubble:{left:{bgColor:"#343434",messageColor:"white",messageTimeColor:"#6D6D6D",replyBorderColor:"#D1D1D6"},right:{bgColor:"#343434",messageColor:"white",messageTimeColor:"#6D6D6D",replyBorderColor:"#A3D1FF"}},icon:"white",divider:"rgba(128, 128, 128, 0.136)",hideDivider:!1,input:{bgColor:"#1b1d21",textColor:"white",emojiPickerTheme:"dark"}};import{jsx as L}from"react/jsx-runtime";var P=f({config:{theme:g},client:null}),m=()=>S(P);import{FiEdit2 as R}from"react-icons/fi";import{jsx as o}from"react/jsx-runtime";var E=["\u{1F44D}","\u{1F614}","\u{1F642}","\u{1F62E}","\u{1F603}"],W=n=>{let{client:e,message:i,conversationId:s,recipientId:d,setShowEmojiPanel:h}=n,{config:a}=m(),r=a?.theme?.background?.secondary||"#222529",p=({emoji:t})=>{e.messageClient(s).reactToMessage({conversationId:s,messageId:i.messageId,reactions:[{emoji:t,uid:e.chatUserId}],to:d}),h(!1)};return o("div",{ref:n.emojiPickerRef,style:{background:r},className:C.emoji,children:E.map((t,c)=>o("div",{onClick:()=>p({emoji:t}),className:C.reaction__emoji,children:t},c))})},Y=({setEditDetails:n,message:e,closeOptionsMenu:i,textInputRef:s,openEmojiPanel:d,client:h,canEdit:a,conversationId:r})=>{let{config:p}=m(),t=p.theme?.icon||"#72767D",c=[{emoji:o(R,{size:16,color:t}),onPress:()=>{n({message:e,isEditing:!0}),i()},enabled:a},{emoji:o(b,{size:16,color:t}),onPress:()=>{d()},enabled:!0},{emoji:o(x,{size:16,color:t}),onPress:()=>{n({message:e,isReplying:!0}),i(),s.current?.focus()},enabled:!0},{emoji:o(j,{size:16,color:t}),onPress:()=>{h.messageClient(r).deleteMessage(e.messageId,e.to,r)},enabled:a}];return o("div",{className:C.reactions,children:c.map((l,u)=>{if(l.enabled)return o("div",{onClick:l.onPress,className:C.reaction__emoji,children:l.emoji},u)})})},Z=({onEmojiPick:n})=>{let{config:e}=m();return o(y,{height:350,width:300,onEmojiClick:i=>{n(i.emoji)},theme:e?.theme?.input?.emojiPickerTheme})};export{W as EmojiPanel,Z as InputEmojis,Y as ReactionPanel};
//# sourceMappingURL=index.mjs.map