diff --git a/src/app/example-mention-dropdown/example-mention-dropdown.component.html b/src/app/example-mention-dropdown/example-mention-dropdown.component.html
index 0ecd0e2..9407799 100644
--- a/src/app/example-mention-dropdown/example-mention-dropdown.component.html
+++ b/src/app/example-mention-dropdown/example-mention-dropdown.component.html
@@ -1,3 +1,3 @@
 <ul>
-  <li *ngFor="let repos of filteredList; let i = index" [class.active]="i === selected" class="repos" (click)="changeValue(repos)">{{repos.name}}</li>
+  <li tabindex="0" *ngFor="let repos of filteredList; let i = index" [class.active]="i === selected" class="repos" (click)="changeValue(repos)" (keyup.enter)="changeValue(repos)">{{repos.name}}</li>
 </ul>
diff --git a/src/app/example-mention-dropdown/example-mention-dropdown.component.ts b/src/app/example-mention-dropdown/example-mention-dropdown.component.ts
index 13bf24a..933f60c 100644
--- a/src/app/example-mention-dropdown/example-mention-dropdown.component.ts
+++ b/src/app/example-mention-dropdown/example-mention-dropdown.component.ts
@@ -54,7 +54,7 @@ export class ExampleMentionDropdownComponent implements FateDropdown {
   public filteredList: Array<any>;
   private filterList() {
     this.filteredList = [];
-    const criteria = this._value.substr(1);
+    const criteria = this._value?.substr(1) || '';
     for (const repos of this.reposList) {
       if (repos.name.toLowerCase().indexOf(criteria.toLowerCase()) > -1) {
         this.filteredList.push(repos);
diff --git a/src/app/fate-ui/fate-ui.component.html b/src/app/fate-ui/fate-ui.component.html
index c750bb5..335e89d 100644
--- a/src/app/fate-ui/fate-ui.component.html
+++ b/src/app/fate-ui/fate-ui.component.html
@@ -1,6 +1,6 @@
 <div>
   <ng-container *ngFor="let button of buttons">
-    <a *ngIf="button !== 'separator'" tabindex="0" class="fate-ui-button" [name]="button" [ngClass]="{enabled: enabled[button], 'with-dropdown': dropdownAction === button}" (click)="do($event, button)">
+    <a *ngIf="button !== 'separator'" tabindex="0" class="fate-ui-button" [title]="button" [name]="button" [ngClass]="{enabled: enabled[button], 'with-dropdown': dropdownAction === button}" (click)="do($event, button)">
       <span *ngIf="icon.getIcon(button)" [innerHtml]="icon.getIcon(button)"></span>
       <span *ngIf="!icon.getIcon(button)">{{controller.getAction(button).label}}</span>
       <span class="reader">{{controller.getAction(button).name}}</span>
diff --git a/src/app/fate-ui/fate-ui.component.scss b/src/app/fate-ui/fate-ui.component.scss
index 2060bbe..7f6819c 100644
--- a/src/app/fate-ui/fate-ui.component.scss
+++ b/src/app/fate-ui/fate-ui.component.scss
@@ -53,8 +53,7 @@ $font-size: 14px;
   }
 }
 .fate-ui-dropdown {
-  opacity: 0;
-  pointer-events: none;
+  display: none;
   z-index: 1;
   font-size: 14px;
   user-select: all;
@@ -69,7 +68,6 @@ $font-size: 14px;
   box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.3);
 
   &.visible {
-    opacity: 1;
-    pointer-events: all;
+    display: block;
   }
 }
diff --git a/src/app/fate-ui/fate-ui.component.ts b/src/app/fate-ui/fate-ui.component.ts
index 85561d3..89764aa 100644
--- a/src/app/fate-ui/fate-ui.component.ts
+++ b/src/app/fate-ui/fate-ui.component.ts
@@ -77,6 +77,8 @@ export class FateUiComponent implements OnChanges, AfterViewInit {
       if (name) {
         this.do(event, name);
       }
+    } else if (event.key === 'Escape') {
+      this.dropdownAction = false;
     }
   }