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

package/dist/index.esm.js

@@ -11192,17 +11192,9 @@ ClickOutside.install = (app) => {
 const nodeList = /* @__PURE__ */ new Map();
 const tooltips = {
   beforeMount(el, binding) {
-    const opts = initOptions();
-    if (typeof binding.value === "object") {
-      Object.assign(opts, binding.value);
-    } else {
-      opts.content = binding.value;
-    }
-    const { disabled, trigger, content, arrow: arrow2, theme, extCls } = opts;
-    if (disabled) {
-      return;
-    }
-    const popper2 = renderContent(content, arrow2, theme === "light", extCls);
+    const opts = getOpts(binding);
+    const { trigger } = opts.value;
+    const popper2 = renderContent(opts);
     if (trigger === "hover") {
       let hideTimeout = null;
       el.addEventListener("mouseenter", () => {
@@ -11235,13 +11227,14 @@ const tooltips = {
       });
     }
     nodeList.set(el, {
-      opts,
+      binding,
       popper: popper2,
       popperInstance: null
     });
   },
   unmounted(el) {
     hide$1(el);
+    nodeList.delete(el);
   }
 };
 function initOptions() {
@@ -11262,7 +11255,18 @@ function initOptions() {
   };
   return defaultOpts;
 }
-function renderContent(value, hasArrow, isLight, extCls) {
+function getOpts(binding) {
+  const opts = ref(initOptions());
+  if (typeof binding.value === "object") {
+    Object.assign(opts.value, binding.value);
+  } else {
+    opts.value.content = binding.value;
+  }
+  return opts;
+}
+function renderContent(opts) {
+  const { content: value, arrow: hasArrow, theme, extCls } = opts.value;
+  const isLight = theme === "light";
   const zIndex = bkZIndexManager.getPopperIndex();
   const content = document.createElement("div");
   content.className = `bk-popper ${isLight ? "light" : "dark"} ${extCls}`;
@@ -11281,7 +11285,8 @@ function renderArrow() {
   return arrow2;
 }
 function createPopperInstance(el, popper2) {
-  const { placement, distance: distance2, showOnInit } = nodeList.get(el).opts;
+  const { binding } = nodeList.get(el);
+  const { placement, distance: distance2, showOnInit } = getOpts(binding).value;
   const popperInstance = createPopper(el, popper2, {
     placement,
     modifiers: [
@@ -11298,7 +11303,15 @@ function createPopperInstance(el, popper2) {
   return popperInstance;
 }
 function show(el) {
-  const { popper: popper2, opts: { onShow } } = nodeList.get(el);
+  const { popper: popper2, binding } = nodeList.get(el);
+  const { disabled, content, arrow: hasArrow, onShow } = getOpts(binding).value;
+  if (disabled)
+    return;
+  popper2.innerText = content;
+  if (hasArrow) {
+    const arrow2 = renderArrow();
+    popper2.appendChild(arrow2);
+  }
   document.body.appendChild(popper2);
   const popperInstance = createPopperInstance(el, popper2);
   onShow();
@@ -11315,7 +11328,8 @@ function show(el) {
 function hide$1(el) {
   if (!nodeList.get(el))
     return;
-  const { popper: popper2, popperInstance, opts: { onHide } } = nodeList.get(el);
+  const { popper: popper2, popperInstance, binding } = nodeList.get(el);
+  const { onHide } = getOpts(binding).value;
   if (popper2 && document.body.contains(popper2)) {
     popper2.removeAttribute("data-show");
     popperInstance == null ? void 0 : popperInstance.destroy();
@@ -36519,7 +36533,7 @@ var SearchSelectMenu = defineComponent({
   render() {
     var _a, _b, _c;
     return createVNode("div", {
-      "class": "search-select-menu"
+      "class": "bk-search-select-menu"
     }, [!!((_a = this.conditions) == null ? void 0 : _a.length) && createVNode("ul", {
       "class": "menu-header"
     }, [this.conditions.map((item) => createVNode("li", {
@@ -36557,8 +36571,8 @@ const useSearchSelectProvider = (data2) => {
 };
 const useSearchSelectInject = () => inject(SEARCH_SLECT_PROVIDER_KEY);
 var SearchInputMode = /* @__PURE__ */ ((SearchInputMode2) => {
-  SearchInputMode2[SearchInputMode2["DEFAULT"] = 0] = "DEFAULT";
-  SearchInputMode2[SearchInputMode2["EDIT"] = 1] = "EDIT";
+  SearchInputMode2["DEFAULT"] = "default";
+  SearchInputMode2["EDIT"] = "edit";
   return SearchInputMode2;
 })(SearchInputMode || {});
 class SelectedItem {
@@ -36658,7 +36672,7 @@ var SearchSelectInput = defineComponent({
     },
     defautUsingItem: Object,
     mode: {
-      type: Object,
+      type: String,
       default: SearchInputMode.DEFAULT
     },
     geMenuList: Function,
@@ -37095,7 +37109,7 @@ var SearchSelectInput = defineComponent({
       }
       return ((_a2 = this.menuList) == null ? void 0 : _a2.length) ? createVNode("div", {
         "ref": "popoverRef",
-        "class": "popover-content"
+        "class": "bk-search-select-popover"
       }, [createVNode(SearchSelectMenu, {
         "list": this.menuList,
         "keyword": this.keyword,
@@ -37192,7 +37206,7 @@ var SearchSelected = defineComponent({
   },
   render() {
     const contentComponent = (item, index) => this.editKey === `${item.id}_${index}` ? createVNode("div", {
-      "class": "search-seleted-input",
+      "class": "selected-input",
       "key": this.editKey.toString()
     }, [createVNode(SearchSelectInput, {
       "ref": "inputRef",
@@ -37208,17 +37222,17 @@ var SearchSelected = defineComponent({
       "onAdd": (v2) => this.handleAddSelected(v2, index),
       "onFocus": this.handleInputFocus
     }, null)]) : createVNode("li", {
-      "class": `search-input-chip ${!(this.overflowIndex >= 0 ? index < this.overflowIndex : index >= 0) ? "hidden-chip" : ""}`,
+      "class": `search-container-selected ${!(this.overflowIndex >= 0 ? index < this.overflowIndex : index >= 0) ? "hidden-selected" : ""}`,
       "key": `${item.id}_${index}`
     }, [createVNode("span", {
-      "class": "chip-name",
+      "class": "selected-name",
       "onClick": (e) => this.handleEditSeleted(e, item, index)
     }, [item.inputInnerText]), createVNode(close$1, {
-      "class": "chip-clear",
+      "class": "selected-clear",
       "onClick": () => this.handleDeleteSelected(index)
     }, null)]);
     return createVNode(Fragment, null, [this.selectedList.map((item, index) => [this.overflowIndex >= 0 && index === this.overflowIndex && createVNode("div", {
-      "class": "search-input-chip overflow-chip"
+      "class": "search-container-selected overflow-selected"
     }, [createTextVNode("+"), this.selectedList.length - this.overflowIndex]), contentComponent(item, index)])]);
   }
 });
@@ -37313,10 +37327,10 @@ var Component = defineComponent({
       deep: true
     });
     onMounted(() => {
-      addListener(wrapRef.value.querySelector(".bk-search-select"), debounceResize);
+      addListener(wrapRef.value.querySelector(".bk-search-select-container"), debounceResize);
     });
     onBeforeUnmount(() => {
-      removeListener(wrapRef.value.querySelector(".bk-search-select"), debounceResize);
+      removeListener(wrapRef.value.querySelector(".bk-search-select-container"), debounceResize);
     });
     useSearchSelectProvider({
       onEditClick,
@@ -37346,9 +37360,9 @@ var Component = defineComponent({
         overflowIndex.value = -1;
         return;
       }
-      const inputEl = wrapRef.value.querySelector(".bk-search-select");
-      const maxWidth = wrapRef.value.querySelector(".search-input").clientWidth - SELETED_MARGING_RIGHT - 2;
-      const tagList = inputEl.querySelectorAll(".search-input-chip:not(.overflow-chip)");
+      const inputEl = wrapRef.value.querySelector(".bk-search-select-container");
+      const maxWidth = wrapRef.value.querySelector(".search-container").clientWidth - SELETED_MARGING_RIGHT - 2;
+      const tagList = inputEl.querySelectorAll(".search-container-selected:not(.overflow-selected)");
       let width = 0;
       let index = 0;
       let i2 = 0;
@@ -37421,7 +37435,7 @@ var Component = defineComponent({
   render() {
     var _a, _b;
     const maxHeight = `${!this.shrink || this.isFocus ? this.maxHeight : this.minHeight}px`;
-    const showCondition = this.selectedList.length && this.selectedList.slice(-1)[0].type !== "condition";
+    const showCondition = !!this.selectedList.length && this.selectedList.slice(-1)[0].type !== "condition";
     const menuSlots = Object.assign({}, this.$slots.menu ? {
       menu: (data2) => {
         var _a2, _b2;
@@ -37429,18 +37443,18 @@ var Component = defineComponent({
       }
     } : {});
     return createVNode("div", {
-      "class": "search-select-wrap",
+      "class": "bk-search-select",
       "ref": "wrapRef"
     }, [createVNode("div", {
       "class": {
-        "bk-search-select": true,
+        "bk-search-select-container": true,
         "is-focus": this.isFocus
       },
       "onClick": this.handleWrapClick
     }, [createVNode("div", {
       "class": "search-prefix"
     }, [(_b = (_a = this.$slots).prepend) == null ? void 0 : _b.call(_a)]), createVNode("div", {
-      "class": "search-input",
+      "class": "search-container",
       "style": {
         maxHeight
       }
@@ -37453,7 +37467,7 @@ var Component = defineComponent({
       "validateValues": this.validateValues,
       "onDelete": this.handleDeleteSelected
     }, __spreadValues({}, menuSlots)), createVNode("div", {
-      "class": "search-input-input"
+      "class": "search-container-input"
     }, [createVNode(SearchSelectInput, {
       "ref": "inputRef",
       "data": this.data,
@@ -37474,7 +37488,7 @@ var Component = defineComponent({
     }, null), this.$slots.append ? this.$slots.append() : createVNode(search, {
       "class": `search-nextfix-icon ${this.isFocus ? "is-focus" : ""}`
     }, null)])]), !!this.validateStr.length && createVNode("div", {
-      "class": "bk-select-tips"
+      "class": "bk-search-select-tips"
     }, [this.$slots.validate ? this.$slots.validate() : createVNode(Fragment, null, [createVNode(exclamationCircleShape, {
       "class": "select-tips"
     }, null), this.validateStr || ""])])]);