useBreakpoint

API

import useBreakpoint from '@restart/hooks/useBreakpoint'

useBreakpoint(breakpointMap: BreakpointMap<TKey>) => boolean
Match a set of breakpoints
```
const MidSizeOnly = () => {
  const isMid = useBreakpoint({ lg: 'down', sm: 'up' });
  if (isMid) return <div>On a Reasonable sized Screen!</div>
  return null;
}
```
Parameters
- breakpointMapBreakpointMap<TKey>
  An object map of breakpoints and directions, queries are constructed using "and" to join breakpoints together
Return Value
boolean
useBreakpoint(breakpoint: TKey, direction?: BreakpointDirection) => boolean
Match a single breakpoint exactly, up, or down.
```
const PhoneOnly = () => {
  const isSmall = useBreakpoint('sm', 'down');
  if (isSmall) return <div>On a Small Screen!</div>
  return null;
}
```
Parameters
- breakpointTKey
  The breakpoint key
- direction?BreakpointDirection
  A direction 'up' for a max, 'down' for min, true to match only the breakpoint
Return Value
boolean