From d189b12a6a463089855471ee3d5014ac7882e9ad Mon Sep 17 00:00:00 2001
From: Isaac Mann <isaacplmann@gmail.com>
Date: Fri, 30 Jun 2017 15:50:56 -0400
Subject: [PATCH] fix(hotkey): Hotkeys only active when context menu focused

---
 CHANGELOG.md                            |  9 +++++++++
 README.md                               |  2 +-
 package.json                            |  2 +-
 src/lib/contextMenuContent.component.ts | 14 +++++++++-----
 4 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 45ac236..88b35fe 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,12 @@
+<a name="1.3.2"></a>
+# [1.3.2](https://github.com/isaacplmann/ngx-contextmenu) (2017-06-30)
+
+
+### Fixes
+
+* **hotkey:** Hotkeys only active when context menu focused
+
+
 <a name="1.3.1"></a>
 # [1.3.1](https://github.com/isaacplmann/ngx-contextmenu) (2017-06-29)
 
diff --git a/README.md b/README.md
index 12a6e63..10f92f6 100644
--- a/README.md
+++ b/README.md
@@ -292,7 +292,7 @@ export class AppModule {}
 
 ## Keyboard navigation
 
-You can use the keyboard to manipulate the context menu.
+You can use the keyboard to manipulate the context menu.  Note: Keyboard navigation should be used in conjunction with `autoFocus`, since key events are only captured when the context menu is focused.
 
 | Key            | Action                                         |
 |:--------------:|------------------------------------------------|
diff --git a/package.json b/package.json
index 6fc95a3..0fbd80b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ngx-contextmenu",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "An Angular component to show a context menu on an arbitrary component",
   "keywords": [
     "angular2",
diff --git a/src/lib/contextMenuContent.component.ts b/src/lib/contextMenuContent.component.ts
index dcfee93..652a600 100644
--- a/src/lib/contextMenuContent.component.ts
+++ b/src/lib/contextMenuContent.component.ts
@@ -224,13 +224,14 @@ export class ContextMenuContentComponent implements OnInit, OnDestroy, AfterView
     this.changeDetector.markForCheck();
   }
 
-  @HostListener('window:keydown.ArrowDown', ['$event'])
+  @HostListener('keydown.ArrowDown', ['$event'])
   public nextItem(event?: KeyboardEvent): void {
     if (!this._contextMenuService.isLeafMenu(this)) {
       return;
     }
     if (event) {
       event.preventDefault();
+      event.stopPropagation();
     }
     if (this.activeMenuItemIndex === this.menuItems.length - 1) {
       this.activeMenuItemIndex = 0;
@@ -243,13 +244,14 @@ export class ContextMenuContentComponent implements OnInit, OnDestroy, AfterView
     }
   }
 
-  @HostListener('window:keydown.ArrowUp', ['$event'])
+  @HostListener('keydown.ArrowUp', ['$event'])
   public prevItem(event?: KeyboardEvent): void {
     if (!this._contextMenuService.isLeafMenu(this)) {
       return;
     }
     if (event) {
       event.preventDefault();
+      event.stopPropagation();
     }
     if (this.activeMenuItemIndex <= 0) {
       this.activeMenuItemIndex = this.menuItems.length - 1;
@@ -262,13 +264,14 @@ export class ContextMenuContentComponent implements OnInit, OnDestroy, AfterView
     }
   }
 
-  @HostListener('window:keydown.ArrowRight', ['$event'])
+  @HostListener('keydown.ArrowRight', ['$event'])
   public keyboardOpenSubMenu(event?: KeyboardEvent): void {
     if (!this._contextMenuService.isLeafMenu(this)) {
       return;
     }
     if (event) {
       event.preventDefault();
+      event.stopPropagation();
     }
     if (this.activeMenuItemIndex >= 0) {
       const menuItem = this.menuItems[this.activeMenuItemIndex];
@@ -277,14 +280,15 @@ export class ContextMenuContentComponent implements OnInit, OnDestroy, AfterView
     }
   }
 
-  @HostListener('window:keydown.Enter', ['$event'])
-  @HostListener('window:keydown.Space', ['$event'])
+  @HostListener('keydown.Enter', ['$event'])
+  @HostListener('keydown.Space', ['$event'])
   public keyboardMenuItemSelect(event?: KeyboardEvent): void {
     if (!this._contextMenuService.isLeafMenu(this)) {
       return;
     }
     if (event) {
       event.preventDefault();
+      event.stopPropagation();
     }
     if (this.activeMenuItemIndex >= 0) {
       const menuItem = this.menuItems[this.activeMenuItemIndex];