import * as React from 'react';
import { ScrollableContainerCommonProps } from '../common';
export { usePageContext } from './PageContext';
export type PageProps = {
    /** Accepts compound components as child items:
     * - `<Page.Header/>`
     * - `<Page.Content/>`
     * - `<Page.Tail/>`
     * - `<Page.Section/>`
     * - `<Page.Footer/>`
     *  */
    children?: React.ReactNode;
    /** Applies a data-hook HTML attribute that can be used in the tests. */
    dataHook?: string;
    /** Provides a link to the background image source (URL). The image is displayed at the top of the page, underneath the \<Page.Header/>. */
    backgroundImageUrl?: string;
    /** Sets the maximum width of the page (paddings excluded) */
    maxWidth?: number;
    /** Sets the minimum width of the page (paddings excluded). When `mobile` is enabled on `<WixDesignSystemProvider/>`, the default minimum width is removed, but an explicitly provided value is still applied. */
    minWidth?: number;
    /** Sets the height of the page in pixels (px), viewport height (vh), etc. */
    height?: string;
    /** Sets the side paddings of a page. Also applies when `<Page.Content/>` is `fullScreen`. */
    sidePadding?: number;
    /** Sets the top and bottom paddings of the page content in pixels. The top padding applies only when the page has no `<Page.Header/>` or `<Page.Tail/>`, and the bottom padding only when it has no `<Page.FixedFooter/>`. When not set, the content has no top padding and a 48px bottom padding. */
    verticalPadding?: number;
    /** Specifies a CSS class name to be appended to the component's root element.
     * @internal
     */
    className?: string;
    /** Specifies a CSS class name that defines a gradient background for \<Page.Header/>. */
    gradientClassName?: string;
    /** Defines a reference called together with page scrollable content ref after page mount.
     *  <br/>
     * **Note** - if you need this ref only for listening to scroll events on the scrollable content then use this prop instead:
     * `scrollProps = {onScrollChanged/onScrollAreaChanged}` */
    scrollableContentRef?: (ref: HTMLElement | null) => void;
    /** Specifies the stack order (z-index) of a page. */
    zIndex?: number;
    /** Enables page content to scroll horizontally when its width exceed maximum allowed width. */
    horizontalScroll?: boolean;
    /** Pass properties related to the scrollable content of the page.
     * <br/>
     * **onScrollAreaChanged** - defines a handler function for scroll area changes.
     * Function is triggered when the user scrolls to a different area of the scrollable content. See signature for possible areas:
     * `function({area: {y: AreaY, x: AreaX}, target: HTMLElement}) => void`
     * `AreaY`: top | middle | bottom | none
     * `AreaX`: start | middle | end | none (not implemented yet)
     * <br/>
     * **onScrollAreaChanged** - defines a general handler for scroll changes with throttling (100ms):
     * `function({target: HTMLElement}) => void`
     * */
    scrollProps?: ScrollableContainerCommonProps;
};
export interface ContentProps {
    /** Sets the content of the page. */
    children: React.ReactNode;
    className?: string;
    /** Removes the page's maximum and minimum width limits and its default side paddings so the content spans the full width. A `sidePadding` set on the page still applies. */
    fullScreen?: boolean;
    /** Specifies whether the content stretches to fill the visible height of the page below its header, so a child with `height="100%"` or a `<Card stretchVertically/>` spans it. Content taller than the page still scrolls. */
    stretchVertically?: boolean;
    stickyStyle?: React.CSSProperties;
}
export interface FixedContentProps {
    /** Sets the content that stays in place while the rest of the page scrolls. */
    children: React.ReactElement;
}
export interface FixedFooterProps {
    /** Sets the footer content, which stays at the bottom of the page while the content scrolls. */
    children: React.ReactElement;
}
export interface TailProps {
    /** Sets the content rendered directly under the page header, such as a `<Tabs/>` element. */
    children: React.ReactElement;
    /** Forwards a minimized flag to the child element, so it can render a condensed variant while the header is collapsed. */
    minimized?: boolean;
}
export interface StickyProps {
    /** Sets the content that sticks below the header as the page scrolls. Accepts a function that receives `style` and `className` to apply to an element of your own. */
    children: React.ReactElement | StickyChildrenRenderFn;
    /** Sets inline styles on the sticky wrapper, merged over the offset the page calculates. */
    style?: React.CSSProperties;
    /** Specifies a CSS class name to be appended to the component's root element. */
    className?: string;
}
type StickyChildrenRenderFn = (data: {
    style: string | React.CSSProperties;
    className: string;
}) => React.ReactElement;
//# sourceMappingURL=Page.types.d.ts.map