call-control-sdk 5.4.7 → 5.4.8
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.
- package/dist/index.d.mts +872 -11
- package/dist/index.d.ts +872 -11
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { SxProps } from '@mui/material';
|
|
2
|
-
import
|
|
2
|
+
import { AxiosResponse, AxiosError, AxiosRequestConfig } from 'axios';
|
|
3
|
+
import * as react from 'react';
|
|
3
4
|
|
|
4
5
|
/**
|
|
5
6
|
* Custom hook for handling agent logout functionality
|
|
@@ -35,34 +36,715 @@ declare const useEndCall: () => {
|
|
|
35
36
|
data: null;
|
|
36
37
|
};
|
|
37
38
|
|
|
39
|
+
/**
|
|
40
|
+
* @interface CallData
|
|
41
|
+
* @description Comprehensive interface defining call-related data structure for CTI operations.
|
|
42
|
+
* Contains all necessary information about active calls, including metadata, status, and references.
|
|
43
|
+
*
|
|
44
|
+
* @declaration
|
|
45
|
+
* ```typescript
|
|
46
|
+
* interface CallData {
|
|
47
|
+
* mobileNumber?: string;
|
|
48
|
+
* callReferenceId?: string;
|
|
49
|
+
* convoxId?: string;
|
|
50
|
+
* type?: string;
|
|
51
|
+
* status?: string;
|
|
52
|
+
* agent_id?: string;
|
|
53
|
+
* phone_number?: string;
|
|
54
|
+
* event_time?: string;
|
|
55
|
+
* convox_id?: string;
|
|
56
|
+
* process_id?: string;
|
|
57
|
+
* process_name?: string;
|
|
58
|
+
* }
|
|
59
|
+
* ```
|
|
60
|
+
*
|
|
61
|
+
* @requiredParams None (all fields are optional for flexibility)
|
|
62
|
+
*
|
|
63
|
+
* @returnType Interface definition
|
|
64
|
+
*
|
|
65
|
+
* @example
|
|
66
|
+
* ```typescript
|
|
67
|
+
* const callData: CallData = {
|
|
68
|
+
* mobileNumber: "1234567890",
|
|
69
|
+
* callReferenceId: "REF123456",
|
|
70
|
+
* status: "ONCALL",
|
|
71
|
+
* agent_id: "agent001",
|
|
72
|
+
* process_id: "proc001",
|
|
73
|
+
* process_name: "Sales Process"
|
|
74
|
+
* };
|
|
75
|
+
* ```
|
|
76
|
+
*
|
|
77
|
+
* @return Interface definition for call data structure
|
|
78
|
+
*
|
|
79
|
+
* @conclusion Essential data structure for all call-related operations and state management.
|
|
80
|
+
*/
|
|
38
81
|
interface CallData {
|
|
82
|
+
/** Mobile number of the caller or callee */
|
|
39
83
|
mobileNumber?: string;
|
|
84
|
+
/** Unique reference identifier for the call */
|
|
40
85
|
callReferenceId?: string;
|
|
86
|
+
/** Convox system identifier for the call */
|
|
41
87
|
convoxId?: string;
|
|
88
|
+
/** Type of call (inbound, outbound, internal, etc.) */
|
|
42
89
|
type?: string;
|
|
90
|
+
/** Current status of the call (ONCALL, RINGING, WRAPUP, etc.) */
|
|
43
91
|
status?: string;
|
|
92
|
+
/** Agent identifier associated with the call */
|
|
44
93
|
agent_id?: string;
|
|
94
|
+
/** Phone number involved in the call */
|
|
45
95
|
phone_number?: string;
|
|
96
|
+
/** Timestamp when the call event occurred */
|
|
46
97
|
event_time?: string;
|
|
98
|
+
/** Convox system call ID */
|
|
47
99
|
convox_id?: string;
|
|
100
|
+
/** Process identifier for the call */
|
|
48
101
|
process_id?: string;
|
|
102
|
+
/** Name of the process handling the call */
|
|
49
103
|
process_name?: string;
|
|
50
104
|
}
|
|
105
|
+
/**
|
|
106
|
+
* @interface CallControlPanelProps
|
|
107
|
+
* @description Props interface for the main CallControlPanel component.
|
|
108
|
+
* Defines the properties that can be passed to customize the call control interface behavior.
|
|
109
|
+
*
|
|
110
|
+
* @declaration
|
|
111
|
+
* ```typescript
|
|
112
|
+
* interface CallControlPanelProps {
|
|
113
|
+
* onDataChange?: (data: CallData) => void;
|
|
114
|
+
* }
|
|
115
|
+
* ```
|
|
116
|
+
*
|
|
117
|
+
* @requiredParams None (all props are optional)
|
|
118
|
+
*
|
|
119
|
+
* @returnType Interface definition
|
|
120
|
+
*
|
|
121
|
+
* @example
|
|
122
|
+
* ```tsx
|
|
123
|
+
* <CallControlPanel
|
|
124
|
+
* onDataChange={(callData) => {
|
|
125
|
+
* console.log('Call status changed:', callData.status);
|
|
126
|
+
* // Handle call data updates
|
|
127
|
+
* }}
|
|
128
|
+
* />
|
|
129
|
+
* ```
|
|
130
|
+
*
|
|
131
|
+
* @return Interface definition for component props
|
|
132
|
+
*
|
|
133
|
+
* @conclusion Provides flexible configuration for the call control panel component.
|
|
134
|
+
*/
|
|
51
135
|
interface CallControlPanelProps {
|
|
52
|
-
|
|
136
|
+
/** Optional callback function triggered when call data changes */
|
|
137
|
+
onDataChange?: (data: CallData) => void;
|
|
53
138
|
}
|
|
54
|
-
|
|
139
|
+
/**
|
|
140
|
+
* @type CallStatus
|
|
141
|
+
* @description Union type defining all possible call statuses in the CTI system.
|
|
142
|
+
* Represents the various states a call can be in during its lifecycle.
|
|
143
|
+
*
|
|
144
|
+
* @declaration
|
|
145
|
+
* ```typescript
|
|
146
|
+
* type CallStatus =
|
|
147
|
+
* | "idle"
|
|
148
|
+
* | "ready"
|
|
149
|
+
* | "break"
|
|
150
|
+
* | "on call"
|
|
151
|
+
* | "wrap up"
|
|
152
|
+
* | "dial"
|
|
153
|
+
* | "hold"
|
|
154
|
+
* | "mute";
|
|
155
|
+
* ```
|
|
156
|
+
*
|
|
157
|
+
* @requiredParams None (type definition)
|
|
158
|
+
*
|
|
159
|
+
* @returnType Union type definition
|
|
160
|
+
*
|
|
161
|
+
* @example
|
|
162
|
+
* ```typescript
|
|
163
|
+
* const currentStatus: CallStatus = "on call";
|
|
164
|
+
* const agentStatus: CallStatus = "ready";
|
|
165
|
+
* ```
|
|
166
|
+
*
|
|
167
|
+
* @return Union type with all possible call status values
|
|
168
|
+
*
|
|
169
|
+
* @conclusion Essential type for call state management and UI updates.
|
|
170
|
+
*/
|
|
171
|
+
type CallStatus = "idle" /** Agent is idle and available */ | "ready" /** Agent is ready to receive calls */ | "break" /** Agent is on break */ | "on call" /** Agent is currently on a call */ | "wrap up" /** Agent is in wrap-up phase after call */ | "dial" /** Agent is dialing a number */ | "hold" /** Call is on hold */ | "mute"; /** Call is muted */
|
|
172
|
+
/**
|
|
173
|
+
* @type ConferenceLineTypes
|
|
174
|
+
* @description Type definition for individual conference line data structure.
|
|
175
|
+
* Represents a single line in a conference call with its state and controls.
|
|
176
|
+
*
|
|
177
|
+
* @declaration
|
|
178
|
+
* ```typescript
|
|
179
|
+
* type ConferenceLineTypes = {
|
|
180
|
+
* line: number;
|
|
181
|
+
* status: string;
|
|
182
|
+
* type: "external" | "internal" | "";
|
|
183
|
+
* phone: string;
|
|
184
|
+
* isMute: boolean;
|
|
185
|
+
* isHold: boolean;
|
|
186
|
+
* isCallStart: boolean;
|
|
187
|
+
* isMergeCall: boolean;
|
|
188
|
+
* };
|
|
189
|
+
* ```
|
|
190
|
+
*
|
|
191
|
+
* @requiredParams None (type definition)
|
|
192
|
+
*
|
|
193
|
+
* @returnType Type definition
|
|
194
|
+
*
|
|
195
|
+
* @example
|
|
196
|
+
* ```typescript
|
|
197
|
+
* const conferenceLine: ConferenceLineTypes = {
|
|
198
|
+
* line: 1,
|
|
199
|
+
* status: "ONCALL",
|
|
200
|
+
* type: "internal",
|
|
201
|
+
* phone: "1234567890",
|
|
202
|
+
* isMute: false,
|
|
203
|
+
* isHold: false,
|
|
204
|
+
* isCallStart: true,
|
|
205
|
+
* isMergeCall: false
|
|
206
|
+
* };
|
|
207
|
+
* ```
|
|
208
|
+
*
|
|
209
|
+
* @return Type definition for conference line data
|
|
210
|
+
*
|
|
211
|
+
* @conclusion Essential type for conference call management and line state tracking.
|
|
212
|
+
*/
|
|
213
|
+
type ConferenceLineTypes = {
|
|
214
|
+
/** Line number identifier (1, 2, 3, etc.) */
|
|
215
|
+
line: number;
|
|
216
|
+
/** Current status of the line (ONCALL, IDLE, LINE USED, etc.) */
|
|
217
|
+
status: string;
|
|
218
|
+
/** Type of line (internal for agent, external for third party) */
|
|
219
|
+
type: "external" | "internal" | "";
|
|
220
|
+
/** Phone number associated with this line */
|
|
221
|
+
phone: string;
|
|
222
|
+
/** Whether the line is currently muted */
|
|
223
|
+
isMute: boolean;
|
|
224
|
+
/** Whether the line is currently on hold */
|
|
225
|
+
isHold: boolean;
|
|
226
|
+
/** Whether a call has been started on this line */
|
|
227
|
+
isCallStart: boolean;
|
|
228
|
+
/** Whether this line is merged into a conference */
|
|
229
|
+
isMergeCall: boolean;
|
|
230
|
+
};
|
|
231
|
+
/**
|
|
232
|
+
* @interface SDKConfig
|
|
233
|
+
* @description Configuration interface for customizing the Call Control SDK behavior.
|
|
234
|
+
* Allows disabling specific features and customizing the visual appearance of components.
|
|
235
|
+
*
|
|
236
|
+
* @declaration
|
|
237
|
+
* ```typescript
|
|
238
|
+
* interface SDKConfig {
|
|
239
|
+
* disableEndCallButton?: boolean;
|
|
240
|
+
* disabledDialButton?: boolean;
|
|
241
|
+
* disableCallTransferButton?: boolean;
|
|
242
|
+
* isDraggable?: boolean;
|
|
243
|
+
* disableSoftPhone?: boolean;
|
|
244
|
+
* disableConferenceButton?: boolean;
|
|
245
|
+
* disabled?: SxProps;
|
|
246
|
+
* enabled?: SxProps;
|
|
247
|
+
* outlined?: SxProps;
|
|
248
|
+
* }
|
|
249
|
+
* ```
|
|
250
|
+
*
|
|
251
|
+
* @requiredParams None (all configuration options are optional)
|
|
252
|
+
*
|
|
253
|
+
* @returnType Interface definition
|
|
254
|
+
*
|
|
255
|
+
* @example
|
|
256
|
+
* ```typescript
|
|
257
|
+
* const sdkConfig: SDKConfig = {
|
|
258
|
+
* disableEndCallButton: false,
|
|
259
|
+
* disabledDialButton: true,
|
|
260
|
+
* isDraggable: true,
|
|
261
|
+
* disableSoftPhone: false,
|
|
262
|
+
* enabled: { backgroundColor: 'green' },
|
|
263
|
+
* disabled: { backgroundColor: 'gray' }
|
|
264
|
+
* };
|
|
265
|
+
* ```
|
|
266
|
+
*
|
|
267
|
+
* @return Interface definition for SDK configuration
|
|
268
|
+
*
|
|
269
|
+
* @conclusion Provides comprehensive customization options for the CTI interface.
|
|
270
|
+
*/
|
|
55
271
|
interface SDKConfig {
|
|
272
|
+
/** Whether to disable the end call button */
|
|
56
273
|
disableEndCallButton?: boolean;
|
|
274
|
+
/** Whether to disable the dial button */
|
|
57
275
|
disabledDialButton?: boolean;
|
|
276
|
+
/** Whether to disable the call transfer button */
|
|
58
277
|
disableCallTransferButton?: boolean;
|
|
278
|
+
/** Whether the control panel should be draggable */
|
|
59
279
|
isDraggable?: boolean;
|
|
280
|
+
/** Whether to disable the soft phone iframe */
|
|
60
281
|
disableSoftPhone?: boolean;
|
|
282
|
+
/** Whether to disable the conference button */
|
|
61
283
|
disableConferenceButton?: boolean;
|
|
284
|
+
/** Custom styles for disabled button states */
|
|
62
285
|
disabled?: SxProps;
|
|
286
|
+
/** Custom styles for enabled button states */
|
|
63
287
|
enabled?: SxProps;
|
|
288
|
+
/** Custom styles for outlined button states */
|
|
64
289
|
outlined?: SxProps;
|
|
65
290
|
}
|
|
291
|
+
/**
|
|
292
|
+
* @interface SDKState
|
|
293
|
+
* @description Comprehensive state interface for the Call Control SDK.
|
|
294
|
+
* Contains all necessary state information for managing CTI operations, UI state, and call data.
|
|
295
|
+
*
|
|
296
|
+
* @declaration
|
|
297
|
+
* ```typescript
|
|
298
|
+
* interface SDKState {
|
|
299
|
+
* openConferenceDialog: boolean;
|
|
300
|
+
* openCallTransferDialog: boolean;
|
|
301
|
+
* process?: { process_id: number; process_name: string } | null;
|
|
302
|
+
* agentId: string;
|
|
303
|
+
* sdkConfig: SDKConfig | null;
|
|
304
|
+
* isInitialized: boolean;
|
|
305
|
+
* isHolding: boolean;
|
|
306
|
+
* isMuted: boolean;
|
|
307
|
+
* status: CallStatus;
|
|
308
|
+
* convox_id?: string;
|
|
309
|
+
* process_id?: number;
|
|
310
|
+
* callStartTime: number | null;
|
|
311
|
+
* position?: { x: number; y: number };
|
|
312
|
+
* controlPanelPosition: { x: number; y: number };
|
|
313
|
+
* iframePosition: { x: number; y: number };
|
|
314
|
+
* callData: CallData;
|
|
315
|
+
* conferenceLine: ConferenceLineTypes[];
|
|
316
|
+
* }
|
|
317
|
+
* ```
|
|
318
|
+
*
|
|
319
|
+
* @requiredParams None (interface definition)
|
|
320
|
+
*
|
|
321
|
+
* @returnType Interface definition
|
|
322
|
+
*
|
|
323
|
+
* @example
|
|
324
|
+
* ```typescript
|
|
325
|
+
* const sdkState: SDKState = {
|
|
326
|
+
* openConferenceDialog: false,
|
|
327
|
+
* openCallTransferDialog: false,
|
|
328
|
+
* agentId: "agent001",
|
|
329
|
+
* sdkConfig: { isDraggable: true },
|
|
330
|
+
* isInitialized: true,
|
|
331
|
+
* isHolding: false,
|
|
332
|
+
* isMuted: false,
|
|
333
|
+
* status: "idle",
|
|
334
|
+
* callStartTime: null,
|
|
335
|
+
* controlPanelPosition: { x: 10, y: 10 },
|
|
336
|
+
* iframePosition: { x: 10, y: 80 },
|
|
337
|
+
* callData: {},
|
|
338
|
+
* conferenceLine: []
|
|
339
|
+
* };
|
|
340
|
+
* ```
|
|
341
|
+
*
|
|
342
|
+
* @return Interface definition for SDK state management
|
|
343
|
+
*
|
|
344
|
+
* @conclusion Central state interface that manages all aspects of the CTI system.
|
|
345
|
+
*/
|
|
346
|
+
interface SDKState {
|
|
347
|
+
/** Whether the conference dialog is currently open */
|
|
348
|
+
openConferenceDialog: boolean;
|
|
349
|
+
/** Whether the call transfer dialog is currently open */
|
|
350
|
+
openCallTransferDialog: boolean;
|
|
351
|
+
/** Currently selected process information */
|
|
352
|
+
process?: {
|
|
353
|
+
process_id: number;
|
|
354
|
+
process_name: string;
|
|
355
|
+
} | null;
|
|
356
|
+
/** Unique identifier for the agent */
|
|
357
|
+
agentId: string;
|
|
358
|
+
/** SDK configuration settings */
|
|
359
|
+
sdkConfig: SDKConfig | null;
|
|
360
|
+
/** Whether the SDK has been successfully initialized */
|
|
361
|
+
isInitialized: boolean;
|
|
362
|
+
/** Whether the current call is on hold */
|
|
363
|
+
isHolding: boolean;
|
|
364
|
+
/** Whether the current call is muted */
|
|
365
|
+
isMuted: boolean;
|
|
366
|
+
/** Current agent/call status */
|
|
367
|
+
status: CallStatus;
|
|
368
|
+
/** Convox system call identifier */
|
|
369
|
+
convox_id?: string;
|
|
370
|
+
/** Process identifier for the current call */
|
|
371
|
+
process_id?: number;
|
|
372
|
+
/** Timestamp when the current call started */
|
|
373
|
+
callStartTime: number | null;
|
|
374
|
+
/** Current position of draggable elements */
|
|
375
|
+
position?: {
|
|
376
|
+
x: number;
|
|
377
|
+
y: number;
|
|
378
|
+
};
|
|
379
|
+
/** Position of the main control panel */
|
|
380
|
+
controlPanelPosition: {
|
|
381
|
+
x: number;
|
|
382
|
+
y: number;
|
|
383
|
+
};
|
|
384
|
+
/** Position of the soft phone iframe */
|
|
385
|
+
iframePosition: {
|
|
386
|
+
x: number;
|
|
387
|
+
y: number;
|
|
388
|
+
};
|
|
389
|
+
/** Current call data and metadata */
|
|
390
|
+
callData: CallData;
|
|
391
|
+
/** Array of conference lines and their states */
|
|
392
|
+
conferenceLine: ConferenceLineTypes[];
|
|
393
|
+
}
|
|
394
|
+
/**
|
|
395
|
+
* @interface RequestOptions
|
|
396
|
+
* @description Interface defining optional success and error callback functions for API requests.
|
|
397
|
+
* Provides a standardized way to handle request lifecycle events with proper error handling.
|
|
398
|
+
*
|
|
399
|
+
* @declaration
|
|
400
|
+
* ```typescript
|
|
401
|
+
* interface RequestOptions {
|
|
402
|
+
* onSuccess?: (response: AxiosResponse, request: any) => void;
|
|
403
|
+
* onError?: (error: any, request: any) => void;
|
|
404
|
+
* }
|
|
405
|
+
* ```
|
|
406
|
+
*
|
|
407
|
+
* @requiredParams None (all callbacks are optional)
|
|
408
|
+
*
|
|
409
|
+
* @returnType Interface definition
|
|
410
|
+
*
|
|
411
|
+
* @example
|
|
412
|
+
* ```typescript
|
|
413
|
+
* const requestOptions: RequestOptions = {
|
|
414
|
+
* onSuccess: (response, request) => {
|
|
415
|
+
* console.log('Request successful:', response.data);
|
|
416
|
+
* // Handle successful response
|
|
417
|
+
* },
|
|
418
|
+
* onError: (error, request) => {
|
|
419
|
+
* console.error('Request failed:', error.message);
|
|
420
|
+
* // Handle error
|
|
421
|
+
* }
|
|
422
|
+
* };
|
|
423
|
+
* ```
|
|
424
|
+
*
|
|
425
|
+
* @return Interface definition for request callback options
|
|
426
|
+
*
|
|
427
|
+
* @conclusion Essential interface for implementing robust error handling and success callbacks in API operations.
|
|
428
|
+
*/
|
|
429
|
+
interface RequestOptions {
|
|
430
|
+
/**
|
|
431
|
+
* Callback function triggered when the request succeeds.
|
|
432
|
+
* @param response - The successful Axios response object
|
|
433
|
+
* @param request - The original request configuration
|
|
434
|
+
*/
|
|
435
|
+
onSuccess?: (response: AxiosResponse, request: any) => void;
|
|
436
|
+
/**
|
|
437
|
+
* Callback function triggered when the request fails.
|
|
438
|
+
* @param error - The error object containing failure details
|
|
439
|
+
* @param request - The original request configuration
|
|
440
|
+
*/
|
|
441
|
+
onError?: (error: any, request: any) => void;
|
|
442
|
+
disabledSuccessToast?: boolean;
|
|
443
|
+
}
|
|
444
|
+
/**
|
|
445
|
+
* @interface RequestResult
|
|
446
|
+
* @description Interface defining the return type of API hook state management.
|
|
447
|
+
* Provides comprehensive state tracking for HTTP requests including loading, success, error states, and data.
|
|
448
|
+
*
|
|
449
|
+
* @declaration
|
|
450
|
+
* ```typescript
|
|
451
|
+
* interface RequestResult<T> {
|
|
452
|
+
* isLoading: boolean;
|
|
453
|
+
* isSuccess: boolean;
|
|
454
|
+
* isError: boolean;
|
|
455
|
+
* error: AxiosError | null;
|
|
456
|
+
* data: AxiosResponse<T> | null;
|
|
457
|
+
* }
|
|
458
|
+
* ```
|
|
459
|
+
*
|
|
460
|
+
* @requiredParams None (interface definition)
|
|
461
|
+
*
|
|
462
|
+
* @returnType Interface definition
|
|
463
|
+
*
|
|
464
|
+
* @example
|
|
465
|
+
* ```typescript
|
|
466
|
+
* const [makeRequest, requestState] = usePostRequest<User>();
|
|
467
|
+
*
|
|
468
|
+
* // requestState has type RequestResult<User>
|
|
469
|
+
* if (requestState.isLoading) {
|
|
470
|
+
* return <LoadingSpinner />;
|
|
471
|
+
* }
|
|
472
|
+
*
|
|
473
|
+
* if (requestState.isError) {
|
|
474
|
+
* return <ErrorMessage error={requestState.error} />;
|
|
475
|
+
* }
|
|
476
|
+
*
|
|
477
|
+
* if (requestState.isSuccess) {
|
|
478
|
+
* return <UserData user={requestState.data?.data} />;
|
|
479
|
+
* }
|
|
480
|
+
* ```
|
|
481
|
+
*
|
|
482
|
+
* @return Interface definition for request state management
|
|
483
|
+
*
|
|
484
|
+
* @conclusion Essential interface for consistent state management across all API operations.
|
|
485
|
+
*/
|
|
486
|
+
interface RequestResult<T> {
|
|
487
|
+
/** Boolean flag indicating if the request is currently in progress */
|
|
488
|
+
isLoading: boolean;
|
|
489
|
+
/** Boolean flag indicating the request completed successfully */
|
|
490
|
+
isSuccess: boolean;
|
|
491
|
+
/** Boolean flag indicating an error occurred during the request */
|
|
492
|
+
isError: boolean;
|
|
493
|
+
/** Holds the Axios error object if an error occurred, null otherwise */
|
|
494
|
+
error: AxiosError | null;
|
|
495
|
+
/** Holds the successful Axios response data, null if no successful request yet */
|
|
496
|
+
data: AxiosResponse<T> | null;
|
|
497
|
+
}
|
|
498
|
+
/**
|
|
499
|
+
* @interface UseApiRequest
|
|
500
|
+
* @description Generic interface for custom API hooks that perform HTTP operations with comprehensive state tracking.
|
|
501
|
+
* Provides a standardized pattern for API request functions with built-in state management.
|
|
502
|
+
*
|
|
503
|
+
* @declaration
|
|
504
|
+
* ```typescript
|
|
505
|
+
* interface UseApiRequest<T = {}, P = void> {
|
|
506
|
+
* (url: string, payloadOrConfig?: P, config?: AxiosRequestConfig): void;
|
|
507
|
+
* state: RequestResult<T>;
|
|
508
|
+
* }
|
|
509
|
+
* ```
|
|
510
|
+
*
|
|
511
|
+
* @requiredParams None (interface definition)
|
|
512
|
+
*
|
|
513
|
+
* @returnType Interface definition
|
|
514
|
+
*
|
|
515
|
+
* @example
|
|
516
|
+
* ```typescript
|
|
517
|
+
* const fetchUser: UseApiRequest<User, { id: number }> = useApi({
|
|
518
|
+
* onSuccess: (response) => console.log('User fetched:', response.data),
|
|
519
|
+
* onError: (error) => console.error('Failed to fetch user:', error)
|
|
520
|
+
* });
|
|
521
|
+
*
|
|
522
|
+
* // Usage
|
|
523
|
+
* fetchUser('/api/users', { id: 123 });
|
|
524
|
+
*
|
|
525
|
+
* // Access state
|
|
526
|
+
* if (fetchUser.state.isLoading) {
|
|
527
|
+
* return <LoadingSpinner />;
|
|
528
|
+
* }
|
|
529
|
+
* ```
|
|
530
|
+
*
|
|
531
|
+
* @return Interface definition for API request hooks
|
|
532
|
+
*
|
|
533
|
+
* @conclusion Provides a consistent pattern for all API operations with built-in state management and error handling.
|
|
534
|
+
*/
|
|
535
|
+
interface UseApiRequest<T = {}, P = void> {
|
|
536
|
+
/**
|
|
537
|
+
* Executes the API request with the provided parameters
|
|
538
|
+
* @param url - The API endpoint URL
|
|
539
|
+
* @param payloadOrConfig - Request payload or configuration object
|
|
540
|
+
* @param config - Additional Axios configuration options
|
|
541
|
+
*/
|
|
542
|
+
(url: string, payloadOrConfig?: P, config?: AxiosRequestConfig): void;
|
|
543
|
+
/** Current state of the request including loading, success, error, and data */
|
|
544
|
+
state: RequestResult<T>;
|
|
545
|
+
}
|
|
546
|
+
/**
|
|
547
|
+
* @type UseGetRequest
|
|
548
|
+
* @description Tuple type for HTTP GET request hooks with comprehensive state management.
|
|
549
|
+
* Provides a clean API for making GET requests with built-in loading, success, and error states.
|
|
550
|
+
*
|
|
551
|
+
* @declaration
|
|
552
|
+
* ```typescript
|
|
553
|
+
* type UseGetRequest<T = {}> = [
|
|
554
|
+
* (url: string, config?: AxiosRequestConfig) => void,
|
|
555
|
+
* RequestResult<T>
|
|
556
|
+
* ];
|
|
557
|
+
* ```
|
|
558
|
+
*
|
|
559
|
+
* @requiredParams None (type definition)
|
|
560
|
+
*
|
|
561
|
+
* @returnType Tuple type definition
|
|
562
|
+
*
|
|
563
|
+
* @example
|
|
564
|
+
* ```typescript
|
|
565
|
+
* const [getUser, userState] = useGetRequest<User>();
|
|
566
|
+
*
|
|
567
|
+
* // Execute request
|
|
568
|
+
* getUser("/api/users/123");
|
|
569
|
+
*
|
|
570
|
+
* // Access state
|
|
571
|
+
* if (userState.isLoading) return <LoadingSpinner />;
|
|
572
|
+
* if (userState.isError) return <ErrorMessage error={userState.error} />;
|
|
573
|
+
* if (userState.isSuccess) return <UserProfile user={userState.data?.data} />;
|
|
574
|
+
* ```
|
|
575
|
+
*
|
|
576
|
+
* @return Tuple type: [request function, state object]
|
|
577
|
+
*
|
|
578
|
+
* @conclusion Provides a consistent pattern for GET requests with comprehensive state management.
|
|
579
|
+
*/
|
|
580
|
+
type UseGetRequest<T = {}> = [
|
|
581
|
+
(url: string, config?: AxiosRequestConfig) => void,
|
|
582
|
+
RequestResult<T>
|
|
583
|
+
];
|
|
584
|
+
/**
|
|
585
|
+
* @type UsePostRequest
|
|
586
|
+
* @description Tuple type for HTTP POST request hooks with typed payload and state management.
|
|
587
|
+
* Ideal for creating new resources with comprehensive error handling and state tracking.
|
|
588
|
+
*
|
|
589
|
+
* @declaration
|
|
590
|
+
* ```typescript
|
|
591
|
+
* type UsePostRequest<T = {}> = [
|
|
592
|
+
* (url: string, payload: T, config?: AxiosRequestConfig) => void,
|
|
593
|
+
* RequestResult<T>
|
|
594
|
+
* ];
|
|
595
|
+
* ```
|
|
596
|
+
*
|
|
597
|
+
* @requiredParams None (type definition)
|
|
598
|
+
*
|
|
599
|
+
* @returnType Tuple type definition
|
|
600
|
+
*
|
|
601
|
+
* @example
|
|
602
|
+
* ```typescript
|
|
603
|
+
* const [createUser, createState] = usePostRequest<User>();
|
|
604
|
+
*
|
|
605
|
+
* // Execute request
|
|
606
|
+
* createUser("/api/users", {
|
|
607
|
+
* name: "John Doe",
|
|
608
|
+
* email: "john@example.com"
|
|
609
|
+
* });
|
|
610
|
+
*
|
|
611
|
+
* // Access state
|
|
612
|
+
* if (createState.isLoading) return <LoadingSpinner />;
|
|
613
|
+
* if (createState.isSuccess) {
|
|
614
|
+
* console.log("User created:", createState.data?.data);
|
|
615
|
+
* }
|
|
616
|
+
* ```
|
|
617
|
+
*
|
|
618
|
+
* @return Tuple type: [request function, state object]
|
|
619
|
+
*
|
|
620
|
+
* @conclusion Essential type for POST operations with robust state management and error handling.
|
|
621
|
+
*/
|
|
622
|
+
type UsePostRequest<T = {}> = [
|
|
623
|
+
(url: string, payload: T, config?: AxiosRequestConfig) => void,
|
|
624
|
+
RequestResult<T>
|
|
625
|
+
];
|
|
626
|
+
/**
|
|
627
|
+
* @type UsePutRequest
|
|
628
|
+
* @description Tuple type for HTTP PUT request hooks with typed payload and comprehensive state tracking.
|
|
629
|
+
* Perfect for updating existing resources with full state management capabilities.
|
|
630
|
+
*
|
|
631
|
+
* @declaration
|
|
632
|
+
* ```typescript
|
|
633
|
+
* type UsePutRequest<T = {}> = [
|
|
634
|
+
* (url: string, payload: T, config?: AxiosRequestConfig) => void,
|
|
635
|
+
* RequestResult<T>
|
|
636
|
+
* ];
|
|
637
|
+
* ```
|
|
638
|
+
*
|
|
639
|
+
* @requiredParams None (type definition)
|
|
640
|
+
*
|
|
641
|
+
* @returnType Tuple type definition
|
|
642
|
+
*
|
|
643
|
+
* @example
|
|
644
|
+
* ```typescript
|
|
645
|
+
* const [updateUser, updateState] = usePutRequest<User>();
|
|
646
|
+
*
|
|
647
|
+
* // Execute request
|
|
648
|
+
* updateUser("/api/users/123", {
|
|
649
|
+
* name: "Jane Doe",
|
|
650
|
+
* email: "jane@example.com"
|
|
651
|
+
* });
|
|
652
|
+
*
|
|
653
|
+
* // Access state
|
|
654
|
+
* if (updateState.isLoading) return <LoadingSpinner />;
|
|
655
|
+
* if (updateState.isSuccess) {
|
|
656
|
+
* console.log("User updated:", updateState.data?.data);
|
|
657
|
+
* }
|
|
658
|
+
* ```
|
|
659
|
+
*
|
|
660
|
+
* @return Tuple type: [request function, state object]
|
|
661
|
+
*
|
|
662
|
+
* @conclusion Provides consistent pattern for PUT operations with comprehensive state management.
|
|
663
|
+
*/
|
|
664
|
+
type UsePutRequest<T = {}> = [
|
|
665
|
+
(url: string, payload: T, config?: AxiosRequestConfig) => void,
|
|
666
|
+
RequestResult<T>
|
|
667
|
+
];
|
|
668
|
+
/**
|
|
669
|
+
* @type UseDeleteRequest
|
|
670
|
+
* @description Tuple type for HTTP DELETE request hooks with optional configuration and state management.
|
|
671
|
+
* Provides clean API for resource deletion with comprehensive error handling.
|
|
672
|
+
*
|
|
673
|
+
* @declaration
|
|
674
|
+
* ```typescript
|
|
675
|
+
* type UseDeleteRequest<T = {}> = [
|
|
676
|
+
* (url: string, config?: AxiosRequestConfig) => void,
|
|
677
|
+
* RequestResult<T>
|
|
678
|
+
* ];
|
|
679
|
+
* ```
|
|
680
|
+
*
|
|
681
|
+
* @requiredParams None (type definition)
|
|
682
|
+
*
|
|
683
|
+
* @returnType Tuple type definition
|
|
684
|
+
*
|
|
685
|
+
* @example
|
|
686
|
+
* ```typescript
|
|
687
|
+
* const [deleteUser, deleteState] = useDeleteRequest<void>();
|
|
688
|
+
*
|
|
689
|
+
* // Execute request
|
|
690
|
+
* deleteUser("/api/users/123");
|
|
691
|
+
*
|
|
692
|
+
* // Access state
|
|
693
|
+
* if (deleteState.isLoading) return <LoadingSpinner />;
|
|
694
|
+
* if (deleteState.isSuccess) {
|
|
695
|
+
* console.log("User deleted successfully");
|
|
696
|
+
* }
|
|
697
|
+
* ```
|
|
698
|
+
*
|
|
699
|
+
* @return Tuple type: [request function, state object]
|
|
700
|
+
*
|
|
701
|
+
* @conclusion Essential type for DELETE operations with robust state management.
|
|
702
|
+
*/
|
|
703
|
+
type UseDeleteRequest<T = {}> = [
|
|
704
|
+
(url: string, config?: AxiosRequestConfig) => void,
|
|
705
|
+
RequestResult<T>
|
|
706
|
+
];
|
|
707
|
+
/**
|
|
708
|
+
* @type UsePatchRequest
|
|
709
|
+
* @description Tuple type for HTTP PATCH request hooks with typed payload and comprehensive state tracking.
|
|
710
|
+
* Ideal for partial updates with built-in state management and error handling.
|
|
711
|
+
*
|
|
712
|
+
* @declaration
|
|
713
|
+
* ```typescript
|
|
714
|
+
* type UsePatchRequest<T = {}> = [
|
|
715
|
+
* (url: string, payload: T, config?: AxiosRequestConfig) => void,
|
|
716
|
+
* RequestResult<T>
|
|
717
|
+
* ];
|
|
718
|
+
* ```
|
|
719
|
+
*
|
|
720
|
+
* @requiredParams None (type definition)
|
|
721
|
+
*
|
|
722
|
+
* @returnType Tuple type definition
|
|
723
|
+
*
|
|
724
|
+
* @example
|
|
725
|
+
* ```typescript
|
|
726
|
+
* const [patchUser, patchState] = usePatchRequest<Partial<User>>();
|
|
727
|
+
*
|
|
728
|
+
* // Execute request
|
|
729
|
+
* patchUser("/api/users/123", {
|
|
730
|
+
* email: "newemail@example.com"
|
|
731
|
+
* });
|
|
732
|
+
*
|
|
733
|
+
* // Access state
|
|
734
|
+
* if (patchState.isLoading) return <LoadingSpinner />;
|
|
735
|
+
* if (patchState.isSuccess) {
|
|
736
|
+
* console.log("User patched:", patchState.data?.data);
|
|
737
|
+
* }
|
|
738
|
+
* ```
|
|
739
|
+
*
|
|
740
|
+
* @return Tuple type: [request function, state object]
|
|
741
|
+
*
|
|
742
|
+
* @conclusion Provides consistent pattern for PATCH operations with comprehensive state management.
|
|
743
|
+
*/
|
|
744
|
+
type UsePatchRequest<T = {}> = [
|
|
745
|
+
(url: string, payload: T, config?: AxiosRequestConfig) => void,
|
|
746
|
+
RequestResult<T>
|
|
747
|
+
];
|
|
66
748
|
|
|
67
749
|
interface StartCallPayload {
|
|
68
750
|
mobileNumber: string;
|
|
@@ -83,19 +765,198 @@ declare const useClickToCall: () => {
|
|
|
83
765
|
data: null;
|
|
84
766
|
};
|
|
85
767
|
|
|
86
|
-
|
|
768
|
+
/**
|
|
769
|
+
* @function CallControlPanel
|
|
770
|
+
* @description Main wrapper component that provides the complete call control interface.
|
|
771
|
+
* Wraps the CallControls component with necessary providers and context.
|
|
772
|
+
*
|
|
773
|
+
* @declaration
|
|
774
|
+
* ```typescript
|
|
775
|
+
* function CallControlPanel(props: CallControlPanelProps): JSX.Element
|
|
776
|
+
* ```
|
|
777
|
+
*
|
|
778
|
+
* @requiredParams
|
|
779
|
+
* - `props: CallControlPanelProps` - Component props including optional data change callback
|
|
780
|
+
*
|
|
781
|
+
* @returnType `JSX.Element`
|
|
782
|
+
*
|
|
783
|
+
* @example
|
|
784
|
+
* ```tsx
|
|
785
|
+
* // Basic usage
|
|
786
|
+
* <CallControlPanel />
|
|
787
|
+
*
|
|
788
|
+
* // With data change callback
|
|
789
|
+
* <CallControlPanel
|
|
790
|
+
* onDataChange={(callData) => {
|
|
791
|
+
* console.log('Call data updated:', callData);
|
|
792
|
+
* // Handle call data changes
|
|
793
|
+
* }}
|
|
794
|
+
* />
|
|
795
|
+
* ```
|
|
796
|
+
*
|
|
797
|
+
* @return React component providing complete call control interface
|
|
798
|
+
*
|
|
799
|
+
* @conclusion Primary component for integrating CTI functionality into React applications.
|
|
800
|
+
*/
|
|
801
|
+
declare const CallControlPanel: react.NamedExoticComponent<CallControlPanelProps>;
|
|
802
|
+
|
|
803
|
+
/**
|
|
804
|
+
* @fileoverview Call Control SDK - Main Entry Point
|
|
805
|
+
* @description Comprehensive CTI (Computer Telephony Integration) SDK for React applications.
|
|
806
|
+
* Provides complete call control functionality including dialing, conferencing, transferring,
|
|
807
|
+
* and real-time call management with WebSocket integration.
|
|
808
|
+
*
|
|
809
|
+
* @author Achala IT Solutions
|
|
810
|
+
* @version 1.0.0
|
|
811
|
+
* @since 2024
|
|
812
|
+
*/
|
|
87
813
|
|
|
88
814
|
/**
|
|
89
|
-
*
|
|
90
|
-
* @
|
|
91
|
-
*
|
|
815
|
+
* @interface InitSDKParams
|
|
816
|
+
* @description Parameters required for SDK initialization
|
|
817
|
+
*
|
|
818
|
+
* @declaration
|
|
819
|
+
* ```typescript
|
|
820
|
+
* interface InitSDKParams {
|
|
821
|
+
* apiKey: string;
|
|
822
|
+
* tenantId: string;
|
|
823
|
+
* agentId: string;
|
|
824
|
+
* sdkConfig?: SDKConfig;
|
|
825
|
+
* }
|
|
826
|
+
* ```
|
|
827
|
+
*
|
|
828
|
+
* @requiredParams
|
|
829
|
+
* - `apiKey: string` - Authentication key for SDK access
|
|
830
|
+
* - `tenantId: string` - Tenant identifier for multi-tenancy support
|
|
831
|
+
* - `agentId: string` - Agent identifier for call management
|
|
832
|
+
*
|
|
833
|
+
* @returnType Interface definition
|
|
834
|
+
*
|
|
835
|
+
* @example
|
|
836
|
+
* ```typescript
|
|
837
|
+
* const initParams: InitSDKParams = {
|
|
838
|
+
* apiKey: "your-api-key",
|
|
839
|
+
* tenantId: "tenant-123",
|
|
840
|
+
* agentId: "agent-456",
|
|
841
|
+
* sdkConfig: {
|
|
842
|
+
* isDraggable: true,
|
|
843
|
+
* disableSoftPhone: false
|
|
844
|
+
* }
|
|
845
|
+
* };
|
|
846
|
+
* ```
|
|
847
|
+
*
|
|
848
|
+
* @return Interface definition for SDK initialization parameters
|
|
849
|
+
*
|
|
850
|
+
* @conclusion Essential interface for proper SDK initialization with all required parameters.
|
|
92
851
|
*/
|
|
93
|
-
|
|
852
|
+
interface InitSDKParams {
|
|
853
|
+
/** Authentication key for SDK access */
|
|
94
854
|
apiKey: string;
|
|
855
|
+
/** Tenant identifier for multi-tenancy support */
|
|
95
856
|
tenantId: string;
|
|
857
|
+
/** Agent identifier for call management */
|
|
96
858
|
agentId: string;
|
|
859
|
+
/** Optional SDK configuration for customizing behavior */
|
|
97
860
|
sdkConfig?: SDKConfig;
|
|
98
|
-
}
|
|
99
|
-
|
|
861
|
+
}
|
|
862
|
+
/**
|
|
863
|
+
* @function initSDK
|
|
864
|
+
* @description Initializes the Call Control SDK with authentication credentials and configuration.
|
|
865
|
+
* Sets up event tracking, state management, and establishes connection to the CTI system.
|
|
866
|
+
*
|
|
867
|
+
* @declaration
|
|
868
|
+
* ```typescript
|
|
869
|
+
* function initSDK(params: InitSDKParams): Promise<void>
|
|
870
|
+
* ```
|
|
871
|
+
*
|
|
872
|
+
* @requiredParams
|
|
873
|
+
* - `params: InitSDKParams` - Object containing API key, tenant ID, agent ID, and optional config
|
|
874
|
+
*
|
|
875
|
+
* @returnType `Promise<void>`
|
|
876
|
+
*
|
|
877
|
+
* @example
|
|
878
|
+
* ```typescript
|
|
879
|
+
* // Basic initialization
|
|
880
|
+
* await initSDK({
|
|
881
|
+
* apiKey: "your-api-key",
|
|
882
|
+
* tenantId: "tenant-123",
|
|
883
|
+
* agentId: "agent-456"
|
|
884
|
+
* });
|
|
885
|
+
*
|
|
886
|
+
* // With custom configuration
|
|
887
|
+
* await initSDK({
|
|
888
|
+
* apiKey: "your-api-key",
|
|
889
|
+
* tenantId: "tenant-123",
|
|
890
|
+
* agentId: "agent-456",
|
|
891
|
+
* sdkConfig: {
|
|
892
|
+
* isDraggable: true,
|
|
893
|
+
* disableSoftPhone: false,
|
|
894
|
+
* disableEndCallButton: false
|
|
895
|
+
* }
|
|
896
|
+
* });
|
|
897
|
+
* ```
|
|
898
|
+
*
|
|
899
|
+
* @return Promise that resolves when initialization is complete
|
|
900
|
+
*
|
|
901
|
+
* @throws {Error} When API key is missing or invalid
|
|
902
|
+
* @throws {Error} When tenant ID is missing or invalid
|
|
903
|
+
* @throws {Error} When agent ID is missing or invalid
|
|
904
|
+
* @throws {Error} When initialization fails due to network or authentication issues
|
|
905
|
+
*
|
|
906
|
+
* @conclusion Critical function that must be called before using any SDK functionality.
|
|
907
|
+
*/
|
|
908
|
+
declare function initSDK({ apiKey, tenantId, agentId, sdkConfig, }: InitSDKParams): Promise<void>;
|
|
909
|
+
/**
|
|
910
|
+
* @function getSDKVersion
|
|
911
|
+
* @description Returns the current version of the Call Control SDK
|
|
912
|
+
*
|
|
913
|
+
* @declaration
|
|
914
|
+
* ```typescript
|
|
915
|
+
* function getSDKVersion(): string
|
|
916
|
+
* ```
|
|
917
|
+
*
|
|
918
|
+
* @requiredParams None
|
|
919
|
+
*
|
|
920
|
+
* @returnType `string`
|
|
921
|
+
*
|
|
922
|
+
* @example
|
|
923
|
+
* ```typescript
|
|
924
|
+
* const version = getSDKVersion();
|
|
925
|
+
* console.log(`Using Call Control SDK version: ${version}`);
|
|
926
|
+
* ```
|
|
927
|
+
*
|
|
928
|
+
* @return Current SDK version string
|
|
929
|
+
*
|
|
930
|
+
* @conclusion Utility function for version checking and debugging purposes.
|
|
931
|
+
*/
|
|
932
|
+
declare function getSDKVersion(): string;
|
|
933
|
+
/**
|
|
934
|
+
* @function isSDKInitialized
|
|
935
|
+
* @description Checks if the SDK has been successfully initialized
|
|
936
|
+
*
|
|
937
|
+
* @declaration
|
|
938
|
+
* ```typescript
|
|
939
|
+
* function isSDKInitialized(): boolean
|
|
940
|
+
* ```
|
|
941
|
+
*
|
|
942
|
+
* @requiredParams None
|
|
943
|
+
*
|
|
944
|
+
* @returnType `boolean`
|
|
945
|
+
*
|
|
946
|
+
* @example
|
|
947
|
+
* ```typescript
|
|
948
|
+
* if (isSDKInitialized()) {
|
|
949
|
+
* // SDK is ready to use
|
|
950
|
+
* console.log("SDK is initialized and ready");
|
|
951
|
+
* } else {
|
|
952
|
+
* console.log("SDK needs to be initialized first");
|
|
953
|
+
* }
|
|
954
|
+
* ```
|
|
955
|
+
*
|
|
956
|
+
* @return True if SDK is initialized, false otherwise
|
|
957
|
+
*
|
|
958
|
+
* @conclusion Utility function for checking SDK initialization status before using features.
|
|
959
|
+
*/
|
|
960
|
+
declare function isSDKInitialized(): boolean;
|
|
100
961
|
|
|
101
|
-
export { CallControlPanel, type CallControlPanelProps, type CallData, type CallStatus, initSDK, useClickToCall, useEndCall, useLogout };
|
|
962
|
+
export { CallControlPanel, type CallControlPanelProps, type CallData, type CallStatus, type ConferenceLineTypes, type RequestOptions, type RequestResult, type SDKConfig, type SDKState, type UseApiRequest, type UseDeleteRequest, type UseGetRequest, type UsePatchRequest, type UsePostRequest, type UsePutRequest, getSDKVersion, initSDK, isSDKInitialized, useClickToCall, useEndCall, useLogout };
|