Bug: Display difficulties when splitting machine into multible files

[ohjah]

XState version

XState version 5

Description

i have a very complex global state machine. to make it more readable and editable i want to split the code into multible files, import the independet parts and init the machine. when i have all parts in one big file it works fine and the xstate extension can easyly show me what my statechart looks like but when i put the parts in different files and import them it just shows me an empty box.

ps: i dont want to invoke or spwan actors to split the machine. i already tried this and because context between actors is isolated this does not work for me.

ps: im using xstate with react

basic example:

export const authenticationStates = {
	initial: 'unauthenticated',
	states: {
		unauthenticated: {
			on: { REGISTER_USER: 'authenticated' }
		},
		authenticated: {
			on: { LOGOUT_USER: 'unauthenticated' }
		}
	}
};

setup({
	types: {
		events: {} as authEvents,
		context: {} as {
			auth: authenticationContextType;
		}
	}
}).createMachine({
	id: 'global',
	type: 'parallel',
	context: { auth: authenticationContext },
	states: {
		auth: authenticationStates
	}
});

Expected result

Actual result

Reproduction

i dont think that is nessesary in this case. if needed i submit later

Additional context

i cannot tell yet but i think it still works but the xstate extenstion defently has problems to display the statechart

[davidkpiano]

The VSCode extension does not currently support state machines spread out in multiple files.

[ohjah]

ok i can now surely say that the state machine is still working. its just not displayed by xstate tooling

[vamsi-lz]

Is there a plan to add it anytime?

[davidkpiano]

Is there a plan to add it anytime?

Not with the current tooling, which works via static analysis of the AST, and it gets much more complicated if the machine definition is spread out in multiple files.

The recommended way moving forward is to use Stately Inspect to visualize machines in real-time without having to parse the AST. Much more future-proof and avoids the issue of having to predict the many, many different ways machines can be authored (partial definitions, across files, dynamic keys, etc. etc.)

[ohjah]

i tryed to use inspect but because i use react native i got this problem

https://github.com/partykit/partykit/issues/516