Skip to main content

Function: useCompactViewport()

useCompactViewport(): boolean

Defined in: ui/useCompactViewport.ts:60

Whether the viewport is narrower than COMPACT_BREAKPOINT_PX.

Backed by useSyncExternalStore so the value stays consistent across a concurrent render and updates on every resize that crosses the breakpoint. Returns false where matchMedia is unavailable (SSR, older test environments), which keeps the existing desktop overlays as the default.

Returns​

boolean

true while the viewport is below the compact breakpoint.

Example​

const isCompact = useCompactViewport();
// 375px viewport → true; 1024px → false