https://github.com/expo/match-media
Universal polyfill for match media API using Expo APIs on mobile
https://github.com/expo/match-media
breakpoint css-in-js expo polyfill react react-native react-native-web responsive
Last synced: 2 months ago
JSON representation
Universal polyfill for match media API using Expo APIs on mobile
- Host: GitHub
- URL: https://github.com/expo/match-media
- Owner: expo
- License: mit
- Created: 2019-11-12T07:25:30.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-03-04T05:10:13.000Z (over 2 years ago)
- Last Synced: 2025-03-29T09:09:53.661Z (2 months ago)
- Topics: breakpoint, css-in-js, expo, polyfill, react, react-native, react-native-web, responsive
- Language: TypeScript
- Size: 2.51 MB
- Stars: 139
- Watchers: 6
- Forks: 15
- Open Issues: 15
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
👋 Welcome to
@expo/match-media
Universal polyfill for match media API using Expo APIs on mobile
---
TL;DR: [Demo](App.js)
## 🏁 Setup
Install `@expo/match-media` and `expo-screen-orientation` in your project.
```sh
npx expo install @expo/match-media expo-screen-orientation
```
## ⚽️ Usage
Import the polyfill at the top of your file before using the [`window.matchMedia` API][match-media].
```js
import '@expo/match-media';
// use the match media API
```
**What this does**
- In the browser: Nothing
- In React Native apps: Polyfills the [`matchMedia` API][match-media] so you can use awesome libraries like `react-responsive`.
## License
The Expo source code is made available under the [MIT license](LICENSE). Some of the dependencies are licensed differently, with the BSD license, for example.
---
[match-media]: https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia