Talk:OOUI/Widgets/Popups

Is it possible to destroy popups, rather than just toggle(false)?

It seems all my old popup are hanging about in the DOM when I will never use them again.

I have a OO.ui.PopupWidget that can be fairly long (depends on the content, which loads asynchronously).

I have autoFlip on, but it has to be really close to the bottom to flip (since the popup is almost empty at the start), and when it fills later, it doesn't re-flip.

Is there a way to either "reserve" space, so it will pre-emptively flip so that it would have at least "y" pixels, or is there a way to force it to flip if it gets too large?

I know this must be possible, as its the default on Wikipedia links, but I've been digging through https://doc.wikimedia.org/oojs-ui/master/js/#!/api looking for an on hover event trigger, and I didn't see one. How can I make a button (or a link, doesn't really matter so long as it can redirect) that triggers a popup when you hover over it?

We don't provide this behaviour in the library, for the obvious accessibility and mobile problems. You could build one, but be careful in it use. The functionality to which you refer is the Page Previews tool. The code for that is located at https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/extensions/Popups/+/master but is rather labyrinthine, and doesn't use this library but instead is manual code styled to look like it.

@Reinischmax On top of @Jdforrester (WMF)'s answer, there has been T161403 with a similar request for the library's PopupButtonWidget. If you wish so, please share your use case for documentation and development planning purposes.

Hello, I made a browser extension for the internet archive that adds a link to cited books that includes a little detail popup. I am working to port this over as a gadget, but I am getting "Uncaught TypeError: Cannot read property 'PopupWidget' of undefined" when I call "OO.ui.PopupWidget({...})."

You need to declare your dependency on the relevant bits of OOUI and get MediaWiki to load it via mw.loader.using( [ 'oojs-ui-core' ], function () { … } ).