mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-25 03:29:59 +08:00
a17c4cb581
* ✨ feat: popover Component Token * ✨ feat: update * ✨ feat: update * ✨ feat: update * ✨ feat: update * ✨ feat: update * ✨ feat: update snap * ✨ feat: update * ✨ feat: update * ✨ feat: update * ✨ feat: update
1.8 KiB
1.8 KiB
| category | group | title | cover | coverDark | demo | ||
|---|---|---|---|---|---|---|---|
| Components | Data Display | Popover | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*XhL3QpRw92kAAAAAAAAAAAAADrJ8AQ/original | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*RMP_TrdZ3nsAAAAAAAAAAAAADrJ8AQ/original |
|
The floating card popped by clicking or hovering.
When To Use
A simple popup menu to provide extra information or operations.
Comparing with Tooltip, besides information Popover card can also provide action elements like links and buttons.
Examples
Basic
Three ways to trigger
Placement
Arrow
Controlling the close of the dialog
Hover with click popover
_InternalPanelDoNotUseOrYouWillBeFired
Wireframe
Component Token
API
| Param | Description | Type | Default value | Version |
|---|---|---|---|---|
| content | Content of the card | ReactNode | () => ReactNode | - | |
| title | Title of the card | ReactNode | () => ReactNode | - |
Consult Tooltip's documentation to find more APIs.
Note
Please ensure that the child node of Popover accepts onMouseEnter, onMouseLeave, onFocus, onClick events.