import * as React from 'react';
import { PreciseTheme, ScreenSize } from '../../common';
export declare type ScreenSizeCondition = 'equal' | 'from' | 'upTo';
export interface ResponsiveProps {
    /**
     * Sets the screen size for which to show the children.
     * Valid values are: 'small' | 'medium' | 'large' | 'xLarge' | 'max'
     */
    screenSize?: ScreenSize;
    /**
     * Sets the screen size check condition.
     * Valid values are: 'equal' | 'from' | 'upTo'
     * @default 'equal'
     */
    screenSizeCondition?: ScreenSizeCondition;
    /**
     * Sets the render callback. When screen size changes it's called with a new one.
     */
    render?(screenSize?: ScreenSize): React.ReactNode;
    /**
     * The content to be displayed when the query matches.
     */
    children?: React.ReactNode;
    /**
     * The theme to supply for setting the custom breakpoints, if any.
     */
    theme?: PreciseTheme;
}
export interface ResponsiveState {
    matchesTo?: ScreenSize;
}
export declare class Responsive extends React.Component<ResponsiveProps, ResponsiveState> {
    private mediaQueriesToListen;
    constructor(props: ResponsiveProps);
    private getBreakpoints;
    private currentlyMatches;
    private updateMatches;
    componentDidMount(): void;
    componentWillUnmount(): void;
    render(): React.ReactNode;
}