bkui-vue 2.0.2-beta.41 → 2.0.2-beta.43

package/lib/popover/popover.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-popover.bk-pop2-content {
   position: absolute;

package/lib/process/process.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 * {
   box-sizing: border-box;

package/lib/progress/progress.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/radio/radio.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-radio-group {
   display: inline-flex;

package/lib/rate/rate.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-rate {
   position: relative;

package/lib/resize-layout/resize-layout.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-resize-layout {
   display: flex;

package/lib/scrollbar/css/scrollbar.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-scrollbar {
   overflow: hidden !important;

package/lib/search-select/search-select.variable.css

@@ -128,6 +128,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/select/index.d.ts

@@ -388,7 +388,7 @@ declare const BkSelect: {
         inputRef: import("vue").Ref<HTMLElement>;
         triggerRef: import("vue").Ref<HTMLElement>;
         contentRef: import("vue").Ref<HTMLElement>;
-        searchRef: import("vue").Ref<HTMLElement>;
+        searchRef: import("vue").Ref<HTMLInputElement>;
         scrollContainerRef: import("vue").Ref<HTMLElement>;
         selectTagInputRef: import("vue").Ref<import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
             selected: {
@@ -1572,7 +1572,7 @@ declare const BkSelect: {
         inputRef: import("vue").Ref<HTMLElement>;
         triggerRef: import("vue").Ref<HTMLElement>;
         contentRef: import("vue").Ref<HTMLElement>;
-        searchRef: import("vue").Ref<HTMLElement>;
+        searchRef: import("vue").Ref<HTMLInputElement>;
         scrollContainerRef: import("vue").Ref<HTMLElement>;
         selectTagInputRef: import("vue").Ref<import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
             selected: {
@@ -2391,7 +2391,7 @@ declare const BkSelect: {
     inputRef: import("vue").Ref<HTMLElement>;
     triggerRef: import("vue").Ref<HTMLElement>;
     contentRef: import("vue").Ref<HTMLElement>;
-    searchRef: import("vue").Ref<HTMLElement>;
+    searchRef: import("vue").Ref<HTMLInputElement>;
     scrollContainerRef: import("vue").Ref<HTMLElement>;
     selectTagInputRef: import("vue").Ref<import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
         selected: {

package/lib/select/index.js

@@ -4292,6 +4292,10 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
       emit('change', val, modelValue.value);
       // 重置Selected 以model-value为主
       handleSetSelectedData();
+      if (multiple.value) {
+        // 多选时enter之后变成tag不需要保存当前值
+        customOptionName.value = '';
+      }
     };
     // 派发toggle事件
     var handleTogglePopover = function handleTogglePopover() {
@@ -4317,7 +4321,6 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
       if (filterable.value && matchedOption) {
         // 开启搜索后，正好匹配到自定义选项，则不进行创建操作
         handleOptionSelected(matchedOption);
-        customOptionName.value = '';
         return;
       }
       var data = optionsMap.value.get(value);
@@ -4338,7 +4341,6 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
         emitChange(value);
         handleHidePopover();
       }
-      customOptionName.value = '';
     };
     // Option点击事件
     var handleOptionSelected = function handleOptionSelected(option) {
@@ -4379,9 +4381,6 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
           label: option.optionName || option.optionID,
           value: option.optionID
         }];
-        if (filterable.value && allowCreate.value) {
-          customOptionName.value = '';
-        }
         emitChange(option.optionID);
         emit('select', option.optionID);
         handleHidePopover();
@@ -4429,6 +4428,7 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
     var handleClear = function handleClear(e) {
       e.stopPropagation();
       selected.value = [];
+      customOptionName.value = '';
       clearMultipleInputValue();
       emitChange(multiple.value ? [] : '');
       emit('clear', multiple.value ? [] : '');
@@ -4605,9 +4605,10 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
         case 'NumpadEnter':
         case 'Enter':
           {
+            var _searchRef$value2;
             var value = e.target.value;
             // 搜索和创建的时候不触发enter事件
-            if (allowCreate.value && value || e.target === searchRef.value) return;
+            if (allowCreate.value && value || e.target === searchRef.value && (_searchRef$value2 = searchRef.value) !== null && _searchRef$value2 !== void 0 && _searchRef$value2.value) return;
             var option = optionsMap.value.get(activeOptionValue.value);
             handleOptionSelected(option);
             break;
@@ -4730,7 +4731,7 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
           "theme": "primary"
         }, null);
       }
-      if (_this.clearable && _this.isHover && _this.selected.length && !_this.isDisabled) {
+      if (_this.clearable && _this.isHover && _this.selected.length && !_this.isDisabled || _this.allowCreate && _this.isHover && _this.customOptionName && !_this.isDisabled) {
         return (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Close, {
           "class": "clear-icon",
           "onClick": _this.handleClear
@@ -4832,7 +4833,7 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
         "ref": "inputRef",
         "behavior": _this.behavior,
         "disabled": _this.isDisabled,
-        "modelValue": _this.isInput ? _this.customOptionName : _this.selectedLabel.join(','),
+        "modelValue": _this.isInput && _this.customOptionName ? _this.customOptionName : _this.selectedLabel.join(','),
         "placeholder": _this.isInput ? _this.selectedLabel.join(',') || _this.localPlaceholder : _this.localPlaceholder,
         "readonly": !_this.isInput,
         "selectReadonly": true,

package/lib/select/select.d.ts

@@ -375,7 +375,7 @@ declare const _default: import("vue").DefineComponent<{
     inputRef: import("vue").Ref<HTMLElement>;
     triggerRef: import("vue").Ref<HTMLElement>;
     contentRef: import("vue").Ref<HTMLElement>;
-    searchRef: import("vue").Ref<HTMLElement>;
+    searchRef: import("vue").Ref<HTMLInputElement>;
     scrollContainerRef: import("vue").Ref<HTMLElement>;
     selectTagInputRef: import("vue").Ref<import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
         selected: {

package/lib/select/select.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/sideslider/sideslider.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-sideslider.is-position-right .bk-modal-wrapper {
   right: 0;

package/lib/slider/slider.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-slider {
   display: flex;

package/lib/steps/steps.variable.css

@@ -128,6 +128,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 * {
   box-sizing: border-box;

package/lib/styles/mixins/animate.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/styles/mixins/popper.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-popper {
   display: none;

package/lib/styles/mixins/scroll.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-F-scroll-x {
   overflow-x: auto;

package/lib/styles/reset.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .scroll-bar-style::-webkit-scrollbar {
   width: 4px;

package/lib/styles/themes/themes.less

@@ -173,3 +173,6 @@
 // select theme
 @select-active-color: #e1ecff;
 @select-hover-color: #f5f7fa;
+
+// info-box theme
+@sub-title-bg-color: #f5f6fa;

package/lib/swiper/swiper.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-swiper-home {
   position: relative;

package/lib/switcher/switcher.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/tab/tab.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-tab {
   position: relative;

package/lib/table/plugins/head-filter.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-table-head-action {
   display: flex;

package/lib/table/plugins/head-sort.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-head-cell-sort {
   display: flex;

package/lib/table/plugins/settings.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-table-settings[data-bk-table-settings-theme='true'] {
   padding: 0;

package/lib/table/table.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-F-scroll-x {
   overflow-x: auto;

package/lib/tag/tag.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-tag {
   display: inline-flex;

package/lib/tag-input/tag-input.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-tag-input {
   position: relative;

package/lib/time-picker/time-picker.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-time-picker-header {
   height: 46px;

package/lib/timeline/timeline.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 * {
   box-sizing: border-box;

package/lib/transfer/transfer.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-transfer {
   display: flex;

package/lib/tree/tree.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-F-scroll-x {
   overflow-x: auto;

package/lib/upload/upload.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/virtual-render/virtual-render.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-F-scroll-x {
   overflow-x: auto;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bkui-vue",
-  "version": "2.0.2-beta.41",
+  "version": "2.0.2-beta.43",
   "workspaces": [
     "packages/**",
     "scripts/cli",