call-control-sdk 6.4.5-dev.1 → 6.4.5-dev.11

package/dist/index.js

@@ -1,2 +1,3900 @@
-"use strict";var dn=Object.create;var Ie=Object.defineProperty,un=Object.defineProperties,gn=Object.getOwnPropertyDescriptor,fn=Object.getOwnPropertyDescriptors,mn=Object.getOwnPropertyNames,qo=Object.getOwnPropertySymbols,xn=Object.getPrototypeOf,Fo=Object.prototype.hasOwnProperty,Cn=Object.prototype.propertyIsEnumerable;var Ve=(e,o,t)=>o in e?Ie(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,d=(e,o)=>{for(var t in o||(o={}))Fo.call(o,t)&&Ve(e,t,o[t]);if(qo)for(var t of qo(o))Cn.call(o,t)&&Ve(e,t,o[t]);return e},W=(e,o)=>un(e,fn(o));var bn=(e,o)=>{for(var t in o)Ie(e,t,{get:o[t],enumerable:!0})},Ko=(e,o,t,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of mn(o))!Fo.call(e,r)&&r!==t&&Ie(e,r,{get:()=>o[r],enumerable:!(l=gn(o,r))||l.enumerable});return e};var yn=(e,o,t)=>(t=e!=null?dn(xn(e)):{},Ko(o||!e||!e.__esModule?Ie(t,"default",{value:e,enumerable:!0}):t,e)),En=e=>Ko(Ie({},"__esModule",{value:!0}),e);var le=(e,o,t)=>Ve(e,typeof o!="symbol"?o+"":o,t);var Mn={};bn(Mn,{CallControlPanel:()=>st,getSDKVersion:()=>On,initSDK:()=>kn,isSDKInitialized:()=>Pn,useClickToCall:()=>Jo,useEndCall:()=>Xo,useGetAuthorizationToken:()=>Zo,useGetCallerData:()=>Vo,useLogout:()=>jo});module.exports=En(Mn);var Fe="uat-cti.aighospitals.com",$=`https://${Fe}:8095`,hn=`wss://${Fe}:8095`,G={v1:"/api/v1"},R={LOGIN:`${$}${G.v1}/cti/login?provider=convox`,READY_AGENT:`${$}${G.v1}/cti/ready-agent?provider=convox`,UPDATE_AGENT_BREAK:`${$}${G.v1}/cti/update-agent-status?provider=convox`,CLICK_TO_CALL:`${$}${G.v1}/cti/calls?provider=convox`,HOLD_CALL:`${$}${G.v1}/cti/calls/hold?provider=convox`,MUTE_CALL:`${$}${G.v1}/cti/calls/mute?provider=convox`,UNMUTE_CALL:`${$}${G.v1}/cti/unmute-call?provider=convox`,END_CALL:`${$}${G.v1}/cti/calls/end?provider=convox`,LOGOUT:`${$}${G.v1}/cti/logout?provider=convox`,CONFERENCE_CALL:`${$}${G.v1}/cti/calls/conference?provider=convox`,CONFERENCE_CALL_HOLD_OR_UN_HOLD:`${$}${G.v1}/cti/calls/conference/hold?provider=convox`,CONFERENCE_CALL_MUTE_OT_UN_MUTE:`${$}${G.v1}/cti/calls/conference/mute?provider=convox`,CONFERENCE_CALL_END:`${$}${G.v1}/cti/calls/conference/hangup?provider=convox`,CONFERENCE_CALL_END_ALL:`${$}${G.v1}/cti/calls/conference/hangup/all?provider=convox`,TRANSFER_CALL:`${$}${G.v1}/cti/calls/transfer?provider=convox`,AGENTS_LIST:`${$}${G.v1}/cti/users`,PROCESS_LIST:`${$}${G.v1}/cti/processes-list`,TRANSFER_TO_DETAILS:`${$}${G.v1}/cti/transfer-to-details?provider=convox`,CALL_HISTORY:`${$}${G.v1}/dashboard/call-history`,SENTIMENTAL_ANALYSIS:`${$}${G.v1}/users/get_sentiment_analysis`},Wo={WS:`${hn}${G.v1}/cti/ws`},fe="call-control-sdk-state";var Ze=class{constructor(){le(this,"state");le(this,"listeners",[]);le(this,"STORAGE_KEY",fe);le(this,"apiKey");le(this,"tenantId");this.state=this.getInitialState(),this.loadFromStorage()}getInitialState(){return{authorization:void 0,process:null,agentId:"",openConferenceDialog:!1,openCallTransferDialog:!1,isInitialized:!1,sdkConfig:{disableEndCallButton:!1,disabledDialButton:!1,disableCallTransferButton:!1,isDraggable:!0,disableSoftPhone:!1,disableConferenceButton:!1,disabled:{},enabled:{},outlined:{}},isHolding:!1,isMuted:!1,status:"idle",callStartTime:null,controlPanelPosition:{x:10,y:10},iframePosition:{x:10,y:80},callData:{agent_id:"",status:"",type:"",event_time:"",phone_number:""},conferenceLine:[{line:1,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:2,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:3,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:4,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:5,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1}]}}loadFromStorage(){try{let o=localStorage.getItem(this.STORAGE_KEY);if(o){let t=JSON.parse(o);this.state=W(d({},this.state),{agentId:t.agentId||"",authorization:t.authorization||void 0,process:t.process||null,openConferenceDialog:(t==null?void 0:t.openConferenceDialog)||!1,openCallTransferDialog:(t==null?void 0:t.openCallTransferDialog)||!1,isInitialized:t.isInitialized||!1,sdkConfig:t.sdkConfig||{disableEndCallButton:!1,disabledDialButton:!1,disableCallTransferButton:!1,isDraggable:!0,disableSoftPhone:!1,disableConferenceButton:!1,disabled:{},enabled:{},outlined:{}},isHolding:t.isHolding||!1,isMuted:t.isMuted||!1,status:t.status||"idle",callStartTime:t.callStartTime||null,controlPanelPosition:t.controlPanelPosition||{x:10,y:10},iframePosition:t.iframePosition||{x:10,y:80},callData:t.callData||{mobileNumber:"",callReferenceId:"",agent_id:"",status:"",type:"",event_time:"",phone_number:""},conferenceLine:t.conferenceLine&&Array.isArray(t.conferenceLine)&&t.conferenceLine.length>0?t.conferenceLine:this.state.conferenceLine})}}catch(o){console.warn("Failed to load SDK state from localStorage:",o)}}saveToStorage(){try{let o={agentId:this.state.agentId,authorization:this.state.authorization,process:this.state.process,isInitialized:this.state.isInitialized,openConferenceDialog:this.state.openConferenceDialog,openCallTransferDialog:this.state.openCallTransferDialog,sdkConfig:this.state.sdkConfig,isHolding:this.state.isHolding,isMuted:this.state.isMuted,status:this.state.status,callStartTime:this.state.callStartTime,controlPanelPosition:this.state.controlPanelPosition,iframePosition:this.state.iframePosition,callData:this.state.callData,conferenceLine:this.state.conferenceLine};localStorage.setItem(this.STORAGE_KEY,JSON.stringify(o))}catch(o){console.warn("Failed to save SDK state to localStorage:",o)}}notifyListeners(){this.listeners.forEach(o=>o())}validateCredentials(o,t){if(!o||typeof o!="string"||o.trim().length===0)throw new Error("API key not available");if(!t||typeof t!="string"||t.trim().length===0)throw new Error("Tenant ID not available");this.apiKey=o.trim(),this.tenantId=t.trim()}initialize(o,t,l,r,a){if(this.validateCredentials(o,t),!l||typeof l!="string"||l.trim().length===0)throw new Error("Agent ID not available");this.state.agentId=l,this.state.openConferenceDialog=!1,this.state.openCallTransferDialog=!1,this.state.authorization=a,this.state.sdkConfig=d({disableEndCallButton:!1,disabledDialButton:!1,disableCallTransferButton:!1,isDraggable:!0,disableSoftPhone:!1,disableConferenceButton:!1,disabled:{},enabled:{},outlined:{}},r),this.state.isInitialized=!0,this.saveToStorage(),this.notifyListeners()}getState(){return d({},this.state)}getCredentials(){return{apiKey:this.apiKey,tenantId:this.tenantId}}getSdkAuthToken(){var o;return(o=this.state.authorization)==null?void 0:o.accessToken}subscribe(o){return this.listeners.push(o),()=>{let t=this.listeners.indexOf(o);t>-1&&this.listeners.splice(t,1)}}setHolding(o){this.state.isHolding=o,this.saveToStorage(),this.notifyListeners()}setMuted(o){this.state.isMuted=o,this.saveToStorage(),this.notifyListeners()}setStatus(o){this.state.status=o,this.saveToStorage(),this.notifyListeners()}setProcess(o){this.state.process=o,this.saveToStorage(),this.notifyListeners()}setControlPanelPosition(o){this.state.controlPanelPosition=o,this.saveToStorage(),this.notifyListeners()}setIframePosition(o){this.state.iframePosition=o,this.saveToStorage(),this.notifyListeners()}startCall(){this.state.callStartTime=Date.now(),this.state.status="on call",this.saveToStorage(),this.notifyListeners()}endCall(){this.state.callStartTime=null,this.state.status="idle",this.state.isHolding=!1,this.state.isMuted=!1,this.saveToStorage(),this.notifyListeners()}setInitCheck(){this.state.isInitialized=!1,this.saveToStorage(),this.notifyListeners()}setOpenConferenceDialog(o){this.state.openConferenceDialog=o,this.saveToStorage(),this.notifyListeners()}setOpenCallTransferDialog(o){this.state.openCallTransferDialog=o,this.saveToStorage(),this.notifyListeners()}updateCallData(o){this.state.callData=d(d({},this.state.callData),o),this.saveToStorage(),this.notifyListeners()}updateConferenceData(o){this.state.conferenceLine=[...o],this.saveToStorage(),this.notifyListeners()}setConferenceLine(o){var l;(!this.state.conferenceLine||!Array.isArray(this.state.conferenceLine))&&(console.warn("Conference line data corrupted, resetting to initial state"),this.state.conferenceLine=this.getInitialState().conferenceLine);let t=(l=this.state.conferenceLine)==null?void 0:l.map(r=>r.line===o.line?o:r);this.state.conferenceLine=t,this.saveToStorage(),this.notifyListeners()}resetConferenceLines(){this.state.conferenceLine=this.getInitialState().conferenceLine,this.saveToStorage(),this.notifyListeners()}clearStorageAndReset(){try{localStorage.removeItem(this.STORAGE_KEY),this.state=this.getInitialState(),this.notifyListeners()}catch(o){console.warn("Failed to clear localStorage:",o)}}debugStorage(){try{let o=localStorage.getItem(this.STORAGE_KEY);console.log("Current localStorage data:",o),o&&console.log("Parsed localStorage data:",JSON.parse(o)),console.log("Current state:",this.state)}catch(o){console.error("Error debugging storage:",o)}}getConferenceLines(){return this.state.conferenceLine||[]}},C=new Ze;var Qe=class{constructor(){le(this,"config",null);le(this,"ticketId",null);le(this,"baseUrl","");le(this,"eventQueue",[]);le(this,"flushTimer",null)}async init(o){this.config=d({autoTrack:!0,retryAttempts:3,queueSize:100,flushInterval:5e3},o),this.baseUrl=o.baseUrl||(typeof window!="undefined"?window.location.origin:""),this.setupNetworkDetection();let t=await this.createTicket();return this.startPeriodicFlush(),console.log("EventTracker SDK initialized successfully"),t}isInitialized(){return this.config!==null&&this.ticketId!==null}getConfig(){return this.config}getTicketId(){return this.ticketId}async createTicket(){if(!this.config)throw new Error("EventTracker not initialized");try{let o=await this.makeRequest("/api/v1/et/init",{method:"POST",headers:{"Content-Type":"application/json","X-API-Key":this.config.apiKey},body:JSON.stringify({agentId:this.config.agentId,sessionId:this.config.sessionId})});if(!o.ok)throw C.setInitCheck(),new Error(`Failed to initialize: ${o.status} ${o.statusText}`);let t=await o.json();return this.ticketId=t.ticketId,this.config.autoTrack&&this.setupAutoTracking(),t}catch(o){throw console.error("EventTracker initialization failed:",o),o}}async logEvent(o,t){if(!this.config||!this.ticketId){console.warn("EventTracker not initialized, skipping event:",o);return}let l={eventType:o,eventData:t,timestamp:Date.now()};this.eventQueue.push(l),this.eventQueue.length>(this.config.queueSize||100)&&this.eventQueue.shift()}async makeRequest(o,t){var a;let l=`${this.baseUrl}${o}`,r=((a=this.config)==null?void 0:a.retryAttempts)||3;for(let c=1;c<=r;c++)try{return await fetch(l,t)}catch(x){if(c===r)throw x;let E=Math.min(1e3*Math.pow(2,c-1),1e4);await new Promise(b=>setTimeout(b,E))}throw new Error("Max retries exceeded")}setupAutoTracking(){var l;if(typeof window=="undefined"||!((l=this.config)!=null&&l.autoTrack))return;let o=this.config.autoTrack===!0?{}:this.config.autoTrack;if(o.pageVisits!==!1&&this.logEvent("pageVisit",{url:window.location.href,title:document.title,referrer:document.referrer,userAgent:navigator.userAgent,viewport:{width:window.innerWidth,height:window.innerHeight},timestamp:new Date().toISOString()}).catch(r=>console.warn("Failed to track page visit:",r)),o.clicks!==!1&&document.addEventListener("click",r=>{var c;let a=r.target;(a.tagName==="BUTTON"||a.tagName==="A"||a.onclick||a.getAttribute("role")==="button"||a instanceof HTMLButtonElement&&a.type==="button")&&this.logEvent("click",{element:a.tagName,text:(c=a.textContent)==null?void 0:c.trim().substring(0,100),href:a.getAttribute("href"),id:a.id,className:a.className,role:a.getAttribute("role"),position:{x:r.clientX,y:r.clientY},timestamp:new Date().toISOString()}).catch(x=>console.warn("Failed to track click:",x))}),o.forms!==!1&&document.addEventListener("submit",r=>{let a=r.target,c=new FormData(a),x={};c.forEach((E,b)=>{x[b]=E.toString()}),this.logEvent("formSubmission",{formId:a.id,action:a.action,method:a.method,fields:Object.keys(x),fieldCount:Object.keys(x).length,timestamp:new Date().toISOString()}).catch(E=>console.warn("Failed to track form submission:",E))}),o.inputs!==!1){let r;document.addEventListener("input",a=>{let c=a.target;(c.tagName==="INPUT"||c.tagName==="TEXTAREA"||c.tagName==="SELECT")&&(clearTimeout(r),r=setTimeout(()=>{var x;this.logEvent("fieldChange",{element:c.tagName,type:c.getAttribute("type"),name:c.getAttribute("name"),id:c.id,valueLength:((x=c.value)==null?void 0:x.length)||0,timestamp:new Date().toISOString()}).catch(E=>console.warn("Failed to track field change:",E))},1e3))})}let t=Date.now();window.addEventListener("beforeunload",()=>{let r=Date.now()-t;this.logEvent("pageUnload",{url:window.location.href,sessionDuration:r,timestamp:new Date().toISOString()})}),o.visibility!==!1&&document.addEventListener("visibilitychange",()=>{this.logEvent("visibilityChange",{hidden:document.hidden,visibilityState:document.visibilityState,timestamp:new Date().toISOString()})}),o.errors!==!1&&(window.addEventListener("error",r=>{this.logEvent("jsError",{message:r.message,filename:r.filename,lineno:r.lineno,colno:r.colno,timestamp:new Date().toISOString()})}),window.addEventListener("unhandledrejection",r=>{var a;this.logEvent("unhandledRejection",{reason:(a=r.reason)==null?void 0:a.toString(),timestamp:new Date().toISOString()})})),o.performance!==!1&&typeof window.performance!="undefined"&&window.performance.navigation&&window.addEventListener("load",()=>{setTimeout(()=>{let r=window.performance.navigation,a=window.performance.timing;this.logEvent("performanceMetrics",{navigationTime:a.navigationStart,loadTime:a.loadEventEnd-a.navigationStart,domReady:a.domContentLoadedEventEnd-a.navigationStart,renderTime:a.loadEventEnd-a.domContentLoadedEventEnd,navigationType:r.type,redirectCount:r.redirectCount,timestamp:new Date().toISOString()})},1e3)})}setupNetworkDetection(){typeof window!="undefined"&&(window.addEventListener("online",()=>{console.log("EventTracker: Back online, flushing queued events")}),window.addEventListener("offline",()=>{console.log("EventTracker: Offline, queueing events")}))}startPeriodicFlush(){this.flushTimer&&clearInterval(this.flushTimer)}},et=new Qe;typeof window!="undefined"&&(window.EventTracker=et);var me=require("react");var Yo=yn(require("axios"));var Go,Sn=(Go=C.getSdkAuthToken())!=null?Go:"",Tn=6e4;function vn(){var e;return(e=C.getSdkAuthToken())!=null?e:""}function Dn(){var o,t,l,r;let e=Yo.default.create({baseURL:$,headers:{"Content-Type":"application/json",Accept:"application/json","x-tenant-id":(t=(o=C.getCredentials())==null?void 0:o.tenantId)!=null?t:"","x-api-key":(r=(l=C.getCredentials())==null?void 0:l.apiKey)!=null?r:"",Authorization:`${Sn}`},timeout:Tn,withCredentials:!1});return e.interceptors.request.use(a=>{let c=vn();return c&&a.headers&&(a.headers.Authorization=`${c}`),a.metadata={startTime:new Date().getTime()},a},a=>(console.error("Request interceptor error:",a),Promise.reject(a))),e.interceptors.response.use(a=>{var E;let c=new Date().getTime(),x=(E=a.config.metadata)==null?void 0:E.startTime;return x&&console.log(`Request to ${a.config.url} took ${c-x}ms`),a},async a=>{var x;let c=a.config;return((x=a.response)==null?void 0:x.status)===401&&!c._retry&&(C.setInitCheck(),console.warn("Unauthorized request, attempting retry...")),a.response||(console.error("Network error:",a.message),a.message="Network error: Please check your internet connection"),a.response&&a.response.status>=500&&(console.error("Server error:",a.response.status,a.response.data),a.message="Server error: Please try again later"),Promise.reject(a)}),e}var Ln=Dn(),oe=Ln;var jo=()=>{let[e,o]=(0,me.useState)(!1),[t,l]=(0,me.useState)(!1),[r,a]=(0,me.useState)(!1),[c,x]=(0,me.useState)(null),[E,b]=(0,me.useState)(null);return{logout:(0,me.useCallback)(async()=>{var y;let u=JSON.parse((y=localStorage.getItem(fe))!=null?y:"");o(!0);let g={action:"LOGOUTUSER",userId:u.agentId||""};return oe.post(R.LOGOUT,g).then(m=>(C.clearStorageAndReset(),localStorage.clear(),sessionStorage.clear(),b(m==null?void 0:m.data),l(!0),m==null?void 0:m.data)).catch(m=>{var h;return a(!0),x(m),(h=m==null?void 0:m.response)==null?void 0:h.data}).finally(()=>{o(!1)})},[]),isLoading:e,isSuccess:t,isError:r,error:c,data:E}};var xe=require("react");var Xo=()=>{let[e,o]=(0,xe.useState)(!1),[t,l]=(0,xe.useState)(!1),[r,a]=(0,xe.useState)(!1),[c,x]=(0,xe.useState)(null),[E,b]=(0,xe.useState)(null);return{handleEndCall:(0,xe.useCallback)(async u=>{var m,h,N,U,H,M,q,te,K,O,T,D,ne,se,I;let g=JSON.parse((m=localStorage.getItem(fe))!=null?m:"");o(!0);let y={action:"ENDCALL",userId:g==null?void 0:g.agentId,processid:(U=(N=(h=g==null?void 0:g.process)==null?void 0:h.process_id)==null?void 0:N.toString())!=null?U:"",process_name:(M=(H=g==null?void 0:g.process)==null?void 0:H.process_name)!=null?M:"",callreferenceid:(te=(q=g==null?void 0:g.callData)==null?void 0:q.convox_id)!=null?te:"",mobile_number:(O=(K=g==null?void 0:g.callData)==null?void 0:K.phone_number)!=null?O:"",disposition:(T=u==null?void 0:u.disposition)!=null?T:"RES",set_followUp:(D=u==null?void 0:u.followUp)!=null?D:"N",callback_date:(ne=u==null?void 0:u.callbackDate)!=null?ne:"",callback_hrs:(se=u==null?void 0:u.callbackHrs)!=null?se:"",callback_mins:(I=u==null?void 0:u.callbackMins)!=null?I:"",endcall_type:"CLOSE"};return oe.post(R.END_CALL,y).then(v=>(C.endCall(),b(v==null?void 0:v.data),l(!0),v==null?void 0:v.data)).catch(v=>{var P;return a(!0),x(v),(P=v==null?void 0:v.response)==null?void 0:P.data}).finally(()=>{o(!1)})},[]),isLoading:e,isSuccess:t,isError:r,error:c,data:E}};var Ce=require("react");var Jo=()=>{let[e,o]=(0,Ce.useState)(!1),[t,l]=(0,Ce.useState)(!1),[r,a]=(0,Ce.useState)(!1),[c,x]=(0,Ce.useState)(null),[E,b]=(0,Ce.useState)(null);return{handleStartCall:(0,Ce.useCallback)(async u=>{var y,m,h,N,U,H,M,q,te;let g=JSON.parse((y=localStorage.getItem(fe))!=null?y:"");if(o(!0),((m=g==null?void 0:g.callData)==null?void 0:m.status)==="IDLE"){let K={action:"CALL",userId:g==null?void 0:g.agentId,phone_number:u==null?void 0:u.mobileNumber};return oe.post(R.CLICK_TO_CALL,K).then(O=>(b(O==null?void 0:O.data),l(!0),O==null?void 0:O.data)).catch(O=>{var T;return a(!0),x(O),(T=O==null?void 0:O.response)==null?void 0:T.data}).finally(()=>{o(!1)})}else if(((h=g==null?void 0:g.callData)==null?void 0:h.status)==="ONCALL"){let K=(U=(N=g==null?void 0:g.conferenceLine)==null?void 0:N.filter(T=>T.line!==1))==null?void 0:U.find(T=>T.status==="IDLE"&&!(T!=null&&T.isCallStart)),O={action:"EXTERNAL_CONFERENCE",operation:`CALL${K.line}`,line_used:String(K.line),thirdparty_no:u==null?void 0:u.mobileNumber,userid:(M=(H=g.callData)==null?void 0:H.agent_id)!=null?M:"",process:(te=(q=g.callData)==null?void 0:q.process_name)!=null?te:""};return oe.post(R.CONFERENCE_CALL,O).then(T=>(b(T==null?void 0:T.data),l(!0),C.setConferenceLine(W(d({},K),{isCallStart:!0,status:"ONCALL",phone:u==null?void 0:u.mobileNumber})),C.setOpenConferenceDialog(!0),T==null?void 0:T.data)).catch(T=>{var D;return a(!0),x(T),(D=T==null?void 0:T.response)==null?void 0:D.data}).finally(()=>{o(!1)})}else alert("Agent is not ready")},[]),isLoading:e,isSuccess:t,isError:r,error:c,data:E}};var Ke=require("react");var Vo=()=>{let{process_id:e,process_name:o,status:t,phone_number:l,agent_id:r,convox_id:a}=C.getState().callData,c={phone_number:l,status:t,callReferenceId:a,agent_id:r,process_id:e,process_name:o},[x,E]=(0,Ke.useState)(c);return(0,Ke.useEffect)(()=>C.subscribe(()=>{let{process_id:w,process_name:u,status:g,phone_number:y,agent_id:m,convox_id:h}=C.getState().callData;E({phone_number:y,status:g,callReferenceId:h,agent_id:m,process_id:w,process_name:u})}),[]),x};var We=require("react");var Zo=()=>{let[e,o]=(0,We.useState)(C.getSdkAuthToken());return(0,We.useEffect)(()=>C.subscribe(()=>{o(C.getSdkAuthToken())}),[]),e};var Je=require("react");var L=require("@mui/icons-material"),f=require("@mui/material"),ee=require("react");var re=require("react");function tt(e,o){let[t,l]=(0,re.useState)(e),[r,a]=(0,re.useState)(!1),c=(0,re.useRef)(),x=(0,re.useRef)({x:0,y:0}),E=(0,re.useRef)({x:0,y:0}),b=(0,re.useCallback)(y=>{let m=c.current;if(!m)return;let h=m.getBoundingClientRect(),N=window.innerWidth,U=window.innerHeight,H={x:Math.max(0,Math.min(y.x,N-h.width)),y:Math.max(0,Math.min(y.y,U-h.height))};l(H),o==null||o(H)},[o]),w=(0,re.useCallback)((y,m)=>{a(!0),x.current={x:y,y:m},E.current=t;let h=(M,q)=>{let te=M-x.current.x,K=q-x.current.y;b({x:E.current.x+te,y:E.current.y+K})},N=M=>{M.preventDefault(),h(M.clientX,M.clientY)},U=M=>{M.preventDefault();let q=M.touches[0];q&&h(q.clientX,q.clientY)},H=()=>{a(!1),document.removeEventListener("mousemove",N),document.removeEventListener("mouseup",H),document.removeEventListener("touchmove",U),document.removeEventListener("touchend",H)};document.addEventListener("mousemove",N),document.addEventListener("mouseup",H),document.addEventListener("touchmove",U,{passive:!1}),document.addEventListener("touchend",H)},[t,b]),u=(0,re.useCallback)(y=>{y.preventDefault(),w(y.clientX,y.clientY)},[w]),g=(0,re.useCallback)(y=>{y.preventDefault();let m=y.touches[0];m&&w(m.clientX,m.clientY)},[w]);return{position:t,isDragging:r,dragRef:c,handleMouseDown:u,handleTouchStart:g}}var Ge=require("react");function he(){let[e,o]=(0,Ge.useState)(C.getState());return(0,Ge.useEffect)(()=>C.subscribe(()=>{o(C.getState())}),[]),e}var je=require("react");var be=require("react"),Ye=require("@mui/material"),Re=require("react/jsx-runtime"),Qo=(0,be.createContext)(void 0),Ee=()=>{let e=(0,be.useContext)(Qo);if(!e)throw new Error("useToast must be used inside ToastProvider");return e},en=({children:e})=>{let[o,t]=(0,be.useState)(!1),[l,r]=(0,be.useState)(""),[a,c]=(0,be.useState)("info"),x=(E,b="info")=>{r(E),c(b),t(!0)};return(0,Re.jsxs)(Qo.Provider,{value:{showToast:x},children:[e,(0,Re.jsx)(Ye.Snackbar,{open:o,color:a,autoHideDuration:3e3,onClose:()=>t(!1),anchorOrigin:{vertical:"top",horizontal:"right"},children:(0,Re.jsx)(Ye.Alert,{variant:"filled",severity:a,onClose:()=>t(!1),sx:{width:"100%"},children:l})})]})};var _n={isLoading:!1,isSuccess:!1,isError:!1,error:null,data:null},In=(e,o)=>{if(o.type==="isLoading")return W(d({},e),{isLoading:o.payload});if(o.type==="isSuccess")return W(d({},e),{isSuccess:!0,data:o.payload});if(o.type==="isError")return W(d({},e),{isError:!0,error:o.payload});if(o.type==="reset")return{isLoading:!1,isSuccess:!1,isError:!1,error:null,data:null};throw Error("Unknown action.")};var ce=(e={})=>{let{onSuccess:o=null,onError:t=null,disabledSuccessToast:l=!1}=e,{showToast:r}=Ee(),[a,c]=(0,je.useReducer)(In,_n);return[(0,je.useCallback)((E,b,w={})=>{c({type:"isLoading",payload:!0}),oe.post(E,b,w).then(u=>{var g,y;c({type:"isSuccess",payload:u.data}),o==null||o(u.data,b),console.log((g=u.data)==null?void 0:g.message,"res45"),l||r((y=u.data)==null?void 0:y.message,"success")}).catch(u=>{var y,m,h,N,U,H,M,q,te,K,O,T;let g={status:(m=(y=u.response)==null?void 0:y.status)!=null?m:500,message:((N=(h=u.response)==null?void 0:h.data)==null?void 0:N.detail)||((H=(U=u.response)==null?void 0:U.data)==null?void 0:H.message)||u.message||"An unknown error occurred",data:(q=(M=u.response)==null?void 0:M.data)!=null?q:null,statusText:(K=(te=u.response)==null?void 0:te.statusText)!=null?K:"",code:(O=u==null?void 0:u.code)!=null?O:"",name:(T=u==null?void 0:u.name)!=null?T:""};r(g.message,"error"),c({type:"isError",payload:g}),t==null||t(g,b)}).finally(()=>{c({type:"isLoading",payload:!1})})},[o,t,r]),a]};var A=require("@mui/icons-material"),s=require("@mui/material"),pe=require("react");var tn=require("@mui/material");var Rn=({disabled:e,enabled:o,outlined:t})=>{let l=(0,tn.useTheme)();return{disabled:d({padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",border:"1px solid rgb(206, 204, 204)",height:"40px","&:hover":{boxShadow:" 0px 2px 2px rgba(0, 0, 0, 0.79)",border:`1px solid ${l.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${l.palette.primary.light}`}},e),enabled:d({padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",boxShadow:" 0px 2px 1px rgba(0, 0, 0, 0.507)",border:`1px solid ${l.palette.primary.main}`,height:"40px","&:hover":{boxShadow:" 0px 2px 1px rgba(0, 0, 0, 0.507)",border:`1px solid ${l.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${l.palette.primary.light}`}},o),outlined:d({padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",backgroundColor:l.palette.grey[200],boxShadow:`0px 2px 1px ${l.palette.primary.light}`,border:`0px solid ${l.palette.primary.main}`,height:"40px","&:hover":{boxShadow:`0px 2px 1px ${l.palette.primary.main}`,border:`0px solid ${l.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${l.palette.primary.light}`}},t)}},Xe=Rn;var n=require("react/jsx-runtime"),An=({each:e})=>{var O,T,D,ne,se;let o=he(),{showToast:t}=Ee(),{disabled:l,enabled:r,outlined:a}=Xe({disabled:((O=o.sdkConfig)==null?void 0:O.disabled)||{},enabled:((T=o.sdkConfig)==null?void 0:T.enabled)||{},outlined:((D=o.sdkConfig)==null?void 0:D.outlined)||{}}),c=(0,s.useTheme)(),[x,E]=(0,pe.useState)(!1),[b,w]=(0,pe.useState)(!1),[u,g]=(0,pe.useState)(!1),[y,m]=(0,pe.useState)(!1),[h,N]=(0,pe.useState)(!1),U=(I,v)=>{C.setConferenceLine(d(d({},I),v))},H=(I,v)=>{var j,z,J,V;let P=d(d({},I),v);E(!0);let Y={action:"EXTERNAL_CONFERENCE",operation:`CALL${P.line}`,line_used:String(P.line),thirdparty_no:P.phone,userid:(z=(j=o.callData)==null?void 0:j.agent_id)!=null?z:"",process:(V=(J=o.callData)==null?void 0:J.process_name)!=null?V:""};oe.post(R.CONFERENCE_CALL,Y).then(k=>{var _;t((_=k.data)==null?void 0:_.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(k=>{var F,Z,Q,X;let _=((Z=(F=k.response)==null?void 0:F.data)==null?void 0:Z.detail)||((X=(Q=k.response)==null?void 0:Q.data)==null?void 0:X.message)||k.message||"An unknown error occurred";t(_,"error")}).finally(()=>{E(!1)})},M=(I,v)=>{var j,z,J,V;let P=d(d({},I),v);w(!0);let Y={action:"EXTERNAL_CONFERENCE",operation:"CONFERENCE",line_used:String(P.line),thirdparty_no:P.phone,userid:(z=(j=o.callData)==null?void 0:j.agent_id)!=null?z:"",process:(V=(J=o.callData)==null?void 0:J.process_name)!=null?V:""};oe.post(R.CONFERENCE_CALL,Y).then(k=>{var _;t((_=k.data)==null?void 0:_.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(k=>{var F,Z,Q,X;let _=((Z=(F=k.response)==null?void 0:F.data)==null?void 0:Z.detail)||((X=(Q=k.response)==null?void 0:Q.data)==null?void 0:X.message)||k.message||"An unknown error occurred";t(_,"error")}).finally(()=>{w(!1)})},q=(I,v,P)=>{var z,J,V,k;let Y=d(d({},I),v);g(!0);let j={action:"EXTERNAL_CONFERENCE",operation:P,hold_channel_no:P==="HOLDUSER"?`hold${Y.line}`:`unhold${Y.line}`,userid:(J=(z=o.callData)==null?void 0:z.agent_id)!=null?J:"",process:(k=(V=o.callData)==null?void 0:V.process_name)!=null?k:""};oe.post(R.CONFERENCE_CALL_HOLD_OR_UN_HOLD,j).then(_=>{var F;t((F=_.data)==null?void 0:F.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(_=>{var Z,Q,X,de;let F=((Q=(Z=_.response)==null?void 0:Z.data)==null?void 0:Q.detail)||((de=(X=_.response)==null?void 0:X.data)==null?void 0:de.message)||_.message||"An unknown error occurred";t(F,"error")}).finally(()=>{g(!1)})},te=(I,v,P)=>{var z,J,V,k;let Y=d(d({},I),v);m(!0);let j={action:"EXTERNAL_CONFERENCE",operation:P,channel_no:P==="MUTEUSER"?`mute${Y.line}`:`play${Y.line}`,userid:(J=(z=o.callData)==null?void 0:z.agent_id)!=null?J:"",thirdparty_no:Y.phone,process:(k=(V=o.callData)==null?void 0:V.process_name)!=null?k:""};oe.post(R.CONFERENCE_CALL_MUTE_OT_UN_MUTE,j).then(_=>{var F;t((F=_.data)==null?void 0:F.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(_=>{var Z,Q,X,de;let F=((Q=(Z=_.response)==null?void 0:Z.data)==null?void 0:Q.detail)||((de=(X=_.response)==null?void 0:X.data)==null?void 0:de.message)||_.message||"An unknown error occurred";t(F,"error")}).finally(()=>{m(!1)})},K=(I,v)=>{var j,z,J,V;let P=d(d({},I),v);N(!0);let Y={action:"EXTERNAL_CONFERENCE",operation:"HANGUP_CHANNEL",line_used:String(P.line-1),user_type:`THIRDPARTY${P.line-1}`,thirdparty_no:P.phone,userid:(z=(j=o.callData)==null?void 0:j.agent_id)!=null?z:"",process:(V=(J=o.callData)==null?void 0:J.process_name)!=null?V:""};oe.post(R.CONFERENCE_CALL_END,Y).then(k=>{var _;t((_=k.data)==null?void 0:_.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(k=>{var F,Z,Q,X;let _=((Z=(F=k.response)==null?void 0:F.data)==null?void 0:Z.detail)||((X=(Q=k.response)==null?void 0:Q.data)==null?void 0:X.message)||k.message||"An unknown error occurred";t(_,"error")}).finally(()=>{N(!1)})};return(0,n.jsxs)(s.TableRow,{sx:{border:"2px solid #fff"},children:[(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsxs)(s.Typography,{children:["Line ",(ne=e==null?void 0:e.line)!=null?ne:"",". "]})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsx)(s.Typography,{variant:"body2",sx:{px:1,borderRadius:"10px"},children:(se=e==null?void 0:e.status)!=null?se:""})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsx)(s.Button,{sx:{textTransform:"capitalize"},size:"small",children:(0,n.jsx)(s.Typography,{variant:"body2",children:(e==null?void 0:e.line)===1?"Internal":"External"})})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsx)(s.TextField,{size:"small",placeholder:"Phone Number",fullWidth:!0,value:(e==null?void 0:e.phone)||"",disabled:(e==null?void 0:e.line)===1||(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="DISCONNECTED"||(e==null?void 0:e.status)==="CONFERENCE",onChange:I=>{U(e,{phone:I.target.value})}})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsxs)(s.Box,{sx:{display:"flex",alignItems:"center",justifyContent:"space-around"},children:[e.line!==1&&(0,n.jsx)(s.Tooltip,{title:"Call",children:(0,n.jsx)(s.Button,{variant:(e==null?void 0:e.status)!=="IDLE"?"outlined":"contained",color:"success",sx:(e==null?void 0:e.status)!=="IDLE"?d({},l):W(d({},r),{border:`0px solid ${c.palette.success.light}`,"&:hover":{bgcolor:"success.light",boxShadow:`0px 2px 1px ${c.palette.success.light}`,border:`0px solid ${c.palette.success.light}`},"&:active":{bgcolor:"success.light",boxShadow:`inset 1px -2px 4px ${c.palette.primary.light}`}}),onClick:()=>{H(e,{})},disabled:(e==null?void 0:e.status)!=="IDLE",children:x?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"success"}):(0,n.jsx)(A.Call,{sx:{color:(e==null?void 0:e.status)!=="IDLE"?"default":"#f3f2f2"}})})}),e.line===1&&(0,n.jsx)(s.Tooltip,{title:"Merge Call",children:(0,n.jsxs)(s.Button,{variant:e!=null&&e.isMergeCall&&(e==null?void 0:e.status)==="ONCALL"?"contained":"outlined",sx:e!=null&&e.isMergeCall&&(e==null?void 0:e.status)==="ONCALL"?W(d({},l),{padding:"0px 16px"}):(e==null?void 0:e.status)==="ONCALL"?W(d({},a),{padding:"0px 16px"}):W(d({},l),{padding:"0px 16px"}),onClick:()=>{M(e,{isMergeCall:!0})},disabled:(e==null?void 0:e.status)!=="ONCALL"||b,children:[e!=null&&e.isMergeCall?"Merged":"Merge",b?(0,n.jsx)(s.CircularProgress,{size:"20px"}):(0,n.jsx)(A.CallSplit,{})]})}),(0,n.jsx)(s.Tooltip,{title:e.isHold?"Hold":"Un Hold",children:(0,n.jsx)(s.Button,{variant:e!=null&&e.isHold?"contained":"outlined",sx:e!=null&&e.isHold&&(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},l):(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},a):d({},l),onClick:()=>{e.isHold?q(e,{isHold:!1},"UNHOLDUSER"):q(e,{isHold:!0},"HOLDUSER")},disabled:(e==null?void 0:e.status)!=="ONCALL"&&(e==null?void 0:e.status)!=="CONFERENCE"||u,children:u?(0,n.jsx)(s.CircularProgress,{size:"20px",sx:{color:c.palette.primary.main}}):e.isHold?(0,n.jsx)(A.PlayArrow,{}):(0,n.jsx)(A.Pause,{})})}),(0,n.jsx)(s.Tooltip,{title:e.isMute?"Mute":"Un Mute",children:(0,n.jsx)(s.Button,{variant:e!=null&&e.isMute?"contained":"outlined",sx:e!=null&&e.isMute&&(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},l):(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},a):d({},l),onClick:()=>{e.isMute?te(e,{isMute:!1},"PLAYUSER"):te(e,{isMute:!0},"MUTEUSER")},disabled:(e==null?void 0:e.status)!=="ONCALL"&&(e==null?void 0:e.status)!=="CONFERENCE"||y,children:y?(0,n.jsx)(s.CircularProgress,{size:"20px",sx:{color:c.palette.primary.main}}):e.isMute?(0,n.jsx)(A.MicOff,{}):(0,n.jsx)(A.Mic,{})})}),(e==null?void 0:e.line)!==1?(0,n.jsx)(s.Tooltip,{title:"End Call",children:(0,n.jsx)(s.Button,{variant:(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"||(e==null?void 0:e.status)==="DIALING"?"contained":"outlined",color:"error",sx:(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"||(e==null?void 0:e.status)==="DIALING"?W(d({},r),{border:`0px solid ${c.palette.error.light}`,"&:hover":{bgcolor:"error.light",boxShadow:`0px 2px 1px ${c.palette.error.light}`,border:`0px solid ${c.palette.error.light}`},"&:active":{bgcolor:"error.light",boxShadow:`inset 1px -2px 4px ${c.palette.primary.light}`}}):d({},l),onClick:()=>{K(e,{isCallStart:!1,isMergeCall:!1,isMute:!1,isHold:!1})},disabled:(e==null?void 0:e.status)!=="ONCALL"&&(e==null?void 0:e.status)!=="CONFERENCE"&&(e==null?void 0:e.status)!=="DIALING"||h,children:h?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"error"}):(0,n.jsx)(A.CallEnd,{})})}):(0,n.jsx)(s.Button,{variant:e!=null&&e.isCallStart?"contained":"outlined",color:"error",sx:{display:"none"},onClick:()=>{K(e,{isCallStart:!1,isMergeCall:!1,isMute:!1,isHold:!1})},disabled:!(e!=null&&e.isCallStart)||h,children:h?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"error"}):(0,n.jsx)(A.CallEnd,{})})]})})]},e.line)};function on(){var c;let e=he(),{showToast:o}=Ee(),[t,l]=(0,pe.useState)(!1),r=()=>{C.setOpenConferenceDialog(!1)},a=()=>{var E,b,w,u;l(!0);let x={action:"EXTERNAL_CONFERENCE",operation:"ENDCONFERENCE",userid:(b=(E=e.callData)==null?void 0:E.agent_id)!=null?b:"",process:(u=(w=e.callData)==null?void 0:w.process_name)!=null?u:""};oe.post(R.CONFERENCE_CALL_END_ALL,x).then(g=>{var y;o((y=g.data)==null?void 0:y.message,"success"),C.resetConferenceLines(),r()}).catch(g=>{var m,h,N,U;let y=((h=(m=g.response)==null?void 0:m.data)==null?void 0:h.detail)||((U=(N=g.response)==null?void 0:N.data)==null?void 0:U.message)||g.message||"An unknown error occurred";o(y,"error")}).finally(()=>{l(!1)})};return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e.openConferenceDialog,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"10px 16px"},children:[(0,n.jsxs)(s.Typography,{variant:"body1",children:[(c=e==null?void 0:e.agentId)!=null?c:""," conference"]}),(0,n.jsx)(s.IconButton,{onClick:r,children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsx)(s.Box,{sx:{boxShadow:"1px 1px 2px #e7e5e5ff",margin:"0px 15px",borderRadius:"20px"},children:(0,n.jsx)(s.TableContainer,{component:s.Paper,sx:{outline:"0px solid gray !important",boxShadow:"1px 1px 6px #e7e5e5ff"},children:(0,n.jsxs)(s.Table,{sx:{border:"4px solid #ffffff !important"},children:[(0,n.jsx)(s.TableHead,{children:(0,n.jsxs)(s.TableRow,{sx:{border:"2px solid #f3f3f3ff !important"},children:[(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Line"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Status"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Call Type"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Mobile Number"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Call Actions"})]})}),(0,n.jsx)(s.TableBody,{children:e==null?void 0:e.conferenceLine.map(x=>(0,n.jsx)(An,{each:x}))})]})})}),(0,n.jsx)(s.Box,{textAlign:"center",m:2,children:(0,n.jsxs)(s.Button,{variant:"outlined",color:"error",size:"large",onClick:a,disabled:t,sx:{px:2,borderRadius:"20px",textTransform:"capitalize"},children:[t?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"error",sx:{marginRight:"8px"}}):(0,n.jsx)(s.IconButton,{sx:{bgcolor:"error.main","&:hover":{bgcolor:"error.dark"},marginRight:"8px",width:"28px",height:"28px",fontSize:"12px",fontWeight:"600",lineHeight:"16px",letterSpacing:"0.02em",textTransform:"capitalize",color:"white",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"50%"},children:(0,n.jsx)(A.PhoneDisabled,{sx:{color:"white",fontSize:"16px",fontWeight:"600"}})}),"End Conference"]})})]})})})}function nn({open:e}){var y,m,h,N,U,H,M,q,te,K,O,T;let o=he(),[t]=ce({onSuccess:()=>{C.setOpenCallTransferDialog(!1)}}),[l,r]=(0,pe.useState)("process"),[a,{data:c,isLoading:x}]=ce({disabledSuccessToast:!0}),[E,{data:b,isLoading:w}]=ce({disabledSuccessToast:!0}),u=()=>{C.setOpenCallTransferDialog(!1)},g=(D,ne)=>{var se,I,v,P,Y,j,z,J,V,k,_,F,Z,Q,X,de,Se,Ae,Te,we,Ne,ke,ve,Oe,Pe,Me,De,Ue,Be,He,ze,$e,qe;if(console.log(D,"data34"),ne==="PROCESS"){let ye={mobile_number:(I=(se=o.callData)==null?void 0:se.phone_number)!=null?I:"",userid:(P=(v=o.callData)==null?void 0:v.agent_id)!=null?P:"",type:"PROCESS",transfer_to:(Y=D==null?void 0:D.process_name)!=null?Y:"",callreferenceid:(z=(j=o.callData)==null?void 0:j.convox_id)!=null?z:"",processid:String((V=(J=o.callData)==null?void 0:J.process_id)!=null?V:""),process_name:(_=(k=o.callData)==null?void 0:k.process_name)!=null?_:""};t(R.TRANSFER_CALL,ye)}else if(ne==="QUEUE"){let ye={mobile_number:(Z=(F=o.callData)==null?void 0:F.phone_number)!=null?Z:"",userid:(X=(Q=o.callData)==null?void 0:Q.agent_id)!=null?X:"",type:"QUEUE",transfer_to:(de=D==null?void 0:D.queue_name)!=null?de:"",callreferenceid:(Ae=(Se=o.callData)==null?void 0:Se.convox_id)!=null?Ae:"",processid:String((we=(Te=o.callData)==null?void 0:Te.process_id)!=null?we:""),process_name:(ke=(Ne=o.callData)==null?void 0:Ne.process_name)!=null?ke:""};t(R.TRANSFER_CALL,ye)}else if(ne==="AGENT"){let ye={mobile_number:(Oe=(ve=o.callData)==null?void 0:ve.phone_number)!=null?Oe:"",userid:(Me=(Pe=o.callData)==null?void 0:Pe.agent_id)!=null?Me:"",type:"AGENT",transfer_to:(De=D==null?void 0:D.user_id)!=null?De:"",callreferenceid:(Be=(Ue=o.callData)==null?void 0:Ue.convox_id)!=null?Be:"",processid:String((ze=(He=o.callData)==null?void 0:He.process_id)!=null?ze:""),process_name:(qe=($e=o.callData)==null?void 0:$e.process_name)!=null?qe:""};t(R.TRANSFER_CALL,ye)}};return(0,pe.useEffect)(()=>{a(R.AGENTS_LIST,{status:"IDLE",active:!0}),E(R.TRANSFER_TO_DETAILS,{status:"ACTIVE",active:!0})},[]),(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,n.jsx)(s.Typography,{variant:"body1",children:" Call Transfer"}),(0,n.jsx)(s.IconButton,{onClick:u,children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsxs)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px 10px",margin:"10px",borderRadius:"10px"},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",gap:1},children:[(0,n.jsx)(s.Button,{variant:l==="process"?"contained":"outlined",onClick:()=>{r("process"),E(R.TRANSFER_TO_DETAILS,{status:"ACTIVE",active:!0})},children:"Process"}),(0,n.jsx)(s.Button,{variant:l==="queues"?"contained":"outlined",onClick:()=>{r("queues"),E(R.TRANSFER_TO_DETAILS,{status:"ACTIVE",active:!0})},children:"Queues"}),(0,n.jsx)(s.Button,{variant:l==="agents"?"contained":"outlined",onClick:()=>{r("agents"),a(R.AGENTS_LIST,{status:"IDLE",active:!0})},children:"Agents"})]}),(w||x)&&(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",height:"80px"},children:[(0,n.jsx)(s.CircularProgress,{})," "]}),!w&&!x&&l==="process"&&(0,n.jsx)(s.Box,{sx:{display:"flex",gap:1,flexWrap:"wrap"},children:(y=b==null?void 0:b.data)!=null&&y.process&&((h=(m=b==null?void 0:b.data)==null?void 0:m.process)==null?void 0:h.length)>0?(U=(N=b==null?void 0:b.data)==null?void 0:N.process)==null?void 0:U.map((D,ne)=>(0,n.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),D.process_name]}),(0,n.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{g(D,"PROCESS")},children:(0,n.jsx)(A.Call,{})})]},ne)):(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"16px",letterSpacing:"0.02em",textTransform:"capitalize",display:"flex",alignItems:"center",justifyContent:"center",width:"100%",margin:"10px 0px",color:"gray",height:"60px"},children:"No Process Found"})}),!w&&!x&&l==="queues"&&(0,n.jsx)(s.Box,{sx:{display:"flex",gap:1,flexWrap:"wrap"},children:(H=b==null?void 0:b.data)!=null&&H.queue&&((q=(M=b==null?void 0:b.data)==null?void 0:M.queue)==null?void 0:q.length)>0?(K=(te=b==null?void 0:b.data)==null?void 0:te.queue)==null?void 0:K.map((D,ne)=>{var se,I,v,P,Y,j;return(0,n.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),D.queue_name,(v=(I=(se=b==null?void 0:b.data)==null?void 0:se.process)==null?void 0:I.find(z=>z.process_id===D.process_id))!=null&&v.process_name?(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"12px",fontWeight:"600",letterSpacing:"0.02em",textTransform:"capitalize",color:"gray"},children:"("+((j=(Y=(P=b==null?void 0:b.data)==null?void 0:P.process)==null?void 0:Y.find(z=>z.process_id===D.process_id))==null?void 0:j.process_name)+")"}):""]}),(0,n.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{g(D,"QUEUE")},children:(0,n.jsx)(A.Call,{})})]},ne)}):(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"16px",letterSpacing:"0.02em",textTransform:"capitalize",display:"flex",alignItems:"center",justifyContent:"center",width:"100%",margin:"10px 0px",color:"gray",height:"60px"},children:"No Queues Found"})}),!w&&!x&&l==="agents"&&(0,n.jsx)(s.Box,{sx:{display:"flex",gap:1,flexWrap:"wrap"},children:c!=null&&c.data&&((O=c==null?void 0:c.data)==null?void 0:O.length)>0?(T=c==null?void 0:c.data)==null?void 0:T.map((D,ne)=>(0,n.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),D.name]}),(0,n.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{g(D,"AGENT")},children:(0,n.jsx)(A.Call,{})})]},ne)):(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"16px",letterSpacing:"0.02em",textTransform:"capitalize",display:"flex",alignItems:"center",justifyContent:"center",width:"100%",margin:"10px 0px",color:"gray",height:"60px"},children:"No Agents Found"})})]})]})})})}function sn({open:e,setOpen:o,onSubmitDisposition:t}){var w,u,g,y;let[l,r]=(0,pe.useState)({disposition:{label:"Resolved",value:"RES"},followUp:{label:"No",value:"N"},callbackDate:"",callbackHrs:"",callbackMins:""}),a=[{label:"Not Interested",value:"NI"},{label:"Resolved",value:"RES"}],c=[{label:"Yes",value:"Y"},{label:"No",value:"N"}],x=(m,h)=>{r(N=>W(d({},N),{[m]:h}))},E=()=>{r({disposition:{label:"Resolved",value:"RES"},followUp:{label:"No",value:"N"},callbackDate:"",callbackHrs:"",callbackMins:""})},b=()=>{E(),o(!1)};return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"xs",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsx)(s.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:(0,n.jsxs)(s.Typography,{variant:"body1",m:1,children:[" ","Call Disposition"]})}),(0,n.jsxs)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"10px",margin:"10px",borderRadius:"10px"},children:[(0,n.jsxs)(s.Box,{display:"flex",gap:2,children:[(0,n.jsx)(s.Autocomplete,{value:l.disposition,options:a,getOptionLabel:m=>m.label,onChange:(m,h)=>x("disposition",h),size:"small",renderInput:m=>(0,n.jsx)(s.TextField,W(d({},m),{label:"Disposition",fullWidth:!0})),sx:{flex:1}}),(0,n.jsx)(s.Autocomplete,{options:c,getOptionLabel:m=>m.label,value:l.followUp,onChange:(m,h)=>x("followUp",h),size:"small",renderInput:m=>(0,n.jsx)(s.TextField,W(d({},m),{label:"Follow Up",fullWidth:!0})),sx:{flex:1}})]}),((u=(w=l==null?void 0:l.followUp)==null?void 0:w.label)==null?void 0:u.toLowerCase())==="yes"&&(0,n.jsxs)(s.Box,{display:"flex",gap:2,mt:2,children:[(0,n.jsx)(s.TextField,{size:"small",label:"Callback Date",type:"date",slotProps:{inputLabel:{shrink:!0}},value:l.callbackDate,onChange:m=>x("callbackDate",m.target.value),fullWidth:!0,sx:{flex:1}}),(0,n.jsx)(s.TextField,{size:"small",label:"Hours (0-23)",type:"text",value:l.callbackHrs,onChange:m=>x("callbackHrs",m.target.value),fullWidth:!0,sx:{flex:1}})]}),((y=(g=l==null?void 0:l.followUp)==null?void 0:g.label)==null?void 0:y.toLowerCase())==="yes"&&(0,n.jsxs)(s.Box,{display:"flex",gap:2,mt:2,children:[(0,n.jsx)(s.TextField,{size:"small",label:"Minutes (0-59)",type:"text",value:l.callbackMins,onChange:m=>x("callbackMins",m.target.value),fullWidth:!0,sx:{flex:1}}),(0,n.jsx)(s.Box,{sx:{flex:1}})]})]}),(0,n.jsxs)(s.Box,{textAlign:"right",m:2,children:[(0,n.jsx)(s.Button,{variant:"outlined",color:"error",size:"large",onClick:b,sx:{px:2,mx:1,borderRadius:"10px",textTransform:"capitalize"},children:"cancel"}),(0,n.jsx)(s.Button,{variant:"contained",color:"primary",size:"large",onClick:()=>t(l),sx:{px:2,borderRadius:"10px",textTransform:"capitalize"},children:"Submit"})]})]})})})}function an({open:e,setOpen:o,processList:t=null,handleSelectedProcessor:l}){return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",maxWidth:"xs",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,n.jsx)(s.Typography,{variant:"body1",children:" Process List"}),(0,n.jsx)(s.IconButton,{onClick:()=>{o(!1)},children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsx)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px 10px",margin:"10px",borderRadius:"10px"},children:t.length>0?t==null?void 0:t.map((a,c)=>(0,n.jsx)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",margin:"10px 0px",borderRadius:"10px",cursor:"pointer","&:hover":{bgcolor:"action.selected"}},onClick:()=>{l(a)},children:(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),a.process_name]})},c)):null})]})})})}function ln({open:e,setOpen:o}){return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,n.jsx)(s.Typography,{variant:"body1",children:" Call History"}),(0,n.jsx)(s.IconButton,{onClick:()=>{o(!1)},children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsx)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",margin:"10px",borderRadius:"10px",textAlign:"center",fontSize:"16px",fontWeight:"bold"},p:6,children:"Coming Soon..."})]})})})}var p=require("react/jsx-runtime"),wn=(e,o,t)=>e.map(r=>{var a,c,x;if((r==null?void 0:r.line)===1)return{line:1,status:(a=t==null?void 0:t.status)!=null?a:"",type:"internal",phone:(c=t==null?void 0:t.phone_number)!=null?c:"",isMute:!1,isHold:!1,isMergeCall:!1,isCallStart:!0};{let E=`line_${r.line}_status`,b=`line_${r.line}_phonenumber`;return W(d({},r),{status:(x=o[E])!=null?x:"IDLE",phone:o[b]!=="0"?o[b]:""})}}),Nn=e=>{let o=Math.floor(e/60),t=e%60;return`${o.toString().padStart(2,"0")}:${t.toString().padStart(2,"0")}`};function rn({onDataChange:e}){var at,it,lt,rt,ct,pt,dt,ut,gt,ft,mt,xt,Ct,bt,yt,Et,ht,St,Tt,vt,Dt,Lt,_t,It,Rt,At,wt,Nt,kt,Ot,Pt,Mt,Ut,Bt,Ht,zt,$t,qt,Ft,Kt,Wt,Gt,Yt,jt,Xt,Jt,Vt,Zt,Qt,eo,to,oo,no,so,ao,io,lo,ro,co,po,uo,go,fo,mo,xo,Co,bo,yo,Eo,ho,So,To,vo,Do,Lo,_o,Io,Ro,Ao,wo,No;let o=(0,f.useTheme)(),t=he(),{showToast:l}=Ee(),{disabled:r,enabled:a,outlined:c}=Xe({disabled:((at=t.sdkConfig)==null?void 0:at.disabled)||{},enabled:((it=t.sdkConfig)==null?void 0:it.enabled)||{},outlined:((lt=t.sdkConfig)==null?void 0:lt.outlined)||{}}),x=(0,ee.useRef)(null),[E,b]=(0,ee.useState)(null),[w,u]=(0,ee.useState)(!0),[g,y]=(0,ee.useState)(null),[m,h]=(0,ee.useState)(null),[N,U]=(0,ee.useState)(!1),[H,M]=(0,ee.useState)(!1),[q,te]=(0,ee.useState)(!1),[K,O]=(0,ee.useState)(null),[T,D]=(0,ee.useState)(""),[ne,se]=(0,ee.useState)(0),{position:I,isDragging:v,dragRef:P,handleMouseDown:Y,handleTouchStart:j}=tt(t.controlPanelPosition,i=>C.setControlPanelPosition(i)),{position:z,isDragging:J,dragRef:V,handleMouseDown:k,handleTouchStart:_}=tt(t.iframePosition,i=>C.setIframePosition(i)),[F,{isLoading:Z}]=ce({onSuccess:()=>{D(""),h(null)}}),[Q,{isLoading:X}]=ce({onSuccess:()=>{C.setHolding(!t.isHolding)},onError:i=>{console.log("\u274C Hold operation error:",i)}}),[de,{isLoading:Se}]=ce({onSuccess:()=>{C.setMuted(!t.isMuted)},onError:i=>{console.log("\u274C Mute operation error:",i)}}),[Ae,{isLoading:Te}]=ce(),[we,{isLoading:Ne}]=ce(),[ke,{isLoading:ve}]=ce(),Oe=()=>{b(null)},Pe=i=>{u(!0),h(i.currentTarget),C.setStatus("dial")},Me=()=>{t.status!=="on call"&&C.setStatus("idle"),h(null)},De=i=>{y(i.currentTarget)},Ue=()=>{y(null)},Be=()=>{let i={action:"READYAGENT",userId:t.agentId};Ae(R.READY_AGENT,i)},He=i=>{y(null);let S={action:"AGENTBREAK",break_type:i,userId:t.agentId};we(R.UPDATE_AGENT_BREAK,S)},ze=i=>{if(i.length!==10)l("Invalid phone number","error");else if(!/^\d+$/.test(i))l("Invalid phone number","error");else{let S={action:"CALL",phone_number:i,userId:t.agentId};F(R.CLICK_TO_CALL,S)}},$e=()=>{let i={action:t.isHolding?"UNHOLD":"HOLD",userId:t.agentId};Q(R.HOLD_CALL,i)},qe=()=>{let i={action:t.isMuted?"UNMUTE":"MUTE",userId:t.agentId};de(R.MUTE_CALL,i)},ye=i=>{var B,ae,ie,ue,ge,Le,_e,ko,Oo,Po,Mo,Uo,Bo,Ho,zo,$o;console.log("data",i);let S={action:"ENDCALL",userId:t.agentId,processid:(ie=(ae=(B=t.process)==null?void 0:B.process_id)==null?void 0:ae.toString())!=null?ie:"",process_name:(ge=(ue=t.process)==null?void 0:ue.process_name)!=null?ge:"",callreferenceid:(_e=(Le=t.callData)==null?void 0:Le.convox_id)!=null?_e:"",mobile_number:(Oo=(ko=t.callData)==null?void 0:ko.phone_number)!=null?Oo:"",disposition:(Mo=(Po=i==null?void 0:i.disposition)==null?void 0:Po.value)!=null?Mo:"",set_followUp:(Bo=(Uo=i==null?void 0:i.followUp)==null?void 0:Uo.value)!=null?Bo:"",callback_date:(Ho=i==null?void 0:i.callbackDate)!=null?Ho:"",callback_hrs:(zo=i==null?void 0:i.callbackHrs)!=null?zo:"",callback_mins:($o=i==null?void 0:i.callbackMins)!=null?$o:"",endcall_type:"CLOSE"};D(""),ke(R.END_CALL,S),C.endCall(),U(!1)};return(0,ee.useEffect)(()=>{let i=S=>{S.preventDefault()};return window.addEventListener("beforeunload",i),()=>{window.removeEventListener("beforeunload",i)}},[]),(0,ee.useEffect)(()=>{let i;return t.callData.status&&t.callData.status==="ONCALL"?i=setInterval(()=>{let S=Math.floor((Date.now()-t.callStartTime)/1e3);se(S)},1e3):se(0),()=>{i&&clearInterval(i)}},[t.callData.status]),(0,ee.useEffect)(()=>{if(e&&t.callData){let{process_id:i,process_name:S,status:B,phone_number:ae,agent_id:ie,convox_id:ue}=t.callData;e({phone_number:ae,status:B,callReferenceId:ue,agent_id:ie,process_id:i,process_name:S})}},[t.callData,e]),(0,ee.useEffect)(()=>{t.agentId?oe.post(R.PROCESS_LIST,{userId:t.agentId,action:"GETAGENTPROCESSLIST",refno:"1234221233"}).then(i=>{var S,B;console.log(i.data.data,"res4"),i&&i.data&&((S=i==null?void 0:i.data)==null?void 0:S.length)>1?(O(i.data.data),M(!0)):(C.setProcess((B=i==null?void 0:i.data)==null?void 0:B.data[0]),M(!1))}).catch(i=>{l(i.response.data.message,"error")}):console.log("No agentId available, skipping API call")},[t.agentId]),(0,ee.useEffect)(()=>(t.agentId&&(x.current=new WebSocket(`${Wo.WS}?agent_id=${t.agentId}`),x.current.onopen=()=>{console.log("\u{1F310} WebSocket connection established")},x.current.onmessage=i=>{try{let S=JSON.parse(i.data),B=wn(t==null?void 0:t.conferenceLine,S==null?void 0:S.conferencestatus,S);console.log(B,"\u{1F4CA} Parsed JSON:",S),C.updateCallData(S),C.updateConferenceData([...B]),S.status==="ONCALL"&&(C.startCall(),w||u(!0)),S.status==="WRAPUP"&&C.endCall()}catch(S){console.log("\u{1F4E8} Raw message:",i.data)}},x.current.onclose=()=>{console.log("\u{1F50C} WebSocket connection closed")},x.current.onerror=i=>{console.error("\u274C WebSocket error:",i)}),()=>{var i;(i=x.current)==null||i.close()}),[t.agentId]),!t.isInitialized||!t.process?(0,p.jsx)(f.Box,{children:!!H&&(0,p.jsx)(an,{processList:K,open:H,setOpen:M,handleSelectedProcessor:i=>{C.setProcess(i)}})}):(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(f.Box,{children:(0,p.jsx)(f.Fade,{in:!0,timeout:300,children:(0,p.jsx)(f.Paper,{ref:(rt=t.sdkConfig)!=null&&rt.isDraggable?P:null,elevation:v?4:(ct=t.sdkConfig)!=null&&ct.isDraggable?1:0,sx:{position:(pt=t.sdkConfig)!=null&&pt.isDraggable?"fixed":"relative",left:(dt=t.sdkConfig)!=null&&dt.isDraggable?I.x:"auto",top:(ut=t.sdkConfig)!=null&&ut.isDraggable?I.y:"auto",display:"inline-block",width:"auto",flexShrink:0,whiteSpace:"nowrap",p:.5,borderRadius:3,bgcolor:"background.paper",zIndex:(gt=t.sdkConfig)!=null&&gt.isDraggable?Number.MAX_SAFE_INTEGER:0,transition:o.transitions.create(["box-shadow","transform"],{duration:o.transitions.duration.short}),userSelect:"none"},children:(0,p.jsxs)(f.Box,{sx:{display:"flex",alignItems:"center"},children:[(0,p.jsxs)(f.Box,{sx:{display:"flex",alignItems:"center",gap:1,margin:"0px 10px"},children:[((ft=t.sdkConfig)==null?void 0:ft.isDraggable)&&(0,p.jsxs)(f.IconButton,{component:"div",size:"small",sx:{cursor:"all-scroll"},onMouseDown:Y,onTouchStart:j,children:[(0,p.jsx)(L.DragIndicator,{})," "]}),(0,p.jsx)(f.Box,{children:!((mt=t.sdkConfig)!=null&&mt.disabledDialButton)&&(0,p.jsx)(f.Tooltip,{title:"Dial",children:(0,p.jsx)(f.IconButton,{size:"small",onClick:i=>{var S,B,ae,ie,ue,ge,Le,_e;((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())!=="ONCALL"&&((ie=(ae=t.callData)==null?void 0:ae.status)==null?void 0:ie.toUpperCase())!=="BREAK"&&((ge=(ue=t.callData)==null?void 0:ue.status)==null?void 0:ge.toUpperCase())!=="RINGING"&&((_e=(Le=t.callData)==null?void 0:Le.status)==null?void 0:_e.toUpperCase())!=="WRAPUP"&&Pe(i)},sx:{bgcolor:"action.hover","&:hover":{bgcolor:"warning"}},children:(0,p.jsx)(L.WifiCalling3,{sx:{color:((Ct=(xt=t.callData)==null?void 0:xt.status)==null?void 0:Ct.toUpperCase())==="ONCALL"||((yt=(bt=t.callData)==null?void 0:bt.status)==null?void 0:yt.toUpperCase())==="BREAK"||((ht=(Et=t.callData)==null?void 0:Et.status)==null?void 0:ht.toUpperCase())==="RINGING"||((Tt=(St=t.callData)==null?void 0:St.status)==null?void 0:Tt.toUpperCase())==="WRAPUP"?"action.selected":"success.main"}})})})}),(0,p.jsx)(f.Typography,{sx:{color:"success.main",width:"40px",marginRight:"10px",fontSize:"18px",fontWeight:"600"},children:Nn(ne)}),(0,p.jsx)(f.Chip,{sx:{padding:"18px 0px"},label:Ne||Te?(0,p.jsx)(f.Box,{sx:{fontWeight:"bold",width:"60px",display:"flex",alignItems:"center",justifyContent:"center"},children:(0,p.jsx)(f.CircularProgress,{size:"20px"})}):(0,p.jsx)(f.Typography,{variant:"body2",sx:{fontWeight:"bold",width:"60px",textAlign:"center"},children:(Lt=(Dt=(vt=t.callData)==null?void 0:vt.status)==null?void 0:Dt.toUpperCase())!=null?Lt:"N/A"}),onClick:De,deleteIcon:(0,p.jsx)(L.KeyboardArrowDown,{color:"primary"}),onDelete:De})]}),(0,p.jsxs)(f.Box,{sx:{display:"flex",gap:1,justifyContent:"center",alignItems:"center"},children:[(0,p.jsx)(f.Tooltip,{title:"Agent Ready",children:(0,p.jsx)(f.Button,{variant:((It=(_t=t.callData)==null?void 0:_t.status)==null?void 0:It.toUpperCase())==="BREAK"||((At=(Rt=t.callData)==null?void 0:Rt.status)==null?void 0:At.toUpperCase())==="MISSED"?"outlined":"contained",onClick:i=>{var S,B,ae,ie;(((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="BREAK"||((ie=(ae=t.callData)==null?void 0:ae.status)==null?void 0:ie.toUpperCase())==="MISSED")&&(i.stopPropagation(),Be())},classes:{root:((Nt=(wt=t.callData)==null?void 0:wt.status)==null?void 0:Nt.toUpperCase())==="BREAK"||((Ot=(kt=t.callData)==null?void 0:kt.status)==null?void 0:Ot.toUpperCase())==="MISSED"?"outlined":"enabled"},sx:d({},((Mt=(Pt=t.callData)==null?void 0:Pt.status)==null?void 0:Mt.toUpperCase())==="BREAK"||((Bt=(Ut=t.callData)==null?void 0:Ut.status)==null?void 0:Bt.toUpperCase())==="MISSED"?c:a),disabled:Te,children:(0,p.jsx)(L.SupportAgent,{})})}),(0,p.jsx)(f.Tooltip,{title:t.isHolding?"Resume":"Hold",children:(0,p.jsx)(f.Button,{variant:t.isHolding&&((zt=(Ht=t.callData)==null?void 0:Ht.status)==null?void 0:zt.toUpperCase())==="ONCALL"?"contained":"outlined",onClick:i=>{i.stopPropagation(),$e()},sx:t.isHolding&&((qt=($t=t.callData)==null?void 0:$t.status)==null?void 0:qt.toUpperCase())==="ONCALL"?d({},a):((Kt=(Ft=t.callData)==null?void 0:Ft.status)==null?void 0:Kt.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((Gt=(Wt=t.callData)==null?void 0:Wt.status)==null?void 0:Gt.toUpperCase())!=="ONCALL"&&!t.isHolding||X,children:X?(0,p.jsx)(f.CircularProgress,{size:"20px",sx:{color:o.palette.primary.main}}):t.isHolding?(0,p.jsx)(L.PlayArrow,{}):(0,p.jsx)(L.Pause,{})})}),(0,p.jsx)(f.Tooltip,{title:t.isMuted?"Unmute":"Mute",children:(0,p.jsx)(f.Button,{variant:t.isMuted&&((jt=(Yt=t.callData)==null?void 0:Yt.status)==null?void 0:jt.toUpperCase())==="ONCALL"?"contained":"outlined",onClick:i=>{i.stopPropagation(),qe()},sx:t.isMuted&&((Jt=(Xt=t.callData)==null?void 0:Xt.status)==null?void 0:Jt.toUpperCase())==="ONCALL"?d({},a):((Zt=(Vt=t.callData)==null?void 0:Vt.status)==null?void 0:Zt.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((eo=(Qt=t.callData)==null?void 0:Qt.status)==null?void 0:eo.toUpperCase())!=="ONCALL"&&!t.isMuted||Se,children:Se?(0,p.jsx)(f.CircularProgress,{size:"20px",sx:{color:o.palette.primary.main}}):t.isMuted?(0,p.jsx)(L.MicOff,{}):(0,p.jsx)(L.Mic,{})})}),!((to=t.sdkConfig)!=null&&to.disableCallTransferButton)&&(0,p.jsx)(f.Tooltip,{title:"Transfer Call",children:(0,p.jsx)(f.Button,{variant:t.openCallTransferDialog?"contained":"outlined",onClick:i=>{var S,B;((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="ONCALL"&&(i.stopPropagation(),C.setOpenCallTransferDialog(!0))},sx:t.openCallTransferDialog?d({},a):((no=(oo=t.callData)==null?void 0:oo.status)==null?void 0:no.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((ao=(so=t.callData)==null?void 0:so.status)==null?void 0:ao.toUpperCase())!=="ONCALL",children:(0,p.jsx)(L.TransferWithinAStation,{})})}),!((io=t.sdkConfig)!=null&&io.disableConferenceButton)&&(0,p.jsx)(f.Tooltip,{title:"Conference Call",children:(0,p.jsx)(f.Button,{variant:t.openConferenceDialog?"contained":"outlined",onClick:i=>{var S,B;((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="ONCALL"&&(i.stopPropagation(),C.setOpenConferenceDialog(!0))},sx:t.openConferenceDialog?d({},a):((ro=(lo=t.callData)==null?void 0:lo.status)==null?void 0:ro.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((po=(co=t.callData)==null?void 0:co.status)==null?void 0:po.toUpperCase())!=="ONCALL",children:(0,p.jsx)(L.Group,{})})}),!((uo=t.sdkConfig)!=null&&uo.disableEndCallButton)&&(0,p.jsx)(f.Tooltip,{title:"End Call",children:(0,p.jsx)(f.Button,{variant:((fo=(go=t.callData)==null?void 0:go.status)==null?void 0:fo.toUpperCase())==="ONCALL"||((xo=(mo=t.callData)==null?void 0:mo.status)==null?void 0:xo.toUpperCase())==="RINGING"||((bo=(Co=t.callData)==null?void 0:Co.status)==null?void 0:bo.toUpperCase())==="WRAPUP"?"contained":"outlined",onClick:i=>{var S,B,ae,ie,ue,ge;(((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="ONCALL"||((ie=(ae=t.callData)==null?void 0:ae.status)==null?void 0:ie.toUpperCase())==="RINGING"||((ge=(ue=t.callData)==null?void 0:ue.status)==null?void 0:ge.toUpperCase())==="WRAPUP")&&(i.stopPropagation(),U(!0))},sx:((Eo=(yo=t.callData)==null?void 0:yo.status)==null?void 0:Eo.toUpperCase())==="ONCALL"||((So=(ho=t.callData)==null?void 0:ho.status)==null?void 0:So.toUpperCase())==="RINGING"||((vo=(To=t.callData)==null?void 0:To.status)==null?void 0:vo.toUpperCase())==="WRAPUP"?W(d({},a),{borderRight:"1px",backgroundColor:"error.main",minWidth:"60px !important",boxShadow:" 0px 2px 1px #5f3f3f",border:`1px solid ${o.palette.error.light}`,height:"40px","&:hover":{bgcolor:"error.light",boxShadow:" 0px 2px 1px #5f3f3f",border:`0px solid ${o.palette.error.light}`},"&:active":{bgcolor:"error.light",boxShadow:`inset 1px -2px 4px ${o.palette.primary.light}`}}):W(d({},r),{minWidth:"60px !important"}),disabled:((Lo=(Do=t.callData)==null?void 0:Do.status)==null?void 0:Lo.toUpperCase())!=="ONCALL"&&((Io=(_o=t.callData)==null?void 0:_o.status)==null?void 0:Io.toUpperCase())!=="RINGING"&&((Ao=(Ro=t.callData)==null?void 0:Ro.status)==null?void 0:Ao.toUpperCase())!=="WRAPUP"||ve,children:ve?(0,p.jsx)(f.CircularProgress,{size:"20px",color:"error"}):(0,p.jsx)(L.CallEnd,{})})})]})]})})})}),(0,p.jsx)(f.Fade,{in:!0,timeout:300,children:(0,p.jsxs)(f.Paper,{ref:V,elevation:J?4:1,sx:{position:"absolute",left:z.x,top:z.y,borderRadius:2,bgcolor:"background.paper",zIndex:Number.MAX_SAFE_INTEGER,transition:o.transitions.create(["box-shadow","transform"],{duration:o.transitions.duration.short}),visibility:w&&!((wo=t.sdkConfig)!=null&&wo.disableSoftPhone)?"visible":"hidden",userSelect:"none"},children:[(0,p.jsxs)(f.Box,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",cursor:"all-scroll",padding:"0px 10px"},onMouseDown:k,onTouchStart:_,children:[(0,p.jsx)(L.DragIndicator,{sx:{transform:"rotate(90deg)",color:"#7b7b7b"}})," ",(0,p.jsx)(f.IconButton,{onClick:()=>u(!1),children:(0,p.jsx)(L.Close,{})})]}),(0,p.jsx)(f.Box,{children:(0,p.jsx)("iframe",{src:`https://${Fe}/ConVoxCCS/iframe?agent_id=${t.agentId}&process_id=${(No=t.process)==null?void 0:No.process_id}`,height:380,width:420,allow:"camera; microphone; autoplay",style:{border:"none"}})})]})}),(0,p.jsx)(f.Menu,{anchorEl:m,open:!!m,onClose:Me,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,p.jsxs)(f.Box,{sx:{all:"unset",padding:"10px","&hover":{backgroundColor:"white"}},children:[(0,p.jsx)(f.TextField,{size:"small",value:T,placeholder:"Enter Mobile No.",onChange:i=>{D(i.target.value)}}),(0,p.jsx)(f.IconButton,{color:"info",onClick:()=>{ze(T)},children:Z?(0,p.jsx)(f.CircularProgress,{size:"20px",sx:{color:o.palette.success.main}}):(0,p.jsx)(L.Phone,{color:"success"})})]})}),(0,p.jsx)(f.Menu,{anchorEl:g,open:!!g,onClose:Ue,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,p.jsx)(f.MenuItem,{onClick:()=>He("Lunch"),children:"- Break"})}),(0,p.jsx)(f.Menu,{anchorEl:E,open:!!E,onClose:Oe,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,p.jsxs)(f.Box,{sx:{display:"flex",justifyContent:"flex-start",flexDirection:"column",padding:"0px 10px","&hover":{backgroundColor:"white"}},children:[(0,p.jsx)(f.Chip,{icon:(0,p.jsx)(L.Layers,{color:"secondary"}),variant:"outlined",label:"Waiting - 25",sx:{margin:"4px 2px"}}),(0,p.jsx)(f.Chip,{icon:(0,p.jsx)(L.Pending,{color:"info"}),label:"Pending - 99+",variant:"outlined",sx:{margin:"4px 2px"}}),(0,p.jsx)(f.Chip,{icon:(0,p.jsx)(L.Upcoming,{color:"success"}),variant:"outlined",label:"Upcoming - 66",sx:{margin:"4px 2px"}})]})}),!!t.openConferenceDialog&&(0,p.jsx)(on,{}),!!t.openCallTransferDialog&&(0,p.jsx)(nn,{open:t.openCallTransferDialog}),!!N&&(0,p.jsx)(sn,{open:N,setOpen:U,onSubmitDisposition:ye}),!!q&&(0,p.jsx)(ln,{open:q,setOpen:te})]})}var cn=require("react");var pn=require("react/jsx-runtime"),ot=(0,cn.memo)(({children:e})=>(0,pn.jsx)(en,{children:e}));ot.displayName="SDKProvider";var nt=require("react/jsx-runtime"),st=(0,Je.memo)(({onDataChange:e})=>{let o=(0,Je.useCallback)(t=>{try{e&&typeof e=="function"&&e(t)}catch(l){console.error("Error in CallControlPanel data change handler:",l)}},[e]);return(0,nt.jsx)(ot,{children:(0,nt.jsx)(rn,{onDataChange:o})})});st.displayName="CallControlPanel";async function kn({apiKey:e,tenantId:o,agentId:t,sdkConfig:l}){if(!e||typeof e!="string"||e.trim().length===0)throw new Error("SDK initialization failed: API key is required and must be a non-empty string");if(!o||typeof o!="string"||o.trim().length===0)throw new Error("SDK initialization failed: Tenant ID is required and must be a non-empty string");if(!t||typeof t!="string"||t.trim().length===0)throw new Error("SDK initialization failed: Agent ID is required and must be a non-empty string");try{let r=await et.init({apiKey:e.trim(),tenantId:o.trim(),agentId:t.trim(),baseUrl:$});if(r)console.log("SDK initialized successfully"),C.initialize(e.trim(),o.trim(),t.trim(),l,r);else throw console.error("SDK initialization failed: Event tracker initialization returned false"),C.setInitCheck(),new Error("SDK initialization failed: Unable to establish connection with the CTI system")}catch(r){throw console.error("SDK initialization error:",r),C.setInitCheck(),r instanceof Error?r:new Error(`SDK initialization failed: ${String(r)}`)}}function On(){return"6.x.x"}function Pn(){return C.getState().isInitialized}0&&(module.exports={CallControlPanel,getSDKVersion,initSDK,isSDKInitialized,useClickToCall,useEndCall,useGetAuthorizationToken,useGetCallerData,useLogout});
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+
+// call-control-sdk/index.ts
+var index_exports = {};
+__export(index_exports, {
+  CallControlPanel: () => CallControlPanel,
+  getSDKVersion: () => getSDKVersion,
+  initSDK: () => initSDK,
+  isSDKInitialized: () => isSDKInitialized,
+  useClickToCall: () => useClickToCall,
+  useEndCall: () => useEndCall,
+  useGetAuthorizationToken: () => useGetAuthorizationToken,
+  useGetCallerData: () => useGetCallerData,
+  useLogout: () => useLogout
+});
+module.exports = __toCommonJS(index_exports);
+
+// call-control-sdk/lib/services/endPoint.ts
+var IP = "uat-cti.aighospitals.com";
+var BASE_URL = `https://${IP}:8095`;
+var WS_BASE_URL = `wss://${IP}:8095`;
+var VERSION = {
+  v1: "/api/v1"
+};
+var END_POINT = {
+  LOGIN: `${BASE_URL}${VERSION.v1}/cti/login?provider=convox`,
+  READY_AGENT: `${BASE_URL}${VERSION.v1}/cti/ready-agent?provider=convox`,
+  UPDATE_AGENT_BREAK: `${BASE_URL}${VERSION.v1}/cti/update-agent-status?provider=convox`,
+  CLICK_TO_CALL: `${BASE_URL}${VERSION.v1}/cti/calls?provider=convox`,
+  HOLD_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/hold?provider=convox`,
+  MUTE_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/mute?provider=convox`,
+  UNMUTE_CALL: `${BASE_URL}${VERSION.v1}/cti/unmute-call?provider=convox`,
+  END_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/end?provider=convox`,
+  LOGOUT: `${BASE_URL}${VERSION.v1}/cti/logout?provider=convox`,
+  CONFERENCE_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/conference?provider=convox`,
+  CONFERENCE_CALL_HOLD_OR_UN_HOLD: `${BASE_URL}${VERSION.v1}/cti/calls/conference/hold?provider=convox`,
+  CONFERENCE_CALL_MUTE_OT_UN_MUTE: `${BASE_URL}${VERSION.v1}/cti/calls/conference/mute?provider=convox`,
+  CONFERENCE_CALL_END: `${BASE_URL}${VERSION.v1}/cti/calls/conference/hangup?provider=convox`,
+  CONFERENCE_CALL_END_ALL: `${BASE_URL}${VERSION.v1}/cti/calls/conference/hangup/all?provider=convox`,
+  TRANSFER_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/transfer?provider=convox`,
+  AGENTS_LIST: `${BASE_URL}${VERSION.v1}/cti/users`,
+  PROCESS_LIST: `${BASE_URL}${VERSION.v1}/cti/processes-list`,
+  TRANSFER_TO_DETAILS: `${BASE_URL}${VERSION.v1}/cti/transfer-to-details?provider=convox`,
+  CALL_HISTORY: `${BASE_URL}${VERSION.v1}/dashboard/call-history`,
+  SENTIMENTAL_ANALYSIS: `${BASE_URL}${VERSION.v1}/users/get_sentiment_analysis`
+};
+var WS_END_POINT = {
+  WS: `${WS_BASE_URL}${VERSION.v1}/cti/ws`
+};
+var STORAGE_KEY = "call-control-sdk-state";
+
+// call-control-sdk/lib/hooks/sdk-state.ts
+var SDKStateManager = class {
+  constructor() {
+    __publicField(this, "state");
+    __publicField(this, "listeners", []);
+    __publicField(this, "STORAGE_KEY", STORAGE_KEY);
+    __publicField(this, "apiKey");
+    __publicField(this, "tenantId");
+    this.state = this.getInitialState();
+    this.loadFromStorage();
+  }
+  getInitialState() {
+    return {
+      authorization: void 0,
+      process: null,
+      agentId: "",
+      openConferenceDialog: false,
+      openCallTransferDialog: false,
+      isInitialized: false,
+      sdkConfig: {
+        disableEndCallButton: false,
+        disabledDialButton: false,
+        disableCallTransferButton: false,
+        isDraggable: true,
+        disableSoftPhone: false,
+        disableConferenceButton: false,
+        disabled: {},
+        enabled: {},
+        outlined: {}
+      },
+      isHolding: false,
+      isMuted: false,
+      status: "idle",
+      callStartTime: null,
+      controlPanelPosition: { x: 10, y: 10 },
+      iframePosition: { x: 10, y: 80 },
+      callData: {
+        agent_id: "",
+        status: "",
+        type: "",
+        event_time: "",
+        phone_number: ""
+      },
+      conferenceLine: [
+        {
+          line: 1,
+          status: "IDLE",
+          type: "",
+          phone: "",
+          isMute: false,
+          isHold: false,
+          isCallStart: false,
+          isMergeCall: false
+        },
+        {
+          line: 2,
+          status: "IDLE",
+          type: "",
+          phone: "",
+          isMute: false,
+          isHold: false,
+          isCallStart: false,
+          isMergeCall: false
+        },
+        {
+          line: 3,
+          status: "IDLE",
+          type: "",
+          phone: "",
+          isMute: false,
+          isHold: false,
+          isCallStart: false,
+          isMergeCall: false
+        },
+        {
+          line: 4,
+          status: "IDLE",
+          type: "",
+          phone: "",
+          isMute: false,
+          isHold: false,
+          isCallStart: false,
+          isMergeCall: false
+        },
+        {
+          line: 5,
+          status: "IDLE",
+          type: "",
+          phone: "",
+          isMute: false,
+          isHold: false,
+          isCallStart: false,
+          isMergeCall: false
+        }
+      ]
+    };
+  }
+  loadFromStorage() {
+    try {
+      const stored = localStorage.getItem(this.STORAGE_KEY);
+      if (stored) {
+        const parsedState = JSON.parse(stored);
+        this.state = __spreadProps(__spreadValues({}, this.state), {
+          agentId: parsedState.agentId || "",
+          authorization: parsedState.authorization || void 0,
+          process: parsedState.process || null,
+          openConferenceDialog: (parsedState == null ? void 0 : parsedState.openConferenceDialog) || false,
+          openCallTransferDialog: (parsedState == null ? void 0 : parsedState.openCallTransferDialog) || false,
+          isInitialized: parsedState.isInitialized || false,
+          sdkConfig: parsedState.sdkConfig || {
+            disableEndCallButton: false,
+            disabledDialButton: false,
+            disableCallTransferButton: false,
+            isDraggable: true,
+            disableSoftPhone: false,
+            disableConferenceButton: false,
+            disabled: {},
+            enabled: {},
+            outlined: {}
+          },
+          isHolding: parsedState.isHolding || false,
+          isMuted: parsedState.isMuted || false,
+          status: parsedState.status || "idle",
+          callStartTime: parsedState.callStartTime || null,
+          controlPanelPosition: parsedState.controlPanelPosition || {
+            x: 10,
+            y: 10
+          },
+          iframePosition: parsedState.iframePosition || { x: 10, y: 80 },
+          callData: parsedState.callData || {
+            mobileNumber: "",
+            callReferenceId: "",
+            agent_id: "",
+            status: "",
+            type: "",
+            event_time: "",
+            phone_number: ""
+          },
+          // Fix: Properly handle conferenceLine with fallback to initial state
+          conferenceLine: parsedState.conferenceLine && Array.isArray(parsedState.conferenceLine) && parsedState.conferenceLine.length > 0 ? parsedState.conferenceLine : this.state.conferenceLine
+        });
+      }
+    } catch (error) {
+      console.warn("Failed to load SDK state from localStorage:", error);
+    }
+  }
+  saveToStorage() {
+    try {
+      const persistentState = {
+        agentId: this.state.agentId,
+        authorization: this.state.authorization,
+        process: this.state.process,
+        isInitialized: this.state.isInitialized,
+        openConferenceDialog: this.state.openConferenceDialog,
+        openCallTransferDialog: this.state.openCallTransferDialog,
+        sdkConfig: this.state.sdkConfig,
+        isHolding: this.state.isHolding,
+        isMuted: this.state.isMuted,
+        status: this.state.status,
+        callStartTime: this.state.callStartTime,
+        controlPanelPosition: this.state.controlPanelPosition,
+        iframePosition: this.state.iframePosition,
+        callData: this.state.callData,
+        conferenceLine: this.state.conferenceLine
+      };
+      localStorage.setItem(this.STORAGE_KEY, JSON.stringify(persistentState));
+    } catch (error) {
+      console.warn("Failed to save SDK state to localStorage:", error);
+    }
+  }
+  notifyListeners() {
+    this.listeners.forEach((listener) => listener());
+  }
+  validateCredentials(apiKey, tenantId) {
+    if (!apiKey || typeof apiKey !== "string" || apiKey.trim().length === 0) {
+      throw new Error("API key not available");
+    }
+    if (!tenantId || typeof tenantId !== "string" || tenantId.trim().length === 0) {
+      throw new Error("Tenant ID not available");
+    }
+    this.apiKey = apiKey.trim();
+    this.tenantId = tenantId.trim();
+  }
+  initialize(apiKey, tenantId, agentId, sdkConfig, initResult) {
+    this.validateCredentials(apiKey, tenantId);
+    if (!agentId || typeof agentId !== "string" || agentId.trim().length === 0) {
+      throw new Error("Agent ID not available");
+    } else {
+      this.state.agentId = agentId;
+      this.state.openConferenceDialog = false;
+      this.state.openCallTransferDialog = false;
+      this.state.authorization = initResult;
+      this.state.sdkConfig = __spreadValues({
+        disableEndCallButton: false,
+        disabledDialButton: false,
+        disableCallTransferButton: false,
+        isDraggable: true,
+        disableSoftPhone: false,
+        disableConferenceButton: false,
+        disabled: {},
+        enabled: {},
+        outlined: {}
+      }, sdkConfig);
+      this.state.isInitialized = true;
+      this.saveToStorage();
+      this.notifyListeners();
+    }
+  }
+  getState() {
+    return __spreadValues({}, this.state);
+  }
+  getCredentials() {
+    return { apiKey: this.apiKey, tenantId: this.tenantId };
+  }
+  getSdkAuthToken() {
+    var _a2;
+    return (_a2 = this.state.authorization) == null ? void 0 : _a2.accessToken;
+  }
+  subscribe(listener) {
+    this.listeners.push(listener);
+    return () => {
+      const index = this.listeners.indexOf(listener);
+      if (index > -1) {
+        this.listeners.splice(index, 1);
+      }
+    };
+  }
+  setHolding(isHolding) {
+    this.state.isHolding = isHolding;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setMuted(isMuted) {
+    this.state.isMuted = isMuted;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setStatus(status) {
+    this.state.status = status;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setProcess(process) {
+    this.state.process = process;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setControlPanelPosition(position) {
+    this.state.controlPanelPosition = position;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setIframePosition(position) {
+    this.state.iframePosition = position;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  startCall() {
+    this.state.callStartTime = Date.now();
+    this.state.status = "on call";
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  endCall() {
+    this.state.callStartTime = null;
+    this.state.status = "idle";
+    this.state.isHolding = false;
+    this.state.isMuted = false;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setInitCheck() {
+    this.state.isInitialized = false;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setOpenConferenceDialog(open) {
+    this.state.openConferenceDialog = open;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setOpenCallTransferDialog(open) {
+    this.state.openCallTransferDialog = open;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  updateCallData(data) {
+    this.state.callData = __spreadValues(__spreadValues({}, this.state.callData), data);
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  updateConferenceData(data) {
+    this.state.conferenceLine = [...data];
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  setConferenceLine(line) {
+    var _a2;
+    if (!this.state.conferenceLine || !Array.isArray(this.state.conferenceLine)) {
+      console.warn("Conference line data corrupted, resetting to initial state");
+      this.state.conferenceLine = this.getInitialState().conferenceLine;
+    }
+    const conferenceLineData = (_a2 = this.state.conferenceLine) == null ? void 0 : _a2.map((each) => {
+      if (each.line === line.line) {
+        return line;
+      }
+      return each;
+    });
+    this.state.conferenceLine = conferenceLineData;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  resetConferenceLines() {
+    this.state.conferenceLine = this.getInitialState().conferenceLine;
+    this.saveToStorage();
+    this.notifyListeners();
+  }
+  clearStorageAndReset() {
+    try {
+      localStorage.removeItem(this.STORAGE_KEY);
+      this.state = this.getInitialState();
+      this.notifyListeners();
+    } catch (error) {
+      console.warn("Failed to clear localStorage:", error);
+    }
+  }
+  debugStorage() {
+    try {
+      const stored = localStorage.getItem(this.STORAGE_KEY);
+      console.log("Current localStorage data:", stored);
+      if (stored) {
+        console.log("Parsed localStorage data:", JSON.parse(stored));
+      }
+      console.log("Current state:", this.state);
+    } catch (error) {
+      console.error("Error debugging storage:", error);
+    }
+  }
+  getConferenceLines() {
+    return this.state.conferenceLine || [];
+  }
+};
+var sdkStateManager = new SDKStateManager();
+
+// call-control-sdk/lib/hooks/eventsTracker.ts
+var EventTrackerSDK = class {
+  constructor() {
+    __publicField(this, "config", null);
+    __publicField(this, "ticketId", null);
+    __publicField(this, "baseUrl", "");
+    __publicField(this, "eventQueue", []);
+    // private isOnline: boolean = true;
+    // private retryQueue: Array<() => Promise<void>> = [];
+    __publicField(this, "flushTimer", null);
+  }
+  async init(config) {
+    this.config = __spreadValues({
+      autoTrack: true,
+      retryAttempts: 3,
+      queueSize: 100,
+      flushInterval: 5e3
+    }, config);
+    this.baseUrl = config.baseUrl || (typeof window !== "undefined" ? window.location.origin : "");
+    this.setupNetworkDetection();
+    const ticket = await this.createTicket();
+    this.startPeriodicFlush();
+    console.log("EventTracker SDK initialized successfully");
+    return ticket;
+  }
+  isInitialized() {
+    return this.config !== null && this.ticketId !== null;
+  }
+  getConfig() {
+    return this.config;
+  }
+  getTicketId() {
+    return this.ticketId;
+  }
+  async createTicket() {
+    if (!this.config) {
+      throw new Error("EventTracker not initialized");
+    }
+    try {
+      const response = await this.makeRequest("/api/v1/et/init", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "X-API-Key": this.config.apiKey
+        },
+        body: JSON.stringify({
+          agentId: this.config.agentId,
+          sessionId: this.config.sessionId
+        })
+      });
+      if (!response.ok) {
+        sdkStateManager.setInitCheck();
+        throw new Error(`Failed to initialize: ${response.status} ${response.statusText}`);
+      }
+      const data = await response.json();
+      this.ticketId = data.ticketId;
+      if (this.config.autoTrack) {
+        this.setupAutoTracking();
+      }
+      return data;
+    } catch (error) {
+      console.error("EventTracker initialization failed:", error);
+      throw error;
+    }
+  }
+  async logEvent(eventType, eventData) {
+    if (!this.config || !this.ticketId) {
+      console.warn("EventTracker not initialized, skipping event:", eventType);
+      return;
+    }
+    const event = {
+      eventType,
+      eventData,
+      timestamp: Date.now()
+    };
+    this.eventQueue.push(event);
+    if (this.eventQueue.length > (this.config.queueSize || 100)) {
+      this.eventQueue.shift();
+    }
+  }
+  // private async sendEvent(event: {
+  // 	eventType: string;
+  // 	eventData?: EventData;
+  // 	timestamp: number;
+  // }): Promise<void> {
+  // 	if (!this.config || !this.ticketId) return;
+  // 	try {
+  // 		const response = await this.makeRequest("/api/v1/et/event", {
+  // 			method: "POST",
+  // 			headers: {
+  // 				"Content-Type": "application/json",
+  // 				"X-API-Key": this.config.apiKey,
+  // 			},
+  // 			body: JSON.stringify({
+  // 				ticketId: this.ticketId,
+  // 				eventType: event.eventType,
+  // 				eventData: event.eventData,
+  // 			}),
+  // 		});
+  // 		if (!response.ok) {
+  // 			throw new Error(`Failed to log event: ${response.status} ${response.statusText}`);
+  // 		}
+  // 		const index = this.eventQueue.findIndex((e) => e.timestamp === event.timestamp);
+  // 		if (index > -1) {
+  // 			this.eventQueue.splice(index, 1);
+  // 		}
+  // 	} catch (error) {
+  // 		console.error("Event logging failed:", error);
+  // 		// this.retryQueue.push(() => this.sendEvent(event));
+  // 	}
+  // }
+  // async closeTicket(): Promise<void> {
+  // 	if (!this.config || !this.ticketId) {
+  // 		throw new Error("EventTracker not initialized");
+  // 	}
+  // 	await this.flush();
+  // 	try {
+  // 		const response = await this.makeRequest("/api/v1/et/close", {
+  // 			method: "POST",
+  // 			headers: {
+  // 				"Content-Type": "application/json",
+  // 				"X-API-Key": this.config.apiKey,
+  // 			},
+  // 			body: JSON.stringify({
+  // 				ticketId: this.ticketId,
+  // 			}),
+  // 		});
+  // 		if (!response.ok) {
+  // 			throw new Error(`Failed to close ticket: ${response.status} ${response.statusText}`);
+  // 		}
+  // 		this.ticketId = null;
+  // 		this.stopPeriodicFlush();
+  // 		console.log("Ticket closed successfully");
+  // 	} catch (error) {
+  // 		console.error("Ticket close failed:", error);
+  // 		throw error;
+  // 	}
+  // }
+  // async flush(): Promise<void> {
+  // 	if (!this.isOnline || this.eventQueue.length === 0) return;
+  // 	// const eventsToFlush = [...this.eventQueue];
+  // 	// for (const event of eventsToFlush) {
+  // 	// 	await this.sendEvent(event);
+  // 	// }
+  // 	const retryItems = [...this.retryQueue];
+  // 	this.retryQueue = [];
+  // 	for (const retryFn of retryItems) {
+  // 		try {
+  // 			await retryFn();
+  // 		} catch (error) {
+  // 			console.error("Retry failed:", error);
+  // 		}
+  // 	}
+  // }
+  async makeRequest(url, options) {
+    var _a2;
+    const fullUrl = `${this.baseUrl}${url}`;
+    const maxRetries = ((_a2 = this.config) == null ? void 0 : _a2.retryAttempts) || 3;
+    for (let attempt = 1; attempt <= maxRetries; attempt++) {
+      try {
+        const response = await fetch(fullUrl, options);
+        return response;
+      } catch (error) {
+        if (attempt === maxRetries) {
+          throw error;
+        }
+        const delay = Math.min(1e3 * Math.pow(2, attempt - 1), 1e4);
+        await new Promise((resolve) => setTimeout(resolve, delay));
+      }
+    }
+    throw new Error("Max retries exceeded");
+  }
+  setupAutoTracking() {
+    var _a2;
+    if (typeof window === "undefined" || !((_a2 = this.config) == null ? void 0 : _a2.autoTrack)) return;
+    const autoTrackConfig = this.config.autoTrack === true ? {} : this.config.autoTrack;
+    if (autoTrackConfig.pageVisits !== false) {
+      this.logEvent("pageVisit", {
+        url: window.location.href,
+        title: document.title,
+        referrer: document.referrer,
+        userAgent: navigator.userAgent,
+        viewport: {
+          width: window.innerWidth,
+          height: window.innerHeight
+        },
+        timestamp: (/* @__PURE__ */ new Date()).toISOString()
+      }).catch((error) => console.warn("Failed to track page visit:", error));
+    }
+    if (autoTrackConfig.clicks !== false) {
+      document.addEventListener("click", (event) => {
+        var _a3;
+        const target = event.target;
+        if (target.tagName === "BUTTON" || target.tagName === "A" || target.onclick || target.getAttribute("role") === "button" || target instanceof HTMLButtonElement && target.type === "button") {
+          this.logEvent("click", {
+            element: target.tagName,
+            text: (_a3 = target.textContent) == null ? void 0 : _a3.trim().substring(0, 100),
+            href: target.getAttribute("href"),
+            id: target.id,
+            className: target.className,
+            role: target.getAttribute("role"),
+            position: {
+              x: event.clientX,
+              y: event.clientY
+            },
+            timestamp: (/* @__PURE__ */ new Date()).toISOString()
+          }).catch((error) => console.warn("Failed to track click:", error));
+        }
+      });
+    }
+    if (autoTrackConfig.forms !== false) {
+      document.addEventListener("submit", (event) => {
+        const target = event.target;
+        const formData = new FormData(target);
+        const formFields = {};
+        formData.forEach((value, key) => {
+          formFields[key] = value.toString();
+        });
+        this.logEvent("formSubmission", {
+          formId: target.id,
+          action: target.action,
+          method: target.method,
+          fields: Object.keys(formFields),
+          fieldCount: Object.keys(formFields).length,
+          timestamp: (/* @__PURE__ */ new Date()).toISOString()
+        }).catch((error) => console.warn("Failed to track form submission:", error));
+      });
+    }
+    if (autoTrackConfig.inputs !== false) {
+      let inputTimer;
+      document.addEventListener("input", (event) => {
+        const target = event.target;
+        if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT") {
+          clearTimeout(inputTimer);
+          inputTimer = setTimeout(() => {
+            var _a3;
+            this.logEvent("fieldChange", {
+              element: target.tagName,
+              type: target.getAttribute("type"),
+              name: target.getAttribute("name"),
+              id: target.id,
+              valueLength: ((_a3 = target.value) == null ? void 0 : _a3.length) || 0,
+              timestamp: (/* @__PURE__ */ new Date()).toISOString()
+            }).catch((error) => console.warn("Failed to track field change:", error));
+          }, 1e3);
+        }
+      });
+    }
+    const sessionStartTime = Date.now();
+    window.addEventListener("beforeunload", () => {
+      const sessionDuration = Date.now() - sessionStartTime;
+      this.logEvent("pageUnload", {
+        url: window.location.href,
+        sessionDuration,
+        timestamp: (/* @__PURE__ */ new Date()).toISOString()
+      });
+    });
+    if (autoTrackConfig.visibility !== false) {
+      document.addEventListener("visibilitychange", () => {
+        this.logEvent("visibilityChange", {
+          hidden: document.hidden,
+          visibilityState: document.visibilityState,
+          timestamp: (/* @__PURE__ */ new Date()).toISOString()
+        });
+      });
+    }
+    if (autoTrackConfig.errors !== false) {
+      window.addEventListener("error", (event) => {
+        this.logEvent("jsError", {
+          message: event.message,
+          filename: event.filename,
+          lineno: event.lineno,
+          colno: event.colno,
+          timestamp: (/* @__PURE__ */ new Date()).toISOString()
+        });
+      });
+      window.addEventListener("unhandledrejection", (event) => {
+        var _a3;
+        this.logEvent("unhandledRejection", {
+          reason: (_a3 = event.reason) == null ? void 0 : _a3.toString(),
+          timestamp: (/* @__PURE__ */ new Date()).toISOString()
+        });
+      });
+    }
+    if (autoTrackConfig.performance !== false && typeof window.performance !== "undefined" && window.performance.navigation) {
+      window.addEventListener("load", () => {
+        setTimeout(() => {
+          const navigation = window.performance.navigation;
+          const timing = window.performance.timing;
+          this.logEvent("performanceMetrics", {
+            navigationTime: timing.navigationStart,
+            loadTime: timing.loadEventEnd - timing.navigationStart,
+            domReady: timing.domContentLoadedEventEnd - timing.navigationStart,
+            renderTime: timing.loadEventEnd - timing.domContentLoadedEventEnd,
+            navigationType: navigation.type,
+            redirectCount: navigation.redirectCount,
+            timestamp: (/* @__PURE__ */ new Date()).toISOString()
+          });
+        }, 1e3);
+      });
+    }
+  }
+  setupNetworkDetection() {
+    if (typeof window === "undefined") return;
+    window.addEventListener("online", () => {
+      console.log("EventTracker: Back online, flushing queued events");
+    });
+    window.addEventListener("offline", () => {
+      console.log("EventTracker: Offline, queueing events");
+    });
+  }
+  startPeriodicFlush() {
+    if (this.flushTimer) {
+      clearInterval(this.flushTimer);
+    }
+  }
+  // private stopPeriodicFlush(): void {
+  // 	if (this.flushTimer) {
+  // 		clearInterval(this.flushTimer);
+  // 		this.flushTimer = null;
+  // 	}
+  // }
+};
+var eventTracker = new EventTrackerSDK();
+if (typeof window !== "undefined") {
+  window.EventTracker = eventTracker;
+}
+
+// call-control-sdk/lib/hooks/useLogout.ts
+var import_react = require("react");
+
+// call-control-sdk/lib/services/axios.ts
+var import_axios = __toESM(require("axios"));
+var _a;
+var DEFAULT_TOKEN = (_a = sdkStateManager.getSdkAuthToken()) != null ? _a : "";
+var REQUEST_TIMEOUT = 6e4;
+function getAuthToken() {
+  var _a2;
+  return (_a2 = sdkStateManager.getSdkAuthToken()) != null ? _a2 : "";
+}
+function createAxiosInstance() {
+  var _a2, _b, _c, _d;
+  const instance = import_axios.default.create({
+    baseURL: BASE_URL,
+    headers: {
+      "Content-Type": "application/json",
+      Accept: "application/json",
+      "x-tenant-id": (_b = (_a2 = sdkStateManager.getCredentials()) == null ? void 0 : _a2.tenantId) != null ? _b : "",
+      "x-api-key": (_d = (_c = sdkStateManager.getCredentials()) == null ? void 0 : _c.apiKey) != null ? _d : "",
+      Authorization: `${DEFAULT_TOKEN}`
+    },
+    timeout: REQUEST_TIMEOUT,
+    withCredentials: false
+  });
+  instance.interceptors.request.use(
+    (config) => {
+      const token = getAuthToken();
+      if (token && config.headers) {
+        config.headers.Authorization = `${token}`;
+      }
+      config.metadata = { startTime: (/* @__PURE__ */ new Date()).getTime() };
+      return config;
+    },
+    (error) => {
+      console.error("Request interceptor error:", error);
+      return Promise.reject(error);
+    }
+  );
+  instance.interceptors.response.use(
+    (response) => {
+      var _a3;
+      const endTime = (/* @__PURE__ */ new Date()).getTime();
+      const startTime = (_a3 = response.config.metadata) == null ? void 0 : _a3.startTime;
+      if (startTime) {
+        console.log(`Request to ${response.config.url} took ${endTime - startTime}ms`);
+      }
+      return response;
+    },
+    async (error) => {
+      var _a3;
+      const originalRequest = error.config;
+      if (((_a3 = error.response) == null ? void 0 : _a3.status) === 401 && !originalRequest._retry) {
+        sdkStateManager.setInitCheck();
+        console.warn("Unauthorized request, attempting retry...");
+      }
+      if (!error.response) {
+        console.error("Network error:", error.message);
+        error.message = "Network error: Please check your internet connection";
+      }
+      if (error.response && error.response.status >= 500) {
+        console.error("Server error:", error.response.status, error.response.data);
+        error.message = "Server error: Please try again later";
+      }
+      return Promise.reject(error);
+    }
+  );
+  return instance;
+}
+var axiosInstance = createAxiosInstance();
+var axios_default = axiosInstance;
+
+// call-control-sdk/lib/hooks/useLogout.ts
+var useLogout = () => {
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  const [success, setSuccess] = (0, import_react.useState)(false);
+  const [isError, setIsError] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)(null);
+  const [data, setData] = (0, import_react.useState)(null);
+  const handleLogout = (0, import_react.useCallback)(async () => {
+    var _a2;
+    const state = JSON.parse((_a2 = localStorage.getItem(STORAGE_KEY)) != null ? _a2 : "");
+    setLoading(true);
+    const payload = {
+      action: "LOGOUTUSER",
+      userId: state.agentId || ""
+    };
+    return axios_default.post(END_POINT.LOGOUT, payload).then((res) => {
+      sdkStateManager.clearStorageAndReset();
+      localStorage.clear();
+      sessionStorage.clear();
+      setData(res == null ? void 0 : res.data);
+      setSuccess(true);
+      return res == null ? void 0 : res.data;
+    }).catch((err) => {
+      var _a3;
+      setIsError(true);
+      setError(err);
+      return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
+    }).finally(() => {
+      setLoading(false);
+    });
+  }, []);
+  return {
+    logout: handleLogout,
+    isLoading: loading,
+    isSuccess: success,
+    isError,
+    error,
+    data
+  };
+};
+
+// call-control-sdk/lib/hooks/useEndCall.ts
+var import_react2 = require("react");
+var useEndCall = () => {
+  const [loading, setLoading] = (0, import_react2.useState)(false);
+  const [success, setSuccess] = (0, import_react2.useState)(false);
+  const [isError, setIsError] = (0, import_react2.useState)(false);
+  const [error, setError] = (0, import_react2.useState)(null);
+  const [data, setData] = (0, import_react2.useState)(null);
+  const handleEndCall = (0, import_react2.useCallback)(
+    async (data2) => {
+      var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
+      const state = JSON.parse((_a2 = localStorage.getItem(STORAGE_KEY)) != null ? _a2 : "");
+      setLoading(true);
+      const payload = {
+        action: "ENDCALL",
+        userId: state == null ? void 0 : state.agentId,
+        processid: (_d = (_c = (_b = state == null ? void 0 : state.process) == null ? void 0 : _b.process_id) == null ? void 0 : _c.toString()) != null ? _d : "",
+        process_name: (_f = (_e = state == null ? void 0 : state.process) == null ? void 0 : _e.process_name) != null ? _f : "",
+        callreferenceid: (_h = (_g = state == null ? void 0 : state.callData) == null ? void 0 : _g.convox_id) != null ? _h : "",
+        mobile_number: (_j = (_i = state == null ? void 0 : state.callData) == null ? void 0 : _i.phone_number) != null ? _j : "",
+        disposition: (_k = data2 == null ? void 0 : data2.disposition) != null ? _k : "RES",
+        set_followUp: (_l = data2 == null ? void 0 : data2.followUp) != null ? _l : "N",
+        callback_date: (_m = data2 == null ? void 0 : data2.callbackDate) != null ? _m : "",
+        callback_hrs: (_n = data2 == null ? void 0 : data2.callbackHrs) != null ? _n : "",
+        callback_mins: (_o = data2 == null ? void 0 : data2.callbackMins) != null ? _o : "",
+        endcall_type: "CLOSE"
+      };
+      return axios_default.post(END_POINT.END_CALL, payload).then((res) => {
+        sdkStateManager.endCall();
+        setData(res == null ? void 0 : res.data);
+        setSuccess(true);
+        return res == null ? void 0 : res.data;
+      }).catch((err) => {
+        var _a3;
+        setIsError(true);
+        setError(err);
+        return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
+      }).finally(() => {
+        setLoading(false);
+      });
+    },
+    []
+  );
+  return {
+    handleEndCall,
+    isLoading: loading,
+    isSuccess: success,
+    isError,
+    error,
+    data
+  };
+};
+
+// call-control-sdk/lib/hooks/useClickToCall.ts
+var import_react3 = require("react");
+var useClickToCall = () => {
+  const [loading, setLoading] = (0, import_react3.useState)(false);
+  const [success, setSuccess] = (0, import_react3.useState)(false);
+  const [isError, setIsError] = (0, import_react3.useState)(false);
+  const [error, setError] = (0, import_react3.useState)(null);
+  const [data, setData] = (0, import_react3.useState)(null);
+  const handleStartCall = (0, import_react3.useCallback)(async (data2) => {
+    var _a2, _b, _c, _d, _e, _f, _g, _h, _i;
+    const state = JSON.parse((_a2 = localStorage.getItem(STORAGE_KEY)) != null ? _a2 : "");
+    setLoading(true);
+    if (((_b = state == null ? void 0 : state.callData) == null ? void 0 : _b.status) === "IDLE") {
+      const payload = {
+        action: "CALL",
+        userId: state == null ? void 0 : state.agentId,
+        phone_number: data2 == null ? void 0 : data2.mobileNumber
+      };
+      return axios_default.post(END_POINT.CLICK_TO_CALL, payload).then((res) => {
+        setData(res == null ? void 0 : res.data);
+        setSuccess(true);
+        return res == null ? void 0 : res.data;
+      }).catch((err) => {
+        var _a3;
+        setIsError(true);
+        setError(err);
+        return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
+      }).finally(() => {
+        setLoading(false);
+      });
+    } else if (((_c = state == null ? void 0 : state.callData) == null ? void 0 : _c.status) === "ONCALL") {
+      const line_used = (_e = (_d = state == null ? void 0 : state.conferenceLine) == null ? void 0 : _d.filter((each) => each.line !== 1)) == null ? void 0 : _e.find((each) => each.status === "IDLE" && !(each == null ? void 0 : each.isCallStart));
+      const payload = {
+        action: "EXTERNAL_CONFERENCE",
+        operation: `CALL${line_used.line}`,
+        line_used: String(line_used.line),
+        thirdparty_no: data2 == null ? void 0 : data2.mobileNumber,
+        userid: (_g = (_f = state.callData) == null ? void 0 : _f.agent_id) != null ? _g : "",
+        process: (_i = (_h = state.callData) == null ? void 0 : _h.process_name) != null ? _i : ""
+      };
+      return axios_default.post(END_POINT.CONFERENCE_CALL, payload).then((res) => {
+        setData(res == null ? void 0 : res.data);
+        setSuccess(true);
+        sdkStateManager.setConferenceLine(__spreadProps(__spreadValues({}, line_used), {
+          isCallStart: true,
+          status: "ONCALL",
+          phone: data2 == null ? void 0 : data2.mobileNumber
+        }));
+        sdkStateManager.setOpenConferenceDialog(true);
+        return res == null ? void 0 : res.data;
+      }).catch((err) => {
+        var _a3;
+        setIsError(true);
+        setError(err);
+        return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
+      }).finally(() => {
+        setLoading(false);
+      });
+    } else {
+      alert("Agent is not ready");
+    }
+  }, []);
+  return {
+    handleStartCall,
+    isLoading: loading,
+    isSuccess: success,
+    isError,
+    error,
+    data
+  };
+};
+
+// call-control-sdk/lib/hooks/useGetCallerData.ts
+var import_react4 = require("react");
+var useGetCallerData = () => {
+  const { process_id, process_name, status, phone_number, agent_id, convox_id } = sdkStateManager.getState().callData;
+  const initialCallData = {
+    phone_number,
+    status,
+    callReferenceId: convox_id,
+    agent_id,
+    process_id,
+    process_name
+  };
+  const [callData, setCallData] = (0, import_react4.useState)(initialCallData);
+  (0, import_react4.useEffect)(() => {
+    const unsubscribe = sdkStateManager.subscribe(() => {
+      const { process_id: process_id2, process_name: process_name2, status: status2, phone_number: phone_number2, agent_id: agent_id2, convox_id: convox_id2 } = sdkStateManager.getState().callData;
+      const currentCallData = {
+        phone_number: phone_number2,
+        status: status2,
+        callReferenceId: convox_id2,
+        agent_id: agent_id2,
+        process_id: process_id2,
+        process_name: process_name2
+      };
+      setCallData(currentCallData);
+    });
+    return unsubscribe;
+  }, []);
+  return callData;
+};
+
+// call-control-sdk/lib/hooks/useGetAuthorizationToken.ts
+var import_react5 = require("react");
+var useGetAuthorizationToken = () => {
+  const [token, setToken] = (0, import_react5.useState)(sdkStateManager.getSdkAuthToken());
+  (0, import_react5.useEffect)(() => {
+    const unsubscribe = sdkStateManager.subscribe(() => {
+      setToken(sdkStateManager.getSdkAuthToken());
+    });
+    return unsubscribe;
+  }, []);
+  return token;
+};
+
+// call-control-sdk/lib/components/callControlPanel.tsx
+var import_react13 = require("react");
+
+// call-control-sdk/lib/components/callControls.tsx
+var import_icons_material2 = require("@mui/icons-material");
+var import_material4 = require("@mui/material");
+var import_react11 = require("react");
+
+// call-control-sdk/lib/hooks/useDraggable.ts
+var import_react6 = require("react");
+function useDraggable(initialPosition, onPositionChange) {
+  const [position, setPosition] = (0, import_react6.useState)(initialPosition);
+  const [isDragging, setIsDragging] = (0, import_react6.useState)(false);
+  const dragRef = (0, import_react6.useRef)();
+  const dragStart = (0, import_react6.useRef)({ x: 0, y: 0 });
+  const elementStart = (0, import_react6.useRef)({ x: 0, y: 0 });
+  const updatePosition = (0, import_react6.useCallback)(
+    (newPosition) => {
+      const element = dragRef.current;
+      if (!element) return;
+      const rect = element.getBoundingClientRect();
+      const viewportWidth = window.innerWidth;
+      const viewportHeight = window.innerHeight;
+      const constrainedPosition = {
+        x: Math.max(0, Math.min(newPosition.x, viewportWidth - rect.width)),
+        y: Math.max(0, Math.min(newPosition.y, viewportHeight - rect.height))
+      };
+      setPosition(constrainedPosition);
+      onPositionChange == null ? void 0 : onPositionChange(constrainedPosition);
+    },
+    [onPositionChange]
+  );
+  const handleStart = (0, import_react6.useCallback)(
+    (clientX, clientY) => {
+      setIsDragging(true);
+      dragStart.current = { x: clientX, y: clientY };
+      elementStart.current = position;
+      const handleMove = (moveClientX, moveClientY) => {
+        const deltaX = moveClientX - dragStart.current.x;
+        const deltaY = moveClientY - dragStart.current.y;
+        updatePosition({
+          x: elementStart.current.x + deltaX,
+          y: elementStart.current.y + deltaY
+        });
+      };
+      const handleMouseMove = (e) => {
+        e.preventDefault();
+        handleMove(e.clientX, e.clientY);
+      };
+      const handleTouchMove = (e) => {
+        e.preventDefault();
+        const touch = e.touches[0];
+        if (touch) {
+          handleMove(touch.clientX, touch.clientY);
+        }
+      };
+      const handleEnd = () => {
+        setIsDragging(false);
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleEnd);
+        document.removeEventListener("touchmove", handleTouchMove);
+        document.removeEventListener("touchend", handleEnd);
+      };
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleEnd);
+      document.addEventListener("touchmove", handleTouchMove, {
+        passive: false
+      });
+      document.addEventListener("touchend", handleEnd);
+    },
+    [position, updatePosition]
+  );
+  const handleMouseDown = (0, import_react6.useCallback)(
+    (e) => {
+      e.preventDefault();
+      handleStart(e.clientX, e.clientY);
+    },
+    [handleStart]
+  );
+  const handleTouchStart = (0, import_react6.useCallback)(
+    (e) => {
+      e.preventDefault();
+      const touch = e.touches[0];
+      if (touch) {
+        handleStart(touch.clientX, touch.clientY);
+      }
+    },
+    [handleStart]
+  );
+  return {
+    position,
+    isDragging,
+    dragRef,
+    handleMouseDown,
+    handleTouchStart
+  };
+}
+
+// call-control-sdk/lib/hooks/useSDKState.ts
+var import_react7 = require("react");
+function useSDKState() {
+  const [state, setState] = (0, import_react7.useState)(sdkStateManager.getState());
+  (0, import_react7.useEffect)(() => {
+    const unsubscribe = sdkStateManager.subscribe(() => {
+      setState(sdkStateManager.getState());
+    });
+    return unsubscribe;
+  }, []);
+  return state;
+}
+
+// call-control-sdk/lib/services/request.ts
+var import_react9 = require("react");
+
+// call-control-sdk/lib/services/toastMessage.tsx
+var import_react8 = require("react");
+var import_material = require("@mui/material");
+var import_jsx_runtime = require("react/jsx-runtime");
+var ToastContext = (0, import_react8.createContext)(void 0);
+var useToast = () => {
+  const ctx = (0, import_react8.useContext)(ToastContext);
+  if (!ctx) throw new Error("useToast must be used inside ToastProvider");
+  return ctx;
+};
+var ToastProvider = ({ children }) => {
+  const [open, setOpen] = (0, import_react8.useState)(false);
+  const [message, setMessage] = (0, import_react8.useState)("");
+  const [severity, setSeverity] = (0, import_react8.useState)("info");
+  const showToast = (msg, sev = "info") => {
+    setMessage(msg);
+    setSeverity(sev);
+    setOpen(true);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(ToastContext.Provider, { value: { showToast }, children: [
+    children,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_material.Snackbar,
+      {
+        open,
+        color: severity,
+        autoHideDuration: 3e3,
+        onClose: () => setOpen(false),
+        anchorOrigin: { vertical: "top", horizontal: "right" },
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_material.Alert,
+          {
+            variant: "filled",
+            severity,
+            onClose: () => setOpen(false),
+            sx: { width: "100%" },
+            children: message
+          }
+        )
+      }
+    )
+  ] });
+};
+
+// call-control-sdk/lib/services/request.ts
+var initialState = {
+  isLoading: false,
+  isSuccess: false,
+  isError: false,
+  error: null,
+  data: null
+};
+var reducer = (state, action) => {
+  if (action.type === "isLoading") {
+    return __spreadProps(__spreadValues({}, state), {
+      isLoading: action.payload
+    });
+  } else if (action.type === "isSuccess") {
+    return __spreadProps(__spreadValues({}, state), {
+      isSuccess: true,
+      data: action.payload
+    });
+  } else if (action.type === "isError") {
+    return __spreadProps(__spreadValues({}, state), {
+      isError: true,
+      error: action.payload
+    });
+  } else if (action.type === "reset") {
+    return {
+      isLoading: false,
+      isSuccess: false,
+      isError: false,
+      error: null,
+      data: null
+    };
+  }
+  throw Error("Unknown action.");
+};
+var usePostRequest = (props = {}) => {
+  const { onSuccess = null, onError = null, disabledSuccessToast = false } = props;
+  const { showToast } = useToast();
+  const [state, dispatch] = (0, import_react9.useReducer)(reducer, initialState);
+  const postRequest = (0, import_react9.useCallback)(
+    (url, payload, config = {}) => {
+      dispatch({
+        type: "isLoading",
+        payload: true
+      });
+      axios_default.post(url, payload, config).then((res) => {
+        var _a2;
+        dispatch({
+          type: "isSuccess",
+          payload: res.data
+        });
+        onSuccess == null ? void 0 : onSuccess(res.data, payload);
+        if (!disabledSuccessToast) {
+          showToast((_a2 = res.data) == null ? void 0 : _a2.message, "success");
+        }
+      }).catch((err) => {
+        var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
+        const error = {
+          status: (_b = (_a2 = err.response) == null ? void 0 : _a2.status) != null ? _b : 500,
+          message: ((_d = (_c = err.response) == null ? void 0 : _c.data) == null ? void 0 : _d.detail) || ((_f = (_e = err.response) == null ? void 0 : _e.data) == null ? void 0 : _f.message) || err.message || "An unknown error occurred",
+          data: (_h = (_g = err.response) == null ? void 0 : _g.data) != null ? _h : null,
+          statusText: (_j = (_i = err.response) == null ? void 0 : _i.statusText) != null ? _j : "",
+          code: (_k = err == null ? void 0 : err.code) != null ? _k : "",
+          name: (_l = err == null ? void 0 : err.name) != null ? _l : ""
+        };
+        showToast(error.message, "error");
+        dispatch({
+          type: "isError",
+          payload: error
+        });
+        onError == null ? void 0 : onError(error, payload);
+      }).finally(() => {
+        dispatch({
+          type: "isLoading",
+          payload: false
+        });
+      });
+    },
+    [onSuccess, onError, showToast]
+  );
+  return [postRequest, state];
+};
+
+// call-control-sdk/lib/components/dialog.tsx
+var import_icons_material = require("@mui/icons-material");
+var import_material3 = require("@mui/material");
+var import_react10 = require("react");
+
+// call-control-sdk/lib/components/styles.ts
+var import_material2 = require("@mui/material");
+var useStyles = ({
+  disabled,
+  enabled,
+  outlined
+}) => {
+  const theme = (0, import_material2.useTheme)();
+  return {
+    disabled: __spreadValues({
+      padding: "0px",
+      margin: "0px",
+      minWidth: "40px !important",
+      borderRadius: "16px",
+      border: `1px solid rgb(206, 204, 204)`,
+      height: "40px",
+      "&:hover": {
+        boxShadow: " 0px 2px 2px rgba(0, 0, 0, 0.79)",
+        border: `1px solid ${theme.palette.primary.main}`
+      },
+      "&:active": {
+        bgcolor: "primary.main",
+        boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
+      }
+    }, disabled),
+    enabled: __spreadValues({
+      padding: "0px",
+      margin: "0px",
+      minWidth: "40px !important",
+      borderRadius: "16px",
+      boxShadow: " 0px 2px 1px rgba(0, 0, 0, 0.507)",
+      border: `1px solid ${theme.palette.primary.main}`,
+      height: "40px",
+      "&:hover": {
+        boxShadow: " 0px 2px 1px rgba(0, 0, 0, 0.507)",
+        border: `1px solid ${theme.palette.primary.main}`
+      },
+      "&:active": {
+        bgcolor: "primary.main",
+        boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
+      }
+    }, enabled),
+    outlined: __spreadValues({
+      padding: "0px",
+      margin: "0px",
+      minWidth: "40px !important",
+      borderRadius: "16px",
+      backgroundColor: theme.palette.grey[200],
+      boxShadow: `0px 2px 1px ${theme.palette.primary.light}`,
+      border: `0px solid ${theme.palette.primary.main}`,
+      height: "40px",
+      "&:hover": {
+        boxShadow: `0px 2px 1px ${theme.palette.primary.main}`,
+        border: `0px solid ${theme.palette.primary.main}`
+      },
+      "&:active": {
+        bgcolor: "primary.main",
+        boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
+      }
+    }, outlined)
+  };
+};
+var styles_default = useStyles;
+
+// call-control-sdk/lib/components/dialog.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var ConferenceTableRow = ({ each }) => {
+  var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K;
+  const state = useSDKState();
+  const { showToast } = useToast();
+  const { disabled, enabled, outlined } = styles_default({
+    disabled: ((_a2 = state.sdkConfig) == null ? void 0 : _a2.disabled) || {},
+    enabled: ((_b = state.sdkConfig) == null ? void 0 : _b.enabled) || {},
+    outlined: ((_c = state.sdkConfig) == null ? void 0 : _c.outlined) || {}
+  });
+  const theme = (0, import_material3.useTheme)();
+  const [conferenceCallStart, setConferenceCallStart] = (0, import_react10.useState)(false);
+  const [conferenceCallMerge, setConferenceCallMerge] = (0, import_react10.useState)(false);
+  const [conferenceCallHoldOrUnHold, setConferenceCallHoldOrUnHold] = (0, import_react10.useState)(false);
+  const [conferenceCallEnd, setConferenceCallEnd] = (0, import_react10.useState)(false);
+  const onConferenceLineUpdate = (line, data) => {
+    sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
+  };
+  const onConferenceCallStart = (line, data) => {
+    var _a3, _b2, _c2, _d2;
+    const line_used = __spreadValues(__spreadValues({}, line), data);
+    setConferenceCallStart(true);
+    const payload = {
+      action: "EXTERNAL_CONFERENCE",
+      operation: `CALL${line_used.line}`,
+      line_used: String(line_used.line),
+      thirdparty_no: line_used.phone,
+      userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
+      process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
+    };
+    axios_default.post(END_POINT.CONFERENCE_CALL, payload).then((res) => {
+      var _a4;
+      showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
+      sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
+    }).catch((err) => {
+      var _a4, _b3, _c3, _d3;
+      const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
+      showToast(message, "error");
+    }).finally(() => {
+      setConferenceCallStart(false);
+    });
+  };
+  const onMergeConferenceCall = (line, data) => {
+    var _a3, _b2, _c2, _d2;
+    const line_used = __spreadValues(__spreadValues({}, line), data);
+    setConferenceCallMerge(true);
+    const payload = {
+      action: "EXTERNAL_CONFERENCE",
+      operation: `CONFERENCE`,
+      line_used: String(line_used.line),
+      thirdparty_no: line_used.phone,
+      userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
+      process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
+    };
+    axios_default.post(END_POINT.CONFERENCE_CALL, payload).then((res) => {
+      var _a4;
+      showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
+      sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
+    }).catch((err) => {
+      var _a4, _b3, _c3, _d3;
+      const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
+      showToast(message, "error");
+    }).finally(() => {
+      setConferenceCallMerge(false);
+    });
+  };
+  const onHoldOrUnHoldConferenceCall = (line, data, type) => {
+    var _a3, _b2, _c2, _d2;
+    const line_used = __spreadValues(__spreadValues({}, line), data);
+    setConferenceCallHoldOrUnHold(true);
+    const payload = {
+      action: "EXTERNAL_CONFERENCE",
+      operation: type,
+      hold_channel_no: type === "HOLDUSER" ? `hold${line_used.line}` : `unhold${line_used.line}`,
+      userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
+      process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
+    };
+    axios_default.post(END_POINT.CONFERENCE_CALL_HOLD_OR_UN_HOLD, payload).then((res) => {
+      var _a4;
+      showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
+      sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
+    }).catch((err) => {
+      var _a4, _b3, _c3, _d3;
+      const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
+      showToast(message, "error");
+    }).finally(() => {
+      setConferenceCallHoldOrUnHold(false);
+    });
+  };
+  const onEndConferenceCall = (line, data) => {
+    var _a3, _b2, _c2, _d2;
+    const line_used = __spreadValues(__spreadValues({}, line), data);
+    setConferenceCallEnd(true);
+    const payload = {
+      action: "EXTERNAL_CONFERENCE",
+      operation: "HANGUP_CHANNEL",
+      line_used: String(line_used.line),
+      user_type: `THIRDPARTY${line_used.line - 1}`,
+      thirdparty_no: line_used.phone,
+      userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
+      process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
+    };
+    axios_default.post(END_POINT.CONFERENCE_CALL_END, payload).then((res) => {
+      var _a4;
+      showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
+      sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
+    }).catch((err) => {
+      var _a4, _b3, _c3, _d3;
+      const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
+      showToast(message, "error");
+    }).finally(() => {
+      setConferenceCallEnd(false);
+    });
+  };
+  const [holdOrUnHold, { isLoading: holdOrUnHoldLoading }] = usePostRequest({
+    onSuccess: () => {
+      sdkStateManager.setHolding(!state.isHolding);
+    },
+    onError: (error) => {
+      console.log("\u274C Hold operation error:", error);
+    }
+  });
+  const [muteOrUnMute, { isLoading: muteOrUnMuteLoading }] = usePostRequest({
+    onSuccess: () => {
+      sdkStateManager.setMuted(!state.isMuted);
+    },
+    onError: (error) => {
+      console.log("\u274C Mute operation error:", error);
+    }
+  });
+  const handleHoldToggle = () => {
+    var _a3;
+    const payload = {
+      action: ((_a3 = state.callData) == null ? void 0 : _a3.hold) === 1 ? "UNHOLD" : "HOLD",
+      userId: state.agentId
+    };
+    holdOrUnHold(END_POINT.HOLD_CALL, payload);
+  };
+  const handleMuteToggle = () => {
+    var _a3;
+    const payload = {
+      action: ((_a3 = state.callData) == null ? void 0 : _a3.mute) === 1 ? "UNMUTE" : "MUTE",
+      userId: state.agentId
+    };
+    muteOrUnMute(END_POINT.MUTE_CALL, payload);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    import_material3.TableRow,
+    {
+      sx: {
+        border: "2px solid #fff"
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.TableCell,
+          {
+            sx: {
+              padding: "6px",
+              flex: 1,
+              width: "100px"
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Typography, { children: [
+              "Line ",
+              (_d = each == null ? void 0 : each.line) != null ? _d : "",
+              ". "
+            ] })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.TableCell,
+          {
+            sx: {
+              padding: "6px",
+              width: "100px"
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_material3.Typography,
+              {
+                variant: "body2",
+                sx: {
+                  px: 1,
+                  borderRadius: "10px",
+                  flex: 1
+                },
+                children: (_e = each == null ? void 0 : each.status) != null ? _e : ""
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.TableCell,
+          {
+            sx: {
+              padding: "6px",
+              flex: 1
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_material3.TextField,
+              {
+                size: "small",
+                placeholder: "Phone Number",
+                fullWidth: true,
+                value: (each == null ? void 0 : each.phone) || "",
+                disabled: (each == null ? void 0 : each.line) === 1 || (each == null ? void 0 : each.status) === "ONCALL" || (each == null ? void 0 : each.status) === "DISCONNECTED" || (each == null ? void 0 : each.status) === "CONFERENCE" || (each == null ? void 0 : each.status) === "HOLD" || (each == null ? void 0 : each.status) === "MUTE" || (each == null ? void 0 : each.status) === "DIALING" || (each == null ? void 0 : each.status) === "RINGING",
+                onChange: (e) => {
+                  onConferenceLineUpdate(each, { phone: e.target.value });
+                }
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.TableCell,
+          {
+            sx: {
+              padding: "6px",
+              // width: "200px",
+              flex: 1
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+              import_material3.Box,
+              {
+                sx: {
+                  width: "100%",
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "flex-start",
+                  gap: "10px"
+                },
+                children: [
+                  (each == null ? void 0 : each.line) === 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: ((_f = state.callData) == null ? void 0 : _f.hold) === 1 ? "Resume" : "Hold", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.Button,
+                    {
+                      variant: ((_g = state.callData) == null ? void 0 : _g.hold) === 1 && ((_i = (_h = state.callData) == null ? void 0 : _h.status) == null ? void 0 : _i.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
+                      onClick: (e) => {
+                        e.stopPropagation();
+                        handleHoldToggle();
+                      },
+                      sx: ((_j = state.callData) == null ? void 0 : _j.hold) === 1 && ((_l = (_k = state.callData) == null ? void 0 : _k.status) == null ? void 0 : _l.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_n = (_m = state.callData) == null ? void 0 : _m.status) == null ? void 0 : _n.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
+                      disabled: ((_p = (_o = state.callData) == null ? void 0 : _o.status) == null ? void 0 : _p.toUpperCase()) !== "ONCALL" && ((_q = state.callData) == null ? void 0 : _q.hold) !== 1 || holdOrUnHoldLoading,
+                      children: ((_r = state.callData) == null ? void 0 : _r.hold) === 1 ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                        import_material3.Box,
+                        {
+                          sx: {
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            gap: "5px",
+                            width: "98px"
+                          },
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.Typography,
+                              {
+                                sx: {
+                                  color: ((_s = state.callData) == null ? void 0 : _s.hold) === 1 ? "#fff" : "initial"
+                                },
+                                children: "Unhold"
+                              }
+                            ),
+                            holdOrUnHoldLoading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.CircularProgress,
+                              {
+                                size: "16px",
+                                sx: {
+                                  color: theme.palette.primary.main
+                                }
+                              }
+                            ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.PlayArrow, {})
+                          ]
+                        }
+                      ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                        import_material3.Box,
+                        {
+                          sx: {
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            gap: "5px",
+                            width: "98px"
+                          },
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.Typography,
+                              {
+                                sx: {
+                                  color: ((_t = state.callData) == null ? void 0 : _t.hold) === 1 ? "#fff" : "#000"
+                                },
+                                children: "Hold"
+                              }
+                            ),
+                            holdOrUnHoldLoading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.CircularProgress,
+                              {
+                                size: "16px",
+                                sx: {
+                                  color: theme.palette.primary.main
+                                }
+                              }
+                            ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Pause, {})
+                          ]
+                        }
+                      )
+                    }
+                  ) }),
+                  (each == null ? void 0 : each.line) === 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: ((_u = state.callData) == null ? void 0 : _u.mute) === 1 ? "Unmute" : "Mute", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.Button,
+                    {
+                      variant: state.isHolding ? "outlined" : ((_v = state.callData) == null ? void 0 : _v.mute) === 1 && ((_x = (_w = state.callData) == null ? void 0 : _w.status) == null ? void 0 : _x.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
+                      onClick: (e) => {
+                        e.stopPropagation();
+                        handleMuteToggle();
+                      },
+                      sx: ((_y = state.callData) == null ? void 0 : _y.hold) === 1 ? __spreadValues({}, disabled) : ((_z = state.callData) == null ? void 0 : _z.mute) === 1 && ((_B = (_A = state.callData) == null ? void 0 : _A.status) == null ? void 0 : _B.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_D = (_C = state.callData) == null ? void 0 : _C.status) == null ? void 0 : _D.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
+                      disabled: ((_F = (_E = state.callData) == null ? void 0 : _E.status) == null ? void 0 : _F.toUpperCase()) !== "ONCALL" && ((_G = state.callData) == null ? void 0 : _G.mute) !== 1 || muteOrUnMuteLoading || ((_H = state.callData) == null ? void 0 : _H.hold) === 1,
+                      children: ((_I = state.callData) == null ? void 0 : _I.mute) === 1 ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                        import_material3.Box,
+                        {
+                          sx: {
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            gap: "5px",
+                            width: "98px"
+                          },
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.Typography,
+                              {
+                                sx: {
+                                  color: ((_J = state.callData) == null ? void 0 : _J.mute) === 1 ? "#fff" : "initial"
+                                },
+                                children: "Unmute"
+                              }
+                            ),
+                            muteOrUnMuteLoading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.CircularProgress,
+                              {
+                                size: "16px",
+                                sx: {
+                                  color: theme.palette.primary.main
+                                }
+                              }
+                            ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.MicOff, {})
+                          ]
+                        }
+                      ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                        import_material3.Box,
+                        {
+                          sx: {
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            gap: "5px",
+                            width: "98px"
+                          },
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.Typography,
+                              {
+                                sx: {
+                                  color: ((_K = state.callData) == null ? void 0 : _K.mute) === 1 ? "#fff" : "#000"
+                                },
+                                children: "Mute"
+                              }
+                            ),
+                            muteOrUnMuteLoading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.CircularProgress,
+                              {
+                                size: "16px",
+                                sx: {
+                                  color: theme.palette.primary.main
+                                }
+                              }
+                            ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Mic, {})
+                          ]
+                        }
+                      )
+                    }
+                  ) }),
+                  (each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.Button,
+                    {
+                      variant: (each == null ? void 0 : each.status) !== "IDLE" ? "outlined" : "contained",
+                      color: "success",
+                      sx: (each == null ? void 0 : each.status) !== "IDLE" ? __spreadValues({}, disabled) : __spreadProps(__spreadValues({}, enabled), {
+                        border: `0px solid ${theme.palette.success.light}`,
+                        "&:hover": {
+                          bgcolor: "success.light",
+                          boxShadow: `0px 2px 1px ${theme.palette.success.light}`,
+                          border: `0px solid ${theme.palette.success.light}`
+                        },
+                        "&:active": {
+                          bgcolor: "success.light",
+                          boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
+                        }
+                      }),
+                      onClick: () => {
+                        onConferenceCallStart(each, {});
+                      },
+                      disabled: (each == null ? void 0 : each.status) !== "IDLE",
+                      children: conferenceCallStart ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                        import_material3.CircularProgress,
+                        {
+                          size: "20px",
+                          color: "success"
+                        }
+                      ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                        import_icons_material.Call,
+                        {
+                          sx: {
+                            color: (each == null ? void 0 : each.status) !== "IDLE" ? "default" : "#f3f2f2"
+                          }
+                        }
+                      )
+                    }
+                  ) }),
+                  (each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "Merge Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.Button,
+                    {
+                      variant: (each == null ? void 0 : each.status) === "ONCALL" ? "contained" : "outlined",
+                      sx: (each == null ? void 0 : each.status) === "ONCALL" ? __spreadValues({}, enabled) : __spreadValues({}, disabled),
+                      onClick: () => {
+                        onMergeConferenceCall(each, {
+                          isMergeCall: true
+                        });
+                      },
+                      disabled: (each == null ? void 0 : each.status) !== "ONCALL",
+                      children: conferenceCallMerge ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.CircularProgress, { size: "20px" }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.CallSplit, {})
+                    }
+                  ) }),
+                  (each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: (each == null ? void 0 : each.status) !== "HOLD" ? "Hold" : "Un Hold", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.Button,
+                    {
+                      variant: (each == null ? void 0 : each.status) === "HOLD" ? "contained" : "outlined",
+                      sx: (each == null ? void 0 : each.status) === "CONFERENCE" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
+                      onClick: () => {
+                        if (each.status === "HOLD") {
+                          onHoldOrUnHoldConferenceCall(each, { isHold: false }, "UNHOLDUSER");
+                        } else {
+                          onHoldOrUnHoldConferenceCall(each, { isHold: true }, "HOLDUSER");
+                        }
+                      },
+                      disabled: (each == null ? void 0 : each.status) !== "CONFERENCE" && (each == null ? void 0 : each.status) !== "HOLD" || // each?.status === "IDLE" ||
+                      // each?.status === "ONCALL" ||
+                      // each?.status === "DIALING" ||
+                      // each?.status === "RINGING" ||
+                      conferenceCallHoldOrUnHold,
+                      children: conferenceCallHoldOrUnHold ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                        import_material3.CircularProgress,
+                        {
+                          size: "20px",
+                          sx: {
+                            color: theme.palette.primary.main
+                          }
+                        }
+                      ) : each.status === "HOLD" ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.PlayArrow, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Pause, {})
+                    }
+                  ) }),
+                  (each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "End Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.Button,
+                    {
+                      variant: (each == null ? void 0 : each.status) !== "IDLE" && (each == null ? void 0 : each.status) !== "DISCONNECTED" ? "contained" : "outlined",
+                      color: "error",
+                      sx: (each == null ? void 0 : each.status) !== "IDLE" && (each == null ? void 0 : each.status) !== "DISCONNECTED" ? __spreadProps(__spreadValues({}, enabled), {
+                        border: `0px solid ${theme.palette.error.light}`,
+                        "&:hover": {
+                          bgcolor: "error.light",
+                          boxShadow: `0px 2px 1px ${theme.palette.error.light}`,
+                          border: `0px solid ${theme.palette.error.light}`
+                        },
+                        "&:active": {
+                          bgcolor: "error.light",
+                          boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
+                        }
+                      }) : __spreadValues({}, disabled),
+                      onClick: () => {
+                        onEndConferenceCall(each, {
+                          isCallStart: false,
+                          isMergeCall: false,
+                          isMute: false,
+                          isHold: false
+                        });
+                      },
+                      disabled: (each == null ? void 0 : each.status) === "IDLE" || (each == null ? void 0 : each.status) === "DISCONNECTED" || conferenceCallEnd,
+                      children: conferenceCallEnd ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                        import_material3.CircularProgress,
+                        {
+                          size: "20px",
+                          color: "error"
+                        }
+                      ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.CallEnd, {})
+                    }
+                  ) })
+                ]
+              }
+            )
+          }
+        )
+      ]
+    },
+    each.line
+  );
+};
+function ConferenceDialog() {
+  var _a2;
+  const state = useSDKState();
+  const { showToast } = useToast();
+  const [conferenceCallEndAll, setConferenceCallEndAll] = (0, import_react10.useState)(false);
+  const handleClose = () => {
+    sdkStateManager.setOpenConferenceDialog(false);
+  };
+  const onEndAllConferenceCalls = () => {
+    var _a3, _b, _c, _d;
+    setConferenceCallEndAll(true);
+    const payload = {
+      action: "EXTERNAL_CONFERENCE",
+      operation: "ENDCONFERENCE",
+      userid: (_b = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b : "",
+      process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
+    };
+    axios_default.post(END_POINT.CONFERENCE_CALL_END_ALL, payload).then((res) => {
+      var _a4;
+      showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
+      sdkStateManager.resetConferenceLines();
+      handleClose();
+    }).catch((err) => {
+      var _a4, _b2, _c2, _d2;
+      const message = ((_b2 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b2.detail) || ((_d2 = (_c2 = err.response) == null ? void 0 : _c2.data) == null ? void 0 : _d2.message) || err.message || "An unknown error occurred";
+      showToast(message, "error");
+    }).finally(() => {
+      setConferenceCallEndAll(false);
+    });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_material3.Dialog,
+    {
+      open: state.openConferenceDialog,
+      "aria-labelledby": "alert-dialog-title",
+      "aria-describedby": "alert-dialog-description",
+      maxWidth: "md",
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material3.Box,
+          {
+            sx: {
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              padding: "10px 16px"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Typography, { variant: "body1", children: [
+                (_a2 = state == null ? void 0 : state.agentId) != null ? _a2 : "",
+                " conference"
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.Box,
+          {
+            sx: {
+              boxShadow: "1px 1px 2px #e7e5e5ff",
+              margin: "0px 15px",
+              borderRadius: "20px"
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_material3.TableContainer,
+              {
+                component: import_material3.Paper,
+                sx: {
+                  outline: "0px solid gray !important",
+                  boxShadow: "1px 1px 6px #e7e5e5ff"
+                },
+                children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                  import_material3.Table,
+                  {
+                    sx: {
+                      border: "4px solid #ffffff !important"
+                    },
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                        import_material3.TableRow,
+                        {
+                          sx: {
+                            border: "2px solid #f3f3f3ff !important"
+                          },
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.TableCell,
+                              {
+                                sx: {
+                                  padding: "6px"
+                                },
+                                children: "Line"
+                              }
+                            ),
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.TableCell,
+                              {
+                                sx: {
+                                  padding: "6px"
+                                },
+                                children: "Status"
+                              }
+                            ),
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.TableCell,
+                              {
+                                sx: {
+                                  padding: "6px"
+                                },
+                                children: "Mobile Number"
+                              }
+                            ),
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.TableCell,
+                              {
+                                sx: {
+                                  padding: "6px"
+                                },
+                                children: "Call Actions"
+                              }
+                            )
+                          ]
+                        }
+                      ) }),
+                      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.TableBody, { children: state == null ? void 0 : state.conferenceLine.map((each) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ConferenceTableRow, { each })) })
+                    ]
+                  }
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.Box,
+          {
+            textAlign: "center",
+            m: 2,
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+              import_material3.Button,
+              {
+                variant: "outlined",
+                color: "error",
+                size: "large",
+                onClick: onEndAllConferenceCalls,
+                disabled: conferenceCallEndAll,
+                sx: { px: 2, borderRadius: "20px", textTransform: "capitalize" },
+                children: [
+                  conferenceCallEndAll ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.CircularProgress,
+                    {
+                      size: "20px",
+                      color: "error",
+                      sx: {
+                        marginRight: "8px"
+                      }
+                    }
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                    import_material3.IconButton,
+                    {
+                      sx: {
+                        bgcolor: "error.main",
+                        "&:hover": { bgcolor: "error.dark" },
+                        marginRight: "8px",
+                        width: "28px",
+                        height: "28px",
+                        fontSize: "12px",
+                        fontWeight: "600",
+                        lineHeight: "16px",
+                        letterSpacing: "0.02em",
+                        textTransform: "capitalize",
+                        color: "white",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        borderRadius: "50%"
+                      },
+                      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                        import_icons_material.PhoneDisabled,
+                        {
+                          sx: {
+                            color: "white",
+                            fontSize: "16px",
+                            fontWeight: "600"
+                          }
+                        }
+                      )
+                    }
+                  ),
+                  "End Conference"
+                ]
+              }
+            )
+          }
+        )
+      ] })
+    }
+  ) });
+}
+function CallTransferDialog({ open }) {
+  var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
+  const state = useSDKState();
+  const [transferCall] = usePostRequest({
+    onSuccess: () => {
+      sdkStateManager.setOpenCallTransferDialog(false);
+    }
+  });
+  const [currentselecteTab, setCurrentselecteTab] = (0, import_react10.useState)("process");
+  const [getIdelAgentsList, { data: idleAgentsList, isLoading: isIdleAgentsListLoading }] = usePostRequest({
+    disabledSuccessToast: true
+  });
+  const [
+    getProcessAndQueuesList,
+    { data: processAndQueuesList, isLoading: isProcessAndQueuesListLoading }
+  ] = usePostRequest({
+    disabledSuccessToast: true
+  });
+  const handleClose = () => {
+    sdkStateManager.setOpenCallTransferDialog(false);
+  };
+  const handleTransferCall = (data, type) => {
+    var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G;
+    if (type === "PROCESS") {
+      const payload = {
+        mobile_number: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.phone_number) != null ? _b2 : "",
+        userid: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.agent_id) != null ? _d2 : "",
+        type: "PROCESS",
+        transfer_to: (_e2 = data == null ? void 0 : data.process_name) != null ? _e2 : "",
+        callreferenceid: (_g2 = (_f2 = state.callData) == null ? void 0 : _f2.convox_id) != null ? _g2 : "",
+        processid: String((_i2 = (_h2 = state.callData) == null ? void 0 : _h2.process_id) != null ? _i2 : ""),
+        process_name: (_k2 = (_j2 = state.callData) == null ? void 0 : _j2.process_name) != null ? _k2 : ""
+      };
+      transferCall(END_POINT.TRANSFER_CALL, payload);
+    } else if (type === "QUEUE") {
+      const payload = {
+        mobile_number: (_m = (_l2 = state.callData) == null ? void 0 : _l2.phone_number) != null ? _m : "",
+        userid: (_o = (_n = state.callData) == null ? void 0 : _n.agent_id) != null ? _o : "",
+        type: "QUEUE",
+        transfer_to: (_p = data == null ? void 0 : data.queue_name) != null ? _p : "",
+        callreferenceid: (_r = (_q = state.callData) == null ? void 0 : _q.convox_id) != null ? _r : "",
+        processid: String((_t = (_s = state.callData) == null ? void 0 : _s.process_id) != null ? _t : ""),
+        process_name: (_v = (_u = state.callData) == null ? void 0 : _u.process_name) != null ? _v : ""
+      };
+      transferCall(END_POINT.TRANSFER_CALL, payload);
+    } else if (type === "AGENT") {
+      const payload = {
+        mobile_number: (_x = (_w = state.callData) == null ? void 0 : _w.phone_number) != null ? _x : "",
+        userid: (_z = (_y = state.callData) == null ? void 0 : _y.agent_id) != null ? _z : "",
+        type: "AGENT",
+        transfer_to: (_A = data == null ? void 0 : data.user_id) != null ? _A : "",
+        callreferenceid: (_C = (_B = state.callData) == null ? void 0 : _B.convox_id) != null ? _C : "",
+        processid: String((_E = (_D = state.callData) == null ? void 0 : _D.process_id) != null ? _E : ""),
+        process_name: (_G = (_F = state.callData) == null ? void 0 : _F.process_name) != null ? _G : ""
+      };
+      transferCall(END_POINT.TRANSFER_CALL, payload);
+    }
+  };
+  (0, import_react10.useEffect)(() => {
+    getIdelAgentsList(END_POINT.AGENTS_LIST, {
+      status: "IDLE",
+      active: true
+    });
+    getProcessAndQueuesList(END_POINT.TRANSFER_TO_DETAILS, {
+      status: "ACTIVE",
+      active: true
+    });
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_material3.Dialog,
+    {
+      open,
+      "aria-labelledby": "alert-dialog-title",
+      "aria-describedby": "alert-dialog-description",
+      fullWidth: true,
+      maxWidth: "md",
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material3.Box,
+          {
+            sx: {
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              padding: "4px 16px",
+              boxShadow: "0px 1px 2px #f5f5f5ff"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Call Transfer" }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material3.Box,
+          {
+            sx: {
+              boxShadow: "1px 1px 4px #d3d3d3ff",
+              padding: "6px 10px",
+              margin: "10px",
+              borderRadius: "10px"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Box, { sx: { display: "flex", gap: 1 }, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                  import_material3.Button,
+                  {
+                    variant: currentselecteTab === "process" ? "contained" : "outlined",
+                    onClick: () => {
+                      setCurrentselecteTab("process");
+                      getProcessAndQueuesList(END_POINT.TRANSFER_TO_DETAILS, {
+                        status: "ACTIVE",
+                        active: true
+                      });
+                    },
+                    children: "Process"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                  import_material3.Button,
+                  {
+                    variant: currentselecteTab === "queues" ? "contained" : "outlined",
+                    onClick: () => {
+                      setCurrentselecteTab("queues");
+                      getProcessAndQueuesList(END_POINT.TRANSFER_TO_DETAILS, {
+                        status: "ACTIVE",
+                        active: true
+                      });
+                    },
+                    children: "Queues"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                  import_material3.Button,
+                  {
+                    variant: currentselecteTab === "agents" ? "contained" : "outlined",
+                    onClick: () => {
+                      setCurrentselecteTab("agents");
+                      getIdelAgentsList(END_POINT.AGENTS_LIST, {
+                        status: "IDLE",
+                        active: true
+                      });
+                    },
+                    children: "Agents"
+                  }
+                )
+              ] }),
+              (isProcessAndQueuesListLoading || isIdleAgentsListLoading) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                import_material3.Box,
+                {
+                  sx: {
+                    display: "flex",
+                    justifyContent: "center",
+                    alignItems: "center",
+                    height: "80px"
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.CircularProgress, {}),
+                    " "
+                  ]
+                }
+              ),
+              !isProcessAndQueuesListLoading && !isIdleAgentsListLoading && currentselecteTab === "process" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1, flexWrap: "wrap" }, children: ((_a2 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _a2.process) && ((_c = (_b = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _b.process) == null ? void 0 : _c.length) > 0 ? (_e = (_d = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _d.process) == null ? void 0 : _e.map((process, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                import_material3.Box,
+                {
+                  sx: {
+                    p: 1,
+                    display: "flex",
+                    alignItems: "center",
+                    boxShadow: "1px 1px 4px #d3d3d3ff",
+                    padding: "6px",
+                    borderRadius: "10px",
+                    "&:hover": { bgcolor: "action.selected" }
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                      import_material3.Typography,
+                      {
+                        variant: "body1",
+                        sx: {
+                          mx: 1,
+                          width: "200px",
+                          maxWidth: "250px",
+                          display: "flex",
+                          alignItems: "center"
+                        },
+                        children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
+                          process.process_name
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      import_material3.IconButton,
+                      {
+                        color: "success",
+                        sx: {
+                          bgcolor: "action.hover",
+                          "&:hover": { bgcolor: "action.selected" }
+                        },
+                        onClick: () => {
+                          handleTransferCall(process, "PROCESS");
+                        },
+                        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
+                      }
+                    )
+                  ]
+                },
+                index
+              )) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_material3.Typography,
+                {
+                  variant: "body1",
+                  sx: {
+                    fontSize: "16px",
+                    letterSpacing: "0.02em",
+                    textTransform: "capitalize",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    width: "100%",
+                    margin: "10px 0px",
+                    color: "gray",
+                    height: "60px"
+                  },
+                  children: "No Process Found"
+                }
+              ) }),
+              !isProcessAndQueuesListLoading && !isIdleAgentsListLoading && currentselecteTab === "queues" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1, flexWrap: "wrap" }, children: ((_f = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _f.queue) && ((_h = (_g = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _g.queue) == null ? void 0 : _h.length) > 0 ? (_j = (_i = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _i.queue) == null ? void 0 : _j.map((queue, index) => {
+                var _a3, _b2, _c2, _d2, _e2, _f2;
+                return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                  import_material3.Box,
+                  {
+                    sx: {
+                      p: 1,
+                      display: "flex",
+                      alignItems: "center",
+                      boxShadow: "1px 1px 4px #d3d3d3ff",
+                      padding: "6px",
+                      borderRadius: "10px",
+                      "&:hover": { bgcolor: "action.selected" }
+                    },
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                        import_material3.Typography,
+                        {
+                          variant: "body1",
+                          sx: {
+                            mx: 1,
+                            width: "200px",
+                            maxWidth: "250px",
+                            display: "flex",
+                            alignItems: "center"
+                          },
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
+                            queue.queue_name,
+                            ((_c2 = (_b2 = (_a3 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _a3.process) == null ? void 0 : _b2.find(
+                              (process) => process.process_id === queue.process_id
+                            )) == null ? void 0 : _c2.process_name) ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                              import_material3.Typography,
+                              {
+                                variant: "body1",
+                                sx: {
+                                  fontSize: "12px",
+                                  fontWeight: "600",
+                                  letterSpacing: "0.02em",
+                                  textTransform: "capitalize",
+                                  color: "gray"
+                                },
+                                children: "(" + ((_f2 = (_e2 = (_d2 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _d2.process) == null ? void 0 : _e2.find(
+                                  (process) => process.process_id === queue.process_id
+                                )) == null ? void 0 : _f2.process_name) + ")"
+                              }
+                            ) : ""
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                        import_material3.IconButton,
+                        {
+                          color: "success",
+                          sx: {
+                            bgcolor: "action.hover",
+                            "&:hover": { bgcolor: "action.selected" }
+                          },
+                          onClick: () => {
+                            handleTransferCall(queue, "QUEUE");
+                          },
+                          children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
+                        }
+                      )
+                    ]
+                  },
+                  index
+                );
+              }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_material3.Typography,
+                {
+                  variant: "body1",
+                  sx: {
+                    fontSize: "16px",
+                    letterSpacing: "0.02em",
+                    textTransform: "capitalize",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    width: "100%",
+                    margin: "10px 0px",
+                    color: "gray",
+                    height: "60px"
+                  },
+                  children: "No Queues Found"
+                }
+              ) }),
+              !isProcessAndQueuesListLoading && !isIdleAgentsListLoading && currentselecteTab === "agents" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1, flexWrap: "wrap" }, children: (idleAgentsList == null ? void 0 : idleAgentsList.data) && ((_k = idleAgentsList == null ? void 0 : idleAgentsList.data) == null ? void 0 : _k.length) > 0 ? (_l = idleAgentsList == null ? void 0 : idleAgentsList.data) == null ? void 0 : _l.map((agent, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                import_material3.Box,
+                {
+                  sx: {
+                    p: 1,
+                    display: "flex",
+                    alignItems: "center",
+                    boxShadow: "1px 1px 4px #d3d3d3ff",
+                    padding: "6px",
+                    borderRadius: "10px",
+                    "&:hover": { bgcolor: "action.selected" }
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                      import_material3.Typography,
+                      {
+                        variant: "body1",
+                        sx: {
+                          mx: 1,
+                          width: "200px",
+                          maxWidth: "250px",
+                          display: "flex",
+                          alignItems: "center"
+                        },
+                        children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
+                          agent.name
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      import_material3.IconButton,
+                      {
+                        color: "success",
+                        sx: {
+                          bgcolor: "action.hover",
+                          "&:hover": { bgcolor: "action.selected" }
+                        },
+                        onClick: () => {
+                          handleTransferCall(agent, "AGENT");
+                        },
+                        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
+                      }
+                    )
+                  ]
+                },
+                index
+              )) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_material3.Typography,
+                {
+                  variant: "body1",
+                  sx: {
+                    fontSize: "16px",
+                    letterSpacing: "0.02em",
+                    textTransform: "capitalize",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    width: "100%",
+                    margin: "10px 0px",
+                    color: "gray",
+                    height: "60px"
+                  },
+                  children: "No Agents Found"
+                }
+              ) })
+            ]
+          }
+        )
+      ] })
+    }
+  ) });
+}
+function EndCallDispositionDialog({ open, setOpen, onSubmitDisposition }) {
+  var _a2, _b, _c, _d;
+  const [formData, setFormData] = (0, import_react10.useState)({
+    disposition: { label: "Resolved", value: "RES" },
+    followUp: { label: "No", value: "N" },
+    callbackDate: "",
+    callbackHrs: "",
+    callbackMins: ""
+  });
+  const dispositionOptions = [
+    { label: "Not Interested", value: "NI" },
+    { label: "Resolved", value: "RES" }
+  ];
+  const followUpOptions = [
+    { label: "Yes", value: "Y" },
+    { label: "No", value: "N" }
+  ];
+  const handleChange = (field, value) => {
+    setFormData((prev) => __spreadProps(__spreadValues({}, prev), { [field]: value }));
+  };
+  const handleReset = () => {
+    setFormData({
+      disposition: { label: "Resolved", value: "RES" },
+      followUp: { label: "No", value: "N" },
+      callbackDate: "",
+      callbackHrs: "",
+      callbackMins: ""
+    });
+  };
+  const handleClose = () => {
+    handleReset();
+    setOpen(false);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_material3.Dialog,
+    {
+      open,
+      "aria-labelledby": "alert-dialog-title",
+      "aria-describedby": "alert-dialog-description",
+      fullWidth: true,
+      maxWidth: "xs",
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.Box,
+          {
+            sx: {
+              display: "flex",
+              justifyContent: "center",
+              alignItems: "center",
+              padding: "4px 16px",
+              boxShadow: "0px 1px 2px #f5f5f5ff"
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+              import_material3.Typography,
+              {
+                variant: "body1",
+                m: 1,
+                children: [
+                  " ",
+                  "Call Disposition"
+                ]
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material3.Box,
+          {
+            sx: {
+              boxShadow: "1px 1px 4px #d3d3d3ff",
+              padding: "10px",
+              margin: "10px",
+              borderRadius: "10px"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                import_material3.Box,
+                {
+                  display: "flex",
+                  gap: 2,
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      import_material3.Autocomplete,
+                      {
+                        value: formData.disposition,
+                        options: dispositionOptions,
+                        getOptionLabel: (opt) => opt.label,
+                        onChange: (_, val) => handleChange("disposition", val),
+                        size: "small",
+                        renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                          import_material3.TextField,
+                          __spreadProps(__spreadValues({}, params), {
+                            label: "Disposition",
+                            fullWidth: true
+                          })
+                        ),
+                        sx: { flex: 1 }
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      import_material3.Autocomplete,
+                      {
+                        options: followUpOptions,
+                        getOptionLabel: (opt) => opt.label,
+                        value: formData.followUp,
+                        onChange: (_, val) => handleChange("followUp", val),
+                        size: "small",
+                        renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                          import_material3.TextField,
+                          __spreadProps(__spreadValues({}, params), {
+                            label: "Follow Up",
+                            fullWidth: true
+                          })
+                        ),
+                        sx: { flex: 1 }
+                      }
+                    )
+                  ]
+                }
+              ),
+              ((_b = (_a2 = formData == null ? void 0 : formData.followUp) == null ? void 0 : _a2.label) == null ? void 0 : _b.toLowerCase()) === "yes" && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                import_material3.Box,
+                {
+                  display: "flex",
+                  gap: 2,
+                  mt: 2,
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      import_material3.TextField,
+                      {
+                        size: "small",
+                        label: "Callback Date",
+                        type: "date",
+                        slotProps: {
+                          inputLabel: { shrink: true }
+                        },
+                        value: formData.callbackDate,
+                        onChange: (e) => handleChange("callbackDate", e.target.value),
+                        fullWidth: true,
+                        sx: { flex: 1 }
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      import_material3.TextField,
+                      {
+                        size: "small",
+                        label: "Hours (0-23)",
+                        type: "text",
+                        value: formData.callbackHrs,
+                        onChange: (e) => handleChange("callbackHrs", e.target.value),
+                        fullWidth: true,
+                        sx: { flex: 1 }
+                      }
+                    )
+                  ]
+                }
+              ),
+              ((_d = (_c = formData == null ? void 0 : formData.followUp) == null ? void 0 : _c.label) == null ? void 0 : _d.toLowerCase()) === "yes" && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                import_material3.Box,
+                {
+                  display: "flex",
+                  gap: 2,
+                  mt: 2,
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      import_material3.TextField,
+                      {
+                        size: "small",
+                        label: "Minutes (0-59)",
+                        type: "text",
+                        value: formData.callbackMins,
+                        onChange: (e) => handleChange("callbackMins", e.target.value),
+                        fullWidth: true,
+                        sx: { flex: 1 }
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { flex: 1 } })
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material3.Box,
+          {
+            textAlign: "right",
+            m: 2,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_material3.Button,
+                {
+                  variant: "outlined",
+                  color: "error",
+                  size: "large",
+                  onClick: handleClose,
+                  sx: {
+                    px: 2,
+                    mx: 1,
+                    borderRadius: "10px",
+                    textTransform: "capitalize"
+                  },
+                  children: "cancel"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_material3.Button,
+                {
+                  variant: "contained",
+                  color: "primary",
+                  size: "large",
+                  onClick: () => onSubmitDisposition(formData),
+                  sx: { px: 2, borderRadius: "10px", textTransform: "capitalize" },
+                  children: "Submit"
+                }
+              )
+            ]
+          }
+        )
+      ] })
+    }
+  ) });
+}
+function ProcessorListDialog({
+  open,
+  setOpen,
+  processList = null,
+  handleSelectedProcessor
+}) {
+  const handleClose = () => {
+    setOpen(false);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_material3.Dialog,
+    {
+      open,
+      "aria-labelledby": "alert-dialog-title",
+      "aria-describedby": "alert-dialog-description",
+      maxWidth: "xs",
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material3.Box,
+          {
+            sx: {
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              padding: "4px 16px",
+              boxShadow: "0px 1px 2px #f5f5f5ff"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Process List" }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.Box,
+          {
+            sx: {
+              boxShadow: "1px 1px 4px #d3d3d3ff",
+              padding: "6px 10px",
+              margin: "10px",
+              borderRadius: "10px"
+            },
+            children: processList.length > 0 ? processList == null ? void 0 : processList.map((process, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_material3.Box,
+              {
+                sx: {
+                  p: 1,
+                  display: "flex",
+                  alignItems: "center",
+                  boxShadow: "1px 1px 4px #d3d3d3ff",
+                  padding: "6px",
+                  margin: "10px 0px",
+                  borderRadius: "10px",
+                  cursor: "pointer",
+                  "&:hover": { bgcolor: "action.selected" }
+                },
+                onClick: () => {
+                  handleSelectedProcessor(process);
+                },
+                children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                  import_material3.Typography,
+                  {
+                    variant: "body1",
+                    sx: {
+                      mx: 1,
+                      width: "200px",
+                      maxWidth: "250px",
+                      display: "flex",
+                      alignItems: "center"
+                    },
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
+                      process.process_name
+                    ]
+                  }
+                )
+              },
+              index
+            )) : null
+          }
+        )
+      ] })
+    }
+  ) });
+}
+function CallHistoryDialog({ open, setOpen }) {
+  const handleClose = () => {
+    setOpen(false);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_material3.Dialog,
+    {
+      open,
+      "aria-labelledby": "alert-dialog-title",
+      "aria-describedby": "alert-dialog-description",
+      fullWidth: true,
+      maxWidth: "md",
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material3.Box,
+          {
+            sx: {
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              padding: "4px 16px",
+              boxShadow: "0px 1px 2px #f5f5f5ff"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Call History" }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material3.Box,
+          {
+            sx: {
+              boxShadow: "1px 1px 4px #d3d3d3ff",
+              margin: "10px",
+              borderRadius: "10px",
+              textAlign: "center",
+              fontSize: "16px",
+              fontWeight: "bold"
+            },
+            p: 6,
+            children: "Coming Soon..."
+          }
+        )
+      ] })
+    }
+  ) });
+}
+
+// call-control-sdk/lib/utils/audioLoader.ts
+var import_incoming = __toESM(require("./incoming-4WP3FJI4.mp3"));
+var audioBlobUrl = null;
+var audioBuffer = null;
+async function loadAudioAsBlob() {
+  if (audioBlobUrl) {
+    return audioBlobUrl;
+  }
+  if (import_incoming.default.startsWith("data:") || import_incoming.default.startsWith("http://") || import_incoming.default.startsWith("https://") || import_incoming.default.startsWith("blob:")) {
+    return import_incoming.default;
+  }
+  try {
+    const response = await fetch(import_incoming.default);
+    if (!response.ok) {
+      throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+    }
+    const blob = await response.blob();
+    if (blob.size === 0) {
+      throw new Error("Empty blob");
+    }
+    audioBlobUrl = URL.createObjectURL(blob);
+    return audioBlobUrl;
+  } catch (error) {
+    console.warn("Could not create blob URL, using direct URL:", error);
+    return import_incoming.default;
+  }
+}
+async function createAudioElement() {
+  const audio = new Audio();
+  audio.loop = true;
+  audio.volume = 0.7;
+  audio.preload = "auto";
+  let audioUrl = "";
+  try {
+    audioUrl = await loadAudioAsBlob();
+  } catch (error) {
+    console.warn("Failed to load audio as blob, trying direct URL:", error);
+    audioUrl = import_incoming.default;
+  }
+  const tryLoadAudio = async (url) => {
+    return new Promise((resolve) => {
+      const checkCanPlay = () => {
+        const canPlay = audio.readyState >= HTMLMediaElement.HAVE_FUTURE_DATA;
+        if (canPlay) {
+          resolve(true);
+          return;
+        }
+        if (audio.error) {
+          resolve(false);
+          return;
+        }
+        setTimeout(checkCanPlay, 100);
+      };
+      audio.addEventListener("canplay", () => resolve(true), { once: true });
+      audio.addEventListener("error", () => resolve(false), { once: true });
+      audio.src = url;
+      audio.load();
+      setTimeout(() => resolve(false), 2e3);
+    });
+  };
+  let loaded = await tryLoadAudio(audioUrl);
+  if (!loaded && audioUrl !== import_incoming.default) {
+    console.log("Primary URL failed, trying original import URL:", import_incoming.default);
+    loaded = await tryLoadAudio(import_incoming.default);
+    if (loaded) {
+      audioUrl = import_incoming.default;
+    }
+  }
+  if (!loaded) {
+    console.error("Failed to load audio with all methods. URL:", audioUrl);
+  }
+  return audio;
+}
+function cleanupAudioResources() {
+  if (audioBlobUrl) {
+    URL.revokeObjectURL(audioBlobUrl);
+    audioBlobUrl = null;
+  }
+  audioBuffer = null;
+}
+
+// call-control-sdk/lib/components/callControls.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var getCombineConfrenceData = (localState, apiData) => {
+  const localConfrenceData = localState == null ? void 0 : localState.conferenceLine;
+  const apiConferenceData = apiData == null ? void 0 : apiData.conferencestatus;
+  const updatedConferenceData = localConfrenceData.map((item) => {
+    var _a2, _b, _c, _d, _e;
+    if ((item == null ? void 0 : item.line) === 1) {
+      const statusKey = `line_${item.line}_status`;
+      return __spreadProps(__spreadValues({}, item), {
+        line: 1,
+        status: (_b = apiConferenceData[statusKey]) != null ? _b : (_a2 = localState == null ? void 0 : localState.callData) == null ? void 0 : _a2.status,
+        phone: (_d = (_c = localState == null ? void 0 : localState.callData) == null ? void 0 : _c.phone_number) != null ? _d : ""
+      });
+    } else {
+      const statusKey = `line_${item.line}_status`;
+      const phoneKey = `line_${item.line}_phonenumber`;
+      return __spreadProps(__spreadValues({}, item), {
+        status: (_e = apiConferenceData[statusKey]) != null ? _e : item.status,
+        phone: apiConferenceData[phoneKey] === null || apiConferenceData[phoneKey] === "0" ? item.phone : apiConferenceData[phoneKey]
+      });
+    }
+  });
+  return updatedConferenceData;
+};
+var formatDuration = (seconds) => {
+  const mins = Math.floor(seconds / 60);
+  const secs = seconds % 60;
+  return `${mins.toString().padStart(2, "0")}:${secs.toString().padStart(2, "0")}`;
+};
+function CallControls({ onDataChange }) {
+  var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga, _Ha, _Ia, _Ja, _Ka, _La, _Ma;
+  const theme = (0, import_material4.useTheme)();
+  const state = useSDKState();
+  const { showToast } = useToast();
+  const { disabled, enabled, outlined } = styles_default({
+    disabled: ((_a2 = state.sdkConfig) == null ? void 0 : _a2.disabled) || {},
+    enabled: ((_b = state.sdkConfig) == null ? void 0 : _b.enabled) || {},
+    outlined: ((_c = state.sdkConfig) == null ? void 0 : _c.outlined) || {}
+  });
+  const webSocketRef = (0, import_react11.useRef)(null);
+  const audioRef = (0, import_react11.useRef)(null);
+  const reconnectTimeoutRef = (0, import_react11.useRef)(null);
+  const pingIntervalRef = (0, import_react11.useRef)(null);
+  const reconnectAttemptsRef = (0, import_react11.useRef)(0);
+  const maxReconnectAttempts = 60;
+  const baseReconnectDelay = 2e3;
+  const maxReconnectDelay = 3e4;
+  const [anchorEl, setAnchorEl] = (0, import_react11.useState)(null);
+  const [showIframe, setShowIframe] = (0, import_react11.useState)(true);
+  const [statusAnchorEl, setStatusAnchorEl] = (0, import_react11.useState)(null);
+  const [dialerAnchorEl, setDialerAnchorEl] = (0, import_react11.useState)(null);
+  const [openCallDisposition, setOpenCallDisposition] = (0, import_react11.useState)(false);
+  const [openProcessorDialog, setOpenProcessorDialog] = (0, import_react11.useState)(false);
+  const [openCallHistoryDialog, setOpenCallHistoryDialog] = (0, import_react11.useState)(false);
+  const [processList, setProcessList] = (0, import_react11.useState)(null);
+  const [phoneNumber, setPhoneNumber] = (0, import_react11.useState)("");
+  const [callDuration, setCallDuration] = (0, import_react11.useState)(0);
+  const { position, isDragging, dragRef, handleMouseDown, handleTouchStart } = useDraggable(
+    state.controlPanelPosition,
+    (newPosition) => sdkStateManager.setControlPanelPosition(newPosition)
+  );
+  const {
+    position: iframePosition,
+    isDragging: iframeIsDragging,
+    dragRef: iframeDragRef,
+    handleMouseDown: iframeHandleMouseDown,
+    handleTouchStart: iframeHandleTouchStart
+  } = useDraggable(
+    state.iframePosition,
+    (newPosition) => sdkStateManager.setIframePosition(newPosition)
+  );
+  const [clickToCall, { isLoading: clickToCallLoading }] = usePostRequest({
+    onSuccess: () => {
+      setPhoneNumber("");
+      setDialerAnchorEl(null);
+    }
+  });
+  const [holdOrUnHold, { isLoading: holdOrUnHoldLoading }] = usePostRequest({
+    onSuccess: () => {
+      sdkStateManager.setHolding(!state.isHolding);
+    },
+    onError: (error) => {
+      console.log("\u274C Hold operation error:", error);
+    }
+  });
+  const [muteOrUnMute, { isLoading: muteOrUnMuteLoading }] = usePostRequest({
+    onSuccess: () => {
+      sdkStateManager.setMuted(!state.isMuted);
+    },
+    onError: (error) => {
+      console.log("\u274C Mute operation error:", error);
+    }
+  });
+  const [readyAgentStatus, { isLoading: agentReadyLoading }] = usePostRequest();
+  const [updateAgentStatus, { isLoading }] = usePostRequest();
+  const [endCall, { isLoading: endCallLoading }] = usePostRequest({
+    onSuccess: () => {
+      sdkStateManager.resetConferenceLines();
+    }
+  });
+  const handleCloseQueueCounts = () => {
+    setAnchorEl(null);
+  };
+  const handleOpenDialer = (event) => {
+    setShowIframe(true);
+    setDialerAnchorEl(event.currentTarget);
+    sdkStateManager.setStatus("dial");
+  };
+  const handleCloseDialer = () => {
+    if (state.status !== "on call") {
+      sdkStateManager.setStatus("idle");
+    }
+    setDialerAnchorEl(null);
+  };
+  const handleOpenAgentStatus = (event) => {
+    setStatusAnchorEl(event.currentTarget);
+  };
+  const handleCloseAgentStatus = () => {
+    setStatusAnchorEl(null);
+  };
+  const handleAgentReady = () => {
+    const payload = {
+      action: "READYAGENT",
+      userId: state.agentId
+    };
+    readyAgentStatus(END_POINT.READY_AGENT, payload);
+  };
+  const handleUpdateAgentStatus = (status) => {
+    setStatusAnchorEl(null);
+    const payload = {
+      action: "AGENTBREAK",
+      break_type: status,
+      userId: state.agentId
+    };
+    updateAgentStatus(END_POINT.UPDATE_AGENT_BREAK, payload);
+  };
+  const handleStartCall = (number) => {
+    if (number.length !== 10) {
+      showToast("Invalid phone number", "error");
+    } else if (!/^\d+$/.test(number)) {
+      showToast("Invalid phone number", "error");
+    } else {
+      const payload = {
+        action: "CALL",
+        phone_number: number,
+        userId: state.agentId
+      };
+      clickToCall(END_POINT.CLICK_TO_CALL, payload);
+    }
+  };
+  const handleHoldToggle = () => {
+    var _a3;
+    const payload = {
+      action: ((_a3 = state.callData) == null ? void 0 : _a3.hold) === 1 ? "UNHOLD" : "HOLD",
+      userId: state.agentId
+    };
+    holdOrUnHold(END_POINT.HOLD_CALL, payload);
+  };
+  const handleMuteToggle = () => {
+    var _a3;
+    const payload = {
+      action: ((_a3 = state.callData) == null ? void 0 : _a3.mute) === 1 ? "UNMUTE" : "MUTE",
+      userId: state.agentId
+    };
+    muteOrUnMute(END_POINT.MUTE_CALL, payload);
+  };
+  const handleEndCall = (data) => {
+    var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2;
+    const payload = {
+      action: "ENDCALL",
+      userId: state.agentId,
+      processid: (_c2 = (_b2 = (_a3 = state.process) == null ? void 0 : _a3.process_id) == null ? void 0 : _b2.toString()) != null ? _c2 : "",
+      process_name: (_e2 = (_d2 = state.process) == null ? void 0 : _d2.process_name) != null ? _e2 : "",
+      callreferenceid: (_g2 = (_f2 = state.callData) == null ? void 0 : _f2.convox_id) != null ? _g2 : "",
+      mobile_number: (_i2 = (_h2 = state.callData) == null ? void 0 : _h2.phone_number) != null ? _i2 : "",
+      disposition: (_k2 = (_j2 = data == null ? void 0 : data.disposition) == null ? void 0 : _j2.value) != null ? _k2 : "",
+      set_followUp: (_m2 = (_l2 = data == null ? void 0 : data.followUp) == null ? void 0 : _l2.value) != null ? _m2 : "",
+      callback_date: (_n2 = data == null ? void 0 : data.callbackDate) != null ? _n2 : "",
+      callback_hrs: (_o2 = data == null ? void 0 : data.callbackHrs) != null ? _o2 : "",
+      callback_mins: (_p2 = data == null ? void 0 : data.callbackMins) != null ? _p2 : "",
+      endcall_type: "CLOSE"
+    };
+    setPhoneNumber("");
+    endCall(END_POINT.END_CALL, payload);
+    sdkStateManager.endCall();
+    setOpenCallDisposition(false);
+  };
+  (0, import_react11.useEffect)(() => {
+    const handleBeforeUnload = (e) => {
+      e.preventDefault();
+    };
+    window.addEventListener("beforeunload", handleBeforeUnload);
+    return () => {
+      window.removeEventListener("beforeunload", handleBeforeUnload);
+    };
+  }, []);
+  (0, import_react11.useEffect)(() => {
+    let interval;
+    if (state.callData.status && state.callData.status === "ONCALL") {
+      interval = setInterval(() => {
+        const elapsed = Math.floor((Date.now() - state.callStartTime) / 1e3);
+        setCallDuration(elapsed);
+      }, 1e3);
+    } else {
+      setCallDuration(0);
+    }
+    return () => {
+      if (interval) clearInterval(interval);
+    };
+  }, [state.callData.status]);
+  (0, import_react11.useEffect)(() => {
+    createAudioElement().then((audio) => {
+      audioRef.current = audio;
+    }).catch((error) => {
+      console.error("Failed to load audio element:", error);
+    });
+    return () => {
+      if (audioRef.current) {
+        audioRef.current.pause();
+        audioRef.current.currentTime = 0;
+        audioRef.current.src = "";
+        audioRef.current = null;
+      }
+      cleanupAudioResources();
+    };
+  }, []);
+  (0, import_react11.useEffect)(() => {
+    if (onDataChange && state.callData) {
+      const { process_id, process_name, status, phone_number, agent_id, convox_id } = state.callData;
+      const callData = {
+        phone_number,
+        status,
+        callReferenceId: convox_id,
+        agent_id,
+        process_id,
+        process_name
+      };
+      onDataChange(callData);
+    }
+  }, [state.callData, onDataChange]);
+  (0, import_react11.useEffect)(() => {
+    if (state.agentId) {
+      axios_default.post(END_POINT.PROCESS_LIST, {
+        userId: state.agentId,
+        action: "GETAGENTPROCESSLIST",
+        refno: "1234221233"
+      }).then((res) => {
+        var _a3, _b2;
+        if (res && res.data && ((_a3 = res == null ? void 0 : res.data) == null ? void 0 : _a3.length) > 1) {
+          setProcessList(res.data.data);
+          setOpenProcessorDialog(true);
+        } else {
+          sdkStateManager.setProcess((_b2 = res == null ? void 0 : res.data) == null ? void 0 : _b2.data[0]);
+          setOpenProcessorDialog(false);
+        }
+      }).catch((err) => {
+        showToast(err.response.data.message, "error");
+      });
+    } else {
+      console.log("No agentId available, skipping API call");
+    }
+  }, [state.agentId]);
+  const connectWebSocket = () => {
+    if (!state.agentId) {
+      console.log("No agentId available, cannot connect WebSocket");
+      return;
+    }
+    if (reconnectTimeoutRef.current) {
+      clearTimeout(reconnectTimeoutRef.current);
+      reconnectTimeoutRef.current = null;
+    }
+    try {
+      webSocketRef.current = new WebSocket(`${WS_END_POINT.WS}?agent_id=${state.agentId}`);
+      webSocketRef.current.onopen = () => {
+        console.log("\u{1F310} WebSocket connection established");
+        reconnectAttemptsRef.current = 0;
+        if (pingIntervalRef.current) {
+          clearInterval(pingIntervalRef.current);
+        }
+        pingIntervalRef.current = setInterval(() => {
+          if (webSocketRef.current && webSocketRef.current.readyState === WebSocket.OPEN) {
+            try {
+              webSocketRef.current.send(JSON.stringify({ type: "ping" }));
+              console.log("\u{1F4E1} WebSocket ping sent");
+            } catch (error) {
+              console.error("Failed to send ping:", error);
+            }
+          }
+        }, 3e4);
+      };
+      webSocketRef.current.onmessage = (event) => {
+        try {
+          const data = JSON.parse(event.data);
+          if (data.type === "pong") {
+            console.log("\u{1F4E1} WebSocket pong received");
+            return;
+          }
+          const rls = localStorage.getItem("call-control-sdk-state");
+          const confrence = getCombineConfrenceData(JSON.parse(rls || "{}"), data);
+          sdkStateManager.updateCallData(data);
+          sdkStateManager.updateConferenceData([...confrence]);
+          if (data.status === "RINGING" || data.status === "DIALING") {
+            if (audioRef.current) {
+              audioRef.current.play().catch((error) => {
+                console.error("Failed to play ringtone:", error);
+              });
+            }
+          } else {
+            if (audioRef.current) {
+              audioRef.current.pause();
+              audioRef.current.currentTime = 0;
+            }
+          }
+          if (data.status === "ONCALL") {
+            sdkStateManager.startCall();
+            if (!showIframe) {
+              setShowIframe(true);
+            }
+          }
+          if (data.status === "WRAPUP") {
+            sdkStateManager.endCall();
+          }
+        } catch (e) {
+          console.log("\u{1F4E8} Raw message:", event.data);
+        }
+      };
+      webSocketRef.current.onclose = (event) => {
+        console.log("\u{1F50C} WebSocket connection closed", event.code, event.reason);
+        if (pingIntervalRef.current) {
+          clearInterval(pingIntervalRef.current);
+          pingIntervalRef.current = null;
+        }
+        if (event.code !== 1e3 && reconnectAttemptsRef.current < maxReconnectAttempts) {
+          reconnectAttemptsRef.current += 1;
+          const delay = Math.min(
+            baseReconnectDelay * Math.pow(2, reconnectAttemptsRef.current - 1),
+            maxReconnectDelay
+          );
+          console.log(
+            `\u{1F504} Attempting to reconnect WebSocket (attempt ${reconnectAttemptsRef.current}/${maxReconnectAttempts}) in ${delay}ms`
+          );
+          reconnectTimeoutRef.current = setTimeout(() => {
+            connectWebSocket();
+          }, delay);
+        } else if (reconnectAttemptsRef.current >= maxReconnectAttempts) {
+          console.error("\u274C Maximum reconnection attempts reached. Please refresh the page.");
+          showToast("WebSocket connection failed. Please refresh the page.", "error");
+        }
+      };
+      webSocketRef.current.onerror = (error) => {
+        console.error("\u274C WebSocket error:", error);
+      };
+    } catch (error) {
+      console.error("\u274C Failed to create WebSocket:", error);
+      if (reconnectAttemptsRef.current < maxReconnectAttempts) {
+        reconnectAttemptsRef.current += 1;
+        const delay = Math.min(
+          baseReconnectDelay * Math.pow(2, reconnectAttemptsRef.current - 1),
+          maxReconnectDelay
+        );
+        reconnectTimeoutRef.current = setTimeout(() => {
+          connectWebSocket();
+        }, delay);
+      }
+    }
+  };
+  (0, import_react11.useEffect)(() => {
+    if (state.agentId) {
+      connectWebSocket();
+    }
+    return () => {
+      if (reconnectTimeoutRef.current) {
+        clearTimeout(reconnectTimeoutRef.current);
+        reconnectTimeoutRef.current = null;
+      }
+      if (pingIntervalRef.current) {
+        clearInterval(pingIntervalRef.current);
+        pingIntervalRef.current = null;
+      }
+      if (webSocketRef.current) {
+        webSocketRef.current.close(1e3, "Component unmounting");
+        webSocketRef.current = null;
+      }
+      reconnectAttemptsRef.current = 0;
+    };
+  }, [state.agentId]);
+  if (!state.isInitialized || !state.process) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: Boolean(openProcessorDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      ProcessorListDialog,
+      {
+        processList,
+        open: openProcessorDialog,
+        setOpen: setOpenProcessorDialog,
+        handleSelectedProcessor: (data) => {
+          sdkStateManager.setProcess(data);
+        }
+      }
+    ) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_material4.Fade,
+      {
+        in: true,
+        timeout: 300,
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          import_material4.Paper,
+          {
+            ref: ((_d = state.sdkConfig) == null ? void 0 : _d.isDraggable) ? dragRef : null,
+            elevation: isDragging ? 4 : ((_e = state.sdkConfig) == null ? void 0 : _e.isDraggable) ? 1 : 0,
+            sx: {
+              position: ((_f = state.sdkConfig) == null ? void 0 : _f.isDraggable) ? "fixed" : "relative",
+              left: ((_g = state.sdkConfig) == null ? void 0 : _g.isDraggable) ? position.x : "auto",
+              top: ((_h = state.sdkConfig) == null ? void 0 : _h.isDraggable) ? position.y : "auto",
+              display: "inline-block",
+              width: "auto",
+              flexShrink: 0,
+              whiteSpace: "nowrap",
+              p: 0.5,
+              borderRadius: 3,
+              bgcolor: "background.paper",
+              zIndex: ((_i = state.sdkConfig) == null ? void 0 : _i.isDraggable) ? Number.MAX_SAFE_INTEGER : 0,
+              transition: theme.transitions.create(["box-shadow", "transform"], {
+                duration: theme.transitions.duration.short
+              }),
+              userSelect: "none"
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+              import_material4.Box,
+              {
+                sx: {
+                  display: "flex",
+                  alignItems: "center"
+                },
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                    import_material4.Box,
+                    {
+                      sx: {
+                        display: "flex",
+                        alignItems: "center",
+                        gap: 1,
+                        margin: "0px 10px"
+                      },
+                      children: [
+                        ((_j = state.sdkConfig) == null ? void 0 : _j.isDraggable) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                          import_material4.IconButton,
+                          {
+                            component: "div",
+                            size: "small",
+                            sx: {
+                              cursor: "all-scroll"
+                            },
+                            onMouseDown: handleMouseDown,
+                            onTouchStart: handleTouchStart,
+                            children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.DragIndicator, {}),
+                              " "
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: !((_k = state.sdkConfig) == null ? void 0 : _k.disabledDialButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Dial", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.IconButton,
+                          {
+                            size: "small",
+                            onClick: (e) => {
+                              var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
+                              if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) !== "ONCALL" && ((_d2 = (_c2 = state.callData) == null ? void 0 : _c2.status) == null ? void 0 : _d2.toUpperCase()) !== "BREAK" && ((_f2 = (_e2 = state.callData) == null ? void 0 : _e2.status) == null ? void 0 : _f2.toUpperCase()) !== "RINGING" && ((_h2 = (_g2 = state.callData) == null ? void 0 : _g2.status) == null ? void 0 : _h2.toUpperCase()) !== "WRAPUP") {
+                                handleOpenDialer(e);
+                              }
+                            },
+                            sx: {
+                              bgcolor: "action.hover",
+                              "&:hover": {
+                                bgcolor: "warning"
+                              }
+                            },
+                            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              import_icons_material2.WifiCalling3,
+                              {
+                                sx: {
+                                  color: ((_m = (_l = state.callData) == null ? void 0 : _l.status) == null ? void 0 : _m.toUpperCase()) === "ONCALL" || ((_o = (_n = state.callData) == null ? void 0 : _n.status) == null ? void 0 : _o.toUpperCase()) === "BREAK" || ((_q = (_p = state.callData) == null ? void 0 : _p.status) == null ? void 0 : _q.toUpperCase()) === "RINGING" || ((_s = (_r = state.callData) == null ? void 0 : _r.status) == null ? void 0 : _s.toUpperCase()) === "WRAPUP" ? "action.selected" : "success.main"
+                                }
+                              }
+                            )
+                          }
+                        ) }) }),
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Typography,
+                          {
+                            sx: {
+                              color: "success.main",
+                              width: "40px",
+                              marginRight: "10px",
+                              fontSize: "18px",
+                              fontWeight: "600"
+                            },
+                            children: formatDuration(callDuration)
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Chip,
+                          {
+                            sx: {
+                              padding: "18px 0px"
+                            },
+                            label: isLoading || agentReadyLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              import_material4.Box,
+                              {
+                                sx: {
+                                  fontWeight: "bold",
+                                  width: "60px",
+                                  display: "flex",
+                                  alignItems: "center",
+                                  justifyContent: "center"
+                                },
+                                children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.CircularProgress, { size: "20px" })
+                              }
+                            ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              import_material4.Typography,
+                              {
+                                variant: "body2",
+                                sx: {
+                                  fontWeight: "bold",
+                                  width: "60px",
+                                  textAlign: "center"
+                                },
+                                children: (_v = (_u = (_t = state.callData) == null ? void 0 : _t.status) == null ? void 0 : _u.toUpperCase()) != null ? _v : "N/A"
+                              }
+                            ),
+                            onClick: handleOpenAgentStatus,
+                            deleteIcon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.KeyboardArrowDown, { color: "primary" }),
+                            onDelete: handleOpenAgentStatus
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                    import_material4.Box,
+                    {
+                      sx: {
+                        display: "flex",
+                        gap: 1,
+                        justifyContent: "center",
+                        alignItems: "center"
+                      },
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Agent Ready", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Button,
+                          {
+                            variant: ((_x = (_w = state.callData) == null ? void 0 : _w.status) == null ? void 0 : _x.toUpperCase()) === "BREAK" || ((_z = (_y = state.callData) == null ? void 0 : _y.status) == null ? void 0 : _z.toUpperCase()) === "MISSED" ? "outlined" : "contained",
+                            onClick: (e) => {
+                              var _a3, _b2, _c2, _d2;
+                              if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "BREAK" || ((_d2 = (_c2 = state.callData) == null ? void 0 : _c2.status) == null ? void 0 : _d2.toUpperCase()) === "MISSED") {
+                                e.stopPropagation();
+                                handleAgentReady();
+                              }
+                            },
+                            classes: {
+                              root: ((_B = (_A = state.callData) == null ? void 0 : _A.status) == null ? void 0 : _B.toUpperCase()) === "BREAK" || ((_D = (_C = state.callData) == null ? void 0 : _C.status) == null ? void 0 : _D.toUpperCase()) === "MISSED" ? "outlined" : "enabled"
+                            },
+                            sx: __spreadValues({}, ((_F = (_E = state.callData) == null ? void 0 : _E.status) == null ? void 0 : _F.toUpperCase()) === "BREAK" || ((_H = (_G = state.callData) == null ? void 0 : _G.status) == null ? void 0 : _H.toUpperCase()) === "MISSED" ? outlined : enabled),
+                            disabled: agentReadyLoading,
+                            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.SupportAgent, {})
+                          }
+                        ) }),
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: ((_I = state.callData) == null ? void 0 : _I.hold) === 1 ? "Resume" : "Hold", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Button,
+                          {
+                            variant: ((_J = state.callData) == null ? void 0 : _J.hold) === 1 && ((_L = (_K = state.callData) == null ? void 0 : _K.status) == null ? void 0 : _L.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
+                            onClick: (e) => {
+                              e.stopPropagation();
+                              handleHoldToggle();
+                            },
+                            sx: ((_M = state.callData) == null ? void 0 : _M.hold) === 1 && ((_O = (_N = state.callData) == null ? void 0 : _N.status) == null ? void 0 : _O.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_Q = (_P = state.callData) == null ? void 0 : _P.status) == null ? void 0 : _Q.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
+                            disabled: ((_S = (_R = state.callData) == null ? void 0 : _R.status) == null ? void 0 : _S.toUpperCase()) !== "ONCALL" && ((_T = state.callData) == null ? void 0 : _T.hold) !== 1 || holdOrUnHoldLoading,
+                            children: holdOrUnHoldLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              import_material4.CircularProgress,
+                              {
+                                size: "20px",
+                                sx: {
+                                  color: theme.palette.primary.main
+                                }
+                              }
+                            ) : ((_U = state.callData) == null ? void 0 : _U.hold) === 1 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.PlayArrow, {}) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Pause, {})
+                          }
+                        ) }),
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: ((_V = state.callData) == null ? void 0 : _V.mute) === 1 ? "Unmute" : "Mute", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Button,
+                          {
+                            variant: state.isHolding ? "outlined" : ((_W = state.callData) == null ? void 0 : _W.mute) === 1 && ((_Y = (_X = state.callData) == null ? void 0 : _X.status) == null ? void 0 : _Y.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
+                            onClick: (e) => {
+                              e.stopPropagation();
+                              handleMuteToggle();
+                            },
+                            sx: ((_Z = state.callData) == null ? void 0 : _Z.hold) === 1 ? __spreadValues({}, disabled) : ((__ = state.callData) == null ? void 0 : __.mute) === 1 && ((_aa = (_$ = state.callData) == null ? void 0 : _$.status) == null ? void 0 : _aa.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_ca = (_ba = state.callData) == null ? void 0 : _ba.status) == null ? void 0 : _ca.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
+                            disabled: ((_ea = (_da = state.callData) == null ? void 0 : _da.status) == null ? void 0 : _ea.toUpperCase()) !== "ONCALL" && ((_fa = state.callData) == null ? void 0 : _fa.mute) !== 1 || muteOrUnMuteLoading || ((_ga = state.callData) == null ? void 0 : _ga.hold) === 1,
+                            children: muteOrUnMuteLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              import_material4.CircularProgress,
+                              {
+                                size: "20px",
+                                sx: {
+                                  color: theme.palette.primary.main
+                                }
+                              }
+                            ) : ((_ha = state.callData) == null ? void 0 : _ha.mute) === 1 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.MicOff, {}) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Mic, {})
+                          }
+                        ) }),
+                        !((_ia = state.sdkConfig) == null ? void 0 : _ia.disableCallTransferButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Transfer Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Button,
+                          {
+                            variant: state.openCallTransferDialog ? "contained" : "outlined",
+                            onClick: (e) => {
+                              var _a3, _b2;
+                              if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL") {
+                                e.stopPropagation();
+                                sdkStateManager.setOpenCallTransferDialog(true);
+                              }
+                            },
+                            sx: state.openCallTransferDialog ? __spreadValues({}, enabled) : ((_ka = (_ja = state.callData) == null ? void 0 : _ja.status) == null ? void 0 : _ka.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
+                            disabled: ((_ma = (_la = state.callData) == null ? void 0 : _la.status) == null ? void 0 : _ma.toUpperCase()) !== "ONCALL",
+                            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.TransferWithinAStation, {})
+                          }
+                        ) }),
+                        !((_na = state.sdkConfig) == null ? void 0 : _na.disableConferenceButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Conference Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Button,
+                          {
+                            variant: state.openConferenceDialog ? "contained" : "outlined",
+                            onClick: (e) => {
+                              var _a3, _b2;
+                              if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL") {
+                                e.stopPropagation();
+                                sdkStateManager.setOpenConferenceDialog(true);
+                              }
+                            },
+                            sx: state.openConferenceDialog ? __spreadValues({}, enabled) : ((_pa = (_oa = state.callData) == null ? void 0 : _oa.status) == null ? void 0 : _pa.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
+                            disabled: ((_ra = (_qa = state.callData) == null ? void 0 : _qa.status) == null ? void 0 : _ra.toUpperCase()) !== "ONCALL",
+                            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Group, {})
+                          }
+                        ) }),
+                        !((_sa = state.sdkConfig) == null ? void 0 : _sa.disableEndCallButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "End Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          import_material4.Button,
+                          {
+                            variant: ((_ua = (_ta = state.callData) == null ? void 0 : _ta.status) == null ? void 0 : _ua.toUpperCase()) === "ONCALL" || ((_wa = (_va = state.callData) == null ? void 0 : _va.status) == null ? void 0 : _wa.toUpperCase()) === "RINGING" || ((_ya = (_xa = state.callData) == null ? void 0 : _xa.status) == null ? void 0 : _ya.toUpperCase()) === "WRAPUP" ? "contained" : "outlined",
+                            onClick: (e) => {
+                              var _a3, _b2, _c2, _d2, _e2, _f2;
+                              if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL" || ((_d2 = (_c2 = state.callData) == null ? void 0 : _c2.status) == null ? void 0 : _d2.toUpperCase()) === "RINGING" || ((_f2 = (_e2 = state.callData) == null ? void 0 : _e2.status) == null ? void 0 : _f2.toUpperCase()) === "WRAPUP") {
+                                e.stopPropagation();
+                                setOpenCallDisposition(true);
+                              }
+                            },
+                            sx: ((_Aa = (_za = state.callData) == null ? void 0 : _za.status) == null ? void 0 : _Aa.toUpperCase()) === "ONCALL" || ((_Ca = (_Ba = state.callData) == null ? void 0 : _Ba.status) == null ? void 0 : _Ca.toUpperCase()) === "RINGING" || ((_Ea = (_Da = state.callData) == null ? void 0 : _Da.status) == null ? void 0 : _Ea.toUpperCase()) === "WRAPUP" ? __spreadProps(__spreadValues({}, enabled), {
+                              borderRight: "1px",
+                              backgroundColor: "error.main",
+                              minWidth: "60px !important",
+                              boxShadow: " 0px 2px 1px #5f3f3f",
+                              border: `1px solid ${theme.palette.error.light}`,
+                              height: "40px",
+                              "&:hover": {
+                                bgcolor: "error.light",
+                                boxShadow: " 0px 2px 1px #5f3f3f",
+                                border: `0px solid ${theme.palette.error.light}`
+                              },
+                              "&:active": {
+                                bgcolor: "error.light",
+                                boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
+                              }
+                            }) : __spreadProps(__spreadValues({}, disabled), {
+                              minWidth: "60px !important"
+                            }),
+                            disabled: ((_Ga = (_Fa = state.callData) == null ? void 0 : _Fa.status) == null ? void 0 : _Ga.toUpperCase()) !== "ONCALL" && ((_Ia = (_Ha = state.callData) == null ? void 0 : _Ha.status) == null ? void 0 : _Ia.toUpperCase()) !== "RINGING" && ((_Ka = (_Ja = state.callData) == null ? void 0 : _Ja.status) == null ? void 0 : _Ka.toUpperCase()) !== "WRAPUP" || endCallLoading,
+                            children: endCallLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              import_material4.CircularProgress,
+                              {
+                                size: "20px",
+                                color: "error"
+                              }
+                            ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.CallEnd, {})
+                          }
+                        ) })
+                      ]
+                    }
+                  )
+                ]
+              }
+            )
+          }
+        )
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_material4.Fade,
+      {
+        in: true,
+        timeout: 300,
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          import_material4.Paper,
+          {
+            ref: iframeDragRef,
+            elevation: iframeIsDragging ? 4 : 1,
+            sx: {
+              position: "absolute",
+              left: iframePosition.x,
+              top: iframePosition.y,
+              borderRadius: 2,
+              bgcolor: "background.paper",
+              zIndex: Number.MAX_SAFE_INTEGER,
+              transition: theme.transitions.create(["box-shadow", "transform"], {
+                duration: theme.transitions.duration.short
+              }),
+              visibility: showIframe && !((_La = state.sdkConfig) == null ? void 0 : _La.disableSoftPhone) ? "visible" : "hidden",
+              userSelect: "none"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                import_material4.Box,
+                {
+                  sx: {
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "space-between",
+                    cursor: "all-scroll",
+                    padding: "0px 10px"
+                  },
+                  onMouseDown: iframeHandleMouseDown,
+                  onTouchStart: iframeHandleTouchStart,
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                      import_icons_material2.DragIndicator,
+                      {
+                        sx: {
+                          transform: "rotate(90deg)",
+                          color: "#7b7b7b"
+                        }
+                      }
+                    ),
+                    " ",
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.IconButton, { onClick: () => setShowIframe(false), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Close, {}) })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                "iframe",
+                {
+                  src: `https://${IP}/ConVoxCCS/iframe?agent_id=${state.agentId}&process_id=${(_Ma = state.process) == null ? void 0 : _Ma.process_id}`,
+                  height: 380,
+                  width: 420,
+                  allow: "camera; microphone; autoplay",
+                  style: {
+                    border: "none"
+                  }
+                }
+              ) })
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_material4.Menu,
+      {
+        anchorEl: dialerAnchorEl,
+        open: Boolean(dialerAnchorEl),
+        onClose: handleCloseDialer,
+        onClick: (e) => e.stopPropagation(),
+        sx: {
+          zIndex: 99999
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          import_material4.Box,
+          {
+            sx: {
+              all: "unset",
+              padding: "10px",
+              "&hover": {
+                backgroundColor: "white"
+              }
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                import_material4.TextField,
+                {
+                  size: "small",
+                  value: phoneNumber,
+                  placeholder: "Enter Mobile No.",
+                  onChange: (e) => {
+                    setPhoneNumber(e.target.value);
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                import_material4.IconButton,
+                {
+                  color: "info",
+                  onClick: () => {
+                    handleStartCall(phoneNumber);
+                  },
+                  children: clickToCallLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                    import_material4.CircularProgress,
+                    {
+                      size: "20px",
+                      sx: {
+                        color: theme.palette.success.main
+                      }
+                    }
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Phone, { color: "success" })
+                }
+              )
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_material4.Menu,
+      {
+        anchorEl: statusAnchorEl,
+        open: Boolean(statusAnchorEl),
+        onClose: handleCloseAgentStatus,
+        onClick: (e) => e.stopPropagation(),
+        sx: {
+          zIndex: 99999
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.MenuItem, { onClick: () => handleUpdateAgentStatus("Lunch"), children: "- Break" })
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_material4.Menu,
+      {
+        anchorEl,
+        open: Boolean(anchorEl),
+        onClose: handleCloseQueueCounts,
+        onClick: (e) => e.stopPropagation(),
+        sx: {
+          zIndex: 99999
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          import_material4.Box,
+          {
+            sx: {
+              display: "flex",
+              justifyContent: "flex-start",
+              flexDirection: "column",
+              padding: "0px 10px",
+              "&hover": {
+                backgroundColor: "white"
+              }
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                import_material4.Chip,
+                {
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Layers, { color: "secondary" }),
+                  variant: "outlined",
+                  label: "Waiting - 25",
+                  sx: {
+                    margin: "4px 2px"
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                import_material4.Chip,
+                {
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Pending, { color: "info" }),
+                  label: "Pending - 99+",
+                  variant: "outlined",
+                  sx: {
+                    margin: "4px 2px"
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                import_material4.Chip,
+                {
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Upcoming, { color: "success" }),
+                  variant: "outlined",
+                  label: "Upcoming - 66",
+                  sx: {
+                    margin: "4px 2px"
+                  }
+                }
+              )
+            ]
+          }
+        )
+      }
+    ),
+    Boolean(state.openConferenceDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ConferenceDialog, {}),
+    Boolean(state.openCallTransferDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CallTransferDialog, { open: state.openCallTransferDialog }),
+    Boolean(openCallDisposition) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      EndCallDispositionDialog,
+      {
+        open: openCallDisposition,
+        setOpen: setOpenCallDisposition,
+        onSubmitDisposition: handleEndCall
+      }
+    ),
+    Boolean(openCallHistoryDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      CallHistoryDialog,
+      {
+        open: openCallHistoryDialog,
+        setOpen: setOpenCallHistoryDialog
+      }
+    )
+  ] });
+}
+
+// call-control-sdk/lib/components/SDKProvider.tsx
+var import_react12 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SDKProvider = (0, import_react12.memo)(({ children }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ToastProvider, { children });
+});
+SDKProvider.displayName = "SDKProvider";
+
+// call-control-sdk/lib/components/callControlPanel.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var CallControlPanel = (0, import_react13.memo)(({ onDataChange }) => {
+  const handleDataChange = (0, import_react13.useCallback)(
+    (data) => {
+      try {
+        if (onDataChange && typeof onDataChange === "function") {
+          onDataChange(data);
+        }
+      } catch (error) {
+        console.error("Error in CallControlPanel data change handler:", error);
+      }
+    },
+    [onDataChange]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SDKProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CallControls, { onDataChange: handleDataChange }) });
+});
+CallControlPanel.displayName = "CallControlPanel";
+
+// call-control-sdk/index.ts
+async function initSDK({
+  apiKey,
+  tenantId,
+  agentId,
+  sdkConfig
+}) {
+  if (!apiKey || typeof apiKey !== "string" || apiKey.trim().length === 0) {
+    throw new Error(
+      "SDK initialization failed: API key is required and must be a non-empty string"
+    );
+  }
+  if (!tenantId || typeof tenantId !== "string" || tenantId.trim().length === 0) {
+    throw new Error(
+      "SDK initialization failed: Tenant ID is required and must be a non-empty string"
+    );
+  }
+  if (!agentId || typeof agentId !== "string" || agentId.trim().length === 0) {
+    throw new Error(
+      "SDK initialization failed: Agent ID is required and must be a non-empty string"
+    );
+  }
+  try {
+    const initResult = await eventTracker.init({
+      apiKey: apiKey.trim(),
+      tenantId: tenantId.trim(),
+      agentId: agentId.trim(),
+      baseUrl: BASE_URL
+    });
+    if (initResult) {
+      console.log("SDK initialized successfully");
+      sdkStateManager.initialize(
+        apiKey.trim(),
+        tenantId.trim(),
+        agentId.trim(),
+        sdkConfig,
+        initResult
+      );
+    } else {
+      console.error("SDK initialization failed: Event tracker initialization returned false");
+      sdkStateManager.setInitCheck();
+      throw new Error(
+        "SDK initialization failed: Unable to establish connection with the CTI system"
+      );
+    }
+  } catch (error) {
+    console.error("SDK initialization error:", error);
+    sdkStateManager.setInitCheck();
+    if (error instanceof Error) {
+      throw error;
+    } else {
+      throw new Error(`SDK initialization failed: ${String(error)}`);
+    }
+  }
+}
+function getSDKVersion() {
+  return "6.x.x";
+}
+function isSDKInitialized() {
+  return sdkStateManager.getState().isInitialized;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CallControlPanel,
+  getSDKVersion,
+  initSDK,
+  isSDKInitialized,
+  useClickToCall,
+  useEndCall,
+  useGetAuthorizationToken,
+  useGetCallerData,
+  useLogout
+});
 //# sourceMappingURL=index.js.map