Custom dragContainer not working

[MorelSerge]

I'm trying to set a custom dragContainer according to the docs for autoscrolling: https://paol-imi.github.io/muuri-react/docs/usage/drag-scroll/

However, any value except null or document.body does not seem to work.
I'm creating a ref from a dif using useRef, but without success.

The reason I'm using a custom drag container component, is because I do not want the drag container to fill the whole viewport (UI-decision).

I fixed it temporarily by using onMount:

onMount = {
    (grid) => {
        if (!grid._settings.dragContainer && dragContainerRef.current) {
            grid._settings.dragContainer = dragContainerRef.current;
        }
    }
}

Sidenote: If I set dragContainer={dragContainerRef}, it logs an error that the dragContainer is invalid because .current is undefined. However, that's easily fixable by using dragContainer={dragContainerRef.current && dragContainerRef} instead.

Great library!

[paol-imi]

Thanks for the report, as soon as I have time I'll have a look.

dragContainer={dragContainerRef.current && dragContainerRef}

Be careful that the property is set on the first render and cannot be changed. In doing so, if the ref is null, you pass null during the first render and the value cannot be changed anymore.

[MorelSerge]

Ah that explains the behaviour! My ref component is rendered together with the MuuriComponent and therefore the ref is still null during first render.

[paol-imi]

Yes, this should be normal operation, but apparently Muuri saves the value when it is generated and does not use the ref.