Closed TiagoCavalcante closed 1 year ago
The code from the arbitrary drag move (copied below) doesn't work with the latest SolidJS version
import { render } from "solid-js/web"; import { DragDropProvider, DragDropSensors, DragEventHandler, DragOverlay, createDraggable, } from "@thisbeyond/solid-dnd"; const Draggable = (props: { id: number }) => { const draggable = createDraggable(props.id); return ( <div use:draggable class="draggable absolute" classList={{ "opacity-25": draggable.isActiveDraggable }} style={{ top: 0, left: (props.id === 1 ? 0 : 125) + "px" }} > Draggable {props.id} </div> ); }; const DragMoveExample = () => { let transform = { x: 0, y: 0 }; const onDragMove: DragEventHandler = ({ overlay }) => { if (overlay) { transform = { ...overlay.transform }; } }; const onDragEnd: DragEventHandler = ({ draggable }) => { const node = draggable.node; node.style.setProperty("top", node.offsetTop + transform.y + "px"); node.style.setProperty("left", node.offsetLeft + transform.x + "px"); }; return ( <DragDropProvider onDragMove={onDragMove} onDragEnd={onDragEnd}> <DragDropSensors /> <div class="min-h-15 w-full h-full relative"> <Draggable id={1} /> <Draggable id={2} /> </div> <DragOverlay> {(draggable) => <div class="draggable">Draggable {draggable.id}</div>} </DragOverlay> </DragDropProvider> ); }; render(DragMoveExample, document.getElementById("app")!);
This gives the following error:
Uncaught TypeError: (intermediate value)() is null createPointerSensor create-pointer-sensor.js:4 DragDropSensors drag-drop-sensors.jsx:3 c dev.js:516 untrack dev.js:421 c dev.js:512 runComputation dev.js:696 updateComputation dev.js:679 devComponent dev.js:523 createComponent dev.js:1231 get children index.tsx:40 get dev.js:1302 get children drag-drop-context.jsx:503 res dev.js:971 runComputation dev.js:696 updateComputation dev.js:679 createMemo dev.js:238 children dev.js:577 res dev.js:971 untrack dev.js:421 provider dev.js:967 runComputation dev.js:696 updateComputation dev.js:679 createRenderEffect dev.js:205 provider dev.js:967 c dev.js:516 untrack dev.js:421 c dev.js:512 runComputation dev.js:696 updateComputation dev.js:679 devComponent dev.js:523 createComponent dev.js:1231 DragDropProvider drag-drop-context.jsx:503 c dev.js:516 untrack dev.js:421 c dev.js:512 runComputation dev.js:696 updateComputation dev.js:679 devComponent dev.js:523 createComponent dev.js:1231 _Hot$$DragMoveExample index.tsx:39 hmrCompWrapper @solid-refresh:16 render dev.js:93 updateFn dev.js:168 runUpdates dev.js:788 createRoot dev.js:176 render dev.js:91 <anonymous> index.tsx:5 create-pointer-sensor.js:4:108
See #67 and let me know if it's the same issue.
Sorry for the delay, it was the same issue
The code from the arbitrary drag move (copied below) doesn't work with the latest SolidJS version
This gives the following error: