useWindowFocus

Tracks whether the browser window currently has focus as a reactive Observable<boolean>. Updates automatically when the user switches tabs, clicks away, or returns to the window. SSR-safe: returns false when document is not available.

Demo

focused$.get() = false

Click outside this window or switch tabs to see the value change.

Usage

import { useWindowFocus } from "@usels/core";

function Component() {
  const focused$ = useWindowFocus();

  return <p>Window is {focused$.get() ? "focused" : "blurred"}</p>;
}

Pausing work when the window loses focus

const focused$ = useWindowFocus();

useObserve(() => {
  if (!focused$.get()) pausePolling();
  else resumePolling();
});

Type Declarations

export declare function useWindowFocus(): Observable<boolean>;

Source

View on GitHub

Contributors

• tigerwest

Changelog

• a7392ab 2026-03-06 - feat(core,browser): add sync strategy hooks (tigerwest)