More Options for Triggering Popups

Wijmo's Popup control allows developers to create popups and dialogs, which can be controlled by an owner element (like a drop-down button). The Popup control has showTrigger and hideTrigger properties that allow developers to control which actions should cause the popup to appear and disappear.

Trigger actions are defined by the PopupTrigger enumeration, which in previous versions used to offer only a few options:

export enum PopupTrigger {  
     /** No triggers; popups must be shown and hidden using code. */  
     None = 0,  
     /** Show or hide the popup when the owner element is clicked. */  
     Click = 1,  
     /** Hide the popup when it loses focus. */  
     Blur = 2,  
     /** Show or hide the popup when the owner element is clicked,  
         hide when it loses focus. */  
     ClickOrBlur = Click | Blur  
 }

Some customers asked us to add more triggers, including mouse enter and mouse leave, as well as more specific ones that target only the Popup or the only the popup's owner element.

We love the Popup control and thought this was a great way to make it more flexible and powerful, so we expanded the PopupTrigger enumeration quite a bit:

export enum PopupTrigger {  
     /** No triggers; popups must be shown and hidden using code. */  
     None = 0,  
     /** When the user clicks the owner element. */  
     ClickOwner = 1,  
     /** When the user clicks the popup. */  
     ClickPopup = 2,  
     /** When the user clicks the owner element or the popup. */  
     Click = ClickOwner | ClickPopup,  
     /** When the owner element loses focus. */  
     BlurOwner = 4,  
     /** When the popup loses focus. */  
     BlurPopup = 8,  
     /** When the owner element or the popup lose focus. */  
     Blur = BlurOwner | BlurPopup,  
     /** When the owner element or the popup are clicked or lose focus. */  
     ClickOrBlur = Click | Blur,  
     /** When the mouse button is pressed over the owner element. */  
     DownOwner = 16,  
     /** When the mouse button is pressed over the popup. */  
     DownPopup = 32,  
     /** When the mouse button is pressed over the owner element or the popup. */  
     Down = DownOwner | DownPopup,  
     /** When the mouse enters the owner element. */  
     EnterOwner = 64,  
     /** When the mouse enters the popup. */  
     EnterPopup = 128,  
     /** When the mouse enters the owner element or the popup. */  
     Enter = EnterOwner | EnterPopup,  
     /** When the mouse leaves the owner element. */  
     LeaveOwner = 256,  
     /** When the mouse leaves the popup. */  
     LeavePopup = 512,  
     /** When the mouse leaves the owner element or the popup. */  
     Leave = LeaveOwner | LeavePopup  
 }

The expanded enum offers more choices and specificity, so developers have more control over their popups (without having to write any code to get it).

If you don't need the extra settings, there's no need to change your code at all, since the original values are still valid and have the same behavior as before.

Read the full Wijmo 2020 v1 release.

If you have something interesting that you want to bring to our attention, we would love to hear it!