@xstate/react 3.0.1 → 3.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/xstate-react.umd.min.js +4 -4
- package/es/useActor.js +4 -1
- package/es/useMachine.js +1 -1
- package/es/useSelector.js +1 -4
- package/es/utils.d.ts +1 -0
- package/es/utils.js +6 -1
- package/lib/useActor.js +4 -1
- package/lib/useMachine.js +1 -1
- package/lib/useSelector.js +1 -4
- package/lib/utils.d.ts +1 -0
- package/lib/utils.js +8 -2
- package/package.json +3 -3
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("xstate")):"function"==typeof define&&define.amd?define(["exports","react","xstate"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).XStateReact={},t.React,t.XState)}(this,(function(t,e,n){"use strict";function r(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}function u(t){if(t&&t.__esModule)return t;var e=Object.create(null);return t&&Object.keys(t).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,r.get?r:{enumerable:!0,get:function(){return t[n]}})}})),e.default=t,Object.freeze(e)}var
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("xstate")):"function"==typeof define&&define.amd?define(["exports","react","xstate"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).XStateReact={},t.React,t.XState)}(this,(function(t,e,n){"use strict";function r(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}function u(t){if(t&&t.__esModule)return t;var e=Object.create(null);return t&&Object.keys(t).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,r.get?r:{enumerable:!0,get:function(){return t[n]}})}})),e.default=t,Object.freeze(e)}var o=r(e),a=u(e),i=function(){return(i=Object.assign||function(t){for(var e,n=1,r=arguments.length;n<r;n++)for(var u in e=arguments[n])Object.prototype.hasOwnProperty.call(e,u)&&(t[u]=e[u]);return t}).apply(this,arguments)};function c(t,e){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var r,u,o=n.call(t),a=[];try{for(;(void 0===e||e-- >0)&&!(r=o.next()).done;)a.push(r.value)}catch(t){u={error:t}}finally{try{r&&!r.done&&(n=o.return)&&n.call(o)}finally{if(u)throw u.error}}return a}function s(t){var e={exports:{}};return t(e,e.exports),e.exports
|
|
2
2
|
/**
|
|
3
3
|
* @license React
|
|
4
4
|
* use-sync-external-store-shim.production.min.js
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
*
|
|
8
8
|
* This source code is licensed under the MIT license found in the
|
|
9
9
|
* LICENSE file in the root directory of this source tree.
|
|
10
|
-
*/}var f="function"==typeof Object.is?Object.is:function(t,e){return t===e&&(0!==t||1/t==1/e)||t!=t&&e!=e},l=
|
|
10
|
+
*/}var f="function"==typeof Object.is?Object.is:function(t,e){return t===e&&(0!==t||1/t==1/e)||t!=t&&e!=e},l=o.default.useState,v=o.default.useEffect,d=o.default.useLayoutEffect,p=o.default.useDebugValue;function b(t){var e=t.getSnapshot;t=t.value;try{var n=e();return!f(t,n)}catch(t){return!0}}var y="undefined"==typeof window||void 0===window.document||void 0===window.document.createElement?function(t,e){return e()}:function(t,e){var n=e(),r=l({inst:{value:n,getSnapshot:e}}),u=r[0].inst,o=r[1];return d((function(){u.value=n,u.getSnapshot=e,b(u)&&o({inst:u})}),[t,n,e]),v((function(){return b(u)&&o({inst:u}),t((function(){b(u)&&o({inst:u})}))}),[t]),p(n),n},h={useSyncExternalStore:void 0!==o.default.useSyncExternalStore?o.default.useSyncExternalStore:y};
|
|
11
11
|
/**
|
|
12
12
|
* @license React
|
|
13
13
|
* use-sync-external-store-shim.development.js
|
|
@@ -26,7 +26,7 @@ s((function(t,e){}));var S=s((function(t){t.exports=h}));
|
|
|
26
26
|
*
|
|
27
27
|
* This source code is licensed under the MIT license found in the
|
|
28
28
|
* LICENSE file in the root directory of this source tree.
|
|
29
|
-
*/var g="function"==typeof Object.is?Object.is:function(t,e){return t===e&&(0!==t||1/t==1/e)||t!=t&&e!=e},O=S.useSyncExternalStore,j=
|
|
29
|
+
*/var g="function"==typeof Object.is?Object.is:function(t,e){return t===e&&(0!==t||1/t==1/e)||t!=t&&e!=e},O=S.useSyncExternalStore,j=o.default.useRef,x=o.default.useEffect,m=o.default.useMemo,E=o.default.useDebugValue,w={useSyncExternalStoreWithSelector:function(t,e,n,r,u){var o=j(null);if(null===o.current){var a={hasValue:!1,value:null};o.current=a}else a=o.current;o=m((function(){function t(t){if(!c){if(c=!0,o=t,t=r(t),void 0!==u&&a.hasValue){var e=a.value;if(u(e,t))return i=e}return i=t}if(e=i,g(o,t))return e;var n=r(t);return void 0!==u&&u(e,n)?e:(o=t,i=n)}var o,i,c=!1,s=void 0===n?null:n;return[function(){return t(e())},null===s?void 0:function(){return t(s())}]}),[e,n,r,u]);var i=O(t,o[0],o[1]);return x((function(){a.hasValue=!0,a.value=i}),[i]),E(i),i}};
|
|
30
30
|
/**
|
|
31
31
|
* @license React
|
|
32
32
|
* use-sync-external-store-shim/with-selector.development.js
|
|
@@ -36,4 +36,4 @@ s((function(t,e){}));var S=s((function(t){t.exports=h}));
|
|
|
36
36
|
* This source code is licensed under the MIT license found in the
|
|
37
37
|
* LICENSE file in the root directory of this source tree.
|
|
38
38
|
*/
|
|
39
|
-
s((function(t,e){}));var k=s((function(t){t.exports=w})),C=e.useLayoutEffect;function P(t){var e=
|
|
39
|
+
s((function(t,e){}));var k=s((function(t){t.exports=w})),C=e.useLayoutEffect;function P(t){var e=a.useRef();return e.current||(e.current={v:t()}),e.current.v}function R(t,e){var r=P((function(){return"function"==typeof t?t():t})),u=e.context,o=e.guards,a=e.actions,c=e.activities,s=e.services,f=e.delays;e.state;var l=function(t,e){var n={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(n[r]=t[r]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var u=0;for(r=Object.getOwnPropertySymbols(t);u<r.length;u++)e.indexOf(r[u])<0&&Object.prototype.propertyIsEnumerable.call(t,r[u])&&(n[r[u]]=t[r[u]])}return n}(e,["context","guards","actions","activities","services","delays","state"]),v=P((function(){var t={context:u,guards:o,actions:a,activities:c,services:s,delays:f},e=r.withConfig(t,(function(){return i(i({},r.context),u)}));return n.interpret(e,l)}));return C((function(){Object.assign(v.machine.options.actions,a),Object.assign(v.machine.options.guards,o),Object.assign(v.machine.options.activities,c),Object.assign(v.machine.options.services,s),Object.assign(v.machine.options.delays,f)}),[a,o,c,s,f]),v}function I(t){return t}function V(t){return 0!==t.status?t.getSnapshot():t.machine.initialState}function M(t,e){return t===e?0!==t||0!==e||1/t==1/e:t!=t&&e!=e}function N(t){return"state"in t&&"machine"in t}function _(t){return"state"in t}function q(t){return"deferred"in t}function D(t){return"getSnapshot"in t?N(t)?V(t):t.getSnapshot():_(t)?t.state:void 0}var W=function(t,e){return t===e};t.shallowEqual=function(t,e){if(M(t,e))return!0;if("object"!=typeof t||null===t||"object"!=typeof e||null===e)return!1;var n=Object.keys(t),r=Object.keys(e);if(n.length!==r.length)return!1;for(var u=0;u<n.length;u++)if(!Object.prototype.hasOwnProperty.call(e,n[u])||!M(t[n[u]],e[n[u]]))return!1;return!0},t.useActor=function(t,n){void 0===n&&(n=D);var r=e.useRef(t),u=e.useRef([]),o=e.useCallback((function(e){return t.subscribe(e).unsubscribe}),[t]),a=e.useCallback((function(){return n(t)}),[t,n]),i=S.useSyncExternalStore(o,a,a),c=P((function(){return function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var n=t[0],o=r.current;q(o)&&o.deferred?u.current.push(n):o.send(n)}}));return C((function(){for(r.current=t;u.current.length>0;){var e=u.current.shift();t.send(e)}}),[t]),[i,c]},t.useInterpret=function(t){for(var r=[],u=1;u<arguments.length;u++)r[u-1]=arguments[u];var o=c(r,2),a=o[0],i=void 0===a?{}:a,s=o[1],f=R(t,i);return e.useEffect((function(){if(s){var t=f.subscribe(n.toObserver(s));return function(){t.unsubscribe()}}}),[s]),e.useEffect((function(){var t=i.state;return f.start(t?n.State.create(t):void 0),function(){f.stop(),f.status=n.InterpreterStatus.NotStarted}}),[]),f},t.useMachine=function(t){for(var r=[],u=1;u<arguments.length;u++)r[u-1]=arguments[u];var o=c(r,1),a=o[0],i=void 0===a?{}:a,s=R(t,i),f=e.useCallback((function(){return s.status===n.InterpreterStatus.NotStarted?i.state?n.State.create(i.state):s.machine.initialState:s.getSnapshot()}),[s]),l=e.useCallback((function(t,e){if(s.status===n.InterpreterStatus.NotStarted)return!0;var r=void 0===e.changed&&(Object.keys(e.children).length>0||"boolean"==typeof t.changed);return!(e.changed||r)}),[s]),v=e.useCallback((function(t){return s.subscribe(t).unsubscribe}),[s]),d=k.useSyncExternalStoreWithSelector(v,f,f,I,l);return e.useEffect((function(){var t=i.state;return s.start(t?n.State.create(t):void 0),function(){s.stop(),s.status=n.InterpreterStatus.NotStarted}}),[]),[d,s.send,s]},t.useSelector=function(t,n,r,u){void 0===r&&(r=W);var o=e.useRef(null),a=e.useCallback((function(e){return t.subscribe(e).unsubscribe}),[t]),i=e.useCallback((function(){return u?u(t):function(t,e){if(N(t)){if(0===t.status&&e.current)return e.current;var n=V(t);return e.current=0===t.status?n:null,n}return _(t)?t.state:void 0}(t,o)}),[t,u]);return k.useSyncExternalStoreWithSelector(a,i,i,n,r)},t.useSpawn=function(t){return P((function(){return n.spawnBehavior(t)}))},Object.defineProperty(t,"__esModule",{value:!0})}));
|
package/es/useActor.js
CHANGED
|
@@ -2,6 +2,7 @@ import { useRef, useCallback } from 'react';
|
|
|
2
2
|
import useIsomorphicLayoutEffect from 'use-isomorphic-layout-effect';
|
|
3
3
|
import useConstant from './useConstant';
|
|
4
4
|
import { useSyncExternalStore } from 'use-sync-external-store/shim';
|
|
5
|
+
import { getServiceSnapshot, isService } from './utils';
|
|
5
6
|
export function isActorWithState(actorRef) {
|
|
6
7
|
return 'state' in actorRef;
|
|
7
8
|
}
|
|
@@ -10,7 +11,9 @@ function isDeferredActor(actorRef) {
|
|
|
10
11
|
}
|
|
11
12
|
function defaultGetSnapshot(actorRef) {
|
|
12
13
|
return 'getSnapshot' in actorRef
|
|
13
|
-
? actorRef
|
|
14
|
+
? isService(actorRef)
|
|
15
|
+
? getServiceSnapshot(actorRef)
|
|
16
|
+
: actorRef.getSnapshot()
|
|
14
17
|
: isActorWithState(actorRef)
|
|
15
18
|
? actorRef.state
|
|
16
19
|
: undefined;
|
package/es/useMachine.js
CHANGED
|
@@ -36,7 +36,7 @@ export function useMachine(getMachine) {
|
|
|
36
36
|
? State.create(options.state)
|
|
37
37
|
: service.machine.initialState);
|
|
38
38
|
}
|
|
39
|
-
return service.
|
|
39
|
+
return service.getSnapshot();
|
|
40
40
|
}, [service]);
|
|
41
41
|
var isEqual = useCallback(function (prevState, nextState) {
|
|
42
42
|
if (service.status === InterpreterStatus.NotStarted) {
|
package/es/useSelector.js
CHANGED
|
@@ -1,10 +1,7 @@
|
|
|
1
1
|
import { useCallback, useRef } from 'react';
|
|
2
2
|
import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector';
|
|
3
3
|
import { isActorWithState } from './useActor';
|
|
4
|
-
import { getServiceSnapshot } from './utils';
|
|
5
|
-
function isService(actor) {
|
|
6
|
-
return 'state' in actor && 'machine' in actor;
|
|
7
|
-
}
|
|
4
|
+
import { getServiceSnapshot, isService } from './utils';
|
|
8
5
|
var defaultCompare = function (a, b) { return a === b; };
|
|
9
6
|
var defaultGetSnapshot = function (a, initialStateCacheRef) {
|
|
10
7
|
if (isService(a)) {
|
package/es/utils.d.ts
CHANGED
|
@@ -2,4 +2,5 @@ import { Interpreter } from 'xstate';
|
|
|
2
2
|
export declare function partition<T, A extends T, B extends T>(items: T[], predicate: (item: T) => item is A): [A[], B[]];
|
|
3
3
|
export declare function getServiceSnapshot<TService extends Interpreter<any, any, any, any>>(service: TService): TService['state'];
|
|
4
4
|
export declare function shallowEqual(objA: any, objB: any): boolean;
|
|
5
|
+
export declare function isService(actor: any): actor is Interpreter<any, any, any, any>;
|
|
5
6
|
//# sourceMappingURL=utils.d.ts.map
|
package/es/utils.js
CHANGED
|
@@ -49,7 +49,9 @@ export function partition(items, predicate) {
|
|
|
49
49
|
return [truthy, falsy];
|
|
50
50
|
}
|
|
51
51
|
export function getServiceSnapshot(service) {
|
|
52
|
-
return service.status !== 0
|
|
52
|
+
return service.status !== 0
|
|
53
|
+
? service.getSnapshot()
|
|
54
|
+
: service.machine.initialState;
|
|
53
55
|
}
|
|
54
56
|
// From https://github.com/reduxjs/react-redux/blob/master/src/utils/shallowEqual.ts
|
|
55
57
|
function is(x, y) {
|
|
@@ -81,3 +83,6 @@ export function shallowEqual(objA, objB) {
|
|
|
81
83
|
}
|
|
82
84
|
return true;
|
|
83
85
|
}
|
|
86
|
+
export function isService(actor) {
|
|
87
|
+
return 'state' in actor && 'machine' in actor;
|
|
88
|
+
}
|
package/lib/useActor.js
CHANGED
|
@@ -5,6 +5,7 @@ var react_1 = require("react");
|
|
|
5
5
|
var use_isomorphic_layout_effect_1 = require("use-isomorphic-layout-effect");
|
|
6
6
|
var useConstant_1 = require("./useConstant");
|
|
7
7
|
var shim_1 = require("use-sync-external-store/shim");
|
|
8
|
+
var utils_1 = require("./utils");
|
|
8
9
|
function isActorWithState(actorRef) {
|
|
9
10
|
return 'state' in actorRef;
|
|
10
11
|
}
|
|
@@ -14,7 +15,9 @@ function isDeferredActor(actorRef) {
|
|
|
14
15
|
}
|
|
15
16
|
function defaultGetSnapshot(actorRef) {
|
|
16
17
|
return 'getSnapshot' in actorRef
|
|
17
|
-
?
|
|
18
|
+
? (0, utils_1.isService)(actorRef)
|
|
19
|
+
? (0, utils_1.getServiceSnapshot)(actorRef)
|
|
20
|
+
: actorRef.getSnapshot()
|
|
18
21
|
: isActorWithState(actorRef)
|
|
19
22
|
? actorRef.state
|
|
20
23
|
: undefined;
|
package/lib/useMachine.js
CHANGED
|
@@ -39,7 +39,7 @@ function useMachine(getMachine) {
|
|
|
39
39
|
? xstate_1.State.create(options.state)
|
|
40
40
|
: service.machine.initialState);
|
|
41
41
|
}
|
|
42
|
-
return service.
|
|
42
|
+
return service.getSnapshot();
|
|
43
43
|
}, [service]);
|
|
44
44
|
var isEqual = (0, react_1.useCallback)(function (prevState, nextState) {
|
|
45
45
|
if (service.status === xstate_1.InterpreterStatus.NotStarted) {
|
package/lib/useSelector.js
CHANGED
|
@@ -5,12 +5,9 @@ var react_1 = require("react");
|
|
|
5
5
|
var with_selector_1 = require("use-sync-external-store/shim/with-selector");
|
|
6
6
|
var useActor_1 = require("./useActor");
|
|
7
7
|
var utils_1 = require("./utils");
|
|
8
|
-
function isService(actor) {
|
|
9
|
-
return 'state' in actor && 'machine' in actor;
|
|
10
|
-
}
|
|
11
8
|
var defaultCompare = function (a, b) { return a === b; };
|
|
12
9
|
var defaultGetSnapshot = function (a, initialStateCacheRef) {
|
|
13
|
-
if (isService(a)) {
|
|
10
|
+
if ((0, utils_1.isService)(a)) {
|
|
14
11
|
// A status of 0 = interpreter not started
|
|
15
12
|
if (a.status === 0 && initialStateCacheRef.current) {
|
|
16
13
|
return initialStateCacheRef.current;
|
package/lib/utils.d.ts
CHANGED
|
@@ -2,4 +2,5 @@ import { Interpreter } from 'xstate';
|
|
|
2
2
|
export declare function partition<T, A extends T, B extends T>(items: T[], predicate: (item: T) => item is A): [A[], B[]];
|
|
3
3
|
export declare function getServiceSnapshot<TService extends Interpreter<any, any, any, any>>(service: TService): TService['state'];
|
|
4
4
|
export declare function shallowEqual(objA: any, objB: any): boolean;
|
|
5
|
+
export declare function isService(actor: any): actor is Interpreter<any, any, any, any>;
|
|
5
6
|
//# sourceMappingURL=utils.d.ts.map
|
package/lib/utils.js
CHANGED
|
@@ -27,7 +27,7 @@ var __values = (this && this.__values) || function(o) {
|
|
|
27
27
|
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
|
|
28
28
|
};
|
|
29
29
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
30
|
-
exports.shallowEqual = exports.getServiceSnapshot = exports.partition = void 0;
|
|
30
|
+
exports.isService = exports.shallowEqual = exports.getServiceSnapshot = exports.partition = void 0;
|
|
31
31
|
function partition(items, predicate) {
|
|
32
32
|
var e_1, _a;
|
|
33
33
|
var _b = __read([[], []], 2), truthy = _b[0], falsy = _b[1];
|
|
@@ -53,7 +53,9 @@ function partition(items, predicate) {
|
|
|
53
53
|
}
|
|
54
54
|
exports.partition = partition;
|
|
55
55
|
function getServiceSnapshot(service) {
|
|
56
|
-
return service.status !== 0
|
|
56
|
+
return service.status !== 0
|
|
57
|
+
? service.getSnapshot()
|
|
58
|
+
: service.machine.initialState;
|
|
57
59
|
}
|
|
58
60
|
exports.getServiceSnapshot = getServiceSnapshot;
|
|
59
61
|
// From https://github.com/reduxjs/react-redux/blob/master/src/utils/shallowEqual.ts
|
|
@@ -87,3 +89,7 @@ function shallowEqual(objA, objB) {
|
|
|
87
89
|
return true;
|
|
88
90
|
}
|
|
89
91
|
exports.shallowEqual = shallowEqual;
|
|
92
|
+
function isService(actor) {
|
|
93
|
+
return 'state' in actor && 'machine' in actor;
|
|
94
|
+
}
|
|
95
|
+
exports.isService = isService;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xstate/react",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.2",
|
|
4
4
|
"description": "XState tools for React",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"state",
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"peerDependencies": {
|
|
55
55
|
"@xstate/fsm": "^2.0.0",
|
|
56
56
|
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
|
57
|
-
"xstate": "^4.
|
|
57
|
+
"xstate": "^4.35.2"
|
|
58
58
|
},
|
|
59
59
|
"peerDependenciesMeta": {
|
|
60
60
|
"@xstate/fsm": {
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"rollup-plugin-terser": "^5.1.2",
|
|
89
89
|
"rollup-plugin-typescript2": "^0.30.0",
|
|
90
90
|
"ts-jest": "^26.5.6",
|
|
91
|
-
"typescript": "^4.
|
|
91
|
+
"typescript": "^4.8.4",
|
|
92
92
|
"xstate": "*"
|
|
93
93
|
}
|
|
94
94
|
}
|