Custom handles with icons cannot be dragged

[CharlieWinkwaves]

Subject of the issue

When using a custom handle and the handle contains an icon the item can only be dragged when the user grabs the button. If the icon is grabbed the item cannot be dragged

Your environment

gridstack 10.2.0
Mac,
Chrome v125.0.6422.144
Also reproduced on a linux system with chromium as browser

Steps to reproduce

https://jsfiddle.net/m3Lqx4ka/4/

Expected behavior

I expect the icon to also be used to grab as it is part of the button.
It does work when using text inside the button. So why not icons

I added a screenshot of our handle with the icon inside.

[adumesny]

simpler case https://jsfiddle.net/adumesny/c1o3xs6w

[marciocamello]

change to div, element, maybe by default only accept HTMLDivElement, use div tag and inside put your icon, button, etc.

https://jsfiddle.net/fvrj23t6/

[CharlieWinkwaves]

@marciocamello it does accept button as a handle see #2677
but it does not include the icon as a handle so only the edges of the button can be used to drag
and for accessibility reasons we want to use a button not a div.

[marciocamello]

@marciocamello it does accept button as a handle see #2677 but it does not include the icon as a handle so only the edges of the button can be used to drag and for accessibility reasons we want to use a button not a div.

Button yet, I know, but some users try use only a icon, or other tags, like and don't works with these tags, but I believe you can change to accept any element for usage in react for example, it's a good approach remove this limitation.