xstate 5.0.0-beta.15 → 5.0.0-beta.16

package/dist/{actions-d71ac253.development.cjs.js → actions-0f903c0d.development.cjs.js}

@@ -37,7 +37,7 @@ var dev_dist_xstateDev = require('../dev/dist/xstate-dev.development.cjs.js');
 let ActionTypes = /*#__PURE__*/function (ActionTypes) {
   ActionTypes["Stop"] = "xstate.stop";
   ActionTypes["Raise"] = "xstate.raise";
-  ActionTypes["Send"] = "xstate.send";
+  ActionTypes["SendTo"] = "xstate.sendTo";
   ActionTypes["Cancel"] = "xstate.cancel";
   ActionTypes["Assign"] = "xstate.assign";
   ActionTypes["After"] = "xstate.after";
@@ -63,7 +63,7 @@ let SpecialTargets = /*#__PURE__*/function (SpecialTargets) {
 // xstate-specific action types
 const stop$1 = ActionTypes.Stop;
 const raise$1 = ActionTypes.Raise;
-const send$1 = ActionTypes.Send;
+const sendTo$1 = ActionTypes.SendTo;
 const cancel$1 = ActionTypes.Cancel;
 const assign$1 = ActionTypes.Assign;
 const after$1 = ActionTypes.After;
@@ -81,7 +81,7 @@ var actionTypes = /*#__PURE__*/Object.freeze({
   __proto__: null,
   stop: stop$1,
   raise: raise$1,
-  send: send$1,
+  sendTo: sendTo$1,
   cancel: cancel$1,
   assign: assign$1,
   after: after$1,
@@ -306,22 +306,19 @@ function isDynamicAction(action) {
 }
 
 /**
- * Sends an event. This returns an action that will be read by an interpreter to
- * send the event in the next step, after the current step is finished executing.
- *
- * @deprecated Use the `sendTo(...)` action creator instead.
+ * Sends an event to an actor.
  *
- * @param eventOrExpr The event to send.
- * @param options Options to pass into the send event:
+ * @param actor The `ActorRef` to send the event to.
+ * @param event The event to send, or an expression that evaluates to the event to send
+ * @param options Send action options
  *  - `id` - The unique send event identifier (used with `cancel()`).
  *  - `delay` - The number of milliseconds to delay the sending of the event.
- *  - `to` - The target of this event (by default, the machine the event was sent from).
  */
-function send(eventOrExpr, options) {
+function sendTo(actor, eventOrExpr, options) {
   return createDynamicAction({
-    type: send$1,
+    type: sendTo$1,
     params: {
-      to: options ? options.to : undefined,
+      to: actor,
       delay: options ? options.delay : undefined,
       event: eventOrExpr,
       id: options && options.id !== undefined ? options.id : isFunction(eventOrExpr) ? eventOrExpr.name : eventOrExpr.type
@@ -331,7 +328,7 @@ function send(eventOrExpr, options) {
     state
   }) => {
     const params = {
-      to: options ? options.to : undefined,
+      to: actor,
       delay: options ? options.delay : undefined,
       event: eventOrExpr,
       // TODO: don't auto-generate IDs here like that
@@ -379,13 +376,12 @@ function send(eventOrExpr, options) {
       targetActorRef = resolvedTarget || actorContext?.self;
     }
     const resolvedAction = {
-      type: send$1,
+      type: sendTo$1,
       params: {
         ...params,
         to: targetActorRef,
         event: resolvedEvent,
-        delay: resolvedDelay,
-        internal: resolvedTarget === SpecialTargets.Internal
+        delay: resolvedDelay
       },
       execute: actorCtx => {
         const sendAction = resolvedAction;
@@ -415,12 +411,8 @@ function send(eventOrExpr, options) {
  * @param options Options to pass into the send event.
  */
 function sendParent(event, options) {
-  return send(event, {
-    ...options,
-    to: SpecialTargets.Parent
-  });
+  return sendTo(SpecialTargets.Parent, event, options);
 }
-
 /**
  * Forwards (sends) an event to a specified service.
  *
@@ -438,12 +430,9 @@ function forwardTo(target, options) {
       return resolvedTarget;
     };
   }
-  return send(({
+  return sendTo(target, ({
     event
-  }) => event, {
-    ...options,
-    to: target
-  });
+  }) => event, options);
 }
 
 /**
@@ -459,25 +448,7 @@ function escalate(errorData, options) {
       type: error$1,
       data: isFunction(errorData) ? errorData(arg) : errorData
     };
-  }, {
-    ...options,
-    to: SpecialTargets.Parent
-  });
-}
-
-/**
- * Sends an event to an actor.
- *
- * @param actor The `ActorRef` to send the event to.
- * @param event The event to send, or an expression that evaluates to the event to send
- * @param options Send action options
- * @returns An XState send action object
- */
-function sendTo(actor, event, options) {
-  return send(event, {
-    ...options,
-    to: actor
-  });
+  }, options);
 }
 
 const cache = new WeakMap();
@@ -531,8 +502,6 @@ function cancel(sendId) {
   });
 }
 
-const symbolObservable = (() => typeof Symbol === 'function' && Symbol.observable || '@@observable')();
-
 class Mailbox {
   constructor(_process) {
     this._process = _process;
@@ -600,698 +569,317 @@ class Mailbox {
   }
 }
 
-function createSystem() {
-  let sessionIdCounter = 0;
-  const children = new Map();
-  const keyedActors = new Map();
-  const reverseKeyedActors = new WeakMap();
-  const system = {
-    _bookId: () => `x:${sessionIdCounter++}`,
-    _register: (sessionId, actorRef) => {
-      children.set(sessionId, actorRef);
-      return sessionId;
-    },
-    _unregister: actorRef => {
-      children.delete(actorRef.sessionId);
-      const systemId = reverseKeyedActors.get(actorRef);
-      if (systemId !== undefined) {
-        keyedActors.delete(systemId);
-        reverseKeyedActors.delete(actorRef);
-      }
+const symbolObservable = (() => typeof Symbol === 'function' && Symbol.observable || '@@observable')();
+
+/**
+ * Returns actor logic from a transition function and its initial state.
+ *
+ * A transition function is a function that takes the current state and an event and returns the next state.
+ *
+ * @param transition The transition function that returns the next state given the current state and event.
+ * @param initialState The initial state of the transition function.
+ * @returns Actor logic
+ */
+function fromTransition(transition, initialState) {
+  const logic = {
+    config: transition,
+    transition: (state, event, actorContext) => {
+      return transition(state, event, actorContext);
     },
-    get: systemId => {
-      return keyedActors.get(systemId);
+    getInitialState: (_, input) => {
+      return typeof initialState === 'function' ? initialState({
+        input
+      }) : initialState;
     },
-    _set: (systemId, actorRef) => {
-      const existing = keyedActors.get(systemId);
-      if (existing && existing !== actorRef) {
-        throw new Error(`Actor with system ID '${systemId}' already exists.`);
-      }
-      keyedActors.set(systemId, actorRef);
-      reverseKeyedActors.set(actorRef, systemId);
-    }
+    getSnapshot: state => state,
+    getPersistedState: state => state,
+    restoreState: state => state
   };
-  return system;
+  return logic;
 }
 
-let ActorStatus = /*#__PURE__*/function (ActorStatus) {
-  ActorStatus[ActorStatus["NotStarted"] = 0] = "NotStarted";
-  ActorStatus[ActorStatus["Running"] = 1] = "Running";
-  ActorStatus[ActorStatus["Stopped"] = 2] = "Stopped";
-  return ActorStatus;
-}({});
-const defaultOptions = {
-  deferEvents: true,
-  clock: {
-    setTimeout: (fn, ms) => {
-      return setTimeout(fn, ms);
+const resolveEventType = '$$xstate.resolve';
+const rejectEventType = '$$xstate.reject';
+function fromPromise(
+// TODO: add types
+promiseCreator) {
+  // TODO: add event types, consider making the `PromiseEvent` a private type or smth alike
+  const logic = {
+    config: promiseCreator,
+    transition: (state, event) => {
+      if (state.status !== 'active') {
+        return state;
+      }
+      switch (event.type) {
+        case resolveEventType:
+          return {
+            ...state,
+            status: 'done',
+            data: event.data,
+            input: undefined
+          };
+        case rejectEventType:
+          return {
+            ...state,
+            status: 'error',
+            data: event.data,
+            input: undefined
+          };
+        case stopSignalType:
+          return {
+            ...state,
+            status: 'canceled',
+            input: undefined
+          };
+        default:
+          return state;
+      }
     },
-    clearTimeout: id => {
-      return clearTimeout(id);
-    }
-  },
-  logger: console.log.bind(console),
-  devTools: false
-};
-class Interpreter {
-  /**
-   * The current state of the interpreted logic.
-   */
-
-  /**
-   * The clock that is responsible for setting and clearing timeouts, such as delayed events and transitions.
-   */
-
-  /**
-   * The unique identifier for this actor relative to its parent.
-   */
-
-  /**
-   * Whether the service is started.
-   */
-
-  // Actor Ref
-
-  // TODO: add typings for system
+    start: (state, {
+      self,
+      system
+    }) => {
+      // TODO: determine how to allow customizing this so that promises
+      // can be restarted if necessary
+      if (state.status !== 'active') {
+        return;
+      }
+      const resolvedPromise = Promise.resolve(promiseCreator({
+        input: state.input,
+        system
+      }));
+      resolvedPromise.then(response => {
+        // TODO: remove this condition once dead letter queue lands
+        if (self._state.status !== 'active') {
+          return;
+        }
+        self.send({
+          type: resolveEventType,
+          data: response
+        });
+      }, errorData => {
+        // TODO: remove this condition once dead letter queue lands
+        if (self._state.status !== 'active') {
+          return;
+        }
+        self.send({
+          type: rejectEventType,
+          data: errorData
+        });
+      });
+    },
+    getInitialState: (_, input) => {
+      return {
+        status: 'active',
+        data: undefined,
+        input
+      };
+    },
+    getSnapshot: state => state.data,
+    getStatus: state => state,
+    getPersistedState: state => state,
+    restoreState: state => state
+  };
+  return logic;
+}
 
-  /**
-   * The globally unique process ID for this invocation.
-   */
+// TODO: this likely shouldn't accept TEvent, observable actor doesn't accept external events
+function fromObservable(observableCreator) {
+  const nextEventType = '$$xstate.next';
+  const errorEventType = '$$xstate.error';
+  const completeEventType = '$$xstate.complete';
 
-  /**
-   * Creates a new Interpreter instance (i.e., service) for the given logic with the provided options, if any.
-   *
-   * @param logic The logic to be interpreted
-   * @param options Interpreter options
-   */
-  constructor(logic, options) {
-    this.logic = logic;
-    this._state = void 0;
-    this.clock = void 0;
-    this.options = void 0;
-    this.id = void 0;
-    this.mailbox = new Mailbox(this._process.bind(this));
-    this.delayedEventsMap = {};
-    this.observers = new Set();
-    this.logger = void 0;
-    this.status = ActorStatus.NotStarted;
-    this._parent = void 0;
-    this.ref = void 0;
-    this._actorContext = void 0;
-    this._systemId = void 0;
-    this.sessionId = void 0;
-    this.system = void 0;
-    this._doneEvent = void 0;
-    this.src = void 0;
-    this._deferred = [];
-    const resolvedOptions = {
-      ...defaultOptions,
-      ...options
-    };
-    const {
-      clock,
-      logger,
-      parent,
+  // TODO: add event types
+  const logic = {
+    config: observableCreator,
+    transition: (state, event, {
+      self,
       id,
-      systemId
-    } = resolvedOptions;
-    const self = this;
-    this.system = parent?.system ?? createSystem();
-    if (systemId) {
-      this._systemId = systemId;
-      this.system._set(systemId, this);
-    }
-    this.sessionId = this.system._bookId();
-    this.id = id ?? this.sessionId;
-    this.logger = logger;
-    this.clock = clock;
-    this._parent = parent;
-    this.options = resolvedOptions;
-    this.src = resolvedOptions.src;
-    this.ref = this;
-    this._actorContext = {
+      defer
+    }) => {
+      if (state.status !== 'active') {
+        return state;
+      }
+      switch (event.type) {
+        case nextEventType:
+          // match the exact timing of events sent by machines
+          // send actions are not executed immediately
+          defer(() => {
+            self._parent?.send({
+              type: `xstate.snapshot.${id}`,
+              data: event.data
+            });
+          });
+          return {
+            ...state,
+            data: event.data
+          };
+        case errorEventType:
+          return {
+            ...state,
+            status: 'error',
+            input: undefined,
+            data: event.data,
+            subscription: undefined
+          };
+        case completeEventType:
+          return {
+            ...state,
+            status: 'done',
+            input: undefined,
+            subscription: undefined
+          };
+        case stopSignalType:
+          state.subscription.unsubscribe();
+          return {
+            ...state,
+            status: 'canceled',
+            input: undefined,
+            subscription: undefined
+          };
+        default:
+          return state;
+      }
+    },
+    getInitialState: (_, input) => {
+      return {
+        subscription: undefined,
+        status: 'active',
+        data: undefined,
+        input
+      };
+    },
+    start: (state, {
       self,
-      id: this.id,
-      sessionId: this.sessionId,
-      logger: this.logger,
-      defer: fn => {
-        this._deferred.push(fn);
-      },
-      system: this.system,
-      stopChild: child => {
-        if (child._parent !== this) {
-          throw new Error(`Cannot stop child actor ${child.id} of ${this.id} because it is not a child`);
-        }
-        child._stop();
+      system
+    }) => {
+      if (state.status === 'done') {
+        // Do not restart a completed observable
+        return;
       }
-    };
-
-    // Ensure that the send method is bound to this interpreter instance
-    // if destructured
-    this.send = this.send.bind(this);
-    this._initState();
-  }
-  _initState() {
-    this._state = this.options.state ? this.logic.restoreState ? this.logic.restoreState(this.options.state, this._actorContext) : this.options.state : this.logic.getInitialState(this._actorContext, this.options?.input);
-  }
-
-  // array of functions to defer
-
-  update(state) {
-    // Update state
-    this._state = state;
-    const snapshot = this.getSnapshot();
+      state.subscription = observableCreator({
+        input: state.input,
+        system
+      }).subscribe({
+        next: value => {
+          self.send({
+            type: nextEventType,
+            data: value
+          });
+        },
+        error: err => {
+          self.send({
+            type: errorEventType,
+            data: err
+          });
+        },
+        complete: () => {
+          self.send({
+            type: completeEventType
+          });
+        }
+      });
+    },
+    getSnapshot: state => state.data,
+    getPersistedState: ({
+      status,
+      data,
+      input
+    }) => ({
+      status,
+      data,
+      input
+    }),
+    getStatus: state => state,
+    restoreState: state => ({
+      ...state,
+      subscription: undefined
+    })
+  };
+  return logic;
+}
 
-    // Execute deferred effects
-    let deferredFn;
-    while (deferredFn = this._deferred.shift()) {
-      deferredFn();
-    }
-    for (const observer of this.observers) {
-      observer.next?.(snapshot);
-    }
-    const status = this.logic.getStatus?.(state);
-    switch (status?.status) {
-      case 'done':
-        this._stopProcedure();
-        this._doneEvent = doneInvoke(this.id, status.data);
-        this._parent?.send(this._doneEvent);
-        this._complete();
-        break;
-      case 'error':
-        this._stopProcedure();
-        this._parent?.send(error(this.id, status.data));
-        this._error(status.data);
-        break;
-    }
-  }
-  subscribe(nextListenerOrObserver, errorListener, completeListener) {
-    const observer = toObserver(nextListenerOrObserver, errorListener, completeListener);
-    this.observers.add(observer);
-    if (this.status === ActorStatus.Stopped) {
-      observer.complete?.();
-      this.observers.delete(observer);
-    }
-    return {
-      unsubscribe: () => {
-        this.observers.delete(observer);
-      }
-    };
-  }
+/**
+ * Creates event observable logic that listens to an observable
+ * that delivers event objects.
+ *
+ *
+ * @param lazyObservable A function that creates an observable
+ * @returns Event observable logic
+ */
 
-  /**
-   * Starts the interpreter from the initial state
-   */
-  start() {
-    if (this.status === ActorStatus.Running) {
-      // Do not restart the service if it is already started
-      return this;
-    }
-    this.system._register(this.sessionId, this);
-    if (this._systemId) {
-      this.system._set(this._systemId, this);
-    }
-    this.status = ActorStatus.Running;
-    if (this.logic.start) {
-      this.logic.start(this._state, this._actorContext);
-    }
+function fromEventObservable(lazyObservable) {
+  const errorEventType = '$$xstate.error';
+  const completeEventType = '$$xstate.complete';
 
-    // TODO: this notifies all subscribers but usually this is redundant
-    // there is no real change happening here
-    // we need to rethink if this needs to be refactored
-    this.update(this._state);
-    if (this.options.devTools) {
-      this.attachDevTools();
-    }
-    this.mailbox.start();
-    return this;
-  }
-  _process(event) {
-    try {
-      const nextState = this.logic.transition(this._state, event, this._actorContext);
-      this.update(nextState);
-      if (event.type === stopSignalType) {
-        this._stopProcedure();
-        this._complete();
+  // TODO: event types
+  const logic = {
+    config: lazyObservable,
+    transition: (state, event) => {
+      if (state.status !== 'active') {
+        return state;
       }
-    } catch (err) {
-      // TODO: properly handle errors
-      if (this.observers.size > 0) {
-        this.observers.forEach(observer => {
-          observer.error?.(err);
-        });
-        this.stop();
-      } else {
-        throw err;
+      switch (event.type) {
+        case errorEventType:
+          return {
+            ...state,
+            status: 'error',
+            input: undefined,
+            data: event.data,
+            subscription: undefined
+          };
+        case completeEventType:
+          return {
+            ...state,
+            status: 'done',
+            input: undefined,
+            subscription: undefined
+          };
+        case stopSignalType:
+          state.subscription.unsubscribe();
+          return {
+            ...state,
+            status: 'canceled',
+            input: undefined,
+            subscription: undefined
+          };
+        default:
+          return state;
       }
-    }
-  }
-  _stop() {
-    if (this.status === ActorStatus.Stopped) {
-      return this;
-    }
-    this.mailbox.clear();
-    if (this.status === ActorStatus.NotStarted) {
-      this.status = ActorStatus.Stopped;
-      return this;
-    }
-    this.mailbox.enqueue({
-      type: stopSignalType
-    });
-    return this;
-  }
-
-  /**
-   * Stops the interpreter and unsubscribe all listeners.
-   */
-  stop() {
-    if (this._parent) {
-      throw new Error('A non-root actor cannot be stopped directly.');
-    }
-    return this._stop();
-  }
-  _complete() {
-    for (const observer of this.observers) {
-      observer.complete?.();
-    }
-    this.observers.clear();
-  }
-  _error(data) {
-    for (const observer of this.observers) {
-      observer.error?.(data);
-    }
-    this.observers.clear();
-  }
-  _stopProcedure() {
-    if (this.status !== ActorStatus.Running) {
-      // Interpreter already stopped; do nothing
-      return this;
-    }
-
-    // Cancel all delayed events
-    for (const key of Object.keys(this.delayedEventsMap)) {
-      this.clock.clearTimeout(this.delayedEventsMap[key]);
-    }
-
-    // TODO: mailbox.reset
-    this.mailbox.clear();
-    // TODO: after `stop` we must prepare ourselves for receiving events again
-    // events sent *after* stop signal must be queued
-    // it seems like this should be the common behavior for all of our consumers
-    // so perhaps this should be unified somehow for all of them
-    this.mailbox = new Mailbox(this._process.bind(this));
-    this.status = ActorStatus.Stopped;
-    this.system._unregister(this);
-    return this;
-  }
-
-  /**
-   * Sends an event to the running interpreter to trigger a transition.
-   *
-   * @param event The event to send
-   */
-  send(event) {
-    if (typeof event === 'string') {
-      throw new Error(`Only event objects may be sent to actors; use .send({ type: "${event}" }) instead`);
-    }
-    if (this.status === ActorStatus.Stopped) {
-      // do nothing
-      {
-        const eventString = JSON.stringify(event);
-        console.warn(`Event "${event.type.toString()}" was sent to stopped actor "${this.id} (${this.sessionId})". This actor has already reached its final state, and will not transition.\nEvent: ${eventString}`);
-      }
-      return;
-    }
-    if (this.status !== ActorStatus.Running && !this.options.deferEvents) {
-      throw new Error(`Event "${event.type}" was sent to uninitialized actor "${this.id
-      // tslint:disable-next-line:max-line-length
-      }". Make sure .start() is called for this actor, or set { deferEvents: true } in the actor options.\nEvent: ${JSON.stringify(event)}`);
-    }
-    this.mailbox.enqueue(event);
-  }
-
-  // TODO: make private (and figure out a way to do this within the machine)
-  delaySend(sendAction) {
-    this.delayedEventsMap[sendAction.params.id] = this.clock.setTimeout(() => {
-      if ('to' in sendAction.params && sendAction.params.to) {
-        sendAction.params.to.send(sendAction.params.event);
-      } else {
-        this.send(sendAction.params.event);
-      }
-    }, sendAction.params.delay);
-  }
-
-  // TODO: make private (and figure out a way to do this within the machine)
-  cancel(sendId) {
-    this.clock.clearTimeout(this.delayedEventsMap[sendId]);
-    delete this.delayedEventsMap[sendId];
-  }
-  attachDevTools() {
-    const {
-      devTools
-    } = this.options;
-    if (devTools) {
-      const resolvedDevToolsAdapter = typeof devTools === 'function' ? devTools : dev_dist_xstateDev.devToolsAdapter;
-      resolvedDevToolsAdapter(this);
-    }
-  }
-  toJSON() {
-    return {
-      id: this.id
-    };
-  }
-  getPersistedState() {
-    return this.logic.getPersistedState?.(this._state);
-  }
-  [symbolObservable]() {
-    return this;
-  }
-  getSnapshot() {
-    return this.logic.getSnapshot ? this.logic.getSnapshot(this._state) : this._state;
-  }
-}
-
-/**
- * Creates a new Interpreter instance for the given machine with the provided options, if any.
- *
- * @param machine The machine to interpret
- * @param options Interpreter options
- */
-
-function interpret(logic, options) {
-  const interpreter = new Interpreter(logic, options);
-  return interpreter;
-}
-
-/**
- * Returns actor logic from a transition function and its initial state.
- *
- * A transition function is a function that takes the current state and an event and returns the next state.
- *
- * @param transition The transition function that returns the next state given the current state and event.
- * @param initialState The initial state of the transition function.
- * @returns Actor logic
- */
-function fromTransition(transition, initialState) {
-  const logic = {
-    config: transition,
-    transition: (state, event, actorContext) => {
-      return transition(state, event, actorContext);
     },
     getInitialState: (_, input) => {
-      return typeof initialState === 'function' ? initialState({
+      return {
+        subscription: undefined,
+        status: 'active',
+        data: undefined,
         input
-      }) : initialState;
-    },
-    getSnapshot: state => state,
-    getPersistedState: state => state,
-    restoreState: state => state
-  };
-  return logic;
-}
-
-const resolveEventType = '$$xstate.resolve';
-const rejectEventType = '$$xstate.reject';
-function fromPromise(
-// TODO: add types
-promiseCreator) {
-  // TODO: add event types, consider making the `PromiseEvent` a private type or smth alike
-  const logic = {
-    config: promiseCreator,
-    transition: (state, event) => {
-      if (state.status !== 'active') {
-        return state;
-      }
-      switch (event.type) {
-        case resolveEventType:
-          return {
-            ...state,
-            status: 'done',
-            data: event.data,
-            input: undefined
-          };
-        case rejectEventType:
-          return {
-            ...state,
-            status: 'error',
-            data: event.data,
-            input: undefined
-          };
-        case stopSignalType:
-          return {
-            ...state,
-            status: 'canceled',
-            input: undefined
-          };
-        default:
-          return state;
-      }
+      };
     },
     start: (state, {
       self,
       system
     }) => {
-      // TODO: determine how to allow customizing this so that promises
-      // can be restarted if necessary
-      if (state.status !== 'active') {
+      if (state.status === 'done') {
+        // Do not restart a completed observable
         return;
       }
-      const resolvedPromise = Promise.resolve(promiseCreator({
+      state.subscription = lazyObservable({
         input: state.input,
         system
-      }));
-      resolvedPromise.then(response => {
-        // TODO: remove this condition once dead letter queue lands
-        if (self._state.status !== 'active') {
-          return;
-        }
-        self.send({
-          type: resolveEventType,
-          data: response
-        });
-      }, errorData => {
-        // TODO: remove this condition once dead letter queue lands
-        if (self._state.status !== 'active') {
-          return;
-        }
-        self.send({
-          type: rejectEventType,
-          data: errorData
-        });
-      });
-    },
-    getInitialState: (_, input) => {
-      return {
-        status: 'active',
-        data: undefined,
-        input
-      };
-    },
-    getSnapshot: state => state.data,
-    getStatus: state => state,
-    getPersistedState: state => state,
-    restoreState: state => state
-  };
-  return logic;
-}
-
-// TODO: this likely shouldn't accept TEvent, observable actor doesn't accept external events
-function fromObservable(observableCreator) {
-  const nextEventType = '$$xstate.next';
-  const errorEventType = '$$xstate.error';
-  const completeEventType = '$$xstate.complete';
-
-  // TODO: add event types
-  const logic = {
-    config: observableCreator,
-    transition: (state, event, {
-      self,
-      id,
-      defer
-    }) => {
-      if (state.status !== 'active') {
-        return state;
-      }
-      switch (event.type) {
-        case nextEventType:
-          // match the exact timing of events sent by machines
-          // send actions are not executed immediately
-          defer(() => {
-            self._parent?.send({
-              type: `xstate.snapshot.${id}`,
-              data: event.data
-            });
-          });
-          return {
-            ...state,
-            data: event.data
-          };
-        case errorEventType:
-          return {
-            ...state,
-            status: 'error',
-            input: undefined,
-            data: event.data,
-            subscription: undefined
-          };
-        case completeEventType:
-          return {
-            ...state,
-            status: 'done',
-            input: undefined,
-            subscription: undefined
-          };
-        case stopSignalType:
-          state.subscription.unsubscribe();
-          return {
-            ...state,
-            status: 'canceled',
-            input: undefined,
-            subscription: undefined
-          };
-        default:
-          return state;
-      }
-    },
-    getInitialState: (_, input) => {
-      return {
-        subscription: undefined,
-        status: 'active',
-        data: undefined,
-        input
-      };
-    },
-    start: (state, {
-      self,
-      system
-    }) => {
-      if (state.status === 'done') {
-        // Do not restart a completed observable
-        return;
-      }
-      state.subscription = observableCreator({
-        input: state.input,
-        system
-      }).subscribe({
-        next: value => {
-          self.send({
-            type: nextEventType,
-            data: value
-          });
-        },
-        error: err => {
-          self.send({
-            type: errorEventType,
-            data: err
-          });
-        },
-        complete: () => {
-          self.send({
-            type: completeEventType
-          });
-        }
-      });
-    },
-    getSnapshot: state => state.data,
-    getPersistedState: ({
-      status,
-      data,
-      input
-    }) => ({
-      status,
-      data,
-      input
-    }),
-    getStatus: state => state,
-    restoreState: state => ({
-      ...state,
-      subscription: undefined
-    })
-  };
-  return logic;
-}
-
-/**
- * Creates event observable logic that listens to an observable
- * that delivers event objects.
- *
- *
- * @param lazyObservable A function that creates an observable
- * @returns Event observable logic
- */
-
-function fromEventObservable(lazyObservable) {
-  const errorEventType = '$$xstate.error';
-  const completeEventType = '$$xstate.complete';
-
-  // TODO: event types
-  const logic = {
-    config: lazyObservable,
-    transition: (state, event) => {
-      if (state.status !== 'active') {
-        return state;
-      }
-      switch (event.type) {
-        case errorEventType:
-          return {
-            ...state,
-            status: 'error',
-            input: undefined,
-            data: event.data,
-            subscription: undefined
-          };
-        case completeEventType:
-          return {
-            ...state,
-            status: 'done',
-            input: undefined,
-            subscription: undefined
-          };
-        case stopSignalType:
-          state.subscription.unsubscribe();
-          return {
-            ...state,
-            status: 'canceled',
-            input: undefined,
-            subscription: undefined
-          };
-        default:
-          return state;
-      }
-    },
-    getInitialState: (_, input) => {
-      return {
-        subscription: undefined,
-        status: 'active',
-        data: undefined,
-        input
-      };
-    },
-    start: (state, {
-      self,
-      system
-    }) => {
-      if (state.status === 'done') {
-        // Do not restart a completed observable
-        return;
-      }
-      state.subscription = lazyObservable({
-        input: state.input,
-        system
-      }).subscribe({
-        next: value => {
-          self._parent?.send(value);
-        },
-        error: err => {
-          self.send({
-            type: errorEventType,
-            data: err
-          });
-        },
-        complete: () => {
-          self.send({
-            type: completeEventType
-          });
+      }).subscribe({
+        next: value => {
+          self._parent?.send(value);
+        },
+        error: err => {
+          self.send({
+            type: errorEventType,
+            data: err
+          });
+        },
+        complete: () => {
+          self.send({
+            type: completeEventType
+          });
         }
       });
     },
@@ -1343,92 +931,475 @@ function fromCallback(invokeCallback) {
           input: state.input,
           system
         });
-        if (isPromiseLike(state.dispose)) {
-          state.dispose.then(resolved => {
-            self._parent?.send(doneInvoke(id, resolved));
-            state.canceled = true;
-          }, errorData => {
-            state.canceled = true;
-            self._parent?.send(error(id, errorData));
-          });
-        }
-        return state;
+        if (isPromiseLike(state.dispose)) {
+          state.dispose.then(resolved => {
+            self._parent?.send(doneInvoke(id, resolved));
+            state.canceled = true;
+          }, errorData => {
+            state.canceled = true;
+            self._parent?.send(error(id, errorData));
+          });
+        }
+        return state;
+      }
+      if (event.type === stopSignalType) {
+        state.canceled = true;
+        if (isFunction(state.dispose)) {
+          state.dispose();
+        }
+        return state;
+      }
+      if (isSignal(event)) {
+        // TODO: unrecognized signal
+        return state;
+      }
+      state.receivers.forEach(receiver => receiver(event));
+      return state;
+    },
+    getInitialState: (_, input) => {
+      return {
+        canceled: false,
+        receivers: new Set(),
+        dispose: undefined,
+        input
+      };
+    },
+    getSnapshot: () => undefined,
+    getPersistedState: ({
+      input
+    }) => input
+  };
+  return logic;
+}
+
+const startSignalType = 'xstate.init';
+const stopSignalType = 'xstate.stop';
+const startSignal = {
+  type: 'xstate.init'
+};
+const stopSignal = {
+  type: 'xstate.stop'
+};
+/**
+ * An object that expresses the actor logic in reaction to received events,
+ * as well as an optionally emitted stream of values.
+ *
+ * @template TReceived The received event
+ * @template TSnapshot The emitted value
+ */
+
+function isSignal(event) {
+  return event.type === startSignalType || event.type === stopSignalType;
+}
+function isActorRef(item) {
+  return !!item && typeof item === 'object' && typeof item.send === 'function';
+}
+
+// TODO: refactor the return type, this could be written in a better way
+// but it's best to avoid unneccessary breaking changes now
+// @deprecated use `interpret(actorLogic)` instead
+function toActorRef(actorRefLike) {
+  return {
+    subscribe: () => ({
+      unsubscribe: () => void 0
+    }),
+    id: 'anonymous',
+    sessionId: '',
+    getSnapshot: () => undefined,
+    [symbolObservable]: function () {
+      return this;
+    },
+    status: ActorStatus.Running,
+    stop: () => void 0,
+    ...actorRefLike
+  };
+}
+const emptyLogic = fromTransition(_ => undefined, undefined);
+function createEmptyActor() {
+  return interpret(emptyLogic);
+}
+
+function createSystem() {
+  let sessionIdCounter = 0;
+  const children = new Map();
+  const keyedActors = new Map();
+  const reverseKeyedActors = new WeakMap();
+  const system = {
+    _bookId: () => `x:${sessionIdCounter++}`,
+    _register: (sessionId, actorRef) => {
+      children.set(sessionId, actorRef);
+      return sessionId;
+    },
+    _unregister: actorRef => {
+      children.delete(actorRef.sessionId);
+      const systemId = reverseKeyedActors.get(actorRef);
+      if (systemId !== undefined) {
+        keyedActors.delete(systemId);
+        reverseKeyedActors.delete(actorRef);
+      }
+    },
+    get: systemId => {
+      return keyedActors.get(systemId);
+    },
+    _set: (systemId, actorRef) => {
+      const existing = keyedActors.get(systemId);
+      if (existing && existing !== actorRef) {
+        throw new Error(`Actor with system ID '${systemId}' already exists.`);
+      }
+      keyedActors.set(systemId, actorRef);
+      reverseKeyedActors.set(actorRef, systemId);
+    }
+  };
+  return system;
+}
+
+let ActorStatus = /*#__PURE__*/function (ActorStatus) {
+  ActorStatus[ActorStatus["NotStarted"] = 0] = "NotStarted";
+  ActorStatus[ActorStatus["Running"] = 1] = "Running";
+  ActorStatus[ActorStatus["Stopped"] = 2] = "Stopped";
+  return ActorStatus;
+}({});
+const defaultOptions = {
+  deferEvents: true,
+  clock: {
+    setTimeout: (fn, ms) => {
+      return setTimeout(fn, ms);
+    },
+    clearTimeout: id => {
+      return clearTimeout(id);
+    }
+  },
+  logger: console.log.bind(console),
+  devTools: false
+};
+class Interpreter {
+  /**
+   * The current state of the interpreted logic.
+   */
+
+  /**
+   * The clock that is responsible for setting and clearing timeouts, such as delayed events and transitions.
+   */
+
+  /**
+   * The unique identifier for this actor relative to its parent.
+   */
+
+  /**
+   * Whether the service is started.
+   */
+
+  // Actor Ref
+
+  // TODO: add typings for system
+
+  /**
+   * The globally unique process ID for this invocation.
+   */
+
+  /**
+   * Creates a new Interpreter instance (i.e., service) for the given logic with the provided options, if any.
+   *
+   * @param logic The logic to be interpreted
+   * @param options Interpreter options
+   */
+  constructor(logic, options) {
+    this.logic = logic;
+    this._state = void 0;
+    this.clock = void 0;
+    this.options = void 0;
+    this.id = void 0;
+    this.mailbox = new Mailbox(this._process.bind(this));
+    this.delayedEventsMap = {};
+    this.observers = new Set();
+    this.logger = void 0;
+    this.status = ActorStatus.NotStarted;
+    this._parent = void 0;
+    this.ref = void 0;
+    this._actorContext = void 0;
+    this._systemId = void 0;
+    this.sessionId = void 0;
+    this.system = void 0;
+    this._doneEvent = void 0;
+    this.src = void 0;
+    this._deferred = [];
+    const resolvedOptions = {
+      ...defaultOptions,
+      ...options
+    };
+    const {
+      clock,
+      logger,
+      parent,
+      id,
+      systemId
+    } = resolvedOptions;
+    const self = this;
+    this.system = parent?.system ?? createSystem();
+    if (systemId) {
+      this._systemId = systemId;
+      this.system._set(systemId, this);
+    }
+    this.sessionId = this.system._bookId();
+    this.id = id ?? this.sessionId;
+    this.logger = logger;
+    this.clock = clock;
+    this._parent = parent;
+    this.options = resolvedOptions;
+    this.src = resolvedOptions.src;
+    this.ref = this;
+    this._actorContext = {
+      self,
+      id: this.id,
+      sessionId: this.sessionId,
+      logger: this.logger,
+      defer: fn => {
+        this._deferred.push(fn);
+      },
+      system: this.system,
+      stopChild: child => {
+        if (child._parent !== this) {
+          throw new Error(`Cannot stop child actor ${child.id} of ${this.id} because it is not a child`);
+        }
+        child._stop();
+      }
+    };
+
+    // Ensure that the send method is bound to this interpreter instance
+    // if destructured
+    this.send = this.send.bind(this);
+    this._initState();
+  }
+  _initState() {
+    this._state = this.options.state ? this.logic.restoreState ? this.logic.restoreState(this.options.state, this._actorContext) : this.options.state : this.logic.getInitialState(this._actorContext, this.options?.input);
+  }
+
+  // array of functions to defer
+
+  update(state) {
+    // Update state
+    this._state = state;
+    const snapshot = this.getSnapshot();
+
+    // Execute deferred effects
+    let deferredFn;
+    while (deferredFn = this._deferred.shift()) {
+      deferredFn();
+    }
+    for (const observer of this.observers) {
+      observer.next?.(snapshot);
+    }
+    const status = this.logic.getStatus?.(state);
+    switch (status?.status) {
+      case 'done':
+        this._stopProcedure();
+        this._doneEvent = doneInvoke(this.id, status.data);
+        this._parent?.send(this._doneEvent);
+        this._complete();
+        break;
+      case 'error':
+        this._stopProcedure();
+        this._parent?.send(error(this.id, status.data));
+        this._error(status.data);
+        break;
+    }
+  }
+  subscribe(nextListenerOrObserver, errorListener, completeListener) {
+    const observer = toObserver(nextListenerOrObserver, errorListener, completeListener);
+    this.observers.add(observer);
+    if (this.status === ActorStatus.Stopped) {
+      observer.complete?.();
+      this.observers.delete(observer);
+    }
+    return {
+      unsubscribe: () => {
+        this.observers.delete(observer);
+      }
+    };
+  }
+
+  /**
+   * Starts the interpreter from the initial state
+   */
+  start() {
+    if (this.status === ActorStatus.Running) {
+      // Do not restart the service if it is already started
+      return this;
+    }
+    this.system._register(this.sessionId, this);
+    if (this._systemId) {
+      this.system._set(this._systemId, this);
+    }
+    this.status = ActorStatus.Running;
+    if (this.logic.start) {
+      this.logic.start(this._state, this._actorContext);
+    }
+
+    // TODO: this notifies all subscribers but usually this is redundant
+    // there is no real change happening here
+    // we need to rethink if this needs to be refactored
+    this.update(this._state);
+    if (this.options.devTools) {
+      this.attachDevTools();
+    }
+    this.mailbox.start();
+    return this;
+  }
+  _process(event) {
+    try {
+      const nextState = this.logic.transition(this._state, event, this._actorContext);
+      this.update(nextState);
+      if (event.type === stopSignalType) {
+        this._stopProcedure();
+        this._complete();
+      }
+    } catch (err) {
+      // TODO: properly handle errors
+      if (this.observers.size > 0) {
+        this.observers.forEach(observer => {
+          observer.error?.(err);
+        });
+        this.stop();
+      } else {
+        throw err;
       }
-      if (event.type === stopSignalType) {
-        state.canceled = true;
-        if (isFunction(state.dispose)) {
-          state.dispose();
-        }
-        return state;
+    }
+  }
+  _stop() {
+    if (this.status === ActorStatus.Stopped) {
+      return this;
+    }
+    this.mailbox.clear();
+    if (this.status === ActorStatus.NotStarted) {
+      this.status = ActorStatus.Stopped;
+      return this;
+    }
+    this.mailbox.enqueue({
+      type: stopSignalType
+    });
+    return this;
+  }
+
+  /**
+   * Stops the interpreter and unsubscribe all listeners.
+   */
+  stop() {
+    if (this._parent) {
+      throw new Error('A non-root actor cannot be stopped directly.');
+    }
+    return this._stop();
+  }
+  _complete() {
+    for (const observer of this.observers) {
+      observer.complete?.();
+    }
+    this.observers.clear();
+  }
+  _error(data) {
+    for (const observer of this.observers) {
+      observer.error?.(data);
+    }
+    this.observers.clear();
+  }
+  _stopProcedure() {
+    if (this.status !== ActorStatus.Running) {
+      // Interpreter already stopped; do nothing
+      return this;
+    }
+
+    // Cancel all delayed events
+    for (const key of Object.keys(this.delayedEventsMap)) {
+      this.clock.clearTimeout(this.delayedEventsMap[key]);
+    }
+
+    // TODO: mailbox.reset
+    this.mailbox.clear();
+    // TODO: after `stop` we must prepare ourselves for receiving events again
+    // events sent *after* stop signal must be queued
+    // it seems like this should be the common behavior for all of our consumers
+    // so perhaps this should be unified somehow for all of them
+    this.mailbox = new Mailbox(this._process.bind(this));
+    this.status = ActorStatus.Stopped;
+    this.system._unregister(this);
+    return this;
+  }
+
+  /**
+   * Sends an event to the running interpreter to trigger a transition.
+   *
+   * @param event The event to send
+   */
+  send(event) {
+    if (typeof event === 'string') {
+      throw new Error(`Only event objects may be sent to actors; use .send({ type: "${event}" }) instead`);
+    }
+    if (this.status === ActorStatus.Stopped) {
+      // do nothing
+      {
+        const eventString = JSON.stringify(event);
+        console.warn(`Event "${event.type.toString()}" was sent to stopped actor "${this.id} (${this.sessionId})". This actor has already reached its final state, and will not transition.\nEvent: ${eventString}`);
       }
-      if (isSignal(event)) {
-        // TODO: unrecognized signal
-        return state;
+      return;
+    }
+    if (this.status !== ActorStatus.Running && !this.options.deferEvents) {
+      throw new Error(`Event "${event.type}" was sent to uninitialized actor "${this.id
+      // tslint:disable-next-line:max-line-length
+      }". Make sure .start() is called for this actor, or set { deferEvents: true } in the actor options.\nEvent: ${JSON.stringify(event)}`);
+    }
+    this.mailbox.enqueue(event);
+  }
+
+  // TODO: make private (and figure out a way to do this within the machine)
+  delaySend(sendAction) {
+    this.delayedEventsMap[sendAction.params.id] = this.clock.setTimeout(() => {
+      if ('to' in sendAction.params && sendAction.params.to) {
+        sendAction.params.to.send(sendAction.params.event);
+      } else {
+        this.send(sendAction.params.event);
       }
-      state.receivers.forEach(receiver => receiver(event));
-      return state;
-    },
-    getInitialState: (_, input) => {
-      return {
-        canceled: false,
-        receivers: new Set(),
-        dispose: undefined,
-        input
-      };
-    },
-    getSnapshot: () => undefined,
-    getPersistedState: ({
-      input
-    }) => input
-  };
-  return logic;
+    }, sendAction.params.delay);
+  }
+
+  // TODO: make private (and figure out a way to do this within the machine)
+  cancel(sendId) {
+    this.clock.clearTimeout(this.delayedEventsMap[sendId]);
+    delete this.delayedEventsMap[sendId];
+  }
+  attachDevTools() {
+    const {
+      devTools
+    } = this.options;
+    if (devTools) {
+      const resolvedDevToolsAdapter = typeof devTools === 'function' ? devTools : dev_dist_xstateDev.devToolsAdapter;
+      resolvedDevToolsAdapter(this);
+    }
+  }
+  toJSON() {
+    return {
+      id: this.id
+    };
+  }
+  getPersistedState() {
+    return this.logic.getPersistedState?.(this._state);
+  }
+  [symbolObservable]() {
+    return this;
+  }
+  getSnapshot() {
+    return this.logic.getSnapshot ? this.logic.getSnapshot(this._state) : this._state;
+  }
 }
 
-const startSignalType = 'xstate.init';
-const stopSignalType = 'xstate.stop';
-const startSignal = {
-  type: 'xstate.init'
-};
-const stopSignal = {
-  type: 'xstate.stop'
-};
 /**
- * An object that expresses the actor logic in reaction to received events,
- * as well as an optionally emitted stream of values.
+ * Creates a new Interpreter instance for the given machine with the provided options, if any.
  *
- * @template TReceived The received event
- * @template TSnapshot The emitted value
+ * @param machine The machine to interpret
+ * @param options Interpreter options
  */
 
-function isSignal(event) {
-  return event.type === startSignalType || event.type === stopSignalType;
-}
-function isActorRef(item) {
-  return !!item && typeof item === 'object' && typeof item.send === 'function';
-}
-
-// TODO: refactor the return type, this could be written in a better way
-// but it's best to avoid unneccessary breaking changes now
-// @deprecated use `interpret(actorLogic)` instead
-function toActorRef(actorRefLike) {
-  return {
-    subscribe: () => ({
-      unsubscribe: () => void 0
-    }),
-    id: 'anonymous',
-    sessionId: '',
-    getSnapshot: () => undefined,
-    [symbolObservable]: function () {
-      return this;
-    },
-    status: ActorStatus.Running,
-    stop: () => void 0,
-    ...actorRefLike
-  };
-}
-const emptyLogic = fromTransition(_ => undefined, undefined);
-function createEmptyActor() {
-  return interpret(emptyLogic);
+function interpret(logic, options) {
+  const interpreter = new Interpreter(logic, options);
+  return interpreter;
 }
 
 function invoke(invokeDef) {
@@ -1445,42 +1416,32 @@ function invoke(invokeDef) {
       src
     } = invokeDef;
     let resolvedInvokeAction;
-    if (isActorRef(src)) {
+    const referenced = resolveReferencedActor(state.machine.implementations.actors[src]);
+    if (!referenced) {
+      resolvedInvokeAction = {
+        type,
+        params: invokeDef
+      };
+    } else {
+      const input = 'input' in invokeDef ? invokeDef.input : referenced.input;
+      const ref = interpret(referenced.src, {
+        id,
+        src,
+        parent: actorContext?.self,
+        systemId: invokeDef.systemId,
+        input: typeof input === 'function' ? input({
+          context: state.context,
+          event,
+          self: actorContext?.self
+        }) : input
+      });
       resolvedInvokeAction = {
         type,
         params: {
           ...invokeDef,
-          ref: src
+          ref
         }
       };
-    } else {
-      const referenced = resolveReferencedActor(state.machine.implementations.actors[src]);
-      if (!referenced) {
-        resolvedInvokeAction = {
-          type,
-          params: invokeDef
-        };
-      } else {
-        const input = 'input' in invokeDef ? invokeDef.input : referenced.input;
-        const ref = interpret(referenced.src, {
-          id,
-          src,
-          parent: actorContext?.self,
-          systemId: invokeDef.systemId,
-          input: typeof input === 'function' ? input({
-            context: state.context,
-            event,
-            self: actorContext?.self
-          }) : input
-        });
-        resolvedInvokeAction = {
-          type,
-          params: {
-            ...invokeDef,
-            ref
-          }
-        };
-      }
     }
     const actorRef = resolvedInvokeAction.params.ref;
     const invokedState = cloneState(state, {
@@ -2485,7 +2446,7 @@ function resolveActionsAndContext(actions, event, currentState, actorCtx) {
       });
       const matchedActions = resolvedAction.params?.actions;
       intermediateState = nextState;
-      if ((resolvedAction.type === raise$1 || resolvedAction.type === send$1 && resolvedAction.params.internal) && typeof resolvedAction.params.delay !== 'number') {
+      if (resolvedAction.type === raise$1 && typeof resolvedAction.params.delay !== 'number') {
         raiseActions.push(resolvedAction);
       }
 
@@ -2803,11 +2764,14 @@ function stop(actorRef) {
       actor
     }
   }, (event, {
-    state
+    state,
+    actorContext
   }) => {
     const actorRefOrString = isFunction(actor) ? actor({
       context: state.context,
-      event
+      event,
+      self: actorContext?.self ?? {},
+      system: actorContext?.system
     }) : actor;
     const actorRef = typeof actorRefOrString === 'string' ? state.children[actorRefOrString] : actorRefOrString;
     let children = state.children;
@@ -2891,59 +2855,60 @@ function log(expr = defaultLogExpr, label) {
   });
 }
 
-function createSpawner(self, machine, context, event, mutCapturedActions) {
-  return (src, options = {}) => {
+function createSpawner(actorContext, {
+  machine,
+  context
+}, event, spawnedChildren) {
+  const spawn = (src, options = {}) => {
     const {
       systemId
     } = options;
-    if (isString(src)) {
+    if (typeof src === 'string') {
       const referenced = resolveReferencedActor(machine.implementations.actors[src]);
-      if (referenced) {
-        const input = 'input' in options ? options.input : referenced.input;
-
-        // TODO: this should also receive `src`
-        const actorRef = interpret(referenced.src, {
-          id: options.id,
-          parent: self,
-          input: typeof input === 'function' ? input({
-            context,
-            event,
-            self
-          }) : input
-        });
-        mutCapturedActions.push(invoke({
-          id: actorRef.id,
-          // @ts-ignore TODO: fix types
-          src: actorRef,
-          // TODO
-          ref: actorRef,
-          meta: undefined,
-          input,
-          systemId
-        }));
-        return actorRef; // TODO: fix types
-      }
-
-      throw new Error(`Actor logic '${src}' not implemented in machine '${machine.id}'`);
+      if (!referenced) {
+        throw new Error(`Actor logic '${src}' not implemented in machine '${machine.id}'`);
+      }
+      const input = 'input' in options ? options.input : referenced.input;
+
+      // TODO: this should also receive `src`
+      const actor = interpret(referenced.src, {
+        id: options.id,
+        parent: actorContext.self,
+        input: typeof input === 'function' ? input({
+          context,
+          event,
+          self: actorContext.self
+        }) : input,
+        systemId
+      });
+      spawnedChildren[actor.id] = actor;
+      return actor;
     } else {
       // TODO: this should also receive `src`
-      const actorRef = interpret(src, {
+      return interpret(src, {
         id: options.id,
-        parent: self,
+        parent: actorContext.self,
         input: options.input,
         systemId
       });
-      mutCapturedActions.push(invoke({
-        // @ts-ignore TODO: fix types
-        src: actorRef,
-        ref: actorRef,
-        id: actorRef.id,
-        meta: undefined,
-        input: options.input
-      }));
-      return actorRef; // TODO: fix types
     }
   };
+  return (src, options) => {
+    const actorRef = spawn(src, options);
+    spawnedChildren[actorRef.id] = actorRef;
+    actorContext.defer(() => {
+      if (actorRef.status === ActorStatus.Stopped) {
+        return;
+      }
+      try {
+        actorRef.start?.();
+      } catch (err) {
+        actorContext.self.send(error(actorRef.id, err));
+        return;
+      }
+    });
+    return actorRef;
+  };
 }
 
 /**
@@ -2962,15 +2927,15 @@ function assign(assignment) {
     action,
     actorContext
   }) => {
-    const capturedActions = [];
     if (!state.context) {
       throw new Error('Cannot assign to undefined `context`. Ensure that `context` is defined in the machine config.');
     }
+    const spawnedChildren = {};
     const args = {
       context: state.context,
       event,
       action,
-      spawn: createSpawner(actorContext?.self, state.machine, state.context, event, capturedActions),
+      spawn: createSpawner(actorContext, state, event, spawnedChildren),
       self: actorContext?.self ?? {},
       system: actorContext?.system
     };
@@ -2985,12 +2950,15 @@ function assign(assignment) {
     }
     const updatedContext = Object.assign({}, state.context, partialUpdate);
     return [cloneState(state, {
-      context: updatedContext
+      context: updatedContext,
+      children: Object.keys(spawnedChildren).length ? {
+        ...state.children,
+        ...spawnedChildren
+      } : state.children
     }), {
       type: assign$1,
       params: {
-        context: updatedContext,
-        actions: capturedActions
+        context: updatedContext
       }
     }];
   });
@@ -3101,9 +3069,6 @@ function pure(getActions) {
   });
 }
 
-const initEvent = {
-  type: init
-};
 function resolveActionObject(actionObject, actionFunctionMap) {
   if (isDynamicAction(actionObject)) {
     return actionObject;
@@ -3264,7 +3229,6 @@ exports.choose = choose;
 exports.createEmptyActor = createEmptyActor;
 exports.createInitEvent = createInitEvent;
 exports.createInvokeId = createInvokeId;
-exports.createSpawner = createSpawner;
 exports.done = done;
 exports.doneInvoke = doneInvoke;
 exports.error = error;
@@ -3287,7 +3251,6 @@ exports.getInitialConfiguration = getInitialConfiguration;
 exports.getPersistedState = getPersistedState;
 exports.getStateNodeByPath = getStateNodeByPath;
 exports.getStateNodes = getStateNodes;
-exports.initEvent = initEvent;
 exports.interpret = interpret;
 exports.invoke = invoke$1;
 exports.isActorRef = isActorRef;
@@ -3312,7 +3275,6 @@ exports.resolveActionObject = resolveActionObject;
 exports.resolveActionsAndContext = resolveActionsAndContext;
 exports.resolveReferencedActor = resolveReferencedActor;
 exports.resolveStateValue = resolveStateValue;
-exports.send = send;
 exports.sendParent = sendParent;
 exports.sendTo = sendTo;
 exports.startSignal = startSignal;