search

yocontra / react-responsive

CSS media queries in react - for responsive design, and more.
https://contra.io/react-responsive
MIT License
7.04k stars 298 forks source link

force matchmediaquery to use the context/prop values #288

Closed jordrake closed 2 years ago

jordrake commented 2 years ago

This fixes #287 by replicating the previous behaviour (https://github.com/yocontra/react-responsive/blob/v8.2.0/src/useMediaQuery.js#L61) by setting forceStatics within matchmediaquery.

This does mean that useMediaQuery will always use the device from context/props if provided however this is somewhat necessary for correct SSR as the first render on the client will need to match that from the server. I recommend this workaround for that: https://github.com/yocontra/react-responsive/issues/257#issuecomment-677619268 although I'm happy to contribute a solution within this library for this (as a different pr).

jordrake commented 2 years ago

Some additional behaviour is always passing device as an empty object (and therefore forceStatics is always true), I will re-open this pull request once I've resolved this.