@nutui/nutui-react 3.0.13 → 3.0.14

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 (74) hide show
  1. package/CHANGELOG.md +31 -0
  2. package/dist/cjs/packages/configprovider/types.d.ts +1 -1
  3. package/dist/cjs/packages/datepicker/utils.js +1 -1
  4. package/dist/cjs/packages/elevator/elevator.d.ts +3 -20
  5. package/dist/cjs/packages/elevator/elevator.js +35 -22
  6. package/dist/cjs/packages/elevator/index.d.ts +1 -1
  7. package/dist/cjs/packages/elevator/style/elevator.scss +61 -33
  8. package/dist/cjs/packages/elevator/style/style.css +65 -40
  9. package/dist/cjs/packages/elevator/style-jmapp/elevator.scss +61 -33
  10. package/dist/cjs/packages/elevator/style-jmapp/style.css +56 -31
  11. package/dist/cjs/packages/elevator/style-jrkf/elevator.scss +61 -33
  12. package/dist/cjs/packages/elevator/style-jrkf/style.css +56 -31
  13. package/dist/cjs/packages/image/image.js +11 -15
  14. package/dist/cjs/packages/navbar/style/navbar.scss +2 -0
  15. package/dist/cjs/packages/navbar/style/style.css +2 -0
  16. package/dist/cjs/packages/navbar/style-jmapp/navbar.scss +2 -0
  17. package/dist/cjs/packages/navbar/style-jmapp/style.css +2 -0
  18. package/dist/cjs/packages/navbar/style-jrkf/navbar.scss +2 -0
  19. package/dist/cjs/packages/navbar/style-jrkf/style.css +2 -0
  20. package/dist/cjs/packages/price/style/price.scss +9 -0
  21. package/dist/cjs/packages/price/style/style.css +9 -0
  22. package/dist/cjs/packages/price/style-jmapp/price.scss +9 -0
  23. package/dist/cjs/packages/price/style-jmapp/style.css +9 -0
  24. package/dist/cjs/packages/price/style-jrkf/price.scss +9 -0
  25. package/dist/cjs/packages/price/style-jrkf/style.css +9 -0
  26. package/dist/cjs/packages/tabpane/style/style.css +1 -1
  27. package/dist/cjs/packages/tabpane/style/tabpane.scss +1 -1
  28. package/dist/cjs/packages/tabpane/style-jmapp/style.css +1 -1
  29. package/dist/cjs/packages/tabpane/style-jmapp/tabpane.scss +1 -1
  30. package/dist/cjs/packages/tabpane/style-jrkf/style.css +1 -1
  31. package/dist/cjs/packages/tabpane/style-jrkf/tabpane.scss +1 -1
  32. package/dist/cjs/types/spec/elevator/base.d.ts +5 -2
  33. package/dist/es/packages/configprovider/types.d.ts +1 -1
  34. package/dist/es/packages/datepicker/utils.js +1 -1
  35. package/dist/es/packages/elevator/elevator.d.ts +3 -20
  36. package/dist/es/packages/elevator/elevator.js +35 -22
  37. package/dist/es/packages/elevator/index.d.ts +1 -1
  38. package/dist/es/packages/elevator/style/elevator.scss +61 -33
  39. package/dist/es/packages/elevator/style/style.css +65 -40
  40. package/dist/es/packages/elevator/style-jmapp/elevator.scss +61 -33
  41. package/dist/es/packages/elevator/style-jmapp/style.css +56 -31
  42. package/dist/es/packages/elevator/style-jrkf/elevator.scss +61 -33
  43. package/dist/es/packages/elevator/style-jrkf/style.css +56 -31
  44. package/dist/es/packages/image/image.js +11 -15
  45. package/dist/es/packages/navbar/style/navbar.scss +2 -0
  46. package/dist/es/packages/navbar/style/style.css +2 -0
  47. package/dist/es/packages/navbar/style-jmapp/navbar.scss +2 -0
  48. package/dist/es/packages/navbar/style-jmapp/style.css +2 -0
  49. package/dist/es/packages/navbar/style-jrkf/navbar.scss +2 -0
  50. package/dist/es/packages/navbar/style-jrkf/style.css +2 -0
  51. package/dist/es/packages/price/style/price.scss +9 -0
  52. package/dist/es/packages/price/style/style.css +9 -0
  53. package/dist/es/packages/price/style-jmapp/price.scss +9 -0
  54. package/dist/es/packages/price/style-jmapp/style.css +9 -0
  55. package/dist/es/packages/price/style-jrkf/price.scss +9 -0
  56. package/dist/es/packages/price/style-jrkf/style.css +9 -0
  57. package/dist/es/packages/tabpane/style/style.css +1 -1
  58. package/dist/es/packages/tabpane/style/tabpane.scss +1 -1
  59. package/dist/es/packages/tabpane/style-jmapp/style.css +1 -1
  60. package/dist/es/packages/tabpane/style-jmapp/tabpane.scss +1 -1
  61. package/dist/es/packages/tabpane/style-jrkf/style.css +1 -1
  62. package/dist/es/packages/tabpane/style-jrkf/tabpane.scss +1 -1
  63. package/dist/es/types/spec/elevator/base.d.ts +15 -6
  64. package/dist/nutui.react.umd.js +240 -233
  65. package/dist/style-jmapp.css +1 -1
  66. package/dist/style-jmapp.scss +31 -31
  67. package/dist/style-jrkf.css +1 -1
  68. package/dist/style-jrkf.scss +40 -40
  69. package/dist/style.css +1 -1
  70. package/dist/style.scss +32 -32
  71. package/dist/styles/variables-jmapp.scss +14 -2
  72. package/dist/styles/variables-jrkf.scss +14 -2
  73. package/dist/styles/variables.scss +24 -43
  74. package/package.json +1 -1
package/dist/es/packages/elevator/style-jmapp/elevator.scss CHANGED
@@ -1,68 +1,66 @@
1
1
  .nut-elevator {
2
- width: 100%;
3
- display: block;
4
2
  position: relative;
5
- overflow: hidden;
3
+ display: flex;
4
+ width: 100%;
6
5
 
7
6
  &-list {
8
- display: block;
9
7
  position: relative;
10
8
  top: 0;
9
+ display: flex;
10
+ width: 100%;
11
11
  overflow: hidden;
12
- font-size: $elevator-list-font-size;
13
- color: $elevator-list-color;
14
12
 
15
13
  &-inner {
16
- height: 100%;
14
+ display: flex;
15
+ flex-direction: column;
16
+ min-height: 100%;
17
17
  width: 100%;
18
- display: block;
19
18
  background-color: $elevator-list-bg-color;
20
19
  overflow: auto;
21
20
  }
22
21
 
23
22
  &-item {
24
- display: block;
25
-
23
+ display: flex;
24
+ &-sublist {
25
+ display: flex;
26
+ flex-direction: column;
27
+ }
26
28
  &-code {
27
29
  display: flex;
28
- position: relative;
30
+ align-items: center;
29
31
  height: $elevator-list-item-code-height;
30
- line-height: $elevator-list-item-code-line-height;
31
32
  font-size: $elevator-list-item-code-font-size;
32
33
  color: $elevator-list-item-code-color;
33
- padding: $elevator-list-item-padding;
34
34
  font-weight: $elevator-list-item-code-font-weight;
35
- box-sizing: border-box;
36
- border-bottom: $elevator-list-item-code-border-bottom;
37
- background-color: $elevator-list-item-code-background-color;
38
35
  }
39
36
 
40
37
  &-name {
41
38
  display: flex;
42
39
  align-items: center;
43
- padding: $elevator-list-item-padding;
44
40
  height: $elevator-list-item-name-height;
45
- line-height: $elevator-list-item-name-line-height;
41
+ font-size: $elevator-list-font-size;
42
+ color: $elevator-list-color;
46
43
 
47
44
  &-highcolor {
48
45
  color: $color-primary;
46
+ font-weight: 600;
49
47
  }
50
48
  }
51
49
  }
52
50
 
53
51
  &-fixed {
54
- display: flex;
55
- align-items: center;
56
- width: 100%;
57
52
  position: absolute;
58
53
  top: 0;
59
54
  left: 0;
60
55
  z-index: 1;
56
+ display: flex;
57
+ align-items: center;
58
+ width: 100%;
61
59
  padding: $elevator-list-item-padding;
62
60
  height: $elevator-list-item-code-height;
63
- background-color: $elevator-list-fixed-bg-color;
64
61
  box-sizing: border-box;
65
62
  box-shadow: $elevator-list-fixed-box-shadow;
63
+ background-color: $elevator-list-fixed-bg-color;
66
64
  &-title {
67
65
  font-size: $elevator-list-item-code-font-size;
68
66
  color: $elevator-list-fixed-color;
@@ -76,41 +74,71 @@
76
74
  right: $elevator-list-item-code-current-right;
77
75
  top: $elevator-list-item-code-current-top;
78
76
  transform: $elevator-bars-transform;
77
+ display: flex;
78
+ align-items: center;
79
+ justify-content: center;
79
80
  width: $elevator-list-item-code-current-width;
80
81
  height: $elevator-list-item-code-current-height;
81
- line-height: $elevator-list-item-code-current-line-height;
82
82
  border-radius: $elevator-list-item-code-current-border-radius;
83
83
  background: $elevator-list-item-code-current-bg-color;
84
84
  box-shadow: $elevator-list-item-code-current-box-shadow;
85
- text-align: $elevator-list-item-code-current-text-align;
85
+ color: $elevator-list-item-code-current-color;
86
86
  }
87
87
 
88
88
  &-bars {
89
89
  position: absolute;
90
90
  right: $elevator-bars-right;
91
91
  top: $elevator-bars-top;
92
- color: $color-text-help;
93
- font-size: $elevator-bars-font-size;
94
92
  transform: $elevator-bars-transform;
95
- padding: $elevator-bars-padding;
96
- background-color: $elevator-bars-background-color;
97
- border-radius: $elevator-bars-border-radius;
98
- text-align: center;
99
93
  z-index: $elevator-bars-z-index;
100
94
 
101
95
  &-inner {
96
+ display: flex;
97
+ flex-direction: column;
102
98
  &-item {
103
- display: block;
104
- padding: $elevator-bars-inner-item-padding;
99
+ display: inline-flex;
100
+ align-items: center;
101
+ justify-content: center;
102
+ height: 16px;
103
+ width: 16px;
104
+ border-radius: 50%;
105
+ margin: 1px 0;
106
+ color: $elevator-bars-color;
107
+ font-size: $elevator-bars-font-size;
105
108
  cursor: pointer;
106
-
107
109
  &-active {
108
110
  font-weight: $font-weight-bold;
109
111
  color: $elevator-bars-active-color;
112
+ /* #ifndef weapp jd*/
113
+ background: linear-gradient(to right, #ff475d, #ff0f23);
114
+ /* #endif */
115
+ /* #ifdef weapp jd*/
116
+ background: #ff0f23;
117
+ /* #endif */
110
118
  }
111
119
  }
112
120
  }
113
121
  }
122
+ &-horizontal {
123
+ .nut-elevator-list-item {
124
+ &-code {
125
+ width: $elevator-list-item-code-width;
126
+ justify-content: center;
127
+ }
128
+ }
129
+ }
130
+ &-vertical {
131
+ .nut-elevator-list-item {
132
+ flex-direction: column;
133
+ &-code {
134
+ border-bottom: $elevator-list-item-code-border-bottom;
135
+ }
136
+ &-name,
137
+ &-code {
138
+ padding: $elevator-list-item-padding;
139
+ }
140
+ }
141
+ }
114
142
  }
115
143
 
116
144
  [dir='rtl'] .nut-elevator,
package/dist/es/packages/elevator/style-jmapp/style.css CHANGED
@@ -3,65 +3,64 @@
3
3
  /* #ifndef harmony */
4
4
  /* #endif */
5
5
  .nut-elevator {
6
- width: 100%;
7
- display: block;
8
6
  position: relative;
9
- overflow: hidden;
7
+ display: flex;
8
+ width: 100%;
10
9
  }
11
10
  .nut-elevator-list {
12
- display: block;
13
11
  position: relative;
14
12
  top: 0;
13
+ display: flex;
14
+ width: 100%;
15
15
  overflow: hidden;
16
- font-size: var(--nutui-elevator-list-font-size, var(--nutui-font-text-small));
17
- color: var(--nutui-elevator-list-color, var(--nutui-color-title));
18
16
  }
19
17
  .nut-elevator-list-inner {
20
- height: 100%;
18
+ display: flex;
19
+ flex-direction: column;
20
+ min-height: 100%;
21
21
  width: 100%;
22
- display: block;
23
22
  background-color: var(--nutui-elevator-list-bg-color, #ffffff);
24
23
  overflow: auto;
25
24
  }
26
25
  .nut-elevator-list-item {
27
- display: block;
26
+ display: flex;
27
+ }
28
+ .nut-elevator-list-item-sublist {
29
+ display: flex;
30
+ flex-direction: column;
28
31
  }
29
32
  .nut-elevator-list-item-code {
30
33
  display: flex;
31
- position: relative;
34
+ align-items: center;
32
35
  height: var(--nutui-elevator-list-item-code-height, 20px);
33
- line-height: var(--nutui-elevator-list-item-code-line-height, 20px);
34
36
  font-size: var(--nutui-elevator-list-item-code-font-size, var(--nutui-font-text));
35
37
  color: var(--nutui-elevator-list-item-code-color, var(--nutui-color-title));
36
- padding: var(--nutui-elevator-list-item-padding, 0 20px);
37
38
  font-weight: var(--nutui-elevator-list-item-code-font-weight, var(--nutui-font-weight-bold));
38
- box-sizing: border-box;
39
- border-bottom: var(--nutui-elevator-list-item-code-border-bottom, none);
40
- background-color: var(--nutui-elevator-list-item-code-background-color, var(--nutui-color-default-light));
41
39
  }
42
40
  .nut-elevator-list-item-name {
43
41
  display: flex;
44
42
  align-items: center;
45
- padding: var(--nutui-elevator-list-item-padding, 0 20px);
46
43
  height: var(--nutui-elevator-list-item-name-height, 52px);
47
- line-height: var(--nutui-elevator-list-item-name-line-height, 52px);
44
+ font-size: var(--nutui-elevator-list-font-size, var(--nutui-font-text-small));
45
+ color: var(--nutui-elevator-list-color, var(--nutui-color-title));
48
46
  }
49
47
  .nut-elevator-list-item-name-highcolor {
50
48
  color: var(--nutui-color-primary);
49
+ font-weight: 600;
51
50
  }
52
51
  .nut-elevator-list-fixed {
53
- display: flex;
54
- align-items: center;
55
- width: 100%;
56
52
  position: absolute;
57
53
  top: 0;
58
54
  left: 0;
59
55
  z-index: 1;
56
+ display: flex;
57
+ align-items: center;
58
+ width: 100%;
60
59
  padding: var(--nutui-elevator-list-item-padding, 0 20px);
61
60
  height: var(--nutui-elevator-list-item-code-height, 20px);
62
- background-color: var(--nutui-elevator-list-fixed-bg-color, var(--nutui-color-default-light));
63
61
  box-sizing: border-box;
64
62
  box-shadow: var(--nutui-elevator-list-fixed-box-shadow, 0 0 10px #eee);
63
+ background-color: var(--nutui-elevator-list-fixed-bg-color, var(--nutui-color-default-light));
65
64
  }
66
65
  .nut-elevator-list-fixed-title {
67
66
  font-size: var(--nutui-elevator-list-item-code-font-size, var(--nutui-font-text));
@@ -73,35 +72,61 @@
73
72
  right: var(--nutui-elevator-list-item-code-current-right, 40px);
74
73
  top: var(--nutui-elevator-list-item-code-current-top, 50%);
75
74
  transform: var(--nutui-elevator-bars-transform, translateY(-50%));
75
+ display: flex;
76
+ align-items: center;
77
+ justify-content: center;
76
78
  width: var(--nutui-elevator-list-item-code-current-width, 48px);
77
79
  height: var(--nutui-elevator-list-item-code-current-height, 48px);
78
- line-height: var(--nutui-elevator-list-item-code-current-line-height, 48px);
79
80
  border-radius: var(--nutui-elevator-list-item-code-current-border-radius, 50% 0 50% 50%);
80
81
  background: var(--nutui-elevator-list-item-code-current-bg-color, var(--nutui-color-default-light));
81
82
  box-shadow: 0px 2px 6px 0px rgba(4, 1, 135, 0.08);
82
- text-align: var(--nutui-elevator-list-item-code-current-text-align, center);
83
+ color: var(--nutui-elevator-list-item-code-current-color, #ffffff);
83
84
  }
84
85
  .nut-elevator-bars {
85
86
  position: absolute;
86
87
  right: var(--nutui-elevator-bars-right, 10px);
87
88
  top: var(--nutui-elevator-bars-top, 50%);
88
- color: var(--nutui-color-text-help);
89
- font-size: var(--nutui-elevator-bars-font-size, var(--nutui-font-text-xs));
90
89
  transform: var(--nutui-elevator-bars-transform, translateY(-50%));
91
- padding: var(--nutui-elevator-bars-padding, 15px 0);
92
- background-color: var(--nutui-elevator-bars-background-color, transparent);
93
- border-radius: var(--nutui-elevator-bars-border-radius, 6px);
94
- text-align: center;
95
90
  z-index: var(--nutui-elevator-bars-z-index, 2);
96
91
  }
92
+ .nut-elevator-bars-inner {
93
+ display: flex;
94
+ flex-direction: column;
95
+ }
97
96
  .nut-elevator-bars-inner-item {
98
- display: block;
99
- padding: var(--nutui-elevator-bars-inner-item-padding, 3px);
97
+ display: inline-flex;
98
+ align-items: center;
99
+ justify-content: center;
100
+ height: 16px;
101
+ width: 16px;
102
+ border-radius: 50%;
103
+ margin: 1px 0;
104
+ color: var(--nutui-elevator-bars-color, var(--nutui-color-text-help));
105
+ font-size: var(--nutui-elevator-bars-font-size, var(--nutui-font-text-xs));
100
106
  cursor: pointer;
101
107
  }
102
108
  .nut-elevator-bars-inner-item-active {
103
109
  font-weight: var(--nutui-font-weight-bold);
104
110
  color: var(--nutui-elevator-bars-active-color, var(--nutui-color-primary));
111
+ /* #ifndef weapp jd*/
112
+ background: linear-gradient(to right, #ff475d, #ff0f23);
113
+ /* #endif */
114
+ /* #ifdef weapp jd*/
115
+ background: #ff0f23;
116
+ /* #endif */
117
+ }
118
+ .nut-elevator-horizontal .nut-elevator-list-item-code {
119
+ width: var(--nutui-elevator-list-item-code-width, 34px);
120
+ justify-content: center;
121
+ }
122
+ .nut-elevator-vertical .nut-elevator-list-item {
123
+ flex-direction: column;
124
+ }
125
+ .nut-elevator-vertical .nut-elevator-list-item-code {
126
+ border-bottom: var(--nutui-elevator-list-item-code-border-bottom, none);
127
+ }
128
+ .nut-elevator-vertical .nut-elevator-list-item-name, .nut-elevator-vertical .nut-elevator-list-item-code {
129
+ padding: var(--nutui-elevator-list-item-padding, 0 20px);
105
130
  }
106
131
 
107
132
  [dir=rtl] .nut-elevator-list-fixed,
package/dist/es/packages/elevator/style-jrkf/elevator.scss CHANGED
@@ -1,68 +1,66 @@
1
1
  .nut-elevator {
2
- width: 100%;
3
- display: block;
4
2
  position: relative;
5
- overflow: hidden;
3
+ display: flex;
4
+ width: 100%;
6
5
 
7
6
  &-list {
8
- display: block;
9
7
  position: relative;
10
8
  top: 0;
9
+ display: flex;
10
+ width: 100%;
11
11
  overflow: hidden;
12
- font-size: $elevator-list-font-size;
13
- color: $elevator-list-color;
14
12
 
15
13
  &-inner {
16
- height: 100%;
14
+ display: flex;
15
+ flex-direction: column;
16
+ min-height: 100%;
17
17
  width: 100%;
18
- display: block;
19
18
  background-color: $elevator-list-bg-color;
20
19
  overflow: auto;
21
20
  }
22
21
 
23
22
  &-item {
24
- display: block;
25
-
23
+ display: flex;
24
+ &-sublist {
25
+ display: flex;
26
+ flex-direction: column;
27
+ }
26
28
  &-code {
27
29
  display: flex;
28
- position: relative;
30
+ align-items: center;
29
31
  height: $elevator-list-item-code-height;
30
- line-height: $elevator-list-item-code-line-height;
31
32
  font-size: $elevator-list-item-code-font-size;
32
33
  color: $elevator-list-item-code-color;
33
- padding: $elevator-list-item-padding;
34
34
  font-weight: $elevator-list-item-code-font-weight;
35
- box-sizing: border-box;
36
- border-bottom: $elevator-list-item-code-border-bottom;
37
- background-color: $elevator-list-item-code-background-color;
38
35
  }
39
36
 
40
37
  &-name {
41
38
  display: flex;
42
39
  align-items: center;
43
- padding: $elevator-list-item-padding;
44
40
  height: $elevator-list-item-name-height;
45
- line-height: $elevator-list-item-name-line-height;
41
+ font-size: $elevator-list-font-size;
42
+ color: $elevator-list-color;
46
43
 
47
44
  &-highcolor {
48
45
  color: $color-primary;
46
+ font-weight: 600;
49
47
  }
50
48
  }
51
49
  }
52
50
 
53
51
  &-fixed {
54
- display: flex;
55
- align-items: center;
56
- width: 100%;
57
52
  position: absolute;
58
53
  top: 0;
59
54
  left: 0;
60
55
  z-index: 1;
56
+ display: flex;
57
+ align-items: center;
58
+ width: 100%;
61
59
  padding: $elevator-list-item-padding;
62
60
  height: $elevator-list-item-code-height;
63
- background-color: $elevator-list-fixed-bg-color;
64
61
  box-sizing: border-box;
65
62
  box-shadow: $elevator-list-fixed-box-shadow;
63
+ background-color: $elevator-list-fixed-bg-color;
66
64
  &-title {
67
65
  font-size: $elevator-list-item-code-font-size;
68
66
  color: $elevator-list-fixed-color;
@@ -76,41 +74,71 @@
76
74
  right: $elevator-list-item-code-current-right;
77
75
  top: $elevator-list-item-code-current-top;
78
76
  transform: $elevator-bars-transform;
77
+ display: flex;
78
+ align-items: center;
79
+ justify-content: center;
79
80
  width: $elevator-list-item-code-current-width;
80
81
  height: $elevator-list-item-code-current-height;
81
- line-height: $elevator-list-item-code-current-line-height;
82
82
  border-radius: $elevator-list-item-code-current-border-radius;
83
83
  background: $elevator-list-item-code-current-bg-color;
84
84
  box-shadow: $elevator-list-item-code-current-box-shadow;
85
- text-align: $elevator-list-item-code-current-text-align;
85
+ color: $elevator-list-item-code-current-color;
86
86
  }
87
87
 
88
88
  &-bars {
89
89
  position: absolute;
90
90
  right: $elevator-bars-right;
91
91
  top: $elevator-bars-top;
92
- color: $color-text-help;
93
- font-size: $elevator-bars-font-size;
94
92
  transform: $elevator-bars-transform;
95
- padding: $elevator-bars-padding;
96
- background-color: $elevator-bars-background-color;
97
- border-radius: $elevator-bars-border-radius;
98
- text-align: center;
99
93
  z-index: $elevator-bars-z-index;
100
94
 
101
95
  &-inner {
96
+ display: flex;
97
+ flex-direction: column;
102
98
  &-item {
103
- display: block;
104
- padding: $elevator-bars-inner-item-padding;
99
+ display: inline-flex;
100
+ align-items: center;
101
+ justify-content: center;
102
+ height: 16px;
103
+ width: 16px;
104
+ border-radius: 50%;
105
+ margin: 1px 0;
106
+ color: $elevator-bars-color;
107
+ font-size: $elevator-bars-font-size;
105
108
  cursor: pointer;
106
-
107
109
  &-active {
108
110
  font-weight: $font-weight-bold;
109
111
  color: $elevator-bars-active-color;
112
+ /* #ifndef weapp jd*/
113
+ background: linear-gradient(to right, #ff475d, #ff0f23);
114
+ /* #endif */
115
+ /* #ifdef weapp jd*/
116
+ background: #ff0f23;
117
+ /* #endif */
110
118
  }
111
119
  }
112
120
  }
113
121
  }
122
+ &-horizontal {
123
+ .nut-elevator-list-item {
124
+ &-code {
125
+ width: $elevator-list-item-code-width;
126
+ justify-content: center;
127
+ }
128
+ }
129
+ }
130
+ &-vertical {
131
+ .nut-elevator-list-item {
132
+ flex-direction: column;
133
+ &-code {
134
+ border-bottom: $elevator-list-item-code-border-bottom;
135
+ }
136
+ &-name,
137
+ &-code {
138
+ padding: $elevator-list-item-padding;
139
+ }
140
+ }
141
+ }
114
142
  }
115
143
 
116
144
  [dir='rtl'] .nut-elevator,
package/dist/es/packages/elevator/style-jrkf/style.css CHANGED
@@ -3,65 +3,64 @@
3
3
  /* #ifndef harmony */
4
4
  /* #endif */
5
5
  .nut-elevator {
6
- width: 100%;
7
- display: block;
8
6
  position: relative;
9
- overflow: hidden;
7
+ display: flex;
8
+ width: 100%;
10
9
  }
11
10
  .nut-elevator-list {
12
- display: block;
13
11
  position: relative;
14
12
  top: 0;
13
+ display: flex;
14
+ width: 100%;
15
15
  overflow: hidden;
16
- font-size: var(--nutui-elevator-list-font-size, var(--nutui-font-text-small));
17
- color: var(--nutui-elevator-list-color, var(--nutui-color-title));
18
16
  }
19
17
  .nut-elevator-list-inner {
20
- height: 100%;
18
+ display: flex;
19
+ flex-direction: column;
20
+ min-height: 100%;
21
21
  width: 100%;
22
- display: block;
23
22
  background-color: var(--nutui-elevator-list-bg-color, #ffffff);
24
23
  overflow: auto;
25
24
  }
26
25
  .nut-elevator-list-item {
27
- display: block;
26
+ display: flex;
27
+ }
28
+ .nut-elevator-list-item-sublist {
29
+ display: flex;
30
+ flex-direction: column;
28
31
  }
29
32
  .nut-elevator-list-item-code {
30
33
  display: flex;
31
- position: relative;
34
+ align-items: center;
32
35
  height: var(--nutui-elevator-list-item-code-height, 20px);
33
- line-height: var(--nutui-elevator-list-item-code-line-height, 20px);
34
36
  font-size: var(--nutui-elevator-list-item-code-font-size, var(--nutui-font-text));
35
37
  color: var(--nutui-elevator-list-item-code-color, var(--nutui-color-title));
36
- padding: var(--nutui-elevator-list-item-padding, 0 20px);
37
38
  font-weight: var(--nutui-elevator-list-item-code-font-weight, var(--nutui-font-weight-bold));
38
- box-sizing: border-box;
39
- border-bottom: var(--nutui-elevator-list-item-code-border-bottom, none);
40
- background-color: var(--nutui-elevator-list-item-code-background-color, var(--nutui-color-default-light));
41
39
  }
42
40
  .nut-elevator-list-item-name {
43
41
  display: flex;
44
42
  align-items: center;
45
- padding: var(--nutui-elevator-list-item-padding, 0 20px);
46
43
  height: var(--nutui-elevator-list-item-name-height, 52px);
47
- line-height: var(--nutui-elevator-list-item-name-line-height, 52px);
44
+ font-size: var(--nutui-elevator-list-font-size, var(--nutui-font-text-small));
45
+ color: var(--nutui-elevator-list-color, var(--nutui-color-title));
48
46
  }
49
47
  .nut-elevator-list-item-name-highcolor {
50
48
  color: var(--nutui-color-primary, #ff6666);
49
+ font-weight: 600;
51
50
  }
52
51
  .nut-elevator-list-fixed {
53
- display: flex;
54
- align-items: center;
55
- width: 100%;
56
52
  position: absolute;
57
53
  top: 0;
58
54
  left: 0;
59
55
  z-index: 1;
56
+ display: flex;
57
+ align-items: center;
58
+ width: 100%;
60
59
  padding: var(--nutui-elevator-list-item-padding, 0 20px);
61
60
  height: var(--nutui-elevator-list-item-code-height, 20px);
62
- background-color: var(--nutui-elevator-list-fixed-bg-color, var(--nutui-color-default-light));
63
61
  box-sizing: border-box;
64
62
  box-shadow: var(--nutui-elevator-list-fixed-box-shadow, 0 0 10px #eee);
63
+ background-color: var(--nutui-elevator-list-fixed-bg-color, var(--nutui-color-default-light));
65
64
  }
66
65
  .nut-elevator-list-fixed-title {
67
66
  font-size: var(--nutui-elevator-list-item-code-font-size, var(--nutui-font-text));
@@ -73,35 +72,61 @@
73
72
  right: var(--nutui-elevator-list-item-code-current-right, 40px);
74
73
  top: var(--nutui-elevator-list-item-code-current-top, 50%);
75
74
  transform: var(--nutui-elevator-bars-transform, translateY(-50%));
75
+ display: flex;
76
+ align-items: center;
77
+ justify-content: center;
76
78
  width: var(--nutui-elevator-list-item-code-current-width, 48px);
77
79
  height: var(--nutui-elevator-list-item-code-current-height, 48px);
78
- line-height: var(--nutui-elevator-list-item-code-current-line-height, 48px);
79
80
  border-radius: var(--nutui-elevator-list-item-code-current-border-radius, 50% 0 50% 50%);
80
81
  background: var(--nutui-elevator-list-item-code-current-bg-color, var(--nutui-color-default-light));
81
82
  box-shadow: 0px 2px 6px 0px rgba(4, 1, 135, 0.08);
82
- text-align: var(--nutui-elevator-list-item-code-current-text-align, center);
83
+ color: var(--nutui-elevator-list-item-code-current-color, #ffffff);
83
84
  }
84
85
  .nut-elevator-bars {
85
86
  position: absolute;
86
87
  right: var(--nutui-elevator-bars-right, 10px);
87
88
  top: var(--nutui-elevator-bars-top, 50%);
88
- color: var(--nutui-color-text-help);
89
- font-size: var(--nutui-elevator-bars-font-size, var(--nutui-font-text-xs));
90
89
  transform: var(--nutui-elevator-bars-transform, translateY(-50%));
91
- padding: var(--nutui-elevator-bars-padding, 15px 0);
92
- background-color: var(--nutui-elevator-bars-background-color, transparent);
93
- border-radius: var(--nutui-elevator-bars-border-radius, 6px);
94
- text-align: center;
95
90
  z-index: var(--nutui-elevator-bars-z-index, 2);
96
91
  }
92
+ .nut-elevator-bars-inner {
93
+ display: flex;
94
+ flex-direction: column;
95
+ }
97
96
  .nut-elevator-bars-inner-item {
98
- display: block;
99
- padding: var(--nutui-elevator-bars-inner-item-padding, 3px);
97
+ display: inline-flex;
98
+ align-items: center;
99
+ justify-content: center;
100
+ height: 16px;
101
+ width: 16px;
102
+ border-radius: 50%;
103
+ margin: 1px 0;
104
+ color: var(--nutui-elevator-bars-color, var(--nutui-color-text-help));
105
+ font-size: var(--nutui-elevator-bars-font-size, var(--nutui-font-text-xs));
100
106
  cursor: pointer;
101
107
  }
102
108
  .nut-elevator-bars-inner-item-active {
103
109
  font-weight: var(--nutui-font-weight-bold);
104
110
  color: var(--nutui-elevator-bars-active-color, var(--nutui-color-primary, #ff6666));
111
+ /* #ifndef weapp jd*/
112
+ background: linear-gradient(to right, #ff475d, #ff0f23);
113
+ /* #endif */
114
+ /* #ifdef weapp jd*/
115
+ background: #ff0f23;
116
+ /* #endif */
117
+ }
118
+ .nut-elevator-horizontal .nut-elevator-list-item-code {
119
+ width: var(--nutui-elevator-list-item-code-width, 34px);
120
+ justify-content: center;
121
+ }
122
+ .nut-elevator-vertical .nut-elevator-list-item {
123
+ flex-direction: column;
124
+ }
125
+ .nut-elevator-vertical .nut-elevator-list-item-code {
126
+ border-bottom: var(--nutui-elevator-list-item-code-border-bottom, none);
127
+ }
128
+ .nut-elevator-vertical .nut-elevator-list-item-name, .nut-elevator-vertical .nut-elevator-list-item-code {
129
+ padding: var(--nutui-elevator-list-item-padding, 0 20px);
105
130
  }
106
131
 
107
132
  [dir=rtl] .nut-elevator-list-fixed,
package/dist/es/packages/image/image.js CHANGED
@@ -1,3 +1,4 @@
1
+ import { _ as _define_property } from "@swc/helpers/_/_define_property";
1
2
  import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
2
3
  import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
3
4
  import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
@@ -154,25 +155,20 @@ export var Image = function(props) {
154
155
  onClick: function(e) {
155
156
  imageClick(e);
156
157
  }
157
- }, lazy ? /*#__PURE__*/ React.createElement("img", {
158
+ }, /*#__PURE__*/ React.createElement("img", _object_spread_props(_object_spread({
158
159
  ref: imgRef,
159
- className: "".concat(classPrefix, "-default lazyload"),
160
- style: imgStyle,
161
- "data-src": src,
160
+ className: classNames("".concat(classPrefix, "-default"), lazy && 'lazyload', _define_property({}, "".concat(classPrefix, "-error"), isError)),
161
+ style: imgStyle
162
+ }, lazy ? {
163
+ 'data-src': src,
164
+ loading: 'lazy'
165
+ } : {
166
+ src: src
167
+ }), {
162
168
  alt: alt,
163
- loading: "lazy",
164
169
  onLoad: handleLoad,
165
170
  onError: handleError,
166
171
  draggable: draggable
167
- }) : /*#__PURE__*/ React.createElement("img", {
168
- ref: imgRef,
169
- className: "".concat(classPrefix, "-default"),
170
- style: imgStyle,
171
- src: src,
172
- alt: alt,
173
- onLoad: handleLoad,
174
- onError: handleError,
175
- draggable: draggable
176
- }), renderLoading(), renderErrorImg());
172
+ })), renderLoading(), renderErrorImg());
177
173
  };
178
174
  Image.displayName = 'NutImage';