diff --git a/package.json b/package.json index fbafa6fd..9189f508 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,8 @@ "lint": "turbo lint --filter='./packages/*'", "typedocs": "pnpm build && pnpm --dir docs typedocs", "ci:version": "changeset version", - "ci:publish": "pnpm lint && pnpm build && pnpm test && changeset publish" + "ci:publish": "pnpm lint && pnpm build && pnpm test && changeset publish", + "changeset:add": "pnpm changeset && git add .changeset && git commit -m 'chore(changeset): add'" }, "devDependencies": { "@changesets/changelog-github": "^0.5.0", diff --git a/packages/core/src/components/ConnectionLine/index.ts b/packages/core/src/components/ConnectionLine/index.ts index ffda1813..67227e59 100644 --- a/packages/core/src/components/ConnectionLine/index.ts +++ b/packages/core/src/components/ConnectionLine/index.ts @@ -55,11 +55,11 @@ const ConnectionLine = defineComponent({ const handleType = connectionStartHandle.value.type const fromHandleBounds = fromNode.value.handleBounds - let handleBounds = fromHandleBounds?.[handleType] || [] + let handleBounds = fromHandleBounds?.[handleType] ?? [] if (connectionMode.value === ConnectionMode.Loose) { - const oppositeBounds = fromHandleBounds?.[handleType === 'source' ? 'target' : 'source'] || [] - handleBounds = [...handleBounds, ...oppositeBounds] || oppositeBounds + const oppositeBounds = fromHandleBounds?.[handleType === 'source' ? 'target' : 'source'] ?? [] + handleBounds = [...handleBounds, ...oppositeBounds] } if (!handleBounds) { @@ -67,7 +67,7 @@ const ConnectionLine = defineComponent({ } const fromHandle = (startHandleId ? handleBounds.find((d) => d.id === startHandleId) : handleBounds[0]) ?? null - const fromPosition = fromHandle?.position || Position.Top + const fromPosition = fromHandle?.position ?? Position.Top const { x: fromX, y: fromY } = getHandlePosition(fromNode.value, fromHandle, fromPosition) let toHandle: HandleElement | null = null @@ -81,7 +81,7 @@ const ConnectionLine = defineComponent({ } else { // if connection mode is loose, look for the handle in both source and target bounds toHandle = - [...(toNode.value.handleBounds.source || []), ...(toNode.value.handleBounds.target || [])]?.find( + [...(toNode.value.handleBounds.source ?? []), ...(toNode.value.handleBounds.target ?? [])]?.find( (d) => d.id === connectionEndHandle.value?.id, ) || null } diff --git a/packages/core/src/store/actions.ts b/packages/core/src/store/actions.ts index ccf85354..ab8616d1 100644 --- a/packages/core/src/store/actions.ts +++ b/packages/core/src/store/actions.ts @@ -140,8 +140,8 @@ export function useActions(state: State, nodeLookup: ComputedRef, ed const changes: NodeDimensionChange[] = [] - for (let i = 0; i < updates.length; ++i) { - const update = updates[i] + for (const element of updates) { + const update = element const node = findNode(update.id) @@ -157,8 +157,8 @@ export function useActions(state: State, nodeLookup: ComputedRef, ed if (doUpdate) { const nodeBounds = update.nodeElement.getBoundingClientRect() node.dimensions = dimensions - node.handleBounds.source = getHandleBounds('source', update.nodeElement, nodeBounds, zoom) - node.handleBounds.target = getHandleBounds('target', update.nodeElement, nodeBounds, zoom) + node.handleBounds.source = getHandleBounds('source', update.nodeElement, nodeBounds, zoom, node.id) + node.handleBounds.target = getHandleBounds('target', update.nodeElement, nodeBounds, zoom, node.id) changes.push({ id: node.id, diff --git a/packages/core/src/types/node.ts b/packages/core/src/types/node.ts index 582e1ef3..130a19ca 100644 --- a/packages/core/src/types/node.ts +++ b/packages/core/src/types/node.ts @@ -19,8 +19,8 @@ export interface CoordinateExtentRange { } export interface NodeHandleBounds { - source?: HandleElement[] - target?: HandleElement[] + source: HandleElement[] | null + target: HandleElement[] | null } /** @deprecated will be removed in next major release */ diff --git a/packages/core/src/utils/edge.ts b/packages/core/src/utils/edge.ts index 584c3358..eaecd221 100644 --- a/packages/core/src/utils/edge.ts +++ b/packages/core/src/utils/edge.ts @@ -30,7 +30,7 @@ export function getHandlePosition( } } -export function getEdgeHandle(bounds: HandleElement[] | undefined, handleId?: string | null): HandleElement | null { +export function getEdgeHandle(bounds: HandleElement[] | null, handleId?: string | null): HandleElement | null { if (!bounds) { return null } diff --git a/packages/core/src/utils/node.ts b/packages/core/src/utils/node.ts index 2ee8afb5..12855cf1 100644 --- a/packages/core/src/utils/node.ts +++ b/packages/core/src/utils/node.ts @@ -8,22 +8,25 @@ export function getHandleBounds( nodeElement: HTMLDivElement, nodeBounds: DOMRect, zoom: number, -): HandleElement[] { + nodeId: string, +): HandleElement[] | null { const handles = nodeElement.querySelectorAll(`.vue-flow__handle.${type}`) - const handlesArray = Array.from(handles) as HTMLDivElement[] + if (!handles?.length) { + return null + } - return handlesArray.map((handle): HandleElement => { + return Array.from(handles).map((handle): HandleElement => { const handleBounds = handle.getBoundingClientRect() return { id: handle.getAttribute('data-handleid'), - position: handle.getAttribute('data-handlepos') as unknown as Position, - nodeId: handle.getAttribute('data-nodeid') as string, type, + nodeId, + position: handle.getAttribute('data-handlepos') as unknown as Position, x: (handleBounds.left - nodeBounds.left) / zoom, y: (handleBounds.top - nodeBounds.top) / zoom, - ...getDimensions(handle), + ...getDimensions(handle as HTMLDivElement), } }) }