@arco-design/mobile-react 2.26.0 → 2.27.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 (238) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/README.en-US.md +2 -2
  3. package/README.md +2 -2
  4. package/cjs/form/form-item.js +4 -2
  5. package/cjs/icon/IconHeart/index.js +1 -1
  6. package/cjs/icon/IconKeyboard/index.d.ts +7 -0
  7. package/cjs/icon/IconKeyboard/index.js +48 -0
  8. package/cjs/icon/IconKeyboardDelete/index.d.ts +7 -0
  9. package/cjs/icon/IconKeyboardDelete/index.js +44 -0
  10. package/cjs/icon/IconMinus/index.js +1 -1
  11. package/cjs/icon/IconMore/index.js +1 -1
  12. package/cjs/icon/IconNotice/index.js +1 -1
  13. package/cjs/icon/IconNoticeOff/index.js +1 -1
  14. package/cjs/icon/IconPlay/index.js +1 -1
  15. package/cjs/icon/IconSetting/index.js +2 -2
  16. package/cjs/icon/IconSound/index.js +1 -1
  17. package/cjs/icon/IconStar/index.js +1 -1
  18. package/cjs/icon/IconStarFill/index.js +1 -1
  19. package/cjs/icon/IconTriDown/index.js +1 -1
  20. package/cjs/icon/IconTriUp/index.js +1 -1
  21. package/cjs/icon/IconUpload/index.js +1 -1
  22. package/cjs/icon/IconWarnCircle/index.js +1 -1
  23. package/cjs/icon/IconWarnCircleFill/index.js +1 -1
  24. package/cjs/icon/index.d.ts +2 -0
  25. package/cjs/icon/index.js +12 -2
  26. package/cjs/image-picker/style/css/index.d.ts +1 -0
  27. package/cjs/image-picker/style/css/index.js +2 -0
  28. package/cjs/image-picker/style/index.d.ts +1 -0
  29. package/cjs/image-picker/style/index.js +2 -0
  30. package/cjs/index-bar/context.d.ts +3 -0
  31. package/cjs/index-bar/context.js +15 -0
  32. package/cjs/index-bar/demo/style/css/mobile.css +23 -0
  33. package/cjs/index-bar/demo/style/mobile.less +26 -0
  34. package/cjs/index-bar/group.d.ts +3 -0
  35. package/cjs/index-bar/group.js +101 -0
  36. package/cjs/index-bar/index.d.ts +15 -0
  37. package/cjs/index-bar/index.js +276 -0
  38. package/cjs/index-bar/side-bar.d.ts +3 -0
  39. package/cjs/index-bar/side-bar.js +102 -0
  40. package/cjs/index-bar/style/css/index.css +164 -0
  41. package/cjs/index-bar/style/css/index.d.ts +3 -0
  42. package/cjs/index-bar/style/css/index.js +7 -0
  43. package/cjs/index-bar/style/index.d.ts +3 -0
  44. package/cjs/index-bar/style/index.js +7 -0
  45. package/cjs/index-bar/style/index.less +122 -0
  46. package/cjs/index-bar/type.d.ts +195 -0
  47. package/cjs/index-bar/type.js +3 -0
  48. package/cjs/index-bar/utils.d.ts +6 -0
  49. package/cjs/index-bar/utils.js +68 -0
  50. package/cjs/index.d.ts +2 -0
  51. package/cjs/index.js +9 -1
  52. package/cjs/keyboard/demo/style/css/mobile.css +4 -0
  53. package/cjs/keyboard/demo/style/mobile.less +8 -0
  54. package/cjs/keyboard/index.d.ts +13 -0
  55. package/cjs/keyboard/index.js +270 -0
  56. package/cjs/keyboard/style/css/index.css +93 -0
  57. package/cjs/keyboard/style/css/index.d.ts +3 -0
  58. package/cjs/keyboard/style/css/index.js +7 -0
  59. package/cjs/keyboard/style/index.d.ts +3 -0
  60. package/cjs/keyboard/style/index.js +7 -0
  61. package/cjs/keyboard/style/index.less +80 -0
  62. package/cjs/keyboard/type.d.ts +102 -0
  63. package/cjs/keyboard/type.js +3 -0
  64. package/cjs/picker/index.js +3 -39
  65. package/cjs/picker/type.d.ts +1 -1
  66. package/cjs/picker-view/components/cascader.d.ts +2 -3
  67. package/cjs/picker-view/components/cascader.js +8 -6
  68. package/cjs/picker-view/components/multi-picker.d.ts +2 -3
  69. package/cjs/picker-view/components/multi-picker.js +31 -35
  70. package/cjs/picker-view/components/picker-cell.d.ts +1 -1
  71. package/cjs/picker-view/components/picker-cell.js +5 -7
  72. package/cjs/picker-view/index.d.ts +1 -1
  73. package/cjs/picker-view/index.js +9 -20
  74. package/cjs/picker-view/type.d.ts +2 -2
  75. package/cjs/slider/hooks/useSliderEvents.js +20 -20
  76. package/cjs/sticky/index.js +2 -2
  77. package/cjs/style.d.ts +2 -0
  78. package/cjs/style.js +4 -0
  79. package/dist/index.js +1793 -483
  80. package/dist/index.min.js +4 -4
  81. package/dist/style.css +215 -1
  82. package/dist/style.min.css +1 -1
  83. package/esm/form/form-item.js +4 -2
  84. package/esm/icon/IconHeart/index.js +1 -1
  85. package/esm/icon/IconKeyboard/index.d.ts +7 -0
  86. package/esm/icon/IconKeyboard/index.js +37 -0
  87. package/esm/icon/IconKeyboardDelete/index.d.ts +7 -0
  88. package/esm/icon/IconKeyboardDelete/index.js +33 -0
  89. package/esm/icon/IconMinus/index.js +1 -1
  90. package/esm/icon/IconMore/index.js +1 -1
  91. package/esm/icon/IconNotice/index.js +1 -1
  92. package/esm/icon/IconNoticeOff/index.js +1 -1
  93. package/esm/icon/IconPlay/index.js +1 -1
  94. package/esm/icon/IconSetting/index.js +2 -2
  95. package/esm/icon/IconSound/index.js +1 -1
  96. package/esm/icon/IconStar/index.js +1 -1
  97. package/esm/icon/IconStarFill/index.js +1 -1
  98. package/esm/icon/IconTriDown/index.js +1 -1
  99. package/esm/icon/IconTriUp/index.js +1 -1
  100. package/esm/icon/IconUpload/index.js +1 -1
  101. package/esm/icon/IconWarnCircle/index.js +1 -1
  102. package/esm/icon/IconWarnCircleFill/index.js +1 -1
  103. package/esm/icon/index.d.ts +2 -0
  104. package/esm/icon/index.js +2 -0
  105. package/esm/image-picker/style/css/index.d.ts +1 -0
  106. package/esm/image-picker/style/css/index.js +1 -0
  107. package/esm/image-picker/style/index.d.ts +1 -0
  108. package/esm/image-picker/style/index.js +1 -0
  109. package/esm/index-bar/context.d.ts +3 -0
  110. package/esm/index-bar/context.js +8 -0
  111. package/esm/index-bar/demo/style/css/mobile.css +23 -0
  112. package/esm/index-bar/demo/style/mobile.less +26 -0
  113. package/esm/index-bar/group.d.ts +3 -0
  114. package/esm/index-bar/group.js +83 -0
  115. package/esm/index-bar/index.d.ts +15 -0
  116. package/esm/index-bar/index.js +254 -0
  117. package/esm/index-bar/side-bar.d.ts +3 -0
  118. package/esm/index-bar/side-bar.js +90 -0
  119. package/esm/index-bar/style/css/index.css +164 -0
  120. package/esm/index-bar/style/css/index.d.ts +3 -0
  121. package/esm/index-bar/style/css/index.js +3 -0
  122. package/esm/index-bar/style/index.d.ts +3 -0
  123. package/esm/index-bar/style/index.js +3 -0
  124. package/esm/index-bar/style/index.less +122 -0
  125. package/esm/index-bar/type.d.ts +195 -0
  126. package/esm/index-bar/type.js +1 -0
  127. package/esm/index-bar/utils.d.ts +6 -0
  128. package/esm/index-bar/utils.js +53 -0
  129. package/esm/index.d.ts +2 -0
  130. package/esm/index.js +2 -0
  131. package/esm/keyboard/demo/style/css/mobile.css +4 -0
  132. package/esm/keyboard/demo/style/mobile.less +8 -0
  133. package/esm/keyboard/index.d.ts +13 -0
  134. package/esm/keyboard/index.js +243 -0
  135. package/esm/keyboard/style/css/index.css +93 -0
  136. package/esm/keyboard/style/css/index.d.ts +3 -0
  137. package/esm/keyboard/style/css/index.js +3 -0
  138. package/esm/keyboard/style/index.d.ts +3 -0
  139. package/esm/keyboard/style/index.js +3 -0
  140. package/esm/keyboard/style/index.less +80 -0
  141. package/esm/keyboard/type.d.ts +102 -0
  142. package/esm/keyboard/type.js +1 -0
  143. package/esm/picker/index.js +3 -40
  144. package/esm/picker/type.d.ts +1 -1
  145. package/esm/picker-view/components/cascader.d.ts +2 -3
  146. package/esm/picker-view/components/cascader.js +8 -6
  147. package/esm/picker-view/components/multi-picker.d.ts +2 -3
  148. package/esm/picker-view/components/multi-picker.js +31 -34
  149. package/esm/picker-view/components/picker-cell.d.ts +1 -1
  150. package/esm/picker-view/components/picker-cell.js +5 -7
  151. package/esm/picker-view/index.d.ts +1 -1
  152. package/esm/picker-view/index.js +10 -21
  153. package/esm/picker-view/type.d.ts +2 -2
  154. package/esm/slider/hooks/useSliderEvents.js +20 -20
  155. package/esm/sticky/index.js +2 -2
  156. package/esm/style.d.ts +2 -0
  157. package/esm/style.js +2 -0
  158. package/package.json +3 -3
  159. package/tokens/app/arcodesign/default/css-variables.less +43 -0
  160. package/tokens/app/arcodesign/default/index.d.ts +43 -0
  161. package/tokens/app/arcodesign/default/index.js +43 -0
  162. package/tokens/app/arcodesign/default/index.json +516 -0
  163. package/tokens/app/arcodesign/default/index.less +43 -0
  164. package/umd/form/form-item.js +4 -2
  165. package/umd/icon/IconHeart/index.js +1 -1
  166. package/umd/icon/IconKeyboard/index.d.ts +7 -0
  167. package/umd/icon/IconKeyboard/index.js +56 -0
  168. package/umd/icon/IconKeyboardDelete/index.d.ts +7 -0
  169. package/umd/icon/IconKeyboardDelete/index.js +52 -0
  170. package/umd/icon/IconMinus/index.js +1 -1
  171. package/umd/icon/IconMore/index.js +1 -1
  172. package/umd/icon/IconNotice/index.js +1 -1
  173. package/umd/icon/IconNoticeOff/index.js +1 -1
  174. package/umd/icon/IconPlay/index.js +1 -1
  175. package/umd/icon/IconSetting/index.js +2 -2
  176. package/umd/icon/IconSound/index.js +1 -1
  177. package/umd/icon/IconStar/index.js +1 -1
  178. package/umd/icon/IconStarFill/index.js +1 -1
  179. package/umd/icon/IconTriDown/index.js +1 -1
  180. package/umd/icon/IconTriUp/index.js +1 -1
  181. package/umd/icon/IconUpload/index.js +1 -1
  182. package/umd/icon/IconWarnCircle/index.js +1 -1
  183. package/umd/icon/IconWarnCircleFill/index.js +1 -1
  184. package/umd/icon/index.d.ts +2 -0
  185. package/umd/icon/index.js +12 -6
  186. package/umd/image-picker/style/css/index.d.ts +1 -0
  187. package/umd/image-picker/style/css/index.js +4 -4
  188. package/umd/image-picker/style/index.d.ts +1 -0
  189. package/umd/image-picker/style/index.js +4 -4
  190. package/umd/index-bar/context.d.ts +3 -0
  191. package/umd/index-bar/context.js +26 -0
  192. package/umd/index-bar/demo/style/css/mobile.css +23 -0
  193. package/umd/index-bar/demo/style/mobile.less +26 -0
  194. package/umd/index-bar/group.d.ts +3 -0
  195. package/umd/index-bar/group.js +107 -0
  196. package/umd/index-bar/index.d.ts +15 -0
  197. package/umd/index-bar/index.js +274 -0
  198. package/umd/index-bar/side-bar.d.ts +3 -0
  199. package/umd/index-bar/side-bar.js +113 -0
  200. package/umd/index-bar/style/css/index.css +164 -0
  201. package/umd/index-bar/style/css/index.d.ts +3 -0
  202. package/umd/index-bar/style/css/index.js +15 -0
  203. package/umd/index-bar/style/index.d.ts +3 -0
  204. package/umd/index-bar/style/index.js +15 -0
  205. package/umd/index-bar/style/index.less +122 -0
  206. package/umd/index-bar/type.d.ts +195 -0
  207. package/umd/index-bar/type.js +17 -0
  208. package/umd/index-bar/utils.d.ts +6 -0
  209. package/umd/index-bar/utils.js +78 -0
  210. package/umd/index.d.ts +2 -0
  211. package/umd/index.js +9 -5
  212. package/umd/keyboard/demo/style/css/mobile.css +4 -0
  213. package/umd/keyboard/demo/style/mobile.less +8 -0
  214. package/umd/keyboard/index.d.ts +13 -0
  215. package/umd/keyboard/index.js +271 -0
  216. package/umd/keyboard/style/css/index.css +93 -0
  217. package/umd/keyboard/style/css/index.d.ts +3 -0
  218. package/umd/keyboard/style/css/index.js +15 -0
  219. package/umd/keyboard/style/index.d.ts +3 -0
  220. package/umd/keyboard/style/index.js +15 -0
  221. package/umd/keyboard/style/index.less +80 -0
  222. package/umd/keyboard/type.d.ts +102 -0
  223. package/umd/keyboard/type.js +17 -0
  224. package/umd/picker/index.js +3 -39
  225. package/umd/picker/type.d.ts +1 -1
  226. package/umd/picker-view/components/cascader.d.ts +2 -3
  227. package/umd/picker-view/components/cascader.js +8 -6
  228. package/umd/picker-view/components/multi-picker.d.ts +2 -3
  229. package/umd/picker-view/components/multi-picker.js +31 -35
  230. package/umd/picker-view/components/picker-cell.d.ts +1 -1
  231. package/umd/picker-view/components/picker-cell.js +5 -7
  232. package/umd/picker-view/index.d.ts +1 -1
  233. package/umd/picker-view/index.js +9 -20
  234. package/umd/picker-view/type.d.ts +2 -2
  235. package/umd/slider/hooks/useSliderEvents.js +20 -20
  236. package/umd/sticky/index.js +2 -2
  237. package/umd/style.d.ts +2 -0
  238. package/umd/style.js +4 -4
@@ -0,0 +1,93 @@
1
+ .arco-keyboard {
2
+ background: #f2f3f5 ;
3
+ padding: 0.16rem ;
4
+ -webkit-touch-callout: none;
5
+ /* iOS Safari */
6
+ -webkit-user-select: none;
7
+ /* Chrome/Safari/Opera */
8
+ /* Konqueror */
9
+ /* Firefox */
10
+ /* Internet Explorer/Edge */
11
+ user-select: none;
12
+ /* Non-prefixed version, currently*/
13
+ }
14
+ .arco-keyboard-wrapper {
15
+ display: -webkit-box;
16
+ display: -webkit-flex;
17
+ display: flex;
18
+ }
19
+ .arco-keyboard-key-wrapper {
20
+ -webkit-box-flex: 2;
21
+ -webkit-flex: 2 0 auto;
22
+ flex: 2 0 auto;
23
+ }
24
+ .arco-keyboard-row {
25
+ display: -webkit-box;
26
+ display: -webkit-flex;
27
+ display: flex;
28
+ }
29
+ .arco-keyboard-row:not(.arco-keyboard-row:nth-last-child(1)) {
30
+ margin-bottom: 0.16rem ;
31
+ }
32
+ .arco-keyboard-row .arco-keyboard-key:not(.arco-keyboard-row .arco-keyboard-key:nth-child(1)) {
33
+ margin-left: 0.16rem ;
34
+ }
35
+ .arco-keyboard-row .arco-keyboard-key-special {
36
+ -webkit-box-flex: 2.1;
37
+ -webkit-flex: 2.1 0 auto;
38
+ flex: 2.1 0 auto;
39
+ }
40
+ .arco-keyboard-col {
41
+ -webkit-box-flex: 1;
42
+ -webkit-flex: 1;
43
+ flex: 1;
44
+ display: -webkit-box;
45
+ display: -webkit-flex;
46
+ display: flex;
47
+ -webkit-box-orient: vertical;
48
+ -webkit-box-direction: normal;
49
+ -webkit-flex-direction: column;
50
+ flex-direction: column;
51
+ margin-left: 0.16rem ;
52
+ }
53
+ .arco-keyboard-col .arco-keyboard-key:not(.arco-keyboard-col .arco-keyboard-key:nth-child(1)) {
54
+ margin-top: 0.16rem ;
55
+ }
56
+ .arco-keyboard-col .arco-keyboard-key-confirm {
57
+ -webkit-box-flex: 2.5;
58
+ -webkit-flex: 2.5 0 auto;
59
+ flex: 2.5 0 auto;
60
+ background: #165dff ;
61
+ color: #ffffff ;
62
+ font-size: 0.36rem ;
63
+ }
64
+ .arco-keyboard-key {
65
+ display: -webkit-box;
66
+ display: -webkit-flex;
67
+ display: flex;
68
+ -webkit-box-align: center;
69
+ -webkit-align-items: center;
70
+ align-items: center;
71
+ -webkit-box-pack: center;
72
+ -webkit-justify-content: center;
73
+ justify-content: center;
74
+ -webkit-box-flex: 1;
75
+ -webkit-flex: 1;
76
+ flex: 1;
77
+ font-weight: 500 ;
78
+ font-size: 0.44rem ;
79
+ line-height: 0.6rem ;
80
+ background: #ffffff ;
81
+ height: 0.96rem ;
82
+ border-radius: 0.08rem ;
83
+ color: #1d2129 ;
84
+ }
85
+ .arco-keyboard-key:active {
86
+ background: #e5e6eb ;
87
+ }
88
+ .arco-keyboard-key .arco-icon {
89
+ font-size: 0.52rem ;
90
+ }
91
+ .arco-keyboard-popup {
92
+ display: none;
93
+ }
@@ -0,0 +1,3 @@
1
+ import '../../../../style/css/public.css';
2
+ import '../../../popup/style/css';
3
+ import './index.css';
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+
3
+ require("../../../../style/css/public.css");
4
+
5
+ require("../../../popup/style/css");
6
+
7
+ require("./index.css");
@@ -0,0 +1,3 @@
1
+ import '../../../style/public.less';
2
+ import '../../popup/style';
3
+ import './index.less';
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+
3
+ require("../../../style/public.less");
4
+
5
+ require("../../popup/style");
6
+
7
+ require("./index.less");
@@ -0,0 +1,80 @@
1
+ @import '../../../style/mixin.less';
2
+
3
+ .@{prefix}-keyboard {
4
+ .use-var(background, keyboard-background);
5
+ .use-var(padding, keyboard-content-padding);
6
+ .noselect();
7
+
8
+ &-wrapper {
9
+ display: flex;
10
+ }
11
+
12
+ &-key-wrapper {
13
+ flex: 2 0 auto;
14
+ }
15
+
16
+ &-row {
17
+ display: flex;
18
+ &:not(&:nth-last-child(1)) {
19
+ .use-var(margin-bottom, keyboard-unified-margin);
20
+ }
21
+
22
+ .@{prefix}-keyboard-key {
23
+ &:not(&:nth-child(1)) {
24
+ .use-var(margin-left, keyboard-unified-margin);
25
+ }
26
+
27
+ &-special {
28
+ flex: 2.1 0 auto;
29
+ }
30
+ }
31
+ }
32
+
33
+ &-col {
34
+ flex: 1;
35
+ display: flex;
36
+ flex-direction: column;
37
+ .use-var(margin-left, keyboard-unified-margin);
38
+
39
+ .@{prefix}-keyboard-key {
40
+ &:not(&:nth-child(1)) {
41
+ .use-var(margin-top, keyboard-unified-margin);
42
+ }
43
+
44
+ &-confirm {
45
+ flex: 2.5 0 auto;
46
+ .use-var(background, keyboard-confirm-key-background);
47
+ .use-var(color, keyboard-confirm-key-color);
48
+ .use-var(font-size, keyboard-confirm-key-font-size);
49
+ }
50
+ }
51
+ }
52
+
53
+ &-key {
54
+ display: flex;
55
+ align-items: center;
56
+ justify-content: center;
57
+ flex: 1;
58
+
59
+ .use-var(font-weight, keyboard-key-font-weight);
60
+ .use-var(font-size, keyboard-key-font-size);
61
+ .use-var(line-height, keyboard-key-line-height);
62
+ .use-var(background, keyboard-key-background);
63
+ .use-var(border-radius, keyboard-key-border-radius);
64
+ .use-var(height, keyboard-key-height);
65
+ .use-var(border-radius, keyboard-key-border-radius);
66
+ .use-var(color, keyboard-key-color);
67
+
68
+ &:active {
69
+ .use-var(background, keyboard-key-active-background);
70
+ }
71
+
72
+ .@{prefix}-icon {
73
+ .use-var(font-size, keyboard-key-icon-size);
74
+ }
75
+ }
76
+
77
+ &-popup {
78
+ display: none;
79
+ }
80
+ }
@@ -0,0 +1,102 @@
1
+ import { CSSProperties, ReactNode } from 'react';
2
+ import { PopupProps, PopupRef } from '../popup';
3
+ export declare type ColumnData = string | number | ColumnObjData;
4
+ export declare type ColumnObjData = {
5
+ type: 'keyboard' | 'delete';
6
+ } | {
7
+ type: 'content';
8
+ content: ReactNode;
9
+ value: string | number;
10
+ };
11
+ export interface KeyboardProps extends PopupProps {
12
+ /**
13
+ * 常规键位自定义类名
14
+ * @en Custom classname for normal keys
15
+ */
16
+ normalKeyClass?: string;
17
+ /**
18
+ * 常规键位自定义样式
19
+ * @en Custom style for normal keys
20
+ */
21
+ normalKeyStyle?: CSSProperties;
22
+ /**
23
+ * 自定义类名
24
+ * @en Custom classname
25
+ */
26
+ className?: string;
27
+ /**
28
+ * 自定义样式
29
+ * @en Custom stylesheet
30
+ */
31
+ style?: React.CSSProperties;
32
+ /**
33
+ * 键盘展示类型,不同类型有不同布局。number - 纯数字常规键盘,confirm - 带确认按钮的键盘,tool - 带运算符的键盘
34
+ * @en Keyboard display type, different types have different layouts. number - a regular keyboard with pure numbers, confirm - a keyboard with a confirm button, tool - a keyboard with operators
35
+ * @default "number"
36
+ */
37
+ type?: 'number' | 'confirm' | 'tool';
38
+ /**
39
+ * 是否打乱键盘中的数字展示位置
40
+ * @en Whether to scramble number placements in the keyboard
41
+ * @default false
42
+ */
43
+ randomOrder: boolean;
44
+ /**
45
+ * 键盘顶部展示标题内容,样式纯自定义
46
+ * @en The title content displayed on the top of the keyboard, the style is purely customized
47
+ */
48
+ title?: ReactNode;
49
+ /**
50
+ * 自定义渲染数字右侧(第四列)的内容
51
+ * @en Custom rendering of the content to the right of the number (fourth column)
52
+ */
53
+ rightColumns?: ReactNode;
54
+ /**
55
+ * 点击确认后是否自动关闭键盘
56
+ * @en Whether to automatically close the keyboard after clicking confirm button
57
+ * @default false
58
+ */
59
+ confirmClosable?: boolean;
60
+ /**
61
+ * 自定义渲染确认按钮内部内容
62
+ * @en Customize the internal content of the confirm button
63
+ */
64
+ confirmButton?: ReactNode;
65
+ /**
66
+ * 自定义渲染删除按钮内部内容
67
+ * @en Customize the internal content of the delete button
68
+ */
69
+ deleteButton?: ReactNode;
70
+ /**
71
+ * 自定义渲染收起键盘按钮内部内容
72
+ * @en Customize the internal content of the keyboard button
73
+ */
74
+ keyboardButton?: ReactNode;
75
+ /**
76
+ * 收起键盘回调
77
+ * @en Callback for closing the keyboard
78
+ */
79
+ close: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => {};
80
+ /**
81
+ * 点击确认按钮回调
82
+ * @en Callback for clicking the confirm button
83
+ */
84
+ onConfirm?: () => {};
85
+ /**
86
+ * 点击删除按钮回调
87
+ * @en Callback for clicking the delete button
88
+ */
89
+ onDelete?: () => {};
90
+ /**
91
+ * 点击常规按钮回调
92
+ * @en Callback for clicking the normal button
93
+ */
94
+ onChange?: (data: string | number) => {};
95
+ }
96
+ export interface KeyboardRef extends PopupRef {
97
+ /**
98
+ * 最外层 DOM 元素
99
+ * @en The outer DOM element of the component
100
+ */
101
+ keyboard: HTMLDivElement | null;
102
+ }
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+
3
+ exports.__esModule = true;
@@ -44,42 +44,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
44
44
 
45
45
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
46
46
 
47
- var getInitialValue = function getInitialValue(value, data, cascade) {
48
- if (value && value.length) {
49
- return value;
50
- }
51
-
52
- var computedValue = [];
53
-
54
- if (!cascade) {
55
- if (!(data[0] instanceof Array)) {
56
- var _data$;
57
-
58
- return (_data$ = data[0]) != null && _data$.value ? [data[0].value] : [];
59
- }
60
-
61
- data.map(function (column) {
62
- computedValue.push(typeof column[0] === 'object' ? column[0].value : column[0]);
63
- });
64
- } else {
65
- var cascadePickerData = data;
66
-
67
- if (!cascadePickerData || !cascadePickerData.length) {
68
- return computedValue;
69
- }
70
-
71
- computedValue.push(cascadePickerData[0].value);
72
- var traverse = cascadePickerData[0].children;
73
-
74
- while (traverse) {
75
- computedValue.push(traverse[0].value);
76
- traverse = traverse[0].children;
77
- }
78
- }
79
-
80
- return computedValue;
81
- };
82
-
83
47
  var Picker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
84
48
  var className = props.className,
85
49
  itemStyle = props.itemStyle,
@@ -117,7 +81,7 @@ var Picker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
117
81
  gestureOutOfControl = _props$gestureOutOfCo === void 0 ? true : _props$gestureOutOfCo,
118
82
  otherProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
119
83
 
120
- var _useState = (0, _react.useState)(getInitialValue(value, data, cascade)),
84
+ var _useState = (0, _react.useState)(value),
121
85
  scrollValue = _useState[0],
122
86
  setScrollValue = _useState[1];
123
87
 
@@ -171,7 +135,7 @@ var Picker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
171
135
  (0, _mobileUtils.nextTick)(function () {
172
136
  var _pickerViewRef$curren7;
173
137
 
174
- var val = ((_pickerViewRef$curren7 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren7.getAllColumnValues()) || scrollValue;
138
+ var val = ((_pickerViewRef$curren7 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren7.getAllColumnValues()) || scrollValue || [];
175
139
 
176
140
  if (onOk) {
177
141
  onOk(val);
@@ -234,7 +198,7 @@ var Picker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
234
198
  cols: cols,
235
199
  rows: rows,
236
200
  disabled: disabled,
237
- value: getInitialValue(value, data, cascade),
201
+ value: value,
238
202
  onPickerChange: onPickerChange,
239
203
  itemStyle: itemStyle,
240
204
  clickable: clickable,
@@ -51,7 +51,7 @@ export interface PickerProps extends Omit<PopupProps, 'visible' | 'close' | 'chi
51
51
  * 每列数据选择变化后的回调函数
52
52
  * @en The callback after each column data selection changes
53
53
  */
54
- onPickerChange?: (value: ValueType[], index: number) => void;
54
+ onPickerChange?: (value: ValueType[], index: number, data: PickerData[]) => void;
55
55
  /**
56
56
  * 每列样式
57
57
  * @en Stylesheet per column
@@ -9,11 +9,10 @@ export interface CascaderProps {
9
9
  disabled: boolean;
10
10
  itemHeight: number;
11
11
  wrapperHeight: number;
12
- selectedValue: ValueType[];
12
+ selectedValue?: ValueType[];
13
13
  rows?: number;
14
14
  hideEmptyCols?: boolean;
15
- onValueChange?: (value: ValueType[], index: number) => void;
16
- onPickerChange?: (value: ValueType[], index: number) => void;
15
+ onValueChange?: (value: ValueType[], index: number, data: PickerData[]) => void;
17
16
  touchToStop?: boolean | number;
18
17
  }
19
18
  export interface CascaderRef {
@@ -28,7 +28,6 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
28
28
  wrapperHeight = props.wrapperHeight,
29
29
  rows = props.rows,
30
30
  hideEmptyCols = props.hideEmptyCols,
31
- onPickerChange = props.onPickerChange,
32
31
  onValueChange = props.onValueChange,
33
32
  _props$selectedValue = props.selectedValue,
34
33
  selectedValue = _props$selectedValue === void 0 ? [] : _props$selectedValue,
@@ -53,7 +52,7 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
53
52
  });
54
53
  }
55
54
 
56
- function _onValueChange(value, index) {
55
+ function _onValueChange(value, index, newData) {
57
56
  var children = (0, _mobileUtils.arrayTreeFilter)(data, function (item, level) {
58
57
  return level <= index && item.value === value[level];
59
58
  });
@@ -63,15 +62,19 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
63
62
  for (i = index + 1; i < cols && child && child.children; i++) {
64
63
  child = child.children[0];
65
64
  value[i] = child.value;
65
+ newData[i] = child;
66
66
  }
67
67
 
68
68
  value.length = i;
69
- onValueChange == null ? void 0 : onValueChange(value, index);
69
+ newData.length = i;
70
+ onValueChange == null ? void 0 : onValueChange(value, index, newData);
70
71
  }
71
72
 
72
73
  function _formatData() {
73
74
  var childrenTree = (0, _mobileUtils.arrayTreeFilter)(data, function (item, level) {
74
- return item.value === selectedValue[level];
75
+ return item.value === (selectedValue == null ? void 0 : selectedValue[level]);
76
+ }, {
77
+ fallbackChildIndex: 0
75
78
  }).map(function (item) {
76
79
  return item.children;
77
80
  });
@@ -96,8 +99,7 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
96
99
  data: formatData,
97
100
  selectedValue: selectedValue,
98
101
  itemHeight: itemHeight,
99
- onValueChange: _onValueChange,
100
- onPickerChange: onPickerChange
102
+ onValueChange: _onValueChange
101
103
  }, formatData.map(function (item, index) {
102
104
  return /*#__PURE__*/_react.default.createElement(_pickerCell.default, {
103
105
  key: index + "_picker_cell_cascader",
@@ -3,10 +3,9 @@ import { PickerData, ValueType } from '../type';
3
3
  export interface MultiPickerProps {
4
4
  prefixCls: string;
5
5
  data: PickerData[][];
6
- selectedValue: ValueType[];
6
+ selectedValue?: ValueType[];
7
7
  children: any;
8
8
  itemHeight: number;
9
- onValueChange: (value: ValueType[], index: number) => void;
10
- onPickerChange?: (value: ValueType[], index: number) => void;
9
+ onValueChange: (value: ValueType[], index: number, data: PickerData[]) => void;
11
10
  }
12
11
  export default function MultiPicker(props: MultiPickerProps): JSX.Element;
@@ -10,60 +10,56 @@ var _react = _interopRequireDefault(require("react"));
10
10
  function MultiPicker(props) {
11
11
  var prefixCls = props.prefixCls,
12
12
  onValueChange = props.onValueChange,
13
- onPickerChange = props.onPickerChange,
14
13
  children = props.children,
15
14
  itemHeight = props.itemHeight,
16
15
  selectedValue = props.selectedValue,
17
16
  data = props.data;
18
17
 
19
- function getValue() {
20
- if (selectedValue && selectedValue.length) {
21
- return selectedValue;
22
- }
23
-
24
- if (data) {
25
- return data.map(function (item) {
26
- return item && item[0] && item[0].value;
27
- });
28
- }
29
-
30
- if (!children) {
31
- return [];
32
- }
33
-
34
- return _react.default.Children.map(children, function (child) {
35
- var childrenArray = _react.default.Children.toArray(child.children || child.props.children);
36
-
37
- return childrenArray && childrenArray[0] && childrenArray[0].props.value;
18
+ function getCurrentData() {
19
+ return (data || []).map(function (item, itemIndex) {
20
+ var curSelected = selectedValue == null ? void 0 : selectedValue[itemIndex];
21
+ var cur = curSelected ? (item || []).find(function (i) {
22
+ return i.value === curSelected;
23
+ }) : undefined;
24
+ return cur || (item == null ? void 0 : item[0]);
38
25
  });
39
26
  }
40
27
 
41
- function onChange(index, value, callback) {
42
- var newValue = getValue().concat();
28
+ function onChange(_ref) {
29
+ var index = _ref.index,
30
+ value = _ref.value,
31
+ changedData = _ref.changedData,
32
+ callback = _ref.callback;
33
+ var newData = getCurrentData().concat();
34
+ newData[index] = changedData;
35
+ var newValue = newData.map(function (d) {
36
+ return d == null ? void 0 : d.value;
37
+ });
43
38
  newValue[index] = value;
44
39
 
45
40
  if (callback) {
46
- callback(newValue, index);
41
+ callback(newValue, index, newData);
47
42
  }
48
43
  }
49
44
 
50
- function _onValueChange(value, index) {
51
- onChange(index, value, onValueChange);
52
- }
53
-
54
- function _onScrollChange(value, index) {
55
- onChange(index, value, onPickerChange);
45
+ function _onValueChange(value, index, changedData) {
46
+ onChange({
47
+ index: index,
48
+ value: value,
49
+ callback: onValueChange,
50
+ changedData: changedData
51
+ });
56
52
  }
57
53
 
58
54
  function renderChild() {
59
- var value = getValue();
55
+ var curData = getCurrentData();
56
+ var value = curData.map(function (d) {
57
+ return d == null ? void 0 : d.value;
58
+ });
60
59
  return _react.default.Children.map(children, function (col, index) {
61
60
  return /*#__PURE__*/_react.default.cloneElement(col, {
62
- onScrollChange: function onScrollChange(val) {
63
- return _onScrollChange(val, index);
64
- },
65
- onValueChange: function onValueChange(val) {
66
- return _onValueChange(val, index);
61
+ onValueChange: function onValueChange(val, changedData) {
62
+ return _onValueChange(val, index, changedData);
67
63
  },
68
64
  selectedValue: value[index]
69
65
  });
@@ -8,7 +8,7 @@ export interface PickerCellProps {
8
8
  itemHeight: number;
9
9
  wrapperHeight: number;
10
10
  selectedValue?: ValueType;
11
- onValueChange?: (value: ValueType) => void;
11
+ onValueChange?: (value: ValueType, data: PickerData) => void;
12
12
  disabled: boolean;
13
13
  hideEmptyCols?: boolean;
14
14
  /**
@@ -85,17 +85,15 @@ var PickerCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
85
85
  // index有改变时再抛出
86
86
  // @en Throws again when index changes
87
87
  if (currentIndex !== nowItemIndex) {
88
- setCurrentIndex(nowItemIndex);
89
- var newValue = data[nowItemIndex] && data[nowItemIndex].value;
88
+ setCurrentIndex(Math.max(nowItemIndex, 0));
89
+ var newData = data[nowItemIndex];
90
+ var newValue = newData == null ? void 0 : newData.value;
90
91
 
91
92
  if (newValue !== currentValue) {
92
- // if (!('selectedValue' in props)) {
93
- // setCurrentValue(newValue);
94
- // }
95
93
  setCurrentValue(newValue);
96
94
 
97
95
  if (onValueChange) {
98
- onValueChange(newValue);
96
+ onValueChange(newValue, newData);
99
97
  }
100
98
  }
101
99
  }
@@ -340,7 +338,7 @@ var PickerCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
340
338
  var curIndex = data.findIndex(function (item) {
341
339
  return item.value === selectedValue;
342
340
  });
343
- setCurrentIndex(curIndex);
341
+ setCurrentIndex(Math.max(curIndex, 0));
344
342
 
345
343
  if (curIndex >= 0) {
346
344
  _scrollToIndexWithChange(curIndex);
@@ -25,7 +25,7 @@ export interface PickerViewRef {
25
25
  * 获取第 n 列的值
26
26
  * @en Get the value of the nth column
27
27
  */
28
- getColumnValue: (index: number) => ValueType;
28
+ getColumnValue: (index: number) => ValueType | undefined;
29
29
  /**
30
30
  * 手动更新元素布局
31
31
  * @en Manually update the element layout