Sha256: 18e2777958884583f3c8bd32b2085f19612b3722c34c114e7547eee1fd1d35c2

Contents?: true

Size: 847 Bytes

Versions: 145

Compression:

Stored size: 847 Bytes

Contents

import React, { useState } from 'react'
import {
  Body,
  CircleIconButton,
  Flex,
  PbReactPopover,
} from '../..'

const PopoverDefault = () => {
  const [showPopover, setShowPopover] = useState(false)

  const handleTogglePopover = () => {
    setShowPopover(!showPopover)
  }
  const popoverReference = (
    <CircleIconButton
        icon="info"
        onClick={handleTogglePopover}
        variant="secondary"
    />
  )

  return (
    <Flex
        orientation="row"
        vertical="center"
    >
      <Body text="Click info for more details" />
      &nbsp;
      <PbReactPopover
          offset
          placement="top"
          reference={popoverReference}
          show={showPopover}
      >
        {'I\'m a popover. I can show content of any size.'}
      </PbReactPopover>
    </Flex>
  )
}

export default PopoverDefault

Version data entries

145 entries across 145 versions & 1 rubygems

Version Path
playbook_ui-7.11.1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.11.0 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.11.0.pre.alpha1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.10.0 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.9.0 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.8.4 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.8.3 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.8.2 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.8.1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.8.0 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.7.0.pre.alpha1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.7.0 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.6.2.pre.alpha1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.6.2 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.6.1.pre.alpha1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.6.1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.6.0 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.5.1 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.5.0 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx
playbook_ui-7.4.2 app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx