UNPKG

4.93 kBTypeScriptView Raw
1import * as React from 'react';
2import { Instance, Options, OptionsGeneric, VirtualElement } from '@popperjs/core';
3import { PortalProps } from '../Portal';
4import { SlotComponentProps } from '../utils/types';
5import { PolymorphicProps } from '../utils/PolymorphicComponent';
6export type PopperPlacementType = Options['placement'];
7export interface PopperRootSlotPropsOverrides {
8}
9export interface PopperTransitionProps {
10 in: boolean;
11 onEnter: () => void;
12 onExited: () => void;
13}
14export interface PopperChildrenProps {
15 placement: PopperPlacementType;
16 TransitionProps?: PopperTransitionProps;
17}
18export interface PopperOwnProps {
19 /**
20 * An HTML element, [virtualElement](https://popper.js.org/docs/v2/virtual-elements/),
21 * or a function that returns either.
22 * It's used to set the position of the popper.
23 * The return value will passed as the reference object of the Popper instance.
24 */
25 anchorEl?: null | VirtualElement | HTMLElement | (() => HTMLElement) | (() => VirtualElement);
26 /**
27 * Popper render function or node.
28 */
29 children?: React.ReactNode | ((props: PopperChildrenProps) => React.ReactNode);
30 /**
31 * An HTML element or function that returns one.
32 * The `container` will have the portal children appended to it.
33 *
34 * You can also provide a callback, which is called in a React layout effect.
35 * This lets you set the container from a ref, and also makes server-side rendering possible.
36 *
37 * By default, it uses the body of the top-level document object,
38 * so it's simply `document.body` most of the time.
39 */
40 container?: PortalProps['container'];
41 /**
42 * Direction of the text.
43 * @default 'ltr'
44 */
45 direction?: 'ltr' | 'rtl';
46 /**
47 * The `children` will be under the DOM hierarchy of the parent component.
48 * @default false
49 */
50 disablePortal?: PortalProps['disablePortal'];
51 /**
52 * Always keep the children in the DOM.
53 * This prop can be useful in SEO situation or
54 * when you want to maximize the responsiveness of the Popper.
55 * @default false
56 */
57 keepMounted?: boolean;
58 /**
59 * Popper.js is based on a "plugin-like" architecture,
60 * most of its features are fully encapsulated "modifiers".
61 *
62 * A modifier is a function that is called each time Popper.js needs to
63 * compute the position of the popper.
64 * For this reason, modifiers should be very performant to avoid bottlenecks.
65 * To learn how to create a modifier, [read the modifiers documentation](https://popper.js.org/docs/v2/modifiers/).
66 */
67 modifiers?: Options['modifiers'];
68 /**
69 * If `true`, the component is shown.
70 */
71 open: boolean;
72 /**
73 * Popper placement.
74 * @default 'bottom'
75 */
76 placement?: PopperPlacementType;
77 /**
78 * Options provided to the [`Popper.js`](https://popper.js.org/docs/v2/constructors/#options) instance.
79 * @default {}
80 */
81 popperOptions?: Partial<OptionsGeneric<any>>;
82 /**
83 * A ref that points to the used popper instance.
84 */
85 popperRef?: React.Ref<Instance>;
86 /**
87 * The props used for each slot inside the Popper.
88 * @default {}
89 */
90 slotProps?: {
91 root?: SlotComponentProps<'div', PopperRootSlotPropsOverrides, PopperOwnerState>;
92 };
93 /**
94 * The components used for each slot inside the Popper.
95 * Either a string to use a HTML element or a component.
96 * @default {}
97 */
98 slots?: PopperSlots;
99 /**
100 * Help supporting a react-transition-group/Transition component.
101 * @default false
102 */
103 transition?: boolean;
104}
105export interface PopperSlots {
106 /**
107 * The component that renders the root.
108 * @default 'div'
109 */
110 root?: React.ElementType;
111}
112export type PopperOwnerState = PopperOwnProps;
113export interface PopperTypeMap<AdditionalProps = {}, RootComponentType extends React.ElementType = 'div'> {
114 props: PopperOwnProps & AdditionalProps;
115 defaultComponent: RootComponentType;
116}
117export type PopperProps<RootComponentType extends React.ElementType = PopperTypeMap['defaultComponent']> = PolymorphicProps<PopperTypeMap<{}, RootComponentType>, RootComponentType>;
118export type PopperTooltipOwnProps = Omit<PopperOwnProps, 'container' | 'keepMounted' | 'transition'> & {
119 TransitionProps?: PopperTransitionProps;
120};
121export interface PopperTooltipTypeMap<AdditionalProps = {}, RootComponentType extends React.ElementType = 'div'> {
122 props: PopperTooltipOwnProps & AdditionalProps;
123 defaultComponent: RootComponentType;
124}
125export type PopperTooltipProps<RootComponentType extends React.ElementType = PopperTooltipTypeMap['defaultComponent']> = PolymorphicProps<PopperTooltipTypeMap<{}, RootComponentType>, RootComponentType>;
126export interface PopperRootSlotProps {
127 className?: string;
128 ref: React.Ref<any>;
129 ownerState: PopperOwnerState;
130}
131
\No newline at end of file