OOUI/Widgets/Popups

A PopupWidget is a container for content. Popups are overlaid and positioned absolutely. By default, each has an ‘anchor,’ which is an arrow-like protrusion that points toward the popup’s origin. The width, height, and padding can be customized using configuration options.

 Create a popup and add content using the $content config:

   

Add a close button and label to the top of the popup with the head and label options:



Specify whether the popup should have an anchor or not with the anchor option:

 

Align the popup from the left, right, or center with the align option:

   

Set a container and container padding with the $container and containerPadding options:

    

Automatically close the popup when it loses focus with the autoclose (and, optionally, $autoCloseIgnore) options:

 

You can also achieve this effect using the built-in PopupButtonWidget class.

For a complete list of supported methods and configuration options, please see the code-level documentation.