I have started to play with xstate/fsm and I have an issue with declaring a TState type.
import {createMachine, EventObject, StateMachine} from '@xstate/fsm';
import {Typestate} from "@xstate/fsm/lib/types";
export interface InitContext {
retries: number;
}
export interface InitState extends Typestate<InitContext> {
value: any;
context: InitContext;
}
export type InitEvent =
| { type: "LOG_IN" }
| { type: "FETCHED" }
| { type: "ERROR" }
| { type: "RESTART" };
export type InitEvent =
| { type: "LOG_IN" }
| { type: "FETCHED" }
| { type: "ERROR" }
| { type: "RESTART" }
machine!: StateMachine.Machine<InitContext, InitEvent, InitState>;
machine2!: StateMachine.Machine<InitContext, EventObject, { value: any; context: InitContext }>;
this.machine = createMachine<InitContext>({}); // this does not work
this.machine2 = createMachine<InitContext>({}); // this works
The error is:
TS2322: Type 'Machine<InitContext, EventObject, { value: any; context: InitContext; }>' is not assignable to type 'Machine<InitContext, InitEvent, InitState>'.
Types of property 'transition' are incompatible.
Type '(state: string | State<InitContext, EventObject, { value: any; context: InitContext; }>, event: string | EventObject) => State<...>' is not assignable to type '(state: string | State<InitContext, InitEvent, InitState>, event: "FETCH_CONFIG" | "LOG_IN" | "FETCH_MAIN_DATA" | "FETCH_LINKED_DATA" | "FETCHED" | "ERROR" | "RESTART" | InitEvent) => State<...>'.
Types of parameters 'state' and 'state' are incompatible.
Type 'string | State<InitContext, InitEvent, InitState>' is not assignable to type 'string | State<InitContext, EventObject, { value: any; context: InitContext; }>'.
Type 'State<InitContext, InitEvent, InitState>' is not assignable to type 'string | State<InitContext, EventObject, { value: any; context: InitContext; }>'.
Type 'State<InitContext, InitEvent, InitState>' is not assignable to type 'State<InitContext, EventObject, { value: any; context: InitContext; }>'.
Types of property 'actions' are incompatible.
Type 'ActionObject<InitContext, InitEvent>[]' is not assignable to type 'ActionObject<InitContext, EventObject>[]'.
Type 'ActionObject<InitContext, InitEvent>' is not assignable to type 'ActionObject<InitContext, EventObject>'.
Type 'EventObject' is not assignable to type 'InitEvent'.
How can I properly define InitState
and InitEvent
? The method createMachine
is defined as:
export declare function createMachine<TContext extends object, TEvent extends EventObject = EventObject, TState extends Typestate<TContext> = {
value: any;
context: TContext;
}>(fsmConfig: StateMachine.Config<TContext, TEvent, TState>, implementations?: {
actions?: StateMachine.ActionMap<TContext, TEvent>;
}): StateMachine.Machine<TContext, TEvent, TState>;