UNPKG

3.5 kBJavaScriptView Raw
1import _extends from "@babel/runtime/helpers/esm/extends";
2import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3import classNames from 'classnames';
4import React, { useContext } from 'react';
5import BaseDropdown from 'react-overlays/Dropdown';
6import { useUncontrolled } from 'uncontrollable';
7import useEventCallback from '@restart/hooks/useEventCallback';
8import DropdownItem from './DropdownItem';
9import DropdownMenu from './DropdownMenu';
10import DropdownToggle from './DropdownToggle';
11import SelectableContext from './SelectableContext';
12import { useBootstrapPrefix } from './ThemeProvider';
13import createWithBsPrefix from './createWithBsPrefix';
14var DropdownHeader = createWithBsPrefix('dropdown-header', {
15 defaultProps: {
16 role: 'heading'
17 }
18});
19var DropdownDivider = createWithBsPrefix('dropdown-divider', {
20 defaultProps: {
21 role: 'separator'
22 }
23});
24var DropdownItemText = createWithBsPrefix('dropdown-item-text', {
25 Component: 'span'
26});
27var defaultProps = {
28 navbar: false
29};
30var Dropdown = /*#__PURE__*/React.forwardRef(function (pProps, ref) {
31 var _useUncontrolled = useUncontrolled(pProps, {
32 show: 'onToggle'
33 }),
34 bsPrefix = _useUncontrolled.bsPrefix,
35 drop = _useUncontrolled.drop,
36 show = _useUncontrolled.show,
37 className = _useUncontrolled.className,
38 alignRight = _useUncontrolled.alignRight,
39 onSelect = _useUncontrolled.onSelect,
40 onToggle = _useUncontrolled.onToggle,
41 focusFirstItemOnShow = _useUncontrolled.focusFirstItemOnShow,
42 _useUncontrolled$as = _useUncontrolled.as,
43 Component = _useUncontrolled$as === void 0 ? 'div' : _useUncontrolled$as,
44 _4 = _useUncontrolled.navbar,
45 props = _objectWithoutPropertiesLoose(_useUncontrolled, ["bsPrefix", "drop", "show", "className", "alignRight", "onSelect", "onToggle", "focusFirstItemOnShow", "as", "navbar"]);
46
47 var onSelectCtx = useContext(SelectableContext);
48 var prefix = useBootstrapPrefix(bsPrefix, 'dropdown');
49 var handleToggle = useEventCallback(function (nextShow, event, source) {
50 if (source === void 0) {
51 source = event.type;
52 }
53
54 if (event.currentTarget === document && (source !== 'keydown' || event.key === 'Escape')) source = 'rootClose';
55
56 if (onToggle) {
57 onToggle(nextShow, event, {
58 source: source
59 });
60 }
61 });
62 var handleSelect = useEventCallback(function (key, event) {
63 if (onSelectCtx) onSelectCtx(key, event);
64 if (onSelect) onSelect(key, event);
65 handleToggle(false, event, 'select');
66 });
67 return /*#__PURE__*/React.createElement(SelectableContext.Provider, {
68 value: handleSelect
69 }, /*#__PURE__*/React.createElement(BaseDropdown, {
70 drop: drop,
71 show: show,
72 alignEnd: alignRight,
73 onToggle: handleToggle,
74 focusFirstItemOnShow: focusFirstItemOnShow,
75 itemSelector: "." + prefix + "-item:not(.disabled):not(:disabled)"
76 }, /*#__PURE__*/React.createElement(Component, _extends({}, props, {
77 ref: ref,
78 className: classNames(className, show && 'show', (!drop || drop === 'down') && prefix, drop === 'up' && 'dropup', drop === 'right' && 'dropright', drop === 'left' && 'dropleft')
79 }))));
80});
81Dropdown.displayName = 'Dropdown';
82Dropdown.defaultProps = defaultProps;
83Dropdown.Divider = DropdownDivider;
84Dropdown.Header = DropdownHeader;
85Dropdown.Item = DropdownItem;
86Dropdown.ItemText = DropdownItemText;
87Dropdown.Menu = DropdownMenu;
88Dropdown.Toggle = DropdownToggle;
89export default Dropdown;
\No newline at end of file