useMediaQuery
Track CSS media query matches reactively. SSR-safe — returns false during server rendering.
import { useMediaQuery } from "@allem-sdk/hooks";Parameters
| Prop | Type | Default | Description |
|---|---|---|---|
| query* | string | — | CSS media query string |
Returns
boolean — Whether the media query matches.
Usage
const isMobile = useMediaQuery("(max-width: 768px)");
const prefersDark = useMediaQuery("(prefers-color-scheme: dark)");
return isMobile ? <MobileNav /> : <DesktopNav />;