Content shift in Dialog component

[wojexe]

Describe the bug

There is a bug with content being shifted when a Dialog component is inside of a flex container with the gap property and has Content specified. This error occurs briefly when the page is loaded (and possibly hydrated) to later disappear and behave as expected.

Reproduction

https://stackblitz.com/edit/github-hxkj5f?file=src%2Froutes%2F%2Bpage.svelte

reproduction.mov

Logs

No response

System Info

INB4 - I have used these packages in my project, but in the reproduction above, I've used Svelte 4 and the issue persists

System:
    OS: macOS 14.4.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 127.20 MB / 16.00 GB
    Shell: 3.7.1 - /opt/homebrew/bin/fish
  Binaries:
    Node: 21.6.2 - ~/.asdf/installs/nodejs/21.6.2/bin/node
    npm: 10.2.4 - ~/.asdf/plugins/nodejs/shims/npm
    pnpm: 7.1.0 - ~/.asdf/shims/pnpm
    bun: 1.1.1 - ~/.asdf/installs/bun/1.1.1/bin/bun
  Browsers:
    Chrome: 124.0.6367.78
    Safari: 17.4.1
  npmPackages:
    @sveltejs/kit: ^2.5.0 => 2.5.6
    bits-ui: ^0.21.1 => 0.21.3
    formsnap: ^1.0.0 => 1.0.0
    mode-watcher: ^0.3.0 => 0.3.0
    svelte: ^5.0.0-next.94 => 5.0.0-next.106
    svelte-radix: ^1.1.0 => 1.1.0
    sveltekit-superforms: ^2.12.2 => 2.12.5

Severity

annoyance

[jakebennett18505]

Did you manage to find a fix for this?
The more dialogs I add, the worse it gets 🙈

[wojexe]

@jakebennett18505 Unfortunately no :(

[jamesepirus]

I have this issue as well, did anyone find a temporary workaround?

[huntabyte]

It's mostly unavoidable in the current implementation. It is fixed in the Svelte 5 version coming soon though.

[huntabyte]

Fixed in @next