Выпадающее меню React Material-UI не работает в Paper

Я скопировал инструкции по использованию Menus в документации Material-UI. У меня есть кнопка, отображаемая в моем компоненте контейнера, в котором есть компонент Paper, но когда я нажимаю на нее, меню не отображается. Вот код:

index.js - Компонент контейнера

const styles = theme => ({
  root: theme.mixins.gutters({
    paddingBottom: 16
  })
});

class ProvidersPage extends React.Component {
  constructor(props, context) {
    super(props, context);
  }

  render() {
    const { classes, providers } = this.props;

    return (
      <div>
        <Paper className = {classes.root} elevation = {4}>
          <ProviderList providers = {providers} />
        </Paper>
      </div>
    );
  }
}

ProvidersPage.propTypes = {
  classes: PropTypes.object.isRequired,
};

function mapStateToProps(state) {
  return {
    providers: state.providers
  };
}

export default connect(
  mapStateToProps
)(withStyles(styles)(ProvidersPage));

Компонент ProvidersList.js

const styles = theme => ({
  actions: {
    color: theme.palette.text.secondary,
  },
  title: {
    flex: '1',
  }
});

class ProviderList extends React.Component {
  constructor(props, context) {
    super(props, context);
  }

  render() {
    const { classes, providers } = this.props;

    return (
      <Fragment>
        <Toolbar disableGutters>
          <div className = {classes.title}>
            <Typography variant = "title">
              Providers
            </Typography>
          </div>
          <div className = {classes.actions}>
            <ProviderMenu />
          </div>
        </Toolbar>
      </Fragment>
    );
  }
};

ProviderList.propTypes = {
  classes: PropTypes.object.isRequired,
  providers: PropTypes.array.isRequired
};

export default withStyles(styles)(ProviderList);

ProviderMenu.js - Мой компонент меню, в котором есть меню

class ProviderMenu extends React.Component {
  state = {
    anchorEl: null,
  };

  handleClick = event => {
    this.setState({ anchorEl: event.currentTarget });
  };

  handleClose = () => {
    this.setState({ anchorEl: null });
  };

  render() {
    const { anchorEl } = this.state;

    return (
      <div>
        <Button
          aria-owns = {anchorEl ? 'simple-menu' : null}
          aria-haspopup = "true"
          onClick = {this.handleClick}
        >
          Open Menu
        </Button>
        <Menu
          id = "simple-menu"
          anchorEl = {anchorEl}
          open = {Boolean(anchorEl)}
          onClose = {this.handleClose}
        >
          <MenuItem onClick = {this.handleClose}>Profile</MenuItem>
          <MenuItem onClick = {this.handleClose}>My account</MenuItem>
          <MenuItem onClick = {this.handleClose}>Logout</MenuItem>
        </Menu>
      </div>
    );
  }
}

export default ProviderMenu;