bkui-vue 0.0.1-beta.355 → 0.0.1-beta.356
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.
- package/dist/index.cjs.js +26 -26
- package/dist/index.esm.js +38 -6
- package/dist/index.umd.js +28 -28
- package/dist/style.css +1 -1
- package/dist/style.variable.css +1 -1
- package/lib/notify/index.js +1 -1
- package/lib/notify/notifyConstructor.d.ts +6 -9
- package/lib/tab/index.d.ts +22 -22
- package/lib/tab/index.js +1 -1
- package/lib/tab/props.d.ts +21 -6
- package/lib/tab/tab-nav.d.ts +5 -5
- package/lib/tab/tab.css +63 -11
- package/lib/tab/tab.d.ts +10 -10
- package/lib/tab/tab.less +67 -13
- package/lib/tab/tab.variable.css +63 -11
- package/package.json +2 -1
package/lib/tab/tab.less
CHANGED
|
@@ -6,7 +6,10 @@
|
|
|
6
6
|
@tab-header-bg: #FAFBFD;
|
|
7
7
|
@tab-white: @white-color;
|
|
8
8
|
@tab-gray: @light-gray;
|
|
9
|
+
@tab-card-tab-bg: #F0F1F5;
|
|
10
|
+
@tab-card-tab-divider: #c4c6cc;
|
|
9
11
|
@tab-disable-color: #aaa;
|
|
12
|
+
|
|
10
13
|
.@{bk-prefix}-tab {
|
|
11
14
|
position: relative;
|
|
12
15
|
display: flex;
|
|
@@ -25,12 +28,20 @@
|
|
|
25
28
|
display: flex;
|
|
26
29
|
color: @tab-color;
|
|
27
30
|
|
|
31
|
+
.@{bk-prefix}-tab--card-tab &, .@{bk-prefix}-tab--vertical-tab & {
|
|
32
|
+
background: @tab-card-tab-bg;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.@{bk-prefix}-tab--card-tab & {
|
|
36
|
+
border-radius: 4px 4px 0;
|
|
37
|
+
}
|
|
38
|
+
|
|
28
39
|
> div {
|
|
29
40
|
display: flex;
|
|
30
41
|
margin-bottom: -1px;
|
|
31
42
|
flex-wrap: nowrap;
|
|
32
43
|
|
|
33
|
-
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card & {
|
|
44
|
+
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
|
|
34
45
|
border-right: 1px solid @tab-border;
|
|
35
46
|
}
|
|
36
47
|
}
|
|
@@ -52,7 +63,7 @@
|
|
|
52
63
|
}
|
|
53
64
|
|
|
54
65
|
|
|
55
|
-
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card & {
|
|
66
|
+
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
|
|
56
67
|
border-left: 1px solid @tab-border;
|
|
57
68
|
}
|
|
58
69
|
|
|
@@ -101,6 +112,10 @@
|
|
|
101
112
|
border-left: 1px solid @tab-border;
|
|
102
113
|
}
|
|
103
114
|
|
|
115
|
+
.@{bk-prefix}-tab--vertical-tab & {
|
|
116
|
+
border: 0;
|
|
117
|
+
}
|
|
118
|
+
|
|
104
119
|
.@{bk-prefix}-tab--left &, .@{bk-prefix}-tab--right & {
|
|
105
120
|
flex-direction: column;
|
|
106
121
|
|
|
@@ -109,16 +124,19 @@
|
|
|
109
124
|
}
|
|
110
125
|
}
|
|
111
126
|
|
|
112
|
-
.@{bk-prefix}-tab--card & {
|
|
127
|
+
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--vertical-card & {
|
|
113
128
|
border-bottom: 1px solid @tab-border;
|
|
114
129
|
}
|
|
115
130
|
|
|
116
131
|
.@{bk-prefix}-tab--border-card & {
|
|
117
|
-
background: @tab-header-bg;
|
|
118
132
|
border: solid @tab-border;
|
|
119
133
|
border-width: 1px 1px 1px 0;
|
|
120
134
|
}
|
|
121
135
|
|
|
136
|
+
.@{bk-prefix}-tab--border-card & {
|
|
137
|
+
background: @tab-header-bg;
|
|
138
|
+
}
|
|
139
|
+
|
|
122
140
|
.@{bk-prefix}-tab--unborder-card & {
|
|
123
141
|
border-bottom: 1px solid @tab-border;
|
|
124
142
|
}
|
|
@@ -142,11 +160,9 @@
|
|
|
142
160
|
|
|
143
161
|
.@{bk-prefix}-tab--top & {
|
|
144
162
|
padding: 0 20px;
|
|
145
|
-
//margin: -1px 0;
|
|
146
163
|
}
|
|
147
164
|
|
|
148
165
|
.@{bk-prefix}-tab--left &, .@{bk-prefix}-tab--right & {
|
|
149
|
-
//margin: 0 -1px;
|
|
150
166
|
padding: 0 12px;
|
|
151
167
|
}
|
|
152
168
|
|
|
@@ -154,11 +170,11 @@
|
|
|
154
170
|
text-align: right;
|
|
155
171
|
}
|
|
156
172
|
|
|
157
|
-
.@{bk-prefix}-tab--card & {
|
|
173
|
+
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--vertical-card & {
|
|
158
174
|
border-top: 1px solid @tab-border;
|
|
159
175
|
}
|
|
160
176
|
|
|
161
|
-
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card & {
|
|
177
|
+
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
|
|
162
178
|
border-right: 1px solid @tab-border;
|
|
163
179
|
border-bottom: 1px solid @tab-border;
|
|
164
180
|
|
|
@@ -167,6 +183,30 @@
|
|
|
167
183
|
}
|
|
168
184
|
}
|
|
169
185
|
|
|
186
|
+
.@{bk-prefix}-tab--card-tab & {
|
|
187
|
+
position: relative;
|
|
188
|
+
|
|
189
|
+
&:not(:first-of-type):before,
|
|
190
|
+
&:last-of-type:after {
|
|
191
|
+
position: absolute;
|
|
192
|
+
top: 50%;
|
|
193
|
+
left: 0;
|
|
194
|
+
display: block;
|
|
195
|
+
width: 1px;
|
|
196
|
+
height: 16px;
|
|
197
|
+
margin-top: -8px;
|
|
198
|
+
background: @tab-card-tab-divider;
|
|
199
|
+
content: '';
|
|
200
|
+
}
|
|
201
|
+
|
|
202
|
+
&:last-of-type:after {
|
|
203
|
+
right: 0;
|
|
204
|
+
left: initial;
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
|
|
208
|
+
}
|
|
209
|
+
|
|
170
210
|
.@{bk-prefix}-tab-header-operation & {
|
|
171
211
|
padding-right: 12px;
|
|
172
212
|
padding-left: 12px;
|
|
@@ -183,8 +223,7 @@
|
|
|
183
223
|
&--active {
|
|
184
224
|
color: @tab-active;
|
|
185
225
|
|
|
186
|
-
|
|
187
|
-
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card & {
|
|
226
|
+
.@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
|
|
188
227
|
background: @tab-white;
|
|
189
228
|
border-bottom-color: @tab-white;
|
|
190
229
|
}
|
|
@@ -193,11 +232,26 @@
|
|
|
193
232
|
border-bottom: 2px solid @tab-active;
|
|
194
233
|
}
|
|
195
234
|
|
|
196
|
-
.@{bk-prefix}-tab--
|
|
235
|
+
.@{bk-prefix}-tab--card-tab &, .@{bk-prefix}-tab--vertical-tab & {
|
|
236
|
+
background: #fff;
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
.@{bk-prefix}-tab--card-tab & {
|
|
240
|
+
border-radius: 4px 4px 0 0;
|
|
241
|
+
|
|
242
|
+
&:after, &:before, & + .@{bk-prefix}-tab-header-item:before {
|
|
243
|
+
/* stylelint-disable-next-line declaration-no-important */
|
|
244
|
+
display: none !important;
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
.@{bk-prefix}-tab--left:not(.@{bk-prefix}-tab--vertical-tab) & {
|
|
197
251
|
border-right: 2px solid @tab-active;
|
|
198
252
|
}
|
|
199
253
|
|
|
200
|
-
.@{bk-prefix}-tab--right & {
|
|
254
|
+
.@{bk-prefix}-tab--right:not(.@{bk-prefix}-tab--vertical-tab) & {
|
|
201
255
|
border-left: 2px solid @tab-active;
|
|
202
256
|
}
|
|
203
257
|
|
|
@@ -214,7 +268,7 @@
|
|
|
214
268
|
flex: 1;
|
|
215
269
|
padding: 10px;
|
|
216
270
|
|
|
217
|
-
.@{bk-prefix}-tab--border-card & {
|
|
271
|
+
.@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
|
|
218
272
|
border: solid @tab-border;
|
|
219
273
|
border-width: 0 1px 1px;
|
|
220
274
|
}
|
package/lib/tab/tab.variable.css
CHANGED
|
@@ -846,13 +846,21 @@
|
|
|
846
846
|
display: flex;
|
|
847
847
|
color: var(--default-color);
|
|
848
848
|
}
|
|
849
|
+
.bk-tab--card-tab .bk-tab-header,
|
|
850
|
+
.bk-tab--vertical-tab .bk-tab-header {
|
|
851
|
+
background: #F0F1F5;
|
|
852
|
+
}
|
|
853
|
+
.bk-tab--card-tab .bk-tab-header {
|
|
854
|
+
border-radius: 4px 4px 0;
|
|
855
|
+
}
|
|
849
856
|
.bk-tab-header > div {
|
|
850
857
|
display: flex;
|
|
851
858
|
margin-bottom: -1px;
|
|
852
859
|
flex-wrap: nowrap;
|
|
853
860
|
}
|
|
854
861
|
.bk-tab--card .bk-tab-header > div,
|
|
855
|
-
.bk-tab--border-card .bk-tab-header > div
|
|
862
|
+
.bk-tab--border-card .bk-tab-header > div,
|
|
863
|
+
.bk-tab--vertical-card .bk-tab-header > div {
|
|
856
864
|
border-right: 1px solid var(--disable-color);
|
|
857
865
|
}
|
|
858
866
|
.bk-tab-header-navs {
|
|
@@ -868,7 +876,8 @@
|
|
|
868
876
|
overflow-y: auto;
|
|
869
877
|
}
|
|
870
878
|
.bk-tab--card .bk-tab-header-nav,
|
|
871
|
-
.bk-tab--border-card .bk-tab-header-nav
|
|
879
|
+
.bk-tab--border-card .bk-tab-header-nav,
|
|
880
|
+
.bk-tab--vertical-card .bk-tab-header-nav {
|
|
872
881
|
border-left: 1px solid var(--disable-color);
|
|
873
882
|
}
|
|
874
883
|
.bk-tab-header-nav::-webkit-scrollbar {
|
|
@@ -904,6 +913,9 @@
|
|
|
904
913
|
.bk-tab--right .bk-tab-header {
|
|
905
914
|
border-left: 1px solid var(--disable-color);
|
|
906
915
|
}
|
|
916
|
+
.bk-tab--vertical-tab .bk-tab-header {
|
|
917
|
+
border: 0;
|
|
918
|
+
}
|
|
907
919
|
.bk-tab--left .bk-tab-header,
|
|
908
920
|
.bk-tab--right .bk-tab-header {
|
|
909
921
|
flex-direction: column;
|
|
@@ -912,14 +924,17 @@
|
|
|
912
924
|
.bk-tab--right .bk-tab-header > div {
|
|
913
925
|
flex-direction: column;
|
|
914
926
|
}
|
|
915
|
-
.bk-tab--card .bk-tab-header
|
|
927
|
+
.bk-tab--card .bk-tab-header,
|
|
928
|
+
.bk-tab--vertical-card .bk-tab-header {
|
|
916
929
|
border-bottom: 1px solid var(--disable-color);
|
|
917
930
|
}
|
|
918
931
|
.bk-tab--border-card .bk-tab-header {
|
|
919
|
-
background: #FAFBFD;
|
|
920
932
|
border: solid var(--disable-color);
|
|
921
933
|
border-width: 1px 1px 1px 0;
|
|
922
934
|
}
|
|
935
|
+
.bk-tab--border-card .bk-tab-header {
|
|
936
|
+
background: #FAFBFD;
|
|
937
|
+
}
|
|
923
938
|
.bk-tab--unborder-card .bk-tab-header {
|
|
924
939
|
border-bottom: 1px solid var(--disable-color);
|
|
925
940
|
}
|
|
@@ -948,18 +963,40 @@
|
|
|
948
963
|
.bk-tab--left .bk-tab-header-item {
|
|
949
964
|
text-align: right;
|
|
950
965
|
}
|
|
951
|
-
.bk-tab--card .bk-tab-header-item
|
|
966
|
+
.bk-tab--card .bk-tab-header-item,
|
|
967
|
+
.bk-tab--vertical-card .bk-tab-header-item {
|
|
952
968
|
border-top: 1px solid var(--disable-color);
|
|
953
969
|
}
|
|
954
970
|
.bk-tab--card .bk-tab-header-item,
|
|
955
|
-
.bk-tab--border-card .bk-tab-header-item
|
|
971
|
+
.bk-tab--border-card .bk-tab-header-item,
|
|
972
|
+
.bk-tab--vertical-card .bk-tab-header-item {
|
|
956
973
|
border-right: 1px solid var(--disable-color);
|
|
957
974
|
border-bottom: 1px solid var(--disable-color);
|
|
958
975
|
}
|
|
959
976
|
.bk-tab--card .bk-tab-header-item:last-of-type,
|
|
960
|
-
.bk-tab--border-card .bk-tab-header-item:last-of-type
|
|
977
|
+
.bk-tab--border-card .bk-tab-header-item:last-of-type,
|
|
978
|
+
.bk-tab--vertical-card .bk-tab-header-item:last-of-type {
|
|
961
979
|
border-right: none;
|
|
962
980
|
}
|
|
981
|
+
.bk-tab--card-tab .bk-tab-header-item {
|
|
982
|
+
position: relative;
|
|
983
|
+
}
|
|
984
|
+
.bk-tab--card-tab .bk-tab-header-item:not(:first-of-type):before,
|
|
985
|
+
.bk-tab--card-tab .bk-tab-header-item:last-of-type:after {
|
|
986
|
+
position: absolute;
|
|
987
|
+
top: 50%;
|
|
988
|
+
left: 0;
|
|
989
|
+
display: block;
|
|
990
|
+
width: 1px;
|
|
991
|
+
height: 16px;
|
|
992
|
+
margin-top: -8px;
|
|
993
|
+
background: #c4c6cc;
|
|
994
|
+
content: '';
|
|
995
|
+
}
|
|
996
|
+
.bk-tab--card-tab .bk-tab-header-item:last-of-type:after {
|
|
997
|
+
right: 0;
|
|
998
|
+
left: initial;
|
|
999
|
+
}
|
|
963
1000
|
.bk-tab-header-operation .bk-tab-header-item {
|
|
964
1001
|
padding-right: 12px;
|
|
965
1002
|
padding-left: 12px;
|
|
@@ -973,17 +1010,31 @@
|
|
|
973
1010
|
color: var(--primary-color);
|
|
974
1011
|
}
|
|
975
1012
|
.bk-tab--card .bk-tab-header--active,
|
|
976
|
-
.bk-tab--border-card .bk-tab-header--active
|
|
1013
|
+
.bk-tab--border-card .bk-tab-header--active,
|
|
1014
|
+
.bk-tab--vertical-card .bk-tab-header--active {
|
|
977
1015
|
background: var(--white-color);
|
|
978
1016
|
border-bottom-color: var(--white-color);
|
|
979
1017
|
}
|
|
980
1018
|
.bk-tab--unborder-card .bk-tab-header--active {
|
|
981
1019
|
border-bottom: 2px solid var(--primary-color);
|
|
982
1020
|
}
|
|
983
|
-
.bk-tab--
|
|
1021
|
+
.bk-tab--card-tab .bk-tab-header--active,
|
|
1022
|
+
.bk-tab--vertical-tab .bk-tab-header--active {
|
|
1023
|
+
background: #fff;
|
|
1024
|
+
}
|
|
1025
|
+
.bk-tab--card-tab .bk-tab-header--active {
|
|
1026
|
+
border-radius: 4px 4px 0 0;
|
|
1027
|
+
}
|
|
1028
|
+
.bk-tab--card-tab .bk-tab-header--active:after,
|
|
1029
|
+
.bk-tab--card-tab .bk-tab-header--active:before,
|
|
1030
|
+
.bk-tab--card-tab .bk-tab-header--active + .bk-tab-header-item:before {
|
|
1031
|
+
/* stylelint-disable-next-line declaration-no-important */
|
|
1032
|
+
display: none !important;
|
|
1033
|
+
}
|
|
1034
|
+
.bk-tab--left:not(.bk-tab--vertical-tab) .bk-tab-header--active {
|
|
984
1035
|
border-right: 2px solid var(--primary-color);
|
|
985
1036
|
}
|
|
986
|
-
.bk-tab--right .bk-tab-header--active {
|
|
1037
|
+
.bk-tab--right:not(.bk-tab--vertical-tab) .bk-tab-header--active {
|
|
987
1038
|
border-left: 2px solid var(--primary-color);
|
|
988
1039
|
}
|
|
989
1040
|
.bk-tab-header--disabled {
|
|
@@ -995,7 +1046,8 @@
|
|
|
995
1046
|
flex: 1;
|
|
996
1047
|
padding: 10px;
|
|
997
1048
|
}
|
|
998
|
-
.bk-tab--border-card .bk-tab-content
|
|
1049
|
+
.bk-tab--border-card .bk-tab-content,
|
|
1050
|
+
.bk-tab--vertical-card .bk-tab-content {
|
|
999
1051
|
border: solid var(--disable-color);
|
|
1000
1052
|
border-width: 0 1px 1px;
|
|
1001
1053
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "bkui-vue",
|
|
3
|
-
"version": "0.0.1-beta.
|
|
3
|
+
"version": "0.0.1-beta.356",
|
|
4
4
|
"workspaces": {
|
|
5
5
|
"packages": [
|
|
6
6
|
"packages/!(**.bak)*",
|
|
@@ -42,6 +42,7 @@
|
|
|
42
42
|
"@babel/plugin-transform-runtime": "~7.17.0",
|
|
43
43
|
"@babel/preset-env": "~7.16.11",
|
|
44
44
|
"@babel/preset-typescript": "~7.16.7",
|
|
45
|
+
"@blueking/magicbox-header": "~1.1.52",
|
|
45
46
|
"@commitlint/cli": "~16.2.3",
|
|
46
47
|
"@commitlint/config-conventional": "~16.2.1",
|
|
47
48
|
"@types/jest": "~27.4.1",
|