@hi-ui/dropdown 4.0.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +11 -0
- package/lib/cjs/Dropdown.js +258 -0
- package/lib/cjs/Dropdown.js.map +1 -0
- package/lib/cjs/context.js +33 -0
- package/lib/cjs/context.js.map +1 -0
- package/lib/cjs/index.js +22 -0
- package/lib/cjs/index.js.map +1 -0
- package/lib/cjs/styles/index.scss.js +22 -0
- package/lib/cjs/styles/index.scss.js.map +1 -0
- package/lib/cjs/types.js +22 -0
- package/lib/cjs/types.js.map +1 -0
- package/lib/cjs/use-dropdown.js +191 -0
- package/lib/cjs/use-dropdown.js.map +1 -0
- package/lib/cjs/utils/index.js +30 -0
- package/lib/cjs/utils/index.js.map +1 -0
- package/lib/esm/Dropdown.js +230 -0
- package/lib/esm/Dropdown.js.map +1 -0
- package/lib/esm/context.js +25 -0
- package/lib/esm/context.js.map +1 -0
- package/lib/esm/index.js +12 -0
- package/lib/esm/index.js.map +1 -0
- package/lib/esm/styles/index.scss.js +17 -0
- package/lib/esm/styles/index.scss.js.map +1 -0
- package/lib/esm/types.js +17 -0
- package/lib/esm/types.js.map +1 -0
- package/lib/esm/use-dropdown.js +175 -0
- package/lib/esm/use-dropdown.js.map +1 -0
- package/lib/esm/utils/index.js +23 -0
- package/lib/esm/utils/index.js.map +1 -0
- package/lib/types/Dropdown.d.ts +38 -0
- package/lib/types/context.d.ts +7 -0
- package/lib/types/index.d.ts +3 -0
- package/lib/types/types.d.ts +31 -0
- package/lib/types/use-dropdown.d.ts +43 -0
- package/lib/types/utils/index.d.ts +8 -0
- package/package.json +70 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2018 Xiaomi
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,258 @@
|
|
|
1
|
+
/** @LICENSE
|
|
2
|
+
* @hi-ui/dropdown
|
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/dropdown#readme
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) HIUI <mi-hiui@xiaomi.com>.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/
|
|
10
|
+
'use strict';
|
|
11
|
+
|
|
12
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
13
|
+
|
|
14
|
+
Object.defineProperty(exports, '__esModule', {
|
|
15
|
+
value: true
|
|
16
|
+
});
|
|
17
|
+
|
|
18
|
+
var tslib = require('tslib');
|
|
19
|
+
|
|
20
|
+
var React = require('react');
|
|
21
|
+
|
|
22
|
+
var classname = require('@hi-ui/classname');
|
|
23
|
+
|
|
24
|
+
var env = require('@hi-ui/env');
|
|
25
|
+
|
|
26
|
+
var popper = require('@hi-ui/popper');
|
|
27
|
+
|
|
28
|
+
var context = require('./context.js');
|
|
29
|
+
|
|
30
|
+
var useDropdown = require('./use-dropdown.js');
|
|
31
|
+
|
|
32
|
+
var typeAssertion = require('@hi-ui/type-assertion');
|
|
33
|
+
|
|
34
|
+
var Button = require('@hi-ui/button');
|
|
35
|
+
|
|
36
|
+
var icons = require('@hi-ui/icons');
|
|
37
|
+
|
|
38
|
+
function _interopDefaultLegacy(e) {
|
|
39
|
+
return e && _typeof(e) === 'object' && 'default' in e ? e : {
|
|
40
|
+
'default': e
|
|
41
|
+
};
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
45
|
+
|
|
46
|
+
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
|
|
47
|
+
|
|
48
|
+
var _role = 'dropdown';
|
|
49
|
+
|
|
50
|
+
var _prefix = classname.getPrefixCls(_role);
|
|
51
|
+
|
|
52
|
+
var DEFAULT_DATA = [];
|
|
53
|
+
/**
|
|
54
|
+
* TODO: What is Dropdown
|
|
55
|
+
*/
|
|
56
|
+
|
|
57
|
+
var Dropdown = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
58
|
+
var _a$prefixCls = _a.prefixCls,
|
|
59
|
+
prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
|
|
60
|
+
_a$role = _a.role,
|
|
61
|
+
role = _a$role === void 0 ? _role : _a$role,
|
|
62
|
+
className = _a.className,
|
|
63
|
+
_a$data = _a.data,
|
|
64
|
+
data = _a$data === void 0 ? DEFAULT_DATA : _a$data,
|
|
65
|
+
title = _a.title,
|
|
66
|
+
_a$type = _a.type,
|
|
67
|
+
type = _a$type === void 0 ? 'text' : _a$type,
|
|
68
|
+
_onClick = _a.onClick,
|
|
69
|
+
onButtonClick = _a.onButtonClick,
|
|
70
|
+
overlayClassName = _a.overlayClassName,
|
|
71
|
+
rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "data", "title", "type", "onClick", "onButtonClick", "overlayClassName"]);
|
|
72
|
+
|
|
73
|
+
var _b = useDropdown.useDropdown(rest),
|
|
74
|
+
rootProps = _b.rootProps,
|
|
75
|
+
providedValue = tslib.__rest(_b, ["rootProps"]);
|
|
76
|
+
|
|
77
|
+
var getMenuProps = providedValue.getMenuProps,
|
|
78
|
+
getTriggerProps = providedValue.getTriggerProps,
|
|
79
|
+
disabled = providedValue.disabled,
|
|
80
|
+
menuVisibleAction = providedValue.menuVisibleAction;
|
|
81
|
+
var cls = classname.cx(prefixCls, className, disabled && prefixCls + "--disabled");
|
|
82
|
+
|
|
83
|
+
var dig = function dig(treeData) {
|
|
84
|
+
return treeData.map(function (item) {
|
|
85
|
+
var menu = typeAssertion.isArrayNonEmpty(item.children) ? /*#__PURE__*/React__default['default'].createElement(DropdownMenu, {
|
|
86
|
+
popper: {
|
|
87
|
+
gutterGap: 16
|
|
88
|
+
}
|
|
89
|
+
}, dig(item.children)) : null; // TODO: remove it
|
|
90
|
+
|
|
91
|
+
var shouldRenderDivider = item.title === '-';
|
|
92
|
+
|
|
93
|
+
if (shouldRenderDivider) {
|
|
94
|
+
return /*#__PURE__*/React__default['default'].createElement("li", {
|
|
95
|
+
key: item.id,
|
|
96
|
+
className: prefixCls + "-divider"
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
return /*#__PURE__*/React__default['default'].createElement(DropdownMenuItem, {
|
|
101
|
+
key: item.id,
|
|
102
|
+
disabled: item.disabled,
|
|
103
|
+
href: item.href,
|
|
104
|
+
target: item.target,
|
|
105
|
+
value: item.id,
|
|
106
|
+
menu: menu,
|
|
107
|
+
onClick: function onClick() {
|
|
108
|
+
_onClick === null || _onClick === void 0 ? void 0 : _onClick(item.id);
|
|
109
|
+
|
|
110
|
+
if (!typeAssertion.isArray(item.children)) {
|
|
111
|
+
menuVisibleAction.off();
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
}, item.title);
|
|
115
|
+
});
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
return /*#__PURE__*/React__default['default'].createElement(context.DropDownProvider, {
|
|
119
|
+
value: providedValue
|
|
120
|
+
}, /*#__PURE__*/React__default['default'].createElement("div", Object.assign({
|
|
121
|
+
ref: ref,
|
|
122
|
+
role: role,
|
|
123
|
+
className: cls
|
|
124
|
+
}, rootProps), type === 'text' || type === 'button' ? /*#__PURE__*/React__default['default'].createElement(Button__default['default'], Object.assign({}, getTriggerProps(), {
|
|
125
|
+
appearance: type === 'button' ? 'flat' : 'link'
|
|
126
|
+
}), title, /*#__PURE__*/React__default['default'].createElement(icons.DownOutlined, {
|
|
127
|
+
style: {
|
|
128
|
+
marginInlineStart: 2
|
|
129
|
+
}
|
|
130
|
+
})) : null, type === 'group' ? /*#__PURE__*/React__default['default'].createElement(Button.ButtonGroup, null, /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
|
|
131
|
+
onClick: onButtonClick
|
|
132
|
+
}, title), /*#__PURE__*/React__default['default'].createElement(Button__default['default'], Object.assign({
|
|
133
|
+
className: classname.cx(prefixCls + "__icon", prefixCls + "__icon-btn-wrap")
|
|
134
|
+
}, getTriggerProps()), /*#__PURE__*/React__default['default'].createElement(icons.DownOutlined, null))) : null, typeAssertion.isArrayNonEmpty(data) ? /*#__PURE__*/React__default['default'].createElement(DropdownMenu, Object.assign({}, getMenuProps({
|
|
135
|
+
popper: {
|
|
136
|
+
disabledPortal: false,
|
|
137
|
+
className: overlayClassName
|
|
138
|
+
}
|
|
139
|
+
})), dig(data)) : null));
|
|
140
|
+
});
|
|
141
|
+
|
|
142
|
+
if (env.__DEV__) {
|
|
143
|
+
Dropdown.displayName = 'Dropdown';
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
var dropdownButtonPrefix = classname.getPrefixCls('dropdown-button');
|
|
147
|
+
/**
|
|
148
|
+
* TODO: What is DropdownButton
|
|
149
|
+
*/
|
|
150
|
+
|
|
151
|
+
var DropdownButton = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
152
|
+
var _a$prefixCls2 = _a.prefixCls,
|
|
153
|
+
prefixCls = _a$prefixCls2 === void 0 ? dropdownButtonPrefix : _a$prefixCls2,
|
|
154
|
+
_a$role2 = _a.role,
|
|
155
|
+
role = _a$role2 === void 0 ? _role : _a$role2,
|
|
156
|
+
className = _a.className,
|
|
157
|
+
children = _a.children,
|
|
158
|
+
rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children"]);
|
|
159
|
+
|
|
160
|
+
var _useDropDownContext = context.useDropDownContext(),
|
|
161
|
+
getTriggerProps = _useDropDownContext.getTriggerProps;
|
|
162
|
+
|
|
163
|
+
var triggerProps = getTriggerProps();
|
|
164
|
+
var cls = classname.cx(prefixCls, className);
|
|
165
|
+
return /*#__PURE__*/React__default['default'].createElement("div", Object.assign({
|
|
166
|
+
role: role,
|
|
167
|
+
className: cls
|
|
168
|
+
}, rest, triggerProps), children);
|
|
169
|
+
});
|
|
170
|
+
|
|
171
|
+
if (env.__DEV__) {
|
|
172
|
+
DropdownButton.displayName = 'DropdownButton';
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
var dropdownMenuPrefix = classname.getPrefixCls('dropdown-menu');
|
|
176
|
+
/**
|
|
177
|
+
* TODO: What is DropdownMenu
|
|
178
|
+
*/
|
|
179
|
+
|
|
180
|
+
var DropdownMenu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
181
|
+
var _a$prefixCls3 = _a.prefixCls,
|
|
182
|
+
prefixCls = _a$prefixCls3 === void 0 ? dropdownMenuPrefix : _a$prefixCls3,
|
|
183
|
+
popper$1 = _a.popper,
|
|
184
|
+
parents = _a.parents,
|
|
185
|
+
className = _a.className,
|
|
186
|
+
children = _a.children,
|
|
187
|
+
rest = tslib.__rest(_a, ["prefixCls", "role", "popper", "parents", "className", "children"]);
|
|
188
|
+
|
|
189
|
+
var cls = classname.cx(prefixCls, className);
|
|
190
|
+
return /*#__PURE__*/React__default['default'].createElement(popper.PopperPortal, Object.assign({}, popper$1), /*#__PURE__*/React__default['default'].createElement("ul", Object.assign({
|
|
191
|
+
ref: ref,
|
|
192
|
+
className: cls
|
|
193
|
+
}, rest), children ? React__default['default'].Children.map(children, function (child) {
|
|
194
|
+
return /*#__PURE__*/React.cloneElement(child, {
|
|
195
|
+
parents: parents
|
|
196
|
+
});
|
|
197
|
+
}) : children));
|
|
198
|
+
});
|
|
199
|
+
|
|
200
|
+
if (env.__DEV__) {
|
|
201
|
+
DropdownMenu.displayName = 'DropdownMenu';
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
var dropdownMenuItemPrefix = classname.getPrefixCls('dropdown-menu-item');
|
|
205
|
+
/**
|
|
206
|
+
* TODO: What is DropdownMenuItem
|
|
207
|
+
*/
|
|
208
|
+
|
|
209
|
+
var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
210
|
+
var _a$prefixCls4 = _a.prefixCls,
|
|
211
|
+
prefixCls = _a$prefixCls4 === void 0 ? dropdownMenuItemPrefix : _a$prefixCls4,
|
|
212
|
+
className = _a.className,
|
|
213
|
+
children = _a.children,
|
|
214
|
+
href = _a.href,
|
|
215
|
+
target = _a.target,
|
|
216
|
+
disabled = _a.disabled,
|
|
217
|
+
parentsProp = _a.parents,
|
|
218
|
+
menu = _a.menu,
|
|
219
|
+
rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "href", "value", "target", "disabled", "parents", "menu"]);
|
|
220
|
+
|
|
221
|
+
var _useDropDownContext2 = context.useDropDownContext(),
|
|
222
|
+
triggerMethods = _useDropDownContext2.triggerMethods,
|
|
223
|
+
width = _useDropDownContext2.width;
|
|
224
|
+
|
|
225
|
+
var _useDropdown = useDropdown.useDropdown(Object.assign(Object.assign({
|
|
226
|
+
popper: {
|
|
227
|
+
placement: 'right-start',
|
|
228
|
+
disabledPortal: true
|
|
229
|
+
},
|
|
230
|
+
width: width
|
|
231
|
+
}, rest), {
|
|
232
|
+
trigger: triggerMethods,
|
|
233
|
+
parents: parentsProp
|
|
234
|
+
})),
|
|
235
|
+
rootProps = _useDropdown.rootProps,
|
|
236
|
+
getTriggerProps = _useDropdown.getTriggerProps,
|
|
237
|
+
getMenuProps = _useDropdown.getMenuProps;
|
|
238
|
+
|
|
239
|
+
var cls = classname.cx(prefixCls, className);
|
|
240
|
+
var shouldUseLink = href && !disabled;
|
|
241
|
+
return /*#__PURE__*/React__default['default'].createElement("li", Object.assign({
|
|
242
|
+
ref: ref,
|
|
243
|
+
className: cls
|
|
244
|
+
}, rootProps), /*#__PURE__*/React__default['default'].createElement("div", Object.assign({
|
|
245
|
+
className: prefixCls + "__trigger"
|
|
246
|
+
}, getTriggerProps()), shouldUseLink ? /*#__PURE__*/React__default['default'].createElement("a", {
|
|
247
|
+
className: prefixCls + "__link",
|
|
248
|
+
href: href,
|
|
249
|
+
target: target
|
|
250
|
+
}, children) : children), menu ? /*#__PURE__*/React.cloneElement(menu, Object.assign({}, getMenuProps(menu.props))) : null);
|
|
251
|
+
});
|
|
252
|
+
|
|
253
|
+
if (env.__DEV__) {
|
|
254
|
+
DropdownMenuItem.displayName = 'DropdownMenuItem';
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
exports.Dropdown = Dropdown;
|
|
258
|
+
//# sourceMappingURL=Dropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dropdown.js","sources":["../../src/Dropdown.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","DEFAULT_DATA","Dropdown","forwardRef","_a","ref","prefixCls","role","className","data","title","type","onClick","onButtonClick","overlayClassName","rest","_b","useDropdown","rootProps","providedValue","getMenuProps","getTriggerProps","disabled","menuVisibleAction","cls","cx","dig","treeData","map","item","menu","isArrayNonEmpty","children","React","DropdownMenu","popper","gutterGap","shouldRenderDivider","key","id","DropdownMenuItem","href","target","value","isArray","off","DropDownProvider","Button","appearance","DownOutlined","style","marginInlineStart","ButtonGroup","disabledPortal","__DEV__","displayName","dropdownButtonPrefix","DropdownButton","useDropDownContext","triggerProps","dropdownMenuPrefix","parents","PopperPortal","Children","child","cloneElement","dropdownMenuItemPrefix","parentsProp","triggerMethods","width","placement","trigger","shouldUseLink","props"],"mappings":"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"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/** @LICENSE
|
|
2
|
+
* @hi-ui/dropdown
|
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/dropdown#readme
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) HIUI <mi-hiui@xiaomi.com>.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/
|
|
10
|
+
'use strict';
|
|
11
|
+
|
|
12
|
+
Object.defineProperty(exports, '__esModule', {
|
|
13
|
+
value: true
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
var React = require('react');
|
|
17
|
+
|
|
18
|
+
var dropDownContext = /*#__PURE__*/React.createContext(null);
|
|
19
|
+
var DropDownProvider = dropDownContext.Provider;
|
|
20
|
+
|
|
21
|
+
var useDropDownContext = function useDropDownContext() {
|
|
22
|
+
var context = React.useContext(dropDownContext);
|
|
23
|
+
|
|
24
|
+
if (!context) {
|
|
25
|
+
throw new Error('The dropDownContext is not defined, Maybe it should be wrapped in Dropdown.');
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
return context;
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
exports.DropDownProvider = DropDownProvider;
|
|
32
|
+
exports.useDropDownContext = useDropDownContext;
|
|
33
|
+
//# sourceMappingURL=context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.js","sources":["../../src/context.ts"],"sourcesContent":[null],"names":["dropDownContext","createContext","DropDownProvider","Provider","useDropDownContext","context","useContext","Error"],"mappings":";;;;;;;;;;;;;;;;;AAIA,IAAMA,eAAe,gBAAGC,mBAAAA,CAAsC,IAAtCA,CAAxB;IAEaC,gBAAgB,GAAGF,eAAe,CAACG;;IAEnCC,kBAAkB,GAAG,SAArBA,kBAAqB;MAC1BC,OAAO,GAAGC,gBAAAA,CAAWN,eAAXM;;MAEZ,CAACD,SAAS;UACN,IAAIE,KAAJ,CAAU,6EAAV;;;SAGDF;;;;"}
|
package/lib/cjs/index.js
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/** @LICENSE
|
|
2
|
+
* @hi-ui/dropdown
|
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/dropdown#readme
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) HIUI <mi-hiui@xiaomi.com>.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/
|
|
10
|
+
'use strict';
|
|
11
|
+
|
|
12
|
+
Object.defineProperty(exports, '__esModule', {
|
|
13
|
+
value: true
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
require('./styles/index.scss.js');
|
|
17
|
+
|
|
18
|
+
var Dropdown = require('./Dropdown.js');
|
|
19
|
+
|
|
20
|
+
exports.Dropdown = Dropdown.Dropdown;
|
|
21
|
+
exports["default"] = Dropdown.Dropdown;
|
|
22
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/** @LICENSE
|
|
2
|
+
* @hi-ui/dropdown
|
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/dropdown#readme
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) HIUI <mi-hiui@xiaomi.com>.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/
|
|
10
|
+
'use strict';
|
|
11
|
+
|
|
12
|
+
Object.defineProperty(exports, '__esModule', {
|
|
13
|
+
value: true
|
|
14
|
+
});
|
|
15
|
+
var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-dropdown-menu {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n padding: 8px;\n padding: var(--hi-v4-spacing-4, 8px);\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733); }\n.hi-v4-dropdown-menu-item {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n list-style: none;\n width: 200px;\n width: var(--hi-v4-dropdown-menu-item-width, 200px);\n margin: 0;\n box-sizing: border-box;\n overflow: visible; }\n.hi-v4-dropdown-menu-item__link {\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n width: 100%;\n text-decoration: none;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-dropdown-menu-item__trigger {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n cursor: pointer;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 10px 12px;\n padding: var(--hi-v4-spacing-5, 10px) var(--hi-v4-spacing-6, 12px);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-dropdown-menu-item__trigger:hover {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-dropdown-divider {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n list-style: none;\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0);\n width: 100%;\n height: 1px;\n margin: 8px 0;\n margin: var(--hi-v4-spacing-4, 8px) 0; }\n";
|
|
16
|
+
|
|
17
|
+
var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
|
|
18
|
+
|
|
19
|
+
__styleInject__(css_248z);
|
|
20
|
+
|
|
21
|
+
exports["default"] = css_248z;
|
|
22
|
+
//# sourceMappingURL=index.scss.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
|
package/lib/cjs/types.js
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/** @LICENSE
|
|
2
|
+
* @hi-ui/dropdown
|
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/dropdown#readme
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) HIUI <mi-hiui@xiaomi.com>.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/
|
|
10
|
+
'use strict';
|
|
11
|
+
|
|
12
|
+
Object.defineProperty(exports, '__esModule', {
|
|
13
|
+
value: true
|
|
14
|
+
});
|
|
15
|
+
var TriggerActionEnum = {
|
|
16
|
+
CLICK: 'click',
|
|
17
|
+
CONTEXTMENU: 'contextmenu',
|
|
18
|
+
HOVER: 'hover'
|
|
19
|
+
};
|
|
20
|
+
Object.values(TriggerActionEnum);
|
|
21
|
+
exports.TriggerActionEnum = TriggerActionEnum;
|
|
22
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../../src/types.ts"],"sourcesContent":[null],"names":["TriggerActionEnum","CLICK","CONTEXTMENU","HOVER","Object","values"],"mappings":";;;;;;;;;;;;;;IAGaA,iBAAiB,GAAG;AAC/BC,EAAAA,KAAK,EAAE,OADwB;AAE/BC,EAAAA,WAAW,EAAE,aAFkB;AAG/BC,EAAAA,KAAK,EAAE;AAHwB;AAMHC,MAAM,CAACC,MAAPD,CAAcJ,iBAAdI;"}
|
|
@@ -0,0 +1,191 @@
|
|
|
1
|
+
/** @LICENSE
|
|
2
|
+
* @hi-ui/dropdown
|
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/dropdown#readme
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) HIUI <mi-hiui@xiaomi.com>.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/
|
|
10
|
+
'use strict';
|
|
11
|
+
|
|
12
|
+
Object.defineProperty(exports, '__esModule', {
|
|
13
|
+
value: true
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
var tslib = require('tslib');
|
|
17
|
+
|
|
18
|
+
var React = require('react');
|
|
19
|
+
|
|
20
|
+
var types = require('./types.js');
|
|
21
|
+
|
|
22
|
+
var index = require('./utils/index.js');
|
|
23
|
+
|
|
24
|
+
var useToggle = require('@hi-ui/use-toggle');
|
|
25
|
+
|
|
26
|
+
var useLatest = require('@hi-ui/use-latest');
|
|
27
|
+
|
|
28
|
+
var useTimeout = require('@hi-ui/use-timeout');
|
|
29
|
+
|
|
30
|
+
var useUnmountEffect = require('@hi-ui/use-unmount-effect');
|
|
31
|
+
|
|
32
|
+
var classname = require('@hi-ui/classname');
|
|
33
|
+
|
|
34
|
+
var reactUtils = require('@hi-ui/react-utils');
|
|
35
|
+
|
|
36
|
+
var NOOP_ARRAY = [];
|
|
37
|
+
|
|
38
|
+
var useDropdown = function useDropdown(props) {
|
|
39
|
+
var _props$trigger = props.trigger,
|
|
40
|
+
triggerProp = _props$trigger === void 0 ? types.TriggerActionEnum.HOVER : _props$trigger,
|
|
41
|
+
_props$disabled = props.disabled,
|
|
42
|
+
disabled = _props$disabled === void 0 ? false : _props$disabled,
|
|
43
|
+
_props$parents = props.parents,
|
|
44
|
+
parents = _props$parents === void 0 ? NOOP_ARRAY : _props$parents,
|
|
45
|
+
width = props.width,
|
|
46
|
+
popper = props.popper,
|
|
47
|
+
rest = tslib.__rest(props, ["trigger", "disabled", "parents", "width", "popper"]);
|
|
48
|
+
|
|
49
|
+
var triggerElementRef = React.useRef(null);
|
|
50
|
+
var popperElementRef = React.useRef(null);
|
|
51
|
+
/**
|
|
52
|
+
* 抹平数组或字符串结构,同时 memo 处理,减少重渲染
|
|
53
|
+
*/
|
|
54
|
+
|
|
55
|
+
var trigger = index.normalizeTrigger(triggerProp); // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
56
|
+
|
|
57
|
+
var triggerMethods = React.useMemo(function () {
|
|
58
|
+
return trigger;
|
|
59
|
+
}, trigger);
|
|
60
|
+
|
|
61
|
+
var _useUncontrolledToggl = useToggle.useUncontrolledToggle({
|
|
62
|
+
defaultVisible: false,
|
|
63
|
+
disabled: disabled
|
|
64
|
+
}),
|
|
65
|
+
menuVisible = _useUncontrolledToggl[0],
|
|
66
|
+
menuVisibleAction = _useUncontrolledToggl[1];
|
|
67
|
+
/**
|
|
68
|
+
* 维护 trigger 元素 或 tooltip 弹出层元素的 hover 态
|
|
69
|
+
*/
|
|
70
|
+
|
|
71
|
+
|
|
72
|
+
var hoveringRef = React.useRef(false);
|
|
73
|
+
|
|
74
|
+
var _useTimeout = useTimeout.useTimeout(function () {
|
|
75
|
+
if (disabled) return;
|
|
76
|
+
menuVisibleAction.on();
|
|
77
|
+
}, 0),
|
|
78
|
+
startOpenTimer = _useTimeout.start,
|
|
79
|
+
clearOpenTimer = _useTimeout.clear;
|
|
80
|
+
|
|
81
|
+
var _useTimeout2 = useTimeout.useTimeout(function () {
|
|
82
|
+
if (disabled) return;
|
|
83
|
+
if (hoveringRef.current) return;
|
|
84
|
+
menuVisibleAction.off();
|
|
85
|
+
}, 100),
|
|
86
|
+
startCloseTimer = _useTimeout2.start,
|
|
87
|
+
clearCloseTimer = _useTimeout2.clear;
|
|
88
|
+
|
|
89
|
+
var clearToggleTimer = React.useCallback(function () {
|
|
90
|
+
clearOpenTimer();
|
|
91
|
+
clearCloseTimer();
|
|
92
|
+
}, [clearOpenTimer, clearCloseTimer]);
|
|
93
|
+
useUnmountEffect.useUnmountEffect(clearToggleTimer);
|
|
94
|
+
var handlePopperLeave = useLatest.useLatestCallback(function (evt) {
|
|
95
|
+
hoveringRef.current = false; // if (triggerElementRef.current?.contains(evt.target as HTMLElement)) return
|
|
96
|
+
|
|
97
|
+
clearOpenTimer();
|
|
98
|
+
startCloseTimer();
|
|
99
|
+
});
|
|
100
|
+
var handlePopperEnter = useLatest.useLatestCallback(function () {
|
|
101
|
+
if (disabled) return;
|
|
102
|
+
hoveringRef.current = true;
|
|
103
|
+
startOpenTimer();
|
|
104
|
+
});
|
|
105
|
+
/**
|
|
106
|
+
* 事件收集
|
|
107
|
+
* 'click' | 'contextmenu' | 'hover'
|
|
108
|
+
*/
|
|
109
|
+
|
|
110
|
+
var eventHandler = React.useMemo(function () {
|
|
111
|
+
return triggerMethods.reduce(function (acc, cur) {
|
|
112
|
+
switch (cur) {
|
|
113
|
+
case types.TriggerActionEnum.HOVER:
|
|
114
|
+
acc.onMouseEnter = handlePopperEnter;
|
|
115
|
+
acc.onMouseLeave = handlePopperLeave;
|
|
116
|
+
break;
|
|
117
|
+
|
|
118
|
+
case types.TriggerActionEnum.CONTEXTMENU:
|
|
119
|
+
acc.onContextMenu = function (evt) {
|
|
120
|
+
evt.preventDefault();
|
|
121
|
+
menuVisibleAction.not();
|
|
122
|
+
};
|
|
123
|
+
|
|
124
|
+
break;
|
|
125
|
+
|
|
126
|
+
case types.TriggerActionEnum.CLICK:
|
|
127
|
+
acc.onClick = menuVisibleAction.not;
|
|
128
|
+
break;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
return acc;
|
|
132
|
+
}, {});
|
|
133
|
+
}, [triggerMethods, menuVisibleAction, handlePopperEnter, handlePopperLeave]);
|
|
134
|
+
var getTriggerProps = React.useCallback(function () {
|
|
135
|
+
return Object.assign({
|
|
136
|
+
ref: triggerElementRef,
|
|
137
|
+
disabled: disabled
|
|
138
|
+
}, eventHandler);
|
|
139
|
+
}, [eventHandler, disabled]);
|
|
140
|
+
var rootProps = rest;
|
|
141
|
+
var getMenuProps = useLatest.useLatestCallback(function (props, ref) {
|
|
142
|
+
var _Object$assign;
|
|
143
|
+
|
|
144
|
+
if (props === void 0) {
|
|
145
|
+
props = {};
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
if (ref === void 0) {
|
|
149
|
+
ref = null;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
var menuParents = parents.concat(triggerElementRef);
|
|
153
|
+
var menuProps = Object.assign(Object.assign({}, props), {
|
|
154
|
+
ref: reactUtils.mergeRefs(popperElementRef, ref),
|
|
155
|
+
parents: menuParents,
|
|
156
|
+
style: Object.assign(Object.assign({}, props.style), (_Object$assign = {}, _Object$assign[classname.getPrefixStyleVar('dropdown-menu-item-width')] = width + "px", _Object$assign)),
|
|
157
|
+
popper: Object.assign(Object.assign(Object.assign({}, popper), props.popper), {
|
|
158
|
+
closeOnOutsideClick: true,
|
|
159
|
+
visible: menuVisible,
|
|
160
|
+
attachEl: triggerElementRef.current,
|
|
161
|
+
onClose: menuVisibleAction.off
|
|
162
|
+
})
|
|
163
|
+
});
|
|
164
|
+
|
|
165
|
+
if (triggerMethods.includes(types.TriggerActionEnum.HOVER)) {
|
|
166
|
+
// @ts-ignore
|
|
167
|
+
menuProps.onMouseEnter = function () {
|
|
168
|
+
hoveringRef.current = true;
|
|
169
|
+
}; // @ts-ignore
|
|
170
|
+
|
|
171
|
+
|
|
172
|
+
menuProps.onMouseLeave = handlePopperLeave;
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
return menuProps;
|
|
176
|
+
});
|
|
177
|
+
return {
|
|
178
|
+
width: width,
|
|
179
|
+
rootProps: rootProps,
|
|
180
|
+
disabled: disabled,
|
|
181
|
+
menuVisible: menuVisible,
|
|
182
|
+
menuVisibleAction: menuVisibleAction,
|
|
183
|
+
triggerElementRef: triggerElementRef,
|
|
184
|
+
triggerMethods: triggerMethods,
|
|
185
|
+
getTriggerProps: getTriggerProps,
|
|
186
|
+
getMenuProps: getMenuProps
|
|
187
|
+
};
|
|
188
|
+
};
|
|
189
|
+
|
|
190
|
+
exports.useDropdown = useDropdown;
|
|
191
|
+
//# sourceMappingURL=use-dropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-dropdown.js","sources":["../../src/use-dropdown.tsx"],"sourcesContent":[null],"names":["NOOP_ARRAY","useDropdown","props","trigger","triggerProp","TriggerActionEnum","HOVER","disabled","parents","width","popper","rest","triggerElementRef","useRef","popperElementRef","normalizeTrigger","triggerMethods","useMemo","useUncontrolledToggle","defaultVisible","menuVisible","menuVisibleAction","hoveringRef","useTimeout","on","startOpenTimer","start","clearOpenTimer","clear","current","off","startCloseTimer","clearCloseTimer","clearToggleTimer","useCallback","useUnmountEffect","handlePopperLeave","useLatestCallback","evt","handlePopperEnter","eventHandler","reduce","acc","cur","onMouseEnter","onMouseLeave","CONTEXTMENU","onContextMenu","preventDefault","not","CLICK","onClick","getTriggerProps","ref","rootProps","getMenuProps","menuParents","concat","menuProps","mergeRefs","style","getPrefixStyleVar","closeOnOutsideClick","visible","attachEl","onClose","includes"],"mappings":"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"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/** @LICENSE
|
|
2
|
+
* @hi-ui/dropdown
|
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/dropdown#readme
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) HIUI <mi-hiui@xiaomi.com>.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/
|
|
10
|
+
'use strict';
|
|
11
|
+
|
|
12
|
+
Object.defineProperty(exports, '__esModule', {
|
|
13
|
+
value: true
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
var typeAssertion = require('@hi-ui/type-assertion');
|
|
17
|
+
/**
|
|
18
|
+
* 抹平 trigger 结构为数组
|
|
19
|
+
*
|
|
20
|
+
* @param trigger
|
|
21
|
+
* @returns
|
|
22
|
+
*/
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
var normalizeTrigger = function normalizeTrigger(trigger) {
|
|
26
|
+
return typeAssertion.isArray(trigger) ? Array.from(new Set(trigger)) : [trigger];
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
exports.normalizeTrigger = normalizeTrigger;
|
|
30
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/utils/index.ts"],"sourcesContent":[null],"names":["normalizeTrigger","trigger","isArray","Array","from","Set"],"mappings":";;;;;;;;;;;;;;;;AAGA;;;;;;;;IAMaA,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,OAAD;SAC9BC,qBAAAA,CAAQD,OAARC,IAAmBC,KAAK,CAACC,IAAND,CAAW,IAAIE,GAAJ,CAAQJ,OAAR,CAAXE,CAAnBD,GAAkD,CAACD,OAAD;;;"}
|