Xstate Redux
Redux middleware/reducer to use xstate with redux
Installation
NPM:
$ npm install --save xstate-redux
Yarn:
yarn add xstate-redux
Import
In ES6:
Use with redux
Create store:
const machine = const reduxMachine = machine const reducers = xstate: reduxMachineconst middlewares = reduxMachine const store =
Make a transition with dispatch
:
console// Initial state => { xstate: 'green' } store console// State after transition => { xstate: 'yellow' }
Code splitting: For code splitting, we need to create a new machine.
import'./red_state'
API
resetMachineStateAction
(Function)
Returns reset machine state action
combineLazyReducers
(Function)
Returns set machine state action
Arguments:
newState
(Object): new current machine state
XSTATE_RESET_MACHINE_STATE
(String)
reset machine state action type
XSTATE_SET_MACHINE_STATE
(String)
set machine state action type
XstateRedux
(ES6 Class)
Enable code splitting for redux middlewares
Constructor:
machine
: xstate machine
Methods:
- createMiddleware(options): returns redux middleware
options={}
:getState=defaultGetState
: use to retreive machine state in redux store (usefull if you don't want to call your reducerxstate
). This function receivedstore.getState()
as first argument and must return current machine state.
- createReducer(): returns redux reducer
- setMachine(machine): set current machine
machine
(Machine): xstate machine