@xstate/react 2.0.0-pr2674-2021926101023 → 3.0.0

package/lib/useActor.js

@@ -1,25 +1,10 @@
 "use strict";
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useActor = exports.isActorWithState = void 0;
 var react_1 = require("react");
 var use_isomorphic_layout_effect_1 = require("use-isomorphic-layout-effect");
 var useConstant_1 = require("./useConstant");
+var shim_1 = require("use-sync-external-store/shim");
 function isActorWithState(actorRef) {
     return 'state' in actorRef;
 }
@@ -27,9 +12,6 @@ exports.isActorWithState = isActorWithState;
 function isDeferredActor(actorRef) {
     return 'deferred' in actorRef;
 }
-var noop = function () {
-    /* ... */
-};
 function defaultGetSnapshot(actorRef) {
     return 'getSnapshot' in actorRef
         ? actorRef.getSnapshot()
@@ -39,17 +21,25 @@ function defaultGetSnapshot(actorRef) {
 }
 function useActor(actorRef, getSnapshot) {
     if (getSnapshot === void 0) { getSnapshot = defaultGetSnapshot; }
-    var actorRefRef = react_1.useRef(actorRef);
-    var deferredEventsRef = react_1.useRef([]);
-    var _a = __read(react_1.useState(function () { return getSnapshot(actorRef); }), 2), current = _a[0], setCurrent = _a[1];
-    var send = useConstant_1.default(function () { return function () {
+    var actorRefRef = (0, react_1.useRef)(actorRef);
+    var deferredEventsRef = (0, react_1.useRef)([]);
+    var subscribe = (0, react_1.useCallback)(function (handleStoreChange) {
+        var unsubscribe = actorRef.subscribe(handleStoreChange).unsubscribe;
+        return unsubscribe;
+    }, [actorRef]);
+    var boundGetSnapshot = (0, react_1.useCallback)(function () { return getSnapshot(actorRef); }, [
+        actorRef,
+        getSnapshot
+    ]);
+    var storeSnapshot = (0, shim_1.useSyncExternalStore)(subscribe, boundGetSnapshot, boundGetSnapshot);
+    var send = (0, useConstant_1.default)(function () { return function () {
         var args = [];
         for (var _i = 0; _i < arguments.length; _i++) {
             args[_i] = arguments[_i];
         }
         var event = args[0];
         if (process.env.NODE_ENV !== 'production' && args.length > 1) {
-            console.warn("Unexpected payload: " + JSON.stringify(args[1]) + ". Only a single event object can be sent to actor send() functions.");
+            console.warn("Unexpected payload: ".concat(JSON.stringify(args[1]), ". Only a single event object can be sent to actor send() functions."));
         }
         var currentActorRef = actorRefRef.current;
         // If the previous actor is a deferred actor,
@@ -62,23 +52,14 @@ function useActor(actorRef, getSnapshot) {
             currentActorRef.send(event);
         }
     }; });
-    use_isomorphic_layout_effect_1.default(function () {
+    (0, use_isomorphic_layout_effect_1.default)(function () {
         actorRefRef.current = actorRef;
-        setCurrent(getSnapshot(actorRef));
-        var subscription = actorRef.subscribe({
-            next: function (emitted) { return setCurrent(emitted); },
-            error: noop,
-            complete: noop
-        });
         // Dequeue deferred events from the previous deferred actorRef
         while (deferredEventsRef.current.length > 0) {
             var deferredEvent = deferredEventsRef.current.shift();
             actorRef.send(deferredEvent);
         }
-        return function () {
-            subscription.unsubscribe();
-        };
     }, [actorRef]);
-    return [current, send];
+    return [storeSnapshot, send];
 }
 exports.useActor = useActor;

package/lib/useInterpret.d.ts

@@ -1,13 +1,14 @@
-import { AreAllImplementationsAssumedToBeProvided, InternalMachineOptions, InterpreterFrom, InterpreterOptions, Observer, State, StateMachine } from 'xstate';
+import { AnyInterpreter, AnyStateMachine, AreAllImplementationsAssumedToBeProvided, InternalMachineOptions, InterpreterFrom, InterpreterOptions, MachineOptions, Observer, StateFrom } from 'xstate';
 import { MaybeLazy } from './types';
 import { UseMachineOptions } from './useMachine';
-declare type RestParams<TMachine extends StateMachine<any, any, any, any, any, any>> = AreAllImplementationsAssumedToBeProvided<TMachine['__TResolvedTypesMeta']> extends false ? [
+export declare function useIdleInterpreter(getMachine: MaybeLazy<AnyStateMachine>, options: Partial<InterpreterOptions> & Partial<UseMachineOptions<unknown, never>> & Partial<MachineOptions<unknown, never>>): AnyInterpreter;
+declare type RestParams<TMachine extends AnyStateMachine> = AreAllImplementationsAssumedToBeProvided<TMachine['__TResolvedTypesMeta']> extends false ? [
     options: InterpreterOptions & UseMachineOptions<TMachine['__TContext'], TMachine['__TEvent']> & InternalMachineOptions<TMachine['__TContext'], TMachine['__TEvent'], TMachine['__TResolvedTypesMeta'], true>,
-    observerOrListener?: Observer<State<TMachine['__TContext'], TMachine['__TEvent'], any, TMachine['__TTypestate'], TMachine['__TResolvedTypesMeta']>> | ((value: State<TMachine['__TContext'], TMachine['__TEvent'], any, TMachine['__TTypestate'], TMachine['__TResolvedTypesMeta']>) => void)
+    observerOrListener?: Observer<StateFrom<TMachine>> | ((value: StateFrom<TMachine>) => void)
 ] : [
     options?: InterpreterOptions & UseMachineOptions<TMachine['__TContext'], TMachine['__TEvent']> & InternalMachineOptions<TMachine['__TContext'], TMachine['__TEvent'], TMachine['__TResolvedTypesMeta']>,
-    observerOrListener?: Observer<State<TMachine['__TContext'], TMachine['__TEvent'], any, TMachine['__TTypestate'], TMachine['__TResolvedTypesMeta']>> | ((value: State<TMachine['__TContext'], TMachine['__TEvent'], any, TMachine['__TTypestate'], TMachine['__TResolvedTypesMeta']>) => void)
+    observerOrListener?: Observer<StateFrom<TMachine>> | ((value: StateFrom<TMachine>) => void)
 ];
-export declare function useInterpret<TMachine extends StateMachine<any, any, any, any, any, any>>(getMachine: MaybeLazy<TMachine>, ...[options, observerOrListener]: RestParams<TMachine>): InterpreterFrom<TMachine>;
+export declare function useInterpret<TMachine extends AnyStateMachine>(getMachine: MaybeLazy<TMachine>, ...[options, observerOrListener]: RestParams<TMachine>): InterpreterFrom<TMachine>;
 export {};
 //# sourceMappingURL=useInterpret.d.ts.map

package/lib/useInterpret.js

@@ -38,46 +38,25 @@ var __read = (this && this.__read) || function (o, n) {
     return ar;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useInterpret = void 0;
+exports.useInterpret = exports.useIdleInterpreter = void 0;
 var react_1 = require("react");
 var use_isomorphic_layout_effect_1 = require("use-isomorphic-layout-effect");
 var xstate_1 = require("xstate");
 var useConstant_1 = require("./useConstant");
-var useReactEffectActions_1 = require("./useReactEffectActions");
-// copied from core/src/utils.ts
-// it avoids a breaking change between this package and XState which is its peer dep
-function toObserver(nextHandler, errorHandler, completionHandler) {
-    if (typeof nextHandler === 'object') {
-        return nextHandler;
-    }
-    var noop = function () { return void 0; };
-    return {
-        next: nextHandler,
-        error: errorHandler || noop,
-        complete: completionHandler || noop
-    };
-}
-function useInterpret(getMachine) {
-    var _a = [];
-    for (var _i = 1; _i < arguments.length; _i++) {
-        _a[_i - 1] = arguments[_i];
-    }
-    var _b = __read(_a, 2), _c = _b[0], options = _c === void 0 ? {} : _c, observerOrListener = _b[1];
-    var machine = useConstant_1.default(function () {
+function useIdleInterpreter(getMachine, options) {
+    var machine = (0, useConstant_1.default)(function () {
         return typeof getMachine === 'function' ? getMachine() : getMachine;
     });
     if (process.env.NODE_ENV !== 'production' &&
         typeof getMachine !== 'function') {
-        var _d = __read(react_1.useState(machine), 1), initialMachine = _d[0];
+        var _a = __read((0, react_1.useState)(machine), 1), initialMachine = _a[0];
         if (getMachine !== initialMachine) {
             console.warn('Machine given to `useMachine` has changed between renders. This is not supported and might lead to unexpected results.\n' +
                 'Please make sure that you pass the same Machine as argument each time.');
         }
     }
-    var context = options.context, guards = options.guards, actions = options.actions, services = options.services, delays = options.delays, rehydratedState = options.state, interpreterOptions = __rest(options, ["context", "guards", "actions", "services", "delays", "state"]);
-    // it's not defined in `TypegenMachineOptions` so we can't just unpack this property here freely
-    var activities = options.activities;
-    var service = useConstant_1.default(function () {
+    var context = options.context, guards = options.guards, actions = options.actions, activities = options.activities, services = options.services, delays = options.delays, rehydratedState = options.state, interpreterOptions = __rest(options, ["context", "guards", "actions", "activities", "services", "delays", "state"]);
+    var service = (0, useConstant_1.default)(function () {
         var machineConfig = {
             context: context,
             guards: guards,
@@ -87,34 +66,45 @@ function useInterpret(getMachine) {
             delays: delays
         };
         var machineWithConfig = machine.withConfig(machineConfig, function () { return (__assign(__assign({}, machine.context), context)); });
-        return xstate_1.interpret(machineWithConfig, __assign({ deferEvents: true }, interpreterOptions));
+        return (0, xstate_1.interpret)(machineWithConfig, interpreterOptions);
     });
-    use_isomorphic_layout_effect_1.default(function () {
-        var sub;
-        if (observerOrListener) {
-            sub = service.subscribe(toObserver(observerOrListener));
-        }
-        return function () {
-            sub === null || sub === void 0 ? void 0 : sub.unsubscribe();
-        };
-    }, [observerOrListener]);
-    use_isomorphic_layout_effect_1.default(function () {
-        service.start(rehydratedState ? xstate_1.State.create(rehydratedState) : undefined);
-        return function () {
-            service.stop();
-        };
-    }, []);
     // Make sure options are kept updated when they change.
     // This mutation assignment is safe because the service instance is only used
     // in one place -- this hook's caller.
-    use_isomorphic_layout_effect_1.default(function () {
+    (0, use_isomorphic_layout_effect_1.default)(function () {
         Object.assign(service.machine.options.actions, actions);
         Object.assign(service.machine.options.guards, guards);
         Object.assign(service.machine.options.activities, activities);
         Object.assign(service.machine.options.services, services);
         Object.assign(service.machine.options.delays, delays);
     }, [actions, guards, activities, services, delays]);
-    useReactEffectActions_1.useReactEffectActions(service);
+    return service;
+}
+exports.useIdleInterpreter = useIdleInterpreter;
+function useInterpret(getMachine) {
+    var _a = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        _a[_i - 1] = arguments[_i];
+    }
+    var _b = __read(_a, 2), _c = _b[0], options = _c === void 0 ? {} : _c, observerOrListener = _b[1];
+    var service = useIdleInterpreter(getMachine, options);
+    (0, react_1.useEffect)(function () {
+        if (!observerOrListener) {
+            return;
+        }
+        var sub = service.subscribe((0, xstate_1.toObserver)(observerOrListener));
+        return function () {
+            sub.unsubscribe();
+        };
+    }, [observerOrListener]);
+    (0, react_1.useEffect)(function () {
+        var rehydratedState = options.state;
+        service.start(rehydratedState ? xstate_1.State.create(rehydratedState) : undefined);
+        return function () {
+            service.stop();
+            service.status = xstate_1.InterpreterStatus.NotStarted;
+        };
+    }, []);
     return service;
 }
 exports.useInterpret = useInterpret;

package/lib/useMachine.d.ts

@@ -1,7 +1,5 @@
-import { ActionFunction, AreAllImplementationsAssumedToBeProvided, EventObject, InternalMachineOptions, InterpreterFrom, InterpreterOptions, StateConfig, StateFrom, StateMachine } from 'xstate';
-import { MaybeLazy, Prop, ReactActionFunction } from './types';
-export declare function asEffect<TContext, TEvent extends EventObject>(exec: ActionFunction<TContext, TEvent>): ReactActionFunction<TContext, TEvent>;
-export declare function asLayoutEffect<TContext, TEvent extends EventObject>(exec: ActionFunction<TContext, TEvent>): ReactActionFunction<TContext, TEvent>;
+import { AnyStateMachine, AreAllImplementationsAssumedToBeProvided, EventObject, InternalMachineOptions, InterpreterFrom, InterpreterOptions, StateConfig, StateFrom } from 'xstate';
+import { MaybeLazy, Prop } from './types';
 export interface UseMachineOptions<TContext, TEvent extends EventObject> {
     /**
      * If provided, will be merged with machine's `context`.
@@ -13,12 +11,12 @@ export interface UseMachineOptions<TContext, TEvent extends EventObject> {
      */
     state?: StateConfig<TContext, TEvent>;
 }
-declare type RestParams<TMachine extends StateMachine<any, any, any, any, any, any>> = AreAllImplementationsAssumedToBeProvided<TMachine['__TResolvedTypesMeta']> extends false ? [
+declare type RestParams<TMachine extends AnyStateMachine> = AreAllImplementationsAssumedToBeProvided<TMachine['__TResolvedTypesMeta']> extends false ? [
     options: InterpreterOptions & UseMachineOptions<TMachine['__TContext'], TMachine['__TEvent']> & InternalMachineOptions<TMachine['__TContext'], TMachine['__TEvent'], TMachine['__TResolvedTypesMeta'], true>
 ] : [
     options?: InterpreterOptions & UseMachineOptions<TMachine['__TContext'], TMachine['__TEvent']> & InternalMachineOptions<TMachine['__TContext'], TMachine['__TEvent'], TMachine['__TResolvedTypesMeta']>
 ];
-declare type UseMachineReturn<TMachine extends StateMachine<any, any, any, any, any, any>, TInterpreter = InterpreterFrom<TMachine>> = [StateFrom<TMachine>, Prop<TInterpreter, 'send'>, TInterpreter];
-export declare function useMachine<TMachine extends StateMachine<any, any, any, any, any, any>>(getMachine: MaybeLazy<TMachine>, ...[options]: RestParams<TMachine>): UseMachineReturn<TMachine>;
+declare type UseMachineReturn<TMachine extends AnyStateMachine, TInterpreter = InterpreterFrom<TMachine>> = [StateFrom<TMachine>, Prop<TInterpreter, 'send'>, TInterpreter];
+export declare function useMachine<TMachine extends AnyStateMachine>(getMachine: MaybeLazy<TMachine>, ...[options]: RestParams<TMachine>): UseMachineReturn<TMachine>;
 export {};
 //# sourceMappingURL=useMachine.d.ts.map

package/lib/useMachine.js

@@ -15,66 +15,59 @@ var __read = (this && this.__read) || function (o, n) {
     }
     return ar;
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMachine = exports.asLayoutEffect = exports.asEffect = void 0;
+exports.useMachine = void 0;
 var react_1 = require("react");
+var with_selector_1 = require("use-sync-external-store/shim/with-selector");
 var xstate_1 = require("xstate");
-var types_1 = require("./types");
 var useInterpret_1 = require("./useInterpret");
-function createReactActionFunction(exec, tag) {
-    var effectExec = function () {
-        var args = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            args[_i] = arguments[_i];
-        }
-        // don't execute; just return
-        return function () {
-            return exec.apply(void 0, __spreadArray([], __read(args)));
-        };
-    };
-    Object.defineProperties(effectExec, {
-        name: { value: "effect:" + exec.name },
-        __effect: { value: tag }
-    });
-    return effectExec;
-}
-function asEffect(exec) {
-    return createReactActionFunction(exec, types_1.ReactEffectType.Effect);
-}
-exports.asEffect = asEffect;
-function asLayoutEffect(exec) {
-    return createReactActionFunction(exec, types_1.ReactEffectType.LayoutEffect);
+function identity(a) {
+    return a;
 }
-exports.asLayoutEffect = asLayoutEffect;
 function useMachine(getMachine) {
     var _a = [];
     for (var _i = 1; _i < arguments.length; _i++) {
         _a[_i - 1] = arguments[_i];
     }
     var _b = __read(_a, 1), _c = _b[0], options = _c === void 0 ? {} : _c;
-    var listener = react_1.useCallback(function (nextState) {
+    // using `useIdleInterpreter` allows us to subscribe to the service *before* we start it
+    // so we don't miss any notifications
+    var service = (0, useInterpret_1.useIdleInterpreter)(getMachine, options);
+    var getSnapshot = (0, react_1.useCallback)(function () {
+        if (service.status === xstate_1.InterpreterStatus.NotStarted) {
+            return (options.state
+                ? xstate_1.State.create(options.state)
+                : service.machine.initialState);
+        }
+        return service.state;
+    }, [service]);
+    var isEqual = (0, react_1.useCallback)(function (prevState, nextState) {
+        if (service.status === xstate_1.InterpreterStatus.NotStarted) {
+            return true;
+        }
         // Only change the current state if:
         // - the incoming state is the "live" initial state (since it might have new actors)
         // - OR the incoming state actually changed.
         //
         // The "live" initial state will have .changed === undefined.
-        var initialStateChanged = nextState.changed === undefined && Object.keys(nextState.children).length;
-        if (nextState.changed || initialStateChanged) {
-            setState(nextState);
-        }
+        var initialStateChanged = nextState.changed === undefined &&
+            (Object.keys(nextState.children).length > 0 ||
+                typeof prevState.changed === 'boolean');
+        return !(nextState.changed || initialStateChanged);
+    }, [service]);
+    var subscribe = (0, react_1.useCallback)(function (handleStoreChange) {
+        var unsubscribe = service.subscribe(handleStoreChange).unsubscribe;
+        return unsubscribe;
+    }, [service]);
+    var storeSnapshot = (0, with_selector_1.useSyncExternalStoreWithSelector)(subscribe, getSnapshot, getSnapshot, identity, isEqual);
+    (0, react_1.useEffect)(function () {
+        var rehydratedState = options.state;
+        service.start(rehydratedState ? xstate_1.State.create(rehydratedState) : undefined);
+        return function () {
+            service.stop();
+            service.status = xstate_1.InterpreterStatus.NotStarted;
+        };
     }, []);
-    var service = useInterpret_1.useInterpret(getMachine, options, listener);
-    var _d = __read(react_1.useState(function () {
-        var initialState = service.machine.initialState;
-        return (options.state
-            ? xstate_1.State.create(options.state)
-            : initialState);
-    }), 2), state = _d[0], setState = _d[1];
-    return [state, service.send, service];
+    return [storeSnapshot, service.send, service];
 }
 exports.useMachine = useMachine;

package/lib/useSelector.js

@@ -2,68 +2,32 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useSelector = void 0;
 var react_1 = require("react");
-var use_subscription_1 = require("use-subscription");
-var use_isomorphic_layout_effect_1 = require("use-isomorphic-layout-effect");
+var with_selector_1 = require("use-sync-external-store/shim/with-selector");
 var useActor_1 = require("./useActor");
-var useService_1 = require("./useService");
+var utils_1 = require("./utils");
 function isService(actor) {
     return 'state' in actor && 'machine' in actor;
 }
 var defaultCompare = function (a, b) { return a === b; };
 var defaultGetSnapshot = function (a) {
     return isService(a)
-        ? useService_1.getServiceSnapshot(a)
-        : useActor_1.isActorWithState(a)
+        ? (0, utils_1.getServiceSnapshot)(a)
+        : (0, useActor_1.isActorWithState)(a)
             ? a.state
             : undefined;
 };
 function useSelector(actor, selector, compare, getSnapshot) {
     if (compare === void 0) { compare = defaultCompare; }
     if (getSnapshot === void 0) { getSnapshot = defaultGetSnapshot; }
-    var latestSelectorRef = react_1.useRef(selector);
-    var subscription = react_1.useMemo(function () {
-        var snapshot = getSnapshot(actor);
-        var current = selector(snapshot);
-        var notifySubscriber;
-        return {
-            getSnapshot: function () { return snapshot; },
-            getCurrentValue: function () { return current; },
-            setCurrentValue: function (newCurrent) {
-                current = newCurrent;
-                notifySubscriber === null || notifySubscriber === void 0 ? void 0 : notifySubscriber();
-            },
-            subscribe: function (callback) {
-                notifySubscriber = callback;
-                var sub = actor.subscribe(function (emitted) {
-                    snapshot = emitted;
-                    var next = latestSelectorRef.current(emitted);
-                    if (!compare(current, next)) {
-                        current = next;
-                        callback();
-                    }
-                });
-                return function () {
-                    sub.unsubscribe();
-                };
-            }
-        };
-        // intentionally omit `getSnapshot` and `compare`
-        // - `getSnapshot`: it is only supposed to read the "initial" snapshot of an actor
-        // - `compare`: is really supposed to be idempotent and the same throughout the lifetime of this hook (the same assumption is made in React Redux v7)
+    var subscribe = (0, react_1.useCallback)(function (handleStoreChange) {
+        var unsubscribe = actor.subscribe(handleStoreChange).unsubscribe;
+        return unsubscribe;
     }, [actor]);
-    var currentSelected = use_subscription_1.useSubscription(subscription);
-    if (latestSelectorRef.current !== selector) {
-        var selected = selector(subscription.getSnapshot());
-        if (!compare(currentSelected, selected)) {
-            currentSelected = selected;
-        }
-    }
-    use_isomorphic_layout_effect_1.default(function () {
-        latestSelectorRef.current = selector;
-        // required so we don't cause a rerender by setting state (this could create infinite rerendering loop with inline selectors)
-        // at the same time we need to update the value within the subscription so new emits can compare against what has been returned to the user as current value
-        subscription.setCurrentValue(currentSelected);
-    });
-    return currentSelected;
+    var boundGetSnapshot = (0, react_1.useCallback)(function () { return getSnapshot(actor); }, [
+        actor,
+        getSnapshot
+    ]);
+    var selectedSnapshot = (0, with_selector_1.useSyncExternalStoreWithSelector)(subscribe, boundGetSnapshot, boundGetSnapshot, selector, compare);
+    return selectedSnapshot;
 }
 exports.useSelector = useSelector;

package/lib/useSpawn.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useSpawn = void 0;
-var behaviors_1 = require("xstate/lib/behaviors");
+var xstate_1 = require("xstate");
 var useConstant_1 = require("./useConstant");
 /**
  * React hook that spawns an `ActorRef` with the specified `behavior`.
@@ -11,8 +11,8 @@ var useConstant_1 = require("./useConstant");
  * @returns An ActorRef with the specified `behavior`
  */
 function useSpawn(behavior) {
-    var actorRef = useConstant_1.default(function () {
-        return behaviors_1.spawnBehavior(behavior);
+    var actorRef = (0, useConstant_1.default)(function () {
+        return (0, xstate_1.spawnBehavior)(behavior);
     });
     return actorRef;
 }

package/lib/utils.d.ts

@@ -1,2 +1,4 @@
+import { Interpreter } from 'xstate';
 export declare function partition<T, A extends T, B extends T>(items: T[], predicate: (item: T) => item is A): [A[], B[]];
+export declare function getServiceSnapshot<TService extends Interpreter<any, any, any, any>>(service: TService): TService['state'];
 //# sourceMappingURL=utils.d.ts.map

package/lib/utils.js

@@ -27,7 +27,7 @@ var __values = (this && this.__values) || function(o) {
     throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.partition = void 0;
+exports.getServiceSnapshot = exports.partition = void 0;
 function partition(items, predicate) {
     var e_1, _a;
     var _b = __read([[], []], 2), truthy = _b[0], falsy = _b[1];
@@ -52,3 +52,7 @@ function partition(items, predicate) {
     return [truthy, falsy];
 }
 exports.partition = partition;
+function getServiceSnapshot(service) {
+    return service.status !== 0 ? service.state : service.machine.initialState;
+}
+exports.getServiceSnapshot = getServiceSnapshot;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xstate/react",
-  "version": "2.0.0-pr2674-2021926101023",
+  "version": "3.0.0",
   "description": "XState tools for React",
   "keywords": [
     "state",
@@ -13,7 +13,7 @@
     "hook"
   ],
   "author": "David Khourshid <davidkpiano@gmail.com>",
-  "homepage": "https://github.com/davidkpiano/xstate/tree/main/packages/xstate-react#readme",
+  "homepage": "https://github.com/statelyai/xstate/tree/main/packages/xstate-react#readme",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -40,21 +40,21 @@
   ],
   "repository": {
     "type": "git",
-    "url": "git+ssh://git@github.com/davidkpiano/xstate.git"
+    "url": "git+ssh://git@github.com/statelyai/xstate.git"
   },
   "scripts": {
     "clean": "rm -rf dist lib tsconfig.tsbuildinfo",
     "build": "tsc && tsc --outDir es --module es2015 && rollup -c",
     "test": "jest",
-    "prepublish": "npm run build && npm run test"
+    "prepare": "npm run build"
   },
   "bugs": {
-    "url": "https://github.com/davidkpiano/xstate/issues"
+    "url": "https://github.com/statelyai/xstate/issues"
   },
   "peerDependencies": {
-    "@xstate/fsm": "^1.0.0",
-    "react": "^16.8.0 || ^17.0.0",
-    "xstate": "^4.27.0-pr2674-2021926101023"
+    "@xstate/fsm": "^2.0.0",
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+    "xstate": "^4.31.0"
   },
   "peerDependenciesMeta": {
     "@xstate/fsm": {
@@ -66,28 +66,29 @@
   },
   "dependencies": {
     "use-isomorphic-layout-effect": "^1.0.0",
-    "use-subscription": "^1.3.0"
+    "use-sync-external-store": "^1.0.0"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^17.0.0",
     "@rollup/plugin-node-resolve": "^11.0.1",
-    "@testing-library/react": "^8.0.9",
+    "@testing-library/react": "^13.0.0",
     "@types/jsdom": "^12.2.3",
-    "@types/react": "^16.9.11",
-    "@types/react-dom": "^16.9.4",
+    "@types/react": "^17.0.43",
+    "@types/react-dom": "^17.0.14",
+    "@types/use-sync-external-store": "^0.0.3",
     "@xstate/fsm": "*",
     "jest": "^26.6.3",
     "jsdom": "^14.0.0",
     "jsdom-global": "^3.0.2",
     "lerna-alias": "3.0.3-0",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
-    "rollup": "^2.35.1",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "rollup": "^2.69.0",
     "rollup-plugin-replace": "^2.2.0",
     "rollup-plugin-terser": "^5.1.2",
     "rollup-plugin-typescript2": "^0.30.0",
     "ts-jest": "^26.5.6",
-    "typescript": "^4.3.5",
+    "typescript": "^4.5.2",
     "xstate": "*"
   }
 }

package/dist/xstate-react.cjs.js

@@ -1,16 +0,0 @@
-"use strict";
-// this file might look strange and you might be wondering what it's for
-// it's lets you import your source files by importing this entrypoint
-// as you would import it if it was built with preconstruct build
-// this file is slightly different to some others though
-// it has a require hook which compiles your code with Babel
-// this means that you don't have to set up @babel/register or anything like that
-// but you can still require this module and it'll be compiled
-
-// this bit of code imports the require hook and registers it
-let unregister = require("../../../node_modules/@preconstruct/hook").___internalHook(typeof __dirname === 'undefined' ? undefined : __dirname, "../../..", "..");
-
-// this re-exports the source file
-module.exports = require("../src/index.ts");
-
-unregister();

package/es/useReactEffectActions.d.ts

@@ -1,3 +0,0 @@
-import { EventObject, Interpreter } from 'xstate';
-export declare function useReactEffectActions<TContext, TEvent extends EventObject>(service: Interpreter<TContext, any, TEvent, any>): void;
-//# sourceMappingURL=useReactEffectActions.d.ts.map