@douyinfe/semi-ui 2.12.0 → 2.12.1-alpha.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 (170) hide show
  1. package/avatar/index.tsx +2 -2
  2. package/backtop/index.tsx +11 -7
  3. package/badge/index.tsx +1 -1
  4. package/banner/index.tsx +5 -5
  5. package/breadcrumb/index.tsx +5 -3
  6. package/button/Button.tsx +10 -8
  7. package/card/index.tsx +43 -41
  8. package/carousel/CarouselArrow.tsx +2 -0
  9. package/carousel/index.tsx +1 -0
  10. package/cascader/index.tsx +101 -123
  11. package/cascader/item.tsx +1 -1
  12. package/checkbox/checkbox.tsx +13 -2
  13. package/collapsible/index.tsx +8 -1
  14. package/datePicker/dateInput.tsx +1 -0
  15. package/datePicker/datePicker.tsx +13 -5
  16. package/dist/css/semi.css +40 -40
  17. package/dist/css/semi.min.css +1 -1
  18. package/dist/umd/semi-ui.js +491 -362
  19. package/dist/umd/semi-ui.js.map +1 -1
  20. package/dist/umd/semi-ui.min.js +1 -1
  21. package/dist/umd/semi-ui.min.js.map +1 -1
  22. package/divider/index.tsx +8 -4
  23. package/dropdown/index.tsx +1 -1
  24. package/empty/index.tsx +13 -5
  25. package/form/hoc/withField.tsx +1 -1
  26. package/form/label.tsx +1 -1
  27. package/grid/col.tsx +1 -1
  28. package/grid/row.tsx +1 -1
  29. package/iconButton/index.tsx +2 -1
  30. package/input/index.tsx +38 -11
  31. package/lib/cjs/avatar/index.js +4 -2
  32. package/lib/cjs/backtop/index.js +2 -1
  33. package/lib/cjs/badge/index.js +2 -1
  34. package/lib/cjs/banner/index.js +9 -4
  35. package/lib/cjs/breadcrumb/index.js +4 -3
  36. package/lib/cjs/button/Button.js +13 -3
  37. package/lib/cjs/card/index.js +10 -5
  38. package/lib/cjs/carousel/CarouselArrow.js +6 -2
  39. package/lib/cjs/carousel/index.js +2 -1
  40. package/lib/cjs/cascader/index.js +9 -6
  41. package/lib/cjs/cascader/item.js +2 -1
  42. package/lib/cjs/checkbox/checkbox.js +8 -4
  43. package/lib/cjs/collapsible/index.js +2 -1
  44. package/lib/cjs/datePicker/dateInput.js +2 -1
  45. package/lib/cjs/datePicker/datePicker.js +4 -2
  46. package/lib/cjs/divider/index.js +2 -1
  47. package/lib/cjs/dropdown/index.js +2 -1
  48. package/lib/cjs/empty/index.js +8 -4
  49. package/lib/cjs/form/hoc/withField.js +2 -1
  50. package/lib/cjs/form/label.js +2 -1
  51. package/lib/cjs/grid/col.js +2 -1
  52. package/lib/cjs/grid/row.js +2 -1
  53. package/lib/cjs/iconButton/index.js +3 -1
  54. package/lib/cjs/input/index.js +9 -5
  55. package/lib/cjs/list/index.js +6 -3
  56. package/lib/cjs/modal/ConfirmModal.js +2 -1
  57. package/lib/cjs/modal/Modal.js +6 -2
  58. package/lib/cjs/modal/ModalContent.js +13 -6
  59. package/lib/cjs/modal/confirm.d.ts +5 -5
  60. package/lib/cjs/notification/notice.js +6 -3
  61. package/lib/cjs/pagination/index.js +4 -2
  62. package/lib/cjs/popconfirm/index.js +6 -3
  63. package/lib/cjs/radio/radio.js +4 -2
  64. package/lib/cjs/rating/item.js +2 -1
  65. package/lib/cjs/scrollList/index.js +6 -3
  66. package/lib/cjs/select/index.js +8 -4
  67. package/lib/cjs/select/option.js +2 -1
  68. package/lib/cjs/sideSheet/SideSheetContent.js +6 -3
  69. package/lib/cjs/skeleton/index.js +3 -1
  70. package/lib/cjs/space/index.js +2 -1
  71. package/lib/cjs/spin/index.js +7 -3
  72. package/lib/cjs/switch/index.js +6 -4
  73. package/lib/cjs/table/Table.d.ts +1 -1
  74. package/lib/cjs/table/Table.js +6 -3
  75. package/lib/cjs/tabs/TabBar.js +2 -1
  76. package/lib/cjs/tabs/TabPane.js +5 -2
  77. package/lib/cjs/tagInput/index.js +4 -2
  78. package/lib/cjs/timePicker/Combobox.js +3 -1
  79. package/lib/cjs/toast/toast.js +6 -3
  80. package/lib/cjs/transfer/index.js +2 -1
  81. package/lib/cjs/tree/treeNode.js +2 -1
  82. package/lib/cjs/treeSelect/index.js +6 -3
  83. package/lib/cjs/typography/base.js +2 -1
  84. package/lib/cjs/upload/index.d.ts +1 -1
  85. package/lib/cjs/upload/index.js +13 -6
  86. package/lib/es/avatar/index.js +4 -2
  87. package/lib/es/backtop/index.js +2 -1
  88. package/lib/es/badge/index.js +2 -1
  89. package/lib/es/banner/index.js +9 -4
  90. package/lib/es/breadcrumb/index.js +4 -3
  91. package/lib/es/button/Button.js +11 -3
  92. package/lib/es/card/index.js +10 -5
  93. package/lib/es/carousel/CarouselArrow.js +6 -2
  94. package/lib/es/carousel/index.js +2 -1
  95. package/lib/es/cascader/index.js +9 -6
  96. package/lib/es/cascader/item.js +2 -1
  97. package/lib/es/checkbox/checkbox.js +8 -4
  98. package/lib/es/collapsible/index.js +2 -1
  99. package/lib/es/datePicker/dateInput.js +2 -1
  100. package/lib/es/datePicker/datePicker.js +4 -2
  101. package/lib/es/divider/index.js +2 -1
  102. package/lib/es/dropdown/index.js +2 -1
  103. package/lib/es/empty/index.js +8 -4
  104. package/lib/es/form/hoc/withField.js +2 -1
  105. package/lib/es/form/label.js +2 -1
  106. package/lib/es/grid/col.js +2 -1
  107. package/lib/es/grid/row.js +2 -1
  108. package/lib/es/iconButton/index.js +3 -1
  109. package/lib/es/input/index.js +9 -5
  110. package/lib/es/list/index.js +6 -3
  111. package/lib/es/modal/ConfirmModal.js +2 -1
  112. package/lib/es/modal/Modal.js +6 -2
  113. package/lib/es/modal/ModalContent.js +13 -6
  114. package/lib/es/modal/confirm.d.ts +5 -5
  115. package/lib/es/notification/notice.js +6 -3
  116. package/lib/es/pagination/index.js +4 -2
  117. package/lib/es/popconfirm/index.js +6 -3
  118. package/lib/es/radio/radio.js +4 -2
  119. package/lib/es/rating/item.js +2 -1
  120. package/lib/es/scrollList/index.js +6 -3
  121. package/lib/es/select/index.js +8 -4
  122. package/lib/es/select/option.js +2 -1
  123. package/lib/es/sideSheet/SideSheetContent.js +6 -3
  124. package/lib/es/skeleton/index.js +3 -1
  125. package/lib/es/space/index.js +2 -1
  126. package/lib/es/spin/index.js +7 -3
  127. package/lib/es/switch/index.js +6 -4
  128. package/lib/es/table/Table.d.ts +1 -1
  129. package/lib/es/table/Table.js +6 -3
  130. package/lib/es/tabs/TabBar.js +2 -1
  131. package/lib/es/tabs/TabPane.js +5 -2
  132. package/lib/es/tagInput/index.js +4 -2
  133. package/lib/es/timePicker/Combobox.js +3 -1
  134. package/lib/es/toast/toast.js +6 -3
  135. package/lib/es/transfer/index.js +2 -1
  136. package/lib/es/tree/treeNode.js +2 -1
  137. package/lib/es/treeSelect/index.js +6 -3
  138. package/lib/es/typography/base.js +2 -1
  139. package/lib/es/upload/index.d.ts +1 -1
  140. package/lib/es/upload/index.js +13 -6
  141. package/list/index.tsx +16 -4
  142. package/modal/ConfirmModal.tsx +1 -1
  143. package/modal/Modal.tsx +2 -0
  144. package/modal/ModalContent.tsx +27 -14
  145. package/notification/notice.tsx +16 -4
  146. package/package.json +9 -9
  147. package/pagination/index.tsx +16 -2
  148. package/popconfirm/index.tsx +11 -3
  149. package/radio/radio.tsx +10 -2
  150. package/rating/item.tsx +1 -1
  151. package/scrollList/index.tsx +19 -3
  152. package/select/index.tsx +12 -4
  153. package/select/option.tsx +5 -1
  154. package/sideSheet/SideSheetContent.tsx +3 -3
  155. package/skeleton/index.tsx +1 -1
  156. package/space/index.tsx +1 -1
  157. package/spin/index.tsx +15 -9
  158. package/switch/index.tsx +9 -14
  159. package/table/Table.tsx +5 -3
  160. package/tabs/TabBar.tsx +1 -1
  161. package/tabs/TabPane.tsx +9 -4
  162. package/tagInput/index.tsx +2 -2
  163. package/timePicker/Combobox.tsx +6 -1
  164. package/toast/toast.tsx +3 -3
  165. package/transfer/index.tsx +1 -0
  166. package/tree/treeNode.tsx +1 -1
  167. package/treeSelect/index.tsx +15 -3
  168. package/typography/base.tsx +1 -1
  169. package/upload/index.tsx +107 -38
  170. package/yarn-error.log +26235 -0
package/dist/css/semi.css CHANGED
@@ -1021,82 +1021,82 @@ body[theme-mode=dark], body .semi-always-dark {
1021
1021
 
1022
1022
  .semi-avatar-amber {
1023
1023
  background-color: rgba(var(--semi-amber-3), 1);
1024
- color: white;
1024
+ color: rgb(var(--semi-white));
1025
1025
  }
1026
1026
 
1027
1027
  .semi-avatar-blue {
1028
1028
  background-color: rgba(var(--semi-blue-3), 1);
1029
- color: white;
1029
+ color: rgb(var(--semi-white));
1030
1030
  }
1031
1031
 
1032
1032
  .semi-avatar-cyan {
1033
1033
  background-color: rgba(var(--semi-cyan-3), 1);
1034
- color: white;
1034
+ color: rgb(var(--semi-white));
1035
1035
  }
1036
1036
 
1037
1037
  .semi-avatar-green {
1038
1038
  background-color: rgba(var(--semi-green-3), 1);
1039
- color: white;
1039
+ color: rgb(var(--semi-white));
1040
1040
  }
1041
1041
 
1042
1042
  .semi-avatar-grey {
1043
1043
  background-color: rgba(var(--semi-grey-3), 1);
1044
- color: white;
1044
+ color: rgb(var(--semi-white));
1045
1045
  }
1046
1046
 
1047
1047
  .semi-avatar-indigo {
1048
1048
  background-color: rgba(var(--semi-indigo-3), 1);
1049
- color: white;
1049
+ color: rgb(var(--semi-white));
1050
1050
  }
1051
1051
 
1052
1052
  .semi-avatar-light-blue {
1053
1053
  background-color: rgba(var(--semi-light-blue-3), 1);
1054
- color: white;
1054
+ color: rgb(var(--semi-white));
1055
1055
  }
1056
1056
 
1057
1057
  .semi-avatar-light-green {
1058
1058
  background-color: rgba(var(--semi-light-green-3), 1);
1059
- color: white;
1059
+ color: rgb(var(--semi-white));
1060
1060
  }
1061
1061
 
1062
1062
  .semi-avatar-lime {
1063
1063
  background-color: rgba(var(--semi-lime-3), 1);
1064
- color: white;
1064
+ color: rgb(var(--semi-white));
1065
1065
  }
1066
1066
 
1067
1067
  .semi-avatar-orange {
1068
1068
  background-color: rgba(var(--semi-orange-3), 1);
1069
- color: white;
1069
+ color: rgb(var(--semi-white));
1070
1070
  }
1071
1071
 
1072
1072
  .semi-avatar-pink {
1073
1073
  background-color: rgba(var(--semi-pink-3), 1);
1074
- color: white;
1074
+ color: rgb(var(--semi-white));
1075
1075
  }
1076
1076
 
1077
1077
  .semi-avatar-purple {
1078
1078
  background-color: rgba(var(--semi-purple-3), 1);
1079
- color: white;
1079
+ color: rgb(var(--semi-white));
1080
1080
  }
1081
1081
 
1082
1082
  .semi-avatar-red {
1083
1083
  background-color: rgba(var(--semi-red-3), 1);
1084
- color: white;
1084
+ color: rgb(var(--semi-white));
1085
1085
  }
1086
1086
 
1087
1087
  .semi-avatar-teal {
1088
1088
  background-color: rgba(var(--semi-teal-3), 1);
1089
- color: white;
1089
+ color: rgb(var(--semi-white));
1090
1090
  }
1091
1091
 
1092
1092
  .semi-avatar-violet {
1093
1093
  background-color: rgba(var(--semi-violet-3), 1);
1094
- color: white;
1094
+ color: rgb(var(--semi-white));
1095
1095
  }
1096
1096
 
1097
1097
  .semi-avatar-yellow {
1098
1098
  background-color: rgba(var(--semi-yellow-3), 1);
1099
- color: white;
1099
+ color: rgb(var(--semi-white));
1100
1100
  }
1101
1101
 
1102
1102
  .semi-rtl .semi-avatar,
@@ -1582,7 +1582,7 @@ body[theme-mode=dark], body .semi-always-dark {
1582
1582
  }
1583
1583
  .semi-button-danger {
1584
1584
  background-color: var(--semi-color-danger);
1585
- color: white;
1585
+ color: rgb(var(--semi-white));
1586
1586
  }
1587
1587
  .semi-button-danger:hover {
1588
1588
  background-color: var(--semi-color-danger-hover);
@@ -1598,7 +1598,7 @@ body[theme-mode=dark], body .semi-always-dark {
1598
1598
  }
1599
1599
  .semi-button-warning {
1600
1600
  background-color: var(--semi-color-warning);
1601
- color: white;
1601
+ color: rgb(var(--semi-white));
1602
1602
  }
1603
1603
  .semi-button-warning:hover {
1604
1604
  background-color: var(--semi-color-warning-hover);
@@ -1614,7 +1614,7 @@ body[theme-mode=dark], body .semi-always-dark {
1614
1614
  }
1615
1615
  .semi-button-tertiary {
1616
1616
  background-color: var(--semi-color-tertiary);
1617
- color: white;
1617
+ color: rgb(var(--semi-white));
1618
1618
  }
1619
1619
  .semi-button-tertiary:hover {
1620
1620
  background-color: var(--semi-color-tertiary-hover);
@@ -1627,7 +1627,7 @@ body[theme-mode=dark], body .semi-always-dark {
1627
1627
  }
1628
1628
  .semi-button-primary {
1629
1629
  background-color: var(--semi-color-primary);
1630
- color: white;
1630
+ color: rgb(var(--semi-white));
1631
1631
  }
1632
1632
  .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):hover {
1633
1633
  background-color: var(--semi-color-primary-hover);
@@ -1641,7 +1641,7 @@ body[theme-mode=dark], body .semi-always-dark {
1641
1641
  .semi-button-secondary {
1642
1642
  background-color: var(--semi-color-secondary);
1643
1643
  outline-color: var(--semi-color-secondary);
1644
- color: white;
1644
+ color: rgb(var(--semi-white));
1645
1645
  }
1646
1646
  .semi-button-secondary:hover {
1647
1647
  background-color: var(--semi-color-secondary-hover);
@@ -14431,7 +14431,7 @@ body[theme-mode=dark], body .semi-always-dark {
14431
14431
  .semi-radio .semi-radio-inner-checked .semi-radio-inner-display {
14432
14432
  border: solid 1px var(--semi-color-primary);
14433
14433
  background: var(--semi-color-primary);
14434
- color: white;
14434
+ color: rgb(var(--semi-white));
14435
14435
  border-radius: 16px;
14436
14436
  }
14437
14437
  .semi-radio .semi-radio-inner-checked > .semi-radio-addon {
@@ -16010,7 +16010,7 @@ body[theme-mode=dark], body .semi-always-dark {
16010
16010
  flex-grow: 0;
16011
16011
  }
16012
16012
  .semi-steps .semi-steps-item-left.semi-steps-item-plain {
16013
- color: white;
16013
+ color: rgb(var(--semi-white));
16014
16014
  }
16015
16015
  .semi-steps .semi-steps-item-left-process {
16016
16016
  background: var(--semi-color-primary-light-default);
@@ -16391,7 +16391,7 @@ body[theme-mode=dark], body .semi-always-dark {
16391
16391
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.3);
16392
16392
  cursor: pointer;
16393
16393
  border-radius: 9px;
16394
- background-color: white;
16394
+ background-color: rgb(var(--semi-white));
16395
16395
  box-sizing: border-box;
16396
16396
  position: absolute;
16397
16397
  left: 0;
@@ -17687,7 +17687,7 @@ body[theme-mode=dark], body .semi-always-dark {
17687
17687
 
17688
17688
  .semi-tag-amber-solid {
17689
17689
  background-color: rgba(var(--semi-amber-5), 1);
17690
- color: white;
17690
+ color: rgb(var(--semi-white));
17691
17691
  }
17692
17692
 
17693
17693
  .semi-tag-amber-light {
@@ -17703,7 +17703,7 @@ body[theme-mode=dark], body .semi-always-dark {
17703
17703
 
17704
17704
  .semi-tag-blue-solid {
17705
17705
  background-color: rgba(var(--semi-blue-5), 1);
17706
- color: white;
17706
+ color: rgb(var(--semi-white));
17707
17707
  }
17708
17708
 
17709
17709
  .semi-tag-blue-light {
@@ -17719,7 +17719,7 @@ body[theme-mode=dark], body .semi-always-dark {
17719
17719
 
17720
17720
  .semi-tag-cyan-solid {
17721
17721
  background-color: rgba(var(--semi-cyan-5), 1);
17722
- color: white;
17722
+ color: rgb(var(--semi-white));
17723
17723
  }
17724
17724
 
17725
17725
  .semi-tag-cyan-light {
@@ -17735,7 +17735,7 @@ body[theme-mode=dark], body .semi-always-dark {
17735
17735
 
17736
17736
  .semi-tag-green-solid {
17737
17737
  background-color: rgba(var(--semi-green-5), 1);
17738
- color: white;
17738
+ color: rgb(var(--semi-white));
17739
17739
  }
17740
17740
 
17741
17741
  .semi-tag-green-light {
@@ -17751,7 +17751,7 @@ body[theme-mode=dark], body .semi-always-dark {
17751
17751
 
17752
17752
  .semi-tag-grey-solid {
17753
17753
  background-color: rgba(var(--semi-grey-5), 1);
17754
- color: white;
17754
+ color: rgb(var(--semi-white));
17755
17755
  }
17756
17756
 
17757
17757
  .semi-tag-grey-light {
@@ -17767,7 +17767,7 @@ body[theme-mode=dark], body .semi-always-dark {
17767
17767
 
17768
17768
  .semi-tag-indigo-solid {
17769
17769
  background-color: rgba(var(--semi-indigo-5), 1);
17770
- color: white;
17770
+ color: rgb(var(--semi-white));
17771
17771
  }
17772
17772
 
17773
17773
  .semi-tag-indigo-light {
@@ -17783,7 +17783,7 @@ body[theme-mode=dark], body .semi-always-dark {
17783
17783
 
17784
17784
  .semi-tag-light-blue-solid {
17785
17785
  background-color: rgba(var(--semi-light-blue-5), 1);
17786
- color: white;
17786
+ color: rgb(var(--semi-white));
17787
17787
  }
17788
17788
 
17789
17789
  .semi-tag-light-blue-light {
@@ -17799,7 +17799,7 @@ body[theme-mode=dark], body .semi-always-dark {
17799
17799
 
17800
17800
  .semi-tag-light-green-solid {
17801
17801
  background-color: rgba(var(--semi-light-green-5), 1);
17802
- color: white;
17802
+ color: rgb(var(--semi-white));
17803
17803
  }
17804
17804
 
17805
17805
  .semi-tag-light-green-light {
@@ -17815,7 +17815,7 @@ body[theme-mode=dark], body .semi-always-dark {
17815
17815
 
17816
17816
  .semi-tag-lime-solid {
17817
17817
  background-color: rgba(var(--semi-lime-5), 1);
17818
- color: white;
17818
+ color: rgb(var(--semi-white));
17819
17819
  }
17820
17820
 
17821
17821
  .semi-tag-lime-light {
@@ -17831,7 +17831,7 @@ body[theme-mode=dark], body .semi-always-dark {
17831
17831
 
17832
17832
  .semi-tag-orange-solid {
17833
17833
  background-color: rgba(var(--semi-orange-5), 1);
17834
- color: white;
17834
+ color: rgb(var(--semi-white));
17835
17835
  }
17836
17836
 
17837
17837
  .semi-tag-orange-light {
@@ -17847,7 +17847,7 @@ body[theme-mode=dark], body .semi-always-dark {
17847
17847
 
17848
17848
  .semi-tag-pink-solid {
17849
17849
  background-color: rgba(var(--semi-pink-5), 1);
17850
- color: white;
17850
+ color: rgb(var(--semi-white));
17851
17851
  }
17852
17852
 
17853
17853
  .semi-tag-pink-light {
@@ -17863,7 +17863,7 @@ body[theme-mode=dark], body .semi-always-dark {
17863
17863
 
17864
17864
  .semi-tag-purple-solid {
17865
17865
  background-color: rgba(var(--semi-purple-5), 1);
17866
- color: white;
17866
+ color: rgb(var(--semi-white));
17867
17867
  }
17868
17868
 
17869
17869
  .semi-tag-purple-light {
@@ -17879,7 +17879,7 @@ body[theme-mode=dark], body .semi-always-dark {
17879
17879
 
17880
17880
  .semi-tag-red-solid {
17881
17881
  background-color: rgba(var(--semi-red-5), 1);
17882
- color: white;
17882
+ color: rgb(var(--semi-white));
17883
17883
  }
17884
17884
 
17885
17885
  .semi-tag-red-light {
@@ -17895,7 +17895,7 @@ body[theme-mode=dark], body .semi-always-dark {
17895
17895
 
17896
17896
  .semi-tag-teal-solid {
17897
17897
  background-color: rgba(var(--semi-teal-5), 1);
17898
- color: white;
17898
+ color: rgb(var(--semi-white));
17899
17899
  }
17900
17900
 
17901
17901
  .semi-tag-teal-light {
@@ -17911,7 +17911,7 @@ body[theme-mode=dark], body .semi-always-dark {
17911
17911
 
17912
17912
  .semi-tag-violet-solid {
17913
17913
  background-color: rgba(var(--semi-violet-5), 1);
17914
- color: white;
17914
+ color: rgb(var(--semi-white));
17915
17915
  }
17916
17916
 
17917
17917
  .semi-tag-violet-light {
@@ -17927,7 +17927,7 @@ body[theme-mode=dark], body .semi-always-dark {
17927
17927
 
17928
17928
  .semi-tag-yellow-solid {
17929
17929
  background-color: rgba(var(--semi-yellow-5), 1);
17930
- color: white;
17930
+ color: rgb(var(--semi-white));
17931
17931
  }
17932
17932
 
17933
17933
  .semi-tag-yellow-light {