/** @module @airtable/blocks/ui: Popover */ /** */ import PropTypes from 'prop-types'; import * as React from 'react'; import { ObjectValues, FlowAnyObject } from '../private_utils'; /** * Dictates how a {@link Tooltip} component should be positioned relative * to the anchor element. Accessed via `Tooltip.placements`. */ export declare enum PopoverPlacements { /** Positions the popover above the anchor element. */ TOP = "top", /** Positions the popover below the anchor element. */ BOTTOM = "bottom", /** Positions the popover so it's center aligned with the anchor element. */ CENTER = "center", /** Positions the popover left of the anchor element. */ LEFT = "left", /** Positions the popover right of the anchor element. */ RIGHT = "right" } /** * Any of the supported {@link PopoverPlacements} for horizontal positioning. */ export type PopoverPlacementX = PopoverPlacements.LEFT | PopoverPlacements.CENTER | PopoverPlacements.RIGHT; /** * Any of the supported {@link PopoverPlacements} for vertical positioning. */ export type PopoverPlacementY = PopoverPlacements.TOP | PopoverPlacements.CENTER | PopoverPlacements.BOTTOM; /** * Dictates how a {@link Popover} or {@link Tooltip} component should be kept within the viewport. Accessed via `Popover.fitInWindowModes` or `Tooltip.fitInWindowModes`. */ export declare enum FitInWindowModes { /** Allow the popover to be placed offscreen. */ NONE = "none", /** If the popover would be placed offscreen, flip the placement to the other side. */ FLIP = "flip", /** If the popover would be placed offscreen, nudge the popover just enough so that it stays in the viewport. */ NUDGE = "nudge" } /** * Any of the supported {@link FitInWindowModes}. */ export type FitInWindowMode = ObjectValues; /** * Props for the {@link Popover} component. * * @hidden */ interface PopoverProps { /** Child elements to render. */ children: React.ReactElement; /** The horizontal placement of the popover. Defaults to {@link PopoverPlacements.RIGHT}. */ placementX: PopoverPlacementX; /** The vertical placement of the popover. Defaults to {@link PopoverPlacements.CENTER}. */ placementY: PopoverPlacementY; /** The horizontal offset, in pixels, of the popover. If `placementX` is set to {@link PopoverPlacements.LEFT}, a higher number will move the popover to the left. If `placementX` is set to {@link PopoverPlacements.RIGHT}, a higher number moves the popover to the right. If `placementX` is set to {@link PopoverPlacements.CENTER}, this value has no effect. Defaults to 0. */ placementOffsetX: number; /** The vertical offset, in pixels, of the popover. If `placementY` is set to {@link PopoverPlacements.TOP}, a higher number will move the popover upward. If `placementY` is set to {@link PopoverPlacements.BOTTOM}, a higher number moves the popover downard. If `placementY` is set to {@link PopoverPlacements.CENTER}, this value has no effect. Defaults to 0. */ placementOffsetY: number; /** A function that returns the contents of the popover as React elements. */ renderContent: () => React.ReactElement; /** Dictates the behavior when the "normal" placement of the popover would be outside of the viewport. Defaults to {@link FitInWindowModes.FLIP}. */ fitInWindowMode: FitInWindowMode; /** A function that will be called when the popover closes. */ onClose?: () => void; /** A boolean that dictates whether the popover is open. */ isOpen: boolean; /** Extra class names for the background of the popover, separated by spaces. */ backgroundClassName?: string; /** Extra styles for the background of the popover. */ backgroundStyle?: FlowAnyObject; } /** * A popover component, which is used to "float" some content above some other content. * * @hidden * @docsPath UI/components/Popover * @component */ declare class Popover extends React.Component { /** @hidden */ static placements: typeof PopoverPlacements; /** @hidden */ static fitInWindowModes: typeof FitInWindowModes; /** @hidden */ static propTypes: { children: PropTypes.Validator; renderContent: PropTypes.Validator<(...args: any[]) => any>; placementX: PropTypes.Requireable; placementY: PropTypes.Requireable; placementOffsetX: PropTypes.Requireable; placementOffsetY: PropTypes.Requireable; fitInWindowMode: PropTypes.Requireable>; onClose: PropTypes.Requireable<(...args: any[]) => any>; isOpen: PropTypes.Requireable; backgroundClassName: PropTypes.Requireable; backgroundStyle: PropTypes.Requireable; }; /** @hidden */ static defaultProps: { placementX: PopoverPlacements; placementY: PopoverPlacements; placementOffsetX: number; placementOffsetY: number; fitInWindowMode: FitInWindowModes; isOpen: boolean; }; /** @hidden */ constructor(props: PopoverProps); /** @hidden */ componentDidMount(): void; /** @hidden */ UNSAFE_componentWillReceiveProps(nextProps: PopoverProps): void; /** @hidden */ componentDidUpdate(): void; /** @hidden */ componentWillUnmount(): void; /** @hidden */ render(): React.ReactElement> & React.ReactNode; } export default Popover; //# sourceMappingURL=popover.d.ts.map