BaseTooltipBox

Component to display a tooltip for additional content e.g: quick actions

Props

Prop name	Description	Type	Values	Default
attachTo	HTMLElement to attach the tooltip e.g.: vue ref element	null	-
directionOrder	define the default direction order	array	-	['top', 'bottom', 'right', 'left']
styles	add additional styling caveat: properties top, left and right will be overwritten due position calculation	object	-	{}
modalTitle	title of the modal popup on mobile	string	-	''
typeOnMobile	specify how the component is rendered on mobile resolutions box: component is rendered at the attachTo HTMLElement modal: component is rendered as a modal popup fullscreen: component is rendered as ap popup with max height and width	string	box, fullscreen, modal	'modal'
thresholdTop	specify a threshold value in px for the box top position calculation Useful to prevent top alignment of the TooltipBox, for example, when there is a fixed-positioned header (BaseHeader). Note: The value can also be set globally with the CSS variable --base-tooltip-box-threshold-top. The property will be overwritten by the CSS variable.	number	-	0

Events

Event name	Properties	Description
close		Event emitted when close button is clicked or clicked-outside is triggered

Slots

Name	Description	Bindings
default	slot to inject box content

---

Demo

Demo with BaseImageBoxes