/** @jsx jsx */
import React from 'react';
import { jsx } from '@emotion/react';
export type Breakpoints = 'S' | 'M' | 'L';
export type WidthConsumerContext = {
    width: number;
    breakpoint: Breakpoints;
};
export declare function getBreakpoint(width?: number): Breakpoints;
export declare function createWidthContext(width?: number): WidthConsumerContext;
export declare const WidthContext: React.Context<WidthConsumerContext>;
declare const Consumer: React.Consumer<WidthConsumerContext>;
export type WidthProviderState = {
    width?: number;
};
type WidthProviderProps = {
    className?: string;
    shouldCheckExistingValue?: boolean;
    children?: React.ReactNode;
};
export declare const WidthProvider: ({ className, shouldCheckExistingValue, children, }: WidthProviderProps) => jsx.JSX.Element;
export { Consumer as WidthConsumer };
