Taggable
A boolean switcher.
Usage
<script>
import { taggable } from "@sveu/shared"
const { toggled, toggle } = taggable()
</script>
<div>
<h1>{$toggled ? "On" : "Off"}</h1>
<button
on:click="{() => toggle()}">Toggle</button>
</div><script>
import { taggable } from "@sveu/shared"
const { toggled, toggle } = taggable()
</script>
<div>
<h1>{$toggled ? "On" : "Off"}</h1>
<button
on:click="{() => toggle()}">Toggle</button>
</div>svelte
Example
Off
<script>
import { taggable } from "@sveu/shared"
const { toggled, toggle } = taggable()
</script>
<div class="flex flex-col space-y-3 mx-20 mt-20 text-center">
<h1>{$toggled ? "On" : "Off"}</h1>
<button
on:click="{toggle}"
>Toggle</button>
</div><script>
import { taggable } from "@sveu/shared"
const { toggled, toggle } = taggable()
</script>
<div class="flex flex-col space-y-3 mx-20 mt-20 text-center">
<h1>{$toggled ? "On" : "Off"}</h1>
<button
on:click="{toggle}"
>Toggle</button>
</div>svelte
1
2
3
4
5
6
7
8
9
10
11
12
13
Click fold/expand code
API
Arguments
| Name | Description | Type | Required |
|---|---|---|---|
| value | Initial value | MaybeStore<boolean> | No |
Returns
| Name | Description |
|---|---|
| toggle, toggled | Toggle function and toggled value |
| toggled | If the value is writable store to will return a function to update the value of the store |