Skip to content

ViewportWorld

const ViewportWorld: React.FC<ViewportWorldProps>

Defined in: src/components/primitives/viewport/ViewportWorld.tsx:31

Container for HTML children positioned in world coordinates.

The wrapper applies the viewport’s translate(x, y) scale(zoom) so that children whose left/top are expressed in world units render at the correct screen position and follow pan/zoom automatically.

Subscribes only to the transform slice of the store — re-renders when the transform changes, not when isPanning or marqueeRect flip.

Example

<ViewportWorld>
<div style={{ position: 'absolute', left: 100, top: 200 }}>
Node at world (100, 200)
</div>
</ViewportWorld>