@hi-ui/dropdown 5.0.0-canary.1 → 5.0.0-canary.10

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.
Files changed (7) hide show
  1. package/CHANGELOG.md +112 -0
  2. package/lib/cjs/Dropdown.js +29 -14
  3. package/lib/cjs/styles/index.scss.js +1 -1
  4. package/lib/esm/Dropdown.js +29 -14
  5. package/lib/esm/styles/index.scss.js +1 -1
  6. package/lib/types/Dropdown.d.ts +1 -1
  7. package/package.json +18 -18
package/CHANGELOG.md CHANGED
@@ -1,5 +1,117 @@
1
1
  # @hi-ui/dropdown
2
2
 
3
+ ## 5.0.0-canary.10
4
+
5
+ ### Patch Changes
6
+
7
+ - d1e7ade1e: styles: 主题定制功能完善&&样式变量化写法改造&&兼容 RTL (5.0)
8
+ - Updated dependencies [d1e7ade1e]
9
+ - Updated dependencies [da16450b4]
10
+ - @hi-ui/button@5.0.0-canary.13
11
+ - @hi-ui/popper@5.0.0-canary.12
12
+ - @hi-ui/icons@5.0.0-canary.8
13
+
14
+ ## 5.0.0-canary.9
15
+
16
+ ### Patch Changes
17
+
18
+ - 1f9c6e335: perf: 优化全局 size 配置,对于组件中没有的 size 值,取最接近的尺寸展示 (5.0)
19
+ - 22db9cf70: style: fix ui bug (5.0)
20
+ - Updated dependencies [d97cc24eb]
21
+ - Updated dependencies [1f9c6e335]
22
+ - Updated dependencies [22db9cf70]
23
+ - @hi-ui/popper@5.0.0-canary.9
24
+ - @hi-ui/core@5.0.0-canary.6
25
+ - @hi-ui/button@5.0.0-canary.12
26
+
27
+ ## 5.0.0-canary.8
28
+
29
+ ### Minor Changes
30
+
31
+ - 922686dcc: feat(global-context): 增加 size api 全局配置 (5.0)
32
+
33
+ ### Patch Changes
34
+
35
+ - 86877b241: style: 修改样式问题 (5.0)
36
+ - 70f9e99a1: chore(dropdown): 点击选项时阻止 click 事件冒泡 (5.0)
37
+ - Updated dependencies [86877b241]
38
+ - Updated dependencies [922686dcc]
39
+ - Updated dependencies [8e969ad73]
40
+ - @hi-ui/button@5.0.0-canary.11
41
+ - @hi-ui/popper@5.0.0-canary.8
42
+ - @hi-ui/core@5.0.0-canary.5
43
+ - @hi-ui/icons@5.0.0-canary.5
44
+
45
+ ## 5.0.0-canary.7
46
+
47
+ ### Patch Changes
48
+
49
+ - 1bb79f984: style(dropdown): 增加下拉菜单的最大高度和垂直溢出处理 (5.0)
50
+
51
+ ## 5.0.0-canary.6
52
+
53
+ ### Patch Changes
54
+
55
+ - efce04a26: fix: 修改 UI 问题 (5.0)
56
+ - Updated dependencies [efce04a26]
57
+ - Updated dependencies [9106dca82]
58
+ - @hi-ui/popper@5.0.0-canary.6
59
+ - @hi-ui/core@5.0.0-canary.3
60
+ - @hi-ui/icons@5.0.0-canary.3
61
+ - @hi-ui/button@5.0.0-canary.8
62
+
63
+ ## 5.0.0-canary.5
64
+
65
+ ### Patch Changes
66
+
67
+ - chore: rebase master (5.0)
68
+ - Updated dependencies
69
+ - @hi-ui/core@5.0.0-canary.2
70
+ - @hi-ui/use-latest@5.0.0-canary.2
71
+ - @hi-ui/use-timeout@5.0.0-canary.2
72
+ - @hi-ui/use-toggle@5.0.0-canary.2
73
+ - @hi-ui/use-unmount-effect@5.0.0-canary.2
74
+ - @hi-ui/icons@5.0.0-canary.2
75
+ - @hi-ui/button@5.0.0-canary.5
76
+ - @hi-ui/popper@5.0.0-canary.3
77
+ - @hi-ui/classname@5.0.0-canary.2
78
+ - @hi-ui/dom-utils@5.0.0-canary.2
79
+ - @hi-ui/env@5.0.0-canary.2
80
+ - @hi-ui/react-utils@5.0.0-canary.2
81
+ - @hi-ui/type-assertion@5.0.0-canary.2
82
+
83
+ ## 5.0.0-canary.4
84
+
85
+ ### Patch Changes
86
+
87
+ - 4b09e728b: build: 将 package.json 中 exports 配置中的 types 配置放在最上面 (5.0)
88
+ - Updated dependencies [4b09e728b]
89
+ - @hi-ui/core@5.0.0-canary.1
90
+ - @hi-ui/use-latest@5.0.0-canary.1
91
+ - @hi-ui/use-timeout@5.0.0-canary.1
92
+ - @hi-ui/use-toggle@5.0.0-canary.1
93
+ - @hi-ui/use-unmount-effect@5.0.0-canary.1
94
+ - @hi-ui/icons@5.0.0-canary.1
95
+ - @hi-ui/button@5.0.0-canary.4
96
+ - @hi-ui/popper@5.0.0-canary.2
97
+ - @hi-ui/classname@5.0.0-canary.1
98
+ - @hi-ui/dom-utils@5.0.0-canary.1
99
+ - @hi-ui/env@5.0.0-canary.1
100
+ - @hi-ui/react-utils@5.0.0-canary.1
101
+ - @hi-ui/type-assertion@5.0.0-canary.1
102
+
103
+ ## 5.0.0-canary.3
104
+
105
+ ### Patch Changes
106
+
107
+ - 0c5923439: style: 修改样式问题 (5.0)
108
+
109
+ ## 5.0.0-canary.2
110
+
111
+ ### Patch Changes
112
+
113
+ - c3a7005b0: style: 修改 UI 问题 (5.0)
114
+
3
115
  ## 5.0.0-canary.1
4
116
 
5
117
  ### Major Changes
package/lib/cjs/Dropdown.js CHANGED
@@ -17,6 +17,7 @@ var tslib = require('tslib');
17
17
  var React = require('react');
18
18
  var classname = require('@hi-ui/classname');
19
19
  var env = require('@hi-ui/env');
20
+ var core = require('@hi-ui/core');
20
21
  var popper = require('@hi-ui/popper');
21
22
  var context = require('./context.js');
22
23
  var useDropdown = require('./use-dropdown.js');
@@ -38,6 +39,7 @@ var DEFAULT_DATA = [];
38
39
  * 下拉菜单
39
40
  */
40
41
  var Dropdown = /*#__PURE__*/React.forwardRef(function (_a, ref) {
42
+ var _b;
41
43
  var _a$prefixCls = _a.prefixCls,
42
44
  prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
43
45
  _a$role = _a.role,
@@ -53,25 +55,31 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (_a, ref) {
53
55
  _onClick = _a.onClick,
54
56
  onButtonClick = _a.onButtonClick,
55
57
  overlayClassName = _a.overlayClassName,
56
- _a$size = _a.size,
57
- size = _a$size === void 0 ? 'md' : _a$size,
58
+ sizeProp = _a.size,
58
59
  rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "data", "fieldNames", "title", "type", "onClick", "onButtonClick", "overlayClassName", "size"]);
59
60
  var transformedData = React.useMemo(function () {
60
61
  return index.transformData(data, fieldNames);
61
62
  }, [data, fieldNames]);
62
- var _b = useDropdown.useDropdown(rest),
63
- rootProps = _b.rootProps,
64
- providedValue = tslib.__rest(_b, ["rootProps"]);
63
+ var _c = useDropdown.useDropdown(rest),
64
+ rootProps = _c.rootProps,
65
+ providedValue = tslib.__rest(_c, ["rootProps"]);
65
66
  var getMenuProps = providedValue.getMenuProps,
66
67
  getTriggerProps = providedValue.getTriggerProps,
67
68
  disabled = providedValue.disabled,
69
+ menuVisible = providedValue.menuVisible,
68
70
  menuVisibleAction = providedValue.menuVisibleAction;
69
71
  var cls = classname.cx(prefixCls, className, disabled && prefixCls + "--disabled");
72
+ var _useGlobalContext = core.useGlobalContext(),
73
+ globalSize = _useGlobalContext.size;
74
+ var size = (_b = sizeProp !== null && sizeProp !== void 0 ? sizeProp : globalSize) !== null && _b !== void 0 ? _b : 'md';
75
+ if (size === 'xs') {
76
+ size = 'sm';
77
+ }
70
78
  var dig = function dig(treeData) {
71
79
  return treeData.map(function (item) {
72
80
  var menu = typeAssertion.isArrayNonEmpty(item.children) ? ( /*#__PURE__*/React__default["default"].createElement(DropdownMenu, {
73
81
  overlay: {
74
- gutterGap: 16
82
+ gutterGap: 8
75
83
  },
76
84
  size: size
77
85
  }, dig(item.children))) : null;
@@ -88,7 +96,8 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (_a, ref) {
88
96
  target: item.target,
89
97
  value: item.id,
90
98
  menu: menu,
91
- onClick: function onClick() {
99
+ onClick: function onClick(evt) {
100
+ evt.stopPropagation();
92
101
  if (item.disabled) return;
93
102
  _onClick === null || _onClick === void 0 ? void 0 : _onClick(item.id);
94
103
  if (!typeAssertion.isArray(item.children)) {
@@ -105,10 +114,11 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (_a, ref) {
105
114
  }
106
115
  if (type === 'text' || type === 'button') {
107
116
  return /*#__PURE__*/React__default["default"].createElement(Button__default["default"], Object.assign({}, getTriggerProps(), {
108
- appearance: type === 'button' ? 'filled' : 'link'
117
+ appearance: type === 'button' ? 'line' : 'link'
109
118
  }), title, /*#__PURE__*/React__default["default"].createElement(icons.DownOutlined, {
110
119
  style: {
111
- marginInlineStart: 2
120
+ marginInlineStart: 2,
121
+ transform: menuVisible ? 'rotate(180deg)' : 'rotate(0)'
112
122
  }
113
123
  }));
114
124
  }
@@ -118,7 +128,11 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (_a, ref) {
118
128
  }, title), /*#__PURE__*/React__default["default"].createElement(Button__default["default"], Object.assign({
119
129
  className: classname.cx(prefixCls + "__icon", prefixCls + "__icon-btn-wrap")
120
130
  }, getTriggerProps(), {
121
- icon: /*#__PURE__*/React__default["default"].createElement(icons.DownOutlined, null)
131
+ icon: /*#__PURE__*/React__default["default"].createElement(icons.DownOutlined, {
132
+ style: {
133
+ transform: menuVisible ? 'rotate(180deg)' : 'rotate(0)'
134
+ }
135
+ })
122
136
  })));
123
137
  }
124
138
  return null;
@@ -132,7 +146,8 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (_a, ref) {
132
146
  }, rootProps), renderButton(), typeAssertion.isArrayNonEmpty(transformedData) ? ( /*#__PURE__*/React__default["default"].createElement(DropdownMenu, Object.assign({}, getMenuProps({
133
147
  overlay: {
134
148
  disabledPortal: false,
135
- className: overlayClassName
149
+ className: overlayClassName,
150
+ gutterGap: 4
136
151
  }
137
152
  }), {
138
153
  size: size
@@ -149,8 +164,8 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
149
164
  parents = _a.parents,
150
165
  className = _a.className,
151
166
  children = _a.children,
152
- _a$size2 = _a.size,
153
- size = _a$size2 === void 0 ? 'lg' : _a$size2,
167
+ _a$size = _a.size,
168
+ size = _a$size === void 0 ? 'lg' : _a$size,
154
169
  rest = tslib.__rest(_a, ["prefixCls", "role", "overlay", "parents", "className", "children", "size"]);
155
170
  var cls = classname.cx(prefixCls, className, prefixCls + "--size-" + size);
156
171
  return /*#__PURE__*/React__default["default"].createElement(popper.Popper, Object.assign({}, overlay), /*#__PURE__*/React__default["default"].createElement("ul", Object.assign({
@@ -202,7 +217,7 @@ var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (_a, ref) {
202
217
  className: cls
203
218
  }, rootProps), /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
204
219
  className: prefixCls + "__trigger"
205
- }, getTriggerProps()), shouldUseLink ? ( /*#__PURE__*/React__default["default"].createElement("a", {
220
+ }, menu ? getTriggerProps() : {}), shouldUseLink ? ( /*#__PURE__*/React__default["default"].createElement("a", {
206
221
  className: prefixCls + "__link",
207
222
  href: href,
208
223
  target: target
package/lib/cjs/styles/index.scss.js CHANGED
@@ -12,7 +12,7 @@
12
12
  Object.defineProperty(exports, '__esModule', {
13
13
  value: true
14
14
  });
15
- var css_248z = ".hi-v5-dropdown {display: inline-block;}.hi-v5-dropdown-menu {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-lg, 6px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-100, #ebeff5);font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-gray-700, #1a1d26);width: var(--hi-v5-dropdown-menu-width, 180px);}.hi-v5-dropdown-menu-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: 0;box-sizing: border-box;overflow: visible;}.hi-v5-dropdown-menu-item__link {color: var(--hi-v5-color-gray-700, #1a1d26);width: 100%;text-decoration: none;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-dropdown-menu-item__arrow {-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}.hi-v5-dropdown-menu-item__trigger {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;height: 100%;cursor: pointer;border-radius: var(--hi-v5-border-radius-lg, 6px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}.hi-v5-dropdown-menu--size-lg .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-md .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-sm .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu-item:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger:hover {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-dropdown-menu-item--active:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-dropdown-menu-item--disabled > .hi-v5-dropdown-menu-item__trigger {cursor: not-allowed;color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-dropdown-divider {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;background-color: var(--hi-v5-color-gray-200, #e6eaf0);width: 100%;height: 1px;margin: var(--hi-v5-spacing-4, 8px) 0;}";
15
+ var css_248z = ".hi-v5-dropdown {display: inline-block;}.hi-v5-dropdown-menu {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-xl, 8px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-2, 4px);color: var(--hi-v5-color-gray-800, #1a1d26);max-height: 268px;overflow-y: auto;width: var(--hi-v5-dropdown-menu-width, 180px);}.hi-v5-dropdown-menu-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: var(--hi-v5-spacing-1, 2px) 0 0 0;box-sizing: border-box;overflow: visible;}.hi-v5-dropdown-menu-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-dropdown-menu-item__link {color: var(--hi-v5-color-gray-800, #1a1d26);width: 100%;text-decoration: none;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-dropdown-menu-item__arrow {-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}.hi-v5-dropdown-menu-item__trigger {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;height: 100%;cursor: pointer;border-radius: var(--hi-v5-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}.hi-v5-dropdown-menu--size-lg .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-md .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-sm .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu-item:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger:hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-dropdown-menu-item--active:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-dropdown-menu-item--disabled > .hi-v5-dropdown-menu-item__trigger {cursor: not-allowed;color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-dropdown-divider {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;background-color: var(--hi-v5-color-gray-300, #e6e8eb);width: 100%;height: 1px;margin: var(--hi-v5-spacing-4, 8px) 0;}";
16
16
  var __styleInject__ = require('@hi-ui/style-inject')["default"];
17
17
  __styleInject__(css_248z);
18
18
  exports["default"] = css_248z;
package/lib/esm/Dropdown.js CHANGED
@@ -11,6 +11,7 @@ import { __rest } from 'tslib';
11
11
  import React, { forwardRef, useMemo, cloneElement } from 'react';
12
12
  import { getPrefixCls, cx } from '@hi-ui/classname';
13
13
  import { __DEV__ } from '@hi-ui/env';
14
+ import { useGlobalContext } from '@hi-ui/core';
14
15
  import { Popper } from '@hi-ui/popper';
15
16
  import { DropDownProvider, useDropDownContext } from './context.js';
16
17
  import { useDropdown } from './use-dropdown.js';
@@ -25,6 +26,7 @@ var DEFAULT_DATA = [];
25
26
  * 下拉菜单
26
27
  */
27
28
  var Dropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
29
+ var _b;
28
30
  var _a$prefixCls = _a.prefixCls,
29
31
  prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
30
32
  _a$role = _a.role,
@@ -40,25 +42,31 @@ var Dropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
40
42
  _onClick = _a.onClick,
41
43
  onButtonClick = _a.onButtonClick,
42
44
  overlayClassName = _a.overlayClassName,
43
- _a$size = _a.size,
44
- size = _a$size === void 0 ? 'md' : _a$size,
45
+ sizeProp = _a.size,
45
46
  rest = __rest(_a, ["prefixCls", "role", "className", "children", "data", "fieldNames", "title", "type", "onClick", "onButtonClick", "overlayClassName", "size"]);
46
47
  var transformedData = useMemo(function () {
47
48
  return transformData(data, fieldNames);
48
49
  }, [data, fieldNames]);
49
- var _b = useDropdown(rest),
50
- rootProps = _b.rootProps,
51
- providedValue = __rest(_b, ["rootProps"]);
50
+ var _c = useDropdown(rest),
51
+ rootProps = _c.rootProps,
52
+ providedValue = __rest(_c, ["rootProps"]);
52
53
  var getMenuProps = providedValue.getMenuProps,
53
54
  getTriggerProps = providedValue.getTriggerProps,
54
55
  disabled = providedValue.disabled,
56
+ menuVisible = providedValue.menuVisible,
55
57
  menuVisibleAction = providedValue.menuVisibleAction;
56
58
  var cls = cx(prefixCls, className, disabled && prefixCls + "--disabled");
59
+ var _useGlobalContext = useGlobalContext(),
60
+ globalSize = _useGlobalContext.size;
61
+ var size = (_b = sizeProp !== null && sizeProp !== void 0 ? sizeProp : globalSize) !== null && _b !== void 0 ? _b : 'md';
62
+ if (size === 'xs') {
63
+ size = 'sm';
64
+ }
57
65
  var dig = function dig(treeData) {
58
66
  return treeData.map(function (item) {
59
67
  var menu = isArrayNonEmpty(item.children) ? ( /*#__PURE__*/React.createElement(DropdownMenu, {
60
68
  overlay: {
61
- gutterGap: 16
69
+ gutterGap: 8
62
70
  },
63
71
  size: size
64
72
  }, dig(item.children))) : null;
@@ -75,7 +83,8 @@ var Dropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
75
83
  target: item.target,
76
84
  value: item.id,
77
85
  menu: menu,
78
- onClick: function onClick() {
86
+ onClick: function onClick(evt) {
87
+ evt.stopPropagation();
79
88
  if (item.disabled) return;
80
89
  _onClick === null || _onClick === void 0 ? void 0 : _onClick(item.id);
81
90
  if (!isArray(item.children)) {
@@ -92,10 +101,11 @@ var Dropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
92
101
  }
93
102
  if (type === 'text' || type === 'button') {
94
103
  return /*#__PURE__*/React.createElement(Button, Object.assign({}, getTriggerProps(), {
95
- appearance: type === 'button' ? 'filled' : 'link'
104
+ appearance: type === 'button' ? 'line' : 'link'
96
105
  }), title, /*#__PURE__*/React.createElement(DownOutlined, {
97
106
  style: {
98
- marginInlineStart: 2
107
+ marginInlineStart: 2,
108
+ transform: menuVisible ? 'rotate(180deg)' : 'rotate(0)'
99
109
  }
100
110
  }));
101
111
  }
@@ -105,7 +115,11 @@ var Dropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
105
115
  }, title), /*#__PURE__*/React.createElement(Button, Object.assign({
106
116
  className: cx(prefixCls + "__icon", prefixCls + "__icon-btn-wrap")
107
117
  }, getTriggerProps(), {
108
- icon: /*#__PURE__*/React.createElement(DownOutlined, null)
118
+ icon: /*#__PURE__*/React.createElement(DownOutlined, {
119
+ style: {
120
+ transform: menuVisible ? 'rotate(180deg)' : 'rotate(0)'
121
+ }
122
+ })
109
123
  })));
110
124
  }
111
125
  return null;
@@ -119,7 +133,8 @@ var Dropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
119
133
  }, rootProps), renderButton(), isArrayNonEmpty(transformedData) ? ( /*#__PURE__*/React.createElement(DropdownMenu, Object.assign({}, getMenuProps({
120
134
  overlay: {
121
135
  disabledPortal: false,
122
- className: overlayClassName
136
+ className: overlayClassName,
137
+ gutterGap: 4
123
138
  }
124
139
  }), {
125
140
  size: size
@@ -136,8 +151,8 @@ var DropdownMenu = /*#__PURE__*/forwardRef(function (_a, ref) {
136
151
  parents = _a.parents,
137
152
  className = _a.className,
138
153
  children = _a.children,
139
- _a$size2 = _a.size,
140
- size = _a$size2 === void 0 ? 'lg' : _a$size2,
154
+ _a$size = _a.size,
155
+ size = _a$size === void 0 ? 'lg' : _a$size,
141
156
  rest = __rest(_a, ["prefixCls", "role", "overlay", "parents", "className", "children", "size"]);
142
157
  var cls = cx(prefixCls, className, prefixCls + "--size-" + size);
143
158
  return /*#__PURE__*/React.createElement(Popper, Object.assign({}, overlay), /*#__PURE__*/React.createElement("ul", Object.assign({
@@ -189,7 +204,7 @@ var DropdownMenuItem = /*#__PURE__*/forwardRef(function (_a, ref) {
189
204
  className: cls
190
205
  }, rootProps), /*#__PURE__*/React.createElement("div", Object.assign({
191
206
  className: prefixCls + "__trigger"
192
- }, getTriggerProps()), shouldUseLink ? ( /*#__PURE__*/React.createElement("a", {
207
+ }, menu ? getTriggerProps() : {}), shouldUseLink ? ( /*#__PURE__*/React.createElement("a", {
193
208
  className: prefixCls + "__link",
194
209
  href: href,
195
210
  target: target
package/lib/esm/styles/index.scss.js CHANGED
@@ -8,6 +8,6 @@
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
10
  import __styleInject__ from '@hi-ui/style-inject';
11
- var css_248z = ".hi-v5-dropdown {display: inline-block;}.hi-v5-dropdown-menu {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-lg, 6px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-100, #ebeff5);font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-gray-700, #1a1d26);width: var(--hi-v5-dropdown-menu-width, 180px);}.hi-v5-dropdown-menu-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: 0;box-sizing: border-box;overflow: visible;}.hi-v5-dropdown-menu-item__link {color: var(--hi-v5-color-gray-700, #1a1d26);width: 100%;text-decoration: none;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-dropdown-menu-item__arrow {-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}.hi-v5-dropdown-menu-item__trigger {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;height: 100%;cursor: pointer;border-radius: var(--hi-v5-border-radius-lg, 6px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}.hi-v5-dropdown-menu--size-lg .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-md .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-sm .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu-item:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger:hover {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-dropdown-menu-item--active:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-dropdown-menu-item--disabled > .hi-v5-dropdown-menu-item__trigger {cursor: not-allowed;color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-dropdown-divider {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;background-color: var(--hi-v5-color-gray-200, #e6eaf0);width: 100%;height: 1px;margin: var(--hi-v5-spacing-4, 8px) 0;}";
11
+ var css_248z = ".hi-v5-dropdown {display: inline-block;}.hi-v5-dropdown-menu {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-xl, 8px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-2, 4px);color: var(--hi-v5-color-gray-800, #1a1d26);max-height: 268px;overflow-y: auto;width: var(--hi-v5-dropdown-menu-width, 180px);}.hi-v5-dropdown-menu-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: var(--hi-v5-spacing-1, 2px) 0 0 0;box-sizing: border-box;overflow: visible;}.hi-v5-dropdown-menu-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-dropdown-menu-item__link {color: var(--hi-v5-color-gray-800, #1a1d26);width: 100%;text-decoration: none;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-dropdown-menu-item__arrow {-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}.hi-v5-dropdown-menu-item__trigger {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;height: 100%;cursor: pointer;border-radius: var(--hi-v5-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}.hi-v5-dropdown-menu--size-lg .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-md .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu--size-sm .hi-v5-dropdown-menu-item__trigger {padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-4, 8px);}.hi-v5-dropdown-menu-item:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger:hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-dropdown-menu-item--active:not(.hi-v5-dropdown-menu-item--disabled) > .hi-v5-dropdown-menu-item__trigger {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-dropdown-menu-item--disabled > .hi-v5-dropdown-menu-item__trigger {cursor: not-allowed;color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-dropdown-divider {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;background-color: var(--hi-v5-color-gray-300, #e6e8eb);width: 100%;height: 1px;margin: var(--hi-v5-spacing-4, 8px) 0;}";
12
12
  __styleInject__(css_248z);
13
13
  export { css_248z as default };
package/lib/types/Dropdown.d.ts CHANGED
@@ -56,5 +56,5 @@ export interface DropdownProps extends Omit<HiBaseHTMLProps<'div'>, 'onClick'>,
56
56
  /**
57
57
  * 设置大小
58
58
  */
59
- size?: HiBaseSizeEnum;
59
+ size?: Omit<HiBaseSizeEnum, 'xs'>;
60
60
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/dropdown",
3
- "version": "5.0.0-canary.1",
3
+ "version": "5.0.0-canary.10",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HiUI <mi-hiui@xiaomi.com>",
@@ -19,9 +19,9 @@
19
19
  "typings": "lib/types/index.d.ts",
20
20
  "exports": {
21
21
  ".": {
22
+ "types": "./lib/types/index.d.ts",
22
23
  "require": "./lib/cjs/index.js",
23
- "default": "./lib/esm/index.js",
24
- "types": "./lib/types/index.d.ts"
24
+ "default": "./lib/esm/index.js"
25
25
  }
26
26
  },
27
27
  "publishConfig": {
@@ -44,27 +44,27 @@
44
44
  "url": "https://github.com/XiaoMi/hiui/issues"
45
45
  },
46
46
  "dependencies": {
47
- "@hi-ui/button": "^5.0.0-canary.0",
48
- "@hi-ui/classname": "^5.0.0-canary.0",
49
- "@hi-ui/dom-utils": "^5.0.0-canary.0",
50
- "@hi-ui/env": "^5.0.0-canary.0",
51
- "@hi-ui/icons": "^5.0.0-canary.0",
52
- "@hi-ui/popper": "^5.0.0-canary.1",
53
- "@hi-ui/react-utils": "^5.0.0-canary.0",
54
- "@hi-ui/type-assertion": "^5.0.0-canary.0",
55
- "@hi-ui/use-latest": "^5.0.0-canary.0",
56
- "@hi-ui/use-timeout": "^5.0.0-canary.0",
57
- "@hi-ui/use-toggle": "^5.0.0-canary.0",
58
- "@hi-ui/use-unmount-effect": "^5.0.0-canary.0"
47
+ "@hi-ui/button": "^5.0.0-canary.13",
48
+ "@hi-ui/classname": "^5.0.0-canary.2",
49
+ "@hi-ui/dom-utils": "^5.0.0-canary.2",
50
+ "@hi-ui/env": "^5.0.0-canary.2",
51
+ "@hi-ui/icons": "^5.0.0-canary.8",
52
+ "@hi-ui/popper": "^5.0.0-canary.12",
53
+ "@hi-ui/react-utils": "^5.0.0-canary.2",
54
+ "@hi-ui/type-assertion": "^5.0.0-canary.2",
55
+ "@hi-ui/use-latest": "^5.0.0-canary.2",
56
+ "@hi-ui/use-timeout": "^5.0.0-canary.2",
57
+ "@hi-ui/use-toggle": "^5.0.0-canary.2",
58
+ "@hi-ui/use-unmount-effect": "^5.0.0-canary.2"
59
59
  },
60
60
  "peerDependencies": {
61
- "@hi-ui/core": ">=5.0.0-canary.0",
61
+ "@hi-ui/core": ">=5.0.0-canary.6",
62
62
  "react": ">=16.8.6",
63
63
  "react-dom": ">=16.8.6"
64
64
  },
65
65
  "devDependencies": {
66
- "@hi-ui/core": "^5.0.0-canary.0",
67
- "@hi-ui/core-css": "^5.0.0-canary.0",
66
+ "@hi-ui/core": "^5.0.0-canary.6",
67
+ "@hi-ui/core-css": "^5.0.0-canary.9",
68
68
  "react": "^17.0.1",
69
69
  "react-dom": "^17.0.1"
70
70
  }