@xmachines/play-solid 1.1.0 → 2.0.0

package/README.md

@@ -2,8 +2,7 @@
 
 > Solid renderer for XMachines Play architecture
 
-[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![Version](https://img.shields.io/badge/version-1.1.0-blue)](https://www.npmjs.com/package/@xmachines/play-solid)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![Version](https://img.shields.io/badge/version-2.0.0-blue)](https://www.npmjs.com/package/@xmachines/play-solid)
 
 SolidJS rendering layer that passively observes actor signals and renders UI components via `@xmachines/json-render-solid`. SolidJS reactivity is used solely to trigger re-renders — TC39 Signals are the source of truth.
 

package/dist/ActorProvider.js

@@ -0,0 +1,156 @@
+import { ActorContext } from "./useActor.js";
+import { createComponent } from "solid-js/web";
+import { StateProvider, useStateStore } from "@xmachines/json-render-solid";
+import { ErrorBoundary, createContext, createEffect, createMemo, createSignal, onCleanup, useContext } from "solid-js";
+import { createAtom } from "@xstate/store";
+import { xstateStoreStateStore } from "@xmachines/json-render-xstate";
+import { watchSignal } from "@xmachines/play-signals";
+import { assertNonNullable } from "@xmachines/play";
+import { attachRenderErrorHandler, createViewStoreLifecycle } from "@xmachines/play-actor";
+//#region packages/play-solid/src/ActorProvider.tsx
+/**
+* ActorProvider — Smart SolidJS provider component for the XMachines Play actor lifecycle.
+*
+* Escape hatch primitive for library authors who need direct control. Most users should
+* use PlayUIProvider (batteries-included composite) instead.
+*
+* This component:
+* - Subscribes to actor.currentView signal via watchSignal (in component body per Phase 29)
+* - Manages per-view StateStore lifecycle (controlled/uncontrolled)
+* - Resolves action handlers via inner component pattern (inside StateProvider)
+* - Injects onRenderError into registry if provided
+* - Provides ActorContext (actor) and ViewContext (spec + handlers + registry) to children
+* - Wraps render path in SolidJS ErrorBoundary
+*
+* Per D-11: The old `ActorProvider = ActorContext.Provider` alias is removed. This new smart
+* component takes the name. Use `ActorContext.Provider` directly for escape-hatch access.
+*
+* @packageDocumentation
+*/
+var ViewContext = createContext(null);
+/**
+* Hook to access the current view context inside an ActorProvider tree.
+*
+* @throws {Error} If called outside an ActorProvider (or PlayUIProvider) tree
+*
+* @example
+* ```tsx
+* import { usePlayView } from "@xmachines/play-solid";
+*
+* const MyRenderer: Component = () => {
+*   const view = usePlayView();
+*   return <Renderer spec={view.spec} registry={view.registry} />;
+* };
+* ```
+*/
+function usePlayView() {
+	return assertNonNullable(useContext(ViewContext), "ViewContext");
+}
+/**
+* Inner component that runs inside StateProvider so it can call useStateStore()
+* to get live set/getSnapshot for handler resolution.
+*/
+var ActorProviderInner = (innerProps) => {
+	const stateCtx = useStateStore();
+	const setStateAdapter = (updater) => {
+		const prev = stateCtx.getSnapshot();
+		stateCtx.update(updater(prev));
+	};
+	const handlers = innerProps.registryResult.handlers(() => setStateAdapter, () => stateCtx.getSnapshot());
+	const viewValue = {
+		spec: innerProps.spec,
+		handlers,
+		registry: innerProps.registryResult.registry,
+		store: innerProps.store
+	};
+	return createComponent(ViewContext.Provider, {
+		value: viewValue,
+		get children() {
+			return innerProps.children;
+		}
+	});
+};
+/**
+* Smart ActorProvider component — owns actor bridging, signal subscription,
+* StateStore lifecycle, handler resolution, and error boundary.
+*
+* Per D-11: Replaces the old raw alias `ActorProvider = ActorContext.Provider`.
+* Consumers who previously used `<ActorProvider value={actor}>` should now use
+* `<ActorContext.Provider value={actor}>` for raw provider access, or migrate to
+* this smart component / PlayUIProvider.
+*
+* @example
+* ```tsx
+* import { ActorProvider, PlayRenderer } from "@xmachines/play-solid";
+*
+* <ActorProvider actor={myActor} registryResult={registryResult}>
+*   <PlayRenderer />
+* </ActorProvider>
+* ```
+*/
+var ActorProvider = (props) => {
+	const [view, setView] = createSignal(null);
+	const actorProxy = new Proxy({}, {
+		get(_target, prop) {
+			const current = props.actor;
+			const value = Reflect.get(current, prop, current);
+			return typeof value === "function" ? value.bind(current) : value;
+		},
+		has(_target, prop) {
+			return prop in props.actor;
+		}
+	});
+	const resolvedRegistryResult = createMemo(() => {
+		if (!props.onRenderError) return props.registryResult;
+		return {
+			...props.registryResult,
+			registry: attachRenderErrorHandler(props.registryResult.registry, props.onRenderError)
+		};
+	});
+	const storeLifecycle = createViewStoreLifecycle((seed) => xstateStoreStateStore({ atom: createAtom(seed) }));
+	createEffect(() => {
+		const update = (nextView) => setView(nextView);
+		update(props.actor.currentView.get());
+		const unwatch = watchSignal(props.actor.currentView, (nextView) => {
+			update(nextView);
+		});
+		onCleanup(() => unwatch());
+	});
+	return createComponent(ActorContext.Provider, {
+		value: actorProxy,
+		get children() {
+			return createComponent(ErrorBoundary, {
+				fallback: (err) => {
+					props.onError?.(err);
+					return props.fallback ?? null;
+				},
+				get children() {
+					return (() => {
+						const currentView = view();
+						if (!currentView) return props.fallback ?? null;
+						const store = storeLifecycle.resolve(props.actor, currentView, props.store).guardedStore;
+						return createComponent(StateProvider, {
+							store,
+							get children() {
+								return createComponent(ActorProviderInner, {
+									get registryResult() {
+										return resolvedRegistryResult();
+									},
+									spec: currentView,
+									store,
+									get children() {
+										return props.children;
+									}
+								});
+							}
+						});
+					})();
+				}
+			});
+		}
+	});
+};
+//#endregion
+export { ActorProvider, usePlayView };
+
+//# sourceMappingURL=ActorProvider.js.map

package/dist/ActorProvider.js.map

@@ -0,0 +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"}

package/dist/PlayRenderer.js

@@ -0,0 +1,25 @@
+import { usePlayView } from "./ActorProvider.js";
+import { createComponent } from "solid-js/web";
+import { Renderer } from "@xmachines/json-render-solid";
+//#region packages/play-solid/src/PlayRenderer.tsx
+/**
+* Zero-prop leaf renderer. Must be placed inside an ActorProvider or PlayUIProvider tree.
+*
+* Reads ViewContextValue (spec, handlers, registry) from the enclosing provider
+* via usePlayView() and renders the spec via @xmachines/json-render-solid's Renderer.
+*/
+var PlayRenderer = () => {
+	const view = usePlayView();
+	return createComponent(Renderer, {
+		get spec() {
+			return view.spec;
+		},
+		get registry() {
+			return view.registry;
+		}
+	});
+};
+//#endregion
+export { PlayRenderer };
+
+//# sourceMappingURL=PlayRenderer.js.map

package/dist/PlayRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlayRenderer.js","names":["Component","Renderer","usePlayView","PlayRenderer","view","_$createComponent","spec","registry"],"sources":["../src/PlayRenderer.tsx"],"sourcesContent":["/**\n * PlayRenderer - Zero-prop leaf component for XMachines Play SolidJS architecture.\n *\n * Reads view context from the enclosing ActorProvider (or PlayUIProvider) via\n * usePlayView() and renders the spec using @xmachines/json-render-solid's Renderer.\n *\n * Standard usage:\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 * Zero-prop leaf renderer. Must be placed inside an ActorProvider or PlayUIProvider tree.\n *\n * Reads ViewContextValue (spec, handlers, registry) from the enclosing provider\n * via usePlayView() and renders the spec via @xmachines/json-render-solid's Renderer.\n */\nexport const PlayRenderer: Component = () => {\n\tconst view = usePlayView();\n\treturn <Renderer spec={view.spec} registry={view.registry} />;\n};\n"],"mappings":";;;;;;;;;;AA0BA,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.js

@@ -0,0 +1,61 @@
+import { ActorProvider, usePlayView } from "./ActorProvider.js";
+import { createComponent, mergeProps } from "solid-js/web";
+import { JSONUIProvider } from "@xmachines/json-render-solid";
+//#region packages/play-solid/src/PlayUIProvider.tsx
+/**
+* Inner bridge component — must be inside ActorProvider's tree so usePlayView() has
+* access to the resolved ViewContextValue. Reads handlers and registry from the view
+* context and passes them to JSONUIProvider.
+*
+* This bridge pattern mirrors the React implementation (JSONUIBridge in play-react).
+*/
+var JSONUIBridge = (bridgeProps) => {
+	const view = usePlayView();
+	return createComponent(JSONUIProvider, mergeProps({
+		get registry() {
+			return view.registry;
+		},
+		get handlers() {
+			return view.handlers;
+		},
+		get store() {
+			return view.store;
+		}
+	}, () => bridgeProps.validationFunctions !== void 0 && { validationFunctions: bridgeProps.validationFunctions }, () => bridgeProps.navigate !== void 0 && { navigate: bridgeProps.navigate }, () => bridgeProps.functions !== void 0 && { functions: bridgeProps.functions }, { get children() {
+		return bridgeProps.children;
+	} }));
+};
+/**
+* Batteries-included composite provider: ActorProvider + JSONUIProvider.
+*
+* Provides the full JSON render context stack:
+* - ActorContext (actor instance via ActorProvider)
+* - ViewContext (spec, handlers, registry via ActorProvider)
+* - StateProvider + ActionProvider + VisibilityProvider + ValidationProvider (via JSONUIProvider)
+* - ConfirmDialogManager (via JSONUIProvider)
+*
+* @example
+* ```tsx
+* <PlayUIProvider actor={myActor} registryResult={registryResult} navigate={navigate}>
+*   <PlayRenderer />
+* </PlayUIProvider>
+* ```
+*/
+var PlayUIProvider = (props) => {
+	return createComponent(ActorProvider, mergeProps({
+		get actor() {
+			return props.actor;
+		},
+		get registryResult() {
+			return props.registryResult;
+		}
+	}, () => props.store !== void 0 && { store: props.store }, () => props.fallback !== void 0 && { fallback: props.fallback }, () => props.onError !== void 0 && { onError: props.onError }, () => props.onRenderError !== void 0 && { onRenderError: props.onRenderError }, { get children() {
+		return createComponent(JSONUIBridge, mergeProps(() => props.validationFunctions !== void 0 && { validationFunctions: props.validationFunctions }, () => props.navigate !== void 0 && { navigate: props.navigate }, () => props.functions !== void 0 && { functions: props.functions }, { get children() {
+			return props.children;
+		} }));
+	} }));
+};
+//#endregion
+export { PlayUIProvider };
+
+//# sourceMappingURL=PlayUIProvider.js.map

package/dist/PlayUIProvider.js.map

@@ -0,0 +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 — Batteries-included SolidJS provider for XMachines Play.\n *\n * Wraps ActorProvider + JSONUIProvider into a single composite provider.\n * This is the recommended entry point for most users.\n *\n * Standard usage:\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 full control (library authors), use ActorProvider 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// Pick only the forwarded props from JSONUIProviderProps (per D-16)\ntype JSONUIForwardedProps = Pick<\n\tJSONUIProviderProps,\n\t\"validationFunctions\" | \"navigate\" | \"functions\"\n>;\n\n/**\n * Props for PlayUIProvider — all ActorProvider props plus JSONUIProvider's forwarded props.\n */\nexport interface PlayUIProviderProps extends ActorProviderProps, Partial<JSONUIForwardedProps> {}\n\n/**\n * Inner bridge component — must be inside ActorProvider's tree so usePlayView() has\n * access to the resolved ViewContextValue. Reads handlers and registry from the view\n * context and passes them to JSONUIProvider.\n *\n * This bridge pattern mirrors the React implementation (JSONUIBridge in 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 * Batteries-included composite provider: ActorProvider + JSONUIProvider.\n *\n * Provides the full JSON render context stack:\n * - ActorContext (actor instance via ActorProvider)\n * - ViewContext (spec, handlers, registry via ActorProvider)\n * - StateProvider + ActionProvider + VisibilityProvider + ValidationProvider (via JSONUIProvider)\n * - ConfirmDialogManager (via 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":";;;;;;;;;;;AA4CA,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.js

@@ -0,0 +1,6 @@
+import { ActorContext, useActor } from "./useActor.js";
+import { ActorProvider, usePlayView } from "./ActorProvider.js";
+import { PlayRenderer } from "./PlayRenderer.js";
+import { PlayUIProvider } from "./PlayUIProvider.js";
+import { ActionProvider, JSONUIProvider, Renderer, StateProvider, ValidationProvider, VisibilityProvider, defineRegistry, useAction, useActions, useBoundProp, useFieldValidation, useIsVisible, useOptionalValidation, useStateBinding, useStateStore, useStateValue, useVisibility } from "@xmachines/json-render-solid";
+export { ActionProvider, ActorContext, ActorProvider, JSONUIProvider, PlayRenderer, PlayUIProvider, Renderer, StateProvider, ValidationProvider, VisibilityProvider, defineRegistry, useAction, useActions, useActor, useBoundProp, useFieldValidation, useIsVisible, useOptionalValidation, usePlayView, useStateBinding, useStateStore, useStateValue, useVisibility };

package/dist/useActor.js

@@ -0,0 +1,36 @@
+import { createContext, useContext } from "solid-js";
+import { assertNonNullable } from "@xmachines/play";
+//#region packages/play-solid/src/useActor.ts
+/**
+* useActor — SolidJS hook for accessing the raw actor inside an ActorProvider tree.
+*
+* Components rendered inside ActorProvider (or PlayUIProvider) can call useActor()
+* to get direct access to the actor instance without prop drilling.
+*
+* @throws {Error} If called outside an ActorProvider tree
+*
+* @example
+* ```typescript
+* import { useActor } from "@xmachines/play-solid";
+*
+* function MyComponent() {
+*   const actor = useActor();
+*   return <button onClick={() => actor.send({ type: "SUBMIT" })}>Submit</button>;
+* }
+* ```
+*
+* @packageDocumentation
+*/
+/**
+* SolidJS context for the actor — exported so consumers can use ActorContext.Provider
+* directly as an escape hatch (per D-11). The smart ActorProvider component takes
+* the name "ActorProvider" and is the recommended entry point.
+*/
+var ActorContext = createContext(null);
+function useActor() {
+	return assertNonNullable(useContext(ActorContext), "ActorContext");
+}
+//#endregion
+export { ActorContext, useActor };
+
+//# sourceMappingURL=useActor.js.map

package/dist/useActor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useActor.js","names":[],"sources":["../src/useActor.ts"],"sourcesContent":["/**\n * useActor — SolidJS hook for accessing the raw actor inside an ActorProvider tree.\n *\n * Components rendered inside ActorProvider (or PlayUIProvider) can call useActor()\n * to get direct access to the actor instance without prop drilling.\n *\n * @throws {Error} If called 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/** Bare actor type accepted by Solid context providers. For the full routing + view shape, use `PlayActor` from `@xmachines/play-router`. */\nexport type AnyPlayActor = AbstractActor<AnyActorLogic>;\n\n/**\n * SolidJS context for the actor — exported so consumers can use ActorContext.Provider\n * directly as an escape hatch (per D-11). The smart ActorProvider component takes\n * the name \"ActorProvider\" and is the recommended entry point.\n */\nexport const ActorContext = createContext<AnyPlayActor | null>(null);\n\nexport function useActor(): AnyPlayActor {\n\treturn assertNonNullable(useContext(ActorContext), \"ActorContext\");\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,IAAa,eAAe,cAAmC,IAAI;AAEnE,SAAgB,WAAyB;CACxC,OAAO,kBAAkB,WAAW,YAAY,GAAG,cAAc;AAClE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xmachines/play-solid",
-  "version": "1.1.0",
+  "version": "2.0.0",
   "description": "Solid renderer for XMachines Play architecture",
   "keywords": [
     "catalog",
@@ -14,7 +14,7 @@
   "author": "XMachines Contributors",
   "repository": {
     "type": "git",
-    "url": "git+ssh://git@gitlab.com/xmachin-es/xmachines-js.git",
+    "url": "git+https://gitlab.com/xmachin-es/xmachines-js.git",
     "directory": "packages/play-solid"
   },
   "files": [
@@ -24,11 +24,14 @@
   ],
   "type": "module",
   "sideEffects": false,
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
-    }
+    },
+    "./package.json": "./package.json"
   },
   "publishConfig": {
     "access": "public"
@@ -43,18 +46,18 @@
     "test:ui": "vitest --ui"
   },
   "dependencies": {
-    "@xmachines/play": "1.1.0",
-    "@xmachines/play-actor": "1.1.0",
-    "@xmachines/play-signals": "1.1.0"
+    "@xmachines/play": "2.0.0",
+    "@xmachines/play-actor": "2.0.0",
+    "@xmachines/play-signals": "2.0.0"
   },
   "devDependencies": {
     "@solidjs/testing-library": "^0.8.10",
     "@testing-library/jest-dom": "^6.9.1",
     "@types/node": "^26.2.0",
-    "@vitest/browser-playwright": "^4.1.10",
-    "@xmachines/json-render-core": "^0.19.0-xm.2",
-    "@xmachines/json-render-solid": "^0.19.0-xm.2",
-    "@xmachines/json-render-xstate": "^0.19.0-xm.2",
+    "@vitest/browser-playwright": "^4.1.11",
+    "@xmachines/json-render-core": "^0.20.0-xm.2",
+    "@xmachines/json-render-solid": "^0.20.0-xm.2",
+    "@xmachines/json-render-xstate": "^0.20.0-xm.2",
     "@xstate/store": "^3.17.0",
     "jsdom": "^29.1.0",
     "oxfmt": "^0.64.0",
@@ -68,9 +71,9 @@
     "zod": "^4.4.1"
   },
   "peerDependencies": {
-    "@xmachines/json-render-core": "^0.19.0-xm.2",
-    "@xmachines/json-render-solid": "^0.19.0-xm.2",
-    "@xmachines/json-render-xstate": "^0.19.0-xm.2",
+    "@xmachines/json-render-core": "^0.20.0-xm.2",
+    "@xmachines/json-render-solid": "^0.20.0-xm.2",
+    "@xmachines/json-render-xstate": "^0.20.0-xm.2",
     "@xstate/store": "^3.17.0",
     "solid-js": "^1.8.0",
     "xstate": "^5.31.0"