fix(nodes): Parenthesis in handleId computed
This commit is contained in:
@@ -13,14 +13,32 @@ const props = withDefaults(defineProps<HandleProps>(), {
|
|||||||
|
|
||||||
const nodeId = inject(NodeId, '')
|
const nodeId = inject(NodeId, '')
|
||||||
|
|
||||||
const handleId = computed(() =>
|
const handleId = computed(
|
||||||
props.id ?? connectionMode.value === ConnectionMode.Strict ? null : `${nodeId}__handle-${props.position}`,
|
() => props.id ?? (connectionMode.value === ConnectionMode.Strict ? null : `${nodeId}__handle-${props.position}`),
|
||||||
)
|
)
|
||||||
|
|
||||||
const { onMouseDown, onClick } = useHandle()
|
const { onMouseDown, onClick } = useHandle()
|
||||||
const onMouseDownHandler = (event: MouseEvent) =>
|
const onMouseDownHandler = (event: MouseEvent) =>
|
||||||
onMouseDown(event, handleId.value, nodeId, props.type === 'target', props.isValidConnection, undefined)
|
onMouseDown(event, handleId.value, nodeId, props.type === 'target', props.isValidConnection, undefined)
|
||||||
const onClickHandler = (event: MouseEvent) => onClick(event, handleId.value ?? null, nodeId, props.type, props.isValidConnection)
|
const onClickHandler = (event: MouseEvent) => onClick(event, handleId.value ?? null, nodeId, props.type, props.isValidConnection)
|
||||||
|
|
||||||
|
const getClasses = computed(() => {
|
||||||
|
return [
|
||||||
|
'vue-flow__handle',
|
||||||
|
`vue-flow__handle-${props.position}`,
|
||||||
|
`vue-flow__handle-${handleId.value}`,
|
||||||
|
'nodrag',
|
||||||
|
{
|
||||||
|
source: props.type !== 'target',
|
||||||
|
target: props.type === 'target',
|
||||||
|
connectable: props.connectable,
|
||||||
|
connecting:
|
||||||
|
connectionStartHandle.value?.nodeId === nodeId &&
|
||||||
|
connectionStartHandle.value?.handleId === handleId.value &&
|
||||||
|
connectionStartHandle.value?.type === props.type,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
export default {
|
export default {
|
||||||
@@ -32,21 +50,7 @@ export default {
|
|||||||
:data-handleid="handleId"
|
:data-handleid="handleId"
|
||||||
:data-nodeid="nodeId"
|
:data-nodeid="nodeId"
|
||||||
:data-handlepos="props.position"
|
:data-handlepos="props.position"
|
||||||
:class="[
|
:class="getClasses"
|
||||||
'vue-flow__handle',
|
|
||||||
`vue-flow__handle-${props.position}`,
|
|
||||||
`vue-flow__handle-${handleId}`,
|
|
||||||
'nodrag',
|
|
||||||
{
|
|
||||||
source: props.type !== 'target',
|
|
||||||
target: props.type === 'target',
|
|
||||||
connectable: props.connectable,
|
|
||||||
connecting:
|
|
||||||
connectionStartHandle?.nodeId === nodeId &&
|
|
||||||
connectionStartHandle?.handleId === handleId &&
|
|
||||||
connectionStartHandle?.type === props.type,
|
|
||||||
},
|
|
||||||
]"
|
|
||||||
@mousedown="onMouseDownHandler"
|
@mousedown="onMouseDownHandler"
|
||||||
@click="onClickHandler"
|
@click="onClickHandler"
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in New Issue
Block a user