fix changing handle sides

This commit is contained in:
peterkogo
2025-04-29 18:46:45 +02:00
parent 6e88192970
commit 86211fa753
2 changed files with 20 additions and 8 deletions

View File

@@ -14,7 +14,8 @@
ConnectionMode,
ControlButton,
type FitViewOptions,
useSvelteFlow
useSvelteFlow,
Position
} from '@xyflow/svelte';
import CustomNode from './CustomNode.svelte';
@@ -229,6 +230,15 @@
<button onclick={moveNode}>update node pos</button>
<button onclick={changeEdgeType}>update edge type</button>
<button onclick={hideUnhide}>hide/unhide</button>
<button
onclick={() => {
nodes = nodes.map((node) => ({
...node,
sourcePosition: Position.Right,
targetPosition: Position.Left
}));
}}>left-right</button
>
</Panel>
<InitTracker />

View File

@@ -78,9 +78,12 @@
let nodeRef: HTMLDivElement | null = $state(null);
let prevNodeRef: HTMLDivElement | null = null;
let prevType: string | undefined;
let prevSourcePosition: Position | undefined;
let prevTargetPosition: Position | undefined;
// svelte-ignore state_referenced_locally
let prevType: string | undefined = type;
// svelte-ignore state_referenced_locally
let prevSourcePosition: Position | undefined = sourcePosition;
// svelte-ignore state_referenced_locally
let prevTargetPosition: Position | undefined = targetPosition;
let NodeComponent = $derived(store.nodeTypes[type] ?? DefaultNode);
@@ -116,9 +119,9 @@
// if type, sourcePosition or targetPosition changes,
// we need to re-calculate the handle positions
const doUpdate =
(prevType && type !== prevType) ||
(prevSourcePosition && sourcePosition !== prevSourcePosition) ||
(prevTargetPosition && targetPosition !== prevTargetPosition);
type !== prevType ||
sourcePosition !== prevSourcePosition ||
targetPosition !== prevTargetPosition;
if (doUpdate && nodeRef !== null) {
requestAnimationFrame(() => {
@@ -144,7 +147,6 @@
prevTargetPosition = targetPosition;
});
// TODO: extract this part!
$effect(() => {
/* eslint-disable @typescript-eslint/no-unused-expressions */
if (resizeObserver && (!initialized || nodeRef !== prevNodeRef)) {