Tooltip Plugin

Displays validation error messages in a floating tooltip instead of a static message block, triggered by hovering or clicking the invalid field.

Options

Option	Type	Default	Description
enabled	boolean	true	Enable or disable the plugin
placement	string	'top'	Tooltip position: 'top', 'bottom', 'left', 'right'
trigger	string	'hover'	Show trigger: 'hover' (mouseenter/mouseleave) or 'click' (click field; document click hides)

Playground

Validate the form, then hover over the invalid field to see the tooltip.

Notes

• Tooltip is an alternative to Message — use one or the other (both can coexist but it's unusual).
• The plugin creates a single div.vd-plugins-tooltip in document.body and positions it using getBoundingClientRect.
• Add CSS for .vd-plugins-tooltip and .vd-plugins-tooltip--show to control appearance (the plugin only handles visibility and position).
• With trigger: 'click', clicking the field shows the tooltip; clicking anywhere else hides it.
• Use Tooltip alongside Trigger (with event: 'input') for live feedback as the user types.