(Reorder.Item) Disable animations when not dragging?

[tajbowness]

Hello, was wondering if there was a better way to disable the li animations when they aren't in a dragged state? Currently, the li item height can change by a couple pixels, which results in the components (children) to get a stetching transition effect. The way I've sort of solved this issue is to apply transform: none; to the li when the li isn't in a drag state.

[tajbowness]

Setting layout to false in Reorder.Item helps.

https://www.framer.com/motion/reorder/##layout-animations

EDIT: If it doesn't work properly, add this to Reorder.Item instead

const [dragging, setDragging] = useState(false);

...

onDragStart={() => setDragging(true)}
onDragEnd={() => setDragging(false)}
transition={dragging ? { duration: 0.2 } : { duration: 0 }}