useMediaQuery
Custom hook that tracks the state of a media query using the [`Match Media API`](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia).
Custom hook that tracks the state of a media query using the Match Media API.
Usage
import { useMediaQuery } from "@tilt-legal/cubitt-components/utilities/hooks";
const isSmallScreen = useMediaQuery('(max-width: 600px)');
// Use `isSmallScreen` to conditionally apply styles or logic based on the screen size.API
Signature
declare function useMediaQuery(query: string, { defaultValue, initializeWithValue, }?: UseMediaQueryOptions): boolean;Parameters
| Parameter | Type | Description | Default |
|---|---|---|---|
query | string | The media query to track. | - |
[options] | ?UseMediaQueryOptions | The options for customizing the behavior of the hook (optional). | - |
Return Value
| Value | Type | Description |
|---|---|---|
return | boolean | The current state of the media query (true if the query matches, false otherwise). |