sveltekit-devtools-store

Svelte store dengan integrasi Redux DevTools + actions pattern.

✨ Fitur

• 🔗 Integrasi Redux DevTools (time-travel debugging)
• 🎯 Actions pattern untuk terpusat state mutation
• 🛡️ SSR-safe (SvelteKit compatible)
• 🧩 TypeScript first, fully typed
• 📦 Tree-shakable, ESM + CJS support

📦 Install

npm install sveltekit-devtools-store
# atau
pnpm add sveltekit-devtools-store
# atau
yarn add sveltekit-devtools-store

🚀 Quick Start

// src/lib/stores/counter.ts
import { createDevtoolsStore } from "sveltekit-devtools-store";

export const counter = createDevtoolsStore(
  { name: "🔢 Counter" },
  0,
  ({ set, update }) => ({
    increment: () => update((n) => n + 1),
    decrement: () => update((n) => n - 1),
    reset: () => set(0),
    set: (value: number) => set(value),
  }),
);

<!-- +page.svelte -->
<script lang="ts">
  import { counter } from '$lib/stores/counter';
</script>

<p>Count: {$counter}</p>
<button onclick={counter.increment}>+</button>
<button onclick={counter.decrement}>-</button>

📝 API Reference

createDevtoolsStore(name, initialState, buildActions)

Creates a Svelte store with Redux DevTools integration.

Parameters:

• name (string) - Nama store (muncul di DevTools)
• initialState (T) - State awal store
• buildActions (function) - Fungsi yang menerima {set, update} dan mengembalikan actions object

Returns:

• Readable<T> & A - Svelte store dengan tambahan actions