bkui-vue 1.0.3-beta.26 → 1.0.3-beta.28

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 (287) hide show
  1. package/dist/index.cjs.js +46 -46
  2. package/dist/index.esm.js +6162 -6148
  3. package/dist/index.umd.js +46 -46
  4. package/dist/style.css +1 -1
  5. package/dist/style.variable.css +1 -1
  6. package/lib/affix/affix.css +1 -1
  7. package/lib/affix/affix.less +2 -2
  8. package/lib/affix/affix.variable.css +3 -3
  9. package/lib/affix/index.js +13 -15
  10. package/lib/alert/alert.css +21 -21
  11. package/lib/alert/alert.less +16 -17
  12. package/lib/alert/alert.variable.css +23 -23
  13. package/lib/alert/index.js +22 -24
  14. package/lib/animate-number/index.js +5 -6
  15. package/lib/backtop/backtop.css +11 -11
  16. package/lib/backtop/backtop.less +3 -3
  17. package/lib/backtop/backtop.variable.css +13 -13
  18. package/lib/backtop/index.js +20 -22
  19. package/lib/badge/badge.css +32 -32
  20. package/lib/badge/badge.less +5 -5
  21. package/lib/badge/badge.variable.css +34 -34
  22. package/lib/badge/index.js +19 -21
  23. package/lib/breadcrumb/breadcrumb.css +31 -31
  24. package/lib/breadcrumb/breadcrumb.less +8 -8
  25. package/lib/breadcrumb/breadcrumb.variable.css +33 -33
  26. package/lib/breadcrumb/index.js +24 -26
  27. package/lib/button/button.css +69 -69
  28. package/lib/button/button.less +5 -3
  29. package/lib/button/button.variable.css +71 -71
  30. package/lib/button/index.js +28 -37
  31. package/lib/card/card.css +31 -31
  32. package/lib/card/card.less +4 -4
  33. package/lib/card/card.variable.css +33 -33
  34. package/lib/card/index.js +35 -43
  35. package/lib/cascader/cascader.css +63 -63
  36. package/lib/cascader/cascader.less +11 -12
  37. package/lib/cascader/cascader.variable.css +65 -65
  38. package/lib/cascader/index.js +80 -100
  39. package/lib/checkbox/checkbox.css +21 -21
  40. package/lib/checkbox/checkbox.less +8 -8
  41. package/lib/checkbox/checkbox.variable.css +23 -23
  42. package/lib/checkbox/index.js +32 -34
  43. package/lib/code-diff/code-diff.css +97 -97
  44. package/lib/code-diff/code-diff.less +4 -3
  45. package/lib/code-diff/code-diff.variable.css +99 -99
  46. package/lib/code-diff/index.js +12 -14
  47. package/lib/collapse/collapse.css +30 -30
  48. package/lib/collapse/collapse.less +24 -25
  49. package/lib/collapse/collapse.variable.css +32 -32
  50. package/lib/collapse/index.js +39 -41
  51. package/lib/collapse-transition/collapse-transition.css +32 -32
  52. package/lib/collapse-transition/collapse-transition.less +48 -59
  53. package/lib/collapse-transition/collapse-transition.variable.css +34 -34
  54. package/lib/collapse-transition/index.js +8 -9
  55. package/lib/color-picker/color-picker.css +57 -57
  56. package/lib/color-picker/color-picker.less +30 -36
  57. package/lib/color-picker/color-picker.variable.css +59 -59
  58. package/lib/color-picker/index.js +48 -50
  59. package/lib/components.js +505 -60
  60. package/lib/config-provider/config-provider.variable.css +2 -2
  61. package/lib/config-provider/index.js +8 -9
  62. package/lib/container/container.css +19 -19
  63. package/lib/container/container.less +3 -3
  64. package/lib/container/container.variable.css +21 -21
  65. package/lib/container/index.js +19 -21
  66. package/lib/date-picker/date-picker.css +92 -92
  67. package/lib/date-picker/date-picker.d.ts +1 -0
  68. package/lib/date-picker/date-picker.less +54 -55
  69. package/lib/date-picker/date-picker.variable.css +94 -94
  70. package/lib/date-picker/index.d.ts +3 -0
  71. package/lib/date-picker/index.js +69 -77
  72. package/lib/date-picker/time-picker.d.ts +1 -0
  73. package/lib/dialog/dialog.css +51 -51
  74. package/lib/dialog/dialog.less +1 -1
  75. package/lib/dialog/dialog.variable.css +53 -53
  76. package/lib/dialog/index.js +49 -63
  77. package/lib/directives/index.js +12 -13
  78. package/lib/dist.index.js +62 -5
  79. package/lib/divider/divider.css +8 -8
  80. package/lib/divider/divider.less +8 -5
  81. package/lib/divider/divider.variable.css +10 -10
  82. package/lib/divider/index.js +13 -15
  83. package/lib/dropdown/dropdown.css +15 -15
  84. package/lib/dropdown/dropdown.less +6 -6
  85. package/lib/dropdown/dropdown.variable.css +17 -17
  86. package/lib/dropdown/index.js +24 -32
  87. package/lib/exception/exception.css +13 -13
  88. package/lib/exception/exception.less +6 -6
  89. package/lib/exception/exception.variable.css +15 -15
  90. package/lib/exception/index.js +11 -13
  91. package/lib/fixed-navbar/fixed-navbar.css +9 -9
  92. package/lib/fixed-navbar/fixed-navbar.less +2 -1
  93. package/lib/fixed-navbar/fixed-navbar.variable.css +11 -11
  94. package/lib/fixed-navbar/index.js +13 -15
  95. package/lib/form/form.css +63 -63
  96. package/lib/form/form.less +16 -14
  97. package/lib/form/form.variable.css +65 -65
  98. package/lib/form/index.js +48 -50
  99. package/lib/hooks.js +48 -1
  100. package/lib/icon/index.js +0 -1
  101. package/lib/image/image-viewer.css +23 -23
  102. package/lib/image/image-viewer.less +25 -24
  103. package/lib/image/image-viewer.variable.css +25 -25
  104. package/lib/image/image.css +29 -29
  105. package/lib/image/image.less +8 -6
  106. package/lib/image/image.variable.css +31 -31
  107. package/lib/image/index.js +38 -39
  108. package/lib/index.js +72 -7
  109. package/lib/info-box/index.js +13 -21
  110. package/lib/info-box/info-box.css +10 -10
  111. package/lib/info-box/info-box.less +2 -1
  112. package/lib/info-box/info-box.variable.css +12 -12
  113. package/lib/input/index.js +59 -61
  114. package/lib/input/input.css +104 -102
  115. package/lib/input/input.less +33 -27
  116. package/lib/input/input.variable.css +106 -104
  117. package/lib/link/index.js +13 -15
  118. package/lib/link/link.css +18 -18
  119. package/lib/link/link.less +3 -1
  120. package/lib/link/link.variable.css +20 -20
  121. package/lib/loading/index.js +17 -19
  122. package/lib/loading/loading.css +94 -94
  123. package/lib/loading/loading.less +4 -4
  124. package/lib/loading/loading.variable.css +96 -96
  125. package/lib/locale/index.js +0 -1
  126. package/lib/menu/index.js +13 -15
  127. package/lib/menu/menu.css +38 -38
  128. package/lib/menu/menu.less +10 -10
  129. package/lib/menu/menu.variable.css +40 -40
  130. package/lib/menu/submenu.css +1 -1
  131. package/lib/menu/submenu.less +1 -1
  132. package/lib/menu/submenu.variable.css +3 -3
  133. package/lib/message/index.js +38 -40
  134. package/lib/message/message.css +59 -59
  135. package/lib/message/message.less +24 -25
  136. package/lib/message/message.variable.css +61 -61
  137. package/lib/modal/index.js +41 -43
  138. package/lib/modal/modal.css +26 -26
  139. package/lib/modal/modal.less +12 -8
  140. package/lib/modal/modal.variable.css +28 -28
  141. package/lib/navigation/index.js +14 -16
  142. package/lib/navigation/navigation.css +25 -25
  143. package/lib/navigation/navigation.less +9 -9
  144. package/lib/navigation/navigation.variable.css +27 -27
  145. package/lib/notify/index.js +31 -33
  146. package/lib/notify/notify.css +17 -17
  147. package/lib/notify/notify.less +6 -8
  148. package/lib/notify/notify.variable.css +19 -19
  149. package/lib/overflow-title/index.js +14 -22
  150. package/lib/pagination/index.js +50 -65
  151. package/lib/pagination/pagination.css +60 -60
  152. package/lib/pagination/pagination.less +25 -24
  153. package/lib/pagination/pagination.variable.css +62 -62
  154. package/lib/plugin-popover/index.js +53 -54
  155. package/lib/plugins/index.js +0 -1
  156. package/lib/pop-confirm/index.js +28 -42
  157. package/lib/pop-confirm/pop-confirm.css +10 -10
  158. package/lib/pop-confirm/pop-confirm.less +11 -14
  159. package/lib/pop-confirm/pop-confirm.variable.css +12 -12
  160. package/lib/popover/index.js +52 -54
  161. package/lib/popover/popover.css +5 -5
  162. package/lib/popover/popover.less +6 -5
  163. package/lib/popover/popover.variable.css +7 -7
  164. package/lib/popover2/index.js +3 -4
  165. package/lib/preset.js +64 -18
  166. package/lib/process/index.js +26 -27
  167. package/lib/process/process.css +33 -36
  168. package/lib/process/process.less +7 -8
  169. package/lib/process/process.variable.css +35 -38
  170. package/lib/progress/index.js +26 -28
  171. package/lib/progress/progress.css +33 -33
  172. package/lib/progress/progress.less +5 -6
  173. package/lib/progress/progress.variable.css +35 -35
  174. package/lib/radio/index.js +32 -34
  175. package/lib/radio/radio.css +51 -51
  176. package/lib/radio/radio.less +20 -13
  177. package/lib/radio/radio.variable.css +53 -53
  178. package/lib/rate/index.js +22 -24
  179. package/lib/rate/rate.css +2 -2
  180. package/lib/rate/rate.less +1 -1
  181. package/lib/rate/rate.variable.css +4 -4
  182. package/lib/rate/star.css +7 -7
  183. package/lib/rate/star.less +1 -1
  184. package/lib/rate/star.variable.css +9 -9
  185. package/lib/resize-layout/index.js +25 -27
  186. package/lib/resize-layout/resize-layout.css +42 -42
  187. package/lib/resize-layout/resize-layout.less +10 -17
  188. package/lib/resize-layout/resize-layout.variable.css +44 -44
  189. package/lib/search-select/index.js +49 -68
  190. package/lib/search-select/search-select.css +15 -15
  191. package/lib/search-select/search-select.variable.css +17 -17
  192. package/lib/select/index.js +129 -168
  193. package/lib/select/select.css +87 -87
  194. package/lib/select/select.less +22 -27
  195. package/lib/select/select.variable.css +89 -89
  196. package/lib/shared/index.js +4 -7
  197. package/lib/sideslider/index.js +14 -22
  198. package/lib/sideslider/sideslider.css +14 -14
  199. package/lib/sideslider/sideslider.less +13 -9
  200. package/lib/sideslider/sideslider.variable.css +16 -16
  201. package/lib/slider/index.js +22 -36
  202. package/lib/slider/slider.css +31 -31
  203. package/lib/slider/slider.less +8 -8
  204. package/lib/slider/slider.variable.css +33 -33
  205. package/lib/steps/index.js +28 -30
  206. package/lib/steps/steps.css +134 -134
  207. package/lib/steps/steps.less +48 -44
  208. package/lib/steps/steps.variable.css +136 -136
  209. package/lib/styles/mixins/animate.css +4 -4
  210. package/lib/styles/mixins/animate.less +3 -3
  211. package/lib/styles/mixins/animate.variable.css +6 -6
  212. package/lib/styles/mixins/mixins.css +15 -15
  213. package/lib/styles/mixins/mixins.variable.css +15 -15
  214. package/lib/styles/mixins/popper.css +11 -11
  215. package/lib/styles/mixins/popper.less +6 -6
  216. package/lib/styles/mixins/popper.variable.css +13 -13
  217. package/lib/styles/mixins/scroll.css +5 -5
  218. package/lib/styles/mixins/scroll.less +4 -4
  219. package/lib/styles/mixins/scroll.variable.css +7 -7
  220. package/lib/styles/reset.css +6 -6
  221. package/lib/styles/reset.less +5 -4
  222. package/lib/styles/reset.variable.css +8 -8
  223. package/lib/styles/themes/themes.less +10 -3
  224. package/lib/swiper/index.js +14 -16
  225. package/lib/swiper/swiper.css +15 -15
  226. package/lib/swiper/swiper.less +8 -8
  227. package/lib/swiper/swiper.variable.css +17 -17
  228. package/lib/switcher/index.js +29 -31
  229. package/lib/switcher/switcher.css +57 -57
  230. package/lib/switcher/switcher.less +22 -14
  231. package/lib/switcher/switcher.variable.css +59 -59
  232. package/lib/tab/index.js +44 -46
  233. package/lib/tab/tab.css +78 -78
  234. package/lib/tab/tab.less +39 -40
  235. package/lib/tab/tab.variable.css +80 -80
  236. package/lib/table/components/table-column.d.ts +1 -0
  237. package/lib/table/index.d.ts +1 -0
  238. package/lib/table/index.js +168 -207
  239. package/lib/table/plugins/head-filter.css +13 -13
  240. package/lib/table/plugins/head-filter.less +3 -3
  241. package/lib/table/plugins/head-filter.variable.css +15 -15
  242. package/lib/table/plugins/head-sort.css +5 -5
  243. package/lib/table/plugins/head-sort.less +2 -2
  244. package/lib/table/plugins/head-sort.variable.css +7 -7
  245. package/lib/table/plugins/settings.css +26 -26
  246. package/lib/table/plugins/settings.less +3 -1
  247. package/lib/table/plugins/settings.variable.css +28 -28
  248. package/lib/table/table.css +380 -380
  249. package/lib/table/table.less +14 -10
  250. package/lib/table/table.variable.css +382 -382
  251. package/lib/table-column/index.d.ts +3 -0
  252. package/lib/table-column/index.js +57 -43
  253. package/lib/tag/index.js +19 -21
  254. package/lib/tag/tag.css +51 -51
  255. package/lib/tag/tag.less +34 -34
  256. package/lib/tag/tag.variable.css +53 -53
  257. package/lib/tag-input/index.js +65 -80
  258. package/lib/tag-input/tag-input.css +38 -38
  259. package/lib/tag-input/tag-input.less +3 -3
  260. package/lib/tag-input/tag-input.variable.css +40 -40
  261. package/lib/time-picker/index.d.ts +3 -0
  262. package/lib/time-picker/index.js +7 -9
  263. package/lib/time-picker/time-picker.css +40 -40
  264. package/lib/time-picker/time-picker.less +44 -76
  265. package/lib/time-picker/time-picker.variable.css +42 -42
  266. package/lib/timeline/index.js +12 -13
  267. package/lib/timeline/timeline.css +69 -69
  268. package/lib/timeline/timeline.less +12 -6
  269. package/lib/timeline/timeline.variable.css +71 -71
  270. package/lib/transfer/index.js +36 -51
  271. package/lib/transfer/transfer.css +89 -89
  272. package/lib/transfer/transfer.less +1 -1
  273. package/lib/transfer/transfer.variable.css +91 -91
  274. package/lib/tree/index.js +72 -92
  275. package/lib/tree/tree.css +49 -49
  276. package/lib/tree/tree.less +7 -6
  277. package/lib/tree/tree.variable.css +51 -51
  278. package/lib/upload/index.js +48 -63
  279. package/lib/upload/upload.css +98 -98
  280. package/lib/upload/upload.less +69 -68
  281. package/lib/upload/upload.variable.css +100 -100
  282. package/lib/virtual-render/index.js +33 -35
  283. package/lib/virtual-render/virtual-render.css +9 -9
  284. package/lib/virtual-render/virtual-render.less +1 -1
  285. package/lib/virtual-render/virtual-render.variable.css +11 -11
  286. package/package.json +2 -2
  287. package/lib/styles/themes/themes copy.less +0 -167
package/lib/tab/tab.css CHANGED
@@ -1,89 +1,89 @@
1
- :where(.bk-tab) {
1
+ .bk-tab {
2
2
  position: relative;
3
3
  display: flex;
4
4
  }
5
- :where(.bk-tab) .bk-tab--top {
5
+ .bk-tab--top {
6
6
  flex-direction: column;
7
7
  }
8
- :where(.bk-tab) .bk-tab--right {
8
+ .bk-tab--right {
9
9
  flex-direction: row-reverse;
10
10
  }
11
- :where(.bk-tab) .bk-tab-header {
11
+ .bk-tab-header {
12
12
  position: relative;
13
13
  display: flex;
14
14
  color: #63656e;
15
15
  }
16
- .bk-tab--left :where(.bk-tab) .bk-tab-header {
16
+ .bk-tab--left .bk-tab-header {
17
17
  border-right: 1px solid #dcdee5;
18
18
  }
19
- .bk-tab--right :where(.bk-tab) .bk-tab-header {
19
+ .bk-tab--right .bk-tab-header {
20
20
  border-left: 1px solid #dcdee5;
21
21
  }
22
- .bk-tab--vertical-tab :where(.bk-tab) .bk-tab-header {
22
+ .bk-tab--vertical-tab .bk-tab-header {
23
23
  border: 0;
24
24
  }
25
- .bk-tab--left :where(.bk-tab) .bk-tab-header,
26
- .bk-tab--right :where(.bk-tab) .bk-tab-header {
25
+ .bk-tab--left .bk-tab-header,
26
+ .bk-tab--right .bk-tab-header {
27
27
  flex-direction: column;
28
28
  }
29
- .bk-tab--left :where(.bk-tab) .bk-tab-header > div,
30
- .bk-tab--right :where(.bk-tab) .bk-tab-header > div {
29
+ .bk-tab--left .bk-tab-header > div,
30
+ .bk-tab--right .bk-tab-header > div {
31
31
  flex-direction: column;
32
32
  }
33
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header,
34
- .bk-tab--vertical-tab :where(.bk-tab) .bk-tab-header {
35
- background: #f0f1f5;
33
+ .bk-tab--card-tab .bk-tab-header,
34
+ .bk-tab--vertical-tab .bk-tab-header {
35
+ background: #F0F1F5;
36
36
  }
37
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header {
37
+ .bk-tab--card-tab .bk-tab-header {
38
38
  border-radius: 4px 4px 0;
39
39
  }
40
- .bk-tab--card :where(.bk-tab) .bk-tab-header,
41
- .bk-tab--vertical-card :where(.bk-tab) .bk-tab-header {
40
+ .bk-tab--card .bk-tab-header,
41
+ .bk-tab--vertical-card .bk-tab-header {
42
42
  border-bottom: 1px solid #dcdee5;
43
43
  }
44
- .bk-tab--border-card :where(.bk-tab) .bk-tab-header {
44
+ .bk-tab--border-card .bk-tab-header {
45
45
  border: solid #dcdee5;
46
46
  border-width: 1px 1px 1px 0;
47
47
  }
48
- .bk-tab--border-card :where(.bk-tab) .bk-tab-header {
49
- background: #fafbfd;
48
+ .bk-tab--border-card .bk-tab-header {
49
+ background: #FAFBFD;
50
50
  }
51
- .bk-tab--unborder-card :where(.bk-tab) .bk-tab-header {
51
+ .bk-tab--unborder-card .bk-tab-header {
52
52
  border-bottom: 1px solid #dcdee5;
53
53
  }
54
- :where(.bk-tab) .bk-tab-header > div {
54
+ .bk-tab-header > div {
55
55
  display: flex;
56
56
  flex-wrap: nowrap;
57
57
  }
58
- .bk-tab--card :where(.bk-tab) .bk-tab-header > div,
59
- .bk-tab--vertical-card :where(.bk-tab) .bk-tab-header > div,
60
- .bk-tab--border-card :where(.bk-tab) .bk-tab-header > div {
58
+ .bk-tab--card .bk-tab-header > div,
59
+ .bk-tab--vertical-card .bk-tab-header > div,
60
+ .bk-tab--border-card .bk-tab-header > div {
61
61
  margin-bottom: -1px;
62
62
  }
63
- :where(.bk-tab) .bk-tab-header-nav {
63
+ .bk-tab-header-nav {
64
64
  position: relative;
65
65
  }
66
- .bk-tab--top :where(.bk-tab) .bk-tab-header-nav {
66
+ .bk-tab--top .bk-tab-header-nav {
67
67
  overflow-x: auto;
68
68
  overflow-y: visible;
69
69
  }
70
- .bk-tab--left :where(.bk-tab) .bk-tab-header-nav,
71
- .bk-tab--right :where(.bk-tab) .bk-tab-header-nav {
70
+ .bk-tab--left .bk-tab-header-nav,
71
+ .bk-tab--right .bk-tab-header-nav {
72
72
  overflow-x: visible;
73
73
  overflow-y: auto;
74
74
  }
75
- .bk-tab--card :where(.bk-tab) .bk-tab-header-nav,
76
- .bk-tab--border-card :where(.bk-tab) .bk-tab-header-nav,
77
- .bk-tab--vertical-card :where(.bk-tab) .bk-tab-header-nav {
75
+ .bk-tab--card .bk-tab-header-nav,
76
+ .bk-tab--border-card .bk-tab-header-nav,
77
+ .bk-tab--vertical-card .bk-tab-header-nav {
78
78
  border-left: 1px solid #dcdee5;
79
79
  }
80
- :where(.bk-tab) .bk-tab-header-nav::-webkit-scrollbar {
80
+ .bk-tab-header-nav::-webkit-scrollbar {
81
81
  display: none;
82
82
  width: 0;
83
83
  height: 0;
84
84
  }
85
- :where(.bk-tab) .bk-tab-header-next,
86
- :where(.bk-tab) .bk-tab-header-prev {
85
+ .bk-tab-header-next,
86
+ .bk-tab-header-prev {
87
87
  position: absolute;
88
88
  top: 1px;
89
89
  bottom: 1px;
@@ -91,51 +91,51 @@
91
91
  background: #fff;
92
92
  content: '';
93
93
  }
94
- :where(.bk-tab) .bk-tab-header-prev {
94
+ .bk-tab-header-prev {
95
95
  left: 1px;
96
96
  }
97
- :where(.bk-tab) .bk-tab-header-next {
97
+ .bk-tab-header-next {
98
98
  right: 1px;
99
99
  }
100
- :where(.bk-tab) .bk-tab-header-operation .bk-tab-header-item {
100
+ .bk-tab-header-operation .bk-tab-header-item {
101
101
  padding: 0 12px;
102
102
  }
103
- :where(.bk-tab) .bk-tab-header-setting {
103
+ .bk-tab-header-setting {
104
104
  justify-self: flex-end;
105
105
  margin-left: auto;
106
106
  white-space: nowrap;
107
107
  }
108
- :where(.bk-tab) .bk-tab-header-item {
108
+ .bk-tab-header-item {
109
109
  display: flex;
110
110
  white-space: nowrap;
111
111
  cursor: pointer;
112
112
  justify-content: center;
113
113
  align-items: center;
114
114
  }
115
- .bk-tab--top :where(.bk-tab) .bk-tab-header-item {
115
+ .bk-tab--top .bk-tab-header-item {
116
116
  padding: 0 20px;
117
117
  }
118
- .bk-tab--left :where(.bk-tab) .bk-tab-header-item,
119
- .bk-tab--right :where(.bk-tab) .bk-tab-header-item {
118
+ .bk-tab--left .bk-tab-header-item,
119
+ .bk-tab--right .bk-tab-header-item {
120
120
  padding: 0 12px;
121
121
  }
122
- .bk-tab--left :where(.bk-tab) .bk-tab-header-item {
122
+ .bk-tab--left .bk-tab-header-item {
123
123
  text-align: right;
124
124
  }
125
- .bk-tab--card :where(.bk-tab) .bk-tab-header-item,
126
- .bk-tab--vertical-card :where(.bk-tab) .bk-tab-header-item {
125
+ .bk-tab--card .bk-tab-header-item,
126
+ .bk-tab--vertical-card .bk-tab-header-item {
127
127
  border-top: 1px solid #dcdee5;
128
128
  }
129
- .bk-tab--card :where(.bk-tab) .bk-tab-header-item,
130
- .bk-tab--border-card :where(.bk-tab) .bk-tab-header-item,
131
- .bk-tab--vertical-card :where(.bk-tab) .bk-tab-header-item {
129
+ .bk-tab--card .bk-tab-header-item,
130
+ .bk-tab--border-card .bk-tab-header-item,
131
+ .bk-tab--vertical-card .bk-tab-header-item {
132
132
  border-right: 1px solid #dcdee5;
133
133
  }
134
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header-item {
134
+ .bk-tab--card-tab .bk-tab-header-item {
135
135
  position: relative;
136
136
  }
137
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header-item:not(:first-of-type):before,
138
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header-item:last-of-type:after {
137
+ .bk-tab--card-tab .bk-tab-header-item:not(:first-of-type):before,
138
+ .bk-tab--card-tab .bk-tab-header-item:last-of-type:after {
139
139
  position: absolute;
140
140
  top: 50%;
141
141
  left: 0;
@@ -146,30 +146,30 @@
146
146
  background: #c4c6cc;
147
147
  content: '';
148
148
  }
149
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header-item:last-of-type:after {
149
+ .bk-tab--card-tab .bk-tab-header-item:last-of-type:after {
150
150
  right: 0;
151
151
  left: initial;
152
152
  }
153
- .bk-tab--card-grid :where(.bk-tab) .bk-tab-header-item {
153
+ .bk-tab--card-grid .bk-tab-header-item {
154
154
  height: 40px;
155
155
  margin-right: 8px;
156
156
  line-height: 40px;
157
157
  background: #eaebf0;
158
158
  border-radius: 4px 4px 0 0;
159
159
  }
160
- .bk-tab-header-operation :where(.bk-tab) .bk-tab-header-item {
160
+ .bk-tab-header-operation .bk-tab-header-item {
161
161
  padding-right: 12px;
162
162
  padding-left: 12px;
163
163
  }
164
- :where(.bk-tab) .bk-tab-header-item:hover {
164
+ .bk-tab-header-item:hover {
165
165
  color: #3a84ff;
166
166
  }
167
- :where(.bk-tab) .bk-tab-header-item:hover .bk-tab-header--close {
167
+ .bk-tab-header-item:hover .bk-tab-header--close {
168
168
  display: block;
169
169
  margin-left: 5px;
170
170
  color: #ea3636;
171
171
  }
172
- :where(.bk-tab) .bk-tab-header--active {
172
+ .bk-tab-header--active {
173
173
  color: #3a84ff;
174
174
  /* 激活边框，跟随，不再用固定样式
175
175
  //.@{bk-prefix}-tab--unborder-card & {
@@ -184,61 +184,61 @@
184
184
  }
185
185
  */
186
186
  }
187
- .bk-tab--card :where(.bk-tab) .bk-tab-header--active,
188
- .bk-tab--border-card :where(.bk-tab) .bk-tab-header--active,
189
- .bk-tab--vertical-card :where(.bk-tab) .bk-tab-header--active {
187
+ .bk-tab--card .bk-tab-header--active,
188
+ .bk-tab--border-card .bk-tab-header--active,
189
+ .bk-tab--vertical-card .bk-tab-header--active {
190
190
  background: white;
191
191
  border-bottom-color: white;
192
192
  }
193
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header--active,
194
- .bk-tab--vertical-tab :where(.bk-tab) .bk-tab-header--active {
193
+ .bk-tab--card-tab .bk-tab-header--active,
194
+ .bk-tab--vertical-tab .bk-tab-header--active {
195
195
  background: #fff;
196
196
  }
197
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header--active {
197
+ .bk-tab--card-tab .bk-tab-header--active {
198
198
  border-radius: 4px 4px 0 0;
199
199
  }
200
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header--active:after,
201
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header--active:before,
202
- .bk-tab--card-tab :where(.bk-tab) .bk-tab-header--active + .bk-tab-header-item:before {
200
+ .bk-tab--card-tab .bk-tab-header--active:after,
201
+ .bk-tab--card-tab .bk-tab-header--active:before,
202
+ .bk-tab--card-tab .bk-tab-header--active + .bk-tab-header-item:before {
203
203
  /* stylelint-disable-next-line declaration-no-important */
204
204
  display: none !important;
205
205
  }
206
- .bk-tab--card-grid :where(.bk-tab) .bk-tab-header--active {
206
+ .bk-tab--card-grid .bk-tab-header--active {
207
207
  background: #fff;
208
208
  }
209
- :where(.bk-tab) .bk-tab-header--close {
209
+ .bk-tab-header--close {
210
210
  display: none;
211
211
  font-size: 16px;
212
212
  color: #c4c6cc;
213
213
  }
214
- :where(.bk-tab) .bk-tab-header--disabled {
214
+ .bk-tab-header--disabled {
215
215
  cursor: not-allowed;
216
216
  }
217
- :where(.bk-tab) .bk-tab-header--disabled,
218
- :where(.bk-tab) .bk-tab-header--disabled:hover {
217
+ .bk-tab-header--disabled,
218
+ .bk-tab-header--disabled:hover {
219
219
  color: #aaa;
220
220
  }
221
- :where(.bk-tab) .bk-tab-header-active-bar {
221
+ .bk-tab-header-active-bar {
222
222
  position: absolute;
223
223
  width: 0;
224
224
  height: 0;
225
225
  background: #3a84ff;
226
226
  transition: all ease-in 300ms;
227
227
  }
228
- :where(.bk-tab) .bk-tab-content {
228
+ .bk-tab-content {
229
229
  flex: 1;
230
230
  padding: 10px;
231
231
  }
232
- .bk-tab--border-card :where(.bk-tab) .bk-tab-content,
233
- .bk-tab--vertical-card :where(.bk-tab) .bk-tab-content {
232
+ .bk-tab--border-card .bk-tab-content,
233
+ .bk-tab--vertical-card .bk-tab-content {
234
234
  border: solid #dcdee5;
235
235
  border-width: 0 1px 1px;
236
236
  }
237
- .bk-tab--card-grid :where(.bk-tab) .bk-tab-content {
237
+ .bk-tab--card-grid .bk-tab-content {
238
238
  background: #fff;
239
239
  border-radius: 0 4px 4px 4px;
240
240
  box-shadow: 0 2px 4px 0 #1919290d;
241
241
  }
242
- :where(.bk-tab) .bk-tab-panel {
242
+ .bk-tab-panel {
243
243
  height: 100%;
244
244
  }
package/lib/tab/tab.less CHANGED
@@ -3,26 +3,27 @@
3
3
  @tab-color: @default-color;
4
4
  @tab-border: @disable-color;
5
5
  @tab-active: @primary-color;
6
- @tab-header-bg: #fafbfd;
6
+ @tab-header-bg: #FAFBFD;
7
7
  @tab-white: @white-color;
8
8
  @tab-gray: @light-gray;
9
- @tab-card-tab-bg: #f0f1f5;
9
+ @tab-card-tab-bg: #F0F1F5;
10
10
  @tab-card-tab-divider: #c4c6cc;
11
11
  @tab-disable-color: #aaa;
12
12
 
13
- :where(.@{bk-prefix}-tab) {
13
+ .@{bk-prefix}-tab {
14
14
  position: relative;
15
15
  display: flex;
16
16
 
17
- .@{bk-prefix}-tab--top {
17
+ &--top {
18
18
  flex-direction: column;
19
19
  }
20
20
 
21
- .@{bk-prefix}-tab--right {
21
+
22
+ &--right {
22
23
  flex-direction: row-reverse;
23
24
  }
24
25
 
25
- .@{bk-prefix}-tab-header {
26
+ &-header {
26
27
  position: relative;
27
28
  display: flex;
28
29
  color: @tab-color;
@@ -39,8 +40,7 @@
39
40
  border: 0;
40
41
  }
41
42
 
42
- .@{bk-prefix}-tab--left &,
43
- .@{bk-prefix}-tab--right & {
43
+ .@{bk-prefix}-tab--left &, .@{bk-prefix}-tab--right & {
44
44
  flex-direction: column;
45
45
 
46
46
  > div {
@@ -48,8 +48,7 @@
48
48
  }
49
49
  }
50
50
 
51
- .@{bk-prefix}-tab--card-tab &,
52
- .@{bk-prefix}-tab--vertical-tab & {
51
+ .@{bk-prefix}-tab--card-tab &, .@{bk-prefix}-tab--vertical-tab & {
53
52
  background: @tab-card-tab-bg;
54
53
  }
55
54
 
@@ -57,8 +56,7 @@
57
56
  border-radius: 4px 4px 0;
58
57
  }
59
58
 
60
- .@{bk-prefix}-tab--card &,
61
- .@{bk-prefix}-tab--vertical-card & {
59
+ .@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--vertical-card & {
62
60
  border-bottom: 1px solid @tab-border;
63
61
  }
64
62
 
@@ -75,12 +73,11 @@
75
73
  border-bottom: 1px solid @tab-border;
76
74
  }
77
75
 
76
+
78
77
  > div {
79
78
  display: flex;
80
79
  flex-wrap: nowrap;
81
- .@{bk-prefix}-tab--card &,
82
- .@{bk-prefix}-tab--vertical-card &,
83
- .@{bk-prefix}-tab--border-card & {
80
+ .@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--vertical-card & ,.@{bk-prefix}-tab--border-card & {
84
81
  margin-bottom: -1px;
85
82
  }
86
83
  }
@@ -94,15 +91,13 @@
94
91
  overflow-y: visible;
95
92
  }
96
93
 
97
- .@{bk-prefix}-tab--left &,
98
- .@{bk-prefix}-tab--right & {
94
+ .@{bk-prefix}-tab--left &, .@{bk-prefix}-tab--right & {
99
95
  overflow-x: visible;
100
96
  overflow-y: auto;
101
97
  }
102
98
 
103
- .@{bk-prefix}-tab--card &,
104
- .@{bk-prefix}-tab--border-card &,
105
- .@{bk-prefix}-tab--vertical-card & {
99
+
100
+ .@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
106
101
  border-left: 1px solid @tab-border;
107
102
  }
108
103
 
@@ -144,6 +139,7 @@
144
139
  white-space: nowrap;
145
140
  }
146
141
 
142
+
147
143
  &-item {
148
144
  display: flex;
149
145
  white-space: nowrap;
@@ -155,8 +151,7 @@
155
151
  padding: 0 20px;
156
152
  }
157
153
 
158
- .@{bk-prefix}-tab--left &,
159
- .@{bk-prefix}-tab--right & {
154
+ .@{bk-prefix}-tab--left &, .@{bk-prefix}-tab--right & {
160
155
  padding: 0 12px;
161
156
  }
162
157
 
@@ -164,14 +159,11 @@
164
159
  text-align: right;
165
160
  }
166
161
 
167
- .@{bk-prefix}-tab--card &,
168
- .@{bk-prefix}-tab--vertical-card & {
162
+ .@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--vertical-card & {
169
163
  border-top: 1px solid @tab-border;
170
164
  }
171
165
 
172
- .@{bk-prefix}-tab--card &,
173
- .@{bk-prefix}-tab--border-card &,
174
- .@{bk-prefix}-tab--vertical-card & {
166
+ .@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
175
167
  border-right: 1px solid @tab-border;
176
168
 
177
169
  //&:last-of-type {
@@ -199,6 +191,8 @@
199
191
  right: 0;
200
192
  left: initial;
201
193
  }
194
+
195
+
202
196
  }
203
197
 
204
198
  .@{bk-prefix}-tab--card-grid & {
@@ -214,6 +208,7 @@
214
208
  padding-left: 12px;
215
209
  }
216
210
 
211
+
217
212
  &:hover {
218
213
  color: @tab-active;
219
214
 
@@ -223,32 +218,30 @@
223
218
  color: @danger-color;
224
219
  }
225
220
  }
221
+
226
222
  }
227
223
 
228
224
  &--active {
229
225
  color: @tab-active;
230
226
 
231
- .@{bk-prefix}-tab--card &,
232
- .@{bk-prefix}-tab--border-card &,
233
- .@{bk-prefix}-tab--vertical-card & {
227
+ .@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
234
228
  background: @tab-white;
235
229
  border-bottom-color: @tab-white;
236
230
  }
237
231
 
238
- .@{bk-prefix}-tab--card-tab &,
239
- .@{bk-prefix}-tab--vertical-tab & {
232
+
233
+ .@{bk-prefix}-tab--card-tab &, .@{bk-prefix}-tab--vertical-tab & {
240
234
  background: #fff;
241
235
  }
242
236
 
243
237
  .@{bk-prefix}-tab--card-tab & {
244
238
  border-radius: 4px 4px 0 0;
245
239
 
246
- &:after,
247
- &:before,
248
- & + .@{bk-prefix}-tab-header-item:before {
240
+ &:after, &:before, & + .@{bk-prefix}-tab-header-item:before {
249
241
  /* stylelint-disable-next-line declaration-no-important */
250
242
  display: none !important;
251
243
  }
244
+
252
245
  }
253
246
 
254
247
  .@{bk-prefix}-tab--card-grid & {
@@ -267,6 +260,7 @@
267
260
  border-left: 2px solid @tab-active;
268
261
  }
269
262
  */
263
+
270
264
  }
271
265
 
272
266
  &--close {
@@ -285,7 +279,7 @@
285
279
  }
286
280
  }
287
281
 
288
- .@{bk-prefix}-tab-header-active-bar {
282
+ &-header-active-bar {
289
283
  position: absolute;
290
284
  width: 0;
291
285
  height: 0;
@@ -293,12 +287,12 @@
293
287
  transition: all ease-in 300ms;
294
288
  }
295
289
 
296
- .@{bk-prefix}-tab-content {
290
+ &-content {
297
291
  flex: 1;
298
292
  padding: 10px;
299
293
 
300
- .@{bk-prefix}-tab--border-card &,
301
- .@{bk-prefix}-tab--vertical-card & {
294
+
295
+ .@{bk-prefix}-tab--border-card &, .@{bk-prefix}-tab--vertical-card & {
302
296
  border: solid @tab-border;
303
297
  border-width: 0 1px 1px;
304
298
  }
@@ -310,7 +304,12 @@
310
304
  }
311
305
  }
312
306
 
313
- .@{bk-prefix}-tab-panel {
307
+ &-panel {
314
308
  height: 100%;
315
309
  }
310
+
311
+
316
312
  }
313
+
314
+
315
+