useMediaQuery: unsupported query throw exception `t.addEventListener is not a function`

[rawpixel-vincent]

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch @react-hookz/web@25.0.1 for the project I'm working on.

on safari 13, mql is undefined, and an error is thrown t.addEventListener is not a function, will PR

Here is the diff that solved my problem:

diff --git a/node_modules/@react-hookz/web/dist/useMediaQuery/index.js b/node_modules/@react-hookz/web/dist/useMediaQuery/index.js
index e7b8dd3..495607e 100644
--- a/node_modules/@react-hookz/web/dist/useMediaQuery/index.js
+++ b/node_modules/@react-hookz/web/dist/useMediaQuery/index.js
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';
 import { isBrowser } from '../util/const.js';
 const queriesMap = new Map();
 const createQueryEntry = (query) => {
+  try {
     const mql = matchMedia(query);
     const dispatchers = new Set();
     const listener = () => {
@@ -15,6 +16,21 @@ const createQueryEntry = (query) => {
         dispatchers,
         listener,
     };
+  } catch (e) {
+    return {
+        mql: {
+            matches: false,
+            addEventListener: undefined,
+            removeEventListener: undefined,
+            // eslint-disable-next-line @typescript-eslint/no-empty-function
+            addListener: () => { },
+            // eslint-disable-next-line @typescript-eslint/no-empty-function
+            removeListener: () => { },
+        },
+        dispatchers: new Set(),
+        listener: () => { },
+    };
+  }
 };
 const querySubscribe = (query, setState) => {
     let entry = queriesMap.get(query);

This issue body was partially generated by patch-package.