MediaSensor.md

MediaSensor

FaCC that re-renders on media query changes.

Example

import {MediaSensor} from 'libreact/lib/MediaSensor';

<MediaSensor query='(min-width: 480px)'>{({matches}) =>
  `WIDTH IS GREATED THAN 480PX: ${matches}`
}</MediaSensor>

withMedia()

Higher order component that injects a media prop into your component that specifies if media query matches.

import {withMedia} from 'libreact/lib/MediaSensor';

const MyCompWithSize = withMedia(MyComp, 'isBigScreen', '(min-width: 480px)');

@withMedia

Stateful component class decorator that injects a boolean prop into your component that specifies if media query matches.

import {withMedia} from 'libreact/lib/MediaSensor';

@withMedia('isBigScreen', '(min-width: 480px)')
class MyComp extends Component {

}