@splicetree/plugin-dnd 3.0.2 → 3.1.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @splicetree/plugin-dnd
 
+## 3.1.1
+
+### Patch Changes
+
+- Core/Adapter/Lazy-Load/DnD：稳定性修复与小幅改进
+  - DnD：为 `draggable/sortable/nestable` 增加函数/异步判定；在悬停与释放阶段严格校验并在不允许时隐藏 ghost；增加去抖与离开清理以消除偶发 ghost 闪烁
+  - Adapter-Vue：抽取数据同步工具；字段变更走 `updateOriginal` 合并，结构变更再 `syncData`
+  - Core：节点扩展应用于追加节点；补充若干示例与文档更新
+  - Lazy-Load：覆盖 `syncData`，在重建后恢复已加载子树与覆盖
+
+## 3.1.0
+
 ## 3.0.2
 
 ## 3.0.1

package/dist/index.d.ts

@@ -1,17 +1,32 @@
-import { SpliceTreePlugin } from "@splicetree/core";
+import { SpliceTreeNode as SpliceTreeNode$1, SpliceTreePlugin } from "@splicetree/core";
 
 //#region src/types.d.ts
-/** dnd types */
 interface DndNode {
   id: string;
   level: number;
   parentId?: string;
   root?: boolean;
 }
-interface DragBehavior {
-  draggable?: boolean;
-  sortable?: boolean;
-  nestable?: boolean;
+type BehaviorPredicate<T = unknown> = boolean | ((target: SpliceTreeNode$1<T>) => boolean | Promise<boolean>);
+interface DragBehavior<T = unknown> {
+  /**
+   * 控制是否允许作为拖拽源在当前目标上执行拖放
+   * - 布尔：true/false 全局允许或禁止
+   * - 函数：基于目标节点动态判断；可返回 Promise<boolean>
+   */
+  draggable?: BehaviorPredicate<T>;
+  /**
+   * 控制是否允许在目标节点的前后排序
+   * - 布尔：true/false 全局允许或禁止
+   * - 函数：基于目标节点动态判断；可返回 Promise<boolean>
+   */
+  sortable?: BehaviorPredicate<T>;
+  /**
+   * 控制能否作为子节点拖入
+   * - 布尔：true/false 全局允许或禁止
+   * - 函数：基于目标节点动态判断；可返回 Promise<boolean>
+   */
+  nestable?: BehaviorPredicate<T>;
 }
 declare enum DropPosition {
   BEFORE = -1,
@@ -36,13 +51,13 @@ declare module '@splicetree/core' {
   interface SpliceTreeConfiguration {
     dnd?: DndOptions;
   }
-  interface SpliceTreeEventPayloadMap {
+  interface SpliceTreeEventPayloadMap<T = unknown> {
     move: {
       index: number;
-      parent: SpliceTreeNode<any> | undefined;
+      parent: SpliceTreeNode<T> | undefined;
       oldIndex: number;
-      oldParent: SpliceTreeNode<any> | undefined;
-      node: SpliceTreeNode<any>;
+      oldParent: SpliceTreeNode<T> | undefined;
+      node: SpliceTreeNode<T>;
       event?: DragEvent | MouseEvent;
     };
   }

package/dist/index.js

@@ -43,6 +43,8 @@ const dnd = {
 		let containerHoverParentId;
 		let containerHoverPos;
 		let lastHoverTargetId;
+		let evalToken = 0;
+		let evaluating = false;
 		const refresh = () => ctx.events.emit({
 			name: "visibility",
 			keys: ctx.tree.expandedKeys()
@@ -109,12 +111,21 @@ const dnd = {
 		* @param el 目标节点元素
 		* @param e 拖拽/鼠标事件
 		*/
-		const onDragOver = (id, el, e) => {
+		const onDragOver = async (id, el, e) => {
 			if (!draggingId) return;
+			evalToken++;
+			const myToken = evalToken;
+			evaluating = true;
+			ghostPos = void 0;
+			ctx.events.emit({
+				name: "visibility",
+				keys: ctx.tree.expandedKeys()
+			});
 			const draggedIds = getDraggedNodeIds(draggingId);
 			const targetNode = ctx.tree.getNode(id);
 			if (draggedIds.includes(id)) {
 				hoverPositions.delete(id);
+				ghostPos = void 0;
 				ctx.events.emit({
 					name: "visibility",
 					keys: ctx.tree.expandedKeys()
@@ -125,6 +136,7 @@ const dnd = {
 			while (ancestor) {
 				if (draggedIds.includes(ancestor.id)) {
 					hoverPositions.delete(id);
+					ghostPos = void 0;
 					ctx.events.emit({
 						name: "visibility",
 						keys: ctx.tree.expandedKeys()
@@ -136,10 +148,12 @@ const dnd = {
 			const pos = computePosition(id, el, e, void 0);
 			if (!targetNode || pos === void 0) {
 				hoverPositions.delete(id);
+				ghostPos = void 0;
 				ctx.events.emit({
 					name: "visibility",
 					keys: ctx.tree.expandedKeys()
 				});
+				evaluating = false;
 				return;
 			}
 			if (pos === DropPosition.INSIDE) {
@@ -153,24 +167,83 @@ const dnd = {
 					});
 					return;
 				}
-				if (!draggedIds.every((dId) => {
-					return behaviors.get(dId)?.nestable !== false;
-				})) {
+				let allNestable = true;
+				for (const dId of draggedIds) {
+					const rule = behaviors.get(dId)?.nestable;
+					if (rule === false) {
+						allNestable = false;
+						break;
+					}
+					if (typeof rule === "function") try {
+						const ret = rule(targetNode);
+						if (!(ret instanceof Promise ? await ret : ret)) {
+							allNestable = false;
+							break;
+						}
+					} catch {
+						allNestable = false;
+						break;
+					}
+				}
+				if (!allNestable) {
 					hoverPositions.delete(id);
+					ghostPos = void 0;
 					ctx.events.emit({
 						name: "visibility",
 						keys: ctx.tree.expandedKeys()
 					});
+					evaluating = false;
 					return;
 				}
-			} else if (!draggedIds.every((dId) => {
-				return behaviors.get(dId)?.sortable !== false;
-			})) {
-				hoverPositions.delete(id);
-				ctx.events.emit({
-					name: "visibility",
-					keys: ctx.tree.expandedKeys()
-				});
+			} else {
+				let allSortable = true;
+				for (const dId of draggedIds) {
+					const ov = behaviors.get(dId);
+					const sRule = ov?.sortable;
+					if (typeof sRule === "boolean" && sRule === false) {
+						allSortable = false;
+						break;
+					}
+					if (typeof sRule === "function") try {
+						const ret = sRule(targetNode);
+						if (!(ret instanceof Promise ? await ret : ret)) {
+							allSortable = false;
+							break;
+						}
+					} catch {
+						allSortable = false;
+						break;
+					}
+					const dRuleRaw = ov?.draggable;
+					if (typeof dRuleRaw !== "function") {
+						if (dRuleRaw === false) {
+							allSortable = false;
+							break;
+						}
+					} else try {
+						const ret = dRuleRaw(targetNode);
+						if (!(ret instanceof Promise ? await ret : ret)) {
+							allSortable = false;
+							break;
+						}
+					} catch {
+						allSortable = false;
+						break;
+					}
+				}
+				if (!allSortable) {
+					hoverPositions.delete(id);
+					ghostPos = void 0;
+					ctx.events.emit({
+						name: "visibility",
+						keys: ctx.tree.expandedKeys()
+					});
+					evaluating = false;
+					return;
+				}
+			}
+			if (myToken !== evalToken || !draggingId) {
+				evaluating = false;
 				return;
 			}
 			hoverPositions.set(id, pos);
@@ -189,34 +262,18 @@ const dnd = {
 				ghostMarginLeft = 0;
 				ghostMarginRight = 0;
 			}
+			evaluating = false;
 			refresh();
 		};
 		/**
 		* 离开目标：清理该目标的悬停位置并刷新视图
 		* @param id 目标节点 id
 		*/
-		const onDragLeave = (id, e) => {
+		const onDragLeave = (id, _e) => {
 			if (!draggingId) return;
-			const el = e?.currentTarget ?? document.querySelector(`[data-id="${id}"]`);
-			if (!el) {
-				ctx.events.emit({
-					name: "visibility",
-					keys: ctx.tree.expandedKeys()
-				});
-				return;
-			}
-			const rect = el.getBoundingClientRect();
-			const cy = e?.clientY;
-			if (typeof cy === "number") {
-				if (cy < rect.top) {
-					hoverPositions.set(id, DropPosition.BEFORE);
-					setGhostByEl(el, DropPosition.BEFORE);
-				} else if (cy > rect.bottom) {
-					hoverPositions.set(id, DropPosition.AFTER);
-					setGhostByEl(el, DropPosition.AFTER);
-				}
-			}
-			lastHoverTargetId = id;
+			hoverPositions.delete(id);
+			if (lastHoverTargetId === id) lastHoverTargetId = void 0;
+			ghostPos = void 0;
 			refresh();
 		};
 		/**
@@ -227,15 +284,44 @@ const dnd = {
 		* @param targetId 目标节点 id
 		* @param position 落点位置
 		*/
-		const drop = (srcId, targetId, position, e) => {
+		const drop = async (srcId, targetId, position, e) => {
 			const src = ctx.tree.getNode(srcId);
 			const target = ctx.tree.getNode(targetId);
 			if (!src || !target) return;
 			if (readonly) return;
 			const ov = behaviors.get(src.id);
 			if (ov?.draggable === false) return;
-			if (position === DropPosition.INSIDE && ov?.nestable === false) return;
-			if (position !== DropPosition.INSIDE && ov?.sortable === false) return;
+			if (ov?.sortable === false) return;
+			if (position === DropPosition.INSIDE) {
+				const rule = ov?.nestable;
+				if (rule === false) return;
+				if (typeof rule === "function") try {
+					const ret = rule(target);
+					if (!(ret instanceof Promise ? await ret : ret)) return;
+				} catch {
+					return;
+				}
+			}
+			if (position !== DropPosition.INSIDE) {
+				const sRule = ov?.sortable;
+				if (typeof sRule !== "function") {
+					if (sRule === false) return;
+				} else try {
+					const ret = sRule(target);
+					if (!(ret instanceof Promise ? await ret : ret)) return;
+				} catch {
+					return;
+				}
+				const dRuleRaw = ov?.draggable;
+				if (typeof dRuleRaw !== "function") {
+					if (dRuleRaw === false) return;
+				} else try {
+					const ret = dRuleRaw(target);
+					if (!(ret instanceof Promise ? await ret : ret)) return;
+				} catch {
+					return;
+				}
+			}
 			if (srcId === targetId) return;
 			const srcParentId = src.getParent()?.id;
 			if (position === DropPosition.INSIDE && srcParentId === targetId) return;
@@ -445,6 +531,20 @@ const dnd = {
 				onDragover: (e) => {
 					if (!draggingId) return;
 					e.preventDefault();
+					const draggedIds = getDraggedNodeIds(draggingId);
+					for (const did of draggedIds) {
+						const ov = behaviors.get(did);
+						if (ov?.sortable === false || ov?.draggable === false) {
+							containerHoverParentId = void 0;
+							containerHoverPos = void 0;
+							ghostPos = void 0;
+							ctx.events.emit({
+								name: "visibility",
+								keys: ctx.tree.expandedKeys()
+							});
+							return;
+						}
+					}
 					const el = e.currentTarget;
 					const rect = el.getBoundingClientRect();
 					const y = ("clientY" in e ? e.clientY : 0) - rect.top;
@@ -479,9 +579,25 @@ const dnd = {
 						return;
 					}
 					const draggedIds = getDraggedNodeIds(draggingId);
+					for (const did of draggedIds) {
+						const ov = behaviors.get(did);
+						if (ov?.sortable === false || ov?.draggable === false) {
+							hoverPositions.clear();
+							draggingId = void 0;
+							containerHoverParentId = void 0;
+							containerHoverPos = void 0;
+							ghostPos = void 0;
+							ctx.events.emit({
+								name: "visibility",
+								keys: ctx.tree.expandedKeys()
+							});
+							return;
+						}
+					}
+					const draggedIds2 = getDraggedNodeIds(draggingId);
 					const parentId2 = containerHoverParentId;
 					const rawSiblings = parentId2 ? ctx.tree.getNode(parentId2).getChildren() : ctx.tree.items().filter((n) => !n.getParent());
-					const processIds = containerHoverPos === DropPosition.AFTER ? [...draggedIds].reverse() : draggedIds;
+					const processIds = containerHoverPos === DropPosition.AFTER ? [...draggedIds2].reverse() : draggedIds2;
 					for (const id of processIds) {
 						const siblings = rawSiblings.filter((n) => n.id !== id);
 						const firstId = siblings[0]?.id;
@@ -523,7 +639,23 @@ const dnd = {
 			};
 		};
 		const ghostStyle = (opts$1) => {
-			if (!draggingId || ghostPos === void 0) return { style: { display: "none" } };
+			if (evaluating || !draggingId || ghostPos === void 0) return { style: { display: "none" } };
+			try {
+				const draggedIds = getDraggedNodeIds(draggingId);
+				const targetId = lastHoverTargetId;
+				if (targetId ? ctx.tree.getNode(targetId) : void 0) if (ghostPos === DropPosition.INSIDE) {
+					for (const did of draggedIds) if (behaviors.get(did)?.nestable === false) return { style: { display: "none" } };
+				} else for (const did of draggedIds) {
+					const ov = behaviors.get(did);
+					if (ov?.sortable === false || ov?.draggable === false) return { style: { display: "none" } };
+				}
+				else for (const did of draggedIds) {
+					const ov = behaviors.get(did);
+					if (ov?.sortable === false || ov?.draggable === false) return { style: { display: "none" } };
+				}
+			} catch {
+				return { style: { display: "none" } };
+			}
 			const usePadding = opts$1?.padding ?? true;
 			const useMargin = opts$1?.margin ?? true;
 			const leftInset = usePadding ? ghostInsetLeft : 0;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@splicetree/plugin-dnd",
   "type": "module",
-  "version": "3.0.2",
+  "version": "3.1.1",
   "author": {
     "email": "michael.cocova@gmail.com",
     "name": "Michael Cocova"
@@ -23,7 +23,7 @@
     "access": "public"
   },
   "devDependencies": {
-    "@splicetree/core": "3.0.2"
+    "@splicetree/core": "3.1.1"
   },
   "scripts": {
     "dev": "tsdown --watch",

package/src/index.ts

@@ -8,13 +8,13 @@ declare module '@splicetree/core' {
   interface SpliceTreeConfiguration {
     dnd?: DndOptions
   }
-  interface SpliceTreeEventPayloadMap {
+  interface SpliceTreeEventPayloadMap<T = unknown> {
     move: {
       index: number
-      parent: SpliceTreeNode<any> | undefined
+      parent: SpliceTreeNode<T> | undefined
       oldIndex: number
-      oldParent: SpliceTreeNode<any> | undefined
-      node: SpliceTreeNode<any>
+      oldParent: SpliceTreeNode<T> | undefined
+      node: SpliceTreeNode<T>
       event?: DragEvent | MouseEvent
     }
   }
@@ -110,6 +110,8 @@ export const dnd: SpliceTreePlugin = {
     let containerHoverParentId: string | undefined
     let containerHoverPos: DropPosition | undefined
     let lastHoverTargetId: string | undefined
+    let evalToken = 0
+    let evaluating = false
     const refresh = () => ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
     const setGhostByEl = (el: HTMLElement, pos: DropPosition) => {
       ghostTop = el.offsetTop
@@ -193,11 +195,17 @@ export const dnd: SpliceTreePlugin = {
      * @param el 目标节点元素
      * @param e 拖拽/鼠标事件
      */
-    const onDragOver = (id: string, el: HTMLElement, e: DragEvent | MouseEvent) => {
+    const onDragOver = async (id: string, el: HTMLElement, e: DragEvent | MouseEvent) => {
       // 如果没有拖拽源，直接返回
       if (!draggingId) {
         return
       }
+      // 临时隐藏 ghost，直到当前目标判定通过，避免异步判定期间的闪烁
+      evalToken++
+      const myToken = evalToken
+      evaluating = true
+      ghostPos = undefined
+      ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
 
       const draggedIds = getDraggedNodeIds(draggingId)
       const targetNode = ctx.tree.getNode(id)
@@ -205,6 +213,7 @@ export const dnd: SpliceTreePlugin = {
       // 1. 目标节点不能是拖拽节点之一
       if (draggedIds.includes(id)) {
         hoverPositions.delete(id)
+        ghostPos = undefined
         ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
         return
       }
@@ -214,6 +223,7 @@ export const dnd: SpliceTreePlugin = {
       while (ancestor) {
         if (draggedIds.includes(ancestor.id)) {
           hoverPositions.delete(id)
+          ghostPos = undefined
           ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
           return
         }
@@ -225,7 +235,9 @@ export const dnd: SpliceTreePlugin = {
 
       if (!targetNode || pos === undefined) {
         hoverPositions.delete(id)
+        ghostPos = undefined
         ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
+        evaluating = false
         return
       }
 
@@ -243,27 +255,93 @@ export const dnd: SpliceTreePlugin = {
           return
         }
 
-        const allNestable = draggedIds.every((dId) => {
+        let allNestable = true
+        for (const dId of draggedIds) {
           const ov = behaviors.get(dId)
-          return ov?.nestable !== false
-        })
+          const rule = ov?.nestable
+          if (rule === false) {
+            allNestable = false
+            break
+          }
+          if (typeof rule === 'function') {
+            try {
+              const ret = rule(targetNode)
+              const ok = ret instanceof Promise ? await ret : ret
+              if (!ok) {
+                allNestable = false
+                break
+              }
+            } catch {
+              allNestable = false
+              break
+            }
+          }
+        }
         if (!allNestable) {
           hoverPositions.delete(id)
+          ghostPos = undefined
           ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
+          evaluating = false
           return
         }
       } else {
-        const allSortable = draggedIds.every((dId) => {
+        // BEFORE/AFTER：检查 sortable 与 draggable 的目标相关规则
+        let allSortable = true
+        for (const dId of draggedIds) {
           const ov = behaviors.get(dId)
-          return ov?.sortable !== false
-        })
+          const sRule = ov?.sortable
+          if (typeof sRule === 'boolean' && sRule === false) {
+            allSortable = false
+            break
+          }
+          if (typeof sRule === 'function') {
+            try {
+              const ret = sRule(targetNode!)
+              const ok = ret instanceof Promise ? await ret : ret
+              if (!ok) {
+                allSortable = false
+                break
+              }
+            } catch {
+              allSortable = false
+              break
+            }
+          }
+          const dRuleRaw = ov?.draggable
+          if (typeof dRuleRaw !== 'function') {
+            const dBool = dRuleRaw as boolean | undefined
+            if (dBool === false) {
+              allSortable = false
+              break
+            }
+          } else {
+            try {
+              const ret = dRuleRaw(targetNode!)
+              const ok = ret instanceof Promise ? await ret : ret
+              if (!ok) {
+                allSortable = false
+                break
+              }
+            } catch {
+              allSortable = false
+              break
+            }
+          }
+        }
         if (!allSortable) {
           hoverPositions.delete(id)
+          ghostPos = undefined
           ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
+          evaluating = false
           return
         }
       }
 
+      // 若期间目标已变化或被新的悬停替代，则忽略当前结果
+      if (myToken !== evalToken || !draggingId) {
+        evaluating = false
+        return
+      }
       hoverPositions.set(id, pos)
       setGhostByEl(el, pos)
       lastHoverTargetId = id
@@ -280,6 +358,7 @@ export const dnd: SpliceTreePlugin = {
         ghostMarginLeft = 0
         ghostMarginRight = 0
       }
+      evaluating = false
       refresh()
     }
 
@@ -287,32 +366,16 @@ export const dnd: SpliceTreePlugin = {
      * 离开目标：清理该目标的悬停位置并刷新视图
      * @param id 目标节点 id
      */
-    const onDragLeave = (id: string, e?: DragEvent) => {
+    const onDragLeave = (id: string, _e?: DragEvent) => {
       if (!draggingId) {
         return
       }
-      const el = (e?.currentTarget ?? document.querySelector(`[data-id="${id}"]`)) as HTMLElement | null
-      if (!el) {
-        // 无法定位元素时，保留最后一次悬停位置，避免外部释放丢失落点
-        ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
-        return
-      }
-      const rect = el.getBoundingClientRect()
-      const cy = e?.clientY
-      if (typeof cy === 'number') {
-        if (cy < rect.top) {
-          // 上外部：归并为 BEFORE
-          hoverPositions.set(id, DropPosition.BEFORE)
-          setGhostByEl(el, DropPosition.BEFORE)
-        } else if (cy > rect.bottom) {
-          // 下外部：归并为 AFTER
-          hoverPositions.set(id, DropPosition.AFTER)
-          setGhostByEl(el, DropPosition.AFTER)
-        } else {
-          // 水平离开或无法判断：保留原有位置，不删除
-        }
+      // 离开目标时直接清理该目标的悬停与 ghost，避免跨节点移动时的占位闪烁
+      hoverPositions.delete(id)
+      if (lastHoverTargetId === id) {
+        lastHoverTargetId = undefined as any
       }
-      lastHoverTargetId = id
+      ghostPos = undefined
       refresh()
     }
 
@@ -324,7 +387,7 @@ export const dnd: SpliceTreePlugin = {
      * @param targetId 目标节点 id
      * @param position 落点位置
      */
-    const drop = (srcId: string, targetId: string, position: DropPosition, e?: DragEvent | MouseEvent) => {
+    const drop = async (srcId: string, targetId: string, position: DropPosition, e?: DragEvent | MouseEvent) => {
       const src = ctx.tree.getNode(srcId)
       const target = ctx.tree.getNode(targetId)
       if (!src || !target) {
@@ -337,11 +400,62 @@ export const dnd: SpliceTreePlugin = {
       if (ov?.draggable === false) {
         return
       }
-      if (position === DropPosition.INSIDE && ov?.nestable === false) {
+      if (ov?.sortable === false) {
         return
       }
-      if (position !== DropPosition.INSIDE && ov?.sortable === false) {
-        return
+      if (position === DropPosition.INSIDE) {
+        const rule = ov?.nestable
+        if (rule === false) {
+          return
+        }
+        if (typeof rule === 'function') {
+          try {
+            const ret = rule(target)
+            const ok = ret instanceof Promise ? await ret : ret
+            if (!ok) {
+              return
+            }
+          } catch {
+            return
+          }
+        }
+      }
+      // BEFORE/AFTER：再次检查 sortable 与 draggable 的目标相关规则，防止误投放
+      if (position !== DropPosition.INSIDE) {
+        const sRule = ov?.sortable
+        if (typeof sRule !== 'function') {
+          const sBool = sRule as boolean | undefined
+          if (sBool === false) {
+            return
+          }
+        } else {
+          try {
+            const ret = sRule(target)
+            const ok = ret instanceof Promise ? await ret : ret
+            if (!ok) {
+              return
+            }
+          } catch {
+            return
+          }
+        }
+        const dRuleRaw = ov?.draggable
+        if (typeof dRuleRaw !== 'function') {
+          const dBool = dRuleRaw as boolean | undefined
+          if (dBool === false) {
+            return
+          }
+        } else {
+          try {
+            const ret = dRuleRaw(target)
+            const ok = ret instanceof Promise ? await ret : ret
+            if (!ok) {
+              return
+            }
+          } catch {
+            return
+          }
+        }
       }
       // 基础非法：不能拖到自身或其父
       if (srcId === targetId) {
@@ -554,6 +668,18 @@ export const dnd: SpliceTreePlugin = {
             return
           }
           e.preventDefault()
+          // 顶级容器处悬停：若有任何被拖节点声明了布尔 false 的 sortable/draggable，则不显示 ghost
+          const draggedIds = getDraggedNodeIds(draggingId)
+          for (const did of draggedIds) {
+            const ov = behaviors.get(did)
+            if (ov?.sortable === false || ov?.draggable === false) {
+              containerHoverParentId = undefined
+              containerHoverPos = undefined
+              ghostPos = undefined
+              ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
+              return
+            }
+          }
           const el = e.currentTarget as HTMLElement
           const rect = el.getBoundingClientRect()
           const y = ('clientY' in e ? e.clientY : 0) - rect.top
@@ -585,10 +711,24 @@ export const dnd: SpliceTreePlugin = {
             ghostPos = undefined
             return
           }
+          // 顶级释放：布尔 false 的 sortable/draggable 禁止投放
           const draggedIds = getDraggedNodeIds(draggingId)
+          for (const did of draggedIds) {
+            const ov = behaviors.get(did)
+            if (ov?.sortable === false || ov?.draggable === false) {
+              hoverPositions.clear()
+              draggingId = undefined
+              containerHoverParentId = undefined
+              containerHoverPos = undefined
+              ghostPos = undefined
+              ctx.events.emit({ name: 'visibility', keys: ctx.tree.expandedKeys() })
+              return
+            }
+          }
+          const draggedIds2 = getDraggedNodeIds(draggingId)
           const parentId2 = containerHoverParentId
           const rawSiblings = parentId2 ? ctx.tree.getNode(parentId2)!.getChildren() : ctx.tree.items().filter(n => !n.getParent())
-          const processIds = containerHoverPos === DropPosition.AFTER ? [...draggedIds].reverse() : draggedIds
+          const processIds = containerHoverPos === DropPosition.AFTER ? [...draggedIds2].reverse() : draggedIds2
           for (const id of processIds) {
             const siblings = rawSiblings.filter(n => n.id !== id)
             const firstId = siblings[0]?.id
@@ -621,7 +761,41 @@ export const dnd: SpliceTreePlugin = {
     }
 
     const ghostStyle = (opts?: { padding?: boolean, margin?: boolean }) => {
-      if (!draggingId || ghostPos === undefined) {
+      // 当被拖拽节点在当前上下文被禁止（sortable/draggable/nestable 为 false）时，不显示 ghost
+      if (evaluating || !draggingId || ghostPos === undefined) {
+        return { style: { display: 'none' } }
+      }
+      try {
+        const draggedIds = getDraggedNodeIds(draggingId)
+        const targetId = lastHoverTargetId
+        const targetNode = targetId ? ctx.tree.getNode(targetId) : undefined
+        // Node 目标场景：根据落点类型进行规则校验（仅快速检查布尔 false；函数规则已在 onDragOver 中处理为不设置 ghostPos）
+        if (targetNode) {
+          if (ghostPos === DropPosition.INSIDE) {
+            for (const did of draggedIds) {
+              const ov = behaviors.get(did)
+              if (ov?.nestable === false) {
+                return { style: { display: 'none' } }
+              }
+            }
+          } else {
+            for (const did of draggedIds) {
+              const ov = behaviors.get(did)
+              if (ov?.sortable === false || ov?.draggable === false) {
+                return { style: { display: 'none' } }
+              }
+            }
+          }
+        } else {
+          // 容器场景：无目标节点，只对布尔 false 做拦截（函数规则需节点上下文）
+          for (const did of draggedIds) {
+            const ov = behaviors.get(did)
+            if (ov?.sortable === false || ov?.draggable === false) {
+              return { style: { display: 'none' } }
+            }
+          }
+        }
+      } catch {
         return { style: { display: 'none' } }
       }
       const usePadding = opts?.padding ?? true

package/src/types.ts

@@ -1,16 +1,35 @@
 /** dnd types */
 
+import type { SpliceTreeNode } from '@splicetree/core'
+
 export interface DndNode {
   id: string
   level: number
   parentId?: string
   root?: boolean
 }
-
-export interface DragBehavior {
-  draggable?: boolean
-  sortable?: boolean
-  nestable?: boolean
+export type BehaviorPredicate<T = unknown>
+  = | boolean
+    | ((target: SpliceTreeNode<T>) => boolean | Promise<boolean>)
+export interface DragBehavior<T = unknown> {
+  /**
+   * 控制是否允许作为拖拽源在当前目标上执行拖放
+   * - 布尔：true/false 全局允许或禁止
+   * - 函数：基于目标节点动态判断；可返回 Promise<boolean>
+   */
+  draggable?: BehaviorPredicate<T>
+  /**
+   * 控制是否允许在目标节点的前后排序
+   * - 布尔：true/false 全局允许或禁止
+   * - 函数：基于目标节点动态判断；可返回 Promise<boolean>
+   */
+  sortable?: BehaviorPredicate<T>
+  /**
+   * 控制能否作为子节点拖入
+   * - 布尔：true/false 全局允许或禁止
+   * - 函数：基于目标节点动态判断；可返回 Promise<boolean>
+   */
+  nestable?: BehaviorPredicate<T>
 }
 
 export enum DropPosition {