bug: Navbar Toggle Button Not Working On Svelte

[refaldyrk]

What version of FlyonUI are you using?

stable

Which browsers are you seeing the problem on?

Chrome

Reproduction URL

...

Describe your issue

<nav class="navbar rounded-box flex w-full gap-2 shadow max-md:flex-col md:items-center">
  <div class="flex w-full items-center justify-between">
    <div class="navbar-start items-center justify-between max-md:w-full">
      <a class="link text-base-content/90 link-neutral text-xl font-semibold no-underline" href="#">
        FlyonUI
      </a>
      <div class="md:hidden">
        <button type="button" class="collapse-toggle btn btn-outline btn-secondary btn-sm btn-square" data-collapse="#default-navbar-collapse" aria-controls="default-navbar-collapse" aria-label="Toggle navigation">
          <span class="icon-[tabler--menu-2] collapse-open:hidden size-4"></span>
          <span class="icon-[tabler--x] collapse-open:block hidden size-4"></span>
        </button>
      </div>
    </div>
  </div>
  <div id="default-navbar-collapse" class="md:navbar-end collapse hidden grow basis-full overflow-hidden transition-[height] duration-300 max-md:w-full">
    <ul class="menu md:menu-horizontal gap-2 p-0 text-base">
      <li><a href="#">Home</a></li>
      <li><a href="#">Services</a></li>
      <li><a href="#">Contact us</a></li>
    </ul>
  </div>
</nav>

On Mobile Screen The Navbar Not Working

[github-actions[bot]]

Hi @refaldyrk

Thank you for your support in helping us improve FlyonUI!

We’ve received your submission and will respond within few business days. Our team handles issues one at a time, and we’ll be reviewing yours as soon as possible.

In the meantime, any additional details or a reproducible example would be greatly appreciated and will help us resolve the issue more efficiently.

Thank you for your patience and understanding!

[PruthviPraj00]

Hi @refaldyrk,

The navbar toggle button depends on the collapse plugin, so please ensure that the necessary JavaScript steps are included.

For your reference, you can consult the quick start guide.

We will soon release comprehensive documentation for Svelte.

Best regards.

[refaldyrk]

I have imported everything needed and have followed the documentation, yes there may be some adjustments in svelte, and I hope the developer can add documentation for svelte, because flyon is very awesome, I can't wait.

[PruthviPraj00]

Hello @refaldyrk,

We've updated our framework guide, and you can check it out here:

https://flyonui.com/docs/getting-started/framework-guides/

Additionally, you can explore the Svelte guide, which now includes a StackBlitz example:

https://flyonui.com/framework-integrations/svelte/

Best regards.