Merge pull request #28 from zestia/12-1-4

12 1 4

.eslintignore

@@ -3,6 +3,7 @@
 /vendor/
 
 # compiled output
+/declarations/
 /dist/
 /tmp/
 

.github/workflows/ci.yml

@@ -57,8 +57,8 @@ jobs:
       fail-fast: false
       matrix:
         try-scenario:
-          - ember-lts-4.8
           - ember-lts-4.12
+          - ember-lts-5.4
           - ember-release
           - ember-beta
           - ember-canary

.npmignore

@@ -28,6 +28,8 @@
 /ember-cli-build.js
 /testem.js
 /tests/
+/tsconfig.declarations.json
+/tsconfig.json
 /yarn-error.log
 /yarn.lock
 .gitkeep

CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+## 12.1.4
+
+- Run ember-cli-update
+- Upgrade dependencies
+
 ## 12.1.3
 
 - Run ember-cli-update

addon/components/dragula-container.gjs

@@ -0,0 +1,15 @@
+import Component from '@glimmer/component';
+import { modifier } from 'ember-modifier';
+
+export default class DragulaContainer extends Component {
+  lifecycle = modifier((element) => {
+    this.args.onInsert(element);
+    return () => this.args.onDestroy(element);
+  });
+
+  <template>
+    <div class="dragula__container" {{this.lifecycle}} ...attributes>
+      {{yield}}
+    </div>
+  </template>
+}

addon/components/dragula.js → addon/components/dragula.gjs

@@ -5,7 +5,7 @@ import { action } from '@ember/object';
 
 const { keys } = Object;
 
-const events = {
+export const events = {
   drag: 'onDrag',
   dragend: 'onDragEnd',
   drop: 'onDrop',
@@ -18,19 +18,13 @@ const events = {
 };
 
 export default class Dragula extends Component {
-  static events = events;
-
   drake;
 
-  DragulaContainer = DragulaContainer;
-
   constructor() {
     super(...arguments);
 
     this.drake = dragula({ ...this.args.options });
-
     this._setupHandlers();
-
     this.args.onReady?.(this.drake);
   }
 
@@ -58,4 +52,19 @@ export default class Dragula extends Component {
       }
     });
   }
+
+  <template>
+    <div class="dragula" ...attributes {{this.dragula}}>
+      {{#let
+        (component
+          DragulaContainer
+          onInsert=this.addContainer
+          onDestroy=this.removeContainer
+        )
+        as |Container|
+      }}
+        {{yield Container}}
+      {{/let}}
+    </div>
+  </template>
 }