@nutui/nutui-react 3.0.0-beta.1 → 3.0.0-beta.11

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 (628) hide show
  1. package/README.md +39 -9
  2. package/dist/cjs/packages/actionsheet/actionsheet.js +6 -3
  3. package/dist/cjs/packages/actionsheet/style/actionsheet.scss +10 -4
  4. package/dist/cjs/packages/actionsheet/style/style.css +58 -84
  5. package/dist/cjs/packages/address/address.js +9 -6
  6. package/dist/cjs/packages/address/style/style.css +126 -193
  7. package/dist/cjs/packages/animate/style/animate.scss +0 -3
  8. package/dist/cjs/packages/animate/style/style.css +4 -3
  9. package/dist/cjs/packages/animatingnumbers/countup.js +7 -6
  10. package/dist/cjs/packages/animatingnumbers/style/style.css +16 -6
  11. package/dist/cjs/packages/audio/style/style.css +123 -97
  12. package/dist/cjs/packages/avatar/style/avatar.scss +7 -60
  13. package/dist/cjs/packages/avatar/style/style.css +11 -45
  14. package/dist/cjs/packages/avatarcropper/style/style.css +4 -0
  15. package/dist/cjs/packages/avatargroup/style/style.css +4 -0
  16. package/dist/cjs/packages/backtop/backtop.d.ts +2 -2
  17. package/dist/cjs/packages/backtop/backtop.js +14 -21
  18. package/dist/cjs/packages/backtop/style/backtop.scss +8 -17
  19. package/dist/cjs/packages/backtop/style/index.js +2 -0
  20. package/dist/cjs/packages/backtop/style/style.css +141 -14
  21. package/dist/cjs/packages/badge/badge.d.ts +2 -12
  22. package/dist/cjs/packages/badge/badge.js +14 -23
  23. package/dist/cjs/packages/badge/index.d.ts +1 -1
  24. package/dist/cjs/packages/badge/style/badge.scss +62 -41
  25. package/dist/cjs/packages/badge/style/style.css +70 -41
  26. package/dist/cjs/packages/badge/types.d.ts +12 -0
  27. package/dist/cjs/packages/badge/types.js +4 -0
  28. package/dist/cjs/packages/barrage/style/style.css +6 -2
  29. package/dist/cjs/packages/button/style/button.scss +48 -23
  30. package/dist/cjs/packages/button/style/style.css +110 -84
  31. package/dist/cjs/packages/calendar/style/style.css +56 -89
  32. package/dist/cjs/packages/calendarcard/calendarcard.js +8 -3
  33. package/dist/cjs/packages/calendarcard/style/calendarcard.scss +25 -4
  34. package/dist/cjs/packages/calendarcard/style/style.css +40 -11
  35. package/dist/cjs/packages/calendaritem/style/style.css +4 -0
  36. package/dist/cjs/packages/card/style/card.scss +3 -18
  37. package/dist/cjs/packages/card/style/style.css +50 -36
  38. package/dist/cjs/packages/cascader/cascader.js +1 -1
  39. package/dist/cjs/packages/cascader/style/style.css +108 -178
  40. package/dist/cjs/packages/cell/cell.d.ts +2 -12
  41. package/dist/cjs/packages/cell/index.d.ts +1 -1
  42. package/dist/cjs/packages/cell/style/style.css +14 -10
  43. package/dist/cjs/packages/cell/types.d.ts +12 -0
  44. package/dist/cjs/packages/cell/types.js +4 -0
  45. package/dist/cjs/packages/cellgroup/style/style.css +7 -3
  46. package/dist/cjs/packages/checkbox/checkbox.d.ts +1 -4
  47. package/dist/cjs/packages/checkbox/checkbox.js +0 -2
  48. package/dist/cjs/packages/checkbox/index.d.ts +7 -2
  49. package/dist/cjs/packages/checkbox/index.js +4 -1
  50. package/dist/cjs/packages/checkbox/style/checkbox.scss +5 -0
  51. package/dist/cjs/packages/checkbox/style/style.css +48 -29
  52. package/dist/cjs/packages/checkboxgroup/style/checkboxgroup.scss +8 -0
  53. package/dist/cjs/packages/checkboxgroup/style/style.css +21 -7
  54. package/dist/cjs/packages/circleprogress/style/style.css +7 -3
  55. package/dist/cjs/packages/col/style/style.css +4 -0
  56. package/dist/cjs/packages/collapse/style/style.css +15 -11
  57. package/dist/cjs/packages/collapseitem/style/style.css +15 -11
  58. package/dist/cjs/packages/configprovider/style/style.css +4 -0
  59. package/dist/cjs/packages/configprovider/types.d.ts +1 -1
  60. package/dist/cjs/packages/countdown/countdown.d.ts +2 -20
  61. package/dist/cjs/packages/countdown/countdown.js +3 -2
  62. package/dist/cjs/packages/countdown/index.d.ts +1 -1
  63. package/dist/cjs/packages/countdown/style/countdown.scss +29 -4
  64. package/dist/cjs/packages/countdown/style/style.css +44 -17
  65. package/dist/cjs/packages/countdown/types.d.ts +26 -0
  66. package/dist/cjs/packages/countdown/types.js +4 -0
  67. package/dist/cjs/packages/countup/style/countup.scss +11 -5
  68. package/dist/cjs/packages/countup/style/style.css +16 -6
  69. package/dist/cjs/packages/datepicker/style/style.css +52 -85
  70. package/dist/cjs/packages/dialog/dialog.js +16 -6
  71. package/dist/cjs/packages/dialog/style/dialog.scss +37 -21
  72. package/dist/cjs/packages/dialog/style/style.css +152 -112
  73. package/dist/cjs/packages/divider/style/style.css +8 -4
  74. package/dist/cjs/packages/drag/style/style.css +4 -0
  75. package/dist/cjs/packages/elevator/style/elevator.scss +7 -4
  76. package/dist/cjs/packages/elevator/style/style.css +18 -11
  77. package/dist/cjs/packages/ellipsis/style/style.css +4 -0
  78. package/dist/cjs/packages/empty/empty.js +1 -1
  79. package/dist/cjs/packages/empty/style/empty.scss +9 -5
  80. package/dist/cjs/packages/empty/style/style.css +18 -9
  81. package/dist/cjs/packages/fixednav/style/style.css +13 -9
  82. package/dist/cjs/packages/form/style/style.css +23 -17
  83. package/dist/cjs/packages/formitem/style/formitem.scss +2 -0
  84. package/dist/cjs/packages/formitem/style/style.css +10 -4
  85. package/dist/cjs/packages/grid/grid.js +2 -6
  86. package/dist/cjs/packages/grid/style/grid.scss +2 -2
  87. package/dist/cjs/packages/grid/style/style.css +19 -13
  88. package/dist/cjs/packages/griditem/griditem.js +12 -6
  89. package/dist/cjs/packages/griditem/style/griditem.scss +6 -4
  90. package/dist/cjs/packages/griditem/style/style.css +16 -10
  91. package/dist/cjs/packages/hoverbutton/hoverbutton.js +2 -1
  92. package/dist/cjs/packages/hoverbutton/style/style.css +40 -15
  93. package/dist/cjs/packages/hoverbutton/utils.d.ts +1 -0
  94. package/dist/cjs/packages/hoverbutton/utils.js +11 -0
  95. package/dist/cjs/packages/hoverbuttonitem/hoverbuttonitem.js +17 -8
  96. package/dist/cjs/packages/hoverbuttonitem/style/hoverbuttonitem.scss +28 -3
  97. package/dist/cjs/packages/hoverbuttonitem/style/style.css +36 -11
  98. package/dist/cjs/packages/hoverbuttonitem/utils.d.ts +2 -0
  99. package/dist/cjs/packages/hoverbuttonitem/utils.js +18 -0
  100. package/dist/cjs/packages/image/style/style.css +6 -2
  101. package/dist/cjs/packages/imagepreview/style/imagepreview.scss +11 -0
  102. package/dist/cjs/packages/imagepreview/style/style.css +153 -98
  103. package/dist/cjs/packages/indicator/indicator.d.ts +4 -0
  104. package/dist/cjs/packages/indicator/indicator.js +39 -10
  105. package/dist/cjs/packages/indicator/style/indicator.scss +127 -14
  106. package/dist/cjs/packages/indicator/style/style.css +103 -22
  107. package/dist/cjs/packages/infiniteloading/style/infiniteloading.scss +1 -1
  108. package/dist/cjs/packages/infiniteloading/style/style.css +8 -4
  109. package/dist/cjs/packages/input/input.d.ts +1 -0
  110. package/dist/cjs/packages/input/input.js +7 -3
  111. package/dist/cjs/packages/input/style/input.scss +27 -12
  112. package/dist/cjs/packages/input/style/style.css +25 -11
  113. package/dist/cjs/packages/inputnumber/style/inputnumber.scss +19 -16
  114. package/dist/cjs/packages/inputnumber/style/style.css +26 -20
  115. package/dist/cjs/packages/layout/style/style.css +4 -0
  116. package/dist/cjs/packages/loading/index.d.ts +1 -1
  117. package/dist/cjs/packages/loading/loading.d.ts +3 -10
  118. package/dist/cjs/packages/loading/loading.js +45 -12
  119. package/dist/cjs/packages/loading/style/loading.scss +7 -1
  120. package/dist/cjs/packages/loading/style/style.css +13 -3
  121. package/dist/cjs/packages/loading/types.d.ts +13 -0
  122. package/dist/cjs/packages/loading/types.js +4 -0
  123. package/dist/cjs/packages/lottie/index.d.ts +3 -0
  124. package/dist/cjs/packages/{popup/index.rn.js → lottie/index.js} +2 -2
  125. package/dist/cjs/packages/lottie/style/css.js +1 -0
  126. package/dist/cjs/packages/lottie/style/index.js +1 -0
  127. package/dist/cjs/packages/lottie/style/lottie.scss +0 -0
  128. package/dist/cjs/packages/lottie/style/style.css +4 -0
  129. package/dist/cjs/packages/lottie/types.d.ts +11 -0
  130. package/dist/cjs/packages/lottie/types.js +6 -0
  131. package/dist/cjs/packages/lottie/web.d.ts +3 -0
  132. package/dist/cjs/packages/lottie/web.js +34 -0
  133. package/dist/cjs/packages/menu/style/style.css +18 -14
  134. package/dist/cjs/packages/menuitem/style/style.css +14 -10
  135. package/dist/cjs/packages/navbar/navbar.d.ts +1 -1
  136. package/dist/cjs/packages/navbar/navbar.js +20 -65
  137. package/dist/cjs/packages/navbar/style/navbar.scss +48 -111
  138. package/dist/cjs/packages/navbar/style/style.css +50 -105
  139. package/dist/cjs/packages/noticebar/style/style.css +4 -0
  140. package/dist/cjs/packages/notify/style/style.css +8 -4
  141. package/dist/cjs/packages/numberkeyboard/style/numberkeyboard.scss +10 -1
  142. package/dist/cjs/packages/numberkeyboard/style/style.css +62 -83
  143. package/dist/cjs/packages/nutui.react.build.d.ts +7 -1
  144. package/dist/cjs/packages/nutui.react.build.js +12 -0
  145. package/dist/cjs/packages/nutui.react.d.ts +10 -1
  146. package/dist/cjs/packages/nutui.react.js +15 -0
  147. package/dist/cjs/packages/nutui.react.scss.d.ts +3 -0
  148. package/dist/cjs/packages/nutui.react.scss.js +3 -0
  149. package/dist/cjs/packages/overlay/style/overlay.scss +6 -6
  150. package/dist/cjs/packages/overlay/style/style.css +11 -7
  151. package/dist/cjs/packages/pagination/pagination.js +2 -0
  152. package/dist/cjs/packages/pagination/style/pagination.scss +6 -12
  153. package/dist/cjs/packages/pagination/style/style.css +20 -22
  154. package/dist/cjs/packages/picker/style/style.css +52 -85
  155. package/dist/cjs/packages/popover/popover.js +17 -14
  156. package/dist/cjs/packages/popover/style/popover.scss +47 -65
  157. package/dist/cjs/packages/popover/style/style.css +93 -136
  158. package/dist/cjs/packages/popup/popup.js +24 -23
  159. package/dist/cjs/packages/popup/style/popup.scss +24 -59
  160. package/dist/cjs/packages/popup/style/style.css +41 -74
  161. package/dist/cjs/packages/price/index.d.ts +1 -1
  162. package/dist/cjs/packages/price/price.d.ts +1 -10
  163. package/dist/cjs/packages/price/price.js +9 -9
  164. package/dist/cjs/packages/price/style/price.scss +49 -9
  165. package/dist/cjs/packages/price/style/style.css +39 -16
  166. package/dist/cjs/packages/price/types.d.ts +13 -0
  167. package/dist/cjs/packages/price/types.js +4 -0
  168. package/dist/cjs/packages/progress/progress.js +1 -1
  169. package/dist/cjs/packages/progress/style/progress.scss +2 -2
  170. package/dist/cjs/packages/progress/style/style.css +9 -4
  171. package/dist/cjs/packages/pulltorefresh/pulltorefresh.js +1 -1
  172. package/dist/cjs/packages/pulltorefresh/style/pulltorefresh.scss +1 -1
  173. package/dist/cjs/packages/pulltorefresh/style/style.css +6 -2
  174. package/dist/cjs/packages/radio/index.d.ts +8 -2
  175. package/dist/cjs/packages/radio/index.js +6 -1
  176. package/dist/cjs/packages/radio/radio.d.ts +1 -4
  177. package/dist/cjs/packages/radio/radio.js +0 -2
  178. package/dist/cjs/packages/radio/style/radio.scss +4 -0
  179. package/dist/cjs/packages/radio/style/style.css +26 -19
  180. package/dist/cjs/packages/radiogroup/radiogroup.js +1 -1
  181. package/dist/cjs/packages/radiogroup/style/style.css +10 -6
  182. package/dist/cjs/packages/range/style/style.css +14 -10
  183. package/dist/cjs/packages/rate/index.d.ts +1 -1
  184. package/dist/cjs/packages/rate/rate.d.ts +2 -16
  185. package/dist/cjs/packages/rate/rate.js +7 -3
  186. package/dist/cjs/packages/rate/style/rate.scss +101 -10
  187. package/dist/cjs/packages/rate/style/style.css +89 -9
  188. package/dist/cjs/packages/rate/types.d.ts +18 -0
  189. package/dist/cjs/packages/rate/types.js +4 -0
  190. package/dist/cjs/packages/resultpage/resultpage.js +23 -17
  191. package/dist/cjs/packages/resultpage/style/resultpage.scss +5 -3
  192. package/dist/cjs/packages/resultpage/style/style.css +16 -10
  193. package/dist/cjs/packages/resultpage/types.d.ts +1 -1
  194. package/dist/cjs/packages/row/style/style.css +4 -0
  195. package/dist/cjs/packages/safearea/style/safearea.scss +1 -1
  196. package/dist/cjs/packages/safearea/style/style.css +5 -1
  197. package/dist/cjs/packages/searchbar/style/searchbar.scss +10 -7
  198. package/dist/cjs/packages/searchbar/style/style.css +20 -13
  199. package/dist/cjs/packages/segmented/index.d.ts +3 -0
  200. package/dist/cjs/packages/segmented/index.js +12 -0
  201. package/dist/cjs/packages/segmented/segmented.d.ts +3 -0
  202. package/dist/cjs/packages/segmented/segmented.js +75 -0
  203. package/dist/cjs/packages/segmented/style/css.js +1 -0
  204. package/dist/cjs/packages/segmented/style/index.js +1 -0
  205. package/dist/cjs/packages/segmented/style/segmented.scss +38 -0
  206. package/dist/cjs/packages/segmented/style/style.css +42 -0
  207. package/dist/cjs/packages/segmented/types.d.ts +15 -0
  208. package/dist/cjs/packages/segmented/types.js +4 -0
  209. package/dist/cjs/packages/shortpassword/style/style.css +52 -85
  210. package/dist/cjs/packages/sidebar/index.d.ts +3 -0
  211. package/dist/cjs/packages/sidebar/index.js +12 -0
  212. package/dist/cjs/packages/sidebar/sidebar.d.ts +6 -0
  213. package/dist/cjs/packages/sidebar/sidebar.js +173 -0
  214. package/dist/cjs/packages/sidebar/style/css.js +1 -0
  215. package/dist/cjs/packages/sidebar/style/index.js +3 -0
  216. package/dist/cjs/packages/sidebar/style/sidebar.scss +61 -0
  217. package/dist/cjs/packages/sidebar/style/style.css +79 -0
  218. package/dist/cjs/packages/sidebar/types.d.ts +16 -0
  219. package/dist/cjs/packages/sidebar/types.js +4 -0
  220. package/dist/cjs/packages/sidebar/utils.d.ts +3 -0
  221. package/dist/cjs/packages/sidebar/utils.js +23 -0
  222. package/dist/cjs/packages/sidebaritem/index.d.ts +3 -0
  223. package/dist/cjs/packages/sidebaritem/index.js +12 -0
  224. package/dist/cjs/packages/sidebaritem/sidebaritem.d.ts +9 -0
  225. package/dist/cjs/packages/sidebaritem/sidebaritem.js +29 -0
  226. package/dist/cjs/packages/sidebaritem/style/css.js +1 -0
  227. package/dist/cjs/packages/sidebaritem/style/index.js +1 -0
  228. package/dist/cjs/packages/sidebaritem/style/sidebaritem.scss +16 -0
  229. package/dist/cjs/packages/sidebaritem/style/style.css +19 -0
  230. package/dist/cjs/packages/sidenavbar/sidenavbar.d.ts +3 -0
  231. package/dist/cjs/packages/sidenavbar/sidenavbar.js +5 -1
  232. package/dist/cjs/packages/sidenavbar/style/style.css +45 -78
  233. package/dist/cjs/packages/sidenavbaritem/style/style.css +6 -2
  234. package/dist/cjs/packages/signature/style/style.css +6 -2
  235. package/dist/cjs/packages/skeleton/style/style.css +14 -48
  236. package/dist/cjs/packages/space/style/style.css +4 -0
  237. package/dist/cjs/packages/step/style/style.css +26 -22
  238. package/dist/cjs/packages/steps/style/style.css +26 -22
  239. package/dist/cjs/packages/sticky/style/style.css +4 -0
  240. package/dist/cjs/packages/subsidenavbar/style/style.css +6 -2
  241. package/dist/cjs/packages/swipe/style/style.css +4 -0
  242. package/dist/cjs/packages/swiper/style/style.css +103 -22
  243. package/dist/cjs/packages/swiperitem/style/style.css +4 -0
  244. package/dist/cjs/packages/switch/style/style.css +52 -32
  245. package/dist/cjs/packages/switch/style/switch.scss +45 -29
  246. package/dist/cjs/packages/switch/switch.d.ts +2 -2
  247. package/dist/cjs/packages/switch/switch.js +3 -11
  248. package/dist/cjs/packages/tabbar/style/style.css +88 -47
  249. package/dist/cjs/packages/tabbaritem/style/style.css +87 -46
  250. package/dist/cjs/packages/tabbaritem/style/tabbaritem.scss +15 -3
  251. package/dist/cjs/packages/tabbaritem/tabbaritem.js +1 -1
  252. package/dist/cjs/packages/table/style/style.css +15 -11
  253. package/dist/cjs/packages/tabpane/style/style.css +5 -1
  254. package/dist/cjs/packages/tabs/style/style.css +66 -99
  255. package/dist/cjs/packages/tabs/style/tabs.scss +69 -107
  256. package/dist/cjs/packages/tag/style/style.css +10 -5
  257. package/dist/cjs/packages/tag/style/tag.scss +1 -0
  258. package/dist/cjs/packages/textarea/style/style.css +34 -19
  259. package/dist/cjs/packages/textarea/style/textarea.scss +43 -16
  260. package/dist/cjs/packages/textarea/textarea.d.ts +2 -0
  261. package/dist/cjs/packages/textarea/textarea.js +9 -7
  262. package/dist/cjs/packages/timedetail/style/style.css +10 -4
  263. package/dist/cjs/packages/timedetail/style/timedetail.scss +2 -0
  264. package/dist/cjs/packages/timeselect/style/style.css +52 -83
  265. package/dist/cjs/packages/timeselect/timeselect.js +1 -4
  266. package/dist/cjs/packages/toast/Notification.js +14 -25
  267. package/dist/cjs/packages/toast/style/index.js +1 -0
  268. package/dist/cjs/packages/toast/style/style.css +131 -38
  269. package/dist/cjs/packages/toast/style/toast.scss +76 -54
  270. package/dist/cjs/packages/toast/toast.js +2 -2
  271. package/dist/cjs/packages/tour/style/style.css +97 -140
  272. package/dist/cjs/packages/trendarrow/style/style.css +7 -2
  273. package/dist/cjs/packages/trendarrow/style/trendarrow.scss +2 -1
  274. package/dist/cjs/packages/uploader/index.d.ts +1 -1
  275. package/dist/cjs/packages/uploader/preview.js +13 -14
  276. package/dist/cjs/packages/uploader/style/style.css +20 -15
  277. package/dist/cjs/packages/uploader/types.d.ts +17 -0
  278. package/dist/cjs/packages/uploader/types.js +4 -0
  279. package/dist/cjs/packages/uploader/uploader.d.ts +5 -28
  280. package/dist/cjs/packages/uploader/uploader.js +241 -220
  281. package/dist/cjs/packages/video/style/style.css +4 -0
  282. package/dist/cjs/packages/video/video.d.ts +6 -2
  283. package/dist/cjs/packages/video/video.js +16 -2
  284. package/dist/cjs/packages/virtuallist/style/style.css +8 -4
  285. package/dist/cjs/packages/watermark/style/style.css +4 -0
  286. package/dist/cjs/utils/add-color-for-harmony.d.ts +9 -0
  287. package/dist/cjs/utils/add-color-for-harmony.js +27 -0
  288. package/dist/cjs/utils/platform-taro.d.ts +1 -0
  289. package/dist/cjs/utils/platform-taro.js +8 -0
  290. package/dist/es/packages/actionsheet/actionsheet.d.ts +7 -35
  291. package/dist/es/packages/actionsheet/actionsheet.js +6 -3
  292. package/dist/es/packages/actionsheet/style/actionsheet.scss +10 -4
  293. package/dist/es/packages/actionsheet/style/style.css +58 -84
  294. package/dist/es/packages/address/address.js +9 -6
  295. package/dist/es/packages/address/style/style.css +126 -193
  296. package/dist/es/packages/animate/style/animate.scss +0 -3
  297. package/dist/es/packages/animate/style/style.css +4 -3
  298. package/dist/es/packages/animatingnumbers/countup.js +7 -6
  299. package/dist/es/packages/animatingnumbers/style/style.css +16 -6
  300. package/dist/es/packages/audio/style/style.css +123 -97
  301. package/dist/es/packages/avatar/style/avatar.scss +7 -60
  302. package/dist/es/packages/avatar/style/style.css +11 -45
  303. package/dist/es/packages/avatarcropper/style/style.css +4 -0
  304. package/dist/es/packages/avatargroup/style/style.css +4 -0
  305. package/dist/es/packages/backtop/backtop.d.ts +2 -2
  306. package/dist/es/packages/backtop/backtop.js +15 -22
  307. package/dist/es/packages/backtop/style/backtop.scss +8 -17
  308. package/dist/es/packages/backtop/style/index.js +2 -0
  309. package/dist/es/packages/backtop/style/style.css +141 -14
  310. package/dist/es/packages/badge/badge.d.ts +2 -40
  311. package/dist/es/packages/badge/badge.js +14 -23
  312. package/dist/es/packages/badge/index.d.ts +1 -1
  313. package/dist/es/packages/badge/style/badge.scss +62 -41
  314. package/dist/es/packages/badge/style/style.css +70 -41
  315. package/dist/es/packages/badge/types.d.ts +12 -0
  316. package/dist/es/packages/badge/types.js +1 -0
  317. package/dist/es/packages/barrage/style/style.css +6 -2
  318. package/dist/es/packages/button/style/button.scss +48 -23
  319. package/dist/es/packages/button/style/style.css +110 -84
  320. package/dist/es/packages/calendar/style/style.css +56 -89
  321. package/dist/es/packages/calendarcard/calendarcard.d.ts +13 -65
  322. package/dist/es/packages/calendarcard/calendarcard.js +9 -4
  323. package/dist/es/packages/calendarcard/style/calendarcard.scss +25 -4
  324. package/dist/es/packages/calendarcard/style/style.css +40 -11
  325. package/dist/es/packages/calendaritem/style/style.css +4 -0
  326. package/dist/es/packages/card/card.d.ts +11 -55
  327. package/dist/es/packages/card/style/card.scss +3 -18
  328. package/dist/es/packages/card/style/style.css +50 -36
  329. package/dist/es/packages/cascader/cascader.js +2 -2
  330. package/dist/es/packages/cascader/style/style.css +108 -178
  331. package/dist/es/packages/cell/cell.d.ts +2 -12
  332. package/dist/es/packages/cell/index.d.ts +1 -1
  333. package/dist/es/packages/cell/style/style.css +14 -10
  334. package/dist/es/packages/cell/types.d.ts +12 -0
  335. package/dist/es/packages/cell/types.js +1 -0
  336. package/dist/es/packages/cellgroup/style/style.css +7 -3
  337. package/dist/es/packages/checkbox/checkbox.d.ts +1 -4
  338. package/dist/es/packages/checkbox/checkbox.js +1 -3
  339. package/dist/es/packages/checkbox/index.d.ts +7 -2
  340. package/dist/es/packages/checkbox/index.js +4 -1
  341. package/dist/es/packages/checkbox/style/checkbox.scss +5 -0
  342. package/dist/es/packages/checkbox/style/style.css +48 -29
  343. package/dist/es/packages/checkboxgroup/checkboxgroup.d.ts +10 -50
  344. package/dist/es/packages/checkboxgroup/style/checkboxgroup.scss +8 -0
  345. package/dist/es/packages/checkboxgroup/style/style.css +21 -7
  346. package/dist/es/packages/circleprogress/style/style.css +7 -3
  347. package/dist/es/packages/col/style/style.css +4 -0
  348. package/dist/es/packages/collapse/style/style.css +15 -11
  349. package/dist/es/packages/collapseitem/style/style.css +15 -11
  350. package/dist/es/packages/configprovider/style/style.css +4 -0
  351. package/dist/es/packages/configprovider/types.d.ts +1 -1
  352. package/dist/es/packages/countdown/countdown.d.ts +2 -20
  353. package/dist/es/packages/countdown/countdown.js +3 -2
  354. package/dist/es/packages/countdown/index.d.ts +1 -1
  355. package/dist/es/packages/countdown/style/countdown.scss +29 -4
  356. package/dist/es/packages/countdown/style/style.css +44 -17
  357. package/dist/es/packages/countdown/types.d.ts +26 -0
  358. package/dist/es/packages/countdown/types.js +1 -0
  359. package/dist/es/packages/countup/style/countup.scss +11 -5
  360. package/dist/es/packages/countup/style/style.css +16 -6
  361. package/dist/es/packages/datepicker/style/style.css +52 -85
  362. package/dist/es/packages/dialog/dialog.js +17 -7
  363. package/dist/es/packages/dialog/style/dialog.scss +37 -21
  364. package/dist/es/packages/dialog/style/style.css +152 -112
  365. package/dist/es/packages/divider/style/style.css +8 -4
  366. package/dist/es/packages/drag/drag.d.ts +6 -30
  367. package/dist/es/packages/drag/style/style.css +4 -0
  368. package/dist/es/packages/elevator/elevator.d.ts +9 -45
  369. package/dist/es/packages/elevator/style/elevator.scss +7 -4
  370. package/dist/es/packages/elevator/style/style.css +18 -11
  371. package/dist/es/packages/ellipsis/ellipsis.d.ts +1 -1
  372. package/dist/es/packages/ellipsis/style/style.css +4 -0
  373. package/dist/es/packages/empty/empty.js +1 -1
  374. package/dist/es/packages/empty/style/empty.scss +9 -5
  375. package/dist/es/packages/empty/style/style.css +18 -9
  376. package/dist/es/packages/fixednav/style/style.css +13 -9
  377. package/dist/es/packages/form/style/style.css +23 -17
  378. package/dist/es/packages/formitem/style/formitem.scss +2 -0
  379. package/dist/es/packages/formitem/style/style.css +10 -4
  380. package/dist/es/packages/grid/grid.js +2 -6
  381. package/dist/es/packages/grid/style/grid.scss +2 -2
  382. package/dist/es/packages/grid/style/style.css +19 -13
  383. package/dist/es/packages/griditem/griditem.js +12 -6
  384. package/dist/es/packages/griditem/style/griditem.scss +6 -4
  385. package/dist/es/packages/griditem/style/style.css +16 -10
  386. package/dist/es/packages/hoverbutton/hoverbutton.js +2 -1
  387. package/dist/es/packages/hoverbutton/style/style.css +40 -15
  388. package/dist/es/packages/hoverbutton/utils.d.ts +1 -0
  389. package/dist/es/packages/hoverbutton/utils.js +1 -0
  390. package/dist/es/packages/hoverbuttonitem/hoverbuttonitem.js +17 -8
  391. package/dist/es/packages/hoverbuttonitem/style/hoverbuttonitem.scss +28 -3
  392. package/dist/es/packages/hoverbuttonitem/style/style.css +36 -11
  393. package/dist/es/packages/hoverbuttonitem/utils.d.ts +2 -0
  394. package/dist/es/packages/hoverbuttonitem/utils.js +7 -0
  395. package/dist/es/packages/image/style/style.css +6 -2
  396. package/dist/es/packages/imagepreview/imagepreview.d.ts +14 -70
  397. package/dist/es/packages/imagepreview/style/imagepreview.scss +11 -0
  398. package/dist/es/packages/imagepreview/style/style.css +153 -98
  399. package/dist/es/packages/indicator/indicator.d.ts +4 -0
  400. package/dist/es/packages/indicator/indicator.js +39 -10
  401. package/dist/es/packages/indicator/style/indicator.scss +127 -14
  402. package/dist/es/packages/indicator/style/style.css +103 -22
  403. package/dist/es/packages/infiniteloading/style/infiniteloading.scss +1 -1
  404. package/dist/es/packages/infiniteloading/style/style.css +8 -4
  405. package/dist/es/packages/input/input.d.ts +1 -0
  406. package/dist/es/packages/input/input.js +7 -3
  407. package/dist/es/packages/input/style/input.scss +27 -12
  408. package/dist/es/packages/input/style/style.css +25 -11
  409. package/dist/es/packages/inputnumber/style/inputnumber.scss +19 -16
  410. package/dist/es/packages/inputnumber/style/style.css +26 -20
  411. package/dist/es/packages/layout/style/style.css +4 -0
  412. package/dist/es/packages/loading/index.d.ts +1 -1
  413. package/dist/es/packages/loading/loading.d.ts +3 -22
  414. package/dist/es/packages/loading/loading.js +44 -12
  415. package/dist/es/packages/loading/style/loading.scss +7 -1
  416. package/dist/es/packages/loading/style/style.css +13 -3
  417. package/dist/es/packages/loading/types.d.ts +13 -0
  418. package/dist/es/packages/loading/types.js +1 -0
  419. package/dist/es/packages/lottie/index.d.ts +3 -0
  420. package/dist/es/packages/lottie/index.js +2 -0
  421. package/dist/es/packages/lottie/style/css.js +1 -0
  422. package/dist/es/packages/lottie/style/index.js +1 -0
  423. package/dist/es/packages/lottie/style/lottie.scss +0 -0
  424. package/dist/es/packages/lottie/style/style.css +4 -0
  425. package/dist/es/packages/lottie/types.d.ts +11 -0
  426. package/dist/es/packages/lottie/types.js +1 -0
  427. package/dist/es/packages/lottie/web.d.ts +3 -0
  428. package/dist/es/packages/lottie/web.js +22 -0
  429. package/dist/es/packages/menu/style/style.css +18 -14
  430. package/dist/es/packages/menuitem/style/style.css +14 -10
  431. package/dist/es/packages/navbar/navbar.d.ts +1 -1
  432. package/dist/es/packages/navbar/navbar.js +19 -63
  433. package/dist/es/packages/navbar/style/navbar.scss +48 -111
  434. package/dist/es/packages/navbar/style/style.css +50 -105
  435. package/dist/es/packages/noticebar/style/style.css +4 -0
  436. package/dist/es/packages/notify/style/style.css +8 -4
  437. package/dist/es/packages/numberkeyboard/numberkeyboard.d.ts +10 -50
  438. package/dist/es/packages/numberkeyboard/style/numberkeyboard.scss +10 -1
  439. package/dist/es/packages/numberkeyboard/style/style.css +62 -83
  440. package/dist/es/packages/nutui.react.build.d.ts +7 -1
  441. package/dist/es/packages/nutui.react.build.js +7 -1
  442. package/dist/es/packages/overlay/style/overlay.scss +6 -6
  443. package/dist/es/packages/overlay/style/style.css +11 -7
  444. package/dist/es/packages/pagination/pagination.js +2 -0
  445. package/dist/es/packages/pagination/style/pagination.scss +6 -12
  446. package/dist/es/packages/pagination/style/style.css +20 -22
  447. package/dist/es/packages/picker/style/style.css +52 -85
  448. package/dist/es/packages/popover/popover.d.ts +13 -65
  449. package/dist/es/packages/popover/popover.js +17 -14
  450. package/dist/es/packages/popover/style/popover.scss +47 -65
  451. package/dist/es/packages/popover/style/style.css +93 -136
  452. package/dist/es/packages/popup/popup.js +24 -23
  453. package/dist/es/packages/popup/style/popup.scss +24 -59
  454. package/dist/es/packages/popup/style/style.css +41 -74
  455. package/dist/es/packages/price/index.d.ts +1 -1
  456. package/dist/es/packages/price/price.d.ts +1 -10
  457. package/dist/es/packages/price/price.js +9 -9
  458. package/dist/es/packages/price/style/price.scss +49 -9
  459. package/dist/es/packages/price/style/style.css +39 -16
  460. package/dist/es/packages/price/types.d.ts +13 -0
  461. package/dist/es/packages/price/types.js +1 -0
  462. package/dist/es/packages/progress/progress.js +1 -1
  463. package/dist/es/packages/progress/style/progress.scss +2 -2
  464. package/dist/es/packages/progress/style/style.css +9 -4
  465. package/dist/es/packages/pulltorefresh/pulltorefresh.js +1 -1
  466. package/dist/es/packages/pulltorefresh/style/pulltorefresh.scss +1 -1
  467. package/dist/es/packages/pulltorefresh/style/style.css +6 -2
  468. package/dist/es/packages/radio/index.d.ts +8 -2
  469. package/dist/es/packages/radio/index.js +5 -1
  470. package/dist/es/packages/radio/radio.d.ts +10 -49
  471. package/dist/es/packages/radio/radio.js +0 -2
  472. package/dist/es/packages/radio/style/radio.scss +4 -0
  473. package/dist/es/packages/radio/style/style.css +26 -19
  474. package/dist/es/packages/radiogroup/radiogroup.d.ts +7 -35
  475. package/dist/es/packages/radiogroup/radiogroup.js +1 -1
  476. package/dist/es/packages/radiogroup/style/style.css +10 -6
  477. package/dist/es/packages/range/style/style.css +14 -10
  478. package/dist/es/packages/rate/index.d.ts +1 -1
  479. package/dist/es/packages/rate/rate.d.ts +2 -64
  480. package/dist/es/packages/rate/rate.js +7 -3
  481. package/dist/es/packages/rate/style/rate.scss +101 -10
  482. package/dist/es/packages/rate/style/style.css +89 -9
  483. package/dist/es/packages/rate/types.d.ts +18 -0
  484. package/dist/es/packages/rate/types.js +1 -0
  485. package/dist/es/packages/resultpage/resultpage.js +23 -16
  486. package/dist/es/packages/resultpage/style/resultpage.scss +5 -3
  487. package/dist/es/packages/resultpage/style/style.css +16 -10
  488. package/dist/es/packages/resultpage/types.d.ts +1 -1
  489. package/dist/es/packages/row/style/style.css +4 -0
  490. package/dist/es/packages/safearea/safearea.d.ts +1 -5
  491. package/dist/es/packages/safearea/style/safearea.scss +1 -1
  492. package/dist/es/packages/safearea/style/style.css +5 -1
  493. package/dist/es/packages/searchbar/searchbar.d.ts +19 -95
  494. package/dist/es/packages/searchbar/style/searchbar.scss +10 -7
  495. package/dist/es/packages/searchbar/style/style.css +20 -13
  496. package/dist/es/packages/segmented/index.d.ts +3 -0
  497. package/dist/es/packages/segmented/index.js +2 -0
  498. package/dist/es/packages/segmented/segmented.d.ts +3 -0
  499. package/dist/es/packages/segmented/segmented.js +63 -0
  500. package/dist/es/packages/segmented/style/css.js +1 -0
  501. package/dist/es/packages/segmented/style/index.js +1 -0
  502. package/dist/es/packages/segmented/style/segmented.scss +38 -0
  503. package/dist/es/packages/segmented/style/style.css +42 -0
  504. package/dist/es/packages/segmented/types.d.ts +15 -0
  505. package/dist/es/packages/segmented/types.js +1 -0
  506. package/dist/es/packages/shortpassword/style/style.css +52 -85
  507. package/dist/es/packages/sidebar/index.d.ts +3 -0
  508. package/dist/es/packages/sidebar/index.js +2 -0
  509. package/dist/es/packages/sidebar/sidebar.d.ts +6 -0
  510. package/dist/es/packages/sidebar/sidebar.js +161 -0
  511. package/dist/es/packages/sidebar/style/css.js +1 -0
  512. package/dist/es/packages/sidebar/style/index.js +3 -0
  513. package/dist/es/packages/sidebar/style/sidebar.scss +61 -0
  514. package/dist/es/packages/sidebar/style/style.css +79 -0
  515. package/dist/es/packages/sidebar/types.d.ts +16 -0
  516. package/dist/es/packages/sidebar/types.js +1 -0
  517. package/dist/es/packages/sidebar/utils.d.ts +3 -0
  518. package/dist/es/packages/sidebar/utils.js +14 -0
  519. package/dist/es/packages/sidebaritem/index.d.ts +3 -0
  520. package/dist/es/packages/sidebaritem/index.js +2 -0
  521. package/dist/es/packages/sidebaritem/sidebaritem.d.ts +9 -0
  522. package/dist/es/packages/sidebaritem/sidebaritem.js +18 -0
  523. package/dist/es/packages/sidebaritem/style/css.js +1 -0
  524. package/dist/es/packages/sidebaritem/style/index.js +1 -0
  525. package/dist/es/packages/sidebaritem/style/sidebaritem.scss +16 -0
  526. package/dist/es/packages/sidebaritem/style/style.css +19 -0
  527. package/dist/es/packages/sidenavbar/sidenavbar.d.ts +3 -0
  528. package/dist/es/packages/sidenavbar/sidenavbar.js +4 -1
  529. package/dist/es/packages/sidenavbar/style/style.css +45 -78
  530. package/dist/es/packages/sidenavbaritem/style/style.css +6 -2
  531. package/dist/es/packages/signature/style/style.css +6 -2
  532. package/dist/es/packages/skeleton/style/style.css +14 -48
  533. package/dist/es/packages/space/style/style.css +4 -0
  534. package/dist/es/packages/step/style/style.css +26 -22
  535. package/dist/es/packages/steps/style/style.css +26 -22
  536. package/dist/es/packages/sticky/style/style.css +4 -0
  537. package/dist/es/packages/subsidenavbar/style/style.css +6 -2
  538. package/dist/es/packages/swipe/style/style.css +4 -0
  539. package/dist/es/packages/swiper/style/style.css +103 -22
  540. package/dist/es/packages/swiperitem/style/style.css +4 -0
  541. package/dist/es/packages/switch/style/style.css +52 -32
  542. package/dist/es/packages/switch/style/switch.scss +45 -29
  543. package/dist/es/packages/switch/switch.d.ts +2 -2
  544. package/dist/es/packages/switch/switch.js +3 -11
  545. package/dist/es/packages/tabbar/style/style.css +88 -47
  546. package/dist/es/packages/tabbar/tabbar.d.ts +7 -35
  547. package/dist/es/packages/tabbaritem/style/style.css +87 -46
  548. package/dist/es/packages/tabbaritem/style/tabbaritem.scss +15 -3
  549. package/dist/es/packages/tabbaritem/tabbaritem.d.ts +7 -35
  550. package/dist/es/packages/tabbaritem/tabbaritem.js +1 -1
  551. package/dist/es/packages/table/style/style.css +15 -11
  552. package/dist/es/packages/tabpane/style/style.css +5 -1
  553. package/dist/es/packages/tabpane/tabpane.d.ts +3 -15
  554. package/dist/es/packages/tabs/style/style.css +66 -99
  555. package/dist/es/packages/tabs/style/tabs.scss +69 -107
  556. package/dist/es/packages/tabs/tabs.d.ts +12 -60
  557. package/dist/es/packages/tag/style/style.css +10 -5
  558. package/dist/es/packages/tag/style/tag.scss +1 -0
  559. package/dist/es/packages/textarea/style/style.css +34 -19
  560. package/dist/es/packages/textarea/style/textarea.scss +43 -16
  561. package/dist/es/packages/textarea/textarea.d.ts +2 -0
  562. package/dist/es/packages/textarea/textarea.js +9 -7
  563. package/dist/es/packages/timedetail/style/style.css +10 -4
  564. package/dist/es/packages/timedetail/style/timedetail.scss +2 -0
  565. package/dist/es/packages/timeselect/style/style.css +52 -83
  566. package/dist/es/packages/timeselect/timeselect.d.ts +9 -45
  567. package/dist/es/packages/timeselect/timeselect.js +1 -4
  568. package/dist/es/packages/toast/Notification.js +15 -26
  569. package/dist/es/packages/toast/style/index.js +1 -0
  570. package/dist/es/packages/toast/style/style.css +131 -38
  571. package/dist/es/packages/toast/style/toast.scss +76 -54
  572. package/dist/es/packages/toast/toast.d.ts +12 -60
  573. package/dist/es/packages/toast/toast.js +2 -2
  574. package/dist/es/packages/tour/style/style.css +97 -140
  575. package/dist/es/packages/trendarrow/style/style.css +7 -2
  576. package/dist/es/packages/trendarrow/style/trendarrow.scss +2 -1
  577. package/dist/es/packages/trendarrow/trendarrow.d.ts +11 -55
  578. package/dist/es/packages/uploader/index.d.ts +1 -1
  579. package/dist/es/packages/uploader/preview.js +13 -14
  580. package/dist/es/packages/uploader/style/style.css +20 -15
  581. package/dist/es/packages/uploader/types.d.ts +17 -0
  582. package/dist/es/packages/uploader/types.js +1 -0
  583. package/dist/es/packages/uploader/uploader.d.ts +29 -200
  584. package/dist/es/packages/uploader/uploader.js +241 -220
  585. package/dist/es/packages/video/style/style.css +4 -0
  586. package/dist/es/packages/video/video.d.ts +11 -27
  587. package/dist/es/packages/video/video.js +16 -2
  588. package/dist/es/packages/virtuallist/style/style.css +8 -4
  589. package/dist/es/packages/watermark/style/style.css +4 -0
  590. package/dist/es/utils/add-color-for-harmony.d.ts +9 -0
  591. package/dist/es/utils/add-color-for-harmony.js +16 -0
  592. package/dist/es/utils/platform-taro.d.ts +1 -0
  593. package/dist/es/utils/platform-taro.js +5 -0
  594. package/dist/nutui.react.umd.js +21031 -4140
  595. package/dist/style.css +1 -1
  596. package/dist/style.scss +110 -0
  597. package/dist/styles/jd-font.scss +16 -0
  598. package/dist/styles/theme-dark.scss +121 -110
  599. package/dist/styles/theme-default.scss +100 -93
  600. package/dist/styles/themes/default.css +1 -0
  601. package/dist/styles/themes/default.scss +2 -105
  602. package/dist/styles/variables-jmapp.scss +4 -0
  603. package/dist/styles/variables-jrkf.scss +25 -27
  604. package/dist/styles/variables.scss +346 -263
  605. package/package.json +8 -3
  606. package/dist/cjs/packages/nutui.react.build.rn.d.ts +0 -203
  607. package/dist/cjs/packages/nutui.react.build.rn.js +0 -418
  608. package/dist/cjs/packages/nutui.react.rn.d.ts +0 -304
  609. package/dist/cjs/packages/nutui.react.rn.js +0 -519
  610. package/dist/cjs/packages/popup/index.rn.d.ts +0 -3
  611. package/dist/cjs/packages/popup/popup.rn.d.ts +0 -26
  612. package/dist/cjs/packages/popup/popup.rn.js +0 -186
  613. package/dist/cjs/packages/uploader/file-item.d.ts +0 -19
  614. package/dist/cjs/packages/uploader/file-item.js +0 -28
  615. package/dist/cjs/packages/uploader/utils.d.ts +0 -30
  616. package/dist/cjs/packages/uploader/utils.js +0 -184
  617. package/dist/es/packages/nutui.react.build.rn.d.ts +0 -203
  618. package/dist/es/packages/nutui.react.build.rn.js +0 -203
  619. package/dist/es/packages/nutui.react.rn.d.ts +0 -304
  620. package/dist/es/packages/nutui.react.rn.js +0 -304
  621. package/dist/es/packages/popup/index.rn.d.ts +0 -3
  622. package/dist/es/packages/popup/index.rn.js +0 -2
  623. package/dist/es/packages/popup/popup.rn.d.ts +0 -26
  624. package/dist/es/packages/popup/popup.rn.js +0 -174
  625. package/dist/es/packages/uploader/file-item.d.ts +0 -19
  626. package/dist/es/packages/uploader/file-item.js +0 -18
  627. package/dist/es/packages/uploader/utils.d.ts +0 -30
  628. package/dist/es/packages/uploader/utils.js +0 -154
package/dist/cjs/packages/tabs/style/style.css CHANGED
@@ -1,9 +1,13 @@
1
+ /* #ifdef harmony */
2
+ /* #endif */
3
+ /* #ifndef harmony */
4
+ /* #endif */
1
5
  .nut-tabpane {
2
6
  width: 100%;
3
7
  flex-shrink: 0;
4
8
  display: block;
5
9
  background-color: var(--nutui-tabs-tabpane-backgroundColor, #fff);
6
- color: var(--nutui-color-title, #1a1a1a);
10
+ color: var(--nutui-gray-7);
7
11
  padding: var(--nutui-tabs-tabpane-padding, 24px 20px);
8
12
  box-sizing: border-box;
9
13
  overflow: auto;
@@ -17,13 +21,18 @@
17
21
  display: flex;
18
22
  }
19
23
 
24
+ .nut-tabs-horizontal {
25
+ flex-direction: column;
26
+ }
27
+
20
28
  .nut-tabs-titles {
21
29
  display: flex;
22
30
  box-sizing: border-box;
23
31
  height: var(--nutui-tabs-titles-height, 44px);
24
32
  user-select: none;
25
- overflow: hidden;
26
- background: var(--nutui-tabs-titles-background-color, var(--nutui-color-background, #f5f6fa));
33
+ overflow-x: auto;
34
+ overflow-y: hidden;
35
+ background: var(--nutui-tabs-titles-background-color, var(--nutui-gray-3));
27
36
  scrollbar-width: none;
28
37
  }
29
38
  .nut-tabs-titles::-webkit-scrollbar {
@@ -33,7 +42,6 @@
33
42
  }
34
43
  .nut-tabs-titles .nut-tabs-list {
35
44
  width: 100%;
36
- height: auto;
37
45
  display: flex;
38
46
  flex-shrink: 0;
39
47
  }
@@ -49,10 +57,6 @@
49
57
  .nut-tabs-titles-right .nut-tabs-titles-item {
50
58
  padding: 0 22px;
51
59
  }
52
- .nut-tabs-titles-scrollable {
53
- overflow-x: auto;
54
- overflow-y: hidden;
55
- }
56
60
  .nut-tabs-titles-item {
57
61
  position: relative;
58
62
  display: flex;
@@ -64,15 +68,18 @@
64
68
  line-height: var(--nutui-tabs-titles-height, 44px);
65
69
  min-width: var(--nutui-tabs-titles-item-min-width, 50px);
66
70
  font-size: var(--nutui-tabs-titles-font-size, var(--nutui-font-size-base, 14px));
67
- color: var(--nutui-tabs-titles-item-color, var(--nutui-color-title, #1a1a1a));
71
+ color: var(--nutui-tabs-titles-item-color, var(--nutui-gray-7));
68
72
  text-overflow: ellipsis;
69
73
  white-space: nowrap;
70
74
  }
75
+ .nut-tabs-titles-item .nut-icon {
76
+ color: var(--nutui-tabs-titles-item-color, var(--nutui-gray-7));
77
+ }
71
78
  .nut-tabs-titles-item-left, .nut-tabs-titles-item-right {
72
79
  flex: none;
73
80
  }
74
81
  .nut-tabs-titles-item-text {
75
- text-align: center;
82
+ color: var(--nutui-tabs-titles-item-color, var(--nutui-gray-7));
76
83
  }
77
84
  .nut-tabs-titles-item-smile, .nut-tabs-titles-item-line {
78
85
  position: absolute;
@@ -80,9 +87,9 @@
80
87
  width: 0;
81
88
  height: 0;
82
89
  content: " ";
83
- bottom: var(--nutui-tabs-line-bottom, 15%);
84
90
  left: 50%;
85
91
  transform: translate(-50%, 0);
92
+ bottom: var(--nutui-tabs-line-bottom, 15%);
86
93
  border-radius: var(--nutui-tabs-line-border-radius, 2px);
87
94
  opacity: var(--nutui-tabs-tab-line-opacity, 1);
88
95
  overflow: hidden;
@@ -95,10 +102,12 @@
95
102
  font-size: 20px;
96
103
  width: 100%;
97
104
  height: 100%;
98
- color: var(--nutui-color-primary, #ff0f23);
99
105
  }
100
- .nut-tabs-titles-item-active {
101
- color: var(--nutui-tabs-titles-item-active-color, var(--nutui-color-primary, #ff0f23));
106
+ .nut-tabs-titles-item-active .nut-icon {
107
+ color: var(--nutui-tabs-titles-item-active-color, var(--nutui-brand-6));
108
+ }
109
+ .nut-tabs-titles-item-active .nut-tabs-titles-item-text {
110
+ color: var(--nutui-tabs-titles-item-active-color, var(--nutui-brand-6));
102
111
  font-weight: var(--nutui-tabs-titles-item-active-font-weight, var(--nutui-font-weight-bold, 600));
103
112
  }
104
113
  .nut-tabs-titles-item-active .nut-tabs-titles-item-line {
@@ -106,23 +115,32 @@
106
115
  content: " ";
107
116
  width: var(--nutui-tabs-tab-line-width, 12px);
108
117
  height: var(--nutui-tabs-tab-line-height, 2px);
109
- background: var(--nutui-tabs-tab-line-color, var(--nutui-color-primary, #ff0f23));
118
+ background: var(--nutui-tabs-tab-line-color, var(--nutui-brand-6));
110
119
  }
111
120
  .nut-tabs-titles-item-active .nut-tabs-titles-item-smile {
112
121
  overflow: unset;
113
122
  width: 40px;
114
123
  height: 20px;
115
124
  }
125
+ .nut-tabs-titles-item-active .nut-tabs-titles-item-smile .nut-icon {
126
+ color: var(--nutui-tabs-titles-item-active-color, var(--nutui-brand-6));
127
+ }
116
128
  .nut-tabs-titles-item-disabled {
117
- color: var(--nutui-color-text-disabled, #c2c4cc);
129
+ color: var(--nutui-gray-4);
118
130
  }
119
- .nut-tabs-titles-simple .nut-tabs-titles-item-active {
120
- color: var(--nutui-color-title, #1a1a1a);
131
+ .nut-tabs-titles-item-disabled .nut-icon {
132
+ color: var(--nutui-gray-4);
133
+ }
134
+ .nut-tabs-titles-item-disabled .nut-tabs-titles-item-text {
135
+ color: var(--nutui-gray-4);
136
+ }
137
+ .nut-tabs-titles-simple .nut-tabs-titles-item-active .nut-tabs-titles-item-text,
138
+ .nut-tabs-titles-simple .nut-tabs-titles-item-active .nut-icon {
139
+ color: var(--nutui-gray-7);
121
140
  font-size: var(--nutui-tabs-titles-item-active-font-size, var(--nutui-font-size-l, 16px));
122
141
  }
123
142
  .nut-tabs-titles-card {
124
143
  padding: 0;
125
- background-color: var(--nutui-color-default-light);
126
144
  }
127
145
  .nut-tabs-titles-card .nut-tabs-titles-item {
128
146
  padding: 0;
@@ -145,16 +163,15 @@
145
163
  }
146
164
  .nut-tabs-titles-button .nut-tabs-titles-item-active .nut-tabs-titles-item-text {
147
165
  background: var(--nutui-color-default-light);
148
- color: var(--nutui-color-text, #505259);
166
+ color: var(--nutui-tabs-titles-item-active-color, var(--nutui-brand-6));
149
167
  border-radius: var(--nutui-tabs-button-border-radius, 50px);
150
168
  font-weight: var(--nutui-font-weight-bold, 600);
151
- background-color: var(--nutui-tabs-button-active-background-color, var(--nutui-color-primary-light-pressed, #ffebf1));
152
- color: var(--nutui-color-primary, #ff0f23);
153
- border: var(--nutui-tabs-button-active-border, 1px solid var(--nutui-color-primary, #ff0f23));
169
+ background-color: var(--nutui-tabs-button-active-background-color, var(--nutui-brand-1));
170
+ border: var(--nutui-tabs-button-active-border, 1px solid var(--nutui-brand-6));
154
171
  }
155
172
  .nut-tabs-titles-divider {
156
173
  padding: 0;
157
- border-bottom: 1px solid var(--nutui-color-border, rgba(0, 0, 0, 0.06));
174
+ border-bottom: 1px solid var(--nutui-black-3);
158
175
  }
159
176
  .nut-tabs-titles-divider .nut-tabs-titles-item {
160
177
  padding: 0;
@@ -167,75 +184,36 @@
167
184
  top: 50%;
168
185
  height: 50%;
169
186
  width: 1px;
170
- background: var(--nutui-color-border, rgba(0, 0, 0, 0.06));
187
+ background: var(--nutui-black-3);
171
188
  transform: translateY(-50%);
172
189
  }
173
190
  .nut-tabs-titles-divider .nut-tabs-titles-item:last-child::after {
174
191
  display: none;
175
192
  }
176
193
 
177
- [dir=rtl] .nut-tabs-titles-item-smile, [dir=rtl] .nut-tabs-titles-item-line,
178
- .nut-rtl .nut-tabs-titles-item-smile,
179
- .nut-rtl .nut-tabs-titles-item-line {
180
- left: auto;
181
- right: 50%;
182
- transform: translate(50%, 0);
183
- }
184
- [dir=rtl] .nut-tabs-titles-divider .nut-tabs-titles-item::after,
185
- .nut-rtl .nut-tabs-titles-divider .nut-tabs-titles-item::after {
186
- right: auto;
187
- left: 0;
188
- }
189
-
190
- .nut-tabs-horizontal {
191
- flex-direction: column;
192
- position: relative;
193
- }
194
-
195
- .nut-tabs-vertical {
196
- flex-direction: row;
197
- width: 100%;
198
- }
199
194
  .nut-tabs-vertical .nut-tabs-ellipsis {
200
195
  text-overflow: ellipsis;
201
196
  white-space: nowrap;
202
197
  overflow: hidden;
203
198
  }
204
199
  .nut-tabs-vertical .nut-tabs-titles {
205
- box-sizing: border-box;
206
200
  flex-direction: column;
207
201
  height: 100%;
208
- padding: 0;
209
202
  width: var(--nutui-tabs-vertical-titles-width, 100px);
210
203
  flex-shrink: 0;
211
204
  }
212
205
  .nut-tabs-vertical .nut-tabs-titles .nut-tabs-list {
213
- width: 100%;
214
- display: flex;
215
206
  flex-direction: column;
216
- flex-shrink: 0;
217
- }
218
- .nut-tabs-vertical .nut-tabs-titles-line .nut-tabs-titles-item {
219
- padding-left: 14px;
220
- }
221
- .nut-tabs-vertical .nut-tabs-titles-scrollable {
222
- overflow-x: hidden;
223
- overflow-y: auto;
224
207
  }
225
208
  .nut-tabs-vertical .nut-tabs-titles-item {
226
209
  height: var(--nutui-tabs-vertical-titles-item-height, 40px);
227
- margin: 0;
228
210
  flex: none;
229
211
  }
230
212
  .nut-tabs-vertical .nut-tabs-titles-item-smile {
231
- width: 0;
232
- height: 0;
233
213
  overflow: hidden;
234
214
  transition: width 0.3s ease;
235
215
  }
236
216
  .nut-tabs-vertical .nut-tabs-titles-item-line {
237
- width: 0;
238
- height: 0;
239
217
  transform: translate(0, -50%);
240
218
  transition: height 0.3s ease;
241
219
  }
@@ -243,33 +221,29 @@
243
221
  top: 50%;
244
222
  }
245
223
  .nut-tabs-vertical .nut-tabs-titles-item-active {
246
- background-color: var(--nutui-tabs-titles-item-active-background-color, var(--nutui-color-background-overlay, #ffffff));
224
+ background-color: var(--nutui-tabs-titles-item-active-background-color, var(--nutui-gray-1));
247
225
  }
248
226
  .nut-tabs-vertical .nut-tabs-titles-item-active .nut-tabs-titles-item-line {
249
227
  left: 10px;
250
228
  width: var(--nutui-tabs-vertical-tab-line-width, 3px);
251
229
  height: var(--nutui-tabs-vertical-tab-line-height, 12px);
252
- background: var(--nutui-tabs-vertical-tab-line-color, linear-gradient(180deg, var(--nutui-color-primary-stop-1, #ff475d) 0%, var(--nutui-color-primary-light-pressed, #ffebf1) 100%));
230
+ background: var(--nutui-tabs-vertical-tab-line-color, linear-gradient(180deg, var(--nutui-color-primary-stop-1, #ff475d) 0%, var(--nutui-brand-1) 100%));
253
231
  }
254
232
  .nut-tabs-vertical .nut-tabs-titles-item-active .nut-tabs-titles-item-smile {
255
233
  right: -12px;
256
234
  bottom: -2%;
257
235
  left: auto;
258
- width: 40px;
259
- height: 20px;
260
236
  transform: rotate(320deg);
261
237
  }
262
238
  .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles {
263
239
  flex-direction: row;
264
- overflow-x: auto;
265
- overflow-y: hidden;
266
240
  height: var(--nutui-tabs-titles-height, 44px);
241
+ width: 100%;
242
+ padding: 0 !important;
267
243
  }
268
244
  .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles .nut-tabs-list {
269
- width: 100%;
270
- display: flex;
271
245
  flex-direction: row;
272
- flex-shrink: 0;
246
+ height: auto;
273
247
  }
274
248
  .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-content {
275
249
  flex-direction: row;
@@ -280,6 +254,9 @@
280
254
  .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles-item-active .nut-tabs-titles-item-line {
281
255
  left: 50%;
282
256
  transform: translate(-50%, 0);
257
+ width: var(--nutui-tabs-tab-line-width, 12px);
258
+ height: var(--nutui-tabs-tab-line-height, 2px);
259
+ background: var(--nutui-tabs-tab-line-color, var(--nutui-brand-6));
283
260
  }
284
261
  .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles-item-active .nut-tabs-titles-item-smile {
285
262
  left: 50%;
@@ -297,28 +274,26 @@
297
274
  .nut-tabs-vertical .nut-tabs-content .nut-tabpane {
298
275
  height: 100%;
299
276
  }
300
- .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles {
277
+
278
+ .nut-tabs-content {
301
279
  display: flex;
302
- flex-direction: row;
303
- padding: 0 !important;
304
- width: 100%;
280
+ box-sizing: border-box;
305
281
  }
306
- .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles .nut-tabs-titles-item {
307
- display: flex;
308
- align-items: center;
309
- justify-content: center;
310
- flex: 1 0 auto;
282
+ .nut-tabs-content-wrap {
283
+ overflow: hidden;
311
284
  }
312
- .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles .nut-tabs-titles-item-active {
313
- color: var(--nutui-color-primary, #ff0f23);
314
- font-weight: var(--nutui-tabs-titles-item-active-font-weight, var(--nutui-font-weight-bold, 600));
315
- font-size: var(--nutui-tabs-titles-item-active-font-size, var(--nutui-font-size-l, 16px));
285
+
286
+ [dir=rtl] .nut-tabs-titles-item-smile, [dir=rtl] .nut-tabs-titles-item-line,
287
+ .nut-rtl .nut-tabs-titles-item-smile,
288
+ .nut-rtl .nut-tabs-titles-item-line {
289
+ left: auto;
290
+ right: 50%;
291
+ transform: translate(50%, 0);
316
292
  }
317
- .nut-tabs-vertical .nut-tabs-horizontal .nut-tabs-titles .nut-tabs-titles-item-active .nut-tabs-titles-item-line {
318
- content: " ";
319
- width: var(--nutui-tabs-tab-line-width, 12px);
320
- height: var(--nutui-tabs-tab-line-height, 2px);
321
- background: var(--nutui-tabs-tab-line-color, var(--nutui-color-primary, #ff0f23));
293
+ [dir=rtl] .nut-tabs-titles-divider .nut-tabs-titles-item::after,
294
+ .nut-rtl .nut-tabs-titles-divider .nut-tabs-titles-item::after {
295
+ right: auto;
296
+ left: 0;
322
297
  }
323
298
 
324
299
  [dir=rtl] .nut-tabs-vertical .nut-tabs-titles-line .nut-tabs-titles-item,
@@ -348,12 +323,4 @@
348
323
  right: 50%;
349
324
  left: auto;
350
325
  transform: translate(50%, 0) rotate(0deg);
351
- }
352
-
353
- .nut-tabs-content {
354
- display: flex;
355
- box-sizing: border-box;
356
- }
357
- .nut-tabs-content-wrap {
358
- overflow: hidden;
359
326
  }
package/dist/cjs/packages/tabs/style/tabs.scss CHANGED
@@ -4,12 +4,17 @@
4
4
  display: flex;
5
5
  }
6
6
 
7
+ .nut-tabs-horizontal {
8
+ flex-direction: column;
9
+ }
10
+
7
11
  .nut-tabs-titles {
8
12
  display: flex;
9
13
  box-sizing: border-box;
10
14
  height: $tabs-titles-height;
11
15
  user-select: none;
12
- overflow: hidden;
16
+ overflow-x: auto;
17
+ overflow-y: hidden;
13
18
  background: $tabs-titles-background-color;
14
19
  scrollbar-width: none;
15
20
 
@@ -21,7 +26,6 @@
21
26
 
22
27
  .nut-tabs-list {
23
28
  width: 100%;
24
- height: auto;
25
29
  display: flex;
26
30
  flex-shrink: 0;
27
31
  }
@@ -40,11 +44,6 @@
40
44
  }
41
45
  }
42
46
 
43
- &-scrollable {
44
- overflow-x: auto;
45
- overflow-y: hidden;
46
- }
47
-
48
47
  &-item {
49
48
  position: relative;
50
49
  display: flex;
@@ -60,13 +59,17 @@
60
59
  text-overflow: ellipsis;
61
60
  white-space: nowrap;
62
61
 
62
+ .nut-icon {
63
+ color: $tabs-titles-item-color;
64
+ }
65
+
63
66
  &-left,
64
67
  &-right {
65
68
  flex: none;
66
69
  }
67
70
 
68
71
  &-text {
69
- text-align: center;
72
+ color: $tabs-titles-item-color;
70
73
  }
71
74
 
72
75
  &-smile,
@@ -76,9 +79,9 @@
76
79
  width: 0;
77
80
  height: 0;
78
81
  content: ' ';
79
- bottom: $tabs-tab-line-bottom;
80
82
  left: 50%;
81
83
  transform: translate(-50%, 0);
84
+ bottom: $tabs-tab-line-bottom;
82
85
  border-radius: $tabs-tab-line-border-radius;
83
86
  opacity: $tabs-tab-line-opacity;
84
87
  overflow: hidden;
@@ -92,13 +95,18 @@
92
95
  font-size: 20px;
93
96
  width: 100%;
94
97
  height: 100%;
95
- color: $color-primary;
96
98
  }
97
99
  }
98
100
 
99
101
  &-active {
100
- color: $tabs-titles-item-active-color;
101
- font-weight: $tabs-titles-item-active-font-weight;
102
+ .nut-icon {
103
+ color: $tabs-titles-item-active-color;
104
+ }
105
+
106
+ .nut-tabs-titles-item-text {
107
+ color: $tabs-titles-item-active-color;
108
+ font-weight: $tabs-titles-item-active-font-weight;
109
+ }
102
110
 
103
111
  .nut-tabs-titles-item-line {
104
112
  overflow: unset;
@@ -112,28 +120,42 @@
112
120
  overflow: unset;
113
121
  width: 40px;
114
122
  height: 20px;
123
+
124
+ .nut-icon {
125
+ color: $tabs-titles-item-active-color;
126
+ }
115
127
  }
116
128
  }
117
129
 
118
130
  &-disabled {
119
131
  color: $color-text-disabled;
132
+ .nut-icon {
133
+ color: $color-text-disabled;
134
+ }
135
+ .nut-tabs-titles-item-text {
136
+ color: $color-text-disabled;
137
+ }
120
138
  }
121
139
  }
122
140
 
123
141
  &-simple {
124
- .nut-tabs-titles-item-active {
125
- color: $color-title;
126
- font-size: $tabs-titles-item-active-font-size;
142
+ .nut-tabs-titles-item {
143
+ &-active {
144
+ .nut-tabs-titles-item-text,
145
+ .nut-icon {
146
+ color: $color-title;
147
+ font-size: $tabs-titles-item-active-font-size;
148
+ }
149
+ }
127
150
  }
128
151
  }
129
152
 
130
153
  &-card {
131
154
  padding: 0;
132
- background-color: $color-default-light;
155
+ // background-color: $color-default-light;
133
156
 
134
157
  .nut-tabs-titles-item {
135
158
  padding: 0;
136
-
137
159
  &-active {
138
160
  font-weight: $font-weight-bold;
139
161
  background-color: $white;
@@ -157,11 +179,10 @@
157
179
  .nut-tabs-titles-item-active {
158
180
  .nut-tabs-titles-item-text {
159
181
  background: $color-default-light;
160
- color: $color-text;
182
+ color: $tabs-titles-item-active-color;
161
183
  border-radius: $tabs-tab-button-border-radius;
162
184
  font-weight: $font-weight-bold;
163
185
  background-color: $tabs-tab-button-active-background-color;
164
- color: $color-primary;
165
186
  border: $tabs-tab-button-active-border;
166
187
  }
167
188
  }
@@ -195,35 +216,7 @@
195
216
  }
196
217
  }
197
218
 
198
- [dir='rtl'] .nut-tabs-titles,
199
- .nut-rtl .nut-tabs-titles {
200
- &-item {
201
- &-smile,
202
- &-line {
203
- left: auto;
204
- right: 50%;
205
- transform: translate(50%, 0);
206
- }
207
- }
208
- &-divider {
209
- .nut-tabs-titles-item {
210
- &::after {
211
- right: auto;
212
- left: 0;
213
- }
214
- }
215
- }
216
- }
217
-
218
- .nut-tabs-horizontal {
219
- flex-direction: column;
220
- position: relative;
221
- }
222
-
223
219
  .nut-tabs-vertical {
224
- flex-direction: row;
225
- width: 100%;
226
-
227
220
  .nut-tabs-ellipsis {
228
221
  text-overflow: ellipsis;
229
222
  white-space: nowrap;
@@ -231,47 +224,26 @@
231
224
  }
232
225
 
233
226
  .nut-tabs-titles {
234
- box-sizing: border-box;
235
227
  flex-direction: column;
236
228
  height: 100%;
237
- padding: 0;
238
229
  width: $tabs-vertical-titles-width;
239
230
  flex-shrink: 0;
240
231
 
241
232
  .nut-tabs-list {
242
- width: 100%;
243
- display: flex;
244
233
  flex-direction: column;
245
- flex-shrink: 0;
246
- }
247
-
248
- &-line {
249
- .nut-tabs-titles-item {
250
- padding-left: 14px;
251
- }
252
234
  }
253
235
  }
254
236
 
255
- .nut-tabs-titles-scrollable {
256
- overflow-x: hidden;
257
- overflow-y: auto;
258
- }
259
-
260
237
  .nut-tabs-titles-item {
261
238
  height: $tabs-vertical-titles-item-height;
262
- margin: 0;
263
239
  flex: none;
264
240
 
265
241
  &-smile {
266
- width: 0;
267
- height: 0;
268
242
  overflow: hidden;
269
243
  transition: width 0.3s ease;
270
244
  }
271
245
 
272
246
  &-line {
273
- width: 0;
274
- height: 0;
275
247
  transform: translate(0, -50%);
276
248
  transition: height 0.3s ease;
277
249
 
@@ -293,8 +265,6 @@
293
265
  right: -12px;
294
266
  bottom: -2%;
295
267
  left: auto;
296
- width: 40px;
297
- height: 20px;
298
268
  transform: rotate(320deg);
299
269
  }
300
270
  }
@@ -303,15 +273,13 @@
303
273
  .nut-tabs-horizontal {
304
274
  .nut-tabs-titles {
305
275
  flex-direction: row;
306
- overflow-x: auto;
307
- overflow-y: hidden;
308
276
  height: $tabs-titles-height;
277
+ width: 100%;
278
+ padding: 0 !important;
309
279
 
310
280
  .nut-tabs-list {
311
- width: 100%;
312
- display: flex;
313
281
  flex-direction: row;
314
- flex-shrink: 0;
282
+ height: auto;
315
283
  }
316
284
  }
317
285
 
@@ -325,6 +293,9 @@
325
293
  .nut-tabs-titles-item-line {
326
294
  left: 50%;
327
295
  transform: translate(-50%, 0);
296
+ width: $tabs-tab-line-width;
297
+ height: $tabs-tab-line-height;
298
+ background: $tabs-tab-line-color;
328
299
  }
329
300
 
330
301
  .nut-tabs-titles-item-smile {
@@ -348,32 +319,32 @@
348
319
  height: 100%;
349
320
  }
350
321
  }
322
+ }
351
323
 
352
- .nut-tabs-horizontal {
353
- .nut-tabs-titles {
354
- display: flex;
355
- flex-direction: row;
356
- padding: 0 !important;
357
- width: 100%;
358
-
359
- .nut-tabs-titles-item {
360
- display: flex;
361
- align-items: center;
362
- justify-content: center;
363
- flex: 1 0 auto;
324
+ .nut-tabs-content {
325
+ display: flex;
326
+ box-sizing: border-box;
364
327
 
365
- &-active {
366
- color: $color-primary;
367
- font-weight: $tabs-titles-item-active-font-weight;
368
- font-size: $tabs-titles-item-active-font-size;
328
+ &-wrap {
329
+ overflow: hidden;
330
+ }
331
+ }
369
332
 
370
- .nut-tabs-titles-item-line {
371
- content: ' ';
372
- width: $tabs-tab-line-width;
373
- height: $tabs-tab-line-height;
374
- background: $tabs-tab-line-color;
375
- }
376
- }
333
+ [dir='rtl'] .nut-tabs-titles,
334
+ .nut-rtl .nut-tabs-titles {
335
+ &-item {
336
+ &-smile,
337
+ &-line {
338
+ left: auto;
339
+ right: 50%;
340
+ transform: translate(50%, 0);
341
+ }
342
+ }
343
+ &-divider {
344
+ .nut-tabs-titles-item {
345
+ &::after {
346
+ right: auto;
347
+ left: 0;
377
348
  }
378
349
  }
379
350
  }
@@ -421,12 +392,3 @@
421
392
  }
422
393
  }
423
394
  }
424
-
425
- .nut-tabs-content {
426
- display: flex;
427
- box-sizing: border-box;
428
-
429
- &-wrap {
430
- overflow: hidden;
431
- }
432
- }