@laravel/echo-react
Version:
React hooks for seamless integration with Laravel Echo.
3 lines (2 loc) • 13.6 kB
JavaScript
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("pusher-js"),i=require("react");class y{listenForWhisper(e,t){return this.listen(".client-"+e,t)}notification(e){return this.listen(".Illuminate\\Notifications\\Events\\BroadcastNotificationCreated",e)}stopListeningForWhisper(e,t){return this.stopListening(".client-"+e,t)}}class R{constructor(e){this.namespace=e}format(e){return[".","\\"].includes(e.charAt(0))?e.substring(1):(this.namespace&&(e=this.namespace+"."+e),e.replace(/\./g,"\\"))}setNamespace(e){this.namespace=e}}function q(s){try{new s}catch(e){if(e instanceof Error&&e.message.includes("is not a constructor"))return!1}return!0}class I extends y{constructor(e,t,n){super(),this.name=t,this.pusher=e,this.options=n,this.eventFormatter=new R(this.options.namespace),this.subscribe()}subscribe(){this.subscription=this.pusher.subscribe(this.name)}unsubscribe(){this.pusher.unsubscribe(this.name)}listen(e,t){return this.on(this.eventFormatter.format(e),t),this}listenToAll(e){return this.subscription.bind_global((t,n)=>{if(t.startsWith("pusher:"))return;let o=String(this.options.namespace??"").replace(/\./g,"\\"),r=t.startsWith(o)?t.substring(o.length+1):"."+t;e(r,n)}),this}stopListening(e,t){return t?this.subscription.unbind(this.eventFormatter.format(e),t):this.subscription.unbind(this.eventFormatter.format(e)),this}stopListeningToAll(e){return e?this.subscription.unbind_global(e):this.subscription.unbind_global(),this}subscribed(e){return this.on("pusher:subscription_succeeded",()=>{e()}),this}error(e){return this.on("pusher:subscription_error",t=>{e(t)}),this}on(e,t){return this.subscription.bind(e,t),this}}class A extends I{whisper(e,t){return this.pusher.channels.channels[this.name].trigger(`client-${e}`,t),this}}class H extends I{whisper(e,t){return this.pusher.channels.channels[this.name].trigger(`client-${e}`,t),this}}class B extends A{here(e){return this.on("pusher:subscription_succeeded",t=>{e(Object.keys(t.members).map(n=>t.members[n]))}),this}joining(e){return this.on("pusher:member_added",t=>{e(t.info)}),this}whisper(e,t){return this.pusher.channels.channels[this.name].trigger(`client-${e}`,t),this}leaving(e){return this.on("pusher:member_removed",t=>{e(t.info)}),this}}class V extends y{constructor(e,t,n){super(),this.events={},this.listeners={},this.name=t,this.socket=e,this.options=n,this.eventFormatter=new R(this.options.namespace),this.subscribe()}subscribe(){this.socket.emit("subscribe",{channel:this.name,auth:this.options.auth||{}})}unsubscribe(){this.unbind(),this.socket.emit("unsubscribe",{channel:this.name,auth:this.options.auth||{}})}listen(e,t){return this.on(this.eventFormatter.format(e),t),this}stopListening(e,t){return this.unbindEvent(this.eventFormatter.format(e),t),this}subscribed(e){return this.on("connect",t=>{e(t)}),this}error(e){return this}on(e,t){return this.listeners[e]=this.listeners[e]||[],this.events[e]||(this.events[e]=(n,o)=>{this.name===n&&this.listeners[e]&&this.listeners[e].forEach(r=>r(o))},this.socket.on(e,this.events[e])),this.listeners[e].push(t),this}unbind(){Object.keys(this.events).forEach(e=>{this.unbindEvent(e)})}unbindEvent(e,t){this.listeners[e]=this.listeners[e]||[],t&&(this.listeners[e]=this.listeners[e].filter(n=>n!==t)),(!t||this.listeners[e].length===0)&&(this.events[e]&&(this.socket.removeListener(e,this.events[e]),delete this.events[e]),delete this.listeners[e])}}class x extends V{whisper(e,t){return this.socket.emit("client event",{channel:this.name,event:`client-${e}`,data:t}),this}}class F extends x{here(e){return this.on("presence:subscribed",t=>{e(t.map(n=>n.user_info))}),this}joining(e){return this.on("presence:joining",t=>e(t.user_info)),this}whisper(e,t){return this.socket.emit("client event",{channel:this.name,event:`client-${e}`,data:t}),this}leaving(e){return this.on("presence:leaving",t=>e(t.user_info)),this}}class g extends y{subscribe(){}unsubscribe(){}listen(e,t){return this}listenToAll(e){return this}stopListening(e,t){return this}subscribed(e){return this}error(e){return this}on(e,t){return this}}class O extends g{whisper(e,t){return this}}class U extends g{whisper(e,t){return this}}class K extends O{here(e){return this}joining(e){return this}whisper(e,t){return this}leaving(e){return this}}const j=class L{constructor(e){this.setOptions(e),this.connect()}setOptions(e){this.options={...L._defaultOptions,...e,broadcaster:e.broadcaster};let t=this.csrfToken();t&&(this.options.auth.headers["X-CSRF-TOKEN"]=t,this.options.userAuthentication.headers["X-CSRF-TOKEN"]=t),t=this.options.bearerToken,t&&(this.options.auth.headers.Authorization="Bearer "+t,this.options.userAuthentication.headers.Authorization="Bearer "+t)}csrfToken(){var e,t;return typeof window<"u"&&(e=window.Laravel)!=null&&e.csrfToken?window.Laravel.csrfToken:this.options.csrfToken?this.options.csrfToken:typeof document<"u"&&typeof document.querySelector=="function"?((t=document.querySelector('meta[name="csrf-token"]'))==null?void 0:t.getAttribute("content"))??null:null}};j._defaultOptions={auth:{headers:{}},authEndpoint:"/broadcasting/auth",userAuthentication:{endpoint:"/broadcasting/user-auth",headers:{}},csrfToken:null,bearerToken:null,host:null,key:null,namespace:"App.Events"};let T=j;class w extends T{constructor(){super(...arguments),this.channels={}}connect(){if(typeof this.options.client<"u")this.pusher=this.options.client;else if(this.options.Pusher)this.pusher=new this.options.Pusher(this.options.key,this.options);else if(typeof window<"u"&&typeof window.Pusher<"u")this.pusher=new window.Pusher(this.options.key,this.options);else throw new Error("Pusher client not found. Should be globally available or passed via options.client")}signin(){this.pusher.signin()}listen(e,t,n){return this.channel(e).listen(t,n)}channel(e){return this.channels[e]||(this.channels[e]=new I(this.pusher,e,this.options)),this.channels[e]}privateChannel(e){return this.channels["private-"+e]||(this.channels["private-"+e]=new A(this.pusher,"private-"+e,this.options)),this.channels["private-"+e]}encryptedPrivateChannel(e){return this.channels["private-encrypted-"+e]||(this.channels["private-encrypted-"+e]=new H(this.pusher,"private-encrypted-"+e,this.options)),this.channels["private-encrypted-"+e]}presenceChannel(e){return this.channels["presence-"+e]||(this.channels["presence-"+e]=new B(this.pusher,"presence-"+e,this.options)),this.channels["presence-"+e]}leave(e){[e,"private-"+e,"private-encrypted-"+e,"presence-"+e].forEach(t=>{this.leaveChannel(t)})}leaveChannel(e){this.channels[e]&&(this.channels[e].unsubscribe(),delete this.channels[e])}socketId(){return this.pusher.connection.socket_id}disconnect(){this.pusher.disconnect()}}class X extends T{constructor(){super(...arguments),this.channels={}}connect(){let e=this.getSocketIO();this.socket=e(this.options.host??void 0,this.options),this.socket.io.on("reconnect",()=>{Object.values(this.channels).forEach(t=>{t.subscribe()})})}getSocketIO(){if(typeof this.options.client<"u")return this.options.client;if(typeof window<"u"&&typeof window.io<"u")return window.io;throw new Error("Socket.io client not found. Should be globally available or passed via options.client")}listen(e,t,n){return this.channel(e).listen(t,n)}channel(e){return this.channels[e]||(this.channels[e]=new V(this.socket,e,this.options)),this.channels[e]}privateChannel(e){return this.channels["private-"+e]||(this.channels["private-"+e]=new x(this.socket,"private-"+e,this.options)),this.channels["private-"+e]}presenceChannel(e){return this.channels["presence-"+e]||(this.channels["presence-"+e]=new F(this.socket,"presence-"+e,this.options)),this.channels["presence-"+e]}leave(e){[e,"private-"+e,"presence-"+e].forEach(t=>{this.leaveChannel(t)})}leaveChannel(e){this.channels[e]&&(this.channels[e].unsubscribe(),delete this.channels[e])}socketId(){return this.socket.id}disconnect(){this.socket.disconnect()}}class P extends T{constructor(){super(...arguments),this.channels={}}connect(){}listen(e,t,n){return new g}channel(e){return new g}privateChannel(e){return new O}encryptedPrivateChannel(e){return new U}presenceChannel(e){return new K}leave(e){}leaveChannel(e){}socketId(){return"fake-socket-id"}disconnect(){}}class N{constructor(e){this.options=e,this.connect(),this.options.withoutInterceptors||this.registerInterceptors()}channel(e){return this.connector.channel(e)}connect(){if(this.options.broadcaster==="reverb")this.connector=new w({...this.options,cluster:""});else if(this.options.broadcaster==="pusher")this.connector=new w(this.options);else if(this.options.broadcaster==="ably")this.connector=new w({...this.options,cluster:"",broadcaster:"pusher"});else if(this.options.broadcaster==="socket.io")this.connector=new X(this.options);else if(this.options.broadcaster==="null")this.connector=new P(this.options);else if(typeof this.options.broadcaster=="function"&&q(this.options.broadcaster))this.connector=new this.options.broadcaster(this.options);else throw new Error(`Broadcaster ${typeof this.options.broadcaster} ${String(this.options.broadcaster)} is not supported.`)}disconnect(){this.connector.disconnect()}join(e){return this.connector.presenceChannel(e)}leave(e){this.connector.leave(e)}leaveChannel(e){this.connector.leaveChannel(e)}leaveAllChannels(){for(const e in this.connector.channels)this.leaveChannel(e)}listen(e,t,n){return this.connector.listen(e,t,n)}private(e){return this.connector.privateChannel(e)}encryptedPrivate(e){if(this.connectorSupportsEncryptedPrivateChannels(this.connector))return this.connector.encryptedPrivateChannel(e);throw new Error(`Broadcaster ${typeof this.options.broadcaster} ${String(this.options.broadcaster)} does not support encrypted private channels.`)}connectorSupportsEncryptedPrivateChannels(e){return e instanceof w||e instanceof P}socketId(){return this.connector.socketId()}registerInterceptors(){typeof Vue<"u"&&Vue!=null&&Vue.http&&this.registerVueRequestInterceptor(),typeof axios=="function"&&this.registerAxiosRequestInterceptor(),typeof jQuery=="function"&&this.registerjQueryAjaxSetup(),typeof Turbo=="object"&&this.registerTurboRequestInterceptor()}registerVueRequestInterceptor(){Vue.http.interceptors.push((e,t)=>{this.socketId()&&e.headers.set("X-Socket-ID",this.socketId()),t()})}registerAxiosRequestInterceptor(){axios.interceptors.request.use(e=>(this.socketId()&&(e.headers["X-Socket-Id"]=this.socketId()),e))}registerjQueryAjaxSetup(){typeof jQuery.ajax<"u"&&jQuery.ajaxPrefilter((e,t,n)=>{this.socketId()&&n.setRequestHeader("X-Socket-Id",this.socketId())})}registerTurboRequestInterceptor(){document.addEventListener("turbo:before-fetch-request",e=>{e.detail.fetchOptions.headers["X-Socket-Id"]=this.socketId()})}}let f=null,p=null;const Q=()=>{if(f)return f;if(!p)throw new Error("Echo has not been configured. Please call `configureEcho()`.");return p.Pusher??(p.Pusher=$),f=new N(p),f},W=s=>{p={...{reverb:{broadcaster:"reverb",key:(void 0).VITE_REVERB_APP_KEY,wsHost:(void 0).VITE_REVERB_HOST,wsPort:(void 0).VITE_REVERB_PORT,wssPort:(void 0).VITE_REVERB_PORT,forceTLS:((void 0).VITE_REVERB_SCHEME??"https")==="https",enabledTransports:["ws","wss"]},pusher:{broadcaster:"pusher",key:(void 0).VITE_PUSHER_APP_KEY,cluster:(void 0).VITE_PUSHER_APP_CLUSTER,forceTLS:!0,wsHost:(void 0).VITE_PUSHER_HOST,wsPort:(void 0).VITE_PUSHER_PORT,wssPort:(void 0).VITE_PUSHER_PORT,enabledTransports:["ws","wss"]},"socket.io":{broadcaster:"socket.io",host:(void 0).VITE_SOCKET_IO_HOST},null:{broadcaster:"null"},ably:{broadcaster:"pusher",key:(void 0).VITE_ABLY_PUBLIC_KEY,wsHost:"realtime-pusher.ably.io",wsPort:443,disableStats:!0,encrypted:!0}}[s.broadcaster],...s},f&&(f=null)},m=()=>Q(),z=()=>p!==null,C=s=>Array.isArray(s)?s:[s],a={},M=s=>{const e=m();return s.visibility==="presence"?e.join(s.name):s.visibility==="private"?e.private(s.name):e.channel(s.name)},Y=(s,e)=>{a[s.id]&&(a[s.id].count-=1,!(a[s.id].count>0)&&(e?m().leave(s.name):m().leaveChannel(s.id),delete a[s.id]))},S=s=>{if(a[s.id])return a[s.id].count+=1,a[s.id].connection;const e=M(s);return a[s.id]={count:1,connection:e},e},v=(s,e=[],t=()=>{},n=[],o="private")=>{const r={name:s,id:["private","presence"].includes(o)?`${o}-${s}`:s,visibility:o},h=i.useCallback(t,n),u=i.useRef(!1),d=i.useRef(!1),l=i.useRef(S(r)),E=C(e),c=i.useCallback(()=>{u.current&&(E.forEach(b=>{l.current.stopListening(b,h)}),u.current=!1)},n),_=i.useCallback(()=>{u.current||(E.forEach(b=>{l.current.listen(b,h)}),u.current=!0)},n),k=i.useCallback((b=!1)=>{c(),Y(r,b)},n);return i.useEffect(()=>(d.current&&(l.current=S(r)),d.current=!0,_(),k),n),{leaveChannel:k,leave:()=>k(!0),stopListening:c,listen:_,channel:()=>l.current}},D=(s,e=()=>{},t=[],n=[])=>{const o=v(s,[],e,n,"private"),r=i.useRef(C(t).map(c=>c.includes(".")?[c,c.replace(/\./g,"\\")]:[c,c.replace(/\\/g,".")]).flat()),h=i.useRef(!1),u=i.useRef(!1),d=i.useCallback(c=>{h.current&&(r.current.length===0||r.current.includes(c.type))&&e(c)},n.concat(r.current).concat([e])),l=i.useCallback(()=>{h.current||(u.current||o.channel().notification(d),h.current=!0,u.current=!0)},[d]),E=i.useCallback(()=>{h.current&&(h.current=!1)},[d]);return i.useEffect(()=>{l()},n.concat(r.current)),{...o,stopListening:E,listen:l}},G=(s,e=[],t=()=>{},n=[])=>v(s,e,t,n,"presence"),J=(s,e=[],t=()=>{},n=[])=>v(s,e,t,n,"public"),Z=(s,e,t=[],n=()=>{},o=[])=>v(`${s}.${e}`,C(t).map(r=>r.startsWith(".")?r:`.${r}`),n,o,"private");exports.configureEcho=W;exports.echo=m;exports.echoIsConfigured=z;exports.useEcho=v;exports.useEchoModel=Z;exports.useEchoNotification=D;exports.useEchoPresence=G;exports.useEchoPublic=J;
//# sourceMappingURL=index.common.js.map