Add Popover / Popup component

[foot]

• Semantic-UI's: https://react.semantic-ui.com/modules/popup/

  const PopupExample = () => (
  <Popup trigger={<Button icon='add' />} content='Add users to your feed' />
  )

• Bootstraps's https://react-bootstrap.github.io/components/popovers/

  <Button onClick={this.handleClick}>Holy guacamole!</Button>
  <Overlay
  show={this.state.show}
  target={this.state.target}
  placement="bottom"
  container={this}
  containerPadding={20}
  >
  <Popover id="popover-contained" title="Popover bottom">
  <strong>Holy guacamole!</strong> Check this info.
  </Popover>
  </Overlay>

• matui: https://material-ui.com/utils/popover/

  <Button
  aria-owns={open ? 'simple-popper' : null}
  aria-haspopup="true"
  variant="contained"
  onClick={this.handleClick}
  >
  Open Popover
  </Button>
  <Popover
  id="simple-popper"
  open={open}
  anchorEl={anchorEl}
  onClose={this.handleClose}
  anchorOrigin={{
  vertical: 'bottom',
  horizontal: 'center',
  }}
  transformOrigin={{
  vertical: 'top',
  horizontal: 'center',
  }}
  >
  <Typography className={classes.typography}>The content of the Popover.</Typography>
  </Popover>

[guyfedwards]

A good library is: https://popper.js.org/tooltip-examples.html The underlying library is popper.js but they took common usecases and made tooltip.js

[farhaanbukhsh]

hey this seems interesting can I take this up?

[foot]

Hi @farhaanbukhsh. Thanks for interest in this one!

We've actually implemented a basic version of this already. I'll try and push it up to ui-components on Monday. It could use some improvements though so if you were interested in iterating on it and/or sharing ideas you have about how to make it better that would be great.

Will give you a ping soon!

[farhaanbukhsh]

I am all up for it 😊 I am up for bug fixes too!