Programmatically created "link button" loose style and focus

[ouvreboite]

Describe the bug

I'm playing with web-awesome in svelte kit, and the wa-button with href somehow "loose" their style and can no longer be focused when I'm navigating (using SvelteKit's SPA mode).
I reproduced it in a more minimal way, and it also happens when a new wa-button is dynamically created (except for first one 🤷).
Non-link button looks fine.

To Reproduce

Steps to reproduce the behavior:

1. Create a new bare bone svelte project: npm create vite@latest
2. Update the index.html to include the webawesome CSS and script

<link rel="stylesheet" href="https://early.webawesome.com/[email protected]/dist/styles/themes/default.css" />
<link rel="stylesheet" href="https://early.webawesome.com/[email protected]/dist/styles/webawesome.css" />
<script type="module" src="https://early.webawesome.com/[email protected]/dist/webawesome.loader.js"></script>

4. Purge src/app.css
5. Replace src/App.svelte with

<script>
  let buttons = $state([]);

  function createLinkButton() {
    buttons.push('wa-button as link');
  }
</script>

<button class="wa-brand" onclick={createLinkButton}>Create new wa-button with link
</button>
<hr />
{#each buttons as button}
  <wa-button href="/">{button}</wa-button>
{/each}

Screenshots

20250221-1000-33.3201258.mp4

⬆ The first button created is fine, the subsequent ones loose their bakcground color and are no longer focusable

Browser / OS

• OS: Windows
• Browser: Chrome
• Browser version: 133.0.6943.127

Additional information

Provide any additional information about the bug here.