bkui-vue 1.0.3-beta.53 → 1.0.3-beta.55

package/lib/search-select/input.d.ts

@@ -53,8 +53,9 @@ declare const _default: import("vue").DefineComponent<{
     };
     documentArrowEvent: (e: KeyboardEvent) => void;
     handleClickOutside: (e: MouseEvent) => void;
-    handleInputFocus: (e: FocusEvent) => void;
+    handleInputFocus: () => void;
     handleInputChange: (event: Event) => void;
+    handleInputPaste: (event: ClipboardEvent) => void;
     handleLogicalChange: (logical: SearchLogical) => void;
     handleInputKeyup: (event: KeyboardEvent) => void;
     handleSelectItem: (item: ICommonItem, type?: SearchItemType) => Promise<void>;

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

@@ -189,6 +189,7 @@
   margin-top: -4px;
   color: #63656e;
   border: none;
+  flex: 1;
 }
 .bk-search-select-container .search-container-input .input-before:before {
   color: #c4c6cc;
@@ -287,12 +288,16 @@
 }
 .bk-search-select-menu .menu-item-mixin {
   display: flex;
-  align-items: center;
   width: 100%;
   height: 32px;
+  max-width: 500px;
   padding: 0 8px;
-  flex: 0 0 32px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   outline: none;
+  align-items: center;
+  flex: 0 0 32px;
 }
 .bk-search-select-menu .menu-item-mixin:hover {
   cursor: pointer;
@@ -312,12 +317,16 @@
 }
 .bk-search-select-menu .menu-header-item {
   display: flex;
-  align-items: center;
   width: 100%;
   height: 32px;
+  max-width: 500px;
   padding: 0 8px;
-  flex: 0 0 32px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   outline: none;
+  align-items: center;
+  flex: 0 0 32px;
 }
 .bk-search-select-menu .menu-header-item:hover {
   cursor: pointer;
@@ -366,12 +375,16 @@
 }
 .bk-search-select-menu .menu-content .menu-item {
   display: flex;
-  align-items: center;
   width: 100%;
   height: 32px;
+  max-width: 500px;
   padding: 0 8px;
-  flex: 0 0 32px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   outline: none;
+  align-items: center;
+  flex: 0 0 32px;
   white-space: pre;
 }
 .bk-search-select-menu .menu-content .menu-item:hover {

package/lib/search-select/search-select.d.ts

@@ -137,8 +137,9 @@ declare const _default: import("vue").DefineComponent<{
         };
         documentArrowEvent: (e: KeyboardEvent) => void;
         handleClickOutside: (e: MouseEvent) => void;
-        handleInputFocus: (e: FocusEvent) => void;
+        handleInputFocus: () => void;
         handleInputChange: (event: Event) => void;
+        handleInputPaste: (event: ClipboardEvent) => void;
         handleLogicalChange: (logical: SearchLogical) => void;
         handleInputKeyup: (event: KeyboardEvent) => void;
         handleSelectItem: (item: ICommonItem, type?: SearchItemType) => Promise<void>;
@@ -209,6 +210,7 @@ declare const _default: import("vue").DefineComponent<{
         }[];
         condition: string;
         logical: SearchLogical;
+        nameRenderkey: string;
         searchItem: {
             id: string;
             name: string;
@@ -278,6 +280,9 @@ declare const _default: import("vue").DefineComponent<{
         readonly showLogical: boolean;
         isSpecialType: () => boolean;
         addValue: (item: ICommonItem) => void;
+        str2Values: (str: string) => ICommonItem[];
+        addValues: (str: string, mergeValues?: boolean) => void;
+        getValue: (str: string) => ICommonItem;
         toValue: () => ISearchValue;
         toValueKey: () => string;
         isInValueList: (item: ICommonItem) => boolean;

package/lib/search-select/search-select.less

@@ -2,10 +2,8 @@
 @import '../styles/themes/themes.less';
 @import '../styles/mixins/mixins.less';
 
-
 @search-select-name: ~'@{bk-prefix}-search-select';
 
-
 .@{search-select-name} {
   position: relative;
   z-index: 9;
@@ -41,7 +39,7 @@
     border-radius: @border-radius-base;
     outline: none;
     box-sizing: border-box;
-    transition: border .2s linear;
+    transition: border 0.2s linear;
     resize: none;
     flex-direction: row;
     align-items: center;
@@ -72,7 +70,7 @@
       margin-top: 4px;
       overflow: visible;
       text-align: left;
-      transition: max-height .3s cubic-bezier(.4, 0, .2, 1);
+      transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
       flex: 1;
       flex-wrap: wrap;
       align-items: center;
@@ -91,7 +89,7 @@
         align-self: center;
 
         &.hidden-selected {
-          visibility: hidden
+          visibility: hidden;
         }
 
         &.overflow-selected {
@@ -139,6 +137,7 @@
         margin-top: -4px;
         color: @search-select-font-color;
         border: none;
+        flex: 1;
 
         .input-before {
           &:before {
@@ -198,7 +197,7 @@
         display: flex;
         margin-right: 8px;
         font-size: 16px;
-        transition: color .2s linear;
+        transition: color 0.2s linear;
         align-items: center;
         justify-content: center;
 
@@ -216,7 +215,7 @@
     &::-webkit-scrollbar-thumb {
       background: #e6e9ea;
       border-radius: 20px;
-      box-shadow: inset 0 0 6px rgba(204, 204, 204, .3);
+      box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
     }
   }
 
@@ -255,12 +254,16 @@
 
   .menu-item-mixin {
     display: flex;
-    align-items: center;
     width: 100%;
     height: 32px;
+    max-width: 500px;
     padding: 0 8px;
-    flex: 0 0 32px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
     outline: none;
+    align-items: center;
+    flex: 0 0 32px;
 
     &:hover {
       cursor: pointer;
@@ -285,7 +288,7 @@
       .menu-item-mixin();
 
       &.is-disabled {
-        .menu-disabled-mixin()
+        .menu-disabled-mixin();
       }
     }
   }
@@ -355,7 +358,7 @@
         .menu-disabled-mixin();
 
         .menu-name {
-          color: @light-gray;;
+          color: @light-gray;
         }
       }
 
@@ -394,7 +397,7 @@
       }
 
       &.is-disabled {
-        .menu-disabled-mixin()
+        .menu-disabled-mixin();
       }
     }
   }

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

@@ -318,6 +318,7 @@
   margin-top: -4px;
   color: #63656e;
   border: none;
+  flex: 1;
 }
 .bk-search-select-container .search-container-input .input-before:before {
   color: #c4c6cc;
@@ -416,12 +417,16 @@
 }
 .bk-search-select-menu .menu-item-mixin {
   display: flex;
-  align-items: center;
   width: 100%;
   height: 32px;
+  max-width: 500px;
   padding: 0 8px;
-  flex: 0 0 32px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   outline: none;
+  align-items: center;
+  flex: 0 0 32px;
 }
 .bk-search-select-menu .menu-item-mixin:hover {
   cursor: pointer;
@@ -441,12 +446,16 @@
 }
 .bk-search-select-menu .menu-header-item {
   display: flex;
-  align-items: center;
   width: 100%;
   height: 32px;
+  max-width: 500px;
   padding: 0 8px;
-  flex: 0 0 32px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   outline: none;
+  align-items: center;
+  flex: 0 0 32px;
 }
 .bk-search-select-menu .menu-header-item:hover {
   cursor: pointer;
@@ -495,12 +504,16 @@
 }
 .bk-search-select-menu .menu-content .menu-item {
   display: flex;
-  align-items: center;
   width: 100%;
   height: 32px;
+  max-width: 500px;
   padding: 0 8px;
-  flex: 0 0 32px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   outline: none;
+  align-items: center;
+  flex: 0 0 32px;
   white-space: pre;
 }
 .bk-search-select-menu .menu-content .menu-item:hover {

package/lib/search-select/selected.d.ts

@@ -74,8 +74,9 @@ declare const _default: import("vue").DefineComponent<{
         };
         documentArrowEvent: (e: KeyboardEvent) => void;
         handleClickOutside: (e: MouseEvent) => void;
-        handleInputFocus: (e: FocusEvent) => void;
+        handleInputFocus: () => void;
         handleInputChange: (event: Event) => void;
+        handleInputPaste: (event: ClipboardEvent) => void;
         handleLogicalChange: (logical: SearchLogical) => void;
         handleInputKeyup: (event: KeyboardEvent) => void;
         handleSelectItem: (item: ICommonItem, type?: import("./utils").SearchItemType) => Promise<void>;

package/lib/search-select/utils.d.ts

@@ -1,4 +1,4 @@
-import { InjectionKey, Ref, VNode } from 'vue';
+import { ComputedRef, InjectionKey, Ref, VNode } from 'vue';
 /**
  * @description: 获取menu list方法
  * @param {ISearchItem} item 已选择的key字段 为空则代表当前并未选择key字段
@@ -24,6 +24,7 @@ export interface ISearchSelectProvider {
     onEditBlur: () => void;
     onValidate: (str: string) => void;
     editKey: Ref<String>;
+    searchData: ComputedRef<ISearchItem[]>;
 }
 export declare const SEARCH_SLECT_PROVIDER_KEY: InjectionKey<ISearchSelectProvider>;
 export declare const useSearchSelectProvider: (data: ISearchSelectProvider) => void;
@@ -78,6 +79,7 @@ export declare class SelectedItem {
     values: ICommonItem[];
     condition: string;
     logical: SearchLogical;
+    nameRenderkey: string;
     constructor(searchItem: ISearchItem, type?: SearchItemType);
     get multiple(): boolean;
     get placeholder(): string;
@@ -90,6 +92,9 @@ export declare class SelectedItem {
     get showLogical(): boolean;
     isSpecialType(): boolean;
     addValue(item: ICommonItem): void;
+    str2Values(str: string): ICommonItem[];
+    addValues(str: string, mergeValues?: boolean): void;
+    getValue(str: string): ICommonItem;
     toValue(): ISearchValue;
     toValueKey(): string;
     isInValueList(item: ICommonItem): boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bkui-vue",
-  "version": "1.0.3-beta.53",
+  "version": "1.0.3-beta.55",
   "workspaces": {
     "packages": [
       "packages/!(**.bak)*",