Sha256: 158d3b1cdc77885af71a02fadccf8fa9cd84066860d4bf3f8fc1d016882d933f

Contents?: true

Size: 1.02 KB

Versions: 9

Compression:

Stored size: 1.02 KB

Contents

import React from 'react'
import {
  Button,
  List,
  ListItem,
  PbReactPopover,
} from '../..'

export default class PopoverWithButton extends React.Component {
  state = {
    showPopover: false,
  }

  handleTogglePopover = () => {
    this.setState({ showPopover: !this.state.showPopover })
  }

  render() {
    const popoverReference = (
      <Button
          onClick={this.handleTogglePopover}
          text="Button Secondary"
          variant="secondary"
      />
    )

    return (
      <div style={{ height: '400px', textAlign: 'center' }}>
        <PbReactPopover
            offset
            placement="bottom"
            reference={popoverReference}
            show={this.state.showPopover}
        >
          <List>
            <ListItem>{'Popularity'}</ListItem>
            <ListItem>{'Title'}</ListItem>
            <ListItem>{'Duration'}</ListItem>
            <ListItem>{'Date Started'}</ListItem>
            <ListItem>{'Date Ended'}</ListItem>
          </List>
        </PbReactPopover>
      </div>
    )
  }
}

Version data entries

9 entries across 9 versions & 1 rubygems

Version Path
playbook_ui-4.6.1 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.6.0 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.5.2 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.5.1 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.5.0 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.4.1 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.4.0 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.3.1 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx
playbook_ui-4.3.0 app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx