bkui-vue 0.0.1-beta.124 → 0.0.1-beta.127

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 (108) hide show
  1. package/dist/index.cjs.js +145 -31
  2. package/dist/index.esm.js +3578 -477
  3. package/dist/index.umd.js +145 -31
  4. package/dist/style.css +1 -1
  5. package/dist/style.variable.css +1 -0
  6. package/lib/affix/affix.variable.css +2 -2
  7. package/lib/alert/alert.variable.css +2 -2
  8. package/lib/backtop/backtop.variable.css +2 -2
  9. package/lib/badge/badge.variable.css +2 -2
  10. package/lib/breadcrumb/breadcrumb.css +43 -0
  11. package/lib/breadcrumb/breadcrumb.variable.css +45 -2
  12. package/lib/button/button.css +4 -0
  13. package/lib/button/button.less +13 -7
  14. package/lib/button/button.variable.css +6 -2
  15. package/lib/card/card.css +43 -0
  16. package/lib/card/card.variable.css +45 -2
  17. package/lib/cascader/cascader.variable.css +2 -2
  18. package/lib/checkbox/checkbox.css +4 -2
  19. package/lib/checkbox/checkbox.less +4 -2
  20. package/lib/checkbox/checkbox.variable.css +6 -4
  21. package/lib/code-diff/code-diff.variable.css +2 -2
  22. package/lib/collapse/collapse.variable.css +2 -2
  23. package/lib/components.d.ts +1 -0
  24. package/lib/components.js +1 -1
  25. package/lib/container/container.css +43 -0
  26. package/lib/container/container.variable.css +45 -2
  27. package/lib/date-picker/date-picker.variable.css +2 -2
  28. package/lib/directives/index.js +1 -1
  29. package/lib/directives/tooltips.d.ts +0 -1
  30. package/lib/divider/divider.variable.css +2 -2
  31. package/lib/dropdown/dropdown.variable.css +2 -2
  32. package/lib/exception/exception.variable.css +2 -2
  33. package/lib/fixed-navbar/fixed-navbar.variable.css +2 -2
  34. package/lib/form/form.variable.css +2 -2
  35. package/lib/input/index.js +1 -1
  36. package/lib/input/input.css +56 -5
  37. package/lib/input/input.less +12 -2
  38. package/lib/input/input.variable.css +55 -4
  39. package/lib/link/link.variable.css +2 -2
  40. package/lib/loading/loading.css +43 -2
  41. package/lib/loading/loading.less +2 -2
  42. package/lib/loading/loading.variable.css +45 -4
  43. package/lib/menu/menu.css +43 -0
  44. package/lib/menu/menu.variable.css +45 -2
  45. package/lib/menu/submenu.variable.css +2 -2
  46. package/lib/message/message.variable.css +2 -2
  47. package/lib/navigation/navigation.variable.css +2 -2
  48. package/lib/notify/notify.variable.css +2 -2
  49. package/lib/pagination/pagination.variable.css +2 -2
  50. package/lib/popover/popover.variable.css +2 -2
  51. package/lib/popover2/index.js +1 -1
  52. package/lib/popover2/popover2.variable.css +2 -2
  53. package/lib/popover2/use-platform.d.ts +30 -0
  54. package/lib/process/process.variable.css +2 -2
  55. package/lib/progress/progress.css +43 -0
  56. package/lib/progress/progress.variable.css +45 -2
  57. package/lib/radio/index.d.ts +2 -2
  58. package/lib/radio/index.js +1 -1
  59. package/lib/radio/radio-button.d.ts +3 -4
  60. package/lib/radio/radio.css +4 -5
  61. package/lib/radio/radio.less +4 -5
  62. package/lib/radio/radio.variable.css +6 -7
  63. package/lib/resize-layout/resize-layout.variable.css +2 -2
  64. package/lib/select/select.css +23 -23
  65. package/lib/select/select.less +126 -122
  66. package/lib/select/select.variable.css +25 -25
  67. package/lib/sideslider/sideslider.variable.css +2 -2
  68. package/lib/slider/slider.variable.css +2 -2
  69. package/lib/steps/steps.variable.css +2 -2
  70. package/lib/styles/mixins/mixins.css +43 -0
  71. package/lib/styles/mixins/mixins.less +1 -0
  72. package/lib/styles/mixins/mixins.variable.css +43 -0
  73. package/lib/styles/mixins/scroll.css +17 -0
  74. package/lib/styles/mixins/scroll.less +22 -0
  75. package/lib/styles/mixins/scroll.variable.css +119 -0
  76. package/lib/styles/themes/themes.less +2 -2
  77. package/lib/switcher/switcher.css +43 -0
  78. package/lib/switcher/switcher.variable.css +45 -2
  79. package/lib/tab/tab.variable.css +2 -2
  80. package/lib/table/const.d.ts +5 -0
  81. package/lib/table/index.js +1 -1
  82. package/lib/table/plugins/head-filter.less +1 -1
  83. package/lib/table/plugins/head-filter.variable.css +2 -2
  84. package/lib/table/plugins/head-sort.less +1 -1
  85. package/lib/table/plugins/head-sort.variable.css +2 -2
  86. package/lib/table/plugins/settings.css +23 -4
  87. package/lib/table/plugins/settings.less +26 -5
  88. package/lib/table/plugins/settings.variable.css +25 -6
  89. package/lib/table/props.d.ts +1 -0
  90. package/lib/table/table.css +668 -5
  91. package/lib/table/table.less +7 -1
  92. package/lib/table/table.variable.css +670 -7
  93. package/lib/table/use-common.d.ts +16 -1
  94. package/lib/table/utils.d.ts +1 -1
  95. package/lib/tag/tag.variable.css +2 -2
  96. package/lib/tag-input/tag-input.variable.css +2 -2
  97. package/lib/timeline/timeline.variable.css +2 -2
  98. package/lib/transfer/transfer.variable.css +2 -2
  99. package/lib/tree/index.js +1 -1
  100. package/lib/tree/tree.css +107 -0
  101. package/lib/tree/tree.less +2 -0
  102. package/lib/tree/tree.variable.css +109 -2
  103. package/lib/tree/use-node-action.d.ts +1 -1
  104. package/lib/tree/use-node-attribute.d.ts +1 -0
  105. package/lib/upload/upload.css +43 -0
  106. package/lib/upload/upload.variable.css +45 -2
  107. package/lib/virtual-render/virtual-render.variable.css +2 -2
  108. package/package.json +2 -2
package/lib/resize-layout/resize-layout.variable.css CHANGED
@@ -19,7 +19,7 @@
19
19
  --line-height-large: 18px;
20
20
  --component-size-small: 26px;
21
21
  --component-size-base: 32px;
22
- --component-size-large: 38px;
22
+ --component-size-large: 40px;
23
23
  --border-width-base: 1px;
24
24
  --border-style-base: solid;
25
25
  --border-radius-base: 2px;
@@ -34,7 +34,7 @@
34
34
  --input-horizontal-padding: 10px;
35
35
  --input-block-color: #f5f7fa;
36
36
  --input-block-hover-color: #eaebf0;
37
- --input-icon-size: var(--font-size-large);
37
+ --input-icon-size: var(--font-size-medium);
38
38
  --input-maxlength-color: #979ba5;
39
39
  --button-primary-hover-color: #5594fa;
40
40
  --button-danger-hover-color: #ff5656;
package/lib/select/select.css CHANGED
@@ -195,17 +195,17 @@
195
195
  align-items: center;
196
196
  justify-content: center;
197
197
  }
198
- .bk-popover2.bk-select-popover {
198
+ .bk-popover2.bk-pop2-content.bk-select-popover {
199
199
  padding: 0;
200
200
  }
201
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-empty {
201
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-empty {
202
202
  display: flex;
203
203
  align-items: center;
204
204
  justify-content: center;
205
205
  height: 56px;
206
206
  color: #63656e;
207
207
  }
208
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-empty .spinner {
208
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-empty .spinner {
209
209
  display: flex;
210
210
  width: 14px;
211
211
  height: 14px;
@@ -215,23 +215,23 @@
215
215
  align-items: center;
216
216
  justify-content: center;
217
217
  }
218
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-empty span {
218
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-empty span {
219
219
  margin-left: 4px;
220
220
  line-height: 18px;
221
221
  }
222
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-dropdown {
222
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-dropdown {
223
223
  overflow: auto;
224
224
  }
225
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-extension {
225
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-extension {
226
226
  display: flex;
227
227
  height: 40px;
228
228
  background-color: #fafbfd;
229
229
  align-items: center;
230
230
  }
231
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-options {
231
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-options {
232
232
  padding: 8px 0;
233
233
  }
234
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option {
234
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option {
235
235
  position: relative;
236
236
  height: 32px;
237
237
  padding: 0 12px;
@@ -244,56 +244,56 @@
244
244
  text-overflow: ellipsis;
245
245
  white-space: nowrap;
246
246
  }
247
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option-item {
247
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option-item {
248
248
  display: flex;
249
249
  align-items: center;
250
250
  justify-content: space-between;
251
251
  }
252
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option:hover,
253
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option.is-hover {
252
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option:hover,
253
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option.is-hover {
254
254
  color: #3a84ff;
255
255
  background-color: #f5f7fa;
256
256
  }
257
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option.is-selected {
257
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option.is-selected {
258
258
  color: #3a84ff;
259
259
  }
260
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option.is-disabled {
260
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option.is-disabled {
261
261
  color: #c4c6cc;
262
262
  cursor: not-allowed;
263
263
  background-color: transparent;
264
264
  }
265
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-options-loading {
265
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-options-loading {
266
266
  display: flex;
267
267
  align-items: center;
268
268
  justify-content: center;
269
269
  }
270
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-options-loading span {
270
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-options-loading span {
271
271
  margin-left: 4px;
272
272
  line-height: 18px;
273
273
  }
274
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group-label {
274
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group-label {
275
275
  height: 32px;
276
276
  padding: 0 8px;
277
277
  line-height: 32px;
278
278
  color: #979ba5;
279
279
  text-align: left;
280
280
  }
281
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group-label.collapsible {
281
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group-label.collapsible {
282
282
  cursor: pointer;
283
283
  }
284
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group.collapsible .bk-select-option {
284
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group.collapsible .bk-select-option {
285
285
  padding-left: 40px;
286
286
  }
287
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group.disabled .default-group-label {
287
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group.disabled .default-group-label {
288
288
  color: #c4c6cc;
289
289
  cursor: not-allowed;
290
290
  }
291
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .default-group-label {
291
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .default-group-label {
292
292
  display: flex;
293
293
  user-select: none;
294
294
  align-items: center;
295
295
  }
296
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon {
296
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon {
297
297
  display: flex;
298
298
  width: 12px;
299
299
  height: 12px;
@@ -302,9 +302,9 @@
302
302
  align-items: center;
303
303
  justify-content: center;
304
304
  }
305
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon.collapse {
305
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon.collapse {
306
306
  transform: rotate(-90deg);
307
307
  }
308
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .bk-select-option {
308
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .bk-select-option {
309
309
  padding-left: 24px;
310
310
  }
package/lib/select/select.less CHANGED
@@ -99,7 +99,7 @@
99
99
  &.is-focus.normal {
100
100
  .bk-select-trigger .bk-select-tag {
101
101
  border-color: @primary-color;
102
- box-shadow: 0px 0px 3px 0px #a3c5fd;
102
+ box-shadow: 0px 0px 3px 0px #a3c5fd;
103
103
  }
104
104
  }
105
105
 
@@ -131,7 +131,7 @@
131
131
 
132
132
  &.is-focused {
133
133
  .active();
134
-
134
+
135
135
  &.is-simplicity {
136
136
  border-color: transparent;
137
137
  border-bottom-color: @primary-color;
@@ -195,139 +195,143 @@
195
195
  }
196
196
  }
197
197
 
198
- .bk-popover2.bk-select-popover {
199
- padding: 0;
200
-
201
- .bk-select-content {
202
- .bk-select-empty {
203
- .flex-center();
204
- height: 56px;
205
- color: #63656e;
206
-
207
- .spinner {
208
- display: flex;
209
- width: 14px;
210
- height: 14px;
211
- margin-right: 4px;
212
- font-size: 14px;
213
- color: #c4c6cc;
214
- align-items: center;
215
- justify-content: center;
216
- }
198
+ .@{bk-prefix}-popover2 {
199
+ &.@{bk-prefix}-pop2-content {
200
+ &.bk-select-popover {
201
+ padding: 0;
202
+
203
+ .bk-select-content {
204
+ .bk-select-empty {
205
+ .flex-center();
206
+ height: 56px;
207
+ color: #63656e;
208
+
209
+ .spinner {
210
+ display: flex;
211
+ width: 14px;
212
+ height: 14px;
213
+ margin-right: 4px;
214
+ font-size: 14px;
215
+ color: #c4c6cc;
216
+ align-items: center;
217
+ justify-content: center;
218
+ }
217
219
 
218
- span {
219
- .icon-text()
220
- }
221
- }
220
+ span {
221
+ .icon-text()
222
+ }
223
+ }
222
224
 
223
- .bk-select-dropdown {
224
- overflow: auto;
225
- }
225
+ .bk-select-dropdown {
226
+ overflow: auto;
227
+ }
226
228
 
227
- .bk-select-extension {
228
- display: flex;
229
- height: 40px;
230
- background-color: #fafbfd;
231
- align-items: center;
232
- }
229
+ .bk-select-extension {
230
+ display: flex;
231
+ height: 40px;
232
+ background-color: #fafbfd;
233
+ align-items: center;
234
+ }
233
235
 
234
- .bk-select-options {
235
- padding: 8px 0;
236
- }
236
+ .bk-select-options {
237
+ padding: 8px 0;
238
+ }
237
239
 
238
- .bk-select-option {
239
- position: relative;
240
- height: 32px;
241
- padding: 0 12px;
242
- line-height: 32px;
243
- color: #63656e;
244
- text-align: left;
245
- cursor: pointer;
246
- user-select: none;
247
-
248
- .ellipsis();
249
-
250
- &-item {
251
- display: flex;
252
- align-items: center;
253
- justify-content: space-between;
254
- }
255
-
256
- &:hover,
257
- &.is-hover {
258
- color: #3a84ff;
259
- background-color: #f5f7fa;
260
- }
261
-
262
- &.is-selected {
263
- color: #3a84ff;
264
- }
265
-
266
- &.is-disabled {
267
- color: #c4c6cc;
268
- cursor: not-allowed;
269
- background-color: transparent;
270
- }
271
-
272
- }
240
+ .bk-select-option {
241
+ position: relative;
242
+ height: 32px;
243
+ padding: 0 12px;
244
+ line-height: 32px;
245
+ color: #63656e;
246
+ text-align: left;
247
+ cursor: pointer;
248
+ user-select: none;
273
249
 
274
- .bk-select-options-loading {
275
- .flex-center();
250
+ .ellipsis();
276
251
 
277
- span {
278
- .icon-text()
279
- }
280
- }
252
+ &-item {
253
+ display: flex;
254
+ align-items: center;
255
+ justify-content: space-between;
256
+ }
257
+
258
+ &:hover,
259
+ &.is-hover {
260
+ color: #3a84ff;
261
+ background-color: #f5f7fa;
262
+ }
263
+
264
+ &.is-selected {
265
+ color: #3a84ff;
266
+ }
267
+
268
+ &.is-disabled {
269
+ color: #c4c6cc;
270
+ cursor: not-allowed;
271
+ background-color: transparent;
272
+ }
281
273
 
282
- .bk-option-group {
283
- &-label {
284
- height: 32px;
285
- padding: 0 8px;
286
- line-height: 32px;
287
- color: #979ba5;
288
- text-align: left;
289
-
290
- &.collapsible {
291
- cursor: pointer;
292
- }
293
- }
294
-
295
- &.collapsible {
296
- .bk-select-option {
297
- padding-left: 40px;
298
274
  }
299
- }
300
-
301
- &.disabled {
302
- .default-group-label {
303
- color: #c4c6cc;
304
- cursor: not-allowed;
275
+
276
+ .bk-select-options-loading {
277
+ .flex-center();
278
+
279
+ span {
280
+ .icon-text()
281
+ }
305
282
  }
306
- }
307
-
308
- .default-group-label {
309
- display: flex;
310
- user-select: none;
311
- align-items: center;
312
-
313
- &-icon {
314
- display: flex;
315
- width: 12px;
316
- height: 12px;
317
- margin-right: 8px;
318
- transition: all .1s;
319
- align-items: center;
320
- justify-content: center;
321
-
322
- &.collapse {
323
- transform: rotate(-90deg);
283
+
284
+ .bk-option-group {
285
+ &-label {
286
+ height: 32px;
287
+ padding: 0 8px;
288
+ line-height: 32px;
289
+ color: #979ba5;
290
+ text-align: left;
291
+
292
+ &.collapsible {
293
+ cursor: pointer;
294
+ }
295
+ }
296
+
297
+ &.collapsible {
298
+ .bk-select-option {
299
+ padding-left: 40px;
300
+ }
301
+ }
302
+
303
+ &.disabled {
304
+ .default-group-label {
305
+ color: #c4c6cc;
306
+ cursor: not-allowed;
307
+ }
308
+ }
309
+
310
+ .default-group-label {
311
+ display: flex;
312
+ user-select: none;
313
+ align-items: center;
314
+
315
+ &-icon {
316
+ display: flex;
317
+ width: 12px;
318
+ height: 12px;
319
+ margin-right: 8px;
320
+ transition: all .1s;
321
+ align-items: center;
322
+ justify-content: center;
323
+
324
+ &.collapse {
325
+ transform: rotate(-90deg);
326
+ }
327
+ }
328
+ }
329
+
330
+ .bk-select-option {
331
+ padding-left: 24px;
324
332
  }
325
333
  }
326
334
  }
327
-
328
- .bk-select-option {
329
- padding-left: 24px;
330
- }
331
335
  }
332
336
  }
333
337
  }
package/lib/select/select.variable.css CHANGED
@@ -19,7 +19,7 @@
19
19
  --line-height-large: 18px;
20
20
  --component-size-small: 26px;
21
21
  --component-size-base: 32px;
22
- --component-size-large: 38px;
22
+ --component-size-large: 40px;
23
23
  --border-width-base: 1px;
24
24
  --border-style-base: solid;
25
25
  --border-radius-base: 2px;
@@ -34,7 +34,7 @@
34
34
  --input-horizontal-padding: 10px;
35
35
  --input-block-color: #f5f7fa;
36
36
  --input-block-hover-color: #eaebf0;
37
- --input-icon-size: var(--font-size-large);
37
+ --input-icon-size: var(--font-size-medium);
38
38
  --input-maxlength-color: #979ba5;
39
39
  --button-primary-hover-color: #5594fa;
40
40
  --button-danger-hover-color: #ff5656;
@@ -297,17 +297,17 @@
297
297
  align-items: center;
298
298
  justify-content: center;
299
299
  }
300
- .bk-popover2.bk-select-popover {
300
+ .bk-popover2.bk-pop2-content.bk-select-popover {
301
301
  padding: 0;
302
302
  }
303
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-empty {
303
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-empty {
304
304
  display: flex;
305
305
  align-items: center;
306
306
  justify-content: center;
307
307
  height: 56px;
308
308
  color: #63656e;
309
309
  }
310
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-empty .spinner {
310
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-empty .spinner {
311
311
  display: flex;
312
312
  width: 14px;
313
313
  height: 14px;
@@ -317,23 +317,23 @@
317
317
  align-items: center;
318
318
  justify-content: center;
319
319
  }
320
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-empty span {
320
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-empty span {
321
321
  margin-left: 4px;
322
322
  line-height: 18px;
323
323
  }
324
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-dropdown {
324
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-dropdown {
325
325
  overflow: auto;
326
326
  }
327
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-extension {
327
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-extension {
328
328
  display: flex;
329
329
  height: 40px;
330
330
  background-color: #fafbfd;
331
331
  align-items: center;
332
332
  }
333
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-options {
333
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-options {
334
334
  padding: 8px 0;
335
335
  }
336
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option {
336
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option {
337
337
  position: relative;
338
338
  height: 32px;
339
339
  padding: 0 12px;
@@ -346,56 +346,56 @@
346
346
  text-overflow: ellipsis;
347
347
  white-space: nowrap;
348
348
  }
349
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option-item {
349
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option-item {
350
350
  display: flex;
351
351
  align-items: center;
352
352
  justify-content: space-between;
353
353
  }
354
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option:hover,
355
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option.is-hover {
354
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option:hover,
355
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option.is-hover {
356
356
  color: #3a84ff;
357
357
  background-color: #f5f7fa;
358
358
  }
359
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option.is-selected {
359
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option.is-selected {
360
360
  color: #3a84ff;
361
361
  }
362
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-option.is-disabled {
362
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-option.is-disabled {
363
363
  color: #c4c6cc;
364
364
  cursor: not-allowed;
365
365
  background-color: transparent;
366
366
  }
367
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-options-loading {
367
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-options-loading {
368
368
  display: flex;
369
369
  align-items: center;
370
370
  justify-content: center;
371
371
  }
372
- .bk-popover2.bk-select-popover .bk-select-content .bk-select-options-loading span {
372
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-select-options-loading span {
373
373
  margin-left: 4px;
374
374
  line-height: 18px;
375
375
  }
376
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group-label {
376
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group-label {
377
377
  height: 32px;
378
378
  padding: 0 8px;
379
379
  line-height: 32px;
380
380
  color: #979ba5;
381
381
  text-align: left;
382
382
  }
383
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group-label.collapsible {
383
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group-label.collapsible {
384
384
  cursor: pointer;
385
385
  }
386
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group.collapsible .bk-select-option {
386
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group.collapsible .bk-select-option {
387
387
  padding-left: 40px;
388
388
  }
389
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group.disabled .default-group-label {
389
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group.disabled .default-group-label {
390
390
  color: #c4c6cc;
391
391
  cursor: not-allowed;
392
392
  }
393
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .default-group-label {
393
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .default-group-label {
394
394
  display: flex;
395
395
  user-select: none;
396
396
  align-items: center;
397
397
  }
398
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon {
398
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon {
399
399
  display: flex;
400
400
  width: 12px;
401
401
  height: 12px;
@@ -404,9 +404,9 @@
404
404
  align-items: center;
405
405
  justify-content: center;
406
406
  }
407
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon.collapse {
407
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .default-group-label-icon.collapse {
408
408
  transform: rotate(-90deg);
409
409
  }
410
- .bk-popover2.bk-select-popover .bk-select-content .bk-option-group .bk-select-option {
410
+ .bk-popover2.bk-pop2-content.bk-select-popover .bk-select-content .bk-option-group .bk-select-option {
411
411
  padding-left: 24px;
412
412
  }
package/lib/sideslider/sideslider.variable.css CHANGED
@@ -19,7 +19,7 @@
19
19
  --line-height-large: 18px;
20
20
  --component-size-small: 26px;
21
21
  --component-size-base: 32px;
22
- --component-size-large: 38px;
22
+ --component-size-large: 40px;
23
23
  --border-width-base: 1px;
24
24
  --border-style-base: solid;
25
25
  --border-radius-base: 2px;
@@ -34,7 +34,7 @@
34
34
  --input-horizontal-padding: 10px;
35
35
  --input-block-color: #f5f7fa;
36
36
  --input-block-hover-color: #eaebf0;
37
- --input-icon-size: var(--font-size-large);
37
+ --input-icon-size: var(--font-size-medium);
38
38
  --input-maxlength-color: #979ba5;
39
39
  --button-primary-hover-color: #5594fa;
40
40
  --button-danger-hover-color: #ff5656;
package/lib/slider/slider.variable.css CHANGED
@@ -19,7 +19,7 @@
19
19
  --line-height-large: 18px;
20
20
  --component-size-small: 26px;
21
21
  --component-size-base: 32px;
22
- --component-size-large: 38px;
22
+ --component-size-large: 40px;
23
23
  --border-width-base: 1px;
24
24
  --border-style-base: solid;
25
25
  --border-radius-base: 2px;
@@ -34,7 +34,7 @@
34
34
  --input-horizontal-padding: 10px;
35
35
  --input-block-color: #f5f7fa;
36
36
  --input-block-hover-color: #eaebf0;
37
- --input-icon-size: var(--font-size-large);
37
+ --input-icon-size: var(--font-size-medium);
38
38
  --input-maxlength-color: #979ba5;
39
39
  --button-primary-hover-color: #5594fa;
40
40
  --button-danger-hover-color: #ff5656;
package/lib/steps/steps.variable.css CHANGED
@@ -20,7 +20,7 @@
20
20
  --line-height-large: 18px;
21
21
  --component-size-small: 26px;
22
22
  --component-size-base: 32px;
23
- --component-size-large: 38px;
23
+ --component-size-large: 40px;
24
24
  --border-width-base: 1px;
25
25
  --border-style-base: solid;
26
26
  --border-radius-base: 2px;
@@ -35,7 +35,7 @@
35
35
  --input-horizontal-padding: 10px;
36
36
  --input-block-color: #f5f7fa;
37
37
  --input-block-hover-color: #eaebf0;
38
- --input-icon-size: var(--font-size-large);
38
+ --input-icon-size: var(--font-size-medium);
39
39
  --input-maxlength-color: #979ba5;
40
40
  --button-primary-hover-color: #5594fa;
41
41
  --button-danger-hover-color: #ff5656;
package/lib/styles/mixins/mixins.css CHANGED
@@ -27,3 +27,46 @@
27
27
  content: '';
28
28
  visibility: hidden;
29
29
  }
30
+ .bk-popper {
31
+ display: none;
32
+ padding: 7px 14px;
33
+ font-size: 12px;
34
+ color: #fff;
35
+ background: #333;
36
+ border-radius: 4px;
37
+ }
38
+ .bk-popper.light {
39
+ color: #63656e;
40
+ background: #fff;
41
+ box-shadow: #dcdee5 0px 0px 6px 0px;
42
+ }
43
+ .bk-popper .bk-popper-arrow,
44
+ .bk-popper .bk-popper-arrow::before {
45
+ position: absolute;
46
+ width: 8px;
47
+ height: 8px;
48
+ background: inherit;
49
+ }
50
+ .bk-popper .bk-popper-arrow {
51
+ visibility: hidden;
52
+ }
53
+ .bk-popper .bk-popper-arrow::before {
54
+ content: '';
55
+ visibility: visible;
56
+ transform: rotate(45deg);
57
+ }
58
+ .bk-popper[data-show] {
59
+ display: block;
60
+ }
61
+ .bk-popper[data-popper-placement^='top'] > .bk-popper-arrow {
62
+ bottom: -4px;
63
+ }
64
+ .bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow {
65
+ top: -4px;
66
+ }
67
+ .bk-popper[data-popper-placement^='left'] > .bk-popper-arrow {
68
+ right: -4px;
69
+ }
70
+ .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
71
+ left: -4px;
72
+ }
package/lib/styles/mixins/mixins.less CHANGED
@@ -2,3 +2,4 @@
2
2
  @import './animate.less';
3
3
  @import './ellipsis.less';
4
4
  @import './clearfix.less';
5
+ @import './popper.less';