svelte-headlessui icon indicating copy to clipboard operation
svelte-headlessui copied to clipboard

How am I supposed to get the value from this component?

Open Loizzus opened this issue 7 months ago • 2 comments

For a switch in rgossiaux headlessUI I would use something like this:

<Switch bind:checked={bowl.Display} class={bowl.Display ? 'switch switch-enabled' : 'switch switch-disabled'}>
  <span class="sr-only">Enable notifications</span>
  <span class="toggle" class:toggle-on={bowl.Display} class:toggle-off={!bowl.Display} />
</Switch>

Where the bind:checked was how I would set the value and have it be changed.

But in my similar implementation for this library:

<button class="switch" use:sw.toggle>
  <span class="sr-only">Use setting</span>
  <span aria-hidden="true" class="{$sw.checked ? 'switch-enabled2' : 'switch-disabled2'} toggle"  />
</button>

I'm unsure what is the correct way to bind this switch with a value. The documentation seems to gloss over this.

Loizzus avatar Nov 16 '23 02:11 Loizzus