1 | "use strict";
|
2 |
|
3 | var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
4 |
|
5 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
6 |
|
7 | exports.__esModule = true;
|
8 | exports.useDropdownMenu = useDropdownMenu;
|
9 | exports["default"] = void 0;
|
10 |
|
11 | var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
12 |
|
13 | var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
14 |
|
15 | var _propTypes = _interopRequireDefault(require("prop-types"));
|
16 |
|
17 | var _react = _interopRequireWildcard(require("react"));
|
18 |
|
19 | var _useCallbackRef2 = _interopRequireDefault(require("@restart/hooks/useCallbackRef"));
|
20 |
|
21 | var _DropdownContext = _interopRequireDefault(require("./DropdownContext"));
|
22 |
|
23 | var _usePopper = _interopRequireDefault(require("./usePopper"));
|
24 |
|
25 | var _useRootClose = _interopRequireDefault(require("./useRootClose"));
|
26 |
|
27 | var _mergeOptionsWithPopperConfig = _interopRequireDefault(require("./mergeOptionsWithPopperConfig"));
|
28 |
|
29 | var noop = function noop() {};
|
30 |
|
31 |
|
32 |
|
33 |
|
34 |
|
35 |
|
36 |
|
37 |
|
38 |
|
39 |
|
40 |
|
41 |
|
42 | function useDropdownMenu(options) {
|
43 | if (options === void 0) {
|
44 | options = {};
|
45 | }
|
46 |
|
47 | var context = (0, _react.useContext)(_DropdownContext["default"]);
|
48 |
|
49 | var _useCallbackRef = (0, _useCallbackRef2["default"])(),
|
50 | arrowElement = _useCallbackRef[0],
|
51 | attachArrowRef = _useCallbackRef[1];
|
52 |
|
53 | var hasShownRef = (0, _react.useRef)(false);
|
54 | var _options = options,
|
55 | flip = _options.flip,
|
56 | offset = _options.offset,
|
57 | rootCloseEvent = _options.rootCloseEvent,
|
58 | _options$fixed = _options.fixed,
|
59 | fixed = _options$fixed === void 0 ? false : _options$fixed,
|
60 | _options$popperConfig = _options.popperConfig,
|
61 | popperConfig = _options$popperConfig === void 0 ? {} : _options$popperConfig,
|
62 | _options$usePopper = _options.usePopper,
|
63 | shouldUsePopper = _options$usePopper === void 0 ? !!context : _options$usePopper;
|
64 | var show = (context == null ? void 0 : context.show) == null ? !!options.show : context.show;
|
65 | var alignEnd = (context == null ? void 0 : context.alignEnd) == null ? options.alignEnd : context.alignEnd;
|
66 |
|
67 | if (show && !hasShownRef.current) {
|
68 | hasShownRef.current = true;
|
69 | }
|
70 |
|
71 | var handleClose = function handleClose(e) {
|
72 | context == null ? void 0 : context.toggle(false, e);
|
73 | };
|
74 |
|
75 | var _ref = context || {},
|
76 | drop = _ref.drop,
|
77 | setMenu = _ref.setMenu,
|
78 | menuElement = _ref.menuElement,
|
79 | toggleElement = _ref.toggleElement;
|
80 |
|
81 | var placement = alignEnd ? 'bottom-end' : 'bottom-start';
|
82 | if (drop === 'up') placement = alignEnd ? 'top-end' : 'top-start';else if (drop === 'right') placement = alignEnd ? 'right-end' : 'right-start';else if (drop === 'left') placement = alignEnd ? 'left-end' : 'left-start';
|
83 | var popper = (0, _usePopper["default"])(toggleElement, menuElement, (0, _mergeOptionsWithPopperConfig["default"])({
|
84 | placement: placement,
|
85 | enabled: !!(shouldUsePopper && show),
|
86 | enableEvents: show,
|
87 | offset: offset,
|
88 | flip: flip,
|
89 | fixed: fixed,
|
90 | arrowElement: arrowElement,
|
91 | popperConfig: popperConfig
|
92 | }));
|
93 | var menuProps = (0, _extends2["default"])({
|
94 | ref: setMenu || noop,
|
95 | 'aria-labelledby': toggleElement == null ? void 0 : toggleElement.id
|
96 | }, popper.attributes.popper, {
|
97 | style: popper.styles.popper
|
98 | });
|
99 | var metadata = {
|
100 | show: show,
|
101 | alignEnd: alignEnd,
|
102 | hasShown: hasShownRef.current,
|
103 | toggle: context == null ? void 0 : context.toggle,
|
104 | popper: shouldUsePopper ? popper : null,
|
105 | arrowProps: shouldUsePopper ? (0, _extends2["default"])({
|
106 | ref: attachArrowRef
|
107 | }, popper.attributes.arrow, {
|
108 | style: popper.styles.arrow
|
109 | }) : {}
|
110 | };
|
111 | (0, _useRootClose["default"])(menuElement, handleClose, {
|
112 | clickTrigger: rootCloseEvent,
|
113 | disabled: !show
|
114 | });
|
115 | return [menuProps, metadata];
|
116 | }
|
117 |
|
118 | var propTypes = {
|
119 | |
120 |
|
121 |
|
122 |
|
123 |
|
124 |
|
125 |
|
126 |
|
127 |
|
128 |
|
129 |
|
130 |
|
131 |
|
132 |
|
133 |
|
134 |
|
135 |
|
136 |
|
137 |
|
138 |
|
139 |
|
140 |
|
141 | children: _propTypes["default"].func.isRequired,
|
142 |
|
143 | |
144 |
|
145 |
|
146 |
|
147 |
|
148 | show: _propTypes["default"].bool,
|
149 |
|
150 | |
151 |
|
152 |
|
153 |
|
154 |
|
155 | alignEnd: _propTypes["default"].bool,
|
156 |
|
157 | |
158 |
|
159 |
|
160 |
|
161 |
|
162 | flip: _propTypes["default"].bool,
|
163 | usePopper: _propTypes["default"].oneOf([true, false]),
|
164 |
|
165 | |
166 |
|
167 |
|
168 | popperConfig: _propTypes["default"].object,
|
169 |
|
170 | |
171 |
|
172 |
|
173 | rootCloseEvent: _propTypes["default"].string
|
174 | };
|
175 | var defaultProps = {
|
176 | usePopper: true
|
177 | };
|
178 |
|
179 |
|
180 |
|
181 |
|
182 |
|
183 |
|
184 |
|
185 | function DropdownMenu(_ref2) {
|
186 | var children = _ref2.children,
|
187 | options = (0, _objectWithoutPropertiesLoose2["default"])(_ref2, ["children"]);
|
188 |
|
189 | var _useDropdownMenu = useDropdownMenu(options),
|
190 | props = _useDropdownMenu[0],
|
191 | meta = _useDropdownMenu[1];
|
192 |
|
193 | return _react["default"].createElement(_react["default"].Fragment, null, meta.hasShown ? children(props, meta) : null);
|
194 | }
|
195 |
|
196 | DropdownMenu.displayName = 'ReactOverlaysDropdownMenu';
|
197 | DropdownMenu.propTypes = propTypes;
|
198 | DropdownMenu.defaultProps = defaultProps;
|
199 |
|
200 |
|
201 | var _default = DropdownMenu;
|
202 | exports["default"] = _default; |
\ | No newline at end of file |