Skip to content

Instantly share code, notes, and snippets.

@colebemis
Last active December 11, 2019 23:33
Show Gist options
  • Save colebemis/98b373eac435bf9a43516a362bcf76ff to your computer and use it in GitHub Desktop.
Save colebemis/98b373eac435bf9a43516a362bcf76ff to your computer and use it in GitHub Desktop.
Generated by XState Viz: https://xstate.js.org/viz
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
// - XState (all XState exports)
const fooMachine = Machine(
{
id: "foo",
type: "parallel",
context: {
values: {
name: ""
},
buffer: {
name: ""
}
},
states: {
visibility: {
initial: "closed",
states: {
closed: {
on: {
OPEN: "opened"
}
},
opened: {
on: {
CLOSE: "closed"
}
}
}
},
form: {
initial: "clean",
states: {
clean: {
on: {
CHANGE: {
target: "dirty",
actions: "change"
}
}
},
dirty: {
on: {
CHANGE: [
{
target: 'clean',
cond: 'isClean'
},
{
actions: "change"
}
],
RESET: {
target: "clean",
actions: "reset"
},
SUBMIT: {
target: "clean",
actions: ["submit", "close"]
}
}
}
}
}
}
},
{
actions: {
submit: assign((context, event) => ({
values: context.buffer
})),
reset: assign((context, event) => ({
buffer: context.values
})),
change: assign((context, event) => ({
buffer: event.values
})),
close: send("CLOSE")
},
guards: {
isClean: (context, event) => context.values.name === event.value.name
}
}
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment