/// <reference types="styled-components" />
import React from 'react';
export interface HolyGrailProps {
    /**
     * The main content area.
     */
    content: React.ReactNode;
    /**
     * The first sidebar area.
     */
    sidebarFirst: React.ReactNode;
    /**
     * The second sidebar area.
     */
    sidebarSecond: React.ReactNode;
    /**
     * The footer area.
     */
    footer: React.ReactNode;
    /**
     * The header area.
     */
    header: React.ReactNode;
    /**
     * The theme props is passed automatically to the component via styled components.
     *
     * @default "null"
     */
    theme: any;
}
/**
 * A layout that has a single sidebar and a container. Fully responsive so when
 * going to a narrow device it will not display as grid but rather sidebar on top of
 * the content.
 */
export declare const HolyGrailLayout: React.ForwardRefExoticComponent<Pick<HolyGrailProps, "footer" | "header" | "content" | "sidebarFirst" | "sidebarSecond"> & {
    theme?: any;
}>;