bkui-vue 0.0.1-beta.206 → 0.0.1-beta.207

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 (78) hide show
  1. package/dist/index.cjs.js +25 -25
  2. package/dist/index.esm.js +51 -37
  3. package/dist/index.umd.js +25 -25
  4. package/dist/style.css +1 -1
  5. package/dist/style.variable.css +1 -1
  6. package/lib/affix/affix.variable.css +6 -0
  7. package/lib/alert/alert.variable.css +6 -0
  8. package/lib/backtop/backtop.variable.css +6 -0
  9. package/lib/badge/badge.variable.css +6 -0
  10. package/lib/breadcrumb/breadcrumb.variable.css +6 -0
  11. package/lib/button/button.variable.css +6 -0
  12. package/lib/card/card.variable.css +6 -0
  13. package/lib/cascader/cascader.variable.css +6 -0
  14. package/lib/checkbox/checkbox.variable.css +6 -0
  15. package/lib/code-diff/code-diff.variable.css +6 -0
  16. package/lib/collapse/collapse.variable.css +6 -0
  17. package/lib/color-picker/color-picker.variable.css +6 -0
  18. package/lib/container/container.variable.css +6 -0
  19. package/lib/date-picker/date-picker.variable.css +6 -0
  20. package/lib/directives/index.js +1 -1
  21. package/lib/divider/divider.variable.css +6 -0
  22. package/lib/dropdown/dropdown.variable.css +6 -0
  23. package/lib/exception/exception.variable.css +6 -0
  24. package/lib/fixed-navbar/fixed-navbar.variable.css +6 -0
  25. package/lib/form/form.variable.css +6 -0
  26. package/lib/input/input.variable.css +6 -0
  27. package/lib/link/link.variable.css +6 -0
  28. package/lib/loading/loading.variable.css +6 -0
  29. package/lib/menu/menu.variable.css +6 -0
  30. package/lib/menu/submenu.variable.css +6 -0
  31. package/lib/message/message.variable.css +6 -0
  32. package/lib/navigation/navigation.variable.css +6 -0
  33. package/lib/notify/notify.variable.css +6 -0
  34. package/lib/pagination/pagination.variable.css +6 -0
  35. package/lib/popover/index.d.ts +7 -7
  36. package/lib/popover/popover.d.ts +2 -2
  37. package/lib/popover/popover.variable.css +6 -0
  38. package/lib/popover2/index.d.ts +7 -7
  39. package/lib/popover2/popover2.d.ts +2 -2
  40. package/lib/popover2/popover2.variable.css +6 -0
  41. package/lib/process/process.variable.css +6 -0
  42. package/lib/progress/progress.variable.css +6 -0
  43. package/lib/radio/radio.variable.css +6 -0
  44. package/lib/resize-layout/resize-layout.variable.css +6 -0
  45. package/lib/search-select/index.js +1 -1
  46. package/lib/search-select/search-select.css +196 -199
  47. package/lib/search-select/search-select.less +195 -47
  48. package/lib/search-select/search-select.variable.css +217 -214
  49. package/lib/search-select/utils.d.ts +2 -2
  50. package/lib/select/index.d.ts +4 -4
  51. package/lib/select/select.d.ts +1 -1
  52. package/lib/select/select.variable.css +6 -0
  53. package/lib/sideslider/sideslider.variable.css +6 -0
  54. package/lib/slider/slider.variable.css +6 -0
  55. package/lib/steps/steps.variable.css +6 -0
  56. package/lib/styles/mixins/scroll.variable.css +6 -0
  57. package/lib/styles/themes/themes.less +9 -0
  58. package/lib/switcher/switcher.variable.css +6 -0
  59. package/lib/tab/tab.variable.css +6 -0
  60. package/lib/table/plugins/head-filter.variable.css +6 -0
  61. package/lib/table/plugins/head-sort.variable.css +6 -0
  62. package/lib/table/plugins/settings.variable.css +6 -0
  63. package/lib/table/table.variable.css +6 -0
  64. package/lib/tag/tag.variable.css +6 -0
  65. package/lib/tag-input/tag-input.variable.css +6 -0
  66. package/lib/time-picker/time-picker.variable.css +6 -0
  67. package/lib/timeline/timeline.variable.css +6 -0
  68. package/lib/transfer/transfer.variable.css +6 -0
  69. package/lib/tree/tree.variable.css +6 -0
  70. package/lib/upload/upload.variable.css +6 -0
  71. package/lib/virtual-render/virtual-render.variable.css +6 -0
  72. package/package.json +1 -1
  73. package/lib/search-select/menu.css +0 -145
  74. package/lib/search-select/menu.less +0 -134
  75. package/lib/search-select/menu.variable.css +0 -145
  76. package/lib/search-select/selected.css +0 -21
  77. package/lib/search-select/selected.less +0 -24
  78. package/lib/search-select/selected.variable.css +0 -21
@@ -71,182 +71,31 @@
71
71
  .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
72
72
  left: -4px;
73
73
  }
74
- .menu-list-mixin {
75
- display: flex;
76
- flex-direction: column;
77
- }
78
- .menu-item-mixin {
79
- display: flex;
80
- align-items: center;
81
- width: 100%;
82
- height: 32px;
83
- padding: 0 12px;
84
- flex: 0 0 32px;
85
- outline: none;
86
- }
87
- .menu-item-mixin:hover {
88
- cursor: pointer;
89
- background-color: #f5f7fa;
90
- }
91
- .menu-disabled-mixin {
92
- color: #c4c6cc;
93
- }
94
- .menu-disabled-mixin:hover {
95
- cursor: not-allowed;
96
- background-color: white;
97
- }
98
- .search-select-menu {
99
- display: flex;
100
- min-width: 160px;
101
- font-size: 12px;
102
- color: #63656e;
103
- flex-direction: column;
104
- }
105
- .search-select-menu .menu-header {
106
- display: flex;
107
- flex-direction: column;
108
- border-bottom: 1px solid #dcdee5;
109
- }
110
- .search-select-menu .menu-header-item {
111
- display: flex;
112
- align-items: center;
113
- width: 100%;
114
- height: 32px;
115
- padding: 0 12px;
116
- flex: 0 0 32px;
117
- outline: none;
118
- }
119
- .search-select-menu .menu-header-item:hover {
120
- cursor: pointer;
121
- background-color: #f5f7fa;
122
- }
123
- .search-select-menu .menu-header-item.is-disabled {
124
- color: #c4c6cc;
125
- }
126
- .search-select-menu .menu-header-item.is-disabled:hover {
127
- cursor: not-allowed;
128
- background-color: white;
129
- }
130
- .search-select-menu .menu-content {
131
- display: flex;
132
- flex-direction: column;
133
- flex: 1;
134
- max-height: 240px;
135
- overflow: auto;
136
- }
137
- .search-select-menu .menu-content .menu-item {
138
- display: flex;
139
- align-items: center;
140
- width: 100%;
74
+ .bk-search-select {
75
+ position: relative;
76
+ z-index: 9;
141
77
  height: 32px;
142
- padding: 0 12px;
143
- flex: 0 0 32px;
144
- outline: none;
145
- }
146
- .search-select-menu .menu-content .menu-item:hover {
147
- cursor: pointer;
148
- background-color: #f5f7fa;
149
- }
150
- .search-select-menu .menu-content .menu-item .is-keyword {
151
- display: inline-flex;
152
- color: #3a84ff;
153
- }
154
- .search-select-menu .menu-content .menu-item .is-selected {
155
- display: flex;
156
- width: 14px;
157
- height: 14px;
158
- margin-left: auto;
159
- overflow: hidden;
160
- font-size: 18px;
161
- font-weight: bold;
162
- color: #3a84ff;
163
- align-items: center;
164
- justify-content: center;
165
- }
166
- .search-select-menu .menu-content .menu-item.is-hover {
167
- color: #3a84ff;
168
- background-color: #f5f7fa;
169
- }
170
- .search-select-menu .menu-content .menu-item.is-hover .menu-name {
171
- color: #3a84ff;
172
- }
173
- .search-select-menu .menu-content .menu-item.is-disabled {
174
- color: #c4c6cc;
175
- }
176
- .search-select-menu .menu-content .menu-item.is-disabled:hover {
177
- cursor: not-allowed;
178
- background-color: white;
179
- }
180
- .search-select-menu .menu-content .menu-item.is-disabled .menu-name {
181
- color: #c4c6cc;
78
+ overflow: inherit;
182
79
  }
183
- .search-select-menu .menu-content .menu-item .menu-name {
184
- display: flex;
185
- max-width: 100px;
186
- margin-right: 5px;
187
- font-weight: bold;
188
- color: #63656e;
189
- align-items: center;
80
+ .bk-search-select .focus {
81
+ color: #3c96ff;
82
+ background: #fff !important;
83
+ border-color: #3a84ff !important;
190
84
  }
191
- .search-select-menu .menu-footer {
192
- display: flex;
193
- width: 100%;
85
+ .bk-search-select .div-input {
194
86
  height: 32px;
195
- border-top: 1px solid #dcdee5;
196
- align-items: center;
197
- }
198
- .search-select-menu .menu-footer-btn {
199
- flex: 1;
200
- display: flex;
201
- align-items: center;
202
- justify-content: center;
203
- height: 100%;
204
- }
205
- .search-select-menu .menu-footer-btn:first-child {
206
- border-right: 1px solid #dcdee5;
207
- }
208
- .search-select-menu .menu-footer-btn:hover {
209
- color: #3a84ff;
210
- cursor: pointer;
211
- }
212
- .search-select-menu .menu-footer-btn.is-disabled {
213
- color: #c4c6cc;
214
- }
215
- .search-select-menu .menu-footer-btn.is-disabled:hover {
216
- cursor: not-allowed;
217
- background-color: white;
218
- }
219
- .search-seleted-input {
220
- position: relative;
221
- display: flex;
222
- height: 100%;
223
- min-width: 150px;
224
- min-width: 40px;
225
- padding: 0 10px;
226
- margin-top: -4px;
227
- color: #63656e;
228
- border: none;
229
- align-items: center;
230
- offset: none;
231
- }
232
- .search-seleted-input .div-input {
233
- height: 30px;
234
87
  padding: 5px 0;
235
88
  line-height: 20px;
236
89
  word-break: break-all;
237
90
  flex: 1 1 auto;
238
- outline: none;
239
91
  }
240
- .search-select-wrap {
241
- position: relative;
242
- z-index: 9;
243
- height: 32px;
244
- overflow: inherit;
92
+ .bk-search-select .div-input:focus {
93
+ outline: none;
245
94
  }
246
- .search-select-wrap .bk-search-select {
95
+ .bk-search-select-container {
247
96
  position: relative;
248
97
  display: flex;
249
- min-height: 30px;
98
+ min-height: 32px;
250
99
  overflow: hidden;
251
100
  font-size: 12px;
252
101
  color: #63656e;
@@ -260,19 +109,19 @@
260
109
  align-items: center;
261
110
  flex-wrap: wrap;
262
111
  }
263
- .search-select-wrap .bk-search-select.is-focus {
112
+ .bk-search-select-container.is-focus {
264
113
  overflow: auto;
265
114
  color: #3c96ff;
266
115
  background: #fff !important;
267
- border-color: #3c96ff !important;
116
+ border-color: #3a84ff !important;
268
117
  }
269
- .search-select-wrap .bk-search-select .search-prefix {
118
+ .bk-search-select-container .search-prefix {
270
119
  flex: 0 0 auto;
271
120
  display: flex;
272
121
  align-items: center;
273
122
  height: 100%;
274
123
  }
275
- .search-select-wrap .bk-search-select .search-input {
124
+ .bk-search-select-container .search-container {
276
125
  position: relative;
277
126
  display: flex;
278
127
  min-height: 26px;
@@ -285,7 +134,7 @@
285
134
  flex-wrap: wrap;
286
135
  align-items: center;
287
136
  }
288
- .search-select-wrap .bk-search-select .search-input-chip {
137
+ .bk-search-select-container .search-container-selected {
289
138
  position: relative;
290
139
  display: inline-block;
291
140
  max-width: 99%;
@@ -298,24 +147,24 @@
298
147
  flex: 0 0 auto;
299
148
  align-self: center;
300
149
  }
301
- .search-select-wrap .bk-search-select .search-input-chip.hidden-chip {
150
+ .bk-search-select-container .search-container-selected.hidden-selected {
302
151
  visibility: hidden;
303
152
  }
304
- .search-select-wrap .bk-search-select .search-input-chip.overflow-chip {
153
+ .bk-search-select-container .search-container-selected.overflow-selected {
305
154
  padding-right: 8px;
306
155
  }
307
- .search-select-wrap .bk-search-select .search-input-chip:hover {
156
+ .bk-search-select-container .search-container-selected:hover {
308
157
  background: #dcdee5;
309
158
  }
310
- .search-select-wrap .bk-search-select .search-input-chip:hover .chip-clear {
159
+ .bk-search-select-container .search-container-selected:hover .selected-clear {
311
160
  color: #63656e;
312
161
  }
313
- .search-select-wrap .bk-search-select .search-input-chip .chip-name {
162
+ .bk-search-select-container .search-container-selected .selected-name {
314
163
  display: inline-block;
315
164
  margin-right: 20px;
316
165
  word-break: break-all;
317
166
  }
318
- .search-select-wrap .bk-search-select .search-input-chip .chip-clear {
167
+ .bk-search-select-container .search-container-selected .selected-clear {
319
168
  position: absolute;
320
169
  top: 4px;
321
170
  right: 3px;
@@ -331,7 +180,7 @@
331
180
  align-items: center;
332
181
  justify-content: center;
333
182
  }
334
- .search-select-wrap .bk-search-select .search-input-input {
183
+ .bk-search-select-container .search-container-input {
335
184
  position: relative;
336
185
  display: flex;
337
186
  height: 100%;
@@ -343,31 +192,34 @@
343
192
  flex: 1 1 auto;
344
193
  align-items: center;
345
194
  }
346
- .search-select-wrap .bk-search-select .search-input-input .div-input {
347
- height: 30px;
348
- padding: 5px 0;
349
- line-height: 20px;
350
- word-break: break-all;
351
- flex: 1 1 auto;
352
- }
353
- .search-select-wrap .bk-search-select .search-input-input .div-input:focus {
354
- outline: none;
355
- }
356
- .search-select-wrap .bk-search-select .search-input-input .input-before:before {
195
+ .bk-search-select-container .search-container-input .input-before:before {
357
196
  color: #c4c6cc;
358
197
  content: attr(data-placeholder);
359
198
  }
360
- .search-select-wrap .bk-search-select .search-input-input .input-after:after {
199
+ .bk-search-select-container .search-container-input .input-after:after {
361
200
  padding-left: 2px;
362
201
  color: #c4c6cc;
363
202
  content: attr(data-tips);
364
203
  }
365
- .search-select-wrap .bk-search-select .search-nextfix {
204
+ .bk-search-select-container .search-container .selected-input {
205
+ position: relative;
366
206
  display: flex;
207
+ height: 100%;
208
+ min-width: 40px;
209
+ padding: 0 10px;
210
+ margin-top: -4px;
211
+ color: #63656e;
212
+ border: none;
213
+ align-items: center;
214
+ }
215
+ .bk-search-select-container .search-nextfix {
367
216
  color: #c4c6cc;
217
+ flex: 0 0 auto;
218
+ display: flex;
368
219
  align-items: center;
220
+ height: 100%;
369
221
  }
370
- .search-select-wrap .bk-search-select .search-nextfix .search-clear {
222
+ .bk-search-select-container .search-nextfix .search-clear {
371
223
  display: flex;
372
224
  width: 12px;
373
225
  height: 12px;
@@ -377,11 +229,11 @@
377
229
  align-items: center;
378
230
  justify-content: center;
379
231
  }
380
- .search-select-wrap .bk-search-select .search-nextfix .search-clear:hover {
232
+ .bk-search-select-container .search-nextfix .search-clear:hover {
381
233
  color: #979ba5;
382
234
  cursor: pointer;
383
235
  }
384
- .search-select-wrap .bk-search-select .search-nextfix .search-nextfix-icon {
236
+ .bk-search-select-container .search-nextfix .search-nextfix-icon {
385
237
  display: flex;
386
238
  margin-right: 8px;
387
239
  font-size: 16px;
@@ -389,21 +241,21 @@
389
241
  align-items: center;
390
242
  justify-content: center;
391
243
  }
392
- .search-select-wrap .bk-search-select .search-nextfix .search-nextfix-icon.is-focus {
244
+ .bk-search-select-container .search-nextfix .search-nextfix-icon.is-focus {
393
245
  color: #3c96ff;
394
246
  background: #fff !important;
395
- border-color: #3c96ff !important;
247
+ border-color: #3a84ff !important;
396
248
  }
397
- .search-select-wrap .bk-search-select::-webkit-scrollbar {
249
+ .bk-search-select-container::-webkit-scrollbar {
398
250
  width: 3px;
399
251
  height: 5px;
400
252
  }
401
- .search-select-wrap .bk-search-select::-webkit-scrollbar-thumb {
253
+ .bk-search-select-container::-webkit-scrollbar-thumb {
402
254
  background: #e6e9ea;
403
255
  border-radius: 20px;
404
256
  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
405
257
  }
406
- .search-select-wrap .bk-select-tips {
258
+ .bk-search-select-tips {
407
259
  display: flex;
408
260
  margin-top: 5px;
409
261
  font-size: 12px;
@@ -411,7 +263,7 @@
411
263
  color: #ea3636;
412
264
  align-items: center;
413
265
  }
414
- .search-select-wrap .bk-select-tips .select-tips {
266
+ .bk-search-select-tips .select-tips {
415
267
  display: flex;
416
268
  width: 16px;
417
269
  height: 16px;
@@ -421,6 +273,151 @@
421
273
  align-items: center;
422
274
  justify-content: center;
423
275
  }
424
- .popover-content {
276
+ .bk-search-select-menu {
277
+ display: flex;
278
+ min-width: 160px;
279
+ font-size: 12px;
280
+ color: #63656e;
281
+ flex-direction: column;
282
+ }
283
+ .bk-search-select-menu .menu-list-mixin {
284
+ display: flex;
285
+ flex-direction: column;
286
+ }
287
+ .bk-search-select-menu .menu-item-mixin {
288
+ display: flex;
289
+ align-items: center;
290
+ width: 100%;
291
+ height: 32px;
292
+ padding: 0 12px;
293
+ flex: 0 0 32px;
294
+ outline: none;
295
+ }
296
+ .bk-search-select-menu .menu-item-mixin:hover {
297
+ cursor: pointer;
298
+ background-color: #f5f7fa;
299
+ }
300
+ .bk-search-select-menu .menu-disabled-mixin {
301
+ color: #c4c6cc;
302
+ }
303
+ .bk-search-select-menu .menu-disabled-mixin:hover {
304
+ cursor: not-allowed;
305
+ background-color: white;
306
+ }
307
+ .bk-search-select-menu .menu-header {
308
+ display: flex;
309
+ flex-direction: column;
310
+ border-bottom: 1px solid #c4c6cc;
311
+ }
312
+ .bk-search-select-menu .menu-header-item {
313
+ display: flex;
314
+ align-items: center;
315
+ width: 100%;
316
+ height: 32px;
317
+ padding: 0 12px;
318
+ flex: 0 0 32px;
319
+ outline: none;
320
+ }
321
+ .bk-search-select-menu .menu-header-item:hover {
322
+ cursor: pointer;
323
+ background-color: #f5f7fa;
324
+ }
325
+ .bk-search-select-menu .menu-header-item.is-disabled {
326
+ color: #c4c6cc;
327
+ }
328
+ .bk-search-select-menu .menu-header-item.is-disabled:hover {
329
+ cursor: not-allowed;
330
+ background-color: white;
331
+ }
332
+ .bk-search-select-menu .menu-content {
333
+ display: flex;
334
+ flex-direction: column;
335
+ flex: 1;
336
+ max-height: 240px;
337
+ overflow: auto;
338
+ }
339
+ .bk-search-select-menu .menu-content .menu-item {
340
+ display: flex;
341
+ align-items: center;
342
+ width: 100%;
343
+ height: 32px;
344
+ padding: 0 12px;
345
+ flex: 0 0 32px;
346
+ outline: none;
347
+ }
348
+ .bk-search-select-menu .menu-content .menu-item:hover {
349
+ cursor: pointer;
350
+ background-color: #f5f7fa;
351
+ }
352
+ .bk-search-select-menu .menu-content .menu-item .is-keyword {
353
+ display: inline-flex;
354
+ color: #3a84ff;
355
+ }
356
+ .bk-search-select-menu .menu-content .menu-item .is-selected {
357
+ display: flex;
358
+ width: 14px;
359
+ height: 14px;
360
+ margin-left: auto;
361
+ overflow: hidden;
362
+ font-size: 18px;
363
+ font-weight: bold;
364
+ color: #3a84ff;
365
+ align-items: center;
366
+ justify-content: center;
367
+ }
368
+ .bk-search-select-menu .menu-content .menu-item.is-hover {
369
+ color: #3a84ff;
370
+ background-color: #f5f7fa;
371
+ }
372
+ .bk-search-select-menu .menu-content .menu-item.is-hover .menu-name {
373
+ color: #3a84ff;
374
+ }
375
+ .bk-search-select-menu .menu-content .menu-item.is-disabled {
376
+ color: #c4c6cc;
377
+ }
378
+ .bk-search-select-menu .menu-content .menu-item.is-disabled:hover {
379
+ cursor: not-allowed;
380
+ background-color: white;
381
+ }
382
+ .bk-search-select-menu .menu-content .menu-item.is-disabled .menu-name {
383
+ color: #c4c6cc;
384
+ }
385
+ .bk-search-select-menu .menu-content .menu-item .menu-name {
386
+ display: flex;
387
+ max-width: 100px;
388
+ margin-right: 5px;
389
+ font-weight: bold;
390
+ color: #63656e;
391
+ align-items: center;
392
+ }
393
+ .bk-search-select-menu .menu-footer {
394
+ display: flex;
395
+ width: 100%;
396
+ height: 32px;
397
+ border-top: 1px solid #c4c6cc;
398
+ align-items: center;
399
+ }
400
+ .bk-search-select-menu .menu-footer-btn {
401
+ flex: 1;
402
+ display: flex;
403
+ align-items: center;
404
+ justify-content: center;
405
+ height: 100%;
406
+ }
407
+ .bk-search-select-menu .menu-footer-btn:first-child {
408
+ border-right: 1px solid #c4c6cc;
409
+ }
410
+ .bk-search-select-menu .menu-footer-btn:hover {
411
+ color: #3a84ff;
412
+ cursor: pointer;
413
+ }
414
+ .bk-search-select-menu .menu-footer-btn.is-disabled {
415
+ color: #c4c6cc;
416
+ }
417
+ .bk-search-select-menu .menu-footer-btn.is-disabled:hover {
418
+ cursor: not-allowed;
419
+ background-color: white;
420
+ }
421
+ .bk-search-select-popover {
425
422
  margin: -7px -14px;
426
423
  }