antd-mobile 5.28.2 → 5.29.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 (222) hide show
  1. package/2x/bundle/antd-mobile.cjs.development.js +405 -195
  2. package/2x/bundle/antd-mobile.cjs.js +9 -9
  3. package/2x/bundle/antd-mobile.es.development.js +405 -195
  4. package/2x/bundle/antd-mobile.es.js +4901 -4675
  5. package/2x/bundle/antd-mobile.umd.development.js +405 -195
  6. package/2x/bundle/antd-mobile.umd.js +9 -9
  7. package/2x/bundle/style.css +36 -33
  8. package/2x/cjs/components/action-sheet/action-sheet.css +1 -1
  9. package/2x/cjs/components/action-sheet/action-sheet.js +6 -2
  10. package/2x/cjs/components/avatar/avatar.d.ts +1 -1
  11. package/2x/cjs/components/avatar/avatar.js +2 -1
  12. package/2x/cjs/components/badge/badge.css +2 -2
  13. package/2x/cjs/components/button/button.css +2 -2
  14. package/2x/cjs/components/capsule-tabs/capsule-tabs.css +2 -2
  15. package/2x/cjs/components/check-list/check-list-item.js +3 -1
  16. package/2x/cjs/components/check-list/check-list.d.ts +1 -0
  17. package/2x/cjs/components/check-list/check-list.js +2 -0
  18. package/2x/cjs/components/check-list/context.d.ts +1 -0
  19. package/2x/cjs/components/checkbox/checkbox.css +2 -2
  20. package/2x/cjs/components/ellipsis/ellipsis.js +1 -1
  21. package/2x/cjs/components/image/image.css +1 -1
  22. package/2x/cjs/components/index-bar/index-bar.css +4 -4
  23. package/2x/cjs/components/input/input.d.ts +1 -1
  24. package/2x/cjs/components/jumbo-tabs/jumbo-tabs.css +2 -2
  25. package/2x/cjs/components/notice-bar/notice-bar.css +1 -1
  26. package/2x/cjs/components/number-keyboard/number-keyboard.js +10 -6
  27. package/2x/cjs/components/popover/index.d.ts +1 -1
  28. package/2x/cjs/components/popover/popover.css +1 -1
  29. package/2x/cjs/components/popover/popover.d.ts +2 -2
  30. package/2x/cjs/components/popover/popover.js +1 -1
  31. package/2x/cjs/components/radio/radio.css +2 -2
  32. package/2x/cjs/components/search-bar/search-bar.css +1 -1
  33. package/2x/cjs/components/selector/selector.css +1 -1
  34. package/2x/cjs/components/selector/selector.js +10 -2
  35. package/2x/cjs/components/side-bar/side-bar.css +1 -1
  36. package/2x/cjs/components/slider/slider.css +3 -3
  37. package/2x/cjs/components/stepper/stepper.css +2 -2
  38. package/2x/cjs/components/swipe-action/swipe-action.css +1 -1
  39. package/2x/cjs/components/switch/switch.css +2 -2
  40. package/2x/cjs/components/tabs/tabs.js +5 -2
  41. package/2x/cjs/components/text-area/text-area.d.ts +1 -1
  42. package/2x/cjs/components/virtual-input/virtual-input.js +12 -2
  43. package/2x/cjs/global/global.css +5 -2
  44. package/2x/cjs/global/theme-default.css +5 -2
  45. package/2x/cjs/locales/base.d.ts +3 -0
  46. package/2x/cjs/locales/base.js +3 -0
  47. package/2x/cjs/locales/en-US.d.ts +3 -0
  48. package/2x/cjs/locales/es-ES.d.ts +3 -0
  49. package/2x/cjs/locales/fa-IR.d.ts +3 -0
  50. package/2x/cjs/locales/fr-FR.d.ts +3 -0
  51. package/2x/cjs/locales/id-ID.d.ts +3 -0
  52. package/2x/cjs/locales/ja-JP.d.ts +3 -0
  53. package/2x/cjs/locales/kk-KZ.d.ts +3 -0
  54. package/2x/cjs/locales/ko-KR.d.ts +3 -0
  55. package/2x/cjs/locales/zh-CN.d.ts +3 -0
  56. package/2x/cjs/locales/zh-CN.js +3 -0
  57. package/2x/cjs/locales/zh-HK.d.ts +3 -0
  58. package/2x/cjs/locales/zh-TW.d.ts +3 -0
  59. package/2x/es/components/action-sheet/action-sheet.css +1 -1
  60. package/2x/es/components/action-sheet/action-sheet.js +6 -2
  61. package/2x/es/components/avatar/avatar.d.ts +1 -1
  62. package/2x/es/components/avatar/avatar.js +2 -1
  63. package/2x/es/components/badge/badge.css +2 -2
  64. package/2x/es/components/button/button.css +2 -2
  65. package/2x/es/components/capsule-tabs/capsule-tabs.css +2 -2
  66. package/2x/es/components/check-list/check-list-item.js +3 -1
  67. package/2x/es/components/check-list/check-list.d.ts +1 -0
  68. package/2x/es/components/check-list/check-list.js +2 -0
  69. package/2x/es/components/check-list/context.d.ts +1 -0
  70. package/2x/es/components/checkbox/checkbox.css +2 -2
  71. package/2x/es/components/ellipsis/ellipsis.js +1 -1
  72. package/2x/es/components/image/image.css +1 -1
  73. package/2x/es/components/index-bar/index-bar.css +4 -4
  74. package/2x/es/components/input/input.d.ts +1 -1
  75. package/2x/es/components/jumbo-tabs/jumbo-tabs.css +2 -2
  76. package/2x/es/components/notice-bar/notice-bar.css +1 -1
  77. package/2x/es/components/number-keyboard/number-keyboard.js +10 -6
  78. package/2x/es/components/popover/index.d.ts +1 -1
  79. package/2x/es/components/popover/popover.css +1 -1
  80. package/2x/es/components/popover/popover.d.ts +2 -2
  81. package/2x/es/components/popover/popover.js +1 -1
  82. package/2x/es/components/radio/radio.css +2 -2
  83. package/2x/es/components/search-bar/search-bar.css +1 -1
  84. package/2x/es/components/selector/selector.css +1 -1
  85. package/2x/es/components/selector/selector.js +10 -2
  86. package/2x/es/components/side-bar/side-bar.css +1 -1
  87. package/2x/es/components/slider/slider.css +3 -3
  88. package/2x/es/components/stepper/stepper.css +2 -2
  89. package/2x/es/components/swipe-action/swipe-action.css +1 -1
  90. package/2x/es/components/switch/switch.css +2 -2
  91. package/2x/es/components/tabs/tabs.js +5 -2
  92. package/2x/es/components/text-area/text-area.d.ts +1 -1
  93. package/2x/es/components/virtual-input/virtual-input.js +12 -2
  94. package/2x/es/global/global.css +5 -2
  95. package/2x/es/global/theme-default.css +5 -2
  96. package/2x/es/locales/base.d.ts +3 -0
  97. package/2x/es/locales/base.js +3 -0
  98. package/2x/es/locales/en-US.d.ts +3 -0
  99. package/2x/es/locales/es-ES.d.ts +3 -0
  100. package/2x/es/locales/fa-IR.d.ts +3 -0
  101. package/2x/es/locales/fr-FR.d.ts +3 -0
  102. package/2x/es/locales/id-ID.d.ts +3 -0
  103. package/2x/es/locales/ja-JP.d.ts +3 -0
  104. package/2x/es/locales/kk-KZ.d.ts +3 -0
  105. package/2x/es/locales/ko-KR.d.ts +3 -0
  106. package/2x/es/locales/zh-CN.d.ts +3 -0
  107. package/2x/es/locales/zh-CN.js +3 -0
  108. package/2x/es/locales/zh-HK.d.ts +3 -0
  109. package/2x/es/locales/zh-TW.d.ts +3 -0
  110. package/2x/package.json +1 -1
  111. package/bundle/antd-mobile.cjs.development.js +405 -195
  112. package/bundle/antd-mobile.cjs.js +9 -9
  113. package/bundle/antd-mobile.compatible.umd.js +1 -1
  114. package/bundle/antd-mobile.es.development.js +405 -195
  115. package/bundle/antd-mobile.es.js +4901 -4675
  116. package/bundle/antd-mobile.umd.development.js +405 -195
  117. package/bundle/antd-mobile.umd.js +9 -9
  118. package/bundle/style.css +1 -1
  119. package/cjs/components/action-sheet/action-sheet.css +1 -1
  120. package/cjs/components/action-sheet/action-sheet.js +6 -2
  121. package/cjs/components/avatar/avatar.d.ts +1 -1
  122. package/cjs/components/avatar/avatar.js +2 -1
  123. package/cjs/components/badge/badge.css +2 -2
  124. package/cjs/components/button/button.css +2 -2
  125. package/cjs/components/capsule-tabs/capsule-tabs.css +2 -2
  126. package/cjs/components/check-list/check-list-item.js +3 -1
  127. package/cjs/components/check-list/check-list.d.ts +1 -0
  128. package/cjs/components/check-list/check-list.js +2 -0
  129. package/cjs/components/check-list/context.d.ts +1 -0
  130. package/cjs/components/checkbox/checkbox.css +2 -2
  131. package/cjs/components/ellipsis/ellipsis.js +1 -1
  132. package/cjs/components/image/image.css +1 -1
  133. package/cjs/components/index-bar/index-bar.css +4 -4
  134. package/cjs/components/input/input.d.ts +1 -1
  135. package/cjs/components/jumbo-tabs/jumbo-tabs.css +2 -2
  136. package/cjs/components/notice-bar/notice-bar.css +1 -1
  137. package/cjs/components/number-keyboard/number-keyboard.js +10 -6
  138. package/cjs/components/popover/index.d.ts +1 -1
  139. package/cjs/components/popover/popover.css +1 -1
  140. package/cjs/components/popover/popover.d.ts +2 -2
  141. package/cjs/components/popover/popover.js +1 -1
  142. package/cjs/components/radio/radio.css +2 -2
  143. package/cjs/components/search-bar/search-bar.css +1 -1
  144. package/cjs/components/selector/selector.css +1 -1
  145. package/cjs/components/selector/selector.js +10 -2
  146. package/cjs/components/side-bar/side-bar.css +1 -1
  147. package/cjs/components/slider/slider.css +3 -3
  148. package/cjs/components/stepper/stepper.css +2 -2
  149. package/cjs/components/swipe-action/swipe-action.css +1 -1
  150. package/cjs/components/switch/switch.css +2 -2
  151. package/cjs/components/tabs/tabs.js +5 -2
  152. package/cjs/components/text-area/text-area.d.ts +1 -1
  153. package/cjs/components/virtual-input/virtual-input.js +12 -2
  154. package/cjs/global/global.css +5 -2
  155. package/cjs/global/theme-default.css +5 -2
  156. package/cjs/locales/base.d.ts +3 -0
  157. package/cjs/locales/base.js +3 -0
  158. package/cjs/locales/en-US.d.ts +3 -0
  159. package/cjs/locales/es-ES.d.ts +3 -0
  160. package/cjs/locales/fa-IR.d.ts +3 -0
  161. package/cjs/locales/fr-FR.d.ts +3 -0
  162. package/cjs/locales/id-ID.d.ts +3 -0
  163. package/cjs/locales/ja-JP.d.ts +3 -0
  164. package/cjs/locales/kk-KZ.d.ts +3 -0
  165. package/cjs/locales/ko-KR.d.ts +3 -0
  166. package/cjs/locales/zh-CN.d.ts +3 -0
  167. package/cjs/locales/zh-CN.js +3 -0
  168. package/cjs/locales/zh-HK.d.ts +3 -0
  169. package/cjs/locales/zh-TW.d.ts +3 -0
  170. package/es/components/action-sheet/action-sheet.css +1 -1
  171. package/es/components/action-sheet/action-sheet.js +6 -2
  172. package/es/components/avatar/avatar.d.ts +1 -1
  173. package/es/components/avatar/avatar.js +2 -1
  174. package/es/components/badge/badge.css +2 -2
  175. package/es/components/button/button.css +2 -2
  176. package/es/components/capsule-tabs/capsule-tabs.css +2 -2
  177. package/es/components/check-list/check-list-item.js +3 -1
  178. package/es/components/check-list/check-list.d.ts +1 -0
  179. package/es/components/check-list/check-list.js +2 -0
  180. package/es/components/check-list/context.d.ts +1 -0
  181. package/es/components/checkbox/checkbox.css +2 -2
  182. package/es/components/ellipsis/ellipsis.js +1 -1
  183. package/es/components/image/image.css +1 -1
  184. package/es/components/index-bar/index-bar.css +4 -4
  185. package/es/components/input/input.d.ts +1 -1
  186. package/es/components/jumbo-tabs/jumbo-tabs.css +2 -2
  187. package/es/components/notice-bar/notice-bar.css +1 -1
  188. package/es/components/number-keyboard/number-keyboard.js +10 -6
  189. package/es/components/popover/index.d.ts +1 -1
  190. package/es/components/popover/popover.css +1 -1
  191. package/es/components/popover/popover.d.ts +2 -2
  192. package/es/components/popover/popover.js +1 -1
  193. package/es/components/radio/radio.css +2 -2
  194. package/es/components/search-bar/search-bar.css +1 -1
  195. package/es/components/selector/selector.css +1 -1
  196. package/es/components/selector/selector.js +10 -2
  197. package/es/components/side-bar/side-bar.css +1 -1
  198. package/es/components/slider/slider.css +3 -3
  199. package/es/components/stepper/stepper.css +2 -2
  200. package/es/components/swipe-action/swipe-action.css +1 -1
  201. package/es/components/switch/switch.css +2 -2
  202. package/es/components/tabs/tabs.js +5 -2
  203. package/es/components/text-area/text-area.d.ts +1 -1
  204. package/es/components/virtual-input/virtual-input.js +12 -2
  205. package/es/global/global.css +5 -2
  206. package/es/global/theme-default.css +5 -2
  207. package/es/locales/base.d.ts +3 -0
  208. package/es/locales/base.js +3 -0
  209. package/es/locales/en-US.d.ts +3 -0
  210. package/es/locales/es-ES.d.ts +3 -0
  211. package/es/locales/fa-IR.d.ts +3 -0
  212. package/es/locales/fr-FR.d.ts +3 -0
  213. package/es/locales/id-ID.d.ts +3 -0
  214. package/es/locales/ja-JP.d.ts +3 -0
  215. package/es/locales/kk-KZ.d.ts +3 -0
  216. package/es/locales/ko-KR.d.ts +3 -0
  217. package/es/locales/zh-CN.d.ts +3 -0
  218. package/es/locales/zh-CN.js +3 -0
  219. package/es/locales/zh-HK.d.ts +3 -0
  220. package/es/locales/zh-TW.d.ts +3 -0
  221. package/package.json +1 -1
  222. package/umd/antd-mobile.js +1 -1
@@ -1,5 +1,5 @@
1
1
  .adm-button {
2
- --color: var(--adm-color-white);
2
+ --color: var(--adm-color-text-light-solid);
3
3
  --text-color: var(--adm-button-text-color, var(--adm-color-text));
4
4
  --background-color: var(--adm-button-background-color, var(--adm-color-background));
5
5
  --border-radius: var(--adm-button-border-radius, 4px);
@@ -53,7 +53,7 @@
53
53
  --border-width: 0px;
54
54
  }
55
55
  .adm-button:not(.adm-button-default) {
56
- --text-color: var(--adm-color-white);
56
+ --text-color: var(--adm-color-text-light-solid);
57
57
  --background-color: var(--color);
58
58
  --border-color: var(--color);
59
59
  }
@@ -32,10 +32,10 @@
32
32
  font-size: var(--adm-font-size-7);
33
33
  text-align: center;
34
34
  white-space: nowrap;
35
- background-color: var(--adm-color-box);
35
+ background-color: var(--adm-color-fill-content);
36
36
  }
37
37
  .adm-capsule-tabs-tab-active {
38
- color: var(--adm-color-white);
38
+ color: var(--adm-color-text-light-solid);
39
39
  background-color: var(--adm-color-primary);
40
40
  }
41
41
  .adm-capsule-tabs-tab-disabled {
@@ -13,9 +13,11 @@ export const CheckListItem = props => {
13
13
  }
14
14
  const active = context.value.includes(props.value);
15
15
  const readOnly = props.readOnly || context.readOnly;
16
+ const defaultExtra = active ? context.activeIcon : null;
17
+ const renderExtra = context.extra ? context.extra(active) : defaultExtra;
16
18
  const extra = React.createElement("div", {
17
19
  className: `${classPrefix}-extra`
18
- }, active ? context.activeIcon : null);
20
+ }, renderExtra);
19
21
  return withNativeProps(props, React.createElement(List.Item, {
20
22
  title: props.title,
21
23
  className: classNames(classPrefix, readOnly && `${classPrefix}-readonly`, active && `${classPrefix}-active`),
@@ -7,6 +7,7 @@ export declare type CheckListProps = Pick<ListProps, 'mode' | 'style'> & {
7
7
  onChange?: (val: string[]) => void;
8
8
  multiple?: boolean;
9
9
  activeIcon?: ReactNode;
10
+ extra?: (active: boolean) => ReactNode;
10
11
  disabled?: boolean;
11
12
  readOnly?: boolean;
12
13
  children?: React.ReactNode;
@@ -26,6 +26,7 @@ export const CheckList = p => {
26
26
  }
27
27
  const {
28
28
  activeIcon,
29
+ extra,
29
30
  disabled,
30
31
  readOnly
31
32
  } = props;
@@ -35,6 +36,7 @@ export const CheckList = p => {
35
36
  check,
36
37
  uncheck,
37
38
  activeIcon,
39
+ extra,
38
40
  disabled,
39
41
  readOnly
40
42
  }
@@ -4,6 +4,7 @@ export declare const CheckListContext: import("react").Context<{
4
4
  check: (val: string) => void;
5
5
  uncheck: (val: string) => void;
6
6
  activeIcon?: ReactNode;
7
+ extra?: ((active: boolean) => ReactNode) | undefined;
7
8
  disabled?: boolean | undefined;
8
9
  readOnly?: boolean | undefined;
9
10
  } | null>;
@@ -18,7 +18,7 @@
18
18
  box-sizing: border-box;
19
19
  width: var(--icon-size);
20
20
  height: var(--icon-size);
21
- color: var(--adm-color-white);
21
+ color: var(--adm-color-text-light-solid);
22
22
  }
23
23
  .adm-checkbox .adm-checkbox-icon > svg {
24
24
  display: block;
@@ -41,7 +41,7 @@
41
41
  .adm-checkbox.adm-checkbox-disabled .adm-checkbox-icon.adm-checkbox-icon {
42
42
  color: #b7b7b7;
43
43
  border-color: var(--adm-color-light);
44
- background-color: var(--adm-color-box);
44
+ background-color: var(--adm-color-fill-content);
45
45
  }
46
46
  .adm-checkbox .adm-checkbox-custom-icon {
47
47
  font-size: var(--icon-size);
@@ -120,7 +120,7 @@ export const Ellipsis = p => {
120
120
  setExpanded(true);
121
121
  }
122
122
  }, props.expandText)) : null;
123
- const collapseActionElement = exceeded && props.expandText ? withStopPropagation(props.stopPropagationForActionButtons, React.createElement("a", {
123
+ const collapseActionElement = exceeded && props.collapseText ? withStopPropagation(props.stopPropagationForActionButtons, React.createElement("a", {
124
124
  onClick: () => {
125
125
  setExpanded(false);
126
126
  }
@@ -12,7 +12,7 @@
12
12
  }
13
13
  .adm-image-tip {
14
14
  position: relative;
15
- background-color: var(--adm-color-box);
15
+ background-color: var(--adm-color-fill-content);
16
16
  height: 100%;
17
17
  min-height: 24px;
18
18
  min-width: 24px;
@@ -3,7 +3,7 @@
3
3
  overflow: hidden;
4
4
  height: 100%;
5
5
  position: relative;
6
- background-color: var(--adm-color-white);
6
+ background-color: var(--adm-color-background);
7
7
  --sticky-offset-top: 0;
8
8
  }
9
9
  .adm-index-bar-body {
@@ -22,7 +22,7 @@
22
22
  padding: 0 12px;
23
23
  color: var(--adm-color-weak);
24
24
  font-size: var(--adm-font-size-main);
25
- background-color: var(--adm-color-box);
25
+ background-color: var(--adm-color-fill-content);
26
26
  }
27
27
  .adm-index-bar-sidebar {
28
28
  position: absolute;
@@ -43,7 +43,7 @@
43
43
  right: 60px;
44
44
  width: 47px;
45
45
  height: 47px;
46
- color: var(--adm-color-white);
46
+ color: var(--adm-color-text-light-solid);
47
47
  font-size: 25px;
48
48
  line-height: 47px;
49
49
  text-align: center;
@@ -70,7 +70,7 @@
70
70
  align-items: center;
71
71
  }
72
72
  .adm-index-bar-sidebar-item-active {
73
- color: var(--adm-color-white);
73
+ color: var(--adm-color-text-light-solid);
74
74
  background-color: var(--adm-color-primary);
75
75
  border-radius: 50%;
76
76
  }
@@ -26,7 +26,7 @@ export declare type InputRef = {
26
26
  blur: () => void;
27
27
  nativeElement: HTMLInputElement | null;
28
28
  };
29
- export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "onClick" | "name" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "autoFocus" | "maxLength" | "minLength" | "step"> & {
29
+ export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "onClick" | "name" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoFocus" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "maxLength" | "minLength" | "step"> & {
30
30
  value?: string | undefined;
31
31
  defaultValue?: string | undefined;
32
32
  onChange?: ((val: string) => void) | undefined;
@@ -49,13 +49,13 @@
49
49
  border-radius: 10px;
50
50
  color: var(--adm-color-weak);
51
51
  font-size: var(--adm-font-size-main);
52
- background-color: var(--adm-color-box);
52
+ background-color: var(--adm-color-fill-content);
53
53
  }
54
54
  .adm-jumbo-tabs-tab-active {
55
55
  color: var(--adm-color-primary);
56
56
  }
57
57
  .adm-jumbo-tabs-tab-active .adm-jumbo-tabs-tab-description {
58
- color: var(--adm-color-white);
58
+ color: var(--adm-color-text-light-solid);
59
59
  background-color: var(--adm-color-primary);
60
60
  }
61
61
  .adm-jumbo-tabs-tab-disabled {
@@ -1,7 +1,7 @@
1
1
  .adm-notice-bar {
2
2
  --background-color: #ababab;
3
3
  --border-color: #999999;
4
- --text-color: var(--adm-color-white);
4
+ --text-color: var(--adm-color-text-light-solid);
5
5
  --font-size: var(--adm-font-size-7);
6
6
  --icon-font-size: var(--adm-font-size-10);
7
7
  --height: 40px;
@@ -88,8 +88,9 @@ export const NumberKeyboard = p => {
88
88
  className: classNames(`${classPrefix}-header`, {
89
89
  [`${classPrefix}-header-with-title`]: !!title
90
90
  })
91
- }, title && React.createElement("div", {
92
- className: `${classPrefix}-title`
91
+ }, 'title' && React.createElement("div", {
92
+ className: `${classPrefix}-title`,
93
+ "aria-label": title
93
94
  }, title), showCloseButton && React.createElement("span", {
94
95
  className: `${classPrefix}-header-close-button`,
95
96
  onClick: () => {
@@ -97,7 +98,8 @@ export const NumberKeyboard = p => {
97
98
  (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
98
99
  },
99
100
  role: 'button',
100
- title: 'CLOSE'
101
+ title: 'CLOSE',
102
+ tabIndex: -1
101
103
  }, React.createElement(DownOutline, null)));
102
104
  };
103
105
  const renderKey = (key, index) => {
@@ -108,8 +110,9 @@ export const NumberKeyboard = p => {
108
110
  [`${classPrefix}-key-mid`]: index === 9 && !!confirmText && keys.length < 12
109
111
  });
110
112
  const ariaProps = key ? {
111
- role: 'button',
112
- title: key
113
+ role: 'grid',
114
+ title: key,
115
+ tabIndex: -1
113
116
  } : undefined;
114
117
  return React.createElement("div", Object.assign({
115
118
  key: key,
@@ -165,7 +168,8 @@ export const NumberKeyboard = p => {
165
168
  }, React.createElement(TextDeletionOutline, null)), React.createElement("div", {
166
169
  className: `${classPrefix}-key ${classPrefix}-key-extra ${classPrefix}-key-ok`,
167
170
  onTouchEnd: e => onKeyPress(e, 'OK'),
168
- role: 'button'
171
+ role: 'button',
172
+ "aria-label": confirmText
169
173
  }, confirmText))), props.safeArea && React.createElement("div", {
170
174
  className: `${classPrefix}-footer`
171
175
  }, React.createElement(SafeArea, {
@@ -18,7 +18,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
18
18
  content: import("react").ReactNode;
19
19
  } & {
20
20
  className?: string | undefined;
21
- style?: (import("react").CSSProperties & Partial<Record<"--z-index", string>>) | undefined;
21
+ style?: (import("react").CSSProperties & Partial<Record<"--z-index" | "--arrow-size", string>>) | undefined;
22
22
  tabIndex?: number | undefined;
23
23
  } & import("react").AriaAttributes & import("react").RefAttributes<import("./popover").PopoverRef>> & {
24
24
  Menu: import("react").ForwardRefExoticComponent<Omit<import("./popover").PopoverProps, "content"> & {
@@ -57,7 +57,7 @@
57
57
  .adm-popover-arrow-icon {
58
58
  display: block;
59
59
  height: var(--arrow-size);
60
- width: 15px;
60
+ width: calc(var(--arrow-size) / 8 * 15);
61
61
  position: absolute;
62
62
  top: 50%;
63
63
  left: 50%;
@@ -15,7 +15,7 @@ export declare type PopoverProps = {
15
15
  placement?: Placement | DeprecatedPlacement;
16
16
  stopPropagation?: PropagationEvent[];
17
17
  content: React.ReactNode;
18
- } & NativeProps<'--z-index'>;
18
+ } & NativeProps<'--z-index' | '--arrow-size'>;
19
19
  export declare type PopoverRef = {
20
20
  show: () => void;
21
21
  hide: () => void;
@@ -35,6 +35,6 @@ export declare const Popover: React.ForwardRefExoticComponent<{
35
35
  content: React.ReactNode;
36
36
  } & {
37
37
  className?: string | undefined;
38
- style?: (React.CSSProperties & Partial<Record<"--z-index", string>>) | undefined;
38
+ style?: (React.CSSProperties & Partial<Record<"--z-index" | "--arrow-size", string>>) | undefined;
39
39
  tabIndex?: number | undefined;
40
40
  } & React.AriaAttributes & React.RefAttributes<PopoverRef>>;
@@ -99,7 +99,7 @@ export const Popover = forwardRef((p, ref) => {
99
99
  top: arrowY != null ? `${arrowY}px` : '',
100
100
  right: '',
101
101
  bottom: '',
102
- [arrowSide]: `-${convertPx(8)}px`
102
+ [arrowSide]: 'calc(var(--arrow-size) * -1)'
103
103
  });
104
104
  const arrowRotate = {
105
105
  top: '0deg',
@@ -18,7 +18,7 @@
18
18
  box-sizing: border-box;
19
19
  width: var(--icon-size);
20
20
  height: var(--icon-size);
21
- color: var(--adm-color-white);
21
+ color: var(--adm-color-text-light-solid);
22
22
  }
23
23
  .adm-radio .adm-radio-icon > svg {
24
24
  display: block;
@@ -41,7 +41,7 @@
41
41
  .adm-radio.adm-radio-disabled .adm-radio-icon {
42
42
  color: #b7b7b7;
43
43
  border-color: var(--adm-color-light);
44
- background-color: var(--adm-color-box);
44
+ background-color: var(--adm-color-fill-content);
45
45
  }
46
46
  .adm-radio .adm-radio-custom-icon {
47
47
  font-size: var(--icon-size);
@@ -1,7 +1,7 @@
1
1
  .adm-search-bar {
2
2
  --height: 32px;
3
3
  --padding-left: 8px;
4
- --background: var(--adm-color-box);
4
+ --background: var(--adm-color-fill-content);
5
5
  --border-radius: 6px;
6
6
  --placeholder-color: var(--adm-color-weak);
7
7
  ---placeholder-color: var(--placeholder-color);
@@ -1,5 +1,5 @@
1
1
  .adm-selector {
2
- --color: var(--adm-color-box);
2
+ --color: var(--adm-color-fill-content);
3
3
  --checked-color: #e7f1ff;
4
4
  --text-color: var(--adm-color-text);
5
5
  --checked-text-color: var(--adm-color-primary);
@@ -6,6 +6,7 @@ import Space from '../space';
6
6
  import Grid from '../grid';
7
7
  import { usePropsValue } from '../../utils/use-props-value';
8
8
  import { CheckMark } from './check-mark';
9
+ import { useConfig } from '../config-provider';
9
10
  const classPrefix = `adm-selector`;
10
11
  const defaultProps = {
11
12
  multiple: false,
@@ -27,6 +28,9 @@ export const Selector = p => {
27
28
  (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, val, extend);
28
29
  }
29
30
  });
31
+ const {
32
+ locale
33
+ } = useConfig();
30
34
  const items = props.options.map(option => {
31
35
  const active = (value || []).includes(option.value);
32
36
  const disabled = option.disabled || props.disabled;
@@ -49,7 +53,9 @@ export const Selector = p => {
49
53
  const val = active ? [] : [option.value];
50
54
  setValue(val);
51
55
  }
52
- }
56
+ },
57
+ role: 'option',
58
+ "aria-selected": active && !props.multiple || active && props.multiple
53
59
  }, option.label, option.description && React.createElement("div", {
54
60
  className: `${classPrefix}-item-description`
55
61
  }, option.description), active && props.showCheckMark && React.createElement("div", {
@@ -57,7 +63,9 @@ export const Selector = p => {
57
63
  }, React.createElement(CheckMark, null)));
58
64
  });
59
65
  return withNativeProps(props, React.createElement("div", {
60
- className: classPrefix
66
+ className: classPrefix,
67
+ role: 'listbox',
68
+ "aria-label": locale.Selector.name
61
69
  }, !props.columns && React.createElement(Space, {
62
70
  wrap: true
63
71
  }, items), props.columns && React.createElement(Grid, {
@@ -2,7 +2,7 @@
2
2
  --height: 100%;
3
3
  --width: 105px;
4
4
  --item-border-radius: 8px;
5
- --background-color: var(--adm-color-box);
5
+ --background-color: var(--adm-color-fill-content);
6
6
  width: var(--width);
7
7
  height: var(--height);
8
8
  box-sizing: border-box;
@@ -12,7 +12,7 @@
12
12
  position: relative;
13
13
  width: 100%;
14
14
  height: 3px;
15
- background-color: var(--adm-color-box);
15
+ background-color: var(--adm-color-fill-content);
16
16
  border-radius: 3px;
17
17
  }
18
18
  .adm-slider-fill {
@@ -34,7 +34,7 @@
34
34
  width: 7px;
35
35
  height: 7px;
36
36
  margin-left: -3px;
37
- background-color: var(--adm-color-box);
37
+ background-color: var(--adm-color-fill-content);
38
38
  border-radius: 50%;
39
39
  }
40
40
  .adm-slider-tick-active {
@@ -47,7 +47,7 @@
47
47
  border-radius: 50%;
48
48
  text-align: center;
49
49
  line-height: 28px;
50
- background: var(--adm-color-white);
50
+ background: var(--adm-color-text-light-solid);
51
51
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.12);
52
52
  color: var(--fill-color);
53
53
  }
@@ -3,14 +3,14 @@
3
3
  --input-width: 44px;
4
4
  --input-font-size: var(--adm-font-size-main);
5
5
  --input-font-color: var(--adm-color-text);
6
- --input-background-color: var(--adm-color-box);
6
+ --input-background-color: var(--adm-color-fill-content);
7
7
  --border-radius: 2px;
8
8
  --border: none;
9
9
  --border-inner: solid 2px transparent;
10
10
  --active-border: var(--border);
11
11
  --button-font-size: var(--adm-font-size-7);
12
12
  --button-text-color: var(--adm-color-primary);
13
- --button-background-color: var(--adm-color-box);
13
+ --button-background-color: var(--adm-color-fill-content);
14
14
  --button-width: var(--height);
15
15
  display: flex;
16
16
  align-items: center;
@@ -31,7 +31,7 @@
31
31
  .adm-swipe-action-action-button.adm-button {
32
32
  --border-radius: 0;
33
33
  --border-width: 0;
34
- --text-color: var(--adm-color-white);
34
+ --text-color: var(--adm-color-text-light-solid);
35
35
  padding-left: 20px;
36
36
  padding-right: 20px;
37
37
  }
@@ -52,7 +52,7 @@
52
52
  width: calc(var(--height) - 2 * var(--border-width));
53
53
  height: calc(var(--height) - 2 * var(--border-width));
54
54
  border-radius: calc(var(--height) - 2 * var(--border-width));
55
- background: var(--adm-color-white);
55
+ background: var(--adm-color-text-light-solid);
56
56
  position: absolute;
57
57
  z-index: 2;
58
58
  top: var(--border-width);
@@ -83,7 +83,7 @@
83
83
  }
84
84
  .adm-switch.adm-switch-checked .adm-switch-inner {
85
85
  margin: 0 calc(var(--height) - var(--border-width) + 5px) 0 10px;
86
- color: var(--adm-color-white);
86
+ color: var(--adm-color-text-light-solid);
87
87
  }
88
88
  .adm-switch.adm-switch-disabled {
89
89
  cursor: not-allowed;
@@ -182,7 +182,8 @@ export const Tabs = p => {
182
182
  className: `${classPrefix}-tab-list`,
183
183
  ref: tabListContainerRef,
184
184
  scrollLeft: scrollLeft,
185
- onScroll: updateMask
185
+ onScroll: updateMask,
186
+ role: 'tablist'
186
187
  }, React.createElement(animated.div, {
187
188
  ref: activeLineRef,
188
189
  className: `${classPrefix}-tab-line`,
@@ -209,7 +210,9 @@ export const Tabs = p => {
209
210
  className: classNames(`${classPrefix}-tab`, {
210
211
  [`${classPrefix}-tab-active`]: pane.key === activeKey,
211
212
  [`${classPrefix}-tab-disabled`]: pane.props.disabled
212
- })
213
+ }),
214
+ role: 'tab',
215
+ "aria-selected": pane.key === activeKey
213
216
  }, pane.props.title)))))), panes.map(pane => {
214
217
  if (pane.props.children === undefined) {
215
218
  return null;
@@ -21,7 +21,7 @@ export declare type TextAreaRef = {
21
21
  blur: () => void;
22
22
  nativeElement: HTMLTextAreaElement | null;
23
23
  };
24
- export declare const TextArea: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "onClick" | "disabled" | "name" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "autoComplete" | "autoFocus" | "readOnly"> & {
24
+ export declare const TextArea: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "onClick" | "disabled" | "name" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "autoFocus" | "autoComplete" | "readOnly"> & {
25
25
  onChange?: ((val: string) => void) | undefined;
26
26
  value?: string | undefined;
27
27
  defaultValue?: string | undefined;
@@ -5,6 +5,7 @@ import { usePropsValue } from '../../utils/use-props-value';
5
5
  import classNames from 'classnames';
6
6
  import { CloseCircleFill } from 'antd-mobile-icons';
7
7
  import { useIsomorphicLayoutEffect } from 'ahooks';
8
+ import { useConfig } from '../config-provider';
8
9
  const classPrefix = 'adm-virtual-input';
9
10
  const defaultProps = {
10
11
  defaultValue: ''
@@ -15,6 +16,9 @@ export const VirtualInput = forwardRef((p, ref) => {
15
16
  const rootRef = useRef(null);
16
17
  const contentRef = useRef(null);
17
18
  const [hasFocus, setHasFocus] = useState(false);
19
+ const {
20
+ locale
21
+ } = useConfig();
18
22
  function scrollToEnd() {
19
23
  const root = rootRef.current;
20
24
  if (!root) return;
@@ -84,7 +88,11 @@ export const VirtualInput = forwardRef((p, ref) => {
84
88
  onClick: props.onClick
85
89
  }, React.createElement("div", {
86
90
  className: `${classPrefix}-content`,
87
- ref: contentRef
91
+ ref: contentRef,
92
+ role: 'option',
93
+ tabIndex: props.disabled ? undefined : 0,
94
+ "aria-disabled": props.disabled,
95
+ "aria-label": props.placeholder
88
96
  }, value, React.createElement("div", {
89
97
  className: `${classPrefix}-caret-container`
90
98
  }, hasFocus && React.createElement("div", {
@@ -96,7 +104,9 @@ export const VirtualInput = forwardRef((p, ref) => {
96
104
  e.stopPropagation();
97
105
  setValue('');
98
106
  (_a = props.onClear) === null || _a === void 0 ? void 0 : _a.call(props);
99
- }
107
+ },
108
+ role: 'button',
109
+ "aria-label": locale.Input.clear
100
110
  }, React.createElement(CloseCircleFill, null)), !value && React.createElement("div", {
101
111
  className: `${classPrefix}-placeholder`
102
112
  }, props.placeholder), keyboardElement));
@@ -16,14 +16,17 @@
16
16
  --adm-color-success: #00b578;
17
17
  --adm-color-warning: #ff8f1f;
18
18
  --adm-color-danger: #ff3141;
19
- --adm-color-white: #ffffff;
20
19
  --adm-color-text: #333333;
21
20
  --adm-color-text-secondary: #666666;
22
21
  --adm-color-weak: #999999;
23
22
  --adm-color-light: #cccccc;
24
23
  --adm-color-border: #eeeeee;
25
- --adm-color-box: #f5f5f5;
26
24
  --adm-color-background: #ffffff;
25
+ --adm-color-white: #ffffff;
26
+ --adm-color-box: #f5f5f5;
27
+ --adm-color-text-light-solid: var(--adm-color-white);
28
+ --adm-color-text-dark-solid: #000000;
29
+ --adm-color-fill-content: var(--adm-color-box);
27
30
  --adm-font-size-main: var(--adm-font-size-5);
28
31
  --adm-font-family: -apple-system, blinkmacsystemfont, 'Helvetica Neue',
29
32
  helvetica, segoe ui, arial, roboto, 'PingFang SC', 'miui',
@@ -16,14 +16,17 @@
16
16
  --adm-color-success: #00b578;
17
17
  --adm-color-warning: #ff8f1f;
18
18
  --adm-color-danger: #ff3141;
19
- --adm-color-white: #ffffff;
20
19
  --adm-color-text: #333333;
21
20
  --adm-color-text-secondary: #666666;
22
21
  --adm-color-weak: #999999;
23
22
  --adm-color-light: #cccccc;
24
23
  --adm-color-border: #eeeeee;
25
- --adm-color-box: #f5f5f5;
26
24
  --adm-color-background: #ffffff;
25
+ --adm-color-white: #ffffff;
26
+ --adm-color-box: #f5f5f5;
27
+ --adm-color-text-light-solid: var(--adm-color-white);
28
+ --adm-color-text-dark-solid: #000000;
29
+ --adm-color-fill-content: var(--adm-color-box);
27
30
  --adm-font-size-main: var(--adm-font-size-5);
28
31
  --adm-font-family: -apple-system, blinkmacsystemfont, 'Helvetica Neue',
29
32
  helvetica, segoe ui, arial, roboto, 'PingFang SC', 'miui',
@@ -127,5 +127,8 @@ export declare const base: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export declare type Locale = typeof base;
@@ -127,5 +127,8 @@ export const base = {
127
127
  },
128
128
  Switch: {
129
129
  name: 'Switch'
130
+ },
131
+ Selector: {
132
+ name: 'Selector'
130
133
  }
131
134
  };
@@ -127,5 +127,8 @@ declare const enUS: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export default enUS;
@@ -127,5 +127,8 @@ declare const esES: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export default esES;
@@ -127,5 +127,8 @@ declare const faIR: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export default faIR;
@@ -127,5 +127,8 @@ declare const frFR: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export default frFR;
@@ -127,5 +127,8 @@ declare const idID: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export default idID;
@@ -127,5 +127,8 @@ declare const jaJP: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export default jaJP;
@@ -127,5 +127,8 @@ declare const kkKZ: {
127
127
  Switch: {
128
128
  name: string;
129
129
  };
130
+ Selector: {
131
+ name: string;
132
+ };
130
133
  };
131
134
  export default kkKZ;