How to use the xstate.Machine function in xstate

rejected: {};
  };
}

// The events that the machine handles
type ResolveEvent = { type: 'RESOLVE'; results: any[] };
type RejectEvent = { type: 'REJECT'; message: string };
type FetchEvents = { type: 'FETCH' } | ResolveEvent | RejectEvent;

// The context (extended state) of the machine
interface FetchContext {
  results?: any[];
  message?: string;
}

export const fetchMachine = Machine(
  {
    id: 'fetch',
    initial: 'idle',
    context: {},
    states: {
      idle: {
        on: { FETCH: 'pending' }
      },
      pending: {
        invoke: {
          src: 'fetchData',
          onDone: { target: 'fulfilled', actions: 'setResults' },
          onError: { target: 'rejected', actions: 'setMessage' }
        }
      },
      fulfilled: {

pending: {
      on: {
        RESOLVE: "resolved",
        REJECT: "rejected"
      }
    },
    resolved: {
      type: "final"
    },
    rejected: {
      type: "final"
    }
  }
});

const starWarsMachine = Machine({
  id: "starWars",
  initial: "idle",
  states: {
    idle: {
      on: {
        REQUEST: {
          target: "pending",
          actions: ["alertStartingFirstRequest"]
        }
      },
      onExit: "alertMayTheForceBeWithYou"
    },
    pending: {
      on: {
        SUCCESS: "fulfilled",
        FAILURE: "rejected"

var addMachine = function addMachine(storeName, machine) {
    console.log('vsm-plugin:addMachine():storeName=' + storeName);
    return store.dispatch({
      type: moduleName + '/addMachine',
      machineName: storeName,
      machine: xstate.Machine(machine)
    });
  };

const { Machine } = require('xstate')

const echoMachine = Machine({
  id: 'echo',
  initial: 'listening',
  states: {
    listening: {
      on: {
        SPEAK: {},
        ECHO: {
          actions: () => {
            console.log('echo, echo')
          },
        },
      },
    },
  },
})

import { Machine } from 'xstate'

const lightBulbMachine = Machine({
  id: 'lightBulb',
  initial: 'unlit',
  states: {
    lit: {
      on: {
        BREAK: 'broken',
        TOGGLE: 'unlit'
      }
    },
    unlit: {
      on: {
        BREAK: 'broken',
        TOGGLE: 'lit'
      }
    },
    broken: {}

import { Machine } from 'xstate'
import * as actions from './actions'
import * as services from './services'
import * as guards from './guards'
import { fsm } from './fsm'

export const machine = Machine(
	fsm,
	{
		actions,
		services,
		guards,
	},
)

const { Machine, assign } = require('xstate')

const { log } = require('../components/Log')

const machine = Machine({
  id: 'ui',
  strict: true,
  type: 'parallel',
  context: {
    selection: null,
    locked: false
  },
  states: {
    controls: {
      initial: 'home',
      states: {
        home: {
          on: {
            'GO_ADD': 'add',
            'TOGGLE_SETTINGS': 'settings',
            'GO_PROPERTIES': 'properties'

assignUser: assign((_, event) => ({
        user: event.userInfo
      })),
      assignErrors: assign((_, event) => ({
        errors: Object.keys(event.errors || {}).map(
          key => `${key} ${event.errors[key]}`
        )
      })),
      loginSuccess: (ctx, _) => {
        localStorage.setItem('jwtToken', ctx.user.token);
        this.router.navigateByUrl('');
      }
    }
  };

  private _authMachine = Machine(
    authMachineConfig
  ).withConfig(this.authMachineOptions);
  private service = interpret(this._authMachine, { devTools: true }).start();

  authState$ = fromEventPattern<[State, EventObject]>(
    handler => {
      return this.service.onTransition(handler);
    },
    (_, service) => service.stop()
  ).pipe(map(([state, _]) => state));

  send(event: AuthEvent) {
    this.service.send(event);
  }

  constructor(private authService: AuthService, private router: Router) {}

const { assign, interpret, Machine } = require('xstate')

const multiColoredBulbMachine = Machine(
  {
    id: 'multiColoredBulb',
    initial: 'unlit',
    context: {
      color: '#fff',
    },
    states: {
      lit: {
        on: {
          BREAK: 'broken',
          TOGGLE: 'unlit',
          CHANGE_COLOR: {
            actions: ['changeColor'],
          },
        },
      },