Animations

You can enable or disable the show and hide animations of the PanelBar.

To control the behavior of the animations:

  • Specify the animation property of the PanelBar.
  • Specify the animation property to individual children.
class App extends React.Component {
    render() {
        return(
            <div class="panelbar-wrapper">
                <PanelBar animation={false}>
                    <PanelBarItem title="Team">
                        <PanelBarItem title="Team 1" />
                        <PanelBarItem title="Team 2" />
                        <PanelBarItem title="Team 3" />
                    </PanelBarItem>
                    <PanelBarItem title="Projects" animation={true}>
                        <PanelBarItem title="Business Plan"/>
                        <PanelBarItem title="Forecast"/>
                        <PanelBarItem title="OKRs"/>
                    </PanelBarItem>
                </PanelBar>
            </div>
        )
    }
}

ReactDOM.render(
    <App />,
    document.querySelector('my-app')
)
In this article
 /