fix(dropdown): remove extra uib-keyboard-nav

Closes #4891

BREAKING CHANGE: `keyboard-nav` for the dropdown is not longer a directive and to use it you have to use `keyboard-nav` instead of `uib-keyboard-nav`.

Author: Foxandxss

Diff for: src/dropdown/docs/demo.html

@@ -73,7 +73,7 @@
 
     <hr>
     <!-- Single button with keyboard nav -->
-    <div class="btn-group" uib-dropdown uib-keyboard-nav>
+    <div class="btn-group" uib-dropdown keyboard-nav>
         <button id="simple-btn-keyboard-nav" type="button" class="btn btn-primary" uib-dropdown-toggle>
             Dropdown with keyboard navigation <span class="caret"></span>
         </button>
@@ -92,7 +92,7 @@ <h4>append-to vs. append-to-body vs. inline example</h4>
     <div id="dropdown-scrollable-container" style="height: 15em; overflow: auto;">
       <div id="dropdown-long-content">
         <div id="dropdown-hidden-container">
-          <div class="btn-group" uib-dropdown dropdown-append-to="appendToEl">
+          <div class="btn-group" uib-dropdown keyboard-nav dropdown-append-to="appendToEl">
             <button id="btn-append-to" type="button" class="btn btn-primary" uib-dropdown-toggle>
               Dropdown in Container <span class="caret"></span>
             </button>

Diff for: src/dropdown/dropdown.js

@@ -101,7 +101,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
     }
 
     appendToBody = angular.isDefined($attrs.dropdownAppendToBody);
-    keynavEnabled = angular.isDefined($attrs.uibKeyboardNav);
+    keynavEnabled = angular.isDefined($attrs.keyboardNav);
 
     if (appendToBody && !appendTo) {
       appendTo = body;
@@ -298,45 +298,6 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
   };
 })
 
-.directive('uibKeyboardNav', function() {
-  return {
-    restrict: 'A',
-    require: '?^uibDropdown',
-    link: function(scope, element, attrs, dropdownCtrl) {
-      element.bind('keydown', function(e) {
-        if ([38, 40].indexOf(e.which) !== -1) {
-          e.preventDefault();
-          e.stopPropagation();
-
-          var elems = dropdownCtrl.dropdownMenu.find('a');
-
-          switch (e.which) {
-            case 40: { // Down
-              if (!angular.isNumber(dropdownCtrl.selectedOption)) {
-                dropdownCtrl.selectedOption = 0;
-              } else {
-                dropdownCtrl.selectedOption = dropdownCtrl.selectedOption === elems.length - 1 ?
-                  dropdownCtrl.selectedOption : dropdownCtrl.selectedOption + 1;
-              }
-              break;
-            }
-            case 38: { // Up
-              if (!angular.isNumber(dropdownCtrl.selectedOption)) {
-                dropdownCtrl.selectedOption = elems.length - 1;
-              } else {
-                dropdownCtrl.selectedOption = dropdownCtrl.selectedOption === 0 ?
-                  0 : dropdownCtrl.selectedOption - 1;
-              }
-              break;
-            }
-          }
-          elems[dropdownCtrl.selectedOption].focus();
-        }
-      });
-    }
-  };
-})
-
 .directive('uibDropdownToggle', function() {
   return {
     require: '?^uibDropdown',

Diff for: src/dropdown/test/dropdown.spec.js

@@ -547,7 +547,7 @@ describe('dropdownToggle', function() {
 
   describe('`keyboard-nav` option', function() {
     function dropdown() {
-      return $compile('<li uib-dropdown uib-keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
+      return $compile('<li uib-dropdown keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
     }
     beforeEach(function() {
       element = dropdown();
@@ -586,7 +586,7 @@ describe('dropdownToggle', function() {
 
   describe('`keyboard-nav` option', function() {
     function dropdown() {
-      return $compile('<li uib-dropdown uib-keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
+      return $compile('<li uib-dropdown keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
     }
     beforeEach(function() {
       element = dropdown();
@@ -699,7 +699,7 @@ describe('dropdownToggle', function() {
 
   describe('`keyboard-nav` option with `dropdown-append-to-body` option', function() {
     function dropdown() {
-      return $compile('<li uib-dropdown dropdown-append-to-body uib-keyboard-nav><a href uib-dropdown-toggle></a><ul class="uib-dropdown-menu" id="dropdown-menu"><li><a href>Hello On Body</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
+      return $compile('<li uib-dropdown dropdown-append-to-body keyboard-nav><a href uib-dropdown-toggle></a><ul class="uib-dropdown-menu" id="dropdown-menu"><li><a href>Hello On Body</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
     }
 
     beforeEach(function() {
@@ -709,7 +709,7 @@ describe('dropdownToggle', function() {
     it('should focus first list element when down arrow pressed', function() {
       clickDropdownToggle();
 
-      triggerKeyDown(element, 40);
+      triggerKeyDown($document, 40);
 
       var dropdownMenu = $document.find('#dropdown-menu');
 
@@ -720,8 +720,8 @@ describe('dropdownToggle', function() {
 
     it('should focus second list element when down arrow pressed twice', function() {
       clickDropdownToggle();
-      triggerKeyDown(element, 40);
-      triggerKeyDown(element, 40);
+      triggerKeyDown($document, 40);
+      triggerKeyDown($document, 40);
 
       var dropdownMenu = $document.find('#dropdown-menu');