import { Component, ReactNode } from 'react';
import { ContentRect } from 'react-measure';
import '../../helpers/base.less';
import './Layout.less';
declare type CollapsedState = 'responsive' | 'desktop';
export interface LayoutProps {
    /**
     * Type of the `Layout`
     * @since 1.4.0
     */
    type?: 'fluid' | 'simplified';
    /**
     * Header content.
     * @since 1.4.0
     */
    header?: ReactNode;
    /**
     * Define header position - always on top (fixed) or static.
     * @since 1.4.0
     */
    headerFixed?: boolean;
    /**
     * Additional content at the top of the header.
     * @since 3.2.0
     */
    headerAddon?: ReactNode;
    /**
     * Sidebar content.
     * @since 1.4.0
     */
    sidebar?: ReactNode;
    /**
     * Sidebar type.
     * @since 3.2.0
     */
    sidebarType?: 'collapsed' | 'folded';
    /**
     * Define if sidebar can collapse.
     * @since 1.4.0
     */
    sidebarCollapsible?: boolean;
    /**
     * Sidebar collapsed state.
     * A boolean value is used for desktop mode only, but you can set an array with collapsed states for all modes, e.g. `['responsive', 'desktop']`.
     *
     * @since 1.4.0
     */
    sidebarCollapsed?: boolean | CollapsedState[];
    /**
     * Additional content between header and main content.
     * @since 1.4.0
     */
    contentAddon?: ReactNode;
    /**
     * Content header.
     * @since 3.0.0
     */
    contentHeader?: ReactNode;
    /**
     * Footer content.
     * @since 1.4.0
     */
    footer?: ReactNode;
    /**
     * Main content of the `Layout`.
     * @since 1.4.0
     */
    children?: ReactNode;
    /**
     * Width of the content
     * @since 3.0.0
     */
    width?: 'sm' | 'md' | 'lg';
    /**
     * Sidebar onToggle handler.
     * The handler is called with two args:
     *
     * * Whether collapsed or not.
     * * In which mode: responsive or desktop.
     *
     * @since 1.4.0
     */
    onSidebarToggle?: (sidebarClosed: boolean, state: CollapsedState) => void;
    /**
     * @ignore
     */
    className?: string;
    /**
     * @ignore
     */
    baseClassName?: string;
}
declare type LayoutState = {
    isSidebarClosedDesktop?: boolean;
    isSidebarClosedResponsive?: boolean;
    headerHeight?: number | null;
    isResponsive?: boolean;
    prevSidebarCollapsed?: LayoutProps['sidebarCollapsed'];
};
/**
 * @since 1.4.0
 */
export default class Layout extends Component<LayoutProps, LayoutState> {
    static defaultProps: {
        type: string;
        header: undefined;
        headerFixed: boolean;
        headerAddon: undefined;
        sidebar: undefined;
        sidebarType: string;
        sidebarCollapsible: boolean;
        sidebarCollapsed: boolean;
        contentAddon: undefined;
        contentHeader: undefined;
        footer: undefined;
        width: undefined;
        onSidebarToggle: undefined;
        children: undefined;
        className: undefined;
        baseClassName: string;
    };
    state: {
        isSidebarClosedDesktop: boolean;
        isSidebarClosedResponsive: boolean;
        headerHeight: null;
        isResponsive: boolean;
    };
    static getDerivedStateFromProps(props: LayoutProps, state: LayoutState): LayoutState;
    componentDidMount(): void;
    componentWillUnmount(): void;
    private readonly headerRef;
    private readonly sidebarRef;
    private readonly responsiveSidebarTogglerRef;
    private unsubscribeMatchMedia?;
    private unsubscribeClickOutside?;
    handleMatchMedia: ({ matches }: MediaQueryListEvent | MediaQueryList) => void;
    handleClickOutside: () => void;
    handleToggle: () => void;
    handleResize: ({ bounds }: ContentRect) => void;
    getSidebarClosed: () => boolean;
    renderHeader({ header }: {
        header: ReactNode;
    }): JSX.Element | null;
    renderContentAddon({ contentAddon }: {
        contentAddon: ReactNode;
    }): JSX.Element | null;
    renderContentHeader({ contentHeader }: {
        contentHeader: ReactNode;
    }): JSX.Element | null;
    renderSidebar({ sidebar }: {
        sidebar: ReactNode;
    }): JSX.Element | null;
    renderMainContent({ children }: {
        children: ReactNode;
    }): JSX.Element;
    renderFooter({ footer }: {
        footer: ReactNode;
    }): JSX.Element | null;
    render(): JSX.Element;
}
export {};
