In my definitions, I have identified two distinct groups: Tabs and Sections. A section is encompassed by tabs (tabs contain sections).
When defining sections, I want the tab names to be automatically populated by the previously declared sibling tabs.
But how can I determine the names of siblings? Here's what I experimented with (Give it a try on our platform):
export type TabDeclaration<TabName extends string = string> = {
name?: TabName;
};
export type SectionDeclaration<
Tabs extends TabDeclaration[],
SectionName extends string = string
> = Tabs extends TabDeclaration<infer TabName>[]
? {
name?: SectionName;
tab?: TabName;
}
: never;
type TabsAndSections<Tabs extends TabDeclaration[] = TabDeclaration[]> = {
tabs: Tabs;
sections: SectionDeclaration<Tabs>[];
};
var tabsAndSections: TabsAndSections = {
tabs: [
{
name: 'Tab 1'
},
{
name: 'Tab 2'
}
],
sections: [
{
name: 'Section 1',
tab: '' /* <---- Should autocomplete "Tab 1" or "Tab 2" */
}
]
}
tab: should automatically suggest "Tab 1" or "Tab 2".