alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

resolved some requested changes

Browse Source
This commit is contained in:
peterkogo
2024-04-10 14:47:49 +02:00
parent db05c3f3f4
commit 835dec25ba
13 changed files with 39 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/react/src/additional-components/NodeToolbar/NodeToolbar.tsx
View File

@@ -74,7 +74,7 @@ export function NodeToolbar({
}
const nodeRect: Rect = getNodesBounds(nodes, { nodeOrigin });
const zIndex: number = Math.max(...nodes.map((node) => (node.internals?.z || 1) + 1));
const zIndex: number = Math.max(...nodes.map((node) => node.internals.z + 1));
const wrapperStyle: CSSProperties = {
position: 'absolute',

6
packages/react/src/components/ConnectionLine/index.tsx
View File

@@ -52,7 +52,7 @@ const ConnectionLine = ({
),
shallow
);
const fromHandleBounds = fromNode?.internals?.handleBounds;
const fromHandleBounds = fromNode?.internals.handleBounds;
let handleBounds = fromHandleBounds?.[handleType];
if (connectionMode === ConnectionMode.Loose) {
@@ -66,8 +66,8 @@ const ConnectionLine = ({
const fromHandle = handleId ? handleBounds.find((d) => d.id === handleId) : handleBounds[0];
const fromHandleX = fromHandle ? fromHandle.x + fromHandle.width / 2 : (fromNode.measured.width ?? 0) / 2;
const fromHandleY = fromHandle ? fromHandle.y + fromHandle.height / 2 : fromNode.measured.height ?? 0;
const fromX = (fromNode.internals.positionAbsolute.x ?? 0) + fromHandleX;
const fromY = (fromNode.internals.positionAbsolute.y ?? 0) + fromHandleY;
const fromX = fromNode.internals.positionAbsolute.x + fromHandleX;
const fromY = fromNode.internals.positionAbsolute.y + fromHandleY;
const fromPosition = fromHandle?.position;
const toPosition = fromPosition ? oppositePosition[fromPosition] : null;

8
packages/svelte/src/lib/components/NodeWrapper/NodeWrapper.svelte
View File

@@ -35,8 +35,8 @@
export let sourcePosition: $$Props['sourcePosition'] = undefined;
export let targetPosition: $$Props['targetPosition'] = undefined;
export let zIndex: $$Props['zIndex'];
export let computedWidth: $$Props['computedWidth'] = undefined;
export let computedHeight: $$Props['computedHeight'] = undefined;
export let measuredWidth: $$Props['measuredWidth'] = undefined;
export let measuredHeight: $$Props['measuredHeight'] = undefined;
export let initialWidth: $$Props['initialWidth'] = undefined;
export let initialHeight: $$Props['initialHeight'] = undefined;
export let width: $$Props['width'] = undefined;
@@ -79,8 +79,8 @@
height,
initialWidth,
initialHeight,
computedWidth,
computedHeight
measuredWidth,
measuredHeight
});
$: {

4
packages/svelte/src/lib/components/NodeWrapper/types.ts
View File

@@ -21,8 +21,8 @@ export type NodeWrapperProps = Pick<
| 'initialWidth'
| 'initialHeight'
> & {
computedWidth?: number;
computedHeight?: number;
measuredWidth?: number;
measuredHeight?: number;
type: string;
positionX: number;
positionY: number;

10
packages/svelte/src/lib/components/NodeWrapper/utils.ts
View File

@@ -3,20 +3,20 @@ export function getNodeInlineStyleDimensions({
height,
initialWidth,
initialHeight,
computedWidth,
computedHeight
measuredWidth,
measuredHeight
}: {
width?: number;
height?: number;
initialWidth?: number;
initialHeight?: number;
computedWidth?: number;
computedHeight?: number;
measuredWidth?: number;
measuredHeight?: number;
}): {
width: string | undefined;
height: string | undefined;
} {
if (computedWidth === undefined && computedHeight === undefined) {
if (measuredWidth === undefined && measuredHeight === undefined) {
const styleWidth = width ?? initialWidth;
const styleHeight = height ?? initialHeight;

12
packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte
View File

@@ -41,8 +41,8 @@
{#each $visibleNodes as node (node.id)}
{@const nodeDimesions = getNodeDimensions(node)}
{@const posOrigin = getPositionWithOrigin({
x: node.internals.positionAbsolute.x ?? 0,
y: node.internals.positionAbsolute.y ?? 0,
x: node.internals.positionAbsolute.x,
y: node.internals.positionAbsolute.y,
...nodeDimesions,
origin: node.origin
})}
@@ -61,8 +61,8 @@
node.connectable ||
($nodesConnectable && typeof node.connectable === 'undefined')
)}
positionX={node.internals.positionAbsolute?.x ?? 0}
positionY={node.internals.positionAbsolute?.y ?? 0}
positionX={node.internals.positionAbsolute.x}
positionY={node.internals.positionAbsolute.y}
positionOriginX={posOrigin.x ?? 0}
positionOriginY={posOrigin.y ?? 0}
isParent={!!node.internals.isParent}
@@ -79,8 +79,8 @@
height={node.height}
initialWidth={node.initialWidth}
initialHeight={node.initialHeight}
computedWidth={node.measured.width}
computedHeight={node.measured.height}
measuredWidth={node.measured.width}
measuredHeight={node.measured.height}
{resizeObserver}
on:nodeclick
on:nodemouseenter

6
packages/svelte/src/lib/hooks/useSvelteFlow.ts
View File

@@ -467,11 +467,7 @@ export function useSvelteFlow(): {
const nextData = typeof dataUpdate === 'function' ? dataUpdate(node) : dataUpdate;
if (options?.replace) {
node.data = nextData;
} else {
node.data = { ...node.data, ...nextData };
}
node.data = options?.replace ? nextData : { ...node.data, ...nextData };
nodes.update((nds) => nds);
},

18
packages/svelte/src/lib/store/index.ts
View File

@@ -80,14 +80,14 @@ export function createStore({
function updateNodeDimensions(updates: Map<string, NodeDimensionUpdate>) {
const nodeLookup = get(store.nodeLookup);
const nodeUpdates = updateNodeDimensionsSystem(
const changes = updateNodeDimensionsSystem(
updates,
nodeLookup,
get(store.domNode),
get(store.nodeOrigin)
);
if (!nodeUpdates) {
if (!changes) {
return;
}
@@ -100,23 +100,23 @@ export function createStore({
store.fitViewOnInitDone.set(fitViewOnInitDone);
}
for (const nodeUpdate of nodeUpdates) {
const node = nodeLookup.get(nodeUpdate.id)?.internals.userNode;
for (const change of changes) {
const node = nodeLookup.get(change.id)?.internals.userNode;
if (!node) {
continue;
}
switch (nodeUpdate.type) {
switch (change.type) {
case 'dimensions': {
const measured = { ...node.measured, ...nodeUpdate.dimensions };
node.width = nodeUpdate.dimensions?.width ?? node.width;
node.height = nodeUpdate.dimensions?.height ?? node.height;
const measured = { ...node.measured, ...change.dimensions };
node.width = change.dimensions?.width ?? node.width;
node.height = change.dimensions?.height ?? node.height;
node.measured = measured;
break;
}
case 'position':
node.position = nodeUpdate.position ?? node.position;
node.position = change.position ?? node.position;
break;
}
}

2
packages/svelte/src/lib/store/initial-store.ts
View File

@@ -93,7 +93,7 @@ export const getInitialStore = ({
let viewport: Viewport = { x: 0, y: 0, zoom: 1 };
if (fitView && width && height) {
const nodesWithDimensions = Array.from(nodeLookup.values()).filter(
const nodesWithDimensions = nodes.filter(
(node) => (node.width && node.height) || (node.initialWidth && node.initialHeight)
);

4
packages/system/src/utils/edges/positions.ts
View File

@@ -97,8 +97,8 @@ function toHandleBounds(handles?: NodeHandle[]) {
}
function getHandlePosition(position: Position, node: InternalNodeBase, handle: HandleElement | null = null): number[] {
const x = (handle?.x ?? 0) + (node.internals.positionAbsolute?.x ?? 0);
const y = (handle?.y ?? 0) + (node.internals.positionAbsolute?.y ?? 0);
const x = (handle?.x ?? 0) + node.internals.positionAbsolute.x;
const y = (handle?.y ?? 0) + node.internals.positionAbsolute.y;
const { width, height } = handle ?? getNodeDimensions(node);
switch (position) {

2
packages/system/src/utils/store.ts
View File

@@ -107,7 +107,7 @@ export function adoptUserNodes<NodeType extends NodeBase>(
},
internals: {
positionAbsolute: userNode.position,
handleBounds: currentStoreNode?.internals?.handleBounds,
handleBounds: currentStoreNode?.internals.handleBounds,
z: (isNumeric(userNode.zIndex) ? userNode.zIndex : 0) + (userNode.selected ? selectedNodeZ : 0),
userNode,
isParent: false,

4
packages/system/src/xydrag/utils.ts
View File

@@ -55,8 +55,8 @@ export function getDragItems<NodeType extends NodeBase>(
id: internalNode.id,
position: internalNode.position || { x: 0, y: 0 },
distance: {
x: mousePos.x - (internalNode.internals.positionAbsolute?.x ?? 0),
y: mousePos.y - (internalNode.internals.positionAbsolute?.y ?? 0),
x: mousePos.x - internalNode.internals.positionAbsolute.x,
y: mousePos.y - internalNode.internals.positionAbsolute.y,
},
extent: internalNode.extent,
parentId: internalNode.parentId,

4
packages/system/src/xyhandle/utils.ts
View File

@@ -22,8 +22,8 @@ export function getHandles(
id: h.id || null,
type,
nodeId: node.id,
x: (node.internals.positionAbsolute.x ?? 0) + h.x + h.width / 2,
y: (node.internals.positionAbsolute.y ?? 0) + h.y + h.height / 2,
x: node.internals.positionAbsolute.x + h.x + h.width / 2,
y: node.internals.positionAbsolute.y + h.y + h.height / 2,
});
}
return res;