1 | import { Component, ReactElement, Ref as ElementRef, ReactNode, ComponentType } from 'react';
|
2 | import { createPortal } from 'react-dom';
|
3 | import { CSSObject } from '@emotion/serialize';
|
4 |
|
5 | import { animatedScrollTo, getBoundingClientObj, RectType, getScrollParent, getScrollTop, scrollTo } from '../utils';
|
6 | import { borderRadius, colors, spacing } from '../theme';
|
7 | import { InnerRef, MenuPlacement, MenuPosition, CommonProps, OptionTypeBase, GroupTypeBase } from '../types';
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 |
|
16 | export interface MenuState {
|
17 | placement: 'bottom' | 'top' | null;
|
18 | maxHeight: number;
|
19 | }
|
20 | export interface PlacementArgs {
|
21 | maxHeight: number;
|
22 | menuEl: ElementRef<any>;
|
23 | minHeight: number;
|
24 | placement: 'bottom' | 'top' | 'auto';
|
25 | shouldScroll: boolean;
|
26 | isFixedPosition: boolean;
|
27 | }
|
28 |
|
29 | export function getMenuPlacement(args: PlacementArgs): MenuState;
|
30 |
|
31 |
|
32 |
|
33 |
|
34 | export type MenuProps<
|
35 | OptionType extends OptionTypeBase,
|
36 | IsMulti extends boolean,
|
37 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
38 | > = CommonProps<OptionType, IsMulti, GroupType> & {
|
39 |
|
40 | children: ReactElement;
|
41 |
|
42 | getPortalPlacement: (state: MenuState) => void;
|
43 |
|
44 | innerProps: object;
|
45 |
|
46 | innerRef: InnerRef;
|
47 |
|
48 | maxMenuHeight: number;
|
49 |
|
50 | menuPlacement: MenuPlacement;
|
51 |
|
52 | menuPosition: MenuPosition;
|
53 |
|
54 | minMenuHeight: number;
|
55 |
|
56 | menuShouldScrollIntoView: boolean;
|
57 | };
|
58 |
|
59 | export function menuCSS(state: MenuState): CSSObject;
|
60 |
|
61 | declare function Menu<
|
62 | OptionType extends OptionTypeBase,
|
63 | IsMulti extends boolean,
|
64 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
65 | // tslint:disable-next-line:no-unnecessary-generics
|
66 | >(props: MenuProps<OptionType, IsMulti, GroupType>): ReactElement;
|
67 |
|
68 | export default Menu;
|
69 |
|
70 |
|
71 |
|
72 |
|
73 |
|
74 | interface MenuListState {
|
75 |
|
76 | isMulti: boolean;
|
77 |
|
78 | maxHeight: number;
|
79 | }
|
80 |
|
81 | export interface MenuListProps {
|
82 |
|
83 | children: ReactNode;
|
84 |
|
85 | innerRef: InnerRef;
|
86 | }
|
87 |
|
88 |
|
89 | export type MenuListComponentProps<
|
90 | OptionType extends OptionTypeBase,
|
91 | IsMulti extends boolean,
|
92 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
93 | > = CommonProps<OptionType, IsMulti, GroupType> & MenuListProps & MenuListState;
|
94 |
|
95 | export function menuListCSS(state: MenuState): CSSObject;
|
96 | export function MenuList<
|
97 | OptionType extends OptionTypeBase,
|
98 | IsMulti extends boolean,
|
99 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
100 | // tslint:disable-next-line:no-unnecessary-generics
|
101 | >(props: MenuListComponentProps<OptionType, IsMulti, GroupType>): ReactElement;
|
102 |
|
103 |
|
104 |
|
105 |
|
106 |
|
107 | export function noOptionsMessageCSS(): CSSObject;
|
108 | export function loadingMessageCSS(): CSSObject;
|
109 |
|
110 | export type NoticeProps<
|
111 | OptionType extends OptionTypeBase,
|
112 | IsMulti extends boolean,
|
113 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
114 | > = CommonProps<OptionType, IsMulti, GroupType> & {
|
115 |
|
116 | children: ReactNode;
|
117 |
|
118 | innerProps: { [key: string]: any };
|
119 | };
|
120 |
|
121 | export function NoOptionsMessage<
|
122 | OptionType extends OptionTypeBase,
|
123 | IsMulti extends boolean,
|
124 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
125 | // tslint:disable-next-line:no-unnecessary-generics
|
126 | >(props: NoticeProps<OptionType, IsMulti, GroupType>): ReactElement;
|
127 |
|
128 |
|
129 |
|
130 |
|
131 | export function LoadingMessage<
|
132 | OptionType extends OptionTypeBase,
|
133 | IsMulti extends boolean,
|
134 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
135 | // tslint:disable-next-line:no-unnecessary-generics
|
136 | >(props: NoticeProps<OptionType, IsMulti, GroupType>): ReactElement;
|
137 |
|
138 |
|
139 |
|
140 |
|
141 |
|
142 |
|
143 |
|
144 |
|
145 | export type MenuPortalProps<
|
146 | OptionType extends OptionTypeBase,
|
147 | IsMulti extends boolean,
|
148 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
149 | > = CommonProps<OptionType, IsMulti, GroupType> & {
|
150 | appendTo: HTMLElement;
|
151 | children: ReactNode;
|
152 | controlElement: HTMLElement;
|
153 | menuPlacement: MenuPlacement;
|
154 | menuPosition: MenuPosition;
|
155 | };
|
156 | interface MenuPortalState {
|
157 | placement: 'bottom' | 'top' | null;
|
158 | }
|
159 | interface PortalStyleArgs {
|
160 | offset: number;
|
161 | position: MenuPosition;
|
162 | rect: RectType;
|
163 | }
|
164 |
|
165 | export function menuPortalCSS(args: PortalStyleArgs): CSSObject;
|
166 |
|
167 | export class MenuPortal<
|
168 | OptionType extends OptionTypeBase,
|
169 | IsMulti extends boolean,
|
170 | GroupType extends GroupTypeBase<OptionType> = GroupTypeBase<OptionType>
|
171 | > extends Component<MenuPortalProps<OptionType, IsMulti, GroupType>, MenuPortalState> {
|
172 |
|
173 | getPortalPlacement: (state: MenuState) => void;
|
174 | }
|