Skip to content

Commit

Permalink
fix(builders): viewToMachine not accepting Root components
Browse files Browse the repository at this point in the history
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
  • Loading branch information
UberMouse committed Aug 12, 2024
1 parent 10183d9 commit fcd0d2d
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 2 deletions.
11 changes: 11 additions & 0 deletions src/builders.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,17 @@ describe("xstate-tree builders", () => {

await waitFor(() => getByText("hello world"));
});

it("works for Root components", async () => {
const ViewMachine = viewToMachine(() => <div>hello world</div>);
const Root = buildRootComponent(ViewMachine);
const RootMachine = viewToMachine(Root);
const RootView = buildRootComponent(RootMachine);

const { getByText } = render(<RootView />);

await waitFor(() => getByText("hello world"));
});
});

describe("buildRoutingMachine", () => {
Expand Down
4 changes: 3 additions & 1 deletion src/builders.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -274,7 +274,9 @@ export function createXStateTreeMachine<
* @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 | null
): AnyXstateTreeMachine {
return createXStateTreeMachine(
createMachine({
initial: "idle",
Expand Down
2 changes: 1 addition & 1 deletion xstate-tree.api.md
Original file line number Diff line number Diff line change
Expand Up @@ -446,7 +446,7 @@ export type ViewProps<TSelectors, TActions, TSlots extends readonly Slot[], TMat
};

// @public
export function viewToMachine(view: () => JSX.Element): AnyXstateTreeMachine;
export function viewToMachine(view: (args?: any) => JSX.Element | null): AnyXstateTreeMachine;

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

0 comments on commit fcd0d2d

Please sign in to comment.