import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { keyResponder, onKey } from 'ember-keyboard';

@keyResponder({ activated: true })
export default class extends Component {
  @tracked keyboardActivated = true;
  @tracked keyDown = false;
  @tracked keyDownWithMods = false;
  @tracked keyPress = false;
  @tracked keyUp = false;

  @onKey('KeyA', { event: 'keydown' })
  toggleKeyDown = () => (this.keyDown = !this.keyDown);

  @onKey('KeyA+cmd+shift', { event: 'keydown' })
  toggleKeyDownWithMods = () => (this.keyDownWithMods = !this.keyDownWithMods);

  @onKey('KeyA', { event: 'keypress' })
  toggleKeyPress = () => (this.keyPress = !this.keyPress);

  @onKey('KeyA', { event: 'keyup' })
  toggleKeyUp = () => (this.keyUp = !this.keyUp);
}

@@ -46,23 +46,19 @@
 mport %7B 
-tracked
+set
  %7D from 
@@ -63,24 +63,20 @@
 m '@
-glimmer/tracking
+ember/object
 ';%0Ai
@@ -129,16 +129,92 @@
 oard';%0A%0A
+// Use set(this) instead of tracked properties for Ember 3.8 compatibility.%0A
 @keyResp
@@ -283,25 +283,16 @@
 ent %7B%0A  
-@tracked 
 keyboard
@@ -307,33 +307,24 @@
 d = true;%0A  
-@tracked 
 keyDown = fa
@@ -330,25 +330,16 @@
 alse;%0A  
-@tracked 
 keyDownW
@@ -357,25 +357,16 @@
 alse;%0A  
-@tracked 
 keyPress
@@ -381,17 +381,8 @@
 ;%0A  
-@tracked 
 keyU
@@ -460,23 +460,28 @@
  =%3E 
+set
 (this
-.
+, '
 keyDown
- =
+',
  !th
@@ -574,23 +574,32 @@
  = () =%3E
- 
+%0A    set
 (this
-.
+, '
 keyDownW
@@ -605,18 +605,18 @@
 WithMods
- =
+',
  !this.k
@@ -702,22 +702,27 @@
  =%3E 
+set
 (this
-.
+, '
 keyPress
  = !
@@ -717,18 +717,18 @@
 keyPress
- =
+',
  !this.k
@@ -801,21 +801,26 @@
  =%3E 
+set
 (this
-.
+, '
 keyUp
- =
+',
  !th

Make TriggerEventWidgetComponent compatible with Ember 3.8