react-safety-triangle
v1.0.1
Published
This package contains an implementation of the Safety Triangle concept for context menu's, inspired by this article: https://www.smashingmagazine.com/2023/08/better-context-menus-safe-triangles/
Downloads
2
Maintainers
Readme
react-safety-triangle
Introduction
This package contains an implementation of the Safety Triangle concept for context menu's, inspired by this article: https://www.smashingmagazine.com/2023/08/better-context-menus-safe-triangles/
Getting started
See the example on how to use the exported SafetyTriangle
component.
Import it into your project and render the component inside your page. The children
should contain your dropdown elements and the safety triangle will adjust to its size.
Make sure to setup your mouseLeave
event on a top level wrapping div with position: relative
, so the closing of your context menu takes both existing elements as well as the triangle into account.