Sha256: 734b64e0b891978058a9898138e4318efb2a907c47f8b10c39488bb2427f1ce7
Contents?: true
Size: 1.19 KB
Versions: 948
Compression:
Stored size: 1.19 KB
Contents
import React, { useState } from 'react'
import {
Body,
Button,
CircleIconButton,
Flex,
PbReactPopover,
} from 'playbook-ui'
const PopoverActionableContent = (props) => {
const [showPopover, setShowPopover] = useState(false)
const handleTogglePopover = () => {
setShowPopover(!showPopover)
}
const handleShouldClosePopover = (shouldClose) => {
setShowPopover(!shouldClose)
}
const popoverReference = (
<CircleIconButton
icon="info"
onClick={handleTogglePopover}
variant="secondary"
/>
)
return (
<Flex
orientation="row"
vertical="center"
{...props}
>
<Body text="Click info for more details" />
<PbReactPopover
closeOnClick="inside"
offset
placement="top"
reference={popoverReference}
shouldClosePopover={handleShouldClosePopover}
show={showPopover}
{...props}
>
<Body textAlign="center">
<Button
onClick={() => {alert("Let's do this!")}}
text="Learn More"
/>
</Body>
</PbReactPopover>
</Flex>
)
}
export default PopoverActionableContent
Version data entries
948 entries across 948 versions & 2 rubygems