From b97f3b42e1bad5753728315b5c7ebdacf6f81172 Mon Sep 17 00:00:00 2001 From: Elizabeth Hunt Date: Mon, 6 Jan 2025 23:48:56 -0800 Subject: initial commit --- components/ui/use-mobile.tsx | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) create mode 100644 components/ui/use-mobile.tsx (limited to 'components/ui/use-mobile.tsx') diff --git a/components/ui/use-mobile.tsx b/components/ui/use-mobile.tsx new file mode 100644 index 0000000..2b0fe1d --- /dev/null +++ b/components/ui/use-mobile.tsx @@ -0,0 +1,19 @@ +import * as React from "react" + +const MOBILE_BREAKPOINT = 768 + +export function useIsMobile() { + const [isMobile, setIsMobile] = React.useState(undefined) + + React.useEffect(() => { + const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`) + const onChange = () => { + setIsMobile(window.innerWidth < MOBILE_BREAKPOINT) + } + mql.addEventListener("change", onChange) + setIsMobile(window.innerWidth < MOBILE_BREAKPOINT) + return () => mql.removeEventListener("change", onChange) + }, []) + + return !!isMobile +} -- cgit v1.2.3-70-g09d2