@xmachines/play-solid 2.0.0 → 2.1.1
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/README.md +41 -37
- package/dist/ActorProvider.d.ts +32 -27
- package/dist/ActorProvider.d.ts.map +1 -1
- package/dist/ActorProvider.js +23 -21
- package/dist/ActorProvider.js.map +1 -1
- package/dist/PlayRenderer.d.ts +10 -7
- package/dist/PlayRenderer.d.ts.map +1 -1
- package/dist/PlayRenderer.js +5 -3
- package/dist/PlayRenderer.js.map +1 -1
- package/dist/PlayUIProvider.d.ts +12 -11
- package/dist/PlayUIProvider.d.ts.map +1 -1
- package/dist/PlayUIProvider.js +11 -10
- package/dist/PlayUIProvider.js.map +1 -1
- package/dist/index.d.ts +5 -5
- package/dist/index.d.ts.map +1 -1
- package/dist/types.d.ts +3 -3
- package/dist/useActor.d.ts +11 -8
- package/dist/useActor.d.ts.map +1 -1
- package/dist/useActor.js +8 -7
- package/dist/useActor.js.map +1 -1
- package/package.json +5 -4
package/README.md
CHANGED
|
@@ -2,11 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
> Solid renderer for XMachines Play architecture
|
|
4
4
|
|
|
5
|
-
[](https://opensource.org/licenses/MIT) [](https://opensource.org/licenses/MIT) [](https://www.npmjs.com/package/@xmachines/play-solid)
|
|
6
6
|
|
|
7
|
-
SolidJS rendering layer
|
|
8
|
-
|
|
9
|
-
Part of the [xmachines-js monorepo](../../README.md).
|
|
7
|
+
The SolidJS rendering layer observes the actor signals and renders the UI components through `@xmachines/json-render-solid`. SolidJS reactivity only triggers the re-render. The TC39 Signals are the source of truth.
|
|
10
8
|
|
|
11
9
|
## Installation
|
|
12
10
|
|
|
@@ -14,7 +12,7 @@ Part of the [xmachines-js monorepo](../../README.md).
|
|
|
14
12
|
pnpm add @xmachines/play-solid
|
|
15
13
|
```
|
|
16
14
|
|
|
17
|
-
**Peer dependencies
|
|
15
|
+
**Peer dependencies.** Install them with the package:
|
|
18
16
|
|
|
19
17
|
```bash
|
|
20
18
|
pnpm add solid-js xstate @xstate/store @xmachines/json-render-solid @xmachines/json-render-core @xmachines/json-render-xstate
|
|
@@ -27,15 +25,24 @@ import { PlayUIProvider, PlayRenderer, defineRegistry } from "@xmachines/play-so
|
|
|
27
25
|
import { definePlayer } from "@xmachines/play-xstate";
|
|
28
26
|
import { defineCatalog } from "@xmachines/json-render-core";
|
|
29
27
|
import { schema } from "@xmachines/json-render-solid/schema";
|
|
28
|
+
import { myMachine } from "./machine.js"; // your xstate machine (states carry meta.view specs)
|
|
29
|
+
// authCatalogDef is a plain object describing components/actions — in this repo it
|
|
30
|
+
// comes from the workspace-only @xmachines/play-actor-shared demo package
|
|
31
|
+
import { authCatalogDef } from "@xmachines/play-actor-shared";
|
|
30
32
|
|
|
31
|
-
// 1. Define a catalog
|
|
33
|
+
// 1. Define a catalog
|
|
32
34
|
const catalog = defineCatalog(schema, authCatalogDef);
|
|
33
35
|
|
|
34
|
-
// 2.
|
|
36
|
+
// 2. Create and start an actor
|
|
37
|
+
const createPlayer = definePlayer({ machine: myMachine });
|
|
38
|
+
const actor = createPlayer();
|
|
39
|
+
actor.start();
|
|
40
|
+
|
|
41
|
+
// 3. Build a component registry
|
|
35
42
|
const registryResult = defineRegistry(catalog, {
|
|
36
43
|
components: {
|
|
37
44
|
Home: () => <div>Welcome home!</div>,
|
|
38
|
-
Login: (ctx) => <div>Login {ctx.props.
|
|
45
|
+
Login: (ctx) => <div>Login {ctx.props.username && <span>{ctx.props.username}</span>}</div>,
|
|
39
46
|
},
|
|
40
47
|
actions: {
|
|
41
48
|
login: async (args) => actor.send({ type: "auth.login", username: args.username }),
|
|
@@ -43,11 +50,6 @@ const registryResult = defineRegistry(catalog, {
|
|
|
43
50
|
},
|
|
44
51
|
});
|
|
45
52
|
|
|
46
|
-
// 3. Create and start an actor
|
|
47
|
-
const createPlayer = definePlayer({ machine: myMachine });
|
|
48
|
-
const actor = createPlayer();
|
|
49
|
-
actor.start();
|
|
50
|
-
|
|
51
53
|
// 4. Render
|
|
52
54
|
function App() {
|
|
53
55
|
return (
|
|
@@ -62,30 +64,32 @@ function App() {
|
|
|
62
64
|
|
|
63
65
|
### `PlayUIProvider` + `PlayRenderer` (recommended)
|
|
64
66
|
|
|
65
|
-
`PlayUIProvider` is the
|
|
67
|
+
`PlayUIProvider` is the standard entry point. It wraps `ActorProvider` and `JSONUIProvider` into one composite provider. `PlayRenderer` is a leaf component without props. It reads the view context and renders the current spec.
|
|
66
68
|
|
|
67
69
|
```tsx
|
|
68
70
|
import { PlayUIProvider, PlayRenderer, defineRegistry } from "@xmachines/play-solid";
|
|
69
71
|
|
|
72
|
+
// actor, registryResult from the Quick Start above
|
|
70
73
|
<PlayUIProvider
|
|
71
74
|
actor={actor}
|
|
72
75
|
registryResult={registryResult}
|
|
73
76
|
fallback={<div>Loading…</div>}
|
|
74
77
|
onError={(err) => console.error(err)}
|
|
75
|
-
navigate={navigateFn} // optional: passed to JSONUIProvider
|
|
76
|
-
validationFunctions={valFns} // optional: form validation helpers
|
|
78
|
+
navigate={navigateFn} // optional: your navigation callback, passed to JSONUIProvider
|
|
79
|
+
validationFunctions={valFns} // optional: your form validation helpers
|
|
77
80
|
>
|
|
78
81
|
<PlayRenderer />
|
|
79
82
|
</PlayUIProvider>;
|
|
80
83
|
```
|
|
81
84
|
|
|
82
|
-
### `ActorProvider` (
|
|
85
|
+
### `ActorProvider` (low-level)
|
|
83
86
|
|
|
84
87
|
For library authors who need direct control over provider composition:
|
|
85
88
|
|
|
86
89
|
```tsx
|
|
87
90
|
import { ActorProvider, PlayRenderer } from "@xmachines/play-solid";
|
|
88
91
|
|
|
92
|
+
// actor, registryResult from the Quick Start above
|
|
89
93
|
<ActorProvider actor={actor} registryResult={registryResult}>
|
|
90
94
|
<PlayRenderer />
|
|
91
95
|
</ActorProvider>;
|
|
@@ -122,28 +126,28 @@ const MyRenderer = () => {
|
|
|
122
126
|
|
|
123
127
|
### Components
|
|
124
128
|
|
|
125
|
-
| Export | Description
|
|
126
|
-
| ---------------- |
|
|
127
|
-
| `PlayUIProvider` |
|
|
128
|
-
| `PlayRenderer` |
|
|
129
|
-
| `ActorProvider` |
|
|
129
|
+
| Export | Description |
|
|
130
|
+
| ---------------- | ----------------------------------------------------------------------------------------- |
|
|
131
|
+
| `PlayUIProvider` | The composite provider. Use it as the standard entry point |
|
|
132
|
+
| `PlayRenderer` | The leaf component without props. It renders the current view spec inside a provider tree |
|
|
133
|
+
| `ActorProvider` | The low-level provider for a custom provider composition |
|
|
130
134
|
|
|
131
135
|
### Hooks
|
|
132
136
|
|
|
133
|
-
| Export | Description
|
|
134
|
-
| --------------- |
|
|
135
|
-
| `useActor()` | Returns the raw `AnyPlayActor` instance from context
|
|
136
|
-
| `usePlayView()` | Returns the current `ViewContextValue` (spec, handlers, registry, store)
|
|
137
|
+
| Export | Description |
|
|
138
|
+
| --------------- | ---------------------------------------------------------------------------------------------------- |
|
|
139
|
+
| `useActor()` | Returns the raw `AnyPlayActor` instance from the context. It throws outside a provider tree |
|
|
140
|
+
| `usePlayView()` | Returns the current `ViewContextValue` (spec, handlers, registry, store). It throws outside the tree |
|
|
137
141
|
|
|
138
142
|
### Context
|
|
139
143
|
|
|
140
|
-
| Export | Description
|
|
141
|
-
| -------------- |
|
|
142
|
-
| `ActorContext` | SolidJS context
|
|
144
|
+
| Export | Description |
|
|
145
|
+
| -------------- | ----------------------------------------------------------------------------------------------- |
|
|
146
|
+
| `ActorContext` | The SolidJS context of the actor. Use `ActorContext.Provider` directly for a custom composition |
|
|
143
147
|
|
|
144
148
|
### Re-exports from `@xmachines/json-render-solid`
|
|
145
149
|
|
|
146
|
-
This package re-exports the
|
|
150
|
+
This package re-exports the complete `@xmachines/json-render-solid` public API, so that a consumer does not need a direct dependency:
|
|
147
151
|
|
|
148
152
|
```tsx
|
|
149
153
|
import {
|
|
@@ -172,12 +176,12 @@ import {
|
|
|
172
176
|
|
|
173
177
|
### Key Types
|
|
174
178
|
|
|
175
|
-
| Type | Description
|
|
176
|
-
| --------------------- |
|
|
177
|
-
| `PlayUIProviderProps` | Props for `PlayUIProvider`
|
|
178
|
-
| `ActorProviderProps` | Props for `ActorProvider`
|
|
179
|
-
| `ViewContextValue` | Shape of the context value from `usePlayView()`
|
|
180
|
-
| `AnyPlayActor` | `AbstractActor<AnyActorLogic>` — bare actor type
|
|
179
|
+
| Type | Description |
|
|
180
|
+
| --------------------- | -------------------------------------------------------------------------------------- |
|
|
181
|
+
| `PlayUIProviderProps` | Props for `PlayUIProvider` |
|
|
182
|
+
| `ActorProviderProps` | Props for `ActorProvider` |
|
|
183
|
+
| `ViewContextValue` | Shape of the context value from `usePlayView()` |
|
|
184
|
+
| `AnyPlayActor` | `AbstractActor<AnyActorLogic>` — the bare actor type that the context providers accept |
|
|
181
185
|
|
|
182
186
|
## Testing
|
|
183
187
|
|
|
@@ -195,7 +199,7 @@ pnpm run test:watch # watch mode
|
|
|
195
199
|
pnpm run test:ui # interactive Vitest UI
|
|
196
200
|
```
|
|
197
201
|
|
|
198
|
-
|
|
202
|
+
The v8 provider collects the coverage, with a threshold of 80% for lines, functions, branches, and statements. The browser tests are in `test/browser/`. The default jsdom run excludes them.
|
|
199
203
|
|
|
200
204
|
## License
|
|
201
205
|
|
package/dist/ActorProvider.d.ts
CHANGED
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* ActorProvider —
|
|
2
|
+
* ActorProvider — the SolidJS provider component of the XMachines Play actor lifecycle.
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
4
|
+
* This is the low-level provider, for the author of a library who needs the control.
|
|
5
|
+
* Most users take PlayUIProvider, the composite provider, instead.
|
|
6
6
|
*
|
|
7
7
|
* This component:
|
|
8
|
-
* -
|
|
9
|
-
* -
|
|
10
|
-
* -
|
|
11
|
-
* -
|
|
12
|
-
* -
|
|
13
|
-
* -
|
|
8
|
+
* - subscribes to the actor.currentView signal with watchSignal, in the body of the component (Phase 29)
|
|
9
|
+
* - manages the StateStore lifecycle of each view, controlled and uncontrolled
|
|
10
|
+
* - resolves each action handler with the inner component pattern, inside StateProvider
|
|
11
|
+
* - puts onRenderError into the registry, when the caller gives one
|
|
12
|
+
* - gives ActorContext (the actor) and ViewContext (the spec, the handlers, and the registry) to the children
|
|
13
|
+
* - wraps the render path in a SolidJS ErrorBoundary
|
|
14
14
|
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
15
|
+
* D-11: the old alias `ActorProvider = ActorContext.Provider` is gone. This component
|
|
16
|
+
* has the name now. Use `ActorContext.Provider` directly for the raw access.
|
|
17
17
|
*
|
|
18
18
|
* @packageDocumentation
|
|
19
19
|
*/
|
|
@@ -22,15 +22,15 @@ import type { DefineRegistryResult } from "@xmachines/json-render-solid";
|
|
|
22
22
|
import type { ComponentRegistry } from "@xmachines/json-render-solid";
|
|
23
23
|
import { type BaseActorProviderProps, type BaseViewContextValue } from "@xmachines/play-actor";
|
|
24
24
|
/**
|
|
25
|
-
*
|
|
26
|
-
*
|
|
25
|
+
* The value that the ViewContext of ActorProvider provides.
|
|
26
|
+
* usePlayView() gives it inside the ActorProvider tree.
|
|
27
27
|
*/
|
|
28
28
|
export interface ViewContextValue extends BaseViewContextValue<ComponentRegistry> {
|
|
29
29
|
}
|
|
30
30
|
/**
|
|
31
|
-
*
|
|
31
|
+
* The hook that gives the current view context inside an ActorProvider tree.
|
|
32
32
|
*
|
|
33
|
-
* @throws {Error}
|
|
33
|
+
* @throws {Error} When the caller is outside an ActorProvider tree or a PlayUIProvider tree
|
|
34
34
|
*
|
|
35
35
|
* @example
|
|
36
36
|
* ```tsx
|
|
@@ -44,27 +44,32 @@ export interface ViewContextValue extends BaseViewContextValue<ComponentRegistry
|
|
|
44
44
|
*/
|
|
45
45
|
export declare function usePlayView(): ViewContextValue;
|
|
46
46
|
/**
|
|
47
|
-
*
|
|
47
|
+
* The props of ActorProvider, the low-level provider.
|
|
48
48
|
*
|
|
49
|
-
* For
|
|
50
|
-
* with JSONUIProvider and
|
|
49
|
+
* For the standard use, prefer PlayUIProvider. That component wraps ActorProvider
|
|
50
|
+
* with JSONUIProvider and with every necessary sub-provider.
|
|
51
51
|
*/
|
|
52
52
|
export interface ActorProviderProps extends BaseActorProviderProps<DefineRegistryResult> {
|
|
53
|
-
/**
|
|
53
|
+
/**
|
|
54
|
+
* The optional fallback element. The provider shows it when currentView is null, and when the ErrorBoundary catches an error
|
|
55
|
+
*/
|
|
54
56
|
fallback?: JSX.Element;
|
|
55
|
-
/**
|
|
57
|
+
/** The optional callback. The provider calls it when the SolidJS ErrorBoundary catches an error */
|
|
56
58
|
onError?: (error: unknown) => void;
|
|
57
|
-
/**
|
|
59
|
+
/**
|
|
60
|
+
* The children. They are necessary, and they must hold a <PlayRenderer />. You can also use the PlayUIProvider short form
|
|
61
|
+
*/
|
|
58
62
|
children: JSX.Element;
|
|
59
63
|
}
|
|
60
64
|
/**
|
|
61
|
-
*
|
|
62
|
-
* StateStore lifecycle,
|
|
65
|
+
* The ActorProvider component. It owns the actor bridge, the signal subscription, the
|
|
66
|
+
* StateStore lifecycle, the resolution of the handlers, and the error boundary.
|
|
63
67
|
*
|
|
64
|
-
*
|
|
65
|
-
*
|
|
66
|
-
* `<
|
|
67
|
-
*
|
|
68
|
+
* D-11: this component replaces the old raw alias
|
|
69
|
+
* `ActorProvider = ActorContext.Provider`. A consumer with an
|
|
70
|
+
* `<ActorProvider value={actor}>` element takes
|
|
71
|
+
* `<ActorContext.Provider value={actor}>` now, for the raw access to the provider.
|
|
72
|
+
* That consumer can also move to this component, or to PlayUIProvider.
|
|
68
73
|
*
|
|
69
74
|
* @example
|
|
70
75
|
* ```tsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActorProvider.d.ts","sourceRoot":"","sources":["../src/ActorProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAWH,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/C,OAAO,KAAK,EAAE,oBAAoB,EAAY,MAAM,8BAA8B,CAAC;AAEnF,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAKtE,OAAO,EAIN,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,EACzB,MAAM,uBAAuB,CAAC;AAO/B;;;GAGG;AACH,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;CAAG;AAIpF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,WAAW,IAAI,gBAAgB,CAE9C;AAMD;;;;;GAKG;AACH,MAAM,WAAW,kBAAmB,SAAQ,sBAAsB,CAAC,oBAAoB,CAAC;IACvF
|
|
1
|
+
{"version":3,"file":"ActorProvider.d.ts","sourceRoot":"","sources":["../src/ActorProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAWH,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/C,OAAO,KAAK,EAAE,oBAAoB,EAAY,MAAM,8BAA8B,CAAC;AAEnF,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAKtE,OAAO,EAIN,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,EACzB,MAAM,uBAAuB,CAAC;AAO/B;;;GAGG;AACH,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;CAAG;AAIpF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,WAAW,IAAI,gBAAgB,CAE9C;AAMD;;;;;GAKG;AACH,MAAM,WAAW,kBAAmB,SAAQ,sBAAsB,CAAC,oBAAoB,CAAC;IACvF;;OAEG;IACH,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAEvB,mGAAmG;IACnG,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAEnC;;OAEG;IACH,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACtB;AA4CD;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,aAAa,EAAE,SAAS,CAAC,kBAAkB,CAkGvD,CAAC"}
|
package/dist/ActorProvider.js
CHANGED
|
@@ -9,29 +9,29 @@ import { assertNonNullable } from "@xmachines/play";
|
|
|
9
9
|
import { attachRenderErrorHandler, createViewStoreLifecycle } from "@xmachines/play-actor";
|
|
10
10
|
//#region packages/play-solid/src/ActorProvider.tsx
|
|
11
11
|
/**
|
|
12
|
-
* ActorProvider —
|
|
12
|
+
* ActorProvider — the SolidJS provider component of the XMachines Play actor lifecycle.
|
|
13
13
|
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
14
|
+
* This is the low-level provider, for the author of a library who needs the control.
|
|
15
|
+
* Most users take PlayUIProvider, the composite provider, instead.
|
|
16
16
|
*
|
|
17
17
|
* This component:
|
|
18
|
-
* -
|
|
19
|
-
* -
|
|
20
|
-
* -
|
|
21
|
-
* -
|
|
22
|
-
* -
|
|
23
|
-
* -
|
|
18
|
+
* - subscribes to the actor.currentView signal with watchSignal, in the body of the component (Phase 29)
|
|
19
|
+
* - manages the StateStore lifecycle of each view, controlled and uncontrolled
|
|
20
|
+
* - resolves each action handler with the inner component pattern, inside StateProvider
|
|
21
|
+
* - puts onRenderError into the registry, when the caller gives one
|
|
22
|
+
* - gives ActorContext (the actor) and ViewContext (the spec, the handlers, and the registry) to the children
|
|
23
|
+
* - wraps the render path in a SolidJS ErrorBoundary
|
|
24
24
|
*
|
|
25
|
-
*
|
|
26
|
-
*
|
|
25
|
+
* D-11: the old alias `ActorProvider = ActorContext.Provider` is gone. This component
|
|
26
|
+
* has the name now. Use `ActorContext.Provider` directly for the raw access.
|
|
27
27
|
*
|
|
28
28
|
* @packageDocumentation
|
|
29
29
|
*/
|
|
30
30
|
var ViewContext = createContext(null);
|
|
31
31
|
/**
|
|
32
|
-
*
|
|
32
|
+
* The hook that gives the current view context inside an ActorProvider tree.
|
|
33
33
|
*
|
|
34
|
-
* @throws {Error}
|
|
34
|
+
* @throws {Error} When the caller is outside an ActorProvider tree or a PlayUIProvider tree
|
|
35
35
|
*
|
|
36
36
|
* @example
|
|
37
37
|
* ```tsx
|
|
@@ -47,8 +47,9 @@ function usePlayView() {
|
|
|
47
47
|
return assertNonNullable(useContext(ViewContext), "ViewContext");
|
|
48
48
|
}
|
|
49
49
|
/**
|
|
50
|
-
*
|
|
51
|
-
* to get live set
|
|
50
|
+
* The inner component runs inside StateProvider. It can therefore call
|
|
51
|
+
* useStateStore() to get the live set function and the live getSnapshot function, for
|
|
52
|
+
* the resolution of the handlers.
|
|
52
53
|
*/
|
|
53
54
|
var ActorProviderInner = (innerProps) => {
|
|
54
55
|
const stateCtx = useStateStore();
|
|
@@ -71,13 +72,14 @@ var ActorProviderInner = (innerProps) => {
|
|
|
71
72
|
});
|
|
72
73
|
};
|
|
73
74
|
/**
|
|
74
|
-
*
|
|
75
|
-
* StateStore lifecycle,
|
|
75
|
+
* The ActorProvider component. It owns the actor bridge, the signal subscription, the
|
|
76
|
+
* StateStore lifecycle, the resolution of the handlers, and the error boundary.
|
|
76
77
|
*
|
|
77
|
-
*
|
|
78
|
-
*
|
|
79
|
-
* `<
|
|
80
|
-
*
|
|
78
|
+
* D-11: this component replaces the old raw alias
|
|
79
|
+
* `ActorProvider = ActorContext.Provider`. A consumer with an
|
|
80
|
+
* `<ActorProvider value={actor}>` element takes
|
|
81
|
+
* `<ActorContext.Provider value={actor}>` now, for the raw access to the provider.
|
|
82
|
+
* That consumer can also move to this component, or to PlayUIProvider.
|
|
81
83
|
*
|
|
82
84
|
* @example
|
|
83
85
|
* ```tsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActorProvider.js","names":["createSignal","createEffect","createMemo","onCleanup","createContext","useContext","ErrorBoundary","Component","JSX","StateProvider","useStateStore","DefineRegistryResult","SetState","StateStore","ComponentRegistry","createAtom","xstateStoreStateStore","watchSignal","assertNonNullable","attachRenderErrorHandler","createViewStoreLifecycle","PlaySpec","BaseActorProviderProps","BaseViewContextValue","ActorContext","AnyPlayActor","ViewContextValue","ViewContext","usePlayView","ActorProviderProps","fallback","Element","onError","error","children","ActorProviderInner","registryResult","spec","store","innerProps","stateCtx","setStateAdapter","updater","prev","getSnapshot","update","handlers","viewValue","registry","_$createComponent","Provider","value","ActorProvider","props","view","setView","actorProxy","Proxy","get","_target","prop","current","actor","Reflect","bind","has","resolvedRegistryResult","onRenderError","storeLifecycle","seed","atom","nextView","currentView","unwatch","err","resolve","guardedStore"],"sources":["../src/ActorProvider.tsx"],"sourcesContent":["/**\n * ActorProvider — Smart SolidJS provider component for the XMachines Play actor lifecycle.\n *\n * Escape hatch primitive for library authors who need direct control. Most users should\n * use PlayUIProvider (batteries-included composite) instead.\n *\n * This component:\n * - Subscribes to actor.currentView signal via watchSignal (in component body per Phase 29)\n * - Manages per-view StateStore lifecycle (controlled/uncontrolled)\n * - Resolves action handlers via inner component pattern (inside StateProvider)\n * - Injects onRenderError into registry if provided\n * - Provides ActorContext (actor) and ViewContext (spec + handlers + registry) to children\n * - Wraps render path in SolidJS ErrorBoundary\n *\n * Per D-11: The old `ActorProvider = ActorContext.Provider` alias is removed. This new smart\n * component takes the name. Use `ActorContext.Provider` directly for escape-hatch access.\n *\n * @packageDocumentation\n */\n\nimport {\n\tcreateSignal,\n\tcreateEffect,\n\tcreateMemo,\n\tonCleanup,\n\tcreateContext,\n\tuseContext,\n\tErrorBoundary,\n} from \"solid-js\";\nimport type { Component, JSX } from \"solid-js\";\nimport { StateProvider, useStateStore } from \"@xmachines/json-render-solid\";\nimport type { DefineRegistryResult, SetState } from \"@xmachines/json-render-solid\";\nimport type { StateStore } from \"@xmachines/json-render-core\";\nimport type { ComponentRegistry } from \"@xmachines/json-render-solid\";\nimport { createAtom } from \"@xstate/store\";\nimport { xstateStoreStateStore } from \"@xmachines/json-render-xstate\";\nimport { watchSignal } from \"@xmachines/play-signals\";\nimport { assertNonNullable } from \"@xmachines/play\";\nimport {\n\tattachRenderErrorHandler,\n\tcreateViewStoreLifecycle,\n\ttype PlaySpec,\n\ttype BaseActorProviderProps,\n\ttype BaseViewContextValue,\n} from \"@xmachines/play-actor\";\nimport { ActorContext, type AnyPlayActor } from \"./useActor.js\";\n\n// ---------------------------------------------------------------------------\n// ViewContextValue — shape of the context value provided by ActorProvider\n// ---------------------------------------------------------------------------\n\n/**\n * Value provided by ActorProvider's ViewContext.\n * Access via usePlayView() inside the ActorProvider tree.\n */\nexport interface ViewContextValue extends BaseViewContextValue<ComponentRegistry> {}\n\nconst ViewContext = createContext<ViewContextValue | null>(null);\n\n/**\n * Hook to access the current view context inside an ActorProvider tree.\n *\n * @throws {Error} If called outside an ActorProvider (or PlayUIProvider) tree\n *\n * @example\n * ```tsx\n * import { usePlayView } from \"@xmachines/play-solid\";\n *\n * const MyRenderer: Component = () => {\n * const view = usePlayView();\n * return <Renderer spec={view.spec} registry={view.registry} />;\n * };\n * ```\n */\nexport function usePlayView(): ViewContextValue {\n\treturn assertNonNullable(useContext(ViewContext), \"ViewContext\");\n}\n\n// ---------------------------------------------------------------------------\n// ActorProviderProps\n// ---------------------------------------------------------------------------\n\n/**\n * Props for ActorProvider — the escape hatch primitive.\n *\n * For batteries-included usage, prefer PlayUIProvider which wraps ActorProvider\n * with JSONUIProvider and all required sub-providers.\n */\nexport interface ActorProviderProps extends BaseActorProviderProps<DefineRegistryResult> {\n\t/** Optional fallback element shown when currentView is null or ErrorBoundary catches */\n\tfallback?: JSX.Element;\n\n\t/** Optional callback invoked when SolidJS ErrorBoundary catches an error */\n\tonError?: (error: unknown) => void;\n\n\t/** Children — required; must include <PlayRenderer /> (or use PlayUIProvider shorthand) */\n\tchildren: JSX.Element;\n}\n\n// ---------------------------------------------------------------------------\n// ActorProviderInner — resolves handlers inside StateProvider tree\n// ---------------------------------------------------------------------------\n\n/**\n * Inner component that runs inside StateProvider so it can call useStateStore()\n * to get live set/getSnapshot for handler resolution.\n */\nconst ActorProviderInner: Component<{\n\tregistryResult: DefineRegistryResult;\n\tspec: PlaySpec;\n\tstore: StateStore;\n\tchildren: JSX.Element;\n}> = (innerProps) => {\n\tconst stateCtx = useStateStore();\n\n\t// Build SetState adapter bridging stateCtx.update/getSnapshot\n\tconst setStateAdapter: SetState = (updater) => {\n\t\tconst prev = stateCtx.getSnapshot();\n\t\tstateCtx.update(updater(prev));\n\t};\n\n\tconst handlers = innerProps.registryResult.handlers(\n\t\t() => setStateAdapter,\n\t\t() => stateCtx.getSnapshot(),\n\t);\n\n\tconst viewValue: ViewContextValue = {\n\t\tspec: innerProps.spec,\n\t\thandlers,\n\t\tregistry: innerProps.registryResult.registry,\n\t\tstore: innerProps.store,\n\t};\n\n\treturn <ViewContext.Provider value={viewValue}>{innerProps.children}</ViewContext.Provider>;\n};\n\n// ---------------------------------------------------------------------------\n// ActorProvider — the smart component (per D-11 takes the ActorProvider name)\n// ---------------------------------------------------------------------------\n\n/**\n * Smart ActorProvider component — owns actor bridging, signal subscription,\n * StateStore lifecycle, handler resolution, and error boundary.\n *\n * Per D-11: Replaces the old raw alias `ActorProvider = ActorContext.Provider`.\n * Consumers who previously used `<ActorProvider value={actor}>` should now use\n * `<ActorContext.Provider value={actor}>` for raw provider access, or migrate to\n * this smart component / PlayUIProvider.\n *\n * @example\n * ```tsx\n * import { ActorProvider, PlayRenderer } from \"@xmachines/play-solid\";\n *\n * <ActorProvider actor={myActor} registryResult={registryResult}>\n * <PlayRenderer />\n * </ActorProvider>\n * ```\n */\nexport const ActorProvider: Component<ActorProviderProps> = (props) => {\n\t// SolidJS signal for current view (PlaySpec | null)\n\tconst [view, setView] = createSignal<PlaySpec | null>(null);\n\n\t// A stable Proxy is provided as the ActorContext value instead of the raw\n\t// actor: Solid's Context.Provider reads `value` once at creation, so passing\n\t// `props.actor` directly would snapshot the FIRST actor and useActor()\n\t// consumers would never see a prop swap. With the proxy, consumers keep the\n\t// reference obtained at creation time, yet every property access (send,\n\t// currentView, …) resolves against the latest actor. Reading `props.actor`\n\t// inside the traps is a reactive read, so consumers accessing properties in\n\t// tracking scopes (createEffect, createMemo, JSX) re-run on swap. Methods\n\t// are bound to the current actor so `this` (including private fields) works\n\t// exactly as with a direct call. Mirrors play-vue's ActorProvider proxy.\n\tconst actorProxy = new Proxy({} as AnyPlayActor, {\n\t\tget(_target, prop) {\n\t\t\tconst current = props.actor as AnyPlayActor;\n\t\t\tconst value = Reflect.get(current, prop, current) as unknown;\n\t\t\treturn typeof value === \"function\" ? value.bind(current) : value;\n\t\t},\n\t\thas(_target, prop) {\n\t\t\treturn prop in (props.actor as AnyPlayActor);\n\t\t},\n\t});\n\n\t// Inject onRenderError into registry if provided (non-enumerable override).\n\t// Memoized so that creating a new object on every reactive evaluation does not\n\t// cause unnecessary re-renders of child components that receive this as a prop.\n\tconst resolvedRegistryResult = createMemo(() => {\n\t\tif (!props.onRenderError) return props.registryResult;\n\t\treturn {\n\t\t\t...props.registryResult,\n\t\t\tregistry: attachRenderErrorHandler(props.registryResult.registry, props.onRenderError),\n\t\t};\n\t});\n\n\t// Store lifecycle (reseed on viewKey change, refresh /context in place\n\t// otherwise, actor-swap reset, guard identity cache) — the shared\n\t// coordinator from @xmachines/play-actor; only the reactivity wiring in the\n\t// tracked JSX scope below is Solid's.\n\tconst storeLifecycle = createViewStoreLifecycle((seed) =>\n\t\txstateStoreStateStore({ atom: createAtom(seed) }),\n\t);\n\n\t// Bridge TC39 Signal to SolidJS signal — seed AND watch atomically inside a single\n\t// createEffect to eliminate the race window between .get() and watcher registration.\n\t// If the TC39 signal changes between the initial .get() and first watcher notification,\n\t// the update function captures the latest value without missing it.\n\tcreateEffect(() => {\n\t\tconst update = (nextView: PlaySpec | null) => setView(nextView);\n\t\tupdate(props.actor.currentView.get() as PlaySpec | null);\n\t\tconst unwatch = watchSignal(props.actor.currentView, (nextView) => {\n\t\t\tupdate(nextView as PlaySpec | null);\n\t\t});\n\t\tonCleanup(() => unwatch());\n\t});\n\n\treturn (\n\t\t<ActorContext.Provider value={actorProxy}>\n\t\t\t<ErrorBoundary\n\t\t\t\tfallback={(err: unknown) => {\n\t\t\t\t\tprops.onError?.(err);\n\t\t\t\t\treturn props.fallback ?? null;\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{(() => {\n\t\t\t\t\tconst currentView = view();\n\t\t\t\t\tif (!currentView) return props.fallback ?? null;\n\n\t\t\t\t\t// Resolve the store (external/controlled or internal\n\t\t\t\t\t// per-viewKey) via the shared lifecycle; children get the\n\t\t\t\t\t// guarded store — /context is read-only to the spec. Reading\n\t\t\t\t\t// props.actor and props.store HERE keeps both tracked in this\n\t\t\t\t\t// scope, so swaps re-run the resolution.\n\t\t\t\t\tconst store: StateStore = storeLifecycle.resolve(\n\t\t\t\t\t\tprops.actor,\n\t\t\t\t\t\tcurrentView,\n\t\t\t\t\t\tprops.store,\n\t\t\t\t\t).guardedStore;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<StateProvider store={store}>\n\t\t\t\t\t\t\t<ActorProviderInner\n\t\t\t\t\t\t\t\tregistryResult={resolvedRegistryResult()}\n\t\t\t\t\t\t\t\tspec={currentView}\n\t\t\t\t\t\t\t\tstore={store}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{props.children}\n\t\t\t\t\t\t\t</ActorProviderInner>\n\t\t\t\t\t\t</StateProvider>\n\t\t\t\t\t);\n\t\t\t\t})()}\n\t\t\t</ErrorBoundary>\n\t\t</ActorContext.Provider>\n\t);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,IAAM2B,cAAcvB,cAAuC,IAAI;;;;;;;;;;;;;;;;AAiB/D,SAAgBwB,cAAgC;CAC/C,OAAOV,kBAAkBb,WAAWsB,WAAW,GAAG,aAAa;AAChE;;;;;AA+BA,IAAMQ,sBAKAI,eAAe;CACpB,MAAMC,WAAW9B,cAAc;CAG/B,MAAM+B,mBAA6BC,YAAY;EAC9C,MAAMC,OAAOH,SAASI,YAAY;EAClCJ,SAASK,OAAOH,QAAQC,IAAI,CAAC;CAC9B;CAEA,MAAMG,WAAWP,WAAWH,eAAeU,eACpCL,uBACAD,SAASI,YAAY,CAC5B;CAEA,MAAMG,YAA8B;EACnCV,MAAME,WAAWF;EACjBS;EACAE,UAAUT,WAAWH,eAAeY;EACpCV,OAAOC,WAAWD;CACnB;CAEA,OAAAW,gBAAQtB,YAAYuB,UAAQ;EAACC,OAAOJ;EAAS,IAAAb,WAAA;GAAA,OAAGK,WAAWL;EAAQ;CAAA,CAAA;AACpE;;;;;;;;;;;;;;;;;;;AAwBA,IAAakB,iBAAgDC,UAAU;CAEtE,MAAM,CAACC,MAAMC,WAAWvD,aAA8B,IAAI;CAY1D,MAAMwD,aAAa,IAAIC,MAAM,CAAC,GAAmB;EAChDC,IAAIC,SAASC,MAAM;GAClB,MAAMC,UAAUR,MAAMS;GACtB,MAAMX,QAAQY,QAAQL,IAAIG,SAASD,MAAMC,OAAO;GAChD,OAAO,OAAOV,UAAU,aAAaA,MAAMa,KAAKH,OAAO,IAAIV;EAC5D;EACAc,IAAIN,SAASC,MAAM;GAClB,OAAOA,QAASP,MAAMS;EACvB;CACD,CAAC;CAKD,MAAMI,yBAAyBhE,iBAAiB;EAC/C,IAAI,CAACmD,MAAMc,eAAe,OAAOd,MAAMjB;EACvC,OAAO;GACN,GAAGiB,MAAMjB;GACTY,UAAU7B,yBAAyBkC,MAAMjB,eAAeY,UAAUK,MAAMc,aAAa;EACtF;CACD,CAAC;CAMD,MAAMC,iBAAiBhD,0BAA0BiD,SAChDrD,sBAAsB,EAAEsD,MAAMvD,WAAWsD,IAAI,EAAE,CAAC,CACjD;CAMApE,mBAAmB;EAClB,MAAM4C,UAAU0B,aAA8BhB,QAAQgB,QAAQ;EAC9D1B,OAAOQ,MAAMS,MAAMU,YAAYd,IAAI,CAAoB;EACvD,MAAMe,UAAUxD,YAAYoC,MAAMS,MAAMU,cAAcD,aAAa;GAClE1B,OAAO0B,QAA2B;EACnC,CAAC;EACDpE,gBAAgBsE,QAAQ,CAAC;CAC1B,CAAC;CAED,OAAAxB,gBACEzB,aAAa0B,UAAQ;EAACC,OAAOK;EAAU,IAAAtB,WAAA;GAAA,OAAAe,gBACtC3C,eAAa;IACbwB,WAAW4C,QAAiB;KAC3BrB,MAAMrB,UAAU0C,GAAG;KACnB,OAAOrB,MAAMvB,YAAY;IAC1B;IAAC,IAAAI,WAAA;KAAA,cAEO;MACP,MAAMsC,cAAclB,KAAK;MACzB,IAAI,CAACkB,aAAa,OAAOnB,MAAMvB,YAAY;MAO3C,MAAMQ,QAAoB8B,eAAeO,QACxCtB,MAAMS,OACNU,aACAnB,MAAMf,KACP,CAAC,CAACsC;MAEF,OAAA3B,gBACExC,eAAa;OAAQ6B;OAAK,IAAAJ,WAAA;QAAA,OAAAe,gBACzBd,oBAAkB;SAAA,IAClBC,iBAAc;UAAA,OAAE8B,uBAAuB;SAAC;SACxC7B,MAAMmC;SACClC;SAAK,IAAAJ,WAAA;UAAA,OAEXmB,MAAMnB;SAAQ;QAAA,CAAA;OAAA;MAAA,CAAA;KAInB,EAAA,CAAG;IAAC;GAAA,CAAA;EAAA;CAAA,CAAA;AAIR"}
|
|
1
|
+
{"version":3,"file":"ActorProvider.js","names":["createSignal","createEffect","createMemo","onCleanup","createContext","useContext","ErrorBoundary","Component","JSX","StateProvider","useStateStore","DefineRegistryResult","SetState","StateStore","ComponentRegistry","createAtom","xstateStoreStateStore","watchSignal","assertNonNullable","attachRenderErrorHandler","createViewStoreLifecycle","PlaySpec","BaseActorProviderProps","BaseViewContextValue","ActorContext","AnyPlayActor","ViewContextValue","ViewContext","usePlayView","ActorProviderProps","fallback","Element","onError","error","children","ActorProviderInner","registryResult","spec","store","innerProps","stateCtx","setStateAdapter","updater","prev","getSnapshot","update","handlers","viewValue","registry","_$createComponent","Provider","value","ActorProvider","props","view","setView","actorProxy","Proxy","get","_target","prop","current","actor","Reflect","bind","has","resolvedRegistryResult","onRenderError","storeLifecycle","seed","atom","nextView","currentView","unwatch","err","resolve","guardedStore"],"sources":["../src/ActorProvider.tsx"],"sourcesContent":["/**\n * ActorProvider — the SolidJS provider component of the XMachines Play actor lifecycle.\n *\n * This is the low-level provider, for the author of a library who needs the control.\n * Most users take PlayUIProvider, the composite provider, instead.\n *\n * This component:\n * - subscribes to the actor.currentView signal with watchSignal, in the body of the component (Phase 29)\n * - manages the StateStore lifecycle of each view, controlled and uncontrolled\n * - resolves each action handler with the inner component pattern, inside StateProvider\n * - puts onRenderError into the registry, when the caller gives one\n * - gives ActorContext (the actor) and ViewContext (the spec, the handlers, and the registry) to the children\n * - wraps the render path in a SolidJS ErrorBoundary\n *\n * D-11: the old alias `ActorProvider = ActorContext.Provider` is gone. This component\n * has the name now. Use `ActorContext.Provider` directly for the raw access.\n *\n * @packageDocumentation\n */\n\nimport {\n\tcreateSignal,\n\tcreateEffect,\n\tcreateMemo,\n\tonCleanup,\n\tcreateContext,\n\tuseContext,\n\tErrorBoundary,\n} from \"solid-js\";\nimport type { Component, JSX } from \"solid-js\";\nimport { StateProvider, useStateStore } from \"@xmachines/json-render-solid\";\nimport type { DefineRegistryResult, SetState } from \"@xmachines/json-render-solid\";\nimport type { StateStore } from \"@xmachines/json-render-core\";\nimport type { ComponentRegistry } from \"@xmachines/json-render-solid\";\nimport { createAtom } from \"@xstate/store\";\nimport { xstateStoreStateStore } from \"@xmachines/json-render-xstate\";\nimport { watchSignal } from \"@xmachines/play-signals\";\nimport { assertNonNullable } from \"@xmachines/play\";\nimport {\n\tattachRenderErrorHandler,\n\tcreateViewStoreLifecycle,\n\ttype PlaySpec,\n\ttype BaseActorProviderProps,\n\ttype BaseViewContextValue,\n} from \"@xmachines/play-actor\";\nimport { ActorContext, type AnyPlayActor } from \"./useActor.js\";\n\n// ---------------------------------------------------------------------------\n// ViewContextValue — the shape of the context value that ActorProvider gives\n// ---------------------------------------------------------------------------\n\n/**\n * The value that the ViewContext of ActorProvider provides.\n * usePlayView() gives it inside the ActorProvider tree.\n */\nexport interface ViewContextValue extends BaseViewContextValue<ComponentRegistry> {}\n\nconst ViewContext = createContext<ViewContextValue | null>(null);\n\n/**\n * The hook that gives the current view context inside an ActorProvider tree.\n *\n * @throws {Error} When the caller is outside an ActorProvider tree or a PlayUIProvider tree\n *\n * @example\n * ```tsx\n * import { usePlayView } from \"@xmachines/play-solid\";\n *\n * const MyRenderer: Component = () => {\n * const view = usePlayView();\n * return <Renderer spec={view.spec} registry={view.registry} />;\n * };\n * ```\n */\nexport function usePlayView(): ViewContextValue {\n\treturn assertNonNullable(useContext(ViewContext), \"ViewContext\");\n}\n\n// ---------------------------------------------------------------------------\n// ActorProviderProps\n// ---------------------------------------------------------------------------\n\n/**\n * The props of ActorProvider, the low-level provider.\n *\n * For the standard use, prefer PlayUIProvider. That component wraps ActorProvider\n * with JSONUIProvider and with every necessary sub-provider.\n */\nexport interface ActorProviderProps extends BaseActorProviderProps<DefineRegistryResult> {\n\t/**\n\t * The optional fallback element. The provider shows it when currentView is null, and when the ErrorBoundary catches an error\n\t */\n\tfallback?: JSX.Element;\n\n\t/** The optional callback. The provider calls it when the SolidJS ErrorBoundary catches an error */\n\tonError?: (error: unknown) => void;\n\n\t/**\n\t * The children. They are necessary, and they must hold a <PlayRenderer />. You can also use the PlayUIProvider short form\n\t */\n\tchildren: JSX.Element;\n}\n\n// ---------------------------------------------------------------------------\n// ActorProviderInner — it resolves the handlers inside the StateProvider tree\n// ---------------------------------------------------------------------------\n\n/**\n * The inner component runs inside StateProvider. It can therefore call\n * useStateStore() to get the live set function and the live getSnapshot function, for\n * the resolution of the handlers.\n */\nconst ActorProviderInner: Component<{\n\tregistryResult: DefineRegistryResult;\n\tspec: PlaySpec;\n\tstore: StateStore;\n\tchildren: JSX.Element;\n}> = (innerProps) => {\n\tconst stateCtx = useStateStore();\n\n\t// Build the SetState adapter. It joins stateCtx.update and stateCtx.getSnapshot\n\tconst setStateAdapter: SetState = (updater) => {\n\t\tconst prev = stateCtx.getSnapshot();\n\t\tstateCtx.update(updater(prev));\n\t};\n\n\tconst handlers = innerProps.registryResult.handlers(\n\t\t() => setStateAdapter,\n\t\t() => stateCtx.getSnapshot(),\n\t);\n\n\tconst viewValue: ViewContextValue = {\n\t\tspec: innerProps.spec,\n\t\thandlers,\n\t\tregistry: innerProps.registryResult.registry,\n\t\tstore: innerProps.store,\n\t};\n\n\treturn <ViewContext.Provider value={viewValue}>{innerProps.children}</ViewContext.Provider>;\n};\n\n// ---------------------------------------------------------------------------\n// ActorProvider — the component. D-11 gives it the ActorProvider name\n// ---------------------------------------------------------------------------\n\n/**\n * The ActorProvider component. It owns the actor bridge, the signal subscription, the\n * StateStore lifecycle, the resolution of the handlers, and the error boundary.\n *\n * D-11: this component replaces the old raw alias\n * `ActorProvider = ActorContext.Provider`. A consumer with an\n * `<ActorProvider value={actor}>` element takes\n * `<ActorContext.Provider value={actor}>` now, for the raw access to the provider.\n * That consumer can also move to this component, or to PlayUIProvider.\n *\n * @example\n * ```tsx\n * import { ActorProvider, PlayRenderer } from \"@xmachines/play-solid\";\n *\n * <ActorProvider actor={myActor} registryResult={registryResult}>\n * <PlayRenderer />\n * </ActorProvider>\n * ```\n */\nexport const ActorProvider: Component<ActorProviderProps> = (props) => {\n\t// The SolidJS signal of the current view (PlaySpec | null)\n\tconst [view, setView] = createSignal<PlaySpec | null>(null);\n\n\t// The code gives a stable Proxy as the value of ActorContext, and not the raw actor.\n\t// The Context.Provider of Solid reads `value` one time, at its creation. Therefore\n\t// `props.actor` gives the FIRST actor only, and a useActor() consumer sees a change of\n\t// the prop never. With the proxy, each consumer keeps the reference of the creation,\n\t// and every property access (send, currentView, and the others) resolves against the\n\t// newest actor. A read of `props.actor` inside a trap is a reactive read. Therefore a\n\t// consumer that reads a property in a tracking scope, such as createEffect,\n\t// createMemo, or the JSX, runs again after a change of the actor. Each method binds to\n\t// the current actor. Therefore `this`, and also each private field, works exactly as\n\t// in a direct call. The ActorProvider proxy of play-vue does the same.\n\tconst actorProxy = new Proxy({} as AnyPlayActor, {\n\t\tget(_target, prop) {\n\t\t\tconst current = props.actor as AnyPlayActor;\n\t\t\tconst value = Reflect.get(current, prop, current) as unknown;\n\t\t\treturn typeof value === \"function\" ? value.bind(current) : value;\n\t\t},\n\t\thas(_target, prop) {\n\t\t\treturn prop in (props.actor as AnyPlayActor);\n\t\t},\n\t});\n\n\t// Put onRenderError into the registry, when the caller gives one. The property is\n\t// not enumerable, and it replaces the handler below it.\n\t// The code keeps the result, because a new object on each reactive evaluation renders\n\t// each child component that receives it as a prop again, for nothing.\n\tconst resolvedRegistryResult = createMemo(() => {\n\t\tif (!props.onRenderError) return props.registryResult;\n\t\treturn {\n\t\t\t...props.registryResult,\n\t\t\tregistry: attachRenderErrorHandler(props.registryResult.registry, props.onRenderError),\n\t\t};\n\t});\n\n\t// The store lifecycle: it seeds the store again on a change of the viewKey, it\n\t// refreshes /context in place in every other case, it resets the store on a change of\n\t// the actor, and it guards the identity cache. The shared coordinator comes from\n\t// @xmachines/play-actor. Only the wiring of the reactivity in the tracked JSX scope\n\t// below belongs to Solid.\n\tconst storeLifecycle = createViewStoreLifecycle((seed) =>\n\t\txstateStoreStateStore({ atom: createAtom(seed) }),\n\t);\n\n\t// Connect the TC39 Signal to the SolidJS signal. The code seeds the value AND starts\n\t// the watch in one createEffect, at the same moment. Therefore no race window is\n\t// between the .get() call and the registration of the watcher. The TC39 signal can\n\t// change between the first .get() call and the first notification of the watcher, and\n\t// the update function then holds the newest value.\n\tcreateEffect(() => {\n\t\tconst update = (nextView: PlaySpec | null) => setView(nextView);\n\t\tupdate(props.actor.currentView.get() as PlaySpec | null);\n\t\tconst unwatch = watchSignal(props.actor.currentView, (nextView) => {\n\t\t\tupdate(nextView as PlaySpec | null);\n\t\t});\n\t\tonCleanup(() => unwatch());\n\t});\n\n\treturn (\n\t\t<ActorContext.Provider value={actorProxy}>\n\t\t\t<ErrorBoundary\n\t\t\t\tfallback={(err: unknown) => {\n\t\t\t\t\tprops.onError?.(err);\n\t\t\t\t\treturn props.fallback ?? null;\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{(() => {\n\t\t\t\t\tconst currentView = view();\n\t\t\t\t\tif (!currentView) return props.fallback ?? null;\n\n\t\t\t\t\t// Resolve the store, which is external and controlled, or internal for each viewKey,\n\t\t\t\t\t// through the shared lifecycle. The children receive the store with the guard, because\n\t\t\t\t\t// /context is read-only to the spec. The code reads props.actor and props.store HERE.\n\t\t\t\t\t// Both are therefore tracked in this scope, and a change of one of them runs the\n\t\t\t\t\t// resolution again.\n\t\t\t\t\tconst store: StateStore = storeLifecycle.resolve(\n\t\t\t\t\t\tprops.actor,\n\t\t\t\t\t\tcurrentView,\n\t\t\t\t\t\tprops.store,\n\t\t\t\t\t).guardedStore;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<StateProvider store={store}>\n\t\t\t\t\t\t\t<ActorProviderInner\n\t\t\t\t\t\t\t\tregistryResult={resolvedRegistryResult()}\n\t\t\t\t\t\t\t\tspec={currentView}\n\t\t\t\t\t\t\t\tstore={store}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{props.children}\n\t\t\t\t\t\t\t</ActorProviderInner>\n\t\t\t\t\t\t</StateProvider>\n\t\t\t\t\t);\n\t\t\t\t})()}\n\t\t\t</ErrorBoundary>\n\t\t</ActorContext.Provider>\n\t);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,IAAM2B,cAAcvB,cAAuC,IAAI;;;;;;;;;;;;;;;;AAiB/D,SAAgBwB,cAAgC;CAC/C,OAAOV,kBAAkBb,WAAWsB,WAAW,GAAG,aAAa;AAChE;;;;;;AAoCA,IAAMQ,sBAKAI,eAAe;CACpB,MAAMC,WAAW9B,cAAc;CAG/B,MAAM+B,mBAA6BC,YAAY;EAC9C,MAAMC,OAAOH,SAASI,YAAY;EAClCJ,SAASK,OAAOH,QAAQC,IAAI,CAAC;CAC9B;CAEA,MAAMG,WAAWP,WAAWH,eAAeU,eACpCL,uBACAD,SAASI,YAAY,CAC5B;CAEA,MAAMG,YAA8B;EACnCV,MAAME,WAAWF;EACjBS;EACAE,UAAUT,WAAWH,eAAeY;EACpCV,OAAOC,WAAWD;CACnB;CAEA,OAAAW,gBAAQtB,YAAYuB,UAAQ;EAACC,OAAOJ;EAAS,IAAAb,WAAA;GAAA,OAAGK,WAAWL;EAAQ;CAAA,CAAA;AACpE;;;;;;;;;;;;;;;;;;;;AAyBA,IAAakB,iBAAgDC,UAAU;CAEtE,MAAM,CAACC,MAAMC,WAAWvD,aAA8B,IAAI;CAY1D,MAAMwD,aAAa,IAAIC,MAAM,CAAC,GAAmB;EAChDC,IAAIC,SAASC,MAAM;GAClB,MAAMC,UAAUR,MAAMS;GACtB,MAAMX,QAAQY,QAAQL,IAAIG,SAASD,MAAMC,OAAO;GAChD,OAAO,OAAOV,UAAU,aAAaA,MAAMa,KAAKH,OAAO,IAAIV;EAC5D;EACAc,IAAIN,SAASC,MAAM;GAClB,OAAOA,QAASP,MAAMS;EACvB;CACD,CAAC;CAMD,MAAMI,yBAAyBhE,iBAAiB;EAC/C,IAAI,CAACmD,MAAMc,eAAe,OAAOd,MAAMjB;EACvC,OAAO;GACN,GAAGiB,MAAMjB;GACTY,UAAU7B,yBAAyBkC,MAAMjB,eAAeY,UAAUK,MAAMc,aAAa;EACtF;CACD,CAAC;CAOD,MAAMC,iBAAiBhD,0BAA0BiD,SAChDrD,sBAAsB,EAAEsD,MAAMvD,WAAWsD,IAAI,EAAE,CAAC,CACjD;CAOApE,mBAAmB;EAClB,MAAM4C,UAAU0B,aAA8BhB,QAAQgB,QAAQ;EAC9D1B,OAAOQ,MAAMS,MAAMU,YAAYd,IAAI,CAAoB;EACvD,MAAMe,UAAUxD,YAAYoC,MAAMS,MAAMU,cAAcD,aAAa;GAClE1B,OAAO0B,QAA2B;EACnC,CAAC;EACDpE,gBAAgBsE,QAAQ,CAAC;CAC1B,CAAC;CAED,OAAAxB,gBACEzB,aAAa0B,UAAQ;EAACC,OAAOK;EAAU,IAAAtB,WAAA;GAAA,OAAAe,gBACtC3C,eAAa;IACbwB,WAAW4C,QAAiB;KAC3BrB,MAAMrB,UAAU0C,GAAG;KACnB,OAAOrB,MAAMvB,YAAY;IAC1B;IAAC,IAAAI,WAAA;KAAA,cAEO;MACP,MAAMsC,cAAclB,KAAK;MACzB,IAAI,CAACkB,aAAa,OAAOnB,MAAMvB,YAAY;MAO3C,MAAMQ,QAAoB8B,eAAeO,QACxCtB,MAAMS,OACNU,aACAnB,MAAMf,KACP,CAAC,CAACsC;MAEF,OAAA3B,gBACExC,eAAa;OAAQ6B;OAAK,IAAAJ,WAAA;QAAA,OAAAe,gBACzBd,oBAAkB;SAAA,IAClBC,iBAAc;UAAA,OAAE8B,uBAAuB;SAAC;SACxC7B,MAAMmC;SACClC;SAAK,IAAAJ,WAAA;UAAA,OAEXmB,MAAMnB;SAAQ;QAAA,CAAA;OAAA;MAAA,CAAA;KAInB,EAAA,CAAG;IAAC;GAAA,CAAA;EAAA;CAAA,CAAA;AAIR"}
|
package/dist/PlayRenderer.d.ts
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* PlayRenderer -
|
|
2
|
+
* PlayRenderer - the leaf component without props of the XMachines Play SolidJS architecture.
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
* usePlayView()
|
|
4
|
+
* It reads the view context of the ActorProvider around it, or of the
|
|
5
|
+
* PlayUIProvider, with usePlayView(). It then renders the spec with the Renderer of
|
|
6
|
+
* @xmachines/json-render-solid.
|
|
6
7
|
*
|
|
7
|
-
*
|
|
8
|
+
* The standard use:
|
|
8
9
|
* ```tsx
|
|
9
10
|
* <PlayUIProvider actor={myActor} registryResult={registryResult}>
|
|
10
11
|
* <PlayRenderer />
|
|
@@ -15,10 +16,12 @@
|
|
|
15
16
|
*/
|
|
16
17
|
import type { Component } from "solid-js";
|
|
17
18
|
/**
|
|
18
|
-
*
|
|
19
|
+
* The leaf renderer without props. Put it inside an ActorProvider tree or a
|
|
20
|
+
* PlayUIProvider tree.
|
|
19
21
|
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
22
|
+
* It reads the ViewContextValue (the spec, the handlers, and the registry) of the
|
|
23
|
+
* provider around it, with usePlayView(). It then renders the spec with the Renderer
|
|
24
|
+
* of @xmachines/json-render-solid.
|
|
22
25
|
*/
|
|
23
26
|
export declare const PlayRenderer: Component;
|
|
24
27
|
//# sourceMappingURL=PlayRenderer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlayRenderer.d.ts","sourceRoot":"","sources":["../src/PlayRenderer.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"PlayRenderer.d.ts","sourceRoot":"","sources":["../src/PlayRenderer.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAI1C;;;;;;;GAOG;AACH,eAAO,MAAM,YAAY,EAAE,SAG1B,CAAC"}
|
package/dist/PlayRenderer.js
CHANGED
|
@@ -3,10 +3,12 @@ import { createComponent } from "solid-js/web";
|
|
|
3
3
|
import { Renderer } from "@xmachines/json-render-solid";
|
|
4
4
|
//#region packages/play-solid/src/PlayRenderer.tsx
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
6
|
+
* The leaf renderer without props. Put it inside an ActorProvider tree or a
|
|
7
|
+
* PlayUIProvider tree.
|
|
7
8
|
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
9
|
+
* It reads the ViewContextValue (the spec, the handlers, and the registry) of the
|
|
10
|
+
* provider around it, with usePlayView(). It then renders the spec with the Renderer
|
|
11
|
+
* of @xmachines/json-render-solid.
|
|
10
12
|
*/
|
|
11
13
|
var PlayRenderer = () => {
|
|
12
14
|
const view = usePlayView();
|
package/dist/PlayRenderer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlayRenderer.js","names":["Component","Renderer","usePlayView","PlayRenderer","view","_$createComponent","spec","registry"],"sources":["../src/PlayRenderer.tsx"],"sourcesContent":["/**\n * PlayRenderer -
|
|
1
|
+
{"version":3,"file":"PlayRenderer.js","names":["Component","Renderer","usePlayView","PlayRenderer","view","_$createComponent","spec","registry"],"sources":["../src/PlayRenderer.tsx"],"sourcesContent":["/**\n * PlayRenderer - the leaf component without props of the XMachines Play SolidJS architecture.\n *\n * It reads the view context of the ActorProvider around it, or of the\n * PlayUIProvider, with usePlayView(). It then renders the spec with the Renderer of\n * @xmachines/json-render-solid.\n *\n * The standard use:\n * ```tsx\n * <PlayUIProvider actor={myActor} registryResult={registryResult}>\n * <PlayRenderer />\n * </PlayUIProvider>\n * ```\n *\n * @packageDocumentation\n */\n\nimport type { Component } from \"solid-js\";\nimport { Renderer } from \"@xmachines/json-render-solid\";\nimport { usePlayView } from \"./ActorProvider.js\";\n\n/**\n * The leaf renderer without props. Put it inside an ActorProvider tree or a\n * PlayUIProvider tree.\n *\n * It reads the ViewContextValue (the spec, the handlers, and the registry) of the\n * provider around it, with usePlayView(). It then renders the spec with the Renderer\n * of @xmachines/json-render-solid.\n */\nexport const PlayRenderer: Component = () => {\n\tconst view = usePlayView();\n\treturn <Renderer spec={view.spec} registry={view.registry} />;\n};\n"],"mappings":";;;;;;;;;;;;AA6BA,IAAaG,qBAAgC;CAC5C,MAAMC,OAAOF,YAAY;CACzB,OAAAG,gBAAQJ,UAAQ;EAAA,IAACK,OAAI;GAAA,OAAEF,KAAKE;EAAI;EAAA,IAAEC,WAAQ;GAAA,OAAEH,KAAKG;EAAQ;CAAA,CAAA;AAC1D"}
|
package/dist/PlayUIProvider.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* PlayUIProvider —
|
|
2
|
+
* PlayUIProvider — the composite SolidJS provider of XMachines Play.
|
|
3
3
|
*
|
|
4
|
-
*
|
|
4
|
+
* It wraps ActorProvider and JSONUIProvider into one composite provider.
|
|
5
5
|
* This is the recommended entry point for most users.
|
|
6
6
|
*
|
|
7
|
-
*
|
|
7
|
+
* The standard use:
|
|
8
8
|
* ```tsx
|
|
9
9
|
* import { PlayUIProvider, PlayRenderer, defineRegistry } from "@xmachines/play-solid";
|
|
10
10
|
*
|
|
@@ -15,7 +15,8 @@
|
|
|
15
15
|
* </PlayUIProvider>
|
|
16
16
|
* ```
|
|
17
17
|
*
|
|
18
|
-
* For
|
|
18
|
+
* For the complete control, which the author of a library needs, use ActorProvider
|
|
19
|
+
* directly.
|
|
19
20
|
*
|
|
20
21
|
* @packageDocumentation
|
|
21
22
|
*/
|
|
@@ -24,18 +25,18 @@ import { type JSONUIProviderProps } from "@xmachines/json-render-solid";
|
|
|
24
25
|
import { type ActorProviderProps } from "./ActorProvider.js";
|
|
25
26
|
type JSONUIForwardedProps = Pick<JSONUIProviderProps, "validationFunctions" | "navigate" | "functions">;
|
|
26
27
|
/**
|
|
27
|
-
*
|
|
28
|
+
* The props of PlayUIProvider — every ActorProvider prop, and also the props that it forwards to JSONUIProvider.
|
|
28
29
|
*/
|
|
29
30
|
export interface PlayUIProviderProps extends ActorProviderProps, Partial<JSONUIForwardedProps> {
|
|
30
31
|
}
|
|
31
32
|
/**
|
|
32
|
-
*
|
|
33
|
+
* The composite provider: ActorProvider and JSONUIProvider.
|
|
33
34
|
*
|
|
34
|
-
*
|
|
35
|
-
* - ActorContext
|
|
36
|
-
* - ViewContext
|
|
37
|
-
* - StateProvider
|
|
38
|
-
* - ConfirmDialogManager
|
|
35
|
+
* It gives you the complete stack of the JSON render context:
|
|
36
|
+
* - ActorContext, which holds the actor instance, through ActorProvider
|
|
37
|
+
* - ViewContext, which holds the spec, the handlers, and the registry, through ActorProvider
|
|
38
|
+
* - StateProvider, ActionProvider, VisibilityProvider, and ValidationProvider, through JSONUIProvider
|
|
39
|
+
* - ConfirmDialogManager, through JSONUIProvider
|
|
39
40
|
*
|
|
40
41
|
* @example
|
|
41
42
|
* ```tsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlayUIProvider.d.ts","sourceRoot":"","sources":["../src/PlayUIProvider.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"PlayUIProvider.d.ts","sourceRoot":"","sources":["../src/PlayUIProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAO,MAAM,UAAU,CAAC;AAC/C,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxF,OAAO,EAA8B,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAGzF,KAAK,oBAAoB,GAAG,IAAI,CAC/B,mBAAmB,EACnB,qBAAqB,GAAG,UAAU,GAAG,WAAW,CAChD,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB,EAAE,OAAO,CAAC,oBAAoB,CAAC;CAAG;AA+BjG;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,cAAc,EAAE,SAAS,CAAC,mBAAmB,CAqBzD,CAAC"}
|
package/dist/PlayUIProvider.js
CHANGED
|
@@ -3,11 +3,12 @@ import { createComponent, mergeProps } from "solid-js/web";
|
|
|
3
3
|
import { JSONUIProvider } from "@xmachines/json-render-solid";
|
|
4
4
|
//#region packages/play-solid/src/PlayUIProvider.tsx
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
* context and
|
|
6
|
+
* The inner bridge component. Put it inside the tree of ActorProvider, so that
|
|
7
|
+
* usePlayView() can read the resolved ViewContextValue. It reads the handlers and the
|
|
8
|
+
* registry of the view context, and it gives them to JSONUIProvider.
|
|
9
9
|
*
|
|
10
|
-
*
|
|
10
|
+
* The React implementation uses the same bridge pattern, in JSONUIBridge of
|
|
11
|
+
* play-react.
|
|
11
12
|
*/
|
|
12
13
|
var JSONUIBridge = (bridgeProps) => {
|
|
13
14
|
const view = usePlayView();
|
|
@@ -26,13 +27,13 @@ var JSONUIBridge = (bridgeProps) => {
|
|
|
26
27
|
} }));
|
|
27
28
|
};
|
|
28
29
|
/**
|
|
29
|
-
*
|
|
30
|
+
* The composite provider: ActorProvider and JSONUIProvider.
|
|
30
31
|
*
|
|
31
|
-
*
|
|
32
|
-
* - ActorContext
|
|
33
|
-
* - ViewContext
|
|
34
|
-
* - StateProvider
|
|
35
|
-
* - ConfirmDialogManager
|
|
32
|
+
* It gives you the complete stack of the JSON render context:
|
|
33
|
+
* - ActorContext, which holds the actor instance, through ActorProvider
|
|
34
|
+
* - ViewContext, which holds the spec, the handlers, and the registry, through ActorProvider
|
|
35
|
+
* - StateProvider, ActionProvider, VisibilityProvider, and ValidationProvider, through JSONUIProvider
|
|
36
|
+
* - ConfirmDialogManager, through JSONUIProvider
|
|
36
37
|
*
|
|
37
38
|
* @example
|
|
38
39
|
* ```tsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlayUIProvider.js","names":["Component","JSX","JSONUIProvider","JSONUIProviderProps","ActorProvider","usePlayView","ActorProviderProps","JSONUIForwardedProps","Pick","PlayUIProviderProps","Partial","JSONUIBridge","children","Element","bridgeProps","view","_$createComponent","_$mergeProps","registry","handlers","store","validationFunctions","undefined","navigate","functions","PlayUIProvider","props","actor","registryResult","fallback","onError","onRenderError"],"sources":["../src/PlayUIProvider.tsx"],"sourcesContent":["/**\n * PlayUIProvider —
|
|
1
|
+
{"version":3,"file":"PlayUIProvider.js","names":["Component","JSX","JSONUIProvider","JSONUIProviderProps","ActorProvider","usePlayView","ActorProviderProps","JSONUIForwardedProps","Pick","PlayUIProviderProps","Partial","JSONUIBridge","children","Element","bridgeProps","view","_$createComponent","_$mergeProps","registry","handlers","store","validationFunctions","undefined","navigate","functions","PlayUIProvider","props","actor","registryResult","fallback","onError","onRenderError"],"sources":["../src/PlayUIProvider.tsx"],"sourcesContent":["/**\n * PlayUIProvider — the composite SolidJS provider of XMachines Play.\n *\n * It wraps ActorProvider and JSONUIProvider into one composite provider.\n * This is the recommended entry point for most users.\n *\n * The standard use:\n * ```tsx\n * import { PlayUIProvider, PlayRenderer, defineRegistry } from \"@xmachines/play-solid\";\n *\n * const registryResult = defineRegistry(myCatalog, { components, actions });\n *\n * <PlayUIProvider actor={myActor} registryResult={registryResult}>\n * <PlayRenderer />\n * </PlayUIProvider>\n * ```\n *\n * For the complete control, which the author of a library needs, use ActorProvider\n * directly.\n *\n * @packageDocumentation\n */\n\nimport type { Component, JSX } from \"solid-js\";\nimport { JSONUIProvider, type JSONUIProviderProps } from \"@xmachines/json-render-solid\";\nimport { ActorProvider, usePlayView, type ActorProviderProps } from \"./ActorProvider.js\";\n\n// Take only the forwarded props of JSONUIProviderProps (D-16)\ntype JSONUIForwardedProps = Pick<\n\tJSONUIProviderProps,\n\t\"validationFunctions\" | \"navigate\" | \"functions\"\n>;\n\n/**\n * The props of PlayUIProvider — every ActorProvider prop, and also the props that it forwards to JSONUIProvider.\n */\nexport interface PlayUIProviderProps extends ActorProviderProps, Partial<JSONUIForwardedProps> {}\n\n/**\n * The inner bridge component. Put it inside the tree of ActorProvider, so that\n * usePlayView() can read the resolved ViewContextValue. It reads the handlers and the\n * registry of the view context, and it gives them to JSONUIProvider.\n *\n * The React implementation uses the same bridge pattern, in JSONUIBridge of\n * play-react.\n */\nconst JSONUIBridge: Component<Partial<JSONUIForwardedProps> & { children: JSX.Element }> = (\n\tbridgeProps,\n) => {\n\tconst view = usePlayView();\n\n\treturn (\n\t\t<JSONUIProvider\n\t\t\tregistry={view.registry}\n\t\t\thandlers={view.handlers}\n\t\t\tstore={view.store}\n\t\t\t{...(bridgeProps.validationFunctions !== undefined && {\n\t\t\t\tvalidationFunctions: bridgeProps.validationFunctions,\n\t\t\t})}\n\t\t\t{...(bridgeProps.navigate !== undefined && { navigate: bridgeProps.navigate })}\n\t\t\t{...(bridgeProps.functions !== undefined && { functions: bridgeProps.functions })}\n\t\t>\n\t\t\t{bridgeProps.children}\n\t\t</JSONUIProvider>\n\t);\n};\n\n/**\n * The composite provider: ActorProvider and JSONUIProvider.\n *\n * It gives you the complete stack of the JSON render context:\n * - ActorContext, which holds the actor instance, through ActorProvider\n * - ViewContext, which holds the spec, the handlers, and the registry, through ActorProvider\n * - StateProvider, ActionProvider, VisibilityProvider, and ValidationProvider, through JSONUIProvider\n * - ConfirmDialogManager, through JSONUIProvider\n *\n * @example\n * ```tsx\n * <PlayUIProvider actor={myActor} registryResult={registryResult} navigate={navigate}>\n * <PlayRenderer />\n * </PlayUIProvider>\n * ```\n */\nexport const PlayUIProvider: Component<PlayUIProviderProps> = (props) => {\n\treturn (\n\t\t<ActorProvider\n\t\t\tactor={props.actor}\n\t\t\tregistryResult={props.registryResult}\n\t\t\t{...(props.store !== undefined && { store: props.store })}\n\t\t\t{...(props.fallback !== undefined && { fallback: props.fallback })}\n\t\t\t{...(props.onError !== undefined && { onError: props.onError })}\n\t\t\t{...(props.onRenderError !== undefined && { onRenderError: props.onRenderError })}\n\t\t>\n\t\t\t<JSONUIBridge\n\t\t\t\t{...(props.validationFunctions !== undefined && {\n\t\t\t\t\tvalidationFunctions: props.validationFunctions,\n\t\t\t\t})}\n\t\t\t\t{...(props.navigate !== undefined && { navigate: props.navigate })}\n\t\t\t\t{...(props.functions !== undefined && { functions: props.functions })}\n\t\t\t>\n\t\t\t\t{props.children}\n\t\t\t</JSONUIBridge>\n\t\t</ActorProvider>\n\t);\n};\n"],"mappings":";;;;;;;;;;;;AA8CA,IAAMW,gBACLG,gBACI;CACJ,MAAMC,OAAOV,YAAY;CAEzB,OAAAW,gBACEd,gBAAce,WAAA;EAAA,IACdC,WAAQ;GAAA,OAAEH,KAAKG;EAAQ;EAAA,IACvBC,WAAQ;GAAA,OAAEJ,KAAKI;EAAQ;EAAA,IACvBC,QAAK;GAAA,OAAEL,KAAKK;EAAK;CAAA,SACZN,YAAYO,wBAAwBC,KAAAA,KAAa,EACrDD,qBAAqBP,YAAYO,oBAClC,SACKP,YAAYS,aAAaD,KAAAA,KAAa,EAAEC,UAAUT,YAAYS,SAAS,SACvET,YAAYU,cAAcF,KAAAA,KAAa,EAAEE,WAAWV,YAAYU,UAAU,GAAC,EAAA,IAAAZ,WAAA;EAAA,OAE/EE,YAAYF;CAAQ,EAAA,CAAA,CAAA;AAGxB;;;;;;;;;;;;;;;;;AAkBA,IAAaa,kBAAkDC,UAAU;CACxE,OAAAV,gBACEZ,eAAaa,WAAA;EAAA,IACbU,QAAK;GAAA,OAAED,MAAMC;EAAK;EAAA,IAClBC,iBAAc;GAAA,OAAEF,MAAME;EAAc;CAAA,SAC/BF,MAAMN,UAAUE,KAAAA,KAAa,EAAEF,OAAOM,MAAMN,MAAM,SAClDM,MAAMG,aAAaP,KAAAA,KAAa,EAAEO,UAAUH,MAAMG,SAAS,SAC3DH,MAAMI,YAAYR,KAAAA,KAAa,EAAEQ,SAASJ,MAAMI,QAAQ,SACxDJ,MAAMK,kBAAkBT,KAAAA,KAAa,EAAES,eAAeL,MAAMK,cAAc,GAAC,EAAA,IAAAnB,WAAA;EAAA,OAAAI,gBAE/EL,cAAYM,iBACPS,MAAML,wBAAwBC,KAAAA,KAAa,EAC/CD,qBAAqBK,MAAML,oBAC5B,SACKK,MAAMH,aAAaD,KAAAA,KAAa,EAAEC,UAAUG,MAAMH,SAAS,SAC3DG,MAAMF,cAAcF,KAAAA,KAAa,EAAEE,WAAWE,MAAMF,UAAU,GAAC,EAAA,IAAAZ,WAAA;GAAA,OAEnEc,MAAMd;EAAQ,EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAInB"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @xmachines/play-solid - SolidJS renderer for XMachines Play architecture
|
|
2
|
+
* @xmachines/play-solid - SolidJS renderer for the XMachines Play architecture
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
* renders UI components
|
|
6
|
-
*
|
|
4
|
+
* This package is the SolidJS rendering layer. It observes the actor signals and
|
|
5
|
+
* renders the UI components through @xmachines/json-render-solid. SolidJS
|
|
6
|
+
* reactivity only triggers the re-render. The signals are the source of truth.
|
|
7
7
|
*
|
|
8
8
|
* Primary entry point:
|
|
9
9
|
* ```tsx
|
|
10
10
|
* import { PlayUIProvider, PlayRenderer, defineRegistry } from "@xmachines/play-solid";
|
|
11
11
|
* ```
|
|
12
12
|
*
|
|
13
|
-
* For
|
|
13
|
+
* For a custom provider composition:
|
|
14
14
|
* ```tsx
|
|
15
15
|
* import { ActorProvider, ActorContext, usePlayView } from "@xmachines/play-solid";
|
|
16
16
|
* ```
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAGH,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAGH,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAKrD,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAOvD,OAAO,EAEN,cAAc,EACd,aAAa,EACb,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAElB,QAAQ,EAER,cAAc,EACd,YAAY,EACZ,eAAe,EACf,aAAa,EACb,aAAa,EACb,UAAU,EACV,SAAS,EACT,YAAY,EACZ,kBAAkB,EAClB,qBAAqB,EACrB,aAAa,GACb,MAAM,8BAA8B,CAAC;AAGtC,YAAY,EACX,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,EACnB,uBAAuB,EACvB,uBAAuB,EACvB,aAAa,EACb,WAAW,EACX,gBAAgB,EAChB,iBAAiB,EACjB,oBAAoB,EACpB,QAAQ,GACR,MAAM,8BAA8B,CAAC;AACtC,YAAY,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAGvE,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC5F,YAAY,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* TypeScript type definitions
|
|
2
|
+
* The TypeScript type definitions of play-solid
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
4
|
+
* This file re-exports the primary prop types from their own source files.
|
|
5
|
+
* D-06 removed PlayRendererProps. Use ActorProviderProps or PlayUIProviderProps.
|
|
6
6
|
*
|
|
7
7
|
* @packageDocumentation
|
|
8
8
|
*/
|
package/dist/useActor.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* useActor — SolidJS hook
|
|
2
|
+
* useActor — the SolidJS hook that gives the raw actor inside an ActorProvider tree.
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
4
|
+
* A component inside ActorProvider, or inside PlayUIProvider, calls useActor() to
|
|
5
|
+
* get the actor instance directly. The actor is then not necessary as a prop.
|
|
6
6
|
*
|
|
7
|
-
* @throws {Error}
|
|
7
|
+
* @throws {Error} When the caller is outside an ActorProvider tree
|
|
8
8
|
*
|
|
9
9
|
* @example
|
|
10
10
|
* ```typescript
|
|
@@ -20,12 +20,15 @@
|
|
|
20
20
|
*/
|
|
21
21
|
import type { AbstractActor } from "@xmachines/play-actor";
|
|
22
22
|
import type { AnyActorLogic } from "xstate";
|
|
23
|
-
/**
|
|
23
|
+
/**
|
|
24
|
+
* The bare actor type that the Solid context providers accept. For the complete routing and view shape, use `PlayActor` from `@xmachines/play-router`.
|
|
25
|
+
*/
|
|
24
26
|
export type AnyPlayActor = AbstractActor<AnyActorLogic>;
|
|
25
27
|
/**
|
|
26
|
-
* SolidJS context
|
|
27
|
-
* directly
|
|
28
|
-
* the name "ActorProvider" and is the recommended
|
|
28
|
+
* The SolidJS context of the actor. This package exports it, so that a consumer
|
|
29
|
+
* can use ActorContext.Provider directly for a custom composition (see D-11). The
|
|
30
|
+
* ActorProvider component has the name "ActorProvider", and it is the recommended
|
|
31
|
+
* entry point.
|
|
29
32
|
*/
|
|
30
33
|
export declare const ActorContext: import("solid-js").Context<AnyPlayActor | null>;
|
|
31
34
|
export declare function useActor(): AnyPlayActor;
|
package/dist/useActor.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useActor.d.ts","sourceRoot":"","sources":["../src/useActor.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAIH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAE5C
|
|
1
|
+
{"version":3,"file":"useActor.d.ts","sourceRoot":"","sources":["../src/useActor.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAIH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAE5C;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,aAAa,CAAC,aAAa,CAAC,CAAC;AAExD;;;;;GAKG;AACH,eAAO,MAAM,YAAY,iDAA2C,CAAC;AAErE,wBAAgB,QAAQ,IAAI,YAAY,CAEvC"}
|
package/dist/useActor.js
CHANGED
|
@@ -2,12 +2,12 @@ import { createContext, useContext } from "solid-js";
|
|
|
2
2
|
import { assertNonNullable } from "@xmachines/play";
|
|
3
3
|
//#region packages/play-solid/src/useActor.ts
|
|
4
4
|
/**
|
|
5
|
-
* useActor — SolidJS hook
|
|
5
|
+
* useActor — the SolidJS hook that gives the raw actor inside an ActorProvider tree.
|
|
6
6
|
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
7
|
+
* A component inside ActorProvider, or inside PlayUIProvider, calls useActor() to
|
|
8
|
+
* get the actor instance directly. The actor is then not necessary as a prop.
|
|
9
9
|
*
|
|
10
|
-
* @throws {Error}
|
|
10
|
+
* @throws {Error} When the caller is outside an ActorProvider tree
|
|
11
11
|
*
|
|
12
12
|
* @example
|
|
13
13
|
* ```typescript
|
|
@@ -22,9 +22,10 @@ import { assertNonNullable } from "@xmachines/play";
|
|
|
22
22
|
* @packageDocumentation
|
|
23
23
|
*/
|
|
24
24
|
/**
|
|
25
|
-
* SolidJS context
|
|
26
|
-
* directly
|
|
27
|
-
* the name "ActorProvider" and is the recommended
|
|
25
|
+
* The SolidJS context of the actor. This package exports it, so that a consumer
|
|
26
|
+
* can use ActorContext.Provider directly for a custom composition (see D-11). The
|
|
27
|
+
* ActorProvider component has the name "ActorProvider", and it is the recommended
|
|
28
|
+
* entry point.
|
|
28
29
|
*/
|
|
29
30
|
var ActorContext = createContext(null);
|
|
30
31
|
function useActor() {
|
package/dist/useActor.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useActor.js","names":[],"sources":["../src/useActor.ts"],"sourcesContent":["/**\n * useActor — SolidJS hook
|
|
1
|
+
{"version":3,"file":"useActor.js","names":[],"sources":["../src/useActor.ts"],"sourcesContent":["/**\n * useActor — the SolidJS hook that gives the raw actor inside an ActorProvider tree.\n *\n * A component inside ActorProvider, or inside PlayUIProvider, calls useActor() to\n * get the actor instance directly. The actor is then not necessary as a prop.\n *\n * @throws {Error} When the caller is outside an ActorProvider tree\n *\n * @example\n * ```typescript\n * import { useActor } from \"@xmachines/play-solid\";\n *\n * function MyComponent() {\n * const actor = useActor();\n * return <button onClick={() => actor.send({ type: \"SUBMIT\" })}>Submit</button>;\n * }\n * ```\n *\n * @packageDocumentation\n */\n\nimport { createContext, useContext } from \"solid-js\";\nimport { assertNonNullable } from \"@xmachines/play\";\nimport type { AbstractActor } from \"@xmachines/play-actor\";\nimport type { AnyActorLogic } from \"xstate\";\n\n/**\n * The bare actor type that the Solid context providers accept. For the complete routing and view shape, use `PlayActor` from `@xmachines/play-router`.\n */\nexport type AnyPlayActor = AbstractActor<AnyActorLogic>;\n\n/**\n * The SolidJS context of the actor. This package exports it, so that a consumer\n * can use ActorContext.Provider directly for a custom composition (see D-11). The\n * ActorProvider component has the name \"ActorProvider\", and it is the recommended\n * entry point.\n */\nexport const ActorContext = createContext<AnyPlayActor | null>(null);\n\nexport function useActor(): AnyPlayActor {\n\treturn assertNonNullable(useContext(ActorContext), \"ActorContext\");\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,IAAa,eAAe,cAAmC,IAAI;AAEnE,SAAgB,WAAyB;CACxC,OAAO,kBAAkB,WAAW,YAAY,GAAG,cAAc;AAClE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xmachines/play-solid",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.1.1",
|
|
4
4
|
"description": "Solid renderer for XMachines Play architecture",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"catalog",
|
|
@@ -42,13 +42,14 @@
|
|
|
42
42
|
"lint": "oxlint .",
|
|
43
43
|
"format": "oxfmt .",
|
|
44
44
|
"test": "vitest",
|
|
45
|
+
"test:coverage": "vitest run --coverage",
|
|
45
46
|
"test:watch": "vitest",
|
|
46
47
|
"test:ui": "vitest --ui"
|
|
47
48
|
},
|
|
48
49
|
"dependencies": {
|
|
49
|
-
"@xmachines/play": "2.
|
|
50
|
-
"@xmachines/play-actor": "2.
|
|
51
|
-
"@xmachines/play-signals": "2.
|
|
50
|
+
"@xmachines/play": "2.1.1",
|
|
51
|
+
"@xmachines/play-actor": "2.1.1",
|
|
52
|
+
"@xmachines/play-signals": "2.1.1"
|
|
52
53
|
},
|
|
53
54
|
"devDependencies": {
|
|
54
55
|
"@solidjs/testing-library": "^0.8.10",
|