react-peer-chat 0.4.0 → 0.4.1
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 +6 -7
- package/build/index.d.ts +3 -2
- package/build/index.js +7 -5
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -81,9 +81,8 @@ export default function App() {
|
|
|
81
81
|
style: { padding: '4px' }
|
|
82
82
|
}}
|
|
83
83
|
props={{ title: 'React Peer Chat Component' }}
|
|
84
|
-
onError={() =>
|
|
85
|
-
|
|
86
|
-
}}
|
|
84
|
+
onError={() => console.error('Browser not supported!')}
|
|
85
|
+
onMicError={() => console.error('Microphone not accessible!')}
|
|
87
86
|
/>
|
|
88
87
|
}
|
|
89
88
|
```
|
|
@@ -99,9 +98,8 @@ export default function App() {
|
|
|
99
98
|
name='John Doe'
|
|
100
99
|
peerId='my-unique-id'
|
|
101
100
|
remotePeerId='remote-unique-id'
|
|
102
|
-
onError={() =>
|
|
103
|
-
|
|
104
|
-
}}
|
|
101
|
+
onError={() => console.error('Browser not supported!')}
|
|
102
|
+
onMicError={() => console.error('Microphone not accessible!')}
|
|
105
103
|
>
|
|
106
104
|
{({ remotePeers, messages, addMessage, audio, setAudio }) => (
|
|
107
105
|
<YourCustomComponent>
|
|
@@ -122,7 +120,8 @@ Here is the full API for the `<Chat>` component, these properties can be set on
|
|
|
122
120
|
| `voice` | `boolean` | No | `true` | Voice chat will be enabled if this property is set to true. |
|
|
123
121
|
| `peerOptions` | [`PeerOptions`](#PeerOptions) | No | - | Options to customize peerjs Peer instance. |
|
|
124
122
|
| `dialogOptions` | [`DialogOptions`](#DialogOptions) | No | { position: 'center' } | Options to customize text dialog box styling. |
|
|
125
|
-
| `onError` | `Function` | No | `() => alert('
|
|
123
|
+
| `onError` | `Function` | No | `() => alert('Browser not supported! Try some other browser.')` | Function to be executed if browser doesn't support [WebRTC](https://webrtc.org/). |
|
|
124
|
+
| `onMicError` | `Function` | No | `() => alert('Microphone not accessible!')` | Function to be executed when microphone is not accessible. |
|
|
126
125
|
| `props` | `React.DetailedHTMLProps` | No | - | Props to customize the `<Chat>` component. |
|
|
127
126
|
| `children` | [`Children`](#Children) | No | - | Props to customize the `<Chat>` component. |
|
|
128
127
|
### Types
|
package/build/index.d.ts
CHANGED
|
@@ -32,9 +32,10 @@ export interface ChatProps {
|
|
|
32
32
|
peerOptions?: PeerOptions;
|
|
33
33
|
dialogOptions?: DialogOptions;
|
|
34
34
|
onError?: Function;
|
|
35
|
+
onMicError?: Function;
|
|
35
36
|
children?: Children;
|
|
36
37
|
props?: Props;
|
|
37
38
|
}
|
|
38
|
-
export
|
|
39
|
+
export type { IconProps } from './icons.js';
|
|
40
|
+
export default function Chat({ name, peerId, remotePeerId, peerOptions, text, voice, dialogOptions, onError, onMicError, children, props }: ChatProps): React.JSX.Element;
|
|
39
41
|
export declare const clearChat: () => void;
|
|
40
|
-
export {};
|
package/build/index.js
CHANGED
|
@@ -5,7 +5,7 @@ function closeConnection(conn) {
|
|
|
5
5
|
conn.removeAllListeners();
|
|
6
6
|
conn.close();
|
|
7
7
|
}
|
|
8
|
-
export default function Chat({ name, peerId, remotePeerId = [], peerOptions, text = true, voice = true, dialogOptions, onError = () => alert(
|
|
8
|
+
export default function Chat({ name, peerId, remotePeerId = [], peerOptions, text = true, voice = true, dialogOptions, onError = () => alert('Browser not supported! Try some other browser.'), onMicError = () => alert('Microphone not accessible!'), children, props = {} }) {
|
|
9
9
|
const [peer, setPeer] = useState();
|
|
10
10
|
const [notification, setNotification] = useState(false);
|
|
11
11
|
const [remotePeers, setRemotePeers] = useStorage('rpc-remote-peer', {}, { save: true });
|
|
@@ -53,7 +53,9 @@ export default function Chat({ name, peerId, remotePeerId = [], peerOptions, tex
|
|
|
53
53
|
return;
|
|
54
54
|
}
|
|
55
55
|
(async function () {
|
|
56
|
-
const { Peer } = await import('peerjs');
|
|
56
|
+
const { Peer, util: { supports: { audioVideo, data } } } = await import('peerjs');
|
|
57
|
+
if (!data || !audioVideo)
|
|
58
|
+
return onError();
|
|
57
59
|
const peer = new Peer(peerId, peerOptions);
|
|
58
60
|
setPeer(peer);
|
|
59
61
|
})();
|
|
@@ -91,10 +93,10 @@ export default function Chat({ name, peerId, remotePeerId = [], peerOptions, tex
|
|
|
91
93
|
call.on('close', call.removeAllListeners);
|
|
92
94
|
calls[call.peer] = call;
|
|
93
95
|
});
|
|
94
|
-
},
|
|
96
|
+
}, onMicError);
|
|
95
97
|
}
|
|
96
98
|
catch (_a) {
|
|
97
|
-
|
|
99
|
+
onMicError();
|
|
98
100
|
}
|
|
99
101
|
}
|
|
100
102
|
});
|
|
@@ -152,7 +154,7 @@ export default function Chat({ name, peerId, remotePeerId = [], peerOptions, tex
|
|
|
152
154
|
React.createElement("input", { ref: inputRef, className: 'rpc-input rpc-font', placeholder: 'Enter a message' }),
|
|
153
155
|
React.createElement("button", { type: 'submit', className: 'rpc-button' },
|
|
154
156
|
React.createElement(GrSend, { title: 'Send message' })))))),
|
|
155
|
-
voice && React.createElement("div", null, audio ? React.createElement(BsFillMicFill, { title:
|
|
157
|
+
voice && React.createElement("div", null, audio ? React.createElement(BsFillMicFill, { title: 'Turn mic off', onClick: () => setAudio(false) }) : React.createElement(BsFillMicMuteFill, { title: 'Turn mic on', onClick: () => setAudio(true) }))),
|
|
156
158
|
voice && audio && React.createElement("audio", { ref: streamRef, autoPlay: true, style: { display: 'none' } }));
|
|
157
159
|
}
|
|
158
160
|
export const clearChat = () => {
|