@elemental/ui / TypeAlias

LmnDraggableRef

Generic types:DRAGGABLE_DATA DROP_AREA_DATA

A reference to a draggable element.

Presentation

type LmnDraggableRef = {
  id: string;
  /** Data passed through all the drag and drop events. */
  data?: DRAGGABLE_DATA;
  /** The DOM element of the draggable, still in its position on the dom. */
  element: HTMLElement;
  dragArea?: LmnDragAreaRef<DRAGGABLE_DATA, DROP_AREA_DATA>;
  previewElement: HTMLElement;
  placeholderElement: HTMLElement;
  /** The draggable is disabled. */
  disabled: boolean;
  /** The possible restrictions on drop area accepted by the draggable. */
  restrictions?:
    | string
    | string[]
    | LmnDropAreaDirective<DRAGGABLE_DATA, DROP_AREA_DATA>
    | Array<LmnDropAreaDirective<DRAGGABLE_DATA, DROP_AREA_DATA>>;
  onDragStart: (
    event: LmnDragStartEvent<DRAGGABLE_DATA, DROP_AREA_DATA>,
  ) => void;
  onDragEnd: (event: LmnDragEndEvent<DRAGGABLE_DATA, DROP_AREA_DATA>) => void;
  onDragOver: (event: LmnDragOverEvent<DRAGGABLE_DATA, DROP_AREA_DATA>) => void;
  onDragEnter: (
    event: LmnDragEnterEvent<DRAGGABLE_DATA, DROP_AREA_DATA>,
  ) => void;
  onDragLeave: (
    event: LmnDragLeaveEvent<DRAGGABLE_DATA, DROP_AREA_DATA>,
  ) => void;
  onDrop: (event: LmnDropEvent<DRAGGABLE_DATA, DROP_AREA_DATA>) => void;
};