@dora-cell/sdk-react 4.1.2 → 4.1.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.
- package/README.md +42 -2
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -81,8 +81,17 @@ A slide-over interface that handles the entire call lifecycle (Ringing, Connecti
|
|
|
81
81
|
> [!TIP]
|
|
82
82
|
> This component handles audio playback (remote stream and ringtones) automatically. You just need to ensure it's rendered in your tree when a call is active.
|
|
83
83
|
|
|
84
|
+
#### Props
|
|
85
|
+
|
|
86
|
+
- `isOpen?: boolean` - Controls if the interface is visible.
|
|
87
|
+
- `onOpenChange?: (open: boolean) => void` - Callback when the interface requests to open/close.
|
|
88
|
+
- `onCallEnded?: () => void` - Callback fired when a call ends.
|
|
89
|
+
- `maximizeIcon?: React.ReactNode` - Custom icon for the maximize button.
|
|
90
|
+
- `minimizeIcon?: React.ReactNode` - Custom icon for the minimize button.
|
|
91
|
+
|
|
84
92
|
```tsx
|
|
85
93
|
import { CallInterface } from "@dora-cell/sdk-react";
|
|
94
|
+
import { Maximize, Minimize2 } from "lucide-react";
|
|
86
95
|
|
|
87
96
|
function Dashboard() {
|
|
88
97
|
const [isOpen, setIsOpen] = useState(false);
|
|
@@ -93,7 +102,13 @@ function Dashboard() {
|
|
|
93
102
|
This should be rendered globally (e.g., in your root layout)
|
|
94
103
|
to handle incoming calls even when the dialer is closed.
|
|
95
104
|
*/}
|
|
96
|
-
<CallInterface
|
|
105
|
+
<CallInterface
|
|
106
|
+
isOpen={isOpen}
|
|
107
|
+
onOpenChange={setIsOpen}
|
|
108
|
+
onCallEnded={() => console.log('Call ended')}
|
|
109
|
+
maximizeIcon={<Maximize size={18} />}
|
|
110
|
+
minimizeIcon={<Minimize2 size={16} />}
|
|
111
|
+
/>
|
|
97
112
|
</>
|
|
98
113
|
);
|
|
99
114
|
}
|
|
@@ -101,7 +116,32 @@ function Dashboard() {
|
|
|
101
116
|
|
|
102
117
|
### `Dialpad`
|
|
103
118
|
|
|
104
|
-
A flexible keypad for entering numbers and initiating calls. It automatically fetches available Caller IDs (extensions) and allows switching between them.
|
|
119
|
+
A flexible keypad for entering numbers and initiating calls. It automatically fetches available Caller IDs (extensions) and allows switching between them. If you prefer to manage the extensions in your own state, you can pass them as props.
|
|
120
|
+
|
|
121
|
+
#### Props
|
|
122
|
+
|
|
123
|
+
- `initialNumber?: string` - Pre-fill the dialpad input.
|
|
124
|
+
- `showKeys?: boolean` - Whether to show the numeric keypad by default (default: `true`).
|
|
125
|
+
- `className?: string` - Custom CSS classes for styling.
|
|
126
|
+
- `availableExtensions?: Array<{ label: string; value: string }>` - Override the automatically fetched caller IDs.
|
|
127
|
+
- `selectedExtension?: string` - Manually select the active caller ID.
|
|
128
|
+
- `onExtensionChange?: (ext: string) => void` - Callback fired when the user selects a different caller ID.
|
|
129
|
+
- `onCallInitiated?: (number: string) => void` - Callback fired right after a call starts.
|
|
130
|
+
|
|
131
|
+
```tsx
|
|
132
|
+
import { Dialpad } from "@dora-cell/sdk-react";
|
|
133
|
+
|
|
134
|
+
function Dialer() {
|
|
135
|
+
return (
|
|
136
|
+
<Dialpad
|
|
137
|
+
initialNumber="+2348000000000"
|
|
138
|
+
showKeys={true}
|
|
139
|
+
className="my-custom-class"
|
|
140
|
+
onCallInitiated={(number) => console.log('Calling', number)}
|
|
141
|
+
/>
|
|
142
|
+
);
|
|
143
|
+
}
|
|
144
|
+
```
|
|
105
145
|
|
|
106
146
|
### `CreditBalance`
|
|
107
147
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dora-cell/sdk-react",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.3",
|
|
4
4
|
"description": "React bindings for Dora Cell SDK — includes self-contained, prefixed CSS",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"author": "Dora Cell",
|
|
40
40
|
"license": "MIT",
|
|
41
41
|
"peerDependencies": {
|
|
42
|
-
"@dora-cell/sdk": "^4.1.
|
|
42
|
+
"@dora-cell/sdk": "^4.1.3",
|
|
43
43
|
"react": "^18.0.0 || ^19.0.0",
|
|
44
44
|
"react-dom": "^18.0.0 || ^19.0.0"
|
|
45
45
|
},
|