@koordinates/xstate-tree 4.3.0-beta.4 → 4.3.0-beta.6

package/lib/testingUtilities.js

@@ -121,7 +121,7 @@ function buildTestRootComponent(machine, logger) {
                     (0, xstateTree_1.recursivelySend)(interpreter, event);
                 }
                 function changeHandler(ctx, oldCtx) {
-                    logger("onChange: ", JSON.stringify((0, utils_1.difference)(ctx, oldCtx), null, 2));
+                    logger("onChange: ", (0, utils_1.difference)(oldCtx, ctx));
                     onChangeEmitter.emit("changed", ctx);
                 }
                 function onEventHandler(e) {

package/lib/utils.js

@@ -35,90 +35,28 @@ function isLikelyPageLoad() {
     return performance.now() < 5000;
 }
 exports.isLikelyPageLoad = isLikelyPageLoad;
-/*
- * @private
- *
- * Find the differences between two objects and push to a new object
- * (c) 2019 Chris Ferdinandi & Jascha Brinkmann, MIT License, https://gomakethings.com & https://twitter.com/jaschaio
- * @param  {Object} obj1 The original object
- * @param  {Object} obj2 The object to compare against it
- * @return {Object}      An object of differences between the two
- */
-function difference(obj1, obj2) {
-    if (!obj2 || Object.prototype.toString.call(obj2) !== "[object Object]") {
-        return obj1;
-    }
-    const diffs = {};
-    let key;
-    /**
-     * Check if two arrays are equal
-     * @param  {Array}   arr1 The first array
-     * @param  {Array}   arr2 The second array
-     * @return {Boolean}      If true, both arrays are equal
-     */
-    const arraysMatch = function arraysMatch(arr1, arr2) {
-        if (arr1.length !== arr2.length)
-            return false;
-        for (let i = 0; i < arr1.length; i++) {
-            if (arr1[i] !== arr2[i])
-                return false;
-        }
-        return true;
-    };
-    /**
-     * Compare two items and push non-matches to object
-     * @param  {*}      item1 The first item
-     * @param  {*}      item2 The second item
-     * @param  {String} key   The key in our object
-     */
-    function compare(item1, item2, key) {
-        const type1 = Object.prototype.toString.call(item1);
-        const type2 = Object.prototype.toString.call(item2);
-        if (type2 === "[object Undefined]") {
-            diffs[key] = null;
-            return;
-        }
-        if (type1 !== type2) {
-            diffs[key] = item2;
-            return;
+function difference(a, b) {
+    const result = {};
+    for (const key in b) {
+        if (!a.hasOwnProperty(key)) {
+            result[key] = b[key];
         }
-        if (type1 === "[object Object]") {
-            const objDiff = difference(item1, item2);
-            if (Object.keys(objDiff).length > 0) {
-                diffs[key] = objDiff;
+        else if (Array.isArray(b[key]) && Array.isArray(a[key])) {
+            if (JSON.stringify(b[key]) !== JSON.stringify(a[key])) {
+                result[key] = b[key];
             }
-            return;
         }
-        if (type1 === "[object Array]") {
-            if (!arraysMatch(item1, item2)) {
-                diffs[key] = item2;
+        else if (typeof b[key] === "object" && typeof a[key] === "object") {
+            const value = difference(a[key], b[key]);
+            if (Object.keys(value).length > 0) {
+                result[key] = value;
             }
-            return;
         }
-        if (type1 === "[object Function]") {
-            if (item1.toString() !== item2.toString()) {
-                diffs[key] = item2;
-            }
-        }
-        else {
-            if (item1 !== item2) {
-                diffs[key] = item2;
-            }
-        }
-    }
-    for (key in obj1) {
-        if (obj1.hasOwnProperty(key)) {
-            compare(obj1[key], obj2[key], key);
-        }
-    }
-    for (key in obj2) {
-        if (obj2.hasOwnProperty(key)) {
-            if (!obj1[key] && obj1[key] !== obj2[key]) {
-                diffs[key] = obj2[key];
-            }
+        else if (b[key] !== a[key]) {
+            result[key] = b[key];
         }
     }
-    return diffs;
+    return result;
 }
 exports.difference = difference;
 /*

package/lib/xstateTree.js

@@ -152,7 +152,7 @@ function XstateTreeView({ interpreter }) {
     // This is needed because the inState function needs to be recreated if the
     // current state the machine is in changes. But _only_ then
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [current.value]);
+    [current === null || current === void 0 ? void 0 : current.value]);
     const selectorsProxy = (0, useConstant_1.useConstant)(() => {
         return new Proxy({}, {
             get: (_target, prop) => {
@@ -206,9 +206,10 @@ exports.XstateTreeView = XstateTreeView;
  * @internal
  */
 function recursivelySend(service, event) {
+    var _a;
     const children = ([...service.children.values()] || []).filter((s) => s.id.includes("-slot"));
     // If the service can't handle the event, don't send it
-    if (service.state.nextEvents.includes(event.type)) {
+    if ((_a = service.getSnapshot()) === null || _a === void 0 ? void 0 : _a.nextEvents.includes(event.type)) {
         try {
             service.send(event);
         }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@koordinates/xstate-tree",
   "main": "lib/index.js",
   "types": "lib/xstate-tree.d.ts",
-  "version": "4.3.0-beta.4",
+  "version": "4.3.0-beta.6",
   "license": "MIT",
   "description": "Build UIs with Actors using xstate and React",
   "keywords": [