UNPKG

4.19 kBTypeScriptView Raw
1import PropTypes from 'prop-types';
2import React from 'react';
3import { UsePopperOptions } from './usePopper';
4import { RootCloseOptions } from './useRootClose';
5export interface UseDropdownMenuOptions {
6 flip?: boolean;
7 show?: boolean;
8 alignEnd?: boolean;
9 usePopper?: boolean;
10 rootCloseEvent?: RootCloseOptions['clickTrigger'];
11 popperConfig?: Omit<UsePopperOptions, 'enabled' | 'placement'>;
12}
13export interface UseDropdownMenuValue {
14 show: boolean;
15 alignEnd?: boolean;
16 hasShown: boolean;
17 close: (e: Event) => void;
18 props: {
19 ref: React.RefCallback<HTMLElement>;
20 style?: React.CSSProperties;
21 'aria-labelledby'?: string;
22 };
23 arrowProps: {
24 ref: React.RefCallback<HTMLElement>;
25 style?: React.CSSProperties;
26 };
27}
28/**
29 * @memberOf Dropdown
30 * @param {object} options
31 * @param {boolean} options.flip Automatically adjust the menu `drop` position based on viewport edge detection
32 * @param {boolean} options.show Display the menu manually, ignored in the context of a `Dropdown`
33 * @param {boolean} options.usePopper opt in/out of using PopperJS to position menus. When disabled you must position it yourself.
34 * @param {string} options.rootCloseEvent The pointer event to listen for when determining "clicks outside" the menu for triggering a close.
35 * @param {object} options.popperConfig Options passed to the [`usePopper`](/api/usePopper) hook.
36 */
37export declare function useDropdownMenu(options?: UseDropdownMenuOptions): UseDropdownMenuValue;
38export interface DropdownMenuProps extends UseDropdownMenuOptions {
39 children: (args: UseDropdownMenuValue) => React.ReactNode;
40}
41/**
42 * Also exported as `<Dropdown.Menu>` from `Dropdown`.
43 *
44 * @displayName DropdownMenu
45 * @memberOf Dropdown
46 */
47declare function DropdownMenu({ children, ...options }: DropdownMenuProps): JSX.Element;
48declare namespace DropdownMenu {
49 var displayName: string;
50 var propTypes: {
51 /**
52 * A render prop that returns a Menu element. The `props`
53 * argument should spread through to **a component that can accept a ref**.
54 *
55 * @type {Function ({
56 * show: boolean,
57 * alignEnd: boolean,
58 * close: (?SyntheticEvent) => void,
59 * placement: Placement,
60 * outOfBoundaries: ?boolean,
61 * scheduleUpdate: () => void,
62 * props: {
63 * ref: (?HTMLElement) => void,
64 * style: { [string]: string | number },
65 * aria-labelledby: ?string
66 * },
67 * arrowProps: {
68 * ref: (?HTMLElement) => void,
69 * style: { [string]: string | number },
70 * },
71 * }) => React.Element}
72 */
73 children: PropTypes.Validator<(...args: any[]) => any>;
74 /**
75 * Controls the visible state of the menu, generally this is
76 * provided by the parent `Dropdown` component,
77 * but may also be specified as a prop directly.
78 */
79 show: PropTypes.Requireable<boolean>;
80 /**
81 * Aligns the dropdown menu to the 'end' of it's placement position.
82 * Generally this is provided by the parent `Dropdown` component,
83 * but may also be specified as a prop directly.
84 */
85 alignEnd: PropTypes.Requireable<boolean>;
86 /**
87 * Enables the Popper.js `flip` modifier, allowing the Dropdown to
88 * automatically adjust it's placement in case of overlap with the viewport or toggle.
89 * Refer to the [flip docs](https://popper.js.org/popper-documentation.html#modifiers..flip.enabled) for more info
90 */
91 flip: PropTypes.Requireable<boolean>;
92 usePopper: PropTypes.Requireable<boolean>;
93 /**
94 * A set of popper options and props passed directly to react-popper's Popper component.
95 */
96 popperConfig: PropTypes.Requireable<object>;
97 /**
98 * Override the default event used by RootCloseWrapper.
99 */
100 rootCloseEvent: PropTypes.Requireable<string>;
101 };
102 var defaultProps: {
103 usePopper: boolean;
104 };
105}
106/** @component */
107export default DropdownMenu;