voxnix 1.0.1 → 1.0.3

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 +48 -21
  2. package/dist/voxnix.js +2714 -2596
  3. package/dist/voxnix.umd.cjs +34 -31
  4. package/package.json +2 -1
package/README.md CHANGED
@@ -4,7 +4,7 @@ A React Component SDK for seamless Voice PABX Integration.
4
4
 
5
5
  ## Overview
6
6
 
7
- Voxnix is a ready-to-use SDK designed to quickly integrate voice and PABX calling features into your React applications. It provides a self-contained dialer UI and automatically handles voice engine connectivity.
7
+ Voxnix is a ready-to-use SDK designed to quickly integrate voice and PABX calling features into your React applications. It provides a self-contained dialer UI and automatically handles voice engine connectivity, including remote media stream attachment.
8
8
 
9
9
  ## Installation
10
10
 
@@ -16,43 +16,54 @@ yarn add voxnix
16
16
 
17
17
  ## Usage
18
18
 
19
- You can use the `Voxnix` component directly in your React application. Pass the required PABX configuration credentials through the `config` prop and use the event callbacks to listen for call states.
19
+ You can use the `Voxnix` component directly in your React application. Pass the required PABX configuration credentials through the `config` prop and use the event callbacks to listen for call states. You can also use a React `ref` to imperatively control the call (e.g., answer, hold, mute, hangup) from your parent component.
20
20
 
21
21
  ```jsx
22
- import React, { useState } from 'react';
23
- import { Voxnix } from 'voxnix';
22
+ import React, { useRef } from "react";
23
+ import { Voxnix } from "voxnix";
24
24
 
25
25
  const App = () => {
26
+ const voxnixRef = useRef(null);
27
+
26
28
  const pabxConfig = {
27
29
  auth: {
28
30
  username: "YOUR_USERNAME",
29
31
  password: "YOUR_PASSWORD",
30
- host: "YOUR_PABX_HOST" // e.g., sip.example.com
31
- }
32
+ host: "YOUR_PABX_HOST", // e.g., sip.example.com
33
+ },
32
34
  };
33
35
 
34
36
  const handleIncomingCall = (callData) => {
35
- console.log('Incoming call notification:', callData);
37
+ console.log("Incoming call notification:", callData);
38
+ // You can answer programmatically
39
+ // voxnixRef.current.answer();
36
40
  };
37
41
 
38
42
  const handleCallAnswered = () => {
39
- console.log('Call has been answered');
43
+ console.log("Call has been answered");
40
44
  };
41
45
 
42
46
  const handleCallEnded = () => {
43
- console.log('Call has ended');
47
+ console.log("Call has ended");
44
48
  };
45
49
 
46
50
  const handleRegisterStatus = (status) => {
47
- console.log('PABX Registration Status:', status); // "REGISTERED" | "FAILED"
51
+ console.log("PABX Registration Status:", status); // "REGISTERED" | "FAILED"
48
52
  };
49
53
 
54
+ // Example Call Controls
55
+ const toggleMute = (isMuted) => voxnixRef.current?.mute(isMuted);
56
+ const toggleHold = (isOnHold, setIsOnHold) =>
57
+ voxnixRef.current?.hold(isOnHold, setIsOnHold);
58
+ const endCall = () => voxnixRef.current?.hangup();
59
+
50
60
  return (
51
- <div style={{ padding: '20px' }}>
61
+ <div style={{ padding: "20px" }}>
52
62
  <h1>Voice Integration App</h1>
53
-
63
+
54
64
  {/* Voxnix Voice Engine & UI Component */}
55
- <Voxnix
65
+ <Voxnix
66
+ ref={voxnixRef}
56
67
  config={pabxConfig}
57
68
  onIncomingCall={handleIncomingCall}
58
69
  onCallAnswered={handleCallAnswered}
@@ -68,14 +79,30 @@ export default App;
68
79
 
69
80
  ## Component Props
70
81
 
71
- | Prop | Type | Description |
72
- |------|------|-------------|
73
- | `config` | `Object` | Configuration object containing `auth` credentials (`username`, `password`, `host`). |
74
- | `onIncomingCall` | `Function` | Callback triggered when there is an incoming call. |
75
- | `onCallAnswered` | `Function` | Callback triggered when the call is answered. |
76
- | `onCallEnded` | `Function` | Callback triggered when the call ends. |
77
- | `onCallUnanswered` | `Function` | Callback triggered when an incoming call is not answered. |
78
- | `onRegisterStatus` | `Function` | Callback triggered when the PABX registration status changes. |
82
+ | Prop | Type | Description |
83
+ | ------------------ | ---------- | ------------------------------------------------------------------------------------ |
84
+ | `config` | `Object` | Configuration object containing `auth` credentials (`username`, `password`, `host`). |
85
+ | `onIncomingCall` | `Function` | Callback triggered when there is an incoming call. |
86
+ | `onCallAnswered` | `Function` | Callback triggered when the call is answered. |
87
+ | `onCallEnded` | `Function` | Callback triggered when the call ends. |
88
+ | `onCallUnanswered` | `Function` | Callback triggered when an incoming call is not answered. |
89
+ | `onRegisterStatus` | `Function` | Callback triggered when the PABX registration status changes. |
90
+
91
+ ## Ref API (Call Controls)
92
+
93
+ You can access these methods by passing a `ref` to the `Voxnix` component:
94
+
95
+ | Method | Parameters | Description |
96
+ | ----------------------------- | ------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
97
+ | `answer()` | - | Answers an incoming call. |
98
+ | `reject()` | - | Rejects an incoming call. |
99
+ | `hangup()` | - | Ends the current active call. |
100
+ | `mute(isMuted)` | `isMuted: boolean` | Mutes or unmutes the local microphone. |
101
+ | `hold(isOnHold, setIsOnHold)` | `isOnHold: boolean, setIsOnHold: function` | Puts the call on hold or resumes it. Passes `setIsOnHold` to allow the SDK to asynchronously update the parent UI state when the re-INVITE succeeds. |
102
+
103
+ ## Media Handling
104
+
105
+ Voxnix handles remote media setup automatically. When a call state becomes `Established`, Voxnix will attach the incoming audio stream to an invisible `<audio id="voxnix-remote-audio" />` element. When the call is terminated, the media is safely cleaned up.
79
106
 
80
107
  ## Development
81
108