Hi guys, I followed a similar approach to make the user components dragged with an absolute position inside the editor. It works really well, but I am facing problems with setting a dynamic initial position as opposed to a static one when dragged from the left sidebar.
I tried various things including passing the pageX, pageY props from the toolbar component, something like:
This sets the state correctly, but the component gets dropped first in the editor. This causes the next component to be dropped to use the position set by the state earlier, but not the current one. What I want is that I could pass the dragend event data to the ref so that the current component could be loaded with a dynamic positioning as per the mouse pointer.
Here is my code of a simple user component created to drag/drop a checkbox:
@ankri @unloved
Hi guys, I followed a similar approach to make the user components dragged with an absolute position inside the editor. It works really well, but I am facing problems with setting a dynamic initial position as opposed to a static one when dragged from the left sidebar.
I tried various things including passing the pageX, pageY props from the toolbar component, something like:
This sets the state correctly, but the component gets dropped first in the editor. This causes the next component to be dropped to use the position set by the state earlier, but not the current one. What I want is that I could pass the
dragend
event data to the ref so that the current component could be loaded with a dynamic positioning as per the mouse pointer.Here is my code of a simple user component created to drag/drop a checkbox:
Originally posted by @nickm89 in https://github.com/prevwong/craft.js/issues/32#issuecomment-1002949758