history

This middleware makes it really easy to add undo/redo functionality to your app. It wraps any writable with any data type and provides an augmented store with an history API which has undo and redo methods and two derived store properties canUndo and canRedo.

Demo

0

Usage

<script lang="ts">
import { history } from "svelte-legos";
import { writable } from "svelte/store";

const counter = history(writable(0));
const { undo, redo canRedo, canUndo } = counter.history;
</script>

<button disabled={!$canUndo} on:click={undo}>Undo</button>
<button disabled={!$canRedo} on:click={redo}>Redo</button>

{$counter}

<button on:click={() => $counter++}>Increment</button>