react-realtime-hooks 1.0.3 → 1.1.0

package/dist/index.js

@@ -6,6 +6,7 @@ import { useSyncExternalStore, useRef, useState, useEffect, useEffectEvent, useM
 var isWebSocketSupported = () => typeof WebSocket !== "undefined";
 var isEventSourceSupported = () => typeof EventSource !== "undefined";
 var hasNavigatorOnLineSupport = () => typeof navigator !== "undefined" && typeof navigator.onLine === "boolean";
+var hasDocumentVisibilitySupport = () => typeof document !== "undefined" && typeof document.visibilityState === "string";
 var readOnlineStatus = (initialOnline = true) => {
   if (!hasNavigatorOnLineSupport()) {
     return {
@@ -18,6 +19,20 @@ var readOnlineStatus = (initialOnline = true) => {
     isSupported: true
   };
 };
+var readPageVisibility = (initialVisible = true) => {
+  if (!hasDocumentVisibilitySupport()) {
+    return {
+      isVisible: initialVisible,
+      isSupported: false,
+      visibilityState: initialVisible ? "visible" : "hidden"
+    };
+  }
+  return {
+    isVisible: document.visibilityState === "visible",
+    isSupported: true,
+    visibilityState: document.visibilityState
+  };
+};
 
 // src/hooks/useOnlineStatus.ts
 var subscribeToOnlineStatus = (onStoreChange) => {
@@ -70,6 +85,56 @@ var useOnlineStatus = (options = {}) => {
     ...transitions
   };
 };
+var subscribeToPageVisibility = (onStoreChange) => {
+  if (typeof document === "undefined" || !hasDocumentVisibilitySupport()) {
+    return () => {
+    };
+  }
+  document.addEventListener("visibilitychange", onStoreChange);
+  return () => {
+    document.removeEventListener("visibilitychange", onStoreChange);
+  };
+};
+var createEmptyTransitionState2 = () => ({
+  lastChangedAt: null,
+  becameHiddenAt: null,
+  becameVisibleAt: null
+});
+var usePageVisibility = (options = {}) => {
+  const initialVisible = options.initialVisible ?? true;
+  const trackTransitions = options.trackTransitions ?? true;
+  const visibilityState = useSyncExternalStore(
+    subscribeToPageVisibility,
+    () => readPageVisibility(initialVisible).visibilityState,
+    () => initialVisible ? "visible" : "hidden"
+  );
+  const isVisible = visibilityState === "visible";
+  const previousVisibleRef = useRef(isVisible);
+  const [transitions, setTransitions] = useState(createEmptyTransitionState2);
+  useEffect(() => {
+    if (!trackTransitions) {
+      previousVisibleRef.current = isVisible;
+      setTransitions(createEmptyTransitionState2);
+      return;
+    }
+    if (previousVisibleRef.current === isVisible) {
+      return;
+    }
+    const changedAt = Date.now();
+    previousVisibleRef.current = isVisible;
+    setTransitions((current) => ({
+      lastChangedAt: changedAt,
+      becameHiddenAt: isVisible ? current.becameHiddenAt : changedAt,
+      becameVisibleAt: isVisible ? changedAt : current.becameVisibleAt
+    }));
+  }, [isVisible, trackTransitions]);
+  return {
+    isSupported: hasDocumentVisibilitySupport(),
+    isVisible,
+    visibilityState,
+    ...transitions
+  };
+};
 
 // src/core/reconnect.ts
 var DEFAULT_RECONNECT_OPTIONS = {
@@ -486,11 +551,7 @@ var useHeartbeat = (options) => {
     generationRef.current += 1;
     intervalRef.current.cancel();
     timeoutRef.current.cancel();
-    commitState((current) => ({
-      ...current,
-      hasTimedOut: false,
-      isRunning: false
-    }));
+    commitState(createInitialState2(false));
   };
   const beat = () => {
     if (!enabled) {
@@ -745,6 +806,7 @@ var useWebSocket = (options) => {
   const applyHeartbeatAction = useEffectEvent(
     (action, error, reconnectTrigger) => {
       heartbeat.stop();
+      options.onError?.(error);
       if (action === "none") {
         commitState((current) => ({
           ...current,
@@ -822,6 +884,7 @@ var useWebSocket = (options) => {
       suppressReconnectRef.current = true;
       reconnect.cancel();
       heartbeat.stop();
+      options.onError?.(parseError);
       commitState((current) => ({
         ...current,
         lastChangedAt: Date.now(),
@@ -835,6 +898,7 @@ var useWebSocket = (options) => {
     heartbeat.stop();
     commitState((current) => ({
       ...current,
+      lastChangedAt: Date.now(),
       lastError: event,
       status: "error"
     }));
@@ -1181,6 +1245,7 @@ var useEventSource = (options) => {
         suppressReconnectRef.current = true;
         reconnect.cancel();
         closeEventSource();
+        options.onError?.(parseError);
         commitState((current) => ({
           ...current,
           lastChangedAt: Date.now(),
@@ -1393,6 +1458,6 @@ var useEventSource = (options) => {
   };
 };
 
-export { useEventSource, useHeartbeat, useOnlineStatus, useReconnect, useWebSocket };
+export { useEventSource, useHeartbeat, useOnlineStatus, usePageVisibility, useReconnect, useWebSocket };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map