@tendaui/react 1.1.6 → 1.2.4
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.
|
@@ -31,26 +31,31 @@
|
|
|
31
31
|
position: absolute;
|
|
32
32
|
left: 0;
|
|
33
33
|
}
|
|
34
|
-
.t-input-number
|
|
34
|
+
.t-input-number {
|
|
35
35
|
margin-left: var(--td-comp-paddingLR-s);
|
|
36
36
|
}
|
|
37
|
-
|
|
37
|
+
|
|
38
|
+
.t-input__prefix {
|
|
38
39
|
margin-right: var(--td-comp-paddingLR-s);
|
|
39
40
|
}
|
|
40
|
-
|
|
41
|
+
|
|
42
|
+
.t-input {
|
|
41
43
|
color: var(--td-text-color-primary);
|
|
42
44
|
}
|
|
43
|
-
|
|
45
|
+
|
|
46
|
+
.t-input-number--auto-width {
|
|
44
47
|
width: auto;
|
|
45
48
|
}
|
|
46
|
-
.t-input-number
|
|
49
|
+
.t-input-number--auto-width.t-is-controls-right {
|
|
47
50
|
min-width: auto;
|
|
48
51
|
width: auto;
|
|
49
52
|
}
|
|
50
|
-
.t-input-number
|
|
53
|
+
.t-input-number--auto-width .t-input__inner {
|
|
51
54
|
min-width: 42px;
|
|
52
55
|
}
|
|
53
|
-
|
|
56
|
+
|
|
57
|
+
.t-input-number__decrease,
|
|
58
|
+
.t-input-number__increase {
|
|
54
59
|
width: var(--td-comp-size-m);
|
|
55
60
|
height: var(--td-comp-size-m);
|
|
56
61
|
position: absolute;
|
|
@@ -65,47 +70,58 @@
|
|
|
65
70
|
z-index: 1;
|
|
66
71
|
cursor: pointer;
|
|
67
72
|
}
|
|
68
|
-
.t-input-
|
|
73
|
+
.t-input-number__decrease:hover,
|
|
74
|
+
.t-input-number__increase:hover {
|
|
69
75
|
color: var(--td-brand-color);
|
|
70
76
|
border-color: var(--td-brand-color);
|
|
71
77
|
}
|
|
72
|
-
.t-input-
|
|
78
|
+
.t-input-number__decrease:hover .t-icon,
|
|
79
|
+
.t-input-number__increase:hover .t-icon {
|
|
73
80
|
color: var(--td-brand-color);
|
|
74
81
|
}
|
|
75
|
-
.t-input-
|
|
82
|
+
.t-input-number__decrease:active,
|
|
83
|
+
.t-input-number__increase:active {
|
|
76
84
|
color: var(--td-brand-color);
|
|
77
85
|
background-color: var(--td-bg-color-container-hover);
|
|
78
86
|
}
|
|
79
|
-
.t-input-
|
|
87
|
+
.t-input-number__decrease .t-icon,
|
|
88
|
+
.t-input-number__increase .t-icon {
|
|
80
89
|
position: relative;
|
|
81
90
|
z-index: 1;
|
|
82
91
|
font-size: var(--td-font-size-body-large);
|
|
83
92
|
color: var(--td-text-color-secondary);
|
|
84
93
|
}
|
|
85
|
-
.t-input-
|
|
94
|
+
.t-input-number__decrease.t-is-disabled,
|
|
95
|
+
.t-input-number__increase.t-is-disabled {
|
|
86
96
|
color: var(--td-text-color-disabled);
|
|
87
97
|
cursor: no-drop;
|
|
88
98
|
background-color: var(--td-bg-color-component-disabled);
|
|
89
99
|
}
|
|
90
|
-
.t-input-
|
|
100
|
+
.t-input-number__decrease.t-is-disabled .t-icon,
|
|
101
|
+
.t-input-number__increase.t-is-disabled .t-icon {
|
|
91
102
|
color: var(--td-text-color-disabled);
|
|
92
103
|
}
|
|
93
|
-
.t-input-
|
|
104
|
+
.t-input-number__decrease.t-is-disabled:hover,
|
|
105
|
+
.t-input-number__increase.t-is-disabled:hover {
|
|
94
106
|
border-color: var(--td-border-level-2-color);
|
|
95
107
|
}
|
|
96
|
-
.t-input-
|
|
108
|
+
.t-input-number__decrease.t-is-disabled:hover .t-icon,
|
|
109
|
+
.t-input-number__increase.t-is-disabled:hover .t-icon {
|
|
97
110
|
color: var(--td-text-color-disabled);
|
|
98
111
|
}
|
|
99
|
-
.t-input-
|
|
112
|
+
.t-input-number__decrease.t-is-disabled::-moz-placeholder, .t-input-number__increase.t-is-disabled::-moz-placeholder {
|
|
100
113
|
color: var(--td-text-color-disabled);
|
|
101
114
|
}
|
|
102
|
-
.t-input-
|
|
115
|
+
.t-input-number__decrease.t-is-disabled::placeholder,
|
|
116
|
+
.t-input-number__increase.t-is-disabled::placeholder {
|
|
103
117
|
color: var(--td-text-color-disabled);
|
|
104
118
|
}
|
|
105
|
-
|
|
119
|
+
|
|
120
|
+
.t-input-number__decrease {
|
|
106
121
|
left: 0;
|
|
107
122
|
}
|
|
108
|
-
|
|
123
|
+
|
|
124
|
+
.t-input-number__increase {
|
|
109
125
|
right: -8px;
|
|
110
126
|
}
|
|
111
127
|
|
|
@@ -229,7 +229,7 @@
|
|
|
229
229
|
background-color: var(--td-brand-color-light);
|
|
230
230
|
}
|
|
231
231
|
|
|
232
|
-
/** 规范 CSS
|
|
232
|
+
/** 规范 CSS 类名�?--hover */
|
|
233
233
|
.t-select-option.t-select-option__hover:not(.t-is-disabled), .t-select-option.t-select-option__hover:not(.t-is-selected),
|
|
234
234
|
.t-select-option.t-select-option--hover:not(.t-is-disabled),
|
|
235
235
|
.t-select-option.t-select-option--hover:not(.t-is-selected) {
|
package/es/style/index.css
CHANGED
|
@@ -131,32 +131,18 @@
|
|
|
131
131
|
--td-bg-color-page: var(--td-gray-color-2);
|
|
132
132
|
--td-bg-color-container: #fff;
|
|
133
133
|
--td-bg-color-container-hover: var(--td-gray-color-1);
|
|
134
|
-
--td-bg-color-container-active: var(
|
|
135
|
-
--td-gray-color-3
|
|
136
|
-
);
|
|
134
|
+
--td-bg-color-container-active: var(--td-gray-color-3);
|
|
137
135
|
--td-bg-color-container-select: #fff;
|
|
138
136
|
--td-bg-color-secondarycontainer: var(--td-gray-color-1);
|
|
139
|
-
--td-bg-color-secondarycontainer-hover: var(
|
|
140
|
-
|
|
141
|
-
);
|
|
142
|
-
--td-bg-color-secondarycontainer-active: var(
|
|
143
|
-
--td-gray-color-4
|
|
144
|
-
);
|
|
137
|
+
--td-bg-color-secondarycontainer-hover: var(--td-gray-color-2);
|
|
138
|
+
--td-bg-color-secondarycontainer-active: var(--td-gray-color-4);
|
|
145
139
|
--td-bg-color-component: var(--td-gray-color-3);
|
|
146
140
|
--td-bg-color-component-hover: var(--td-gray-color-4);
|
|
147
|
-
--td-bg-color-component-active: var(
|
|
148
|
-
--td-gray-color-6
|
|
149
|
-
);
|
|
141
|
+
--td-bg-color-component-active: var(--td-gray-color-6);
|
|
150
142
|
--td-bg-color-secondarycomponent: var(--td-gray-color-4);
|
|
151
|
-
--td-bg-color-secondarycomponent-hover: var(
|
|
152
|
-
|
|
153
|
-
);
|
|
154
|
-
--td-bg-color-secondarycomponent-active: var(
|
|
155
|
-
--td-gray-color-6
|
|
156
|
-
);
|
|
157
|
-
--td-bg-color-component-disabled: var(
|
|
158
|
-
--td-gray-color-2
|
|
159
|
-
);
|
|
143
|
+
--td-bg-color-secondarycomponent-hover: var(--td-gray-color-5);
|
|
144
|
+
--td-bg-color-secondarycomponent-active: var(--td-gray-color-6);
|
|
145
|
+
--td-bg-color-component-disabled: var(--td-gray-color-2);
|
|
160
146
|
--td-bg-color-specialcomponent: #fff;
|
|
161
147
|
--td-text-color-primary: var(--td-font-gray-1);
|
|
162
148
|
--td-text-color-secondary: var(--td-font-gray-2);
|
|
@@ -170,15 +156,9 @@
|
|
|
170
156
|
--td-component-stroke: var(--td-gray-color-3);
|
|
171
157
|
--td-border-level-2-color: var(--td-gray-color-4);
|
|
172
158
|
--td-component-border: var(--td-gray-color-4);
|
|
173
|
-
--td-shadow-1:
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
--td-shadow-2:
|
|
177
|
-
0 3px 14px 2px rgba(0, 0, 0, 5%), 0 8px 10px 1px rgba(0, 0, 0, 6%),
|
|
178
|
-
0 5px 5px -3px rgba(0, 0, 0, 10%);
|
|
179
|
-
--td-shadow-3:
|
|
180
|
-
0 6px 30px 5px rgba(0, 0, 0, 5%), 0 16px 24px 2px rgba(0, 0, 0, 4%),
|
|
181
|
-
0 8px 10px -5px rgba(0, 0, 0, 8%);
|
|
159
|
+
--td-shadow-1: 0 1px 10px rgba(0, 0, 0, 5%), 0 4px 5px rgba(0, 0, 0, 8%), 0 2px 4px -1px rgba(0, 0, 0, 12%);
|
|
160
|
+
--td-shadow-2: 0 3px 14px 2px rgba(0, 0, 0, 5%), 0 8px 10px 1px rgba(0, 0, 0, 6%), 0 5px 5px -3px rgba(0, 0, 0, 10%);
|
|
161
|
+
--td-shadow-3: 0 6px 30px 5px rgba(0, 0, 0, 5%), 0 16px 24px 2px rgba(0, 0, 0, 4%), 0 8px 10px -5px rgba(0, 0, 0, 8%);
|
|
182
162
|
--td-shadow-inset-top: inset 0 0.5px 0 #dcdcdc;
|
|
183
163
|
--td-shadow-inset-right: inset 0.5px 0 0 #dcdcdc;
|
|
184
164
|
--td-shadow-inset-bottom: inset 0 -0.5px 0 #dcdcdc;
|
|
@@ -286,34 +266,18 @@
|
|
|
286
266
|
--td-bg-color-page: var(--td-gray-color-14);
|
|
287
267
|
--td-bg-color-container: var(--td-gray-color-13);
|
|
288
268
|
--td-bg-color-container-hover: var(--td-gray-color-12);
|
|
289
|
-
--td-bg-color-container-active: var(
|
|
290
|
-
|
|
291
|
-
);
|
|
292
|
-
--td-bg-color-container-select: var(
|
|
293
|
-
--td-gray-color-9
|
|
294
|
-
);
|
|
269
|
+
--td-bg-color-container-active: var(--td-gray-color-10);
|
|
270
|
+
--td-bg-color-container-select: var(--td-gray-color-9);
|
|
295
271
|
--td-bg-color-secondarycontainer: var(--td-gray-color-12);
|
|
296
|
-
--td-bg-color-secondarycontainer-hover: var(
|
|
297
|
-
|
|
298
|
-
);
|
|
299
|
-
--td-bg-color-secondarycontainer-active: var(
|
|
300
|
-
--td-gray-color-9
|
|
301
|
-
);
|
|
272
|
+
--td-bg-color-secondarycontainer-hover: var(--td-gray-color-11);
|
|
273
|
+
--td-bg-color-secondarycontainer-active: var(--td-gray-color-9);
|
|
302
274
|
--td-bg-color-component: var(--td-gray-color-11);
|
|
303
275
|
--td-bg-color-component-hover: var(--td-gray-color-10);
|
|
304
|
-
--td-bg-color-component-active: var(
|
|
305
|
-
--td-gray-color-9
|
|
306
|
-
);
|
|
276
|
+
--td-bg-color-component-active: var(--td-gray-color-9);
|
|
307
277
|
--td-bg-color-secondarycomponent: var(--td-gray-color-10);
|
|
308
|
-
--td-bg-color-secondarycomponent-hover: var(
|
|
309
|
-
|
|
310
|
-
);
|
|
311
|
-
--td-bg-color-secondarycomponent-active: var(
|
|
312
|
-
--td-gray-color-8
|
|
313
|
-
);
|
|
314
|
-
--td-bg-color-component-disabled: var(
|
|
315
|
-
--td-gray-color-12
|
|
316
|
-
);
|
|
278
|
+
--td-bg-color-secondarycomponent-hover: var(--td-gray-color-9);
|
|
279
|
+
--td-bg-color-secondarycomponent-active: var(--td-gray-color-8);
|
|
280
|
+
--td-bg-color-component-disabled: var(--td-gray-color-12);
|
|
317
281
|
--td-bg-color-specialcomponent: transparent;
|
|
318
282
|
--td-text-color-primary: var(--td-font-white-1);
|
|
319
283
|
--td-text-color-secondary: var(--td-font-white-2);
|
|
@@ -327,15 +291,9 @@
|
|
|
327
291
|
--td-component-stroke: var(--td-gray-color-11);
|
|
328
292
|
--td-border-level-2-color: var(--td-gray-color-9);
|
|
329
293
|
--td-component-border: var(--td-gray-color-9);
|
|
330
|
-
--td-shadow-1:
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
--td-shadow-2:
|
|
334
|
-
0 8px 10px rgba(0, 0, 0, 12%), 0 3px 14px rgba(0, 0, 0, 10%),
|
|
335
|
-
0 5px 5px rgba(0, 0, 0, 16%);
|
|
336
|
-
--td-shadow-3:
|
|
337
|
-
0 16px 24px rgba(0, 0, 0, 14%), 0 6px 30px rgba(0, 0, 0, 12%),
|
|
338
|
-
0 8px 10px rgba(0, 0, 0, 20%);
|
|
294
|
+
--td-shadow-1: 0 4px 6px rgba(0, 0, 0, 6%), 0 1px 10px rgba(0, 0, 0, 8%), 0 2px 4px rgba(0, 0, 0, 12%);
|
|
295
|
+
--td-shadow-2: 0 8px 10px rgba(0, 0, 0, 12%), 0 3px 14px rgba(0, 0, 0, 10%), 0 5px 5px rgba(0, 0, 0, 16%);
|
|
296
|
+
--td-shadow-3: 0 16px 24px rgba(0, 0, 0, 14%), 0 6px 30px rgba(0, 0, 0, 12%), 0 8px 10px rgba(0, 0, 0, 20%);
|
|
339
297
|
--td-shadow-inset-top: inset 0 0.5px 0 #5e5e5e;
|
|
340
298
|
--td-shadow-inset-right: inset 0.5px 0 0 #5e5e5e;
|
|
341
299
|
--td-shadow-inset-bottom: inset 0 -0.5px 0 #5e5e5e;
|
package/es/tab/style/index.css
CHANGED
|
@@ -88,47 +88,46 @@
|
|
|
88
88
|
color: var(--td-brand-color);
|
|
89
89
|
text-shadow: 0 0 0.3px currentcolor;
|
|
90
90
|
}
|
|
91
|
-
.t-tabs__nav-item.t-is-disabled {
|
|
91
|
+
.t-tabs__nav-item.t-is-active.t-is-disabled {
|
|
92
92
|
color: var(--td-text-color-disabled);
|
|
93
93
|
cursor: not-allowed;
|
|
94
94
|
}
|
|
95
|
-
.t-tabs__nav-item > .remove-btn {
|
|
95
|
+
.t-tabs__nav-item.t-is-active > .remove-btn {
|
|
96
96
|
margin-left: var(--td-comp-margin-s);
|
|
97
97
|
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
98
98
|
display: flex;
|
|
99
99
|
}
|
|
100
|
-
.t-
|
|
100
|
+
.t-tabs__nav-item__content {
|
|
101
101
|
overflow: hidden;
|
|
102
102
|
position: relative;
|
|
103
103
|
}
|
|
104
|
-
.t-
|
|
104
|
+
.t-tabs__nav-item__bar {
|
|
105
105
|
position: absolute;
|
|
106
106
|
background-color: var(--td-brand-color);
|
|
107
107
|
z-index: 1;
|
|
108
108
|
transition: all 0.24s cubic-bezier(0.38, 0, 0.24, 1);
|
|
109
109
|
border-radius: var(--td-radius-small);
|
|
110
110
|
}
|
|
111
|
-
.t-
|
|
111
|
+
.t-tabs__nav-item__bar.t-is-top {
|
|
112
112
|
bottom: 0;
|
|
113
113
|
left: 0;
|
|
114
114
|
height: 3px;
|
|
115
115
|
}
|
|
116
|
-
.t-
|
|
116
|
+
.t-tabs__nav-item__bar.t-is-bottom {
|
|
117
117
|
top: 0;
|
|
118
118
|
left: 0;
|
|
119
119
|
height: 3px;
|
|
120
120
|
}
|
|
121
|
-
.t-
|
|
121
|
+
.t-tabs__nav-item__bar.t-is-left {
|
|
122
122
|
top: 0;
|
|
123
123
|
right: 0;
|
|
124
124
|
width: 3px;
|
|
125
125
|
}
|
|
126
|
-
.t-
|
|
126
|
+
.t-tabs__nav-item__bar.t-is-right {
|
|
127
127
|
top: 0;
|
|
128
128
|
left: 0;
|
|
129
129
|
width: 3px;
|
|
130
130
|
}
|
|
131
|
-
|
|
132
|
-
.t-tab-panel.t-is-hidden {
|
|
131
|
+
.t-tabs .t-tab-panel.t-is-hidden {
|
|
133
132
|
display: none;
|
|
134
133
|
}
|
package/es/table/style/index.css
CHANGED
|
@@ -56,12 +56,12 @@
|
|
|
56
56
|
max-width: 100%;
|
|
57
57
|
display: block;
|
|
58
58
|
}
|
|
59
|
-
.t-
|
|
59
|
+
.t-table {
|
|
60
60
|
overflow: hidden;
|
|
61
61
|
position: relative;
|
|
62
62
|
max-width: 100%;
|
|
63
63
|
}
|
|
64
|
-
.t-
|
|
64
|
+
.t-table > div {
|
|
65
65
|
width: 100%;
|
|
66
66
|
max-width: 100%;
|
|
67
67
|
box-sizing: border-box;
|
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
border: 1px solid var(--td-component-border);
|
|
79
79
|
border-radius: var(--td-border-radius-default, 4px);
|
|
80
80
|
}
|
|
81
|
-
.t-table
|
|
81
|
+
.t-table tbody tr:nth-of-type(odd) {
|
|
82
82
|
background-color: var(--td-bg-color-secondarycontainer);
|
|
83
83
|
}
|
|
84
84
|
.t-table--hover tbody tr {
|
|
@@ -102,7 +102,6 @@
|
|
|
102
102
|
.t-table--layout-fixed {
|
|
103
103
|
table-layout: fixed;
|
|
104
104
|
}
|
|
105
|
-
.t-table--layout-fixed td.t-table__cell--ellipsis,
|
|
106
105
|
.t-table--layout-fixed th.t-table__cell--ellipsis {
|
|
107
106
|
overflow: hidden;
|
|
108
107
|
position: relative;
|
|
@@ -116,7 +115,7 @@
|
|
|
116
115
|
.t-table--vertical-align-bottom tbody td {
|
|
117
116
|
vertical-align: bottom;
|
|
118
117
|
}
|
|
119
|
-
.t-
|
|
118
|
+
.t-table td {
|
|
120
119
|
padding: 0;
|
|
121
120
|
border: 0;
|
|
122
121
|
}
|
|
@@ -149,7 +149,7 @@
|
|
|
149
149
|
margin-right: var(--td-comp-margin-s);
|
|
150
150
|
}
|
|
151
151
|
|
|
152
|
-
/** 换行模式避免标签和右侧图标重合，需保留图标宽度 22px
|
|
152
|
+
/** 换行模式避免标签和右侧图标重合，需保留图标宽度 22px 和左侧距离标签间�?8px */
|
|
153
153
|
.t-tag-input--break-line.t-tag-input--with-tag:not(.t-input--auto-width) .t-input,
|
|
154
154
|
.t-tag-input.t-input--auto-width:hover .t-input {
|
|
155
155
|
padding-right: calc(var(--td-comp-paddingLR-xxl) + var(--td-comp-paddingLR-xxs));
|
|
@@ -159,12 +159,12 @@
|
|
|
159
159
|
padding-right: calc(var(--td-comp-paddingLR-xxl) + var(--td-comp-paddingLR-xs));
|
|
160
160
|
}
|
|
161
161
|
|
|
162
|
-
/** auto-width
|
|
162
|
+
/** auto-width 模式，左右边距相�?*/
|
|
163
163
|
.t-tag-input.t-input--auto-width .t-input {
|
|
164
164
|
padding-right: 0;
|
|
165
165
|
}
|
|
166
166
|
|
|
167
|
-
/** max-rows
|
|
167
|
+
/** max-rows模式，限制最大高�?*/
|
|
168
168
|
.t-tag-input--max-rows .t-input.t-size-s {
|
|
169
169
|
max-height: calc(var(--max-rows, 1) * var(--td-comp-size-xs));
|
|
170
170
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tendaui/react",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.4",
|
|
4
4
|
"description": "a react ui component library",
|
|
5
5
|
"main": "es/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -55,5 +55,5 @@
|
|
|
55
55
|
"tslib": "~2.3.1",
|
|
56
56
|
"validator": "~13.15.0"
|
|
57
57
|
},
|
|
58
|
-
"gitHead": "
|
|
58
|
+
"gitHead": "bdc34c68fc499513c8403e5645531f277d1c0dda"
|
|
59
59
|
}
|