api - Aurelia Dragula カスタム要素の代わりに Api を使用する方法

Question

オーレリア・ドラグラを使おうとしています。私が見つけることができるすべての例は、カスタム要素を使用しています

<dragula-and-drop drop-fn.call="itemDropped(item, target, source, sibling)"></dragula-and-drop>

次に、このようなソース/ターゲットとして機能するdivを持っています

<div class="drag-source drop-target drop-style" data-list="things">
    <compose repeat.for="thing of things" view-model.bind="thing" data-index.bind="$index"></compose>
</div>

それはうまく機能しており、ドラッグ終了などに他の関数バインディングを追加できることがわかります。ただし、ドキュメントには、Dragula がリッスンできる一連のイベントが示されていますが、API を使用する必要があるようです。それらを利用するためのカスタム要素。ビューで上記のような div と共に Dragula オブジェクトを使用する方法を理解できないようです。例えば...

import { Dragula } from 'aurelia-dragula';
...

let dragula = new Dragula();
dragula.on('drag', (el, source) => {
      console.log('started dragging...');
    });

上記の div からのドラッグ イベントを取得しません。

私はaureliaにかなり慣れていないので、フレームワークに関連する何かが欠けているのではないでしょうか? カスタム要素の代わりに Dragula API アプローチを使用するにはどうすればよいですか?

ありがとう