Are there any real life non-story book examples?

I can’t seem to get any Navbar example to work with with the burger menu. Is there any kind of clear real life example that’s not wrapped in story book? Even the story book doesn’t have a working burger menu.

class Nav extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
       open: false
     }
  }

  onClick = () => {
    this.setState({
      open: !this.state.open
    });
  }

  render() {
    return (
      <Navbar>
        <Navbar.Brand>
          <Navbar.Item renderAs="a" href="#">
            <img
              src="https://bulma.io/images/bulma-logo.png"
              alt="Bulma: a modern CSS framework based on Flexbox"
              width="112"
              height="28"
            />
          </Navbar.Item>
          <Navbar.Burger active={this.state.open} onClick={this.onClick} />
        </Navbar.Brand>
        <Navbar.Menu active="open">
          <Navbar.Container>
            <Navbar.Item href="#">Second</Navbar.Item>
          </Navbar.Container>
          <Navbar.Container position="end">
            <Navbar.Item href="#">At the end</Navbar.Item>
          </Navbar.Container>
        </Navbar.Menu>
      </Navbar>
    )
  }
}

export default Nav

With the above code I get

node_modules/react-error-overlay/lib/index.js:2172 Warning: Received `false` for a non-boolean attribute `active`.

[couds]

That’s an error. In V1 the menú accepted the prop but in v2 it use React.Context.

We should remove the prop on storybook for the menu

[couds]

Hi @bluengreen.

On the storybook you should use the knob tab to open/close the navbar.

On the example code above you should pass the open state to the Navbar instead of the Burguer.

I hope this solve your issue.