bkui-vue 0.0.1-beta.221 → 0.0.1-beta.223

package/dist/index.esm.js

@@ -27158,6 +27158,10 @@ var EVENTS = /* @__PURE__ */ ((EVENTS2) => {
   EVENTS2["NODE_COLLAPSE"] = "nodeCollapse";
   EVENTS2["NODE_EXPAND"] = "nodeExpand";
   EVENTS2["NODE_CHECKED"] = "nodeChecked";
+  EVENTS2["NODE_DRAG_START"] = "nodeDragStart";
+  EVENTS2["NODE_DRAG_OVER"] = "nodeDragOver";
+  EVENTS2["NODE_DRAG_LEAVE"] = "nodeDragLeave";
+  EVENTS2["NODE_DROP"] = "nodeDrop";
   return EVENTS2;
 })(EVENTS || {});
 const EMPTY = (..._args) => true;
@@ -27165,7 +27169,11 @@ const TreeEmitEventsType = {
   ["nodeClick"]: EMPTY,
   ["nodeCollapse"]: EMPTY,
   ["nodeExpand"]: EMPTY,
-  ["nodeChecked"]: EMPTY
+  ["nodeChecked"]: EMPTY,
+  ["nodeDragStart"]: EMPTY,
+  ["nodeDragOver"]: EMPTY,
+  ["nodeDragLeave"]: EMPTY,
+  ["nodeDrop"]: EMPTY
 };
 var NODE_ATTRIBUTES = /* @__PURE__ */ ((NODE_ATTRIBUTES2) => {
   NODE_ATTRIBUTES2["DEPTH"] = "__depth";
@@ -27242,10 +27250,11 @@ const treeProps = {
   ]).def(void 0),
   emptyText: PropTypes.string.def("\u6CA1\u6709\u6570\u636E"),
   draggable: PropTypes.bool.def(false),
-  disableDrag: Function,
-  disableDrop: Function,
+  disableDrag: PropTypes.func.def(null),
+  disableDrop: PropTypes.func.def(null),
   dragSort: PropTypes.bool.def(false),
-  selectable: PropTypes.bool.def(true),
+  selectable: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]).def(null),
+  disabledFolderSelectable: PropTypes.bool.def(false),
   showCheckbox: PropTypes.bool.def(false),
   showNodeTypeIcon: PropTypes.bool.def(true),
   selected: PropTypes.oneOfType([PropTypes.string, null, PropTypes.number, PropTypes.object]).def(null),
@@ -27440,6 +27449,8 @@ const getNodeRowClass = (item, schema) => {
   return {
     "is-checked": __is_checked,
     "is-selected": __is_selected,
+    "node-folder": item.is_folder,
+    "node-leaf": item.is_leaf,
     [resolveClassName("node-row")]: true
   };
 };
@@ -27742,32 +27753,32 @@ var useNodeAction = (props2, ctx, flatData, _renderData, schemaValues, initOptio
     if (resolvedItem[NODE_ATTRIBUTES.IS_NULL]) {
       return;
     }
-    if (props2.selectable) {
-      if (selectedNodeId !== null && selectedNodeId !== void 0) {
-        setNodeAttr({
-          [NODE_ATTRIBUTES.UUID]: selectedNodeId
-        }, NODE_ATTRIBUTES.IS_SELECTED, !selected);
-      }
-      if (props2.selected && props2.selected !== selectedNodeId) {
-        setNodeAttr({
-          [NODE_ATTRIBUTES.UUID]: props2.selected
-        }, NODE_ATTRIBUTES.IS_SELECTED, !selected);
-      }
-      setNodeAttr(resolvedItem, NODE_ATTRIBUTES.IS_SELECTED, selected);
-      selectedNodeId = getNodeId(resolvedItem);
-      if (autoOpen && nodeList2.length === 1) {
-        setOpen(resolvedItem, true, true);
-      }
-      if (getNodeAttr2(resolvedItem, NODE_ATTRIBUTES.IS_ASYNC)) {
-        asyncNodeClick(resolvedItem).then(() => {
-          nextTick(() => {
-            nodeList2.shift();
-            setSelect(nodeList2, selected, autoOpen);
-          });
-        });
-      }
-    } else {
+    if (!props2.selectable || typeof props2.selectable === "function" && !props2.selectable(uuid2) || props2.disabledFolderSelectable && (uuid2 == null ? void 0 : uuid2.is_folder) === true) {
       console.warn("props.selectable is false or undefined, please set selectable with true");
+      return;
+    }
+    if (selectedNodeId !== null && selectedNodeId !== void 0) {
+      setNodeAttr({
+        [NODE_ATTRIBUTES.UUID]: selectedNodeId
+      }, NODE_ATTRIBUTES.IS_SELECTED, !selected);
+    }
+    if (props2.selected && props2.selected !== selectedNodeId) {
+      setNodeAttr({
+        [NODE_ATTRIBUTES.UUID]: props2.selected
+      }, NODE_ATTRIBUTES.IS_SELECTED, !selected);
+    }
+    setNodeAttr(resolvedItem, NODE_ATTRIBUTES.IS_SELECTED, selected);
+    selectedNodeId = getNodeId(resolvedItem);
+    if (autoOpen && nodeList2.length === 1) {
+      setOpen(resolvedItem, true, true);
+    }
+    if (getNodeAttr2(resolvedItem, NODE_ATTRIBUTES.IS_ASYNC)) {
+      asyncNodeClick(resolvedItem).then(() => {
+        nextTick(() => {
+          nodeList2.shift();
+          setSelect(nodeList2, selected, autoOpen);
+        });
+      });
     }
   };
   const handleNodeContentClick = (item, e) => {
@@ -27817,10 +27828,10 @@ var useNodeAction = (props2, ctx, flatData, _renderData, schemaValues, initOptio
       "class": getNodeItemClass(item, flatData.schema, props2),
       "style": getNodeItemStyle(item, props2, flatData),
       "onClick": (e) => handleNodeContentClick(item, e)
-    }, [createVNode("span", {
+    }, [createVNode("div", {
       "class": [resolveClassName("node-action")],
       "onClick": (e) => handleNodeActionClick(e, item)
-    }, [getActionIcon(item)]), createVNode("span", {
+    }, [getActionIcon(item)]), createVNode("div", {
       "class": resolveClassName("node-content")
     }, [[getCheckboxRender(item), getNodePrefixIcon(item)], createVNode("span", {
       "class": resolveClassName("node-text")
@@ -27837,7 +27848,7 @@ var useNodeAction = (props2, ctx, flatData, _renderData, schemaValues, initOptio
     setOpen
   };
 };
-var useNodeDrag = (props2, root, flatData) => {
+var useNodeDrag = (props2, ctx, root, flatData) => {
   const {
     getSourceNodeByUID,
     getNodeParentIdById,
@@ -27875,6 +27886,7 @@ var useNodeDrag = (props2, root, flatData) => {
     e.preventDefault();
     const targetNode = getTargetTreeNode(e);
     const data2 = getNodeByTargetTreeNode(targetNode);
+    ctx.emit(EVENTS.NODE_DRAG_OVER, e, targetNode, data2);
     if (isNeedCheckDroppable.value && (props2 == null ? void 0 : props2.disableDrop(data2))) {
       e.dataTransfer.effectAllowed = "move";
       e.dataTransfer.dropEffect = "none";
@@ -27894,6 +27906,7 @@ var useNodeDrag = (props2, root, flatData) => {
     const targetNode = getTargetTreeNode(e);
     e.dataTransfer.setData("text/plain", "");
     e.dataTransfer.setData("node-id", targetNode.getAttribute("data-tree-node"));
+    ctx.emit(EVENTS.NODE_DRAG_START, e, targetNode);
   };
   const handleTreeNodeDrop = (e) => {
     e.preventDefault();
@@ -27907,6 +27920,7 @@ var useNodeDrag = (props2, root, flatData) => {
     const sourceNodeId = e.dataTransfer.getData("node-id");
     const targetNodeId = targetNode.getAttribute("data-tree-node");
     Reflect.apply(props2.dragSort ? dragSortData : dragAsChildNode, globalThis, [sourceNodeId, targetNodeId]);
+    ctx.emit(EVENTS.NODE_DROP, e, targetNode, data2);
   };
   const isNodeSortable = (sourceId, targetId) => {
     const sourcePath = getNodePath({
@@ -27966,6 +27980,7 @@ var useNodeDrag = (props2, root, flatData) => {
     e.preventDefault();
     const targetNode = getTargetTreeNode(e);
     targetNode.classList.remove("bk-tree-drop-active", "bk-tree-drop-disabled");
+    ctx.emit(EVENTS.NODE_DRAG_LEAVE, e, targetNode);
   };
   onMounted(() => {
     if (props2.draggable && root.value) {
@@ -28373,7 +28388,7 @@ var Component$8 = defineComponent({
     const {
       renderEmpty
     } = useEmpty(props2, ctx);
-    useNodeDrag(props2, root, flatData);
+    useNodeDrag(props2, ctx, root, flatData);
     const renderTreeContent = (scopedData) => {
       if (scopedData.length) {
         return scopedData.map(renderTreeNode);