1 | import React, { Component } from 'react';
|
2 | import { StretchType, AlignType, TransitionNameType, AnimationType, Point, MotionType } from './interface';
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 | declare type PopupStatus = null | 'measure' | 'align' | 'aligned' | 'afterAlign' | 'beforeMotion' | 'motion' | 'AfterMotion' | 'stable';
|
14 | interface PopupProps {
|
15 | visible?: boolean;
|
16 | style?: React.CSSProperties;
|
17 | getClassNameFromAlign?: (align: AlignType) => string;
|
18 | onAlign?: (element: HTMLElement, align: AlignType) => void;
|
19 | getRootDomNode?: () => HTMLElement;
|
20 | align?: AlignType;
|
21 | destroyPopupOnHide?: boolean;
|
22 | className?: string;
|
23 | prefixCls: string;
|
24 | onMouseEnter?: React.MouseEventHandler<HTMLElement>;
|
25 | onMouseLeave?: React.MouseEventHandler<HTMLElement>;
|
26 | onMouseDown?: React.MouseEventHandler<HTMLElement>;
|
27 | onTouchStart?: React.TouchEventHandler<HTMLElement>;
|
28 | stretch?: StretchType;
|
29 | children?: React.ReactNode;
|
30 | point?: Point;
|
31 | zIndex?: number;
|
32 | mask?: boolean;
|
33 | motion: MotionType;
|
34 | maskMotion: MotionType;
|
35 | animation: AnimationType;
|
36 | transitionName: TransitionNameType;
|
37 | maskAnimation: AnimationType;
|
38 | maskTransitionName: TransitionNameType;
|
39 | }
|
40 | interface PopupState {
|
41 | targetWidth: number;
|
42 | targetHeight: number;
|
43 | status: PopupStatus;
|
44 | prevVisible: boolean;
|
45 | alignClassName: string;
|
46 | }
|
47 | interface AlignRefType {
|
48 | forceAlign: () => void;
|
49 | }
|
50 | declare class Popup extends Component<PopupProps, PopupState> {
|
51 | state: PopupState;
|
52 | popupRef: React.RefObject<HTMLDivElement>;
|
53 | alignRef: React.RefObject<AlignRefType>;
|
54 | private nextFrameState;
|
55 | private nextFrameId;
|
56 | static getDerivedStateFromProps({ visible, ...props }: PopupProps, { prevVisible, status }: PopupState): Partial<PopupState>;
|
57 | componentDidMount(): void;
|
58 | componentDidUpdate(): void;
|
59 | componentWillUnmount(): void;
|
60 | onAlign: (popupDomNode: HTMLElement, align: AlignType) => void;
|
61 | onMotionEnd: () => void;
|
62 | setStateOnNextFrame: (state: Partial<PopupState>) => void;
|
63 | getMotion: () => {
|
64 | motionName?: string | {
|
65 | none?: string;
|
66 | enter?: string;
|
67 | appear?: string;
|
68 | leave?: string;
|
69 | "appear-active"?: string;
|
70 | "enter-active"?: string;
|
71 | "leave-active"?: string;
|
72 | };
|
73 | motionAppear?: boolean;
|
74 | motionEnter?: boolean;
|
75 | motionLeave?: boolean;
|
76 | motionLeaveImmediately?: boolean;
|
77 | removeOnLeave?: boolean;
|
78 | leavedClassName?: string;
|
79 | onAppearStart?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
80 | onAppearActive?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
81 | onAppearEnd?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
82 | onEnterStart?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
83 | onEnterActive?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
84 | onEnterEnd?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
85 | onLeaveStart?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
86 | onLeaveActive?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
87 | onLeaveEnd?: (element: HTMLElement, event: React.TransitionEvent<HTMLElement> | React.AnimationEvent<HTMLElement>) => false | void | React.CSSProperties;
|
88 | };
|
89 | getAlignTarget: () => Point | (() => HTMLElement);
|
90 | getZIndexStyle(): React.CSSProperties;
|
91 | cancelFrameState: () => void;
|
92 | renderPopupElement: () => JSX.Element;
|
93 | renderMaskElement: () => JSX.Element;
|
94 | render(): JSX.Element;
|
95 | }
|
96 | export default Popup;
|