vue-devui 1.0.0-rc.1 → 1.0.0-rc.12

package/splitter/index.es.js

@@ -1,172 +1,114 @@
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { defineComponent, createVNode, Teleport, Transition, renderSlot, isVNode, computed, onMounted, watch, onUnmounted, ref, unref, nextTick, mergeProps, toRefs, Fragment, inject, reactive, withDirectives, provide, resolveComponent, onUpdated } from "vue";
-import { shift, offset, autoPlacement, arrow, computePosition } from "@floating-ui/dom";
-const splitterProps = {
-  orientation: {
-    type: String,
-    default: "horizontal"
-  },
-  splitBarSize: {
-    type: String,
-    default: "2px"
-  },
-  disabledBarSize: {
-    type: String,
-    default: "1px"
-  },
-  showCollapseButton: {
-    type: Boolean,
-    default: true
-  }
-};
-var baseOverlay = "";
-function _isSlot(s) {
-  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
-const CommonOverlay = defineComponent({
-  setup(props, ctx) {
-    return () => {
-      let _slot;
-      return createVNode(Teleport, {
-        "to": "#d-overlay-anchor"
-      }, {
-        default: () => [createVNode(Transition, {
-          "name": "devui-overlay-fade"
-        }, _isSlot(_slot = renderSlot(ctx.slots, "default")) ? _slot : {
-          default: () => [_slot]
-        })]
-      });
-    };
-  }
-});
-const overlayProps = {
-  visible: {
-    type: Boolean
-  },
-  backgroundBlock: {
+import { watch, onUnmounted, defineComponent, toRefs, createVNode, Transition, mergeProps, ref, unref, nextTick, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, provide, Teleport, getCurrentInstance, reactive, resolveComponent, onUpdated } from "vue";
+import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
+const fixedOverlayProps = {
+  modelValue: {
     type: Boolean,
     default: false
   },
-  backgroundClass: {
-    type: String,
-    default: ""
-  },
-  backgroundStyle: {
-    type: [String, Object]
-  },
-  onBackdropClick: {
-    type: Function
-  },
-  backdropClose: {
+  lockScroll: {
     type: Boolean,
     default: true
   },
-  hasBackdrop: {
+  closeOnClickOverlay: {
     type: Boolean,
     default: true
   }
 };
-const fixedOverlayProps = __spreadProps(__spreadValues({}, overlayProps), {
-  overlayStyle: {
-    type: [String, Object],
-    default: void 0
+function lockScroll() {
+  if (document.documentElement.scrollHeight > document.documentElement.clientHeight) {
+    const scrollTop = document.documentElement.scrollTop;
+    const style = document.documentElement.getAttribute("style");
+    document.documentElement.style.position = "fixed";
+    document.documentElement.style.top = `-${scrollTop}px`;
+    document.documentElement.style.width = document.documentElement.style.width || "100%";
+    document.documentElement.style.overflowY = "scroll";
+    return () => {
+      if (style) {
+        document.documentElement.setAttribute("style", style);
+      } else {
+        document.documentElement.removeAttribute("style");
+      }
+      document.documentElement.scrollTop = scrollTop;
+    };
   }
-});
-const overlayEmits = ["update:visible", "backdropClick"];
-function useOverlayLogic(props, ctx) {
-  const backgroundClass = computed(() => {
-    return [
-      "devui-overlay-background",
-      props.backgroundClass,
-      !props.hasBackdrop ? "devui-overlay-background__disabled" : "devui-overlay-background__color"
-    ];
-  });
-  const overlayClass = computed(() => {
-    return "devui-overlay";
-  });
-  const handleBackdropClick = (event) => {
-    var _a;
+  return;
+}
+function useFixedOverlay(props, ctx) {
+  let lockScrollCb;
+  const onClick = (event) => {
     event.preventDefault();
-    (_a = props.onBackdropClick) == null ? void 0 : _a.call(props);
-    if (props.backdropClose) {
-      ctx.emit("update:visible", false);
+    ctx.emit("click", event);
+    if (props.closeOnClickOverlay) {
+      ctx.emit("update:modelValue", false);
     }
   };
-  const handleOverlayBubbleCancel = (event) => event.cancelBubble = true;
-  onMounted(() => {
-    const body = document.body;
-    const originOverflow = body.style.overflow;
-    const originPosition = body.style.position;
-    watch([() => props.visible, () => props.backgroundBlock], ([visible, backgroundBlock]) => {
-      if (backgroundBlock) {
-        const top = body.getBoundingClientRect().y;
-        if (visible) {
-          body.style.overflowY = "scroll";
-          body.style.position = visible ? "fixed" : "";
-          body.style.top = `${top}px`;
-        } else {
-          body.style.overflowY = originOverflow;
-          body.style.position = originPosition;
-          body.style.top = "";
-          window.scrollTo(0, -top);
-        }
-      }
-    });
-    onUnmounted(() => {
-      document.body.style.overflow = originOverflow;
-    });
+  const removeBodyAdditions = () => {
+    lockScrollCb == null ? void 0 : lockScrollCb();
+  };
+  watch(() => props.modelValue, (val) => {
+    if (val) {
+      props.lockScroll && (lockScrollCb = lockScroll());
+    } else {
+      removeBodyAdditions();
+    }
   });
+  onUnmounted(removeBodyAdditions);
+  return { onClick };
+}
+function createBem(namespace, element, modifier) {
+  let cls = namespace;
+  if (element) {
+    cls += `__${element}`;
+  }
+  if (modifier) {
+    cls += `--${modifier}`;
+  }
+  return cls;
+}
+function useNamespace(block, needDot = false) {
+  const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
+  const b = () => createBem(namespace);
+  const e = (element) => element ? createBem(namespace, element) : "";
+  const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
+  const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
   return {
-    backgroundClass,
-    overlayClass,
-    handleBackdropClick,
-    handleOverlayBubbleCancel
+    b,
+    e,
+    m,
+    em
   };
 }
 var fixedOverlay = "";
 defineComponent({
   name: "DFixedOverlay",
+  inheritAttrs: false,
   props: fixedOverlayProps,
-  emits: overlayEmits,
+  emits: ["update:modelValue", "click"],
   setup(props, ctx) {
     const {
-      backgroundClass,
-      overlayClass,
-      handleBackdropClick,
-      handleOverlayBubbleCancel
-    } = useOverlayLogic(props, ctx);
-    return () => createVNode(CommonOverlay, null, {
-      default: () => [props.visible && createVNode("div", {
-        "class": backgroundClass.value,
-        "style": props.backgroundStyle,
-        "onClick": handleBackdropClick
-      }, [createVNode("div", {
-        "class": overlayClass.value,
-        "style": props.overlayStyle,
-        "onClick": handleOverlayBubbleCancel
-      }, [renderSlot(ctx.slots, "default")])])]
+      modelValue
+    } = toRefs(props);
+    const ns2 = useNamespace("fixed-overlay");
+    const {
+      onClick
+    } = useFixedOverlay(props, ctx);
+    return () => createVNode(Transition, {
+      "name": ns2.m("fade")
+    }, {
+      default: () => {
+        var _a, _b;
+        return [modelValue.value && createVNode("div", mergeProps({
+          "class": ns2.b()
+        }, ctx.attrs, {
+          "onClick": onClick
+        }), [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)])];
+      }
     });
   }
 });
@@ -187,6 +129,9 @@ const flexibleOverlayProps = {
     type: [Number, Object],
     default: 8
   },
+  shiftOffset: {
+    type: Number
+  },
   align: {
     type: String,
     default: null
@@ -232,6 +177,7 @@ function adjustArrowPosition(isArrowCenter, point, placement, originRect) {
 function useOverlay(props, emit) {
   const overlayRef = ref();
   const arrowRef = ref();
+  let originParent = null;
   const updateArrowPosition = (arrowEl, placement, point, overlayEl) => {
     const { x, y } = adjustArrowPosition(props.isArrowCenter, point, placement, overlayEl.getBoundingClientRect());
     const staticSide = {
@@ -253,7 +199,6 @@ function useOverlay(props, emit) {
     const overlayEl = unref(overlayRef.value);
     const arrowEl = unref(arrowRef.value);
     const middleware = [
-      shift(),
       offset(props.offset),
       autoPlacement({
         alignment: props.align,
@@ -261,30 +206,39 @@ function useOverlay(props, emit) {
       })
     ];
     props.showArrow && middleware.push(arrow({ element: arrowEl }));
+    props.shiftOffset !== void 0 && middleware.push(shift());
     const { x, y, placement, middlewareData } = await computePosition(hostEl, overlayEl, {
       strategy: "fixed",
       middleware
     });
+    let applyX = x;
+    let applyY = y;
+    if (props.shiftOffset !== void 0) {
+      const { x: shiftX, y: shiftY } = middlewareData.shift;
+      shiftX < 0 && (applyX -= props.shiftOffset);
+      shiftX > 0 && (applyX += props.shiftOffset);
+      shiftY < 0 && (applyY -= props.shiftOffset);
+      shiftY > 0 && (applyY += props.shiftOffset);
+    }
     emit("positionChange", placement);
-    Object.assign(overlayEl.style, { top: `${y}px`, left: `${x}px` });
+    Object.assign(overlayEl.style, { top: `${applyY}px`, left: `${applyX}px` });
     props.showArrow && updateArrowPosition(arrowEl, placement, middlewareData.arrow, overlayEl);
   };
   watch(() => props.modelValue, () => {
-    const originParent = getScrollParent(props.origin);
     if (props.modelValue && props.origin) {
+      originParent = getScrollParent(props.origin);
       nextTick(updatePosition);
-      originParent.addEventListener("scroll", updatePosition);
+      originParent == null ? void 0 : originParent.addEventListener("scroll", updatePosition);
       originParent !== window && window.addEventListener("scroll", updatePosition);
       window.addEventListener("resize", updatePosition);
     } else {
-      originParent.removeEventListener("scroll", updatePosition);
+      originParent == null ? void 0 : originParent.removeEventListener("scroll", updatePosition);
       originParent !== window && window.removeEventListener("scroll", updatePosition);
       window.removeEventListener("resize", updatePosition);
     }
   });
   onUnmounted(() => {
-    const originParent = getScrollParent(props.origin);
-    originParent.removeEventListener("scroll", updatePosition);
+    originParent == null ? void 0 : originParent.removeEventListener("scroll", updatePosition);
     originParent !== window && window.removeEventListener("scroll", updatePosition);
     window.removeEventListener("resize", updatePosition);
   });
@@ -302,6 +256,7 @@ const FlexibleOverlay = defineComponent({
     emit,
     expose
   }) {
+    const ns2 = useNamespace("flexible-overlay");
     const {
       arrowRef,
       overlayRef,
@@ -314,14 +269,70 @@ const FlexibleOverlay = defineComponent({
       var _a;
       return props.modelValue && createVNode("div", mergeProps({
         "ref": overlayRef,
-        "class": "devui-flexible-overlay"
+        "class": ns2.b()
       }, attrs), [(_a = slots.default) == null ? void 0 : _a.call(slots), props.showArrow && createVNode("div", {
         "ref": arrowRef,
-        "class": "devui-flexible-overlay-arrow"
+        "class": ns2.e("arrow")
       }, null)]);
     };
   }
 });
+const POPPER_TRIGGER_TOKEN = Symbol("popper-trigger");
+const isObject = (val) => val !== null && typeof val === "object";
+const ns = useNamespace("popper-trigger");
+function wrapContent(content) {
+  return h("span", { class: ns.b() }, content);
+}
+function getFirstValidChild(nodes) {
+  for (const child of nodes) {
+    if (isObject(child)) {
+      if (child.type === Comment) {
+        continue;
+      }
+      if (child.type === "svg" || child.type === Text) {
+        return wrapContent(child);
+      }
+      if (child.type === Fragment) {
+        return getFirstValidChild(child.children);
+      }
+      return child;
+    }
+    return wrapContent(child);
+  }
+  return null;
+}
+var PopperTrigger = defineComponent({
+  name: "DPopperTrigger",
+  setup(_, ctx) {
+    const {
+      slots,
+      attrs
+    } = ctx;
+    return () => {
+      var _a;
+      const defaultSlot = (_a = slots.default) == null ? void 0 : _a.call(slots, attrs);
+      const triggerRef = inject(POPPER_TRIGGER_TOKEN);
+      if (!defaultSlot) {
+        return null;
+      }
+      const firstValidChild = getFirstValidChild(defaultSlot);
+      if (!firstValidChild) {
+        return null;
+      }
+      return withDirectives(cloneVNode(firstValidChild, attrs), [[{
+        mounted(el) {
+          triggerRef.value = el;
+        },
+        updated(el) {
+          triggerRef.value = el;
+        },
+        unmounted() {
+          triggerRef.value = null;
+        }
+      }]]);
+    };
+  }
+});
 const tooltipProps = {
   content: {
     type: String,
@@ -342,6 +353,18 @@ const tooltipProps = {
   mouseLeaveDelay: {
     type: Number,
     default: 100
+  },
+  enterable: {
+    type: Boolean,
+    default: true
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  hideAfter: {
+    type: Number,
+    default: 0
   }
 };
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
@@ -1055,7 +1078,7 @@ var lodash = { exports: {} };
       var objectCtorString = funcToString.call(Object2);
       var oldDash = root._;
       var reIsNative = RegExp2("^" + funcToString.call(hasOwnProperty).replace(reRegExpChar, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$");
-      var Buffer2 = moduleExports ? context.Buffer : undefined$1, Symbol = context.Symbol, Uint8Array2 = context.Uint8Array, allocUnsafe = Buffer2 ? Buffer2.allocUnsafe : undefined$1, getPrototype = overArg(Object2.getPrototypeOf, Object2), objectCreate = Object2.create, propertyIsEnumerable = objectProto.propertyIsEnumerable, splice = arrayProto.splice, spreadableSymbol = Symbol ? Symbol.isConcatSpreadable : undefined$1, symIterator = Symbol ? Symbol.iterator : undefined$1, symToStringTag = Symbol ? Symbol.toStringTag : undefined$1;
+      var Buffer2 = moduleExports ? context.Buffer : undefined$1, Symbol2 = context.Symbol, Uint8Array2 = context.Uint8Array, allocUnsafe = Buffer2 ? Buffer2.allocUnsafe : undefined$1, getPrototype = overArg(Object2.getPrototypeOf, Object2), objectCreate = Object2.create, propertyIsEnumerable = objectProto.propertyIsEnumerable, splice = arrayProto.splice, spreadableSymbol = Symbol2 ? Symbol2.isConcatSpreadable : undefined$1, symIterator = Symbol2 ? Symbol2.iterator : undefined$1, symToStringTag = Symbol2 ? Symbol2.toStringTag : undefined$1;
       var defineProperty = function() {
         try {
           var func = getNative(Object2, "defineProperty");
@@ -1070,7 +1093,7 @@ var lodash = { exports: {} };
       var metaMap = WeakMap2 && new WeakMap2();
       var realNames = {};
       var dataViewCtorString = toSource(DataView), mapCtorString = toSource(Map), promiseCtorString = toSource(Promise2), setCtorString = toSource(Set), weakMapCtorString = toSource(WeakMap2);
-      var symbolProto = Symbol ? Symbol.prototype : undefined$1, symbolValueOf = symbolProto ? symbolProto.valueOf : undefined$1, symbolToString = symbolProto ? symbolProto.toString : undefined$1;
+      var symbolProto = Symbol2 ? Symbol2.prototype : undefined$1, symbolValueOf = symbolProto ? symbolProto.valueOf : undefined$1, symbolToString = symbolProto ? symbolProto.toString : undefined$1;
       function lodash2(value) {
         if (isObjectLike(value) && !isArray(value) && !(value instanceof LazyWrapper)) {
           if (value instanceof LodashWrapper) {
@@ -1086,7 +1109,7 @@ var lodash = { exports: {} };
         function object() {
         }
         return function(proto) {
-          if (!isObject(proto)) {
+          if (!isObject2(proto)) {
             return {};
           }
           if (objectCreate) {
@@ -1425,7 +1448,7 @@ var lodash = { exports: {} };
       function baseAt(object, paths) {
         var index2 = -1, length = paths.length, result2 = Array2(length), skip = object == null;
         while (++index2 < length) {
-          result2[index2] = skip ? undefined$1 : get(object, paths[index2]);
+          result2[index2] = skip ? undefined$1 : get2(object, paths[index2]);
         }
         return result2;
       }
@@ -1448,7 +1471,7 @@ var lodash = { exports: {} };
         if (result2 !== undefined$1) {
           return result2;
         }
-        if (!isObject(value)) {
+        if (!isObject2(value)) {
           return value;
         }
         var isArr = isArray(value);
@@ -1524,7 +1547,7 @@ var lodash = { exports: {} };
         if (typeof func != "function") {
           throw new TypeError2(FUNC_ERROR_TEXT);
         }
-        return setTimeout(function() {
+        return setTimeout2(function() {
           func.apply(undefined$1, args);
         }, wait);
       }
@@ -1795,7 +1818,7 @@ var lodash = { exports: {} };
         return true;
       }
       function baseIsNative(value) {
-        if (!isObject(value) || isMasked(value)) {
+        if (!isObject2(value) || isMasked(value)) {
           return false;
         }
         var pattern = isFunction(value) ? reIsNative : reIsHostCtor;
@@ -1835,7 +1858,7 @@ var lodash = { exports: {} };
         return result2;
       }
       function baseKeysIn(object) {
-        if (!isObject(object)) {
+        if (!isObject2(object)) {
           return nativeKeysIn(object);
         }
         var isProto = isPrototype(object), result2 = [];
@@ -1870,7 +1893,7 @@ var lodash = { exports: {} };
           return matchesStrictComparable(toKey(path), srcValue);
         }
         return function(object) {
-          var objValue = get(object, path);
+          var objValue = get2(object, path);
           return objValue === undefined$1 && objValue === srcValue ? hasIn(object, path) : baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG);
         };
       }
@@ -1880,7 +1903,7 @@ var lodash = { exports: {} };
         }
         baseFor(source, function(srcValue, key) {
           stack || (stack = new Stack());
-          if (isObject(srcValue)) {
+          if (isObject2(srcValue)) {
             baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);
           } else {
             var newValue = customizer ? customizer(safeGet(object, key), srcValue, key + "", object, source, stack) : undefined$1;
@@ -1920,7 +1943,7 @@ var lodash = { exports: {} };
             newValue = objValue;
             if (isArguments(objValue)) {
               newValue = toPlainObject(objValue);
-            } else if (!isObject(objValue) || isFunction(objValue)) {
+            } else if (!isObject2(objValue) || isFunction(objValue)) {
               newValue = initCloneObject(srcValue);
             }
           } else {
@@ -2059,7 +2082,7 @@ var lodash = { exports: {} };
         return shuffleSelf(array, baseClamp(n, 0, array.length));
       }
       function baseSet(object, path, value, customizer) {
-        if (!isObject(object)) {
+        if (!isObject2(object)) {
           return object;
         }
         path = castPath(path, object);
@@ -2073,7 +2096,7 @@ var lodash = { exports: {} };
             var objValue = nested[key];
             newValue = customizer ? customizer(objValue, key, nested) : undefined$1;
             if (newValue === undefined$1) {
-              newValue = isObject(objValue) ? objValue : isIndex(path[index2 + 1]) ? [] : {};
+              newValue = isObject2(objValue) ? objValue : isIndex(path[index2 + 1]) ? [] : {};
             }
           }
           assignValue(nested, key, newValue);
@@ -2304,7 +2327,7 @@ var lodash = { exports: {} };
         end = end === undefined$1 ? length : end;
         return !start && end >= length ? array : baseSlice(array, start, end);
       }
-      var clearTimeout = ctxClearTimeout || function(id) {
+      var clearTimeout2 = ctxClearTimeout || function(id) {
         return root.clearTimeout(id);
       };
       function cloneBuffer(buffer, isDeep) {
@@ -2523,7 +2546,7 @@ var lodash = { exports: {} };
               return new Ctor(args[0], args[1], args[2], args[3], args[4], args[5], args[6]);
           }
           var thisBinding = baseCreate(Ctor.prototype), result2 = Ctor.apply(thisBinding, args);
-          return isObject(result2) ? result2 : thisBinding;
+          return isObject2(result2) ? result2 : thisBinding;
         };
       }
       function createCurry(func, bitmask, arity) {
@@ -2837,7 +2860,7 @@ var lodash = { exports: {} };
         return objValue;
       }
       function customDefaultsMerge(objValue, srcValue, key, object, source, stack) {
-        if (isObject(objValue) && isObject(srcValue)) {
+        if (isObject2(objValue) && isObject2(srcValue)) {
           stack.set(srcValue, objValue);
           baseMerge(objValue, srcValue, undefined$1, customDefaultsMerge, stack);
           stack["delete"](srcValue);
@@ -3185,7 +3208,7 @@ var lodash = { exports: {} };
         return !!length && (type == "number" || type != "symbol" && reIsUint.test(value)) && (value > -1 && value % 1 == 0 && value < length);
       }
       function isIterateeCall(value, index2, object) {
-        if (!isObject(object)) {
+        if (!isObject2(object)) {
           return false;
         }
         var type = typeof index2;
@@ -3228,7 +3251,7 @@ var lodash = { exports: {} };
         return value === proto;
       }
       function isStrictComparable(value) {
-        return value === value && !isObject(value);
+        return value === value && !isObject2(value);
       }
       function matchesStrictComparable(key, srcValue) {
         return function(object) {
@@ -3333,7 +3356,7 @@ var lodash = { exports: {} };
         return object[key];
       }
       var setData = shortOut(baseSetData);
-      var setTimeout = ctxSetTimeout || function(func, wait) {
+      var setTimeout2 = ctxSetTimeout || function(func, wait) {
         return root.setTimeout(func, wait);
       };
       var setToString = shortOut(baseSetToString);
@@ -4110,7 +4133,7 @@ var lodash = { exports: {} };
           throw new TypeError2(FUNC_ERROR_TEXT);
         }
         wait = toNumber(wait) || 0;
-        if (isObject(options)) {
+        if (isObject2(options)) {
           leading = !!options.leading;
           maxing = "maxWait" in options;
           maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
@@ -4125,7 +4148,7 @@ var lodash = { exports: {} };
         }
         function leadingEdge(time) {
           lastInvokeTime = time;
-          timerId = setTimeout(timerExpired, wait);
+          timerId = setTimeout2(timerExpired, wait);
           return leading ? invokeFunc(time) : result2;
         }
         function remainingWait(time) {
@@ -4141,7 +4164,7 @@ var lodash = { exports: {} };
           if (shouldInvoke(time)) {
             return trailingEdge(time);
           }
-          timerId = setTimeout(timerExpired, remainingWait(time));
+          timerId = setTimeout2(timerExpired, remainingWait(time));
         }
         function trailingEdge(time) {
           timerId = undefined$1;
@@ -4153,7 +4176,7 @@ var lodash = { exports: {} };
         }
         function cancel() {
           if (timerId !== undefined$1) {
-            clearTimeout(timerId);
+            clearTimeout2(timerId);
           }
           lastInvokeTime = 0;
           lastArgs = lastCallTime = lastThis = timerId = undefined$1;
@@ -4171,13 +4194,13 @@ var lodash = { exports: {} };
               return leadingEdge(lastCallTime);
             }
             if (maxing) {
-              clearTimeout(timerId);
-              timerId = setTimeout(timerExpired, wait);
+              clearTimeout2(timerId);
+              timerId = setTimeout2(timerExpired, wait);
               return invokeFunc(lastCallTime);
             }
           }
           if (timerId === undefined$1) {
-            timerId = setTimeout(timerExpired, wait);
+            timerId = setTimeout2(timerExpired, wait);
           }
           return result2;
         }
@@ -4280,7 +4303,7 @@ var lodash = { exports: {} };
         if (typeof func != "function") {
           throw new TypeError2(FUNC_ERROR_TEXT);
         }
-        if (isObject(options)) {
+        if (isObject2(options)) {
           leading = "leading" in options ? !!options.leading : leading;
           trailing = "trailing" in options ? !!options.trailing : trailing;
         }
@@ -4388,7 +4411,7 @@ var lodash = { exports: {} };
         return typeof value == "number" && nativeIsFinite(value);
       }
       function isFunction(value) {
-        if (!isObject(value)) {
+        if (!isObject2(value)) {
           return false;
         }
         var tag = baseGetTag(value);
@@ -4400,7 +4423,7 @@ var lodash = { exports: {} };
       function isLength(value) {
         return typeof value == "number" && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
       }
-      function isObject(value) {
+      function isObject2(value) {
         var type = typeof value;
         return value != null && (type == "object" || type == "function");
       }
@@ -4507,9 +4530,9 @@ var lodash = { exports: {} };
         if (isSymbol(value)) {
           return NAN;
         }
-        if (isObject(value)) {
+        if (isObject2(value)) {
           var other = typeof value.valueOf == "function" ? value.valueOf() : value;
-          value = isObject(other) ? other + "" : other;
+          value = isObject2(other) ? other + "" : other;
         }
         if (typeof value != "string") {
           return value === 0 ? value : +value;
@@ -4603,7 +4626,7 @@ var lodash = { exports: {} };
       function functionsIn(object) {
         return object == null ? [] : baseFunctions(object, keysIn(object));
       }
-      function get(object, path, defaultValue) {
+      function get2(object, path, defaultValue) {
         var result2 = object == null ? undefined$1 : baseGet(object, path);
         return result2 === undefined$1 ? defaultValue : result2;
       }
@@ -4730,7 +4753,7 @@ var lodash = { exports: {} };
           var Ctor = object && object.constructor;
           if (isArrLike) {
             accumulator = isArr ? new Ctor() : [];
-          } else if (isObject(object)) {
+          } else if (isObject2(object)) {
             accumulator = isFunction(Ctor) ? baseCreate(getPrototype(object)) : {};
           } else {
             accumulator = {};
@@ -5012,7 +5035,7 @@ var lodash = { exports: {} };
       }
       function truncate(string, options) {
         var length = DEFAULT_TRUNC_LENGTH, omission = DEFAULT_TRUNC_OMISSION;
-        if (isObject(options)) {
+        if (isObject2(options)) {
           var separator = "separator" in options ? options.separator : separator;
           length = "length" in options ? toInteger(options.length) : length;
           omission = "omission" in options ? baseToString(options.omission) : omission;
@@ -5142,13 +5165,13 @@ var lodash = { exports: {} };
       });
       function mixin(object, source, options) {
         var props = keys(source), methodNames = baseFunctions(source, props);
-        if (options == null && !(isObject(source) && (methodNames.length || !props.length))) {
+        if (options == null && !(isObject2(source) && (methodNames.length || !props.length))) {
           options = source;
           source = object;
           object = this;
           methodNames = baseFunctions(source, keys(source));
         }
-        var chain2 = !(isObject(options) && "chain" in options) || !!options.chain, isFunc = isFunction(object);
+        var chain2 = !(isObject2(options) && "chain" in options) || !!options.chain, isFunc = isFunction(object);
         arrayEach(methodNames, function(methodName) {
           var func = source[methodName];
           object[methodName] = func;
@@ -5458,7 +5481,7 @@ var lodash = { exports: {} };
       lodash2.forInRight = forInRight;
       lodash2.forOwn = forOwn;
       lodash2.forOwnRight = forOwnRight;
-      lodash2.get = get;
+      lodash2.get = get2;
       lodash2.gt = gt;
       lodash2.gte = gte;
       lodash2.has = has;
@@ -5494,7 +5517,7 @@ var lodash = { exports: {} };
       lodash2.isNil = isNil;
       lodash2.isNull = isNull;
       lodash2.isNumber = isNumber;
-      lodash2.isObject = isObject;
+      lodash2.isObject = isObject2;
       lodash2.isObjectLike = isObjectLike;
       lodash2.isPlainObject = isPlainObject;
       lodash2.isRegExp = isRegExp;
@@ -5763,7 +5786,7 @@ const TransformOriginMap = {
   right: "-8px 50%"
 };
 function useTooltip(origin, props) {
-  const { position, mouseEnterDelay, mouseLeaveDelay } = toRefs(props);
+  const { position, mouseEnterDelay, mouseLeaveDelay, enterable, disabled, hideAfter } = toRefs(props);
   const visible = ref(false);
   const isEnter = ref(false);
   const positionArr = computed(() => typeof position.value === "string" ? [position.value] : position.value);
@@ -5778,6 +5801,9 @@ function useTooltip(origin, props) {
     !isEnter.value && (visible.value = false);
   }, mouseLeaveDelay.value);
   const onMouseenter = () => {
+    if (disabled.value) {
+      return;
+    }
     isEnter.value = true;
     enter();
   };
@@ -5788,11 +5814,29 @@ function useTooltip(origin, props) {
   const onPositionChange = (pos) => {
     placement.value = pos;
   };
+  const quickLeave = () => {
+    isEnter.value = false;
+    visible.value = false;
+  };
+  const onMouseenterOverlay = () => {
+    if (!enterable.value) {
+      quickLeave();
+    } else {
+      onMouseenter();
+    }
+  };
   onMounted(() => {
     origin.value.addEventListener("mouseenter", onMouseenter);
     origin.value.addEventListener("mouseleave", onMouseleave);
   });
-  return { visible, placement, positionArr, overlayStyles, onPositionChange };
+  let timer;
+  watch(visible, (newVal) => {
+    if (newVal && hideAfter.value) {
+      timer && clearTimeout(timer);
+      timer = setTimeout(quickLeave, hideAfter.value);
+    }
+  });
+  return { visible, placement, positionArr, overlayStyles, onPositionChange, onMouseenter, onMouseleave, onMouseenterOverlay };
 }
 var tooltip = "";
 var DToolTip = defineComponent({
@@ -5812,38 +5856,43 @@ var DToolTip = defineComponent({
       placement,
       positionArr,
       overlayStyles,
-      onPositionChange
+      onPositionChange,
+      onMouseleave,
+      onMouseenterOverlay
     } = useTooltip(origin, props);
-    return () => {
-      var _a;
-      return createVNode(Fragment, null, [createVNode("div", {
-        "ref": origin,
-        "class": "devui-tooltip-reference"
-      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]), createVNode(Teleport, {
-        "to": "body"
+    const ns2 = useNamespace("tooltip");
+    provide(POPPER_TRIGGER_TOKEN, origin);
+    return () => createVNode(Fragment, null, [createVNode(PopperTrigger, null, {
+      default: () => {
+        var _a;
+        return [(_a = slots.default) == null ? void 0 : _a.call(slots)];
+      }
+    }), createVNode(Teleport, {
+      "to": "body"
+    }, {
+      default: () => [createVNode(Transition, {
+        "name": showAnimation.value ? ns2.m(`fade-${placement.value}`) : ""
       }, {
-        default: () => [createVNode(Transition, {
-          "name": showAnimation.value ? `devui-tooltip-fade-${placement.value}` : ""
+        default: () => [createVNode(FlexibleOverlay, {
+          "modelValue": visible.value,
+          "onUpdate:modelValue": ($event) => visible.value = $event,
+          "ref": tooltipRef,
+          "class": ns2.b(),
+          "origin": origin.value,
+          "position": positionArr.value,
+          "offset": 6,
+          "show-arrow": true,
+          "style": overlayStyles.value,
+          "onPositionChange": onPositionChange,
+          "onMouseenter": onMouseenterOverlay,
+          "onMouseleave": onMouseleave
         }, {
-          default: () => [createVNode(FlexibleOverlay, {
-            "modelValue": visible.value,
-            "onUpdate:modelValue": ($event) => visible.value = $event,
-            "ref": tooltipRef,
-            "class": "devui-tooltip",
-            "origin": origin.value,
-            "position": positionArr.value,
-            "offset": 6,
-            "show-arrow": true,
-            "style": overlayStyles.value,
-            "onPositionChange": onPositionChange
-          }, {
-            default: () => [createVNode("span", {
-              "innerHTML": content.value
-            }, null)]
-          })]
+          default: () => [createVNode("span", {
+            "innerHTML": content.value
+          }, null)]
         })]
-      })]);
-    };
+      })]
+    })]);
   }
 });
 function setStyle(element, style) {
@@ -5883,58 +5932,58 @@ function removeClass(el, className) {
     }
   }
 }
-const resize = {
-  mounted(el, { value }) {
-    el.$value = value;
-    if (value.enableResize) {
-      bindEvent(el);
-    }
-  },
-  unmounted(el, { value }) {
-    if (value.enableResize) {
-      unbind(el, "mousedown", onMousedown);
-    }
-  }
-};
-function bindEvent(el) {
-  bind(el, "mousedown", onMousedown);
+function normalizeEvent(evt) {
+  return {
+    pageX: evt.pageX,
+    pageY: evt.pageY,
+    clientX: evt.clientX,
+    clientY: evt.clientY,
+    offsetX: evt.offsetX,
+    offsetY: evt.offsetY,
+    type: evt.type,
+    originalEvent: evt
+  };
 }
-function bind(el, event, callback) {
-  el.addEventListener && el.addEventListener(event, callback);
+function bind(el, eventName, callback) {
+  el.addEventListener && el.addEventListener(eventName, callback);
 }
-function unbind(el, event, callback) {
-  el.removeEventListener && el.removeEventListener(event, callback);
+function unbind(el, eventName, callback) {
+  el.removeEventListener && el.removeEventListener(eventName, callback);
 }
 function onMousedown(e) {
   var _a;
-  const $value = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.$value;
-  if (!$value) {
+  const resizeProps = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.resizeProps;
+  if (!resizeProps) {
     return;
   }
-  bind(document, "mousemove", onMousemove);
-  bind(document, "mouseup", onMouseup);
-  $value.onPressEvent(normalizeEvent(e));
-  function onMousemove(e2) {
-    $value.onDragEvent(normalizeEvent(e2));
+  function onMousemove(evt) {
+    resizeProps.onDragEvent(normalizeEvent(evt));
   }
-  function onMouseup(e2) {
+  function onMouseup(evt) {
     unbind(document, "mousemove", onMousemove);
     unbind(document, "mouseup", onMouseup);
-    $value.onReleaseEvent(normalizeEvent(e2));
+    resizeProps.onReleaseEvent(normalizeEvent(evt));
   }
+  bind(document, "mousemove", onMousemove);
+  bind(document, "mouseup", onMouseup);
+  resizeProps.onPressEvent(normalizeEvent(e));
 }
-function normalizeEvent(e) {
-  return {
-    pageX: e.pageX,
-    pageY: e.pageY,
-    clientX: e.clientX,
-    clientY: e.clientY,
-    offsetX: e.offsetX,
-    offsetY: e.offsetY,
-    type: e.type,
-    originalEvent: e
-  };
+function bindEvent(el) {
+  bind(el, "mousedown", onMousedown);
 }
+const resize = {
+  mounted(el, { value }) {
+    el.resizeProps = value;
+    if (value.enableResize) {
+      bindEvent(el);
+    }
+  },
+  unmounted(el, { value }) {
+    if (value.enableResize) {
+      unbind(el, "mousedown", onMousedown);
+    }
+  }
+};
 const splitterBarProps = {
   index: {
     type: Number
@@ -5956,6 +6005,24 @@ const splitterBarProps = {
   }
 };
 var splitterBar = "";
+const camelize = (name) => name.substring(1).replace(/^\S/, (s) => s.toLocaleLowerCase());
+function get(object, path) {
+  const keys = path.split(".");
+  let result = object;
+  keys.forEach((key) => {
+    var _a;
+    result = (_a = result[key]) != null ? _a : "";
+  });
+  return result;
+}
+function createI18nTranslate(name, app, newPrefix) {
+  const prefix = newPrefix || camelize(name) + ".";
+  return (path) => {
+    const messages = app == null ? void 0 : app.appContext.config.globalProperties.langMessages.value;
+    const message = get(messages, prefix + path) || get(messages, path);
+    return message;
+  };
+}
 var DSplitterBar = defineComponent({
   name: "DSplitterBar",
   components: {
@@ -5963,9 +6030,12 @@ var DSplitterBar = defineComponent({
   },
   props: splitterBarProps,
   setup(props) {
+    const app = getCurrentInstance();
+    const t = createI18nTranslate("DSplitterBar", app);
+    const ns2 = useNamespace("splitter");
     const store = inject("splitterStore");
     const state = reactive({
-      wrapperClass: `devui-splitter-bar devui-splitter-bar-${props.orientation}`
+      wrapperClass: `${ns2.e("bar")} ${ns2.em("bar", props.orientation)} `
     });
     const domRef = ref();
     watch([() => props.splitBarSize, domRef], ([curSplitBarSize, ele]) => {
@@ -5978,10 +6048,13 @@ var DSplitterBar = defineComponent({
     }, {
       immediate: true
     });
-    watch([() => store.state.panes, domRef], ([panes, ele]) => {
+    watch([() => store == null ? void 0 : store.state.panes, domRef], ([, ele]) => {
+      if (!store || !props || props.index === void 0) {
+        return;
+      }
       if (!store.isStaticBar(props.index)) {
         state.wrapperClass += " resizable";
-      } else {
+      } else if (ele) {
         setStyle(ele, {
           flexBasis: props.disabledBarSize
         });
@@ -5989,62 +6062,10 @@ var DSplitterBar = defineComponent({
     }, {
       deep: true
     });
-    const coordinate = {
-      pageX: 0,
-      pageY: 0,
-      originalX: 0,
-      originalY: 0
-    };
-    let initState;
-    const resizeProp = {
-      enableResize: true,
-      onPressEvent: function({
-        originalEvent
-      }) {
-        originalEvent.stopPropagation();
-        if (!store.isResizable(props.index)) {
-          return;
-        }
-        initState = store.dragState(props.index);
-        coordinate.originalX = originalEvent.pageX;
-        coordinate.originalY = originalEvent.pageY;
-      },
-      onDragEvent: function({
-        originalEvent
-      }) {
-        originalEvent.stopPropagation();
-        if (!store.isResizable(props.index)) {
-          return;
-        }
-        coordinate.pageX = originalEvent.pageX;
-        coordinate.pageY = originalEvent.pageY;
-        let distance;
-        if (props.orientation === "vertical") {
-          distance = coordinate.pageY - coordinate.originalY;
-        } else {
-          distance = coordinate.pageX - coordinate.originalX;
-        }
-        store.setSize(initState, distance);
-      },
-      onReleaseEvent: function({
-        originalEvent
-      }) {
-        originalEvent.stopPropagation();
-        if (!store.isResizable(props.index)) {
-          return;
-        }
-        coordinate.pageX = originalEvent.pageX;
-        coordinate.pageY = originalEvent.pageY;
-        let distance;
-        if (props.orientation === "vertical") {
-          distance = coordinate.pageY - coordinate.originalY;
-        } else {
-          distance = coordinate.pageX - coordinate.originalX;
-        }
-        store.setSize(initState, distance);
-      }
-    };
     const queryPanes = (index2, nearIndex) => {
+      if (!store) {
+        return {};
+      }
       const pane = store.getPane(index2);
       const nearPane = store.getPane(nearIndex);
       return {
@@ -6056,15 +6077,18 @@ var DSplitterBar = defineComponent({
       var _a, _b, _c, _d;
       const isCollapsible = ((_b = (_a = pane == null ? void 0 : pane.component) == null ? void 0 : _a.props) == null ? void 0 : _b.collapsible) && showIcon;
       const isCollapsed = (_d = (_c = pane == null ? void 0 : pane.component) == null ? void 0 : _c.props) == null ? void 0 : _d.collapsed;
-      const isNearPaneCollapsed = nearPane.collapsed;
+      const isNearPaneCollapsed = nearPane == null ? void 0 : nearPane.collapsed;
       return {
-        "devui-collapse": isCollapsible,
+        [ns2.e("collapse")]: isCollapsible,
         collapsed: isCollapsed,
         hidden: isNearPaneCollapsed
       };
     };
     const prevClass = computed(() => {
       var _a, _b;
+      if (!props || props.index === void 0) {
+        return {};
+      }
       const {
         pane,
         nearPane
@@ -6074,6 +6098,9 @@ var DSplitterBar = defineComponent({
     });
     const nextClass = computed(() => {
       var _a, _b;
+      if (!store || !props || props.index === void 0) {
+        return {};
+      }
       const {
         pane,
         nearPane
@@ -6083,6 +6110,9 @@ var DSplitterBar = defineComponent({
     });
     const toggleResize = () => {
       var _a, _b, _c, _d;
+      if (!domRef.value || !props || props.index === void 0) {
+        return;
+      }
       const {
         pane,
         nearPane
@@ -6095,10 +6125,16 @@ var DSplitterBar = defineComponent({
       }
     };
     const handleCollapsePrePane = (lockStatus) => {
+      if (!store || !props || props.index === void 0) {
+        return;
+      }
       store.tooglePane(props.index, props.index + 1, lockStatus);
       toggleResize();
     };
     const handleCollapseNextPane = (lockStatus) => {
+      if (!store || !props || props.index === void 0) {
+        return;
+      }
       store.tooglePane(props.index + 1, props.index, lockStatus);
       toggleResize();
     };
@@ -6106,17 +6142,84 @@ var DSplitterBar = defineComponent({
       handleCollapsePrePane(true);
       handleCollapseNextPane(true);
     };
+    const coordinate = {
+      pageX: 0,
+      pageY: 0,
+      originalX: 0,
+      originalY: 0
+    };
+    let initState;
+    const resizeProp = {
+      enableResize: true,
+      onPressEvent: function({
+        originalEvent
+      }) {
+        originalEvent.stopPropagation();
+        if (!store || !props || props.index === void 0) {
+          return;
+        }
+        if (!store.isResizable(props.index)) {
+          return;
+        }
+        initState = store.dragState(props.index);
+        coordinate.originalX = originalEvent.pageX;
+        coordinate.originalY = originalEvent.pageY;
+      },
+      onDragEvent: function({
+        originalEvent
+      }) {
+        originalEvent.stopPropagation();
+        if (!store || !props || props.index === void 0) {
+          return;
+        }
+        if (!store.isResizable(props.index)) {
+          return;
+        }
+        coordinate.pageX = originalEvent.pageX;
+        coordinate.pageY = originalEvent.pageY;
+        let distance;
+        if (props.orientation === "vertical") {
+          distance = coordinate.pageY - coordinate.originalY;
+        } else {
+          distance = coordinate.pageX - coordinate.originalX;
+        }
+        store.setSize(initState, distance);
+      },
+      onReleaseEvent: function({
+        originalEvent
+      }) {
+        originalEvent.stopPropagation();
+        if (!store || !props || props.index === void 0) {
+          return;
+        }
+        if (!store.isResizable(props.index)) {
+          return;
+        }
+        coordinate.pageX = originalEvent.pageX;
+        coordinate.pageY = originalEvent.pageY;
+        let distance;
+        if (props.orientation === "vertical") {
+          distance = coordinate.pageY - coordinate.originalY;
+        } else {
+          distance = coordinate.pageX - coordinate.originalX;
+        }
+        store.setSize(initState, distance);
+      }
+    };
     onMounted(() => {
       initialCollapseStatus();
     });
     const renderCollapsedTip = () => {
       var _a, _b, _c, _d;
+      if (!props || props.index === void 0) {
+        return t("collapse");
+      }
       const {
         pane,
         nearPane
       } = queryPanes(props.index, props.index + 1);
       const isCollapsed = ((_b = (_a = pane == null ? void 0 : pane.component) == null ? void 0 : _a.props) == null ? void 0 : _b.collapsed) || ((_d = (_c = nearPane == null ? void 0 : nearPane.component) == null ? void 0 : _c.props) == null ? void 0 : _d.collapsed);
-      return isCollapsed ? "\u5C55\u5F00" : "\u6536\u8D77";
+      return isCollapsed ? t("expand") : t("collapse");
     };
     return () => {
       return withDirectives(createVNode("div", {
@@ -6131,9 +6234,7 @@ var DSplitterBar = defineComponent({
             handleCollapsePrePane();
           }
         }, null)]
-      }), createVNode("div", {
-        "class": "devui-resize-handle"
-      }, null), props.showCollapseButton && createVNode(DToolTip, {
+      }), props.showCollapseButton && createVNode(DToolTip, {
         "content": renderCollapsedTip()
       }, {
         default: () => [createVNode("div", {
@@ -6254,6 +6355,24 @@ class SplitterStore {
     }
   }
 }
+const splitterProps = {
+  orientation: {
+    type: String,
+    default: "horizontal"
+  },
+  splitBarSize: {
+    type: String,
+    default: "2px"
+  },
+  disabledBarSize: {
+    type: String,
+    default: "1px"
+  },
+  showCollapseButton: {
+    type: Boolean,
+    default: true
+  }
+};
 var splitter = "";
 var Splitter = defineComponent({
   name: "DSplitter",
@@ -6268,6 +6387,7 @@ var Splitter = defineComponent({
     const state = reactive({
       panes: []
     });
+    const ns2 = useNamespace("splitter");
     state.panes = ((_b = (_a = ctx.slots).DSplitterPane) == null ? void 0 : _b.call(_a)) || [];
     store.setPanes({
       panes: state.panes
@@ -6295,7 +6415,9 @@ var Splitter = defineComponent({
         return;
       }
       refreshSplitterContainerSize();
-      observer.observe(domRef.value);
+      if (domRef.value) {
+        observer.observe(domRef.value);
+      }
     });
     onUnmounted(() => {
       observer.disconnect();
@@ -6306,7 +6428,7 @@ var Splitter = defineComponent({
         orientation,
         showCollapseButton
       } = props;
-      const wrapperClass = ["devui-splitter", `devui-splitter-${orientation}`];
+      const wrapperClass = [ns2.b(), ns2.m(orientation)];
       return createVNode("div", {
         "class": wrapperClass,
         "ref": domRef
@@ -6370,6 +6492,7 @@ var SplitterPane = defineComponent({
     const store = inject("splitterStore");
     const domRef = ref();
     const orderRef = ref();
+    const ns2 = useNamespace("splitter");
     watch([orderRef, domRef], ([order, ele]) => {
       if (!ele) {
         return;
@@ -6383,7 +6506,7 @@ var SplitterPane = defineComponent({
         return;
       }
       ele.style.flexBasis = curSize;
-      const paneFixedClass = "devui-splitter-pane-fixed";
+      const paneFixedClass = ns2.em("pane", "fixed");
       if (curSize) {
         addClass(ele, paneFixedClass);
       } else {
@@ -6391,27 +6514,35 @@ var SplitterPane = defineComponent({
       }
     };
     watch([() => props.size, domRef], ([size, ele]) => {
-      setSizeStyle(size, ele);
+      if (size && ele) {
+        setSizeStyle(size, ele);
+      }
     }, {
       immediate: true
     });
     const orientation = inject("orientation");
     let initialSize = "";
     onMounted(() => {
-      initialSize = props.size;
-      store.setPanes({
-        panes: store.state.panes
-      });
+      if (props.size) {
+        initialSize = props.size;
+      }
+      if (store) {
+        store.setPanes({
+          panes: store.state.panes
+        });
+      }
     });
     onUpdated(() => {
-      store.setPanes({
-        panes: store.state.panes
-      });
+      if (store) {
+        store.setPanes({
+          panes: store.state.panes
+        });
+      }
     });
     const getPaneSize = () => {
       const ele = domRef.value;
       if (!ele) {
-        return;
+        return 0;
       }
       if (orientation === "vertical") {
         return ele.offsetHeight;
@@ -6423,7 +6554,7 @@ var SplitterPane = defineComponent({
       if (!ele) {
         return;
       }
-      const paneHiddenClass = "devui-splitter-pane-hidden";
+      const paneHiddenClass = ns2.em("pane", "hidden");
       if (!collapsed) {
         removeClass(ele, paneHiddenClass);
       } else {
@@ -6447,7 +6578,7 @@ var SplitterPane = defineComponent({
       if (!(ele instanceof HTMLElement)) {
         return;
       }
-      const flexGrowClass = "devui-splitter-pane-grow";
+      const flexGrowClass = ns2.em("pane", "grow");
       if (hasClass(ele, flexGrowClass)) {
         removeClass(ele, flexGrowClass);
       } else if (collapsed) {
@@ -6462,22 +6593,19 @@ var SplitterPane = defineComponent({
     return () => {
       var _a;
       return createVNode("div", {
-        "class": "devui-splitter-pane",
+        "class": ns2.e("pane"),
         "ref": domRef
       }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
     };
   }
 });
-Splitter.install = function(app) {
-  app.component(Splitter.name, Splitter);
-  app.component(SplitterPane.name, SplitterPane);
-};
 var index = {
   title: "Splitter \u5206\u5272\u5668",
   category: "\u5E03\u5C40",
   status: "100%",
   install(app) {
-    app.use(Splitter);
+    app.component(Splitter.name, Splitter);
+    app.component(SplitterPane.name, SplitterPane);
   }
 };
-export { Splitter, index as default };
+export { Splitter, index as default, splitterProps };