From 9893850a7b3ba5979e55ad8345c996d26e20f0bb Mon Sep 17 00:00:00 2001
From: Marcos Moura <marcosvmmoura@gmail.com>
Date: Mon, 24 Oct 2016 21:26:26 -0200
Subject: [PATCH] Close content on esc

---
 src/components/mdMenu/mdMenuContent.vue | 19 ++++++++++++++++++-
 src/components/mdMenu/mdMenuItem.vue    | 14 +++++++++++++-
 2 files changed, 31 insertions(+), 2 deletions(-)

diff --git a/src/components/mdMenu/mdMenuContent.vue b/src/components/mdMenu/mdMenuContent.vue
index 4f1af63..38ceaee 100644
--- a/src/components/mdMenu/mdMenuContent.vue
+++ b/src/components/mdMenu/mdMenuContent.vue
@@ -1,5 +1,22 @@
 <template>
-  <div class="md-menu-content">
+  <div class="md-menu-content" @keydown.esc="close" tabindex="-1">
     <slot></slot>
   </div>
 </template>
+
+<script>
+  export default {
+    methods: {
+      close() {
+        this.$parent.close();
+      }
+    },
+    mounted() {
+      if (!this.$parent.$el.classList.contains('md-menu')) {
+        this.$destroy();
+
+        throw new Error('You must wrap the md-menu-content in a md-menu');
+      }
+    }
+  };
+</script>
diff --git a/src/components/mdMenu/mdMenuItem.vue b/src/components/mdMenu/mdMenuItem.vue
index 48cef02..754f3fe 100644
--- a/src/components/mdMenu/mdMenuItem.vue
+++ b/src/components/mdMenu/mdMenuItem.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="md-menu-item" v-md-ink-ripple @click="$emit('click')">
+  <div class="md-menu-item" @click="close">
     <div class="md-menu-item-content">
       <slot></slot>
     </div>
@@ -8,6 +8,18 @@
 
 <script>
   export default {
+    methods: {
+      close() {
+        this.$emit('click');
+        this.$parent.close();
+      }
+    },
+    mounted() {
+      if (!this.$parent.$el.classList.contains('md-menu-content')) {
+        this.$destroy();
 
+        throw new Error('You must wrap the md-menu-item in a md-menu-content');
+      }
+    }
   };
 </script>