react-realtime-hooks 1.2.1 → 1.2.2

package/dist/index.d.ts

@@ -263,4 +263,15 @@ type UseEventSourceHook = <TMessage = unknown>(options: UseEventSourceOptions<TM
 
 declare const useEventSource: UseEventSourceHook;
 
-export { type ConnectionGateReason, type ConnectionStateSnapshot, type HeartbeatAckMatcher, type HeartbeatBeatFn, type MessageParser, type MessageSerializer, type Milliseconds, type RealtimeConnectionStatus, type RealtimeTransport, type ReconnectAttempt, type ReconnectDelayContext, type ReconnectDelayStrategy, type ReconnectStatus, type ReconnectTrigger, type UrlProvider, type UseConnectionGateHook, type UseConnectionGateOptions, type UseConnectionGateResult, type UseEventSourceHook, type UseEventSourceOptions, type UseEventSourceResult, type UseHeartbeatHook, type UseHeartbeatOptions, type UseHeartbeatResult, type UseOnlineStatusHook, type UseOnlineStatusOptions, type UseOnlineStatusResult, type UsePageVisibilityHook, type UsePageVisibilityOptions, type UsePageVisibilityResult, type UseReconnectHook, type UseReconnectOptions, type UseReconnectResult, type UseWebSocketHeartbeatOptions, type UseWebSocketHook, type UseWebSocketOptions, type UseWebSocketResult, type WebSocketHeartbeatAction, useConnectionGate, useEventSource, useHeartbeat, useOnlineStatus, usePageVisibility, useReconnect, useWebSocket };
+type RealtimeErrorKind = "heartbeat-error" | "heartbeat-timeout" | "parse-error";
+interface RealtimeErrorEventInit extends EventInit {
+    cause?: unknown;
+    kind: RealtimeErrorKind;
+}
+declare class RealtimeErrorEvent extends Event {
+    readonly cause: unknown;
+    readonly kind: RealtimeErrorKind;
+    constructor(type: string, init: RealtimeErrorEventInit);
+}
+
+export { type ConnectionGateReason, type ConnectionStateSnapshot, type HeartbeatAckMatcher, type HeartbeatBeatFn, type MessageParser, type MessageSerializer, type Milliseconds, type RealtimeConnectionStatus, RealtimeErrorEvent, type RealtimeErrorEventInit, type RealtimeErrorKind, type RealtimeTransport, type ReconnectAttempt, type ReconnectDelayContext, type ReconnectDelayStrategy, type ReconnectStatus, type ReconnectTrigger, type UrlProvider, type UseConnectionGateHook, type UseConnectionGateOptions, type UseConnectionGateResult, type UseEventSourceHook, type UseEventSourceOptions, type UseEventSourceResult, type UseHeartbeatHook, type UseHeartbeatOptions, type UseHeartbeatResult, type UseOnlineStatusHook, type UseOnlineStatusOptions, type UseOnlineStatusResult, type UsePageVisibilityHook, type UsePageVisibilityOptions, type UsePageVisibilityResult, type UseReconnectHook, type UseReconnectOptions, type UseReconnectResult, type UseWebSocketHeartbeatOptions, type UseWebSocketHook, type UseWebSocketOptions, type UseWebSocketResult, type WebSocketHeartbeatAction, useConnectionGate, useEventSource, useHeartbeat, useOnlineStatus, usePageVisibility, useReconnect, useWebSocket };

package/dist/index.js

@@ -1,4 +1,4 @@
-import { useSyncExternalStore, useRef, useState, useEffect, useEffectEvent, useMemo, startTransition } from 'react';
+import { useSyncExternalStore, useRef, useState, useEffect, useMemo, startTransition, useCallback } from 'react';
 
 // src/hooks/useOnlineStatus.ts
 
@@ -442,6 +442,11 @@ var createReconnectAttempt = (attempt, trigger, options, lastDelayMs, config = {
     trigger
   };
 };
+var useStableCallback = (callback) => {
+  const callbackRef = useRef(callback);
+  callbackRef.current = callback;
+  return useCallback((...args) => callbackRef.current(...args), []);
+};
 
 // src/hooks/useReconnect.ts
 var createInitialState = (enabled) => ({
@@ -465,20 +470,20 @@ var useReconnect = (options = {}) => {
       setState(resolved);
     });
   };
-  const runAttempt = useEffectEvent((attempt) => {
+  const runAttempt = useStableCallback((attempt) => {
     commitState({
       attempt,
       nextDelayMs: null,
       status: "running"
     });
   });
-  const emitSchedule = useEffectEvent((attempt) => {
+  const emitSchedule = useStableCallback((attempt) => {
     normalizedOptions.onSchedule?.(attempt);
   });
-  const emitCancel = useEffectEvent(() => {
+  const emitCancel = useStableCallback(() => {
     normalizedOptions.onCancel?.();
   });
-  const emitReset = useEffectEvent(() => {
+  const emitReset = useStableCallback(() => {
     normalizedOptions.onReset?.();
   });
   useEffect(() => {
@@ -501,7 +506,7 @@ var useReconnect = (options = {}) => {
   useEffect(() => () => {
     timeoutRef.current.cancel();
   }, []);
-  const schedule = (trigger = "manual") => {
+  const schedule = useStableCallback((trigger = "manual") => {
     const current = stateRef.current;
     const nextAttempt = current.attempt + 1;
     const attempt = createReconnectAttempt(
@@ -529,8 +534,8 @@ var useReconnect = (options = {}) => {
       status: "scheduled"
     });
     emitSchedule(attempt);
-  };
-  const cancel = () => {
+  });
+  const cancel = useStableCallback(() => {
     const current = stateRef.current;
     const shouldEmitCancel = timeoutRef.current.isActive() || current.status === "scheduled" || current.status === "running";
     timeoutRef.current.cancel();
@@ -542,14 +547,14 @@ var useReconnect = (options = {}) => {
     if (shouldEmitCancel) {
       emitCancel();
     }
-  };
-  const reset = () => {
+  });
+  const reset = useStableCallback(() => {
     timeoutRef.current.cancel();
     lastDelayRef.current = null;
     commitState(createInitialState(normalizedOptions.enabled));
     emitReset();
-  };
-  const markConnected = () => {
+  });
+  const markConnected = useStableCallback(() => {
     timeoutRef.current.cancel();
     if (normalizedOptions.resetOnSuccess) {
       lastDelayRef.current = null;
@@ -562,7 +567,7 @@ var useReconnect = (options = {}) => {
       nextDelayMs: null,
       status: normalizedOptions.enabled ? "idle" : "stopped"
     }));
-  };
+  });
   return {
     attempt: state.attempt,
     cancel,
@@ -598,14 +603,14 @@ var useHeartbeat = (options) => {
     stateRef.current = resolved;
     setState(resolved);
   };
-  const handleTimeout = useEffectEvent(() => {
+  const handleTimeout = useStableCallback(() => {
     commitState((current) => ({
       ...current,
       hasTimedOut: true
     }));
     options.onTimeout?.();
   });
-  const scheduleTimeout = useEffectEvent(() => {
+  const scheduleTimeout = useStableCallback(() => {
     if (options.timeoutMs === void 0) {
       timeoutRef.current.cancel();
       return;
@@ -614,7 +619,7 @@ var useHeartbeat = (options) => {
       handleTimeout();
     }, options.timeoutMs);
   });
-  const handleBeatSuccess = useEffectEvent((performedAt) => {
+  const handleBeatSuccess = useStableCallback((performedAt) => {
     commitState((current) => ({
       ...current,
       hasTimedOut: false,
@@ -623,11 +628,11 @@ var useHeartbeat = (options) => {
     scheduleTimeout();
     options.onBeat?.();
   });
-  const handleBeatError = useEffectEvent((error) => {
+  const handleBeatError = useStableCallback((error) => {
     timeoutRef.current.cancel();
     options.onError?.(error);
   });
-  const runBeat = useEffectEvent(() => {
+  const runBeat = useStableCallback(() => {
     const generation = generationRef.current;
     const completeBeat = (result) => {
       if (generation !== generationRef.current || result === false) {
@@ -652,7 +657,7 @@ var useHeartbeat = (options) => {
       failBeat(error);
     }
   });
-  const start = () => {
+  const start = useStableCallback(() => {
     if (!enabled) {
       return;
     }
@@ -666,20 +671,20 @@ var useHeartbeat = (options) => {
       hasTimedOut: false,
       isRunning: true
     }));
-  };
-  const stop = () => {
+  });
+  const stop = useStableCallback(() => {
     generationRef.current += 1;
     intervalRef.current.cancel();
     timeoutRef.current.cancel();
     commitState(createInitialState2(false));
-  };
-  const beat = () => {
+  });
+  const beat = useStableCallback(() => {
     if (!enabled) {
       return;
     }
     runBeat();
-  };
-  const notifyAck = (message) => {
+  });
+  const notifyAck = useStableCallback((message) => {
     if (stateRef.current.lastBeatAt === null) {
       return false;
     }
@@ -696,7 +701,7 @@ var useHeartbeat = (options) => {
       latencyMs: current.lastBeatAt === null ? null : acknowledgedAt - current.lastBeatAt
     }));
     return true;
-  };
+  });
   useEffect(() => {
     if (!enabled) {
       stop();
@@ -708,7 +713,7 @@ var useHeartbeat = (options) => {
     }
     stop();
     return void 0;
-  }, [enabled, options.intervalMs, startOnMount]);
+  }, [enabled, options.intervalMs, start, startOnMount, stop]);
   useEffect(() => () => {
     generationRef.current += 1;
     intervalRef.current.cancel();
@@ -772,6 +777,17 @@ var createConnectionStateSnapshot = (status, config = {}) => {
   }
 };
 
+// src/core/errors.ts
+var RealtimeErrorEvent = class extends Event {
+  cause;
+  kind;
+  constructor(type, init) {
+    super(type, init);
+    this.cause = init.cause;
+    this.kind = init.kind;
+  }
+};
+
 // src/core/url.ts
 var normalizeResolvedUrl = (value) => {
   if (value === null) {
@@ -813,8 +829,9 @@ var toProtocolsDependency = (protocols) => {
   if (protocols === void 0) {
     return "";
   }
-  return Array.isArray(protocols) ? protocols.join("|") : protocols;
+  return JSON.stringify(protocols);
 };
+var parseProtocolsDependency = (protocolsDependency) => protocolsDependency === "" ? void 0 : JSON.parse(protocolsDependency);
 var toHeartbeatConfig = (heartbeat) => heartbeat === void 0 || heartbeat === false ? null : heartbeat;
 var isSocketActive = (socket) => socket.readyState === WebSocket.OPEN || socket.readyState === WebSocket.CONNECTING;
 var useWebSocket = (options) => {
@@ -822,6 +839,10 @@ var useWebSocket = (options) => {
   const supported = isWebSocketSupported();
   const resolvedUrl = useMemo(() => resolveUrlProvider(options.url), [options.url]);
   const protocolsDependency = toProtocolsDependency(options.protocols);
+  const protocols = useMemo(
+    () => parseProtocolsDependency(protocolsDependency),
+    [protocolsDependency]
+  );
   const socketRef = useRef(null);
   const socketKeyRef = useRef(null);
   const activeSocketEpochRef = useRef(null);
@@ -891,14 +912,19 @@ var useWebSocket = (options) => {
     heartbeatHookOptions.onTimeout = () => {
       applyHeartbeatAction(
         heartbeatConfig.timeoutAction ?? defaultHeartbeatAction,
-        new Event("heartbeat-timeout"),
+        new RealtimeErrorEvent("heartbeat-timeout", {
+          kind: "heartbeat-timeout"
+        }),
         "heartbeat-timeout"
       );
       onTimeout?.();
     };
     const onError = heartbeatConfig.onError;
     heartbeatHookOptions.onError = (error) => {
-      const event = error instanceof Event ? error : new Event("heartbeat-error");
+      const event = new RealtimeErrorEvent("heartbeat-error", {
+        cause: error,
+        kind: "heartbeat-error"
+      });
       applyHeartbeatAction(
         heartbeatConfig.errorAction ?? heartbeatConfig.timeoutAction ?? defaultHeartbeatAction,
         event,
@@ -910,18 +936,18 @@ var useWebSocket = (options) => {
   const heartbeat = useHeartbeat(
     heartbeatHookOptions
   );
-  const commitState = (next) => {
+  const commitState = useStableCallback((next) => {
     const resolved = typeof next === "function" ? next(stateRef.current) : next;
     stateRef.current = resolved;
     setState(resolved);
-  };
-  const isActiveSocketEvent = useEffectEvent((socketEpoch) => {
+  });
+  const isActiveSocketEvent = useStableCallback((socketEpoch) => {
     return activeSocketEpochRef.current === socketEpoch;
   });
-  const shouldHandleSocketClose = useEffectEvent((socketEpoch) => {
+  const shouldHandleSocketClose = useStableCallback((socketEpoch) => {
     return activeSocketEpochRef.current === socketEpoch || closingSocketEpochRef.current === socketEpoch;
   });
-  const closeSocket = useEffectEvent(
+  const closeSocket = useStableCallback(
     (config = {}) => {
       const socket2 = socketRef.current;
       const socketEpoch = activeSocketEpochRef.current;
@@ -937,7 +963,7 @@ var useWebSocket = (options) => {
       }
     }
   );
-  const applyHeartbeatAction = useEffectEvent(
+  const applyHeartbeatAction = useStableCallback(
     (action, error, reconnectTrigger) => {
       heartbeat.stop();
       options.onError?.(error);
@@ -974,17 +1000,17 @@ var useWebSocket = (options) => {
       closeSocket({ trackClose: true });
     }
   );
-  const parseMessage = useEffectEvent((event) => {
+  const parseMessage = useStableCallback((event) => {
     const parser = options.parseMessage ?? defaultParseMessage;
     return parser(event);
   });
-  const updateBufferedAmount = useEffectEvent(() => {
+  const updateBufferedAmount = useStableCallback(() => {
     commitState((current) => ({
       ...current,
       bufferedAmount: socketRef.current?.bufferedAmount ?? 0
     }));
   });
-  const handleOpen = useEffectEvent((event, socket2) => {
+  const handleOpen = useStableCallback((event, socket2) => {
     manualCloseRef.current = false;
     manualOpenRef.current = false;
     suppressReconnectRef.current = false;
@@ -999,7 +1025,7 @@ var useWebSocket = (options) => {
     }));
     options.onOpen?.(event, socket2);
   });
-  const handleMessage = useEffectEvent((event) => {
+  const handleMessage = useStableCallback((event) => {
     try {
       const message = parseMessage(event);
       heartbeat.notifyAck(message);
@@ -1010,8 +1036,11 @@ var useWebSocket = (options) => {
         lastMessageEvent: event
       }));
       options.onMessage?.(message, event);
-    } catch {
-      const parseError = new Event("error");
+    } catch (error) {
+      const parseError = new RealtimeErrorEvent("error", {
+        cause: error,
+        kind: "parse-error"
+      });
       terminalErrorRef.current = parseError;
       manualOpenRef.current = false;
       skipCloseReconnectRef.current = true;
@@ -1032,7 +1061,7 @@ var useWebSocket = (options) => {
       });
     }
   });
-  const handleError = useEffectEvent((event, socketEpoch) => {
+  const handleError = useStableCallback((event, socketEpoch) => {
     if (!isActiveSocketEvent(socketEpoch)) {
       return;
     }
@@ -1045,7 +1074,7 @@ var useWebSocket = (options) => {
     }));
     options.onError?.(event);
   });
-  const handleClose = useEffectEvent((event, socketEpoch) => {
+  const handleClose = useStableCallback((event, socketEpoch) => {
     if (!shouldHandleSocketClose(socketEpoch)) {
       return;
     }
@@ -1105,15 +1134,15 @@ var useWebSocket = (options) => {
       suppressReconnectRef.current = false;
     }
   });
-  const open = () => {
+  const open = useStableCallback(() => {
     manualCloseRef.current = false;
     manualOpenRef.current = true;
     suppressReconnectRef.current = false;
     terminalErrorRef.current = null;
     reconnect.cancel();
     setOpenNonce((current) => current + 1);
-  };
-  const reconnectNow = () => {
+  });
+  const reconnectNow = useStableCallback(() => {
     manualCloseRef.current = false;
     manualOpenRef.current = true;
     skipCloseReconnectRef.current = true;
@@ -1123,8 +1152,8 @@ var useWebSocket = (options) => {
     closeSocket();
     suppressReconnectRef.current = false;
     reconnect.schedule("manual");
-  };
-  const close = (code, reason) => {
+  });
+  const close = useStableCallback((code, reason) => {
     manualCloseRef.current = true;
     manualOpenRef.current = false;
     suppressReconnectRef.current = true;
@@ -1141,8 +1170,8 @@ var useWebSocket = (options) => {
       reason,
       trackClose: true
     });
-  };
-  const send = (message) => {
+  });
+  const send = useStableCallback((message) => {
     const socket2 = socketRef.current;
     if (socket2 === null || socket2.readyState !== WebSocket.OPEN) {
       return false;
@@ -1151,7 +1180,7 @@ var useWebSocket = (options) => {
     socket2.send(serializer(message));
     updateBufferedAmount();
     return true;
-  };
+  });
   useEffect(() => {
     if (!supported) {
       socketKeyRef.current = null;
@@ -1191,7 +1220,7 @@ var useWebSocket = (options) => {
     if (socketRef.current !== null) {
       return;
     }
-    const socket2 = new WebSocket(resolvedUrl, options.protocols);
+    const socket2 = new WebSocket(resolvedUrl, protocols);
     const socketEpoch = nextSocketEpochRef.current + 1;
     socketRef.current = socket2;
     socketKeyRef.current = nextSocketKey;
@@ -1234,9 +1263,17 @@ var useWebSocket = (options) => {
       socket2.removeEventListener("close", handleSocketClose);
     };
   }, [
+    closeSocket,
+    commitState,
     connect,
+    handleClose,
+    handleError,
+    handleMessage,
+    handleOpen,
+    isActiveSocketEvent,
     openNonce,
     options.binaryType,
+    protocols,
     protocolsDependency,
     reconnect.status,
     resolvedUrl,
@@ -1257,11 +1294,12 @@ var useWebSocket = (options) => {
       socket2.close();
     }
   }, []);
+  const stopHeartbeat = heartbeat.stop;
   useEffect(() => {
     if (state.status !== "open") {
-      heartbeat.stop();
+      stopHeartbeat();
     }
-  }, [state.status]);
+  }, [state.status, stopHeartbeat]);
   const status = (reconnect.status === "scheduled" || reconnect.status === "running") && state.status !== "open" ? "reconnecting" : state.status;
   const snapshot = createConnectionStateSnapshot(status, {
     isSupported: supported,
@@ -1317,29 +1355,27 @@ var createInitialState4 = (status = "idle") => ({
   status
 });
 var defaultParseMessage2 = (event) => event.data;
-var toEventsDependency = (events) => {
-  if (events === void 0 || events.length === 0) {
-    return "";
-  }
-  return [...new Set(events)].sort().join("|");
-};
 var normalizeNamedEvents = (events) => {
   if (events === void 0 || events.length === 0) {
     return [];
   }
-  return [...new Set(events)].filter((eventName) => eventName !== "message");
+  return [...new Set(events)].filter((eventName) => eventName !== "message").sort();
 };
+var toEventsDependency = (events) => JSON.stringify(normalizeNamedEvents(events));
+var parseEventsDependency = (eventsDependency) => JSON.parse(eventsDependency);
 var useEventSource = (options) => {
   const connect = options.connect ?? true;
   const supported = isEventSourceSupported();
   const resolvedUrl = useMemo(() => resolveUrlProvider(options.url), [options.url]);
   const eventsDependency = toEventsDependency(options.events);
   const namedEvents = useMemo(
-    () => normalizeNamedEvents(options.events),
+    () => parseEventsDependency(eventsDependency),
     [eventsDependency]
   );
   const eventSourceRef = useRef(null);
   const eventSourceKeyRef = useRef(null);
+  const activeEventSourceEpochRef = useRef(null);
+  const nextEventSourceEpochRef = useRef(0);
   const manualCloseRef = useRef(false);
   const manualOpenRef = useRef(false);
   const skipErrorReconnectRef = useRef(false);
@@ -1358,25 +1394,29 @@ var useEventSource = (options) => {
       enabled: reconnectEnabled && (options.reconnect?.enabled ?? true)
     }
   );
-  const commitState = (next) => {
+  const commitState = useStableCallback((next) => {
     const resolved = typeof next === "function" ? next(stateRef.current) : next;
     stateRef.current = resolved;
     setState(resolved);
-  };
-  const closeEventSource = useEffectEvent(() => {
+  });
+  const closeEventSource = useStableCallback(() => {
     const source = eventSourceRef.current;
     if (source === null) {
       return;
     }
     eventSourceRef.current = null;
     eventSourceKeyRef.current = null;
+    activeEventSourceEpochRef.current = null;
     source.close();
   });
-  const parseMessage = useEffectEvent((event) => {
+  const isActiveEventSourceEvent = useStableCallback((sourceEpoch) => {
+    return activeEventSourceEpochRef.current === sourceEpoch;
+  });
+  const parseMessage = useStableCallback((event) => {
     const parser = options.parseMessage ?? defaultParseMessage2;
     return parser(event);
   });
-  const handleOpen = useEffectEvent((event, source) => {
+  const handleOpen = useStableCallback((event, source) => {
     manualCloseRef.current = false;
     manualOpenRef.current = false;
     suppressReconnectRef.current = false;
@@ -1389,7 +1429,7 @@ var useEventSource = (options) => {
     }));
     options.onOpen?.(event, source);
   });
-  const commitParsedMessage = useEffectEvent(
+  const commitParsedMessage = useStableCallback(
     (eventName, event, isNamedEvent) => {
       try {
         const message = parseMessage(event);
@@ -1404,8 +1444,11 @@ var useEventSource = (options) => {
           return;
         }
         options.onMessage?.(message, event);
-      } catch {
-        const parseError = new Event("error");
+      } catch (error) {
+        const parseError = new RealtimeErrorEvent("error", {
+          cause: error,
+          kind: "parse-error"
+        });
         terminalErrorRef.current = parseError;
         manualOpenRef.current = false;
         suppressReconnectRef.current = true;
@@ -1421,7 +1464,10 @@ var useEventSource = (options) => {
       }
     }
   );
-  const handleError = useEffectEvent((event, source) => {
+  const handleError = useStableCallback((event, source, sourceEpoch) => {
+    if (!isActiveEventSourceEvent(sourceEpoch)) {
+      return;
+    }
     const terminalError = terminalErrorRef.current;
     if (terminalError !== null) {
       suppressReconnectRef.current = false;
@@ -1436,12 +1482,11 @@ var useEventSource = (options) => {
     const skipErrorReconnect = skipErrorReconnectRef.current;
     skipErrorReconnectRef.current = false;
     const shouldReconnect = !suppressReconnectRef.current && !skipErrorReconnect && reconnectEnabled && (options.shouldReconnect?.(event) ?? true);
-    const readyState = source.readyState;
     commitState((current) => ({
       ...current,
       lastChangedAt: Date.now(),
       lastError: event,
-      status: readyState === EventSource.OPEN ? "open" : shouldReconnect ? "reconnecting" : "closed"
+      status: shouldReconnect ? "reconnecting" : "closed"
     }));
     options.onError?.(event);
     if (!shouldReconnect) {
@@ -1449,21 +1494,18 @@ var useEventSource = (options) => {
       closeEventSource();
       return;
     }
-    if (readyState === EventSource.CLOSED) {
-      eventSourceRef.current = null;
-      eventSourceKeyRef.current = null;
-      reconnect.schedule("error");
-    }
+    closeEventSource();
+    reconnect.schedule("error");
   });
-  const open = () => {
+  const open = useStableCallback(() => {
     manualCloseRef.current = false;
     manualOpenRef.current = true;
     suppressReconnectRef.current = false;
     terminalErrorRef.current = null;
     reconnect.cancel();
     setOpenNonce((current) => current + 1);
-  };
-  const reconnectNow = () => {
+  });
+  const reconnectNow = useStableCallback(() => {
     manualCloseRef.current = false;
     manualOpenRef.current = true;
     skipErrorReconnectRef.current = true;
@@ -1472,8 +1514,8 @@ var useEventSource = (options) => {
     closeEventSource();
     suppressReconnectRef.current = false;
     reconnect.schedule("manual");
-  };
-  const close = () => {
+  });
+  const close = useStableCallback(() => {
     manualCloseRef.current = true;
     manualOpenRef.current = false;
     suppressReconnectRef.current = true;
@@ -1485,7 +1527,7 @@ var useEventSource = (options) => {
       lastChangedAt: Date.now(),
       status: "closed"
     }));
-  };
+  });
   useEffect(() => {
     if (!supported) {
       eventSourceKeyRef.current = null;
@@ -1504,7 +1546,7 @@ var useEventSource = (options) => {
       }));
       return;
     }
-    const shouldConnect = terminalErrorRef.current === null && (connect && !manualCloseRef.current || manualOpenRef.current || reconnect.status === "running");
+    const shouldConnect = terminalErrorRef.current === null && (reconnect.status === "running" || reconnect.status !== "scheduled" && (connect && !manualCloseRef.current || manualOpenRef.current));
     const nextEventSourceKey = [
       resolvedUrl,
       options.withCredentials ? "credentials" : "anonymous",
@@ -1532,27 +1574,39 @@ var useEventSource = (options) => {
     const source = new EventSource(resolvedUrl, {
       withCredentials: options.withCredentials ?? false
     });
+    const sourceEpoch = nextEventSourceEpochRef.current + 1;
     eventSourceRef.current = source;
     eventSourceKeyRef.current = nextEventSourceKey;
+    activeEventSourceEpochRef.current = sourceEpoch;
+    nextEventSourceEpochRef.current = sourceEpoch;
     commitState((current) => ({
       ...current,
       lastChangedAt: Date.now(),
       status: reconnect.status === "running" || reconnect.status === "scheduled" ? "reconnecting" : "connecting"
     }));
     const handleSourceOpen = (event) => {
+      if (!isActiveEventSourceEvent(sourceEpoch)) {
+        return;
+      }
       handleOpen(event, source);
     };
     const handleSourceMessage = (event) => {
+      if (!isActiveEventSourceEvent(sourceEpoch)) {
+        return;
+      }
       commitParsedMessage("message", event, false);
     };
     const namedEventHandlers = /* @__PURE__ */ new Map();
     const handleSourceError = (event) => {
-      handleError(event, source);
+      handleError(event, source, sourceEpoch);
     };
     source.addEventListener("open", handleSourceOpen);
     source.addEventListener("message", handleSourceMessage);
     for (const eventName of namedEvents) {
       const handler = (event) => {
+        if (!isActiveEventSourceEvent(sourceEpoch)) {
+          return;
+        }
         commitParsedMessage(eventName, event, true);
       };
       namedEventHandlers.set(eventName, handler);
@@ -1568,8 +1622,14 @@ var useEventSource = (options) => {
       source.removeEventListener("error", handleSourceError);
     };
   }, [
+    closeEventSource,
+    commitParsedMessage,
+    commitState,
     connect,
     eventsDependency,
+    handleError,
+    handleOpen,
+    isActiveEventSourceEvent,
     namedEvents,
     openNonce,
     options.withCredentials,
@@ -1580,6 +1640,7 @@ var useEventSource = (options) => {
   useEffect(() => () => {
     suppressReconnectRef.current = true;
     eventSourceKeyRef.current = null;
+    activeEventSourceEpochRef.current = null;
     terminalErrorRef.current = null;
     const source = eventSourceRef.current;
     eventSourceRef.current = null;
@@ -1624,6 +1685,6 @@ var useEventSource = (options) => {
   };
 };
 
-export { useConnectionGate, useEventSource, useHeartbeat, useOnlineStatus, usePageVisibility, useReconnect, useWebSocket };
+export { RealtimeErrorEvent, useConnectionGate, useEventSource, useHeartbeat, useOnlineStatus, usePageVisibility, useReconnect, useWebSocket };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map