All files / hooks/use-media-query/src utils.ts

100% Statements 4/4
100% Branches 4/4
100% Functions 2/2
100% Lines 4/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37                        20x                                     9x 2x   7x    
/**
 * Whether `window.matchMedia` is available (false during SSR or in very old
 * browsers).
 *
 * @example
 * ```ts
 * if (isMatchMediaSupported()) {
 *   // safe to call window.matchMedia
 * }
 * ```
 */
export function isMatchMediaSupported(): boolean {
  return (
    typeof window !== "undefined" && typeof window.matchMedia === "function"
  );
}
 
/**
 * Evaluate a media query string, returning `defaultValue` when `matchMedia`
 * is unavailable (SSR).
 *
 * @param query - A CSS media query, e.g. `"(min-width: 768px)"`
 * @param defaultValue - Value to return when `matchMedia` is unavailable
 * @returns Whether the query currently matches
 *
 * @example
 * ```ts
 * getMatches("(min-width: 768px)", false);
 * ```
 */
export function getMatches(query: string, defaultValue: boolean): boolean {
  if (!isMatchMediaSupported()) {
    return defaultValue;
  }
  return window.matchMedia(query).matches;
}