Skip to content

feat(tooltip): add flip and adjust distance from reference element#807

Merged
igorwessel merged 1 commit intomainfrom
fix/minor-adjusts-in-tooltip
Jan 28, 2026
Merged

feat(tooltip): add flip and adjust distance from reference element#807
igorwessel merged 1 commit intomainfrom
fix/minor-adjusts-in-tooltip

Conversation

@igorwessel
Copy link
Contributor

Task

Summary

This PR applies small fixes and improvements to the AtomTooltip component (Popper-based tooltip) so positioning and spacing behave correctly in more cases.

Changes

  1. Flip modifier

    • An explicit flip modifier was added to the Popper config with fallbackPlacements: ['top', 'bottom', 'right', 'left'].
    • When the preferred placement doesn’t fit (e.g. trigger near the viewport edge), the tooltip now tries these fallbacks in order instead of relying only on Popper’s default.
    • Expected result: Tooltips stay on-screen and avoid being cut off when the trigger is near edges or corners.
  2. Offset adjustment

    • The offset modifier was changed from [0, 4] to [0, 7].
    • The new value matches the intended spacing: 4px visible distance between trigger and tooltip + 3px for the arrow square range (from the negative value used in SCSS).
    • Expected result: Consistent visual gap between the trigger and the tooltip content, with the arrow aligned to the intended “visible” distance.

Evidences

  • Tooltip near viewport edges (e.g. top/bottom/left/right) to show flip behavior.
  • Tooltip with arrow to show the 7px spacing (trigger ↔ tooltip content).
Gravacao.de.Tela.2026-01-27.as.16.28.31.mov

Example:

Before: Tooltip cut off or cramped near edges; gap might look too small next to the arrow.

Captura de Tela 2026-01-27 às 16 29 30

After: Tooltip flips to a valid placement; gap looks consistent and matches design (4px + arrow).

Captura de Tela 2026-01-27 às 16 29 11

@igorwessel igorwessel self-assigned this Jan 27, 2026
@igorwessel igorwessel requested review from mauriciomutte and removed request for a team January 27, 2026 19:30
Copy link

@orca-security-us orca-security-us bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Orca Security Scan Summary

Status Check Issues by priority
Passed Passed Infrastructure as Code high 0   medium 0   low 0   info 0 View in Orca
Passed Passed OSS Licenses high 0   medium 0   low 0   info 0 View in Orca
Passed Passed SAST high 0   medium 0   low 0   info 0 View in Orca
Passed Passed Secrets high 0   medium 0   low 0   info 0 View in Orca
Passed Passed Vulnerabilities high 0   medium 0   low 0   info 0 View in Orca

@sonarqubecloud
Copy link

@github-actions
Copy link
Contributor

github-actions bot commented Jan 27, 2026

PR Preview Action v1.8.1
Preview removed because the pull request was closed.
2026-01-28 12:37 UTC

@felipefialho felipefialho changed the title feat: add flip and adjust distance from reference element feat(tooltip): add flip and adjust distance from reference element Jan 27, 2026
@igorwessel igorwessel merged commit b70306f into main Jan 28, 2026
9 of 10 checks passed
@igorwessel igorwessel deleted the fix/minor-adjusts-in-tooltip branch January 28, 2026 12:35
@github-actions github-actions bot mentioned this pull request Jan 28, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants