call-control-sdk 2.2.0 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/README.md +1 -1
  2. package/dist/index.js +980 -625
  3. package/dist/index.mjs +1055 -681
  4. package/package.json +2 -3
package/dist/index.mjs CHANGED
@@ -19,517 +19,154 @@ var __spreadValues = (a, b) => {
19
19
  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
20
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
21
21
 
22
- // src/lib/hooks/eventsTracker.ts
23
- var EventTrackerSDK = class {
22
+ // call-control-sdk/lib/components/callControlPanel.tsx
23
+ import { useEffect as useEffect2, useState as useState3, useCallback as useCallback2 } from "react";
24
+ import {
25
+ Paper as Paper2,
26
+ IconButton as IconButton2,
27
+ Typography as Typography2,
28
+ Menu,
29
+ MenuItem,
30
+ Box as Box2,
31
+ Tooltip,
32
+ Fade,
33
+ useTheme,
34
+ Button as Button2,
35
+ Chip,
36
+ TextField as TextField2
37
+ } from "@mui/material";
38
+ import {
39
+ PauseCircle as PauseCircle2,
40
+ PlayCircle,
41
+ Mic,
42
+ MicOff,
43
+ CallEnd as CallEnd2,
44
+ Cached,
45
+ FreeBreakfast,
46
+ AirlineSeatIndividualSuite,
47
+ TransferWithinAStation as TransferWithinAStation2,
48
+ Groups,
49
+ DragIndicator,
50
+ WifiCalling3,
51
+ Layers,
52
+ Phone,
53
+ Close as Close2,
54
+ Pending,
55
+ Upcoming
56
+ } from "@mui/icons-material";
57
+
58
+ // call-control-sdk/lib/hooks/useSDKState.ts
59
+ import { useState, useEffect } from "react";
60
+
61
+ // call-control-sdk/lib/hooks/sdk-state.ts
62
+ var SDKStateManager = class {
24
63
  constructor() {
25
- __publicField(this, "config", null);
26
- __publicField(this, "ticketId", null);
27
- __publicField(this, "baseUrl", "");
28
- __publicField(this, "eventQueue", []);
29
- __publicField(this, "isOnline", true);
30
- __publicField(this, "retryQueue", []);
31
- __publicField(this, "flushTimer", null);
32
- }
33
- /**
34
- * Initialize the EventTracker SDK
35
- * @param config Configuration object
36
- */
37
- async init(config) {
38
- this.config = __spreadValues({
39
- autoTrack: true,
40
- retryAttempts: 3,
41
- queueSize: 100,
42
- flushInterval: 5e3
43
- }, config);
44
- this.baseUrl = config.baseUrl || (typeof window !== "undefined" ? window.location.origin : "");
45
- this.setupNetworkDetection();
46
- const ticket = await this.createTicket();
47
- this.startPeriodicFlush();
48
- console.log("EventTracker SDK initialized successfully");
49
- return ticket;
50
- }
51
- /**
52
- * Check if the SDK is initialized
53
- */
54
- isInitialized() {
55
- return this.config !== null && this.ticketId !== null;
56
- }
57
- /**
58
- * Get the current configuration
59
- */
60
- getConfig() {
61
- return this.config;
62
- }
63
- /**
64
- * Get the current ticket ID
65
- */
66
- getTicketId() {
67
- return this.ticketId;
64
+ __publicField(this, "state");
65
+ __publicField(this, "listeners", []);
66
+ __publicField(this, "STORAGE_KEY", "call-control-sdk-state");
67
+ this.state = this.getInitialState();
68
+ this.loadFromStorage();
68
69
  }
69
- /**
70
- * Create a new ticket
71
- */
72
- async createTicket() {
73
- if (!this.config) {
74
- throw new Error("EventTracker not initialized");
75
- }
76
- try {
77
- const response = await this.makeRequest("/api/v1/et/init", {
78
- method: "POST",
79
- headers: {
80
- "Content-Type": "application/json",
81
- "X-API-Key": this.config.apiKey
82
- },
83
- body: JSON.stringify({
84
- agentId: this.config.agentId,
85
- sessionId: this.config.sessionId
86
- })
87
- });
88
- if (!response.ok) {
89
- throw new Error(
90
- `Failed to initialize: ${response.status} ${response.statusText}`
91
- );
92
- }
93
- const data = await response.json();
94
- this.ticketId = data.ticketId;
95
- if (this.config.autoTrack) {
96
- this.setupAutoTracking();
70
+ getInitialState() {
71
+ return {
72
+ apiKey: null,
73
+ isInitialized: false,
74
+ isHolding: false,
75
+ isMuted: false,
76
+ status: "idle",
77
+ callStartTime: null,
78
+ controlPanelPosition: { x: 0, y: 0 },
79
+ iframePosition: { x: 0, y: 0 },
80
+ callData: {
81
+ mobileNumber: "",
82
+ callReferenceId: "",
83
+ agentLoginId: ""
97
84
  }
98
- return this.ticketId;
99
- } catch (error) {
100
- console.error("EventTracker initialization failed:", error);
101
- throw error;
102
- }
103
- }
104
- /**
105
- * Log an event
106
- * @param eventType The type of event
107
- * @param eventData Optional event data
108
- */
109
- async logEvent(eventType, eventData) {
110
- if (!this.config || !this.ticketId) {
111
- console.warn("EventTracker not initialized, skipping event:", eventType);
112
- return;
113
- }
114
- const event = {
115
- eventType,
116
- eventData,
117
- timestamp: Date.now()
118
85
  };
119
- this.eventQueue.push(event);
120
- if (this.eventQueue.length > (this.config.queueSize || 100)) {
121
- this.eventQueue.shift();
122
- }
123
- if (this.isOnline) {
124
- try {
125
- await this.sendEvent(event);
126
- } catch (error) {
127
- console.warn("Failed to send event, will retry later:", error);
128
- }
129
- }
130
86
  }
131
- /**
132
- * Send an event to the server
133
- */
134
- async sendEvent(event) {
135
- if (!this.config || !this.ticketId) return;
87
+ loadFromStorage() {
136
88
  try {
137
- const response = await this.makeRequest("/api/v1/et/event", {
138
- method: "POST",
139
- headers: {
140
- "Content-Type": "application/json",
141
- "X-API-Key": this.config.apiKey
142
- },
143
- body: JSON.stringify({
144
- ticketId: this.ticketId,
145
- eventType: event.eventType,
146
- eventData: event.eventData
147
- })
148
- });
149
- if (!response.ok) {
150
- throw new Error(
151
- `Failed to log event: ${response.status} ${response.statusText}`
152
- );
153
- }
154
- const index = this.eventQueue.findIndex(
155
- (e) => e.timestamp === event.timestamp
156
- );
157
- if (index > -1) {
158
- this.eventQueue.splice(index, 1);
89
+ const stored = localStorage.getItem(this.STORAGE_KEY);
90
+ if (stored) {
91
+ const parsedState = JSON.parse(stored);
92
+ this.state = __spreadProps(__spreadValues({}, this.state), {
93
+ isHolding: parsedState.isHolding || false,
94
+ isMuted: parsedState.isMuted || false,
95
+ status: parsedState.status || "idle",
96
+ controlPanelPosition: parsedState.controlPanelPosition || {
97
+ x: 50,
98
+ y: 50
99
+ },
100
+ iframePosition: parsedState.iframePosition || { x: 50, y: 50 },
101
+ callStartTime: parsedState.callStartTime || null
102
+ });
159
103
  }
160
104
  } catch (error) {
161
- console.error("Event logging failed:", error);
162
- this.retryQueue.push(() => this.sendEvent(event));
105
+ console.warn("Failed to load SDK state from localStorage:", error);
163
106
  }
164
107
  }
165
- /**
166
- * Close the current ticket
167
- */
168
- async closeTicket() {
169
- if (!this.config || !this.ticketId) {
170
- throw new Error("EventTracker not initialized");
171
- }
172
- await this.flush();
108
+ saveToStorage() {
173
109
  try {
174
- const response = await this.makeRequest("/api/v1/et/close", {
175
- method: "POST",
176
- headers: {
177
- "Content-Type": "application/json",
178
- "X-API-Key": this.config.apiKey
179
- },
180
- body: JSON.stringify({
181
- ticketId: this.ticketId
182
- })
183
- });
184
- if (!response.ok) {
185
- throw new Error(
186
- `Failed to close ticket: ${response.status} ${response.statusText}`
187
- );
188
- }
189
- this.ticketId = null;
190
- this.stopPeriodicFlush();
191
- console.log("Ticket closed successfully");
110
+ const persistentState = {
111
+ isHolding: this.state.isHolding,
112
+ isMuted: this.state.isMuted,
113
+ status: this.state.status,
114
+ controlPanelPosition: this.state.controlPanelPosition,
115
+ iframePosition: this.state.iframePosition,
116
+ callStartTime: this.state.callStartTime
117
+ };
118
+ localStorage.setItem(this.STORAGE_KEY, JSON.stringify(persistentState));
192
119
  } catch (error) {
193
- console.error("Ticket close failed:", error);
194
- throw error;
120
+ console.warn("Failed to save SDK state to localStorage:", error);
195
121
  }
196
122
  }
197
- /**
198
- * Flush all pending events
199
- */
200
- async flush() {
201
- if (!this.isOnline || this.eventQueue.length === 0) return;
202
- const eventsToFlush = [...this.eventQueue];
203
- for (const event of eventsToFlush) {
204
- await this.sendEvent(event);
205
- }
206
- const retryItems = [...this.retryQueue];
207
- this.retryQueue = [];
208
- for (const retryFn of retryItems) {
209
- try {
210
- await retryFn();
211
- } catch (error) {
212
- console.error("Retry failed:", error);
213
- }
123
+ notifyListeners() {
124
+ this.listeners.forEach((listener) => listener());
125
+ }
126
+ initialize(apiKey) {
127
+ if (!apiKey || typeof apiKey !== "string" || apiKey.trim().length === 0) {
128
+ throw new Error("API key not available");
214
129
  }
130
+ this.state.apiKey = apiKey;
131
+ this.state.isInitialized = true;
132
+ this.notifyListeners();
215
133
  }
216
- /**
217
- * Make an HTTP request with retry logic
218
- */
219
- async makeRequest(url, options) {
220
- var _a;
221
- const fullUrl = `${this.baseUrl}${url}`;
222
- const maxRetries = ((_a = this.config) == null ? void 0 : _a.retryAttempts) || 3;
223
- for (let attempt = 1; attempt <= maxRetries; attempt++) {
224
- try {
225
- const response = await fetch(fullUrl, options);
226
- return response;
227
- } catch (error) {
228
- if (attempt === maxRetries) {
229
- throw error;
230
- }
231
- const delay = Math.min(1e3 * Math.pow(2, attempt - 1), 1e4);
232
- await new Promise((resolve) => setTimeout(resolve, delay));
233
- }
234
- }
235
- throw new Error("Max retries exceeded");
134
+ getState() {
135
+ return __spreadValues({}, this.state);
236
136
  }
237
- /**
238
- * Set up automatic event tracking
239
- */
240
- setupAutoTracking() {
241
- var _a;
242
- if (typeof window === "undefined" || !((_a = this.config) == null ? void 0 : _a.autoTrack)) return;
243
- const autoTrackConfig = this.config.autoTrack === true ? {} : this.config.autoTrack;
244
- if (autoTrackConfig.pageVisits !== false) {
245
- this.logEvent("pageVisit", {
246
- url: window.location.href,
247
- title: document.title,
248
- referrer: document.referrer,
249
- userAgent: navigator.userAgent,
250
- viewport: {
251
- width: window.innerWidth,
252
- height: window.innerHeight
253
- },
254
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
255
- }).catch((error) => console.warn("Failed to track page visit:", error));
256
- }
257
- if (autoTrackConfig.clicks !== false) {
258
- document.addEventListener("click", (event) => {
259
- var _a2;
260
- const target = event.target;
261
- if (target.tagName === "BUTTON" || target.tagName === "A" || target.onclick || target.getAttribute("role") === "button" || target instanceof HTMLButtonElement && target.type === "button") {
262
- this.logEvent("click", {
263
- element: target.tagName,
264
- text: (_a2 = target.textContent) == null ? void 0 : _a2.trim().substring(0, 100),
265
- // Limit text length
266
- href: target.getAttribute("href"),
267
- id: target.id,
268
- className: target.className,
269
- role: target.getAttribute("role"),
270
- position: {
271
- x: event.clientX,
272
- y: event.clientY
273
- },
274
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
275
- }).catch((error) => console.warn("Failed to track click:", error));
276
- }
277
- });
278
- }
279
- if (autoTrackConfig.forms !== false) {
280
- document.addEventListener("submit", (event) => {
281
- const target = event.target;
282
- const formData = new FormData(target);
283
- const formFields = {};
284
- formData.forEach((value, key) => {
285
- formFields[key] = value.toString();
286
- });
287
- this.logEvent("formSubmission", {
288
- formId: target.id,
289
- action: target.action,
290
- method: target.method,
291
- fields: Object.keys(formFields),
292
- fieldCount: Object.keys(formFields).length,
293
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
294
- }).catch(
295
- (error) => console.warn("Failed to track form submission:", error)
296
- );
297
- });
298
- }
299
- if (autoTrackConfig.inputs !== false) {
300
- let inputTimer;
301
- document.addEventListener("input", (event) => {
302
- const target = event.target;
303
- if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT") {
304
- clearTimeout(inputTimer);
305
- inputTimer = setTimeout(() => {
306
- var _a2;
307
- this.logEvent("fieldChange", {
308
- element: target.tagName,
309
- type: target.getAttribute("type"),
310
- name: target.getAttribute("name"),
311
- id: target.id,
312
- valueLength: ((_a2 = target.value) == null ? void 0 : _a2.length) || 0,
313
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
314
- }).catch(
315
- (error) => console.warn("Failed to track field change:", error)
316
- );
317
- }, 1e3);
318
- }
319
- });
320
- }
321
- const sessionStartTime = Date.now();
322
- window.addEventListener("beforeunload", () => {
323
- const sessionDuration = Date.now() - sessionStartTime;
324
- this.logEvent("pageUnload", {
325
- url: window.location.href,
326
- sessionDuration,
327
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
328
- });
329
- if (this.ticketId) {
330
- navigator.sendBeacon(
331
- `${this.baseUrl}/api/v1/et/close`,
332
- JSON.stringify({
333
- ticketId: this.ticketId
334
- })
335
- );
137
+ subscribe(listener) {
138
+ this.listeners.push(listener);
139
+ return () => {
140
+ const index = this.listeners.indexOf(listener);
141
+ if (index > -1) {
142
+ this.listeners.splice(index, 1);
336
143
  }
337
- });
338
- if (autoTrackConfig.visibility !== false) {
339
- document.addEventListener("visibilitychange", () => {
340
- this.logEvent("visibilityChange", {
341
- hidden: document.hidden,
342
- visibilityState: document.visibilityState,
343
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
344
- });
345
- });
346
- }
347
- if (autoTrackConfig.errors !== false) {
348
- window.addEventListener("error", (event) => {
349
- this.logEvent("jsError", {
350
- message: event.message,
351
- filename: event.filename,
352
- lineno: event.lineno,
353
- colno: event.colno,
354
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
355
- });
356
- });
357
- window.addEventListener("unhandledrejection", (event) => {
358
- var _a2;
359
- this.logEvent("unhandledRejection", {
360
- reason: (_a2 = event.reason) == null ? void 0 : _a2.toString(),
361
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
362
- });
363
- });
364
- }
365
- if (autoTrackConfig.performance !== false && typeof window.performance !== "undefined" && window.performance.navigation) {
366
- window.addEventListener("load", () => {
367
- setTimeout(() => {
368
- const navigation = window.performance.navigation;
369
- const timing = window.performance.timing;
370
- this.logEvent("performanceMetrics", {
371
- navigationTime: timing.navigationStart,
372
- loadTime: timing.loadEventEnd - timing.navigationStart,
373
- domReady: timing.domContentLoadedEventEnd - timing.navigationStart,
374
- renderTime: timing.loadEventEnd - timing.domContentLoadedEventEnd,
375
- navigationType: navigation.type,
376
- redirectCount: navigation.redirectCount,
377
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
378
- });
379
- }, 1e3);
380
- });
381
- }
144
+ };
382
145
  }
383
- /**
384
- * Set up network detection
385
- */
386
- setupNetworkDetection() {
387
- if (typeof window === "undefined") return;
388
- this.isOnline = navigator.onLine;
389
- window.addEventListener("online", () => {
390
- this.isOnline = true;
391
- console.log("EventTracker: Back online, flushing queued events");
392
- this.flush();
393
- });
394
- window.addEventListener("offline", () => {
395
- this.isOnline = false;
396
- console.log("EventTracker: Offline, queueing events");
397
- });
146
+ setHolding(isHolding) {
147
+ this.state.isHolding = isHolding;
148
+ this.saveToStorage();
149
+ this.notifyListeners();
398
150
  }
399
- /**
400
- * Start periodic flush timer
401
- */
402
- startPeriodicFlush() {
403
- var _a;
404
- if (this.flushTimer) {
405
- clearInterval(this.flushTimer);
406
- }
407
- const interval = ((_a = this.config) == null ? void 0 : _a.flushInterval) || 5e3;
408
- this.flushTimer = setInterval(() => {
409
- this.flush();
410
- }, interval);
151
+ setMuted(isMuted) {
152
+ this.state.isMuted = isMuted;
153
+ this.saveToStorage();
154
+ this.notifyListeners();
411
155
  }
412
- /**
413
- * Stop periodic flush timer
414
- */
415
- stopPeriodicFlush() {
416
- if (this.flushTimer) {
417
- clearInterval(this.flushTimer);
418
- this.flushTimer = null;
419
- }
156
+ setStatus(status) {
157
+ this.state.status = status;
158
+ this.saveToStorage();
159
+ this.notifyListeners();
420
160
  }
421
- };
422
- var eventTracker = new EventTrackerSDK();
423
- if (typeof window !== "undefined") {
424
- window.EventTracker = eventTracker;
425
- }
426
-
427
- // src/lib/hooks/sdk-state.ts
428
- var SDKStateManager = class {
429
- constructor() {
430
- __publicField(this, "state");
431
- __publicField(this, "listeners", []);
432
- __publicField(this, "STORAGE_KEY", "call-control-sdk-state");
433
- this.state = this.getInitialState();
434
- this.loadFromStorage();
161
+ setControlPanelPosition(position) {
162
+ this.state.controlPanelPosition = position;
163
+ this.saveToStorage();
164
+ this.notifyListeners();
435
165
  }
436
- getInitialState() {
437
- return {
438
- apiKey: null,
439
- isInitialized: false,
440
- isHolding: false,
441
- isMuted: false,
442
- status: "idle",
443
- callStartTime: null,
444
- controlPanelPosition: { x: 0, y: 0 },
445
- iframePosition: { x: 0, y: 0 },
446
- callData: {
447
- mobileNumber: "",
448
- callReferenceId: "",
449
- agentLoginId: ""
450
- }
451
- };
452
- }
453
- loadFromStorage() {
454
- try {
455
- const stored = localStorage.getItem(this.STORAGE_KEY);
456
- if (stored) {
457
- const parsedState = JSON.parse(stored);
458
- this.state = __spreadProps(__spreadValues({}, this.state), {
459
- isHolding: parsedState.isHolding || false,
460
- isMuted: parsedState.isMuted || false,
461
- status: parsedState.status || "idle",
462
- controlPanelPosition: parsedState.controlPanelPosition || { x: 50, y: 50 },
463
- iframePosition: parsedState.iframePosition || { x: 50, y: 50 },
464
- callStartTime: parsedState.callStartTime || null
465
- });
466
- }
467
- } catch (error) {
468
- console.warn("Failed to load SDK state from localStorage:", error);
469
- }
470
- }
471
- saveToStorage() {
472
- try {
473
- const persistentState = {
474
- isHolding: this.state.isHolding,
475
- isMuted: this.state.isMuted,
476
- status: this.state.status,
477
- controlPanelPosition: this.state.controlPanelPosition,
478
- iframePosition: this.state.iframePosition,
479
- callStartTime: this.state.callStartTime
480
- };
481
- localStorage.setItem(this.STORAGE_KEY, JSON.stringify(persistentState));
482
- } catch (error) {
483
- console.warn("Failed to save SDK state to localStorage:", error);
484
- }
485
- }
486
- notifyListeners() {
487
- this.listeners.forEach((listener) => listener());
488
- }
489
- initialize(apiKey) {
490
- if (!apiKey || typeof apiKey !== "string" || apiKey.trim().length === 0) {
491
- throw new Error("API key not available");
492
- }
493
- this.state.apiKey = apiKey;
494
- this.state.isInitialized = true;
495
- this.notifyListeners();
496
- }
497
- getState() {
498
- return __spreadValues({}, this.state);
499
- }
500
- subscribe(listener) {
501
- this.listeners.push(listener);
502
- return () => {
503
- const index = this.listeners.indexOf(listener);
504
- if (index > -1) {
505
- this.listeners.splice(index, 1);
506
- }
507
- };
508
- }
509
- setHolding(isHolding) {
510
- this.state.isHolding = isHolding;
511
- this.saveToStorage();
512
- this.notifyListeners();
513
- }
514
- setMuted(isMuted) {
515
- this.state.isMuted = isMuted;
516
- this.saveToStorage();
517
- this.notifyListeners();
518
- }
519
- setStatus(status) {
520
- this.state.status = status;
521
- this.saveToStorage();
522
- this.notifyListeners();
523
- }
524
- setControlPanelPosition(position) {
525
- this.state.controlPanelPosition = position;
526
- this.saveToStorage();
527
- this.notifyListeners();
528
- }
529
- setIframePosition(position) {
530
- this.state.iframePosition = position;
531
- this.saveToStorage();
532
- this.notifyListeners();
166
+ setIframePosition(position) {
167
+ this.state.iframePosition = position;
168
+ this.saveToStorage();
169
+ this.notifyListeners();
533
170
  }
534
171
  startCall() {
535
172
  this.state.callStartTime = Date.now();
@@ -552,45 +189,7 @@ var SDKStateManager = class {
552
189
  };
553
190
  var sdkStateManager = new SDKStateManager();
554
191
 
555
- // src/lib/components/CallControlPanel.tsx
556
- import { useEffect as useEffect2, useState as useState3, useCallback as useCallback2 } from "react";
557
- import {
558
- Paper,
559
- IconButton,
560
- Typography,
561
- Menu,
562
- MenuItem,
563
- Box,
564
- Tooltip,
565
- Fade,
566
- useTheme,
567
- Button,
568
- Badge,
569
- Chip,
570
- Avatar,
571
- TextField
572
- } from "@mui/material";
573
- import {
574
- PauseCircle,
575
- PlayCircle,
576
- Mic,
577
- MicOff,
578
- MoreVert,
579
- CallEnd,
580
- Cached,
581
- FreeBreakfast,
582
- AirlineSeatIndividualSuite,
583
- TransferWithinAStation,
584
- Groups,
585
- DragIndicator,
586
- WifiCalling3,
587
- Layers,
588
- Phone,
589
- Close
590
- } from "@mui/icons-material";
591
-
592
- // src/lib/hooks/useSDKState.ts
593
- import { useState, useEffect } from "react";
192
+ // call-control-sdk/lib/hooks/useSDKState.ts
594
193
  function useSDKState() {
595
194
  const [state, setState] = useState(sdkStateManager.getState());
596
195
  useEffect(() => {
@@ -602,7 +201,7 @@ function useSDKState() {
602
201
  return state;
603
202
  }
604
203
 
605
- // src/lib/hooks/useDraggable.ts
204
+ // call-control-sdk/lib/hooks/useDraggable.ts
606
205
  import {
607
206
  useState as useState2,
608
207
  useRef,
@@ -696,13 +295,324 @@ function useDraggable(initialPosition, onPositionChange) {
696
295
  };
697
296
  }
698
297
 
699
- // src/lib/components/CallControlPanel.tsx
298
+ // call-control-sdk/lib/components/dialog.tsx
299
+ import {
300
+ Call,
301
+ CallEnd,
302
+ CallSplit,
303
+ Close,
304
+ Group,
305
+ Logout,
306
+ PauseCircle,
307
+ PhoneDisabled,
308
+ TransferWithinAStation
309
+ } from "@mui/icons-material";
310
+ import {
311
+ Box,
312
+ Button,
313
+ Dialog,
314
+ IconButton,
315
+ Paper,
316
+ Radio,
317
+ Stack,
318
+ TextField,
319
+ Typography
320
+ } from "@mui/material";
700
321
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
322
+ function ReusableDialog({
323
+ agentName = "Agent_ravi",
324
+ lines = [],
325
+ onConference,
326
+ onExit,
327
+ onTransfer,
328
+ onEndAllCalls,
329
+ open,
330
+ setOpen
331
+ }) {
332
+ const handleClose = () => {
333
+ setOpen(false);
334
+ };
335
+ return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
336
+ Dialog,
337
+ {
338
+ open,
339
+ "aria-labelledby": "alert-dialog-title",
340
+ "aria-describedby": "alert-dialog-description",
341
+ fullWidth: true,
342
+ maxWidth: "md",
343
+ children: /* @__PURE__ */ jsxs(Paper, { sx: { borderRadius: 2 }, children: [
344
+ /* @__PURE__ */ jsxs(
345
+ Box,
346
+ {
347
+ sx: {
348
+ display: "flex",
349
+ justifyContent: "space-between",
350
+ alignItems: "center",
351
+ padding: "4px 16px"
352
+ // boxShadow:"0px 1px 2px #ccc"
353
+ },
354
+ children: [
355
+ /* @__PURE__ */ jsxs(Typography, { variant: "body1", children: [
356
+ agentName,
357
+ " Conference"
358
+ ] }),
359
+ /* @__PURE__ */ jsx(IconButton, { onClick: handleClose, children: /* @__PURE__ */ jsx(Close, {}) })
360
+ ]
361
+ }
362
+ ),
363
+ /* @__PURE__ */ jsx(
364
+ Stack,
365
+ {
366
+ direction: "row",
367
+ alignItems: "center",
368
+ justifyContent: "flex-end",
369
+ mr: 2,
370
+ children: /* @__PURE__ */ jsxs(
371
+ Stack,
372
+ {
373
+ display: "flex",
374
+ direction: "row",
375
+ alignItems: "center",
376
+ justifyContent: "center",
377
+ spacing: 1,
378
+ children: [
379
+ /* @__PURE__ */ jsxs(
380
+ Button,
381
+ {
382
+ variant: "contained",
383
+ color: "success",
384
+ onClick: onConference,
385
+ sx: {
386
+ borderRadius: "10px",
387
+ textTransform: "capitalize"
388
+ },
389
+ children: [
390
+ /* @__PURE__ */ jsx(Group, { sx: { px: 0.5 } }),
391
+ "Conference"
392
+ ]
393
+ }
394
+ ),
395
+ /* @__PURE__ */ jsxs(
396
+ Button,
397
+ {
398
+ variant: "contained",
399
+ color: "error",
400
+ onClick: onExit,
401
+ sx: {
402
+ borderRadius: "10px",
403
+ textTransform: "capitalize"
404
+ },
405
+ children: [
406
+ /* @__PURE__ */ jsx(Logout, { sx: { px: 0.5 } }),
407
+ "Exit Conference"
408
+ ]
409
+ }
410
+ ),
411
+ /* @__PURE__ */ jsxs(
412
+ Button,
413
+ {
414
+ variant: "contained",
415
+ color: "inherit",
416
+ onClick: onTransfer,
417
+ sx: {
418
+ borderRadius: "10px",
419
+ textTransform: "capitalize"
420
+ },
421
+ children: [
422
+ /* @__PURE__ */ jsx(TransferWithinAStation, { sx: { px: 0.5 } }),
423
+ "Transfer"
424
+ ]
425
+ }
426
+ )
427
+ ]
428
+ }
429
+ )
430
+ }
431
+ ),
432
+ /* @__PURE__ */ jsx(
433
+ Box,
434
+ {
435
+ sx: {
436
+ boxShadow: "0px 1px 2px #e7e5e5ff",
437
+ padding: "6px",
438
+ margin: "0px 10px",
439
+ borderRadius: "20px"
440
+ },
441
+ children: lines.map((line, index) => /* @__PURE__ */ jsxs(
442
+ Box,
443
+ {
444
+ sx: {
445
+ p: 1,
446
+ display: "flex",
447
+ alignItems: "center",
448
+ justifyContent: "space-between",
449
+ // borderBottom:"1px solid #ecebebff",
450
+ gap: 1
451
+ // bgcolor: "#fafafa",
452
+ },
453
+ children: [
454
+ /* @__PURE__ */ jsx(
455
+ Box,
456
+ {
457
+ sx: {
458
+ // px: 1,
459
+ // py: 0.5,
460
+ color: "white",
461
+ bgcolor: "warning.main",
462
+ fontWeight: "bold",
463
+ fontSize: 14,
464
+ minWidth: 70,
465
+ textAlign: "center",
466
+ border: "2px solid primary.main",
467
+ borderRadius: "10px 50px 50px 10px"
468
+ },
469
+ children: /* @__PURE__ */ jsxs(Typography, { children: [
470
+ "Line ",
471
+ index + 1
472
+ ] })
473
+ }
474
+ ),
475
+ /* @__PURE__ */ jsx(
476
+ Typography,
477
+ {
478
+ variant: "body2",
479
+ sx: {
480
+ px: 1,
481
+ // borderRadius: 1,
482
+ border: "2px solid gray",
483
+ borderRadius: "10px",
484
+ // color: "#fff",
485
+ textAlign: "center",
486
+ width: "80px",
487
+ maxWidth: "100px"
488
+ },
489
+ children: line.status
490
+ }
491
+ ),
492
+ /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
493
+ /* @__PURE__ */ jsx(Radio, { checked: line.type === "Internal" }),
494
+ /* @__PURE__ */ jsx(Typography, { variant: "body2", children: "Internal" })
495
+ ] }),
496
+ /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
497
+ /* @__PURE__ */ jsx(Radio, { checked: line.type === "External" }),
498
+ /* @__PURE__ */ jsx(Typography, { variant: "body2", children: "External" })
499
+ ] }),
500
+ /* @__PURE__ */ jsx(
501
+ TextField,
502
+ {
503
+ size: "small",
504
+ placeholder: "Phone Number",
505
+ value: line.phone || ""
506
+ }
507
+ ),
508
+ /* @__PURE__ */ jsx(
509
+ IconButton,
510
+ {
511
+ color: "success",
512
+ sx: {
513
+ bgcolor: "action.hover",
514
+ "&:hover": { bgcolor: "action.selected" }
515
+ },
516
+ children: /* @__PURE__ */ jsx(Call, {})
517
+ }
518
+ ),
519
+ /* @__PURE__ */ jsx(
520
+ IconButton,
521
+ {
522
+ color: "info",
523
+ sx: {
524
+ bgcolor: "action.hover",
525
+ "&:hover": { bgcolor: "action.selected" }
526
+ },
527
+ children: /* @__PURE__ */ jsx(CallSplit, {})
528
+ }
529
+ ),
530
+ /* @__PURE__ */ jsx(
531
+ IconButton,
532
+ {
533
+ color: "warning",
534
+ sx: {
535
+ bgcolor: "action.hover",
536
+ "&:hover": { bgcolor: "action.selected" }
537
+ },
538
+ children: /* @__PURE__ */ jsx(PauseCircle, {})
539
+ }
540
+ ),
541
+ /* @__PURE__ */ jsx(
542
+ IconButton,
543
+ {
544
+ color: "error",
545
+ sx: {
546
+ bgcolor: "action.hover",
547
+ "&:hover": { bgcolor: "action.selected" }
548
+ },
549
+ children: /* @__PURE__ */ jsx(CallEnd, {})
550
+ }
551
+ )
552
+ ]
553
+ },
554
+ index
555
+ ))
556
+ }
557
+ ),
558
+ /* @__PURE__ */ jsx(Box, { textAlign: "center", m: 2, children: /* @__PURE__ */ jsxs(
559
+ Button,
560
+ {
561
+ variant: "outlined",
562
+ color: "error",
563
+ size: "large",
564
+ onClick: onEndAllCalls,
565
+ sx: { px: 2, borderRadius: "20px", textTransform: "capitalize" },
566
+ children: [
567
+ /* @__PURE__ */ jsx(
568
+ IconButton,
569
+ {
570
+ sx: {
571
+ bgcolor: "error.main",
572
+ "&:hover": { bgcolor: "error.dark" },
573
+ marginRight: "8px",
574
+ width: "28px",
575
+ height: "28px",
576
+ fontSize: "12px",
577
+ fontWeight: "600",
578
+ lineHeight: "16px",
579
+ letterSpacing: "0.02em",
580
+ textTransform: "capitalize",
581
+ color: "white",
582
+ display: "flex",
583
+ alignItems: "center",
584
+ justifyContent: "center",
585
+ borderRadius: "50%"
586
+ },
587
+ children: /* @__PURE__ */ jsx(
588
+ PhoneDisabled,
589
+ {
590
+ sx: {
591
+ color: "white",
592
+ fontSize: "16px",
593
+ fontWeight: "600"
594
+ }
595
+ }
596
+ )
597
+ }
598
+ ),
599
+ "End Calls"
600
+ ]
601
+ }
602
+ ) })
603
+ ] })
604
+ }
605
+ ) });
606
+ }
607
+
608
+ // call-control-sdk/lib/components/callControlPanel.tsx
609
+ import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
701
610
  function CallControlPanel({ onDataChange }) {
702
611
  const theme = useTheme();
703
612
  const state = useSDKState();
704
613
  const [anchorEl, setAnchorEl] = useState3(null);
705
614
  const [phoneNumber, setPhoneNumber] = useState3("");
615
+ const [open, setOpen] = useState3(false);
706
616
  const [dialerAnchorEl, setDialerAnchorEl] = useState3(
707
617
  null
708
618
  );
@@ -712,7 +622,13 @@ function CallControlPanel({ onDataChange }) {
712
622
  state.controlPanelPosition,
713
623
  (newPosition) => sdkStateManager.setControlPanelPosition(newPosition)
714
624
  );
715
- const { position: xposition, isDragging: xisDragging, dragRef: xdragRef, handleMouseDown: xhandleMouseDown, handleTouchStart: xhandleTouchStart } = useDraggable(
625
+ const {
626
+ position: iframePosition,
627
+ isDragging: iframeIsDragging,
628
+ dragRef: iframeDragRef,
629
+ handleMouseDown: iframeHandleMouseDown,
630
+ handleTouchStart: iframeHandleTouchStart
631
+ } = useDraggable(
716
632
  state.iframePosition,
717
633
  (newPosition) => sdkStateManager.setIframePosition(newPosition)
718
634
  );
@@ -775,9 +691,6 @@ function CallControlPanel({ onDataChange }) {
775
691
  const handleMoreClick = (event) => {
776
692
  setAnchorEl(event.currentTarget);
777
693
  };
778
- const handleMoreOptions = (event) => {
779
- setMoreOptionsAnchorEl(event.currentTarget);
780
- };
781
694
  const handleMoreClose = () => {
782
695
  setAnchorEl(null);
783
696
  };
@@ -793,12 +706,12 @@ function CallControlPanel({ onDataChange }) {
793
706
  if (!state.isInitialized) {
794
707
  return null;
795
708
  }
796
- return /* @__PURE__ */ jsxs(Fragment, { children: [
797
- /* @__PURE__ */ jsx(Fade, { in: true, timeout: 300, children: /* @__PURE__ */ jsx(
798
- Paper,
709
+ return /* @__PURE__ */ jsxs2(Fragment2, { children: [
710
+ /* @__PURE__ */ jsx2(Fade, { in: true, timeout: 300, children: /* @__PURE__ */ jsx2(
711
+ Paper2,
799
712
  {
800
713
  ref: dragRef,
801
- elevation: isDragging ? 2 : 1,
714
+ elevation: isDragging ? 4 : 1,
802
715
  sx: {
803
716
  position: "fixed",
804
717
  left: position.x,
@@ -806,25 +719,23 @@ function CallControlPanel({ onDataChange }) {
806
719
  p: 1,
807
720
  borderRadius: 3,
808
721
  bgcolor: "background.paper",
809
- cursor: isDragging ? "grabbing" : "grab",
722
+ // cursor: "all-scroll",
810
723
  transition: theme.transitions.create(["box-shadow", "transform"], {
811
724
  duration: theme.transitions.duration.short
812
725
  }),
813
726
  minWidth: 320,
814
727
  userSelect: "none"
815
728
  },
816
- onMouseDown: handleMouseDown,
817
- onTouchStart: handleTouchStart,
818
- children: /* @__PURE__ */ jsxs(
819
- Box,
729
+ children: /* @__PURE__ */ jsxs2(
730
+ Box2,
820
731
  {
821
732
  sx: {
822
733
  display: "flex",
823
734
  alignItems: "center"
824
735
  },
825
736
  children: [
826
- /* @__PURE__ */ jsxs(
827
- Box,
737
+ /* @__PURE__ */ jsxs2(
738
+ Box2,
828
739
  {
829
740
  sx: {
830
741
  display: "flex",
@@ -832,8 +743,8 @@ function CallControlPanel({ onDataChange }) {
832
743
  alignItems: "center"
833
744
  },
834
745
  children: [
835
- /* @__PURE__ */ jsxs(
836
- Typography,
746
+ /* @__PURE__ */ jsxs2(
747
+ Typography2,
837
748
  {
838
749
  variant: "h6",
839
750
  sx: {
@@ -844,21 +755,34 @@ function CallControlPanel({ onDataChange }) {
844
755
  alignItems: "center"
845
756
  },
846
757
  children: [
847
- /* @__PURE__ */ jsx(DragIndicator, {}),
848
- " ",
849
- /* @__PURE__ */ jsx(
850
- Box,
758
+ /* @__PURE__ */ jsxs2(
759
+ IconButton2,
760
+ {
761
+ component: "div",
762
+ sx: {
763
+ cursor: "all-scroll"
764
+ },
765
+ onMouseDown: handleMouseDown,
766
+ onTouchStart: handleTouchStart,
767
+ children: [
768
+ /* @__PURE__ */ jsx2(DragIndicator, {}),
769
+ " "
770
+ ]
771
+ }
772
+ ),
773
+ /* @__PURE__ */ jsx2(
774
+ Box2,
851
775
  {
852
776
  sx: {
853
777
  marginRight: "10px"
854
778
  },
855
- children: /* @__PURE__ */ jsx(Tooltip, { title: "Dial", children: /* @__PURE__ */ jsx(
856
- IconButton,
779
+ children: /* @__PURE__ */ jsx2(Tooltip, { title: "Dial", children: /* @__PURE__ */ jsx2(
780
+ IconButton2,
857
781
  {
858
782
  onClick: (e) => {
859
783
  handleOpenDialer(e);
860
784
  },
861
- children: /* @__PURE__ */ jsx(WifiCalling3, { color: "success" })
785
+ children: /* @__PURE__ */ jsx2(WifiCalling3, { color: "success" })
862
786
  }
863
787
  ) })
864
788
  }
@@ -867,8 +791,8 @@ function CallControlPanel({ onDataChange }) {
867
791
  ]
868
792
  }
869
793
  ),
870
- /* @__PURE__ */ jsx(Tooltip, { title: "Status", children: /* @__PURE__ */ jsx(
871
- Button,
794
+ /* @__PURE__ */ jsx2(Tooltip, { title: "Status", children: /* @__PURE__ */ jsx2(
795
+ Button2,
872
796
  {
873
797
  sx: {
874
798
  fontWeight: "bold",
@@ -880,8 +804,8 @@ function CallControlPanel({ onDataChange }) {
880
804
  },
881
805
  color: getStatusColor(state.status),
882
806
  variant: "outlined",
883
- children: /* @__PURE__ */ jsx(
884
- Typography,
807
+ children: /* @__PURE__ */ jsx2(
808
+ Typography2,
885
809
  {
886
810
  width: 50,
887
811
  variant: "body2",
@@ -897,8 +821,8 @@ function CallControlPanel({ onDataChange }) {
897
821
  ]
898
822
  }
899
823
  ),
900
- /* @__PURE__ */ jsxs(
901
- Box,
824
+ /* @__PURE__ */ jsxs2(
825
+ Box2,
902
826
  {
903
827
  sx: {
904
828
  display: "flex",
@@ -907,8 +831,8 @@ function CallControlPanel({ onDataChange }) {
907
831
  alignItems: "center"
908
832
  },
909
833
  children: [
910
- /* @__PURE__ */ jsx(Tooltip, { title: "Redial", children: /* @__PURE__ */ jsx(
911
- IconButton,
834
+ /* @__PURE__ */ jsx2(Tooltip, { title: "Redial", children: /* @__PURE__ */ jsx2(
835
+ IconButton2,
912
836
  {
913
837
  onClick: (e) => {
914
838
  e.stopPropagation();
@@ -920,11 +844,11 @@ function CallControlPanel({ onDataChange }) {
920
844
  bgcolor: "warning"
921
845
  }
922
846
  },
923
- children: /* @__PURE__ */ jsx(Cached, {})
847
+ children: /* @__PURE__ */ jsx2(Cached, {})
924
848
  }
925
849
  ) }),
926
- /* @__PURE__ */ jsx(Tooltip, { title: state.isHolding ? "Resume" : "Hold", children: /* @__PURE__ */ jsx(
927
- IconButton,
850
+ /* @__PURE__ */ jsx2(Tooltip, { title: state.isHolding ? "Resume" : "Hold", children: /* @__PURE__ */ jsx2(
851
+ IconButton2,
928
852
  {
929
853
  onClick: (e) => {
930
854
  e.stopPropagation();
@@ -934,11 +858,11 @@ function CallControlPanel({ onDataChange }) {
934
858
  sx: {
935
859
  bgcolor: state.isHolding ? "warning.info" : "action.hover"
936
860
  },
937
- children: state.isHolding ? /* @__PURE__ */ jsx(PlayCircle, {}) : /* @__PURE__ */ jsx(PauseCircle, {})
861
+ children: state.isHolding ? /* @__PURE__ */ jsx2(PlayCircle, {}) : /* @__PURE__ */ jsx2(PauseCircle2, {})
938
862
  }
939
863
  ) }),
940
- /* @__PURE__ */ jsx(Tooltip, { title: state.isMuted ? "Unmute" : "Mute", children: /* @__PURE__ */ jsx(
941
- IconButton,
864
+ /* @__PURE__ */ jsx2(Tooltip, { title: state.isMuted ? "Unmute" : "Mute", children: /* @__PURE__ */ jsx2(
865
+ IconButton2,
942
866
  {
943
867
  onClick: (e) => {
944
868
  e.stopPropagation();
@@ -948,11 +872,11 @@ function CallControlPanel({ onDataChange }) {
948
872
  sx: {
949
873
  bgcolor: state.isMuted ? "error.info" : "action.hover"
950
874
  },
951
- children: state.isMuted ? /* @__PURE__ */ jsx(MicOff, {}) : /* @__PURE__ */ jsx(Mic, {})
875
+ children: state.isMuted ? /* @__PURE__ */ jsx2(MicOff, {}) : /* @__PURE__ */ jsx2(Mic, {})
952
876
  }
953
877
  ) }),
954
- /* @__PURE__ */ jsx(Tooltip, { title: "Queue", children: /* @__PURE__ */ jsx(
955
- IconButton,
878
+ /* @__PURE__ */ jsx2(Tooltip, { title: "Queue", children: /* @__PURE__ */ jsx2(
879
+ IconButton2,
956
880
  {
957
881
  onClick: (e) => {
958
882
  e.stopPropagation();
@@ -965,25 +889,28 @@ function CallControlPanel({ onDataChange }) {
965
889
  bgcolor: "warning"
966
890
  }
967
891
  },
968
- children: /* @__PURE__ */ jsx(Layers, {})
892
+ children: /* @__PURE__ */ jsx2(Layers, {})
969
893
  }
970
894
  ) }),
971
- /* @__PURE__ */ jsx(Tooltip, { title: "More Options", children: /* @__PURE__ */ jsx(
972
- IconButton,
895
+ /* @__PURE__ */ jsx2(Tooltip, { title: "Conference Call", children: /* @__PURE__ */ jsx2(
896
+ IconButton2,
973
897
  {
974
898
  onClick: (e) => {
975
899
  e.stopPropagation();
976
- handleMoreOptions(e);
900
+ setOpen(true);
977
901
  },
902
+ color: "default",
978
903
  sx: {
979
904
  bgcolor: "action.hover",
980
- "&:hover": { bgcolor: "action.selected" }
905
+ "&:hover": {
906
+ bgcolor: "warning"
907
+ }
981
908
  },
982
- children: /* @__PURE__ */ jsx(MoreVert, {})
909
+ children: /* @__PURE__ */ jsx2(Groups, {})
983
910
  }
984
911
  ) }),
985
- /* @__PURE__ */ jsx(Tooltip, { title: state.callStartTime ? "End Call" : "Start Call", children: /* @__PURE__ */ jsx(
986
- IconButton,
912
+ /* @__PURE__ */ jsx2(Tooltip, { title: state.callStartTime ? "End Call" : "Start Call", children: /* @__PURE__ */ jsx2(
913
+ IconButton2,
987
914
  {
988
915
  onClick: (e) => {
989
916
  e.stopPropagation();
@@ -999,7 +926,7 @@ function CallControlPanel({ onDataChange }) {
999
926
  bgcolor: state.callStartTime ? "error.light" : "gray"
1000
927
  }
1001
928
  },
1002
- children: /* @__PURE__ */ jsx(CallEnd, {})
929
+ children: /* @__PURE__ */ jsx2(CallEnd2, {})
1003
930
  }
1004
931
  ) })
1005
932
  ]
@@ -1010,72 +937,94 @@ function CallControlPanel({ onDataChange }) {
1010
937
  )
1011
938
  }
1012
939
  ) }),
1013
- /* @__PURE__ */ jsx(Fade, { in: true, timeout: 300, children: /* @__PURE__ */ jsx(
1014
- Paper,
940
+ /* @__PURE__ */ jsx2(Fade, { in: true, timeout: 300, children: /* @__PURE__ */ jsx2(
941
+ Paper2,
1015
942
  {
1016
- ref: xdragRef,
1017
- elevation: xisDragging ? 2 : 1,
943
+ ref: iframeDragRef,
944
+ elevation: iframeIsDragging ? 4 : 1,
1018
945
  sx: {
1019
946
  position: "fixed",
1020
- left: xposition.x,
1021
- top: xposition.y,
947
+ left: iframePosition.x,
948
+ top: iframePosition.y,
1022
949
  p: 1,
1023
950
  height: "auto",
1024
- // borderRadius: 3,
951
+ borderRadius: 2,
1025
952
  bgcolor: "background.paper",
1026
- cursor: xisDragging ? "grabbing" : "grab",
953
+ // cursor: iframeIsDragging ? "grabbing" : "grab",
1027
954
  transition: theme.transitions.create(["box-shadow", "transform"], {
1028
955
  duration: theme.transitions.duration.short
1029
956
  }),
1030
957
  // minWidth: 320,
1031
958
  userSelect: "none"
1032
959
  },
1033
- onMouseDown: xhandleMouseDown,
1034
- onTouchStart: xhandleTouchStart,
1035
- children: /* @__PURE__ */ jsxs(Box, { sx: {
1036
- display: "flex",
1037
- alignItems: "center",
1038
- justifyContent: "center",
1039
- flexDirection: "column"
1040
- }, children: [
1041
- /* @__PURE__ */ jsxs(
1042
- Box,
1043
- {
1044
- sx: {
1045
- width: "100%",
1046
- height: "auto",
1047
- display: "flex",
1048
- alignItems: "center",
1049
- justifyContent: "space-between"
1050
- },
1051
- children: [
1052
- /* @__PURE__ */ jsx(DragIndicator, { sx: {
1053
- transform: "rotate(90deg)"
1054
- } }),
1055
- " ",
1056
- /* @__PURE__ */ jsx(IconButton, { children: /* @__PURE__ */ jsx(Close, {}) })
1057
- ]
1058
- }
1059
- ),
1060
- /* @__PURE__ */ jsx(
1061
- "iframe",
1062
- {
1063
- src: "https://h68.deepijatel.in/ConVoxCCS",
1064
- height: 300
1065
- }
1066
- )
1067
- ] })
960
+ children: /* @__PURE__ */ jsxs2(
961
+ Box2,
962
+ {
963
+ sx: {
964
+ display: "flex",
965
+ alignItems: "center",
966
+ justifyContent: "center",
967
+ flexDirection: "column"
968
+ },
969
+ children: [
970
+ /* @__PURE__ */ jsxs2(
971
+ Box2,
972
+ {
973
+ sx: {
974
+ width: "100%",
975
+ height: "auto",
976
+ display: "flex",
977
+ alignItems: "center",
978
+ justifyContent: "space-between"
979
+ },
980
+ children: [
981
+ /* @__PURE__ */ jsxs2(
982
+ IconButton2,
983
+ {
984
+ component: "div",
985
+ sx: {
986
+ cursor: "all-scroll"
987
+ },
988
+ onMouseDown: iframeHandleMouseDown,
989
+ onTouchStart: iframeHandleTouchStart,
990
+ children: [
991
+ /* @__PURE__ */ jsx2(
992
+ DragIndicator,
993
+ {
994
+ sx: {
995
+ transform: "rotate(90deg)"
996
+ }
997
+ }
998
+ ),
999
+ " "
1000
+ ]
1001
+ }
1002
+ ),
1003
+ /* @__PURE__ */ jsx2(IconButton2, { children: /* @__PURE__ */ jsx2(Close2, {}) })
1004
+ ]
1005
+ }
1006
+ ),
1007
+ /* @__PURE__ */ jsx2(
1008
+ "iframe",
1009
+ {
1010
+ src: "https://h68.deepijatel.in/ConVoxCCS/iframe?agent_id=test&process_id=101",
1011
+ height: 300
1012
+ }
1013
+ )
1014
+ ]
1015
+ }
1016
+ )
1068
1017
  }
1069
1018
  ) }),
1070
- /* @__PURE__ */ jsx(
1019
+ /* @__PURE__ */ jsx2(
1071
1020
  Menu,
1072
1021
  {
1073
1022
  anchorEl: dialerAnchorEl,
1074
1023
  open: Boolean(dialerAnchorEl),
1075
1024
  onClose: handleCloseDialer,
1076
1025
  onClick: (e) => e.stopPropagation(),
1077
- children: /* @__PURE__ */ jsxs(
1078
- Box,
1026
+ children: /* @__PURE__ */ jsxs2(
1027
+ Box2,
1079
1028
  {
1080
1029
  sx: {
1081
1030
  all: "unset",
@@ -1085,8 +1034,8 @@ function CallControlPanel({ onDataChange }) {
1085
1034
  }
1086
1035
  },
1087
1036
  children: [
1088
- /* @__PURE__ */ jsx(
1089
- TextField,
1037
+ /* @__PURE__ */ jsx2(
1038
+ TextField2,
1090
1039
  {
1091
1040
  size: "small",
1092
1041
  value: phoneNumber,
@@ -1096,14 +1045,14 @@ function CallControlPanel({ onDataChange }) {
1096
1045
  }
1097
1046
  }
1098
1047
  ),
1099
- /* @__PURE__ */ jsx(
1100
- IconButton,
1048
+ /* @__PURE__ */ jsx2(
1049
+ IconButton2,
1101
1050
  {
1102
1051
  color: "info",
1103
1052
  onClick: () => {
1104
1053
  handleStartCall(phoneNumber);
1105
1054
  },
1106
- children: /* @__PURE__ */ jsx(Phone, { color: "success" })
1055
+ children: /* @__PURE__ */ jsx2(Phone, { color: "success" })
1107
1056
  }
1108
1057
  )
1109
1058
  ]
@@ -1111,66 +1060,58 @@ function CallControlPanel({ onDataChange }) {
1111
1060
  )
1112
1061
  }
1113
1062
  ),
1114
- /* @__PURE__ */ jsx(
1063
+ /* @__PURE__ */ jsx2(
1115
1064
  Menu,
1116
1065
  {
1117
1066
  anchorEl,
1118
1067
  open: Boolean(anchorEl),
1119
1068
  onClose: handleMoreClose,
1120
1069
  onClick: (e) => e.stopPropagation(),
1121
- children: /* @__PURE__ */ jsxs(
1122
- Box,
1070
+ children: /* @__PURE__ */ jsxs2(
1071
+ Box2,
1123
1072
  {
1124
1073
  sx: {
1125
- all: "unset",
1074
+ // all: "unset",
1075
+ display: "flex",
1076
+ justifyContent: "flex-start",
1077
+ flexDirection: "column",
1126
1078
  padding: "0px 10px",
1127
1079
  "&hover": {
1128
1080
  backgroundColor: "white"
1129
1081
  }
1130
1082
  },
1131
1083
  children: [
1132
- /* @__PURE__ */ jsx(Badge, { badgeContent: 100, color: "secondary", children: /* @__PURE__ */ jsx(
1084
+ /* @__PURE__ */ jsx2(
1133
1085
  Chip,
1134
1086
  {
1135
- avatar: /* @__PURE__ */ jsx(Avatar, { children: "Q" }),
1087
+ icon: /* @__PURE__ */ jsx2(Layers, { color: "secondary" }),
1136
1088
  variant: "outlined",
1137
- label: "Waiting"
1089
+ label: "Waiting - 25",
1090
+ sx: {
1091
+ margin: "4px 2px"
1092
+ }
1138
1093
  }
1139
- ) }),
1140
- /* @__PURE__ */ jsx(
1141
- Badge,
1094
+ ),
1095
+ /* @__PURE__ */ jsx2(
1096
+ Chip,
1142
1097
  {
1143
- badgeContent: 100,
1144
- color: "warning",
1098
+ icon: /* @__PURE__ */ jsx2(Pending, { color: "info" }),
1099
+ label: "Pending - 99+",
1100
+ variant: "outlined",
1145
1101
  sx: {
1146
- margin: "10px"
1147
- },
1148
- children: /* @__PURE__ */ jsx(
1149
- Chip,
1150
- {
1151
- avatar: /* @__PURE__ */ jsx(Avatar, { children: "C" }),
1152
- label: "Pending",
1153
- variant: "outlined"
1154
- }
1155
- )
1102
+ margin: "4px 2px"
1103
+ }
1156
1104
  }
1157
1105
  ),
1158
- /* @__PURE__ */ jsx(
1159
- Badge,
1106
+ /* @__PURE__ */ jsx2(
1107
+ Chip,
1160
1108
  {
1161
- badgeContent: 100,
1162
- color: "info",
1109
+ icon: /* @__PURE__ */ jsx2(Upcoming, { color: "success" }),
1110
+ variant: "outlined",
1111
+ label: "Upcoming - 66",
1163
1112
  sx: {
1164
- margin: "10px"
1165
- },
1166
- children: /* @__PURE__ */ jsx(
1167
- Chip,
1168
- {
1169
- avatar: /* @__PURE__ */ jsx(Avatar, { children: "C" }),
1170
- variant: "outlined",
1171
- label: "Upcoming"
1172
- }
1173
- )
1113
+ margin: "4px 2px"
1114
+ }
1174
1115
  }
1175
1116
  )
1176
1117
  ]
@@ -1178,7 +1119,7 @@ function CallControlPanel({ onDataChange }) {
1178
1119
  )
1179
1120
  }
1180
1121
  ),
1181
- /* @__PURE__ */ jsxs(
1122
+ /* @__PURE__ */ jsxs2(
1182
1123
  Menu,
1183
1124
  {
1184
1125
  anchorEl: moreOptionsAnchorEl,
@@ -1186,29 +1127,462 @@ function CallControlPanel({ onDataChange }) {
1186
1127
  onClose: handleMoreOptionsClose,
1187
1128
  onClick: (e) => e.stopPropagation(),
1188
1129
  children: [
1189
- /* @__PURE__ */ jsx(MenuItem, { onClick: () => setMoreOptionsAnchorEl(null), children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1190
- /* @__PURE__ */ jsx(TransferWithinAStation, { color: "secondary" }),
1191
- /* @__PURE__ */ jsx(Typography, { children: "Call Transfer" })
1192
- ] }) }),
1193
- /* @__PURE__ */ jsx(MenuItem, { onClick: () => setMoreOptionsAnchorEl(null), children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1194
- /* @__PURE__ */ jsx(Groups, { color: "secondary" }),
1195
- /* @__PURE__ */ jsx(Typography, { children: "Conference Call" })
1130
+ /* @__PURE__ */ jsx2(MenuItem, { onClick: () => setMoreOptionsAnchorEl(null), children: /* @__PURE__ */ jsxs2(Box2, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1131
+ /* @__PURE__ */ jsx2(TransferWithinAStation2, { color: "secondary" }),
1132
+ /* @__PURE__ */ jsx2(Typography2, { children: "Call Transfer" })
1196
1133
  ] }) }),
1197
- /* @__PURE__ */ jsx(MenuItem, { onClick: () => handleStatusChange("break"), children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1198
- /* @__PURE__ */ jsx(FreeBreakfast, { color: "secondary" }),
1199
- /* @__PURE__ */ jsx(Typography, { children: "Break" })
1134
+ /* @__PURE__ */ jsx2(
1135
+ MenuItem,
1136
+ {
1137
+ onClick: () => {
1138
+ setOpen(true);
1139
+ setMoreOptionsAnchorEl(null);
1140
+ },
1141
+ children: /* @__PURE__ */ jsxs2(Box2, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1142
+ /* @__PURE__ */ jsx2(Groups, { color: "secondary" }),
1143
+ /* @__PURE__ */ jsx2(Typography2, { children: "Conference Call" })
1144
+ ] })
1145
+ }
1146
+ ),
1147
+ /* @__PURE__ */ jsx2(MenuItem, { onClick: () => handleStatusChange("break"), children: /* @__PURE__ */ jsxs2(Box2, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1148
+ /* @__PURE__ */ jsx2(FreeBreakfast, { color: "secondary" }),
1149
+ /* @__PURE__ */ jsx2(Typography2, { children: "Break" })
1200
1150
  ] }) }),
1201
- /* @__PURE__ */ jsx(MenuItem, { onClick: () => handleStatusChange("idle"), children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1202
- /* @__PURE__ */ jsx(AirlineSeatIndividualSuite, { color: "secondary" }),
1203
- /* @__PURE__ */ jsx(Typography, { children: "Idle" })
1151
+ /* @__PURE__ */ jsx2(MenuItem, { onClick: () => handleStatusChange("idle"), children: /* @__PURE__ */ jsxs2(Box2, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
1152
+ /* @__PURE__ */ jsx2(AirlineSeatIndividualSuite, { color: "secondary" }),
1153
+ /* @__PURE__ */ jsx2(Typography2, { children: "Idle" })
1204
1154
  ] }) })
1205
1155
  ]
1206
1156
  }
1157
+ ),
1158
+ /* @__PURE__ */ jsx2(
1159
+ ReusableDialog,
1160
+ {
1161
+ open,
1162
+ setOpen,
1163
+ agentName: "Agent_Ravi",
1164
+ lines: [
1165
+ { status: "ON CALL", type: "External", phone: "7032491730" },
1166
+ { status: "IDLE", type: "Internal", phone: "" },
1167
+ { status: "IDLE", type: "External", phone: "" },
1168
+ { status: "IDLE", type: "Internal", phone: "" },
1169
+ { status: "IDLE", type: "External", phone: "" }
1170
+ ],
1171
+ onConference: () => console.log("Conference"),
1172
+ onExit: () => console.log("Exit"),
1173
+ onTransfer: () => console.log("Transfer"),
1174
+ onEndAllCalls: () => console.log("End All Calls")
1175
+ }
1207
1176
  )
1208
1177
  ] });
1209
1178
  }
1210
1179
 
1211
- // src/index.ts
1180
+ // call-control-sdk/lib/hooks/eventsTracker.ts
1181
+ var EventTrackerSDK = class {
1182
+ constructor() {
1183
+ __publicField(this, "config", null);
1184
+ __publicField(this, "ticketId", null);
1185
+ __publicField(this, "baseUrl", "");
1186
+ __publicField(this, "eventQueue", []);
1187
+ __publicField(this, "isOnline", true);
1188
+ __publicField(this, "retryQueue", []);
1189
+ __publicField(this, "flushTimer", null);
1190
+ }
1191
+ /**
1192
+ * Initialize the EventTracker SDK
1193
+ * @param config Configuration object
1194
+ */
1195
+ async init(config) {
1196
+ this.config = __spreadValues({
1197
+ autoTrack: true,
1198
+ retryAttempts: 3,
1199
+ queueSize: 100,
1200
+ flushInterval: 5e3
1201
+ }, config);
1202
+ this.baseUrl = config.baseUrl || (typeof window !== "undefined" ? window.location.origin : "");
1203
+ this.setupNetworkDetection();
1204
+ const ticket = await this.createTicket();
1205
+ this.startPeriodicFlush();
1206
+ console.log("EventTracker SDK initialized successfully");
1207
+ return ticket;
1208
+ }
1209
+ /**
1210
+ * Check if the SDK is initialized
1211
+ */
1212
+ isInitialized() {
1213
+ return this.config !== null && this.ticketId !== null;
1214
+ }
1215
+ /**
1216
+ * Get the current configuration
1217
+ */
1218
+ getConfig() {
1219
+ return this.config;
1220
+ }
1221
+ /**
1222
+ * Get the current ticket ID
1223
+ */
1224
+ getTicketId() {
1225
+ return this.ticketId;
1226
+ }
1227
+ /**
1228
+ * Create a new ticket
1229
+ */
1230
+ async createTicket() {
1231
+ if (!this.config) {
1232
+ throw new Error("EventTracker not initialized");
1233
+ }
1234
+ try {
1235
+ const response = await this.makeRequest("/api/v1/et/init", {
1236
+ method: "POST",
1237
+ headers: {
1238
+ "Content-Type": "application/json",
1239
+ "X-API-Key": this.config.apiKey
1240
+ },
1241
+ body: JSON.stringify({
1242
+ agentId: this.config.agentId,
1243
+ sessionId: this.config.sessionId
1244
+ })
1245
+ });
1246
+ if (!response.ok) {
1247
+ throw new Error(
1248
+ `Failed to initialize: ${response.status} ${response.statusText}`
1249
+ );
1250
+ }
1251
+ const data = await response.json();
1252
+ this.ticketId = data.ticketId;
1253
+ if (this.config.autoTrack) {
1254
+ this.setupAutoTracking();
1255
+ }
1256
+ return this.ticketId;
1257
+ } catch (error) {
1258
+ console.error("EventTracker initialization failed:", error);
1259
+ throw error;
1260
+ }
1261
+ }
1262
+ /**
1263
+ * Log an event
1264
+ * @param eventType The type of event
1265
+ * @param eventData Optional event data
1266
+ */
1267
+ async logEvent(eventType, eventData) {
1268
+ if (!this.config || !this.ticketId) {
1269
+ console.warn("EventTracker not initialized, skipping event:", eventType);
1270
+ return;
1271
+ }
1272
+ const event = {
1273
+ eventType,
1274
+ eventData,
1275
+ timestamp: Date.now()
1276
+ };
1277
+ this.eventQueue.push(event);
1278
+ if (this.eventQueue.length > (this.config.queueSize || 100)) {
1279
+ this.eventQueue.shift();
1280
+ }
1281
+ if (this.isOnline) {
1282
+ try {
1283
+ await this.sendEvent(event);
1284
+ } catch (error) {
1285
+ console.warn("Failed to send event, will retry later:", error);
1286
+ }
1287
+ }
1288
+ }
1289
+ /**
1290
+ * Send an event to the server
1291
+ */
1292
+ async sendEvent(event) {
1293
+ if (!this.config || !this.ticketId) return;
1294
+ try {
1295
+ const response = await this.makeRequest("/api/v1/et/event", {
1296
+ method: "POST",
1297
+ headers: {
1298
+ "Content-Type": "application/json",
1299
+ "X-API-Key": this.config.apiKey
1300
+ },
1301
+ body: JSON.stringify({
1302
+ ticketId: this.ticketId,
1303
+ eventType: event.eventType,
1304
+ eventData: event.eventData
1305
+ })
1306
+ });
1307
+ if (!response.ok) {
1308
+ throw new Error(
1309
+ `Failed to log event: ${response.status} ${response.statusText}`
1310
+ );
1311
+ }
1312
+ const index = this.eventQueue.findIndex(
1313
+ (e) => e.timestamp === event.timestamp
1314
+ );
1315
+ if (index > -1) {
1316
+ this.eventQueue.splice(index, 1);
1317
+ }
1318
+ } catch (error) {
1319
+ console.error("Event logging failed:", error);
1320
+ this.retryQueue.push(() => this.sendEvent(event));
1321
+ }
1322
+ }
1323
+ /**
1324
+ * Close the current ticket
1325
+ */
1326
+ async closeTicket() {
1327
+ if (!this.config || !this.ticketId) {
1328
+ throw new Error("EventTracker not initialized");
1329
+ }
1330
+ await this.flush();
1331
+ try {
1332
+ const response = await this.makeRequest("/api/v1/et/close", {
1333
+ method: "POST",
1334
+ headers: {
1335
+ "Content-Type": "application/json",
1336
+ "X-API-Key": this.config.apiKey
1337
+ },
1338
+ body: JSON.stringify({
1339
+ ticketId: this.ticketId
1340
+ })
1341
+ });
1342
+ if (!response.ok) {
1343
+ throw new Error(
1344
+ `Failed to close ticket: ${response.status} ${response.statusText}`
1345
+ );
1346
+ }
1347
+ this.ticketId = null;
1348
+ this.stopPeriodicFlush();
1349
+ console.log("Ticket closed successfully");
1350
+ } catch (error) {
1351
+ console.error("Ticket close failed:", error);
1352
+ throw error;
1353
+ }
1354
+ }
1355
+ /**
1356
+ * Flush all pending events
1357
+ */
1358
+ async flush() {
1359
+ if (!this.isOnline || this.eventQueue.length === 0) return;
1360
+ const eventsToFlush = [...this.eventQueue];
1361
+ for (const event of eventsToFlush) {
1362
+ await this.sendEvent(event);
1363
+ }
1364
+ const retryItems = [...this.retryQueue];
1365
+ this.retryQueue = [];
1366
+ for (const retryFn of retryItems) {
1367
+ try {
1368
+ await retryFn();
1369
+ } catch (error) {
1370
+ console.error("Retry failed:", error);
1371
+ }
1372
+ }
1373
+ }
1374
+ /**
1375
+ * Make an HTTP request with retry logic
1376
+ */
1377
+ async makeRequest(url, options) {
1378
+ var _a;
1379
+ const fullUrl = `${this.baseUrl}${url}`;
1380
+ const maxRetries = ((_a = this.config) == null ? void 0 : _a.retryAttempts) || 3;
1381
+ for (let attempt = 1; attempt <= maxRetries; attempt++) {
1382
+ try {
1383
+ const response = await fetch(fullUrl, options);
1384
+ return response;
1385
+ } catch (error) {
1386
+ if (attempt === maxRetries) {
1387
+ throw error;
1388
+ }
1389
+ const delay = Math.min(1e3 * Math.pow(2, attempt - 1), 1e4);
1390
+ await new Promise((resolve) => setTimeout(resolve, delay));
1391
+ }
1392
+ }
1393
+ throw new Error("Max retries exceeded");
1394
+ }
1395
+ /**
1396
+ * Set up automatic event tracking
1397
+ */
1398
+ setupAutoTracking() {
1399
+ var _a;
1400
+ if (typeof window === "undefined" || !((_a = this.config) == null ? void 0 : _a.autoTrack)) return;
1401
+ const autoTrackConfig = this.config.autoTrack === true ? {} : this.config.autoTrack;
1402
+ if (autoTrackConfig.pageVisits !== false) {
1403
+ this.logEvent("pageVisit", {
1404
+ url: window.location.href,
1405
+ title: document.title,
1406
+ referrer: document.referrer,
1407
+ userAgent: navigator.userAgent,
1408
+ viewport: {
1409
+ width: window.innerWidth,
1410
+ height: window.innerHeight
1411
+ },
1412
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1413
+ }).catch((error) => console.warn("Failed to track page visit:", error));
1414
+ }
1415
+ if (autoTrackConfig.clicks !== false) {
1416
+ document.addEventListener("click", (event) => {
1417
+ var _a2;
1418
+ const target = event.target;
1419
+ if (target.tagName === "BUTTON" || target.tagName === "A" || target.onclick || target.getAttribute("role") === "button" || target instanceof HTMLButtonElement && target.type === "button") {
1420
+ this.logEvent("click", {
1421
+ element: target.tagName,
1422
+ text: (_a2 = target.textContent) == null ? void 0 : _a2.trim().substring(0, 100),
1423
+ // Limit text length
1424
+ href: target.getAttribute("href"),
1425
+ id: target.id,
1426
+ className: target.className,
1427
+ role: target.getAttribute("role"),
1428
+ position: {
1429
+ x: event.clientX,
1430
+ y: event.clientY
1431
+ },
1432
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1433
+ }).catch((error) => console.warn("Failed to track click:", error));
1434
+ }
1435
+ });
1436
+ }
1437
+ if (autoTrackConfig.forms !== false) {
1438
+ document.addEventListener("submit", (event) => {
1439
+ const target = event.target;
1440
+ const formData = new FormData(target);
1441
+ const formFields = {};
1442
+ formData.forEach((value, key) => {
1443
+ formFields[key] = value.toString();
1444
+ });
1445
+ this.logEvent("formSubmission", {
1446
+ formId: target.id,
1447
+ action: target.action,
1448
+ method: target.method,
1449
+ fields: Object.keys(formFields),
1450
+ fieldCount: Object.keys(formFields).length,
1451
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1452
+ }).catch(
1453
+ (error) => console.warn("Failed to track form submission:", error)
1454
+ );
1455
+ });
1456
+ }
1457
+ if (autoTrackConfig.inputs !== false) {
1458
+ let inputTimer;
1459
+ document.addEventListener("input", (event) => {
1460
+ const target = event.target;
1461
+ if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT") {
1462
+ clearTimeout(inputTimer);
1463
+ inputTimer = setTimeout(() => {
1464
+ var _a2;
1465
+ this.logEvent("fieldChange", {
1466
+ element: target.tagName,
1467
+ type: target.getAttribute("type"),
1468
+ name: target.getAttribute("name"),
1469
+ id: target.id,
1470
+ valueLength: ((_a2 = target.value) == null ? void 0 : _a2.length) || 0,
1471
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1472
+ }).catch(
1473
+ (error) => console.warn("Failed to track field change:", error)
1474
+ );
1475
+ }, 1e3);
1476
+ }
1477
+ });
1478
+ }
1479
+ const sessionStartTime = Date.now();
1480
+ window.addEventListener("beforeunload", () => {
1481
+ const sessionDuration = Date.now() - sessionStartTime;
1482
+ this.logEvent("pageUnload", {
1483
+ url: window.location.href,
1484
+ sessionDuration,
1485
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1486
+ });
1487
+ if (this.ticketId) {
1488
+ navigator.sendBeacon(
1489
+ `${this.baseUrl}/api/v1/et/close`,
1490
+ JSON.stringify({
1491
+ ticketId: this.ticketId
1492
+ })
1493
+ );
1494
+ }
1495
+ });
1496
+ if (autoTrackConfig.visibility !== false) {
1497
+ document.addEventListener("visibilitychange", () => {
1498
+ this.logEvent("visibilityChange", {
1499
+ hidden: document.hidden,
1500
+ visibilityState: document.visibilityState,
1501
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1502
+ });
1503
+ });
1504
+ }
1505
+ if (autoTrackConfig.errors !== false) {
1506
+ window.addEventListener("error", (event) => {
1507
+ this.logEvent("jsError", {
1508
+ message: event.message,
1509
+ filename: event.filename,
1510
+ lineno: event.lineno,
1511
+ colno: event.colno,
1512
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1513
+ });
1514
+ });
1515
+ window.addEventListener("unhandledrejection", (event) => {
1516
+ var _a2;
1517
+ this.logEvent("unhandledRejection", {
1518
+ reason: (_a2 = event.reason) == null ? void 0 : _a2.toString(),
1519
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1520
+ });
1521
+ });
1522
+ }
1523
+ if (autoTrackConfig.performance !== false && typeof window.performance !== "undefined" && window.performance.navigation) {
1524
+ window.addEventListener("load", () => {
1525
+ setTimeout(() => {
1526
+ const navigation = window.performance.navigation;
1527
+ const timing = window.performance.timing;
1528
+ this.logEvent("performanceMetrics", {
1529
+ navigationTime: timing.navigationStart,
1530
+ loadTime: timing.loadEventEnd - timing.navigationStart,
1531
+ domReady: timing.domContentLoadedEventEnd - timing.navigationStart,
1532
+ renderTime: timing.loadEventEnd - timing.domContentLoadedEventEnd,
1533
+ navigationType: navigation.type,
1534
+ redirectCount: navigation.redirectCount,
1535
+ timestamp: (/* @__PURE__ */ new Date()).toISOString()
1536
+ });
1537
+ }, 1e3);
1538
+ });
1539
+ }
1540
+ }
1541
+ /**
1542
+ * Set up network detection
1543
+ */
1544
+ setupNetworkDetection() {
1545
+ if (typeof window === "undefined") return;
1546
+ this.isOnline = navigator.onLine;
1547
+ window.addEventListener("online", () => {
1548
+ this.isOnline = true;
1549
+ console.log("EventTracker: Back online, flushing queued events");
1550
+ this.flush();
1551
+ });
1552
+ window.addEventListener("offline", () => {
1553
+ this.isOnline = false;
1554
+ console.log("EventTracker: Offline, queueing events");
1555
+ });
1556
+ }
1557
+ /**
1558
+ * Start periodic flush timer
1559
+ */
1560
+ startPeriodicFlush() {
1561
+ var _a;
1562
+ if (this.flushTimer) {
1563
+ clearInterval(this.flushTimer);
1564
+ }
1565
+ const interval = ((_a = this.config) == null ? void 0 : _a.flushInterval) || 5e3;
1566
+ this.flushTimer = setInterval(() => {
1567
+ this.flush();
1568
+ }, interval);
1569
+ }
1570
+ /**
1571
+ * Stop periodic flush timer
1572
+ */
1573
+ stopPeriodicFlush() {
1574
+ if (this.flushTimer) {
1575
+ clearInterval(this.flushTimer);
1576
+ this.flushTimer = null;
1577
+ }
1578
+ }
1579
+ };
1580
+ var eventTracker = new EventTrackerSDK();
1581
+ if (typeof window !== "undefined") {
1582
+ window.EventTracker = eventTracker;
1583
+ }
1584
+
1585
+ // call-control-sdk/index.ts
1212
1586
  function initSDK({
1213
1587
  apiKey,
1214
1588
  tenantId,