diff --git a/.changeset/mean-insects-warn.md b/.changeset/mean-insects-warn.md new file mode 100644 index 0000000..2a1247b --- /dev/null +++ b/.changeset/mean-insects-warn.md @@ -0,0 +1,5 @@ +--- +"react-collapsed": patch +--- + +Account for different signatures of addEventListener and addListener, fix #152 diff --git a/packages/react-collapsed/src/utils/usePrefersReducedMotion.ts b/packages/react-collapsed/src/utils/usePrefersReducedMotion.ts index e92f465..ff5ead2 100644 --- a/packages/react-collapsed/src/utils/usePrefersReducedMotion.ts +++ b/packages/react-collapsed/src/utils/usePrefersReducedMotion.ts @@ -15,10 +15,18 @@ export function usePrefersReducedMotion() { } // Fallback to addListener/removeListener for older browsers, #152 - (mediaQueryList.addEventListener ?? mediaQueryList.addListener)('change', listener) - return () => { - (mediaQueryList.removeEventListener ?? mediaQueryList.removeListener)('change', listener) + if (mediaQueryList.addEventListener) { + mediaQueryList.addEventListener('change', listener) + return () => { + mediaQueryList.removeEventListener('change', listener) + } + } else if (mediaQueryList.addListener) { + mediaQueryList.addListener(listener) + return () => { + mediaQueryList.removeListener(listener) + } } + return undefined }, []) return prefersReducedMotion }