@xmachines/docs 3.0.0 → 5.0.0

package/api/@xmachines/play-pattern/interfaces/PatternCache.md

@@ -0,0 +1,65 @@
+[API](../../../README.md) / [@xmachines/play-pattern](../README.md) / PatternCache
+
+# Interface: PatternCache\<V\>
+
+Defined in: [cache.ts:53](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/cache.ts#L53)
+
+What this package needs from a cache: a read and a write, both by a string key.
+
+The contract is this small on purpose. A `Map` satisfies it, and so does an LRU of any
+library — a caller that wants a time to live or an eviction callback brings the module
+that has one, and this package needs to know nothing about it.
+
+A cache may forget an entry at any time, and it may forget none. Both are correct: the
+parser runs again for an entry that is absent.
+
+## Type Parameters
+
+| Type Parameter |
+| -------------- |
+| `V`            |
+
+## Methods
+
+### get()
+
+```ts
+get(key): V | undefined;
+```
+
+Defined in: [cache.ts:55](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/cache.ts#L55)
+
+Reads one entry, or `undefined` when the cache holds none for the key.
+
+#### Parameters
+
+| Parameter | Type     |
+| --------- | -------- |
+| `key`     | `string` |
+
+#### Returns
+
+`V` \| `undefined`
+
+---
+
+### set()
+
+```ts
+set(key, value): void;
+```
+
+Defined in: [cache.ts:57](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/cache.ts#L57)
+
+Writes one entry.
+
+#### Parameters
+
+| Parameter | Type     |
+| --------- | -------- |
+| `key`     | `string` |
+| `value`   | `V`      |
+
+#### Returns
+
+`void`

package/api/@xmachines/play-pattern/interfaces/PatternParam.md

@@ -0,0 +1,15 @@
+[API](../../../README.md) / [@xmachines/play-pattern](../README.md) / PatternParam
+
+# Interface: PatternParam
+
+Defined in: [pattern-grammar.ts:101](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L101)
+
+One named param of a pattern, with the question that every caller asks about it.
+
+## Properties
+
+| Property                                    | Modifier   | Type      | Description                                                                                                                                                                                                                                                           | Defined in                                                                                                                           |
+| ------------------------------------------- | ---------- | --------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ |
+| <a id="property-groupname"></a> `groupName` | `readonly` | `string`  | The name that URLPattern compiles, for example `cat_id`.                                                                                                                                                                                                              | [pattern-grammar.ts:105](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L105) |
+| <a id="property-name"></a> `name`           | `readonly` | `string`  | The name as the pattern declares it, for example `cat-id`.                                                                                                                                                                                                            | [pattern-grammar.ts:103](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L103) |
+| <a id="property-optional"></a> `optional`   | `readonly` | `boolean` | True when a matching path can carry no value for this param. The modifier `?` and the modifier `*` make a param optional, and so does EVERY group above it that carries one of the two. The modifier `+` does not: it repeats a param that one value must still fill. | [pattern-grammar.ts:113](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L113) |

package/api/@xmachines/play-pattern/type-aliases/PathBuildResult.md

@@ -0,0 +1,74 @@
+[API](../../../README.md) / [@xmachines/play-pattern](../README.md) / PathBuildResult
+
+# Type Alias: PathBuildResult
+
+```ts
+type PathBuildResult =
+	| {
+			ok: true;
+			path: string;
+	  }
+	| {
+			missing: string;
+			ok: false;
+			reason: "missing";
+	  }
+	| {
+			ok: false;
+			param: string;
+			reason: "unresolvable";
+			value: string;
+	  };
+```
+
+Defined in: [pattern-grammar.ts:651](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L651)
+
+The answer of [buildPath](../functions/buildPath.md).
+
+## Union Members
+
+### Type Literal
+
+```ts
+{
+	ok: true;
+	path: string;
+}
+```
+
+The pattern built a path, and every part that needs a value has one.
+
+---
+
+### Type Literal
+
+```ts
+{
+	missing: string;
+	ok: false;
+	reason: "missing";
+}
+```
+
+A part needs a value that the caller did not give.
+
+`missing` names the param as the PATTERN declares it, with each hyphen kept, so a
+caller reports the name that its author wrote.
+
+---
+
+### Type Literal
+
+```ts
+{
+	ok: false;
+	param: string;
+	reason: "unresolvable";
+	value: string;
+}
+```
+
+A param carries a value that no path can hold, so the pattern matches the result
+back never. `param` names the param, and `value` holds what the caller gave.
+
+A dot segment is the one such value today: see [isDotSegment](../functions/isDotSegment.md).

package/api/@xmachines/play-pattern/type-aliases/PathParams.md

@@ -0,0 +1,15 @@
+[API](../../../README.md) / [@xmachines/play-pattern](../README.md) / PathParams
+
+# Type Alias: PathParams
+
+```ts
+type PathParams = Readonly<Record<string, unknown>>;
+```
+
+Defined in: [pattern-grammar.ts:681](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L681)
+
+The values that a caller gives, keyed by the declared name of the param.
+
+The value is `unknown`, because a caller reads it from the context of an actor and that
+context carries whatever the machine put there. [buildPath](../functions/buildPath.md) calls `String` on a
+value that is neither `undefined` nor `null`.

package/api/@xmachines/play-pattern/type-aliases/PatternModifier.md

@@ -0,0 +1,11 @@
+[API](../../../README.md) / [@xmachines/play-pattern](../README.md) / PatternModifier
+
+# Type Alias: PatternModifier
+
+```ts
+type PatternModifier = "" | "?" | "+" | "*";
+```
+
+Defined in: [pattern-grammar.ts:56](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L56)
+
+The modifier of a part. `""` means that the part carries none.

package/api/@xmachines/play-pattern/type-aliases/PatternPart.md

@@ -0,0 +1,9 @@
+[API](../../../README.md) / [@xmachines/play-pattern](../README.md) / PatternPart
+
+# Type Alias: PatternPart
+
+```ts
+type PatternPart = LiteralPart | ParamPart | GroupPart;
+```
+
+Defined in: [pattern-grammar.ts:98](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-pattern/src/pattern-grammar.ts#L98)

package/api/@xmachines/play-react/README.md

@@ -2,9 +2,9 @@
 
 # @xmachines/play-react
 
-React renderer for XMachines Play architecture with signal-driven rendering.
+React renderer for XMachines Play architecture with atom-driven rendering.
 
-[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![Version](https://img.shields.io/badge/version-3.0.0-blue)](https://www.npmjs.com/package/@xmachines/play-react)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![Version](https://img.shields.io/badge/version-5.0.0-blue)](https://www.npmjs.com/package/@xmachines/play-react)
 
 ## Installation
 
@@ -15,16 +15,20 @@ pnpm add @xmachines/play-react
 **Peer dependencies.** Install them separately:
 
 ```bash
-pnpm add react react-dom xstate @xstate/store @xmachines/json-render-react @xmachines/json-render-core @xmachines/json-render-xstate
+pnpm add react react-dom @xmachines/play @xmachines/play-atom @xstate/store @xmachines/json-render-react @xmachines/json-render-core @xmachines/json-render-xstate
 ```
 
 Supported versions:
 
 - `react` / `react-dom`: `^18.0.0 || ^19.0.0`
-- `xstate`: `^5.31.0`
-- `@xstate/store`: `^3.17.0`
+- [`@xmachines/play`](../play/README.md) and [`@xmachines/play-atom`](../play-atom/README.md): the version of this release
+- `@xstate/store`: `^4.2.3`
 - `@xmachines/json-render-*`: `^0.20.0-xm.4`
 
+`@xstate/store` is the peer of [`@xmachines/play-atom`](../play-atom/README.md), and not of this
+package: this package reads the atom through [`@xmachines/play-atom`](../play-atom/README.md) and
+imports the engine in no source file. Install ONE copy of it.
+
 ## Usage
 
 ### Standard usage — `PlayUIProvider` + `PlayRenderer`
@@ -33,13 +37,14 @@ The recommended pattern for actor-driven React rendering:
 
 ```tsx
 import { PlayUIProvider, PlayRenderer, defineRegistry } from "@xmachines/play-react";
-import { definePlayer } from "@xmachines/play-xstate";
+import { definePlayer, compose, PlayerActor } from "@xmachines/play-xstate";
+import { withView } from "@xmachines/play-xstate/view";
 import { myMachine } from "./machine.js"; // your xstate machine (states carry meta.view specs)
-import { myCatalog } from "./catalog.js"; // defineCatalog(schema, ...) result, using the schema from "@xmachines/json-render-react/schema"
+import { myCatalog } from "./catalog.js"; // the result of defineCatalog(schema, ...), with `schema` from "@xmachines/play-react"
 import { Login, Dashboard } from "./components.js"; // your React components
 
-// 1. Create and start the actor
-const actor = definePlayer({ machine: myMachine })();
+// 1. Create and start the actor — a renderer needs the view capability
+const actor = definePlayer({ machine: myMachine, actor: compose(PlayerActor, withView) })();
 actor.start();
 
 // 2. Define the component registry with action handlers
@@ -51,7 +56,7 @@ const registryResult = defineRegistry(myCatalog, {
 	},
 });
 
-// 3. Render — signals drive view transitions automatically
+// 3. Render — atoms drive view transitions automatically
 function App() {
 	return (
 		<PlayUIProvider actor={actor} registryResult={registryResult}>
@@ -116,18 +121,23 @@ function SubmitButton() {
 }
 ```
 
-### Subscribing to signals directly
+### Subscribing to atoms directly
 
 ```tsx
 import { useState } from "react";
-import { useSignalEffect } from "@xmachines/play-react";
+import { useAtomEffect } from "@xmachines/play-react";
 
 function MyComponent({ actor }) {
 	const [view, setView] = useState(null);
 
-	useSignalEffect(() => {
-		setView(actor.currentView.get());
-	}, [actor]); // deps: re-subscribe when the actor prop swaps
+	// The first argument names every atom that runs the effect.
+	useAtomEffect(
+		[actor.currentView],
+		() => {
+			setView(actor.currentView.get());
+		},
+		[actor], // deps: re-subscribe when the actor prop swaps
+	);
 
 	return <div>{view?.root}</div>;
 }
@@ -141,28 +151,28 @@ function MyComponent({ actor }) {
 | --------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
 | `<PlayUIProvider>`    | Composite provider. It wraps `ActorProvider` and `JSONUIProvider`. Use it as the standard entry point.                                  |
 | `<PlayRenderer>`      | Zero-prop leaf component. Reads the current actor view from context and renders it. Must be inside `PlayUIProvider` or `ActorProvider`. |
-| `<ActorProvider>`     | The low-level provider. It owns the actor bridge, the signal subscription, and the `StateStore` lifecycle of each view.                 |
+| `<ActorProvider>`     | The low-level provider. It owns the actor bridge, the atom subscription, and the `StateStore` lifecycle of each view.                   |
 | `<PlayErrorBoundary>` | The React class error boundary that catches a render error of a catalog component.                                                      |
 
 ### Hooks
 
-| Export                             | Description                                                                                                                                                                                                                                                                                               |
-| ---------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `useSignalEffect(callback, deps?)` | Subscribes to the TC39 signal changes. It runs the callback again when a signal that the callback reads changes, and the callback triggers the re-render with its own setState. The optional `deps` array creates the subscription again, like `useEffect`. The hook removes the subscription on unmount. |
-| `useActor()`                       | Returns the raw actor instance. Must be called inside an `ActorProvider`/`PlayUIProvider` tree.                                                                                                                                                                                                           |
-| `usePlayView()`                    | Returns `{ spec, handlers, registry, store }` for the current view. Must be called inside an `ActorProvider`/`PlayUIProvider` tree.                                                                                                                                                                       |
+| Export                                    | Description                                                                                                                                                                                                                                                                                                                                                           |
+| ----------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `useAtomEffect(sources, callback, deps?)` | Subscribes to the atoms of `sources`. It runs the callback again when one of them changes, and the callback triggers the re-render with its own setState. A read inside the callback tracks nothing, so name every dependency in `sources`. The optional `deps` array creates the subscription again, like `useEffect`. The hook removes the subscription on unmount. |
+| `useActor()`                              | Returns the raw actor instance. Must be called inside an `ActorProvider`/`PlayUIProvider` tree.                                                                                                                                                                                                                                                                       |
+| `usePlayView()`                           | Returns `{ spec, handlers, registry, store }` for the current view. Must be called inside an `ActorProvider`/`PlayUIProvider` tree.                                                                                                                                                                                                                                   |
 
 ### Types
 
-| Export                   | Description                                                                                        |
-| ------------------------ | -------------------------------------------------------------------------------------------------- |
-| `PlayUIProviderProps`    | Props for `<PlayUIProvider>`                                                                       |
-| `ActorProviderProps`     | Props for `<ActorProvider>` (also exported as `PlayRendererProps` for migration compatibility)     |
-| `PlayErrorBoundaryProps` | Props for `<PlayErrorBoundary>`                                                                    |
-| `PlayErrorBoundaryState` | State shape for `<PlayErrorBoundary>`                                                              |
-| `AnyPlayActor`           | Type alias for `AbstractActor<AnyActorLogic>` — the bare actor type that the context providers use |
-| `ViewContextValue`       | The value shape that `usePlayView()` returns                                                       |
-| `RenderErrorHandler`     | Error handler callback type for render errors                                                      |
+| Export                   | Description                                                                     |
+| ------------------------ | ------------------------------------------------------------------------------- |
+| `PlayUIProviderProps`    | Props for `<PlayUIProvider>`                                                    |
+| `ActorProviderProps`     | Props for `<ActorProvider>`                                                     |
+| `PlayErrorBoundaryProps` | Props for `<PlayErrorBoundary>`                                                 |
+| `PlayErrorBoundaryState` | State shape for `<PlayErrorBoundary>`                                           |
+| `AnyPlayActor`           | Type alias for `PlayActor` — the bare actor type that the context providers use |
+| `ViewContextValue`       | The value shape that `usePlayView()` returns                                    |
+| `RenderErrorHandler`     | Error handler callback type for render errors                                   |
 
 ### Re-exports from `@xmachines/json-render-react`
 
@@ -183,29 +193,7 @@ import {
 
 ## Key Principle
 
-React state is **never** the place for the business logic. It only triggers the render cycle of React. The signals (`@xmachines/play-signals`) are the source of truth. `PlayUIProvider` observes the actor signals with `useSignalEffect`, and it renders again when the current view changes. It groups rapid signal updates into microtasks, so React does not render more often than necessary.
-
-## Testing
-
-Run unit tests (jsdom environment):
-
-```bash
-pnpm --filter @xmachines/play-react test
-```
-
-Run tests with coverage:
-
-```bash
-pnpm --filter @xmachines/play-react run test:coverage
-```
-
-Run the browser integration tests. They require Chromium:
-
-```bash
-pnpm --filter @xmachines/play-react run test:browser
-```
-
-Coverage thresholds: 80% lines, functions, branches, and statements.
+React state is **never** the place for the business logic. It only triggers the render cycle of React. The atoms ([`@xmachines/play-atom`](../play-atom/README.md)) are the source of truth. `PlayUIProvider` observes the actor atoms with `useAtomEffect`, and it renders again when the current view changes. It groups rapid atom updates into microtasks, so React does not render more often than necessary.
 
 ## License
 
@@ -214,13 +202,13 @@ MIT — see [LICENSE](./LICENSE).
 @xmachines/play-react - React renderer for the XMachines Play architecture
 
 This package is the React rendering layer, and it works through providers. It
-observes the actor signals and renders the UI components with
+observes the actor atoms and renders the UI components with
 @xmachines/json-render-react. The architecture can therefore change the
-framework, because React is only a render target that subscribes to the signal
+framework, because React is only a render target that subscribes to the atom
 changes.
 
 **Key principle:** React state is NEVER the place for the business logic. It only
-triggers the render cycle of React. The signals are the source of truth.
+triggers the render cycle of React. The atoms are the source of truth.
 
 **Standard use:**
 
@@ -259,7 +247,6 @@ composition. Read its source for the reference bridge.
 
 - [AnyPlayActor](type-aliases/AnyPlayActor.md)
 - [ComponentFn](type-aliases/ComponentFn.md)
-- [~~PlayRendererProps~~](type-aliases/PlayRendererProps.md)
 - [RenderErrorHandler](type-aliases/RenderErrorHandler.md)
 
 ## Variables
@@ -267,6 +254,7 @@ composition. Read its source for the reference bridge.
 - [ActorProvider](variables/ActorProvider.md)
 - [PlayRenderer](variables/PlayRenderer.md)
 - [PlayUIProvider](variables/PlayUIProvider.md)
+- [schema](variables/schema.md)
 
 ## Functions
 
@@ -276,9 +264,9 @@ composition. Read its source for the reference bridge.
 - [Renderer](functions/Renderer.md)
 - [StateProvider](functions/StateProvider.md)
 - [useActor](functions/useActor.md)
+- [useAtomEffect](functions/useAtomEffect.md)
 - [useBoundProp](functions/useBoundProp.md)
 - [useFieldValidation](functions/useFieldValidation.md)
 - [usePlayView](functions/usePlayView.md)
-- [useSignalEffect](functions/useSignalEffect.md)
 - [ValidationProvider](functions/ValidationProvider.md)
 - [VisibilityProvider](functions/VisibilityProvider.md)

package/api/@xmachines/play-react/classes/PlayErrorBoundary.md

@@ -2,7 +2,7 @@
 
 # Class: PlayErrorBoundary
 
-Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:99](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L99)
+Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:99](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L99)
 
 The React class component that catches a render error of a catalog component.
 
@@ -37,7 +37,7 @@ CONS-14: the class component pattern works with every React version, 18 and 19.
 new PlayErrorBoundary(props): PlayErrorBoundary;
 ```
 
-Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:103](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L103)
+Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:103](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L103)
 
 #### Parameters
 
@@ -76,7 +76,7 @@ React.Component<
 componentDidCatch(error, info): void;
 ```
 
-Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:135](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L135)
+Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:135](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L135)
 
 Catches exceptions generated in descendant components. Unhandled exceptions will cause
 the entire component tree to unmount.
@@ -128,7 +128,8 @@ React.Component.componentDidMount;
 optional componentDidUpdate(
    prevProps,
    prevState,
-   snapshot?): void;
+   snapshot?
+): void;
 ```
 
 Defined in: `@types/react`
@@ -268,7 +269,8 @@ React.Component.componentWillUnmount;
 optional componentWillUpdate(
    nextProps,
    nextState,
-   nextContext): void;
+   nextContext
+): void;
 ```
 
 Defined in: `@types/react`
@@ -376,7 +378,7 @@ React.Component.getSnapshotBeforeUpdate;
 render(): ReactNode;
 ```
 
-Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:139](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L139)
+Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:139](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L139)
 
 #### Returns
 
@@ -429,7 +431,8 @@ React.Component.setState;
 optional shouldComponentUpdate(
    nextProps,
    nextState,
-   nextContext): boolean;
+   nextContext
+): boolean;
 ```
 
 Defined in: `@types/react`
@@ -555,7 +558,8 @@ React.Component.UNSAFE_componentWillReceiveProps;
 optional UNSAFE_componentWillUpdate(
    nextProps,
    nextState,
-   nextContext): void;
+   nextContext
+): void;
 ```
 
 Defined in: `@types/react`
@@ -605,7 +609,7 @@ React.Component.UNSAFE_componentWillUpdate;
 static getDerivedStateFromError(error): Pick<PlayErrorBoundaryState, "hasError" | "error">;
 ```
 
-Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:108](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L108)
+Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:108](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L108)
 
 #### Parameters
 
@@ -627,7 +631,7 @@ static getDerivedStateFromProps(props, state):
   | null;
 ```
 
-Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:126](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L126)
+Defined in: [packages/play-react/src/PlayErrorBoundary.tsx:126](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/PlayErrorBoundary.tsx#L126)
 
 Clears the error state after a change of `resetKey`.
 

package/api/@xmachines/play-react/functions/useActor.md

@@ -6,7 +6,7 @@
 function useActor(): AnyPlayActor;
 ```
 
-Defined in: [packages/play-react/src/useActor.ts:34](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/useActor.ts#L34)
+Defined in: [packages/play-react/src/useActor.ts:41](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/useActor.ts#L41)
 
 ## Returns
 

package/api/@xmachines/play-react/functions/useAtomEffect.md

@@ -0,0 +1,103 @@
+[API](../../../README.md) / [@xmachines/play-react](../README.md) / useAtomEffect
+
+# Function: useAtomEffect()
+
+```ts
+function useAtomEffect(sources, callback, deps?): void;
+```
+
+Defined in: [packages/play-react/src/useAtomEffect.ts:105](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/useAtomEffect.ts#L105)
+
+The React hook that subscribes to the named atoms and runs an effect callback
+
+The hook puts the SOURCES in a computed atom, and it gives the subscription lifecycle
+to `watchAtom` from `@xmachines/play-atom`. That function owns the coalescing and the
+disposal. It is the one canonical implementation, and every framework renderer uses
+it.
+
+Architecture:
+
+- The `sources` array names every atom that runs the effect
+- The callback runs OUTSIDE the tracking scope, so a read inside it adds no dependency
+- watchAtom owns the subscription lifecycle
+- The callback triggers each new render with its own setState (see the remarks)
+- The hook cleans up on unmount, so that nothing stays in memory
+
+Invariant: Atom-Only Reactivity. The hook watches each atom of `sources`.
+Invariant: Passive Infrastructure. React observes the atoms, and it does not control them.
+
+## Parameters
+
+| Parameter  | Type                                                                         | Default value | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                           |
+| ---------- | ---------------------------------------------------------------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `sources`  | readonly [`Readable`](../../play-atom/interfaces/Readable.md)\<`unknown`\>[] | `undefined`   | The atoms that run the effect. The list names every dependency, and the reads of the callback name none: a callback that reads a view store therefore depends on that store not, and a write of the store runs the effect never.                                                                                                                                                                                                                                                      |
+| `callback` | () => `void` \| (() => `void`)                                               | `undefined`   | The effect function. It can return a cleanup function. It runs one time on the mount, and one time for each write of a source.                                                                                                                                                                                                                                                                                                                                                        |
+| `deps`     | `DependencyList`                                                             | `[]`          | The optional dependency list, as in useEffect. On a change of one dependency, the hook removes the watcher and the computed atom, then makes them again and reads the sources from the start. The default is `[]`, which subscribes one time for each mount. Give this list when the identity of the object whose atoms you read can change during the life of the component, for example an `actor` prop. Without the list, the watcher tracks the atoms of the OLD object for ever. |
+
+## Returns
+
+`void`
+
+## Example
+
+```typescript
+const MyComponent = ({ actor }) => {
+  const [view, setView] = useState(null);
+
+  // Subscribe to the actor.currentView atom, and subscribe again on a new actor
+  useAtomEffect(
+    [actor.currentView],
+    () => {
+      const currentView = actor.currentView.get();
+      setView(currentView);
+    },
+    [actor],
+  );
+
+  return <div>{view?.root}</div>;
+};
+```
+
+## Remarks
+
+**CRITICAL:** name every atom that must run the effect in `sources`. A read inside
+the callback tracks nothing, so an atom that the list leaves out runs the effect
+never.
+
+**How often the callback runs:** one time for each MICROTASK, and not one time for
+each write. `watchAtom` owns that rule: it keeps the synchronous notification of
+`@xstate/store` and it defers the callback, so one batch of synchronous writes reaches
+the callback one time, with the last value. Three writes in one tick therefore run the
+callback ONE time.
+
+The DERIVATION is the part that runs for each write: `@xstate/store` evaluates a
+computed atom synchronously inside the `set` of a dependency, and that evaluation IS
+the dependency tracking. Keep each source atom cheap to derive.
+
+**Re-rendering:** the hook itself does NOT force a React render on an atom
+change. The callback triggers each new render, because it calls setState with the
+new atom value, as in the example above. The setState bailout of React can skip a
+render when the derived value is the same.
+
+**A callback that throws:** the FIRST run happens while the hook mounts, so a throw
+there reaches the caller and React reports it. A later run happens in the microtask of
+`watchAtom`, and a throw there reaches no caller. The hook catches it and throws it
+again from a microtask of its own, which reaches the global handler of the runtime.
+
+**A SOURCE that throws:** a source derives its value inside the `set` of the atom that
+it reads, and `@xstate/store` evaluates it there for every watcher. A throw from that
+derivation therefore leaves the `set` of the WRITER: the write fails, and every other
+observer of that write is skipped. The hook can catch none of it, because the engine
+runs the derivation before it reaches this hook — a watched computed atom that throws
+does the same with no hook anywhere.
+
+Therefore a source derivation must return a value and throw nothing. `currentView` and
+`currentRoute` of `@xmachines/play-xstate` follow that rule: each one catches its own
+failure, reports it through `onError` of the actor from a microtask, and keeps the last
+value. Write a source of your own the same way.
+
+**Implementation note:** the hook puts the SOURCES in a computed atom, because a
+subscription needs one atom to watch. That computed atom reads each source and holds
+the dependency edges, `watchAtom` owns the subscription that keeps it live, and the
+callback runs from the observer, which `@xstate/store` calls with no active
+subscriber.

package/api/@xmachines/play-react/functions/usePlayView.md

@@ -6,7 +6,7 @@
 function usePlayView(): ViewContextValue;
 ```
 
-Defined in: [packages/play-react/src/ActorProvider.tsx:150](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v3.0.0/packages/play-react/src/ActorProvider.tsx#L150)
+Defined in: [packages/play-react/src/ActorProvider.tsx:150](https://gitlab.com/xmachin-es/xmachines-js/-/blob/v5.0.0/packages/play-react/src/ActorProvider.tsx#L150)
 
 The hook that gives the current view spec, the handlers, and the registry.