rewow

Declarative state management for React

Counter App using pure function to modify state

import React from 'react';
import {createStore, useStore} from 'rewow';
const store = createStore({count: 0});
// an action is pure function, just returns next state
const Increase = (payload, state) => ({...state, count: state.count + 1});
const App = () => {
  const {count, dispatch} = useStore(store, state => ({count: state.count}));
  return (
    <>
      <h1>{count}</h1>
      <button onClick={() => dispatch(Increase)}>Increase</button>
    </>
  );
};

Using declarative syntax instead of pure state mutating function

import {mutate, add} from 'rewow';
const Increase = () => mutate({count: add(1)});

Conditional state mutating

import {mutate, add, cond} from 'rewow';
const isEvent = value => value % 2 === 0;
const Increase = () => mutate({count: cond({if: isEvent, then: add(1)})});