diff --git a/src/builders.spec.tsx b/src/builders.spec.tsx index a4922b7..44f16be 100644 --- a/src/builders.spec.tsx +++ b/src/builders.spec.tsx @@ -90,6 +90,17 @@ describe("xstate-tree builders", () => { await waitFor(() => getByText("hello world")); }); + + it("works for Root components", async () => { + const ViewMachine = viewToMachine(() =>
hello world
); + const Root = buildRootComponent({ machine: ViewMachine }); + const RootMachine = viewToMachine(Root); + const RootView = buildRootComponent({ machine: RootMachine }); + + const { getByText } = render(); + + await waitFor(() => getByText("hello world")); + }); }); describe("buildRoutingMachine", () => { diff --git a/src/builders.tsx b/src/builders.tsx index 4616a25..5865e5c 100644 --- a/src/builders.tsx +++ b/src/builders.tsx @@ -81,7 +81,9 @@ function fixProvideLosingXstateTreeMeta< * @param view - the React view you want to invoke in an xstate machine * @returns The view wrapped into an xstate-tree machine, ready to be invoked by other xstate machines or used with `buildRootComponent` */ -export function viewToMachine(view: () => JSX.Element): AnyXstateTreeMachine { +export function viewToMachine( + view: (args?: any) => JSX.Element +): AnyXstateTreeMachine { return createXStateTreeMachine( createMachine({ initial: "idle", diff --git a/xstate-tree.api.md b/xstate-tree.api.md index a16f307..1ebf10a 100644 --- a/xstate-tree.api.md +++ b/xstate-tree.api.md @@ -375,7 +375,7 @@ export type View; // @public -export function viewToMachine(view: () => JSX.Element): AnyXstateTreeMachine; +export function viewToMachine(view: (args?: any) => JSX.Element): AnyXstateTreeMachine; // @public (undocumented) export type XstateTreeHistory = History_2<{