lucid-ui/dist/esm/components/StickySection/StickySection.d.ts

A UI component library from Xandr.

import React from 'react';
import PropTypes from 'prop-types';
import { StandardProps } from '../../util/component-types';
export interface IStickySectionProps extends StandardProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
    /** Pixel value from the top of the document. When scrolled passed, the
     * sticky header is no longer sticky, and renders normally. */
    lowerBound?: number;
    /** Width of section when it sticks to the top edge of the screen. When
     * omitted, it defaults to the last width of the section. */
    viewportWidth?: number;
    /** Top offset threshold before sticking to the top. The sticky content will
     * display with this offset. */
    topOffset?: number;
}
interface IContainerRect extends Omit<ClientRect, 'x' | 'y' | 'toJSON'> {
    scrollWidth: number;
    frameLeft: number;
}
interface IStickySectionState {
    isAboveFold: boolean;
    containerRect: IContainerRect;
}
declare class StickySection extends React.Component<IStickySectionProps, IStickySectionState, {}> {
    static displayName: string;
    static peek: {
        description: string;
        categories: string[];
    };
    static propTypes: {
        /**
            any valid React children
        */
        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        /**
            Appended to the component-specific class names set on the root element.
        */
        className: PropTypes.Requireable<string>;
        /**
            Styles that are passed through to the root container.
        */
        style: PropTypes.Requireable<object>;
        /**
            Pixel value from the top of the document. When scrolled passed, the
            sticky header is no longer sticky, and renders normally.
        */
        lowerBound: PropTypes.Requireable<number>;
        /**
            Top offset threshold before sticking to the top. The sticky content will
            display with this offset.
        */
        topOffset: PropTypes.Requireable<number>;
    };
    private scrollContainer;
    private stickySection;
    private stickyFrame;
    state: {
        isAboveFold: boolean;
        containerRect: {
            bottom: number;
            height: number;
            left: number;
            right: number;
            top: number;
            width: number;
            frameLeft: number;
            scrollWidth: number;
        };
    };
    handleScroll: () => void;
    getContainerRect: () => IContainerRect;
    componentDidMount(): void;
    componentWillUnmount(): void;
    render(): React.ReactNode;
}
export default StickySection;
//# sourceMappingURL=StickySection.d.ts.map