@zestia/ember-dragula

An ember addon for dragula support.


Keywords
ember-addon, dragula, ember-dragula, sortable, drag-and-drop, ember
License
MIT
Install
npm install @zestia/ember-dragula@12.1.0

Documentation

@zestia/ember-dragula

Latest npm release Ember Observer

This Ember addon provides support for drag and drop using dragula

Installation

ember install @zestia/ember-dragula

Demo

https://zestia.github.io/ember-dragula

Example

<Dragula as |Container|>
  <Container>
    {{#each this.listOne as |item|}}
      {{item}}
    {{/each}}
  </Container>

  <Container>
    {{#each this.listTwo as |item|}}
      {{item}}
    {{/each}}
  </Container>
</Dragula>

Dragula

Arguments

@options

Optional. The full range of options that dragula accepts are supported, see the docs.

@onReady

Optional. The dragula instance is emitted via this action, allowing access to the drake API.

@on<Event>

Optional. The full range of events that dragula emits are supported, see the docs. These can be accessed by prefixing the event name with "on", e.g. @onDrag

Test helpers

To simulate dragging and dropping, test helpers are provided.

Example
import { simulateDragDrop } from '@zestia/ember-dragula/test-support/helpers/simulate-drag-drop';

Within a test:

const dragMe = find('.drag-me');
const dropHere = find('.drop-here');

await simulateDrag(dragMe);
await simulateDrop(dragMe, dropHere);
await simulateDragDrop(dragMe, dropHere);