react-peer-chat 0.1.2 → 0.1.3

package/build/icons.js

@@ -0,0 +1,13 @@
+import React from "react";
+export function BsFillMicFill(props) {
+    return React.createElement("span", Object.assign({}, props),
+        React.createElement("svg", { fill: "currentColor", width: '16px', height: '16px' },
+            React.createElement("path", { d: "M5 3a3 3 0 0 1 6 0v5a3 3 0 0 1-6 0V3z" }),
+            React.createElement("path", { d: "M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z" })));
+}
+export function BsFillMicMuteFill(props) {
+    return React.createElement("span", Object.assign({}, props),
+        React.createElement("svg", { fill: "currentColor", width: '16px', height: '16px' },
+            React.createElement("path", { d: "M13 8c0 .564-.094 1.107-.266 1.613l-.814-.814A4.02 4.02 0 0 0 12 8V7a.5.5 0 0 1 1 0v1zm-5 4c.818 0 1.578-.245 2.212-.667l.718.719a4.973 4.973 0 0 1-2.43.923V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 1 0v1a4 4 0 0 0 4 4zm3-9v4.879L5.158 2.037A3.001 3.001 0 0 1 11 3z" }),
+            React.createElement("path", { d: "M9.486 10.607 5 6.12V8a3 3 0 0 0 4.486 2.607zm-7.84-9.253 12 12 .708-.708-12-12-.708.708z" })));
+}

package/build/index.js

@@ -0,0 +1,49 @@
+import React, { useEffect, useRef } from 'react';
+import useStorage from './useStorage';
+import { BsFillMicFill, BsFillMicMuteFill } from './icons';
+export default function Chat({ peerId, remotePeerId, peerOptions, onError = () => console.error("Can not access microphone!") }) {
+    const [audio, setAudio] = useStorage('rpc-audio', false, { local: true, save: true });
+    const streamRef = useRef(null);
+    const localStream = useRef();
+    const handleRemoteStream = (remoteStream) => streamRef.current.srcObject = remoteStream;
+    useEffect(() => {
+        if (!audio)
+            return;
+        const Peer = require('peerjs').default;
+        const peer = new Peer(`rpc-${peerId}`, peerOptions);
+        let call;
+        peer.on('open', () => {
+            const getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
+            getUserMedia({
+                video: false,
+                audio: {
+                    autoGainControl: false,
+                    noiseSuppression: true,
+                    echoCancellation: true
+                }
+            }, (stream) => {
+                localStream.current = stream;
+                call = peer.call(`rpc-${remotePeerId}`, stream);
+                call.on('stream', handleRemoteStream);
+                call.on('close', call.removeAllListeners);
+                peer.on('call', (e) => {
+                    call = e;
+                    call.answer(stream);
+                    call.on('stream', handleRemoteStream);
+                    call.on('close', call.removeAllListeners);
+                });
+            }, onError);
+        });
+        return () => {
+            var _a;
+            (_a = localStream.current) === null || _a === void 0 ? void 0 : _a.getTracks().forEach(track => track.stop());
+            call === null || call === void 0 ? void 0 : call.removeAllListeners();
+            call === null || call === void 0 ? void 0 : call.close();
+            peer.removeAllListeners();
+            peer.destroy();
+        };
+    }, [audio]);
+    return React.createElement("button", { onClick: () => setAudio(audio => !audio) }, audio ? React.createElement(React.Fragment, null,
+        React.createElement("audio", { ref: streamRef, autoPlay: true, className: 'hidden' }),
+        React.createElement(BsFillMicFill, { title: "Turn mic off" })) : React.createElement(BsFillMicMuteFill, { title: "Turn mic on" }));
+}

package/build/useStorage.js

@@ -0,0 +1,37 @@
+import { useState } from "react";
+const setStorage = (key, value, local = false) => (local ? localStorage : sessionStorage).setItem(key, JSON.stringify(value));
+const removeStorage = (key, local = false) => (local ? localStorage : sessionStorage).removeItem(key);
+const getStorage = (key, fallbackValue, local = false) => {
+    if (typeof window === "undefined")
+        return fallbackValue;
+    let value = (local ? localStorage : sessionStorage).getItem(key);
+    try {
+        if (!value)
+            throw new Error("Value doesn't exist");
+        value = JSON.parse(value);
+    }
+    catch (_a) {
+        if (fallbackValue !== undefined) {
+            value = fallbackValue;
+            setStorage(key, value, local);
+        }
+        else {
+            value = null;
+            removeStorage(key, local);
+        }
+    }
+    return value;
+};
+export default function useStorage(key, initialValue, { local = false, save = false } = {}) {
+    save || (save = getStorage('mode') !== 'online');
+    const [storedValue, setStoredValue] = useState(save ? getStorage(key, initialValue, local) : initialValue);
+    const setValue = (value) => {
+        setStoredValue((old) => {
+            const updatedValue = typeof value === 'function' ? value(old) : value;
+            if (save)
+                setStorage(key, updatedValue, local);
+            return updatedValue;
+        });
+    };
+    return [storedValue, setValue];
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-peer-chat",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "An easy to use react component for impleting peer-to-peer chatting.",
   "main": "./build/index.js",
   "module": "./build/index.js",
@@ -33,6 +33,7 @@
     "react-dom": ">=16.0.0"
   },
   "devDependencies": {
+    "@types/node": "^20.5.9",
     "@types/react": "^18.2.21"
   },
   "dependencies": {

package/build/icons.jsx

@@ -1,17 +0,0 @@
-import React from "react";
-export function BsFillMicFill(props) {
-    return <span {...props}>
-        <svg fill="currentColor" viewBox="0 0 16 16">
-            <path d="M5 3a3 3 0 0 1 6 0v5a3 3 0 0 1-6 0V3z"/>
-            <path d="M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z"/>
-        </svg>
-    </span>;
-}
-export function BsFillMicMuteFill(props) {
-    return <span {...props}>
-        <svg fill="currentColor" viewBox="0 0 16 16">
-            <path d="M13 8c0 .564-.094 1.107-.266 1.613l-.814-.814A4.02 4.02 0 0 0 12 8V7a.5.5 0 0 1 1 0v1zm-5 4c.818 0 1.578-.245 2.212-.667l.718.719a4.973 4.973 0 0 1-2.43.923V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 1 0v1a4 4 0 0 0 4 4zm3-9v4.879L5.158 2.037A3.001 3.001 0 0 1 11 3z"/>
-            <path d="M9.486 10.607 5 6.12V8a3 3 0 0 0 4.486 2.607zm-7.84-9.253 12 12 .708-.708-12-12-.708.708z"/>
-        </svg>
-    </span>;
-}

package/build/index.jsx

@@ -1,53 +0,0 @@
-import React, { useEffect, useRef } from 'react';
-import Peer from 'peerjs';
-import useStorage from './useStorage';
-import { BsFillMicFill, BsFillMicMuteFill } from './icons';
-export default function Chat(_a) {
-    var peerId = _a.peerId, remotePeerId = _a.remotePeerId, peerOptions = _a.peerOptions, _b = _a.onError, onError = _b === void 0 ? function () { return console.error("Can not access microphone!"); } : _b;
-    var _c = useStorage('rpc-audio', false, { local: true, save: true }), audio = _c[0], setAudio = _c[1];
-    var streamRef = useRef(null);
-    var localStream = useRef();
-    var handleRemoteStream = function (remoteStream) { return streamRef.current.srcObject = remoteStream; };
-    useEffect(function () {
-        if (!audio)
-            return;
-        var peer = new Peer("rpc-".concat(peerId), peerOptions);
-        var call;
-        peer.on('open', function () {
-            var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
-            getUserMedia({
-                video: false,
-                audio: {
-                    autoGainControl: false,
-                    noiseSuppression: true,
-                    echoCancellation: true
-                }
-            }, function (stream) {
-                localStream.current = stream;
-                call = peer.call("rpc-".concat(remotePeerId), stream);
-                call.on('stream', handleRemoteStream);
-                call.on('close', call.removeAllListeners);
-                peer.on('call', function (e) {
-                    call = e;
-                    call.answer(stream);
-                    call.on('stream', handleRemoteStream);
-                    call.on('close', call.removeAllListeners);
-                });
-            }, onError);
-        });
-        return function () {
-            var _a;
-            (_a = localStream.current) === null || _a === void 0 ? void 0 : _a.getTracks().forEach(function (track) { return track.stop(); });
-            call === null || call === void 0 ? void 0 : call.removeAllListeners();
-            call === null || call === void 0 ? void 0 : call.close();
-            peer.removeAllListeners();
-            peer.destroy();
-        };
-    }, [audio]);
-    return <button onClick={function () { return setAudio(function (audio) { return !audio; }); }}>
-        {audio ? <>
-            <audio ref={streamRef} autoPlay className='hidden'/>
-            <BsFillMicFill title="Turn mic off"/>
-        </> : <BsFillMicMuteFill title="Turn mic on"/>}
-    </button>;
-}

package/build/useStorage.jsx

@@ -1,45 +0,0 @@
-import { useState } from "react";
-var setStorage = function (key, value, local) {
-    if (local === void 0) { local = false; }
-    return (local ? localStorage : sessionStorage).setItem(key, JSON.stringify(value));
-};
-var removeStorage = function (key, local) {
-    if (local === void 0) { local = false; }
-    return (local ? localStorage : sessionStorage).removeItem(key);
-};
-var getStorage = function (key, fallbackValue, local) {
-    if (local === void 0) { local = false; }
-    if (typeof window === "undefined")
-        return fallbackValue;
-    var value = (local ? localStorage : sessionStorage).getItem(key);
-    try {
-        if (!value)
-            throw new Error("Value doesn't exist");
-        value = JSON.parse(value);
-    }
-    catch (_a) {
-        if (fallbackValue !== undefined) {
-            value = fallbackValue;
-            setStorage(key, value, local);
-        }
-        else {
-            value = null;
-            removeStorage(key, local);
-        }
-    }
-    return value;
-};
-export default function useStorage(key, initialValue, _a) {
-    var _b = _a === void 0 ? {} : _a, _c = _b.local, local = _c === void 0 ? false : _c, _d = _b.save, save = _d === void 0 ? false : _d;
-    save || (save = getStorage('mode') !== 'online');
-    var _e = useState(save ? getStorage(key, initialValue, local) : initialValue), storedValue = _e[0], setStoredValue = _e[1];
-    var setValue = function (value) {
-        setStoredValue(function (old) {
-            var updatedValue = typeof value === 'function' ? value(old) : value;
-            if (save)
-                setStorage(key, updatedValue, local);
-            return updatedValue;
-        });
-    };
-    return [storedValue, setValue];
-}