Weird transition/animations for popups (shadcn-svelte@next)

[gyenabubakar]

(I'm posting this here because I think I may be doing something wrong.)

I just migrated my SvelteKit project to Svelte 5 and started using shadcn-svelte@next but the transitions for my popups, dropdowns and tooltips look wayy off and I'm stuck trying to figure out the culprit:

Screen.Recording.2024-11-07.at.12.16.18.PM.mov

If anyone would like to help, here's how to reproduce:

1. Clone this project and cd into it.
2. Run git switch svelte-5-migration.
3. Run npm install.
4. Run npm run dev.
5. In your browser, go to http://localhost:5173/app and click on the elements I clicked on in the video above.

If you do figure it out, you can comment here with the solution, or open a PR in the repo.. Thank you.

[gyenabubakar]

UPDATE: found a fix. I removed this block of CSS:

*:not(svg) {
   @apply transition-all duration-200;
}