Sha256: b45a982787fb096dbcc9ccec9e6da84f8e46f12ad21709c332f78fb5ab2a6900
Contents?: true
Size: 898 Bytes
Versions: 948
Compression:
Stored size: 898 Bytes
Contents
import React, { useState } from 'react'
import {
Body,
CircleIconButton,
Flex,
PbReactPopover,
} from 'playbook-ui'
const PopoverDefault = (props) => {
const [showPopover, setShowPopover] = useState(false)
const handleTogglePopover = () => {
setShowPopover(!showPopover)
}
const popoverReference = (
<CircleIconButton
icon="info"
onClick={handleTogglePopover}
variant="secondary"
/>
)
return (
<Flex
orientation="row"
vertical="center"
{...props}
>
<Body text="Click info for more details" />
<PbReactPopover
offset
placement="top"
reference={popoverReference}
show={showPopover}
{...props}
>
{'I\'m a popover. I can show content of any size.'}
</PbReactPopover>
</Flex>
)
}
export default PopoverDefault
Version data entries
948 entries across 948 versions & 2 rubygems