vue-devui 1.0.0 → 1.1.0

package/tree/index.es.js

@@ -29,7 +29,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import { ref, onUnmounted, computed, reactive, createVNode, defineComponent, toRefs, inject, getCurrentInstance, watch, provide, Transition, mergeProps, unref, nextTick, Comment, Text, h, Fragment, withDirectives, cloneVNode, onMounted, Teleport, withModifiers, createTextVNode, onBeforeUnmount, toRef, renderSlot, useSlots, resolveComponent, isVNode, onUpdated, shallowRef, toRaw, watchEffect } from "vue";
+import { ref, onUnmounted, computed, reactive, createVNode, defineComponent, toRefs, inject, getCurrentInstance, watch, provide, Transition, mergeProps, unref, nextTick, withModifiers, Comment, Text, h, Fragment, withDirectives, cloneVNode, onMounted, Teleport, createTextVNode, onBeforeUnmount, toRef, renderSlot, useSlots, resolveComponent, isVNode, onUpdated, shallowRef, toRaw, watchEffect, TransitionGroup } from "vue";
 import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
 const USE_TREE_TOKEN = "use-tree-token";
 const TREE_INSTANCE = "tree-instance";
@@ -1618,7 +1618,7 @@ function useOperate() {
         parentId: parentNode.id,
         isLeaf: true,
         parentChildNodeCount: children.length + 1,
-        currentIndex: (lastChild == null ? void 0 : lastChild.currentIndex) + 1
+        currentIndex: lastChild && typeof lastChild.currentIndex === "number" ? lastChild.currentIndex + 1 : 0
       }));
       if (currentNode.value.id === void 0) {
         currentNode.value.id = randomId();
@@ -7467,7 +7467,8 @@ function deepAssign(...objects) {
 var zhCN = {
   pagination: {
     totalItemText: "\u6240\u6709\u6761\u76EE",
-    goToText: "\u8DF3\u81F3"
+    goToText: "\u8DF3\u81F3",
+    perPage: "\u6761/\u9875"
   },
   accordion: {
     loading: "\u52A0\u8F7D\u4E2D",
@@ -8029,6 +8030,10 @@ const flexibleOverlayProps = {
   isArrowCenter: {
     type: Boolean,
     default: true
+  },
+  clickEventBubble: {
+    type: Boolean,
+    default: false
   }
 };
 function getScrollParent(element) {
@@ -8143,6 +8148,9 @@ const FlexibleOverlay = defineComponent({
     expose
   }) {
     const ns2 = useNamespace("flexible-overlay");
+    const {
+      clickEventBubble
+    } = toRefs(props);
     const {
       arrowRef,
       overlayRef,
@@ -8156,7 +8164,10 @@ const FlexibleOverlay = defineComponent({
       return props.modelValue && createVNode("div", mergeProps({
         "ref": overlayRef,
         "class": ns2.b()
-      }, attrs), [(_a = slots.default) == null ? void 0 : _a.call(slots), props.showArrow && createVNode("div", {
+      }, attrs, {
+        "onClick": withModifiers(() => ({}), [clickEventBubble.value ? "" : "stop"]),
+        "onPointerup": withModifiers(() => ({}), ["stop"])
+      }), [(_a = slots.default) == null ? void 0 : _a.call(slots), props.showArrow && createVNode("div", {
         "ref": arrowRef,
         "class": ns2.e("arrow")
       }, null)]);
@@ -8274,7 +8285,7 @@ const TransformOriginMap = {
 function usePopover(props, visible, placement, origin, popoverRef) {
   const { trigger, isOpen } = toRefs(props);
   const overlayStyles = computed(() => ({
-    zIndex: 1060,
+    zIndex: "var(--devui-z-index-pop-up, 1060)",
     transformOrigin: TransformOriginMap[placement.value]
   }));
   const onDocumentClick = (e) => {
@@ -8517,8 +8528,6 @@ var Popover = defineComponent({
           "style": overlayStyles.value
         }, attrs, {
           "onPositionChange": handlePositionChange,
-          "onClick": withModifiers(() => ({}), ["stop"]),
-          "onPointerup": withModifiers(() => ({}), ["stop"]),
           "onMouseenter": onMouseenter,
           "onMouseleave": onMouseleave
         }), {
@@ -8717,9 +8726,7 @@ var FormControl = defineComponent({
     }, {
       default: () => {
         var _a, _b;
-        return [createVNode("div", {
-          "class": ns2.e("control-content")
-        }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]), createTextVNode(",")];
+        return [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)];
       }
     }), showFeedback.value && createVNode("span", {
       "class": [ns2.e("feedback-icon"), ns2.em("feedback-icon", feedbackStatus.value)]
@@ -10261,12 +10268,11 @@ defineComponent({
         }
       };
       return createVNode("div", {
-        "class": ns2.e("group")
-      }, [createVNode("div", {
-        "class": {
-          [ns2.m("list-inline")]: props.direction === "row"
-        }
-      }, [getContent()])]);
+        "class": [ns2.e("group"), {
+          "is-row": props.direction === "row",
+          "is-column": props.direction === "column"
+        }]
+      }, [getContent()]);
     };
   }
 });
@@ -10494,6 +10500,7 @@ var DTreeNode = defineComponent({
     };
   }
 });
+const DEFAULT_ITEM_HEIGHT = 20;
 const virtualListProps = {
   data: {
     type: Array,
@@ -10509,7 +10516,7 @@ const virtualListProps = {
   },
   itemHeight: {
     type: Number,
-    default: 0
+    default: DEFAULT_ITEM_HEIGHT
   },
   virtual: {
     type: Boolean,
@@ -10568,19 +10575,17 @@ const resizeObserverProps = {
   }
 };
 function useVirtual(props) {
+  const {
+    height,
+    data,
+    itemHeight,
+    virtual
+  } = toRefs(props);
   const isVirtual = computed(() => {
-    const {
-      height,
-      virtual
-    } = props;
-    return !!(virtual !== false && height);
+    return Boolean(virtual.value !== false && height.value);
   });
   const inVirtual = computed(() => {
-    const {
-      height,
-      data
-    } = props;
-    return isVirtual.value && data && 20 * data.length > height;
+    return Boolean(isVirtual.value && data.value.length && itemHeight.value * data.value.length > height.value);
   });
   return {
     isVirtual,
@@ -10911,7 +10916,6 @@ var ResizeObserverContainer = defineComponent({
         };
         innerStyle.value = __spreadProps(__spreadValues({}, innerStyle.value), {
           transform: `translateY(${offset2.value}px)`,
-          position: "absolute",
           left: 0,
           right: 0,
           top: 0
@@ -11178,7 +11182,6 @@ const ScrollStyle = {
   overflowY: "auto",
   overflowAnchor: "none"
 };
-const DEFAULT_HEIGHT = 20;
 var VirtualList = defineComponent({
   name: "DVirtualList",
   props: virtualListProps,
@@ -11287,7 +11290,7 @@ var VirtualList = defineComponent({
           cacheHeight = heights.get(key);
         }
         if (cacheHeight === void 0) {
-          cacheHeight = props.itemHeight || DEFAULT_HEIGHT;
+          cacheHeight = props.itemHeight || DEFAULT_ITEM_HEIGHT;
         }
         const currentItemBottom = itemTop + cacheHeight;
         if (startIndex === void 0 && currentItemBottom >= scrollTop) {
@@ -11423,7 +11426,7 @@ var VirtualList = defineComponent({
     });
     ctx.expose({
       scrollTo(index2) {
-        syncScrollTop(index2 * (props.itemHeight || DEFAULT_HEIGHT));
+        syncScrollTop(index2 * (props.itemHeight || DEFAULT_ITEM_HEIGHT));
       }
     });
     return () => {
@@ -11519,7 +11522,8 @@ var Tree = defineComponent({
       "data": treeNode,
       "check": check.value,
       "dragdrop": dragdrop.value,
-      "operate": operate.value
+      "operate": operate.value,
+      "key": treeNode.id
     }, {
       default: () => slots.content ? renderSlot(useSlots(), "content", {
         nodeData: treeNode
@@ -11537,11 +11541,9 @@ var Tree = defineComponent({
       }) : createVNode(DTreeNodeLoading, null, null)
     });
     return () => {
-      const Component = props.height ? VirtualList : "div";
       const treeData = getExpendedTree == null ? void 0 : getExpendedTree().value;
       const vSlotsProps = {
-        default: () => treeData == null ? void 0 : treeData.map(renderDTreeNode),
-        item: props.height && ((treeNode) => renderDTreeNode(treeNode))
+        item: (treeNode) => renderDTreeNode(treeNode)
       };
       let virtualListProps2 = {};
       if (props.height) {
@@ -11551,10 +11553,17 @@ var Tree = defineComponent({
           itemHeight: NODE_HEIGHT
         };
       }
-      return createVNode(Component, mergeProps({
-        "ref": props.height ? virtualListRef : normalRef,
+      return props.height ? createVNode(VirtualList, mergeProps({
+        "ref": virtualListRef,
+        "class": ns2.b()
+      }, virtualListProps2), vSlotsProps) : createVNode("div", {
+        "ref": normalRef,
         "class": ns2.b()
-      }, virtualListProps2), vSlotsProps);
+      }, [createVNode(TransitionGroup, {
+        "name": ns2.m("list")
+      }, {
+        default: () => [treeData == null ? void 0 : treeData.map(renderDTreeNode)]
+      })]);
     };
   }
 });