@synapse-ui/tooltip

Lightweight Angular tooltip component with four placement options and configurable show delay.

Installation

npm install @synapse-ui/tooltip

Usage

import { Tooltip } from '@synapse-ui/tooltip';

@Component({
  imports: [Tooltip],
  template: `
    <synapse-tooltip text="Save your work" position="top" [delay]="300">
      <button>Save</button>
    </synapse-tooltip>
  `,
})
export class MyComponent {}

Inputs

| Input | Type | Default | Description | | ---------- | ---------------------------------------- | ------- | ------------------------------------- | | text | string | '' | Tooltip content | | position | 'top' \| 'bottom' \| 'left' \| 'right' | 'top' | Placement relative to the trigger | | delay | number | 0 | Milliseconds before the tooltip shows |

Running unit tests

Run nx test tooltip to execute the unit tests.