palantir/blueprint

Implementing "safe polygon" for nested menu items

Open

#6 585 ouverte le 4 déc. 2023

Voir sur GitHub
 (1 commentaire) (7 réactions) (0 assignés)TypeScript (20 263 stars) (2 167 forks)batch import
Status: needs proposalType: enhancementhelp wanted

Description

Environment

  • Package version(s): N/A
  • Browser and OS versions: N/A

Feature request

The supersceding library to popper.js (floating-ui) has this feature built in, but the idea is to make better guarantees about where a user can safely move their mouse without dismissing the popover accidentally & expose this on the public API. See:

Examples

image

Guide contributeur

Stack technique
typescriptreact
Domaine
frontendaccessibility
Type d'issue
feature
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
3-5 days
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
fresh
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
mostly clear
Prérequis
ReactTypeScriptContext menus concepts
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
45
Direction de recherche
Start by reading the floating ui documentation on safe polygon and the Smashing Magazine article. Explore the Blueprint codebase, particularly the popover and menu components (likely in packages/popover/ and packages/menu/). Understand the current behavior when hovering between nested menu items. Then propose an implementation that computes a safe polygon area around the menu items to prevent accidental dismissal. Consider the public API changes needed to expose this feature. Look for existing issues or discussions for additional context.