react-peer-chat 0.9.0 → 0.10.0

package/dist/chunks/{chunk-MBDO7IOK.js → chunk-L3CFU5IB.js}

@@ -75,14 +75,29 @@ function useChat({
     return { completePeerId: addPrefix(peerId), completeRemotePeerIds: remotePeerIds.map(addPrefix) };
   }, [peerId]);
   function handleCall(call) {
-    const id = call.peer;
-    call.on("stream", (stream) => handleRemoteStream(id, stream));
+    const peerId2 = call.peer;
+    call.on("stream", () => {
+      callsRef.current[peerId2] = call;
+      if (!audioContextRef.current) audioContextRef.current = new AudioContext();
+      if (audioContextRef.current.state === "suspended") audioContextRef.current.resume();
+      if (!mixerRef.current) {
+        mixerRef.current = audioContextRef.current.createGain();
+        mixerRef.current.connect(audioContextRef.current.destination);
+      }
+      removePeerAudio(peerId2);
+      const audio2 = new Audio();
+      audio2.srcObject = call.remoteStream;
+      audio2.autoplay = true;
+      audio2.muted = false;
+      const source = audioContextRef.current.createMediaElementSource(audio2);
+      source.connect(mixerRef.current);
+      sourceNodesRef.current[peerId2] = source;
+    });
     call.on("close", () => {
       call.removeAllListeners();
-      removePeerAudio(id);
-      delete callsRef.current[id];
+      removePeerAudio(peerId2);
+      delete callsRef.current[peerId2];
     });
-    callsRef.current[id] = call;
   }
   function handleConnection(conn) {
     connRef.current[conn.peer] = conn;
@@ -102,17 +117,6 @@ function useChat({
     setAudio(false);
     onMicError();
   }
-  function handleRemoteStream(peerId2, remoteStream) {
-    if (!audioContextRef.current) audioContextRef.current = new AudioContext();
-    if (!mixerRef.current) {
-      mixerRef.current = audioContextRef.current.createGain();
-      mixerRef.current.connect(audioContextRef.current.destination);
-    }
-    removePeerAudio(peerId2);
-    const source = audioContextRef.current.createMediaStreamSource(remoteStream);
-    source.connect(mixerRef.current);
-    sourceNodesRef.current[peerId2] = source;
-  }
   function receiveMessage(message) {
     addMessage(message);
     onMessageReceived == null ? void 0 : onMessageReceived(message);
@@ -123,9 +127,10 @@ function useChat({
     delete sourceNodesRef.current[peerId2];
   }
   function sendMessage(message) {
-    addMessage(message);
-    Object.values(connRef.current).forEach((conn) => conn.send({ type: "message", message }));
-    onMessageSent == null ? void 0 : onMessageSent(message);
+    const event = { type: "message", message: __spreadProps(__spreadValues({}, message), { name }) };
+    addMessage(event.message);
+    Object.values(connRef.current).forEach((conn) => conn.send(event));
+    onMessageSent == null ? void 0 : onMessageSent(event.message);
   }
   useEffect(() => {
     if (!text && !audio) return;
@@ -166,12 +171,9 @@ function useChat({
     const setupAudio = () => navigator.mediaDevices.getUserMedia({
       video: false,
       audio: {
-        autoGainControl: false,
-        // Disable automatic gain control
+        autoGainControl: true,
         noiseSuppression: true,
-        // Enable noise suppression
         echoCancellation: true
-        // Enable echo cancellation
       }
     }).then((stream) => {
       localStream = stream;

package/dist/chunks/{chunk-N4TBKQIR.js → chunk-OB5LLPQI.js}

@@ -1,4 +1,4 @@
-import { useChat } from './chunk-MBDO7IOK.js';
+import { useChat } from './chunk-L3CFU5IB.js';
 import { BiSolidMessageX, BiSolidMessageDetail, GrSend, BsFillMicFill, BsFillMicMuteFill } from './chunk-JJPIWKLG.js';
 import { __objRest, __spreadValues } from './chunk-LNEKYYG7.js';
 import React, { useRef, useState, useEffect } from 'react';
@@ -28,7 +28,7 @@ function Chat(_a) {
   const _a2 = useChat(__spreadValues({
     text,
     audio,
-    onMessageReceived: modifiedOnMessageReceived
+    onMessageReceived: receiveMessageHandler
   }, hookProps)), { peerId } = _a2, childrenOptions = __objRest(_a2, ["peerId"]);
   const { remotePeers, messages, sendMessage, audio: audioEnabled, setAudio } = childrenOptions;
   const containerRef = useRef(null);
@@ -36,7 +36,7 @@ function Chat(_a) {
   const dialogRef = useRef(null);
   const inputRef = useRef(null);
   const [notification, setNotification] = useState(false);
-  function modifiedOnMessageReceived(message) {
+  function receiveMessageHandler(message) {
     var _a3;
     if (!((_a3 = dialogRef.current) == null ? void 0 : _a3.open)) setNotification(true);
     onMessageReceived == null ? void 0 : onMessageReceived(message);
@@ -59,7 +59,7 @@ function Chat(_a) {
         setDialog(true);
       }
     }
-  ), notification && /* @__PURE__ */ React.createElement("span", { className: "rpc-badge" })), /* @__PURE__ */ React.createElement("dialog", { ref: dialogRef, className: `${dialog ? "rpc-dialog" : ""} rpc-position-${(dialogOptions == null ? void 0 : dialogOptions.position) || "center"}`, style: dialogOptions == null ? void 0 : dialogOptions.style }, /* @__PURE__ */ React.createElement("div", { className: "rpc-heading" }, "Chat"), /* @__PURE__ */ React.createElement("hr", { className: "rpc-hr" }), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { ref: containerRef, className: "rpc-message-container" }, messages.map(({ id, text: text2 }, i) => /* @__PURE__ */ React.createElement("div", { key: i }, /* @__PURE__ */ React.createElement("strong", null, id === peerId ? "You" : remotePeers[id], ": "), /* @__PURE__ */ React.createElement("span", null, text2)))), /* @__PURE__ */ React.createElement("hr", { className: "rpc-hr" }), /* @__PURE__ */ React.createElement(
+  ), notification && /* @__PURE__ */ React.createElement("span", { className: "rpc-badge" })), /* @__PURE__ */ React.createElement("dialog", { ref: dialogRef, className: `${dialog ? "rpc-dialog" : ""} rpc-position-${(dialogOptions == null ? void 0 : dialogOptions.position) || "center"}`, style: dialogOptions == null ? void 0 : dialogOptions.style }, /* @__PURE__ */ React.createElement("div", { className: "rpc-heading" }, "Chat"), /* @__PURE__ */ React.createElement("hr", { className: "rpc-hr" }), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { ref: containerRef, className: "rpc-message-container" }, messages.map(({ id, name, text: text2 }, i) => /* @__PURE__ */ React.createElement("div", { key: i }, /* @__PURE__ */ React.createElement("strong", null, id === peerId ? "You" : name, ": "), /* @__PURE__ */ React.createElement("span", null, text2)))), /* @__PURE__ */ React.createElement("hr", { className: "rpc-hr" }), /* @__PURE__ */ React.createElement(
     "form",
     {
       className: "rpc-input-container",

package/dist/components.js

@@ -1,5 +1,5 @@
-export { Chat as default } from './chunks/chunk-N4TBKQIR.js';
-import './chunks/chunk-MBDO7IOK.js';
+export { Chat as default } from './chunks/chunk-OB5LLPQI.js';
+import './chunks/chunk-L3CFU5IB.js';
 import './chunks/chunk-JJPIWKLG.js';
 import './chunks/chunk-ZYFPSCFE.js';
 import './chunks/chunk-LNEKYYG7.js';

package/dist/hooks.js

@@ -1,3 +1,3 @@
-export { useAudio, useChat, useMessages, useStorage } from './chunks/chunk-MBDO7IOK.js';
+export { useAudio, useChat, useMessages, useStorage } from './chunks/chunk-L3CFU5IB.js';
 import './chunks/chunk-ZYFPSCFE.js';
 import './chunks/chunk-LNEKYYG7.js';

package/dist/index.js

@@ -1,5 +1,5 @@
-export { Chat as default } from './chunks/chunk-N4TBKQIR.js';
-export { useChat } from './chunks/chunk-MBDO7IOK.js';
+export { Chat as default } from './chunks/chunk-OB5LLPQI.js';
+export { useChat } from './chunks/chunk-L3CFU5IB.js';
 import './chunks/chunk-JJPIWKLG.js';
 export { clearChat } from './chunks/chunk-ZYFPSCFE.js';
 import './chunks/chunk-LNEKYYG7.js';

package/dist/types.d.ts

@@ -4,10 +4,13 @@ import { CSSProperties, DetailedHTMLProps, HTMLAttributes, SetStateAction, React
 
 type Connection = DataConnection | MediaConnection;
 type ErrorHandler = () => void;
-type Message = {
+type InputMessage = {
     id: string;
     text: string;
 };
+type Message = InputMessage & {
+    name: string;
+};
 type MessageEventHandler = (message: Message) => void;
 
 type RemotePeerId = string | string[];
@@ -27,7 +30,7 @@ type UseChatProps = {
 type ChildrenOptions = {
     remotePeers: RemotePeers;
     messages: Message[];
-    sendMessage: (message: Message) => void;
+    sendMessage: (message: InputMessage) => void;
     audio: boolean;
     setAudio: (value: SetStateAction<boolean>) => void;
 };
@@ -49,4 +52,4 @@ type DialogPosition = "left" | "center" | "right";
 type DivProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
 type RemotePeers = Record<string, string>;
 
-export type { ChatProps, Children, ChildrenOptions, Connection, DialogOptions, DialogPosition, DivProps, ErrorHandler, IconProps, Message, MessageEventHandler, RemotePeerId, RemotePeers, UseChatProps, UseChatReturn };
+export type { ChatProps, Children, ChildrenOptions, Connection, DialogOptions, DialogPosition, DivProps, ErrorHandler, IconProps, InputMessage, Message, MessageEventHandler, RemotePeerId, RemotePeers, UseChatProps, UseChatReturn };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-peer-chat",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "description": "An easy to use react component for impleting peer-to-peer chatting.",
   "license": "MIT",
   "author": "Sahil Aggarwal <aggarwalsahil2004@gmail.com>",