Skip to content

Actions

Actions are fire-and-forget functions that run on a transition. They receive { context, setContext, event, send, computed } and run in order.

import { machine } from '@dunky-dev/state-machine'
const m = machine({
initial: 'idle',
context: { saved: false },
states: {
idle: {
on: {
save: {
actions: [$ => $.setContext({ saved: true }), $ => console.log('saved!')],
},
},
},
},
})

act() is shorthand for a context-writing action — drops the $ => $.setContext(...) wrapper. Takes one or many patches (applied in order; a later patch function sees earlier writes):

import { act } from '@dunky-dev/state-machine'
on: {
save: { actions: act({ saved: true }) },
bump: { actions: act({ touched: true }, $ => ({ n: $.context.n + 1 })) },
}

Run actions whenever a state is entered or left — regardless of which transition triggered it:

states: {
open: {
entry: ['focusFirstItem'],
exit: ['restoreFocus'],
on: { close: { target: 'closed' } },
},
closed: {},
}

Pick one branch of actions by guard. First passing branch wins; a guardless branch is the fallback:

import { oneOf } from '@dunky-dev/state-machine'
actions: [
oneOf(
{ guard: 'isMobile', actions: 'lockScroll' },
{ guard: 'isDesktop', actions: 'dimBackground' },
{ actions: 'noop' }, // guardless = fallback
),
]

Reference an action by string and define it in implementations.actions:

machine({
initial: 'idle',
context: {},
states: {
idle: {
on: { ping: { actions: 'notify' } },
},
},
implementations: {
actions: {
notify: () => console.log('ping!'),
},
},
})