Skip to content

Extract useScrollBlocker hook from 2U #46

@lettertwo

Description

@lettertwo

Is your feature request related to a problem? Please describe.

In UIs that present 'modal' or 'popover' behavior, there is often scrollable content behind the overlay. If the user performs scrolling input while the modal is displayed, it may cause the underlying content to scroll, causing disorientation and confusion.

2U has a hook that prevents scroll behavior on the document when passed a truthy value. This could be a building block for modal behaviors—a simple solution for an important detail that is easy to overlook.

Describe the solution you'd like

Extract and package 2U's useScrollBlocker hook

Note that, as implemented, this may not be robust enough for general use cases. We may need to consider API for specifying the scrollable element to block, and or for finding the nearest scrollable container to an element.

Describe alternatives you've considered

🤔

Additional context

  • the implementation is probably too naive
  • no docs or tests yet
  • peer dependencies
    • react

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions