Incorrect drag after adding pane programatically

[dadebue]

Describe the bug

Dragging a PaneResizer after inserting an pane programatically leads to incorrect size changes when the pane was added with splice or unshift. When pushing a pane to the array everything is fine.

Or am I using something wrong?

Screenshot_2024-06-04_15-05-18.mp4

Reproduction

• create layout with multiple groups
• add a pane programatically with splice or unshift

REPL: https://svelte-5-preview.vercel.app/#H4sIAAAAAAAAE8VVUY-bRhD-K5NNJePIwNnyS4lxW7VSdQ-RoubxuAfMDrD1sot2F99dKP-92l3A-JIoeWpt2WZnmO-b-ZgZ96RkHDVJHnoi8gZJQn5rW7Ih5qW1B31BbpBsiJadKqzloAvFWgM8F1WaEaMzcswEAGtaqQz08DEX-KeSXbtxl_77L9TsMyoYoFSygVWbCyylqnD1PhOZGYPn0N9l00qBwoy3R_HsinxKLk5kBmyi8OHF-iGF3tmA0QS0UUxU772BMoWFYVIksKqlYp-lMDlfwT-wuqAyrPCHTlAsmUA6htk0dTLCPzw66zAyF1JoAxWaewopBGtIj_AhN3VUcilV4C5VLqhsgjW8g-2dfa0jIz-5xIK1BbEfjgYqW1pyreMnbXKDQW-V9eU4omC98ZZv1DN6x7Qf_AmgXyLAsJntLgX3vqWYrEuaWaeFfyL6guG1AR5n0oneW4b1jZxSFJwV51nQMUMnT-TYHraP_iLSLWcFBtvN3eYVm5N2mPS9Qd7-EHTb6Tr4Bugh9hNwtHkffDcmNeb0mIkDZ-IMCnmaEW1eOOoa0WQEaoVlmpHamFYncdyJ9lxFhWxikzP-xAQttP51F-2i7c8xZdrM9qhhIiq0zkh8dNw3fJk4nDpjpICC51qnGWlMuIeGh3s4SUVRQRtuMwL9WP5wvBcalQFmsIHAS7g-xB7l-MN4I1w64W6H48dO1w52iUbZZYZqw31Gjp8sJRMVBFJBJ3TNSsNEtYaTwvysgaq8qqy_yHnR8dx2H8gSTI1w7XRQfqHoN4eYsouXYkmm0IZeEOqw7DiHJ__TPod7aE_hbj-urcNXds6JCZq4vgAvumcgG9JIykqGlCRGdThs5qU5o_znq9N-_p8daGzudnn1fn3ZtWWly08c7cAk_c1WG6y_VbLVgZ352zGaK79mmfrwaDYMwOhkZHSYH_XtE1bSFkBDXo3q9m8xL2pYzDnkGtoNMPo8-FXk6B26Qz7O-_EtK2GZweQAmAZfIy89dtq3g-uXMTZBrnEZsWzPMdkx9ZLjsxsdHRYoDCr4u9OGlS_T8VrUNIanKqxU_hJu7-5cndNGzoyX8apT1NtCE7j_A3x515unzh4zjlk5CeL-b0ePU4HRZ3iTpksZI46iMjWEsJ3LPCw79otZ_G6dpyo85cW5cvXC6wZI0_Taqb-s6nC3SlZP4W41ZGRWfq6ij-1zdwt77q6vTvHj8C8B_x5CBgkAAA==

Logs

No response

System Info

svelte-5-preview vercel

Severity

annoyance

[huntabyte]

Are you able to reproduce this in Svelte 4?

[dadebue]

Yes: https://svelte.dev/repl/c89d1fc9ebc5415a9e890388f279536e?version=4.2.18

[huntabyte]

Okay here's a workaround at least for the time being: https://svelte.dev/repl/c89d1fc9ebc5415a9e890388f279536e?version=4.2.18

When I find some time I'll try to investigate why it is getting registered backwards like that.

[dadebue]

Did you mean to paste a different link? The link you provided is the REPL I created so I still get the problem 🙈

[huntabyte]

Whoops, here you go REPL

[LePau]

I had the same issue with collapsing a panel using a key block, but that doesn't seem to fix the drag issue in that case. Any ideas?

Just adding here as another data point.

[huntabyte]

I'm unsure how this could be solved by paneforge, as I don't see a way for us to know what pattern you are using on the outside to mutate arrays. Even adding a unique key to the {#each still seems to produce the opposite drag behavior, which leads me to believe something is getting confused.

I'll look into this further when I have the time, if someone else wants to put a second set of eyes it would be appreciated.

[rdrpenguin04]

Still getting issues related to this; I'm considering taking a look into the bug because I'd rather not write my own resizer system when this should work just fine. Is there any documentation on how the internal state gets created and managed that I could look at?

[rdrpenguin04]

Nevermind; all that was needed to fix my case was to use order. None of the directions are reversed; everything "just works".

[adamdva]

I was having the same on a simple horizontal left side panel and main panel.
Adding order to both panels fixed it.