Kendo React Wrappers - Resolving Error "The node to be removed is not a child of this node"

App-updated.ts

render() {
    return (
        <div className="app">
            <div><button onClick={this.onButtonClicked}>Toggle</button></div>
            {/* Conditionally show Kendo DropDownList */}
            {this.state.showList && 
                <div> {/* Wrap the component in a div element */}
                   <DropDownList dataSource={["One", "Two", "Three"]} />
                </div>
            }
        </div>
    );
}

App.ts

import * as React from 'react';
import '@progress/kendo-ui';
import { DropDownList } from '@progress/kendo-dropdowns-react-wrapper';

export interface State {
    showList: boolean
}

export interface Props {
}

export class App extends React.Component<Props, State> {

    constructor(props: Props) {
        super(props);

        this.state = {
            showList: true
        }
    }

    render() {
        return (
            <div className="app">
                <div><button onClick={this.onButtonClicked}>Toggle</button></div>
                {/* Conditionally show Kendo DropDownList */}
                {this.state.showList && <DropDownList dataSource={["One", "Two", "Three"]} />}
            </div>
        );
    }

    private onButtonClicked = (event) => {
        this.setState({
            showList: !this.state.showList
        });
    }
}