@jetshop/core/components/BreakpointProvider.js

import { createContext, useContext } from 'react';
import { useShopConfig } from '../hooks/useShopConfig';
// Default to 'sm' breakpoint.
// detect-mobile will replace this value during server render
const BreakpointContext = createContext('sm');
export function BreakpointConsumer({ children }) {
    const { theme: { breakpoints } } = useShopConfig();
    const breakpoint = useContext(BreakpointContext);
    const labels = Object.keys(breakpoints);
    const breakpointIndex = labels.indexOf(breakpoint);
    return children({
        breakpointIndex,
        breakpointLabel: breakpoint
    });
}
export function useInitialBreakpoint() {
    const { theme: { breakpoints } } = useShopConfig();
    const breakpoint = useContext(BreakpointContext);
    const labels = Object.keys(breakpoints);
    const breakpointIndex = labels.indexOf(breakpoint);
    return { breakpointIndex, breakpointLabel: breakpoint };
}
export const BreakpointProvider = BreakpointContext.Provider;
//# sourceMappingURL=BreakpointProvider.js.map