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