Repository navigation
Canvas: show position, size or angle next to the element while dragging #5590
Description
When you move, resize or rotate an element on the canvas there is no live readout of where it is, so lining things up by number means checking the properties panel after every drag. The editing overlay is ConnectedDomEditOverlay (packages/studio/src/components/editor/).
Done when
- While moving, a small label at the element's top right shows its rounded X and Y in composition pixels.
- While resizing it shows width x height; while rotating, the angle in degrees.
- The label stays on screen near the edges and disappears when the gesture ends. It never appears in renders.
- A test for each gesture.
Desktop candidate: this component is also used by the HyperFrames Desktop app, so the change reaches it with the next version bump.
Reviewer: @miguel-heygen. New to the repo? Start with CONTRIBUTING.md; run bun install, then the package's tests, before opening a PR.
Activity
Dante-dan commentedon Oct 14, 2026
I plan to add the live readout to Studio’s existing overlay, using composition pixels for position and the current size/rotation draft for the other gestures. The label will sit by the element’s top-right corner, clamp within the visible canvas, and disappear on release or cancellation without adding anything to the composition document. I’ll cover move, resize and rotation in the overlay tests and run Studio’s tests. Please assign this to me.