@xstate/react 3.0.1 → 4.0.0-alpha.1

package/lib/useInterpret.js

@@ -1,110 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-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.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");
-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 _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, 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,
-            actions: actions,
-            activities: activities,
-            services: services,
-            delays: delays
-        };
-        var machineWithConfig = machine.withConfig(machineConfig, function () { return (__assign(__assign({}, machine.context), context)); });
-        return (0, xstate_1.interpret)(machineWithConfig, interpreterOptions);
-    });
-    // 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.
-    (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]);
-    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,22 +0,0 @@
-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`.
-     */
-    context?: Partial<TContext>;
-    /**
-     * The state to rehydrate the machine to. The machine will
-     * start at this state instead of its `initialState`.
-     */
-    state?: StateConfig<TContext, TEvent>;
-}
-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 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

@@ -1,73 +0,0 @@
-"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.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 useInterpret_1 = require("./useInterpret");
-function identity(a) {
-    return a;
-}
-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;
-    // 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 > 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;
-        };
-    }, []);
-    return [storeSnapshot, service.send, service];
-}
-exports.useMachine = useMachine;

package/lib/useSelector.d.ts

@@ -1,3 +0,0 @@
-import { ActorRef, Subscribable } from 'xstate';
-export declare function useSelector<TActor extends ActorRef<any, any>, T, TEmitted = TActor extends Subscribable<infer Emitted> ? Emitted : never>(actor: TActor, selector: (emitted: TEmitted) => T, compare?: (a: T, b: T) => boolean, getSnapshot?: (a: TActor) => TEmitted): T;
-//# sourceMappingURL=useSelector.d.ts.map

package/lib/useSelector.js

@@ -1,40 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSelector = void 0;
-var react_1 = require("react");
-var with_selector_1 = require("use-sync-external-store/shim/with-selector");
-var useActor_1 = require("./useActor");
-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, initialStateCacheRef) {
-    if (isService(a)) {
-        // A status of 0 = interpreter not started
-        if (a.status === 0 && initialStateCacheRef.current) {
-            return initialStateCacheRef.current;
-        }
-        var snapshot = (0, utils_1.getServiceSnapshot)(a);
-        initialStateCacheRef.current = a.status === 0 ? snapshot : null;
-        return snapshot;
-    }
-    return (0, useActor_1.isActorWithState)(a) ? a.state : undefined;
-};
-function useSelector(actor, selector, compare, getSnapshot) {
-    if (compare === void 0) { compare = defaultCompare; }
-    var initialStateCacheRef = (0, react_1.useRef)(null);
-    var subscribe = (0, react_1.useCallback)(function (handleStoreChange) {
-        var unsubscribe = actor.subscribe(handleStoreChange).unsubscribe;
-        return unsubscribe;
-    }, [actor]);
-    var boundGetSnapshot = (0, react_1.useCallback)(function () {
-        if (getSnapshot) {
-            return getSnapshot(actor);
-        }
-        return defaultGetSnapshot(actor, initialStateCacheRef);
-    }, [actor, getSnapshot]);
-    var selectedSnapshot = (0, with_selector_1.useSyncExternalStoreWithSelector)(subscribe, boundGetSnapshot, boundGetSnapshot, selector, compare);
-    return selectedSnapshot;
-}
-exports.useSelector = useSelector;

package/lib/useSpawn.d.ts

@@ -1,10 +0,0 @@
-import { ActorRef, Behavior, EventObject } from 'xstate';
-/**
- * React hook that spawns an `ActorRef` with the specified `behavior`.
- * The returned `ActorRef` can be used with the `useActor(actorRef)` hook.
- *
- * @param behavior The actor behavior to spawn
- * @returns An ActorRef with the specified `behavior`
- */
-export declare function useSpawn<TState, TEvent extends EventObject>(behavior: Behavior<TEvent, TState>): ActorRef<TEvent, TState>;
-//# sourceMappingURL=useSpawn.d.ts.map

package/lib/useSpawn.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSpawn = void 0;
-var xstate_1 = require("xstate");
-var useConstant_1 = require("./useConstant");
-/**
- * React hook that spawns an `ActorRef` with the specified `behavior`.
- * The returned `ActorRef` can be used with the `useActor(actorRef)` hook.
- *
- * @param behavior The actor behavior to spawn
- * @returns An ActorRef with the specified `behavior`
- */
-function useSpawn(behavior) {
-    var actorRef = (0, useConstant_1.default)(function () {
-        return (0, xstate_1.spawnBehavior)(behavior);
-    });
-    return actorRef;
-}
-exports.useSpawn = useSpawn;

package/lib/utils.d.ts

@@ -1,5 +0,0 @@
-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'];
-export declare function shallowEqual(objA: any, objB: any): boolean;
-//# sourceMappingURL=utils.d.ts.map

package/lib/utils.js

@@ -1,89 +0,0 @@
-"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;
-};
-var __values = (this && this.__values) || function(o) {
-    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-    if (m) return m.call(o);
-    if (o && typeof o.length === "number") return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
-        }
-    };
-    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.shallowEqual = exports.getServiceSnapshot = exports.partition = void 0;
-function partition(items, predicate) {
-    var e_1, _a;
-    var _b = __read([[], []], 2), truthy = _b[0], falsy = _b[1];
-    try {
-        for (var items_1 = __values(items), items_1_1 = items_1.next(); !items_1_1.done; items_1_1 = items_1.next()) {
-            var item = items_1_1.value;
-            if (predicate(item)) {
-                truthy.push(item);
-            }
-            else {
-                falsy.push(item);
-            }
-        }
-    }
-    catch (e_1_1) { e_1 = { error: e_1_1 }; }
-    finally {
-        try {
-            if (items_1_1 && !items_1_1.done && (_a = items_1.return)) _a.call(items_1);
-        }
-        finally { if (e_1) throw e_1.error; }
-    }
-    return [truthy, falsy];
-}
-exports.partition = partition;
-function getServiceSnapshot(service) {
-    return service.status !== 0 ? service.state : service.machine.initialState;
-}
-exports.getServiceSnapshot = getServiceSnapshot;
-// From https://github.com/reduxjs/react-redux/blob/master/src/utils/shallowEqual.ts
-function is(x, y) {
-    if (x === y) {
-        return x !== 0 || y !== 0 || 1 / x === 1 / y;
-    }
-    else {
-        return x !== x && y !== y;
-    }
-}
-function shallowEqual(objA, objB) {
-    if (is(objA, objB))
-        return true;
-    if (typeof objA !== 'object' ||
-        objA === null ||
-        typeof objB !== 'object' ||
-        objB === null) {
-        return false;
-    }
-    var keysA = Object.keys(objA);
-    var keysB = Object.keys(objB);
-    if (keysA.length !== keysB.length)
-        return false;
-    for (var i = 0; i < keysA.length; i++) {
-        if (!Object.prototype.hasOwnProperty.call(objB, keysA[i]) ||
-            !is(objA[keysA[i]], objB[keysA[i]])) {
-            return false;
-        }
-    }
-    return true;
-}
-exports.shallowEqual = shallowEqual;