react-media-hook - npm Package Compare versions

Comparing version 0.4.9 to 0.5.0

index.js

 var React = require('react')
 
-function fallbackMathMedia (query) {
+function fallbackMatchMedia (query) {
   if (typeof matchMedia !== 'function') {
@@ -18,4 +18,11 @@ return null
 function useMedia (query) {
+  var mounted = React.useState(false)
+  var setMounted = mounted[1]
+
+  React.useEffect(function () {
+    setMounted(true)
+  }, [setMounted])
+
   var result = React.useState(function () {
-    return omitMatchMediaResult(fallbackMathMedia(query))
+    return omitMatchMediaResult(fallbackMatchMedia(query))
   })
@@ -30,6 +37,12 @@ var setResult = result[1]
     function () {
-      var matchMediaResult = fallbackMathMedia(query)
+      var matchMediaResult = fallbackMatchMedia(query)
       callback(matchMediaResult)
-      matchMediaResult.addListener(callback)
-      return function () { return matchMediaResult.removeListener(callback) }
+      if (matchMediaResult) {
+        matchMediaResult.addEventListener('change', callback)
+      }
+      return function () {
+        if (matchMediaResult) {
+          matchMediaResult.removeEventListener('change', callback)
+        }
+      }
     },
@@ -39,2 +52,6 @@ [callback, query]
 
+  if (!mounted[0]) {
+    return null
+  }
+
   return result[0]
@@ -41,0 +58,0 @@ }

package.json

 {
   "name": "react-media-hook",
-  "version": "0.4.9",
+  "version": "0.5.0",
   "main": "index.js",
@@ -20,3 +20,3 @@ "types": "index.d.ts",
       ],
-      "limit": "189 B",
+      "limit": "230 B",
       "path": "./index.js",
@@ -23,0 +23,0 @@ "running": false

README.md

 # react-media-hook
 
-[![CircleCI](https://circleci.com/gh/lessmess-dev/react-media-hook.svg?style=shield)](https://circleci.com/gh/lessmess-dev/react-media-hook)
+[![CircleCI](https://circleci.com/gh/ilyalesik/react-media-hook.svg?style=shield)](https://circleci.com/gh/ilyalesik/react-media-hook)
 [![npm version](https://img.shields.io/npm/v/react-media-hook.svg)](https://www.npmjs.com/package/react-media-hook)
@@ -56,8 +56,1 @@ [![npm downloads](https://img.shields.io/npm/dt/react-media-hook.svg)](https://www.npmjs.com/package/react-media-hook)
 Returns just *true* or *false*.
-
-## Sponsored
-<a href="https://lessmess.agency/?utm_source=react-media-hook">
-  <img src="https://lessmess.agency/badges/sponsored_by_lessmess.svg"
-       alt="Sponsored by Lessmess" width="236" height="54">
-</a>
-

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

6169

increased by23.04%

Number of package files

6

increased by20%

Lines of code

62

increased by29.17%

Worsened metrics

Number of lines in readme file

56

decreased by-11.11%

No dependency changes