TypeScript: How to offer all states in states.matches()?

[montogeek]

Hi!

I am trying to add TypeScript to everything related to the state machine, almost everything works expect for state.matches I can't find a way to tell TypeScript to know all the possible states in my machine, you can find a reproduction of this here: https://codesandbox.io/s/thirsty-stonebraker-5e3ll?file=/src/index.tsx:807-858

TypeScript shows that the arguments for matches is a string, any string, but it should be only the States defined.

I have checked the types and it seems you will need some context along with the state, but in my case, I have no context at all.

[montogeek]

Solved this way:

export enum States {
  DASHBOARD = 'DASHBOARD',
  OVERVIEW = 'OVERVIEW'
}

type StatesMap<T> = {
  [K in keyof T]: {
    value: K,
    context: never
  }
}

export type TrainingStates = StatesMap<typeof States>[keyof StatesMap<typeof States>];

Added to https://gist.github.com/montogeek/dd51382ecc1d57a9ae9f6bad4c0b47df

[montogeek]

This only works for top level states.