import React, { HTMLProps } from "react";
import { TransitionProps } from "react-transition-group/Transition";
import { Placement, Modifiers } from "popper.js";
import { PopperChildrenProps, PopperProps } from "react-popper";
import { Omit } from "../_type";
import { AttachContainer } from "../_util/get-overlay-root";
export interface OverlayLayerProps {
/**
* 覆盖层内容
* @docType React.ReactNode | ((props: OverlayContentProps) => React.ReactNode)
*/
content: React.ReactNode | ((props: OverlayContentProps) => React.ReactNode);
/**
* 参考的定位内容
*
* 如果提供了 referenceElement,则不通过 `children` 定位,可以实现自定义定位参考
* @see https://github.com/FezVrasta/react-popper#usage-without-a-reference-htmlelement
*/
referenceElement?: PopperProps["referenceElement"];
/**
* 挂载组件的结点
* @default document.body
* @since 2.5.0
*/
popupContainer?: AttachContainer;
/**
* 用于获取覆盖层 DOM Ref
*/
overlayRef?: React.Ref;
/**
* 覆盖层自定义属性,会附加到覆盖层的 div 上
*
* 要使用 `ref`,请传入 `overlayRef`
*/
overlayProps?: HTMLProps;
/**
* 覆盖层相对于定位元素的位置
* @default "bottom-start"
*/
placement?: Placement;
/**
* 覆盖层偏离定位元素的距离
*
* 如: `10`、`"50%"`、`"10 + 10%"`、`[10, 10]`
* @default 5
*/
placementOffset?: number | string | [number | string, number | string];
/**
* 覆盖层是否可见
*/
visible?: boolean;
/**
* 关闭时是否销毁内容元素
* @default true
* @since 2.6.0
*/
destroyOnClose?: boolean;
/**
* 出现时渐变动画时长
* @default { enter: 50, exit: 300 }
*/
transitionTimeout?: TransitionProps["timeout"];
/**
* 是否在 `resize` 和 `scroll` 事件发生的时候更新位置
* @default true
*/
updateOnDimensionChange?: boolean;
/**
* 出现动画滑动距离
* @default 2
*/
animationScaleFrom?: number;
/**
* 是否可以跟随参考元素离开可视范围
* @default false
*/
escapeWithReference?: boolean;
/**
* 距离可视范围空间不足时是否翻转 `placement`
* @default true
* @since 2.7.0
*/
flipped?: boolean;
/**
* 浮层是否使用 `fixed` 定位
* @default true
* @since 2.7.0
*/
positionFixed?: PopperProps["positionFixed"];
/**
* 关闭动画结束时回调
* @since 2.6.0
*/
onExited?: () => void;
/**
* https://popper.js.org/popper-documentation.html#modifiers
*/
modifiers?: Modifiers;
}
export interface OverlayContentProps extends Omit {
visible: boolean;
}
/**
* 为定位元素创建一个覆盖层
*
* @example
*
```js
const [visible, setVisible] = useState(false);
const open = () => setVisible(true);
const close = () => setVisible(false);
我是浮层内容,关闭}
children={ref => 点击弹出浮层}
/>
```
*/
export declare const OverlayLayer: React.ForwardRefExoticComponent>;