react-use-zendesk
Version:
React Zendesk Web Widget integration written in typescript
7 lines (5 loc) • 2.73 kB
JavaScript
import o, { createContext, useRef, useLayoutEffect, useEffect } from 'react';
var c=createContext(void 0);var C="ze-snippet";function w(n,r){if(n&&typeof window!="undefined"){let t=()=>{B(),N(n,r);};document.readyState==="complete"?t():window.attachEvent?window.attachEvent("onload",t):window.addEventListener("load",t,!1);}}function B(){if(typeof window!="undefined"){delete window.zE,delete window.zEmbed,delete window.zEACLoaded,delete window.zEWebpackACJsonp;var n=document.getElementById(C),r=document.querySelector("iframe#launcher");n&&n.remove(),r&&r.remove();}}function N(n,r){setTimeout(function(){let t=document.createElement("script");t.id=C,t.type="text/javascript",t.async=!0,t.onload=r,t.src="https://static.zdassets.com/ekr/snippet.js?key="+n;let i=document.getElementsByTagName("script")[0];i==null||i.parentNode.insertBefore(t,i);},0);}var v=typeof window=="undefined";var e=(n,r,...t)=>{if(!v&&window&&window.zE)return window.zE.apply(null,[n,r,...t])};var q=({apiKey:n,onOpen:r,onClose:t,onUnreadMessages:i,onResetWidget:p,children:x})=>{let a=useRef(!1),[Z,k]=o.useState(!1),[b,y]=o.useState(void 0),u=useRef(r),l=useRef(t),m=useRef(i),f=useRef(p);useLayoutEffect(()=>{u.current=r,l.current=t,m.current=i,f.current=p;});function h(){a.current||(e("messenger:on","open",function(){k(!0),u.current&&u.current();}),e("messenger:on","close",function(){k(!1),l.current&&l.current();}),e("messenger:on","unreadMessages",function(s){y(s),m.current&&m.current(s);}),a.current=!0);}useEffect(()=>(w(n,h),()=>{a.current=!1,g();}),[n]);let E=o.useCallback(()=>{e("messenger","show");},[]),P=o.useCallback(()=>{e("messenger","hide");},[]),S=o.useCallback(()=>{e("messenger","open");},[]),z=o.useCallback(()=>{e("messenger","close");},[]),R=o.useCallback(s=>{e("messenger:set","locale",s);},[]),A=o.useCallback(s=>{e("messenger:set","zIndex",s);},[]),V=o.useCallback(s=>{e("messenger:set","cookies",s);},[]),F=o.useCallback(s=>{e("messenger:set","conversationFields",s);},[]),I=o.useCallback(s=>{e("messenger:set","conversationTags",s);},[]),U=o.useCallback(s=>{e("messenger","loginUser",M=>{M(s);});},[]),W=o.useCallback(()=>{e("messenger","logoutUser");},[]),g=o.useCallback(()=>{e("messenger","resetWidget",s=>{f.current&&f.current();});},[]),L={show:E,hide:P,open:S,close:z,setLocale:R,setZIndex:A,setCookies:V,setConversationFields:F,setConversationTags:I,loginUser:U,logoutUser:W,resetWidget:g,isOpen:Z,unreadMessages:b};return o.createElement(c.Provider,{value:L},x)};function D(){let n=o.useContext(c);if(n===void 0)throw new Error('"useZendesk" must be used within "ZendeskProvider"');return n}
export { q as ZendeskProvider, D as useZendesk };
//# sourceMappingURL=out.js.map
//# sourceMappingURL=index.mjs.map