Types for createMachine and service in a class | Stately | Page 1

hexed pier Dec 12, 2022, 1:52 AM

#

Hello I've been using createMachine and services and placed it into a class like the following:

class Test {
    machine: any; // What to put here?
    service: any; // What to put here? 
    constructor() {
        this.machine =
            createMachine({
                // tsTypes: {}, 
                id: "(machine)",
            },
                {
                })
        this.service = interpret(this.machine).onTransition((state, event) => {

        }).start()

    }
}

const test = new Test()

However the type that is inferred here goes to any when using VS code to generate the declaration.

Using ReturnType kinda works for machine: machine: ReturnType<typeof createMachine> for machine, but for interpret it doesn't quite work the same.

What would I need to put in place of the any to get all the type info?

paper cove Dec 12, 2022, 2:16 AM

#

If you can create the machine outside the class, you can use these types:

class Test {
  machine: typeof someMachine;
  service: InterpreterFrom<typeof someMachine>;

  // ...
}

hexed pier Dec 12, 2022, 4:30 AM

#

Ah my bad, the machine has to be decoupled from the class so I can put in my own machines. Updated example:

class Test{
    machine: any; // What to put here? 
    service: any; // What to put here? 
    constructor(machine: any) {
        this.machine = machine
        this.service = interpret(this.machine)
        this.service.onTransition((state:any, event: any) => {
        }).start()

    }
}

const m = createMachine({
    id: "(machine)",
})
const test = new Test(m)

Thinking maybe I can use generic types, but I'm having trouble getting it working...

stable fractal Dec 12, 2022, 9:11 AM

#

You can use generic types on the class to infer accurate types for properties such as machine. service type can be derived based on machine type.

#

Link to TS playground: https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAbzgQQHYE8DKMCGMCmAsjgMYAWwq+ANHAJKoFRhT5O2VMtu0mt5FSFKnAC+cAGZQIIOAHIAHgGdcBOQCh1JADY4lSuABV8KgDyHi5Svjj4FBVABMDaLKsFWqAPkTq4cMABXACNtYBI4JXwoADdw-AAuekZo7iZzS2F8LwBuPzgSCFQVKECSGGgACiDQ8LgQIWski0aqAEpff38YCiUAOgbPGwBeetb8PK64HuB+qNj4uFHOVNYYSsGstsmxdVFNQuL4GABGJbgqAHcjE3W+fAFM60qkSmAYYBxtJLkcOVoVAIlEkkDgQeIIW1tpoYOgwDZCOdYfCIBJpicBuM8sibJgkXD8Kj0X15nESPggA

#Types for createMachine and service in a class