If container DIV has zoom value react-selcto not working as expected

[jebaemanuel]

Environments

• Framework name: React
• Framework version: 17.0.2
• Component name: React-Selecto
• Component version:1.13.2
• Testable Address(optional):

Description

If container DIV has zoom value other than 100%, after dragged inside the container, the drag position showing wrong position.

using zoom and transform property in container DIV not working as expected. If I added transform instead of zoom, the drag position working fine. but UI elements not selected.

I shared the example - in render function. return <div className="app"> <div className="container" style={{zoom:"50%"}}>

    <Selecto 
    	.....
    />

[daybrush]

@jebaemanuel

okay. I'll check it.

[daybrush]

@jebaemanuel

I checked and selecto calculates the position and size through getBoundingClientRect, but the zoom property interferes with this and brings an incorrect value.

How about using transform: scale(0.5) instead?

Set rootConainer={document.body} if selecto is in container with transform applied.

[MuhammadFadhil10]

@jebaemanuel

I checked and selecto calculates the position and size through getBoundingClientRect, but the zoom property interferes with this and brings an incorrect value.

How about using transform: scale(0.5) instead?

Set rootConainer={document.body} if selecto is in container with transform applied.

solution yet?

[wangchihai]

solution yet?