xstate 5.0.0-beta.32 → 5.0.0-beta.34

package/dist/{interpreter-05e11c15.cjs.js → interpreter-1301970f.cjs.js}

@@ -149,13 +149,14 @@ function reportUnhandledError(err) {
 
 const symbolObservable = (() => typeof Symbol === 'function' && Symbol.observable || '@@observable')();
 
-function createSystem() {
-  let sessionIdCounter = 0;
+let idCounter = 0;
+function createSystem(rootActor) {
   const children = new Map();
   const keyedActors = new Map();
   const reverseKeyedActors = new WeakMap();
+  const observers = new Set();
   const system = {
-    _bookId: () => `x:${sessionIdCounter++}`,
+    _bookId: () => `x:${idCounter++}`,
     _register: (sessionId, actorRef) => {
       children.set(sessionId, actorRef);
       return sessionId;
@@ -178,6 +179,25 @@ function createSystem() {
       }
       keyedActors.set(systemId, actorRef);
       reverseKeyedActors.set(actorRef, systemId);
+    },
+    inspect: observer => {
+      observers.add(observer);
+    },
+    _sendInspectionEvent: event => {
+      const resolvedInspectionEvent = {
+        ...event,
+        rootId: rootActor.sessionId
+      };
+      observers.forEach(observer => observer.next?.(resolvedInspectionEvent));
+    },
+    _relay: (source, target, event) => {
+      system._sendInspectionEvent({
+        type: '@xstate.event',
+        sourceRef: source,
+        targetRef: target,
+        event
+      });
+      target._send(event);
     }
   };
   return system;
@@ -405,10 +425,14 @@ class Actor {
       logger,
       parent,
       id,
-      systemId
+      systemId,
+      inspect
     } = resolvedOptions;
-    const self = this;
-    this.system = parent?.system ?? createSystem();
+    this.system = parent?.system ?? createSystem(this);
+    if (inspect && !parent) {
+      // Always inspect at the system-level
+      this.system.inspect(toObserver(inspect));
+    }
     if (systemId) {
       this._systemId = systemId;
       this.system._set(systemId, this);
@@ -422,7 +446,7 @@ class Actor {
     this.src = resolvedOptions.src;
     this.ref = this;
     this._actorContext = {
-      self,
+      self: this,
       id: this.id,
       sessionId: this.sessionId,
       logger: this.logger,
@@ -441,6 +465,10 @@ class Actor {
     // Ensure that the send method is bound to this Actor instance
     // if destructured
     this.send = this.send.bind(this);
+    this.system._sendInspectionEvent({
+      type: '@xstate.actor',
+      actorRef: this
+    });
     this._initState();
   }
   _initState() {
@@ -449,7 +477,7 @@ class Actor {
 
   // array of functions to defer
 
-  update(snapshot) {
+  update(snapshot, event) {
     // Update state
     this._state = snapshot;
 
@@ -471,14 +499,24 @@ class Actor {
         this._stopProcedure();
         this._complete();
         this._doneEvent = createDoneActorEvent(this.id, this._state.output);
-        this._parent?.send(this._doneEvent);
+        if (this._parent) {
+          this.system._relay(this, this._parent, this._doneEvent);
+        }
         break;
       case 'error':
         this._stopProcedure();
         this._error(this._state.error);
-        this._parent?.send(createErrorActorEvent(this.id, this._state.error));
+        if (this._parent) {
+          this.system._relay(this, this._parent, createErrorActorEvent(this.id, this._state.error));
+        }
         break;
     }
+    this.system._sendInspectionEvent({
+      type: '@xstate.snapshot',
+      actorRef: this,
+      event,
+      snapshot
+    });
   }
   subscribe(nextListenerOrObserver, errorListener, completeListener) {
     const observer = toObserver(nextListenerOrObserver, errorListener, completeListener);
@@ -511,12 +549,19 @@ class Actor {
       this.system._set(this._systemId, this);
     }
     this.status = ActorStatus.Running;
+    const initEvent = createInitEvent(this.options.input);
+    this.system._sendInspectionEvent({
+      type: '@xstate.event',
+      sourceRef: this._parent,
+      targetRef: this,
+      event: initEvent
+    });
     const status = this._state.status;
     switch (status) {
       case 'done':
-        // a state machine can be "done" upon intialization (it could reach a final state using initial microsteps)
+        // a state machine can be "done" upon initialization (it could reach a final state using initial microsteps)
         // we still need to complete observers, flush deferreds etc
-        this.update(this._state);
+        this.update(this._state, initEvent);
       // fallthrough
       case 'error':
         // TODO: rethink cleanup of observers, mailbox, etc
@@ -536,7 +581,7 @@ class Actor {
     // 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);
+    this.update(this._state, initEvent);
     if (this.options.devTools) {
       this.attachDevTools();
     }
@@ -564,7 +609,7 @@ class Actor {
       this._parent?.send(createErrorActorEvent(this.id, err));
       return;
     }
-    this.update(nextState);
+    this.update(nextState, event);
     if (event.type === XSTATE_STOP) {
       this._stopProcedure();
       this._complete();
@@ -650,33 +695,33 @@ class Actor {
   }
 
   /**
-   * Sends an event to the running Actor to trigger a transition.
-   *
-   * @param event The event to send
+   * @internal
    */
-  send(event) {
-    if (typeof event === 'string') {
-      throw new Error(`Only event objects may be sent to actors; use .send({ type: "${event}" }) instead`);
-    }
+  _send(event) {
     if (this.status === ActorStatus.Stopped) {
       return;
     }
     this.mailbox.enqueue(event);
   }
 
+  /**
+   * Sends an event to the running Actor to trigger a transition.
+   *
+   * @param event The event to send
+   */
+  send(event) {
+    this.system._relay(undefined, this, event);
+  }
+
   // TODO: make private (and figure out a way to do this within the machine)
-  delaySend({
-    event,
-    id,
-    delay,
-    to
-  }) {
+  delaySend(params) {
+    const {
+      event,
+      id,
+      delay
+    } = params;
     const timerId = this.clock.setTimeout(() => {
-      if (to) {
-        to.send(event);
-      } else {
-        this.send(event);
-      }
+      this.system._relay(this, params.to ?? this, event);
     }, delay);
 
     // TODO: consider the rehydration story here

package/dist/{interpreter-a2236840.development.cjs.js → interpreter-70ed62f2.development.cjs.js}

@@ -149,13 +149,14 @@ function reportUnhandledError(err) {
 
 const symbolObservable = (() => typeof Symbol === 'function' && Symbol.observable || '@@observable')();
 
-function createSystem() {
-  let sessionIdCounter = 0;
+let idCounter = 0;
+function createSystem(rootActor) {
   const children = new Map();
   const keyedActors = new Map();
   const reverseKeyedActors = new WeakMap();
+  const observers = new Set();
   const system = {
-    _bookId: () => `x:${sessionIdCounter++}`,
+    _bookId: () => `x:${idCounter++}`,
     _register: (sessionId, actorRef) => {
       children.set(sessionId, actorRef);
       return sessionId;
@@ -178,6 +179,25 @@ function createSystem() {
       }
       keyedActors.set(systemId, actorRef);
       reverseKeyedActors.set(actorRef, systemId);
+    },
+    inspect: observer => {
+      observers.add(observer);
+    },
+    _sendInspectionEvent: event => {
+      const resolvedInspectionEvent = {
+        ...event,
+        rootId: rootActor.sessionId
+      };
+      observers.forEach(observer => observer.next?.(resolvedInspectionEvent));
+    },
+    _relay: (source, target, event) => {
+      system._sendInspectionEvent({
+        type: '@xstate.event',
+        sourceRef: source,
+        targetRef: target,
+        event
+      });
+      target._send(event);
     }
   };
   return system;
@@ -408,10 +428,14 @@ class Actor {
       logger,
       parent,
       id,
-      systemId
+      systemId,
+      inspect
     } = resolvedOptions;
-    const self = this;
-    this.system = parent?.system ?? createSystem();
+    this.system = parent?.system ?? createSystem(this);
+    if (inspect && !parent) {
+      // Always inspect at the system-level
+      this.system.inspect(toObserver(inspect));
+    }
     if (systemId) {
       this._systemId = systemId;
       this.system._set(systemId, this);
@@ -425,7 +449,7 @@ class Actor {
     this.src = resolvedOptions.src;
     this.ref = this;
     this._actorContext = {
-      self,
+      self: this,
       id: this.id,
       sessionId: this.sessionId,
       logger: this.logger,
@@ -444,6 +468,10 @@ class Actor {
     // Ensure that the send method is bound to this Actor instance
     // if destructured
     this.send = this.send.bind(this);
+    this.system._sendInspectionEvent({
+      type: '@xstate.actor',
+      actorRef: this
+    });
     this._initState();
   }
   _initState() {
@@ -452,7 +480,7 @@ class Actor {
 
   // array of functions to defer
 
-  update(snapshot) {
+  update(snapshot, event) {
     // Update state
     this._state = snapshot;
 
@@ -474,14 +502,24 @@ class Actor {
         this._stopProcedure();
         this._complete();
         this._doneEvent = createDoneActorEvent(this.id, this._state.output);
-        this._parent?.send(this._doneEvent);
+        if (this._parent) {
+          this.system._relay(this, this._parent, this._doneEvent);
+        }
         break;
       case 'error':
         this._stopProcedure();
         this._error(this._state.error);
-        this._parent?.send(createErrorActorEvent(this.id, this._state.error));
+        if (this._parent) {
+          this.system._relay(this, this._parent, createErrorActorEvent(this.id, this._state.error));
+        }
         break;
     }
+    this.system._sendInspectionEvent({
+      type: '@xstate.snapshot',
+      actorRef: this,
+      event,
+      snapshot
+    });
   }
   subscribe(nextListenerOrObserver, errorListener, completeListener) {
     const observer = toObserver(nextListenerOrObserver, errorListener, completeListener);
@@ -514,12 +552,19 @@ class Actor {
       this.system._set(this._systemId, this);
     }
     this.status = ActorStatus.Running;
+    const initEvent = createInitEvent(this.options.input);
+    this.system._sendInspectionEvent({
+      type: '@xstate.event',
+      sourceRef: this._parent,
+      targetRef: this,
+      event: initEvent
+    });
     const status = this._state.status;
     switch (status) {
       case 'done':
-        // a state machine can be "done" upon intialization (it could reach a final state using initial microsteps)
+        // a state machine can be "done" upon initialization (it could reach a final state using initial microsteps)
         // we still need to complete observers, flush deferreds etc
-        this.update(this._state);
+        this.update(this._state, initEvent);
       // fallthrough
       case 'error':
         // TODO: rethink cleanup of observers, mailbox, etc
@@ -539,7 +584,7 @@ class Actor {
     // 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);
+    this.update(this._state, initEvent);
     if (this.options.devTools) {
       this.attachDevTools();
     }
@@ -567,7 +612,7 @@ class Actor {
       this._parent?.send(createErrorActorEvent(this.id, err));
       return;
     }
-    this.update(nextState);
+    this.update(nextState, event);
     if (event.type === XSTATE_STOP) {
       this._stopProcedure();
       this._complete();
@@ -653,14 +698,9 @@ class Actor {
   }
 
   /**
-   * Sends an event to the running Actor to trigger a transition.
-   *
-   * @param event The event to send
+   * @internal
    */
-  send(event) {
-    if (typeof event === 'string') {
-      throw new Error(`Only event objects may be sent to actors; use .send({ type: "${event}" }) instead`);
-    }
+  _send(event) {
     if (this.status === ActorStatus.Stopped) {
       // do nothing
       {
@@ -672,19 +712,27 @@ class Actor {
     this.mailbox.enqueue(event);
   }
 
+  /**
+   * Sends an event to the running Actor 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`);
+    }
+    this.system._relay(undefined, this, event);
+  }
+
   // TODO: make private (and figure out a way to do this within the machine)
-  delaySend({
-    event,
-    id,
-    delay,
-    to
-  }) {
+  delaySend(params) {
+    const {
+      event,
+      id,
+      delay
+    } = params;
     const timerId = this.clock.setTimeout(() => {
-      if (to) {
-        to.send(event);
-      } else {
-        this.send(event);
-      }
+      this.system._relay(this, params.to ?? this, event);
     }, delay);
 
     // TODO: consider the rehydration story here

package/dist/{interpreter-d5fa7ce0.esm.js → interpreter-83f7f2d4.esm.js}

@@ -147,13 +147,14 @@ function reportUnhandledError(err) {
 
 const symbolObservable = (() => typeof Symbol === 'function' && Symbol.observable || '@@observable')();
 
-function createSystem() {
-  let sessionIdCounter = 0;
+let idCounter = 0;
+function createSystem(rootActor) {
   const children = new Map();
   const keyedActors = new Map();
   const reverseKeyedActors = new WeakMap();
+  const observers = new Set();
   const system = {
-    _bookId: () => `x:${sessionIdCounter++}`,
+    _bookId: () => `x:${idCounter++}`,
     _register: (sessionId, actorRef) => {
       children.set(sessionId, actorRef);
       return sessionId;
@@ -176,6 +177,25 @@ function createSystem() {
       }
       keyedActors.set(systemId, actorRef);
       reverseKeyedActors.set(actorRef, systemId);
+    },
+    inspect: observer => {
+      observers.add(observer);
+    },
+    _sendInspectionEvent: event => {
+      const resolvedInspectionEvent = {
+        ...event,
+        rootId: rootActor.sessionId
+      };
+      observers.forEach(observer => observer.next?.(resolvedInspectionEvent));
+    },
+    _relay: (source, target, event) => {
+      system._sendInspectionEvent({
+        type: '@xstate.event',
+        sourceRef: source,
+        targetRef: target,
+        event
+      });
+      target._send(event);
     }
   };
   return system;
@@ -403,10 +423,14 @@ class Actor {
       logger,
       parent,
       id,
-      systemId
+      systemId,
+      inspect
     } = resolvedOptions;
-    const self = this;
-    this.system = parent?.system ?? createSystem();
+    this.system = parent?.system ?? createSystem(this);
+    if (inspect && !parent) {
+      // Always inspect at the system-level
+      this.system.inspect(toObserver(inspect));
+    }
     if (systemId) {
       this._systemId = systemId;
       this.system._set(systemId, this);
@@ -420,7 +444,7 @@ class Actor {
     this.src = resolvedOptions.src;
     this.ref = this;
     this._actorContext = {
-      self,
+      self: this,
       id: this.id,
       sessionId: this.sessionId,
       logger: this.logger,
@@ -439,6 +463,10 @@ class Actor {
     // Ensure that the send method is bound to this Actor instance
     // if destructured
     this.send = this.send.bind(this);
+    this.system._sendInspectionEvent({
+      type: '@xstate.actor',
+      actorRef: this
+    });
     this._initState();
   }
   _initState() {
@@ -447,7 +475,7 @@ class Actor {
 
   // array of functions to defer
 
-  update(snapshot) {
+  update(snapshot, event) {
     // Update state
     this._state = snapshot;
 
@@ -469,14 +497,24 @@ class Actor {
         this._stopProcedure();
         this._complete();
         this._doneEvent = createDoneActorEvent(this.id, this._state.output);
-        this._parent?.send(this._doneEvent);
+        if (this._parent) {
+          this.system._relay(this, this._parent, this._doneEvent);
+        }
         break;
       case 'error':
         this._stopProcedure();
         this._error(this._state.error);
-        this._parent?.send(createErrorActorEvent(this.id, this._state.error));
+        if (this._parent) {
+          this.system._relay(this, this._parent, createErrorActorEvent(this.id, this._state.error));
+        }
         break;
     }
+    this.system._sendInspectionEvent({
+      type: '@xstate.snapshot',
+      actorRef: this,
+      event,
+      snapshot
+    });
   }
   subscribe(nextListenerOrObserver, errorListener, completeListener) {
     const observer = toObserver(nextListenerOrObserver, errorListener, completeListener);
@@ -509,12 +547,19 @@ class Actor {
       this.system._set(this._systemId, this);
     }
     this.status = ActorStatus.Running;
+    const initEvent = createInitEvent(this.options.input);
+    this.system._sendInspectionEvent({
+      type: '@xstate.event',
+      sourceRef: this._parent,
+      targetRef: this,
+      event: initEvent
+    });
     const status = this._state.status;
     switch (status) {
       case 'done':
-        // a state machine can be "done" upon intialization (it could reach a final state using initial microsteps)
+        // a state machine can be "done" upon initialization (it could reach a final state using initial microsteps)
         // we still need to complete observers, flush deferreds etc
-        this.update(this._state);
+        this.update(this._state, initEvent);
       // fallthrough
       case 'error':
         // TODO: rethink cleanup of observers, mailbox, etc
@@ -534,7 +579,7 @@ class Actor {
     // 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);
+    this.update(this._state, initEvent);
     if (this.options.devTools) {
       this.attachDevTools();
     }
@@ -562,7 +607,7 @@ class Actor {
       this._parent?.send(createErrorActorEvent(this.id, err));
       return;
     }
-    this.update(nextState);
+    this.update(nextState, event);
     if (event.type === XSTATE_STOP) {
       this._stopProcedure();
       this._complete();
@@ -648,33 +693,33 @@ class Actor {
   }
 
   /**
-   * Sends an event to the running Actor to trigger a transition.
-   *
-   * @param event The event to send
+   * @internal
    */
-  send(event) {
-    if (typeof event === 'string') {
-      throw new Error(`Only event objects may be sent to actors; use .send({ type: "${event}" }) instead`);
-    }
+  _send(event) {
     if (this.status === ActorStatus.Stopped) {
       return;
     }
     this.mailbox.enqueue(event);
   }
 
+  /**
+   * Sends an event to the running Actor to trigger a transition.
+   *
+   * @param event The event to send
+   */
+  send(event) {
+    this.system._relay(undefined, this, event);
+  }
+
   // TODO: make private (and figure out a way to do this within the machine)
-  delaySend({
-    event,
-    id,
-    delay,
-    to
-  }) {
+  delaySend(params) {
+    const {
+      event,
+      id,
+      delay
+    } = params;
     const timerId = this.clock.setTimeout(() => {
-      if (to) {
-        to.send(event);
-      } else {
-        this.send(event);
-      }
+      this.system._relay(this, params.to ?? this, event);
     }, delay);
 
     // TODO: consider the rehydration story here
@@ -736,4 +781,4 @@ const interpret = createActor;
  * @deprecated Use `Actor` instead.
  */
 
-export { Actor as A, InterpreterStatus as I, NULL_EVENT as N, STATE_DELIMITER as S, WILDCARD as W, XSTATE_INIT as X, toTransitionConfigArray as a, createInitEvent as b, createInvokeId as c, createActor as d, matchesState as e, ActorStatus as f, interpret as g, toObserver as h, isErrorActorEvent as i, XSTATE_STOP as j, createErrorActorEvent as k, toStateValue as l, mapValues as m, STATE_IDENTIFIER as n, normalizeTarget as o, pathToStateValue as p, toStatePath as q, resolveReferencedActor as r, createDoneStateEvent as s, toArray as t, resolveOutput as u, isArray as v, createAfterEvent as w, flatten as x, XSTATE_ERROR as y };
+export { Actor as A, InterpreterStatus as I, NULL_EVENT as N, STATE_DELIMITER as S, WILDCARD as W, XSTATE_STOP as X, toTransitionConfigArray as a, createInitEvent as b, createInvokeId as c, createActor as d, matchesState as e, ActorStatus as f, interpret as g, toObserver as h, isErrorActorEvent as i, createErrorActorEvent as j, toStateValue as k, STATE_IDENTIFIER as l, mapValues as m, normalizeTarget as n, toStatePath as o, pathToStateValue as p, createDoneStateEvent as q, resolveReferencedActor as r, resolveOutput as s, toArray as t, XSTATE_INIT as u, isArray as v, createAfterEvent as w, flatten as x, XSTATE_ERROR as y };