bkui-vue 0.0.1-beta.20 → 0.0.1-beta.21

package/dist/bkui-vue.cjs.js

@@ -185,7 +185,7 @@ function getWindow(node) {
   }
   return node;
 }
-function isElement$1(node) {
+function isElement$2(node) {
   var OwnElement = getWindow(node).Element;
   return node instanceof OwnElement || node instanceof Element;
 }
@@ -339,7 +339,7 @@ function isTableElement(element) {
   return ["table", "td", "th"].indexOf(getNodeName(element)) >= 0;
 }
 function getDocumentElement(element) {
-  return ((isElement$1(element) ? element.ownerDocument : element.document) || window.document).documentElement;
+  return ((isElement$2(element) ? element.ownerDocument : element.document) || window.document).documentElement;
 }
 function getParentNode(element) {
   if (getNodeName(element) === "html") {
@@ -747,17 +747,17 @@ function getInnerBoundingClientRect(element) {
   return rect;
 }
 function getClientRectFromMixedType(element, clippingParent) {
-  return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement$1(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
+  return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement$2(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
 }
 function getClippingParents(element) {
   var clippingParents2 = listScrollParents(getParentNode(element));
   var canEscapeClipping = ["absolute", "fixed"].indexOf(getComputedStyle(element).position) >= 0;
   var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
-  if (!isElement$1(clipperElement)) {
+  if (!isElement$2(clipperElement)) {
     return [];
   }
   return clippingParents2.filter(function(clippingParent) {
-    return isElement$1(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== "body";
+    return isElement$2(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== "body";
   });
 }
 function getClippingRect(element, boundary, rootBoundary) {
@@ -839,7 +839,7 @@ function detectOverflow(state, options) {
   var altContext = elementContext === popper$1 ? reference : popper$1;
   var popperRect = state.rects.popper;
   var element = state.elements[altBoundary ? altContext : elementContext];
-  var clippingClientRect = getClippingRect(isElement$1(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
+  var clippingClientRect = getClippingRect(isElement$2(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
   var referenceClientRect = getBoundingClientRect(state.elements.reference);
   var popperOffsets2 = computeOffsets({
     reference: referenceClientRect,
@@ -1356,7 +1356,7 @@ function popperGenerator(generatorOptions) {
         cleanupModifierEffects();
         state.options = Object.assign({}, defaultOptions, state.options, options2);
         state.scrollParents = {
-          reference: isElement$1(reference2) ? listScrollParents(reference2) : reference2.contextElement ? listScrollParents(reference2.contextElement) : [],
+          reference: isElement$2(reference2) ? listScrollParents(reference2) : reference2.contextElement ? listScrollParents(reference2.contextElement) : [],
           popper: listScrollParents(popper2)
         };
         var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers2, state.options.modifiers)));
@@ -1406,7 +1406,7 @@ function popperGenerator(generatorOptions) {
           resolve(state);
         });
       }),
-      destroy: function destroy2() {
+      destroy: function destroy() {
         cleanupModifierEffects();
         isDestroyed = true;
       }
@@ -1555,7 +1555,7 @@ function throttle(func, wait, options) {
     return result;
   };
 }
-function isElement(obj) {
+function isElement$1(obj) {
   try {
     return obj instanceof HTMLElement;
   } catch (e) {
@@ -1657,13 +1657,13 @@ class BKPopover {
   }
   restorePopContent() {
     const target = this.getAppendToTarget();
-    if (isElement(target) && target.contains(this.popperRefer) && this.container && !this.container.contains(this.popperRefer)) {
+    if (isElement$1(target) && target.contains(this.popperRefer) && this.container && !this.container.contains(this.popperRefer)) {
       this.container.append(this.popperRefer);
     }
   }
   appendToTarget() {
     const target = this.getAppendToTarget();
-    if (isElement(target) && target.contains(this.popperRefer)) {
+    if (isElement$1(target) && target.contains(this.popperRefer)) {
       target.append(this.popperRefer);
     }
   }
@@ -1744,7 +1744,7 @@ class BKPopover {
     return null;
   }
   isElement(obj) {
-    return isElement(obj);
+    return isElement$1(obj);
   }
   registerEvents() {
     if (this.isElement(this.referenceTarget)) {
@@ -2272,6 +2272,12 @@ function R(e = { func: () => {
 class z extends R() {
 }
 const propTypesNS = R({});
+function stringEnum(o2) {
+  return o2.reduce((res, key) => {
+    res[key] = key;
+    return res;
+  }, /* @__PURE__ */ Object.create(null));
+}
 class PropTypes extends propTypesNS {
   static size(sizes = ["small", "default", "large"]) {
     return j("Size", {
@@ -2295,8 +2301,7 @@ class PropTypes extends propTypesNS {
         }
         console.error(`invalid theme, ${val}, the theme must be one of \u3010${themes.join(" | ")}\u3011`);
         return false;
-      },
-      default: "primary"
+      }
     });
   }
   static placement(placements2 = ["top", "left", "right", "bottom"]) {
@@ -2868,12 +2873,12 @@ var Component$s = vue.defineComponent({
   }) {
     const container = vue.ref(null);
     const el = vue.ref(null);
-    const visiable = vue.ref(false);
+    const visible = vue.ref(false);
     const zIndex = vue.ref(bkZIndexManager.getModalNextIndex());
     const styleBottom = `${props.bottom}px`;
     const styleRight = `${props.right}px`;
     const scrollHandler = throttle(() => {
-      visiable.value = el.value.scrollTop >= props.visibilityHeight;
+      visible.value = el.value.scrollTop >= props.visibilityHeight;
     }, 30);
     const scrollTop = () => {
       el.value.scrollTo({
@@ -2881,7 +2886,7 @@ var Component$s = vue.defineComponent({
         behavior: "smooth"
       });
     };
-    vue.watch(() => visiable, () => {
+    vue.watch(() => visible, () => {
       zIndex.value = bkZIndexManager.getModalNextIndex();
     });
     vue.onMounted(() => {
@@ -2904,7 +2909,7 @@ var Component$s = vue.defineComponent({
     }, {
       default: () => {
         var _a, _b;
-        return [visiable.value ? vue.createVNode("div", {
+        return [visible.value ? vue.createVNode("div", {
           "class": `bk-backtop ${props.extCls}`,
           "style": {
             right: styleRight,
@@ -3059,11 +3064,12 @@ var BreadcrumbItem = vue.defineComponent({
 const BkBreadcrumb = withInstallProps(Component$q, { Item: BreadcrumbItem });
 let BkLoadingMode;
 (function(BkLoadingMode2) {
-  BkLoadingMode2["Spin"] = "spin";
   BkLoadingMode2["Default"] = "default";
+  BkLoadingMode2["Spin"] = "spin";
 })(BkLoadingMode || (BkLoadingMode = {}));
 let BkLoadingSize;
 (function(BkLoadingSize2) {
+  BkLoadingSize2["Mini"] = "mini";
   BkLoadingSize2["Small"] = "small";
   BkLoadingSize2["Large"] = "large";
 })(BkLoadingSize || (BkLoadingSize = {}));
@@ -3078,8 +3084,8 @@ const loadingTypes = {
   loading: PropTypes.bool,
   theme: PropTypes.theme(["white", "primary", "warning", "success", "danger"]),
   title: PropTypes.string.def(""),
-  size: PropTypes.size(),
-  mode: PropTypes.oneOf(Object.values(BkLoadingMode))
+  size: PropTypes.commonType(Object.values(BkLoadingSize)).def("small"),
+  mode: PropTypes.commonType(Object.values(BkLoadingMode)).def("default")
 };
 var Component$p = vue.defineComponent({
   name: "Loading",
@@ -3096,13 +3102,14 @@ var Component$p = vue.defineComponent({
     const loadingWrapperCls = vue.computed(() => classes({
       "bk-nested-loading": !!ctx.slots.default
     }, "bk-loading-wrapper"));
+    console.log(props.theme);
     const containerCls = vue.computed(() => classes({
-      [`bk-loading-size-${props.size}`]: !props.size,
-      [`bk-loading-${props.theme}`]: !props.theme
+      [`bk-loading-size-${props.size}`]: !!props.size,
+      [`bk-loading-${props.theme}`]: !!props.theme
     }, "bk-loading-indicator"));
     const hasTitle = vue.computed(() => !!props.title);
     const indicator = vue.computed(() => {
-      const isSpinMode = props.mode === "spin";
+      const isSpinMode = props.mode === BkLoadingMode.Spin;
       if (typeof props.indicator === "function") {
         return vue.createVNode(props.indicator, null, null);
       }
@@ -3131,8 +3138,11 @@ const buttonProps = {
   hoverTheme: PropTypes.theme(["primary", "warning", "success", "danger"]).def(""),
   size: PropTypes.size(),
   title: PropTypes.string,
+  icon: PropTypes.string,
+  iconRight: PropTypes.string,
   disabled: PropTypes.bool,
   loading: PropTypes.bool,
+  laodingMode: PropTypes.commonType(Object.values(BkLoadingMode)),
   outline: PropTypes.bool,
   text: PropTypes.bool,
   nativeType: {
@@ -3141,14 +3151,15 @@ const buttonProps = {
 };
 var Component$o = vue.defineComponent({
   name: "Button",
-  emits: ["click"],
   props: buttonProps,
+  emits: ["click", "mouseover"],
   setup(props, {
     slots,
     attrs,
     emit
   }) {
     var _a;
+    const isHover = vue.ref(false);
     const showSlot = (_a = slots.default) != null ? _a : false;
     const btnClsPrefix = "bk-button";
     const btnCls = vue.computed(() => {
@@ -3163,28 +3174,44 @@ var Component$o = vue.defineComponent({
         "no-slot": !showSlot
       }, `${themeCls} ${btnClsPrefix} ${hoverTheme}`);
     });
-    const bkLoadingCls = `${btnClsPrefix}-loading`;
-    const loadingTheme = ["", "default"].includes(props.theme) ? "default" : "white";
+    const loadingTheme = vue.computed(() => {
+      if (props.text || props.outline || props.hoverTheme) {
+        if (isHover.value && !props.text)
+          return "white";
+        return props.hoverTheme || props.theme;
+      }
+      return ["", "default"].includes(props.theme) ? "" : "white";
+    });
+    const loadingSize = vue.computed(() => props.size === BkLoadingSize.Small ? BkLoadingSize.Mini : BkLoadingSize.Small);
     const handleClick = () => {
       emit("click");
     };
+    const handleMouseOver = () => {
+      isHover.value = true;
+      emit("mouseover");
+    };
+    const handleMouseout = () => {
+      isHover.value = false;
+    };
     return () => {
-      var _a2, _b;
+      var _a2;
       return vue.createVNode("button", vue.mergeProps({
         "title": props.title,
         "disabled": props.disabled,
         "class": btnCls.value,
         "type": props.nativeType
       }, attrs, {
-        "onClick": handleClick
-      }), [props.loading ? vue.createVNode("div", {
-        "class": bkLoadingCls
-      }, [vue.createVNode(BkLoading, {
-        "theme": loadingTheme,
-        "size": BkLoadingSize.Small
-      }, null)]) : vue.createVNode("div", {
-        "class": "bk-button-content-wrapper"
-      }, [vue.createVNode("span", null, [(_b = (_a2 = slots.default) == null ? void 0 : _a2.call(slots)) != null ? _b : "default"])])]);
+        "onClick": handleClick,
+        "onMouseover": handleMouseOver,
+        "onMouseleave": handleMouseout
+      }), [props.loading && vue.createVNode(BkLoading, {
+        "class": `${btnClsPrefix}-loading`,
+        "mode": props.laodingMode,
+        "theme": loadingTheme.value,
+        "size": loadingSize.value
+      }, null), slots.default && vue.createVNode("span", {
+        "class": `${btnClsPrefix}-text`
+      }, [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)])]);
     };
   }
 });
@@ -3849,19 +3876,24 @@ const inputType = {
   max: PropTypes.integer,
   min: PropTypes.integer,
   maxlength: PropTypes.integer,
+  behavior: PropTypes.commonType(["simplicity", "normal"]).def("normal"),
   showWordLimit: PropTypes.bool,
   showControl: PropTypes.bool.def(true),
+  showClearOnlyHover: PropTypes.bool.def(false),
   precision: PropTypes.number.def(0).validate((val) => val >= 0 && val < 20),
   modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   size: PropTypes.size()
 };
+const inputEvents = ["update:modelValue", "focus", "blur", "change", "clear", "input", "keypress", "keydown", "keyup", "enter", "paste"];
+const EventEnum = stringEnum([...inputEvents]);
 var Component$g = vue.defineComponent({
   name: "Input",
   inheritAttrs: false,
   props: inputType,
-  emits: ["update:modelValue", "focus", "blur", "change", "clear", "input", "keydown"],
+  emits: [...inputEvents],
   setup(props, ctx) {
     const isFocused = vue.ref(false);
+    const isCNInput = vue.ref(false);
     const inputClsPrefix = "bk-input";
     const _a = ctx.attrs, {
       class: cls,
@@ -3875,6 +3907,7 @@ var Component$g = vue.defineComponent({
       "is-focused": isFocused.value,
       "is-readonly": props.readonly,
       "is-disabled": props.disabled,
+      "is-simplicity": props.behavior === "simplicity",
       [`${cls}`]: !!cls
     }, inputClsPrefix));
     const suffixIconMap = {
@@ -3899,33 +3932,51 @@ var Component$g = vue.defineComponent({
     const isNumberInput = vue.computed(() => props.type === "number");
     const ceilMaxLength = vue.computed(() => Math.floor(props.maxlength));
     const pwdVisible = vue.ref(false);
+    const clearCls = vue.computed(() => classes({
+      "show-clear-only-hover": props.showClearOnlyHover
+    }, suffixCls));
     function clear() {
-      ctx.emit("update:modelValue", "");
-      ctx.emit("change", "");
-      ctx.emit("clear");
+      ctx.emit(EventEnum["update:modelValue"], "");
+      ctx.emit(EventEnum.change, "");
+      ctx.emit(EventEnum.clear);
     }
     function handleFocus(e) {
       isFocused.value = true;
-      ctx.emit("focus", e);
+      ctx.emit(EventEnum.focus, e);
     }
     function handleBlur(e) {
       isFocused.value = false;
-      ctx.emit("blur", e);
-    }
-    function handleInput(e) {
-      ctx.emit("update:modelValue", isNumberInput.value ? +e.target.value : e.target.value);
-      ctx.emit("input", e.target.value);
+      ctx.emit(EventEnum.blur, e);
+    }
+    function eventHandler(eventName) {
+      return (e) => {
+        let originEventName = eventName;
+        if (e.code === "Enter" || e.key === "Enter" || e.keyCode === 13) {
+          originEventName = EventEnum.enter;
+          if (e.type !== EventEnum.keyup)
+            return;
+        }
+        if (isCNInput.value && [EventEnum.input, EventEnum.change].some((e2) => eventName === e2))
+          return;
+        if (eventName === EventEnum.input) {
+          ctx.emit(EventEnum["update:modelValue"], isNumberInput.value ? +e.target.value : e.target.value);
+        }
+        ctx.emit(originEventName, e.target.value, e);
+      };
     }
-    function handleKeydown(e) {
-      ctx.emit("keydown", e.target.value, e);
+    const [handleKeyup, handleKeydown, handleKeyPress, handlePaste, handleChange, handleInput] = [EventEnum.keyup, EventEnum.keydown, EventEnum.keypress, EventEnum.paste, EventEnum.change, EventEnum.input].map(eventHandler);
+    function handleCompositionStart() {
+      isCNInput.value = true;
     }
-    function handleChange(e) {
-      ctx.emit("change", e.target.value, e);
+    function handleCompositionEnd(e) {
+      isCNInput.value = false;
+      handleInput(e);
     }
     function handleNumber(step, INC = true) {
+      const numStep = parseInt(String(step), 10);
       const precision = Number.isInteger(props.precision) ? props.precision : 0;
       const val = parseFloat(props.modelValue.toString());
-      const factor = Number.isInteger(step) ? step : 1;
+      const factor = Number.isInteger(numStep) ? numStep : 1;
       let newVal = val + (INC ? factor : -1 * factor);
       if (Number.isInteger(props.max)) {
         newVal = Math.min(newVal, props.max);
@@ -3936,12 +3987,12 @@ var Component$g = vue.defineComponent({
       return +newVal.toFixed(precision);
     }
     function handleInc() {
-      const newVal = handleNumber(parseInt(String(props.step), 10));
-      ctx.emit("update:modelValue", newVal);
+      const newVal = handleNumber(props.step);
+      ctx.emit(EventEnum["update:modelValue"], newVal);
     }
     function handleDec() {
-      const newVal = handleNumber(parseInt(String(props.step), 10), false);
-      ctx.emit("update:modelValue", newVal);
+      const newVal = handleNumber(props.step, false);
+      ctx.emit(EventEnum["update:modelValue"], newVal);
     }
     function getCls(name) {
       return `${inputClsPrefix}--${name}`;
@@ -3972,11 +4023,16 @@ var Component$g = vue.defineComponent({
         "onInput": handleInput,
         "onFocus": handleFocus,
         "onBlur": handleBlur,
+        "onPaste": handlePaste,
         "onChange": handleChange,
-        "onKeydown": handleKeydown
+        "onKeypress": handleKeyPress,
+        "onKeydown": handleKeydown,
+        "onKeyup": handleKeyup,
+        "onCompositionstart": handleCompositionStart,
+        "onCompositionend": handleCompositionEnd
       }), null), props.clearable && !!props.modelValue && vue.createVNode(close$1, {
         "onClick": clear,
-        "class": suffixCls
+        "class": clearCls.value
       }, null), suffixIcon.value, typeof props.maxlength === "number" && props.showWordLimit && vue.createVNode("p", {
         "class": getCls("max-length")
       }, [props.modelValue.toString().length, vue.createTextVNode("/"), vue.createVNode("span", null, [ceilMaxLength.value])]), isNumberInput.value && props.showControl && vue.createVNode("div", {
@@ -5003,92 +5059,72 @@ const mousewheel = {
     mousewheelHandler(el, binding.value);
   }
 };
-const nodeMap = /* @__PURE__ */ new Map();
-function parseBindingValue(value) {
-  const isTouch = "ontouchstart" in window || (navigator == null ? void 0 : navigator.maxTouchPoints) > 0;
-  const defaultOption = {
-    handler() {
-    },
-    capture: true,
-    disabled: false,
-    detectIframe: true,
-    exclude: [],
-    events: isTouch ? ["ontouchstart"] : ["click"]
-  };
-  if (typeof value === "function") {
-    defaultOption.handler = value;
-    return defaultOption;
-  }
-  return Object.assign({}, defaultOption);
-}
-function onEvent(config) {
-  var _a;
-  const { el, event, handler, disabled } = config;
-  const path = (_a = event.composedPath) == null ? void 0 : _a.call(event);
-  const isClickOutside = path ? path.indexOf(el) < 0 : !el.contains(event.target);
-  if (!isClickOutside || !!disabled)
-    return;
-  handler(event);
-}
-function onIframeClick(config) {
-  const { activeElement } = document;
-  const { el, handler, disabled, event } = config;
-  if (activeElement && activeElement.tagName === "IFRAME" && !el.contains(activeElement) && !disabled) {
-    handler(event);
-  }
-}
-function getEventConfigList(el, options) {
-  const configList = options.events.map((name) => ({
-    event: name,
-    target: document.documentElement,
-    capture: options.capture,
-    handler: (event) => onEvent({ el, event, handler: options.handler, disabled: options.disabled })
-  }));
-  if (options.detectIframe) {
-    configList.push({
-      event: "blur",
-      target: window,
-      capture: options.capture,
-      handler: (event) => onIframeClick({ el, event, handler: options.handler, disabled: options.disabled })
-    });
-  }
-  return configList;
-}
-function init(el, options) {
-  if (nodeMap.has(el)) {
-    destroy(el);
+const isElement = (e) => {
+  if (typeof Element === "undefined")
+    return false;
+  return e instanceof Element;
+};
+const nodeList = /* @__PURE__ */ new Map();
+let startClick;
+document.addEventListener("mousedown", (e) => startClick = e);
+document.addEventListener("mouseup", (e) => {
+  for (const handlers of nodeList.values()) {
+    for (const { documentHandler } of handlers) {
+      documentHandler(e, startClick);
+    }
   }
-  const configList = getEventConfigList(el, options);
-  nodeMap.set(el, configList);
-  configList.forEach((config) => {
-    const { target, event, handler, capture } = config;
-    target.addEventListener(event, handler, capture);
-  });
-}
-function destroy(el) {
-  var _a;
-  const configList = (_a = nodeMap.get(el)) != null ? _a : [];
-  configList.forEach((config) => {
-    const { target, event, handler, capture } = config;
-    target.removeEventListener(event, handler, capture);
-  });
-  nodeMap.delete(el);
+});
+function createDocumentHandler(el, binding) {
+  let excludes = [];
+  if (Array.isArray(binding.arg)) {
+    excludes = binding.arg;
+  } else if (isElement(binding.arg)) {
+    excludes.push(binding.arg);
+  }
+  return function(mouseup, mousedown) {
+    const { popperRef } = binding.instance;
+    const mouseUpTarget = mouseup.target;
+    const mouseDownTarget = mousedown == null ? void 0 : mousedown.target;
+    const isBound = !binding || !binding.instance;
+    const isTargetExists = !mouseUpTarget || !mouseDownTarget;
+    const isContainedByEl = el.contains(mouseUpTarget) || el.contains(mouseDownTarget);
+    const isSelf = el === mouseUpTarget;
+    const isTargetExcluded = excludes.length && excludes.some((item) => item == null ? void 0 : item.contains(mouseUpTarget)) || excludes.length && excludes.includes(mouseDownTarget);
+    const isContainedByPopper = popperRef && (popperRef.contains(mouseUpTarget) || popperRef.contains(mouseDownTarget));
+    if (isBound || isTargetExists || isContainedByEl || isSelf || isTargetExcluded || isContainedByPopper) {
+      return;
+    }
+    binding.value(mouseup, mousedown);
+  };
 }
-const clickoutside = {
+const ClickOutside = {
   beforeMount(el, binding) {
-    const options = parseBindingValue(binding.value);
-    if (options.disabled)
-      return;
-    nodeMap.set(el, getEventConfigList(el, options));
+    if (!nodeList.has(el)) {
+      nodeList.set(el, []);
+    }
+    nodeList.get(el).push({
+      documentHandler: createDocumentHandler(el, binding),
+      bindingFn: binding.value
+    });
   },
   updated(el, binding) {
-    const newOptions = parseBindingValue(binding.value);
-    if (newOptions.disabled && !nodeMap.has(el))
-      return;
-    init(el, newOptions);
+    if (!nodeList.has(el)) {
+      nodeList.set(el, []);
+    }
+    const handlers = nodeList.get(el);
+    const oldHandlerIndex = handlers.findIndex((item) => item.bindingFn === binding.oldValue);
+    const newHandler = {
+      documentHandler: createDocumentHandler(el, binding),
+      bindingFn: binding.value
+    };
+    if (oldHandlerIndex >= 0) {
+      handlers.splice(oldHandlerIndex, 1, newHandler);
+    } else {
+      handlers.push(newHandler);
+    }
   },
   unmounted(el) {
-    destroy(el);
+    nodeList.delete(el);
   }
 };
 var popper = "";
@@ -5202,7 +5238,7 @@ function createPopperInstance(el, popper2, options) {
 var Component$a = vue.defineComponent({
   name: "Select",
   directives: {
-    clickoutside
+    clickoutside: ClickOutside
   },
   props: {
     modelValue: PropTypes.any,
@@ -5738,7 +5774,7 @@ var Component$8 = vue.defineComponent({
       });
       defaultSteps.value.splice(0, defaultSteps.value.length, ...defaults);
     };
-    const init2 = () => {
+    const init = () => {
       var _a;
       defaultSteps.value.splice(0, defaultSteps.value.length, ...[{
         title: "\u6B65\u9AA41",
@@ -5770,7 +5806,7 @@ var Component$8 = vue.defineComponent({
         console.warn(e);
       }
     };
-    vue.onMounted(init2);
+    vue.onMounted(init);
     return {
       defaultSteps,
       jumpTo
@@ -11533,7 +11569,20 @@ const datePickerProps = {
     type: String,
     default: "bottom-start",
     validator: (value) => {
-      const validList = ["top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end", "right", "right-start", "right-end"];
+      const validList = [
+        "top",
+        "top-start",
+        "top-end",
+        "bottom",
+        "bottom-start",
+        "bottom-end",
+        "left",
+        "left-start",
+        "left-end",
+        "right",
+        "right-start",
+        "right-end"
+      ];
       if (validList.indexOf(value) < 0) {
         console.error(`placement property is not valid: '${value}'`);
         return false;
@@ -11600,7 +11649,7 @@ const datePickerProps = {
 var Component$1 = vue.defineComponent({
   name: "DatePicker",
   directives: {
-    clickoutside
+    clickoutside: ClickOutside
   },
   props: datePickerProps,
   emits: ["open-change", "input", "change", "update:modelValue", "clear", "shortcut-change", "pick-success"],
@@ -11719,6 +11768,7 @@ var Component$1 = vue.defineComponent({
     };
     vue.watch(() => state.visible, (visible) => {
       var _a, _b;
+      console.error(123);
       if (visible === false) {
         (_a = pickerDropdownRef.value) == null ? void 0 : _a.destoryDropdown();
       }
@@ -12246,7 +12296,7 @@ var Transfer = vue.defineComponent({
         if (!typeFlag.value) {
           generalInit();
         } else {
-          init2();
+          init();
         }
       }
     };
@@ -12283,7 +12333,7 @@ var Transfer = vue.defineComponent({
         emit("change", dataList.value, [...handleListFormat(hasSelectedList.value, false)], []);
       }
     };
-    const init2 = () => {
+    const init = () => {
       if (!props.targetList.length || props.targetList.length > props.sourceList.length) {
         dataList.value.splice(0, dataList.value.length, ...props.sourceList);
         hasSelectedList.value = [];
@@ -12416,7 +12466,7 @@ var Transfer = vue.defineComponent({
       if (!typeFlag.value) {
         generalInit();
       } else {
-        init2();
+        init();
       }
       initSort();
     }
@@ -12749,7 +12799,10 @@ const getStringOrFuncStr = (item, props, key, args = []) => {
 };
 const getLabel = (item, props) => getStringOrFuncStr(item, props, "label");
 const getSchemaVal = (schema, uuid2) => schema.get(uuid2) || {};
-const getNodeAttr = (schema, uuid2, key) => (getSchemaVal(schema, uuid2) || {})[key];
+const getNodeAttr = (schema, uuid2, key) => {
+  var _a;
+  return (_a = getSchemaVal(schema, uuid2)) == null ? void 0 : _a[key];
+};
 const getTreeStyle = (item, props) => {
   const levelLine = getPropsOneOfBoolValueWithDefault(props, "levelLine", item, DEFAULT_LEVLE_LINE, null, ["tree"]);
   return {
@@ -12760,14 +12813,11 @@ const getTreeStyle = (item, props) => {
   };
 };
 const getNodeItemStyle = (item, props, flatData = {}) => {
-  const { levelLineSchema, schema } = flatData;
-  const { childNodeCount = 0, isLeaf = false, lastNode = null } = levelLineSchema[item.__uuid] || {};
-  const lastNodeCount = isLeaf ? 0 : (levelLineSchema[lastNode] || { childNodeCount: 0 }).childNodeCount;
+  const { schema } = flatData;
   const depth = getNodeAttr(schema, item.__uuid, "__depth");
   return __spreadValues({
     "--depth": depth,
-    paddingLeft: 0,
-    "--lines": childNodeCount - lastNodeCount
+    paddingLeft: 0
   }, typeof props.levelLine === "function" ? {
     "--level-line": getPropsOneOfBoolValueWithDefault(props, "levelLine", item, DEFAULT_LEVLE_LINE, null, [
       "node"
@@ -12780,16 +12830,20 @@ const getNodeItemClass = (item, schema, props) => {
     "is-root": __isRoot,
     "bk-tree-node": true,
     "is-open": __isOpen,
-    "is-virtual-render": props.virtualRender
+    "is-virtual-render": props.virtualRender,
+    "level-line": props.levelLine
   };
 };
 const updateTreeNode = (path, treeData, childKey, nodekey, nodeValue) => {
+  assignTreeNode(path, treeData, childKey, { [nodekey]: nodeValue });
+};
+const assignTreeNode = (path, treeData, childKey, assignVal) => {
   const paths = path.split("-");
   const targetNode = paths.reduce((pre, nodeIndex) => {
     const index = Number(nodeIndex);
     return Array.isArray(pre) ? pre[index] : pre[childKey][index];
   }, treeData);
-  Object.assign(targetNode, { [nodekey]: nodeValue });
+  Object.assign(targetNode, assignVal || {});
 };
 const treeProps = {
   data: PropTypes.arrayOf(PropTypes.any).def([]),
@@ -12808,7 +12862,10 @@ const treeProps = {
     }),
     PropTypes.bool.def(false)
   ]).def(true),
-  asyncLoad: PropTypes.func.def(null)
+  async: PropTypes.shape({
+    callback: PropTypes.func.def(null),
+    cache: PropTypes.bool.def(true)
+  })
 };
 var Component = vue.defineComponent({
   name: "Tree",
@@ -12825,13 +12882,9 @@ var Component = vue.defineComponent({
       const formatData2 = getFlatdata(props, newData, schemaValues.value);
       flatData.data = formatData2[0];
       flatData.schema = formatData2[1];
-      computeLevelHeight();
     }, {
       deep: true
     });
-    vue.watch(() => [props.levelLine], () => {
-      computeLevelHeight();
-    });
     const schemaValues = vue.computed(() => Array.from(flatData.schema.values()));
     const getSchemaVal2 = (key) => flatData.schema.get(key);
     const getNodeAttr2 = (node, attr) => {
@@ -12846,7 +12899,6 @@ var Component = vue.defineComponent({
     const isNodeOpened = (node) => getNodeAttr2(node, "__isOpen");
     const hasChildNode = (node) => getNodeAttr2(node, "__hasChild");
     const renderData = vue.computed(() => flatData.data.filter((item) => checkNodeIsOpen(item)));
-    const renderNodePathColl = vue.computed(() => renderData.value.map((node) => getNodePath(node)));
     const isItemOpen = (item) => {
       var _a;
       if (typeof item === "object") {
@@ -12914,7 +12966,10 @@ var Component = vue.defineComponent({
     const setNodeOpened = (item) => {
       const newVal = !isItemOpen(item);
       setNodeAttr(item, "__isOpen", newVal);
-      computeLevelHeight();
+      if (newVal) {
+        return;
+      }
+      renderData.value.filter((node) => String.prototype.startsWith.call(getNodePath(node), getNodePath(item))).forEach((filterNode) => setNodeAttr(filterNode, "__isOpen", newVal));
     };
     const setNodeRemoteLoad = (resp, item) => {
       if (typeof resp === "object" && resp !== null) {
@@ -12925,12 +12980,20 @@ var Component = vue.defineComponent({
     };
     const hanldeTreeNodeClick = (item) => {
       if (item.async) {
-        if (typeof props.asyncLoad === "function") {
+        const {
+          callback = null,
+          cache = true
+        } = props.async || {};
+        if (typeof callback === "function" && !item.cached) {
           Object.assign(item, {
             loading: true
           });
-          props.asyncLoad(item, (resp) => setNodeRemoteLoad(resp, item)).then((resp) => setNodeRemoteLoad(resp, item)).catch((err) => console.error("load remote data error:", err)).finally(() => {
-            updateTreeNode(getNodePath(item), props.data, props.children, "loading", false);
+          callback(item, (resp) => setNodeRemoteLoad(resp, item)).then((resp) => setNodeRemoteLoad(resp, item)).catch((err) => console.error("load remote data error:", err)).finally(() => {
+            assignTreeNode(getNodePath(item), props.data, props.children, __spreadValues({
+              loading: false
+            }, cache ? {
+              cached: true
+            } : {}));
           });
         } else {
           console.error("async need to set prop: asyncLoad with function wich will return promise object");
@@ -12940,47 +13003,6 @@ var Component = vue.defineComponent({
         setNodeOpened(item);
       }
     };
-    const computeLevelHeight = () => {
-      if (!!props.levelLine) {
-        setTimeout(() => {
-          let showNodeCount = renderData.value.length;
-          const nodeSchema = {};
-          const setDefaultNodeSchema = (uuid2, lastNode = null, isLeaf = false) => {
-            if (!Object.prototype.hasOwnProperty.call(nodeSchema, uuid2)) {
-              Object.assign(nodeSchema, {
-                [uuid2]: __spreadValues(__spreadValues({
-                  childNodeCount: 0,
-                  isLastNode: false
-                }, lastNode !== null ? {
-                  lastNode
-                } : {}), isLeaf !== null ? {
-                  isLeaf
-                } : {})
-              });
-            }
-          };
-          for (; showNodeCount > 0; showNodeCount--) {
-            const node = renderData.value[showNodeCount - 1];
-            const parentId = getNodeAttr2(node, "__parentId");
-            const nodepath = getNodePath(node);
-            const isLeaf = !renderNodePathColl.value.includes(`${nodepath}-0`);
-            setDefaultNodeSchema(node.__uuid, null, isLeaf);
-            setDefaultNodeSchema(parentId, node.__uuid);
-            const parentSchema = nodeSchema[parentId];
-            const currentNodeSchema = nodeSchema[node.__uuid];
-            const {
-              childNodeCount = 0
-            } = currentNodeSchema;
-            currentNodeSchema.childNodeCount = childNodeCount + 1;
-            currentNodeSchema.isLastNode = parentSchema.lastNode === node.__uuid;
-            parentSchema.childNodeCount += currentNodeSchema.childNodeCount;
-          }
-          flatData.levelLineSchema = nodeSchema;
-        });
-      } else {
-        flatData.levelLineSchema = {};
-      }
-    };
     const checkNodeIsOpen = (node) => isRootNode(node) || isItemOpen(node) || isItemOpen(getNodeAttr2(node, "__parentId"));
     const filterNextNode = (depth, node) => {
       if (isRootNode(node)) {
@@ -12999,7 +13021,7 @@ var Component = vue.defineComponent({
       return schemaValues.value.some((val) => val.__path === nextNodePath);
     };
     const getVirtualLines = (node) => {
-      if (!props.virtualRender) {
+      if (!props.levelLine) {
         return null;
       }
       const getNodeLineStyle = (dpth) => ({
@@ -13011,7 +13033,6 @@ var Component = vue.defineComponent({
         "style": getNodeLineStyle(maxDeep - index)
       }, null));
     };
-    computeLevelHeight();
     return {
       renderData,
       flatData,
@@ -13035,7 +13056,8 @@ var Component = vue.defineComponent({
       "style": getTreeStyle(null, props),
       "list": this.renderData,
       "lineHeight": props.lineHeight,
-      "enabled": props.virtualRender
+      "enabled": props.virtualRender,
+      "throttleDelay": 0
     }, {
       default: (scoped) => (scoped.data || []).map(renderTreeNode)
     });
@@ -13444,6 +13466,6 @@ exports.Transfer = Transfer;
 exports.Tree = BkTree;
 exports.VirtualRender = BkVirtualRender;
 exports.bkTooltips = tooltips;
-exports.clickoutside = clickoutside;
+exports.clickoutside = ClickOutside;
 exports["default"] = preset;
 exports.mousewheel = mousewheel;