can I scale the Moveable blue controls and lines dynamically ?

[gabimor]

Environments

• Framework name: react-moveable (React 18.2)
• Framework version: 0.54.1
• Moveable Component version: 0.54.1
• Testable Address(optional):

Description

Is there a way to set the value of the translate: scale() for the moveable-control and moveable-line elements ? My canvas where I use my moveables is scalable and I want the blue controls and lines to be visible even when zoomed out so my solution is to scale them (i'm using react). is there an Moveable API to affect the their transform css property ? I've notice this happens on the moveable demo (using the InfiniteViewer) when you zoom in and out there the transform property for each moveable-control/line changes, but I can't find how to do that with in React (I can do it using document.querySelectorAll) but am looking for a more elegant way :)

[HZZformGD]

Try the property zoom ? <Moveable zoom={zoom}/>

[daybrush]

As @HZZformGD said, use zoom prop or css

.moveable-control {
width: 14px;
height: 14px;
border-radius: 50%;
border: 2px solid #fff;
box-sizing: border-box;
background: #4af;
background: var(--moveable-color);
margin-top: -7px;
margin-left: -7px;
border: 2px solid #fff;
z-index: 10;
}

[gabimor]

Thank you @daybrush but I am aiming at scaling only the blue selection rectangle and control circles, without scaling the actual element will this do the trick ?