@nextcloud/vueNcPopover
Props
| Prop name | Description | Type | Values | Default |
|---|---|---|---|---|
| popoverBaseClass | string | - | '' | |
| focusTrap | Enable popover focus trap | boolean | - | true |
| setReturnFocus | Set element to return focus to after focus trap deactivation | import('focus-trap').Options['setReturnFocus'] | - | undefined |
Events
| Event name | Properties | Description |
|---|---|---|
| after-show | ||
| after-hide | Triggered after the tooltip was visually hidden. |
Slots
| Name | Description | Bindings |
|---|---|---|
| trigger | ||
| default |
General description
This component is just a wrapper for the floating-vue plugin by Akryum, please refer to this documentation for customization: https://github.com/Akryum/floating-vue
This components has two slots:
'trigger' which can be any html element and it will trigger the popover this slot is optional since you can toggle the popover also by updating the open prop on this component;
a default slot that is for the content of the popover.
Examples
With a <button> as a trigger:
loading...
Without focus trap:
The focus-trap emits an error when used in a non-focusable element tree.
The prop :focus-trap="false" help to prevent it when the default behavior is not relevant.
loading...