@chakra-ui/react/dist/types/hooks/use-breakpoint.d.ts

Responsive and accessible React UI components built with React and Emotion

import { type BreakpointName } from "../styled-system";
export interface UseBreakpointOptions {
    /**
     * The breakpoint name to return when no media query matches, or during SSR
     * when `window` is unavailable.
     * @default "base"
     */
    fallback?: BreakpointName | undefined;
    /**
     * When `true`, defers media query evaluation to the client to avoid
     * hydration mismatches. On the server the `fallback` value is used instead.
     * @default true
     */
    ssr?: boolean | undefined;
    /**
     * Custom function to retrieve the `window` object. Useful in environments
     * where `window` may not be the global (e.g. iframes, Shadow DOM, tests).
     */
    getWindow?: () => typeof window | undefined;
    /**
     * The breakpoint names to evaluate against the current viewport.
     * Only these breakpoints are matched via media queries, and the highest
     * matching one is returned.
     * @example ["base", "sm", "lg"]
     */
    breakpoints?: BreakpointName[] | undefined;
}
export declare function useBreakpoint(options?: UseBreakpointOptions): string;
export type UseBreakpointValueOptions = Omit<UseBreakpointOptions, "breakpoints">;
type Value<T> = Partial<Record<BreakpointName, T>> | Array<T | null>;
export declare function useBreakpointValue<T = any>(value: Value<T>, opts?: UseBreakpointValueOptions): T | undefined;
export {};