@arco-design/mobile-react 2.30.4 → 2.30.6

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 (106) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/README.en-US.md +2 -2
  3. package/README.md +2 -2
  4. package/cjs/checkbox/style/css/index.css +3 -0
  5. package/cjs/checkbox/style/index.less +5 -0
  6. package/cjs/date-picker/index.js +46 -29
  7. package/cjs/dialog/style/css/index.css +88 -0
  8. package/cjs/dialog/style/index.less +16 -4
  9. package/cjs/dropdown-menu/helper.d.ts +1 -6
  10. package/cjs/dropdown-menu/helper.js +0 -10
  11. package/cjs/ellipsis/components/js-ellipsis.js +14 -17
  12. package/cjs/ellipsis/index.d.ts +2 -2
  13. package/cjs/ellipsis/index.js +2 -2
  14. package/cjs/image-preview/index.js +1 -0
  15. package/cjs/index-bar/style/css/index.css +28 -5
  16. package/cjs/index-bar/style/index.less +10 -10
  17. package/cjs/pagination/arrow.js +6 -3
  18. package/cjs/pagination/style/css/index.css +21 -6
  19. package/cjs/pagination/style/index.less +9 -9
  20. package/cjs/picker/style/css/index.css +8 -0
  21. package/cjs/picker/style/index.less +2 -2
  22. package/cjs/progress/style/css/index.css +20 -0
  23. package/cjs/progress/style/index.less +5 -5
  24. package/cjs/radio/style/css/index.css +3 -0
  25. package/cjs/radio/style/index.less +5 -0
  26. package/cjs/search-bar/style/css/index.css +18 -0
  27. package/cjs/search-bar/style/index.less +5 -5
  28. package/cjs/show-monitor/index.d.ts +5 -0
  29. package/cjs/show-monitor/index.js +1 -0
  30. package/cjs/slider/hooks/index.d.ts +1 -1
  31. package/cjs/slider/index.d.ts +10 -0
  32. package/cjs/slider/index.js +1 -0
  33. package/cjs/slider/thumb.d.ts +6 -5
  34. package/cjs/slider/thumb.js +19 -20
  35. package/dist/index.js +86 -57
  36. package/dist/index.min.js +2 -2
  37. package/dist/style.css +152 -11
  38. package/dist/style.min.css +1 -1
  39. package/esm/checkbox/style/css/index.css +3 -0
  40. package/esm/checkbox/style/index.less +5 -0
  41. package/esm/date-picker/index.js +44 -26
  42. package/esm/dialog/style/css/index.css +88 -0
  43. package/esm/dialog/style/index.less +16 -4
  44. package/esm/dropdown-menu/helper.d.ts +1 -6
  45. package/esm/dropdown-menu/helper.js +0 -8
  46. package/esm/ellipsis/components/js-ellipsis.js +14 -17
  47. package/esm/ellipsis/index.d.ts +2 -2
  48. package/esm/ellipsis/index.js +2 -2
  49. package/esm/image-preview/index.js +1 -0
  50. package/esm/index-bar/style/css/index.css +28 -5
  51. package/esm/index-bar/style/index.less +10 -10
  52. package/esm/pagination/arrow.js +6 -3
  53. package/esm/pagination/style/css/index.css +21 -6
  54. package/esm/pagination/style/index.less +9 -9
  55. package/esm/picker/style/css/index.css +8 -0
  56. package/esm/picker/style/index.less +2 -2
  57. package/esm/progress/style/css/index.css +20 -0
  58. package/esm/progress/style/index.less +5 -5
  59. package/esm/radio/style/css/index.css +3 -0
  60. package/esm/radio/style/index.less +5 -0
  61. package/esm/search-bar/style/css/index.css +18 -0
  62. package/esm/search-bar/style/index.less +5 -5
  63. package/esm/show-monitor/index.d.ts +5 -0
  64. package/esm/show-monitor/index.js +1 -0
  65. package/esm/slider/hooks/index.d.ts +1 -1
  66. package/esm/slider/index.d.ts +10 -0
  67. package/esm/slider/index.js +1 -0
  68. package/esm/slider/thumb.d.ts +6 -5
  69. package/esm/slider/thumb.js +19 -17
  70. package/package.json +3 -3
  71. package/tokens/app/arcodesign/default/css-variables.less +3 -4
  72. package/tokens/app/arcodesign/default/index.d.ts +0 -1
  73. package/tokens/app/arcodesign/default/index.js +3 -4
  74. package/tokens/app/arcodesign/default/index.json +9 -21
  75. package/tokens/app/arcodesign/default/index.less +3 -4
  76. package/umd/checkbox/style/css/index.css +3 -0
  77. package/umd/checkbox/style/index.less +5 -0
  78. package/umd/date-picker/index.js +47 -30
  79. package/umd/dialog/style/css/index.css +88 -0
  80. package/umd/dialog/style/index.less +16 -4
  81. package/umd/dropdown-menu/helper.d.ts +1 -6
  82. package/umd/dropdown-menu/helper.js +0 -10
  83. package/umd/ellipsis/components/js-ellipsis.js +14 -17
  84. package/umd/ellipsis/index.d.ts +2 -2
  85. package/umd/ellipsis/index.js +2 -2
  86. package/umd/image-preview/index.js +1 -0
  87. package/umd/index-bar/style/css/index.css +28 -5
  88. package/umd/index-bar/style/index.less +10 -10
  89. package/umd/pagination/arrow.js +6 -3
  90. package/umd/pagination/style/css/index.css +21 -6
  91. package/umd/pagination/style/index.less +9 -9
  92. package/umd/picker/style/css/index.css +8 -0
  93. package/umd/picker/style/index.less +2 -2
  94. package/umd/progress/style/css/index.css +20 -0
  95. package/umd/progress/style/index.less +5 -5
  96. package/umd/radio/style/css/index.css +3 -0
  97. package/umd/radio/style/index.less +5 -0
  98. package/umd/search-bar/style/css/index.css +18 -0
  99. package/umd/search-bar/style/index.less +5 -5
  100. package/umd/show-monitor/index.d.ts +5 -0
  101. package/umd/show-monitor/index.js +1 -0
  102. package/umd/slider/hooks/index.d.ts +1 -1
  103. package/umd/slider/index.d.ts +10 -0
  104. package/umd/slider/index.js +1 -0
  105. package/umd/slider/thumb.d.ts +6 -5
  106. package/umd/slider/thumb.js +23 -23
package/dist/style.css CHANGED
@@ -10191,6 +10191,9 @@ samp {
10191
10191
  display: inline-flex;
10192
10192
  align-items: center;
10193
10193
  }
10194
+ .arco-checkbox:focus {
10195
+ outline: none;
10196
+ }
10194
10197
  .arco-checkbox .checkbox-icon {
10195
10198
  display: inline-flex;
10196
10199
  align-items: center;
@@ -13018,10 +13021,18 @@ samp {
13018
13021
  left: 0;
13019
13022
  color: #165DFF ;
13020
13023
  }
13024
+ [dir="rtl"] .arco-picker-header-btn.left {
13025
+ left: initial;
13026
+ right: 0;
13027
+ }
13021
13028
  .arco-picker-header-btn.right {
13022
13029
  right: 0;
13023
13030
  color: #165DFF ;
13024
13031
  }
13032
+ [dir="rtl"] .arco-picker-header-btn.right {
13033
+ right: initial;
13034
+ left: 0;
13035
+ }
13025
13036
 
13026
13037
  /**
13027
13038
  * @type mixin-var
@@ -14141,6 +14152,10 @@ samp {
14141
14152
  .arco-dialog-body.left {
14142
14153
  text-align: left;
14143
14154
  }
14155
+ [dir="rtl"] .arco-dialog-header.left,
14156
+ [dir="rtl"] .arco-dialog-body.left {
14157
+ text-align: right;
14158
+ }
14144
14159
  .arco-dialog-header.center,
14145
14160
  .arco-dialog-body.center {
14146
14161
  text-align: center;
@@ -14149,6 +14164,10 @@ samp {
14149
14164
  .arco-dialog-body.right {
14150
14165
  text-align: right;
14151
14166
  }
14167
+ [dir="rtl"] .arco-dialog-header.right,
14168
+ [dir="rtl"] .arco-dialog-body.right {
14169
+ text-align: left;
14170
+ }
14152
14171
  .arco-dialog-header.android,
14153
14172
  .arco-dialog-body.sub-title.android {
14154
14173
  padding-top: 0.4rem ;
@@ -14173,6 +14192,9 @@ samp {
14173
14192
  justify-content: flex-end;
14174
14193
  text-align: right;
14175
14194
  }
14195
+ [dir="rtl"] .arco-dialog-footer.android {
14196
+ text-align: left;
14197
+ }
14176
14198
  .arco-dialog-footer.android .dialog-footer-button {
14177
14199
  color: #1a74ff ;
14178
14200
  font-size: 0.3rem ;
@@ -14181,6 +14203,10 @@ samp {
14181
14203
  .arco-dialog-footer.android .dialog-footer-button:not(:last-child) {
14182
14204
  margin-right: 0.56rem ;
14183
14205
  }
14206
+ [dir="rtl"] .arco-dialog-footer.android .dialog-footer-button:not(:last-child) {
14207
+ margin-right: initial;
14208
+ margin-left: 0.56rem ;
14209
+ }
14184
14210
  .arco-dialog-footer.ios {
14185
14211
  overflow: hidden;
14186
14212
  }
@@ -14265,6 +14291,44 @@ samp {
14265
14291
  border-radius: 0;
14266
14292
  }
14267
14293
  }
14294
+ [dir='rtl'] .arco-dialog-footer.ios:not(.collapsed):not(.type-button) .dialog-footer-button:not(:last-child) {
14295
+ position: relative;
14296
+ border-width: 0;
14297
+ }
14298
+ [dir='rtl'] .arco-dialog-footer.ios:not(.collapsed):not(.type-button) .dialog-footer-button:not(:last-child)::before {
14299
+ content: '';
14300
+ width: 1PX;
14301
+ height: 100%;
14302
+ position: absolute;
14303
+ left: 0;
14304
+ top: 0;
14305
+ z-index: 1;
14306
+ border-left-style: solid;
14307
+ border-left-width: 1PX;
14308
+ border-left-color: #e5e6eb;
14309
+ box-sizing: border-box;
14310
+ transform-origin: left top;
14311
+ -webkit-transform-origin: left top;
14312
+ pointer-events: none;
14313
+ border-radius: 0;
14314
+ }
14315
+ @media (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) {
14316
+ [dir='rtl'] .arco-dialog-footer.ios:not(.collapsed):not(.type-button) .dialog-footer-button:not(:last-child)::before {
14317
+ transform: scaleX(0.5);
14318
+ -webkit-transform: scaleX(0.5);
14319
+ border-radius: 0;
14320
+ }
14321
+ }
14322
+ @media (-webkit-min-device-pixel-ratio: 3), (min-device-pixel-ratio: 3) {
14323
+ [dir='rtl'] .arco-dialog-footer.ios:not(.collapsed):not(.type-button) .dialog-footer-button:not(:last-child)::before {
14324
+ transform: scaleX(0.33333333);
14325
+ -webkit-transform: scaleX(0.33333333);
14326
+ border-radius: 0;
14327
+ }
14328
+ }
14329
+ [dir='rtl'] .arco-dialog-footer.ios:not(.collapsed):not(.type-button) .dialog-footer-button:not(:last-child)::after {
14330
+ display: none;
14331
+ }
14268
14332
  .arco-dialog-footer.ios.collapsed {
14269
14333
  flex-direction: column;
14270
14334
  }
@@ -19523,6 +19587,10 @@ samp {
19523
19587
  display: flex;
19524
19588
  align-items: center;
19525
19589
  }
19590
+ [dir="rtl"] .arco-index-bar-group-title {
19591
+ padding-left: initial;
19592
+ padding-right: 0.32rem ;
19593
+ }
19526
19594
  .arco-index-bar-group-item {
19527
19595
  height: 1.08rem ;
19528
19596
  display: flex;
@@ -19530,6 +19598,10 @@ samp {
19530
19598
  margin-left: 0.32rem ;
19531
19599
  font-size: 0.32rem ;
19532
19600
  }
19601
+ [dir="rtl"] .arco-index-bar-group-item {
19602
+ margin-left: initial;
19603
+ margin-right: 0.32rem ;
19604
+ }
19533
19605
  .arco-index-bar-group-item:not(:last-child) {
19534
19606
  position: relative;
19535
19607
  border-width: 0;
@@ -19575,9 +19647,13 @@ samp {
19575
19647
  -moz-user-select: none;
19576
19648
  user-select: none;
19577
19649
  }
19578
- .arco-index-bar-sidebar-touching {
19650
+ [dir="rtl"] .arco-index-bar-sidebar {
19651
+ right: initial;
19579
19652
  left: 0;
19580
19653
  }
19654
+ .arco-index-bar-sidebar-touching {
19655
+ width: 100%;
19656
+ }
19581
19657
  .arco-index-bar-sidebar-item {
19582
19658
  display: flex;
19583
19659
  justify-content: flex-end;
@@ -19608,25 +19684,36 @@ samp {
19608
19684
  border-radius: 9999px;
19609
19685
  text-align: center;
19610
19686
  padding: 0 0.16rem ;
19611
- background: rgba(0, 0, 0, 0.8) ;
19687
+ background: #333333 ;
19612
19688
  right: 0.72rem ;
19613
19689
  font-size: 0.48rem ;
19614
19690
  color: #FFFFFF ;
19615
19691
  }
19692
+ [dir="rtl"] .arco-index-bar-sidebar-sweat {
19693
+ right: initial;
19694
+ left: 0.72rem ;
19695
+ }
19616
19696
  .arco-index-bar-sidebar-sweat::before {
19617
19697
  content: '';
19618
19698
  position: absolute;
19619
19699
  top: 0;
19620
19700
  bottom: 0;
19621
19701
  margin: auto;
19622
- right: -0.54rem ;
19702
+ right: -0.56rem ;
19623
19703
  width: 0;
19624
19704
  height: 0;
19625
19705
  border: 0.36rem solid transparent ;
19626
- border: 18px solid transparent;
19627
- border-left-color: rgba(0, 0, 0, 0.8) ;
19706
+ border-left-color: #333333 ;
19628
19707
  border-radius: 4px;
19629
19708
  }
19709
+ [dir="rtl"] .arco-index-bar-sidebar-sweat::before {
19710
+ right: initial;
19711
+ left: -0.56rem ;
19712
+ }
19713
+ [dir="rtl"] .arco-index-bar-sidebar-sweat::before {
19714
+ border-left-color: initial;
19715
+ border-right-color: #333333 ;
19716
+ }
19630
19717
  .arco-index-bar-sidebar-toast {
19631
19718
  position: absolute;
19632
19719
  background: rgba(0, 0, 0, 0.8) ;
@@ -23646,6 +23733,10 @@ samp {
23646
23733
  justify-content: flex-end;
23647
23734
  margin-right: 0.48rem ;
23648
23735
  }
23736
+ [dir="rtl"] .arco-pagination-prev-field.flex-center {
23737
+ margin-right: initial;
23738
+ margin-left: 0.48rem ;
23739
+ }
23649
23740
  .arco-pagination-next-field {
23650
23741
  justify-content: flex-end;
23651
23742
  }
@@ -23653,6 +23744,10 @@ samp {
23653
23744
  justify-content: flex-start;
23654
23745
  margin-left: 0.48rem ;
23655
23746
  }
23747
+ [dir="rtl"] .arco-pagination-next-field.flex-center {
23748
+ margin-left: initial;
23749
+ margin-right: 0.48rem ;
23750
+ }
23656
23751
  .arco-pagination-field {
23657
23752
  cursor: pointer;
23658
23753
  text-align: center;
@@ -23678,9 +23773,15 @@ samp {
23678
23773
  display: inline-flex;
23679
23774
  align-items: center;
23680
23775
  }
23776
+ [dir="rtl"] .arco-pagination-field .btn-icon {
23777
+ transform: scaleX(-1);
23778
+ }
23681
23779
  .arco-pagination-field .btn-icon.next {
23682
23780
  transform: rotateY(180deg);
23683
23781
  }
23782
+ [dir="rtl"] .arco-pagination-field .btn-icon.next {
23783
+ transform: none;
23784
+ }
23684
23785
  .arco-pagination-field.button {
23685
23786
  padding: 0.12rem 0.32rem ;
23686
23787
  border-radius: 0.04rem ;
@@ -23697,13 +23798,12 @@ samp {
23697
23798
  }
23698
23799
  .arco-pagination-field.button .btn-icon + .btn-text,
23699
23800
  .arco-pagination-field.button .btn-text + .btn-icon {
23700
- margin-left: 0.16rem ;
23701
- }
23702
- .arco-pagination-field.button .btn-icon:first-child {
23703
- margin-left: -0.06rem ;
23801
+ margin-left: 0.22rem ;
23704
23802
  }
23705
- .arco-pagination-field.button .btn-icon:last-child {
23706
- margin-right: -0.06rem ;
23803
+ [dir="rtl"] .arco-pagination-field.button .btn-icon + .btn-text,
23804
+ [dir="rtl"] .arco-pagination-field.button .btn-text + .btn-icon {
23805
+ margin-left: initial;
23806
+ margin-right: 0.22rem ;
23707
23807
  }
23708
23808
  .arco-pagination.android .arco-pagination-field.button .btn-text {
23709
23809
  padding-top: 0.04rem;
@@ -25572,6 +25672,10 @@ samp {
25572
25672
  left: 0;
25573
25673
  z-index: 1001;
25574
25674
  }
25675
+ [dir="rtl"] .arco-progress.progress-fixed {
25676
+ left: initial;
25677
+ right: 0;
25678
+ }
25575
25679
  .arco-progress .progress-wrapper {
25576
25680
  position: relative;
25577
25681
  width: 100%;
@@ -25603,6 +25707,10 @@ samp {
25603
25707
  top: 50%;
25604
25708
  transform: translateY(-50%);
25605
25709
  }
25710
+ [dir="rtl"] .arco-progress .progress-wrapper .progress-bar .wrapper {
25711
+ right: initial;
25712
+ left: 0;
25713
+ }
25606
25714
  .arco-progress .progress-wrapper .filleted {
25607
25715
  border-radius: 100PX;
25608
25716
  }
@@ -25611,10 +25719,22 @@ samp {
25611
25719
  margin-left: 0.16rem ;
25612
25720
  color: #165DFF ;
25613
25721
  }
25722
+ [dir="rtl"] .arco-progress .progress-wrapper .text {
25723
+ margin-left: initial;
25724
+ margin-right: 0.16rem ;
25725
+ }
25614
25726
  .arco-progress .progress-wrapper .text-left {
25615
25727
  margin-left: 0;
25616
25728
  margin-right: 0.16rem ;
25617
25729
  }
25730
+ [dir="rtl"] .arco-progress .progress-wrapper .text-left {
25731
+ margin-left: initial;
25732
+ margin-right: 0;
25733
+ }
25734
+ [dir="rtl"] .arco-progress .progress-wrapper .text-left {
25735
+ margin-right: initial;
25736
+ margin-left: 0.16rem ;
25737
+ }
25618
25738
  .arco-progress .progress-wrapper .text-innerLeft {
25619
25739
  position: absolute;
25620
25740
  z-index: 1;
@@ -26745,6 +26865,9 @@ samp {
26745
26865
  display: inline-flex;
26746
26866
  align-items: center;
26747
26867
  }
26868
+ .arco-radio:focus {
26869
+ outline: none;
26870
+ }
26748
26871
  .arco-radio .radio-icon {
26749
26872
  display: inline-flex;
26750
26873
  align-items: center;
@@ -27867,9 +27990,15 @@ samp {
27867
27990
  .arco-search-bar-input-left {
27868
27991
  text-align: left;
27869
27992
  }
27993
+ [dir="rtl"] .arco-search-bar-input-left {
27994
+ text-align: right;
27995
+ }
27870
27996
  .arco-search-bar-input-right {
27871
27997
  text-align: right;
27872
27998
  }
27999
+ [dir="rtl"] .arco-search-bar-input-right {
28000
+ text-align: left;
28001
+ }
27873
28002
  .arco-search-bar-input-center {
27874
28003
  text-align: center;
27875
28004
  }
@@ -27893,11 +28022,19 @@ samp {
27893
28022
  .arco-search-bar-prefix {
27894
28023
  margin-right: 0.18rem ;
27895
28024
  }
28025
+ [dir="rtl"] .arco-search-bar-prefix {
28026
+ margin-right: initial;
28027
+ margin-left: 0.18rem ;
28028
+ }
27896
28029
  .arco-search-bar-clear {
27897
28030
  color: #c9cdd4 ;
27898
28031
  font-size: 16PX ;
27899
28032
  padding-left: 0.32rem ;
27900
28033
  }
28034
+ [dir="rtl"] .arco-search-bar-clear {
28035
+ padding-left: initial;
28036
+ padding-right: 0.32rem ;
28037
+ }
27901
28038
  .arco-search-bar-search-icon {
27902
28039
  color: #86909c ;
27903
28040
  font-size: 0.32rem ;
@@ -27907,6 +28044,10 @@ samp {
27907
28044
  color: #165DFF ;
27908
28045
  font-size: 0.3rem ;
27909
28046
  }
28047
+ [dir="rtl"] .arco-search-bar-cancel-btn {
28048
+ margin-left: initial;
28049
+ margin-right: 0.32rem ;
28050
+ }
27910
28051
  .arco-search-bar-association {
27911
28052
  position: absolute;
27912
28053
  left: 0;