render()

in src/panel/widgets.tsx [163:192]


    render() {
        const {selection, extras} = this.props;
        const children = React.Children.toArray(this.props.children)
            // No reasonable way to type guard here.
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            .map(child => child as unknown as any);

        const tabNames = children.map((child, i) => {
            return child?.type?.name === Tab.name
                ? (child as Tab<T>).props.name // Child is commonly expected to be `Tab`.
                : `Tab ${i}`; // Fallback to something reasonable just in case it's not.
        });

        const renderItem = (tabName: T | string, i: number) => {
            const child = children[i]; // Closed system, so no undefined expected.
            const count = child?.type?.name === Tab.name ? (child as Tab<T>).props.count : undefined;
            return <div>
                {tabName + ''}
                {count !== undefined && <Badge text={count} />}
            </div>;
        };

        return <>
            <OptionalDiv className="svListHeader">{/* Abstraction break: svListHeader */}
                <List className="svTabs" horizontal items={tabNames} renderItem={renderItem} selection={selection} />
                {extras}
            </OptionalDiv>
            {children[tabNames.indexOf(selection.get())]}
        </>;
    }