@nutui/nutui-react 1.3.15 → 1.4.0-beta.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 (96) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/esm/ActionSheet.js +1 -1
  3. package/dist/esm/Cell.js +4 -12
  4. package/dist/esm/ConfigProvider.js +18 -4
  5. package/dist/esm/Empty.js +3 -3
  6. package/dist/esm/NoticeBar.js +1 -3
  7. package/dist/esm/Progress.js +1 -1
  8. package/dist/esm/SearchBar.js +3 -3
  9. package/dist/esm/TabbarItem.js +1 -9
  10. package/dist/esm/types/src/packages/cell/cell.d.ts +0 -2
  11. package/dist/esm/types/src/packages/configprovider/configprovider.d.ts +2 -0
  12. package/dist/esm/types/src/packages/{formitem/useForm.d.ts → form/useForm.taro.d.ts} +0 -0
  13. package/dist/esm/types/src/packages/nutui.react.taro.d.ts +189 -0
  14. package/dist/esm/types/src/packages/nutui.react.taro.scss.d.ts +98 -0
  15. package/dist/esm/types/src/packages/nutui.taro.react.build.d.ts +95 -0
  16. package/dist/esm/types/src/packages/signature/demo.d.ts +1 -0
  17. package/dist/esm/types/src/packages/tabbaritem/tabbaritem.d.ts +0 -1
  18. package/dist/locales/base.js +1 -1
  19. package/dist/locales/en-US.js +1 -1
  20. package/dist/locales/id-ID.js +1 -1
  21. package/dist/locales/zh-CN.js +1 -1
  22. package/dist/locales/zh-TW.js +1 -1
  23. package/dist/locales/zh-UG.js +1 -1
  24. package/dist/nutui.react.es.js +6774 -2521
  25. package/dist/nutui.react.umd.js +6761 -2508
  26. package/dist/packages/actionsheet/actionsheet.scss +29 -13
  27. package/dist/packages/address/address.scss +46 -18
  28. package/dist/packages/animatingnumbers/countup.scss +10 -1
  29. package/dist/packages/audio/audio.scss +17 -4
  30. package/dist/packages/backtop/backtop.scss +4 -3
  31. package/dist/packages/badge/badge.scss +2 -2
  32. package/dist/packages/barrage/barrage.scss +13 -6
  33. package/dist/packages/button/button.scss +56 -0
  34. package/dist/packages/calendar/calendar.scss +8 -7
  35. package/dist/packages/card/card.scss +1 -1
  36. package/dist/packages/cascader/cascader.scss +21 -12
  37. package/dist/packages/cell/cell.scss +9 -3
  38. package/dist/packages/cellgroup/cellgroup.scss +2 -2
  39. package/dist/packages/checkbox/checkbox.scss +1 -1
  40. package/dist/packages/circleprogress/circleprogress.scss +1 -1
  41. package/dist/packages/collapseitem/collapseitem.scss +52 -18
  42. package/dist/packages/dialog/dialog.scss +1 -1
  43. package/dist/packages/divider/divider.scss +9 -0
  44. package/dist/packages/elevator/elevator.scss +8 -4
  45. package/dist/packages/empty/empty.scss +5 -2
  46. package/dist/packages/fixednav/fixednav.scss +8 -0
  47. package/dist/packages/formitem/formitem.scss +1 -1
  48. package/dist/packages/griditem/griditem.scss +9 -4
  49. package/dist/packages/image/image.scss +2 -2
  50. package/dist/packages/indicator/indicator.scss +7 -0
  51. package/dist/packages/infiniteloading/infiniteloading.scss +12 -8
  52. package/dist/packages/input/input.scss +24 -4
  53. package/dist/packages/inputnumber/inputnumber.scss +9 -8
  54. package/dist/packages/menu/menu.scss +2 -3
  55. package/dist/packages/menuitem/menuitem.scss +3 -2
  56. package/dist/packages/navbar/navbar.scss +25 -5
  57. package/dist/packages/noticebar/noticebar.scss +14 -8
  58. package/dist/packages/numberkeyboard/numberkeyboard.scss +28 -6
  59. package/dist/packages/overlay/overlay.scss +25 -0
  60. package/dist/packages/pagination/pagination.scss +19 -8
  61. package/dist/packages/picker/picker.scss +46 -21
  62. package/dist/packages/popup/popup.scss +6 -2
  63. package/dist/packages/progress/progress.scss +10 -0
  64. package/dist/packages/pulltorefresh/pulltorefresh.scss +9 -1
  65. package/dist/packages/radio/radio.scss +9 -6
  66. package/dist/packages/radiogroup/radiogroup.scss +49 -0
  67. package/dist/packages/range/range.scss +4 -4
  68. package/dist/packages/row/row.scss +16 -0
  69. package/dist/packages/searchbar/searchbar.scss +20 -6
  70. package/dist/packages/shortpassword/shortpassword.scss +23 -12
  71. package/dist/packages/sidenavbar/sidenavbar.scss +20 -2
  72. package/dist/packages/sidenavbaritem/sidenavbaritem.scss +13 -5
  73. package/dist/packages/signature/signature.scss +16 -0
  74. package/dist/packages/step/step.scss +48 -2
  75. package/dist/packages/subsidenavbar/subsidenavbar.scss +4 -4
  76. package/dist/packages/switch/switch.scss +14 -0
  77. package/dist/packages/tabbar/tabbar.scss +1 -1
  78. package/dist/packages/tabbaritem/tabbaritem.scss +4 -3
  79. package/dist/packages/table/table.scss +21 -10
  80. package/dist/packages/tabpane/tabpane.scss +3 -2
  81. package/dist/packages/tabs/tabs.scss +18 -6
  82. package/dist/packages/textarea/textarea.scss +2 -2
  83. package/dist/packages/timedetail/timedetail.scss +8 -5
  84. package/dist/packages/timepannel/timepannel.scss +4 -4
  85. package/dist/packages/timeselect/timeselect.scss +27 -13
  86. package/dist/packages/uploader/uploader.scss +23 -7
  87. package/dist/packages/virtuallist/virtuallist.scss +15 -3
  88. package/dist/style.css +1 -1
  89. package/dist/style.es.js +1 -1
  90. package/dist/styles/font/config.json +1 -1
  91. package/dist/styles/theme-dark.scss +18 -0
  92. package/dist/styles/theme-default.scss +28 -0
  93. package/dist/styles/themes/default.scss +1 -0
  94. package/dist/styles/variables.scss +103 -96
  95. package/dist/types/index.d.ts +2 -3
  96. package/package.json +4 -5
package/dist/style.es.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @nutui/nutui-react v1.3.15-beta.2 Wed Dec 14 2022 17:29:17 GMT+0800 (China Standard Time)
2
+ * @nutui/nutui-react v1.4.0-beta.0 Wed Dec 21 2022 14:19:06 GMT+0800 (China Standard Time)
3
3
  * (c) 2021 @jdf2e.
4
4
  * Released under the MIT License.
5
5
  */
@@ -134,7 +134,7 @@
134
134
  "loading1"
135
135
  ]
136
136
  }
137
-
137
+
138
138
  ],
139
139
  "style":[
140
140
  {
@@ -0,0 +1,18 @@
1
+ :root,
2
+ page {
3
+ --nutui-brand-color: #fa2c19;
4
+ --nutui-brand-color-start: #ff404f;
5
+ --nutui-brand-color-end: #fa2c19;
6
+ --nutui-brand-link-color: #396acc;
7
+ --nutui-gray-0: #000000;
8
+ --nutui-gray-1: #e6e6e6;
9
+ --nutui-gray-2: #828282;
10
+ --nutui-gray-3: #404040;
11
+ --nutui-gray-4: #0a0a0a;
12
+ --nutui-gray-5: #141414;
13
+ --nutui-gray-6: #1f1f1f;
14
+ --nutui-gray-7: rgba(0, 0, 0, 0.7);
15
+ --nutui-gray-8: rgba(0, 0, 0, 0.4);
16
+ --nutui-gray-9: rgba(0, 0, 0, 0.08);
17
+ --nutui-gray-10: rgba(0, 0, 0, 0.02);
18
+ }
@@ -0,0 +1,28 @@
1
+ :root,
2
+ page {
3
+ --nutui-brand-color: #fa2c19;
4
+ --nutui-brand-color-start: #ff404f;
5
+ --nutui-brand-color-end: #fa2c19;
6
+ --nutui-brand-link-color: #396acc;
7
+ --nutui-gray-0: #000000;
8
+ // 主要内容用色,常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
9
+ --nutui-gray-1: #1a1a1a;
10
+ // 次要文字色,用于次级标题、属性标示、非主要信息引导等。
11
+ --nutui-gray-2: #757575;
12
+ // 不可操作内容色,用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
13
+ --nutui-gray-3: #bfbfbf;
14
+ // 页面基底色,用于卡片式页面的兜底,永远置于页面最底层。
15
+ --nutui-gray-4: #f4f4f4;
16
+ // 卡片内嵌背景色,用于卡片内部的信息包裹,感知较弱。
17
+ --nutui-gray-5: #f8f8f8;
18
+ // 卡片背景色
19
+ --nutui-gray-6: #ffffff;
20
+ // 页面全局蒙层,用于弹出层、弹窗、新功能引导出现的整页遮罩
21
+ --nutui-gray-7: rgba(0, 0, 0, 0.7);
22
+ // 局部蒙层,用于非整页遮罩
23
+ --nutui-gray-8: rgba(0, 0, 0, 0.4);
24
+ // 间隔线/容错线,用于结构或信息分割
25
+ --nutui-gray-9: rgba(0, 0, 0, 0.08);
26
+ // 图片容错蒙层
27
+ --nutui-gray-10: rgba(0, 0, 0, 0.02);
28
+ }
@@ -1,3 +1,4 @@
1
+ @import '../theme-default.scss';
1
2
  @import '../variables.scss';
2
3
  @import '../../packages/button/button.scss';
3
4
  @import '../../packages/cell/cell.scss';
@@ -1,43 +1,37 @@
1
1
  // 品牌色
2
- // 纯色
3
- $brand-color: #fa2c19 !default;
4
- // 渐变色
5
- $brand-color-start: #ff404f !default;
6
- $brand-color-end: #fa2c19 !default;
7
-
8
- $gray0: #000000 !default;
9
- // 灰阶
10
- // 主要内容用色,常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
11
- $gray1: #1a1a1a !default;
2
+ $brand-color: var(--nutui-brand-color, #fa2c19) !default;
3
+ // 品牌渐变色
4
+ $brand-color-start: var(--nutui-brand-color-start, #ff404f) !default;
5
+ $brand-color-end: var(--nutui-brand-color-end, #fa2c19) !default;
6
+ $brand-link-color: var(--nutui-brand-link-color, #396acc);
12
7
 
8
+ $gray0: var(--nutui-gray-0, #000000) !default;
9
+ // 主要内容用色,常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
10
+ $gray1: var(--nutui-gray-1, #1a1a1a) !default;
13
11
  // 次要文字色,用于次级标题、属性标示、非主要信息引导等。
14
- $gray2: #757575 !default;
15
-
12
+ $gray2: var(--nutui-gray-2, #757575) !default;
16
13
  // 不可操作内容色,用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
17
- $gray3: #bfbfbf !default;
18
-
14
+ $gray3: var(--nutui-gray-3, #bfbfbf) !default;
19
15
  // 页面基底色,用于卡片式页面的兜底,永远置于页面最底层。
20
- $gray4: #f4f4f4 !default;
21
-
16
+ $gray4: var(--nutui-gray-4, #f4f4f4) !default;
22
17
  // 卡片内嵌背景色,用于卡片内部的信息包裹,感知较弱。
23
- $gray5: #f8f8f8 !default;
24
-
18
+ $gray5: var(--nutui-gray-5, #f8f8f8) !default;
25
19
  // 卡片背景色
26
- $gray6: #ffffff !default;
27
-
20
+ $gray6: var(--nutui-gray-6, #ffffff) !default;
28
21
  // 页面全局蒙层,用于弹出层、弹窗、新功能引导出现的整页遮罩
29
- $gray7: rgba(0, 0, 0, 0.7) !default;
30
-
22
+ $gray7: var(--nutui-gray-7, rgba(0, 0, 0, 0.7)) !default;
31
23
  // 局部蒙层,用于非整页遮罩
32
- $gray8: rgba(0, 0, 0, 0.4) !default;
33
-
24
+ $gray8: var(--nutui-gray-8, rgba(0, 0, 0, 0.4)) !default;
34
25
  // 间隔线/容错线,用于结构或信息分割
35
- $gray9: rgba(0, 0, 0, 0.08) !default;
36
-
26
+ $gray9: var(--nutui-gray-9, rgba(0, 0, 0, 0.08)) !default;
37
27
  // 图片容错蒙层
38
- $gray10: rgba(0, 0, 0, 0.02) !default;
28
+ $gray10: var(--nutui-gray-10, rgba(0, 0, 0, 0.02)) !default;
39
29
 
40
- // 暗黑映射
30
+ // 暗黑映射,用于 nut-theme-dark 方式
31
+ $dark-brand-color: #fa2c19 !default;
32
+ $dark-brand-color-start: #ff404f !default;
33
+ $dark-brand-color-end: #fa2c19 !default;
34
+ $dark0: #000000 !default;
41
35
  $dark1: #e6e6e6 !default;
42
36
  $dark2: #828282 !default;
43
37
  $dark3: #404040 !default;
@@ -48,42 +42,44 @@ $dark7: rgba(0, 0, 0, 0.7) !default;
48
42
  $dark8: rgba(0, 0, 0, 0.4) !default;
49
43
  $dark9: rgba(0, 0, 0, 0.08) !default;
50
44
  $dark10: rgba(0, 0, 0, 0.02) !default;
51
-
52
- // color
53
-
45
+ // ----------------------------------------------------
54
46
  // 主色调
55
47
  $primary-color: $brand-color !default;
48
+ $primary-color-start: $brand-color-start !default;
56
49
  $primary-color-end: $brand-color-end !default;
57
- // 辅助色
58
- $help-color: $gray5 !default;
50
+ $primary-link-color: #396acc !default;
51
+ // ----------------------------------------------------
59
52
  // 标题常规文字
60
53
  $title-color: $gray1 !default;
61
54
  // 副标题
62
55
  $title-color2: $gray2 !default;
63
56
  // 次内容
64
57
  $text-color: $gray2 !default;
58
+ // 辅助色
59
+ $help-color: $gray5 !default;
65
60
  // 特殊禁用色
66
61
  $disable-color: $gray3 !default;
62
+ $required-color: #fa2c19 !default;
67
63
  $white: $gray6 !default;
68
64
  $black: $gray0 !default;
69
- $required-color: #fa2c19 !default;
65
+ // ----------------------------------------------------
66
+ // 蒙层颜色
67
+ // 页面全局蒙层
68
+ $mask-color: $gray7 !default;
69
+ // 局部蒙层,用于非整页遮罩
70
+ $mask-color2: $gray8 !default;
71
+ // 图片容错蒙层
72
+ $mask-color3: $gray10 !default;
70
73
 
71
- $dark-background: $dark1 !default;
72
- $dark-background2: $dark2 !default;
73
- $dark-background3: $dark3 !default;
74
- $dark-background4: $dark4 !default;
75
- $dark-background5: $dark5 !default;
76
- $dark-background6: $dark6 !default;
77
- $dark-background7: $dark7 !default;
78
- $dark-color: $dark1 !default;
79
- $dark-color2: $dark2 !default;
80
- $dark-color3: $dark3 !default;
81
- $dark-color-gray: $dark2 !default;
82
- $dark-calendar-choose-color: $dark1 !default;
74
+ // 背景色
75
+ $background-color: $gray4 !default;
76
+ $background-color2: $gray5 !default;
77
+ $background-color3: $gray6 !default;
83
78
 
84
- // padding
85
- $padding-xs: 12px;
79
+ // 分割信息的颜色
80
+ $divider-color: $gray9 !default;
86
81
 
82
+ // ---- Font Family ----
87
83
  $font-family: PingFang SC, Microsoft YaHei, Helvetica, Hiragino Sans GB, SimSun,
88
84
  sans-serif !default;
89
85
 
@@ -103,12 +99,16 @@ $font-size-small: $font-size-1 !default;
103
99
  $font-size-base: $font-size-2 !default;
104
100
  $font-size-large: $font-size-3 !default;
105
101
  $line-height-base: 1.5 !default;
102
+
103
+ // padding
104
+ $padding-xs: 12px;
105
+
106
106
  // button(✅)
107
107
  $button-border-radius: 25px !default;
108
108
  $button-border-width: 1px !default;
109
109
  $button-default-bg-color: $white !default;
110
110
  $button-default-border-color: rgba(204, 204, 204, 1) !default;
111
- $button-default-color: rgba(102, 102, 102, 1) !default;
111
+ $button-default-color: $gray1 !default;
112
112
  $button-default-padding: 0 18px !default;
113
113
  $button-mini-padding: 0 12px !default;
114
114
  $button-small-padding: 0 12px !default;
@@ -169,11 +169,12 @@ $button-small-round-border-radius: $button-border-radius !default;
169
169
 
170
170
  // cell(✅)
171
171
 
172
- $cell-color: $title-color2 !default;
172
+ $cell-color: $gray1 !default;
173
173
  $cell-title-font: $font-size-2 !default;
174
174
  $cell-title-desc-font: $font-size-1 !default;
175
175
  $cell-desc-font: $font-size-2 !default;
176
- $cell-desc-color: $disable-color !default;
176
+ $cell-desc-color: $gray2 !default;
177
+ $cell-subtitle-color: $gray2 !default;
177
178
  $cell-border-radius: 6px !default;
178
179
  $cell-padding: 13px 16px !default;
179
180
  $cell-line-height: 20px !default;
@@ -183,7 +184,8 @@ $cell-default-icon-margin: 0 4px 0 0px !default;
183
184
  $cell-large-title-font: $font-size-large !default;
184
185
  $cell-large-title-desc-font: $font-size-base !default;
185
186
  $cell-large-padding: 15px 16px !default;
186
- $cell-background: $white !default;
187
+ $cell-background: $gray6 !default;
188
+ $cell-box-shaow: 0px 1px 7px 0px rgba(237, 238, 241, 1) !default;
187
189
 
188
190
  // cell-group(✅)
189
191
 
@@ -201,7 +203,7 @@ $cell-group-background-color: $white !default;
201
203
 
202
204
  $divider-margin: 16px 0 !default;
203
205
  $divider-text-font-size: $font-size-2 !default;
204
- $divider-text-color: #909ca4 !default;
206
+ $divider-text-color: $gray1 !default;
205
207
  $divider-line-height: 2px !default;
206
208
  $divider-before-margin-right: 16px !default;
207
209
  $divider-after-margin-left: 16px !default;
@@ -220,7 +222,7 @@ $icon-line-height: 20px !default;
220
222
 
221
223
  $uploader-picture-width: 100px !default;
222
224
  $uploader-picture-height: 100px !default;
223
- $uploader-background: #f7f8fa !default;
225
+ $uploader-background: $gray4 !default;
224
226
 
225
227
  // picker(✅)(todo:react版本picker组件dom元素类名变化较大,picker.scss暂不改动)
226
228
  $picker-cancel-color: #808080 !default;
@@ -237,7 +239,11 @@ $picker-item-active-text-color: inherit !default;
237
239
  $picker-item-text-font-size: 14px !default;
238
240
  $picker-item-active-line-border: 1px solid #d8d8d8 !default;
239
241
  $picker-columns-item-color: $title-color !default;
240
-
242
+ $picker-mask-bg-img: var(
243
+ --picker-mask-bg-img,
244
+ linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.4)),
245
+ linear-gradient(0deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.4))
246
+ ) !default;
241
247
  //input(✅)
242
248
  $input-border-bottom: #eaf0fb !default;
243
249
  $input-disabled-color: #c8c9cc !default;
@@ -257,10 +263,11 @@ $textarea-disabled-color: $disable-color !default;
257
263
 
258
264
  $inputnumber-icon-color: $title-color !default;
259
265
  $inputnumber-icon-void-color: $disable-color !default;
266
+ $inputnumber-icon-disabled-color: $gray2 !default;
260
267
  $inputnumber-icon-size: 20px !default;
261
268
  $inputnumber-input-font-size: 12px !default;
262
- $inputnumber-input-font-color: $title-color !default;
263
- $inputnumber-input-background-color: $help-color !default;
269
+ $inputnumber-input-font-color: $gray1 !default;
270
+ $inputnumber-input-background-color: $gray4 !default;
264
271
  $inputnumber-input-border-radius: 4px !default;
265
272
  $inputnumber-input-width: 40px !default;
266
273
  $inputnumber-input-margin: 0 6px !default;
@@ -360,7 +367,7 @@ $switch-inside-close-transform: translateX(30%) !default;
360
367
  // toast(✅)
361
368
  $toast-title-font-size: 16px !default;
362
369
  $toast-text-font-size: 14px !default;
363
- $toast-font-color: $white !default;
370
+ $toast-font-color: #fff !default;
364
371
  $toast-inner-padding: 24px 30px !default;
365
372
  $toast-inner-bg-color: $gray7 !default;
366
373
  $toast-inner-border-radius: 12px !default;
@@ -371,7 +378,7 @@ $backtop-border-color: #e0e0e0 !default;
371
378
 
372
379
  // calendar(✅)
373
380
  $calendar-primary-color: $primary-color !default;
374
- $calendar-choose-color: rgba($primary-color, 0.09) !default;
381
+ $calendar-choose-color: rgba(#fa2c19, 0.09) !default;
375
382
  $calendar-choose-font-color: $primary-color !default;
376
383
  $calendar-base-color: #333333 !default;
377
384
  $calendar-disable-color: #d1d0d0 !default;
@@ -390,8 +397,9 @@ $calendar-top-slot-height: 24px !default;
390
397
  $calendar-month-title-font-size: inherit !default;
391
398
 
392
399
  //overlay(✅)
393
- $overlay-bg-color: rgba(0, 0, 0, 0.7) !default;
394
-
400
+ $overlay-bg-color: $gray7 !default;
401
+ $overlay-content-bg-color: $gray6 !default;
402
+ $overlay-content-color: $gray1 !default;
395
403
  //popup(✅)
396
404
  $popup-close-icon-margin: 16px !default;
397
405
  $popup-border-radius: 20px !default;
@@ -447,8 +455,8 @@ $tabbar-word-margin-top: auto !default;
447
455
  $infiniteloading-bottom-color: #c8c8c8 !default;
448
456
 
449
457
  //range(✅)
450
- $range-tip-font-color: #333333 !default;
451
- $range-bg-color: rgba($primary-color, 0.5) !default;
458
+ $range-tip-font-color: $gray1 !default;
459
+ $range-bg-color: rgba(#fa2c19, 0.5) !default;
452
460
  $range-bg-color-tick: #fa958c !default;
453
461
  $range-bar-bg-color: linear-gradient(
454
462
  135deg,
@@ -492,16 +500,16 @@ $steps-base-icon-line-height: 25px !default;
492
500
  $steps-base-icon-font-size: 13px !default;
493
501
  $steps-base-title-font-size: 14px !default;
494
502
  $steps-base-line-color: #909ca4 !default;
495
- $steps-base-title-color: #909ca4 !default;
503
+ $steps-base-title-color: $title-color !default;
496
504
  $steps-base-title-margin-bottom: 10px !default;
497
505
  $steps-base-content-font-size: 14px !default;
498
- $steps-base-content-color: #666 !default;
506
+ $steps-base-content-color: $title-color2 !default;
499
507
 
500
508
  $steps-wait-icon-bg-color: #959fb1 !default;
501
509
  $steps-wait-icon-color: $white !default;
502
510
  $steps-wait-head-color: #909ca4 !default;
503
511
  $steps-wait-head-border-color: #909ca4 !default;
504
- $steps-wait-content-color: #909ca4 !default;
512
+ $steps-wait-content-color: $title-color2 !default;
505
513
 
506
514
  $steps-finish-head-color: $primary-color !default;
507
515
  $steps-finish-head-border-color: $primary-color !default;
@@ -522,12 +530,11 @@ $dialog-footer-justify-content: space-around !default;
522
530
  $dialog-min-height: 156px !default;
523
531
  $dialog-padding: 28px 24px 16px 24px !default;
524
532
  $dialog-header-height: 20px !default;
525
- $dialog-header-color: rgba(38, 38, 38, 1) !default;
526
533
  $dialog-content-margin: 20px 0 !default;
527
534
  $dialog-content-max-height: 268px !default;
528
535
  $dialog-content-line-height: 16px !default;
529
536
  $dialog-mask-z-index: 1050 !default;
530
- $dialog-mask-background-color: rgba($black, 0.7) !default;
537
+ $dialog-mask-background-color: $mask-color !default;
531
538
  $dialog-outer-z-index: 2000 !default;
532
539
  $dialog-outer-bordder-radius: 20px !default;
533
540
  $dialog-vertical-footer-ok-margin-top: 10px !default;
@@ -539,7 +546,7 @@ $dialog-footer-ok-max-width: 128px !default;
539
546
  //@import './animation/index';
540
547
 
541
548
  // checkbox(✅)
542
- $checkbox-label-color: #1d1e1e !default;
549
+ $checkbox-label-color: $gray1 !default;
543
550
  $checkbox-label-disable-color: #999 !default;
544
551
  $checkbox-icon-disable-color: #d6d6d6 !default;
545
552
  $checkbox-label-margin-left: 15px !default;
@@ -551,16 +558,16 @@ $checkbox-icon-disable-color2: $help-color !default;
551
558
  $radio-label-font-color: $gray1 !default;
552
559
  $radio-label-font-active-color: $primary-color !default;
553
560
  $radio-label-disable-color: $gray3 !default;
554
- $radio-icon-disable-color: $gray3 !default;
561
+ $radio-icon-disable-color: $gray2 !default;
555
562
  $radio-label-button-border-color: $primary-color !default;
556
- $radio-label-button-background: rgba($primary-color, 0.05) !default;
563
+ $radio-label-button-background: rgba(250, 44, 25, 0.05) !default;
557
564
  $radio-label-margin-left: 15px !default;
558
565
  $radio-button-border-radius: 15px !default;
559
566
  $radio-label-font-size: 14px !default;
560
567
  $radio-button-font-size: 12px !default;
561
568
  $radio-button-padding: 5px 18px !default;
562
569
  $radio-icon-font-size: 18px !default;
563
- $radio-icon-disable-color2: $help-color !default;
570
+ $radio-icon-disable-color2: $gray3 !default;
564
571
 
565
572
  // signature(✅)
566
573
  $signature-border-color: #dadada;
@@ -570,8 +577,8 @@ $signature-margin-bottom: 1rem;
570
577
  $signature-btn-margin-right: 15px;
571
578
 
572
579
  //fixednav(✅)
573
- $fixednav-bg-color: $white !default;
574
- $fixednav-font-color: $black !default;
580
+ $fixednav-bg-color: #fff !default;
581
+ $fixednav-font-color: #000 !default;
575
582
  $fixednav-index: 201 !default;
576
583
  $fixednav-btn-bg: linear-gradient(
577
584
  135deg,
@@ -722,7 +729,8 @@ $pagination-active-background-color: linear-gradient(
722
729
  $primary-color 0%,
723
730
  $primary-color-end 100%
724
731
  ) !default;
725
- $pagination-disable-color: rgba(116, 116, 116, 0.31) !default;
732
+ $dark-pagination-active-background-color: $dark-brand-color !default;
733
+ $pagination-disable-color: $disable-color !default;
726
734
  $pagination-disable-background-color: #f7f8fa !default;
727
735
  $pagination-item-border-width: 1px !default;
728
736
  $pagination-item-border-radius: 2px !default;
@@ -736,11 +744,11 @@ $tabs-titles-item-font-size: $font-size-2 !default;
736
744
  $tabs-titles-item-small-font-size: $font-size-1 !default;
737
745
  $tabs-titles-item-color: $title-color !default;
738
746
  $tabs-titles-item-active-color: $title-color !default;
739
- $tabs-titles-background-color: $help-color !default;
747
+ $tabs-titles-background-color: $background-color2 !default;
740
748
  $tabs-horizontal-tab-line-color: linear-gradient(
741
749
  90deg,
742
750
  $primary-color 0%,
743
- rgba($primary-color, 0.15) 100%
751
+ rgba(#fa2c19, 0.15) 100%
744
752
  ) !default;
745
753
  $tabs-horizontal-titles-height: 46px !default;
746
754
  $tabs-horizontal-titles-item-min-width: 50px !default;
@@ -788,6 +796,7 @@ $menu-bar-box-shadow: 0 2px 12px rgba(89, 89, 89, 0.12) !default;
788
796
  $menu-scroll-fixed-top: 0 !default;
789
797
  $menu-scroll-fixed-z-index: 1000 !default;
790
798
  $menu-active-item-font-weight: 500 !default;
799
+ $menu-item-content-bg-color: $gray6 !default;
791
800
 
792
801
  // collapse(✅)
793
802
  $collapse-item-padding: 13px 36px 13px 26px !default;
@@ -806,14 +815,15 @@ $collapse-wrapper-content-background-color: $white !default;
806
815
 
807
816
  // searchbar(✅)
808
817
 
809
- $searchbar-background: $white !default;
818
+ $searchbar-background: $gray6 !default;
810
819
  $searchbar-right-out-color: $black !default;
811
820
  $searchbar-padding: 9px 16px !default;
812
821
  $searchbar-width: 100% !default;
813
- $searchbar-action-text-color: #323233 !default;
822
+ $searchbar-action-text-color: $gray1 !default;
814
823
  $searchbar-input-height: 32px !default;
815
824
  $searchbar-input-padding: 0 28px !default;
816
825
  $searchbar-input-background: #f7f7f7 !default;
826
+ $searchbar-input-text-color: $gray1 !default;
817
827
  $searchbar-input-width: 100% !default;
818
828
  $searchbar-input-border-radius: 16px !default;
819
829
  $searchbar-input-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.04) !default;
@@ -916,14 +926,15 @@ $grid-border-color: #f5f6f7 !default;
916
926
  $grid-item-content-padding: 16px 8px !default;
917
927
  $grid-item-content-bg-color: $white !default;
918
928
  $grid-item-text-margin: 8px !default;
919
- $grid-item-text-color: $title-color2 !default;
929
+ $grid-item-text-color: $gray1 !default;
930
+ $grid-item-icon-color: $gray1 !default;
920
931
  $grid-item-text-font-size: $font-size-1 !default;
921
932
 
922
933
  // table(✅)
923
934
  $table-border-color: #ececec !default;
924
935
  $table-cols-padding: 10px !default;
925
- $table-tr-even-bg-color: #f3f3f3 !default;
926
- $table-tr-odd-bg-color: $white !default;
936
+ $table-tr-even-bg-color: $gray4 !default;
937
+ $table-tr-odd-bg-color: $gray6 !default;
927
938
 
928
939
  // navbar(✅)
929
940
  $navbar-height: 44px !default;
@@ -931,7 +942,7 @@ $navbar-margin-bottom: 20px !default;
931
942
  $navbar-padding: 13px 16px !default;
932
943
  $navbar-background: $white !default;
933
944
  $navbar-box-shadow: 0px 1px 7px 0px rgba(237, 238, 241, 1) !default;
934
- $navbar-color: $title-color2 !default;
945
+ $navbar-color: $gray1 !default;
935
946
  $navbar-title-base-font: $font-size-2 !default;
936
947
  $navbar-title-font: $font-size-2 !default;
937
948
  $navbar-title-font-weight: 0 !default;
@@ -961,14 +972,15 @@ $sidenavbar-item-line-height: 40px !default;
961
972
  $sidenavbar-item-font-size: 16px !default;
962
973
 
963
974
  // elevator(✅)
975
+ $elevator-list-inner-bg-color: $gray6 !default;
964
976
  $elevator-list-item-highcolor: $primary-color !default;
965
977
  $elevator-list-item-font-size: 12px !default;
966
- $elevator-list-item-font-color: #333333 !default;
978
+ $elevator-list-item-font-color: $gray1 !default;
967
979
  $elevator-list-item-name-padding: 0 20px !default;
968
980
  $elevator-list-item-name-height: 30px !default;
969
981
  $elevator-list-item-name-line-height: 30px !default;
970
982
  $elevator-list-item-code-font-size: 14px !default;
971
- $elevator-list-item-code-font-color: #1a1a1a !default;
983
+ $elevator-list-item-code-font-color: $gray1 !default;
972
984
  $elevator-list-item-code-font-weight: 500 !default;
973
985
  $elevator-list-item-code-padding: 0 20px !default;
974
986
  $elevator-list-item-code-height: 35px !default;
@@ -1036,7 +1048,7 @@ $category-pane-title-color: rgba(51, 51, 51, 1) !default;
1036
1048
  // circleProgress(✅)
1037
1049
  $circleprogress-primary-color: $primary-color !default;
1038
1050
  $circleprogress-path-color: #e5e9f2 !default;
1039
- $circleprogress-text-color: #000000 !default;
1051
+ $circleprogress-text-color: $title-color !default;
1040
1052
  $circleprogress-text-size: $font-size-3 !default;
1041
1053
 
1042
1054
  // Comment(✅ todo:react版本该组件暂无,将变量先迁过来)
@@ -1069,16 +1081,11 @@ $countup-width: 24px !default;
1069
1081
 
1070
1082
  // layout(✅)
1071
1083
  $row-content-color: #fff !default;
1072
- $row-content-background-color: #ff8881 !default;
1073
- $row-content-light-background-color: #ffc7c4 !default;
1074
- $row-content-border-radius: 6px !default;
1075
- $row-content-height: 50px !default;
1076
- $row-content-line-height: 40px !default;
1077
- $col-default-margin-bottom: 15px !default;
1078
-
1079
- $row-content-color: #fff !default;
1080
- $row-content-background-color: #ff8881 !default;
1081
- $row-content-light-background-color: #ffc7c4 !default;
1084
+ $row-content-background-color: var(--row-content-bg-color, #ff8881) !default;
1085
+ $row-content-light-background-color: var(
1086
+ --row-content-light-bg-color,
1087
+ #ffc7c4
1088
+ ) !default;
1082
1089
  $row-content-border-radius: 6px !default;
1083
1090
  $row-content-height: 50px !default;
1084
1091
  $row-content-line-height: 40px !default;
@@ -38,14 +38,12 @@ interface CellProps extends BasicComponent {
38
38
  icon: string;
39
39
  roundRadius: string | number;
40
40
  url: string;
41
- to: string;
42
41
  replace: boolean;
43
42
  center: boolean;
44
43
  size: string;
45
44
  className: string;
46
45
  iconSlot: ReactNode;
47
46
  linkSlot: ReactNode;
48
- click: (event: React__default.MouseEvent<HTMLDivElement, MouseEvent>) => void;
49
47
  onClick: (event: React__default.MouseEvent<HTMLDivElement, MouseEvent>) => void;
50
48
  }
51
49
  declare const Cell: FunctionComponent<Partial<CellProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'title'>>;
@@ -243,6 +241,8 @@ interface BaseLang {
243
241
 
244
242
  interface ConfigProviderProps {
245
243
  locale: BaseLang;
244
+ theme?: Record<string, string>;
245
+ [key: string]: any;
246
246
  }
247
247
  declare const ConfigProvider: FunctionComponent<Partial<ConfigProviderProps> & React__default.HTMLAttributes<HTMLDivElement>>;
248
248
 
@@ -417,7 +417,6 @@ interface TabbarItemProps extends BasicComponent {
417
417
  tabTitle: string;
418
418
  icon: string;
419
419
  href: string;
420
- to: any;
421
420
  num: string | number;
422
421
  active: boolean;
423
422
  activeColor: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nutui/nutui-react",
3
- "version": "1.3.15",
3
+ "version": "1.4.0-beta.0",
4
4
  "style": "dist/style.css",
5
5
  "main": "dist/nutui.react.umd.js",
6
6
  "module": "dist/esm/nutui-react.es.js",
@@ -64,8 +64,6 @@
64
64
  "lint": "eslint ./src/packages/calendar",
65
65
  "lint:fix": "eslint --fix ./src/packages/calendar",
66
66
  "publish:beta": "npm publish --tag beta",
67
- "prepublishOnly": "node scripts/taro/prepublish.js",
68
- "postpublish": "node scripts/taro/postpublish.js",
69
67
  "prepare": "husky install",
70
68
  "test": "jest",
71
69
  "test:demo": "jest --testNamePattern=^should match snapshot$ --runTestsByPath ./src/packages/collapse/__test__/collapse.spec.tsx",
@@ -93,9 +91,9 @@
93
91
  "@bem-react/classname": "^1.5.10",
94
92
  "@react-spring/web": "^9.3.2",
95
93
  "@use-gesture/react": "^10.2.9",
96
- "classnames": "^2.3.1",
97
94
  "async-validator": "^4.2.5",
98
- "react-router-dom": "^5.2.0",
95
+ "classnames": "^2.3.1",
96
+ "lodash": "^4.17.21",
99
97
  "react-transition-group": "^4.4.2"
100
98
  },
101
99
  "devDependencies": {
@@ -121,6 +119,7 @@
121
119
  "@testing-library/react": "^13.3.0",
122
120
  "@types/jest": "^27.4.1",
123
121
  "@types/loadable__component": "^5.13.3",
122
+ "@types/lodash": "^4.14.191",
124
123
  "@types/node": "^15.3.1",
125
124
  "@types/react": "^18.0.17",
126
125
  "@types/react-dom": "^18.0.6",