Sha256: 797ad3681f6dcf3e4a9d344dc5414a62891b10346afe1e762027981e83ee3f74
Contents?: true
Size: 976 Bytes
Versions: 23
Compression:
Stored size: 976 Bytes
Contents
import React, { useState } from 'react'
import {
Button,
List,
ListItem,
PbReactPopover,
} from '../..'
const PopoverWithButton = () => {
const [showPopover, setShowPopover] = useState(false)
const handleTogglePopover = () => {
setShowPopover(!showPopover)
}
const popoverReference = (
<Button
onClick={handleTogglePopover}
text="Button Secondary"
variant="secondary"
/>
)
return (
<div style={{ height: '400px', textAlign: 'center' }}>
<PbReactPopover
offset
placement="bottom"
reference={popoverReference}
show={showPopover}
>
<List>
<ListItem>{'Popularity'}</ListItem>
<ListItem>{'Title'}</ListItem>
<ListItem>{'Duration'}</ListItem>
<ListItem>{'Date Started'}</ListItem>
<ListItem>{'Date Ended'}</ListItem>
</List>
</PbReactPopover>
</div>
)
}
export default PopoverWithButton
Version data entries
23 entries across 23 versions & 1 rubygems