feat: add guard inspection via _guards property on microstep events

[cevr]

Summary

This PR adds guard evaluation visibility to @xstate.microstep inspection events via a new _guards property. This provides insight into the guard evaluation process, making it easier to debug transition decisions.

Motivation

When debugging state machines, it's often difficult to understand why a transition didn't happen. The existing inspection events (@xstate.event, @xstate.action, @xstate.snapshot, @xstate.microstep) don't provide insight into guard evaluation - only the @xstate.microstep shows transitions that passed, but doesn't show which guards failed.

This is particularly problematic when you have multiple guarded transitions for the same event and want to understand why a specific path wasn't taken. For example:

on: {
  SUBMIT: [
    { guard: 'canSubmitFast', target: 'fastPath' },
    { guard: 'canSubmit', target: 'normalPath' },
    { target: 'fallback' }
  ]
}

Without guard inspection, you can't easily tell which guards passed or failed.

Solution

Add a _guards property to @xstate.microstep inspection events that contains an array of all guard evaluations:

interface InspectedMicrostepEvent {
  type: '@xstate.microstep';
  // ... existing properties
  _guards: Array<{
    type: string;    // Guard name or 'xstate.inline' for inline guards
    params: unknown;
    result: boolean; // true if guard passed, false if it failed
  }>;
}

This approach keeps guard information correlated with their transitions rather than emitting separate events.

Implementation

• Added _guards array type to InspectedMicrostepEvent in inspection.ts
• Modified evaluateGuard() in guards.ts to return guard metadata alongside the result
• Collect guard evaluations during transition resolution in stateUtils.ts
• Include collected guards in the microstep inspection event

Breaking Changes

None - the _guards property is additive and existing code continues to work without modification.

Test Plan

• All existing tests pass
• Tests verify guard information is included in microstep events
• Build succeeds

🤖 Generated with Claude Code

[changeset-bot]

🦋 Changeset detected

Latest commit: 1d978fe

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 5 packages

Name	Type
xstate	Minor
@xstate/react	Major
@xstate/solid	Major
@xstate/svelte	Major
@xstate/vue	Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[davidkpiano]

Instead of adding a new event, I would strongly recommend either enhancing _transitions with guard params (since if the transition is in this array, it was taken) and/or by adding _guards here instead.

[cevr]

gotcha, i think the problem with _transitions is that it only shows the passed transitions - im partial to the _guards