Notification - Constraining to a region
By default, notifications are constrained to the browser viewport. However, this can be configured via the region prop.
Use regionOffset to specify an offset (distance) from the specified region, so notifications respect the given offset when computing their position.
When displayed in the constrain region, notifications respect their specified stacking. Specifying stacking is done by configuring two directions. At first, notifications stack on the first direction, and then they wrap on the second specified direction.
The constrain region can have one of the following values:
  • an HTMLElement - so the notifications will be constrained to the corresponding bounding client rect.
  • a String to be used as a query selector, passed on to document.querySelector() - as a result, an HTMLElement is retrieved and used as mentioned in the above case.
  • an object with top,left,bottom,right (or top,left,width,height) to be used the as a bounding client rect (described in the first bullet above). Those coordinates should be relative to the browser viewport, just as the coordinates returned by getBoundingClientRect are.
  • a function returning any of the above.