@nutui/nutui-react-taro 3.0.5 → 3.0.7

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 (204) hide show
  1. package/CHANGELOG.md +59 -1
  2. package/dist/cjs/packages/actionsheet/style/style.css +4 -4
  3. package/dist/cjs/packages/address/style/style.css +4 -4
  4. package/dist/cjs/packages/audio/style/style.css +4 -16
  5. package/dist/cjs/packages/badge/badge.js +4 -3
  6. package/dist/cjs/packages/badge/style/badge.scss +4 -0
  7. package/dist/cjs/packages/badge/style/style.css +9 -6
  8. package/dist/cjs/packages/badge/style/style.harmony.css +3 -0
  9. package/dist/cjs/packages/button/style/button.scss +4 -20
  10. package/dist/cjs/packages/button/style/style.css +4 -16
  11. package/dist/cjs/packages/button/style/style.harmony.css +2 -14
  12. package/dist/cjs/packages/calendar/style/style.css +4 -4
  13. package/dist/cjs/packages/cascader/style/style.css +4 -4
  14. package/dist/cjs/packages/collapse/style/style.css +22 -7
  15. package/dist/cjs/packages/collapseitem/collapseitem.js +63 -77
  16. package/dist/cjs/packages/collapseitem/style/collapseitem.scss +22 -5
  17. package/dist/cjs/packages/collapseitem/style/style.css +22 -7
  18. package/dist/cjs/packages/collapseitem/style/style.harmony.css +22 -7
  19. package/dist/cjs/packages/configprovider/types.d.ts +1 -1
  20. package/dist/cjs/packages/datepicker/style/style.css +7 -4
  21. package/dist/cjs/packages/datepickerview/style/style.css +3 -0
  22. package/dist/cjs/packages/dialog/content.d.ts +11 -3
  23. package/dist/cjs/packages/dialog/content.js +4 -4
  24. package/dist/cjs/packages/dialog/dialog.d.ts +39 -4
  25. package/dist/cjs/packages/dialog/dialog.js +14 -13
  26. package/dist/cjs/packages/dialog/index.d.ts +1 -1
  27. package/dist/cjs/packages/dialog/style/style.css +4 -16
  28. package/dist/cjs/packages/empty/style/style.css +4 -16
  29. package/dist/cjs/packages/fixednav/style/style.css +9 -6
  30. package/dist/cjs/packages/imagepreview/style/style.css +4 -4
  31. package/dist/cjs/packages/indicator/indicator.js +1 -1
  32. package/dist/cjs/packages/lottie/index.js +5 -5
  33. package/dist/cjs/packages/lottie/{mp.js → lottiemp.js} +1 -1
  34. package/dist/cjs/packages/notify/notify.js +44 -13
  35. package/dist/cjs/packages/notify/style/notify.scss +39 -36
  36. package/dist/cjs/packages/notify/style/style.css +36 -31
  37. package/dist/cjs/packages/notify/style/style.harmony.css +36 -31
  38. package/dist/cjs/packages/numberkeyboard/style/style.css +4 -4
  39. package/dist/cjs/packages/picker/style/style.css +7 -4
  40. package/dist/cjs/packages/pickerview/pickerroller.js +7 -2
  41. package/dist/cjs/packages/pickerview/style/pickerview.scss +3 -0
  42. package/dist/cjs/packages/pickerview/style/style.css +3 -0
  43. package/dist/cjs/packages/pickerview/style/style.harmony.css +3 -0
  44. package/dist/cjs/packages/popover/popover.d.ts +0 -7
  45. package/dist/cjs/packages/popover/popover.js +114 -141
  46. package/dist/cjs/packages/popover/style/popover.scss +48 -51
  47. package/dist/cjs/packages/popover/style/style.css +64 -70
  48. package/dist/cjs/packages/popover/style/style.harmony.css +64 -60
  49. package/dist/cjs/packages/popup/style/popup.scss +4 -4
  50. package/dist/cjs/packages/popup/style/style.css +4 -4
  51. package/dist/cjs/packages/popup/style/style.harmony.css +4 -4
  52. package/dist/cjs/packages/resultpage/style/style.css +4 -16
  53. package/dist/cjs/packages/searchbar/searchbar.js +8 -2
  54. package/dist/cjs/packages/shortpassword/style/style.css +4 -4
  55. package/dist/cjs/packages/skeleton/skeleton.js +63 -52
  56. package/dist/cjs/packages/skeleton/style/index.js +0 -1
  57. package/dist/cjs/packages/skeleton/style/skeleton.scss +40 -46
  58. package/dist/cjs/packages/skeleton/style/style.css +32 -175
  59. package/dist/cjs/packages/skeleton/style/style.harmony.css +32 -42
  60. package/dist/cjs/packages/switch/style/style.css +5 -0
  61. package/dist/cjs/packages/switch/style/style.harmony.css +5 -0
  62. package/dist/cjs/packages/switch/style/switch.scss +5 -0
  63. package/dist/cjs/packages/switch/switch.js +22 -11
  64. package/dist/cjs/packages/tabbar/style/style.css +54 -45
  65. package/dist/cjs/packages/tabbar/style/style.harmony.css +24 -18
  66. package/dist/cjs/packages/tabbar/style/tabbar.scss +28 -19
  67. package/dist/cjs/packages/tabbar/tabbar.js +28 -10
  68. package/dist/cjs/packages/tabbaritem/style/style.css +30 -27
  69. package/dist/cjs/packages/tabbaritem/style/style.harmony.css +21 -21
  70. package/dist/cjs/packages/tabbaritem/style/tabbaritem.scss +32 -29
  71. package/dist/cjs/packages/tabbaritem/tabbaritem.js +38 -14
  72. package/dist/cjs/packages/tabpane/tabpane.js +2 -2
  73. package/dist/cjs/packages/timeselect/style/style.css +4 -4
  74. package/dist/cjs/packages/tour/style/style.css +64 -70
  75. package/dist/cjs/packages/tour/tour.js +3 -4
  76. package/dist/cjs/types/spec/badge/base.d.ts +1 -0
  77. package/dist/cjs/types/spec/dialog/base.d.ts +50 -1
  78. package/dist/cjs/types/spec/dialog/base.js +7 -0
  79. package/dist/cjs/types/spec/dialog/h5.d.ts +4 -1
  80. package/dist/cjs/types/spec/dialog/taro.d.ts +8 -2
  81. package/dist/cjs/types/spec/indicator/base.d.ts +1 -1
  82. package/dist/cjs/types/spec/notify/base.d.ts +7 -2
  83. package/dist/cjs/types/spec/popover/base.d.ts +7 -0
  84. package/dist/cjs/types/spec/searchbar/taro.d.ts +10 -7
  85. package/dist/cjs/types/spec/skeleton/base.d.ts +7 -5
  86. package/dist/cjs/types/spec/switch/base.d.ts +3 -2
  87. package/dist/cjs/types/spec/switch/h5.d.ts +1 -1
  88. package/dist/cjs/types/spec/switch/taro.d.ts +1 -4
  89. package/dist/cjs/types/spec/tabbar/base.d.ts +7 -4
  90. package/dist/cjs/utils/get-rect-by-taro.js +10 -0
  91. package/dist/cjs/utils/lru.d.ts +8 -0
  92. package/dist/cjs/utils/lru.js +58 -0
  93. package/dist/es/packages/actionsheet/style/style.css +4 -4
  94. package/dist/es/packages/address/style/style.css +4 -4
  95. package/dist/es/packages/audio/style/style.css +4 -16
  96. package/dist/es/packages/badge/badge.js +4 -3
  97. package/dist/es/packages/badge/style/badge.scss +4 -0
  98. package/dist/es/packages/badge/style/style.css +9 -6
  99. package/dist/es/packages/badge/style/style.harmony.css +3 -0
  100. package/dist/es/packages/button/style/button.scss +4 -20
  101. package/dist/es/packages/button/style/style.css +4 -16
  102. package/dist/es/packages/button/style/style.harmony.css +2 -14
  103. package/dist/es/packages/calendar/style/style.css +4 -4
  104. package/dist/es/packages/cascader/style/style.css +4 -4
  105. package/dist/es/packages/collapse/style/style.css +22 -7
  106. package/dist/es/packages/collapseitem/collapseitem.js +65 -79
  107. package/dist/es/packages/collapseitem/style/collapseitem.scss +22 -5
  108. package/dist/es/packages/collapseitem/style/style.css +22 -7
  109. package/dist/es/packages/collapseitem/style/style.harmony.css +22 -7
  110. package/dist/es/packages/configprovider/types.d.ts +1 -1
  111. package/dist/es/packages/datepicker/style/style.css +7 -4
  112. package/dist/es/packages/datepickerview/style/style.css +3 -0
  113. package/dist/es/packages/dialog/content.d.ts +11 -3
  114. package/dist/es/packages/dialog/content.js +4 -4
  115. package/dist/es/packages/dialog/dialog.d.ts +39 -4
  116. package/dist/es/packages/dialog/dialog.js +14 -13
  117. package/dist/es/packages/dialog/index.d.ts +1 -1
  118. package/dist/es/packages/dialog/style/style.css +4 -16
  119. package/dist/es/packages/empty/style/style.css +4 -16
  120. package/dist/es/packages/fixednav/style/style.css +9 -6
  121. package/dist/es/packages/imagepreview/style/style.css +4 -4
  122. package/dist/es/packages/indicator/indicator.js +1 -1
  123. package/dist/es/packages/lottie/index.js +3 -3
  124. package/dist/es/packages/lottie/{mp.js → lottiemp.js} +1 -1
  125. package/dist/es/packages/notify/notify.js +45 -14
  126. package/dist/es/packages/notify/style/notify.scss +39 -36
  127. package/dist/es/packages/notify/style/style.css +36 -31
  128. package/dist/es/packages/notify/style/style.harmony.css +36 -31
  129. package/dist/es/packages/numberkeyboard/style/style.css +4 -4
  130. package/dist/es/packages/picker/style/style.css +7 -4
  131. package/dist/es/packages/pickerview/pickerroller.js +7 -2
  132. package/dist/es/packages/pickerview/style/pickerview.scss +3 -0
  133. package/dist/es/packages/pickerview/style/style.css +3 -0
  134. package/dist/es/packages/pickerview/style/style.harmony.css +3 -0
  135. package/dist/es/packages/popover/popover.d.ts +0 -7
  136. package/dist/es/packages/popover/popover.js +115 -142
  137. package/dist/es/packages/popover/style/popover.scss +48 -51
  138. package/dist/es/packages/popover/style/style.css +64 -70
  139. package/dist/es/packages/popover/style/style.harmony.css +64 -60
  140. package/dist/es/packages/popup/style/popup.scss +4 -4
  141. package/dist/es/packages/popup/style/style.css +4 -4
  142. package/dist/es/packages/popup/style/style.harmony.css +4 -4
  143. package/dist/es/packages/resultpage/style/style.css +4 -16
  144. package/dist/es/packages/searchbar/searchbar.js +7 -2
  145. package/dist/es/packages/shortpassword/style/style.css +4 -4
  146. package/dist/es/packages/skeleton/skeleton.js +62 -52
  147. package/dist/es/packages/skeleton/style/index.js +0 -1
  148. package/dist/es/packages/skeleton/style/skeleton.scss +40 -46
  149. package/dist/es/packages/skeleton/style/style.css +32 -175
  150. package/dist/es/packages/skeleton/style/style.harmony.css +32 -42
  151. package/dist/es/packages/switch/style/style.css +5 -0
  152. package/dist/es/packages/switch/style/style.harmony.css +5 -0
  153. package/dist/es/packages/switch/style/switch.scss +5 -0
  154. package/dist/es/packages/switch/switch.js +21 -11
  155. package/dist/es/packages/tabbar/style/style.css +54 -45
  156. package/dist/es/packages/tabbar/style/style.harmony.css +24 -18
  157. package/dist/es/packages/tabbar/style/tabbar.scss +28 -19
  158. package/dist/es/packages/tabbar/tabbar.js +27 -10
  159. package/dist/es/packages/tabbaritem/style/style.css +30 -27
  160. package/dist/es/packages/tabbaritem/style/style.harmony.css +21 -21
  161. package/dist/es/packages/tabbaritem/style/tabbaritem.scss +32 -29
  162. package/dist/es/packages/tabbaritem/tabbaritem.js +38 -14
  163. package/dist/es/packages/tabpane/tabpane.js +2 -2
  164. package/dist/es/packages/timeselect/style/style.css +4 -4
  165. package/dist/es/packages/tour/style/style.css +64 -70
  166. package/dist/es/packages/tour/tour.js +3 -4
  167. package/dist/es/types/spec/badge/base.d.ts +4 -0
  168. package/dist/es/types/spec/dialog/base.d.ts +83 -1
  169. package/dist/es/types/spec/dialog/base.js +1 -1
  170. package/dist/es/types/spec/dialog/h5.d.ts +4 -1
  171. package/dist/es/types/spec/dialog/taro.d.ts +8 -2
  172. package/dist/es/types/spec/indicator/base.d.ts +1 -1
  173. package/dist/es/types/spec/notify/base.d.ts +22 -5
  174. package/dist/es/types/spec/popover/base.d.ts +7 -0
  175. package/dist/es/types/spec/searchbar/taro.d.ts +10 -7
  176. package/dist/es/types/spec/skeleton/base.d.ts +19 -14
  177. package/dist/es/types/spec/switch/base.d.ts +6 -2
  178. package/dist/es/types/spec/switch/h5.d.ts +1 -1
  179. package/dist/es/types/spec/switch/taro.d.ts +1 -4
  180. package/dist/es/types/spec/tabbar/base.d.ts +7 -4
  181. package/dist/es/utils/get-rect-by-taro.js +9 -0
  182. package/dist/es/utils/lru.d.ts +8 -0
  183. package/dist/es/utils/lru.js +49 -0
  184. package/dist/nutui.react.umd.js +683 -552
  185. package/dist/style.css +1 -1
  186. package/dist/style.scss +46 -46
  187. package/dist/styles/theme-jmapp.scss +1 -0
  188. package/dist/styles/themes/jmapp.css +1 -1
  189. package/dist/styles/variables-jmapp.scss +237 -50
  190. package/dist/styles/variables-jrkf.scss +25 -14
  191. package/dist/styles/variables.scss +38 -51
  192. package/package.json +1 -1
  193. package/dist/cjs/packages/dialog/types.d.ts +0 -57
  194. package/dist/cjs/packages/dialog/types.js +0 -4
  195. package/dist/cjs/packages/dialog/types.taro.d.ts +0 -10
  196. package/dist/es/packages/dialog/types.d.ts +0 -57
  197. package/dist/es/packages/dialog/types.js +0 -1
  198. package/dist/es/packages/dialog/types.taro.d.ts +0 -10
  199. /package/dist/cjs/packages/lottie/{mp.d.ts → lottiemp.d.ts} +0 -0
  200. /package/dist/cjs/packages/lottie/{web.d.ts → lottieweb.d.ts} +0 -0
  201. /package/dist/cjs/packages/lottie/{web.js → lottieweb.js} +0 -0
  202. /package/dist/es/packages/lottie/{mp.d.ts → lottiemp.d.ts} +0 -0
  203. /package/dist/es/packages/lottie/{web.d.ts → lottieweb.d.ts} +0 -0
  204. /package/dist/es/packages/lottie/{web.js → lottieweb.js} +0 -0
@@ -8,7 +8,6 @@ import { View } from "@tarojs/components";
8
8
  import { ComponentDefaults } from "../../utils/typings";
9
9
  import Badge from "../badge/index";
10
10
  import TabbarContext from "../tabbar/context";
11
- import addColorForHarmony from "../../utils/add-color-for-harmony";
12
11
  var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
13
12
  title: '',
14
13
  icon: null,
@@ -16,12 +15,13 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
16
15
  dot: false,
17
16
  max: 99,
18
17
  top: '0',
19
- right: '0'
18
+ right: '0',
19
+ direction: 'vertical'
20
20
  });
21
21
  export var TabbarItem = function(props) {
22
22
  var ctx = useContext(TabbarContext);
23
23
  var _ref = _object_spread({}, defaultProps, props), className = _ref.className, style = _ref.style, title = _ref.title, icon = _ref.icon, value = _ref.value, dot = _ref.dot, max = _ref.max, top = _ref.top, right = _ref.right, // @ts-ignore
24
- index = _ref.index, rest = _object_without_properties(_ref, [
24
+ index = _ref.index, direction = _ref.direction, onActiveClick = _ref.onActiveClick, rest = _object_without_properties(_ref, [
25
25
  "className",
26
26
  "style",
27
27
  "title",
@@ -31,15 +31,19 @@ export var TabbarItem = function(props) {
31
31
  "max",
32
32
  "top",
33
33
  "right",
34
- "index"
34
+ "index",
35
+ "direction",
36
+ "onActiveClick"
35
37
  ]);
36
38
  var active = index === (ctx === null || ctx === void 0 ? void 0 : ctx.selectIndex);
37
39
  var classPrefix = 'nut-tabbar-item';
38
- var tabbarItemClass = classNames(classPrefix, _define_property({}, "".concat(classPrefix, "-active"), active), className);
39
- var boxPrefix = "".concat(classPrefix, "-icon-box");
40
- var titleClass = classNames(boxPrefix, "".concat(boxPrefix, "-nav"), _define_property({}, "".concat(boxPrefix, "-large"), !icon));
40
+ var _obj;
41
+ var tabbarItemClass = classNames(classPrefix, (_obj = {}, _define_property(_obj, "".concat(classPrefix, "-active"), active), _define_property(_obj, "".concat(classPrefix, "-large"), !icon || !title), _obj), className);
42
+ var renderNodeWithActive = function(node) {
43
+ return node && typeof node === 'function' ? node(active) : node;
44
+ };
41
45
  var badgeProps = {
42
- value: value,
46
+ value: renderNodeWithActive(value),
43
47
  dot: dot,
44
48
  max: max,
45
49
  top: top,
@@ -48,11 +52,33 @@ export var TabbarItem = function(props) {
48
52
  };
49
53
  var renderTitleText = function() {
50
54
  return title && /*#__PURE__*/ React.createElement(View, {
51
- className: titleClass,
55
+ className: "".concat(classPrefix, "-text"),
52
56
  style: {
53
57
  color: active ? ctx === null || ctx === void 0 ? void 0 : ctx.activeColor : ctx === null || ctx === void 0 ? void 0 : ctx.inactiveColor
54
58
  }
55
- }, title);
59
+ }, renderNodeWithActive(title));
60
+ };
61
+ var renderTitle = function() {
62
+ return /*#__PURE__*/ React.createElement(Badge, _object_spread({
63
+ size: "normal"
64
+ }, badgeProps), renderTitleText());
65
+ };
66
+ var renderIcon = function() {
67
+ var distIcon = renderNodeWithActive(icon);
68
+ // 鸿蒙差异处理,需要手动给icon一个color
69
+ return /*#__PURE__*/ React.isValidElement(distIcon) ? /*#__PURE__*/ React.cloneElement(distIcon, _object_spread_props(_object_spread({}, distIcon.props), {
70
+ color: active ? ctx === null || ctx === void 0 ? void 0 : ctx.activeColor : ctx === null || ctx === void 0 ? void 0 : ctx.inactiveColor
71
+ })) : null;
72
+ };
73
+ var renderIconAndTitle = function() {
74
+ return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Badge, _object_spread_props(_object_spread({
75
+ size: "normal"
76
+ }, badgeProps), {
77
+ top: 3
78
+ }), renderIcon()), renderTitleText());
79
+ };
80
+ var renderDualItem = function() {
81
+ return dot ? null : /*#__PURE__*/ React.createElement(React.Fragment, null, renderIcon(), renderTitleText(), /*#__PURE__*/ React.createElement(Badge, badgeProps));
56
82
  };
57
83
  return /*#__PURE__*/ React.createElement(View, _object_spread({
58
84
  className: tabbarItemClass,
@@ -60,9 +86,7 @@ export var TabbarItem = function(props) {
60
86
  color: active ? ctx === null || ctx === void 0 ? void 0 : ctx.activeColor : ctx === null || ctx === void 0 ? void 0 : ctx.inactiveColor
61
87
  }, style),
62
88
  onClick: function() {
63
- return ctx === null || ctx === void 0 ? void 0 : ctx.handleClick(index);
89
+ return active ? onActiveClick === null || onActiveClick === void 0 ? void 0 : onActiveClick() : ctx === null || ctx === void 0 ? void 0 : ctx.handleClick(index);
64
90
  }
65
- }, rest), icon ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Badge, badgeProps, /*#__PURE__*/ React.createElement(View, {
66
- className: boxPrefix
67
- }, addColorForHarmony(icon, active ? ctx === null || ctx === void 0 ? void 0 : ctx.activeColor : ctx === null || ctx === void 0 ? void 0 : ctx.inactiveColor))), renderTitleText()) : /*#__PURE__*/ React.createElement(Badge, badgeProps, renderTitleText()));
91
+ }, rest), direction === 'horizontal' && !dot ? renderDualItem() : /*#__PURE__*/ React.createElement(React.Fragment, null, icon && renderIconAndTitle(), !icon && renderTitle()));
68
92
  };
@@ -13,7 +13,7 @@ export var TabPane = function(props) {
13
13
  var classes = classNames(classPrefix, {
14
14
  active: !disabled && props.active
15
15
  }, autoHeightClassName, className);
16
- return children && /*#__PURE__*/ React.createElement(View, {
16
+ return children ? /*#__PURE__*/ React.createElement(View, {
17
17
  className: classes
18
- }, !disabled && children);
18
+ }, !disabled && children) : null;
19
19
  };
@@ -60,7 +60,7 @@
60
60
 
61
61
  .nut-popup {
62
62
  position: fixed;
63
- min-height: 46%;
63
+ min-height: 26%;
64
64
  max-height: 100%;
65
65
  background-color: var(--nutui-overlay-content-bg-color, var(--nutui-color-background-overlay, #ffffff));
66
66
  -webkit-overflow-scrolling: touch;
@@ -198,12 +198,12 @@
198
198
  transform: scale(0.8);
199
199
  }
200
200
  }
201
- .nut-popup-slide-default-enter-active {
201
+ .nut-popup-slide-none-enter-active {
202
202
  animation-fill-mode: both;
203
203
  animation-name: popup-scale-fade-in;
204
204
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
205
205
  }
206
- .nut-popup-slide-default-exit-active {
206
+ .nut-popup-slide-none-exit-active {
207
207
  animation-fill-mode: both;
208
208
  animation-name: popup-scale-fade-out;
209
209
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -330,7 +330,7 @@
330
330
  animation-name: popup-slide-left-exit;
331
331
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
332
332
  }
333
- .nut-popup-slide-default-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
333
+ .nut-popup-slide-none-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
334
334
  display: none;
335
335
  }
336
336
  .nut-popup .nut-overflow-hidden {
@@ -60,7 +60,7 @@
60
60
 
61
61
  .nut-popup {
62
62
  position: fixed;
63
- min-height: 46%;
63
+ min-height: 26%;
64
64
  max-height: 100%;
65
65
  background-color: var(--nutui-overlay-content-bg-color, var(--nutui-color-background-overlay, #ffffff));
66
66
  -webkit-overflow-scrolling: touch;
@@ -198,12 +198,12 @@
198
198
  transform: scale(0.8);
199
199
  }
200
200
  }
201
- .nut-popup-slide-default-enter-active {
201
+ .nut-popup-slide-none-enter-active {
202
202
  animation-fill-mode: both;
203
203
  animation-name: popup-scale-fade-in;
204
204
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
205
205
  }
206
- .nut-popup-slide-default-exit-active {
206
+ .nut-popup-slide-none-exit-active {
207
207
  animation-fill-mode: both;
208
208
  animation-name: popup-scale-fade-out;
209
209
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -330,7 +330,7 @@
330
330
  animation-name: popup-slide-left-exit;
331
331
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
332
332
  }
333
- .nut-popup-slide-default-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
333
+ .nut-popup-slide-none-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
334
334
  display: none;
335
335
  }
336
336
  .nut-popup .nut-overflow-hidden {
@@ -411,12 +411,13 @@
411
411
  top: 50%;
412
412
  transform: rotate(90deg) translateY(-50%);
413
413
  }
414
- .nut-popover-arrow-left.nut-popover-arrow-left-start {
414
+ .nut-popover-arrow-left.nut-popover-arrow-left-top {
415
415
  top: 16px;
416
416
  right: -8px;
417
417
  transform: rotate(90deg) translateY(0%);
418
418
  }
419
- .nut-popover-arrow-left.nut-popover-arrow-left-end {
419
+ .nut-popover-arrow-left.nut-popover-arrow-left-bottom {
420
+ top: auto;
420
421
  bottom: 16px;
421
422
  right: -8px;
422
423
  transform: rotate(90deg) translateY(0%);
@@ -429,12 +430,12 @@
429
430
  left: -6px;
430
431
  transform: rotate(-90deg) translateY(-50%);
431
432
  }
432
- .nut-popover-arrow-right.nut-popover-arrow-right-start {
433
+ .nut-popover-arrow-right.nut-popover-arrow-right-top {
433
434
  top: 16px;
434
435
  left: -8px;
435
436
  transform: rotate(-90deg) translateY(0%);
436
437
  }
437
- .nut-popover-arrow-right.nut-popover-arrow-right-end {
438
+ .nut-popover-arrow-right.nut-popover-arrow-right-bottom {
438
439
  bottom: 16px;
439
440
  left: -8px;
440
441
  transform: rotate(-90deg) translateY(0%);
@@ -449,57 +450,51 @@
449
450
  max-height: initial;
450
451
  overflow-y: initial;
451
452
  }
452
- .nut-popover .nut-popover-content .nut-popover-menu-item {
453
+ .nut-popover .nut-popover-content-group {
454
+ padding: 0 var(--nutui-popover-padding, 8px);
455
+ }
456
+ .nut-popover .nut-popover-content .nut-popover-item {
453
457
  display: flex;
454
458
  align-items: center;
455
459
  justify-content: center;
456
- padding: 0 var(--nutui-popover-menu-item-padding, 8px);
457
460
  border-bottom: 1px solid var(--nutui-popover-divider-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
458
- max-width: var(--nutui-popover-menu-item-width, 160px);
461
+ max-width: var(--nutui-popover-item-width, 160px);
459
462
  word-wrap: break-word;
460
463
  }
461
- .nut-popover .nut-popover-content .nut-popover-menu-item:last-child {
464
+ .nut-popover .nut-popover-content .nut-popover-item:last-child {
462
465
  margin-bottom: 0px;
463
466
  border-bottom: none;
464
467
  }
465
- .nut-popover .nut-popover-content .nut-popover-menu-item-icon {
468
+ .nut-popover .nut-popover-content .nut-popover-item-icon, .nut-popover .nut-popover-content .nut-popover-item-action-icon {
466
469
  display: flex;
467
470
  justify-content: center;
468
471
  align-items: center;
469
- width: 12px;
470
- height: 12px;
471
- font-size: 12px;
472
+ width: var(--nutui-font-size-s, 12px);
473
+ height: var(--nutui-font-size-s, 12px);
474
+ font-size: var(--nutui-font-size-s, 12px);
475
+ }
476
+ .nut-popover .nut-popover-content .nut-popover-item-icon .nut-icon, .nut-popover .nut-popover-content .nut-popover-item-action-icon .nut-icon {
477
+ width: var(--nutui-font-size-s, 12px);
478
+ height: var(--nutui-font-size-s, 12px);
479
+ font-size: var(--nutui-font-size-s, 12px);
472
480
  }
473
- .nut-popover .nut-popover-content .nut-popover-menu-item-icon .nut-icon {
474
- width: 12px;
475
- height: 12px;
476
- font-size: 12px;
481
+ .nut-popover .nut-popover-content .nut-popover-item-icon {
482
+ margin-right: var(--nutui-spacing-xxs, 4px);
477
483
  }
478
- .nut-popover .nut-popover-content .nut-popover-menu-item-name {
484
+ .nut-popover .nut-popover-content .nut-popover-item-name {
479
485
  width: calc(100% - 34px);
480
486
  word-break: keep-all;
481
- margin: 0 8px 0 4px;
482
487
  flex: 1;
483
488
  }
484
- .nut-popover .nut-popover-content .nut-popover-menu-item-action-icon {
485
- display: flex;
486
- justify-content: center;
487
- align-items: center;
488
- width: 12px;
489
- height: 12px;
490
- font-size: 12px;
489
+ .nut-popover .nut-popover-content .nut-popover-item-action-icon {
491
490
  color: var(--nutui-color-text, #505259);
491
+ margin-left: var(--nutui-spacing-base, 8px);
492
492
  }
493
- .nut-popover .nut-popover-content .nut-popover-menu-item-action-icon .nut-icon {
494
- width: 12px;
495
- height: 12px;
496
- font-size: 12px;
497
- }
498
- .nut-popover .nut-popover-content .nut-popover-menu-item.nut-popover-menu-disabled {
493
+ .nut-popover .nut-popover-content .nut-popover-item.nut-popover-item-disabled {
499
494
  color: var(--nutui-popover-disable-color, var(--nutui-color-text-disabled, #c2c4cc));
500
495
  cursor: not-allowed;
501
496
  }
502
- .nut-popover .nut-popover-content .nut-popover-menu-item.nut-popover-menu-taroitem {
497
+ .nut-popover .nut-popover-content .nut-popover-item.nut-popover-taroitem {
503
498
  display: flex;
504
499
  }
505
500
  .nut-popover .nut-popover-content-top .nut-popover-arrow-top {
@@ -507,18 +502,18 @@
507
502
  transform-origin: center left;
508
503
  transform: rotate(180deg) translateX(-50%);
509
504
  }
510
- .nut-popover .nut-popover-content-top-end {
505
+ .nut-popover .nut-popover-content-top-right {
511
506
  right: 0;
512
507
  }
513
- .nut-popover .nut-popover-content-top-end .nut-popover-arrow-top-end {
508
+ .nut-popover .nut-popover-content-top-right .nut-popover-arrow-top-right {
514
509
  right: 16px;
515
510
  bottom: -3.5px;
516
511
  transform: rotate(180deg) translateX(0%);
517
512
  }
518
- .nut-popover .nut-popover-content-top-start {
513
+ .nut-popover .nut-popover-content-top-left {
519
514
  left: 0;
520
515
  }
521
- .nut-popover .nut-popover-content-top-start .nut-popover-arrow-top-start {
516
+ .nut-popover .nut-popover-content-top-left .nut-popover-arrow-top-left {
522
517
  left: 16px;
523
518
  bottom: -3.5px;
524
519
  transform: rotate(180deg) translateX(0%);
@@ -527,30 +522,30 @@
527
522
  left: 50%;
528
523
  transform: translateX(-50%);
529
524
  }
530
- .nut-popover .nut-popover-content-bottom-end {
525
+ .nut-popover .nut-popover-content-bottom-right {
531
526
  right: 0;
532
527
  }
533
- .nut-popover .nut-popover-content-bottom-end .nut-popover-arrow-bottom-end {
528
+ .nut-popover .nut-popover-content-bottom-right .nut-popover-arrow-bottom-right {
534
529
  right: 16px;
535
530
  transform: translateX(0%);
536
531
  }
537
- .nut-popover .nut-popover-content-bottom-start {
532
+ .nut-popover .nut-popover-content-bottom-left {
538
533
  left: 0;
539
534
  }
540
- .nut-popover .nut-popover-content-bottom-start .nut-popover-arrow-bottom-start {
535
+ .nut-popover .nut-popover-content-bottom-left .nut-popover-arrow-bottom-left {
541
536
  left: 16px;
542
537
  transform: translateX(0%);
543
538
  }
544
- .nut-popover .nut-popover-content-left-end {
539
+ .nut-popover .nut-popover-content-left-bottom {
545
540
  bottom: 0;
546
541
  }
547
- .nut-popover .nut-popover-content-left-start {
542
+ .nut-popover .nut-popover-content-left-top {
548
543
  top: 0;
549
544
  }
550
- .nut-popover .nut-popover-content-right-end {
545
+ .nut-popover .nut-popover-content-right-bottom {
551
546
  bottom: 0;
552
547
  }
553
- .nut-popover .nut-popover-content-right-start {
548
+ .nut-popover .nut-popover-content-right-top {
554
549
  top: 0;
555
550
  }
556
551
 
@@ -565,19 +560,18 @@
565
560
  background: var(--nutui-popover-text-color, var(--nutui-color-mask, rgba(0, 0, 0, 0.7))) !important;
566
561
  color: var(--nutui-popover-content-background-color, #ffffff) !important;
567
562
  }
568
- .nut-popover-dark .nut-popover-content .nut-popover-menu-item-action-icon {
563
+ .nut-popover-dark .nut-popover-content .nut-popover-item-action-icon {
569
564
  color: rgba(255, 255, 255, 0.8);
570
565
  }
571
566
 
572
- [dir=rtl] .nut-popover .nut-popover-content .nut-popover-menu-item-name,
573
- .nut-rtl .nut-popover .nut-popover-content .nut-popover-menu-item-name {
567
+ [dir=rtl] .nut-popover .nut-popover-content .nut-popover-item-name,
568
+ .nut-rtl .nut-popover .nut-popover-content .nut-popover-item-name {
574
569
  margin-left: 0;
575
570
  margin-right: 4px;
576
571
  }
577
- [dir=rtl] .nut-popover .nut-popover-content .nut-popover-menu-item-action-icon,
578
- .nut-rtl .nut-popover .nut-popover-content .nut-popover-menu-item-action-icon {
572
+ [dir=rtl] .nut-popover .nut-popover-content .nut-popover-item-action-icon,
573
+ .nut-rtl .nut-popover .nut-popover-content .nut-popover-item-action-icon {
579
574
  right: auto;
580
- left: var(--nutui-popover-menu-item-padding, 8px);
581
575
  }
582
576
  [dir=rtl] .nut-popover .nut-popover-content-top .nut-popover-arrow-top,
583
577
  .nut-rtl .nut-popover .nut-popover-content-top .nut-popover-arrow-top {
@@ -585,23 +579,23 @@
585
579
  right: 50%;
586
580
  transform: translateX(50%);
587
581
  }
588
- [dir=rtl] .nut-popover .nut-popover-content-top-end,
589
- .nut-rtl .nut-popover .nut-popover-content-top-end {
582
+ [dir=rtl] .nut-popover .nut-popover-content-top-right,
583
+ .nut-rtl .nut-popover .nut-popover-content-top-right {
590
584
  right: auto;
591
585
  left: 0;
592
586
  }
593
- [dir=rtl] .nut-popover .nut-popover-content-top-end .nut-popover-arrow-top-end,
594
- .nut-rtl .nut-popover .nut-popover-content-top-end .nut-popover-arrow-top-end {
587
+ [dir=rtl] .nut-popover .nut-popover-content-top-right .nut-popover-arrow-top-right,
588
+ .nut-rtl .nut-popover .nut-popover-content-top-right .nut-popover-arrow-top-right {
595
589
  right: auto;
596
590
  left: 16px;
597
591
  }
598
- [dir=rtl] .nut-popover .nut-popover-content-top-start,
599
- .nut-rtl .nut-popover .nut-popover-content-top-start {
592
+ [dir=rtl] .nut-popover .nut-popover-content-top-left,
593
+ .nut-rtl .nut-popover .nut-popover-content-top-left {
600
594
  left: auto;
601
595
  right: 0;
602
596
  }
603
- [dir=rtl] .nut-popover .nut-popover-content-top-start .nut-popover-arrow-top-start,
604
- .nut-rtl .nut-popover .nut-popover-content-top-start .nut-popover-arrow-top-start {
597
+ [dir=rtl] .nut-popover .nut-popover-content-top-left .nut-popover-arrow-top-left,
598
+ .nut-rtl .nut-popover .nut-popover-content-top-left .nut-popover-arrow-top-left {
605
599
  left: auto;
606
600
  right: 16px;
607
601
  }
@@ -611,23 +605,23 @@
611
605
  right: 50%;
612
606
  transform: translateX(50%);
613
607
  }
614
- [dir=rtl] .nut-popover .nut-popover-content-bottom-end,
615
- .nut-rtl .nut-popover .nut-popover-content-bottom-end {
608
+ [dir=rtl] .nut-popover .nut-popover-content-bottom-right,
609
+ .nut-rtl .nut-popover .nut-popover-content-bottom-right {
616
610
  right: auto;
617
611
  left: 0;
618
612
  }
619
- [dir=rtl] .nut-popover .nut-popover-content-bottom-end .nut-popover-arrow-bottom-end,
620
- .nut-rtl .nut-popover .nut-popover-content-bottom-end .nut-popover-arrow-bottom-end {
613
+ [dir=rtl] .nut-popover .nut-popover-content-bottom-right .nut-popover-arrow-bottom-right,
614
+ .nut-rtl .nut-popover .nut-popover-content-bottom-right .nut-popover-arrow-bottom-right {
621
615
  right: auto;
622
616
  left: 16px;
623
617
  }
624
- [dir=rtl] .nut-popover .nut-popover-content-bottom-start,
625
- .nut-rtl .nut-popover .nut-popover-content-bottom-start {
618
+ [dir=rtl] .nut-popover .nut-popover-content-bottom-left,
619
+ .nut-rtl .nut-popover .nut-popover-content-bottom-left {
626
620
  left: auto;
627
621
  right: 0;
628
622
  }
629
- [dir=rtl] .nut-popover .nut-popover-content-bottom-start .nut-popover-arrow-bottom-start,
630
- .nut-rtl .nut-popover .nut-popover-content-bottom-start .nut-popover-arrow-bottom-start {
623
+ [dir=rtl] .nut-popover .nut-popover-content-bottom-left .nut-popover-arrow-bottom-left,
624
+ .nut-rtl .nut-popover .nut-popover-content-bottom-left .nut-popover-arrow-bottom-left {
631
625
  left: auto;
632
626
  right: 16px;
633
627
  }
@@ -63,7 +63,6 @@ export var Tour = function(props) {
63
63
  ]);
64
64
  var getRootPosition = function() {
65
65
  getTaroRectById(list[active].target).then(function(rect) {
66
- console.log('rect', rect);
67
66
  setMaskRect({
68
67
  top: rect.top,
69
68
  left: rect.left,
@@ -126,16 +125,16 @@ export var Tour = function(props) {
126
125
  }
127
126
  }, index === active && /*#__PURE__*/ React.createElement(React.Fragment, null, showTour && /*#__PURE__*/ React.createElement(View, {
128
127
  className: "".concat(mask ? 'nut-tour-mask' : 'nut-tour-mask nut-tour-mask-none'),
129
- id: "nut-tour-popid",
128
+ id: "nut-tour-popid".concat(index),
130
129
  style: maskStyle()
131
130
  }), /*#__PURE__*/ React.createElement(Popover, {
132
131
  visible: showPopup,
133
132
  location: item.location || location,
134
- targetId: "nut-tour-popid",
133
+ targetId: "nut-tour-popid".concat(index === active ? index : ''),
135
134
  closeOnOutsideClick: false,
136
135
  offset: item.popoverOffset || [
137
136
  0,
138
- 12
137
+ 8
139
138
  ],
140
139
  arrowOffset: item.arrowOffset || 0
141
140
  }, /*#__PURE__*/ React.createElement(React.Fragment, null), /*#__PURE__*/ React.createElement(React.Fragment, null, children || /*#__PURE__*/ React.createElement(React.Fragment, null, type === 'step' && /*#__PURE__*/ React.createElement(View, {
@@ -32,4 +32,8 @@ export interface BaseBadge extends BaseProps {
32
32
  * dot 尺寸,当 dot 等于 true 时生效
33
33
  */
34
34
  size: BadgeDotSize
35
+ /**
36
+ * 是否禁用
37
+ */
38
+ disabled: boolean
35
39
  }
@@ -1,2 +1,84 @@
1
- export interface BaseDialog {
1
+ import { ReactNode, ForwardRefExoticComponent, PropsWithChildren } from 'react';
2
+ import type { MouseEvent, CSSProperties } from 'react';
3
+ import { WebOverlayProps } from "../../../types";
4
+ import { BasicComponent } from "../../../utils/typings";
5
+ export type DialogConfigType = {
6
+ prefixCls?: string;
7
+ simple?: boolean;
8
+ };
9
+ export type DialogCloseIconPosition = 'top-right' | 'top-left' | 'bottom';
10
+ export type DialogFooterDirection = 'horizontal' | 'vertical';
11
+ export interface BaseContentProps extends BasicComponent {
12
+ visible: boolean;
13
+ title: ReactNode;
14
+ header: ReactNode;
15
+ footer: ReactNode;
16
+ close: ReactNode;
17
+ footerDirection: DialogFooterDirection;
2
18
  }
19
+ export interface DialogWrapProps extends WebOverlayProps, Omit<BaseContentProps, 'onClick'> {
20
+ visible: boolean;
21
+ overlay: boolean;
22
+ overlayStyle: CSSProperties;
23
+ overlayClassName: string;
24
+ onCancel: () => void;
25
+ onClose: () => void;
26
+ onOverlayClick: (e: MouseEvent) => boolean | void;
27
+ }
28
+ export interface BaseDialog extends DialogWrapProps {
29
+ /**
30
+ * 对话框的内容,适用于函数式调用
31
+ */
32
+ content: ReactNode
33
+ /**
34
+ * 确认按钮文案
35
+ */
36
+ confirmText: ReactNode
37
+ /**
38
+ * 取消按钮文案
39
+ */
40
+ cancelText: ReactNode
41
+ /**
42
+ * 是否隐藏确定按钮
43
+ */
44
+ hideConfirmButton: boolean
45
+ /**
46
+ * 是否隐藏取消按钮
47
+ */
48
+ hideCancelButton: boolean
49
+ /**
50
+ * 禁用确定按钮
51
+ */
52
+ disableConfirmButton: boolean
53
+ /**
54
+ * 关闭按钮位置
55
+ */
56
+ closeIconPosition: DialogCloseIconPosition
57
+ /**
58
+ * 关闭按钮
59
+ */
60
+ closeIcon: boolean | ReactNode
61
+ /**
62
+ * 关闭前回调
63
+ */
64
+ beforeClose: () => boolean
65
+ /**
66
+ * 取消前回调,点击取消时触发
67
+ */
68
+ beforeCancel: () => boolean
69
+ /**
70
+ * 确定按钮回调
71
+ */
72
+ onConfirm: (e?: MouseEvent<HTMLButtonElement>) => PromiseLike<any> | void
73
+ }
74
+ export type DialogReturnProps = {
75
+ update: (newConfig: Partial<BaseDialog>) => void;
76
+ close: () => void;
77
+ };
78
+ export interface DialogComponent extends ForwardRefExoticComponent<PropsWithChildren<Partial<BaseDialog>>> {
79
+ confirm: (props: Partial<BaseDialog>) => DialogReturnProps;
80
+ alert: (props: Partial<BaseDialog>) => DialogReturnProps;
81
+ config: (config: DialogConfigType) => void;
82
+ destroyAll: () => void;
83
+ }
84
+ export declare const destroyList: Array<() => void>;
@@ -1 +1 @@
1
- export { };
1
+ export var destroyList = [];
@@ -1,3 +1,6 @@
1
- import { BaseDialog } from './base';
1
+ import { BaseDialog, BaseContentProps } from './base';
2
+ export interface WebContentProps extends BaseContentProps {
3
+ onClick: (event: MouseEvent) => void;
4
+ }
2
5
  export interface WebDialogProps extends BaseDialog {
3
6
  }
@@ -1,3 +1,9 @@
1
- import { BaseDialog } from './base';
2
- export interface TaroDialogProps extends BaseDialog {
1
+ import { ITouchEvent } from '@tarojs/components';
2
+ import { BaseDialog, BaseContentProps } from './base';
3
+ export interface TaroContentProps extends BaseContentProps {
4
+ onClick: (event: ITouchEvent) => void;
5
+ }
6
+ export interface TaroDialogProps extends Omit<BaseDialog, 'onOverlayClick' | 'onClick'> {
7
+ onClick: (event: ITouchEvent) => void;
8
+ onOverlayClick: (event: ITouchEvent) => boolean | void;
3
9
  }
@@ -1,6 +1,6 @@
1
1
  import { BaseProps } from '../../base/props';
2
2
  import { UIType } from '../../base/atoms';
3
- export type IndicatorType = 'anchor' | 'slide';
3
+ export type IndicatorType = 'anchor' | 'slide' | 'dualScreen';
4
4
  export type IndicatorColor = Extract<UIType, 'primary' | 'default'>;
5
5
  export interface BaseIndicator extends BaseProps {
6
6
  /**
@@ -1,18 +1,35 @@
1
+ import { PositionY } from "../../base/atoms";
1
2
  import { BaseProps } from '../../base/props';
2
3
  export interface BaseNotify extends BaseProps {
3
4
  id: string;
4
5
  /**
5
- * 展示时长(ms),值为 0 时,notify 不会消失
6
+ * 距离顶部/底部距离
6
7
  */
7
- duration: number
8
+ distance: number
9
+ /**
10
+ * 顶部导航高度
11
+ */
12
+ navHeight: number
13
+ /**
14
+ * 是否启用关闭模式
15
+ */
16
+ closeable: boolean
8
17
  /**
9
- * 提示的信息类型(primary,success ,danger,warning)
18
+ * 左边的 icon
10
19
  */
11
- type: string
20
+ leftIcon: React.ReactNode
21
+ /**
22
+ * 右边的 icon,在 closeable 模式下默认为 <Close />
23
+ */
24
+ rightIcon: React.ReactNode
12
25
  /**
13
26
  * 自定义位置 (top, bottom)
14
27
  */
15
- position: string
28
+ position: PositionY
29
+ /**
30
+ * 展示时长(ms),值为 0 时,notify 不会消失
31
+ */
32
+ duration: number
16
33
  /**
17
34
  * 点击事件回调
18
35
  */
@@ -12,6 +12,13 @@ export interface PopoverList {
12
12
  onClick?: (e: any) => void;
13
13
  };
14
14
  }
15
+ export interface WrapperPosition {
16
+ width: number;
17
+ height: number;
18
+ left: number;
19
+ top: number;
20
+ right: number;
21
+ }
15
22
  export type BasePopover<POPUP_PROPS> = POPUP_PROPS & BaseProps & {
16
23
  theme: UITheme;
17
24
  /**