import {Overlay} from '@adobe/coral-spectrum'

public class | source

ExtensibleOverlay

Expression Extends:

class ExtensibleOverlay extends BaseOverlay(BaseComponent(HTMLElement))

Mixin Extends:

HTMLElement, BaseComponent, BaseOverlay

A generic Overlay component.

See:

../examples/#overlay

Example:

Markup

<coral-overlay></coral-overlay>

JS constructor

new Coral.Overlay();

Static Member Summary

Static Public Members
public static	align: OverlayAlignEnum: * this member was deprecated. Returns {@link Overlay} align options.
public static	collision: OverlayCollisionEnum: * Returns Overlay collision options.
public static	interaction: OverlayInteractionEnum: * Returns Overlay interaction options.
public static	placement: OverlayPlacementEnum: * Returns Overlay placement options.
public static	target: OverlayTargetEnum: * Returns Overlay target options.

Member Summary

Public Members
public	alignAt: String this member was deprecated. The point on the target we should anchor to when positioning.
public	alignMy: String this member was deprecated. The point on the overlay we should anchor from when positioning.
public	breadthOffset: String The distance the overlay should be from its target along the breadth axis.
public	collision: String The collision handling strategy when positioning the overlay relative to a target.
public	inner: Boolean Whether the overlay flows toward the inner of the target element.
public	interaction: String Whether keyboard interaction is enabled.
public	lengthOffset: String The distance the overlay should be from its target along the length axis.
public	offset: Number The distance the overlay should be from its target.
public	open: * Inherited from BaseOverlay#open.
public	placement: String The placement of the overlay.
public	smart: Boolean Whether the overlay is allowed to change its DOM position for better positioning based on its context.
public	target: HTMLElement \| String The element the overlay should position relative to.
public	within: HTMLElement \| String The bounding element for the overlay.
public	withinOffset: Number Amount of pixel used to define a minimum distance between the boundaries and the overlay.

Method Summary

Public Methods
public	reposition(forceReposition: Boolean) Re-position the overlay if it's currently open.

Static Public Members

public static align: OverlayAlignEnum: * source

this member was deprecated. Returns {@link Overlay} align options.

Return:

OverlayAlignEnum

public static collision: OverlayCollisionEnum: * source

Returns Overlay collision options.

Return:

OverlayCollisionEnum

public static interaction: OverlayInteractionEnum: * source

Returns Overlay interaction options.

Return:

OverlayInteractionEnum

public static placement: OverlayPlacementEnum: * source

Returns Overlay placement options.

Return:

OverlayPlacementEnum

public static target: OverlayTargetEnum: * source

Returns Overlay target options.

Return:

OverlayTargetEnum

Public Members

public alignAt: String source

this member was deprecated.

The point on the target we should anchor to when positioning. See OverlayAlignEnum.

Coral.Overlay.align.CENTER_CENTER by default.

public alignMy: String source

this member was deprecated.

The point on the overlay we should anchor from when positioning. See OverlayAlignEnum.

OverlayAlignEnum.CENTER_CENTER by default.

public breadthOffset: String source

The distance the overlay should be from its target along the breadth axis.

'0px' by default.

public collision: String source

The collision handling strategy when positioning the overlay relative to a target. See OverlayCollisionEnum.

OverlayCollisionEnum.FLIP by default.

public inner: Boolean source

Whether the overlay flows toward the inner of the target element. By default, it's placed outside the target element.

false by default.

public interaction: String source

Whether keyboard interaction is enabled. See OverlayInteractionEnum.

OverlayInteractionEnum.ON by default.

public lengthOffset: String source

The distance the overlay should be from its target along the length axis.

'0px' by default.

public offset: Number source

The distance the overlay should be from its target.

0 by default.

public open: * source

Inherited from BaseOverlay#open.

public placement: String source

The placement of the overlay. See OverlayPlacementEnum.

OverlayPlacementEnum.RIGHT by default.

public smart: Boolean source

Whether the overlay is allowed to change its DOM position for better positioning based on its context.

false by default.

public target: HTMLElement | String source

The element the overlay should position relative to. It accepts values from OverlayTargetEnum, as well as a DOM element or a CSS selector. If a CSS selector is provided, the first matching element will be used.

null by default.

public within: HTMLElement | String source

The bounding element for the overlay. The overlay will be sized and positioned such that it is contained within this element. It accepts both a DOM Element or a CSS selector. If a CSS selector is provided, the first matching element will be used.

'scrollParent' by default.

public withinOffset: Number source

Amount of pixel used to define a minimum distance between the boundaries and the overlay. This makes sure the overlay always has a little padding between the edges of its container.

5 by default.

Public Methods

public reposition(forceReposition: Boolean) source

Re-position the overlay if it's currently open.

Params:

Name	Type	Attribute	Description
forceReposition	Boolean		Whether to force repositioning even if closed.