Tree Component Props: Draggable, Droppable not reactive

[el-j]

Describe the bug

The Draggable and Droppable feature in the tree does not allow reactive change when the props draggable and droppable are false on initial render.

The Standard dnd example from primevue docs for dnd in the tree, loaded in stackbitz has exactly the same behavoir.

Pull Request Link

No response

Reason for not contributing a PR

• [ ] Lack of time
• [x] Unsure how to implement the fix/feature
• [ ] Difficulty understanding the codebase
• [ ] Other

Other Reason

No response

Reproducer

https://stackblitz.com/edit/rjp3mn8y?file=src%2FApp.vue

Environment

mac m3, vue3, vite 6, tailwindcss

i am bundling the tree with a context menu to make it nicer for reuse in our app.

Vue version

^3.5.13

PrimeVue version

^4.3.5

Node version

20.11.1

Browser(s)

No response

Steps to reproduce the behavior

• [ ] import Tree component
• [ ] add some data (like the example)
• [ ] attach a boolean ref to tree.prop.draggable defaults to false ref(false)
• [ ] attach a boolean ref to tree.prop.droppable defaults to false ref(false)
• [ ] toggle the boolean ref's to true while tree is in view
• [ ] tree-nodes never can be dnd'd

Expected behavior

Draggable and Droppable are reactive, boolean's. no matter how both are initially set.

a workaround is to load the tree with both props set to "true" initially. then in onMounted, nextTick, set it to the real prop/ref u want to use.

const draggableNodesState = ref(true)
const droppableNodesState = ref(true)

onMounted(async () => {
	await nextTick()
	draggableNodesState.value = props.value.draggableNodes ?? false
	droppableNodesState.value = props.value.droppableNodes ?? false
})

watch(
	() => props.value.draggableNodes,
	(newVal) => {
		draggableNodesState.value = newVal
	}
)

watch(
	() => props.value.droppableNodes,
	(newVal) => {
		droppableNodesState.value = newVal
	}
)