Component

Tooltip

Directive that displays an informative bubble on hover or focus. It uses CDK Overlay for robust positioning and exposes the relationship through aria-describedby.

import { NeuTooltipDirective } from '@neural-ui/core/tooltip';

Positions

Hover

<!-- Posición por defecto: top / Default position: top -->
<button [neuTooltip]="'Save changes'">Save</button>

<!-- Posición personalizada / Custom position -->
<button [neuTooltip]="'Delete record'" neuTooltipPosition="bottom">
  Delete
</button>

<!-- En cualquier elemento HTML / On any HTML element -->
<span [neuTooltip]="'More information'">ⓘ</span>

<!-- Deshabilitado condicionalmente / Conditionally disabled -->
<button
  [neuTooltip]="'Not available in read-only mode'"
  [neuTooltipDisabled]="isReadOnly()"
>
  Edit
</button>