fix(deps): update dependency @xstate/react to version 6.x 🌟 (major)

[renovate]

This PR contains the following updates:

Package	Change	Age	Confidence
@xstate/react (source)	3.2.2 → 6.1.0
xstate (source)	4.38.3 → 5.30.0

---

Release Notes

statelyai/xstate (@​xstate/react)

v6.1.0

Compare Source

Minor Changes

• #​5470 3e03427 Thanks @​davidkpiano! - useActor and useSelector now throw when the actor reaches an error state, allowing errors to be caught by React error boundaries.

  import { createMachine } from 'xstate';
  import { useActor } from '@​xstate/react';
  import { ErrorBoundary } from 'react-error-boundary';
  
  const machine = createMachine({
    initial: 'idle',
    states: {
      idle: {
        on: {
          fetch: 'loading'
        }
      },
      loading: {
        invoke: {
          src: fromPromise(async () => {
            throw new Error('Network error');
          }),
          onDone: 'success'
          // Without onError, the actor enters an error state
        }
      },
      success: {}
    }
  });
  
  function App() {
    return (
      <ErrorBoundary fallback={<p>Something went wrong</p>}>
        <ActorComponent />
      </ErrorBoundary>
    );
  }
  
  function ActorComponent() {
    // If the actor errors, the error will be thrown
    // and caught by the nearest error boundary
    const [snapshot, send] = useActor(machine);
  
    return <div>{snapshot.value}</div>;
  }

v6.0.0

Compare Source

Patch Changes

• Updated dependencies [e07a7cd8462473188a0fb646a965e61be1ce6ae3]:
  • xstate@​5.20.0

v5.0.5

Compare Source

Patch Changes

• Updated dependencies [479c74b83fa77c57c48f54cf0e9dcfab5fe6cae5]:
  • xstate@​5.19.4

v5.0.4

Compare Source

Patch Changes

• Updated dependencies [b453b2d72ba12d0fe46a995f9ccced8000fd0cc9]:
  • xstate@​5.19.3

v5.0.3

Compare Source

Patch Changes

• #​5223 9e1de554c4ebf49997b717fada540951d01f511c Thanks @​davidkpiano! - Added React 19 as a peer dependency.

v5.0.2

Compare Source

Patch Changes

• #​4552 80b9afbae Thanks @​Andarist! - Fixed defining actors with input within setup.

v5.0.1

Compare Source

Patch Changes

• Updated dependencies [bf6119a7310a878afbf4f5b01f5e24288f9a0f16]:
  • xstate@​5.19.1

v5.0.0

Compare Source

Patch Changes

• #​5109 d67b71dd25d457a2a59f2c943db13f50fab7ec3d Thanks @​davidkpiano! - Add React 19 as a peer dependency

• Updated dependencies [8c4b70652acaef2702f32435362e4755679a516d]:

  • xstate@​5.19.0

v4.1.3

Compare Source

Patch Changes

• Updated dependencies [25963966c394fc904dc9b701a420b6e204ebe7f7]:
  • xstate@​5.18.2

v4.1.2

Compare Source

Patch Changes

• #​5055 ad38c35c37 Thanks @​SandroMaglione! - Updated types of useActor, useMachine, and useActorRef to require input when defined inside types/input.

  Previously even when input was defined inside types, useActor, useMachine, and useActorRef would not make the input required:

  const machine = setup({
    types: {
      input: {} as { value: number }
    }
  }).createMachine({});
  
  function App() {
    // Event if `input` is not defined, `useMachine` works at compile time, but risks crashing at runtime
    const _ = useMachine(machine);
    return <></>;
  }

  With this change the above code will show a type error, since input is now required:

  const machine = setup({
    types: {
      input: {} as { value: number }
    }
  }).createMachine({});
  
  function App() {
    const _ = useMachine(machine, {
      input: { value: 1 } // Now input is required at compile time!
    });
    return <></>;
  }

  This avoids runtime errors when forgetting to pass input when defined inside types.

v4.1.1

Compare Source

Patch Changes

• #​4844 5aa6eb05c Thanks @​davidkpiano! - The useSelector(…) hook from @xstate/react is now compatible with stores from @xstate/store.

  import { createStore } from '@​xstate/store';
  import { useSelector } from '@​xstate/react';
  
  const store = createStore(
    {
      count: 0
    },
    {
      inc: {
        count: (context) => context.count + 1
      }
    }
  );
  
  function Counter() {
    // Note that this `useSelector` is from `@xstate/react`,
    // not `@xstate/store/react`
    const count = useSelector(store, (state) => state.context.count);
  
    return (
      <div>
        <button onClick={() => store.send({ type: 'inc' })}>{count}</button>
      </div>
    );
  }

v4.1.0

Compare Source

Minor Changes

• #​4231 c2402e7bc Thanks @​davidkpiano! - The actor passed to useSelector(actor, selector) is now allowed to be undefined for an actor that may not exist yet. For actors that may be undefined, the snapshot provided to the selector function can also be undefined:

  const count = useSelector(maybeActor, (snapshot) => {
    // `snapshot` may be undefined
    return snapshot?.context.count;
  });
  
  count; // number | undefined

v4.0.3

Compare Source

Patch Changes

• #​4695 52900a084 Thanks @​davidkpiano! - Options in createActorContext are now properly merged with provider options. Previously, provider options replaced the actor options.

  const { inspect } = createBrowserInspector();
  
  const SomeContext = createActorContext(someMachine, { inspect });
  
  // ...
  // Options are now merged:
  // { inspect: inspect, input: 10 }
  <SomeContext.Provider options={{ input: 10 }}>
    {/* ... */}
  </SomeContext.Provider>;

v4.0.2

Compare Source

Patch Changes

• #​4600 1f2ccb97c Thanks @​davidkpiano! - Typegen-based types for detecting missing implementations have been removed internally.

v4.0.1

Compare Source

Patch Changes

• #​4497 d7f220225 Thanks @​davidkpiano! - Fix an issue where after transitions do not work in React strict mode. Delayed events (including from after transitions) should now work as expected in all React modes.

v4.0.0

Compare Source

Major Changes

• #​3947 5fa3a0c74 Thanks @​davidkpiano! - Removed the ability to pass a factory function as argument to useMachine.

• #​4006 42df9a536 Thanks @​davidkpiano! - useActorRef is introduced, which returns an ActorRef from actor logic:

  const actorRef = useActorRef(machine, { ... });
  const anotherActorRef = useActorRef(fromPromise(...));

  useMachine is deprecated in favor of useActor, which works with machines and any other kind of logic

  -const [state, send] = useMachine(machine);
  +const [state, send] = useActor(machine);
  const [state, send] = useActor(fromTransition(...));

  useSpawn is removed in favor of useActorRef

  -const actorRef = useSpawn(machine);
  +const actorRef = useActorRef(machine);
  
  The previous use of `useActor(actorRef)` is now replaced with just using the `actorRef` directly, and with `useSelector`:
  
  ```diff
  -const [state, send] = useActor(actorRef);
  +const state = useSelector(actorRef, s => s);
  // actorRef.send(...)

• #​4050 fc88dc8e6 Thanks @​davidkpiano! - The options prop has been added (back) to the Context.Provider component returned from createActorContext:

  const SomeContext = createActorContext(someMachine);
  
  // ...
  
  <SomeContext.Provider options={{ input: 42 }}>
    {/* ... */}
  </SomeContext.Provider>;

• #​4006 42df9a536 Thanks @​davidkpiano! - useActor has been removed from the created actor context, you should be able to replace its usage with MyCtx.useSelector and MyCtx.useActorRef.

• #​4265 1153b3f9a Thanks @​davidkpiano! - FSM-related functions have been removed.

• #​3947 5fa3a0c74 Thanks @​davidkpiano! - Implementations for machines on useMachine hooks should go directly on the machine via machine.provide(...), and are no longer allowed to be passed in as options.

  -const [state, send] = useMachine(machine, {
  -  actions: {
  -    // ...
  -  }
  -});
  +const [state, send] = useMachine(machine.provide({
  +  actions: {
  +    // ...
  +  }
  +}));

• #​3148 7a68cbb61 Thanks @​davidkpiano! - Removed getSnapshot parameter from hooks. It is expected that the received actorRef has to have a getSnapshot method on it that can be used internally.

Minor Changes

• #​3727 5fb3c683d Thanks @​Andarist! - exports field has been added to the package.json manifest. It limits what files can be imported from a package - it's no longer possible to import from files that are not considered to be a part of the public API.
• #​4240 409552cf8 Thanks @​davidkpiano! - The useMachine function is an alias of useActor.
• #​4436 340aee643 Thanks @​Andarist! - Fast refresh now works as expected for most use-cases.
• #​4050 fc88dc8e6 Thanks @​davidkpiano! - The observerOrListener argument has been removed from the 3rd argument of createActorContext(logic, options).

---

Configuration

📅 Schedule: Branch creation - "before 3am on the first day of the month" in timezone America/New_York, Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

👻 Immortal: This PR will be recreated if closed unmerged. Get config help if that's undesired.

---

• If you want to rebase/retry this PR, check this box

---

This PR was generated by Mend Renovate. View the repository job log.

---

Note

High Risk
Upgrades XState from v4 to v5 and @xstate/react from v3 to v6, which include major breaking API/typing changes and can break existing machine/interpreter and hook usage at runtime and compile time.

Overview
Updates state-machine dependencies by bumping xstate from 4.38.3 to 5.30.0 and @xstate/react from 3.2.2 to 6.1.0, with corresponding yarn.lock updates (including use-sync-external-store).

No application code is changed, so any required migration for XState v5 / @xstate/react v6 APIs will surface as build/test failures after the dependency upgrade.

^{Written by Cursor Bugbot for commit a6012e3. This will update automatically on new commits. Configure here.}

[cypress-app-bot]

See the guidelines for reviewing dependency updates for info on how to review dependency update PRs.

[cursor]

Cursor Bugbot has reviewed your changes and found 8 potential issues.

^{Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

[cursor]

xstate v5 removes Machine export, breaking all machines

High Severity

Upgrading xstate from v4 to v5 removes the Machine export entirely (replaced by createMachine). All 7 machine files (authMachine.ts, dataMachine.ts, drawerMachine.ts, snackbarMachine.ts, createTransactionMachine.ts, transactionFiltersMachine.ts, userOnboardingMachine.ts) import Machine from "xstate", which will cause a runtime crash on import. The application cannot start at all with this change.

Additional Locations (1)

• package.json#L30-L31

 

[cursor]

useActor no longer accepts actor references in v6

High Severity

Upgrading @xstate/react from v3 to v6 changes the useActor API — it now accepts actor logic (machines), not existing actor references. Five components (AlertBar, NavBar, NavDrawer, SignInForm, SignUpForm) pass Interpreter service instances to useActor, which will crash at runtime. These should use useSelector and useActorRef instead.

 

[cursor]

send with string events removed in xstate v5

High Severity

xstate v5 no longer supports string arguments in send() — only event objects are accepted. Multiple components call send with strings: sendDrawer("TOGGLE_DESKTOP"), sendDrawer("TOGGLE_MOBILE"), sendDrawer("OPEN_DESKTOP", payload), sendDrawer("CLOSE_MOBILE"), and sendAuth("LOGOUT") in MainLayout.tsx and NavDrawer.tsx. These calls will throw or silently fail at runtime.

 

[cursor]

interpret and State removed, breaking auth initialization

High Severity

xstate v5 removes interpret (now createActor) and State.create (now different rehydration API). authMachine.ts uses both: interpret(authMachine) to start the global auth service and State.create(stateDefinition) to rehydrate persisted state. This will crash during module initialization, preventing the auth system from working at all.

 

[cursor]

withConfig removed, breaking derived machine definitions

High Severity

xstate v5 renames .withConfig() to .provide(). Six machine files (bankAccountsMachine, contactsTransactionsMachine, createTransactionMachine, notificationsMachine, personalTransactionsMachine, publicTransactionsMachine) use .withConfig() with a services key (also renamed to actors in v5) to configure data-fetching behavior. All these machines will fail to initialize.

 

[cursor]

assign signature change silently corrupts all state updates

High Severity

xstate v5 changes the assign function signature from positional (context, event) => ... to a single object ({ context, event }) => .... All 12 assign() calls across authMachine.ts, dataMachine.ts, snackbarMachine.ts, and createTransactionMachine.ts use the old positional pattern. With v5, the first parameter receives the entire { context, event } object rather than just context, and the second parameter becomes undefined, silently corrupting every state assignment.

 

[cursor]

cond and transient "" transitions removed in v5

High Severity

xstate v5 renames cond to guard and removes transient transitions via the empty string "" event (replaced by always). drawerMachine.ts uses cond: "shouldOpenDesktop" and dataMachine.ts uses both cond: "hasData" and the "": [...] transient transition syntax. The drawer's conditional desktop open logic and the data machine's automatic routing between withData/withoutData states would silently stop working.

 

[cursor]

autoForward removed breaks child machine event forwarding

Medium Severity

xstate v5 completely removes the autoForward property from invoke configurations. createTransactionMachine.ts uses autoForward: true on the invoked transactionDataMachine to forward events like CREATE to the child data machine. Without auto-forwarding, the child machine would never receive these events, breaking the transaction creation flow.