feat(Dropdown): add a11y prop to tab moves focus (#1600)

This adds a new a11y prop to Dropdrop, defaults to true.
When the a11y prop is explicitly set to false:
This changes the way tab works within the Dropdown.
tab/shift-tab will move focus to the next logic item:
tab will move down until the end. Then, at the end of the menu it will focus the next focusable item on the page and close the menu.
shift-tab will move up until the start. Thenm, at the beginning of the menu it will focus the toggle and close the menu.

Fixes #1441

docs/lib/Components/DropdownsPage.js

@@ -57,6 +57,7 @@ export default class DropdownPage extends React.Component {
         <pre>
           <PrismCode className="language-jsx">
 {`Dropdown.propTypes = {
+  a11y: PropTypes.bool, // defaults to true. Set to false to enable more bootstrap like tabbing behavior
   disabled: PropTypes.bool,
   direction: PropTypes.oneOf(['up', 'down', 'left', 'right']),
   group: PropTypes.bool,

src/Dropdown.js

@@ -9,6 +9,7 @@ import { DropdownContext } from './DropdownContext';
 import { mapToCssModules, omit, keyCodes, tagPropType } from './utils';
 
 const propTypes = {
+  a11y: PropTypes.bool,
   disabled: PropTypes.bool,
   direction: PropTypes.oneOf(['up', 'down', 'left', 'right']),
   group: PropTypes.bool,
@@ -27,6 +28,7 @@ const propTypes = {
 };
 
 const defaultProps = {
+  a11y: true,
   isOpen: false,
   direction: 'down',
   nav: false,
@@ -114,7 +116,7 @@ class Dropdown extends React.Component {
   handleKeyDown(e) {
     if (
       /input|textarea/i.test(e.target.tagName)
-      || (keyCodes.tab === e.which && e.target.getAttribute('role') !== 'menuitem')
+      || (keyCodes.tab === e.which && (e.target.getAttribute('role') !== 'menuitem' || !this.props.a11y))
     ) {
       return;
     }