🚗Quick Start

You can try it on StackBlitz or CodeSandbox

Or install locally

yarn add immer zustand zoov

After installation, you can define your state module, and use it in a component.

Basic Example

import React, { FC, memo } from 'react';
import { defineModule } from '../../src';

const CounterModule = defineModule({ count: 0 })
  .actions({
    add: (draft, payload: number = 1) => (draft.count += payload),
    minus: (draft, payload: number = 1) => (draft.count -= payload),
  })
  .computed({
    doubled: (state) => state.count * 2,
  })
  .build();

const { use: useCounter, useComputed: useCounterComputed } = CounterModule;

function BasicUsage = memo(() => {
  const [{ count }, { add, minus }] = useCounter();
  const { doubled } = useCounterComputed();

  return (
    <div>
      <h3>Basic Usage</h3>
      <p>
        count: <b style={{ marginRight: 20 }}>{count}</b> doubled: <b>{doubled}</b>
      </p>
      <button onClick={() => minus(1)}>-1</button>
      <button onClick={() => add(1)}>+1</button>
      <button onClick={addTwo}>+2</button>
    </div>
  );
});