1 | import React from 'react';
|
2 | import PropTypes from 'prop-types';
|
3 | import { DropDirection } from './DropdownContext';
|
4 | import DropdownMenu from './DropdownMenu';
|
5 | import DropdownToggle from './DropdownToggle';
|
6 | export interface DropdownInjectedProps {
|
7 | onKeyDown: React.KeyboardEventHandler;
|
8 | }
|
9 | export interface DropdownProps {
|
10 | drop?: DropDirection;
|
11 | alignEnd?: boolean;
|
12 | defaultShow?: boolean;
|
13 | show?: boolean;
|
14 | onToggle: (nextShow: boolean, event?: React.SyntheticEvent) => void;
|
15 | itemSelector?: string;
|
16 | focusFirstItemOnShow?: false | true | 'keyboard';
|
17 | children: (arg: {
|
18 | props: DropdownInjectedProps;
|
19 | }) => React.ReactNode;
|
20 | }
|
21 | /**
|
22 | * @displayName Dropdown
|
23 | */
|
24 | declare function Dropdown({ drop, alignEnd, defaultShow, show: rawShow, onToggle: rawOnToggle, itemSelector, focusFirstItemOnShow, children, }: DropdownProps): JSX.Element;
|
25 | declare namespace Dropdown {
|
26 | var displayName: string;
|
27 | var propTypes: {
|
28 | /**
|
29 | * A render prop that returns the root dropdown element. The `props`
|
30 | * argument should spread through to an element containing _both_ the
|
31 | * menu and toggle in order to handle keyboard events for focus management.
|
32 | *
|
33 | * @type {Function ({
|
34 | * props: {
|
35 | * onKeyDown: (SyntheticEvent) => void,
|
36 | * },
|
37 | * }) => React.Element}
|
38 | */
|
39 | children: PropTypes.Validator<(...args: any[]) => any>;
|
40 | /**
|
41 | * Determines the direction and location of the Menu in relation to it's Toggle.
|
42 | */
|
43 | drop: PropTypes.Requireable<string>;
|
44 | /**
|
45 | * Controls the focus behavior for when the Dropdown is opened. Set to
|
46 | * `true` to always focus the first menu item, `keyboard` to focus only when
|
47 | * navigating via the keyboard, or `false` to disable completely
|
48 | *
|
49 | * The Default behavior is `false` **unless** the Menu has a `role="menu"`
|
50 | * where it will default to `keyboard` to match the recommended [ARIA Authoring practices](https://www.w3.org/TR/wai-aria-practices-1.1/#menubutton).
|
51 | */
|
52 | focusFirstItemOnShow: PropTypes.Requireable<string | boolean>;
|
53 | /**
|
54 | * A css slector string that will return __focusable__ menu items.
|
55 | * Selectors should be relative to the menu component:
|
56 | * e.g. ` > li:not('.disabled')`
|
57 | */
|
58 | itemSelector: PropTypes.Requireable<string>;
|
59 | /**
|
60 | * Align the menu to the 'end' side of the placement side of the Dropdown toggle. The default placement is `top-start` or `bottom-start`.
|
61 | */
|
62 | alignEnd: PropTypes.Requireable<boolean>;
|
63 | /**
|
64 | * Whether or not the Dropdown is visible.
|
65 | *
|
66 | * @controllable onToggle
|
67 | */
|
68 | show: PropTypes.Requireable<boolean>;
|
69 | /**
|
70 | * Sets the initial show position of the Dropdown.
|
71 | */
|
72 | defaultShow: PropTypes.Requireable<boolean>;
|
73 | /**
|
74 | * A callback fired when the Dropdown wishes to change visibility. Called with the requested
|
75 | * `show` value, the DOM event, and the source that fired it: `'click'`,`'keydown'`,`'rootClose'`, or `'select'`.
|
76 | *
|
77 | * ```ts static
|
78 | * function(
|
79 | * isOpen: boolean,
|
80 | * event: SyntheticEvent,
|
81 | * ): void
|
82 | * ```
|
83 | *
|
84 | * @controllable show
|
85 | */
|
86 | onToggle: PropTypes.Requireable<(...args: any[]) => any>;
|
87 | };
|
88 | var Menu: typeof DropdownMenu;
|
89 | var Toggle: typeof DropdownToggle;
|
90 | }
|
91 | export default Dropdown;
|