Skip to main content

Popup

shadow

The wje-popup page was auto-generated to keep API documentation coverage in sync with the current component set. Detailed usage and best-practice guidance will be expanded in the next content phase.

When to use

Use wje-popup to communicate status, result of actions, or required next steps immediately.

When not to use

Do not show multiple feedback channels for the same event unless there is a strong reason.

Accessibility

Announce status updates with suitable ARIA live regions and manage focus for modal interactions.

Best Practices

  • Match message severity (info/success/warning/error) to actual user impact.
  • Use confirmations only for destructive or hard-to-reverse actions.
  • Keep timeouts consistent so users have enough time to read messages.

Attributes and Properties

loader

DescriptionControls whether loader is enabled and affects component behavior.
Attributeloader
Typeboolean
Defaultfalse

manual

DescriptionControls whether manual is enabled and affects component behavior.
Attributemanual
Typeboolean
Defaultfalse

portal

DescriptionSets or removes the 'portal' attribute on the element based on the provided value. If the value is truthy, the 'portal' attribute will be added. If the value is falsy, the 'portal' attribute will be removed.
Attributeportal
Typeboolean
Defaultfalse

Events

NameDescription
wje-portal:restoredEmitted when the wje-portal:restored event is dispatched.
wje-popup:repositionEvent fired when the popup is repositioned.
wje-popup:showEvent fired when the popup is shown.
wje-popup:hideEvent fired when the popup is hidden.
wje-popup:beforeshowEmitted when the wje-popup:beforeshow event is dispatched.
wje-popup:aftershowEmitted when the wje-popup:aftershow event is dispatched.
wje-router:rebindEmitted when the wje-router:rebind event is dispatched.
wje-popup:openedEmitted when the component opens.

Methods

setAnchor

DescriptionSets the anchor for the popup. Adds a click event listener to the anchor element.
Signature() => void

show

DescriptionDisplays the popup by portaling the content, managing the loader state, and attaching event handlers. Optionally dispatches a custom event when the popup is shown.
Signature(dispatchEvent?: boolean) => void

hide

DescriptionHides the popup. Removes the popup-active class from the floating element. Cleans up the auto update for repositioning.
Signature(dispatchEvent: any) => void

CSS Shadow Parts

NameDescription
nativeThe native part of the popup.

CSS Custom Properties

No CSS custom properties available for this component.

Slots

NameDescription
anchorThe slot for the anchor of the popup.
arrowThe slot for the arrow of the popup.
defaultThe default slot for the popup.