@bianic-ui/media-query/dist/esm/use-breakpoint-value.js

A React hook for changing properties or visibility of a component based on css media query

import { getClosestValue } from "./media-query.utils";
import { useBreakpoint } from "./use-breakpoint";
import { isArray, arrayToObjectNotation } from "@bianic-ui/utils";
/**
 * React hook for getting the value for the current breakpoint from the
 * provided responsive values object.
 *
 * @example
 * const width = useBreakpointValue({ base: '150px', md: '250px' })
 */

export function useBreakpointValue(values) {
  var breakpoint = useBreakpoint();
  if (!breakpoint) return;
  var obj = isArray(values) ? arrayToObjectNotation(values) : values;
  return getClosestValue(obj, breakpoint);
}
//# sourceMappingURL=use-breakpoint-value.js.map