@xmachines/docs 1.0.0-beta.10

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.
Files changed (197) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +15 -0
  3. package/api/@xmachines/play/README.md +130 -0
  4. package/api/@xmachines/play/type-aliases/PlayEvent.md +81 -0
  5. package/api/@xmachines/play-actor/README.md +247 -0
  6. package/api/@xmachines/play-actor/classes/AbstractActor.md +520 -0
  7. package/api/@xmachines/play-actor/interfaces/Routable.md +29 -0
  8. package/api/@xmachines/play-actor/interfaces/ViewMetadata.md +17 -0
  9. package/api/@xmachines/play-actor/interfaces/Viewable.md +12 -0
  10. package/api/@xmachines/play-catalog/README.md +331 -0
  11. package/api/@xmachines/play-catalog/functions/defineCatalog.md +98 -0
  12. package/api/@xmachines/play-catalog/functions/defineComponents.md +134 -0
  13. package/api/@xmachines/play-catalog/type-aliases/Catalog.md +48 -0
  14. package/api/@xmachines/play-catalog/type-aliases/ComponentsFor.md +20 -0
  15. package/api/@xmachines/play-catalog/type-aliases/InferComponentProps.md +65 -0
  16. package/api/@xmachines/play-catalog/type-aliases/NoExtraKeys.md +17 -0
  17. package/api/@xmachines/play-react/README.md +423 -0
  18. package/api/@xmachines/play-react/classes/PlayErrorBoundary.md +613 -0
  19. package/api/@xmachines/play-react/functions/useSignalEffect.md +68 -0
  20. package/api/@xmachines/play-react/interfaces/PlayErrorBoundaryProps.md +15 -0
  21. package/api/@xmachines/play-react/interfaces/PlayErrorBoundaryState.md +14 -0
  22. package/api/@xmachines/play-react/interfaces/PlayRendererProps.md +15 -0
  23. package/api/@xmachines/play-react/variables/PlayRenderer.md +64 -0
  24. package/api/@xmachines/play-react-router/README.md +198 -0
  25. package/api/@xmachines/play-react-router/classes/ReactRouterBridge.md +321 -0
  26. package/api/@xmachines/play-react-router/classes/RouteMap.md +137 -0
  27. package/api/@xmachines/play-react-router/functions/PlayRouterProvider.md +19 -0
  28. package/api/@xmachines/play-react-router/functions/createRouteMapFromTree.md +35 -0
  29. package/api/@xmachines/play-react-router/interfaces/PlayRouteEvent.md +119 -0
  30. package/api/@xmachines/play-react-router/interfaces/PlayRouterProviderProps.md +14 -0
  31. package/api/@xmachines/play-react-router/interfaces/RouteMapping.md +17 -0
  32. package/api/@xmachines/play-react-router/interfaces/RouterBridge.md +104 -0
  33. package/api/@xmachines/play-react-router-demo/README.md +137 -0
  34. package/api/@xmachines/play-router/README.md +502 -0
  35. package/api/@xmachines/play-router/classes/BaseRouteMap.md +142 -0
  36. package/api/@xmachines/play-router/classes/RouterBridgeBase.md +300 -0
  37. package/api/@xmachines/play-router/functions/buildRouteTree.md +27 -0
  38. package/api/@xmachines/play-router/functions/connectRouter.md +67 -0
  39. package/api/@xmachines/play-router/functions/crawlMachine.md +92 -0
  40. package/api/@xmachines/play-router/functions/createBrowserHistory.md +47 -0
  41. package/api/@xmachines/play-router/functions/createRouteMap.md +53 -0
  42. package/api/@xmachines/play-router/functions/createRouter.md +76 -0
  43. package/api/@xmachines/play-router/functions/detectDuplicateRoutes.md +32 -0
  44. package/api/@xmachines/play-router/functions/extractMachineRoutes.md +64 -0
  45. package/api/@xmachines/play-router/functions/extractRoute.md +45 -0
  46. package/api/@xmachines/play-router/functions/findRouteById.md +37 -0
  47. package/api/@xmachines/play-router/functions/findRouteByPath.md +39 -0
  48. package/api/@xmachines/play-router/functions/getNavigableRoutes.md +35 -0
  49. package/api/@xmachines/play-router/functions/getRoutableRoutes.md +39 -0
  50. package/api/@xmachines/play-router/functions/routeExists.md +26 -0
  51. package/api/@xmachines/play-router/functions/validateRouteFormat.md +29 -0
  52. package/api/@xmachines/play-router/functions/validateStateExists.md +29 -0
  53. package/api/@xmachines/play-router/interfaces/BaseRouteMapping.md +27 -0
  54. package/api/@xmachines/play-router/interfaces/BrowserHistory.md +172 -0
  55. package/api/@xmachines/play-router/interfaces/BrowserWindow.md +69 -0
  56. package/api/@xmachines/play-router/interfaces/ConnectRouterOptions.md +13 -0
  57. package/api/@xmachines/play-router/interfaces/PlayRouteEvent.md +119 -0
  58. package/api/@xmachines/play-router/interfaces/RouteInfo.md +19 -0
  59. package/api/@xmachines/play-router/interfaces/RouteMap.md +56 -0
  60. package/api/@xmachines/play-router/interfaces/RouteNode.md +21 -0
  61. package/api/@xmachines/play-router/interfaces/RouteObject.md +21 -0
  62. package/api/@xmachines/play-router/interfaces/RouteTree.md +20 -0
  63. package/api/@xmachines/play-router/interfaces/RouterBridge.md +104 -0
  64. package/api/@xmachines/play-router/interfaces/StateVisit.md +15 -0
  65. package/api/@xmachines/play-router/interfaces/VanillaRouter.md +28 -0
  66. package/api/@xmachines/play-router/type-aliases/RouteMetadata.md +11 -0
  67. package/api/@xmachines/play-router-demo/README.md +137 -0
  68. package/api/@xmachines/play-signals/README.md +176 -0
  69. package/api/@xmachines/play-signals/interfaces/ComputedOptions.md +34 -0
  70. package/api/@xmachines/play-signals/interfaces/SignalComputed.md +49 -0
  71. package/api/@xmachines/play-signals/interfaces/SignalOptions.md +35 -0
  72. package/api/@xmachines/play-signals/interfaces/SignalState.md +68 -0
  73. package/api/@xmachines/play-signals/interfaces/SignalWatcher.md +97 -0
  74. package/api/@xmachines/play-signals/namespaces/Signal/README.md +22 -0
  75. package/api/@xmachines/play-signals/namespaces/Signal/classes/Computed.md +52 -0
  76. package/api/@xmachines/play-signals/namespaces/Signal/classes/State.md +72 -0
  77. package/api/@xmachines/play-signals/namespaces/Signal/interfaces/Options.md +19 -0
  78. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/README.md +21 -0
  79. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/classes/Watcher.md +85 -0
  80. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/functions/currentComputed.md +13 -0
  81. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/functions/hasSinks.md +19 -0
  82. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/functions/hasSources.md +19 -0
  83. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/functions/introspectSinks.md +19 -0
  84. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/functions/introspectSources.md +19 -0
  85. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/functions/untrack.md +25 -0
  86. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/variables/unwatched.md +9 -0
  87. package/api/@xmachines/play-signals/namespaces/Signal/namespaces/subtle/variables/watched.md +9 -0
  88. package/api/@xmachines/play-signals/namespaces/Signal/variables/isComputed.md +19 -0
  89. package/api/@xmachines/play-signals/namespaces/Signal/variables/isState.md +19 -0
  90. package/api/@xmachines/play-signals/namespaces/Signal/variables/isWatcher.md +19 -0
  91. package/api/@xmachines/play-signals/type-aliases/WatcherNotify.md +32 -0
  92. package/api/@xmachines/play-solid/README.md +311 -0
  93. package/api/@xmachines/play-solid/interfaces/PlayRendererProps.md +15 -0
  94. package/api/@xmachines/play-solid/variables/PlayRenderer.md +70 -0
  95. package/api/@xmachines/play-solid-router/README.md +666 -0
  96. package/api/@xmachines/play-solid-router/classes/RouteMap.md +150 -0
  97. package/api/@xmachines/play-solid-router/classes/SolidRouterBridge.md +347 -0
  98. package/api/@xmachines/play-solid-router/functions/PlayRouterProvider.md +19 -0
  99. package/api/@xmachines/play-solid-router/functions/createRouteMap.md +32 -0
  100. package/api/@xmachines/play-solid-router/interfaces/AbstractActor.md +486 -0
  101. package/api/@xmachines/play-solid-router/interfaces/PlayRouteEvent.md +119 -0
  102. package/api/@xmachines/play-solid-router/interfaces/PlayRouterProviderProps.md +14 -0
  103. package/api/@xmachines/play-solid-router/interfaces/RouteMapping.md +14 -0
  104. package/api/@xmachines/play-solid-router/interfaces/RouterBridge.md +104 -0
  105. package/api/@xmachines/play-solid-router/type-aliases/RoutableActor.md +9 -0
  106. package/api/@xmachines/play-solid-router/type-aliases/SolidRouterHooks.md +51 -0
  107. package/api/@xmachines/play-solid-router-demo/README.md +127 -0
  108. package/api/@xmachines/play-tanstack-react-router/README.md +226 -0
  109. package/api/@xmachines/play-tanstack-react-router/classes/RouteMap.md +137 -0
  110. package/api/@xmachines/play-tanstack-react-router/classes/TanStackReactRouterBridge.md +348 -0
  111. package/api/@xmachines/play-tanstack-react-router/functions/PlayRouterProvider.md +19 -0
  112. package/api/@xmachines/play-tanstack-react-router/functions/createRouteMap.md +53 -0
  113. package/api/@xmachines/play-tanstack-react-router/functions/createRouteMapFromTree.md +35 -0
  114. package/api/@xmachines/play-tanstack-react-router/functions/extractParams.md +38 -0
  115. package/api/@xmachines/play-tanstack-react-router/functions/extractQueryParams.md +33 -0
  116. package/api/@xmachines/play-tanstack-react-router/interfaces/PlayRouteEvent.md +119 -0
  117. package/api/@xmachines/play-tanstack-react-router/interfaces/PlayRouterProviderProps.md +14 -0
  118. package/api/@xmachines/play-tanstack-react-router/interfaces/RouteMapping.md +17 -0
  119. package/api/@xmachines/play-tanstack-react-router/interfaces/RouteNavigateEvent.md +26 -0
  120. package/api/@xmachines/play-tanstack-react-router/interfaces/RouterBridge.md +104 -0
  121. package/api/@xmachines/play-tanstack-react-router/type-aliases/TanStackRouterInstance.md +9 -0
  122. package/api/@xmachines/play-tanstack-react-router/type-aliases/TanStackRouterLike.md +78 -0
  123. package/api/@xmachines/play-tanstack-react-router/variables/extractMachineRoutes.md +64 -0
  124. package/api/@xmachines/play-tanstack-react-router-demo/README.md +126 -0
  125. package/api/@xmachines/play-tanstack-solid-router/README.md +285 -0
  126. package/api/@xmachines/play-tanstack-solid-router/classes/RouteMap.md +150 -0
  127. package/api/@xmachines/play-tanstack-solid-router/classes/SolidRouterBridge.md +343 -0
  128. package/api/@xmachines/play-tanstack-solid-router/functions/PlayRouterProvider.md +19 -0
  129. package/api/@xmachines/play-tanstack-solid-router/functions/createRouteMap.md +32 -0
  130. package/api/@xmachines/play-tanstack-solid-router/interfaces/PlayRouteEvent.md +119 -0
  131. package/api/@xmachines/play-tanstack-solid-router/interfaces/PlayRouterProviderProps.md +14 -0
  132. package/api/@xmachines/play-tanstack-solid-router/interfaces/RouteMapping.md +23 -0
  133. package/api/@xmachines/play-tanstack-solid-router/interfaces/RouterBridge.md +104 -0
  134. package/api/@xmachines/play-tanstack-solid-router/type-aliases/RoutableActor.md +9 -0
  135. package/api/@xmachines/play-tanstack-solid-router/type-aliases/TanStackRouterInstance.md +9 -0
  136. package/api/@xmachines/play-tanstack-solid-router/type-aliases/TanStackRouterLike.md +78 -0
  137. package/api/@xmachines/play-tanstack-solid-router-demo/README.md +126 -0
  138. package/api/@xmachines/play-vue/README.md +292 -0
  139. package/api/@xmachines/play-vue/interfaces/PlayRendererProps.md +14 -0
  140. package/api/@xmachines/play-vue/variables/PlayRenderer.md +9 -0
  141. package/api/@xmachines/play-vue-router/README.md +604 -0
  142. package/api/@xmachines/play-vue-router/classes/RouteMap.md +209 -0
  143. package/api/@xmachines/play-vue-router/classes/VueBaseRouteMap.md +201 -0
  144. package/api/@xmachines/play-vue-router/classes/VueRouterBridge.md +360 -0
  145. package/api/@xmachines/play-vue-router/functions/createRouteMap.md +19 -0
  146. package/api/@xmachines/play-vue-router/interfaces/PlayRouteEvent.md +119 -0
  147. package/api/@xmachines/play-vue-router/interfaces/RouteMapping.md +15 -0
  148. package/api/@xmachines/play-vue-router/interfaces/RouterBridge.md +104 -0
  149. package/api/@xmachines/play-vue-router/type-aliases/RoutableActor.md +9 -0
  150. package/api/@xmachines/play-vue-router/variables/PlayRouterProvider.md +67 -0
  151. package/api/@xmachines/play-vue-router-demo/README.md +133 -0
  152. package/api/@xmachines/play-xstate/README.md +512 -0
  153. package/api/@xmachines/play-xstate/classes/PlayerActor.md +527 -0
  154. package/api/@xmachines/play-xstate/functions/buildRouteUrl.md +43 -0
  155. package/api/@xmachines/play-xstate/functions/composeGuards.md +79 -0
  156. package/api/@xmachines/play-xstate/functions/composeGuardsOr.md +67 -0
  157. package/api/@xmachines/play-xstate/functions/definePlayer.md +127 -0
  158. package/api/@xmachines/play-xstate/functions/deriveRoute.md +109 -0
  159. package/api/@xmachines/play-xstate/functions/eventMatches.md +40 -0
  160. package/api/@xmachines/play-xstate/functions/formatPlayRouteTransitions.md +54 -0
  161. package/api/@xmachines/play-xstate/functions/hasContext.md +42 -0
  162. package/api/@xmachines/play-xstate/functions/isAbsoluteRoute.md +41 -0
  163. package/api/@xmachines/play-xstate/functions/mergeViewProps.md +26 -0
  164. package/api/@xmachines/play-xstate/functions/negateGuard.md +61 -0
  165. package/api/@xmachines/play-xstate/functions/stateMatches.md +25 -0
  166. package/api/@xmachines/play-xstate/functions/validateComponentBinding.md +39 -0
  167. package/api/@xmachines/play-xstate/functions/validateViewProps.md +80 -0
  168. package/api/@xmachines/play-xstate/interfaces/CatalogEntry.md +16 -0
  169. package/api/@xmachines/play-xstate/interfaces/PlayerConfig.md +24 -0
  170. package/api/@xmachines/play-xstate/interfaces/PlayerOptions.md +26 -0
  171. package/api/@xmachines/play-xstate/interfaces/RouteContext.md +22 -0
  172. package/api/@xmachines/play-xstate/type-aliases/Catalog.md +21 -0
  173. package/api/@xmachines/play-xstate/type-aliases/ComposedGuard.md +14 -0
  174. package/api/@xmachines/play-xstate/type-aliases/Guard.md +34 -0
  175. package/api/@xmachines/play-xstate/type-aliases/GuardArray.md +20 -0
  176. package/api/@xmachines/play-xstate/type-aliases/PlayerFactory.md +29 -0
  177. package/api/@xmachines/play-xstate/type-aliases/RouteMachineConfig.md +45 -0
  178. package/api/@xmachines/play-xstate/type-aliases/RouteStateNode.md +51 -0
  179. package/api/@xmachines/play-xstate/type-aliases/ValidationResult.md +17 -0
  180. package/api/@xmachines/play-xstate/type-aliases/ViewMergeContext.md +35 -0
  181. package/api/@xmachines/shared/README.md +379 -0
  182. package/api/@xmachines/shared/functions/defineXmVitestConfig.md +29 -0
  183. package/api/@xmachines/shared/functions/xmAliases.md +24 -0
  184. package/api/README.md +25 -0
  185. package/api/llms.txt +26 -0
  186. package/examples/README.md +63 -0
  187. package/examples/basic-state-machine.md +70 -0
  188. package/examples/form-validation.md +167 -0
  189. package/examples/multi-router-integration.md +277 -0
  190. package/examples/routing-patterns.md +260 -0
  191. package/examples/traffic-light.md +99 -0
  192. package/guides/README.md +29 -0
  193. package/guides/getting-started.md +223 -0
  194. package/guides/installation.md +323 -0
  195. package/index.d.ts +3 -0
  196. package/index.js +4 -0
  197. package/package.json +54 -0
@@ -0,0 +1,14 @@
1
+ [Documentation](../../../README.md) / [@xmachines/play-react](../README.md) / PlayErrorBoundaryState
2
+
3
+ # Interface: PlayErrorBoundaryState
4
+
5
+ Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:28](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/PlayErrorBoundary.tsx#L28)
6
+
7
+ Internal state shape for PlayErrorBoundary
8
+
9
+ ## Properties
10
+
11
+ | Property | Type | Defined in |
12
+ | ----------------------------------------- | ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
13
+ | <a id="property-error"></a> `error` | `Error` \| `null` | [packages/play-react/src/PlayErrorBoundary.tsx:30](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/PlayErrorBoundary.tsx#L30) |
14
+ | <a id="property-haserror"></a> `hasError` | `boolean` | [packages/play-react/src/PlayErrorBoundary.tsx:29](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/PlayErrorBoundary.tsx#L29) |
@@ -0,0 +1,15 @@
1
+ [Documentation](../../../README.md) / [@xmachines/play-react](../README.md) / PlayRendererProps
2
+
3
+ # Interface: PlayRendererProps
4
+
5
+ Defined in: [packages/play-react/src/types.ts:18](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/types.ts#L18)
6
+
7
+ Props for PlayRenderer component
8
+
9
+ ## Properties
10
+
11
+ | Property | Type | Description | Defined in |
12
+ | --------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
13
+ | <a id="property-actor"></a> `actor` | [`AbstractActor`](../../play-actor/classes/AbstractActor.md)\<`AnyActorLogic`\> & [`Viewable`](../../play-actor/interfaces/Viewable.md) | Actor instance with currentView signal (requires Viewable capability) | [packages/play-react/src/types.ts:20](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/types.ts#L20) |
14
+ | <a id="property-components"></a> `components` | `Record`\<`string`, `React.ElementType`\> | Map of component names to React components | [packages/play-react/src/types.ts:23](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/types.ts#L23) |
15
+ | <a id="property-fallback"></a> `fallback?` | `ReactNode` | Optional component shown when currentView is null | [packages/play-react/src/types.ts:26](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/types.ts#L26) |
@@ -0,0 +1,64 @@
1
+ [Documentation](../../../README.md) / [@xmachines/play-react](../README.md) / PlayRenderer
2
+
3
+ # Variable: PlayRenderer
4
+
5
+ ```ts
6
+ const PlayRenderer: React.FC<PlayRendererProps>;
7
+ ```
8
+
9
+ Defined in: [packages/play-react/src/PlayRenderer.tsx:61](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react/src/PlayRenderer.tsx#L61)
10
+
11
+ Main renderer component that subscribes to actor signals and renders UI
12
+
13
+ Architecture (per RESEARCH.md Pattern 1):
14
+
15
+ - Subscribes to actor.currentView signal via useSignalEffect
16
+ - Dynamically renders catalog components based on view.component string
17
+ - Forwards user events to actor via actor.send()
18
+ - React state only for triggering renders, NOT business logic
19
+
20
+ Invariant: Actor Authority - Actor decides all state transitions via guards.
21
+ Invariant: Passive Infrastructure - Component observes signals and sends events.
22
+ Invariant: Signal-Only Reactivity - Business logic state lives in actor signals.
23
+
24
+ ## Example
25
+
26
+ ```typescript
27
+ import { PlayRenderer } from "@xmachines/play-react";
28
+ import { definePlayer } from "@xmachines/play-xstate";
29
+
30
+ const actor = definePlayer({ machine, catalog })();
31
+ actor.start();
32
+
33
+ const components = {
34
+ Dashboard: ({ userId, send }) => <div>User: {userId}</div>,
35
+ LoginForm: ({ error, send }) => <form onSubmit={(e) => {
36
+ e.preventDefault();
37
+ send({ type: "intent", name: "login.submit", payload: {...} });
38
+ }}>...</form>
39
+ };
40
+
41
+ <PlayRenderer actor={actor} components={components} />
42
+ ```
43
+
44
+ ## Param
45
+
46
+ Component props
47
+
48
+ ## Returns
49
+
50
+ React element rendering current view from actor
51
+
52
+ ## Remarks
53
+
54
+ **Component lookup:** Dynamically looks up component from `components` map
55
+ using `view.component` string from actor.currentView signal.
56
+
57
+ **Event forwarding:** Injects `send` function as prop to components. Components
58
+ call `send(event)` to forward intents to actor. Actor guards decide validity.
59
+
60
+ **Error handling:** If component not found in catalog, logs error and shows
61
+ fallback. This indicates missing component registration, not runtime error.
62
+
63
+ **CRITICAL:** Never call actor.send() during render - only in event handlers.
64
+ Calling send during render causes infinite render loops.
@@ -0,0 +1,198 @@
1
+ [Documentation](../../README.md) / @xmachines/play-react-router
2
+
3
+ # @xmachines/play-react-router
4
+
5
+ **React Router v7 adapter for XMachines Play using RouterBridgeBase.**
6
+
7
+ ## Overview
8
+
9
+ `@xmachines/play-react-router` connects `react-router` v7 data routers to Play actors.
10
+
11
+ The package provides:
12
+
13
+ - `ReactRouterBridge` for direct adapter control
14
+ - `PlayRouterProvider` for React lifecycle wiring
15
+ - `RouteMap` utilities for state ID <-> URL path resolution
16
+
17
+ Internally, `ReactRouterBridge` extends `RouterBridgeBase` from `@xmachines/play-router`, so behavior matches other bridge adapters in the monorepo.
18
+
19
+ ## Installation
20
+
21
+ ```bash
22
+ npm install react react-router
23
+ npm install @xmachines/play-react-router @xmachines/play-router @xmachines/play-react
24
+ ```
25
+
26
+ ## Current Exports
27
+
28
+ - `ReactRouterBridge`
29
+ - `PlayRouterProvider` + `PlayRouterProviderProps`
30
+ - `RouteMap`
31
+ - `createRouteMapFromTree`
32
+ - type re-exports: `RouterBridge`, `PlayRouteEvent`
33
+
34
+ Peer dependencies:
35
+
36
+ - `react` `^18 || ^19`
37
+ - `react-router` `^7.0.0`
38
+
39
+ Use `@xmachines/play-react` for framework-native rendering (`PlayRenderer`).
40
+
41
+ ## Quick Start
42
+
43
+ ```tsx
44
+ import { createBrowserRouter } from "react-router";
45
+ import { definePlayer } from "@xmachines/play-xstate";
46
+ import { extractMachineRoutes } from "@xmachines/play-router";
47
+ import { ReactRouterBridge, createRouteMapFromTree } from "@xmachines/play-react-router";
48
+
49
+ const router = createBrowserRouter(routes);
50
+ const actor = definePlayer({ machine, catalog })();
51
+ actor.start();
52
+
53
+ const routeTree = extractMachineRoutes(machine);
54
+ const routeMap = createRouteMapFromTree(routeTree);
55
+
56
+ const bridge = new ReactRouterBridge(router, actor, routeMap);
57
+ bridge.connect();
58
+
59
+ // later
60
+ bridge.disconnect();
61
+ ```
62
+
63
+ `ReactRouterBridge` requires the data-router API (`createBrowserRouter`).
64
+ `BrowserRouter` is not supported because it does not expose subscribe/navigate APIs needed by the bridge.
65
+
66
+ ## API
67
+
68
+ ### `ReactRouterBridge`
69
+
70
+ ```ts
71
+ class ReactRouterBridge extends RouterBridgeBase {
72
+ constructor(
73
+ router: ReturnType<typeof createBrowserRouter>,
74
+ actor: AbstractActor<AnyActorLogic> & Routable,
75
+ routeMap: RouteMap,
76
+ );
77
+ connect(): void;
78
+ disconnect(): void;
79
+ }
80
+ ```
81
+
82
+ Responsibilities:
83
+
84
+ - Watch React Router location updates and sync actor via `play.route`
85
+ - Observe actor route changes and navigate router when state changes
86
+ - Handle initial URL sync on cold load/deep links
87
+
88
+ ### `PlayRouterProvider`
89
+
90
+ React wrapper that creates/connects/disconnects `ReactRouterBridge` in `useEffect`:
91
+
92
+ ```ts
93
+ interface PlayRouterProviderProps {
94
+ actor: AbstractActor<AnyActorLogic> & Routable & Viewable;
95
+ router: ReturnType<typeof createBrowserRouter>;
96
+ routeMap: RouteMap;
97
+ renderer: (
98
+ actor: AbstractActor<AnyActorLogic> & Routable & Viewable,
99
+ router: ReturnType<typeof createBrowserRouter>,
100
+ ) => ReactNode;
101
+ }
102
+ ```
103
+
104
+ ### `RouteMap` and `createRouteMapFromTree`
105
+
106
+ `RouteMap` extends `BaseRouteMap` from `@xmachines/play-router`, inheriting bucket-indexed
107
+ bidirectional route matching. No routing logic lives in the adapter itself.
108
+
109
+ ```ts
110
+ // RouteMap is a thin subclass of BaseRouteMap — no extra methods
111
+ class RouteMap extends BaseRouteMap {}
112
+
113
+ // Inherited API:
114
+ routeMap.getStateIdByPath(path: string): string | null
115
+ routeMap.getPathByStateId(stateId: string): string | null
116
+
117
+ // Factory from a machine route tree:
118
+ function createRouteMapFromTree(routeTree: RouteTree): RouteMap
119
+ ```
120
+
121
+ `getStateIdByPath` returns `null` (not `undefined`) for unmatched paths.
122
+
123
+ Construct directly when you have static mappings:
124
+
125
+ ```ts
126
+ import { RouteMap } from "@xmachines/play-react-router";
127
+
128
+ const routeMap = new RouteMap([
129
+ { stateId: "home", path: "/" },
130
+ { stateId: "profile", path: "/profile/:userId" },
131
+ { stateId: "settings", path: "/settings/:section?" },
132
+ ]);
133
+
134
+ routeMap.getStateIdByPath("/profile/123"); // "profile"
135
+ routeMap.getPathByStateId("home"); // "/"
136
+ routeMap.getStateIdByPath("/unknown"); // null
137
+ ```
138
+
139
+ Or build from a machine's route tree:
140
+
141
+ ```ts
142
+ import { extractMachineRoutes } from "@xmachines/play-router";
143
+ import { createRouteMapFromTree } from "@xmachines/play-react-router";
144
+
145
+ const routeMap = createRouteMapFromTree(extractMachineRoutes(machine));
146
+ ```
147
+
148
+ ## Examples
149
+
150
+ - Routing patterns guide: `docs/examples/routing-patterns.md`
151
+ - Multi-router integration guide: `docs/examples/multi-router-integration.md`
152
+
153
+ ## Architecture
154
+
155
+ Bridge-first adapter flow:
156
+
157
+ 1. Build route map from `extractMachineRoutes(machine)`.
158
+ 2. Connect `ReactRouterBridge` (or `PlayRouterProvider`).
159
+ 3. Router navigation emits path updates to actor via `play.route` events.
160
+ 4. Actor transitions (and guards) determine valid state.
161
+ 5. Actor route signal updates router URL when accepted.
162
+
163
+ This keeps infrastructure passive and preserves Actor Authority.
164
+
165
+ ## Related Packages
166
+
167
+ - [@xmachines/play-router](../play-router/README.md)
168
+ - [@xmachines/play-xstate](../play-xstate/README.md)
169
+ - [@xmachines/play-react](../play-react/README.md)
170
+
171
+ ## License
172
+
173
+ Copyright (c) 2016 [Mikael Karon](mailto:mikael@karon.se). All rights reserved.
174
+
175
+ This work is licensed under the terms of the MIT license.
176
+ For a copy, see <https://opensource.org/licenses/MIT>.
177
+
178
+ @xmachines/play-react-router
179
+
180
+ React Router v7 adapter for XMachines Play architecture.
181
+ Synchronizes browser URL with actor state using createBrowserRouter data API.
182
+
183
+ ## Classes
184
+
185
+ - [ReactRouterBridge](classes/ReactRouterBridge.md)
186
+ - [RouteMap](classes/RouteMap.md)
187
+
188
+ ## Interfaces
189
+
190
+ - [PlayRouteEvent](interfaces/PlayRouteEvent.md)
191
+ - [PlayRouterProviderProps](interfaces/PlayRouterProviderProps.md)
192
+ - [RouteMapping](interfaces/RouteMapping.md)
193
+ - [RouterBridge](interfaces/RouterBridge.md)
194
+
195
+ ## Functions
196
+
197
+ - [createRouteMapFromTree](functions/createRouteMapFromTree.md)
198
+ - [PlayRouterProvider](functions/PlayRouterProvider.md)
@@ -0,0 +1,321 @@
1
+ [Documentation](../../../README.md) / [@xmachines/play-react-router](../README.md) / ReactRouterBridge
2
+
3
+ # Class: ReactRouterBridge
4
+
5
+ Defined in: [play-react-router/src/react-router-bridge.ts:28](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react-router/src/react-router-bridge.ts#L28)
6
+
7
+ Abstract base class for all `@xmachines` router adapter bridges.
8
+
9
+ Implements RouterBridge protocol and contains all common bridge logic.
10
+ Subclasses only need to implement the 3 abstract methods that differ
11
+ between frameworks.
12
+
13
+ ## Extends
14
+
15
+ - [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md)
16
+
17
+ ## Constructors
18
+
19
+ ### Constructor
20
+
21
+ ```ts
22
+ new ReactRouterBridge(
23
+ router,
24
+ actor,
25
+ routeMap): ReactRouterBridge;
26
+ ```
27
+
28
+ Defined in: [play-react-router/src/react-router-bridge.ts:31](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react-router/src/react-router-bridge.ts#L31)
29
+
30
+ #### Parameters
31
+
32
+ | Parameter | Type |
33
+ | ---------- | --------------------------------------------------------------------------------------------------------------------------------------- |
34
+ | `router` | `Router$1` |
35
+ | `actor` | [`AbstractActor`](../../play-actor/classes/AbstractActor.md)\<`AnyActorLogic`\> & [`Routable`](../../play-actor/interfaces/Routable.md) |
36
+ | `routeMap` | [`RouteMap`](RouteMap.md) |
37
+
38
+ #### Returns
39
+
40
+ `ReactRouterBridge`
41
+
42
+ #### Overrides
43
+
44
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`constructor`](../../play-router/classes/RouterBridgeBase.md#constructor)
45
+
46
+ ## Properties
47
+
48
+ | Property | Modifier | Type | Description | Inherited from | Defined in |
49
+ | --------------------------------------------------------------------- | ----------- | --------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------- |
50
+ | <a id="property-actor"></a> `actor` | `readonly` | [`AbstractActor`](../../play-actor/classes/AbstractActor.md)\<`AnyActorLogic`\> & [`Routable`](../../play-actor/interfaces/Routable.md) | Actor with currentRoute signal and send method | [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`actor`](../../play-router/classes/RouterBridgeBase.md#property-actor) | play-router/dist/router-bridge-base.d.ts:55 |
51
+ | <a id="property-hasconnectedonce"></a> `hasConnectedOnce` | `protected` | `boolean` | - | [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`hasConnectedOnce`](../../play-router/classes/RouterBridgeBase.md#property-hasconnectedonce) | play-router/dist/router-bridge-base.d.ts:61 |
52
+ | <a id="property-isconnected"></a> `isConnected` | `protected` | `boolean` | - | [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`isConnected`](../../play-router/classes/RouterBridgeBase.md#property-isconnected) | play-router/dist/router-bridge-base.d.ts:60 |
53
+ | <a id="property-isprocessingnavigation"></a> `isProcessingNavigation` | `protected` | `boolean` | - | [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`isProcessingNavigation`](../../play-router/classes/RouterBridgeBase.md#property-isprocessingnavigation) | play-router/dist/router-bridge-base.d.ts:63 |
54
+ | <a id="property-lastsyncedpath"></a> `lastSyncedPath` | `protected` | `string` | - | [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`lastSyncedPath`](../../play-router/classes/RouterBridgeBase.md#property-lastsyncedpath) | play-router/dist/router-bridge-base.d.ts:62 |
55
+ | <a id="property-routemap"></a> `routeMap` | `readonly` | `object` | Bidirectional route map for stateId ↔ path resolution | [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`routeMap`](../../play-router/classes/RouterBridgeBase.md#property-routemap) | play-router/dist/router-bridge-base.d.ts:56 |
56
+ | `routeMap.getPathByStateId` | `public` | `string` \| `null` \| `undefined` | - | - | play-router/dist/router-bridge-base.d.ts:58 |
57
+ | `routeMap.getStateIdByPath` | `public` | `string` \| `null` \| `undefined` | - | - | play-router/dist/router-bridge-base.d.ts:57 |
58
+ | <a id="property-routewatcher"></a> `routeWatcher` | `protected` | \| [`Watcher`](../../play-signals/namespaces/Signal/namespaces/subtle/classes/Watcher.md) \| `null` | - | [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`routeWatcher`](../../play-router/classes/RouterBridgeBase.md#property-routewatcher) | play-router/dist/router-bridge-base.d.ts:64 |
59
+
60
+ ## Methods
61
+
62
+ ### connect()
63
+
64
+ ```ts
65
+ connect(): void;
66
+ ```
67
+
68
+ Defined in: play-router/dist/router-bridge-base.d.ts:81
69
+
70
+ Connect the router bridge to the Actor.
71
+
72
+ Sets up the TC39 Signal watcher for actor → router direction and
73
+ starts watching router changes (framework-specific).
74
+
75
+ #### Returns
76
+
77
+ `void`
78
+
79
+ #### Inherited from
80
+
81
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`connect`](../../play-router/classes/RouterBridgeBase.md#connect)
82
+
83
+ ---
84
+
85
+ ### disconnect()
86
+
87
+ ```ts
88
+ disconnect(): void;
89
+ ```
90
+
91
+ Defined in: play-router/dist/router-bridge-base.d.ts:87
92
+
93
+ Disconnect the router bridge from the Actor.
94
+
95
+ Stops signal watching and unregisters framework-specific router listener.
96
+
97
+ #### Returns
98
+
99
+ `void`
100
+
101
+ #### Inherited from
102
+
103
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`disconnect`](../../play-router/classes/RouterBridgeBase.md#disconnect)
104
+
105
+ ---
106
+
107
+ ### extractParams()
108
+
109
+ ```ts
110
+ protected extractParams(pathname, stateId): Record<string, string>;
111
+ ```
112
+
113
+ Defined in: play-router/dist/router-bridge-base.d.ts:134
114
+
115
+ Extract path parameters from URL using the URLPattern API.
116
+
117
+ Accesses `globalThis.URLPattern` at runtime — no polyfill is imported by this
118
+ library. If `URLPattern` is unavailable (Node.js < 24, older browsers without a
119
+ polyfill), this method returns `{}` silently (graceful degradation — routing still
120
+ works, params will be empty).
121
+
122
+ #### Parameters
123
+
124
+ | Parameter | Type | Description |
125
+ | ---------- | -------- | ------------------------------------------------- |
126
+ | `pathname` | `string` | The actual URL path (e.g., '/profile/john') |
127
+ | `stateId` | `string` | The matched state ID for looking up route pattern |
128
+
129
+ #### Returns
130
+
131
+ `Record`\<`string`, `string`\>
132
+
133
+ Extracted path parameters, or empty object if URLPattern is unavailable or no match
134
+
135
+ #### Inherited from
136
+
137
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`extractParams`](../../play-router/classes/RouterBridgeBase.md#extractparams)
138
+
139
+ ---
140
+
141
+ ### extractQuery()
142
+
143
+ ```ts
144
+ protected extractQuery(search): Record<string, string>;
145
+ ```
146
+
147
+ Defined in: play-router/dist/router-bridge-base.d.ts:141
148
+
149
+ Extract query parameters from URL search string.
150
+
151
+ #### Parameters
152
+
153
+ | Parameter | Type | Description |
154
+ | --------- | -------- | ------------------------------------------------ |
155
+ | `search` | `string` | URL search string (e.g., '?tab=security&page=1') |
156
+
157
+ #### Returns
158
+
159
+ `Record`\<`string`, `string`\>
160
+
161
+ Extracted query parameters or empty object
162
+
163
+ #### Inherited from
164
+
165
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`extractQuery`](../../play-router/classes/RouterBridgeBase.md#extractquery)
166
+
167
+ ---
168
+
169
+ ### getInitialRouterPath()
170
+
171
+ ```ts
172
+ protected getInitialRouterPath(): string | null;
173
+ ```
174
+
175
+ Defined in: [play-react-router/src/react-router-bridge.ts:49](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react-router/src/react-router-bridge.ts#L49)
176
+
177
+ Return the router's current pathname so connect() can sync the actor to
178
+ the URL on initial load. router.subscribe() only fires on future navigations
179
+ — it does not replay the already-loaded location — so without this, loading
180
+ the page on /about would leave the actor in its default "home" state.
181
+
182
+ #### Returns
183
+
184
+ `string` \| `null`
185
+
186
+ #### Overrides
187
+
188
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`getInitialRouterPath`](../../play-router/classes/RouterBridgeBase.md#getinitialrouterpath)
189
+
190
+ ---
191
+
192
+ ### navigateRouter()
193
+
194
+ ```ts
195
+ protected navigateRouter(path): void;
196
+ ```
197
+
198
+ Defined in: [play-react-router/src/react-router-bridge.ts:39](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react-router/src/react-router-bridge.ts#L39)
199
+
200
+ Navigate the framework router to the given path.
201
+
202
+ Called when actor's currentRoute signal changes to a new path.
203
+ Must trigger the framework router's navigation (e.g., router.navigate(path)).
204
+
205
+ #### Parameters
206
+
207
+ | Parameter | Type |
208
+ | --------- | -------- |
209
+ | `path` | `string` |
210
+
211
+ #### Returns
212
+
213
+ `void`
214
+
215
+ #### Overrides
216
+
217
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`navigateRouter`](../../play-router/classes/RouterBridgeBase.md#navigaterouter)
218
+
219
+ ---
220
+
221
+ ### syncActorFromRouter()
222
+
223
+ ```ts
224
+ protected syncActorFromRouter(pathname, search?): void;
225
+ ```
226
+
227
+ Defined in: play-router/dist/router-bridge-base.d.ts:101
228
+
229
+ Sync actor state when router location changes.
230
+
231
+ Sends play.route event to actor with resolved stateId, params, and query.
232
+ Prevents circular updates via isProcessingNavigation flag.
233
+
234
+ #### Parameters
235
+
236
+ | Parameter | Type |
237
+ | ---------- | -------- |
238
+ | `pathname` | `string` |
239
+ | `search?` | `string` |
240
+
241
+ #### Returns
242
+
243
+ `void`
244
+
245
+ #### Inherited from
246
+
247
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`syncActorFromRouter`](../../play-router/classes/RouterBridgeBase.md#syncactorfromrouter)
248
+
249
+ ---
250
+
251
+ ### syncRouterFromActor()
252
+
253
+ ```ts
254
+ protected syncRouterFromActor(route): void;
255
+ ```
256
+
257
+ Defined in: play-router/dist/router-bridge-base.d.ts:94
258
+
259
+ Sync router location when actor route signal changes.
260
+
261
+ Calls navigateRouter() for framework-specific navigation.
262
+ Prevents circular updates via isProcessingNavigation flag.
263
+
264
+ #### Parameters
265
+
266
+ | Parameter | Type |
267
+ | --------- | --------- |
268
+ | `route` | `unknown` |
269
+
270
+ #### Returns
271
+
272
+ `void`
273
+
274
+ #### Inherited from
275
+
276
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`syncRouterFromActor`](../../play-router/classes/RouterBridgeBase.md#syncrouterfromactor)
277
+
278
+ ---
279
+
280
+ ### unwatchRouterChanges()
281
+
282
+ ```ts
283
+ protected unwatchRouterChanges(): void;
284
+ ```
285
+
286
+ Defined in: [play-react-router/src/react-router-bridge.ts:59](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react-router/src/react-router-bridge.ts#L59)
287
+
288
+ Stop watching for router location changes.
289
+
290
+ Called by disconnect(). Should clean up the framework-specific subscription.
291
+
292
+ #### Returns
293
+
294
+ `void`
295
+
296
+ #### Overrides
297
+
298
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`unwatchRouterChanges`](../../play-router/classes/RouterBridgeBase.md#unwatchrouterchanges)
299
+
300
+ ---
301
+
302
+ ### watchRouterChanges()
303
+
304
+ ```ts
305
+ protected watchRouterChanges(): void;
306
+ ```
307
+
308
+ Defined in: [play-react-router/src/react-router-bridge.ts:53](https://gitlab.com/xmachin-es/xmachines-js/-/blob/00a28432ed57807112288436d1ae4387d9f06919/packages/play-react-router/src/react-router-bridge.ts#L53)
309
+
310
+ Start watching for router location changes.
311
+
312
+ Called by connect(). Should set up the framework-specific subscription
313
+ for location changes and call syncActorFromRouter() on each change.
314
+
315
+ #### Returns
316
+
317
+ `void`
318
+
319
+ #### Overrides
320
+
321
+ [`RouterBridgeBase`](../../play-router/classes/RouterBridgeBase.md).[`watchRouterChanges`](../../play-router/classes/RouterBridgeBase.md#watchrouterchanges)