mr-chat-bird 1.0.24 → 1.0.25
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/dist/index.css +1 -1
- package/dist/index.js +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.mrchat-richTextEditorContainer{position:relative;border-radius:16px}.mrchat-richTextEditorContainer .mantine-RichTextEditor-toolbar{border:none;background-color:transparent;padding:0;margin-bottom:4px;margin-left:3px;gap:.5rem}.mrchat-richTextEditorContainer .emoji-big{font-size:18px;line-height:1;vertical-align:middle;display:inline-block}.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography{font-size:15px}.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography,.mrchat-richTextEditorContainer .mantine-RichTextEditor-content{border-radius:16px;min-height:41px;max-height:200px;overflow:scroll}.mrchat-richTextEditorContainer .ProseMirror{padding:12px 16px 4px;overflow-wrap:anywhere;word-break:break-word}.mrchat-mainActionContainer{height:24px;margin-bottom:4px}.mrchat-mainActionAddIcon{margin-left:3px}.mrchat-mainActionEmojiIcon{margin:0 4px 0 3px}.mrchat-mainActionEmojiIcon svg{padding:2px;color:var(--mantine-color-text)}.mrchat-mainActionAddIcon svg{color:var(--mantine-color-text)}.mrchat-mainTextFormatIcon svg{position:relative;top:1.2px;padding:.7px;color:var(--mantine-color-text)}.mrchat-mainSendMsgIcon{position:absolute;right:6px}.mrchat-sm-mainSendMsgIcon{display:none;position:absolute;right:4px;bottom:1.5px}.mrchat-customToolActionItem{background-color:var(--mantine-color-body);border-color:var(--mantine-color-default-border);color:var(--mantine-color-text);border-radius:0;height:26px;min-height:26px;border-right:none}.mrchat-mainAddLabels{font-size:15px}.mrchat-mainAddLabels svg{width:19px;height:19px}@media(max-width:950px){.mrchat-secondRichTextEditorToolBar{display:none}}@media(max-width:475px){.mrchat-mainActionContainer{display:none}.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography,.mrchat-richTextEditorContainer .mantine-RichTextEditor-content{min-height:30px;border-radius:12px}.mrchat-richTextEditorContainer{border-radius:12px}.mrchat-richTextEditorContainer .ProseMirror{padding:8px 12px 4px}.mrchat-sm-mainSendMsgIcon{display:block}}:where([data-mantine-color-scheme=dark]) .mantine-RichTextEditor-control{background-color:var(--mantine-color-body)}.mrchat-messageScroll{height:100%;overflow-y:auto}.mrchat-messageScrollContent{padding:16px 16px 10px}@media(max-width:599px){.mrchat-messageScrollContent{padding:4px 4px 10px}}.mrchat-overlay{position:absolute;inset:0;background:#0000004d;z-index:50}.mrchat-drawer{position:absolute;top:0;right:0;width:100%;max-width:400px;height:100%;background:var(--mantine-color-body);color:var(--mantine-color-text);display:flex;flex-direction:column}.mrchat-open{animation:slideIn .25s ease forwards}.mrchat-close{animation:slideOut .25s ease forwards}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideOut{0%{transform:translate(0)}to{transform:translate(100%)}}.mrchat-header{height:60px;display:flex;align-items:center;gap:15px;padding:0 16px;border-bottom:1px solid var(--mantine-color-default-border)}.mrchat-backBtn{cursor:pointer;display:flex;align-items:center;color:var(--mantine-color-text)}.mrchat-profileSection{padding:30px 20px;border-bottom:1px solid var(--mantine-color-default-border);display:flex;flex-direction:column;align-items:center;text-align:center}.mrchat-actions{padding:10px}.mrchat-item{display:flex;align-items:center;gap:12px;padding:14px;border-radius:10px;cursor:pointer;color:var(--mantine-color-text)}.mrchat-item:hover{background:var(--mantine-color-default-hover)}.mrchat-itemDanger{color:var(--mantine-color-red-filled)}.mrchat-itemDanger:hover{background-color:color-mix(in srgb,var(--mantine-color-red-filled) 12%,transparent)}.mrchat-imagePreview{position:fixed;inset:0;background:#000;z-index:100;display:flex;justify-content:center;align-items:center}.mrchat-imagePreview img{max-width:90%;max-height:90%;border-radius:12px}.mrchat-chatWrapper{display:flex;flex-direction:column;align-items:
|
|
1
|
+
.mrchat-richTextEditorContainer{position:relative;border-radius:16px}.mrchat-richTextEditorContainer .mantine-RichTextEditor-toolbar{border:none;background-color:transparent;padding:0;margin-bottom:4px;margin-left:3px;gap:.5rem}.mrchat-richTextEditorContainer .emoji-big{font-size:18px;line-height:1;vertical-align:middle;display:inline-block}.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography{font-size:15px}.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography,.mrchat-richTextEditorContainer .mantine-RichTextEditor-content{border-radius:16px;min-height:41px;max-height:200px;overflow:scroll}.mrchat-richTextEditorContainer .ProseMirror{padding:12px 16px 4px;overflow-wrap:anywhere;word-break:break-word}.mrchat-mainActionContainer{height:24px;margin-bottom:4px}.mrchat-mainActionAddIcon{margin-left:3px}.mrchat-mainActionEmojiIcon{margin:0 4px 0 3px}.mrchat-mainActionEmojiIcon svg{padding:2px;color:var(--mantine-color-text)}.mrchat-mainActionAddIcon svg{color:var(--mantine-color-text)}.mrchat-mainTextFormatIcon svg{position:relative;top:1.2px;padding:.7px;color:var(--mantine-color-text)}.mrchat-mainSendMsgIcon{position:absolute;right:6px}.mrchat-sm-mainSendMsgIcon{display:none;position:absolute;right:4px;bottom:1.5px}.mrchat-customToolActionItem{background-color:var(--mantine-color-body);border-color:var(--mantine-color-default-border);color:var(--mantine-color-text);border-radius:0;height:26px;min-height:26px;border-right:none}.mrchat-mainAddLabels{font-size:15px}.mrchat-mainAddLabels svg{width:19px;height:19px}@media(max-width:950px){.mrchat-secondRichTextEditorToolBar{display:none}}@media(max-width:475px){.mrchat-mainActionContainer{display:none}.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography,.mrchat-richTextEditorContainer .mantine-RichTextEditor-content{min-height:30px;border-radius:12px}.mrchat-richTextEditorContainer{border-radius:12px}.mrchat-richTextEditorContainer .ProseMirror{padding:8px 12px 4px}.mrchat-sm-mainSendMsgIcon{display:block}}:where([data-mantine-color-scheme=dark]) .mantine-RichTextEditor-control{background-color:var(--mantine-color-body)}.mrchat-messageScroll{height:100%;overflow-y:auto}.mrchat-messageScrollContent{padding:16px 16px 10px}@media(max-width:599px){.mrchat-messageScrollContent{padding:4px 4px 10px}}.mrchat-overlay{position:absolute;inset:0;background:#0000004d;z-index:50}.mrchat-drawer{position:absolute;top:0;right:0;width:100%;max-width:400px;height:100%;background:var(--mantine-color-body);color:var(--mantine-color-text);display:flex;flex-direction:column}.mrchat-open{animation:slideIn .25s ease forwards}.mrchat-close{animation:slideOut .25s ease forwards}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideOut{0%{transform:translate(0)}to{transform:translate(100%)}}.mrchat-header{height:60px;display:flex;align-items:center;gap:15px;padding:0 16px;border-bottom:1px solid var(--mantine-color-default-border)}.mrchat-backBtn{cursor:pointer;display:flex;align-items:center;color:var(--mantine-color-text)}.mrchat-profileSection{padding:30px 20px;border-bottom:1px solid var(--mantine-color-default-border);display:flex;flex-direction:column;align-items:center;text-align:center}.mrchat-actions{padding:10px}.mrchat-item{display:flex;align-items:center;gap:12px;padding:14px;border-radius:10px;cursor:pointer;color:var(--mantine-color-text)}.mrchat-item:hover{background:var(--mantine-color-default-hover)}.mrchat-itemDanger{color:var(--mantine-color-red-filled)}.mrchat-itemDanger:hover{background-color:color-mix(in srgb,var(--mantine-color-red-filled) 12%,transparent)}.mrchat-imagePreview{position:fixed;inset:0;background:#000;z-index:100;display:flex;justify-content:center;align-items:center}.mrchat-imagePreview img{max-width:90%;max-height:90%;border-radius:12px}.mrchat-chatWrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;flex:1;min-height:0;padding:16px;box-sizing:border-box;background-color:var(--mantine-color-body);color:var(--mantine-color-text);position:relative;overflow:hidden}.mrchat-loadingOverlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background-color:#ffffffb3;backdrop-filter:blur(.5px)}[data-mantine-color-scheme=dark] .mrchat-loadingOverlay{background-color:#00000073}.mrchat-chatContainer{display:flex;width:100%;max-width:1260px;height:calc(100% - 32px);flex:1;min-height:0;overflow:hidden;border-radius:12px;background-color:var(--mantine-color-body);border:1px solid color-mix(in srgb,var(--mantine-color-text) 12%,transparent);box-shadow:0 4px 20px #00000014}.mrchat-sidebar{width:280px;display:flex;flex-direction:column;flex-shrink:0;height:100%;min-height:0;border-right:1px solid color-mix(in srgb,var(--mantine-color-text) 12%,transparent);padding-top:12px;background-color:var(--mantine-color-body);overflow:hidden}.mrchat-sidebarTop{padding:0 12px}.mrchat-topBar{display:flex;justify-content:space-between;align-items:center}.mrchat-topActions{display:flex;align-items:center;gap:10px}.mrchat-scrollWrapper{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.mrchat-mainAreaWrapper{display:flex;flex:1;min-height:0;overflow:hidden}.mrchat-hiddenOnMobile{display:none!important}.mrchat-scrollArea{flex:1;min-height:0;overflow-y:auto}.mrchat-scrollArea .mantine-ScrollArea-content{padding-bottom:60px}.mrchat-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover}.mrchat-mainArea{display:flex;flex-direction:column;flex:1;height:100%;min-height:0;overflow:hidden}.mrchat-messageArea{flex:1;min-height:0;overflow:hidden;padding:0;display:flex;flex-direction:column}.mrchat-messageContentWrapper{padding:16px 16px 10px}.mrchat-messageBubble{width:fit-content;max-width:90%;min-width:0;padding:6px 45px 6px 12px;margin-bottom:4px;position:relative}.mrchat-outgoing{margin-left:auto;background:color-mix(in srgb,var(--mantine-primary-color-filled) 18%,var(--mantine-color-body));color:var(--mantine-color-text);border:1px solid color-mix(in srgb,var(--mantine-primary-color-filled) 15%,transparent)}.mrchat-incoming{margin-right:auto;color:var(--mantine-color-text);background:color-mix(in srgb,var(--mantine-color-gray-0) 85%,var(--mantine-color-body));border:1px solid color-mix(in srgb,var(--mantine-color-text) 7%,transparent)}.mrchat-inputBar{display:flex;align-items:end;gap:8px;padding:8px}.mrchat-chatItem{display:flex;align-items:center;gap:6px;padding:6px 8px;cursor:pointer;transition:background .2s;margin:2px 4px;border:1px solid transparent;border-radius:6px;color:var(--mantine-color-text)}.mrchat-chatItem:hover{background-color:var(--mantine-color-default-hover)}.mrchat-chatLabelItem{font-size:15px}.mrchat-chatHeader{display:flex;justify-content:flex-start;align-items:center;padding:12px 16px;border-bottom:1px solid color-mix(in srgb,var(--mantine-color-text) 12%,transparent);position:sticky;top:0;z-index:2;min-height:63px;gap:10px}.mrchat-backButton{padding:4px}.mrchat-receiverInfo{display:flex;align-items:center;gap:12px;cursor:pointer}.mrchat-emptyState{height:100%;display:flex;align-items:center;justify-content:center}.mrchat-encryptionMinimal{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:12px;background:var(--mantine-color-default-hover);color:var(--mantine-color-dimmed);font-size:12px}.mrchat-encryptionText{font-size:16px;margin-left:3px}.mrchat-messageContent{max-width:370px;word-wrap:break-word;font-size:14px}.mrchat-messagePreviewContent p,.mrchat-messageContent p{margin:0;padding:0}.mrchat-activeChatItem{background:color-mix(in srgb,var(--mantine-primary-color-filled) 14%,var(--mantine-color-body));border:1px solid color-mix(in srgb,var(--mantine-primary-color-filled) 15%,transparent)}.mrchat-activeChatItem:hover{background:color-mix(in srgb,var(--mantine-primary-color-filled) 18%,var(--mantine-color-body))}.mrchat-chatItem:hover:not(.mrchat-activeChatItem){background:color-mix(in srgb,var(--mantine-primary-color-filled) 14%,var(--mantine-color-body))}.mrchat-messageTime{font-size:11px;opacity:.6;text-align:right;margin-top:4px;position:absolute;bottom:4px;right:8px;z-index:1}.mrchat-dateSeparator{text-align:center;font-size:13px;margin:12px 0;color:#888}.mrchat-chatInfo{width:100%;position:relative}.mrchat-messagePreview{display:flex;justify-content:space-between;align-items:end;margin-top:1px}.mrchat-messagePreviewTime{position:relative;top:1px;right:0}.mrchat-unreadBadge{background:var(--mantine-primary-color-filled);color:var(--mantine-color-white);font-size:10px;border-radius:50%;padding:3px 5px;min-width:18px;text-align:center;position:absolute;top:1px;right:0}.mrchat-messagePreviewContent{font-size:14px}@media(max-width:599px){.mrchat-chatHeader{min-height:50px;padding:6px}.mrchat-chatContainer{flex-direction:column;min-height:0;height:calc(100% - 16px);border-radius:8px}.mrchat-chatWrapper{padding:8px}.mrchat-sidebar{width:100%;height:100%;min-height:0;border-right:none;border-bottom:1px solid color-mix(in srgb,var(--mantine-color-text) 12%,transparent)}.mrchat-mainAreaWrapper{flex:1;min-height:0}.mrchat-mainArea{flex:1;min-height:0;height:100%}.mrchat-messageArea{flex:1;min-height:0;padding:0}.mrchat-chatItem{margin:2px}.mrchat-activeChatItem,.mrchat-activeChatItem:hover{background:transparent;border-left:none}.mrchat-chatItem:hover{background:var(--mantine-color-default-hover)}}
|
package/dist/index.js
CHANGED
|
@@ -18,4 +18,4 @@ ${g}
|
|
|
18
18
|
`);a+=c.type==="paragraph"?`
|
|
19
19
|
|
|
20
20
|
${h}`:`
|
|
21
|
-
${h}`}}),a}function pi(e,t,n={}){let{state:r}=t,{doc:o,tr:s}=r,i=e;o.descendants((l,a)=>{let c=s.mapping.map(a),m=s.mapping.map(a)+l.nodeSize,d=null;if(l.marks.forEach(u=>{if(u!==i)return!1;d=u}),!d)return;let p=!1;if(Object.keys(n).forEach(u=>{n[u]!==d.attrs[u]&&(p=!0)}),p){let u=e.type.create({...e.attrs,...n});s.removeMark(c,m,e.type),s.addMark(c,m,u)}}),s.docChanged&&t.view.dispatch(s)}var tr=class nr extends pt{constructor(){super(...arguments),this.type="node"}static create(t={}){let n=typeof t=="function"?t():t;return new nr(n)}configure(t){return super.configure(t)}extend(t){let n=typeof t=="function"?t():t;return super.extend(n)}};var hi=ft.create({name:"underline",addOptions(){return{HTMLAttributes:{}}},parseHTML(){return[{tag:"u"},{style:"text-decoration",consuming:!1,getAttrs:e=>e.includes("underline")?{}:!1}]},renderHTML({HTMLAttributes:e}){return["u",Me(this.options.HTMLAttributes,e),0]},parseMarkdown(e,t){return t.applyMark(this.name||"underline",t.parseInline(e.tokens||[]))},renderMarkdown(e,t){return`++${t.renderChildren(e)}++`},markdownTokenizer:{name:"underline",level:"inline",start(e){return e.indexOf("++")},tokenize(e,t,n){let o=/^(\+\+)([\s\S]+?)(\+\+)/.exec(e);if(!o)return;let s=o[2].trim();return{type:"underline",raw:o[0],text:s,tokens:n.inlineTokens(s)}}},addCommands(){return{setUnderline:()=>({commands:e})=>e.setMark(this.name),toggleUnderline:()=>({commands:e})=>e.toggleMark(this.name),unsetUnderline:()=>({commands:e})=>e.unsetMark(this.name)}},addKeyboardShortcuts(){return{"Mod-u":()=>this.editor.commands.toggleUnderline(),"Mod-U":()=>this.editor.commands.toggleUnderline()}}}),rr=hi;var dr=require("@tiptap/react"),ur=H(require("@tiptap/starter-kit")),U=require("@mantine/tiptap"),J=require("@mantine/core");var W=H(require("react")),pe=require("@mantine/core"),or=H(require("@emoji-mart/data")),gi=(0,W.lazy)(()=>import("@emoji-mart/react"));function yt({onSelect:e,action:t,size:n=320,offset:r=8,position:o="bottom-start",colorScheme:s="light"}){let[i,l]=(0,W.useState)(!1);return W.default.createElement(pe.Popover,{opened:i,onChange:l,width:n,position:o,offset:r,withArrow:!0,shadow:"md",trapFocus:!1,closeOnEscape:!0},W.default.createElement(pe.Popover.Target,null,(0,W.cloneElement)(t,{onClick:a=>{t.props?.onClick?.(a),l(c=>!c)}})),W.default.createElement(pe.Popover.Dropdown,{p:0},W.default.createElement(W.Suspense,{fallback:W.default.createElement("div",{style:{padding:12,width:320}},W.default.createElement(pe.Skeleton,{height:280,radius:"md"}))},W.default.createElement(gi,{previewPosition:"none",theme:s,data:or.default,onEmojiSelect:a=>{e(a.native),l(!1)}}))))}var sr=tr.create({name:"emoji",inline:!0,group:"inline",selectable:!1,atom:!0,addAttributes(){return{emoji:{default:"\u{1F600}"}}},parseHTML(){return[{tag:"span[data-emoji]"}]},renderHTML({HTMLAttributes:e}){return["span",Me(e,{class:"emoji-big","data-emoji":e.emoji}),e.emoji]}});function xt({content:e="",maxLength:t=3e3,onChange:n,onSubmit:r,colorScheme:o="light"}){let[s,i]=(0,M.useState)(0),[l,a]=(0,M.useState)(!1),[c,m]=(0,M.useState)(!1),[d,p]=(0,M.useState)(!1),u=()=>{if(!f)return;let g=f.getHTML();f.getText().trim()&&(r?.(g),f.commands.clearContent(),f.commands.focus(),i(0),a(!1))},h=(g,v)=>v.key==="Enter"&&!v.shiftKey?(v.preventDefault(),u(),!0):v.key==="Enter"&&v.shiftKey?(v.preventDefault(),f?.commands.setHardBreak(),!0):!1,f=(0,dr.useEditor)({extensions:[ur.default,sr,rr,U.Link,cr.default,ar.default,ir.default,lr.default.configure({types:["heading","paragraph"]})],content:e,editorProps:{handleKeyDown:h},onUpdate:({editor:g})=>{let v=g.getHTML(),y=v.replace(/(<br\s*\/?>\s*){3,}/g,"<br><br>");if(y!==v){let{from:T,to:E}=g.state.selection;g.commands.setContent(y),g.commands.setTextSelection({from:Math.min(T,g.state.doc.content.size),to:Math.min(E,g.state.doc.content.size)});return}let S=g.getText(),C=S.trim().length>0;i(S.length),a(C),m(t?S.length>=t:!1),n?.(g.getHTML())},immediatelyRender:!1});return M.default.createElement(M.default.Fragment,null,M.default.createElement(U.RichTextEditor,{editor:f,w:"100%",className:"mrchat-richTextEditorContainer"},M.default.createElement(U.RichTextEditor.Content,null),M.default.createElement(U.RichTextEditor.Toolbar,{sticky:!0,stickyOffset:"var(--docs-header-height)"},M.default.createElement("div",{className:"mrchat-mainActionContainer"},M.default.createElement(yt,{colorScheme:o,onSelect:g=>{f?.chain().focus().insertContent({type:"emoji",attrs:{emoji:g}}).run()},action:M.default.createElement(J.ActionIcon,{radius:"lg",variant:"subtle","aria-label":"add",className:"mrchat-mainActionEmojiIcon"},M.default.createElement(K.IconMoodPlus,null))}),M.default.createElement(J.ActionIcon,{radius:"lg",variant:"subtle","aria-label":"text_format",className:"mrchat-mainTextFormatIcon",onClick:()=>p(g=>!g)},M.default.createElement(K.IconTextColor,{stroke:1.7})),M.default.createElement(J.ActionIcon,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-mainSendMsgIcon",onClick:u,disabled:!l},M.default.createElement(K.IconSend,{size:18}))),M.default.createElement(J.ActionIcon,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-sm-mainSendMsgIcon",onClick:u,disabled:!l},M.default.createElement(K.IconSend,{size:18})),d&&M.default.createElement(M.default.Fragment,null,M.default.createElement(U.RichTextEditor.ControlsGroup,null,M.default.createElement(U.RichTextEditor.Bold,null),M.default.createElement(U.RichTextEditor.Italic,null),M.default.createElement(U.RichTextEditor.Underline,null),M.default.createElement(U.RichTextEditor.Strikethrough,null),M.default.createElement(U.RichTextEditor.Code,null),M.default.createElement(U.RichTextEditor.Highlight,null)),M.default.createElement(U.RichTextEditor.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},M.default.createElement(U.RichTextEditor.BulletList,null),M.default.createElement(U.RichTextEditor.OrderedList,null),M.default.createElement(J.Menu,{trigger:"hover",openDelay:200},M.default.createElement(J.Menu.Target,null,M.default.createElement(J.ActionIcon,{variant:"outline",size:"md",className:"mrchat-customToolActionItem"},M.default.createElement(K.IconAlignLeft,{size:16,stroke:1.5}))),M.default.createElement(J.Menu.Dropdown,null,M.default.createElement(J.Menu.Item,{onClick:()=>f?.chain().focus().setTextAlign("left").run()},M.default.createElement(K.IconAlignLeft,{size:14})),M.default.createElement(J.Menu.Item,{onClick:()=>f?.chain().focus().setTextAlign("center").run()},M.default.createElement(K.IconAlignCenter,{size:14})),M.default.createElement(J.Menu.Item,{onClick:()=>f?.chain().focus().setTextAlign("right").run()},M.default.createElement(K.IconAlignRight,{size:14})))),M.default.createElement(U.RichTextEditor.Link,null)),M.default.createElement(U.RichTextEditor.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},M.default.createElement(U.RichTextEditor.ClearFormatting,null)))),c&&M.default.createElement("div",{style:{textAlign:"right",color:"red",fontSize:12,marginTop:4}},"Character limit reached (",s,"/",t,")")))}var Xe=require("react-redux"),L=H(require("react"));var fr=H(require("dompurify"));var Y=H(require("react"));function mr({data:e,renderItem:t,loadMore:n,hasMore:r,scrollToBottomTrigger:o}){let s=(0,Y.useRef)(null),i=(0,Y.useRef)(!1),l=(0,Y.useRef)(!0),a=(0,Y.useRef)(0);(0,Y.useEffect)(()=>{let d=s.current;d&&setTimeout(()=>{d.scrollTop=d.scrollHeight},100)},[o]),(0,Y.useEffect)(()=>{let d=s.current;!d||!e.length||(l.current&&(d.scrollTop=d.scrollHeight,l.current=!1),a.current=e.length)},[e]);let c=()=>{let d=s.current;d&&d.scrollTop<50&&r&&!i.current&&m()},m=async()=>{let d=s.current;if(!d||i.current||!r)return;i.current=!0;let p=d.scrollHeight,u=d.scrollTop;await n(),setTimeout(()=>{let f=d.scrollHeight-p;d.scrollTop=u+f,i.current=!1},50)};return Y.default.createElement("div",{ref:s,onScroll:c,className:"mrchat-messageScroll"},Y.default.createElement("div",{className:"mrchat-messageScrollContent"},e.map((d,p)=>Y.default.createElement("div",{key:d?.id||p},t(d,p)))))}var _=H(require("react")),fe=require("@mantine/core"),pr=require("@tabler/icons-react");function bt({opened:e,onClose:t,user:n,onDeleteMessages:r,onBlock:o}){let[s,i]=(0,_.useState)(e),[l,a]=(0,_.useState)(!1);(0,_.useEffect)(()=>{e&&i(!0)},[e]);let c=()=>{i(!1),setTimeout(t,250)};return!e&&!s?null:_.default.createElement(_.default.Fragment,null,_.default.createElement("div",{className:"mrchat-overlay",onClick:c},_.default.createElement("div",{className:`mrchat-drawer ${s?"mrchat-open":"mrchat-close"}`,onClick:m=>m.stopPropagation()},_.default.createElement("div",{className:"mrchat-header"},_.default.createElement("div",{className:"mrchat-backBtn",onClick:c},_.default.createElement(pr.IconArrowLeft,{size:20})),_.default.createElement(fe.Text,{fw:600},"Contact info")),_.default.createElement("div",{className:"mrchat-profileSection"},_.default.createElement(fe.Avatar,{src:n?.avatar,size:150,radius:"xl",style:{cursor:"pointer"},onClick:()=>n?.avatar?a(!0):{}}),_.default.createElement(fe.Text,{fw:700,size:"lg",mt:"sm"},n?.displayName),_.default.createElement(fe.Text,{size:"sm",c:"dimmed"},"@",n?.username)))),l&&_.default.createElement("div",{className:"mrchat-imagePreview",onClick:()=>a(!1)},_.default.createElement("img",{src:n?.avatar,alt:"profile"})))}function hr({chatId:e,enableChat:t,senderDetails:n,receiverDetails:r,onChatInitialized:o,onBack:s,showBackButton:i,colorScheme:l}){let a=(0,Xe.useDispatch)(),c=(0,Xe.useSelector)(E=>E.chat.messageList),[m,d]=(0,L.useState)(0),[p,u]=(0,L.useState)(0),[h,f]=(0,L.useState)(!1),g=c?.rows?.data||[],v=g.length===0,y=()=>{let E=c?.hasMore;if(!e||!E)return;let A=m+1;a(et({chatId:e,page:A,userId:n?.userId})),d(A)};(0,L.useEffect)(()=>{e&&(d(0),a(et({chatId:e,page:0,userId:n?.userId})))},[e]),(0,L.useEffect)(()=>{if(!n?.userId||!ae())return;let E=Z(n?.userId||"");if(!E)return;let A=I=>{I.chatId===e&&a(tt({id:Date.now(),chatId:I.chatId,message:I.message,sender:I.sender,recipient:I.recipient,type:I.type,status:I.status,createdAt:I.time}))};return E.on("newmessage",A),()=>{E.off("newmessage",A)}},[e,n?.userId]);let S=E=>{let A=Z(n?.userId||""),I={message:E,sender:n?.userId,receiver:r?.userId,type:"text",username:n?.username};if(!c?.rows?.data?.length){A?.emit("initializeNewChat",{...I,senderUserDetails:{userId:n?.userId,username:n?.username,displayName:n?.displayName,avatar:n?.avatar},receiverUserDetails:{userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar}},D=>{if(D?.status==="success"){let{data:P}=D;a(ve({id:Date.now(),chatId:P.chatId,message:P.message,sender:P.sender,recipient:P.recipient,type:P.type,status:P.status,createdAt:new Date(P.time).getTime(),updatedAt:new Date(P.time).getTime(),userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar})),a(tt({id:Date.now(),chatId:P.chatId,message:P.message,sender:P.sender,recipient:P.recipient,type:P.type,status:P.status,createdAt:Date.now()})),o?.(P)}else console.log("Failed to initialize chat",D?.error)});return}A?.emit("privatemessage",{...I,chatId:e}),u(D=>D+1)},C=()=>{c.hasMore&&y()},T=()=>{!e||!n?.userId||a(Dt({chatId:e,userId:n?.userId}))};return L.default.createElement("div",{className:"mrchat-mainArea"},L.default.createElement("div",{className:"mrchat-chatHeader"},i&&s&&L.default.createElement(se.ActionIcon,{variant:"subtle",className:"mrchat-backButton",onClick:s},L.default.createElement(qe.IconArrowLeft,{size:20})),r&&L.default.createElement(L.default.Fragment,null,L.default.createElement("div",{className:"mrchat-receiverInfo",onClick:()=>f(!0)},r?.avatar?L.default.createElement(se.Avatar,{src:r.avatar,size:36,radius:"xl"}):L.default.createElement(se.Avatar,{key:r?.displayName||r?.username,name:r?.displayName||r?.username,color:"initials"}),L.default.createElement(se.Text,{fw:600,size:"md"},r?.displayName||r?.username)))),L.default.createElement("div",{className:"mrchat-messageArea"},v?L.default.createElement("div",{className:"mrchat-emptyState"},L.default.createElement("div",{className:"mrchat-encryptionMinimal"},L.default.createElement(qe.IconLock,{size:20,stroke:1.8}),L.default.createElement(se.Text,{className:"mrchat-encryptionText",size:"md"},"End-to-end encrypted"))):L.default.createElement(mr,{data:g,hasMore:c?.hasMore,loadMore:C,scrollToBottomTrigger:p,renderItem:(E,A)=>{let I=E?.sender===n?.userId,z=new Date(E?.createdAt),D=g[A-1],P=A===0||new Date(D?.createdAt).toDateString()!==z.toDateString(),X=new Date,$=new Date;$.setDate(X.getDate()-1);let R=z.toDateString()===X.toDateString(),j=z.toDateString()===$.toDateString(),Q="";R?Q="Today":j?Q="Yesterday":Q=z.toLocaleDateString(void 0,{weekday:"short",month:"short",day:"numeric"});let Se=z.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!1});return L.default.createElement("div",{key:E?.id+"_"+A},P&&L.default.createElement("div",{className:"mrchat-dateSeparator"},Q),L.default.createElement("div",{style:{borderRadius:8},className:`mrchat-messageBubble ${I?"mrchat-outgoing":"mrchat-incoming"}`},L.default.createElement("div",{className:"mrchat-messageContent",dangerouslySetInnerHTML:{__html:fr.default.sanitize(E?.message)}}),L.default.createElement("div",{className:"mrchat-messageTime"},Se)))}})),(e||t)&&L.default.createElement("div",{className:"mrchat-inputBar"},L.default.createElement(xt,{onSubmit:S,colorScheme:l})),L.default.createElement(bt,{opened:h,onClose:()=>f(!1),user:{avatar:r?.avatar,username:r?.username,displayName:r?.displayName},onDeleteMessages:()=>{T()},onBlock:()=>{console.log("block user")}}))}var Ye=require("react-redux"),w=H(require("react"));var gr=H(require("react")),vr=require("react-virtuoso");function yr({data:e,itemContent:t,height:n="100%",startReached:r,endReached:o,...s}){return gr.default.createElement(vr.Virtuoso,{style:{height:n},data:e,startReached:r,endReached:o,itemContent:(i,l)=>t(i,l),...s})}var kr=H(require("dompurify"));var xr=e=>{if(!e)return"";let t=new Date(e),n=new Date,r=new Date;r.setDate(n.getDate()-1);let o=t.toDateString()===n.toDateString(),s=t.toDateString()===r.toDateString(),i=t.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1});return o?i:s?"Yesterday":t.toLocaleDateString(void 0,{day:"numeric",month:"short"})};function Mr({currentUser:e,onSearchUsers:t,colorScheme:n,openChatByUserDetails:r,handleCallAfterOpenChat:o,isLoading:s=!1}){let[i,{open:l,close:a}]=(0,wr.useDisclosure)(!1),c=(0,Ye.useDispatch)(),m=(0,Ye.useSelector)(b=>b.chat.messagedUserList),[d,p]=(0,w.useState)(0),[u,h]=(0,w.useState)(""),[f,g]=(0,w.useState)(!1),[v,y]=(0,w.useState)(""),[S,C]=(0,w.useState)(),[T,E]=(0,w.useState)(),[A,I]=(0,w.useState)([]),[z,D]=(0,w.useState)(!1),[P,X]=(0,w.useState)(e),[$,R]=(0,w.useState)(!1),[j,Q]=(0,w.useState)(!1);(0,w.useEffect)(()=>{e?.userId&&X(e)},[e?.userId]),(0,w.useEffect)(()=>{e?.userId&&c(Ze({userId:e.userId,page:0}))},[e?.userId,c]),(0,w.useEffect)(()=>{if(typeof window>"u")return;let b=window.matchMedia("(max-width: 599px)"),k=N=>{let V="matches"in N?N.matches:b.matches;R(V),V||Q(!1)};return k(b),b.addEventListener?b.addEventListener("change",k):b.addListener(k),()=>{b.removeEventListener?b.removeEventListener("change",k):b.removeListener(k)}},[]);let Se=(b,k)=>{let N=b;if(!N?.userId)return;let V=m?.rows?.data?.find(Te=>Te.userId===N.userId);if(V){Ge(V),a(),y(""),k&&k();return}c(ve({userId:N?.userId,username:N?.username,displayName:N?.displayName,avatar:N?.avatar})),C(N),a(),y(""),c(ye()),h(""),g(!0),$&&Q(!0),k&&k()};(0,w.useEffect)(()=>{if(!P?.userId)return;let b=Z(P.userId);b&&(b.connected||b.connect())},[P?.userId]),(0,w.useEffect)(()=>{if(!P?.userId)return;let b=Z(P.userId);if(!b)return;let k=N=>{N.sender!==P.userId&&c(ve({message:N.message,chatId:N.chatId,userId:N.sender,username:N.userDetails.username,displayName:N.userDetails.displayName,avatar:N.userDetails.avatar}))};return b.on("newChat",k),()=>{b.off("newChat",k)}},[c,P?.userId]),(0,w.useEffect)(()=>{if(!P?.userId)return;let b=Z(P?.userId||"");if(!b)return;let k=N=>{if(!m?.rows?.data)return;let V=m.rows.data.map(ne=>{if(ne.chatId===N.chatId){let zr=N.chatId===u;return{...ne,message:N.message,updatedAt:new Date().toISOString(),unreadCount:zr?0:(ne.unreadCount||0)+1}}return ne}),Te=V.findIndex(ne=>ne.chatId===N.chatId);if(Te!==-1){let ne=V.splice(Te,1)[0];V.unshift(ne)}console.log("Updated",V,N),c(ge({...m,rows:{...m.rows,data:V}}))};return b.on("newMessageNotification",k),()=>{b.off("newMessageNotification",k)}},[m,P?.userId]);let Ar=()=>{if(!m?.hasMore||!e?.userId)return;let b=d+1;p(b),c(Ze({userId:e.userId,page:b}))},Ge=b=>{if(!P?.userId)return;let k=Z(P.userId);if(!k)return;C({userId:b.userId,username:b.username,displayName:b.displayName,avatar:b.avatar}),k.emit("joinChat",{chatId:b.chatId}),h(b?.chatId||""),c(ye());let N=m.rows.data.map(V=>V.chatId===b.chatId?{...V,unreadCount:0}:V);$&&Q(!0),c(ge({...m,rows:{...m.rows,data:N}}))};(0,w.useEffect)(()=>{r&&Se(r,o)},[r?.userId]);let Pr=b=>{y(b)},Nr=()=>{Q(!1)};(0,w.useEffect)(()=>{if(!v.trim()){I([]),D(!1);return}if(!t){I([]),D(!1);return}let b=!1,k=setTimeout(async()=>{try{D(!0),I([]);let N=await Promise.resolve(t(v));if(b)return;I(N)}finally{b||D(!1)}},400);return()=>{b=!0,clearTimeout(k)}},[v,t]);let Lr=b=>{let k=document.createElement("div");return k.innerHTML=b,k.textContent||""},Dr=A.map(b=>({value:b.username,label:b.displayName||b.username,user:b}));return w.default.createElement("div",{className:"mrchat-chatWrapper"},s&&w.default.createElement("div",{className:"mrchat-loadingOverlay"},w.default.createElement(O.Loader,{size:"md"})),w.default.createElement(O.Modal,{opened:i,onClose:()=>{a(),y(""),I([]),D(!1)},title:"Search User",centered:!0,withCloseButton:!0},w.default.createElement(O.Autocomplete,{mb:12,label:"Search User to Chat",placeholder:"Type username to search...",limit:20,data:Dr,value:v,onChange:Pr,rightSection:z?w.default.createElement(O.Loader,{size:"xs"}):void 0,rightSectionWidth:28,onOptionSubmit:b=>{let k=A.find(N=>N.username===b);k&&(y(""),E(k),I([]),D(!1))},renderOption:({option:b})=>{let k=b.user;return w.default.createElement(O.Group,{gap:"sm"},w.default.createElement(O.Avatar,{src:k.avatar,size:36,radius:"xl"}),w.default.createElement("div",null,w.default.createElement(O.Text,{size:"sm"},k.displayName||k.username),k.displayName&&w.default.createElement(O.Text,{size:"xs",opacity:.5},"@",k.username)))}}),w.default.createElement(O.Button,{fullWidth:!0,onClick:()=>Se(T),disabled:!T?.username},"Start Chat")),w.default.createElement("div",{className:"mrchat-chatContainer"},w.default.createElement("div",{className:"mrchat-sidebar "+($&&j?"mrchat-hiddenOnMobile":"")},w.default.createElement("div",{className:"mrchat-sidebarTop"},w.default.createElement("div",{className:"mrchat-topBar"},w.default.createElement(O.Text,{size:"xs",c:"dimmed",mt:"sm",mb:"xs",fw:600,ml:8},"All Messages"),w.default.createElement("div",{className:"mrchat-topActions"},w.default.createElement(O.ActionIcon,{variant:"subtle",onClick:()=>{E(null),y(""),I([]),l()},radius:"lg"},w.default.createElement(br.IconPlus,{size:20,stroke:3}))))),w.default.createElement("div",{className:"mrchat-scrollWrapper"},w.default.createElement(yr,{data:m?.rows?.data||[],endReached:Ar,itemContent:(b,k)=>{let N=k.chatId===u;return w.default.createElement("div",{className:`mrchat-chatItem ${N?"mrchat-activeChatItem":""}`,onClick:()=>{if(N&&$){Q(!0);return}N||Ge(k)}},k.avatar?w.default.createElement(O.Avatar,{src:k.avatar,size:36,radius:"xl"}):w.default.createElement(O.Avatar,{key:k.displayName||k.username,name:k.displayName||k.username,color:"initials"}),w.default.createElement("div",{className:"mrchat-chatInfo"},w.default.createElement(O.Text,{className:"mrchat-chatLabelItem",truncate:!0},k.displayName||k.username),k.unreadCount>0&&w.default.createElement("div",{className:"mrchat-unreadBadge"},k.unreadCount||10),w.default.createElement("div",{className:"mrchat-messagePreview"},w.default.createElement(O.Text,{truncate:!0,size:"xs",c:"dimmed",style:{maxWidth:150},className:"mrchat-messagePreviewContent"},Lr(kr.default.sanitize(k.message))),w.default.createElement(O.Text,{size:"xs",c:"dimmed",className:"mrchat-messagePreviewTime"},xr(k.updatedAt||k.createdAt)))))}}))),w.default.createElement("div",{className:"mrchat-mainAreaWrapper "+($&&!j?"mrchat-hiddenOnMobile":"")},w.default.createElement(hr,{chatId:u,enableChat:f,senderDetails:P,receiverDetails:S,onBack:Nr,showBackButton:$,onChatInitialized:b=>{Ge({chatId:b.chatId,userId:S?.userId,username:S?.username,displayName:S?.displayName,avatar:S?.avatar})},colorScheme:n}))))}var Sr=require("react"),Tr=require("react-redux");function Er(){let e=(0,Tr.useDispatch)();return(0,Sr.useEffect)(()=>()=>{e(zt())},[e]),null}function wt({colorScheme:e,primaryColor:t="customBrand",darkColor:n,apiKey:r,baseUrl:o,socketUrl:s,openChatByUserDetails:i,handleCallAfterOpenChat:l,isLoading:a=!1,...c}){let m=Et(t),d=[r?.trim()?null:"apiKey",o?.trim()?null:"baseUrl",s?.trim()?null:"socketUrl"].filter(Boolean),p=d.length===0;return(0,q.useLayoutEffect)(()=>{typeof window>"u"||!p||It({baseUrl:o,socketUrl:s,apiKey:r})},[r,o,s,p]),(0,q.useEffect)(()=>{if(typeof document>"u"||!n)return;let u=document.body.style.backgroundColor;return document.body.style.backgroundColor=e==="dark"?n:"",document.documentElement.style.setProperty("--mantine-color-body",e==="dark"?n:""),()=>{document.body.style.backgroundColor=u,document.documentElement.style.removeProperty("--mantine-color-body")}},[e,n]),p?q.default.createElement(jt,null,q.default.createElement(Ft,null,q.default.createElement(Er,null),q.default.createElement(Cr.MantineProvider,{defaultColorScheme:e??"light",forceColorScheme:e,theme:m},q.default.createElement(Ir.Notifications,null),q.default.createElement(Mr,{handleCallAfterOpenChat:l,colorScheme:e,openChatByUserDetails:i,isLoading:a,...c})))):q.default.createElement("div",{role:"alert",style:{minHeight:"100vh",display:"flex",alignItems:"center",justifyContent:"center",padding:16}},q.default.createElement("div",{style:{padding:16,borderRadius:8,backgroundColor:"#fef3f2",color:"#b42318",fontWeight:600,textAlign:"center"}},"Missing required configuration: ",d.join(", ")))}0&&(module.exports={MrChat});
|
|
21
|
+
${h}`}}),a}function pi(e,t,n={}){let{state:r}=t,{doc:o,tr:s}=r,i=e;o.descendants((l,a)=>{let c=s.mapping.map(a),m=s.mapping.map(a)+l.nodeSize,d=null;if(l.marks.forEach(u=>{if(u!==i)return!1;d=u}),!d)return;let p=!1;if(Object.keys(n).forEach(u=>{n[u]!==d.attrs[u]&&(p=!0)}),p){let u=e.type.create({...e.attrs,...n});s.removeMark(c,m,e.type),s.addMark(c,m,u)}}),s.docChanged&&t.view.dispatch(s)}var tr=class nr extends pt{constructor(){super(...arguments),this.type="node"}static create(t={}){let n=typeof t=="function"?t():t;return new nr(n)}configure(t){return super.configure(t)}extend(t){let n=typeof t=="function"?t():t;return super.extend(n)}};var hi=ft.create({name:"underline",addOptions(){return{HTMLAttributes:{}}},parseHTML(){return[{tag:"u"},{style:"text-decoration",consuming:!1,getAttrs:e=>e.includes("underline")?{}:!1}]},renderHTML({HTMLAttributes:e}){return["u",Me(this.options.HTMLAttributes,e),0]},parseMarkdown(e,t){return t.applyMark(this.name||"underline",t.parseInline(e.tokens||[]))},renderMarkdown(e,t){return`++${t.renderChildren(e)}++`},markdownTokenizer:{name:"underline",level:"inline",start(e){return e.indexOf("++")},tokenize(e,t,n){let o=/^(\+\+)([\s\S]+?)(\+\+)/.exec(e);if(!o)return;let s=o[2].trim();return{type:"underline",raw:o[0],text:s,tokens:n.inlineTokens(s)}}},addCommands(){return{setUnderline:()=>({commands:e})=>e.setMark(this.name),toggleUnderline:()=>({commands:e})=>e.toggleMark(this.name),unsetUnderline:()=>({commands:e})=>e.unsetMark(this.name)}},addKeyboardShortcuts(){return{"Mod-u":()=>this.editor.commands.toggleUnderline(),"Mod-U":()=>this.editor.commands.toggleUnderline()}}}),rr=hi;var dr=require("@tiptap/react"),ur=H(require("@tiptap/starter-kit")),U=require("@mantine/tiptap"),J=require("@mantine/core");var W=H(require("react")),pe=require("@mantine/core"),or=H(require("@emoji-mart/data")),gi=(0,W.lazy)(()=>import("@emoji-mart/react"));function yt({onSelect:e,action:t,size:n=320,offset:r=8,position:o="bottom-start",colorScheme:s="light"}){let[i,l]=(0,W.useState)(!1);return W.default.createElement(pe.Popover,{opened:i,onChange:l,width:n,position:o,offset:r,withArrow:!0,shadow:"md",trapFocus:!1,closeOnEscape:!0},W.default.createElement(pe.Popover.Target,null,(0,W.cloneElement)(t,{onClick:a=>{t.props?.onClick?.(a),l(c=>!c)}})),W.default.createElement(pe.Popover.Dropdown,{p:0},W.default.createElement(W.Suspense,{fallback:W.default.createElement("div",{style:{padding:12,width:320}},W.default.createElement(pe.Skeleton,{height:280,radius:"md"}))},W.default.createElement(gi,{previewPosition:"none",theme:s,data:or.default,onEmojiSelect:a=>{e(a.native),l(!1)}}))))}var sr=tr.create({name:"emoji",inline:!0,group:"inline",selectable:!1,atom:!0,addAttributes(){return{emoji:{default:"\u{1F600}"}}},parseHTML(){return[{tag:"span[data-emoji]"}]},renderHTML({HTMLAttributes:e}){return["span",Me(e,{class:"emoji-big","data-emoji":e.emoji}),e.emoji]}});function xt({content:e="",maxLength:t=3e3,onChange:n,onSubmit:r,colorScheme:o="light"}){let[s,i]=(0,M.useState)(0),[l,a]=(0,M.useState)(!1),[c,m]=(0,M.useState)(!1),[d,p]=(0,M.useState)(!1),u=()=>{if(!f)return;let g=f.getHTML();f.getText().trim()&&(r?.(g),f.commands.clearContent(),f.commands.focus(),i(0),a(!1))},h=(g,v)=>v.key==="Enter"&&!v.shiftKey?(v.preventDefault(),u(),!0):v.key==="Enter"&&v.shiftKey?(v.preventDefault(),f?.commands.setHardBreak(),!0):!1,f=(0,dr.useEditor)({extensions:[ur.default,sr,rr,U.Link,cr.default,ar.default,ir.default,lr.default.configure({types:["heading","paragraph"]})],content:e,editorProps:{handleKeyDown:h},onUpdate:({editor:g})=>{let v=g.getHTML(),y=v.replace(/(<br\s*\/?>\s*){3,}/g,"<br><br>");if(y!==v){let{from:T,to:E}=g.state.selection;g.commands.setContent(y),g.commands.setTextSelection({from:Math.min(T,g.state.doc.content.size),to:Math.min(E,g.state.doc.content.size)});return}let S=g.getText(),C=S.trim().length>0;i(S.length),a(C),m(t?S.length>=t:!1),n?.(g.getHTML())},immediatelyRender:!1});return M.default.createElement(M.default.Fragment,null,M.default.createElement(U.RichTextEditor,{editor:f,w:"100%",className:"mrchat-richTextEditorContainer"},M.default.createElement(U.RichTextEditor.Content,null),M.default.createElement(U.RichTextEditor.Toolbar,{sticky:!0,stickyOffset:"var(--docs-header-height)"},M.default.createElement("div",{className:"mrchat-mainActionContainer"},M.default.createElement(yt,{colorScheme:o,onSelect:g=>{f?.chain().focus().insertContent({type:"emoji",attrs:{emoji:g}}).run()},action:M.default.createElement(J.ActionIcon,{radius:"lg",variant:"subtle","aria-label":"add",className:"mrchat-mainActionEmojiIcon"},M.default.createElement(K.IconMoodPlus,null))}),M.default.createElement(J.ActionIcon,{radius:"lg",variant:"subtle","aria-label":"text_format",className:"mrchat-mainTextFormatIcon",onClick:()=>p(g=>!g)},M.default.createElement(K.IconTextColor,{stroke:1.7})),M.default.createElement(J.ActionIcon,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-mainSendMsgIcon",onClick:u,disabled:!l},M.default.createElement(K.IconSend,{size:18}))),M.default.createElement(J.ActionIcon,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-sm-mainSendMsgIcon",onClick:u,disabled:!l},M.default.createElement(K.IconSend,{size:18})),d&&M.default.createElement(M.default.Fragment,null,M.default.createElement(U.RichTextEditor.ControlsGroup,null,M.default.createElement(U.RichTextEditor.Bold,null),M.default.createElement(U.RichTextEditor.Italic,null),M.default.createElement(U.RichTextEditor.Underline,null),M.default.createElement(U.RichTextEditor.Strikethrough,null),M.default.createElement(U.RichTextEditor.Code,null),M.default.createElement(U.RichTextEditor.Highlight,null)),M.default.createElement(U.RichTextEditor.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},M.default.createElement(U.RichTextEditor.BulletList,null),M.default.createElement(U.RichTextEditor.OrderedList,null),M.default.createElement(J.Menu,{trigger:"hover",openDelay:200},M.default.createElement(J.Menu.Target,null,M.default.createElement(J.ActionIcon,{variant:"outline",size:"md",className:"mrchat-customToolActionItem"},M.default.createElement(K.IconAlignLeft,{size:16,stroke:1.5}))),M.default.createElement(J.Menu.Dropdown,null,M.default.createElement(J.Menu.Item,{onClick:()=>f?.chain().focus().setTextAlign("left").run()},M.default.createElement(K.IconAlignLeft,{size:14})),M.default.createElement(J.Menu.Item,{onClick:()=>f?.chain().focus().setTextAlign("center").run()},M.default.createElement(K.IconAlignCenter,{size:14})),M.default.createElement(J.Menu.Item,{onClick:()=>f?.chain().focus().setTextAlign("right").run()},M.default.createElement(K.IconAlignRight,{size:14})))),M.default.createElement(U.RichTextEditor.Link,null)),M.default.createElement(U.RichTextEditor.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},M.default.createElement(U.RichTextEditor.ClearFormatting,null)))),c&&M.default.createElement("div",{style:{textAlign:"right",color:"red",fontSize:12,marginTop:4}},"Character limit reached (",s,"/",t,")")))}var Xe=require("react-redux"),L=H(require("react"));var fr=H(require("dompurify"));var Y=H(require("react"));function mr({data:e,renderItem:t,loadMore:n,hasMore:r,scrollToBottomTrigger:o}){let s=(0,Y.useRef)(null),i=(0,Y.useRef)(!1),l=(0,Y.useRef)(!0),a=(0,Y.useRef)(0);(0,Y.useEffect)(()=>{let d=s.current;d&&setTimeout(()=>{d.scrollTop=d.scrollHeight},100)},[o]),(0,Y.useEffect)(()=>{let d=s.current;!d||!e.length||(l.current&&(d.scrollTop=d.scrollHeight,l.current=!1),a.current=e.length)},[e]);let c=()=>{let d=s.current;d&&d.scrollTop<50&&r&&!i.current&&m()},m=async()=>{let d=s.current;if(!d||i.current||!r)return;i.current=!0;let p=d.scrollHeight,u=d.scrollTop;await n(),setTimeout(()=>{let f=d.scrollHeight-p;d.scrollTop=u+f,i.current=!1},50)};return Y.default.createElement("div",{ref:s,onScroll:c,className:"mrchat-messageScroll"},Y.default.createElement("div",{className:"mrchat-messageScrollContent"},e.map((d,p)=>Y.default.createElement("div",{key:d?.id||p},t(d,p)))))}var _=H(require("react")),fe=require("@mantine/core"),pr=require("@tabler/icons-react");function bt({opened:e,onClose:t,user:n,onDeleteMessages:r,onBlock:o}){let[s,i]=(0,_.useState)(e),[l,a]=(0,_.useState)(!1);(0,_.useEffect)(()=>{e&&i(!0)},[e]);let c=()=>{i(!1),setTimeout(t,250)};return!e&&!s?null:_.default.createElement(_.default.Fragment,null,_.default.createElement("div",{className:"mrchat-overlay",onClick:c},_.default.createElement("div",{className:`mrchat-drawer ${s?"mrchat-open":"mrchat-close"}`,onClick:m=>m.stopPropagation()},_.default.createElement("div",{className:"mrchat-header"},_.default.createElement("div",{className:"mrchat-backBtn",onClick:c},_.default.createElement(pr.IconArrowLeft,{size:20})),_.default.createElement(fe.Text,{fw:600},"Contact info")),_.default.createElement("div",{className:"mrchat-profileSection"},_.default.createElement(fe.Avatar,{src:n?.avatar,size:150,radius:"xl",style:{cursor:"pointer"},onClick:()=>n?.avatar?a(!0):{}}),_.default.createElement(fe.Text,{fw:700,size:"lg",mt:"sm"},n?.displayName),_.default.createElement(fe.Text,{size:"sm",c:"dimmed"},"@",n?.username)))),l&&_.default.createElement("div",{className:"mrchat-imagePreview",onClick:()=>a(!1)},_.default.createElement("img",{src:n?.avatar,alt:"profile"})))}function hr({chatId:e,enableChat:t,senderDetails:n,receiverDetails:r,onChatInitialized:o,onBack:s,showBackButton:i,colorScheme:l}){let a=(0,Xe.useDispatch)(),c=(0,Xe.useSelector)(E=>E.chat.messageList),[m,d]=(0,L.useState)(0),[p,u]=(0,L.useState)(0),[h,f]=(0,L.useState)(!1),g=c?.rows?.data||[],v=g.length===0,y=()=>{let E=c?.hasMore;if(!e||!E)return;let A=m+1;a(et({chatId:e,page:A,userId:n?.userId})),d(A)};(0,L.useEffect)(()=>{e&&(d(0),a(et({chatId:e,page:0,userId:n?.userId})))},[e]),(0,L.useEffect)(()=>{if(!n?.userId||!ae())return;let E=Z(n?.userId||"");if(!E)return;let A=I=>{I.chatId===e&&a(tt({id:Date.now(),chatId:I.chatId,message:I.message,sender:I.sender,recipient:I.recipient,type:I.type,status:I.status,createdAt:I.time}))};return E.on("newmessage",A),()=>{E.off("newmessage",A)}},[e,n?.userId]);let S=E=>{let A=Z(n?.userId||""),I={message:E,sender:n?.userId,receiver:r?.userId,type:"text",username:n?.username};if(!c?.rows?.data?.length){A?.emit("initializeNewChat",{...I,senderUserDetails:{userId:n?.userId,username:n?.username,displayName:n?.displayName,avatar:n?.avatar},receiverUserDetails:{userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar}},D=>{if(D?.status==="success"){let{data:P}=D;a(ve({id:Date.now(),chatId:P.chatId,message:P.message,sender:P.sender,recipient:P.recipient,type:P.type,status:P.status,createdAt:new Date(P.time).getTime(),updatedAt:new Date(P.time).getTime(),userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar})),a(tt({id:Date.now(),chatId:P.chatId,message:P.message,sender:P.sender,recipient:P.recipient,type:P.type,status:P.status,createdAt:Date.now()})),o?.(P)}else console.log("Failed to initialize chat",D?.error)});return}A?.emit("privatemessage",{...I,chatId:e}),u(D=>D+1)},C=()=>{c.hasMore&&y()},T=()=>{!e||!n?.userId||a(Dt({chatId:e,userId:n?.userId}))};return L.default.createElement("div",{className:"mrchat-mainArea"},L.default.createElement("div",{className:"mrchat-chatHeader"},i&&s&&L.default.createElement(se.ActionIcon,{variant:"subtle",className:"mrchat-backButton",onClick:s},L.default.createElement(qe.IconArrowLeft,{size:20})),r&&L.default.createElement(L.default.Fragment,null,L.default.createElement("div",{className:"mrchat-receiverInfo",onClick:()=>f(!0)},r?.avatar?L.default.createElement(se.Avatar,{src:r.avatar,size:36,radius:"xl"}):L.default.createElement(se.Avatar,{key:r?.displayName||r?.username,name:r?.displayName||r?.username,color:"initials"}),L.default.createElement(se.Text,{fw:600,size:"md"},r?.displayName||r?.username)))),L.default.createElement("div",{className:"mrchat-messageArea"},v?L.default.createElement("div",{className:"mrchat-emptyState"},L.default.createElement("div",{className:"mrchat-encryptionMinimal"},L.default.createElement(qe.IconLock,{size:20,stroke:1.8}),L.default.createElement(se.Text,{className:"mrchat-encryptionText",size:"md"},"End-to-end encrypted"))):L.default.createElement(mr,{data:g,hasMore:c?.hasMore,loadMore:C,scrollToBottomTrigger:p,renderItem:(E,A)=>{let I=E?.sender===n?.userId,z=new Date(E?.createdAt),D=g[A-1],P=A===0||new Date(D?.createdAt).toDateString()!==z.toDateString(),X=new Date,$=new Date;$.setDate(X.getDate()-1);let R=z.toDateString()===X.toDateString(),j=z.toDateString()===$.toDateString(),Q="";R?Q="Today":j?Q="Yesterday":Q=z.toLocaleDateString(void 0,{weekday:"short",month:"short",day:"numeric"});let Se=z.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!1});return L.default.createElement("div",{key:E?.id+"_"+A},P&&L.default.createElement("div",{className:"mrchat-dateSeparator"},Q),L.default.createElement("div",{style:{borderRadius:8},className:`mrchat-messageBubble ${I?"mrchat-outgoing":"mrchat-incoming"}`},L.default.createElement("div",{className:"mrchat-messageContent",dangerouslySetInnerHTML:{__html:fr.default.sanitize(E?.message)}}),L.default.createElement("div",{className:"mrchat-messageTime"},Se)))}})),(e||t)&&L.default.createElement("div",{className:"mrchat-inputBar"},L.default.createElement(xt,{onSubmit:S,colorScheme:l})),L.default.createElement(bt,{opened:h,onClose:()=>f(!1),user:{avatar:r?.avatar,username:r?.username,displayName:r?.displayName},onDeleteMessages:()=>{T()},onBlock:()=>{console.log("block user")}}))}var Ye=require("react-redux"),w=H(require("react"));var gr=H(require("react")),vr=require("react-virtuoso");function yr({data:e,itemContent:t,height:n="100%",startReached:r,endReached:o,...s}){return gr.default.createElement(vr.Virtuoso,{style:{height:n},data:e,startReached:r,endReached:o,itemContent:(i,l)=>t(i,l),...s})}var kr=H(require("dompurify"));var xr=e=>{if(!e)return"";let t=new Date(e),n=new Date,r=new Date;r.setDate(n.getDate()-1);let o=t.toDateString()===n.toDateString(),s=t.toDateString()===r.toDateString(),i=t.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1});return o?i:s?"Yesterday":t.toLocaleDateString(void 0,{day:"numeric",month:"short"})};function Mr({currentUser:e,onSearchUsers:t,colorScheme:n,openChatByUserDetails:r,handleCallAfterOpenChat:o,isLoading:s=!1}){let[i,{open:l,close:a}]=(0,wr.useDisclosure)(!1),c=(0,Ye.useDispatch)(),m=(0,Ye.useSelector)(b=>b.chat.messagedUserList),[d,p]=(0,w.useState)(0),[u,h]=(0,w.useState)(""),[f,g]=(0,w.useState)(!1),[v,y]=(0,w.useState)(""),[S,C]=(0,w.useState)(),[T,E]=(0,w.useState)(),[A,I]=(0,w.useState)([]),[z,D]=(0,w.useState)(!1),[P,X]=(0,w.useState)(e),[$,R]=(0,w.useState)(!1),[j,Q]=(0,w.useState)(!1);(0,w.useEffect)(()=>{e?.userId&&X(e)},[e?.userId]),(0,w.useEffect)(()=>{e?.userId&&c(Ze({userId:e.userId,page:0}))},[e?.userId,c]),(0,w.useEffect)(()=>{if(typeof window>"u")return;let b=window.matchMedia("(max-width: 599px)"),k=N=>{let V="matches"in N?N.matches:b.matches;R(V),V||Q(!1)};return k(b),b.addEventListener?b.addEventListener("change",k):b.addListener(k),()=>{b.removeEventListener?b.removeEventListener("change",k):b.removeListener(k)}},[]);let Se=(b,k)=>{let N=b;if(!N?.userId)return;let V=m?.rows?.data?.find(Te=>Te.userId===N.userId);if(V){Ge(V),a(),y(""),k&&k();return}c(ve({userId:N?.userId,username:N?.username,displayName:N?.displayName,avatar:N?.avatar})),C(N),a(),y(""),c(ye()),h(""),g(!0),$&&Q(!0),k&&k()};(0,w.useEffect)(()=>{if(!P?.userId)return;let b=Z(P.userId);b&&(b.connected||b.connect())},[P?.userId]),(0,w.useEffect)(()=>{if(!P?.userId)return;let b=Z(P.userId);if(!b)return;let k=N=>{N.sender!==P.userId&&c(ve({message:N.message,chatId:N.chatId,userId:N.sender,username:N.userDetails.username,displayName:N.userDetails.displayName,avatar:N.userDetails.avatar}))};return b.on("newChat",k),()=>{b.off("newChat",k)}},[c,P?.userId]),(0,w.useEffect)(()=>{if(!P?.userId)return;let b=Z(P?.userId||"");if(!b)return;let k=N=>{if(!m?.rows?.data)return;let V=m.rows.data.map(ne=>{if(ne.chatId===N.chatId){let zr=N.chatId===u;return{...ne,message:N.message,updatedAt:new Date().toISOString(),unreadCount:zr?0:(ne.unreadCount||0)+1}}return ne}),Te=V.findIndex(ne=>ne.chatId===N.chatId);if(Te!==-1){let ne=V.splice(Te,1)[0];V.unshift(ne)}console.log("Updated",V,N),c(ge({...m,rows:{...m.rows,data:V}}))};return b.on("newMessageNotification",k),()=>{b.off("newMessageNotification",k)}},[m,P?.userId]);let Ar=()=>{if(!m?.hasMore||!e?.userId)return;let b=d+1;p(b),c(Ze({userId:e.userId,page:b}))},Ge=b=>{if(!P?.userId)return;let k=Z(P.userId);if(!k)return;C({userId:b.userId,username:b.username,displayName:b.displayName,avatar:b.avatar}),k.emit("joinChat",{chatId:b.chatId}),h(b?.chatId||""),c(ye());let N=m.rows.data.map(V=>V.chatId===b.chatId?{...V,unreadCount:0}:V);$&&Q(!0),c(ge({...m,rows:{...m.rows,data:N}}))};(0,w.useEffect)(()=>{r&&Se(r,o)},[r?.userId]);let Pr=b=>{y(b)},Nr=()=>{Q(!1)};(0,w.useEffect)(()=>{if(!v.trim()){I([]),D(!1);return}if(!t){I([]),D(!1);return}let b=!1,k=setTimeout(async()=>{try{D(!0),I([]);let N=await Promise.resolve(t(v));if(b)return;I(N)}finally{b||D(!1)}},400);return()=>{b=!0,clearTimeout(k)}},[v,t]);let Lr=b=>{let k=document.createElement("div");return k.innerHTML=b,k.textContent||""},Dr=A.map(b=>({value:b.username,label:b.displayName||b.username,user:b}));return w.default.createElement("div",{className:"mrchat-chatWrapper"},s&&w.default.createElement("div",{className:"mrchat-loadingOverlay"},w.default.createElement(O.Loader,{size:"md"})),w.default.createElement(O.Modal,{opened:i,onClose:()=>{a(),y(""),I([]),D(!1)},title:"Search User to Chat",centered:!0,withCloseButton:!0},w.default.createElement(O.Autocomplete,{mb:12,placeholder:"Type username to search...",limit:20,data:Dr,value:v,onChange:Pr,rightSection:z?w.default.createElement(O.Loader,{size:"xs"}):void 0,rightSectionWidth:28,onOptionSubmit:b=>{let k=A.find(N=>N.username===b);k&&(y(""),E(k),I([]),D(!1))},renderOption:({option:b})=>{let k=b.user;return w.default.createElement(O.Group,{gap:"sm"},w.default.createElement(O.Avatar,{src:k.avatar,size:36,radius:"xl"}),w.default.createElement("div",null,w.default.createElement(O.Text,{size:"sm"},k.displayName||k.username),k.displayName&&w.default.createElement(O.Text,{size:"xs",opacity:.5},"@",k.username)))}}),w.default.createElement(O.Button,{fullWidth:!0,onClick:()=>Se(T),disabled:!T?.username},"Start Chat")),w.default.createElement("div",{className:"mrchat-chatContainer"},w.default.createElement("div",{className:"mrchat-sidebar "+($&&j?"mrchat-hiddenOnMobile":"")},w.default.createElement("div",{className:"mrchat-sidebarTop"},w.default.createElement("div",{className:"mrchat-topBar"},w.default.createElement(O.Text,{size:"xs",mt:"sm",mb:"xs",fw:600,ml:8},"All Messages"),w.default.createElement("div",{className:"mrchat-topActions"},w.default.createElement(O.ActionIcon,{variant:"subtle",onClick:()=>{E(null),y(""),I([]),l()},radius:"lg"},w.default.createElement(br.IconPlus,{size:20,stroke:3}))))),w.default.createElement("div",{className:"mrchat-scrollWrapper"},w.default.createElement(yr,{data:m?.rows?.data||[],endReached:Ar,itemContent:(b,k)=>{let N=k.chatId===u;return w.default.createElement("div",{className:`mrchat-chatItem ${N?"mrchat-activeChatItem":""}`,onClick:()=>{if(N&&$){Q(!0);return}N||Ge(k)}},k.avatar?w.default.createElement(O.Avatar,{src:k.avatar,size:36,radius:"xl"}):w.default.createElement(O.Avatar,{key:k.displayName||k.username,name:k.displayName||k.username,color:"initials"}),w.default.createElement("div",{className:"mrchat-chatInfo"},w.default.createElement(O.Text,{className:"mrchat-chatLabelItem",truncate:!0},k.displayName||k.username),k.unreadCount>0&&w.default.createElement("div",{className:"mrchat-unreadBadge"},k.unreadCount||10),w.default.createElement("div",{className:"mrchat-messagePreview"},w.default.createElement(O.Text,{truncate:!0,size:"xs",c:"dimmed",style:{maxWidth:150},className:"mrchat-messagePreviewContent"},Lr(kr.default.sanitize(k.message))),w.default.createElement(O.Text,{size:"xs",c:"dimmed",className:"mrchat-messagePreviewTime"},xr(k.updatedAt||k.createdAt)))))}}))),w.default.createElement("div",{className:"mrchat-mainAreaWrapper "+($&&!j?"mrchat-hiddenOnMobile":"")},w.default.createElement(hr,{chatId:u,enableChat:f,senderDetails:P,receiverDetails:S,onBack:Nr,showBackButton:$,onChatInitialized:b=>{Ge({chatId:b.chatId,userId:S?.userId,username:S?.username,displayName:S?.displayName,avatar:S?.avatar})},colorScheme:n}))))}var Sr=require("react"),Tr=require("react-redux");function Er(){let e=(0,Tr.useDispatch)();return(0,Sr.useEffect)(()=>()=>{e(zt())},[e]),null}function wt({colorScheme:e,primaryColor:t="customBrand",darkColor:n,apiKey:r,baseUrl:o,socketUrl:s,openChatByUserDetails:i,handleCallAfterOpenChat:l,isLoading:a=!1,...c}){let m=Et(t),d=[r?.trim()?null:"apiKey",o?.trim()?null:"baseUrl",s?.trim()?null:"socketUrl"].filter(Boolean),p=d.length===0;return(0,q.useLayoutEffect)(()=>{typeof window>"u"||!p||It({baseUrl:o,socketUrl:s,apiKey:r})},[r,o,s,p]),(0,q.useEffect)(()=>{if(typeof document>"u"||!n)return;let u=document.body.style.backgroundColor;return document.body.style.backgroundColor=e==="dark"?n:"",document.documentElement.style.setProperty("--mantine-color-body",e==="dark"?n:""),()=>{document.body.style.backgroundColor=u,document.documentElement.style.removeProperty("--mantine-color-body")}},[e,n]),p?q.default.createElement(jt,null,q.default.createElement(Ft,null,q.default.createElement(Er,null),q.default.createElement(Cr.MantineProvider,{defaultColorScheme:e??"light",forceColorScheme:e,theme:m},q.default.createElement(Ir.Notifications,null),q.default.createElement(Mr,{handleCallAfterOpenChat:l,colorScheme:e,openChatByUserDetails:i,isLoading:a,...c})))):q.default.createElement("div",{role:"alert",style:{minHeight:"100vh",display:"flex",alignItems:"center",justifyContent:"center",padding:16}},q.default.createElement("div",{style:{padding:16,borderRadius:8,backgroundColor:"#fef3f2",color:"#b42318",fontWeight:600,textAlign:"center"}},"Missing required configuration: ",d.join(", ")))}0&&(module.exports={MrChat});
|
package/dist/index.mjs
CHANGED
|
@@ -18,4 +18,4 @@ ${g}
|
|
|
18
18
|
`);a+=c.type==="paragraph"?`
|
|
19
19
|
|
|
20
20
|
${h}`:`
|
|
21
|
-
${h}`}}),a}function ai(e,t,n={}){let{state:r}=t,{doc:s,tr:o}=r,i=e;s.descendants((l,a)=>{let c=o.mapping.map(a),m=o.mapping.map(a)+l.nodeSize,d=null;if(l.marks.forEach(u=>{if(u!==i)return!1;d=u}),!d)return;let p=!1;if(Object.keys(n).forEach(u=>{n[u]!==d.attrs[u]&&(p=!0)}),p){let u=e.type.create({...e.attrs,...n});o.removeMark(c,m,e.type),o.addMark(c,m,u)}}),o.docChanged&&t.view.dispatch(o)}var Qt=class Zt extends qe{constructor(){super(...arguments),this.type="node"}static create(t={}){let n=typeof t=="function"?t():t;return new Zt(n)}configure(t){return super.configure(t)}extend(t){let n=typeof t=="function"?t():t;return super.extend(n)}};var ci=Xe.create({name:"underline",addOptions(){return{HTMLAttributes:{}}},parseHTML(){return[{tag:"u"},{style:"text-decoration",consuming:!1,getAttrs:e=>e.includes("underline")?{}:!1}]},renderHTML({HTMLAttributes:e}){return["u",me(this.options.HTMLAttributes,e),0]},parseMarkdown(e,t){return t.applyMark(this.name||"underline",t.parseInline(e.tokens||[]))},renderMarkdown(e,t){return`++${t.renderChildren(e)}++`},markdownTokenizer:{name:"underline",level:"inline",start(e){return e.indexOf("++")},tokenize(e,t,n){let s=/^(\+\+)([\s\S]+?)(\+\+)/.exec(e);if(!s)return;let o=s[2].trim();return{type:"underline",raw:s[0],text:o,tokens:n.inlineTokens(o)}}},addCommands(){return{setUnderline:()=>({commands:e})=>e.setMark(this.name),toggleUnderline:()=>({commands:e})=>e.toggleMark(this.name),unsetUnderline:()=>({commands:e})=>e.unsetMark(this.name)}},addKeyboardShortcuts(){return{"Mod-u":()=>this.editor.commands.toggleUnderline(),"Mod-U":()=>this.editor.commands.toggleUnderline()}}}),en=ci;import{useEditor as Si}from"@tiptap/react";import Ti from"@tiptap/starter-kit";import{Link as Ei,RichTextEditor as j}from"@mantine/tiptap";import{ActionIcon as pe,Menu as oe}from"@mantine/core";import te,{useState as li,lazy as di,Suspense as ui,cloneElement as mi}from"react";import{Popover as Ze,Skeleton as pi}from"@mantine/core";import fi from"@emoji-mart/data";var hi=di(()=>import("@emoji-mart/react"));function et({onSelect:e,action:t,size:n=320,offset:r=8,position:s="bottom-start",colorScheme:o="light"}){let[i,l]=li(!1);return te.createElement(Ze,{opened:i,onChange:l,width:n,position:s,offset:r,withArrow:!0,shadow:"md",trapFocus:!1,closeOnEscape:!0},te.createElement(Ze.Target,null,mi(t,{onClick:a=>{t.props?.onClick?.(a),l(c=>!c)}})),te.createElement(Ze.Dropdown,{p:0},te.createElement(ui,{fallback:te.createElement("div",{style:{padding:12,width:320}},te.createElement(pi,{height:280,radius:"md"}))},te.createElement(hi,{previewPosition:"none",theme:o,data:fi,onEmojiSelect:a=>{e(a.native),l(!1)}}))))}var tn=Qt.create({name:"emoji",inline:!0,group:"inline",selectable:!1,atom:!0,addAttributes(){return{emoji:{default:"\u{1F600}"}}},parseHTML(){return[{tag:"span[data-emoji]"}]},renderHTML({HTMLAttributes:e}){return["span",me(e,{class:"emoji-big","data-emoji":e.emoji}),e.emoji]}});function tt({content:e="",maxLength:t=3e3,onChange:n,onSubmit:r,colorScheme:s="light"}){let[o,i]=Ce(0),[l,a]=Ce(!1),[c,m]=Ce(!1),[d,p]=Ce(!1),u=()=>{if(!f)return;let g=f.getHTML();f.getText().trim()&&(r?.(g),f.commands.clearContent(),f.commands.focus(),i(0),a(!1))},h=(g,v)=>v.key==="Enter"&&!v.shiftKey?(v.preventDefault(),u(),!0):v.key==="Enter"&&v.shiftKey?(v.preventDefault(),f?.commands.setHardBreak(),!0):!1,f=Si({extensions:[Ti,tn,en,Ei,ki,wi,bi,Mi.configure({types:["heading","paragraph"]})],content:e,editorProps:{handleKeyDown:h},onUpdate:({editor:g})=>{let v=g.getHTML(),y=v.replace(/(<br\s*\/?>\s*){3,}/g,"<br><br>");if(y!==v){let{from:M,to:S}=g.state.selection;g.commands.setContent(y),g.commands.setTextSelection({from:Math.min(M,g.state.doc.content.size),to:Math.min(S,g.state.doc.content.size)});return}let k=g.getText(),E=k.trim().length>0;i(k.length),a(E),m(t?k.length>=t:!1),n?.(g.getHTML())},immediatelyRender:!1});return T.createElement(T.Fragment,null,T.createElement(j,{editor:f,w:"100%",className:"mrchat-richTextEditorContainer"},T.createElement(j.Content,null),T.createElement(j.Toolbar,{sticky:!0,stickyOffset:"var(--docs-header-height)"},T.createElement("div",{className:"mrchat-mainActionContainer"},T.createElement(et,{colorScheme:s,onSelect:g=>{f?.chain().focus().insertContent({type:"emoji",attrs:{emoji:g}}).run()},action:T.createElement(pe,{radius:"lg",variant:"subtle","aria-label":"add",className:"mrchat-mainActionEmojiIcon"},T.createElement(yi,null))}),T.createElement(pe,{radius:"lg",variant:"subtle","aria-label":"text_format",className:"mrchat-mainTextFormatIcon",onClick:()=>p(g=>!g)},T.createElement(xi,{stroke:1.7})),T.createElement(pe,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-mainSendMsgIcon",onClick:u,disabled:!l},T.createElement(nn,{size:18}))),T.createElement(pe,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-sm-mainSendMsgIcon",onClick:u,disabled:!l},T.createElement(nn,{size:18})),d&&T.createElement(T.Fragment,null,T.createElement(j.ControlsGroup,null,T.createElement(j.Bold,null),T.createElement(j.Italic,null),T.createElement(j.Underline,null),T.createElement(j.Strikethrough,null),T.createElement(j.Code,null),T.createElement(j.Highlight,null)),T.createElement(j.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},T.createElement(j.BulletList,null),T.createElement(j.OrderedList,null),T.createElement(oe,{trigger:"hover",openDelay:200},T.createElement(oe.Target,null,T.createElement(pe,{variant:"outline",size:"md",className:"mrchat-customToolActionItem"},T.createElement(rn,{size:16,stroke:1.5}))),T.createElement(oe.Dropdown,null,T.createElement(oe.Item,{onClick:()=>f?.chain().focus().setTextAlign("left").run()},T.createElement(rn,{size:14})),T.createElement(oe.Item,{onClick:()=>f?.chain().focus().setTextAlign("center").run()},T.createElement(gi,{size:14})),T.createElement(oe.Item,{onClick:()=>f?.chain().focus().setTextAlign("right").run()},T.createElement(vi,{size:14})))),T.createElement(j.Link,null)),T.createElement(j.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},T.createElement(j.ClearFormatting,null)))),c&&T.createElement("div",{style:{textAlign:"right",color:"red",fontSize:12,marginTop:4}},"Character limit reached (",o,"/",t,")")))}import{useDispatch as Di,useSelector as zi}from"react-redux";import z,{useEffect as dn,useState as st}from"react";import Oi from"dompurify";import nt,{useRef as Ie,useEffect as on}from"react";function sn({data:e,renderItem:t,loadMore:n,hasMore:r,scrollToBottomTrigger:s}){let o=Ie(null),i=Ie(!1),l=Ie(!0),a=Ie(0);on(()=>{let d=o.current;d&&setTimeout(()=>{d.scrollTop=d.scrollHeight},100)},[s]),on(()=>{let d=o.current;!d||!e.length||(l.current&&(d.scrollTop=d.scrollHeight,l.current=!1),a.current=e.length)},[e]);let c=()=>{let d=o.current;d&&d.scrollTop<50&&r&&!i.current&&m()},m=async()=>{let d=o.current;if(!d||i.current||!r)return;i.current=!0;let p=d.scrollHeight,u=d.scrollTop;await n(),setTimeout(()=>{let f=d.scrollHeight-p;d.scrollTop=u+f,i.current=!1},50)};return nt.createElement("div",{ref:o,onScroll:c,className:"mrchat-messageScroll"},nt.createElement("div",{className:"mrchat-messageScrollContent"},e.map((d,p)=>nt.createElement("div",{key:d?.id||p},t(d,p)))))}import R,{useEffect as Ci,useState as an}from"react";import{Avatar as Ii,Text as rt}from"@mantine/core";import{IconArrowLeft as Ai}from"@tabler/icons-react";function ot({opened:e,onClose:t,user:n,onDeleteMessages:r,onBlock:s}){let[o,i]=an(e),[l,a]=an(!1);Ci(()=>{e&&i(!0)},[e]);let c=()=>{i(!1),setTimeout(t,250)};return!e&&!o?null:R.createElement(R.Fragment,null,R.createElement("div",{className:"mrchat-overlay",onClick:c},R.createElement("div",{className:`mrchat-drawer ${o?"mrchat-open":"mrchat-close"}`,onClick:m=>m.stopPropagation()},R.createElement("div",{className:"mrchat-header"},R.createElement("div",{className:"mrchat-backBtn",onClick:c},R.createElement(Ai,{size:20})),R.createElement(rt,{fw:600},"Contact info")),R.createElement("div",{className:"mrchat-profileSection"},R.createElement(Ii,{src:n?.avatar,size:150,radius:"xl",style:{cursor:"pointer"},onClick:()=>n?.avatar?a(!0):{}}),R.createElement(rt,{fw:700,size:"lg",mt:"sm"},n?.displayName),R.createElement(rt,{size:"sm",c:"dimmed"},"@",n?.username)))),l&&R.createElement("div",{className:"mrchat-imagePreview",onClick:()=>a(!1)},R.createElement("img",{src:n?.avatar,alt:"profile"})))}function un({chatId:e,enableChat:t,senderDetails:n,receiverDetails:r,onChatInitialized:s,onBack:o,showBackButton:i,colorScheme:l}){let a=Di(),c=zi(S=>S.chat.messageList),[m,d]=st(0),[p,u]=st(0),[h,f]=st(!1),g=c?.rows?.data||[],v=g.length===0,y=()=>{let S=c?.hasMore;if(!e||!S)return;let I=m+1;a(Le({chatId:e,page:I,userId:n?.userId})),d(I)};dn(()=>{e&&(d(0),a(Le({chatId:e,page:0,userId:n?.userId})))},[e]),dn(()=>{if(!n?.userId||!Z())return;let S=K(n?.userId||"");if(!S)return;let I=C=>{C.chatId===e&&a(De({id:Date.now(),chatId:C.chatId,message:C.message,sender:C.sender,recipient:C.recipient,type:C.type,status:C.status,createdAt:C.time}))};return S.on("newmessage",I),()=>{S.off("newmessage",I)}},[e,n?.userId]);let k=S=>{let I=K(n?.userId||""),C={message:S,sender:n?.userId,receiver:r?.userId,type:"text",username:n?.username};if(!c?.rows?.data?.length){I?.emit("initializeNewChat",{...C,senderUserDetails:{userId:n?.userId,username:n?.username,displayName:n?.displayName,avatar:n?.avatar},receiverUserDetails:{userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar}},L=>{if(L?.status==="success"){let{data:A}=L;a(ae({id:Date.now(),chatId:A.chatId,message:A.message,sender:A.sender,recipient:A.recipient,type:A.type,status:A.status,createdAt:new Date(A.time).getTime(),updatedAt:new Date(A.time).getTime(),userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar})),a(De({id:Date.now(),chatId:A.chatId,message:A.message,sender:A.sender,recipient:A.recipient,type:A.type,status:A.status,createdAt:Date.now()})),s?.(A)}else console.log("Failed to initialize chat",L?.error)});return}I?.emit("privatemessage",{...C,chatId:e}),u(L=>L+1)},E=()=>{c.hasMore&&y()},M=()=>{!e||!n?.userId||a(ft({chatId:e,userId:n?.userId}))};return z.createElement("div",{className:"mrchat-mainArea"},z.createElement("div",{className:"mrchat-chatHeader"},i&&o&&z.createElement(Pi,{variant:"subtle",className:"mrchat-backButton",onClick:o},z.createElement(Ni,{size:20})),r&&z.createElement(z.Fragment,null,z.createElement("div",{className:"mrchat-receiverInfo",onClick:()=>f(!0)},r?.avatar?z.createElement(ln,{src:r.avatar,size:36,radius:"xl"}):z.createElement(ln,{key:r?.displayName||r?.username,name:r?.displayName||r?.username,color:"initials"}),z.createElement(cn,{fw:600,size:"md"},r?.displayName||r?.username)))),z.createElement("div",{className:"mrchat-messageArea"},v?z.createElement("div",{className:"mrchat-emptyState"},z.createElement("div",{className:"mrchat-encryptionMinimal"},z.createElement(Li,{size:20,stroke:1.8}),z.createElement(cn,{className:"mrchat-encryptionText",size:"md"},"End-to-end encrypted"))):z.createElement(sn,{data:g,hasMore:c?.hasMore,loadMore:E,scrollToBottomTrigger:p,renderItem:(S,I)=>{let C=S?.sender===n?.userId,D=new Date(S?.createdAt),L=g[I-1],A=I===0||new Date(L?.createdAt).toDateString()!==D.toDateString(),F=new Date,B=new Date;B.setDate(F.getDate()-1);let H=D.toDateString()===F.toDateString(),$=D.toDateString()===B.toDateString(),V="";H?V="Today":$?V="Yesterday":V=D.toLocaleDateString(void 0,{weekday:"short",month:"short",day:"numeric"});let fe=D.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!1});return z.createElement("div",{key:S?.id+"_"+I},A&&z.createElement("div",{className:"mrchat-dateSeparator"},V),z.createElement("div",{style:{borderRadius:8},className:`mrchat-messageBubble ${C?"mrchat-outgoing":"mrchat-incoming"}`},z.createElement("div",{className:"mrchat-messageContent",dangerouslySetInnerHTML:{__html:Oi.sanitize(S?.message)}}),z.createElement("div",{className:"mrchat-messageTime"},fe)))}})),(e||t)&&z.createElement("div",{className:"mrchat-inputBar"},z.createElement(tt,{onSubmit:k,colorScheme:l})),z.createElement(ot,{opened:h,onClose:()=>f(!1),user:{avatar:r?.avatar,username:r?.username,displayName:r?.displayName},onDeleteMessages:()=>{M()},onBlock:()=>{console.log("block user")}}))}import{useDispatch as Vi,useSelector as Ki}from"react-redux";import N,{useEffect as Y,useState as W}from"react";import Bi from"react";import{Virtuoso as $i}from"react-virtuoso";function mn({data:e,itemContent:t,height:n="100%",startReached:r,endReached:s,...o}){return Bi.createElement($i,{style:{height:n},data:e,startReached:r,endReached:s,itemContent:(i,l)=>t(i,l),...o})}import Ji from"dompurify";var pn=e=>{if(!e)return"";let t=new Date(e),n=new Date,r=new Date;r.setDate(n.getDate()-1);let s=t.toDateString()===n.toDateString(),o=t.toDateString()===r.toDateString(),i=t.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1});return s?i:o?"Yesterday":t.toLocaleDateString(void 0,{day:"numeric",month:"short"})};function hn({currentUser:e,onSearchUsers:t,colorScheme:n,openChatByUserDetails:r,handleCallAfterOpenChat:s,isLoading:o=!1}){let[i,{open:l,close:a}]=Wi(!1),c=Vi(),m=Ki(b=>b.chat.messagedUserList),[d,p]=W(0),[u,h]=W(""),[f,g]=W(!1),[v,y]=W(""),[k,E]=W(),[M,S]=W(),[I,C]=W([]),[D,L]=W(!1),[A,F]=W(e),[B,H]=W(!1),[$,V]=W(!1);Y(()=>{e?.userId&&F(e)},[e?.userId]),Y(()=>{e?.userId&&c(Ne({userId:e.userId,page:0}))},[e?.userId,c]),Y(()=>{if(typeof window>"u")return;let b=window.matchMedia("(max-width: 599px)"),w=P=>{let U="matches"in P?P.matches:b.matches;H(U),U||V(!1)};return w(b),b.addEventListener?b.addEventListener("change",w):b.addListener(w),()=>{b.removeEventListener?b.removeEventListener("change",w):b.removeListener(w)}},[]);let fe=(b,w)=>{let P=b;if(!P?.userId)return;let U=m?.rows?.data?.find(he=>he.userId===P.userId);if(U){Ae(U),a(),y(""),w&&w();return}c(ae({userId:P?.userId,username:P?.username,displayName:P?.displayName,avatar:P?.avatar})),E(P),a(),y(""),c(ce()),h(""),g(!0),B&&V(!0),w&&w()};Y(()=>{if(!A?.userId)return;let b=K(A.userId);b&&(b.connected||b.connect())},[A?.userId]),Y(()=>{if(!A?.userId)return;let b=K(A.userId);if(!b)return;let w=P=>{P.sender!==A.userId&&c(ae({message:P.message,chatId:P.chatId,userId:P.sender,username:P.userDetails.username,displayName:P.userDetails.displayName,avatar:P.userDetails.avatar}))};return b.on("newChat",w),()=>{b.off("newChat",w)}},[c,A?.userId]),Y(()=>{if(!A?.userId)return;let b=K(A?.userId||"");if(!b)return;let w=P=>{if(!m?.rows?.data)return;let U=m.rows.data.map(X=>{if(X.chatId===P.chatId){let Mn=P.chatId===u;return{...X,message:P.message,updatedAt:new Date().toISOString(),unreadCount:Mn?0:(X.unreadCount||0)+1}}return X}),he=U.findIndex(X=>X.chatId===P.chatId);if(he!==-1){let X=U.splice(he,1)[0];U.unshift(X)}console.log("Updated",U,P),c(ie({...m,rows:{...m.rows,data:U}}))};return b.on("newMessageNotification",w),()=>{b.off("newMessageNotification",w)}},[m,A?.userId]);let yn=()=>{if(!m?.hasMore||!e?.userId)return;let b=d+1;p(b),c(Ne({userId:e.userId,page:b}))},Ae=b=>{if(!A?.userId)return;let w=K(A.userId);if(!w)return;E({userId:b.userId,username:b.username,displayName:b.displayName,avatar:b.avatar}),w.emit("joinChat",{chatId:b.chatId}),h(b?.chatId||""),c(ce());let P=m.rows.data.map(U=>U.chatId===b.chatId?{...U,unreadCount:0}:U);B&&V(!0),c(ie({...m,rows:{...m.rows,data:P}}))};Y(()=>{r&&fe(r,s)},[r?.userId]);let xn=b=>{y(b)},bn=()=>{V(!1)};Y(()=>{if(!v.trim()){C([]),L(!1);return}if(!t){C([]),L(!1);return}let b=!1,w=setTimeout(async()=>{try{L(!0),C([]);let P=await Promise.resolve(t(v));if(b)return;C(P)}finally{b||L(!1)}},400);return()=>{b=!0,clearTimeout(w)}},[v,t]);let wn=b=>{let w=document.createElement("div");return w.innerHTML=b,w.textContent||""},kn=I.map(b=>({value:b.username,label:b.displayName||b.username,user:b}));return N.createElement("div",{className:"mrchat-chatWrapper"},o&&N.createElement("div",{className:"mrchat-loadingOverlay"},N.createElement(fn,{size:"md"})),N.createElement(Hi,{opened:i,onClose:()=>{a(),y(""),C([]),L(!1)},title:"Search User",centered:!0,withCloseButton:!0},N.createElement(Ui,{mb:12,label:"Search User to Chat",placeholder:"Type username to search...",limit:20,data:kn,value:v,onChange:xn,rightSection:D?N.createElement(fn,{size:"xs"}):void 0,rightSectionWidth:28,onOptionSubmit:b=>{let w=I.find(P=>P.username===b);w&&(y(""),S(w),C([]),L(!1))},renderOption:({option:b})=>{let w=b.user;return N.createElement(Ri,{gap:"sm"},N.createElement(it,{src:w.avatar,size:36,radius:"xl"}),N.createElement("div",null,N.createElement(se,{size:"sm"},w.displayName||w.username),w.displayName&&N.createElement(se,{size:"xs",opacity:.5},"@",w.username)))}}),N.createElement(_i,{fullWidth:!0,onClick:()=>fe(M),disabled:!M?.username},"Start Chat")),N.createElement("div",{className:"mrchat-chatContainer"},N.createElement("div",{className:"mrchat-sidebar "+(B&&$?"mrchat-hiddenOnMobile":"")},N.createElement("div",{className:"mrchat-sidebarTop"},N.createElement("div",{className:"mrchat-topBar"},N.createElement(se,{size:"xs",c:"dimmed",mt:"sm",mb:"xs",fw:600,ml:8},"All Messages"),N.createElement("div",{className:"mrchat-topActions"},N.createElement(ji,{variant:"subtle",onClick:()=>{S(null),y(""),C([]),l()},radius:"lg"},N.createElement(Fi,{size:20,stroke:3}))))),N.createElement("div",{className:"mrchat-scrollWrapper"},N.createElement(mn,{data:m?.rows?.data||[],endReached:yn,itemContent:(b,w)=>{let P=w.chatId===u;return N.createElement("div",{className:`mrchat-chatItem ${P?"mrchat-activeChatItem":""}`,onClick:()=>{if(P&&B){V(!0);return}P||Ae(w)}},w.avatar?N.createElement(it,{src:w.avatar,size:36,radius:"xl"}):N.createElement(it,{key:w.displayName||w.username,name:w.displayName||w.username,color:"initials"}),N.createElement("div",{className:"mrchat-chatInfo"},N.createElement(se,{className:"mrchat-chatLabelItem",truncate:!0},w.displayName||w.username),w.unreadCount>0&&N.createElement("div",{className:"mrchat-unreadBadge"},w.unreadCount||10),N.createElement("div",{className:"mrchat-messagePreview"},N.createElement(se,{truncate:!0,size:"xs",c:"dimmed",style:{maxWidth:150},className:"mrchat-messagePreviewContent"},wn(Ji.sanitize(w.message))),N.createElement(se,{size:"xs",c:"dimmed",className:"mrchat-messagePreviewTime"},pn(w.updatedAt||w.createdAt)))))}}))),N.createElement("div",{className:"mrchat-mainAreaWrapper "+(B&&!$?"mrchat-hiddenOnMobile":"")},N.createElement(un,{chatId:u,enableChat:f,senderDetails:A,receiverDetails:k,onBack:bn,showBackButton:B,onChatInitialized:b=>{Ae({chatId:b.chatId,userId:k?.userId,username:k?.username,displayName:k?.displayName,avatar:k?.avatar})},colorScheme:n}))))}import{useEffect as qi}from"react";import{useDispatch as Xi}from"react-redux";function gn(){let e=Xi();return qi(()=>()=>{e(ht())},[e]),null}function vn({colorScheme:e,primaryColor:t="customBrand",darkColor:n,apiKey:r,baseUrl:s,socketUrl:o,openChatByUserDetails:i,handleCallAfterOpenChat:l,isLoading:a=!1,...c}){let m=lt(t),d=[r?.trim()?null:"apiKey",s?.trim()?null:"baseUrl",o?.trim()?null:"socketUrl"].filter(Boolean),p=d.length===0;return Gi(()=>{typeof window>"u"||!p||ut({baseUrl:s,socketUrl:o,apiKey:r})},[r,s,o,p]),Yi(()=>{if(typeof document>"u"||!n)return;let u=document.body.style.backgroundColor;return document.body.style.backgroundColor=e==="dark"?n:"",document.documentElement.style.setProperty("--mantine-color-body",e==="dark"?n:""),()=>{document.body.style.backgroundColor=u,document.documentElement.style.removeProperty("--mantine-color-body")}},[e,n]),p?G.createElement(yt,null,G.createElement(wt,null,G.createElement(gn,null),G.createElement(Qi,{defaultColorScheme:e??"light",forceColorScheme:e,theme:m},G.createElement(Zi,null),G.createElement(hn,{handleCallAfterOpenChat:l,colorScheme:e,openChatByUserDetails:i,isLoading:a,...c})))):G.createElement("div",{role:"alert",style:{minHeight:"100vh",display:"flex",alignItems:"center",justifyContent:"center",padding:16}},G.createElement("div",{style:{padding:16,borderRadius:8,backgroundColor:"#fef3f2",color:"#b42318",fontWeight:600,textAlign:"center"}},"Missing required configuration: ",d.join(", ")))}export{vn as MrChat};
|
|
21
|
+
${h}`}}),a}function ai(e,t,n={}){let{state:r}=t,{doc:s,tr:o}=r,i=e;s.descendants((l,a)=>{let c=o.mapping.map(a),m=o.mapping.map(a)+l.nodeSize,d=null;if(l.marks.forEach(u=>{if(u!==i)return!1;d=u}),!d)return;let p=!1;if(Object.keys(n).forEach(u=>{n[u]!==d.attrs[u]&&(p=!0)}),p){let u=e.type.create({...e.attrs,...n});o.removeMark(c,m,e.type),o.addMark(c,m,u)}}),o.docChanged&&t.view.dispatch(o)}var Qt=class Zt extends qe{constructor(){super(...arguments),this.type="node"}static create(t={}){let n=typeof t=="function"?t():t;return new Zt(n)}configure(t){return super.configure(t)}extend(t){let n=typeof t=="function"?t():t;return super.extend(n)}};var ci=Xe.create({name:"underline",addOptions(){return{HTMLAttributes:{}}},parseHTML(){return[{tag:"u"},{style:"text-decoration",consuming:!1,getAttrs:e=>e.includes("underline")?{}:!1}]},renderHTML({HTMLAttributes:e}){return["u",me(this.options.HTMLAttributes,e),0]},parseMarkdown(e,t){return t.applyMark(this.name||"underline",t.parseInline(e.tokens||[]))},renderMarkdown(e,t){return`++${t.renderChildren(e)}++`},markdownTokenizer:{name:"underline",level:"inline",start(e){return e.indexOf("++")},tokenize(e,t,n){let s=/^(\+\+)([\s\S]+?)(\+\+)/.exec(e);if(!s)return;let o=s[2].trim();return{type:"underline",raw:s[0],text:o,tokens:n.inlineTokens(o)}}},addCommands(){return{setUnderline:()=>({commands:e})=>e.setMark(this.name),toggleUnderline:()=>({commands:e})=>e.toggleMark(this.name),unsetUnderline:()=>({commands:e})=>e.unsetMark(this.name)}},addKeyboardShortcuts(){return{"Mod-u":()=>this.editor.commands.toggleUnderline(),"Mod-U":()=>this.editor.commands.toggleUnderline()}}}),en=ci;import{useEditor as Si}from"@tiptap/react";import Ti from"@tiptap/starter-kit";import{Link as Ei,RichTextEditor as j}from"@mantine/tiptap";import{ActionIcon as pe,Menu as oe}from"@mantine/core";import te,{useState as li,lazy as di,Suspense as ui,cloneElement as mi}from"react";import{Popover as Ze,Skeleton as pi}from"@mantine/core";import fi from"@emoji-mart/data";var hi=di(()=>import("@emoji-mart/react"));function et({onSelect:e,action:t,size:n=320,offset:r=8,position:s="bottom-start",colorScheme:o="light"}){let[i,l]=li(!1);return te.createElement(Ze,{opened:i,onChange:l,width:n,position:s,offset:r,withArrow:!0,shadow:"md",trapFocus:!1,closeOnEscape:!0},te.createElement(Ze.Target,null,mi(t,{onClick:a=>{t.props?.onClick?.(a),l(c=>!c)}})),te.createElement(Ze.Dropdown,{p:0},te.createElement(ui,{fallback:te.createElement("div",{style:{padding:12,width:320}},te.createElement(pi,{height:280,radius:"md"}))},te.createElement(hi,{previewPosition:"none",theme:o,data:fi,onEmojiSelect:a=>{e(a.native),l(!1)}}))))}var tn=Qt.create({name:"emoji",inline:!0,group:"inline",selectable:!1,atom:!0,addAttributes(){return{emoji:{default:"\u{1F600}"}}},parseHTML(){return[{tag:"span[data-emoji]"}]},renderHTML({HTMLAttributes:e}){return["span",me(e,{class:"emoji-big","data-emoji":e.emoji}),e.emoji]}});function tt({content:e="",maxLength:t=3e3,onChange:n,onSubmit:r,colorScheme:s="light"}){let[o,i]=Ce(0),[l,a]=Ce(!1),[c,m]=Ce(!1),[d,p]=Ce(!1),u=()=>{if(!f)return;let g=f.getHTML();f.getText().trim()&&(r?.(g),f.commands.clearContent(),f.commands.focus(),i(0),a(!1))},h=(g,v)=>v.key==="Enter"&&!v.shiftKey?(v.preventDefault(),u(),!0):v.key==="Enter"&&v.shiftKey?(v.preventDefault(),f?.commands.setHardBreak(),!0):!1,f=Si({extensions:[Ti,tn,en,Ei,ki,wi,bi,Mi.configure({types:["heading","paragraph"]})],content:e,editorProps:{handleKeyDown:h},onUpdate:({editor:g})=>{let v=g.getHTML(),y=v.replace(/(<br\s*\/?>\s*){3,}/g,"<br><br>");if(y!==v){let{from:M,to:S}=g.state.selection;g.commands.setContent(y),g.commands.setTextSelection({from:Math.min(M,g.state.doc.content.size),to:Math.min(S,g.state.doc.content.size)});return}let k=g.getText(),E=k.trim().length>0;i(k.length),a(E),m(t?k.length>=t:!1),n?.(g.getHTML())},immediatelyRender:!1});return T.createElement(T.Fragment,null,T.createElement(j,{editor:f,w:"100%",className:"mrchat-richTextEditorContainer"},T.createElement(j.Content,null),T.createElement(j.Toolbar,{sticky:!0,stickyOffset:"var(--docs-header-height)"},T.createElement("div",{className:"mrchat-mainActionContainer"},T.createElement(et,{colorScheme:s,onSelect:g=>{f?.chain().focus().insertContent({type:"emoji",attrs:{emoji:g}}).run()},action:T.createElement(pe,{radius:"lg",variant:"subtle","aria-label":"add",className:"mrchat-mainActionEmojiIcon"},T.createElement(yi,null))}),T.createElement(pe,{radius:"lg",variant:"subtle","aria-label":"text_format",className:"mrchat-mainTextFormatIcon",onClick:()=>p(g=>!g)},T.createElement(xi,{stroke:1.7})),T.createElement(pe,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-mainSendMsgIcon",onClick:u,disabled:!l},T.createElement(nn,{size:18}))),T.createElement(pe,{radius:"lg",variant:"filled","aria-label":"send",className:"mrchat-sm-mainSendMsgIcon",onClick:u,disabled:!l},T.createElement(nn,{size:18})),d&&T.createElement(T.Fragment,null,T.createElement(j.ControlsGroup,null,T.createElement(j.Bold,null),T.createElement(j.Italic,null),T.createElement(j.Underline,null),T.createElement(j.Strikethrough,null),T.createElement(j.Code,null),T.createElement(j.Highlight,null)),T.createElement(j.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},T.createElement(j.BulletList,null),T.createElement(j.OrderedList,null),T.createElement(oe,{trigger:"hover",openDelay:200},T.createElement(oe.Target,null,T.createElement(pe,{variant:"outline",size:"md",className:"mrchat-customToolActionItem"},T.createElement(rn,{size:16,stroke:1.5}))),T.createElement(oe.Dropdown,null,T.createElement(oe.Item,{onClick:()=>f?.chain().focus().setTextAlign("left").run()},T.createElement(rn,{size:14})),T.createElement(oe.Item,{onClick:()=>f?.chain().focus().setTextAlign("center").run()},T.createElement(gi,{size:14})),T.createElement(oe.Item,{onClick:()=>f?.chain().focus().setTextAlign("right").run()},T.createElement(vi,{size:14})))),T.createElement(j.Link,null)),T.createElement(j.ControlsGroup,{className:"mrchat-secondRichTextEditorToolBar"},T.createElement(j.ClearFormatting,null)))),c&&T.createElement("div",{style:{textAlign:"right",color:"red",fontSize:12,marginTop:4}},"Character limit reached (",o,"/",t,")")))}import{useDispatch as Di,useSelector as zi}from"react-redux";import z,{useEffect as dn,useState as st}from"react";import Oi from"dompurify";import nt,{useRef as Ie,useEffect as on}from"react";function sn({data:e,renderItem:t,loadMore:n,hasMore:r,scrollToBottomTrigger:s}){let o=Ie(null),i=Ie(!1),l=Ie(!0),a=Ie(0);on(()=>{let d=o.current;d&&setTimeout(()=>{d.scrollTop=d.scrollHeight},100)},[s]),on(()=>{let d=o.current;!d||!e.length||(l.current&&(d.scrollTop=d.scrollHeight,l.current=!1),a.current=e.length)},[e]);let c=()=>{let d=o.current;d&&d.scrollTop<50&&r&&!i.current&&m()},m=async()=>{let d=o.current;if(!d||i.current||!r)return;i.current=!0;let p=d.scrollHeight,u=d.scrollTop;await n(),setTimeout(()=>{let f=d.scrollHeight-p;d.scrollTop=u+f,i.current=!1},50)};return nt.createElement("div",{ref:o,onScroll:c,className:"mrchat-messageScroll"},nt.createElement("div",{className:"mrchat-messageScrollContent"},e.map((d,p)=>nt.createElement("div",{key:d?.id||p},t(d,p)))))}import R,{useEffect as Ci,useState as an}from"react";import{Avatar as Ii,Text as rt}from"@mantine/core";import{IconArrowLeft as Ai}from"@tabler/icons-react";function ot({opened:e,onClose:t,user:n,onDeleteMessages:r,onBlock:s}){let[o,i]=an(e),[l,a]=an(!1);Ci(()=>{e&&i(!0)},[e]);let c=()=>{i(!1),setTimeout(t,250)};return!e&&!o?null:R.createElement(R.Fragment,null,R.createElement("div",{className:"mrchat-overlay",onClick:c},R.createElement("div",{className:`mrchat-drawer ${o?"mrchat-open":"mrchat-close"}`,onClick:m=>m.stopPropagation()},R.createElement("div",{className:"mrchat-header"},R.createElement("div",{className:"mrchat-backBtn",onClick:c},R.createElement(Ai,{size:20})),R.createElement(rt,{fw:600},"Contact info")),R.createElement("div",{className:"mrchat-profileSection"},R.createElement(Ii,{src:n?.avatar,size:150,radius:"xl",style:{cursor:"pointer"},onClick:()=>n?.avatar?a(!0):{}}),R.createElement(rt,{fw:700,size:"lg",mt:"sm"},n?.displayName),R.createElement(rt,{size:"sm",c:"dimmed"},"@",n?.username)))),l&&R.createElement("div",{className:"mrchat-imagePreview",onClick:()=>a(!1)},R.createElement("img",{src:n?.avatar,alt:"profile"})))}function un({chatId:e,enableChat:t,senderDetails:n,receiverDetails:r,onChatInitialized:s,onBack:o,showBackButton:i,colorScheme:l}){let a=Di(),c=zi(S=>S.chat.messageList),[m,d]=st(0),[p,u]=st(0),[h,f]=st(!1),g=c?.rows?.data||[],v=g.length===0,y=()=>{let S=c?.hasMore;if(!e||!S)return;let I=m+1;a(Le({chatId:e,page:I,userId:n?.userId})),d(I)};dn(()=>{e&&(d(0),a(Le({chatId:e,page:0,userId:n?.userId})))},[e]),dn(()=>{if(!n?.userId||!Z())return;let S=K(n?.userId||"");if(!S)return;let I=C=>{C.chatId===e&&a(De({id:Date.now(),chatId:C.chatId,message:C.message,sender:C.sender,recipient:C.recipient,type:C.type,status:C.status,createdAt:C.time}))};return S.on("newmessage",I),()=>{S.off("newmessage",I)}},[e,n?.userId]);let k=S=>{let I=K(n?.userId||""),C={message:S,sender:n?.userId,receiver:r?.userId,type:"text",username:n?.username};if(!c?.rows?.data?.length){I?.emit("initializeNewChat",{...C,senderUserDetails:{userId:n?.userId,username:n?.username,displayName:n?.displayName,avatar:n?.avatar},receiverUserDetails:{userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar}},L=>{if(L?.status==="success"){let{data:A}=L;a(ae({id:Date.now(),chatId:A.chatId,message:A.message,sender:A.sender,recipient:A.recipient,type:A.type,status:A.status,createdAt:new Date(A.time).getTime(),updatedAt:new Date(A.time).getTime(),userId:r?.userId,username:r?.username,displayName:r?.displayName,avatar:r?.avatar})),a(De({id:Date.now(),chatId:A.chatId,message:A.message,sender:A.sender,recipient:A.recipient,type:A.type,status:A.status,createdAt:Date.now()})),s?.(A)}else console.log("Failed to initialize chat",L?.error)});return}I?.emit("privatemessage",{...C,chatId:e}),u(L=>L+1)},E=()=>{c.hasMore&&y()},M=()=>{!e||!n?.userId||a(ft({chatId:e,userId:n?.userId}))};return z.createElement("div",{className:"mrchat-mainArea"},z.createElement("div",{className:"mrchat-chatHeader"},i&&o&&z.createElement(Pi,{variant:"subtle",className:"mrchat-backButton",onClick:o},z.createElement(Ni,{size:20})),r&&z.createElement(z.Fragment,null,z.createElement("div",{className:"mrchat-receiverInfo",onClick:()=>f(!0)},r?.avatar?z.createElement(ln,{src:r.avatar,size:36,radius:"xl"}):z.createElement(ln,{key:r?.displayName||r?.username,name:r?.displayName||r?.username,color:"initials"}),z.createElement(cn,{fw:600,size:"md"},r?.displayName||r?.username)))),z.createElement("div",{className:"mrchat-messageArea"},v?z.createElement("div",{className:"mrchat-emptyState"},z.createElement("div",{className:"mrchat-encryptionMinimal"},z.createElement(Li,{size:20,stroke:1.8}),z.createElement(cn,{className:"mrchat-encryptionText",size:"md"},"End-to-end encrypted"))):z.createElement(sn,{data:g,hasMore:c?.hasMore,loadMore:E,scrollToBottomTrigger:p,renderItem:(S,I)=>{let C=S?.sender===n?.userId,D=new Date(S?.createdAt),L=g[I-1],A=I===0||new Date(L?.createdAt).toDateString()!==D.toDateString(),F=new Date,B=new Date;B.setDate(F.getDate()-1);let H=D.toDateString()===F.toDateString(),$=D.toDateString()===B.toDateString(),V="";H?V="Today":$?V="Yesterday":V=D.toLocaleDateString(void 0,{weekday:"short",month:"short",day:"numeric"});let fe=D.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!1});return z.createElement("div",{key:S?.id+"_"+I},A&&z.createElement("div",{className:"mrchat-dateSeparator"},V),z.createElement("div",{style:{borderRadius:8},className:`mrchat-messageBubble ${C?"mrchat-outgoing":"mrchat-incoming"}`},z.createElement("div",{className:"mrchat-messageContent",dangerouslySetInnerHTML:{__html:Oi.sanitize(S?.message)}}),z.createElement("div",{className:"mrchat-messageTime"},fe)))}})),(e||t)&&z.createElement("div",{className:"mrchat-inputBar"},z.createElement(tt,{onSubmit:k,colorScheme:l})),z.createElement(ot,{opened:h,onClose:()=>f(!1),user:{avatar:r?.avatar,username:r?.username,displayName:r?.displayName},onDeleteMessages:()=>{M()},onBlock:()=>{console.log("block user")}}))}import{useDispatch as Vi,useSelector as Ki}from"react-redux";import N,{useEffect as Y,useState as W}from"react";import Bi from"react";import{Virtuoso as $i}from"react-virtuoso";function mn({data:e,itemContent:t,height:n="100%",startReached:r,endReached:s,...o}){return Bi.createElement($i,{style:{height:n},data:e,startReached:r,endReached:s,itemContent:(i,l)=>t(i,l),...o})}import Ji from"dompurify";var pn=e=>{if(!e)return"";let t=new Date(e),n=new Date,r=new Date;r.setDate(n.getDate()-1);let s=t.toDateString()===n.toDateString(),o=t.toDateString()===r.toDateString(),i=t.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1});return s?i:o?"Yesterday":t.toLocaleDateString(void 0,{day:"numeric",month:"short"})};function hn({currentUser:e,onSearchUsers:t,colorScheme:n,openChatByUserDetails:r,handleCallAfterOpenChat:s,isLoading:o=!1}){let[i,{open:l,close:a}]=Wi(!1),c=Vi(),m=Ki(b=>b.chat.messagedUserList),[d,p]=W(0),[u,h]=W(""),[f,g]=W(!1),[v,y]=W(""),[k,E]=W(),[M,S]=W(),[I,C]=W([]),[D,L]=W(!1),[A,F]=W(e),[B,H]=W(!1),[$,V]=W(!1);Y(()=>{e?.userId&&F(e)},[e?.userId]),Y(()=>{e?.userId&&c(Ne({userId:e.userId,page:0}))},[e?.userId,c]),Y(()=>{if(typeof window>"u")return;let b=window.matchMedia("(max-width: 599px)"),w=P=>{let U="matches"in P?P.matches:b.matches;H(U),U||V(!1)};return w(b),b.addEventListener?b.addEventListener("change",w):b.addListener(w),()=>{b.removeEventListener?b.removeEventListener("change",w):b.removeListener(w)}},[]);let fe=(b,w)=>{let P=b;if(!P?.userId)return;let U=m?.rows?.data?.find(he=>he.userId===P.userId);if(U){Ae(U),a(),y(""),w&&w();return}c(ae({userId:P?.userId,username:P?.username,displayName:P?.displayName,avatar:P?.avatar})),E(P),a(),y(""),c(ce()),h(""),g(!0),B&&V(!0),w&&w()};Y(()=>{if(!A?.userId)return;let b=K(A.userId);b&&(b.connected||b.connect())},[A?.userId]),Y(()=>{if(!A?.userId)return;let b=K(A.userId);if(!b)return;let w=P=>{P.sender!==A.userId&&c(ae({message:P.message,chatId:P.chatId,userId:P.sender,username:P.userDetails.username,displayName:P.userDetails.displayName,avatar:P.userDetails.avatar}))};return b.on("newChat",w),()=>{b.off("newChat",w)}},[c,A?.userId]),Y(()=>{if(!A?.userId)return;let b=K(A?.userId||"");if(!b)return;let w=P=>{if(!m?.rows?.data)return;let U=m.rows.data.map(X=>{if(X.chatId===P.chatId){let Mn=P.chatId===u;return{...X,message:P.message,updatedAt:new Date().toISOString(),unreadCount:Mn?0:(X.unreadCount||0)+1}}return X}),he=U.findIndex(X=>X.chatId===P.chatId);if(he!==-1){let X=U.splice(he,1)[0];U.unshift(X)}console.log("Updated",U,P),c(ie({...m,rows:{...m.rows,data:U}}))};return b.on("newMessageNotification",w),()=>{b.off("newMessageNotification",w)}},[m,A?.userId]);let yn=()=>{if(!m?.hasMore||!e?.userId)return;let b=d+1;p(b),c(Ne({userId:e.userId,page:b}))},Ae=b=>{if(!A?.userId)return;let w=K(A.userId);if(!w)return;E({userId:b.userId,username:b.username,displayName:b.displayName,avatar:b.avatar}),w.emit("joinChat",{chatId:b.chatId}),h(b?.chatId||""),c(ce());let P=m.rows.data.map(U=>U.chatId===b.chatId?{...U,unreadCount:0}:U);B&&V(!0),c(ie({...m,rows:{...m.rows,data:P}}))};Y(()=>{r&&fe(r,s)},[r?.userId]);let xn=b=>{y(b)},bn=()=>{V(!1)};Y(()=>{if(!v.trim()){C([]),L(!1);return}if(!t){C([]),L(!1);return}let b=!1,w=setTimeout(async()=>{try{L(!0),C([]);let P=await Promise.resolve(t(v));if(b)return;C(P)}finally{b||L(!1)}},400);return()=>{b=!0,clearTimeout(w)}},[v,t]);let wn=b=>{let w=document.createElement("div");return w.innerHTML=b,w.textContent||""},kn=I.map(b=>({value:b.username,label:b.displayName||b.username,user:b}));return N.createElement("div",{className:"mrchat-chatWrapper"},o&&N.createElement("div",{className:"mrchat-loadingOverlay"},N.createElement(fn,{size:"md"})),N.createElement(Hi,{opened:i,onClose:()=>{a(),y(""),C([]),L(!1)},title:"Search User to Chat",centered:!0,withCloseButton:!0},N.createElement(Ui,{mb:12,placeholder:"Type username to search...",limit:20,data:kn,value:v,onChange:xn,rightSection:D?N.createElement(fn,{size:"xs"}):void 0,rightSectionWidth:28,onOptionSubmit:b=>{let w=I.find(P=>P.username===b);w&&(y(""),S(w),C([]),L(!1))},renderOption:({option:b})=>{let w=b.user;return N.createElement(Ri,{gap:"sm"},N.createElement(it,{src:w.avatar,size:36,radius:"xl"}),N.createElement("div",null,N.createElement(se,{size:"sm"},w.displayName||w.username),w.displayName&&N.createElement(se,{size:"xs",opacity:.5},"@",w.username)))}}),N.createElement(_i,{fullWidth:!0,onClick:()=>fe(M),disabled:!M?.username},"Start Chat")),N.createElement("div",{className:"mrchat-chatContainer"},N.createElement("div",{className:"mrchat-sidebar "+(B&&$?"mrchat-hiddenOnMobile":"")},N.createElement("div",{className:"mrchat-sidebarTop"},N.createElement("div",{className:"mrchat-topBar"},N.createElement(se,{size:"xs",mt:"sm",mb:"xs",fw:600,ml:8},"All Messages"),N.createElement("div",{className:"mrchat-topActions"},N.createElement(ji,{variant:"subtle",onClick:()=>{S(null),y(""),C([]),l()},radius:"lg"},N.createElement(Fi,{size:20,stroke:3}))))),N.createElement("div",{className:"mrchat-scrollWrapper"},N.createElement(mn,{data:m?.rows?.data||[],endReached:yn,itemContent:(b,w)=>{let P=w.chatId===u;return N.createElement("div",{className:`mrchat-chatItem ${P?"mrchat-activeChatItem":""}`,onClick:()=>{if(P&&B){V(!0);return}P||Ae(w)}},w.avatar?N.createElement(it,{src:w.avatar,size:36,radius:"xl"}):N.createElement(it,{key:w.displayName||w.username,name:w.displayName||w.username,color:"initials"}),N.createElement("div",{className:"mrchat-chatInfo"},N.createElement(se,{className:"mrchat-chatLabelItem",truncate:!0},w.displayName||w.username),w.unreadCount>0&&N.createElement("div",{className:"mrchat-unreadBadge"},w.unreadCount||10),N.createElement("div",{className:"mrchat-messagePreview"},N.createElement(se,{truncate:!0,size:"xs",c:"dimmed",style:{maxWidth:150},className:"mrchat-messagePreviewContent"},wn(Ji.sanitize(w.message))),N.createElement(se,{size:"xs",c:"dimmed",className:"mrchat-messagePreviewTime"},pn(w.updatedAt||w.createdAt)))))}}))),N.createElement("div",{className:"mrchat-mainAreaWrapper "+(B&&!$?"mrchat-hiddenOnMobile":"")},N.createElement(un,{chatId:u,enableChat:f,senderDetails:A,receiverDetails:k,onBack:bn,showBackButton:B,onChatInitialized:b=>{Ae({chatId:b.chatId,userId:k?.userId,username:k?.username,displayName:k?.displayName,avatar:k?.avatar})},colorScheme:n}))))}import{useEffect as qi}from"react";import{useDispatch as Xi}from"react-redux";function gn(){let e=Xi();return qi(()=>()=>{e(ht())},[e]),null}function vn({colorScheme:e,primaryColor:t="customBrand",darkColor:n,apiKey:r,baseUrl:s,socketUrl:o,openChatByUserDetails:i,handleCallAfterOpenChat:l,isLoading:a=!1,...c}){let m=lt(t),d=[r?.trim()?null:"apiKey",s?.trim()?null:"baseUrl",o?.trim()?null:"socketUrl"].filter(Boolean),p=d.length===0;return Gi(()=>{typeof window>"u"||!p||ut({baseUrl:s,socketUrl:o,apiKey:r})},[r,s,o,p]),Yi(()=>{if(typeof document>"u"||!n)return;let u=document.body.style.backgroundColor;return document.body.style.backgroundColor=e==="dark"?n:"",document.documentElement.style.setProperty("--mantine-color-body",e==="dark"?n:""),()=>{document.body.style.backgroundColor=u,document.documentElement.style.removeProperty("--mantine-color-body")}},[e,n]),p?G.createElement(yt,null,G.createElement(wt,null,G.createElement(gn,null),G.createElement(Qi,{defaultColorScheme:e??"light",forceColorScheme:e,theme:m},G.createElement(Zi,null),G.createElement(hn,{handleCallAfterOpenChat:l,colorScheme:e,openChatByUserDetails:i,isLoading:a,...c})))):G.createElement("div",{role:"alert",style:{minHeight:"100vh",display:"flex",alignItems:"center",justifyContent:"center",padding:16}},G.createElement("div",{style:{padding:16,borderRadius:8,backgroundColor:"#fef3f2",color:"#b42318",fontWeight:600,textAlign:"center"}},"Missing required configuration: ",d.join(", ")))}export{vn as MrChat};
|