Svelte5 TypeStore

Minimal class-based wrapper over native Svelte stores with decorator support.

• 🪶 Tiny: <500 byte gzipped
• 🧱 Built on: native Svelte Store
• 🧩 Decorators - simple API via @Prop() and @Derived
• 🎯 Typed - full TypeScript support for reactive state & computed values

Installation

npm install sveltejs-typestore

Usage

// src/store.ts
import { SvelteStore, Prop, Derived } from 'sveltejs-typestore';

export class Counter extends SvelteStore {
  @Prop({ default: 0 })
  public count: number;

  @Derived()
  public double(): number {
    return this.count * 2;
  }
}

<!-- src/App.svelte -->
<script lang=ts>
  import { Counter } from './store.ts';
  const counter = new Counter();
</script>

<p>Count: {$counter.count}</p>
<p>Double: {$counter.double()}</p>

<button onclick={() => counter.update((v) => ({ ...v, count: v.density + 1 }))}>+</button>
<button onclick={() => $counter.count--}>+</button>

<input bind:value={$counter.count} />

License

MIT

Inspired by Svelte's Stores and TypeORM.
Built with ❤️ for cleaner and more scalable store logic.