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

DragAction

This a decorator which adds draggable functionality to elements. To define draggable actions on specific elements, handles can be used. A handle is given a special attribute :

  • coral-dragaction attribute adds draggable functionality to the corresponding element.
  • coral-dragaction-handle attribute allows dragging only by dragging the specified handle.
  • coral-dragaction-dropzone attribute is used to indicate possible dropzones making it possible to build drag-and-drop enabled interfaces in conjunction with DragAction events.
  • coral-dragaction-axis and setting it to either horizontal or vertical, it is possible to restrict the drag'n'drop to a single axis.
  • coral-dragaction-scroll attribute will scroll the container when the draggable is moved beyond the viewport.
  • coral-dragaction-containment, the draggable element will be constrained to its container.

See:

Example:

JS constructor
new Coral.DragAction();

Static Member Summary

Static Public Members
public static

Returns DragAction axis restrictions.

Constructor Summary

Public Constructor
public

constructor(dragElement: HTMLElement)

Takes the {HTMLElement} to be dragged as argument.

Member Summary

Public Members
public

The axis to constrain drag movement.

public

Whether to constrain the draggable element to its container viewport.

public

The draggable element.

public

The dropZone to drop the dragged element.

public

The handle allowing to drag the element.

public

Whether to scroll the container when the draggable element is moved beyond the viewport.

Method Summary

Public Methods
public

destroy(restorePosition: Boolean)

Remove draggable actions

Static Public Members

public static axis: DragActionAxisEnum: * source

Returns DragAction axis restrictions.

Public Constructors

public constructor(dragElement: HTMLElement) source

Takes the {HTMLElement} to be dragged as argument.

Params:

NameTypeAttributeDescription
dragElement HTMLElement

Public Members

public axis: String source

The axis to constrain drag movement. See DragActionAxisEnum.

  • DragActionAxisEnum.FREE by default.

public containment: Boolean source

Whether to constrain the draggable element to its container viewport.

  • false by default.

public dragElement: String | HTMLElement source

The draggable element.

  • read-only

public dropZone: String | HTMLElement source

The dropZone to drop the dragged element.

public handle: String | HTMLElement source

The handle allowing to drag the element.

public scroll: Boolean source

Whether to scroll the container when the draggable element is moved beyond the viewport.

  • false by default.

Public Methods

public destroy(restorePosition: Boolean) source

Remove draggable actions

Params:

NameTypeAttributeDescription
restorePosition Boolean

Whether to restore the draggable element to its initial position