useCounter
Basic counter with utility functions.
Usage #
Count: 1
- Svelte
<script lang="ts">
import { Button } from 'flowbite-svelte'
import { useCounter } from 'sveltuse'
const { count, inc, dec, set, reset } = useCounter(1, { min: 0, max: 100 })
</script>
<div>
<div class="mb-3">
Count: {$count}
</div>
<div class="flex flex-wrap -ml-3 -mt-3">
<Button class="ml-3 mt-3" color="blue" on:click={() => inc()}>
Increment
</Button>
<Button class="ml-3 mt-3" color="yellow" on:click={() => dec()}>
Decrement
</Button>
<Button class="ml-3 mt-3" color="blue" on:click={() => inc(5)}>
Increment (+5)
</Button>
<Button class="ml-3 mt-3" color="yellow" on:click={() => dec(5)}>
Decrement (-5)
</Button>
<Button class="ml-3 mt-3" color="green" on:click={() => set(99)}>
Set (99)
</Button>
<Button class="ml-3 mt-3" color="red" on:click={() => reset()}>
Reset
</Button>
</div>
</div>