const popup = window.e.utils.createPopup(
openerElement, // HTMLElement to attach the popup to
contentElement, // HTMLElement that is the content of the popup
{
placement: 'bottom', // Where to try to open content in relation to opener
arrow: true, // Toggles arrow rendering
offset: 12, // Determines distance between reference and content
noPadding: false, // Disables padding on popup
closeOnOutsideClick: true, // Closes on clicking anywhere but on the content
closeOnEscPress: true, // Closes by pressing ESC key
autoClose: false, // Automatically closes the popup after a timeout
elementToFocusOnOpen: null, // Determines to which HTMLElement should be in focus after open
elementToFocusOnClose: opener, // Determines to which HTMLElement should be in focus after close
loopFocus: false, // Makes focus to jump back to the start instead of closing the popup
matchOpenerWidth: false, // Sets the width of contentElement to the same as openerElement dynamically
type: '', // Sets the type of the popup (info, warning, success, error)
onBeforeOpen: (opener, content) => {}, // Function to run before internal open logic
onAfterOpen: (opener, content) => {}, // Function to run after internal open logic
onBeforeClose: (opener, content) => {}, // Function to run before internal close logic
onAfterClose: (opener, content) => {}, // Function to run after internal close logic
onOutsideClickClose: (opener, content) => {}, // Function to run after the popup was closed by clicking outside
onEscPressClose: (opener, content) => {}, // Function to run after the popup was closed by an escape press
onFocusOutForward: (opener, content) => {}, // Function to run if the popup is closed by forward tabbing
onFocusOutBackward: (opener, content) => {} // Function to run if the popup is closed by backward tabbing
}
);
popup.open({ preventAutoFocus: false }); // Shows the popup
popup.close({ preventAutoFocus: false }); // Hides the popup
popup.toggle({ preventAutoFocus: false }); // Hide if shown and show if hidden