Infer type of second argument from first argument

I want to create different view modes with different configs:

abstract class ViewModeComponentBase {
protected itemService = inject(ItemService);
}

@Component()
class GalleryViewComponent extends ViewModeComponentBase {
configuration = input.required<GalleryViewConfig>();
someCustomGalleryProperty = "test gallery";
}

@Component()
class ListViewComponent extends ViewModeComponentBase {
configuration = input.required<ListViewConfig>();
someCustomListProperty = "test list";
}

@Component()
class GridViewComponent extends ViewModeComponentBase {
configuration = input.required<GridViewComponent>();
someCustomGridProperty = "test grid";
}

type GalleryViewConfig = {
gallerySize: number;
showCaptions: boolean;
};

type ListViewConfig = {
itemsPerPage: number;
showThumbnails: boolean;
};

type GridViewConfig = { columns: number };


And I want to create a factory that returns a view mode enriched with the correct inputs like this:

class ViewModeFactory {
constructor(private viewContainerRef: ViewContainerRef) {}

create<T>(component: T, configuration: ConfigFor<T>) {
const ref = this.viewContainerRef.createComponent(component);
ref.setInput('configuration', configuration);
// Do some other stuff
retirm ref;
}
}

ViewModeFactory.create(GridViewComponent, {<should enforce correct config type>});


Is it possible to achieve this with TypeScript to create such a ConfigFor type or some other way?

Continue reading...