bvaughn
commented
7 months ago The behavior you're describing is controlled by this logic:
This Replay shows what's happening: 8c5e2948-00d4-4dd0-a7f7-c11f660ee59f
Nearest I can tell, it looks like a bug in the stacking-order package, because it's returning a value indicating that your buttons are not "above" the drag-handle. I added a comment where I Think that library is broken, but I don't have time to dig into it more.
You could try reducing this test case even more and filing an issue in that project's GitHub? Or if you'd like to dig in yourself and submit a PR I'll try to find time to review it. I'm pretty swamped right now though with work and don't have time to dig into this more.
vanquishkuso
Hi, thank you for an awesome package!
I have an issue that I thought was similar to #288 but it doesn't seem to be fixed with the latest version 2.0.7. I have an overlapping button element that I want to be able to click and collapse a drawer. However, the draggable border gets priority even though the Z-index on the button is above.
This can be partially solved by moving the button outside of the resizable components (although it makes the positioning of the button troublesome), but when the button contains only an icon and not text, the drag gets priority again. The button is although still clickable.
If the button contains text and is outside of the resizable components it works as expected, but the positioning of the button is again cumbersome.
It's difficult to explain, so I reproduced a simple example it in the sandbox below: https://codesandbox.io/p/sandbox/react-resizable-panels-forked-s5jzpg