Skip to content

Commit 03a6649

Browse files
committed
fix(builders): viewToMachine not accepting Root components
This used to work but the change that introduced allowing passing children to Root components broke it Relaxed the typings of viewToMachine to allow any component with any props
1 parent cf2205b commit 03a6649

File tree

3 files changed

+15
-2
lines changed

3 files changed

+15
-2
lines changed

src/builders.spec.tsx

+11
Original file line numberDiff line numberDiff line change
@@ -90,6 +90,17 @@ describe("xstate-tree builders", () => {
9090

9191
await waitFor(() => getByText("hello world"));
9292
});
93+
94+
it("works for Root components", async () => {
95+
const ViewMachine = viewToMachine(() => <div>hello world</div>);
96+
const Root = buildRootComponent({ machine: ViewMachine });
97+
const RootMachine = viewToMachine(Root);
98+
const RootView = buildRootComponent({ machine: RootMachine });
99+
100+
const { getByText } = render(<RootView />);
101+
102+
await waitFor(() => getByText("hello world"));
103+
});
93104
});
94105

95106
describe("buildRoutingMachine", () => {

src/builders.tsx

+3-1
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,9 @@ function fixProvideLosingXstateTreeMeta<
8181
* @param view - the React view you want to invoke in an xstate machine
8282
* @returns The view wrapped into an xstate-tree machine, ready to be invoked by other xstate machines or used with `buildRootComponent`
8383
*/
84-
export function viewToMachine(view: () => JSX.Element): AnyXstateTreeMachine {
84+
export function viewToMachine(
85+
view: (args?: any) => JSX.Element
86+
): AnyXstateTreeMachine {
8587
return createXStateTreeMachine(
8688
createMachine({
8789
initial: "idle",

xstate-tree.api.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -375,7 +375,7 @@ export type View<TActionsOutput, TSelectorsOutput, TSlots extends readonly Slot[
375375
}>;
376376

377377
// @public
378-
export function viewToMachine(view: () => JSX.Element): AnyXstateTreeMachine;
378+
export function viewToMachine(view: (args?: any) => JSX.Element): AnyXstateTreeMachine;
379379

380380
// @public (undocumented)
381381
export type XstateTreeHistory<T = unknown> = History_2<{

0 commit comments

Comments
 (0)