diff --git a/examples/vite-app/src/examples/NodeToolbar/index.tsx b/examples/vite-app/src/examples/NodeToolbar/index.tsx
index 13dba39b..424ee202 100644
--- a/examples/vite-app/src/examples/NodeToolbar/index.tsx
+++ b/examples/vite-app/src/examples/NodeToolbar/index.tsx
@@ -7,6 +7,7 @@ import ReactFlow, {
Edge,
NodeTypes,
Position,
+ NodeOrigin,
} from 'reactflow';
import CustomNode from './CustomNode';
@@ -53,6 +54,7 @@ const initialEdges: Edge[] = [
];
const defaultEdgeOptions = { zIndex: 0 };
+const nodeOrigin: NodeOrigin = [0.5, 0.5];
export default function NodeToolbarExample() {
return (
@@ -65,6 +67,7 @@ export default function NodeToolbarExample() {
fitView
defaultEdgeOptions={defaultEdgeOptions}
nodeTypes={nodeTypes}
+ nodeOrigin={nodeOrigin}
>
diff --git a/packages/node-toolbar/src/NodeToolbar.tsx b/packages/node-toolbar/src/NodeToolbar.tsx
index c8085ecf..c413eb30 100644
--- a/packages/node-toolbar/src/NodeToolbar.tsx
+++ b/packages/node-toolbar/src/NodeToolbar.tsx
@@ -25,7 +25,7 @@ const nodeEqualityFn = (a: SelectedNode, b: SelectedNode) =>
a?.selected === b?.selected &&
a?.[internalsSymbol]?.z === b?.[internalsSymbol]?.z;
-const transformSelector = (state: ReactFlowState) => state.transform;
+const transformSelector = (state: ReactFlowState) => ({ transform: state.transform, nodeOrigin: state.nodeOrigin });
function getTransform(nodeRect: Rect, transform: Transform, position: Position, offset: number): string {
// position === Position.Top
@@ -68,13 +68,13 @@ function NodeToolbar({
}: NodeToolbarProps) {
const nodeSelector = useCallback((state: ReactFlowState): SelectedNode => state.nodeInternals.get(nodeId), [nodeId]);
const node = useStore(nodeSelector, nodeEqualityFn);
- const transform = useStore(transformSelector, shallow);
+ const { transform, nodeOrigin } = useStore(transformSelector, shallow);
if (!isActive || !node) {
return null;
}
- const nodeRect: Rect = getRectOfNodes([node]);
+ const nodeRect: Rect = getRectOfNodes([node], nodeOrigin);
const wrapperStyle: CSSProperties = {
transform: getTransform(nodeRect, transform, position, offset),