antd-mobile 5.16.1 → 5.17.2

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 (208) hide show
  1. package/2x/README.md +2 -0
  2. package/2x/bundle/antd-mobile.cjs.js +3411 -3359
  3. package/2x/bundle/antd-mobile.es.js +3412 -3360
  4. package/2x/bundle/style.css +102 -40
  5. package/2x/cjs/components/button/button.css +1 -0
  6. package/2x/cjs/components/calendar/calendar.js +2 -2
  7. package/2x/cjs/components/cascader/cascader.js +1 -1
  8. package/2x/cjs/components/cascader-view/cascader-view.js +7 -3
  9. package/2x/cjs/components/date-picker/date-picker.d.ts +2 -2
  10. package/2x/cjs/components/date-picker/date-picker.js +3 -1
  11. package/2x/cjs/components/date-picker/index.d.ts +1 -1
  12. package/2x/cjs/components/date-picker-view/date-picker-view.d.ts +1 -1
  13. package/2x/cjs/components/date-picker-view/date-picker-view.js +2 -0
  14. package/2x/cjs/components/dialog/dialog.css +1 -0
  15. package/2x/cjs/components/dropdown/dropdown.css +2 -2
  16. package/2x/cjs/components/empty/empty.css +1 -0
  17. package/2x/cjs/components/floating-bubble/floating-bubble.css +1 -0
  18. package/2x/cjs/components/floating-panel/floating-panel.css +7 -4
  19. package/2x/cjs/components/form/form-item.css +1 -0
  20. package/2x/cjs/components/form/index.css +1 -0
  21. package/2x/cjs/components/grid/grid.css +1 -0
  22. package/2x/cjs/components/image/image.d.ts +1 -0
  23. package/2x/cjs/components/image/image.js +2 -1
  24. package/2x/cjs/components/image/test/image.test.d.ts +1 -0
  25. package/2x/cjs/components/image/test/image.test.js +34 -0
  26. package/2x/cjs/components/image-viewer/image-viewer.css +3 -0
  27. package/2x/cjs/components/index-bar/index-bar.css +2 -0
  28. package/2x/cjs/components/input/input.css +6 -0
  29. package/2x/cjs/components/jumbo-tabs/jumbo-tabs.css +2 -0
  30. package/2x/cjs/components/modal/modal.css +1 -0
  31. package/2x/cjs/components/number-keyboard/number-keyboard.css +3 -2
  32. package/2x/cjs/components/passcode-input/passcode-input.css +1 -1
  33. package/2x/cjs/components/picker/index.d.ts +4 -0
  34. package/2x/cjs/components/picker/picker.css +6 -0
  35. package/2x/cjs/components/picker/picker.d.ts +4 -0
  36. package/2x/cjs/components/picker/picker.js +7 -3
  37. package/2x/cjs/components/picker-view/picker-view.css +17 -3
  38. package/2x/cjs/components/picker-view/picker-view.d.ts +2 -0
  39. package/2x/cjs/components/picker-view/picker-view.js +10 -3
  40. package/2x/cjs/components/picker-view/wheel.js +1 -1
  41. package/2x/cjs/components/popover/popover.css +2 -0
  42. package/2x/cjs/components/result/result.css +1 -1
  43. package/2x/cjs/components/side-bar/side-bar.css +1 -0
  44. package/2x/cjs/components/slider/slider.css +4 -0
  45. package/2x/cjs/components/swipe-action/swipe-action.css +1 -0
  46. package/2x/cjs/components/swiper/swiper.css +1 -0
  47. package/2x/cjs/components/tab-bar/tab-bar.css +1 -0
  48. package/2x/cjs/components/tabs/tabs.css +1 -0
  49. package/2x/cjs/components/text-area/text-area.css +6 -0
  50. package/2x/cjs/global/global.css +1 -0
  51. package/2x/cjs/utils/use-props-value.d.ts +1 -1
  52. package/2x/cjs/utils/use-props-value.js +3 -1
  53. package/2x/cjs/utils/use-tab-list-scroll.js +1 -1
  54. package/2x/es/components/button/button.css +1 -0
  55. package/2x/es/components/calendar/calendar.js +2 -2
  56. package/2x/es/components/cascader/cascader.js +1 -1
  57. package/2x/es/components/cascader-view/cascader-view.js +6 -3
  58. package/2x/es/components/date-picker/date-picker.d.ts +2 -2
  59. package/2x/es/components/date-picker/date-picker.js +3 -1
  60. package/2x/es/components/date-picker/index.d.ts +1 -1
  61. package/2x/es/components/date-picker-view/date-picker-view.d.ts +1 -1
  62. package/2x/es/components/date-picker-view/date-picker-view.js +2 -0
  63. package/2x/es/components/dialog/dialog.css +1 -0
  64. package/2x/es/components/dropdown/dropdown.css +2 -2
  65. package/2x/es/components/empty/empty.css +1 -0
  66. package/2x/es/components/floating-bubble/floating-bubble.css +1 -0
  67. package/2x/es/components/floating-panel/floating-panel.css +7 -4
  68. package/2x/es/components/form/form-item.css +1 -0
  69. package/2x/es/components/form/index.css +1 -0
  70. package/2x/es/components/grid/grid.css +1 -0
  71. package/2x/es/components/image/image.d.ts +1 -0
  72. package/2x/es/components/image/image.js +2 -1
  73. package/2x/es/components/image/test/image.test.d.ts +1 -0
  74. package/2x/es/components/image/test/image.test.js +24 -0
  75. package/2x/es/components/image-viewer/image-viewer.css +3 -0
  76. package/2x/es/components/index-bar/index-bar.css +2 -0
  77. package/2x/es/components/input/input.css +6 -0
  78. package/2x/es/components/jumbo-tabs/jumbo-tabs.css +2 -0
  79. package/2x/es/components/modal/modal.css +1 -0
  80. package/2x/es/components/number-keyboard/number-keyboard.css +3 -2
  81. package/2x/es/components/passcode-input/passcode-input.css +1 -1
  82. package/2x/es/components/picker/index.d.ts +4 -0
  83. package/2x/es/components/picker/picker.css +6 -0
  84. package/2x/es/components/picker/picker.d.ts +4 -0
  85. package/2x/es/components/picker/picker.js +7 -3
  86. package/2x/es/components/picker-view/picker-view.css +17 -3
  87. package/2x/es/components/picker-view/picker-view.d.ts +2 -0
  88. package/2x/es/components/picker-view/picker-view.js +7 -3
  89. package/2x/es/components/picker-view/wheel.js +1 -1
  90. package/2x/es/components/popover/popover.css +2 -0
  91. package/2x/es/components/result/result.css +1 -1
  92. package/2x/es/components/side-bar/side-bar.css +1 -0
  93. package/2x/es/components/slider/slider.css +4 -0
  94. package/2x/es/components/swipe-action/swipe-action.css +1 -0
  95. package/2x/es/components/swiper/swiper.css +1 -0
  96. package/2x/es/components/tab-bar/tab-bar.css +1 -0
  97. package/2x/es/components/tabs/tabs.css +1 -0
  98. package/2x/es/components/text-area/text-area.css +6 -0
  99. package/2x/es/global/global.css +1 -0
  100. package/2x/es/utils/use-props-value.d.ts +1 -1
  101. package/2x/es/utils/use-props-value.js +3 -1
  102. package/2x/es/utils/use-tab-list-scroll.js +1 -1
  103. package/2x/package.json +1 -1
  104. package/2x/umd/antd-mobile.js +1 -1
  105. package/README.md +2 -0
  106. package/bundle/antd-mobile.cjs.js +3411 -3359
  107. package/bundle/antd-mobile.es.js +3412 -3360
  108. package/bundle/style.css +112 -54
  109. package/cjs/components/button/button.css +2 -1
  110. package/cjs/components/calendar/calendar.js +2 -2
  111. package/cjs/components/cascader/cascader.js +1 -1
  112. package/cjs/components/cascader-view/cascader-view.js +7 -3
  113. package/cjs/components/date-picker/date-picker.d.ts +2 -2
  114. package/cjs/components/date-picker/date-picker.js +3 -1
  115. package/cjs/components/date-picker/index.d.ts +1 -1
  116. package/cjs/components/date-picker-view/date-picker-view.d.ts +1 -1
  117. package/cjs/components/date-picker-view/date-picker-view.js +2 -0
  118. package/cjs/components/dialog/dialog.css +2 -1
  119. package/cjs/components/dropdown/dropdown.css +2 -2
  120. package/cjs/components/empty/empty.css +1 -0
  121. package/cjs/components/floating-bubble/floating-bubble.css +2 -1
  122. package/cjs/components/floating-panel/floating-panel.css +8 -5
  123. package/cjs/components/form/form-item.css +2 -1
  124. package/cjs/components/form/index.css +2 -1
  125. package/cjs/components/grid/grid.css +2 -1
  126. package/cjs/components/image/image.d.ts +1 -0
  127. package/cjs/components/image/image.js +2 -1
  128. package/cjs/components/image/test/image.test.d.ts +1 -0
  129. package/cjs/components/image/test/image.test.js +34 -0
  130. package/cjs/components/image-viewer/image-viewer.css +4 -1
  131. package/cjs/components/index-bar/index-bar.css +3 -1
  132. package/cjs/components/input/input.css +6 -1
  133. package/cjs/components/jumbo-tabs/jumbo-tabs.css +2 -0
  134. package/cjs/components/modal/modal.css +2 -1
  135. package/cjs/components/number-keyboard/number-keyboard.css +4 -3
  136. package/cjs/components/passcode-input/passcode-input.css +1 -1
  137. package/cjs/components/picker/index.d.ts +4 -0
  138. package/cjs/components/picker/picker.css +5 -0
  139. package/cjs/components/picker/picker.d.ts +4 -0
  140. package/cjs/components/picker/picker.js +7 -3
  141. package/cjs/components/picker-view/picker-view.css +17 -4
  142. package/cjs/components/picker-view/picker-view.d.ts +2 -0
  143. package/cjs/components/picker-view/picker-view.js +10 -3
  144. package/cjs/components/picker-view/wheel.js +1 -1
  145. package/cjs/components/popover/popover.css +3 -1
  146. package/cjs/components/result/result.css +1 -1
  147. package/cjs/components/side-bar/side-bar.css +2 -1
  148. package/cjs/components/slider/slider.css +7 -3
  149. package/cjs/components/swipe-action/swipe-action.css +1 -0
  150. package/cjs/components/swiper/swiper.css +1 -0
  151. package/cjs/components/tab-bar/tab-bar.css +1 -0
  152. package/cjs/components/tabs/tabs.css +1 -0
  153. package/cjs/components/text-area/text-area.css +6 -1
  154. package/cjs/global/global.css +2 -1
  155. package/cjs/utils/use-props-value.d.ts +1 -1
  156. package/cjs/utils/use-props-value.js +3 -1
  157. package/cjs/utils/use-tab-list-scroll.js +1 -1
  158. package/es/components/button/button.css +2 -1
  159. package/es/components/calendar/calendar.js +2 -2
  160. package/es/components/cascader/cascader.js +1 -1
  161. package/es/components/cascader-view/cascader-view.js +6 -3
  162. package/es/components/date-picker/date-picker.d.ts +2 -2
  163. package/es/components/date-picker/date-picker.js +3 -1
  164. package/es/components/date-picker/index.d.ts +1 -1
  165. package/es/components/date-picker-view/date-picker-view.d.ts +1 -1
  166. package/es/components/date-picker-view/date-picker-view.js +2 -0
  167. package/es/components/dialog/dialog.css +2 -1
  168. package/es/components/dropdown/dropdown.css +2 -2
  169. package/es/components/empty/empty.css +1 -0
  170. package/es/components/floating-bubble/floating-bubble.css +2 -1
  171. package/es/components/floating-panel/floating-panel.css +8 -5
  172. package/es/components/form/form-item.css +2 -1
  173. package/es/components/form/index.css +2 -1
  174. package/es/components/grid/grid.css +2 -1
  175. package/es/components/image/image.d.ts +1 -0
  176. package/es/components/image/image.js +2 -1
  177. package/es/components/image/test/image.test.d.ts +1 -0
  178. package/es/components/image/test/image.test.js +24 -0
  179. package/es/components/image-viewer/image-viewer.css +4 -1
  180. package/es/components/index-bar/index-bar.css +3 -1
  181. package/es/components/input/input.css +6 -1
  182. package/es/components/jumbo-tabs/jumbo-tabs.css +2 -0
  183. package/es/components/modal/modal.css +2 -1
  184. package/es/components/number-keyboard/number-keyboard.css +4 -3
  185. package/es/components/passcode-input/passcode-input.css +1 -1
  186. package/es/components/picker/index.d.ts +4 -0
  187. package/es/components/picker/picker.css +5 -0
  188. package/es/components/picker/picker.d.ts +4 -0
  189. package/es/components/picker/picker.js +7 -3
  190. package/es/components/picker-view/picker-view.css +17 -4
  191. package/es/components/picker-view/picker-view.d.ts +2 -0
  192. package/es/components/picker-view/picker-view.js +7 -3
  193. package/es/components/picker-view/wheel.js +1 -1
  194. package/es/components/popover/popover.css +3 -1
  195. package/es/components/result/result.css +1 -1
  196. package/es/components/side-bar/side-bar.css +2 -1
  197. package/es/components/slider/slider.css +7 -3
  198. package/es/components/swipe-action/swipe-action.css +1 -0
  199. package/es/components/swiper/swiper.css +1 -0
  200. package/es/components/tab-bar/tab-bar.css +1 -0
  201. package/es/components/tabs/tabs.css +1 -0
  202. package/es/components/text-area/text-area.css +6 -1
  203. package/es/global/global.css +2 -1
  204. package/es/utils/use-props-value.d.ts +1 -1
  205. package/es/utils/use-props-value.js +3 -1
  206. package/es/utils/use-tab-list-scroll.js +1 -1
  207. package/package.json +1 -1
  208. package/umd/antd-mobile.js +1 -1
package/bundle/style.css CHANGED
@@ -80,7 +80,8 @@ div.adm-px-tester {
80
80
  position: fixed;
81
81
  right: -100vw;
82
82
  bottom: -100vh;
83
- user-select: none;
83
+ -webkit-user-select: none;
84
+ user-select: none;
84
85
  pointer-events: none;
85
86
  }
86
87
  .adm-action-sheet-popup > .adm-popup-body {
@@ -308,7 +309,8 @@ div.adm-px-tester {
308
309
  border-radius: var(--border-radius);
309
310
  cursor: pointer;
310
311
  transition: opacity ease 0.15s;
311
- user-select: none;
312
+ -webkit-user-select: none;
313
+ user-select: none;
312
314
  }
313
315
  .adm-button:focus {
314
316
  outline: none;
@@ -636,6 +638,11 @@ div.adm-px-tester {
636
638
  display: inline-block;
637
639
  padding: 8px 8px;
638
640
  }
641
+ .adm-picker-header-button-disabled,
642
+ .adm-picker-header-button-disabled:active {
643
+ opacity: 0.4;
644
+ cursor: not-allowed;
645
+ }
639
646
  .adm-picker-header-title {
640
647
  padding: 4px 4px;
641
648
  font-size: var(--title-font-size);
@@ -654,6 +661,28 @@ div.adm-px-tester {
654
661
  border-top-left-radius: 8px;
655
662
  border-top-right-radius: 8px;
656
663
  }
664
+ .adm-spin-loading {
665
+ --color: var(--adm-color-weak);
666
+ --size: 32px;
667
+ width: var(--size);
668
+ height: var(--size);
669
+ }
670
+ .adm-spin-loading-svg {
671
+ width: 100%;
672
+ height: 100%;
673
+ animation: adm-spin-loading-rotate 0.8s infinite linear;
674
+ }
675
+ .adm-spin-loading-svg > .adm-spin-loading-fill {
676
+ stroke: var(--color);
677
+ }
678
+ @keyframes adm-spin-loading-rotate {
679
+ from {
680
+ transform: rotate(0deg);
681
+ }
682
+ to {
683
+ transform: rotate(360deg);
684
+ }
685
+ }
657
686
  .adm-picker-view {
658
687
  --height: 240px;
659
688
  --item-height: 34px;
@@ -663,18 +692,20 @@ div.adm-px-tester {
663
692
  display: flex;
664
693
  position: relative;
665
694
  overflow: hidden;
666
- background: var(--adm-color-white);
695
+ background: var(--adm-color-background);
667
696
  }
668
697
  .adm-picker-view-column {
669
698
  height: 100%;
670
699
  flex: 1;
671
- user-select: none;
700
+ -webkit-user-select: none;
701
+ user-select: none;
672
702
  touch-action: none;
673
703
  position: relative;
674
704
  z-index: 0;
675
705
  }
676
706
  .adm-picker-view-column-wheel {
677
707
  width: 100%;
708
+ cursor: -webkit-grab;
678
709
  cursor: grab;
679
710
  position: absolute;
680
711
  top: calc(50% - var(--item-height) / 2);
@@ -756,10 +787,21 @@ div.adm-px-tester {
756
787
  border-bottom: solid 1px var(--adm-color-border);
757
788
  }
758
789
  .adm-picker-view-mask-top {
759
- background: linear-gradient(0deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.8) 50%, #ffffff);
790
+ background: var(--adm-color-background);
791
+ -webkit-mask: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.8) 50%, #000000 100%);
792
+ mask: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.8) 50%, #000000 100%);
760
793
  }
761
794
  .adm-picker-view-mask-bottom {
762
- background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.8) 50%, #ffffff);
795
+ background: var(--adm-color-background);
796
+ -webkit-mask: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.8) 50%, #000000 100%);
797
+ mask: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.8) 50%, #000000 100%);
798
+ }
799
+ .adm-picker-view-loading-content {
800
+ width: 100%;
801
+ height: 100%;
802
+ display: flex;
803
+ justify-content: center;
804
+ align-items: center;
763
805
  }
764
806
  .adm-cascader-view {
765
807
  --height: auto;
@@ -842,6 +884,7 @@ div.adm-px-tester {
842
884
  .adm-tabs-tab {
843
885
  white-space: nowrap;
844
886
  padding: 8px 0 10px;
887
+ width: -webkit-min-content;
845
888
  width: min-content;
846
889
  margin: 0 auto;
847
890
  font-size: var(--title-font-size);
@@ -1227,7 +1270,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1227
1270
  height: 12px;
1228
1271
  }
1229
1272
  .adm-dialog-footer {
1230
- user-select: none;
1273
+ -webkit-user-select: none;
1274
+ user-select: none;
1231
1275
  }
1232
1276
  .adm-dialog-footer .adm-dialog-action-row {
1233
1277
  display: flex;
@@ -1321,7 +1365,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1321
1365
  border-left: 1px solid var(--adm-color-border);
1322
1366
  }
1323
1367
  .adm-dropdown {
1324
- background-color: white;
1368
+ background-color: var(--adm-color-background);
1325
1369
  }
1326
1370
  .adm-dropdown .adm-dropdown-nav {
1327
1371
  display: flex;
@@ -1372,7 +1416,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1372
1416
  }
1373
1417
  .adm-dropdown-item-content {
1374
1418
  width: 100%;
1375
- background: white;
1419
+ background: var(--adm-color-background);
1376
1420
  }
1377
1421
  .adm-dropdown-item-content-hidden {
1378
1422
  display: none;
@@ -1408,6 +1452,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1408
1452
  }
1409
1453
  .adm-empty-image-container .adm-empty-image {
1410
1454
  width: 64px;
1455
+ height: intrinsic;
1411
1456
  }
1412
1457
  .adm-empty-description {
1413
1458
  margin-top: 8px;
@@ -1503,7 +1548,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1503
1548
  overflow: hidden;
1504
1549
  cursor: pointer;
1505
1550
  transition: opacity ease 0.15s;
1506
- user-select: none;
1551
+ -webkit-user-select: none;
1552
+ user-select: none;
1507
1553
  touch-action: none;
1508
1554
  background: var(--background);
1509
1555
  color: var(--adm-color-white);
@@ -1514,9 +1560,6 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1514
1560
  --border-radius: 8px;
1515
1561
  --header-height: 28px;
1516
1562
  --z-index: var(--adm-floating-panel-z-index, 900);
1517
- border-top-left-radius: var(--border-radius);
1518
- border-top-right-radius: var(--border-radius);
1519
- background: var(--adm-color-white);
1520
1563
  position: fixed;
1521
1564
  z-index: var(--z-index);
1522
1565
  bottom: 0;
@@ -1542,7 +1585,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1542
1585
  bottom: -100vh;
1543
1586
  height: 100vh;
1544
1587
  width: 100vw;
1545
- background: var(--adm-color-white);
1588
+ background: var(--adm-color-background);
1546
1589
  }
1547
1590
  .adm-floating-panel .adm-floating-panel-header {
1548
1591
  flex: none;
@@ -1550,8 +1593,13 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1550
1593
  display: flex;
1551
1594
  justify-content: center;
1552
1595
  align-items: center;
1596
+ cursor: -webkit-grab;
1553
1597
  cursor: grab;
1554
- user-select: none;
1598
+ -webkit-user-select: none;
1599
+ user-select: none;
1600
+ background-color: var(--adm-color-background);
1601
+ border-top-left-radius: var(--border-radius);
1602
+ border-top-right-radius: var(--border-radius);
1555
1603
  }
1556
1604
  .adm-floating-panel .adm-floating-panel-header .adm-floating-panel-bar {
1557
1605
  height: 3px;
@@ -1562,6 +1610,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1562
1610
  .adm-floating-panel .adm-floating-panel-content {
1563
1611
  flex: 1;
1564
1612
  overflow-y: scroll;
1613
+ background: var(--adm-color-background);
1565
1614
  }
1566
1615
  .adm-form {
1567
1616
  --border-inner: solid 1px var(--adm-color-border);
@@ -1602,7 +1651,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1602
1651
  top: 0;
1603
1652
  font-family: SimSun, sans-serif;
1604
1653
  color: var(--adm-color-danger);
1605
- user-select: none;
1654
+ -webkit-user-select: none;
1655
+ user-select: none;
1606
1656
  }
1607
1657
  .adm-form-item-label .adm-form-item-required-text {
1608
1658
  margin-left: 4px;
@@ -1666,7 +1716,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1666
1716
  white-space: normal;
1667
1717
  text-align: left;
1668
1718
  cursor: auto;
1669
- user-select: text;
1719
+ -webkit-user-select: text;
1720
+ user-select: text;
1670
1721
  animation: none;
1671
1722
  }
1672
1723
  .adm-popover.adm-popover-dark {
@@ -1691,6 +1742,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1691
1742
  border-radius: 8px;
1692
1743
  box-shadow: 0 0 30px 0 rgba(51, 51, 51, 0.2);
1693
1744
  font-size: var(--adm-font-size-7);
1745
+ width: -webkit-max-content;
1694
1746
  width: max-content;
1695
1747
  min-width: 32px;
1696
1748
  max-width: calc(100vw - 24px);
@@ -1777,7 +1829,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1777
1829
  --gap-vertical: var(--gap);
1778
1830
  display: grid;
1779
1831
  grid-gap: 10px;
1780
- column-gap: var(--gap-horizontal);
1832
+ -webkit-column-gap: var(--gap-horizontal);
1833
+ column-gap: var(--gap-horizontal);
1781
1834
  row-gap: var(--gap-vertical);
1782
1835
  grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
1783
1836
  align-items: stretch;
@@ -1789,7 +1842,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1789
1842
  width: 100vw;
1790
1843
  height: 100vh;
1791
1844
  touch-action: none;
1792
- user-select: none;
1845
+ -webkit-user-select: none;
1846
+ user-select: none;
1793
1847
  }
1794
1848
  .adm-image-viewer-footer {
1795
1849
  position: absolute;
@@ -1801,6 +1855,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1801
1855
  height: 100%;
1802
1856
  position: relative;
1803
1857
  z-index: 1;
1858
+ cursor: -webkit-grab;
1804
1859
  cursor: grab;
1805
1860
  touch-action: none;
1806
1861
  }
@@ -1824,6 +1879,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1824
1879
  top: 0;
1825
1880
  width: 100%;
1826
1881
  height: 100%;
1882
+ cursor: -webkit-grab;
1827
1883
  cursor: grab;
1828
1884
  touch-action: none;
1829
1885
  }
@@ -1848,28 +1904,6 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
1848
1904
  color: #e6e6e6;
1849
1905
  font-size: var(--adm-font-size-6);
1850
1906
  }
1851
- .adm-spin-loading {
1852
- --color: var(--adm-color-weak);
1853
- --size: 32px;
1854
- width: var(--size);
1855
- height: var(--size);
1856
- }
1857
- .adm-spin-loading-svg {
1858
- width: 100%;
1859
- height: 100%;
1860
- animation: adm-spin-loading-rotate 0.8s infinite linear;
1861
- }
1862
- .adm-spin-loading-svg > .adm-spin-loading-fill {
1863
- stroke: var(--color);
1864
- }
1865
- @keyframes adm-spin-loading-rotate {
1866
- from {
1867
- transform: rotate(0deg);
1868
- }
1869
- to {
1870
- transform: rotate(360deg);
1871
- }
1872
- }
1873
1907
  .adm-space-item {
1874
1908
  flex: none;
1875
1909
  }
@@ -2059,7 +2093,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2059
2093
  overflow: visible;
2060
2094
  color: var(--adm-color-weak);
2061
2095
  font-size: var(--adm-font-size-4);
2062
- user-select: none;
2096
+ -webkit-user-select: none;
2097
+ user-select: none;
2063
2098
  touch-action: none;
2064
2099
  }
2065
2100
  .adm-index-bar-sidebar-bubble {
@@ -2103,6 +2138,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2103
2138
  width: 100%;
2104
2139
  }
2105
2140
  .adm-index-bar-sticky .adm-index-bar-anchor-title {
2141
+ position: -webkit-sticky;
2106
2142
  position: sticky;
2107
2143
  z-index: 900;
2108
2144
  top: var(--sticky-offset-top);
@@ -2154,10 +2190,15 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2154
2190
  background: transparent;
2155
2191
  border: 0;
2156
2192
  outline: none;
2157
- appearance: none;
2193
+ -webkit-appearance: none;
2194
+ appearance: none;
2158
2195
  min-height: 1.5em;
2159
2196
  text-align: var(--text-align);
2160
2197
  }
2198
+ .adm-input-element::-webkit-input-placeholder {
2199
+ color: var(--placeholder-color);
2200
+ font-family: inherit;
2201
+ }
2161
2202
  .adm-input-element::placeholder {
2162
2203
  color: var(--placeholder-color);
2163
2204
  font-family: inherit;
@@ -2243,6 +2284,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2243
2284
  flex-direction: column;
2244
2285
  align-items: center;
2245
2286
  position: relative;
2287
+ width: -webkit-min-content;
2246
2288
  width: min-content;
2247
2289
  margin: 0 auto;
2248
2290
  padding: 12px 0;
@@ -2255,6 +2297,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2255
2297
  padding: 0 4px;
2256
2298
  }
2257
2299
  .adm-jumbo-tabs-tab-description {
2300
+ width: -webkit-min-content;
2258
2301
  width: min-content;
2259
2302
  padding: 0 8px;
2260
2303
  border-radius: 10px;
@@ -2327,7 +2370,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2327
2370
  color: var(--adm-color-text);
2328
2371
  }
2329
2372
  .adm-modal-footer {
2330
- user-select: none;
2373
+ -webkit-user-select: none;
2374
+ user-select: none;
2331
2375
  padding: 8px 12px 12px;
2332
2376
  }
2333
2377
  .adm-modal-footer-empty {
@@ -2473,7 +2517,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2473
2517
  }
2474
2518
  .adm-number-keyboard-popup.adm-popup {
2475
2519
  width: 100%;
2476
- user-select: none;
2520
+ -webkit-user-select: none;
2521
+ user-select: none;
2477
2522
  z-index: 1050;
2478
2523
  }
2479
2524
  .adm-number-keyboard-popup.adm-popup .adm-popup-body {
@@ -2491,7 +2536,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2491
2536
  align-items: center;
2492
2537
  padding: 0 12px;
2493
2538
  color: var(--adm-color-weak);
2494
- background-color: var(--adm-color-white);
2539
+ background-color: var(--adm-color-background);
2495
2540
  }
2496
2541
  .adm-number-keyboard-header-close-button {
2497
2542
  padding: 0 12px;
@@ -2558,7 +2603,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2558
2603
  }
2559
2604
  .adm-number-keyboard-key.extra-key,
2560
2605
  .adm-number-keyboard-key.number-key {
2561
- background-color: var(--adm-color-white);
2606
+ background-color: var(--adm-color-background);
2562
2607
  }
2563
2608
  .adm-number-keyboard-key.extra-key:active::before,
2564
2609
  .adm-number-keyboard-key.number-key:active::before {
@@ -2642,7 +2687,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2642
2687
  font-size: var(--adm-font-size-10);
2643
2688
  width: var(--cell-size);
2644
2689
  height: var(--cell-size);
2645
- background: var(--adm-color-white);
2690
+ background: var(--adm-color-background);
2646
2691
  }
2647
2692
  .adm-passcode-input:not(.seperated) {
2648
2693
  border-radius: var(--border-radius);
@@ -2937,7 +2982,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
2937
2982
  }
2938
2983
  .adm-result {
2939
2984
  padding: 32px 12px;
2940
- background-color: var(--adm-color-white);
2985
+ background-color: var(--adm-color-background);
2941
2986
  }
2942
2987
  .adm-result-icon {
2943
2988
  box-sizing: border-box;
@@ -3151,7 +3196,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3151
3196
  position: absolute;
3152
3197
  z-index: 100;
3153
3198
  right: 0;
3154
- user-select: none;
3199
+ -webkit-user-select: none;
3200
+ user-select: none;
3155
3201
  pointer-events: none;
3156
3202
  }
3157
3203
  .adm-side-bar-item-corner-top {
@@ -3174,7 +3220,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3174
3220
  --fill-color: var(--adm-color-primary);
3175
3221
  padding: 5px 14px;
3176
3222
  list-style: none;
3177
- user-select: none;
3223
+ -webkit-user-select: none;
3224
+ user-select: none;
3178
3225
  }
3179
3226
  .adm-slider-track-container {
3180
3227
  padding: 8px 0;
@@ -3229,9 +3276,11 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3229
3276
  width: 12px;
3230
3277
  height: 12px;
3231
3278
  margin: 8px;
3232
- user-select: none;
3279
+ -webkit-user-select: none;
3280
+ user-select: none;
3233
3281
  }
3234
3282
  .adm-slider-thumb-container {
3283
+ cursor: -webkit-grab;
3235
3284
  cursor: grab;
3236
3285
  touch-action: none;
3237
3286
  position: absolute;
@@ -3257,7 +3306,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3257
3306
  color: var(--adm-color-text);
3258
3307
  text-align: center;
3259
3308
  word-break: keep-all;
3260
- user-select: none;
3309
+ -webkit-user-select: none;
3310
+ user-select: none;
3261
3311
  transform: translateX(-50%);
3262
3312
  }
3263
3313
  .adm-slider-disabled {
@@ -3482,6 +3532,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3482
3532
  .adm-swipe-action {
3483
3533
  --background: var(--adm-color-background);
3484
3534
  background: var(--background);
3535
+ cursor: -webkit-grab;
3485
3536
  cursor: grab;
3486
3537
  overflow: hidden;
3487
3538
  touch-action: pan-y;
@@ -3537,6 +3588,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3537
3588
  padding: var(--track-padding);
3538
3589
  }
3539
3590
  .adm-swiper-track-allow-touch-move {
3591
+ cursor: -webkit-grab;
3540
3592
  cursor: grab;
3541
3593
  }
3542
3594
  .adm-swiper-track-inner {
@@ -3702,6 +3754,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3702
3754
  color: var(--adm-color-weak);
3703
3755
  white-space: nowrap;
3704
3756
  padding: 4px 8px;
3757
+ width: -webkit-min-content;
3705
3758
  width: min-content;
3706
3759
  position: relative;
3707
3760
  cursor: pointer;
@@ -3777,10 +3830,15 @@ a.adm-list-item:active:not(.adm-list-item-disabled)::after {
3777
3830
  background: transparent;
3778
3831
  border: 0;
3779
3832
  outline: none;
3780
- appearance: none;
3833
+ -webkit-appearance: none;
3834
+ appearance: none;
3781
3835
  min-height: 1.5em;
3782
3836
  text-align: var(--text-align);
3783
3837
  }
3838
+ .adm-text-area-element::-webkit-input-placeholder {
3839
+ color: var(--placeholder-color);
3840
+ font-family: inherit;
3841
+ }
3784
3842
  .adm-text-area-element::placeholder {
3785
3843
  color: var(--placeholder-color);
3786
3844
  font-family: inherit;
@@ -21,7 +21,8 @@
21
21
  border-radius: var(--border-radius);
22
22
  cursor: pointer;
23
23
  transition: opacity ease 0.15s;
24
- user-select: none;
24
+ -webkit-user-select: none;
25
+ user-select: none;
25
26
  }
26
27
  .adm-button:focus {
27
28
  outline: none;
@@ -225,8 +225,8 @@ const Calendar = (0, _react.forwardRef)((p, ref) => {
225
225
 
226
226
  const mark = _react.default.createElement("div", {
227
227
  className: `${classPrefix}-mark`
228
- }, markItems.map(item => _react.default.createElement("div", {
229
- key: item,
228
+ }, markItems.map((item, index) => _react.default.createElement("div", {
229
+ key: index,
230
230
  className: `${classPrefix}-mark-cell`
231
231
  }, item)));
232
232
 
@@ -103,7 +103,7 @@ const Cascader = (0, _react.forwardRef)((p, ref) => {
103
103
  }, props.title), _react.default.createElement("a", {
104
104
  className: `${classPrefix}-header-button`,
105
105
  onClick: () => {
106
- setValue(innerValue);
106
+ setValue(innerValue, true);
107
107
  setVisible(false);
108
108
  }
109
109
  }, props.confirmText)), _react.default.createElement("div", {
@@ -27,6 +27,8 @@ var _optionSkeleton = require("./option-skeleton");
27
27
 
28
28
  var _skeleton = _interopRequireDefault(require("../skeleton"));
29
29
 
30
+ var _ahooks = require("ahooks");
31
+
30
32
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
31
33
 
32
34
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -53,6 +55,11 @@ const CascaderView = p => {
53
55
  }
54
56
  }));
55
57
  const [tabActiveIndex, setTabActiveIndex] = (0, _react.useState)(0);
58
+ (0, _ahooks.useUpdateEffect)(() => {
59
+ var _a;
60
+
61
+ (_a = props.onTabsChange) === null || _a === void 0 ? void 0 : _a.call(props, tabActiveIndex);
62
+ }, [tabActiveIndex]);
56
63
  const generateValueExtend = (0, _useCascaderValueExtend.useCascaderValueExtend)(props.options);
57
64
  const levels = (0, _react.useMemo)(() => {
58
65
  const ret = [];
@@ -109,11 +116,8 @@ const CascaderView = p => {
109
116
  }, _react.default.createElement(_tabs.default, {
110
117
  activeKey: tabActiveIndex.toString(),
111
118
  onChange: key => {
112
- var _a;
113
-
114
119
  const activeIndex = parseInt(key);
115
120
  setTabActiveIndex(activeIndex);
116
- (_a = props.onTabsChange) === null || _a === void 0 ? void 0 : _a.call(props, activeIndex);
117
121
  },
118
122
  stretch: false,
119
123
  className: `${classPrefix}-tabs`
@@ -3,7 +3,7 @@ import type { PickerProps, PickerRef, PickerActions } from '../picker';
3
3
  import { NativeProps } from '../../utils/native-props';
4
4
  import type { Precision, DatePickerFilter } from './date-picker-utils';
5
5
  export declare type DatePickerRef = PickerRef;
6
- export declare type DatePickerProps = Pick<PickerProps, 'onCancel' | 'onClose' | 'closeOnMaskClick' | 'visible' | 'confirmText' | 'cancelText' | 'getContainer' | 'afterShow' | 'afterClose' | 'onClick' | 'title' | 'stopPropagation' | 'style' | 'mouseWheel' | 'forceRender' | 'destroyOnClose'> & {
6
+ export declare type DatePickerProps = Pick<PickerProps, 'onCancel' | 'onClose' | 'closeOnMaskClick' | 'visible' | 'confirmText' | 'cancelText' | 'getContainer' | 'loading' | 'loadingContent' | 'afterShow' | 'afterClose' | 'onClick' | 'title' | 'stopPropagation' | 'style' | 'mouseWheel' | 'forceRender' | 'destroyOnClose'> & {
7
7
  value?: Date | null;
8
8
  defaultValue?: Date | null;
9
9
  onSelect?: (value: Date) => void;
@@ -15,7 +15,7 @@ export declare type DatePickerProps = Pick<PickerProps, 'onCancel' | 'onClose' |
15
15
  renderLabel?: (type: Precision, data: number) => ReactNode;
16
16
  filter?: DatePickerFilter;
17
17
  } & NativeProps;
18
- export declare const DatePicker: React.ForwardRefExoticComponent<Pick<PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "closeOnMaskClick" | "cancelText" | "mouseWheel" | "confirmText"> & {
18
+ export declare const DatePicker: React.ForwardRefExoticComponent<Pick<PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "loading" | "closeOnMaskClick" | "cancelText" | "mouseWheel" | "loadingContent" | "confirmText"> & {
19
19
  value?: Date | null | undefined;
20
20
  defaultValue?: Date | null | undefined;
21
21
  onSelect?: ((value: Date) => void) | undefined;
@@ -54,7 +54,7 @@ const DatePicker = (0, _react.forwardRef)((p, ref) => {
54
54
  return (0, _datePickerUtils.convertDateToStringArray)(date, props.precision);
55
55
  }, [value, props.precision, props.min, props.max]);
56
56
  const onConfirm = (0, _react.useCallback)(val => {
57
- setValue((0, _datePickerUtils.convertStringArrayToDate)(val, props.precision));
57
+ setValue((0, _datePickerUtils.convertStringArrayToDate)(val, props.precision), true);
58
58
  }, [setValue, props.precision]);
59
59
  const onSelect = (0, _ahooks.useMemoizedFn)(val => {
60
60
  var _a;
@@ -76,6 +76,8 @@ const DatePicker = (0, _react.forwardRef)((p, ref) => {
76
76
  onConfirm: onConfirm,
77
77
  onSelect: onSelect,
78
78
  getContainer: props.getContainer,
79
+ loading: props.loading,
80
+ loadingContent: props.loadingContent,
79
81
  afterShow: props.afterShow,
80
82
  afterClose: props.afterClose,
81
83
  onClick: props.onClick,
@@ -3,7 +3,7 @@ import './date-picker.less';
3
3
  import { prompt } from './prompt';
4
4
  export type { DatePickerProps, DatePickerRef } from './date-picker';
5
5
  export type { DatePickerFilter } from './date-picker-utils';
6
- declare const _default: import("react").ForwardRefExoticComponent<Pick<import("../picker").PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "closeOnMaskClick" | "cancelText" | "mouseWheel" | "confirmText"> & {
6
+ declare const _default: import("react").ForwardRefExoticComponent<Pick<import("../picker").PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "loading" | "closeOnMaskClick" | "cancelText" | "mouseWheel" | "loadingContent" | "confirmText"> & {
7
7
  value?: Date | null | undefined;
8
8
  defaultValue?: Date | null | undefined;
9
9
  onSelect?: ((value: Date) => void) | undefined;
@@ -2,7 +2,7 @@ import { FC, ReactNode } from 'react';
2
2
  import type { PickerViewProps } from '../picker-view';
3
3
  import { NativeProps } from '../../utils/native-props';
4
4
  import type { Precision, DatePickerFilter } from '../date-picker/date-picker-utils';
5
- export declare type DatePickerViewProps = Pick<PickerViewProps, 'style' | 'mouseWheel'> & {
5
+ export declare type DatePickerViewProps = Pick<PickerViewProps, 'style' | 'mouseWheel' | 'loading' | 'loadingContent'> & {
6
6
  value?: Date;
7
7
  defaultValue?: Date;
8
8
  onChange?: (value: Date) => void;
@@ -52,6 +52,8 @@ const DatePickerView = p => {
52
52
  }, [props.onChange, props.precision]);
53
53
  return (0, _nativeProps.withNativeProps)(props, _react.default.createElement(_pickerView.default, {
54
54
  columns: selected => (0, _datePickerUtils.generateDatePickerColumns)(selected, props.min, props.max, props.precision, props.renderLabel, props.filter),
55
+ loading: props.loading,
56
+ loadingContent: props.loadingContent,
55
57
  value: pickerValue,
56
58
  mouseWheel: props.mouseWheel,
57
59
  onChange: onChange
@@ -52,7 +52,8 @@
52
52
  height: 12px;
53
53
  }
54
54
  .adm-dialog-footer {
55
- user-select: none;
55
+ -webkit-user-select: none;
56
+ user-select: none;
56
57
  }
57
58
  .adm-dialog-footer .adm-dialog-action-row {
58
59
  display: flex;
@@ -1,5 +1,5 @@
1
1
  .adm-dropdown {
2
- background-color: white;
2
+ background-color: var(--adm-color-background);
3
3
  }
4
4
  .adm-dropdown .adm-dropdown-nav {
5
5
  display: flex;
@@ -50,7 +50,7 @@
50
50
  }
51
51
  .adm-dropdown-item-content {
52
52
  width: 100%;
53
- background: white;
53
+ background: var(--adm-color-background);
54
54
  }
55
55
  .adm-dropdown-item-content-hidden {
56
56
  display: none;
@@ -11,6 +11,7 @@
11
11
  }
12
12
  .adm-empty-image-container .adm-empty-image {
13
13
  width: 64px;
14
+ height: intrinsic;
14
15
  }
15
16
  .adm-empty-description {
16
17
  margin-top: 8px;
@@ -39,7 +39,8 @@
39
39
  overflow: hidden;
40
40
  cursor: pointer;
41
41
  transition: opacity ease 0.15s;
42
- user-select: none;
42
+ -webkit-user-select: none;
43
+ user-select: none;
43
44
  touch-action: none;
44
45
  background: var(--background);
45
46
  color: var(--adm-color-white);