Sha256: cd6630abc4ba1353699a433b71ccdc8edcb001dbc34686538d5e9a1720eda0c0
Contents?: true
Size: 974 Bytes
Versions: 41
Compression:
Stored size: 974 Bytes
Contents
import React, { useState } from 'react'
import {
Button,
Icon,
List,
ListItem,
PbReactPopover,
} from '../..'
const PopoverWithButton = () => {
const [showPopover, setShowPopover] = useState(false)
const handleTogglePopover = () => {
setShowPopover(!showPopover)
}
const popoverReference = (
<Button
onClick={handleTogglePopover}
variant="secondary"
>
{'Filter By'}
<Icon
fixedWidth
icon="angle-down"
/>
</Button>
)
return (
<PbReactPopover
padding="none"
placement="bottom"
reference={popoverReference}
show={showPopover}
>
<List xpadding>
<ListItem>{'Popularity'}</ListItem>
<ListItem>{'Title'}</ListItem>
<ListItem>{'Duration'}</ListItem>
<ListItem>{'Date Started'}</ListItem>
<ListItem>{'Date Ended'}</ListItem>
</List>
</PbReactPopover>
)
}
export default PopoverWithButton
Version data entries
41 entries across 41 versions & 1 rubygems