@withjoy/joykit/lib/packages/core/components/Overlay/Overlay.d.ts

UI Component Library for Joy web

import React, { SyntheticEvent } from 'react';
import { OverlayContextType } from './OverlayContext';
import { SimpleInterpolation } from 'styled-components';
import { Props } from '../../common/props';
export interface OverlayableProps {
    /**
     * Whether pressing the `esc` should invoke `onClose`.
     */
    canCloseOnEscapeKey?: boolean;
    /**
     * Whether clicking outside the overlay element should invoke `onClose`.
     */
    canCloseOnOutsideClick?: boolean;
    /**
     * Whether a backdrop element rendered behind the overlayed element.
     */
    useBackdrop?: boolean;
    /**
     * Whether the overlay should be wrapped in a portal.
     *
     * Set this prop to `false` on nested overlays to ensure that they are rendered above their parents.
     */
    usePortal?: boolean;
    /**
     * A callback to be invoked when user interaction causes the overlay to close.
     */
    onClose?: (e: SyntheticEvent<HTMLElement>) => void;
    /**
     * Callback fired after the "entering" status is applied.
     */
    onEntering?: () => void;
    /**
     * A callback to be invoked when the open transition ends and the element has been added to the DOM.
     */
    onEntered?: () => void;
    /**
     * Callback fired after the "exiting" status is applied.
     */
    onExiting?: () => void;
    /**
     * A callback to be invoked when the close transition ends and the element has been removed from the DOM.
     */
    onExited?: () => void;
}
export interface OverlayProps extends OverlayableProps, Props {
    overlayKey: string;
    children: React.ReactNode;
}
interface InternalOverlayProps {
    containerElement: HTMLElement | null;
}
interface OverlayState {
}
export declare class Overlay extends React.Component<OverlayProps & InternalOverlayProps & {
    isOpen: boolean;
    overlayStyles?: SimpleInterpolation;
}, OverlayState, OverlayContextType> {
    static contextType: React.Context<OverlayContextType>;
    static displayName: string;
    /**
     * Currently active overlay's that are added upon `isOpen` change.
     */
    static overlayStack: Overlay[];
    static defaultProps: {
        usePortal: boolean;
        useBackdrop: boolean;
        canCloseOnEscapeKey: boolean;
        canCloseOnOutsideClick: boolean;
    };
    state: {};
    containerRef: HTMLElement | null;
    componentDidMount(): void;
    componentDidUpdate(): void;
    componentWillUnmount(): void;
    handleDocumentMousedown: EventListener;
    handleDocumentKeydown: EventListener;
    render(): JSX.Element;
    private renderChildren;
    private renderBackdrop;
    toggleBodyScroll: () => void;
    private getCurrentAndFollowingOverlays;
    private isCurrentOverlay;
    private prepare;
    private prepareToOpen;
    /**
     * Perform cleanup
     */
    private prepareToClose;
}
export {};