Subscribes to a StateMachine instance and re-renders on transitions. Optionally accepts a selector to narrow the context and prevent unnecessary re-renders when unrelated context values change.
Optional
const machine = new StateMachine({ ... }); function Counter() { const { state, context, send } = useStateMachine(machine); return <button onClick={() => send('INCREMENT')}>{context.count}</button>; } Copy
const machine = new StateMachine({ ... }); function Counter() { const { state, context, send } = useStateMachine(machine); return <button onClick={() => send('INCREMENT')}>{context.count}</button>; }
// With selector — only re-renders when `count` changes const { context: count } = useStateMachine(machine, (ctx) => ctx.count); Copy
// With selector — only re-renders when `count` changes const { context: count } = useStateMachine(machine, (ctx) => ctx.count);
Subscribes to a StateMachine instance and re-renders on transitions. Optionally accepts a selector to narrow the context and prevent unnecessary re-renders when unrelated context values change.