sandiiarov/use-simple-undo

🔄 Simple solution to handle undo\redo turned into React Hooks

Use Simple Undo - Simple solution to handle undo\redo turned into React Hooks. Read about Hooks feature.

Documentation

https://sandiiarov.github.io/use-simple-undo

Installation

Note: React 16.8+ is required for Hooks.

With npm

npm i use-simple-undo

Or with yarn

yarn add use-simple-undo

Usage

import useSimpleUndo from 'use-simple-undo';

const Counter = () => {
  const [state, cursor, setValue, { undo, redo }] = useSimpleUndo(0);

  const value = state[cursor];

  const increment = () => setValue(value + 1);
  const decrement = () => setValue(value - 1);

  return (
    <>
      <div>{value}</div>
      <button onClick={increment}>increment</button>
      <button onClick={decrement}>decrement</button>
      <button onClick={undo}>undo</button>
      <button onClick={redo}>redo</button>
    </>
  );
};