@koordinates/xstate-tree 5.3.0 → 5.5.0

package/lib/slots/slots.js

@@ -16,7 +16,9 @@ function singleSlot(name) {
     return {
         type: SlotType.SingleSlot,
         name,
-        getId: () => `${name.toLowerCase()}-slot`,
+        getId: (suffix) => suffix
+            ? `${name.toLowerCase()}-${suffix}-slot`
+            : `${name.toLowerCase()}-slot`,
     };
 }
 exports.singleSlot = singleSlot;
@@ -27,7 +29,9 @@ function multiSlot(name) {
     return {
         type: SlotType.MultiSlot,
         name: `${name}Multi`,
-        getId: (id) => `${id}-${name.toLowerCase()}multi-slots`,
+        getId: (id, suffix) => suffix
+            ? `${id}-${name.toLowerCase()}multi-slots-${suffix}`
+            : `${id}-${name.toLowerCase()}multi-slots`,
     };
 }
 exports.multiSlot = multiSlot;

package/lib/xstate-tree.d.ts

@@ -320,7 +320,7 @@ export declare type Meta<T> = T extends {
 export declare type MultiSlot<T extends string> = {
     type: SlotType.MultiSlot;
     name: `${T}Multi`;
-    getId(id: string): string;
+    getId(id: string, suffix?: string): string;
 };
 
 /**
@@ -410,6 +410,7 @@ declare type RootOptions<TInput> = {
         basePath: string;
         getPathName?: () => string;
         getQueryString?: () => string;
+        shouldBlockActiveRouteUpdate?: (event: RoutingEvent<any>) => boolean;
     } | undefined;
     input: IsUnknown<TInput> extends true ? undefined : TInput;
 };
@@ -620,7 +621,7 @@ export declare type SharedMeta = {
 export declare type SingleSlot<T extends string> = {
     type: SlotType.SingleSlot;
     name: T;
-    getId(): string;
+    getId(suffix?: string): string;
 };
 
 /**

package/lib/xstateTree.js

@@ -331,8 +331,12 @@ function buildRootComponent(options) {
                 const queryString = getQueryString();
                 const result = (0, routing_1.handleLocationChange)(routing.routes, routing.basePath, getPathName(), getQueryString(), initialMeta);
                 if (result) {
-                    setActiveRouteEvents(result.events);
-                    setActiveRoute({ ...result.matchedRoute });
+                    const matchedEvent = result.events[result.events.length - 1];
+                    const block = routing.shouldBlockActiveRouteUpdate?.(matchedEvent) === true;
+                    if (!block) {
+                        setActiveRouteEvents(result.events);
+                        setActiveRoute({ ...result.matchedRoute });
+                    }
                 }
                 // Hack to ensure the initial location doesn't have undefined state
                 // It's not supposed to, but it does for some reason
@@ -347,8 +351,12 @@ function buildRootComponent(options) {
                 const unsub = routing.history.listen((location) => {
                     const result = (0, routing_1.handleLocationChange)(routing.routes, routing.basePath, location.pathname, location.search, location.state?.meta);
                     if (result) {
-                        setActiveRouteEvents(result.events);
-                        setActiveRoute({ ...result.matchedRoute });
+                        const matchedEvent = result.events[result.events.length - 1];
+                        const block = routing.shouldBlockActiveRouteUpdate?.(matchedEvent) === true;
+                        if (!block) {
+                            setActiveRouteEvents(result.events);
+                            setActiveRoute({ ...result.matchedRoute });
+                        }
                     }
                 });
                 return () => {

package/package.json

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