Display a small information icon which can be toggled by clicking on it.
import { InfoPopover } from '@folio/stripes/components';
<InfoPopover
allowAnchorClick
content="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
buttonLabel="Read more"
buttonHref="https://wiki.folio.org/"
buttonTarget="_blank"
/>
| Name | Type | Description | default |
|---|---|---|---|
| allowAnchorClick | boolean | Whether to allow the link button to be clicked | false |
| content | node | The content of the information popover | |
| buttonLabel | node | The label of the button inside the information popover | "Read more" |
| buttonHref | string | The destination for the button inside the information popover | |
| buttonTarget | string | The target for the button | _blank |
| contentClass | string | className for content inside popover |
|
| iconSize | string | The size of the icon (small or medium) |
small |
| hideOnButtonClick | boolean | Whether to hide popover on anchor button click | false |
| renderTrigger | func | Render a custom trigger button. The function will receive an object that contains the the open-state, a ref that needs to be passed onto trigger button and a toggle-function for toggling the <InfoPopover>. The render function should return a button. |
|
| buttonProps | object | Pass additional props to the trigger <IconButton> |
{} |
| popperProps | object | Pass additional props to the underlying <Popper> |
{} |
The remaining props passed to <InfoPopover> will be passed down to the internal <Popover>.