bkui-vue 0.0.1-beta.221 → 0.0.1-beta.223
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +33 -33
- package/dist/index.esm.js +48 -33
- package/dist/index.umd.js +32 -32
- package/lib/tree/constant.d.ts +9 -1
- package/lib/tree/index.d.ts +94 -17
- package/lib/tree/index.js +1 -1
- package/lib/tree/props.d.ts +14 -3
- package/lib/tree/tree.d.ts +40 -7
- package/lib/tree/use-node-drag.d.ts +1 -1
- package/lib/tree/util.d.ts +2 -0
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
@@ -27158,6 +27158,10 @@ var EVENTS = /* @__PURE__ */ ((EVENTS2) => {
|
|
27158
27158
|
EVENTS2["NODE_COLLAPSE"] = "nodeCollapse";
|
27159
27159
|
EVENTS2["NODE_EXPAND"] = "nodeExpand";
|
27160
27160
|
EVENTS2["NODE_CHECKED"] = "nodeChecked";
|
27161
|
+
EVENTS2["NODE_DRAG_START"] = "nodeDragStart";
|
27162
|
+
EVENTS2["NODE_DRAG_OVER"] = "nodeDragOver";
|
27163
|
+
EVENTS2["NODE_DRAG_LEAVE"] = "nodeDragLeave";
|
27164
|
+
EVENTS2["NODE_DROP"] = "nodeDrop";
|
27161
27165
|
return EVENTS2;
|
27162
27166
|
})(EVENTS || {});
|
27163
27167
|
const EMPTY = (..._args) => true;
|
@@ -27165,7 +27169,11 @@ const TreeEmitEventsType = {
|
|
27165
27169
|
["nodeClick"]: EMPTY,
|
27166
27170
|
["nodeCollapse"]: EMPTY,
|
27167
27171
|
["nodeExpand"]: EMPTY,
|
27168
|
-
["nodeChecked"]: EMPTY
|
27172
|
+
["nodeChecked"]: EMPTY,
|
27173
|
+
["nodeDragStart"]: EMPTY,
|
27174
|
+
["nodeDragOver"]: EMPTY,
|
27175
|
+
["nodeDragLeave"]: EMPTY,
|
27176
|
+
["nodeDrop"]: EMPTY
|
27169
27177
|
};
|
27170
27178
|
var NODE_ATTRIBUTES = /* @__PURE__ */ ((NODE_ATTRIBUTES2) => {
|
27171
27179
|
NODE_ATTRIBUTES2["DEPTH"] = "__depth";
|
@@ -27242,10 +27250,11 @@ const treeProps = {
|
|
27242
27250
|
]).def(void 0),
|
27243
27251
|
emptyText: PropTypes.string.def("\u6CA1\u6709\u6570\u636E"),
|
27244
27252
|
draggable: PropTypes.bool.def(false),
|
27245
|
-
disableDrag:
|
27246
|
-
disableDrop:
|
27253
|
+
disableDrag: PropTypes.func.def(null),
|
27254
|
+
disableDrop: PropTypes.func.def(null),
|
27247
27255
|
dragSort: PropTypes.bool.def(false),
|
27248
|
-
selectable: PropTypes.bool.def(
|
27256
|
+
selectable: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]).def(null),
|
27257
|
+
disabledFolderSelectable: PropTypes.bool.def(false),
|
27249
27258
|
showCheckbox: PropTypes.bool.def(false),
|
27250
27259
|
showNodeTypeIcon: PropTypes.bool.def(true),
|
27251
27260
|
selected: PropTypes.oneOfType([PropTypes.string, null, PropTypes.number, PropTypes.object]).def(null),
|
@@ -27440,6 +27449,8 @@ const getNodeRowClass = (item, schema) => {
|
|
27440
27449
|
return {
|
27441
27450
|
"is-checked": __is_checked,
|
27442
27451
|
"is-selected": __is_selected,
|
27452
|
+
"node-folder": item.is_folder,
|
27453
|
+
"node-leaf": item.is_leaf,
|
27443
27454
|
[resolveClassName("node-row")]: true
|
27444
27455
|
};
|
27445
27456
|
};
|
@@ -27742,32 +27753,32 @@ var useNodeAction = (props2, ctx, flatData, _renderData, schemaValues, initOptio
|
|
27742
27753
|
if (resolvedItem[NODE_ATTRIBUTES.IS_NULL]) {
|
27743
27754
|
return;
|
27744
27755
|
}
|
27745
|
-
if (props2.selectable) {
|
27746
|
-
if (selectedNodeId !== null && selectedNodeId !== void 0) {
|
27747
|
-
setNodeAttr({
|
27748
|
-
[NODE_ATTRIBUTES.UUID]: selectedNodeId
|
27749
|
-
}, NODE_ATTRIBUTES.IS_SELECTED, !selected);
|
27750
|
-
}
|
27751
|
-
if (props2.selected && props2.selected !== selectedNodeId) {
|
27752
|
-
setNodeAttr({
|
27753
|
-
[NODE_ATTRIBUTES.UUID]: props2.selected
|
27754
|
-
}, NODE_ATTRIBUTES.IS_SELECTED, !selected);
|
27755
|
-
}
|
27756
|
-
setNodeAttr(resolvedItem, NODE_ATTRIBUTES.IS_SELECTED, selected);
|
27757
|
-
selectedNodeId = getNodeId(resolvedItem);
|
27758
|
-
if (autoOpen && nodeList2.length === 1) {
|
27759
|
-
setOpen(resolvedItem, true, true);
|
27760
|
-
}
|
27761
|
-
if (getNodeAttr2(resolvedItem, NODE_ATTRIBUTES.IS_ASYNC)) {
|
27762
|
-
asyncNodeClick(resolvedItem).then(() => {
|
27763
|
-
nextTick(() => {
|
27764
|
-
nodeList2.shift();
|
27765
|
-
setSelect(nodeList2, selected, autoOpen);
|
27766
|
-
});
|
27767
|
-
});
|
27768
|
-
}
|
27769
|
-
} else {
|
27756
|
+
if (!props2.selectable || typeof props2.selectable === "function" && !props2.selectable(uuid2) || props2.disabledFolderSelectable && (uuid2 == null ? void 0 : uuid2.is_folder) === true) {
|
27770
27757
|
console.warn("props.selectable is false or undefined, please set selectable with true");
|
27758
|
+
return;
|
27759
|
+
}
|
27760
|
+
if (selectedNodeId !== null && selectedNodeId !== void 0) {
|
27761
|
+
setNodeAttr({
|
27762
|
+
[NODE_ATTRIBUTES.UUID]: selectedNodeId
|
27763
|
+
}, NODE_ATTRIBUTES.IS_SELECTED, !selected);
|
27764
|
+
}
|
27765
|
+
if (props2.selected && props2.selected !== selectedNodeId) {
|
27766
|
+
setNodeAttr({
|
27767
|
+
[NODE_ATTRIBUTES.UUID]: props2.selected
|
27768
|
+
}, NODE_ATTRIBUTES.IS_SELECTED, !selected);
|
27769
|
+
}
|
27770
|
+
setNodeAttr(resolvedItem, NODE_ATTRIBUTES.IS_SELECTED, selected);
|
27771
|
+
selectedNodeId = getNodeId(resolvedItem);
|
27772
|
+
if (autoOpen && nodeList2.length === 1) {
|
27773
|
+
setOpen(resolvedItem, true, true);
|
27774
|
+
}
|
27775
|
+
if (getNodeAttr2(resolvedItem, NODE_ATTRIBUTES.IS_ASYNC)) {
|
27776
|
+
asyncNodeClick(resolvedItem).then(() => {
|
27777
|
+
nextTick(() => {
|
27778
|
+
nodeList2.shift();
|
27779
|
+
setSelect(nodeList2, selected, autoOpen);
|
27780
|
+
});
|
27781
|
+
});
|
27771
27782
|
}
|
27772
27783
|
};
|
27773
27784
|
const handleNodeContentClick = (item, e) => {
|
@@ -27817,10 +27828,10 @@ var useNodeAction = (props2, ctx, flatData, _renderData, schemaValues, initOptio
|
|
27817
27828
|
"class": getNodeItemClass(item, flatData.schema, props2),
|
27818
27829
|
"style": getNodeItemStyle(item, props2, flatData),
|
27819
27830
|
"onClick": (e) => handleNodeContentClick(item, e)
|
27820
|
-
}, [createVNode("
|
27831
|
+
}, [createVNode("div", {
|
27821
27832
|
"class": [resolveClassName("node-action")],
|
27822
27833
|
"onClick": (e) => handleNodeActionClick(e, item)
|
27823
|
-
}, [getActionIcon(item)]), createVNode("
|
27834
|
+
}, [getActionIcon(item)]), createVNode("div", {
|
27824
27835
|
"class": resolveClassName("node-content")
|
27825
27836
|
}, [[getCheckboxRender(item), getNodePrefixIcon(item)], createVNode("span", {
|
27826
27837
|
"class": resolveClassName("node-text")
|
@@ -27837,7 +27848,7 @@ var useNodeAction = (props2, ctx, flatData, _renderData, schemaValues, initOptio
|
|
27837
27848
|
setOpen
|
27838
27849
|
};
|
27839
27850
|
};
|
27840
|
-
var useNodeDrag = (props2, root, flatData) => {
|
27851
|
+
var useNodeDrag = (props2, ctx, root, flatData) => {
|
27841
27852
|
const {
|
27842
27853
|
getSourceNodeByUID,
|
27843
27854
|
getNodeParentIdById,
|
@@ -27875,6 +27886,7 @@ var useNodeDrag = (props2, root, flatData) => {
|
|
27875
27886
|
e.preventDefault();
|
27876
27887
|
const targetNode = getTargetTreeNode(e);
|
27877
27888
|
const data2 = getNodeByTargetTreeNode(targetNode);
|
27889
|
+
ctx.emit(EVENTS.NODE_DRAG_OVER, e, targetNode, data2);
|
27878
27890
|
if (isNeedCheckDroppable.value && (props2 == null ? void 0 : props2.disableDrop(data2))) {
|
27879
27891
|
e.dataTransfer.effectAllowed = "move";
|
27880
27892
|
e.dataTransfer.dropEffect = "none";
|
@@ -27894,6 +27906,7 @@ var useNodeDrag = (props2, root, flatData) => {
|
|
27894
27906
|
const targetNode = getTargetTreeNode(e);
|
27895
27907
|
e.dataTransfer.setData("text/plain", "");
|
27896
27908
|
e.dataTransfer.setData("node-id", targetNode.getAttribute("data-tree-node"));
|
27909
|
+
ctx.emit(EVENTS.NODE_DRAG_START, e, targetNode);
|
27897
27910
|
};
|
27898
27911
|
const handleTreeNodeDrop = (e) => {
|
27899
27912
|
e.preventDefault();
|
@@ -27907,6 +27920,7 @@ var useNodeDrag = (props2, root, flatData) => {
|
|
27907
27920
|
const sourceNodeId = e.dataTransfer.getData("node-id");
|
27908
27921
|
const targetNodeId = targetNode.getAttribute("data-tree-node");
|
27909
27922
|
Reflect.apply(props2.dragSort ? dragSortData : dragAsChildNode, globalThis, [sourceNodeId, targetNodeId]);
|
27923
|
+
ctx.emit(EVENTS.NODE_DROP, e, targetNode, data2);
|
27910
27924
|
};
|
27911
27925
|
const isNodeSortable = (sourceId, targetId) => {
|
27912
27926
|
const sourcePath = getNodePath({
|
@@ -27966,6 +27980,7 @@ var useNodeDrag = (props2, root, flatData) => {
|
|
27966
27980
|
e.preventDefault();
|
27967
27981
|
const targetNode = getTargetTreeNode(e);
|
27968
27982
|
targetNode.classList.remove("bk-tree-drop-active", "bk-tree-drop-disabled");
|
27983
|
+
ctx.emit(EVENTS.NODE_DRAG_LEAVE, e, targetNode);
|
27969
27984
|
};
|
27970
27985
|
onMounted(() => {
|
27971
27986
|
if (props2.draggable && root.value) {
|
@@ -28373,7 +28388,7 @@ var Component$8 = defineComponent({
|
|
28373
28388
|
const {
|
28374
28389
|
renderEmpty
|
28375
28390
|
} = useEmpty(props2, ctx);
|
28376
|
-
useNodeDrag(props2, root, flatData);
|
28391
|
+
useNodeDrag(props2, ctx, root, flatData);
|
28377
28392
|
const renderTreeContent = (scopedData) => {
|
28378
28393
|
if (scopedData.length) {
|
28379
28394
|
return scopedData.map(renderTreeNode);
|