A fork of ankurrsinghal/svelte-legos, hopefully with more consistent releases and maintenance.
Collection of essential Svelte Composition Utilities
- 🎪 Interactive docs & demos
- âš¡ Fully tree shakeable: Only take what you want, [bundle size]
- 🦾 Type Strong: Written in TypeScript, with TS Docs
- 🔋 SSR Friendly
- 🌎 No bundler required: Usable via CDN
- 🔩 Flexible: Configurable event filters and targets
<script lang="ts">
import { counterStore } from "@sveltelegos-blue/svelte-legos";
const { counter, inc, dec, set, reset } = counterStore();
</script>
<button onclick={() => inc()}>Increment</button>
{counter}
<button onclick={() => dec()}>Decrement</button><script lang="ts">
import { clickOutsideAction } from "@sveltelegos-blue/svelte-legos";
let hidden = false;
function handleClickOutside() {
hidden = !hidden;
}
</script>
<div class="modal" use:clickOutsideAction on:clickoutside={handleClickOutside} />Refer to functions list or documentations for more details.
npm i @sveltelegos-blue/svelte-legosnpm run dev- Actual dark mode design, not just haphazard application of colours where they look good.
- Styles consolidation (ie. actual themes)
- Dark mode on demo components in /guides.
Contributions to these lofty goals are welcome.
This project is heavily inspired by the following awesome projects.