Reference Source
import {CoachMark} from '@adobe/coral-spectrum'
public class | source

CoachMark

Expression Extends:

class CoachMark extends BaseComponent(HTMLElement)

Mixin Extends:

HTMLElement, BaseComponent

A coach mark component to highlight UI elements on the page.

See:

Example:

Markup
<coral-coachmark></coral-coachmark>
JS constructor
new Coral.CoachMark();

Static Member Summary

Static Public Members
public static

Returns CoachMark sizes options.

public static

Returns CoachMark variant options.

Member Summary

Public Members
public

The coach mark size.

public

The element the coach mark should position relative to.

public

The coach mark variant.

Static Public Members

public static size: CoachMarkSizeEnum: * source

Returns CoachMark sizes options.

public static variant: CoachMarkVariantEnum: * source

Returns CoachMark variant options.

Public Members

public size: String source

The coach mark size. See CoachMarkSizeEnum.

  • CoachMarkSizeEnum.MEDIUM by default.
  • reflected

public target: HTMLElement | String source

The element the coach mark 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 variant: String source

The coach mark variant. See CoachMarkVariantEnum.

  • CoachMarkVariantEnum.DEFAULT by default.
  • reflected