How to use generics with the value of a type definition in TypeScript?

I have some classes which all have a property called data. I have a type definition for the data type mapping which I’d like to use in the generics definition. So this is my code:

type DataTypes = {
  age: number;
  firstName: string;
  lastName: string;
};

abstract class AbstractBase<T extends DataTypes> {
  data: T;
}

class AgeComponent extends AbstractBase<DataTypes.age> {}

class FirstNameComponent extends AbstractBase<DataTypes.firstName> {}

class LastNameComponent extends AbstractBase<DataTypes.lastName> {}

So when using abstract class AbstractBase<T extends DataTypes> I’d like to tell TypeScript to accept the types according to the mappings in the type DataTypes.

Is this possible with TypeScript?

>Solution :

You can pass to AbstractBase the key from DataTypes you want to use, and the use index access types to get the type from DataTypes:

abstract class AbstractBase<T extends keyof DataTypes> {
  data!: DataTypes[T];
}

class AgeComponent extends AbstractBase<"age"> {}

Playground Link

Or you can pass the type of the property directly:

abstract class AbstractBase<T extends DataTypes[keyof DataTypes]> {
  data!: T;
}

class AgeComponent extends AbstractBase<DataTypes["age"]> {}

Playground Link