owncast/static/web/_next/static/chunks/2070-de8f6bee374a48dc.js

(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2070],{32070:function(e,t,s){"use strict";s.r(t),s.d(t,{ChatContainer:function(){return eC}});var a,n,r,o,i,l=s(85893),c=s(26246),d=s(67294),h=s(5152),u=s.n(h),m=s(91951),p=s(59760),x=s.n(p),g=s(94184),_=s.n(g),C=s(94199),f=s(4480),j=s(27722),v=s(99597),y=s(50085),b=s.n(y),N=s(77278);function M(e){let t=new Date(e);if(Number.isNaN(t))return"";let s=(0,N.Xb)(e);if(s>=1){let e=t.toLocaleDateString("en-US",{dateStyle:"medium"});return"".concat(e," at ").concat(t.toLocaleTimeString())}return"".concat(t.toLocaleTimeString())}var w=s(77466),T=s(48976),S=s.n(T);let E=e=>{let{badge:t,userColor:s,title:a}=e;return(0,l.jsx)("span",{style:{color:"var(--theme-color-users-".concat(s,")")},className:S().badge,title:a,children:t})},k=u()(()=>Promise.all([s.e(2074),s.e(7719)]).then(s.t.bind(s,27719,23)),{loadableGenerated:{webpack:()=>[27719]},ssr:!1}),O=e=>{let{userColor:t}=e;return(0,l.jsx)(E,{badge:(0,l.jsx)(k,{}),userColor:t,title:"Authenticated"})},D=u()(()=>Promise.all([s.e(2074),s.e(710)]).then(s.t.bind(s,20710,23)),{loadableGenerated:{webpack:()=>[20710]},ssr:!1}),A=e=>{let{userColor:t}=e;return(0,l.jsx)(E,{badge:(0,l.jsx)(D,{}),userColor:t,title:"Moderator"})},B=u()(()=>Promise.all([s.e(173),s.e(164),s.e(4931),s.e(5402),s.e(7524),s.e(6386),s.e(3698),s.e(3013),s.e(4398),s.e(8091),s.e(8270),s.e(4860)]).then(s.bind(s,94860)).then(e=>e.ChatModerationActionMenu),{loadableGenerated:{webpack:()=>[94860]},ssr:!1}),P=u()(()=>Promise.resolve().then(s.bind(s,47049)).then(e=>e.Highlight),{loadableGenerated:{webpack:()=>[47049]},ssr:!1}),U=e=>{let{children:t,user:s}=e,{displayName:a,createdAt:n}=s,r="".concat(a," first joined ").concat(M(n));return(0,l.jsx)(C.Z,{title:r,placement:"topLeft",mouseEnterDelay:1,children:t})},F=e=>{let{message:t,highlightString:s,showModeratorMenu:a,sentBySelf:n,sameUserAsLast:r,isAuthorModerator:o,isAuthorAuthenticated:i}=e,{id:c,body:h,user:u,timestamp:m}=t,{id:p,displayName:x,displayColor:g}=u,y=(0,f.sJ)(w.FI),N="var(--theme-color-users-".concat(g,")"),T="Sent ".concat(M(m)),[S,E]=(0,d.useState)(h),k=[];return o&&k.push((0,l.jsx)(A,{userColor:g},"mod")),i&&k.push((0,l.jsx)(O,{userColor:g},"auth")),(0,d.useEffect)(()=>{E((0,j.p1)(h))},[t]),(0,l.jsx)("div",{className:_()(b().messagePadding,r&&b().messagePaddingCollapsed,"chat-message_user"),children:(0,l.jsxs)("div",{className:_()(b().root,{[b().ownMessage]:n}),style:{borderColor:N},children:[(0,l.jsx)("div",{className:b().background,style:{color:N}}),!r&&(0,l.jsx)(U,{user:u,children:(0,l.jsxs)("div",{className:b().user,style:{color:N},children:[(0,l.jsx)("span",{className:b().userName,children:x}),(0,l.jsx)("span",{children:k})]})}),(0,l.jsx)(C.Z,{title:T,mouseEnterDelay:1,children:(0,l.jsx)(P,{search:s,children:(0,l.jsx)("div",{className:b().message,dangerouslySetInnerHTML:{__html:(0,v.Z)(S)}})})}),a&&(0,l.jsx)("div",{className:b().modMenuWrapper,children:(0,l.jsx)(B,{messageID:c,accessToken:y,userID:p,userDisplayName:x})})]})})};var G=s(55241),L=s(77493),R=s(96391),I=s(26912),H=s.n(I);let W=u()(()=>Promise.all([s.e(7741),s.e(1559)]).then(s.bind(s,51559)).then(e=>e.EmojiPicker),{loadableGenerated:{webpack:()=>[51559]},ssr:!1}),V=u()(()=>Promise.all([s.e(2074),s.e(3366)]).then(s.t.bind(s,73366,23)),{loadableGenerated:{webpack:()=>[73366]},ssr:!1}),Y=u()(()=>Promise.all([s.e(2074),s.e(2348)]).then(s.t.bind(s,92348,23)),{loadableGenerated:{webpack:()=>[92348]},ssr:!1}),J=e=>{let{attributes:t,element:s,children:a}=e,n=(0,R.vt)(),r=(0,R.UE)();return(0,l.jsxs)("span",{...t,contentEditable:!1,children:[(0,l.jsx)("img",{alt:s.alt,src:s.src,title:s.name,style:{display:"inline",maxWidth:"50px",maxHeight:"20px",boxShadow:"".concat(n&&r?"0 0 0 3px #B4D5FF":"none")}}),a]})},X=e=>{let{isVoid:t}=e;return e.isVoid=e=>"image"===e.type||t(e),e.isInline=e=>"image"===e.type,e},z=e=>{let t;if(L.xv.isText(e)){let t=e.text;return t}if(0===e.children.length)t=[{text:""}];else{var s;t=null===(s=e.children)||void 0===s?void 0:s.map(e=>z(e)).join("")}switch(e.type){case"paragraph":return"<p>".concat(t,"</p>");case"image":return'<img src="'.concat(e.src,'" alt="').concat(e.alt,'" title="').concat(e.name,'" class="emoji"/>');default:return t}},Z=e=>{if(L.xv.isText(e))return e.text.length;if("image"===e.type)return 5;let t=0;return e.children.forEach(e=>{t+=Z(e)}),t},q=e=>{let{defaultText:t}=e,[s,a]=(0,d.useState)(!1),[n,r]=(0,d.useState)(null==t?void 0:t.length),o=(0,f.sJ)(w.Gt),i=(0,d.useMemo)(()=>(0,R.BU)(X((0,L.Jh)())),[]),c=()=>{if(!o){console.log("websocketService is not defined");return}let e=z(i);o.send({type:m.C.CHAT,body:e}),L.YR.delete(i,{at:{anchor:L.ML.start(i,[]),focus:L.ML.end(i,[])}}),r(0)},h=(e,t,s)=>({type:"image",alt:e,src:t,name:s,children:[{text:""}]}),u=(e,t)=>{if(!e)return;let{selection:s}=i,a=h(t,e,t);if(L.YR.insertNodes(i,a,{select:!0}),s){var n;let[e,t]=L.ML.parent(i,null===(n=s.focus)||void 0===n?void 0:n.path);i.isVoid(e)||L.NB.string(e).length?L.YR.insertNodes(i,a,{at:L.y$.next(t),select:!0}):(L.YR.insertNodes(i,a,{at:t,select:!0}),L.ML.normalize(i,{force:!0}))}else L.YR.insertNodes(i,a,{select:!0})},p=e=>{R.F3.focus(i),L.YR.insertText(i,e)},x=(e,t)=>{R.F3.focus(i),u(t,e)},g=e=>{let t=Z(i)+1;if("Enter"===e.key){e.preventDefault(),c();return}if("Backspace"===e.key){r(t-1);return}t+1>300&&e.preventDefault(),r(t+1)},C=e=>{let t=e.clipboardData.getData("text/plain"),{length:s}=t;n+s>300&&e.preventDefault()},j=e=>"image"===e.element.type?(0,l.jsx)(J,{...e}):(0,l.jsx)("p",{...e});return(0,l.jsx)("div",{className:H().root,children:(0,l.jsxs)("div",{className:_()(H().inputWrap,n>=300&&H().maxCharacters),children:[(0,l.jsxs)(R.mH,{editor:i,value:[{type:"paragraph",children:[{text:t||""}]}],children:[(0,l.jsx)(R.CX,{className:"chat-text-input",onKeyDown:g,onPaste:C,renderElement:j,placeholder:"Send a message to chat",style:{width:"100%"},role:"textbox","aria-label":"Chat text input",autoFocus:!0}),(0,l.jsx)(G.Z,{content:(0,l.jsx)(W,{onEmojiSelect:p,onCustomEmojiSelect:x}),trigger:"click",placement:"topRight",onOpenChange:e=>a(e),open:s})]}),(0,l.jsxs)("div",{style:{display:"flex",paddingLeft:"5px"},children:[(0,l.jsx)("button",{type:"button",className:H().emojiButton,title:"Emoji picker button",onClick:()=>a(!s),children:(0,l.jsx)(Y,{})}),(0,l.jsx)("button",{type:"button",className:H().sendButton,title:"Send message Button",onClick:c,children:(0,l.jsx)(V,{})})]})]})})};var K=s(93107),$=s.n(K);function Q(){return(Q=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var s=arguments[t];for(var a in s)Object.prototype.hasOwnProperty.call(s,a)&&(e[a]=s[a])}return e}).apply(this,arguments)}var ee=function(e){return d.createElement("svg",Q({height:500,viewBox:"0 0 132.292 132.292",width:500,xmlns:"http://www.w3.org/2000/svg"},e),a||(a=d.createElement("linearGradient",{id:"moderator_svg__a",gradientUnits:"userSpaceOnUse",x1:432.851,x2:464.644,y1:49.977,y2:49.977},d.createElement("stop",{offset:0,stopColor:"#2087e2"}),d.createElement("stop",{offset:1,stopColor:"#b63fff"}))),n||(n=d.createElement("path",{d:"M438.672 34.08h20.151a5.82 5.82 45 0 1 5.82 5.821v20.151a5.82 5.82 135 0 1-5.82 5.821h-20.15a5.82 5.82 45 0 1-5.822-5.82V39.9a5.82 5.82 135 0 1 5.821-5.82z",fill:"url(#moderator_svg__a)",transform:"matrix(4.16112 0 0 4.16112 -1801.146 -141.814)"})),r||(r=d.createElement("path",{d:"M121.11 29.551c-6.93 47.444-30.074 104.618-77.642 79.674l25.83 23.067h38.772c13.377 0 24.22-10.845 24.22-24.222V40.864z",fill:"#1d1535",fillOpacity:.335})),o||(o=d.createElement("path",{d:"M66.775 13.257s-7.129 57.999-.63 99.312c6.565 41.724-81.568-74.394-49.619-79.203 31.949-4.809 50.249-20.11 50.249-20.11z",fill:"#e2e8f0",fillOpacity:.306})),i||(i=d.createElement("path",{d:"M435.995 42.072c6.797.447 12.753-4.806 12.753-4.806s5.955 5.253 12.752 4.806c-.581 12.745-7.495 20.586-12.752 20.628-5.188.042-12.172-7.883-12.753-20.628z",fill:"none",stroke:"#fff",strokeLinejoin:"round",strokeWidth:2,transform:"matrix(4.16112 0 0 4.16112 -1801.146 -141.814)"})))};let et=()=>(0,l.jsxs)("div",{className:$().chatModerationNotification,children:[(0,l.jsx)(ee,{className:$().icon}),"You are now a moderator."]});var es=s(47049),ea=s(23421),en=s.n(ea);let er=e=>{let{message:{body:t,user:{displayName:s}},highlightString:a}=e;return(0,l.jsxs)("div",{className:_()([en().chatSystemMessage,"chat-message_system"]),children:[(0,l.jsx)("div",{className:en().user,children:(0,l.jsx)("span",{className:en().userName,children:s})}),(0,l.jsx)(es.Highlight,{search:a,children:(0,l.jsx)("div",{className:en().message,dangerouslySetInnerHTML:{__html:t}})})]})};var eo=s(91044),ei=s.n(eo);let el=u()(()=>Promise.all([s.e(2074),s.e(8725)]).then(s.t.bind(s,8725,23)),{loadableGenerated:{webpack:()=>[8725]},ssr:!1}),ec=e=>{let{isAuthorModerator:t,userColor:s,displayName:a}=e;return(0,l.jsxs)("div",{className:ei().root,children:[(0,l.jsxs)("span",{style:{color:"var(--theme-color-users-".concat(s,")")},children:[(0,l.jsx)("span",{style:{padding:"0 10px"},children:(0,l.jsx)(el,{})}),(0,l.jsx)("span",{style:{fontWeight:"bold"},children:a}),t&&(0,l.jsx)("span",{children:(0,l.jsx)(A,{userColor:s})})]})," ","joined the chat."]})};var ed=s(71577);let eh=u()(()=>Promise.all([s.e(2074),s.e(437)]).then(s.t.bind(s,20437,23)),{loadableGenerated:{webpack:()=>[20437]},ssr:!1}),eu=e=>{let{chatContainerRef:t,messages:s}=e;return(0,l.jsx)("div",{className:x().toBottomWrap,children:(0,l.jsx)(ed.Z,{type:"default",style:{color:"currentColor"},icon:(0,l.jsx)(eh,{}),onClick:()=>t.current.scrollToIndex({index:s.length-1,behavior:"auto"}),children:"Go to last message"})})};var em=s(65302),ep=s.n(em);let ex=e=>{let{body:t}=e;return(0,l.jsx)("div",{dangerouslySetInnerHTML:{__html:t},className:ep().chatAction})},eg=u()(()=>Promise.all([s.e(2074),s.e(1668)]).then(s.t.bind(s,51668,23)),{loadableGenerated:{webpack:()=>[51668]},ssr:!1});function e_(e){let{user:{scopes:t}}=e;return!!t&&0!==t.length&&t.includes("MODERATOR")}let eC=e=>{let{messages:t,usernameToHighlight:s,chatUserId:a,isModerator:n,showInput:r,height:o}=e,[i,h]=(0,d.useState)(!1),u=(0,d.useRef)(null),p=e=>{let{oldName:t,user:s}=e,{displayName:a,displayColor:n}=s,r="var(--theme-color-users-".concat(n,")");return(0,l.jsxs)("div",{className:x().nameChangeView,children:[(0,l.jsx)("div",{style:{marginRight:5,height:"max-content",margin:"auto 5px auto 0"},children:(0,l.jsx)(eg,{})}),(0,l.jsxs)("div",{className:x().nameChangeText,children:[(0,l.jsx)("span",{style:{color:r},children:t}),(0,l.jsx)("span",{className:x().plain,children:" is now known as "}),(0,l.jsx)("span",{style:{color:r},children:a})]})]})},g=e=>{let{user:{displayName:t,displayColor:s}}=e,a=e_(e);return(0,l.jsx)(ec,{displayName:t,userColor:s,isAuthorModerator:a})},_=e=>{let{body:t}=e;return(0,l.jsx)(ex,{body:t})},C=e=>{let t=e_(e);return t?(0,l.jsx)(et,{}):(0,l.jsx)("div",{style:{width:"1px",height:"1px"}})},f=(e,r)=>{switch(r.type){case m.C.CHAT:var o,i,c;return(0,l.jsx)(F,{message:r,showModeratorMenu:n,highlightString:s,sentBySelf:(null===(o=r.user)||void 0===o?void 0:o.id)===a,sameUserAsLast:function(e,t){if(e.length<2)return!1;let s=e[t];if(!s||!s.user)return!1;let{user:{id:a}}=s,n=e[t-1];if((null==n?void 0:n.type)!==m.C.CHAT||!(null==n?void 0:n.timestamp)||!s.timestamp)return!1;let r=new Date(null==n?void 0:n.timestamp).getTime(),o=new Date(s.timestamp).getTime();return!(o-r>12e4)&&a===(null==n?void 0:n.user.id)}(t,e),isAuthorModerator:null===(i=r.user.scopes)||void 0===i?void 0:i.includes("MODERATOR"),isAuthorAuthenticated:null===(c=r.user)||void 0===c?void 0:c.authenticated},r.id);case m.C.NAME_CHANGE:return p(r);case m.C.CONNECTED_USER_INFO:return C(r);case m.C.USER_JOINED:return g(r);case m.C.CHAT_ACTION:return _(r);case m.C.SYSTEM:return(0,l.jsx)(er,{message:r,highlightString:s},r.id);default:return null}},j=function(e){let s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"smooth";setTimeout(()=>{var a;null===(a=e.current)||void 0===a||a.scrollToIndex({index:t.length-1,behavior:s})},100),h(!0)};(0,d.useEffect)(()=>{setTimeout(()=>{j(u,"auto")},500)},[]);let v=(0,d.useMemo)(()=>(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(c.OO,{id:"virtuoso",style:{height:o},className:x().virtuoso,ref:u,data:t,itemContent:(e,t)=>f(e,t),followOutput:e=>(e&&j(u,"smooth"),!1),alignToBottom:!0,atBottomThreshold:70,atBottomStateChange:e=>{h(e)}}),!i&&(0,l.jsx)(eu,{chatContainerRef:u,messages:t})]}),[t,s,a,n,i]);return(0,l.jsxs)("div",{id:"chat-container",className:x().chatContainer,children:[v,r&&(0,l.jsx)("div",{className:x().chatTextField,children:(0,l.jsx)(q,{})})]})};eC.defaultProps={showInput:!0,height:"auto"}},65302:function(e){e.exports={chatAction:"ChatActionMessage_chatAction__x9Xsg"}},59760:function(e){e.exports={toBottomWrap:"ChatContainer_toBottomWrap__3V5wa",nameChangeView:"ChatContainer_nameChangeView__ziyXN",nameChangeText:"ChatContainer_nameChangeText__yXG__",plain:"ChatContainer_plain__IPS19",chatContainer:"ChatContainer_chatContainer__O2lYN",virtuoso:"ChatContainer_virtuoso__OS9Kz",chatTextField:"ChatContainer_chatTextField__OqCGL"}},91044:function(e){e.exports={root:"ChatJoinMessage_root__vuVXa"}},93107:function(e){e.exports={chatModerationNotification:"ChatModeratorNotification_chatModerationNotification__kgFWe",icon:"ChatModeratorNotification_icon__7FdGg"}},23421:function(e){e.exports={chatSystemMessage:"ChatSystemMessage_chatSystemMessage__c6XEN",user:"ChatSystemMessage_user__6yHSJ",message:"ChatSystemMessage_message__ySq5g"}},26912:function(e){e.exports={root:"ChatTextField_root__4oUkJ",inputWrap:"ChatTextField_inputWrap__1mAjD",maxCharacters:"ChatTextField_maxCharacters__yGT4s",emojiButton:"ChatTextField_emojiButton__ON_Cu",sendButton:"ChatTextField_sendButton__MOmD4"}},48976:function(e){e.exports={badge:"ChatUserBadge_badge__1EdUp"}},50085:function(e){e.exports={root:"ChatUserMessage_root__79heB",user:"ChatUserMessage_user__xUEp9",message:"ChatUserMessage_message__MJ9LD",ownMessage:"ChatUserMessage_ownMessage__d28A3",background:"ChatUserMessage_background__Tfghp",modMenuWrapper:"ChatUserMessage_modMenuWrapper__7fblv",messagePadding:"ChatUserMessage_messagePadding__Xp1F6",messagePaddingCollapsed:"ChatUserMessage_messagePaddingCollapsed__qxN0E"}}}]);