Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from

Conversation

renovate[bot]
Copy link
Contributor

@renovate renovate bot commented Feb 4, 2024

This PR contains the following updates:

Package Change Age Adoption Passing Confidence
@xstate/react (source) 3.2.2 -> 4.1.3 age adoption passing confidence
xstate (source) 4.38.3 -> 5.18.2 age adoption passing confidence

Release Notes

statelyai/xstate (@​xstate/react)

v4.1.3

Compare Source

Patch Changes

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 '@&#8203;xstate/store';
    import { useSelector } from '@&#8203;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

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

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 is behind base branch, 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.

@cypress-app-bot
Copy link

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant