@kodingdotninja/use-tailwind-breakpoint/dist/index.mjs

Custom hooks to use breakpoints for React 🎐🔨

import { useLayoutEffect, useEffect, useState, useMemo } from 'react';

var x=typeof window>"u"||!window.navigator||/ServerSideRendering|^Deno\//.test(window.navigator.userAgent),c=!x,i=c?useLayoutEffect:useEffect;function l(d){function r(t,e=!1){let[n,o]=useState(()=>e);return i(()=>{if(!(c&&"matchMedia"in window&&window.matchMedia))return;let a=d[t]??"999999px",s=window.matchMedia(`(min-width: ${a})`);function u(w){o(w.matches);}return o(s.matches),s.addEventListener("change",u),()=>s.removeEventListener("change",u)},[t,e]),n}function h(t,e){let n=r(t);return i(()=>e(n),[t,e]),null}function p(t,e,n){let o=r(t);return useMemo(()=>o?e:n,[n,o,e])}return {useBreakpoint:r,useBreakpointEffect:h,useBreakpointValue:p}}

export { l as create, l as default, c as isBrowser, x as isSSR, i as useIsomorphicEffect };