@intility/bifrost-react/dist/hooks/usePrefersColorMode.js

React library for Intility's design system, Bifrost.

"use client";

import useMediaQuery from "./useMediaQuery.js";

/**
 * Uses CSS media query to find the users `prefers-color-scheme`. Returns
 * `"light"` or `"dark"` when running client-side, but falls back to
 * `undefined` when server-side-rendering.
 *
 * @see https://bifrost.intility.com/react/usePrefersColorMode
 *
 * @example
 * const colorMode = usePrefersColorMode();
 */
const usePrefersColorMode = () => {
  const currentlyLightMode = useMediaQuery("(prefers-color-scheme: light)");
  if (currentlyLightMode === undefined) {
    return;
  }
  return currentlyLightMode ? "light" : "dark";
};
export default usePrefersColorMode;