tomByrer

const verifyChoice = Machine({
  id: 'vc',
  type: 'parallel',
  states: {
    choiceA: {
      initial: 'empty',
      states: {
        empty: {
          on: {
            CLICK: 'selected',

tomByrer

const verifyChoice = Machine({
  id: 'vc',
  type: 'parallel',
  states: {
    choiceA: {
      initial: 'empty',
      states: {
        empty: {
          on: {
            CLICK: 'selected',

tomByrer

// Demostrate `raise` action
const stubbornMachine = Machine({
  id: 'raisedmo',
  initial: 'entry',
  states: {
    entry: {
      on: {
        STEP: {
          target: 'middle',
        },

tomByrer

// visulizer will not show child machine :(

const childMachine = Machine({
  id: "child",
  initial: "step1",
  states: {
    step1: {
      on: { STEP: "step2" }
    },
    step2: {

tomByrer

// orig: https://xstate.js.org/viz/?gist=41fb3365af80efff10afb782e9cf9e61
const powerstrip = Machine({
  id: 'powerstrip',
  initial: 'powerstripOff',
  states: {
    powerstripOff: {
      id: 'basementPowerstriphOff',
      on: {
        SWITCH_ON: 'poweredOn'
      }

tomByrer

// orig: https://github.com/eggheadio/eggheadio-course-notes/blob/6a4bcc537c0aa6c301d26e0c929921c18de59ef9/introduction-to-state-machines-using-xstate/notes/15_xstate-simplify-state-explosion-in-xstate-through-hierarchical-states.md
const powerstrip = Machine({
  id: 'powerstrip',
  initial: 'powerstripOff',
  states: {
    powerstripOff: {
      id: 'basementPowerstriphOff',
      on: {
        SWITCH_ON: 'poweredOn'
      }

tomByrer

// source: https://egghead.io/lessons/xstate-simplify-state-explosion-in-xstate-through-hierarchical-states
const door = Machine({
  id: 'door',
  initial: 'locked',
  states: {
    locked: {
      id: 'locked',
      on: {
        UNLOCK: 'unlocked'
      }

tomByrer

const spinnerMachine = Machine({
  id: 'spinner',
  initial: 'powerStripOff',
  states: {
    powerStripOff: {
      on: {
        SWITCH_ON: 'powerStripOn',
      },
    },
    powerStripOn: {

tomByrer

const spinnerMachine = Machine({
  id: 'spinner',
  initial: 'stopped',
  states: {
    stopped: {
      on: {
        FOOT_DOWN: 'running',
      },
    },
    running: {

tomByrer

const radioGroup = Machine(
  {
    id: "radioGroup",
    initial: "emptied",
    context: {
      selected: "",
    },
    states: {
      emptied: {
        on: {