Toggle acting weird in modal with y-overflow

[romrom21]

Description

When I click on a toggle that I needed to scroll to reach, the modal container will do something really weird. The more I need to scroll to reach the toggle, the more impacted the page will be

Minimal Reproduction

<Modal open={true} class="max-h-[150px]">
    <Toggle class="pt-[300px]"></Toggle>
</Modal>

Steps to Reproduce

Create a modal with scrollable content. Place a Toggle in the scrollable area. Click on the toggle, your modal willresize weirdly.

Environment

flowbite 4.0.1
flowbite-svelte 1.28.1
svelte 5.35.2
  
System:
    OS: Windows 11 10.0.26100
    CPU: (22) x64 Intel(R) Core(TM) Ultra 7 155H
    Memory: 12.74 GB / 31.46 GB
  Binaries:
    Node: 22.14.0 - C:\Program Files\nodejs\node.EXE
    npm: 11.4.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 142.0.7444.176
    Edge: Chromium (140.0.3485.54)
    Internet Explorer: 11.0.26100.1882

Relevant Logs / Console Output

Screenshots / GIF (optional)

No response

Additional Context (optional)

No response

Checklist

• [x] I have searched existing issues and discussions
• [x] I have provided a minimal and runnable reproduction
• [x] I am using the latest version of Flowbite-Svelte

[jjagielka]

Try that:

<Modal open={true} class="max-h-[150px] overflow-visible">
    <Toggle class="pt-[300px]"></Toggle>
</Modal>