usePageVisibility

Whether the tab is visible, to pause work in the background.

HooksEnvironment@gaudi/design-system/hooks/environment/use-page-visibilityView in Storybook Source

True while the page is visible. Pause polling, carousels, video and animation loops when the reader switches tabs, and resume when they return.

Usage

import { useInterval, usePageVisibility } from '@gaudi/design-system/hooks';
const visible = usePageVisibility();useInterval(refresh, visible ? 30000 : null);

Examples

Pause polling in the background

Storybook

API

1 return value

Accessibility

Pausing hidden work also stops rotating content from moving on while the reader is away, so they return to what they left.

Notes

Combine with useInterval: pass null as the delay while hidden.

useIntervalsetInterval that can pause and always runs the latest callback.useDocumentTitleSet a document title and restore the previous owner on cleanup.useIsClientFalse on the server and during hydration, true on the client.useIsMobileTrue below the 768px phone breakpoint.useIsMountedA stable getter for whether this hook is currently mounted.useMediaQueryTrack a CSS media query, SSR-safe.