antd-mobile 5.36.0 → 5.37.0

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 (244) hide show
  1. package/2x/bundle/antd-mobile.cjs.development.js +393 -295
  2. package/2x/bundle/antd-mobile.cjs.js +7 -7
  3. package/2x/bundle/antd-mobile.es.development.js +393 -295
  4. package/2x/bundle/antd-mobile.es.js +5619 -5550
  5. package/2x/bundle/antd-mobile.umd.development.js +393 -295
  6. package/2x/bundle/antd-mobile.umd.js +7 -7
  7. package/2x/bundle/style.css +5 -8
  8. package/2x/cjs/components/card/card.css +5 -5
  9. package/2x/cjs/components/card/card.patch.css +21 -0
  10. package/2x/cjs/components/center-popup/center-popup.js +46 -43
  11. package/2x/cjs/components/check-list/check-list.js +15 -11
  12. package/2x/cjs/components/collapse/collapse.d.ts +10 -2
  13. package/2x/cjs/components/collapse/collapse.js +54 -39
  14. package/2x/cjs/components/config-provider/config-provider.d.ts +40 -2
  15. package/2x/cjs/components/dropdown/context.d.ts +2 -0
  16. package/2x/cjs/components/dropdown/context.js +10 -0
  17. package/2x/cjs/components/dropdown/dropdown.d.ts +11 -3
  18. package/2x/cjs/components/dropdown/dropdown.js +23 -16
  19. package/2x/cjs/components/dropdown/index.d.ts +1 -0
  20. package/2x/cjs/components/dropdown/item.d.ts +5 -1
  21. package/2x/cjs/components/dropdown/item.js +22 -8
  22. package/2x/cjs/components/form/form-item.d.ts +6 -5
  23. package/2x/cjs/components/form/form-item.js +25 -17
  24. package/2x/cjs/components/form/form.d.ts +1 -1
  25. package/2x/cjs/components/form/index.d.ts +1 -1
  26. package/2x/cjs/components/input/input.d.ts +3 -1
  27. package/2x/cjs/components/input/input.js +53 -51
  28. package/2x/cjs/components/list/list-item.d.ts +6 -2
  29. package/2x/cjs/components/list/list-item.js +16 -6
  30. package/2x/cjs/components/nav-bar/nav-bar.d.ts +4 -0
  31. package/2x/cjs/components/nav-bar/nav-bar.js +18 -13
  32. package/2x/cjs/components/notice-bar/notice-bar.css +0 -3
  33. package/2x/cjs/components/notice-bar/notice-bar.d.ts +3 -1
  34. package/2x/cjs/components/notice-bar/notice-bar.js +30 -25
  35. package/2x/cjs/components/number-keyboard/number-keyboard.d.ts +1 -1
  36. package/2x/cjs/components/number-keyboard/number-keyboard.js +14 -13
  37. package/2x/cjs/components/popup/popup-base-props.d.ts +3 -2
  38. package/2x/cjs/components/popup/popup-base-props.js +4 -0
  39. package/2x/cjs/components/popup/popup.js +5 -5
  40. package/2x/cjs/components/result/result.js +3 -10
  41. package/2x/cjs/components/result/use-result-icon.d.ts +3 -0
  42. package/2x/cjs/components/result/use-result-icon.js +37 -0
  43. package/2x/cjs/components/result-page/result-page.js +3 -10
  44. package/2x/cjs/components/search-bar/search-bar.d.ts +10 -2
  45. package/2x/cjs/components/search-bar/search-bar.js +34 -33
  46. package/2x/cjs/components/toast/toast.d.ts +2 -2
  47. package/2x/cjs/components/toast/toast.js +4 -4
  48. package/2x/cjs/components/virtual-input/virtual-input.d.ts +5 -5
  49. package/2x/cjs/components/virtual-input/virtual-input.js +26 -24
  50. package/2x/cjs/locales/ar-SA.js +2 -2
  51. package/2x/cjs/locales/de-DE.js +3 -3
  52. package/2x/cjs/locales/es-ES.js +2 -2
  53. package/2x/cjs/locales/fr-FR.js +1 -1
  54. package/2x/cjs/locales/in-ID.d.ts +139 -0
  55. package/2x/cjs/locales/in-ID.js +149 -0
  56. package/2x/cjs/locales/ja-JP.js +2 -2
  57. package/2x/cjs/locales/th-TH.js +2 -2
  58. package/2x/cjs/utils/is-node-with-content.d.ts +3 -0
  59. package/2x/cjs/utils/is-node-with-content.js +3 -0
  60. package/2x/cjs/utils/use-mutation-effect.d.ts +1 -0
  61. package/2x/cjs/utils/use-mutation-effect.js +20 -9
  62. package/2x/cjs/utils/with-default-props.d.ts +7 -0
  63. package/2x/cjs/utils/with-default-props.js +21 -5
  64. package/2x/es/components/card/card.css +5 -5
  65. package/2x/es/components/card/card.patch.css +21 -0
  66. package/2x/es/components/center-popup/center-popup.js +45 -42
  67. package/2x/es/components/check-list/check-list.js +15 -11
  68. package/2x/es/components/collapse/collapse.d.ts +10 -2
  69. package/2x/es/components/collapse/collapse.js +53 -38
  70. package/2x/es/components/config-provider/config-provider.d.ts +40 -2
  71. package/2x/es/components/dropdown/context.d.ts +2 -0
  72. package/2x/es/components/dropdown/context.js +2 -0
  73. package/2x/es/components/dropdown/dropdown.d.ts +11 -3
  74. package/2x/es/components/dropdown/dropdown.js +24 -17
  75. package/2x/es/components/dropdown/index.d.ts +1 -0
  76. package/2x/es/components/dropdown/item.d.ts +5 -1
  77. package/2x/es/components/dropdown/item.js +22 -8
  78. package/2x/es/components/form/form-item.d.ts +6 -5
  79. package/2x/es/components/form/form-item.js +24 -16
  80. package/2x/es/components/form/form.d.ts +1 -1
  81. package/2x/es/components/form/index.d.ts +1 -1
  82. package/2x/es/components/input/input.d.ts +3 -1
  83. package/2x/es/components/input/input.js +52 -50
  84. package/2x/es/components/list/list-item.d.ts +6 -2
  85. package/2x/es/components/list/list-item.js +16 -6
  86. package/2x/es/components/nav-bar/nav-bar.d.ts +4 -0
  87. package/2x/es/components/nav-bar/nav-bar.js +18 -13
  88. package/2x/es/components/notice-bar/notice-bar.css +0 -3
  89. package/2x/es/components/notice-bar/notice-bar.d.ts +3 -1
  90. package/2x/es/components/notice-bar/notice-bar.js +29 -24
  91. package/2x/es/components/number-keyboard/number-keyboard.d.ts +1 -1
  92. package/2x/es/components/number-keyboard/number-keyboard.js +13 -12
  93. package/2x/es/components/popup/popup-base-props.d.ts +3 -2
  94. package/2x/es/components/popup/popup-base-props.js +3 -0
  95. package/2x/es/components/popup/popup.js +5 -5
  96. package/2x/es/components/result/result.js +3 -10
  97. package/2x/es/components/result/use-result-icon.d.ts +3 -0
  98. package/2x/es/components/result/use-result-icon.js +29 -0
  99. package/2x/es/components/result-page/result-page.js +3 -10
  100. package/2x/es/components/search-bar/search-bar.d.ts +10 -2
  101. package/2x/es/components/search-bar/search-bar.js +33 -32
  102. package/2x/es/components/toast/toast.d.ts +2 -2
  103. package/2x/es/components/toast/toast.js +3 -3
  104. package/2x/es/components/virtual-input/virtual-input.d.ts +5 -5
  105. package/2x/es/components/virtual-input/virtual-input.js +25 -23
  106. package/2x/es/locales/ar-SA.js +2 -2
  107. package/2x/es/locales/de-DE.js +3 -3
  108. package/2x/es/locales/es-ES.js +2 -2
  109. package/2x/es/locales/fr-FR.js +1 -1
  110. package/2x/es/locales/in-ID.d.ts +139 -0
  111. package/2x/es/locales/in-ID.js +142 -0
  112. package/2x/es/locales/ja-JP.js +2 -2
  113. package/2x/es/locales/th-TH.js +2 -2
  114. package/2x/es/utils/is-node-with-content.d.ts +3 -0
  115. package/2x/es/utils/is-node-with-content.js +3 -0
  116. package/2x/es/utils/use-mutation-effect.d.ts +1 -0
  117. package/2x/es/utils/use-mutation-effect.js +19 -9
  118. package/2x/es/utils/with-default-props.d.ts +7 -0
  119. package/2x/es/utils/with-default-props.js +20 -5
  120. package/2x/package.json +3 -2
  121. package/bundle/antd-mobile.cjs.development.js +393 -295
  122. package/bundle/antd-mobile.cjs.js +7 -7
  123. package/bundle/antd-mobile.compatible.umd.js +1 -1
  124. package/bundle/antd-mobile.es.development.js +393 -295
  125. package/bundle/antd-mobile.es.js +5619 -5550
  126. package/bundle/antd-mobile.umd.development.js +393 -295
  127. package/bundle/antd-mobile.umd.js +7 -7
  128. package/bundle/style.css +1 -1
  129. package/cjs/components/card/card.css +5 -5
  130. package/cjs/components/card/card.patch.css +17 -0
  131. package/cjs/components/center-popup/center-popup.js +46 -43
  132. package/cjs/components/check-list/check-list.js +15 -11
  133. package/cjs/components/collapse/collapse.d.ts +10 -2
  134. package/cjs/components/collapse/collapse.js +54 -39
  135. package/cjs/components/config-provider/config-provider.d.ts +40 -2
  136. package/cjs/components/dropdown/context.d.ts +2 -0
  137. package/cjs/components/dropdown/context.js +10 -0
  138. package/cjs/components/dropdown/dropdown.d.ts +11 -3
  139. package/cjs/components/dropdown/dropdown.js +23 -16
  140. package/cjs/components/dropdown/index.d.ts +1 -0
  141. package/cjs/components/dropdown/item.d.ts +5 -1
  142. package/cjs/components/dropdown/item.js +22 -8
  143. package/cjs/components/form/form-item.d.ts +6 -5
  144. package/cjs/components/form/form-item.js +25 -17
  145. package/cjs/components/form/form.d.ts +1 -1
  146. package/cjs/components/form/index.d.ts +1 -1
  147. package/cjs/components/input/input.d.ts +3 -1
  148. package/cjs/components/input/input.js +53 -51
  149. package/cjs/components/list/list-item.d.ts +6 -2
  150. package/cjs/components/list/list-item.js +16 -6
  151. package/cjs/components/nav-bar/nav-bar.d.ts +4 -0
  152. package/cjs/components/nav-bar/nav-bar.js +18 -13
  153. package/cjs/components/notice-bar/notice-bar.css +0 -2
  154. package/cjs/components/notice-bar/notice-bar.d.ts +3 -1
  155. package/cjs/components/notice-bar/notice-bar.js +30 -25
  156. package/cjs/components/number-keyboard/number-keyboard.d.ts +1 -1
  157. package/cjs/components/number-keyboard/number-keyboard.js +14 -13
  158. package/cjs/components/popup/popup-base-props.d.ts +3 -2
  159. package/cjs/components/popup/popup-base-props.js +4 -0
  160. package/cjs/components/popup/popup.js +5 -5
  161. package/cjs/components/result/result.js +3 -10
  162. package/cjs/components/result/use-result-icon.d.ts +3 -0
  163. package/cjs/components/result/use-result-icon.js +37 -0
  164. package/cjs/components/result-page/result-page.js +3 -10
  165. package/cjs/components/search-bar/search-bar.d.ts +10 -2
  166. package/cjs/components/search-bar/search-bar.js +34 -33
  167. package/cjs/components/toast/toast.css +1 -1
  168. package/cjs/components/toast/toast.d.ts +2 -2
  169. package/cjs/components/toast/toast.js +4 -4
  170. package/cjs/components/virtual-input/virtual-input.d.ts +5 -5
  171. package/cjs/components/virtual-input/virtual-input.js +26 -24
  172. package/cjs/locales/ar-SA.js +2 -2
  173. package/cjs/locales/de-DE.js +3 -3
  174. package/cjs/locales/es-ES.js +2 -2
  175. package/cjs/locales/fr-FR.js +1 -1
  176. package/cjs/locales/in-ID.d.ts +139 -0
  177. package/cjs/locales/in-ID.js +149 -0
  178. package/cjs/locales/ja-JP.js +2 -2
  179. package/cjs/locales/th-TH.js +2 -2
  180. package/cjs/utils/is-node-with-content.d.ts +3 -0
  181. package/cjs/utils/is-node-with-content.js +3 -0
  182. package/cjs/utils/use-mutation-effect.d.ts +1 -0
  183. package/cjs/utils/use-mutation-effect.js +20 -9
  184. package/cjs/utils/with-default-props.d.ts +7 -0
  185. package/cjs/utils/with-default-props.js +21 -5
  186. package/es/components/card/card.css +5 -5
  187. package/es/components/card/card.patch.css +17 -0
  188. package/es/components/center-popup/center-popup.js +45 -42
  189. package/es/components/check-list/check-list.js +15 -11
  190. package/es/components/collapse/collapse.d.ts +10 -2
  191. package/es/components/collapse/collapse.js +53 -38
  192. package/es/components/config-provider/config-provider.d.ts +40 -2
  193. package/es/components/dropdown/context.d.ts +2 -0
  194. package/es/components/dropdown/context.js +2 -0
  195. package/es/components/dropdown/dropdown.d.ts +11 -3
  196. package/es/components/dropdown/dropdown.js +24 -17
  197. package/es/components/dropdown/index.d.ts +1 -0
  198. package/es/components/dropdown/item.d.ts +5 -1
  199. package/es/components/dropdown/item.js +22 -8
  200. package/es/components/form/form-item.d.ts +6 -5
  201. package/es/components/form/form-item.js +24 -16
  202. package/es/components/form/form.d.ts +1 -1
  203. package/es/components/form/index.d.ts +1 -1
  204. package/es/components/input/input.d.ts +3 -1
  205. package/es/components/input/input.js +52 -50
  206. package/es/components/list/list-item.d.ts +6 -2
  207. package/es/components/list/list-item.js +16 -6
  208. package/es/components/nav-bar/nav-bar.d.ts +4 -0
  209. package/es/components/nav-bar/nav-bar.js +18 -13
  210. package/es/components/notice-bar/notice-bar.css +0 -2
  211. package/es/components/notice-bar/notice-bar.d.ts +3 -1
  212. package/es/components/notice-bar/notice-bar.js +29 -24
  213. package/es/components/number-keyboard/number-keyboard.d.ts +1 -1
  214. package/es/components/number-keyboard/number-keyboard.js +13 -12
  215. package/es/components/popup/popup-base-props.d.ts +3 -2
  216. package/es/components/popup/popup-base-props.js +3 -0
  217. package/es/components/popup/popup.js +5 -5
  218. package/es/components/result/result.js +3 -10
  219. package/es/components/result/use-result-icon.d.ts +3 -0
  220. package/es/components/result/use-result-icon.js +29 -0
  221. package/es/components/result-page/result-page.js +3 -10
  222. package/es/components/search-bar/search-bar.d.ts +10 -2
  223. package/es/components/search-bar/search-bar.js +33 -32
  224. package/es/components/toast/toast.css +1 -1
  225. package/es/components/toast/toast.d.ts +2 -2
  226. package/es/components/toast/toast.js +3 -3
  227. package/es/components/virtual-input/virtual-input.d.ts +5 -5
  228. package/es/components/virtual-input/virtual-input.js +25 -23
  229. package/es/locales/ar-SA.js +2 -2
  230. package/es/locales/de-DE.js +3 -3
  231. package/es/locales/es-ES.js +2 -2
  232. package/es/locales/fr-FR.js +1 -1
  233. package/es/locales/in-ID.d.ts +139 -0
  234. package/es/locales/in-ID.js +142 -0
  235. package/es/locales/ja-JP.js +2 -2
  236. package/es/locales/th-TH.js +2 -2
  237. package/es/utils/is-node-with-content.d.ts +3 -0
  238. package/es/utils/is-node-with-content.js +3 -0
  239. package/es/utils/use-mutation-effect.d.ts +1 -0
  240. package/es/utils/use-mutation-effect.js +19 -9
  241. package/es/utils/with-default-props.d.ts +7 -0
  242. package/es/utils/with-default-props.js +20 -5
  243. package/package.json +3 -2
  244. package/umd/antd-mobile.js +1 -1
@@ -1,14 +1,17 @@
1
- import React, { isValidElement, useRef } from 'react';
2
- import { withNativeProps } from '../../utils/native-props';
3
- import List from '../list';
1
+ import { animated, useSpring } from '@react-spring/web';
2
+ import { useMount } from 'ahooks';
4
3
  import { DownOutline } from 'antd-mobile-icons';
5
4
  import classNames from 'classnames';
6
- import { useSpring, animated } from '@react-spring/web';
7
- import { usePropsValue } from '../../utils/use-props-value';
8
- import { useMount } from 'ahooks';
5
+ import React, { isValidElement, useRef } from 'react';
6
+ import { withNativeProps } from '../../utils/native-props';
9
7
  import { useShouldRender } from '../../utils/should-render';
10
- import { useIsomorphicUpdateLayoutEffect } from '../../utils/use-isomorphic-update-layout-effect';
11
8
  import { traverseReactNode } from '../../utils/traverse-react-node';
9
+ import { useIsomorphicUpdateLayoutEffect } from '../../utils/use-isomorphic-update-layout-effect';
10
+ import { observe } from '../../utils/use-mutation-effect';
11
+ import { usePropsValue } from '../../utils/use-props-value';
12
+ import { mergeProp, mergeProps } from '../../utils/with-default-props';
13
+ import { useConfig } from '../config-provider';
14
+ import List from '../list';
12
15
  const classPrefix = `adm-collapse`;
13
16
  export const CollapsePanel = () => {
14
17
  return null;
@@ -46,9 +49,25 @@ const CollapsePanelContent = props => {
46
49
  const inner = innerRef.current;
47
50
  if (!inner) return;
48
51
  if (visible) {
49
- api.start({
50
- height: inner.offsetHeight
51
- });
52
+ let lastMotionId = 0;
53
+ let cancelObserve = () => {};
54
+ const handleMotion = () => {
55
+ lastMotionId += 1;
56
+ const motionId = lastMotionId;
57
+ api.start({
58
+ height: inner.offsetHeight
59
+ })[0].then(() => {
60
+ if (motionId === lastMotionId) {
61
+ cancelObserve();
62
+ }
63
+ });
64
+ };
65
+ cancelObserve = observe(inner, {
66
+ childList: true,
67
+ subtree: true
68
+ }, handleMotion);
69
+ handleMotion();
70
+ return cancelObserve;
52
71
  } else {
53
72
  api.start({
54
73
  height: inner.offsetHeight,
@@ -78,8 +97,12 @@ const CollapsePanelContent = props => {
78
97
  }, React.createElement(List.Item, null, shouldRender && props.children)));
79
98
  };
80
99
  export const Collapse = props => {
100
+ const {
101
+ collapse: componentConfig = {}
102
+ } = useConfig();
103
+ const mergedProps = mergeProps(componentConfig, props);
81
104
  const panels = [];
82
- traverseReactNode(props.children, child => {
105
+ traverseReactNode(mergedProps.children, child => {
83
106
  if (!isValidElement(child)) return;
84
107
  const key = child.key;
85
108
  if (typeof key !== 'string') return;
@@ -87,11 +110,11 @@ export const Collapse = props => {
87
110
  });
88
111
  const handlePropsValue = () => {
89
112
  var _a;
90
- if (!props.accordion) {
113
+ if (!mergedProps.accordion) {
91
114
  return {
92
- value: props.activeKey,
93
- defaultValue: (_a = props.defaultActiveKey) !== null && _a !== void 0 ? _a : [],
94
- onChange: props.onChange
115
+ value: mergedProps.activeKey,
116
+ defaultValue: (_a = mergedProps.defaultActiveKey) !== null && _a !== void 0 ? _a : [],
117
+ onChange: mergedProps.onChange
95
118
  };
96
119
  }
97
120
  const initValue = {
@@ -99,29 +122,29 @@ export const Collapse = props => {
99
122
  defaultValue: [],
100
123
  onChange: v => {
101
124
  var _a, _b;
102
- (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, (_b = v[0]) !== null && _b !== void 0 ? _b : null);
125
+ (_a = mergedProps.onChange) === null || _a === void 0 ? void 0 : _a.call(mergedProps, (_b = v[0]) !== null && _b !== void 0 ? _b : null);
103
126
  }
104
127
  };
105
- if (props.activeKey === undefined) {
128
+ if (mergedProps.activeKey === undefined) {
106
129
  initValue.value = undefined;
107
- } else if (props.activeKey !== null) {
108
- initValue.value = [props.activeKey];
130
+ } else if (mergedProps.activeKey !== null) {
131
+ initValue.value = [mergedProps.activeKey];
109
132
  }
110
- if (![null, undefined].includes(props.defaultActiveKey)) {
111
- initValue.defaultValue = [props.defaultActiveKey];
133
+ if (![null, undefined].includes(mergedProps.defaultActiveKey)) {
134
+ initValue.defaultValue = [mergedProps.defaultActiveKey];
112
135
  }
113
136
  return initValue;
114
137
  };
115
138
  const [activeKey, setActiveKey] = usePropsValue(handlePropsValue());
116
139
  const activeKeyList = activeKey === null ? [] : Array.isArray(activeKey) ? activeKey : [activeKey];
117
- return withNativeProps(props, React.createElement("div", {
140
+ return withNativeProps(mergedProps, React.createElement("div", {
118
141
  className: classPrefix
119
142
  }, React.createElement(List, null, panels.map(panel => {
120
143
  const key = panel.key;
121
144
  const active = activeKeyList.includes(key);
122
145
  function handleClick(event) {
123
146
  var _a, _b;
124
- if (props.accordion) {
147
+ if (mergedProps.accordion) {
125
148
  if (active) {
126
149
  setActiveKey([]);
127
150
  } else {
@@ -136,27 +159,19 @@ export const Collapse = props => {
136
159
  }
137
160
  (_b = (_a = panel.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
138
161
  }
139
- const renderArrow = () => {
140
- let arrow = React.createElement(DownOutline, null);
141
- if (props.arrow !== undefined) {
142
- arrow = props.arrow;
143
- }
144
- if (panel.props.arrow !== undefined) {
145
- arrow = panel.props.arrow;
146
- }
147
- return typeof arrow === 'function' ? arrow(active) : React.createElement("div", {
148
- className: classNames(`${classPrefix}-arrow`, {
149
- [`${classPrefix}-arrow-active`]: active
150
- })
151
- }, arrow);
152
- };
162
+ const arrow = mergeProp(React.createElement(DownOutline, null), mergedProps.arrow, mergedProps.arrowIcon, panel.props.arrow, panel.props.arrowIcon);
163
+ const arrowIcon = typeof arrow === 'function' ? arrow(active) : React.createElement("div", {
164
+ className: classNames(`${classPrefix}-arrow`, {
165
+ [`${classPrefix}-arrow-active`]: active
166
+ })
167
+ }, arrow);
153
168
  return React.createElement(React.Fragment, {
154
169
  key: key
155
170
  }, withNativeProps(panel.props, React.createElement(List.Item, {
156
171
  className: `${classPrefix}-panel-header`,
157
172
  onClick: handleClick,
158
173
  disabled: panel.props.disabled,
159
- arrow: renderArrow()
174
+ arrowIcon: arrowIcon
160
175
  }, panel.props.title)), React.createElement(CollapsePanelContent, {
161
176
  visible: active,
162
177
  forceRender: !!panel.props.forceRender,
@@ -1,14 +1,52 @@
1
- import type { FC, ReactNode } from 'react';
1
+ import { FC, ReactNode } from 'react';
2
2
  import { Locale } from '../../locales/base';
3
3
  declare type Config = {
4
4
  locale: Locale;
5
+ checkList?: {
6
+ activeIcon?: ReactNode;
7
+ };
8
+ collapse?: {
9
+ arrowIcon?: ReactNode | ((active: boolean) => ReactNode);
10
+ };
11
+ dropdown?: {
12
+ arrowIcon?: ReactNode;
13
+ };
14
+ form?: {
15
+ helpIcon?: ReactNode;
16
+ };
17
+ input?: {
18
+ clearIcon?: ReactNode;
19
+ };
20
+ list?: {
21
+ arrowIcon?: ReactNode;
22
+ };
23
+ navBar?: {
24
+ backIcon?: ReactNode;
25
+ };
26
+ noticeBar?: {
27
+ icon?: ReactNode;
28
+ closeIcon?: ReactNode;
29
+ };
30
+ popup?: {
31
+ closeIcon?: ReactNode;
32
+ };
33
+ result?: {
34
+ successIcon?: ReactNode;
35
+ errorIcon?: ReactNode;
36
+ infoIcon?: ReactNode;
37
+ waitingIcon?: ReactNode;
38
+ warningIcon?: ReactNode;
39
+ };
40
+ searchBar?: {
41
+ searchIcon?: ReactNode;
42
+ };
5
43
  };
6
44
  export declare const defaultConfigRef: {
7
45
  current: Config;
8
46
  };
9
47
  export declare function setDefaultConfig(config: Config): void;
10
48
  export declare function getDefaultConfig(): Config;
11
- export declare type ConfigProviderProps = Config & {
49
+ export declare type ConfigProviderProps = Partial<Config> & {
12
50
  children?: ReactNode;
13
51
  };
14
52
  export declare const ConfigProvider: FC<ConfigProviderProps>;
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export declare const IconContext: React.Context<React.ReactNode>;
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export const IconContext = React.createContext(null);
@@ -1,13 +1,17 @@
1
- import React from 'react';
2
1
  import type { ReactNode } from 'react';
3
- import { PopupProps } from '../popup';
2
+ import React from 'react';
4
3
  import { NativeProps } from '../../utils/native-props';
4
+ import { PopupProps } from '../popup';
5
5
  export declare type DropdownProps = {
6
6
  activeKey?: string | null;
7
7
  defaultActiveKey?: string | null;
8
8
  closeOnMaskClick?: boolean;
9
9
  closeOnClickAway?: boolean;
10
10
  onChange?: (key: string | null) => void;
11
+ arrowIcon?: ReactNode;
12
+ /**
13
+ * @deprecated use `arrowIcon` instead
14
+ */
11
15
  arrow?: ReactNode;
12
16
  getContainer?: PopupProps['getContainer'];
13
17
  } & NativeProps;
@@ -20,6 +24,10 @@ declare const Dropdown: React.ForwardRefExoticComponent<{
20
24
  closeOnMaskClick?: boolean | undefined;
21
25
  closeOnClickAway?: boolean | undefined;
22
26
  onChange?: ((key: string | null) => void) | undefined;
27
+ arrowIcon?: ReactNode;
28
+ /**
29
+ * @deprecated use `arrowIcon` instead
30
+ */
23
31
  arrow?: ReactNode;
24
32
  getContainer?: PopupProps['getContainer'];
25
33
  } & {
@@ -27,6 +35,6 @@ declare const Dropdown: React.ForwardRefExoticComponent<{
27
35
  style?: (React.CSSProperties & Partial<Record<never, string>>) | undefined;
28
36
  tabIndex?: number | undefined;
29
37
  } & React.AriaAttributes & {
30
- children?: React.ReactNode;
38
+ children?: ReactNode;
31
39
  } & React.RefAttributes<DropdownRef>>;
32
40
  export default Dropdown;
@@ -1,12 +1,14 @@
1
1
  import { useClickAway } from 'ahooks';
2
2
  import classNames from 'classnames';
3
- import React, { cloneElement, useEffect, useRef, useState, forwardRef, useImperativeHandle, isValidElement } from 'react';
4
- import Popup from '../popup';
5
- import { ItemChildrenWrap } from './item';
3
+ import React, { cloneElement, forwardRef, isValidElement, useEffect, useImperativeHandle, useRef, useState } from 'react';
6
4
  import { withNativeProps } from '../../utils/native-props';
7
- import { mergeProps } from '../../utils/with-default-props';
8
5
  import { usePropsValue } from '../../utils/use-props-value';
6
+ import { mergeProp, mergeProps } from '../../utils/with-default-props';
7
+ import { useConfig } from '../config-provider';
8
+ import Popup from '../popup';
9
9
  import { defaultPopupBaseProps } from '../popup/popup-base-props';
10
+ import { IconContext } from './context';
11
+ import { ItemChildrenWrap } from './item';
10
12
  const classPrefix = `adm-dropdown`;
11
13
  const defaultProps = {
12
14
  defaultActiveKey: null,
@@ -14,18 +16,22 @@ const defaultProps = {
14
16
  closeOnClickAway: false,
15
17
  getContainer: defaultPopupBaseProps['getContainer']
16
18
  };
17
- const Dropdown = forwardRef((p, ref) => {
18
- const props = mergeProps(defaultProps, p);
19
+ const Dropdown = forwardRef((props, ref) => {
20
+ const {
21
+ dropdown: componentConfig = {}
22
+ } = useConfig();
23
+ const mergedProps = mergeProps(defaultProps, componentConfig, props);
24
+ const arrowIcon = mergeProp(componentConfig.arrowIcon, props.arrow, props.arrowIcon);
19
25
  const [value, setValue] = usePropsValue({
20
- value: props.activeKey,
21
- defaultValue: props.defaultActiveKey,
22
- onChange: props.onChange
26
+ value: mergedProps.activeKey,
27
+ defaultValue: mergedProps.defaultActiveKey,
28
+ onChange: mergedProps.onChange
23
29
  });
24
30
  const navRef = useRef(null);
25
31
  const contentRef = useRef(null);
26
32
  // 点击外部区域,关闭
27
33
  useClickAway(() => {
28
- if (!props.closeOnClickAway) return;
34
+ if (!mergedProps.closeOnClickAway) return;
29
35
  setValue(null);
30
36
  }, [navRef, contentRef]);
31
37
  // 计算 navs 的 top 值
@@ -48,7 +54,7 @@ const Dropdown = forwardRef((p, ref) => {
48
54
  };
49
55
  let popupForceRender = false;
50
56
  const items = [];
51
- const navs = React.Children.map(props.children, child => {
57
+ const navs = React.Children.map(mergedProps.children, child => {
52
58
  if (isValidElement(child)) {
53
59
  const childProps = Object.assign(Object.assign({}, child.props), {
54
60
  onClick: event => {
@@ -56,8 +62,7 @@ const Dropdown = forwardRef((p, ref) => {
56
62
  changeActive(child.key);
57
63
  (_b = (_a = child.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
58
64
  },
59
- active: child.key === value,
60
- arrow: child.props.arrow === undefined ? props.arrow : child.props.arrow
65
+ active: child.key === value
61
66
  });
62
67
  items.push(child);
63
68
  if (child.props.forceRender) popupForceRender = true;
@@ -71,18 +76,20 @@ const Dropdown = forwardRef((p, ref) => {
71
76
  setValue(null);
72
77
  }
73
78
  }), [setValue]);
74
- return withNativeProps(props, React.createElement("div", {
79
+ return withNativeProps(mergedProps, React.createElement("div", {
75
80
  className: classNames(classPrefix, {
76
81
  [`${classPrefix}-open`]: !!value
77
82
  }),
78
83
  ref: containerRef
84
+ }, React.createElement(IconContext.Provider, {
85
+ value: arrowIcon
79
86
  }, React.createElement("div", {
80
87
  className: `${classPrefix}-nav`,
81
88
  ref: navRef
82
- }, navs), React.createElement(Popup, {
89
+ }, navs)), React.createElement(Popup, {
83
90
  visible: !!value,
84
91
  position: 'top',
85
- getContainer: props.getContainer,
92
+ getContainer: mergedProps.getContainer,
86
93
  className: `${classPrefix}-popup`,
87
94
  maskClassName: `${classPrefix}-popup-mask`,
88
95
  bodyClassName: `${classPrefix}-popup-body`,
@@ -90,7 +97,7 @@ const Dropdown = forwardRef((p, ref) => {
90
97
  top
91
98
  },
92
99
  forceRender: popupForceRender,
93
- onMaskClick: props.closeOnMaskClick ? () => {
100
+ onMaskClick: mergedProps.closeOnMaskClick ? () => {
94
101
  changeActive(null);
95
102
  } : undefined
96
103
  }, React.createElement("div", {
@@ -7,6 +7,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
7
7
  closeOnMaskClick?: boolean | undefined;
8
8
  closeOnClickAway?: boolean | undefined;
9
9
  onChange?: ((key: string | null) => void) | undefined;
10
+ arrowIcon?: import("react").ReactNode;
10
11
  arrow?: import("react").ReactNode;
11
12
  getContainer?: import("../../utils/render-to-container").GetContainer | undefined;
12
13
  } & {
@@ -1,5 +1,5 @@
1
- import React from 'react';
2
1
  import type { FC, ReactNode } from 'react';
2
+ import React from 'react';
3
3
  import { NativeProps } from '../../utils/native-props';
4
4
  export declare type DropdownItemProps = {
5
5
  key: string;
@@ -9,6 +9,10 @@ export declare type DropdownItemProps = {
9
9
  forceRender?: boolean;
10
10
  destroyOnClose?: boolean;
11
11
  onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
12
+ arrowIcon?: ReactNode;
13
+ /**
14
+ * @deprecated use `arrowIcon` instead
15
+ */
12
16
  arrow?: ReactNode;
13
17
  children?: ReactNode;
14
18
  } & NativeProps;
@@ -1,27 +1,41 @@
1
+ import { DownFill } from 'antd-mobile-icons';
1
2
  import classNames from 'classnames';
2
3
  import React from 'react';
3
4
  import { withNativeProps } from '../../utils/native-props';
4
5
  import { useShouldRender } from '../../utils/should-render';
5
- import { DownFill } from 'antd-mobile-icons';
6
+ import { mergeProp, mergeProps } from '../../utils/with-default-props';
7
+ import { useConfig } from '../config-provider';
8
+ import { IconContext } from './context';
6
9
  const classPrefix = `adm-dropdown-item`;
7
10
  const Item = props => {
8
- var _a;
11
+ const {
12
+ dropdown: componentConfig = {}
13
+ } = useConfig();
14
+ const mergedProps = mergeProps(componentConfig, props);
15
+ const {
16
+ active,
17
+ highlight,
18
+ onClick,
19
+ title
20
+ } = mergedProps;
9
21
  const cls = classNames(classPrefix, {
10
- [`${classPrefix}-active`]: props.active,
11
- [`${classPrefix}-highlight`]: (_a = props.highlight) !== null && _a !== void 0 ? _a : props.active
22
+ [`${classPrefix}-active`]: active,
23
+ [`${classPrefix}-highlight`]: highlight !== null && highlight !== void 0 ? highlight : active
12
24
  });
25
+ const contextArrowIcon = React.useContext(IconContext);
26
+ const mergedArrowIcon = mergeProp(React.createElement(DownFill, null), contextArrowIcon, mergedProps.arrow, mergedProps.arrowIcon);
13
27
  return withNativeProps(props, React.createElement("div", {
14
28
  className: cls,
15
- onClick: props.onClick
29
+ onClick: onClick
16
30
  }, React.createElement("div", {
17
31
  className: `${classPrefix}-title`
18
32
  }, React.createElement("span", {
19
33
  className: `${classPrefix}-title-text`
20
- }, props.title), React.createElement("span", {
34
+ }, title), React.createElement("span", {
21
35
  className: classNames(`${classPrefix}-title-arrow`, {
22
- [`${classPrefix}-title-arrow-active`]: props.active
36
+ [`${classPrefix}-title-arrow-active`]: active
23
37
  })
24
- }, props.arrow === undefined ? React.createElement(DownFill, null) : props.arrow))));
38
+ }, mergedArrowIcon))));
25
39
  };
26
40
  export default Item;
27
41
  export const ItemChildrenWrap = props => {
@@ -1,16 +1,17 @@
1
- import React from 'react';
2
- import type { FC, ReactNode, MutableRefObject } from 'react';
3
- import { NativeProps } from '../../utils/native-props';
4
1
  import { FormInstance } from 'rc-field-form';
5
2
  import type { FieldProps } from 'rc-field-form/lib/Field';
6
- import type { FormLayout } from './index';
3
+ import type { FC, MutableRefObject, ReactNode } from 'react';
4
+ import React from 'react';
5
+ import { NativeProps } from '../../utils/native-props';
7
6
  import { ListItemProps } from '../list';
7
+ import type { FormLayout } from './index';
8
8
  declare type RenderChildren<Values = any> = (form: FormInstance<Values>) => ReactNode;
9
9
  declare type ChildrenType<Values = any> = RenderChildren<Values> | ReactNode;
10
10
  declare type RcFieldProps = Omit<FieldProps, 'children'>;
11
- export declare type FormItemProps = Pick<RcFieldProps, 'dependencies' | 'valuePropName' | 'name' | 'rules' | 'messageVariables' | 'trigger' | 'validateTrigger' | 'shouldUpdate' | 'initialValue' | 'getValueFromEvent' | 'getValueProps' | 'normalize' | 'preserve' | 'validateFirst'> & Pick<ListItemProps, 'style' | 'extra' | 'clickable' | 'arrow' | 'description'> & {
11
+ export declare type FormItemProps = Pick<RcFieldProps, 'dependencies' | 'valuePropName' | 'name' | 'rules' | 'messageVariables' | 'trigger' | 'validateTrigger' | 'shouldUpdate' | 'initialValue' | 'getValueFromEvent' | 'getValueProps' | 'normalize' | 'preserve' | 'validateFirst'> & Pick<ListItemProps, 'style' | 'extra' | 'clickable' | 'arrow' | 'arrowIcon' | 'description'> & {
12
12
  label?: ReactNode;
13
13
  help?: ReactNode;
14
+ helpIcon?: ReactNode;
14
15
  hasFeedback?: boolean;
15
16
  required?: boolean;
16
17
  noStyle?: boolean;
@@ -1,17 +1,18 @@
1
1
  import { __rest } from "tslib";
2
- import React, { useContext, useCallback, useState, useRef } from 'react';
2
+ import { QuestionCircleOutline } from 'antd-mobile-icons';
3
3
  import classNames from 'classnames';
4
- import { withNativeProps } from '../../utils/native-props';
5
4
  import { Field } from 'rc-field-form';
6
5
  import FieldContext from 'rc-field-form/lib/FieldContext';
6
+ import React, { useCallback, useContext, useRef, useState } from 'react';
7
7
  import { devWarning } from '../../utils/dev-log';
8
- import { FormContext, NoStyleItemContext } from './context';
9
- import { toArray, isSafeSetRefComponent } from './utils';
8
+ import { withNativeProps } from '../../utils/native-props';
9
+ import { undefinedFallback } from '../../utils/undefined-fallback';
10
+ import { mergeProps } from '../../utils/with-default-props';
11
+ import { useConfig } from '../config-provider';
10
12
  import List from '../list';
11
13
  import Popover from '../popover';
12
- import { QuestionCircleOutline } from 'antd-mobile-icons';
13
- import { useConfig } from '../config-provider';
14
- import { undefinedFallback } from '../../utils/undefined-fallback';
14
+ import { FormContext, NoStyleItemContext } from './context';
15
+ import { isSafeSetRefComponent, toArray } from './utils';
15
16
  const NAME_SPLIT = '__SPLIT__';
16
17
  const classPrefix = `adm-form-item`;
17
18
  const MemoInput = React.memo(({
@@ -19,22 +20,25 @@ const MemoInput = React.memo(({
19
20
  }) => children, (prev, next) => prev.value === next.value && prev.update === next.update);
20
21
  const FormItemLayout = props => {
21
22
  var _a;
23
+ const {
24
+ locale,
25
+ form: componentConfig = {}
26
+ } = useConfig();
22
27
  const {
23
28
  style,
24
29
  extra,
25
30
  label,
26
31
  help,
32
+ helpIcon,
27
33
  required,
28
34
  children,
29
35
  htmlFor,
30
36
  hidden,
31
37
  arrow,
38
+ arrowIcon,
32
39
  childElementPosition = 'normal'
33
- } = props;
40
+ } = mergeProps(componentConfig, props);
34
41
  const context = useContext(FormContext);
35
- const {
36
- locale
37
- } = useConfig();
38
42
  const hasFeedback = props.hasFeedback !== undefined ? props.hasFeedback : context.hasFeedback;
39
43
  const layout = props.layout || context.layout;
40
44
  const disabled = (_a = props.disabled) !== null && _a !== void 0 ? _a : context.disabled;
@@ -74,7 +78,7 @@ const FormItemLayout = props => {
74
78
  e.stopPropagation();
75
79
  e.preventDefault();
76
80
  }
77
- }, React.createElement(QuestionCircleOutline, null))));
81
+ }, helpIcon || React.createElement(QuestionCircleOutline, null))));
78
82
  const description = (!!props.description || hasFeedback) && React.createElement(React.Fragment, null, props.description, hasFeedback && React.createElement(React.Fragment, null, props.errors.map((error, index) => React.createElement("div", {
79
83
  key: `error-${index}`,
80
84
  className: `${classPrefix}-feedback-error`
@@ -95,7 +99,7 @@ const FormItemLayout = props => {
95
99
  disabled: disabled,
96
100
  onClick: props.onClick,
97
101
  clickable: props.clickable,
98
- arrow: arrow
102
+ arrowIcon: arrowIcon || arrow
99
103
  }, React.createElement("div", {
100
104
  className: classNames(`${classPrefix}-child`, `${classPrefix}-child-position-${childElementPosition}`)
101
105
  }, React.createElement("div", {
@@ -109,6 +113,7 @@ export const FormItem = props => {
109
113
  // FormItem 相关
110
114
  label,
111
115
  help,
116
+ helpIcon,
112
117
  extra,
113
118
  hasFeedback,
114
119
  name,
@@ -129,9 +134,10 @@ export const FormItem = props => {
129
134
  shouldUpdate,
130
135
  dependencies,
131
136
  clickable,
132
- arrow
137
+ arrow,
138
+ arrowIcon
133
139
  } = props,
134
- fieldProps = __rest(props, ["style", "label", "help", "extra", "hasFeedback", "name", "required", "noStyle", "hidden", "layout", "childElementPosition", "description", "disabled", "rules", "children", "messageVariables", "trigger", "validateTrigger", "onClick", "shouldUpdate", "dependencies", "clickable", "arrow"]);
140
+ fieldProps = __rest(props, ["style", "label", "help", "helpIcon", "extra", "hasFeedback", "name", "required", "noStyle", "hidden", "layout", "childElementPosition", "description", "disabled", "rules", "children", "messageVariables", "trigger", "validateTrigger", "onClick", "shouldUpdate", "dependencies", "clickable", "arrow", "arrowIcon"]);
135
141
  const {
136
142
  name: formName
137
143
  } = useContext(FormContext);
@@ -183,6 +189,7 @@ export const FormItem = props => {
183
189
  label: label,
184
190
  extra: extra,
185
191
  help: help,
192
+ helpIcon: helpIcon,
186
193
  description: description,
187
194
  required: isRequired,
188
195
  disabled: disabled,
@@ -195,7 +202,8 @@ export const FormItem = props => {
195
202
  layout: layout,
196
203
  childElementPosition: childElementPosition,
197
204
  clickable: clickable,
198
- arrow: arrow
205
+ arrow: arrow,
206
+ arrowIcon: arrowIcon
199
207
  }, React.createElement(NoStyleItemContext.Provider, {
200
208
  value: onSubMetaChange
201
209
  }, baseChildren)));
@@ -9,7 +9,7 @@ export declare type FormProps = Pick<RcFormProps, 'form' | 'initialValues' | 'na
9
9
  footer?: ReactNode;
10
10
  mode?: ListProps['mode'];
11
11
  };
12
- export declare const Form: React.ForwardRefExoticComponent<Pick<RcFormProps<any>, "children" | "form" | "name" | "initialValues" | "preserve" | "validateMessages" | "validateTrigger" | "onFieldsChange" | "onFinish" | "onFinishFailed" | "onValuesChange"> & {
12
+ export declare const Form: React.ForwardRefExoticComponent<Pick<RcFormProps<any>, "form" | "children" | "name" | "initialValues" | "preserve" | "validateMessages" | "validateTrigger" | "onFieldsChange" | "onFinish" | "onFinishFailed" | "onValuesChange"> & {
13
13
  className?: string | undefined;
14
14
  style?: (React.CSSProperties & Partial<Record<"--border-bottom" | "--border-inner" | "--border-top" | "--prefix-width", string>>) | undefined;
15
15
  tabIndex?: number | undefined;
@@ -6,7 +6,7 @@ export type { FormItemProps } from './form-item';
6
6
  export type { FormSubscribeProps } from './form-subscribe';
7
7
  export type { ValidateMessages, FieldData, NamePath, Rule, RuleObject, RuleRender, } from 'rc-field-form/es/interface';
8
8
  export type { FormArrayField, FormArrayOperation, FormArrayProps, } from './form-array';
9
- declare const _default: import("react").ForwardRefExoticComponent<Pick<import("rc-field-form").FormProps<any>, "children" | "form" | "name" | "initialValues" | "preserve" | "validateMessages" | "validateTrigger" | "onFieldsChange" | "onFinish" | "onFinishFailed" | "onValuesChange"> & {
9
+ declare const _default: import("react").ForwardRefExoticComponent<Pick<import("rc-field-form").FormProps<any>, "form" | "children" | "name" | "initialValues" | "preserve" | "validateMessages" | "validateTrigger" | "onFieldsChange" | "onFinish" | "onFinishFailed" | "onValuesChange"> & {
10
10
  className?: string | undefined;
11
11
  style?: (import("react").CSSProperties & Partial<Record<"--border-bottom" | "--border-inner" | "--border-top" | "--prefix-width", string>>) | undefined;
12
12
  tabIndex?: number | undefined;
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
  import { NativeProps } from '../../utils/native-props';
3
3
  declare type NativeInputProps = React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
4
4
  declare type AriaProps = {
@@ -9,6 +9,7 @@ export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength
9
9
  defaultValue?: string;
10
10
  onChange?: (val: string) => void;
11
11
  clearable?: boolean;
12
+ clearIcon?: ReactNode;
12
13
  onlyShowClearWhenFocus?: boolean;
13
14
  onClear?: () => void;
14
15
  onEnterPress?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
@@ -26,6 +27,7 @@ export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProp
26
27
  defaultValue?: string | undefined;
27
28
  onChange?: ((val: string) => void) | undefined;
28
29
  clearable?: boolean | undefined;
30
+ clearIcon?: ReactNode;
29
31
  onlyShowClearWhenFocus?: boolean | undefined;
30
32
  onClear?: (() => void) | undefined;
31
33
  onEnterPress?: ((e: React.KeyboardEvent<HTMLInputElement>) => void) | undefined;