#useBreakpoint

#Import

import { useBreakpoint } from 'bumbag-native';

#Usage

The useBreakpoint hook will return a boolean depending if the particular breakpoint query is met.

#Widths

In the example below, isXLAndUnder will return truthy if it is under the max xl width viewport (1023px).

No
Editable example

In the example below, isLgAndAbove will return truthy if it is above the min lg width viewport (480px).

No
Editable example

In the example below, isLg will return truthy if it is within the lg width viewport (414px to 768px).

No
Editable example

#Schema

const doesMatch = useBreakpoint(direction, breakpoint)

#Parameters

direction string

Either width or height.

breakpoint string

A valid breakpoint from the theme.

#Return values

doesMatch boolean

Returns truthy if the query is matched.

On this page
Copyright © 2021 Jake Moxey