#### ButtonGroup

    const SidebarIcon = require('grommet/components/icons/base/Sidebar');
    let initialState = {active: 3};
    let items = [
      {
        id: 1,
        text: 'Btn1',
        onClick: () => { setState({active: 1}) }
      },
      {
        id: 2,
        text: 'Btn2',
        icon: <SidebarIcon />,
        onClick: () => { setState({active: 2})}
      },
      {
        id: 3,
        text: 'Btn3',
        onClick: () => { setState({active: 3})}
      },
      {
        id: 4,
        text: 'Btn4',
        onClick: () => { setState({active: 4})}
      }
    ];

    <div>
      <ButtonGroup pad="none" items={items} activeItemId={state.active} />
      <p />
      <p>Active button id: {state.active}</p>
    </div>
